@blueking/bk-user-selector 0.0.1-beta.2 → 0.0.2-9.beta.1

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.
package/vue2/vue2.css CHANGED
@@ -1,133 +1,3 @@
1
- :root {
2
- --bk-prefix: bk;
3
- --popover-max-height: 216px;
4
- --primary-color: #3a84ff;
5
- --success-color: #2dcb56;
6
- --warning-color: #ff9c01;
7
- --danger-color: #ea3636;
8
- --default-color: #63656e;
9
- --gray-color: #979ba5;
10
- --light-gray: #c4c6cc;
11
- --white-color: white;
12
- --whitesmoke-color: #fafbfd;
13
- --disable-color: #dcdee5;
14
- --disable-bg-color: #f9fafd;
15
- --border-color: #dcdee5;
16
- --font-size-base: 12px;
17
- --font-size-medium: 14px;
18
- --font-size-large: 16px;
19
- --line-height-base: 16px;
20
- --line-height-medium: 16px;
21
- --line-height-large: 18px;
22
- --component-size-small: 26px;
23
- --component-size-base: 32px;
24
- --component-size-large: 40px;
25
- --component-size-small-padding: 0 12px;
26
- --component-size-base-padding: 0 14px;
27
- --component-size-large-padding: 0 16px;
28
- --border-width-base: 1px;
29
- --border-style-base: solid;
30
- --border-radius-base: 2px;
31
- --border-style-color: var(--light-gray);
32
- --input-disabled-bg: #fafbfd;
33
- --input-disabled-border: var(--disable-color);
34
- --input-height-base: var(--component-size-base);
35
- --input-color: var(--default-color);
36
- --input-bg: white;
37
- --input-border-color: var(--light-gray);
38
- --input-broder-radius: 3px;
39
- --input-shadow-color: #a3c5fd;
40
- --input-horizontal-padding: 8px;
41
- --input-block-color: #f5f7fa;
42
- --input-block-hover-color: #eaebf0;
43
- --input-icon-size: var(--font-size-medium);
44
- --input-maxlength-color: #979ba5;
45
- --button-primary-hover-color: #5594fa;
46
- --button-danger-hover-color: #ff5656;
47
- --button-success-hover-color: #45e35f;
48
- --button-warning-hover-color: #ffb848;
49
- --button-default-hover-border-color: #979ba5;
50
- --button-primary-active-color: #2c77f4;
51
- --button-danger-active-color: #db2626;
52
- --button-success-active-color: #1ab943;
53
- --button-warning-active-color: #eb9000;
54
- --button-selected-bg-color: #e1ecff;
55
- --button-disabled-selected-bg-color: #f0f1f5;
56
- --radio-font-color: #63656e;
57
- --radio-active-color: #3a84ff;
58
- --radio-hover-border-color: #979ba5;
59
- --radio-disabled-border: #dcdee5;
60
- --radio-disabled-font-color: #c4c6cc;
61
- --radio-disabled-checked-bg: #a3c5fd;
62
- --radio-button-checked-bg: #e1ecff;
63
- --radio-button-disabled-checked-bg: #fafbfd;
64
- --checkbox-disabled-checked-bg: #a3c5fd;
65
- --fixed-navbar-background: #fff;
66
- --fixed-navbar-boxshadow-color: rgba(0, 0, 0, 0.1);
67
- --switch-default-color: #fff;
68
- --switch-grey-color: #c4c6cc;
69
- --breadcrumb-black-color: #979ba5;
70
- --breadcrumb-primary-hover-color: #0082ff;
71
- --breadcrumb-fn-main-color: #63656e;
72
- --link-default-hover-color: #979ba5;
73
- --link-primary-hover-color: #699df4;
74
- --link-success-hover-color: #45e35f;
75
- --link-warning-hover-color: #ffb848;
76
- --link-danger-hover-color: #ff5656;
77
- --link-default-disabled-color: #dcdee5;
78
- --link-primary-disabled-color: #a3c5fd;
79
- --link-success-disabled-color: #94f5a4;
80
- --link-warning-disabled-color: #ffd695;
81
- --link-danger-disabled-color: #fd9c9c;
82
- --message-color: var(--default-color);
83
- --message-primary-bg-color: #f0f8ff;
84
- --message-primary-border-color: #e1ecff;
85
- --message-primary-shadow-color: #e1e8f4;
86
- --message-warning-bg-color: #fff4e2;
87
- --message-warning-border-color: #ffe8c3;
88
- --message-warning-shadow-color: #ede6db;
89
- --message-success-bg-color: #f2fff4;
90
- --message-success-border-color: #dcffe2;
91
- --message-success-shadow-color: #cef0d7;
92
- --message-danger-bg-color: #ffeded;
93
- --message-danger-border-color: #ffdddd;
94
- --message-danger-shadow-color: #f6dada;
95
- --slider-default-bg: #dcdee5;
96
- --slider-disable-bar-bg: #979ba5;
97
- --menu-bg-color: #182132;
98
- --submenu-bg-color: #151d2c;
99
- --menu-active-bg-color: linear-gradient(90deg, #3f87ff 0%, #3a84ff 100%);
100
- --menu-color: #96a2b9;
101
- --menu-group-color: var(--default-color);
102
- --menu-width: 260px;
103
- --menu-collapse-width: 60px;
104
- --menu-active-color: white;
105
- --nav-header-bg-color: #182132;
106
- --nav-bg-color: #182132;
107
- --date-picker-disabled-bg: #fafbfd;
108
- --date-picker-dropdown-mb: 4px;
109
- --date-picker-dropdown-bg: #fff;
110
- --table-bg-color: var(--white-color);
111
- --table-border-color: #dcdee5;
112
- --table-strip-color: #fafbfd;
113
- --table-head-bg-color: #fafbfd;
114
- --table-head-font-color: #313238;
115
- --table-body-font-color: #63656e;
116
- --table-row-hover-bg-color: #f5f7fa;
117
- --table-row-active-bg-color: #f0f1f5;
118
- --cascader-panel-border-color: #dcdee5;
119
- --cascader-panel-hover: #f5f7fa;
120
- --cascader-panel-active: #e1ecff;
121
- --cascader-panel-disabled-bg: #fff;
122
- --search-select-focus-border-color: var(--primary-color);
123
- --search-select-focus-color: #3c96ff;
124
- --search-select-font-color: var(--default-color);
125
- --search-select-placeholder-color: var(--light-gray);
126
- --search-select-message-color: var(--danger-color);
127
- --search-select-menu-border-color: var(--disable-color);
128
- --select-active-color: #e1ecff;
129
- --select-hover-color: #f5f7fa;
130
- }
131
1
  .scroll-bar-style::-webkit-scrollbar {
132
2
  width: 4px;
133
3
  height: 4px;
@@ -437,136 +307,6 @@ optgroup {
437
307
  border-radius: 20px;
438
308
  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);
439
309
  }
440
- :root {
441
- --bk-prefix: bk;
442
- --popover-max-height: 216px;
443
- --primary-color: #3a84ff;
444
- --success-color: #2dcb56;
445
- --warning-color: #ff9c01;
446
- --danger-color: #ea3636;
447
- --default-color: #63656e;
448
- --gray-color: #979ba5;
449
- --light-gray: #c4c6cc;
450
- --white-color: white;
451
- --whitesmoke-color: #fafbfd;
452
- --disable-color: #dcdee5;
453
- --disable-bg-color: #f9fafd;
454
- --border-color: #dcdee5;
455
- --font-size-base: 12px;
456
- --font-size-medium: 14px;
457
- --font-size-large: 16px;
458
- --line-height-base: 16px;
459
- --line-height-medium: 16px;
460
- --line-height-large: 18px;
461
- --component-size-small: 26px;
462
- --component-size-base: 32px;
463
- --component-size-large: 40px;
464
- --component-size-small-padding: 0 12px;
465
- --component-size-base-padding: 0 14px;
466
- --component-size-large-padding: 0 16px;
467
- --border-width-base: 1px;
468
- --border-style-base: solid;
469
- --border-radius-base: 2px;
470
- --border-style-color: var(--light-gray);
471
- --input-disabled-bg: #fafbfd;
472
- --input-disabled-border: var(--disable-color);
473
- --input-height-base: var(--component-size-base);
474
- --input-color: var(--default-color);
475
- --input-bg: white;
476
- --input-border-color: var(--light-gray);
477
- --input-broder-radius: 3px;
478
- --input-shadow-color: #a3c5fd;
479
- --input-horizontal-padding: 8px;
480
- --input-block-color: #f5f7fa;
481
- --input-block-hover-color: #eaebf0;
482
- --input-icon-size: var(--font-size-medium);
483
- --input-maxlength-color: #979ba5;
484
- --button-primary-hover-color: #5594fa;
485
- --button-danger-hover-color: #ff5656;
486
- --button-success-hover-color: #45e35f;
487
- --button-warning-hover-color: #ffb848;
488
- --button-default-hover-border-color: #979ba5;
489
- --button-primary-active-color: #2c77f4;
490
- --button-danger-active-color: #db2626;
491
- --button-success-active-color: #1ab943;
492
- --button-warning-active-color: #eb9000;
493
- --button-selected-bg-color: #e1ecff;
494
- --button-disabled-selected-bg-color: #f0f1f5;
495
- --radio-font-color: #63656e;
496
- --radio-active-color: #3a84ff;
497
- --radio-hover-border-color: #979ba5;
498
- --radio-disabled-border: #dcdee5;
499
- --radio-disabled-font-color: #c4c6cc;
500
- --radio-disabled-checked-bg: #a3c5fd;
501
- --radio-button-checked-bg: #e1ecff;
502
- --radio-button-disabled-checked-bg: #fafbfd;
503
- --checkbox-disabled-checked-bg: #a3c5fd;
504
- --fixed-navbar-background: #fff;
505
- --fixed-navbar-boxshadow-color: rgba(0, 0, 0, 0.1);
506
- --switch-default-color: #fff;
507
- --switch-grey-color: #c4c6cc;
508
- --breadcrumb-black-color: #979ba5;
509
- --breadcrumb-primary-hover-color: #0082ff;
510
- --breadcrumb-fn-main-color: #63656e;
511
- --link-default-hover-color: #979ba5;
512
- --link-primary-hover-color: #699df4;
513
- --link-success-hover-color: #45e35f;
514
- --link-warning-hover-color: #ffb848;
515
- --link-danger-hover-color: #ff5656;
516
- --link-default-disabled-color: #dcdee5;
517
- --link-primary-disabled-color: #a3c5fd;
518
- --link-success-disabled-color: #94f5a4;
519
- --link-warning-disabled-color: #ffd695;
520
- --link-danger-disabled-color: #fd9c9c;
521
- --message-color: var(--default-color);
522
- --message-primary-bg-color: #f0f8ff;
523
- --message-primary-border-color: #e1ecff;
524
- --message-primary-shadow-color: #e1e8f4;
525
- --message-warning-bg-color: #fff4e2;
526
- --message-warning-border-color: #ffe8c3;
527
- --message-warning-shadow-color: #ede6db;
528
- --message-success-bg-color: #f2fff4;
529
- --message-success-border-color: #dcffe2;
530
- --message-success-shadow-color: #cef0d7;
531
- --message-danger-bg-color: #ffeded;
532
- --message-danger-border-color: #ffdddd;
533
- --message-danger-shadow-color: #f6dada;
534
- --slider-default-bg: #dcdee5;
535
- --slider-disable-bar-bg: #979ba5;
536
- --menu-bg-color: #182132;
537
- --submenu-bg-color: #151d2c;
538
- --menu-active-bg-color: linear-gradient(90deg, #3f87ff 0%, #3a84ff 100%);
539
- --menu-color: #96a2b9;
540
- --menu-group-color: var(--default-color);
541
- --menu-width: 260px;
542
- --menu-collapse-width: 60px;
543
- --menu-active-color: white;
544
- --nav-header-bg-color: #182132;
545
- --nav-bg-color: #182132;
546
- --date-picker-disabled-bg: #fafbfd;
547
- --date-picker-dropdown-mb: 4px;
548
- --date-picker-dropdown-bg: #fff;
549
- --table-bg-color: var(--white-color);
550
- --table-border-color: #dcdee5;
551
- --table-strip-color: #fafbfd;
552
- --table-head-bg-color: #fafbfd;
553
- --table-head-font-color: #313238;
554
- --table-body-font-color: #63656e;
555
- --table-row-hover-bg-color: #f5f7fa;
556
- --table-row-active-bg-color: #f0f1f5;
557
- --cascader-panel-border-color: #dcdee5;
558
- --cascader-panel-hover: #f5f7fa;
559
- --cascader-panel-active: #e1ecff;
560
- --cascader-panel-disabled-bg: #fff;
561
- --search-select-focus-border-color: var(--primary-color);
562
- --search-select-focus-color: #3c96ff;
563
- --search-select-font-color: var(--default-color);
564
- --search-select-placeholder-color: var(--light-gray);
565
- --search-select-message-color: var(--danger-color);
566
- --search-select-menu-border-color: var(--disable-color);
567
- --select-active-color: #e1ecff;
568
- --select-hover-color: #f5f7fa;
569
- }
570
310
  @keyframes loading-scale-animate {
571
311
  0% {
572
312
  transform: scale(1);
@@ -580,12 +320,12 @@ optgroup {
580
320
  background-color: transparent;
581
321
  }
582
322
  }
583
- .bk-transition .bk-fade-enter-active,
584
- .bk-transition .bk-fade-leave-active {
323
+ .bk-user-selector-transition .bk-user-selector-fade-enter-active,
324
+ .bk-user-selector-transition .bk-user-selector-fade-leave-active {
585
325
  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
586
326
  }
587
- .bk-transition .bk-fade-enter,
588
- .bk-transition .bk-fade-leave-to {
327
+ .bk-user-selector-transition .bk-user-selector-fade-enter,
328
+ .bk-user-selector-transition .bk-user-selector-fade-leave-to {
589
329
  opacity: 0;
590
330
  }
591
331
  .clearfix-style::after {
@@ -596,7 +336,7 @@ optgroup {
596
336
  content: '';
597
337
  visibility: hidden;
598
338
  }
599
- .bk-popper {
339
+ .bk-user-selector-popper {
600
340
  display: none;
601
341
  padding: 7px 14px;
602
342
  font-size: 12px;
@@ -604,62 +344,62 @@ optgroup {
604
344
  background: #333;
605
345
  border-radius: 4px;
606
346
  }
607
- .bk-popper.light {
347
+ .bk-user-selector-popper.light {
608
348
  color: #63656e;
609
349
  background: #fff;
610
350
  box-shadow: #dcdee5 0 0 6px 0;
611
351
  }
612
- .bk-popper .bk-popper-arrow,
613
- .bk-popper .bk-popper-arrow::before {
352
+ .bk-user-selector-popper .bk-user-selector-popper-arrow,
353
+ .bk-user-selector-popper .bk-user-selector-popper-arrow::before {
614
354
  position: absolute;
615
355
  width: 8px;
616
356
  height: 8px;
617
357
  background: inherit;
618
358
  }
619
- .bk-popper .bk-popper-arrow {
359
+ .bk-user-selector-popper .bk-user-selector-popper-arrow {
620
360
  visibility: hidden;
621
361
  }
622
- .bk-popper .bk-popper-arrow::before {
362
+ .bk-user-selector-popper .bk-user-selector-popper-arrow::before {
623
363
  content: '';
624
364
  visibility: visible;
625
365
  transform: rotate(45deg);
626
366
  }
627
- .bk-popper[data-show] {
367
+ .bk-user-selector-popper[data-show] {
628
368
  display: block;
629
369
  }
630
- .bk-popper[data-popper-placement^='top'] > .bk-popper-arrow {
370
+ .bk-user-selector-popper[data-popper-placement^='top'] > .bk-user-selector-popper-arrow {
631
371
  bottom: -4px;
632
372
  }
633
- .bk-popper[data-popper-placement^='bottom'] > .bk-popper-arrow {
373
+ .bk-user-selector-popper[data-popper-placement^='bottom'] > .bk-user-selector-popper-arrow {
634
374
  top: -4px;
635
375
  }
636
- .bk-popper[data-popper-placement^='left'] > .bk-popper-arrow {
376
+ .bk-user-selector-popper[data-popper-placement^='left'] > .bk-user-selector-popper-arrow {
637
377
  right: -4px;
638
378
  }
639
- .bk-popper[data-popper-placement^='right'] > .bk-popper-arrow {
379
+ .bk-user-selector-popper[data-popper-placement^='right'] > .bk-user-selector-popper-arrow {
640
380
  left: -4px;
641
381
  }
642
- .bk-loading-wrapper {
382
+ .bk-user-selector-loading-wrapper {
643
383
  position: static;
644
384
  vertical-align: middle;
645
385
  }
646
- .bk-loading-wrapper:not(.bk-nested-loading):not(.bk-directive-loading) {
386
+ .bk-user-selector-loading-wrapper:not(.bk-user-selector-nested-loading):not(.bk-user-selector-directive-loading) {
647
387
  display: inline-flex;
648
388
  }
649
- .bk-loading-wrapper.bk-directive-loading {
389
+ .bk-user-selector-loading-wrapper.bk-user-selector-directive-loading {
650
390
  width: 100%;
651
391
  height: 100%;
652
392
  }
653
- .bk-loading-wrapper.bk-directive-loading,
654
- .bk-loading-wrapper.bk-nested-loading {
393
+ .bk-user-selector-loading-wrapper.bk-user-selector-directive-loading,
394
+ .bk-user-selector-loading-wrapper.bk-user-selector-nested-loading {
655
395
  position: relative;
656
396
  }
657
- .bk-loading-wrapper.bk-directive-loading.is-block,
658
- .bk-loading-wrapper.bk-nested-loading.is-block {
397
+ .bk-user-selector-loading-wrapper.bk-user-selector-directive-loading.is-block,
398
+ .bk-user-selector-loading-wrapper.bk-user-selector-nested-loading.is-block {
659
399
  display: block;
660
400
  }
661
- .bk-loading-wrapper.bk-directive-loading .bk-loading-indicator,
662
- .bk-loading-wrapper.bk-nested-loading .bk-loading-indicator {
401
+ .bk-user-selector-loading-wrapper.bk-user-selector-directive-loading .bk-user-selector-loading-indicator,
402
+ .bk-user-selector-loading-wrapper.bk-user-selector-nested-loading .bk-user-selector-loading-indicator {
663
403
  position: absolute;
664
404
  top: 50%;
665
405
  left: 50%;
@@ -667,7 +407,7 @@ optgroup {
667
407
  text-align: center;
668
408
  transform: translate(-50%, -50%);
669
409
  }
670
- .bk-loading-wrapper .dot {
410
+ .bk-user-selector-loading-wrapper .dot {
671
411
  display: inline-flex;
672
412
  width: 14px;
673
413
  height: 14px;
@@ -679,878 +419,209 @@ optgroup {
679
419
  animation-name: loading-scale-animate;
680
420
  animation-direction: normal;
681
421
  }
682
- .bk-loading-wrapper .oval {
422
+ .bk-user-selector-loading-wrapper .oval {
683
423
  position: absolute;
684
424
  width: 6px;
685
425
  height: 8px;
686
- background-color: var(--default-color);
426
+ background-color: #63656e;
687
427
  border-radius: 8px;
688
428
  animation-duration: 1.2s;
689
429
  animation-iteration-count: infinite;
690
430
  animation-name: fade;
691
431
  transform-origin: center 24px;
692
432
  }
693
- .bk-loading-wrapper .bk-loading-mask {
433
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-mask {
694
434
  position: absolute;
695
435
  top: 0;
696
436
  left: 0;
697
437
  width: 100%;
698
438
  height: 100%;
699
439
  }
700
- .bk-loading-wrapper .bk-loading-indicator {
440
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator {
701
441
  display: flex;
702
442
  line-height: 1;
703
443
  text-align: center;
704
444
  flex-direction: column;
705
445
  }
706
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .oval,
707
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot,
708
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-1,
709
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-2,
710
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-3,
711
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-4 {
712
- background-color: var(--success-color);
713
- }
714
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .oval,
715
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot,
716
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-1,
717
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-2,
718
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-3,
719
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-4 {
720
- background-color: var(--danger-color);
721
- }
722
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .oval,
723
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot,
724
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-1,
725
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-2,
726
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-3,
727
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-4 {
728
- background-color: var(--warning-color);
729
- }
730
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .oval,
731
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot,
732
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-1,
733
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-2,
734
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-3,
735
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-4 {
736
- background-color: var(--primary-color);
737
- }
738
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .oval,
739
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot,
740
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-1,
741
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-2,
742
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-3,
743
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-4 {
744
- background-color: var(--white-color);
745
- }
746
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .oval,
747
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot,
748
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-1,
749
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-2,
750
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-3,
751
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-4 {
752
- background-color: var(--light-gray);
753
- }
754
- .bk-loading-wrapper .bk-loading-indicator .dot-1 {
755
- background-color: var(--danger-color);
446
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .oval,
447
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot,
448
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-1,
449
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-2,
450
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-3,
451
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-success .dot-4 {
452
+ background-color: #2dcb56;
453
+ }
454
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .oval,
455
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot,
456
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-1,
457
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-2,
458
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-3,
459
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-danger .dot-4 {
460
+ background-color: #ea3636;
461
+ }
462
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .oval,
463
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot,
464
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-1,
465
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-2,
466
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-3,
467
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-warning .dot-4 {
468
+ background-color: #ff9c01;
469
+ }
470
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .oval,
471
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot,
472
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-1,
473
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-2,
474
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-3,
475
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-primary .dot-4 {
476
+ background-color: #3a84ff;
477
+ }
478
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .oval,
479
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot,
480
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-1,
481
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-2,
482
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-3,
483
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-white .dot-4 {
484
+ background-color: white;
485
+ }
486
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .oval,
487
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot,
488
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-1,
489
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-2,
490
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-3,
491
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-default .dot-4 {
492
+ background-color: #c4c6cc;
493
+ }
494
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-1 {
495
+ background-color: #ea3636;
756
496
  animation-delay: 0.1s;
757
497
  }
758
- .bk-loading-wrapper .bk-loading-indicator .dot-2 {
759
- background-color: var(--warning-color);
498
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-2 {
499
+ background-color: #ff9c01;
760
500
  animation-delay: 0.25s;
761
501
  }
762
- .bk-loading-wrapper .bk-loading-indicator .dot-3 {
763
- background-color: var(--success-color);
502
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-3 {
503
+ background-color: #2dcb56;
764
504
  animation-delay: 0.4s;
765
505
  }
766
- .bk-loading-wrapper .bk-loading-indicator .dot-4 {
767
- background-color: var(--primary-color);
506
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .dot-4 {
507
+ background-color: #3a84ff;
768
508
  animation-delay: 0.55s;
769
509
  margin-right: 0px;
770
510
  }
771
- .bk-loading-wrapper .bk-loading-indicator .oval-1 {
511
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-1 {
772
512
  transform: rotate(135deg);
773
513
  animation-delay: -0.45s;
774
514
  }
775
- .bk-loading-wrapper .bk-loading-indicator .oval-2 {
515
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-2 {
776
516
  transform: rotate(90deg);
777
517
  animation-delay: -0.6s;
778
518
  }
779
- .bk-loading-wrapper .bk-loading-indicator .oval-3 {
519
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-3 {
780
520
  transform: rotate(45deg);
781
521
  animation-delay: -0.75s;
782
522
  }
783
- .bk-loading-wrapper .bk-loading-indicator .oval-4 {
523
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-4 {
784
524
  transform: rotate(0deg);
785
525
  animation-delay: -0.9s;
786
526
  }
787
- .bk-loading-wrapper .bk-loading-indicator .oval-5 {
527
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-5 {
788
528
  transform: rotate(-45deg);
789
529
  animation-delay: -1.05s;
790
530
  }
791
- .bk-loading-wrapper .bk-loading-indicator .oval-6 {
531
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-6 {
792
532
  transform: rotate(-90deg);
793
533
  animation-delay: -1.2s;
794
534
  }
795
- .bk-loading-wrapper .bk-loading-indicator .oval-7 {
535
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-7 {
796
536
  transform: rotate(-135deg);
797
537
  animation-delay: -1.35s;
798
538
  }
799
- .bk-loading-wrapper .bk-loading-indicator .oval-8 {
539
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .oval-8 {
800
540
  transform: rotate(-180deg);
801
541
  animation-delay: -1.5s;
802
542
  }
803
- .bk-loading-wrapper .bk-loading-indicator .bk-normal-indicator {
543
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-normal-indicator {
804
544
  display: inline-flex;
805
545
  justify-content: center;
806
546
  }
807
- .bk-loading-wrapper .bk-loading-indicator .bk-spin-indicator {
547
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-spin-indicator {
808
548
  position: relative;
809
549
  display: inline-flex;
810
550
  justify-content: center;
811
551
  width: 48px;
812
552
  height: 48px;
813
553
  }
814
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .bk-spin-indicator {
554
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-spin-indicator {
815
555
  height: 16px;
816
556
  width: 16px;
817
557
  }
818
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .dot {
558
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot {
819
559
  width: 3px;
820
560
  height: 3px;
821
561
  margin-right: 3px;
822
562
  }
823
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .dot.dot-4 {
563
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .dot.dot-4 {
824
564
  margin-right: 0;
825
565
  }
826
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .oval {
566
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .oval {
827
567
  width: 2px;
828
568
  height: 3px;
829
569
  border-radius: 3px;
830
570
  transform-origin: center 8px;
831
571
  }
832
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .bk-loading-title {
833
- font-size: var(--font-size-medium);
572
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-mini .bk-user-selector-loading-title {
573
+ font-size: 14px;
834
574
  }
835
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .bk-spin-indicator {
575
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-spin-indicator {
836
576
  height: 32px;
837
577
  width: 32px;
838
578
  }
839
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .dot {
579
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot {
840
580
  width: 6px;
841
581
  height: 6px;
842
582
  margin-right: 6px;
843
583
  }
844
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .dot.dot-4 {
584
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .dot.dot-4 {
845
585
  margin-right: 0;
846
586
  }
847
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .oval {
587
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .oval {
848
588
  width: 4px;
849
589
  height: 5px;
850
590
  border-radius: 5px;
851
591
  transform-origin: center 16px;
852
592
  }
853
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .bk-loading-title {
854
- font-size: var(--font-size-base);
593
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-small .bk-user-selector-loading-title {
594
+ font-size: 12px;
855
595
  }
856
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .bk-spin-indicator {
596
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-spin-indicator {
857
597
  height: 68px;
858
598
  width: 68px;
859
599
  }
860
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .dot {
600
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot {
861
601
  width: 20px;
862
602
  height: 20px;
863
603
  margin-right: 12px;
864
604
  }
865
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .dot.dot-4 {
605
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .dot.dot-4 {
866
606
  margin-right: 0;
867
607
  }
868
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .oval {
608
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .oval {
869
609
  width: 8px;
870
610
  height: 12px;
871
611
  border-radius: 12px;
872
612
  transform-origin: center 34px;
873
613
  }
874
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .bk-loading-title {
875
- font-size: var(--font-size-medium);
614
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator.bk-user-selector-loading-size-large .bk-user-selector-loading-title {
615
+ font-size: 14px;
876
616
  }
877
- .bk-loading-wrapper .bk-loading-indicator .bk-loading-title {
617
+ .bk-user-selector-loading-wrapper .bk-user-selector-loading-indicator .bk-user-selector-loading-title {
878
618
  margin-top: 8px;
879
- font-size: var(--font-size-medium);
619
+ font-size: 14px;
880
620
  line-height: normal;
881
- color: var(--default-color);
882
- text-align: center;
883
- }
884
- :root {
885
- --bk-prefix: bk;
886
- --popover-max-height: 216px;
887
- --primary-color: #3a84ff;
888
- --success-color: #2dcb56;
889
- --warning-color: #ff9c01;
890
- --danger-color: #ea3636;
891
- --default-color: #63656e;
892
- --gray-color: #979ba5;
893
- --light-gray: #c4c6cc;
894
- --white-color: white;
895
- --whitesmoke-color: #fafbfd;
896
- --disable-color: #dcdee5;
897
- --disable-bg-color: #f9fafd;
898
- --border-color: #dcdee5;
899
- --font-size-base: 12px;
900
- --font-size-medium: 14px;
901
- --font-size-large: 16px;
902
- --line-height-base: 16px;
903
- --line-height-medium: 16px;
904
- --line-height-large: 18px;
905
- --component-size-small: 26px;
906
- --component-size-base: 32px;
907
- --component-size-large: 40px;
908
- --component-size-small-padding: 0 12px;
909
- --component-size-base-padding: 0 14px;
910
- --component-size-large-padding: 0 16px;
911
- --border-width-base: 1px;
912
- --border-style-base: solid;
913
- --border-radius-base: 2px;
914
- --border-style-color: var(--light-gray);
915
- --input-disabled-bg: #fafbfd;
916
- --input-disabled-border: var(--disable-color);
917
- --input-height-base: var(--component-size-base);
918
- --input-color: var(--default-color);
919
- --input-bg: white;
920
- --input-border-color: var(--light-gray);
921
- --input-broder-radius: 3px;
922
- --input-shadow-color: #a3c5fd;
923
- --input-horizontal-padding: 8px;
924
- --input-block-color: #f5f7fa;
925
- --input-block-hover-color: #eaebf0;
926
- --input-icon-size: var(--font-size-medium);
927
- --input-maxlength-color: #979ba5;
928
- --button-primary-hover-color: #5594fa;
929
- --button-danger-hover-color: #ff5656;
930
- --button-success-hover-color: #45e35f;
931
- --button-warning-hover-color: #ffb848;
932
- --button-default-hover-border-color: #979ba5;
933
- --button-primary-active-color: #2c77f4;
934
- --button-danger-active-color: #db2626;
935
- --button-success-active-color: #1ab943;
936
- --button-warning-active-color: #eb9000;
937
- --button-selected-bg-color: #e1ecff;
938
- --button-disabled-selected-bg-color: #f0f1f5;
939
- --radio-font-color: #63656e;
940
- --radio-active-color: #3a84ff;
941
- --radio-hover-border-color: #979ba5;
942
- --radio-disabled-border: #dcdee5;
943
- --radio-disabled-font-color: #c4c6cc;
944
- --radio-disabled-checked-bg: #a3c5fd;
945
- --radio-button-checked-bg: #e1ecff;
946
- --radio-button-disabled-checked-bg: #fafbfd;
947
- --checkbox-disabled-checked-bg: #a3c5fd;
948
- --fixed-navbar-background: #fff;
949
- --fixed-navbar-boxshadow-color: rgba(0, 0, 0, 0.1);
950
- --switch-default-color: #fff;
951
- --switch-grey-color: #c4c6cc;
952
- --breadcrumb-black-color: #979ba5;
953
- --breadcrumb-primary-hover-color: #0082ff;
954
- --breadcrumb-fn-main-color: #63656e;
955
- --link-default-hover-color: #979ba5;
956
- --link-primary-hover-color: #699df4;
957
- --link-success-hover-color: #45e35f;
958
- --link-warning-hover-color: #ffb848;
959
- --link-danger-hover-color: #ff5656;
960
- --link-default-disabled-color: #dcdee5;
961
- --link-primary-disabled-color: #a3c5fd;
962
- --link-success-disabled-color: #94f5a4;
963
- --link-warning-disabled-color: #ffd695;
964
- --link-danger-disabled-color: #fd9c9c;
965
- --message-color: var(--default-color);
966
- --message-primary-bg-color: #f0f8ff;
967
- --message-primary-border-color: #e1ecff;
968
- --message-primary-shadow-color: #e1e8f4;
969
- --message-warning-bg-color: #fff4e2;
970
- --message-warning-border-color: #ffe8c3;
971
- --message-warning-shadow-color: #ede6db;
972
- --message-success-bg-color: #f2fff4;
973
- --message-success-border-color: #dcffe2;
974
- --message-success-shadow-color: #cef0d7;
975
- --message-danger-bg-color: #ffeded;
976
- --message-danger-border-color: #ffdddd;
977
- --message-danger-shadow-color: #f6dada;
978
- --slider-default-bg: #dcdee5;
979
- --slider-disable-bar-bg: #979ba5;
980
- --menu-bg-color: #182132;
981
- --submenu-bg-color: #151d2c;
982
- --menu-active-bg-color: linear-gradient(90deg, #3f87ff 0%, #3a84ff 100%);
983
- --menu-color: #96a2b9;
984
- --menu-group-color: var(--default-color);
985
- --menu-width: 260px;
986
- --menu-collapse-width: 60px;
987
- --menu-active-color: white;
988
- --nav-header-bg-color: #182132;
989
- --nav-bg-color: #182132;
990
- --date-picker-disabled-bg: #fafbfd;
991
- --date-picker-dropdown-mb: 4px;
992
- --date-picker-dropdown-bg: #fff;
993
- --table-bg-color: var(--white-color);
994
- --table-border-color: #dcdee5;
995
- --table-strip-color: #fafbfd;
996
- --table-head-bg-color: #fafbfd;
997
- --table-head-font-color: #313238;
998
- --table-body-font-color: #63656e;
999
- --table-row-hover-bg-color: #f5f7fa;
1000
- --table-row-active-bg-color: #f0f1f5;
1001
- --cascader-panel-border-color: #dcdee5;
1002
- --cascader-panel-hover: #f5f7fa;
1003
- --cascader-panel-active: #e1ecff;
1004
- --cascader-panel-disabled-bg: #fff;
1005
- --search-select-focus-border-color: var(--primary-color);
1006
- --search-select-focus-color: #3c96ff;
1007
- --search-select-font-color: var(--default-color);
1008
- --search-select-placeholder-color: var(--light-gray);
1009
- --search-select-message-color: var(--danger-color);
1010
- --search-select-menu-border-color: var(--disable-color);
1011
- --select-active-color: #e1ecff;
1012
- --select-hover-color: #f5f7fa;
1013
- }
1014
- @keyframes loading-scale-animate {
1015
- 0% {
1016
- transform: scale(1);
1017
- }
1018
- 100% {
1019
- transform: scale(0.6);
1020
- }
1021
- }
1022
- @keyframes fade {
1023
- 100% {
1024
- background-color: transparent;
1025
- }
1026
- }
1027
- .bk-transition .bk-fade-enter-active,
1028
- .bk-transition .bk-fade-leave-active {
1029
- transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
1030
- }
1031
- .bk-transition .bk-fade-enter,
1032
- .bk-transition .bk-fade-leave-to {
1033
- opacity: 0;
1034
- }
1035
- .clearfix-style::after {
1036
- display: block;
1037
- height: 0;
1038
- clear: both;
1039
- font-size: 0;
1040
- content: '';
1041
- visibility: hidden;
1042
- }
1043
- .bk-popper {
1044
- display: none;
1045
- padding: 7px 14px;
1046
- font-size: 12px;
1047
- color: #fff;
1048
- background: #333;
1049
- border-radius: 4px;
1050
- }
1051
- .bk-popper.light {
1052
621
  color: #63656e;
1053
- background: #fff;
1054
- box-shadow: #dcdee5 0 0 6px 0;
1055
- }
1056
- .bk-popper .bk-popper-arrow,
1057
- .bk-popper .bk-popper-arrow::before {
1058
- position: absolute;
1059
- width: 8px;
1060
- height: 8px;
1061
- background: inherit;
1062
- }
1063
- .bk-popper .bk-popper-arrow {
1064
- visibility: hidden;
1065
- }
1066
- .bk-popper .bk-popper-arrow::before {
1067
- content: '';
1068
- visibility: visible;
1069
- transform: rotate(45deg);
1070
- }
1071
- .bk-popper[data-show] {
1072
- display: block;
1073
- }
1074
- .bk-popper[data-popper-placement^='top'] > .bk-popper-arrow {
1075
- bottom: -4px;
1076
- }
1077
- .bk-popper[data-popper-placement^='bottom'] > .bk-popper-arrow {
1078
- top: -4px;
1079
- }
1080
- .bk-popper[data-popper-placement^='left'] > .bk-popper-arrow {
1081
- right: -4px;
1082
- }
1083
- .bk-popper[data-popper-placement^='right'] > .bk-popper-arrow {
1084
- left: -4px;
1085
- }
1086
- .bk-textarea {
1087
- --textarea-line-height: 20px;
1088
- display: inline-flex;
1089
- width: 100%;
1090
- overflow: hidden;
1091
- font-size: var(--font-size-base);
1092
- line-height: var(--textarea-line-height);
1093
- color: var(--input-color);
1094
- background-color: white;
1095
- border: var(--border-width-base) var(--border-style-base) var(--input-border-color);
1096
- border-radius: var(--border-radius-base);
1097
- box-sizing: border-box;
1098
- transition: all 0.3s;
1099
- flex-direction: column;
1100
- }
1101
- .bk-textarea ::placeholder {
1102
- font-size: var(--font-size-base);
1103
- color: var(--light-gray);
1104
- }
1105
- .bk-textarea.resizable {
1106
- resize: both;
1107
- }
1108
- .bk-textarea ::-webkit-scrollbar {
1109
- -webkit-appearance: none;
1110
- width: 3px;
1111
- }
1112
- .bk-textarea ::-webkit-scrollbar-thumb {
1113
- border-radius: 4px;
1114
- background-color: #DCDEE5;
1115
- }
1116
- .bk-textarea.is-disabled,
1117
- .bk-textarea.is-readonly {
1118
- background-color: var(--input-disabled-bg);
1119
- border-color: var(--disable-color);
1120
- }
1121
- .bk-textarea.is-disabled .bk-input--prefix-area,
1122
- .bk-textarea.is-readonly .bk-input--prefix-area,
1123
- .bk-textarea.is-disabled .bk-input--suffix-area,
1124
- .bk-textarea.is-readonly .bk-input--suffix-area,
1125
- .bk-textarea.is-disabled .bk-input--suffix-icon,
1126
- .bk-textarea.is-readonly .bk-input--suffix-icon {
1127
- cursor: not-allowed;
1128
- background-color: var(--input-disabled-bg);
1129
- }
1130
- .bk-textarea.is-disabled input,
1131
- .bk-textarea.is-readonly input,
1132
- .bk-textarea.is-disabled textarea,
1133
- .bk-textarea.is-readonly textarea {
1134
- cursor: not-allowed;
1135
- background-color: var(--input-disabled-bg);
1136
- opacity: 1;
1137
- }
1138
- .bk-textarea.is-readonly input,
1139
- .bk-textarea.is-readonly textarea {
1140
- cursor: auto;
1141
- }
1142
- .bk-textarea > textarea {
1143
- width: 100%;
1144
- padding: 5px 10px;
1145
- line-height: 1.5;
1146
- text-align: left;
1147
- border: 0;
1148
- border-radius: var(--border-radius-base);
1149
- outline: none;
1150
- resize: none;
1151
- }
1152
- .bk-textarea--max-length {
1153
- padding-right: var(--input-horizontal-padding);
1154
- margin: 0;
1155
- margin-left: auto;
1156
- font-size: var(--font-size-base);
1157
- text-align: right;
1158
- transform: scale(0.8);
1159
- justify-content: flex-end;
1160
- }
1161
- .bk-textarea--max-length.is-over-limit {
1162
- color: var(--danger-color);
1163
- }
1164
- .bk-textarea--max-length span {
1165
- color: var(--input-maxlength-color);
1166
- }
1167
- .bk-textarea.is-focused:not(.is-readonly) {
1168
- border-color: var(--primary-color);
1169
- outline: 0;
1170
- box-shadow: 0px 0px 3px 0px var(--input-shadow-color);
1171
- }
1172
- .bk-input {
1173
- display: inline-flex;
1174
- align-items: stretch;
1175
- width: 100%;
1176
- height: var(--input-height-base);
1177
- font-size: var(--font-size-base);
1178
- border: var(--border-width-base) var(--border-style-base) var(--input-border-color);
1179
- border-radius: var(--border-radius-base);
1180
- transition: all 0.3s;
1181
- }
1182
- .bk-input ::placeholder {
1183
- font-size: var(--font-size-base);
1184
- color: var(--light-gray);
1185
- }
1186
- .bk-input.is-disabled,
1187
- .bk-input.is-readonly {
1188
- background-color: var(--input-disabled-bg);
1189
- border-color: var(--disable-color);
1190
- }
1191
- .bk-input.is-disabled .bk-input--prefix-area,
1192
- .bk-input.is-readonly .bk-input--prefix-area,
1193
- .bk-input.is-disabled .bk-input--suffix-area,
1194
- .bk-input.is-readonly .bk-input--suffix-area,
1195
- .bk-input.is-disabled .bk-input--suffix-icon,
1196
- .bk-input.is-readonly .bk-input--suffix-icon {
1197
- cursor: not-allowed;
1198
- background-color: var(--input-disabled-bg);
1199
- }
1200
- .bk-input.is-disabled input,
1201
- .bk-input.is-readonly input,
1202
- .bk-input.is-disabled textarea,
1203
- .bk-input.is-readonly textarea {
1204
- cursor: not-allowed;
1205
- background-color: var(--input-disabled-bg);
1206
- opacity: 1;
1207
- }
1208
- .bk-input.is-readonly input,
1209
- .bk-input.is-readonly textarea {
1210
- cursor: auto;
1211
- }
1212
- .bk-input:hover:not(.is-disabled) {
1213
- border-color: var(--gray-color);
1214
- }
1215
- .bk-input:hover:not(.is-disabled) .show-clear-only-hover {
1216
- display: flex;
1217
- }
1218
- .bk-input.is-simplicity {
1219
- background-color: transparent;
1220
- border-color: transparent;
1221
- border-bottom-color: var(--input-border-color);
1222
- }
1223
- .bk-input.is-simplicity:hover:not(.is-disabled) {
1224
- background-color: var(--input-block-color);
1225
- border-color: transparent;
1226
- border-bottom-color: var(--light-gray);
1227
- box-shadow: none;
1228
- }
1229
- .bk-input.is-simplicity:hover:not(.is-disabled) .bk-input--text,
1230
- .bk-input.is-simplicity:hover:not(.is-disabled) .bk-input--suffix-icon {
1231
- background-color: var(--input-block-color);
1232
- }
1233
- .bk-input--suffix-icon {
1234
- display: flex;
1235
- height: 100%;
1236
- padding-right: var(--input-horizontal-padding);
1237
- font-size: var(--input-icon-size);
1238
- color: var(--light-gray);
1239
- background-color: var(--input-bg);
1240
- align-items: center;
1241
- align-self: center;
1242
- flex-shrink: 0;
1243
- cursor: pointer;
1244
- }
1245
- .bk-input--suffix-icon:hover {
1246
- color: #313238;
1247
- }
1248
- .bk-input--suffix-icon.show-clear-only-hover {
1249
- display: none;
1250
- }
1251
- .bk-input--clear-icon {
1252
- cursor: pointer;
1253
- flex-shrink: 0;
1254
- }
1255
- .bk-input--clear-icon:hover {
1256
- color: var(--gray-color);
1257
- }
1258
- .bk-input--large {
1259
- height: var(--component-size-large);
1260
- font-size: var(--font-size-medium);
1261
- }
1262
- .bk-input--large ::placeholder {
1263
- font-size: var(--font-size-medium);
1264
- color: var(--light-gray);
1265
- }
1266
- .bk-input--large .bk-input--max-length {
1267
- font-size: var(--font-size-large);
1268
- }
1269
- .bk-input--large .bk-input--number-control span:first-child {
1270
- margin-bottom: 4px;
1271
- }
1272
- .bk-input--small {
1273
- height: var(--component-size-small);
1274
- font-size: var(--font-size-base);
1275
- }
1276
- .bk-input--small .bk-input--max-length {
1277
- font-size: var(--font-size-base);
1278
- }
1279
- .bk-input--default {
1280
- font-size: var(--font-size-base);
1281
- }
1282
- .bk-input--default .bk-input--max-length {
1283
- font-size: var(--font-size-base);
1284
- }
1285
- .bk-input.is-focused:not(.is-readonly) {
1286
- border-color: var(--primary-color);
1287
- outline: 0;
1288
- box-shadow: 0px 0px 3px 0px var(--input-shadow-color);
1289
- }
1290
- .bk-input.is-focused:not(.is-readonly).is-simplicity {
1291
- border-color: transparent;
1292
- border-bottom-color: var(--primary-color);
1293
- box-shadow: none;
1294
- }
1295
- .bk-input.is-focused:not(.is-readonly).is-simplicity .bk-input--text,
1296
- .bk-input.is-focused:not(.is-readonly).is-simplicity .bk-input--suffix-icon {
1297
- background-color: var(--input-block-color);
1298
- }
1299
- .bk-input--prefix-area,
1300
- .bk-input--suffix-area {
1301
- display: flex;
1302
- padding: 0 var(--input-horizontal-padding);
1303
- color: var(--default-color);
1304
- background-color: var(--input-block-color);
1305
- border-right: 1px solid var(--input-border-color);
1306
- align-items: center;
1307
- }
1308
- .bk-input--suffix-area {
1309
- border: 0;
1310
- border-left: 1px solid var(--input-border-color);
1311
- }
1312
- .bk-input--max-length {
1313
- align-self: center;
1314
- padding-right: var(--input-horizontal-padding);
1315
- font-size: 12px;
1316
- transform: scale(0.8);
1317
- }
1318
- .bk-input--max-length.is-over-limit {
1319
- color: var(--danger-color);
1320
- }
1321
- .bk-input--max-length span {
1322
- color: var(--input-maxlength-color);
1323
- }
1324
- .bk-input--text {
1325
- width: 100%;
1326
- padding: 0 var(--input-horizontal-padding);
1327
- overflow: hidden;
1328
- line-height: 1;
1329
- color: var(--input-color);
1330
- text-overflow: ellipsis;
1331
- white-space: nowrap;
1332
- background-color: var(--input-bg);
1333
- background-image: none;
1334
- border: none;
1335
- border-radius: var(--border-radius-base);
1336
- outline: none;
1337
- box-sizing: border-box;
1338
- transition: all 0.3s;
1339
- flex: 1;
1340
- }
1341
- .bk-input--text[type='search']::-webkit-search-decoration,
1342
- .bk-input--text[type='search']::-webkit-search-cancel-button,
1343
- .bk-input--text[type='search']::-webkit-search-results-button,
1344
- .bk-input--text[type='search']::-webkit-search-results-decoration {
1345
- appearance: none;
1346
- }
1347
- .bk-input--text [type='search']::-ms-clear {
1348
- display: none;
1349
- width: 0;
1350
- height: 0;
1351
- }
1352
- .bk-input--text [type='search']::-ms-reveal {
1353
- display: none;
1354
- width: 0;
1355
- height: 0;
1356
- }
1357
- .bk-input--text[type='number']::-webkit-inner-spin-button,
1358
- .bk-input--text[type='number']::-webkit-outer-spin-button {
1359
- margin: 0;
1360
- appearance: none;
1361
- }
1362
- .bk-input--number-control {
1363
- display: flex;
1364
- width: 26px;
1365
- height: 100%;
1366
- padding: 4px 0;
1367
- font-size: 0;
1368
- user-select: none;
1369
- flex-direction: column;
1370
- align-items: center;
1371
- }
1372
- .bk-input--number-control span {
1373
- display: flex;
1374
- overflow: hidden;
1375
- line-height: 1;
1376
- color: var(--gray-color);
1377
622
  text-align: center;
1378
- cursor: pointer;
1379
- background-color: var(--input-block-color);
1380
- flex: 1;
1381
- align-items: center;
1382
- }
1383
- .bk-input--number-control span.is-disabled {
1384
- color: var(--light-gray);
1385
- cursor: not-allowed;
1386
- }
1387
- .bk-input--number-control svg {
1388
- font-size: var(--input-icon-size);
1389
- }
1390
- .bk-input--number-control span:first-child {
1391
- transform: rotate(180deg);
1392
- }
1393
- .bk-input--number-control span:not(.is-disabled):hover {
1394
- background-color: var(--input-block-hover-color);
1395
- }
1396
- /* 针对 Chrome、Safari 和新版 Edge 的样式 */
1397
- input:-webkit-autofill,
1398
- input:-webkit-autofill:hover,
1399
- input:-webkit-autofill:focus,
1400
- input:-webkit-autofill:active {
1401
- -webkit-box-shadow: 0 0 0 100px var(--input-bg) inset !important;
1402
- box-shadow: 0 0 0 100px var(--input-bg) inset !important;
1403
- }
1404
- /* 针对 Firefox 的样式 */
1405
- input:-moz-autofill,
1406
- input:-moz-autofill:hover,
1407
- input:-moz-autofill:focus,
1408
- input:-moz-autofill:active {
1409
- -moz-box-shadow: 0 0 0 100px var(--input-bg) inset !important;
1410
- box-shadow: 0 0 0 100px var(--input-bg) inset !important;
1411
- }
1412
- .text-ov {
1413
- overflow: hidden;
1414
- text-overflow: ellipsis;
1415
- white-space: nowrap;
1416
- }
1417
- .position-relative {
1418
- position: relative;
1419
623
  }
1420
- .position-absolute {
1421
- position: absolute;
1422
- }
1423
- :root {
1424
- --bk-prefix: bk;
1425
- --popover-max-height: 216px;
1426
- --primary-color: #3a84ff;
1427
- --success-color: #2dcb56;
1428
- --warning-color: #ff9c01;
1429
- --danger-color: #ea3636;
1430
- --default-color: #63656e;
1431
- --gray-color: #979ba5;
1432
- --light-gray: #c4c6cc;
1433
- --white-color: white;
1434
- --whitesmoke-color: #fafbfd;
1435
- --disable-color: #dcdee5;
1436
- --disable-bg-color: #f9fafd;
1437
- --border-color: #dcdee5;
1438
- --font-size-base: 12px;
1439
- --font-size-medium: 14px;
1440
- --font-size-large: 16px;
1441
- --line-height-base: 16px;
1442
- --line-height-medium: 16px;
1443
- --line-height-large: 18px;
1444
- --component-size-small: 26px;
1445
- --component-size-base: 32px;
1446
- --component-size-large: 40px;
1447
- --component-size-small-padding: 0 12px;
1448
- --component-size-base-padding: 0 14px;
1449
- --component-size-large-padding: 0 16px;
1450
- --border-width-base: 1px;
1451
- --border-style-base: solid;
1452
- --border-radius-base: 2px;
1453
- --border-style-color: var(--light-gray);
1454
- --input-disabled-bg: #fafbfd;
1455
- --input-disabled-border: var(--disable-color);
1456
- --input-height-base: var(--component-size-base);
1457
- --input-color: var(--default-color);
1458
- --input-bg: white;
1459
- --input-border-color: var(--light-gray);
1460
- --input-broder-radius: 3px;
1461
- --input-shadow-color: #a3c5fd;
1462
- --input-horizontal-padding: 8px;
1463
- --input-block-color: #f5f7fa;
1464
- --input-block-hover-color: #eaebf0;
1465
- --input-icon-size: var(--font-size-medium);
1466
- --input-maxlength-color: #979ba5;
1467
- --button-primary-hover-color: #5594fa;
1468
- --button-danger-hover-color: #ff5656;
1469
- --button-success-hover-color: #45e35f;
1470
- --button-warning-hover-color: #ffb848;
1471
- --button-default-hover-border-color: #979ba5;
1472
- --button-primary-active-color: #2c77f4;
1473
- --button-danger-active-color: #db2626;
1474
- --button-success-active-color: #1ab943;
1475
- --button-warning-active-color: #eb9000;
1476
- --button-selected-bg-color: #e1ecff;
1477
- --button-disabled-selected-bg-color: #f0f1f5;
1478
- --radio-font-color: #63656e;
1479
- --radio-active-color: #3a84ff;
1480
- --radio-hover-border-color: #979ba5;
1481
- --radio-disabled-border: #dcdee5;
1482
- --radio-disabled-font-color: #c4c6cc;
1483
- --radio-disabled-checked-bg: #a3c5fd;
1484
- --radio-button-checked-bg: #e1ecff;
1485
- --radio-button-disabled-checked-bg: #fafbfd;
1486
- --checkbox-disabled-checked-bg: #a3c5fd;
1487
- --fixed-navbar-background: #fff;
1488
- --fixed-navbar-boxshadow-color: rgba(0, 0, 0, 0.1);
1489
- --switch-default-color: #fff;
1490
- --switch-grey-color: #c4c6cc;
1491
- --breadcrumb-black-color: #979ba5;
1492
- --breadcrumb-primary-hover-color: #0082ff;
1493
- --breadcrumb-fn-main-color: #63656e;
1494
- --link-default-hover-color: #979ba5;
1495
- --link-primary-hover-color: #699df4;
1496
- --link-success-hover-color: #45e35f;
1497
- --link-warning-hover-color: #ffb848;
1498
- --link-danger-hover-color: #ff5656;
1499
- --link-default-disabled-color: #dcdee5;
1500
- --link-primary-disabled-color: #a3c5fd;
1501
- --link-success-disabled-color: #94f5a4;
1502
- --link-warning-disabled-color: #ffd695;
1503
- --link-danger-disabled-color: #fd9c9c;
1504
- --message-color: var(--default-color);
1505
- --message-primary-bg-color: #f0f8ff;
1506
- --message-primary-border-color: #e1ecff;
1507
- --message-primary-shadow-color: #e1e8f4;
1508
- --message-warning-bg-color: #fff4e2;
1509
- --message-warning-border-color: #ffe8c3;
1510
- --message-warning-shadow-color: #ede6db;
1511
- --message-success-bg-color: #f2fff4;
1512
- --message-success-border-color: #dcffe2;
1513
- --message-success-shadow-color: #cef0d7;
1514
- --message-danger-bg-color: #ffeded;
1515
- --message-danger-border-color: #ffdddd;
1516
- --message-danger-shadow-color: #f6dada;
1517
- --slider-default-bg: #dcdee5;
1518
- --slider-disable-bar-bg: #979ba5;
1519
- --menu-bg-color: #182132;
1520
- --submenu-bg-color: #151d2c;
1521
- --menu-active-bg-color: linear-gradient(90deg, #3f87ff 0%, #3a84ff 100%);
1522
- --menu-color: #96a2b9;
1523
- --menu-group-color: var(--default-color);
1524
- --menu-width: 260px;
1525
- --menu-collapse-width: 60px;
1526
- --menu-active-color: white;
1527
- --nav-header-bg-color: #182132;
1528
- --nav-bg-color: #182132;
1529
- --date-picker-disabled-bg: #fafbfd;
1530
- --date-picker-dropdown-mb: 4px;
1531
- --date-picker-dropdown-bg: #fff;
1532
- --table-bg-color: var(--white-color);
1533
- --table-border-color: #dcdee5;
1534
- --table-strip-color: #fafbfd;
1535
- --table-head-bg-color: #fafbfd;
1536
- --table-head-font-color: #313238;
1537
- --table-body-font-color: #63656e;
1538
- --table-row-hover-bg-color: #f5f7fa;
1539
- --table-row-active-bg-color: #f0f1f5;
1540
- --cascader-panel-border-color: #dcdee5;
1541
- --cascader-panel-hover: #f5f7fa;
1542
- --cascader-panel-active: #e1ecff;
1543
- --cascader-panel-disabled-bg: #fff;
1544
- --search-select-focus-border-color: var(--primary-color);
1545
- --search-select-focus-color: #3c96ff;
1546
- --search-select-font-color: var(--default-color);
1547
- --search-select-placeholder-color: var(--light-gray);
1548
- --search-select-message-color: var(--danger-color);
1549
- --search-select-menu-border-color: var(--disable-color);
1550
- --select-active-color: #e1ecff;
1551
- --select-hover-color: #f5f7fa;
1552
- }
1553
- .bk-popover.bk-pop2-content {
624
+ .bk-user-selector-popover.bk-user-selector-pop2-content {
1554
625
  position: absolute;
1555
626
  padding: 12px;
1556
627
  font-size: 12px;
@@ -1559,10 +630,10 @@ input:-moz-autofill:active {
1559
630
  border-radius: 4px;
1560
631
  box-sizing: border-box;
1561
632
  }
1562
- .bk-popover.bk-pop2-content.hidden {
633
+ .bk-user-selector-popover.bk-user-selector-pop2-content.hidden {
1563
634
  display: none;
1564
635
  }
1565
- .bk-popover.bk-pop2-content .bk-pop2-arrow {
636
+ .bk-user-selector-popover.bk-user-selector-pop2-content .bk-user-selector-pop2-arrow {
1566
637
  position: absolute;
1567
638
  z-index: -1;
1568
639
  width: 8px;
@@ -1570,1599 +641,321 @@ input:-moz-autofill:active {
1570
641
  background: #333;
1571
642
  transform: rotate(45deg);
1572
643
  }
1573
- .bk-popover.bk-pop2-content[data-theme^='light'] {
644
+ .bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] {
1574
645
  color: #26323d;
1575
646
  background-color: #fff;
1576
647
  box-shadow: 0 0 6px 0 #dcdee5;
1577
648
  }
1578
- .bk-popover.bk-pop2-content[data-theme^='light'] .bk-pop2-arrow {
649
+ .bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] .bk-user-selector-pop2-arrow {
1579
650
  background-color: #fff;
1580
651
  }
1581
- :root {
1582
- --bk-prefix: bk;
1583
- --popover-max-height: 216px;
1584
- --primary-color: #3a84ff;
1585
- --success-color: #2dcb56;
1586
- --warning-color: #ff9c01;
1587
- --danger-color: #ea3636;
1588
- --default-color: #63656e;
1589
- --gray-color: #979ba5;
1590
- --light-gray: #c4c6cc;
1591
- --white-color: white;
1592
- --whitesmoke-color: #fafbfd;
1593
- --disable-color: #dcdee5;
1594
- --disable-bg-color: #f9fafd;
1595
- --border-color: #dcdee5;
1596
- --font-size-base: 12px;
1597
- --font-size-medium: 14px;
1598
- --font-size-large: 16px;
1599
- --line-height-base: 16px;
1600
- --line-height-medium: 16px;
1601
- --line-height-large: 18px;
1602
- --component-size-small: 26px;
1603
- --component-size-base: 32px;
1604
- --component-size-large: 40px;
1605
- --component-size-small-padding: 0 12px;
1606
- --component-size-base-padding: 0 14px;
1607
- --component-size-large-padding: 0 16px;
1608
- --border-width-base: 1px;
1609
- --border-style-base: solid;
1610
- --border-radius-base: 2px;
1611
- --border-style-color: var(--light-gray);
1612
- --input-disabled-bg: #fafbfd;
1613
- --input-disabled-border: var(--disable-color);
1614
- --input-height-base: var(--component-size-base);
1615
- --input-color: var(--default-color);
1616
- --input-bg: white;
1617
- --input-border-color: var(--light-gray);
1618
- --input-broder-radius: 3px;
1619
- --input-shadow-color: #a3c5fd;
1620
- --input-horizontal-padding: 8px;
1621
- --input-block-color: #f5f7fa;
1622
- --input-block-hover-color: #eaebf0;
1623
- --input-icon-size: var(--font-size-medium);
1624
- --input-maxlength-color: #979ba5;
1625
- --button-primary-hover-color: #5594fa;
1626
- --button-danger-hover-color: #ff5656;
1627
- --button-success-hover-color: #45e35f;
1628
- --button-warning-hover-color: #ffb848;
1629
- --button-default-hover-border-color: #979ba5;
1630
- --button-primary-active-color: #2c77f4;
1631
- --button-danger-active-color: #db2626;
1632
- --button-success-active-color: #1ab943;
1633
- --button-warning-active-color: #eb9000;
1634
- --button-selected-bg-color: #e1ecff;
1635
- --button-disabled-selected-bg-color: #f0f1f5;
1636
- --radio-font-color: #63656e;
1637
- --radio-active-color: #3a84ff;
1638
- --radio-hover-border-color: #979ba5;
1639
- --radio-disabled-border: #dcdee5;
1640
- --radio-disabled-font-color: #c4c6cc;
1641
- --radio-disabled-checked-bg: #a3c5fd;
1642
- --radio-button-checked-bg: #e1ecff;
1643
- --radio-button-disabled-checked-bg: #fafbfd;
1644
- --checkbox-disabled-checked-bg: #a3c5fd;
1645
- --fixed-navbar-background: #fff;
1646
- --fixed-navbar-boxshadow-color: rgba(0, 0, 0, 0.1);
1647
- --switch-default-color: #fff;
1648
- --switch-grey-color: #c4c6cc;
1649
- --breadcrumb-black-color: #979ba5;
1650
- --breadcrumb-primary-hover-color: #0082ff;
1651
- --breadcrumb-fn-main-color: #63656e;
1652
- --link-default-hover-color: #979ba5;
1653
- --link-primary-hover-color: #699df4;
1654
- --link-success-hover-color: #45e35f;
1655
- --link-warning-hover-color: #ffb848;
1656
- --link-danger-hover-color: #ff5656;
1657
- --link-default-disabled-color: #dcdee5;
1658
- --link-primary-disabled-color: #a3c5fd;
1659
- --link-success-disabled-color: #94f5a4;
1660
- --link-warning-disabled-color: #ffd695;
1661
- --link-danger-disabled-color: #fd9c9c;
1662
- --message-color: var(--default-color);
1663
- --message-primary-bg-color: #f0f8ff;
1664
- --message-primary-border-color: #e1ecff;
1665
- --message-primary-shadow-color: #e1e8f4;
1666
- --message-warning-bg-color: #fff4e2;
1667
- --message-warning-border-color: #ffe8c3;
1668
- --message-warning-shadow-color: #ede6db;
1669
- --message-success-bg-color: #f2fff4;
1670
- --message-success-border-color: #dcffe2;
1671
- --message-success-shadow-color: #cef0d7;
1672
- --message-danger-bg-color: #ffeded;
1673
- --message-danger-border-color: #ffdddd;
1674
- --message-danger-shadow-color: #f6dada;
1675
- --slider-default-bg: #dcdee5;
1676
- --slider-disable-bar-bg: #979ba5;
1677
- --menu-bg-color: #182132;
1678
- --submenu-bg-color: #151d2c;
1679
- --menu-active-bg-color: linear-gradient(90deg, #3f87ff 0%, #3a84ff 100%);
1680
- --menu-color: #96a2b9;
1681
- --menu-group-color: var(--default-color);
1682
- --menu-width: 260px;
1683
- --menu-collapse-width: 60px;
1684
- --menu-active-color: white;
1685
- --nav-header-bg-color: #182132;
1686
- --nav-bg-color: #182132;
1687
- --date-picker-disabled-bg: #fafbfd;
1688
- --date-picker-dropdown-mb: 4px;
1689
- --date-picker-dropdown-bg: #fff;
1690
- --table-bg-color: var(--white-color);
1691
- --table-border-color: #dcdee5;
1692
- --table-strip-color: #fafbfd;
1693
- --table-head-bg-color: #fafbfd;
1694
- --table-head-font-color: #313238;
1695
- --table-body-font-color: #63656e;
1696
- --table-row-hover-bg-color: #f5f7fa;
1697
- --table-row-active-bg-color: #f0f1f5;
1698
- --cascader-panel-border-color: #dcdee5;
1699
- --cascader-panel-hover: #f5f7fa;
1700
- --cascader-panel-active: #e1ecff;
1701
- --cascader-panel-disabled-bg: #fff;
1702
- --search-select-focus-border-color: var(--primary-color);
1703
- --search-select-focus-color: #3c96ff;
1704
- --search-select-font-color: var(--default-color);
1705
- --search-select-placeholder-color: var(--light-gray);
1706
- --search-select-message-color: var(--danger-color);
1707
- --search-select-menu-border-color: var(--disable-color);
1708
- --select-active-color: #e1ecff;
1709
- --select-hover-color: #f5f7fa;
1710
- }
1711
- .bk-tag {
652
+ .text-ov {
653
+ overflow: hidden;
654
+ text-overflow: ellipsis;
655
+ white-space: nowrap;
656
+ }
657
+ .position-relative {
658
+ position: relative;
659
+ }
660
+ .position-absolute {
661
+ position: absolute;
662
+ }
663
+ .overflow-popover-reference {
664
+ width: 100%;
665
+ }
666
+ .bk-user-selector-tag {
1712
667
  display: inline-flex;
1713
668
  align-items: center;
1714
669
  height: 22px;
1715
670
  padding: 0 10px;
1716
671
  font-size: 12px;
1717
672
  line-height: 22px;
1718
- color: var(--default-color);
673
+ color: #63656e;
1719
674
  cursor: default;
1720
675
  background-color: #f0f1f5;
1721
676
  border-color: rgba(151, 155, 165, 0.3);
1722
677
  box-sizing: border-box;
1723
678
  }
1724
- .bk-tag.bk-tag-success {
679
+ .bk-user-selector-tag.bk-user-selector-tag-success {
1725
680
  color: #14a568;
1726
681
  border-color: rgba(20, 165, 104, 0.3);
1727
682
  background-color: #E4FAF0;
1728
683
  }
1729
- .bk-tag.bk-tag-success.bk-tag-filled {
684
+ .bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled {
1730
685
  background-color: #14A568;
1731
686
  }
1732
- .bk-tag.bk-tag-success.bk-tag-filled:hover {
687
+ .bk-user-selector-tag.bk-user-selector-tag-success.bk-user-selector-tag-filled:hover {
1733
688
  background-color: #42B685;
1734
689
  }
1735
- .bk-tag.bk-tag-success:hover:not(.bk-tag-filled) {
690
+ .bk-user-selector-tag.bk-user-selector-tag-success:hover:not(.bk-user-selector-tag-filled) {
1736
691
  background-color: #C9F5E2;
1737
692
  }
1738
- .bk-tag.bk-tag-info {
1739
- color: var(--primary-color);
693
+ .bk-user-selector-tag.bk-user-selector-tag-info {
694
+ color: #3a84ff;
1740
695
  border-color: rgba(58, 132, 255, 0.3);
1741
696
  background-color: #EDF4FF;
1742
697
  }
1743
- .bk-tag.bk-tag-info.bk-tag-filled {
698
+ .bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled {
1744
699
  background-color: #3A84FF;
1745
700
  }
1746
- .bk-tag.bk-tag-info.bk-tag-filled:hover {
701
+ .bk-user-selector-tag.bk-user-selector-tag-info.bk-user-selector-tag-filled:hover {
1747
702
  background-color: #609CFE;
1748
703
  }
1749
- .bk-tag.bk-tag-info:hover:not(.bk-tag-filled) {
704
+ .bk-user-selector-tag.bk-user-selector-tag-info:hover:not(.bk-user-selector-tag-filled) {
1750
705
  background-color: #E1ECFF;
1751
706
  }
1752
- .bk-tag.bk-tag-warning {
707
+ .bk-user-selector-tag.bk-user-selector-tag-warning {
1753
708
  color: #fe9c00;
1754
709
  border-color: rgba(254, 165, 0, 0.3);
1755
710
  background-color: #FFF1DB;
1756
711
  }
1757
- .bk-tag.bk-tag-warning.bk-tag-filled {
712
+ .bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled {
1758
713
  background-color: #FE9C00;
1759
714
  }
1760
- .bk-tag.bk-tag-warning.bk-tag-filled:hover {
715
+ .bk-user-selector-tag.bk-user-selector-tag-warning.bk-user-selector-tag-filled:hover {
1761
716
  background-color: #FDAF32;
1762
717
  }
1763
- .bk-tag.bk-tag-warning:hover:not(.bk-tag-filled) {
718
+ .bk-user-selector-tag.bk-user-selector-tag-warning:hover:not(.bk-user-selector-tag-filled) {
1764
719
  background-color: #FFE8C3;
1765
720
  }
1766
- .bk-tag.bk-tag-danger {
1767
- color: var(--danger-color);
721
+ .bk-user-selector-tag.bk-user-selector-tag-danger {
722
+ color: #ea3636;
1768
723
  border-color: rgba(234, 53, 54, 0.3);
1769
724
  background-color: #FEEBEA;
1770
725
  }
1771
- .bk-tag.bk-tag-danger.bk-tag-filled {
726
+ .bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled {
1772
727
  background-color: #EA3536;
1773
728
  }
1774
- .bk-tag.bk-tag-danger.bk-tag-filled:hover {
729
+ .bk-user-selector-tag.bk-user-selector-tag-danger.bk-user-selector-tag-filled:hover {
1775
730
  background-color: #ED5C5D;
1776
731
  }
1777
- .bk-tag.bk-tag-danger:hover:not(.bk-tag-filled) {
732
+ .bk-user-selector-tag.bk-user-selector-tag-danger:hover:not(.bk-user-selector-tag-filled) {
1778
733
  background-color: #FEDDDC;
1779
734
  }
1780
- .bk-tag:hover {
735
+ .bk-user-selector-tag:hover {
1781
736
  background-color: #dcdee5;
1782
737
  }
1783
- .bk-tag.bk-tag-filled {
738
+ .bk-user-selector-tag.bk-user-selector-tag-filled {
1784
739
  color: #fff;
1785
740
  background-color: #979BA5;
1786
741
  }
1787
- .bk-tag.bk-tag-filled:hover {
742
+ .bk-user-selector-tag.bk-user-selector-tag-filled:hover {
1788
743
  background-color: #ACAFB6;
1789
744
  }
1790
- .bk-tag.bk-tag-stroke {
745
+ .bk-user-selector-tag.bk-user-selector-tag-stroke {
1791
746
  padding: 0 9px;
1792
747
  line-height: 20px;
1793
748
  border-style: solid;
1794
749
  border-width: 1px;
1795
750
  }
1796
- .bk-tag.bk-tag-closable {
751
+ .bk-user-selector-tag.bk-user-selector-tag-closable {
1797
752
  padding: 0 4px 0 10px;
1798
753
  }
1799
- .bk-tag.bk-tag-checkable {
754
+ .bk-user-selector-tag.bk-user-selector-tag-checkable {
1800
755
  cursor: pointer;
1801
756
  background: none;
1802
757
  }
1803
- .bk-tag.bk-tag-checkable:hover {
758
+ .bk-user-selector-tag.bk-user-selector-tag-checkable:hover {
1804
759
  background: #F0F1F5;
1805
760
  }
1806
- .bk-tag.bk-tag-check {
761
+ .bk-user-selector-tag.bk-user-selector-tag-check {
1807
762
  color: #fff;
1808
- background: var(--primary-color);
763
+ background: #3a84ff;
1809
764
  }
1810
- .bk-tag.bk-tag-check:hover {
765
+ .bk-user-selector-tag.bk-user-selector-tag-check:hover {
1811
766
  color: #fff;
1812
- background: var(--primary-color);
767
+ background: #3a84ff;
1813
768
  opacity: 1;
1814
769
  }
1815
- .bk-tag--default {
770
+ .bk-user-selector-tag--default {
1816
771
  padding: 0 8px;
1817
772
  }
1818
- .bk-tag--small {
773
+ .bk-user-selector-tag--small {
1819
774
  height: 16px;
1820
775
  padding: 0 4px;
1821
776
  line-height: 16px;
1822
777
  }
1823
- .bk-tag--small .bk-tag-text {
778
+ .bk-user-selector-tag--small .bk-user-selector-tag-text {
1824
779
  font-size: 10px;
1825
780
  }
1826
- .bk-tag-text {
781
+ .bk-user-selector-tag-text {
1827
782
  flex: 1;
1828
783
  overflow: hidden;
1829
784
  text-overflow: ellipsis;
1830
785
  white-space: nowrap;
1831
786
  }
1832
- .bk-tag-icon {
787
+ .bk-user-selector-tag-icon {
1833
788
  flex-shrink: 0;
1834
789
  margin-right: 4px;
1835
790
  font-size: 14px;
1836
791
  line-height: 0;
1837
792
  }
1838
- .bk-tag-close {
793
+ .bk-user-selector-tag-close {
1839
794
  flex-shrink: 0;
1840
795
  margin-left: 4px;
1841
796
  font-size: 12px;
1842
797
  line-height: 0;
1843
798
  cursor: pointer;
1844
799
  }
1845
- :root {
1846
- --bk-prefix: bk;
1847
- --popover-max-height: 216px;
1848
- --primary-color: #3a84ff;
1849
- --success-color: #2dcb56;
1850
- --warning-color: #ff9c01;
1851
- --danger-color: #ea3636;
1852
- --default-color: #63656e;
1853
- --gray-color: #979ba5;
1854
- --light-gray: #c4c6cc;
1855
- --white-color: white;
1856
- --whitesmoke-color: #fafbfd;
1857
- --disable-color: #dcdee5;
1858
- --disable-bg-color: #f9fafd;
1859
- --border-color: #dcdee5;
1860
- --font-size-base: 12px;
1861
- --font-size-medium: 14px;
1862
- --font-size-large: 16px;
1863
- --line-height-base: 16px;
1864
- --line-height-medium: 16px;
1865
- --line-height-large: 18px;
1866
- --component-size-small: 26px;
1867
- --component-size-base: 32px;
1868
- --component-size-large: 40px;
1869
- --component-size-small-padding: 0 12px;
1870
- --component-size-base-padding: 0 14px;
1871
- --component-size-large-padding: 0 16px;
1872
- --border-width-base: 1px;
1873
- --border-style-base: solid;
1874
- --border-radius-base: 2px;
1875
- --border-style-color: var(--light-gray);
1876
- --input-disabled-bg: #fafbfd;
1877
- --input-disabled-border: var(--disable-color);
1878
- --input-height-base: var(--component-size-base);
1879
- --input-color: var(--default-color);
1880
- --input-bg: white;
1881
- --input-border-color: var(--light-gray);
1882
- --input-broder-radius: 3px;
1883
- --input-shadow-color: #a3c5fd;
1884
- --input-horizontal-padding: 8px;
1885
- --input-block-color: #f5f7fa;
1886
- --input-block-hover-color: #eaebf0;
1887
- --input-icon-size: var(--font-size-medium);
1888
- --input-maxlength-color: #979ba5;
1889
- --button-primary-hover-color: #5594fa;
1890
- --button-danger-hover-color: #ff5656;
1891
- --button-success-hover-color: #45e35f;
1892
- --button-warning-hover-color: #ffb848;
1893
- --button-default-hover-border-color: #979ba5;
1894
- --button-primary-active-color: #2c77f4;
1895
- --button-danger-active-color: #db2626;
1896
- --button-success-active-color: #1ab943;
1897
- --button-warning-active-color: #eb9000;
1898
- --button-selected-bg-color: #e1ecff;
1899
- --button-disabled-selected-bg-color: #f0f1f5;
1900
- --radio-font-color: #63656e;
1901
- --radio-active-color: #3a84ff;
1902
- --radio-hover-border-color: #979ba5;
1903
- --radio-disabled-border: #dcdee5;
1904
- --radio-disabled-font-color: #c4c6cc;
1905
- --radio-disabled-checked-bg: #a3c5fd;
1906
- --radio-button-checked-bg: #e1ecff;
1907
- --radio-button-disabled-checked-bg: #fafbfd;
1908
- --checkbox-disabled-checked-bg: #a3c5fd;
1909
- --fixed-navbar-background: #fff;
1910
- --fixed-navbar-boxshadow-color: rgba(0, 0, 0, 0.1);
1911
- --switch-default-color: #fff;
1912
- --switch-grey-color: #c4c6cc;
1913
- --breadcrumb-black-color: #979ba5;
1914
- --breadcrumb-primary-hover-color: #0082ff;
1915
- --breadcrumb-fn-main-color: #63656e;
1916
- --link-default-hover-color: #979ba5;
1917
- --link-primary-hover-color: #699df4;
1918
- --link-success-hover-color: #45e35f;
1919
- --link-warning-hover-color: #ffb848;
1920
- --link-danger-hover-color: #ff5656;
1921
- --link-default-disabled-color: #dcdee5;
1922
- --link-primary-disabled-color: #a3c5fd;
1923
- --link-success-disabled-color: #94f5a4;
1924
- --link-warning-disabled-color: #ffd695;
1925
- --link-danger-disabled-color: #fd9c9c;
1926
- --message-color: var(--default-color);
1927
- --message-primary-bg-color: #f0f8ff;
1928
- --message-primary-border-color: #e1ecff;
1929
- --message-primary-shadow-color: #e1e8f4;
1930
- --message-warning-bg-color: #fff4e2;
1931
- --message-warning-border-color: #ffe8c3;
1932
- --message-warning-shadow-color: #ede6db;
1933
- --message-success-bg-color: #f2fff4;
1934
- --message-success-border-color: #dcffe2;
1935
- --message-success-shadow-color: #cef0d7;
1936
- --message-danger-bg-color: #ffeded;
1937
- --message-danger-border-color: #ffdddd;
1938
- --message-danger-shadow-color: #f6dada;
1939
- --slider-default-bg: #dcdee5;
1940
- --slider-disable-bar-bg: #979ba5;
1941
- --menu-bg-color: #182132;
1942
- --submenu-bg-color: #151d2c;
1943
- --menu-active-bg-color: linear-gradient(90deg, #3f87ff 0%, #3a84ff 100%);
1944
- --menu-color: #96a2b9;
1945
- --menu-group-color: var(--default-color);
1946
- --menu-width: 260px;
1947
- --menu-collapse-width: 60px;
1948
- --menu-active-color: white;
1949
- --nav-header-bg-color: #182132;
1950
- --nav-bg-color: #182132;
1951
- --date-picker-disabled-bg: #fafbfd;
1952
- --date-picker-dropdown-mb: 4px;
1953
- --date-picker-dropdown-bg: #fff;
1954
- --table-bg-color: var(--white-color);
1955
- --table-border-color: #dcdee5;
1956
- --table-strip-color: #fafbfd;
1957
- --table-head-bg-color: #fafbfd;
1958
- --table-head-font-color: #313238;
1959
- --table-body-font-color: #63656e;
1960
- --table-row-hover-bg-color: #f5f7fa;
1961
- --table-row-active-bg-color: #f0f1f5;
1962
- --cascader-panel-border-color: #dcdee5;
1963
- --cascader-panel-hover: #f5f7fa;
1964
- --cascader-panel-active: #e1ecff;
1965
- --cascader-panel-disabled-bg: #fff;
1966
- --search-select-focus-border-color: var(--primary-color);
1967
- --search-select-focus-color: #3c96ff;
1968
- --search-select-font-color: var(--default-color);
1969
- --search-select-placeholder-color: var(--light-gray);
1970
- --search-select-message-color: var(--danger-color);
1971
- --search-select-menu-border-color: var(--disable-color);
1972
- --select-active-color: #e1ecff;
1973
- --select-hover-color: #f5f7fa;
1974
- }
1975
- .bk-checkbox-group {
1976
- display: inline-flex;
1977
- letter-spacing: normal;
1978
- }
1979
- .bk-checkbox {
800
+ .me-tag[data-v-9ccd9029] {
801
+ position: absolute;
802
+ top: 50%;
803
+ right: 8px;
804
+ z-index: 1;
1980
805
  display: inline-flex;
1981
- justify-self: center;
1982
806
  align-items: center;
1983
- font-size: 14px;
1984
- letter-spacing: normal;
1985
- color: #63656e;
807
+ justify-content: center;
808
+ width: 24px;
809
+ height: 24px;
810
+ padding: 0 8px;
811
+ font-size: 12px;
812
+ color: #4d4f56;
1986
813
  cursor: pointer;
1987
- user-select: none;
814
+ background-color: #e1ecff;
815
+ border-radius: 50%;
816
+ transform: translateY(-50%);
1988
817
  }
1989
- .bk-checkbox ~ .bk-checkbox {
1990
- margin-left: 24px;
818
+ .me-tag[data-v-9ccd9029]:hover {
819
+ color: #3a84ff;
820
+ background-color: #cddffe;
1991
821
  }
1992
- .bk-checkbox.is-checked .bk-checkbox-input {
1993
- background: var(--primary-color);
1994
- border-color: var(--primary-color);
1995
- transition: all 0.1s;
822
+ .me-tag.disabled[data-v-9ccd9029] {
823
+ color: #c4c6cc;
824
+ cursor: not-allowed;
825
+ background-color: #f0f1f5;
826
+ }.dropdown-content[data-v-a4132257] {
827
+ min-height: 40px;
828
+ max-height: 300px;
829
+ padding: 5px 0;
830
+ overflow-y: auto;
1996
831
  }
1997
- .bk-checkbox.is-checked .bk-checkbox-input.small::after {
1998
- width: 3px;
1999
- height: 6px;
832
+ .dropdown-content .no-data[data-v-a4132257] {
833
+ padding: 10px;
834
+ color: #979ba5;
835
+ text-align: center;
2000
836
  }
2001
- .bk-checkbox.is-checked .bk-checkbox-input::after {
2002
- position: absolute;
2003
- top: 50%;
2004
- left: 50%;
2005
- width: 4px;
2006
- height: 8px;
2007
- border: 2px solid #fff;
2008
- border-top: 0;
2009
- border-left: 0;
2010
- content: '';
2011
- transform: translate(-50%, -60%) scaleY(1) rotate(45deg);
2012
- transform-origin: center;
837
+ .dropdown-content .user-group .group-header[data-v-a4132257] {
838
+ display: flex;
839
+ align-items: center;
840
+ padding: 8px 12px;
841
+ color: #979ba5;
2013
842
  }
2014
- .bk-checkbox.is-indeterminated .bk-checkbox-input {
2015
- background: var(--primary-color);
2016
- border-color: var(--primary-color);
2017
- transition: all 0.1s;
843
+ .dropdown-content .user-group .group-header .group-count[data-v-a4132257] {
844
+ margin-left: 4px;
2018
845
  }
2019
- .bk-checkbox.is-indeterminated .bk-checkbox-input.small::after {
2020
- width: 6px;
2021
- height: 2px;
846
+ .dropdown-content .user-option[data-v-a4132257] {
847
+ display: flex;
848
+ align-items: center;
849
+ height: 32px;
850
+ padding: 8px 12px;
851
+ cursor: pointer;
2022
852
  }
2023
- .bk-checkbox.is-indeterminated .bk-checkbox-input::after {
2024
- position: absolute;
2025
- top: 50%;
2026
- left: 50%;
2027
- width: 8px;
2028
- height: 2px;
2029
- background: #fff;
2030
- border: none;
2031
- border-radius: 2px;
2032
- content: '';
2033
- transform: translate(-50%, -50%);
2034
- }
2035
- .bk-checkbox.is-disabled {
2036
- color: #c4c6cc;
2037
- cursor: not-allowed;
2038
- }
2039
- .bk-checkbox.is-disabled .bk-checkbox-input {
2040
- background: #fafbfd;
2041
- border-color: var(--disable-color);
2042
- }
2043
- .bk-checkbox.is-disabled .bk-checkbox-input::after {
2044
- background: var(--disable-color);
2045
- }
2046
- .bk-checkbox.is-disabled.is-checked .bk-checkbox-input {
2047
- background: var(--checkbox-disabled-checked-bg);
2048
- border-color: var(--checkbox-disabled-checked-bg);
2049
- }
2050
- .bk-checkbox.is-disabled.is-checked .bk-checkbox-input::after {
2051
- background: var(--checkbox-disabled-checked-bg);
2052
- }
2053
- .bk-checkbox.is-prechecking {
2054
- position: relative;
2055
- }
2056
- .bk-checkbox.is-prechecking .bk-checkbox-input {
2057
- visibility: hidden;
2058
- }
2059
- .bk-checkbox-input {
2060
- position: relative;
2061
- display: inline-block;
2062
- width: 16px;
2063
- height: 16px;
2064
- vertical-align: middle;
2065
- border: 1px solid #979ba5;
2066
- border-radius: 2px;
2067
- }
2068
- .bk-checkbox-input.small {
2069
- width: 14px;
2070
- height: 14px;
2071
- }
2072
- .bk-checkbox-original {
2073
- position: absolute;
2074
- top: 0;
2075
- left: 0;
2076
- z-index: -1;
2077
- width: 0;
2078
- height: 0;
2079
- }
2080
- .bk-checkbox-label {
2081
- display: inline-block;
2082
- margin-left: 6px;
2083
- vertical-align: middle;
2084
- }
2085
- .bk-checkbox-checking {
2086
- position: absolute;
2087
- font-size: 16px;
2088
- color: #3a84ff;
2089
- animation: loading 1s linear infinite;
2090
- }
2091
- :root {
2092
- --bk-prefix: bk;
2093
- --popover-max-height: 216px;
2094
- --primary-color: #3a84ff;
2095
- --success-color: #2dcb56;
2096
- --warning-color: #ff9c01;
2097
- --danger-color: #ea3636;
2098
- --default-color: #63656e;
2099
- --gray-color: #979ba5;
2100
- --light-gray: #c4c6cc;
2101
- --white-color: white;
2102
- --whitesmoke-color: #fafbfd;
2103
- --disable-color: #dcdee5;
2104
- --disable-bg-color: #f9fafd;
2105
- --border-color: #dcdee5;
2106
- --font-size-base: 12px;
2107
- --font-size-medium: 14px;
2108
- --font-size-large: 16px;
2109
- --line-height-base: 16px;
2110
- --line-height-medium: 16px;
2111
- --line-height-large: 18px;
2112
- --component-size-small: 26px;
2113
- --component-size-base: 32px;
2114
- --component-size-large: 40px;
2115
- --component-size-small-padding: 0 12px;
2116
- --component-size-base-padding: 0 14px;
2117
- --component-size-large-padding: 0 16px;
2118
- --border-width-base: 1px;
2119
- --border-style-base: solid;
2120
- --border-radius-base: 2px;
2121
- --border-style-color: var(--light-gray);
2122
- --input-disabled-bg: #fafbfd;
2123
- --input-disabled-border: var(--disable-color);
2124
- --input-height-base: var(--component-size-base);
2125
- --input-color: var(--default-color);
2126
- --input-bg: white;
2127
- --input-border-color: var(--light-gray);
2128
- --input-broder-radius: 3px;
2129
- --input-shadow-color: #a3c5fd;
2130
- --input-horizontal-padding: 8px;
2131
- --input-block-color: #f5f7fa;
2132
- --input-block-hover-color: #eaebf0;
2133
- --input-icon-size: var(--font-size-medium);
2134
- --input-maxlength-color: #979ba5;
2135
- --button-primary-hover-color: #5594fa;
2136
- --button-danger-hover-color: #ff5656;
2137
- --button-success-hover-color: #45e35f;
2138
- --button-warning-hover-color: #ffb848;
2139
- --button-default-hover-border-color: #979ba5;
2140
- --button-primary-active-color: #2c77f4;
2141
- --button-danger-active-color: #db2626;
2142
- --button-success-active-color: #1ab943;
2143
- --button-warning-active-color: #eb9000;
2144
- --button-selected-bg-color: #e1ecff;
2145
- --button-disabled-selected-bg-color: #f0f1f5;
2146
- --radio-font-color: #63656e;
2147
- --radio-active-color: #3a84ff;
2148
- --radio-hover-border-color: #979ba5;
2149
- --radio-disabled-border: #dcdee5;
2150
- --radio-disabled-font-color: #c4c6cc;
2151
- --radio-disabled-checked-bg: #a3c5fd;
2152
- --radio-button-checked-bg: #e1ecff;
2153
- --radio-button-disabled-checked-bg: #fafbfd;
2154
- --checkbox-disabled-checked-bg: #a3c5fd;
2155
- --fixed-navbar-background: #fff;
2156
- --fixed-navbar-boxshadow-color: rgba(0, 0, 0, 0.1);
2157
- --switch-default-color: #fff;
2158
- --switch-grey-color: #c4c6cc;
2159
- --breadcrumb-black-color: #979ba5;
2160
- --breadcrumb-primary-hover-color: #0082ff;
2161
- --breadcrumb-fn-main-color: #63656e;
2162
- --link-default-hover-color: #979ba5;
2163
- --link-primary-hover-color: #699df4;
2164
- --link-success-hover-color: #45e35f;
2165
- --link-warning-hover-color: #ffb848;
2166
- --link-danger-hover-color: #ff5656;
2167
- --link-default-disabled-color: #dcdee5;
2168
- --link-primary-disabled-color: #a3c5fd;
2169
- --link-success-disabled-color: #94f5a4;
2170
- --link-warning-disabled-color: #ffd695;
2171
- --link-danger-disabled-color: #fd9c9c;
2172
- --message-color: var(--default-color);
2173
- --message-primary-bg-color: #f0f8ff;
2174
- --message-primary-border-color: #e1ecff;
2175
- --message-primary-shadow-color: #e1e8f4;
2176
- --message-warning-bg-color: #fff4e2;
2177
- --message-warning-border-color: #ffe8c3;
2178
- --message-warning-shadow-color: #ede6db;
2179
- --message-success-bg-color: #f2fff4;
2180
- --message-success-border-color: #dcffe2;
2181
- --message-success-shadow-color: #cef0d7;
2182
- --message-danger-bg-color: #ffeded;
2183
- --message-danger-border-color: #ffdddd;
2184
- --message-danger-shadow-color: #f6dada;
2185
- --slider-default-bg: #dcdee5;
2186
- --slider-disable-bar-bg: #979ba5;
2187
- --menu-bg-color: #182132;
2188
- --submenu-bg-color: #151d2c;
2189
- --menu-active-bg-color: linear-gradient(90deg, #3f87ff 0%, #3a84ff 100%);
2190
- --menu-color: #96a2b9;
2191
- --menu-group-color: var(--default-color);
2192
- --menu-width: 260px;
2193
- --menu-collapse-width: 60px;
2194
- --menu-active-color: white;
2195
- --nav-header-bg-color: #182132;
2196
- --nav-bg-color: #182132;
2197
- --date-picker-disabled-bg: #fafbfd;
2198
- --date-picker-dropdown-mb: 4px;
2199
- --date-picker-dropdown-bg: #fff;
2200
- --table-bg-color: var(--white-color);
2201
- --table-border-color: #dcdee5;
2202
- --table-strip-color: #fafbfd;
2203
- --table-head-bg-color: #fafbfd;
2204
- --table-head-font-color: #313238;
2205
- --table-body-font-color: #63656e;
2206
- --table-row-hover-bg-color: #f5f7fa;
2207
- --table-row-active-bg-color: #f0f1f5;
2208
- --cascader-panel-border-color: #dcdee5;
2209
- --cascader-panel-hover: #f5f7fa;
2210
- --cascader-panel-active: #e1ecff;
2211
- --cascader-panel-disabled-bg: #fff;
2212
- --search-select-focus-border-color: var(--primary-color);
2213
- --search-select-focus-color: #3c96ff;
2214
- --search-select-font-color: var(--default-color);
2215
- --search-select-placeholder-color: var(--light-gray);
2216
- --search-select-message-color: var(--danger-color);
2217
- --search-select-menu-border-color: var(--disable-color);
2218
- --select-active-color: #e1ecff;
2219
- --select-hover-color: #f5f7fa;
2220
- }
2221
- @keyframes loading-scale-animate {
2222
- 0% {
2223
- transform: scale(1);
2224
- }
2225
- 100% {
2226
- transform: scale(0.6);
2227
- }
2228
- }
2229
- @keyframes fade {
2230
- 100% {
2231
- background-color: transparent;
2232
- }
2233
- }
2234
- .bk-transition .bk-fade-enter-active,
2235
- .bk-transition .bk-fade-leave-active {
2236
- transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
2237
- }
2238
- .bk-transition .bk-fade-enter,
2239
- .bk-transition .bk-fade-leave-to {
2240
- opacity: 0;
2241
- }
2242
- .bk-select .mr5 {
2243
- margin-right: 5px;
2244
- }
2245
- .bk-select .ml5 {
2246
- margin-left: 5px;
2247
- }
2248
- .bk-select ul {
853
+ .dropdown-content .user-option[data-v-a4132257]:hover {
854
+ background-color: #f5f7fa;
855
+ }.bk-user-selector-popover.bk-user-selector-pop2-content {
2249
856
  padding: 0;
2250
- margin: 0;
2251
- font-weight: normal;
2252
- list-style: none;
2253
- }
2254
- .bk-select.large .bk-select-content-wrapper {
2255
- font-size: 14px;
2256
- }
2257
- .bk-select.is-focus:not(.is-disabled).normal .bk-select-trigger .bk-select-tag {
2258
- border-color: var(--primary-color);
2259
- box-shadow: 0px 0px 3px 0px #a3c5fd;
2260
- }
2261
- .bk-select.is-focus:not(.is-disabled).simplicity .bk-select-trigger .bk-select-tag {
2262
- border-bottom-color: var(--primary-color);
2263
- }
2264
- .bk-select.is-focus .bk-input {
2265
- border-color: var(--primary-color);
2266
- outline: 0;
2267
- box-shadow: 0px 0px 3px 0px var(--input-shadow-color);
2268
- }
2269
- .bk-select.is-focus .bk-input.is-simplicity {
2270
- border-color: transparent;
2271
- border-bottom-color: var(--primary-color);
2272
- box-shadow: none;
2273
- }
2274
- .bk-select.is-focus .bk-input.is-simplicity .bk-input--text {
2275
- background-color: var(--input-block-color);
2276
- }
2277
- .bk-select.popover-show .bk-select-trigger .angle-down {
2278
- transform: rotate(180deg);
2279
- }
2280
- .bk-select.is-disabled .bk-input--text {
2281
- cursor: not-allowed;
2282
- background-color: #fafbfd;
857
+ }.user-tag[data-v-51944a49] {
858
+ margin-right: 4px;
859
+ margin-left: 0;
2283
860
  }
2284
- .bk-select .bk-input.is-focused {
2285
- border-color: var(--primary-color);
2286
- outline: 0;
2287
- box-shadow: 0 0 3px 0 var(--input-shadow-color);
861
+ .user-tag.draggable[data-v-51944a49] {
862
+ cursor: move;
2288
863
  }
2289
- .bk-select .bk-input.is-focused.is-simplicity {
2290
- border-color: transparent;
2291
- border-bottom-color: var(--primary-color);
2292
- box-shadow: none;
864
+ .user-tag.active[data-v-51944a49] {
865
+ background-color: #e1ecff;
866
+ border-color: #3a84ff;
2293
867
  }
2294
- .bk-select .bk-input--text {
868
+ .user-tag .tag-content .user-name[data-v-51944a49] {
2295
869
  overflow: hidden;
870
+ font-size: 12px;
2296
871
  text-overflow: ellipsis;
2297
872
  white-space: nowrap;
2298
- padding-right: 24px;
2299
- cursor: pointer;
2300
- background-color: var(--white-color);
2301
- }
2302
- .bk-select .bk-select-trigger {
873
+ }.multiple-selector[data-v-bebe517d] {
2303
874
  position: relative;
2304
- }
2305
- .bk-select .bk-select-trigger .bk-tag-input .bk-tag-input-trigger .clear-icon {
2306
- margin-right: 0;
2307
- }
2308
- .bk-select .bk-select-trigger .bk-select-tag {
2309
875
  width: 100%;
2310
- height: 32px;
2311
- padding: 0 28px 0 10px;
2312
- line-height: normal;
2313
- color: var(--default-color);
2314
- text-align: left;
2315
- vertical-align: middle;
2316
- cursor: pointer;
2317
- background-color: var(--white-color);
2318
- border: 1px solid var(--light-gray);
2319
- border-radius: 2px;
2320
- outline: none;
2321
- box-sizing: border-box;
2322
- transition: all 0.1s;
2323
- resize: none;
2324
- overflow: hidden;
2325
- text-overflow: ellipsis;
2326
- white-space: nowrap;
2327
- display: flex;
2328
- width: auto;
2329
- align-items: center;
2330
- }
2331
- .bk-select .bk-select-trigger .bk-select-tag::placeholder {
2332
- color: var(--light-gray);
2333
- }
2334
- .bk-select .bk-select-trigger .bk-select-tag.is-simplicity {
2335
- background-color: transparent;
2336
- border-color: transparent;
2337
- border-bottom-color: var(--input-border-color);
2338
- }
2339
- .bk-select .bk-select-trigger .bk-select-tag.is-simplicity:hover {
2340
- background-color: var(--input-block-color);
2341
- border-color: transparent;
2342
- border-bottom-color: var(--light-gray);
2343
- box-shadow: none;
2344
876
  }
2345
- .bk-select .bk-select-trigger .bk-select-tag.has-prefix {
2346
- padding-left: 0;
2347
- }
2348
- .bk-select .bk-select-trigger .bk-select-tag-wrapper {
2349
- display: flex;
2350
- align-items: center;
2351
- flex-wrap: wrap;
2352
- overflow: hidden;
2353
- gap: 4px;
2354
- padding: 4px 0;
2355
- }
2356
- .bk-select .bk-select-trigger .bk-select-tag.collapse-tag .bk-select-tag-wrapper {
2357
- height: 30px;
877
+ .multiple-selector.is-disabled[data-v-bebe517d] {
878
+ pointer-events: none;
2358
879
  }
2359
- .bk-select .bk-select-trigger .bk-select-tag:not(.collapse-tag) {
2360
- position: relative;
2361
- z-index: 1;
2362
- height: auto;
880
+ .multiple-selector .tags-container[data-v-bebe517d] {
2363
881
  min-height: 32px;
2364
- flex-wrap: wrap;
2365
- }
2366
- .bk-select .bk-select-trigger .bk-select-tag:not(.is-disabled,.is-simplicity):hover {
2367
- border-color: #979ba5;
2368
- }
2369
- .bk-select .bk-select-trigger .bk-select-tag.is-disabled {
2370
- cursor: not-allowed;
2371
- background-color: #fafbfd;
2372
- border-color: #dcdee5;
2373
- }
2374
- .bk-select .bk-select-trigger .bk-select-tag.is-disabled input {
2375
- cursor: not-allowed;
2376
- }
2377
- .bk-select .bk-select-trigger .bk-select-tag.is-disabled .bk-tag {
2378
- cursor: not-allowed;
2379
- }
2380
- .bk-select .bk-select-trigger .bk-select-tag.is-disabled .bk-tag:hover {
2381
- background-color: #f0f1f5;
2382
- }
2383
- .bk-select .bk-select-trigger .bk-select-tag.is-disabled .bk-tag .bk-tag-close {
2384
- cursor: not-allowed;
2385
- }
2386
- .bk-select .bk-select-trigger .bk-select-tag.is-disabled .is-disabled {
2387
- padding-left: 0;
2388
- }
2389
- .bk-select .bk-select-trigger .bk-select-tag-input {
2390
- width: 100%;
2391
- height: 32px;
2392
- padding: 0 28px 0 10px;
2393
- line-height: normal;
2394
- color: var(--default-color);
2395
- text-align: left;
2396
- vertical-align: middle;
2397
- cursor: pointer;
2398
- background-color: var(--white-color);
2399
- border: 1px solid var(--light-gray);
882
+ padding: 1px 10px 1px 8px;
883
+ background-color: #fff;
884
+ border: 1px solid #c4c6cc;
2400
885
  border-radius: 2px;
2401
- outline: none;
2402
- box-sizing: border-box;
2403
- transition: all 0.1s;
2404
- resize: none;
2405
- overflow: hidden;
2406
- text-overflow: ellipsis;
2407
- white-space: nowrap;
2408
- width: 1%;
2409
- height: 22px;
2410
- padding: 0;
2411
- margin: 0px 5px 0px 0;
2412
- background-color: transparent;
2413
- border: none;
2414
- flex-grow: 1;
886
+ transition: all 0.2s ease;
2415
887
  }
2416
- .bk-select .bk-select-trigger .bk-select-tag-input::placeholder {
2417
- color: var(--light-gray);
2418
- }
2419
- .bk-select .bk-select-trigger .bk-select-tag .bk-tag {
2420
- max-width: 190px;
2421
- padding: 0 4px;
888
+ .multiple-selector .tags-container.focused[data-v-bebe517d] {
889
+ border-color: #3a84ff;
890
+ box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);
2422
891
  }
2423
- .bk-select .bk-select-trigger .angle-down {
2424
- right: 4px;
2425
- transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
892
+ .multiple-selector .tags-container.collapsed[data-v-bebe517d] {
2426
893
  display: flex;
2427
- width: 20px;
2428
- height: 20px;
2429
- font-size: 20px;
2430
- color: #979ba5;
2431
- position: absolute;
2432
- top: 0;
2433
- display: inline-flex;
2434
- height: 100%;
894
+ flex-wrap: wrap;
2435
895
  align-items: center;
2436
- justify-content: center;
2437
896
  }
2438
- .bk-select .bk-select-trigger .clear-icon {
2439
- right: 4px;
2440
- cursor: pointer;
2441
- transition: all 0.1s;
897
+ .multiple-selector .tag-list[data-v-bebe517d] {
2442
898
  display: flex;
2443
- width: 20px;
2444
- height: 20px;
2445
- font-size: 14px;
2446
- color: #c4c6cc;
2447
- position: absolute;
2448
- top: 0;
2449
- display: inline-flex;
2450
- height: 100%;
899
+ flex-wrap: wrap;
2451
900
  align-items: center;
2452
- justify-content: center;
2453
- }
2454
- .bk-select .bk-select-trigger .clear-icon:hover {
2455
- color: #979ba5;
2456
901
  }
2457
- .bk-select .bk-select-trigger .spinner {
2458
- right: 6px;
2459
- position: absolute;
2460
- top: 0;
902
+ .multiple-selector .tag-wrapper[data-v-bebe517d] {
2461
903
  display: inline-flex;
2462
- height: 100%;
2463
904
  align-items: center;
2464
- justify-content: center;
2465
- }
2466
- .bk-select--prefix-area {
2467
- display: flex;
2468
- height: 100%;
2469
- padding: 0 10px;
2470
- margin-right: 10px;
2471
- color: #63656e;
2472
- background-color: var(--select-hover-color);
2473
- border-right: 1px solid #c4c6cc;
2474
- align-items: center;
2475
- }
2476
- .bk-popover.bk-pop2-content.bk-select-popover {
2477
- padding: 0;
2478
- border: 1px solid var(--disable-color);
2479
- border-radius: 2px;
2480
- box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
2481
- }
2482
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-empty {
2483
- display: flex;
2484
- align-items: center;
2485
- justify-content: center;
2486
- height: 56px;
2487
- color: #63656e;
2488
- }
2489
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-empty .spinner {
2490
- display: flex;
2491
- width: 14px;
2492
- height: 14px;
2493
- margin-right: 4px;
2494
- font-size: 14px;
2495
- color: #c4c6cc;
2496
- align-items: center;
2497
- justify-content: center;
2498
- }
2499
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-empty span {
2500
- margin-left: 4px;
2501
- line-height: 18px;
2502
- }
2503
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-dropdown {
2504
- overflow: auto;
2505
- }
2506
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-dropdown::-webkit-scrollbar {
2507
- width: 4px;
2508
- height: 4px;
2509
- }
2510
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-dropdown::-webkit-scrollbar-thumb {
2511
- background: #dde4eb;
2512
- border-radius: 20px;
2513
- box-shadow: inset 0 0 6px hsla(0, 0%, 80%, 0.3);
2514
- }
2515
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-extension {
2516
- display: flex;
2517
- height: 40px;
2518
- background-color: #fafbfd;
2519
- align-items: center;
2520
- border-top: 1px solid #dcdee5;
2521
- border-radius: 0 0 2px 2px;
2522
- }
2523
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-options {
2524
- padding: 4px 0;
2525
- }
2526
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-all {
2527
- padding: 4px 0;
2528
- border-bottom: 1px solid var(--border-color);
2529
- }
2530
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-all .wrapper {
2531
- display: flex;
2532
- align-items: center;
2533
- height: 32px;
2534
- padding: 0 12px;
2535
- cursor: pointer;
2536
- color: var(--default-color);
2537
- }
2538
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-all .wrapper:hover {
2539
- background-color: var(--select-hover-color);
2540
- }
2541
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-all .wrapper.active {
2542
- background-color: var(--select-active-color);
2543
- color: var(--primary-color);
2544
- }
2545
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-all .wrapper .select-all-icon {
2546
- margin-right: 4px;
2547
- font-size: 16px;
2548
- }
2549
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option {
2550
- position: relative;
2551
- display: flex;
2552
- min-height: 32px;
2553
- padding: 0 12px;
2554
- color: #63656e;
2555
- text-align: left;
2556
- cursor: pointer;
2557
- user-select: none;
2558
- align-items: center;
2559
- overflow: hidden;
2560
- text-overflow: ellipsis;
2561
- white-space: nowrap;
2562
- }
2563
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option .bk-select-selected-icon {
2564
- position: absolute;
2565
- top: 5px;
2566
- right: 10px;
2567
- }
2568
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option .bk-select-checkbox {
2569
- margin-right: 6px;
2570
- pointer-events: none;
2571
- }
2572
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option .bk-select-checkbox .bk-checkbox-original {
2573
- opacity: 0;
2574
- }
2575
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option-item {
2576
- overflow: hidden;
2577
- text-overflow: ellipsis;
2578
- white-space: nowrap;
2579
- }
2580
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option-item .is-keyword {
2581
- display: inline-flex;
2582
- color: var(--primary-color);
2583
- }
2584
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option.is-hover {
2585
- background-color: var(--select-hover-color);
2586
- }
2587
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option:hover {
2588
- color: #63656e;
2589
- background-color: var(--select-hover-color);
2590
- }
2591
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option.is-selected:not(.is-checkbox) {
2592
- color: #3a84ff;
2593
- background-color: #e1ecff;
2594
- }
2595
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option.is-disabled {
2596
- color: #c4c6cc;
2597
- cursor: not-allowed;
2598
- background-color: transparent;
2599
- }
2600
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option.is-multiple {
2601
- padding-right: 32px;
2602
- }
2603
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option.is-multiple.is-selected {
2604
- background-color: #fff;
2605
- }
2606
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option.is-multiple.is-hover {
2607
- background-color: var(--select-hover-color);
2608
- }
2609
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option.is-multiple:hover {
2610
- background-color: var(--select-hover-color);
2611
- }
2612
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-options-loading {
2613
- display: flex;
2614
- align-items: center;
2615
- justify-content: center;
2616
- }
2617
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-options-loading span {
2618
- margin-left: 4px;
2619
- line-height: 18px;
2620
- }
2621
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-option-group-label {
2622
- height: 32px;
2623
- padding: 0 8px;
2624
- line-height: 32px;
2625
- color: #979ba5;
2626
- text-align: left;
2627
- }
2628
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-option-group-label.collapsible {
2629
- cursor: pointer;
2630
- }
2631
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-option-group.collapsible .bk-select-option {
2632
- padding-left: 40px;
2633
- }
2634
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-option-group.disabled .default-group-label {
2635
- color: #c4c6cc;
2636
- cursor: not-allowed;
2637
- }
2638
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-option-group .default-group-label {
2639
- display: flex;
2640
- user-select: none;
2641
- align-items: center;
2642
- }
2643
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-option-group .default-group-label-icon {
2644
- display: flex;
2645
- width: 12px;
2646
- height: 12px;
2647
- margin-right: 8px;
2648
- transition: all 0.1s;
2649
- align-items: center;
2650
- justify-content: center;
2651
- }
2652
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-option-group .default-group-label-icon.collapse {
2653
- transform: rotate(-90deg);
2654
- }
2655
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-option-group .bk-select-option {
2656
- padding-left: 24px;
2657
- }
2658
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-search-wrapper {
2659
- display: flex;
2660
- margin: 4px 8px 0 8px;
2661
- border-bottom: 1px solid var(--input-block-hover-color);
2662
- align-items: center;
2663
- }
2664
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-search-wrapper .icon-search {
2665
- margin-left: 2px;
2666
- color: var(--gray-color);
905
+ max-width: 100%;
2667
906
  }
2668
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-search-wrapper .bk-select-search-input {
2669
- width: 100%;
2670
- height: 32px;
2671
- padding: 0 28px 0 10px;
2672
- line-height: normal;
2673
- color: var(--default-color);
2674
- text-align: left;
2675
- vertical-align: middle;
2676
- cursor: pointer;
2677
- background-color: var(--white-color);
2678
- border: 1px solid var(--light-gray);
2679
- border-radius: 2px;
2680
- outline: none;
2681
- box-sizing: border-box;
2682
- transition: all 0.1s;
2683
- resize: none;
2684
- overflow: hidden;
2685
- text-overflow: ellipsis;
2686
- white-space: nowrap;
2687
- padding: 0 8px;
2688
- cursor: text;
907
+ .multiple-selector .search-input[data-v-bebe517d] {
908
+ min-width: 10px;
909
+ height: 28px;
910
+ background: transparent;
2689
911
  border: none;
912
+ outline: none;
2690
913
  }
2691
- .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-search-wrapper .bk-select-search-input::placeholder {
2692
- color: var(--light-gray);
2693
- }
2694
- :root {
2695
- --bk-prefix: bk;
2696
- --popover-max-height: 216px;
2697
- --primary-color: #3a84ff;
2698
- --success-color: #2dcb56;
2699
- --warning-color: #ff9c01;
2700
- --danger-color: #ea3636;
2701
- --default-color: #63656e;
2702
- --gray-color: #979ba5;
2703
- --light-gray: #c4c6cc;
2704
- --white-color: white;
2705
- --whitesmoke-color: #fafbfd;
2706
- --disable-color: #dcdee5;
2707
- --disable-bg-color: #f9fafd;
2708
- --border-color: #dcdee5;
2709
- --font-size-base: 12px;
2710
- --font-size-medium: 14px;
2711
- --font-size-large: 16px;
2712
- --line-height-base: 16px;
2713
- --line-height-medium: 16px;
2714
- --line-height-large: 18px;
2715
- --component-size-small: 26px;
2716
- --component-size-base: 32px;
2717
- --component-size-large: 40px;
2718
- --component-size-small-padding: 0 12px;
2719
- --component-size-base-padding: 0 14px;
2720
- --component-size-large-padding: 0 16px;
2721
- --border-width-base: 1px;
2722
- --border-style-base: solid;
2723
- --border-radius-base: 2px;
2724
- --border-style-color: var(--light-gray);
2725
- --input-disabled-bg: #fafbfd;
2726
- --input-disabled-border: var(--disable-color);
2727
- --input-height-base: var(--component-size-base);
2728
- --input-color: var(--default-color);
2729
- --input-bg: white;
2730
- --input-border-color: var(--light-gray);
2731
- --input-broder-radius: 3px;
2732
- --input-shadow-color: #a3c5fd;
2733
- --input-horizontal-padding: 8px;
2734
- --input-block-color: #f5f7fa;
2735
- --input-block-hover-color: #eaebf0;
2736
- --input-icon-size: var(--font-size-medium);
2737
- --input-maxlength-color: #979ba5;
2738
- --button-primary-hover-color: #5594fa;
2739
- --button-danger-hover-color: #ff5656;
2740
- --button-success-hover-color: #45e35f;
2741
- --button-warning-hover-color: #ffb848;
2742
- --button-default-hover-border-color: #979ba5;
2743
- --button-primary-active-color: #2c77f4;
2744
- --button-danger-active-color: #db2626;
2745
- --button-success-active-color: #1ab943;
2746
- --button-warning-active-color: #eb9000;
2747
- --button-selected-bg-color: #e1ecff;
2748
- --button-disabled-selected-bg-color: #f0f1f5;
2749
- --radio-font-color: #63656e;
2750
- --radio-active-color: #3a84ff;
2751
- --radio-hover-border-color: #979ba5;
2752
- --radio-disabled-border: #dcdee5;
2753
- --radio-disabled-font-color: #c4c6cc;
2754
- --radio-disabled-checked-bg: #a3c5fd;
2755
- --radio-button-checked-bg: #e1ecff;
2756
- --radio-button-disabled-checked-bg: #fafbfd;
2757
- --checkbox-disabled-checked-bg: #a3c5fd;
2758
- --fixed-navbar-background: #fff;
2759
- --fixed-navbar-boxshadow-color: rgba(0, 0, 0, 0.1);
2760
- --switch-default-color: #fff;
2761
- --switch-grey-color: #c4c6cc;
2762
- --breadcrumb-black-color: #979ba5;
2763
- --breadcrumb-primary-hover-color: #0082ff;
2764
- --breadcrumb-fn-main-color: #63656e;
2765
- --link-default-hover-color: #979ba5;
2766
- --link-primary-hover-color: #699df4;
2767
- --link-success-hover-color: #45e35f;
2768
- --link-warning-hover-color: #ffb848;
2769
- --link-danger-hover-color: #ff5656;
2770
- --link-default-disabled-color: #dcdee5;
2771
- --link-primary-disabled-color: #a3c5fd;
2772
- --link-success-disabled-color: #94f5a4;
2773
- --link-warning-disabled-color: #ffd695;
2774
- --link-danger-disabled-color: #fd9c9c;
2775
- --message-color: var(--default-color);
2776
- --message-primary-bg-color: #f0f8ff;
2777
- --message-primary-border-color: #e1ecff;
2778
- --message-primary-shadow-color: #e1e8f4;
2779
- --message-warning-bg-color: #fff4e2;
2780
- --message-warning-border-color: #ffe8c3;
2781
- --message-warning-shadow-color: #ede6db;
2782
- --message-success-bg-color: #f2fff4;
2783
- --message-success-border-color: #dcffe2;
2784
- --message-success-shadow-color: #cef0d7;
2785
- --message-danger-bg-color: #ffeded;
2786
- --message-danger-border-color: #ffdddd;
2787
- --message-danger-shadow-color: #f6dada;
2788
- --slider-default-bg: #dcdee5;
2789
- --slider-disable-bar-bg: #979ba5;
2790
- --menu-bg-color: #182132;
2791
- --submenu-bg-color: #151d2c;
2792
- --menu-active-bg-color: linear-gradient(90deg, #3f87ff 0%, #3a84ff 100%);
2793
- --menu-color: #96a2b9;
2794
- --menu-group-color: var(--default-color);
2795
- --menu-width: 260px;
2796
- --menu-collapse-width: 60px;
2797
- --menu-active-color: white;
2798
- --nav-header-bg-color: #182132;
2799
- --nav-bg-color: #182132;
2800
- --date-picker-disabled-bg: #fafbfd;
2801
- --date-picker-dropdown-mb: 4px;
2802
- --date-picker-dropdown-bg: #fff;
2803
- --table-bg-color: var(--white-color);
2804
- --table-border-color: #dcdee5;
2805
- --table-strip-color: #fafbfd;
2806
- --table-head-bg-color: #fafbfd;
2807
- --table-head-font-color: #313238;
2808
- --table-body-font-color: #63656e;
2809
- --table-row-hover-bg-color: #f5f7fa;
2810
- --table-row-active-bg-color: #f0f1f5;
2811
- --cascader-panel-border-color: #dcdee5;
2812
- --cascader-panel-hover: #f5f7fa;
2813
- --cascader-panel-active: #e1ecff;
2814
- --cascader-panel-disabled-bg: #fff;
2815
- --search-select-focus-border-color: var(--primary-color);
2816
- --search-select-focus-color: #3c96ff;
2817
- --search-select-font-color: var(--default-color);
2818
- --search-select-placeholder-color: var(--light-gray);
2819
- --search-select-message-color: var(--danger-color);
2820
- --search-select-menu-border-color: var(--disable-color);
2821
- --select-active-color: #e1ecff;
2822
- --select-hover-color: #f5f7fa;
2823
- }
2824
- .bk-F-scroll-x {
2825
- overflow-x: auto;
2826
- scrollbar-color: #a0a0a0 transparent;
2827
- scrollbar-width: thin;
2828
- }
2829
- .bk-F-scroll-x::-webkit-scrollbar {
2830
- height: 6px;
2831
- }
2832
- .bk-F-scroll-y {
2833
- overflow-y: auto;
2834
- }
2835
- .bk-F-scroll-y::-webkit-scrollbar {
2836
- width: 4px;
914
+ .multiple-selector .search-input[data-v-bebe517d]::placeholder {
915
+ color: #c4c6cc;
2837
916
  }
2838
- .bk-F-scroll-y::-webkit-scrollbar-thumb {
2839
- border-radius: 4px;
917
+ .multiple-selector .search-input.inline[data-v-bebe517d] {
918
+ min-width: 10px;
2840
919
  }
2841
- .bk-scrollbar-wrapper {
920
+ .multiple-selector .search-input.last[data-v-bebe517d], .multiple-selector .search-input.collapsed[data-v-bebe517d] {
921
+ flex: 1;
922
+ min-width: 60px;
923
+ }.single-selector[data-v-67f2ee6a] {
2842
924
  position: relative;
2843
- overflow: hidden;
2844
- }
2845
- .bk-scrollbar-wrapper .bk-scrollbar-content-el {
2846
- display: inline-flex;
2847
- flex-direction: column;
2848
925
  width: 100%;
2849
926
  }
2850
- .bk-scrollbar-wrapper .bk-scrollbar-track {
2851
- z-index: 1;
2852
- position: absolute;
2853
- right: 0;
2854
- bottom: 0;
927
+ .single-selector.is-disabled[data-v-67f2ee6a] {
2855
928
  pointer-events: none;
2856
- overflow: hidden;
2857
- }
2858
- .bk-scrollbar-wrapper .bk-scrollbar-track.track-small.bk-scrollbar-vertical {
2859
- width: 6px;
2860
- }
2861
- .bk-scrollbar-wrapper .bk-scrollbar-track.track-small.bk-scrollbar-vertical.bk-scrollbar-hover {
2862
- width: 8px;
2863
- }
2864
- .bk-scrollbar-wrapper .bk-scrollbar-track.track-small.bk-scrollbar-horizontal {
2865
- height: 6px;
2866
- }
2867
- .bk-scrollbar-wrapper .bk-scrollbar-track.track-small.bk-scrollbar-horizontal.bk-scrollbar-hover {
2868
- height: 8px;
2869
- }
2870
- .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-hover {
2871
- background-color: #f0f1f5;
2872
- cursor: pointer;
2873
- }
2874
- .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-hover .bk-scrollbar::before {
2875
- background-color: #979ba5;
2876
- }
2877
- .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-vertical {
2878
- top: 0;
2879
- width: 8px;
2880
- transform: translate(var(--scroll-offset-x), var(--scroll-offset-y));
2881
- }
2882
- .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-vertical.bk-scrollbar-hover {
2883
- width: 10px;
2884
- }
2885
- .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-horizontal {
2886
- left: 0;
2887
- height: 8px;
2888
- transform: translate(var(--scroll-offset-x), var(--scroll-offset-y));
2889
929
  }
2890
- .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-horizontal.bk-scrollbar-hover {
2891
- height: 10px;
2892
- }
2893
- .bk-scrollbar-wrapper .bk-scrollbar-track.bk-scrollbar-horizontal.bk-scrollbar {
2894
- right: auto;
2895
- left: 0;
2896
- top: 0;
2897
- bottom: 0;
2898
- min-height: 0;
2899
- min-width: 8px;
2900
- width: auto;
2901
- }
2902
- .bk-scrollbar-wrapper .bk-scrollbar-dragging {
2903
- pointer-events: none;
2904
- -webkit-touch-callout: none;
2905
- -webkit-user-select: none;
2906
- -khtml-user-select: none;
2907
- -moz-user-select: none;
2908
- -ms-user-select: none;
2909
- user-select: none;
2910
- }
2911
- .bk-scrollbar-wrapper .bk-scrollbar {
2912
- position: absolute;
2913
- left: 0;
2914
- right: 0;
2915
- top: 0;
2916
- bottom: 0;
2917
- }
2918
- .bk-scrollbar-wrapper .bk-scrollbar::before {
2919
- position: absolute;
2920
- content: '';
2921
- background: #dcdee5;
2922
- border-radius: 6px;
2923
- left: 0;
2924
- right: 0;
2925
- top: 0;
2926
- bottom: 0;
2927
- opacity: 0;
2928
- transition: opacity 0.2s 0.9s linear;
2929
- }
2930
- .bk-scrollbar-wrapper .bk-scrollbar.bk-scrollbar-visible::before {
2931
- opacity: 0.9;
2932
- transition-delay: 0s;
2933
- transition-duration: 0s;
2934
- }
2935
- .bk-virtual-render {
930
+ .input-container[data-v-67f2ee6a] {
2936
931
  position: relative;
2937
- }
2938
- .bk-virtual-render .bk-virtual-content {
2939
- position: absolute;
2940
- top: 0;
2941
- bottom: 0;
2942
- left: 0;
2943
- width: 100%;
2944
- height: 100%;
2945
- }
2946
- .bk-virtual-render .bk-virtual-section {
2947
- width: 1px;
2948
- background: transparent;
2949
- }
2950
-
2951
- .user-selector[data-v-5e8a952d] {
2952
- width: 100%;
2953
- }
2954
- .form-item[data-v-5e8a952d] {
2955
932
  display: flex;
2956
933
  align-items: center;
2957
- margin-bottom: 15px;
2958
- }
2959
- .form-label[data-v-5e8a952d] {
2960
- width: 80px;
2961
- text-align: right;
2962
- padding-right: 10px;
2963
- font-size: 14px;
2964
- color: #63656e;
2965
- }
2966
- .form-required[data-v-5e8a952d] {
2967
- color: #ea3636;
2968
- margin-right: 4px;
2969
- }
2970
- .form-content[data-v-5e8a952d] {
2971
- flex: 1;
2972
- position: relative;
2973
- }
2974
- .tag-input-container[data-v-5e8a952d] {
2975
- display: flex;
2976
- flex-wrap: wrap;
2977
- border: 1px solid #dcdee5;
2978
- border-radius: 2px;
2979
934
  min-height: 32px;
2980
- align-items: center;
2981
- padding: 2px 8px;
2982
- gap: 4px;
2983
- }
2984
- .tag-inline-container[data-v-5e8a952d] {
2985
- display: flex;
2986
- flex-wrap: nowrap;
2987
- align-items: center;
2988
- gap: 4px;
2989
- flex-grow: 1;
2990
- min-height: 24px;
935
+ padding: 0 8px;
936
+ background-color: #fff;
937
+ border: 1px solid #c4c6cc;
938
+ border-radius: 2px;
2991
939
  }
2992
- .is-focused[data-v-5e8a952d] {
940
+ .input-container[data-v-67f2ee6a]:focus-within {
2993
941
  border-color: #3a84ff;
942
+ box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);
2994
943
  }
2995
- .tag-group[data-v-5e8a952d] {
2996
- display: contents;
2997
- /* 让draggable的内容直接成为父容器的子元素 */
2998
- }
2999
- .tag-item[data-v-5e8a952d] {
3000
- flex-shrink: 0;
3001
- height: 24px;
3002
- line-height: 24px;
3003
- margin: 0;
3004
- cursor: pointer;
3005
- display: inline-flex;
3006
- align-items: center;
3007
- }
3008
- .tag-content[data-v-5e8a952d] {
3009
- display: flex;
3010
- align-items: center;
3011
- height: 100%;
3012
- }
3013
-
3014
- /* 输入框样式 */
3015
- .tag-input[data-v-5e8a952d] {
3016
- flex-grow: 0;
3017
- width: 10px;
3018
- min-width: 10px;
3019
- max-width: 100%;
944
+ .search-input[data-v-67f2ee6a] {
945
+ flex: 1;
946
+ height: 30px;
947
+ background: transparent;
3020
948
  border: none;
3021
949
  outline: none;
3022
- height: 32px;
3023
- font-size: 14px;
3024
- padding: 0 8px;
3025
- background: transparent;
3026
- cursor: text;
3027
- transition: width 0.1s ease-in-out;
3028
950
  }
3029
- .tag-input[data-v-5e8a952d]::placeholder {
951
+ .search-input[data-v-67f2ee6a]::placeholder {
3030
952
  color: #c4c6cc;
3031
- font-size: 12px;
3032
- }
3033
- .full-width[data-v-5e8a952d] {
3034
- flex-grow: 1;
3035
- padding: 0 8px;
3036
- /* 添加统一的内边距 */
3037
- }
3038
- .popover-content[data-v-5e8a952d] {
3039
- min-height: 80px;
3040
- max-height: 250px;
3041
- overflow-y: auto;
3042
- background-color: #fff;
3043
- }
3044
- .user-option[data-v-5e8a952d] {
3045
- display: flex;
3046
- align-items: center;
3047
- padding: 8px 12px;
3048
- cursor: pointer;
3049
- }
3050
- .user-option[data-v-5e8a952d]:hover {
3051
- background-color: #f5f7fa;
3052
- }
3053
- .user-avatar[data-v-5e8a952d] {
3054
- width: 24px;
3055
- height: 24px;
3056
- border-radius: 50%;
3057
- margin-right: 8px;
3058
- }
3059
- .user-avatar-text[data-v-5e8a952d] {
3060
- width: 24px;
3061
- height: 24px;
3062
- line-height: 24px;
3063
- text-align: center;
3064
- border-radius: 50%;
3065
- background-color: #3a84ff;
3066
- color: white;
3067
- font-size: 12px;
3068
- margin-right: 8px;
3069
- }
3070
- .user-name[data-v-5e8a952d] {
3071
- font-size: 12px;
3072
- }
3073
-
3074
- /* 拖拽相关样式 */
3075
- .draggable[data-v-5e8a952d] {
3076
- cursor: move;
3077
- padding-left: 4px;
3078
- }
3079
- .ghost-tag[data-v-5e8a952d] {
3080
- opacity: 0.5;
3081
- background: #c8ebfb;
3082
- }
3083
- .chosen-tag[data-v-5e8a952d] {
3084
- box-shadow: 0 0 2px 2px #3a84ff;
3085
- }
3086
- .drag-tag[data-v-5e8a952d] {
3087
- opacity: 0.8;
3088
- }
3089
- .drag-handle[data-v-5e8a952d] {
3090
- display: inline-flex;
3091
- align-items: center;
3092
- margin-right: 4px;
3093
- opacity: 0.6;
3094
- cursor: move;
3095
- }
3096
- .drag-handle svg[data-v-5e8a952d] {
3097
- fill: currentColor;
3098
- }
3099
- .tag-wrapper[data-v-5e8a952d] {
3100
- display: flex;
3101
- align-items: center;
3102
- padding: 0;
3103
- height: 24px;
3104
- }
3105
- .inline-input[data-v-5e8a952d] {
3106
- margin-left: 4px;
3107
- min-width: 10px;
3108
- padding: 0 2px;
3109
- }
3110
-
3111
- /* 测量元素样式 */
3112
- .measure-text[data-v-5e8a952d] {
3113
- position: absolute;
3114
- visibility: hidden;
3115
- height: 0;
3116
- white-space: pre;
3117
- font-size: 14px;
3118
- font-family: inherit;
3119
- padding: 0 2px;
3120
- }
3121
-
3122
- /* 单选模式样式 */
3123
- .is-single[data-v-5e8a952d] {
3124
- cursor: pointer;
3125
- }
3126
- .single-select[data-v-5e8a952d] {
3127
- display: flex;
3128
- align-items: center;
3129
- justify-content: space-between;
953
+ }.bk-user-selector[data-v-30b84150] {
954
+ position: relative;
3130
955
  width: 100%;
3131
- height: 100%;
3132
- }
3133
- .single-value[data-v-5e8a952d] {
3134
- display: flex;
3135
- align-items: center;
3136
- padding: 0 8px;
3137
- margin-right: 4px;
3138
- height: 24px;
3139
- }
3140
- .single-input[data-v-5e8a952d] {
3141
- flex: 1;
3142
- width: auto;
3143
- }
3144
- .placeholder[data-v-5e8a952d] {
3145
- color: #c4c6cc;
3146
- }
3147
- .dropdown-arrow[data-v-5e8a952d] {
3148
- margin-left: 8px;
3149
- font-size: 10px;
3150
- color: #979ba5;
3151
- }
3152
- .clear-icon[data-v-5e8a952d] {
3153
- margin-left: 8px;
3154
- font-size: 14px;
3155
- color: #979ba5;
3156
- cursor: pointer;
3157
- }
3158
- .clear-icon[data-v-5e8a952d]:hover {
3159
- color: #63656e;
3160
- }
3161
- .no-data[data-v-5e8a952d] {
3162
- padding: 8px 12px;
3163
956
  font-size: 12px;
3164
- text-align: center;
3165
- display: flex;
3166
- align-items: center;
3167
- justify-content: center;
3168
957
  }
958
+ .bk-user-selector.is-disabled[data-v-30b84150] {
959
+ cursor: not-allowed;
960
+ background-color: #dcdee5;
961
+ }