批量更新,增加用户管理

This commit is contained in:
2025-11-01 17:57:34 +08:00
parent 186dcb86d9
commit bfba8d7ad6
28 changed files with 2307 additions and 2377 deletions
-1
View File
@@ -17,7 +17,6 @@
"@wangeditor/table-module": "^1.1.4",
"axios": "^1.11.0",
"chart.js": "^4.5.1",
"element-plus": "^2.10.7",
"marked": "^16.4.1",
"pinia": "^3.0.3",
"pinia-plugin-persistedstate": "^4.5.0",
-415
View File
@@ -1,11 +1,3 @@
// 主题色变量(SCSS变量 - 默认为亮色主题)
$primary-color: #3498db;
$secondary-color: #2ecc71;
$accent-color: #ffcc00;
$background-color: #f8f9fa;
$text-color: #333;
$border-radius: 4px;
// 通用字体
$font-family-base: 'Segoe UI', 'Helvetica Neue', Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
@@ -20,165 +12,6 @@ $box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
// 过渡
$transition-base: all 0.3s cubic-bezier(.25,.8,.25,1);
// ==========================================
// 主题系统 - 亮色和暗色主题
// 使用 data-theme="light" 或 data-theme="dark" 来切换主题
// ==========================================
// 默认亮色主题
:root[data-theme="light"],
:root:not([data-theme]) {
// 主题标识
--theme-mode: light;
// 主要颜色
--primary-color: #1890ff;
--primary-hover: #40a9ff;
--primary-active: #096dd9;
--secondary-color: #2ecc71;
--secondary-hover: #27ae60;
--secondary-active: #229954;
--accent-color: #ffcc00;
--accent-hover: #e6b800;
// 背景颜色
--background-color: #ffffff;
--background-secondary: #f8f9fa;
--background-tertiary: #f0f2f5;
--background-hover: #e9ecef;
// 文本颜色
--text-color: #212529;
--text-secondary: #6c757d;
--text-tertiary: #adb5bd;
--text-inverse: #ffffff;
// 边框颜色
--border-color: #dee2e6;
--border-color-hover: #ced4da;
--border-color-active: #adb5bd;
// 状态颜色
--success-color: #28a745;
--success-bg: #d4edda;
--warning-color: #ffc107;
--warning-bg: #fff3cd;
--error-color: #dc3545;
--error-bg: #f8d7da;
--info-color: #17a2b8;
--info-bg: #d1ecf1;
// 组件颜色
--card-bg: #ffffff;
--card-bg1: #1890ff;
--card-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
--sidebar-bg: #f8f9fa;
--sidebar-hover: #e9ecef;
--header-bg: #ffffff;
// Hero 渐变(亮色主题 - 现代蓝色渐变)
--hero-gradient-start: #667eea;
--hero-gradient-end: #764ba2;
// 阴影
--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
--shadow-md: 0 2px 8px rgba(0, 0, 0, 0.08);
--shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.1);
--shadow-xl: 0 8px 24px rgba(0, 0, 0, 0.12);
// 圆角
--border-radius: 4px;
--border-radius-sm: 2px;
--border-radius-lg: 8px;
--border-radius-xl: 12px;
--border-radius-full: 9999px;
// 过渡
--transition-base: all 0.3s cubic-bezier(.25,.8,.25,1);
--transition-fast: all 0.15s ease-in-out;
--transition-slow: all 0.5s ease-in-out;
// 字体
--font-family-base: 'Segoe UI', 'Helvetica Neue', Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
}
// 暗色主题
:root[data-theme="dark"] {
// 主题标识
--theme-mode: dark;
// 主要颜色
--primary-color: #409EFF;
--primary-hover: #66b1ff;
--primary-active: #337ecc;
--secondary-color: #58d68d;
--secondary-hover: #2ecc71;
--secondary-active: #27ae60;
--accent-color: #f7dc6f;
--accent-hover: #f4d03f;
// 背景颜色
--background-color: #1a1a1a;
--background-secondary: #2d2d2d;
--background-tertiary: #3d3d3d;
--background-hover: #4a4a4a;
// 文本颜色
--text-color: #e9ecef;
--text-secondary: #adb5bd;
--text-tertiary: #6c757d;
--text-inverse: #212529;
// 边框颜色
--border-color: #404040;
--border-color-hover: #4d4d4d;
--border-color-active: #5a5a5a;
// 状态颜色
--success-color: #58d68d;
--success-bg: #1e3c24;
--warning-color: #f7dc6f;
--warning-bg: #4d3e1a;
--error-color: #ec7063;
--error-bg: #3c2626;
--info-color: #5dade2;
--info-bg: #1e2a33;
// 组件颜色
--card-bg: #2d2d2d;
--card-bg1: #2d2d2d;
--card-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
--sidebar-bg: #1f1f1f;
--sidebar-hover: #3d3d3d;
--header-bg: #2d2d2d;
// Hero 渐变(暗色主题 - 深紫色渐变)
--hero-gradient-start: #4a5568;
--hero-gradient-end: #2d3748;
// 阴影
--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
--shadow-md: 0 2px 8px rgba(0, 0, 0, 0.4);
--shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.5);
--shadow-xl: 0 8px 24px rgba(0, 0, 0, 0.6);
// 圆角
--border-radius: 4px;
--border-radius-sm: 2px;
--border-radius-lg: 8px;
--border-radius-xl: 12px;
--border-radius-full: 9999px;
// 过渡
--transition-base: all 0.3s cubic-bezier(.25,.8,.25,1);
--transition-fast: all 0.15s ease-in-out;
--transition-slow: all 0.5s ease-in-out;
// 字体
--font-family-base: 'Segoe UI', 'Helvetica Neue', Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
}
body {
font-family: var(--font-family-base);
color: var(--text-color);
@@ -291,251 +124,3 @@ a {
html {
scroll-behavior: smooth;
}
// ==========================================
// Element Plus 主题覆盖 - 支持主题切换
// ==========================================
// 亮色主题下的 Element Plus 组件
:root[data-theme="light"],
:root:not([data-theme]) {
--el-bg-color: #ffffff;
--el-bg-color-page: #f2f3f5;
--el-text-color-primary: #303133;
--el-text-color-regular: #606266;
--el-text-color-secondary: #909399;
--el-text-color-placeholder: #c0c4cc;
--el-text-color-disabled: #c0c4cc;
--el-border-color: #dcdfe6;
--el-border-color-light: #e4e7ed;
--el-border-color-lighter: #ebeef5;
--el-border-color-extra-light: #f2f6fc;
--el-border-color-dark: #d4d7de;
--el-border-color-darker: #cdd0d6;
// 组件背景
--el-fill-color: #f0f2f5;
--el-fill-color-light: #f5f7fa;
--el-fill-color-lighter: #fafafa;
--el-fill-color-extra-light: #fafcff;
--el-fill-color-dark: #ebedf0;
--el-fill-color-darker: #e6e8eb;
--el-fill-color-blank: #ffffff;
// 组件颜色
--el-color-primary: #1890ff;
--el-color-success: #2ecc71;
--el-color-warning: #ffcc00;
--el-color-danger: #dc3545;
--el-color-error: #dc3545;
--el-color-info: #909399;
// 阴影
--el-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
--el-box-shadow-light: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
--el-box-shadow-base: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
--el-box-shadow-dark: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.12);
// 覆盖 Element Plus 表格样式(亮色主题)
--el-table-bg-color: #ffffff;
--el-table-header-bg-color: #fafafa;
--el-table-header-text-color: #909399;
--el-table-row-hover-bg-color: #f5f7fa;
--el-table-border-color: #ebeef5;
--el-table-border: 1px solid #ebeef5;
// 对话框
--el-overlay-color-light: rgba(0, 0, 0, 0.5);
--el-overlay-color-lighter: rgba(0, 0, 0, 0.3);
--el-mask-color: rgba(0, 0, 0, 0.5);
--el-mask-color-extra-light: rgba(0, 0, 0, 0.2);
}
// 暗色主题下的 Element Plus 组件
:root[data-theme="dark"] {
--el-bg-color: #2d2d2d;
--el-bg-color-page: #1a1a1a;
--el-text-color-primary: #e9ecef;
--el-text-color-regular: #adb5bd;
--el-text-color-secondary: #6c757d;
--el-text-color-placeholder: #495057;
--el-text-color-disabled: #495057;
--el-border-color: #404040;
--el-border-color-light: #404040;
--el-border-color-lighter: #3d3d3d;
--el-border-color-extra-light: #3d3d3d;
--el-border-color-dark: #4a4a4a;
--el-border-color-darker: #4a4a4a;
// 组件背景
--el-fill-color: #3d3d3d;
--el-fill-color-light: #3d3d3d;
--el-fill-color-lighter: #3d3d3d;
--el-fill-color-extra-light: #3d3d3d;
--el-fill-color-dark: #4a4a4a;
--el-fill-color-darker: #4a4a4a;
--el-fill-color-blank: #2d2d2d;
// 组件颜色
--el-color-primary: #409EFF;
--el-color-success: #58d68d;
--el-color-warning: #f7dc6f;
--el-color-danger: #ec7063;
--el-color-error: #ec7063;
--el-color-info: #adb5bd;
// 阴影(暗色主题使用更深的阴影)
--el-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.3);
--el-box-shadow-light: 0 2px 4px rgba(0, 0, 0, 0.5);
--el-box-shadow-base: 0 2px 4px rgba(0, 0, 0, 0.4);
--el-box-shadow-dark: 0 2px 4px rgba(0, 0, 0, 0.6);
// 覆盖 Element Plus 表格样式
--el-table-bg-color: var(--card-bg);
--el-table-header-bg-color: var(--header-bg);
--el-table-header-text-color: var(--text-color);
--el-table-row-hover-bg-color: var(--background-hover);
--el-table-border-color: var(--border-color);
--el-table-border: 1px solid var(--border-color);
// 对话框
--el-overlay-color-light: rgba(0, 0, 0, 0.7);
--el-overlay-color-lighter: rgba(0, 0, 0, 0.5);
--el-mask-color: rgba(0, 0, 0, 0.8);
--el-mask-color-extra-light: rgba(0, 0, 0, 0.3);
}
// ==========================================
// Element Plus 组件强制样式覆盖
// ==========================================
// 亮色和暗色主题统一样式
.el-table {
background-color: var(--card-bg);
color: var(--text-color);
transition: var(--transition-base);
th.el-table__cell {
background-color: var(--header-bg);
color: var(--text-color);
border-bottom-color: var(--border-color);
}
td.el-table__cell {
background-color: var(--card-bg);
color: var(--text-color);
border-bottom-color: var(--border-color);
}
.el-table__row:hover {
background-color: var(--background-hover) !important;
}
.el-table__row.current-row {
background-color: var(--background-hover) !important;
}
.el-table__border {
border-color: var(--border-color);
}
}
.el-dialog {
background-color: var(--card-bg);
color: var(--text-color);
transition: var(--transition-base);
.el-dialog__header {
border-bottom: 1px solid var(--border-color);
.el-dialog__title {
color: var(--text-color);
}
}
.el-dialog__body {
color: var(--text-color);
}
.el-dialog__footer {
border-top: 1px solid var(--border-color);
}
}
.el-descriptions {
.el-descriptions__label {
color: var(--text-secondary);
}
.el-descriptions__content {
color: var(--text-color);
}
.el-descriptions__border {
border-color: var(--border-color);
}
}
// 表单
.el-form {
.el-form-item__label {
color: var(--text-color);
}
.el-input__inner,
.el-textarea__inner {
background-color: var(--background-secondary);
color: var(--text-color);
border-color: var(--border-color);
&::placeholder {
color: var(--text-tertiary);
}
}
}
// 按钮
.el-button {
background-color: var(--background-secondary);
color: var(--text-color);
border-color: var(--border-color);
transition: var(--transition-fast);
&:hover {
border-color: var(--primary-color);
color: var(--primary-color);
}
&.el-button--primary {
background-color: var(--primary-color);
color: var(--text-inverse);
border-color: var(--primary-color);
&:hover {
background-color: var(--primary-hover);
}
}
}
// 标签页
.el-tabs {
.el-tabs__header {
background-color: var(--card-bg);
}
.el-tabs__item {
color: var(--text-secondary);
&.is-active {
color: var(--primary-color);
}
&:hover {
color: var(--primary-color);
}
}
.el-tabs__nav-wrap::after {
background-color: var(--border-color);
}
}
-8
View File
@@ -368,14 +368,6 @@ onMounted(() => {
}
}
.sidebar-menu :deep(.el-menu-item.is-active) {
background-color: var(--background-hover) !important;
color: var(--primary-color) !important;
i {
color: var(--primary-color) !important;
}
}
.user-nickname {
font-size: 14px;
font-weight: bold;
@@ -156,14 +156,6 @@ const handleSubMenuClick = (item: SubMenuItem) => {
}
}
&.is-active {
background-color: var(--background-hover) !important;
color: var(--primary-color) !important;
i {
color: var(--primary-color) !important;
}
}
}
}