主题样式变更

src/App.vue

@@ -15,7 +15,5 @@ export default {
 }
 </script>
 <style lang="scss">
-.el-menu-item.is-active {
-  background-color: $theme-color !important;
-}
+
 </style>

src/components/AutoComponents/MButton/index.vue

@@ -22,5 +22,133 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+// 定义主题颜色（仿照 Element UI）
+$orange-color: $theme-color;
+$theme-colors: (
+  "default": (
+    "base": #ffffff,       // 默认背景色
+    "text": #606266,      // 默认文字颜色
+    "border": #dcdfe6     // 默认边框颜色
+  ),
+  "primary": #409EFF,
+  "success": #67C23A,
+  "warning": #E6A23C,
+  "danger": #F56C6C,
+  "orange": $theme-color  // 新增橙色
+);
+// 生成按钮样式
+@each $type, $color in $theme-colors {
+  @if $type == "default" {
+    .el-button--default {
+      background-color: map-get($color, "base");
+      border-color: map-get($color, "border");
+      color: map-get($color, "text");
+
+      // Hover 状态（浅橙色背景 + 浅橙色边框）
+      &:hover,
+      &:focus {
+        background-color: lighten($orange-color, 42%); // 非常浅的橙色
+        border-color: lighten($orange-color, 20%);    // 浅橙色边框
+        color: $orange-color;                         // 文字变橙色
+      }
+
+      // Active 状态（稍深的橙色边框）
+      &:active {
+        background-color: lighten($orange-color, 38%); // 更浅橙色背景
+        border-color: $orange-color;                   // 主橙色边框
+        color: $orange-color;
+      }
+
+      // Disabled 状态（保持灰色）
+      &.is-disabled {
+        background-color: #ffffff;
+        border-color: #e4e7ed;
+        color: #c0c4cc;
+      }
+
+      // Plain 模式（镂空按钮）
+      &.is-plain {
+        background-color: #ffffff;
+        border-color: #dcdfe6;
+        color: #606266;
+
+        // Hover 状态（浅橙色背景）
+        &:hover,
+        &:focus {
+          background-color: lighten($orange-color, 42%);
+          border-color: lighten($orange-color, 20%);
+          color: $orange-color;
+        }
+
+        // Active 状态（主橙色边框）
+        &:active {
+          background-color: lighten($orange-color, 38%);
+          border-color: $orange-color;
+          color: $orange-color;
+        }
+
+        // Disabled 状态（灰色）
+        &.is-disabled {
+          background-color: #ffffff;
+          border-color: #e4e7ed;
+          color: #c0c4cc;
+        }
+      }
+    }
+  }
+  // 其他颜色类型（primary、success、orange 等）
+  @else {
+    .el-button--#{$type} {
+      background-color: $color;
+      border-color: $color;
+      color: #fff;
+
+      &:hover,
+      &:focus {
+        background-color: lighten($color, 10%);
+        border-color: lighten($color, 10%);
+        color: #FFF;
+      }
+
+      &:active {
+        background-color: darken($color, 10%);
+        border-color: darken($color, 10%);
+      }
+
+      &.is-disabled {
+        background-color: lighten($color, 40%);
+        border-color: lighten($color, 20%);
+        color: #fff;
+        opacity: 0.6;
+      }
+
+      // 镂空按钮样式（is-plain）
+      &.is-plain {
+        background-color: lighten($color, 38%);
+        border-color: lighten($color, 20%);
+        color: $color;
+
+        &:hover,
+        &:focus {
+          background-color: $color;
+          border-color: $color;
+          color: #fff;
+        }
+
+        &:active {
+          background-color: darken($color, 10%);
+          border-color: darken($color, 10%);
+          color: #fff;
+        }
+
+        &.is-disabled {
+          background-color: lighten($color, 45%);
+          border-color: lighten($color, 30%);
+          color: lighten($color, 20%);
+        }
+      }
+    }
+  }
+}
 
 </style>

src/components/AutoComponents/MDialog/index.vue

@@ -13,7 +13,7 @@
     <slot></slot>
     <span slot="footer" v-if="!hideFooter">
       <m-button @click="show = false">{{ option?.textCancel ?? '取 消'}}</m-button>
-      <m-button type="primary" @click="sure">{{ option?.textSure ?? '确 定'}}</m-button>
+      <m-button type="orange" @click="sure">{{ option?.textSure ?? '确 定'}}</m-button>
     </span>
   </el-dialog>
 </template>

src/layout/components/MenuSide.vue

@@ -89,13 +89,4 @@ $height: 50px;
 .el-menu {
   border-right: none;
 }
-// ::v-deep .el-menu--inline .el-menu-item {
-//   background-color: #0f2438 !important;
-// }
-// ::v-deep .el-menu--inline .el-submenu__title {
-//   background-color: #0f2438 !important;
-// }
-// ::v-deep .el-menu-item.is-active {
-//   background-color: $theme-color !important;
-// }
 </style>

src/main.js

@@ -11,6 +11,7 @@ import './permission' // 路由守卫
 import promise from 'es6-promise'
 // 引入公用scss
 import '@/styles/index.scss'
+import '@/styles/orangeTheme.scss'
 import './autoComponents'
 
 // 引入自定义指令

src/styles/orangeTheme.scss

@@ -0,0 +1,26 @@
+// 重新定义主题样式
+// 菜单
+.el-menu-item.is-active {
+  background-color: $theme-color !important;
+  color: #FFF !important;
+}
+
+// tabs页
+.el-tabs__item:hover,
+.el-tabs__item:active,
+.el-tabs__item.is-active {
+  color: $theme-color !important;
+}
+.el-tabs__active-bar {
+  background-color: $theme-color !important;
+}
+
+// 分页
+.el-pagination.is-background .el-pager li:not(.disabled) {
+  &.active {
+    background: $theme-color;
+  }
+  &:hover:not(.active) {
+    color: $theme-color;
+  }
+}

src/utils/antvG6.js

@@ -73,7 +73,7 @@ export class MindMapNode extends Circle {
       return
     }
     const btn = this.upsert('collapse-expand', Badge, {
-      backgroundFill: '#409EFF',
+      backgroundFill: '#ff650e',
       backgroundHeight: 20,
       backgroundWidth: 20,
       lineHeight: 120,
@@ -120,7 +120,7 @@ export class MindMapNode extends Circle {
       textAlign: 'left',
       transform: [['translate', 50, 30]],
       padding: [10],
-      fill: '#409EFF',
+      fill: '#ff650e',
       cursor: 'pointer',
       zIndex: 5
     }, container)

src/views/bonus/allocation/index.vue

@@ -13,15 +13,15 @@
             </template>
             可发放绩效：<el-tag>{{ totalAllocationPerformanceSalary }}</el-tag>
             总绩效： <el-tag>{{ totalGrantPerformanceSalary }}</el-tag>
-            <el-button
+            <m-button
               class="ml-3"
-              type="primary"
+              type="orange"
               size="small"
               :loading="auditStatusLoading"
               v-show="auditStatus !== 0 && auditStatus !== 1 && items.length"
               @click="onSave">
               确认分配
-            </el-button>
+            </m-button>
           </div>
         </div>
       </template>

src/views/bonus/approve/index.vue

@@ -14,7 +14,7 @@
         <el-tag :type="statusList[row.status]?.type ?? 'info'">{{ statusList[row.status]?.label ?? '未知状态' }}</el-tag>
       </template>
       <template #actions="{ row }">
-        <el-button type="text" @click="onShowDetails(row)">查看详情</el-button>
+        <m-button type="text" @click="onShowDetails(row)">查看详情</m-button>
       </template>
     </m-table>
     <ApproveDetails ref="approveDetailsRefs" @onRefresh="onInit"></ApproveDetails>

src/views/humanResources/organizationStructure/index.vue

@@ -26,6 +26,7 @@ const NODE_TYPE = {
   type: 'MindMapNode',
   style: function (d) {
     return {
+      fill: '#ff650e',
       size: 15,
       label: true,
       labelFontSize: 14,

src/views/humanResources/organizationStructure/organizationEdit.vue

@@ -17,12 +17,12 @@
           >
             <div class="d-flex">
               <el-input v-model="tag.value" placeholder="请输入标注"></el-input>
-              <el-button class="ml-3" @click.prevent="onRemove(index)">删除</el-button>
+              <m-button class="ml-3" @click.prevent="onRemove(index)">删除</m-button>
             </div>
 
           </el-form-item>
           <el-form-item>
-            <el-button @click="onAdd">新增标注</el-button>
+            <m-button @click="onAdd">新增标注</m-button>
           </el-form-item>
         </el-form>
       </el-tab-pane>
@@ -39,6 +39,7 @@ export default {
   name: 'organizationEdit',
   data () {
     return {
+      activeName: '',
       drawer: false,
       formValues: {
         tags: [

src/views/humanResources/payroll/index.vue

@@ -2,7 +2,7 @@
   <div class="white" :class="{ 'pa-3': !$attrs.panorama }">
     <m-search :items="searchItems" v-model="searchValues" class="mb-3" @search="onSearch">
       <template #button v-if="!$attrs.panorama">
-        <m-button type="primary" icon="el-icon-download" :loading="exportLoading" plain @click="onExport">导出报表</m-button>
+        <m-button type="orange" icon="el-icon-download" :loading="exportLoading" @click="onExport">导出报表</m-button>
       </template>
     </m-search>
     <m-table

src/views/humanResources/roster/index.vue

@@ -2,12 +2,12 @@
   <div class="white" :class="{ 'pa-3': !$attrs.panorama }">
     <m-search v-if="!$attrs.panorama" :items="searchItems" v-model="searchValues" class="mb-3" @search="onSearch">
       <template #button>
-        <m-button type="primary" icon="el-icon-plus" plain @click="onAdd">新增</m-button>
+        <m-button type="orange" icon="el-icon-plus" @click="onAdd">新增</m-button>
         <el-upload class="el-button pa-0" action="#" :show-file-list="false" :http-request="onImport">
-          <m-button type="primary" icon="el-icon-upload2" plain :loading="importLoading">上传</m-button>
+          <m-button type="orange" icon="el-icon-upload2" :loading="importLoading">上传</m-button>
         </el-upload>
-        <m-button type="primary" icon="el-icon-download" plain @click="onExport" :loading="exportLoading">导出</m-button>
-        <m-button type="primary" icon="el-icon-download" plain @click="onDownload" :loading="downloadLoading">下载模板</m-button>
+        <m-button type="orange" icon="el-icon-download" @click="onExport" :loading="exportLoading">导出</m-button>
+        <m-button type="orange" icon="el-icon-download" @click="onDownload" :loading="downloadLoading">下载模板</m-button>
       </template>
     </m-search>
     <m-table

src/views/humanResources/welfare/welfareList/index.vue

@@ -2,7 +2,7 @@
   <div>
     <ListTemplate ref="listTemplateRefs">
       <template #button>
-        <m-button type="primary" icon="el-icon-plus" plain @click="onAdd">新增</m-button>
+        <m-button type="orange" icon="el-icon-plus" @click="onAdd">新增</m-button>
       </template>
       <template #actions="{ row }">
         <m-button text type="primary" size="small" @click="onEdit(row)">编辑</m-button>

src/views/salary/calculate/salaryCalculateUpload/index.vue

@@ -2,8 +2,8 @@
   <div class="white">
     <m-search :items="searchItems" v-model="searchValues" class="mb-3" @search="onSearch">
       <template #button>
-        <m-button size="small" type="primary" plain icon="el-icon-finished" :loading="submitLoading" @click="onSave">提交待上传文件</m-button>
-        <m-button size="small" type="warning" plain icon="el-icon-s-promotion" :loading="runLoading" @click="onRun">执行计算</m-button>
+        <m-button size="small" type="orange" icon="el-icon-finished" :loading="submitLoading" @click="onSave">提交待上传文件</m-button>
+        <m-button size="small" type="orange" icon="el-icon-s-promotion" :loading="runLoading" @click="onRun">执行计算</m-button>
       </template>
     </m-search>
     <m-table

src/views/salary/solution/salarySolution/index.vue

@@ -2,7 +2,7 @@
   <div>
     <ListTemplate ref="listTemplateRefs">
       <template #button>
-        <m-button type="primary" icon="el-icon-plus" plain @click="onAdd">新增</m-button>
+        <m-button type="orange" icon="el-icon-plus" @click="onAdd">新增</m-button>
       </template>
       <template #actions="{ row }">
         <m-button text type="primary" size="small" @click="onEdit(row)">编辑</m-button>

src/views/salary/solution/salarySolutionParameter/index.vue

@@ -2,7 +2,7 @@
   <div>
     <m-search class="mb-3" :items="searchItems" v-model="searchValues" @search="onSearch">
       <template #button>
-        <m-button type="primary" icon="el-icon-plus" plain @click="onAdd">新增</m-button>
+        <m-button type="orange" icon="el-icon-plus" @click="onAdd">新增</m-button>
       </template>
     </m-search>
     <m-table