From ac4341ea6b66ae02427d39d35f41d42d78b2eb2e Mon Sep 17 00:00:00 2001 From: Junjie <fallin.jie@qq.com> Date: 星期五, 14 二月 2025 10:08:32 +0800 Subject: [PATCH] # --- zy-asrs-admin/src/views/IndexView.vue | 156 ++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 120 insertions(+), 36 deletions(-) diff --git a/zy-asrs-admin/src/views/IndexView.vue b/zy-asrs-admin/src/views/IndexView.vue index 13eb79d..858fcdb 100644 --- a/zy-asrs-admin/src/views/IndexView.vue +++ b/zy-asrs-admin/src/views/IndexView.vue @@ -1,5 +1,5 @@ <script setup> -import { nextTick, ref, inject } from 'vue'; +import { nextTick, ref, inject, onMounted } from 'vue'; import { useRouter } from "vue-router"; import { get, post, postForm } from '@/utils/request.js' import { logout } from '@/config.js'; @@ -14,11 +14,15 @@ UserOutlined, TranslationOutlined, ApartmentOutlined, + CaretLeftOutlined, + CaretRightOutlined, } from "@ant-design/icons-vue"; -import { formatMessage } from '@/utils/localeUtils.js'; +import { formatMessage, loadData } from '@/utils/localeUtils.js'; +import AiView from '@/components/ai/index.vue' const globalState = inject('globalState'); const selectedKeys = ref([]); +let openKeys = ref([]); const collapsed = ref(false); const router = useRouter(); let routerCache = ref([]); @@ -27,10 +31,33 @@ let isRouterAlive = ref(true); const menuCache = ref([]); const hostList = ref([]); +const tabsContent = ref(null); const components = { ...Icons, }; + +onMounted(() => { + let name = router.currentRoute.value.name; + let path = router.currentRoute.value.path; + if (currentCache.value == null && path != '/') { + get('/api/menu/get/route', { + route: path + }).then((resp) => { + let result = resp.data; + let data = result.data; + if (result.code == 200) { + currentCache.value = name; + routerCache.value.push(name) + routerCacheList.value.push({ + key: path, + languageId: data.languageId, + name: name, + }) + } + }) + } +}) getMenu() function getMenu() { @@ -97,7 +124,7 @@ isRouterAlive.value = false; nextTick(() => { isRouterAlive.value = true; - message.success(formatMessage('common.success', '鍔犺浇鎴愬姛')); + // message.success(formatMessage('common.success', '鍔犺浇鎴愬姛')); }) } catch (error) { message.error(formatMessage('common.fail', '鍔犺浇澶辫触')); @@ -121,11 +148,17 @@ currentCache.value = item.name; selectedKeys.value = [item.key] + + // open menu + let arr = item.key.split("/"); + let key = '/' + arr[1]; + openKeys.value = [key] } -const switchLocale = (locale) => { +const switchLocale = async (locale) => { globalState.locale = locale; localStorage.setItem('locale', locale) + loadData(locale); reloadTabs() } @@ -150,6 +183,18 @@ }) } +const licenseDays = ref(365); +getLicenseDays(); +function getLicenseDays() { + post('/api/license/getLicenseDays', {}).then((resp) => { + let result = resp.data; + let data = result.data; + if (result.code == 200) { + licenseDays.value = data; + } + }) +} + const switchHost = (item) => { globalState.currentHost = item; postForm('/api/root/change/host/auth', { @@ -164,44 +209,65 @@ }) } +const windowReload = () => { + window.location.reload(); +} + +const handleScroll = (data) => { + let position = tabsContent.value.scrollLeft; + let offset = position * 0.1 + 30; + if (data == 'left') { + tabsContent.value.scrollLeft = position - offset; + } else { + tabsContent.value.scrollLeft = position + offset; + } +} + </script> <template> <a-layout class="main"> - <a-layout-sider v-model:collapsed="collapsed" :trigger="null" collapsible> + <a-layout-sider class="main-sider" v-model:collapsed="collapsed" :trigger="null" collapsible theme="dark"> <div class="logo" /> - <a-menu v-for="(item, index) in menuCache" :key="index" v-model:selectedKeys="selectedKeys" @select="menuSelect" - theme="dark" mode="inline"> + <a-menu v-model:openKeys="openKeys" v-model:selectedKeys="selectedKeys" @select="menuSelect" theme="dark" + mode="inline"> <div> <a-menu-item key="/" name="涓婚〉"> <HomeOutlined /> {{ formatMessage('common.home', '涓婚〉') }} </a-menu-item> </div> - <a-sub-menu v-if="item.type == 0"> - <template #title> - <span> - <component :is="components[ref(item.icon).value]" /> - {{ formatMessage(item.languageId, item.name) }} - </span> - </template> - <div v-for="(child, idx) in item.children"> - <a-menu-item v-if="child.status == 1" :key="child.route" :name="child.name" :languageId="child.languageId"> - {{ formatMessage(child.languageId, child.name) }} - </a-menu-item> - </div> - </a-sub-menu> + <div v-for="(item, index) in menuCache" :key="index"> + <a-sub-menu :key="item.route" v-if="item.type == 0"> + <template #title> + <span> + <component :is="components[ref(item.icon).value]" /> + {{ formatMessage(item.languageId, item.name) }} + </span> + </template> + <div v-for="(child, idx) in item.children"> + <a-menu-item v-if="child.status == 1" :key="child.route" :name="child.name" + :languageId="child.languageId"> + {{ formatMessage(child.languageId, child.name) }} + </a-menu-item> + </div> + </a-sub-menu> + </div> </a-menu> </a-layout-sider> <a-layout> - <a-layout-header style="background: #fff; padding: 0"> + <a-layout-header style="background: #fff; padding: 0;"> <div class="header-top"> <div class="header-top-left"> - <MenuUnfoldOutlined v-if="collapsed" class="trigger" @click="() => (collapsed = !collapsed)" /> + <MenuUnfoldOutlined v-if="collapsed" class="trigger triggerLarge" @click="() => (collapsed = !collapsed)" /> <MenuFoldOutlined v-else class="trigger" @click="() => (collapsed = !collapsed)" /> + <RedoOutlined class="trigger" @click="windowReload()" /> </div> <div class="header-top-right"> + <div class="trigger" style="color: red;" v-if="licenseDays <= 30"> + 璁稿彲璇佹湁鏁堟湡锛歿{ licenseDays }}澶� + </div> <div class="trigger" v-if="globalState.currentHost"> <a-dropdown> <div> @@ -218,13 +284,16 @@ </div> <div class="trigger"> <a-dropdown> - <TranslationOutlined /> + <div> + <TranslationOutlined /> + {{ globalState.localeList[globalState.locale]?.desc }} + </div> <template #overlay> <a-menu> - <a-menu-item @click="switchLocale('enUS')" - :class="globalState.locale == 'enUS' ? 'active' : ''">English</a-menu-item> - <a-menu-item @click="switchLocale('zhCN')" - :class="globalState.locale == 'zhCN' ? 'active' : ''">绠�浣撲腑鏂�</a-menu-item> + <div v-for="(item, key) in globalState.localeList" :key="key"> + <a-menu-item @click="switchLocale(key)" :class="globalState.locale == key ? 'active' : ''">{{ + item.desc }}</a-menu-item> + </div> </a-menu> </template> </a-dropdown> @@ -247,25 +316,40 @@ </a-layout-header> <a-layout-content class="content-view"> <div class="tabs-fixed"> - <div v-for="(item, index) in routerCacheList" :key="index" @click="switchTabs(item)" class="tabs-item" - :class="currentCache == item.name ? 'tabs-item-active' : ''"> - <div :class="currentCache == item.name ? '' : 'tabs-item-reload-none'" @click="reloadTabs" @click.stop> - <RedoOutlined /> - </div> - <div>{{ formatMessage(item.languageId, item.name) }}</div> - <div @click="closeTabs(item)" @click.stop> - <CloseOutlined /> + <div class="tabs-arrow-left" @click="handleScroll('left')"> + <CaretLeftOutlined /> + </div> + + <div class="tabs-content" ref="tabsContent"> + <div class="tabs-content-item"> + <div v-for="(item, index) in routerCacheList" :key="index" @click="switchTabs(item)" class="tabs-item" + :class="currentCache == item.name ? 'tabs-item-active' : ''"> + <div :class="currentCache == item.name ? '' : 'tabs-item-reload-none'" @click="reloadTabs" @click.stop> + <RedoOutlined /> + </div> + <div>{{ formatMessage(item.languageId, item.name) }}</div> + <div @click="closeTabs(item)" @click.stop> + <CloseOutlined /> + </div> + </div> </div> </div> + + <div class="tabs-arrow-right" @click="handleScroll('right')"> + <CaretRightOutlined /> + </div> </div> + <router-view v-slot="{ Component, route }" v-if="isRouterAlive"> <keep-alive :include="routerCache"> - <component :is="Component" /> + <component :is="Component" @pageReload="reloadTabs" /> </keep-alive> </router-view> </a-layout-content> </a-layout> </a-layout> + + <AiView /> </template> <style scoped></style> -- Gitblit v1.9.1