From 8f73817cd1fdbd3e3b23d76d0ce6ba65a85e8950 Mon Sep 17 00:00:00 2001 From: Tevin <tingquanren@163.com> Date: Thu, 08 Jul 2021 19:12:46 +0800 Subject: [PATCH] 实现快递单号扫描输入组件 --- plugins/filter/CFilter.vue | 31 ++++++++++++++++++++++++------- 1 files changed, 24 insertions(+), 7 deletions(-) diff --git a/plugins/filter/CFilter.vue b/plugins/filter/CFilter.vue index b02de13..80c1dac 100644 --- a/plugins/filter/CFilter.vue +++ b/plugins/filter/CFilter.vue @@ -13,7 +13,14 @@ v-if="bar.type==='select'" type="bar" :label="bar.label" - :options="selectOptions[bar.name]" + :options="selectOptions[bar.name] || []" + :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=>handleBarChange(bar.name, evt)" /> @@ -37,17 +44,18 @@ <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 v-if="item.type==='select'" type="item" :label="item.label" - :options="selectOptions[item.name]" + :options="selectOptions[item.name] || []" :value="filterRes[item.name]" :onChange="evt=>handleItemChange(item.name, evt)" /> @@ -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,6 +113,7 @@ return { filterRes: {}, drawerShow: false, + drawerDisplay: false, // 面板项有已选 itemsFilled: false, // 本次打开是否有改变 @@ -114,13 +123,17 @@ 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) { - console.log(name, value); this.$set(this.filterRes, name, value); this.itemsChanged = true; // 如果变化值不为空 @@ -149,6 +162,9 @@ }, handleFinish() { this.drawerShow = false; + this.$nextTick(() => { + this.drawerDisplay = false; + }); // 有项目改变时,发送变化 if (this.itemsChanged) { this.itemsChanged = false; @@ -156,5 +172,6 @@ } }, }, + mounted() {}, }; </script> -- Gitblit v1.9.1