eoss-ui 0.6.0 → 0.6.11

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 (119) hide show
  1. package/lib/button-group.js +210 -198
  2. package/lib/button.js +2 -2
  3. package/lib/calendar.js +2 -2
  4. package/lib/card.js +2 -2
  5. package/lib/cascader.js +2 -2
  6. package/lib/checkbox-group.js +12 -30
  7. package/lib/clients.js +2 -2
  8. package/lib/data-table-form.js +2 -4
  9. package/lib/data-table.js +21 -36
  10. package/lib/date-picker.js +2 -2
  11. package/lib/dialog.js +16 -33
  12. package/lib/enterprise.js +2 -2
  13. package/lib/eoss-ui.common.js +1499 -938
  14. package/lib/error-page.js +2 -2
  15. package/lib/flow-group.js +2 -2
  16. package/lib/flow-list.js +4 -4
  17. package/lib/flow.js +476 -240
  18. package/lib/form.js +2 -4
  19. package/lib/handle-user.js +2 -2
  20. package/lib/handler.js +12 -12
  21. package/lib/icon.js +9 -9
  22. package/lib/icons.js +5 -5
  23. package/lib/index.js +1 -1
  24. package/lib/input-number.js +2 -2
  25. package/lib/input.js +2 -2
  26. package/lib/label.js +2 -2
  27. package/lib/layout.js +4 -4
  28. package/lib/login.js +728 -489
  29. package/lib/main.js +193 -114
  30. package/lib/menu.js +2 -2
  31. package/lib/nav.js +2 -2
  32. package/lib/notify.js +2 -2
  33. package/lib/page.js +2 -2
  34. package/lib/pagination.js +2 -2
  35. package/lib/player.js +11 -11
  36. package/lib/qr-code.js +4 -4
  37. package/lib/radio-group.js +10 -30
  38. package/lib/retrial-auth.js +9 -9
  39. package/lib/select-ganged.js +9 -9
  40. package/lib/select.js +8 -28
  41. package/lib/selector-panel.js +6 -8
  42. package/lib/selector.js +11 -11
  43. package/lib/sizer.js +2 -2
  44. package/lib/steps.js +2 -2
  45. package/lib/switch.js +9 -9
  46. package/lib/table-form.js +2 -2
  47. package/lib/tabs-panel.js +2 -2
  48. package/lib/tabs.js +2 -2
  49. package/lib/theme-chalk/base.css +1 -1
  50. package/lib/theme-chalk/flow.css +1 -1
  51. package/lib/theme-chalk/fonts/iconfont.ttf +0 -0
  52. package/lib/theme-chalk/fonts/iconfont.woff +0 -0
  53. package/lib/theme-chalk/icon.css +1 -1
  54. package/lib/theme-chalk/icons.css +1 -1
  55. package/lib/theme-chalk/index.css +1 -1
  56. package/lib/theme-chalk/login.css +1 -1
  57. package/lib/theme-chalk/main.css +1 -1
  58. package/lib/theme-chalk/menu.css +1 -1
  59. package/lib/theme-chalk/simplicity.css +1 -1
  60. package/lib/theme-chalk/sizer.css +1 -1
  61. package/lib/theme-chalk/upload.css +1 -1
  62. package/lib/tips.js +2 -2
  63. package/lib/toolbar.js +2 -2
  64. package/lib/tree-group.js +6 -5
  65. package/lib/tree.js +2 -2
  66. package/lib/upload.js +6 -8
  67. package/lib/wujie.js +145 -145
  68. package/lib/wxlogin.js +145 -145
  69. package/package.json +2 -2
  70. package/packages/.DS_Store +0 -0
  71. package/packages/checkbox-group/.DS_Store +0 -0
  72. package/packages/checkbox-group/src/main.vue +10 -7
  73. package/packages/data-table/src/main.vue +23 -15
  74. package/packages/dialog/.DS_Store +0 -0
  75. package/packages/dialog/src/main.vue +13 -8
  76. package/packages/flow/src/component/SendMsg.vue +7 -1
  77. package/packages/flow/src/component/taskUnionExamine.vue +19 -1
  78. package/packages/flow/src/main.vue +70 -48
  79. package/packages/flow/src/processForm.vue +21 -5
  80. package/packages/flow/src/processReject.vue +31 -14
  81. package/packages/flow/src/startTaskRead.vue +22 -8
  82. package/packages/handler/src/main.vue +1 -1
  83. package/packages/icons/src/icon.json +1 -1
  84. package/packages/login/.DS_Store +0 -0
  85. package/packages/login/src/main.vue +211 -115
  86. package/packages/main/.DS_Store +0 -0
  87. package/packages/main/src/.DS_Store +0 -0
  88. package/packages/main/src/default/index.vue +2 -10
  89. package/packages/main/src/default/message.vue +13 -1
  90. package/packages/main/src/default/notice.vue +16 -4
  91. package/packages/main/src/main.vue +41 -13
  92. package/packages/main/src/simplicity/index.vue +11 -17
  93. package/packages/main/src/simplicity/message.vue +14 -1
  94. package/packages/main/src/simplicity/notice.vue +13 -1
  95. package/packages/radio-group/src/main.vue +10 -7
  96. package/packages/select/src/main.vue +10 -7
  97. package/packages/theme-chalk/lib/base.css +1 -1
  98. package/packages/theme-chalk/lib/flow.css +1 -1
  99. package/packages/theme-chalk/lib/fonts/iconfont.ttf +0 -0
  100. package/packages/theme-chalk/lib/fonts/iconfont.woff +0 -0
  101. package/packages/theme-chalk/lib/icon.css +1 -1
  102. package/packages/theme-chalk/lib/icons.css +1 -1
  103. package/packages/theme-chalk/lib/index.css +1 -1
  104. package/packages/theme-chalk/lib/login.css +1 -1
  105. package/packages/theme-chalk/lib/main.css +1 -1
  106. package/packages/theme-chalk/lib/menu.css +1 -1
  107. package/packages/theme-chalk/lib/simplicity.css +1 -1
  108. package/packages/theme-chalk/lib/sizer.css +1 -1
  109. package/packages/theme-chalk/lib/upload.css +1 -1
  110. package/packages/theme-chalk/src/.DS_Store +0 -0
  111. package/packages/theme-chalk/src/common/var.scss +3 -1
  112. package/packages/theme-chalk/src/flow.scss +12 -0
  113. package/packages/theme-chalk/src/fonts/iconfont.ttf +0 -0
  114. package/packages/theme-chalk/src/fonts/iconfont.woff +0 -0
  115. package/packages/theme-chalk/src/icon.scss +16 -0
  116. package/packages/theme-chalk/src/icons.scss +1 -1
  117. package/packages/theme-chalk/src/login.scss +609 -760
  118. package/packages/tree-group/src/main.vue +5 -1
  119. package/src/index.js +1 -1
@@ -1,634 +1,489 @@
1
1
  @import './common/var.scss';
2
2
  @mixin loginMedium {
3
- .es-login-logo {
4
- height: 48px;
5
- left: 20px;
6
- top: 20px;
7
- }
8
- .es-login.es-adaptive {
9
- width: 420px;
10
- padding: 0 8px;
3
+ .es-login {
4
+ width: $--login-width * 0.7777;
5
+ .es-login-main {
6
+ padding: 48px 56px;
7
+ &.es-complex {
8
+ padding: 56px 56px 20px 56px;
9
+ }
10
+ }
11
11
  .es-login-name {
12
- margin-bottom: 40px;
12
+ margin-bottom: 16px;
13
13
  }
14
- .es-login-main {
15
- padding: 40px 34px 32px 34px;
16
- &.es-switchs {
17
- padding: 30px 34px;
18
- .es-login-title {
19
- margin-bottom: 30px;
14
+ .es-login-model {
15
+ right: 8px;
16
+ top: 8px;
17
+ .es-icon-box {
18
+ width: 40px;
19
+ height: 40px;
20
+ &::after {
21
+ border-width: 22px;
20
22
  }
21
- .es-qrcode-box,
22
- .es-wx-qrcode-box {
23
- height: 268px;
24
- padding-top: 16px;
25
- padding-bottom: 16px;
23
+ .es-icon {
24
+ font-size: 38px;
26
25
  }
27
26
  }
28
- .es-login-title-image {
29
- margin: -40px -34px 16px -34px;
30
- & + .es-login-form-box .es-login-verify {
31
- padding-top: 26px;
32
- }
27
+ .es-login-model-tips {
28
+ width: 128px;
29
+ height: 32px;
30
+ padding: 6px 8px 6px 4px;
31
+ line-height: 20px;
32
+ right: 46px;
33
+ top: 8px;
33
34
  }
34
- .es-login-switch {
35
- .es-icon {
36
- font-size: 48px;
37
- width: 48px;
38
- height: 48px;
35
+ }
36
+ .es-login-models {
37
+ padding-top: 12px;
38
+ bottom: 10px;
39
+ .es-icon-box {
40
+ & + .es-icon-box {
41
+ margin-left: 12px;
39
42
  }
40
43
  }
41
- .es-warning {
42
- font-size: 14px;
44
+ .es-icon {
45
+ font-size: 22px;
43
46
  }
44
47
  }
45
-
46
- .es-login-title {
47
- height: 22px;
48
- margin-bottom: 30px;
48
+ .es-login-complex-title {
49
+ height: 12px;
49
50
  font-size: 18px;
50
- line-height: 22px;
51
-
52
- .es-login-title-content {
53
- margin: 0 12px;
54
- }
51
+ line-height: 18px;
52
+ transform: translateY(-16px);
55
53
  }
56
- .es-login-switchs {
57
- padding-bottom: 10px;
58
- .es-icon {
59
- font-size: 20px;
54
+ .es-login-complex-models {
55
+ height: 40px;
56
+ line-height: 40px;
57
+ margin-bottom: 12px;
58
+ .es-login-complex-models-item {
59
+ padding: 0 10px;
60
+ font-size: 16px;
61
+ & + .es-login-complex-models-item {
62
+ margin-left: 24px;
63
+ }
64
+ &.es-active {
65
+ color: $--color-primary;
66
+ border-bottom: 1px solid $--color-primary;
67
+ }
60
68
  }
61
69
  }
62
- .es-login-form {
63
- .el-form-item {
64
- margin-bottom: 22px;
70
+ .es-login-title {
71
+ font-size: 20px;
72
+ line-height: 20px;
73
+ padding-bottom: 18px;
74
+ .es-login-title-content {
75
+ margin: 0 24px;
65
76
  }
66
- .el-input__inner {
67
- padding-left: 40px;
77
+ &.es-login-title-complex {
68
78
  height: 40px;
79
+ font-size: 16px;
69
80
  line-height: 40px;
70
- font-size: 14px;
71
-
72
- &::-webkit-input-placeholder {
73
- font-size: 14px;
81
+ .es-login-title-content {
82
+ padding: 0 12px;
83
+ border-bottom-width: 1px;
74
84
  }
75
85
  }
76
-
77
- .el-input__prefix {
78
- left: 16px;
86
+ }
87
+ .es-login-form {
88
+ height: 264px;
89
+ .el-form-item__content {
79
90
  line-height: 40px;
80
91
  }
81
-
82
- .es-label-user {
83
- font-size: 14px;
84
- }
85
-
86
- .es-label-password {
87
- font-size: 16px;
88
- top: 0;
89
- }
90
-
91
- .el-input__clear {
92
- font-size: 14px;
93
- line-height: 36px;
94
- }
95
-
96
- .es-label-code-image {
92
+ .el-input__inner {
93
+ height: 40px;
97
94
  font-size: 16px;
98
- line-height: 36px;
95
+ padding-left: 42px;
99
96
  }
100
-
101
- .es-label-image-code {
102
- padding-right: 100px;
103
-
104
- .el-input__suffix {
105
- padding: 2px;
106
- .es-get-code {
107
- margin-top: -2px;
108
- margin-bottom: -2px;
109
- padding: 5px 6px;
110
- line-height: 28px;
111
- }
112
- }
113
-
114
- .es-img-code {
115
- height: 32px;
97
+ .el-input__prefix {
98
+ width: 40px;
99
+ height: 40px;
100
+ padding-left: 5px;
101
+ line-height: 40px;
102
+ i {
103
+ line-height: 40px;
104
+ font-size: 18px;
116
105
  }
117
106
  }
118
-
119
- .el-form-item__error {
120
- font-size: 12px;
121
- }
122
-
123
- .es-password-handle {
124
- margin-top: 0;
125
- margin-bottom: 20px;
126
-
127
- .el-checkbox__label {
128
- font-size: 12px;
129
- }
130
-
131
- .el-checkbox__input {
132
- .el-checkbox__inner {
133
- width: 14px;
134
- height: 14px;
135
- top: 1px;
136
- padding-left: 6px;
137
-
138
- &::after {
139
- left: 4px;
140
- top: 0px;
141
- }
142
- }
143
-
144
- &.is-checked {
145
- .el-checkbox__inner::after {
146
- transform: rotate(45deg) scaleY(0.9);
147
- }
148
- }
107
+ .el-input__suffix-inner {
108
+ height: 40px;
109
+ line-height: 40px;
110
+ .el-input__icon {
111
+ line-height: 40px;
112
+ font-size: 16px;
149
113
  }
150
-
151
- .es-password-forget {
152
- font-size: 12px;
114
+ .es-img-code {
115
+ height: 36px;
153
116
  }
154
- }
155
-
156
- .extra {
157
- margin-top: 20px;
158
- display: flex;
159
- justify-content: space-between;
160
-
161
- span {
162
- cursor: pointer;
163
- font-size: 14px;
164
- color: #12278b;
117
+ .es-get-code {
118
+ width: 94px;
119
+ height: 40px;
120
+ line-height: 40px;
165
121
  }
166
122
  }
167
-
168
123
  .es-button-submit {
169
124
  height: 40px;
125
+ font-size: 18px;
170
126
  line-height: 40px;
171
- font-size: 16px;
172
- padding: 0 8px;
173
- border-radius: 8px;
174
127
  }
175
- &.es-login-verify {
176
- .es-login-title {
177
- margin-bottom: 56px;
178
- }
179
- .el-form-item {
180
- margin-bottom: 40px;
181
- }
128
+ .es-label-image-code {
129
+ padding-right: 95px;
182
130
  }
183
131
  }
184
-
185
132
  .es-login-qrcode {
186
- .es-login-down-app {
187
- .es-login-app-name {
188
- padding: 0 4px;
189
- }
190
- }
191
- .es-login-title {
192
- margin-bottom: 18px;
193
- }
194
- .es-qrcode-box,
195
- .es-wx-qrcode-box {
196
- height: 280px;
197
- padding-top: 16px;
198
- padding-bottom: 16px;
199
- }
200
- }
201
- }
202
- }
203
- @mixin loginSmall {
204
- .es-login-logo {
205
- height: 38px;
206
- left: 20px;
207
- top: 20px;
208
- }
209
- .es-login.es-adaptive {
210
- width: 360px;
211
- padding: 0 8px;
212
- .es-login-name {
213
- margin-bottom: 40px;
133
+ height: 264px;
214
134
  }
215
- .es-login-main {
216
- padding: 26px 30px;
217
- &.es-switchs {
218
- padding: 20px 30px 32px 30px;
219
- .es-login-title {
220
- margin-bottom: 14px;
221
- }
222
- .es-qrcode-box,
223
- .es-wx-qrcode-box {
224
- height: 202px;
225
- padding-top: 12px;
226
- padding-bottom: 12px;
227
- }
228
- }
229
- .es-login-title-image {
230
- margin: -26px -30px 10px -30px;
231
-
232
- & + .es-login-form-box .es-qrcode-box,
233
- & + .es-login-form-box .es-wx-qrcode-box {
234
- height: 202px;
235
- padding-top: 12px;
236
- padding-bottom: 12px;
237
- }
238
- & + .es-login-form-box .es-login-verify {
239
- padding-top: 24px;
240
- }
241
- }
242
- .es-login-switch {
243
- .es-icon {
244
- font-size: 32px;
245
- width: 32px;
246
- height: 32px;
247
- }
248
- }
249
- .es-downloadSetup {
250
- padding-bottom: 4px;
251
- }
252
- .es-downloadSetup,
253
- .es-warning {
254
- font-size: 11px;
255
- }
256
- }
257
-
258
- .es-login-title {
135
+ .es-password-handle {
259
136
  height: 22px;
260
- margin-bottom: 14px;
261
- font-size: 15px;
262
- line-height: 22px;
263
-
264
- .es-login-title-content {
265
- margin: 0 12px;
266
- }
267
- }
268
- .es-login-switchs {
269
- padding-bottom: 7px;
270
- .es-icon {
271
- font-size: 17px;
272
- }
273
- }
274
- .es-login-form {
275
- padding-bottom: 12px;
276
- .el-form-item {
277
- margin-bottom: 18px;
278
- }
279
- .el-input__inner {
280
- padding-left: 30px;
281
- height: 30px;
282
- line-height: 30px;
283
- font-size: 12px;
284
-
285
- &::-webkit-input-placeholder {
286
- font-size: 12px;
287
- }
288
- }
289
-
290
- .el-input__prefix {
291
- left: 10px;
292
- line-height: 30px;
293
- }
294
-
295
- .es-label-user {
296
- font-size: 14px;
297
- }
137
+ margin-bottom: 12px;
298
138
 
299
- .es-label-password {
300
- font-size: 16px;
301
- top: 0;
302
- }
303
-
304
- .el-input__clear {
139
+ .el-checkbox__label {
305
140
  font-size: 14px;
306
- line-height: 30px;
307
141
  }
308
142
 
309
- .es-label-code-image {
310
- font-size: 16px;
311
- line-height: 30px;
312
- }
313
-
314
- .es-label-image-code {
315
- padding-right: 100px;
143
+ .el-checkbox__input {
144
+ .el-checkbox__inner {
145
+ width: 18px;
146
+ height: 18px;
147
+ border-radius: 10px;
316
148
 
317
- .el-input__suffix {
318
- padding: 2px;
319
- .es-get-code {
320
- margin-top: -2px;
321
- margin-bottom: -2px;
322
- padding: 5px 6px;
323
- line-height: 18px;
324
- font-size: 12px;
149
+ &::after {
150
+ border: 2px solid #ffffff;
151
+ border-left: 0;
152
+ border-top: 0;
153
+ height: 8px;
154
+ left: 6px;
155
+ top: 2px;
325
156
  }
326
157
  }
327
-
328
- .es-img-code {
329
- height: 28px;
330
- }
331
158
  }
332
159
 
333
- .el-form-item__error {
334
- font-size: 11px;
335
- padding-top: 2px;
160
+ .es-password-forget {
161
+ font-size: 14px;
336
162
  }
337
-
338
- .es-password-handle {
339
- margin-top: 0;
340
- margin-bottom: 14px;
341
-
342
- .el-checkbox__label {
343
- font-size: 12px;
344
- }
345
-
346
- .el-checkbox__input {
347
- .el-checkbox__inner {
348
- width: 14px;
349
- height: 14px;
350
- top: 1px;
351
- padding-left: 6px;
352
-
353
- &::after {
354
- left: 4px;
355
- top: 0px;
356
- }
357
- }
358
-
359
- &.is-checked {
360
- .el-checkbox__inner::after {
361
- transform: rotate(45deg) scaleY(0.9);
362
- }
363
- }
364
- }
365
-
366
- .es-password-forget {
367
- font-size: 12px;
163
+ }
164
+ .es-login-complex-app {
165
+ .es-login-complex-scan {
166
+ padding-right: 16px;
167
+ .es-icon-scan {
168
+ font-size: 30px;
368
169
  }
369
- }
370
-
371
- .extra {
372
- margin-top: 20px;
373
- display: flex;
374
- justify-content: space-between;
375
-
376
- span {
377
- cursor: pointer;
378
- font-size: 12px;
379
- color: #12278b;
170
+ .es-login-complex-scan-tips {
171
+ line-height: 18px;
380
172
  }
381
173
  }
382
-
383
- .es-button-submit {
384
- height: 30px;
385
- line-height: 30px;
386
- font-size: 12px;
387
- padding: 0 8px;
388
- border-radius: 8px;
389
- }
390
- &.es-login-verify {
391
- .es-login-title {
392
- margin-bottom: 38px;
393
- }
394
- .el-form-item {
395
- margin-bottom: 30px;
396
- }
174
+ .es-login-complex-download {
175
+ margin-left: 16px;
176
+ line-height: 36px;
397
177
  }
398
178
  }
399
-
400
- .es-login-qrcode {
401
- .es-login-down-app {
402
- font-size: 11px;
403
- .es-login-app-name {
404
- padding: 0;
405
- }
406
- }
407
- .es-login-title {
408
- margin-bottom: 10px;
409
- }
410
- .es-qrcode-box,
411
- .es-wx-qrcode-box {
412
- height: 206px;
413
- padding-top: 12px;
414
- padding-bottom: 12px;
415
- }
179
+ .es-to-login {
180
+ margin-right: -40px;
181
+ font-size: 17px;
182
+ padding-top: 14px;
416
183
  }
417
184
  }
418
185
  }
419
- @mixin loginMini {
420
- .es-login-logo {
421
- height: 38px;
422
- left: 20px;
423
- top: 20px;
424
- }
425
- .es-login.es-adaptive {
426
- width: 360px;
427
- padding: 0 8px;
186
+ @mixin loginSmall {
187
+ .es-login {
188
+ width: $--login-width * 0.6666;
189
+ .es-login-main {
190
+ padding: 34px 44px;
191
+ &.es-complex {
192
+ padding: 44px 44px 14px 44px;
193
+ }
194
+ }
428
195
  .es-login-name {
429
- margin-bottom: 40px;
196
+ margin-bottom: 12px;
430
197
  }
431
- .es-login-main {
432
- padding: 26px 30px;
433
- &.es-switchs {
434
- padding: 20px 30px 32px 30px;
435
- .es-login-title {
436
- margin-bottom: 14px;
198
+ .es-login-model {
199
+ right: 6px;
200
+ top: 6px;
201
+ .es-icon-box {
202
+ width: 36px;
203
+ height: 36px;
204
+ &::after {
205
+ border-width: 19px;
437
206
  }
438
- .es-qrcode-box,
439
- .es-wx-qrcode-box {
440
- height: 202px;
441
- padding-top: 12px;
442
- padding-bottom: 12px;
207
+ .es-icon {
208
+ font-size: 34px;
443
209
  }
444
210
  }
445
- .es-login-title-image {
446
- margin: -26px -30px 10px -30px;
447
- & + .es-login-form-box .es-qrcode-box,
448
- & + .es-login-form-box .es-wx-qrcode-box {
449
- height: 202px;
450
- padding-top: 12px;
451
- padding-bottom: 12px;
452
- }
453
- & + .es-login-form-box .es-login-verify {
454
- padding-top: 24px;
455
- }
211
+ .es-login-model-tips {
212
+ width: 100px;
213
+ height: 26px;
214
+ font-size: 12px;
215
+ padding: 4px 6px 4px 2px;
216
+ line-height: 20px;
217
+ right: 38px;
218
+ top: 6px;
456
219
  }
457
- .es-login-switch {
458
- .es-icon {
459
- font-size: 32px;
460
- width: 32px;
461
- height: 32px;
220
+ }
221
+ .es-login-models {
222
+ padding-top: 12px;
223
+ bottom: 10px;
224
+ .es-icon-box {
225
+ & + .es-icon-box {
226
+ margin-left: 12px;
462
227
  }
463
228
  }
464
- .es-downloadSetup {
465
- padding-bottom: 4px;
229
+ .es-icon {
230
+ font-size: 20px;
466
231
  }
467
- .es-downloadSetup,
468
- .es-warning {
469
- font-size: 11px;
232
+ }
233
+ .es-login-complex-title {
234
+ height: 10px;
235
+ font-size: 16px;
236
+ line-height: 16px;
237
+ }
238
+ .es-login-complex-models {
239
+ height: 30px;
240
+ line-height: 30px;
241
+ margin-bottom: 8px;
242
+ .es-login-complex-models-item {
243
+ padding: 0 8px;
244
+ font-size: 14px;
245
+ & + .es-login-complex-models-item {
246
+ margin-left: 18px;
247
+ }
470
248
  }
471
249
  }
472
-
473
250
  .es-login-title {
474
- height: 22px;
475
- margin-bottom: 14px;
476
- font-size: 15px;
477
- line-height: 22px;
478
-
251
+ font-size: 16px;
252
+ line-height: 16px;
253
+ padding-bottom: 14px;
479
254
  .es-login-title-content {
480
- margin: 0 12px;
255
+ margin: 0 24px;
481
256
  }
482
- }
483
- .es-login-switchs {
484
- padding-bottom: 7px;
485
- .es-icon {
486
- font-size: 17px;
257
+ &.es-login-title-complex {
258
+ height: 30px;
259
+ font-size: 14px;
260
+ line-height: 30px;
261
+ .es-login-title-content {
262
+ padding: 0 10px;
263
+ }
487
264
  }
488
265
  }
489
266
  .es-login-form {
490
- padding-bottom: 12px;
491
- .el-form-item {
492
- margin-bottom: 18px;
267
+ height: 224px;
268
+ .el-form-item__content {
269
+ line-height: 32px;
493
270
  }
494
271
  .el-input__inner {
495
- padding-left: 30px;
496
- height: 30px;
497
- line-height: 30px;
498
- font-size: 12px;
499
-
500
- &::-webkit-input-placeholder {
501
- font-size: 12px;
502
- }
272
+ height: 32px;
273
+ font-size: 14px;
274
+ padding-left: 34px;
503
275
  }
504
-
505
276
  .el-input__prefix {
506
- left: 10px;
507
- line-height: 30px;
508
- }
509
-
510
- .es-label-user {
511
- font-size: 14px;
277
+ width: 32px;
278
+ height: 32px;
279
+ padding-left: 5px;
280
+ line-height: 32px;
281
+ i {
282
+ line-height: 32px;
283
+ font-size: 16px;
284
+ }
512
285
  }
513
-
514
- .es-label-password {
515
- font-size: 16px;
516
- top: 0;
286
+ .el-input__suffix-inner {
287
+ height: 32px;
288
+ line-height: 32px;
289
+ .el-input__icon {
290
+ line-height: 32px;
291
+ font-size: 14px;
292
+ }
293
+ .es-img-code {
294
+ height: 30px;
295
+ }
296
+ .es-get-code {
297
+ width: 80px;
298
+ height: 32px;
299
+ line-height: 32px;
300
+ }
517
301
  }
518
-
519
- .el-input__clear {
302
+ .es-button-submit {
303
+ height: 32px;
520
304
  font-size: 14px;
521
- line-height: 30px;
305
+ line-height: 32px;
522
306
  }
523
-
524
- .es-label-code-image {
525
- font-size: 16px;
526
- line-height: 30px;
527
- }
528
-
529
307
  .es-label-image-code {
530
- padding-right: 100px;
531
-
532
- .el-input__suffix {
533
- padding: 2px;
534
- .es-get-code {
535
- margin-top: -2px;
536
- margin-bottom: -2px;
537
- padding: 5px 6px;
538
- line-height: 18px;
539
- font-size: 12px;
540
- }
541
- }
542
-
543
- .es-img-code {
544
- height: 28px;
545
- }
308
+ padding-right: 80px;
546
309
  }
547
-
548
- .el-form-item__error {
549
- font-size: 11px;
550
- padding-top: 2px;
310
+ }
311
+ .es-login-qrcode {
312
+ height: 224px;
313
+ .es-login-down-app {
314
+ font-size: 12px;
551
315
  }
316
+ }
317
+ .es-password-handle {
318
+ height: 22px;
319
+ margin-bottom: 8px;
552
320
 
553
- .es-password-handle {
554
- margin-top: 0;
555
- margin-bottom: 14px;
556
-
557
- .el-checkbox__label {
558
- font-size: 12px;
559
- }
560
-
561
- .el-checkbox__input {
562
- .el-checkbox__inner {
563
- width: 14px;
564
- height: 14px;
565
- top: 1px;
566
- padding-left: 6px;
321
+ .el-checkbox__label {
322
+ font-size: 14px;
323
+ padding-left: 6px;
324
+ }
567
325
 
568
- &::after {
569
- left: 4px;
570
- top: 0px;
571
- }
572
- }
326
+ .el-checkbox__input {
327
+ .el-checkbox__inner {
328
+ width: 16px;
329
+ height: 16px;
330
+ border-radius: 10px;
573
331
 
574
- &.is-checked {
575
- .el-checkbox__inner::after {
576
- transform: rotate(45deg) scaleY(0.9);
577
- }
332
+ &::after {
333
+ height: 6px;
334
+ left: 5px;
335
+ top: 2px;
578
336
  }
579
337
  }
580
-
581
- .es-password-forget {
582
- font-size: 12px;
583
- }
584
338
  }
585
339
 
586
- .extra {
587
- margin-top: 20px;
588
- display: flex;
589
- justify-content: space-between;
590
-
591
- span {
592
- cursor: pointer;
340
+ .es-password-forget {
341
+ font-size: 14px;
342
+ }
343
+ }
344
+ .es-login-complex-app {
345
+ .es-login-complex-scan {
346
+ padding-right: 16px;
347
+ .es-icon-scan {
348
+ font-size: 22px;
349
+ }
350
+ .es-login-complex-scan-tips {
351
+ line-height: 14px;
593
352
  font-size: 12px;
594
- color: #12278b;
595
353
  }
596
354
  }
597
-
598
- .es-button-submit {
599
- height: 30px;
355
+ .es-login-complex-download {
356
+ margin-left: 16px;
600
357
  line-height: 30px;
601
- font-size: 12px;
602
- padding: 0 8px;
603
- border-radius: 8px;
604
358
  }
605
- &.es-login-verify {
606
- .es-login-title {
607
- margin-bottom: 38px;
359
+ }
360
+ .es-to-login {
361
+ margin-right: -30px;
362
+ font-size: 14px;
363
+ padding-top: 8px;
364
+ }
365
+ }
366
+ }
367
+ @mixin loginMini {
368
+ .es-login {
369
+ .es-login-main {
370
+ padding: 30px 40px;
371
+ &.es-complex {
372
+ padding: 40px 40px 10px 40px;
373
+ }
374
+ }
375
+ .es-login-name {
376
+ margin-bottom: 8px;
377
+ }
378
+ .es-login-model {
379
+ .es-icon-box {
380
+ width: 32px;
381
+ height: 32px;
382
+ &::after {
383
+ border-width: 17px;
384
+ }
385
+ .es-icon {
386
+ font-size: 30px;
387
+ }
388
+ }
389
+ }
390
+ .es-login-models {
391
+ padding-top: 12px;
392
+ bottom: 10px;
393
+ .es-icon-box {
394
+ & + .es-icon-box {
395
+ margin-left: 12px;
608
396
  }
609
- .el-form-item {
610
- margin-bottom: 30px;
397
+ }
398
+ .es-icon {
399
+ font-size: 18px;
400
+ }
401
+ }
402
+ .es-login-complex-title {
403
+ height: 10px;
404
+ font-size: 14px;
405
+ line-height: 14px;
406
+ }
407
+ .es-login-complex-models {
408
+ height: 24px;
409
+ line-height: 24px;
410
+ margin-bottom: 4px;
411
+ .es-login-complex-models-item {
412
+ padding: 0 4px;
413
+ font-size: 12px;
414
+ & + .es-login-complex-models-item {
415
+ margin-left: 12px;
611
416
  }
612
417
  }
613
418
  }
614
-
419
+ .es-login-title {
420
+ font-size: 14px;
421
+ line-height: 14px;
422
+ padding-bottom: 10px;
423
+ .es-login-title-content {
424
+ margin: 0 24px;
425
+ }
426
+ &.es-login-title-complex {
427
+ height: 24px;
428
+ font-size: 14px;
429
+ line-height: 24px;
430
+ .es-login-title-content {
431
+ padding: 0 10px;
432
+ }
433
+ }
434
+ }
435
+ .es-login-form {
436
+ height: 210px;
437
+ .el-input__inner {
438
+ font-size: 12px;
439
+ }
440
+ }
615
441
  .es-login-qrcode {
616
- .es-login-down-app {
617
- font-size: 11px;
618
- .es-login-app-name {
619
- padding: 0;
442
+ height: 210px;
443
+ }
444
+ .es-password-handle {
445
+ .el-checkbox__label {
446
+ font-size: 12px;
447
+ }
448
+
449
+ .el-checkbox__input {
450
+ .el-checkbox__inner {
451
+ width: 14px;
452
+ height: 14px;
453
+ ß &::after {
454
+ height: 6px;
455
+ left: 4px;
456
+ top: 1px;
457
+ }
620
458
  }
621
459
  }
622
- .es-login-title {
623
- margin-bottom: 10px;
460
+
461
+ .es-password-forget {
462
+ font-size: 12px;
463
+ }
464
+ }
465
+ .es-login-complex-app {
466
+ .es-login-complex-scan {
467
+ padding-right: 12px;
468
+ .es-icon-scan {
469
+ font-size: 22px;
470
+ }
471
+ .es-login-complex-scan-tips {
472
+ line-height: 14px;
473
+ font-size: 12px;
474
+ }
624
475
  }
625
- .es-qrcode-box,
626
- .es-wx-qrcode-box {
627
- height: 206px;
628
- padding-top: 12px;
629
- padding-bottom: 12px;
476
+ .es-login-complex-download {
477
+ margin-left: 12px;
478
+ line-height: 28px;
479
+ font-size: 12px;
630
480
  }
631
481
  }
482
+ .es-to-login {
483
+ margin-right: -20px;
484
+ font-size: 14px;
485
+ padding-top: 4px;
486
+ }
632
487
  }
633
488
  }
634
489
  .es-login-screen {
@@ -649,290 +504,228 @@
649
504
  .es-login {
650
505
  width: $--login-width;
651
506
  position: absolute;
652
- padding: 0 12px;
653
- .es-login-name {
654
- display: block;
655
- margin-bottom: 56px;
656
- position: relative;
657
- left: 50%;
658
- transform: translateX(-50%);
659
- }
660
507
  .es-login-main {
661
- padding: $--login-padding;
508
+ padding: 50px 70px;
662
509
  position: relative;
663
510
  border-radius: 20px;
664
511
  background-size: 100% 100%;
665
512
  background-color: #ffffff;
666
513
  background-repeat: no-repeat;
667
514
  box-shadow: $--box-shadow-light;
668
- .es-login-title-image {
669
- margin: -60px -70px 22px -70px;
670
- border-radius: 20px 20px 0 0;
671
- overflow: hidden;
672
- & + .es-login-form-box .es-login-verify {
673
- padding-top: 30px;
674
- }
675
- .es-login-title-img {
676
- width: 100%;
677
- }
515
+ &.es-complex {
516
+ padding: 70px 70px 30px 70px;
678
517
  }
679
- .es-login-switch {
680
- position: absolute;
681
- right: 10px;
682
- top: 10px;
683
- overflow: hidden;
684
- z-index: 99;
518
+ }
519
+ .es-login-name {
520
+ margin-bottom: 20px;
521
+ position: relative;
522
+ left: 50%;
523
+ transform: translateX(-50%);
524
+ }
525
+ .es-login-model {
526
+ position: absolute;
527
+ right: 10px;
528
+ top: 10px;
529
+ z-index: 99;
530
+ .es-icon-box {
531
+ display: block;
532
+ width: 50px;
533
+ height: 50px;
534
+ cursor: pointer;
535
+ position: relative;
536
+ padding: 1px;
537
+ &::after {
538
+ content: '';
539
+ position: absolute;
540
+ left: 0;
541
+ top: 0;
542
+ right: 0;
543
+ bottom: 0;
544
+ border-color: transparent transparent #fff #fff;
545
+ border-style: solid;
546
+ border-width: 28px;
547
+ }
685
548
  .es-icon {
686
- display: block;
687
- width: 60px;
688
- height: 60px;
689
- font-size: 60px;
549
+ font-size: 48px;
690
550
  color: $--color-primary;
691
- cursor: pointer;
692
- position: relative;
693
- overflow: hidden;
694
- &::after {
695
- content: '';
696
- position: absolute;
697
- left: -2px;
698
- top: -2px;
699
- right: -2px;
700
- bottom: -2px;
701
- border-color: transparent transparent #fff #fff;
702
- border-style: solid;
703
- border-width: 34px;
704
- }
705
551
  }
706
552
  }
707
- .es-login-switchs {
708
- position: absolute;
709
- bottom: 0;
710
- left: 0;
711
- right: 0;
553
+ .es-login-model-tips {
554
+ width: 128px;
555
+ height: 40px;
556
+ padding: 8px 10px 8px 6px;
557
+ line-height: 24px;
712
558
  text-align: center;
713
- padding-bottom: 10px;
714
- color: #d9d9d9;
715
- z-index: 99;
716
- .es-icon {
717
- font-size: 24px;
718
- cursor: pointer;
719
- & + .es-icon {
720
- margin-left: 12px;
721
- }
722
- &.es-icon-active {
723
- color: $--color-primary-light-6;
724
- }
725
- }
559
+ color: #d4815e;
560
+ background-repeat: no-repeat;
561
+ background-size: 100% 100%;
562
+ position: absolute;
563
+ right: 60px;
564
+ top: 10px;
726
565
  }
727
- .es-downloadSetup {
728
- font-size: $--font-size-base;
729
- text-align: center;
730
- line-height: 18px;
731
- padding-bottom: 6px;
732
- span {
733
- cursor: pointer;
734
- color: #333333;
735
- &:hover {
736
- color: #f9d900;
737
- }
738
- }
739
- &:last-child {
740
- padding-bottom: 0;
566
+ }
567
+ .es-login-models {
568
+ text-align: center;
569
+ color: #d9d9d9;
570
+ padding-top: 12px;
571
+ position: absolute;
572
+ left: 0;
573
+ right: 0;
574
+ bottom: 10px;
575
+ .es-icon-box {
576
+ & + .es-icon-box {
577
+ margin-left: 12px;
578
+ }
579
+ &.es-icon-active {
580
+ color: $--color-primary-light-6;
741
581
  }
742
582
  }
743
- .es-warning {
744
- color: #a90404;
745
- line-height: 18px;
746
- font-size: $--font-size-base;
747
- text-align: center;
583
+ .es-icon {
584
+ font-size: 24px;
585
+ cursor: pointer;
748
586
  }
749
- &.es-switchs {
750
- padding: 40px 70px;
751
- .es-login-title-image {
752
- margin: -40px -70px 22px -70px;
587
+ }
588
+ .es-login-complex-title {
589
+ height: 22px;
590
+ font-size: 22px;
591
+ font-family: 'zihun';
592
+ font-weight: normal;
593
+ color: $--color-primary;
594
+ line-height: 22px;
595
+ transform: translateY(-20px);
596
+ }
597
+ .es-login-complex-models {
598
+ display: flex;
599
+ height: 40px;
600
+ line-height: 40px;
601
+ margin-bottom: 18px;
602
+ .es-login-complex-models-item {
603
+ min-width: 64px;
604
+ padding: 0 13px;
605
+ font-size: 18px;
606
+ color: #939393;
607
+ text-align: center;
608
+ cursor: pointer;
609
+ & + .es-login-complex-models-item {
610
+ margin-left: 30px;
753
611
  }
754
- .es-login-title {
755
- margin-bottom: 38px;
612
+ &.es-active {
613
+ color: $--color-primary;
614
+ border-bottom: 1px solid $--color-primary;
756
615
  }
757
616
  }
617
+ &.es-complex-title {
618
+ justify-content: center;
619
+ }
758
620
  }
759
-
760
621
  .es-login-title {
761
- color: $--color-primary-light-6;
622
+ color: $--color-primary;
762
623
  display: flex;
763
624
  align-items: center;
764
- height: 24px;
765
625
  font-size: 24px;
766
626
  line-height: 24px;
767
627
  font-weight: bold;
768
- margin-bottom: 38px;
769
628
  position: relative;
629
+ padding-bottom: 30px;
770
630
 
771
- &::before,
772
- &::after {
631
+ &:not(.es-login-title-complex)::before,
632
+ &:not(.es-login-title-complex)::after {
773
633
  content: '';
774
634
  height: 1px;
775
635
  flex: 1;
776
636
  background-color: #eeeeee;
777
637
  }
778
-
779
638
  .es-login-title-content {
780
639
  margin: 0 24px;
781
640
  }
641
+ &.es-login-title-complex {
642
+ justify-content: center;
643
+ height: 40px;
644
+ font-size: 16px;
645
+ line-height: 40px;
646
+ .es-login-title-content {
647
+ padding: 0 12px;
648
+ border-bottom: 2px solid $--color-primary;
649
+ }
650
+ }
782
651
  }
783
652
  .es-login-form {
784
- border-radius: 20px;
785
- background-color: rgba($color: #ffffff, $alpha: 0.3);
786
- position: relative;
787
- padding-bottom: 20px;
788
-
789
- .el-form-item {
790
- margin-bottom: 32px;
791
- }
792
-
653
+ height: 340px;
654
+ display: flex;
655
+ flex-direction: column;
656
+ justify-content: space-around;
793
657
  .el-form-item__content {
794
- line-height: normal;
795
- }
796
-
797
- .el-form-item__error {
798
- font-size: 14px;
658
+ line-height: 50px;
799
659
  }
800
-
801
- .el-input__clear {
802
- font-size: 18px;
660
+ .el-form-item {
661
+ margin-bottom: 0;
803
662
  }
804
-
805
663
  .el-input__inner {
806
664
  height: 50px;
807
- line-height: 50px;
808
665
  font-size: 18px;
809
666
  background-color: #f7f7f7;
810
- border-radius: 10px;
811
- padding-left: 50px;
812
- &::-webkit-input-placeholder {
813
- font-size: 16px;
814
- }
815
- &:-moz-placeholder {
816
- font-size: 16px;
817
- }
818
- &::-moz-placeholder {
819
- font-size: 16px;
820
- }
821
- &:-ms-input-placeholder {
822
- font-size: 16px;
823
- }
667
+ border-radius: $--login-form-radius;
668
+ padding-left: 52px;
824
669
  }
825
-
826
670
  .el-input__prefix {
827
- left: 20px;
671
+ width: 48px;
672
+ left: 0;
673
+ padding-left: 6px;
828
674
  line-height: 50px;
675
+ height: 50px;
676
+ i {
677
+ line-height: 50px;
678
+ font-size: 20px;
679
+ color: #333;
680
+ }
829
681
  }
830
- .el-input__suffix {
682
+ .el-input__suffix-inner {
683
+ display: block;
684
+ height: 50px;
831
685
  line-height: 50px;
832
686
  .el-input__icon {
833
687
  line-height: 50px;
688
+ font-size: 18px;
834
689
  }
835
- }
836
-
837
- .es-label-user {
838
- font-size: 18px;
839
- color: #333333;
840
- }
841
-
842
- .es-label-password {
843
- font-size: 22px;
844
- color: #333333;
845
- position: relative;
846
- top: 2px;
847
- }
848
-
849
- .es-label-image-code {
850
- padding-right: 120px;
851
-
852
- .el-input__suffix {
853
- padding: 5px;
854
- right: 0;
855
- }
856
-
857
690
  .es-img-code {
858
691
  cursor: pointer;
692
+ height: 46px;
693
+ margin: 2px;
859
694
  }
860
695
  .es-get-code {
861
- margin-top: -5px;
862
- margin-bottom: -5px;
863
- line-height: 32px;
864
- font-size: 16px;
865
- padding: 8px 16px;
866
- }
867
- }
868
-
869
- .es-label-code-image {
870
- font-size: 20px;
871
- color: #333333;
872
- line-height: 50px;
873
- }
874
-
875
- .es-password-handle {
876
- height: 22px;
877
- justify-content: space-between;
878
- margin-top: -8px;
879
- margin-bottom: 30px;
880
-
881
- .el-checkbox__label {
882
- font-size: 16px;
883
- font-weight: 400;
884
- color: #333333 !important;
885
- }
886
-
887
- .el-checkbox__input {
888
- .el-checkbox__inner {
889
- width: 18px;
890
- height: 18px;
891
- border-radius: 10px;
892
-
893
- &::after {
894
- border: 2px solid #ffffff;
895
- border-left: 0;
896
- border-top: 0;
897
- height: 8px;
898
- left: 6px;
899
- top: 2px;
900
- }
901
- }
902
- }
903
-
904
- .es-password-forget {
905
- font-size: 16px;
906
- color: #999999;
907
- text-align: right;
908
- float: right;
909
- cursor: pointer;
696
+ width: 115px;
697
+ height: 50px;
698
+ text-align: center;
699
+ padding: 0;
700
+ line-height: 50px;
910
701
  }
911
702
  }
912
-
913
703
  .es-button-submit {
914
704
  width: 100%;
915
705
  height: 50px;
916
706
  font-size: 20px;
707
+ text-align: center;
708
+ line-height: 50px;
917
709
  font-weight: 500;
918
- border-radius: 10px;
710
+ border-radius: $--login-form-radius;
711
+ padding: 0;
919
712
  }
920
- &.es-login-verify {
921
- &.es-login-Title-img {
922
- padding-top: 30px;
923
- }
924
- .es-login-title {
925
- margin-bottom: 68px;
926
- }
927
- .el-form-item {
928
- margin-bottom: 58px;
713
+ .es-label-image-code {
714
+ padding-right: 120px;
715
+ .el-input__suffix {
716
+ right: 0;
929
717
  }
930
718
  }
931
- .el-autocomplete {
932
- width: 100%;
933
- }
934
719
  }
935
720
  .es-login-qrcode {
721
+ height: 340px;
722
+ display: flex;
723
+ flex-direction: column;
724
+ justify-content: space-around;
725
+ .es-login-qrcode-box {
726
+ flex: 1;
727
+ position: relative;
728
+ }
936
729
  .es-login-down-app {
937
730
  font-size: $--font-size-base;
938
731
  font-weight: normal;
@@ -945,39 +738,92 @@
945
738
  }
946
739
  .es-qrcode-box,
947
740
  .es-wx-qrcode-box {
948
- height: 340px;
949
- padding-top: 20px;
950
- padding-bottom: 20px;
741
+ position: absolute;
742
+ left: 0;
743
+ top: 0;
744
+ right: 0;
745
+ bottom: 0;
746
+ }
747
+ }
748
+ .es-password-handle {
749
+ height: 22px;
750
+ justify-content: space-between;
751
+ margin-bottom: 22px;
752
+
753
+ .el-checkbox__label {
754
+ font-size: 16px;
755
+ font-weight: 400;
756
+ color: #333333 !important;
757
+ }
758
+
759
+ .el-checkbox__input {
760
+ .el-checkbox__inner {
761
+ width: 18px;
762
+ height: 18px;
763
+ border-radius: 10px;
764
+
765
+ &::after {
766
+ border: 2px solid #ffffff;
767
+ border-left: 0;
768
+ border-top: 0;
769
+ height: 8px;
770
+ left: 6px;
771
+ top: 2px;
772
+ }
773
+ }
774
+ }
775
+
776
+ .es-password-forget {
777
+ font-size: 16px;
778
+ color: #999999;
779
+ text-align: right;
780
+ float: right;
781
+ cursor: pointer;
951
782
  }
952
- .es-qrcode-img {
953
- border: $--border-base;
783
+ }
784
+ .es-login-complex-app {
785
+ display: flex;
786
+ align-items: center;
787
+ justify-content: center;
788
+ .es-login-complex-scan {
789
+ display: flex;
790
+ align-items: center;
791
+ justify-content: center;
792
+ color: #666;
793
+ padding-right: 16px;
794
+ border-right: 1px solid #ccc;
795
+ .es-icon-scan {
796
+ font-size: 34px;
797
+ color: #97a1c3;
798
+ margin-right: 3px;
799
+ }
800
+ .es-login-complex-scan-tips {
801
+ line-height: 20px;
802
+ }
803
+ }
804
+ .es-login-complex-download {
805
+ margin-left: 16px;
806
+ line-height: 40px;
807
+ .es-login-app-name {
808
+ color: $--color-primary;
809
+ font-weight: bold;
810
+ }
954
811
  }
955
812
  }
813
+ .es-to-login {
814
+ text-align: right;
815
+ margin-right: -45px;
816
+ font-size: 20px;
817
+ color: $--color-primary;
818
+ padding-top: 20px;
819
+ }
956
820
  &.es-simple {
957
821
  .es-login-form {
958
822
  .el-input__inner {
959
823
  border-width: 0 0 1px 0;
960
824
  border-radius: 0;
961
825
  background-color: #fff;
962
- padding-left: 32px;
963
- padding-right: 16px;
964
826
  box-shadow: none;
965
- &::-webkit-input-placeholder {
966
- font-size: 16px;
967
- color: #999999;
968
- }
969
- &:-moz-placeholder {
970
- font-size: 16px;
971
- color: #999999;
972
- }
973
- &::-moz-placeholder {
974
- font-size: 16px;
975
- color: #999999;
976
- }
977
- &:-ms-input-placeholder {
978
- font-size: 16px;
979
- color: #999999;
980
- }
981
827
  }
982
828
  }
983
829
 
@@ -985,6 +831,9 @@
985
831
  left: 0;
986
832
  }
987
833
  }
834
+ .es-downloadSetup {
835
+ height: 20px;
836
+ }
988
837
  }
989
838
  &.es-login-medium {
990
839
  @include loginMedium;