style update

src/assets/styles/mixin.less

@@ -2357,4 +2357,15 @@ input:-internal-autofill-selected {
             }
         }
     }
+}
+
+// 左侧菜单样式
+.ant-menu-dark .ant-menu-sub .ant-menu-item,
+.ant-menu-dark .ant-menu-sub .ant-menu-item {
+    color: @m-grey34;
+}
+
+.ant-menu-dark .ant-menu-sub .ant-menu-item-selected,
+.ant-menu-dark .ant-menu-sub .ant-menu-item-selected {
+  color: @m-white8;
 }

src/assets/styles/theme.css

@@ -29,6 +29,9 @@
     --m-grey26: #343e48;
 
     --m-grey31: #212629;
+    --m-grey32: #7a8a94;
+    --m-grey33: #88a0ae;
+    --m-grey34: #88A0AE;
     /* --m-green1: #e8ffef; */
 
     --m-black0: #242a2e;
@@ -98,6 +101,9 @@
     --m-white0-hover: rgba(255, 255, 255, .8);
     --m-white1: #E5E5E5;
     --m-white5: #fffefe;
+    --m-white6: #ffffff;
+    --m-white7: #ffffff;
+    --m-white8: #ffffff;
 
     --m-green0: #1FF195;
     --m-green1: #10251d;
@@ -137,6 +143,9 @@
     --m-grey26: #5179E2;
 
     --m-grey31: #D6DEE3;
+    --m-grey32: #FEFFFF;
+    --m-grey33: #5E6E78;
+    --m-grey34: #808E97;
 
     --m-black0: #F8FBFF;
     --m-black1: #ECF2F5;
@@ -205,6 +214,9 @@
     --m-white0-hover: rgba(255, 255, 255, .8);
     --m-white1: #333333;
     --m-white5: #FFFFFF;
+    --m-white6: #333333;
+    --m-white7: #718FAE;
+    --m-white8: #ffffff;
 
     --m-green0: #00A843;
     --m-green1: #e8ffef;
@@ -244,6 +256,9 @@
     --m-grey26: #343e48;
 
     --m-grey31: #212629;
+    --m-grey32: #7a8a94;
+    --m-grey33: #88a0ae;
+    --m-grey34: #88A0AE;
     /* --m-green1: #e8ffef; */
 
     --m-black0: #242a2e;
@@ -313,6 +328,9 @@
     --m-white0-hover: rgba(255, 255, 255, .8);
     --m-white1: #E5E5E5;
     --m-white5: #fffefe;
+    --m-white6: #ffffff;
+    --m-white7: #ffffff;
+    --m-white8: #ffffff;
 
     --m-green0: #1FF195;
     --m-green1: #10251d;

src/assets/styles/variables.less

@@ -39,6 +39,9 @@
 @m-grey29: #4D647A;
 @m-grey30: #223548;
 @m-grey31: var(--m-grey31);
+@m-grey32: var(--m-grey32);
+@m-grey33: var(--m-grey33);
+@m-grey34: var(--m-grey34);
 
 @m-black: #000000;
 @m-black0: var(--m-black0);
@@ -116,6 +119,9 @@
 @m-white3: rgb(54 187 207);
 @m-white4: #FEFEFE;
 @m-white5: var(--m-white5);
+@m-white6: var(--m-white6);
+@m-white7: var(--m-white7);
+@m-white8: var(--m-white8);
 
 
 @m-green0: var(--m-green0);

src/layout/components/top.vue

@@ -1,24 +1,25 @@
 <template>
-  <a-layout :class="['layout-top', isBottom ? 'layout-top-bottom' : 'layout-top-no-bottom']">
-    <a-layout-header class="m-layout-header">
-      <Header />
-    </a-layout-header>
-    <a-layout class="middleLayout">
-      <a-layout-sider class="m-layout-left"
-                      width="180"
-                      v-model:collapsed="collapsed"
-                      @collapse="collapse"
-                      collapsible>
-        <Menu @chooseMenu="chooseMenu"
-              :collapsed="collapsed" />
-      </a-layout-sider>
-      <a-layout-content :style="{ background: '#0E0E0F', flex: 1, }">
-        <!-- <Drawer :title="'挂牌'" :visible="visible"></Drawer> -->
-        <!-- <Main /> -->
-        <router-view />
-      </a-layout-content>
+    <a-layout :class="['layout-top', isBottom ? 'layout-top-bottom' : 'layout-top-no-bottom']">
+        <a-layout-header class="m-layout-header">
+            <Header />
+        </a-layout-header>
+        <a-layout class="middleLayout">
+            <a-layout-sider
+                class="m-layout-left"
+                width="180"
+                v-model:collapsed="collapsed"
+                @collapse="collapse"
+                collapsible
+            >
+                <Menu @chooseMenu="chooseMenu" :collapsed="collapsed" />
+            </a-layout-sider>
+            <a-layout-content :style="{ background: '#0E0E0F', flex: 1, }">
+                <!-- <Drawer :title="'挂牌'" :visible="visible"></Drawer> -->
+                <!-- <Main /> -->
+                <router-view />
+            </a-layout-content>
+        </a-layout>
     </a-layout>
-  </a-layout>
 </template>
 <script lang="ts">
 import { defineComponent, ref, provide } from 'vue';
@@ -133,7 +134,7 @@ export default defineComponent({
         height: 40px;
         line-height: 40px;
         background: @m-grey0;
-        color: @m-grey1;
+        color: @m-grey32;
         padding: 0 20px;
         .flex();
         justify-content: space-between;
@@ -213,7 +214,7 @@ export default defineComponent({
                     li.ant-menu-submenu {
                         padding-bottom: 0;
                         .ant-menu-submenu-title {
-                            color: @m-grey2;
+                            color: @m-grey33;
                             font-size: 16px;
                             height: 60px;
                             line-height: 60px;
@@ -239,9 +240,15 @@ export default defineComponent({
                     }
                     li.ant-menu-submenu-open {
                         .ant-menu-submenu-title {
-                            color: @m-white0;
+                            color: @m-white6;
                             .icon {
-                                color: @m-white0;
+                                color: @m-white7;
+                            }
+                            .ant-menu-submenu-arrow {
+                                &::before,
+                                &::after {
+                                    background: @m-white7;
+                                }
                             }
                         }
                         .ant-menu-sub {

src/views/account/login.vue

@@ -1,48 +1,42 @@
 <template>
-  <div class="login">
-    <a-row type="flex"
-           justify="center"
-           align="middle">
-      <a-col>
-        <div class="login-background">
-          <div id="img">
-            <!-- <img src="./logo.png"
+    <div class="login">
+        <a-row type="flex" justify="center" align="middle">
+            <a-col>
+                <div class="login-background">
+                    <div id="img">
+                        <!-- <img src="./logo.png"
                         alt="" />-->
-          </div>
-        </div>
-        <div class="login-content">
-          <p>账号登录</p>
-          <a-form ref="formDom"
-                  :model="form"
-                  :rules="rules">
-            <a-form-item name="account">
-              <a-input placeholder="用户名/账号/手机号"
-                       v-model:value="form.account">
-                <template #prefix>
-                  <img src="@/assets/images/user.png"
-                       alt />
-                </template>
-              </a-input>
-            </a-form-item>
-            <a-form-item name="password"
-                         class="mb20">
-              <a-input @keyup.enter="loginAction"
-                       placeholder="请输入您的登录密码"
-                       type="password"
-                       v-model:value="form.password">
-                <template #prefix>
-                  <img src="@/assets/images/password.png"
-                       alt />
-                </template>
-              </a-input>
-            </a-form-item>
-            <a-form-item>
-              <div class="login-remember-password">
-                <a-checkbox v-model:checked="form.isRemember">记住账号</a-checkbox>
-                <!-- <router-link to="/resetPassword">忘记密码?</router-link> -->
-              </div>
-            </a-form-item>
-            <!-- <a-form-item>
+                    </div>
+                </div>
+                <div class="login-content">
+                    <p>账号登录</p>
+                    <a-form ref="formDom" :model="form" :rules="rules">
+                        <a-form-item name="account">
+                            <a-input placeholder="用户名/账号/手机号" v-model:value="form.account">
+                                <template #prefix>
+                                    <img src="@/assets/images/user.png" alt />
+                                </template>
+                            </a-input>
+                        </a-form-item>
+                        <a-form-item name="password" class="mb20">
+                            <a-input
+                                @keyup.enter="loginAction"
+                                placeholder="请输入您的登录密码"
+                                type="password"
+                                v-model:value="form.password"
+                            >
+                                <template #prefix>
+                                    <img src="@/assets/images/password.png" alt />
+                                </template>
+                            </a-input>
+                        </a-form-item>
+                        <a-form-item>
+                            <div class="login-remember-password">
+                                <a-checkbox v-model:checked="form.isRemember">记住账号</a-checkbox>
+                                <!-- <router-link to="/resetPassword">忘记密码?</router-link> -->
+                            </div>
+                        </a-form-item>
+                        <!-- <a-form-item>
               <div style="text-align:left">
                 <a-checkbox v-model:checked="form.isRead">
                   我已阅读并同意
@@ -50,16 +44,18 @@
                 <router-link to="/resetPassword">《用户协议》</router-link>
               </div>
                         </a-form-item>-->
-            <a-form-item class="mt20">
-              <a-button @click="loginAction"
-                        :loading="loading"
-                        :disabled="goHomeloading">登录</a-button>
-            </a-form-item>
-          </a-form>
-        </div>
-      </a-col>
-    </a-row>
-  </div>
+                        <a-form-item class="mt20">
+                            <a-button
+                                @click="loginAction"
+                                :loading="loading"
+                                :disabled="goHomeloading"
+                            >登录</a-button>
+                        </a-form-item>
+                    </a-form>
+                </div>
+            </a-col>
+        </a-row>
+    </div>
 </template>
 
 <script lang="ts">
@@ -243,7 +239,7 @@ export default defineComponent({
     background-size: cover;
     div {
         margin-top: 120px;
-        margin-left: 55px;
+        margin-left: 69.5px;
         width: 136px;
         height: 136px;
         min-width: 136px;