prsx-crm/components/Yl_nav/index.js

const getHeight = require("../../utils/getHeight");

Component({
    options: {
        addGlobalClass: true
    },
    properties: {
        sort: Array, //排序规则列表
        search: Boolean, //是否开启搜索
        list: Array, //功能列表
        condition: String, //搜索内容
        onClick: Function,
        startUsing: Boolean, //启用搜索
        onSearch: Function, //搜索回调
        record: { //记录历史
            type: Boolean,
            value: true
        }
    },
    data: {
        sortShow: false,
        reversed: 0, //是否翻转
        condition: "",
        history: [], //搜索历史
        showHistory: false,
        listHeight: null,
    },
    lifetimes: {
        attached() {
            if (wx.getStorageSync('SearchHistory')) this.setData({
                history: wx.getStorageSync('SearchHistory')
            })
        },
        ready() {
            /* let windowHeight = 0,
                that = this;
            wx.getSystemInfo({
                success: (res => windowHeight = res.windowHeight)
            });
            let query = wx.createSelectorQuery().in(that).select('.Yl_head').boundingClientRect();
            query.exec(res => that.setData({
                listHeight: (windowHeight - res[0].bottom - 80) * 2
            })) */
            getHeight.getHeight('.Yl_head', this).then(res => this.setData({
                listHeight: res - 80
            }));
        }
    },
    methods: {
        /* 排序 */
        sortClick(e) {
            const {
                name
            } = e.target.dataset;
            if (name == 'confirm') {
                let sort = this.data.sort.find(v => v.sorted == 1),
                    i = this.data.list.findIndex(v => v.id == 'sort');
                this.setData({
                    [`list[${i}].label`]: sort.sortname,
                    [`list[${i}].icon`]: sort.reversed == 0 ? 'icon-jiangxu1' : 'icon-shengxu',
                })
                let pages = getCurrentPages(),
                    page = pages[pages.length - 1];
                page.setData({
                    "content.sort": this.data.sort
                });
                page.getList(true);
            };
            this.setData({
                sortShow: false
            })
        },
        sortClose() {
            this.setData({
                sortShow: false
            })
        },
        /* 设置排序规则 */
        handleSort(e) {
            const {
                id
            } = e.currentTarget.dataset;
            this.setData({
                sort: this.data.sort.map(v => {
                    v.sorted = v.sortid == id ? 1 : 0
                    return v;
                })
            });
        },
        /* 设置升序和倒叙 */
        handleReversed(e) {
            let {
                id
            } = e.currentTarget.dataset;
            if (this.data.reversed == id) return;
            this.setData({
                reversed: id,
                sort: this.data.sort.map(v => {
                    v.reversed = id;
                    return v;
                })
            });
        },
        onClick(e) {
            const {
                item
            } = e.currentTarget.dataset;
            if (item.id == "sort") {
                //排序
                this.setData({
                    sortShow: true
                })
            } else {
                this.triggerEvent("onClick", item)
            }
        },
        /* 开启关闭搜索 */
        clickSearch() {
            this.setData({
                startUsing: !this.data.startUsing
            });
            setTimeout(this.setListHeight, 400)
        },
        /* 开始搜索 */
        startSearch({
            detail
        }) {
            if (this.data.condition == detail) return;
            this.setData({
                condition: detail
            })
            this.triggerEvent("onSearch", detail)
            if (this.data.record || detail == '') {
                let list = this.data.history;
                if (list.findIndex(v => v == detail) == -1) {
                    list.push(detail)
                    this.setData({
                        history: list
                    });
                    wx.setStorageSync("SearchHistory", list)
                }
            }
        },
        /* 取消搜索 */
        endSearch() {
            this.setData({
                condition: ""
            })
            this.triggerEvent("onSearch", "")
        },
        /* 删除搜索历史 */
        deleteHistory(e) {
            let that = this;
            wx.showModal({
                title: '提示',
                content: '是否删除所有搜索历史',
                complete: ({
                    confirm
                }) => {
                    if (confirm) {
                        wx.setStorageSync("SearchHistory", [])
                        that.setData({
                            history: []
                        });
                        this.setListHeight();
                    }
                }
            })
        },
        /* 快速搜索 */
        clickTag(e) {
            const {
                name
            } = e.currentTarget.dataset;
            this.setData({
                condition: name
            });
            this.triggerEvent("onSearch", name)
        },
        /* 单独删除 */
        delteTag(e) {
            const {
                name
            } = e.currentTarget.dataset;
            this.setData({
                history: this.data.history.filter(v => v != name)
            });
            wx.setStorageSync('SearchHistory', this.data.history);
            this.setListHeight();
        },
        /* 设置列表高度 */
        setListHeight() {
            let pages = getCurrentPages();
            if (pages[pages.length - 1].setListHeight) pages[pages.length - 1].setListHeight();
        },
        /* 搜索框焦点 */
        onFocus() {
            this.setData({
                showHistory: true
            });
            setTimeout(this.setListHeight, 50);
        },
        /* 搜索框失焦 */
        onBlur() {
            this.setData({
                showHistory: false
            })
            setTimeout(this.setListHeight, 50);
        }
    }
})