| | |
| | | <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])"> |
| | |
| | | <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> |
| | |
| | | return 1; |
| | | } |
| | | // 如果 xcoordinate 也相同,则不交换位置 |
| | | return 0; |
| | | 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; |
| | |
| | | .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);} |