字典项

2023-11-16 17:19:42 +08:00 · 2023-11-16 17:19:42 +08:00 · 02819dbfa2
parent 2065fb080d
commit 02819dbfa2
3 changed files with 97 additions and 11 deletions
--- a/src/api/file/file.js
+++ b/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,
+    })
+  }
--- a/src/views/dataService/disasterPartners/component/upload.vue
+++ b/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 label="Charter" value="Charter"></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="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({
--- a/src/views/system/dic/dialog.vue
+++ b/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-form-item :prop="`list[${k}].label`" label-width="240">
+              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+                <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>