香港代码和泰国代码合并

.env

@@ -0,0 +1,2 @@
+# 分支配置
+VITE_DEV_TYPE = 0   # 0泰国 1香港

.env.development

@@ -1,3 +0,0 @@
-# 开发环境
-VITE_API_URL=http://sim.nanodreamtech.com
-VITE_ENV=development

.env.production

@@ -1,3 +0,0 @@
-# 生产环境api
-VITE_API_URL=http://sim.ainets.net
-VITE_ENV=production

package-lock.json

@@ -28,6 +28,7 @@
       },
       "devDependencies": {
         "@vitejs/plugin-vue": "^5.0.4",
+        "cross-env": "^7.0.3",
         "fast-glob": "^3.3.2",
         "vite": "^5.2.0",
         "vite-plugin-svg-icons": "^2.0.1"
@@ -1431,6 +1432,38 @@
         "node": ">=0.8"
       }
     },
+    "node_modules/cross-env": {
+      "version": "7.0.3",
+      "resolved": "https://registry.npmmirror.com/cross-env/-/cross-env-7.0.3.tgz",
+      "integrity": "sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==",
+      "dev": true,
+      "dependencies": {
+        "cross-spawn": "^7.0.1"
+      },
+      "bin": {
+        "cross-env": "src/bin/cross-env.js",
+        "cross-env-shell": "src/bin/cross-env-shell.js"
+      },
+      "engines": {
+        "node": ">=10.14",
+        "npm": ">=6",
+        "yarn": ">=1"
+      }
+    },
+    "node_modules/cross-spawn": {
+      "version": "7.0.6",
+      "resolved": "https://registry.npmmirror.com/cross-spawn/-/cross-spawn-7.0.6.tgz",
+      "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==",
+      "dev": true,
+      "dependencies": {
+        "path-key": "^3.1.0",
+        "shebang-command": "^2.0.0",
+        "which": "^2.0.1"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
     "node_modules/crypto-js": {
       "version": "4.2.0",
       "resolved": "https://registry.npmmirror.com/crypto-js/-/crypto-js-4.2.0.tgz",
@@ -2902,6 +2935,12 @@
       "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
       "dev": true
     },
+    "node_modules/isexe": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmmirror.com/isexe/-/isexe-2.0.0.tgz",
+      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
+      "dev": true
+    },
     "node_modules/isobject": {
       "version": "2.1.0",
       "resolved": "https://registry.npmmirror.com/isobject/-/isobject-2.1.0.tgz",
@@ -3466,6 +3505,15 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/path-key": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmmirror.com/path-key/-/path-key-3.1.1.tgz",
+      "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
+      "dev": true,
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/pathe": {
       "version": "0.2.0",
       "resolved": "https://registry.npmmirror.com/pathe/-/pathe-0.2.0.tgz",
@@ -4032,6 +4080,27 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/shebang-command": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmmirror.com/shebang-command/-/shebang-command-2.0.0.tgz",
+      "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
+      "dev": true,
+      "dependencies": {
+        "shebang-regex": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/shebang-regex": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmmirror.com/shebang-regex/-/shebang-regex-3.0.0.tgz",
+      "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
+      "dev": true,
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/side-channel": {
       "version": "1.0.6",
       "resolved": "https://registry.npmmirror.com/side-channel/-/side-channel-1.0.6.tgz",
@@ -5087,6 +5156,21 @@
         "vue": "^3.2.0"
       }
     },
+    "node_modules/which": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmmirror.com/which/-/which-2.0.2.tgz",
+      "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
+      "dev": true,
+      "dependencies": {
+        "isexe": "^2.0.0"
+      },
+      "bin": {
+        "node-which": "bin/node-which"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
     "node_modules/which-boxed-primitive": {
       "version": "1.0.2",
       "resolved": "https://registry.npmmirror.com/which-boxed-primitive/-/which-boxed-primitive-1.0.2.tgz",

package.json

@@ -4,9 +4,11 @@
   "version": "0.0.0",
   "type": "module",
   "scripts": {
-    "dev": "vite",
-    "build": "vite build",
-    "preview": "vite preview"
+    "dev": "cross-env VITE_DEV_TYPE=0 vite",
+    "dev:xg": "cross-env VITE_DEV_TYPE=1 vite",
+    "build:dev": "cross-env VITE_DEV_TYPE=0  vite build --mode pro",
+    "preview": "vite preview",
+    "build:xg": "cross-env VITE_DEV_TYPE=1 vite build --mode pro"
   },
   "dependencies": {
     "@arco-design/web-vue": "^2.55.3",
@@ -29,6 +31,7 @@
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^5.0.4",
+    "cross-env": "^7.0.3",
     "fast-glob": "^3.3.2",
     "vite": "^5.2.0",
     "vite-plugin-svg-icons": "^2.0.1"

src/App.vue

@@ -13,7 +13,7 @@
 import { ref, onMounted, nextTick, provide } from "vue"
 import { useDarkThemeHook, useLang } from '@/hooks'
 import { useSystemStore } from '@/store/modules/systemStore'
-
+import { EnvTypeNum } from '@/settings/designSetting'
 
 const isRouterActive = ref(true)
 // 全局语言
@@ -32,6 +32,16 @@ provide('reloadRoutePage', () => {
 
 
 onMounted(async () => {
+  // 动态更改浏览器图片和名称
+  let favicon = document.querySelector('link[rel="icon"]')
+  if(EnvTypeNum===1){
+    window.document.title = 'FlexiStream'
+    favicon.href = '/src/assets/images/logo.jpg'
+  }else{
+    window.document.title = 'Easy life'
+    favicon.href = '/src/assets/images/logo.png'
+  }
+  console.log(window.document);
   const getLoadingNode = document.getElementById('Loading')
   const { body } = document
   if (getLoadingNode) {

src/components/Layout/components/layout/components/HongKong.vue

@@ -0,0 +1,285 @@
+<template>
+    <a-layout style="min-height: 100vh">
+        <a-layout-sider :width="240" :collapsed-width="50" collapsible :trigger="null" @collapse="evMenuSecondLongShow"
+            v-model:collapsed="menuSecondLongShow">
+            <div class="logo-layout">
+                <div class="logo">
+                    <img src="@/assets/images/logo.jpg" style="height: 26px; width: 26px;" />
+                    <h3 v-if="!menuSecondLongShow" style="margin-left: 10px;"> Easy life</h3>
+                </div>
+            </div>
+
+            <a-menu v-model:selectedKeys="routeItemSelectedKeys" @mouseleave="evMouseleaveMenu">
+                <a-sub-menu v-for="routeItem in routesData" :key="routeItem.name">
+                    <template #icon>
+                        <svg-icon :icon="routeItem.meta.icon"></svg-icon>
+                    </template>
+                    <template #title>{{ routeItem.meta.title }}</template>
+                    <template v-for="item in routeItem?.children || []">
+                        <a-menu-item v-if="!item.children || item.children.length === 0" :key="item.name?.toString()"
+                            @click="evGoPage(item)">
+                            <span class="menu-level-font">{{ item.meta.title }}</span>
+                        </a-menu-item>
+                        <template v-else-if="item.children && item.children.length > 0">
+                            <sub-menu :key="item.name" :menu-info="item" @go="evGoPage" />
+                        </template>
+                    </template>
+                </a-sub-menu>
+            </a-menu>
+        </a-layout-sider>
+
+        <a-layout>
+            <a-layout-header class="layout-header">
+                <LayoutHeader />
+            </a-layout-header>
+            <a-layout>
+                <main class="layout-content-main">
+                    <router-view v-slot="{ Component }" class="layout-content-router">
+                        <component :is="Component" key="Layout" />
+                    </router-view>
+                </main>
+            </a-layout>
+        </a-layout>
+    </a-layout>
+</template>
+<script setup>
+import { ref, computed, h, reactive, onMounted, watch, nextTick } from "vue";
+import { useRoute, useRouter } from "vue-router";
+import { useSystemStore } from "@/store/modules/systemStore";
+import LayoutHeader from "@/components/Layout/components/layoutHeader/index.vue";
+import subMenu from "@/components/Layout/components/subMenu/index.vue";
+import { RouterTagData } from '@/store/modules/routerTag.js'
+
+// 标签页仓库
+const settingStore = RouterTagData()
+
+const systemStore = useSystemStore();
+
+const route = useRoute();
+const router = useRouter();
+
+const menuSecondLongShow = ref(systemStore.menuSecondLongShow);
+// 主菜单
+const routesData = router.options.routes[0]?.children || [];
+
+const menuTabSate = ref([systemStore.getMenuTabSate || routesData[0].name]);
+//子菜单
+const menuSecondData = ref(systemStore.getRouteItem);
+// 选中的状态路由列表
+const menuSecondSelectedStatusData = ref(systemStore.getRouteItem);
+const routeItemSelectedKeys = ref();
+
+const evMenuSecondLongShow = () => {
+    systemStore.setStateValue({
+        key: "menuSecondLongShow",
+        value: menuSecondLongShow.value ? 1 : 0,
+        localStorage: true,
+    });
+};
+const evMouseleaveMenu = (e) => {
+    if (
+        e.relatedTarget?.offsetParent?.id &&
+        e.relatedTarget?.offsetParent?.id == "layout-sider"
+    )
+        return;
+    menuSecondData.value = menuSecondSelectedStatusData.value;
+};
+// 子菜单
+const evMouseLeavesSubMenu = () => {
+    menuSecondData.value = menuSecondSelectedStatusData.value;
+};
+// 鼠标滑动上去更新菜单栏 目前先屏蔽
+const evMenuGetFn = (routeItem, type) => {
+    if (menuSecondLongShow.value) {
+        menuSecondData.value = routeItem;
+    }
+};
+
+// 查找最下级
+const findPath = (data) => {
+    if (data.children && data.children.length > 0) {
+        return findPath(data.children[0]);
+    } else {
+        return data;
+    }
+};
+
+// 主路由 状态
+const changeRoutesItems = (e) => {
+    const item = findPath(e);
+    evGoPage(item);
+};
+
+// 跳转路由
+const evGoPage = async (routeItem) => {
+    // settingStore.tagsPushData(routeItem);
+    await router.push({
+        name: routeItem.name,
+    });
+    menuTabSate.value = [route.matched[1].name];
+    systemStore.setStateValue({
+        key: "menuTabSate",
+        value: menuTabSate.value[0] || "",
+        localStorage: true,
+    });
+
+    menuSecondSelectedStatusData.value = routesData.find(
+        (item) => item.name == menuTabSate.value
+    );
+    menuSecondData.value = menuSecondSelectedStatusData.value;
+    systemStore.setStateValue({
+        key: "routeItem",
+        value: JSON.stringify(menuSecondData.value),
+        localStorage: true,
+    });
+};
+
+watch(
+    route,
+    (val) => {
+        if (val.name) {
+            routeItemSelectedKeys.value = [val.name];
+            console.log(routesData);
+        }
+    },
+    { immediate: true }
+);
+</script>
+<style scoped lang="less">
+.layout-header {
+    height: 48px;
+    background: @bg_color_2;
+    // padding-inline: 10px;
+    box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
+    z-index: 9;
+}
+
+.ant-layout-content {
+    height: auto;
+    min-height: auto;
+    overflow-y: auto;
+    padding: 0 20px;
+}
+
+.layout-content-main {
+    flex: 1;
+    padding: 0 1.2rem 1.6rem 1.2rem;
+    margin: 1.1rem 0 0rem 0;
+    overflow-y: auto;
+    overflow: overlay;
+    height: 95%;
+    display: flex;
+    flex-wrap: wrap;
+}
+
+.logo-layout {
+    height: 64px;
+    color: #fff;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: #0f2d5c;
+
+    .logo {
+        width: 100%;
+        height: 32px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+
+        h3 {
+            white-space: nowrap;
+        }
+    }
+}
+
+.arco-layout {
+    color: @text_color_1;
+    background: @layout-split-color !important;
+    overflow: hidden;
+}
+
+:deep(.arco-menu-light) {
+    background-color: #0f2d5c;
+
+    .arco-menu-item {
+        color: #fff;
+        background: #0f2d5c;
+    }
+}
+
+:deep(.arco-layout-sider-light) {
+    background-color: #0f2d5c;
+}
+
+:deep(.arco-menu-inline-header) {
+    font-weight: 600;
+    color: @text_color_1;
+    background-color: @bg_color_3;
+}
+
+:deep(.layout-content-router) {
+    padding: 0 1rem 1rem 1rem;
+    background-color: @bg_color_4;
+    box-sizing: border-box;
+    width: 100%;
+}
+
+:deep(.arco-menu-inline-content) {
+    .arco-menu-selected {
+        color: @text_color_1;
+        background-color: @black_3;
+
+        &:after {
+            content: none;
+        }
+    }
+}
+
+#layout-sider {
+    :deep(.arco-menu-selected) {
+        color: @text_color_1 !important;
+        font-weight: bold;
+        background-color: @black_3;
+
+        .arco-icon {
+            color: @text_color_1 !important;
+        }
+
+        &:hover {
+            background-color: rgba(235, 19, 19, 0.1) !important;
+        }
+    }
+
+    :deep(.arco-menu-inline) {
+        .arco-menu-inline-header {
+            background-color: @bg_color_3;
+            padding-left: 20px;
+            left: 5px;
+
+            svg {
+                color: @text_color_1 !important;
+                font-size: 14px;
+            }
+
+            .arco-menu-icon-suffix {
+                color: @text_color_1 !important;
+                left: 0px !important;
+                right: auto;
+            }
+
+            &:hover {
+                background-color: rgba(255, 255, 255, 0) !important;
+            }
+        }
+
+        .arco-menu-item {
+            padding: 0 5px;
+        }
+    }
+
+    :deep(.arco-menu-item) {
+        padding-left: 24px;
+    }
+}
+</style>

src/components/Layout/components/layout/components/Thailand.vue

@@ -0,0 +1,295 @@
+<template>
+    <a-layout style="min-height: 100vh">
+      <a-layout-sider theme="dark" :width="160" :collapsed-width="50" collapsible :trigger="null"
+        @collapse="evMenuSecondLongShow" v-model:collapsed="menuSecondLongShow">
+        <div class="logo-layout">
+          <div class="logo">
+            <img src="@/assets/images/logo.png" style="height: 26px; width: 26px;" />
+            <h3 v-if="!menuSecondLongShow" style="margin-left: 10px;"> Easy life</h3>
+          </div>
+        </div>
+  
+        <a-menu v-model:selectedKeys="menuTabSate" theme="dark" mode="inline" @mouseleave="evMouseleaveMenu">
+          <a-menu-item v-for="routeItem in routesData" :key="routeItem.name"
+            @mouseenter="evMenuGetFn(routeItem, 'mouseenter')" @click="changeRoutesItems(routeItem)">
+            <template #icon>
+              <svg-icon :icon="routeItem.meta.icon"></svg-icon>
+            </template>
+            <span>{{ routeItem.meta.title }}</span>
+          </a-menu-item>
+        </a-menu>
+      </a-layout-sider>
+  
+      <a-layout>
+        <a-layout-header class="layout-header">
+          <LayoutHeader />
+        </a-layout-header>
+        <a-layout>
+          <a-layout-sider id="layout-sider" :collapsed="false" :width="menuSecondData &&
+            menuSecondData.children &&
+            menuSecondData.children.length > 0
+            ? 160
+            : 0
+            " @mouseleave="evMouseLeavesSubMenu">
+            <a-menu :selectedKeys="routeItemSelectedKeys" id="layout-sider" theme="light" mode="vertical"
+              :collapsed="false" :auto-open="true">
+              <template v-for="routeItem in menuSecondData?.children || []">
+                <a-menu-item v-if="!routeItem.children || routeItem.children.length === 0"
+                  :key="routeItem.name?.toString()" @click="evGoPage(routeItem)">
+                  <span class="menu-level-font">{{ routeItem.meta.title }}</span>
+                </a-menu-item>
+  
+                <template v-else-if="routeItem.children && routeItem.children.length > 0">
+                  <sub-menu :key="routeItem.name" :menu-info="routeItem" @go="evGoPage" />
+                </template>
+              </template>
+            </a-menu>
+          </a-layout-sider>
+  
+          <main class="layout-content-main">
+            <router-view v-slot="{ Component }" class="layout-content-router">
+              <component :is="Component" key="Layout" />
+            </router-view>
+          </main>
+        </a-layout>
+      </a-layout>
+    </a-layout>
+  </template>
+  <script setup>
+  import { ref, computed, h, reactive, onMounted, watch, nextTick } from "vue";
+  import { useRoute, useRouter } from "vue-router";
+  import { useSystemStore } from "@/store/modules/systemStore";
+  import LayoutHeader from "@/components/Layout/components/layoutHeader/index.vue";
+  import subMenu from "@/components/Layout/components/subMenu/index.vue";
+  import { RouterTagData } from '@/store/modules/routerTag.js'
+  
+  // 标签页仓库
+  const settingStore = RouterTagData()
+  
+  const systemStore = useSystemStore();
+  
+  const route = useRoute();
+  const router = useRouter();
+  
+  const menuSecondLongShow = ref(systemStore.menuSecondLongShow);
+  // 主菜单
+  const routesData = router.options.routes[0]?.children || [];
+  
+  const menuTabSate = ref([systemStore.getMenuTabSate || routesData[0].name]);
+  //子菜单
+  const menuSecondData = ref(systemStore.getRouteItem);
+  // 选中的状态路由列表
+  const menuSecondSelectedStatusData = ref(systemStore.getRouteItem);
+  const routeItemSelectedKeys = ref();
+  
+  const evMenuSecondLongShow = () => {
+    systemStore.setStateValue({
+      key: "menuSecondLongShow",
+      value: menuSecondLongShow.value ? 1 : 0,
+      localStorage: true,
+    });
+  };
+  const evMouseleaveMenu = (e) => {
+    if (
+      e.relatedTarget?.offsetParent?.id &&
+      e.relatedTarget?.offsetParent?.id == "layout-sider"
+    )
+      return;
+    menuSecondData.value = menuSecondSelectedStatusData.value;
+  };
+  // 子菜单
+  const evMouseLeavesSubMenu = () => {
+    menuSecondData.value = menuSecondSelectedStatusData.value;
+  };
+  // 鼠标滑动上去更新菜单栏 目前先屏蔽
+  const evMenuGetFn = (routeItem, type) => {
+    if (menuSecondLongShow.value) {
+      menuSecondData.value = routeItem;
+    }
+  };
+  
+  // 查找最下级
+  const findPath = (data) => {
+    if (data.children && data.children.length > 0) {
+      return findPath(data.children[0]);
+    } else {
+      return data;
+    }
+  };
+  
+  // 主路由 状态
+  const changeRoutesItems = (e) => {
+    const item = findPath(e);
+    evGoPage(item);
+  };
+  
+  // 跳转路由
+  const evGoPage = async (routeItem) => {
+    // settingStore.tagsPushData(routeItem);
+    await router.push({
+      name: routeItem.name,
+    });
+    menuTabSate.value = [route.matched[1].name];
+    systemStore.setStateValue({
+      key: "menuTabSate",
+      value: menuTabSate.value[0] || "",
+      localStorage: true,
+    });
+  
+    menuSecondSelectedStatusData.value = routesData.find(
+      (item) => item.name == menuTabSate.value
+    );
+    menuSecondData.value = menuSecondSelectedStatusData.value;
+    systemStore.setStateValue({
+      key: "routeItem",
+      value: JSON.stringify(menuSecondData.value),
+      localStorage: true,
+    });
+  };
+  
+  watch(
+    route,
+    (val) => {
+      if (val.name) {
+        routeItemSelectedKeys.value = [val.name];
+      }
+    },
+    { immediate: true }
+  );
+  </script>
+  <style scoped lang="less">
+  .layout-header {
+    height: 48px;
+    background: @bg_color_2;
+    // padding-inline: 10px;
+    box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
+    z-index: 9;
+  }
+  
+  .ant-layout-content {
+    height: auto;
+    min-height: auto;
+    overflow-y: auto;
+    padding: 0 20px;
+  }
+  
+  .layout-content-main {
+    flex: 1;
+    padding: 0 1.2rem 1.6rem 1.2rem;
+    margin: 1.1rem 0 0rem 0;
+    overflow-y: auto;
+    overflow: overlay;
+    height: 95%;
+    display: flex;
+    flex-wrap: wrap;
+  }
+  
+  .logo-layout {
+    height: 64px;
+    color: #fff;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  
+    .logo {
+      width: 100%;
+      height: 32px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+  
+      h3 {
+        white-space: nowrap;
+      }
+    }
+  }
+  
+  .arco-layout {
+    color: @text_color_1;
+    background: @layout-split-color !important;
+    overflow: hidden;
+  }
+  
+  :deep(.arco-menu-light) {
+    background-color: @bg_color_3;
+  
+    .arco-menu-item {
+      background-color: @bg_color_3;
+    }
+  }
+  
+  :deep(.arco-layout-sider-light) {
+    background-color: @bg_color_3;
+  }
+  
+  :deep(.arco-menu-inline-header) {
+    font-weight: 600;
+    color: @text_color_1;
+    background-color: @bg_color_3;
+  }
+  
+  :deep(.layout-content-router) {
+    padding: 0 1rem 1rem 1rem;
+    background-color: @bg_color_4;
+    box-sizing: border-box;
+    width: 100%;
+  }
+  
+  :deep(.arco-menu-inline-content) {
+    .arco-menu-selected {
+      color: @text_color_1;
+      background-color: @black_3;
+  
+      &:after {
+        content: none;
+      }
+    }
+  }
+  
+  #layout-sider {
+    :deep(.arco-menu-selected) {
+      color: @text_color_1 !important;
+      font-weight: bold;
+      background-color: @black_3;
+  
+      .arco-icon {
+        color: @text_color_1 !important;
+      }
+  
+      &:hover {
+        background-color: rgba(235, 19, 19, 0.1) !important;
+      }
+    }
+  
+    :deep(.arco-menu-inline) {
+      .arco-menu-inline-header {
+        background-color: @bg_color_3;
+        padding-left: 20px;
+        left: 5px;
+  
+        svg {
+          color: @text_color_1 !important;
+          font-size: 14px;
+        }
+  
+        .arco-menu-icon-suffix {
+          color: @text_color_1 !important;
+          left: 0px !important;
+          right: auto;
+        }
+  
+        &:hover {
+          background-color: rgba(255, 255, 255, 0) !important;
+        }
+      }
+  
+      .arco-menu-item {
+        padding: 0 5px;
+      }
+    }
+  
+    :deep(.arco-menu-item) {
+      padding-left: 24px;
+    }
+  }
+  </style>

src/components/Layout/components/layout/menu.vue

@@ -1,306 +1,9 @@
 <template>
-  <a-layout style="min-height: 100vh">
-    <a-layout-sider :width="240" :collapsed-width="50" collapsible :trigger="null" @collapse="evMenuSecondLongShow"
-      v-model:collapsed="menuSecondLongShow">
-      <div class="logo-layout">
-        <div class="logo">
-          <img src="@/assets/images/logo.jpg" style="height: 26px; width: 26px;" />
-          <h3 v-if="!menuSecondLongShow" style="margin-left: 10px;"> Easy life</h3>
-        </div>
-      </div>
-
-      <a-menu v-model:selectedKeys="routeItemSelectedKeys" @mouseleave="evMouseleaveMenu">
-        <a-sub-menu v-for="routeItem in routesData" :key="routeItem.name">
-          <template #icon>
-            <svg-icon :icon="routeItem.meta.icon"></svg-icon>
-          </template>
-          <template #title>{{ routeItem.meta.title }}</template>
-          <template v-for="item in routeItem?.children || []">
-            <a-menu-item v-if="!item.children || item.children.length === 0" :key="item.name?.toString()"
-              @click="evGoPage(item)">
-              <span class="menu-level-font">{{ item.meta.title }}</span>
-            </a-menu-item>
-            <template v-else-if="item.children && item.children.length > 0">
-              <sub-menu :key="item.name" :menu-info="item" @go="evGoPage" />
-            </template>
-          </template>
-        </a-sub-menu>
-      </a-menu>
-    </a-layout-sider>
-
-    <a-layout>
-      <a-layout-header class="layout-header">
-        <LayoutHeader />
-      </a-layout-header>
-      <a-layout>
-        <!-- <a-layout-sider id="layout-sider" :collapsed="false" :width="menuSecondData &&
-          menuSecondData.children &&
-          menuSecondData.children.length > 0
-          ? 160
-          : 0
-          " @mouseleave="evMouseLeavesSubMenu">
-          <a-menu :selectedKeys="routeItemSelectedKeys" id="layout-sider" theme="light" mode="vertical"
-            :collapsed="false" :auto-open="true">
-            <template v-for="routeItem in menuSecondData?.children || []">
-              <a-menu-item v-if="!routeItem.children || routeItem.children.length === 0"
-                :key="routeItem.name?.toString()" @click="evGoPage(routeItem)">
-                <span class="menu-level-font">{{ routeItem.meta.title }}</span>
-              </a-menu-item>
-
-              <template v-else-if="routeItem.children && routeItem.children.length > 0">
-                <sub-menu :key="routeItem.name" :menu-info="routeItem" @go="evGoPage" />
-              </template>
-            </template>
-          </a-menu>
-        </a-layout-sider> -->
-
-        <main class="layout-content-main">
-          <router-view v-slot="{ Component }" class="layout-content-router">
-            <component :is="Component" key="Layout" />
-          </router-view>
-        </main>
-      </a-layout>
-    </a-layout>
-  </a-layout>
+  <HongKong v-if="EnvTypeNum==1"/>
+  <Thailand v-if="EnvTypeNum==0"/>
 </template>
 <script setup>
-import { ref, computed, h, reactive, onMounted, watch, nextTick } from "vue";
-import { useRoute, useRouter } from "vue-router";
-import { useSystemStore } from "@/store/modules/systemStore";
-import LayoutHeader from "@/components/Layout/components/layoutHeader/index.vue";
-import subMenu from "@/components/Layout/components/subMenu/index.vue";
-import { RouterTagData } from '@/store/modules/routerTag.js'
-
-// 标签页仓库
-const settingStore = RouterTagData()
-
-const systemStore = useSystemStore();
-
-const route = useRoute();
-const router = useRouter();
-
-const menuSecondLongShow = ref(systemStore.menuSecondLongShow);
-// 主菜单
-const routesData = router.options.routes[0]?.children || [];
-
-const menuTabSate = ref([systemStore.getMenuTabSate || routesData[0].name]);
-//子菜单
-const menuSecondData = ref(systemStore.getRouteItem);
-// 选中的状态路由列表
-const menuSecondSelectedStatusData = ref(systemStore.getRouteItem);
-const routeItemSelectedKeys = ref();
-
-const evMenuSecondLongShow = () => {
-  systemStore.setStateValue({
-    key: "menuSecondLongShow",
-    value: menuSecondLongShow.value ? 1 : 0,
-    localStorage: true,
-  });
-};
-const evMouseleaveMenu = (e) => {
-  if (
-    e.relatedTarget?.offsetParent?.id &&
-    e.relatedTarget?.offsetParent?.id == "layout-sider"
-  )
-    return;
-  menuSecondData.value = menuSecondSelectedStatusData.value;
-};
-// 子菜单
-const evMouseLeavesSubMenu = () => {
-  menuSecondData.value = menuSecondSelectedStatusData.value;
-};
-// 鼠标滑动上去更新菜单栏 目前先屏蔽
-const evMenuGetFn = (routeItem, type) => {
-  if (menuSecondLongShow.value) {
-    menuSecondData.value = routeItem;
-  }
-};
-
-// 查找最下级
-const findPath = (data) => {
-  if (data.children && data.children.length > 0) {
-    return findPath(data.children[0]);
-  } else {
-    return data;
-  }
-};
-
-// 主路由 状态
-const changeRoutesItems = (e) => {
-  const item = findPath(e);
-  evGoPage(item);
-};
-
-// 跳转路由
-const evGoPage = async (routeItem) => {
-  // settingStore.tagsPushData(routeItem);
-  await router.push({
-    name: routeItem.name,
-  });
-  menuTabSate.value = [route.matched[1].name];
-  systemStore.setStateValue({
-    key: "menuTabSate",
-    value: menuTabSate.value[0] || "",
-    localStorage: true,
-  });
-
-  menuSecondSelectedStatusData.value = routesData.find(
-    (item) => item.name == menuTabSate.value
-  );
-  menuSecondData.value = menuSecondSelectedStatusData.value;
-  systemStore.setStateValue({
-    key: "routeItem",
-    value: JSON.stringify(menuSecondData.value),
-    localStorage: true,
-  });
-};
-
-watch(
-  route,
-  (val) => {
-    if (val.name) {
-      routeItemSelectedKeys.value = [val.name];
-      console.log(routesData);
-    }
-  },
-  { immediate: true }
-);
+import { EnvTypeNum } from '@/settings/designSetting'
+import HongKong from './components/HongKong.vue'
+import Thailand from './components/Thailand.vue'
 </script>
-<style scoped lang="less">
-.layout-header {
-  height: 48px;
-  background: @bg_color_2;
-  // padding-inline: 10px;
-  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
-  z-index: 9;
-}
-
-.ant-layout-content {
-  height: auto;
-  min-height: auto;
-  overflow-y: auto;
-  padding: 0 20px;
-}
-
-.layout-content-main {
-  flex: 1;
-  padding: 0 1.2rem 1.6rem 1.2rem;
-  margin: 1.1rem 0 0rem 0;
-  overflow-y: auto;
-  overflow: overlay;
-  height: 95%;
-  display: flex;
-  flex-wrap: wrap;
-}
-
-.logo-layout {
-  height: 64px;
-  color: #fff;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: #0f2d5c;
-
-  .logo {
-    width: 100%;
-    height: 32px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-
-    h3 {
-      white-space: nowrap;
-    }
-  }
-}
-
-.arco-layout {
-  color: @text_color_1;
-  background: @layout-split-color !important;
-  overflow: hidden;
-}
-
-:deep(.arco-menu-light) {
-  background-color: #0f2d5c;
-
-  .arco-menu-item {
-    color: #fff;
-    background: #0f2d5c;
-  }
-}
-
-:deep(.arco-layout-sider-light) {
-  background-color: #0f2d5c;
-}
-
-:deep(.arco-menu-inline-header) {
-  font-weight: 600;
-  color: @text_color_1;
-  background-color: @bg_color_3;
-}
-
-:deep(.layout-content-router) {
-  padding: 0 1rem 1rem 1rem;
-  background-color: @bg_color_4;
-  box-sizing: border-box;
-  width: 100%;
-}
-
-:deep(.arco-menu-inline-content) {
-  .arco-menu-selected {
-    color: @text_color_1;
-    background-color: @black_3;
-
-    &:after {
-      content: none;
-    }
-  }
-}
-
-#layout-sider {
-  :deep(.arco-menu-selected) {
-    color: @text_color_1 !important;
-    font-weight: bold;
-    background-color: @black_3;
-
-    .arco-icon {
-      color: @text_color_1 !important;
-    }
-
-    &:hover {
-      background-color: rgba(235, 19, 19, 0.1) !important;
-    }
-  }
-
-  :deep(.arco-menu-inline) {
-    .arco-menu-inline-header {
-      background-color: @bg_color_3;
-      padding-left: 20px;
-      left: 5px;
-
-      svg {
-        color: @text_color_1 !important;
-        font-size: 14px;
-      }
-
-      .arco-menu-icon-suffix {
-        color: @text_color_1 !important;
-        left: 0px !important;
-        right: auto;
-      }
-
-      &:hover {
-        background-color: rgba(255, 255, 255, 0) !important;
-      }
-    }
-
-    .arco-menu-item {
-      padding: 0 5px;
-    }
-  }
-
-  :deep(.arco-menu-item) {
-    padding-left: 24px;
-  }
-}
-</style>

src/settings/designSetting.js

@@ -7,4 +7,7 @@ export const theme = {
   darkTheme: true,
   //默认主题色
   appTheme: '#1890ff'
-}
+}
+
+// 区分项目运行
+export const EnvTypeNum = Number(import.meta.env.VITE_DEV_TYPE)

src/views/login/components/HongKong/index.vue

@@ -0,0 +1,112 @@
+<template>
+  <div class="container">
+    <div class="logo">
+      <div class="logo-text">Easy life Platform</div>
+    </div>
+    <div class="content">
+      <div class="content-inner">
+        <LoginForm />
+      </div>
+    </div>
+  </div>
+</template>
+
+
+<script setup>
+import { onMounted } from "vue"
+import LoginForm from '../../components/HongKong/login-form.vue'
+
+import bannerImage from '@/assets/images/login-banner.png'
+const carouselItem = {
+  slogan: 'Easy life Platform',
+  subSlogan: 'Technology serves life',
+  image: bannerImage,
+}
+</script>
+
+<style scoped lang="less">
+.container {
+  height: 100vh;
+  width: 100vw;
+
+  .banner {
+    width: 550px;
+    background: linear-gradient(163.85deg, #1d2129 0%, #00308f 100%);
+  }
+
+  .content {
+    position: relative;
+    display: flex;
+    flex: 1;
+    align-items: center;
+    justify-content: center;
+    padding-bottom: 40px;
+    background-image: url('@/assets/images/login_Bg.jpg');
+    height: 100%;
+    width: 100%;
+    background-repeat: no-repeat;
+    background-position: center center;
+    background-size: cover;
+  }
+
+  .footer {
+    position: absolute;
+    right: 0;
+    bottom: 0;
+    width: 100%;
+  }
+}
+
+.logo {
+  position: fixed;
+  top: 24px;
+  left: 22px;
+  z-index: 1;
+  display: inline-flex;
+  align-items: center;
+
+  &-text {
+    margin-right: 4px;
+    margin-left: 4px;
+    color: @bg_color_6;
+    font-size: 20px;
+  }
+}
+
+.banner {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.carousel {
+  height: 100%;
+
+  &-item {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+  }
+
+  &-title {
+    color: @bg_color_6;
+    font-weight: 500;
+    font-size: 20px;
+    line-height: 28px;
+  }
+
+  &-sub-title {
+    margin-top: 8px;
+    color: @text_color_2;
+    font-size: 14px;
+    line-height: 22px;
+  }
+
+  &-image {
+    width: 320px;
+    margin-top: 30px;
+  }
+}
+</style>

src/views/login/components/Thailand/index.vue

@@ -0,0 +1,118 @@
+<template>
+  <div class="container">
+    <div class="logo">
+      <!-- <img alt="logo" :src="carouselItem.image" style="height: 50px; border-radius: 50%" /> -->
+      <div class="logo-text">Easy life Platform</div>
+    </div>
+
+
+    <div class="banner">
+      <div  class="carousel-item">
+        <div class="carousel-title">{{ carouselItem.slogan }}</div>
+        <div class="carousel-sub-title">{{ carouselItem.subSlogan }}</div>
+        <img class="carousel-image" :src="carouselItem.image" />
+      </div>
+    </div>
+
+    <div class="content">
+      <div class="content-inner">
+        <LoginForm />
+      </div>
+    </div>
+  </div>
+</template>
+
+
+<script setup>
+import { onMounted } from "vue"
+import LoginForm from './login-form.vue'
+
+import bannerImage from '@/assets/images/login-banner.png'
+const  carouselItem = {
+  slogan: 'Easy life Platform',
+  subSlogan: 'Technology serves life',
+  image: bannerImage,
+}
+</script>
+
+<style scoped lang="less">
+.container {
+  display: flex;
+  height: 100vh;
+  min-width: 1000px;
+  flex-direction: row;
+  .banner {
+    width: 550px;
+    background: linear-gradient(163.85deg, #1d2129 0%, #00308f 100%);
+  }
+
+  .content {
+    position: relative;
+    display: flex;
+    flex: 1;
+    align-items: center;
+    justify-content: center;
+    padding-bottom: 40px;
+    background: @bg_color_2;
+  }
+
+  .footer {
+    position: absolute;
+    right: 0;
+    bottom: 0;
+    width: 100%;
+  }
+}
+.logo {
+  position: fixed;
+  top: 24px;
+  left: 22px;
+  z-index: 1;
+  display: inline-flex;
+  align-items: center;
+
+  &-text {
+    margin-right: 4px;
+    margin-left: 4px;
+    color: @bg_color_6;
+    font-size: 20px;
+  }
+}
+
+.banner {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.carousel {
+  height: 100%;
+
+  &-item {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+  }
+
+  &-title {
+    color: @bg_color_6;
+    font-weight: 500;
+    font-size: 20px;
+    line-height: 28px;
+  }
+
+  &-sub-title {
+    margin-top: 8px;
+    color: @text_color_2;
+    font-size: 14px;
+    line-height: 22px;
+  }
+
+  &-image {
+    width: 320px;
+    margin-top: 30px;
+  }
+}
+</style>
+

src/views/login/components/Thailand/login-form.vue

@@ -0,0 +1,156 @@
+<template>
+  <div class="login-form-wrapper">
+    <div class="login-form-title">Easy life</div>
+    <div class="login-form-sub-title">Login to Easy life</div>
+
+    <a-form ref="loginForm" :model="formData" class="login-form" @submit-success="handleSubmit">
+      <a-form-item field="username" :rules="[{ required: true, message: '用户名不能为空' }]"
+        :validate-trigger="['change', 'blur']" hide-label>
+        <a-input v-model="formData.username" :placeholder="$t('login.userName')">
+          <template #prefix>
+            <icon-user />
+          </template>
+        </a-input>
+      </a-form-item>
+      <a-form-item field="password" :rules="[{ required: true, message: '密码不能为空' }]"
+        :validate-trigger="['change', 'blur']" hide-label>
+        <a-input-password v-model="formData.password" :placeholder="$t('login.password')" allow-clear>
+          <template #prefix>
+            <icon-lock />
+          </template>
+        </a-input-password>
+      </a-form-item>
+
+
+      <a-space :size="16" direction="vertical">
+        <div class="login-form-password-actions">
+          <a-checkbox v-model="rememberPassword">
+            {{ $t('login.RememberAccountNumber') }}
+          </a-checkbox>
+          <!-- <a-link>忘记密码</a-link> -->
+        </div>
+        <a-button type="primary" html-type="submit" long :loading="formLoading">{{ $t('login.disembark') }}</a-button>
+      </a-space>
+    </a-form>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, toRefs, onMounted } from 'vue'
+import { encryptByDES } from "@/utils"
+import { loginApi } from "@/api/path/login.api"
+import { useSystemStore } from "@/store/modules/systemStore"
+import { useRouter } from 'vue-router'
+import { updateRouteByMenu } from '@/router/router.update'
+import { FormLoginUser } from '@/store/modules/Login'
+import {useI18n} from 'vue-i18n'
+const {t} = useI18n();
+const router = useRouter()
+const systemStore = useSystemStore()
+const LoginSet = FormLoginUser()
+const state = ref({
+  formData: {
+    username: '',
+    password: ''
+  },
+  formLoading: false,
+  rememberPassword: false,
+})
+
+const { formData, formLoading, rememberPassword } = toRefs(state.value)
+
+const handleSubmit = async () => {
+  const { data } = await loginApi({
+    username: formData.value.username,
+    password: encryptByDES(formData.value.password)
+  })
+
+  if (rememberPassword.value) {
+    LoginSet.loginYester(formData.value)
+  } else {
+    const nste = localStorage.getItem("USER_KEY_ACCOUT") || false;
+    if (nste) {
+      localStorage.removeItem('USER_KEY_ACCOUT')
+    }
+  }
+
+  systemStore.setStateValue({
+    key: 'token',
+    value: data.token,
+    localStorage: true,
+  })
+  systemStore.setStateValue({
+    key: 'user_login_information',
+    value: JSON.stringify(data.userInfo ? data.userInfo : data),
+    localStorage: true,
+  })
+  systemStore.setStateValue({
+    key: 'role',
+    value: data.userType,
+    localStorage: true,
+  })
+  await updateRouteByMenu(router, systemStore)
+
+  const settingLayout = localStorage.getItem('LayoutDisposition') || false
+  if(!settingLayout) {
+    const item = {
+      crumbs:false,
+      BreadcrumbIcon:false,
+      SidebarLogo:false,
+      HeadNavigationBar:false,
+      laoutStyle:1
+    }
+    localStorage.setItem('LayoutDisposition',JSON.stringify(item))
+  }
+
+  router.push({
+    path: "/",
+  })
+}
+
+onMounted(() => {
+  if (LoginSet.loadCredentials()) {
+    formData.value.username = LoginSet.loadCredentials()?.username
+    formData.value.password = LoginSet.loadCredentials()?.password
+  }
+})
+
+
+</script>
+
+<style lang="less" scoped>
+.login-form-wrapper {
+  margin: 0 1rem;
+}
+
+.login-form {
+  margin-top: 32px;
+
+  &-wrapper {
+    width: 320px;
+  }
+
+  &-title {
+    color: @text_color_1;
+    font-weight: 500;
+    font-size: 24px;
+    line-height: 32px;
+  }
+
+  &-sub-title {
+    color: @text_color_2;
+    font-size: 16px;
+    line-height: 24px;
+  }
+
+  &-password-actions {
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 15px;
+  }
+
+  &-register-btn {
+    color: @text_color_3 !important;
+  }
+}
+</style>

src/views/login/index.vue

@@ -1,123 +1,14 @@
 <template>
-  <div class="container">
-    <div class="logo">
-      <!-- <img alt="logo" :src="carouselItem.image" style="height: 50px; border-radius: 50%" /> -->
-      <div class="logo-text">Easy life Platform</div>
-    </div>
-
-    <!-- 
-    <div class="banner">
-      <div  class="carousel-item">
-        <div class="carousel-title">{{ carouselItem.slogan }}</div>
-        <div class="carousel-sub-title">{{ carouselItem.subSlogan }}</div>
-        <img class="carousel-image" :src="carouselItem.image" />
-      </div>
-    </div> -->
-
-    <div class="content">
-      <div class="content-inner">
-        <LoginForm />
-      </div>
-    </div>
-  </div>
+  <LoginHongKeng v-if="EnvTypeNum===1"/>
+  <Thailand v-if="EnvTypeNum===0"/>
 </template>
 
-
-<script setup>
-import { onMounted } from "vue"
-import LoginForm from './login-form.vue'
-
-import bannerImage from '@/assets/images/login-banner.png'
-const carouselItem = {
-  slogan: 'Easy life Platform',
-  subSlogan: 'Technology serves life',
-  image: bannerImage,
-}
+<script setup >
+import LoginHongKeng from './components/HongKong/index.vue'
+import Thailand from './components/Thailand/index.vue'
+import { EnvTypeNum } from '@/settings/designSetting'
+console.log(EnvTypeNum);
 </script>
 
-<style scoped lang="less">
-.container {
-  height: 100vh;
-  width: 100vw;
-
-  .banner {
-    width: 550px;
-    background: linear-gradient(163.85deg, #1d2129 0%, #00308f 100%);
-  }
-
-  .content {
-    position: relative;
-    display: flex;
-    flex: 1;
-    align-items: center;
-    justify-content: center;
-    padding-bottom: 40px;
-    background-image: url('@/assets/images/login_Bg.jpg');
-    height: 100%;
-    width: 100%;
-    background-repeat: no-repeat;
-    background-position: center center;
-    background-size: cover;
-  }
-
-  .footer {
-    position: absolute;
-    right: 0;
-    bottom: 0;
-    width: 100%;
-  }
-}
-
-.logo {
-  position: fixed;
-  top: 24px;
-  left: 22px;
-  z-index: 1;
-  display: inline-flex;
-  align-items: center;
-
-  &-text {
-    margin-right: 4px;
-    margin-left: 4px;
-    color: @bg_color_6;
-    font-size: 20px;
-  }
-}
-
-.banner {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.carousel {
-  height: 100%;
-
-  &-item {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    height: 100%;
-  }
-
-  &-title {
-    color: @bg_color_6;
-    font-weight: 500;
-    font-size: 20px;
-    line-height: 28px;
-  }
-
-  &-sub-title {
-    margin-top: 8px;
-    color: @text_color_2;
-    font-size: 14px;
-    line-height: 22px;
-  }
-
-  &-image {
-    width: 320px;
-    margin-top: 30px;
-  }
-}
+<style scoped lang='less'>
 </style>

vite.config.js

@@ -1,16 +1,13 @@
 import { defineConfig, loadEnv } from "vite";
 import vue from "@vitejs/plugin-vue";
 import { createSvgIconsPlugin } from "vite-plugin-svg-icons";
-
 import { resolve } from "path";
 
-
 function pathResolve(dir) {
     return resolve(process.cwd(), ".", dir);
 }
 
 export default defineConfig(({ command, mode }) => {
-    const config = loadEnv(mode, './')
     return {
         resolve: {
             alias: [{
@@ -40,7 +37,7 @@ export default defineConfig(({ command, mode }) => {
                     additionalData: '@import "@/assets/css/theme.less";@import "@/assets/css/global.less";',
                 },
             },
-            
+
         },
         build: {
             minify: true, // 生产环境不生成sourcemap
@@ -67,7 +64,7 @@ export default defineConfig(({ command, mode }) => {
                 "/api": {
                     // target:"https://sim.nanodreamtech.com",
                     // target: config.VITE_API_URL,
-                    target: "https://flexi.flexistream.link",
+                    target: process.env.VITE_DEV_TYPE == 0 ? "http://sim.ainets.net" : "https://flexi.flexistream.link",
                     changeOrigin: true,
                     ws: true,
                     secure: true,