1

lzhe

2024-06-21 ff2af13cd41b8528e830e22300fb14f2c5778e7c

1

 src/views/home/widgets/index.vue

@@ -21,7 +21,10 @@
                                <template #item="{ element }">
                                    <div class="widgets-item">
                                        <component :is="allComps[element]"></component>
										
                                        <div v-if="customizing" class="customize-overlay">
                                            <el-button class="close" type="danger" plain icon="el-icon-close" size="small" @click="remove(element)"></el-button>
                                            <label><el-icon><component :is="allComps[element].icon" /></el-icon>{{ allComps[element].title }}</label>
                                        </div>
                                    </div>
                                </template>
                            </draggable>
@@ -108,7 +111,6 @@
            this.getWorkbenchCarList();
        },
        mounted() {
            console.log(this.allComps,this.element,this.grid.layout)
            this.$emit('on-mounted')
        },
        computed: {
@@ -132,6 +134,7 @@
                return allCompsList
            },
            myCompsList(){
                alert(1)
                var copmsList = [];
                if(this.defaultGrid.copmsList == undefined) return [];
                this.defaultGrid.copmsList.forEach(item=> {
@@ -157,13 +160,34 @@
                this.$HTTP.get(`/api/blade-system/workbench-card/list?workbenchId=${this.workid}`).then(res=> {
                    if(res.code == 200) {
                        let cards = res.data; 
                        //ycoordinate表示从上往下从第几个开始，从0开始数
                        //xcoordinate表示从左往右从第几个开始，从0开始数
                        //按ycoordinate进行从小到大排序，如果ycoordinate一样时，按照xcoordinate从小到大排序
                        //cardWide代表宽度
                        //cardKey代表组件名称
                        cards.sort((a, b) => {  
                            return parseInt(a.xcoordinate, 10) - parseInt(b.xcoordinate, 10);  
                        });  
                            // 先比较 ycoordinate  
                            if (a.ycoordinate < b.ycoordinate) {  
                                return -1;  
                            }  
                            if (a.ycoordinate > b.ycoordinate) {  
                                return 1;  
                            }  
                            // 如果 ycoordinate 相同，则比较 xcoordinate  
                            if (a.xcoordinate < b.xcoordinate) {  
                                return -1;  
                            }  
                            if (a.xcoordinate > b.xcoordinate) {  
                                return 1;  
                            }  
                            // 如果 xcoordinate 也相同，则不交换位置  
                            return 0;  
                        });   
                        cards.forEach((item,index)=> {
                            this.$CONFIG.DEFAULT_GRID.copmsList[index] = [item.cardKey];
                            this.$CONFIG.DEFAULT_GRID.layout[index] = item.cardWide * 2;
                        })
                        console.log(this.$CONFIG.DEFAULT_GRID.copmsList,this.$CONFIG.DEFAULT_GRID.layout,234)
                        this.$CONFIG.DEFAULT_GRID.data = cards;
                        this.defaultGrid = this.$CONFIG.DEFAULT_GRID;
                        this.grid = this.$TOOL.data.get("grid") || JSON.parse(JSON.stringify(this.defaultGrid))
@@ -195,11 +219,13 @@
            },
            //隐藏组件
            remove(item){
                console.log(item,222)
                var newCopmsList = this.grid.copmsList
                newCopmsList.forEach((obj, index) => {
                    var newObj = obj.filter(o=>o!=item)
                    newCopmsList[index] = newObj;
                })
                //console.log(newCopmsList,123)
            },
            //保存
            save(){