|
|
@@ -21,9 +21,6 @@
|
|
|
</view>
|
|
|
|
|
|
<view class="input-wrap_box">
|
|
|
- <view class="select-dn_bx">
|
|
|
- <DateSelect ref="dateSelectRef" class="bar" top="0" @selectDateFn="selectDateFn" defaultShowName="近30天" />
|
|
|
- </view>
|
|
|
<view class="search-container">
|
|
|
<AppSearchModule ref="appSearch" placeholder="这里搜索" @input="searchFn" />
|
|
|
<view v-if="customId != 0" class="search-clear-overlay" @click.stop="clearSearch">清空</view>
|
|
|
@@ -140,6 +137,19 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
+ <!-- 原顶栏 DateSelect 并入筛选:时间类型 + 时间范围统一入口 -->
|
|
|
+ <view class="filter-section">
|
|
|
+ <view class="filter-title">时间范围</view>
|
|
|
+ <view class="filter-date-wrap">
|
|
|
+ <DateSelect
|
|
|
+ ref="dateSelectRef"
|
|
|
+ class="bar"
|
|
|
+ top="0"
|
|
|
+ @selectDateFn="selectDateFn"
|
|
|
+ :defaultShowName="dateRangeLabel"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
<view class="filter-section">
|
|
|
<view class="filter-title">片区</view>
|
|
|
<view class="filter-options">
|
|
|
@@ -266,7 +276,10 @@ export default {
|
|
|
this.filterBook !== -1 ||
|
|
|
this.searchTimeType !== 0 ||
|
|
|
this.filterShopAdminId !== 0 ||
|
|
|
- this.filterSendType !== -1
|
|
|
+ this.filterSendType !== -1 ||
|
|
|
+ this.searchTime !== 'last30Days' ||
|
|
|
+ !!this.startTime ||
|
|
|
+ !!this.endTime
|
|
|
);
|
|
|
}
|
|
|
},
|
|
|
@@ -324,6 +337,8 @@ export default {
|
|
|
searchTime: 'last30Days',
|
|
|
startTime: '',
|
|
|
endTime: '',
|
|
|
+ // 筛选面板内时间范围展示文案(v-if 重挂载时回填)
|
|
|
+ dateRangeLabel: '近30天',
|
|
|
fromDetail: { status: 1 },
|
|
|
currentInfo: {},
|
|
|
currentTitle: '',
|
|
|
@@ -587,6 +602,7 @@ export default {
|
|
|
this.searchTime = 'last30Days'
|
|
|
this.startTime = ''
|
|
|
this.endTime = ''
|
|
|
+ this.dateRangeLabel = '近30天'
|
|
|
this.resetDateSelect()
|
|
|
},
|
|
|
resetDateSelect() {
|
|
|
@@ -600,11 +616,28 @@ export default {
|
|
|
this.getOrderList();
|
|
|
},
|
|
|
selectDateFn(val) {
|
|
|
+ // 时间范围已并入筛选面板:只记参数,点「确定」再刷列表
|
|
|
this.searchTime = val.searchTime;
|
|
|
- this.startTime = val.startTime;
|
|
|
- this.endTime = val.endTime;
|
|
|
- this.resetList();
|
|
|
- this.getOrderList();
|
|
|
+ this.startTime = val.startTime || '';
|
|
|
+ this.endTime = val.endTime || '';
|
|
|
+ this.dateRangeLabel = this.resolveDateLabel(val);
|
|
|
+ },
|
|
|
+ /** 根据 DateSelect 回传参数还原展示文案 */
|
|
|
+ resolveDateLabel(val) {
|
|
|
+ if (!val) {
|
|
|
+ return '近30天';
|
|
|
+ }
|
|
|
+ if (val.searchTime === 'custom' && val.startTime) {
|
|
|
+ const s = String(val.startTime).substring(5);
|
|
|
+ const e = String(val.endTime || val.startTime).substring(5);
|
|
|
+ return s === e ? s : s + '/' + e;
|
|
|
+ }
|
|
|
+ if (val.searchTime === 'byMonth' && val.startTime) {
|
|
|
+ return val.startTime;
|
|
|
+ }
|
|
|
+ const opts = (this.getDictionariesInfo && this.getDictionariesInfo.dateDefaultOption) || [];
|
|
|
+ const hit = opts.find((o) => o.value === val.searchTime);
|
|
|
+ return hit ? hit.name : '近30天';
|
|
|
},
|
|
|
searchFn(e) {
|
|
|
let that = this;
|
|
|
@@ -735,10 +768,6 @@ page {
|
|
|
padding-top: 100upx;
|
|
|
padding-bottom: 1upx;
|
|
|
overflow: hidden;
|
|
|
- .select-dn_bx {
|
|
|
- padding-left: 10upx;
|
|
|
- padding-right: 10upx;
|
|
|
- }
|
|
|
.app-tabs {
|
|
|
position: fixed;
|
|
|
/* 手机mobile屏幕小于1000px */
|
|
|
@@ -768,11 +797,10 @@ page {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
padding: 0 10upx;
|
|
|
- & > view:nth-child(2) {
|
|
|
- flex: 1;
|
|
|
- }
|
|
|
.search-container {
|
|
|
position: relative;
|
|
|
+ flex: 1;
|
|
|
+ min-width: 0;
|
|
|
}
|
|
|
}
|
|
|
.list-wrap {
|
|
|
@@ -871,6 +899,20 @@ page {
|
|
|
font-size: 28upx;
|
|
|
font-weight: 700;
|
|
|
}
|
|
|
+/* 筛选内 DateSelect:抬高层级,避免被筛选遮罩挡住 */
|
|
|
+.filter-date-wrap {
|
|
|
+ padding: 10upx 0;
|
|
|
+ ::v-deep .select-mark-view {
|
|
|
+ z-index: 10000001 !important;
|
|
|
+ }
|
|
|
+ ::v-deep .select-fixed_bx {
|
|
|
+ z-index: 10000002 !important;
|
|
|
+ }
|
|
|
+ /* mx-datepicker 根节点 .picker,需高于筛选遮罩 9999999 */
|
|
|
+ ::v-deep .picker {
|
|
|
+ z-index: 10000003 !important;
|
|
|
+ }
|
|
|
+}
|
|
|
.filter-options {
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|