后端变更: - 移除 tasks_manager.py 和 core/auth.py,简化架构 - 新增 core/scheduler.py 验证调度器,替代原有任务管理 - 大幅优化 api_server.py:统一错误处理、增强参数验证、支持调度器控制 - validator.py 增强 SOCKS4/SOCKS5 代理验证支持 - config.py 清理废弃配置(WebSocket、API Key、认证开关) - SQLite 数据库操作性能优化 前端变更: - 移除任务管理页面 (CrawlerTasks) 和 WebSocket 相关代码 - 路由简化为 4 个核心页面:总览、代理列表、插件管理、设置 - 提取前端工具函数(clipboard、confirm、format)和 API 类型定义 - 优化 CSS 架构:完善 variables、utilities、element-plus 样式 - Dashboard、Plugins、ProxyList、Settings 页面 UI/UX 优化 - App.vue 响应式侧边栏和页面过渡动画优化 其他: - 移除 PowerShell 启动脚本,简化 Windows 批处理脚本 - 新增 README_SOCKS.md SOCKS 代理支持文档 - .env.example 和 .gitignore 更新
594 lines
14 KiB
CSS
594 lines
14 KiB
CSS
/* ==================== Element Plus 冷灰紫主题覆盖 ==================== */
|
|
|
|
/* -------------------- 输入框 -------------------- */
|
|
.el-input__wrapper {
|
|
background-color: var(--surface-3) !important;
|
|
box-shadow: 0 0 0 1px var(--border) inset !important;
|
|
border-radius: var(--radius-md) !important;
|
|
}
|
|
|
|
.el-input__wrapper:hover,
|
|
.el-input__wrapper.is-focus {
|
|
box-shadow: 0 0 0 1px var(--primary) inset !important;
|
|
}
|
|
|
|
.el-input__wrapper.is-focus {
|
|
box-shadow: 0 0 0 1px var(--primary) inset, var(--shadow-primary-sm) !important;
|
|
}
|
|
|
|
.el-input__inner {
|
|
color: var(--text-primary) !important;
|
|
}
|
|
|
|
.el-input__inner::placeholder {
|
|
color: var(--text-muted) !important;
|
|
}
|
|
|
|
/* -------------------- 选择器 -------------------- */
|
|
.el-select__wrapper {
|
|
background-color: var(--surface-3) !important;
|
|
box-shadow: 0 0 0 1px var(--border) inset !important;
|
|
border-radius: var(--radius-md) !important;
|
|
}
|
|
|
|
.el-select__wrapper:hover,
|
|
.el-select__wrapper.is-focused {
|
|
box-shadow: 0 0 0 1px var(--primary) inset !important;
|
|
}
|
|
|
|
.el-select__wrapper.is-focused {
|
|
box-shadow: 0 0 0 1px var(--primary) inset, var(--shadow-primary-sm) !important;
|
|
}
|
|
|
|
.el-select__placeholder {
|
|
color: var(--text-muted) !important;
|
|
}
|
|
|
|
.el-select__caret {
|
|
color: var(--text-secondary) !important;
|
|
}
|
|
|
|
.el-select__caret.is-reverse {
|
|
color: var(--primary) !important;
|
|
}
|
|
|
|
.el-select-dropdown {
|
|
border: 1px solid var(--border) !important;
|
|
box-shadow: var(--shadow-lg) !important;
|
|
background: var(--surface) !important;
|
|
border-radius: var(--radius-md) !important;
|
|
}
|
|
|
|
.el-select-dropdown__item {
|
|
color: var(--text-secondary) !important;
|
|
}
|
|
|
|
.el-select-dropdown__item:hover {
|
|
background: var(--primary-soft) !important;
|
|
color: var(--primary) !important;
|
|
}
|
|
|
|
.el-select-dropdown__item.is-selected {
|
|
color: var(--primary) !important;
|
|
font-weight: 600;
|
|
background: var(--primary-soft) !important;
|
|
}
|
|
|
|
/* -------------------- 数字输入框 -------------------- */
|
|
.el-input-number__decrease,
|
|
.el-input-number__increase {
|
|
background: var(--surface-2) !important;
|
|
color: var(--text-secondary) !important;
|
|
border: 1px solid var(--border) !important;
|
|
}
|
|
|
|
.el-input-number__decrease:hover,
|
|
.el-input-number__increase:hover {
|
|
background: var(--primary-soft) !important;
|
|
color: var(--primary) !important;
|
|
border-color: var(--primary) !important;
|
|
}
|
|
|
|
.el-input-number__decrease.is-disabled,
|
|
.el-input-number__increase.is-disabled {
|
|
color: var(--el-disabled-text) !important;
|
|
border-color: var(--border) !important;
|
|
}
|
|
|
|
.el-input-number__wrapper {
|
|
background-color: var(--surface-3) !important;
|
|
box-shadow: 0 0 0 1px var(--border) inset !important;
|
|
}
|
|
|
|
.el-input-number__wrapper:hover,
|
|
.el-input-number__wrapper.is-focus {
|
|
box-shadow: 0 0 0 1px var(--primary) inset !important;
|
|
}
|
|
|
|
/* -------------------- 按钮 -------------------- */
|
|
.el-button {
|
|
border: 1px solid var(--border) !important;
|
|
background: var(--surface-2) !important;
|
|
color: var(--text-secondary) !important;
|
|
border-radius: var(--radius-md) !important;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.el-button:hover {
|
|
border-color: var(--primary) !important;
|
|
color: var(--primary) !important;
|
|
background: var(--surface-3) !important;
|
|
}
|
|
|
|
/* 主要按钮 - 深紫实心 */
|
|
.el-button--primary {
|
|
background: var(--primary-solid) !important;
|
|
border-color: var(--primary-solid) !important;
|
|
color: white !important;
|
|
}
|
|
|
|
.el-button--primary:hover {
|
|
background: var(--primary-solid-hover) !important;
|
|
border-color: var(--primary-solid-hover) !important;
|
|
box-shadow: var(--shadow-primary-md) !important;
|
|
transform: translateY(-1px);
|
|
}
|
|
|
|
/* 成功按钮 - 青绿 */
|
|
.el-button--success {
|
|
background: var(--success) !important;
|
|
border-color: var(--success) !important;
|
|
color: var(--bg) !important;
|
|
}
|
|
|
|
.el-button--success:hover {
|
|
background: #2DD4BF !important;
|
|
border-color: #2DD4BF !important;
|
|
box-shadow: 0 0 20px rgba(34, 197, 94, 0.3) !important;
|
|
}
|
|
|
|
/* 警告按钮 - 橙黄 */
|
|
.el-button--warning {
|
|
background: var(--warning) !important;
|
|
border-color: var(--warning) !important;
|
|
color: var(--bg) !important;
|
|
}
|
|
|
|
.el-button--warning:hover {
|
|
background: #FBBF24 !important;
|
|
border-color: #FBBF24 !important;
|
|
box-shadow: 0 0 20px rgba(245, 158, 11, 0.3) !important;
|
|
}
|
|
|
|
/* 危险按钮 - 粉红 */
|
|
.el-button--danger {
|
|
background: var(--danger) !important;
|
|
border-color: var(--danger) !important;
|
|
color: white !important;
|
|
}
|
|
|
|
.el-button--danger:hover {
|
|
background: #FCA5A5 !important;
|
|
border-color: #FCA5A5 !important;
|
|
box-shadow: 0 0 20px rgba(251, 113, 133, 0.3) !important;
|
|
}
|
|
|
|
/* 纯文字按钮 */
|
|
.el-button--text {
|
|
background: transparent !important;
|
|
border-color: transparent !important;
|
|
color: var(--primary) !important;
|
|
}
|
|
|
|
.el-button--text:hover {
|
|
color: var(--primary-hover) !important;
|
|
background: var(--primary-soft) !important;
|
|
}
|
|
|
|
/* -------------------- 卡片 -------------------- */
|
|
.el-card {
|
|
border: 1px solid var(--border) !important;
|
|
box-shadow: none !important;
|
|
background: var(--surface) !important;
|
|
border-radius: var(--radius-lg) !important;
|
|
}
|
|
|
|
.el-card:hover {
|
|
border-color: var(--border-light) !important;
|
|
}
|
|
|
|
.el-card__header {
|
|
border-bottom: 1px solid var(--border) !important;
|
|
padding: 16px 20px;
|
|
}
|
|
|
|
.el-card__body {
|
|
background: transparent !important;
|
|
padding: 20px;
|
|
}
|
|
|
|
/* -------------------- 表格 -------------------- */
|
|
.el-table {
|
|
border: 1px solid var(--border) !important;
|
|
background: var(--surface) !important;
|
|
border-radius: var(--radius-lg) !important;
|
|
--el-table-row-hover-bg-color: var(--surface-2);
|
|
--el-table-current-row-bg-color: var(--primary-soft);
|
|
--el-table-header-bg-color: var(--surface-2);
|
|
--el-table-tr-bg-color: var(--surface);
|
|
--el-table-expanded-cell-bg-color: var(--surface);
|
|
}
|
|
|
|
.el-table th.el-table__cell {
|
|
background: var(--surface-2) !important;
|
|
color: var(--text-secondary) !important;
|
|
border-bottom: 1px solid var(--border) !important;
|
|
font-weight: 600;
|
|
font-size: 13px;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
|
|
.el-table td.el-table__cell {
|
|
color: var(--text-primary) !important;
|
|
border-bottom: 1px solid var(--border) !important;
|
|
}
|
|
|
|
.el-table__border-left {
|
|
border-left: 1px solid var(--border) !important;
|
|
}
|
|
|
|
.el-table__border-right {
|
|
border-right: 1px solid var(--border) !important;
|
|
}
|
|
|
|
.el-table tr:hover > td {
|
|
background: var(--surface-2) !important;
|
|
}
|
|
|
|
.el-table__body tr.current-row > td.el-table__cell {
|
|
background: var(--primary-soft) !important;
|
|
}
|
|
|
|
/* 表格行选中左侧高亮条 */
|
|
.el-table__body tr.current-row > td.el-table__cell:first-child {
|
|
border-left: 3px solid var(--primary) !important;
|
|
}
|
|
|
|
/* -------------------- 复选框 -------------------- */
|
|
.el-checkbox__inner {
|
|
border: 1px solid var(--border) !important;
|
|
background: var(--surface-3) !important;
|
|
}
|
|
|
|
.el-checkbox__inner:hover {
|
|
border-color: var(--primary) !important;
|
|
}
|
|
|
|
.el-checkbox__input.is-checked .el-checkbox__inner {
|
|
background: var(--primary) !important;
|
|
border-color: var(--primary) !important;
|
|
}
|
|
|
|
.el-checkbox__input.is-disabled .el-checkbox__inner {
|
|
background: var(--el-disabled-bg) !important;
|
|
border-color: var(--el-disabled-border) !important;
|
|
}
|
|
|
|
/* -------------------- 分页 -------------------- */
|
|
.el-pagination button {
|
|
border: 1px solid var(--border) !important;
|
|
background: var(--surface) !important;
|
|
color: var(--text-secondary) !important;
|
|
border-radius: var(--radius-sm) !important;
|
|
}
|
|
|
|
.el-pagination button:hover {
|
|
background: var(--surface-2) !important;
|
|
border-color: var(--primary) !important;
|
|
color: var(--primary) !important;
|
|
}
|
|
|
|
.el-pagination button:disabled {
|
|
background: var(--surface) !important;
|
|
color: var(--text-muted) !important;
|
|
border-color: var(--border) !important;
|
|
}
|
|
|
|
.el-pager li {
|
|
background: var(--surface) !important;
|
|
color: var(--text-secondary) !important;
|
|
border: 1px solid var(--border) !important;
|
|
border-radius: var(--radius-sm) !important;
|
|
}
|
|
|
|
.el-pager li:hover {
|
|
color: var(--primary) !important;
|
|
border-color: var(--primary) !important;
|
|
}
|
|
|
|
.el-pager li.is-active {
|
|
background: var(--primary) !important;
|
|
color: var(--bg) !important;
|
|
border-color: var(--primary) !important;
|
|
font-weight: 600;
|
|
}
|
|
|
|
/* -------------------- 标签 -------------------- */
|
|
.el-tag {
|
|
border-radius: var(--radius-sm) !important;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.el-tag--primary {
|
|
background: var(--primary-soft) !important;
|
|
color: var(--primary) !important;
|
|
border-color: rgba(146, 124, 255, 0.3) !important;
|
|
}
|
|
|
|
.el-tag--success {
|
|
background: var(--success-soft) !important;
|
|
color: var(--success) !important;
|
|
border-color: rgba(34, 197, 94, 0.3) !important;
|
|
}
|
|
|
|
.el-tag--warning {
|
|
background: var(--warning-soft) !important;
|
|
color: var(--warning) !important;
|
|
border-color: rgba(245, 158, 11, 0.3) !important;
|
|
}
|
|
|
|
.el-tag--danger {
|
|
background: var(--danger-soft) !important;
|
|
color: var(--danger) !important;
|
|
border-color: rgba(251, 113, 133, 0.3) !important;
|
|
}
|
|
|
|
.el-tag--info {
|
|
background: var(--info-soft) !important;
|
|
color: var(--info) !important;
|
|
border-color: rgba(56, 189, 248, 0.3) !important;
|
|
}
|
|
|
|
/* -------------------- 评分 -------------------- */
|
|
.el-rate__icon {
|
|
color: var(--border) !important;
|
|
}
|
|
|
|
.el-rate__icon.hover {
|
|
color: var(--primary) !important;
|
|
}
|
|
|
|
/* -------------------- 对话框 -------------------- */
|
|
.el-dialog {
|
|
border: 1px solid var(--border) !important;
|
|
background: var(--surface) !important;
|
|
border-radius: var(--radius-lg) !important;
|
|
box-shadow: var(--shadow-xl) !important;
|
|
}
|
|
|
|
.el-dialog__header {
|
|
border-bottom: 1px solid var(--border) !important;
|
|
padding: 16px 20px;
|
|
margin: 0;
|
|
}
|
|
|
|
.el-dialog__title {
|
|
color: var(--text-primary) !important;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.el-dialog__body {
|
|
background: transparent !important;
|
|
color: var(--text-secondary) !important;
|
|
padding: 20px;
|
|
}
|
|
|
|
.el-dialog__footer {
|
|
border-top: 1px solid var(--border) !important;
|
|
padding: 16px 20px;
|
|
}
|
|
|
|
/* -------------------- 下拉菜单 -------------------- */
|
|
.el-dropdown-menu {
|
|
border: 1px solid var(--border) !important;
|
|
box-shadow: var(--shadow-lg) !important;
|
|
background: var(--surface) !important;
|
|
border-radius: var(--radius-md) !important;
|
|
}
|
|
|
|
.el-dropdown-menu__item {
|
|
color: var(--text-secondary) !important;
|
|
}
|
|
|
|
.el-dropdown-menu__item:hover {
|
|
background: var(--primary-soft) !important;
|
|
color: var(--primary) !important;
|
|
}
|
|
|
|
/* -------------------- 滚动条 -------------------- */
|
|
.el-scrollbar__wrap::-webkit-scrollbar {
|
|
width: 6px;
|
|
height: 6px;
|
|
}
|
|
|
|
.el-scrollbar__wrap::-webkit-scrollbar-thumb {
|
|
background: var(--border);
|
|
border-radius: var(--radius-sm);
|
|
}
|
|
|
|
.el-scrollbar__wrap::-webkit-scrollbar-thumb:hover {
|
|
background: var(--primary);
|
|
}
|
|
|
|
/* -------------------- 表单 -------------------- */
|
|
.el-form-item__label {
|
|
color: var(--text-secondary) !important;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.el-form-item__error {
|
|
color: var(--danger) !important;
|
|
}
|
|
|
|
/* -------------------- 消息提示 -------------------- */
|
|
.el-message {
|
|
border: 1px solid var(--border) !important;
|
|
box-shadow: var(--shadow-lg) !important;
|
|
background: var(--surface) !important;
|
|
border-radius: var(--radius-md) !important;
|
|
}
|
|
|
|
.el-message--success {
|
|
background: var(--surface) !important;
|
|
border-color: var(--success) !important;
|
|
color: var(--success) !important;
|
|
}
|
|
|
|
.el-message--error {
|
|
background: var(--surface) !important;
|
|
border-color: var(--danger) !important;
|
|
color: var(--danger) !important;
|
|
}
|
|
|
|
.el-message--warning {
|
|
background: var(--surface) !important;
|
|
border-color: var(--warning) !important;
|
|
color: var(--warning) !important;
|
|
}
|
|
|
|
.el-message--info {
|
|
background: var(--surface) !important;
|
|
border-color: var(--primary) !important;
|
|
color: var(--primary) !important;
|
|
}
|
|
|
|
/* -------------------- 消息盒子 -------------------- */
|
|
.el-message-box {
|
|
border: 1px solid var(--border) !important;
|
|
box-shadow: var(--shadow-xl) !important;
|
|
background: var(--surface) !important;
|
|
border-radius: var(--radius-lg) !important;
|
|
}
|
|
|
|
.el-message-box__header {
|
|
border-bottom: 1px solid var(--border) !important;
|
|
}
|
|
|
|
.el-message-box__title {
|
|
color: var(--text-primary) !important;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.el-message-box__content {
|
|
color: var(--text-secondary) !important;
|
|
}
|
|
|
|
.el-message-box__btns {
|
|
border-top: 1px solid var(--border) !important;
|
|
}
|
|
|
|
/* -------------------- 警告提示 -------------------- */
|
|
.el-alert {
|
|
border-radius: var(--radius-md) !important;
|
|
}
|
|
|
|
.el-alert--success {
|
|
background-color: var(--success-soft) !important;
|
|
border: 1px solid rgba(34, 197, 94, 0.3) !important;
|
|
color: var(--success) !important;
|
|
}
|
|
|
|
.el-alert--info {
|
|
background-color: var(--primary-soft) !important;
|
|
border: 1px solid rgba(146, 124, 255, 0.3) !important;
|
|
color: var(--primary) !important;
|
|
}
|
|
|
|
.el-alert--warning {
|
|
background-color: var(--warning-soft) !important;
|
|
border: 1px solid rgba(245, 158, 11, 0.3) !important;
|
|
color: var(--warning) !important;
|
|
}
|
|
|
|
.el-alert--error {
|
|
background-color: var(--danger-soft) !important;
|
|
border: 1px solid rgba(251, 113, 133, 0.3) !important;
|
|
color: var(--danger) !important;
|
|
}
|
|
|
|
/* -------------------- Switch 开关 -------------------- */
|
|
.theme-switch.el-switch .el-switch__core {
|
|
background: var(--surface-3);
|
|
border-color: var(--border);
|
|
}
|
|
|
|
.theme-switch.el-switch.is-checked .el-switch__core {
|
|
border-color: var(--primary) !important;
|
|
background-color: var(--primary) !important;
|
|
}
|
|
|
|
/* -------------------- 进度条 -------------------- */
|
|
.el-progress-bar__outer {
|
|
background-color: var(--surface-3) !important;
|
|
}
|
|
|
|
.el-progress-bar__inner {
|
|
background: var(--gradient-primary) !important;
|
|
}
|
|
|
|
.el-progress__text {
|
|
color: var(--text-secondary) !important;
|
|
}
|
|
|
|
/* -------------------- 菜单 -------------------- */
|
|
.el-menu {
|
|
background: transparent !important;
|
|
border-right: none !important;
|
|
}
|
|
|
|
.el-menu-item {
|
|
color: var(--text-secondary) !important;
|
|
border-radius: var(--radius-md);
|
|
margin: 4px 8px;
|
|
}
|
|
|
|
.el-menu-item:hover {
|
|
background: var(--surface-2) !important;
|
|
color: var(--primary) !important;
|
|
}
|
|
|
|
.el-menu-item.is-active {
|
|
background: var(--primary-soft) !important;
|
|
color: var(--primary) !important;
|
|
font-weight: 600;
|
|
}
|
|
|
|
/* -------------------- Tabs -------------------- */
|
|
.el-tabs__nav-wrap::after {
|
|
background-color: var(--border) !important;
|
|
}
|
|
|
|
.el-tabs__item {
|
|
color: var(--text-muted) !important;
|
|
}
|
|
|
|
.el-tabs__item:hover {
|
|
color: var(--primary) !important;
|
|
}
|
|
|
|
.el-tabs__item.is-active {
|
|
color: var(--primary) !important;
|
|
}
|
|
|
|
.el-tabs__active-bar {
|
|
background-color: var(--primary) !important;
|
|
}
|
|
|
|
/* -------------------- Tooltip -------------------- */
|
|
.el-tooltip__popper {
|
|
background: var(--surface-2) !important;
|
|
border: 1px solid var(--border) !important;
|
|
color: var(--text-primary) !important;
|
|
}
|