Mars
f9343b00af
API: - 新增 player-messages 域：充值审核通过/拒绝、Banner/公告推广消息，支持多语言模板 - 新增 presence 域：Redis 心跳在线状态，管理端可查询在线玩家数 - User 表增加 visible_menus 字段；新增 player_messages 表及迁移 - 充值审核通过/拒绝时按系统配置自动写入玩家站内消息 - 管理端新增 GET /deposit-orders/pending-count、GET /presence/online-count - 玩家端新增消息 CRUD、presence/ping、home 返回 inbox 开关配置 - 员工管理支持 visibleMenus 配置与删除保护（不能删自己/最后超管） - SystemConfig 增加 inbox 功能开关及各类通知开关 Admin: - 员工管理：按角色默认菜单 + 可勾选可见菜单项 - ManageLayout：按 visibleMenus 过滤侧栏；充值待审数量角标轮询 - Contents：富文本编辑器、图片字段组件重构 - DashboardPlayers：展示在线玩家数；AdminPlayerStatusCell 在线状态列 - 多页面 i18n 与权限细节调整 Player: - 站内邮箱中心（InboxHub）：消息列表/详情、未读角标、一键已读/删除 - 公告列表与详情页；走马灯可跳转详情 - 客服 Modal 改为 Panel，与邮箱 Hub 整合 - 充值状态轮询通知；presence 心跳；BetSlip 清空二次确认 - HomeView 今日赛事板块；FootballView 等体验优化 Shared: 新增 CANNOT_DELETE_SELF、STAFF_NOT_FOUND、MESSAGE_NOT_FOUND 等错误码 Docs: 玩家端缺失功能分析文档 Chore: 移除 .agents/skills 设计类 skill 文件 Co-authored-by: Cursor <cursoragent@cursor.com>
1902 lines
49 KiB
Vue
1902 lines
49 KiB
Vue
<script setup lang="ts">
|
||
import { computed, shallowRef, watch } from 'vue';
|
||
import { RouterView } from 'vue-router';
|
||
import { ElConfigProvider } from 'element-plus';
|
||
import type { Language } from 'element-plus/es/locale';
|
||
import { useAdminLocale } from './composables/useAdminLocale';
|
||
|
||
const { locale } = useAdminLocale();
|
||
const elLocale = shallowRef<Language | undefined>(undefined);
|
||
|
||
async function loadElLocale(tag: string) {
|
||
if (tag.startsWith('zh')) {
|
||
elLocale.value = (await import('element-plus/es/locale/lang/zh-cn')).default;
|
||
return;
|
||
}
|
||
if (tag.startsWith('ms')) {
|
||
elLocale.value = (await import('element-plus/es/locale/lang/ms')).default;
|
||
return;
|
||
}
|
||
elLocale.value = (await import('element-plus/es/locale/lang/en')).default;
|
||
}
|
||
|
||
watch(
|
||
() => locale.value,
|
||
(tag) => {
|
||
void loadElLocale(tag);
|
||
},
|
||
{ immediate: true },
|
||
);
|
||
|
||
const configLocale = computed(() => elLocale.value);
|
||
</script>
|
||
|
||
<template>
|
||
<ElConfigProvider :locale="configLocale">
|
||
<RouterView />
|
||
</ElConfigProvider>
|
||
</template>
|
||
|
||
<style>
|
||
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
||
a { color: inherit; text-decoration: none; }
|
||
button { cursor: pointer; font-family: inherit; }
|
||
|
||
:root {
|
||
/* Monochrome admin — 克制、无渐变、无品牌色泛滥 */
|
||
--accent: #f5f5f5;
|
||
--accent-muted: #a3a3a3;
|
||
--accent-dim: #737373;
|
||
--accent-subtle: rgba(255, 255, 255, 0.06);
|
||
--accent-border: rgba(255, 255, 255, 0.1);
|
||
--accent-hover: rgba(255, 255, 255, 0.04);
|
||
--accent-focus: rgba(255, 255, 255, 0.14);
|
||
/* 语义色：仅 success/warning/danger 场景使用 */
|
||
--success-text: #7d9b8a;
|
||
--success-bg: rgba(255, 255, 255, 0.04);
|
||
--success-border: rgba(255, 255, 255, 0.08);
|
||
/* 兼容旧变量名 → 中性灰白 */
|
||
--gold-deep: var(--accent-dim);
|
||
--gold-mid: var(--accent);
|
||
--gold-bright: var(--accent);
|
||
--gold-glow: var(--accent);
|
||
--gold-surface: var(--accent-subtle);
|
||
--gold-border: var(--accent-border);
|
||
--gold-text: var(--accent-muted);
|
||
--green-deep: var(--accent-dim);
|
||
--green-mid: var(--accent);
|
||
--green-bright: var(--accent);
|
||
--green-glow: var(--accent);
|
||
--green-surface: var(--accent-subtle);
|
||
--green-border: var(--accent-border);
|
||
--green-text: var(--accent-muted);
|
||
--primary: var(--accent);
|
||
--primary-dark: #e5e5e5;
|
||
--primary-light: #ffffff;
|
||
--primary-link: var(--accent-muted);
|
||
--primary-on: #0a0a0a;
|
||
--primary-grad: var(--accent);
|
||
--primary-grad-hover: #ffffff;
|
||
--primary-shadow: none;
|
||
--bg-body: #0a0a0a;
|
||
--bg-card: #111111;
|
||
--bg-elevated: #161616;
|
||
--bg-hover: var(--accent-hover);
|
||
--text: #f5f5f5;
|
||
--text-muted: #737373;
|
||
--border: rgba(255, 255, 255, 0.08);
|
||
--border-soft: var(--accent-border);
|
||
--radius: 8px;
|
||
--radius-sm: 6px;
|
||
--shadow: none;
|
||
|
||
/* Element Plus dark overrides */
|
||
--el-bg-color: #111111;
|
||
--el-bg-color-page: #0a0a0a;
|
||
--el-bg-color-overlay: #161616;
|
||
--el-text-color-primary: #f5f5f5;
|
||
--el-text-color-regular: #d4d4d4;
|
||
--el-text-color-secondary: #737373;
|
||
--el-text-color-placeholder:#525252;
|
||
--el-border-color: rgba(255, 255, 255, 0.08);
|
||
--el-border-color-light: rgba(255, 255, 255, 0.06);
|
||
--el-border-color-lighter: rgba(255, 255, 255, 0.04);
|
||
--el-fill-color: #141414;
|
||
--el-fill-color-blank: #0a0a0a;
|
||
--el-fill-color-light: #111111;
|
||
--el-color-primary: #e5e5e5;
|
||
--el-color-primary-light-3: rgba(255, 255, 255, 0.22);
|
||
--el-color-primary-light-5: rgba(255, 255, 255, 0.12);
|
||
--el-color-primary-light-7: rgba(255, 255, 255, 0.07);
|
||
--el-color-primary-light-9: rgba(255, 255, 255, 0.04);
|
||
--el-color-primary-dark-2: #a3a3a3;
|
||
--el-color-success: #7d9b8a;
|
||
--el-color-success-light-3: rgba(125, 155, 138, 0.22);
|
||
--el-color-success-light-5: rgba(125, 155, 138, 0.12);
|
||
--el-color-success-light-7: rgba(125, 155, 138, 0.07);
|
||
--el-color-success-light-9: rgba(125, 155, 138, 0.04);
|
||
--el-color-success-dark-2: #5c7568;
|
||
--el-table-bg-color: transparent;
|
||
--el-table-tr-bg-color: transparent;
|
||
--el-table-header-bg-color: transparent;
|
||
--el-table-row-hover-bg-color: rgba(255, 255, 255, 0.03);
|
||
--el-table-border-color: rgba(255, 255, 255, 0.06);
|
||
--el-table-text-color: #d4d4d4;
|
||
--el-table-header-text-color: #737373;
|
||
--el-card-bg-color: #111111;
|
||
--el-card-border-color: rgba(255, 255, 255, 0.08);
|
||
}
|
||
|
||
html, body, #app {
|
||
height: 100%;
|
||
overflow: hidden;
|
||
}
|
||
|
||
/* 页面级隐藏滚动条；可滚动区域保留细滚动条便于发现溢出内容 */
|
||
html, body {
|
||
scrollbar-width: none;
|
||
-ms-overflow-style: none;
|
||
}
|
||
html::-webkit-scrollbar,
|
||
body::-webkit-scrollbar {
|
||
width: 0;
|
||
height: 0;
|
||
display: none;
|
||
}
|
||
.admin-list-page .table-wrap,
|
||
.dashboard-page,
|
||
.page-scroll,
|
||
.settlement-page,
|
||
.nav {
|
||
scrollbar-width: thin;
|
||
scrollbar-color: rgba(255, 255, 255, 0.18) transparent;
|
||
}
|
||
.admin-list-page .table-wrap::-webkit-scrollbar,
|
||
.dashboard-page::-webkit-scrollbar,
|
||
.page-scroll::-webkit-scrollbar,
|
||
.settlement-page::-webkit-scrollbar,
|
||
.nav::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
display: block;
|
||
}
|
||
.admin-list-page .table-wrap::-webkit-scrollbar-thumb,
|
||
.dashboard-page::-webkit-scrollbar-thumb,
|
||
.page-scroll::-webkit-scrollbar-thumb,
|
||
.settlement-page::-webkit-scrollbar-thumb,
|
||
.nav::-webkit-scrollbar-thumb {
|
||
background: rgba(255, 255, 255, 0.16);
|
||
border-radius: 3px;
|
||
}
|
||
|
||
/* 管理端列表页：占满主区域，表头固定、表体滚动，底部分页 */
|
||
.admin-list-page {
|
||
display: flex;
|
||
flex-direction: column;
|
||
height: 100%;
|
||
min-height: 0;
|
||
overflow: hidden;
|
||
}
|
||
.admin-list-page > .page-toolbar,
|
||
.admin-list-page > .filter-card,
|
||
.admin-list-page > .tool-card,
|
||
.admin-list-page > .list-chrome,
|
||
.admin-list-page > .list-settings {
|
||
flex-shrink: 0;
|
||
}
|
||
.admin-list-page > .page-toolbar {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
gap: 8px;
|
||
margin: 0 0 8px;
|
||
}
|
||
.admin-list-page > .tool-card {
|
||
margin-bottom: 8px;
|
||
}
|
||
.admin-list-page > .filter-card {
|
||
margin-bottom: 8px;
|
||
}
|
||
.admin-list-page > .list-chrome {
|
||
margin-bottom: 8px;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6px;
|
||
}
|
||
.list-chrome__row {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
gap: 12px;
|
||
flex-wrap: nowrap;
|
||
padding: 8px 10px;
|
||
border-radius: 8px;
|
||
background: rgba(255, 255, 255, 0.02);
|
||
border: 1px solid rgba(255, 255, 255, 0.05);
|
||
--list-chrome-control-h: 32px;
|
||
--el-component-size: 32px;
|
||
}
|
||
.list-chrome__left {
|
||
display: flex;
|
||
align-items: center;
|
||
flex: 1;
|
||
min-width: 0;
|
||
gap: 12px;
|
||
flex-wrap: nowrap;
|
||
}
|
||
.list-chrome__filters {
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
gap: 8px 12px;
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
.list-chrome__field {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
flex-shrink: 0;
|
||
}
|
||
.list-chrome__label {
|
||
flex-shrink: 0;
|
||
font-size: 11px;
|
||
font-weight: 600;
|
||
color: var(--text-muted);
|
||
letter-spacing: 0.04em;
|
||
line-height: 1;
|
||
white-space: nowrap;
|
||
}
|
||
.list-chrome__grow {
|
||
flex: 1;
|
||
min-width: 0;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
align-items: center;
|
||
row-gap: 8px;
|
||
}
|
||
.list-chrome__grow.el-form--inline {
|
||
display: flex !important;
|
||
align-items: center;
|
||
}
|
||
.list-chrome__left .matches-subnav--embedded {
|
||
align-self: center;
|
||
}
|
||
.list-chrome__actions {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
flex-shrink: 0;
|
||
}
|
||
.list-chrome :deep(.el-form-item) {
|
||
margin-bottom: 0 !important;
|
||
margin-right: 12px;
|
||
display: inline-flex;
|
||
align-items: center;
|
||
vertical-align: middle;
|
||
}
|
||
.list-chrome :deep(.el-form-item__label) {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
height: var(--list-chrome-control-h);
|
||
line-height: 1;
|
||
padding: 0 8px 0 0;
|
||
margin-bottom: 0 !important;
|
||
}
|
||
.list-chrome :deep(.el-form-item__content) {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
line-height: 1;
|
||
}
|
||
.list-chrome :deep(.el-input__wrapper),
|
||
.list-chrome :deep(.el-select__wrapper) {
|
||
height: var(--list-chrome-control-h) !important;
|
||
min-height: var(--list-chrome-control-h) !important;
|
||
box-sizing: border-box;
|
||
padding-top: 0;
|
||
padding-bottom: 0;
|
||
}
|
||
.list-chrome :deep(.el-input__inner) {
|
||
height: calc(var(--list-chrome-control-h) - 2px);
|
||
line-height: calc(var(--list-chrome-control-h) - 2px);
|
||
}
|
||
.list-chrome :deep(.el-button:not(.is-link)) {
|
||
height: var(--list-chrome-control-h) !important;
|
||
min-height: var(--list-chrome-control-h) !important;
|
||
padding-top: 0 !important;
|
||
padding-bottom: 0 !important;
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
box-sizing: border-box;
|
||
line-height: 1;
|
||
}
|
||
.list-chrome :deep(.el-form-item:last-child) {
|
||
margin-right: 0;
|
||
}
|
||
.admin-list-page > .list-settings {
|
||
margin-bottom: 8px;
|
||
}
|
||
.list-settings :deep(.el-collapse-item__header) {
|
||
height: 36px;
|
||
line-height: 36px;
|
||
padding: 0 10px;
|
||
font-size: 13px;
|
||
font-weight: 600;
|
||
background: rgba(255, 255, 255, 0.02);
|
||
border-color: rgba(255, 255, 255, 0.05);
|
||
}
|
||
.list-settings :deep(.el-collapse-item__wrap) {
|
||
border-color: rgba(255, 255, 255, 0.05);
|
||
}
|
||
.list-settings :deep(.el-collapse-item__content) {
|
||
padding: 8px 10px 10px;
|
||
}
|
||
.list-settings-block + .list-settings-block {
|
||
margin-top: 8px;
|
||
padding-top: 8px;
|
||
border-top: 1px solid rgba(255, 255, 255, 0.05);
|
||
}
|
||
.list-settings-title {
|
||
font-size: 12px;
|
||
font-weight: 600;
|
||
color: #aaa;
|
||
margin-bottom: 6px;
|
||
}
|
||
.admin-list-page > .data-card,
|
||
.admin-list-page > .list-panel {
|
||
flex: 1;
|
||
min-height: 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
border-radius: 10px;
|
||
}
|
||
.admin-list-page > .list-panel {
|
||
border: 1px solid var(--border);
|
||
background: var(--bg-card);
|
||
padding: 0 10px 10px;
|
||
}
|
||
.admin-list-page > .data-card .el-card__body {
|
||
flex: 1;
|
||
min-height: 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
padding: 0 12px 12px;
|
||
}
|
||
.admin-list-page .table-wrap {
|
||
flex: 1;
|
||
min-height: 0;
|
||
overflow: auto;
|
||
}
|
||
.admin-list-page .table-wrap .el-table {
|
||
height: 100% !important;
|
||
}
|
||
.admin-list-page .table-wrap .el-table th.el-table__cell .cell {
|
||
white-space: nowrap;
|
||
}
|
||
.admin-list-page .table-wrap.is-compact-row-actions .admin-responsive-actions__inline {
|
||
display: none !important;
|
||
}
|
||
.admin-list-page .table-wrap.is-compact-row-actions .admin-responsive-actions__menu {
|
||
display: inline-flex !important;
|
||
}
|
||
.admin-list-page .table-wrap:not(.is-compact-row-actions) .admin-responsive-actions__menu {
|
||
display: none !important;
|
||
}
|
||
.admin-list-page .list-hint {
|
||
flex-shrink: 0;
|
||
margin: 0;
|
||
padding: 6px 0 8px;
|
||
font-size: 11px;
|
||
color: #666;
|
||
line-height: 1.4;
|
||
}
|
||
.admin-list-page .pager {
|
||
flex-shrink: 0;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
margin-top: 8px;
|
||
padding-top: 0;
|
||
}
|
||
|
||
/* 控制台等非列表页：允许内部滚动（滚动条已全局隐藏） */
|
||
.dashboard-page,
|
||
.page-scroll {
|
||
height: 100%;
|
||
min-height: 0;
|
||
overflow-y: auto;
|
||
overflow-x: hidden;
|
||
}
|
||
|
||
body {
|
||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
|
||
background: var(--bg-body);
|
||
color: var(--text);
|
||
-webkit-font-smoothing: antialiased;
|
||
-moz-osx-font-smoothing: grayscale;
|
||
}
|
||
|
||
/* ── Element Plus 全局暗色覆盖 ── */
|
||
.el-card {
|
||
background: var(--bg-card) !important;
|
||
border-color: var(--border) !important;
|
||
border-radius: var(--radius) !important;
|
||
box-shadow: none !important;
|
||
}
|
||
.el-card__header {
|
||
border-bottom-color: var(--border) !important;
|
||
color: var(--text-muted);
|
||
font-size: 12px;
|
||
font-weight: 500;
|
||
letter-spacing: 0;
|
||
text-transform: none;
|
||
}
|
||
|
||
.el-table { background: transparent !important; color: #ccc !important; }
|
||
.el-table::before { background-color: #222 !important; }
|
||
.el-table th.el-table__cell {
|
||
background: transparent !important;
|
||
color: var(--text-muted) !important;
|
||
font-size: 12px; font-weight: 500;
|
||
letter-spacing: 0; text-transform: none;
|
||
border-bottom-color: var(--border) !important;
|
||
}
|
||
.el-table td.el-table__cell { border-bottom-color: rgba(255, 255, 255, 0.04) !important; color: #d4d4d4 !important; }
|
||
.el-table--striped .el-table__body tr.el-table__row--striped td { background: rgba(255,255,255,0.015) !important; }
|
||
.el-table__body tr:hover > td { background: rgba(255, 255, 255, 0.03) !important; }
|
||
|
||
.el-input__wrapper {
|
||
background: var(--bg-body) !important;
|
||
box-shadow: 0 0 0 1px var(--border) inset !important;
|
||
border-radius: var(--radius-sm) !important;
|
||
}
|
||
.el-input__wrapper:hover { box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.14) inset !important; }
|
||
.el-input__wrapper.is-focus {
|
||
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.28) inset !important;
|
||
}
|
||
.el-input__inner { color: #fff !important; background: transparent !important; }
|
||
.el-input__inner:-webkit-autofill,
|
||
.el-input__inner:-webkit-autofill:focus {
|
||
-webkit-box-shadow: 0 0 0 1000px #0d0d0d inset !important;
|
||
-webkit-text-fill-color: #fff !important;
|
||
}
|
||
|
||
.el-button { background: transparent !important; border-color: var(--border) !important; color: #a3a3a3 !important; font-weight: 500 !important; transition: background 0.15s, border-color 0.15s, color 0.15s !important; }
|
||
.el-button:hover { background: var(--accent-hover) !important; border-color: rgba(255, 255, 255, 0.14) !important; color: #f5f5f5 !important; }
|
||
.el-button--primary {
|
||
background: var(--accent) !important;
|
||
border: 1px solid var(--accent) !important;
|
||
color: var(--primary-on) !important;
|
||
font-weight: 500 !important;
|
||
box-shadow: none !important;
|
||
}
|
||
.el-button--primary:hover {
|
||
background: #ffffff !important;
|
||
border-color: #ffffff !important;
|
||
color: var(--primary-on) !important;
|
||
box-shadow: none !important;
|
||
}
|
||
.el-button--success {
|
||
background: transparent !important;
|
||
border: 1px solid var(--success-border) !important;
|
||
color: var(--success-text) !important;
|
||
font-weight: 500 !important;
|
||
box-shadow: none !important;
|
||
}
|
||
.el-button--success:hover {
|
||
background: var(--success-bg) !important;
|
||
border-color: rgba(255, 255, 255, 0.12) !important;
|
||
color: #a8c4b4 !important;
|
||
box-shadow: none !important;
|
||
}
|
||
.el-button--warning {
|
||
background: transparent !important;
|
||
border: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||
color: #d4a574 !important;
|
||
font-weight: 500 !important;
|
||
box-shadow: none !important;
|
||
}
|
||
.el-button--warning:hover {
|
||
background: rgba(255, 255, 255, 0.04) !important;
|
||
border-color: rgba(255, 255, 255, 0.14) !important;
|
||
color: #e0b888 !important;
|
||
box-shadow: none !important;
|
||
}
|
||
.el-button--danger { background: transparent !important; border-color: rgba(255,69,58,0.25) !important; color: #ef4444 !important; }
|
||
|
||
/* ── Disabled: muted ghost, clearly non-interactive ── */
|
||
.el-button.is-disabled,
|
||
.el-button.is-disabled:hover,
|
||
.el-button.is-disabled:focus,
|
||
.el-button:disabled {
|
||
cursor: not-allowed !important;
|
||
pointer-events: none;
|
||
transform: none !important;
|
||
filter: none;
|
||
box-shadow: none !important;
|
||
text-shadow: none !important;
|
||
opacity: 1 !important;
|
||
}
|
||
|
||
.el-button.is-disabled,
|
||
.el-button.is-disabled:hover,
|
||
.el-button:disabled {
|
||
background: rgba(255, 255, 255, 0.04) !important;
|
||
border-color: rgba(255, 255, 255, 0.08) !important;
|
||
color: rgba(255, 255, 255, 0.28) !important;
|
||
}
|
||
|
||
.el-button--primary.is-disabled,
|
||
.el-button--primary.is-disabled:hover,
|
||
.el-button--primary:disabled {
|
||
background: rgba(255, 255, 255, 0.06) !important;
|
||
border-color: rgba(255, 255, 255, 0.06) !important;
|
||
color: rgba(255, 255, 255, 0.28) !important;
|
||
}
|
||
|
||
.el-button--primary.is-plain.is-disabled,
|
||
.el-button--primary.is-plain.is-disabled:hover,
|
||
.el-button--primary.is-plain:disabled {
|
||
background: transparent !important;
|
||
border-color: rgba(255, 255, 255, 0.06) !important;
|
||
color: rgba(255, 255, 255, 0.24) !important;
|
||
}
|
||
|
||
.el-button--success.is-disabled,
|
||
.el-button--success.is-disabled:hover,
|
||
.el-button--success:disabled {
|
||
background: transparent !important;
|
||
border-color: rgba(255, 255, 255, 0.06) !important;
|
||
color: rgba(255, 255, 255, 0.24) !important;
|
||
}
|
||
|
||
.el-button--warning.is-disabled,
|
||
.el-button--warning.is-disabled:hover,
|
||
.el-button--warning:disabled {
|
||
background: rgba(196, 132, 18, 0.1) !important;
|
||
border-color: rgba(196, 132, 18, 0.14) !important;
|
||
color: rgba(251, 191, 36, 0.28) !important;
|
||
}
|
||
|
||
.el-button--danger.is-plain.is-disabled,
|
||
.el-button--danger.is-plain.is-disabled:hover,
|
||
.el-button--danger.is-plain:disabled {
|
||
background: rgba(255, 69, 58, 0.06) !important;
|
||
border-color: rgba(255, 69, 58, 0.1) !important;
|
||
color: rgba(255, 107, 98, 0.28) !important;
|
||
}
|
||
|
||
.el-button--danger.is-disabled,
|
||
.el-button--danger.is-disabled:hover,
|
||
.el-button--danger:disabled {
|
||
background: rgba(255, 69, 58, 0.06) !important;
|
||
border-color: rgba(255, 69, 58, 0.1) !important;
|
||
color: rgba(255, 107, 98, 0.28) !important;
|
||
}
|
||
.el-button--primary.is-plain {
|
||
background: transparent !important;
|
||
border-color: var(--border) !important;
|
||
color: #d4d4d4 !important;
|
||
box-shadow: none !important;
|
||
}
|
||
.el-button--primary.is-plain:hover {
|
||
background: var(--accent-hover) !important;
|
||
border-color: rgba(255, 255, 255, 0.14) !important;
|
||
color: #f5f5f5 !important;
|
||
}
|
||
.el-button--danger.is-plain {
|
||
background: rgba(255, 69, 58, 0.14) !important;
|
||
border-color: rgba(255, 69, 58, 0.45) !important;
|
||
color: #ff6b62 !important;
|
||
font-weight: 600 !important;
|
||
box-shadow: none !important;
|
||
}
|
||
.el-button--danger.is-plain:hover {
|
||
background: rgba(255, 69, 58, 0.24) !important;
|
||
border-color: rgba(255, 120, 110, 0.55) !important;
|
||
color: #ff9a92 !important;
|
||
}
|
||
.el-button.is-text,
|
||
.el-button.is-link.el-button--default {
|
||
color: var(--accent-muted) !important;
|
||
background: transparent !important;
|
||
border-color: transparent !important;
|
||
box-shadow: none !important;
|
||
}
|
||
.el-button.is-text:hover,
|
||
.el-button.is-link.el-button--default:hover {
|
||
color: #f5f5f5 !important;
|
||
background: transparent !important;
|
||
}
|
||
|
||
.el-tag { border-radius: 4px !important; font-size: 11px !important; font-weight: 500 !important; }
|
||
.el-tag--success {
|
||
background: var(--success-bg) !important;
|
||
border: 1px solid var(--success-border) !important;
|
||
color: var(--success-text) !important;
|
||
}
|
||
.el-tag--warning { background: rgba(251,191,36,0.1) !important; border-color: rgba(251,191,36,0.3) !important; color: #fbbf24 !important; }
|
||
.el-tag--danger { background: rgba(255,69,58,0.1) !important; border-color: rgba(255,69,58,0.3) !important; color: #ff453a !important; }
|
||
.el-tag--info { background: rgba(255,255,255,0.06) !important; border-color: #3a3a3a !important; color: #aaa !important; }
|
||
|
||
/* 表格操作：纯文字链 */
|
||
.el-button.is-link.el-button--primary,
|
||
.el-button.is-link.el-button--success {
|
||
color: var(--accent-muted) !important;
|
||
background: transparent !important;
|
||
border: none !important;
|
||
border-radius: 0 !important;
|
||
padding: 0 4px !important;
|
||
box-shadow: none !important;
|
||
font-weight: 500 !important;
|
||
}
|
||
.el-button.is-link.el-button--primary:hover,
|
||
.el-button.is-link.el-button--primary:focus,
|
||
.el-button.is-link.el-button--success:hover,
|
||
.el-button.is-link.el-button--success:focus {
|
||
color: #f5f5f5 !important;
|
||
background: transparent !important;
|
||
border: none !important;
|
||
box-shadow: none !important;
|
||
text-decoration: underline;
|
||
text-underline-offset: 3px;
|
||
}
|
||
.el-button.is-link.el-button--warning {
|
||
color: #a3a3a3 !important;
|
||
background: transparent !important;
|
||
border: none !important;
|
||
border-radius: 0 !important;
|
||
padding: 0 4px !important;
|
||
box-shadow: none !important;
|
||
font-weight: 500 !important;
|
||
}
|
||
.el-button.is-link.el-button--warning:hover,
|
||
.el-button.is-link.el-button--warning:focus {
|
||
color: #d4a574 !important;
|
||
background: transparent !important;
|
||
border: none !important;
|
||
box-shadow: none !important;
|
||
text-decoration: underline;
|
||
text-underline-offset: 3px;
|
||
}
|
||
|
||
/* 表格 link 操作按钮禁用：保留按钮形态，灰显不可点 */
|
||
.el-button.is-link.is-disabled,
|
||
.el-button.is-link.is-disabled:hover,
|
||
.el-button.is-link.is-disabled:focus,
|
||
.el-button.is-link:disabled {
|
||
cursor: not-allowed !important;
|
||
pointer-events: none;
|
||
background: rgba(255, 255, 255, 0.04) !important;
|
||
border: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||
color: rgba(255, 255, 255, 0.28) !important;
|
||
box-shadow: none !important;
|
||
text-shadow: none !important;
|
||
opacity: 1 !important;
|
||
transform: none !important;
|
||
filter: none;
|
||
}
|
||
|
||
.el-button.is-link.el-button--primary.is-disabled,
|
||
.el-button.is-link.el-button--success.is-disabled {
|
||
background: transparent !important;
|
||
border: none !important;
|
||
color: rgba(255, 255, 255, 0.24) !important;
|
||
text-decoration: none !important;
|
||
}
|
||
|
||
.el-button.is-link.el-button--danger.is-disabled {
|
||
background: rgba(255, 69, 58, 0.06) !important;
|
||
border-color: rgba(255, 69, 58, 0.1) !important;
|
||
color: rgba(255, 107, 98, 0.26) !important;
|
||
}
|
||
|
||
.el-button.is-link.el-button--warning.is-disabled {
|
||
background: rgba(196, 132, 18, 0.08) !important;
|
||
border-color: rgba(196, 132, 18, 0.12) !important;
|
||
color: rgba(251, 191, 36, 0.26) !important;
|
||
}
|
||
|
||
.el-form-item__label { color: var(--text-muted) !important; font-size: 13px !important; font-weight: 500 !important; letter-spacing: 0 !important; }
|
||
|
||
/* ── Dialog / overlay：实心背景，避免噪点透底发糊 ── */
|
||
.el-overlay {
|
||
background-color: rgba(0, 0, 0, 0.72) !important;
|
||
backdrop-filter: none !important;
|
||
}
|
||
.el-dialog {
|
||
background: #141414 !important;
|
||
border: 1px solid var(--border) !important;
|
||
border-radius: var(--radius) !important;
|
||
box-shadow: 0 24px 48px rgba(0, 0, 0, 0.5) !important;
|
||
}
|
||
.el-dialog__header {
|
||
border-bottom: 1px solid #2a2a2a !important;
|
||
padding: 16px 20px 14px !important;
|
||
margin-right: 0 !important;
|
||
}
|
||
.el-dialog__title {
|
||
font-size: 16px !important;
|
||
font-weight: 700 !important;
|
||
color: #f0f0f0 !important;
|
||
letter-spacing: 0.02em !important;
|
||
}
|
||
.el-dialog__headerbtn .el-dialog__close {
|
||
color: #888 !important;
|
||
}
|
||
.el-dialog__headerbtn:hover .el-dialog__close {
|
||
color: #fff !important;
|
||
}
|
||
.el-dialog__body {
|
||
padding: 18px 20px !important;
|
||
font-size: 14px !important;
|
||
color: #ddd !important;
|
||
}
|
||
.el-dialog__footer {
|
||
border-top: 1px solid #2a2a2a !important;
|
||
padding: 12px 20px 16px !important;
|
||
}
|
||
.el-dialog .el-form-item__label {
|
||
font-size: 13px !important;
|
||
color: #aaa !important;
|
||
}
|
||
.el-dialog .el-descriptions__label {
|
||
color: #888 !important;
|
||
font-size: 12px !important;
|
||
font-weight: 600 !important;
|
||
background: #141414 !important;
|
||
}
|
||
.el-dialog .el-descriptions__content {
|
||
color: #e0e0e0 !important;
|
||
font-size: 13px !important;
|
||
background: #1a1a1a !important;
|
||
}
|
||
.el-dialog .el-descriptions__cell {
|
||
border-color: #2a2a2a !important;
|
||
}
|
||
.user-edit-dialog .el-dialog__body,
|
||
.agent-edit-dialog .el-dialog__body {
|
||
max-height: min(70vh, 640px);
|
||
overflow-y: auto;
|
||
}
|
||
|
||
.user-edit-dialog .edit-meta,
|
||
.agent-edit-dialog .edit-meta {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-bottom: 12px;
|
||
font-size: 12px;
|
||
color: #888;
|
||
}
|
||
.user-edit-dialog .edit-form-section,
|
||
.agent-edit-dialog .edit-form-section {
|
||
margin-bottom: 12px;
|
||
}
|
||
.user-edit-dialog .edit-form-section:last-child,
|
||
.agent-edit-dialog .edit-form-section:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
.user-edit-dialog .section-title,
|
||
.agent-edit-dialog .section-title {
|
||
font-size: 11px;
|
||
font-weight: 700;
|
||
color: #888;
|
||
letter-spacing: 0.04em;
|
||
margin-bottom: 8px;
|
||
}
|
||
.user-edit-dialog .compact-edit-form .el-form-item,
|
||
.agent-edit-dialog .compact-edit-form .el-form-item {
|
||
margin-bottom: 10px;
|
||
}
|
||
.user-edit-dialog .field-hint,
|
||
.agent-edit-dialog .field-hint {
|
||
font-size: 12px;
|
||
color: #888;
|
||
margin-top: 4px;
|
||
line-height: 1.4;
|
||
}
|
||
.user-edit-dialog .inline-hint,
|
||
.agent-edit-dialog .inline-hint {
|
||
margin-top: 0;
|
||
}
|
||
.user-edit-dialog .password-mgmt-block,
|
||
.agent-edit-dialog .password-mgmt-block {
|
||
margin: 0;
|
||
padding: 10px 12px;
|
||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||
border-radius: 8px;
|
||
background: rgba(0, 0, 0, 0.15);
|
||
}
|
||
.user-edit-dialog .block-title,
|
||
.agent-edit-dialog .block-title {
|
||
font-size: 12px;
|
||
font-weight: 700;
|
||
color: #e8a84a;
|
||
margin-bottom: 8px;
|
||
letter-spacing: 0.04em;
|
||
}
|
||
.user-edit-dialog .password-field-row,
|
||
.agent-edit-dialog .password-field-row {
|
||
display: grid;
|
||
grid-template-columns: 72px minmax(0, 1fr);
|
||
gap: 8px 10px;
|
||
align-items: center;
|
||
margin-bottom: 8px;
|
||
}
|
||
.user-edit-dialog .password-field-row:last-child,
|
||
.agent-edit-dialog .password-field-row:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
.user-edit-dialog .password-field-label,
|
||
.agent-edit-dialog .password-field-label {
|
||
font-size: 12px;
|
||
color: #888;
|
||
line-height: 1.35;
|
||
}
|
||
.user-edit-dialog .password-plain,
|
||
.agent-edit-dialog .password-plain {
|
||
font-family: ui-monospace, monospace;
|
||
font-size: 14px;
|
||
font-weight: 600;
|
||
color: #f0d090;
|
||
letter-spacing: 0.06em;
|
||
}
|
||
.user-edit-dialog .password-empty,
|
||
.agent-edit-dialog .password-empty {
|
||
color: #666;
|
||
}
|
||
.user-edit-dialog .block-hint,
|
||
.agent-edit-dialog .block-hint {
|
||
margin: -2px 0 8px;
|
||
padding-left: 82px;
|
||
}
|
||
.user-edit-dialog .cashback-edit-block,
|
||
.agent-edit-dialog .cashback-edit-block {
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
gap: 8px 10px;
|
||
}
|
||
.user-edit-dialog .contact-row,
|
||
.agent-edit-dialog .contact-row {
|
||
margin-bottom: 0;
|
||
}
|
||
.user-edit-dialog .contact-row .el-form-item,
|
||
.agent-edit-dialog .contact-row .el-form-item {
|
||
margin-bottom: 0;
|
||
}
|
||
.user-edit-dialog .edit-stats-panel,
|
||
.agent-edit-dialog .edit-stats-panel {
|
||
margin-top: 14px;
|
||
padding-top: 12px;
|
||
border-top: 1px solid rgba(255, 255, 255, 0.06);
|
||
}
|
||
.agent-edit-dialog .edit-stats {
|
||
margin-top: 4px;
|
||
}
|
||
|
||
.entity-detail-dialog .el-dialog__body {
|
||
padding: 12px 20px 16px !important;
|
||
max-height: none !important;
|
||
overflow: visible !important;
|
||
}
|
||
|
||
.detail-actions {
|
||
margin-top: 10px;
|
||
padding-top: 10px;
|
||
border-top: 1px solid rgba(255, 255, 255, 0.06);
|
||
}
|
||
|
||
.el-statistic__head { color: #737373 !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0 !important; text-transform: none !important; }
|
||
.el-statistic__content .el-statistic__number { font-size: 24px !important; font-weight: 500 !important; color: #f5f5f5 !important; }
|
||
|
||
.el-input-number .el-input__wrapper { background: #0d0d0d !important; }
|
||
.el-date-editor .el-input__wrapper { background: #0d0d0d !important; }
|
||
.el-date-editor .el-input__inner { color: #fff !important; }
|
||
.el-picker-panel {
|
||
background: #1c1c1c !important;
|
||
border-color: #333 !important;
|
||
color: #ddd !important;
|
||
}
|
||
.el-picker-panel__footer { background: #1c1c1c !important; border-top-color: #333 !important; }
|
||
.el-date-picker__header-label,
|
||
.el-date-table th,
|
||
.el-date-table td .el-date-table-cell__text { color: #ccc !important; }
|
||
.el-time-panel { background: #1c1c1c !important; border-color: #333 !important; }
|
||
.el-time-spinner__item { color: #aaa !important; }
|
||
.el-time-spinner__item.is-active:not(.is-disabled) { color: #fff !important; }
|
||
|
||
/* ──────────────────────────────────────────────────────────────
|
||
Admin light refresh
|
||
The legacy admin theme was built as one dark surface. These
|
||
overrides intentionally keep the current component system while
|
||
giving every page clearer hierarchy, calmer colors and stronger
|
||
table/form affordance.
|
||
────────────────────────────────────────────────────────────── */
|
||
:root {
|
||
--accent: #1f2320;
|
||
--accent-muted: #5f5b53;
|
||
--accent-dim: #8c867c;
|
||
--accent-subtle: #f0ede6;
|
||
--accent-border: #ded8cc;
|
||
--accent-hover: #f5f2eb;
|
||
--accent-focus: rgba(31, 35, 32, 0.16);
|
||
|
||
--success-text: #346538;
|
||
--success-bg: #edf3ec;
|
||
--success-border: #d6e3d4;
|
||
--warning-text: #956400;
|
||
--warning-bg: #fbf3db;
|
||
--warning-border: #eadcad;
|
||
--danger-text: #9f2f2d;
|
||
--danger-bg: #fdebec;
|
||
--danger-border: #f3c5c7;
|
||
--info-text: #1f6c9f;
|
||
--info-bg: #e1f3fe;
|
||
--info-border: #c7e4f6;
|
||
|
||
--gold-deep: var(--warning-text);
|
||
--gold-mid: #b88928;
|
||
--gold-bright: #8f6a18;
|
||
--gold-glow: #8f6a18;
|
||
--gold-surface: var(--warning-bg);
|
||
--gold-border: var(--warning-border);
|
||
--gold-text: var(--warning-text);
|
||
--green-deep: var(--success-text);
|
||
--green-mid: #477a4c;
|
||
--green-bright: #346538;
|
||
--green-glow: #346538;
|
||
--green-surface: var(--success-bg);
|
||
--green-border: var(--success-border);
|
||
--green-text: var(--success-text);
|
||
|
||
--primary: #1f2320;
|
||
--primary-dark: #111411;
|
||
--primary-light: #363a35;
|
||
--primary-link: #1f6c9f;
|
||
--primary-on: #ffffff;
|
||
--primary-grad: #1f2320;
|
||
--primary-grad-hover: #363a35;
|
||
--primary-shadow: none;
|
||
|
||
--bg-body: #f7f6f3;
|
||
--bg-card: #ffffff;
|
||
--bg-elevated: #fbfbfa;
|
||
--bg-hover: #f1eee8;
|
||
--text: #1f2320;
|
||
--text-muted: #78746b;
|
||
--border: #e7e2d8;
|
||
--border-soft: #f0ece4;
|
||
--radius: 8px;
|
||
--radius-sm: 6px;
|
||
--shadow: 0 8px 28px rgba(56, 49, 37, 0.05);
|
||
|
||
--el-bg-color: #ffffff;
|
||
--el-bg-color-page: #f7f6f3;
|
||
--el-bg-color-overlay: #ffffff;
|
||
--el-text-color-primary: #1f2320;
|
||
--el-text-color-regular: #3d413b;
|
||
--el-text-color-secondary: #78746b;
|
||
--el-text-color-placeholder:#aaa49a;
|
||
--el-border-color: #e7e2d8;
|
||
--el-border-color-light: #eee9df;
|
||
--el-border-color-lighter: #f4f0e8;
|
||
--el-fill-color: #f8f6f1;
|
||
--el-fill-color-blank: #ffffff;
|
||
--el-fill-color-light: #fbfaf7;
|
||
--el-color-primary: #1f2320;
|
||
--el-color-primary-light-3: #5d635c;
|
||
--el-color-primary-light-5: #8d938b;
|
||
--el-color-primary-light-7: #d9ddd6;
|
||
--el-color-primary-light-9: #f4f6f2;
|
||
--el-color-primary-dark-2: #111411;
|
||
--el-color-success: var(--success-text);
|
||
--el-color-success-light-9: var(--success-bg);
|
||
--el-color-warning: var(--warning-text);
|
||
--el-color-warning-light-9: var(--warning-bg);
|
||
--el-color-danger: var(--danger-text);
|
||
--el-color-danger-light-9: var(--danger-bg);
|
||
--el-color-info: var(--info-text);
|
||
--el-color-info-light-9: var(--info-bg);
|
||
--el-table-bg-color: #ffffff;
|
||
--el-table-tr-bg-color: #ffffff;
|
||
--el-table-header-bg-color: #fbfaf7;
|
||
--el-table-row-hover-bg-color: #f7f4ee;
|
||
--el-table-border-color: #eee9df;
|
||
--el-table-text-color: #363a35;
|
||
--el-table-header-text-color: #6c675f;
|
||
--el-card-bg-color: #ffffff;
|
||
--el-card-border-color: #e7e2d8;
|
||
color-scheme: light;
|
||
}
|
||
|
||
html,
|
||
body,
|
||
#app {
|
||
background: var(--bg-body) !important;
|
||
color: var(--text) !important;
|
||
}
|
||
|
||
body {
|
||
font-family: 'SF Pro Display', 'Geist Sans', 'Helvetica Neue', 'PingFang SC',
|
||
'Microsoft YaHei', Arial, sans-serif;
|
||
font-variant-numeric: tabular-nums;
|
||
}
|
||
|
||
button,
|
||
input,
|
||
textarea,
|
||
select {
|
||
font-family: inherit;
|
||
}
|
||
|
||
*:focus-visible {
|
||
outline: 2px solid rgba(31, 35, 32, 0.28);
|
||
outline-offset: 2px;
|
||
}
|
||
|
||
::-webkit-scrollbar {
|
||
width: 10px;
|
||
height: 10px;
|
||
}
|
||
|
||
::-webkit-scrollbar-track {
|
||
background: transparent;
|
||
}
|
||
|
||
::-webkit-scrollbar-thumb {
|
||
background: #d5cfc3;
|
||
border: 3px solid transparent;
|
||
border-radius: 999px;
|
||
background-clip: padding-box;
|
||
}
|
||
|
||
::-webkit-scrollbar-thumb:hover {
|
||
background: #bdb6a9;
|
||
border: 3px solid transparent;
|
||
background-clip: padding-box;
|
||
}
|
||
|
||
* {
|
||
scrollbar-color: #d5cfc3 transparent;
|
||
}
|
||
|
||
a {
|
||
color: var(--primary-link);
|
||
}
|
||
|
||
.el-card {
|
||
border: 1px solid var(--border) !important;
|
||
border-radius: var(--radius) !important;
|
||
background: var(--bg-card) !important;
|
||
box-shadow: var(--shadow) !important;
|
||
color: var(--text) !important;
|
||
}
|
||
|
||
.el-card__header {
|
||
border-bottom: 1px solid var(--border-soft) !important;
|
||
padding: 14px 18px !important;
|
||
}
|
||
|
||
.el-card__body {
|
||
color: var(--text) !important;
|
||
}
|
||
|
||
.el-table {
|
||
border-radius: var(--radius) !important;
|
||
background: #ffffff !important;
|
||
color: #363a35 !important;
|
||
font-size: 13px;
|
||
--el-table-border-color: var(--border-soft);
|
||
}
|
||
|
||
.el-table::before,
|
||
.el-table__inner-wrapper::before {
|
||
background: var(--border-soft) !important;
|
||
}
|
||
|
||
.el-table th.el-table__cell {
|
||
height: 42px;
|
||
background: #fbfaf7 !important;
|
||
border-bottom: 1px solid var(--border) !important;
|
||
color: #6c675f !important;
|
||
font-size: 12px;
|
||
font-weight: 700;
|
||
letter-spacing: 0;
|
||
}
|
||
|
||
.el-table td.el-table__cell {
|
||
border-bottom-color: var(--border-soft) !important;
|
||
color: #363a35 !important;
|
||
}
|
||
|
||
.el-table--striped .el-table__body tr.el-table__row--striped td {
|
||
background: #fbfaf7 !important;
|
||
}
|
||
|
||
.el-table__body tr:hover > td {
|
||
background: #f7f4ee !important;
|
||
}
|
||
|
||
.el-table .cell {
|
||
line-height: 1.45;
|
||
}
|
||
|
||
.el-table__empty-block {
|
||
min-height: 168px;
|
||
}
|
||
|
||
.el-table__empty-text {
|
||
color: var(--text-muted) !important;
|
||
}
|
||
|
||
.el-table__fixed-right,
|
||
.el-table__fixed {
|
||
box-shadow: none !important;
|
||
}
|
||
|
||
.el-table__fixed-right::before,
|
||
.el-table__fixed::before {
|
||
background: var(--border-soft) !important;
|
||
}
|
||
|
||
.el-input__wrapper,
|
||
.el-select__wrapper,
|
||
.el-textarea__inner,
|
||
.el-input-number .el-input__wrapper,
|
||
.el-date-editor .el-input__wrapper {
|
||
min-height: 34px;
|
||
border-radius: 7px !important;
|
||
background: #ffffff !important;
|
||
box-shadow: 0 0 0 1px var(--border) inset !important;
|
||
color: var(--text) !important;
|
||
}
|
||
|
||
.el-input,
|
||
.el-select,
|
||
.el-date-editor {
|
||
height: auto !important;
|
||
}
|
||
|
||
.el-input__wrapper:hover,
|
||
.el-select__wrapper:hover,
|
||
.el-textarea__inner:hover {
|
||
box-shadow: 0 0 0 1px #d5cfc3 inset !important;
|
||
}
|
||
|
||
.el-input__wrapper.is-focus,
|
||
.el-select__wrapper.is-focused,
|
||
.el-textarea__inner:focus {
|
||
box-shadow: 0 0 0 1px #1f2320 inset, 0 0 0 3px rgba(31, 35, 32, 0.08) !important;
|
||
}
|
||
|
||
.el-input-number {
|
||
--el-input-number-controls-height: 15px;
|
||
}
|
||
|
||
.el-input-number .el-input__wrapper {
|
||
padding-right: 32px !important;
|
||
}
|
||
|
||
.el-input-number .el-input__inner {
|
||
padding: 0 4px !important;
|
||
text-align: center;
|
||
}
|
||
|
||
.el-input-number.is-controls-right .el-input__wrapper {
|
||
padding-left: 8px !important;
|
||
padding-right: 32px !important;
|
||
}
|
||
|
||
.el-input-number--small.is-controls-right .el-input__wrapper {
|
||
padding-right: 28px !important;
|
||
}
|
||
|
||
.el-input-number__increase,
|
||
.el-input-number__decrease {
|
||
background: #fbfaf7 !important;
|
||
border-color: var(--border) !important;
|
||
color: #6c675f !important;
|
||
box-shadow: none !important;
|
||
}
|
||
|
||
.el-input-number__increase:hover,
|
||
.el-input-number__decrease:hover {
|
||
background: var(--accent-hover) !important;
|
||
color: var(--text) !important;
|
||
}
|
||
|
||
.el-input-number.is-controls-right .el-input-number__increase {
|
||
top: 1px !important;
|
||
right: 1px !important;
|
||
width: 30px !important;
|
||
height: calc((100% - 2px) / 2) !important;
|
||
border-left: 1px solid var(--border) !important;
|
||
border-bottom: 1px solid var(--border) !important;
|
||
border-radius: 0 7px 0 0 !important;
|
||
}
|
||
|
||
.el-input-number.is-controls-right .el-input-number__decrease {
|
||
right: 1px !important;
|
||
bottom: 1px !important;
|
||
width: 30px !important;
|
||
height: calc((100% - 2px) / 2) !important;
|
||
border-left: 1px solid var(--border) !important;
|
||
border-radius: 0 0 7px 0 !important;
|
||
}
|
||
|
||
.el-input-number--small.is-controls-right .el-input-number__increase,
|
||
.el-input-number--small.is-controls-right .el-input-number__decrease {
|
||
width: 28px !important;
|
||
}
|
||
|
||
.el-input-number__increase,
|
||
.el-input-number__decrease {
|
||
display: inline-flex !important;
|
||
align-items: center;
|
||
justify-content: center;
|
||
line-height: 1 !important;
|
||
}
|
||
|
||
.el-input-number:not(.is-controls-right) .el-input-number__decrease {
|
||
border-right: 1px solid var(--border) !important;
|
||
}
|
||
|
||
.el-input-number:not(.is-controls-right) .el-input-number__increase {
|
||
border-left: 1px solid var(--border) !important;
|
||
}
|
||
|
||
.el-input-number__increase.is-disabled,
|
||
.el-input-number__decrease.is-disabled {
|
||
background: #f4f0e8 !important;
|
||
color: #b6afa3 !important;
|
||
}
|
||
|
||
input[type='number'] {
|
||
-moz-appearance: textfield;
|
||
}
|
||
|
||
input[type='number']::-webkit-outer-spin-button,
|
||
input[type='number']::-webkit-inner-spin-button {
|
||
margin: 0;
|
||
-webkit-appearance: none;
|
||
}
|
||
|
||
.el-input__inner,
|
||
.el-select__placeholder,
|
||
.el-date-editor .el-input__inner,
|
||
.el-textarea__inner {
|
||
color: var(--text) !important;
|
||
}
|
||
|
||
.el-input__inner::placeholder,
|
||
.el-textarea__inner::placeholder {
|
||
color: #aaa49a !important;
|
||
}
|
||
|
||
.el-input.is-disabled .el-input__wrapper,
|
||
.el-select.is-disabled .el-select__wrapper,
|
||
.el-textarea.is-disabled .el-textarea__inner {
|
||
background: #f4f0e8 !important;
|
||
box-shadow: 0 0 0 1px #ebe5da inset !important;
|
||
}
|
||
|
||
.el-input.is-disabled .el-input__inner,
|
||
.el-select.is-disabled .el-select__placeholder {
|
||
color: #aaa49a !important;
|
||
}
|
||
|
||
input:-webkit-autofill,
|
||
input:-webkit-autofill:hover,
|
||
input:-webkit-autofill:focus {
|
||
-webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
|
||
-webkit-text-fill-color: var(--text) !important;
|
||
caret-color: var(--text) !important;
|
||
}
|
||
|
||
.el-form-item__label {
|
||
color: #6c675f !important;
|
||
font-weight: 650;
|
||
}
|
||
|
||
.el-form-item__error {
|
||
color: var(--danger-text) !important;
|
||
}
|
||
|
||
.el-button {
|
||
border-radius: 7px !important;
|
||
border-color: var(--border) !important;
|
||
background: #ffffff !important;
|
||
color: var(--text) !important;
|
||
font-weight: 650 !important;
|
||
box-shadow: none !important;
|
||
}
|
||
|
||
.el-button:hover,
|
||
.el-button:focus {
|
||
background: var(--accent-hover) !important;
|
||
border-color: #d5cfc3 !important;
|
||
color: var(--text) !important;
|
||
}
|
||
|
||
.el-button--primary {
|
||
background: var(--primary) !important;
|
||
border-color: var(--primary) !important;
|
||
color: #ffffff !important;
|
||
}
|
||
|
||
.el-button--primary:hover,
|
||
.el-button--primary:focus {
|
||
background: var(--primary-light) !important;
|
||
border-color: var(--primary-light) !important;
|
||
color: #ffffff !important;
|
||
}
|
||
|
||
.el-button--primary.is-plain,
|
||
.el-button--info.is-plain {
|
||
background: var(--info-bg) !important;
|
||
border-color: var(--info-border) !important;
|
||
color: var(--info-text) !important;
|
||
}
|
||
|
||
.el-button--primary.is-plain:hover,
|
||
.el-button--primary.is-plain:focus,
|
||
.el-button--info.is-plain:hover,
|
||
.el-button--info.is-plain:focus {
|
||
background: #d5ecfb !important;
|
||
border-color: #9fd0ed !important;
|
||
color: #155b86 !important;
|
||
}
|
||
|
||
.el-button--success {
|
||
background: var(--success-text) !important;
|
||
border-color: var(--success-text) !important;
|
||
color: #ffffff !important;
|
||
}
|
||
|
||
.el-button--success.is-plain {
|
||
background: var(--success-bg) !important;
|
||
border-color: var(--success-border) !important;
|
||
color: var(--success-text) !important;
|
||
}
|
||
|
||
.el-button--success.is-plain:hover,
|
||
.el-button--success.is-plain:focus {
|
||
background: #dcebd9 !important;
|
||
border-color: #bad0b8 !important;
|
||
color: #2f5d34 !important;
|
||
}
|
||
|
||
.el-button--warning {
|
||
background: var(--warning-text) !important;
|
||
border-color: var(--warning-text) !important;
|
||
color: #ffffff !important;
|
||
}
|
||
|
||
.el-button--warning.is-plain {
|
||
background: var(--warning-bg) !important;
|
||
border-color: var(--warning-border) !important;
|
||
color: var(--warning-text) !important;
|
||
}
|
||
|
||
.el-button--warning.is-plain:hover,
|
||
.el-button--warning.is-plain:focus {
|
||
background: #f3e6bd !important;
|
||
border-color: #d4bd75 !important;
|
||
color: #7f5500 !important;
|
||
}
|
||
|
||
.el-button--danger {
|
||
background: var(--danger-text) !important;
|
||
border-color: var(--danger-text) !important;
|
||
color: #ffffff !important;
|
||
}
|
||
|
||
.el-button--danger.is-plain {
|
||
background: var(--danger-bg) !important;
|
||
border-color: var(--danger-border) !important;
|
||
color: var(--danger-text) !important;
|
||
}
|
||
|
||
.el-button--danger.is-plain:hover,
|
||
.el-button--danger.is-plain:focus {
|
||
background: #f8d9dc !important;
|
||
border-color: #e3a8ac !important;
|
||
color: #842827 !important;
|
||
}
|
||
|
||
.el-button--info {
|
||
background: #eef1ec !important;
|
||
border-color: #d9ddd6 !important;
|
||
color: #4d524b !important;
|
||
}
|
||
|
||
.el-button.is-link,
|
||
.el-button--primary.is-link,
|
||
.el-button--success.is-link,
|
||
.el-button--warning.is-link,
|
||
.el-button--danger.is-link {
|
||
min-height: 0;
|
||
padding: 0 4px !important;
|
||
border-color: transparent !important;
|
||
background: transparent !important;
|
||
color: var(--primary-link) !important;
|
||
}
|
||
|
||
.el-button--danger.is-link {
|
||
color: var(--danger-text) !important;
|
||
}
|
||
|
||
.el-button--warning.is-link {
|
||
color: var(--warning-text) !important;
|
||
}
|
||
|
||
/* Link buttons hover in light theme - override dark legacy */
|
||
.el-button.is-link:hover,
|
||
.el-button.is-link:focus,
|
||
.el-button.is-link.el-button--default:hover,
|
||
.el-button.is-link.el-button--default:focus,
|
||
.el-button.is-link.el-button--primary:hover,
|
||
.el-button.is-link.el-button--primary:focus {
|
||
color: #155b86 !important; /* Darker blue */
|
||
background: transparent !important;
|
||
text-decoration: underline !important;
|
||
}
|
||
|
||
.el-button.is-link.el-button--success:hover,
|
||
.el-button.is-link.el-button--success:focus {
|
||
color: #224225 !important; /* Darker green */
|
||
background: transparent !important;
|
||
text-decoration: underline !important;
|
||
}
|
||
|
||
.el-button.is-link.el-button--warning:hover,
|
||
.el-button.is-link.el-button--warning:focus {
|
||
color: #704b00 !important; /* Darker warning/gold */
|
||
background: transparent !important;
|
||
text-decoration: underline !important;
|
||
}
|
||
|
||
.el-button.is-link.el-button--danger:hover,
|
||
.el-button.is-link.el-button--danger:focus {
|
||
color: #7d2321 !important; /* Darker danger/red */
|
||
background: transparent !important;
|
||
text-decoration: underline !important;
|
||
}
|
||
|
||
|
||
.el-button.is-disabled,
|
||
.el-button.is-disabled:hover {
|
||
background: #f4f0e8 !important;
|
||
border-color: #ebe5da !important;
|
||
color: #aaa49a !important;
|
||
}
|
||
|
||
.el-button.is-plain.is-disabled,
|
||
.el-button.is-plain.is-disabled:hover,
|
||
.el-button.is-plain.is-disabled:focus,
|
||
.el-button.is-plain:disabled,
|
||
.el-button--primary.is-plain.is-disabled,
|
||
.el-button--primary.is-plain.is-disabled:hover,
|
||
.el-button--primary.is-plain:disabled,
|
||
.el-button--success.is-plain.is-disabled,
|
||
.el-button--success.is-plain.is-disabled:hover,
|
||
.el-button--success.is-plain:disabled,
|
||
.el-button--warning.is-plain.is-disabled,
|
||
.el-button--warning.is-plain.is-disabled:hover,
|
||
.el-button--warning.is-plain:disabled,
|
||
.el-button--danger.is-plain.is-disabled,
|
||
.el-button--danger.is-plain.is-disabled:hover,
|
||
.el-button--danger.is-plain:disabled {
|
||
background: #f4f0e8 !important;
|
||
border-color: #e3dcca !important;
|
||
color: #aaa49a !important;
|
||
}
|
||
|
||
.el-tag {
|
||
border-radius: 999px !important;
|
||
font-weight: 700 !important;
|
||
letter-spacing: 0 !important;
|
||
}
|
||
|
||
.el-tag--success {
|
||
background: var(--success-bg) !important;
|
||
border-color: var(--success-border) !important;
|
||
color: var(--success-text) !important;
|
||
}
|
||
|
||
.el-tag--warning {
|
||
background: var(--warning-bg) !important;
|
||
border-color: var(--warning-border) !important;
|
||
color: var(--warning-text) !important;
|
||
}
|
||
|
||
.el-tag--danger {
|
||
background: var(--danger-bg) !important;
|
||
border-color: var(--danger-border) !important;
|
||
color: var(--danger-text) !important;
|
||
}
|
||
|
||
.el-tag--info {
|
||
background: #eef1ec !important;
|
||
border-color: #d9ddd6 !important;
|
||
color: #5d635c !important;
|
||
}
|
||
|
||
.el-tag--primary {
|
||
background: var(--accent-subtle) !important;
|
||
border-color: var(--accent-border) !important;
|
||
color: var(--accent) !important;
|
||
}
|
||
|
||
.el-pagination {
|
||
--el-pagination-bg-color: #ffffff;
|
||
--el-pagination-button-bg-color: #ffffff;
|
||
--el-pagination-hover-color: #1f2320;
|
||
--el-pagination-text-color: #6c675f;
|
||
--el-pagination-button-disabled-bg-color: #f4f0e8;
|
||
gap: 4px;
|
||
}
|
||
|
||
.el-pagination .btn-prev,
|
||
.el-pagination .btn-next,
|
||
.el-pager li {
|
||
border: 1px solid var(--border) !important;
|
||
border-radius: 7px !important;
|
||
color: var(--text-muted) !important;
|
||
}
|
||
|
||
.el-pager li.is-active {
|
||
background: var(--primary) !important;
|
||
border-color: var(--primary) !important;
|
||
color: #ffffff !important;
|
||
}
|
||
|
||
.el-dropdown__popper,
|
||
.el-select__popper,
|
||
.el-popover.el-popper {
|
||
border: 1px solid var(--border) !important;
|
||
background: #ffffff !important;
|
||
box-shadow: 0 18px 44px rgba(56, 49, 37, 0.12) !important;
|
||
}
|
||
|
||
.el-dropdown-menu,
|
||
.el-select-dropdown {
|
||
background: #ffffff !important;
|
||
}
|
||
|
||
.el-dropdown-menu__item,
|
||
.el-select-dropdown__item {
|
||
color: var(--text) !important;
|
||
}
|
||
|
||
.el-dropdown-menu__item:hover,
|
||
.el-select-dropdown__item.hover,
|
||
.el-select-dropdown__item:hover {
|
||
background: var(--accent-hover) !important;
|
||
color: var(--text) !important;
|
||
}
|
||
|
||
.el-select-dropdown__item.is-selected {
|
||
color: var(--text) !important;
|
||
font-weight: 700;
|
||
}
|
||
|
||
.el-dialog,
|
||
.el-message-box {
|
||
border: 1px solid var(--border) !important;
|
||
border-radius: 10px !important;
|
||
background: #ffffff !important;
|
||
box-shadow: 0 24px 64px rgba(56, 49, 37, 0.14) !important;
|
||
}
|
||
|
||
.el-dialog__header,
|
||
.el-message-box__header {
|
||
border-bottom: 1px solid var(--border-soft) !important;
|
||
}
|
||
|
||
.el-dialog__title,
|
||
.el-message-box__title {
|
||
color: var(--text) !important;
|
||
font-weight: 750 !important;
|
||
}
|
||
|
||
.el-dialog__body,
|
||
.el-message-box__content {
|
||
color: var(--text) !important;
|
||
}
|
||
|
||
.el-dialog__footer,
|
||
.el-message-box__btns {
|
||
border-top: 1px solid var(--border-soft) !important;
|
||
}
|
||
|
||
.el-overlay {
|
||
background: rgba(31, 35, 32, 0.22) !important;
|
||
backdrop-filter: blur(3px);
|
||
}
|
||
|
||
.el-loading-mask {
|
||
background: rgba(247, 246, 243, 0.78) !important;
|
||
backdrop-filter: blur(2px);
|
||
}
|
||
|
||
.el-loading-spinner .path {
|
||
stroke: var(--primary) !important;
|
||
}
|
||
|
||
.el-loading-spinner .el-loading-text {
|
||
color: var(--text-muted) !important;
|
||
}
|
||
|
||
.el-message {
|
||
border: 1px solid var(--border) !important;
|
||
border-radius: 8px !important;
|
||
background: #ffffff !important;
|
||
box-shadow: 0 12px 30px rgba(56, 49, 37, 0.12) !important;
|
||
}
|
||
|
||
.el-alert {
|
||
border-radius: 8px !important;
|
||
}
|
||
|
||
.el-tabs__item {
|
||
color: var(--text-muted) !important;
|
||
font-weight: 650;
|
||
}
|
||
|
||
.el-tabs__item.is-active,
|
||
.el-tabs__item:hover {
|
||
color: var(--text) !important;
|
||
}
|
||
|
||
.el-tabs__active-bar {
|
||
background: var(--primary) !important;
|
||
}
|
||
|
||
.el-tabs__nav-wrap::after {
|
||
background: var(--border-soft) !important;
|
||
}
|
||
|
||
.el-statistic__head {
|
||
color: var(--text-muted) !important;
|
||
font-size: 12px !important;
|
||
font-weight: 650 !important;
|
||
letter-spacing: 0 !important;
|
||
text-transform: none !important;
|
||
}
|
||
|
||
.el-statistic__content .el-statistic__number {
|
||
color: var(--text) !important;
|
||
font-size: 24px !important;
|
||
font-weight: 750 !important;
|
||
}
|
||
|
||
.el-picker-panel,
|
||
.el-time-panel {
|
||
background: #ffffff !important;
|
||
border-color: var(--border) !important;
|
||
color: var(--text) !important;
|
||
box-shadow: 0 18px 44px rgba(56, 49, 37, 0.12) !important;
|
||
}
|
||
|
||
.el-picker-panel__footer {
|
||
background: #fbfaf7 !important;
|
||
border-top-color: var(--border-soft) !important;
|
||
}
|
||
|
||
.el-date-picker__header-label,
|
||
.el-date-table th,
|
||
.el-date-table td .el-date-table-cell__text,
|
||
.el-time-spinner__item {
|
||
color: var(--text) !important;
|
||
}
|
||
|
||
.el-date-table td.available:hover {
|
||
color: var(--primary) !important;
|
||
}
|
||
|
||
.el-date-table td.current:not(.disabled) .el-date-table-cell__text {
|
||
background: var(--primary) !important;
|
||
color: #ffffff !important;
|
||
}
|
||
|
||
.el-time-spinner__item.is-active:not(.is-disabled) {
|
||
color: var(--primary) !important;
|
||
font-weight: 700;
|
||
}
|
||
|
||
.admin-list-page {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 16px;
|
||
color: var(--text);
|
||
}
|
||
|
||
.list-chrome {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 14px;
|
||
min-height: 0;
|
||
padding: 18px;
|
||
border: 1px solid var(--border);
|
||
border-radius: 10px;
|
||
background: #ffffff;
|
||
box-shadow: var(--shadow);
|
||
}
|
||
|
||
.list-toolbar,
|
||
.filter-bar,
|
||
.filters,
|
||
.list-panel-toolbar,
|
||
.table-toolbar {
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
gap: 10px;
|
||
padding: 0;
|
||
}
|
||
|
||
.list-toolbar + .table-wrap,
|
||
.filter-bar + .table-wrap,
|
||
.filters + .table-wrap,
|
||
.list-panel-toolbar + .table-wrap {
|
||
margin-top: 2px;
|
||
}
|
||
|
||
.table-wrap,
|
||
.admin-table-wrap,
|
||
.table-panel,
|
||
.list-panel {
|
||
min-width: 0;
|
||
border: 1px solid var(--border);
|
||
border-radius: 10px;
|
||
background: #ffffff;
|
||
box-shadow: var(--shadow);
|
||
overflow: hidden;
|
||
}
|
||
|
||
.list-chrome > .table-wrap,
|
||
.list-chrome > .admin-table-wrap,
|
||
.list-chrome > .table-panel,
|
||
.list-chrome > .list-panel {
|
||
border-color: var(--border-soft);
|
||
box-shadow: none;
|
||
}
|
||
|
||
.table-scroll,
|
||
.admin-table-scroll,
|
||
.el-table__body-wrapper {
|
||
scrollbar-color: #d5cfc3 transparent;
|
||
}
|
||
|
||
.pager,
|
||
.list-pager,
|
||
.table-pager,
|
||
.pagination-bar {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
gap: 10px;
|
||
padding-top: 12px;
|
||
}
|
||
|
||
.muted,
|
||
.hint,
|
||
.subtext,
|
||
.desc,
|
||
.table-hint,
|
||
.section-hint {
|
||
color: var(--text-muted) !important;
|
||
}
|
||
|
||
.danger-text,
|
||
.c-red {
|
||
color: var(--danger-text) !important;
|
||
}
|
||
|
||
.success-text,
|
||
.c-green {
|
||
color: var(--success-text) !important;
|
||
}
|
||
|
||
.warning-text,
|
||
.c-gold,
|
||
.c-yellow {
|
||
color: var(--warning-text) !important;
|
||
}
|
||
|
||
.admin-page-state,
|
||
.state-card,
|
||
.empty-state,
|
||
.error-state {
|
||
border: 1px solid var(--border);
|
||
border-radius: 10px;
|
||
background: #ffffff;
|
||
color: var(--text);
|
||
box-shadow: var(--shadow);
|
||
}
|
||
|
||
.error-state,
|
||
.state-card.is-error {
|
||
background: var(--danger-bg);
|
||
border-color: var(--danger-border);
|
||
}
|
||
|
||
.error-state .state-title,
|
||
.state-card.is-error .state-title {
|
||
color: var(--danger-text);
|
||
}
|
||
|
||
.user-edit-dialog .edit-stats-panel,
|
||
.agent-edit-dialog .edit-stats-panel,
|
||
.detail-actions {
|
||
border-top-color: var(--border-soft);
|
||
}
|
||
|
||
.user-edit-dialog .password-field-label,
|
||
.agent-edit-dialog .password-field-label,
|
||
.user-edit-dialog .password-empty,
|
||
.agent-edit-dialog .password-empty {
|
||
color: var(--text-muted);
|
||
}
|
||
|
||
.user-edit-dialog .password-plain,
|
||
.agent-edit-dialog .password-plain {
|
||
color: var(--warning-text);
|
||
}
|
||
|
||
@media (max-width: 700px) {
|
||
.admin-list-page {
|
||
gap: 12px;
|
||
}
|
||
|
||
.list-chrome {
|
||
padding: 12px;
|
||
border-radius: 8px;
|
||
}
|
||
|
||
.list-toolbar,
|
||
.filter-bar,
|
||
.filters,
|
||
.list-panel-toolbar,
|
||
.table-toolbar {
|
||
align-items: stretch;
|
||
}
|
||
|
||
.list-toolbar > *,
|
||
.filter-bar > *,
|
||
.filters > *,
|
||
.list-panel-toolbar > *,
|
||
.table-toolbar > * {
|
||
max-width: 100%;
|
||
}
|
||
|
||
.el-input,
|
||
.el-select,
|
||
.el-date-editor,
|
||
.el-button {
|
||
max-width: 100%;
|
||
}
|
||
|
||
.el-table {
|
||
font-size: 12px;
|
||
}
|
||
|
||
.pager,
|
||
.list-pager,
|
||
.table-pager,
|
||
.pagination-bar {
|
||
justify-content: center;
|
||
}
|
||
|
||
.el-pagination {
|
||
justify-content: center;
|
||
width: 100%;
|
||
white-space: normal;
|
||
}
|
||
}
|
||
</style>
|