From 4f1a697303846f3339bf2e747f9fbb8dde288d83 Mon Sep 17 00:00:00 2001
From: "1747191978@qq.com" <1942943850@qq.com>
Date: Mon, 3 Mar 2025 15:53:23 +0800
Subject: [PATCH] =?UTF-8?q?=E8=8F=9C=E5=8D=95=E6=BC=94=E7=A4=BA=E6=B8=B8?=
 =?UTF-8?q?=E6=88=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 acupuncture-前台/src/assets/images/zj.png     | Bin 0 -> 1752 bytes
 .../src/assets/styles/sidebar.scss            |   5 +
 .../src/assets/styles/variables.scss          |   2 +-
 .../src/layout/components/Navbar.vue          |  17 ++-
 .../src/layout/components/Sidebar/Logo.vue    |  85 ++---------
 .../layout/components/Sidebar/SidebarItem.vue |  13 +-
 .../src/layout/components/Sidebar/index.vue   |   1 +
 acupuncture-前台/src/layout/index.vue         | 143 ++++++++++--------
 8 files changed, 119 insertions(+), 147 deletions(-)
 create mode 100644 acupuncture-前台/src/assets/images/zj.png

diff --git a/acupuncture-前台/src/assets/images/zj.png b/acupuncture-前台/src/assets/images/zj.png
new file mode 100644
index 0000000000000000000000000000000000000000..e3ba37bdb81beefa53241226c75875492a3e9692
GIT binary patch
literal 1752
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

literal 0
HcmV?d00001

diff --git a/acupuncture-前台/src/assets/styles/sidebar.scss b/acupuncture-前台/src/assets/styles/sidebar.scss
index e5cd1a28..905775e1 100644
--- a/acupuncture-前台/src/assets/styles/sidebar.scss
+++ b/acupuncture-前台/src/assets/styles/sidebar.scss
@@ -87,6 +87,11 @@
       flex-direction: column;
       align-items: center;
       justify-content: center;
+      border-radius: 6px;
+      -webkit-border-radius: 6px;
+      -moz-border-radius: 6px;
+      -ms-border-radius: 6px;
+      -o-border-radius: 6px;
     }
     // menu hover
     .submenu-title-noDropdown,
diff --git a/acupuncture-前台/src/assets/styles/variables.scss b/acupuncture-前台/src/assets/styles/variables.scss
index f62aaa70..8e22a317 100644
--- a/acupuncture-前台/src/assets/styles/variables.scss
+++ b/acupuncture-前台/src/assets/styles/variables.scss
@@ -36,7 +36,7 @@ $base-sub-menu-background:#000c17;
 $base-sub-menu-hover:#001528;
 */
 
-$base-sidebar-width: 120px;
+$base-sidebar-width: 90px;
 
 // the :export directive is the magic sauce for webpack
 // https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
diff --git a/acupuncture-前台/src/layout/components/Navbar.vue b/acupuncture-前台/src/layout/components/Navbar.vue
index d4ff5630..18fcc5b7 100644
--- a/acupuncture-前台/src/layout/components/Navbar.vue
+++ b/acupuncture-前台/src/layout/components/Navbar.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="navbar">
-    <hamburger
+    <!-- <hamburger
       id="hamburger-container"
       :is-active="sidebar.opened"
       class="hamburger-container"
@@ -11,7 +11,8 @@
       id="breadcrumb-container"
       class="breadcrumb-container"
       v-if="!topNav"
-    />
+    /> -->
+    <div class="logo-title">朱琏针灸联盟数据系统</div>
     <top-nav id="topmenu-container" class="topmenu-container" v-if="topNav" />
 
     <div class="right-menu">
@@ -33,7 +34,7 @@
         </el-tooltip>
       </template> -->
 
-      <el-dropdown
+      <!-- <el-dropdown
         class="avatar-container right-menu-item hover-effect"
         trigger="click"
       >
@@ -52,7 +53,7 @@
             <span>退出登录</span>
           </el-dropdown-item>
         </el-dropdown-menu>
-      </el-dropdown>
+      </el-dropdown> -->
     </div>
   </div>
 </template>
@@ -120,7 +121,15 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.logo-title {
+  font-size: 20px;
+  color: #70483e;
+  line-height: 50px;
+  margin-left: 20px;
+  font-weight: 600;
+}
 .navbar {
+  display: flex;
   height: 50px;
   overflow: hidden;
   position: relative;
diff --git a/acupuncture-前台/src/layout/components/Sidebar/Logo.vue b/acupuncture-前台/src/layout/components/Sidebar/Logo.vue
index 963a8edf..ce835e8d 100644
--- a/acupuncture-前台/src/layout/components/Sidebar/Logo.vue
+++ b/acupuncture-前台/src/layout/components/Sidebar/Logo.vue
@@ -1,55 +1,13 @@
 <template>
-  <div
-    class="sidebar-logo-container"
-    :class="{ collapse: collapse }"
-    :style="{
-      backgroundColor:
-        sideTheme === 'theme-dark'
-          ? variables.menuBackground
-          : variables.menuLightBackground,
-    }"
-  >
+  <div class="sidebar-logo-container" :class="{ collapse: collapse }">
     <transition name="sidebarLogoFade">
-      <router-link
-        v-if="collapse"
-        key="collapse"
-        class="sidebar-logo-link"
-        to="/"
-      >
-        <img v-if="logo" :src="logo" class="sidebar-logo" />
-        <h1
-          v-else
-          class="sidebar-title"
-          :style="{
-            color:
-              sideTheme === 'theme-dark'
-                ? variables.logoTitleColor
-                : variables.logoLightTitleColor,
-          }"
-        >
-          {{ title }}
-        </h1>
-      </router-link>
-      <router-link v-else key="expand" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo" />
-        <h1
-          class="sidebar-title"
-          :style="{
-            color:
-              sideTheme === 'theme-dark'
-                ? variables.logoTitleColor
-                : variables.logoLightTitleColor,
-          }"
-        >
-          {{ title }}
-        </h1>
-      </router-link>
+      <img v-if="logo" :src="logo" class="sidebar-logo" />
     </transition>
   </div>
 </template>
 
 <script>
-import logoImg from "@/assets/logo/logo.png";
+import logoImg from "@/assets/images/zj.png";
 import variables from "@/assets/styles/variables.scss";
 
 export default {
@@ -86,37 +44,16 @@ export default {
 .sidebarLogoFade-leave-to {
   opacity: 0;
 }
-
 .sidebar-logo-container {
+  margin-top: 10px;
   position: relative;
-  width: 100%;
-  height: 50px;
-  line-height: 50px;
-  background: #70483e;
-  text-align: center;
-  overflow: hidden;
-
-  & .sidebar-logo-link {
-    height: 100%;
-    width: 100%;
-
-    & .sidebar-logo {
-      width: 32px;
-      height: 32px;
-      vertical-align: middle;
-      margin-right: 12px;
-    }
-
-    & .sidebar-title {
-      display: inline-block;
-      margin: 0;
-      color: #fff;
-      font-weight: 600;
-      line-height: 50px;
-      font-size: 14px;
-      font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
-      vertical-align: middle;
-    }
+  border-radius: 4px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  img {
+    width: 32px;
+    height: 32px;
   }
 
   &.collapse {
diff --git a/acupuncture-前台/src/layout/components/Sidebar/SidebarItem.vue b/acupuncture-前台/src/layout/components/Sidebar/SidebarItem.vue
index 83afe986..df3a6dcc 100644
--- a/acupuncture-前台/src/layout/components/Sidebar/SidebarItem.vue
+++ b/acupuncture-前台/src/layout/components/Sidebar/SidebarItem.vue
@@ -41,7 +41,7 @@
             <img :src="itmeIcon[item.meta.title]" alt="" />
           </div>
           <div v-if="itmeIcon1[item.meta.title]" class="div-img-gl">
-            <img :src="itmeIcon1[item.meta.title]" alt="" />
+            <img :src="itmeIcon[item.meta.title]" alt="" />
           </div>
           <item
             v-if="item.meta"
@@ -162,6 +162,10 @@ export default {
 #app .sidebar-container .nest-menu .is-active {
   background-color: #fff !important;
 }
+#app .sidebar-container .nest-menu .el-menu-item {
+  padding: 0 !important;
+  min-width: 60px !important;
+}
 #app .sidebar-container .nest-menu .is-active:hover {
   color: #fff !important;
 }
@@ -171,7 +175,8 @@ export default {
   line-height: 26px !important;
 }
 >>> .el-submenu.is-active .el-submenu__title .header {
-  background-color: #fff !important;
+  border-radius: 6px;
+  color: #fff;
 }
 >>> .el-submenu .el-submenu__title .header {
   width: 100%;
@@ -201,4 +206,8 @@ export default {
   padding-top: 10px !important;
   background-color: #5a332a;
 }
+#app .sidebar-container .el-submenu__title:hover {
+  background-color: #5a3a32 !important;
+  border-radius: 6px;
+}
 </style>
diff --git a/acupuncture-前台/src/layout/components/Sidebar/index.vue b/acupuncture-前台/src/layout/components/Sidebar/index.vue
index 4afeac5a..1fb2a95d 100644
--- a/acupuncture-前台/src/layout/components/Sidebar/index.vue
+++ b/acupuncture-前台/src/layout/components/Sidebar/index.vue
@@ -74,6 +74,7 @@ export default {
 <style scoped>
 >>> .is-active {
   background-color: #fff !important;
+  border-radius: 6px;
 }
 >>> .is-active .div-img {
   display: none;
diff --git a/acupuncture-前台/src/layout/index.vue b/acupuncture-前台/src/layout/index.vue
index dba4393d..363a59da 100644
--- a/acupuncture-前台/src/layout/index.vue
+++ b/acupuncture-前台/src/layout/index.vue
@@ -1,111 +1,122 @@
 <template>
-  <div :class="classObj" class="app-wrapper" :style="{'--current-color': theme}">
-    <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside"/>
-    <sidebar v-if="!sidebar.hide" class="sidebar-container"/>
-    <div :class="{hasTagsView:needTagsView,sidebarHide:sidebar.hide}" class="main-container">
-      <div :class="{'fixed-header':fixedHeader}">
-        <navbar/>
-        <tags-view v-if="needTagsView"/>
+  <div
+    :class="classObj"
+    class="app-wrapper"
+    :style="{ '--current-color': theme }"
+  >
+    <div
+      v-if="device === 'mobile' && sidebar.opened"
+      class="drawer-bg"
+      @click="handleClickOutside"
+    />
+    <sidebar v-if="!sidebar.hide" class="sidebar-container" />
+    <div
+      :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }"
+      class="main-container"
+    >
+      <div :class="{ 'fixed-header': fixedHeader }">
+        <navbar />
+        <!-- <tags-view v-if="needTagsView"/> -->
       </div>
-      <app-main/>
+      <app-main />
       <right-panel>
-        <settings/>
+        <settings />
       </right-panel>
     </div>
   </div>
 </template>
 
 <script>
-import RightPanel from '@/components/RightPanel'
-import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components'
-import ResizeMixin from './mixin/ResizeHandler'
-import { mapState } from 'vuex'
-import variables from '@/assets/styles/variables.scss'
+import RightPanel from "@/components/RightPanel";
+import { AppMain, Navbar, Settings, Sidebar, TagsView } from "./components";
+import ResizeMixin from "./mixin/ResizeHandler";
+import { mapState } from "vuex";
+import variables from "@/assets/styles/variables.scss";
 
 export default {
-  name: 'Layout',
+  name: "Layout",
   components: {
     AppMain,
     Navbar,
     RightPanel,
     Settings,
     Sidebar,
-    TagsView
+    TagsView,
   },
   mixins: [ResizeMixin],
   computed: {
     ...mapState({
-      theme: state => state.settings.theme,
-      sideTheme: state => state.settings.sideTheme,
-      sidebar: state => state.app.sidebar,
-      device: state => state.app.device,
-      needTagsView: state => state.settings.tagsView,
-      fixedHeader: state => state.settings.fixedHeader
+      theme: (state) => state.settings.theme,
+      sideTheme: (state) => state.settings.sideTheme,
+      sidebar: (state) => state.app.sidebar,
+      device: (state) => state.app.device,
+      needTagsView: (state) => state.settings.tagsView,
+      fixedHeader: (state) => state.settings.fixedHeader,
     }),
     classObj() {
       return {
         hideSidebar: !this.sidebar.opened,
         openSidebar: this.sidebar.opened,
         withoutAnimation: this.sidebar.withoutAnimation,
-        mobile: this.device === 'mobile'
-      }
+        mobile: this.device === "mobile",
+      };
     },
     variables() {
       return variables;
-    }
+    },
   },
   methods: {
     handleClickOutside() {
-      this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
-    }
-  }
-}
+      this.$store.dispatch("app/closeSideBar", { withoutAnimation: false });
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
-  @import "~@/assets/styles/mixin.scss";
-  @import "~@/assets/styles/variables.scss";
+@import "~@/assets/styles/mixin.scss";
+@import "~@/assets/styles/variables.scss";
 
-  .app-wrapper {
-    @include clearfix;
-    position: relative;
-    height: 100%;
-    width: 100%;
+.app-wrapper {
+  @include clearfix;
+  position: relative;
+  height: 100%;
+  width: 100%;
 
-    &.mobile.openSidebar {
-      position: fixed;
-      top: 0;
-    }
-  }
-
-  .drawer-bg {
-    background: #000;
-    opacity: 0.3;
-    width: 100%;
-    top: 0;
-    height: 100%;
-    position: absolute;
-    z-index: 999;
-  }
-
-  .fixed-header {
+  &.mobile.openSidebar {
     position: fixed;
     top: 0;
-    right: 0;
-    z-index: 9;
-    width: calc(100% - #{$base-sidebar-width});
-    transition: width 0.28s;
   }
+}
 
-  .hideSidebar .fixed-header {
-    width: calc(100% - 54px);
-  }
+.drawer-bg {
+  background: #000;
+  opacity: 0.3;
+  width: 100%;
+  top: 0;
+  height: 100%;
+  position: absolute;
+  z-index: 999;
+}
 
-  .sidebarHide .fixed-header {
-    width: 100%;
-  }
+.fixed-header {
+  position: fixed;
+  top: 0;
+  right: 0;
+  z-index: 9;
+  width: calc(100% - #{$base-sidebar-width});
+  transition: width 0.28s;
+}
 
-  .mobile .fixed-header {
-    width: 100%;
-  }
+.hideSidebar .fixed-header {
+  width: calc(100% - 54px);
+}
+
+.sidebarHide .fixed-header {
+  width: 100%;
+}
+
+.mobile .fixed-header {
+  width: 100%;
+}
 </style>