licp
2024-04-18 caba724b7025dd8801ed590bed3d8d56579d6a8c
src/components/tool/value-table.vue
@@ -131,6 +131,7 @@
                  <span v-else-if="data.linkEvent&&showLink(a.label, data.linkEvent)" style="color:#409EFF;cursor: pointer;"
                     @click="handleLinkEvent(scope.row,data.linkEvent[a.label])">{{scope.row[a.label]}}</span>
            <img style="width: 40px;height: 40px;margin-top: 10px;" :src="javaApi+'/img/'+scope.row[a.label]" v-else-if="showUpload(a.label)&&scope.row[a.label]" alt="">
            <span v-else-if="showCascader(a.label)&&scope.row[a.label]">{{handleTree(data.cascaderField[a.label].tree,scope.row[a.label].split(',')[scope.row[a.label].split(',').length-1])}}</span>
                  <span v-else>{{scope.row[a.label]}}</span>
               </template>
            </el-table-column>
@@ -174,7 +175,7 @@
                  </el-col>
                  <el-col :span="16/data.row">
                     <el-input v-model="upData[a.label]" size="small" clearable :placeholder="`请输入${a.value}`"
                        v-if="showType(a.label, data.selectField) == null&&!showUpload(a.label)" :disabled="isDisabled(a.label)"></el-input>
                        v-if="showType(a.label, data.selectField) == null&&!showUpload(a.label)&&!showCascader(a.label)" :disabled="isDisabled(a.label)"></el-input>
                     <el-select v-model="upData[a.label]" :multiple="data.selectField[a.label].choose" size="small"
                        v-if="showType(a.label, data.selectField) != null" style="width: 100%;" :disabled="isDisabled(a.label)"
                        clearable>
@@ -197,7 +198,17 @@
              style="background: transparent;width: 80px;height: 80px;border: 1px solid #DCDFE6;border-radius: 6px;margin: 10px 0;">
              <img v-if="upData[a.label]" :src="javaApi+'/img/'+upData[a.label]" class="avatar" style="width: 80px;height: 80px;border-radius: 6px;">
              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                        </el-upload>
                     </el-upload>
              <el-cascader
              :value="upData[a.label]"
              :options="data.cascaderField[a.label].tree"
              v-if="showCascader(a.label)"
              :show-all-levels="false"
              clearable
              :props="data.cascaderField.props"
              size="small"
              style="width: 100%;"
              @change="m=>handleCascader(m,a.label)"></el-cascader>
                  </el-col>
               </div>
            </div>
@@ -208,7 +219,7 @@
                  </el-col>
                  <el-col :span="16" :offset="1">
                     <el-input v-model="upData[a.label]" size="small" clearable :placeholder="`请输入${a.value}`"
                        v-if="showType(a.label, data.selectField) == null&&!showUpload(a.label)" :disabled="isDisabled(a.label)"></el-input>
                        v-if="showType(a.label, data.selectField) == null&&!showUpload(a.label)&&!showCascader(a.label)" :disabled="isDisabled(a.label)"></el-input>
                     <el-select v-model="upData[a.label]" :multiple="data.selectField[a.label].choose" size="small"
                        v-if="showType(a.label, data.selectField) != null" style="width: 100%;" :disabled="isDisabled(a.label)"
                        clearable>
@@ -230,7 +241,8 @@
              style="background: transparent;width: 80px;height: 80px;border: 1px solid #DCDFE6;border-radius: 6px;margin: 10px 0;">
              <img v-if="upData[a.label]" :src="javaApi+'/img/'+upData[a.label]" class="avatar" style="width: 80px;height: 80px;border-radius: 6px;">
              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                        </el-upload>
                     </el-upload>
              <el-cascader :value="upData[a.label]" :options="data.cascaderField[a.label].tree" :show-all-levels="false" v-if="showCascader(a.label)" clearable :props="data.cascaderField.props" size="small" style="width: 100%;" @change="m=>handleCascader(m,a.label)"></el-cascader>
                  </el-col>
               </el-row>
            </div>
@@ -249,7 +261,7 @@
                     </span>{{a.value}}:</el-col>
                  <el-col :span="16/data.row" :offset="1">
                     <el-input v-model="upData[a.label]" size="small" clearable :placeholder="`请输入${a.value}`"
                        v-if="showType(a.label, data.selectField) == null&&!showUpload(a.label)"></el-input>
                        v-if="showType(a.label, data.selectField) == null&&!showUpload(a.label)&&!showCascader(a.label)"></el-input>
                     <el-select v-model="upData[a.label]" size="small" v-if="showType(a.label, data.selectField) != null"
                        style="width: 100%;" :placeholder="`请选择${a.value}`" clearable>
                        <el-option v-for="(b, bi) in data.selectField[a.label].select" :key="bi" :value="b.value"
@@ -271,6 +283,7 @@
              <img v-if="upData[a.label]" :src="javaApi+'/img/'+upData[a.label]" class="avatar" style="width: 80px;height: 80px;border-radius: 6px;">
              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                        </el-upload>
              <el-cascader :options="data.cascaderField[a.label].tree" v-if="showCascader(a.label)" clearable :props="data.cascaderField.props" size="small" style="width: 100%;" :show-all-levels="false" @change="m=>handleCascader(m,a.label)"></el-cascader>
                  </el-col>
               </div>
            </div>
@@ -280,7 +293,7 @@
                     </span>{{a.value}}:</el-col>
                  <el-col :span="16" :offset="1">
                     <el-input v-model="upData[a.label]" size="small" clearable :placeholder="`请输入${a.value}`"
                        v-if="showType(a.label, data.selectField) == null&&!showUpload(a.label)"></el-input>
                        v-if="showType(a.label, data.selectField) == null&&!showUpload(a.label)&&!showCascader(a.label)"></el-input>
                     <el-select v-model="upData[a.label]" size="small" v-if="showType(a.label, data.selectField) != null"
                        style="width: 100%;" :placeholder="`请选择${a.value}`" clearable>
                        <el-option v-for="(b, bi) in data.selectField[a.label].select" :key="bi" :value="b.value"
@@ -302,6 +315,7 @@
              <img v-if="upData[a.label]" :src="javaApi+'/img/'+upData[a.label]" class="avatar" style="width: 80px;height: 80px;border-radius: 6px;">
              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                        </el-upload>
              <el-cascader :options="data.cascaderField[a.label].tree" v-if="showCascader(a.label)" clearable :props="data.cascaderField.props" size="small" style="width: 100%;" :show-all-levels="false" @change="m=>handleCascader(m,a.label)"></el-cascader>
                  </el-col>
               </el-row>
            </div>
@@ -477,7 +491,7 @@
                  this.$refs.eltable.doLayout()
               })
            }
         }
         },
      },
      mounted() {
         this.data = this.componentData
@@ -690,13 +704,41 @@
          return false;
        }
      },
      showCascader(label){
        if(this.data.cascaderField&&this.data.cascaderField[label]){
          return true;
        }else{
          return false;
        }
      },
      handleTree(arr,value){
        let label = ''
        for (let i = 0; i < arr.length; i++) {
          if(arr[i].id==value){
            label = arr[i].name
            return label
          }else if(arr[i].children){
            label = this.handleTree(arr[i].children,value)
          }
        }
        return label
      },
         main(row, val) {
            if (val.method == undefined) return
            else if (val.method == 'doDiy') {
               if (val.id == 'update') {
                  this.upDia = true,
                     this.upData = this.HaveJson(row)
                  this.upData = this.HaveJson(row)
                  this.upHead = this.HaveJson(this.tableHead)
            this.upHead.forEach((item,index)=>{
              if(this.data.cascaderField&&this.data.cascaderField[item.label]){
                if(this.upData[item.label]){
                  this.upData[item.label] = this.upData[item.label].split(',').map(m=>Number(m));
                }else{
                  this.upData[item.label] = []
                }
              }
            })
                  this.upHead = this.upHead.filter(a => a.label != 'createTime' && a.label != 'updateTime')
                  delete this.upData.orderBy
                  delete this.upData.createTime
@@ -769,6 +811,15 @@
                  this.upData[a] = JSON.stringify(this.upData[a])
               }
            }
        this.upHead.forEach((item,index)=>{
          if(this.data.cascaderField&&this.data.cascaderField[item.label]){
            if(this.upData[item.label]){
              this.upData[item.label] = this.upData[item.label].join(',');
            }else{
              this.upData[item.label] = ''
            }
          }
        })
            this.$axios.post(this.upUrl, this.upData, {
               headers: {
                  'Content-Type': 'application/json'
@@ -781,6 +832,7 @@
               this.$message.success('修改成功')
               this.upDia = false
               this.selectList()
          this.$refs.eltable.doLayout();
               this.upLoad = false
            }).catch(e => {
               this.$message.error('修改失败')
@@ -1008,7 +1060,35 @@
            this.selectList()
          }
        }
      }
      },
      handleCascader(e,label){
        this.upData[label] = e;
      },
      // 批量删除
      batchDelete(){
        if(this.multipleSelection&&this.multipleSelection.length>0){
          // this.delUrl
          this.$confirm('是否删除选中的数据?', "警告", {
                     confirmButtonText: "确定",
                     cancelButtonText: "取消",
                     type: "warning"
                  }).then(() => {
                     this.$axios.post(this.delUrl, {
                        id: this.multipleSelection.map(item => item.id).join(',')
                     }).then(res => {
                        if (res.code === 201) {
                           return
                        }
                        this.$message.success('删除成功')
                        this.selectList()
                     }).catch(e => {
                        this.$message.error('删除失败')
                     })
                  }).catch(() => {})
        }else{
          this.$message.error('请选择要删除的数据')
        }
      },
      }
   }
</script>