pref:优化应用板块和业务管理板块

base-manager-ui/admin/package.json

@@ -38,6 +38,7 @@
     "nanoid": "^4.0.0",
     "nprogress": "^0.2.0",
     "quill-image-resize-module": "^3.0.0",
+    "secure-ls": "^1.2.6",
     "v-viewer": "^1.6.4",
     "viser-vue": "^2.4.8",
     "vue": "^2.6.11",

base-manager-ui/admin/src/pages/basicset/addmatter/AddMatter.vue

@@ -77,7 +77,7 @@ export default {
   methods: {
     // 返回管理页面
     handleManage() {
-      this.$router.push("/business");
+      this.$router.push("/business/mattermanage");
     },
     // 返回上一级
     handleBack() {

base-manager-ui/admin/src/pages/basicset/appmarket/AppDetails.vue

 <template>
   <!-- 应用集市 -->
-  <div class="app-details">
-    <a-tabs default-active-key="1">
+  <div class="app-details flex flexc">
+    <a-tabs :activeKey="activeKey" @change="changeRouter">
       <a-button slot="tabBarExtraContent" @click="handleBack"
         >返回上一级</a-button
       >
-      <a-tab-pane key="1" tab="详情">
-        <AppDetailsPage></AppDetailsPage>
+      <a-tab-pane key="/appmarket/appdetails/appdetailspage" tab="详情">
+        <!-- <AppDetailsPage></AppDetailsPage> -->
       </a-tab-pane>
-      <a-tab-pane key="2" tab="数据更新" force-render>
-        <DataUpdata></DataUpdata>
+      <a-tab-pane key="/appmarket/appdetails/dataupdate" tab="数据更新">
+        <!-- <DataUpdata></DataUpdata> -->
       </a-tab-pane>
-      <a-tab-pane key="3" tab="数据配置" force-render>
-        <FieldConfig></FieldConfig>
+      <a-tab-pane key="/appmarket/appdetails/fieldconfig" tab="数据配置">
+        <!-- <FieldConfig></FieldConfig> -->
       </a-tab-pane>
     </a-tabs>
+    <div class="details-out-box flex1">
+      <router-view></router-view>
+    </div>
   </div>
 </template>
 
 <script>
-import AppDetailsPage from "./components/AppDetailsPage.vue";
-import DataUpdata from "./components/DataUpdate.vue";
-import FieldConfig from "./components/FieldConfig.vue";
+// import AppDetailsPage from "./components/AppDetailsPage.vue";
+// import DataUpdata from "./components/DataUpdate.vue";
+// import FieldConfig from "./components/FieldConfig.vue";
 export default {
   components: {
-    AppDetailsPage,
-    DataUpdata,
-    FieldConfig,
+    // AppDetailsPage,
+    // DataUpdata,
+    // FieldConfig,
   },
   data() {
     return {
       appId: this.$route.query.id,
+      from: this.$route.query.from,
       appInfo: {},
     };
   },
+  computed: {
+    activeKey() {
+      return this.$route.path;
+    },
+  },
   created() {},
   methods: {
     handleBack() {
-      this.$router.back();
+      if (this.from == "terminalapp") {
+        this.$router.push("/appmarket/terminalapp");
+      } else {
+        this.$router.push("/appmarket/moveapp");
+      }
+    },
+    changeRouter(path) {
+      this.$router.push(`${path}?id=${this.appId}&from=${this.from}`);
     },
   },
 };
@@ -46,6 +62,8 @@ export default {
 <style lang="less" scoped>
 .app-details {
   width: 100%;
+  height: 100%;
+  padding: 0px 20px;
 }
 /deep/.ant-tabs {
   height: 100%;

base-manager-ui/admin/src/pages/basicset/appmarket/AppMarket.vue

 <template>
   <!-- 应用集市 -->
-  <div class="app-market">
-    <a-tabs default-active-key="1">
+  <div class="app-market flex flexc">
+    <a-tabs :activeKey="activeKey" @change="changeRouter">
       <a-button
         type="primary"
         v-permission="[1]"
@@ -9,13 +9,16 @@
         @click="handleUpload"
         >上传配置文件</a-button
       >
-      <a-tab-pane key="1" tab="终端应用">
-        <TerminalApp></TerminalApp>
+      <a-tab-pane key="/appmarket/terminalapp" tab="终端应用">
+        <!-- <TerminalApp></TerminalApp> -->
       </a-tab-pane>
-      <a-tab-pane key="2" tab="移动端应用" force-render>
-        <MoveApp></MoveApp>
+      <a-tab-pane key="/appmarket/moveapp" tab="移动端应用" force-render>
+        <!-- <MoveApp></MoveApp> -->
       </a-tab-pane>
     </a-tabs>
+    <div class="app-out-box flex1">
+      <router-view></router-view>
+    </div>
     <!-- 上传配置文件弹窗 -->
     <a-modal
       v-model="visible"
@@ -50,13 +53,13 @@
 </template>
 
 <script>
-import TerminalApp from "./components/TerminalApp.vue";
-import MoveApp from "./components/MoveApp.vue";
+// import TerminalApp from "./components/TerminalApp.vue";
+// import MoveApp from "./components/MoveApp.vue";
 import { commonConfig } from "@/services/market";
 export default {
   components: {
-    TerminalApp,
-    MoveApp,
+    // TerminalApp,
+    // MoveApp,
   },
   data() {
     return {
@@ -73,16 +76,16 @@ export default {
       },
     };
   },
-  // 进入路有前
-  beforeRouteEnter(to, from, text) {
-    if (from.path === "/appmarket/appdetails") {
-      to.meta.isBack = true;
-    } else {
-      to.meta.isBack = false;
-    }
-    text();
+  computed: {
+    activeKey() {
+      return this.$route.path;
+    },
   },
+
   methods: {
+    changeRouter(path) {
+      this.$router.push(path);
+    },
     handleUpload() {
       this.visible = true;
     },
@@ -125,7 +128,11 @@ export default {
 <style lang="less" scoped>
 .app-market {
   width: 100%;
+  height: 100%;
   padding: 15px;
+  .app-out-box {
+    overflow-y: auto;
+  }
 }
 /deep/.ant-form-item {
   align-items: flex-start;

base-manager-ui/admin/src/pages/basicset/appmarket/components/AppDetailsPage.vue

@@ -20,7 +20,7 @@
           :wrapper-col="{ span: 22 }"
         >
           <a-form-model-item label="应用主题">
-            {{ appInfo.appThemeName }}
+            {{ filterItems(appInfo.appThemeName, appDict.appThemeName) }}
           </a-form-model-item>
           <a-form-model-item label="应用简介">
             {{ appInfo.summary }}
@@ -117,7 +117,8 @@ import {
   previewVersion,
 } from "@/services/market";
 import CheckSite from "../modal/CheckSite.vue";
-
+import { filterItems } from "@/utils";
+import { mapGetters } from "vuex";
 export default {
   props: {
     // 应用信息
@@ -168,6 +169,7 @@ export default {
       },
     ];
     return {
+      filterItems,
       api: process.env.VUE_APP_API_BASE_URL + "/",
       columns,
       appId: this.$route.query.id,
@@ -182,6 +184,9 @@ export default {
       siteVisible: false,
     };
   },
+  computed: {
+    ...mapGetters("site", ["appDict"]),
+  },
   created() {
     this.getAppInfo();
     this.getVersions();

base-manager-ui/admin/src/pages/basicset/appmarket/components/MoveApp.vue

@@ -118,6 +118,8 @@ import YSwitch from "../../../../components/yswitch/YSwitch.vue";
 import AddApp from "../modal/AddApp.vue";
 import CheckSite from "../modal/CheckSite.vue";
 import { getAppList, deleteApp, saveApp } from "@/services/market";
+import { mapMutations } from "vuex";
+import { filterItems } from "@/utils";
 import local from "@/utils/local";
 const columns = [
   {
@@ -176,6 +178,7 @@ export default {
   },
   data() {
     return {
+      filterItems,
       api: process.env.VUE_APP_API_BASE_URL + "/",
       api2: process.env.VUE_APP_API_IMG_URL,
       columns,
@@ -194,17 +197,29 @@ export default {
       dict: {}, // 字典
     };
   },
-  // 详情页返回不刷新数据
-  activated() {
-    if (!this.$route.meta.isBack) {
-      Object.assign(this.$data, this.$options.data());
+  // 进入路由前
+  // beforeRouteEnter(to, from, text) {
+  //   if (from.path === "/appmarket/appdetails") {
+  //     to.meta.isBack = true;
+  //   } else {
+  //     to.meta.isBack = false;
+  //   }
+  //   text();
+  // },
+  // // 详情页返回不刷新数据
+  // activated() {
+  //   if (!this.$route.meta.isBack) {
+  //     Object.assign(this.$data, this.$options.data());
+  //     this.getAppList();
+  //   } else {
+  //     this.$route.meta.isBack = false;
+  //   }
+  // },
+  created() {
     this.getAppList();
-    } else {
-      this.$route.meta.isBack = false;
-    }
   },
-  created() {},
   methods: {
+    ...mapMutations("site", ["SET_appDict"]),
     // 获取应用列表
     async getAppList() {
       this.loading = true;
@@ -218,6 +233,7 @@ export default {
       this.loading = false;
       let { data, total, dict } = res.data.data;
       this.dict = dict;
+      this.SET_appDict(dict);
       if (res.data.code === 1) {
         if (!data.length && this.current > 1) {
           this.current -= 1;
@@ -335,16 +351,6 @@ export default {
         this.getAppList();
       }
     },
-    // 过滤表格数据
-    filterItems(key, dict = {}) {
-      let val = "";
-      Object.keys(dict).forEach((keys) => {
-        if (key == keys) {
-          val = dict[keys];
-        }
-      });
-      return val;
-    },
   },
 };
 </script>

base-manager-ui/admin/src/pages/basicset/appmarket/components/TerminalApp.vue

@@ -119,6 +119,8 @@ import AddApp from "../modal/AddApp.vue";
 import CheckSite from "../modal/CheckSite.vue";
 import { getAppList, deleteApp, saveApp } from "@/services/market";
 import local from "@/utils/local";
+import { mapMutations } from "vuex";
+import { filterItems } from "@/utils";
 const columns = [
   {
     title: "序号",
@@ -176,6 +178,7 @@ export default {
   },
   data() {
     return {
+      filterItems,
       api: process.env.VUE_APP_API_BASE_URL + "/",
       api2: process.env.VUE_APP_API_IMG_URL,
       columns,
@@ -194,17 +197,12 @@ export default {
       dict: {}, // 字典
     };
   },
-  // 详情页返回不刷新数据
-  activated() {
-    if (!this.$route.meta.isBack) {
-      Object.assign(this.$data, this.$options.data());
+
+  created() {
     this.getAppList();
-    } else {
-      this.$route.meta.isBack = false;
-    }
   },
-  created() {},
   methods: {
+    ...mapMutations("site", ["SET_appDict"]),
     // 获取应用列表
     async getAppList() {
       this.loading = true;
@@ -218,6 +216,7 @@ export default {
       this.loading = false;
       let { data, total, dict } = res.data.data;
       this.dict = dict;
+      this.SET_appDict(dict);
       if (res.data.code === 1) {
         if (!data.length && this.current > 1) {
           this.current -= 1;
@@ -273,6 +272,7 @@ export default {
         path: "/appmarket/appdetails",
         query: {
           id,
+          from: "terminalapp",
         },
       });
     },
@@ -335,16 +335,6 @@ export default {
         this.getAppList();
       }
     },
-    // 过滤表格数据
-    filterItems(key, dict = {}) {
-      let val = "";
-      Object.keys(dict).forEach((keys) => {
-        if (key == keys) {
-          val = dict[keys];
-        }
-      });
-      return val;
-    },
   },
 };
 </script>

base-manager-ui/admin/src/pages/basicset/business/business.vue

 <template>
-  <div class="business">
-    <a-tabs v-model="active">
-      <a-tab-pane :key="1" tab="事项管理">
-        <BusinessTabs2 v-if="active === 1" ref="BusinessTabs2" />
+  <div class="business flex flexc">
+    <a-tabs v-model="active" @change="changeRouter">
+      <a-tab-pane key="/business/businessmanage" tab="业务管理">
+        <!-- <BusinessTabs2 v-if="active === 1" ref="BusinessTabs2" /> -->
       </a-tab-pane>
 
-      <a-tab-pane :key="2" tab="业务管理">
-        <BusinessTabs1 v-if="active === 2" ref="BusinessTabs1" />
+      <a-tab-pane key="/business/mattermanage" tab="事项管理">
+        <!-- <BusinessTabs1 v-if="active === 2" ref="BusinessTabs1" /> -->
       </a-tab-pane>
 
-      <a-tab-pane :key="3" tab="业务事项关联">
-        <BusinessTabs3 v-if="active === 3" ref="BusinessTabs3" />
+      <a-tab-pane key="/business/businessinmanage" tab="业务事项关联">
+        <!-- <BusinessTabs3 v-if="active === 3" ref="BusinessTabs3" /> -->
       </a-tab-pane>
     </a-tabs>
+    <div class="business-out-box flex1">
+      <router-view></router-view>
+    </div>
   </div>
 </template>
 
 <script>
-import BusinessTabs1 from "./components/businessTabs1.vue";
-import BusinessTabs2 from "./components/businessTabs2.vue";
-import BusinessTabs3 from "./components/businessTabs3.vue";
+// import BusinessTabs1 from "./components/businessTabs1.vue";
+// import BusinessTabs2 from "./components/businessTabs2.vue";
+// import BusinessTabs3 from "./components/businessTabs3.vue";
 
 export default {
   components: {
-    BusinessTabs1,
-    BusinessTabs2,
-    BusinessTabs3,
+    // BusinessTabs1,
+    // BusinessTabs2,
+    // BusinessTabs3,
   },
 
   data() {
     return {
       siteId: "", // 站点id
-      active: 1,
+      // active: 1,
     };
   },
-
-  methods: {},
+  computed: {
+    active() {
+      return this.$route.path;
+    },
+  },
+  methods: {
+    changeRouter(path) {
+      this.$router.push(path);
+    },
+  },
 };
 </script>
 
 <style lang="less" scoped>
 .business {
   width: 100%;
+  height: 100%;
   display: flex;
   position: relative;
   background-color: #fff;
@@ -57,5 +69,8 @@ export default {
     top: 44px;
     left: 50%;
   }
+  .business-out-box {
+    overflow-y: auto;
+  }
 }
 </style>

base-manager-ui/admin/src/router/config.js

@@ -63,6 +63,40 @@ const options = {
                 invisible: true,
               },
               component: () => import("@/pages/basicset/business/business"),
+              redirect: "/business/businessmanage",
+              children: [
+                // 业务管理
+                {
+                  path: "businessmanage",
+                  meta: {
+                    invisible: true,
+                  },
+                  component: () =>
+                    import(
+                      "@/pages/basicset/business/components/businessTabs1"
+                    ),
+                },
+                {
+                  path: "mattermanage",
+                  meta: {
+                    invisible: true,
+                  },
+                  component: () =>
+                    import(
+                      "@/pages/basicset/business/components/businessTabs2"
+                    ),
+                },
+                {
+                  path: "businessinmanage",
+                  meta: {
+                    invisible: true,
+                  },
+                  component: () =>
+                    import(
+                      "@/pages/basicset/business/components/businessTabs3"
+                    ),
+                },
+              ],
             },
             {
               path: "addmatter",
@@ -159,13 +193,63 @@ const options = {
               path: "",
               name: "应用集市",
               component: () => import("@/pages/basicset/appmarket/AppMarket"),
-              meta: { invisible: true, keepAlive: true },
+              meta: { invisible: true },
+              redirect: "/appmarket/terminalapp",
+              children: [
+                {
+                  path: "terminalapp",
+                  component: () =>
+                    import("@/pages/basicset/appmarket/components/TerminalApp"),
+                  meta: {
+                    invisible: true,
+                    // keepAlive: true,
+                  },
+                },
+                {
+                  path: "moveapp",
+                  component: () =>
+                    import("@/pages/basicset/appmarket/components/MoveApp"),
+                  meta: {
+                    invisible: true,
+                    // keepAlive: true,
+                  },
+                },
+              ],
             },
             {
               path: "appdetails",
               name: "应用详情",
               component: () => import("@/pages/basicset/appmarket/AppDetails"),
               meta: { invisible: true },
+              redirect: "/appmarket/appdetails/appdetailspage",
+              children: [
+                {
+                  path: "appdetailspage",
+                  component: () =>
+                    import(
+                      "@/pages/basicset/appmarket/components/AppDetailsPage"
+                    ),
+                  meta: {
+                    invisible: true,
+                  },
+                },
+                {
+                  path: "dataupdate",
+                  component: () =>
+                    import("@/pages/basicset/appmarket/components/DataUpdate"),
+                  meta: {
+                    invisible: true,
+                  },
+                },
+                {
+                  path: "fieldconfig",
+                  component: () =>
+                    import("@/pages/basicset/appmarket/components/FieldConfig"),
+                  meta: {
+                    invisible: true,
+                  },
+                },
+              ],
             },
           ],
         },

base-manager-ui/admin/src/store/index.js

@@ -2,14 +2,23 @@ import Vue from "vue";
 import Vuex from "vuex";
 import modules from "./modules";
 import createPersistedState from "vuex-persistedstate";
-
+import SecureLS from "secure-ls";
+var ls = new SecureLS({ isCompression: false });
 Vue.use(Vuex);
 const store = new Vuex.Store({
   modules,
   // 持久化插件
   plugins: [
+    // createPersistedState({
+    //   storage: window.sessionStorage,
+    // }),
     createPersistedState({
-      storage: window.sessionStorage,
+      key: "info",
+      storage: {
+        getItem: (key) => ls.get(key),
+        setItem: (key, value) => ls.set(key, value),
+        removeItem: (key) => ls.remove(key),
+      },
     }),
   ],
 });

base-manager-ui/admin/src/store/modules/site.js

@@ -6,6 +6,9 @@ export default {
     SiteTree: [], // 站点树
     appTemplate: [], // 应用模板属性
     matterDict: {}, // 事项字典
+    token: "",
+    userInfo: {}, // 用户信息
+    appDict: {}, // 应用字典
   },
   getters: {
     SiteTree(state) {
@@ -17,8 +20,20 @@ export default {
     matterDict(state) {
       return state.matterDict;
     },
+    token(state) {
+      return state.token;
+    },
+    userInfo(state) {
+      return state.userInfo;
+    },
+    appDict(state) {
+      return state.appDict;
+    },
   },
   mutations: {
+    SET_appDict(state, appDict) {
+      state.appDict = appDict;
+    },
     SET_appTemplate(state, appTemplate) {
       state.appTemplate = appTemplate;
     },

base-manager-ui/admin/src/utils/index.js

+// 根据字典过滤数据
+export const filterItems = (key, dict = {}) => {
+  let val = "";
+  Object.keys(dict).forEach((keys) => {
+    if (key == keys) {
+      val = dict[keys];
+    }
+  });
+  return val;
+};

base-manager-ui/admin/yarn.lock

@@ -3833,6 +3833,11 @@ crypto-browserify@^3.11.0:
     randombytes "^2.0.0"
     randomfill "^1.0.3"
 
+crypto-js@^3.1.6:
+  version "3.3.0"
+  resolved "https://registry.npmmirror.com/crypto-js/-/crypto-js-3.3.0.tgz#846dd1cce2f68aacfa156c8578f926a609b7976b"
+  integrity sha512-DIT51nX0dCfKltpRiXV+/TVZq+Qq2NgF4644+K7Ttnla7zEzqc+kjJyiB96BHNyUTBxyjzRcZYpUdZa+QAqi6Q==
+
 crypto-random-string@^2.0.0:
   version "2.0.0"
   resolved "https://registry.npm.taobao.org/crypto-random-string/download/crypto-random-string-2.0.0.tgz?cache=0&sync_timestamp=1583560482221&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcrypto-random-string%2Fdownload%2Fcrypto-random-string-2.0.0.tgz"
@@ -7571,6 +7576,11 @@ lru-cache@^5.1.1:
   dependencies:
     yallist "^3.0.2"
 
+lz-string@^1.4.4:
+  version "1.5.0"
+  resolved "https://registry.npmmirror.com/lz-string/-/lz-string-1.5.0.tgz#c1ab50f77887b712621201ba9fd4e3a6ed099941"
+  integrity sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==
+
 make-dir@^2.0.0, make-dir@^2.1.0:
   version "2.1.0"
   resolved "https://registry.npm.taobao.org/make-dir/download/make-dir-2.1.0.tgz?cache=0&sync_timestamp=1587567572251&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fmake-dir%2Fdownload%2Fmake-dir-2.1.0.tgz"
@@ -9964,6 +9974,14 @@ section-matter@^1.0.0:
     extend-shallow "^2.0.1"
     kind-of "^6.0.0"
 
+secure-ls@^1.2.6:
+  version "1.2.6"
+  resolved "https://registry.npmmirror.com/secure-ls/-/secure-ls-1.2.6.tgz#0c54a4c7fa8317c3c101accbf6bb38d8d2072e46"
+  integrity sha512-g8vUSKl6elSfyAUHodybnNkuZW+mUYEOWj4SZIDg+xoQ1dq5ddktBoOFrtxQBUl88ZyAJOtGWQ1PRaOxkTAuZQ==
+  dependencies:
+    crypto-js "^3.1.6"
+    lz-string "^1.4.4"
+
 select-hose@^2.0.0:
   version "2.0.0"
   resolved "https://registry.npm.taobao.org/select-hose/download/select-hose-2.0.0.tgz"