element-assits 0.0.87 → 0.0.89

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/README.md +389 -388
  2. package/lib/index.js +1163 -1159
  3. package/lib/style.scss +887 -887
  4. package/package.json +36 -36
package/lib/style.scss CHANGED
@@ -1,887 +1,887 @@
1
- $--color-primary: #409EFF !default;
2
- $--color-success: #67C23A !default;
3
- $--color-warning: #E6A23C !default;
4
- $--color-danger: #F56C6C !default;
5
- $--color-info: #909399 !default;
6
- $--color-primary-text: #303133 !default;
7
- $--color-regular-text: #606266 !default;
8
- $--color-secondary-text: #909399 !default;
9
- $--color-placeholder-text: #C0C4CC !default;
10
- $--color-border-base: #DCDFE6 !default;
11
- $--color-border-light: #E4E7ED !default;
12
- $--color-border-lighter: #EBEEF5 !default;
13
- $--color-border-extralight: #F2F6FC !default;
14
- $--background-color-base: #F5F7FA !default;
15
- .ea-select {
16
- display: inline-block;
17
- position: relative;
18
- .el-select {
19
- width: 100%;
20
- }
21
- .async-loading.el-icon-loading {
22
- position: absolute;
23
- top: 10px;
24
- right: 28px;
25
- color: #999;
26
- }
27
- .is-collapse-tags .el-select__tags > span > .el-tag:first-child {
28
- min-width: 36px;
29
- max-width: calc(100% - 80px);
30
- }
31
- }
32
- .ea-select-popover {
33
- .el-select-dropdown__item {
34
- display: flex;
35
- justify-content: space-between;
36
- .select-item-value {
37
- overflow: hidden;
38
- text-overflow: ellipsis;
39
- }
40
- .select-item-desc {
41
- overflow: hidden;
42
- text-overflow: ellipsis;
43
- color: #8492a6;
44
- margin-left: 8px;
45
- }
46
- }
47
- .tools {
48
- padding: 0 20px;
49
- margin-bottom: -5px;
50
- }
51
- }
52
-
53
- // table
54
- .ea-table {
55
- // 表格头部样式美化
56
- .el-table {
57
- transition: opacity 0.28s;
58
- th {
59
- background-color: $--background-color-base;
60
- color: $--color-primary-text;
61
- .cell {
62
- min-height: 30px;
63
- display: flex;
64
- justify-content: flex-start;
65
- align-items: center;
66
- }
67
- &.is-center .cell { justify-content: center }
68
- &.is-right .cell { justify-content: flex-end }
69
- }
70
- td, th {
71
- .cell {
72
- line-height: 1.2;
73
- }
74
- }
75
- &.el-table--small {
76
- td, th {
77
- height: 50px;
78
- }
79
- }
80
- &.is-dense {
81
- td, th {
82
- height: 32px;
83
- padding: 2px 0;
84
- .el-button {
85
- padding-top: 0;
86
- padding-bottom: 0;
87
- }
88
- }
89
- }
90
- &.is-unready {
91
- opacity: 0;
92
- .operation-column > div {
93
- height: 32px;
94
- overflow: hidden;
95
- }
96
- &.is-dense {
97
- .operation-column > div {
98
- height: 24px;
99
- }
100
- }
101
- }
102
- }
103
- // 列的更多菜单项
104
- .theader-th-cell {
105
- .cell-icon-menu {
106
- position: absolute;
107
- top: 50%;
108
- right: 4px;
109
- transform: rotate(90deg) translateX(-50%);
110
- color: $--color-placeholder-text;
111
- cursor: pointer;
112
- padding: 4px;
113
- border-radius: 2px;
114
- &:hover {
115
- color: $--color-primary-text;
116
- background-color: $--color-border-light;
117
- }
118
- }
119
- }
120
- // 表格底部
121
- .ea-table__footer {
122
- display: flex;
123
- justify-content: space-between;
124
- transition: opacity 0.28s;
125
- .ea-table__footer-right {
126
- margin-left: auto;
127
- padding-right: 0;
128
- }
129
- > * {
130
- margin-top: 12px;
131
- }
132
- &.is-unready {
133
- opacity: 0;
134
- }
135
- }
136
-
137
- .column-transition-active {
138
- opacity: 0.33;
139
- }
140
-
141
- .el-button > i {
142
- min-width: 12px;
143
- }
144
-
145
- .more-btn > i{
146
- transform: rotate(-90deg);
147
- }
148
- }
149
-
150
- // table - popover
151
- .el-popover.ea-popover-no-padding {
152
- padding: 8px 0;
153
- min-width: 100px;
154
- &.dense {
155
- margin-top: 0px;
156
- margin-bottom: 0px;
157
- min-width: 70px;
158
- }
159
- }
160
-
161
- .more-btn-panel {
162
- &__item {
163
- &:hover {
164
- background-color: $--color-border-lighter;
165
- }
166
- .el-button {
167
- padding: 8px 12px;
168
- width: 100%;
169
- text-align: left;
170
- }
171
- }
172
- }
173
-
174
- .ea-zoom-in-top-enter-active,
175
- .ea-zoom-in-top-leave-active {
176
- opacity: 1;
177
- transform: scaleY(1);
178
- transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1), opacity 300ms cubic-bezier(0.23, 1, 0.32, 1);
179
- transform-origin: center top;
180
- }
181
- .ea-zoom-in-top-enter,
182
- .ea-zoom-in-top-leave-active {
183
- opacity: 0;
184
- transform: scaleY(0);
185
- }
186
-
187
- .ea-data-table {
188
- .edt-row {
189
- display: flex;
190
- .edt-cell {
191
- padding: 0 8px;
192
- flex: 0 0 auto;
193
- box-sizing: border-box;
194
- overflow: hidden;
195
- text-overflow: ellipsis;
196
- white-space: nowrap;
197
- word-break: break-all;
198
- }
199
- &.edt-header {
200
- background-color: $--color-border-extralight;
201
- color: $--color-primary-text;
202
- }
203
- }
204
- &--border {
205
- border: 1px solid $--color-border-light;
206
- .edt-row {
207
- .edt-cell {
208
- border-bottom: 1px solid $--color-border-light;
209
- border-left: 1px solid $--color-border-light;
210
- &:first-child {
211
- border-left: 0;
212
- }
213
- }
214
- &:last-child .edt-cell{
215
- border-bottom: 0;
216
- }
217
- }
218
- }
219
- .loading-text {
220
- color: $--color-secondary-text;
221
- text-align: center;
222
- font-size: inherit;
223
- }
224
- }
225
-
226
- .ea-split-container {
227
- display: flex;
228
- &.is-down {
229
- user-select: none;
230
- }
231
- .sc-left {
232
- flex-grow: 1;
233
- flex-shrink: 1;
234
- }
235
- .sc-right {
236
- flex-grow: 1;
237
- flex-shrink: 1;
238
- }
239
- .sc-center {
240
- flex-grow: 0;
241
- flex-shrink: 0;
242
- position: relative;
243
- }
244
- .sc-bamboo {
245
- width: 8px;
246
- height: 100%;
247
- border: 1px solid #DCDEE2;
248
- border-top: none;
249
- border-bottom: none;
250
- background-color: #F8F8F9;
251
- cursor: col-resize;
252
- user-select: none;
253
- display: flex;
254
- flex-direction: column;
255
- justify-content: center;
256
- align-items: center;
257
- margin: 0 16px;
258
- .sc-texture {
259
- width: 4px;
260
- height: 1px;
261
- background: rgba(23, 35, 61, .25);
262
- margin-top: 3px;
263
- }
264
- }
265
- .sc-on-bamboo {
266
- position: absolute;
267
- top: 50%;
268
- left: 50%;
269
- transform: translate(-50%, -50%);
270
- background-color: #FFF;
271
- display: flex;
272
- justify-content: center;
273
- align-items: center;
274
- }
275
- }
276
-
277
- .ea-tree {
278
- .ea-tree__main {
279
- margin-top: 18px;
280
- .ea-tree__header {
281
- height: 50px;
282
- padding-left: 24px;
283
- padding-right: 14px;
284
- font-size: 12px;
285
- display: flex;
286
- align-items: center;
287
- justify-content: space-between;
288
- background-color: $--background-color-base;
289
- .ea-tree__header__text {
290
- font-weight: bold;
291
- }
292
- }
293
- }
294
- .ea-tree-real {
295
- .el-tree-node.is-current > .el-tree-node__content {
296
- color: $--color-primary;
297
- }
298
- }
299
- &.ea-tree--border {
300
- .ea-tree__main {
301
- border: 1px solid $--color-border-lighter;
302
- }
303
- .ea-tree__header {
304
- border-bottom: 1px solid $--color-border-lighter;
305
- }
306
- .ea-tree-real {
307
- margin: 10px 0;
308
- }
309
- }
310
- }
311
-
312
- .ea-desc {
313
- font-size: 14px;
314
- &__title {
315
- font-size: 16px;
316
- margin-bottom: 12px;
317
- }
318
- &__list {
319
- display: flex;
320
- flex-wrap: wrap;
321
- }
322
- }
323
- .ea-desc .item {
324
- line-height: 24px;
325
- margin-bottom: 10px;
326
- flex: 0 0 auto;
327
- .item-label {
328
- float: left;
329
- text-align: right;
330
- padding-right: 8px;
331
- color: #909399;
332
- }
333
- .item-value {
334
- word-break: break-all;
335
- overflow: hidden;
336
- .value-no-wrap {
337
- height: 48px;
338
- overflow: hidden;
339
- position: relative;
340
- .click-see-more {
341
- position: absolute;
342
- right: 0;
343
- bottom: 0;
344
- height: 24px;
345
- padding-left: 30px;
346
- padding-right: 4px;
347
- background-image: linear-gradient(to right, transparent 0%, #fff 20%, #fff 100%);
348
- cursor: pointer;
349
- color: $--color-primary;
350
- user-select: none;
351
- }
352
- }
353
- }
354
- }
355
-
356
- .ea-button-tooltip + .ea-button-tooltip {
357
- margin-left: 10px;
358
- }
359
- td {
360
- .ea-button-tooltip + .ea-button-tooltip {
361
- margin-left: 4px;
362
- &.text {
363
- margin-left: 10px;
364
- }
365
- }
366
- .el-button [class*="el-icon-"] + span {
367
- margin-left: 2px;
368
- }
369
- }
370
-
371
- .el-button.ea-button.mini-rect-btn {
372
- padding: 7px;
373
- border: 0;
374
- & [class^="design-"] {
375
- margin-right: 0;
376
- }
377
- &:not(.is-disabled) {
378
- &.primary {
379
- background-color: rgba($--color-primary, .15);
380
- color: $--color-primary;
381
- &:hover,&:focus {
382
- background-color: $--color-primary;
383
- i { color: #fff }
384
- }
385
- }
386
- &.success {
387
- background-color: rgba($--color-success, .15);
388
- color: $--color-success;
389
- &:hover,&:focus {
390
- background-color: $--color-success;
391
- i { color: #fff }
392
- }
393
- }
394
- &.info {
395
- background-color: rgba($--color-info, .15);
396
- color: $--color-info;
397
- &:hover,&:focus {
398
- background-color: $--color-info;
399
- i { color: #fff }
400
- }
401
- }
402
- &.warning {
403
- background-color: rgba($--color-warning, .15);
404
- color: $--color-warning;
405
- &:hover,&:focus {
406
- background-color: $--color-warning;
407
- i { color: #fff }
408
- }
409
- }
410
- &.danger {
411
- background-color: rgba($--color-danger, .15);
412
- color: $--color-danger;
413
- &:hover,&:focus {
414
- background-color: $--color-danger;
415
- i { color: #fff }
416
- }
417
- }
418
- }
419
- }
420
-
421
- .ea-list {
422
- .loading-text {
423
- color: $--color-secondary-text;
424
- text-align: center;
425
- font-size: inherit;
426
- }
427
- }
428
-
429
- .el-dialog.ea-modal {
430
- &.no-margin {
431
- margin: 0 !important;
432
- }
433
- &.is-fullscreen {
434
- border-radius: 0;
435
- margin: 0;
436
- }
437
- .el-dialog__header {
438
- color: #555;
439
- font-size: 18px;
440
- .el-dialog__title {
441
- color: inherit;
442
- font-size: inherit;
443
- }
444
- }
445
- }
446
-
447
- .ea-number .el-input__inner {
448
- text-align: left;
449
- }
450
-
451
- .file-upload-dialog {
452
- // 拖拽区域铺满
453
- .el-upload,
454
- .el-upload .el-upload-dragger {
455
- width: 100%;
456
- }
457
- // 文件列表项边框
458
- .el-upload-list {
459
- .el-upload-list__item {
460
- border: 1px dashed #aaa;
461
- .el-icon-close {
462
- display: inline-block;
463
- }
464
- }
465
- }
466
- // 清除文件列表变动过渡动画
467
- .el-list-enter,
468
- .el-list-enter-active,
469
- .el-list-enter-to,
470
- .el-list-leave,
471
- .el-list-leave-active,
472
- .el-list-leave-to {
473
- -webkit-transition: none !important;
474
- transition: none !important;
475
- }
476
- }
477
-
478
- .ea-data-tree-body {
479
- &.ea-data-tree-body__border {
480
- border: 1px solid $--color-border-light;
481
- }
482
- }
483
-
484
- .ea-data-tree-row {
485
- display: flex;
486
- justify-content: flex-start;
487
- position: relative;
488
- padding-left: 20px;
489
- box-sizing: border-box;
490
- &.odd { background-color: #F8F8F8; }
491
- &:hover { background-color: #EBEEF5; }
492
- .ea-data-tree-cell {
493
- flex: 0 0 auto;
494
- height: 100%;
495
- font-size: 14px;
496
- box-sizing: border-box;
497
- padding: 0 8px;
498
- position: relative;
499
- overflow: hidden;
500
- text-overflow: ellipsis;
501
- white-space: nowrap;
502
- word-break: break-all;
503
- & > .ea-data-tree-checkbox {
504
- position: absolute;
505
- top: 0;
506
- }
507
- }
508
- .ea-data-tree-icon {
509
- cursor: pointer;
510
- position: absolute;
511
- height: 100%;
512
- color: #CCC;
513
- display: flex;
514
- align-items: center;
515
- z-index: 1;
516
- &:hover {
517
- color: #333;
518
- }
519
- }
520
- }
521
-
522
- .ea-data-tree-checkbox .el-checkbox__input.is-indeterminate .el-checkbox__inner {
523
- background-color: $--color-secondary-text;
524
- border-color: $--color-secondary-text;
525
- }
526
-
527
- .ea-data-tree-empty {
528
- display: flex;
529
- justify-content: center;
530
- align-items: center;
531
- color: $--color-secondary-text;
532
- }
533
-
534
- .vjs-table {
535
- position: relative;
536
- overflow: hidden;
537
- }
538
- .vjs-header {
539
- position: absolute;
540
- top: 0;
541
- border: 1px solid $--color-border-light;
542
- border-bottom: 0;
543
- }
544
- .vjs-body {
545
- border: 1px solid $--color-border-light;
546
- }
547
-
548
- .vjs-row {
549
- height: 32px;
550
- line-height: 32px;
551
- display: flex;
552
- justify-content: flex-start;
553
- position: relative;
554
- &.odd { background-color: #F8F8F8; }
555
- &:not(.vjs-header):hover { background-color: #EBEEF5; }
556
- .vjs-cell {
557
- flex: 0 0 auto;
558
- height: 100%;
559
- font-size: 14px;
560
- box-sizing: border-box;
561
- padding: 0 8px;
562
- position: relative;
563
- overflow: hidden;
564
- text-overflow: ellipsis;
565
- white-space: nowrap;
566
- word-break: break-all;
567
- & > .el-tag {
568
- vertical-align: 1px;
569
- }
570
- &.vjs-cell-flex {
571
- flex-grow: 1;
572
- }
573
- &.error {
574
- border: 1px solid red;
575
- }
576
- & > .vjs-checkbox {
577
- position: absolute;
578
- top: 0;
579
- }
580
- }
581
- .vjs-icon {
582
- cursor: pointer;
583
- position: absolute;
584
- height: 100%;
585
- color: #CCC;
586
- display: flex;
587
- align-items: center;
588
- z-index: 1;
589
- &:hover {
590
- color: #333;
591
- }
592
- }
593
- .vjs-temp {
594
- color: #909399;
595
- }
596
- }
597
-
598
- .vjs-checkbox .el-checkbox__input.is-indeterminate .el-checkbox__inner {
599
- background-color: $--color-secondary-text;
600
- border-color: $--color-secondary-text;
601
- }
602
-
603
- .cell-text {
604
- height: 100%;
605
- overflow: hidden;
606
- text-overflow: ellipsis;
607
- white-space: nowrap;
608
- word-break: break-all;
609
- .cell-placeholder {
610
- color: #C0C4CC;
611
- }
612
- }
613
-
614
- .cell-input {
615
- display: block;
616
- height: 30px;
617
- line-height: 30px;
618
- font-size: inherit;
619
- color: inherit;
620
- font-family: inherit;
621
- margin-left: -4.7px;
622
- .el-input__inner {
623
- border-radius: 0;
624
- font-size: inherit;
625
- color: inherit;
626
- font-family: inherit;
627
- padding-left: 4px;
628
- }
629
- }
630
-
631
- .cell-select {
632
- cursor: pointer;
633
- &:not(.is-disabled):hover {
634
- border-width: 0;
635
- border-bottom-width: 1.5px;
636
- border-style: solid;
637
- }
638
- &.is-disabled {
639
- cursor: default;
640
- }
641
- }
642
-
643
- .cell-required {
644
- width: 100%;
645
- height: 100%;
646
- display: flex;
647
- align-items: center;
648
- .box {
649
- width: 20px;
650
- height: 20px;
651
- box-sizing: border-box;
652
- border-radius: 4px;
653
- cursor: pointer;
654
- user-select: none;
655
- display: flex;
656
- justify-content: center;
657
- align-items: center;
658
- padding-top: 4px;
659
- color: #DDD;
660
- background-color: rgba(0, 0, 0, 0.02);
661
- &:not(.is-disabled):hover {
662
- color: #999;
663
- background-color: rgba(0, 0, 0, 0.05);
664
- }
665
- &.is-disabled {
666
- cursor: default;
667
- color: transparent;
668
- background-color: transparent;
669
- }
670
- &.is-required, &.is-required:hover {
671
- color: red;
672
- background-color: rgba(0, 0, 0, 0.08);
673
- }
674
- }
675
- }
676
-
677
- .cell-action {
678
- width: 80px;
679
- i {
680
- cursor: pointer;
681
- font-size: 16px;
682
- padding: 4px;
683
- border-radius: 4px;
684
- &:hover {
685
- background-color: rgba(0,0,0,0.1);
686
- }
687
- }
688
- }
689
- .action-popover {
690
- margin: 0 !important;
691
- }
692
-
693
- .ea-blue {
694
- color: #409EFF;
695
- }
696
- .ea-purple {
697
- color: #EE46BC !important;
698
- }
699
- .ea-success {
700
- color: $--color-success;
701
- }
702
- .ea-danger {
703
- color: $--color-danger;
704
- }
705
- .ea-info {
706
- color: $--color-info;
707
- }
708
- .ea-placeholder {
709
- color: $--color-placeholder-text !important;
710
- }
711
-
712
- .ea-popover-no-margin {
713
- margin: 0 !important;
714
- }
715
-
716
- @font-face {
717
- font-family: 'eafont';
718
- src: url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAQYAAsAAAAACMAAAAPLAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACDHAqFDIRVATYCJAMQCwoABCAFhE8HQBu9BxEVnLHIfibwpknuXkitybkhDKpb3+RDeb1vMhOsa34zn2ST3rpbnaQ7jZOwi3OelIhQI3mLHn0haTkDFEZf6SdAAFkA/M/ltDHxABvfAoC7xti0t5dlvehe2rbAxhiUbfFAIsy8BXYOdTBB14AA0MJNMC4yOjETxsayzmZMwiDhCeDmksa6mjJIdwNYCkIgqYW8KxnIUvAAt4C7BGCJ+XnyER5JAAeeQtontTqqEsfe4I0bVawK6CPoOBDgaA4AD4ACcOqZidSmO8pB7bATCm1ckMEHOCiBA2ptM75xs1pZNCqFJDsBrvSfRwRICj1SvSIUeAOVBxzwxiiIU7qhaAUUTF8hARgJuAwQV0iaKfUsFCCNNxhGG7SjtYaxY4lGRgbuZDNvZTJvZzHv5riIWmmOGkzUuxFVl27lVB+9q7OkJEK51XPw7m2JcOs9dwL05isn1JNXdWXmfZuUzfstB7eqWw5k6s2HlMM6wyq1Ur1793aQwXL5uHLsklZ/6NadO2U+61H1yA23UsnOr6+wtChXH3JzL0iKIqt5uRoraFeuoKtaqxwuXs18qMz+If6j7B2qsiLTw2vHNIy5EZqYFJ8wvXp6reO9qIzItHL7SvuHY/ODcgM9ijxLm3N3HC3PcEt1dU11yygPdexWfv+Wuh0fmn/+fNVmI0fPkm3aUP9WzjNlTw6OGJcrozrKqO8IucXmW0liyTebp7aTH2z22fzAhy47ZeszcZbHrIk+a4L33vHyySlyqtG1ZtO2tHrQABahETOU7ZxfsjesIuV4ZLq7Z3rkXFJQo3Ome47HpVDPqpj+GrkyMLBSrvlKKHWuDKyRv1Ja3NHQyZE+ckXTJKc/WgEA1hN0Fw03WR/pMjpOe4ySKuya+Q6+fCl7UmKSv0k6BgB4ydgfclmPMZQTHnNhbsEVoizMWZJ9PQBjcRJVdNU5MiHdgxwArWwGLok4MMqTOlSjORsgEDDaBQ4iJgKFgBlERrUBHjo4yQRZ5YughaOg9TqMVgsKwjQAbAwAeAi9jcAx2gyU3kEio54F3jg/EOi9B63s/246NiVcehQjapAbOMWZFPuIQs98opmi6D1CHPXFfnCcoS6qQOyBGfuiC4bZNONIQD0nuBc4K0aGtmePaizsOLbnsqS4mxSK0+7SoxhRA7kBpziTzo/XCHfcE80URbmiOYjfcD847g5qhSqV+FBkKtjy/GE2jXEkQJ98TuDeiizKYQZt/DCPaizYEsH2rKRSlFdRjEmVNmkNgJZ0EIsjlDDCQ9oNQkbUp1VJPSXucbcDAA==') format('woff2');
719
- }
720
- .eafont {
721
- font-family: eafont;
722
- font-style: normal;
723
- font-size: 16px;
724
- color: #909399;
725
- -webkit-font-smoothing: antialiased;
726
- -moz-osx-font-smoothing: grayscale;
727
- }
728
- .ea-icon-disabled:before { content: "\e630" }
729
- .ea-icon-conf:before { content: "\e600" }
730
- .ea-icon-more:before { content: "\e60e" }
731
- .eafont.ea-icon-conf.has { color: #000 }
732
-
733
- .ea-form .form-group-title {
734
- position: relative;
735
- height: 32px;
736
- margin-bottom: 22px;
737
- > span {
738
- position: absolute;
739
- top: 0;
740
- left: 20%;
741
- padding: 5px 25px;
742
- background-color: #fff;
743
- z-index: 1;
744
- color: $--color-secondary-text;
745
- }
746
- &::after {
747
- content: '';
748
- position: absolute;
749
- top: 50%;
750
- left: 0;
751
- width: 100%;
752
- height: 0;
753
- border-bottom: 1px dashed $--color-border-base;
754
- }
755
- }
756
-
757
- .ea-table-modal {
758
- .el-dialog {
759
- background: #fdfdfd;
760
- box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.15);
761
- .el-dialog__header {
762
- padding: 12px 20px;
763
- background-color: $--color-border-extralight;
764
- border-bottom: 1px solid $--color-border-lighter;
765
- }
766
- .el-dialog__headerbtn {
767
- top: 12px;
768
- }
769
- .el-dialog__close {
770
- font-weight: bold;
771
- color: $--color-secondary-text;
772
- }
773
- .el-dialog__body {
774
- padding: 10px 0;
775
- height: calc(100% - 70px);
776
- min-height: 40px;
777
- max-height: 800px;
778
- overflow: auto;
779
- .scm-title {
780
- font-size: 12px;
781
- font-weight: bold;
782
- color: $--color-primary-text;
783
- &.medium {
784
- font-size: 14px;
785
- }
786
- }
787
- .el-tree {
788
- background: transparent;
789
- font-size: 12px;
790
- .el-tree-node__label {
791
- font-size: 12px;
792
- }
793
- &.medium {
794
- font-size: 14px;
795
- .el-tree-node__label {
796
- font-size: 14px;
797
- }
798
- }
799
- }
800
- }
801
- }
802
- }
803
-
804
- .conf-header {
805
- border-bottom: 1px solid #DDD;
806
- padding-bottom: 10px;
807
- margin-bottom: 10px;
808
- }
809
- .conf-body {
810
- width: 300px;
811
- }
812
- .dense-much .el-form-item {
813
- margin-bottom: 8px !important;
814
- }
815
-
816
- .ea-select-container {
817
- display: flex;
818
- justify-content: flex-start;
819
- font-size: 12px;
820
- &.medium {
821
- font-size: 14px;
822
- .ea-select-panel .ea-select-panel__item {
823
- line-height: 28px;
824
- }
825
- }
826
- .ea-select-panel {
827
- padding: 0;
828
- margin: 0;
829
- list-style: none;
830
- flex-grow: 1;
831
- min-width: 120px;
832
- & + .ea-select-panel {
833
- border-left: 1px solid #DDD;
834
- }
835
- &__item {
836
- width: 100%;
837
- line-height: 24px;
838
- cursor: pointer;
839
- padding: 0 12px;
840
- box-sizing: border-box;
841
- display: flex;
842
- justify-content: space-between;
843
- align-items: center;
844
- font-size: inherit;
845
- &:hover {
846
- background-color: $--color-border-lighter;
847
- }
848
- &.active {
849
- color: $--color-primary;
850
- font-weight: bold;
851
- }
852
- }
853
- }
854
- }
855
-
856
- .ea-form .el-form-item__content {
857
- & > .el-input-number,
858
- & > .el-input,
859
- & > .ea-select,
860
- & > .el-date-editor,
861
- & > .el-select {
862
- width: 100%;
863
- }
864
- }
865
- .ea-form .el-form-item.hidden-label {
866
- > .el-form-item__label {
867
- display: none;
868
- }
869
- > .el-form-item__content {
870
- width: 100%;
871
- }
872
- }
873
-
874
- .ea-switch-mini {
875
- .el-switch__core {
876
- width: 30px !important;
877
- height: 16px;
878
- &::after {
879
- width: 12px;
880
- height: 12px;
881
- left: 2px;
882
- }
883
- }
884
- &.is-checked .el-switch__core::after {
885
- margin-left: -13px;
886
- }
887
- }
1
+ $--color-primary: #409EFF !default;
2
+ $--color-success: #67C23A !default;
3
+ $--color-warning: #E6A23C !default;
4
+ $--color-danger: #F56C6C !default;
5
+ $--color-info: #909399 !default;
6
+ $--color-primary-text: #303133 !default;
7
+ $--color-regular-text: #606266 !default;
8
+ $--color-secondary-text: #909399 !default;
9
+ $--color-placeholder-text: #C0C4CC !default;
10
+ $--color-border-base: #DCDFE6 !default;
11
+ $--color-border-light: #E4E7ED !default;
12
+ $--color-border-lighter: #EBEEF5 !default;
13
+ $--color-border-extralight: #F2F6FC !default;
14
+ $--background-color-base: #F5F7FA !default;
15
+ .ea-select {
16
+ display: inline-block;
17
+ position: relative;
18
+ .el-select {
19
+ width: 100%;
20
+ }
21
+ .async-loading.el-icon-loading {
22
+ position: absolute;
23
+ top: 10px;
24
+ right: 28px;
25
+ color: #999;
26
+ }
27
+ .is-collapse-tags .el-select__tags > span > .el-tag:first-child {
28
+ min-width: 36px;
29
+ max-width: calc(100% - 80px);
30
+ }
31
+ }
32
+ .ea-select-popover {
33
+ .el-select-dropdown__item {
34
+ display: flex;
35
+ justify-content: space-between;
36
+ .select-item-value {
37
+ overflow: hidden;
38
+ text-overflow: ellipsis;
39
+ }
40
+ .select-item-desc {
41
+ overflow: hidden;
42
+ text-overflow: ellipsis;
43
+ color: #8492a6;
44
+ margin-left: 8px;
45
+ }
46
+ }
47
+ .tools {
48
+ padding: 0 20px;
49
+ margin-bottom: -5px;
50
+ }
51
+ }
52
+
53
+ // table
54
+ .ea-table {
55
+ // 表格头部样式美化
56
+ .el-table {
57
+ transition: opacity 0.28s;
58
+ th {
59
+ background-color: $--background-color-base;
60
+ color: $--color-primary-text;
61
+ .cell {
62
+ min-height: 30px;
63
+ display: flex;
64
+ justify-content: flex-start;
65
+ align-items: center;
66
+ }
67
+ &.is-center .cell { justify-content: center }
68
+ &.is-right .cell { justify-content: flex-end }
69
+ }
70
+ td, th {
71
+ .cell {
72
+ line-height: 1.2;
73
+ }
74
+ }
75
+ &.el-table--small {
76
+ td, th {
77
+ height: 50px;
78
+ }
79
+ }
80
+ &.is-dense {
81
+ td, th {
82
+ height: 32px;
83
+ padding: 2px 0;
84
+ .el-button {
85
+ padding-top: 0;
86
+ padding-bottom: 0;
87
+ }
88
+ }
89
+ }
90
+ &.is-unready {
91
+ opacity: 0;
92
+ .operation-column > div {
93
+ height: 32px;
94
+ overflow: hidden;
95
+ }
96
+ &.is-dense {
97
+ .operation-column > div {
98
+ height: 24px;
99
+ }
100
+ }
101
+ }
102
+ }
103
+ // 列的更多菜单项
104
+ .theader-th-cell {
105
+ .cell-icon-menu {
106
+ position: absolute;
107
+ top: 50%;
108
+ right: 4px;
109
+ transform: rotate(90deg) translateX(-50%);
110
+ color: $--color-placeholder-text;
111
+ cursor: pointer;
112
+ padding: 4px;
113
+ border-radius: 2px;
114
+ &:hover {
115
+ color: $--color-primary-text;
116
+ background-color: $--color-border-light;
117
+ }
118
+ }
119
+ }
120
+ // 表格底部
121
+ .ea-table__footer {
122
+ display: flex;
123
+ justify-content: space-between;
124
+ transition: opacity 0.28s;
125
+ .ea-table__footer-right {
126
+ margin-left: auto;
127
+ padding-right: 0;
128
+ }
129
+ > * {
130
+ margin-top: 12px;
131
+ }
132
+ &.is-unready {
133
+ opacity: 0;
134
+ }
135
+ }
136
+
137
+ .column-transition-active {
138
+ opacity: 0.33;
139
+ }
140
+
141
+ .el-button > i {
142
+ min-width: 12px;
143
+ }
144
+
145
+ .more-btn > i{
146
+ transform: rotate(-90deg);
147
+ }
148
+ }
149
+
150
+ // table - popover
151
+ .el-popover.ea-popover-no-padding {
152
+ padding: 8px 0;
153
+ min-width: 100px;
154
+ &.dense {
155
+ margin-top: 0px;
156
+ margin-bottom: 0px;
157
+ min-width: 70px;
158
+ }
159
+ }
160
+
161
+ .more-btn-panel {
162
+ &__item {
163
+ &:hover {
164
+ background-color: $--color-border-lighter;
165
+ }
166
+ .el-button {
167
+ padding: 8px 12px;
168
+ width: 100%;
169
+ text-align: left;
170
+ }
171
+ }
172
+ }
173
+
174
+ .ea-zoom-in-top-enter-active,
175
+ .ea-zoom-in-top-leave-active {
176
+ opacity: 1;
177
+ transform: scaleY(1);
178
+ transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1), opacity 300ms cubic-bezier(0.23, 1, 0.32, 1);
179
+ transform-origin: center top;
180
+ }
181
+ .ea-zoom-in-top-enter,
182
+ .ea-zoom-in-top-leave-active {
183
+ opacity: 0;
184
+ transform: scaleY(0);
185
+ }
186
+
187
+ .ea-data-table {
188
+ .edt-row {
189
+ display: flex;
190
+ .edt-cell {
191
+ padding: 0 8px;
192
+ flex: 0 0 auto;
193
+ box-sizing: border-box;
194
+ overflow: hidden;
195
+ text-overflow: ellipsis;
196
+ white-space: nowrap;
197
+ word-break: break-all;
198
+ }
199
+ &.edt-header {
200
+ background-color: $--color-border-extralight;
201
+ color: $--color-primary-text;
202
+ }
203
+ }
204
+ &--border {
205
+ border: 1px solid $--color-border-light;
206
+ .edt-row {
207
+ .edt-cell {
208
+ border-bottom: 1px solid $--color-border-light;
209
+ border-left: 1px solid $--color-border-light;
210
+ &:first-child {
211
+ border-left: 0;
212
+ }
213
+ }
214
+ &:last-child .edt-cell{
215
+ border-bottom: 0;
216
+ }
217
+ }
218
+ }
219
+ .loading-text {
220
+ color: $--color-secondary-text;
221
+ text-align: center;
222
+ font-size: inherit;
223
+ }
224
+ }
225
+
226
+ .el-dialog.ea-modal {
227
+ &.no-margin {
228
+ margin: 0 !important;
229
+ }
230
+ &.is-fullscreen {
231
+ border-radius: 0;
232
+ margin: 0;
233
+ }
234
+ .el-dialog__header {
235
+ color: #555;
236
+ font-size: 18px;
237
+ .el-dialog__title {
238
+ color: inherit;
239
+ font-size: inherit;
240
+ }
241
+ }
242
+ }
243
+
244
+ .ea-tree {
245
+ .ea-tree__main {
246
+ margin-top: 18px;
247
+ .ea-tree__header {
248
+ height: 50px;
249
+ padding-left: 24px;
250
+ padding-right: 14px;
251
+ font-size: 12px;
252
+ display: flex;
253
+ align-items: center;
254
+ justify-content: space-between;
255
+ background-color: $--background-color-base;
256
+ .ea-tree__header__text {
257
+ font-weight: bold;
258
+ }
259
+ }
260
+ }
261
+ .ea-tree-real {
262
+ .el-tree-node.is-current > .el-tree-node__content {
263
+ color: $--color-primary;
264
+ }
265
+ }
266
+ &.ea-tree--border {
267
+ .ea-tree__main {
268
+ border: 1px solid $--color-border-lighter;
269
+ }
270
+ .ea-tree__header {
271
+ border-bottom: 1px solid $--color-border-lighter;
272
+ }
273
+ .ea-tree-real {
274
+ margin: 10px 0;
275
+ }
276
+ }
277
+ }
278
+
279
+ .ea-split-container {
280
+ display: flex;
281
+ &.is-down {
282
+ user-select: none;
283
+ }
284
+ .sc-left {
285
+ flex-grow: 1;
286
+ flex-shrink: 1;
287
+ }
288
+ .sc-right {
289
+ flex-grow: 1;
290
+ flex-shrink: 1;
291
+ }
292
+ .sc-center {
293
+ flex-grow: 0;
294
+ flex-shrink: 0;
295
+ position: relative;
296
+ }
297
+ .sc-bamboo {
298
+ width: 8px;
299
+ height: 100%;
300
+ border: 1px solid #DCDEE2;
301
+ border-top: none;
302
+ border-bottom: none;
303
+ background-color: #F8F8F9;
304
+ cursor: col-resize;
305
+ user-select: none;
306
+ display: flex;
307
+ flex-direction: column;
308
+ justify-content: center;
309
+ align-items: center;
310
+ margin: 0 16px;
311
+ .sc-texture {
312
+ width: 4px;
313
+ height: 1px;
314
+ background: rgba(23, 35, 61, .25);
315
+ margin-top: 3px;
316
+ }
317
+ }
318
+ .sc-on-bamboo {
319
+ position: absolute;
320
+ top: 50%;
321
+ left: 50%;
322
+ transform: translate(-50%, -50%);
323
+ background-color: #FFF;
324
+ display: flex;
325
+ justify-content: center;
326
+ align-items: center;
327
+ }
328
+ }
329
+
330
+ .ea-list {
331
+ .loading-text {
332
+ color: $--color-secondary-text;
333
+ text-align: center;
334
+ font-size: inherit;
335
+ }
336
+ }
337
+
338
+ .ea-desc {
339
+ font-size: 14px;
340
+ &__title {
341
+ font-size: 16px;
342
+ margin-bottom: 12px;
343
+ }
344
+ &__list {
345
+ display: flex;
346
+ flex-wrap: wrap;
347
+ }
348
+ }
349
+ .ea-desc .item {
350
+ line-height: 24px;
351
+ margin-bottom: 10px;
352
+ flex: 0 0 auto;
353
+ .item-label {
354
+ float: left;
355
+ text-align: right;
356
+ padding-right: 8px;
357
+ color: #909399;
358
+ }
359
+ .item-value {
360
+ word-break: break-all;
361
+ overflow: hidden;
362
+ .value-no-wrap {
363
+ height: 48px;
364
+ overflow: hidden;
365
+ position: relative;
366
+ .click-see-more {
367
+ position: absolute;
368
+ right: 0;
369
+ bottom: 0;
370
+ height: 24px;
371
+ padding-left: 30px;
372
+ padding-right: 4px;
373
+ background-image: linear-gradient(to right, transparent 0%, #fff 20%, #fff 100%);
374
+ cursor: pointer;
375
+ color: $--color-primary;
376
+ user-select: none;
377
+ }
378
+ }
379
+ }
380
+ }
381
+
382
+ .ea-number .el-input__inner {
383
+ text-align: left;
384
+ }
385
+
386
+ .ea-button-tooltip + .ea-button-tooltip {
387
+ margin-left: 10px;
388
+ }
389
+ td {
390
+ .ea-button-tooltip + .ea-button-tooltip {
391
+ margin-left: 4px;
392
+ &.text {
393
+ margin-left: 10px;
394
+ }
395
+ }
396
+ .el-button [class*="el-icon-"] + span {
397
+ margin-left: 2px;
398
+ }
399
+ }
400
+
401
+ .el-button.ea-button.mini-rect-btn {
402
+ padding: 7px;
403
+ border: 0;
404
+ & [class^="design-"] {
405
+ margin-right: 0;
406
+ }
407
+ &:not(.is-disabled) {
408
+ &.primary {
409
+ background-color: rgba($--color-primary, .15);
410
+ color: $--color-primary;
411
+ &:hover,&:focus {
412
+ background-color: $--color-primary;
413
+ i { color: #fff }
414
+ }
415
+ }
416
+ &.success {
417
+ background-color: rgba($--color-success, .15);
418
+ color: $--color-success;
419
+ &:hover,&:focus {
420
+ background-color: $--color-success;
421
+ i { color: #fff }
422
+ }
423
+ }
424
+ &.info {
425
+ background-color: rgba($--color-info, .15);
426
+ color: $--color-info;
427
+ &:hover,&:focus {
428
+ background-color: $--color-info;
429
+ i { color: #fff }
430
+ }
431
+ }
432
+ &.warning {
433
+ background-color: rgba($--color-warning, .15);
434
+ color: $--color-warning;
435
+ &:hover,&:focus {
436
+ background-color: $--color-warning;
437
+ i { color: #fff }
438
+ }
439
+ }
440
+ &.danger {
441
+ background-color: rgba($--color-danger, .15);
442
+ color: $--color-danger;
443
+ &:hover,&:focus {
444
+ background-color: $--color-danger;
445
+ i { color: #fff }
446
+ }
447
+ }
448
+ }
449
+ }
450
+
451
+ .vjs-table {
452
+ position: relative;
453
+ overflow: hidden;
454
+ }
455
+ .vjs-header {
456
+ position: absolute;
457
+ top: 0;
458
+ border: 1px solid $--color-border-light;
459
+ border-bottom: 0;
460
+ }
461
+ .vjs-body {
462
+ border: 1px solid $--color-border-light;
463
+ }
464
+
465
+ .vjs-row {
466
+ height: 32px;
467
+ line-height: 32px;
468
+ display: flex;
469
+ justify-content: flex-start;
470
+ position: relative;
471
+ &.odd { background-color: #F8F8F8; }
472
+ &:not(.vjs-header):hover { background-color: #EBEEF5; }
473
+ .vjs-cell {
474
+ flex: 0 0 auto;
475
+ height: 100%;
476
+ font-size: 14px;
477
+ box-sizing: border-box;
478
+ padding: 0 8px;
479
+ position: relative;
480
+ overflow: hidden;
481
+ text-overflow: ellipsis;
482
+ white-space: nowrap;
483
+ word-break: break-all;
484
+ & > .el-tag {
485
+ vertical-align: 1px;
486
+ }
487
+ &.vjs-cell-flex {
488
+ flex-grow: 1;
489
+ }
490
+ &.error {
491
+ border: 1px solid red;
492
+ }
493
+ & > .vjs-checkbox {
494
+ position: absolute;
495
+ top: 0;
496
+ }
497
+ }
498
+ .vjs-icon {
499
+ cursor: pointer;
500
+ position: absolute;
501
+ height: 100%;
502
+ color: #CCC;
503
+ display: flex;
504
+ align-items: center;
505
+ z-index: 1;
506
+ &:hover {
507
+ color: #333;
508
+ }
509
+ }
510
+ .vjs-temp {
511
+ color: #909399;
512
+ }
513
+ }
514
+
515
+ .vjs-checkbox .el-checkbox__input.is-indeterminate .el-checkbox__inner {
516
+ background-color: $--color-secondary-text;
517
+ border-color: $--color-secondary-text;
518
+ }
519
+
520
+ .cell-text {
521
+ height: 100%;
522
+ overflow: hidden;
523
+ text-overflow: ellipsis;
524
+ white-space: nowrap;
525
+ word-break: break-all;
526
+ .cell-placeholder {
527
+ color: #C0C4CC;
528
+ }
529
+ }
530
+
531
+ .cell-input {
532
+ display: block;
533
+ height: 30px;
534
+ line-height: 30px;
535
+ font-size: inherit;
536
+ color: inherit;
537
+ font-family: inherit;
538
+ margin-left: -4.7px;
539
+ .el-input__inner {
540
+ border-radius: 0;
541
+ font-size: inherit;
542
+ color: inherit;
543
+ font-family: inherit;
544
+ padding-left: 4px;
545
+ }
546
+ }
547
+
548
+ .cell-select {
549
+ cursor: pointer;
550
+ &:not(.is-disabled):hover {
551
+ border-width: 0;
552
+ border-bottom-width: 1.5px;
553
+ border-style: solid;
554
+ }
555
+ &.is-disabled {
556
+ cursor: default;
557
+ }
558
+ }
559
+
560
+ .cell-required {
561
+ width: 100%;
562
+ height: 100%;
563
+ display: flex;
564
+ align-items: center;
565
+ .box {
566
+ width: 20px;
567
+ height: 20px;
568
+ box-sizing: border-box;
569
+ border-radius: 4px;
570
+ cursor: pointer;
571
+ user-select: none;
572
+ display: flex;
573
+ justify-content: center;
574
+ align-items: center;
575
+ padding-top: 4px;
576
+ color: #DDD;
577
+ background-color: rgba(0, 0, 0, 0.02);
578
+ &:not(.is-disabled):hover {
579
+ color: #999;
580
+ background-color: rgba(0, 0, 0, 0.05);
581
+ }
582
+ &.is-disabled {
583
+ cursor: default;
584
+ color: transparent;
585
+ background-color: transparent;
586
+ }
587
+ &.is-required, &.is-required:hover {
588
+ color: red;
589
+ background-color: rgba(0, 0, 0, 0.08);
590
+ }
591
+ }
592
+ }
593
+
594
+ .cell-action {
595
+ width: 80px;
596
+ i {
597
+ cursor: pointer;
598
+ font-size: 16px;
599
+ padding: 4px;
600
+ border-radius: 4px;
601
+ &:hover {
602
+ background-color: rgba(0,0,0,0.1);
603
+ }
604
+ }
605
+ }
606
+ .action-popover {
607
+ margin: 0 !important;
608
+ }
609
+
610
+ .ea-blue {
611
+ color: #409EFF;
612
+ }
613
+ .ea-purple {
614
+ color: #EE46BC !important;
615
+ }
616
+ .ea-success {
617
+ color: $--color-success;
618
+ }
619
+ .ea-danger {
620
+ color: $--color-danger;
621
+ }
622
+ .ea-info {
623
+ color: $--color-info;
624
+ }
625
+ .ea-placeholder {
626
+ color: $--color-placeholder-text !important;
627
+ }
628
+
629
+ .ea-popover-no-margin {
630
+ margin: 0 !important;
631
+ }
632
+
633
+ @font-face {
634
+ font-family: 'eafont';
635
+ src: url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAQYAAsAAAAACMAAAAPLAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACDHAqFDIRVATYCJAMQCwoABCAFhE8HQBu9BxEVnLHIfibwpknuXkitybkhDKpb3+RDeb1vMhOsa34zn2ST3rpbnaQ7jZOwi3OelIhQI3mLHn0haTkDFEZf6SdAAFkA/M/ltDHxABvfAoC7xti0t5dlvehe2rbAxhiUbfFAIsy8BXYOdTBB14AA0MJNMC4yOjETxsayzmZMwiDhCeDmksa6mjJIdwNYCkIgqYW8KxnIUvAAt4C7BGCJ+XnyER5JAAeeQtontTqqEsfe4I0bVawK6CPoOBDgaA4AD4ACcOqZidSmO8pB7bATCm1ckMEHOCiBA2ptM75xs1pZNCqFJDsBrvSfRwRICj1SvSIUeAOVBxzwxiiIU7qhaAUUTF8hARgJuAwQV0iaKfUsFCCNNxhGG7SjtYaxY4lGRgbuZDNvZTJvZzHv5riIWmmOGkzUuxFVl27lVB+9q7OkJEK51XPw7m2JcOs9dwL05isn1JNXdWXmfZuUzfstB7eqWw5k6s2HlMM6wyq1Ur1793aQwXL5uHLsklZ/6NadO2U+61H1yA23UsnOr6+wtChXH3JzL0iKIqt5uRoraFeuoKtaqxwuXs18qMz+If6j7B2qsiLTw2vHNIy5EZqYFJ8wvXp6reO9qIzItHL7SvuHY/ODcgM9ijxLm3N3HC3PcEt1dU11yygPdexWfv+Wuh0fmn/+fNVmI0fPkm3aUP9WzjNlTw6OGJcrozrKqO8IucXmW0liyTebp7aTH2z22fzAhy47ZeszcZbHrIk+a4L33vHyySlyqtG1ZtO2tHrQABahETOU7ZxfsjesIuV4ZLq7Z3rkXFJQo3Ome47HpVDPqpj+GrkyMLBSrvlKKHWuDKyRv1Ja3NHQyZE+ckXTJKc/WgEA1hN0Fw03WR/pMjpOe4ySKuya+Q6+fCl7UmKSv0k6BgB4ydgfclmPMZQTHnNhbsEVoizMWZJ9PQBjcRJVdNU5MiHdgxwArWwGLok4MMqTOlSjORsgEDDaBQ4iJgKFgBlERrUBHjo4yQRZ5YughaOg9TqMVgsKwjQAbAwAeAi9jcAx2gyU3kEio54F3jg/EOi9B63s/246NiVcehQjapAbOMWZFPuIQs98opmi6D1CHPXFfnCcoS6qQOyBGfuiC4bZNONIQD0nuBc4K0aGtmePaizsOLbnsqS4mxSK0+7SoxhRA7kBpziTzo/XCHfcE80URbmiOYjfcD847g5qhSqV+FBkKtjy/GE2jXEkQJ98TuDeiizKYQZt/DCPaizYEsH2rKRSlFdRjEmVNmkNgJZ0EIsjlDDCQ9oNQkbUp1VJPSXucbcDAA==') format('woff2');
636
+ }
637
+ .eafont {
638
+ font-family: eafont;
639
+ font-style: normal;
640
+ font-size: 16px;
641
+ color: #909399;
642
+ -webkit-font-smoothing: antialiased;
643
+ -moz-osx-font-smoothing: grayscale;
644
+ }
645
+ .ea-icon-disabled:before { content: "\e630" }
646
+ .ea-icon-conf:before { content: "\e600" }
647
+ .ea-icon-more:before { content: "\e60e" }
648
+ .eafont.ea-icon-conf.has { color: #000 }
649
+
650
+ .file-upload-dialog {
651
+ // 拖拽区域铺满
652
+ .el-upload,
653
+ .el-upload .el-upload-dragger {
654
+ width: 100%;
655
+ }
656
+ // 文件列表项边框
657
+ .el-upload-list {
658
+ .el-upload-list__item {
659
+ border: 1px dashed #aaa;
660
+ .el-icon-close {
661
+ display: inline-block;
662
+ }
663
+ }
664
+ }
665
+ // 清除文件列表变动过渡动画
666
+ .el-list-enter,
667
+ .el-list-enter-active,
668
+ .el-list-enter-to,
669
+ .el-list-leave,
670
+ .el-list-leave-active,
671
+ .el-list-leave-to {
672
+ -webkit-transition: none !important;
673
+ transition: none !important;
674
+ }
675
+ }
676
+
677
+ .ea-data-tree-body {
678
+ &.ea-data-tree-body__border {
679
+ border: 1px solid $--color-border-light;
680
+ }
681
+ }
682
+
683
+ .ea-data-tree-row {
684
+ display: flex;
685
+ justify-content: flex-start;
686
+ position: relative;
687
+ padding-left: 20px;
688
+ box-sizing: border-box;
689
+ &.odd { background-color: #F8F8F8; }
690
+ &:hover { background-color: #EBEEF5; }
691
+ .ea-data-tree-cell {
692
+ flex: 0 0 auto;
693
+ height: 100%;
694
+ font-size: 14px;
695
+ box-sizing: border-box;
696
+ padding: 0 8px;
697
+ position: relative;
698
+ overflow: hidden;
699
+ text-overflow: ellipsis;
700
+ white-space: nowrap;
701
+ word-break: break-all;
702
+ & > .ea-data-tree-checkbox {
703
+ position: absolute;
704
+ top: 0;
705
+ }
706
+ }
707
+ .ea-data-tree-icon {
708
+ cursor: pointer;
709
+ position: absolute;
710
+ height: 100%;
711
+ color: #CCC;
712
+ display: flex;
713
+ align-items: center;
714
+ z-index: 1;
715
+ &:hover {
716
+ color: #333;
717
+ }
718
+ }
719
+ }
720
+
721
+ .ea-data-tree-checkbox .el-checkbox__input.is-indeterminate .el-checkbox__inner {
722
+ background-color: $--color-secondary-text;
723
+ border-color: $--color-secondary-text;
724
+ }
725
+
726
+ .ea-data-tree-empty {
727
+ display: flex;
728
+ justify-content: center;
729
+ align-items: center;
730
+ color: $--color-secondary-text;
731
+ }
732
+
733
+ .ea-form .form-group-title {
734
+ position: relative;
735
+ height: 32px;
736
+ margin-bottom: 22px;
737
+ > span {
738
+ position: absolute;
739
+ top: 0;
740
+ left: 20%;
741
+ padding: 5px 25px;
742
+ background-color: #fff;
743
+ z-index: 1;
744
+ color: $--color-secondary-text;
745
+ }
746
+ &::after {
747
+ content: '';
748
+ position: absolute;
749
+ top: 50%;
750
+ left: 0;
751
+ width: 100%;
752
+ height: 0;
753
+ border-bottom: 1px dashed $--color-border-base;
754
+ }
755
+ }
756
+
757
+ .ea-table-modal {
758
+ .el-dialog {
759
+ background: #fdfdfd;
760
+ box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.15);
761
+ .el-dialog__header {
762
+ padding: 12px 20px;
763
+ background-color: $--color-border-extralight;
764
+ border-bottom: 1px solid $--color-border-lighter;
765
+ }
766
+ .el-dialog__headerbtn {
767
+ top: 12px;
768
+ }
769
+ .el-dialog__close {
770
+ font-weight: bold;
771
+ color: $--color-secondary-text;
772
+ }
773
+ .el-dialog__body {
774
+ padding: 10px 0;
775
+ height: calc(100% - 70px);
776
+ min-height: 40px;
777
+ max-height: 800px;
778
+ overflow: auto;
779
+ .scm-title {
780
+ font-size: 12px;
781
+ font-weight: bold;
782
+ color: $--color-primary-text;
783
+ &.medium {
784
+ font-size: 14px;
785
+ }
786
+ }
787
+ .el-tree {
788
+ background: transparent;
789
+ font-size: 12px;
790
+ .el-tree-node__label {
791
+ font-size: 12px;
792
+ }
793
+ &.medium {
794
+ font-size: 14px;
795
+ .el-tree-node__label {
796
+ font-size: 14px;
797
+ }
798
+ }
799
+ }
800
+ }
801
+ }
802
+ }
803
+
804
+ .conf-header {
805
+ border-bottom: 1px solid #DDD;
806
+ padding-bottom: 10px;
807
+ margin-bottom: 10px;
808
+ }
809
+ .conf-body {
810
+ width: 300px;
811
+ }
812
+ .dense-much .el-form-item {
813
+ margin-bottom: 8px !important;
814
+ }
815
+
816
+ .ea-form .el-form-item__content {
817
+ & > .el-input-number,
818
+ & > .el-input,
819
+ & > .ea-select,
820
+ & > .el-date-editor,
821
+ & > .el-select {
822
+ width: 100%;
823
+ }
824
+ }
825
+ .ea-form .el-form-item.hidden-label {
826
+ > .el-form-item__label {
827
+ display: none;
828
+ }
829
+ > .el-form-item__content {
830
+ width: 100%;
831
+ }
832
+ }
833
+
834
+ .ea-select-container {
835
+ display: flex;
836
+ justify-content: flex-start;
837
+ font-size: 12px;
838
+ &.medium {
839
+ font-size: 14px;
840
+ .ea-select-panel .ea-select-panel__item {
841
+ line-height: 28px;
842
+ }
843
+ }
844
+ .ea-select-panel {
845
+ padding: 0;
846
+ margin: 0;
847
+ list-style: none;
848
+ flex-grow: 1;
849
+ min-width: 120px;
850
+ & + .ea-select-panel {
851
+ border-left: 1px solid #DDD;
852
+ }
853
+ &__item {
854
+ width: 100%;
855
+ line-height: 24px;
856
+ cursor: pointer;
857
+ padding: 0 12px;
858
+ box-sizing: border-box;
859
+ display: flex;
860
+ justify-content: space-between;
861
+ align-items: center;
862
+ font-size: inherit;
863
+ &:hover {
864
+ background-color: $--color-border-lighter;
865
+ }
866
+ &.active {
867
+ color: $--color-primary;
868
+ font-weight: bold;
869
+ }
870
+ }
871
+ }
872
+ }
873
+
874
+ .ea-switch-mini {
875
+ .el-switch__core {
876
+ width: 30px !important;
877
+ height: 16px;
878
+ &::after {
879
+ width: 12px;
880
+ height: 12px;
881
+ left: 2px;
882
+ }
883
+ }
884
+ &.is-checked .el-switch__core::after {
885
+ margin-left: -13px;
886
+ }
887
+ }