mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-ui.git
synced 2025-12-21 10:25:53 +08:00
commit message
This commit is contained in:
Chopper
155
seller/src/views/lili-components/affix-time.vue
Normal file
155
seller/src/views/lili-components/affix-time.vue
Normal file
@@ -0,0 +1,155 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="breadcrumb">
|
||||
<span @click="clickBreadcrumb(item,index)" :class="{'active':item.selected}" v-for="(item,index) in dateList" :key="index"> {{item.title}}</span>
|
||||
<div class="date-picker">
|
||||
<Select @on-change="changeSelect(selectedWay)" v-model="month" placeholder="年月查询" style="width:200px;margin-left:10px;">
|
||||
<Option v-for="(item,index) in dates" :value="item.year+'-'+item.month" :key="index">{{ item.year+'年'+item.month+'月' }}</Option>
|
||||
</Select>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Cookies from "js-cookie";
|
||||
export default {
|
||||
props: ["closeShop"],
|
||||
data() {
|
||||
return {
|
||||
month: "", // 所选月份
|
||||
|
||||
defuaultWay: {
|
||||
title: "最近7天",
|
||||
selected: true,
|
||||
searchType: "LAST_SEVEN",
|
||||
},
|
||||
|
||||
selectedWay: {
|
||||
title: "最近7天",
|
||||
selected: true,
|
||||
searchType: "LAST_SEVEN",
|
||||
},
|
||||
storeId: "", // 店铺id
|
||||
dates: [], // 日期列表
|
||||
params: {
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
storeName: "",
|
||||
storeId: "",
|
||||
},
|
||||
|
||||
dateList: [
|
||||
{
|
||||
title: "今天",
|
||||
selected: false,
|
||||
searchType: "TODAY",
|
||||
},
|
||||
{
|
||||
title: "昨天",
|
||||
selected: false,
|
||||
searchType: "YESTERDAY",
|
||||
},
|
||||
{
|
||||
title: "最近7天",
|
||||
selected: true,
|
||||
searchType: "LAST_SEVEN",
|
||||
},
|
||||
{
|
||||
title: "最近30天",
|
||||
selected: false,
|
||||
searchType: "LAST_THIRTY",
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.storeId = JSON.parse(Cookies.get("userInfo")).id;
|
||||
|
||||
|
||||
this.getFiveYears();
|
||||
},
|
||||
methods: {
|
||||
// 获取近5年 年月
|
||||
getFiveYears() {
|
||||
let getYear = new Date().getFullYear();
|
||||
|
||||
let lastFiveYear = getYear - 5;
|
||||
let maxMonth = new Date().getMonth() + 1;
|
||||
let dates = [];
|
||||
// 循环出过去5年
|
||||
for (let year = lastFiveYear; year <= getYear; year++) {
|
||||
for (let month = 1; month <= 12; month++) {
|
||||
if (year == getYear && month > maxMonth) {
|
||||
} else {
|
||||
dates.push({
|
||||
year: year,
|
||||
month: month,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
this.dates = dates.reverse();
|
||||
},
|
||||
|
||||
changeSelect() {
|
||||
if (this.month) {
|
||||
this.dateList.forEach((res) => {
|
||||
res.selected = false;
|
||||
});
|
||||
this.selectedWay.year = this.month.split("-")[0];
|
||||
this.selectedWay.month = this.month.split("-")[1];
|
||||
this.selectedWay.searchType = "";
|
||||
|
||||
this.$emit("selected", this.selectedWay);
|
||||
} else {
|
||||
}
|
||||
},
|
||||
|
||||
clickBreadcrumb(item) {
|
||||
this.dateList.forEach((res) => {
|
||||
res.selected = false;
|
||||
});
|
||||
item.selected = true;
|
||||
item.storeId = this.storeId;
|
||||
this.month = "";
|
||||
|
||||
if (item.searchType == "") {
|
||||
item.searchType = "LAST_SEVEN";
|
||||
}
|
||||
|
||||
this.selectedWay = item;
|
||||
// this.month = "";
|
||||
this.selectedWay.year = new Date().getFullYear();
|
||||
this.selectedWay.month = "";
|
||||
|
||||
this.$emit("selected", this.selectedWay);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.breadcrumb {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
> span {
|
||||
margin-right: 15px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.active {
|
||||
color: $theme_color;
|
||||
position: relative;
|
||||
}
|
||||
.date-picker {
|
||||
}
|
||||
.active:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: -10px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 3px;
|
||||
background: $theme_color;
|
||||
}
|
||||
</style>
|
||||
125
seller/src/views/lili-components/multiple-region.vue
Normal file
125
seller/src/views/lili-components/multiple-region.vue
Normal file
@@ -0,0 +1,125 @@
|
||||
<template>
|
||||
<Modal :mask-closable="false" :value="switched" v-model="switched" title="选择地址" @on-ok="submit" @on-cancel="cancel">
|
||||
<div class="flex">
|
||||
<Spin size="large" fix v-if="spinShow"></Spin>
|
||||
<Tree ref="tree" class="tree" :data="data" expand-node show-checkbox multiple></Tree>
|
||||
</div>
|
||||
</Modal>
|
||||
</template>
|
||||
<script>
|
||||
import { getChildRegion, getAllCity } from "@/api/index";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
switched: false, // 控制模态框显隐
|
||||
spinShow: false, // 加载loading
|
||||
data: [], // 地区数据
|
||||
selectedWay: [], // 选择的地区
|
||||
callBackData: "", // 打开组件的回显数据
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
cancel() {
|
||||
this.switched = false;
|
||||
// this.$emit("close",true)
|
||||
},
|
||||
open(val) {
|
||||
if (val) {
|
||||
this.callBackData = val;
|
||||
this.data = JSON.parse(JSON.stringify(this.data));
|
||||
val.areaId.split(",").forEach((ids) => {
|
||||
this.data.forEach((item) => {
|
||||
if (item.id == ids) {
|
||||
item.selected = true;
|
||||
|
||||
}
|
||||
item.children &&
|
||||
item.children.forEach((child) => {
|
||||
if (child.id == ids) {
|
||||
child.checked = true;
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
this.switched = true;
|
||||
},
|
||||
|
||||
submit() {
|
||||
// 筛选出省市
|
||||
let list = this.$refs.tree.getCheckedAndIndeterminateNodes();
|
||||
let sort = [];
|
||||
list.forEach((item) => {
|
||||
item.selectedList = [];
|
||||
if (item.level == "province") {
|
||||
sort.push({
|
||||
...item,
|
||||
});
|
||||
}
|
||||
sort.forEach((sortItem, sortIndex) => {
|
||||
if (item.level != "province" && sortItem.id == item.parentId) {
|
||||
sortItem.selectedList.push({
|
||||
...item,
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
this.$emit(
|
||||
"selected",
|
||||
list.filter((item) => {
|
||||
return item.level == "province";
|
||||
})
|
||||
);
|
||||
|
||||
this.cancel();
|
||||
},
|
||||
|
||||
init() {
|
||||
getAllCity().then((res) => {
|
||||
if (res.result) {
|
||||
res.result.forEach((item) => {
|
||||
item.children.forEach((child) => {
|
||||
child.title = child.name;
|
||||
});
|
||||
|
||||
let data = {
|
||||
title: item.name,
|
||||
|
||||
...item,
|
||||
};
|
||||
this.data.push(data);
|
||||
this.selectedWay.push({ name: data.title, id: data.id });
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.flex {
|
||||
display: flex;
|
||||
position: relative;
|
||||
}
|
||||
.tree {
|
||||
flex: 2;
|
||||
}
|
||||
.form {
|
||||
flex: 8;
|
||||
}
|
||||
.button-list {
|
||||
margin-left: 80px;
|
||||
> * {
|
||||
margin: 0 4px;
|
||||
}
|
||||
}
|
||||
/deep/ .ivu-modal-body {
|
||||
height: 400px !important;
|
||||
overflow: auto;
|
||||
}
|
||||
</style>
|
||||
119
seller/src/views/lili-components/region.vue
Normal file
119
seller/src/views/lili-components/region.vue
Normal file
@@ -0,0 +1,119 @@
|
||||
<template>
|
||||
<div>
|
||||
<Cascader
|
||||
:data="data"
|
||||
:load-data="loadData"
|
||||
change-on-select
|
||||
v-model="dd"
|
||||
@on-visible-change="handleChangeOnSelect"
|
||||
@on-change="change"
|
||||
></Cascader>
|
||||
{{ dd }}
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
import * as API_Setup from "@/api/common.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
data: [], // 地区数据
|
||||
selected: [], // 已选地区
|
||||
changeOnSelect: false, // 选择时的变化
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
|
||||
props: ['addressId'],
|
||||
methods: {
|
||||
change(val, selectedData) {
|
||||
/**
|
||||
* @returns [regionId,region]
|
||||
*/
|
||||
this.$emit("selected", [
|
||||
val,
|
||||
selectedData[selectedData.length - 1].__label.split("/"),
|
||||
]);
|
||||
},
|
||||
/**
|
||||
* 动态设置change-on-select的值
|
||||
* 当级联选择器弹窗展开时，设置change-on-select为true，即可以点选菜单选项值发生变化
|
||||
* 当级联选择器弹窗关闭时，设置change-on-select为false，即能够设置初始值
|
||||
*/
|
||||
handleChangeOnSelect(value) {
|
||||
this.changeOnSelect = value;
|
||||
},
|
||||
getArea(val) {
|
||||
},
|
||||
loadData(item, callback) {
|
||||
item.loading = true;
|
||||
API_Setup.getChildRegion(item.value).then((res) => {
|
||||
if (res.result.length <= 0) {
|
||||
item.loading = false;
|
||||
this.selected = item;
|
||||
|
||||
/**
|
||||
* 处理数据并返回
|
||||
*/
|
||||
} else {
|
||||
res.result.forEach((child) => {
|
||||
item.loading = false;
|
||||
|
||||
let data = {
|
||||
value: child.id,
|
||||
label: child.name,
|
||||
loading: false,
|
||||
children: [],
|
||||
};
|
||||
|
||||
if (
|
||||
child.level == "street" ||
|
||||
item.label == "香港特别行政区" ||
|
||||
item.label == "澳门特别行政区"
|
||||
) {
|
||||
item.children.push({
|
||||
value: child.id,
|
||||
label: child.name,
|
||||
});
|
||||
} else {
|
||||
item.children.push(data);
|
||||
}
|
||||
});
|
||||
this.selected = item;
|
||||
callback();
|
||||
}
|
||||
});
|
||||
},
|
||||
init() {
|
||||
API_Setup.getChildRegion(this.id).then((res) => {
|
||||
let way = [];
|
||||
|
||||
res.result.forEach((item) => {
|
||||
let data;
|
||||
// 台湾省做处理
|
||||
if (item.name == "台湾省") {
|
||||
data = {
|
||||
value: item.id,
|
||||
label: item.name,
|
||||
};
|
||||
} else {
|
||||
data = {
|
||||
value: item.id,
|
||||
label: item.name,
|
||||
loading: false,
|
||||
children: [],
|
||||
};
|
||||
}
|
||||
way.push(data);
|
||||
});
|
||||
|
||||
this.data = way;
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
</style>
|
||||
Reference in New Issue
Block a user