From 1988d77f4df3c01a9137303e0c959b3442c14377 Mon Sep 17 00:00:00 2001 From: lzhe <lzhe@example.com> Date: 星期一, 30 九月 2024 22:10:30 +0800 Subject: [PATCH] 1 --- src/views/home/widgets/index.vue | 52 +++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 41 insertions(+), 11 deletions(-) diff --git a/src/views/home/widgets/index.vue b/src/views/home/widgets/index.vue index 93d9d19..d8be842 100644 --- a/src/views/home/widgets/index.vue +++ b/src/views/home/widgets/index.vue @@ -39,7 +39,6 @@ <div class="widgets-aside-title"><el-icon><el-icon-circle-plus-filled/></el-icon>娣诲姞閮ㄤ欢</div> <div class="widgets-aside-close" @click="close()"><el-icon><el-icon-close /></el-icon></div> </el-header> - {{grid.layout.join(',')}},xxxx <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])"> @@ -61,6 +60,14 @@ <el-col :span="24"><span></span></el-col> <el-col :span="24"><span></span></el-col> <el-col :span="24"><span></span></el-col> + </el-row> + </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> + <el-col :span="12"><span></span></el-col> + <el-col :span="6"><span></span></el-col> + <el-col :span="6"><span></span></el-col> </el-row> </div> </div> @@ -113,7 +120,7 @@ this.getWorkbenchCarList(); }, mounted() { - this.$emit('on-mounted') + this.$emit('on-mounted'); }, computed: { allCompsList(){ @@ -183,16 +190,39 @@ 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; + return 0; + }); + var layout = [...new Set(cards.map(v => v.cardWide *2))]; //甯冨眬 + 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; + }); + }); + 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)); } }) }, @@ -304,8 +334,8 @@ .selectLayout {width: 100%;display: flex;} .selectLayout-item {width:60px;height:60px;border: 2px solid var(--el-border-color-light);padding:5px;cursor: pointer;margin-right: 15px;} .selectLayout-item span {display: block;background: var(--el-border-color-light);height:46px;} - .selectLayout-item.item02 span {height:30px;} - .selectLayout-item.item02 .el-col:nth-child(1) span {height:14px;margin-bottom: 2px;} + .selectLayout-item.item02 span,.selectLayout-item.item04 span {height:30px;} + .selectLayout-item.item02 .el-col:nth-child(1) span,.selectLayout-item.item04 .el-col:nth-child(1) span {height:14px;margin-bottom: 2px;} .selectLayout-item.item03 span {height:14px;margin-bottom: 2px;} .selectLayout-item:hover {border-color: var(--el-color-primary);} .selectLayout-item.active {border-color: var(--el-color-primary);} -- Gitblit v1.9.3