chore: update element-plus@2.0.0

package.json

@@ -36,7 +36,7 @@
     "animate.css": "^4.1.1",
     "axios": "^0.25.0",
     "css-color-function": "^1.3.3",
-    "element-plus": "1.3.0-beta.1",
+    "element-plus": "^2.0.0",
     "element-resize-detector": "^1.2.3",
     "js-cookie": "^3.0.1",
     "lodash-es": "^4.17.21",

pnpm-lock.yaml

@@ -31,7 +31,7 @@ specifiers:
   axios: ^0.25.0
   cross-env: 7.0.3
   css-color-function: ^1.3.3
-  element-plus: 1.3.0-beta.1
+  element-plus: ^2.0.0
   element-resize-detector: ^1.2.3
   eslint: 7.30.0
   eslint-plugin-prettier: 3.4.0
@@ -85,7 +85,7 @@ dependencies:
   animate.css: 4.1.1
   axios: 0.25.0
   css-color-function: 1.3.3
-  element-plus: 1.3.0-beta.1_vue@3.2.29
+  element-plus: 2.0.0_vue@3.2.29
   element-resize-detector: 1.2.4
   js-cookie: 3.0.1
   lodash-es: 4.17.21
@@ -2862,10 +2862,10 @@ packages:
       }
     dev: true
 
-  /element-plus/1.3.0-beta.1_vue@3.2.29:
+  /element-plus/2.0.0_vue@3.2.29:
     resolution:
       {
-        integrity: sha512-q3vMaKElPpuSTeIF7kuDmMOE+N1YVCCIG3fshXpz6qgjnxPbgZumVM0qGfhr8DTu9JxRbBoDok49dqtX/BWn3w==
+        integrity: sha512-bLt/Ahn0ejOKuYA4HR3iuGLHTt4pRzQZwCx1G2BLHEJLZi7CfLiFnjZMhGhYNkk49ir4JHtnBJTgLhNNaKALcA==
       }
     peerDependencies:
       vue: ^3.2.0

src/layout/components/navbar.vue

@@ -234,14 +234,8 @@ function translationEn() {
 }
 
 .translation {
-  .el-dropdown-menu__item {
-    padding: 5px 40px !important;
-  }
-
-  .el-dropdown-menu__item:focus,
-  .el-dropdown-menu__item:not(.is-disabled):hover {
-    color: #606266;
-    background: #f0f0f0;
+  ::v-deep(.el-dropdown-menu__item) {
+    padding: 5px 40px;
   }
 
   .check-zh {
@@ -258,16 +252,10 @@ function translationEn() {
 .logout {
   max-width: 120px;
 
-  .el-dropdown-menu__item {
+  ::v-deep(.el-dropdown-menu__item) {
     min-width: 100%;
     display: inline-flex;
     flex-wrap: wrap;
   }
-
-  .el-dropdown-menu__item:focus,
-  .el-dropdown-menu__item:not(.is-disabled):hover {
-    color: #606266;
-    background: #f0f0f0;
-  }
 }
 </style>

src/layout/components/panel/index.vue

@@ -125,7 +125,7 @@ emitter.on("openPanel", () => {
 
     &:hover {
       cursor: pointer;
-      color: red;
+      color: var(--el-color-primary);
     }
   }
 }

src/layout/components/tag/index.scss

@@ -92,7 +92,7 @@
 
     .el-icon-close {
       font-size: 10px;
-      color: #1890ff;
+      color: var(--el-color-primary);
       cursor: pointer;
       position: absolute;
       top: 50%;
@@ -190,7 +190,8 @@
       align-items: center;
 
       &:hover {
-        background: #eee;
+        background: var(--el-color-primary-light-9);
+        color: var(--el-color-primary);
       }
 
       svg {
@@ -236,7 +237,7 @@
 }
 
 .scroll-item.is-active {
-  background-color: #eaf4fe;
+  background-color: var(--el-color-primary-light-9);
   position: relative;
   color: #fff;
 
@@ -249,7 +250,7 @@
   }
 
   a {
-    color: #1890ff;
+    color: var(--el-color-primary);
   }
 }
 
@@ -288,10 +289,10 @@
 
 /* 卡片模式下鼠标移入显示蓝色边框 */
 .card-in {
-  color: #1890ff;
+  color: var(--el-color-primary);
 
   a {
-    color: #1890ff;
+    color: var(--el-color-primary);
   }
 }
 
@@ -312,7 +313,7 @@
   position: absolute;
   left: 0;
   bottom: 0;
-  background: #1890ff;
+  background: var(--el-color-primary);
 }
 
 /* 灵动模式下鼠标移入显示蓝色进度条 */
@@ -322,7 +323,7 @@
   position: absolute;
   left: 0;
   bottom: 0;
-  background: #1890ff;
+  background: var(--el-color-primary);
   animation: scheduleInWidth 400ms ease-in;
 }
 
@@ -333,7 +334,7 @@
   position: absolute;
   left: 0;
   bottom: 0;
-  background: #1890ff;
+  background: var(--el-color-primary);
   animation: scheduleOutWidth 400ms ease-in;
 }
 

src/layout/components/tag/index.vue

@@ -722,7 +722,11 @@ const getContextMenuStyle = computed((): CSSProperties => {
                 :disabled="item.disabled"
                 @click="onClickDrop(key, item)"
               >
-                <component :is="item.icon" :key="key" />
+                <component
+                  :is="item.icon"
+                  :key="key"
+                  style="margin-right: 6px"
+                />
                 {{ $t(item.text) }}
               </el-dropdown-item>
             </el-dropdown-menu>