fix: update types

src/locales/lang/en.ts

@@ -407,6 +407,6 @@ const msg = {
   detail: "Detail",
   marketplace: "Marketplace",
   menus: "Menus",
-  saveReload: "Save and reload page",
+  saveReload: "Save and reload the page",
 };
 export default msg;

src/locales/lang/es.ts

@@ -406,6 +406,6 @@ const msg = {
   detail: "Detail",
   marketplace: "Marketplace",
   menus: "Menus",
-  saveReload: "Save and reload page",
+  saveReload: "Save and reload the page",
 };
 export default msg;

src/router/layer.ts

@@ -16,11 +16,12 @@
  */
 import Layout from "@/layout/Index.vue";
 import { useAppStoreWithOut } from "@/store/modules/app";
+import type { MenuOptions } from "@/types/app";
 
 async function layerDashboards() {
   const appStore = useAppStoreWithOut();
   await appStore.getActivateMenus();
-  const routes = appStore.currentMenus.map((item: any) => {
+  const routes = appStore.currentMenus.map((item: MenuOptions) => {
     const route: any = {
       path: "",
       name: item.name,
@@ -33,7 +34,7 @@ async function layerDashboards() {
       children: item.subItems && item.subItems.length ? [] : undefined,
     };
     for (const child of item.subItems || []) {
-      const d: any = {
+      const d = {
         name: child.name,
         path: child.path,
         meta: {
@@ -41,18 +42,18 @@ async function layerDashboards() {
           layer: child.layer,
           icon: child.icon || "cloud_queue",
         },
+        component: () => import("@/views/Layer.vue"),
       };
-      d.component = () => import("@/views/Layer.vue");
       route.children.push(d);
-      const tab: any = {
+      const tab = {
         name: `${child.name}ActiveTabIndex`,
         path: `/${child.name}/tab/:activeTabIndex`,
+        component: () => import("@/views/Layer.vue"),
         meta: {
           notShow: true,
           layer: child.layer,
         },
       };
-      tab.component = () => import("@/views/Layer.vue");
       route.children.push(tab);
     }
     if (!item.subItems.length) {

src/store/modules/app.ts

@@ -22,7 +22,7 @@ import getLocalTime from "@/utils/localtime";
 import type { AxiosResponse } from "axios";
 import dateFormatStep, { dateFormatTime } from "@/utils/dateFormat";
 import { TimeType } from "@/constants/data";
-import type { MenuOptions } from "@/types/app";
+import type { MenuOptions, SubItem } from "@/types/app";
 /*global Nullable*/
 interface AppState {
   durationRow: Recordable;
@@ -180,7 +180,7 @@ export const appStore = defineStore({
         d.id = d.name;
         if (d.subItems && d.subItems.length) {
           d.hasGroup = true;
-          d.subItems = d.subItems.map((item: any, sub: number) => {
+          d.subItems = d.subItems.map((item: SubItem, sub: number) => {
             const id = `${item.title.replace(/\s+/g, "-")}`;
             item.name = `${id}-${index}${sub}`;
             item.path = `/${t}/${id}`;
@@ -193,7 +193,7 @@ export const appStore = defineStore({
       });
       this.activateMenus = menus.filter((d: MenuOptions) => {
         if (d.activate) {
-          d.subItems = d.subItems.filter((item: any) => {
+          d.subItems = d.subItems.filter((item: SubItem) => {
             if (item.activate) {
               return item;
             }

src/types/app.d.ts

@@ -56,14 +56,16 @@ export interface MenuOptions {
   path?: string;
   hasGroup?: boolean;
   id?: string;
-  subItems: {
+  subItems: SubItem[];
-    layer: string;
+}
-    icon: string;
+
-    title: string;
+export interface SubItem {
-    activate: boolean;
+  layer: string;
-    name?: string;
+  icon: string;
-    path?: string;
+  title: string;
-    notShow?: boolean;
+  activate: boolean;
-    id?: string;
+  name?: string;
-  }[];
+  path?: string;
+  notShow?: boolean;
+  id?: string;
 }

src/views/marketplace/Menus.vue

@@ -14,16 +14,16 @@ See the License for the specific language governing permissions and
 limitations under the License. -->
 <template>
   <div class="menus flex-v">
-    <el-tree
+    <div class="tree-body">
-      ref="treeRef"
+      <el-tree
-      :data="appStore.activateMenus"
+        ref="treeRef"
-      show-checkbox
+        :data="appStore.activateMenus"
-      node-key="id"
+        show-checkbox
-      default-expand-all
+        node-key="id"
-      :default-checked-keys="appStore.checkedKeys"
+        default-expand-all
-      :props="defaultProps"
+        :default-checked-keys="appStore.checkedKeys"
-    />
+        :props="defaultProps"
-    <div class="footer flex-v">
+      />
       <el-button class="btn" size="small" type="primary" @click="getCheckedNodes">
         {{ t("saveReload") }}
       </el-button>
@@ -60,12 +60,21 @@ limitations under the License. -->
     padding: 10px;
   }
 
+  .tree-body {
+    padding-left: 30px;
+    padding-top: 20px;
+    width: 100%;
+    height: 100%;
+    background-color: #fff;
+  }
+
   .footer {
-    padding: 80px 10px 20px;
+    padding: 0 10px;
     background-color: #fff;
   }
 
   .btn {
     width: 150px;
+    margin-top: 20px;
   }
 </style>