update

gaoshp

2024-11-03 3931e2728f618d0090f129b2665bc1285c4440c3

 src/views/home/widgets/index.vue

@@ -90,7 +90,7 @@
               </div>
            </el-main>
            <el-footer style="height:51px;">
               <el-button size="small" @click="backDefaul()">恢复默认</el-button>
               <el-button size="small" @click="backDefaul()">关闭</el-button>
            </el-footer>
         </el-container>
      </div>
@@ -156,7 +156,7 @@
      },
      methods: {
         endDraggable(e) {
            console.log(e,this.grid)
            //console.log(this.grid,e,111)
         },
         getWorkbenchCarList() {
            var data = this.$TOOL.data.get("MENU");
@@ -169,64 +169,77 @@
                  //按ycoordinate进行从小到大排序，如果ycoordinate一样时，按照xcoordinate从小到大排序
                  //cardWide代表宽度
                  //cardKey代表组件名称
                  cards.sort((a, b) => {  
                     // 先比较 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;
                  });			
                  var layout = [...new Set(cards.map(v => v.cardWide *2))];  //布局
                  if(layout.length < 3) {
                     layout = [24,12,6,6];
                  } 
                  // cards.sort((a, b) => {  
                  //    // 先比较 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;
                  // });			
                  // 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)
                  })
                  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;  
                     });  
                  }); 
                  // cards.forEach(v=> {
                  //    if(!result[`${v.cardWide}-${v.xcoordinate}`]) {
                  //       result[`${v.cardWide}-${v.xcoordinate}`] = []
                  //    }
                  //    result[`${v.cardWide}-${v.xcoordinate}`].push(v)
                  // })
                  // 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([]);
                  // 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.$CONFIG.DEFAULT_GRID.copmsList = [["mdcDeviceStatus"],["mdcRunning","mdcEquipmentRun"],[],[]]
                  if(res.data.length == 0) {
                     this.$CONFIG.DEFAULT_GRID.copmsList = [[],[],[],[]];
                  }else {
                     var layoutConfig = JSON.parse(res.data[0].layoutConfig);
                     //不满足4，补足
                     var newArr = [...layoutConfig];  
                     for (let i = 0; i < (4-newArr.length); i++) {  
                        layoutConfig.push([]);
                     }
                     this.$CONFIG.DEFAULT_GRID.copmsList = res.data[0].layoutConfig == null?[]:layoutConfig;
                  }
                  this.$CONFIG.DEFAULT_GRID.copmsList = copmsList;
                  this.$CONFIG.DEFAULT_GRID.layout = layout;
                  this.$CONFIG.DEFAULT_GRID.data = cards;
                  this.$CONFIG.DEFAULT_GRID.layout = [24,12,6,6];
                  this.$CONFIG.DEFAULT_GRID.data = res.data;
                  this.defaultGrid = this.$CONFIG.DEFAULT_GRID;
                  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)
               }
            })
         },
@@ -258,10 +271,10 @@
               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';
               //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;
@@ -270,23 +283,37 @@
         },
         //隐藏组件
         remove(item){
            var newCopmsList = this.grid.copmsList
            newCopmsList.forEach((obj, index) => {
               var newObj = obj.filter(o=>o!=item)
               newCopmsList[index] = newObj;
            this.$nextTick(()=> {
               var newCopmsList = this.grid.copmsList;
               newCopmsList.forEach((obj, index) => {
                  var newObj = obj.filter(o=>o!=item)
                  newCopmsList[index] = newObj;
               })
               this.grid.data.forEach((item1,index1)=> {
                  if(item1.cardKey == item) {
                     this.grid.data.splice(index1,1);
                  }
               })
            })
         },
         //保存
         save(){
            this.customizing = false
            this.$refs.widgets.style.removeProperty('transform')
            this.$TOOL.data.set("grid", this.grid)
            this.$TOOL.data.set("grid", this.grid);
            //this.apiResource.workStationIdList
            //保存接口
            var copmsList = this.grid.copmsList;
            var flattened = copmsList.reduce((acc, val) => acc.concat(val), []); //扁平化 
            var data = this.grid.data.filter(item=>flattened.includes(item.cardKey));
            //var copmsList = this.grid.copmsList;
            //var flattened = copmsList.reduce((acc, val) => acc.concat(val), []); //扁平化 
            //var data = this.grid.data.filter(item=>this.nowCompsList.includes(item.cardKey));
            this.grid.data.forEach(item=> {
               item.layoutConfig = JSON.stringify(this.grid.copmsList);
               if(item.cardKey == "mdcRunning") {
                  item.apiResource = JSON.stringify({workStationIdList: []})
               }
            })
            var obj = {
               workbenchCardAddVOList: data,
               workbenchCardAddVOList: this.grid.data,
               workbenchId: this.workid
            }
            this.$HTTP.post(`/api/blade-system/workbench-card/create-workbench-card`,obj).then(res=> {
@@ -299,8 +326,8 @@
         backDefaul(){
            this.customizing = false
            this.$refs.widgets.style.removeProperty('transform')
            this.grid =  JSON.parse(JSON.stringify(this.defaultGrid))
            this.$TOOL.data.remove("grid")
            // this.grid =  JSON.parse(JSON.stringify(this.defaultGrid))
            // this.$TOOL.data.remove("grid")
         },
         //关闭
         close(){