chuchu2/components/My_categoryListings/modules/group.js

// components/My_categoryListings/modules/group.js
Component({
    /**
     * 组件的属性列表
     */
    properties: {
        apps: {
            type: Array,
            value: []
        },
        callback: {
            type: Function
        },
    },
    observers: {
        "apps": function (apps) {
            if (this.data.count == 1) return;
            this.refactorDom();
        }
    },

    /**
     * 组件的初始数据
     */
    data: {
        backupArrays: [],
        nubArr: [],
        count: 0,
        show: true,
    },
    /**
     * 组件的方法列表
     */
    methods: {
        /* 功能单选 */
        onChange(e) {
            const {
                index
            } = e.currentTarget.dataset;
            let obj = {
                systemappid: e.currentTarget.id - 0,
                optionids: e.detail
            };
            let arr = this.data.backupArrays,
                nubArr = this.data.nubArr,
                i = arr.findIndex(v => v.systemappid == obj.systemappid);
            if (e.detail.length > 0) {
                if (i == -1) {
                    arr.push(obj);
                    nubArr.push(obj.systemappid);
                } else {
                    arr[i] = obj;
                }
            } else {
                nubArr.splice(i, 1)
                arr.splice(i, 1)
            };
            this.setData({
                ["apps[" + index + "].optionids"]: obj.optionids,
                backupArrays: arr,
                nubArr
            });
            this.triggerEvent("callback", {
                arr: this.data.backupArrays,
                apps: this.data.apps
            });
        },
        /* 类选择 */
        classClick(e) {
            const {
                item
            } = e.currentTarget.dataset;
            let i = this.data.nubArr.findIndex(v => v == item.systemappid);
            if (i == -1) {
                const obj = {
                    systemappid: item.systemappid,
                    optionids: item.options.map(v => v.optionid.toString())
                };
                this.data.backupArrays.push(obj);
                this.data.nubArr.push(item.systemappid);
                let index = this.data.apps.findIndex(v => v.systemappid == item.systemappid);
                this.setData({
                    backupArrays: this.data.backupArrays,
                    nubArr: this.data.nubArr,
                    ["apps[" + index + "].optionids"]: obj.optionids
                })
            } else {
                let index = this.data.apps.findIndex(v => v.systemappid == item.systemappid);
                this.setData({
                    ["apps[" + index + "].optionids"]: [],
                    nubArr: this.data.nubArr.filter(v => v != item.systemappid),
                    backupArrays: this.data.backupArrays.filter(v => v.systemappid != item.systemappid)
                });
            };
            this.triggerEvent("callback", {
                arr: this.data.backupArrays,
                apps: this.data.apps
            });
        },
        /* 重构 */
        refactorDom() {
            let apps = this.data.apps;
            let arr = [],
                nubArr = [];
            for (let i = 0; i < apps.length; i++) {
                if (apps[i].optionids.length == 0) continue;
                let obj = {
                    systemappid: apps[i].systemappid,
                    optionids: apps[i].optionids.map(v => v + '')
                };
                arr.push(obj);
                nubArr.push(apps[i].systemappid);
                this.setData({
                    [`apps[${i}].optionids`]: apps[i].optionids.map(v => v + '')
                })
            };
            this.setData({
                backupArrays: arr,
                nubArr,
                count: 1
            })
            if (arr.length == 0) return;
            this.triggerEvent("callback", {
                arr: this.data.backupArrays,
                apps: this.data.apps
            });
            this.setData({
                show: false
            })
            this.setData({
                show: true
            })
        },
    }
})