From 9516d95bdcc481b71d4b090bbdcfff39a84b26d6 Mon Sep 17 00:00:00 2001
From: lzhe <lzhe@example.com>
Date: 星期一, 07 十月 2024 22:38:23 +0800
Subject: [PATCH] 1
---
src/views/home/widgets/index.vue | 90 ++++++++++++++++++++++++++++++++------------
1 files changed, 65 insertions(+), 25 deletions(-)
diff --git a/src/views/home/widgets/index.vue b/src/views/home/widgets/index.vue
index d3744a6..e8f9bd9 100644
--- a/src/views/home/widgets/index.vue
+++ b/src/views/home/widgets/index.vue
@@ -17,9 +17,9 @@
</div>
<el-row :gutter="15">
<el-col v-for="(item, index) in grid.layout" v-bind:key="index" :md="item" :xs="24">
- <draggable v-model="grid.copmsList[index]" animation="200" handle=".customize-overlay" group="people" item-key="com" dragClass="aaaaa" force-fallback fallbackOnBody class="draggable-box">
+ <draggable v-model="grid.copmsList[index]" animation="200" handle=".customize-overlay" group="people" item-key="com" dragClass="aaaaa" force-fallback fallbackOnBody class="draggable-box" @add="endDraggable">
<template #item="{ element }">
- <div class="widgets-item">
+ <div class="widgets-item" :ref="element">
<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>
@@ -41,7 +41,7 @@
</el-header>
<el-header style="height:auto">
<div class="selectLayout">
- <div class="selectLayout-item item01" :class="{active:grid.layout.join(',')=='12,6,6'}" @click="setLayout([12,6,6])">
+ <!-- <div class="selectLayout-item item01" :class="{active:grid.layout.join(',')=='12,6,6'}" @click="setLayout([12,6,6])">
<el-row :gutter="2">
<el-col :span="12"><span></span></el-col>
<el-col :span="6"><span></span></el-col>
@@ -61,7 +61,7 @@
<el-col :span="24"><span></span></el-col>
<el-col :span="24"><span></span></el-col>
</el-row>
- </div>
+ </div> -->
<div class="selectLayout-item item04" :class="{active:grid.layout.join(',').indexOf('24,12,6,6')>-1}" @click="setLayout([24,12,6,6])">
<el-row :gutter="2">
<el-col :span="24"><span></span></el-col>
@@ -120,7 +120,7 @@
this.getWorkbenchCarList();
},
mounted() {
- this.$emit('on-mounted')
+ this.$emit('on-mounted');
},
computed: {
allCompsList(){
@@ -133,14 +133,7 @@
description: allComps[key].description
})
}
- var myCopmsList = this.grid.copmsList.reduce(function(a, b){return a.concat(b)})
- for(let comp of allCompsList){
- const _item = myCopmsList.find((item)=>{return item === comp.key})
- if(_item){
- comp.disabled = true
- }
- }
- return allCompsList
+ return allCompsList;
},
myCompsList(){
var copmsList = [];
@@ -150,7 +143,6 @@
})
var myGrid = copmsList;
this.$TOOL.data.set("DASHBOARDGRID", copmsList);
- //return this.allCompsList.filter(item => !item.disabled && myGrid.includes(item.key))
return this.allCompsList;
},
nowCompsList(){
@@ -163,6 +155,9 @@
}
},
methods: {
+ endDraggable(e) {
+ console.log(e,this.grid)
+ },
getWorkbenchCarList() {
var data = this.$TOOL.data.get("MENU");
this.workid = data[0].children[0].id; //璁板綍绗竴涓猚hildren鐨刬d
@@ -191,22 +186,53 @@
}
// 濡傛灉 xcoordinate 涔熺浉鍚岋紝鍒欎笉浜ゆ崲浣嶇疆
return 0;
- });
- //console.log(cards)
- cards.forEach((item,index)=> {
- this.$CONFIG.DEFAULT_GRID.copmsList[index] = [item.cardKey];
- this.$CONFIG.DEFAULT_GRID.layout[index] = item.cardWide * 2;
+ });
+ var layout = [...new Set(cards.map(v => v.cardWide *2))]; //甯冨眬
+ if(layout.length < 3) {
+ layout = [24,12,6,6];
+ }
+ var result = {}
+ //鎺掑簭
+ cards.forEach(v=> {
+ if(!result[`${v.cardWide}-${v.xcoordinate}`]) {
+ result[`${v.cardWide}-${v.xcoordinate}`] = []
+ }
+ result[`${v.cardWide}-${v.xcoordinate}`].push(v)
})
- //console.log(this.$CONFIG.DEFAULT_GRID.copmsList,this.$CONFIG.DEFAULT_GRID.layout,234)
+ let resdata = []
+ Object.values(result).forEach(v => {
+ let min = v.sort((a,b) => a.ycoordinate - b.ycoordinate)[0];
+ let minYX = Number(min.ycoordinate)*10 + Number(min.xcoordinate);
+ let obj = {};
+ obj[minYX] = v;
+ resdata.push(obj);
+ })
+ var lastData = resdata.map(v => Object.values(v));
+ //杞寲
+ var copmsList = lastData.map(function(outerArray) {
+ // 璁块棶鏈�鍐呭眰鐨勫璞℃暟缁�
+ var innerArray = outerArray[0];
+ return innerArray.map(function(obj) {
+ return obj.cardKey;
+ });
+ });
+ //淇濊瘉鏈�4涓暟缁勶紝鎵嶈兘鎷栨嫿
+ var neededLength = 4 - copmsList.length;
+ for (var i = 0; i < neededLength; i++) {
+ copmsList.push([]);
+ }
+ this.$CONFIG.DEFAULT_GRID.copmsList = copmsList;
+ this.$CONFIG.DEFAULT_GRID.layout = layout;
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))
+ this.grid = this.$TOOL.data.get("grid") || JSON.parse(JSON.stringify(this.defaultGrid));
+ console.log(this.$TOOL.data.get("grid"),JSON.parse(JSON.stringify(this.defaultGrid)),555)
}
})
},
//寮�鍚嚜瀹氫箟
custom(){
- this.customizing = true
+ this.customizing = true;
const oldWidth = this.$refs.widgets.offsetWidth
this.$nextTick(() => {
const scale = this.$refs.widgets.offsetWidth / oldWidth
@@ -224,8 +250,23 @@
},
//杩藉姞
push(item){
- let target = this.grid.copmsList[0]
- target.push(item.key)
+ var that = this;
+ var target = this.grid;
+ if(this.grid.copmsList.length == 0) {
+ target.copmsList.push([item.key]);
+ }else {
+ target.copmsList[0].push(item.key)
+ }
+ this.$nextTick(()=> {
+ var height = String(Math.floor(this.$refs.Access[0].offsetHeight/ 57));
+ item.cardLength = height;
+ item.cardWide = '12';
+ item.xcoordinate = '0';
+ //item.ycoordinate = '4';
+ item.cardKey = item.key;
+ item.workbenchId = that.workid;
+ target.data.push(item);
+ })
},
//闅愯棌缁勪欢
remove(item){
@@ -253,7 +294,6 @@
this.$message.success("鎿嶄綔鎴愬姛");
}
})
- console.log(this.grid,111)
},
//鎭㈠榛樿
backDefaul(){
--
Gitblit v1.9.3