feat: update theme to 山东矿机

src/constants/theme.ts

@@ -1,3 +1,4 @@
+import { type LayoutSetting } from '@/store/modules/layoutSetting';
 import { theme } from 'ant-design-vue';
 
 const { defaultAlgorithm, darkAlgorithm } = theme;
@@ -24,13 +25,28 @@ export const themeColor = {
   realDark: darkAlgorithm,
 } as const;
 export type ThemeColor = keyof typeof themeColor;
-
+export const defaultSetting: LayoutSetting = {
+  navTheme: 'light', // theme for nav menu
+  colorPrimary: '#deae35', // '#F5222D', // primary color of ant design
+  layout: 'sidemenu', // nav menu position: `sidemenu` or `topmenu`
+  contentWidth: 'Fluid', // layout of content: `Fluid` or `Fixed`, only works when layout is topmenu
+  fixedHeader: false, // sticky header
+  fixSiderbar: false, // sticky siderbar
+  colorWeak: false,
+  menu: {
+    locale: true,
+  },
+  title: 'vite-antdv-admin',
+  pwa: false,
+  iconfontUrl: '',
+  // production: process.env.NODE_ENV === 'production' && process.env.VUE_APP_PREVIEW !== 'true',
+};
 /** 主题色 */
 export const themeColors = [
   {
-    title: '华信蓝（默认）',
+    title: '山矿主题（默认）',
-    key: 'techBlue',
+    key: 'primary',
-    value: '#2a71b9',
+    value: defaultSetting.colorPrimary,
   },
   {
     title: '薄暮',

src/layout/header/components/setting/index.vue

@@ -1,24 +1,30 @@
 <template>
   <SettingOutlined @click="showDrawer" />
-  <Drawer v-model:open="visible" placement="right" :closable="false">
+  <Drawer v-model:open="visible"
-    <Descriptions title="整体风格" :column="5">
+    placement="right"
-      <Descriptions.Item v-for="theme in themeStyle" :key="theme.value">
+    :closable="false">
+    <Descriptions title="整体风格"
+      :column="5">
+      <Descriptions.Item v-for="theme in themeStyle"
+        :key="theme.value">
         <Tooltip :title="theme.label">
-          <div
+          <div class="style-checbox-item"
-            class="style-checbox-item"
             :class="{ active: layoutSetting.navTheme === theme.value }"
-            @click="setNavTheme(theme.value)"
+            @click="setNavTheme(theme.value)">
-          >
+            <svg-icon :name="theme.value"
-            <svg-icon :name="theme.value" size="50"></svg-icon>
+              size="50"></svg-icon>
           </div>
         </Tooltip>
       </Descriptions.Item>
     </Descriptions>
-    <Descriptions title="主题色" :column="9">
+    <Descriptions title="主题色"
-      <Descriptions.Item v-for="item in themeColors" :key="item.key">
+      :column="9">
+      <Descriptions.Item v-for="item in themeColors"
+        :key="item.key">
         <div class="style-checbox-item">
           <Tooltip :title="item.title">
-            <Tag :color="item.value" @click="setThemeColor(item.value)">
+            <Tag :color="item.value"
+              @click="setThemeColor(item.value)">
               <span :style="{ visibility: getThemeColorVisible(item.value) }"> ✔ </span>
             </Tag>
           </Tooltip>
@@ -27,48 +33,47 @@
       <Descriptions.Item key="custom">
         <div class="style-checbox-item">
           <Tooltip title="自定义">
-            <Tag :color="customColor" class="relative overflow-hidden">
+            <Tag :color="customColor"
-              <input
+              class="relative overflow-hidden">
-                v-model="customColor"
+              <input v-model="customColor"
                 type="color"
                 class="absolute inset-0"
                 :style="colorPickerStyle"
-                @input="setThemeColor(customColor!)"
+                @input="setThemeColor(customColor!)" />
-              />
               <span :style="{ visibility: getThemeColorVisible(customColor) }"> ✔ </span>
             </Tag>
           </Tooltip>
         </div>
       </Descriptions.Item>
     </Descriptions>
-    <Descriptions title="导航模式" :column="5">
+    <Descriptions title="导航模式"
-      <Descriptions.Item v-for="item in layouts" :key="item.value">
+      :column="5">
-        <div
+      <Descriptions.Item v-for="item in layouts"
-          class="style-checbox-item"
+        :key="item.value">
+        <div class="style-checbox-item"
           :class="{ active: layoutSetting.layout === item.value }"
-          @click="setLayout(item.value)"
+          @click="setLayout(item.value)">
-        >
+          <svg-icon :name="item.value"
-          <svg-icon :name="item.value" size="50"></svg-icon>
+            size="50"></svg-icon>
         </div>
       </Descriptions.Item>
     </Descriptions>
   </Drawer>
 </template>
 
-<script lang="ts" setup>
+<script lang="ts"
+  setup>
   import { ref, computed, type StyleValue } from 'vue';
   import { SettingOutlined } from '@ant-design/icons-vue';
   import { storeToRefs } from 'pinia';
   import { Drawer, Descriptions, Tag, Tooltip } from 'ant-design-vue';
-  import { layouts, themeColors, themeStyle } from './constant';
-  import type { ThemeColor } from './constant';
   import type { LayoutSetting } from '@/store/modules/layoutSetting';
   import { useLayoutSettingStore } from '@/store/modules/layoutSetting';
+  import { layouts, themeColors, themeStyle ,type ThemeColor} from '@/constants/theme';
 
   defineOptions({
     name: 'ProjectSetting',
   });
-
   const layoutSettingStore = useLayoutSettingStore();
   const { layoutSetting } = storeToRefs(layoutSettingStore);
   const customColor = ref(layoutSetting.value.colorPrimary);
@@ -99,7 +104,8 @@
   };
 </script>
 
-<style lang="less" scoped>
+<style lang="less"
+  scoped>
   .style-checbox-item {
     position: relative;
     cursor: pointer;

src/layout/logo/index.vue

@@ -1,40 +1,55 @@
 <template>
   <div class="logo">
     <!-- <img v-if="!collapsed" src="~@/assets/images/logowithtext.png" alt="" /> -->
-    <div v-if="!collapsed" class="flex items-center">
+    <div v-if="!collapsed"
-      <img src="~@/assets/images/logo.png" /><span class="company-name">華信智能</span></div
+      class="flex items-center">
-    >
+      <img src="~@/assets/images/logo.png" />
-    <img v-else src="~@/assets/images/logo.png" class="collapsed-icon" />
+      <img src="~@/assets/images/company_name.png"
+        class="company_name" />
+      <!-- <span class="company-name">華信智能</span> -->
+    </div>
+    <img v-else
+      src="~@/assets/images/logo.png"
+      class="collapsed-icon" />
     <!-- <h2 v-show="!collapsed" class="title">华信OA</h2> -->
   </div>
 </template>
 
 <script setup>
-  defineProps({
+defineProps({
   collapsed: {
     type: Boolean,
   },
-  });
+});
 </script>
 
-<style lang="less" scoped>
+<style lang="less"
+  scoped>
   .ant-layout-sider-dark {
     .company-name {
       color: white;
     }
   }
+
   .company-name {
     @apply text-2xl font-bold ml-xs tracking-widest;
     font-family: cursive;
   }
+
   .logo {
     @apply flex overflow-hidden whitespace-nowrap items-center justify-center;
 
     height: 64px;
     line-height: 64px;
 
+    .company_name {
+      height: 1.5rem;
+      padding-left: 5px;
+    }
+
     img {
-      height: 2.5rem;
+      height: 2rem;
+
     }
 
     .title {

src/layout/tabs/tabs-view.vue

@@ -272,7 +272,9 @@
   .dark .tabs-view {
     border-top: 1px solid black;
   }
-
+  .ant-dropdown-link{
+    color:@primary-color;
+  }
   .tabs-view {
     border-top: 1px solid #eee;
 

src/store/modules/layoutSetting.ts

@@ -4,7 +4,7 @@ import { theme as antdTheme } from 'ant-design-vue';
 import type { ThemeConfig } from 'ant-design-vue/es/config-provider/context';
 import { THEME_KEY } from '@/enums/cacheEnum';
 import { Storage } from '@/utils/Storage';
-import { themeColor, type ThemeColor } from '@/layout/header/components/setting/constant';
+import { defaultSetting, themeColor, type ThemeColor } from '@/constants/theme';
 
 /**
  * 项目默认配置项
@@ -34,22 +34,7 @@ export type LayoutSetting = {
   // production: process.env.NODE_ENV === 'production' && process.env.VUE_APP_PREVIEW !== 'true'
 };
 
-export const defaultSetting: LayoutSetting = {
+
-  navTheme: 'light', // theme for nav menu
-  colorPrimary: '#2a71b9', // '#F5222D', // primary color of ant design
-  layout: 'sidemenu', // nav menu position: `sidemenu` or `topmenu`
-  contentWidth: 'Fluid', // layout of content: `Fluid` or `Fixed`, only works when layout is topmenu
-  fixedHeader: false, // sticky header
-  fixSiderbar: false, // sticky siderbar
-  colorWeak: false,
-  menu: {
-    locale: true,
-  },
-  title: 'vite-antdv-admin',
-  pwa: false,
-  iconfontUrl: '',
-  // production: process.env.NODE_ENV === 'production' && process.env.VUE_APP_PREVIEW !== 'true',
-};
 
 export const useLayoutSettingStore = defineStore('layout-setting', () => {
   const localLayoutSetting = Storage.get<LayoutSetting>(THEME_KEY, {});

src/styles/variables.less

@@ -2,4 +2,4 @@
 
 @header-height: 64px;
 @footer-height: 70px;
-@primary-color: #00b96b;
+@primary-color: #deae35;

src/views/login/index.vue

@@ -2,7 +2,7 @@
   <div class="login-box">
     <div class="login-logo">
       <!-- <svg-icon name="logo" :size="45" /> -->
-      <img :src="logo" width="100%" height="70px" />
+      <img src="~@/assets/images/company_logo_with_name.png" width="100%" height="100px" />
       <!-- <h1 class="mb-0 ml-2 text-3xl font-bold">Antd Admin</h1> -->
     </div>
     <a-form layout="horizontal" :model="state.formInline" @submit.prevent="handleSubmit">
@@ -21,6 +21,7 @@
         >
           <template #prefix><lock-outlined type="user" /></template>
         </a-input>
+
       </a-form-item>
       <a-form-item>
         <a-input
@@ -49,15 +50,13 @@
 </template>
 
 <script setup lang="ts">
-  import { reactive, ref } from 'vue';
+  import { reactive } from 'vue';
   import { UserOutlined, LockOutlined, SafetyOutlined } from '@ant-design/icons-vue';
   import { useRoute, useRouter } from 'vue-router';
   import { message, Modal } from 'ant-design-vue';
   import { useUserStore } from '@/store/modules/user';
   import Api from '@/api/';
   import { to } from '@/utils/awaitTo';
-  import logo1 from '@/assets/images/logowithtext.png';
-  const logo = ref(logo1);
   const state = reactive({
     loading: false,
     captcha: '',
@@ -117,7 +116,7 @@
     align-items: center;
     width: 100vw;
     height: 100vh;
-    padding-top: 240px;
+    padding-top: 180px;
     background: url('@/assets/login.svg');
     background-size: 100%;