eoss-ui 0.5.75 → 0.5.77

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