E_WeChat/components/Yl_Filtrate/index.js

const getHeight = require("../../utils/GetRheRemainingHeight");
Component({
    properties: {
        list: {
            type: Array,
            value: [{
                label: "筛选1",
                index: null,
                showName: "name", //显示字段
                valueKey: "name", //返回Key
                selectKey: "id", //传参 代表选着字段 不传参返回整个选择对象
                value: "", //选中值
                list: [{
                    name: "a1",
                    id: 0
                }, {
                    name: "a2",
                    id: 1
                }]
            }]
        },
        show: Boolean,
        handle: Function, //按钮回调函数
        dateRange: { //是否开启日期范围筛选
            type: Boolean,
            value: true
        },
        zIndex: {
            type: String,
            value: 99999,
        },
        interrupt: Function
    },
    data: {
        startdate: "", //开始时间
        enddate: "", //结束时间
    },
    lifetimes: {
        ready() {
            getHeight.getHeight('.head', this).then(res => this.setData({
                listHeight: res - 80
            }));
        }
    },
    methods: {
        /* 选择 */
        onSelect(e) {
            const {
                item, //被选项
                index, //列表下标
                i //被选项下标
            } = e.currentTarget.dataset;
            if (this.data.list[index].index == i) {
                this.setData({
                    [`list[${index}].value`]: "",
                    [`list[${index}].index`]: null
                });
            } else {
                this.setData({
                    [`list[${index}].value`]: this.data.list[index].selectKey ? item[this.data.list[index].selectKey] : item,
                    [`list[${index}].index`]: i
                });
            }
            if (this.data.list[index].interrupt) this.triggerEvent("interrupt", {
                item,
                index,
                name: this.data.list[index].selectKey,
                list: this.data.list
            })
        },
        /* 点击按钮 */
        onClick(e) {
            const {
                name
            } = e.target.dataset;
            if (name == 'reset') {
                this.setData({
                    list: this.data.list.map(v => {
                        v.value = "";
                        v.index = null;
                        return v;
                    })
                })
                this.setData({
                    startdate: '',
                    enddate: ''
                })
                let MultilevelClass = this.selectComponent("#MultilevelClass");
                if (MultilevelClass) MultilevelClass.clearChild()
                this.triggerEvent("handle", {})
            } else if (name == 'confirm') {
                let obj = {};
                this.data.list.forEach(v => {
                    obj[v.valueKey] = v.value;
                });
                if (this.data.dateRange) {
                    obj.startdate = this.data.startdate;
                    obj.enddate = this.data.enddate;
                };
                this.triggerEvent("handle", obj);
            }
            this.onClose();
        },
        /* 筛选日期范围 */
        changeDate(e) {
            const name = e.currentTarget.dataset.name,
                value = e.detail.value;
            this.setData({
                [name]: value
            })
        },
        onClose() {
            this.setData({
                show: false
            })
        }
    }
})