升级element版本 修改icon

web/src/view/dashboard/index.vue

@@ -9,17 +9,26 @@
             <el-row>
               <el-col :span="8" :xs="24" :sm="8">
                 <div class="flex-center">
-                  <i class="el-icon-sort icon" />今日流量 (1231231)
+                  <el-icon class="icon">
+                    <sort />
+                  </el-icon>
+                  今日流量 (1231231)
                 </div>
               </el-col>
               <el-col :span="8" :xs="24" :sm="8">
                 <div class="flex-center">
-                  <i class="el-icon-s-custom icon" />总用户数 (24001)
+                  <el-icon class="icon">
+                    <avatar />
+                  </el-icon>
+                  总用户数 (24001)
                 </div>
               </el-col>
               <el-col :span="8" :xs="24" :sm="8">
                 <div class="flex-center">
-                  <i class="el-icon-s-comment icon" />好评率 (99%)
+                  <el-icon class="icon">
+                    <comment />
+                  </el-icon>
+                  好评率 (99%)
                 </div>
               </el-col>
             </el-row>
@@ -64,7 +73,9 @@
           >
             <div class="quick-entrance-item">
               <div class="quick-entrance-item-icon" :style="{ backgroundColor: card.bg }">
-                <i :class="card.icon" :style="{ color: card.color }" />
+                <el-icon>
+                  <component :is="card.icon" :style="{ color: card.color }" />
+                </el-icon>
               </div>
               <p>{{ card.label }}</p>
             </div>
@@ -106,42 +117,42 @@ export default {
       toolCards: [
         {
           label: '用户管理',
-          icon: 'el-icon el-icon-monitor',
+          icon: 'monitor',
           name: 'user',
           color: '#ff9c6e',
           bg: 'rgba(255, 156, 110,.3)'
         },
         {
           label: '角色管理',
-          icon: 'el-icon el-icon-setting',
+          icon: 'setting',
           name: 'authority',
           color: '#69c0ff',
           bg: 'rgba(105, 192, 255,.3)'
         },
         {
           label: '菜单管理',
-          icon: 'el-icon el-icon-menu',
+          icon: 'menu',
           name: 'menu',
           color: '#b37feb',
           bg: 'rgba(179, 127, 235,.3)'
         },
         {
           label: '代码生成器',
-          icon: ' el-icon-cpu',
+          icon: 'cpu',
           name: 'autoCode',
           color: '#ffd666',
           bg: 'rgba(255, 214, 102,.3)'
         },
         {
           label: '表单生成器',
-          icon: 'el-icon-document-checked',
+          icon: 'document-checked',
           name: 'formCreate',
           color: '#ff85c0',
           bg: 'rgba(255, 133, 192,.3)'
         },
         {
           label: '关于我们',
-          icon: ' el-icon-user',
+          icon: 'user',
           name: 'about',
           color: '#5cdbd3',
           bg: 'rgba(92, 219, 211,.3)'