From caba724b7025dd8801ed590bed3d8d56579d6a8c Mon Sep 17 00:00:00 2001 From: licp <lichunping@guanfang.com.cn> Date: 星期四, 18 四月 2024 17:14:45 +0800 Subject: [PATCH] 完成实验室资质页面编写 --- src/components/tool/value-table.vue | 98 ++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 89 insertions(+), 9 deletions(-) diff --git a/src/components/tool/value-table.vue b/src/components/tool/value-table.vue index 58466cf..8448999 100644 --- a/src/components/tool/value-table.vue +++ b/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> -- Gitblit v1.9.3