refactor: 重构区域管理文件上传组件

src/views/enterpriseModel/regionalManage/components/area-edit.vue

@@ -65,11 +65,9 @@
         </el-col>
         <el-col :span="12">
           <el-form-item label="附件：">
-            <fileUpload
+            <fileMain
               v-model="form.areaImg"
-              module="main"
-              :showLib="false"
-              :limit="1"
+         
             />
           </el-form-item>
 
@@ -107,13 +105,12 @@
 <script>
 import areaSelect from './area-select.vue';
 import areaTypeSelect from './area-type-select.vue';
-import fileUpload from '@/components/upload/fileUpload';
 import {basicAreaSaveAPI, basicAreaUpdateAPI} from "@/api/regionalManage";
 
 
 
 export default {
-  components: {areaSelect, areaTypeSelect, fileUpload},
+  components: {areaSelect, areaTypeSelect},
   props: {
     // 弹窗是否打开
     visibleFlag: Boolean,

src/views/enterpriseModel/regionalManage/index.vue

@@ -1,7 +1,6 @@
 <template>
   <div class="ele-body">
     <el-card shadow="never" v-loading="loading">
-
       <!-- 数据表格 -->
       <ele-pro-table
         ref="table"
@@ -22,7 +21,6 @@
             class="ele-btn-icon"
             @click="openEdit('add')"
             v-if="$hasPermission('main:basicarea:save')"
-
           >
             添加
           </el-button>
@@ -35,19 +33,18 @@
         </template>
         <!-- 标题列 -->
         <template v-slot:areaImg="{ row }">
-          <el-button v-if="row.areaImg.length" @click="downloadFile(row.areaImg[0])" type="text">查看</el-button>
+          <fileMain v-model="row.areaImg" type="view"></fileMain>
+         
         </template>
 
-
         <!-- 操作列 -->
         <template v-slot:action="{ row }">
           <el-link
             type="primary"
             :underline="false"
             icon="el-icon-edit"
-            @click="openEdit('update',row)"
+            @click="openEdit('update', row)"
             v-if="$hasPermission('main:basicarea:update')"
-
           >
             修改
           </el-link>
@@ -55,7 +52,7 @@
             class="ele-action"
             title="确定要删除吗？"
             @confirm="remove(row)"
-            v-if="row.id != 99999&&$hasPermission('main:basicarea:delete')"
+            v-if="row.id != 99999 && $hasPermission('main:basicarea:delete')"
           >
             <template v-slot:reference>
               <el-link type="danger" :underline="false" icon="el-icon-delete">
@@ -80,218 +77,198 @@
 </template>
 
 <script>
-import tabMixins from '@/mixins/tableColumnsMixin';
+  import tabMixins from '@/mixins/tableColumnsMixin';
 
-import areaEdit from './components/area-edit.vue';
-import {
-  listOrganizations,
-  removeOrganization
-} from '@/api/system/organization';
-import {basicAreaDeleteAPI, basicAreaPageAPI} from "@/api/regionalManage";
-import {getByCode} from "@/api/system/dictionary-data";
-import {getFile} from "@/api/system/file";
+  import areaEdit from './components/area-edit.vue';
 
-export default {
-  mixins: [tabMixins],
-  name: 'SystemOrganization',
-  components: {areaEdit},
-  data() {
-    return {
-      // 加载状态
-      loading: false,
-      // 列表数据
-      data: [],
-      dataTree: [],
-      // 选中数据
-      current: null,
-      // 是否显示表单弹窗
-      showEdit: false,
-      // 编辑回显数据
-      editData: null,
-      // 上级id
-      parentId: null,
-      dictList: {},
-      cacheKeyUrl: 'fb2f4315-enterpriseModel-organization',
-      columnsVersion: 1,
-    };
-  },
-  computed: {
-    // 表格列配置
-    columns() {
-      const version = this.columnsVersion
-      return [
-        {
-          columnKey: 'index',
-          type: 'index',
-          width: 45,
-          align: 'center',
-          showOverflowTooltip: true,
-          fixed: 'left'
-        },
-        {
-          prop: 'name',
-          label: '区域名称',
-          showOverflowTooltip: true,
-          align: 'center',
-          minWidth: 110,
-          slot: 'name'
-        },
-        {
-          prop: 'areaCode',
-          label: '区域编码',
-          showOverflowTooltip: true,
-          align: 'center',
-          minWidth: 110,
-        },
-        {
-          prop: 'areaImg',
-          label: '地图/示意图',
-          showOverflowTooltip: true,
-          align: 'center',
-          minWidth: 110,
-          slot: 'areaImg'
+  import { basicAreaDeleteAPI, basicAreaPageAPI } from '@/api/regionalManage';
 
-        },
-        {
-          prop: 'areaLevel',
-          label: '区域等级',
-          showOverflowTooltip: true,
-          align: 'center',
-          formatter: (row, column) => {
-            return this.getDictV('main_area_level',row.areaLevel) ;
+  import dictMixins from '@/mixins/dictMixins';
+
+  export default {
+    mixins: [tabMixins, dictMixins],
+    name: 'SystemOrganization',
+    components: { areaEdit },
+    data() {
+      return {
+        // 加载状态
+        loading: false,
+        // 列表数据
+        data: [],
+        dataTree: [],
+        // 选中数据
+        current: null,
+        // 是否显示表单弹窗
+        showEdit: false,
+        // 编辑回显数据
+        editData: null,
+        // 上级id
+        parentId: null,
+        dictList: {},
+        cacheKeyUrl: 'fb2f4315-enterpriseModel-organization',
+        columnsVersion: 1
+      };
+    },
+    computed: {
+      // 表格列配置
+      columns() {
+        const version = this.columnsVersion;
+        return [
+          {
+            columnKey: 'index',
+            type: 'index',
+            width: 45,
+            align: 'center',
+            showOverflowTooltip: true,
+            fixed: 'left'
           },
-          minWidth: 110,
-        },
-        {
-          prop: 'areaType',
-          label: '区域类型',
-          showOverflowTooltip: true,
-          align: 'center',
-          formatter: (row, column) => {
-            return this.getDictV('main_area_type',row.areaType) ;
+          {
+            prop: 'name',
+            label: '区域名称',
+            showOverflowTooltip: true,
+            align: 'center',
+            minWidth: 110,
+            slot: 'name'
           },
-          minWidth: 110,
-        },
-        {
-          prop: 'areaSort',
-          label: '排序',
-          showOverflowTooltip: true,
-          align: 'center',
-          width: 60
-        },
-        {
-          columnKey: 'action',
-          label: '操作',
-          width: 190,
-          align: 'center',
-          resizable: false,
-          slot: 'action',
-          showOverflowTooltip: true
-        }
-      ]
-    },
-  },
-  created() {
-    //this.query();
-  },
-  methods: {
-    getDictV(code, val) {
-      if (!this.dictList[code]) return '';
-      return this.dictList[code].find(item => item.value == val)?.label
-    },
-    async getDictList(code) {
-      let {data: res} = await getByCode(code)
-      this.dictList[code] = res.map(item => {
-        let values = Object.keys(item)
-        return {
-          value: values[0],
-          label: item[values[0]]
-        }
-      })
+          {
+            prop: 'areaCode',
+            label: '区域编码',
+            showOverflowTooltip: true,
+            align: 'center',
+            minWidth: 110
+          },
+          {
+            prop: 'areaImg',
+            label: '地图/示意图',
+            showOverflowTooltip: true,
+            align: 'center',
+            minWidth: 110,
+            slot: 'areaImg'
+          },
+          {
+            prop: 'areaLevel',
+            label: '区域等级',
+            showOverflowTooltip: true,
+            align: 'center',
+            formatter: (row, column) => {
+              return this.getDictValue('区域等级', row.areaLevel);
+            },
+            minWidth: 110
+          },
+          {
+            prop: 'areaType',
+            label: '区域类型',
+            showOverflowTooltip: true,
+            align: 'center',
+            formatter: (row, column) => {
+              return this.getDictValue('区域类型', row.areaType);
+            },
+            minWidth: 110
+          },
+          {
+            prop: 'areaSort',
+            label: '排序',
+            showOverflowTooltip: true,
+            align: 'center',
+            width: 60
+          },
+          {
+            columnKey: 'action',
+            label: '操作',
+            width: 190,
+            align: 'center',
+            resizable: false,
+            slot: 'action',
+            showOverflowTooltip: true
+          }
+        ];
+      }
     },
-    downloadFile(file) {
-      getFile({objectName: file.storePath}, file.type);
+    created() {
+      this.requestDict('区域类型');
+      this.requestDict('区域等级');
     },
-    /* 查询 */
-    async datasource() {
-      await this.getDictList('main_area_level')
-      await this.getDictList('main_area_type')
-      const data = await basicAreaPageAPI(
-        {
-        pageNum: 1,
-        size: 9999
-        }
-      )
-      this.data = this.$util.toTreeData({
-        data: data,
-        idField: 'id',
-        parentIdField: 'parentId'
-      });
-      this.dataTree = [{
-        name:'顶级区域',
-          id: '0',
-        children:  this.data,
-      }]
-      return this.data
+    methods: {
 
-    },
-    /* 刷新表格 */
-    reload(where) {
-      this.$refs.table.reload();
-    },
-    /* 展开全部 */
-    expandAll() {
-      this.$refs.table.toggleRowExpansionAll(true);
-    },
-    /* 折叠全部 */
-    foldAll() {
-      this.$refs.table.toggleRowExpansionAll(false);
-    },
-    /* 显示编辑 */
-    openEdit(type,row) {
-      this.showEdit = true;
-      this.$nextTick(() => {
-        this.$refs.areaEditRef.init(type,row);
-      });
-    },
-    /* 删除 */
-    remove(row) {
-      this.$confirm('确定要删除选中的区域吗?', '提示', {
-        type: 'warning'
-      }).then(() => {
-           const loading = this.$loading({lock: true});
-          basicAreaDeleteAPI([row.id])
-            .then((msg) => {
-              loading.close();
-              this.$message.success(msg);
-              this.reload();
-            })
-            .catch((e) => {
-              loading.close();
-              // this.$message.error(e.message);
-            });
-        })
-        .catch(() => {
+
+      /* 查询 */
+      async datasource() {
+
+        const data = await basicAreaPageAPI({
+          pageNum: 1,
+          size: 9999
         });
+        this.data = this.$util.toTreeData({
+          data: data,
+          idField: 'id',
+          parentIdField: 'parentId'
+        });
+        this.dataTree = [
+          {
+            name: '顶级区域',
+            id: '0',
+            children: this.data
+          }
+        ];
+        return this.data;
+      },
+      /* 刷新表格 */
+      reload(where) {
+        this.$refs.table.reload();
+      },
+      /* 展开全部 */
+      expandAll() {
+        this.$refs.table.toggleRowExpansionAll(true);
+      },
+      /* 折叠全部 */
+      foldAll() {
+        this.$refs.table.toggleRowExpansionAll(false);
+      },
+      /* 显示编辑 */
+      openEdit(type, row) {
+        this.showEdit = true;
+        this.$nextTick(() => {
+          this.$refs.areaEditRef.init(type, row);
+        });
+      },
+      /* 删除 */
+      remove(row) {
+        this.$confirm('确定要删除选中的区域吗?', '提示', {
+          type: 'warning'
+        })
+          .then(() => {
+            const loading = this.$loading({ lock: true });
+            basicAreaDeleteAPI([row.id])
+              .then((msg) => {
+                loading.close();
+                this.$message.success(msg);
+                this.reload();
+              })
+              .catch((e) => {
+                loading.close();
+                // this.$message.error(e.message);
+              });
+          })
+          .catch(() => {});
+      }
     }
-  }
-};
+  };
 </script>
 
 <style lang="scss" scoped>
-.sys-organization-list {
-  height: calc(100vh - 264px);
-  box-sizing: border-box;
-  border-width: 1px;
-  border-style: solid;
-  overflow: auto;
-}
+  .sys-organization-list {
+    height: calc(100vh - 264px);
+    box-sizing: border-box;
+    border-width: 1px;
+    border-style: solid;
+    overflow: auto;
+  }
 
-.sys-organization-list :deep(.el-tree-node__content) {
-  height: 30px;
+  .sys-organization-list :deep(.el-tree-node__content) {
+    height: 30px;
 
-  & > .el-tree-node__expand-icon {
-    margin-left: 10px;
+    & > .el-tree-node__expand-icon {
+      margin-left: 10px;
+    }
   }
-}
 </style>

src/views/system/organization/components/org-user-edit.vue

@@ -1170,7 +1170,6 @@
   import FileUpload from '@/components/upload/fileUpload.vue';
   import dictMixins from '@/mixins/dictMixins';
   import aptitudeDialog from '@/views/factoryModel/jobManagement/components/aptitudeDialog.vue';
-  import { del } from 'vue';
   import criticalProcess from './criticalProcess.vue';
 
   // D:\中赢\kd-aiot-frontend\src\views\system\user