From 3933d3aa143e87f92387d2c3a31f65c192685efc Mon Sep 17 00:00:00 2001
From: AliooWang <64893838+AliooWang@users.noreply.github.com>
Date: 星期日, 13 四月 2025 14:05:15 +0800
Subject: [PATCH] Merge pull request #58 from zhitan-cloud/jiayu1.0
---
zhitan-vue/src/components/Breadcrumb/index.vue | 14 --
zhitan-vue/src/assets/styles/index.scss | 46 ++++++
zhitan-vue/src/assets/styles/sidebar.scss | 87 +++++++----
zhitan-vue/src/layout/components/AppMain.vue | 5
zhitan-vue/src/views/login.vue | 3
zhitan-vue/src/layout/components/Navbar.vue | 10
zhitan-vue/src/views/system/user/profile/index.vue | 2
zhitan-vue/src/views/system/name/name.vue | 85 +++++++++--
zhitan-vue/src/layout/components/Sidebar/index.vue | 87 +++++++++++
zhitan-vue/src/layout/index.vue | 45 -----
zhitan-vue/src/assets/styles/menu-fix.scss | 0
zhitan-vue/src/components/Hamburger/index.vue | 2
12 files changed, 271 insertions(+), 115 deletions(-)
diff --git a/zhitan-vue/src/assets/styles/index.scss b/zhitan-vue/src/assets/styles/index.scss
index 7a592be..1117766 100644
--- a/zhitan-vue/src/assets/styles/index.scss
+++ b/zhitan-vue/src/assets/styles/index.scss
@@ -9,10 +9,12 @@
body {
height: 100%;
margin: 0;
+ padding: 0;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
+ overflow-x: hidden; /* 闃叉姘村钩婊氬姩鏉� */
}
label {
@@ -22,10 +24,17 @@
html {
height: 100%;
box-sizing: border-box;
+ margin: 0;
+ padding: 0;
+ overflow-x: hidden; /* 闃叉姘村钩婊氬姩鏉� */
}
#app {
height: 100%;
+ width: 100%;
+ margin: 0;
+ padding: 0;
+ overflow-x: hidden; /* 闃叉姘村钩婊氬姩鏉� */
}
*,
@@ -205,4 +214,41 @@
// ::v-deep(.el-range-separator) {
color: #999 !important;
}
+}
+
+/* 鎶樺彔鑿滃崟鏍峰紡璋冩暣锛岀‘淇濆湪鎵�鏈夋儏鍐典笅鑿滃崟椤瑰眳涓� */
+.el-menu--collapse {
+ width: 54px !important;
+
+ .el-sub-menu, .el-menu-item {
+ width: 36px !important;
+ min-width: 36px !important;
+ margin-left: 9px !important; /* 鍏抽敭锛氳缃浐瀹氱殑宸﹁竟璺�9px浣胯彍鍗曢」灞呬腑 */
+ margin-right: 9px !important;
+ }
+
+ .el-menu-item, .el-sub-menu__title {
+ display: flex !important;
+ justify-content: center !important;
+ align-items: center !important;
+ padding: 0 !important;
+
+ .svg-icon, .el-icon {
+ margin: 0 !important; /* 閲嶈锛氱Щ闄ゅ浘鏍囩殑鎵�鏈夎竟璺� */
+ }
+
+ .el-sub-menu__icon-arrow {
+ display: none !important;
+ }
+
+ > span {
+ display: none !important;
+ }
+ }
+
+ /* 閫変腑鐘舵�佹牱寮� */
+ .el-menu-item.is-active, .el-sub-menu.is-active > .el-sub-menu__title {
+ background-color: #3883FA !important;
+ color: #fff !important;
+ }
}
\ No newline at end of file
diff --git a/zhitan-vue/src/assets/styles/menu-fix.scss b/zhitan-vue/src/assets/styles/menu-fix.scss
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/zhitan-vue/src/assets/styles/menu-fix.scss
diff --git a/zhitan-vue/src/assets/styles/sidebar.scss b/zhitan-vue/src/assets/styles/sidebar.scss
index a698226..297e8e4 100644
--- a/zhitan-vue/src/assets/styles/sidebar.scss
+++ b/zhitan-vue/src/assets/styles/sidebar.scss
@@ -51,10 +51,11 @@
.scrollbar-wrapper {
overflow-x: hidden !important;
+ height: calc(100% - 290px) !important;
}
.el-scrollbar__bar.is-vertical {
- right: 0px;
+ right: 0 !important;
}
.el-scrollbar {
@@ -192,22 +193,32 @@
}
.el-menu--collapse {
- .el-sub-menu {
- & > .el-sub-menu__title {
- & > span {
- height: 0;
- width: 0;
- overflow: hidden;
- visibility: hidden;
- display: inline-block;
- }
- & > i {
- height: 0;
- width: 0;
- overflow: hidden;
- visibility: hidden;
- display: inline-block;
- }
+ width: 54px !important;
+
+ /* 娓呴櫎鍚庝唬閫夋嫨鍣ㄤ腑骞叉壈灞呬腑鐨勬牱寮� */
+ .el-sub-menu, .el-menu-item {
+ margin: 0 !important;
+ padding: 0 !important;
+ width: 100% !important;
+
+ /* 璁╁浘鏍囧拰鑿滃崟椤瑰眳涓� */
+ .el-menu-item, .el-sub-menu__title {
+ width: 36px !important;
+ min-width: 36px !important;
+ height: 38px !important;
+ line-height: 38px !important;
+ margin: 4px 9px !important; /* 绮剧‘璁＄畻灞呬腑杈硅窛 */
+ padding: 0 !important;
+ display: flex !important;
+ justify-content: center !important;
+ align-items: center !important;
+ border-radius: 4px !important;
+ }
+
+ /* 纭繚鍥炬爣灞呬腑 */
+ .svg-icon, .el-icon {
+ margin: 0 !important;
+ padding: 0 !important;
}
}
}
@@ -479,22 +490,32 @@
}
.el-menu--collapse {
- .el-sub-menu {
- & > .el-sub-menu__title {
- & > span {
- height: 0;
- width: 0;
- overflow: hidden;
- visibility: hidden;
- display: inline-block;
- }
- & > i {
- height: 0;
- width: 0;
- overflow: hidden;
- visibility: hidden;
- display: inline-block;
- }
+ width: 54px !important;
+
+ /* 娓呴櫎鍚庝唬閫夋嫨鍣ㄤ腑骞叉壈灞呬腑鐨勬牱寮� */
+ .el-sub-menu, .el-menu-item {
+ margin: 0 !important;
+ padding: 0 !important;
+ width: 100% !important;
+
+ /* 璁╁浘鏍囧拰鑿滃崟椤瑰眳涓� */
+ .el-menu-item, .el-sub-menu__title {
+ width: 36px !important;
+ min-width: 36px !important;
+ height: 38px !important;
+ line-height: 38px !important;
+ margin: 4px 9px !important; /* 绮剧‘璁＄畻灞呬腑杈硅窛 */
+ padding: 0 !important;
+ display: flex !important;
+ justify-content: center !important;
+ align-items: center !important;
+ border-radius: 4px !important;
+ }
+
+ /* 纭繚鍥炬爣灞呬腑 */
+ .svg-icon, .el-icon {
+ margin: 0 !important;
+ padding: 0 !important;
}
}
}
diff --git a/zhitan-vue/src/components/Breadcrumb/index.vue b/zhitan-vue/src/components/Breadcrumb/index.vue
index 032a6fb..6c873a0 100644
--- a/zhitan-vue/src/components/Breadcrumb/index.vue
+++ b/zhitan-vue/src/components/Breadcrumb/index.vue
@@ -63,19 +63,5 @@
color: #fff;
cursor: text;
}
-
- :deep(.el-breadcrumb__item) {
- .el-breadcrumb__inner {
- color: rgba(255, 255, 255, 0.8);
-
- &:hover {
- color: #fff;
- }
- }
-
- .el-breadcrumb__separator {
- color: rgba(255, 255, 255, 0.8);
- }
- }
}
</style>
\ No newline at end of file
diff --git a/zhitan-vue/src/components/Hamburger/index.vue b/zhitan-vue/src/components/Hamburger/index.vue
index 7e05d03..53e6544 100644
--- a/zhitan-vue/src/components/Hamburger/index.vue
+++ b/zhitan-vue/src/components/Hamburger/index.vue
@@ -12,7 +12,7 @@
</svg> -->
<img src="/src/assets/images/nav-btn.png" width="26" v-if="settingsStore.sideTheme == 'theme-dark'">
- <img src="/src/assets/images/nav-btn2.png" width="26" v-else>
+ <img src="/src/assets/images/nav-btn.png" width="26" v-else>
</div>
</template>
diff --git a/zhitan-vue/src/layout/components/AppMain.vue b/zhitan-vue/src/layout/components/AppMain.vue
index 2eaa2bb..fb2159e 100644
--- a/zhitan-vue/src/layout/components/AppMain.vue
+++ b/zhitan-vue/src/layout/components/AppMain.vue
@@ -74,6 +74,11 @@
}
}
}
+
+/* 鐢ㄦ埛涓汉璧勬枡椤电壒娈婇珮搴﹀鐞� */
+.user-profile-container {
+ min-height: calc(100vh - 50px) !important;
+}
</style>
<style lang="scss">
diff --git a/zhitan-vue/src/layout/components/Navbar.vue b/zhitan-vue/src/layout/components/Navbar.vue
index edf2bbd..45d5917 100644
--- a/zhitan-vue/src/layout/components/Navbar.vue
+++ b/zhitan-vue/src/layout/components/Navbar.vue
@@ -41,22 +41,24 @@
import Hamburger from "@/components/Hamburger"
import useAppStore from "@/store/modules/app"
import useSettingsStore from "@/store/modules/settings"
+import { useRouter } from "vue-router"
const appStore = useAppStore()
const settingsStore = useSettingsStore()
+const router = useRouter()
function toggleSideBar() {
appStore.toggleSideBar()
}
function handleAlarm() {
- // 澶勭悊鎶ヨ鎸夐挳鐐瑰嚮浜嬩欢
- console.log('鎶ヨ鎸夐挳琚偣鍑�')
+ // 璺宠浆鍒版姤璀︾鐞嗛〉闈�
+ router.push('/alarmmanage/measuremen?modelCode=BJGL')
}
function handleRobot() {
- // 澶勭悊澶фā鍨嬫寜閽偣鍑讳簨浠�
- console.log('澶фā鍨嬫寜閽鐐瑰嚮')
+ // 璺宠浆鍒版櫤鑳藉姪鎵嬮〉闈�
+ window.open('https://deepseek.tan-zhonghe.com/chat', '_blank')
}
</script>
diff --git a/zhitan-vue/src/layout/components/Sidebar/index.vue b/zhitan-vue/src/layout/components/Sidebar/index.vue
index 603f4f2..68596a6 100644
--- a/zhitan-vue/src/layout/components/Sidebar/index.vue
+++ b/zhitan-vue/src/layout/components/Sidebar/index.vue
@@ -2,8 +2,9 @@
<div
:class="{ 'has-logo': showLogo }"
:style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }"
+ class="sidebar-container-wrapper"
>
- <el-scrollbar :class="sideTheme" wrap-class="scrollbar-wrapper">
+ <el-scrollbar :class="sideTheme" wrap-class="scrollbar-wrapper" view-class="scrollbar-view">
<!-- 棣栭〉鏃朵笉鏄剧ず浠讳綍鑿滃崟椤� -->
<el-menu
v-if="!isHomePage"
@@ -152,9 +153,40 @@
}
</script>
<style lang="scss" scoped>
-:deep(.custom-menu) {
+.sidebar-container-wrapper {
+ position: relative;
+ height: 100%;
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+}
+
+:deep(.scrollbar-wrapper) {
+ height: calc(100% - 290px) !important;
+ overflow-x: hidden !important;
+}
+
+:deep(.scrollbar-view) {
+ height: 100%;
+}
+
+:deep(.el-scrollbar__bar.is-vertical) {
+ right: 0;
+ width: 6px;
+}
+
+:deep(.el-scrollbar__thumb) {
+ background-color: rgba(144, 147, 153, 0.3);
+ &:hover {
+ background-color: rgba(144, 147, 153, 0.5);
+ }
+}
+
+.custom-menu {
+ width: 100%;
padding: 6px 0;
- height: calc(100% - 150px); // 鐣欏嚭搴曢儴鐢ㄦ埛鍖哄煙鐨勭┖闂�
+ height: auto !important; // 鏀逛负鑷�傚簲楂樺害锛岄伩鍏嶅浐瀹氶珮搴﹀鑷村唴瀹规孩鍑�
+ transition: all 0.3s ease;
// Override Element Plus default menu styles
.el-menu-item {
@@ -163,6 +195,7 @@
border-radius: 4px;
margin: 4px 10px;
width: calc(100% - 20px);
+ transition: all 0.2s ease;
&.is-active {
background-color: #3883FA !important;
@@ -181,6 +214,7 @@
border-radius: 4px;
margin: 4px 10px;
width: calc(100% - 20px);
+ transition: all 0.2s ease;
&:hover {
background-color: rgba(56, 131, 250, 0.1) !important;
@@ -209,7 +243,8 @@
// 棣栭〉绌虹櫧鑿滃崟鍖哄煙鏍峰紡
.home-empty-menu {
- height: calc(100% - 150px);
+ height: auto;
+ min-height: 100px;
}
// 搴曢儴鐢ㄦ埛鍖哄煙鏍峰紡
@@ -396,4 +431,48 @@
height: 38px !important;
line-height: 38px !important;
}
+
+// Add styles for collapsed menu items
+:deep(.custom-menu.el-menu--collapse) {
+ width: 54px !important;
+
+ .el-menu-item, .el-sub-menu__title {
+ width: 36px !important;
+ min-width: 36px !important;
+ margin: 4px 9px !important; /* 9px鏄负浜嗙‘淇濆眳涓細(54px瀹� - 36px鑿滃崟椤�) / 2 = 9px */
+ padding: 0 !important;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ border-radius: 4px;
+
+ &.is-active {
+ background-color: #3883FA !important;
+ color: #fff !important;
+ box-shadow: 0 2px 6px rgba(56, 131, 250, 0.4);
+ transform: scale(0.95);
+ transition: all 0.2s ease;
+ }
+
+ .el-icon, .svg-icon {
+ margin: 0 !important;
+ font-size: 18px !important;
+
+ svg {
+ width: 1.2em;
+ height: 1.2em;
+ }
+ }
+
+ // 纭繚鎶樺彔鏃跺瓙鑿滃崟鐨勬爣棰樹篃灞呬腑瀵归綈
+ .el-sub-menu__icon-arrow {
+ display: none;
+ }
+ }
+
+ // 纭繚鎶樺彔鏃跺脊鍑虹殑瀛愯彍鍗曟湁姝ｇ‘鏍峰紡
+ .el-tooltip__trigger:focus:not(.focusing) {
+ outline: none;
+ }
+}
</style>
diff --git a/zhitan-vue/src/layout/index.vue b/zhitan-vue/src/layout/index.vue
index cc29ec7..7cb8e3e 100644
--- a/zhitan-vue/src/layout/index.vue
+++ b/zhitan-vue/src/layout/index.vue
@@ -9,7 +9,7 @@
<img v-if="sideTheme === 'theme-dark'" :src="systemInfo.leftLogo" class="sidebar-logo" />
<img v-else :src="systemInfo.leftLogo" class="sidebar-logo" />
</div>
- <div class="name" v-if="sidebar.opened" :style="{ color: '#fff' }">
+ <div class="name" v-if="sidebar.opened" :style="{ color: sideTheme === 'theme-dark' ? '#fff' : '#333' }">
{{ title }}
</div>
</div>
@@ -86,13 +86,13 @@
// 璺宠浆鍒版姤璀﹂〉闈�
function goToAlarm() {
- router.push('/alarm/list')
+ router.push('/alarmmanage/measuremen?modelCode=BJGL')
}
// 鎵撳紑AI澶фā鍨嬪璇濇
function openAIModel() {
- // 杩欓噷鍙互瀹炵幇鎵撳紑AI瀵硅瘽妗嗙殑閫昏緫
- console.log('鎵撳紑AI澶фā鍨嬪璇濇')
+ // 璺宠浆鍒版寚瀹氱殑URL
+ window.open('https://deepseek.tan-zhonghe.com/chat', '_blank')
}
const classObj = computed(() => ({
@@ -351,47 +351,12 @@
}
.themeDark {
- .navbar-container {
- background: #1a235d;
- border-bottom: 2px solid #110f2e;
- }
-
.navbar {
- background: transparent !important;
+ background: #002866 !important;
}
.sidebar-container {
background-color: #002866 !important;
- }
-}
-
-.themeLight {
- .navbar-container {
- background: #3883FA;
- }
-
- .navbar {
- background: transparent !important;
-
- .left {
- .sidebar-logo-container {
- .name {
- color: #fff !important;
- }
- }
- }
-
- .right {
- .right-menu {
- .right-menu-item {
- color: #fff;
-
- .right-menu-icon {
- color: #fff;
- }
- }
- }
- }
}
}
</style>
\ No newline at end of file
diff --git a/zhitan-vue/src/views/login.vue b/zhitan-vue/src/views/login.vue
index f709a42..a42fc6f 100644
--- a/zhitan-vue/src/views/login.vue
+++ b/zhitan-vue/src/views/login.vue
@@ -201,7 +201,7 @@
.login {
display: flex;
align-items: center;
- height: 100%;
+ height: 100vh;
background-image: url("@/assets/images/login-background.png");
background-repeat: no-repeat;
background-size: cover;
@@ -209,6 +209,7 @@
position: relative;
min-width: 700px;
min-height: 700px;
+ background-color:#001146
}
.middle-view {
diff --git a/zhitan-vue/src/views/system/name/name.vue b/zhitan-vue/src/views/system/name/name.vue
index 696608f..8b4482d 100644
--- a/zhitan-vue/src/views/system/name/name.vue
+++ b/zhitan-vue/src/views/system/name/name.vue
@@ -1,30 +1,30 @@
<template>
- <div class="app-container page">
- <div class="form-card">
- <el-form :model="form" label-width="80px">
- <el-row class="mb20 mt20">
- <el-col :offset="1" :span="18">
+ <div class="app-container page name-settings-page">
+ <div class="name-settings-card">
+ <el-form :model="form" label-width="120px">
+ <el-row class="form-row">
+ <el-col :span="18">
<el-form-item label="绯荤粺鍚嶇О" prop="systemName">
<el-input v-model="form.systemName" placeholder="璇疯緭鍏ョ郴缁熷悕绉�" maxlength="64" show-word-limit />
</el-form-item>
</el-col>
</el-row>
- <el-row class="mb20 mt20">
- <el-col :offset="1" :span="18">
+ <el-row class="form-row">
+ <el-col :span="18">
<el-form-item label="鐧诲綍logo" prop="homeLogo">
<ImageUpload v-model="form.homeLogo" :fileType="['png']" :limit="1" />
</el-form-item>
</el-col>
</el-row>
- <el-row class="mb20 mt20">
- <el-col :offset="1" :span="18">
+ <el-row class="form-row">
+ <el-col :span="18">
<el-form-item label="鍚庡彴logo" prop="leftLogo">
<ImageUpload v-model="form.leftLogo" :fileType="['png']" :limit="1" />
</el-form-item>
</el-col>
</el-row>
- <el-row class="mb20 mt20">
- <el-col :offset="1" :span="18">
+ <el-row class="form-row">
+ <el-col :span="18">
<el-form-item label="copyRight" prop="copyRight">
<el-input
v-model="form.copyRight"
@@ -37,9 +37,11 @@
</el-form-item>
</el-col>
</el-row>
- <el-row class="mb20 mt20" style="padding-bottom: 20px">
- <el-col :offset="2" :span="18">
- <el-button type="primary" @click="handleSave">淇濆瓨</el-button>
+ <el-row class="form-row form-footer">
+ <el-col :span="18">
+ <el-form-item>
+ <el-button type="primary" @click="handleSave">淇濆瓨</el-button>
+ </el-form-item>
</el-col>
</el-row>
</el-form>
@@ -68,6 +70,11 @@
}
getSystemName()
function handleSave() {
+ if (!form.value.leftLogo || !form.value.homeLogo) {
+ proxy.$modal.msgError("璇蜂笂浼爈ogo")
+ return
+ }
+
if (!form.value.leftLogo.includes(baseUrl)) {
form.value.leftLogo = baseUrl + form.value.leftLogo
}
@@ -87,7 +94,51 @@
<style lang="scss" scoped>
@import "@/assets/styles/page.scss";
-:deep .avatar-uploader .el-upload {
+
+.name-settings-page {
+ height: 100%;
+ min-height: calc(100vh - 60px);
+ display: flex;
+ flex-direction: column;
+}
+
+.name-settings-card {
+
+ border-radius: 4px;
+ margin: 16px;
+ padding: 24px;
+ flex: 1;
+ height: calc(100vh - 100px);
+ overflow-y: auto;
+
+ .el-form {
+ width: 100%;
+
+ .form-row {
+ margin-bottom: 24px;
+
+ &.form-footer {
+ margin-top: 40px;
+ }
+ }
+
+ .el-form-item {
+ margin-bottom: 0;
+
+ .el-form-item__label {
+ color: var(--el-text-color-primary, #fff);
+ }
+
+ .el-form-item__content {
+ .el-button {
+ padding: 10px 24px;
+ }
+ }
+ }
+ }
+}
+
+:deep(.avatar-uploader .el-upload) {
border: 1px dashed var(--el-border-color);
border-radius: 6px;
cursor: pointer;
@@ -96,11 +147,11 @@
transition: var(--el-transition-duration-fast);
}
-:deep .avatar-uploader .el-upload:hover {
+:deep(.avatar-uploader .el-upload:hover) {
border-color: var(--el-color-primary);
}
-:deep .el-icon.avatar-uploader-icon {
+:deep(.el-icon.avatar-uploader-icon) {
font-size: 28px;
color: #8c939d;
width: 178px;
diff --git a/zhitan-vue/src/views/system/user/profile/index.vue b/zhitan-vue/src/views/system/user/profile/index.vue
index 56ba9bc..ca87adb 100644
--- a/zhitan-vue/src/views/system/user/profile/index.vue
+++ b/zhitan-vue/src/views/system/user/profile/index.vue
@@ -1,5 +1,5 @@
<template>
- <div class="app-container">
+ <div class="app-container user-profile-container">
<el-row :gutter="20">
<el-col :span="6" :xs="24">
<el-card class="box-card">
--
Gitblit v1.9.3