headerSelect组件完成

src/types/role.ts

 export enum eRole {
-  platform_management, // 平台管理员
+  platform_management, // 平台管理员 admin admin
   superManager, // 超级管理员 也叫 银行管理员
 
   firstLevel_branch, // 一级分行管理员

src/utils/outlet/index.ts

@@ -12,7 +12,7 @@ export async function getSelfOutLet(): Promise<iOutLet> {
       const data: iOutLet = ret.data
       localStorage.setItem(OUT_LET, JSON.stringify(data))
     } else {
-      throw new Error('用户网点信息获取失败F')
+      throw new Error('用户网点信息获取失败')
     }
   }
   const storage = localStorage.getItem(OUT_LET)

src/views/Root/OutletManagement/components/HeaderSelect/index.vue

@@ -3,7 +3,7 @@
     <a-select
       v-for="(item, index) in fooList"
       :key="index"
-      class="header-select-item mx-3"
+      class="header-select-item mx-3 my-2"
       @change="(value) => handleSelectChange(value, index)"
       :placeholder="item.placeholder"
       :value="item.value"
@@ -23,13 +23,13 @@
 import { eLevel } from "@/types/level";
 import { eNewRoleRelatedToBackEnd } from "@/types/role";
 import { getSelfOutLet } from "@/utils/outlet";
-import { getUserMsg } from "@/utils/userMsg/userMsg";
 import { message } from "ant-design-vue";
 import StaffService from "@/service/StaffService";
 import { fooList } from "./const";
 
 import Vue, { PropType } from "vue";
 import { iOutLet } from "@/service/StaffService/types";
+
 export default Vue.extend({
   props: {
     fooList: {
@@ -89,50 +89,147 @@ export default Vue.extend({
       });
       this.setFooList(newList);
     },
+    resetList() {
+      const list = this.fooList.map((i) => {
+        return {
+          ...i,
+          disable: false,
+          value: undefined,
+          options: [],
+        };
+      });
+      this.setFooList([...list]);
+    },
     async init() {
       const selfOutLet = await getSelfOutLet();
-      if (this.role === eNewRoleRelatedToBackEnd.BackAdmin) {
-        const ret = await StaffService.getInstance().getBranch({
-          level: eLevel.firstLevel_branch,
-        });
-        if (ret.code === 200) {
-          const options = ret.data.item;
-          this.fooList[0].options = options;
-          const newList = this.fooList.map((item, i) => {
-            return {
-              ...item,
-              disable: i >= 1,
-            };
-          });
-          this.setFooList(newList);
+      this.resetList();
+      this.$nextTick(() => {
+        if (this.role === eNewRoleRelatedToBackEnd.BackAdmin) {
+          this.initBackAdmin(selfOutLet);
+        } else if (this.level === eLevel.firstLevel_branch) {
+          this.init_firstLevel(selfOutLet);
+        } else if (this.level === eLevel.secondary_branch) {
+          this.init_secondLevel(selfOutLet);
+        } else if (this.level === eLevel.firstLevel_sub_branch) {
+          this.init_first_sub_Level(selfOutLet);
+        } else if (this.level === eLevel.secondary_sub_branch) {
+          this.init_second_sub_Level(selfOutLet);
         }
-      } else if (this.level === eLevel.firstLevel_branch) {
-        this.init_firstLevel(selfOutLet);
-      } else if (this.level === eLevel.secondary_branch) {
-        this.init_firstLevel(selfOutLet);
-        // this.setSelectValue([selfOutLet.fid, selfOutLet.sid]);
-      } else if (this.level === eLevel.firstLevel_sub_branch) {
-        // this.
-        // this.setSelectValue([selfOutLet.fid, selfOutLet.sid, selfOutLet.fs_id]);
-      } else if (this.level === eLevel.secondary_sub_branch) {
-        // this.setSelectValue([
-        //   selfOutLet.fid,
-        //   selfOutLet.sid,
-        //   selfOutLet.fs_id,
-        //   selfOutLet.ss_id,
-        // ]);
+      });
+    },
+    async initBackAdmin(selfOutLet: iOutLet) {
+      const ret = await StaffService.getInstance().getBranch({
+        level: eLevel.firstLevel_branch,
+      });
+      if (ret.code === 200) {
+        const options = ret.data.item;
+        this.fooList[0].options = options;
+        const newList = this.fooList.map((item, i) => {
+          return {
+            ...item,
+            disable: i >= 1,
+          };
+        });
+        this.setFooList(newList);
       }
     },
     init_firstLevel(selfOutLet: iOutLet) {
-      const { fid, first_branch } = selfOutLet;
-      this.fooList[0].value = fid;
-      this.fooList[0].options = [{ ID: fid, Name: first_branch }];
-      this.fooList[0].disable = true;
+      const list = this.initFooListBasicValues(
+        selfOutLet,
+        eLevel.firstLevel_branch
+      );
+      this.setFooList(list);
+    },
+    async init_secondLevel(selfOutLet: iOutLet) {
+      const { fid, first_branch, sid, second_branch } = selfOutLet;
+      const list = this.initFooListBasicValues(
+        selfOutLet,
+        eLevel.secondary_branch
+      );
+      this.setFooList(list);
+      const ret = await StaffService.getInstance().getBranch({
+        level: eLevel.firstLevel_sub_branch,
+        page_size: 10000,
+        parent_id: sid,
+      });
+      if (ret.code === 200) {
+        this.fooList[2].options = ret.data.item;
+      }
       this.setFooList(this.fooList);
     },
-    init_secondLevel(selfOutLet: iOutLet) {},
-    init_first_sub_Level(selfOutLet: iOutLet) {},
-    init_second_sub_Level(selfOutLet: iOutLet) {},
+    async init_first_sub_Level(selfOutLet: iOutLet) {
+      const { fid, first_branch, sid, second_branch, fs_id, first_sub_branch } =
+        selfOutLet;
+      const list = this.initFooListBasicValues(
+        selfOutLet,
+        eLevel.firstLevel_sub_branch
+      );
+      this.setFooList(list);
+      const ret = await StaffService.getInstance().getBranch({
+        level: eLevel.secondary_sub_branch,
+        page_size: 1000,
+        parent_id: fs_id,
+      });
+      if (ret.code === 200) {
+        this.fooList[3].options = ret.data.item;
+      }
+      this.setFooList(this.fooList);
+    },
+    init_second_sub_Level(selfOutLet: iOutLet) {
+      this.initFooListBasicValues(selfOutLet, eLevel.secondary_sub_branch);
+    },
+    initFooListBasicValues(selfOutLet: iOutLet, level: eLevel) {
+      let list = this.fooList;
+      const {
+        fid,
+        first_branch,
+        sid,
+        second_branch,
+        fs_id,
+        first_sub_branch,
+        ss_id,
+        second_sub_branch,
+      } = selfOutLet;
+      if (
+        [
+          eLevel.firstLevel_branch,
+          eLevel.secondary_branch,
+          eLevel.firstLevel_sub_branch,
+          eLevel.secondary_sub_branch,
+        ].includes(level)
+      ) {
+        list[0].value = fid;
+        list[0].options = [{ ID: fid, Name: first_branch }];
+        list[0].disable = true;
+      }
+      if (
+        [
+          eLevel.secondary_branch,
+          eLevel.firstLevel_sub_branch,
+          eLevel.secondary_sub_branch,
+        ].includes(level)
+      ) {
+        list[1].value = sid;
+        list[1].options = [{ ID: sid, Name: second_branch }];
+        list[1].disable = true;
+      }
+
+      if (
+        [eLevel.firstLevel_sub_branch, eLevel.secondary_sub_branch].includes(
+          level
+        )
+      ) {
+        list[2].value = fs_id;
+        list[2].options = [{ ID: fs_id, Name: first_sub_branch }];
+        list[2].disable = true;
+      }
+      if ([eLevel.secondary_sub_branch].includes(level)) {
+        list[3].value = ss_id;
+        list[3].options = [{ ID: ss_id, Name: second_sub_branch }];
+        list[3].disable = true;
+      }
+      return list;
+    },
     popupScroll1(e: Event) {
       let h = e.target as HTMLElement;
       if (h.scrollHeight - h.scrollTop <= h.clientHeight) {

src/views/Root/OutletManagement/index.vue

@@ -4,6 +4,7 @@
       <p class="text-2xl font-bold mb-5">网点管理</p>
       <div>
         <header-select
+          ref="headerSelect"
           :setFooList="setFooList"
           :fooList="fooList"
           :level="level"
@@ -360,49 +361,9 @@ export default Vue.extend({
     },
     clickQueryOnSearchPage() {},
     clickReset() {
-      this.cascaderValue = [];
+      (this.$refs.headerSelect as any).init();
       this.addressSearchValue = "";
     },
-    onChange(value: any[]) {
-      this.cascaderValue = value;
-      if (this.cascaderValue.length === LEVE_ORG) {
-        this.$router.push({
-          query: {
-            cascaderValue: this.cascaderValue.toString(),
-          },
-        });
-      }
-    },
-    loadData(
-      selectedOptions: {
-        loading: boolean;
-        isLeaf: boolean;
-        value: any;
-        label: string;
-        children: any[];
-      }[]
-    ) {
-      const targetOption = selectedOptions[selectedOptions.length - 1];
-      targetOption.loading = true;
-
-      // load options lazily
-      setTimeout(() => {
-        targetOption.loading = false;
-        targetOption.children = [
-          {
-            label: `${targetOption.label} Dynamic 1`,
-            value: "dynamic1",
-            isLeaf: false,
-          },
-          {
-            label: `${targetOption.label} Dynamic 2`,
-            isLeaf: true,
-            value: "dynamic2",
-          },
-        ];
-        this.options = [...this.options];
-      }, 10);
-    },
     clickResetOnSearchPage() {
       this.searchPageReqParams.name = "";
       this.searchPageReqParams.phone = "";

src/views/Root/getMenuList.ts

@@ -50,7 +50,7 @@ export const menuList: iMenuConfigItem[] = [
   //       getName: () => '理财产品',
   //       roles: [eRole.superManager],
   //       routeName: 'financialManagement',
-  //       hiddeInMenu: false,     
+  //       hiddeInMenu: false,
   //       path: '/backend/product/financialManagement',
   //       component: () => import('@/views/Root/Banner/index.vue'),
   //       onClick: (e: Event) => {},
@@ -93,7 +93,7 @@ export const menuList: iMenuConfigItem[] = [
       eRole.firstLevel_sub_branch,
       eRole.secondary_sub_branch,
       eRole.secondary_sub_clientManager,
-      eRole.firstLevel_sub_clientManager
+      eRole.firstLevel_sub_clientManager,
     ],
     onClick: (e: Event) => {},
   },
@@ -103,9 +103,7 @@ export const menuList: iMenuConfigItem[] = [
     routeName: 'loanProduct',
     path: '/backend/loanProduct',
     component: () => import('@/views/Root/Product/Loan/index.vue'),
-    roles: [
-      eRole.superManager,
-    ],
+    roles: [eRole.superManager],
   },
   {
     getName: () => '发布贷款产品',
@@ -126,7 +124,7 @@ export const menuList: iMenuConfigItem[] = [
     belongToMenuName: 'userManage',
     component: () => import('@/views/Root/User/client.vue'),
     roles: [
-      eRole.superManager, 
+      eRole.superManager,
       eRole.firstLevel_branch,
       eRole.firstLevel_sub_clientManager,
     ],
@@ -149,10 +147,7 @@ export const menuList: iMenuConfigItem[] = [
     hiddeInMenu: true,
     belongToMenuName: 'userManage',
     component: () => import('@/views/Root/User/secondary.vue'),
-    roles: [
-      eRole.superManager, 
-      eRole.firstLevel_branch
-    ],
+    roles: [eRole.superManager, eRole.firstLevel_branch],
   },
   {
     getName: () => '一级支行搜索结果',
@@ -226,7 +221,7 @@ export const menuList: iMenuConfigItem[] = [
       eRole.firstLevel_sub_branch,
       eRole.secondary_sub_branch,
       eRole.firstLevel_sub_clientManager,
-      eRole.secondary_sub_clientManager
+      eRole.secondary_sub_clientManager,
     ],
   },
   {
@@ -271,8 +266,7 @@ export const menuList: iMenuConfigItem[] = [
     routeName: 'activity',
     path: '/backend/activity',
     component: () => import('@/views/Root/Activity/index.vue'),
-    roles: [eRole.superManager,
-    ],
+    roles: [eRole.superManager],
   },
   {
     getName: () => '用户管理',
@@ -280,9 +274,7 @@ export const menuList: iMenuConfigItem[] = [
     routeName: 'platformUserManagement',
     path: '/backend/platformUserManagement',
     component: () => import('@/views/Root/Platform_UserManagement/index.vue'),
-    roles: [
-      eRole.platform_management,
-    ],
+    roles: [eRole.platform_management],
   },
   {
     getName: () => '安全设置',
@@ -303,7 +295,7 @@ export const menuList: iMenuConfigItem[] = [
           eRole.secondary_branch,
           eRole.secondary_sub_branch,
           eRole.firstLevel_sub_clientManager,
-          eRole.secondary_sub_clientManager
+          eRole.secondary_sub_clientManager,
         ],
         onClick: (e: Event) => {},
       },
@@ -321,7 +313,7 @@ export const menuList: iMenuConfigItem[] = [
           eRole.secondary_branch,
           eRole.secondary_sub_branch,
           eRole.firstLevel_sub_clientManager,
-          eRole.secondary_sub_clientManager
+          eRole.secondary_sub_clientManager,
         ],
       },
     ],
@@ -333,7 +325,7 @@ export const menuList: iMenuConfigItem[] = [
       eRole.secondary_branch,
       eRole.secondary_sub_branch,
       eRole.firstLevel_sub_clientManager,
-      eRole.secondary_sub_clientManager
+      eRole.secondary_sub_clientManager,
     ],
   },
   {