dev

src/components/UpLoad.vue

@@ -1,59 +1,58 @@
 <template>
   <el-upload
       class="avatar-uploader"
-      :action="url"
+      :action="uploadUrl"
       :show-file-list="false"
       :on-success="handleSuccess"
       :before-upload="beforeUpload"
       :on-error="handleError"
   >
     <img v-if="imageUrl" :src="imageUrl" class="avatar" alt=""/>
-    <el-icon v-else><Plus /></el-icon>
+    <el-icon v-else class="avatar-uploader-icon">
+      <Plus/>
+    </el-icon>
   </el-upload>
 </template>
 
 <script setup lang="ts">
 import {ElMessage} from 'element-plus'
 import {Plus} from '@element-plus/icons-vue'
-import {defineModel, onMounted, ref} from 'vue'
+import {defineModel, onMounted, ref, watch} from 'vue'
 import {loadConfig} from "@/utils/config.ts";
-import {post} from "@/utils/request.ts";
+
-const url = defineModel()
+const imageName = defineModel()
 const imageUrl = ref<any>()
-const getImageUrl = (url: any) => {
+const uploadUrl= ref<any>()
-  loadConfig().then(res=>{
+const getImageUrl = (imageName:any) => {
-    imageUrl.value = res.base_url +'file/getImage/'+ url
+  loadConfig().then(res => {
+    imageUrl.value = res.base_url + 'file/getImage/' + imageName
   })
 }
 const emit = defineEmits(['uploadSuccess'])
-const handleSuccess = (response:any) => {
+const handleSuccess = (response: any) => {
   ElMessage.success('文件上传成功！'); // 添加成功提示
   getImageUrl(response.data)
-  emit('uploadSuccess',response.data)
+  emit('uploadSuccess', response.data)
 }
 const handleError = () => {
   ElMessage.error('文件上传失败');
 }
 
-const beforeUpload = (file:any) => {
+const beforeUpload = (file: any) => {
   const isLt2M = file.size / 1024 / 1024 < 2;
   if (!isLt2M) {
     ElMessage.error('上传文件大小不能超过 2MB!');
   }
   return isLt2M;
 }
-const list = ref<any>([])
+onMounted(() => {
-onMounted(async ()=>{
-  list.value = await post("common/config/list")
-  list.value.forEach((item: any) => {
-    if (item.k == "logoUrl") {
   loadConfig().then((res: any) => {
-        imageUrl.value = res.base_url + 'file/getImage/' + item.val
+    uploadUrl.value = res.base_url + "file/upload";
-      })
-    }
   })
 })
-defineExpose({getImageUrl})
+watch(imageName,(newValue)=>{
+  getImageUrl(newValue)
+}, {deep: true})
 </script>
 <style scoped>
 .avatar-uploader .el-upload {
@@ -63,19 +62,23 @@ defineExpose({getImageUrl})
   position: relative;
   overflow: hidden;
 }
+
 .avatar-uploader .el-upload:hover {
   border-color: #409EFF;
 }
+
 .avatar-uploader-icon {
   font-size: 28px;
   color: #8c939d;
   width: 178px;
 }
+
 .avatar {
-  width: 178px;
+  width: 129px;
-  height: 178px;
+  height: 129px;
   display: block;
 }
+
 .avatar-uploader .el-upload {
   border: 1px dashed var(--el-border-color);
   border-radius: 6px;
@@ -92,8 +95,8 @@ defineExpose({getImageUrl})
 .el-icon.avatar-uploader-icon {
   font-size: 28px;
   color: #8c939d;
-  width: 178px;
+  width: 129px;
-  height: 178px;
+  height: 129px;
   text-align: center;
 }
 </style>

src/components/settings/MemberEdit.vue

@@ -107,7 +107,7 @@
             </el-descriptions-item>
             <el-descriptions-item label="电子签名">
               <el-form-item>
-                <UpLoad v-model="uploadURL" ref="uploadRef"
+                <UpLoad v-model="memberInfo.electronicSignature" ref="uploadRef"
                         @uploadSuccess="(url)=>{memberInfo.electronicSignature=url}"></UpLoad>
               </el-form-item>
             </el-descriptions-item>
@@ -248,9 +248,6 @@ const getById = (id:any) => {
 }
 const uploadURL = ref('')
 onMounted(() => {
-  loadConfig().then((res: any) => {
-    uploadURL.value = res.base_url + "file/upload";
-  })
   list()
 })
 const sectionList = ref<any>([])
@@ -267,6 +264,7 @@ const deleteDetail = () => {
 }
 const init = (id: any) => {
   isShow.value = true
+  uploadURL.value = ''
   if (id) {
     getById(id)
   }

src/views/settings/index.vue

@@ -26,8 +26,7 @@
               <el-input v-model="ruleForm.social_mdtrtareaAdmvs"/>
             </el-form-item>
             <el-form-item label="logo上传">
-              <UpLoad v-model="uploadURL" ref="uploadRef" @uploadSuccess="uploadSuccess"
+              <UpLoad v-model="ruleForm.logoUrl" ref="uploadRef" @uploadSuccess="uploadSuccess"></UpLoad>
-                      style="margin-left: 24px"></UpLoad>
             </el-form-item>
           </div>
           <div class="right">
@@ -69,9 +68,6 @@ const ruleForm = reactive<any>({
 })
 const uploadRef = ref<any>()
 onMounted(async () => {
-  loadConfig().then((res: any) => {
-    uploadURL.value = res.base_url + "file/upload";
-  })
   post("common/config/list", null).then((list: any) => {
     for (let i = 0; i < list.length; i++) {
       ruleForm[list[i].k] = list[i].val
@@ -148,4 +144,8 @@ const uploadSuccess = (url: any) => {
 :deep(.el-descriptions__label.el-descriptions__cell:not(.is-bordered-label).is-vertical-label) {
   padding-left: 24px;
 }
+
+:deep(.el-input__wrapper) {
+  height: 42px;
+}
 </style>