新增安全承诺日期范围查询功能
water_xu
parent
1b237cca8a
commit
90ac4f66de
|
|
@ -6,6 +6,54 @@
|
|||
itemStyle="height:80upx;padding-bottom:10upx;background-color: #fff;"
|
||||
@click="tabsClick"
|
||||
></u-tabs>
|
||||
<view class="container">
|
||||
<u-sticky offset-top="200">
|
||||
<u-button type="primary" text="高级搜索" @click="popupOpen" style="height: 30px;"></u-button>
|
||||
</u-sticky>
|
||||
</view>
|
||||
<u-popup :show="popupShow" mode="right" :overlay="true" customStyle='width: 300px;' :safeAreaInsetTop="true" @close="popupClose" @open="popupOpen">
|
||||
<view>
|
||||
<u-datetime-picker
|
||||
:show="addStartPickBarShow"
|
||||
v-model="addTimeStart"
|
||||
mode="date"
|
||||
@close="addPickBarOnClose('start')"
|
||||
@cancel="addPickBarOnCancel('start')"
|
||||
@confirm="addPickBarOnConfirm"
|
||||
></u-datetime-picker>
|
||||
<u-button @click="addStartPickBarShow = true">起始时间：{{ addTimeStartStr == '' ? '请选择起始时间...' : addTimeStartStr }}</u-button>
|
||||
<u-datetime-picker
|
||||
:show="addEndPickBarShow"
|
||||
v-model="addTimeEnd"
|
||||
mode="date"
|
||||
@close="addPickBarOnClose('end')"
|
||||
@cancel="addPickBarOnCancel('end')"
|
||||
@confirm="addPickBarOnConfirm"
|
||||
></u-datetime-picker>
|
||||
<u-button @click="addEndPickBarShow = true">结束时间：{{ addTimeEndStr == '' ? '请选择结束时间...' : addTimeEndStr }}</u-button>
|
||||
<u-toast ref="uToast"></u-toast>
|
||||
<view class="u-page">
|
||||
<view class="u-demo-block">
|
||||
<view class="u-demo-block__content">
|
||||
<u-row customStyle="margin-bottom: 10px">
|
||||
<u-col span="6">
|
||||
<view class="demo-layout bg-purple-light">
|
||||
<u-button @click="resetAdvancedParam">重置</u-button>
|
||||
</view>
|
||||
</u-col>
|
||||
<u-col span="6">
|
||||
<view class="demo-layout bg-purple">
|
||||
<u-button @click="advancedSearch">搜索</u-button>
|
||||
</view>
|
||||
</u-col>
|
||||
</u-row>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</u-popup>
|
||||
<view class="message_list">
|
||||
<u-list @scrolltolower="scrolltolower" v-if="list.length > 0">
|
||||
<u-list-item v-for="(item, index) in list" :key="index">
|
||||
|
|
@ -41,6 +89,13 @@ export default {
|
|||
currentPage: 1,
|
||||
totalPage: 0,
|
||||
list: [],
|
||||
popupShow: false, // 高级搜索弹窗
|
||||
addStartPickBarShow: false, // 起始日期选择器
|
||||
addEndPickBarShow: false, // 结束日期选择器
|
||||
addTimeStart: Number(new Date()), // 承诺书添加时间-起始
|
||||
addTimeEnd: Number(new Date()), // 承诺书添加时间-结束
|
||||
addTimeStartStr: '', // 承诺书添加时间-起始-字符串
|
||||
addTimeEndStr: '', // 承诺书添加时间-结束-字符串
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
|
@ -57,6 +112,8 @@ export default {
|
|||
USER_ID: this.userInfo.USER_ID,
|
||||
showCount: this.pageSize,
|
||||
currentPage: this.currentPage,
|
||||
ADDSTART: this.addTimeStartStr,
|
||||
ADDEND: this.addTimeEndStr
|
||||
})
|
||||
this.list = [...this.list, ...resData.varList]
|
||||
},
|
||||
|
|
@ -65,6 +122,8 @@ export default {
|
|||
USER_ID: this.userInfo.USER_ID,
|
||||
showCount: this.pageSize,
|
||||
currentPage: this.currentPage,
|
||||
ADDSTART: this.addTimeStartStr,
|
||||
ADDEND: this.addTimeEndStr
|
||||
})
|
||||
this.list = [...this.list, ...resData.varList]
|
||||
},
|
||||
|
|
@ -84,6 +143,7 @@ export default {
|
|||
},
|
||||
tabsClick(e) {
|
||||
this.TYPE = e.id
|
||||
this.resetAllAddTime()
|
||||
this.resetList()
|
||||
},
|
||||
fnNavigator(item) {
|
||||
|
|
@ -95,7 +155,82 @@ export default {
|
|||
TYPE: this.TYPE
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 高级搜索弹窗弹出函数
|
||||
popupOpen() {
|
||||
this.popupShow = true
|
||||
|
||||
},
|
||||
// 高级搜索弹窗关闭函数
|
||||
popupClose() {
|
||||
this.popupShow = false
|
||||
|
||||
},
|
||||
// 高级搜索日期选择器关闭回调
|
||||
addPickBarOnClose(type) {
|
||||
switch (type) {
|
||||
case 'start':
|
||||
this.addStartPickBarShow = false;
|
||||
break;
|
||||
case 'end':
|
||||
this.addEndPickBarShow = false;
|
||||
break;
|
||||
default:
|
||||
this.$refs.uToast.show({message:'日期选择参数错误',duration:1000})
|
||||
}
|
||||
},
|
||||
// 高级搜索日期选择器取消回调
|
||||
addPickBarOnCancel(type) {
|
||||
this.addPickBarOnClose(type)
|
||||
},
|
||||
// 高级搜索日期选择器确认回调
|
||||
addPickBarOnConfirm(value) {
|
||||
// alert(value.value)
|
||||
switch (this.addStartPickBarShow) {
|
||||
case true:
|
||||
// start type
|
||||
this.addTimeStartStr = uni.$u.timeFormat(value.value, 'yyyy-mm-dd')
|
||||
this.addPickBarOnClose('start')
|
||||
break;
|
||||
case false:
|
||||
// end type
|
||||
this.addTimeEndStr = uni.$u.timeFormat(value.value, 'yyyy-mm-dd')
|
||||
this.addPickBarOnClose('end')
|
||||
break;
|
||||
default:
|
||||
this.$refs.uToast.show({message:'日期选择参数错误',duration:1000})
|
||||
}
|
||||
},
|
||||
// 清除高级搜索内的起始日期、结束日期组件绑定的时间属性（时间戳类型）；清除根据时间戳格式化的文本日期
|
||||
resetAllAddTime() {
|
||||
this.addTimeStart = Number(new Date())
|
||||
this.addTimeEnd = Number(new Date())
|
||||
this.addTimeStartStr = ''
|
||||
this.addTimeEndStr = ''
|
||||
},
|
||||
// 重置高级搜索条件
|
||||
resetAdvancedParam() {
|
||||
this.resetAllAddTime()
|
||||
this.resetList()
|
||||
},
|
||||
// 高级搜索
|
||||
advancedSearch(){
|
||||
const toast = uni.$u.toast
|
||||
// 日期合法判定
|
||||
if (this.addTimeStartStr > this.addTimeEndStr){
|
||||
// 包含两种case：case1 开始时间 > 结束时间；case2 开始时间有值，结束时间为空
|
||||
this.$refs.uToast.show({message:'日期不合法',duration:1000})
|
||||
return
|
||||
}
|
||||
if (this.addTimeEndStr != '' && this.addTimeStartStr == ''){
|
||||
// 结束时间有值，开始时间为空
|
||||
this.$refs.uToast.show({message:'日期不合法',duration:1000})
|
||||
return
|
||||
}
|
||||
this.resetList()
|
||||
this.popupClose()
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -105,4 +240,24 @@ export default {
|
|||
background-color: #f7f9ff;
|
||||
height: 100vh;
|
||||
}
|
||||
.wrap {
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.demo-layout {
|
||||
height: 25px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.bg-purple {
|
||||
background: #CED7E1;
|
||||
}
|
||||
|
||||
.bg-purple-light {
|
||||
background: #e5e9f2;
|
||||
}
|
||||
|
||||
.bg-purple-dark {
|
||||
background: #99a9bf;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue