根据|分割 变成单选框

在这里插入图片描述

   <label v-for="(item,index) in scope.row.qualityValue.split('|')" :key="index">
	<el-radio  v-if="scope.row.attrType=='C'" v-model="radiolist[scope.$index]" :label="item" @change="xuanZe(scope.row.x2,scope.row.attrId,scope.row.qctaskNo,'x2',item,scope.$index)">{{item}}</el-radio>
</label>

根据|分割 变成下拉框

在这里插入图片描述

 <el-select v-if="scope.row.attrType=='C'" v-model="scope.row.x1" placeholder="请选择" @change="change1(scope.row.x1,scope.row.attrId,scope.row.qctaskNo,'x1')">
	<el-option v-for="(item,index) in scope.row.qualityValue.split('|')" :key="item" :label="item" :value="item">
    </el-option>
</el-select>

相同单号合并

在这里插入图片描述

 <el-table  :stripe="true" :border="true" v-loading="loading" :data="checkdataList" :span-method="objectSpanMethod">
  </el-table>


    //合并单元格
    flitterData(arr) {
      let spanOneArr = [],
        spanTwoArr = [],
        spanThreeArr = [],
        concatOne = 0,
        concatTwo = 0,
        concatThree = 0;
      arr.forEach((item, index) => {
        if (index === 0) {
          spanOneArr.push(1);
          spanTwoArr.push(1);
          spanThreeArr.push(1);
        } else {
          if (item.qctaskNo === arr[index - 1].qctaskNo && item.box_qty === arr[index - 1].box_qty) { //第三列需合并相同内容的判断条件
            spanThreeArr[concatThree] += 1;
            spanThreeArr.push(0);
          } else {
            spanThreeArr.push(1);
            concatThree = index;
          };
        }
      });
      return {
        three: spanThreeArr
      }
    },

    objectSpanMethod({row, column, rowIndex, columnIndex}) {

      if (columnIndex === 1) {
        const _row = (this.flitterData(this.checkdataList).three)[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          rowspan: _row,
          colspan: _col
        };
      }
    }
Logo

基于 Vue 的企业级 UI 组件库和中后台系统解决方案,为数万开发者服务。

更多推荐