应用模块新增类型

src/modules/admin/api.js

@@ -53,6 +53,9 @@ export const appBindUser = ({ appId, userId }, isBind) => {
 export const appModuleList = (datas) => {
   return $postParam("/api/admin/module/list", datas);
 };
+export const appModuleTypes = () => {
+  return $postParam("/api/admin/module/types", {});
+};
 export const appModuleInsertOrUpdate = (datas) => {
   if (datas.id) {
     return $postParam("/api/admin/module/update", datas);

src/modules/admin/components/AppModuleManage.vue

@@ -55,6 +55,11 @@
           <el-table-column prop="id" label="ID" width="80"></el-table-column>
           <el-table-column prop="name" label="名称"> </el-table-column>
           <el-table-column prop="code" label="编码"> </el-table-column>
+          <el-table-column prop="type" label="类型">
+            <span slot-scope="scope">
+              {{ moduleTypesMap[scope.row.type] }}
+            </span>
+          </el-table-column>
           <el-table-column prop="enable" label="状态" width="80">
             <span
               slot-scope="scope"
@@ -103,13 +108,14 @@
       v-if="checkPrivilege('MODULE_INSERT') || checkPrivilege('MODULE_EDIT')"
       ref="ModifyAppModule"
       :instance="curRow"
+      :module-types="moduleTypes"
       @modified="getList"
     ></modify-app-module>
   </div>
 </template>
 
 <script>
-import { appModuleList, appModuleEnable } from "../api";
+import { appModuleList, appModuleEnable, appModuleTypes } from "../api";
 import { ABLE_TYPE } from "../../../constants/enumerate";
 import ModifyAppModule from "../components/ModifyAppModule.vue";
 
@@ -134,11 +140,14 @@ export default {
       },
       dataList: [],
       curRow: {},
+      moduleTypes: [],
+      moduleTypesMap: {},
     };
   },
   methods: {
-    visibleChange() {
-      this.getList();
+    async visibleChange() {
+      await this.moduleTypes();
+      await this.getList();
     },
     cancel() {
       this.modalIsShow = false;
@@ -146,6 +155,16 @@ export default {
     open() {
       this.modalIsShow = true;
     },
+    async getModuleTypes() {
+      if (this.moduleTypes.length) return;
+      const res = await appModuleTypes();
+      this.moduleTypes = res || [];
+      let moduleTypesMap = {};
+      this.moduleTypes.forEach((item) => {
+        moduleTypesMap[item.code] = item.name;
+      });
+      this.moduleTypesMap = moduleTypesMap;
+    },
     async getList() {
       const datas = {
         ...this.filter,

src/modules/admin/components/ModifyAppModule.vue

@@ -30,6 +30,16 @@
           clearable
         ></el-input>
       </el-form-item>
+      <el-form-item prop="type" label="类型：">
+        <el-select v-model="modalForm.type" placeholder="请选择类型">
+          <el-option
+            v-for="item in moduleTypes"
+            :key="item.code"
+            :value="item.code"
+            :label="item.name"
+          ></el-option>
+        </el-select>
+      </el-form-item>
     </el-form>
     <div slot="footer">
       <el-button type="danger" @click="cancel" plain>取消</el-button>
@@ -48,6 +58,7 @@ const initModalForm = {
   appId: null,
   name: "",
   code: "",
+  type: "",
 };
 
 export default {
@@ -59,6 +70,12 @@ export default {
         return {};
       },
     },
+    moduleTypes: {
+      type: Array,
+      default() {
+        return [];
+      },
+    },
   },
   computed: {
     isEdit() {
@@ -98,6 +115,13 @@ export default {
             trigger: "change",
           },
         ],
+        type: [
+          {
+            required: true,
+            message: "请选择类型",
+            trigger: "change",
+          },
+        ],
       },
     };
   },