xto-fronted 0.4.90 → 0.4.91

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (120) hide show
  1. package/dist/assets/404-Bq0LY5Cd.js +1 -0
  2. package/dist/assets/404-Cw_4ZCL6.css +1 -0
  3. package/dist/assets/{index-BDgOY6Rp.js → index-7ZZxpSfk.js} +1 -1
  4. package/dist/assets/index-BJUe8VUp.js +1 -0
  5. package/dist/assets/{index-Bz0BgZQ1.js → index-BlOR_ICg.js} +1 -1
  6. package/dist/assets/index-BlRslYYI.css +1 -0
  7. package/dist/assets/index-BudArKxR.css +1 -0
  8. package/dist/assets/{index-CwRA10ac.js → index-BzbOWBCV.js} +1 -1
  9. package/dist/assets/index-CFhWBbxk.css +1 -0
  10. package/dist/assets/{index-CfpZmcpk.css → index-CH6aTfYg.css} +1 -1
  11. package/dist/assets/{index-BIoRANs0.js → index-CT5f37nN.js} +1 -1
  12. package/dist/assets/index-Ce-kjtEM.js +2 -0
  13. package/dist/assets/{index-t-2Y0KhA.css → index-Cpew6d-v.css} +1 -1
  14. package/dist/assets/index-DkkuYBgT.css +1 -0
  15. package/dist/assets/index-vfvEFrCH.css +1 -0
  16. package/dist/assets/{index-CwJSA85U.js → index-wVLLAoVp.js} +1 -1
  17. package/dist/assets/vendor-DZmPBJ9d.js +16 -0
  18. package/dist/assets/vue-vendor-DjmFuEnG.js +29 -0
  19. package/dist/assets/{xto-base-PwLGsxxb.js → xto-base-B5HYOo6i.js} +1 -1
  20. package/dist/assets/{xto-core-CtL4zKiV.js → xto-core-DZYp_YAR.js} +1 -1
  21. package/dist/assets/{xto-data-bCXQa7fT.js → xto-data-ogck6x_i.js} +1 -1
  22. package/dist/assets/{xto-feedback-CPydp0kn.js → xto-feedback-C0-6cAL6.js} +1 -1
  23. package/dist/assets/{xto-form-bywohdAf.js → xto-form-IDg_78Vf.js} +1 -1
  24. package/dist/assets/{xto-navigation-Bbdpine9.js → xto-navigation-CPYLzfu7.js} +1 -1
  25. package/dist/index.html +9 -9
  26. package/package.json +91 -91
  27. package/src/App.vue +48 -48
  28. package/src/assets/styles/_dark.scss +639 -572
  29. package/src/assets/styles/_root.scss +183 -183
  30. package/src/assets/styles/_variables.scss +69 -69
  31. package/src/assets/styles/index.scss +460 -460
  32. package/src/components/Layout/Sidebar.vue +198 -198
  33. package/src/components/Layout/TopMenu.vue +1170 -1170
  34. package/src/components/Layout/index.vue +192 -192
  35. package/src/directives/permission.ts +12 -3
  36. package/src/index.ts +100 -100
  37. package/src/router/layoutRoute.ts +59 -59
  38. package/src/stores/menu.ts +64 -3
  39. package/src/types/json-bigint.d.ts +18 -18
  40. package/src/utils/permission.ts +12 -5
  41. package/src/views/dashboard/index.vue +545 -545
  42. package/src/views/error/403.vue +251 -251
  43. package/src/views/error/404.vue +253 -253
  44. package/src/views/login/index.vue +586 -586
  45. package/src/views/system/menu/index.vue +690 -690
  46. package/src/views/system/role/index.vue +583 -583
  47. package/src/views/system/user/index.vue +655 -655
  48. package/dist/App.vue.d.ts +0 -2
  49. package/dist/api/auth.d.ts +0 -8
  50. package/dist/api/system.d.ts +0 -16
  51. package/dist/api/user.d.ts +0 -13
  52. package/dist/assets/404-C9Uh6Uu-.css +0 -1
  53. package/dist/assets/404-zjGLLssH.js +0 -1
  54. package/dist/assets/index-B5xc4gQB.css +0 -1
  55. package/dist/assets/index-CAdztNsv.css +0 -1
  56. package/dist/assets/index-CCXrcISf.css +0 -1
  57. package/dist/assets/index-D8NDxq9d.js +0 -1
  58. package/dist/assets/index-DEB6-Iv_.js +0 -2
  59. package/dist/assets/index-DM4Ezclc.css +0 -1
  60. package/dist/assets/index-DYv7nImj.css +0 -1
  61. package/dist/assets/vendor-CUVPinTg.js +0 -13
  62. package/dist/assets/vue-vendor-DeJXJVbN.js +0 -29
  63. package/dist/components/Layout/Footer.vue.d.ts +0 -2
  64. package/dist/components/Layout/Header.vue.d.ts +0 -5
  65. package/dist/components/Layout/MixTopMenu.vue.d.ts +0 -5
  66. package/dist/components/Layout/Sidebar.vue.d.ts +0 -11
  67. package/dist/components/Layout/SidebarMenuItem.vue.d.ts +0 -5
  68. package/dist/components/Layout/Tabs.vue.d.ts +0 -2
  69. package/dist/components/Layout/TopMenu.vue.d.ts +0 -5
  70. package/dist/components/Layout/index.vue.d.ts +0 -2
  71. package/dist/composables/useApp.d.ts +0 -29
  72. package/dist/composables/useAuth.d.ts +0 -6
  73. package/dist/composables/useForm.d.ts +0 -20
  74. package/dist/composables/useI18n.d.ts +0 -30
  75. package/dist/composables/useTable.d.ts +0 -29
  76. package/dist/directives/permission.d.ts +0 -4
  77. package/dist/enums/index.d.ts +0 -32
  78. package/dist/index-58aI1w0v.js +0 -515
  79. package/dist/index-A_B_Ap_A.js +0 -4240
  80. package/dist/index-BAmYUT0G.js +0 -189
  81. package/dist/index-BRvi9qW-.js +0 -515
  82. package/dist/index-BVGW4DDQ.js +0 -189
  83. package/dist/index-Bmf0YbVq.js +0 -189
  84. package/dist/index-C2-a5KSQ.js +0 -4233
  85. package/dist/index-CeZ0CSSs.js +0 -641
  86. package/dist/index-D25KzR0I.js +0 -479
  87. package/dist/index-DEYOivza.js +0 -641
  88. package/dist/index-DReodgBw.js +0 -4233
  89. package/dist/index-DjERNRXX.js +0 -515
  90. package/dist/index-LSdsO2Ox.js +0 -479
  91. package/dist/index-gBlRG4kk.js +0 -479
  92. package/dist/index-xWU3J3OH.js +0 -641
  93. package/dist/index.d.ts +0 -59
  94. package/dist/index.es.js +0 -95
  95. package/dist/index.umd.js +0 -8
  96. package/dist/main.d.ts +0 -0
  97. package/dist/router/dynamicRoutes.d.ts +0 -30
  98. package/dist/router/guards.d.ts +0 -17
  99. package/dist/router/index.d.ts +0 -6
  100. package/dist/router/layoutRoute.d.ts +0 -22
  101. package/dist/router/staticRoutes.d.ts +0 -2
  102. package/dist/stores/app.d.ts +0 -93
  103. package/dist/stores/auth.d.ts +0 -41
  104. package/dist/stores/index.d.ts +0 -10
  105. package/dist/stores/locale.d.ts +0 -42
  106. package/dist/stores/menu.d.ts +0 -77
  107. package/dist/stores/user.d.ts +0 -92
  108. package/dist/style.css +0 -1
  109. package/dist/utils/auth.d.ts +0 -27
  110. package/dist/utils/config.d.ts +0 -30
  111. package/dist/utils/permission.d.ts +0 -18
  112. package/dist/utils/request.d.ts +0 -29
  113. package/dist/utils/storage.d.ts +0 -24
  114. package/dist/views/dashboard/index.vue.d.ts +0 -2
  115. package/dist/views/error/403.vue.d.ts +0 -2
  116. package/dist/views/error/404.vue.d.ts +0 -2
  117. package/dist/views/login/index.vue.d.ts +0 -4
  118. package/dist/views/system/menu/index.vue.d.ts +0 -4
  119. package/dist/views/system/role/index.vue.d.ts +0 -4
  120. package/dist/views/system/user/index.vue.d.ts +0 -4
package/src/assets/styles/_dark.scss CHANGED
@@ -1,573 +1,640 @@
1
- // ==============================================
2
- // Dark Theme Override - 暗黑主题覆盖
3
- // ==============================================
4
-
5
- .dark {
6
- // 侧边栏
7
- .sidebar,
8
- .layout__aside {
9
- background-color: #1d1e1f;
10
- }
11
-
12
- .sidebar {
13
- border-right: 1px solid #363637;
14
- }
15
-
16
- .sidebar__search-results {
17
- background-color: #1d1e1f;
18
- border-color: #363637;
19
- }
20
-
21
- .sidebar__search-item:hover {
22
- background-color: #262727;
23
- }
24
-
25
- .sidebar__search-item-title {
26
- color: #cfd3dc;
27
- }
28
-
29
- .sidebar__search-item-parent {
30
- color: #a3a6ad;
31
- }
32
-
33
- .sidebar__logo {
34
- border-bottom-color: #363637;
35
- }
36
-
37
- .sidebar__user {
38
- border-top-color: #363637;
39
- }
40
-
41
- .sidebar__user-name {
42
- color: #cfd3dc;
43
- }
44
-
45
- .sidebar__user-role {
46
- color: #a3a6ad;
47
- }
48
-
49
- // 菜单
50
- .x-menu {
51
- background-color: #1d1e1f !important;
52
- border-color: #363637;
53
- color: #cfd3dc;
54
-
55
- &.x-menu--vertical {
56
- border-right-color: #363637;
57
- }
58
-
59
- &.x-menu--horizontal {
60
- border-bottom-color: #363637;
61
- background-color: #1d1e1f !important;
62
- }
63
- }
64
-
65
- .x-menu-item {
66
- color: #cfd3dc !important;
67
- background-color: transparent !important;
68
-
69
- &:hover {
70
- background-color: #262727 !important;
71
- }
72
-
73
- &.is-active {
74
- color: #409eff !important;
75
- background-color: rgba(64, 158, 255, 0.1) !important;
76
-
77
- &::before {
78
- background-color: #409eff;
79
- }
80
- }
81
-
82
- // 水平模式下的菜单项
83
- &.is-horizontal {
84
- &:hover {
85
- background-color: transparent !important;
86
- }
87
-
88
- &.is-active {
89
- background-color: transparent !important;
90
- border-bottom-color: #409eff;
91
- }
92
- }
93
- }
94
-
95
- .x-sub-menu {
96
- &__title {
97
- color: #cfd3dc !important;
98
- background-color: transparent !important;
99
-
100
- &:hover {
101
- background-color: #262727 !important;
102
- }
103
- }
104
-
105
- &__menu {
106
- background-color: #1d1e1f !important;
107
- border: 1px solid #363637;
108
- box-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
109
-
110
- // 子菜单中的菜单项
111
- .x-menu-item {
112
- background-color: transparent !important;
113
- color: #cfd3dc !important;
114
-
115
- &:hover {
116
- background-color: #262727 !important;
117
- }
118
-
119
- &.is-active {
120
- color: #409eff !important;
121
- background-color: rgba(64, 158, 255, 0.1) !important;
122
- }
123
- }
124
- }
125
-
126
- &__arrow {
127
- color: #a3a6ad;
128
- }
129
-
130
- &.is-opened > .x-sub-menu__title {
131
- // 展开状态不设置背景色，避免与高亮状态混淆
132
- }
133
-
134
- &.is-active > .x-sub-menu__title {
135
- color: #409eff !important;
136
- }
137
-
138
- // 水平模式下的子菜单
139
- &--horizontal {
140
- .x-sub-menu__title:hover {
141
- background-color: transparent !important;
142
- }
143
-
144
- .x-sub-menu__menu {
145
- background-color: #1d1e1f !important;
146
- border: 1px solid #363637;
147
- }
148
- }
149
-
150
- // 收起状态下的弹出菜单
151
- &.is-collapse > .x-sub-menu__menu {
152
- background-color: #1d1e1f !important;
153
- border: 1px solid #363637;
154
- }
155
- }
156
-
157
- // 顶部导航
158
- .header {
159
- background-color: #1d1e1f;
160
- border-bottom-color: #363637;
161
- }
162
-
163
- .header__collapse {
164
- color: #cfd3dc;
165
- }
166
-
167
- .header__breadcrumb {
168
- color: #a3a6ad;
169
- }
170
-
171
- .header__user-name {
172
- color: #cfd3dc;
173
- }
174
-
175
- .header__user-arrow {
176
- color: #a3a6ad;
177
- }
178
-
179
- .header__action:hover {
180
- background-color: #262727;
181
- }
182
-
183
- .header__user-trigger:hover {
184
- background-color: #262727;
185
- }
186
-
187
- // 下拉菜单
188
- .header__dropdown {
189
- background-color: #1d1e1f;
190
- border: 1px solid #363637;
191
- box-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
192
- }
193
-
194
- .header__dropdown-name {
195
- color: #e5eaf3;
196
- }
197
-
198
- .header__dropdown-role {
199
- color: #a3a6ad;
200
- }
201
-
202
- .header__dropdown-divider {
203
- background-color: #363637;
204
- }
205
-
206
- .header__dropdown-item {
207
- color: #cfd3dc;
208
-
209
- &:hover {
210
- background-color: #262727;
211
- color: #e5eaf3;
212
- }
213
- }
214
-
215
- // 顶部菜单组件
216
- .top-menu {
217
- background-color: #1d1e1f;
218
-
219
- &__menu {
220
- background-color: #1d1e1f !important;
221
- }
222
-
223
- &__menu-char {
224
- background-color: rgba(64, 158, 255, 0.2);
225
- color: #79bbff;
226
- }
227
-
228
- &__action {
229
- color: #cfd3dc;
230
-
231
- &:hover {
232
- background-color: #262727;
233
- color: #409eff;
234
- }
235
- }
236
-
237
- &__user-trigger:hover {
238
- background-color: #262727;
239
- }
240
-
241
- &__user-name {
242
- color: #cfd3dc;
243
- }
244
-
245
- &__user-arrow {
246
- color: #a3a6ad;
247
- }
248
-
249
- &__dropdown {
250
- background-color: #1d1e1f;
251
- border: 1px solid #363637;
252
- box-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
253
- }
254
-
255
- &__dropdown-name {
256
- color: #e5eaf3;
257
- }
258
-
259
- &__dropdown-role {
260
- color: #a3a6ad;
261
- }
262
-
263
- &__dropdown-divider {
264
- background-color: #363637;
265
- }
266
-
267
- &__dropdown-item {
268
- color: #cfd3dc;
269
-
270
- &:hover {
271
- background-color: #262727;
272
- color: #e5eaf3;
273
- }
274
- }
275
- }
276
-
277
- // 按钮
278
- .x-button {
279
- &.x-button--default {
280
- background-color: #1d1e1f;
281
- border-color: #4c4d4f;
282
- color: #cfd3dc;
283
-
284
- &:hover {
285
- border-color: #409eff;
286
- color: #409eff;
287
- }
288
- }
289
-
290
- &.x-button--text {
291
- color: #409eff;
292
- }
293
- }
294
-
295
- // 表单
296
- .x-form-item__label {
297
- color: #cfd3dc;
298
- }
299
-
300
- .x-form-item__error {
301
- color: #f56c6c;
302
- }
303
-
304
- // 输入框
305
- .x-input {
306
- background-color: #1d1e1f;
307
- border-color: #4c4d4f;
308
-
309
- &.is-focus {
310
- border-color: #409eff;
311
- }
312
-
313
- .x-input__inner {
314
- background-color: transparent;
315
- color: #e5eaf3;
316
-
317
- &::placeholder {
318
- color: #6c6e72;
319
- }
320
- }
321
-
322
- .x-input__suffix,
323
- .x-input__prefix {
324
- color: #a3a6ad;
325
- }
326
- }
327
-
328
- // 选择器
329
- .x-select {
330
- background-color: #1d1e1f;
331
- border-color: #4c4d4f;
332
- }
333
-
334
- // 卡片
335
- .x-card {
336
- background-color: #1d1e1f;
337
- border-color: #363637;
338
- }
339
-
340
- .x-card__header {
341
- border-bottom-color: #363637;
342
- color: #e5eaf3;
343
- }
344
-
345
- // 表格
346
- .data-table {
347
- th {
348
- background-color: #262727;
349
- color: #cfd3dc;
350
- border-bottom-color: #363637;
351
- }
352
-
353
- td {
354
- border-bottom-color: #363637;
355
- color: #cfd3dc;
356
- }
357
-
358
- tr:hover td {
359
- background-color: #262727;
360
- }
361
- }
362
-
363
- // 弹窗
364
- .x-modal {
365
- &__wrapper {
366
- background-color: rgba(0, 0, 0, 0.7);
367
- }
368
-
369
- &__container {
370
- background-color: #1d1e1f;
371
- border: 1px solid #363637;
372
- }
373
-
374
- &__header {
375
- border-bottom-color: #363637;
376
- color: #e5eaf3;
377
- }
378
-
379
- &__footer {
380
- border-top-color: #363637;
381
- }
382
- }
383
-
384
- // 消息提示
385
- .x-message {
386
- background-color: #1d1e1f;
387
- border: 1px solid #363637;
388
- }
389
-
390
- // 标签
391
- .x-tag {
392
- &.x-tag--primary {
393
- background-color: rgba(64, 158, 255, 0.2);
394
- color: #79bbff;
395
- border-color: rgba(64, 158, 255, 0.3);
396
- }
397
-
398
- &.x-tag--success {
399
- background-color: rgba(103, 194, 58, 0.2);
400
- color: #95d475;
401
- border-color: rgba(103, 194, 58, 0.3);
402
- }
403
-
404
- &.x-tag--warning {
405
- background-color: rgba(230, 162, 60, 0.2);
406
- color: #eebe77;
407
- border-color: rgba(230, 162, 60, 0.3);
408
- }
409
-
410
- &.x-tag--danger {
411
- background-color: rgba(245, 108, 108, 0.2);
412
- color: #fab6b6;
413
- border-color: rgba(245, 108, 108, 0.3);
414
- }
415
-
416
- &.x-tag--info {
417
- background-color: rgba(144, 147, 153, 0.2);
418
- color: #c0c4cc;
419
- border-color: rgba(144, 147, 153, 0.3);
420
- }
421
- }
422
-
423
- // 开关
424
- .x-switch {
425
- background-color: #4c4d4f;
426
-
427
- &.is-checked {
428
- background-color: #409eff;
429
- }
430
- }
431
-
432
- // 分页
433
- .x-pagination {
434
- color: #cfd3dc;
435
-
436
- &__item {
437
- background-color: #1d1e1f;
438
- border-color: #4c4d4f;
439
- color: #cfd3dc;
440
-
441
- &:hover {
442
- color: #409eff;
443
- }
444
-
445
- &.is-active {
446
- background-color: #409eff;
447
- border-color: #409eff;
448
- color: #fff;
449
- }
450
- }
451
- }
452
-
453
- // 登录页面
454
- .login {
455
- background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
456
- }
457
-
458
- .login__container {
459
- background-color: #1d1e1f;
460
- border: 1px solid #363637;
461
- }
462
-
463
- .login__title {
464
- color: #409eff;
465
- }
466
-
467
- .login__subtitle {
468
- color: #a3a6ad;
469
- }
470
-
471
- .login__footer {
472
- color: #6c6e72;
473
- }
474
-
475
- // 仪表盘
476
- .stat-card__title {
477
- color: #a3a6ad;
478
- }
479
-
480
- .quick-link {
481
- background-color: #262727;
482
-
483
- &:hover {
484
- background-color: rgba(64, 158, 255, 0.1);
485
- }
486
-
487
- &__title {
488
- color: #cfd3dc;
489
- }
490
- }
491
-
492
- .activity-item {
493
- border-bottom-color: #363637;
494
-
495
- &__action {
496
- color: #cfd3dc;
497
- }
498
- }
499
-
500
- // 搜索卡片
501
- .search-card {
502
- background-color: #1d1e1f;
503
- border: 1px solid #363637;
504
- }
505
-
506
- // 表格卡片
507
- .table-card {
508
- background-color: #1d1e1f;
509
- border: 1px solid #363637;
510
- }
511
-
512
- // Popconfirm
513
- .x-popconfirm {
514
- background-color: #1d1e1f;
515
- border: 1px solid #363637;
516
- }
517
-
518
- // Drawer 抽屉组件
519
- .x-drawer {
520
- background-color: #1d1e1f;
521
-
522
- &__header {
523
- background-color: #1d1e1f;
524
- border-bottom-color: #363637;
525
- color: #e5eaf3;
526
- }
527
-
528
- &__body {
529
- background-color: #1d1e1f;
530
- color: #cfd3dc;
531
- }
532
-
533
- &__footer {
534
- background-color: #1d1e1f;
535
- border-top-color: #363637;
536
- }
537
- }
538
-
539
- // 设置抽屉内容
540
- .settings-drawer {
541
- .settings-title {
542
- color: #e5eaf3;
543
- }
544
-
545
- .settings-section {
546
- background-color: transparent;
547
- }
548
-
549
- .layout-option {
550
- border-color: #4c4d4f;
551
- background-color: transparent;
552
-
553
- &:hover {
554
- border-color: #409eff;
555
- }
556
-
557
- &.is-active {
558
- border-color: #409eff;
559
- background-color: rgba(64, 158, 255, 0.1);
560
- }
561
-
562
- &__label {
563
- color: #cfd3dc;
564
- }
565
- }
566
-
567
- .settings-switch-item {
568
- span {
569
- color: #cfd3dc;
570
- }
571
- }
572
- }
1
+ // ==============================================
2
+ // Dark Theme Override - 暗黑主题覆盖
3
+ // ==============================================
4
+
5
+ .dark {
6
+ // 侧边栏
7
+ .sidebar,
8
+ .layout__aside {
9
+ background-color: #1d1e1f;
10
+ }
11
+
12
+ .sidebar {
13
+ border-right: 1px solid #363637;
14
+ }
15
+
16
+ .sidebar__search-results {
17
+ background-color: #1d1e1f;
18
+ border-color: #363637;
19
+ }
20
+
21
+ .sidebar__search-item:hover {
22
+ background-color: #262727;
23
+ }
24
+
25
+ .sidebar__search-item-title {
26
+ color: #cfd3dc;
27
+ }
28
+
29
+ .sidebar__search-item-parent {
30
+ color: #a3a6ad;
31
+ }
32
+
33
+ .sidebar__logo {
34
+ border-bottom-color: #363637;
35
+ }
36
+
37
+ .sidebar__user {
38
+ border-top-color: #363637;
39
+ }
40
+
41
+ .sidebar__user-name {
42
+ color: #cfd3dc;
43
+ }
44
+
45
+ .sidebar__user-role {
46
+ color: #a3a6ad;
47
+ }
48
+
49
+ // 菜单
50
+ .x-menu {
51
+ background-color: #1d1e1f !important;
52
+ border-color: #363637;
53
+ color: #cfd3dc;
54
+
55
+ &.x-menu--vertical {
56
+ border-right-color: #363637;
57
+ }
58
+
59
+ &.x-menu--horizontal {
60
+ border-bottom-color: #363637;
61
+ background-color: #1d1e1f !important;
62
+ }
63
+ }
64
+
65
+ .x-menu-item {
66
+ color: #cfd3dc !important;
67
+ background-color: transparent !important;
68
+
69
+ &:hover {
70
+ background-color: #262727 !important;
71
+ }
72
+
73
+ &.is-active {
74
+ color: #409eff !important;
75
+ background-color: rgba(64, 158, 255, 0.1) !important;
76
+
77
+ &::before {
78
+ background-color: #409eff;
79
+ }
80
+ }
81
+
82
+ // 水平模式下的菜单项
83
+ &.is-horizontal {
84
+ &:hover {
85
+ background-color: transparent !important;
86
+ }
87
+
88
+ &.is-active {
89
+ background-color: transparent !important;
90
+ border-bottom-color: #409eff;
91
+ }
92
+ }
93
+ }
94
+
95
+ .x-sub-menu {
96
+ &__title {
97
+ color: #cfd3dc !important;
98
+ background-color: transparent !important;
99
+
100
+ &:hover {
101
+ background-color: #262727 !important;
102
+ }
103
+ }
104
+
105
+ &__menu {
106
+ background-color: #1d1e1f !important;
107
+ border: 1px solid #363637;
108
+ box-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
109
+
110
+ // 子菜单中的菜单项
111
+ .x-menu-item {
112
+ background-color: transparent !important;
113
+ color: #cfd3dc !important;
114
+
115
+ &:hover {
116
+ background-color: #262727 !important;
117
+ }
118
+
119
+ &.is-active {
120
+ color: #409eff !important;
121
+ background-color: rgba(64, 158, 255, 0.1) !important;
122
+ }
123
+ }
124
+ }
125
+
126
+ &__arrow {
127
+ color: #a3a6ad;
128
+ }
129
+
130
+ &.is-opened > .x-sub-menu__title {
131
+ // 展开状态不设置背景色，避免与高亮状态混淆
132
+ }
133
+
134
+ &.is-active > .x-sub-menu__title {
135
+ color: #409eff !important;
136
+ }
137
+
138
+ // 水平模式下的子菜单
139
+ &--horizontal {
140
+ .x-sub-menu__title:hover {
141
+ background-color: transparent !important;
142
+ }
143
+
144
+ .x-sub-menu__menu {
145
+ background-color: #1d1e1f !important;
146
+ border: 1px solid #363637;
147
+ }
148
+ }
149
+
150
+ // 收起状态下的弹出菜单
151
+ &.is-collapse > .x-sub-menu__menu {
152
+ background-color: #1d1e1f !important;
153
+ border: 1px solid #363637;
154
+ }
155
+ }
156
+
157
+ // 顶部导航
158
+ .header {
159
+ background-color: #1d1e1f;
160
+ border-bottom-color: #363637;
161
+ }
162
+
163
+ .header__collapse {
164
+ color: #cfd3dc;
165
+ }
166
+
167
+ .header__breadcrumb {
168
+ color: #a3a6ad;
169
+ }
170
+
171
+ .header__user-name {
172
+ color: #cfd3dc;
173
+ }
174
+
175
+ .header__user-arrow {
176
+ color: #a3a6ad;
177
+ }
178
+
179
+ .header__action:hover {
180
+ background-color: #262727;
181
+ }
182
+
183
+ .header__user-trigger:hover {
184
+ background-color: #262727;
185
+ }
186
+
187
+ // 下拉菜单
188
+ .header__dropdown {
189
+ background-color: #1d1e1f;
190
+ border: 1px solid #363637;
191
+ box-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
192
+ }
193
+
194
+ .header__dropdown-name {
195
+ color: #e5eaf3;
196
+ }
197
+
198
+ .header__dropdown-role {
199
+ color: #a3a6ad;
200
+ }
201
+
202
+ .header__dropdown-divider {
203
+ background-color: #363637;
204
+ }
205
+
206
+ .header__dropdown-item {
207
+ color: #cfd3dc;
208
+
209
+ &:hover {
210
+ background-color: #262727;
211
+ color: #e5eaf3;
212
+ }
213
+ }
214
+
215
+ // 顶部菜单组件
216
+ .top-menu {
217
+ background-color: #1d1e1f;
218
+
219
+ &__menu {
220
+ background-color: #1d1e1f !important;
221
+ }
222
+
223
+ &__menu-char {
224
+ background-color: rgba(64, 158, 255, 0.2);
225
+ color: #79bbff;
226
+ }
227
+
228
+ &__action {
229
+ color: #cfd3dc;
230
+
231
+ &:hover {
232
+ background-color: #262727;
233
+ color: #409eff;
234
+ }
235
+ }
236
+
237
+ &__user-trigger:hover {
238
+ background-color: #262727;
239
+ }
240
+
241
+ &__user-name {
242
+ color: #cfd3dc;
243
+ }
244
+
245
+ &__user-arrow {
246
+ color: #a3a6ad;
247
+ }
248
+
249
+ &__dropdown {
250
+ background-color: #1d1e1f;
251
+ border: 1px solid #363637;
252
+ box-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
253
+ }
254
+
255
+ &__dropdown-name {
256
+ color: #e5eaf3;
257
+ }
258
+
259
+ &__dropdown-role {
260
+ color: #a3a6ad;
261
+ }
262
+
263
+ &__dropdown-divider {
264
+ background-color: #363637;
265
+ }
266
+
267
+ &__dropdown-item {
268
+ color: #cfd3dc;
269
+
270
+ &:hover {
271
+ background-color: #262727;
272
+ color: #e5eaf3;
273
+ }
274
+ }
275
+ }
276
+
277
+ // 按钮
278
+ .x-button {
279
+ &.x-button--default {
280
+ background-color: #1d1e1f;
281
+ border-color: #4c4d4f;
282
+ color: #cfd3dc;
283
+
284
+ &:hover {
285
+ border-color: #409eff;
286
+ color: #409eff;
287
+ }
288
+ }
289
+
290
+ &.x-button--text {
291
+ color: #409eff;
292
+ }
293
+ }
294
+
295
+ // 表单
296
+ .x-form-item__label {
297
+ color: #cfd3dc;
298
+ }
299
+
300
+ .x-form-item__error {
301
+ color: #f56c6c;
302
+ }
303
+
304
+ // 输入框
305
+ .x-input {
306
+ background-color: #1d1e1f;
307
+ border-color: #4c4d4f;
308
+
309
+ &.is-focus {
310
+ border-color: #409eff;
311
+ }
312
+
313
+ .x-input__inner {
314
+ background-color: transparent;
315
+ color: #e5eaf3;
316
+
317
+ &::placeholder {
318
+ color: #6c6e72;
319
+ }
320
+ }
321
+
322
+ .x-input__suffix,
323
+ .x-input__prefix {
324
+ color: #a3a6ad;
325
+ }
326
+ }
327
+
328
+ // 选择器
329
+ .x-select {
330
+ background-color: #1d1e1f;
331
+ border-color: #4c4d4f;
332
+ }
333
+
334
+ // 卡片
335
+ .x-card {
336
+ background-color: #1d1e1f;
337
+ border-color: #363637;
338
+ }
339
+
340
+ .x-card__header {
341
+ border-bottom-color: #363637;
342
+ color: #e5eaf3;
343
+ }
344
+
345
+ // 表格
346
+ .data-table {
347
+ th {
348
+ background-color: #262727;
349
+ color: #cfd3dc;
350
+ border-bottom-color: #363637;
351
+ }
352
+
353
+ td {
354
+ border-bottom-color: #363637;
355
+ color: #cfd3dc;
356
+ }
357
+
358
+ tr:hover td {
359
+ background-color: #262727;
360
+ }
361
+ }
362
+
363
+ // 弹窗
364
+ .x-modal {
365
+ &__wrapper {
366
+ background-color: rgba(0, 0, 0, 0.7);
367
+ }
368
+
369
+ &__container {
370
+ background-color: #1d1e1f;
371
+ border: 1px solid #363637;
372
+ }
373
+
374
+ &__header {
375
+ border-bottom-color: #363637;
376
+ color: #e5eaf3;
377
+ }
378
+
379
+ &__footer {
380
+ border-top-color: #363637;
381
+ }
382
+ }
383
+
384
+ // 消息提示
385
+ .x-message {
386
+ background-color: #1d1e1f;
387
+ border: 1px solid #363637;
388
+ }
389
+
390
+ // 标签
391
+ .x-tag {
392
+ &.x-tag--primary {
393
+ background-color: rgba(64, 158, 255, 0.2);
394
+ color: #79bbff;
395
+ border-color: rgba(64, 158, 255, 0.3);
396
+ }
397
+
398
+ &.x-tag--success {
399
+ background-color: rgba(103, 194, 58, 0.2);
400
+ color: #95d475;
401
+ border-color: rgba(103, 194, 58, 0.3);
402
+ }
403
+
404
+ &.x-tag--warning {
405
+ background-color: rgba(230, 162, 60, 0.2);
406
+ color: #eebe77;
407
+ border-color: rgba(230, 162, 60, 0.3);
408
+ }
409
+
410
+ &.x-tag--danger {
411
+ background-color: rgba(245, 108, 108, 0.2);
412
+ color: #fab6b6;
413
+ border-color: rgba(245, 108, 108, 0.3);
414
+ }
415
+
416
+ &.x-tag--info {
417
+ background-color: rgba(144, 147, 153, 0.2);
418
+ color: #c0c4cc;
419
+ border-color: rgba(144, 147, 153, 0.3);
420
+ }
421
+ }
422
+
423
+ // 开关
424
+ .x-switch {
425
+ background-color: #4c4d4f;
426
+
427
+ &.is-checked {
428
+ background-color: #409eff;
429
+ }
430
+ }
431
+
432
+ // 分页
433
+ .x-pagination {
434
+ color: #cfd3dc;
435
+
436
+ &__item {
437
+ background-color: #1d1e1f;
438
+ border-color: #4c4d4f;
439
+ color: #cfd3dc;
440
+
441
+ &:hover {
442
+ color: #409eff;
443
+ }
444
+
445
+ &.is-active {
446
+ background-color: #409eff;
447
+ border-color: #409eff;
448
+ color: #fff;
449
+ }
450
+ }
451
+ }
452
+
453
+ // 登录页面
454
+ .login {
455
+ background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
456
+ }
457
+
458
+ .login__container {
459
+ background-color: #1d1e1f;
460
+ border: 1px solid #363637;
461
+ }
462
+
463
+ .login__title {
464
+ color: #409eff;
465
+ }
466
+
467
+ .login__subtitle {
468
+ color: #a3a6ad;
469
+ }
470
+
471
+ .login__footer {
472
+ color: #6c6e72;
473
+ }
474
+
475
+ // 仪表盘
476
+ .stat-card__title {
477
+ color: #a3a6ad;
478
+ }
479
+
480
+ .quick-link {
481
+ background-color: #262727;
482
+
483
+ &:hover {
484
+ background-color: rgba(64, 158, 255, 0.1);
485
+ }
486
+
487
+ &__title {
488
+ color: #cfd3dc;
489
+ }
490
+ }
491
+
492
+ .activity-item {
493
+ border-bottom-color: #363637;
494
+
495
+ &__action {
496
+ color: #cfd3dc;
497
+ }
498
+ }
499
+
500
+ // 搜索卡片
501
+ .search-card {
502
+ background-color: #1d1e1f;
503
+ border: 1px solid #363637;
504
+ }
505
+
506
+ // 表格卡片
507
+ .table-card {
508
+ background-color: #1d1e1f;
509
+ border: 1px solid #363637;
510
+ }
511
+
512
+ // Popconfirm
513
+ .x-popconfirm {
514
+ background-color: #1d1e1f;
515
+ border: 1px solid #363637;
516
+ }
517
+
518
+ // Drawer 抽屉组件
519
+ .x-drawer {
520
+ background-color: #1d1e1f;
521
+
522
+ &__header {
523
+ background-color: #1d1e1f;
524
+ border-bottom-color: #363637;
525
+ color: #e5eaf3;
526
+ }
527
+
528
+ &__body {
529
+ background-color: #1d1e1f;
530
+ color: #cfd3dc;
531
+ }
532
+
533
+ &__footer {
534
+ background-color: #1d1e1f;
535
+ border-top-color: #363637;
536
+ }
537
+ }
538
+
539
+ // 设置抽屉内容
540
+ .settings-drawer {
541
+ .settings-title {
542
+ color: #e5eaf3;
543
+ }
544
+
545
+ .settings-section {
546
+ background-color: transparent;
547
+ }
548
+
549
+ .layout-option {
550
+ border-color: #4c4d4f;
551
+ background-color: transparent;
552
+
553
+ &:hover {
554
+ border-color: #409eff;
555
+ }
556
+
557
+ &.is-active {
558
+ border-color: #409eff;
559
+ background-color: rgba(64, 158, 255, 0.1);
560
+ }
561
+
562
+ &__label {
563
+ color: #cfd3dc;
564
+ }
565
+ }
566
+
567
+ .settings-switch-item {
568
+ span {
569
+ color: #cfd3dc;
570
+ }
571
+ }
572
+ }
573
+
574
+ // 混合顶部菜单
575
+ .mix-top-menu {
576
+ background-color: #1d1e1f;
577
+ border-bottom-color: #363637;
578
+
579
+ &__logo-text {
580
+ color: #409eff;
581
+ }
582
+
583
+ &__menu {
584
+ background-color: #1d1e1f !important;
585
+ }
586
+
587
+ &__menu-char {
588
+ color: #79bbff;
589
+ background-color: rgba(64, 158, 255, 0.2);
590
+ }
591
+
592
+ &__action {
593
+ color: #cfd3dc;
594
+
595
+ &:hover {
596
+ background-color: #262727;
597
+ color: #409eff;
598
+ }
599
+ }
600
+
601
+ &__user-trigger:hover {
602
+ background-color: #262727;
603
+ }
604
+
605
+ &__user-name {
606
+ color: #cfd3dc;
607
+ }
608
+
609
+ &__user-arrow {
610
+ color: #a3a6ad;
611
+ }
612
+
613
+ &__dropdown {
614
+ background-color: #1d1e1f;
615
+ border: 1px solid #363637;
616
+ box-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
617
+ }
618
+
619
+ &__dropdown-name {
620
+ color: #e5eaf3;
621
+ }
622
+
623
+ &__dropdown-role {
624
+ color: #a3a6ad;
625
+ }
626
+
627
+ &__dropdown-divider {
628
+ background-color: #363637;
629
+ }
630
+
631
+ &__dropdown-item {
632
+ color: #cfd3dc;
633
+
634
+ &:hover {
635
+ background-color: #262727;
636
+ color: #e5eaf3;
637
+ }
638
+ }
639
+ }
573
640
  }