字典项

src/api/file/file.js

@@ -0,0 +1,14 @@
+import request from '/@/utils/request';
+
+const moduleName = 'biz-vordm'
+
+export const uploadFile = (row) => {
+    return request({
+      url: '/api/' + moduleName + '/ui/upload/uploadFile',
+      method: 'post',
+      headers: {
+          'Content-Type': 'multipart/form-data'
+      },
+      data: row,
+    })
+  }

src/views/dataService/disasterPartners/component/upload.vue

@@ -3,12 +3,12 @@
     <el-form :model="state.ruleForm" size="default" label-width="150px" :rules="rules" ref="adminAddFormRef">
       <el-form-item prop="title" label="name">
         <el-select v-model="state.ruleForm.title" class="m-2" placeholder="please enter name">
-          <el-option label="GDACS" value="GDACS"></el-option>
+          <el-option v-for="(item,index) in state.disasterReductionPartnersList" :key="index" :label="item.dictKey" :value="item.dictKey"></el-option>
-          <el-option label="Charter" value="Charter"></el-option>
+          <!-- <el-option label="Charter" value="Charter"></el-option>
           <el-option label="USGS" value="USGS"></el-option>
           <el-option label="INGV" value="INGV"></el-option>
           <el-option label="UNITAR" value="UNITAR"></el-option>
-          <el-option label="Copernicus" value="Copernicus"></el-option>
+          <el-option label="Copernicus" value="Copernicus"></el-option> -->
         </el-select>
       </el-form-item>
       <el-form-item prop="link" label="link">
@@ -33,6 +33,9 @@
 import { reactive, ref } from "vue";
 import { saveWebsites } from '/@/api/websites/websites.js';
 import { ElMessage } from "element-plus";
+import {  getDictionary } from  '/@/api/system/dictbiz';
+
+
 const upFileRef = ref();
 const emit = defineEmits(['callback']);
 const adminAddFormRef = ref();
@@ -42,6 +45,7 @@ const state = reactive({
   ruleForm: {
     title: null,
   },
+  disasterReductionPartnersList:[]
 })
 
 //校验规则
@@ -66,6 +70,7 @@ const resetField = () => {
 
 // 打开弹窗
 const openDialog = (row) => {
+  initDic()
   state.isShowDialog = true;
   state.ruleForm.disasterId = row;
 };
@@ -93,7 +98,12 @@ const onSubmit = () => {
     }
   })
 };
-
+const initDic = ()=>{
+  getDictionary({ code: 'DisasterReductionPartners' }).then((res) => {
+		state.disasterReductionPartnersList = res;
+    console.log(state.disasterReductionPartnersList)
+	});
+}
 
 // 暴露变量
 defineExpose({

src/views/system/dic/dialog.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="system-dic-dialog-container">
-    <el-dialog :title="state.dialog.title" v-model="state.dialog.isShowDialog" width="769px">
+    <el-dialog :title="state.dialog.title" v-model="state.dialog.isShowDialog" width="769px" destroy-on-close>
       <!-- <el-alert title="半成品，交互过于复杂，请自行扩展！"
                 type="warning"
                 :closable="false"
@@ -24,8 +24,8 @@
           </el-col>
           <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
             <el-row :gutter="35" v-for="(v, k) in state.ruleForm.children" :key="k">
-              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
-                <el-form-item :prop="`list[${k}].label`" label-width="240">
+                <el-form-item :prop="`list[${k}].label`" label-width="205">
                   <template #label>
                     <el-button type="primary" circle size="small" @click="onAddRow" v-if="k === state.ruleForm.children.length-1">
                       <el-icon>
@@ -37,12 +37,30 @@
                         <ele-Delete />
                       </el-icon>
                     </el-button>
-                    <span class="ml10">Dictionary Name</span>
+                    <span class="ml10" v-if="state.ruleForm.dictKey == 'DisasterReductionPartners'">Partners Name</span>
+                    <span class="ml10" v-else>Dictionary Name</span>
                   </template>
-                  <el-input v-model="v.dictValue" style="width: 100%" placeholder="Please enter a Dictionary Name"> </el-input>
+                  <el-input v-if="state.ruleForm.dictKey == 'DisasterReductionPartners'" v-model="v.dictKey" style="width: 100%" placeholder="Please enter a Dictionary Name"> </el-input>
+                  <el-input v-else v-model="v.dictValue" style="width: 100%" placeholder="Please enter a Disaster Reduction Partners Name"> </el-input>
                 </el-form-item>
               </el-col>
-              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" v-if="state.ruleForm.dictKey == 'DisasterReductionPartners'">
+                <el-form-item label="Partners Logo" :prop="`list[${k}].value`" label-width="100">
+                  <el-upload
+                      class="avatar-uploader"
+                      :show-file-list="false"
+                      :auto-upload="true"
+                      :http-request="upLoadImg"
+                      :data="v"
+                      accept="image/*"
+                    >
+                    <img v-if="v.dictValue" :src="v.dictValue" class="avatar" />
+                    <el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
+                  </el-upload>
+                  <el-input type="hidden" v-model="v.dictValue" style="width: 100%" placeholder="Please enter a Dictionary Value"> </el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" v-else>
                 <el-form-item label="Dictionary Value" :prop="`list[${k}].value`" label-width="180">
                   <el-input v-model="v.dictKey" style="width: 100%" placeholder="Please enter a Dictionary Value"> </el-input>
                 </el-form-item>
@@ -70,7 +88,8 @@
 import { RowAlign } from 'element-plus';
 import { reactive, ref } from 'vue';
 import { update } from '/@/api/system/dictbiz';
-
+import { Plus } from '@element-plus/icons-vue'
+import { uploadFile } from '/@/api/file/file'
 // 定义子组件向父组件传值/事件
 const emit = defineEmits(['refresh']);
 
@@ -93,6 +112,14 @@ const state = reactive({
 });
 
 
+const upLoadImg = (d)=>{
+  uploadFile({file:d.file}).then(res =>{
+    d.data.dictValue = res.link
+  })
+  //d.data.dictValue = 44563
+}
+
+
 // 打开弹窗
 const openDialog = (type, row) => {
 
@@ -108,6 +135,13 @@ const openDialog = (type, row) => {
   } else {
     state.dialog.title = 'Add';
     state.dialog.submitTxt = 'Add';
+    state.ruleForm = {
+      dictValue: '', // 字典名称
+      dictKey: '', // 字段名
+      children: [], // 子集字段 + 属性值
+      remark: '', // 字典描述
+      status: false, // 字典状态
+    }
     if (!state.ruleForm.children || state.ruleForm.children.length === 0) {
       state.ruleForm.children=[{ dictValue: '', dictKey: '' }];
     }
@@ -160,3 +194,31 @@ defineExpose({
   openDialog,
 });
 </script>
+<style scoped>
+:deep(.avatar-uploader .avatar) {
+  width: 178px;
+  height: 178px;
+  display: block;
+}
+:deep(.avatar-uploader .el-upload) {
+  border: 1px dashed var(--el-border-color);
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+  transition: var(--el-transition-duration-fast);
+}
+
+:deep(.avatar-uploader .el-upload:hover) {
+  border-color: var(--el-color-primary);
+}
+
+:deep(.el-icon.avatar-uploader-icon) {
+  font-size: 28px;
+  color: #8c939d;
+  width: 178px;
+  height: 178px;
+  text-align: center;
+}
+
+</style>