diff --git a/klp-ui/.env.development b/klp-ui/.env.development
index 10929804..770dd999 100644
--- a/klp-ui/.env.development
+++ b/klp-ui/.env.development
@@ -1,5 +1,5 @@
# 页面标题
-VUE_APP_TITLE = 科伦普综合办公系统
+VUE_APP_TITLE = 科伦普冷轧涂镀数智运营一体化平台
# 开发环境配置
ENV = 'development'
diff --git a/klp-ui/.env.production b/klp-ui/.env.production
index 63dcd55d..4b768784 100644
--- a/klp-ui/.env.production
+++ b/klp-ui/.env.production
@@ -1,5 +1,5 @@
# 页面标题
-VUE_APP_TITLE = 科伦普综合办公系统
+VUE_APP_TITLE = 科伦普冷轧涂镀数智运营一体化平台
# 生产环境配置
ENV = 'production'
diff --git a/klp-ui/.env.stage b/klp-ui/.env.stage
index 429d23cd..8363e259 100644
--- a/klp-ui/.env.stage
+++ b/klp-ui/.env.stage
@@ -1,5 +1,5 @@
# 页面标题
-VUE_APP_TITLE = 科伦普综合办公系统
+VUE_APP_TITLE = 科伦普冷轧涂镀数智运营一体化平台
# 开发环境配置
ENV = 'development'
diff --git a/klp-ui/src/assets/styles/element-ui.scss b/klp-ui/src/assets/styles/element-ui.scss
index d73b1a44..01ea83c6 100644
--- a/klp-ui/src/assets/styles/element-ui.scss
+++ b/klp-ui/src/assets/styles/element-ui.scss
@@ -11,13 +11,27 @@ $info-base: #AEB6BF;
/* 次主色原始值 */
// 背景色原始值
-$background-base: #2B2F36;
+// 暗色
+// $background-base: #2B2F36;
+// $background-light-base: lighten($background-base, 5%);
+// $background-lighter-base: lighten($background-base, 10%);
+// $panel-bg-base: #3A3F45;
+// $table-bg-base: #1E2227;
+
+// // 暗色边框色原始值
+// $border-color-base: #6E757D;
+// $border-color-light: #828991;
+// $border-color-lighter: #9AA1A9;
+
+// 亮色
+$background-base: #F5F5F5;
$background-light-base: lighten($background-base, 5%);
$background-lighter-base: lighten($background-base, 10%);
-$panel-bg-base: #3A3F45;
-$table-bg-base: #1E2227;
+$--color-text-primary: #1a1a1a;
+$panel-bg-base: $--color-text-primary;
+$table-bg-base: $--color-text-primary;
-// 边框色原始值(新增基础边框色变量)
+// 亮色边框色原始值
$border-color-base: #6E757D;
$border-color-light: #828991;
$border-color-lighter: #9AA1A9;
@@ -52,10 +66,10 @@ $--border-color: $border-color-base;
--table-bg: #{$table-bg-base};
/* 文本色 */
- --color-text-primary: #FFFFFF;
- --color-text-regular: #EAEAEA;
- --color-text-secondary: #B6BDC5;
- --color-text-placeholder: #8A9098;
+ --color-text-primary: #{$--color-text-primary};
+ --color-text-regular: #333333;
+ --color-text-secondary: #555555;
+ --color-text-placeholder: #777777;
/* 边框色 */
--border-color-base: #{$border-color-base};
@@ -73,8 +87,10 @@ $--border-color: $border-color-base;
--btn-height: #{$--btn-height};
/* 金属质感变量 */
- --metal-gradient-light: linear-gradient(145deg, #3E434A, #363B41);
- --metal-gradient-dark: linear-gradient(145deg, #363B41, #3E434A);
+ // --metal-gradient-light: linear-gradient(145deg, #3E434A, #363B41);
+ // --metal-gradient-dark: linear-gradient(145deg, #363B41, #3E434A);
+ --metal-gradient-light: linear-gradient(145deg, $--color-background-light, $--color-background);
+ --metal-gradient-dark: linear-gradient(145deg, $--color-background, $--color-background-light);
--metal-highlight: rgba(255, 255, 255, .14);
--metal-shadow: 5px 5px 12px rgba(0, 0, 0, .22), -5px -5px 12px rgba(255, 255, 255, .06);
--metal-shadow-inset: inset 3px 3px 6px rgba(0, 0, 0, .28), inset -3px -3px 6px rgba(255, 255, 255, .06);
@@ -194,7 +210,7 @@ body {
// 主按钮(品牌梯度)
.el-button--primary {
- @include button-variant(#fff, darken($--color-primary, 10%));
+ @include button-variant($--color-text-primary, darken($--color-primary, 10%));
background: linear-gradient(145deg, lighten($--color-primary, 6%), darken($--color-primary, 6%));
border-color: darken($--color-primary, 10%);
@@ -205,17 +221,17 @@ body {
// 功能按钮(统一风格)
.el-button--success {
- @include button-variant(#fff, darken($--color-success, 10%));
+ @include button-variant($--color-text-primary, darken($--color-success, 10%));
background: linear-gradient(145deg, lighten($--color-success, 6%), darken($--color-success, 6%));
}
.el-button--warning {
- @include button-variant(#fff, darken($--color-warning, 10%));
+ @include button-variant($--color-text-primary, darken($--color-warning, 10%));
background: linear-gradient(145deg, lighten($--color-warning, 6%), darken($--color-warning, 6%));
}
.el-button--danger {
- @include button-variant(#fff, darken($--color-danger, 10%));
+ @include button-variant($--color-text-primary, darken($--color-danger, 10%));
background: linear-gradient(145deg, lighten($--color-danger, 6%), darken($--color-danger, 6%));
}
@@ -300,7 +316,7 @@ body {
// ---------------------- 3.2 表格(深色交替 + 金属边框)----------------------
.el-table {
background: $--table-bg;
- border: 1px solid $--border-color-light;
+ // border: 1px solid $--border-color-light;
border-radius: 8px;
box-shadow: $--metal-shadow;
color: $--color-text-regular;
@@ -315,10 +331,10 @@ body {
// 表头(深灰黑 + 纯白文字)
.el-table__header-wrapper {
th.el-table__cell {
- background: #1F2227;
+ background: $--color-background;
color: $--color-text-primary;
font-weight: 600;
- border-bottom: 1px solid #444A52;
+ border-bottom: 1px solid $--border-color-lighter;
padding: 4px !important; // 紧凑 padding
height: auto;
font-size: 13px;
@@ -331,14 +347,14 @@ body {
// 奇数行
&:nth-child(odd) .el-table__cell {
- background: #2F3339;
- color: #EAEAEA;
+ background: $--color-background-light;
+ color: $--color-text-regular;
}
// 偶数行
&:nth-child(even) .el-table__cell {
- background: #353A40;
- color: #EAEAEA;
+ background: $--color-background-light;
+ color: $--color-text-regular;
}
// hover
@@ -357,8 +373,8 @@ body {
// 单元格(统一边框 + 紧凑 padding)
.el-table__cell {
- border-bottom: 1px solid #444A52;
- color: #EAEAEA;
+ border-bottom: 1px solid $--border-color-lighter;
+ color: $--color-text-regular;
padding: 2px 4px !important; // 超紧凑
font-size: 13px;
}
@@ -391,7 +407,7 @@ body {
}
&__empty-block {
- background: #1e2227;
+ background: $--color-background;
}
// 适配尺寸类(统一紧凑)
@@ -405,10 +421,10 @@ body {
// 表头(深灰黑 + 纯白文字)
.el-table__fixed-header-wrapper {
th.el-table__cell {
- background: #1F2227;
+ background: $--color-background;
color: $--color-text-primary;
font-weight: 600;
- border-bottom: 1px solid #444A52;
+ border-bottom: 1px solid $--border-color-lighter;
padding: 4px !important; // 紧凑 padding
font-size: 13px;
}
@@ -420,14 +436,14 @@ body {
// 奇数行
&:nth-child(odd) .el-table__cell {
- background: #2F3339;
- color: #EAEAEA;
+ background: $--color-background-light;
+ color: $--color-text-regular;
}
// 偶数行
&:nth-child(even) .el-table__cell {
- background: #353A40;
- color: #EAEAEA;
+ background: $--color-background-light;
+ color: $--color-text-regular;
}
// 当前行
@@ -598,7 +614,7 @@ body {
&.current {
background: $--color-primary;
- color: #fff;
+ color: $--color-text-primary;
}
&.in-range {
@@ -612,13 +628,13 @@ body {
&.start-date,
&.end-date {
background: $--color-primary;
- color: #fff;
+ color: $--color-text-primary;
}
}
}
.available.in-range div {
- background-color: #111;
+ background-color: $--color-background;
}
}
@@ -645,7 +661,7 @@ body {
&.el-button--primary {
background: $--color-primary;
border-color: $--color-primary;
- color: #fff;
+ color: $--color-text-primary;
&:hover {
background: lighten($--color-primary, 10%);
@@ -697,7 +713,7 @@ body {
background: $--metal-gradient-light;
border-color: $--border-color-light;
color: $--color-text-regular;
- box-shadow: $--metal-shadow-inset;
+ // box-shadow: $--metal-shadow-inset;
border-radius: 0;
height: $--btn-height;
line-height: $--btn-height;
@@ -709,7 +725,7 @@ body {
&:focus {
border-color: $--color-primary;
- box-shadow: $--metal-shadow-inset, 0 0 0 2px rgba($--color-primary, .22);
+ box-shadow: $--metal-shadow-inset;
}
}
@@ -738,7 +754,7 @@ body {
border-left: 1px solid $--border-color-light;
background: $--metal-gradient-light;
color: $--color-text-regular;
- box-shadow: $--metal-shadow-inset;
+ // box-shadow: $--metal-shadow-inset;
font-size: 13px;
}
}
@@ -748,7 +764,7 @@ body {
background: $--metal-gradient-light;
border-color: $--border-color-light;
color: $--color-text-regular;
- box-shadow: $--metal-shadow-inset;
+ // box-shadow: $--metal-shadow-inset;
border-radius: 0;
padding: $--spacing-base;
font-size: 13px;
@@ -851,7 +867,7 @@ body {
&.selected {
background-color: rgba($--color-primary, .20);
- color: #fff;
+ color: $--color-text-primary;
}
}
}
@@ -930,12 +946,12 @@ body {
left: 0;
position: relative;
margin: 10vh auto 0;
- background: $--metal-gradient-light !important;
+ // background: $--metal-gradient-light !important;
+ background-color: white !important;
border: 1px solid $--border-color-light;
box-shadow: $--metal-shadow;
border-radius: 8px;
color: $--color-text-regular;
- width: 60% !important; // 自适应宽度
// 对话框头部
.el-dialog__header {
@@ -1299,7 +1315,7 @@ body {
&.current,
&.selected {
background: $--color-primary;
- color: #fff;
+ color: $--color-text-primary;
&:hover {
background: darken($--color-primary, 5%);
@@ -1336,7 +1352,7 @@ body {
&.is-selected {
background: $--color-primary;
- color: #fff;
+ color: $--color-text-primary;
&:hover {
background: darken($--color-primary, 5%);
@@ -1581,7 +1597,7 @@ body {
&.active {
background: $--color-primary;
- color: #fff;
+ color: $--color-text-primary;
border-color: $--color-primary;
}
}
@@ -1637,28 +1653,13 @@ div.pagination-container {
color: $--color-text-regular;
.el-tree-node {
- &:hover {
- background: rgba($--color-primary, .12);
- }
+ // &:hover {
+ // background: rgba($--color-primary, .12);
+ // }
&.is-current>.el-tree-node__content {
background: rgba($--color-primary, .2);
color: $--color-primary;
}
}
-}
-
-
-// ---------------------- 3.8 自定义工具类 ----------------------
-// 固定按钮宽度
-// .fixed-width {
-// .el-button--mini {
-// padding: 7px 10px;
-// width: 60px;
-// }
-// }
-
-// 居中单元格(深色表头)
-.is-center.is-leaf.el-table__cell {
- background-color: #1F2227;
}
\ No newline at end of file
diff --git a/klp-ui/src/assets/styles/klp.scss b/klp-ui/src/assets/styles/klp.scss
index 0b665aeb..8c706236 100644
--- a/klp-ui/src/assets/styles/klp.scss
+++ b/klp-ui/src/assets/styles/klp.scss
@@ -88,83 +88,83 @@
padding: 10px 20px 0;
}
-.el-table {
- .el-table__header-wrapper, .el-table__fixed-header-wrapper {
- th {
- word-break: break-word;
- background-color: #f8f8f9;
- color: #515a6e;
- height: 40px;
- font-size: 13px;
- }
- }
+// .el-table {
+// .el-table__header-wrapper, .el-table__fixed-header-wrapper {
+// th {
+// word-break: break-word;
+// background-color: #f8f8f9;
+// color: #515a6e;
+// height: 40px;
+// font-size: 13px;
+// }
+// }
- .el-table__body-wrapper {
- .el-button [class*="el-icon-"] + span {
- margin-left: 1px;
- }
- }
-}
+// .el-table__body-wrapper {
+// .el-button [class*="el-icon-"] + span {
+// margin-left: 1px;
+// }
+// }
+// }
/** 表单布局 **/
-.form-header {
- font-size: 15px;
- color: #6379bb;
- border-bottom: 1px solid #ddd;
- margin: 8px 10px 25px 10px;
- padding-bottom: 5px
-}
+// .form-header {
+// font-size: 15px;
+// color: #6379bb;
+// border-bottom: 1px solid #ddd;
+// margin: 8px 10px 25px 10px;
+// padding-bottom: 5px
+// }
-/** 表格布局 **/
-.pagination-container {
- position: relative;
- height: 25px;
- margin-bottom: 10px;
- margin-top: 15px;
- padding: 10px 20px !important;
-}
+// /** 表格布局 **/
+// .pagination-container {
+// position: relative;
+// height: 25px;
+// margin-bottom: 10px;
+// margin-top: 15px;
+// padding: 10px 20px !important;
+// }
/* tree border */
-.tree-border {
- margin-top: 5px;
- border: 1px solid #e5e6e7;
- background: #FFFFFF none;
- border-radius: 4px;
-}
+// .tree-border {
+// margin-top: 5px;
+// border: 1px solid #e5e6e7;
+// background: #FFFFFF none;
+// border-radius: 4px;
+// }
-.pagination-container .el-pagination {
- right: 0;
- position: absolute;
-}
+// .pagination-container .el-pagination {
+// right: 0;
+// position: absolute;
+// }
-@media (max-width: 768px) {
- .pagination-container .el-pagination > .el-pagination__jump {
- display: none !important;
- }
- .pagination-container .el-pagination > .el-pagination__sizes {
- display: none !important;
- }
-}
+// @media (max-width: 768px) {
+// .pagination-container .el-pagination > .el-pagination__jump {
+// display: none !important;
+// }
+// .pagination-container .el-pagination > .el-pagination__sizes {
+// display: none !important;
+// }
+// }
-.el-table .fixed-width .el-button--mini {
- padding-left: 0;
- padding-right: 0;
- width: inherit;
-}
+// .el-table .fixed-width .el-button--mini {
+// padding-left: 0;
+// padding-right: 0;
+// width: inherit;
+// }
-/** 表格更多操作下拉样式 */
-.el-table .el-dropdown-link,.el-table .el-dropdown-selfdefine {
- cursor: pointer;
- margin-left: 5px;
-}
+// /** 表格更多操作下拉样式 */
+// .el-table .el-dropdown-link,.el-table .el-dropdown-selfdefine {
+// cursor: pointer;
+// margin-left: 5px;
+// }
-.el-table .el-dropdown, .el-icon-arrow-down {
- font-size: 12px;
-}
+// .el-table .el-dropdown, .el-icon-arrow-down {
+// font-size: 12px;
+// }
-.el-tree-node__content > .el-checkbox {
- margin-right: 8px;
-}
+// .el-tree-node__content > .el-checkbox {
+// margin-right: 8px;
+// }
.list-group-striped > .list-group-item {
border-left: 0;
diff --git a/klp-ui/src/assets/styles/sidebar.scss b/klp-ui/src/assets/styles/sidebar.scss
index c08bd169..21704bd1 100644
--- a/klp-ui/src/assets/styles/sidebar.scss
+++ b/klp-ui/src/assets/styles/sidebar.scss
@@ -4,13 +4,14 @@
--text-regular: #333333;
--text-secondary: #555555;
--text-placeholder: #777777;
+ --background-color: #fff;
.main-container {
height: 100%;
transition: margin-left .28s, box-shadow .3s ease;
margin-left: $base-sidebar-width;
position: relative;
- background: #1E2227; // 金属浅色渐变
+ // background: #1E2227; // 金属浅色渐变
}
.sidebarHide {
@@ -21,7 +22,7 @@
-webkit-transition: width .28s, background .3s ease;
transition: width 0.28s, background .3s ease;
width: $base-sidebar-width !important;
- background: #1E2227; // 金属深色渐变
+ background: var(--background-color); // 金属深色渐变
border-right: 1px solid #8d939b;
height: 100%;
position: fixed;
@@ -44,11 +45,12 @@
.el-scrollbar__bar.is-vertical {
right: 0px;
- background: rgba(0, 0, 0, 0.05);
+ background: #2Bf;
+ width: 0;
}
.el-scrollbar__thumb {
- background: #1E2227;
+ background: var(--background-color);
border-radius: 3px;
}
@@ -112,13 +114,6 @@
}
}
- // 深色主题下子菜单选中高亮
- & .theme-dark .is-active>.el-submenu__title {
- color: #fff !important; // 选中时文字纯白
- // background-color: rgba(95, 123, 160, 0.25) !important; // 工业蓝浅高亮
- // border-left: 3px solid #5F7BA0; // 左边高亮条
- }
-
// & .nest-menu .el-submenu>.el-submenu__title,
& .el-submenu .el-menu-item {
// 子菜单默认样式
@@ -146,7 +141,7 @@
&.is-active {
background: rgba(95, 123, 160, 0.28) !important; // 激活背景
- color: #fff !important; // 激活文字白色
+ color: #000 !important; // 激活文字白色
font-weight: 600;
border-left: 3px solid #5F7BA0; // 左边高亮条
}
@@ -154,10 +149,10 @@
}
.el-menu-item.is-active.submenu-title-noDropdown {
- background: rgba(95, 123, 160, 0.28) !important; // 激活背景
- color: #fff !important; // 激活文字白色
+ background: #657b96; // 激活背景
+ color: #fff; // 激活文字白色
font-weight: 600;
- border-left: 3px solid #5F7BA0; // 左边高亮条
+ border-left: 3px solid #657b96; // 左边高亮条
}
.hideSidebar {
@@ -247,7 +242,7 @@
}
}
-// when menu collapsed
+// 收起状态下的菜单
.el-menu--vertical {
&>.el-menu {
.svg-icon {
diff --git a/klp-ui/src/components/KLPUI/KLPList/index.vue b/klp-ui/src/components/KLPUI/KLPList/index.vue
index d7dba9ea..50dcaa09 100644
--- a/klp-ui/src/components/KLPUI/KLPList/index.vue
+++ b/klp-ui/src/components/KLPUI/KLPList/index.vue
@@ -270,7 +270,7 @@ export default {
/* 列表项选中状态(左侧高亮边框+背景色) */
.klp-list-item.active {
border-left: 3px solid #2bf;
- background-color: #222;
+ /* background-color: #fff; */
}
/* 列表标题区域(占满中间空间,让操作按钮靠右) */
@@ -284,7 +284,7 @@ export default {
/* 标题前置标签样式 */
.klp-list-title .title-label {
- color: #ddd;
+ color: #111;
margin-right: 6px;
font-size: 13px;
white-space: nowrap; /* 标签不换行 */
@@ -293,7 +293,7 @@ export default {
/* 标题内容样式(溢出省略) */
.klp-list-title .title-value {
- color: #ddd;
+ color: #111;
font-weight: 500;
font-size: 14px;
white-space: nowrap; /* 禁止换行 */
diff --git a/klp-ui/src/components/MarkdownPreview.vue b/klp-ui/src/components/MarkdownPreview.vue
index 51c73846..f6e91178 100644
--- a/klp-ui/src/components/MarkdownPreview.vue
+++ b/klp-ui/src/components/MarkdownPreview.vue
@@ -48,7 +48,7 @@ export default {
.markdown-preview {
border-radius: 4px;
padding: 8px;
- background: #393d46;
- color: white;
+ background: var(--color-background);
+ color: var(--color-text-primary);
}
diff --git a/klp-ui/src/components/VditorEditor.vue b/klp-ui/src/components/VditorEditor.vue
index 49dc80b6..af31309b 100644
--- a/klp-ui/src/components/VditorEditor.vue
+++ b/klp-ui/src/components/VditorEditor.vue
@@ -72,7 +72,8 @@ export default {
diff --git a/klp-ui/src/layout/components/Navbar.vue b/klp-ui/src/layout/components/Navbar.vue
index 2ede0d0c..65c9bc08 100644
--- a/klp-ui/src/layout/components/Navbar.vue
+++ b/klp-ui/src/layout/components/Navbar.vue
@@ -107,10 +107,10 @@ export default {
overflow: hidden;
position: relative;
// 金属质感渐变背景
- background: #454c51;
- border-bottom: 1px solid #8d939b;
- box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1),
- 0 1px 1px rgba(255, 255, 255, 0.08) inset;
+ // background: #454c51;
+ // border-bottom: 1px solid #8d939b;
+ // box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1),
+ // 0 1px 1px rgba(255, 255, 255, 0.08) inset;
.hamburger-container {
line-height: 46px;
diff --git a/klp-ui/src/layout/components/Sidebar/Logo.vue b/klp-ui/src/layout/components/Sidebar/Logo.vue
index 9843efb4..b9b4aa78 100644
--- a/klp-ui/src/layout/components/Sidebar/Logo.vue
+++ b/klp-ui/src/layout/components/Sidebar/Logo.vue
@@ -1,13 +1,13 @@
-