From 8313ec2ae0f3ce4bd60378a5182029f677023c29 Mon Sep 17 00:00:00 2001
From: donghao <donghao@supervision.ltd>
Date: Wed, 17 Jan 2024 11:33:43 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=98=BF=E9=87=8C=E5=9B=BE=E6=A0=87?=
=?UTF-8?q?=E5=BA=93=E6=9B=B4=E6=96=B0=EF=BC=8C=E8=8F=9C=E5=8D=95=E6=A0=8F?=
=?UTF-8?q?=E6=95=B4=E4=BD=93=E4=BC=98=E5=8C=96=E5=AE=8C=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
index.html | 6 +-
locales/en.yaml | 5 +-
locales/zh-CN.yaml | 5 +-
mock/asyncRoutes.ts | 4 +-
.../CustomTree/src/collapseTree.tsx | 37 ++++-----
.../CustomTree/src/collapseTreeItem.tsx | 65 +++++++++++----
.../CustomTree/src/collapseTreeStyle.scss | 18 +---
src/layout/components/navbar.vue | 12 +--
src/layout/components/notice/index.vue | 13 ++-
src/layout/components/search/index.vue | 2 +-
src/layout/components/sidebar/breadCrumb.vue | 4 +-
src/layout/components/sidebar/mixNav.vue | 12 ++-
src/layout/components/sidebar/vertical.vue | 41 +++++----
src/router/modules/device.ts | 6 +-
src/router/modules/home.ts | 26 ------
src/router/modules/server.ts | 14 +++-
src/router/modules/workbench.ts | 13 ++-
src/router/utils.ts | 2 +-
src/style/sidebar.scss | 83 +++----------------
src/style/vars.scss | 25 ++++++
src/utils/mitt.ts | 1 +
src/views/workbench/components/SwiperShow.vue | 4 +-
22 files changed, 200 insertions(+), 198 deletions(-)
delete mode 100644 src/router/modules/home.ts
diff --git a/index.html b/index.html
index 9b1e58a..cecee51 100644
--- a/index.html
+++ b/index.html
@@ -2,7 +2,7 @@
* @Author: donghao donghao@supervision.ltd
* @Date: 2024-01-12 14:35:28
* @LastEditors: donghao donghao@supervision.ltd
- * @LastEditTime: 2024-01-16 14:36:28
+ * @LastEditTime: 2024-01-17 10:21:07
* @FilePath: \General-AI-Platform-Web-Client\index.html
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
@@ -18,10 +18,10 @@
/>
<title>pure-admin-thin</title>
<link rel="icon" href="/favicon.ico" />
- <!-- update 2024-01-16 14:44 -->
+ <!-- update 2024-01-17 10:21 -->
<link
rel="stylesheet"
- href="//at.alicdn.com/t/c/font_4406593_7ayrx5x0q77.css"
+ href="//at.alicdn.com/t/c/font_4412653_ngfc2cgeuc.css"
/>
<script>
window.process = {};
diff --git a/locales/en.yaml b/locales/en.yaml
index 44bb70d..c51ea59 100644
--- a/locales/en.yaml
+++ b/locales/en.yaml
@@ -23,7 +23,10 @@ buttons:
hscontentFullScreen: Content FullScreen
hscontentExitFullScreen: Content ExitFullScreen
menus:
- hshome: Home
+ hshome: Workbench
+ hsdevice: Device
+ hsserver: Server
+ hstest: Test
hslogin: Login
hsabnormal: Abnormal Page
hsfourZeroFour: "404"
diff --git a/locales/zh-CN.yaml b/locales/zh-CN.yaml
index de0a399..431f0ca 100644
--- a/locales/zh-CN.yaml
+++ b/locales/zh-CN.yaml
@@ -23,7 +23,10 @@ buttons:
hscontentFullScreen: 内容区全屏
hscontentExitFullScreen: 内容区退出全屏
menus:
- hshome: 首页
+ hshome: 工作台
+ hsdevice: 设备列表
+ hsserver: 服务器
+ hstest: 测试
hslogin: 登录
hsabnormal: 异常页面
hsfourZeroFour: "404"
diff --git a/mock/asyncRoutes.ts b/mock/asyncRoutes.ts
index 80b1228..c9507a1 100644
--- a/mock/asyncRoutes.ts
+++ b/mock/asyncRoutes.ts
@@ -2,7 +2,7 @@
* @Author: donghao donghao@supervision.ltd
* @Date: 2024-01-12 14:35:28
* @LastEditors: donghao donghao@supervision.ltd
- * @LastEditTime: 2024-01-15 13:38:56
+ * @LastEditTime: 2024-01-17 11:09:58
* @FilePath: \general-work-web\General-AI-Platform-Web-Client\mock\asyncRoutes.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
@@ -22,7 +22,7 @@ const demoRouter = {
name: "DemoLeftTree",
meta: {
title: "测试",
- icon: "lollipop",
+ icon: "",
roles: ["admin", "common"],
rank: 101
}
diff --git a/src/components/CustomTree/src/collapseTree.tsx b/src/components/CustomTree/src/collapseTree.tsx
index 0aed69b..b8b9664 100644
--- a/src/components/CustomTree/src/collapseTree.tsx
+++ b/src/components/CustomTree/src/collapseTree.tsx
@@ -115,29 +115,26 @@ export default defineComponent({
<div
class={["arrow", vFirst?.expended ? "activeUp" : ""]}
></div>
- <i class="iconfont icon-fuwuqi root_tree_icon"></i>
+ <i class="iconfont icon-fushebeizu root_tree_icon"></i>
<p> {vFirst.name}</p>
</div>
</div>
- <transition name="collapseTree_child_box">
- <div class="box" v-show={vFirst?.expended}>
- <ul
- class="child_info_box"
- v-if={
- Array.isArray(vFirst.childList) &&
- vFirst.childList.length
- }
- >
- {vFirst.childList.map((item, index) => {
- return (
- <li key={index}>
- <CollapseTreeItem info={item}></CollapseTreeItem>
- </li>
- );
- })}
- </ul>
- </div>
- </transition>
+ <div class="box" v-show={vFirst?.expended}>
+ {Array.isArray(vFirst.childList) &&
+ vFirst.childList.length && (
+ <ul class="child_info_box">
+ {vFirst.childList.map((item, index) => {
+ return (
+ <li key={index}>
+ <CollapseTreeItem
+ info={item}
+ ></CollapseTreeItem>
+ </li>
+ );
+ })}
+ </ul>
+ )}
+ </div>
</li>
);
})}
diff --git a/src/components/CustomTree/src/collapseTreeItem.tsx b/src/components/CustomTree/src/collapseTreeItem.tsx
index 7693e13..3212438 100644
--- a/src/components/CustomTree/src/collapseTreeItem.tsx
+++ b/src/components/CustomTree/src/collapseTreeItem.tsx
@@ -1,5 +1,6 @@
-import { computed, defineComponent } from "vue";
+import { computed, defineComponent, nextTick, onBeforeUnmount, ref } from "vue";
import "./collapseTreeStyle.scss";
+import { emitter } from "@/utils/mitt";
export default defineComponent({
name: "CollapseTreeItem",
@@ -11,36 +12,64 @@ export default defineComponent({
},
setup(props) {
+ const currentTreeNodeId = ref(""); // 树节点id
const nodeLatestInfo = computed(() => {
//实时的树节点数据
return { ...props.info };
});
+ // 选择树节点
+ function selectTreeNode() {
+ emitter.emit(
+ "changCollapseTreeNodeId",
+ nodeLatestInfo.value.id as unknown as string
+ );
+ console.log("selectTreeNode", nodeLatestInfo.value.id);
+ }
+
+ nextTick(() => {
+ emitter.on("changCollapseTreeNodeId", data => {
+ currentTreeNodeId.value = data;
+ });
+ });
+
+ onBeforeUnmount(() => {
+ // 解绑`changCollapseTreeNodeId`公共事件，防止多次触发
+ emitter.off("changCollapseTreeNodeId");
+ });
+
return () => {
return (
<div class={["collapseTreeItem_wrap"]}>
- <div class={["collapseTreeItem_info flex"]}>
+ <div
+ class={[
+ "collapseTreeItem_info flex",
+ currentTreeNodeId.value === nodeLatestInfo.value.id
+ ? "text-web-font0"
+ : "text-web-font2"
+ ]}
+ onClick={() => {
+ selectTreeNode();
+ }}
+ >
<span class={["collapseTreeItem_line"]}></span>
<div class={["collapseTreeItem_main_info"]}>
- <i class="iconfont icon-fuwuqi tree_item_icon"></i>
+ <i class="iconfont icon-zishebeizu tree_item_icon"></i>
<span>{nodeLatestInfo.value.name}</span>
</div>
</div>
- <ul
- class="collapseTreeItem_child_info_box"
- v-if={
- Array.isArray(nodeLatestInfo.value?.childList) &&
- nodeLatestInfo.value.childList.length
- }
- >
- {nodeLatestInfo.value.childList?.map((item, index) => {
- return (
- <li key={index}>
- <CollapseTreeItem info={item}></CollapseTreeItem>
- </li>
- );
- })}
- </ul>
+ {Array.isArray(nodeLatestInfo.value?.childList) &&
+ nodeLatestInfo.value.childList.length && (
+ <ul class="collapseTreeItem_child_info_box">
+ {nodeLatestInfo.value.childList?.map((item, index) => {
+ return (
+ <li key={index}>
+ <CollapseTreeItem info={item}></CollapseTreeItem>
+ </li>
+ );
+ })}
+ </ul>
+ )}
</div>
);
};
diff --git a/src/components/CustomTree/src/collapseTreeStyle.scss b/src/components/CustomTree/src/collapseTreeStyle.scss
index 96246d2..5d558d5 100644
--- a/src/components/CustomTree/src/collapseTreeStyle.scss
+++ b/src/components/CustomTree/src/collapseTreeStyle.scss
@@ -41,27 +41,19 @@
}
.collapseTreeItem_wrap {
- // border-radius: 2px;
padding-top: 0;
-
- // padding-left: 10px;
- // margin-top: 8px;
margin-left: 16px;
border-left: 2px solid $--theme-color;
.collapseTreeItem_info {
position: relative;
- color: $--web-font2;
.tree_item_icon {
padding: 0 8px;
}
.collapseTreeItem_line {
- // background-color: red;
display: inline-block;
-
- // margin-bottom: -10px;
width: 16px;
height: 16px;
margin-top: -1px;
@@ -73,15 +65,7 @@
}
.collapseTreeItem_main_info {
- padding: 2px 5px 8px;
- padding-left: 10px;
-
- // padding-top: 16px;
- // position: absolute;
- // left: -2px;
- // top: 12px;
+ padding: 2px 5px 8px 0;
}
-
- // .icon-fuwuqi {}
}
}
diff --git a/src/layout/components/navbar.vue b/src/layout/components/navbar.vue
index 45e61cc..66423b0 100644
--- a/src/layout/components/navbar.vue
+++ b/src/layout/components/navbar.vue
@@ -8,14 +8,14 @@ import topCollapse from "./sidebar/topCollapse.vue";
import { useTranslationLang } from "../hooks/useTranslationLang";
import globalization from "@/assets/svg/globalization.svg?component";
import LogoutCircleRLine from "@iconify-icons/ri/logout-circle-r-line";
-import Setting from "@iconify-icons/ri/settings-3-line";
+// import Setting from "@iconify-icons/ri/settings-3-line";
import Check from "@iconify-icons/ep/check";
const {
layout,
device,
logout,
- onPanel,
+ // onPanel,
pureApp,
username,
userAvatar,
@@ -98,13 +98,13 @@ const { t, locale, translationCh, translationEn } = useTranslationLang();
</el-dropdown-menu>
</template>
</el-dropdown>
- <span
+ <!-- <span
class="set-icon navbar-bg-hover"
:title="t('buttons.hssystemSet')"
@click="onPanel"
>
<IconifyIconOffline :icon="Setting" />
- </span>
+ </span> -->
</div>
</div>
</template>
@@ -135,7 +135,8 @@ const { t, locale, translationCh, translationEn } = useTranslationLang();
align-items: center;
justify-content: space-around;
height: 48px;
- padding: 10px;
+
+ /* padding: 10px; */
color: #000000d9;
cursor: pointer;
@@ -153,7 +154,6 @@ const { t, locale, translationCh, translationEn } = useTranslationLang();
.breadcrumb-container {
float: left;
- margin-left: 16px;
}
}
diff --git a/src/layout/components/notice/index.vue b/src/layout/components/notice/index.vue
index 3a37720..0a99947 100644
--- a/src/layout/components/notice/index.vue
+++ b/src/layout/components/notice/index.vue
@@ -1,3 +1,11 @@
+<!--
+ * @Author: donghao donghao@supervision.ltd
+ * @Date: 2024-01-12 14:35:28
+ * @LastEditors: donghao donghao@supervision.ltd
+ * @LastEditTime: 2024-01-17 10:02:25
+ * @FilePath: \General-AI-Platform-Web-Client\src\layout\components\notice\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
<script setup lang="ts">
import { ref } from "vue";
import { noticesData } from "./data";
@@ -13,7 +21,7 @@ notices.value.map(v => (noticesNum.value += v.list.length));
<template>
<el-dropdown trigger="click" placement="bottom-end">
- <span class="dropdown-badge navbar-bg-hover select-none">
+ <span class="select-none dropdown-badge navbar-bg-hover">
<el-badge :value="noticesNum" :max="99">
<span class="header-notice-icon">
<IconifyIconOffline :icon="Bell" />
@@ -59,7 +67,8 @@ notices.value.map(v => (noticesNum.value += v.list.length));
align-items: center;
justify-content: center;
width: 40px;
- height: 48px;
+
+ /* height: 48px; */
margin-right: 10px;
cursor: pointer;
diff --git a/src/layout/components/search/index.vue b/src/layout/components/search/index.vue
index bfd9c63..3704b47 100644
--- a/src/layout/components/search/index.vue
+++ b/src/layout/components/search/index.vue
@@ -11,7 +11,7 @@ function handleSearch() {
<template>
<div
- class="search-container w-[40px] h-[48px] flex-c cursor-pointer navbar-bg-hover"
+ class="search-container w-[40px] flex-c cursor-pointer navbar-bg-hover"
@click="handleSearch"
>
<IconifyIconOffline :icon="Search" />
diff --git a/src/layout/components/sidebar/breadCrumb.vue b/src/layout/components/sidebar/breadCrumb.vue
index ea6e60b..af7a592 100644
--- a/src/layout/components/sidebar/breadCrumb.vue
+++ b/src/layout/components/sidebar/breadCrumb.vue
@@ -96,7 +96,9 @@ watch(
v-for="item in levelList"
:key="item.path"
>
- {{ transformI18n(item.meta.title) }}
+ <span :class="['text-web-font1 text-[14px] font-bold']">{{
+ transformI18n(item.meta.title)
+ }}</span>
</el-breadcrumb-item>
</transition-group>
</el-breadcrumb>
diff --git a/src/layout/components/sidebar/mixNav.vue b/src/layout/components/sidebar/mixNav.vue
index 5f85922..9c531df 100644
--- a/src/layout/components/sidebar/mixNav.vue
+++ b/src/layout/components/sidebar/mixNav.vue
@@ -1,3 +1,11 @@
+<!--
+ * @Author: donghao donghao@supervision.ltd
+ * @Date: 2024-01-12 14:35:28
+ * @LastEditors: donghao donghao@supervision.ltd
+ * @LastEditTime: 2024-01-17 10:03:05
+ * @FilePath: \General-AI-Platform-Web-Client\src\layout\components\sidebar\mixNav.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
<script setup lang="ts">
import extraIcon from "./extraIcon.vue";
import Search from "../search/index.vue";
@@ -102,7 +110,7 @@ watch(
<!-- 国际化 -->
<el-dropdown id="header-translation" trigger="click">
<globalization
- class="navbar-bg-hover w-[40px] h-[48px] p-[11px] cursor-pointer outline-none"
+ class="navbar-bg-hover w-[40px] p-[11px] cursor-pointer outline-none"
/>
<template #dropdown>
<el-dropdown-menu class="translation">
@@ -131,7 +139,7 @@ watch(
</el-dropdown>
<!-- 退出登录 -->
<el-dropdown trigger="click">
- <span class="el-dropdown-link navbar-bg-hover select-none">
+ <span class="select-none el-dropdown-link navbar-bg-hover">
<img :src="userAvatar" :style="avatarsStyle" />
<p v-if="username" class="dark:text-white">{{ username }}</p>
</span>
diff --git a/src/layout/components/sidebar/vertical.vue b/src/layout/components/sidebar/vertical.vue
index 37efdc5..39104a3 100644
--- a/src/layout/components/sidebar/vertical.vue
+++ b/src/layout/components/sidebar/vertical.vue
@@ -2,6 +2,7 @@
import Logo from "./logo.vue";
import { useRoute, useRouter } from "vue-router";
import { emitter } from "@/utils/mitt";
+import { transformI18n } from "@/plugins/i18n";
// import SidebarItem from "./sidebarItem.vue";
// import leftCollapse from "./leftCollapse.vue";
import { useNav } from "@/layout/hooks/useNav";
@@ -43,7 +44,7 @@ const defaultActive = computed(() =>
!isAllEmpty(route.meta?.activePath) ? route.meta.activePath : route.path
);
-const activeName = ref(route.name || "Home");
+const activeName = ref(route.name || "Workbench");
function getSubMenuData() {
let path = "";
@@ -131,11 +132,9 @@ onBeforeUnmount(() => {
@click="changeRoute(routes)"
>
<div class="flex justify-center">
- <!-- TODO 使用真实图标 -->
- <i style="width: 24px; height: 24px" class="iconfont icon-shouye" />
- <!-- <img style="width: 24px;" src="/logo.svg" alt=""> -->
+ <i :class="['iconfont', routes.meta?.icon || 'icon-morencaidan']" />
</div>
- <p>{{ routes.meta.title }}</p>
+ <p>{{ transformI18n(routes.meta.title) }}</p>
</li>
</ul>
</el-scrollbar>
@@ -143,6 +142,8 @@ onBeforeUnmount(() => {
</template>
<style lang="scss" scoped>
+$--noneSelectedColor: rgb(255 255 255 / 80%);
+
:deep(.el-loading-mask) {
opacity: 0.45;
}
@@ -157,31 +158,39 @@ onBeforeUnmount(() => {
border-radius: 12px;
.menu_box {
- color: #fff;
+ font-size: 14px;
+ color: $--noneSelectedColor;
text-align: center;
- /* background: red; */
-
- /* z-index: 10001; */
& > li {
- /* height: 60px; */
-
- /* background-color: red; */
padding-top: 16px;
+ cursor: pointer;
& > p {
padding-top: 6px;
}
+ .iconfont {
+ width: 32px;
+ height: 32px;
+ font-size: 32px;
+ line-height: 32px;
+ border-radius: 8px;
+ }
+
&.active {
+ color: #fff;
+
/* inset: 0 8px;
margin: 4px 0; */
- clear: both;
+
+ /* clear: both;
content: "";
background: var(--el-color-primary) !important;
- border-radius: 3px;
-
- /* background-color: #155bd4; */
+ border-radius: 3px; */
+ .iconfont {
+ background-color: rgb(255 255 255 / 20%);
+ }
}
}
}
diff --git a/src/router/modules/device.ts b/src/router/modules/device.ts
index e984392..823cef7 100644
--- a/src/router/modules/device.ts
+++ b/src/router/modules/device.ts
@@ -1,8 +1,10 @@
+import { $t } from "@/plugins/i18n";
+
export default {
path: "/device",
meta: {
- title: "设备列表",
- icon: "homeFilled",
+ title: $t("menus.hsdevice"),
+ icon: "icon-shebeiliebiao-weixuan",
// showLink: false,
rank: 2,
roles: ["admin", "common"]
diff --git a/src/router/modules/home.ts b/src/router/modules/home.ts
deleted file mode 100644
index 817a5ab..0000000
--- a/src/router/modules/home.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-// import { $t } from "@/plugins/i18n";
-const { VITE_HIDE_HOME } = import.meta.env;
-const Layout = () => import("@/layout/index.vue");
-
-export default {
- path: "/",
- name: "Home",
- component: Layout,
- redirect: "/welcome",
- meta: {
- icon: "homeFilled",
- title: "首页",
- rank: 0
- },
- children: [
- {
- path: "/welcome",
- name: "Welcome",
- component: () => import("@/views/welcome/index.vue"),
- meta: {
- title: "首页",
- showLink: VITE_HIDE_HOME === "true" ? false : true
- }
- }
- ]
-} as RouteConfigsTable;
diff --git a/src/router/modules/server.ts b/src/router/modules/server.ts
index 7d04804..1058014 100644
--- a/src/router/modules/server.ts
+++ b/src/router/modules/server.ts
@@ -1,8 +1,18 @@
+/*
+ * @Author: donghao donghao@supervision.ltd
+ * @Date: 2024-01-16 13:25:01
+ * @LastEditors: donghao donghao@supervision.ltd
+ * @LastEditTime: 2024-01-17 11:02:23
+ * @FilePath: \General-AI-Platform-Web-Client\src\router\modules\server.ts
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
+import { $t } from "@/plugins/i18n";
+
export default {
path: "/server",
meta: {
- title: "服务器",
- icon: "homeFilled",
+ title: $t("menus.hsserver"),
+ icon: "icon-fuwuqi-weixuan",
// showLink: false,
rank: 3,
roles: ["admin", "common"]
diff --git a/src/router/modules/workbench.ts b/src/router/modules/workbench.ts
index 54fd37c..f875403 100644
--- a/src/router/modules/workbench.ts
+++ b/src/router/modules/workbench.ts
@@ -1,8 +1,15 @@
+import { $t } from "@/plugins/i18n";
+
+const Layout = () => import("@/layout/index.vue");
+
export default {
- path: "/workbench",
+ path: "/",
+ name: "Workbench",
+ component: Layout,
+ redirect: "/workbench",
meta: {
- title: "工作台",
- icon: "homeFilled",
+ title: $t("menus.hshome"),
+ icon: "",
// showLink: false,
rank: 1
},
diff --git a/src/router/utils.ts b/src/router/utils.ts
index 2436e2b..2390b80 100644
--- a/src/router/utils.ts
+++ b/src/router/utils.ts
@@ -33,7 +33,7 @@ function handRank(routeInfo: any) {
const { name, path, parentId, meta } = routeInfo;
return isAllEmpty(parentId)
? isAllEmpty(meta?.rank) ||
- (meta?.rank === 0 && name !== "Home" && path !== "/")
+ (meta?.rank === 0 && name !== "Workbench" && path !== "/")
? true
: false
: false;
diff --git a/src/style/sidebar.scss b/src/style/sidebar.scss
index bc12070..0ae8588 100644
--- a/src/style/sidebar.scss
+++ b/src/style/sidebar.scss
@@ -34,7 +34,8 @@
align-items: center;
justify-content: center;
width: 40px;
- height: 48px;
+
+ // height: 48px;
cursor: pointer;
}
@@ -397,7 +398,8 @@
align-items: center;
justify-content: space-around;
width: 100%;
- height: 48px;
+
+ // height: 48px;
background: $menuBg;
.horizontal-header-left {
@@ -459,13 +461,14 @@
}
.dropdown-badge {
- height: 48px;
+ // height: 48px;
color: $subMenuActiveText;
}
.globalization {
width: 40px;
- height: 48px;
+
+ // height: 48px;
padding: 11px;
color: $subMenuActiveText;
cursor: pointer;
@@ -476,7 +479,8 @@
display: flex;
align-items: center;
justify-content: space-around;
- height: 48px;
+
+ // height: 48px;
padding: 10px;
color: $subMenuActiveText;
cursor: pointer;
@@ -512,8 +516,8 @@
.submenu-title-noDropdown,
.el-sub-menu__title {
- height: 48px;
- line-height: 48px;
+ // height: 48px;
+ // line-height: 48px;
background: $menuBg;
svg {
@@ -640,68 +644,3 @@ body[layout="vertical"] {
}
}
}
-
-body[layout="horizontal"] {
- $sideBarWidth: 0;
-
- @include merge-style($sideBarWidth);
-
- .fixed-header,
- .main-container {
- transition: none !important;
- }
-
- .fixed-header {
- width: 100%;
- }
-}
-
-body[layout="mix"] {
- $sideBarWidth: 210px;
-
- @include merge-style($sideBarWidth);
-
- .el-menu--collapse {
- width: 54px;
- }
-
- .el-menu {
- --el-menu-hover-bg-color: transparent !important;
- }
-
- .hideSidebar {
- .fixed-header {
- width: calc(100% - 54px);
- transition: width var(--pure-transition-duration);
- }
-
- .sidebar-container {
- width: 54px !important;
- transition: width var(--pure-transition-duration);
-
- .is-active.submenu-title-noDropdown.outer-most {
- background: transparent !important;
- }
- }
-
- .main-container {
- margin-left: 54px;
- }
-
- /* 菜单折叠 */
- .el-menu--collapse {
- .el-sub-menu {
- & > .el-sub-menu__title {
- padding: 0;
-
- & > span {
- width: 100%;
- height: 100%;
- text-align: center;
- visibility: visible;
- }
- }
- }
- }
- }
-}
diff --git a/src/style/vars.scss b/src/style/vars.scss
index e238bc6..f42c515 100644
--- a/src/style/vars.scss
+++ b/src/style/vars.scss
@@ -1,4 +1,29 @@
+$--web-font0: #000;
$--web-font1: #333;
$--web-font2: #666;
$--web-font3: #999;
$--theme-color: #154ddd;
+
+.text-web-font0 {
+ color: $--web-font0;
+}
+
+.text-web-font1 {
+ color: $--web-font1;
+}
+
+.text-web-font2 {
+ color: $--web-font2;
+}
+
+.text-web-font3 {
+ color: $--web-font3;
+}
+
+.theme-color {
+ color: $--theme-color;
+}
+
+.theme-bg-color {
+ background-color: $--theme-color;
+}
diff --git a/src/utils/mitt.ts b/src/utils/mitt.ts
index 63816f1..95853a8 100644
--- a/src/utils/mitt.ts
+++ b/src/utils/mitt.ts
@@ -8,6 +8,7 @@ type Events = {
tagViewsShowModel: string;
logoChange: boolean;
changLayoutRoute: string;
+ changCollapseTreeNodeId: string;
};
export const emitter: Emitter<Events> = mitt<Events>();
diff --git a/src/views/workbench/components/SwiperShow.vue b/src/views/workbench/components/SwiperShow.vue
index 79941b9..49c055c 100644
--- a/src/views/workbench/components/SwiperShow.vue
+++ b/src/views/workbench/components/SwiperShow.vue
@@ -2,7 +2,7 @@
* @Author: donghao donghao@supervision.ltd
* @Date: 2024-01-12 15:35:09
* @LastEditors: donghao donghao@supervision.ltd
- * @LastEditTime: 2024-01-12 17:45:12
+ * @LastEditTime: 2024-01-17 11:31:24
* @FilePath: \general-work-web\General-AI-Platform-Web-Client\src\views\workbench\components\SwiperShow.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
@@ -62,7 +62,7 @@ const modules = [Navigation, Pagination, Scrollbar, A11y, Autoplay];
@swiper="onSwiper"
@slideChange="onSlideChange"
>
- <swiper-slide v-for="(v, k) in swiperList" :key="k">
+ <swiper-slide v-for="(v, k) in swiperList" :key="k + ''">
<img :src="v.url" alt="" />
</swiper-slide>
</swiper>