From f7d9aabb6e5d8f86579d942e42cc11785b096623 Mon Sep 17 00:00:00 2001 From: licp <lichunping@guanfang.com.cn> Date: 星期一, 15 四月 2024 14:41:15 +0800 Subject: [PATCH] 完成用户管理优化 --- src/components/view/home.vue | 15 +++++ src/components/tool/value-table.vue | 100 ++++++++++++++++++++++++++++++-- src/main.js | 3 src/components/view/person-manage.vue | 7 ++ 4 files changed, 115 insertions(+), 10 deletions(-) diff --git a/src/components/tool/value-table.vue b/src/components/tool/value-table.vue index 6942552..0c7ee99 100644 --- a/src/components/tool/value-table.vue +++ b/src/components/tool/value-table.vue @@ -89,6 +89,12 @@ .handleBtn.is-disabled .el-upload:focus{ color: #C0C4CC !important; } + .avatar-uploader .el-upload{ + height: 80px; + display: flex; + align-items: center; + justify-content: center; + } </style> <template> @@ -124,6 +130,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>{{scope.row[a.label]}}</span> </template> </el-table-column> @@ -167,7 +174,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" :disabled="isDisabled(a.label)"></el-input> + v-if="showType(a.label, data.selectField) == null&&!showUpload(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> @@ -175,6 +182,22 @@ :label="b.label"> </el-option> </el-select> + <el-upload + :action="javaApi+data.addUploadConfig.url" + v-if="showUpload(a.label)" + :on-success="m=>handleSuccessUp(m, a.label)" + :show-file-list="false" + :headers="token" + name="file" + :multiple="false" + :accept='data.addUploadConfig.accept' + :on-error="onError" + ref='upload' + class="avatar-uploader" + 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-col> </div> </div> @@ -185,13 +208,29 @@ </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" :disabled="isDisabled(a.label)"></el-input> + v-if="showType(a.label, data.selectField) == null&&!showUpload(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> <el-option v-for="(b, bi) in data.selectField[a.label].select" :key="bi" :value="b.value" :label="b.label"></el-option> </el-select> + <el-upload + :action="javaApi+data.addUploadConfig.url" + v-if="showUpload(a.label)" + :multiple="false" + :on-success="m=>handleSuccessUp(m, a.label)" + :show-file-list="false" + :headers="token" + name="file" + :accept='data.addUploadConfig.accept' + :on-error="onError" + ref='upload' + class="avatar-uploader" + 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-col> </el-row> </div> @@ -210,12 +249,28 @@ </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"></el-input> + v-if="showType(a.label, data.selectField) == null&&!showUpload(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" :label="b.label"></el-option> </el-select> + <el-upload + :action="javaApi+data.addUploadConfig.url" + v-if="showUpload(a.label)" + :on-success="m=>handleSuccessUp(m, a.label)" + :show-file-list="false" + :headers="token" + :multiple="false" + name="file" + :accept='data.addUploadConfig.accept' + :on-error="onError" + ref='upload' + class="avatar-uploader" + 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-col> </div> </div> @@ -225,12 +280,28 @@ </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"></el-input> + v-if="showType(a.label, data.selectField) == null&&!showUpload(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" :label="b.label"></el-option> </el-select> + <el-upload + :action="javaApi+data.addUploadConfig.url" + v-if="showUpload(a.label)" + :on-success="m=>handleSuccessUp(m, a.label)" + :show-file-list="false" + :headers="token" + name="file" + :multiple="false" + :accept='data.addUploadConfig.accept' + :on-error="onError" + ref='upload' + class="avatar-uploader" + 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-col> </el-row> </div> @@ -612,6 +683,13 @@ } return false }, + showUpload(label){ + if(this.data.addUpload.find(m=>m==label)){ + return true; + }else{ + return false; + } + }, main(row, val) { if (val.method == undefined) return else if (val.method == 'doDiy') { @@ -919,10 +997,16 @@ }) return count * 15 + 60 + 'px' }, - handleSuccessUp(response){ - if(response.code==200){ - this.$message.success('涓婁紶鎴愬姛') - this.selectList() + handleSuccessUp(response,label){ + if(label){ + if(response.code==200){ + this.upData[label] = response.data.url; + } + }else{ + if(response.code==200){ + this.$message.success('涓婁紶鎴愬姛') + this.selectList() + } } } } diff --git a/src/components/view/home.vue b/src/components/view/home.vue new file mode 100644 index 0000000..2f83209 --- /dev/null +++ b/src/components/view/home.vue @@ -0,0 +1,15 @@ +<template> + <div class="home-page"> + + </div> +</template> + +<script> +export default { + +} +</script> + +<style scoped> + +</style> diff --git a/src/components/view/person-manage.vue b/src/components/view/person-manage.vue index 6b6a58d..addf22c 100644 --- a/src/components/view/person-manage.vue +++ b/src/components/view/person-manage.vue @@ -137,6 +137,11 @@ } }, requiredAdd:['account','name','state','roleId','password'], + addUpload:['pictureUrl','signatureUrl'], + addUploadConfig:{ + accept:'.png, .jpg, .jpeg, .gif', + url:this.$api.deviceScope.uploadFile + }, requiredUp:['account','name','state','roleId'] }, entityCopy: {}, @@ -196,4 +201,4 @@ } } } -</script> \ No newline at end of file +</script> diff --git a/src/main.js b/src/main.js index 018e938..b4a6209 100644 --- a/src/main.js +++ b/src/main.js @@ -13,7 +13,8 @@ //鏈湴 Vue.prototype.LOCATIONVUE = "http://127.0.0.1:80"; -const javaApi = 'http://192.168.0.24:8001';//鏉� +// const javaApi = 'http://192.168.0.24:8001';//鏉� +const javaApi = 'http://192.168.11.249:8001';//寮� // const javaApi = 'http://114.132.189.42:9006';//娴嬭瘯鏈� //鑳滀簯鏈嶅姟鍣� // Vue.prototype.LOCATIONVUE = "http://syxt.shxiao2.cn"; -- Gitblit v1.9.3