From ca2d2295e954f8b50069ee5a0fcc32e80433fafd Mon Sep 17 00:00:00 2001
From: Tevin <tingquanren@163.com>
Date: Tue, 06 Apr 2021 15:40:07 +0800
Subject: [PATCH] 修复地址三级联动的问题
---
plugins/filter/CFilter.vue | 57 ++++++++++++++++++++++++++++++++++++++++++---------------
1 files changed, 42 insertions(+), 15 deletions(-)
diff --git a/plugins/filter/CFilter.vue b/plugins/filter/CFilter.vue
index 51b0e7c..84739f4 100644
--- a/plugins/filter/CFilter.vue
+++ b/plugins/filter/CFilter.vue
@@ -17,10 +17,17 @@
:value="filterRes[bar.name]"
:onChange="evt=>handleBarChange(bar.name, evt)"
/>
+ <CFilterDateRange
+ v-if="bar.type==='dateRange'"
+ type="bar"
+ :label="bar.label"
+ :value="filterRes[bar.name]"
+ :onChange="evt=>handleItemChange(bar.name, evt)"
+ />
</view>
<view
class="c-filter-more"
- :class="itemsChanged?'on':''"
+ :class="itemsFilled?'on':''"
v-if="items && items.length > 0"
@tap="evt => handleOpen()"
>
@@ -37,10 +44,11 @@
<scroll-view
class="c-filter-drawer-list"
:scrollY="true"
+ v-if="drawerDisplay"
>
<view
class="box"
- v-for="(item,index) of items"
+ v-for="(item,index) in items"
:key="index"
>
<CFilterSelect
@@ -93,11 +101,11 @@
},
props: {
// 筛选横条项目
- bar: Object,
+ bar: { type: Object, default: {} },
// 筛选展开层项目列表
- items: Array,
+ items: { type: Array, default: [] },
// 各个项目的选项列表
- selectOptions: Object,
+ selectOptions: { type: Object, default: {} },
// 筛选变化时的回调
onChange: Function,
},
@@ -105,44 +113,63 @@
return {
filterRes: {},
drawerShow: false,
+ drawerDisplay: false,
+ // 面板项有已选
+ itemsFilled: false,
+ // 本次打开是否有改变
itemsChanged: false,
};
},
methods: {
handleOpen() {
this.drawerShow = true;
+ this.$nextTick(() => {
+ setTimeout(() => {
+ this.drawerDisplay = true;
+ }, 80);
+ });
},
handleBarChange(name, value) {
this.$set(this.filterRes, name, value);
this.onChange(this.filterRes);
},
handleItemChange(name, value) {
- this.handleBarChange(name, value);
- if (value || typeof value !== 'undefined') {
- this.itemsChanged = true;
- } else {
+ this.$set(this.filterRes, name, value);
+ this.itemsChanged = true;
+ // 如果变化值不为空
+ if (typeof value !== 'undefined') {
+ this.itemsFilled = true;
+ }
+ // 为空是检查所有面板值是否为空
+ else {
let valuehas = false;
- for (let item of items) {
- if (
- this.filterRes[item.name] ||
- typeof this.filterRes[item.name] !== 'undefined'
- ) {
+ for (let item of this.items) {
+ if (typeof this.filterRes[item.name] !== 'undefined') {
valuehas = true;
break;
}
}
- this.itemsChanged = valuehas;
+ this.itemsFilled = valuehas;
}
},
handleClean() {
Object.keys(this.filterRes).forEach(key => {
this.filterRes[key] = [][0];
});
+ this.itemsFilled = false;
this.itemsChanged = false;
this.onChange(this.filterRes);
},
handleFinish() {
this.drawerShow = false;
+ this.$nextTick(() => {
+ this.drawerDisplay = false;
+ });
+ // 有项目改变时，发送变化
+ if (this.itemsChanged) {
+ this.itemsChanged = false;
+ this.onChange(this.filterRes);
+ }
},
},
};
--
Gitblit v1.9.1