-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathlocal-search.xml
514 lines (246 loc) · 521 KB
/
local-search.xml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
<?xml version="1.0" encoding="utf-8"?>
<search>
<entry>
<title></title>
<link href="/super_zhu/2023/05/06/vue3-%20provide%E5%92%8Cinject/"/>
<url>/super_zhu/2023/05/06/vue3-%20provide%E5%92%8Cinject/</url>
<content type="html"><![CDATA[<h1 id="vue3-provide和inject"><a href="#vue3-provide和inject" class="headerlink" title="vue3- provide和inject"></a>vue3- provide和inject</h1><h2 id="依赖注入的优势"><a href="#依赖注入的优势" class="headerlink" title="依赖注入的优势"></a>依赖注入的优势</h2><p>在我们平时写项目中常常会建立很多的组件树，什么父子组件，爷孙组件都是很常见的,组件组件我们常常使用props来进行传值，但难免会遇到层级很深的传值，比如爷爷组件需要传值给孙子组件，就像下面这种情况</p><p><img src="https://cn.vuejs.org/assets/prop-drilling.11201220.png"></p><p><strong>但是！！！</strong>实际上爸爸组件（图中的Footer组件）又不需要这个值，所以我感觉这样子传值会显得很捞，而且组件复用性变差。那我们有没有什么方式不经过爸爸组件，从而让孙子组件收到这个值？那么我们今天的主角就要登场了！！！</p><h2 id="provide和inject-的使用"><a href="#provide和inject-的使用" class="headerlink" title="provide和inject 的使用"></a>provide和inject 的使用</h2><p>主要流程是使用provide先注册，在使用inject接收这个值</p><h3 id="注册"><a href="#注册" class="headerlink" title="注册"></a>注册</h3><p>provide函数接收两个值</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs js">key为字符串，其需要具有唯一性 value是需要传递的值，或者是变量，函数等<br><span class="hljs-title function_">provide</span>(key,value)<br></code></pre></td></tr></table></figure><h3 id="接收"><a href="#接收" class="headerlink" title="接收"></a>接收</h3><p>inject使用唯一key获取相应的值</p><figure class="highlight hsp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs hsp"><span class="hljs-keyword">mes</span>就是我接收过来的值，而第二个参数则是默认值，当没有相应的key注册时，<span class="hljs-keyword">mes</span>是默认值<br>const <span class="hljs-keyword">mes</span>=inject(key,<span class="hljs-keyword">default</span>)<br></code></pre></td></tr></table></figure><h3 id="简单示例"><a href="#简单示例" class="headerlink" title="简单示例"></a>简单示例</h3><p>爷爷组件</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br></pre></td><td class="code"><pre><code class="hljs js"><template><br> <span class="language-xml"><span class="hljs-tag"><<span class="hljs-name">div</span> <span class="hljs-attr">style</span>=<span class="hljs-string">"width: 100%; height: 100%;"</span> ></span></span><br><span class="language-xml"> <span class="hljs-tag"><<span class="hljs-name">h1</span>></span>{{ mes }}<span class="hljs-tag"></<span class="hljs-name">h1</span>></span></span><br><span class="language-xml"> <span class="hljs-tag"><<span class="hljs-name">button</span> @<span class="hljs-attr">click</span>=<span class="hljs-string">"addnum"</span> ></span>点击<span class="hljs-tag"></<span class="hljs-name">button</span>></span></span><br><span class="language-xml"> <span class="hljs-tag"><<span class="hljs-name">father</span> /></span></span><br><span class="language-xml"> <span class="hljs-tag"></<span class="hljs-name">div</span>></span></span><br> </template><br> <span class="language-xml"><span class="hljs-tag"><<span class="hljs-name">script</span> <span class="hljs-attr">setup</span> ></span><span class="language-javascript"></span></span><br><span class="language-javascript"><span class="language-xml"> <span class="hljs-keyword">import</span> father <span class="hljs-keyword">from</span> <span class="hljs-string">'./father.vue'</span></span></span><br><span class="language-javascript"><span class="language-xml"> <span class="hljs-keyword">import</span> {provide, ref} <span class="hljs-keyword">from</span> <span class="hljs-string">"vue"</span></span></span><br><span class="language-javascript"><span class="language-xml"> <span class="hljs-keyword">let</span> mes=<span class="hljs-title function_">ref</span>(<span class="hljs-number">0</span>)</span></span><br><span class="language-javascript"><span class="language-xml"> <span class="hljs-keyword">let</span> <span class="hljs-title function_">addnum</span>=(<span class="hljs-params"></span>)=>{</span></span><br><span class="language-javascript"><span class="language-xml"> mes.<span class="hljs-property">value</span>++</span></span><br><span class="language-javascript"><span class="language-xml"> }</span></span><br><span class="language-javascript"><span class="language-xml"> <span class="hljs-title function_">provide</span>(<span class="hljs-string">'mes'</span>,mes)</span></span><br><span class="language-javascript"><span class="language-xml"> <span class="hljs-title function_">provide</span>(<span class="hljs-string">'num'</span>,addnum)</span></span><br><span class="language-javascript"><span class="language-xml"> </span><span class="hljs-tag"></<span class="hljs-name">script</span>></span></span><br></code></pre></td></tr></table></figure><p>爸爸组件</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><code class="hljs js"><template><br> <span class="language-xml"><span class="hljs-tag"><<span class="hljs-name">son</span> /></span></span><br> </template><br> <span class="language-xml"><span class="hljs-tag"><<span class="hljs-name">script</span> <span class="hljs-attr">setup</span> ></span><span class="language-javascript"></span></span><br><span class="language-javascript"><span class="language-xml"> <span class="hljs-keyword">import</span> son <span class="hljs-keyword">from</span> <span class="hljs-string">'./son.vue'</span></span></span><br><span class="language-javascript"><span class="language-xml"> </span><span class="hljs-tag"></<span class="hljs-name">script</span>></span></span><br> <span class="language-xml"><span class="hljs-tag"><<span class="hljs-name">style</span>></span></span><br><span class="language-xml"> <span class="hljs-tag"></<span class="hljs-name">style</span>></span></span><br></code></pre></td></tr></table></figure><p>孙子组件</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><code class="hljs js"><template><br> <span class="language-xml"><span class="hljs-tag"><<span class="hljs-name">h1</span>></span>{{ mes }}<span class="hljs-tag"></<span class="hljs-name">h1</span>></span></span><br> <span class="language-xml"><span class="hljs-tag"><<span class="hljs-name">button</span> @<span class="hljs-attr">click</span>=<span class="hljs-string">"addnum"</span> ></span>点击<span class="hljs-tag"></<span class="hljs-name">button</span>></span></span><br></template><br><span class="language-xml"><span class="hljs-tag"><<span class="hljs-name">script</span> <span class="hljs-attr">setup</span> ></span><span class="language-javascript"></span></span><br><span class="language-javascript"><span class="language-xml"> <span class="hljs-keyword">import</span> {inject} <span class="hljs-keyword">from</span> <span class="hljs-string">"vue"</span></span></span><br><span class="language-javascript"><span class="language-xml"> <span class="hljs-keyword">const</span> mes=<span class="hljs-title function_">inject</span>(<span class="hljs-string">'mes'</span>,<span class="hljs-number">0</span>)</span></span><br><span class="language-javascript"><span class="language-xml"> <span class="hljs-keyword">const</span> addnum=<span class="hljs-title function_">inject</span>(<span class="hljs-string">'num'</span>,<span class="hljs-function">()=></span>{})</span></span><br><span class="language-javascript"><span class="language-xml"></span><span class="hljs-tag"></<span class="hljs-name">script</span>></span></span><br></code></pre></td></tr></table></figure><p>爷爷组件传给孙子组件的mes数据是响应式的，爷爷组件中的mes改变孙子组件的值也随之改变</p><p>而在孙子组件中触发addnum相当于在爷爷组件中触发，所以爷爷组件的mes也可以被孙子改变</p>]]></content>
</entry>
<entry>
<title></title>
<link href="/super_zhu/2023/04/30/img/Vite%20+%20Vue/"/>
<url>/super_zhu/2023/04/30/img/Vite%20+%20Vue/</url>
<content type="html"><![CDATA[<!DOCTYPE html><!-- saved from url=(0066)http://localhost:8083/#/populationCharacteristic/[object%20Object] --><html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="module" src="./Vite + Vue_files/client"></script> <link rel="icon" type="image/svg+xml" href="http://localhost:8083/vite.svg"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Vite + Vue</title> <style type="text/css" data-vite-dev-id="D:/ldatavis/data_resource/src/style.css">/* :root { font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif; line-height: 1.5; font-weight: 400; color-scheme: light dark; color: rgba(255, 255, 255, 0.87); background-color: #242424; font-synthesis: none; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-text-size-adjust: 100%;}a { font-weight: 500; color: #646cff; text-decoration: inherit;}a:hover { color: #535bf2;}a { font-weight: 500; color: #646cff; text-decoration: inherit;}a:hover { color: #535bf2;} */body { margin: 0; /* display: flex; place-items: center; */ min-width: 320px; min-height: 100vh;}-webkit-scrollbar { width: 0px; height: 0px;}/* h1 { font-size: 3.2em; line-height: 1.1;}button { border-radius: 8px; border: 1px solid transparent; padding: 0.6em 1.2em; font-size: 1em; font-weight: 500; font-family: inherit; background-color: #1a1a1a; cursor: pointer; transition: border-color 0.25s;}button:hover { border-color: #646cff;}button:focus,button:focus-visible { outline: 4px auto -webkit-focus-ring-color;}.card { padding: 2em;}#app { max-width: 1280px; margin: 0 auto; text-align: center;}@media (prefers-color-scheme: light) { :root { color: #213547; background-color: #ffffff; } a:hover { color: #747bff; } button { background-color: #f9f9f9; }} */</style><style type="text/css" data-vite-dev-id="D:/ldatavis/data_resource/src/App.vue?vue&type=style&index=0&scoped=7a7a37b1&lang.scss">[data-v-7a7a37b1] #app { padding: 0px;}[data-v-7a7a37b1] body { margin: 0px; margin: 0px;}</style><style type="text/css" data-vite-dev-id="D:/ldatavis/data_resource/node_modules/element-plus/dist/index.css">@charset "UTF-8";:root{--el-color-white:#ffffff;--el-color-black:#000000;--el-color-primary-rgb:64,158,255;--el-color-success-rgb:103,194,58;--el-color-warning-rgb:230,162,60;--el-color-danger-rgb:245,108,108;--el-color-error-rgb:245,108,108;--el-color-info-rgb:144,147,153;--el-font-size-extra-large:20px;--el-font-size-large:18px;--el-font-size-medium:16px;--el-font-size-base:14px;--el-font-size-small:13px;--el-font-size-extra-small:12px;--el-font-family:'Helvetica Neue',Helvetica,'PingFang SC','Hiragino Sans GB','Microsoft YaHei','微软雅黑',Arial,sans-serif;--el-font-weight-primary:500;--el-font-line-height-primary:24px;--el-index-normal:1;--el-index-top:1000;--el-index-popper:2000;--el-border-radius-base:4px;--el-border-radius-small:2px;--el-border-radius-round:20px;--el-border-radius-circle:100%;--el-transition-duration:0.3s;--el-transition-duration-fast:0.2s;--el-transition-function-ease-in-out-bezier:cubic-bezier(0.645, 0.045, 0.355, 1);--el-transition-function-fast-bezier:cubic-bezier(0.23, 1, 0.32, 1);--el-transition-all:all var(--el-transition-duration) var(--el-transition-function-ease-in-out-bezier);--el-transition-fade:opacity var(--el-transition-duration) var(--el-transition-function-fast-bezier);--el-transition-md-fade:transform var(--el-transition-duration) var(--el-transition-function-fast-bezier),opacity var(--el-transition-duration) var(--el-transition-function-fast-bezier);--el-transition-fade-linear:opacity var(--el-transition-duration-fast) linear;--el-transition-border:border-color var(--el-transition-duration-fast) var(--el-transition-function-ease-in-out-bezier);--el-transition-box-shadow:box-shadow var(--el-transition-duration-fast) var(--el-transition-function-ease-in-out-bezier);--el-transition-color:color var(--el-transition-duration-fast) var(--el-transition-function-ease-in-out-bezier);--el-component-size-large:40px;--el-component-size:32px;--el-component-size-small:24px}:root{color-scheme:light;--el-color-white:#ffffff;--el-color-black:#000000;--el-color-primary:#409eff;--el-color-primary-light-3:#79bbff;--el-color-primary-light-5:#a0cfff;--el-color-primary-light-7:#c6e2ff;--el-color-primary-light-8:#d9ecff;--el-color-primary-light-9:#ecf5ff;--el-color-primary-dark-2:#337ecc;--el-color-success:#67c23a;--el-color-success-light-3:#95d475;--el-color-success-light-5:#b3e19d;--el-color-success-light-7:#d1edc4;--el-color-success-light-8:#e1f3d8;--el-color-success-light-9:#f0f9eb;--el-color-success-dark-2:#529b2e;--el-color-warning:#e6a23c;--el-color-warning-light-3:#eebe77;--el-color-warning-light-5:#f3d19e;--el-color-warning-light-7:#f8e3c5;--el-color-warning-light-8:#faecd8;--el-color-warning-light-9:#fdf6ec;--el-color-warning-dark-2:#b88230;--el-color-danger:#f56c6c;--el-color-danger-light-3:#f89898;--el-color-danger-light-5:#fab6b6;--el-color-danger-light-7:#fcd3d3;--el-color-danger-light-8:#fde2e2;--el-color-danger-light-9:#fef0f0;--el-color-danger-dark-2:#c45656;--el-color-error:#f56c6c;--el-color-error-light-3:#f89898;--el-color-error-light-5:#fab6b6;--el-color-error-light-7:#fcd3d3;--el-color-error-light-8:#fde2e2;--el-color-error-light-9:#fef0f0;--el-color-error-dark-2:#c45656;--el-color-info:#909399;--el-color-info-light-3:#b1b3b8;--el-color-info-light-5:#c8c9cc;--el-color-info-light-7:#dedfe0;--el-color-info-light-8:#e9e9eb;--el-color-info-light-9:#f4f4f5;--el-color-info-dark-2:#73767a;--el-bg-color:#ffffff;--el-bg-color-page:#f2f3f5;--el-bg-color-overlay:#ffffff;--el-text-color-primary:#303133;--el-text-color-regular:#606266;--el-text-color-secondary:#909399;--el-text-color-placeholder:#a8abb2;--el-text-color-disabled:#c0c4cc;--el-border-color:#dcdfe6;--el-border-color-light:#e4e7ed;--el-border-color-lighter:#ebeef5;--el-border-color-extra-light:#f2f6fc;--el-border-color-dark:#d4d7de;--el-border-color-darker:#cdd0d6;--el-fill-color:#f0f2f5;--el-fill-color-light:#f5f7fa;--el-fill-color-lighter:#fafafa;--el-fill-color-extra-light:#fafcff;--el-fill-color-dark:#ebedf0;--el-fill-color-darker:#e6e8eb;--el-fill-color-blank:#ffffff;--el-box-shadow:0px 12px 32px 4px rgba(0, 0, 0, 0.04),0px 8px 20px rgba(0, 0, 0, 0.08);--el-box-shadow-light:0px 0px 12px rgba(0, 0, 0, 0.12);--el-box-shadow-lighter:0px 0px 6px rgba(0, 0, 0, 0.12);--el-box-shadow-dark:0px 16px 48px 16px rgba(0, 0, 0, 0.08),0px 12px 32px rgba(0, 0, 0, 0.12),0px 8px 16px -8px rgba(0, 0, 0, 0.16);--el-disabled-bg-color:var(--el-fill-color-light);--el-disabled-text-color:var(--el-text-color-placeholder);--el-disabled-border-color:var(--el-border-color-light);--el-overlay-color:rgba(0, 0, 0, 0.8);--el-overlay-color-light:rgba(0, 0, 0, 0.7);--el-overlay-color-lighter:rgba(0, 0, 0, 0.5);--el-mask-color:rgba(255, 255, 255, 0.9);--el-mask-color-extra-light:rgba(255, 255, 255, 0.3);--el-border-width:1px;--el-border-style:solid;--el-border-color-hover:var(--el-text-color-disabled);--el-border:var(--el-border-width) var(--el-border-style) var(--el-border-color);--el-svg-monochrome-grey:var(--el-border-color)}.fade-in-linear-enter-active,.fade-in-linear-leave-active{transition:var(--el-transition-fade-linear)}.fade-in-linear-enter-from,.fade-in-linear-leave-to{opacity:0}.el-fade-in-linear-enter-active,.el-fade-in-linear-leave-active{transition:var(--el-transition-fade-linear)}.el-fade-in-linear-enter-from,.el-fade-in-linear-leave-to{opacity:0}.el-fade-in-enter-active,.el-fade-in-leave-active{transition:all var(--el-transition-duration) cubic-bezier(.55,0,.1,1)}.el-fade-in-enter-from,.el-fade-in-leave-active{opacity:0}.el-zoom-in-center-enter-active,.el-zoom-in-center-leave-active{transition:all var(--el-transition-duration) cubic-bezier(.55,0,.1,1)}.el-zoom-in-center-enter-from,.el-zoom-in-center-leave-active{opacity:0;transform:scaleX(0)}.el-zoom-in-top-enter-active,.el-zoom-in-top-leave-active{opacity:1;transform:scaleY(1);transition:var(--el-transition-md-fade);transform-origin:center top}.el-zoom-in-top-enter-active[data-popper-placement^=top],.el-zoom-in-top-leave-active[data-popper-placement^=top]{transform-origin:center bottom}.el-zoom-in-top-enter-from,.el-zoom-in-top-leave-active{opacity:0;transform:scaleY(0)}.el-zoom-in-bottom-enter-active,.el-zoom-in-bottom-leave-active{opacity:1;transform:scaleY(1);transition:var(--el-transition-md-fade);transform-origin:center bottom}.el-zoom-in-bottom-enter-from,.el-zoom-in-bottom-leave-active{opacity:0;transform:scaleY(0)}.el-zoom-in-left-enter-active,.el-zoom-in-left-leave-active{opacity:1;transform:scale(1,1);transition:var(--el-transition-md-fade);transform-origin:top left}.el-zoom-in-left-enter-from,.el-zoom-in-left-leave-active{opacity:0;transform:scale(.45,.45)}.collapse-transition{transition:var(--el-transition-duration) height ease-in-out,var(--el-transition-duration) padding-top ease-in-out,var(--el-transition-duration) padding-bottom ease-in-out}.el-collapse-transition-enter-active,.el-collapse-transition-leave-active{transition:var(--el-transition-duration) max-height ease-in-out,var(--el-transition-duration) padding-top ease-in-out,var(--el-transition-duration) padding-bottom ease-in-out}.horizontal-collapse-transition{transition:var(--el-transition-duration) width ease-in-out,var(--el-transition-duration) padding-left ease-in-out,var(--el-transition-duration) padding-right ease-in-out}.el-list-enter-active,.el-list-leave-active{transition:all 1s}.el-list-enter-from,.el-list-leave-to{opacity:0;transform:translateY(-30px)}.el-list-leave-active{position:absolute!important}.el-opacity-transition{transition:opacity var(--el-transition-duration) cubic-bezier(.55,0,.1,1)}.el-icon-loading{-webkit-animation:rotating 2s linear infinite;animation:rotating 2s linear infinite}.el-icon--right{margin-left:5px}.el-icon--left{margin-right:5px}@-webkit-keyframes rotating{0%{transform:rotateZ(0)}100%{transform:rotateZ(360deg)}}@keyframes rotating{0%{transform:rotateZ(0)}100%{transform:rotateZ(360deg)}}.el-icon{--color:inherit;height:1em;width:1em;line-height:1em;display:inline-flex;justify-content:center;align-items:center;position:relative;fill:currentColor;color:var(--color);font-size:inherit}.el-icon.is-loading{-webkit-animation:rotating 2s linear infinite;animation:rotating 2s linear infinite}.el-icon svg{height:1em;width:1em}.el-affix--fixed{position:fixed}.el-alert{--el-alert-padding:8px 16px;--el-alert-border-radius-base:var(--el-border-radius-base);--el-alert-title-font-size:13px;--el-alert-description-font-size:12px;--el-alert-close-font-size:12px;--el-alert-close-customed-font-size:13px;--el-alert-icon-size:16px;--el-alert-icon-large-size:28px;width:100%;padding:var(--el-alert-padding);margin:0;box-sizing:border-box;border-radius:var(--el-alert-border-radius-base);position:relative;background-color:var(--el-color-white);overflow:hidden;opacity:1;display:flex;align-items:center;transition:opacity var(--el-transition-duration-fast)}.el-alert.is-light .el-alert__close-btn{color:var(--el-text-color-placeholder)}.el-alert.is-dark .el-alert__close-btn{color:var(--el-color-white)}.el-alert.is-dark .el-alert__description{color:var(--el-color-white)}.el-alert.is-center{justify-content:center}.el-alert--success{--el-alert-bg-color:var(--el-color-success-light-9)}.el-alert--success.is-light{background-color:var(--el-alert-bg-color);color:var(--el-color-success)}.el-alert--success.is-light .el-alert__description{color:var(--el-color-success)}.el-alert--success.is-dark{background-color:var(--el-color-success);color:var(--el-color-white)}.el-alert--info{--el-alert-bg-color:var(--el-color-info-light-9)}.el-alert--info.is-light{background-color:var(--el-alert-bg-color);color:var(--el-color-info)}.el-alert--info.is-light .el-alert__description{color:var(--el-color-info)}.el-alert--info.is-dark{background-color:var(--el-color-info);color:var(--el-color-white)}.el-alert--warning{--el-alert-bg-color:var(--el-color-warning-light-9)}.el-alert--warning.is-light{background-color:var(--el-alert-bg-color);color:var(--el-color-warning)}.el-alert--warning.is-light .el-alert__description{color:var(--el-color-warning)}.el-alert--warning.is-dark{background-color:var(--el-color-warning);color:var(--el-color-white)}.el-alert--error{--el-alert-bg-color:var(--el-color-error-light-9)}.el-alert--error.is-light{background-color:var(--el-alert-bg-color);color:var(--el-color-error)}.el-alert--error.is-light .el-alert__description{color:var(--el-color-error)}.el-alert--error.is-dark{background-color:var(--el-color-error);color:var(--el-color-white)}.el-alert__content{display:table-cell;padding:0 8px}.el-alert .el-alert__icon{font-size:var(--el-alert-icon-size);width:var(--el-alert-icon-size)}.el-alert .el-alert__icon.is-big{font-size:var(--el-alert-icon-large-size);width:var(--el-alert-icon-large-size)}.el-alert__title{font-size:var(--el-alert-title-font-size);line-height:18px;vertical-align:text-top}.el-alert__title.is-bold{font-weight:700}.el-alert .el-alert__description{font-size:var(--el-alert-description-font-size);margin:5px 0 0 0}.el-alert .el-alert__close-btn{font-size:var(--el-alert-close-font-size);opacity:1;position:absolute;top:12px;right:15px;cursor:pointer}.el-alert .el-alert__close-btn.is-customed{font-style:normal;font-size:var(--el-alert-close-customed-font-size);top:9px}.el-alert-fade-enter-from,.el-alert-fade-leave-active{opacity:0}.el-aside{overflow:auto;box-sizing:border-box;flex-shrink:0;width:var(--el-aside-width,300px)}.el-autocomplete{position:relative;display:inline-block}.el-autocomplete__popper.el-popper{background:var(--el-bg-color-overlay);border:1px solid var(--el-border-color-light);box-shadow:var(--el-box-shadow-light)}.el-autocomplete__popper.el-popper .el-popper__arrow::before{border:1px solid var(--el-border-color-light)}.el-autocomplete__popper.el-popper[data-popper-placement^=top] .el-popper__arrow::before{border-top-color:transparent;border-left-color:transparent}.el-autocomplete__popper.el-popper[data-popper-placement^=bottom] .el-popper__arrow::before{border-bottom-color:transparent;border-right-color:transparent}.el-autocomplete__popper.el-popper[data-popper-placement^=left] .el-popper__arrow::before{border-left-color:transparent;border-bottom-color:transparent}.el-autocomplete__popper.el-popper[data-popper-placement^=right] .el-popper__arrow::before{border-right-color:transparent;border-top-color:transparent}.el-autocomplete-suggestion{border-radius:var(--el-border-radius-base);box-sizing:border-box}.el-autocomplete-suggestion__wrap{max-height:280px;padding:10px 0;box-sizing:border-box}.el-autocomplete-suggestion__list{margin:0;padding:0}.el-autocomplete-suggestion li{padding:0 20px;margin:0;line-height:34px;cursor:pointer;color:var(--el-text-color-regular);font-size:var(--el-font-size-base);list-style:none;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.el-autocomplete-suggestion li:hover{background-color:var(--el-fill-color-light)}.el-autocomplete-suggestion li.highlighted{background-color:var(--el-fill-color-light)}.el-autocomplete-suggestion li.divider{margin-top:6px;border-top:1px solid var(--el-color-black)}.el-autocomplete-suggestion li.divider:last-child{margin-bottom:-6px}.el-autocomplete-suggestion.is-loading li{text-align:center;height:100px;line-height:100px;font-size:20px;color:var(--el-text-color-secondary)}.el-autocomplete-suggestion.is-loading li::after{display:inline-block;content:"";height:100%;vertical-align:middle}.el-autocomplete-suggestion.is-loading li:hover{background-color:var(--el-bg-color-overlay)}.el-autocomplete-suggestion.is-loading .el-icon-loading{vertical-align:middle}.el-avatar{--el-avatar-text-color:var(--el-color-white);--el-avatar-bg-color:var(--el-text-color-disabled);--el-avatar-text-size:14px;--el-avatar-icon-size:18px;--el-avatar-border-radius:var(--el-border-radius-base);--el-avatar-size-large:56px;--el-avatar-size:40px;--el-avatar-size-small:24px;--el-avatar-size:40px;display:inline-flex;justify-content:center;align-items:center;box-sizing:border-box;text-align:center;overflow:hidden;color:var(--el-avatar-text-color);background:var(--el-avatar-bg-color);width:var(--el-avatar-size);height:var(--el-avatar-size);font-size:var(--el-avatar-text-size)}.el-avatar>img{display:block;height:100%}.el-avatar--circle{border-radius:50%}.el-avatar--square{border-radius:var(--el-avatar-border-radius)}.el-avatar--icon{font-size:var(--el-avatar-icon-size)}.el-avatar--small{--el-avatar-size:24px}.el-avatar--large{--el-avatar-size:56px}.el-backtop{--el-backtop-bg-color:var(--el-bg-color-overlay);--el-backtop-text-color:var(--el-color-primary);--el-backtop-hover-bg-color:var(--el-border-color-extra-light);position:fixed;background-color:var(--el-backtop-bg-color);width:40px;height:40px;border-radius:50%;color:var(--el-backtop-text-color);display:flex;align-items:center;justify-content:center;font-size:20px;box-shadow:var(--el-box-shadow-lighter);cursor:pointer;z-index:5}.el-backtop:hover{background-color:var(--el-backtop-hover-bg-color)}.el-backtop__icon{font-size:20px}.el-badge{--el-badge-bg-color:var(--el-color-danger);--el-badge-radius:10px;--el-badge-font-size:12px;--el-badge-padding:6px;--el-badge-size:18px;position:relative;vertical-align:middle;display:inline-block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.el-badge__content{background-color:var(--el-badge-bg-color);border-radius:var(--el-badge-radius);color:var(--el-color-white);display:inline-flex;justify-content:center;align-items:center;font-size:var(--el-badge-font-size);height:var(--el-badge-size);padding:0 var(--el-badge-padding);white-space:nowrap;border:1px solid var(--el-bg-color)}.el-badge__content.is-fixed{position:absolute;top:0;right:calc(1px + var(--el-badge-size)/ 2);transform:translateY(-50%) translateX(100%);z-index:var(--el-index-normal)}.el-badge__content.is-fixed.is-dot{right:5px}.el-badge__content.is-dot{height:8px;width:8px;padding:0;right:0;border-radius:50%}.el-badge__content--primary{background-color:var(--el-color-primary)}.el-badge__content--success{background-color:var(--el-color-success)}.el-badge__content--warning{background-color:var(--el-color-warning)}.el-badge__content--info{background-color:var(--el-color-info)}.el-badge__content--danger{background-color:var(--el-color-danger)}.el-breadcrumb{font-size:14px;line-height:1}.el-breadcrumb::after,.el-breadcrumb::before{display:table;content:""}.el-breadcrumb::after{clear:both}.el-breadcrumb__separator{margin:0 9px;font-weight:700;color:var(--el-text-color-placeholder)}.el-breadcrumb__separator.el-icon{margin:0 6px;font-weight:400}.el-breadcrumb__separator.el-icon svg{vertical-align:middle}.el-breadcrumb__item{float:left;display:inline-flex;align-items:center}.el-breadcrumb__inner{color:var(--el-text-color-regular)}.el-breadcrumb__inner a,.el-breadcrumb__inner.is-link{font-weight:700;text-decoration:none;transition:var(--el-transition-color);color:var(--el-text-color-primary)}.el-breadcrumb__inner a:hover,.el-breadcrumb__inner.is-link:hover{color:var(--el-color-primary);cursor:pointer}.el-breadcrumb__item:last-child .el-breadcrumb__inner,.el-breadcrumb__item:last-child .el-breadcrumb__inner a,.el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover,.el-breadcrumb__item:last-child .el-breadcrumb__inner:hover{font-weight:400;color:var(--el-text-color-regular);cursor:text}.el-breadcrumb__item:last-child .el-breadcrumb__separator{display:none}.el-button-group{display:inline-block;vertical-align:middle}.el-button-group::after,.el-button-group::before{display:table;content:""}.el-button-group::after{clear:both}.el-button-group>.el-button{float:left;position:relative}.el-button-group>.el-button+.el-button{margin-left:0}.el-button-group>.el-button:first-child{border-top-right-radius:0;border-bottom-right-radius:0}.el-button-group>.el-button:last-child{border-top-left-radius:0;border-bottom-left-radius:0}.el-button-group>.el-button:first-child:last-child{border-top-right-radius:var(--el-border-radius-base);border-bottom-right-radius:var(--el-border-radius-base);border-top-left-radius:var(--el-border-radius-base);border-bottom-left-radius:var(--el-border-radius-base)}.el-button-group>.el-button:first-child:last-child.is-round{border-radius:var(--el-border-radius-round)}.el-button-group>.el-button:first-child:last-child.is-circle{border-radius:50%}.el-button-group>.el-button:not(:first-child):not(:last-child){border-radius:0}.el-button-group>.el-button:not(:last-child){margin-right:-1px}.el-button-group>.el-button:active,.el-button-group>.el-button:focus,.el-button-group>.el-button:hover{z-index:1}.el-button-group>.el-button.is-active{z-index:1}.el-button-group>.el-dropdown>.el-button{border-top-left-radius:0;border-bottom-left-radius:0;border-left-color:var(--el-button-divide-border-color)}.el-button-group .el-button--primary:first-child{border-right-color:var(--el-button-divide-border-color)}.el-button-group .el-button--primary:last-child{border-left-color:var(--el-button-divide-border-color)}.el-button-group .el-button--primary:not(:first-child):not(:last-child){border-left-color:var(--el-button-divide-border-color);border-right-color:var(--el-button-divide-border-color)}.el-button-group .el-button--success:first-child{border-right-color:var(--el-button-divide-border-color)}.el-button-group .el-button--success:last-child{border-left-color:var(--el-button-divide-border-color)}.el-button-group .el-button--success:not(:first-child):not(:last-child){border-left-color:var(--el-button-divide-border-color);border-right-color:var(--el-button-divide-border-color)}.el-button-group .el-button--warning:first-child{border-right-color:var(--el-button-divide-border-color)}.el-button-group .el-button--warning:last-child{border-left-color:var(--el-button-divide-border-color)}.el-button-group .el-button--warning:not(:first-child):not(:last-child){border-left-color:var(--el-button-divide-border-color);border-right-color:var(--el-button-divide-border-color)}.el-button-group .el-button--danger:first-child{border-right-color:var(--el-button-divide-border-color)}.el-button-group .el-button--danger:last-child{border-left-color:var(--el-button-divide-border-color)}.el-button-group .el-button--danger:not(:first-child):not(:last-child){border-left-color:var(--el-button-divide-border-color);border-right-color:var(--el-button-divide-border-color)}.el-button-group .el-button--info:first-child{border-right-color:var(--el-button-divide-border-color)}.el-button-group .el-button--info:last-child{border-left-color:var(--el-button-divide-border-color)}.el-button-group .el-button--info:not(:first-child):not(:last-child){border-left-color:var(--el-button-divide-border-color);border-right-color:var(--el-button-divide-border-color)}.el-button{--el-button-font-weight:var(--el-font-weight-primary);--el-button-border-color:var(--el-border-color);--el-button-bg-color:var(--el-fill-color-blank);--el-button-text-color:var(--el-text-color-regular);--el-button-disabled-text-color:var(--el-disabled-text-color);--el-button-disabled-bg-color:var(--el-fill-color-blank);--el-button-disabled-border-color:var(--el-border-color-light);--el-button-divide-border-color:rgba(255, 255, 255, 0.5);--el-button-hover-text-color:var(--el-color-primary);--el-button-hover-bg-color:var(--el-color-primary-light-9);--el-button-hover-border-color:var(--el-color-primary-light-7);--el-button-active-text-color:var(--el-button-hover-text-color);--el-button-active-border-color:var(--el-color-primary);--el-button-active-bg-color:var(--el-button-hover-bg-color);--el-button-outline-color:var(--el-color-primary-light-5);--el-button-hover-link-text-color:var(--el-color-info);--el-button-active-color:var(--el-text-color-primary)}.el-button{display:inline-flex;justify-content:center;align-items:center;line-height:1;height:32px;white-space:nowrap;cursor:pointer;color:var(--el-button-text-color);text-align:center;box-sizing:border-box;outline:0;transition:.1s;font-weight:var(--el-button-font-weight);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;-webkit-appearance:none;background-color:var(--el-button-bg-color);border:var(--el-border);border-color:var(--el-button-border-color);padding:8px 15px;font-size:var(--el-font-size-base);border-radius:var(--el-border-radius-base)}.el-button:focus,.el-button:hover{color:var(--el-button-hover-text-color);border-color:var(--el-button-hover-border-color);background-color:var(--el-button-hover-bg-color);outline:0}.el-button:active{color:var(--el-button-active-text-color);border-color:var(--el-button-active-border-color);background-color:var(--el-button-active-bg-color);outline:0}.el-button:focus-visible{outline:2px solid var(--el-button-outline-color);outline-offset:1px}.el-button>span{display:inline-flex;align-items:center}.el-button+.el-button{margin-left:12px}.el-button.is-round{padding:8px 15px}.el-button::-moz-focus-inner{border:0}.el-button [class*=el-icon]+span{margin-left:6px}.el-button [class*=el-icon] svg{vertical-align:bottom}.el-button.is-plain{--el-button-hover-text-color:var(--el-color-primary);--el-button-hover-bg-color:var(--el-fill-color-blank);--el-button-hover-border-color:var(--el-color-primary)}.el-button.is-active{color:var(--el-button-active-text-color);border-color:var(--el-button-active-border-color);background-color:var(--el-button-active-bg-color);outline:0}.el-button.is-disabled,.el-button.is-disabled:focus,.el-button.is-disabled:hover{color:var(--el-button-disabled-text-color);cursor:not-allowed;background-image:none;background-color:var(--el-button-disabled-bg-color);border-color:var(--el-button-disabled-border-color)}.el-button.is-loading{position:relative;pointer-events:none}.el-button.is-loading:before{z-index:1;pointer-events:none;content:"";position:absolute;left:-1px;top:-1px;right:-1px;bottom:-1px;border-radius:inherit;background-color:var(--el-mask-color-extra-light)}.el-button.is-round{border-radius:var(--el-border-radius-round)}.el-button.is-circle{border-radius:50%;padding:8px}.el-button.is-text{color:var(--el-button-text-color);border:0 solid transparent;background-color:transparent}.el-button.is-text.is-disabled{color:var(--el-button-disabled-text-color);background-color:transparent!important}.el-button.is-text:not(.is-disabled):focus,.el-button.is-text:not(.is-disabled):hover{background-color:var(--el-fill-color-light)}.el-button.is-text:not(.is-disabled):focus-visible{outline:2px solid var(--el-button-outline-color);outline-offset:1px}.el-button.is-text:not(.is-disabled):active{background-color:var(--el-fill-color)}.el-button.is-text:not(.is-disabled).is-has-bg{background-color:var(--el-fill-color-light)}.el-button.is-text:not(.is-disabled).is-has-bg:focus,.el-button.is-text:not(.is-disabled).is-has-bg:hover{background-color:var(--el-fill-color)}.el-button.is-text:not(.is-disabled).is-has-bg:active{background-color:var(--el-fill-color-dark)}.el-button__text--expand{letter-spacing:.3em;margin-right:-.3em}.el-button.is-link{border-color:transparent;color:var(--el-button-text-color);background:0 0;padding:2px;height:auto}.el-button.is-link:focus,.el-button.is-link:hover{color:var(--el-button-hover-link-text-color)}.el-button.is-link.is-disabled{color:var(--el-button-disabled-text-color);background-color:transparent!important;border-color:transparent!important}.el-button.is-link:not(.is-disabled):focus,.el-button.is-link:not(.is-disabled):hover{border-color:transparent;background-color:transparent}.el-button.is-link:not(.is-disabled):active{color:var(--el-button-active-color);border-color:transparent;background-color:transparent}.el-button--text{border-color:transparent;background:0 0;color:var(--el-color-primary);padding-left:0;padding-right:0}.el-button--text.is-disabled{color:var(--el-button-disabled-text-color);background-color:transparent!important;border-color:transparent!important}.el-button--text:not(.is-disabled):focus,.el-button--text:not(.is-disabled):hover{color:var(--el-color-primary-light-3);border-color:transparent;background-color:transparent}.el-button--text:not(.is-disabled):active{color:var(--el-color-primary-dark-2);border-color:transparent;background-color:transparent}.el-button__link--expand{letter-spacing:.3em;margin-right:-.3em}.el-button--primary{--el-button-text-color:var(--el-color-white);--el-button-bg-color:var(--el-color-primary);--el-button-border-color:var(--el-color-primary);--el-button-outline-color:var(--el-color-primary-light-5);--el-button-active-color:var(--el-color-primary-dark-2);--el-button-hover-text-color:var(--el-color-white);--el-button-hover-link-text-color:var(--el-color-primary-light-5);--el-button-hover-bg-color:var(--el-color-primary-light-3);--el-button-hover-border-color:var(--el-color-primary-light-3);--el-button-active-bg-color:var(--el-color-primary-dark-2);--el-button-active-border-color:var(--el-color-primary-dark-2);--el-button-disabled-text-color:var(--el-color-white);--el-button-disabled-bg-color:var(--el-color-primary-light-5);--el-button-disabled-border-color:var(--el-color-primary-light-5)}.el-button--primary.is-link,.el-button--primary.is-plain,.el-button--primary.is-text{--el-button-text-color:var(--el-color-primary);--el-button-bg-color:var(--el-color-primary-light-9);--el-button-border-color:var(--el-color-primary-light-5);--el-button-hover-text-color:var(--el-color-white);--el-button-hover-bg-color:var(--el-color-primary);--el-button-hover-border-color:var(--el-color-primary);--el-button-active-text-color:var(--el-color-white)}.el-button--primary.is-link.is-disabled,.el-button--primary.is-link.is-disabled:active,.el-button--primary.is-link.is-disabled:focus,.el-button--primary.is-link.is-disabled:hover,.el-button--primary.is-plain.is-disabled,.el-button--primary.is-plain.is-disabled:active,.el-button--primary.is-plain.is-disabled:focus,.el-button--primary.is-plain.is-disabled:hover,.el-button--primary.is-text.is-disabled,.el-button--primary.is-text.is-disabled:active,.el-button--primary.is-text.is-disabled:focus,.el-button--primary.is-text.is-disabled:hover{color:var(--el-color-primary-light-5);background-color:var(--el-color-primary-light-9);border-color:var(--el-color-primary-light-8)}.el-button--success{--el-button-text-color:var(--el-color-white);--el-button-bg-color:var(--el-color-success);--el-button-border-color:var(--el-color-success);--el-button-outline-color:var(--el-color-success-light-5);--el-button-active-color:var(--el-color-success-dark-2);--el-button-hover-text-color:var(--el-color-white);--el-button-hover-link-text-color:var(--el-color-success-light-5);--el-button-hover-bg-color:var(--el-color-success-light-3);--el-button-hover-border-color:var(--el-color-success-light-3);--el-button-active-bg-color:var(--el-color-success-dark-2);--el-button-active-border-color:var(--el-color-success-dark-2);--el-button-disabled-text-color:var(--el-color-white);--el-button-disabled-bg-color:var(--el-color-success-light-5);--el-button-disabled-border-color:var(--el-color-success-light-5)}.el-button--success.is-link,.el-button--success.is-plain,.el-button--success.is-text{--el-button-text-color:var(--el-color-success);--el-button-bg-color:var(--el-color-success-light-9);--el-button-border-color:var(--el-color-success-light-5);--el-button-hover-text-color:var(--el-color-white);--el-button-hover-bg-color:var(--el-color-success);--el-button-hover-border-color:var(--el-color-success);--el-button-active-text-color:var(--el-color-white)}.el-button--success.is-link.is-disabled,.el-button--success.is-link.is-disabled:active,.el-button--success.is-link.is-disabled:focus,.el-button--success.is-link.is-disabled:hover,.el-button--success.is-plain.is-disabled,.el-button--success.is-plain.is-disabled:active,.el-button--success.is-plain.is-disabled:focus,.el-button--success.is-plain.is-disabled:hover,.el-button--success.is-text.is-disabled,.el-button--success.is-text.is-disabled:active,.el-button--success.is-text.is-disabled:focus,.el-button--success.is-text.is-disabled:hover{color:var(--el-color-success-light-5);background-color:var(--el-color-success-light-9);border-color:var(--el-color-success-light-8)}.el-button--warning{--el-button-text-color:var(--el-color-white);--el-button-bg-color:var(--el-color-warning);--el-button-border-color:var(--el-color-warning);--el-button-outline-color:var(--el-color-warning-light-5);--el-button-active-color:var(--el-color-warning-dark-2);--el-button-hover-text-color:var(--el-color-white);--el-button-hover-link-text-color:var(--el-color-warning-light-5);--el-button-hover-bg-color:var(--el-color-warning-light-3);--el-button-hover-border-color:var(--el-color-warning-light-3);--el-button-active-bg-color:var(--el-color-warning-dark-2);--el-button-active-border-color:var(--el-color-warning-dark-2);--el-button-disabled-text-color:var(--el-color-white);--el-button-disabled-bg-color:var(--el-color-warning-light-5);--el-button-disabled-border-color:var(--el-color-warning-light-5)}.el-button--warning.is-link,.el-button--warning.is-plain,.el-button--warning.is-text{--el-button-text-color:var(--el-color-warning);--el-button-bg-color:var(--el-color-warning-light-9);--el-button-border-color:var(--el-color-warning-light-5);--el-button-hover-text-color:var(--el-color-white);--el-button-hover-bg-color:var(--el-color-warning);--el-button-hover-border-color:var(--el-color-warning);--el-button-active-text-color:var(--el-color-white)}.el-button--warning.is-link.is-disabled,.el-button--warning.is-link.is-disabled:active,.el-button--warning.is-link.is-disabled:focus,.el-button--warning.is-link.is-disabled:hover,.el-button--warning.is-plain.is-disabled,.el-button--warning.is-plain.is-disabled:active,.el-button--warning.is-plain.is-disabled:focus,.el-button--warning.is-plain.is-disabled:hover,.el-button--warning.is-text.is-disabled,.el-button--warning.is-text.is-disabled:active,.el-button--warning.is-text.is-disabled:focus,.el-button--warning.is-text.is-disabled:hover{color:var(--el-color-warning-light-5);background-color:var(--el-color-warning-light-9);border-color:var(--el-color-warning-light-8)}.el-button--danger{--el-button-text-color:var(--el-color-white);--el-button-bg-color:var(--el-color-danger);--el-button-border-color:var(--el-color-danger);--el-button-outline-color:var(--el-color-danger-light-5);--el-button-active-color:var(--el-color-danger-dark-2);--el-button-hover-text-color:var(--el-color-white);--el-button-hover-link-text-color:var(--el-color-danger-light-5);--el-button-hover-bg-color:var(--el-color-danger-light-3);--el-button-hover-border-color:var(--el-color-danger-light-3);--el-button-active-bg-color:var(--el-color-danger-dark-2);--el-button-active-border-color:var(--el-color-danger-dark-2);--el-button-disabled-text-color:var(--el-color-white);--el-button-disabled-bg-color:var(--el-color-danger-light-5);--el-button-disabled-border-color:var(--el-color-danger-light-5)}.el-button--danger.is-link,.el-button--danger.is-plain,.el-button--danger.is-text{--el-button-text-color:var(--el-color-danger);--el-button-bg-color:var(--el-color-danger-light-9);--el-button-border-color:var(--el-color-danger-light-5);--el-button-hover-text-color:var(--el-color-white);--el-button-hover-bg-color:var(--el-color-danger);--el-button-hover-border-color:var(--el-color-danger);--el-button-active-text-color:var(--el-color-white)}.el-button--danger.is-link.is-disabled,.el-button--danger.is-link.is-disabled:active,.el-button--danger.is-link.is-disabled:focus,.el-button--danger.is-link.is-disabled:hover,.el-button--danger.is-plain.is-disabled,.el-button--danger.is-plain.is-disabled:active,.el-button--danger.is-plain.is-disabled:focus,.el-button--danger.is-plain.is-disabled:hover,.el-button--danger.is-text.is-disabled,.el-button--danger.is-text.is-disabled:active,.el-button--danger.is-text.is-disabled:focus,.el-button--danger.is-text.is-disabled:hover{color:var(--el-color-danger-light-5);background-color:var(--el-color-danger-light-9);border-color:var(--el-color-danger-light-8)}.el-button--info{--el-button-text-color:var(--el-color-white);--el-button-bg-color:var(--el-color-info);--el-button-border-color:var(--el-color-info);--el-button-outline-color:var(--el-color-info-light-5);--el-button-active-color:var(--el-color-info-dark-2);--el-button-hover-text-color:var(--el-color-white);--el-button-hover-link-text-color:var(--el-color-info-light-5);--el-button-hover-bg-color:var(--el-color-info-light-3);--el-button-hover-border-color:var(--el-color-info-light-3);--el-button-active-bg-color:var(--el-color-info-dark-2);--el-button-active-border-color:var(--el-color-info-dark-2);--el-button-disabled-text-color:var(--el-color-white);--el-button-disabled-bg-color:var(--el-color-info-light-5);--el-button-disabled-border-color:var(--el-color-info-light-5)}.el-button--info.is-link,.el-button--info.is-plain,.el-button--info.is-text{--el-button-text-color:var(--el-color-info);--el-button-bg-color:var(--el-color-info-light-9);--el-button-border-color:var(--el-color-info-light-5);--el-button-hover-text-color:var(--el-color-white);--el-button-hover-bg-color:var(--el-color-info);--el-button-hover-border-color:var(--el-color-info);--el-button-active-text-color:var(--el-color-white)}.el-button--info.is-link.is-disabled,.el-button--info.is-link.is-disabled:active,.el-button--info.is-link.is-disabled:focus,.el-button--info.is-link.is-disabled:hover,.el-button--info.is-plain.is-disabled,.el-button--info.is-plain.is-disabled:active,.el-button--info.is-plain.is-disabled:focus,.el-button--info.is-plain.is-disabled:hover,.el-button--info.is-text.is-disabled,.el-button--info.is-text.is-disabled:active,.el-button--info.is-text.is-disabled:focus,.el-button--info.is-text.is-disabled:hover{color:var(--el-color-info-light-5);background-color:var(--el-color-info-light-9);border-color:var(--el-color-info-light-8)}.el-button--large{--el-button-size:40px;height:var(--el-button-size);padding:12px 19px;font-size:var(--el-font-size-base);border-radius:var(--el-border-radius-base)}.el-button--large [class*=el-icon]+span{margin-left:8px}.el-button--large.is-round{padding:12px 19px}.el-button--large.is-circle{width:var(--el-button-size);padding:12px}.el-button--small{--el-button-size:24px;height:var(--el-button-size);padding:5px 11px;font-size:12px;border-radius:calc(var(--el-border-radius-base) - 1px)}.el-button--small [class*=el-icon]+span{margin-left:4px}.el-button--small.is-round{padding:5px 11px}.el-button--small.is-circle{width:var(--el-button-size);padding:5px}.el-calendar{--el-calendar-border:var(--el-table-border, 1px solid var(--el-border-color-lighter));--el-calendar-header-border-bottom:var(--el-calendar-border);--el-calendar-selected-bg-color:var(--el-color-primary-light-9);--el-calendar-cell-width:85px;background-color:var(--el-fill-color-blank)}.el-calendar__header{display:flex;justify-content:space-between;padding:12px 20px;border-bottom:var(--el-calendar-header-border-bottom)}.el-calendar__title{color:var(--el-text-color);align-self:center}.el-calendar__body{padding:12px 20px 35px}.el-calendar-table{table-layout:fixed;width:100%}.el-calendar-table thead th{padding:12px 0;color:var(--el-text-color-regular);font-weight:400}.el-calendar-table:not(.is-range) td.next,.el-calendar-table:not(.is-range) td.prev{color:var(--el-text-color-placeholder)}.el-calendar-table td{border-bottom:var(--el-calendar-border);border-right:var(--el-calendar-border);vertical-align:top;transition:background-color var(--el-transition-duration-fast) ease}.el-calendar-table td.is-selected{background-color:var(--el-calendar-selected-bg-color)}.el-calendar-table td.is-today{color:var(--el-color-primary)}.el-calendar-table tr:first-child td{border-top:var(--el-calendar-border)}.el-calendar-table tr td:first-child{border-left:var(--el-calendar-border)}.el-calendar-table tr.el-calendar-table__row--hide-border td{border-top:none}.el-calendar-table .el-calendar-day{box-sizing:border-box;padding:8px;height:var(--el-calendar-cell-width)}.el-calendar-table .el-calendar-day:hover{cursor:pointer;background-color:var(--el-calendar-selected-bg-color)}.el-card{--el-card-border-color:var(--el-border-color-light);--el-card-border-radius:4px;--el-card-padding:20px;--el-card-bg-color:var(--el-fill-color-blank)}.el-card{border-radius:var(--el-card-border-radius);border:1px solid var(--el-card-border-color);background-color:var(--el-card-bg-color);overflow:hidden;color:var(--el-text-color-primary);transition:var(--el-transition-duration)}.el-card.is-always-shadow{box-shadow:var(--el-box-shadow-light)}.el-card.is-hover-shadow:focus,.el-card.is-hover-shadow:hover{box-shadow:var(--el-box-shadow-light)}.el-card__header{padding:calc(var(--el-card-padding) - 2px) var(--el-card-padding);border-bottom:1px solid var(--el-card-border-color);box-sizing:border-box}.el-card__body{padding:var(--el-card-padding)}.el-carousel__item{position:absolute;top:0;left:0;width:100%;height:100%;display:inline-block;overflow:hidden;z-index:calc(var(--el-index-normal) - 1)}.el-carousel__item.is-active{z-index:calc(var(--el-index-normal) - 1)}.el-carousel__item.is-animating{transition:transform .4s ease-in-out}.el-carousel__item--card{width:50%;transition:transform .4s ease-in-out}.el-carousel__item--card.is-in-stage{cursor:pointer;z-index:var(--el-index-normal)}.el-carousel__item--card.is-in-stage.is-hover .el-carousel__mask,.el-carousel__item--card.is-in-stage:hover .el-carousel__mask{opacity:.12}.el-carousel__item--card.is-active{z-index:calc(var(--el-index-normal) + 1)}.el-carousel__mask{position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--el-color-white);opacity:.24;transition:var(--el-transition-duration-fast)}.el-carousel{--el-carousel-arrow-font-size:12px;--el-carousel-arrow-size:36px;--el-carousel-arrow-background:rgba(31, 45, 61, 0.11);--el-carousel-arrow-hover-background:rgba(31, 45, 61, 0.23);--el-carousel-indicator-width:30px;--el-carousel-indicator-height:2px;--el-carousel-indicator-padding-horizontal:4px;--el-carousel-indicator-padding-vertical:12px;--el-carousel-indicator-out-color:var(--el-border-color-hover);position:relative}.el-carousel--horizontal{overflow-x:hidden}.el-carousel--vertical{overflow-y:hidden}.el-carousel__container{position:relative;height:300px}.el-carousel__arrow{border:none;outline:0;padding:0;margin:0;height:var(--el-carousel-arrow-size);width:var(--el-carousel-arrow-size);cursor:pointer;transition:var(--el-transition-duration);border-radius:50%;background-color:var(--el-carousel-arrow-background);color:#fff;position:absolute;top:50%;z-index:10;transform:translateY(-50%);text-align:center;font-size:var(--el-carousel-arrow-font-size);display:inline-flex;justify-content:center;align-items:center}.el-carousel__arrow--left{left:16px}.el-carousel__arrow--right{right:16px}.el-carousel__arrow:hover{background-color:var(--el-carousel-arrow-hover-background)}.el-carousel__arrow i{cursor:pointer}.el-carousel__indicators{position:absolute;list-style:none;margin:0;padding:0;z-index:calc(var(--el-index-normal) + 1)}.el-carousel__indicators--horizontal{bottom:0;left:50%;transform:translateX(-50%)}.el-carousel__indicators--vertical{right:0;top:50%;transform:translateY(-50%)}.el-carousel__indicators--outside{bottom:calc(var(--el-carousel-indicator-height) + var(--el-carousel-indicator-padding-vertical) * 2);text-align:center;position:static;transform:none}.el-carousel__indicators--outside .el-carousel__indicator:hover button{opacity:.64}.el-carousel__indicators--outside button{background-color:var(--el-carousel-indicator-out-color);opacity:.24}.el-carousel__indicators--labels{left:0;right:0;transform:none;text-align:center}.el-carousel__indicators--labels .el-carousel__button{height:auto;width:auto;padding:2px 18px;font-size:12px;color:#000}.el-carousel__indicators--labels .el-carousel__indicator{padding:6px 4px}.el-carousel__indicator{background-color:transparent;cursor:pointer}.el-carousel__indicator:hover button{opacity:.72}.el-carousel__indicator--horizontal{display:inline-block;padding:var(--el-carousel-indicator-padding-vertical) var(--el-carousel-indicator-padding-horizontal)}.el-carousel__indicator--vertical{padding:var(--el-carousel-indicator-padding-horizontal) var(--el-carousel-indicator-padding-vertical)}.el-carousel__indicator--vertical .el-carousel__button{width:var(--el-carousel-indicator-height);height:calc(var(--el-carousel-indicator-width)/ 2)}.el-carousel__indicator.is-active button{opacity:1}.el-carousel__button{display:block;opacity:.48;width:var(--el-carousel-indicator-width);height:var(--el-carousel-indicator-height);background-color:#fff;border:none;outline:0;padding:0;margin:0;cursor:pointer;transition:var(--el-transition-duration)}.carousel-arrow-left-enter-from,.carousel-arrow-left-leave-active{transform:translateY(-50%) translateX(-10px);opacity:0}.carousel-arrow-right-enter-from,.carousel-arrow-right-leave-active{transform:translateY(-50%) translateX(10px);opacity:0}.el-cascader-panel{--el-cascader-menu-text-color:var(--el-text-color-regular);--el-cascader-menu-selected-text-color:var(--el-color-primary);--el-cascader-menu-fill:var(--el-bg-color-overlay);--el-cascader-menu-font-size:var(--el-font-size-base);--el-cascader-menu-radius:var(--el-border-radius-base);--el-cascader-menu-border:solid 1px var(--el-border-color-light);--el-cascader-menu-shadow:var(--el-box-shadow-light);--el-cascader-node-background-hover:var(--el-fill-color-light);--el-cascader-node-color-disabled:var(--el-text-color-placeholder);--el-cascader-color-empty:var(--el-text-color-placeholder);--el-cascader-tag-background:var(--el-fill-color)}.el-cascader-panel{display:flex;border-radius:var(--el-cascader-menu-radius);font-size:var(--el-cascader-menu-font-size)}.el-cascader-panel.is-bordered{border:var(--el-cascader-menu-border);border-radius:var(--el-cascader-menu-radius)}.el-cascader-menu{min-width:180px;box-sizing:border-box;color:var(--el-cascader-menu-text-color);border-right:var(--el-cascader-menu-border)}.el-cascader-menu:last-child{border-right:none}.el-cascader-menu:last-child .el-cascader-node{padding-right:20px}.el-cascader-menu__wrap.el-scrollbar__wrap{height:204px}.el-cascader-menu__list{position:relative;min-height:100%;margin:0;padding:6px 0;list-style:none;box-sizing:border-box}.el-cascader-menu__hover-zone{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.el-cascader-menu__empty-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;color:var(--el-cascader-color-empty)}.el-cascader-menu__empty-text .is-loading{margin-right:2px}.el-cascader-node{position:relative;display:flex;align-items:center;padding:0 30px 0 20px;height:34px;line-height:34px;outline:0}.el-cascader-node.is-selectable.in-active-path{color:var(--el-cascader-menu-text-color)}.el-cascader-node.in-active-path,.el-cascader-node.is-active,.el-cascader-node.is-selectable.in-checked-path{color:var(--el-cascader-menu-selected-text-color);font-weight:700}.el-cascader-node:not(.is-disabled){cursor:pointer}.el-cascader-node:not(.is-disabled):focus,.el-cascader-node:not(.is-disabled):hover{background:var(--el-cascader-node-background-hover)}.el-cascader-node.is-disabled{color:var(--el-cascader-node-color-disabled);cursor:not-allowed}.el-cascader-node__prefix{position:absolute;left:10px}.el-cascader-node__postfix{position:absolute;right:10px}.el-cascader-node__label{flex:1;text-align:left;padding:0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.el-cascader-node>.el-checkbox{margin-right:0}.el-cascader-node>.el-radio{margin-right:0}.el-cascader-node>.el-radio .el-radio__label{padding-left:0}.el-cascader{--el-cascader-menu-text-color:var(--el-text-color-regular);--el-cascader-menu-selected-text-color:var(--el-color-primary);--el-cascader-menu-fill:var(--el-bg-color-overlay);--el-cascader-menu-font-size:var(--el-font-size-base);--el-cascader-menu-radius:var(--el-border-radius-base);--el-cascader-menu-border:solid 1px var(--el-border-color-light);--el-cascader-menu-shadow:var(--el-box-shadow-light);--el-cascader-node-background-hover:var(--el-fill-color-light);--el-cascader-node-color-disabled:var(--el-text-color-placeholder);--el-cascader-color-empty:var(--el-text-color-placeholder);--el-cascader-tag-background:var(--el-fill-color);display:inline-block;vertical-align:middle;position:relative;font-size:var(--el-font-size-base);line-height:32px;outline:0}.el-cascader:not(.is-disabled):hover .el-input__wrapper{cursor:pointer;box-shadow:0 0 0 1px var(--el-input-hover-border-color) inset}.el-cascader .el-input{display:flex;cursor:pointer}.el-cascader .el-input .el-input__inner{text-overflow:ellipsis;cursor:pointer}.el-cascader .el-input .el-input__suffix-inner .el-icon{height:calc(100% - 2px)}.el-cascader .el-input .el-input__suffix-inner .el-icon svg{vertical-align:middle}.el-cascader .el-input .icon-arrow-down{transition:transform var(--el-transition-duration);font-size:14px}.el-cascader .el-input .icon-arrow-down.is-reverse{transform:rotateZ(180deg)}.el-cascader .el-input .icon-circle-close:hover{color:var(--el-input-clear-hover-color,var(--el-text-color-secondary))}.el-cascader .el-input.is-focus .el-input__wrapper{box-shadow:0 0 0 1px var(--el-input-focus-border-color,var(--el-color-primary)) inset}.el-cascader--large{font-size:14px;line-height:40px}.el-cascader--small{font-size:12px;line-height:24px}.el-cascader.is-disabled .el-cascader__label{z-index:calc(var(--el-index-normal) + 1);color:var(--el-disabled-text-color)}.el-cascader__dropdown{--el-cascader-menu-text-color:var(--el-text-color-regular);--el-cascader-menu-selected-text-color:var(--el-color-primary);--el-cascader-menu-fill:var(--el-bg-color-overlay);--el-cascader-menu-font-size:var(--el-font-size-base);--el-cascader-menu-radius:var(--el-border-radius-base);--el-cascader-menu-border:solid 1px var(--el-border-color-light);--el-cascader-menu-shadow:var(--el-box-shadow-light);--el-cascader-node-background-hover:var(--el-fill-color-light);--el-cascader-node-color-disabled:var(--el-text-color-placeholder);--el-cascader-color-empty:var(--el-text-color-placeholder);--el-cascader-tag-background:var(--el-fill-color)}.el-cascader__dropdown{font-size:var(--el-cascader-menu-font-size);border-radius:var(--el-cascader-menu-radius)}.el-cascader__dropdown.el-popper{background:var(--el-cascader-menu-fill);border:var(--el-cascader-menu-border);box-shadow:var(--el-cascader-menu-shadow)}.el-cascader__dropdown.el-popper .el-popper__arrow::before{border:var(--el-cascader-menu-border)}.el-cascader__dropdown.el-popper[data-popper-placement^=top] .el-popper__arrow::before{border-top-color:transparent;border-left-color:transparent}.el-cascader__dropdown.el-popper[data-popper-placement^=bottom] .el-popper__arrow::before{border-bottom-color:transparent;border-right-color:transparent}.el-cascader__dropdown.el-popper[data-popper-placement^=left] .el-popper__arrow::before{border-left-color:transparent;border-bottom-color:transparent}.el-cascader__dropdown.el-popper[data-popper-placement^=right] .el-popper__arrow::before{border-right-color:transparent;border-top-color:transparent}.el-cascader__dropdown.el-popper{box-shadow:var(--el-cascader-menu-shadow)}.el-cascader__tags{position:absolute;left:0;right:30px;top:50%;transform:translateY(-50%);display:flex;flex-wrap:wrap;line-height:normal;text-align:left;box-sizing:border-box}.el-cascader__tags .el-tag{display:inline-flex;align-items:center;max-width:100%;margin:2px 0 2px 6px;text-overflow:ellipsis;background:var(--el-cascader-tag-background)}.el-cascader__tags .el-tag:not(.is-hit){border-color:transparent}.el-cascader__tags .el-tag>span{flex:1;overflow:hidden;text-overflow:ellipsis}.el-cascader__tags .el-tag .el-icon-close{flex:none;background-color:var(--el-text-color-placeholder);color:var(--el-color-white)}.el-cascader__tags .el-tag .el-icon-close:hover{background-color:var(--el-text-color-secondary)}.el-cascader__collapse-tags{white-space:normal;z-index:var(--el-index-normal)}.el-cascader__collapse-tags .el-tag{display:inline-flex;align-items:center;max-width:100%;margin:2px 0 2px 6px;text-overflow:ellipsis;background:var(--el-fill-color)}.el-cascader__collapse-tags .el-tag:not(.is-hit){border-color:transparent}.el-cascader__collapse-tags .el-tag>span{flex:1;overflow:hidden;text-overflow:ellipsis}.el-cascader__collapse-tags .el-tag .el-icon-close{flex:none;background-color:var(--el-text-color-placeholder);color:var(--el-color-white)}.el-cascader__collapse-tags .el-tag .el-icon-close:hover{background-color:var(--el-text-color-secondary)}.el-cascader__suggestion-panel{border-radius:var(--el-cascader-menu-radius)}.el-cascader__suggestion-list{max-height:204px;margin:0;padding:6px 0;font-size:var(--el-font-size-base);color:var(--el-cascader-menu-text-color);text-align:center}.el-cascader__suggestion-item{display:flex;justify-content:space-between;align-items:center;height:34px;padding:0 15px;text-align:left;outline:0;cursor:pointer}.el-cascader__suggestion-item:focus,.el-cascader__suggestion-item:hover{background:var(--el-cascader-node-background-hover)}.el-cascader__suggestion-item.is-checked{color:var(--el-cascader-menu-selected-text-color);font-weight:700}.el-cascader__suggestion-item>span{margin-right:10px}.el-cascader__empty-text{margin:10px 0;color:var(--el-cascader-color-empty)}.el-cascader__search-input{flex:1;height:24px;min-width:60px;margin:2px 0 2px 11px;padding:0;color:var(--el-cascader-menu-text-color);border:none;outline:0;box-sizing:border-box;background:0 0}.el-cascader__search-input::-moz-placeholder{color:transparent}.el-cascader__search-input:-ms-input-placeholder{color:transparent}.el-cascader__search-input::placeholder{color:transparent}.el-check-tag{background-color:var(--el-color-info-light-9);border-radius:var(--el-border-radius-base);color:var(--el-color-info);cursor:pointer;display:inline-block;font-size:var(--el-font-size-base);line-height:var(--el-font-size-base);padding:7px 15px;transition:var(--el-transition-all);font-weight:700}.el-check-tag:hover{background-color:var(--el-color-info-light-7)}.el-check-tag.is-checked{background-color:var(--el-color-primary-light-8);color:var(--el-color-primary)}.el-check-tag.is-checked:hover{background-color:var(--el-color-primary-light-7)}.el-checkbox-button{--el-checkbox-button-checked-bg-color:var(--el-color-primary);--el-checkbox-button-checked-text-color:var(--el-color-white);--el-checkbox-button-checked-border-color:var(--el-color-primary)}.el-checkbox-button{position:relative;display:inline-block}.el-checkbox-button__inner{display:inline-block;line-height:1;font-weight:var(--el-checkbox-font-weight);white-space:nowrap;vertical-align:middle;cursor:pointer;background:var(--el-button-bg-color,var(--el-fill-color-blank));border:var(--el-border);border-left:0;color:var(--el-button-text-color,var(--el-text-color-regular));-webkit-appearance:none;text-align:center;box-sizing:border-box;outline:0;margin:0;position:relative;transition:var(--el-transition-all);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding:8px 15px;font-size:var(--el-font-size-base);border-radius:0}.el-checkbox-button__inner.is-round{padding:8px 15px}.el-checkbox-button__inner:hover{color:var(--el-color-primary)}.el-checkbox-button__inner [class*=el-icon-]{line-height:.9}.el-checkbox-button__inner [class*=el-icon-]+span{margin-left:5px}.el-checkbox-button__original{opacity:0;outline:0;position:absolute;margin:0;z-index:-1}.el-checkbox-button.is-checked .el-checkbox-button__inner{color:var(--el-checkbox-button-checked-text-color);background-color:var(--el-checkbox-button-checked-bg-color);border-color:var(--el-checkbox-button-checked-border-color);box-shadow:-1px 0 0 0 var(--el-color-primary-light-7)}.el-checkbox-button.is-checked:first-child .el-checkbox-button__inner{border-left-color:var(--el-checkbox-button-checked-border-color)}.el-checkbox-button.is-disabled .el-checkbox-button__inner{color:var(--el-disabled-text-color);cursor:not-allowed;background-image:none;background-color:var(--el-button-disabled-bg-color,var(--el-fill-color-blank));border-color:var(--el-button-disabled-border-color,var(--el-border-color-light));box-shadow:none}.el-checkbox-button.is-disabled:first-child .el-checkbox-button__inner{border-left-color:var(--el-button-disabled-border-color,var(--el-border-color-light))}.el-checkbox-button:first-child .el-checkbox-button__inner{border-left:var(--el-border);border-top-left-radius:var(--el-border-radius-base);border-bottom-left-radius:var(--el-border-radius-base);box-shadow:none!important}.el-checkbox-button.is-focus .el-checkbox-button__inner{border-color:var(--el-checkbox-button-checked-border-color)}.el-checkbox-button:last-child .el-checkbox-button__inner{border-top-right-radius:var(--el-border-radius-base);border-bottom-right-radius:var(--el-border-radius-base)}.el-checkbox-button--large .el-checkbox-button__inner{padding:12px 19px;font-size:var(--el-font-size-base);border-radius:0}.el-checkbox-button--large .el-checkbox-button__inner.is-round{padding:12px 19px}.el-checkbox-button--small .el-checkbox-button__inner{padding:5px 11px;font-size:12px;border-radius:0}.el-checkbox-button--small .el-checkbox-button__inner.is-round{padding:5px 11px}.el-checkbox-group{font-size:0;line-height:0}.el-checkbox{--el-checkbox-font-size:14px;--el-checkbox-font-weight:var(--el-font-weight-primary);--el-checkbox-text-color:var(--el-text-color-regular);--el-checkbox-input-height:14px;--el-checkbox-input-width:14px;--el-checkbox-border-radius:var(--el-border-radius-small);--el-checkbox-bg-color:var(--el-fill-color-blank);--el-checkbox-input-border:var(--el-border);--el-checkbox-disabled-border-color:var(--el-border-color);--el-checkbox-disabled-input-fill:var(--el-fill-color-light);--el-checkbox-disabled-icon-color:var(--el-text-color-placeholder);--el-checkbox-disabled-checked-input-fill:var(--el-border-color-extra-light);--el-checkbox-disabled-checked-input-border-color:var(--el-border-color);--el-checkbox-disabled-checked-icon-color:var(--el-text-color-placeholder);--el-checkbox-checked-text-color:var(--el-color-primary);--el-checkbox-checked-input-border-color:var(--el-color-primary);--el-checkbox-checked-bg-color:var(--el-color-primary);--el-checkbox-checked-icon-color:var(--el-color-white);--el-checkbox-input-border-color-hover:var(--el-color-primary)}.el-checkbox{color:var(--el-checkbox-text-color);font-weight:var(--el-checkbox-font-weight);font-size:var(--el-font-size-base);position:relative;cursor:pointer;display:inline-flex;align-items:center;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin-right:30px;height:32px}.el-checkbox.is-disabled{cursor:not-allowed}.el-checkbox.is-bordered{padding:0 15px 0 9px;border-radius:var(--el-border-radius-base);border:var(--el-border);box-sizing:border-box}.el-checkbox.is-bordered.is-checked{border-color:var(--el-color-primary)}.el-checkbox.is-bordered.is-disabled{border-color:var(--el-border-color-lighter)}.el-checkbox.is-bordered.el-checkbox--large{padding:0 19px 0 11px;border-radius:var(--el-border-radius-base)}.el-checkbox.is-bordered.el-checkbox--large .el-checkbox__label{font-size:var(--el-font-size-base)}.el-checkbox.is-bordered.el-checkbox--large .el-checkbox__inner{height:14px;width:14px}.el-checkbox.is-bordered.el-checkbox--small{padding:0 11px 0 7px;border-radius:calc(var(--el-border-radius-base) - 1px)}.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__label{font-size:12px}.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner{height:12px;width:12px}.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner::after{height:6px;width:2px}.el-checkbox input:focus-visible+.el-checkbox__inner{outline:2px solid var(--el-checkbox-input-border-color-hover);outline-offset:1px;border-radius:var(--el-checkbox-border-radius)}.el-checkbox__input{white-space:nowrap;cursor:pointer;outline:0;display:inline-flex;position:relative}.el-checkbox__input.is-disabled .el-checkbox__inner{background-color:var(--el-checkbox-disabled-input-fill);border-color:var(--el-checkbox-disabled-border-color);cursor:not-allowed}.el-checkbox__input.is-disabled .el-checkbox__inner::after{cursor:not-allowed;border-color:var(--el-checkbox-disabled-icon-color)}.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner{background-color:var(--el-checkbox-disabled-checked-input-fill);border-color:var(--el-checkbox-disabled-checked-input-border-color)}.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after{border-color:var(--el-checkbox-disabled-checked-icon-color)}.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner{background-color:var(--el-checkbox-disabled-checked-input-fill);border-color:var(--el-checkbox-disabled-checked-input-border-color)}.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner::before{background-color:var(--el-checkbox-disabled-checked-icon-color);border-color:var(--el-checkbox-disabled-checked-icon-color)}.el-checkbox__input.is-disabled+span.el-checkbox__label{color:var(--el-disabled-text-color);cursor:not-allowed}.el-checkbox__input.is-checked .el-checkbox__inner{background-color:var(--el-checkbox-checked-bg-color);border-color:var(--el-checkbox-checked-input-border-color)}.el-checkbox__input.is-checked .el-checkbox__inner::after{transform:rotate(45deg) scaleY(1)}.el-checkbox__input.is-checked+.el-checkbox__label{color:var(--el-checkbox-checked-text-color)}.el-checkbox__input.is-focus:not(.is-checked) .el-checkbox__original:not(:focus-visible){border-color:var(--el-checkbox-input-border-color-hover)}.el-checkbox__input.is-indeterminate .el-checkbox__inner{background-color:var(--el-checkbox-checked-bg-color);border-color:var(--el-checkbox-checked-input-border-color)}.el-checkbox__input.is-indeterminate .el-checkbox__inner::before{content:"";position:absolute;display:block;background-color:var(--el-checkbox-checked-icon-color);height:2px;transform:scale(.5);left:0;right:0;top:5px}.el-checkbox__input.is-indeterminate .el-checkbox__inner::after{display:none}.el-checkbox__inner{display:inline-block;position:relative;border:var(--el-checkbox-input-border);border-radius:var(--el-checkbox-border-radius);box-sizing:border-box;width:var(--el-checkbox-input-width);height:var(--el-checkbox-input-height);background-color:var(--el-checkbox-bg-color);z-index:var(--el-index-normal);transition:border-color .25s cubic-bezier(.71,-.46,.29,1.46),background-color .25s cubic-bezier(.71,-.46,.29,1.46),outline .25s cubic-bezier(.71,-.46,.29,1.46)}.el-checkbox__inner:hover{border-color:var(--el-checkbox-input-border-color-hover)}.el-checkbox__inner::after{box-sizing:content-box;content:"";border:1px solid var(--el-checkbox-checked-icon-color);border-left:0;border-top:0;height:7px;left:4px;position:absolute;top:1px;transform:rotate(45deg) scaleY(0);width:3px;transition:transform .15s ease-in 50ms;transform-origin:center}.el-checkbox__original{opacity:0;outline:0;position:absolute;margin:0;width:0;height:0;z-index:-1}.el-checkbox__label{display:inline-block;padding-left:8px;line-height:1;font-size:var(--el-checkbox-font-size)}.el-checkbox.el-checkbox--large{height:40px}.el-checkbox.el-checkbox--large .el-checkbox__label{font-size:14px}.el-checkbox.el-checkbox--large .el-checkbox__inner{width:14px;height:14px}.el-checkbox.el-checkbox--small{height:24px}.el-checkbox.el-checkbox--small .el-checkbox__label{font-size:12px}.el-checkbox.el-checkbox--small .el-checkbox__inner{width:12px;height:12px}.el-checkbox.el-checkbox--small .el-checkbox__input.is-indeterminate .el-checkbox__inner::before{top:4px}.el-checkbox.el-checkbox--small .el-checkbox__inner::after{width:2px;height:6px}.el-checkbox:last-of-type{margin-right:0}[class*=el-col-]{box-sizing:border-box}[class*=el-col-].is-guttered{display:block;min-height:1px}.el-col-0{display:none}.el-col-0.is-guttered{display:none}.el-col-0{max-width:0%;flex:0 0 0%}.el-col-offset-0{margin-left:0}.el-col-pull-0{position:relative;right:0}.el-col-push-0{position:relative;left:0}.el-col-1{max-width:4.1666666667%;flex:0 0 4.1666666667%}.el-col-offset-1{margin-left:4.1666666667%}.el-col-pull-1{position:relative;right:4.1666666667%}.el-col-push-1{position:relative;left:4.1666666667%}.el-col-2{max-width:8.3333333333%;flex:0 0 8.3333333333%}.el-col-offset-2{margin-left:8.3333333333%}.el-col-pull-2{position:relative;right:8.3333333333%}.el-col-push-2{position:relative;left:8.3333333333%}.el-col-3{max-width:12.5%;flex:0 0 12.5%}.el-col-offset-3{margin-left:12.5%}.el-col-pull-3{position:relative;right:12.5%}.el-col-push-3{position:relative;left:12.5%}.el-col-4{max-width:16.6666666667%;flex:0 0 16.6666666667%}.el-col-offset-4{margin-left:16.6666666667%}.el-col-pull-4{position:relative;right:16.6666666667%}.el-col-push-4{position:relative;left:16.6666666667%}.el-col-5{max-width:20.8333333333%;flex:0 0 20.8333333333%}.el-col-offset-5{margin-left:20.8333333333%}.el-col-pull-5{position:relative;right:20.8333333333%}.el-col-push-5{position:relative;left:20.8333333333%}.el-col-6{max-width:25%;flex:0 0 25%}.el-col-offset-6{margin-left:25%}.el-col-pull-6{position:relative;right:25%}.el-col-push-6{position:relative;left:25%}.el-col-7{max-width:29.1666666667%;flex:0 0 29.1666666667%}.el-col-offset-7{margin-left:29.1666666667%}.el-col-pull-7{position:relative;right:29.1666666667%}.el-col-push-7{position:relative;left:29.1666666667%}.el-col-8{max-width:33.3333333333%;flex:0 0 33.3333333333%}.el-col-offset-8{margin-left:33.3333333333%}.el-col-pull-8{position:relative;right:33.3333333333%}.el-col-push-8{position:relative;left:33.3333333333%}.el-col-9{max-width:37.5%;flex:0 0 37.5%}.el-col-offset-9{margin-left:37.5%}.el-col-pull-9{position:relative;right:37.5%}.el-col-push-9{position:relative;left:37.5%}.el-col-10{max-width:41.6666666667%;flex:0 0 41.6666666667%}.el-col-offset-10{margin-left:41.6666666667%}.el-col-pull-10{position:relative;right:41.6666666667%}.el-col-push-10{position:relative;left:41.6666666667%}.el-col-11{max-width:45.8333333333%;flex:0 0 45.8333333333%}.el-col-offset-11{margin-left:45.8333333333%}.el-col-pull-11{position:relative;right:45.8333333333%}.el-col-push-11{position:relative;left:45.8333333333%}.el-col-12{max-width:50%;flex:0 0 50%}.el-col-offset-12{margin-left:50%}.el-col-pull-12{position:relative;right:50%}.el-col-push-12{position:relative;left:50%}.el-col-13{max-width:54.1666666667%;flex:0 0 54.1666666667%}.el-col-offset-13{margin-left:54.1666666667%}.el-col-pull-13{position:relative;right:54.1666666667%}.el-col-push-13{position:relative;left:54.1666666667%}.el-col-14{max-width:58.3333333333%;flex:0 0 58.3333333333%}.el-col-offset-14{margin-left:58.3333333333%}.el-col-pull-14{position:relative;right:58.3333333333%}.el-col-push-14{position:relative;left:58.3333333333%}.el-col-15{max-width:62.5%;flex:0 0 62.5%}.el-col-offset-15{margin-left:62.5%}.el-col-pull-15{position:relative;right:62.5%}.el-col-push-15{position:relative;left:62.5%}.el-col-16{max-width:66.6666666667%;flex:0 0 66.6666666667%}.el-col-offset-16{margin-left:66.6666666667%}.el-col-pull-16{position:relative;right:66.6666666667%}.el-col-push-16{position:relative;left:66.6666666667%}.el-col-17{max-width:70.8333333333%;flex:0 0 70.8333333333%}.el-col-offset-17{margin-left:70.8333333333%}.el-col-pull-17{position:relative;right:70.8333333333%}.el-col-push-17{position:relative;left:70.8333333333%}.el-col-18{max-width:75%;flex:0 0 75%}.el-col-offset-18{margin-left:75%}.el-col-pull-18{position:relative;right:75%}.el-col-push-18{position:relative;left:75%}.el-col-19{max-width:79.1666666667%;flex:0 0 79.1666666667%}.el-col-offset-19{margin-left:79.1666666667%}.el-col-pull-19{position:relative;right:79.1666666667%}.el-col-push-19{position:relative;left:79.1666666667%}.el-col-20{max-width:83.3333333333%;flex:0 0 83.3333333333%}.el-col-offset-20{margin-left:83.3333333333%}.el-col-pull-20{position:relative;right:83.3333333333%}.el-col-push-20{position:relative;left:83.3333333333%}.el-col-21{max-width:87.5%;flex:0 0 87.5%}.el-col-offset-21{margin-left:87.5%}.el-col-pull-21{position:relative;right:87.5%}.el-col-push-21{position:relative;left:87.5%}.el-col-22{max-width:91.6666666667%;flex:0 0 91.6666666667%}.el-col-offset-22{margin-left:91.6666666667%}.el-col-pull-22{position:relative;right:91.6666666667%}.el-col-push-22{position:relative;left:91.6666666667%}.el-col-23{max-width:95.8333333333%;flex:0 0 95.8333333333%}.el-col-offset-23{margin-left:95.8333333333%}.el-col-pull-23{position:relative;right:95.8333333333%}.el-col-push-23{position:relative;left:95.8333333333%}.el-col-24{max-width:100%;flex:0 0 100%}.el-col-offset-24{margin-left:100%}.el-col-pull-24{position:relative;right:100%}.el-col-push-24{position:relative;left:100%}@media only screen and (max-width:768px){.el-col-xs-0{display:none}.el-col-xs-0.is-guttered{display:none}.el-col-xs-0{max-width:0%;flex:0 0 0%}.el-col-xs-offset-0{margin-left:0}.el-col-xs-pull-0{position:relative;right:0}.el-col-xs-push-0{position:relative;left:0}.el-col-xs-1{display:block;max-width:4.1666666667%;flex:0 0 4.1666666667%}.el-col-xs-offset-1{margin-left:4.1666666667%}.el-col-xs-pull-1{position:relative;right:4.1666666667%}.el-col-xs-push-1{position:relative;left:4.1666666667%}.el-col-xs-2{display:block;max-width:8.3333333333%;flex:0 0 8.3333333333%}.el-col-xs-offset-2{margin-left:8.3333333333%}.el-col-xs-pull-2{position:relative;right:8.3333333333%}.el-col-xs-push-2{position:relative;left:8.3333333333%}.el-col-xs-3{display:block;max-width:12.5%;flex:0 0 12.5%}.el-col-xs-offset-3{margin-left:12.5%}.el-col-xs-pull-3{position:relative;right:12.5%}.el-col-xs-push-3{position:relative;left:12.5%}.el-col-xs-4{display:block;max-width:16.6666666667%;flex:0 0 16.6666666667%}.el-col-xs-offset-4{margin-left:16.6666666667%}.el-col-xs-pull-4{position:relative;right:16.6666666667%}.el-col-xs-push-4{position:relative;left:16.6666666667%}.el-col-xs-5{display:block;max-width:20.8333333333%;flex:0 0 20.8333333333%}.el-col-xs-offset-5{margin-left:20.8333333333%}.el-col-xs-pull-5{position:relative;right:20.8333333333%}.el-col-xs-push-5{position:relative;left:20.8333333333%}.el-col-xs-6{display:block;max-width:25%;flex:0 0 25%}.el-col-xs-offset-6{margin-left:25%}.el-col-xs-pull-6{position:relative;right:25%}.el-col-xs-push-6{position:relative;left:25%}.el-col-xs-7{display:block;max-width:29.1666666667%;flex:0 0 29.1666666667%}.el-col-xs-offset-7{margin-left:29.1666666667%}.el-col-xs-pull-7{position:relative;right:29.1666666667%}.el-col-xs-push-7{position:relative;left:29.1666666667%}.el-col-xs-8{display:block;max-width:33.3333333333%;flex:0 0 33.3333333333%}.el-col-xs-offset-8{margin-left:33.3333333333%}.el-col-xs-pull-8{position:relative;right:33.3333333333%}.el-col-xs-push-8{position:relative;left:33.3333333333%}.el-col-xs-9{display:block;max-width:37.5%;flex:0 0 37.5%}.el-col-xs-offset-9{margin-left:37.5%}.el-col-xs-pull-9{position:relative;right:37.5%}.el-col-xs-push-9{position:relative;left:37.5%}.el-col-xs-10{display:block;max-width:41.6666666667%;flex:0 0 41.6666666667%}.el-col-xs-offset-10{margin-left:41.6666666667%}.el-col-xs-pull-10{position:relative;right:41.6666666667%}.el-col-xs-push-10{position:relative;left:41.6666666667%}.el-col-xs-11{display:block;max-width:45.8333333333%;flex:0 0 45.8333333333%}.el-col-xs-offset-11{margin-left:45.8333333333%}.el-col-xs-pull-11{position:relative;right:45.8333333333%}.el-col-xs-push-11{position:relative;left:45.8333333333%}.el-col-xs-12{display:block;max-width:50%;flex:0 0 50%}.el-col-xs-offset-12{margin-left:50%}.el-col-xs-pull-12{position:relative;right:50%}.el-col-xs-push-12{position:relative;left:50%}.el-col-xs-13{display:block;max-width:54.1666666667%;flex:0 0 54.1666666667%}.el-col-xs-offset-13{margin-left:54.1666666667%}.el-col-xs-pull-13{position:relative;right:54.1666666667%}.el-col-xs-push-13{position:relative;left:54.1666666667%}.el-col-xs-14{display:block;max-width:58.3333333333%;flex:0 0 58.3333333333%}.el-col-xs-offset-14{margin-left:58.3333333333%}.el-col-xs-pull-14{position:relative;right:58.3333333333%}.el-col-xs-push-14{position:relative;left:58.3333333333%}.el-col-xs-15{display:block;max-width:62.5%;flex:0 0 62.5%}.el-col-xs-offset-15{margin-left:62.5%}.el-col-xs-pull-15{position:relative;right:62.5%}.el-col-xs-push-15{position:relative;left:62.5%}.el-col-xs-16{display:block;max-width:66.6666666667%;flex:0 0 66.6666666667%}.el-col-xs-offset-16{margin-left:66.6666666667%}.el-col-xs-pull-16{position:relative;right:66.6666666667%}.el-col-xs-push-16{position:relative;left:66.6666666667%}.el-col-xs-17{display:block;max-width:70.8333333333%;flex:0 0 70.8333333333%}.el-col-xs-offset-17{margin-left:70.8333333333%}.el-col-xs-pull-17{position:relative;right:70.8333333333%}.el-col-xs-push-17{position:relative;left:70.8333333333%}.el-col-xs-18{display:block;max-width:75%;flex:0 0 75%}.el-col-xs-offset-18{margin-left:75%}.el-col-xs-pull-18{position:relative;right:75%}.el-col-xs-push-18{position:relative;left:75%}.el-col-xs-19{display:block;max-width:79.1666666667%;flex:0 0 79.1666666667%}.el-col-xs-offset-19{margin-left:79.1666666667%}.el-col-xs-pull-19{position:relative;right:79.1666666667%}.el-col-xs-push-19{position:relative;left:79.1666666667%}.el-col-xs-20{display:block;max-width:83.3333333333%;flex:0 0 83.3333333333%}.el-col-xs-offset-20{margin-left:83.3333333333%}.el-col-xs-pull-20{position:relative;right:83.3333333333%}.el-col-xs-push-20{position:relative;left:83.3333333333%}.el-col-xs-21{display:block;max-width:87.5%;flex:0 0 87.5%}.el-col-xs-offset-21{margin-left:87.5%}.el-col-xs-pull-21{position:relative;right:87.5%}.el-col-xs-push-21{position:relative;left:87.5%}.el-col-xs-22{display:block;max-width:91.6666666667%;flex:0 0 91.6666666667%}.el-col-xs-offset-22{margin-left:91.6666666667%}.el-col-xs-pull-22{position:relative;right:91.6666666667%}.el-col-xs-push-22{position:relative;left:91.6666666667%}.el-col-xs-23{display:block;max-width:95.8333333333%;flex:0 0 95.8333333333%}.el-col-xs-offset-23{margin-left:95.8333333333%}.el-col-xs-pull-23{position:relative;right:95.8333333333%}.el-col-xs-push-23{position:relative;left:95.8333333333%}.el-col-xs-24{display:block;max-width:100%;flex:0 0 100%}.el-col-xs-offset-24{margin-left:100%}.el-col-xs-pull-24{position:relative;right:100%}.el-col-xs-push-24{position:relative;left:100%}}@media only screen and (min-width:768px){.el-col-sm-0{display:none}.el-col-sm-0.is-guttered{display:none}.el-col-sm-0{max-width:0%;flex:0 0 0%}.el-col-sm-offset-0{margin-left:0}.el-col-sm-pull-0{position:relative;right:0}.el-col-sm-push-0{position:relative;left:0}.el-col-sm-1{display:block;max-width:4.1666666667%;flex:0 0 4.1666666667%}.el-col-sm-offset-1{margin-left:4.1666666667%}.el-col-sm-pull-1{position:relative;right:4.1666666667%}.el-col-sm-push-1{position:relative;left:4.1666666667%}.el-col-sm-2{display:block;max-width:8.3333333333%;flex:0 0 8.3333333333%}.el-col-sm-offset-2{margin-left:8.3333333333%}.el-col-sm-pull-2{position:relative;right:8.3333333333%}.el-col-sm-push-2{position:relative;left:8.3333333333%}.el-col-sm-3{display:block;max-width:12.5%;flex:0 0 12.5%}.el-col-sm-offset-3{margin-left:12.5%}.el-col-sm-pull-3{position:relative;right:12.5%}.el-col-sm-push-3{position:relative;left:12.5%}.el-col-sm-4{display:block;max-width:16.6666666667%;flex:0 0 16.6666666667%}.el-col-sm-offset-4{margin-left:16.6666666667%}.el-col-sm-pull-4{position:relative;right:16.6666666667%}.el-col-sm-push-4{position:relative;left:16.6666666667%}.el-col-sm-5{display:block;max-width:20.8333333333%;flex:0 0 20.8333333333%}.el-col-sm-offset-5{margin-left:20.8333333333%}.el-col-sm-pull-5{position:relative;right:20.8333333333%}.el-col-sm-push-5{position:relative;left:20.8333333333%}.el-col-sm-6{display:block;max-width:25%;flex:0 0 25%}.el-col-sm-offset-6{margin-left:25%}.el-col-sm-pull-6{position:relative;right:25%}.el-col-sm-push-6{position:relative;left:25%}.el-col-sm-7{display:block;max-width:29.1666666667%;flex:0 0 29.1666666667%}.el-col-sm-offset-7{margin-left:29.1666666667%}.el-col-sm-pull-7{position:relative;right:29.1666666667%}.el-col-sm-push-7{position:relative;left:29.1666666667%}.el-col-sm-8{display:block;max-width:33.3333333333%;flex:0 0 33.3333333333%}.el-col-sm-offset-8{margin-left:33.3333333333%}.el-col-sm-pull-8{position:relative;right:33.3333333333%}.el-col-sm-push-8{position:relative;left:33.3333333333%}.el-col-sm-9{display:block;max-width:37.5%;flex:0 0 37.5%}.el-col-sm-offset-9{margin-left:37.5%}.el-col-sm-pull-9{position:relative;right:37.5%}.el-col-sm-push-9{position:relative;left:37.5%}.el-col-sm-10{display:block;max-width:41.6666666667%;flex:0 0 41.6666666667%}.el-col-sm-offset-10{margin-left:41.6666666667%}.el-col-sm-pull-10{position:relative;right:41.6666666667%}.el-col-sm-push-10{position:relative;left:41.6666666667%}.el-col-sm-11{display:block;max-width:45.8333333333%;flex:0 0 45.8333333333%}.el-col-sm-offset-11{margin-left:45.8333333333%}.el-col-sm-pull-11{position:relative;right:45.8333333333%}.el-col-sm-push-11{position:relative;left:45.8333333333%}.el-col-sm-12{display:block;max-width:50%;flex:0 0 50%}.el-col-sm-offset-12{margin-left:50%}.el-col-sm-pull-12{position:relative;right:50%}.el-col-sm-push-12{position:relative;left:50%}.el-col-sm-13{display:block;max-width:54.1666666667%;flex:0 0 54.1666666667%}.el-col-sm-offset-13{margin-left:54.1666666667%}.el-col-sm-pull-13{position:relative;right:54.1666666667%}.el-col-sm-push-13{position:relative;left:54.1666666667%}.el-col-sm-14{display:block;max-width:58.3333333333%;flex:0 0 58.3333333333%}.el-col-sm-offset-14{margin-left:58.3333333333%}.el-col-sm-pull-14{position:relative;right:58.3333333333%}.el-col-sm-push-14{position:relative;left:58.3333333333%}.el-col-sm-15{display:block;max-width:62.5%;flex:0 0 62.5%}.el-col-sm-offset-15{margin-left:62.5%}.el-col-sm-pull-15{position:relative;right:62.5%}.el-col-sm-push-15{position:relative;left:62.5%}.el-col-sm-16{display:block;max-width:66.6666666667%;flex:0 0 66.6666666667%}.el-col-sm-offset-16{margin-left:66.6666666667%}.el-col-sm-pull-16{position:relative;right:66.6666666667%}.el-col-sm-push-16{position:relative;left:66.6666666667%}.el-col-sm-17{display:block;max-width:70.8333333333%;flex:0 0 70.8333333333%}.el-col-sm-offset-17{margin-left:70.8333333333%}.el-col-sm-pull-17{position:relative;right:70.8333333333%}.el-col-sm-push-17{position:relative;left:70.8333333333%}.el-col-sm-18{display:block;max-width:75%;flex:0 0 75%}.el-col-sm-offset-18{margin-left:75%}.el-col-sm-pull-18{position:relative;right:75%}.el-col-sm-push-18{position:relative;left:75%}.el-col-sm-19{display:block;max-width:79.1666666667%;flex:0 0 79.1666666667%}.el-col-sm-offset-19{margin-left:79.1666666667%}.el-col-sm-pull-19{position:relative;right:79.1666666667%}.el-col-sm-push-19{position:relative;left:79.1666666667%}.el-col-sm-20{display:block;max-width:83.3333333333%;flex:0 0 83.3333333333%}.el-col-sm-offset-20{margin-left:83.3333333333%}.el-col-sm-pull-20{position:relative;right:83.3333333333%}.el-col-sm-push-20{position:relative;left:83.3333333333%}.el-col-sm-21{display:block;max-width:87.5%;flex:0 0 87.5%}.el-col-sm-offset-21{margin-left:87.5%}.el-col-sm-pull-21{position:relative;right:87.5%}.el-col-sm-push-21{position:relative;left:87.5%}.el-col-sm-22{display:block;max-width:91.6666666667%;flex:0 0 91.6666666667%}.el-col-sm-offset-22{margin-left:91.6666666667%}.el-col-sm-pull-22{position:relative;right:91.6666666667%}.el-col-sm-push-22{position:relative;left:91.6666666667%}.el-col-sm-23{display:block;max-width:95.8333333333%;flex:0 0 95.8333333333%}.el-col-sm-offset-23{margin-left:95.8333333333%}.el-col-sm-pull-23{position:relative;right:95.8333333333%}.el-col-sm-push-23{position:relative;left:95.8333333333%}.el-col-sm-24{display:block;max-width:100%;flex:0 0 100%}.el-col-sm-offset-24{margin-left:100%}.el-col-sm-pull-24{position:relative;right:100%}.el-col-sm-push-24{position:relative;left:100%}}@media only screen and (min-width:992px){.el-col-md-0{display:none}.el-col-md-0.is-guttered{display:none}.el-col-md-0{max-width:0%;flex:0 0 0%}.el-col-md-offset-0{margin-left:0}.el-col-md-pull-0{position:relative;right:0}.el-col-md-push-0{position:relative;left:0}.el-col-md-1{display:block;max-width:4.1666666667%;flex:0 0 4.1666666667%}.el-col-md-offset-1{margin-left:4.1666666667%}.el-col-md-pull-1{position:relative;right:4.1666666667%}.el-col-md-push-1{position:relative;left:4.1666666667%}.el-col-md-2{display:block;max-width:8.3333333333%;flex:0 0 8.3333333333%}.el-col-md-offset-2{margin-left:8.3333333333%}.el-col-md-pull-2{position:relative;right:8.3333333333%}.el-col-md-push-2{position:relative;left:8.3333333333%}.el-col-md-3{display:block;max-width:12.5%;flex:0 0 12.5%}.el-col-md-offset-3{margin-left:12.5%}.el-col-md-pull-3{position:relative;right:12.5%}.el-col-md-push-3{position:relative;left:12.5%}.el-col-md-4{display:block;max-width:16.6666666667%;flex:0 0 16.6666666667%}.el-col-md-offset-4{margin-left:16.6666666667%}.el-col-md-pull-4{position:relative;right:16.6666666667%}.el-col-md-push-4{position:relative;left:16.6666666667%}.el-col-md-5{display:block;max-width:20.8333333333%;flex:0 0 20.8333333333%}.el-col-md-offset-5{margin-left:20.8333333333%}.el-col-md-pull-5{position:relative;right:20.8333333333%}.el-col-md-push-5{position:relative;left:20.8333333333%}.el-col-md-6{display:block;max-width:25%;flex:0 0 25%}.el-col-md-offset-6{margin-left:25%}.el-col-md-pull-6{position:relative;right:25%}.el-col-md-push-6{position:relative;left:25%}.el-col-md-7{display:block;max-width:29.1666666667%;flex:0 0 29.1666666667%}.el-col-md-offset-7{margin-left:29.1666666667%}.el-col-md-pull-7{position:relative;right:29.1666666667%}.el-col-md-push-7{position:relative;left:29.1666666667%}.el-col-md-8{display:block;max-width:33.3333333333%;flex:0 0 33.3333333333%}.el-col-md-offset-8{margin-left:33.3333333333%}.el-col-md-pull-8{position:relative;right:33.3333333333%}.el-col-md-push-8{position:relative;left:33.3333333333%}.el-col-md-9{display:block;max-width:37.5%;flex:0 0 37.5%}.el-col-md-offset-9{margin-left:37.5%}.el-col-md-pull-9{position:relative;right:37.5%}.el-col-md-push-9{position:relative;left:37.5%}.el-col-md-10{display:block;max-width:41.6666666667%;flex:0 0 41.6666666667%}.el-col-md-offset-10{margin-left:41.6666666667%}.el-col-md-pull-10{position:relative;right:41.6666666667%}.el-col-md-push-10{position:relative;left:41.6666666667%}.el-col-md-11{display:block;max-width:45.8333333333%;flex:0 0 45.8333333333%}.el-col-md-offset-11{margin-left:45.8333333333%}.el-col-md-pull-11{position:relative;right:45.8333333333%}.el-col-md-push-11{position:relative;left:45.8333333333%}.el-col-md-12{display:block;max-width:50%;flex:0 0 50%}.el-col-md-offset-12{margin-left:50%}.el-col-md-pull-12{position:relative;right:50%}.el-col-md-push-12{position:relative;left:50%}.el-col-md-13{display:block;max-width:54.1666666667%;flex:0 0 54.1666666667%}.el-col-md-offset-13{margin-left:54.1666666667%}.el-col-md-pull-13{position:relative;right:54.1666666667%}.el-col-md-push-13{position:relative;left:54.1666666667%}.el-col-md-14{display:block;max-width:58.3333333333%;flex:0 0 58.3333333333%}.el-col-md-offset-14{margin-left:58.3333333333%}.el-col-md-pull-14{position:relative;right:58.3333333333%}.el-col-md-push-14{position:relative;left:58.3333333333%}.el-col-md-15{display:block;max-width:62.5%;flex:0 0 62.5%}.el-col-md-offset-15{margin-left:62.5%}.el-col-md-pull-15{position:relative;right:62.5%}.el-col-md-push-15{position:relative;left:62.5%}.el-col-md-16{display:block;max-width:66.6666666667%;flex:0 0 66.6666666667%}.el-col-md-offset-16{margin-left:66.6666666667%}.el-col-md-pull-16{position:relative;right:66.6666666667%}.el-col-md-push-16{position:relative;left:66.6666666667%}.el-col-md-17{display:block;max-width:70.8333333333%;flex:0 0 70.8333333333%}.el-col-md-offset-17{margin-left:70.8333333333%}.el-col-md-pull-17{position:relative;right:70.8333333333%}.el-col-md-push-17{position:relative;left:70.8333333333%}.el-col-md-18{display:block;max-width:75%;flex:0 0 75%}.el-col-md-offset-18{margin-left:75%}.el-col-md-pull-18{position:relative;right:75%}.el-col-md-push-18{position:relative;left:75%}.el-col-md-19{display:block;max-width:79.1666666667%;flex:0 0 79.1666666667%}.el-col-md-offset-19{margin-left:79.1666666667%}.el-col-md-pull-19{position:relative;right:79.1666666667%}.el-col-md-push-19{position:relative;left:79.1666666667%}.el-col-md-20{display:block;max-width:83.3333333333%;flex:0 0 83.3333333333%}.el-col-md-offset-20{margin-left:83.3333333333%}.el-col-md-pull-20{position:relative;right:83.3333333333%}.el-col-md-push-20{position:relative;left:83.3333333333%}.el-col-md-21{display:block;max-width:87.5%;flex:0 0 87.5%}.el-col-md-offset-21{margin-left:87.5%}.el-col-md-pull-21{position:relative;right:87.5%}.el-col-md-push-21{position:relative;left:87.5%}.el-col-md-22{display:block;max-width:91.6666666667%;flex:0 0 91.6666666667%}.el-col-md-offset-22{margin-left:91.6666666667%}.el-col-md-pull-22{position:relative;right:91.6666666667%}.el-col-md-push-22{position:relative;left:91.6666666667%}.el-col-md-23{display:block;max-width:95.8333333333%;flex:0 0 95.8333333333%}.el-col-md-offset-23{margin-left:95.8333333333%}.el-col-md-pull-23{position:relative;right:95.8333333333%}.el-col-md-push-23{position:relative;left:95.8333333333%}.el-col-md-24{display:block;max-width:100%;flex:0 0 100%}.el-col-md-offset-24{margin-left:100%}.el-col-md-pull-24{position:relative;right:100%}.el-col-md-push-24{position:relative;left:100%}}@media only screen and (min-width:1200px){.el-col-lg-0{display:none}.el-col-lg-0.is-guttered{display:none}.el-col-lg-0{max-width:0%;flex:0 0 0%}.el-col-lg-offset-0{margin-left:0}.el-col-lg-pull-0{position:relative;right:0}.el-col-lg-push-0{position:relative;left:0}.el-col-lg-1{display:block;max-width:4.1666666667%;flex:0 0 4.1666666667%}.el-col-lg-offset-1{margin-left:4.1666666667%}.el-col-lg-pull-1{position:relative;right:4.1666666667%}.el-col-lg-push-1{position:relative;left:4.1666666667%}.el-col-lg-2{display:block;max-width:8.3333333333%;flex:0 0 8.3333333333%}.el-col-lg-offset-2{margin-left:8.3333333333%}.el-col-lg-pull-2{position:relative;right:8.3333333333%}.el-col-lg-push-2{position:relative;left:8.3333333333%}.el-col-lg-3{display:block;max-width:12.5%;flex:0 0 12.5%}.el-col-lg-offset-3{margin-left:12.5%}.el-col-lg-pull-3{position:relative;right:12.5%}.el-col-lg-push-3{position:relative;left:12.5%}.el-col-lg-4{display:block;max-width:16.6666666667%;flex:0 0 16.6666666667%}.el-col-lg-offset-4{margin-left:16.6666666667%}.el-col-lg-pull-4{position:relative;right:16.6666666667%}.el-col-lg-push-4{position:relative;left:16.6666666667%}.el-col-lg-5{display:block;max-width:20.8333333333%;flex:0 0 20.8333333333%}.el-col-lg-offset-5{margin-left:20.8333333333%}.el-col-lg-pull-5{position:relative;right:20.8333333333%}.el-col-lg-push-5{position:relative;left:20.8333333333%}.el-col-lg-6{display:block;max-width:25%;flex:0 0 25%}.el-col-lg-offset-6{margin-left:25%}.el-col-lg-pull-6{position:relative;right:25%}.el-col-lg-push-6{position:relative;left:25%}.el-col-lg-7{display:block;max-width:29.1666666667%;flex:0 0 29.1666666667%}.el-col-lg-offset-7{margin-left:29.1666666667%}.el-col-lg-pull-7{position:relative;right:29.1666666667%}.el-col-lg-push-7{position:relative;left:29.1666666667%}.el-col-lg-8{display:block;max-width:33.3333333333%;flex:0 0 33.3333333333%}.el-col-lg-offset-8{margin-left:33.3333333333%}.el-col-lg-pull-8{position:relative;right:33.3333333333%}.el-col-lg-push-8{position:relative;left:33.3333333333%}.el-col-lg-9{display:block;max-width:37.5%;flex:0 0 37.5%}.el-col-lg-offset-9{margin-left:37.5%}.el-col-lg-pull-9{position:relative;right:37.5%}.el-col-lg-push-9{position:relative;left:37.5%}.el-col-lg-10{display:block;max-width:41.6666666667%;flex:0 0 41.6666666667%}.el-col-lg-offset-10{margin-left:41.6666666667%}.el-col-lg-pull-10{position:relative;right:41.6666666667%}.el-col-lg-push-10{position:relative;left:41.6666666667%}.el-col-lg-11{display:block;max-width:45.8333333333%;flex:0 0 45.8333333333%}.el-col-lg-offset-11{margin-left:45.8333333333%}.el-col-lg-pull-11{position:relative;right:45.8333333333%}.el-col-lg-push-11{position:relative;left:45.8333333333%}.el-col-lg-12{display:block;max-width:50%;flex:0 0 50%}.el-col-lg-offset-12{margin-left:50%}.el-col-lg-pull-12{position:relative;right:50%}.el-col-lg-push-12{position:relative;left:50%}.el-col-lg-13{display:block;max-width:54.1666666667%;flex:0 0 54.1666666667%}.el-col-lg-offset-13{margin-left:54.1666666667%}.el-col-lg-pull-13{position:relative;right:54.1666666667%}.el-col-lg-push-13{position:relative;left:54.1666666667%}.el-col-lg-14{display:block;max-width:58.3333333333%;flex:0 0 58.3333333333%}.el-col-lg-offset-14{margin-left:58.3333333333%}.el-col-lg-pull-14{position:relative;right:58.3333333333%}.el-col-lg-push-14{position:relative;left:58.3333333333%}.el-col-lg-15{display:block;max-width:62.5%;flex:0 0 62.5%}.el-col-lg-offset-15{margin-left:62.5%}.el-col-lg-pull-15{position:relative;right:62.5%}.el-col-lg-push-15{position:relative;left:62.5%}.el-col-lg-16{display:block;max-width:66.6666666667%;flex:0 0 66.6666666667%}.el-col-lg-offset-16{margin-left:66.6666666667%}.el-col-lg-pull-16{position:relative;right:66.6666666667%}.el-col-lg-push-16{position:relative;left:66.6666666667%}.el-col-lg-17{display:block;max-width:70.8333333333%;flex:0 0 70.8333333333%}.el-col-lg-offset-17{margin-left:70.8333333333%}.el-col-lg-pull-17{position:relative;right:70.8333333333%}.el-col-lg-push-17{position:relative;left:70.8333333333%}.el-col-lg-18{display:block;max-width:75%;flex:0 0 75%}.el-col-lg-offset-18{margin-left:75%}.el-col-lg-pull-18{position:relative;right:75%}.el-col-lg-push-18{position:relative;left:75%}.el-col-lg-19{display:block;max-width:79.1666666667%;flex:0 0 79.1666666667%}.el-col-lg-offset-19{margin-left:79.1666666667%}.el-col-lg-pull-19{position:relative;right:79.1666666667%}.el-col-lg-push-19{position:relative;left:79.1666666667%}.el-col-lg-20{display:block;max-width:83.3333333333%;flex:0 0 83.3333333333%}.el-col-lg-offset-20{margin-left:83.3333333333%}.el-col-lg-pull-20{position:relative;right:83.3333333333%}.el-col-lg-push-20{position:relative;left:83.3333333333%}.el-col-lg-21{display:block;max-width:87.5%;flex:0 0 87.5%}.el-col-lg-offset-21{margin-left:87.5%}.el-col-lg-pull-21{position:relative;right:87.5%}.el-col-lg-push-21{position:relative;left:87.5%}.el-col-lg-22{display:block;max-width:91.6666666667%;flex:0 0 91.6666666667%}.el-col-lg-offset-22{margin-left:91.6666666667%}.el-col-lg-pull-22{position:relative;right:91.6666666667%}.el-col-lg-push-22{position:relative;left:91.6666666667%}.el-col-lg-23{display:block;max-width:95.8333333333%;flex:0 0 95.8333333333%}.el-col-lg-offset-23{margin-left:95.8333333333%}.el-col-lg-pull-23{position:relative;right:95.8333333333%}.el-col-lg-push-23{position:relative;left:95.8333333333%}.el-col-lg-24{display:block;max-width:100%;flex:0 0 100%}.el-col-lg-offset-24{margin-left:100%}.el-col-lg-pull-24{position:relative;right:100%}.el-col-lg-push-24{position:relative;left:100%}}@media only screen and (min-width:1920px){.el-col-xl-0{display:none}.el-col-xl-0.is-guttered{display:none}.el-col-xl-0{max-width:0%;flex:0 0 0%}.el-col-xl-offset-0{margin-left:0}.el-col-xl-pull-0{position:relative;right:0}.el-col-xl-push-0{position:relative;left:0}.el-col-xl-1{display:block;max-width:4.1666666667%;flex:0 0 4.1666666667%}.el-col-xl-offset-1{margin-left:4.1666666667%}.el-col-xl-pull-1{position:relative;right:4.1666666667%}.el-col-xl-push-1{position:relative;left:4.1666666667%}.el-col-xl-2{display:block;max-width:8.3333333333%;flex:0 0 8.3333333333%}.el-col-xl-offset-2{margin-left:8.3333333333%}.el-col-xl-pull-2{position:relative;right:8.3333333333%}.el-col-xl-push-2{position:relative;left:8.3333333333%}.el-col-xl-3{display:block;max-width:12.5%;flex:0 0 12.5%}.el-col-xl-offset-3{margin-left:12.5%}.el-col-xl-pull-3{position:relative;right:12.5%}.el-col-xl-push-3{position:relative;left:12.5%}.el-col-xl-4{display:block;max-width:16.6666666667%;flex:0 0 16.6666666667%}.el-col-xl-offset-4{margin-left:16.6666666667%}.el-col-xl-pull-4{position:relative;right:16.6666666667%}.el-col-xl-push-4{position:relative;left:16.6666666667%}.el-col-xl-5{display:block;max-width:20.8333333333%;flex:0 0 20.8333333333%}.el-col-xl-offset-5{margin-left:20.8333333333%}.el-col-xl-pull-5{position:relative;right:20.8333333333%}.el-col-xl-push-5{position:relative;left:20.8333333333%}.el-col-xl-6{display:block;max-width:25%;flex:0 0 25%}.el-col-xl-offset-6{margin-left:25%}.el-col-xl-pull-6{position:relative;right:25%}.el-col-xl-push-6{position:relative;left:25%}.el-col-xl-7{display:block;max-width:29.1666666667%;flex:0 0 29.1666666667%}.el-col-xl-offset-7{margin-left:29.1666666667%}.el-col-xl-pull-7{position:relative;right:29.1666666667%}.el-col-xl-push-7{position:relative;left:29.1666666667%}.el-col-xl-8{display:block;max-width:33.3333333333%;flex:0 0 33.3333333333%}.el-col-xl-offset-8{margin-left:33.3333333333%}.el-col-xl-pull-8{position:relative;right:33.3333333333%}.el-col-xl-push-8{position:relative;left:33.3333333333%}.el-col-xl-9{display:block;max-width:37.5%;flex:0 0 37.5%}.el-col-xl-offset-9{margin-left:37.5%}.el-col-xl-pull-9{position:relative;right:37.5%}.el-col-xl-push-9{position:relative;left:37.5%}.el-col-xl-10{display:block;max-width:41.6666666667%;flex:0 0 41.6666666667%}.el-col-xl-offset-10{margin-left:41.6666666667%}.el-col-xl-pull-10{position:relative;right:41.6666666667%}.el-col-xl-push-10{position:relative;left:41.6666666667%}.el-col-xl-11{display:block;max-width:45.8333333333%;flex:0 0 45.8333333333%}.el-col-xl-offset-11{margin-left:45.8333333333%}.el-col-xl-pull-11{position:relative;right:45.8333333333%}.el-col-xl-push-11{position:relative;left:45.8333333333%}.el-col-xl-12{display:block;max-width:50%;flex:0 0 50%}.el-col-xl-offset-12{margin-left:50%}.el-col-xl-pull-12{position:relative;right:50%}.el-col-xl-push-12{position:relative;left:50%}.el-col-xl-13{display:block;max-width:54.1666666667%;flex:0 0 54.1666666667%}.el-col-xl-offset-13{margin-left:54.1666666667%}.el-col-xl-pull-13{position:relative;right:54.1666666667%}.el-col-xl-push-13{position:relative;left:54.1666666667%}.el-col-xl-14{display:block;max-width:58.3333333333%;flex:0 0 58.3333333333%}.el-col-xl-offset-14{margin-left:58.3333333333%}.el-col-xl-pull-14{position:relative;right:58.3333333333%}.el-col-xl-push-14{position:relative;left:58.3333333333%}.el-col-xl-15{display:block;max-width:62.5%;flex:0 0 62.5%}.el-col-xl-offset-15{margin-left:62.5%}.el-col-xl-pull-15{position:relative;right:62.5%}.el-col-xl-push-15{position:relative;left:62.5%}.el-col-xl-16{display:block;max-width:66.6666666667%;flex:0 0 66.6666666667%}.el-col-xl-offset-16{margin-left:66.6666666667%}.el-col-xl-pull-16{position:relative;right:66.6666666667%}.el-col-xl-push-16{position:relative;left:66.6666666667%}.el-col-xl-17{display:block;max-width:70.8333333333%;flex:0 0 70.8333333333%}.el-col-xl-offset-17{margin-left:70.8333333333%}.el-col-xl-pull-17{position:relative;right:70.8333333333%}.el-col-xl-push-17{position:relative;left:70.8333333333%}.el-col-xl-18{display:block;max-width:75%;flex:0 0 75%}.el-col-xl-offset-18{margin-left:75%}.el-col-xl-pull-18{position:relative;right:75%}.el-col-xl-push-18{position:relative;left:75%}.el-col-xl-19{display:block;max-width:79.1666666667%;flex:0 0 79.1666666667%}.el-col-xl-offset-19{margin-left:79.1666666667%}.el-col-xl-pull-19{position:relative;right:79.1666666667%}.el-col-xl-push-19{position:relative;left:79.1666666667%}.el-col-xl-20{display:block;max-width:83.3333333333%;flex:0 0 83.3333333333%}.el-col-xl-offset-20{margin-left:83.3333333333%}.el-col-xl-pull-20{position:relative;right:83.3333333333%}.el-col-xl-push-20{position:relative;left:83.3333333333%}.el-col-xl-21{display:block;max-width:87.5%;flex:0 0 87.5%}.el-col-xl-offset-21{margin-left:87.5%}.el-col-xl-pull-21{position:relative;right:87.5%}.el-col-xl-push-21{position:relative;left:87.5%}.el-col-xl-22{display:block;max-width:91.6666666667%;flex:0 0 91.6666666667%}.el-col-xl-offset-22{margin-left:91.6666666667%}.el-col-xl-pull-22{position:relative;right:91.6666666667%}.el-col-xl-push-22{position:relative;left:91.6666666667%}.el-col-xl-23{display:block;max-width:95.8333333333%;flex:0 0 95.8333333333%}.el-col-xl-offset-23{margin-left:95.8333333333%}.el-col-xl-pull-23{position:relative;right:95.8333333333%}.el-col-xl-push-23{position:relative;left:95.8333333333%}.el-col-xl-24{display:block;max-width:100%;flex:0 0 100%}.el-col-xl-offset-24{margin-left:100%}.el-col-xl-pull-24{position:relative;right:100%}.el-col-xl-push-24{position:relative;left:100%}}.el-collapse{--el-collapse-border-color:var(--el-border-color-lighter);--el-collapse-header-height:48px;--el-collapse-header-bg-color:var(--el-fill-color-blank);--el-collapse-header-text-color:var(--el-text-color-primary);--el-collapse-header-font-size:13px;--el-collapse-content-bg-color:var(--el-fill-color-blank);--el-collapse-content-font-size:13px;--el-collapse-content-text-color:var(--el-text-color-primary);border-top:1px solid var(--el-collapse-border-color);border-bottom:1px solid var(--el-collapse-border-color)}.el-collapse-item.is-disabled .el-collapse-item__header{color:var(--el-text-color-disabled);cursor:not-allowed}.el-collapse-item__header{display:flex;align-items:center;height:var(--el-collapse-header-height);line-height:var(--el-collapse-header-height);background-color:var(--el-collapse-header-bg-color);color:var(--el-collapse-header-text-color);cursor:pointer;border-bottom:1px solid var(--el-collapse-border-color);font-size:var(--el-collapse-header-font-size);font-weight:500;transition:border-bottom-color var(--el-transition-duration);outline:0}.el-collapse-item__arrow{margin:0 8px 0 auto;transition:transform var(--el-transition-duration);font-weight:300}.el-collapse-item__arrow.is-active{transform:rotate(90deg)}.el-collapse-item__header.focusing:focus:not(:hover){color:var(--el-color-primary)}.el-collapse-item__header.is-active{border-bottom-color:transparent}.el-collapse-item__wrap{will-change:height;background-color:var(--el-collapse-content-bg-color);overflow:hidden;box-sizing:border-box;border-bottom:1px solid var(--el-collapse-border-color)}.el-collapse-item__content{padding-bottom:25px;font-size:var(--el-collapse-content-font-size);color:var(--el-collapse-content-text-color);line-height:1.7692307692}.el-collapse-item:last-child{margin-bottom:-1px}.el-color-predefine{display:flex;font-size:12px;margin-top:8px;width:280px}.el-color-predefine__colors{display:flex;flex:1;flex-wrap:wrap}.el-color-predefine__color-selector{margin:0 0 8px 8px;width:20px;height:20px;border-radius:4px;cursor:pointer}.el-color-predefine__color-selector:nth-child(10n+1){margin-left:0}.el-color-predefine__color-selector.selected{box-shadow:0 0 3px 2px var(--el-color-primary)}.el-color-predefine__color-selector>div{display:flex;height:100%;border-radius:3px}.el-color-predefine__color-selector.is-alpha{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==)}.el-color-hue-slider{position:relative;box-sizing:border-box;width:280px;height:12px;background-color:red;padding:0 2px;float:right}.el-color-hue-slider__bar{position:relative;background:linear-gradient(to right,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%);height:100%}.el-color-hue-slider__thumb{position:absolute;cursor:pointer;box-sizing:border-box;left:0;top:0;width:4px;height:100%;border-radius:1px;background:#fff;border:1px solid var(--el-border-color-lighter);box-shadow:0 0 2px rgba(0,0,0,.6);z-index:1}.el-color-hue-slider.is-vertical{width:12px;height:180px;padding:2px 0}.el-color-hue-slider.is-vertical .el-color-hue-slider__bar{background:linear-gradient(to bottom,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}.el-color-hue-slider.is-vertical .el-color-hue-slider__thumb{left:0;top:0;width:100%;height:4px}.el-color-svpanel{position:relative;width:280px;height:180px}.el-color-svpanel__black,.el-color-svpanel__white{position:absolute;top:0;left:0;right:0;bottom:0}.el-color-svpanel__white{background:linear-gradient(to right,#fff,rgba(255,255,255,0))}.el-color-svpanel__black{background:linear-gradient(to top,#000,rgba(0,0,0,0))}.el-color-svpanel__cursor{position:absolute}.el-color-svpanel__cursor>div{cursor:head;width:4px;height:4px;box-shadow:0 0 0 1.5px #fff,inset 0 0 1px 1px rgba(0,0,0,.3),0 0 1px 2px rgba(0,0,0,.4);border-radius:50%;transform:translate(-2px,-2px)}.el-color-alpha-slider{position:relative;box-sizing:border-box;width:280px;height:12px;background-image:linear-gradient(45deg,var(--el-color-picker-alpha-bg-a) 25%,var(--el-color-picker-alpha-bg-b) 25%),linear-gradient(135deg,var(--el-color-picker-alpha-bg-a) 25%,var(--el-color-picker-alpha-bg-b) 25%),linear-gradient(45deg,var(--el-color-picker-alpha-bg-b) 75%,var(--el-color-picker-alpha-bg-a) 75%),linear-gradient(135deg,var(--el-color-picker-alpha-bg-b) 75%,var(--el-color-picker-alpha-bg-a) 75%);background-size:12px 12px;background-position:0 0,6px 0,6px -6px,0 6px}.el-color-alpha-slider__bar{position:relative;background:linear-gradient(to right,rgba(255,255,255,0) 0,var(--el-bg-color) 100%);height:100%}.el-color-alpha-slider__thumb{position:absolute;cursor:pointer;box-sizing:border-box;left:0;top:0;width:4px;height:100%;border-radius:1px;background:#fff;border:1px solid var(--el-border-color-lighter);box-shadow:0 0 2px rgba(0,0,0,.6);z-index:1}.el-color-alpha-slider.is-vertical{width:20px;height:180px}.el-color-alpha-slider.is-vertical .el-color-alpha-slider__bar{background:linear-gradient(to bottom,rgba(255,255,255,0) 0,#fff 100%)}.el-color-alpha-slider.is-vertical .el-color-alpha-slider__thumb{left:0;top:0;width:100%;height:4px}.el-color-dropdown{width:300px}.el-color-dropdown__main-wrapper{margin-bottom:6px}.el-color-dropdown__main-wrapper::after{content:"";display:table;clear:both}.el-color-dropdown__btns{margin-top:12px;text-align:right}.el-color-dropdown__value{float:left;line-height:26px;font-size:12px;color:#000;width:160px}.el-color-picker{display:inline-block;position:relative;line-height:normal;outline:0}.el-color-picker:hover:not(.is-disabled) .el-color-picker__trigger{border:1px solid var(--el-border-color-hover)}.el-color-picker:focus-visible:not(.is-disabled) .el-color-picker__trigger{outline:2px solid var(--el-color-primary);outline-offset:1px}.el-color-picker.is-disabled .el-color-picker__trigger{cursor:not-allowed}.el-color-picker--large{height:40px}.el-color-picker--large .el-color-picker__trigger{height:40px;width:40px}.el-color-picker--large .el-color-picker__mask{height:38px;width:38px}.el-color-picker--small{height:24px}.el-color-picker--small .el-color-picker__trigger{height:24px;width:24px}.el-color-picker--small .el-color-picker__mask{height:22px;width:22px}.el-color-picker--small .el-color-picker__empty,.el-color-picker--small .el-color-picker__icon{transform:scale(.8)}.el-color-picker__mask{height:30px;width:30px;border-radius:4px;position:absolute;top:1px;left:1px;z-index:1;cursor:not-allowed;background-color:rgba(255,255,255,.7)}.el-color-picker__trigger{display:inline-flex;justify-content:center;align-items:center;box-sizing:border-box;height:32px;width:32px;padding:4px;border:1px solid var(--el-border-color);border-radius:4px;font-size:0;position:relative;cursor:pointer}.el-color-picker__color{position:relative;display:block;box-sizing:border-box;border:1px solid var(--el-text-color-secondary);border-radius:var(--el-border-radius-small);width:100%;height:100%;text-align:center}.el-color-picker__color.is-alpha{background-image:linear-gradient(45deg,var(--el-color-picker-alpha-bg-a) 25%,var(--el-color-picker-alpha-bg-b) 25%),linear-gradient(135deg,var(--el-color-picker-alpha-bg-a) 25%,var(--el-color-picker-alpha-bg-b) 25%),linear-gradient(45deg,var(--el-color-picker-alpha-bg-b) 75%,var(--el-color-picker-alpha-bg-a) 75%),linear-gradient(135deg,var(--el-color-picker-alpha-bg-b) 75%,var(--el-color-picker-alpha-bg-a) 75%);background-size:12px 12px;background-position:0 0,6px 0,6px -6px,0 6px}.el-color-picker__color-inner{display:inline-flex;justify-content:center;align-items:center;width:100%;height:100%}.el-color-picker .el-color-picker__empty{font-size:12px;color:var(--el-text-color-secondary)}.el-color-picker .el-color-picker__icon{display:inline-flex;justify-content:center;align-items:center;color:#fff;font-size:12px}.el-color-picker__panel{position:absolute;z-index:10;padding:6px;box-sizing:content-box;background-color:#fff;border-radius:var(--el-border-radius-base);box-shadow:var(--el-box-shadow-light)}.el-color-picker__panel.el-popper{border:1px solid var(--el-border-color-lighter)}.el-color-picker,.el-color-picker__panel{--el-color-picker-alpha-bg-a:#ccc;--el-color-picker-alpha-bg-b:transparent}.dark .el-color-picker,.dark .el-color-picker__panel{--el-color-picker-alpha-bg-a:#333333}.el-container{display:flex;flex-direction:row;flex:1;flex-basis:auto;box-sizing:border-box;min-width:0}.el-container.is-vertical{flex-direction:column}.el-date-table{font-size:12px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.el-date-table.is-week-mode .el-date-table__row:hover .el-date-table-cell{background-color:var(--el-datepicker-inrange-bg-color)}.el-date-table.is-week-mode .el-date-table__row:hover td.available:hover{color:var(--el-datepicker-text-color)}.el-date-table.is-week-mode .el-date-table__row:hover td:first-child .el-date-table-cell{margin-left:5px;border-top-left-radius:15px;border-bottom-left-radius:15px}.el-date-table.is-week-mode .el-date-table__row:hover td:last-child .el-date-table-cell{margin-right:5px;border-top-right-radius:15px;border-bottom-right-radius:15px}.el-date-table.is-week-mode .el-date-table__row.current .el-date-table-cell{background-color:var(--el-datepicker-inrange-bg-color)}.el-date-table td{width:32px;height:30px;padding:4px 0;box-sizing:border-box;text-align:center;cursor:pointer;position:relative}.el-date-table td .el-date-table-cell{height:30px;padding:3px 0;box-sizing:border-box}.el-date-table td .el-date-table-cell .el-date-table-cell__text{width:24px;height:24px;display:block;margin:0 auto;line-height:24px;position:absolute;left:50%;transform:translateX(-50%);border-radius:50%}.el-date-table td.next-month,.el-date-table td.prev-month{color:var(--el-datepicker-off-text-color)}.el-date-table td.today{position:relative}.el-date-table td.today .el-date-table-cell__text{color:var(--el-color-primary);font-weight:700}.el-date-table td.today.end-date .el-date-table-cell__text,.el-date-table td.today.start-date .el-date-table-cell__text{color:#fff}.el-date-table td.available:hover{color:var(--el-datepicker-hover-text-color)}.el-date-table td.in-range .el-date-table-cell{background-color:var(--el-datepicker-inrange-bg-color)}.el-date-table td.in-range .el-date-table-cell:hover{background-color:var(--el-datepicker-inrange-hover-bg-color)}.el-date-table td.current:not(.disabled) .el-date-table-cell__text{color:#fff;background-color:var(--el-datepicker-active-color)}.el-date-table td.current:not(.disabled):focus-visible .el-date-table-cell__text{outline:2px solid var(--el-datepicker-active-color);outline-offset:1px}.el-date-table td.end-date .el-date-table-cell,.el-date-table td.start-date .el-date-table-cell{color:#fff}.el-date-table td.end-date .el-date-table-cell__text,.el-date-table td.start-date .el-date-table-cell__text{background-color:var(--el-datepicker-active-color)}.el-date-table td.start-date .el-date-table-cell{margin-left:5px;border-top-left-radius:15px;border-bottom-left-radius:15px}.el-date-table td.end-date .el-date-table-cell{margin-right:5px;border-top-right-radius:15px;border-bottom-right-radius:15px}.el-date-table td.disabled .el-date-table-cell{background-color:var(--el-fill-color-light);opacity:1;cursor:not-allowed;color:var(--el-text-color-placeholder)}.el-date-table td.selected .el-date-table-cell{margin-left:5px;margin-right:5px;background-color:var(--el-datepicker-inrange-bg-color);border-radius:15px}.el-date-table td.selected .el-date-table-cell:hover{background-color:var(--el-datepicker-inrange-hover-bg-color)}.el-date-table td.selected .el-date-table-cell__text{background-color:var(--el-datepicker-active-color);color:#fff;border-radius:15px}.el-date-table td.week{font-size:80%;color:var(--el-datepicker-header-text-color)}.el-date-table td:focus{outline:0}.el-date-table th{padding:5px;color:var(--el-datepicker-header-text-color);font-weight:400;border-bottom:solid 1px var(--el-border-color-lighter)}.el-month-table{font-size:12px;margin:-1px;border-collapse:collapse}.el-month-table td{text-align:center;padding:8px 0;cursor:pointer}.el-month-table td div{height:48px;padding:6px 0;box-sizing:border-box}.el-month-table td.today .cell{color:var(--el-color-primary);font-weight:700}.el-month-table td.today.end-date .cell,.el-month-table td.today.start-date .cell{color:#fff}.el-month-table td.disabled .cell{background-color:var(--el-fill-color-light);cursor:not-allowed;color:var(--el-text-color-placeholder)}.el-month-table td.disabled .cell:hover{color:var(--el-text-color-placeholder)}.el-month-table td .cell{width:60px;height:36px;display:block;line-height:36px;color:var(--el-datepicker-text-color);margin:0 auto;border-radius:18px}.el-month-table td .cell:hover{color:var(--el-datepicker-hover-text-color)}.el-month-table td.in-range div{background-color:var(--el-datepicker-inrange-bg-color)}.el-month-table td.in-range div:hover{background-color:var(--el-datepicker-inrange-hover-bg-color)}.el-month-table td.end-date div,.el-month-table td.start-date div{color:#fff}.el-month-table td.end-date .cell,.el-month-table td.start-date .cell{color:#fff;background-color:var(--el-datepicker-active-color)}.el-month-table td.start-date div{border-top-left-radius:24px;border-bottom-left-radius:24px}.el-month-table td.end-date div{border-top-right-radius:24px;border-bottom-right-radius:24px}.el-month-table td.current:not(.disabled) .cell{color:var(--el-datepicker-active-color)}.el-month-table td:focus-visible{outline:0}.el-month-table td:focus-visible .cell{outline:2px solid var(--el-datepicker-active-color)}.el-year-table{font-size:12px;margin:-1px;border-collapse:collapse}.el-year-table .el-icon{color:var(--el-datepicker-icon-color)}.el-year-table td{text-align:center;padding:20px 3px;cursor:pointer}.el-year-table td.today .cell{color:var(--el-color-primary);font-weight:700}.el-year-table td.disabled .cell{background-color:var(--el-fill-color-light);cursor:not-allowed;color:var(--el-text-color-placeholder)}.el-year-table td.disabled .cell:hover{color:var(--el-text-color-placeholder)}.el-year-table td .cell{width:48px;height:36px;display:block;line-height:36px;color:var(--el-datepicker-text-color);border-radius:18px;margin:0 auto}.el-year-table td .cell:hover{color:var(--el-datepicker-hover-text-color)}.el-year-table td.current:not(.disabled) .cell{color:var(--el-datepicker-active-color)}.el-year-table td:focus-visible{outline:0}.el-year-table td:focus-visible .cell{outline:2px solid var(--el-datepicker-active-color)}.el-time-spinner.has-seconds .el-time-spinner__wrapper{width:33.3%}.el-time-spinner__wrapper{max-height:192px;overflow:auto;display:inline-block;width:50%;vertical-align:top;position:relative}.el-time-spinner__wrapper.el-scrollbar__wrap:not(.el-scrollbar__wrap--hidden-default){padding-bottom:15px}.el-time-spinner__wrapper.is-arrow{box-sizing:border-box;text-align:center;overflow:hidden}.el-time-spinner__wrapper.is-arrow .el-time-spinner__list{transform:translateY(-32px)}.el-time-spinner__wrapper.is-arrow .el-time-spinner__item:hover:not(.is-disabled):not(.is-active){background:var(--el-fill-color-light);cursor:default}.el-time-spinner__arrow{font-size:12px;color:var(--el-text-color-secondary);position:absolute;left:0;width:100%;z-index:var(--el-index-normal);text-align:center;height:30px;line-height:30px;cursor:pointer}.el-time-spinner__arrow:hover{color:var(--el-color-primary)}.el-time-spinner__arrow.arrow-up{top:10px}.el-time-spinner__arrow.arrow-down{bottom:10px}.el-time-spinner__input.el-input{width:70%}.el-time-spinner__input.el-input .el-input__inner{padding:0;text-align:center}.el-time-spinner__list{padding:0;margin:0;list-style:none;text-align:center}.el-time-spinner__list::after,.el-time-spinner__list::before{content:"";display:block;width:100%;height:80px}.el-time-spinner__item{height:32px;line-height:32px;font-size:12px;color:var(--el-text-color-regular)}.el-time-spinner__item:hover:not(.is-disabled):not(.is-active){background:var(--el-fill-color-light);cursor:pointer}.el-time-spinner__item.is-active:not(.is-disabled){color:var(--el-text-color-primary);font-weight:700}.el-time-spinner__item.is-disabled{color:var(--el-text-color-placeholder);cursor:not-allowed}.el-picker__popper{--el-datepicker-border-color:var(--el-disabled-border-color)}.el-picker__popper.el-popper{background:var(--el-bg-color-overlay);border:1px solid var(--el-datepicker-border-color);box-shadow:var(--el-box-shadow-light)}.el-picker__popper.el-popper .el-popper__arrow::before{border:1px solid var(--el-datepicker-border-color)}.el-picker__popper.el-popper[data-popper-placement^=top] .el-popper__arrow::before{border-top-color:transparent;border-left-color:transparent}.el-picker__popper.el-popper[data-popper-placement^=bottom] .el-popper__arrow::before{border-bottom-color:transparent;border-right-color:transparent}.el-picker__popper.el-popper[data-popper-placement^=left] .el-popper__arrow::before{border-left-color:transparent;border-bottom-color:transparent}.el-picker__popper.el-popper[data-popper-placement^=right] .el-popper__arrow::before{border-right-color:transparent;border-top-color:transparent}.el-date-editor{--el-date-editor-width:220px;--el-date-editor-monthrange-width:300px;--el-date-editor-daterange-width:350px;--el-date-editor-datetimerange-width:400px;--el-input-text-color:var(--el-text-color-regular);--el-input-border:var(--el-border);--el-input-hover-border:var(--el-border-color-hover);--el-input-focus-border:var(--el-color-primary);--el-input-transparent-border:0 0 0 1px transparent inset;--el-input-border-color:var(--el-border-color);--el-input-border-radius:var(--el-border-radius-base);--el-input-bg-color:var(--el-fill-color-blank);--el-input-icon-color:var(--el-text-color-placeholder);--el-input-placeholder-color:var(--el-text-color-placeholder);--el-input-hover-border-color:var(--el-border-color-hover);--el-input-clear-hover-color:var(--el-text-color-secondary);--el-input-focus-border-color:var(--el-color-primary);position:relative;display:inline-block;text-align:left}.el-date-editor.el-input__wrapper{box-shadow:0 0 0 1px var(--el-input-border-color,var(--el-border-color)) inset}.el-date-editor.el-input__wrapper:hover{box-shadow:0 0 0 1px var(--el-input-hover-border-color) inset}.el-date-editor.el-input,.el-date-editor.el-input__wrapper{width:var(--el-date-editor-width);height:var(--el-input-height,var(--el-component-size))}.el-date-editor--monthrange{--el-date-editor-width:var(--el-date-editor-monthrange-width)}.el-date-editor--daterange,.el-date-editor--timerange{--el-date-editor-width:var(--el-date-editor-daterange-width)}.el-date-editor--datetimerange{--el-date-editor-width:var(--el-date-editor-datetimerange-width)}.el-date-editor--dates .el-input__wrapper{text-overflow:ellipsis;white-space:nowrap}.el-date-editor .close-icon{cursor:pointer}.el-date-editor .clear-icon{cursor:pointer}.el-date-editor .clear-icon:hover{color:var(--el-text-color-secondary)}.el-date-editor .el-range__icon{height:inherit;font-size:14px;color:var(--el-text-color-placeholder);float:left}.el-date-editor .el-range__icon svg{vertical-align:middle}.el-date-editor .el-range-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;outline:0;display:inline-block;height:30px;line-height:30px;margin:0;padding:0;width:39%;text-align:center;font-size:var(--el-font-size-base);color:var(--el-text-color-regular);background-color:transparent}.el-date-editor .el-range-input::-moz-placeholder{color:var(--el-text-color-placeholder)}.el-date-editor .el-range-input:-ms-input-placeholder{color:var(--el-text-color-placeholder)}.el-date-editor .el-range-input::placeholder{color:var(--el-text-color-placeholder)}.el-date-editor .el-range-separator{flex:1;display:inline-flex;justify-content:center;align-items:center;height:100%;padding:0 5px;margin:0;font-size:14px;word-break:keep-all;color:var(--el-text-color-primary)}.el-date-editor .el-range__close-icon{font-size:14px;color:var(--el-text-color-placeholder);height:inherit;width:unset;cursor:pointer}.el-date-editor .el-range__close-icon:hover{color:var(--el-text-color-secondary)}.el-date-editor .el-range__close-icon svg{vertical-align:middle}.el-date-editor .el-range__close-icon--hidden{opacity:0;visibility:hidden}.el-range-editor.el-input__wrapper{display:inline-flex;align-items:center;padding:0 10px}.el-range-editor.is-active{box-shadow:0 0 0 1px var(--el-input-focus-border-color) inset}.el-range-editor.is-active:hover{box-shadow:0 0 0 1px var(--el-input-focus-border-color) inset}.el-range-editor--large{line-height:var(--el-component-size-large)}.el-range-editor--large.el-input__wrapper{height:var(--el-component-size-large)}.el-range-editor--large .el-range-separator{line-height:40px;font-size:14px}.el-range-editor--large .el-range-input{height:38px;line-height:38px;font-size:14px}.el-range-editor--small{line-height:var(--el-component-size-small)}.el-range-editor--small.el-input__wrapper{height:var(--el-component-size-small)}.el-range-editor--small .el-range-separator{line-height:24px;font-size:12px}.el-range-editor--small .el-range-input{height:22px;line-height:22px;font-size:12px}.el-range-editor.is-disabled{background-color:var(--el-disabled-bg-color);border-color:var(--el-disabled-border-color);color:var(--el-disabled-text-color);cursor:not-allowed}.el-range-editor.is-disabled:focus,.el-range-editor.is-disabled:hover{border-color:var(--el-disabled-border-color)}.el-range-editor.is-disabled input{background-color:var(--el-disabled-bg-color);color:var(--el-disabled-text-color);cursor:not-allowed}.el-range-editor.is-disabled input::-moz-placeholder{color:var(--el-text-color-placeholder)}.el-range-editor.is-disabled input:-ms-input-placeholder{color:var(--el-text-color-placeholder)}.el-range-editor.is-disabled input::placeholder{color:var(--el-text-color-placeholder)}.el-range-editor.is-disabled .el-range-separator{color:var(--el-disabled-text-color)}.el-picker-panel{color:var(--el-text-color-regular);background:var(--el-bg-color-overlay);border-radius:var(--el-border-radius-base);line-height:30px}.el-picker-panel .el-time-panel{margin:5px 0;border:solid 1px var(--el-datepicker-border-color);background-color:var(--el-bg-color-overlay);box-shadow:var(--el-box-shadow-light)}.el-picker-panel__body-wrapper::after,.el-picker-panel__body::after{content:"";display:table;clear:both}.el-picker-panel__content{position:relative;margin:15px}.el-picker-panel__footer{border-top:1px solid var(--el-datepicker-inner-border-color);padding:4px 12px;text-align:right;background-color:var(--el-bg-color-overlay);position:relative;font-size:0}.el-picker-panel__shortcut{display:block;width:100%;border:0;background-color:transparent;line-height:28px;font-size:14px;color:var(--el-datepicker-text-color);padding-left:12px;text-align:left;outline:0;cursor:pointer}.el-picker-panel__shortcut:hover{color:var(--el-datepicker-hover-text-color)}.el-picker-panel__shortcut.active{background-color:#e6f1fe;color:var(--el-datepicker-active-color)}.el-picker-panel__btn{border:1px solid var(--el-fill-color-darker);color:var(--el-text-color-primary);line-height:24px;border-radius:2px;padding:0 20px;cursor:pointer;background-color:transparent;outline:0;font-size:12px}.el-picker-panel__btn[disabled]{color:var(--el-text-color-disabled);cursor:not-allowed}.el-picker-panel__icon-btn{font-size:12px;color:var(--el-datepicker-icon-color);border:0;background:0 0;cursor:pointer;outline:0;margin-top:8px}.el-picker-panel__icon-btn:hover{color:var(--el-datepicker-hover-text-color)}.el-picker-panel__icon-btn:focus-visible{color:var(--el-datepicker-hover-text-color)}.el-picker-panel__icon-btn.is-disabled{color:var(--el-text-color-disabled)}.el-picker-panel__icon-btn.is-disabled:hover{cursor:not-allowed}.el-picker-panel__icon-btn .el-icon{cursor:pointer;font-size:inherit}.el-picker-panel__link-btn{vertical-align:middle}.el-picker-panel [slot=sidebar],.el-picker-panel__sidebar{position:absolute;top:0;bottom:0;width:110px;border-right:1px solid var(--el-datepicker-inner-border-color);box-sizing:border-box;padding-top:6px;background-color:var(--el-bg-color-overlay);overflow:auto}.el-picker-panel [slot=sidebar]+.el-picker-panel__body,.el-picker-panel__sidebar+.el-picker-panel__body{margin-left:110px}.el-date-picker{--el-datepicker-text-color:var(--el-text-color-regular);--el-datepicker-off-text-color:var(--el-text-color-placeholder);--el-datepicker-header-text-color:var(--el-text-color-regular);--el-datepicker-icon-color:var(--el-text-color-primary);--el-datepicker-border-color:var(--el-disabled-border-color);--el-datepicker-inner-border-color:var(--el-border-color-light);--el-datepicker-inrange-bg-color:var(--el-border-color-extra-light);--el-datepicker-inrange-hover-bg-color:var(--el-border-color-extra-light);--el-datepicker-active-color:var(--el-color-primary);--el-datepicker-hover-text-color:var(--el-color-primary)}.el-date-picker{width:322px}.el-date-picker.has-sidebar.has-time{width:434px}.el-date-picker.has-sidebar{width:438px}.el-date-picker.has-time .el-picker-panel__body-wrapper{position:relative}.el-date-picker .el-picker-panel__content{width:292px}.el-date-picker table{table-layout:fixed;width:100%}.el-date-picker__editor-wrap{position:relative;display:table-cell;padding:0 5px}.el-date-picker__time-header{position:relative;border-bottom:1px solid var(--el-datepicker-inner-border-color);font-size:12px;padding:8px 5px 5px;display:table;width:100%;box-sizing:border-box}.el-date-picker__header{margin:12px;text-align:center}.el-date-picker__header--bordered{margin-bottom:0;padding-bottom:12px;border-bottom:solid 1px var(--el-border-color-lighter)}.el-date-picker__header--bordered+.el-picker-panel__content{margin-top:0}.el-date-picker__header-label{font-size:16px;font-weight:500;padding:0 5px;line-height:22px;text-align:center;cursor:pointer;color:var(--el-text-color-regular)}.el-date-picker__header-label:hover{color:var(--el-datepicker-hover-text-color)}.el-date-picker__header-label:focus-visible{outline:0;color:var(--el-datepicker-hover-text-color)}.el-date-picker__header-label.active{color:var(--el-datepicker-active-color)}.el-date-picker__prev-btn{float:left}.el-date-picker__next-btn{float:right}.el-date-picker__time-wrap{padding:10px;text-align:center}.el-date-picker__time-label{float:left;cursor:pointer;line-height:30px;margin-left:10px}.el-date-picker .el-time-panel{position:absolute}.el-date-range-picker{--el-datepicker-text-color:var(--el-text-color-regular);--el-datepicker-off-text-color:var(--el-text-color-placeholder);--el-datepicker-header-text-color:var(--el-text-color-regular);--el-datepicker-icon-color:var(--el-text-color-primary);--el-datepicker-border-color:var(--el-disabled-border-color);--el-datepicker-inner-border-color:var(--el-border-color-light);--el-datepicker-inrange-bg-color:var(--el-border-color-extra-light);--el-datepicker-inrange-hover-bg-color:var(--el-border-color-extra-light);--el-datepicker-active-color:var(--el-color-primary);--el-datepicker-hover-text-color:var(--el-color-primary)}.el-date-range-picker{width:646px}.el-date-range-picker.has-sidebar{width:756px}.el-date-range-picker.has-time .el-picker-panel__body-wrapper{position:relative}.el-date-range-picker table{table-layout:fixed;width:100%}.el-date-range-picker .el-picker-panel__body{min-width:513px}.el-date-range-picker .el-picker-panel__content{margin:0}.el-date-range-picker__header{position:relative;text-align:center;height:28px}.el-date-range-picker__header [class*=arrow-left]{float:left}.el-date-range-picker__header [class*=arrow-right]{float:right}.el-date-range-picker__header div{font-size:16px;font-weight:500;margin-right:50px}.el-date-range-picker__content{float:left;width:50%;box-sizing:border-box;margin:0;padding:16px}.el-date-range-picker__content.is-left{border-right:1px solid var(--el-datepicker-inner-border-color)}.el-date-range-picker__content .el-date-range-picker__header div{margin-left:50px;margin-right:50px}.el-date-range-picker__editors-wrap{box-sizing:border-box;display:table-cell}.el-date-range-picker__editors-wrap.is-right{text-align:right}.el-date-range-picker__time-header{position:relative;border-bottom:1px solid var(--el-datepicker-inner-border-color);font-size:12px;padding:8px 5px 5px 5px;display:table;width:100%;box-sizing:border-box}.el-date-range-picker__time-header>.el-icon-arrow-right{font-size:20px;vertical-align:middle;display:table-cell;color:var(--el-datepicker-icon-color)}.el-date-range-picker__time-picker-wrap{position:relative;display:table-cell;padding:0 5px}.el-date-range-picker__time-picker-wrap .el-picker-panel{position:absolute;top:13px;right:0;z-index:1;background:#fff}.el-date-range-picker__time-picker-wrap .el-time-panel{position:absolute}.el-time-range-picker{width:354px;overflow:visible}.el-time-range-picker__content{position:relative;text-align:center;padding:10px;z-index:1}.el-time-range-picker__cell{box-sizing:border-box;margin:0;padding:4px 7px 7px;width:50%;display:inline-block}.el-time-range-picker__header{margin-bottom:5px;text-align:center;font-size:14px}.el-time-range-picker__body{border-radius:2px;border:1px solid var(--el-datepicker-border-color)}.el-time-panel{border-radius:2px;position:relative;width:180px;left:0;z-index:var(--el-index-top);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;box-sizing:content-box}.el-time-panel__content{font-size:0;position:relative;overflow:hidden}.el-time-panel__content::after,.el-time-panel__content::before{content:"";top:50%;position:absolute;margin-top:-16px;height:32px;z-index:-1;left:0;right:0;box-sizing:border-box;padding-top:6px;text-align:left}.el-time-panel__content::after{left:50%;margin-left:12%;margin-right:12%}.el-time-panel__content::before{padding-left:50%;margin-right:12%;margin-left:12%;border-top:1px solid var(--el-border-color-light);border-bottom:1px solid var(--el-border-color-light)}.el-time-panel__content.has-seconds::after{left:66.6666666667%}.el-time-panel__content.has-seconds::before{padding-left:33.3333333333%}.el-time-panel__footer{border-top:1px solid var(--el-timepicker-inner-border-color,var(--el-border-color-light));padding:4px;height:36px;line-height:25px;text-align:right;box-sizing:border-box}.el-time-panel__btn{border:none;line-height:28px;padding:0 5px;margin:0 5px;cursor:pointer;background-color:transparent;outline:0;font-size:12px;color:var(--el-text-color-primary)}.el-time-panel__btn.confirm{font-weight:800;color:var(--el-timepicker-active-color,var(--el-color-primary))}.el-descriptions{--el-descriptions-table-border:1px solid var(--el-border-color-lighter);--el-descriptions-item-bordered-label-background:var(--el-fill-color-light);box-sizing:border-box;font-size:var(--el-font-size-base);color:var(--el-text-color-primary)}.el-descriptions__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.el-descriptions__title{color:var(--el-text-color-primary);font-size:16px;font-weight:700}.el-descriptions__body{background-color:var(--el-fill-color-blank)}.el-descriptions__body .el-descriptions__table{border-collapse:collapse;width:100%}.el-descriptions__body .el-descriptions__table .el-descriptions__cell{box-sizing:border-box;text-align:left;font-weight:400;line-height:23px;font-size:14px}.el-descriptions__body .el-descriptions__table .el-descriptions__cell.is-left{text-align:left}.el-descriptions__body .el-descriptions__table .el-descriptions__cell.is-center{text-align:center}.el-descriptions__body .el-descriptions__table .el-descriptions__cell.is-right{text-align:right}.el-descriptions__body .el-descriptions__table.is-bordered .el-descriptions__cell{border:var(--el-descriptions-table-border);padding:8px 11px}.el-descriptions__body .el-descriptions__table:not(.is-bordered) .el-descriptions__cell{padding-bottom:12px}.el-descriptions--large{font-size:14px}.el-descriptions--large .el-descriptions__header{margin-bottom:20px}.el-descriptions--large .el-descriptions__header .el-descriptions__title{font-size:16px}.el-descriptions--large .el-descriptions__body .el-descriptions__table .el-descriptions__cell{font-size:14px}.el-descriptions--large .el-descriptions__body .el-descriptions__table.is-bordered .el-descriptions__cell{padding:12px 15px}.el-descriptions--large .el-descriptions__body .el-descriptions__table:not(.is-bordered) .el-descriptions__cell{padding-bottom:16px}.el-descriptions--small{font-size:12px}.el-descriptions--small .el-descriptions__header{margin-bottom:12px}.el-descriptions--small .el-descriptions__header .el-descriptions__title{font-size:14px}.el-descriptions--small .el-descriptions__body .el-descriptions__table .el-descriptions__cell{font-size:12px}.el-descriptions--small .el-descriptions__body .el-descriptions__table.is-bordered .el-descriptions__cell{padding:4px 7px}.el-descriptions--small .el-descriptions__body .el-descriptions__table:not(.is-bordered) .el-descriptions__cell{padding-bottom:8px}.el-descriptions__label.el-descriptions__cell.is-bordered-label{font-weight:700;color:var(--el-text-color-regular);background:var(--el-descriptions-item-bordered-label-background)}.el-descriptions__label:not(.is-bordered-label){color:var(--el-text-color-primary);margin-right:16px}.el-descriptions__label.el-descriptions__cell:not(.is-bordered-label).is-vertical-label{padding-bottom:6px}.el-descriptions__content.el-descriptions__cell.is-bordered-content{color:var(--el-text-color-primary)}.el-descriptions__content:not(.is-bordered-label){color:var(--el-text-color-regular)}.el-descriptions--large .el-descriptions__label:not(.is-bordered-label){margin-right:16px}.el-descriptions--large .el-descriptions__label.el-descriptions__cell:not(.is-bordered-label).is-vertical-label{padding-bottom:8px}.el-descriptions--small .el-descriptions__label:not(.is-bordered-label){margin-right:12px}.el-descriptions--small .el-descriptions__label.el-descriptions__cell:not(.is-bordered-label).is-vertical-label{padding-bottom:4px}:root{--el-popup-modal-bg-color:var(--el-color-black);--el-popup-modal-opacity:0.5}.v-modal-enter{-webkit-animation:v-modal-in var(--el-transition-duration-fast) ease;animation:v-modal-in var(--el-transition-duration-fast) ease}.v-modal-leave{-webkit-animation:v-modal-out var(--el-transition-duration-fast) ease forwards;animation:v-modal-out var(--el-transition-duration-fast) ease forwards}@-webkit-keyframes v-modal-in{0%{opacity:0}}@keyframes v-modal-in{0%{opacity:0}}@-webkit-keyframes v-modal-out{100%{opacity:0}}@keyframes v-modal-out{100%{opacity:0}}.v-modal{position:fixed;left:0;top:0;width:100%;height:100%;opacity:var(--el-popup-modal-opacity);background:var(--el-popup-modal-bg-color)}.el-popup-parent--hidden{overflow:hidden}.el-dialog{--el-dialog-width:50%;--el-dialog-margin-top:15vh;--el-dialog-bg-color:var(--el-bg-color);--el-dialog-box-shadow:var(--el-box-shadow);--el-dialog-title-font-size:var(--el-font-size-large);--el-dialog-content-font-size:14px;--el-dialog-font-line-height:var(--el-font-line-height-primary);--el-dialog-padding-primary:20px;--el-dialog-border-radius:var(--el-border-radius-small);position:relative;margin:var(--el-dialog-margin-top,15vh) auto 50px;background:var(--el-dialog-bg-color);border-radius:var(--el-dialog-border-radius);box-shadow:var(--el-dialog-box-shadow);box-sizing:border-box;width:var(--el-dialog-width,50%)}.el-dialog:focus{outline:0!important}.el-dialog.is-align-center{margin:auto}.el-dialog.is-fullscreen{--el-dialog-width:100%;--el-dialog-margin-top:0;margin-bottom:0;height:100%;overflow:auto}.el-dialog__wrapper{position:fixed;top:0;right:0;bottom:0;left:0;overflow:auto;margin:0}.el-dialog.is-draggable .el-dialog__header{cursor:move;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.el-dialog__header{padding:var(--el-dialog-padding-primary);padding-bottom:10px;margin-right:16px}.el-dialog__headerbtn{position:absolute;top:6px;right:0;padding:0;width:54px;height:54px;background:0 0;border:none;outline:0;cursor:pointer;font-size:var(--el-message-close-size,16px)}.el-dialog__headerbtn .el-dialog__close{color:var(--el-color-info);font-size:inherit}.el-dialog__headerbtn:focus .el-dialog__close,.el-dialog__headerbtn:hover .el-dialog__close{color:var(--el-color-primary)}.el-dialog__title{line-height:var(--el-dialog-font-line-height);font-size:var(--el-dialog-title-font-size);color:var(--el-text-color-primary)}.el-dialog__body{padding:calc(var(--el-dialog-padding-primary) + 10px) var(--el-dialog-padding-primary);color:var(--el-text-color-regular);font-size:var(--el-dialog-content-font-size)}.el-dialog__footer{padding:var(--el-dialog-padding-primary);padding-top:10px;text-align:right;box-sizing:border-box}.el-dialog--center{text-align:center}.el-dialog--center .el-dialog__body{text-align:initial;padding:25px calc(var(--el-dialog-padding-primary) + 5px) 30px}.el-dialog--center .el-dialog__footer{text-align:inherit}.el-overlay-dialog{position:fixed;top:0;right:0;bottom:0;left:0;overflow:auto}.dialog-fade-enter-active{-webkit-animation:modal-fade-in var(--el-transition-duration);animation:modal-fade-in var(--el-transition-duration)}.dialog-fade-enter-active .el-overlay-dialog{-webkit-animation:dialog-fade-in var(--el-transition-duration);animation:dialog-fade-in var(--el-transition-duration)}.dialog-fade-leave-active{-webkit-animation:modal-fade-out var(--el-transition-duration);animation:modal-fade-out var(--el-transition-duration)}.dialog-fade-leave-active .el-overlay-dialog{-webkit-animation:dialog-fade-out var(--el-transition-duration);animation:dialog-fade-out var(--el-transition-duration)}@-webkit-keyframes dialog-fade-in{0%{transform:translate3d(0,-20px,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes dialog-fade-in{0%{transform:translate3d(0,-20px,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@-webkit-keyframes dialog-fade-out{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,-20px,0);opacity:0}}@keyframes dialog-fade-out{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,-20px,0);opacity:0}}@-webkit-keyframes modal-fade-in{0%{opacity:0}100%{opacity:1}}@keyframes modal-fade-in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes modal-fade-out{0%{opacity:1}100%{opacity:0}}@keyframes modal-fade-out{0%{opacity:1}100%{opacity:0}}.el-divider{position:relative}.el-divider--horizontal{display:block;height:1px;width:100%;margin:24px 0;border-top:1px var(--el-border-color) var(--el-border-style)}.el-divider--vertical{display:inline-block;width:1px;height:1em;margin:0 8px;vertical-align:middle;position:relative;border-left:1px var(--el-border-color) var(--el-border-style)}.el-divider__text{position:absolute;background-color:var(--el-bg-color);padding:0 20px;font-weight:500;color:var(--el-text-color-primary);font-size:14px}.el-divider__text.is-left{left:20px;transform:translateY(-50%)}.el-divider__text.is-center{left:50%;transform:translateX(-50%) translateY(-50%)}.el-divider__text.is-right{right:20px;transform:translateY(-50%)}.el-drawer{--el-drawer-bg-color:var(--el-dialog-bg-color, var(--el-bg-color));--el-drawer-padding-primary:var(--el-dialog-padding-primary, 20px)}.el-drawer{position:absolute;box-sizing:border-box;background-color:var(--el-drawer-bg-color);display:flex;flex-direction:column;box-shadow:var(--el-box-shadow-dark);overflow:hidden;transition:all var(--el-transition-duration)}.el-drawer .rtl{transform:translate(0,0)}.el-drawer .ltr{transform:translate(0,0)}.el-drawer .ttb{transform:translate(0,0)}.el-drawer .btt{transform:translate(0,0)}.el-drawer__sr-focus:focus{outline:0!important}.el-drawer__header{align-items:center;color:#72767b;display:flex;margin-bottom:32px;padding:var(--el-drawer-padding-primary);padding-bottom:0}.el-drawer__header>:first-child{flex:1}.el-drawer__title{margin:0;flex:1;line-height:inherit;font-size:1rem}.el-drawer__footer{padding:var(--el-drawer-padding-primary);padding-top:10px;text-align:right}.el-drawer__close-btn{display:inline-flex;border:none;cursor:pointer;font-size:var(--el-font-size-extra-large);color:inherit;background-color:transparent;outline:0}.el-drawer__close-btn:focus i,.el-drawer__close-btn:hover i{color:var(--el-color-primary)}.el-drawer__body{flex:1;padding:var(--el-drawer-padding-primary);overflow:auto}.el-drawer__body>*{box-sizing:border-box}.el-drawer.ltr,.el-drawer.rtl{height:100%;top:0;bottom:0}.el-drawer.btt,.el-drawer.ttb{width:100%;left:0;right:0}.el-drawer.ltr{left:0}.el-drawer.rtl{right:0}.el-drawer.ttb{top:0}.el-drawer.btt{bottom:0}.el-drawer-fade-enter-active,.el-drawer-fade-leave-active{transition:all var(--el-transition-duration)}.el-drawer-fade-enter-active,.el-drawer-fade-enter-from,.el-drawer-fade-enter-to,.el-drawer-fade-leave-active,.el-drawer-fade-leave-from,.el-drawer-fade-leave-to{overflow:hidden!important}.el-drawer-fade-enter-from,.el-drawer-fade-leave-to{opacity:0}.el-drawer-fade-enter-to,.el-drawer-fade-leave-from{opacity:1}.el-drawer-fade-enter-from .rtl,.el-drawer-fade-leave-to .rtl{transform:translateX(100%)}.el-drawer-fade-enter-from .ltr,.el-drawer-fade-leave-to .ltr{transform:translateX(-100%)}.el-drawer-fade-enter-from .ttb,.el-drawer-fade-leave-to .ttb{transform:translateY(-100%)}.el-drawer-fade-enter-from .btt,.el-drawer-fade-leave-to .btt{transform:translateY(100%)}.el-dropdown{--el-dropdown-menu-box-shadow:var(--el-box-shadow-light);--el-dropdown-menuItem-hover-fill:var(--el-color-primary-light-9);--el-dropdown-menuItem-hover-color:var(--el-color-primary);--el-dropdown-menu-index:10;display:inline-flex;position:relative;color:var(--el-text-color-regular);font-size:var(--el-font-size-base);line-height:1;vertical-align:top}.el-dropdown.is-disabled{color:var(--el-text-color-placeholder);cursor:not-allowed}.el-dropdown__popper{--el-dropdown-menu-box-shadow:var(--el-box-shadow-light);--el-dropdown-menuItem-hover-fill:var(--el-color-primary-light-9);--el-dropdown-menuItem-hover-color:var(--el-color-primary);--el-dropdown-menu-index:10}.el-dropdown__popper.el-popper{background:var(--el-bg-color-overlay);border:1px solid var(--el-border-color-light);box-shadow:var(--el-dropdown-menu-box-shadow)}.el-dropdown__popper.el-popper .el-popper__arrow::before{border:1px solid var(--el-border-color-light)}.el-dropdown__popper.el-popper[data-popper-placement^=top] .el-popper__arrow::before{border-top-color:transparent;border-left-color:transparent}.el-dropdown__popper.el-popper[data-popper-placement^=bottom] .el-popper__arrow::before{border-bottom-color:transparent;border-right-color:transparent}.el-dropdown__popper.el-popper[data-popper-placement^=left] .el-popper__arrow::before{border-left-color:transparent;border-bottom-color:transparent}.el-dropdown__popper.el-popper[data-popper-placement^=right] .el-popper__arrow::before{border-right-color:transparent;border-top-color:transparent}.el-dropdown__popper .el-dropdown-menu{border:none}.el-dropdown__popper .el-dropdown__popper-selfdefine{outline:0}.el-dropdown__popper .el-scrollbar__bar{z-index:calc(var(--el-dropdown-menu-index) + 1)}.el-dropdown__popper .el-dropdown__list{list-style:none;padding:0;margin:0;box-sizing:border-box}.el-dropdown .el-dropdown__caret-button{padding-left:0;padding-right:0;display:inline-flex;justify-content:center;align-items:center;width:32px;border-left:none}.el-dropdown .el-dropdown__caret-button>span{display:inline-flex}.el-dropdown .el-dropdown__caret-button::before{content:"";position:absolute;display:block;width:1px;top:-1px;bottom:-1px;left:0;background:var(--el-overlay-color-lighter)}.el-dropdown .el-dropdown__caret-button.el-button::before{background:var(--el-border-color);opacity:.5}.el-dropdown .el-dropdown__caret-button .el-dropdown__icon{font-size:inherit;padding-left:0}.el-dropdown .el-dropdown-selfdefine{outline:0}.el-dropdown--large .el-dropdown__caret-button{width:40px}.el-dropdown--small .el-dropdown__caret-button{width:24px}.el-dropdown-menu{position:relative;top:0;left:0;z-index:var(--el-dropdown-menu-index);padding:5px 0;margin:0;background-color:var(--el-bg-color-overlay);border:none;border-radius:var(--el-border-radius-base);box-shadow:none;list-style:none}.el-dropdown-menu__item{display:flex;align-items:center;white-space:nowrap;list-style:none;line-height:22px;padding:5px 16px;margin:0;font-size:var(--el-font-size-base);color:var(--el-text-color-regular);cursor:pointer;outline:0}.el-dropdown-menu__item:not(.is-disabled):focus{background-color:var(--el-dropdown-menuItem-hover-fill);color:var(--el-dropdown-menuItem-hover-color)}.el-dropdown-menu__item i{margin-right:5px}.el-dropdown-menu__item--divided{margin:6px 0;border-top:1px solid var(--el-border-color-lighter)}.el-dropdown-menu__item.is-disabled{cursor:not-allowed;color:var(--el-text-color-disabled)}.el-dropdown-menu--large{padding:7px 0}.el-dropdown-menu--large .el-dropdown-menu__item{padding:7px 20px;line-height:22px;font-size:14px}.el-dropdown-menu--large .el-dropdown-menu__item--divided{margin:8px 0}.el-dropdown-menu--small{padding:3px 0}.el-dropdown-menu--small .el-dropdown-menu__item{padding:2px 12px;line-height:20px;font-size:12px}.el-dropdown-menu--small .el-dropdown-menu__item--divided{margin:4px 0}.el-empty{--el-empty-padding:40px 0;--el-empty-image-width:160px;--el-empty-description-margin-top:20px;--el-empty-bottom-margin-top:20px;--el-empty-fill-color-0:var(--el-color-white);--el-empty-fill-color-1:#fcfcfd;--el-empty-fill-color-2:#f8f9fb;--el-empty-fill-color-3:#f7f8fc;--el-empty-fill-color-4:#eeeff3;--el-empty-fill-color-5:#edeef2;--el-empty-fill-color-6:#e9ebef;--el-empty-fill-color-7:#e5e7e9;--el-empty-fill-color-8:#e0e3e9;--el-empty-fill-color-9:#d5d7de;display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;box-sizing:border-box;padding:var(--el-empty-padding)}.el-empty__image{width:var(--el-empty-image-width)}.el-empty__image img{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%;height:100%;vertical-align:top;-o-object-fit:contain;object-fit:contain}.el-empty__image svg{color:var(--el-svg-monochrome-grey);fill:currentColor;width:100%;height:100%;vertical-align:top}.el-empty__description{margin-top:var(--el-empty-description-margin-top)}.el-empty__description p{margin:0;font-size:var(--el-font-size-base);color:var(--el-text-color-secondary)}.el-empty__bottom{margin-top:var(--el-empty-bottom-margin-top)}.el-footer{--el-footer-padding:0 20px;--el-footer-height:60px;padding:var(--el-footer-padding);box-sizing:border-box;flex-shrink:0;height:var(--el-footer-height)}.el-form{--el-form-label-font-size:var(--el-font-size-base)}.el-form--label-left .el-form-item__label{justify-content:flex-start}.el-form--label-top .el-form-item{display:block}.el-form--label-top .el-form-item .el-form-item__label{display:block;height:auto;text-align:left;margin-bottom:8px;line-height:22px}.el-form--inline .el-form-item{display:inline-flex;vertical-align:middle;margin-right:32px}.el-form--inline.el-form--label-top{display:flex;flex-wrap:wrap}.el-form--inline.el-form--label-top .el-form-item{display:block}.el-form--large.el-form--label-top .el-form-item .el-form-item__label{margin-bottom:12px;line-height:22px}.el-form--default.el-form--label-top .el-form-item .el-form-item__label{margin-bottom:8px;line-height:22px}.el-form--small.el-form--label-top .el-form-item .el-form-item__label{margin-bottom:4px;line-height:20px}.el-form-item{display:flex;--font-size:14px;margin-bottom:18px}.el-form-item .el-form-item{margin-bottom:0}.el-form-item .el-input__validateIcon{display:none}.el-form-item--large{--font-size:14px;--el-form-label-font-size:var(--font-size);margin-bottom:22px}.el-form-item--large .el-form-item__label{height:40px;line-height:40px}.el-form-item--large .el-form-item__content{line-height:40px}.el-form-item--large .el-form-item__error{padding-top:4px}.el-form-item--default{--font-size:14px;--el-form-label-font-size:var(--font-size);margin-bottom:18px}.el-form-item--default .el-form-item__label{height:32px;line-height:32px}.el-form-item--default .el-form-item__content{line-height:32px}.el-form-item--default .el-form-item__error{padding-top:2px}.el-form-item--small{--font-size:12px;--el-form-label-font-size:var(--font-size);margin-bottom:18px}.el-form-item--small .el-form-item__label{height:24px;line-height:24px}.el-form-item--small .el-form-item__content{line-height:24px}.el-form-item--small .el-form-item__error{padding-top:2px}.el-form-item__label-wrap{display:flex}.el-form-item__label{display:inline-flex;justify-content:flex-end;align-items:flex-start;flex:0 0 auto;font-size:var(--el-form-label-font-size);color:var(--el-text-color-regular);height:32px;line-height:32px;padding:0 12px 0 0;box-sizing:border-box}.el-form-item__content{display:flex;flex-wrap:wrap;align-items:center;flex:1;line-height:32px;position:relative;font-size:var(--font-size);min-width:0}.el-form-item__content .el-input-group{vertical-align:top}.el-form-item__error{color:var(--el-color-danger);font-size:12px;line-height:1;padding-top:2px;position:absolute;top:100%;left:0}.el-form-item__error--inline{position:relative;top:auto;left:auto;display:inline-block;margin-left:10px}.el-form-item.is-required:not(.is-no-asterisk).asterisk-left>.el-form-item__label-wrap>.el-form-item__label:before,.el-form-item.is-required:not(.is-no-asterisk).asterisk-left>.el-form-item__label:before{content:"*";color:var(--el-color-danger);margin-right:4px}.el-form-item.is-required:not(.is-no-asterisk).asterisk-right>.el-form-item__label-wrap>.el-form-item__label:after,.el-form-item.is-required:not(.is-no-asterisk).asterisk-right>.el-form-item__label:after{content:"*";color:var(--el-color-danger);margin-left:4px}.el-form-item.is-error .el-select-v2__wrapper,.el-form-item.is-error .el-select-v2__wrapper:focus,.el-form-item.is-error .el-textarea__inner,.el-form-item.is-error .el-textarea__inner:focus{box-shadow:0 0 0 1px var(--el-color-danger) inset}.el-form-item.is-error .el-input__wrapper{box-shadow:0 0 0 1px var(--el-color-danger) inset}.el-form-item.is-error .el-input-group__append .el-input__wrapper,.el-form-item.is-error .el-input-group__prepend .el-input__wrapper{box-shadow:0 0 0 1px transparent inset}.el-form-item.is-error .el-input__validateIcon{color:var(--el-color-danger)}.el-form-item--feedback .el-input__validateIcon{display:inline-flex}.el-header{--el-header-padding:0 20px;--el-header-height:60px;padding:var(--el-header-padding);box-sizing:border-box;flex-shrink:0;height:var(--el-header-height)}.el-image-viewer__wrapper{position:fixed;top:0;right:0;bottom:0;left:0}.el-image-viewer__btn{position:absolute;z-index:1;display:flex;align-items:center;justify-content:center;border-radius:50%;opacity:.8;cursor:pointer;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.el-image-viewer__btn .el-icon{font-size:inherit;cursor:pointer}.el-image-viewer__close{top:40px;right:40px;width:40px;height:40px;font-size:40px}.el-image-viewer__canvas{position:static;width:100%;height:100%;display:flex;justify-content:center;align-items:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.el-image-viewer__actions{left:50%;bottom:30px;transform:translateX(-50%);width:282px;height:44px;padding:0 23px;background-color:var(--el-text-color-regular);border-color:#fff;border-radius:22px}.el-image-viewer__actions__inner{width:100%;height:100%;text-align:justify;cursor:default;font-size:23px;color:#fff;display:flex;align-items:center;justify-content:space-around}.el-image-viewer__prev{top:50%;transform:translateY(-50%);left:40px;width:44px;height:44px;font-size:24px;color:#fff;background-color:var(--el-text-color-regular);border-color:#fff}.el-image-viewer__next{top:50%;transform:translateY(-50%);right:40px;text-indent:2px;width:44px;height:44px;font-size:24px;color:#fff;background-color:var(--el-text-color-regular);border-color:#fff}.el-image-viewer__close{width:44px;height:44px;font-size:24px;color:#fff;background-color:var(--el-text-color-regular);border-color:#fff}.el-image-viewer__mask{position:absolute;width:100%;height:100%;top:0;left:0;opacity:.5;background:#000}.viewer-fade-enter-active{-webkit-animation:viewer-fade-in var(--el-transition-duration);animation:viewer-fade-in var(--el-transition-duration)}.viewer-fade-leave-active{-webkit-animation:viewer-fade-out var(--el-transition-duration);animation:viewer-fade-out var(--el-transition-duration)}@-webkit-keyframes viewer-fade-in{0%{transform:translate3d(0,-20px,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes viewer-fade-in{0%{transform:translate3d(0,-20px,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@-webkit-keyframes viewer-fade-out{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,-20px,0);opacity:0}}@keyframes viewer-fade-out{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,-20px,0);opacity:0}}.el-image__error,.el-image__inner,.el-image__placeholder,.el-image__wrapper{width:100%;height:100%}.el-image{position:relative;display:inline-block;overflow:hidden}.el-image__inner{vertical-align:top;opacity:1}.el-image__inner.is-loading{opacity:0}.el-image__wrapper{position:absolute;top:0;left:0}.el-image__placeholder{background:var(--el-fill-color-light)}.el-image__error{display:flex;justify-content:center;align-items:center;font-size:14px;background:var(--el-fill-color-light);color:var(--el-text-color-placeholder);vertical-align:middle}.el-image__preview{cursor:pointer}.el-input-number{position:relative;display:inline-flex;width:150px;line-height:30px}.el-input-number .el-input__wrapper{padding-left:42px;padding-right:42px}.el-input-number .el-input__inner{-webkit-appearance:none;-moz-appearance:textfield;text-align:center;line-height:1}.el-input-number .el-input__inner::-webkit-inner-spin-button,.el-input-number .el-input__inner::-webkit-outer-spin-button{margin:0;-webkit-appearance:none}.el-input-number__decrease,.el-input-number__increase{display:flex;justify-content:center;align-items:center;height:auto;position:absolute;z-index:1;top:1px;bottom:1px;width:32px;background:var(--el-fill-color-light);color:var(--el-text-color-regular);cursor:pointer;font-size:13px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.el-input-number__decrease:hover,.el-input-number__increase:hover{color:var(--el-color-primary)}.el-input-number__decrease:hover~.el-input:not(.is-disabled) .el-input_wrapper,.el-input-number__increase:hover~.el-input:not(.is-disabled) .el-input_wrapper{box-shadow:0 0 0 1px var(--el-input-focus-border-color,var(--el-color-primary)) inset}.el-input-number__decrease.is-disabled,.el-input-number__increase.is-disabled{color:var(--el-disabled-text-color);cursor:not-allowed}.el-input-number__increase{right:1px;border-radius:0 var(--el-border-radius-base) var(--el-border-radius-base) 0;border-left:var(--el-border)}.el-input-number__decrease{left:1px;border-radius:var(--el-border-radius-base) 0 0 var(--el-border-radius-base);border-right:var(--el-border)}.el-input-number.is-disabled .el-input-number__decrease,.el-input-number.is-disabled .el-input-number__increase{border-color:var(--el-disabled-border-color);color:var(--el-disabled-border-color)}.el-input-number.is-disabled .el-input-number__decrease:hover,.el-input-number.is-disabled .el-input-number__increase:hover{color:var(--el-disabled-border-color);cursor:not-allowed}.el-input-number--large{width:180px;line-height:38px}.el-input-number--large .el-input-number__decrease,.el-input-number--large .el-input-number__increase{width:40px;font-size:14px}.el-input-number--large .el-input__wrapper{padding-left:47px;padding-right:47px}.el-input-number--small{width:120px;line-height:22px}.el-input-number--small .el-input-number__decrease,.el-input-number--small .el-input-number__increase{width:24px;font-size:12px}.el-input-number--small .el-input__wrapper{padding-left:31px;padding-right:31px}.el-input-number--small .el-input-number__decrease [class*=el-icon],.el-input-number--small .el-input-number__increase [class*=el-icon]{transform:scale(.9)}.el-input-number.is-without-controls .el-input__wrapper{padding-left:15px;padding-right:15px}.el-input-number.is-controls-right .el-input__wrapper{padding-left:15px;padding-right:42px}.el-input-number.is-controls-right .el-input-number__decrease,.el-input-number.is-controls-right .el-input-number__increase{--el-input-number-controls-height:15px;height:var(--el-input-number-controls-height);line-height:var(--el-input-number-controls-height)}.el-input-number.is-controls-right .el-input-number__decrease [class*=el-icon],.el-input-number.is-controls-right .el-input-number__increase [class*=el-icon]{transform:scale(.8)}.el-input-number.is-controls-right .el-input-number__increase{bottom:auto;left:auto;border-radius:0 var(--el-border-radius-base) 0 0;border-bottom:var(--el-border)}.el-input-number.is-controls-right .el-input-number__decrease{right:1px;top:auto;left:auto;border-right:none;border-left:var(--el-border);border-radius:0 0 var(--el-border-radius-base) 0}.el-input-number.is-controls-right[class*=large] [class*=decrease],.el-input-number.is-controls-right[class*=large] [class*=increase]{--el-input-number-controls-height:19px}.el-input-number.is-controls-right[class*=small] [class*=decrease],.el-input-number.is-controls-right[class*=small] [class*=increase]{--el-input-number-controls-height:11px}.el-textarea{--el-input-text-color:var(--el-text-color-regular);--el-input-border:var(--el-border);--el-input-hover-border:var(--el-border-color-hover);--el-input-focus-border:var(--el-color-primary);--el-input-transparent-border:0 0 0 1px transparent inset;--el-input-border-color:var(--el-border-color);--el-input-border-radius:var(--el-border-radius-base);--el-input-bg-color:var(--el-fill-color-blank);--el-input-icon-color:var(--el-text-color-placeholder);--el-input-placeholder-color:var(--el-text-color-placeholder);--el-input-hover-border-color:var(--el-border-color-hover);--el-input-clear-hover-color:var(--el-text-color-secondary);--el-input-focus-border-color:var(--el-color-primary)}.el-textarea{position:relative;display:inline-block;width:100%;vertical-align:bottom;font-size:var(--el-font-size-base)}.el-textarea__inner{position:relative;display:block;resize:vertical;padding:5px 11px;line-height:1.5;box-sizing:border-box;width:100%;font-size:inherit;font-family:inherit;color:var(--el-input-text-color,var(--el-text-color-regular));background-color:var(--el-input-bg-color,var(--el-fill-color-blank));background-image:none;-webkit-appearance:none;box-shadow:0 0 0 1px var(--el-input-border-color,var(--el-border-color)) inset;border-radius:var(--el-input-border-radius,var(--el-border-radius-base));transition:var(--el-transition-box-shadow);border:none}.el-textarea__inner::-moz-placeholder{color:var(--el-input-placeholder-color,var(--el-text-color-placeholder))}.el-textarea__inner:-ms-input-placeholder{color:var(--el-input-placeholder-color,var(--el-text-color-placeholder))}.el-textarea__inner::placeholder{color:var(--el-input-placeholder-color,var(--el-text-color-placeholder))}.el-textarea__inner:hover{box-shadow:0 0 0 1px var(--el-input-hover-border-color) inset}.el-textarea__inner:focus{outline:0;box-shadow:0 0 0 1px var(--el-input-focus-border-color) inset}.el-textarea .el-input__count{color:var(--el-color-info);background:var(--el-fill-color-blank);position:absolute;font-size:12px;line-height:14px;bottom:5px;right:10px}.el-textarea.is-disabled .el-textarea__inner{background-color:var(--el-disabled-bg-color);border-color:var(--el-disabled-border-color);color:var(--el-disabled-text-color);cursor:not-allowed}.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder{color:var(--el-text-color-placeholder)}.el-textarea.is-disabled .el-textarea__inner:-ms-input-placeholder{color:var(--el-text-color-placeholder)}.el-textarea.is-disabled .el-textarea__inner::placeholder{color:var(--el-text-color-placeholder)}.el-textarea.is-exceed .el-textarea__inner{box-shadow:0 0 0 1px var(--el-color-danger) inset}.el-textarea.is-exceed .el-input__count{color:var(--el-color-danger)}.el-input{--el-input-text-color:var(--el-text-color-regular);--el-input-border:var(--el-border);--el-input-hover-border:var(--el-border-color-hover);--el-input-focus-border:var(--el-color-primary);--el-input-transparent-border:0 0 0 1px transparent inset;--el-input-border-color:var(--el-border-color);--el-input-border-radius:var(--el-border-radius-base);--el-input-bg-color:var(--el-fill-color-blank);--el-input-icon-color:var(--el-text-color-placeholder);--el-input-placeholder-color:var(--el-text-color-placeholder);--el-input-hover-border-color:var(--el-border-color-hover);--el-input-clear-hover-color:var(--el-text-color-secondary);--el-input-focus-border-color:var(--el-color-primary)}.el-input{--el-input-height:var(--el-component-size);position:relative;font-size:var(--el-font-size-base);display:inline-flex;width:100%;line-height:var(--el-input-height);box-sizing:border-box;vertical-align:middle}.el-input::-webkit-scrollbar{z-index:11;width:6px}.el-input::-webkit-scrollbar:horizontal{height:6px}.el-input::-webkit-scrollbar-thumb{border-radius:5px;width:6px;background:var(--el-text-color-disabled)}.el-input::-webkit-scrollbar-corner{background:var(--el-fill-color-blank)}.el-input::-webkit-scrollbar-track{background:var(--el-fill-color-blank)}.el-input::-webkit-scrollbar-track-piece{background:var(--el-fill-color-blank);width:6px}.el-input .el-input__clear,.el-input .el-input__password{color:var(--el-input-icon-color);font-size:14px;cursor:pointer}.el-input .el-input__clear:hover,.el-input .el-input__password:hover{color:var(--el-input-clear-hover-color)}.el-input .el-input__count{height:100%;display:inline-flex;align-items:center;color:var(--el-color-info);font-size:12px}.el-input .el-input__count .el-input__count-inner{background:var(--el-fill-color-blank);line-height:initial;display:inline-block;padding-left:8px}.el-input__wrapper{display:inline-flex;flex-grow:1;align-items:center;justify-content:center;padding:1px 11px;background-color:var(--el-input-bg-color,var(--el-fill-color-blank));background-image:none;border-radius:var(--el-input-border-radius,var(--el-border-radius-base));transition:var(--el-transition-box-shadow);transform:translate3d(0,0,0);box-shadow:0 0 0 1px var(--el-input-border-color,var(--el-border-color)) inset}.el-input__wrapper:hover{box-shadow:0 0 0 1px var(--el-input-hover-border-color) inset}.el-input__wrapper.is-focus{box-shadow:0 0 0 1px var(--el-input-focus-border-color) inset}.el-input__inner{--el-input-inner-height:calc(var(--el-input-height, 32px) - 2px);width:100%;flex-grow:1;-webkit-appearance:none;color:var(--el-input-text-color,var(--el-text-color-regular));font-size:inherit;height:var(--el-input-inner-height);line-height:var(--el-input-inner-height);padding:0;outline:0;border:none;background:0 0;box-sizing:border-box}.el-input__inner:focus{outline:0}.el-input__inner::-moz-placeholder{color:var(--el-input-placeholder-color,var(--el-text-color-placeholder))}.el-input__inner:-ms-input-placeholder{color:var(--el-input-placeholder-color,var(--el-text-color-placeholder))}.el-input__inner::placeholder{color:var(--el-input-placeholder-color,var(--el-text-color-placeholder))}.el-input__inner[type=password]::-ms-reveal{display:none}.el-input__prefix{display:inline-flex;white-space:nowrap;flex-shrink:0;flex-wrap:nowrap;height:100%;text-align:center;color:var(--el-input-icon-color,var(--el-text-color-placeholder));transition:all var(--el-transition-duration);pointer-events:none}.el-input__prefix-inner{pointer-events:all;display:inline-flex;align-items:center;justify-content:center}.el-input__prefix-inner>:last-child{margin-right:8px}.el-input__prefix-inner>:first-child,.el-input__prefix-inner>:first-child.el-input__icon{margin-left:0}.el-input__suffix{display:inline-flex;white-space:nowrap;flex-shrink:0;flex-wrap:nowrap;height:100%;text-align:center;color:var(--el-input-icon-color,var(--el-text-color-placeholder));transition:all var(--el-transition-duration);pointer-events:none}.el-input__suffix-inner{pointer-events:all;display:inline-flex;align-items:center;justify-content:center}.el-input__suffix-inner>:first-child{margin-left:8px}.el-input .el-input__icon{height:inherit;line-height:inherit;display:flex;justify-content:center;align-items:center;transition:all var(--el-transition-duration);margin-left:8px}.el-input__validateIcon{pointer-events:none}.el-input.is-active .el-input__wrapper{box-shadow:0 0 0 1px var(--el-input-focus-color,) inset}.el-input.is-disabled{cursor:not-allowed}.el-input.is-disabled .el-input__wrapper{background-color:var(--el-disabled-bg-color);box-shadow:0 0 0 1px var(--el-disabled-border-color) inset}.el-input.is-disabled .el-input__inner{color:var(--el-disabled-text-color);-webkit-text-fill-color:var(--el-disabled-text-color);cursor:not-allowed}.el-input.is-disabled .el-input__inner::-moz-placeholder{color:var(--el-text-color-placeholder)}.el-input.is-disabled .el-input__inner:-ms-input-placeholder{color:var(--el-text-color-placeholder)}.el-input.is-disabled .el-input__inner::placeholder{color:var(--el-text-color-placeholder)}.el-input.is-disabled .el-input__icon{cursor:not-allowed}.el-input.is-exceed .el-input__wrapper{box-shadow:0 0 0 1px var(--el-color-danger) inset}.el-input.is-exceed .el-input__suffix .el-input__count{color:var(--el-color-danger)}.el-input--large{--el-input-height:var(--el-component-size-large);font-size:14px}.el-input--large .el-input__wrapper{padding:1px 15px}.el-input--large .el-input__inner{--el-input-inner-height:calc(var(--el-input-height, 40px) - 2px)}.el-input--small{--el-input-height:var(--el-component-size-small);font-size:12px}.el-input--small .el-input__wrapper{padding:1px 7px}.el-input--small .el-input__inner{--el-input-inner-height:calc(var(--el-input-height, 24px) - 2px)}.el-input-group{display:inline-flex;width:100%;align-items:stretch}.el-input-group__append,.el-input-group__prepend{background-color:var(--el-fill-color-light);color:var(--el-color-info);position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:100%;border-radius:var(--el-input-border-radius);padding:0 20px;white-space:nowrap}.el-input-group__append:focus,.el-input-group__prepend:focus{outline:0}.el-input-group__append .el-button,.el-input-group__append .el-select,.el-input-group__prepend .el-button,.el-input-group__prepend .el-select{display:inline-block;margin:0 -20px}.el-input-group__append button.el-button,.el-input-group__append button.el-button:hover,.el-input-group__append div.el-select .el-input__wrapper,.el-input-group__append div.el-select:hover .el-input__wrapper,.el-input-group__prepend button.el-button,.el-input-group__prepend button.el-button:hover,.el-input-group__prepend div.el-select .el-input__wrapper,.el-input-group__prepend div.el-select:hover .el-input__wrapper{border-color:transparent;background-color:transparent;color:inherit}.el-input-group__append .el-button,.el-input-group__append .el-input,.el-input-group__prepend .el-button,.el-input-group__prepend .el-input{font-size:inherit}.el-input-group__prepend{border-right:0;border-top-right-radius:0;border-bottom-right-radius:0;box-shadow:1px 0 0 0 var(--el-input-border-color) inset,0 1px 0 0 var(--el-input-border-color) inset,0 -1px 0 0 var(--el-input-border-color) inset}.el-input-group__append{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0;box-shadow:0 1px 0 0 var(--el-input-border-color) inset,0 -1px 0 0 var(--el-input-border-color) inset,-1px 0 0 0 var(--el-input-border-color) inset}.el-input-group--prepend>.el-input__wrapper{border-top-left-radius:0;border-bottom-left-radius:0}.el-input-group--prepend .el-input-group__prepend .el-select .el-input .el-input__inner{box-shadow:none!important}.el-input-group--prepend .el-input-group__prepend .el-select .el-input .el-input__wrapper{border-top-right-radius:0;border-bottom-right-radius:0;box-shadow:1px 0 0 0 var(--el-input-border-color) inset,0 1px 0 0 var(--el-input-border-color) inset,0 -1px 0 0 var(--el-input-border-color) inset}.el-input-group--prepend .el-input-group__prepend .el-select .el-input.is-focus .el-input__inner{box-shadow:none!important}.el-input-group--prepend .el-input-group__prepend .el-select .el-input.is-focus .el-input__wrapper{box-shadow:1px 0 0 0 var(--el-input-focus-border-color) inset,1px 0 0 0 var(--el-input-focus-border-color),0 1px 0 0 var(--el-input-focus-border-color) inset,0 -1px 0 0 var(--el-input-focus-border-color) inset!important;z-index:2}.el-input-group--prepend .el-input-group__prepend .el-select .el-input.is-focus .el-input__wrapper:focus{outline:0;z-index:2;box-shadow:1px 0 0 0 var(--el-input-focus-border-color) inset,1px 0 0 0 var(--el-input-focus-border-color),0 1px 0 0 var(--el-input-focus-border-color) inset,0 -1px 0 0 var(--el-input-focus-border-color) inset!important}.el-input-group--prepend .el-input-group__prepend .el-select:hover .el-input__inner{box-shadow:none!important}.el-input-group--prepend .el-input-group__prepend .el-select:hover .el-input__wrapper{z-index:1;box-shadow:1px 0 0 0 var(--el-input-hover-border-color) inset,1px 0 0 0 var(--el-input-hover-border-color),0 1px 0 0 var(--el-input-hover-border-color) inset,0 -1px 0 0 var(--el-input-hover-border-color) inset!important}.el-input-group--append>.el-input__wrapper{border-top-right-radius:0;border-bottom-right-radius:0}.el-input-group--append .el-input-group__append .el-select .el-input .el-input__inner{box-shadow:none!important}.el-input-group--append .el-input-group__append .el-select .el-input .el-input__wrapper{border-top-left-radius:0;border-bottom-left-radius:0;box-shadow:0 1px 0 0 var(--el-input-border-color) inset,0 -1px 0 0 var(--el-input-border-color) inset,-1px 0 0 0 var(--el-input-border-color) inset}.el-input-group--append .el-input-group__append .el-select .el-input.is-focus .el-input__inner{box-shadow:none!important}.el-input-group--append .el-input-group__append .el-select .el-input.is-focus .el-input__wrapper{z-index:2;box-shadow:-1px 0 0 0 var(--el-input-focus-border-color),-1px 0 0 0 var(--el-input-focus-border-color) inset,0 1px 0 0 var(--el-input-focus-border-color) inset,0 -1px 0 0 var(--el-input-focus-border-color) inset!important}.el-input-group--append .el-input-group__append .el-select:hover .el-input__inner{box-shadow:none!important}.el-input-group--append .el-input-group__append .el-select:hover .el-input__wrapper{z-index:1;box-shadow:-1px 0 0 0 var(--el-input-hover-border-color),-1px 0 0 0 var(--el-input-hover-border-color) inset,0 1px 0 0 var(--el-input-hover-border-color) inset,0 -1px 0 0 var(--el-input-hover-border-color) inset!important}.el-link{--el-link-font-size:var(--el-font-size-base);--el-link-font-weight:var(--el-font-weight-primary);--el-link-text-color:var(--el-text-color-regular);--el-link-hover-text-color:var(--el-color-primary);--el-link-disabled-text-color:var(--el-text-color-placeholder)}.el-link{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;vertical-align:middle;position:relative;text-decoration:none;outline:0;cursor:pointer;padding:0;font-size:var(--el-link-font-size);font-weight:var(--el-link-font-weight);color:var(--el-link-text-color)}.el-link:hover{color:var(--el-link-hover-text-color)}.el-link.is-underline:hover:after{content:"";position:absolute;left:0;right:0;height:0;bottom:0;border-bottom:1px solid var(--el-link-hover-text-color)}.el-link.is-disabled{color:var(--el-link-disabled-text-color);cursor:not-allowed}.el-link [class*=el-icon-]+span{margin-left:5px}.el-link.el-link--default:after{border-color:var(--el-link-hover-text-color)}.el-link__inner{display:inline-flex;justify-content:center;align-items:center}.el-link.el-link--primary{--el-link-text-color:var(--el-color-primary);--el-link-hover-text-color:var(--el-color-primary-light-3);--el-link-disabled-text-color:var(--el-color-primary-light-5)}.el-link.el-link--primary:after{border-color:var(--el-link-text-color)}.el-link.el-link--primary.is-underline:hover:after{border-color:var(--el-link-text-color)}.el-link.el-link--success{--el-link-text-color:var(--el-color-success);--el-link-hover-text-color:var(--el-color-success-light-3);--el-link-disabled-text-color:var(--el-color-success-light-5)}.el-link.el-link--success:after{border-color:var(--el-link-text-color)}.el-link.el-link--success.is-underline:hover:after{border-color:var(--el-link-text-color)}.el-link.el-link--warning{--el-link-text-color:var(--el-color-warning);--el-link-hover-text-color:var(--el-color-warning-light-3);--el-link-disabled-text-color:var(--el-color-warning-light-5)}.el-link.el-link--warning:after{border-color:var(--el-link-text-color)}.el-link.el-link--warning.is-underline:hover:after{border-color:var(--el-link-text-color)}.el-link.el-link--danger{--el-link-text-color:var(--el-color-danger);--el-link-hover-text-color:var(--el-color-danger-light-3);--el-link-disabled-text-color:var(--el-color-danger-light-5)}.el-link.el-link--danger:after{border-color:var(--el-link-text-color)}.el-link.el-link--danger.is-underline:hover:after{border-color:var(--el-link-text-color)}.el-link.el-link--error{--el-link-text-color:var(--el-color-error);--el-link-hover-text-color:var(--el-color-error-light-3);--el-link-disabled-text-color:var(--el-color-error-light-5)}.el-link.el-link--error:after{border-color:var(--el-link-text-color)}.el-link.el-link--error.is-underline:hover:after{border-color:var(--el-link-text-color)}.el-link.el-link--info{--el-link-text-color:var(--el-color-info);--el-link-hover-text-color:var(--el-color-info-light-3);--el-link-disabled-text-color:var(--el-color-info-light-5)}.el-link.el-link--info:after{border-color:var(--el-link-text-color)}.el-link.el-link--info.is-underline:hover:after{border-color:var(--el-link-text-color)}:root{--el-loading-spinner-size:42px;--el-loading-fullscreen-spinner-size:50px}.el-loading-parent--relative{position:relative!important}.el-loading-parent--hidden{overflow:hidden!important}.el-loading-mask{position:absolute;z-index:2000;background-color:var(--el-mask-color);margin:0;top:0;right:0;bottom:0;left:0;transition:opacity var(--el-transition-duration)}.el-loading-mask.is-fullscreen{position:fixed}.el-loading-mask.is-fullscreen .el-loading-spinner{margin-top:calc((0px - var(--el-loading-fullscreen-spinner-size))/ 2)}.el-loading-mask.is-fullscreen .el-loading-spinner .circular{height:var(--el-loading-fullscreen-spinner-size);width:var(--el-loading-fullscreen-spinner-size)}.el-loading-spinner{top:50%;margin-top:calc((0px - var(--el-loading-spinner-size))/ 2);width:100%;text-align:center;position:absolute}.el-loading-spinner .el-loading-text{color:var(--el-color-primary);margin:3px 0;font-size:14px}.el-loading-spinner .circular{display:inline;height:var(--el-loading-spinner-size);width:var(--el-loading-spinner-size);-webkit-animation:loading-rotate 2s linear infinite;animation:loading-rotate 2s linear infinite}.el-loading-spinner .path{-webkit-animation:loading-dash 1.5s ease-in-out infinite;animation:loading-dash 1.5s ease-in-out infinite;stroke-dasharray:90,150;stroke-dashoffset:0;stroke-width:2;stroke:var(--el-color-primary);stroke-linecap:round}.el-loading-spinner i{color:var(--el-color-primary)}.el-loading-fade-enter-from,.el-loading-fade-leave-to{opacity:0}@-webkit-keyframes loading-rotate{100%{transform:rotate(360deg)}}@keyframes loading-rotate{100%{transform:rotate(360deg)}}@-webkit-keyframes loading-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-40px}100%{stroke-dasharray:90,150;stroke-dashoffset:-120px}}@keyframes loading-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-40px}100%{stroke-dasharray:90,150;stroke-dashoffset:-120px}}.el-main{--el-main-padding:20px;display:block;flex:1;flex-basis:auto;overflow:auto;box-sizing:border-box;padding:var(--el-main-padding)}:root{--el-menu-active-color:var(--el-color-primary);--el-menu-text-color:var(--el-text-color-primary);--el-menu-hover-text-color:var(--el-color-primary);--el-menu-bg-color:var(--el-fill-color-blank);--el-menu-hover-bg-color:var(--el-color-primary-light-9);--el-menu-item-height:56px;--el-menu-sub-item-height:calc(var(--el-menu-item-height) - 6px);--el-menu-horizontal-sub-item-height:36px;--el-menu-item-font-size:var(--el-font-size-base);--el-menu-item-hover-fill:var(--el-color-primary-light-9);--el-menu-border-color:var(--el-border-color);--el-menu-base-level-padding:20px;--el-menu-level-padding:20px;--el-menu-icon-width:24px}.el-menu{border-right:solid 1px var(--el-menu-border-color);list-style:none;position:relative;margin:0;padding-left:0;background-color:var(--el-menu-bg-color);box-sizing:border-box}.el-menu--vertical:not(.el-menu--collapse):not(.el-menu--popup-container) .el-menu-item,.el-menu--vertical:not(.el-menu--collapse):not(.el-menu--popup-container) .el-menu-item-group__title,.el-menu--vertical:not(.el-menu--collapse):not(.el-menu--popup-container) .el-sub-menu__title{white-space:nowrap;padding-left:calc(var(--el-menu-base-level-padding) + var(--el-menu-level) * var(--el-menu-level-padding))}.el-menu--horizontal{display:flex;flex-wrap:nowrap;border-bottom:solid 1px var(--el-menu-border-color);border-right:none}.el-menu--horizontal>.el-menu-item{display:inline-flex;justify-content:center;align-items:center;height:100%;margin:0;border-bottom:2px solid transparent;color:var(--el-menu-text-color)}.el-menu--horizontal>.el-menu-item a,.el-menu--horizontal>.el-menu-item a:hover{color:inherit}.el-menu--horizontal>.el-menu-item:not(.is-disabled):focus,.el-menu--horizontal>.el-menu-item:not(.is-disabled):hover{background-color:#fff}.el-menu--horizontal>.el-sub-menu:focus,.el-menu--horizontal>.el-sub-menu:hover{outline:0}.el-menu--horizontal>.el-sub-menu:hover .el-sub-menu__title{color:var(--el-menu-hover-text-color)}.el-menu--horizontal>.el-sub-menu.is-active .el-sub-menu__title{border-bottom:2px solid var(--el-menu-active-color);color:var(--el-menu-active-color)}.el-menu--horizontal>.el-sub-menu .el-sub-menu__title{height:100%;border-bottom:2px solid transparent;color:var(--el-menu-text-color)}.el-menu--horizontal>.el-sub-menu .el-sub-menu__title:hover{background-color:var(--el-bg-color-overlay)}.el-menu--horizontal .el-menu .el-menu-item,.el-menu--horizontal .el-menu .el-sub-menu__title{background-color:var(--el-menu-bg-color);display:flex;align-items:center;height:var(--el-menu-horizontal-sub-item-height);padding:0 10px;color:var(--el-menu-text-color)}.el-menu--horizontal .el-menu .el-sub-menu__title{padding-right:40px}.el-menu--horizontal .el-menu .el-menu-item.is-active,.el-menu--horizontal .el-menu .el-sub-menu.is-active>.el-sub-menu__title{color:var(--el-menu-active-color)}.el-menu--horizontal .el-menu-item:not(.is-disabled):focus,.el-menu--horizontal .el-menu-item:not(.is-disabled):hover{outline:0;color:var(--el-menu-hover-text-color);background-color:var(--el-menu-hover-bg-color)}.el-menu--horizontal>.el-menu-item.is-active{border-bottom:2px solid var(--el-menu-active-color);color:var(--el-menu-active-color)!important}.el-menu--collapse{width:calc(var(--el-menu-icon-width) + var(--el-menu-base-level-padding) * 2)}.el-menu--collapse>.el-menu-item [class^=el-icon],.el-menu--collapse>.el-menu-item-group>ul>.el-sub-menu>.el-sub-menu__title [class^=el-icon],.el-menu--collapse>.el-sub-menu>.el-sub-menu__title [class^=el-icon]{margin:0;vertical-align:middle;width:var(--el-menu-icon-width);text-align:center}.el-menu--collapse>.el-menu-item .el-sub-menu__icon-arrow,.el-menu--collapse>.el-menu-item-group>ul>.el-sub-menu>.el-sub-menu__title .el-sub-menu__icon-arrow,.el-menu--collapse>.el-sub-menu>.el-sub-menu__title .el-sub-menu__icon-arrow{display:none}.el-menu--collapse>.el-menu-item-group>ul>.el-sub-menu>.el-sub-menu__title>span,.el-menu--collapse>.el-menu-item>span,.el-menu--collapse>.el-sub-menu>.el-sub-menu__title>span{height:0;width:0;overflow:hidden;visibility:hidden;display:inline-block}.el-menu--collapse>.el-menu-item.is-active i{color:inherit}.el-menu--collapse .el-menu .el-sub-menu{min-width:200px}.el-menu--popup{z-index:100;min-width:200px;border:none;padding:5px 0;border-radius:var(--el-border-radius-small);box-shadow:var(--el-box-shadow-light)}.el-menu .el-icon{flex-shrink:0}.el-menu-item{display:flex;align-items:center;height:var(--el-menu-item-height);line-height:var(--el-menu-item-height);font-size:var(--el-menu-item-font-size);color:var(--el-menu-text-color);padding:0 var(--el-menu-base-level-padding);list-style:none;cursor:pointer;position:relative;transition:border-color var(--el-transition-duration),background-color var(--el-transition-duration),color var(--el-transition-duration);box-sizing:border-box;white-space:nowrap}.el-menu-item *{vertical-align:bottom}.el-menu-item i{color:inherit}.el-menu-item:focus,.el-menu-item:hover{outline:0}.el-menu-item:hover{background-color:var(--el-menu-hover-bg-color)}.el-menu-item.is-disabled{opacity:.25;cursor:not-allowed;background:0 0!important}.el-menu-item [class^=el-icon]{margin-right:5px;width:var(--el-menu-icon-width);text-align:center;font-size:18px;vertical-align:middle}.el-menu-item.is-active{color:var(--el-menu-active-color)}.el-menu-item.is-active i{color:inherit}.el-menu-item .el-menu-tooltip__trigger{position:absolute;left:0;top:0;height:100%;width:100%;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 var(--el-menu-base-level-padding)}.el-sub-menu{list-style:none;margin:0;padding-left:0}.el-sub-menu__title{display:flex;align-items:center;height:var(--el-menu-item-height);line-height:var(--el-menu-item-height);font-size:var(--el-menu-item-font-size);color:var(--el-menu-text-color);padding:0 var(--el-menu-base-level-padding);list-style:none;cursor:pointer;position:relative;transition:border-color var(--el-transition-duration),background-color var(--el-transition-duration),color var(--el-transition-duration);box-sizing:border-box;white-space:nowrap;padding-right:calc(var(--el-menu-base-level-padding) + var(--el-menu-icon-width))}.el-sub-menu__title *{vertical-align:bottom}.el-sub-menu__title i{color:inherit}.el-sub-menu__title:focus,.el-sub-menu__title:hover{outline:0}.el-sub-menu__title:hover{background-color:var(--el-menu-hover-bg-color)}.el-sub-menu__title.is-disabled{opacity:.25;cursor:not-allowed;background:0 0!important}.el-sub-menu__title:hover{background-color:var(--el-menu-hover-bg-color)}.el-sub-menu .el-menu{border:none}.el-sub-menu .el-menu-item{height:var(--el-menu-sub-item-height);line-height:var(--el-menu-sub-item-height)}.el-sub-menu__hide-arrow .el-sub-menu__icon-arrow{display:none!important}.el-sub-menu.is-active .el-sub-menu__title{border-bottom-color:var(--el-menu-active-color)}.el-sub-menu.is-disabled .el-menu-item,.el-sub-menu.is-disabled .el-sub-menu__title{opacity:.25;cursor:not-allowed;background:0 0!important}.el-sub-menu .el-icon{vertical-align:middle;margin-right:5px;width:var(--el-menu-icon-width);text-align:center;font-size:18px}.el-sub-menu .el-icon.el-sub-menu__icon-more{margin-right:0!important}.el-sub-menu .el-sub-menu__icon-arrow{position:absolute;top:50%;right:var(--el-menu-base-level-padding);margin-top:-6px;transition:transform var(--el-transition-duration);font-size:12px;margin-right:0;width:inherit}.el-menu-item-group>ul{padding:0}.el-menu-item-group__title{padding:7px 0 7px var(--el-menu-base-level-padding);line-height:normal;font-size:12px;color:var(--el-text-color-secondary)}.horizontal-collapse-transition .el-sub-menu__title .el-sub-menu__icon-arrow{transition:var(--el-transition-duration-fast);opacity:0}.el-message-box{--el-messagebox-title-color:var(--el-text-color-primary);--el-messagebox-width:420px;--el-messagebox-border-radius:4px;--el-messagebox-font-size:var(--el-font-size-large);--el-messagebox-content-font-size:var(--el-font-size-base);--el-messagebox-content-color:var(--el-text-color-regular);--el-messagebox-error-font-size:12px;--el-messagebox-padding-primary:15px}.el-message-box{display:inline-block;max-width:var(--el-messagebox-width);width:100%;padding-bottom:10px;vertical-align:middle;background-color:var(--el-bg-color);border-radius:var(--el-messagebox-border-radius);border:1px solid var(--el-border-color-lighter);font-size:var(--el-messagebox-font-size);box-shadow:var(--el-box-shadow-light);text-align:left;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden;box-sizing:border-box}.el-message-box:focus{outline:0!important}.el-overlay.is-message-box .el-overlay-message-box{text-align:center;position:fixed;top:0;right:0;bottom:0;left:0;padding:16px;overflow:auto}.el-overlay.is-message-box .el-overlay-message-box::after{content:"";display:inline-block;height:100%;width:0;vertical-align:middle}.el-message-box.is-draggable .el-message-box__header{cursor:move;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.el-message-box__header{position:relative;padding:var(--el-messagebox-padding-primary);padding-bottom:10px}.el-message-box__title{padding-left:0;margin-bottom:0;font-size:var(--el-messagebox-font-size);line-height:1;color:var(--el-messagebox-title-color)}.el-message-box__headerbtn{position:absolute;top:var(--el-messagebox-padding-primary);right:var(--el-messagebox-padding-primary);padding:0;border:none;outline:0;background:0 0;font-size:var(--el-message-close-size,16px);cursor:pointer}.el-message-box__headerbtn .el-message-box__close{color:var(--el-color-info);font-size:inherit}.el-message-box__headerbtn:focus .el-message-box__close,.el-message-box__headerbtn:hover .el-message-box__close{color:var(--el-color-primary)}.el-message-box__content{padding:10px var(--el-messagebox-padding-primary);color:var(--el-messagebox-content-color);font-size:var(--el-messagebox-content-font-size)}.el-message-box__container{position:relative}.el-message-box__input{padding-top:15px}.el-message-box__input div.invalid>input{border-color:var(--el-color-error)}.el-message-box__input div.invalid>input:focus{border-color:var(--el-color-error)}.el-message-box__status{position:absolute;top:50%;transform:translateY(-50%);font-size:24px!important}.el-message-box__status::before{padding-left:1px}.el-message-box__status.el-icon{position:absolute}.el-message-box__status+.el-message-box__message{padding-left:36px;padding-right:12px;word-break:break-word}.el-message-box__status.el-message-box-icon--success{--el-messagebox-color:var(--el-color-success);color:var(--el-messagebox-color)}.el-message-box__status.el-message-box-icon--info{--el-messagebox-color:var(--el-color-info);color:var(--el-messagebox-color)}.el-message-box__status.el-message-box-icon--warning{--el-messagebox-color:var(--el-color-warning);color:var(--el-messagebox-color)}.el-message-box__status.el-message-box-icon--error{--el-messagebox-color:var(--el-color-error);color:var(--el-messagebox-color)}.el-message-box__message{margin:0}.el-message-box__message p{margin:0;line-height:24px}.el-message-box__errormsg{color:var(--el-color-error);font-size:var(--el-messagebox-error-font-size);min-height:18px;margin-top:2px}.el-message-box__btns{padding:5px 15px 0;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center}.el-message-box__btns button:nth-child(2){margin-left:10px}.el-message-box__btns-reverse{flex-direction:row-reverse}.el-message-box--center .el-message-box__title{position:relative;display:flex;align-items:center;justify-content:center}.el-message-box--center .el-message-box__status{position:relative;top:auto;padding-right:5px;text-align:center;transform:translateY(-1px)}.el-message-box--center .el-message-box__message{margin-left:0}.el-message-box--center .el-message-box__btns{justify-content:center}.el-message-box--center .el-message-box__content{padding-left:calc(var(--el-messagebox-padding-primary) + 12px);padding-right:calc(var(--el-messagebox-padding-primary) + 12px);text-align:center}.fade-in-linear-enter-active .el-overlay-message-box{-webkit-animation:msgbox-fade-in var(--el-transition-duration);animation:msgbox-fade-in var(--el-transition-duration)}.fade-in-linear-leave-active .el-overlay-message-box{animation:msgbox-fade-in var(--el-transition-duration) reverse}@-webkit-keyframes msgbox-fade-in{0%{transform:translate3d(0,-20px,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes msgbox-fade-in{0%{transform:translate3d(0,-20px,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@-webkit-keyframes msgbox-fade-out{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,-20px,0);opacity:0}}@keyframes msgbox-fade-out{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,-20px,0);opacity:0}}.el-message{--el-message-bg-color:var(--el-color-info-light-9);--el-message-border-color:var(--el-border-color-lighter);--el-message-padding:15px 19px;--el-message-close-size:16px;--el-message-close-icon-color:var(--el-text-color-placeholder);--el-message-close-hover-color:var(--el-text-color-secondary)}.el-message{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;max-width:calc(100% - 32px);box-sizing:border-box;border-radius:var(--el-border-radius-base);border-width:var(--el-border-width);border-style:var(--el-border-style);border-color:var(--el-message-border-color);position:fixed;left:50%;top:20px;transform:translateX(-50%);background-color:var(--el-message-bg-color);transition:opacity var(--el-transition-duration),transform .4s,top .4s;padding:var(--el-message-padding);display:flex;align-items:center}.el-message.is-center{justify-content:center}.el-message.is-closable .el-message__content{padding-right:31px}.el-message p{margin:0}.el-message--success{--el-message-bg-color:var(--el-color-success-light-9);--el-message-border-color:var(--el-color-success-light-8);--el-message-text-color:var(--el-color-success)}.el-message--success .el-message__content{color:var(--el-message-text-color);overflow-wrap:anywhere}.el-message .el-message-icon--success{color:var(--el-message-text-color)}.el-message--info{--el-message-bg-color:var(--el-color-info-light-9);--el-message-border-color:var(--el-color-info-light-8);--el-message-text-color:var(--el-color-info)}.el-message--info .el-message__content{color:var(--el-message-text-color);overflow-wrap:anywhere}.el-message .el-message-icon--info{color:var(--el-message-text-color)}.el-message--warning{--el-message-bg-color:var(--el-color-warning-light-9);--el-message-border-color:var(--el-color-warning-light-8);--el-message-text-color:var(--el-color-warning)}.el-message--warning .el-message__content{color:var(--el-message-text-color);overflow-wrap:anywhere}.el-message .el-message-icon--warning{color:var(--el-message-text-color)}.el-message--error{--el-message-bg-color:var(--el-color-error-light-9);--el-message-border-color:var(--el-color-error-light-8);--el-message-text-color:var(--el-color-error)}.el-message--error .el-message__content{color:var(--el-message-text-color);overflow-wrap:anywhere}.el-message .el-message-icon--error{color:var(--el-message-text-color)}.el-message__icon{margin-right:10px}.el-message .el-message__badge{position:absolute;top:-8px;right:-8px}.el-message__content{padding:0;font-size:14px;line-height:1}.el-message__content:focus{outline-width:0}.el-message .el-message__closeBtn{position:absolute;top:50%;right:19px;transform:translateY(-50%);cursor:pointer;color:var(--el-message-close-icon-color);font-size:var(--el-message-close-size)}.el-message .el-message__closeBtn:focus{outline-width:0}.el-message .el-message__closeBtn:hover{color:var(--el-message-close-hover-color)}.el-message-fade-enter-from,.el-message-fade-leave-to{opacity:0;transform:translate(-50%,-100%)}.el-notification{--el-notification-width:330px;--el-notification-padding:14px 26px 14px 13px;--el-notification-radius:8px;--el-notification-shadow:var(--el-box-shadow-light);--el-notification-border-color:var(--el-border-color-lighter);--el-notification-icon-size:24px;--el-notification-close-font-size:var(--el-message-close-size, 16px);--el-notification-group-margin-left:13px;--el-notification-group-margin-right:8px;--el-notification-content-font-size:var(--el-font-size-base);--el-notification-content-color:var(--el-text-color-regular);--el-notification-title-font-size:16px;--el-notification-title-color:var(--el-text-color-primary);--el-notification-close-color:var(--el-text-color-secondary);--el-notification-close-hover-color:var(--el-text-color-regular)}.el-notification{display:flex;width:var(--el-notification-width);padding:var(--el-notification-padding);border-radius:var(--el-notification-radius);box-sizing:border-box;border:1px solid var(--el-notification-border-color);position:fixed;background-color:var(--el-bg-color-overlay);box-shadow:var(--el-notification-shadow);transition:opacity var(--el-transition-duration),transform var(--el-transition-duration),left var(--el-transition-duration),right var(--el-transition-duration),top .4s,bottom var(--el-transition-duration);overflow-wrap:anywhere;overflow:hidden;z-index:9999}.el-notification.right{right:16px}.el-notification.left{left:16px}.el-notification__group{margin-left:var(--el-notification-group-margin-left);margin-right:var(--el-notification-group-margin-right)}.el-notification__title{font-weight:700;font-size:var(--el-notification-title-font-size);line-height:var(--el-notification-icon-size);color:var(--el-notification-title-color);margin:0}.el-notification__content{font-size:var(--el-notification-content-font-size);line-height:24px;margin:6px 0 0;color:var(--el-notification-content-color);text-align:justify}.el-notification__content p{margin:0}.el-notification .el-notification__icon{height:var(--el-notification-icon-size);width:var(--el-notification-icon-size);font-size:var(--el-notification-icon-size)}.el-notification .el-notification__closeBtn{position:absolute;top:18px;right:15px;cursor:pointer;color:var(--el-notification-close-color);font-size:var(--el-notification-close-font-size)}.el-notification .el-notification__closeBtn:hover{color:var(--el-notification-close-hover-color)}.el-notification .el-notification--success{--el-notification-icon-color:var(--el-color-success);color:var(--el-notification-icon-color)}.el-notification .el-notification--info{--el-notification-icon-color:var(--el-color-info);color:var(--el-notification-icon-color)}.el-notification .el-notification--warning{--el-notification-icon-color:var(--el-color-warning);color:var(--el-notification-icon-color)}.el-notification .el-notification--error{--el-notification-icon-color:var(--el-color-error);color:var(--el-notification-icon-color)}.el-notification-fade-enter-from.right{right:0;transform:translateX(100%)}.el-notification-fade-enter-from.left{left:0;transform:translateX(-100%)}.el-notification-fade-leave-to{opacity:0}.el-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;height:100%;background-color:var(--el-overlay-color-lighter);overflow:auto}.el-overlay .el-overlay-root{height:0}.el-page-header.is-contentful .el-page-header__main{border-top:1px solid var(--el-border-color-light);margin-top:16px}.el-page-header__header{display:flex;align-items:center;justify-content:space-between;line-height:24px}.el-page-header__left{display:flex;align-items:center;margin-right:40px;position:relative}.el-page-header__back{display:flex;align-items:center;cursor:pointer}.el-page-header__left .el-divider--vertical{margin:0 16px}.el-page-header__icon{font-size:16px;margin-right:10px;display:flex;align-items:center}.el-page-header__icon .el-icon{font-size:inherit}.el-page-header__title{font-size:14px;font-weight:500}.el-page-header__content{font-size:18px;color:var(--el-text-color-primary)}.el-page-header__breadcrumb{margin-bottom:16px}.el-pagination{--el-pagination-font-size:14px;--el-pagination-bg-color:var(--el-fill-color-blank);--el-pagination-text-color:var(--el-text-color-primary);--el-pagination-border-radius:2px;--el-pagination-button-color:var(--el-text-color-primary);--el-pagination-button-width:32px;--el-pagination-button-height:32px;--el-pagination-button-disabled-color:var(--el-text-color-placeholder);--el-pagination-button-disabled-bg-color:var(--el-fill-color-blank);--el-pagination-button-bg-color:var(--el-fill-color);--el-pagination-hover-color:var(--el-color-primary);--el-pagination-font-size-small:12px;--el-pagination-button-width-small:24px;--el-pagination-button-height-small:24px;--el-pagination-item-gap:16px;white-space:nowrap;color:var(--el-pagination-text-color);font-size:var(--el-pagination-font-size);font-weight:400;display:flex;align-items:center}.el-pagination .el-input__inner{text-align:center;-moz-appearance:textfield}.el-pagination .el-select .el-input{width:128px}.el-pagination button{display:flex;justify-content:center;align-items:center;font-size:var(--el-pagination-font-size);min-width:var(--el-pagination-button-width);height:var(--el-pagination-button-height);line-height:var(--el-pagination-button-height);color:var(--el-pagination-button-color);background:var(--el-pagination-bg-color);padding:0 4px;border:none;border-radius:var(--el-pagination-border-radius);cursor:pointer;text-align:center;box-sizing:border-box}.el-pagination button *{pointer-events:none}.el-pagination button:focus{outline:0}.el-pagination button:hover{color:var(--el-pagination-hover-color)}.el-pagination button.is-active{color:var(--el-pagination-hover-color);cursor:default;font-weight:700}.el-pagination button.is-active.is-disabled{font-weight:700;color:var(--el-text-color-secondary)}.el-pagination button.is-disabled,.el-pagination button:disabled{color:var(--el-pagination-button-disabled-color);background-color:var(--el-pagination-button-disabled-bg-color);cursor:not-allowed}.el-pagination button:focus-visible{outline:1px solid var(--el-pagination-hover-color);outline-offset:-1px}.el-pagination .btn-next .el-icon,.el-pagination .btn-prev .el-icon{display:block;font-size:12px;font-weight:700;width:inherit}.el-pagination>.is-first{margin-left:0!important}.el-pagination>.is-last{margin-right:0!important}.el-pagination .btn-prev{margin-left:var(--el-pagination-item-gap)}.el-pagination__sizes{margin-left:var(--el-pagination-item-gap);font-weight:400;color:var(--el-text-color-regular)}.el-pagination__total{margin-left:var(--el-pagination-item-gap);font-weight:400;color:var(--el-text-color-regular)}.el-pagination__total[disabled=true]{color:var(--el-text-color-placeholder)}.el-pagination__jump{display:flex;align-items:center;margin-left:var(--el-pagination-item-gap);font-weight:400;color:var(--el-text-color-regular)}.el-pagination__jump[disabled=true]{color:var(--el-text-color-placeholder)}.el-pagination__goto{margin-right:8px}.el-pagination__editor{text-align:center;box-sizing:border-box}.el-pagination__editor.el-input{width:56px}.el-pagination__editor .el-input__inner::-webkit-inner-spin-button,.el-pagination__editor .el-input__inner::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.el-pagination__classifier{margin-left:8px}.el-pagination__rightwrapper{flex:1;display:flex;align-items:center;justify-content:flex-end}.el-pagination.is-background .btn-next,.el-pagination.is-background .btn-prev,.el-pagination.is-background .el-pager li{margin:0 4px;background-color:var(--el-pagination-button-bg-color)}.el-pagination.is-background .btn-next.is-active,.el-pagination.is-background .btn-prev.is-active,.el-pagination.is-background .el-pager li.is-active{background-color:var(--el-color-primary);color:var(--el-color-white)}.el-pagination.is-background .btn-next.is-disabled,.el-pagination.is-background .btn-next:disabled,.el-pagination.is-background .btn-prev.is-disabled,.el-pagination.is-background .btn-prev:disabled,.el-pagination.is-background .el-pager li.is-disabled,.el-pagination.is-background .el-pager li:disabled{color:var(--el-text-color-placeholder);background-color:var(--el-disabled-bg-color)}.el-pagination.is-background .btn-next.is-disabled.is-active,.el-pagination.is-background .btn-next:disabled.is-active,.el-pagination.is-background .btn-prev.is-disabled.is-active,.el-pagination.is-background .btn-prev:disabled.is-active,.el-pagination.is-background .el-pager li.is-disabled.is-active,.el-pagination.is-background .el-pager li:disabled.is-active{color:var(--el-text-color-secondary);background-color:var(--el-fill-color-dark)}.el-pagination.is-background .btn-prev{margin-left:var(--el-pagination-item-gap)}.el-pagination--small .btn-next,.el-pagination--small .btn-prev,.el-pagination--small .el-pager li{height:var(--el-pagination-button-height-small);line-height:var(--el-pagination-button-height-small);font-size:var(--el-pagination-font-size-small);min-width:var(--el-pagination-button-width-small)}.el-pagination--small button,.el-pagination--small span:not([class*=suffix]){font-size:var(--el-pagination-font-size-small)}.el-pagination--small .el-select .el-input{width:100px}.el-pager{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;list-style:none;font-size:0;padding:0;margin:0;display:flex;align-items:center}.el-pager li{display:flex;justify-content:center;align-items:center;font-size:var(--el-pagination-font-size);min-width:var(--el-pagination-button-width);height:var(--el-pagination-button-height);line-height:var(--el-pagination-button-height);color:var(--el-pagination-button-color);background:var(--el-pagination-bg-color);padding:0 4px;border:none;border-radius:var(--el-pagination-border-radius);cursor:pointer;text-align:center;box-sizing:border-box}.el-pager li *{pointer-events:none}.el-pager li:focus{outline:0}.el-pager li:hover{color:var(--el-pagination-hover-color)}.el-pager li.is-active{color:var(--el-pagination-hover-color);cursor:default;font-weight:700}.el-pager li.is-active.is-disabled{font-weight:700;color:var(--el-text-color-secondary)}.el-pager li.is-disabled,.el-pager li:disabled{color:var(--el-pagination-button-disabled-color);background-color:var(--el-pagination-button-disabled-bg-color);cursor:not-allowed}.el-pager li:focus-visible{outline:1px solid var(--el-pagination-hover-color);outline-offset:-1px}.el-popconfirm__main{display:flex;align-items:center}.el-popconfirm__icon{margin-right:5px}.el-popconfirm__action{text-align:right;margin-top:8px}.el-popover{--el-popover-bg-color:var(--el-bg-color-overlay);--el-popover-font-size:var(--el-font-size-base);--el-popover-border-color:var(--el-border-color-lighter);--el-popover-padding:12px;--el-popover-padding-large:18px 20px;--el-popover-title-font-size:16px;--el-popover-title-text-color:var(--el-text-color-primary);--el-popover-border-radius:4px}.el-popover.el-popper{background:var(--el-popover-bg-color);min-width:150px;border-radius:var(--el-popover-border-radius);border:1px solid var(--el-popover-border-color);padding:var(--el-popover-padding);z-index:var(--el-index-popper);color:var(--el-text-color-regular);line-height:1.4;text-align:justify;font-size:var(--el-popover-font-size);box-shadow:var(--el-box-shadow-light);word-break:break-all;box-sizing:border-box}.el-popover.el-popper--plain{padding:var(--el-popover-padding-large)}.el-popover__title{color:var(--el-popover-title-text-color);font-size:var(--el-popover-title-font-size);line-height:1;margin-bottom:12px}.el-popover__reference:focus:hover,.el-popover__reference:focus:not(.focusing){outline-width:0}.el-popover.el-popper.is-dark{--el-popover-bg-color:var(--el-text-color-primary);--el-popover-border-color:var(--el-text-color-primary);--el-popover-title-text-color:var(--el-bg-color);color:var(--el-bg-color)}.el-popover.el-popper:focus,.el-popover.el-popper:focus:active{outline-width:0}.el-progress{position:relative;line-height:1;display:flex;align-items:center}.el-progress__text{font-size:14px;color:var(--el-text-color-regular);margin-left:5px;min-width:50px;line-height:1}.el-progress__text i{vertical-align:middle;display:block}.el-progress--circle,.el-progress--dashboard{display:inline-block}.el-progress--circle .el-progress__text,.el-progress--dashboard .el-progress__text{position:absolute;top:50%;left:0;width:100%;text-align:center;margin:0;transform:translate(0,-50%)}.el-progress--circle .el-progress__text i,.el-progress--dashboard .el-progress__text i{vertical-align:middle;display:inline-block}.el-progress--without-text .el-progress__text{display:none}.el-progress--without-text .el-progress-bar{padding-right:0;margin-right:0;display:block}.el-progress--text-inside .el-progress-bar{padding-right:0;margin-right:0}.el-progress.is-success .el-progress-bar__inner{background-color:var(--el-color-success)}.el-progress.is-success .el-progress__text{color:var(--el-color-success)}.el-progress.is-warning .el-progress-bar__inner{background-color:var(--el-color-warning)}.el-progress.is-warning .el-progress__text{color:var(--el-color-warning)}.el-progress.is-exception .el-progress-bar__inner{background-color:var(--el-color-danger)}.el-progress.is-exception .el-progress__text{color:var(--el-color-danger)}.el-progress-bar{flex-grow:1;box-sizing:border-box}.el-progress-bar__outer{height:6px;border-radius:100px;background-color:var(--el-border-color-lighter);overflow:hidden;position:relative;vertical-align:middle}.el-progress-bar__inner{position:absolute;left:0;top:0;height:100%;background-color:var(--el-color-primary);text-align:right;border-radius:100px;line-height:1;white-space:nowrap;transition:width .6s ease}.el-progress-bar__inner::after{display:inline-block;content:"";height:100%;vertical-align:middle}.el-progress-bar__inner--indeterminate{transform:translateZ(0);-webkit-animation:indeterminate 3s infinite;animation:indeterminate 3s infinite}.el-progress-bar__innerText{display:inline-block;vertical-align:middle;color:#fff;font-size:12px;margin:0 5px}@-webkit-keyframes progress{0%{background-position:0 0}100%{background-position:32px 0}}@keyframes progress{0%{background-position:0 0}100%{background-position:32px 0}}@-webkit-keyframes indeterminate{0%{left:-100%}100%{left:100%}}@keyframes indeterminate{0%{left:-100%}100%{left:100%}}.el-radio-button{--el-radio-button-checked-bg-color:var(--el-color-primary);--el-radio-button-checked-text-color:var(--el-color-white);--el-radio-button-checked-border-color:var(--el-color-primary);--el-radio-button-disabled-checked-fill:var(--el-border-color-extra-light)}.el-radio-button{position:relative;display:inline-block;outline:0}.el-radio-button__inner{display:inline-block;line-height:1;white-space:nowrap;vertical-align:middle;background:var(--el-button-bg-color,var(--el-fill-color-blank));border:var(--el-border);font-weight:var(--el-button-font-weight,var(--el-font-weight-primary));border-left:0;color:var(--el-button-text-color,var(--el-text-color-regular));-webkit-appearance:none;text-align:center;box-sizing:border-box;outline:0;margin:0;position:relative;cursor:pointer;transition:var(--el-transition-all);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding:8px 15px;font-size:var(--el-font-size-base);border-radius:0}.el-radio-button__inner.is-round{padding:8px 15px}.el-radio-button__inner:hover{color:var(--el-color-primary)}.el-radio-button__inner [class*=el-icon-]{line-height:.9}.el-radio-button__inner [class*=el-icon-]+span{margin-left:5px}.el-radio-button:first-child .el-radio-button__inner{border-left:var(--el-border);border-radius:var(--el-border-radius-base) 0 0 var(--el-border-radius-base);box-shadow:none!important}.el-radio-button__original-radio{opacity:0;outline:0;position:absolute;z-index:-1}.el-radio-button__original-radio:checked+.el-radio-button__inner{color:var(--el-radio-button-checked-text-color,var(--el-color-white));background-color:var(--el-radio-button-checked-bg-color,var(--el-color-primary));border-color:var(--el-radio-button-checked-border-color,var(--el-color-primary));box-shadow:-1px 0 0 0 var(--el-radio-button-checked-border-color,var(--el-color-primary))}.el-radio-button__original-radio:focus-visible+.el-radio-button__inner{border-left:var(--el-border);border-left-color:var(--el-radio-button-checked-border-color,var(--el-color-primary));outline:2px solid var(--el-radio-button-checked-border-color);outline-offset:1px;z-index:2;border-radius:var(--el-border-radius-base);box-shadow:none}.el-radio-button__original-radio:disabled+.el-radio-button__inner{color:var(--el-disabled-text-color);cursor:not-allowed;background-image:none;background-color:var(--el-button-disabled-bg-color,var(--el-fill-color-blank));border-color:var(--el-button-disabled-border-color,var(--el-border-color-light));box-shadow:none}.el-radio-button__original-radio:disabled:checked+.el-radio-button__inner{background-color:var(--el-radio-button-disabled-checked-fill)}.el-radio-button:last-child .el-radio-button__inner{border-radius:0 var(--el-border-radius-base) var(--el-border-radius-base) 0}.el-radio-button:first-child:last-child .el-radio-button__inner{border-radius:var(--el-border-radius-base)}.el-radio-button--large .el-radio-button__inner{padding:12px 19px;font-size:var(--el-font-size-base);border-radius:0}.el-radio-button--large .el-radio-button__inner.is-round{padding:12px 19px}.el-radio-button--small .el-radio-button__inner{padding:5px 11px;font-size:12px;border-radius:0}.el-radio-button--small .el-radio-button__inner.is-round{padding:5px 11px}.el-radio-group{display:inline-flex;align-items:center;flex-wrap:wrap;font-size:0}.el-radio{--el-radio-font-size:var(--el-font-size-base);--el-radio-text-color:var(--el-text-color-regular);--el-radio-font-weight:var(--el-font-weight-primary);--el-radio-input-height:14px;--el-radio-input-width:14px;--el-radio-input-border-radius:var(--el-border-radius-circle);--el-radio-input-bg-color:var(--el-fill-color-blank);--el-radio-input-border:var(--el-border);--el-radio-input-border-color:var(--el-border-color);--el-radio-input-border-color-hover:var(--el-color-primary)}.el-radio{color:var(--el-radio-text-color);font-weight:var(--el-radio-font-weight);position:relative;cursor:pointer;display:inline-flex;align-items:center;white-space:nowrap;outline:0;font-size:var(--el-font-size-base);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin-right:32px;height:32px}.el-radio.el-radio--large{height:40px}.el-radio.el-radio--small{height:24px}.el-radio.is-bordered{padding:0 15px 0 9px;border-radius:var(--el-border-radius-base);border:var(--el-border);box-sizing:border-box}.el-radio.is-bordered.is-checked{border-color:var(--el-color-primary)}.el-radio.is-bordered.is-disabled{cursor:not-allowed;border-color:var(--el-border-color-lighter)}.el-radio.is-bordered.el-radio--large{padding:0 19px 0 11px;border-radius:var(--el-border-radius-base)}.el-radio.is-bordered.el-radio--large .el-radio__label{font-size:var(--el-font-size-base)}.el-radio.is-bordered.el-radio--large .el-radio__inner{height:14px;width:14px}.el-radio.is-bordered.el-radio--small{padding:0 11px 0 7px;border-radius:var(--el-border-radius-base)}.el-radio.is-bordered.el-radio--small .el-radio__label{font-size:12px}.el-radio.is-bordered.el-radio--small .el-radio__inner{height:12px;width:12px}.el-radio:last-child{margin-right:0}.el-radio__input{white-space:nowrap;cursor:pointer;outline:0;display:inline-flex;position:relative;vertical-align:middle}.el-radio__input.is-disabled .el-radio__inner{background-color:var(--el-disabled-bg-color);border-color:var(--el-disabled-border-color);cursor:not-allowed}.el-radio__input.is-disabled .el-radio__inner::after{cursor:not-allowed;background-color:var(--el-disabled-bg-color)}.el-radio__input.is-disabled .el-radio__inner+.el-radio__label{cursor:not-allowed}.el-radio__input.is-disabled.is-checked .el-radio__inner{background-color:var(--el-disabled-bg-color);border-color:var(--el-disabled-border-color)}.el-radio__input.is-disabled.is-checked .el-radio__inner::after{background-color:var(--el-text-color-placeholder)}.el-radio__input.is-disabled+span.el-radio__label{color:var(--el-text-color-placeholder);cursor:not-allowed}.el-radio__input.is-checked .el-radio__inner{border-color:var(--el-color-primary);background:var(--el-color-primary)}.el-radio__input.is-checked .el-radio__inner::after{transform:translate(-50%,-50%) scale(1)}.el-radio__input.is-checked+.el-radio__label{color:var(--el-color-primary)}.el-radio__input.is-focus .el-radio__inner{border-color:var(--el-radio-input-border-color-hover)}.el-radio__inner{border:var(--el-radio-input-border);border-radius:var(--el-radio-input-border-radius);width:var(--el-radio-input-width);height:var(--el-radio-input-height);background-color:var(--el-radio-input-bg-color);position:relative;cursor:pointer;display:inline-block;box-sizing:border-box}.el-radio__inner:hover{border-color:var(--el-radio-input-border-color-hover)}.el-radio__inner::after{width:4px;height:4px;border-radius:var(--el-radio-input-border-radius);background-color:var(--el-color-white);content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(0);transition:transform .15s ease-in}.el-radio__original{opacity:0;outline:0;position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;margin:0}.el-radio__original:focus-visible+.el-radio__inner{outline:2px solid var(--el-radio-input-border-color-hover);outline-offset:1px;border-radius:var(--el-radio-input-border-radius)}.el-radio:focus:not(:focus-visible):not(.is-focus):not(:active):not(.is-disabled) .el-radio__inner{box-shadow:0 0 2px 2px var(--el-radio-input-border-color-hover)}.el-radio__label{font-size:var(--el-radio-font-size);padding-left:8px}.el-radio.el-radio--large .el-radio__label{font-size:14px}.el-radio.el-radio--large .el-radio__inner{width:14px;height:14px}.el-radio.el-radio--small .el-radio__label{font-size:12px}.el-radio.el-radio--small .el-radio__inner{width:12px;height:12px}.el-rate{--el-rate-height:20px;--el-rate-font-size:var(--el-font-size-base);--el-rate-icon-size:18px;--el-rate-icon-margin:6px;--el-rate-void-color:var(--el-border-color-darker);--el-rate-fill-color:#f7ba2a;--el-rate-disabled-void-color:var(--el-fill-color);--el-rate-text-color:var(--el-text-color-primary)}.el-rate{display:inline-flex;align-items:center;height:32px}.el-rate:active,.el-rate:focus{outline:0}.el-rate__item{cursor:pointer;display:inline-block;position:relative;font-size:0;vertical-align:middle;color:var(--el-rate-void-color);line-height:normal}.el-rate .el-rate__icon{position:relative;display:inline-block;font-size:var(--el-rate-icon-size);margin-right:var(--el-rate-icon-margin);transition:var(--el-transition-duration)}.el-rate .el-rate__icon.hover{transform:scale(1.15)}.el-rate .el-rate__icon .path2{position:absolute;left:0;top:0}.el-rate .el-rate__icon.is-active{color:var(--el-rate-fill-color)}.el-rate__decimal{position:absolute;top:0;left:0;display:inline-block;overflow:hidden;color:var(--el-rate-fill-color)}.el-rate__text{font-size:var(--el-rate-font-size);vertical-align:middle;color:var(--el-rate-text-color)}.el-rate--large{height:40px}.el-rate--small{height:24px}.el-rate--small .el-rate__icon{font-size:14px}.el-rate.is-disabled .el-rate__item{cursor:auto;color:var(--el-rate-disabled-void-color)}.el-result{--el-result-padding:40px 30px;--el-result-icon-font-size:64px;--el-result-title-font-size:20px;--el-result-title-margin-top:20px;--el-result-subtitle-margin-top:10px;--el-result-extra-margin-top:30px}.el-result{display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;box-sizing:border-box;padding:var(--el-result-padding)}.el-result__icon svg{width:var(--el-result-icon-font-size);height:var(--el-result-icon-font-size)}.el-result__title{margin-top:var(--el-result-title-margin-top)}.el-result__title p{margin:0;font-size:var(--el-result-title-font-size);color:var(--el-text-color-primary);line-height:1.3}.el-result__subtitle{margin-top:var(--el-result-subtitle-margin-top)}.el-result__subtitle p{margin:0;font-size:var(--el-font-size-base);color:var(--el-text-color-regular);line-height:1.3}.el-result__extra{margin-top:var(--el-result-extra-margin-top)}.el-result .icon-primary{--el-result-color:var(--el-color-primary);color:var(--el-result-color)}.el-result .icon-success{--el-result-color:var(--el-color-success);color:var(--el-result-color)}.el-result .icon-warning{--el-result-color:var(--el-color-warning);color:var(--el-result-color)}.el-result .icon-danger{--el-result-color:var(--el-color-danger);color:var(--el-result-color)}.el-result .icon-error{--el-result-color:var(--el-color-error);color:var(--el-result-color)}.el-result .icon-info{--el-result-color:var(--el-color-info);color:var(--el-result-color)}.el-row{display:flex;flex-wrap:wrap;position:relative;box-sizing:border-box}.el-row.is-justify-center{justify-content:center}.el-row.is-justify-end{justify-content:flex-end}.el-row.is-justify-space-between{justify-content:space-between}.el-row.is-justify-space-around{justify-content:space-around}.el-row.is-justify-space-evenly{justify-content:space-evenly}.el-row.is-align-middle{align-items:center}.el-row.is-align-bottom{align-items:flex-end}.el-scrollbar{--el-scrollbar-opacity:0.3;--el-scrollbar-bg-color:var(--el-text-color-secondary);--el-scrollbar-hover-opacity:0.5;--el-scrollbar-hover-bg-color:var(--el-text-color-secondary)}.el-scrollbar{overflow:hidden;position:relative;height:100%}.el-scrollbar__wrap{overflow:auto;height:100%}.el-scrollbar__wrap--hidden-default{scrollbar-width:none}.el-scrollbar__wrap--hidden-default::-webkit-scrollbar{display:none}.el-scrollbar__thumb{position:relative;display:block;width:0;height:0;cursor:pointer;border-radius:inherit;background-color:var(--el-scrollbar-bg-color,var(--el-text-color-secondary));transition:var(--el-transition-duration) background-color;opacity:var(--el-scrollbar-opacity,.3)}.el-scrollbar__thumb:hover{background-color:var(--el-scrollbar-hover-bg-color,var(--el-text-color-secondary));opacity:var(--el-scrollbar-hover-opacity,.5)}.el-scrollbar__bar{position:absolute;right:2px;bottom:2px;z-index:1;border-radius:4px}.el-scrollbar__bar.is-vertical{width:6px;top:2px}.el-scrollbar__bar.is-vertical>div{width:100%}.el-scrollbar__bar.is-horizontal{height:6px;left:2px}.el-scrollbar__bar.is-horizontal>div{height:100%}.el-scrollbar-fade-enter-active{transition:opacity 340ms ease-out}.el-scrollbar-fade-leave-active{transition:opacity 120ms ease-out}.el-scrollbar-fade-enter-from,.el-scrollbar-fade-leave-active{opacity:0}.el-select-dropdown{z-index:calc(var(--el-index-top) + 1);border-radius:var(--el-border-radius-base);box-sizing:border-box}.el-select-dropdown .el-scrollbar.is-empty .el-select-dropdown__list{padding:0}.el-select-dropdown__option-item.is-selected:not(.is-multiple).is-disabled{color:var(--el-text-color-disabled)}.el-select-dropdown__option-item.is-selected:not(.is-multiple).is-disabled::after{background-color:var(--el-text-color-disabled)}.el-select-dropdown__option-item:hover:not(.hover){background-color:transparent}.el-select-dropdown.is-multiple .el-select-dropdown__option-item.is-disabled.is-selected{color:var(--el-text-color-disabled)}.el-select-dropdown__empty{padding:10px 0;margin:0;text-align:center;color:var(--el-text-color-secondary);font-size:var(--el-select-font-size)}.el-select-dropdown__wrap{max-height:274px}.el-select-dropdown__list{list-style:none;margin:6px 0!important;padding:0!important;box-sizing:border-box}.el-select-dropdown__option-item{font-size:var(--el-select-font-size);padding:0 32px 0 20px;position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--el-text-color-regular);height:34px;line-height:34px;box-sizing:border-box;cursor:pointer}.el-select-dropdown__option-item.is-disabled{color:var(--el-text-color-placeholder);cursor:not-allowed}.el-select-dropdown__option-item.is-disabled:hover{background-color:var(--el-bg-color)}.el-select-dropdown__option-item.is-selected{background-color:var(--el-fill-color-light);font-weight:700}.el-select-dropdown__option-item.is-selected:not(.is-multiple){color:var(--el-color-primary)}.el-select-dropdown__option-item.hover{background-color:var(--el-fill-color-light)!important}.el-select-dropdown__option-item:hover{background-color:var(--el-fill-color-light)}.el-select-dropdown.is-multiple .el-select-dropdown__option-item.is-selected{color:var(--el-color-primary);background-color:var(--el-bg-color-overlay)}.el-select-dropdown.is-multiple .el-select-dropdown__option-item.is-selected .el-icon{position:absolute;right:20px;top:0;height:inherit;font-size:12px}.el-select-dropdown.is-multiple .el-select-dropdown__option-item.is-selected .el-icon svg{height:inherit;vertical-align:middle}.el-select-group{margin:0;padding:0}.el-select-group__wrap{position:relative;list-style:none;margin:0;padding:0}.el-select-group__wrap:not(:last-of-type){padding-bottom:24px}.el-select-group__wrap:not(:last-of-type)::after{content:"";position:absolute;display:block;left:20px;right:20px;bottom:12px;height:1px;background:var(--el-border-color-light)}.el-select-group__split-dash{position:absolute;left:20px;right:20px;height:1px;background:var(--el-border-color-light)}.el-select-group__title{padding-left:20px;font-size:12px;color:var(--el-color-info);line-height:30px}.el-select-group .el-select-dropdown__item{padding-left:20px}.el-select-v2{--el-select-border-color-hover:var(--el-border-color-hover);--el-select-disabled-border:var(--el-disabled-border-color);--el-select-font-size:var(--el-font-size-base);--el-select-close-hover-color:var(--el-text-color-secondary);--el-select-input-color:var(--el-text-color-placeholder);--el-select-multiple-input-color:var(--el-text-color-regular);--el-select-input-focus-border-color:var(--el-color-primary);--el-select-input-font-size:14px}.el-select-v2{display:inline-block;position:relative;vertical-align:middle;font-size:14px}.el-select-v2__wrapper{display:flex;align-items:center;flex-wrap:wrap;position:relative;box-sizing:border-box;cursor:pointer;padding:1px 30px 1px 0;border:1px solid var(--el-border-color);border-radius:var(--el-border-radius-base);background-color:var(--el-fill-color-blank);transition:var(--el-transition-duration)}.el-select-v2__wrapper:hover{border-color:var(--el-text-color-placeholder)}.el-select-v2__wrapper.is-filterable{cursor:text}.el-select-v2__wrapper.is-focused{border-color:var(--el-color-primary)}.el-select-v2__wrapper.is-hovering:not(.is-focused){border-color:var(--el-border-color-hover)}.el-select-v2__wrapper.is-disabled{cursor:not-allowed;background-color:var(--el-fill-color-light);color:var(--el-text-color-placeholder);border-color:var(--el-select-disabled-border)}.el-select-v2__wrapper.is-disabled:hover{border-color:var(--el-select-disabled-border)}.el-select-v2__wrapper.is-disabled.is-focus{border-color:var(--el-input-focus-border-color)}.el-select-v2__wrapper.is-disabled .is-transparent{opacity:1;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.el-select-v2__wrapper.is-disabled .el-select-v2__caret{cursor:not-allowed}.el-select-v2__wrapper.is-disabled .el-select-v2__combobox-input{cursor:not-allowed}.el-select-v2__wrapper .el-select-v2__input-wrapper{box-sizing:border-box;position:relative;-webkit-margin-start:12px;margin-inline-start:12px;max-width:100%;overflow:hidden}.el-select-v2__wrapper,.el-select-v2__wrapper .el-select-v2__input-wrapper{line-height:32px}.el-select-v2__wrapper .el-select-v2__input-wrapper input{--el-input-inner-height:calc(var(--el-component-size, 32px) - 8px);height:var(--el-input-inner-height);line-height:var(--el-input-inner-height);min-width:4px;width:100%;background-color:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:none;margin:2px 0;outline:0;padding:0}.el-select-v2 .el-select-v2__tags-text{display:inline-block;line-height:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.el-select-v2__empty{padding:10px 0;margin:0;text-align:center;color:var(--el-text-color-secondary);font-size:14px}.el-select-v2__popper.el-popper{background:var(--el-bg-color-overlay);border:1px solid var(--el-border-color-light);box-shadow:var(--el-box-shadow-light)}.el-select-v2__popper.el-popper .el-popper__arrow::before{border:1px solid var(--el-border-color-light)}.el-select-v2__popper.el-popper[data-popper-placement^=top] .el-popper__arrow::before{border-top-color:transparent;border-left-color:transparent}.el-select-v2__popper.el-popper[data-popper-placement^=bottom] .el-popper__arrow::before{border-bottom-color:transparent;border-right-color:transparent}.el-select-v2__popper.el-popper[data-popper-placement^=left] .el-popper__arrow::before{border-left-color:transparent;border-bottom-color:transparent}.el-select-v2__popper.el-popper[data-popper-placement^=right] .el-popper__arrow::before{border-right-color:transparent;border-top-color:transparent}.el-select-v2--large .el-select-v2__wrapper .el-select-v2__combobox-input{height:32px}.el-select-v2--large .el-select-v2__caret{height:40px}.el-select-v2--large .el-select-v2__suffix{height:40px}.el-select-v2--large .el-select-v2__placeholder{font-size:14px;line-height:40px}.el-select-v2--small .el-select-v2__wrapper .el-select-v2__combobox-input{height:16px}.el-select-v2--small .el-select-v2__caret{height:24px}.el-select-v2--small .el-select-v2__suffix{height:24px}.el-select-v2--small .el-select-v2__placeholder{font-size:12px;line-height:24px}.el-select-v2 .el-select-v2__selection>span{display:inline-block}.el-select-v2:hover .el-select-v2__combobox-input{border-color:var(--el-select-border-color-hover)}.el-select-v2 .el-select__selection-text{text-overflow:ellipsis;display:inline-block;overflow-x:hidden;vertical-align:bottom}.el-select-v2 .el-select-v2__combobox-input{padding-right:35px;display:block;color:var(--el-text-color-regular)}.el-select-v2 .el-select-v2__combobox-input:focus{border-color:var(--el-select-input-focus-border-color)}.el-select-v2__input{border:none;outline:0;padding:0;margin-left:15px;color:var(--el-select-multiple-input-color);font-size:var(--el-select-font-size);-webkit-appearance:none;-moz-appearance:none;appearance:none;height:28px}.el-select-v2__input.is-small{height:14px}.el-select-v2__close{cursor:pointer;position:absolute;top:8px;z-index:var(--el-index-top);right:25px;color:var(--el-select-input-color);line-height:18px;font-size:var(--el-select-input-font-size)}.el-select-v2__close:hover{color:var(--el-select-close-hover-color)}.el-select-v2__suffix{display:inline-flex;position:absolute;right:12px;height:32px;top:50%;transform:translateY(-50%);color:var(--el-input-icon-color,var(--el-text-color-placeholder))}.el-select-v2__suffix .el-input__icon{height:inherit}.el-select-v2__suffix .el-input__icon:not(:first-child){margin-left:8px}.el-select-v2__caret{color:var(--el-select-input-color);font-size:var(--el-select-input-font-size);transition:var(--el-transition-duration);transform:rotateZ(180deg);cursor:pointer}.el-select-v2__caret.is-reverse{transform:rotateZ(0)}.el-select-v2__caret.is-show-close{font-size:var(--el-select-font-size);text-align:center;transform:rotateZ(180deg);border-radius:var(--el-border-radius-circle);color:var(--el-select-input-color);transition:var(--el-transition-color)}.el-select-v2__caret.is-show-close:hover{color:var(--el-select-close-hover-color)}.el-select-v2__caret.el-icon{height:inherit}.el-select-v2__caret.el-icon svg{vertical-align:middle}.el-select-v2__selection{white-space:normal;z-index:var(--el-index-normal);display:flex;align-items:center;flex-wrap:wrap;width:100%}.el-select-v2__input-calculator{left:0;position:absolute;top:0;visibility:hidden;white-space:pre;z-index:999}.el-select-v2__selected-item{line-height:inherit;height:inherit;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:flex;flex-wrap:wrap}.el-select-v2__placeholder{position:absolute;top:50%;transform:translateY(-50%);-webkit-margin-start:12px;margin-inline-start:12px;width:calc(100% - 52px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--el-input-text-color,var(--el-text-color-regular))}.el-select-v2__placeholder.is-transparent{color:var(--el-text-color-placeholder)}.el-select-v2 .el-select-v2__selection .el-tag{box-sizing:border-box;border-color:transparent;margin:2px 0 2px 6px;background-color:var(--el-fill-color)}.el-select-v2 .el-select-v2__selection .el-tag .el-icon-close{background-color:var(--el-text-color-placeholder);right:-7px;color:var(--el-color-white)}.el-select-v2 .el-select-v2__selection .el-tag .el-icon-close:hover{background-color:var(--el-text-color-secondary)}.el-select-v2 .el-select-v2__selection .el-tag .el-icon-close::before{display:block;transform:translate(0,.5px)}.el-select-v2.el-select-v2--small .el-select-v2__selection .el-tag{margin:1px 0 1px 6px;height:18px}.el-select-dropdown{z-index:calc(var(--el-index-top) + 1);border-radius:var(--el-border-radius-base);box-sizing:border-box}.el-select-dropdown.is-multiple .el-select-dropdown__item.selected{color:var(--el-color-primary);background-color:var(--el-bg-color-overlay)}.el-select-dropdown.is-multiple .el-select-dropdown__item.selected.hover{background-color:var(--el-fill-color-light)}.el-select-dropdown.is-multiple .el-select-dropdown__item.selected::after{content:"";position:absolute;top:50%;right:20px;border-top:none;border-right:none;background-repeat:no-repeat;background-position:center;background-color:var(--el-color-primary);-webkit-mask:url("data:image/svg+xml;utf8,%3Csvg class='icon' width='200' height='200' viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='currentColor' d='M406.656 706.944L195.84 496.256a32 32 0 10-45.248 45.248l256 256 512-512a32 32 0 00-45.248-45.248L406.592 706.944z'%3E%3C/path%3E%3C/svg%3E") no-repeat;mask:url("data:image/svg+xml;utf8,%3Csvg class='icon' width='200' height='200' viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='currentColor' d='M406.656 706.944L195.84 496.256a32 32 0 10-45.248 45.248l256 256 512-512a32 32 0 00-45.248-45.248L406.592 706.944z'%3E%3C/path%3E%3C/svg%3E") no-repeat;mask-size:100% 100%;-webkit-mask:url("data:image/svg+xml;utf8,%3Csvg class='icon' width='200' height='200' viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='currentColor' d='M406.656 706.944L195.84 496.256a32 32 0 10-45.248 45.248l256 256 512-512a32 32 0 00-45.248-45.248L406.592 706.944z'%3E%3C/path%3E%3C/svg%3E") no-repeat;-webkit-mask-size:100% 100%;transform:translateY(-50%);width:12px;height:12px}.el-select-dropdown.is-multiple .el-select-dropdown__item.selected.is-disabled::after{background-color:var(--el-text-color-disabled)}.el-select-dropdown .el-select-dropdown__option-item.is-selected::after{content:"";position:absolute;top:50%;right:20px;border-top:none;border-right:none;background-repeat:no-repeat;background-position:center;background-color:var(--el-color-primary);-webkit-mask:url("data:image/svg+xml;utf8,%3Csvg class='icon' width='200' height='200' viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='currentColor' d='M406.656 706.944L195.84 496.256a32 32 0 10-45.248 45.248l256 256 512-512a32 32 0 00-45.248-45.248L406.592 706.944z'%3E%3C/path%3E%3C/svg%3E") no-repeat;mask:url("data:image/svg+xml;utf8,%3Csvg class='icon' width='200' height='200' viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='currentColor' d='M406.656 706.944L195.84 496.256a32 32 0 10-45.248 45.248l256 256 512-512a32 32 0 00-45.248-45.248L406.592 706.944z'%3E%3C/path%3E%3C/svg%3E") no-repeat;mask-size:100% 100%;-webkit-mask:url("data:image/svg+xml;utf8,%3Csvg class='icon' width='200' height='200' viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='currentColor' d='M406.656 706.944L195.84 496.256a32 32 0 10-45.248 45.248l256 256 512-512a32 32 0 00-45.248-45.248L406.592 706.944z'%3E%3C/path%3E%3C/svg%3E") no-repeat;-webkit-mask-size:100% 100%;transform:translateY(-50%);width:12px;height:12px}.el-select-dropdown .el-scrollbar.is-empty .el-select-dropdown__list{padding:0}.el-select-dropdown .el-select-dropdown__item.is-disabled:hover{background-color:unset}.el-select-dropdown .el-select-dropdown__item.is-disabled.selected{color:var(--el-text-color-disabled)}.el-select-dropdown__empty{padding:10px 0;margin:0;text-align:center;color:var(--el-text-color-secondary);font-size:var(--el-select-font-size)}.el-select-dropdown__wrap{max-height:274px}.el-select-dropdown__list{list-style:none;padding:6px 0;margin:0;box-sizing:border-box}.el-select{--el-select-border-color-hover:var(--el-border-color-hover);--el-select-disabled-border:var(--el-disabled-border-color);--el-select-font-size:var(--el-font-size-base);--el-select-close-hover-color:var(--el-text-color-secondary);--el-select-input-color:var(--el-text-color-placeholder);--el-select-multiple-input-color:var(--el-text-color-regular);--el-select-input-focus-border-color:var(--el-color-primary);--el-select-input-font-size:14px}.el-select{display:inline-block;position:relative;vertical-align:middle;line-height:32px}.el-select__popper.el-popper{background:var(--el-bg-color-overlay);border:1px solid var(--el-border-color-light);box-shadow:var(--el-box-shadow-light)}.el-select__popper.el-popper .el-popper__arrow::before{border:1px solid var(--el-border-color-light)}.el-select__popper.el-popper[data-popper-placement^=top] .el-popper__arrow::before{border-top-color:transparent;border-left-color:transparent}.el-select__popper.el-popper[data-popper-placement^=bottom] .el-popper__arrow::before{border-bottom-color:transparent;border-right-color:transparent}.el-select__popper.el-popper[data-popper-placement^=left] .el-popper__arrow::before{border-left-color:transparent;border-bottom-color:transparent}.el-select__popper.el-popper[data-popper-placement^=right] .el-popper__arrow::before{border-right-color:transparent;border-top-color:transparent}.el-select .el-select-tags-wrapper.has-prefix{margin-left:6px}.el-select--large{line-height:40px}.el-select--large .el-select-tags-wrapper.has-prefix{margin-left:8px}.el-select--small{line-height:24px}.el-select--small .el-select-tags-wrapper.has-prefix{margin-left:4px}.el-select .el-select__tags>span{display:inline-block}.el-select:hover:not(.el-select--disabled) .el-input__wrapper{box-shadow:0 0 0 1px var(--el-select-border-color-hover) inset}.el-select .el-select__tags-text{display:inline-block;line-height:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.el-select .el-input__wrapper{cursor:pointer}.el-select .el-input__wrapper.is-focus{box-shadow:0 0 0 1px var(--el-select-input-focus-border-color) inset!important}.el-select .el-input__inner{cursor:pointer}.el-select .el-input{display:flex}.el-select .el-input .el-select__caret{color:var(--el-select-input-color);font-size:var(--el-select-input-font-size);transition:transform var(--el-transition-duration);transform:rotateZ(0);cursor:pointer}.el-select .el-input .el-select__caret.is-reverse{transform:rotateZ(-180deg)}.el-select .el-input .el-select__caret.is-show-close{font-size:var(--el-select-font-size);text-align:center;transform:rotateZ(0);border-radius:var(--el-border-radius-circle);color:var(--el-select-input-color);transition:var(--el-transition-color)}.el-select .el-input .el-select__caret.is-show-close:hover{color:var(--el-select-close-hover-color)}.el-select .el-input .el-select__caret.el-icon{position:relative;height:inherit;z-index:2}.el-select .el-input.is-disabled .el-input__wrapper{cursor:not-allowed}.el-select .el-input.is-disabled .el-input__wrapper:hover{box-shadow:0 0 0 1px var(--el-select-disabled-border) inset}.el-select .el-input.is-disabled .el-input__inner{cursor:not-allowed}.el-select .el-input.is-disabled .el-select__caret{cursor:not-allowed}.el-select .el-input.is-focus .el-input__wrapper{box-shadow:0 0 0 1px var(--el-select-input-focus-border-color) inset!important}.el-select__input{border:none;outline:0;padding:0;margin-left:15px;color:var(--el-select-multiple-input-color);font-size:var(--el-select-font-size);-webkit-appearance:none;-moz-appearance:none;appearance:none;height:28px;background-color:transparent}.el-select__input.is-disabled{cursor:not-allowed}.el-select__input--iOS{position:absolute;left:0;top:0;z-index:6}.el-select__input.is-small{height:14px}.el-select__close{cursor:pointer;position:absolute;top:8px;z-index:var(--el-index-top);right:25px;color:var(--el-select-input-color);line-height:18px;font-size:var(--el-select-input-font-size)}.el-select__close:hover{color:var(--el-select-close-hover-color)}.el-select__tags{position:absolute;line-height:normal;top:50%;transform:translateY(-50%);white-space:normal;z-index:var(--el-index-normal);display:flex;align-items:center;flex-wrap:wrap;cursor:pointer}.el-select__tags .el-tag{box-sizing:border-box;border-color:transparent;margin:2px 6px 2px 0}.el-select__tags .el-tag:last-child{margin-right:0}.el-select__tags .el-tag .el-icon-close{background-color:var(--el-text-color-placeholder);right:-7px;top:0;color:#fff}.el-select__tags .el-tag .el-icon-close:hover{background-color:var(--el-text-color-secondary)}.el-select__tags .el-tag .el-icon-close::before{display:block;transform:translate(0,.5px)}.el-select__tags .el-tag--info{background-color:var(--el-fill-color)}.el-select__tags.is-disabled{cursor:not-allowed}.el-select__collapse-tags{white-space:normal;z-index:var(--el-index-normal);display:flex;align-items:center;flex-wrap:wrap;cursor:pointer}.el-select__collapse-tags .el-tag{box-sizing:border-box;border-color:transparent;margin:2px 6px 2px 0}.el-select__collapse-tags .el-tag:last-child{margin-right:0}.el-select__collapse-tags .el-tag .el-icon-close{background-color:var(--el-text-color-placeholder);right:-7px;top:0;color:#fff}.el-select__collapse-tags .el-tag .el-icon-close:hover{background-color:var(--el-text-color-secondary)}.el-select__collapse-tags .el-tag .el-icon-close::before{display:block;transform:translate(0,.5px)}.el-select__collapse-tags .el-tag--info{background-color:var(--el-fill-color)}.el-select__collapse-tag{line-height:inherit;height:inherit;display:flex}.el-skeleton{--el-skeleton-circle-size:var(--el-avatar-size)}.el-skeleton__item{background:var(--el-skeleton-color);display:inline-block;height:16px;border-radius:var(--el-border-radius-base);width:100%}.el-skeleton__circle{border-radius:50%;width:var(--el-skeleton-circle-size);height:var(--el-skeleton-circle-size);line-height:var(--el-skeleton-circle-size)}.el-skeleton__button{height:40px;width:64px;border-radius:4px}.el-skeleton__p{width:100%}.el-skeleton__p.is-last{width:61%}.el-skeleton__p.is-first{width:33%}.el-skeleton__text{width:100%;height:var(--el-font-size-small)}.el-skeleton__caption{height:var(--el-font-size-extra-small)}.el-skeleton__h1{height:var(--el-font-size-extra-large)}.el-skeleton__h3{height:var(--el-font-size-large)}.el-skeleton__h5{height:var(--el-font-size-medium)}.el-skeleton__image{width:unset;display:flex;align-items:center;justify-content:center;border-radius:0}.el-skeleton__image svg{color:var(--el-svg-monochrome-grey);fill:currentColor;width:22%;height:22%}.el-skeleton{--el-skeleton-color:var(--el-fill-color);--el-skeleton-to-color:var(--el-fill-color-darker)}@-webkit-keyframes el-skeleton-loading{0%{background-position:100% 50%}100%{background-position:0 50%}}@keyframes el-skeleton-loading{0%{background-position:100% 50%}100%{background-position:0 50%}}.el-skeleton{width:100%}.el-skeleton__first-line{height:16px;margin-top:16px;background:var(--el-skeleton-color)}.el-skeleton__paragraph{height:16px;margin-top:16px;background:var(--el-skeleton-color)}.el-skeleton.is-animated .el-skeleton__item{background:linear-gradient(90deg,var(--el-skeleton-color) 25%,var(--el-skeleton-to-color) 37%,var(--el-skeleton-color) 63%);background-size:400% 100%;-webkit-animation:el-skeleton-loading 1.4s ease infinite;animation:el-skeleton-loading 1.4s ease infinite}.el-slider{--el-slider-main-bg-color:var(--el-color-primary);--el-slider-runway-bg-color:var(--el-border-color-light);--el-slider-stop-bg-color:var(--el-color-white);--el-slider-disabled-color:var(--el-text-color-placeholder);--el-slider-border-radius:3px;--el-slider-height:6px;--el-slider-button-size:20px;--el-slider-button-wrapper-size:36px;--el-slider-button-wrapper-offset:-15px}.el-slider{width:100%;height:32px;display:flex;align-items:center}.el-slider__runway{flex:1;height:var(--el-slider-height);background-color:var(--el-slider-runway-bg-color);border-radius:var(--el-slider-border-radius);position:relative;cursor:pointer}.el-slider__runway.show-input{margin-right:30px;width:auto}.el-slider__runway.is-disabled{cursor:default}.el-slider__runway.is-disabled .el-slider__bar{background-color:var(--el-slider-disabled-color)}.el-slider__runway.is-disabled .el-slider__button{border-color:var(--el-slider-disabled-color)}.el-slider__runway.is-disabled .el-slider__button-wrapper.hover,.el-slider__runway.is-disabled .el-slider__button-wrapper:hover{cursor:not-allowed}.el-slider__runway.is-disabled .el-slider__button-wrapper.dragging{cursor:not-allowed}.el-slider__runway.is-disabled .el-slider__button.dragging,.el-slider__runway.is-disabled .el-slider__button.hover,.el-slider__runway.is-disabled .el-slider__button:hover{transform:scale(1)}.el-slider__runway.is-disabled .el-slider__button.hover,.el-slider__runway.is-disabled .el-slider__button:hover{cursor:not-allowed}.el-slider__runway.is-disabled .el-slider__button.dragging{cursor:not-allowed}.el-slider__input{flex-shrink:0;width:130px}.el-slider__bar{height:var(--el-slider-height);background-color:var(--el-slider-main-bg-color);border-top-left-radius:var(--el-slider-border-radius);border-bottom-left-radius:var(--el-slider-border-radius);position:absolute}.el-slider__button-wrapper{height:var(--el-slider-button-wrapper-size);width:var(--el-slider-button-wrapper-size);position:absolute;z-index:1;top:var(--el-slider-button-wrapper-offset);transform:translateX(-50%);background-color:transparent;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;line-height:normal;outline:0}.el-slider__button-wrapper::after{display:inline-block;content:"";height:100%;vertical-align:middle}.el-slider__button-wrapper.hover,.el-slider__button-wrapper:hover{cursor:-webkit-grab;cursor:grab}.el-slider__button-wrapper.dragging{cursor:-webkit-grabbing;cursor:grabbing}.el-slider__button{display:inline-block;width:var(--el-slider-button-size);height:var(--el-slider-button-size);vertical-align:middle;border:solid 2px var(--el-slider-main-bg-color);background-color:var(--el-color-white);border-radius:50%;box-sizing:border-box;transition:var(--el-transition-duration-fast);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.el-slider__button.dragging,.el-slider__button.hover,.el-slider__button:hover{transform:scale(1.2)}.el-slider__button.hover,.el-slider__button:hover{cursor:-webkit-grab;cursor:grab}.el-slider__button.dragging{cursor:-webkit-grabbing;cursor:grabbing}.el-slider__stop{position:absolute;height:var(--el-slider-height);width:var(--el-slider-height);border-radius:var(--el-border-radius-circle);background-color:var(--el-slider-stop-bg-color);transform:translateX(-50%)}.el-slider__marks{top:0;left:12px;width:18px;height:100%}.el-slider__marks-text{position:absolute;transform:translateX(-50%);font-size:14px;color:var(--el-color-info);margin-top:15px;white-space:pre}.el-slider.is-vertical{position:relative;display:inline-flex;width:auto;height:100%;flex:0}.el-slider.is-vertical .el-slider__runway{width:var(--el-slider-height);height:100%;margin:0 16px}.el-slider.is-vertical .el-slider__bar{width:var(--el-slider-height);height:auto;border-radius:0 0 3px 3px}.el-slider.is-vertical .el-slider__button-wrapper{top:auto;left:var(--el-slider-button-wrapper-offset);transform:translateY(50%)}.el-slider.is-vertical .el-slider__stop{transform:translateY(50%)}.el-slider.is-vertical .el-slider__marks-text{margin-top:0;left:15px;transform:translateY(50%)}.el-slider--large{height:40px}.el-slider--small{height:24px}.el-space{display:inline-flex;vertical-align:top}.el-space__item{display:flex;flex-wrap:wrap}.el-space__item>*{flex:1}.el-space--vertical{flex-direction:column}.el-time-spinner{width:100%;white-space:nowrap}.el-spinner{display:inline-block;vertical-align:middle}.el-spinner-inner{-webkit-animation:rotate 2s linear infinite;animation:rotate 2s linear infinite;width:50px;height:50px}.el-spinner-inner .path{stroke:var(--el-border-color-lighter);stroke-linecap:round;-webkit-animation:dash 1.5s ease-in-out infinite;animation:dash 1.5s ease-in-out infinite}@-webkit-keyframes rotate{100%{transform:rotate(360deg)}}@keyframes rotate{100%{transform:rotate(360deg)}}@-webkit-keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}100%{stroke-dasharray:90,150;stroke-dashoffset:-124}}@keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}100%{stroke-dasharray:90,150;stroke-dashoffset:-124}}.el-step{position:relative;flex-shrink:1}.el-step:last-of-type .el-step__line{display:none}.el-step:last-of-type.is-flex{flex-basis:auto!important;flex-shrink:0;flex-grow:0}.el-step:last-of-type .el-step__description,.el-step:last-of-type .el-step__main{padding-right:0}.el-step__head{position:relative;width:100%}.el-step__head.is-process{color:var(--el-text-color-primary);border-color:var(--el-text-color-primary)}.el-step__head.is-wait{color:var(--el-text-color-placeholder);border-color:var(--el-text-color-placeholder)}.el-step__head.is-success{color:var(--el-color-success);border-color:var(--el-color-success)}.el-step__head.is-error{color:var(--el-color-danger);border-color:var(--el-color-danger)}.el-step__head.is-finish{color:var(--el-color-primary);border-color:var(--el-color-primary)}.el-step__icon{position:relative;z-index:1;display:inline-flex;justify-content:center;align-items:center;width:24px;height:24px;font-size:14px;box-sizing:border-box;background:var(--el-bg-color);transition:.15s ease-out}.el-step__icon.is-text{border-radius:50%;border:2px solid;border-color:inherit}.el-step__icon.is-icon{width:40px}.el-step__icon-inner{display:inline-block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-align:center;font-weight:700;line-height:1;color:inherit}.el-step__icon-inner[class*=el-icon]:not(.is-status){font-size:25px;font-weight:400}.el-step__icon-inner.is-status{transform:translateY(1px)}.el-step__line{position:absolute;border-color:inherit;background-color:var(--el-text-color-placeholder)}.el-step__line-inner{display:block;border-width:1px;border-style:solid;border-color:inherit;transition:.15s ease-out;box-sizing:border-box;width:0;height:0}.el-step__main{white-space:normal;text-align:left}.el-step__title{font-size:16px;line-height:38px}.el-step__title.is-process{font-weight:700;color:var(--el-text-color-primary)}.el-step__title.is-wait{color:var(--el-text-color-placeholder)}.el-step__title.is-success{color:var(--el-color-success)}.el-step__title.is-error{color:var(--el-color-danger)}.el-step__title.is-finish{color:var(--el-color-primary)}.el-step__description{padding-right:10%;margin-top:-5px;font-size:12px;line-height:20px;font-weight:400}.el-step__description.is-process{color:var(--el-text-color-primary)}.el-step__description.is-wait{color:var(--el-text-color-placeholder)}.el-step__description.is-success{color:var(--el-color-success)}.el-step__description.is-error{color:var(--el-color-danger)}.el-step__description.is-finish{color:var(--el-color-primary)}.el-step.is-horizontal{display:inline-block}.el-step.is-horizontal .el-step__line{height:2px;top:11px;left:0;right:0}.el-step.is-vertical{display:flex}.el-step.is-vertical .el-step__head{flex-grow:0;width:24px}.el-step.is-vertical .el-step__main{padding-left:10px;flex-grow:1}.el-step.is-vertical .el-step__title{line-height:24px;padding-bottom:8px}.el-step.is-vertical .el-step__line{width:2px;top:0;bottom:0;left:11px}.el-step.is-vertical .el-step__icon.is-icon{width:24px}.el-step.is-center .el-step__head{text-align:center}.el-step.is-center .el-step__main{text-align:center}.el-step.is-center .el-step__description{padding-left:20%;padding-right:20%}.el-step.is-center .el-step__line{left:50%;right:-50%}.el-step.is-simple{display:flex;align-items:center}.el-step.is-simple .el-step__head{width:auto;font-size:0;padding-right:10px}.el-step.is-simple .el-step__icon{background:0 0;width:16px;height:16px;font-size:12px}.el-step.is-simple .el-step__icon-inner[class*=el-icon]:not(.is-status){font-size:18px}.el-step.is-simple .el-step__icon-inner.is-status{transform:scale(.8) translateY(1px)}.el-step.is-simple .el-step__main{position:relative;display:flex;align-items:stretch;flex-grow:1}.el-step.is-simple .el-step__title{font-size:16px;line-height:20px}.el-step.is-simple:not(:last-of-type) .el-step__title{max-width:50%;word-break:break-all}.el-step.is-simple .el-step__arrow{flex-grow:1;display:flex;align-items:center;justify-content:center}.el-step.is-simple .el-step__arrow::after,.el-step.is-simple .el-step__arrow::before{content:"";display:inline-block;position:absolute;height:15px;width:1px;background:var(--el-text-color-placeholder)}.el-step.is-simple .el-step__arrow::before{transform:rotate(-45deg) translateY(-4px);transform-origin:0 0}.el-step.is-simple .el-step__arrow::after{transform:rotate(45deg) translateY(4px);transform-origin:100% 100%}.el-step.is-simple:last-of-type .el-step__arrow{display:none}.el-steps{display:flex}.el-steps--simple{padding:13px 8%;border-radius:4px;background:var(--el-fill-color-light)}.el-steps--horizontal{white-space:nowrap}.el-steps--vertical{height:100%;flex-flow:column}.el-switch{--el-switch-on-color:var(--el-color-primary);--el-switch-off-color:var(--el-border-color)}.el-switch{display:inline-flex;align-items:center;position:relative;font-size:14px;line-height:20px;height:32px;vertical-align:middle}.el-switch.is-disabled .el-switch__core,.el-switch.is-disabled .el-switch__label{cursor:not-allowed}.el-switch__label{transition:var(--el-transition-duration-fast);height:20px;display:inline-block;font-size:14px;font-weight:500;cursor:pointer;vertical-align:middle;color:var(--el-text-color-primary)}.el-switch__label.is-active{color:var(--el-color-primary)}.el-switch__label--left{margin-right:10px}.el-switch__label--right{margin-left:10px}.el-switch__label *{line-height:1;font-size:14px;display:inline-block}.el-switch__label .el-icon{height:inherit}.el-switch__label .el-icon svg{vertical-align:middle}.el-switch__input{position:absolute;width:0;height:0;opacity:0;margin:0}.el-switch__input:focus-visible~.el-switch__core{outline:2px solid var(--el-switch-on-color);outline-offset:1px}.el-switch__core{display:inline-flex;position:relative;align-items:center;min-width:40px;height:20px;border:1px solid var(--el-switch-border-color,var(--el-switch-off-color));outline:0;border-radius:10px;box-sizing:border-box;background:var(--el-switch-off-color);cursor:pointer;transition:border-color var(--el-transition-duration),background-color var(--el-transition-duration)}.el-switch__core .el-switch__inner{width:100%;transition:all var(--el-transition-duration);height:16px;display:flex;justify-content:center;align-items:center;overflow:hidden;padding:0 4px 0 calc(16px + 2px)}.el-switch__core .el-switch__inner .is-icon,.el-switch__core .el-switch__inner .is-text{font-size:12px;color:var(--el-color-white);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.el-switch__core .el-switch__action{position:absolute;left:1px;border-radius:var(--el-border-radius-circle);transition:all var(--el-transition-duration);width:16px;height:16px;background-color:var(--el-color-white);display:flex;justify-content:center;align-items:center;color:var(--el-switch-off-color)}.el-switch.is-checked .el-switch__core{border-color:var(--el-switch-border-color,var(--el-switch-on-color));background-color:var(--el-switch-on-color)}.el-switch.is-checked .el-switch__core .el-switch__action{left:calc(100% - 17px);color:var(--el-switch-on-color)}.el-switch.is-checked .el-switch__core .el-switch__inner{padding:0 calc(16px + 2px) 0 4px}.el-switch.is-disabled{opacity:.6}.el-switch--wide .el-switch__label.el-switch__label--left span{left:10px}.el-switch--wide .el-switch__label.el-switch__label--right span{right:10px}.el-switch .label-fade-enter-from,.el-switch .label-fade-leave-active{opacity:0}.el-switch--large{font-size:14px;line-height:24px;height:40px}.el-switch--large .el-switch__label{height:24px;font-size:14px}.el-switch--large .el-switch__label *{font-size:14px}.el-switch--large .el-switch__core{min-width:50px;height:24px;border-radius:12px}.el-switch--large .el-switch__core .el-switch__inner{height:20px;padding:0 6px 0 calc(20px + 2px)}.el-switch--large .el-switch__core .el-switch__action{width:20px;height:20px}.el-switch--large.is-checked .el-switch__core .el-switch__action{left:calc(100% - 21px)}.el-switch--large.is-checked .el-switch__core .el-switch__inner{padding:0 calc(20px + 2px) 0 6px}.el-switch--small{font-size:12px;line-height:16px;height:24px}.el-switch--small .el-switch__label{height:16px;font-size:12px}.el-switch--small .el-switch__label *{font-size:12px}.el-switch--small .el-switch__core{min-width:30px;height:16px;border-radius:8px}.el-switch--small .el-switch__core .el-switch__inner{height:12px;padding:0 2px 0 calc(12px + 2px)}.el-switch--small .el-switch__core .el-switch__action{width:12px;height:12px}.el-switch--small.is-checked .el-switch__core .el-switch__action{left:calc(100% - 13px)}.el-switch--small.is-checked .el-switch__core .el-switch__inner{padding:0 calc(12px + 2px) 0 2px}.el-table-column--selection .cell{padding-left:14px;padding-right:14px}.el-table-filter{border:solid 1px var(--el-border-color-lighter);border-radius:2px;background-color:#fff;box-shadow:var(--el-box-shadow-light);box-sizing:border-box}.el-table-filter__list{padding:5px 0;margin:0;list-style:none;min-width:100px}.el-table-filter__list-item{line-height:36px;padding:0 10px;cursor:pointer;font-size:var(--el-font-size-base)}.el-table-filter__list-item:hover{background-color:var(--el-color-primary-light-9);color:var(--el-color-primary)}.el-table-filter__list-item.is-active{background-color:var(--el-color-primary);color:#fff}.el-table-filter__content{min-width:100px}.el-table-filter__bottom{border-top:1px solid var(--el-border-color-lighter);padding:8px}.el-table-filter__bottom button{background:0 0;border:none;color:var(--el-text-color-regular);cursor:pointer;font-size:var(--el-font-size-small);padding:0 3px}.el-table-filter__bottom button:hover{color:var(--el-color-primary)}.el-table-filter__bottom button:focus{outline:0}.el-table-filter__bottom button.is-disabled{color:var(--el-disabled-text-color);cursor:not-allowed}.el-table-filter__wrap{max-height:280px}.el-table-filter__checkbox-group{padding:10px}.el-table-filter__checkbox-group label.el-checkbox{display:flex;align-items:center;margin-right:5px;margin-bottom:12px;margin-left:5px;height:unset}.el-table-filter__checkbox-group .el-checkbox:last-child{margin-bottom:0}.el-table{--el-table-border-color:var(--el-border-color-lighter);--el-table-border:1px solid var(--el-table-border-color);--el-table-text-color:var(--el-text-color-regular);--el-table-header-text-color:var(--el-text-color-secondary);--el-table-row-hover-bg-color:var(--el-fill-color-light);--el-table-current-row-bg-color:var(--el-color-primary-light-9);--el-table-header-bg-color:var(--el-bg-color);--el-table-fixed-box-shadow:var(--el-box-shadow-light);--el-table-bg-color:var(--el-fill-color-blank);--el-table-tr-bg-color:var(--el-fill-color-blank);--el-table-expanded-cell-bg-color:var(--el-fill-color-blank);--el-table-fixed-left-column:inset 10px 0 10px -10px rgba(0, 0, 0, 0.15);--el-table-fixed-right-column:inset -10px 0 10px -10px rgba(0, 0, 0, 0.15)}.el-table{position:relative;overflow:hidden;box-sizing:border-box;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;width:100%;max-width:100%;background-color:var(--el-table-bg-color);font-size:14px;color:var(--el-table-text-color)}.el-table__inner-wrapper{position:relative;display:flex;flex-direction:column;height:100%}.el-table__inner-wrapper::before{left:0;bottom:0;width:100%;height:1px}.el-table.has-footer.el-table--fluid-height tr:last-child td.el-table__cell,.el-table.has-footer.el-table--scrollable-y tr:last-child td.el-table__cell{border-bottom-color:transparent}.el-table__empty-block{position:-webkit-sticky;position:sticky;left:0;min-height:60px;text-align:center;width:100%;display:flex;justify-content:center;align-items:center}.el-table__empty-text{line-height:60px;width:50%;color:var(--el-text-color-secondary)}.el-table__expand-column .cell{padding:0;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.el-table__expand-icon{position:relative;cursor:pointer;color:var(--el-text-color-regular);font-size:12px;transition:transform var(--el-transition-duration-fast) ease-in-out;height:20px}.el-table__expand-icon--expanded{transform:rotate(90deg)}.el-table__expand-icon>.el-icon{font-size:12px}.el-table__expanded-cell{background-color:var(--el-table-expanded-cell-bg-color)}.el-table__expanded-cell[class*=cell]{padding:20px 50px}.el-table__expanded-cell:hover{background-color:transparent!important}.el-table__placeholder{display:inline-block;width:20px}.el-table__append-wrapper{overflow:hidden}.el-table--fit{border-right:0;border-bottom:0}.el-table--fit .el-table__cell.gutter{border-right-width:1px}.el-table thead{color:var(--el-table-header-text-color);font-weight:500}.el-table thead.is-group th.el-table__cell{background:var(--el-fill-color-light)}.el-table .el-table__cell{padding:8px 0;min-width:0;box-sizing:border-box;text-overflow:ellipsis;vertical-align:middle;position:relative;text-align:left;z-index:1}.el-table .el-table__cell.is-center{text-align:center}.el-table .el-table__cell.is-right{text-align:right}.el-table .el-table__cell.gutter{width:15px;border-right-width:0;border-bottom-width:0;padding:0}.el-table .el-table__cell.is-hidden>*{visibility:hidden}.el-table .cell{box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:normal;word-break:break-all;line-height:23px;padding:0 12px}.el-table .cell.el-tooltip{white-space:nowrap;min-width:50px}.el-table--large{font-size:var(--el-font-size-base)}.el-table--large .el-table__cell{padding:12px 0}.el-table--large .cell{padding:0 16px}.el-table--default{font-size:14px}.el-table--default .el-table__cell{padding:8px 0}.el-table--default .cell{padding:0 12px}.el-table--small{font-size:12px}.el-table--small .el-table__cell{padding:4px 0}.el-table--small .cell{padding:0 8px}.el-table tr{background-color:var(--el-table-tr-bg-color)}.el-table tr input[type=checkbox]{margin:0}.el-table td.el-table__cell,.el-table th.el-table__cell.is-leaf{border-bottom:var(--el-table-border)}.el-table th.el-table__cell.is-sortable{cursor:pointer}.el-table th.el-table__cell{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:var(--el-table-header-bg-color)}.el-table th.el-table__cell>.cell.highlight{color:var(--el-color-primary)}.el-table th.el-table__cell.required>div::before{display:inline-block;content:"";width:8px;height:8px;border-radius:50%;background:#ff4d51;margin-right:5px;vertical-align:middle}.el-table td.el-table__cell div{box-sizing:border-box}.el-table td.el-table__cell.gutter{width:0}.el-table__footer-wrapper{border-top:var(--el-table-border)}.el-table--border .el-table__inner-wrapper::after,.el-table--border::after,.el-table--border::before,.el-table__inner-wrapper::before{content:"";position:absolute;background-color:var(--el-table-border-color);z-index:3}.el-table--border .el-table__inner-wrapper::after{left:0;top:0;width:100%;height:1px}.el-table--border::before{top:-1px;left:0;width:1px;height:100%}.el-table--border::after{top:-1px;right:0;width:1px;height:100%}.el-table--border .el-table__inner-wrapper{border-right:none;border-bottom:none}.el-table--border .el-table__footer-wrapper{position:relative;flex-shrink:0}.el-table--border .el-table__cell{border-right:var(--el-table-border)}.el-table--border th.el-table__cell.gutter:last-of-type{border-bottom:var(--el-table-border);border-bottom-width:1px}.el-table--border th.el-table__cell{border-bottom:var(--el-table-border)}.el-table--hidden{visibility:hidden}.el-table__body-wrapper,.el-table__footer-wrapper,.el-table__header-wrapper{width:100%}.el-table__body-wrapper tr td.el-table-fixed-column--left,.el-table__body-wrapper tr td.el-table-fixed-column--right,.el-table__body-wrapper tr th.el-table-fixed-column--left,.el-table__body-wrapper tr th.el-table-fixed-column--right,.el-table__footer-wrapper tr td.el-table-fixed-column--left,.el-table__footer-wrapper tr td.el-table-fixed-column--right,.el-table__footer-wrapper tr th.el-table-fixed-column--left,.el-table__footer-wrapper tr th.el-table-fixed-column--right,.el-table__header-wrapper tr td.el-table-fixed-column--left,.el-table__header-wrapper tr td.el-table-fixed-column--right,.el-table__header-wrapper tr th.el-table-fixed-column--left,.el-table__header-wrapper tr th.el-table-fixed-column--right{position:-webkit-sticky!important;position:sticky!important;z-index:2;background:var(--el-bg-color)}.el-table__body-wrapper tr td.el-table-fixed-column--left.is-first-column::before,.el-table__body-wrapper tr td.el-table-fixed-column--left.is-last-column::before,.el-table__body-wrapper tr td.el-table-fixed-column--right.is-first-column::before,.el-table__body-wrapper tr td.el-table-fixed-column--right.is-last-column::before,.el-table__body-wrapper tr th.el-table-fixed-column--left.is-first-column::before,.el-table__body-wrapper tr th.el-table-fixed-column--left.is-last-column::before,.el-table__body-wrapper tr th.el-table-fixed-column--right.is-first-column::before,.el-table__body-wrapper tr th.el-table-fixed-column--right.is-last-column::before,.el-table__footer-wrapper tr td.el-table-fixed-column--left.is-first-column::before,.el-table__footer-wrapper tr td.el-table-fixed-column--left.is-last-column::before,.el-table__footer-wrapper tr td.el-table-fixed-column--right.is-first-column::before,.el-table__footer-wrapper tr td.el-table-fixed-column--right.is-last-column::before,.el-table__footer-wrapper tr th.el-table-fixed-column--left.is-first-column::before,.el-table__footer-wrapper tr th.el-table-fixed-column--left.is-last-column::before,.el-table__footer-wrapper tr th.el-table-fixed-column--right.is-first-column::before,.el-table__footer-wrapper tr th.el-table-fixed-column--right.is-last-column::before,.el-table__header-wrapper tr td.el-table-fixed-column--left.is-first-column::before,.el-table__header-wrapper tr td.el-table-fixed-column--left.is-last-column::before,.el-table__header-wrapper tr td.el-table-fixed-column--right.is-first-column::before,.el-table__header-wrapper tr td.el-table-fixed-column--right.is-last-column::before,.el-table__header-wrapper tr th.el-table-fixed-column--left.is-first-column::before,.el-table__header-wrapper tr th.el-table-fixed-column--left.is-last-column::before,.el-table__header-wrapper tr th.el-table-fixed-column--right.is-first-column::before,.el-table__header-wrapper tr th.el-table-fixed-column--right.is-last-column::before{content:"";position:absolute;top:0;width:10px;bottom:-1px;overflow-x:hidden;overflow-y:hidden;box-shadow:none;touch-action:none;pointer-events:none}.el-table__body-wrapper tr td.el-table-fixed-column--left.is-first-column::before,.el-table__body-wrapper tr td.el-table-fixed-column--right.is-first-column::before,.el-table__body-wrapper tr th.el-table-fixed-column--left.is-first-column::before,.el-table__body-wrapper tr th.el-table-fixed-column--right.is-first-column::before,.el-table__footer-wrapper tr td.el-table-fixed-column--left.is-first-column::before,.el-table__footer-wrapper tr td.el-table-fixed-column--right.is-first-column::before,.el-table__footer-wrapper tr th.el-table-fixed-column--left.is-first-column::before,.el-table__footer-wrapper tr th.el-table-fixed-column--right.is-first-column::before,.el-table__header-wrapper tr td.el-table-fixed-column--left.is-first-column::before,.el-table__header-wrapper tr td.el-table-fixed-column--right.is-first-column::before,.el-table__header-wrapper tr th.el-table-fixed-column--left.is-first-column::before,.el-table__header-wrapper tr th.el-table-fixed-column--right.is-first-column::before{left:-10px}.el-table__body-wrapper tr td.el-table-fixed-column--left.is-last-column::before,.el-table__body-wrapper tr td.el-table-fixed-column--right.is-last-column::before,.el-table__body-wrapper tr th.el-table-fixed-column--left.is-last-column::before,.el-table__body-wrapper tr th.el-table-fixed-column--right.is-last-column::before,.el-table__footer-wrapper tr td.el-table-fixed-column--left.is-last-column::before,.el-table__footer-wrapper tr td.el-table-fixed-column--right.is-last-column::before,.el-table__footer-wrapper tr th.el-table-fixed-column--left.is-last-column::before,.el-table__footer-wrapper tr th.el-table-fixed-column--right.is-last-column::before,.el-table__header-wrapper tr td.el-table-fixed-column--left.is-last-column::before,.el-table__header-wrapper tr td.el-table-fixed-column--right.is-last-column::before,.el-table__header-wrapper tr th.el-table-fixed-column--left.is-last-column::before,.el-table__header-wrapper tr th.el-table-fixed-column--right.is-last-column::before{right:-10px;box-shadow:none}.el-table__body-wrapper tr td.el-table__fixed-right-patch,.el-table__body-wrapper tr th.el-table__fixed-right-patch,.el-table__footer-wrapper tr td.el-table__fixed-right-patch,.el-table__footer-wrapper tr th.el-table__fixed-right-patch,.el-table__header-wrapper tr td.el-table__fixed-right-patch,.el-table__header-wrapper tr th.el-table__fixed-right-patch{position:-webkit-sticky!important;position:sticky!important;z-index:2;background:#fff;right:0}.el-table__header-wrapper{flex-shrink:0}.el-table__header-wrapper tr th.el-table-fixed-column--left,.el-table__header-wrapper tr th.el-table-fixed-column--right{background-color:var(--el-table-header-bg-color)}.el-table__body,.el-table__footer,.el-table__header{table-layout:fixed;border-collapse:separate}.el-table__footer-wrapper,.el-table__header-wrapper{overflow:hidden}.el-table__footer-wrapper tbody td.el-table__cell,.el-table__header-wrapper tbody td.el-table__cell{background-color:var(--el-table-row-hover-bg-color);color:var(--el-table-text-color)}.el-table__body-wrapper .el-table-column--selection>.cell,.el-table__header-wrapper .el-table-column--selection>.cell{display:inline-flex;align-items:center;height:23px}.el-table__body-wrapper .el-table-column--selection .el-checkbox,.el-table__header-wrapper .el-table-column--selection .el-checkbox{height:unset}.el-table.is-scrolling-left .el-table-fixed-column--right.is-first-column::before{box-shadow:var(--el-table-fixed-right-column)}.el-table.is-scrolling-left.el-table--border .el-table-fixed-column--left.is-last-column.el-table__cell{border-right:var(--el-table-border)}.el-table.is-scrolling-left th.el-table-fixed-column--left{background-color:var(--el-table-header-bg-color)}.el-table.is-scrolling-right .el-table-fixed-column--left.is-last-column::before{box-shadow:var(--el-table-fixed-left-column)}.el-table.is-scrolling-right .el-table-fixed-column--left.is-last-column.el-table__cell{border-right:none}.el-table.is-scrolling-right th.el-table-fixed-column--right{background-color:var(--el-table-header-bg-color)}.el-table.is-scrolling-middle .el-table-fixed-column--left.is-last-column.el-table__cell{border-right:none}.el-table.is-scrolling-middle .el-table-fixed-column--right.is-first-column::before{box-shadow:var(--el-table-fixed-right-column)}.el-table.is-scrolling-middle .el-table-fixed-column--left.is-last-column::before{box-shadow:var(--el-table-fixed-left-column)}.el-table.is-scrolling-none .el-table-fixed-column--left.is-first-column::before,.el-table.is-scrolling-none .el-table-fixed-column--left.is-last-column::before,.el-table.is-scrolling-none .el-table-fixed-column--right.is-first-column::before,.el-table.is-scrolling-none .el-table-fixed-column--right.is-last-column::before{box-shadow:none}.el-table.is-scrolling-none th.el-table-fixed-column--left,.el-table.is-scrolling-none th.el-table-fixed-column--right{background-color:var(--el-table-header-bg-color)}.el-table__body-wrapper{overflow:hidden;position:relative;flex:1}.el-table__body-wrapper .el-scrollbar__bar{z-index:2}.el-table .caret-wrapper{display:inline-flex;flex-direction:column;align-items:center;height:14px;width:24px;vertical-align:middle;cursor:pointer;overflow:initial;position:relative}.el-table .sort-caret{width:0;height:0;border:solid 5px transparent;position:absolute;left:7px}.el-table .sort-caret.ascending{border-bottom-color:var(--el-text-color-placeholder);top:-5px}.el-table .sort-caret.descending{border-top-color:var(--el-text-color-placeholder);bottom:-3px}.el-table .ascending .sort-caret.ascending{border-bottom-color:var(--el-color-primary)}.el-table .descending .sort-caret.descending{border-top-color:var(--el-color-primary)}.el-table .hidden-columns{visibility:hidden;position:absolute;z-index:-1}.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell{background:var(--el-fill-color-lighter)}.el-table--striped .el-table__body tr.el-table__row--striped.current-row td.el-table__cell{background-color:var(--el-table-current-row-bg-color)}.el-table__body tr.hover-row.current-row>td.el-table__cell,.el-table__body tr.hover-row.el-table__row--striped.current-row>td.el-table__cell,.el-table__body tr.hover-row.el-table__row--striped>td.el-table__cell,.el-table__body tr.hover-row>td.el-table__cell{background-color:var(--el-table-row-hover-bg-color)}.el-table__body tr.current-row>td.el-table__cell{background-color:var(--el-table-current-row-bg-color)}.el-table__column-resize-proxy{position:absolute;left:200px;top:0;bottom:0;width:0;border-left:var(--el-table-border);z-index:10}.el-table__column-filter-trigger{display:inline-block;cursor:pointer}.el-table__column-filter-trigger i{color:var(--el-color-info);font-size:14px;vertical-align:middle}.el-table__border-left-patch{top:0;left:0;width:1px;height:100%;z-index:3;position:absolute;background-color:var(--el-table-border-color)}.el-table__border-bottom-patch{left:0;height:1px;z-index:3;position:absolute;background-color:var(--el-table-border-color)}.el-table__border-right-patch{top:0;height:100%;width:1px;z-index:3;position:absolute;background-color:var(--el-table-border-color)}.el-table--enable-row-transition .el-table__body td.el-table__cell{transition:background-color .25s ease}.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell{background-color:var(--el-table-row-hover-bg-color)}.el-table [class*=el-table__row--level] .el-table__expand-icon{display:inline-block;width:12px;line-height:12px;height:12px;text-align:center;margin-right:8px}.el-table .el-table.el-table--border .el-table__cell{border-right:var(--el-table-border)}.el-table:not(.el-table--border) .el-table__cell{border-right:none}.el-table:not(.el-table--border)>.el-table__inner-wrapper::after{content:none}.el-table-v2{--el-table-border-color:var(--el-border-color-lighter);--el-table-border:1px solid var(--el-table-border-color);--el-table-text-color:var(--el-text-color-regular);--el-table-header-text-color:var(--el-text-color-secondary);--el-table-row-hover-bg-color:var(--el-fill-color-light);--el-table-current-row-bg-color:var(--el-color-primary-light-9);--el-table-header-bg-color:var(--el-bg-color);--el-table-fixed-box-shadow:var(--el-box-shadow-light);--el-table-bg-color:var(--el-fill-color-blank);--el-table-tr-bg-color:var(--el-fill-color-blank);--el-table-expanded-cell-bg-color:var(--el-fill-color-blank);--el-table-fixed-left-column:inset 10px 0 10px -10px rgba(0, 0, 0, 0.15);--el-table-fixed-right-column:inset -10px 0 10px -10px rgba(0, 0, 0, 0.15)}.el-table-v2{font-size:14px}.el-table-v2 *{box-sizing:border-box}.el-table-v2__root{position:relative}.el-table-v2__root:hover .el-table-v2__main .el-virtual-scrollbar{opacity:1}.el-table-v2__main{display:flex;flex-direction:column-reverse;position:absolute;overflow:hidden;top:0;background-color:var(--el-bg-color);left:0}.el-table-v2__main .el-vl__horizontal,.el-table-v2__main .el-vl__vertical{z-index:2}.el-table-v2__left{display:flex;flex-direction:column-reverse;position:absolute;overflow:hidden;top:0;background-color:var(--el-bg-color);left:0;box-shadow:2px 0 4px 0 rgba(0,0,0,.06)}.el-table-v2__left .el-virtual-scrollbar{opacity:0}.el-table-v2__left .el-vl__horizontal,.el-table-v2__left .el-vl__vertical{z-index:-1}.el-table-v2__right{display:flex;flex-direction:column-reverse;position:absolute;overflow:hidden;top:0;background-color:var(--el-bg-color);right:0;box-shadow:-2px 0 4px 0 rgba(0,0,0,.06)}.el-table-v2__right .el-virtual-scrollbar{opacity:0}.el-table-v2__right .el-vl__horizontal,.el-table-v2__right .el-vl__vertical{z-index:-1}.el-table-v2__header-row{-webkit-padding-end:var(--el-table-scrollbar-size);padding-inline-end:var(--el-table-scrollbar-size)}.el-table-v2__row{-webkit-padding-end:var(--el-table-scrollbar-size);padding-inline-end:var(--el-table-scrollbar-size)}.el-table-v2__header-wrapper{overflow:hidden}.el-table-v2__header{position:relative;overflow:hidden}.el-table-v2__footer{position:absolute;left:0;right:0;bottom:0;overflow:hidden}.el-table-v2__empty{position:absolute;left:0}.el-table-v2__overlay{position:absolute;left:0;right:0;top:0;bottom:0;z-index:9999}.el-table-v2__header-row{display:flex;border-bottom:var(--el-table-border)}.el-table-v2__header-cell{display:flex;align-items:center;padding:0 8px;height:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overflow:hidden;background-color:var(--el-table-header-bg-color);color:var(--el-table-header-text-color);font-weight:700}.el-table-v2__header-cell.is-align-center{justify-content:center;text-align:center}.el-table-v2__header-cell.is-align-right{justify-content:flex-end;text-align:right}.el-table-v2__header-cell.is-sortable{cursor:pointer}.el-table-v2__header-cell:hover .el-icon{display:block}.el-table-v2__sort-icon{transition:opacity,display var(--el-transition-duration);opacity:.6;display:none}.el-table-v2__sort-icon.is-sorting{display:block;opacity:1}.el-table-v2__row{border-bottom:var(--el-table-border);display:flex;align-items:center;transition:background-color var(--el-transition-duration)}.el-table-v2__row.is-hovered{background-color:var(--el-table-row-hover-bg-color)}.el-table-v2__row:hover{background-color:var(--el-table-row-hover-bg-color)}.el-table-v2__row-cell{height:100%;overflow:hidden;display:flex;align-items:center;padding:0 8px}.el-table-v2__row-cell.is-align-center{justify-content:center;text-align:center}.el-table-v2__row-cell.is-align-right{justify-content:flex-end;text-align:right}.el-table-v2__expand-icon{margin:0 4px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.el-table-v2__expand-icon svg{transition:transform var(--el-transition-duration)}.el-table-v2__expand-icon.is-expanded svg{transform:rotate(90deg)}.el-table-v2:not(.is-dynamic) .el-table-v2__cell-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.el-table-v2.is-dynamic .el-table-v2__row{overflow:hidden;align-items:stretch}.el-table-v2.is-dynamic .el-table-v2__row .el-table-v2__row-cell{word-break:break-all}.el-tabs{--el-tabs-header-height:40px}.el-tabs__header{padding:0;position:relative;margin:0 0 15px}.el-tabs__active-bar{position:absolute;bottom:0;left:0;height:2px;background-color:var(--el-color-primary);z-index:1;transition:width var(--el-transition-duration) var(--el-transition-function-ease-in-out-bezier),transform var(--el-transition-duration) var(--el-transition-function-ease-in-out-bezier);list-style:none}.el-tabs__new-tab{display:flex;align-items:center;justify-content:center;float:right;border:1px solid var(--el-border-color);height:20px;width:20px;line-height:20px;margin:10px 0 10px 10px;border-radius:3px;text-align:center;font-size:12px;color:var(--el-text-color-primary);cursor:pointer;transition:all .15s}.el-tabs__new-tab .is-icon-plus{height:inherit;width:inherit;transform:scale(.8,.8)}.el-tabs__new-tab .is-icon-plus svg{vertical-align:middle}.el-tabs__new-tab:hover{color:var(--el-color-primary)}.el-tabs__nav-wrap{overflow:hidden;margin-bottom:-1px;position:relative}.el-tabs__nav-wrap::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background-color:var(--el-border-color-light);z-index:var(--el-index-normal)}.el-tabs__nav-wrap.is-scrollable{padding:0 20px;box-sizing:border-box}.el-tabs__nav-scroll{overflow:hidden}.el-tabs__nav-next,.el-tabs__nav-prev{position:absolute;cursor:pointer;line-height:44px;font-size:12px;color:var(--el-text-color-secondary);width:20px;text-align:center}.el-tabs__nav-next{right:0}.el-tabs__nav-prev{left:0}.el-tabs__nav{display:flex;white-space:nowrap;position:relative;transition:transform var(--el-transition-duration);float:left;z-index:calc(var(--el-index-normal) + 1)}.el-tabs__nav.is-stretch{min-width:100%;display:flex}.el-tabs__nav.is-stretch>*{flex:1;text-align:center}.el-tabs__item{padding:0 20px;height:var(--el-tabs-header-height);box-sizing:border-box;display:flex;align-items:center;justify-content:center;list-style:none;font-size:var(--el-font-size-base);font-weight:500;color:var(--el-text-color-primary);position:relative}.el-tabs__item:focus,.el-tabs__item:focus:active{outline:0}.el-tabs__item:focus-visible{box-shadow:0 0 2px 2px var(--el-color-primary) inset;border-radius:3px}.el-tabs__item .is-icon-close{border-radius:50%;text-align:center;transition:all var(--el-transition-duration) var(--el-transition-function-ease-in-out-bezier);margin-left:5px}.el-tabs__item .is-icon-close:before{transform:scale(.9);display:inline-block}.el-tabs__item .is-icon-close:hover{background-color:var(--el-text-color-placeholder);color:#fff}.el-tabs__item.is-active{color:var(--el-color-primary)}.el-tabs__item:hover{color:var(--el-color-primary);cursor:pointer}.el-tabs__item.is-disabled{color:var(--el-disabled-text-color);cursor:not-allowed}.el-tabs__content{overflow:hidden;position:relative}.el-tabs--card>.el-tabs__header{border-bottom:1px solid var(--el-border-color-light);height:var(--el-tabs-header-height)}.el-tabs--card>.el-tabs__header .el-tabs__nav-wrap::after{content:none}.el-tabs--card>.el-tabs__header .el-tabs__nav{border:1px solid var(--el-border-color-light);border-bottom:none;border-radius:4px 4px 0 0;box-sizing:border-box}.el-tabs--card>.el-tabs__header .el-tabs__active-bar{display:none}.el-tabs--card>.el-tabs__header .el-tabs__item .is-icon-close{position:relative;font-size:12px;width:0;height:14px;overflow:hidden;right:-2px;transform-origin:100% 50%}.el-tabs--card>.el-tabs__header .el-tabs__item{border-bottom:1px solid transparent;border-left:1px solid var(--el-border-color-light);transition:color var(--el-transition-duration) var(--el-transition-function-ease-in-out-bezier),padding var(--el-transition-duration) var(--el-transition-function-ease-in-out-bezier)}.el-tabs--card>.el-tabs__header .el-tabs__item:first-child{border-left:none}.el-tabs--card>.el-tabs__header .el-tabs__item.is-closable:hover{padding-left:13px;padding-right:13px}.el-tabs--card>.el-tabs__header .el-tabs__item.is-closable:hover .is-icon-close{width:14px}.el-tabs--card>.el-tabs__header .el-tabs__item.is-active{border-bottom-color:var(--el-bg-color)}.el-tabs--card>.el-tabs__header .el-tabs__item.is-active.is-closable{padding-left:20px;padding-right:20px}.el-tabs--card>.el-tabs__header .el-tabs__item.is-active.is-closable .is-icon-close{width:14px}.el-tabs--border-card{background:var(--el-bg-color-overlay);border:1px solid var(--el-border-color)}.el-tabs--border-card>.el-tabs__content{padding:15px}.el-tabs--border-card>.el-tabs__header{background-color:var(--el-fill-color-light);border-bottom:1px solid var(--el-border-color-light);margin:0}.el-tabs--border-card>.el-tabs__header .el-tabs__nav-wrap::after{content:none}.el-tabs--border-card>.el-tabs__header .el-tabs__item{transition:all var(--el-transition-duration) var(--el-transition-function-ease-in-out-bezier);border:1px solid transparent;margin-top:-1px;color:var(--el-text-color-secondary)}.el-tabs--border-card>.el-tabs__header .el-tabs__item:first-child{margin-left:-1px}.el-tabs--border-card>.el-tabs__header .el-tabs__item+.el-tabs__item{margin-left:-1px}.el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active{color:var(--el-color-primary);background-color:var(--el-bg-color-overlay);border-right-color:var(--el-border-color);border-left-color:var(--el-border-color)}.el-tabs--border-card>.el-tabs__header .el-tabs__item:not(.is-disabled):hover{color:var(--el-color-primary)}.el-tabs--border-card>.el-tabs__header .el-tabs__item.is-disabled{color:var(--el-disabled-text-color)}.el-tabs--border-card>.el-tabs__header .is-scrollable .el-tabs__item:first-child{margin-left:0}.el-tabs--bottom .el-tabs__item.is-bottom:nth-child(2),.el-tabs--bottom .el-tabs__item.is-top:nth-child(2),.el-tabs--top .el-tabs__item.is-bottom:nth-child(2),.el-tabs--top .el-tabs__item.is-top:nth-child(2){padding-left:0}.el-tabs--bottom .el-tabs__item.is-bottom:last-child,.el-tabs--bottom .el-tabs__item.is-top:last-child,.el-tabs--top .el-tabs__item.is-bottom:last-child,.el-tabs--top .el-tabs__item.is-top:last-child{padding-right:0}.el-tabs--bottom .el-tabs--left>.el-tabs__header .el-tabs__item:nth-child(2),.el-tabs--bottom .el-tabs--right>.el-tabs__header .el-tabs__item:nth-child(2),.el-tabs--bottom.el-tabs--border-card>.el-tabs__header .el-tabs__item:nth-child(2),.el-tabs--bottom.el-tabs--card>.el-tabs__header .el-tabs__item:nth-child(2),.el-tabs--top .el-tabs--left>.el-tabs__header .el-tabs__item:nth-child(2),.el-tabs--top .el-tabs--right>.el-tabs__header .el-tabs__item:nth-child(2),.el-tabs--top.el-tabs--border-card>.el-tabs__header .el-tabs__item:nth-child(2),.el-tabs--top.el-tabs--card>.el-tabs__header .el-tabs__item:nth-child(2){padding-left:20px}.el-tabs--bottom .el-tabs--left>.el-tabs__header .el-tabs__item:nth-child(2):not(.is-active).is-closable:hover,.el-tabs--bottom .el-tabs--right>.el-tabs__header .el-tabs__item:nth-child(2):not(.is-active).is-closable:hover,.el-tabs--bottom.el-tabs--border-card>.el-tabs__header .el-tabs__item:nth-child(2):not(.is-active).is-closable:hover,.el-tabs--bottom.el-tabs--card>.el-tabs__header .el-tabs__item:nth-child(2):not(.is-active).is-closable:hover,.el-tabs--top .el-tabs--left>.el-tabs__header .el-tabs__item:nth-child(2):not(.is-active).is-closable:hover,.el-tabs--top .el-tabs--right>.el-tabs__header .el-tabs__item:nth-child(2):not(.is-active).is-closable:hover,.el-tabs--top.el-tabs--border-card>.el-tabs__header .el-tabs__item:nth-child(2):not(.is-active).is-closable:hover,.el-tabs--top.el-tabs--card>.el-tabs__header .el-tabs__item:nth-child(2):not(.is-active).is-closable:hover{padding-left:13px}.el-tabs--bottom .el-tabs--left>.el-tabs__header .el-tabs__item:last-child,.el-tabs--bottom .el-tabs--right>.el-tabs__header .el-tabs__item:last-child,.el-tabs--bottom.el-tabs--border-card>.el-tabs__header .el-tabs__item:last-child,.el-tabs--bottom.el-tabs--card>.el-tabs__header .el-tabs__item:last-child,.el-tabs--top .el-tabs--left>.el-tabs__header .el-tabs__item:last-child,.el-tabs--top .el-tabs--right>.el-tabs__header .el-tabs__item:last-child,.el-tabs--top.el-tabs--border-card>.el-tabs__header .el-tabs__item:last-child,.el-tabs--top.el-tabs--card>.el-tabs__header .el-tabs__item:last-child{padding-right:20px}.el-tabs--bottom .el-tabs--left>.el-tabs__header .el-tabs__item:last-child:not(.is-active).is-closable:hover,.el-tabs--bottom .el-tabs--right>.el-tabs__header .el-tabs__item:last-child:not(.is-active).is-closable:hover,.el-tabs--bottom.el-tabs--border-card>.el-tabs__header .el-tabs__item:last-child:not(.is-active).is-closable:hover,.el-tabs--bottom.el-tabs--card>.el-tabs__header .el-tabs__item:last-child:not(.is-active).is-closable:hover,.el-tabs--top .el-tabs--left>.el-tabs__header .el-tabs__item:last-child:not(.is-active).is-closable:hover,.el-tabs--top .el-tabs--right>.el-tabs__header .el-tabs__item:last-child:not(.is-active).is-closable:hover,.el-tabs--top.el-tabs--border-card>.el-tabs__header .el-tabs__item:last-child:not(.is-active).is-closable:hover,.el-tabs--top.el-tabs--card>.el-tabs__header .el-tabs__item:last-child:not(.is-active).is-closable:hover{padding-right:13px}.el-tabs--bottom .el-tabs__header.is-bottom{margin-bottom:0;margin-top:10px}.el-tabs--bottom.el-tabs--border-card .el-tabs__header.is-bottom{border-bottom:0;border-top:1px solid var(--el-border-color)}.el-tabs--bottom.el-tabs--border-card .el-tabs__nav-wrap.is-bottom{margin-top:-1px;margin-bottom:0}.el-tabs--bottom.el-tabs--border-card .el-tabs__item.is-bottom:not(.is-active){border:1px solid transparent}.el-tabs--bottom.el-tabs--border-card .el-tabs__item.is-bottom{margin:0 -1px -1px}.el-tabs--left,.el-tabs--right{overflow:hidden}.el-tabs--left .el-tabs__header.is-left,.el-tabs--left .el-tabs__header.is-right,.el-tabs--left .el-tabs__nav-scroll,.el-tabs--left .el-tabs__nav-wrap.is-left,.el-tabs--left .el-tabs__nav-wrap.is-right,.el-tabs--right .el-tabs__header.is-left,.el-tabs--right .el-tabs__header.is-right,.el-tabs--right .el-tabs__nav-scroll,.el-tabs--right .el-tabs__nav-wrap.is-left,.el-tabs--right .el-tabs__nav-wrap.is-right{height:100%}.el-tabs--left .el-tabs__active-bar.is-left,.el-tabs--left .el-tabs__active-bar.is-right,.el-tabs--right .el-tabs__active-bar.is-left,.el-tabs--right .el-tabs__active-bar.is-right{top:0;bottom:auto;width:2px;height:auto}.el-tabs--left .el-tabs__nav-wrap.is-left,.el-tabs--left .el-tabs__nav-wrap.is-right,.el-tabs--right .el-tabs__nav-wrap.is-left,.el-tabs--right .el-tabs__nav-wrap.is-right{margin-bottom:0}.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-next,.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev,.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-next,.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev,.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-next,.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev,.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-next,.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev{height:30px;line-height:30px;width:100%;text-align:center;cursor:pointer}.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-next i,.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev i,.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-next i,.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev i,.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-next i,.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev i,.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-next i,.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev i{transform:rotateZ(90deg)}.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev,.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev,.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev,.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev{left:auto;top:0}.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-next,.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-next,.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-next,.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-next{right:auto;bottom:0}.el-tabs--left .el-tabs__nav-wrap.is-left.is-scrollable,.el-tabs--left .el-tabs__nav-wrap.is-right.is-scrollable,.el-tabs--right .el-tabs__nav-wrap.is-left.is-scrollable,.el-tabs--right .el-tabs__nav-wrap.is-right.is-scrollable{padding:30px 0}.el-tabs--left .el-tabs__nav-wrap.is-left::after,.el-tabs--left .el-tabs__nav-wrap.is-right::after,.el-tabs--right .el-tabs__nav-wrap.is-left::after,.el-tabs--right .el-tabs__nav-wrap.is-right::after{height:100%;width:2px;bottom:auto;top:0}.el-tabs--left .el-tabs__nav.is-left,.el-tabs--left .el-tabs__nav.is-right,.el-tabs--right .el-tabs__nav.is-left,.el-tabs--right .el-tabs__nav.is-right{flex-direction:column}.el-tabs--left .el-tabs__item.is-left,.el-tabs--right .el-tabs__item.is-left{justify-content:flex-end}.el-tabs--left .el-tabs__item.is-right,.el-tabs--right .el-tabs__item.is-right{justify-content:flex-start}.el-tabs--left .el-tabs__header.is-left{float:left;margin-bottom:0;margin-right:10px}.el-tabs--left .el-tabs__nav-wrap.is-left{margin-right:-1px}.el-tabs--left .el-tabs__nav-wrap.is-left::after{left:auto;right:0}.el-tabs--left .el-tabs__active-bar.is-left{right:0;left:auto}.el-tabs--left .el-tabs__item.is-left{text-align:right}.el-tabs--left.el-tabs--card .el-tabs__active-bar.is-left{display:none}.el-tabs--left.el-tabs--card .el-tabs__item.is-left{border-left:none;border-right:1px solid var(--el-border-color-light);border-bottom:none;border-top:1px solid var(--el-border-color-light);text-align:left}.el-tabs--left.el-tabs--card .el-tabs__item.is-left:first-child{border-right:1px solid var(--el-border-color-light);border-top:none}.el-tabs--left.el-tabs--card .el-tabs__item.is-left.is-active{border:1px solid var(--el-border-color-light);border-right-color:#fff;border-left:none;border-bottom:none}.el-tabs--left.el-tabs--card .el-tabs__item.is-left.is-active:first-child{border-top:none}.el-tabs--left.el-tabs--card .el-tabs__item.is-left.is-active:last-child{border-bottom:none}.el-tabs--left.el-tabs--card .el-tabs__nav{border-radius:4px 0 0 4px;border-bottom:1px solid var(--el-border-color-light);border-right:none}.el-tabs--left.el-tabs--card .el-tabs__new-tab{float:none}.el-tabs--left.el-tabs--border-card .el-tabs__header.is-left{border-right:1px solid var(--el-border-color)}.el-tabs--left.el-tabs--border-card .el-tabs__item.is-left{border:1px solid transparent;margin:-1px 0 -1px -1px}.el-tabs--left.el-tabs--border-card .el-tabs__item.is-left.is-active{border-color:transparent;border-top-color:#d1dbe5;border-bottom-color:#d1dbe5}.el-tabs--right .el-tabs__header.is-right{float:right;margin-bottom:0;margin-left:10px}.el-tabs--right .el-tabs__nav-wrap.is-right{margin-left:-1px}.el-tabs--right .el-tabs__nav-wrap.is-right::after{left:0;right:auto}.el-tabs--right .el-tabs__active-bar.is-right{left:0}.el-tabs--right.el-tabs--card .el-tabs__active-bar.is-right{display:none}.el-tabs--right.el-tabs--card .el-tabs__item.is-right{border-bottom:none;border-top:1px solid var(--el-border-color-light)}.el-tabs--right.el-tabs--card .el-tabs__item.is-right:first-child{border-left:1px solid var(--el-border-color-light);border-top:none}.el-tabs--right.el-tabs--card .el-tabs__item.is-right.is-active{border:1px solid var(--el-border-color-light);border-left-color:#fff;border-right:none;border-bottom:none}.el-tabs--right.el-tabs--card .el-tabs__item.is-right.is-active:first-child{border-top:none}.el-tabs--right.el-tabs--card .el-tabs__item.is-right.is-active:last-child{border-bottom:none}.el-tabs--right.el-tabs--card .el-tabs__nav{border-radius:0 4px 4px 0;border-bottom:1px solid var(--el-border-color-light);border-left:none}.el-tabs--right.el-tabs--border-card .el-tabs__header.is-right{border-left:1px solid var(--el-border-color)}.el-tabs--right.el-tabs--border-card .el-tabs__item.is-right{border:1px solid transparent;margin:-1px -1px -1px 0}.el-tabs--right.el-tabs--border-card .el-tabs__item.is-right.is-active{border-color:transparent;border-top-color:#d1dbe5;border-bottom-color:#d1dbe5}.slideInLeft-transition,.slideInRight-transition{display:inline-block}.slideInRight-enter{-webkit-animation:slideInRight-enter var(--el-transition-duration);animation:slideInRight-enter var(--el-transition-duration)}.slideInRight-leave{position:absolute;left:0;right:0;-webkit-animation:slideInRight-leave var(--el-transition-duration);animation:slideInRight-leave var(--el-transition-duration)}.slideInLeft-enter{-webkit-animation:slideInLeft-enter var(--el-transition-duration);animation:slideInLeft-enter var(--el-transition-duration)}.slideInLeft-leave{position:absolute;left:0;right:0;-webkit-animation:slideInLeft-leave var(--el-transition-duration);animation:slideInLeft-leave var(--el-transition-duration)}@-webkit-keyframes slideInRight-enter{0%{opacity:0;transform-origin:0 0;transform:translateX(100%)}to{opacity:1;transform-origin:0 0;transform:translateX(0)}}@keyframes slideInRight-enter{0%{opacity:0;transform-origin:0 0;transform:translateX(100%)}to{opacity:1;transform-origin:0 0;transform:translateX(0)}}@-webkit-keyframes slideInRight-leave{0%{transform-origin:0 0;transform:translateX(0);opacity:1}100%{transform-origin:0 0;transform:translateX(100%);opacity:0}}@keyframes slideInRight-leave{0%{transform-origin:0 0;transform:translateX(0);opacity:1}100%{transform-origin:0 0;transform:translateX(100%);opacity:0}}@-webkit-keyframes slideInLeft-enter{0%{opacity:0;transform-origin:0 0;transform:translateX(-100%)}to{opacity:1;transform-origin:0 0;transform:translateX(0)}}@keyframes slideInLeft-enter{0%{opacity:0;transform-origin:0 0;transform:translateX(-100%)}to{opacity:1;transform-origin:0 0;transform:translateX(0)}}@-webkit-keyframes slideInLeft-leave{0%{transform-origin:0 0;transform:translateX(0);opacity:1}100%{transform-origin:0 0;transform:translateX(-100%);opacity:0}}@keyframes slideInLeft-leave{0%{transform-origin:0 0;transform:translateX(0);opacity:1}100%{transform-origin:0 0;transform:translateX(-100%);opacity:0}}.el-tag{--el-tag-font-size:12px;--el-tag-border-radius:4px;--el-tag-border-radius-rounded:9999px}.el-tag{--el-tag-bg-color:var(--el-color-primary-light-9);--el-tag-border-color:var(--el-color-primary-light-8);--el-tag-hover-color:var(--el-color-primary);--el-tag-text-color:var(--el-color-primary);background-color:var(--el-tag-bg-color);border-color:var(--el-tag-border-color);color:var(--el-tag-text-color);display:inline-flex;justify-content:center;align-items:center;height:24px;padding:0 9px;font-size:var(--el-tag-font-size);line-height:1;border-width:1px;border-style:solid;border-radius:var(--el-tag-border-radius);box-sizing:border-box;white-space:nowrap;--el-icon-size:14px}.el-tag.el-tag--primary{--el-tag-bg-color:var(--el-color-primary-light-9);--el-tag-border-color:var(--el-color-primary-light-8);--el-tag-hover-color:var(--el-color-primary)}.el-tag.el-tag--success{--el-tag-bg-color:var(--el-color-success-light-9);--el-tag-border-color:var(--el-color-success-light-8);--el-tag-hover-color:var(--el-color-success)}.el-tag.el-tag--warning{--el-tag-bg-color:var(--el-color-warning-light-9);--el-tag-border-color:var(--el-color-warning-light-8);--el-tag-hover-color:var(--el-color-warning)}.el-tag.el-tag--danger{--el-tag-bg-color:var(--el-color-danger-light-9);--el-tag-border-color:var(--el-color-danger-light-8);--el-tag-hover-color:var(--el-color-danger)}.el-tag.el-tag--error{--el-tag-bg-color:var(--el-color-error-light-9);--el-tag-border-color:var(--el-color-error-light-8);--el-tag-hover-color:var(--el-color-error)}.el-tag.el-tag--info{--el-tag-bg-color:var(--el-color-info-light-9);--el-tag-border-color:var(--el-color-info-light-8);--el-tag-hover-color:var(--el-color-info)}.el-tag.el-tag--primary{--el-tag-text-color:var(--el-color-primary)}.el-tag.el-tag--success{--el-tag-text-color:var(--el-color-success)}.el-tag.el-tag--warning{--el-tag-text-color:var(--el-color-warning)}.el-tag.el-tag--danger{--el-tag-text-color:var(--el-color-danger)}.el-tag.el-tag--error{--el-tag-text-color:var(--el-color-error)}.el-tag.el-tag--info{--el-tag-text-color:var(--el-color-info)}.el-tag.is-hit{border-color:var(--el-color-primary)}.el-tag.is-round{border-radius:var(--el-tag-border-radius-rounded)}.el-tag .el-tag__close{color:var(--el-tag-text-color)}.el-tag .el-tag__close:hover{color:var(--el-color-white);background-color:var(--el-tag-hover-color)}.el-tag .el-icon{border-radius:50%;cursor:pointer;font-size:calc(var(--el-icon-size) - 2px);height:var(--el-icon-size);width:var(--el-icon-size)}.el-tag .el-tag__close{margin-left:6px}.el-tag--dark{--el-tag-bg-color:var(--el-color-primary);--el-tag-border-color:var(--el-color-primary);--el-tag-hover-color:var(--el-color-primary-light-3);--el-tag-text-color:var(--el-color-white);--el-tag-text-color:var(--el-color-white)}.el-tag--dark.el-tag--primary{--el-tag-bg-color:var(--el-color-primary);--el-tag-border-color:var(--el-color-primary);--el-tag-hover-color:var(--el-color-primary-light-3)}.el-tag--dark.el-tag--success{--el-tag-bg-color:var(--el-color-success);--el-tag-border-color:var(--el-color-success);--el-tag-hover-color:var(--el-color-success-light-3)}.el-tag--dark.el-tag--warning{--el-tag-bg-color:var(--el-color-warning);--el-tag-border-color:var(--el-color-warning);--el-tag-hover-color:var(--el-color-warning-light-3)}.el-tag--dark.el-tag--danger{--el-tag-bg-color:var(--el-color-danger);--el-tag-border-color:var(--el-color-danger);--el-tag-hover-color:var(--el-color-danger-light-3)}.el-tag--dark.el-tag--error{--el-tag-bg-color:var(--el-color-error);--el-tag-border-color:var(--el-color-error);--el-tag-hover-color:var(--el-color-error-light-3)}.el-tag--dark.el-tag--info{--el-tag-bg-color:var(--el-color-info);--el-tag-border-color:var(--el-color-info);--el-tag-hover-color:var(--el-color-info-light-3)}.el-tag--dark.el-tag--primary{--el-tag-text-color:var(--el-color-white)}.el-tag--dark.el-tag--success{--el-tag-text-color:var(--el-color-white)}.el-tag--dark.el-tag--warning{--el-tag-text-color:var(--el-color-white)}.el-tag--dark.el-tag--danger{--el-tag-text-color:var(--el-color-white)}.el-tag--dark.el-tag--error{--el-tag-text-color:var(--el-color-white)}.el-tag--dark.el-tag--info{--el-tag-text-color:var(--el-color-white)}.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank);--el-tag-border-color:var(--el-color-primary-light-5);--el-tag-hover-color:var(--el-color-primary);--el-tag-bg-color:var(--el-fill-color-blank)}.el-tag--plain.el-tag--primary{--el-tag-bg-color:var(--el-fill-color-blank);--el-tag-border-color:var(--el-color-primary-light-5);--el-tag-hover-color:var(--el-color-primary)}.el-tag--plain.el-tag--success{--el-tag-bg-color:var(--el-fill-color-blank);--el-tag-border-color:var(--el-color-success-light-5);--el-tag-hover-color:var(--el-color-success)}.el-tag--plain.el-tag--warning{--el-tag-bg-color:var(--el-fill-color-blank);--el-tag-border-color:var(--el-color-warning-light-5);--el-tag-hover-color:var(--el-color-warning)}.el-tag--plain.el-tag--danger{--el-tag-bg-color:var(--el-fill-color-blank);--el-tag-border-color:var(--el-color-danger-light-5);--el-tag-hover-color:var(--el-color-danger)}.el-tag--plain.el-tag--error{--el-tag-bg-color:var(--el-fill-color-blank);--el-tag-border-color:var(--el-color-error-light-5);--el-tag-hover-color:var(--el-color-error)}.el-tag--plain.el-tag--info{--el-tag-bg-color:var(--el-fill-color-blank);--el-tag-border-color:var(--el-color-info-light-5);--el-tag-hover-color:var(--el-color-info)}.el-tag.is-closable{padding-right:5px}.el-tag--large{padding:0 11px;height:32px;--el-icon-size:16px}.el-tag--large .el-tag__close{margin-left:8px}.el-tag--large.is-closable{padding-right:7px}.el-tag--small{padding:0 7px;height:20px;--el-icon-size:12px}.el-tag--small .el-tag__close{margin-left:4px}.el-tag--small.is-closable{padding-right:3px}.el-tag--small .el-icon-close{transform:scale(.8)}.el-tag.el-tag--primary.is-hit{border-color:var(--el-color-primary)}.el-tag.el-tag--success.is-hit{border-color:var(--el-color-success)}.el-tag.el-tag--warning.is-hit{border-color:var(--el-color-warning)}.el-tag.el-tag--danger.is-hit{border-color:var(--el-color-danger)}.el-tag.el-tag--error.is-hit{border-color:var(--el-color-error)}.el-tag.el-tag--info.is-hit{border-color:var(--el-color-info)}.el-text{--el-text-font-size:var(--el-font-size-base);--el-text-color:var(--el-text-color-regular)}.el-text{align-self:center;margin:0;padding:0;font-size:var(--el-text-font-size);color:var(--el-text-color);word-break:break-all}.el-text.is-truncated{display:inline-block;max-width:100%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.el-text--large{--el-text-font-size:var(--el-font-size-medium)}.el-text--default{--el-text-font-size:var(--el-font-size-base)}.el-text--small{--el-text-font-size:var(--el-font-size-extra-small)}.el-text.el-text--primary{--el-text-color:var(--el-color-primary)}.el-text.el-text--success{--el-text-color:var(--el-color-success)}.el-text.el-text--warning{--el-text-color:var(--el-color-warning)}.el-text.el-text--danger{--el-text-color:var(--el-color-danger)}.el-text.el-text--error{--el-text-color:var(--el-color-error)}.el-text.el-text--info{--el-text-color:var(--el-color-info)}.el-text>.el-icon{vertical-align:-2px}.time-select{margin:5px 0;min-width:0}.time-select .el-picker-panel__content{max-height:200px;margin:0}.time-select-item{padding:8px 10px;font-size:14px;line-height:20px}.time-select-item.disabled{color:var(--el-datepicker-border-color);cursor:not-allowed}.time-select-item:hover{background-color:var(--el-fill-color-light);font-weight:700;cursor:pointer}.time-select .time-select-item.selected:not(.disabled){color:var(--el-color-primary);font-weight:700}.el-timeline-item{position:relative;padding-bottom:20px}.el-timeline-item__wrapper{position:relative;padding-left:28px;top:-3px}.el-timeline-item__tail{position:absolute;left:4px;height:100%;border-left:2px solid var(--el-timeline-node-color)}.el-timeline-item .el-timeline-item__icon{color:var(--el-color-white);font-size:var(--el-font-size-small)}.el-timeline-item__node{position:absolute;background-color:var(--el-timeline-node-color);border-color:var(--el-timeline-node-color);border-radius:50%;box-sizing:border-box;display:flex;justify-content:center;align-items:center}.el-timeline-item__node--normal{left:-1px;width:var(--el-timeline-node-size-normal);height:var(--el-timeline-node-size-normal)}.el-timeline-item__node--large{left:-2px;width:var(--el-timeline-node-size-large);height:var(--el-timeline-node-size-large)}.el-timeline-item__node.is-hollow{background:var(--el-color-white);border-style:solid;border-width:2px}.el-timeline-item__node--primary{background-color:var(--el-color-primary);border-color:var(--el-color-primary)}.el-timeline-item__node--success{background-color:var(--el-color-success);border-color:var(--el-color-success)}.el-timeline-item__node--warning{background-color:var(--el-color-warning);border-color:var(--el-color-warning)}.el-timeline-item__node--danger{background-color:var(--el-color-danger);border-color:var(--el-color-danger)}.el-timeline-item__node--info{background-color:var(--el-color-info);border-color:var(--el-color-info)}.el-timeline-item__dot{position:absolute;display:flex;justify-content:center;align-items:center}.el-timeline-item__content{color:var(--el-text-color-primary)}.el-timeline-item__timestamp{color:var(--el-text-color-secondary);line-height:1;font-size:var(--el-font-size-small)}.el-timeline-item__timestamp.is-top{margin-bottom:8px;padding-top:4px}.el-timeline-item__timestamp.is-bottom{margin-top:8px}.el-timeline{--el-timeline-node-size-normal:12px;--el-timeline-node-size-large:14px;--el-timeline-node-color:var(--el-border-color-light)}.el-timeline{margin:0;font-size:var(--el-font-size-base);list-style:none}.el-timeline .el-timeline-item:last-child .el-timeline-item__tail{display:none}.el-timeline .el-timeline-item__center{display:flex;align-items:center}.el-timeline .el-timeline-item__center .el-timeline-item__wrapper{width:100%}.el-timeline .el-timeline-item__center .el-timeline-item__tail{top:0}.el-timeline .el-timeline-item__center:first-child .el-timeline-item__tail{height:calc(50% + 10px);top:calc(50% - 10px)}.el-timeline .el-timeline-item__center:last-child .el-timeline-item__tail{display:block;height:calc(50% - 10px)}.el-tooltip-v2__content{--el-tooltip-v2-padding:5px 10px;--el-tooltip-v2-border-radius:4px;--el-tooltip-v2-border-color:var(--el-border-color);border-radius:var(--el-tooltip-v2-border-radius);color:var(--el-color-black);background-color:var(--el-color-white);padding:var(--el-tooltip-v2-padding);border:1px solid var(--el-border-color)}.el-tooltip-v2__arrow{position:absolute;color:var(--el-color-white);width:var(--el-tooltip-v2-arrow-width);height:var(--el-tooltip-v2-arrow-height);pointer-events:none;left:var(--el-tooltip-v2-arrow-x);top:var(--el-tooltip-v2-arrow-y)}.el-tooltip-v2__arrow::before{content:"";width:0;height:0;border:var(--el-tooltip-v2-arrow-border-width) solid transparent;position:absolute}.el-tooltip-v2__arrow::after{content:"";width:0;height:0;border:var(--el-tooltip-v2-arrow-border-width) solid transparent;position:absolute}.el-tooltip-v2__content[data-side^=top] .el-tooltip-v2__arrow{bottom:0}.el-tooltip-v2__content[data-side^=top] .el-tooltip-v2__arrow::before{border-top-color:var(--el-color-white);border-top-width:var(--el-tooltip-v2-arrow-border-width);border-bottom:0;top:calc(100% - 1px)}.el-tooltip-v2__content[data-side^=top] .el-tooltip-v2__arrow::after{border-top-color:var(--el-border-color);border-top-width:var(--el-tooltip-v2-arrow-border-width);border-bottom:0;top:100%;z-index:-1}.el-tooltip-v2__content[data-side^=bottom] .el-tooltip-v2__arrow{top:0}.el-tooltip-v2__content[data-side^=bottom] .el-tooltip-v2__arrow::before{border-bottom-color:var(--el-color-white);border-bottom-width:var(--el-tooltip-v2-arrow-border-width);border-top:0;bottom:calc(100% - 1px)}.el-tooltip-v2__content[data-side^=bottom] .el-tooltip-v2__arrow::after{border-bottom-color:var(--el-border-color);border-bottom-width:var(--el-tooltip-v2-arrow-border-width);border-top:0;bottom:100%;z-index:-1}.el-tooltip-v2__content[data-side^=left] .el-tooltip-v2__arrow{right:0}.el-tooltip-v2__content[data-side^=left] .el-tooltip-v2__arrow::before{border-left-color:var(--el-color-white);border-left-width:var(--el-tooltip-v2-arrow-border-width);border-right:0;left:calc(100% - 1px)}.el-tooltip-v2__content[data-side^=left] .el-tooltip-v2__arrow::after{border-left-color:var(--el-border-color);border-left-width:var(--el-tooltip-v2-arrow-border-width);border-right:0;left:100%;z-index:-1}.el-tooltip-v2__content[data-side^=right] .el-tooltip-v2__arrow{left:0}.el-tooltip-v2__content[data-side^=right] .el-tooltip-v2__arrow::before{border-right-color:var(--el-color-white);border-right-width:var(--el-tooltip-v2-arrow-border-width);border-left:0;right:calc(100% - 1px)}.el-tooltip-v2__content[data-side^=right] .el-tooltip-v2__arrow::after{border-right-color:var(--el-border-color);border-right-width:var(--el-tooltip-v2-arrow-border-width);border-left:0;right:100%;z-index:-1}.el-tooltip-v2__content.is-dark{--el-tooltip-v2-border-color:transparent;background-color:var(--el-color-black);color:var(--el-color-white);border-color:transparent}.el-tooltip-v2__content.is-dark .el-tooltip-v2__arrow{background-color:var(--el-color-black);border-color:transparent}.el-transfer{--el-transfer-border-color:var(--el-border-color-lighter);--el-transfer-border-radius:var(--el-border-radius-base);--el-transfer-panel-width:200px;--el-transfer-panel-header-height:40px;--el-transfer-panel-header-bg-color:var(--el-fill-color-light);--el-transfer-panel-footer-height:40px;--el-transfer-panel-body-height:278px;--el-transfer-item-height:30px;--el-transfer-filter-height:32px}.el-transfer{font-size:var(--el-font-size-base)}.el-transfer__buttons{display:inline-block;vertical-align:middle;padding:0 30px}.el-transfer__button{vertical-align:top}.el-transfer__button:nth-child(2){margin:0 0 0 10px}.el-transfer__button i,.el-transfer__button span{font-size:14px}.el-transfer__button .el-icon+span{margin-left:0}.el-transfer-panel{overflow:hidden;background:var(--el-bg-color-overlay);display:inline-block;text-align:left;vertical-align:middle;width:var(--el-transfer-panel-width);max-height:100%;box-sizing:border-box;position:relative}.el-transfer-panel__body{height:var(--el-transfer-panel-body-height);border-left:1px solid var(--el-transfer-border-color);border-right:1px solid var(--el-transfer-border-color);border-bottom:1px solid var(--el-transfer-border-color);border-bottom-left-radius:var(--el-transfer-border-radius);border-bottom-right-radius:var(--el-transfer-border-radius);overflow:hidden}.el-transfer-panel__body.is-with-footer{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0}.el-transfer-panel__list{margin:0;padding:6px 0;list-style:none;height:var(--el-transfer-panel-body-height);overflow:auto;box-sizing:border-box}.el-transfer-panel__list.is-filterable{height:calc(100% - var(--el-transfer-filter-height) - 30px);padding-top:0}.el-transfer-panel__item{height:var(--el-transfer-item-height);line-height:var(--el-transfer-item-height);padding-left:15px;display:block!important}.el-transfer-panel__item+.el-transfer-panel__item{margin-left:0}.el-transfer-panel__item.el-checkbox{color:var(--el-text-color-regular)}.el-transfer-panel__item:hover{color:var(--el-color-primary)}.el-transfer-panel__item.el-checkbox .el-checkbox__label{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;box-sizing:border-box;padding-left:22px;line-height:var(--el-transfer-item-height)}.el-transfer-panel__item .el-checkbox__input{position:absolute;top:8px}.el-transfer-panel__filter{text-align:center;margin:15px;box-sizing:border-box;width:auto}.el-transfer-panel__filter .el-input__inner{height:var(--el-transfer-filter-height);width:100%;font-size:12px;display:inline-block;box-sizing:border-box;border-radius:calc(var(--el-transfer-filter-height)/ 2)}.el-transfer-panel__filter .el-icon-circle-close{cursor:pointer}.el-transfer-panel .el-transfer-panel__header{display:flex;align-items:center;height:var(--el-transfer-panel-header-height);background:var(--el-transfer-panel-header-bg-color);margin:0;padding-left:15px;border:1px solid var(--el-transfer-border-color);border-top-left-radius:var(--el-transfer-border-radius);border-top-right-radius:var(--el-transfer-border-radius);box-sizing:border-box;color:var(--el-color-black)}.el-transfer-panel .el-transfer-panel__header .el-checkbox{position:relative;display:flex;width:100%;align-items:center}.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label{font-size:16px;color:var(--el-text-color-primary);font-weight:400}.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label span{position:absolute;right:15px;top:50%;transform:translate3d(0,-50%,0);color:var(--el-text-color-secondary);font-size:12px;font-weight:400}.el-transfer-panel .el-transfer-panel__footer{height:var(--el-transfer-panel-footer-height);background:var(--el-bg-color-overlay);margin:0;padding:0;border:1px solid var(--el-transfer-border-color);border-bottom-left-radius:var(--el-transfer-border-radius);border-bottom-right-radius:var(--el-transfer-border-radius)}.el-transfer-panel .el-transfer-panel__footer::after{display:inline-block;content:"";height:100%;vertical-align:middle}.el-transfer-panel .el-transfer-panel__footer .el-checkbox{padding-left:20px;color:var(--el-text-color-regular)}.el-transfer-panel .el-transfer-panel__empty{margin:0;height:var(--el-transfer-item-height);line-height:var(--el-transfer-item-height);padding:6px 15px 0;color:var(--el-text-color-secondary);text-align:center}.el-transfer-panel .el-checkbox__label{padding-left:8px}.el-transfer-panel .el-checkbox__inner{height:14px;width:14px;border-radius:3px}.el-transfer-panel .el-checkbox__inner::after{height:6px;width:3px;left:4px}.el-tree{--el-tree-node-hover-bg-color:var(--el-fill-color-light);--el-tree-text-color:var(--el-text-color-regular);--el-tree-expand-icon-color:var(--el-text-color-placeholder)}.el-tree{position:relative;cursor:default;background:var(--el-fill-color-blank);color:var(--el-tree-text-color);font-size:var(--el-font-size-base)}.el-tree__empty-block{position:relative;min-height:60px;text-align:center;width:100%;height:100%}.el-tree__empty-text{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:var(--el-text-color-secondary);font-size:var(--el-font-size-base)}.el-tree__drop-indicator{position:absolute;left:0;right:0;height:1px;background-color:var(--el-color-primary)}.el-tree-node{white-space:nowrap;outline:0}.el-tree-node:focus>.el-tree-node__content{background-color:var(--el-tree-node-hover-bg-color)}.el-tree-node.is-drop-inner>.el-tree-node__content .el-tree-node__label{background-color:var(--el-color-primary);color:#fff}.el-tree-node__content{display:flex;align-items:center;height:26px;cursor:pointer}.el-tree-node__content>.el-tree-node__expand-icon{padding:6px;box-sizing:content-box}.el-tree-node__content>label.el-checkbox{margin-right:8px}.el-tree-node__content:hover{background-color:var(--el-tree-node-hover-bg-color)}.el-tree.is-dragging .el-tree-node__content{cursor:move}.el-tree.is-dragging .el-tree-node__content *{pointer-events:none}.el-tree.is-dragging.is-drop-not-allow .el-tree-node__content{cursor:not-allowed}.el-tree-node__expand-icon{cursor:pointer;color:var(--el-tree-expand-icon-color);font-size:12px;transform:rotate(0);transition:transform var(--el-transition-duration) ease-in-out}.el-tree-node__expand-icon.expanded{transform:rotate(90deg)}.el-tree-node__expand-icon.is-leaf{color:transparent;cursor:default}.el-tree-node__expand-icon.is-hidden{visibility:hidden}.el-tree-node__loading-icon{margin-right:8px;font-size:var(--el-font-size-base);color:var(--el-tree-expand-icon-color)}.el-tree-node>.el-tree-node__children{overflow:hidden;background-color:transparent}.el-tree-node.is-expanded>.el-tree-node__children{display:block}.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content{background-color:var(--el-color-primary-light-9)}.el-tree-select{--el-tree-node-hover-bg-color:var(--el-fill-color-light);--el-tree-text-color:var(--el-text-color-regular);--el-tree-expand-icon-color:var(--el-text-color-placeholder)}.el-tree-select__popper .el-tree-node__expand-icon{margin-left:8px}.el-tree-select__popper .el-tree-node.is-checked>.el-tree-node__content .el-select-dropdown__item.selected::after{content:none}.el-tree-select__popper .el-select-dropdown__item{flex:1;background:0 0!important;padding-left:0;height:20px;line-height:20px}.el-upload{--el-upload-dragger-padding-horizontal:40px;--el-upload-dragger-padding-vertical:10px}.el-upload{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;outline:0}.el-upload__input{display:none}.el-upload__tip{font-size:12px;color:var(--el-text-color-regular);margin-top:7px}.el-upload iframe{position:absolute;z-index:-1;top:0;left:0;opacity:0}.el-upload--picture-card{--el-upload-picture-card-size:148px;background-color:var(--el-fill-color-lighter);border:1px dashed var(--el-border-color-darker);border-radius:6px;box-sizing:border-box;width:var(--el-upload-picture-card-size);height:var(--el-upload-picture-card-size);cursor:pointer;vertical-align:top;display:inline-flex;justify-content:center;align-items:center}.el-upload--picture-card i{font-size:28px;color:var(--el-text-color-secondary)}.el-upload--picture-card:hover{border-color:var(--el-color-primary);color:var(--el-color-primary)}.el-upload.is-drag{display:block}.el-upload:focus{border-color:var(--el-color-primary);color:var(--el-color-primary)}.el-upload:focus .el-upload-dragger{border-color:var(--el-color-primary)}.el-upload-dragger{padding:var(--el-upload-dragger-padding-horizontal) var(--el-upload-dragger-padding-vertical);background-color:var(--el-fill-color-blank);border:1px dashed var(--el-border-color);border-radius:6px;box-sizing:border-box;text-align:center;cursor:pointer;position:relative;overflow:hidden}.el-upload-dragger .el-icon--upload{font-size:67px;color:var(--el-text-color-placeholder);margin-bottom:16px;line-height:50px}.el-upload-dragger+.el-upload__tip{text-align:center}.el-upload-dragger~.el-upload__files{border-top:var(--el-border);margin-top:7px;padding-top:5px}.el-upload-dragger .el-upload__text{color:var(--el-text-color-regular);font-size:14px;text-align:center}.el-upload-dragger .el-upload__text em{color:var(--el-color-primary);font-style:normal}.el-upload-dragger:hover{border-color:var(--el-color-primary)}.el-upload-dragger.is-dragover{padding:calc(var(--el-upload-dragger-padding-horizontal) - 1px) calc(var(--el-upload-dragger-padding-vertical) - 1px);background-color:var(--el-color-primary-light-9);border:2px dashed var(--el-color-primary)}.el-upload-list{margin:10px 0 0;padding:0;list-style:none;position:relative}.el-upload-list__item{transition:all .5s cubic-bezier(.55,0,.1,1);font-size:14px;color:var(--el-text-color-regular);margin-bottom:5px;position:relative;box-sizing:border-box;border-radius:4px;width:100%}.el-upload-list__item .el-progress{position:absolute;top:20px;width:100%}.el-upload-list__item .el-progress__text{position:absolute;right:0;top:-13px}.el-upload-list__item .el-progress-bar{margin-right:0;padding-right:0}.el-upload-list__item .el-icon--upload-success{color:var(--el-color-success)}.el-upload-list__item .el-icon--close{display:none;position:absolute;right:5px;top:50%;cursor:pointer;opacity:.75;color:var(--el-text-color-regular);transition:opacity var(--el-transition-duration);transform:translateY(-50%)}.el-upload-list__item .el-icon--close:hover{opacity:1;color:var(--el-color-primary)}.el-upload-list__item .el-icon--close-tip{display:none;position:absolute;top:1px;right:5px;font-size:12px;cursor:pointer;opacity:1;color:var(--el-color-primary);font-style:normal}.el-upload-list__item:hover{background-color:var(--el-fill-color-light)}.el-upload-list__item:hover .el-icon--close{display:inline-flex}.el-upload-list__item:hover .el-progress__text{display:none}.el-upload-list__item .el-upload-list__item-info{display:inline-flex;justify-content:center;flex-direction:column;width:calc(100% - 30px);margin-left:4px}.el-upload-list__item.is-success .el-upload-list__item-status-label{display:inline-flex}.el-upload-list__item.is-success .el-upload-list__item-name:focus,.el-upload-list__item.is-success .el-upload-list__item-name:hover{color:var(--el-color-primary);cursor:pointer}.el-upload-list__item.is-success:focus:not(:hover) .el-icon--close-tip{display:inline-block}.el-upload-list__item.is-success:active,.el-upload-list__item.is-success:not(.focusing):focus{outline-width:0}.el-upload-list__item.is-success:active .el-icon--close-tip,.el-upload-list__item.is-success:not(.focusing):focus .el-icon--close-tip{display:none}.el-upload-list__item.is-success:focus .el-upload-list__item-status-label,.el-upload-list__item.is-success:hover .el-upload-list__item-status-label{display:none;opacity:0}.el-upload-list__item-name{color:var(--el-text-color-regular);display:inline-flex;text-align:center;align-items:center;padding:0 4px;transition:color var(--el-transition-duration);font-size:var(--el-font-size-base)}.el-upload-list__item-name .el-icon{margin-right:6px;color:var(--el-text-color-secondary)}.el-upload-list__item-file-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.el-upload-list__item-status-label{position:absolute;right:5px;top:0;line-height:inherit;display:none;height:100%;justify-content:center;align-items:center;transition:opacity var(--el-transition-duration)}.el-upload-list__item-delete{position:absolute;right:10px;top:0;font-size:12px;color:var(--el-text-color-regular);display:none}.el-upload-list__item-delete:hover{color:var(--el-color-primary)}.el-upload-list--picture-card{--el-upload-list-picture-card-size:148px;display:inline-flex;flex-wrap:wrap;margin:0}.el-upload-list--picture-card .el-upload-list__item{overflow:hidden;background-color:var(--el-fill-color-blank);border:1px solid var(--el-border-color);border-radius:6px;box-sizing:border-box;width:var(--el-upload-list-picture-card-size);height:var(--el-upload-list-picture-card-size);margin:0 8px 8px 0;padding:0;display:inline-flex}.el-upload-list--picture-card .el-upload-list__item .el-icon--check,.el-upload-list--picture-card .el-upload-list__item .el-icon--circle-check{color:#fff}.el-upload-list--picture-card .el-upload-list__item .el-icon--close{display:none}.el-upload-list--picture-card .el-upload-list__item:hover .el-upload-list__item-status-label{opacity:0;display:block}.el-upload-list--picture-card .el-upload-list__item:hover .el-progress__text{display:block}.el-upload-list--picture-card .el-upload-list__item .el-upload-list__item-name{display:none}.el-upload-list--picture-card .el-upload-list__item-thumbnail{width:100%;height:100%;-o-object-fit:contain;object-fit:contain}.el-upload-list--picture-card .el-upload-list__item-status-label{right:-15px;top:-6px;width:40px;height:24px;background:var(--el-color-success);text-align:center;transform:rotate(45deg)}.el-upload-list--picture-card .el-upload-list__item-status-label i{font-size:12px;margin-top:11px;transform:rotate(-45deg)}.el-upload-list--picture-card .el-upload-list__item-actions{position:absolute;width:100%;height:100%;left:0;top:0;cursor:default;display:inline-flex;justify-content:center;align-items:center;color:#fff;opacity:0;font-size:20px;background-color:var(--el-overlay-color-lighter);transition:opacity var(--el-transition-duration)}.el-upload-list--picture-card .el-upload-list__item-actions span{display:none;cursor:pointer}.el-upload-list--picture-card .el-upload-list__item-actions span+span{margin-left:1rem}.el-upload-list--picture-card .el-upload-list__item-actions .el-upload-list__item-delete{position:static;font-size:inherit;color:inherit}.el-upload-list--picture-card .el-upload-list__item-actions:hover{opacity:1}.el-upload-list--picture-card .el-upload-list__item-actions:hover span{display:inline-flex}.el-upload-list--picture-card .el-progress{top:50%;left:50%;transform:translate(-50%,-50%);bottom:auto;width:126px}.el-upload-list--picture-card .el-progress .el-progress__text{top:50%}.el-upload-list--picture .el-upload-list__item{overflow:hidden;z-index:0;background-color:var(--el-fill-color-blank);border:1px solid var(--el-border-color);border-radius:6px;box-sizing:border-box;margin-top:10px;padding:10px;display:flex;align-items:center}.el-upload-list--picture .el-upload-list__item .el-icon--check,.el-upload-list--picture .el-upload-list__item .el-icon--circle-check{color:#fff}.el-upload-list--picture .el-upload-list__item:hover .el-upload-list__item-status-label{opacity:0;display:inline-flex}.el-upload-list--picture .el-upload-list__item:hover .el-progress__text{display:block}.el-upload-list--picture .el-upload-list__item.is-success .el-upload-list__item-name i{display:none}.el-upload-list--picture .el-upload-list__item .el-icon--close{top:5px;transform:translateY(0)}.el-upload-list--picture .el-upload-list__item-thumbnail{display:inline-flex;justify-content:center;align-items:center;width:70px;height:70px;-o-object-fit:contain;object-fit:contain;position:relative;z-index:1;background-color:var(--el-color-white)}.el-upload-list--picture .el-upload-list__item-status-label{position:absolute;right:-17px;top:-7px;width:46px;height:26px;background:var(--el-color-success);text-align:center;transform:rotate(45deg)}.el-upload-list--picture .el-upload-list__item-status-label i{font-size:12px;margin-top:12px;transform:rotate(-45deg)}.el-upload-list--picture .el-progress{position:relative;top:-7px}.el-upload-cover{position:absolute;left:0;top:0;width:100%;height:100%;overflow:hidden;z-index:10;cursor:default}.el-upload-cover::after{display:inline-block;content:"";height:100%;vertical-align:middle}.el-upload-cover img{display:block;width:100%;height:100%}.el-upload-cover__label{right:-15px;top:-6px;width:40px;height:24px;background:var(--el-color-success);text-align:center;transform:rotate(45deg)}.el-upload-cover__label i{font-size:12px;margin-top:11px;transform:rotate(-45deg);color:#fff}.el-upload-cover__progress{display:inline-block;vertical-align:middle;position:static;width:243px}.el-upload-cover__progress+.el-upload__inner{opacity:0}.el-upload-cover__content{position:absolute;top:0;left:0;width:100%;height:100%}.el-upload-cover__interact{position:absolute;bottom:0;left:0;width:100%;height:100%;background-color:var(--el-overlay-color-light);text-align:center}.el-upload-cover__interact .btn{display:inline-block;color:#fff;font-size:14px;cursor:pointer;vertical-align:middle;transition:var(--el-transition-md-fade);margin-top:60px}.el-upload-cover__interact .btn i{margin-top:0}.el-upload-cover__interact .btn span{opacity:0;transition:opacity .15s linear}.el-upload-cover__interact .btn:not(:first-child){margin-left:35px}.el-upload-cover__interact .btn:hover{transform:translateY(-13px)}.el-upload-cover__interact .btn:hover span{opacity:1}.el-upload-cover__interact .btn i{color:#fff;display:block;font-size:24px;line-height:inherit;margin:0 auto 5px}.el-upload-cover__title{position:absolute;bottom:0;left:0;background-color:#fff;height:36px;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:400;text-align:left;padding:0 10px;margin:0;line-height:36px;font-size:14px;color:var(--el-text-color-primary)}.el-upload-cover+.el-upload__inner{opacity:0;position:relative;z-index:1}.el-vl__wrapper{position:relative}.el-vl__wrapper:hover .el-virtual-scrollbar{opacity:1}.el-vl__wrapper.always-on .el-virtual-scrollbar{opacity:1}.el-vl__window{scrollbar-width:none}.el-vl__window::-webkit-scrollbar{display:none}.el-virtual-scrollbar{opacity:0;transition:opacity 340ms ease-out}.el-virtual-scrollbar.always-on{opacity:1}.el-vg__wrapper{position:relative}.el-popper{--el-popper-border-radius:var(--el-popover-border-radius, 4px)}.el-popper{position:absolute;border-radius:var(--el-popper-border-radius);padding:5px 11px;z-index:2000;font-size:12px;line-height:20px;min-width:10px;word-wrap:break-word;visibility:visible}.el-popper.is-dark{color:var(--el-bg-color);background:var(--el-text-color-primary);border:1px solid var(--el-text-color-primary)}.el-popper.is-dark .el-popper__arrow::before{border:1px solid var(--el-text-color-primary);background:var(--el-text-color-primary);right:0}.el-popper.is-light{background:var(--el-bg-color-overlay);border:1px solid var(--el-border-color-light)}.el-popper.is-light .el-popper__arrow::before{border:1px solid var(--el-border-color-light);background:var(--el-bg-color-overlay);right:0}.el-popper.is-pure{padding:0}.el-popper__arrow{position:absolute;width:10px;height:10px;z-index:-1}.el-popper__arrow::before{position:absolute;width:10px;height:10px;z-index:-1;content:" ";transform:rotate(45deg);background:var(--el-text-color-primary);box-sizing:border-box}.el-popper[data-popper-placement^=top]>.el-popper__arrow{bottom:-5px}.el-popper[data-popper-placement^=top]>.el-popper__arrow::before{border-bottom-right-radius:2px}.el-popper[data-popper-placement^=bottom]>.el-popper__arrow{top:-5px}.el-popper[data-popper-placement^=bottom]>.el-popper__arrow::before{border-top-left-radius:2px}.el-popper[data-popper-placement^=left]>.el-popper__arrow{right:-5px}.el-popper[data-popper-placement^=left]>.el-popper__arrow::before{border-top-right-radius:2px}.el-popper[data-popper-placement^=right]>.el-popper__arrow{left:-5px}.el-popper[data-popper-placement^=right]>.el-popper__arrow::before{border-bottom-left-radius:2px}.el-popper[data-popper-placement^=top] .el-popper__arrow::before{border-top-color:transparent!important;border-left-color:transparent!important}.el-popper[data-popper-placement^=bottom] .el-popper__arrow::before{border-bottom-color:transparent!important;border-right-color:transparent!important}.el-popper[data-popper-placement^=left] .el-popper__arrow::before{border-left-color:transparent!important;border-bottom-color:transparent!important}.el-popper[data-popper-placement^=right] .el-popper__arrow::before{border-right-color:transparent!important;border-top-color:transparent!important}.el-select-dropdown__item{font-size:var(--el-font-size-base);padding:0 32px 0 20px;position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--el-text-color-regular);height:34px;line-height:34px;box-sizing:border-box;cursor:pointer}.el-select-dropdown__item.is-disabled{color:var(--el-text-color-placeholder);cursor:not-allowed}.el-select-dropdown__item.hover,.el-select-dropdown__item:hover{background-color:var(--el-fill-color-light)}.el-select-dropdown__item.selected{color:var(--el-color-primary);font-weight:700}.el-statistic{--el-statistic-title-font-weight:400;--el-statistic-title-font-size:var(--el-font-size-extra-small);--el-statistic-title-color:var(--el-text-color-regular);--el-statistic-content-font-weight:400;--el-statistic-content-font-size:var(--el-font-size-extra-large);--el-statistic-content-color:var(--el-text-color-primary)}.el-statistic__head{font-weight:var(--el-statistic-title-font-weight);font-size:var(--el-statistic-title-font-size);color:var(--el-statistic-title-color);line-height:20px;margin-bottom:4px}.el-statistic__content{font-weight:var(--el-statistic-content-font-weight);font-size:var(--el-statistic-content-font-size);color:var(--el-statistic-content-color)}.el-statistic__value{display:inline-block}.el-statistic__prefix{margin-right:4px;display:inline-block}.el-statistic__suffix{margin-left:4px;display:inline-block}</style><style type="text/css" data-vite-dev-id="D:/ldatavis/data_resource/src/Layout/components/Aside.vue?vue&type=style&index=0&scoped=fa3e278b&lang.scss">[data-v-fa3e278b] .el-sub-menu.activemenu > .el-sub-menu__title:first-child { background-color: rgba(2, 126, 152, 0.7) !important; color: #000; border-right: 3px solid #027e98 !important;}.el-menu[data-v-fa3e278b] { background-color: #f5f7fa !important; border: none !important;}.el-menu-item[data-v-fa3e278b] { background-color: #f5f7fa !important;}.el-sub-menu[data-v-fa3e278b] { background-color: #f5f7fa !important;}.el-sub-menu[data-v-fa3e278b] .el-sub-menu__title { font-weight: bold !important;}.all[data-v-fa3e278b] { margin-left: auto; width: 60%; height: 95%; padding-top: 8%; padding-right: 1vw;}[data-v-fa3e278b] .el-menu-item.is-active { color: #000 !important;}[data-v-fa3e278b] .activemenu.is-opened > .el-sub-menu__title:first-child { background-color: rgba(2, 126, 152, 0.7) !important; color: #000; border-right: 3px solid #027e98 !important;}[data-v-fa3e278b] .el-sub-menu.is-active.is-opened .el-menu-item.is-active.activemenu { background-color: rgba(2, 126, 152, 0.7) !important; color: #000; border-right: 3px solid #027e98 !important;}</style><style type="text/css" data-vite-dev-id="D:/ldatavis/data_resource/src/Layout/components/Header.vue?vue&type=style&index=0&scoped=e92ed723&lang.css">.el-menu-item[data-v-e92ed723] { font-size: xx-small;}.header_right div[data-v-e92ed723]{ cursor: pointer;}.header_right span[data-v-e92ed723]{ cursor: pointer;}.line[data-v-e92ed723]{ width: 2px; background-color:#c4c7c8 ; height: 20px;}.login[data-v-e92ed723]{ display: inline-block;}.el-col-14[data-v-e92ed723]{ display: flex; justify-content: center;}.el-menu[data-v-e92ed723]{ width: 60%; display: flex; justify-content: space-around;}.el-menu--horizontal[data-v-e92ed723] { border-bottom:none; --el-menu-hover-bg-color:#fff !important;}.el-menu-item[data-v-e92ed723]{ box-sizing: border-box; padding: 0px; margin-left: 2px; margin-right: 2px;}.el-menu--horizontal>.el-menu-item.is-active[data-v-e92ed723]{ /* border-bottom-color: #01697f; */ border-bottom:3px solid #01697f; font-weight: bold;}.el-row[data-v-e92ed723]{ height: 100%;}.all[data-v-e92ed723]{ font-size: xx-small; width: 100%;height: 100%;}.header_left[data-v-e92ed723]{ display: flex; height: 100%; padding-left: 6%; align-items: center;}.header_left img[data-v-e92ed723]{ height: 70%; margin-right: 1vw;}.el-col[data-v-e92ed723]{ height: 100%;}</style><style type="text/css" data-vite-dev-id="D:/ldatavis/data_resource/src/Layout/layout.vue?vue&type=style&index=0&scoped=dd9c7b63&lang.css">.el-header[data-v-dd9c7b63]{ width: 100%; height: 8vh; padding: 0px; box-shadow:0px 10px 10px #dfe1e4 ; max-height: 55px; font-size: xx-small; position: relative;}.el-aside[data-v-dd9c7b63]{ background-color: #f5f7fa; width: 28vw; min-height: 92vh; height: auto; overflow-y:hidden;}</style><style type="text/css" data-vite-dev-id="D:/ldatavis/data_resource/src/components/dataStatistics.vue?vue&type=style&index=0&scoped=e5a436c2&lang.css">.container[data-v-e5a436c2] { margin-top: 40px;}h1[data-v-e5a436c2] { font-size: 22px;}.charts[data-v-e5a436c2] { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); grid-column-gap: 0px; grid-row-gap: 38px;}#chartOne[data-v-e5a436c2], #chartTwo[data-v-e5a436c2], #chartThree[data-v-e5a436c2], #chartFour[data-v-e5a436c2], #chartFive[data-v-e5a436c2] { padding-left: 10px; width: 300px; height: 250px;}#chartSix[data-v-e5a436c2] { margin-left: 30px; width: 350px; height: 200px;}</style><style type="text/css" data-vite-dev-id="D:/ldatavis/data_resource/src/components/dataBrowse.vue?vue&type=style&index=0&scoped=0acbb704&lang.scss">#body[data-v-0acbb704] { text-align: left; width: 100%;}#dataDeclaration[data-v-0acbb704] { width: 100%; min-width: 10px; margin-bottom: 7.5vh;}header[data-v-0acbb704] { display: flex;}h1[data-v-0acbb704] { font-size: 30px; margin: 0; white-space: nowrap;}span[data-v-0acbb704] { line-height: 50px; padding-left: 40px; color: #a4a7a8; white-space: nowrap;}#dataDeclaration p[data-v-0acbb704] { white-space: pre-wrap; min-width: 520px; line-height: 2.8vh;}</style><style type="text/css" data-vite-dev-id="D:/ldatavis/data_resource/src/components/classdata.vue?vue&type=style&index=0&scoped=b252830c&lang.scss">#minData[data-v-b252830c] { width: 100%;}#minData[data-v-b252830c] th { background-color: #f0f1f5; color: black; font-size: 16px; height: 40px;}#minData[data-v-b252830c] td { height: 40px;}</style><style type="text/css" data-vite-dev-id="D:/ldatavis/data_resource/src/components/populationCharacteristic.vue?vue&type=style&index=0&scoped=331362f9&lang.css">.container h4[data-v-331362f9] { font-size: 35px; margin: 0;}.container[data-v-331362f9] { border: none; border-bottom: 1px solid #e1e3e6; margin-bottom: 40px;}</style></head> <body> <div id="app" data-v-app=""><div data-v-dd9c7b63="" data-v-7a7a37b1="" class="common-layout"><section data-v-dd9c7b63="" class="el-container is-vertical"><header data-v-dd9c7b63="" class="el-header"><div data-v-e92ed723="" data-v-dd9c7b63="" class="all"><div data-v-e92ed723="" class="el-row"><div data-v-e92ed723="" class="el-col el-col-5"><div data-v-e92ed723="" class="header_left" style="width: 100%;"><img data-v-e92ed723="" src="./Vite + Vue_files/图像 [email protected]"><h1 data-v-e92ed723="">数据资源库</h1></div></div><div data-v-e92ed723="" class="el-col el-col-14"><ul data-v-e92ed723="" role="menubar" class="el-menu el-menu--horizontal el-menu-demo" style="--el-menu-bg-color:fff; --el-menu-hover-bg-color:rgb(204, 204, 204); --el-menu-active-color:#000; --el-menu-level:0;"><li data-v-e92ed723="" class="el-menu-item" role="menuitem" tabindex="0">主页</li><li data-v-e92ed723="" class="el-menu-item is-active" role="menuitem" tabindex="0">数据浏览</li><li data-v-e92ed723="" class="el-menu-item" role="menuitem" tabindex="0">数据搜索</li><li data-v-e92ed723="" class="el-menu-item" role="menuitem" tabindex="0">工具下载</li><li data-v-e92ed723="" class="el-menu-item" role="menuitem" tabindex="0">用户须知</li><!-- <el-menu-item index="2">Orders</el-menu-item> <el-menu-item index="3">Orders</el-menu-item> <el-menu-item index="4">Orders</el-menu-item> <el-menu-item index="5">Orders</el-menu-item> --></ul></div><div data-v-e92ed723="" class="el-col el-col-5"><div data-v-e92ed723="" class="header_right" style="width: 65%; height: 100%; display: flex; justify-content: space-between; align-items: center; margin-right: 5%; margin-left: 25%;"><span data-v-e92ed723="">返回首页</span><div data-v-e92ed723="" style="display: flex; align-items: center; width: 50%; justify-content: space-around;"><div data-v-e92ed723="" class="login">登录</div><div data-v-e92ed723="" class="line"></div><div data-v-e92ed723="" class="register">注册</div></div></div></div></div></div></header><section data-v-dd9c7b63="" class="el-container"><aside data-v-dd9c7b63="" class="el-aside"><div data-v-fa3e278b="" data-v-dd9c7b63="" class="all"><div data-v-fa3e278b="" style="width: 100%; margin-bottom: 10%;"><div data-v-fa3e278b="" style="font-weight: bolder; font-size: large;">数据浏览</div><div data-v-fa3e278b="" style="display: flex; justify-content: space-between; font-size: xx-small; width: 75%; margin-top: 7%; margin-bottom: 8%;"><span data-v-fa3e278b="" index="1">一级</span><span data-v-fa3e278b="" index="2">二级</span><span data-v-fa3e278b="" index="3">三级</span><span data-v-fa3e278b="" index="4">四级</span></div><div data-v-fa3e278b="" style="background-color: rgb(223, 223, 223); width: 100%; height: 1.5px;"></div></div><div data-v-fa3e278b="" style="overflow-y: hidden;"><ul data-v-fa3e278b="" role="menubar" class="el-menu el-menu--vertical el-menu-vertical-demo" style="--el-menu-level:0;"><div data-v-fa3e278b="" style="width: 100%; height: 100%;"><li data-v-fa3e278b="" class="el-sub-menu" role="menuitem" ariahaspopup="true" aria-expanded="false"><div class="el-sub-menu__title"><span data-v-fa3e278b="">目录1</span><i class="el-icon el-sub-menu__icon-arrow" style="transform: none;"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024"><path fill="currentColor" d="M831.872 340.864 512 652.672 192.128 340.864a30.592 30.592 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.592 30.592 0 0 0-42.752 0z"></path></svg></i></div><ul role="menu" class="el-menu el-menu--inline" style="--el-menu-level:1; display: none;"></ul></li></div><div data-v-fa3e278b="" style="width: 100%; height: 100%;"><li data-v-fa3e278b="" class="el-sub-menu" role="menuitem" ariahaspopup="true" aria-expanded="false"><div class="el-sub-menu__title"><span data-v-fa3e278b="">目录2</span><i class="el-icon el-sub-menu__icon-arrow" style="transform: none;"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024"><path fill="currentColor" d="M831.872 340.864 512 652.672 192.128 340.864a30.592 30.592 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.592 30.592 0 0 0-42.752 0z"></path></svg></i></div><ul role="menu" class="el-menu el-menu--inline" style="--el-menu-level:1; display: none;"></ul></li></div></ul></div></div></aside><main data-v-dd9c7b63="" class="el-main"><div style="height: 2vh; width: 100%;"></div><div data-v-331362f9="" class="container"><h4 data-v-331362f9="">人口特征（ID-1）</h4><p data-v-331362f9="">该类别包含关于参与者的一些一般特征的数据</p></div><div data-v-b252830c="" data-v-331362f9="" id="minData"><h2 data-v-b252830c="">子类别（2）</h2><div data-v-b252830c="" class="el-table--fit el-table--enable-row-hover el-table--enable-row-transition el-table el-table--layout-fixed is-scrolling-none" data-prefix="el" style="width: 100%;"><div class="el-table__inner-wrapper"><div class="hidden-columns"><div data-v-b252830c=""></div><div data-v-b252830c=""></div><div data-v-b252830c=""></div></div><div class="el-table__header-wrapper"><table class="el-table__header" border="0" cellpadding="0" cellspacing="0" style="width: 820px;"><thead class=""><tr class=""><th class="el-table_2_column_4 is-leaf el-table__cell" colspan="1" rowspan="1"><div class="cell">类别ID<!----><!----></div></th><th class="el-table_2_column_5 is-leaf el-table__cell" colspan="1" rowspan="1"><div class="cell">名称<!----><!----></div></th><th class="el-table_2_column_6 is-leaf el-table__cell" colspan="1" rowspan="1"><div class="cell">数目<!----><!----></div></th></tr></thead></table></div><div class="el-table__body-wrapper"><div class="el-scrollbar"><div class="el-scrollbar__wrap el-scrollbar__wrap--hidden-default"><div class="el-scrollbar__view" style="display: inline-block; vertical-align: middle;"><table class="el-table__body" cellspacing="0" cellpadding="0" border="0" style="table-layout: fixed; width: 820px;"><!--v-if--><tbody><tr class="el-table__row"><td class="el-table_2_column_4 el-table__cell" rowspan="1" colspan="1" style="color: rgb(91, 163, 183); cursor: pointer;"><div class="cell"><!---->2</div></td><td class="el-table_2_column_5 el-table__cell" rowspan="1" colspan="1"><div class="cell"><!---->持续特征</div></td><td class="el-table_2_column_6 el-table__cell" rowspan="1" colspan="1"><div class="cell"><!---->4</div></td></tr><tr class="el-table__row"><td class="el-table_2_column_4 el-table__cell" rowspan="1" colspan="1" style="color: rgb(91, 163, 183); cursor: pointer;"><div class="cell"><!---->100094</div></td><td class="el-table_2_column_5 el-table__cell" rowspan="1" colspan="1"><div class="cell"><!---->基线特征</div></td><td class="el-table_2_column_6 el-table__cell" rowspan="1" colspan="1"><div class="cell"><!---->6+25</div></td></tr></tbody></table><!--v-if--><!--v-if--></div></div><div class="el-scrollbar__bar is-horizontal" style="display: none;"><div class="el-scrollbar__thumb" style="transform: translateX(0%);"></div></div><div class="el-scrollbar__bar is-vertical" style="display: none;"><div class="el-scrollbar__thumb" style="transform: translateY(0%);"></div></div></div></div><!--v-if--><!--v-if--></div><div class="el-table__column-resize-proxy" style="display: none;"></div></div></div><div data-v-e5a436c2="" data-v-331362f9="" class="container"><h1 data-v-e5a436c2="">数据统计</h1><div class="charts" data-v-e5a436c2=""><div id="chartOne" data-v-e5a436c2="" _echarts_instance_="" style="user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); position: relative;"><div style="position: relative; width: 300px; height: 250px; padding: 0px; margin: 0px; border-width: 0px;"><canvas data-zr-dom-id="zr_0" width="450" height="375" style="position: absolute; left: 0px; top: 0px; width: 300px; height: 250px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div class=""></div></div><div id="chartTwo" data-v-e5a436c2="" _echarts_instance_="" style="user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); position: relative;"><div style="position: relative; width: 300px; height: 250px; padding: 0px; margin: 0px; border-width: 0px;"><canvas data-zr-dom-id="zr_0" width="450" height="375" style="position: absolute; left: 0px; top: 0px; width: 300px; height: 250px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div class=""></div></div><div id="chartThree" data-v-e5a436c2="" _echarts_instance_="" style="user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); position: relative;"><div style="position: relative; width: 300px; height: 250px; padding: 0px; margin: 0px; border-width: 0px;"><canvas data-zr-dom-id="zr_0" width="450" height="375" style="position: absolute; left: 0px; top: 0px; width: 300px; height: 250px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div class=""></div></div><div id="chartFour" data-v-e5a436c2="" _echarts_instance_="" style="user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); position: relative;"><div style="position: relative; width: 300px; height: 250px; padding: 0px; margin: 0px; border-width: 0px;"><canvas data-zr-dom-id="zr_0" width="450" height="375" style="position: absolute; left: 0px; top: 0px; width: 300px; height: 250px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div class=""></div></div><div id="chartFive" data-v-e5a436c2="" _echarts_instance_="" style="user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); position: relative;"><div style="position: relative; width: 300px; height: 250px; padding: 0px; margin: 0px; border-width: 0px;"><canvas data-zr-dom-id="zr_0" width="450" height="375" style="position: absolute; left: 0px; top: 0px; width: 300px; height: 250px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div class=""></div></div><div id="chartSix" data-v-e5a436c2="" _echarts_instance_="" style="user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); position: relative;"><div style="position: relative; width: 350px; height: 200px; padding: 0px; margin: 0px; border-width: 0px;"><canvas data-zr-dom-id="zr_0" width="525" height="300" style="position: absolute; left: 0px; top: 0px; width: 350px; height: 200px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div class=""></div></div></div></div></main></section></section></div></div> <script type="module" src="./Vite + Vue_files/main.js.下载"></script> </body></html>]]></content>
</entry>
<entry>
<title>解决vite+vue3的跨域问题及其proxy原理</title>
<link href="/super_zhu/2023/04/21/%E8%A7%A3%E5%86%B3vite+vue3%E4%B8%AD%E8%B7%A8%E5%9F%9F%E9%97%AE%E9%A2%98/"/>
<url>/super_zhu/2023/04/21/%E8%A7%A3%E5%86%B3vite+vue3%E4%B8%AD%E8%B7%A8%E5%9F%9F%E9%97%AE%E9%A2%98/</url>
<content type="html"><![CDATA[<h1 id="解决vite-vue3中跨域问题"><a href="#解决vite-vue3中跨域问题" class="headerlink" title="解决vite+vue3中跨域问题"></a>解决vite+vue3中跨域问题</h1><h2 id="代理配置"><a href="#代理配置" class="headerlink" title="代理配置"></a>代理配置</h2><p>首先打开你的<code>vite.config.js</code>文件</p><p>修改如下配置</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-keyword">export</span> <span class="hljs-keyword">default</span> <span class="hljs-title function_">defineConfig</span>({<br> <span class="hljs-attr">plugins</span>: [<span class="hljs-title function_">vue</span>()],<br> <span class="hljs-attr">server</span>: {<br> <span class="hljs-attr">hmr</span>:<span class="hljs-literal">true</span>, <span class="hljs-comment">//启动热更新，就是更改了代码自动刷新页面</span><br> <span class="hljs-attr">port</span>: <span class="hljs-number">8082</span>, <span class="hljs-comment">//自定义启动时的端口</span><br> <span class="hljs-attr">open</span>: <span class="hljs-literal">true</span>, <span class="hljs-comment">//代表vite项目在启动时自动打开浏览器 </span><br> <span class="hljs-attr">proxy</span>:{<br> <span class="hljs-string">"/api"</span>: { <br> <span class="hljs-attr">target</span>: <span class="hljs-string">"http://xxx.xxx.xx.x:8080"</span>,<br> <span class="hljs-comment">//你的需要请求的服务器地址</span><br> <span class="hljs-attr">changeOrigin</span>: <span class="hljs-literal">true</span>, <span class="hljs-comment">// 允许跨域</span><br> <span class="hljs-attr">secure</span>: <span class="hljs-literal">false</span>, <span class="hljs-comment">//忽略安全证书 </span><br> <span class="hljs-attr">rewrite</span>: <span class="hljs-function">(<span class="hljs-params">path</span>) =></span> path.<span class="hljs-title function_">replace</span>(<span class="hljs-regexp">/^\/api/</span>, <span class="hljs-string">''</span>), <span class="hljs-comment">// 重写路径把路径变成空字符,</span><br> },<br> },<br> },<br></code></pre></td></tr></table></figure><p>当我需要请求的地址为<code>http://xxx.xxx.xx.x:8080/user/login</code> 则我们在vue里使用axios发起请求为</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs js">axios.<span class="hljs-title function_">get</span>(<span class="hljs-string">'/api/user/login'</span>) <span class="hljs-comment">//发送成功 记住不能在发请求的时候写上自己的目标请求地址，原因看下面proxy原理 也可以加上vite服务器地址</span><br></code></pre></td></tr></table></figure><h2 id="代理原理"><a href="#代理原理" class="headerlink" title="代理原理"></a>代理原理</h2><ul><li>众所周知，之所以会有跨域问题，是源于我们浏览器的”同源策略保护“机制，只要<strong>网络协议</strong>，<strong>域名</strong>，<strong>端口</strong>不一致都会触发，所以跨域在他们有其中一个不一样时就会产生</li><li>解决跨域问题有一个非常经典的方法，那就是使用node中间件进行代理，它也是今天我们<strong>proxy</strong>的原理</li><li>在 vite 启动的时候，创建了一个开发服务器，然后根据我们进行的开发服务器配置进行 node 中间件代理。</li></ul><p>可以看下面这个原理图</p><p><img src="https://s2.loli.net/2023/04/22/BYveh31b4JOLRFD.png"></p><p>就是根据我们的配置node中间件会转发给相应的目标地址，这样子就很好的解决了跨域问题</p><p>但是或许又有人问,为什么对node中间件发起请求没有跨域问题，那是因为不是在浏览器环境而是在node环境，所以就没有这种限制</p><p>所以我们在上面说到</p><p><strong>在vite.config.js中配置好后，我们在发起请求是baseurl应该是配置时的关键字（上面是/api）或者是vite服务器的地址加上关键字（<a href="http://localhost:8080/api%EF%BC%89%EF%BC%8C%E5%9B%A0%E4%B8%BA%E6%88%91%E4%BB%AC%E9%9C%80%E8%A6%81%E5%90%91node%E4%B8%AD%E9%97%B4%E4%BB%B6%E5%8F%91%E8%B5%B7%E8%AF%B7%E6%B1%82%EF%BC%8C%E5%90%8E%E5%AE%83%E6%A0%B9%E6%8D%AE%E9%85%8D%E7%BD%AE%E4%BB%A3%E4%B8%BA%E8%BD%AC%E5%8F%91%EF%BC%8C%E5%AE%9E%E7%8E%B0%E8%A7%A3%E5%86%B3%E8%B7%A8%E5%9F%9F%E8%BF%99%E4%B8%80%E6%93%8D%E4%BD%9C">http://localhost:8080/api），因为我们需要向node中间件发起请求，后它根据配置代为转发，实现解决跨域这一操作</a></strong></p>]]></content>
<categories>
<category>web</category>
</categories>
<tags>
<tag>vue</tag>
</tags>
</entry>
<entry>
<title>mysql的基础函数</title>
<link href="/super_zhu/2023/04/05/mysql%E7%9A%84%E5%9F%BA%E7%A1%80%E5%87%BD%E6%95%B0/"/>
<url>/super_zhu/2023/04/05/mysql%E7%9A%84%E5%9F%BA%E7%A1%80%E5%87%BD%E6%95%B0/</url>
<content type="html"><![CDATA[<h1 id="mysql基础函数"><a href="#mysql基础函数" class="headerlink" title="mysql基础函数"></a>mysql基础函数</h1><h2 id="字符串函数"><a href="#字符串函数" class="headerlink" title="字符串函数"></a>字符串函数</h2><p><img src="https://s2.loli.net/2023/04/05/KqsLbmhOlB7vpHt.png" alt="image.png"></p><p> <u>lpad对于int类型的数据不起效果因为int不显示前面的零</u></p><h2 id="数组函数"><a href="#数组函数" class="headerlink" title="数组函数"></a>数组函数</h2><p><img src="https://s2.loli.net/2023/04/05/EmA48zUTyrwODsS.png" alt="image.png"></p><p><img src="https://s2.loli.net/2023/04/05/Zi2QG1t5EUmYcsO.png" alt="image.png"></p><p>mod是取余的意思</p><h2 id="日期函数"><a href="#日期函数" class="headerlink" title="日期函数"></a>日期函数</h2><p><img src="https://s2.loli.net/2023/04/05/YmQq6HKJa95vIVF.png" alt="image.png"></p><p>比如</p><p><code>select date_add(now(),interval 70 day)</code></p><h2 id="约束"><a href="#约束" class="headerlink" title="约束"></a>约束</h2><h3 id="普通约束"><a href="#普通约束" class="headerlink" title="普通约束"></a>普通约束</h3><p><img src="https://s2.loli.net/2023/04/05/qUXdzQtPxpf7SVi.png" alt="image.png"></p><p>age int check(age>0&&age<=120) check这个约束是这样用，代表年龄在0到120</p><p>status char(1) default’1’ 代表如果不设置status这个值，默认为 1</p><p>id int primary key auto_increment 代表自动增长而且在这一行数据中唯一，与unique不同，unique是在这一个字段中唯一</p><p>name varchar(20) not null unique 代表唯一而且不能为空</p><h3 id="外键约束"><a href="#外键约束" class="headerlink" title="外键约束"></a>外键约束</h3><h4 id="添加外键"><a href="#添加外键" class="headerlink" title="添加外键"></a>添加外键</h4><p><img src="https://s2.loli.net/2023/04/05/V6aMr7zxCnkFUJi.png" alt="image.png"></p><h4 id="删除外键"><a href="#删除外键" class="headerlink" title="删除外键"></a>删除外键</h4><p>alter table 表名 drop foreign key 外键名称</p><h4 id="更新-x2F-删除时相应的父子表关系"><a href="#更新-x2F-删除时相应的父子表关系" class="headerlink" title="更新/删除时相应的父子表关系"></a>更新/删除时相应的父子表关系</h4><p><img src="https://s2.loli.net/2023/04/05/kWhvLiSuJ5aq6dI.png" alt="image.png"></p><p>运用的语法</p><p><img src="https://s2.loli.net/2023/04/05/v34qLnGjWe8YySw.png" alt="image.png"></p><p>这个代表更新时候遵守的规则和删除时遵守的规则</p><h2 id="多表查询"><a href="#多表查询" class="headerlink" title="多表查询"></a>多表查询</h2><h3 id="内连接"><a href="#内连接" class="headerlink" title="内连接"></a>内连接</h3><p>对查询结果去重只需要在select后加入distinct 比如</p><p><img src="https://s2.loli.net/2023/04/05/cIpbLHVgRmxJX3n.png" alt="image.png"></p><h4 id="隐式内连接"><a href="#隐式内连接" class="headerlink" title="隐式内连接"></a>隐式内连接</h4><p><code>select emp.name, dept.name from emp ,dept where epm.dept_id=dept.id;</code></p><p>以上是查询两张表的员工名字和部门名字的代码</p><h4 id="显式内连接"><a href="#显式内连接" class="headerlink" title="显式内连接"></a>显式内连接</h4><p><code>select e,name,d.name from emp e join dept d on e.dept_id=d.id</code></p><p>还有另一种形式 inner可以省略</p><p><code>select e,name,d.name drom emp e join dept d on e.dept_id=d.id</code></p><h3 id="外连接"><a href="#外连接" class="headerlink" title="外连接"></a>外连接</h3><h4 id="左外连接"><a href="#左外连接" class="headerlink" title="左外连接"></a>左外连接</h4><p>会查询到左边这个表的全部信息纵使它不符合条件</p><p><img src="https://s2.loli.net/2023/04/05/kz58dG2FrqweZxM.png" alt="image.png"></p><h4 id="右外连接"><a href="#右外连接" class="headerlink" title="右外连接"></a>右外连接</h4><p>同理</p><p><img src="https://s2.loli.net/2023/04/05/odPzfsupJQ3DWHA.png" alt="image.png"></p><h3 id="自连接"><a href="#自连接" class="headerlink" title="自连接"></a>自连接</h3><p>自连接的作用，比如下面 managerid代表了直属领导，当我们要查询每个人的领导时，需要用到自查询</p><p><img src="https://s2.loli.net/2023/04/05/gsqDZlzCtnrdIiu.png" alt="image.png"></p><p><img src="https://s2.loli.net/2023/04/05/ShvzUH3EW2FrDiO.png" alt="image.png"></p><p>把它看成两张表更好理解,如果想要查询没有领导也可以查询出来，可以用左查询</p><h3 id="内连接和外连接的区别"><a href="#内连接和外连接的区别" class="headerlink" title="内连接和外连接的区别"></a>内连接和外连接的区别</h3><p>left join （左连接）：返回包括左表中的所有记录和右表中连接字段相等的记录。. right join （右连接）：返回包括右表中的所有记录和左表中连接字段相等的记录。. inner join （等值连接或者叫内连接）：只返回两个表中连接字段相等的行。</p><h2 id="子查询"><a href="#子查询" class="headerlink" title="子查询"></a>子查询</h2><p><img src="https://s2.loli.net/2023/04/05/7HsJfgApSUK6Cvi.png" alt="image.png"></p><h3 id="列子查询"><a href="#列子查询" class="headerlink" title="列子查询"></a>列子查询</h3><p><img src="https://s2.loli.net/2023/04/05/CuxB7XNvEA3r6Fs.png" alt="image.png"></p><p><code>select id from dept where name='销售部'or name='市场部'</code></p><p>查询市场部和销售部的所有员工的id</p><p><code>select * from emp where dept_id in (select id from dept where name='销售部'or name='市场部'</code>) `</p><h3 id="行子查询"><a href="#行子查询" class="headerlink" title="行子查询"></a>行子查询</h3><p>还有这种表现形式，行子查询</p><p><code>select * from emp where (salary,managerid)=(12500,3)</code></p><p><img src="https://s2.loli.net/2023/04/05/T19CxdDNGbqhXZW.png" alt="image.png"></p><h3 id="表子查询"><a href="#表子查询" class="headerlink" title="表子查询"></a>表子查询</h3><p><img src="https://s2.loli.net/2023/04/05/A1U8iOgaBEY5Nxz.png" alt="image.png"></p><p>还可以把查询返回的数据当成一张表</p><h1 id="事务"><a href="#事务" class="headerlink" title="事务"></a>事务</h1><h2 id="查看事务"><a href="#查看事务" class="headerlink" title="查看事务"></a>查看事务</h2><p>select @@autocommit</p><p>自动提交为1，手动提交为0</p><h2 id="更改事务"><a href="#更改事务" class="headerlink" title="更改事务"></a>更改事务</h2><p>set @@autocommit=0</p><h2 id="提交事务"><a href="#提交事务" class="headerlink" title="提交事务"></a>提交事务</h2><p>commit</p><h2 id="回滚事务"><a href="#回滚事务" class="headerlink" title="回滚事务"></a>回滚事务</h2><p>当发生错误时，就需要回滚事务</p><p>rollback；</p><p>还有另一种方式运用事务</p><h2 id="开启事务"><a href="#开启事务" class="headerlink" title="开启事务"></a>开启事务</h2><p>start transaction或者 begin</p><p>其余不变</p><h2 id="事务隔离"><a href="#事务隔离" class="headerlink" title="事务隔离"></a>事务隔离</h2><p>查看事务隔离级别</p><p><img src="/mysql%E7%9A%84%E5%9F%BA%E7%A1%80%E5%87%BD%E6%95%B0.assets/image-20230405124449153.png" alt="image-20230405124449153"></p><p><img src="https://s2.loli.net/2023/04/05/CyQrwIN5jnGhpA8.png" alt="image.png"></p><h2 id="查看事务进程"><a href="#查看事务进程" class="headerlink" title="查看事务进程"></a>查看事务进程</h2><p>SELECT * FROM information_schema.INNODB_TRX</p>]]></content>
<categories>
<category>数据库</category>
</categories>
<tags>
<tag>mysql</tag>
</tags>
</entry>
<entry>
<title>vue3-全局事件的使用</title>
<link href="/super_zhu/2023/04/04/vue3-%E5%85%A8%E5%B1%80%E4%BA%8B%E4%BB%B6%E7%9A%84%E4%BD%BF%E7%94%A8/"/>
<url>/super_zhu/2023/04/04/vue3-%E5%85%A8%E5%B1%80%E4%BA%8B%E4%BB%B6%E7%9A%84%E4%BD%BF%E7%94%A8/</url>
<content type="html"><![CDATA[<h1 id="vue3-全局事件的使用"><a href="#vue3-全局事件的使用" class="headerlink" title="vue3-全局事件的使用"></a>vue3-全局事件的使用</h1><h2 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h2><p><strong>对于全局事件总线，它是一种组件间通信的方式，可以让任意组件进行通信</strong></p><p>它就相当于一个中间介质可以让组件通信，可以理解为他就是一个上帝，不参与组件，只负责通信</p><p>如下图</p><p><img src="https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/28a918da2c7841a8baced67fc46ff24e~tplv-k3u1fbpfcp-zoom-in-crop-mark:4536:0:0:0.awebp"></p><h2 id="安装"><a href="#安装" class="headerlink" title="安装"></a>安装</h2><p> vue3推荐使用mitt</p><h3 id="安装mitt"><a href="#安装mitt" class="headerlink" title="安装mitt"></a>安装mitt</h3><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">npm install mitt<br></code></pre></td></tr></table></figure><h3 id="mitt引入"><a href="#mitt引入" class="headerlink" title="mitt引入"></a>mitt引入</h3><h4 id="全局引入"><a href="#全局引入" class="headerlink" title="全局引入"></a>全局引入</h4><p>在main.js文件</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-keyword">import</span> mitt <span class="hljs-keyword">from</span> <span class="hljs-string">"mitt"</span><br><span class="hljs-keyword">const</span> app = <span class="hljs-title function_">createApp</span>(<span class="hljs-title class_">App</span>)<br><span class="hljs-keyword">const</span> bus = <span class="hljs-title function_">mitt</span>()<br>app.<span class="hljs-property">config</span>.<span class="hljs-property">globalProperties</span>.<span class="hljs-property">$bus</span> = bus<br></code></pre></td></tr></table></figure><p>在组件内使用</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-keyword">import</span> { getCurrentInstance } <span class="hljs-keyword">from</span> <span class="hljs-string">'vue'</span><br><span class="hljs-keyword">const</span> cxt = <span class="hljs-title function_">getCurrentInstance</span>() <span class="hljs-comment">//相当于Vue2中的this</span><br> <span class="hljs-keyword">const</span> bus = cxt.<span class="hljs-property">appContext</span>.<span class="hljs-property">config</span>.<span class="hljs-property">globalProperties</span>.<span class="hljs-property">$bus</span><br> <span class="hljs-keyword">const</span> emitMitt = <span class="hljs-keyword">function</span>(<span class="hljs-params"></span>){<br> bus.<span class="hljs-title function_">emit</span>(<span class="hljs-string">'printMessage'</span>,<span class="hljs-string">'我被触发了'</span>) <span class="hljs-comment">//触发其他组件监听的名为printMessage的事件</span><br> }<br></code></pre></td></tr></table></figure><h4 id="局部引入（推荐）"><a href="#局部引入（推荐）" class="headerlink" title="局部引入（推荐）"></a>局部引入（推荐）</h4><p>在src目录内定义一个js文件（在这里是bus.js）</p><p>在bus.js文件中</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-keyword">import</span> mitt <span class="hljs-keyword">from</span> <span class="hljs-string">'mitt'</span><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> events = <span class="hljs-title function_">mitt</span>()<br></code></pre></td></tr></table></figure><p>在使用的组件内</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><code class="hljs js"><br><span class="hljs-keyword">import</span> {events} <span class="hljs-keyword">from</span> <span class="hljs-string">'../../bus.js'</span> <span class="hljs-comment">//引入bus.js文件</span><br><br><span class="hljs-comment">//在setup中</span><br><span class="hljs-keyword">let</span> <span class="hljs-title function_">clikmenu</span>=(<span class="hljs-params">e</span>)=>{<br> events.<span class="hljs-title function_">emit</span>(<span class="hljs-string">"clikmenu"</span>,e) <span class="hljs-comment">//可以直接使用</span><br>}<br></code></pre></td></tr></table></figure><h2 id="主要使用的三种方法"><a href="#主要使用的三种方法" class="headerlink" title="主要使用的三种方法"></a>主要使用的三种方法</h2><p> 分别是<code>emit</code>，<code>on</code>，<code>off</code></p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-comment">//三种方法的主要结构分别是</span><br><span class="hljs-title function_">emit</span>(name,data) <span class="hljs-comment">// 触发相应事件 name:触发事件的名字 data:传递过去的参数</span><br><span class="hljs-title function_">on</span>(name,callback) <span class="hljs-comment">//绑定相应的事件等待emit的触发 name:触发事件的名字 callback:出发后执行回调函数</span><br><span class="hljs-title function_">off</span>(name) <span class="hljs-comment">//解绑相应事件 name:需要解绑的事件名</span><br></code></pre></td></tr></table></figure><p><strong>注意：必须保证先绑定事件再触发事件</strong></p><p><strong>以下示例</strong></p><p><strong>在layout组件中</strong></p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-keyword">import</span> {events} <span class="hljs-keyword">from</span> <span class="hljs-string">'../../bus.js'</span> <br><br><span class="hljs-comment">//在setup中</span><br><span class="hljs-title function_">onMounted</span>(<span class="hljs-function">()=></span>{<br>events.<span class="hljs-title function_">on</span>(<span class="hljs-string">"clikmenu"</span>,<span class="hljs-function">(<span class="hljs-params">e</span>)=></span>{<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(e)<br>})<br>})<br><br><br><span class="hljs-title function_">onBeforeUnmount</span>(<span class="hljs-function">()=></span>{<br> events.<span class="hljs-title function_">off</span>(<span class="hljs-string">'clikmenu'</span>)<br> })<br></code></pre></td></tr></table></figure><p>在aside.vue组件中</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><code class="hljs js"> <el-menu-item @click=<span class="hljs-string">"clikm(item)"</span> v-<span class="hljs-keyword">else</span> :key=<span class="hljs-string">"index + item.id"</span> :index=<span class="hljs-string">"item.id"</span>><br> <br><span class="hljs-keyword">import</span> {events} <span class="hljs-keyword">from</span> <span class="hljs-string">'../../bus.js'</span><br><span class="hljs-comment">//setup中</span><br><span class="hljs-keyword">let</span> <span class="hljs-title function_">clikm</span>=(<span class="hljs-params">e</span>)=>{<br> events.<span class="hljs-title function_">emit</span>(<span class="hljs-string">"clikmenu"</span>,e)<br>}<br></code></pre></td></tr></table></figure><p>当在aside.vue组件执行点击函数clikm就会触发layout.vue中的onMounted中绑定好的事件的回调函数</p>]]></content>
<categories>
<category>web</category>
</categories>
<tags>
<tag>vue</tag>
</tags>
</entry>
<entry>
<title>vue3修改第三方ui组件或者其他样式不生效</title>
<link href="/super_zhu/2023/03/29/vue3%E4%BF%AE%E6%94%B9%E7%AC%AC%E4%B8%89%E6%96%B9ui%E7%BB%84%E4%BB%B6%E5%A4%B1%E6%95%88/"/>
<url>/super_zhu/2023/03/29/vue3%E4%BF%AE%E6%94%B9%E7%AC%AC%E4%B8%89%E6%96%B9ui%E7%BB%84%E4%BB%B6%E5%A4%B1%E6%95%88/</url>
<content type="html"><![CDATA[<h1 id="关于vue在添加scoped后修改第三方ui组件或者其他样式不生效"><a href="#关于vue在添加scoped后修改第三方ui组件或者其他样式不生效" class="headerlink" title="关于vue在添加scoped后修改第三方ui组件或者其他样式不生效"></a>关于vue在添加scoped后修改第三方ui组件或者其他样式不生效</h1><h2 id="废话"><a href="#废话" class="headerlink" title="废话"></a>废话</h2><p><strong>最近一个项目，因为vue的实际开发经验少，一直修改el-table样式失效，苦苦找不到原因折磨死我了，啊啊啊啊啊！！！最后多方查找才找到其原因，痛煞老</strong></p><h2 id="原因"><a href="#原因" class="headerlink" title="原因"></a>原因</h2><p>我们常常在组件中加入<code>scoped</code>来防止组件间的样式污染，而<code>scoped</code>就是罪魁祸首，我们先说scoped的原理</p><h2 id="scoped的原理"><a href="#scoped的原理" class="headerlink" title="scoped的原理"></a>scoped的原理</h2><h3 id="在组件添加了scoped后发生的变化"><a href="#在组件添加了scoped后发生的变化" class="headerlink" title="在组件添加了scoped后发生的变化"></a>在组件添加了scoped后发生的变化</h3><ul><li>vue会在dom节点加入一个data-v-xxxxx的属性</li><li>在编译css后，会在其后最后一个选择器加入[data-v-xxxxx]形成属性选择器</li><li>因为每个组件的data-v-xxxxx是唯一的，所以scoped起到管理样式，防止样式污染的作用</li></ul><h3 id="在dom节点中打入属性"><a href="#在dom节点中打入属性" class="headerlink" title="在dom节点中打入属性"></a><strong>在dom节点中打入属性</strong></h3><p>对于本组件的dom节点和其子组件的根节点都会打入属性（只有根节点）</p><p>其引入的<code>el-table</code>是属于子组件，所以下面第二张图有两个div被打入属性</p><p><img src="https://s2.loli.net/2023/03/29/XdPCfvgcytnZ1p7.png" alt="image.png"></p><p><img src="https://s2.loli.net/2023/03/29/PMyF9rxgV8B2bho.png" alt="image.png"></p><h3 id="编译css时打入相应属性"><a href="#编译css时打入相应属性" class="headerlink" title="编译css时打入相应属性"></a><strong>编译css时打入相应属性</strong></h3><p>添加scoped后，我们会在选择器后加入属性变成属性选择器</p><p>如用上面的程序的类名示例</p><figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><code class="hljs css">//编译前<br><span class="hljs-selector-class">.div_</span>{<br><span class="hljs-attribute">background</span>:<span class="hljs-number">#000</span>;<br>}<br>//编译后<br><span class="hljs-selector-class">.div_</span><span class="hljs-selector-attr">[data-v-0b22be8e]</span>{<br><span class="hljs-attribute">background</span>:<span class="hljs-number">#000</span>;<br>}<br></code></pre></td></tr></table></figure><p>这样就可以防止组件间的样式污染，达到只对于本组件生效</p><h2 id="对于第三方组件样式不生效原因"><a href="#对于第三方组件样式不生效原因" class="headerlink" title="对于第三方组件样式不生效原因"></a>对于第三方组件样式不生效原因</h2><p>以上说了打入scoped打入属性的范围和css编译的变化我们就可以很快的理解</p><p>如下创建了一个子组件</p><p><img src="https://s2.loli.net/2023/03/29/tzZXrV3oQw6D1xh.png" alt="image.png"></p><p>将这个子组件引入了一个添加了scoped的父组件中</p><p>其在效果是这样的</p><p><img src="https://s2.loli.net/2023/03/29/9il3cLKvpBnMbdY.png" alt="image.png"></p><p>可以看到其根节点div被打入了父组件的属性，父组件的样式以下</p><p><img src="https://s2.loli.net/2023/03/29/J8ugAY57BeinMyN.png" alt="image.png"></p><p>但最后结果显示是这样的</p><p><img src="https://s2.loli.net/2023/03/29/uwaTACpgWYEq3Hj.png" alt="image.png"></p><p>可以看到我们修改第三方ui失败，因为父组件中的样式是被打入属性的，而子组件span是没有属性的，所以选择器无法选择到span,所以修改失败</p><figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><code class="hljs css">//父组件的样式是被编译成<br><span class="hljs-selector-class">.test</span> <span class="hljs-selector-tag">span</span><span class="hljs-selector-attr">[data-v-47dbdb26]</span>{<br><span class="hljs-attribute">color</span>:<span class="hljs-number">#ff0000</span><br>}<br><br></code></pre></td></tr></table></figure><h2 id="样式穿刺解决无法修改问题"><a href="#样式穿刺解决无法修改问题" class="headerlink" title="样式穿刺解决无法修改问题"></a>样式穿刺解决无法修改问题</h2><p>在这里介绍三种穿刺方法</p><p>对于css可用</p><figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><code class="hljs css">// 使用>>><br><span class="hljs-selector-class">.test</span> >>> <span class="hljs-selector-tag">span</span>{<br><span class="hljs-attribute">color</span>:<span class="hljs-number">#ff0000</span><br>}<br><br></code></pre></td></tr></table></figure><p>对于sass和less可用</p><figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><code class="hljs css">// 使用/deep/<br><span class="hljs-selector-class">.test</span>{<br>/deep/ <span class="hljs-selector-tag">span</span>{<br><span class="hljs-attribute">color</span>:<span class="hljs-number">#ff0000</span><br>}<br>}<br><br><br>//在一些情况下无法使用可以使用::v-deep<br>.test{<br>::v-deep span{<br><span class="hljs-attribute">color</span>:<span class="hljs-number">#ff0000</span><br>}<br>}<br><br></code></pre></td></tr></table></figure><figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><code class="hljs css">//其编译结果都为<br><span class="hljs-selector-class">.test</span><span class="hljs-selector-attr">[data-v-47dbdb26]</span> <span class="hljs-selector-tag">span</span>{<br><span class="hljs-attribute">color</span>:<span class="hljs-number">#ff0000</span><br>}<br></code></pre></td></tr></table></figure><p>对于样式穿刺解决问题的原理相信大家都看出来了，就是在css编译时，不让父组件的属性结合样式穿刺器后选择器，从而达到穿刺到子组件的目的进而对样式进行修改</p>]]></content>
<categories>
<category>web</category>
</categories>
<tags>
<tag>样式穿刺</tag>
</tags>
</entry>
<entry>
<title>pinia的基础应用</title>
<link href="/super_zhu/2023/03/23/pinia%E7%9A%84%E7%AE%80%E5%8D%95%E4%BD%BF%E7%94%A8/"/>
<url>/super_zhu/2023/03/23/pinia%E7%9A%84%E7%AE%80%E5%8D%95%E4%BD%BF%E7%94%A8/</url>
<content type="html"><![CDATA[<h1 id="pinia的基础使用"><a href="#pinia的基础使用" class="headerlink" title="pinia的基础使用"></a>pinia的基础使用</h1><h2 id="pinia的安装"><a href="#pinia的安装" class="headerlink" title="pinia的安装"></a>pinia的安装</h2><p>只需要在终端输入</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">npm install pinia<br></code></pre></td></tr></table></figure><h2 id="利用pinia定义一个store"><a href="#利用pinia定义一个store" class="headerlink" title="利用pinia定义一个store"></a>利用pinia定义一个store</h2><p>在vue3的<code>main.js</code>中</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-keyword">import</span> { createPinia } <span class="hljs-keyword">from</span> <span class="hljs-string">'pinia'</span><br><br>app.<span class="hljs-title function_">use</span>(<span class="hljs-title function_">createPinia</span>())<br></code></pre></td></tr></table></figure><p>在相应的store的js文件中</p><p>其中pinia有两个写法</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-keyword">import</span> { defineStore } <span class="hljs-keyword">from</span> <span class="hljs-string">'pinia'</span><br><span class="hljs-comment">//userstore是这个状态的唯一标识 这是pinia的setup Stores写法</span><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> usestore = <span class="hljs-title function_">defineStore</span>(<span class="hljs-string">'userinfo'</span>, <span class="hljs-function">() =></span> {})<br>pinia的options <span class="hljs-title class_">Stores</span>写法<br><span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> usestore = <span class="hljs-title function_">defineStore</span>(<span class="hljs-string">'userinfo'</span>, {})<br></code></pre></td></tr></table></figure><p>下面介绍setup Stores写法</p><h2 id="state"><a href="#state" class="headerlink" title="state"></a>state</h2><p>在代码中定义数据再进行返回相当于options Stores的state</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-comment">//在login.js</span><br><span class="hljs-keyword">import</span> { defineStore } <span class="hljs-keyword">from</span> <span class="hljs-string">'pinia'</span><br><span class="hljs-keyword">import</span> { reactive, ref } <span class="hljs-keyword">from</span> <span class="hljs-string">'vue'</span><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> usestore = <span class="hljs-title function_">defineStore</span>(<span class="hljs-string">'userinfo'</span>, <span class="hljs-function">() =></span> {<br> <span class="hljs-keyword">let</span> logindata = <span class="hljs-title function_">reactive</span>({})<br> <span class="hljs-comment">//或者ref都可以</span><br> <span class="hljs-keyword">return</span>{<br> logindata<br> }<br> }<br></code></pre></td></tr></table></figure><p>在业务文件中使用数据</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-keyword">import</span> {usestore} <span class="hljs-keyword">from</span> <span class="hljs-string">'../pinia/login'</span><br><span class="hljs-keyword">var</span> store=<span class="hljs-title function_">usestore</span>()<br><span class="hljs-comment">//可以直接store.logindata使用login.js</span><br></code></pre></td></tr></table></figure><h2 id="getters和actions"><a href="#getters和actions" class="headerlink" title="getters和actions"></a>getters和actions</h2><p>相比于options Stores写法，setup Stores写法的函数相当于getters和actions</p><p>action支持异步调用，两种写法都可以</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-keyword">function</span> <span class="hljs-title function_">setinfo</span>(<span class="hljs-params">data</span>) {<br> logindata=data<br>}<br><span class="hljs-keyword">function</span> <span class="hljs-title function_">getinfo</span>(<span class="hljs-params"></span>) {<br> <span class="hljs-keyword">return</span> logindata<br>}<br></code></pre></td></tr></table></figure><p>在业务文件中</p><p><strong>actions</strong></p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><code class="hljs js"><br><span class="hljs-keyword">let</span> <span class="hljs-title function_">onSubmit</span>=(<span class="hljs-params"></span>)=>{<br>store.<span class="hljs-title function_">setinfo</span>(data.<span class="hljs-property">logindata</span>) <span class="hljs-comment">//可以直接调动函数</span><br>}<br></code></pre></td></tr></table></figure><p><strong>getters</strong></p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><code class="hljs js"><div>{{store.<span class="hljs-title function_">getinfo</span>().<span class="hljs-property">username</span>}}<<span class="hljs-regexp">/div> /</span><span class="hljs-regexp">/下面记得暴露了store 可直接使用</span><br><span class="hljs-regexp"></span><br><span class="hljs-regexp"></span><br><span class="hljs-regexp">/</span><span class="hljs-regexp">/JavaScript</span><br><span class="hljs-regexp">import {usestore} from '../</span>pinia/login<span class="hljs-string">'</span><br><span class="hljs-string">setup(){</span><br><span class="hljs-string"> </span><br><span class="hljs-string">var store=usestore()</span><br><span class="hljs-string">return{</span><br><span class="hljs-string">store</span><br><span class="hljs-string">}</span><br><span class="hljs-string">}</span><br></code></pre></td></tr></table></figure><h2 id="subscribe"><a href="#subscribe" class="headerlink" title="$subscribe"></a>$subscribe</h2><p>当所属的的store的数据发生改变便执行回调函数</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-keyword">import</span> {usestore} <span class="hljs-keyword">from</span> <span class="hljs-string">'../pinia/login'</span><br><span class="hljs-keyword">var</span> store=<span class="hljs-title function_">usestore</span>()<br>store.$subscribe(<span class="hljs-function">(<span class="hljs-params">mutation, state</span>)=></span>{<br> <span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(mutation);<br> <span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(state);<br>})<br></code></pre></td></tr></table></figure><h2 id="数据持久化（存储在本地）"><a href="#数据持久化（存储在本地）" class="headerlink" title="数据持久化（存储在本地）"></a>数据持久化（存储在本地）</h2><p>下载插件<code>pinia-plugin-persist</code></p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">npm i pinia-plugin-persist<br></code></pre></td></tr></table></figure><p>再在main.js引入</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-keyword">import</span> { createPinia } <span class="hljs-keyword">from</span> <span class="hljs-string">'pinia'</span><br><span class="hljs-keyword">import</span> piniaPluginPersist <span class="hljs-keyword">from</span> <span class="hljs-string">'pinia-plugin-persist'</span><br><span class="hljs-keyword">const</span> pinia = <span class="hljs-title function_">createPinia</span>()<br>pinia.<span class="hljs-title function_">use</span>(piniaPluginPersist)<br>app.<span class="hljs-title function_">use</span>(pinia)<br></code></pre></td></tr></table></figure><p>在pinia的文件下</p><p>对于setup Stores写法</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-keyword">import</span> { defineStore } <span class="hljs-keyword">from</span> <span class="hljs-string">'pinia'</span><br><span class="hljs-keyword">import</span> { reactive, ref } <span class="hljs-keyword">from</span> <span class="hljs-string">'vue'</span><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> usestore = <span class="hljs-title function_">defineStore</span>(<span class="hljs-string">'userinfo'</span>, <span class="hljs-function">() =></span> {<br> <span class="hljs-keyword">let</span> logindata = <span class="hljs-title function_">reactive</span>({})<br> <span class="hljs-keyword">function</span> <span class="hljs-title function_">setinfo</span>(<span class="hljs-params">data</span>) {<br> logindata.<span class="hljs-property">username</span> = data.<span class="hljs-property">username</span><br> logindata.<span class="hljs-property">passwrod</span> = data.<span class="hljs-property">passwrod</span><br> }<br> <span class="hljs-keyword">function</span> <span class="hljs-title function_">getinfo</span>(<span class="hljs-params"></span>) {<br> <span class="hljs-keyword">return</span> logindata<br> }<br> <span class="hljs-keyword">return</span> {<br> logindata,<br> setinfo,<br> getinfo,<br> }<br><br>}, {<br> <span class="hljs-attr">persist</span>: {<br> <span class="hljs-attr">enabled</span>: <span class="hljs-literal">true</span>,<br> <span class="hljs-attr">strategies</span>: [{ <span class="hljs-attr">key</span>: <span class="hljs-string">'user'</span>, <span class="hljs-attr">storage</span>: <span class="hljs-variable language_">localStorage</span> }]<br> }<br>})<br></code></pre></td></tr></table></figure><p>对于options setup写法来说只要在state同级加入persist配置即可</p>]]></content>
<categories>
<category>web</category>
</categories>
<tags>
<tag>pinia</tag>
</tags>
</entry>
<entry>
<title>sass的基础应用</title>
<link href="/super_zhu/2023/03/17/sass/"/>
<url>/super_zhu/2023/03/17/sass/</url>
<content type="html"><![CDATA[<h1 id="sass"><a href="#sass" class="headerlink" title="sass"></a>sass</h1><h2 id="安装"><a href="#安装" class="headerlink" title="安装"></a>安装</h2><p>在安装之前建议先卸载旧版本</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">npm uninstall sass-loader node-sass<br></code></pre></td></tr></table></figure><p>然后进行安装</p><p><strong>切记！！！</strong></p><p>如果你的node版本不是最新版，请指定版本安装</p><p>可前往这里查询<a href="https://www.npmjs.com/package/node-sass">node-sass - npm (npmjs.com)</a></p><p>至于node-sass和sass-loader的对应版本可自行查询百度</p><p>如果你的node是最新版可直接用以下命令行安装</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">npm install node-sass sass-loader -D<br></code></pre></td></tr></table></figure><p><strong>重点！！！</strong></p><p>如无法正常卸载node-sass和sass-loader，请在<strong>package.json文件</strong>和<strong>package-lock.json文件</strong>修改两个包的版本号再执行命令</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">npm install<br></code></pre></td></tr></table></figure><p>如我的node版本是<code>v18.15.0</code>对应包版本是</p><p><img src="https://s2.loli.net/2023/03/18/fatHquTmOdBFzEX.png" alt="image.png"></p><p>比如我们有一个.sass文件，我们现在要把他编译成.css文件</p><p>文件名为test.sass</p><p>执行</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sass test.scss<br></code></pre></td></tr></table></figure><p>也可以直接能保存到css文件</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sass test.scss runoob-test.css<br></code></pre></td></tr></table></figure><h2 id="sass变量"><a href="#sass变量" class="headerlink" title="sass变量"></a>sass变量</h2><p>使用$符号表示变量</p><figure class="highlight gams"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs gams"><span class="hljs-meta"><span class="hljs-keyword">$variablename</span>: value;</span><br></code></pre></td></tr></table></figure><h3 id="值的变量"><a href="#值的变量" class="headerlink" title="值的变量"></a>值的变量</h3><p>如下代码示例</p><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><code class="hljs sass">$myFont: Helvetica, sans-serif;<br>$myColor: red;<br>$myFontSize: 18px;<br>$myWidth: 680px;<br><br>body {<br> font-family: $myFont;<br> font-size: $myFontSize;<br> color: $myColor;<br>}<br><br>#container {<br> width: $myWidth;<br>}<br></code></pre></td></tr></table></figure><p>换成css代码是</p><figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><code class="hljs css"><span class="hljs-selector-tag">body</span> {<br> <span class="hljs-attribute">font-family</span>: Helvetica, sans-serif;<br> <span class="hljs-attribute">font-size</span>: <span class="hljs-number">18px</span>;<br> <span class="hljs-attribute">color</span>: red;<br>}<br><br><span class="hljs-selector-id">#container</span> {<br> <span class="hljs-attribute">width</span>: <span class="hljs-number">680px</span>;<br>}<br></code></pre></td></tr></table></figure><h3 id="作用域"><a href="#作用域" class="headerlink" title="作用域"></a>作用域</h3><p>你在标签里定义的话，作用域就只在定义的标签里</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-variable">$myColor</span>: red;<br><br><span class="hljs-selector-tag">h1</span> {<br> <span class="hljs-variable">$myColor</span>: green; <span class="hljs-comment">// 定义了一个变量，只在 h1 里头有用，局部作用域</span><br> <span class="hljs-attribute">color</span>: <span class="hljs-variable">$myColor</span>;<br>}<br><br><span class="hljs-selector-tag">p</span> {<br> <span class="hljs-attribute">color</span>: <span class="hljs-variable">$myColor</span>;<br>}<br></code></pre></td></tr></table></figure><p>利用！global就能够让变量变成全局</p><p>如</p><figure class="highlight mel"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><code class="hljs mel">$myColor: red;<br><br>h1 {<br> $myColor: green !<span class="hljs-keyword">global</span>; <span class="hljs-comment">// 全局作用域</span><br> <span class="hljs-keyword">color</span>: $myColor;<br>}<br><br>p {<br> <span class="hljs-keyword">color</span>: $myColor;<br>}<br></code></pre></td></tr></table></figure><p>转换成css代码就是</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-selector-tag">h1</span> {<br> <span class="hljs-attribute">color</span>: green;<br>}<br><br><span class="hljs-selector-tag">p</span> {<br> <span class="hljs-attribute">color</span>: green;<br>}<br></code></pre></td></tr></table></figure><h2 id="sass的嵌套规则和属性"><a href="#sass的嵌套规则和属性" class="headerlink" title="sass的嵌套规则和属性"></a>sass的嵌套规则和属性</h2><h3 id="嵌套规则"><a href="#嵌套规则" class="headerlink" title="嵌套规则"></a>嵌套规则</h3><p>类似于html</p><p>如</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-selector-tag">nav</span> {<br> <span class="hljs-selector-tag">ul</span> {<br> <span class="hljs-attribute">margin</span>: <span class="hljs-number">0</span>;<br> <span class="hljs-attribute">padding</span>: <span class="hljs-number">0</span>;<br> <span class="hljs-attribute">list-style</span>: none;<br> }<br> <span class="hljs-selector-tag">li</span> {<br> <span class="hljs-attribute">display</span>: inline-block;<br> }<br> <span class="hljs-selector-tag">a</span> {<br> <span class="hljs-attribute">display</span>: block;<br> <span class="hljs-attribute">padding</span>: <span class="hljs-number">6px</span> <span class="hljs-number">12px</span>;<br> <span class="hljs-attribute">text-decoration</span>: none;<br> }<br>}<br></code></pre></td></tr></table></figure><p>转换成css为</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-selector-tag">nav</span> {<br> <span class="hljs-selector-tag">ul</span> {<br> <span class="hljs-attribute">margin</span>: <span class="hljs-number">0</span>;<br> <span class="hljs-attribute">padding</span>: <span class="hljs-number">0</span>;<br> <span class="hljs-attribute">list-style</span>: none;<br> }<br> <span class="hljs-selector-tag">li</span> {<br> <span class="hljs-attribute">display</span>: inline-block;<br> }<br> <span class="hljs-selector-tag">a</span> {<br> <span class="hljs-attribute">display</span>: block;<br> <span class="hljs-attribute">padding</span>: <span class="hljs-number">6px</span> <span class="hljs-number">12px</span>;<br> <span class="hljs-attribute">text-decoration</span>: none;<br> }<br>}<br></code></pre></td></tr></table></figure><h3 id="嵌套属性"><a href="#嵌套属性" class="headerlink" title="嵌套属性"></a>嵌套属性</h3><p>说白了就是有相同前缀的属性可以写的更简洁</p><p>比如现在关于字的样式写法</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-attribute">font</span>: {<br> family: Helvetica, sans-serif;<br> size: <span class="hljs-number">18px</span>;<br> weight: bold;<br>}<br></code></pre></td></tr></table></figure><p>编译成</p><figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><code class="hljs css"><span class="hljs-attribute">font-family</span>: Helvetica, sans-serif;<br><span class="hljs-attribute">font-size</span>: <span class="hljs-number">18px</span>;<br><span class="hljs-attribute">font-weight</span>: bold;<br><br><span class="hljs-attribute">text-align</span>: center;<br><span class="hljs-attribute">text-transform</span>: lowercase;<br><span class="hljs-attribute">text-overflow</span>: hidden;<br></code></pre></td></tr></table></figure><h2 id="import"><a href="#import" class="headerlink" title="@import"></a>@import</h2><p>对于sass也可以导入css文件</p><p>如导入sass文件</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-keyword">@import</span> <span class="hljs-string">"variables"</span>;<br><span class="hljs-keyword">@import</span> <span class="hljs-string">"colors"</span>;<br><span class="hljs-keyword">@import</span> <span class="hljs-string">"reset"</span>;<br></code></pre></td></tr></table></figure><p>其中 “colors”是文件名</p><h2 id="mixin-与-include"><a href="#mixin-与-include" class="headerlink" title="@mixin 与 @include"></a>@mixin 与 @include</h2><p><strong>@mixin 指令允许我们定义一个可以在整个样式表中重复使用的样式。</strong></p><p><strong>@include 指令可以将混入（mixin）引入到文档中。</strong></p><h3 id="定义一个mixin"><a href="#定义一个mixin" class="headerlink" title="定义一个mixin"></a>定义一个mixin</h3><p>对于mixin公式</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-keyword">@mixin</span> name { property: value; property: value; ... }<br></code></pre></td></tr></table></figure><blockquote><p>注意：对于 - 和 _ 在sass中是一样的 如 @mixin important-text { } 与 @mixin important_text { } 这两个是一样的mixin</p></blockquote><p>定义示例</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-keyword">@mixin</span> important-text {<br> <span class="hljs-attribute">color</span>: red;<br> <span class="hljs-attribute">font-size</span>: <span class="hljs-number">25px</span>;<br> <span class="hljs-attribute">font-weight</span>: bold;<br> <span class="hljs-attribute">border</span>: <span class="hljs-number">1px</span> solid blue;<br>}<br></code></pre></td></tr></table></figure><h3 id="使用mixin"><a href="#使用mixin" class="headerlink" title="使用mixin"></a>使用mixin</h3><p>使用@include包含mixin</p><p>如以下sass代码</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-selector-class">.danger</span> {<br> <span class="hljs-keyword">@include</span> important-text; <span class="hljs-comment">//在定义示例</span><br> <span class="hljs-attribute">background-color</span>: green;<br>}<br><br></code></pre></td></tr></table></figure><p>转换成css</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-selector-class">.danger</span> {<br> <span class="hljs-attribute">color</span>: red;<br> <span class="hljs-attribute">font-size</span>: <span class="hljs-number">25px</span>;<br> <span class="hljs-attribute">font-weight</span>: bold;<br> <span class="hljs-attribute">border</span>: <span class="hljs-number">1px</span> solid blue;<br> <span class="hljs-attribute">background-color</span>: green;<br>}<br></code></pre></td></tr></table></figure><p>当然mixin也可以引入mixin</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-keyword">@mixin</span> special-text {<br> <span class="hljs-keyword">@include</span> important-text;<br> <span class="hljs-keyword">@include</span> link;<br> <span class="hljs-keyword">@include</span> special-border;<br>}<br></code></pre></td></tr></table></figure><h3 id="向mixin传入变量"><a href="#向mixin传入变量" class="headerlink" title="向mixin传入变量"></a>向mixin传入变量</h3><p>如以下：</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-comment">/* 混入接收两个参数 */</span><br><span class="hljs-keyword">@mixin</span> bordered(<span class="hljs-variable">$color</span>, <span class="hljs-variable">$width</span>) {<br> <span class="hljs-attribute">border</span>: <span class="hljs-variable">$width</span> solid <span class="hljs-variable">$color</span>;<br>}<br><br><span class="hljs-selector-class">.myArticle</span> {<br> <span class="hljs-keyword">@include</span> bordered(blue, <span class="hljs-number">1px</span>); <span class="hljs-comment">// 调用混入，并传递两个参数</span><br>}<br><br><span class="hljs-selector-class">.myNotes</span> {<br> <span class="hljs-keyword">@include</span> bordered(red, <span class="hljs-number">2px</span>); <span class="hljs-comment">// 调用混入，并传递两个参数</span><br>}<br></code></pre></td></tr></table></figure><p>转换成css代码</p><figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><code class="hljs css"><span class="hljs-selector-class">.myArticle</span> {<br> <span class="hljs-attribute">border</span>: <span class="hljs-number">1px</span> solid blue;<br>}<br><br><span class="hljs-selector-class">.myNotes</span> {<br> <span class="hljs-attribute">border</span>: <span class="hljs-number">2px</span> solid red;<br>}<br></code></pre></td></tr></table></figure><p><strong>定义传入默认值则是</strong></p><figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><code class="hljs css"><span class="hljs-keyword">@mixin</span> bordered($<span class="hljs-attribute">color</span>: blue, $<span class="hljs-attribute">width</span>: <span class="hljs-number">1px</span>) {<br> <span class="hljs-attribute">border</span>: $width solid $color;<br>}<br></code></pre></td></tr></table></figure><p>当我们对于一个有默认值的mixin我们只需要传入想要的值，如</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-keyword">@mixin</span> sexy-border(<span class="hljs-variable">$color</span>, <span class="hljs-variable">$width</span>: <span class="hljs-number">1in</span>) {<br> <span class="hljs-attribute">border</span>: {<br> <span class="hljs-attribute">color</span>: <span class="hljs-variable">$color</span>;<br> <span class="hljs-attribute">width</span>: <span class="hljs-variable">$width</span>;<br> style: dashed;<br> }<br>}<br><span class="hljs-selector-tag">p</span> { <span class="hljs-keyword">@include</span> sexy-border(blue); }<br><span class="hljs-selector-tag">h1</span> { <span class="hljs-keyword">@include</span> sexy-border(blue, <span class="hljs-number">2in</span>); }<br></code></pre></td></tr></table></figure><p>转换成css为</p><figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><code class="hljs css"><span class="hljs-selector-tag">p</span> {<br> <span class="hljs-attribute">border-color</span>: blue;<br> <span class="hljs-attribute">border-width</span>: <span class="hljs-number">1in</span>;<br> <span class="hljs-attribute">border-style</span>: dashed; }<br><br><span class="hljs-selector-tag">h1</span> {<br> <span class="hljs-attribute">border-color</span>: blue;<br> <span class="hljs-attribute">border-width</span>: <span class="hljs-number">2in</span>;<br> <span class="hljs-attribute">border-style</span>: dashed;<br>}<br></code></pre></td></tr></table></figure><p>当我们不确定需要多少个参数的时候，我们可以使用可变参数，如</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-keyword">@mixin</span> box-shadow(<span class="hljs-variable">$shadows</span>...) {<br> -moz-<span class="hljs-attribute">box-shadow</span>: <span class="hljs-variable">$shadows</span>;<br> -webkit-<span class="hljs-attribute">box-shadow</span>: <span class="hljs-variable">$shadows</span>;<br> <span class="hljs-attribute">box-shadow</span>: <span class="hljs-variable">$shadows</span>;<br>}<br><br><span class="hljs-selector-class">.shadows</span> {<br> <span class="hljs-keyword">@include</span> box-shadow(<span class="hljs-number">0px</span> <span class="hljs-number">4px</span> <span class="hljs-number">5px</span> <span class="hljs-number">#666</span>, <span class="hljs-number">2px</span> <span class="hljs-number">6px</span> <span class="hljs-number">10px</span> <span class="hljs-number">#999</span>);<br>}<br></code></pre></td></tr></table></figure><p>转换成css为</p><figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs css"><span class="hljs-selector-class">.shadows</span> {<br> -moz-<span class="hljs-attribute">box-shadow</span>: <span class="hljs-number">0px</span> <span class="hljs-number">4px</span> <span class="hljs-number">5px</span> <span class="hljs-number">#666</span>, <span class="hljs-number">2px</span> <span class="hljs-number">6px</span> <span class="hljs-number">10px</span> <span class="hljs-number">#999</span>;<br> -webkit-<span class="hljs-attribute">box-shadow</span>: <span class="hljs-number">0px</span> <span class="hljs-number">4px</span> <span class="hljs-number">5px</span> <span class="hljs-number">#666</span>, <span class="hljs-number">2px</span> <span class="hljs-number">6px</span> <span class="hljs-number">10px</span> <span class="hljs-number">#999</span>;<br> <span class="hljs-attribute">box-shadow</span>: <span class="hljs-number">0px</span> <span class="hljs-number">4px</span> <span class="hljs-number">5px</span> <span class="hljs-number">#666</span>, <span class="hljs-number">2px</span> <span class="hljs-number">6px</span> <span class="hljs-number">10px</span> <span class="hljs-number">#999</span>;<br>}<br><br></code></pre></td></tr></table></figure><h2 id="sass的继承-extend"><a href="#sass的继承-extend" class="headerlink" title="sass的继承 @extend"></a>sass的继承 @extend</h2><p>如果两个样式几乎相同时，则@extend就显得很有用</p><figure class="highlight scss"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br></pre></td><td class="code"><pre><code class="hljs scss"><span class="hljs-selector-class">.button-basic</span> {<br> <span class="hljs-attribute">border</span>: none;<br> <span class="hljs-attribute">padding</span>: <span class="hljs-number">15px</span> <span class="hljs-number">30px</span>;<br> <span class="hljs-attribute">text-align</span>: center;<br> <span class="hljs-attribute">font-size</span>: <span class="hljs-number">16px</span>;<br> <span class="hljs-attribute">cursor</span>: pointer;<br>}<br><br><span class="hljs-selector-class">.button-report</span> {<br> <span class="hljs-keyword">@extend</span> .button-basic;<br> <span class="hljs-attribute">background-color</span>: red;<br>}<br><br><span class="hljs-selector-class">.button-submit</span> {<br> <span class="hljs-keyword">@extend</span> .button-basic;<br> <span class="hljs-attribute">background-color</span>: green;<br> <span class="hljs-attribute">color</span>: white;<br>}<br></code></pre></td></tr></table></figure><p>转换成css</p><figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br></pre></td><td class="code"><pre><code class="hljs css"><span class="hljs-selector-class">.button-basic</span>, <span class="hljs-selector-class">.button-report</span>, <span class="hljs-selector-class">.button-submit</span> {<br> <span class="hljs-attribute">border</span>: none;<br> <span class="hljs-attribute">padding</span>: <span class="hljs-number">15px</span> <span class="hljs-number">30px</span>;<br> <span class="hljs-attribute">text-align</span>: center;<br> <span class="hljs-attribute">font-size</span>: <span class="hljs-number">16px</span>;<br> <span class="hljs-attribute">cursor</span>: pointer;<br>}<br><br><span class="hljs-selector-class">.button-report</span> {<br> <span class="hljs-attribute">background-color</span>: red;<br>}<br><br><span class="hljs-selector-class">.button-submit</span> {<br> <span class="hljs-attribute">background-color</span>: green;<br> <span class="hljs-attribute">color</span>: white;<br>}<br></code></pre></td></tr></table></figure><h2 id="sass函数"><a href="#sass函数" class="headerlink" title="sass函数"></a>sass函数</h2><p><a href="https://www.runoob.com/sass/sass-functions.html">Sass 函数 | 菜鸟教程 (runoob.com)</a></p><p>太多了可自行到这里查找</p>]]></content>
<categories>
<category>web</category>
</categories>
<tags>
<tag>sass</tag>
</tags>
</entry>
<entry>
<title>ts</title>
<link href="/super_zhu/2023/03/03/ts/"/>
<url>/super_zhu/2023/03/03/ts/</url>
<content type="html"><![CDATA[<h1 id="ts的安装"><a href="#ts的安装" class="headerlink" title="ts的安装"></a>ts的安装</h1><h2 id="ts自动编译"><a href="#ts自动编译" class="headerlink" title="ts自动编译"></a>ts自动编译</h2><p>在安装好ts后，在终端输入</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">tsc -init<br></code></pre></td></tr></table></figure><p>会产生一个<strong>tsconfig.json</strong>文件</p><p>然后在文件中找到outDir选项，取消注释</p><figure class="highlight json"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs json"><span class="hljs-attr">"outDir"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"./js"</span><span class="hljs-punctuation">,</span> <span class="hljs-comment">//代表自动编译后产生的js文件生成在同一目录下的js目录</span><br></code></pre></td></tr></table></figure><h3 id="然后启动监视"><a href="#然后启动监视" class="headerlink" title="然后启动监视"></a>然后启动监视</h3><p>可以选择在终端输入</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">tsc -w //监视多个文件<br></code></pre></td></tr></table></figure><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">tsc 文件相对位置 -w //监视单个文件<br></code></pre></td></tr></table></figure><p>然后保存ts代码，就会自动编译</p><h2 id="ts的一些报错"><a href="#ts的一些报错" class="headerlink" title="ts的一些报错"></a>ts的一些报错</h2><h1 id="TS2307"><a href="#TS2307" class="headerlink" title="TS2307"></a>TS2307</h1><p> <strong>Cannot find module ‘./App.vue’ or its corresponding type declarations</strong></p><p>在刚创建ts+vue项目时，你在main.ts会发现导入app.vue报错那是因为ts根本不认识<code>.vue</code></p><p>所以在src下的<code>shims-vue.d.ts</code>文件（没有自己创建）下输入</p><figure class="highlight typescript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><code class="hljs typescript"><span class="hljs-keyword">declare</span> <span class="hljs-variable language_">module</span> <span class="hljs-string">'*.vue'</span> {<br> <span class="hljs-keyword">import</span> <span class="hljs-keyword">type</span> { <span class="hljs-title class_">DefineComponent</span> } <span class="hljs-keyword">from</span> <span class="hljs-string">'vue'</span><br> <span class="hljs-keyword">const</span> <span class="hljs-attr">component</span>: <span class="hljs-title class_">DefineComponent</span><{}, {}, <span class="hljs-built_in">any</span>><br> <span class="hljs-keyword">export</span> <span class="hljs-keyword">default</span> component<br> }<br></code></pre></td></tr></table></figure>]]></content>
<categories>
<category>web</category>
</categories>
<tags>
<tag>ts</tag>
</tags>
</entry>
<entry>
<title>vue的一些基本语法</title>
<link href="/super_zhu/2023/01/05/vue/"/>
<url>/super_zhu/2023/01/05/vue/</url>
<content type="html"><![CDATA[<h1 id="vue"><a href="#vue" class="headerlink" title="vue"></a>vue</h1><h2 id="容器的简单数据绑定"><a href="#容器的简单数据绑定" class="headerlink" title="容器的简单数据绑定"></a>容器的简单数据绑定</h2><p>el的第一种写法</p><p><img src="https://s2.loli.net/2023/03/18/2HlMaOV1tGBhXDr.png" alt="image.png"></p><h3 id="el还有另外一种绑定方法"><a href="#el还有另外一种绑定方法" class="headerlink" title="el还有另外一种绑定方法"></a>el还有另外一种绑定方法</h3><p><img src="https://s2.loli.net/2023/03/18/w43DNLgyYnv2pAK.png" alt="image-20230104194631071.png"></p><p>data的函数式写法</p><p><img src="https://s2.loli.net/2023/03/18/u9e3cDnYFvm4Lb7.png" alt="image-20230104194906893.png"></p><h2 id="v-bind让属性变成js变量"><a href="#v-bind让属性变成js变量" class="headerlink" title="v-bind让属性变成js变量"></a>v-bind让属性变成js变量</h2><p><img src="https://s2.loli.net/2023/03/18/BLXlIFgY5hx8cbP.png" alt="image.png"></p><ul><li>可以简写为 :</li></ul><h2 id="数据绑定"><a href="#数据绑定" class="headerlink" title="数据绑定"></a>数据绑定</h2><ul><li>v-bind是单向数据绑定（data流向页面）</li><li>v-model是双项数据绑定（就是页面数据改变，data也会改变 ）</li><li>v-model只能应用在表单类元素上，就是存在value那种（简写可以省略value）</li></ul><h2 id="Object-defineProperty（）"><a href="#Object-defineProperty（）" class="headerlink" title="Object.defineProperty（）"></a>Object.defineProperty（）</h2><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><code class="hljs javascript"><span class="hljs-keyword">const</span> object1 = {};<br><br><span class="hljs-title class_">Object</span>.<span class="hljs-title function_">defineProperty</span>(object1, <span class="hljs-string">'property1'</span>, {<br> <span class="hljs-attr">value</span>: <span class="hljs-number">42</span>,<br> <span class="hljs-attr">writable</span>: <span class="hljs-literal">false</span> <span class="hljs-comment">//控制属性可以被修改 最后一个是配置项</span><br>});<br><br>object1.<span class="hljs-property">property1</span> = <span class="hljs-number">77</span>;<br><span class="hljs-comment">// Throws an error in strict mode 默认不可以被遍历 </span><br><br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(object1.<span class="hljs-property">property1</span>);<br><span class="hljs-comment">// expected output: 42</span><br><br></code></pre></td></tr></table></figure><p>关于配置项更多属性前往</p><p><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty（） - JavaScript |多核 (mozilla.org)</a></p><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><code class="hljs javascript"><span class="hljs-keyword">var</span> number=<span class="hljs-number">18</span><br><br><span class="hljs-keyword">var</span> person={<br><span class="hljs-attr">name</span>:<span class="hljs-string">"zhu"</span><br>}<br><span class="hljs-title class_">Object</span>.<span class="hljs-title function_">defineProperty</span>(person,<span class="hljs-string">'age'</span>,{<br><span class="hljs-title function_">get</span>(<span class="hljs-params"></span>){<br><span class="hljs-keyword">return</span> number <span class="hljs-comment">//每当我们读取person的时候都会返回number的实时数据 就是number改变 person里面也会改变</span><br>}<br> <span class="hljs-title function_">set</span>(<span class="hljs-params">value</span>){<br><span class="hljs-comment">//当age的值被调用的时候就会调用set 并且会返回修改值</span><br>}<br>})<br></code></pre></td></tr></table></figure><p>以上常常应用于vue的数据代理比如vue里的data里name和name的差别</p><h2 id="绑定事件"><a href="#绑定事件" class="headerlink" title="绑定事件"></a>绑定事件</h2><h3 id="v-on"><a href="#v-on" class="headerlink" title="v-on"></a>v-on</h3><p><img src="https://s2.loli.net/2023/03/18/8w6RoBg1PvhUJDV.png" alt="image-20230105121926564.png"></p><p>v-on：click也可以简写为@click</p><h4 id="点击传递数据"><a href="#点击传递数据" class="headerlink" title="点击传递数据"></a>点击传递数据</h4><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs javascript"><span class="hljs-comment">//使用vue传递数据</span><br>@click=<span class="hljs-string">"showinfo($event,66)"</span><br><span class="hljs-comment">//js</span><br><span class="hljs-title function_">showinfo</span>(<span class="hljs-params">event,num</span>){<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(num) <span class="hljs-comment">//66</span><br>}<br></code></pre></td></tr></table></figure><h3 id="事件修饰符"><a href="#事件修饰符" class="headerlink" title="事件修饰符"></a>事件修饰符</h3><p>vue给的几种修饰符</p><p><img src="https://s2.loli.net/2023/03/18/GU2NjlPvp5Lrg31.png" alt="image-20230105123255552.png"></p><p>capture是把事件触发改成捕获阶段</p><p>使用方法是</p><p><img src="https://s2.loli.net/2023/03/18/aAwxyW3TOEDrId4.png" alt="image-20230105123320767.png"></p><h3 id="键盘事件"><a href="#键盘事件" class="headerlink" title="键盘事件"></a>键盘事件</h3><ul><li>keydown按下去就触发</li><li>keyup按下去抬起来才触发</li></ul><p>vue给常用按键起的别名</p><p><img src="https://s2.loli.net/2023/03/18/25Ah8PEe6zHsKpO.png" alt="image.png"></p><p><img src="https://s2.loli.net/2023/03/18/Mcdn7rEDHhBIbwu.png" alt="image.png"></p><p>即只有按下相应按键才会触发相应方法</p><h2 id="计算属性"><a href="#计算属性" class="headerlink" title="计算属性"></a>计算属性</h2><h3 id="methods实现"><a href="#methods实现" class="headerlink" title="methods实现"></a>methods实现</h3><p>函数可以作为一个参数使用</p><p><img src="https://s2.loli.net/2023/03/18/HRQCAnEhuaO8YzL.png" alt="image.png"></p><h3 id="computed计算属性的实现"><a href="#computed计算属性的实现" class="headerlink" title="computed计算属性的实现"></a>computed计算属性的实现</h3><p>在对象中调用get函数，当第一次调用的计算属性的时候，数据会进入缓存，数据再次变化的时候get才会再次被调用</p><p><img src="https://s2.loli.net/2023/03/18/QaZlvDP98cmKjU7.png" alt="image.png"></p><h3 id="计算属性简写"><a href="#计算属性简写" class="headerlink" title="计算属性简写"></a>计算属性简写</h3><p>可以直接写成函数</p><p><img src="https://s2.loli.net/2023/03/18/LXAjShpCuHlqbKI.png" alt="image.png"></p><h3 id="监视属性"><a href="#监视属性" class="headerlink" title="监视属性"></a>监视属性</h3><p>当ishot数据发生改变时，handler函数执行并且返回原来的值和更新后的值，也是可以监视计算属性</p><p><img src="https://s2.loli.net/2023/03/18/bK24QYaZR3BDJlp.png" alt="image.png"></p><h4 id="深度监视"><a href="#深度监视" class="headerlink" title="深度监视"></a>深度监视</h4><p><img src="https://s2.loli.net/2023/03/18/1WrgtYl8pGPLhSz.png" alt="image.png"></p><p>加上deep可以监视多级结构中属性的变化</p><p><strong>输入‘number.a’可以单独监视a属性</strong></p><h2 id="绑定样式"><a href="#绑定样式" class="headerlink" title="绑定样式"></a>绑定样式</h2><h3 id="calss样式绑定"><a href="#calss样式绑定" class="headerlink" title="calss样式绑定"></a>calss样式绑定</h3><p>字符串变量绑定</p><p><img src="https://s2.loli.net/2023/03/18/fDGhbAmB7vOJLPz.png" alt="image.png"></p><p>数组绑定</p><p><img src="https://s2.loli.net/2023/03/18/sghjludV4J7ExPb.png" alt="image.png"></p><p>对象绑定</p><p><img src="https://s2.loli.net/2023/03/18/BXbLV3aEpdZ8vFt.png" alt="image.png"></p><h2 id="条件渲染"><a href="#条件渲染" class="headerlink" title="条件渲染"></a>条件渲染</h2><h3 id="v-if"><a href="#v-if" class="headerlink" title="v-if"></a>v-if</h3><p><img src="https://s2.loli.net/2023/03/18/I4AcsjUunwBNh7v.png" alt="image.png"></p><h3 id="v-show"><a href="#v-show" class="headerlink" title="v-show"></a>v-show</h3><p><img src="https://s2.loli.net/2023/03/18/7uTlasftye9nmJd.png" alt="image.png"></p><h2 id="列表渲染"><a href="#列表渲染" class="headerlink" title="列表渲染"></a>列表渲染</h2><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs javascript">v-<span class="hljs-keyword">for</span>=<span class="hljs-string">"e in arr"</span> <span class="hljs-comment">//其中e代表数组的没一项 还要记得绑定key 如:key="e.id" 也可以绑定index :key="index"</span><br><span class="hljs-comment">//可以直接{{e}}在html里使用</span><br></code></pre></td></tr></table></figure><h3 id="遍历数组"><a href="#遍历数组" class="headerlink" title="遍历数组"></a>遍历数组</h3><p><img src="https://s2.loli.net/2023/03/18/EPstu13LNeqG5wd.png" alt="image.png"></p><h3 id="遍历对象"><a href="#遍历对象" class="headerlink" title="遍历对象"></a>遍历对象</h3><p><img src="https://s2.loli.net/2023/03/18/lnVxGv7QMyrPiWE.png" alt="image.png"></p><p>对象绑定的key是对象的属性</p><p><strong>绑定index并不是好的选择</strong></p><h2 id="vue-set"><a href="#vue-set" class="headerlink" title="vue.set()"></a>vue.set()</h2><p>vue.set(target,key,val)</p><ul><li>target追加属性的对象</li><li>key追加属性的名字</li><li>val属性值</li></ul><p>如果使用该方法的是数组，那么key是元素下标</p><h2 id="vue自定义指令"><a href="#vue自定义指令" class="headerlink" title="vue自定义指令"></a>vue自定义指令</h2><p>在Vue的directives中定义指令</p><p>比如以下的v-big指令</p><p><img src="https://s2.loli.net/2023/03/18/A6lYeIiWbP8mLtO.png" alt="image.png"></p><p>在vue中</p><p><img src="https://s2.loli.net/2023/03/18/ML3YVvrwzd51BR7.png" alt="image.png"></p><p>完整的写法</p><p><img src="https://s2.loli.net/2023/03/18/Bl2giKYEhFmGHc1.png" alt="image.png"></p><h2 id="生命周期"><a href="#生命周期" class="headerlink" title="生命周期"></a>生命周期</h2><h3 id="beforeCreate"><a href="#beforeCreate" class="headerlink" title="beforeCreate"></a>beforeCreate</h3><p>函数里面不能调用data和method</p><p><img src="https://s2.loli.net/2023/03/18/c9HsnidfhrvWSuZ.png" alt="image.png"></p><h2 id="created"><a href="#created" class="headerlink" title="created"></a>created</h2><p>可以调用data和method</p><h3 id="beforeMount"><a href="#beforeMount" class="headerlink" title="beforeMount"></a>beforeMount</h3><p>虚拟dom插入页面之前，对dom的操作不奏效</p><h3 id="mounted"><a href="#mounted" class="headerlink" title="mounted"></a>mounted</h3><p>就是第一次渲染完成</p><p><img src="https://s2.loli.net/2023/03/18/ucjKxmFlz6qAX8D.png" alt="image.png">****</p><h2 id="组件"><a href="#组件" class="headerlink" title="组件"></a>组件</h2><h3 id="脚手架"><a href="#脚手架" class="headerlink" title="脚手架"></a>脚手架</h3><h4 id="在终端输入"><a href="#在终端输入" class="headerlink" title="在终端输入"></a>在终端输入</h4><figure class="highlight coffeescript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><code class="hljs coffeescript"><span class="hljs-built_in">npm</span> install -g @vue/cli<br><span class="hljs-regexp">//</span>再切换到你想要创建的目录<br>vue create 文件名<br>进入文件夹中，启动目录<br><span class="hljs-built_in">npm</span> run serve<br></code></pre></td></tr></table></figure><h3 id="创建vue文件"><a href="#创建vue文件" class="headerlink" title="创建vue文件"></a>创建vue文件</h3><p><img src="https://s2.loli.net/2023/03/18/ugMq2ep8LKnl5dm.png" alt="image.png">)</p><h4 id="man-js"><a href="#man-js" class="headerlink" title="man.js"></a>man.js</h4><p><img src="https://s2.loli.net/2023/03/18/1wYX8Wv4yksbiTl.png" alt="image.png"></p><h2 id="脚手架的个性化"><a href="#脚手架的个性化" class="headerlink" title="脚手架的个性化"></a>脚手架的个性化</h2><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs bash">//脚手架的默认配置导出js文件<br>vue inspect > output.js<br></code></pre></td></tr></table></figure><h2 id="ref属性"><a href="#ref属性" class="headerlink" title="ref属性"></a>ref属性</h2><p><img src="https://s2.loli.net/2023/03/18/NQsaPf6F1mbYkrS.png" alt="image.png"></p><h2 id="scoped样式"><a href="#scoped样式" class="headerlink" title="scoped样式"></a>scoped样式</h2><p><img src="https://s2.loli.net/2023/03/18/yolNbxnHGEaBhMK.png" alt="image.png"></p><p>这样子就不会出现样式冲突的情况</p>]]></content>
<categories>
<category>web</category>
</categories>
<tags>
<tag>vue</tag>
</tags>
</entry>
<entry>
<title>图的最小生成树Prim算法</title>
<link href="/super_zhu/2022/12/05/%E5%9B%BE%E7%9A%84%E6%9C%80%E5%B0%8F%E7%94%9F%E6%88%90%E6%A0%91Prim%E7%AE%97%E6%B3%95/"/>
<url>/super_zhu/2022/12/05/%E5%9B%BE%E7%9A%84%E6%9C%80%E5%B0%8F%E7%94%9F%E6%88%90%E6%A0%91Prim%E7%AE%97%E6%B3%95/</url>
<content type="html"><![CDATA[<h1 id="图的最小生成树Prim算法"><a href="#图的最小生成树Prim算法" class="headerlink" title="图的最小生成树Prim算法"></a>图的最小生成树Prim算法</h1><h2 id="什么是最小生成树"><a href="#什么是最小生成树" class="headerlink" title="什么是最小生成树"></a>什么是最小生成树</h2><p>最小生成树按通俗点来说就是图的一个子图，但不同的是这个图包含有<strong>原图的全部节点</strong>，但<strong>边的权值之和就尽量小</strong></p><p>如果是非带权图那么他只有生成树并没有最小生树，如图</p><p><img src="https://pic3.zhimg.com/v2-a89c87ebaf244377c48db2516df35096_r.jpg"></p><p>但最小生成树应该是这样子的</p><p><img src="https://pic1.zhimg.com/v2-b0b4cf080ce7b65c245bf5360fd576dc_r.jpg"></p><p>包含全部顶点但边的权值最小</p><p><strong>不管是生成树还是最小生成树都不允许图中有环路 ！ ！ ！</strong></p><h2 id="普里姆算法-prim算法"><a href="#普里姆算法-prim算法" class="headerlink" title="普里姆算法-prim算法"></a>普里姆算法-prim算法</h2><blockquote><p>Prim算法就是图的最小生成树算法之一，Prim 算法是一种求解加权无向连通图的 MST 问题的贪心算法。它能找出一个边的子集，使得其构成的树包含图中所有顶点，且边的权值之和最小。</p><p>Prim算法以图的顶点为基础，从首个初始顶点，寻找到达其他顶点权值最小的边，并把该顶点加入到“已到达顶点”的集合中，此时，这个集合就是这个图的最小生成树</p></blockquote><p>prim算法的使用要点：</p><ul><li>使用一个一维数组记录节点</li><li>节点上的值是是父节点的序号，而下标的值是代表这个节点的序号</li><li>第一个节点总是作为根节点（即序号为0的节点），因为没有父节点其值为-1</li></ul><p>如有下图那么一个图</p><p>首先根节点进入数组，其值为-1</p><p><img src="https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/8920d6711607407c961754d1ca3b9d97~tplv-k3u1fbpfcp-zoom-in-crop-mark:4536:0:0:0.image"></p><p>此时从根节点出发寻找权值最小的边，及其到达的节点，发现和节点2的边的权值更小，将其加入数组中,因为其父节点是根节点，所以值是根节点的下标，值为自己的序号</p><p><img src="https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/862111f392b247299909702cdeba74bd~tplv-k3u1fbpfcp-zoom-in-crop-mark:4536:0:0:0.image"></p><p>在从数组中已经加入的所有节点出发发现2和4的节点的边的权值最小</p><p><img src="https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/177ba1da1b1d430f895cc26be81b4c37~tplv-k3u1fbpfcp-zoom-in-crop-mark:4536:0:0:0.image" alt="Prim-Unit-6.png"></p><p>以此循环往复</p><p><img src="https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/55be2db34beb412a8941dac7d00b409c~tplv-k3u1fbpfcp-zoom-in-crop-mark:4536:0:0:0.image"><img src="https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/f24ce28542f541139b39a8634384d9d3~tplv-k3u1fbpfcp-zoom-in-crop-mark:4536:0:0:0.image"></p><p>此时全部顶点已经进入数组，数组就是这个图的最小生成树</p>]]></content>
<categories>
<category>算法</category>
</categories>
<tags>
<tag>数据结构</tag>
</tags>
</entry>
<entry>
<title>子网内的数据截获</title>
<link href="/super_zhu/2022/12/04/%E5%AD%90%E7%BD%91%E5%86%85%E7%9A%84%E6%95%B0%E6%8D%AE%E6%88%AA%E8%8E%B7/"/>
<url>/super_zhu/2022/12/04/%E5%AD%90%E7%BD%91%E5%86%85%E7%9A%84%E6%95%B0%E6%8D%AE%E6%88%AA%E8%8E%B7/</url>
<content type="html"><![CDATA[<h1 id="子网内的数据截获"><a href="#子网内的数据截获" class="headerlink" title="子网内的数据截获"></a>子网内的数据截获</h1><p>我们先让电脑和手机在同一子网内，即同一网段</p><p>打开wireshark，输入过滤条件ip.src==手机ip 然后发送一张图片</p><p><img src="https://s2.loli.net/2022/12/04/DjbQVcyZSX2AF17.png"></p><p>找到图片数据，然后选择追踪数据流，选择原始数据，然后保存后缀改为jpg</p><p><img src="https://s2.loli.net/2022/12/04/6rpZ5D7iRsyQGhB.png"></p><p>使用winhex打开图片</p><p><img src="https://s2.loli.net/2022/12/04/5RKYgO1iXT9Vh82.png"></p><p>jpg文件的数据头是FF D8，删除前面的数据再保存，此时就可以得到截获的图片</p><p><img src="https://s2.loli.net/2022/12/04/bnGAeYj3laUgrVc.png">****</p>]]></content>
<categories>
<category>网络渗透测试</category>
</categories>
<tags>
<tag>渗透作业</tag>
</tags>
</entry>
<entry>
<title>一个好玩的签到打印</title>
<link href="/super_zhu/2022/11/26/%E4%B8%80%E4%B8%AA%E5%A5%BD%E7%8E%A9%E7%9A%84%E7%AD%BE%E5%88%B0%E6%89%93%E5%8D%B0/"/>
<url>/super_zhu/2022/11/26/%E4%B8%80%E4%B8%AA%E5%A5%BD%E7%8E%A9%E7%9A%84%E7%AD%BE%E5%88%B0%E6%89%93%E5%8D%B0/</url>
<content type="html"><![CDATA[<h1 id="一个好玩的签到打印"><a href="#一个好玩的签到打印" class="headerlink" title="一个好玩的签到打印"></a>一个好玩的签到打印</h1><p>想要实现一个指令实现签到签退并且以一种好玩的形式打印，比如</p><p><img src="https://s2.loli.net/2022/11/26/SREd9y7WCOchK18.png" alt="image.png"></p><p>只需要以下几步：</p><ol><li>学习bash脚本语言，并且学会使用curl，cut，awk，|(管道符)的使用</li><li>配合相关软件，实现有趣的打印，这里的打印软件我使用的是cowsay和使打印渐变色的软件lolcat</li><li>设置快捷命令（按自己需求设置）</li></ol><blockquote><p>这个博客有一些好玩的打印软件的介绍<a href="https://blog.csdn.net/qq_38410494/article/details/119068145">(167条消息) 有趣的 Linux 命令行软件_zacharyzlj的博客-CSDN博客</a></p></blockquote><h2 id="开始编写"><a href="#开始编写" class="headerlink" title="开始编写"></a>开始编写</h2><p><strong>先说bash语言是什么</strong></p><p><strong>用我的话来说：bash就是一个shell程序，bash语言可以按你定好的逻辑自动对系统进行操作</strong></p><p>话不多说，直接上操作</p><p>先去测试的目录内，新建bash文件</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">touch test.sh<br></code></pre></td></tr></table></figure><p>然后再使用编辑器打开它，它的第一行一般都是</p><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs bash"><span class="hljs-meta">#!/bin/bash</span><br></code></pre></td></tr></table></figure><p>其中#！的意思是表明文件类型，/bin/bash表示bash程序，那这一行表示他是一个bash程序的文件</p><p>然后再学习相应知识，开始编写程序就好</p><p>以下是我的签退程序</p><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br></pre></td><td class="code"><pre><code class="hljs bash"><span class="hljs-meta">#!/bin/bash</span><br>msg=$(curl -s -d <span class="hljs-string">'{"userId": "2100301838"}'</span> -H <span class="hljs-string">"Content-Type:application/json"</span> https://at.kexie.space/api/user/signOut)<br><span class="hljs-comment">#使用msg接收返回的数据</span><br>results=$(<span class="hljs-built_in">echo</span> <span class="hljs-variable">$msg</span> | awk <span class="hljs-string">'BEGIN{FS="code"}END{print $2}'</span>| awk <span class="hljs-string">'BEGIN{FS=","}END{print $1}'</span>| awk <span class="hljs-string">'BEGIN{FS=":"}END{print $2}'</span>)<br><span class="hljs-comment">#对返回的code进行截取到results，以此判断是否签退成功</span><br><span class="hljs-comment">#以下是定义一个签退成功的函数out_su()</span><br><span class="hljs-function"><span class="hljs-title">out_su</span></span>(){<br><span class="hljs-comment">#截取签到总时间</span><br> totaltime=$(<span class="hljs-built_in">echo</span> <span class="hljs-variable">$msg</span> | awk <span class="hljs-string">'BEGIN{FS="totalTime"}END{print $2}'</span> | awk <span class="hljs-string">'BEGIN{FS=","}END{print $1}'</span> | awk <span class="hljs-string">'BEGIN{FS="\""}END{print $3}'</span>)<br><span class="hljs-comment">#截取本次签到时间</span><br> accumulatedTime=$(<span class="hljs-built_in">echo</span> <span class="hljs-variable">$msg</span> | awk <span class="hljs-string">'BEGIN{FS="accumulatedTime"}END{print $2}'</span> | awk <span class="hljs-string">'BEGIN{FS=","}END{print $1}'</span> | awk <span class="hljs-string">'BEGIN{FS="\""}END{print $3}'</span>)<br><span class="hljs-comment">#执行以下打印命令</span><br> cowsay -f dragon <span class="hljs-string">"芜湖 本次摸鱼<span class="hljs-variable">$accumulatedTime</span>小时 本周共<span class="hljs-variable">$totaltime</span>小时"</span> | lolcat<br>}<br><span class="hljs-comment">#签退失败函数</span><br><span class="hljs-function"><span class="hljs-title">out_err</span></span>(){<br>cowsay -f skeleton <span class="hljs-string">"你小子不会忘记签到了吧"</span> | lolcat<br>}<br><span class="hljs-comment">#根据是否成功调用不同函数</span><br><span class="hljs-keyword">if</span> [ <span class="hljs-variable">$results</span> -eq <span class="hljs-string">"0"</span> ];<br><span class="hljs-keyword">then</span><br> out_su<br><br><span class="hljs-keyword">else</span><br> out_err<br><span class="hljs-keyword">fi</span><br><br></code></pre></td></tr></table></figure><p>以下是效果</p><p><img src="https://s2.loli.net/2022/11/26/SREd9y7WCOchK18.png" alt="image.png"></p><h2 id="配合其他软件打印"><a href="#配合其他软件打印" class="headerlink" title="配合其他软件打印"></a>配合其他软件打印</h2><p>其实就用了lolcat和cowsay，这两个软件都很容易使用，可以对照上面注释使用，更详细可以浏览器搜索，没什么好说的</p><h2 id="设置快捷命令"><a href="#设置快捷命令" class="headerlink" title="设置快捷命令"></a>设置快捷命令</h2><p>因为当我们不在签到文件的目录时总是要敲长长的路径打开很不方便，所以我们可以设置快捷命令快速下班哈哈哈</p><p>其实很简单，只需要通过alias命令注册就好</p><p>比如我想进入用户Ubuntu的目录</p><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs bash"><span class="hljs-built_in">alias</span> cdu=<span class="hljs-string">'cd /home/ubuntu'</span><br></code></pre></td></tr></table></figure><p>将上述设置写到home目录下的相应用户目录的.bashrc文件中（**~/.bashrc**）的</p><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><code class="hljs bash"><span class="hljs-comment"># some more ls aliases</span><br><span class="hljs-built_in">alias</span> ll=<span class="hljs-string">'ls -alF'</span><br><span class="hljs-built_in">alias</span> la=<span class="hljs-string">'ls -A'</span><br><span class="hljs-built_in">alias</span> l=<span class="hljs-string">'ls -CF'</span><br></code></pre></td></tr></table></figure><p>跟着写上去就好</p><p>然后再运行</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">source ~/.bashrc<br></code></pre></td></tr></table></figure><p>就OK了</p>]]></content>
<categories>
<category>linux</category>
</categories>
<tags>
<tag>ubuntu</tag>
<tag>瞎搞</tag>
</tags>
</entry>
<entry>
<title>kali虚拟机与物理机的IP关系</title>
<link href="/super_zhu/2022/11/26/kali%E8%99%9A%E6%8B%9F%E6%9C%BA%E5%92%8C%E7%89%A9%E7%90%86%E6%9C%BA%E7%9A%84ip%E5%85%B3%E7%B3%BB/"/>
<url>/super_zhu/2022/11/26/kali%E8%99%9A%E6%8B%9F%E6%9C%BA%E5%92%8C%E7%89%A9%E7%90%86%E6%9C%BA%E7%9A%84ip%E5%85%B3%E7%B3%BB/</url>
<content type="html"><![CDATA[<h1 id="kali虚拟机和物理机的ip关系"><a href="#kali虚拟机和物理机的ip关系" class="headerlink" title="kali虚拟机和物理机的ip关系"></a>kali虚拟机和物理机的ip关系</h1><h2 id="nat模式下"><a href="#nat模式下" class="headerlink" title="nat模式下"></a>nat模式下</h2><p>两者的ip地址</p><p><img src="https://s2.loli.net/2022/11/26/D82F1ZKboaNf3hG.png"></p><h2 id="桥接模式下"><a href="#桥接模式下" class="headerlink" title="桥接模式下"></a>桥接模式下</h2><p><img src="https://s2.loli.net/2022/11/26/CQFGVdsHn3PoyiM.png"></p><h2 id="总结"><a href="#总结" class="headerlink" title="总结"></a>总结</h2><p>NAT模式下，物理主机与kali虚拟主机的IP并不在同一网段下；桥接模式下，物理主机与kali虚拟主机IP同属于一个网段。</p>]]></content>
<categories>
<category>网络渗透测试</category>
</categories>
<tags>
<tag>渗透作业</tag>
</tags>
</entry>
<entry>
<title>ubuntu部署-使用docker配置mysql</title>
<link href="/super_zhu/2022/11/22/ubuntu%E9%83%A8%E7%BD%B2-docker-%E9%85%8D%E7%BD%AEmysql/"/>
<url>/super_zhu/2022/11/22/ubuntu%E9%83%A8%E7%BD%B2-docker-%E9%85%8D%E7%BD%AEmysql/</url>
<content type="html"><![CDATA[<h1 id="使用docker配置mysql"><a href="#使用docker配置mysql" class="headerlink" title="使用docker配置mysql"></a>使用docker配置mysql</h1><h2 id="安装mysql"><a href="#安装mysql" class="headerlink" title="安装mysql"></a>安装mysql</h2><p>如果本机本身就运行有mysql，请运行以下命令关闭服务、</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo service mysql stop<br></code></pre></td></tr></table></figure><p>不然可能会有端口映射失败的问题</p><figure class="highlight routeros"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs routeros">sudo docker <span class="hljs-built_in">run</span> -itd --name mysqldb -p 3306:3306 -e <span class="hljs-attribute">MYSQL_ROOT_PASSWORD</span>=<span class="hljs-string">"your password"</span> mysql:latest<br></code></pre></td></tr></table></figure><ul><li>运行时得带上标签:latest不然会报错，具体是什么原因我也不清楚</li><li>-e表示设置环境变量得意思，MYSQL_ROOT_PASSWORD 在这里是为root用户设置密码</li><li>-p表示将容器端口映射到主机端口</li></ul><blockquote><p>想要了解docker run 命令更多可选项可来<a href="https://docs.docker.com/engine/reference/commandline/run/">码头工人运行|码头工人文档 (docker.com)</a></p></blockquote><h2 id="配置远程连接"><a href="#配置远程连接" class="headerlink" title="配置远程连接"></a>配置远程连接</h2><p>进入容器后，登录</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">mysql -u root -p<br></code></pre></td></tr></table></figure><p>再输入密码</p><p>再给远程主机配置一个账户用于连接</p><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs mysql">CREATE USER '用户名'@'IP地址或者域名' IDENTIFIED BY '*password*';---创建用户<br>GRANT ALL ON *.* TO '用户名'@'主机IP地址' WITH GRANT OPTION;---赋予权限<br></code></pre></td></tr></table></figure><p>然后再进行相应连接即可</p>]]></content>
<categories>
<category>服务器部署</category>
</categories>
<tags>
<tag>ubuntu</tag>
<tag>docker</tag>
</tags>
</entry>
<entry>
<title>ubuntu部署-docker的简单使用</title>
<link href="/super_zhu/2022/11/20/ubuntu%E9%83%A8%E7%BD%B2-docker/"/>
<url>/super_zhu/2022/11/20/ubuntu%E9%83%A8%E7%BD%B2-docker/</url>
<content type="html"><![CDATA[<h1 id="ubuntu部署-docker的简单使用"><a href="#ubuntu部署-docker的简单使用" class="headerlink" title="ubuntu部署-docker的简单使用"></a>ubuntu部署-docker的简单使用</h1><h2 id="下载与安装"><a href="#下载与安装" class="headerlink" title="下载与安装"></a>下载与安装</h2><p><strong>我这里使用的是手动安装</strong></p><h3 id="先卸载旧版本的dockers"><a href="#先卸载旧版本的dockers" class="headerlink" title="先卸载旧版本的dockers"></a>先卸载旧版本的dockers</h3><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo apt-get remove docker docker-engine docker.io containerd runc<br></code></pre></td></tr></table></figure><h3 id="使用dockers仓库安装"><a href="#使用dockers仓库安装" class="headerlink" title="使用dockers仓库安装"></a>使用dockers仓库安装</h3><p>首次安装需要先在Ubuntu的源上添加dockers官方的源</p><h4 id="设置仓库（dockers源）"><a href="#设置仓库（dockers源）" class="headerlink" title="设置仓库（dockers源）"></a>设置仓库（dockers源）</h4><p>更新一下Ubuntu的apt的软件包索引</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo apt-get update<br></code></pre></td></tr></table></figure><p>安装apt依赖包，用于HTTPS获取仓库</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo apt-get install \<br> apt-transport-https \<br> ca-certificates \<br> curl \<br> gnupg-agent \<br> software-properties-common<br></code></pre></td></tr></table></figure><p>添加 Docker 的官方 GPG 密钥：</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo curl -fsSL https://mirrors.ustc.edu.cn/docker-ce/linux/ubuntu/gpg | sudo apt-key add -<br></code></pre></td></tr></table></figure><p>验证你是否拥有带有指纹的密钥</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs shell"> sudo apt-key fingerprint 0EBFCD88<br> <br>pub rsa4096 2017-02-22 [SCEA]<br> 9DC8 5822 9FC7 DD38 854A E2D8 8D81 803C 0EBF CD88<br>uid [ unknown] Docker Release (CE deb) <[email protected]><br>sub rsa4096 2017-02-22 [S]<br></code></pre></td></tr></table></figure><p>使用以下指令在源那里加上仓库</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo add-apt-repository \<br> "deb [arch=amd64] https://mirrors.ustc.edu.cn/docker-ce/linux/ubuntu/ \<br><span class="hljs-meta prompt_"> $</span><span class="language-bash">(lsb_release -cs) \</span><br><span class="language-bash"> stable<span class="hljs-string">"</span></span><br></code></pre></td></tr></table></figure><p>再更新apt索引</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo apt-get update<br></code></pre></td></tr></table></figure><p>直接安装最新版dockers</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo apt-get install docker-ce docker-ce-cli containerd.io<br></code></pre></td></tr></table></figure><h4 id="测试是否安装成功"><a href="#测试是否安装成功" class="headerlink" title="测试是否安装成功"></a>测试是否安装成功</h4><p>执行以下命令，打印以下信息则是成功</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker run hello-world<br><br>Unable to find image 'hello-world:latest' locally<br>latest: Pulling from library/hello-world<br>1b930d010525: Pull complete Digest: sha256:c3b4ada4687bbaa170745b3e4dd8ac3f194ca95b2d0518b417fb47e5879d9b5f<br>Status: Downloaded newer image for hello-world:latest<br><br><br>Hello from Docker!<br>This message shows that your installation appears to be working correctly.<br><br><br>To generate this message, Docker took the following steps:<br> 1. The Docker client contacted the Docker daemon.<br> 2. The Docker daemon pulled the "hello-world" image from the Docker Hub.<br> (amd64)<br> 3. The Docker daemon created a new container from that image which runs the<br> executable that produces the output you are currently reading.<br> 4. The Docker daemon streamed that output to the Docker client, which sent it<br> to your terminal.<br><br><br>To try something more ambitious, you can run an Ubuntu container with:<br><span class="hljs-meta prompt_"> $ </span><span class="language-bash">docker run -it ubuntu bash</span><br><br><br>Share images, automate workflows, and more with a free Docker ID:<br> https://hub.docker.com/<br><br><br>For more examples and ideas, visit:<br> https://docs.docker.com/get-started/<br></code></pre></td></tr></table></figure><h3 id="其他安装方式"><a href="#其他安装方式" class="headerlink" title="其他安装方式"></a>其他安装方式</h3><p>需要其他安装方式则可前往<a href="https://www.runoob.com/docker/ubuntu-docker-install.html">Ubuntu Docker 安装 | 菜鸟教程 (runoob.com)</a></p><p>或者是自行查找</p><h2 id="对于docker的使用"><a href="#对于docker的使用" class="headerlink" title="对于docker的使用"></a>对于docker的使用</h2><p><strong>本文只做docker的基础操作介绍</strong></p><h3 id="镜像操作"><a href="#镜像操作" class="headerlink" title="镜像操作"></a>镜像操作</h3><p>我们都知道镜像是用来创建容器的那我们怎么样获取镜像和用镜像来生成容器和一些操作的那么接下来就是介绍一些关于镜像的一些操作</p><h4 id="获取镜像"><a href="#获取镜像" class="headerlink" title="获取镜像"></a>获取镜像</h4><p><strong>建议使用<code>docker pull</code></strong> <strong>的方式获取</strong></p><p>其命令格式</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker pull [OPTIONS] NAME[:TAG|@DIGEST]<br></code></pre></td></tr></table></figure><p>意思就是在docker源那里拉取相应的镜像</p><ul><li><p>name：就是要安装的镜像名字，若如果没有以下两个标签则是以<code>:latest</code>如<code>docker pull ubuntu</code>默认为<code>docker pull ubuntu:latest</code></p></li><li><p>tag：就是获取这个镜像相应版本的最新版，比如<code>sudo docker pull ubuntu:18.04</code>就是拉取系统版本为18.04的ubuntu镜像最新版</p></li><li><p>digest：表示是拉取指定版本的镜像系统，如 <code>sudo docker pull ubuntu@sha256:45b23dee08af5e43a7fea6c4cf9c25ccf269ee113168c19722f87876677c5cb2</code></p></li></ul><h4 id="docker-run"><a href="#docker-run" class="headerlink" title="docker run"></a>docker run</h4><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker run [OPTIONS] IMAGE [COMMAND] [ARG...]<br></code></pre></td></tr></table></figure><p>其实docker run 命令就是下载一个本地没有的镜像，并且创建一个容器</p><p>例如</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker run --rm -it -d --gpus all --name test ubuntu /bin/bash <br></code></pre></td></tr></table></figure><ul><li>以Ubuntu镜像创建一个名为test的容器</li><li>–rm 表示退出这个容器后自动移除这个容器</li><li>-d是指容器启动后以后台分离模式运行，默认会在前台模式运行，</li><li>-t和-i和/bin/bash,加起来表示使用bash创建一个伪终端，进入容器交互模式</li><li>gpus all 表示对于该容器，开启gpu支持，并且所有GPU都可用</li></ul><blockquote><p><a href="https://so.csdn.net/so/search?q=Docker&spm=1001.2101.3001.7020">Docker</a>容器后台运行,就必须有一个前台进程！</p><p>你如果执行sudo docker run -d –name test ubuntu ，虽然-d表示容器在后台挂起但事实上你会发现并不会在后台挂起，因为主线程任务已经执行完，而容器也自动关闭了</p><p>所以，sudo docker -itd –name test ubuntu 可以解决这个问题</p></blockquote><h4 id="查看镜像和容器"><a href="#查看镜像和容器" class="headerlink" title="查看镜像和容器"></a>查看镜像和容器</h4><p>查看镜像</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker images<br><span class="hljs-meta prompt_">#</span><span class="language-bash">查看本机已有的镜像</span><br></code></pre></td></tr></table></figure><p>查看容器</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker ps <br><span class="hljs-meta prompt_">#</span><span class="language-bash">查看正在运行的容器信息</span><br>sudo docker ps -a<br><span class="hljs-meta prompt_">#</span><span class="language-bash">查看全部容器信息</span><br></code></pre></td></tr></table></figure><h4 id="删除镜像"><a href="#删除镜像" class="headerlink" title="删除镜像"></a>删除镜像</h4><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker rmi [OPTIONS] IMAGE [IMAGE...]<br></code></pre></td></tr></table></figure><p>支持删除多种镜像</p><ul><li>使用image id ：<code>sudo docker rmi fd484f19954f</code> –这个image id可以直接<code>sudo docker images</code>查看镜像id</li><li>使用tag：<code>docker rmi test:latest</code></li><li>使用DIGEST： <code>docker rmi localhost:5000/test/busybox@sha256:cbbf2f9a99b47fc460d422812b6a5adff7dfee951d8fa2e4a98caa0382cfbdbf</code></li></ul><h3 id="容器操作"><a href="#容器操作" class="headerlink" title="容器操作"></a>容器操作</h3><p>容器就是以镜像为只读模板创建的</p><h4 id="创建容器"><a href="#创建容器" class="headerlink" title="创建容器"></a>创建容器</h4><p>前面已经说了可以以<code>docker run</code>来创建容器这里就不多说了</p><h4 id="进入容器交互"><a href="#进入容器交互" class="headerlink" title="进入容器交互"></a>进入容器交互</h4><p>要进入容器分两种情况</p><ul><li>进入已经后台分离模式下运行的容器内</li><li>已经关闭的容器内</li></ul><h5 id="后台分离模式下运行的容器"><a href="#后台分离模式下运行的容器" class="headerlink" title="后台分离模式下运行的容器"></a>后台分离模式下运行的容器</h5><p>对于已经启动的容器有两个命令进入 <code>attach</code> 和 <code>exec</code></p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker exec -it test bash<br><span class="hljs-meta prompt_">#</span><span class="language-bash">进入一个名为<span class="hljs-built_in">test</span>的容器并打开伪终端</span><br>sudo docker attach <br><span class="hljs-meta prompt_">#</span><span class="language-bash">attach不能使用-it bash</span><br><span class="hljs-meta prompt_">#</span><span class="language-bash">进入一个名为<span class="hljs-built_in">test</span>的容器并打开伪终端</span><br></code></pre></td></tr></table></figure><p>然后你在退出容器</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">exit<br></code></pre></td></tr></table></figure><p>这个时候你会发现，当你以exec进入容器后退出容器并不会关闭而attach则相反</p><h5 id="关闭的容器"><a href="#关闭的容器" class="headerlink" title="关闭的容器"></a>关闭的容器</h5><p>关闭的容器当然是先启动再进入咯</p><p>重启容器的方式</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker restart 容器名或者容器id<br></code></pre></td></tr></table></figure><p>启动容器的方式</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker start 容器名或者容器id<br></code></pre></td></tr></table></figure><p><strong>不管是重启还是启动，容器都是以后台分离的模式运行</strong></p><p>然后再进入容器内即可</p><h4 id="删除容器"><a href="#删除容器" class="headerlink" title="删除容器"></a>删除容器</h4><p>都是基于<code>docker rm</code>来进行</p><figure class="highlight inform7"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs inform7">docker rm <span class="hljs-comment">[OPTIONS]</span> <span class="hljs-keyword">CONTAINER</span> <span class="hljs-comment">[CONTAINER...]</span><br></code></pre></td></tr></table></figure><p>例如删除ubuntu-test2这个容器</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker rm ubuntu-test2<br></code></pre></td></tr></table></figure><h4 id="容器的停止和关闭和暂停"><a href="#容器的停止和关闭和暂停" class="headerlink" title="容器的停止和关闭和暂停"></a>容器的停止和关闭和暂停</h4><p>停止</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker stop test<br><span class="hljs-meta prompt_">#</span><span class="language-bash">也可以加入参数-t，表示在一定时间内无法关闭则强制关闭，默认时间为10s</span><br><span class="hljs-meta prompt_">#</span><span class="language-bash">比如sudo docker stop -t=20 <span class="hljs-built_in">test</span></span><br></code></pre></td></tr></table></figure><p>关闭</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker kill test<br><span class="hljs-meta prompt_">#</span><span class="language-bash">直接关闭容器</span><br></code></pre></td></tr></table></figure><p>暂停</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo docker pause test<br><span class="hljs-meta prompt_">#</span><span class="language-bash">暂停运行</span><br>sudo docker unpause test<br><span class="hljs-meta prompt_">#</span><span class="language-bash">恢复运行</span><br></code></pre></td></tr></table></figure><ul><li>stop，kill和pause的差别是，stop，kill让容器停止而pause则是让容器挂起</li></ul>]]></content>
<categories>
<category>服务器部署</category>
</categories>
<tags>
<tag>ubuntu</tag>
<tag>docker</tag>
</tags>
</entry>
<entry>
<title>拓扑排序的简单介绍</title>
<link href="/super_zhu/2022/11/08/%E6%8B%93%E6%89%91%E6%8E%92%E5%BA%8F/"/>
<url>/super_zhu/2022/11/08/%E6%8B%93%E6%89%91%E6%8E%92%E5%BA%8F/</url>
<content type="html"><![CDATA[<h1 id="拓扑排序"><a href="#拓扑排序" class="headerlink" title="拓扑排序"></a>拓扑排序</h1><h2 id="关于拓扑排序"><a href="#关于拓扑排序" class="headerlink" title="关于拓扑排序"></a>关于拓扑排序</h2><p>拓扑排序通俗点来说就是对于一个有向无环图(DAG)来说，不断输出其入度为0的节点直到不存在，每个节点输出一次且仅有一次</p><blockquote><p><strong>拓扑排序用官方的话来说就是</strong>：对一个有向无环图(DAG)G进行拓扑排序，是将G中所有顶点排成一个线性序列，使得图中任意一对顶点u和v，若边<u,v>∈E(G)，则u在线性序列中出现在v之前。通常，这样的线性序列称为满足拓扑次序(Topological Order)的序列，简称拓扑序列。简单的说，由某个集合上的一个偏序得到该集合上的一个全序，这个操作称之为拓扑排序。</p></blockquote><h2 id="执行步骤"><a href="#执行步骤" class="headerlink" title="执行步骤"></a>执行步骤</h2><p>拓扑排序主要步骤，也就主要循环两部分到不存在入度为零的顶点为止</p><ul><li>选择一个入度为零的顶点输出</li><li>在<code>AOV</code>网中删除这个顶点及其出边</li></ul><p>输出结束后，除非还有回路，否则其输出的顶点序列就是拓扑排序</p><blockquote><p>AOV网其实就是有向无回路图，就是DAG</p></blockquote><h3 id="图解"><a href="#图解" class="headerlink" title="图解"></a>图解</h3><p>对于以下图来说</p><p><img src="https://img-blog.csdnimg.cn/20210428200929462.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzUyMjkwNDM2,size_16,color_FFFFFF,t_70"></p><p>删除1和2顶点和其对于边后并且输出，并且以此类推</p><p><img src="https://img-blog.csdnimg.cn/20210428201000907.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzUyMjkwNDM2,size_16,color_FFFFFF,t_70"></p><p><img src="https://img-blog.csdnimg.cn/2021042820100737.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzUyMjkwNDM2,size_16,color_FFFFFF,t_70"></p><p><img src="https://img-blog.csdnimg.cn/20210428201017719.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzUyMjkwNDM2,size_16,color_FFFFFF,t_70"></p><p><img src="https://img-blog.csdnimg.cn/202104282010288.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzUyMjkwNDM2,size_16,color_FFFFFF,t_70" alt="·"></p><p>其实对于输出的序列不唯一就看你自己怎么样设计栈的结构</p><h3 id="代码实现"><a href="#代码实现" class="headerlink" title="代码实现"></a>代码实现</h3><p>这里使用邻接表实现，再利用栈实现入度为零的输出</p><p>使用作业的题目，<code>ABCDEF</code>对应下标从0开始慢慢增大</p><p><img src="https://s2.loli.net/2022/11/08/zgsZPYbNG32c86F.jpg"></p><figure class="highlight c"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br><span class="line">75</span><br><span class="line">76</span><br><span class="line">77</span><br><span class="line">78</span><br><span class="line">79</span><br><span class="line">80</span><br><span class="line">81</span><br><span class="line">82</span><br><span class="line">83</span><br><span class="line">84</span><br><span class="line">85</span><br><span class="line">86</span><br><span class="line">87</span><br><span class="line">88</span><br><span class="line">89</span><br><span class="line">90</span><br><span class="line">91</span><br><span class="line">92</span><br><span class="line">93</span><br><span class="line">94</span><br><span class="line">95</span><br></pre></td><td class="code"><pre><code class="hljs c"><span class="hljs-meta">#<span class="hljs-keyword">include</span> <span class="hljs-string"><stdio.h></span></span><br><span class="hljs-meta">#<span class="hljs-keyword">include</span> <span class="hljs-string"><stdlib.h></span></span><br><span class="hljs-meta">#<span class="hljs-keyword">include</span> <span class="hljs-string"><stdbool.h></span></span><br><span class="hljs-meta">#<span class="hljs-keyword">define</span> MAXVEX 10</span><br><span class="hljs-keyword">typedef</span> <span class="hljs-type">char</span> VerType;<span class="hljs-comment">//顶点值类型</span><br><br><span class="hljs-class"><span class="hljs-keyword">struct</span> <span class="hljs-title">EdgeNode</span>{</span><br><span class="hljs-type">int</span> adjvex;<span class="hljs-comment">//邻接点域，存储该顶点对应的下标</span><br><span class="hljs-type">int</span> weight;<span class="hljs-comment">//用于存储权值，对于非网图可以不需要</span><br><span class="hljs-class"><span class="hljs-keyword">struct</span> <span class="hljs-title">EdgeNode</span>* <span class="hljs-title">next</span>;</span><span class="hljs-comment">//下一个结点</span><br>};<br><br><span class="hljs-class"><span class="hljs-keyword">struct</span> <span class="hljs-title">VertexNode</span>{</span><br><span class="hljs-type">int</span> in;<span class="hljs-comment">//入度</span><br>VerType data;<span class="hljs-comment">//值</span><br><span class="hljs-class"><span class="hljs-keyword">struct</span> <span class="hljs-title">EdgeNode</span>* <span class="hljs-title">firstedge</span>;</span><span class="hljs-comment">//邻接表头指针</span><br>};<br><br><span class="hljs-class"><span class="hljs-keyword">struct</span> <span class="hljs-title">Graph</span>{</span><br><span class="hljs-class"><span class="hljs-keyword">struct</span> <span class="hljs-title">VertexNode</span> <span class="hljs-title">vers</span>[<span class="hljs-title">MAXVEX</span>];</span><br><span class="hljs-type">int</span> numVertexes, numEdges;<span class="hljs-comment">//顶点数和边数</span><br>};<br><br><span class="hljs-comment">/* 拓扑排序，若G没有回路，则输出拓扑排序序列并返回OK，若有回路返回ERROR */</span><br><span class="hljs-type">int</span> <span class="hljs-title function_">TopologicalSort</span><span class="hljs-params">(<span class="hljs-keyword">struct</span> Graph* G)</span>{<br><span class="hljs-class"><span class="hljs-keyword">struct</span> <span class="hljs-title">EdgeNode</span>* <span class="hljs-title">e</span>;</span><br><span class="hljs-type">int</span> i, k, gettop;<br><span class="hljs-type">int</span> top = <span class="hljs-number">0</span>;<span class="hljs-comment">//栈指针下标</span><br><span class="hljs-type">int</span> count = <span class="hljs-number">0</span>;<span class="hljs-comment">//统计输出顶点个数</span><br><span class="hljs-type">int</span>* <span class="hljs-built_in">stack</span>;<span class="hljs-comment">//存储入度为0的顶点</span><br><span class="hljs-built_in">stack</span> = (<span class="hljs-type">int</span>*)<span class="hljs-built_in">malloc</span>(G->numVertexes * <span class="hljs-keyword">sizeof</span>(<span class="hljs-type">int</span>));<br><br><span class="hljs-keyword">for</span>(i = <span class="hljs-number">0</span>;i<G->numVertexes;i++)<span class="hljs-comment">//遍历所有结点</span><br><span class="hljs-keyword">if</span>(G->vers[i].in == <span class="hljs-number">0</span>)<br><span class="hljs-built_in">stack</span>[++top] = i;<span class="hljs-comment">//将入度为0的顶点入栈</span><br><br><span class="hljs-keyword">while</span>(top != <span class="hljs-number">0</span>){<br>gettop = <span class="hljs-built_in">stack</span>[top--];<span class="hljs-comment">//出栈</span><br><span class="hljs-built_in">printf</span>(<span class="hljs-string">"%c "</span>,G->vers[gettop].data);<br>count++;<span class="hljs-comment">//统计输出顶点数</span><br><span class="hljs-keyword">for</span>(e=G->vers[gettop].firstedge; e; e = e->next){<br><span class="hljs-comment">//弧表遍历</span><br>k = e->adjvex;<br><span class="hljs-keyword">if</span>(!(--G->vers[k].in))<span class="hljs-comment">//将k号顶点邻接点的入度减1</span><br><span class="hljs-built_in">stack</span>[++top] = k;<span class="hljs-comment">//若为0则入栈，以便下次循环输出</span><br>}<br>}<br><span class="hljs-keyword">if</span>(count < G->numVertexes)<span class="hljs-comment">//如果count小于顶点数，说明存在环</span><br><span class="hljs-keyword">return</span> <span class="hljs-number">0</span>;<br><span class="hljs-keyword">else</span><br><span class="hljs-keyword">return</span> <span class="hljs-number">1</span>;<br>}<br><br><span class="hljs-comment">/* 图初始化 */</span><br><span class="hljs-type">void</span> <span class="hljs-title function_">CreateGraph</span><span class="hljs-params">(<span class="hljs-keyword">struct</span> Graph* G)</span>{<br><span class="hljs-type">int</span> i, m, n;<br><br><span class="hljs-built_in">printf</span>(<span class="hljs-string">"输入顶点数和边数：\n"</span>);<br><span class="hljs-built_in">scanf</span>(<span class="hljs-string">"%d %d"</span>,&G->numVertexes, &G->numEdges);<br><span class="hljs-built_in">printf</span>(<span class="hljs-string">"输入顶点值：\n"</span>);<br> getchar();<span class="hljs-comment">//吃掉回车</span><br><span class="hljs-keyword">for</span>(i=<span class="hljs-number">0</span>;i<G->numVertexes;i++){<br><span class="hljs-comment">//getchar();//吃掉回车</span><br>G->vers[i].data=getchar();<br>getchar();<br><span class="hljs-comment">//scanf("%c",&G->vers[i].data);</span><br>}<br><span class="hljs-comment">//初始化图头结点指针和入度值</span><br><span class="hljs-keyword">for</span>(i=<span class="hljs-number">0</span>;i<G->numVertexes;i++){<br>G->vers[i].firstedge = <span class="hljs-literal">NULL</span>;<br>G->vers[i].in = <span class="hljs-number">0</span>;<span class="hljs-comment">//入度为0</span><br>}<br><span class="hljs-built_in">printf</span>(<span class="hljs-string">"输入边：\n"</span>);<br><span class="hljs-keyword">for</span>(i=<span class="hljs-number">0</span>;i<G->numEdges;i++){<br><span class="hljs-built_in">scanf</span>(<span class="hljs-string">"%d %d"</span>,&m, &n);<br><span class="hljs-class"><span class="hljs-keyword">struct</span> <span class="hljs-title">EdgeNode</span> *<span class="hljs-title">newNode</span> =</span> (<span class="hljs-keyword">struct</span> EdgeNode*)<span class="hljs-built_in">malloc</span>(<span class="hljs-keyword">sizeof</span>(<span class="hljs-keyword">struct</span> EdgeNode));<br>newNode->next = G->vers[m].firstedge == <span class="hljs-literal">NULL</span> ? <span class="hljs-literal">NULL</span> : G->vers[m].firstedge;<br>newNode->adjvex = n;<br>G->vers[m].firstedge = newNode;<br>G->vers[n].in++;<span class="hljs-comment">//入度+1</span><br>}<br>}<br><br><span class="hljs-type">int</span> <span class="hljs-title function_">main</span><span class="hljs-params">()</span>{<br><br><span class="hljs-class"><span class="hljs-keyword">struct</span> <span class="hljs-title">Graph</span> *<span class="hljs-title">G</span>=</span>(<span class="hljs-keyword">struct</span> Graph*)<span class="hljs-built_in">malloc</span>(<span class="hljs-keyword">sizeof</span>(<span class="hljs-keyword">struct</span> Graph)) ;<br>CreateGraph(G);<br><span class="hljs-keyword">if</span>(TopologicalSort(G)){<br><span class="hljs-built_in">printf</span>(<span class="hljs-string">"拓扑排序完成！\n"</span>);<br>}<span class="hljs-keyword">else</span>{<br><span class="hljs-built_in">printf</span>(<span class="hljs-string">"图存在环"</span>);<br>}<br><span class="hljs-keyword">return</span> <span class="hljs-number">0</span>;<br>}<br><br></code></pre></td></tr></table></figure>]]></content>
<categories>
<category>算法</category>
</categories>
<tags>
<tag>数据结构</tag>
</tags>
</entry>
<entry>
<title>图的两种存储结构</title>
<link href="/super_zhu/2022/11/07/%E5%9B%BE%E7%9A%84%E4%B8%A4%E7%A7%8D%E5%AD%98%E5%82%A8%E7%BB%93%E6%9E%84/"/>
<url>/super_zhu/2022/11/07/%E5%9B%BE%E7%9A%84%E4%B8%A4%E7%A7%8D%E5%AD%98%E5%82%A8%E7%BB%93%E6%9E%84/</url>
<content type="html"><![CDATA[<h1 id="图的两种存储结构"><a href="#图的两种存储结构" class="headerlink" title="图的两种存储结构"></a>图的两种存储结构</h1><h2 id="邻接矩阵"><a href="#邻接矩阵" class="headerlink" title="邻接矩阵"></a>邻接矩阵</h2><p><strong>图的邻接矩阵(Adjacency Matrix) 存储方式是用两个数组来表示图。一个一维数组存储图中顶点信息，一个二维数组(称为邻接矩阵)存储图中的边或弧的信息。</strong></p><ul><li><p>即有一个数组存储顶点</p></li><li><p>一个维数组存储各个顶点之间的关系，即是存储边的信息，比如权值</p></li><li><p>有向图和无向图的的矩阵存储不一样</p></li></ul><p>比如下图，假如有一个是有n个顶点的图，则邻接矩阵是一个n*n的方阵，以下定义</p><p><img src="https://s2.loli.net/2022/11/08/v89P2IeYEnOmZpr.png">)</p><h3 id="无向图和他的邻接矩阵"><a href="#无向图和他的邻接矩阵" class="headerlink" title="无向图和他的邻接矩阵"></a>无向图和他的邻接矩阵</h3><p><img src="https://s2.loli.net/2022/11/08/PnXkO6RavKJCDIT.png"></p><ul><li>比如v1的顶点入度为1+1=2</li><li>求顶点v i 的所有邻接点就是将矩阵中第i行元素扫描一遍， A [ i ] [ j ] = 1就是邻接点</li><li>看vi是否和vj相连接，直接看是否A[i] [j]=1或者A[j] [i]=1都可以</li></ul><h3 id="有向图和它的邻接矩阵"><a href="#有向图和它的邻接矩阵" class="headerlink" title="有向图和它的邻接矩阵"></a>有向图和它的邻接矩阵</h3><p>有向图的矩阵并不是对称矩阵，看下图</p><p><img src="https://s2.loli.net/2022/11/08/yiD76uFmIAQkpeb.png"></p><ul><li>因为是有向图，所以入度和出度并不相同，比如v1的出度看数组的第一行不为一的数目，而入度则是看第一列不为一的数目，所以入度为1而出度为2</li><li>判断顶点v i到v j 是否存在弧，只需要查找矩阵中A [ i ] [ j ]是否为1即可</li></ul><h3 id="对于带权值的有向图"><a href="#对于带权值的有向图" class="headerlink" title="对于带权值的有向图"></a>对于带权值的有向图</h3><p>vi和vj之间有链接的话，则相应的A[i] [j]=权值，即看下图</p><p><img src="https://s2.loli.net/2022/11/08/c7Pf5DkXNQyIR13.png"></p><ul><li><p>相连的话，相对应的A[i] [j]则用权值表示</p></li><li><p>如果不相连则用<br>$$<br>\infty<br>$$</p></li></ul><p>表示以下是一个图的简单定义</p><figure class="highlight c"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><code class="hljs c"><span class="hljs-meta">#<span class="hljs-keyword">define</span> MaxVertexNum 100<span class="hljs-comment">//顶点数目的最大值</span></span><br><span class="hljs-keyword">typedef</span> <span class="hljs-type">char</span> VertexType;<span class="hljs-comment">//顶点的数据类型</span><br><span class="hljs-keyword">typedef</span> <span class="hljs-type">int</span> EdgeType;<span class="hljs-comment">//带权图中边上权值的数据类型</span><br><span class="hljs-keyword">typedef</span> <span class="hljs-class"><span class="hljs-keyword">struct</span>{</span><br>VertexType Vex[MaxVertexNum];<span class="hljs-comment">//顶点表</span><br>EdgeType Edge[MaxVertexNum][MaxVertexNum];<span class="hljs-comment">//邻接矩阵，边表</span><br><span class="hljs-type">int</span> vexnum, arcnum;<span class="hljs-comment">//图的当前顶点数和边数</span><br>}MGraph;<br><br></code></pre></td></tr></table></figure><h2 id="邻接表"><a href="#邻接表" class="headerlink" title="邻接表"></a>邻接表</h2><p>当一个图的边数太少用邻接矩阵的方式存储，太浪费空间，如下</p><p><img src="https://s2.loli.net/2022/11/08/kpWIRwFxfZGVOsq.png"></p><ul><li><p>邻接表对于每一个顶点vi都建立了一个单链表，链表每个节点都存储着与vi相连的顶点信息，比如v1的单链表中有一个节点存储着v2的信息，则代表v1—–>v2(当为无向图时表示v1————v2)</p></li><li><p>所以邻接表共有两种表结构 </p><ol><li>一个是顶点表存储顶点信息，同时存储着指向相应链表的指针，</li><li>一个是边表存储边的信息，存储被指向的节点和权值</li></ol></li></ul><p>如下图</p><p><img src="https://s2.loli.net/2022/11/08/BAS98Xcmj6E1NUk.png"></p><p>对于无向图的实例如下</p><p><img src="https://s2.loli.net/2022/11/08/zCBDghNbaWlo6jG.png"></p><p>对于有向图的实例如下</p><p><img src="https://s2.loli.net/2022/11/08/5FZKvoYk7TngyI4.png"></p><p>而代码实例如下</p><figure class="highlight c"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br></pre></td><td class="code"><pre><code class="hljs c"><span class="hljs-meta">#<span class="hljs-keyword">define</span> MAXVEX 100<span class="hljs-comment">//图中顶点数目的最大值</span></span><br>type <span class="hljs-type">char</span> VertexType;<span class="hljs-comment">//顶点类型应由用户定义</span><br><span class="hljs-keyword">typedef</span> <span class="hljs-type">int</span> EdgeType;<span class="hljs-comment">//边上的权值类型应由用户定义</span><br><span class="hljs-comment">/*边表结点*/</span><br><span class="hljs-keyword">typedef</span> <span class="hljs-class"><span class="hljs-keyword">struct</span> <span class="hljs-title">EdgeNode</span>{</span><br><span class="hljs-type">int</span> adjvex;<span class="hljs-comment">//该弧所指向的顶点的下标或者位置</span><br>EdgeType weight;<span class="hljs-comment">//权值，对于非网图可以不需要</span><br><span class="hljs-class"><span class="hljs-keyword">struct</span> <span class="hljs-title">EdgeNode</span> *<span class="hljs-title">next</span>;</span><span class="hljs-comment">//指向下一个邻接点</span><br>}EdgeNode;<br><br><span class="hljs-comment">/*顶点表结点*/</span><br><span class="hljs-keyword">typedef</span> <span class="hljs-class"><span class="hljs-keyword">struct</span> <span class="hljs-title">VertexNode</span>{</span><br>Vertex data;<span class="hljs-comment">//顶点域，存储顶点信息</span><br>EdgeNode *firstedge<span class="hljs-comment">//边表头指针</span><br>}VertexNode, AdjList[MAXVEX];<br><br><span class="hljs-comment">/*邻接表*/</span><br><span class="hljs-keyword">typedef</span> <span class="hljs-class"><span class="hljs-keyword">struct</span>{</span><br>AdjList adjList;<br><span class="hljs-type">int</span> numVertexes, numEdges;<span class="hljs-comment">//图中当前顶点数和边数</span><br>}<br><br></code></pre></td></tr></table></figure><p><strong>这里对于图的存储结构只做简单的介绍</strong>，<strong>如果要了解更多性质自行查找</strong></p>]]></content>
<categories>
<category>算法</category>
</categories>
<tags>
<tag>数据结构</tag>
</tags>
</entry>
<entry>
<title>ubuntu部署-换源</title>
<link href="/super_zhu/2022/11/02/ubantu%E9%83%A8%E7%BD%B2-%E6%8D%A2%E6%BA%90/"/>
<url>/super_zhu/2022/11/02/ubantu%E9%83%A8%E7%BD%B2-%E6%8D%A2%E6%BA%90/</url>
<content type="html"><![CDATA[<h1 id="源是什么"><a href="#源是什么" class="headerlink" title="源是什么"></a>源是什么</h1><p>源对于<code>ubuntu</code>通俗点来说就是一个软件库，下载软件时只需要记得相应软件名，通过包管理工具apt可一键下载，比如下载<code>gcc</code> 只需要<code>sudo apt install gcc</code> 即可。</p><p><em>apt具体相关可前往<a href="https://www.runoob.com/linux/linux-comm-apt.html%E4%BA%86%E8%A7%A3">https://www.runoob.com/linux/linux-comm-apt.html了解</a></em></p><h1 id="为什么要换源"><a href="#为什么要换源" class="headerlink" title="为什么要换源"></a>为什么要换源</h1><p><code>Ubuntu</code>的源服务器是在外国，所以在我们平常下载软件的时候，下载速度是很慢的，甚至可能断掉，所以会使用国内的镜像，科大，阿里，网易，清华的源速度飞快，不但节省生命，还可以降低心脏病发病概率。</p><blockquote><p>镜像通常用于为相同信息内容提供不同的源，特别是在下载量大的时候提供了一种可靠的网络连接。制作镜像是一种文件同步的过程。“镜像网站”（英文:Mirror sites [1] ），又译作““镜像站点” ，亦即把一个互联网上的网站数据“拷贝”到本地服务器，并保持本地服务器数据的同步更新，因此也称为“复制网络站点” 。</p><hr><p>镜像源就是把官方的源做一个镜像，你可以在这下载软件。<br>比如<code>ubuntu</code>官方源在国外，下载软件可能会很慢，这时候就需要换成国内的镜像源。</p></blockquote><h1 id="换源过程"><a href="#换源过程" class="headerlink" title="换源过程"></a>换源过程</h1><p>我以Ubuntu18.04为例</p><h2 id="源在哪里"><a href="#源在哪里" class="headerlink" title="源在哪里"></a>源在哪里</h2><p>源一般在系统的<code>/etc/apt/sources.list</code>中，在命令行输入<code>vim sources.list</code>即可查看</p><h2 id="开始换源"><a href="#开始换源" class="headerlink" title="开始换源"></a>开始换源</h2><p>首先我们要寻找合适的国内源，一般有阿里源，清华源，中科院源，这里我以阿里为例</p><p>点击<a href="https://developer.aliyun.com/mirror/ubuntu">ubuntu镜像_ubuntu下载地址_ubuntu安装教程-阿里巴巴开源镜像站 (aliyun.com)</a>，进入后根据自己系统版本选择合适的源</p><figure class="highlight awk"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><code class="hljs awk">deb https:<span class="hljs-regexp">//mi</span>rrors.aliyun.com<span class="hljs-regexp">/ubuntu/</span> bionic main restricted universe multiverse<br>deb-src https:<span class="hljs-regexp">//mi</span>rrors.aliyun.com<span class="hljs-regexp">/ubuntu/</span> bionic main restricted universe multiverse<br><br>deb https:<span class="hljs-regexp">//mi</span>rrors.aliyun.com<span class="hljs-regexp">/ubuntu/</span> bionic-security main restricted universe multiverse<br>deb-src https:<span class="hljs-regexp">//mi</span>rrors.aliyun.com<span class="hljs-regexp">/ubuntu/</span> bionic-security main restricted universe multiverse<br><br>deb https:<span class="hljs-regexp">//mi</span>rrors.aliyun.com<span class="hljs-regexp">/ubuntu/</span> bionic-updates main restricted universe multiverse<br>deb-src https:<span class="hljs-regexp">//mi</span>rrors.aliyun.com<span class="hljs-regexp">/ubuntu/</span> bionic-updates main restricted universe multiverse<br><br><span class="hljs-comment"># deb https://mirrors.aliyun.com/ubuntu/ bionic-proposed main restricted universe multiverse</span><br><span class="hljs-comment"># deb-src https://mirrors.aliyun.com/ubuntu/ bionic-proposed main restricted universe multiverse</span><br><br>deb https:<span class="hljs-regexp">//mi</span>rrors.aliyun.com<span class="hljs-regexp">/ubuntu/</span> bionic-backports main restricted universe multiverse<br>deb-src https:<span class="hljs-regexp">//mi</span>rrors.aliyun.com<span class="hljs-regexp">/ubuntu/</span> bionic-backports main restricted universe multiverse<br><br></code></pre></td></tr></table></figure><p>如下是Ubuntu 18.04的中科院的源<a href="https://mirrors.ustc.edu.cn/repogen/">https://mirrors.ustc.edu.cn/repogen/</a></p><figure class="highlight awk"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><code class="hljs awk">deb https:<span class="hljs-regexp">//mi</span>rrors.ustc.edu.cn<span class="hljs-regexp">/ubuntu/</span> bionic main restricted universe multiverse<br>deb-src https:<span class="hljs-regexp">//mi</span>rrors.ustc.edu.cn<span class="hljs-regexp">/ubuntu/</span> bionic main restricted universe multiverse<br><br>deb https:<span class="hljs-regexp">//mi</span>rrors.ustc.edu.cn<span class="hljs-regexp">/ubuntu/</span> bionic-security main restricted universe multiverse<br>deb-src https:<span class="hljs-regexp">//mi</span>rrors.ustc.edu.cn<span class="hljs-regexp">/ubuntu/</span> bionic-security main restricted universe multiverse<br><br>deb https:<span class="hljs-regexp">//mi</span>rrors.ustc.edu.cn<span class="hljs-regexp">/ubuntu/</span> bionic-updates main restricted universe multiverse<br>deb-src https:<span class="hljs-regexp">//mi</span>rrors.ustc.edu.cn<span class="hljs-regexp">/ubuntu/</span> bionic-updates main restricted universe multiverse<br><br>deb https:<span class="hljs-regexp">//mi</span>rrors.ustc.edu.cn<span class="hljs-regexp">/ubuntu/</span> bionic-backports main restricted universe multiverse<br>deb-src https:<span class="hljs-regexp">//mi</span>rrors.ustc.edu.cn<span class="hljs-regexp">/ubuntu/</span> bionic-backports main restricted universe multiverse<br></code></pre></td></tr></table></figure><p>然后，来到系统下的/etc/apt，输入命令vim sources.list打开文件，删除原来的，粘贴上去</p><p>输入<code>:wq</code>，点击enter键推出，再输入</p><figure class="highlight routeros"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs routeros">sudo apt-<span class="hljs-built_in">get</span> update<br>sudo apt-<span class="hljs-built_in">get</span> upgrade<br></code></pre></td></tr></table></figure><p>遇到问题只需要一直y即可</p><p>换源完成</p>]]></content>
<categories>
<category>服务器部署</category>
</categories>
<tags>
<tag>ubuntu</tag>
</tags>
</entry>
<entry>
<title>ubuntu部署-mysql</title>
<link href="/super_zhu/2022/11/02/ubuntu%E9%83%A8%E7%BD%B2-mysql/"/>
<url>/super_zhu/2022/11/02/ubuntu%E9%83%A8%E7%BD%B2-mysql/</url>
<content type="html"><![CDATA[<h1 id="问题"><a href="#问题" class="headerlink" title="问题"></a>问题</h1><p>在下载中，如遇到源的问题，请跳转到换源篇章</p><p>需要了解更多或者更为细致，请前往MySQL官网<a href="https://dev.mysql.com/">软件开发模块 ：： 开发者专区 (mysql.com)</a></p><h1 id="开始配置"><a href="#开始配置" class="headerlink" title="开始配置"></a>开始配置</h1><h2 id="下载mysql"><a href="#下载mysql" class="headerlink" title="下载mysql"></a>下载mysql</h2><p>在命令行输入，以下命令，遇到问题输入y即可</p><figure class="highlight axapta"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs axapta">sudo apt install mysql-<span class="hljs-keyword">server</span><br></code></pre></td></tr></table></figure><p>下载好后，默认有一个没有密码的超级账号，输入以下代码即可进入mysql命令行</p><figure class="highlight ebnf"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs ebnf"><span class="hljs-attribute">sudo mysql</span><br></code></pre></td></tr></table></figure><h2 id="配置用户"><a href="#配置用户" class="headerlink" title="配置用户"></a>配置用户</h2><h3 id="查看用户表"><a href="#查看用户表" class="headerlink" title="查看用户表"></a>查看用户表</h3><p>mysql的用户信息是存储在mysql库的user表里的，执行以下命令,查看用户的信息</p><figure class="highlight n1ql"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs n1ql">use mysql;<br><span class="hljs-keyword">select</span> * <span class="hljs-keyword">from</span> <span class="hljs-keyword">user</span>;<br></code></pre></td></tr></table></figure><h3 id="创建用户"><a href="#创建用户" class="headerlink" title="创建用户"></a>创建用户</h3><p>使用以下命令，可创建用户</p><figure class="highlight n1ql"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs n1ql"><span class="hljs-keyword">CREATE</span> <span class="hljs-keyword">USER</span> <span class="hljs-string">'用户名'</span>@<span class="hljs-string">'IP地址或者域名'</span> IDENTIFIED <span class="hljs-keyword">BY</span> <span class="hljs-string">'*password*'</span>;<br></code></pre></td></tr></table></figure><p>其中<strong>ip地址或者域名</strong>那里，如果使用通配符**%**代替，则代表可以在任何电脑使用你这个账号进行登录</p><h3 id="查看用户权限"><a href="#查看用户权限" class="headerlink" title="查看用户权限"></a>查看用户权限</h3><p>刚刚创建的用户是没有操作表权限的</p><p>在命令行输入</p><figure class="highlight nginx"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs nginx"><span class="hljs-attribute">SHOW</span> GRANTS FOR <span class="hljs-string">'用户名'</span>@<span class="hljs-string">'ip地址'</span>;<br></code></pre></td></tr></table></figure><h3 id="授予用户权限"><a href="#授予用户权限" class="headerlink" title="授予用户权限"></a>授予用户权限</h3><p>授予用户的万能公式是</p><figure class="highlight pgsql"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs pgsql"><span class="hljs-keyword">grant</span> <span class="hljs-string">'权限列表'</span> <span class="hljs-keyword">on</span> <span class="hljs-string">'数据库名.表名'</span> <span class="hljs-keyword">to</span> <span class="hljs-string">'用户名'</span>@<span class="hljs-string">'主机名'</span><<span class="hljs-keyword">WITH</span> <span class="hljs-keyword">GRANT</span> <span class="hljs-keyword">OPTION</span>><br></code></pre></td></tr></table></figure><p>其中<code>WITH GRANT OPTION</code>是代表赋予这个用户赋予其他用户的权限，可加可不加</p><p>要是要，赋予这个用户全部权限，可执行以下命令</p><figure class="highlight pgsql"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs pgsql"><span class="hljs-keyword">GRANT</span> <span class="hljs-keyword">ALL</span> <span class="hljs-keyword">ON</span> *.* <span class="hljs-keyword">TO</span> <span class="hljs-string">'用户名'</span>@<span class="hljs-string">'主机IP地址'</span> <span class="hljs-keyword">WITH</span> <span class="hljs-keyword">GRANT</span> <span class="hljs-keyword">OPTION</span>;<br></code></pre></td></tr></table></figure><p>其中<code>All</code>代表赋予<strong>出除了授予他人特权之外的全部权限</strong>，其中<code>*.*</code>代表可以操作所有的库中的所有表</p><h3 id="修改用户密码"><a href="#修改用户密码" class="headerlink" title="修改用户密码"></a>修改用户密码</h3><p>使用以下命令，即可</p><figure class="highlight pgsql"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs pgsql"><span class="hljs-keyword">alter</span> <span class="hljs-keyword">user</span> <span class="hljs-string">'用户名'</span>@<span class="hljs-string">'主机名'</span> identified <span class="hljs-keyword">with</span> caching_sha2_password <span class="hljs-keyword">by</span> <span class="hljs-string">'新密码'</span><br></code></pre></td></tr></table></figure><p>其中<code>caching_sha2_password</code>代表登录时身份验证是使用caching_sha2_password插件进行验证</p><h2 id="超级重要的！！！"><a href="#超级重要的！！！" class="headerlink" title="超级重要的！！！"></a>超级重要的！！！</h2><p><strong>这个对于想要远程连接时是必须的！！！</strong></p><p><strong>因为Ubuntu的mysql默认是不允许其他主机连接，所以必须修改相应配置！！！</strong></p><p><strong>本人表示非常难受（因为本来不知道）</strong></p><p>配置文件是<code>/etc/mysql/mysql.conf.d/mysqld.cnf</code>输入命令行</p><figure class="highlight awk"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs awk">sudo vim <span class="hljs-regexp">/etc/my</span>sql<span class="hljs-regexp">/mysql.conf.d/my</span>sqld.cnf<br></code></pre></td></tr></table></figure><p>将其中的<code>bind-address=127.0.0.1</code>修改成<code>bind-address=0.0.0.0</code></p><p>然后再<code>:wq</code>保存退出</p><p>再输入命令重启mysql</p><figure class="highlight ebnf"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs ebnf"><span class="hljs-attribute">sudo service mysql restart</span><br></code></pre></td></tr></table></figure><h1 id="mysql的校验规则"><a href="#mysql的校验规则" class="headerlink" title="mysql的校验规则"></a>mysql的校验规则</h1><p>mysql 5.7后如果程序中的sql语句使用了group by等，可能会报1055的错，其原因是mysql5.7 版本中有了一个select mode（严格模式）</p><h2 id="临时办法（重启mysql后失效）"><a href="#临时办法（重启mysql后失效）" class="headerlink" title="临时办法（重启mysql后失效）"></a>临时办法（重启mysql后失效）</h2><p>打开mysql命令行执行</p><figure class="highlight sql"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs sql"><span class="hljs-keyword">SET</span> <span class="hljs-keyword">GLOBAL</span> sql_mode<span class="hljs-operator">=</span>(<span class="hljs-keyword">SELECT</span> REPLACE(@<span class="hljs-variable">@sql</span>_mode,<span class="hljs-string">'ONLY_FULL_GROUP_BY'</span>,<span class="hljs-string">''</span>));<br></code></pre></td></tr></table></figure><p>但要在拥有root权限下</p><p>其中原因sql_mode是一组语法校验规则</p><h2 id="永久办法"><a href="#永久办法" class="headerlink" title="永久办法"></a>永久办法</h2><p>打开<code>/etc/mysql/mysql.conf.d/mysqld.cnf</code>文件</p><p>在其<code>[mysqld]</code>下添加</p><figure class="highlight sql"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><code class="hljs sql"># 设置sql_mode,关闭ONLY_FULL_GROUP_BY,避免使用<span class="hljs-keyword">group</span> <span class="hljs-keyword">by</span>函数导致<span class="hljs-number">1055</span>错误<br>sql_mode<span class="hljs-operator">=</span>STRICT_TRANS_TABLES,NO_ZERO_IN_DATE,NO_ZERO_DATE,ERROR_FOR_DIVISION_BY_ZERO,NO_ENGINE_SUBSTITUTION<br><br></code></pre></td></tr></table></figure><p>然后再进行重启mysql</p><figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs shell">sudo service mysql restart<br></code></pre></td></tr></table></figure><p>完成</p>]]></content>
<categories>
<category>服务器部署</category>
</categories>
<tags>
<tag>ubuntu</tag>
</tags>
</entry>
<entry>
<title>ubuntu部署-nginx</title>
<link href="/super_zhu/2022/11/01/ubuntu%E9%83%A8%E7%BD%B2-nginx/"/>
<url>/super_zhu/2022/11/01/ubuntu%E9%83%A8%E7%BD%B2-nginx/</url>
<content type="html"><![CDATA[<h1 id="配置https"><a href="#配置https" class="headerlink" title="配置https"></a>配置https</h1><p>需编辑<code>/etc/nginx/nginx.conf</code>或者<code>/etc/nginx/sites-enabled/default</code></p><p>请按照以下格式配置</p><p>若是想要nginx更为详细的配置，请前往<a href="https://blog.csdn.net/aiwangtingyun/article/details/118823582">(151条消息) 【Nginx】之 nginx.conf 配置详解_王廷云的博客的博客-CSDN博客_nginxconf配置</a></p><figure class="highlight applescript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br></pre></td><td class="code"><pre><code class="hljs applescript">server{<br>listen <span class="hljs-number">443</span> ssl; <br> <span class="hljs-comment">#请填写绑定证书的域名</span><br> server_name qiuwo.xyz; <br> <span class="hljs-comment">#请填写证书文件的相对路径或绝对路径</span><br> ssl_certificate qiuwo.xyz_bundle.crt; <span class="hljs-comment">#这里是相对路径</span><br> <span class="hljs-comment">#请填写私钥文件的相对路径或绝对路径</span><br> ssl_certificate_key qiuwo.xyz.key;<span class="hljs-comment">#这里是相对路径</span><br> ssl_session_timeout <span class="hljs-number">5</span>m;<br> <span class="hljs-comment">#请按照以下协议配置</span><br> ssl_protocols TLSv1<span class="hljs-number">.2</span> TLSv1<span class="hljs-number">.3</span>; <br> <span class="hljs-comment">#请按照以下套件配置，配置加密套件，写法遵循 openssl 标准。</span><br> ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE; <br> ssl_prefer_server_ciphers <span class="hljs-keyword">on</span>;<br><br>}<br></code></pre></td></tr></table></figure><h1 id="反向代理请求"><a href="#反向代理请求" class="headerlink" title="反向代理请求"></a>反向代理请求</h1><h2 id="proxy-pass"><a href="#proxy-pass" class="headerlink" title="proxy_pass"></a>proxy_pass</h2><p>反向代理请求，我一般使用proxy_pass进行代理，如下</p><figure class="highlight crmsh"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><code class="hljs crmsh"><span class="hljs-keyword">location</span> <span class="hljs-title">/wx_post</span> {<br>proxy_pass http://<span class="hljs-number">124.221</span>.<span class="hljs-number">80.208</span>:<span class="hljs-number">8083</span><br>}<br></code></pre></td></tr></table></figure><p> 当我对服务器发起<a href="https://qiuwo.xyz/wx_post/xxx%E7%9A%84%E6%97%B6%E5%80%99%EF%BC%8Cnginx%E4%BC%9A%E5%8F%8D%E5%90%91%E4%BB%A3%E7%90%86%E5%88%B0http://124.221.80.208:8083/wx_post/xxx">https://qiuwo.xyz/wx_post/xxx的时候，nginx会反向代理到http://124.221.80.208:8083/wx_post/xxx</a></p><h2 id="“-x2F-“有无的区别"><a href="#“-x2F-“有无的区别" class="headerlink" title="“/“有无的区别"></a>“/“有无的区别</h2><p>现在我请求的地址为<a href="https://qiuwo.xyz/wx_post/xxx">https://qiuwo.xyz/wx_post/xxx</a></p><p>有以下请求情况</p><figure class="highlight awk"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br></pre></td><td class="code"><pre><code class="hljs awk">location /wx_post {<br>proxy_pass http:<span class="hljs-regexp">//</span><span class="hljs-number">124.221</span>.<span class="hljs-number">80.208</span>:<span class="hljs-number">8083</span> --A<br>}<br><br><br>location /wx_post {<br>proxy_pass http:<span class="hljs-regexp">//</span><span class="hljs-number">124.221</span>.<span class="hljs-number">80.208</span>:<span class="hljs-number">8083</span>/ --B<br>}<br><br><br>location <span class="hljs-regexp">/wx_post/</span> {<br>proxy_pass http:<span class="hljs-regexp">//</span><span class="hljs-number">124.221</span>.<span class="hljs-number">80.208</span>:<span class="hljs-number">8083</span>/ --C<br>}<br><br><br>location <span class="hljs-regexp">/wx_post/</span> {<br>proxy_pass http:<span class="hljs-regexp">//</span><span class="hljs-number">124.221</span>.<span class="hljs-number">80.208</span>:<span class="hljs-number">8083</span> --D<br>}<br></code></pre></td></tr></table></figure><p>对应的请求结果为</p><figure class="highlight awk"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><code class="hljs awk">http:<span class="hljs-regexp">//</span><span class="hljs-number">124.221</span>.<span class="hljs-number">80.208</span>:<span class="hljs-number">8083</span><span class="hljs-regexp">/wx_post/</span>xxx --A<br>http:<span class="hljs-regexp">//</span><span class="hljs-number">124.221</span>.<span class="hljs-number">80.208</span>:<span class="hljs-number">8083</span><span class="hljs-regexp">//</span>xxx --B<br>http:<span class="hljs-regexp">//</span><span class="hljs-number">124.221</span>.<span class="hljs-number">80.208</span>:<span class="hljs-number">8083</span>/xxx --C<br>http:<span class="hljs-regexp">//</span><span class="hljs-number">124.221</span>.<span class="hljs-number">80.208</span>:<span class="hljs-number">8083</span><span class="hljs-regexp">/wx_post/</span>xxx --D<br></code></pre></td></tr></table></figure><p>在对于端口后面还有路径也是一样的情况，比如配置为</p><figure class="highlight awk"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs awk">location /wx_post {<br>proxy_pass http:<span class="hljs-regexp">//</span><span class="hljs-number">124.221</span>.<span class="hljs-number">80.208</span>:<span class="hljs-number">8083</span>/hhh<br>}<br>location <span class="hljs-regexp">/wx_post/</span> {<br>proxy_pass http:<span class="hljs-regexp">//</span><span class="hljs-number">124.221</span>.<span class="hljs-number">80.208</span>:<span class="hljs-number">8083</span>/hhh<br>}<br></code></pre></td></tr></table></figure><p>则反向代理为<a href="http://124.221.80.208:8083/hhh/xxx%E5%92%8Chttp://124.221.80.208:8083/hhhxxx">http://124.221.80.208:8083/hhh/xxx和http://124.221.80.208:8083/hhhxxx</a></p><h2 id="配置静态资源"><a href="#配置静态资源" class="headerlink" title="配置静态资源"></a>配置静态资源</h2><p>配置静态资源有两种方式root和alias</p><p>假如你文件路径为/home/ubuntu/post/images/xxx.jpg</p><p> 请求地址为<a href="https://qiuwo.xyz/xxx">https://qiuwo.xyz/xxx</a></p><figure class="highlight crmsh"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><code class="hljs crmsh"><span class="hljs-comment"># 请求地址为https://qiuwo.xyz/ubuntu/post/images/xxx.png</span><br><span class="hljs-keyword">location</span> <span class="hljs-title">/ubuntu</span> { <br> root /home<br>}<br><br><span class="hljs-comment">#请求地址 https://qiuwo.xyz/hhh/post/images/xxx.png</span><br><span class="hljs-keyword">location</span> <span class="hljs-title">/hhh</span> {<br> alias /home/ubuntu <span class="hljs-comment">#如果你在Ubuntu后面加上斜杠"/"那么home后面也要</span><br>}<br></code></pre></td></tr></table></figure><p>以上是情况实例</p>]]></content>
<categories>
<category>服务器部署</category>
</categories>
<tags>
<tag>ubuntu</tag>
</tags>
</entry>
</search>