606 lines
17 KiB
Vue
606 lines
17 KiB
Vue
|
<template>
|
|||
|
|
<view>
|
|||
|
|
<uni-drawer :visible="visibleDrawer" :hideNoAnimate="showBackButton" mode="right" @close="closeDrawer()">
|
|||
|
|
<!-- #ifdef APP-PLUS -->
|
|||
|
|
<view class="iconfont icon-guanbi" v-if="showBackButton" @tap="closeDrawer()"></view>
|
|||
|
|
<!-- #endif -->
|
|||
|
|
<scroll-view class="drawer-list" scroll-y :style="{'height': drawerHeight, 'padding-top': fixTop}">
|
|||
|
|
<block v-for="(item, index) in menuList" :key="index">
|
|||
|
|
<!-- 单选、多选 isMutiple是否支持多选-->
|
|||
|
|
<view v-if="item.type === 'custom' && item.detailList.length">
|
|||
|
|
<view class="drawer-list-title flex justify-between">
|
|||
|
|
<view>
|
|||
|
|
{{item.title}}
|
|||
|
|
</view>
|
|||
|
|
<text v-if="item.detailList.length>showLenght"
|
|||
|
|
@tap="showMore(index)">{{item.showMoreList ? '收起' : '更多'}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="draer-list-con">
|
|||
|
|
<template v-if="!item.showMoreList">
|
|||
|
|
<text
|
|||
|
|
:style="{background: textItem.isSelected ? color : '', color: textItem.isSelected ? '#ffffff' : ''}"
|
|||
|
|
v-if="idx<showLenght" v-for="(textItem, idx) in item.detailList" :key="idx"
|
|||
|
|
:class="textItem.isSelected ? 'on' : ''"
|
|||
|
|
@tap="itemTap(idx,item.detailList,item.key, item.isMutiple)">
|
|||
|
|
{{textItem.title}}
|
|||
|
|
</text>
|
|||
|
|
</template>
|
|||
|
|
<template v-else>
|
|||
|
|
<text
|
|||
|
|
:style="{background: textItem.isSelected ? color : '', color: textItem.isSelected ? '#ffffff' : ''}"
|
|||
|
|
v-for="(textItem, idx) in item.detailList" :key="idx"
|
|||
|
|
:class="textItem.isSelected ? 'on' : ''"
|
|||
|
|
@tap="itemTap(idx,item.detailList,item.key, item.isMutiple)">
|
|||
|
|
{{textItem.title}}
|
|||
|
|
</text>
|
|||
|
|
</template>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 时间带时分秒范围选择 -->
|
|||
|
|
<view v-if="item.type === 'rangetime'">
|
|||
|
|
<view class="drawer-list-title flex justify-between">
|
|||
|
|
<view>
|
|||
|
|
{{item.title}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="dateContent" @click="onShowDatePicker('rangetime', item.key, item)">
|
|||
|
|
<view>
|
|||
|
|
<template v-if="result[item.key] && result[item.key].length > 0">
|
|||
|
|
{{result[item.key][0]}}
|
|||
|
|
</template>
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<template v-if="result[item.key] && result[item.key].length > 0">
|
|||
|
|
{{result[item.key][1]}}
|
|||
|
|
</template>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 时间不带时分秒范围选择 -->
|
|||
|
|
<view v-if="item.type === 'range'">
|
|||
|
|
<view class="drawer-list-title flex justify-between">
|
|||
|
|
<view>
|
|||
|
|
{{item.title}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="dateContent" @click="onShowDatePicker('range', item.key, item)">
|
|||
|
|
<view>
|
|||
|
|
<template v-if="result[item.key] && result[item.key].length > 0">
|
|||
|
|
{{result[item.key][0]}}-{{result[item.key][1]}}
|
|||
|
|
</template>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 时间选择 -->
|
|||
|
|
<view v-if="item.type === 'date'">
|
|||
|
|
<view class="drawer-list-title flex justify-between">
|
|||
|
|
<view>
|
|||
|
|
{{item.title}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="dateContent" @click="onShowDatePicker('date', item.key, item)">
|
|||
|
|
<view>
|
|||
|
|
<template v-if="result[item.key]">
|
|||
|
|
{{result[item.key]}}
|
|||
|
|
</template>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 数值范围选择 -->
|
|||
|
|
<view v-if="item.type === 'rangenumber'">
|
|||
|
|
<view class="drawer-list-title flex justify-between">
|
|||
|
|
<view>
|
|||
|
|
{{item.title}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="dateContent rangenumber-content flex">
|
|||
|
|
<view class="rangenumber-input">
|
|||
|
|
<input class="m-input" type="number" clearable v-model="result[item.minName || (item.key + 'Min')]"
|
|||
|
|
:placeholder="item.minPlaceholder || '最小值'"
|
|||
|
|
@blur="numberInputBlur(item)"></input>
|
|||
|
|
</view>
|
|||
|
|
<text>-</text>
|
|||
|
|
<view class="rangenumber-input">
|
|||
|
|
<input class="m-input" type="number" clearable v-model="result[item.maxName || (item.key + 'Max')]"
|
|||
|
|
:placeholder="item.maxPlaceholder || '最大值'"
|
|||
|
|
@blur="numberInputBlur(item)"></input>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 单输入框 -->
|
|||
|
|
<view v-if="item.type === 'singleinput'">
|
|||
|
|
<view class="drawer-list-title flex justify-between">
|
|||
|
|
<view>
|
|||
|
|
{{item.title}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="dateContent">
|
|||
|
|
<view>
|
|||
|
|
<input class="m-input" clearable v-model="result[item.key]"
|
|||
|
|
:placeholder="item.placeholder || '请输入关键字'" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
</scroll-view>
|
|||
|
|
<view class="filter-content-footer flex justify-center">
|
|||
|
|
<!-- #ifdef APP-PLUS-->
|
|||
|
|
<view v-if="showBackButton" class="filter-content-footer-item" :style="{color: '#ccc', 'border': '1rpx solid #ccc'}"
|
|||
|
|
@tap="closeDrawer()">
|
|||
|
|
<text>返回</text>
|
|||
|
|
</view>
|
|||
|
|
<!-- #endif -->
|
|||
|
|
<view class="filter-content-footer-item" :style="{color, 'border': `1rpx solid ${color}`}"
|
|||
|
|
@tap="resetClick">
|
|||
|
|
<text>重置</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="filter-content-footer-item" :style="{'background': color}" @tap="sureClick">
|
|||
|
|
<text>确认</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</uni-drawer>
|
|||
|
|
<mx-date-picker :show="showPicker" :color="color" :type="dateType" :value="dateValue" :show-tips="true"
|
|||
|
|
:show-seconds="true" @confirm="onSelected" @cancel="onSelected" />
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
/***
|
|||
|
|
* 筛选组件，当前支持多选、单选
|
|||
|
|
* item.type (custom 单选、多选、rangetime 时间范围带时分秒、range 时间范围不带时分秒、rangenumber 数字范围)
|
|||
|
|
* item.isMutiple 是否支持多选
|
|||
|
|
* 筛选后返回格式{"listName1":[value,value](多选),"listName2":"value"（单选）,...}
|
|||
|
|
* rangenumber形式-可能为["",1]或[1,""]表示只有一个最大值或最小值
|
|||
|
|
***/
|
|||
|
|
import uniDrawer from '@/components/uni-drawer/uni-drawer.vue';
|
|||
|
|
import MxDatePicker from "@/components/mx-datepicker/mx-datepicker.vue";
|
|||
|
|
export default {
|
|||
|
|
props: {
|
|||
|
|
list: {
|
|||
|
|
required: true,
|
|||
|
|
type: Array,
|
|||
|
|
default () {
|
|||
|
|
return [];
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
color: {
|
|||
|
|
type: String,
|
|||
|
|
default: '#4D7BFE',
|
|||
|
|
},
|
|||
|
|
defaultValue: { //若有默认值则触发sureClick
|
|||
|
|
type: Object,
|
|||
|
|
default () {
|
|||
|
|
return {}
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
showBackButton: {
|
|||
|
|
type: Boolean,
|
|||
|
|
default: false,
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
watch: {
|
|||
|
|
list: {
|
|||
|
|
handler(val) {
|
|||
|
|
this.menuList = JSON.parse(JSON.stringify(val));
|
|||
|
|
this.resetResult();
|
|||
|
|
this.defaultValueFun();
|
|||
|
|
},
|
|||
|
|
deep: true // 可以深度检测到 obj 对象的属性值的变化
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
components: {
|
|||
|
|
uniDrawer,
|
|||
|
|
MxDatePicker
|
|||
|
|
},
|
|||
|
|
beforeCreate() {
|
|||
|
|
Object.isEmpty = (object, except = []) => {
|
|||
|
|
if (!object) {
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
for (let key in object) {
|
|||
|
|
if (except && except.includes(key)) {
|
|||
|
|
continue;
|
|||
|
|
}
|
|||
|
|
if (object.hasOwnProperty(key)) {
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return true;
|
|||
|
|
};
|
|||
|
|
Date.prototype.Format = function(fmt) { //author: meizz
|
|||
|
|
var o = {
|
|||
|
|
"M+": this.getMonth() + 1, //月份
|
|||
|
|
"d+": this.getDate(), //日
|
|||
|
|
"h+": this.getHours(), //小时
|
|||
|
|
"m+": this.getMinutes(), //分
|
|||
|
|
"s+": this.getSeconds(), //秒
|
|||
|
|
"q+": Math.floor((this.getMonth() + 3) / 3), //季度
|
|||
|
|
"S": this.getMilliseconds() //毫秒
|
|||
|
|
};
|
|||
|
|
if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1
|
|||
|
|
.length));
|
|||
|
|
for (var k in o)
|
|||
|
|
if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[
|
|||
|
|
k]) : (("00" + o[
|
|||
|
|
k]).substr(("" + o[k]).length)));
|
|||
|
|
return fmt;
|
|||
|
|
};
|
|||
|
|
String.prototype.replaceAll = function(oldValue, newValue) { return this.toString().replace(new RegExp(oldValue, 'gm'), newValue); }
|
|||
|
|
},
|
|||
|
|
created() {
|
|||
|
|
this.menuList = JSON.parse(JSON.stringify(this.list));
|
|||
|
|
this.resetResult();
|
|||
|
|
uni.getSystemInfo({
|
|||
|
|
success: (res) => {
|
|||
|
|
let windowHeight = res.windowHeight;
|
|||
|
|
// #ifdef H5
|
|||
|
|
if (!(this.$IsWeixin || this.$IsAlipay || this.$IsCloudPay)) {
|
|||
|
|
let thirdApp = getApp().globalData.options?.thirdApp;
|
|||
|
|
if (thirdApp && thirdApp.hideNavBar) {
|
|||
|
|
// 第三方App使用App原生导航栏
|
|||
|
|
} else {
|
|||
|
|
this.fixTop = (res.statusBarHeight || 0) + 'px';
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body
|
|||
|
|
.clientHeight || res.windowHeight;
|
|||
|
|
// #endif
|
|||
|
|
this.drawerHeight = (windowHeight - uni.upx2px(120)) + 'px';
|
|||
|
|
// uni.showModal({
|
|||
|
|
// content: `model: ${res.model}`,
|
|||
|
|
// })
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
mounted() {
|
|||
|
|
this.defaultValueFun();
|
|||
|
|
},
|
|||
|
|
computed: {
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
menuList: [],
|
|||
|
|
visibleDrawer: false,
|
|||
|
|
menuKey: 1,
|
|||
|
|
showLenght: 6,
|
|||
|
|
drawerHeight: '500px',
|
|||
|
|
selectDetailList: [],
|
|||
|
|
result: {},
|
|||
|
|
showPicker: false,
|
|||
|
|
dateType: 'rangetime',
|
|||
|
|
dateValue: '',
|
|||
|
|
fixTop: '0px'
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
methods: {
|
|||
|
|
|
|||
|
|
defaultValueFun() {
|
|||
|
|
//如果有默认值，则赋值后调用sureClick通知父组件更新
|
|||
|
|
if (!Object.isEmpty(this.defaultValue)) {
|
|||
|
|
const value = this.defaultValue;
|
|||
|
|
const list = JSON.parse(JSON.stringify(this.menuList));
|
|||
|
|
for (let key in value) {
|
|||
|
|
for (let i = 0; i < list.length; i++) {
|
|||
|
|
if (list[i].key === key) {
|
|||
|
|
if (list[i].type === 'custom') {
|
|||
|
|
list[i].detailList.map((item, index) => {
|
|||
|
|
if (Array.isArray(value[key]) && value[key].indexOf(item.value) > -1) {
|
|||
|
|
item.isSelected = true;
|
|||
|
|
} else if (value[key] == item.value) {
|
|||
|
|
item.isSelected = true;
|
|||
|
|
}
|
|||
|
|
return item;
|
|||
|
|
})
|
|||
|
|
continue;
|
|||
|
|
}
|
|||
|
|
if (list[i].type === 'range' || list[i].type === 'rangetime' || list[i].type === 'rangenumber' && Array.isArray(value[key]) && value[key].length === 2) {
|
|||
|
|
this.result[key] = value[key];
|
|||
|
|
this.result[list[i].minName || (list[i].key + 'Min')] = value[key][0];
|
|||
|
|
this.result[list[i].maxName || (list[i].key + 'Max')] = value[key][1];
|
|||
|
|
continue;
|
|||
|
|
}
|
|||
|
|
if (list[i].type === 'date' || list[i].type === 'singleinput' && value[key]) {
|
|||
|
|
this.result[key] = value[key];
|
|||
|
|
continue;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (this.defaultRefeshTimer) {
|
|||
|
|
clearTimeout(this.defaultRefesh·Timer);
|
|||
|
|
}
|
|||
|
|
this.defaultRefeshTimer = setTimeout(() => {
|
|||
|
|
console.log('筛选默认值触发')
|
|||
|
|
this.menuList = list;
|
|||
|
|
this.sureClick();
|
|||
|
|
}, 200);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
resetResult() {
|
|||
|
|
this.result = this.commonResultObj();
|
|||
|
|
},
|
|||
|
|
commonResultObj() {
|
|||
|
|
let obj = {};
|
|||
|
|
this.menuList.map((item) => {
|
|||
|
|
switch(item.type) {
|
|||
|
|
case "custom":
|
|||
|
|
item.isMutiple ? obj[item.key] = [] : obj[item.key] = '';
|
|||
|
|
item.detailList.forEach(dListItem => {
|
|||
|
|
dListItem.isSelected = dListItem.isSelected || false;
|
|||
|
|
});
|
|||
|
|
break;
|
|||
|
|
case 'range':
|
|||
|
|
case 'rangetime':
|
|||
|
|
case 'rangenumber':
|
|||
|
|
this.result[item.key] = [];
|
|||
|
|
this.result[item.minName || (item.key + 'Min')] = '';
|
|||
|
|
this.result[item.maxName || (item.key + 'Max')] = '';
|
|||
|
|
break;
|
|||
|
|
default:
|
|||
|
|
obj[item.key] = '';
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
return obj;
|
|||
|
|
},
|
|||
|
|
//筛选项选中或取消
|
|||
|
|
itemTap(index, list, key, isMutiple) {
|
|||
|
|
if (isMutiple == true) {
|
|||
|
|
list[index].isSelected = !list[index].isSelected;
|
|||
|
|
if (list[index].isSelected) {
|
|||
|
|
this.result[key].push(list[index].value);
|
|||
|
|
} else {
|
|||
|
|
list[index].isSelected = false;
|
|||
|
|
var idx = this.result[key].indexOf(list[index].value);
|
|||
|
|
this.result[key].splice(idx, 1);
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
this.result[key] = list[index].isSelected ? '' : list[index].value;
|
|||
|
|
for (let i = 0; i < list.length; i++) {
|
|||
|
|
if (index == i && !list[i].isSelected) {
|
|||
|
|
list[i].isSelected = true
|
|||
|
|
} else {
|
|||
|
|
list[i].isSelected = false
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// #ifdef H5 || APP-PLUS
|
|||
|
|
this.$forceUpdate();
|
|||
|
|
// #endif
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
sureClick() {
|
|||
|
|
this.menuList.forEach(menu => {
|
|||
|
|
let list = menu.detailList || [];
|
|||
|
|
if (menu.type == 'custom' && list.length > 0) {
|
|||
|
|
let selectedValueList = [];
|
|||
|
|
list.forEach(item => {
|
|||
|
|
if (item.isSelected) {
|
|||
|
|
selectedValueList.push(item.value);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
if (menu.isMutiple == true) {
|
|||
|
|
this.result[menu.key] = selectedValueList;
|
|||
|
|
} else {
|
|||
|
|
this.result[menu.key] = selectedValueList[0] || '';
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
let str_result = {};
|
|||
|
|
let hasChoose = false;
|
|||
|
|
for (let key in this.result) {
|
|||
|
|
if (typeof this.result[key] == 'object') {
|
|||
|
|
str_result[key] = this.result[key].join(',');
|
|||
|
|
if (!hasChoose) {
|
|||
|
|
hasChoose = this.result[key].join(',') !== '' ? true : false;
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
str_result[key] = this.result[key];
|
|||
|
|
if (!hasChoose) {
|
|||
|
|
hasChoose = this.result[key] !== '' ? true : false;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
this.$emit("result", {
|
|||
|
|
'str_result': str_result,
|
|||
|
|
'result': this.result,
|
|||
|
|
'hasChoose': hasChoose,
|
|||
|
|
'visibleDrawer': false
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
resetClick() {
|
|||
|
|
this.minNumber = '';
|
|||
|
|
this.maxNumber = '';
|
|||
|
|
for (let key in this.result) {
|
|||
|
|
if (typeof this.result[key] === 'object') {
|
|||
|
|
this.result[key] = [];
|
|||
|
|
} else {
|
|||
|
|
this.result[key] = '';
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
for (let i = 0; i < this.menuList.length; i++) {
|
|||
|
|
if (this.menuList[i].type === 'custom') {
|
|||
|
|
for (let j = 0; j < this.menuList[i].detailList.length; j++) {
|
|||
|
|
this.menuList[i].detailList[j].isSelected = false;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// #ifdef H5 || APP-PLUS
|
|||
|
|
this.$forceUpdate();
|
|||
|
|
// #endif
|
|||
|
|
},
|
|||
|
|
closeDrawer() {
|
|||
|
|
this.visibleDrawer = false;
|
|||
|
|
// #ifdef APP-PLUS
|
|||
|
|
this.$emit("result", {
|
|||
|
|
type: 1,
|
|||
|
|
});
|
|||
|
|
// #endif
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
showMore(index) {
|
|||
|
|
this.menuList[index].showMoreList = !this.menuList[index].showMoreList;
|
|||
|
|
++this.menuKey;
|
|||
|
|
// #ifdef H5 || APP-NVUE
|
|||
|
|
this.$forceUpdate();
|
|||
|
|
// #endif
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
onShowDatePicker(type, key, item) { //显示
|
|||
|
|
this.dateType = type;
|
|||
|
|
this.dateValue = this.result[key] || '';
|
|||
|
|
this.showPicker = true;
|
|||
|
|
this.tempKey = key;
|
|||
|
|
this.item = item;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
onSelected(e, key) { //选择
|
|||
|
|
this.showPicker = false;
|
|||
|
|
if (e) {
|
|||
|
|
this.result[this.tempKey] = e.value;
|
|||
|
|
if (e.value && e.value.length && this.item && this.item.type !== 'date') {
|
|||
|
|
let item = this.item;
|
|||
|
|
this.result[item.minName || (item.key + 'Min')] = e.value[0].replaceAll('/', '-');
|
|||
|
|
this.result[item.maxName || (item.key + 'Max')] = e.value[1].replaceAll('/', '-');
|
|||
|
|
}
|
|||
|
|
//选择的值
|
|||
|
|
console.log('value => ' + e.value);
|
|||
|
|
//原始的Date对象
|
|||
|
|
console.log('date => ' + e.date);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
numberInputBlur(item) {
|
|||
|
|
let minNumber = this.result[item.minName || (item.key + 'Min')];
|
|||
|
|
let maxNumber = this.result[item.maxName || (item.key + 'Max')];
|
|||
|
|
if (minNumber != '' && maxNumber != '' && parseFloat(minNumber) > parseFloat(maxNumber)) {
|
|||
|
|
let temp = minNumber;
|
|||
|
|
this.result[item.minName || (item.key + 'Min')] = maxNumber;
|
|||
|
|
this.result[item.maxName || (item.key + 'Max')] = temp;
|
|||
|
|
}
|
|||
|
|
this.result[item.key] = [];
|
|||
|
|
this.result[item.key].push(minNumber && parseFloat(minNumber));
|
|||
|
|
this.result[item.key].push(maxNumber && parseFloat(maxNumber));
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.flex {
|
|||
|
|
display: flex;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.justify-between {
|
|||
|
|
justify-content: space-between;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
view,
|
|||
|
|
scroll-view,
|
|||
|
|
swiper,
|
|||
|
|
button,
|
|||
|
|
input,
|
|||
|
|
textarea,
|
|||
|
|
label,
|
|||
|
|
navigator,
|
|||
|
|
image {
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* 筛选样式 */
|
|||
|
|
.drawer-list {
|
|||
|
|
padding: 0 20rpx;
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
input {
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.drawer-list .drawer-list-title {
|
|||
|
|
font-size: 34rpx;
|
|||
|
|
font-weight: 400;
|
|||
|
|
line-height: 48rpx;
|
|||
|
|
margin: 38rpx 0 18rpx;
|
|||
|
|
color: rgba(34, 34, 34, 1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.drawer-list .drawer-list-title>text {
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
color: #666666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.drawer-list .draer-list-con>text {
|
|||
|
|
background: rgba(93, 92, 254, 0.1);
|
|||
|
|
border-radius: 28px;
|
|||
|
|
color: #666666;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
padding: 10rpx 28rpx;
|
|||
|
|
margin: 10rpx 10rpx 10rpx 0;
|
|||
|
|
display: inline-block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.filter-content-footer-item {
|
|||
|
|
flex: 1;
|
|||
|
|
height: 72rpx;
|
|||
|
|
line-height: 72rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
border-radius: 8rpx;
|
|||
|
|
margin: 14rpx;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.picker {
|
|||
|
|
z-index: 99999 !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.dateContent {
|
|||
|
|
&>view {
|
|||
|
|
background: rgba(244, 244, 244, 1);
|
|||
|
|
border-radius: 8rpx;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 64rpx;
|
|||
|
|
line-height: 64rpx;
|
|||
|
|
margin-bottom: 12rpx;
|
|||
|
|
padding: 0 12rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.rangenumber-content {
|
|||
|
|
&>text {
|
|||
|
|
display: inline-block;
|
|||
|
|
width: 10%;
|
|||
|
|
text-align: center;
|
|||
|
|
height: 64rpx;
|
|||
|
|
line-height: 64rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.rangenumber-input {
|
|||
|
|
width: 45%;
|
|||
|
|
display: inline-block;
|
|||
|
|
padding: 0 12rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.m-input {
|
|||
|
|
height: 64rpx;
|
|||
|
|
line-height: 64rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep .picker {
|
|||
|
|
z-index: 999;
|
|||
|
|
}
|
|||
|
|
.icon-guanbi {
|
|||
|
|
position: fixed;
|
|||
|
|
top: 40rpx;
|
|||
|
|
right: 40rpx;
|
|||
|
|
z-index: 1000;
|
|||
|
|
}
|
|||
|
|
</style>
|