diff --git a/package.json b/package.json
index f1f8e399..1547eacb 100644
--- a/package.json
+++ b/package.json
@@ -8,27 +8,28 @@
 		"lint": "vue-cli-service lint"
 	},
 	"dependencies": {
+		"@element-plus/icons": "0.0.11",
 		"@tinymce/tinymce-vue": "4.0.4",
-		"axios": "0.23.0",
-		"core-js": "3.18.3",
+		"axios": "0.24.0",
+		"core-js": "3.19.1",
 		"cropperjs": "1.5.12",
 		"crypto-js": "4.1.1",
-		"echarts": "5.2.1",
-		"element-plus": "1.1.0-beta.24",
+		"echarts": "5.2.2",
+		"element-plus": "1.2.0-beta.3",
 		"nprogress": "0.2.0",
 		"sortablejs": "1.14.0",
-		"tinymce": "5.9.2",
-		"vue": "3.2.20",
+		"tinymce": "5.10.1",
+		"vue": "3.2.21",
 		"vue-i18n": "9.1.9",
 		"vue-router": "4.0.12",
 		"vuedraggable": "4.0.3",
 		"vuex": "4.0.2"
 	},
 	"devDependencies": {
-		"@vue/cli-plugin-babel": "4.5.13",
-		"@vue/cli-plugin-eslint": "4.5.13",
-		"@vue/cli-service": "4.5.13",
-		"@vue/compiler-sfc": "3.2.20",
+		"@vue/cli-plugin-babel": "4.5.15",
+		"@vue/cli-plugin-eslint": "4.5.15",
+		"@vue/cli-service": "4.5.15",
+		"@vue/compiler-sfc": "3.2.21",
 		"babel-eslint": "10.1.0",
 		"eslint": "6.8.0",
 		"eslint-plugin-vue": "7.19.1",
diff --git a/src/App.vue b/src/App.vue
index 766d10be..03880f13 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,5 +1,5 @@
 <template>
-	<el-config-provider :locale="$i18n.messages[$i18n.locale].el">
+	<el-config-provider :locale="$i18n.messages[$i18n.locale].el" :button="{autoInsertSpace: false}">
 		<router-view></router-view>
 	</el-config-provider>
 </template>
diff --git a/src/assets/font/scicon/iconfont.css b/src/assets/font/scicon/iconfont.css
deleted file mode 100644
index 85250f49..00000000
--- a/src/assets/font/scicon/iconfont.css
+++ /dev/null
@@ -1,406 +0,0 @@
-@font-face {
-  font-family: "scicon"; /* Project id 2583127 */
-  src: url('iconfont.woff2?t=1622514384464') format('woff2'),
-       url('iconfont.woff?t=1622514384464') format('woff'),
-       url('iconfont.ttf?t=1622514384464') format('truetype');
-}
-
-[class*="sc-icon-"] {
-  font-family: "scicon" !important;
-  font-style: normal;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-.sc-icon-layout-line:before {
-  content: "\e718";
-}
-
-.sc-icon-table-fill:before {
-  content: "\e728";
-}
-
-.sc-icon-table-line:before {
-  content: "\e729";
-}
-
-.sc-icon-code-fill:before {
-  content: "\e72b";
-}
-
-.sc-icon-bug-line:before {
-  content: "\e72c";
-}
-
-.sc-icon-bug-fill:before {
-  content: "\e72d";
-}
-
-.sc-icon-git-branch-fill:before {
-  content: "\e72e";
-}
-
-.sc-icon-git-branch-line:before {
-  content: "\e72f";
-}
-
-.sc-icon-git-pull-request-line:before {
-  content: "\e730";
-}
-
-.sc-icon-git-pull-request-fill:before {
-  content: "\e731";
-}
-
-.sc-icon-dashboard-3-fill:before {
-  content: "\e73c";
-}
-
-.sc-icon-database-fill:before {
-  content: "\e73d";
-}
-
-.sc-icon-database-2-line:before {
-  content: "\e73e";
-}
-
-.sc-icon-database-2-fill:before {
-  content: "\e73f";
-}
-
-.sc-icon-dashboard-3-line:before {
-  content: "\e740";
-}
-
-.sc-icon-database-line:before {
-  content: "\e741";
-}
-
-.sc-icon-qr-code-line:before {
-  content: "\e747";
-}
-
-.sc-icon-wifi-line:before {
-  content: "\e758";
-}
-
-.sc-icon-wifi-off-line:before {
-  content: "\e759";
-}
-
-.sc-icon-draft-fill:before {
-  content: "\e760";
-}
-
-.sc-icon-draft-line:before {
-  content: "\e761";
-}
-
-.sc-icon-file-excel-2-fill:before {
-  content: "\e769";
-}
-
-.sc-icon-file-list-fill:before {
-  content: "\e76e";
-}
-
-.sc-icon-file-list-line:before {
-  content: "\e76f";
-}
-
-.sc-icon-file-ppt-2-fill:before {
-  content: "\e772";
-}
-
-.sc-icon-file-word-2-fill:before {
-  content: "\e779";
-}
-
-.sc-icon-android-fill:before {
-  content: "\e7c7";
-}
-
-.sc-icon-apple-fill:before {
-  content: "\e7c8";
-}
-
-.sc-icon-qq-fill:before {
-  content: "\e7d9";
-}
-
-.sc-icon-vuejs-fill:before {
-  content: "\e7e2";
-}
-
-.sc-icon-wechat-fill:before {
-  content: "\e7e3";
-}
-
-.sc-icon-windows-fill:before {
-  content: "\e7e4";
-}
-
-.sc-icon-map-pin-line:before {
-  content: "\e7ef";
-}
-
-.sc-icon-map-pin-fill:before {
-  content: "\e7f0";
-}
-
-.sc-icon-map-pin-add-line:before {
-  content: "\e7f1";
-}
-
-.sc-icon-road-map-fill:before {
-  content: "\e7f3";
-}
-
-.sc-icon-rocket-2-fill:before {
-  content: "\e7f4";
-}
-
-.sc-icon-rocket-2-line:before {
-  content: "\e7f5";
-}
-
-.sc-icon-road-map-line:before {
-  content: "\e7f6";
-}
-
-.sc-icon-image-add-line:before {
-  content: "\e806";
-}
-
-.sc-icon-image-fill:before {
-  content: "\e807";
-}
-
-.sc-icon-image-edit-line:before {
-  content: "\e808";
-}
-
-.sc-icon-image-line:before {
-  content: "\e809";
-}
-
-.sc-icon-notification-fill:before {
-  content: "\e80c";
-}
-
-.sc-icon-notification-line:before {
-  content: "\e80d";
-}
-
-.sc-icon-vidicon-fill:before {
-  content: "\e823";
-}
-
-.sc-icon-vidicon-line:before {
-  content: "\e824";
-}
-
-.sc-icon-t-shirt-line:before {
-  content: "\e836";
-}
-
-.sc-icon-t-shirt-fill:before {
-  content: "\e837";
-}
-
-.sc-icon-apps-fill:before {
-  content: "\e83c";
-}
-
-.sc-icon-apps-line:before {
-  content: "\e83d";
-}
-
-.sc-icon-delete-bin-6-line:before {
-  content: "\e84f";
-}
-
-.sc-icon-delete-bin-6-fill:before {
-  content: "\e850";
-}
-
-.sc-icon-filter-line:before {
-  content: "\e858";
-}
-
-.sc-icon-filter-fill:before {
-  content: "\e859";
-}
-
-.sc-icon-filter-off-fill:before {
-  content: "\e85a";
-}
-
-.sc-icon-filter-off-line:before {
-  content: "\e85b";
-}
-
-.sc-icon-forbid-fill:before {
-  content: "\e85c";
-}
-
-.sc-icon-forbid-line:before {
-  content: "\e85d";
-}
-
-.sc-icon-indeterminate-circle-fill:before {
-  content: "\e85e";
-}
-
-.sc-icon-indeterminate-circle-line:before {
-  content: "\e85f";
-}
-
-.sc-icon-information-fill:before {
-  content: "\e860";
-}
-
-.sc-icon-information-line:before {
-  content: "\e861";
-}
-
-.sc-icon-shield-check-fill:before {
-  content: "\e875";
-}
-
-.sc-icon-shield-check-line:before {
-  content: "\e876";
-}
-
-.sc-icon-shield-flash-fill:before {
-  content: "\e877";
-}
-
-.sc-icon-shield-flash-line:before {
-  content: "\e878";
-}
-
-.sc-icon-shield-keyhole-fill:before {
-  content: "\e879";
-}
-
-.sc-icon-shield-keyhole-line:before {
-  content: "\e87a";
-}
-
-.sc-icon-shield-user-fill:before {
-  content: "\e87b";
-}
-
-.sc-icon-shield-user-line:before {
-  content: "\e87c";
-}
-
-.sc-icon-contacts-fill:before {
-  content: "\e880";
-}
-
-.sc-icon-contacts-line:before {
-  content: "\e881";
-}
-
-.sc-icon-group-fill:before {
-  content: "\e883";
-}
-
-.sc-icon-group-line:before {
-  content: "\e884";
-}
-
-.sc-icon-user-fill:before {
-  content: "\e88b";
-}
-
-.sc-icon-user-line:before {
-  content: "\e88c";
-}
-
-.sc-icon-user-search-fill:before {
-  content: "\e88e";
-}
-
-.sc-icon-user-search-line:before {
-  content: "\e88f";
-}
-
-.sc-icon-user-settings-line:before {
-  content: "\e890";
-}
-
-.sc-icon-user-star-line:before {
-  content: "\e891";
-}
-
-.sc-icon-building-fill:before {
-  content: "\e6b1";
-}
-
-.sc-icon-building-line:before {
-  content: "\e6b2";
-}
-
-.sc-icon-home-3-line:before {
-  content: "\e6b3";
-}
-
-.sc-icon-home-3-fill:before {
-  content: "\e6b4";
-}
-
-.sc-icon-chat-check-fill:before {
-  content: "\e6f2";
-}
-
-.sc-icon-chat-check-line:before {
-  content: "\e6f3";
-}
-
-.sc-icon-chat-smile-line:before {
-  content: "\e6f9";
-}
-
-.sc-icon-chat-smile-fill:before {
-  content: "\e6fa";
-}
-
-.sc-icon-feedback-fill:before {
-  content: "\e6fb";
-}
-
-.sc-icon-message-3-fill:before {
-  content: "\e6fc";
-}
-
-.sc-icon-message-2-fill:before {
-  content: "\e6fd";
-}
-
-.sc-icon-message-2-line:before {
-  content: "\e6fe";
-}
-
-.sc-icon-message-3-line:before {
-  content: "\e6ff";
-}
-
-.sc-icon-feedback-line:before {
-  content: "\e700";
-}
-
-.sc-icon-edit-box-fill:before {
-  content: "\e70b";
-}
-
-.sc-icon-edit-box-line:before {
-  content: "\e70c";
-}
-
-.sc-icon-layout-fill:before {
-  content: "\e715";
-}
-
diff --git a/src/assets/font/scicon/iconfont.json b/src/assets/font/scicon/iconfont.json
deleted file mode 100644
index 9cec43a1..00000000
--- a/src/assets/font/scicon/iconfont.json
+++ /dev/null
@@ -1,695 +0,0 @@
-{
-  "id": "2583127",
-  "name": "SCUI",
-  "font_family": "scicon",
-  "css_prefix_text": "sc-icon-",
-  "description": "SCUI",
-  "glyphs": [
-    {
-      "icon_id": "17103084",
-      "name": "layout-line",
-      "font_class": "layout-line",
-      "unicode": "e718",
-      "unicode_decimal": 59160
-    },
-    {
-      "icon_id": "17103145",
-      "name": "table-fill",
-      "font_class": "table-fill",
-      "unicode": "e728",
-      "unicode_decimal": 59176
-    },
-    {
-      "icon_id": "17103147",
-      "name": "table-line",
-      "font_class": "table-line",
-      "unicode": "e729",
-      "unicode_decimal": 59177
-    },
-    {
-      "icon_id": "17103170",
-      "name": "code-fill",
-      "font_class": "code-fill",
-      "unicode": "e72b",
-      "unicode_decimal": 59179
-    },
-    {
-      "icon_id": "17103172",
-      "name": "bug-line",
-      "font_class": "bug-line",
-      "unicode": "e72c",
-      "unicode_decimal": 59180
-    },
-    {
-      "icon_id": "17103177",
-      "name": "bug-fill",
-      "font_class": "bug-fill",
-      "unicode": "e72d",
-      "unicode_decimal": 59181
-    },
-    {
-      "icon_id": "17103186",
-      "name": "git-branch-fill",
-      "font_class": "git-branch-fill",
-      "unicode": "e72e",
-      "unicode_decimal": 59182
-    },
-    {
-      "icon_id": "17103187",
-      "name": "git-branch-line",
-      "font_class": "git-branch-line",
-      "unicode": "e72f",
-      "unicode_decimal": 59183
-    },
-    {
-      "icon_id": "17103193",
-      "name": "git-pull-request-line",
-      "font_class": "git-pull-request-line",
-      "unicode": "e730",
-      "unicode_decimal": 59184
-    },
-    {
-      "icon_id": "17103194",
-      "name": "git-pull-request-fill",
-      "font_class": "git-pull-request-fill",
-      "unicode": "e731",
-      "unicode_decimal": 59185
-    },
-    {
-      "icon_id": "17103337",
-      "name": "dashboard-3-fill",
-      "font_class": "dashboard-3-fill",
-      "unicode": "e73c",
-      "unicode_decimal": 59196
-    },
-    {
-      "icon_id": "17103338",
-      "name": "database-fill",
-      "font_class": "database-fill",
-      "unicode": "e73d",
-      "unicode_decimal": 59197
-    },
-    {
-      "icon_id": "17103339",
-      "name": "database-2-line",
-      "font_class": "database-2-line",
-      "unicode": "e73e",
-      "unicode_decimal": 59198
-    },
-    {
-      "icon_id": "17103340",
-      "name": "database-2-fill",
-      "font_class": "database-2-fill",
-      "unicode": "e73f",
-      "unicode_decimal": 59199
-    },
-    {
-      "icon_id": "17103341",
-      "name": "dashboard-3-line",
-      "font_class": "dashboard-3-line",
-      "unicode": "e740",
-      "unicode_decimal": 59200
-    },
-    {
-      "icon_id": "17103343",
-      "name": "database-line",
-      "font_class": "database-line",
-      "unicode": "e741",
-      "unicode_decimal": 59201
-    },
-    {
-      "icon_id": "17103381",
-      "name": "qr-code-line",
-      "font_class": "qr-code-line",
-      "unicode": "e747",
-      "unicode_decimal": 59207
-    },
-    {
-      "icon_id": "17103456",
-      "name": "wifi-line",
-      "font_class": "wifi-line",
-      "unicode": "e758",
-      "unicode_decimal": 59224
-    },
-    {
-      "icon_id": "17103457",
-      "name": "wifi-off-line",
-      "font_class": "wifi-off-line",
-      "unicode": "e759",
-      "unicode_decimal": 59225
-    },
-    {
-      "icon_id": "17103500",
-      "name": "draft-fill",
-      "font_class": "draft-fill",
-      "unicode": "e760",
-      "unicode_decimal": 59232
-    },
-    {
-      "icon_id": "17103502",
-      "name": "draft-line",
-      "font_class": "draft-line",
-      "unicode": "e761",
-      "unicode_decimal": 59233
-    },
-    {
-      "icon_id": "17103526",
-      "name": "file-excel-2-fill",
-      "font_class": "file-excel-2-fill",
-      "unicode": "e769",
-      "unicode_decimal": 59241
-    },
-    {
-      "icon_id": "17103549",
-      "name": "file-list-fill",
-      "font_class": "file-list-fill",
-      "unicode": "e76e",
-      "unicode_decimal": 59246
-    },
-    {
-      "icon_id": "17103551",
-      "name": "file-list-line",
-      "font_class": "file-list-line",
-      "unicode": "e76f",
-      "unicode_decimal": 59247
-    },
-    {
-      "icon_id": "17103561",
-      "name": "file-ppt-2-fill",
-      "font_class": "file-ppt-2-fill",
-      "unicode": "e772",
-      "unicode_decimal": 59250
-    },
-    {
-      "icon_id": "17103587",
-      "name": "file-word-2-fill",
-      "font_class": "file-word-2-fill",
-      "unicode": "e779",
-      "unicode_decimal": 59257
-    },
-    {
-      "icon_id": "17104191",
-      "name": "android-fill",
-      "font_class": "android-fill",
-      "unicode": "e7c7",
-      "unicode_decimal": 59335
-    },
-    {
-      "icon_id": "17104192",
-      "name": "apple-fill",
-      "font_class": "apple-fill",
-      "unicode": "e7c8",
-      "unicode_decimal": 59336
-    },
-    {
-      "icon_id": "17104302",
-      "name": "qq-fill",
-      "font_class": "qq-fill",
-      "unicode": "e7d9",
-      "unicode_decimal": 59353
-    },
-    {
-      "icon_id": "17104345",
-      "name": "vuejs-fill",
-      "font_class": "vuejs-fill",
-      "unicode": "e7e2",
-      "unicode_decimal": 59362
-    },
-    {
-      "icon_id": "17104362",
-      "name": "wechat-fill",
-      "font_class": "wechat-fill",
-      "unicode": "e7e3",
-      "unicode_decimal": 59363
-    },
-    {
-      "icon_id": "17104369",
-      "name": "windows-fill",
-      "font_class": "windows-fill",
-      "unicode": "e7e4",
-      "unicode_decimal": 59364
-    },
-    {
-      "icon_id": "17104471",
-      "name": "map-pin-line",
-      "font_class": "map-pin-line",
-      "unicode": "e7ef",
-      "unicode_decimal": 59375
-    },
-    {
-      "icon_id": "17104473",
-      "name": "map-pin-fill",
-      "font_class": "map-pin-fill",
-      "unicode": "e7f0",
-      "unicode_decimal": 59376
-    },
-    {
-      "icon_id": "17104481",
-      "name": "map-pin-add-line",
-      "font_class": "map-pin-add-line",
-      "unicode": "e7f1",
-      "unicode_decimal": 59377
-    },
-    {
-      "icon_id": "17104505",
-      "name": "road-map-fill",
-      "font_class": "road-map-fill",
-      "unicode": "e7f3",
-      "unicode_decimal": 59379
-    },
-    {
-      "icon_id": "17104509",
-      "name": "rocket-2-fill",
-      "font_class": "rocket-2-fill",
-      "unicode": "e7f4",
-      "unicode_decimal": 59380
-    },
-    {
-      "icon_id": "17104511",
-      "name": "rocket-2-line",
-      "font_class": "rocket-2-line",
-      "unicode": "e7f5",
-      "unicode_decimal": 59381
-    },
-    {
-      "icon_id": "17104513",
-      "name": "road-map-line",
-      "font_class": "road-map-line",
-      "unicode": "e7f6",
-      "unicode_decimal": 59382
-    },
-    {
-      "icon_id": "17104624",
-      "name": "image-add-line",
-      "font_class": "image-add-line",
-      "unicode": "e806",
-      "unicode_decimal": 59398
-    },
-    {
-      "icon_id": "17104625",
-      "name": "image-fill",
-      "font_class": "image-fill",
-      "unicode": "e807",
-      "unicode_decimal": 59399
-    },
-    {
-      "icon_id": "17104626",
-      "name": "image-edit-line",
-      "font_class": "image-edit-line",
-      "unicode": "e808",
-      "unicode_decimal": 59400
-    },
-    {
-      "icon_id": "17104627",
-      "name": "image-line",
-      "font_class": "image-line",
-      "unicode": "e809",
-      "unicode_decimal": 59401
-    },
-    {
-      "icon_id": "17104655",
-      "name": "notification-fill",
-      "font_class": "notification-fill",
-      "unicode": "e80c",
-      "unicode_decimal": 59404
-    },
-    {
-      "icon_id": "17104658",
-      "name": "notification-line",
-      "font_class": "notification-line",
-      "unicode": "e80d",
-      "unicode_decimal": 59405
-    },
-    {
-      "icon_id": "17104750",
-      "name": "vidicon-fill",
-      "font_class": "vidicon-fill",
-      "unicode": "e823",
-      "unicode_decimal": 59427
-    },
-    {
-      "icon_id": "17104751",
-      "name": "vidicon-line",
-      "font_class": "vidicon-line",
-      "unicode": "e824",
-      "unicode_decimal": 59428
-    },
-    {
-      "icon_id": "17104846",
-      "name": "t-shirt-line",
-      "font_class": "t-shirt-line",
-      "unicode": "e836",
-      "unicode_decimal": 59446
-    },
-    {
-      "icon_id": "17104847",
-      "name": "t-shirt-fill",
-      "font_class": "t-shirt-fill",
-      "unicode": "e837",
-      "unicode_decimal": 59447
-    },
-    {
-      "icon_id": "17104895",
-      "name": "apps-fill",
-      "font_class": "apps-fill",
-      "unicode": "e83c",
-      "unicode_decimal": 59452
-    },
-    {
-      "icon_id": "17104902",
-      "name": "apps-line",
-      "font_class": "apps-line",
-      "unicode": "e83d",
-      "unicode_decimal": 59453
-    },
-    {
-      "icon_id": "17104978",
-      "name": "delete-bin-6-line",
-      "font_class": "delete-bin-6-line",
-      "unicode": "e84f",
-      "unicode_decimal": 59471
-    },
-    {
-      "icon_id": "17104979",
-      "name": "delete-bin-6-fill",
-      "font_class": "delete-bin-6-fill",
-      "unicode": "e850",
-      "unicode_decimal": 59472
-    },
-    {
-      "icon_id": "17105012",
-      "name": "filter-line",
-      "font_class": "filter-line",
-      "unicode": "e858",
-      "unicode_decimal": 59480
-    },
-    {
-      "icon_id": "17105014",
-      "name": "filter-fill",
-      "font_class": "filter-fill",
-      "unicode": "e859",
-      "unicode_decimal": 59481
-    },
-    {
-      "icon_id": "17105015",
-      "name": "filter-off-fill",
-      "font_class": "filter-off-fill",
-      "unicode": "e85a",
-      "unicode_decimal": 59482
-    },
-    {
-      "icon_id": "17105016",
-      "name": "filter-off-line",
-      "font_class": "filter-off-line",
-      "unicode": "e85b",
-      "unicode_decimal": 59483
-    },
-    {
-      "icon_id": "17105020",
-      "name": "forbid-fill",
-      "font_class": "forbid-fill",
-      "unicode": "e85c",
-      "unicode_decimal": 59484
-    },
-    {
-      "icon_id": "17105022",
-      "name": "forbid-line",
-      "font_class": "forbid-line",
-      "unicode": "e85d",
-      "unicode_decimal": 59485
-    },
-    {
-      "icon_id": "17105026",
-      "name": "indeterminate-circle-fill",
-      "font_class": "indeterminate-circle-fill",
-      "unicode": "e85e",
-      "unicode_decimal": 59486
-    },
-    {
-      "icon_id": "17105027",
-      "name": "indeterminate-circle-line",
-      "font_class": "indeterminate-circle-line",
-      "unicode": "e85f",
-      "unicode_decimal": 59487
-    },
-    {
-      "icon_id": "17105028",
-      "name": "information-fill",
-      "font_class": "information-fill",
-      "unicode": "e860",
-      "unicode_decimal": 59488
-    },
-    {
-      "icon_id": "17105044",
-      "name": "information-line",
-      "font_class": "information-line",
-      "unicode": "e861",
-      "unicode_decimal": 59489
-    },
-    {
-      "icon_id": "17105120",
-      "name": "shield-check-fill",
-      "font_class": "shield-check-fill",
-      "unicode": "e875",
-      "unicode_decimal": 59509
-    },
-    {
-      "icon_id": "17105121",
-      "name": "shield-check-line",
-      "font_class": "shield-check-line",
-      "unicode": "e876",
-      "unicode_decimal": 59510
-    },
-    {
-      "icon_id": "17105125",
-      "name": "shield-flash-fill",
-      "font_class": "shield-flash-fill",
-      "unicode": "e877",
-      "unicode_decimal": 59511
-    },
-    {
-      "icon_id": "17105126",
-      "name": "shield-flash-line",
-      "font_class": "shield-flash-line",
-      "unicode": "e878",
-      "unicode_decimal": 59512
-    },
-    {
-      "icon_id": "17105127",
-      "name": "shield-keyhole-fill",
-      "font_class": "shield-keyhole-fill",
-      "unicode": "e879",
-      "unicode_decimal": 59513
-    },
-    {
-      "icon_id": "17105128",
-      "name": "shield-keyhole-line",
-      "font_class": "shield-keyhole-line",
-      "unicode": "e87a",
-      "unicode_decimal": 59514
-    },
-    {
-      "icon_id": "17105132",
-      "name": "shield-user-fill",
-      "font_class": "shield-user-fill",
-      "unicode": "e87b",
-      "unicode_decimal": 59515
-    },
-    {
-      "icon_id": "17105134",
-      "name": "shield-user-line",
-      "font_class": "shield-user-line",
-      "unicode": "e87c",
-      "unicode_decimal": 59516
-    },
-    {
-      "icon_id": "17105220",
-      "name": "contacts-fill",
-      "font_class": "contacts-fill",
-      "unicode": "e880",
-      "unicode_decimal": 59520
-    },
-    {
-      "icon_id": "17105222",
-      "name": "contacts-line",
-      "font_class": "contacts-line",
-      "unicode": "e881",
-      "unicode_decimal": 59521
-    },
-    {
-      "icon_id": "17105246",
-      "name": "group-fill",
-      "font_class": "group-fill",
-      "unicode": "e883",
-      "unicode_decimal": 59523
-    },
-    {
-      "icon_id": "17105252",
-      "name": "group-line",
-      "font_class": "group-line",
-      "unicode": "e884",
-      "unicode_decimal": 59524
-    },
-    {
-      "icon_id": "17105284",
-      "name": "user-fill",
-      "font_class": "user-fill",
-      "unicode": "e88b",
-      "unicode_decimal": 59531
-    },
-    {
-      "icon_id": "17105291",
-      "name": "user-line",
-      "font_class": "user-line",
-      "unicode": "e88c",
-      "unicode_decimal": 59532
-    },
-    {
-      "icon_id": "17105298",
-      "name": "user-search-fill",
-      "font_class": "user-search-fill",
-      "unicode": "e88e",
-      "unicode_decimal": 59534
-    },
-    {
-      "icon_id": "17105299",
-      "name": "user-search-line",
-      "font_class": "user-search-line",
-      "unicode": "e88f",
-      "unicode_decimal": 59535
-    },
-    {
-      "icon_id": "17105302",
-      "name": "user-settings-line",
-      "font_class": "user-settings-line",
-      "unicode": "e890",
-      "unicode_decimal": 59536
-    },
-    {
-      "icon_id": "17105309",
-      "name": "user-star-line",
-      "font_class": "user-star-line",
-      "unicode": "e891",
-      "unicode_decimal": 59537
-    },
-    {
-      "icon_id": "17102554",
-      "name": "building-fill",
-      "font_class": "building-fill",
-      "unicode": "e6b1",
-      "unicode_decimal": 59057
-    },
-    {
-      "icon_id": "17102557",
-      "name": "building-line",
-      "font_class": "building-line",
-      "unicode": "e6b2",
-      "unicode_decimal": 59058
-    },
-    {
-      "icon_id": "17102563",
-      "name": "home-3-line",
-      "font_class": "home-3-line",
-      "unicode": "e6b3",
-      "unicode_decimal": 59059
-    },
-    {
-      "icon_id": "17102566",
-      "name": "home-3-fill",
-      "font_class": "home-3-fill",
-      "unicode": "e6b4",
-      "unicode_decimal": 59060
-    },
-    {
-      "icon_id": "17102918",
-      "name": "chat-check-fill",
-      "font_class": "chat-check-fill",
-      "unicode": "e6f2",
-      "unicode_decimal": 59122
-    },
-    {
-      "icon_id": "17102919",
-      "name": "chat-check-line",
-      "font_class": "chat-check-line",
-      "unicode": "e6f3",
-      "unicode_decimal": 59123
-    },
-    {
-      "icon_id": "17102944",
-      "name": "chat-smile-line",
-      "font_class": "chat-smile-line",
-      "unicode": "e6f9",
-      "unicode_decimal": 59129
-    },
-    {
-      "icon_id": "17102945",
-      "name": "chat-smile-fill",
-      "font_class": "chat-smile-fill",
-      "unicode": "e6fa",
-      "unicode_decimal": 59130
-    },
-    {
-      "icon_id": "17102954",
-      "name": "feedback-fill",
-      "font_class": "feedback-fill",
-      "unicode": "e6fb",
-      "unicode_decimal": 59131
-    },
-    {
-      "icon_id": "17102955",
-      "name": "message-3-fill",
-      "font_class": "message-3-fill",
-      "unicode": "e6fc",
-      "unicode_decimal": 59132
-    },
-    {
-      "icon_id": "17102956",
-      "name": "message-2-fill",
-      "font_class": "message-2-fill",
-      "unicode": "e6fd",
-      "unicode_decimal": 59133
-    },
-    {
-      "icon_id": "17102958",
-      "name": "message-2-line",
-      "font_class": "message-2-line",
-      "unicode": "e6fe",
-      "unicode_decimal": 59134
-    },
-    {
-      "icon_id": "17102959",
-      "name": "message-3-line",
-      "font_class": "message-3-line",
-      "unicode": "e6ff",
-      "unicode_decimal": 59135
-    },
-    {
-      "icon_id": "17102961",
-      "name": "feedback-line",
-      "font_class": "feedback-line",
-      "unicode": "e700",
-      "unicode_decimal": 59136
-    },
-    {
-      "icon_id": "17103037",
-      "name": "edit-box-fill",
-      "font_class": "edit-box-fill",
-      "unicode": "e70b",
-      "unicode_decimal": 59147
-    },
-    {
-      "icon_id": "17103038",
-      "name": "edit-box-line",
-      "font_class": "edit-box-line",
-      "unicode": "e70c",
-      "unicode_decimal": 59148
-    },
-    {
-      "icon_id": "17103077",
-      "name": "layout-fill",
-      "font_class": "layout-fill",
-      "unicode": "e715",
-      "unicode_decimal": 59157
-    }
-  ]
-}
diff --git a/src/assets/font/scicon/iconfont.ttf b/src/assets/font/scicon/iconfont.ttf
deleted file mode 100644
index 7030957e..00000000
Binary files a/src/assets/font/scicon/iconfont.ttf and /dev/null differ
diff --git a/src/assets/font/scicon/iconfont.woff b/src/assets/font/scicon/iconfont.woff
deleted file mode 100644
index 194eb47c..00000000
Binary files a/src/assets/font/scicon/iconfont.woff and /dev/null differ
diff --git a/src/assets/font/scicon/iconfont.woff2 b/src/assets/font/scicon/iconfont.woff2
deleted file mode 100644
index 3e51999a..00000000
Binary files a/src/assets/font/scicon/iconfont.woff2 and /dev/null differ
diff --git a/src/assets/icons/BugFill.vue b/src/assets/icons/BugFill.vue
new file mode 100644
index 00000000..8f2b2b25
--- /dev/null
+++ b/src/assets/icons/BugFill.vue
@@ -0,0 +1,3 @@
+<template>
+	<svg t="1637035568487" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="26146" width="200" height="200"><path d="M258.389333 354.133333a299.093333 299.093333 0 0 1 8.490667-12.8h490.24c2.944 4.181333 5.76 8.490667 8.490667 12.8l86.186666-49.749333 42.666667 73.898667-94.421333 54.528c6.912 25.173333 10.624 51.754667 10.624 79.189333v42.666667h128v85.333333h-128a296.96 296.96 0 0 1-22.869334 114.773333l106.666667 61.610667-42.666667 73.898667-107.776-62.208A298.325333 298.325333 0 0 1 554.666667 935.637333V597.333333h-85.333334v338.346667a298.325333 298.325333 0 0 1-189.354666-107.605333l-107.776 62.208-42.666667-73.898667 106.666667-61.568A297.770667 297.770667 0 0 1 213.333333 640H85.333333v-85.333333h128v-42.666667c0-27.434667 3.712-53.973333 10.624-79.189333L129.536 378.282667l42.666667-73.898667L258.389333 354.133333zM341.333333 256a170.666667 170.666667 0 1 1 341.333334 0H341.333333z" p-id="26147"></path></svg>
+</template>
diff --git a/src/assets/icons/BugLine.vue b/src/assets/icons/BugLine.vue
new file mode 100644
index 00000000..a8fac628
--- /dev/null
+++ b/src/assets/icons/BugLine.vue
@@ -0,0 +1,3 @@
+<template>
+	<svg t="1637035533040" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25872" width="200" height="200"><path d="M554.666667 849.066667a213.418667 213.418667 0 0 0 170.666666-209.066667v-128a212.48 212.48 0 0 0-17.706666-85.333333h-391.253334A212.48 212.48 0 0 0 298.666667 512v128a213.418667 213.418667 0 0 0 170.666666 209.066667V597.333333h85.333334v251.733334z m-318.464-94.293334A297.770667 297.770667 0 0 1 213.333333 640H85.333333v-85.333333h128v-42.666667c0-27.434667 3.712-53.973333 10.624-79.189333L129.536 378.282667l42.666667-73.898667L258.389333 354.133333a299.093333 299.093333 0 0 1 8.490667-12.8h490.24c2.944 4.181333 5.76 8.490667 8.490667 12.8l86.186666-49.749333 42.666667 73.898667-94.421333 54.528c6.912 25.173333 10.624 51.754667 10.624 79.189333v42.666667h128v85.333333h-128a296.96 296.96 0 0 1-22.869334 114.773333l106.666667 61.610667-42.666667 73.898667-107.776-62.208A298.069333 298.069333 0 0 1 512 938.666667a298.069333 298.069333 0 0 1-232.021333-110.592l-107.776 62.208-42.666667-73.898667 106.666667-61.568zM341.333333 256a170.666667 170.666667 0 1 1 341.333334 0H341.333333z" p-id="25873"></path></svg>
+</template>
diff --git a/src/assets/icons/Code.vue b/src/assets/icons/Code.vue
new file mode 100644
index 00000000..51aeff95
--- /dev/null
+++ b/src/assets/icons/Code.vue
@@ -0,0 +1,3 @@
+<template>
+	<svg t="1637029965066" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4502" width="200" height="200"><path d="M981.333333 512l-301.696 301.696-60.330666-60.330667L860.672 512l-241.365333-241.365333 60.330666-60.330667L981.333333 512zM163.328 512l241.365333 241.365333-60.330666 60.330667L42.666667 512l301.696-301.696 60.330666 60.330667L163.328 512z" p-id="4503"></path></svg>
+</template>
\ No newline at end of file
diff --git a/src/assets/icons/FileExcel.vue b/src/assets/icons/FileExcel.vue
new file mode 100644
index 00000000..a0aedc05
--- /dev/null
+++ b/src/assets/icons/FileExcel.vue
@@ -0,0 +1,3 @@
+<template>
+	<svg t="1637036788756" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3793" width="200" height="200"><path d="M121.984 122.752l536.32-76.586667a21.333333 21.333333 0 0 1 24.362667 21.12v889.429334a21.333333 21.333333 0 0 1-24.32 21.12L121.941333 901.248a42.666667 42.666667 0 0 1-36.650666-42.24V164.992a42.666667 42.666667 0 0 1 36.650666-42.24zM725.333333 128h170.666667a42.666667 42.666667 0 0 1 42.666667 42.666667v682.666666a42.666667 42.666667 0 0 1-42.666667 42.666667h-170.666667V128z m-290.133333 384L554.666667 341.333333h-102.4L384 438.869333 315.733333 341.333333H213.333333l119.466667 170.666667L213.333333 682.666667h102.4L384 585.130667 452.266667 682.666667H554.666667l-119.466667-170.666667z" p-id="3794"></path></svg>
+</template>
\ No newline at end of file
diff --git a/src/assets/icons/FilePpt.vue b/src/assets/icons/FilePpt.vue
new file mode 100644
index 00000000..90ef7e83
--- /dev/null
+++ b/src/assets/icons/FilePpt.vue
@@ -0,0 +1,3 @@
+<template>
+	<svg t="1637036833058" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3924" width="200" height="200"><path d="M725.333333 128h170.666667a42.666667 42.666667 0 0 1 42.666667 42.666667v682.666666a42.666667 42.666667 0 0 1-42.666667 42.666667h-170.666667V128zM121.984 122.752l536.32-76.586667a21.333333 21.333333 0 0 1 24.362667 21.12v889.429334a21.333333 21.333333 0 0 1-24.32 21.12L121.941333 901.248a42.666667 42.666667 0 0 1-36.650666-42.24V164.992a42.666667 42.666667 0 0 1 36.650666-42.24zM213.333333 341.333333v341.333334h85.333334v-85.333334h256V341.333333H213.333333z m85.333334 85.333334h170.666666v85.333333H298.666667v-85.333333z" p-id="3925"></path></svg>
+</template>
\ No newline at end of file
diff --git a/src/assets/icons/FileWord.vue b/src/assets/icons/FileWord.vue
new file mode 100644
index 00000000..c438afe3
--- /dev/null
+++ b/src/assets/icons/FileWord.vue
@@ -0,0 +1,3 @@
+<template>
+	<svg t="1637036713041" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3662" width="200" height="200"><path d="M725.333333 128h170.666667a42.666667 42.666667 0 0 1 42.666667 42.666667v682.666666a42.666667 42.666667 0 0 1-42.666667 42.666667h-170.666667V128zM121.984 122.752l536.32-76.586667a21.333333 21.333333 0 0 1 24.362667 21.12v889.429334a21.333333 21.333333 0 0 1-24.32 21.12L121.941333 901.248a42.666667 42.666667 0 0 1-36.650666-42.24V164.992a42.666667 42.666667 0 0 1 36.650666-42.24zM469.333333 341.333333v212.864L384 469.333333l-84.906667 85.333334L298.666667 341.333333H213.333333v341.333334h85.333334l85.333333-85.333334 85.333333 85.333334h85.333334V341.333333h-85.333334z" p-id="3663"></path></svg>
+</template>
\ No newline at end of file
diff --git a/src/assets/icons/Vue.vue b/src/assets/icons/Vue.vue
new file mode 100644
index 00000000..3f36dd1c
--- /dev/null
+++ b/src/assets/icons/Vue.vue
@@ -0,0 +1,3 @@
+<template>
+	<svg t="1637029992998" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4633" width="200" height="200"><path d="M42.666667 128h170.666666l298.666667 512 298.666667-512h170.666666L512 938.666667 42.666667 128z m369.792 0L512 298.666667l99.541333-170.666667h172.16L512 597.333333 240.298667 128h172.16z" p-id="4634"></path></svg>
+</template>
\ No newline at end of file
diff --git a/src/assets/icons/Wechat.vue b/src/assets/icons/Wechat.vue
new file mode 100644
index 00000000..445e5276
--- /dev/null
+++ b/src/assets/icons/Wechat.vue
@@ -0,0 +1,3 @@
+<template>
+	<svg t="1637029542482" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4371" width="200" height="200"><path d="M792.490667 585.002667a38.826667 38.826667 0 0 0 38.314666-38.314667c0-21.248-17.024-38.314667-38.314666-38.314667s-38.314667 17.066667-38.314667 38.314667c0 21.333333 17.066667 38.314667 38.314667 38.314667z m-188.8 0a38.826667 38.826667 0 0 0 38.314666-38.314667c0-21.248-17.066667-38.314667-38.314666-38.314667-21.333333 0-38.314667 17.066667-38.314667 38.314667 0 21.333333 17.024 38.314667 38.314667 38.314667z m280.192 215.04a14.805333 14.805333 0 0 0-7.338667 15.786666c0 2.048 0 4.138667 1.066667 6.272 4.181333 17.792 12.544 46.122667 12.544 47.189334 0 3.114667 1.066667 5.205333 1.066666 7.338666a9.386667 9.386667 0 0 1-9.429333 9.386667c-2.133333 0-3.157333-1.024-5.248-2.048l-61.824-35.669333a34.090667 34.090667 0 0 0-14.677333-4.181334c-3.114667 0-6.272 0-8.362667 1.024-29.354667 8.405333-59.733333 12.586667-92.202667 12.586667-156.16 0-281.898667-104.832-281.898666-234.88 0-130.005333 125.738667-234.88 281.898666-234.88 156.117333 0 281.856 104.874667 281.856 234.88 0 70.272-37.717333 134.229333-97.450666 177.237333zM711.381333 345.557333a388.48 388.48 0 0 0-11.946666-0.213333c-178.090667 0-324.522667 122.026667-324.522667 277.546667 0 23.637333 3.413333 46.506667 9.728 68.266666h-3.797333a425.088 425.088 0 0 1-110.250667-15.701333c-3.157333-1.066667-6.314667-1.066667-9.472-1.066667a35.498667 35.498667 0 0 0-17.834667 5.248l-74.581333 42.88c-2.133333 1.066667-4.224 2.133333-6.314667 2.133334a11.648 11.648 0 0 1-11.52-11.52c0-3.157333 1.024-5.248 2.090667-8.405334 1.024-1.024 10.496-35.584 15.744-56.490666 0-2.133333 1.024-5.248 1.024-7.338667a23.722667 23.722667 0 0 0-9.429333-18.858667C87.808 570.709333 42.666667 494.336 42.666667 409.514667 42.666667 253.653333 194.986667 128 381.866667 128c160.64 0 295.68 92.544 329.514666 217.514667z m-219.904 17.834667c24.448 0 43.776-20.352 43.776-43.776 0-24.448-19.328-43.776-43.776-43.776s-43.776 19.328-43.776 43.776 19.328 43.776 43.776 43.776z m-224.426666 0c24.448 0 43.818667-20.352 43.818666-43.776 0-24.448-19.370667-43.776-43.818666-43.776-24.405333 0-43.776 19.328-43.776 43.776s19.370667 43.776 43.776 43.776z" p-id="4372"></path></svg>
+</template>
\ No newline at end of file
diff --git a/src/assets/icons/index.js b/src/assets/icons/index.js
new file mode 100644
index 00000000..c5139c16
--- /dev/null
+++ b/src/assets/icons/index.js
@@ -0,0 +1,8 @@
+export { default as Vue } from './Vue.vue'
+export { default as Code } from './Code.vue'
+export { default as Wechat } from './Wechat.vue'
+export { default as BugFill } from './BugFill.vue'
+export { default as BugLine } from './BugLine.vue'
+export { default as FileWord } from './FileWord.vue'
+export { default as FileExcel } from './FileExcel.vue'
+export { default as FilePpt } from './FilePpt.vue'
\ No newline at end of file
diff --git a/src/components/scContextmenu/item.vue b/src/components/scContextmenu/item.vue
index 51d377dc..51e2ef5f 100644
--- a/src/components/scContextmenu/item.vue
+++ b/src/components/scContextmenu/item.vue
@@ -11,7 +11,7 @@
 	<hr v-if="divided">
 	<li :class="disabled?'disabled':''" @click.stop="liClick" @mouseenter="openSubmenu($event)" @mouseleave="closeSubmenu($event)">
 		<span class="title">
-			<i :class="['sc-contextmenu__icon', icon]"></i>
+			<el-icon class="sc-contextmenu__icon"><component :is="icon" /></el-icon>
 			{{title}}
 		</span>
 		<span class="sc-contextmenu__suffix">
diff --git a/src/components/scDialog/index.vue b/src/components/scDialog/index.vue
index cc915892..8713fd32 100644
--- a/src/components/scDialog/index.vue
+++ b/src/components/scDialog/index.vue
@@ -16,11 +16,11 @@
 			</slot>
 			<div class="sc-dialog__headerbtn">
 				<button v-if="showFullscreen" aria-label="fullscreen" type="button" @click="setFullscreen">
-					<i v-if="isFullscreen" class="el-dialog__close el-icon-bottom-left"></i>
-					<i v-else class="el-dialog__close el-icon el-icon-full-screen"></i>
+					<el-icon v-if="isFullscreen" class="el-dialog__close"><el-icon-bottom-left /></el-icon>
+					<el-icon v-else class="el-dialog__close"><el-icon-full-screen /></el-icon>
 				</button>
 				<button v-if="showClose" aria-label="close" type="button" @click="closeDialog">
-					<i class="el-dialog__close el-icon el-icon-close"></i>
+					<el-icon class="el-dialog__close"><el-icon-close /></el-icon>
 				</button>
 			</div>
 		</template>
diff --git a/src/components/scFileSelect/index.vue b/src/components/scFileSelect/index.vue
index 10c000b1..224baed9 100644
--- a/src/components/scFileSelect/index.vue
+++ b/src/components/scFileSelect/index.vue
@@ -14,7 +14,7 @@
 				<el-tree ref="group" class="menu" :data="menu" :node-key="treeProps.key" :props="treeProps" :current-node-key="menu.length>0?menu[0][treeProps.key]:''" highlight-current @node-click="groupClick">
 					<template #default="{ node }">
 						<span class="el-tree-node__label">
-							<i class="el-icon-folder icon"></i>{{node.label}}
+							<el-icon class="icon"><el-icon-folder /></el-icon>{{node.label}}
 						</span>
 					</template>
 				</el-tree>
@@ -27,9 +27,9 @@
 			<div class="sc-file-select__top">
 				<div class="upload" v-if="!hideUpload">
 					<el-upload class="sc-file-select__upload" action="" multiple :show-file-list="false" :accept="accept" :on-change="uploadChange" :before-upload="uploadBefore" :on-progress="uploadProcess" :on-success="uploadSuccess" :on-error="uploadError" :http-request="uploadRequest">
-						<el-button type="primary" icon="el-icon-upload2">本地上传</el-button>
+						<el-button type="primary" icon="el-icon-upload">本地上传</el-button>
 					</el-upload>
-					<span class="tips"><i class="el-icon-warning-outline"></i>大小不超过{{maxSize}}MB</span>
+					<span class="tips"><el-icon><el-icon-warning /></el-icon>大小不超过{{maxSize}}MB</span>
 				</div>
 				<div class="keyword">
 					<el-input v-model="keyword" prefix-icon="el-icon-search" placeholder="文件名搜索" clearable @keyup.enter="search" @clear="search"></el-input>
@@ -50,10 +50,10 @@
 					<div v-for="item in data" :key="item[fileProps.key]" class="sc-file-select__item" :class="{active: value.includes(item[fileProps.url]) }" @click="select(item)">
 						<div class="sc-file-select__item__file">
 							<div class="sc-file-select__item__checkbox" v-if="multiple">
-								<i class="el-icon-check"></i>
+								<el-icon><el-icon-check /></el-icon>
 							</div>
 							<div class="sc-file-select__item__select" v-else>
-								<i class="el-icon-check"></i>
+								<el-icon><el-icon-check /></el-icon>
 							</div>
 							<div class="sc-file-select__item__box"></div>
 							<el-image v-if="_isImg(item[fileProps.url])" :src="item[fileProps.url]" fit="contain" lazy></el-image>
@@ -276,7 +276,7 @@
 	.sc-file-select__top {margin-bottom: 15px;display: flex;justify-content: space-between;}
 	.sc-file-select__upload {display: inline-block;}
 	.sc-file-select__top .tips {font-size: 12px;margin-left: 10px;color: #999;}
-	.sc-file-select__top .tips i {font-size: 14px;margin-right: 5px;}
+	.sc-file-select__top .tips i {font-size: 14px;margin-right: 5px;position: relative;bottom: -0.125em;}
 	.sc-file-select__pagination {margin:15px 0;}
 
 	.sc-file-select__do {text-align: right;}
diff --git a/src/components/scFilterBar/index.vue b/src/components/scFilterBar/index.vue
index 6b429185..9a94fa11 100644
--- a/src/components/scFilterBar/index.vue
+++ b/src/components/scFilterBar/index.vue
@@ -11,7 +11,7 @@
 	<div class="sc-filterBar">
 		<slot :filterLength="filterObjLength" :openFilter="openFilter">
 			<el-badge :value="filterObjLength" type="danger" :hidden="filterObjLength<=0">
-				<el-button size="small" icon="sc-icon-filter-fill" @click="openFilter"></el-button>
+				<el-button size="small" icon="el-icon-filter" @click="openFilter"></el-button>
 			</el-badge>
 		</slot>
 
@@ -72,7 +72,7 @@
 												<el-select v-if="item.field.type=='tags'" v-model="item.value" multiple filterable allow-create default-first-option no-data-text="输入关键词后按回车确认" :placeholder="item.field.placeholder||'请输入'"></el-select>
 											</td>
 											<td>
-												<i class="el-icon-delete del" @click="delFilter(index)"></i>
+												<el-icon class="del" @click="delFilter(index)"><el-icon-delete /></el-icon>
 											</td>
 										</tr>
 									</table>
diff --git a/src/components/scFilterBar/my.vue b/src/components/scFilterBar/my.vue
index 3a3b425b..15a52c1f 100644
--- a/src/components/scFilterBar/my.vue
+++ b/src/components/scFilterBar/my.vue
@@ -25,7 +25,7 @@
 					<label>{{item.title}}</label>
 					<el-popconfirm title="确认删除此常用过滤吗？" @confirm="closeMyfilter(item, index)">
 						<template #reference>
-							<i class="el-icon-delete del" @click.stop="()=>{}"></i>
+							<el-icon class="del" @click.stop="()=>{}"><el-icon-delete /></el-icon>
 						</template>
 					</el-popconfirm>
 				</li>
diff --git a/src/components/scForm/index.vue b/src/components/scForm/index.vue
index 7ff44c22..146acdf9 100644
--- a/src/components/scForm/index.vue
+++ b/src/components/scForm/index.vue
@@ -19,7 +19,7 @@
 						<template #label>
 							{{item.label}}
 							<el-tooltip v-if="item.tips" :content="item.tips">
-								<i class="el-icon-question"></i>
+								<el-icon><el-icon-question-filled /></el-icon>
 							</el-tooltip>
 						</template>
 						<!-- input -->
diff --git a/src/components/scFormTable/index.vue b/src/components/scFormTable/index.vue
index dabb9c50..e72c7b74 100644
--- a/src/components/scFormTable/index.vue
+++ b/src/components/scFormTable/index.vue
@@ -14,7 +14,7 @@
 			</el-table-column>
 			<el-table-column label="" width="51" v-if="dragSort">
 				<template #default>
-					<el-tag class="move" style="cursor: move;"><i class="el-icon-d-caret"></i></el-tag>
+					<el-tag class="move" style="cursor: move;"><el-icon-d-caret style="width: 1em; height: 1em;"/></el-tag>
 				</template>
 			</el-table-column>
 			<slot></slot>
diff --git a/src/components/scIconSelect/el.json b/src/components/scIconSelect/el.json
deleted file mode 100644
index 873aefb4..00000000
--- a/src/components/scIconSelect/el.json
+++ /dev/null
@@ -1 +0,0 @@
-["platform-eleme","eleme","delete-solid","delete","s-tools","setting","user-solid","user","phone","phone-outline","more","more-outline","star-on","star-off","s-goods","goods","warning","warning-outline","question","info","remove","circle-plus","success","error","zoom-in","zoom-out","remove-outline","circle-plus-outline","circle-check","circle-close","s-help","help","minus","plus","check","close","picture","picture-outline","picture-outline-round","upload","upload2","download","camera-solid","camera","video-camera-solid","video-camera","message-solid","bell","s-cooperation","s-order","s-platform","s-fold","s-unfold","s-operation","s-promotion","s-home","s-release","s-ticket","s-management","s-open","s-shop","s-marketing","s-flag","s-comment","s-finance","s-claim","s-custom","s-opportunity","s-data","s-check","s-grid","menu","share","d-caret","caret-left","caret-right","caret-bottom","caret-top","bottom-left","bottom-right","back","right","bottom","top","top-left","top-right","arrow-left","arrow-right","arrow-down","arrow-up","d-arrow-left","d-arrow-right","video-pause","video-play","refresh","refresh-right","refresh-left","finished","sort","sort-up","sort-down","rank","loading","view","c-scale-to-original","date","edit","edit-outline","folder","folder-opened","folder-add","folder-remove","folder-delete","folder-checked","tickets","document-remove","document-delete","document-copy","document-checked","document","document-add","printer","paperclip","takeaway-box","search","monitor","attract","mobile","scissors","umbrella","headset","brush","mouse","coordinate","magic-stick","reading","data-line","data-board","pie-chart","data-analysis","collection-tag","film","suitcase","suitcase-1","receiving","collection","files","notebook-1","notebook-2","toilet-paper","office-building","school","table-lamp","house","no-smoking","smoking","shopping-cart-full","shopping-cart-1","shopping-cart-2","shopping-bag-1","shopping-bag-2","sold-out","sell","present","box","bank-card","money","coin","wallet","discount","price-tag","news","guide","male","female","thumb","cpu","link","connection","open","turn-off","set-up","chat-round","chat-line-round","chat-square","chat-dot-round","chat-dot-square","chat-line-square","message","postcard","position","turn-off-microphone","microphone","close-notification","bangzhu","time","odometer","crop","aim","switch-button","full-screen","copy-document","mic","stopwatch","medal-1","medal","trophy","trophy-1","first-aid-kit","discover","place","location","location-outline","location-information","add-location","delete-location","map-location","alarm-clock","timer","watch-1","watch","lock","unlock","key","service","mobile-phone","bicycle","truck","ship","basketball","football","soccer","baseball","wind-power","light-rain","lightning","heavy-rain","sunrise","sunrise-1","sunset","sunny","cloudy","partly-cloudy","cloudy-and-sunny","moon","moon-night","dish","dish-1","food","chicken","fork-spoon","knife-fork","burger","tableware","sugar","dessert","ice-cream","hot-water","water-cup","coffee-cup","cold-drink","goblet","goblet-full","goblet-square","goblet-square-full","refrigerator","grape","watermelon","cherry","apple","pear","orange","coffee","ice-tea","ice-drink","milk-tea","potato-strips","lollipop","ice-cream-square","ice-cream-round"]
diff --git a/src/components/scIconSelect/index.vue b/src/components/scIconSelect/index.vue
index c19c6be3..4a031f54 100644
--- a/src/components/scIconSelect/index.vue
+++ b/src/components/scIconSelect/index.vue
@@ -1,16 +1,16 @@
 <!--
  * @Descripttion: 图标选择器组件
- * @version: 1.1
+ * @version: 1.2
  * @Author: sakuya
  * @Date: 2021年7月27日10:02:46
  * @LastEditors: sakuya
- * @LastEditTime: 2021年8月26日13:59:51
+ * @LastEditTime: 2021年11月16日09:35:34
 -->
 
 <template>
 	<div class="sc-icon-select">
 		<el-input v-model="defaultValue" :prefix-icon="defaultValue||'none'" :placeholder="placeholder" :clearable="clearable" :disabled="disabled">
-			<template #append><el-button icon="el-icon-more" @click="open"></el-button></template>
+			<template #append><el-button icon="el-icon-more-filled" @click="open"></el-button></template>
 		</el-input>
 		<el-dialog title="图标选择器" v-model="dialogVisible" :width="780" destroy-on-close>
 			<el-tabs style="margin-top: -30px;">
@@ -22,7 +22,8 @@
 						<el-scrollbar>
 							<ul @click="selectIcon">
 								<li v-for="icon in item.icons" :key="icon">
-									<i :class="item.namespace + icon"></i>
+									<span :data-icon="icon"></span>
+									<el-icon><component :is="icon" /></el-icon>
 								</li>
 							</ul>
 						</el-scrollbar>
@@ -34,9 +35,7 @@
 </template>
 
 <script>
-	//获取elementPlus所有图标 https://github.com/element-plus/element-plus/blob/dev/website/icon.json
 	import config from "@/config/iconSelect"
-	import elicon from './el.json'
 
 	export default {
 		props: {
@@ -49,13 +48,7 @@
 			return {
 				defaultValue: '',
 				dialogVisible: false,
-				data: [
-					{
-						name: '默认',
-						namespace: 'el-icon-',
-						icons: elicon
-					}
-				]
+				data: []
 			}
 		},
 		watch:{
@@ -78,10 +71,10 @@
 				this.dialogVisible = true
 			},
 			selectIcon(e){
-				if(e.target.tagName != 'I'){
+				if(e.target.tagName != 'SPAN'){
 					return false
 				}
-				this.defaultValue = e.target.className
+				this.defaultValue = e.target.dataset.icon
 				this.dialogVisible = false
 				this.$emit('update:modelValue', this.defaultValue);
 			}
@@ -93,8 +86,9 @@
 	.sc-icon-select {display: inline-block;}
 	.sc-icon-select__list {height:360px;overflow: auto;}
 	.sc-icon-select__list ul {}
-	.sc-icon-select__list li {display: inline-block;width:80px;height:80px;margin:5px;vertical-align: top;box-shadow: 0 0 0 1px #eee;transition: all 0.1s;border-radius: 4px;}
-	.sc-icon-select__list li i {display: inline-block;width: 100%;height:100%;font-size: 26px;color: #6d7882;background: #fff;display: flex;justify-content: center;align-items: center;cursor: pointer;border-radius: 4px;}
+	.sc-icon-select__list li {display: inline-block;width:80px;height:80px;margin:5px;vertical-align: top;box-shadow: 0 0 0 1px #eee;transition: all 0.1s;border-radius: 4px;position: relative;}
+	.sc-icon-select__list li span {position: absolute;top:0;left:0;right:0;bottom:0;z-index: 1;cursor: pointer;}
+	.sc-icon-select__list li i {display: inline-block;width: 100%;height:100%;font-size: 26px;color: #6d7882;background: #fff;display: flex;justify-content: center;align-items: center;border-radius: 4px;}
 	.sc-icon-select__list li:hover {box-shadow: 0 0 1px 4px rgba(64,158,255,1);}
 	.sc-icon-select__list li:hover i {color: #409EFF;}
 </style>
diff --git a/src/components/scMini/scTrend.vue b/src/components/scMini/scTrend.vue
index 6ffdcdab..77c8e522 100644
--- a/src/components/scMini/scTrend.vue
+++ b/src/components/scMini/scTrend.vue
@@ -9,9 +9,9 @@
 
 <template>
 	<span class="sc-trend" :class="'sc-trend--'+type">
-		<i v-if="type=='P'" class="sc-trend-icon el-icon-top"></i>
-		<i v-if="type=='N'" class="sc-trend-icon el-icon-bottom"></i>
-		<i v-if="type=='Z'" class="sc-trend-icon el-icon-right"></i>
+		<el-icon v-if="type=='P'" class="sc-trend-icon"><el-icon-top /></el-icon>
+		<el-icon v-if="type=='N'" class="sc-trend-icon"><el-icon-bottom /></el-icon>
+		<el-icon v-if="type=='Z'" class="sc-trend-icon"><el-icon-right /></el-icon>
 		<em class="sc-trend-prefix">{{prefix}}</em>
 		<em class="sc-trend-value">{{absValue}}</em>
 		<em class="sc-trend-suffix">{{suffix}}</em>
@@ -45,7 +45,7 @@
 </script>
 
 <style scoped>
-	.sc-trend {}
+	.sc-trend {display: flex;align-items: center;}
 	.sc-trend-icon {margin-right: 2px;}
 	.sc-trend em {font-style: normal;}
 	.sc-trend-prefix {margin-right: 2px;}
diff --git a/src/components/scPageHeader/index.vue b/src/components/scPageHeader/index.vue
index fbf285a5..9ca2d356 100644
--- a/src/components/scPageHeader/index.vue
+++ b/src/components/scPageHeader/index.vue
@@ -11,7 +11,7 @@
 	<div class="sc-page-header">
 		<div v-if="icon" class="sc-page-header__icon">
 			<span>
-				<i :class="icon"></i>
+				<el-icon><component :is="icon" /></el-icon>
 			</span>
 		</div>
 		<div class="sc-page-header__title">
diff --git a/src/components/scSelect/index.vue b/src/components/scSelect/index.vue
index 7afdeae1..f1ce708b 100644
--- a/src/components/scSelect/index.vue
+++ b/src/components/scSelect/index.vue
@@ -10,7 +10,7 @@
 <template>
 	<div class="sc-select">
 		<div v-if="initloading" class="sc-select-loading">
-			<i class="el-icon-loading"></i>
+			<el-icon class="is-loading"><el-icon-loading /></el-icon>
 		</div>
 		<el-select v-bind="$attrs" :loading="loading" @visible-change="visibleChange">
 			<el-option v-for="item in options" :key="item[props.value]" :label="item[props.label]" :value="item[props.value]">
diff --git a/src/components/scStatistic/index.vue b/src/components/scStatistic/index.vue
index 0f36d59a..c87af9b9 100644
--- a/src/components/scStatistic/index.vue
+++ b/src/components/scStatistic/index.vue
@@ -17,7 +17,7 @@
 						{{ tips }}
 					</div>
 				</template>
-				<i class="el-icon-question sc-statistic-tips"></i>
+				<el-icon class="sc-statistic-tips"><el-icon-question-filled/></el-icon>
 			</el-tooltip>
 		</div>
 		<div class="sc-statistic-content">
@@ -58,7 +58,7 @@
 </script>
 
 <style scoped>
-	.sc-statistic-title {font-size: 12px;color: #999;margin-bottom: 10px;}
+	.sc-statistic-title {font-size: 12px;color: #999;margin-bottom: 10px;display: flex;align-items: center;}
 	.sc-statistic-tips {margin-left: 5px;}
 	.sc-statistic-content {font-size: 20px;color: #333;}
 	.sc-statistic-content-value {font-weight: bold;}
diff --git a/src/components/scTable/columnSetting.vue b/src/components/scTable/columnSetting.vue
index fa289eaa..2450e80c 100644
--- a/src/components/scTable/columnSetting.vue
+++ b/src/components/scTable/columnSetting.vue
@@ -12,7 +12,7 @@
 			<ul>
 				<li v-for="item in usercolumn" :key="item.prop">
 					<span class="move_b">
-						<el-tag class="move" style="cursor: move;"><i class="el-icon-d-caret"></i></el-tag>
+						<el-tag class="move" style="cursor: move;"><el-icon-d-caret style="width: 1em; height: 1em;"/></el-tag>
 					</span>
 					<span class="show_b">
 						<el-switch v-model="item.hide" :active-value="false" :inactive-value="true"></el-switch>
diff --git a/src/components/scUpload/index.vue b/src/components/scUpload/index.vue
index 422f3a3d..1d86a47b 100644
--- a/src/components/scUpload/index.vue
+++ b/src/components/scUpload/index.vue
@@ -2,16 +2,16 @@
 	<div class="sc-upload" v-loading="loading" element-loading-background="rgba(0, 0, 0, 0.5)" :style="style">
 		<div v-if="tempImg || img" class="sc-upload-file">
 			<div class="mask">
-				<span class="del" @click.stop="del"><i class="el-icon-delete"></i></span>
+				<span class="del" @click.stop="del"><el-icon><el-icon-delete /></el-icon></span>
 			</div>
 			<el-image v-if="fileIsImg" class="image" :src="tempImg || img" :preview-src-list="[img]" fit="cover" hide-on-click-modal append-to-body :z-index="9999"></el-image>
-			<a v-else :href="img" class="file" target="_blank"><i class="el-icon-document"></i></a>
+			<a v-else :href="img" class="file" target="_blank"><el-icon><el-icon-document /></el-icon></a>
 		</div>
 		<div v-else class="sc-upload-uploader" @click="fileSelect && showfileSelect()">
 			<el-upload ref="upload" class="uploader" :disabled="fileSelect" :auto-upload="!cropper" :on-change="change" :accept="accept" :action="action" :show-file-list="false" :before-upload="before" :on-success="success" :on-error="error" :http-request="request">
 				<slot>
 					<div class="file-empty">
-						<i :class="icon"></i>
+						<el-icon><component :is="icon" /></el-icon>
 						<h4 v-if="title">{{title}}</h4>
 					</div>
 				</slot>
@@ -31,7 +31,8 @@
 				</template>
 			</sc-file-select>
 		</el-dialog>
-		<el-input v-model="img" style="display:none"></el-input>
+		<span style="display:none!important"><el-input v-model="img"></el-input></span>
+
 	</div>
 </template>
 
diff --git a/src/components/scUpload/multiple.vue b/src/components/scUpload/multiple.vue
index c025094f..21479bfb 100644
--- a/src/components/scUpload/multiple.vue
+++ b/src/components/scUpload/multiple.vue
@@ -8,12 +8,12 @@
 					</div>
 					<div v-else class="sc-upload-item">
 						<div class="mask">
-							<span class="del" @click.stop="del(index)"><i class="el-icon-delete"></i></span>
+							<span class="del" @click.stop="del(index)"><el-icon><el-icon-delete /></el-icon></span>
 						</div>
 						<el-image class="image" :src="file.url" fit="cover" :preview-src-list="preview" hide-on-click-modal append-to-body>
 							<template #placeholder>
 								<div class="image-slot">
-								    <i class="el-icon-more"></i>
+									<el-icon><el-icon-more-filled /></el-icon>
 								</div>
 							</template>
 						</el-image>
@@ -24,7 +24,7 @@
 		<div class="sc-upload-uploader" @click="fileSelect && showfileSelect()">
 			<el-upload ref="upload" class="uploader" :disabled="fileSelect" :action="action" :accept="accept" multiple  :show-file-list="false" :file-list="defaultFileList" :before-upload="before" :on-progress="progress" :on-success="success" :on-change="change" :on-remove="remove" :on-error="error" :http-request="request">
 				<div class="file-empty">
-					<i :class="icon"></i>
+					<el-icon><component :is="icon" /></el-icon>
 					<h4 v-if="title">{{title}}</h4>
 				</div>
 			</el-upload>
@@ -36,7 +36,8 @@
 				</template>
 			</sc-file-select>
 		</el-dialog>
-		<el-input v-model="value" style="display:none"></el-input>
+		<span style="display:none!important"><el-input v-model="value"></el-input></span>
+
 	</div>
 </template>
 
diff --git a/src/components/scWorkflow/index.vue b/src/components/scWorkflow/index.vue
index 1fd4c025..9ef28c87 100644
--- a/src/components/scWorkflow/index.vue
+++ b/src/components/scWorkflow/index.vue
@@ -71,7 +71,7 @@
 		.node-wrap-box {display: inline-flex;flex-direction: column;position: relative;width: 220px;min-height: 72px;flex-shrink: 0;background: rgb(255, 255, 255);border-radius: 4px;cursor: pointer;box-shadow: 0 2px 5px 0 rgba(0,0,0,.1);}
 		.node-wrap-box::before {content: "";position: absolute;top: -12px;left: 50%;transform: translateX(-50%);width: 0px;border-style: solid;border-width: 8px 6px 4px;border-color: rgb(202, 202, 202) transparent transparent;background: #f6f8f9;}
 		.node-wrap-box.start-node:before {content: none}
-		.node-wrap-box .title {height:24px;line-height: 24px;color: #fff;padding-left: 16px;padding-right: 30px;border-radius: 4px 4px 0 0;position: relative;}
+		.node-wrap-box .title {height:24px;line-height: 24px;color: #fff;padding-left: 16px;padding-right: 30px;border-radius: 4px 4px 0 0;position: relative;display: flex;align-items: center;}
 		.node-wrap-box .title .icon {margin-right: 5px;}
 		.node-wrap-box .title .close {font-size: 15px;position: absolute;top:50%;transform: translateY(-50%);right:10px;display: none;}
 		.node-wrap-box .content {position: relative;padding: 15px;}
@@ -133,7 +133,7 @@
 	.node-wrap-drawer__title {padding-right:40px;}
 	.node-wrap-drawer__title label {cursor: pointer;}
 	.node-wrap-drawer__title label:hover {border-bottom: 1px dashed #409eff;}
-	.node-wrap-drawer__title .node-wrap-drawer__title-edit {color: #409eff;margin-left: 10px;}
+	.node-wrap-drawer__title .node-wrap-drawer__title-edit {color: #409eff;margin-left: 10px;vertical-align: middle;}
 
 	[data-theme='dark'] .sc-workflow-design {
 		.node-wrap-box,.auto-judge {background: #2b2b2b;}
diff --git a/src/components/scWorkflow/nodes/addNode.vue b/src/components/scWorkflow/nodes/addNode.vue
index e7bf7762..5c6648ad 100644
--- a/src/components/scWorkflow/nodes/addNode.vue
+++ b/src/components/scWorkflow/nodes/addNode.vue
@@ -8,15 +8,15 @@
 				<div class="add-node-popover-body">
 					<ul>
 						<li>
-							<i class="el-icon-user-solid" style="color: #ff943e;" @click="addType(1)"></i>
+							<el-icon style="color: #ff943e;" @click="addType(1)"><el-icon-user-filled /></el-icon>
 							<p>审批节点</p>
 						</li>
 						<li>
-							<i class="el-icon-s-promotion" style="color: #3296fa;" @click="addType(2)"></i>
+							<el-icon style="color: #3296fa;" @click="addType(2)"><el-icon-promotion /></el-icon>
 							<p>抄送节点</p>
 						</li>
 						<li>
-							<i class="el-icon-share" style="color: #15BC83;" @click="addType(4)"></i>
+							<el-icon style="color: #15BC83;" @click="addType(4)"><el-icon-share /></el-icon>
 							<p>条件分支</p>
 						</li>
 					</ul>
diff --git a/src/components/scWorkflow/nodes/approver.vue b/src/components/scWorkflow/nodes/approver.vue
index a5f71117..8b287cc7 100644
--- a/src/components/scWorkflow/nodes/approver.vue
+++ b/src/components/scWorkflow/nodes/approver.vue
@@ -2,9 +2,9 @@
 	<div class="node-wrap">
 		<div class="node-wrap-box" @click="show">
 			<div class="title" style="background: #ff943e;">
-				<i class="icon el-icon-user-solid"></i>
+				<el-icon class="icon"><el-icon-user-filled /></el-icon>
 				<span>{{ nodeConfig.nodeName }}</span>
-				<i class="close el-icon-close" @click.stop="delNode()"></i>
+				<el-icon class="close" @click.stop="delNode()"><el-icon-close /></el-icon>
 			</div>
 			<div class="content">
 				<span v-if="toText(nodeConfig)">{{ toText(nodeConfig) }}</span>
@@ -15,7 +15,7 @@
 		<el-drawer title="审批人设置" v-model="drawer" destroy-on-close append-to-body :size="500">
 			<template #title>
 				<div class="node-wrap-drawer__title">
-					<label @click="editTitle" v-if="!isEditTitle">{{form.nodeName}}<i class="node-wrap-drawer__title-edit el-icon-edit-outline"></i></label>
+					<label @click="editTitle" v-if="!isEditTitle">{{form.nodeName}}<el-icon class="node-wrap-drawer__title-edit"><el-icon-edit /></el-icon></label>
 					<el-input v-if="isEditTitle" ref="nodeTitle" v-model="form.nodeName" clearable @blur="saveTitle" @keyup.enter="saveTitle"></el-input>
 				</div>
 			</template>
diff --git a/src/components/scWorkflow/nodes/branch.vue b/src/components/scWorkflow/nodes/branch.vue
index 4ad7cc5a..d682e681 100644
--- a/src/components/scWorkflow/nodes/branch.vue
+++ b/src/components/scWorkflow/nodes/branch.vue
@@ -7,17 +7,21 @@
 					<div class="condition-node">
 						<div class="condition-node-box">
 							<div class="auto-judge" @click="show(index)">
-								<div class="sort-left" v-if="index!=0" @click.stop="arrTransfer(index,-1)"><i class="el-icon-arrow-left"></i></div>
+								<div class="sort-left" v-if="index!=0" @click.stop="arrTransfer(index,-1)">
+									<el-icon><el-icon-arrow-left /></el-icon>
+								</div>
 								<div class="title">
 									<span class="node-title">{{ item.nodeName }}</span>
 									<span class="priority-title">优先级{{item.priorityLevel}}</span>
-									<i class="close el-icon-close" @click.stop="delTerm(index)"></i>
+									<el-icon class="close" @click.stop="delTerm(index)"><el-icon-close /></el-icon>
 								</div>
 								<div class="content">
 									<span v-if="toText(nodeConfig, index)">{{ toText(nodeConfig, index) }}</span>
 									<span v-else class="placeholder">请设置条件</span>
 								</div>
-								<div class="sort-right" v-if="index!=nodeConfig.conditionNodes.length-1" @click.stop="arrTransfer(index)"><i class="el-icon-arrow-right"></i></div>
+								<div class="sort-right" v-if="index!=nodeConfig.conditionNodes.length-1" @click.stop="arrTransfer(index)">
+									<el-icon><el-icon-arrow-right /></el-icon>
+								</div>
 							</div>
 							<add-node v-model="item.childNode"></add-node>
 						</div>
@@ -34,7 +38,7 @@
 		<el-drawer title="条件设置" v-model="drawer" destroy-on-close append-to-body :size="600">
 			<template #title>
 				<div class="node-wrap-drawer__title">
-					<label @click="editTitle" v-if="!isEditTitle">{{form.nodeName}}<i class="node-wrap-drawer__title-edit el-icon-edit-outline"></i></label>
+					<label @click="editTitle" v-if="!isEditTitle">{{form.nodeName}}<el-icon class="node-wrap-drawer__title-edit"><el-icon-edit /></el-icon></label>
 					<el-input v-if="isEditTitle" ref="nodeTitle" v-model="form.nodeName" clearable @blur="saveTitle" @keyup.enter="saveTitle"></el-input>
 				</div>
 			</template>
diff --git a/src/components/scWorkflow/nodes/promoter.vue b/src/components/scWorkflow/nodes/promoter.vue
index f021db75..0e2e7c37 100644
--- a/src/components/scWorkflow/nodes/promoter.vue
+++ b/src/components/scWorkflow/nodes/promoter.vue
@@ -2,7 +2,7 @@
 	<div class="node-wrap">
 		<div class="node-wrap-box start-node" @click="show">
 			<div class="title" style="background: #576a95;">
-				<i class="icon el-icon-user-solid"></i>
+				<el-icon class="icon"><el-icon-user-filled /></el-icon>
 				<span>{{ nodeConfig.nodeName }}</span>
 			</div>
 			<div class="content">
@@ -13,7 +13,7 @@
 		<el-drawer title="发起人" v-model="drawer" destroy-on-close append-to-body :size="500">
 			<template #title>
 				<div class="node-wrap-drawer__title">
-					<label @click="editTitle" v-if="!isEditTitle">{{form.nodeName}}<i class="node-wrap-drawer__title-edit el-icon-edit-outline"></i></label>
+					<label @click="editTitle" v-if="!isEditTitle">{{form.nodeName}}<el-icon class="node-wrap-drawer__title-edit"><el-icon-edit /></el-icon></label>
 					<el-input v-if="isEditTitle" ref="nodeTitle" v-model="form.nodeName" clearable @blur="saveTitle" @keyup.enter="saveTitle"></el-input>
 				</div>
 			</template>
diff --git a/src/components/scWorkflow/nodes/send.vue b/src/components/scWorkflow/nodes/send.vue
index 30bc97e1..1a537969 100644
--- a/src/components/scWorkflow/nodes/send.vue
+++ b/src/components/scWorkflow/nodes/send.vue
@@ -2,9 +2,9 @@
 	<div class="node-wrap">
 		<div class="node-wrap-box" @click="show">
 			<div class="title" style="background: #3296fa;">
-				<i class="icon el-icon-s-promotion"></i>
+				<el-icon class="icon"><el-icon-promotion /></el-icon>
 				<span>{{ nodeConfig.nodeName }}</span>
-				<i class="close el-icon-close" @click.stop="delNode()"></i>
+				<el-icon class="close" @click.stop="delNode()"><el-icon-close /></el-icon>
 			</div>
 			<div class="content">
 				<span v-if="toText(nodeConfig)">{{ toText(nodeConfig) }}</span>
@@ -15,7 +15,7 @@
 		<el-drawer title="抄送人设置" v-model="drawer" destroy-on-close append-to-body :size="500">
 			<template #title>
 				<div class="node-wrap-drawer__title">
-					<label @click="editTitle" v-if="!isEditTitle">{{form.nodeName}}<i class="node-wrap-drawer__title-edit el-icon-edit-outline"></i></label>
+					<label @click="editTitle" v-if="!isEditTitle">{{form.nodeName}}<el-icon class="node-wrap-drawer__title-edit"><el-icon-edit /></el-icon></label>
 					<el-input v-if="isEditTitle" ref="nodeTitle" v-model="form.nodeName" clearable @blur="saveTitle" @keyup.enter="saveTitle"></el-input>
 				</div>
 			</template>
diff --git a/src/components/scWorkflow/select.vue b/src/components/scWorkflow/select.vue
index 44d338ca..93f8c037 100644
--- a/src/components/scWorkflow/select.vue
+++ b/src/components/scWorkflow/select.vue
@@ -29,7 +29,7 @@
 						</div>
 					</div>
 				</div>
-				<div class="sc-user-select__toicon"><i class="el-icon-right"></i></div>
+				<div class="sc-user-select__toicon"><el-icon><el-icon-arrow-right /></el-icon></div>
 				<div class="sc-user-select__selected">
 					<header>已选 ({{selected.length}})</header>
 					<ul>
@@ -60,7 +60,7 @@
 						</div>
 					</div>
 				</div>
-				<div class="sc-user-select__toicon"><i class="el-icon-right"></i></div>
+				<div class="sc-user-select__toicon"><el-icon><el-icon-arrow-right /></el-icon></div>
 				<div class="sc-user-select__selected">
 					<header>已选 ({{selected.length}})</header>
 					<ul>
@@ -247,7 +247,7 @@
 	.sc-user-select__user footer {height:36px;padding-top:5px;border-top: 1px solid var(--el-border-color-light);}
 
 	.sc-user-select__toicon {display: flex;justify-content: center;align-items: center;margin:0 10px;}
-	.sc-user-select__toicon i {background: #ccc;width: 20px;height: 20px;text-align: center;line-height: 20px;border-radius:50%;color: #fff;}
+	.sc-user-select__toicon i {display: flex;justify-content: center;align-items: center;background: #ccc;width: 20px;height: 20px;text-align: center;line-height: 20px;border-radius:50%;color: #fff;}
 
 	.sc-user-select__selected {height:345px;width: 200px;border: 1px solid var(--el-border-color-light);background: var(--el-color-white);}
 	.sc-user-select__selected header {height:43px;line-height: 43px;border-bottom: 1px solid var(--el-border-color-light);padding:0 15px;font-size: 12px;}
diff --git a/src/config/iconSelect.js b/src/config/iconSelect.js
index c0979ea2..b948cb57 100644
--- a/src/config/iconSelect.js
+++ b/src/config/iconSelect.js
@@ -1,17 +1,302 @@
-import scuiicon from '@/assets/font/scicon/iconfont.json'
-
 //图标选择器配置
 export default {
-	icons: [
-		{
-			name: 'SCUI',
-			namespace: 'sc-icon-',
-			icons: scuiicon.glyphs.map(v => v.font_class)
+	icons: [{
+			name: '默认',
+			icons: [
+				"el-icon-aim",
+				"el-icon-add-location",
+				"el-icon-apple",
+				"el-icon-alarm-clock",
+				"el-icon-arrow-down",
+				"el-icon-arrow-down-bold",
+				"el-icon-arrow-left",
+				"el-icon-arrow-left-bold",
+				"el-icon-arrow-right-bold",
+				"el-icon-arrow-up",
+				"el-icon-back",
+				"el-icon-bell",
+				"el-icon-baseball",
+				"el-icon-bicycle",
+				"el-icon-bell-filled",
+				"el-icon-basketball",
+				"el-icon-bottom",
+				"el-icon-box",
+				"el-icon-briefcase",
+				"el-icon-brush-filled",
+				"el-icon-bowl",
+				"el-icon-avatar",
+				"el-icon-brush",
+				"el-icon-burger",
+				"el-icon-camera",
+				"el-icon-bottom-left",
+				"el-icon-calendar",
+				"el-icon-caret-bottom",
+				"el-icon-caret-left",
+				"el-icon-caret-right",
+				"el-icon-caret-top",
+				"el-icon-chat-dot-square",
+				"el-icon-cellphone",
+				"el-icon-chat-dot-round",
+				"el-icon-chat-line-square",
+				"el-icon-chat-line-round",
+				"el-icon-chat-round",
+				"el-icon-check",
+				"el-icon-chat-square",
+				"el-icon-cherry",
+				"el-icon-chicken",
+				"el-icon-circle-check-filled",
+				"el-icon-circle-check",
+				"el-icon-checked",
+				"el-icon-circle-close-filled",
+				"el-icon-circle-close",
+				"el-icon-arrow-right",
+				"el-icon-circle-plus",
+				"el-icon-clock",
+				"el-icon-close-bold",
+				"el-icon-close",
+				"el-icon-cloudy",
+				"el-icon-circle-plus-filled",
+				"el-icon-coffee-cup",
+				"el-icon-cold-drink",
+				"el-icon-coin",
+				"el-icon-arrow-up-bold",
+				"el-icon-collection-tag",
+				"el-icon-bottom-right",
+				"el-icon-coffee",
+				"el-icon-camera-filled",
+				"el-icon-collection",
+				"el-icon-cpu",
+				"el-icon-crop",
+				"el-icon-coordinate",
+				"el-icon-d-arrow-left",
+				"el-icon-compass",
+				"el-icon-connection",
+				"el-icon-credit-card",
+				"el-icon-data-board",
+				"el-icon-d-arrow-right",
+				"el-icon-dessert",
+				"el-icon-delete-location",
+				"el-icon-d-caret",
+				"el-icon-delete",
+				"el-icon-dish",
+				"el-icon-dish-dot",
+				"el-icon-document-copy",
+				"el-icon-discount",
+				"el-icon-document-checked",
+				"el-icon-document-add",
+				"el-icon-document-remove",
+				"el-icon-data-analysis",
+				"el-icon-delete-filled",
+				"el-icon-download",
+				"el-icon-drizzling",
+				"el-icon-eleme",
+				"el-icon-eleme-filled",
+				"el-icon-edit",
+				"el-icon-failed",
+				"el-icon-expand",
+				"el-icon-female",
+				"el-icon-document",
+				"el-icon-film",
+				"el-icon-finished",
+				"el-icon-data-line",
+				"el-icon-filter",
+				"el-icon-flag",
+				"el-icon-folder-checked",
+				"el-icon-first-aid-kit",
+				"el-icon-folder-add",
+				"el-icon-fold",
+				"el-icon-folder-delete",
+				"el-icon-document-delete",
+				"el-icon-folder",
+				"el-icon-food",
+				"el-icon-folder-opened",
+				"el-icon-football",
+				"el-icon-folder-remove",
+				"el-icon-fries",
+				"el-icon-full-screen",
+				"el-icon-fork-spoon",
+				"el-icon-goblet",
+				"el-icon-goblet-full",
+				"el-icon-goods",
+				"el-icon-goblet-square-full",
+				"el-icon-goods-filled",
+				"el-icon-grid",
+				"el-icon-grape",
+				"el-icon-goblet-square",
+				"el-icon-headset",
+				"el-icon-comment",
+				"el-icon-help-filled",
+				"el-icon-histogram",
+				"el-icon-home-filled",
+				"el-icon-help",
+				"el-icon-house",
+				"el-icon-ice-cream-round",
+				"el-icon-hot-water",
+				"el-icon-ice-cream",
+				"el-icon-files",
+				"el-icon-ice-cream-square",
+				"el-icon-key",
+				"el-icon-ice-tea",
+				"el-icon-knife-fork",
+				"el-icon-iphone",
+				"el-icon-info-filled",
+				"el-icon-link",
+				"el-icon-ice-drink",
+				"el-icon-lightning",
+				"el-icon-loading",
+				"el-icon-lollipop",
+				"el-icon-location-information",
+				"el-icon-lock",
+				"el-icon-location-filled",
+				"el-icon-magnet",
+				"el-icon-male",
+				"el-icon-location",
+				"el-icon-menu",
+				"el-icon-magic-stick",
+				"el-icon-message-box",
+				"el-icon-map-location",
+				"el-icon-mic",
+				"el-icon-message",
+				"el-icon-medal",
+				"el-icon-milk-tea",
+				"el-icon-microphone",
+				"el-icon-minus",
+				"el-icon-money",
+				"el-icon-moon-night",
+				"el-icon-monitor",
+				"el-icon-moon",
+				"el-icon-more",
+				"el-icon-mostly-cloudy",
+				"el-icon-more-filled",
+				"el-icon-mouse",
+				"el-icon-mug",
+				"el-icon-mute",
+				"el-icon-no-smoking",
+				"el-icon-mute-notification",
+				"el-icon-notification",
+				"el-icon-notebook",
+				"el-icon-odometer",
+				"el-icon-office-building",
+				"el-icon-operation",
+				"el-icon-opportunity",
+				"el-icon-orange",
+				"el-icon-open",
+				"el-icon-paperclip",
+				"el-icon-pear",
+				"el-icon-partly-cloudy",
+				"el-icon-phone",
+				"el-icon-picture-filled",
+				"el-icon-phone-filled",
+				"el-icon-picture-rounded",
+				"el-icon-guide",
+				"el-icon-place",
+				"el-icon-platform",
+				"el-icon-pie-chart",
+				"el-icon-pointer",
+				"el-icon-plus",
+				"el-icon-position",
+				"el-icon-postcard",
+				"el-icon-present",
+				"el-icon-price-tag",
+				"el-icon-promotion",
+				"el-icon-pouring",
+				"el-icon-reading-lamp",
+				"el-icon-question-filled",
+				"el-icon-printer",
+				"el-icon-picture",
+				"el-icon-refresh-right",
+				"el-icon-reading",
+				"el-icon-refresh-left",
+				"el-icon-refresh",
+				"el-icon-refrigerator",
+				"el-icon-remove-filled",
+				"el-icon-right",
+				"el-icon-scale-to-original",
+				"el-icon-school",
+				"el-icon-remove",
+				"el-icon-scissor",
+				"el-icon-select",
+				"el-icon-management",
+				"el-icon-search",
+				"el-icon-sell",
+				"el-icon-semi-select",
+				"el-icon-share",
+				"el-icon-setting",
+				"el-icon-service",
+				"el-icon-ship",
+				"el-icon-set-up",
+				"el-icon-shopping-bag",
+				"el-icon-shop",
+				"el-icon-shopping-cart",
+				"el-icon-shopping-cart-full",
+				"el-icon-soccer",
+				"el-icon-sold-out",
+				"el-icon-smoking",
+				"el-icon-sort-down",
+				"el-icon-sort",
+				"el-icon-sort-up",
+				"el-icon-star",
+				"el-icon-stamp",
+				"el-icon-star-filled",
+				"el-icon-stopwatch",
+				"el-icon-success-filled",
+				"el-icon-suitcase",
+				"el-icon-sugar",
+				"el-icon-sunny",
+				"el-icon-sunrise",
+				"el-icon-switch",
+				"el-icon-ticket",
+				"el-icon-sunset",
+				"el-icon-tickets",
+				"el-icon-switch-button",
+				"el-icon-takeaway-box",
+				"el-icon-toilet-paper",
+				"el-icon-timer",
+				"el-icon-tools",
+				"el-icon-top-left",
+				"el-icon-top",
+				"el-icon-top-right",
+				"el-icon-trend-charts",
+				"el-icon-turn-off",
+				"el-icon-unlock",
+				"el-icon-trophy",
+				"el-icon-umbrella",
+				"el-icon-upload-filled",
+				"el-icon-user-filled",
+				"el-icon-upload",
+				"el-icon-user",
+				"el-icon-van",
+				"el-icon-copy-document",
+				"el-icon-video-pause",
+				"el-icon-video-camera-filled",
+				"el-icon-view",
+				"el-icon-wallet",
+				"el-icon-warning-filled",
+				"el-icon-watch",
+				"el-icon-video-play",
+				"el-icon-watermelon",
+				"el-icon-video-camera",
+				"el-icon-wallet-filled",
+				"el-icon-warning",
+				"el-icon-list",
+				"el-icon-zoom-in",
+				"el-icon-zoom-out",
+				"el-icon-rank",
+				"el-icon-wind-power"
+			]
 		},
 		{
 			name: '扩展',
-			namespace: 'el-icon-',
-			icons: ['platform-eleme']
+			icons: [
+				'sc-icon-vue',
+				'sc-icon-code',
+				'sc-icon-wechat',
+				'sc-icon-bug-fill',
+				'sc-icon-bug-line',
+				'sc-icon-file-word',
+				'sc-icon-file-excel',
+				'sc-icon-file-ppt'
+			]
 		}
 	]
 }
diff --git a/src/layout/components/NavMenu.vue b/src/layout/components/NavMenu.vue
index 1f809f2a..0bc22bad 100644
--- a/src/layout/components/NavMenu.vue
+++ b/src/layout/components/NavMenu.vue
@@ -5,14 +5,14 @@
 	<template v-for="navMenu in navMenus" v-bind:key="navMenu">
 		<el-menu-item v-if="!hasChildren(navMenu)" :index="navMenu.path">
 			<a v-if="navMenu.meta&&navMenu.meta.type=='link'" :href="navMenu.path" target="_blank" @click.stop='()=>{}'></a>
-			<i v-if="navMenu.meta&&navMenu.meta.icon" :class="navMenu.meta.icon || 'el-icon-menu'"></i>
+			<el-icon v-if="navMenu.meta&&navMenu.meta.icon"><component :is="navMenu.meta.icon || 'el-icon-menu'"/></el-icon>
 			<template #title>
 				<span>{{navMenu.meta.title}}</span>
 			</template>
 		</el-menu-item>
 		<el-sub-menu v-else :index="navMenu.path">
 			<template #title>
-				<i v-if="navMenu.meta&&navMenu.meta.icon" :class="navMenu.meta.icon || 'el-icon-menu'"></i>
+				<el-icon v-if="navMenu.meta&&navMenu.meta.icon"><component :is="navMenu.meta.icon || 'el-icon-menu'"/></el-icon>
 				<span>{{navMenu.meta.title}}</span>
 			</template>
 			<NavMenu :navMenus="navMenu.children"></NavMenu>
diff --git a/src/layout/components/sideM.vue b/src/layout/components/sideM.vue
index 94f58fc8..005540ac 100644
--- a/src/layout/components/sideM.vue
+++ b/src/layout/components/sideM.vue
@@ -1,5 +1,5 @@
 <template>
-	<div ref="" class="mobile-nav-button" @click="showMobileNav($event)" v-drag draggable="false"><i class="el-icon-menu"></i></div>
+	<div ref="" class="mobile-nav-button" @click="showMobileNav($event)" v-drag draggable="false"><el-icon><el-icon-menu /></el-icon></div>
 
 	<el-drawer ref="mobileNavBox" title="移动端菜单" :size="240" v-model="nav" direction="ltr" :with-header="false" destroy-on-close>
 		<el-container class="mobile-nav">
diff --git a/src/layout/components/tags.vue b/src/layout/components/tags.vue
index d643e763..c01a2a95 100644
--- a/src/layout/components/tags.vue
+++ b/src/layout/components/tags.vue
@@ -4,7 +4,7 @@
 			<li v-for="tag in tagList" v-bind:key="tag" :class="[isActive(tag)?'active':'',tag.meta.affix?'affix':'' ]" @contextmenu.prevent="openContextMenu($event, tag)">
 				<router-link :to="tag">
 				<span>{{ tag.meta.title }}</span>
-				<i v-if="!tag.meta.affix" class="el-icon-close" @click.prevent.stop='closeSelectedTag(tag)'></i>
+				<el-icon v-if="!tag.meta.affix" @click.prevent.stop='closeSelectedTag(tag)'><el-icon-close/></el-icon>
 				</router-link>
 			</li>
 		</ul>
@@ -12,13 +12,13 @@
 
 	<transition name="el-zoom-in-top">
 		<ul v-if="contextMenuVisible" :style="{left:left+'px',top:top+'px'}" class="contextmenu" id="contextmenu">
-			<li @click="refreshTab()"><i class="el-icon-refresh"></i>刷新</li>
+			<li @click="refreshTab()"><el-icon><el-icon-refresh/></el-icon>刷新</li>
 			<hr>
-			<li @click="closeTabs()" :class="contextMenuItem.meta.affix?'disabled':''"><i class="el-icon-close"></i>关闭标签</li>
-			<li @click="closeOtherTabs()"><i class="el-icon-folder-delete"></i>关闭其他标签</li>
+			<li @click="closeTabs()" :class="contextMenuItem.meta.affix?'disabled':''"><el-icon><el-icon-close/></el-icon>关闭标签</li>
+			<li @click="closeOtherTabs()"><el-icon><el-icon-folder-delete/></el-icon>关闭其他标签</li>
 			<hr>
-			<li @click="screen()"><i class="el-icon-full-screen"></i>全屏当前标签</li>
-			<li @click="openWindow()"><i class="el-icon-copy-document"></i>在新的窗口中打开</li>
+			<li @click="screen()"><el-icon><el-icon-full-screen/></el-icon>全屏当前标签</li>
+			<li @click="openWindow()"><el-icon><el-icon-copy-document/></el-icon>在新的窗口中打开</li>
 		</ul>
 	</transition>
 </template>
@@ -262,6 +262,8 @@
 		background-color: #ebeef5;
 	}
 	.contextmenu li {
+		display: flex;
+		align-items: center;
 		margin:0;
 		cursor: pointer;
 		line-height: 30px;
diff --git a/src/layout/components/topbar.vue b/src/layout/components/topbar.vue
index f76e4e6b..31748053 100644
--- a/src/layout/components/topbar.vue
+++ b/src/layout/components/topbar.vue
@@ -2,9 +2,9 @@
 	<div class="adminui-topbar">
 		<div class="left-panel">
 			<div class="menu-collapse hidden-sm-and-down" @click="$store.commit('TOGGLE_menuIsCollapse')">
-				<i class="el-icon-s-fold"></i>
+				<el-icon><el-icon-fold /></el-icon>
 			</div>
-			<el-breadcrumb separator-class="el-icon-arrow-right" class="hidden-sm-and-down">
+			<el-breadcrumb separator-icon="el-icon-arrow-right" class="hidden-sm-and-down">
 				<transition-group name="breadcrumb" mode="out-in">
 					<template v-for="item in breadList" :key="item.title" >
 						<el-breadcrumb-item v-if="item.path!='/' &&  !item.meta.hiddenBreadcrumb" :key="item.meta.title">{{item.meta.title}}</el-breadcrumb-item>
diff --git a/src/layout/components/userbar.vue b/src/layout/components/userbar.vue
index d7028b4f..b25d101f 100644
--- a/src/layout/components/userbar.vue
+++ b/src/layout/components/userbar.vue
@@ -1,11 +1,11 @@
 <template>
 	<div class="user-bar">
 		<div class="screen panel-item hidden-sm-and-down" @click="screen">
-			<i class="el-icon-full-screen"></i>
+			<el-icon><el-icon-full-screen /></el-icon>
 		</div>
 		<div class="msg panel-item" @click="showMsg">
 			<el-badge :hidden="msgList.length==0" :value="msgList.length" class="badge" type="danger">
-				<i class="el-icon-chat-dot-round"></i>
+				<el-icon><el-icon-chat-dot-round /></el-icon>
 			</el-badge>
 			<el-drawer title="新消息" v-model="msg" :size="400" append-to-body destroy-on-close>
 				<el-container>
@@ -39,10 +39,11 @@
 				</el-container>
 			</el-drawer>
 		</div>
-		<el-dropdown trigger="click" @command="handleUser" style="height: 100%;">
-			<div class="user panel-item">
+		<el-dropdown class="user panel-item" trigger="click" @command="handleUser">
+			<div class="user-avatar">
 				<el-avatar :size="30">{{ userNameF }}</el-avatar>
-				<label>{{ userName }}<i class="el-icon-arrow-down el-icon--right"></i></label>
+				<label>{{ userName }}</label>
+				<el-icon class="el-icon--right"><el-icon-arrow-down /></el-icon>
 			</div>
 			<template #dropdown>
 				<el-dropdown-menu>
@@ -156,8 +157,8 @@
 	.user-bar .panel-item {padding: 0 10px;cursor: pointer;height: 100%;display: flex;align-items: center;}
 	.user-bar .panel-item i {font-size: 16px;}
 	.user-bar .panel-item:hover {background: rgba(0, 0, 0, 0.1);}
-	.user-bar .user {display: flex;align-items: center;}
-	.user-bar .user label {display: inline-block;margin-left:5px;font-size: 12px;cursor:pointer;}
+	.user-bar .user-avatar {height:49px;display: flex;align-items: center;}
+	.user-bar .user-avatar label {display: inline-block;margin-left:5px;font-size: 12px;cursor:pointer;}
 
 	.msg-list li {border-top:1px solid #eee;}
 	.msg-list li a {display: flex;padding:20px;}
@@ -167,7 +168,7 @@
 	.msg-list__main h2 {font-size: 15px;font-weight: normal;color: #333;}
 	.msg-list__main p {font-size: 12px;color: #999;line-height: 1.8;margin-top: 5px;}
 	.msg-list__time {width: 100px;text-align: right;color: #999;}
-	
+
 	[data-theme='dark'] .msg-list__main h2 {color: #d0d0d0;}
 	[data-theme='dark'] .msg-list li {border-top:1px solid #363636;}
 	[data-theme='dark'] .msg-list li a:hover {background: #383838;}
diff --git a/src/layout/index.vue b/src/layout/index.vue
index 98b772b8..80c303f9 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -9,7 +9,7 @@
 				</div>
 				<ul v-if="!ismobile" class="nav">
 					<li v-for="item in menu" :key="item" :class="pmenu.path==item.path?'active':''" @click="showMenu(item)">
-						<i :class="item.meta.icon || 'el-icon-menu'"></i>
+						<el-icon><component :is="item.meta.icon || el-icon-menu" /></el-icon>
 						<span>{{ item.meta.title }}</span>
 					</li>
 				</ul>
@@ -128,7 +128,7 @@
 						<ul>
 							<li v-for="item in menu" :key="item" :class="pmenu.path==item.path?'active':''"
 								@click="showMenu(item)">
-								<i :class="item.meta.icon || 'el-icon-menu'"></i>
+								<el-icon><component :is="item.meta.icon || el-icon-menu" /></el-icon>
 								<p>{{ item.meta.title }}</p>
 							</li>
 						</ul>
@@ -165,7 +165,7 @@
 		</section>
 	</template>
 
-	<div class="layout-setting" @click="openSetting"><i class="el-icon-brush"></i></div>
+	<div class="layout-setting" @click="openSetting"><el-icon><el-icon-brush-filled /></el-icon></div>
 
 	<el-drawer title="布局实时演示" v-model="settingDialog" :size="400" append-to-body destroy-on-close>
 		<setting></setting>
diff --git a/src/scui.js b/src/scui.js
index c22355ad..717beac7 100644
--- a/src/scui.js
+++ b/src/scui.js
@@ -22,6 +22,9 @@ import time from './directives/time'
 import copy from './directives/copy'
 import errorHandler from './utils/errorHandler'
 
+import * as elIcons from '@element-plus/icons'
+import * as scIcons from './assets/icons'
+
 export default {
 	install(app) {
 		//挂载全局对象
@@ -53,6 +56,15 @@ export default {
 		app.directive('time', time)
 		app.directive('copy', copy)
 
+		//统一注册el-icon图标
+		for(let icon in elIcons){
+			app.component(`ElIcon${icon}`, elIcons[icon])
+		}
+		//统一注册sc-icon图标
+		for(let icon in scIcons){
+			app.component(`ScIcon${icon}`, scIcons[icon])
+		}
+
 		//全局代码错误捕捉
 		app.config.errorHandler = errorHandler
 	}
diff --git a/src/style/app.scss b/src/style/app.scss
index e78dbb89..836103ee 100644
--- a/src/style/app.scss
+++ b/src/style/app.scss
@@ -84,8 +84,8 @@ a,button,input,textarea{-webkit-tap-highlight-color:rgba(0,0,0,0);box-sizing: bo
 .adminui-tags ul {display: flex;overflow: hidden;}
 .adminui-tags li {cursor: pointer;display: inline-block;float: left;height:34px;line-height: 34px;position: relative;flex-shrink: 0;}
 .adminui-tags li::after {content: " ";width:1px;height:100%;position: absolute;right:0px;background-image: linear-gradient(#fff, #e6e6e6);}
-.adminui-tags li a {display: inline-block;padding:0 10px;width:100%;height:100%;color: #999;text-decoration:none;}
-.adminui-tags li i {margin-left:10px;padding:3px;border-radius: 3px;}
+.adminui-tags li a {display: inline-block;padding:0 10px;width:100%;height:100%;color: #999;text-decoration:none;display: flex;align-items: center;}
+.adminui-tags li i {margin-left:10px;border-radius: 3px;width:18px;height:18px;display: flex;align-items: center;justify-content: center;}
 .adminui-tags li i:hover {background: rgba(0,0,0,.2);color: #fff;}
 .adminui-tags li:hover {background: #ecf5ff;}
 .adminui-tags li.active {background: #409EFF;}
diff --git a/src/style/fix.scss b/src/style/fix.scss
index 13d4bf67..3d395e98 100644
--- a/src/style/fix.scss
+++ b/src/style/fix.scss
@@ -18,10 +18,6 @@
 .el-drawer__header>:first-child {font-size: 17px;font-weight: bold;}
 .el-tree.menu .el-tree-node__content {height:36px;}
 .el-tree.menu .el-tree-node__content .el-tree-node__label .icon {margin-right: 5px;}
-.el-input-number__decrease, .el-input-number__increase {top:2px;}
-.el-menu-item [class^=sc-icon-] {font-size: 18px;display: inline-block;line-height: 1;}
-.el-menu-item [class^=sc-icon-], .el-submenu [class^=sc-icon-] {margin-right: 5px;vertical-align: middle;width: 24px;text-align: center;}
-.el-sub-menu [class^=sc-icon-] {display: inline-block;line-height: 1;vertical-align: middle;margin-right: 5px;width: 24px;text-align: center;font-size: 18px;}
 .el-progress__text {font-size: 12px!important;}
 .el-progress__text i {font-size: 14.4px!important;}
 .el-step.is-horizontal .el-step__line {height:1px;}
@@ -36,6 +32,7 @@
 .el-table th.is-sortable:hover {background: #eee;}
 .el-table .el-table__body-wrapper {background: #f6f8f9;}
 .el-col .el-card {margin-bottom: 15px;}
+.el-icon {font-size: inherit;}
 
 /* 动态值 */
 .el-button--default:active, .el-button--default.is-plain:active {border-color: var(--el-color-primary-darken-1, #0d84ff);color: var(--el-color-primary-darken-1, #0d84ff);}
diff --git a/src/style/style.scss b/src/style/style.scss
index 6def9dc5..11b2cd6e 100644
--- a/src/style/style.scss
+++ b/src/style/style.scss
@@ -1,5 +1,4 @@
 @import 'app.scss';
 @import 'fix.scss';
 @import 'pages.scss';
-@import 'media.scss';
-@import '~@/assets/font/scicon/iconfont.css';
+@import 'media.scss';
\ No newline at end of file
diff --git a/src/views/home/widgets/components/about.vue b/src/views/home/widgets/components/about.vue
index 91004388..efe806e6 100644
--- a/src/views/home/widgets/components/about.vue
+++ b/src/views/home/widgets/components/about.vue
@@ -12,7 +12,7 @@
 <script>
 	export default {
 		title: "关于项目",
-		icon: "el-icon-s-tools",
+		icon: "el-icon-setting",
 		description: "点个星星支持一下",
 		data() {
 			return {
diff --git a/src/views/home/widgets/components/time.vue b/src/views/home/widgets/components/time.vue
index 4d45e1fb..c551cbc7 100644
--- a/src/views/home/widgets/components/time.vue
+++ b/src/views/home/widgets/components/time.vue
@@ -10,7 +10,7 @@
 <script>
 	export default {
 		title: "时钟",
-		icon: "el-icon-time",
+		icon: "el-icon-clock",
 		description: "演示部件效果",
 		data() {
 			return {
diff --git a/src/views/home/widgets/components/welcome.vue b/src/views/home/widgets/components/welcome.vue
index 8c9036d2..0889ab44 100644
--- a/src/views/home/widgets/components/welcome.vue
+++ b/src/views/home/widgets/components/welcome.vue
@@ -7,15 +7,15 @@
 			</div>
 			<div class="tips">
 				<div class="tips-item">
-					<div class="tips-item-icon"><i class="el-icon-menu"></i></div>
+					<div class="tips-item-icon"><el-icon><el-icon-menu/></el-icon></div>
 					<div class="tips-item-message">这里是项目控制台，你可以点击右上方的“自定义”按钮来添加移除或者移动部件。</div>
 				</div>
 				<div class="tips-item">
-					<div class="tips-item-icon"><i class="el-icon-s-promotion"></i></div>
+					<div class="tips-item-icon"><el-icon><el-icon-promotion/></el-icon></div>
 					<div class="tips-item-message">在提高前端算力、减少带宽请求和代码执行力上多次优化，并且持续着。</div>
 				</div>
 				<div class="tips-item">
-					<div class="tips-item-icon"><i class="el-icon-milk-tea"></i></div>
+					<div class="tips-item-icon"><el-icon><el-icon-milk-tea/></el-icon></div>
 					<div class="tips-item-message">项目目的：让前端工作更快乐</div>
 				</div>
 			</div>
diff --git a/src/views/home/widgets/index.vue b/src/views/home/widgets/index.vue
index 28e09a9d..998d146f 100644
--- a/src/views/home/widgets/index.vue
+++ b/src/views/home/widgets/index.vue
@@ -23,7 +23,7 @@
 										<component :is="allComps[element]"></component>
 										<div v-if="customizing" class="customize-overlay">
 											<el-button class="close" type="danger" plain icon="el-icon-close" size="small" @click="remove(element)"></el-button>
-											<label><i :class="allComps[element].icon"></i>{{ allComps[element].title }}</label>
+											<label><el-icon><component :is="allComps[element].icon" /></el-icon>{{ allComps[element].title }}</label>
 										</div>
 									</div>
 								</template>
@@ -36,8 +36,8 @@
 		<div v-if="customizing" class="widgets-aside">
 			<el-container>
 				<el-header>
-					<div class="widgets-aside-title"><i class="el-icon-circle-plus"></i>添加部件</div>
-					<div class="widgets-aside-close" @click="close()"><i class="el-icon-close"></i></div>
+					<div class="widgets-aside-title"><el-icon><el-icon-circle-plus-filled/></el-icon>添加部件</div>
+					<div class="widgets-aside-close" @click="close()"><el-icon><el-icon-close /></el-icon></div>
 				</el-header>
 				<el-header style="height:auto">
 					<div class="selectLayout">
@@ -70,7 +70,7 @@
 							<el-empty description="没有部件啦" :image-size="60"></el-empty>
 						</div>
 						<div v-for="item in myCompsList" :key="item.title" class="widgets-list-item">
-							<div class="item-logo"><i :class="item.icon"></i></div>
+							<div class="item-logo"><el-icon><component :is="item.icon" /></el-icon></div>
 							<div class="item-info">
 								<h2>{{ item.title }}</h2>
 								<p>{{ item.description }}</p>
diff --git a/src/views/setting/client/index.vue b/src/views/setting/client/index.vue
index e38cb249..9e8e9e99 100644
--- a/src/views/setting/client/index.vue
+++ b/src/views/setting/client/index.vue
@@ -13,7 +13,7 @@
 				<el-table-column label="应用名称" prop="appName" width="250"></el-table-column>
 				<el-table-column label="状态" width="50">
 					<template #default>
-						<i class="el-icon-success" style="color: #67C23A;"></i>
+						<el-icon style="color: #67C23A;"><el-icon-circle-check-filled /></el-icon>
 					</template>
 				</el-table-column>
 				<el-table-column label="秘钥" prop="secret" show-overflow-tooltip width="150"></el-table-column>
diff --git a/src/views/setting/dic/index.vue b/src/views/setting/dic/index.vue
index 2bce8c7f..2c68bb4d 100644
--- a/src/views/setting/dic/index.vue
+++ b/src/views/setting/dic/index.vue
@@ -12,8 +12,8 @@
 								<span class="label">{{ node.label }}</span>
 								<span class="code">{{ data.code }}</span>
 								<span class="do">
-									<i class="el-icon-edit" @click.stop="dicEdit(data)"></i>
-									<i class="el-icon-delete" @click.stop="dicDel(node, data)"></i>
+									<el-icon @click.stop="dicEdit(data)"><el-icon-edit /></el-icon>
+									<el-icon @click.stop="dicDel(node, data)"><el-icon-delete /></el-icon>
 								</span>
 							</span>
 						</template>
@@ -36,7 +36,7 @@
 					<el-table-column type="selection" width="50"></el-table-column>
 					<el-table-column label="" width="50">
 						<template #default>
-							<el-tag class="move" style="cursor: move;"><i class="el-icon-d-caret"></i></el-tag>
+							<el-tag class="move" style="cursor: move;"><el-icon-d-caret style="width: 1em; height: 1em;"/></el-tag>
 						</template>
 					</el-table-column>
 					<el-table-column label="名称" prop="name" width="150"></el-table-column>
diff --git a/src/views/setting/log/index.vue b/src/views/setting/log/index.vue
index 8c374345..9a2a94d7 100644
--- a/src/views/setting/log/index.vue
+++ b/src/views/setting/log/index.vue
@@ -22,9 +22,9 @@
 						<scTable ref="table" :apiObj="apiObj" stripe highlightCurrentRow @row-click="rowClick">
 							<el-table-column label="级别" prop="level" width="50">
 								<template #default="scope">
-									<i v-if="scope.row.level=='error'" class="el-icon-error" style="color: #F56C6C;font-size: 14px;"></i>
-									<i v-if="scope.row.level=='warn'" class="el-icon-warning" style="color: #E6A23C;font-size: 14px;"></i>
-									<i v-if="scope.row.level=='info'" class="el-icon-info" style="color: #409EFF;font-size: 14px;"></i>
+									<el-icon v-if="scope.row.level=='error'" style="color: #F56C6C;font-size: 14px;"><el-icon-circle-close-filled /></el-icon>
+									<el-icon v-if="scope.row.level=='warn'" style="color: #E6A23C;font-size: 14px;"><el-icon-warning-filled /></el-icon>
+									<el-icon v-if="scope.row.level=='info'" style="color: #409EFF;font-size: 14px;"><el-icon-info-filled /></el-icon>
 								</template>
 							</el-table-column>
 							<el-table-column label="ID" prop="id" width="180"></el-table-column>
diff --git a/src/views/setting/menu/index.vue b/src/views/setting/menu/index.vue
index be66fdf5..e70d0fb2 100644
--- a/src/views/setting/menu/index.vue
+++ b/src/views/setting/menu/index.vue
@@ -14,7 +14,7 @@
 									{{ node.label }}
 								</span>
 								<span class="do">
-									<i class="el-icon-plus" @click.stop="add(node, data)"></i>
+									<el-icon @click.stop="add(node, data)"><el-icon-plus /></el-icon>
 								</span>
 							</span>
 						</template>
diff --git a/src/views/setting/task/index.vue b/src/views/setting/task/index.vue
index cf7f903b..0fd02a2c 100644
--- a/src/views/setting/task/index.vue
+++ b/src/views/setting/task/index.vue
@@ -50,7 +50,7 @@
 			</el-col>
 			<el-col :xl="6" :lg="6" :md="8" :sm="12" :xs="24">
 				<el-card class="task task-add" shadow="none" @click="add">
-					<i class="el-icon-plus"></i>
+					<el-icon><el-icon-plus /></el-icon>
 					<p>添加计划任务</p>
 				</el-card>
 			</el-col>
diff --git a/src/views/setting/task/logs.vue b/src/views/setting/task/logs.vue
index 59629821..fa363411 100644
--- a/src/views/setting/task/logs.vue
+++ b/src/views/setting/task/logs.vue
@@ -14,8 +14,8 @@
 				<el-table-column label="执行时间" prop="time" width="200"></el-table-column>
 				<el-table-column label="执行结果" prop="state" width="100">
 					<template #default="scope">
-						<span v-if="scope.row.state==200" style="color: #67C23A;"><i class="el-icon-success"></i> 成功</span>
-						<span v-else style="color: #F56C6C;"><i class="el-icon-error"></i> 异常</span>
+						<span v-if="scope.row.state==200" style="color: #67C23A;"><el-icon><el-icon-success-filled /></el-icon></span>
+						<span v-else style="color: #F56C6C;"><el-icon><el-icon-circle-close-filled /></el-icon></span>
 					</template>
 				</el-table-column>
 				<el-table-column label="执行日志" prop="logs" width="100" fixed="right">
diff --git a/src/views/template/calendar.vue b/src/views/template/calendar.vue
index 92c5a58c..5a0b7d54 100644
--- a/src/views/template/calendar.vue
+++ b/src/views/template/calendar.vue
@@ -16,7 +16,7 @@
 		<el-aside style="width: 400px;border-left: 1px solid #e6e6e6;">
 			<el-container>
 				<el-header>
-					<h2 class="dayTitle"><i class="el-icon-date"></i>{{day}}</h2>
+					<h2 class="dayTitle"><el-icon><el-icon-calendar /></el-icon>{{day}}</h2>
 				</el-header>
 				<el-main>
 					<div class="task-list">
@@ -149,6 +149,6 @@
 	.task-list h2 {font-size: 14px;font-weight: normal;}
 	.task-bottom {display: flex;justify-content: space-between;align-items: center;margin-top: 10px;}
 	.task-bottom .tags .el-tag {margin-right: 5px;}
-	.dayTitle {font-size: 14px;}
+	.dayTitle {font-size: 14px;display: flex;align-items: center;}
 	.dayTitle i {color: #999;margin-right: 10px;}
 </style>
diff --git a/src/views/template/chartlist.vue b/src/views/template/chartlist.vue
index 7f7dbb22..b63d157b 100644
--- a/src/views/template/chartlist.vue
+++ b/src/views/template/chartlist.vue
@@ -22,7 +22,7 @@
 										即通常说的Page View(PV)，用户每打开一个网站页面就被记录1次。用户多次打开同一页面，浏览量值累计。
 									</div>
 								</template>
-								<i class="el-icon-question"></i>
+								<el-icon><el-icon-question-filled /></el-icon>
 							</el-tooltip>
 						</h2>
 						<p>65,715</p>
@@ -35,7 +35,7 @@
 										一天之内您网站的独立访客数(以Cookie为依据)，一天内同一访客多次访问您网站只计算1个访客。
 									</div>
 								</template>
-								<i class="el-icon-question"></i>
+								<el-icon><el-icon-question-filled /></el-icon>
 							</el-tooltip>
 						</h2>
 						<p>8,936</p>
@@ -48,7 +48,7 @@
 										一天之内您网站的独立访问ip数。
 									</div>
 								</template>
-								<i class="el-icon-question"></i>
+								<el-icon><el-icon-question-filled /></el-icon>
 							</el-tooltip>
 						</h2>
 						<p>10,279</p>
@@ -61,7 +61,7 @@
 										只浏览了一个页面便离开了网站的访问次数占总的访问次数的百分比。
 									</div>
 								</template>
-								<i class="el-icon-question"></i>
+								<el-icon><el-icon-question-filled /></el-icon>
 							</el-tooltip>
 						</h2>
 						<p>27.92%</p>
@@ -74,7 +74,7 @@
 										访客在一次访问中，平均打开网站的时长。即每次访问中，打开第一个页面到关闭最后一个页面的平均值，打开一个页面时计算打开关闭的时间差。
 									</div>
 								</template>
-								<i class="el-icon-question"></i>
+								<el-icon><el-icon-question-filled /></el-icon>
 							</el-tooltip>
 						</h2>
 						<p>00:19:05</p>
@@ -210,7 +210,7 @@
 	.number-data {display: flex;}
 	.number-data .item {flex:1;border-right: 1px solid #f0f0f0;padding:0 20px;}
 	.number-data .item:last-child {border: 0;}
-	.number-data .item h2 {font-size: 12px;color: #787a7d;font-weight: normal;}
+	.number-data .item h2 {font-size: 12px;color: #787a7d;font-weight: normal;display: flex;align-items: center;}
 	.number-data .item h2 i {margin-left: 5px;color: #8cc5ff;cursor: pointer;}
 	.number-data .item p {font-size: 20px;color: #121315;margin-top: 10px;}
 
diff --git a/src/views/template/list/index.vue b/src/views/template/list/index.vue
index f6f69b30..bdd001ad 100644
--- a/src/views/template/list/index.vue
+++ b/src/views/template/list/index.vue
@@ -51,8 +51,8 @@
 
 				<!-- 各列自定义template -->
 				<template #state="scope">
-					<em v-if="scope.row.state=='1'" class="state state-1"></em>
-					<em v-if="scope.row.state=='2'" class="state state-2 status-processing"></em>
+					<sc-status-indicator v-if="scope.row.state=='1'" type="primary"></sc-status-indicator>
+					<sc-status-indicator v-if="scope.row.state=='2'" pulse type="danger"></sc-status-indicator>
 				</template>
 				<template #name="scope">
 					<h4>{{scope.row.name}}</h4>
@@ -75,7 +75,7 @@
 						<el-button type="text" size="small" @click="table_show(scope.row, scope.$index)">查看</el-button>
 						<el-divider direction="vertical"></el-divider>
 						<el-dropdown>
-							<el-button  type="text" size="small">更多<i class="el-icon-arrow-down el-icon--right"></i></el-button>
+							<el-button  type="text" size="small">更多<el-icon class="el-icon--right"><el-icon-arrow-down /></el-icon></el-button>
 							<template #dropdown>
 								<el-dropdown-menu>
 									<el-dropdown-item @click="table_edit(scope.row, scope.$index)">编辑</el-dropdown-item>
@@ -246,24 +246,4 @@
 	}
 </script>
 
-<style scoped>
-	.state {width:8px;height:8px;background: #ddd;display: inline-block;border-radius: 50%;vertical-align: middle;}
-	.state-1 {background: #409EFF;}
-	.state-2 {background: #F56C6C;}
-	.status-processing {position: relative;}
-	.status-processing:after {position: absolute;top:0px;left:0px;width: 100%;height: 100%;border-radius: 50%;background: inherit;content: '';animation: warn 1.2s ease-in-out infinite;}
-
-	@keyframes warn {
-		0% {
-			transform: scale(0.5);
-			opacity: 1;
-		}
-		30% {
-			opacity: 1;
-		}
-		100% {
-			transform: scale(2);
-			opacity: 0;
-		}
-	}
-</style>
+<style></style>
diff --git a/src/views/template/svgmap/index.vue b/src/views/template/svgmap/index.vue
index 9278ed0b..1b3acea2 100644
--- a/src/views/template/svgmap/index.vue
+++ b/src/views/template/svgmap/index.vue
@@ -22,7 +22,7 @@
 			<el-collapse style="margin-top: 15px;">
 				<el-collapse-item title="video monitor" name="1">
 					<div class="screen" style="background: #000;height:180px;color: #999;text-align: center;">
-						<i class="el-icon-video-camera" style="font-size: 40px;margin-top: 50px;"></i>
+						<el-icon style="font-size: 40px;margin-top: 50px;"><el-icon-video-play /></el-icon>
 						<p>camera</p>
 					</div>
 				</el-collapse-item>
diff --git a/src/views/test/autocode/index.vue b/src/views/test/autocode/index.vue
index a4f9f319..d5bbf4d5 100644
--- a/src/views/test/autocode/index.vue
+++ b/src/views/test/autocode/index.vue
@@ -6,7 +6,7 @@
 				<el-card shadow="hover" :body-style="{ padding: '0px' }" @click="click(item.url)">
 					<div class="code-item">
 						<div class="img" :style="{background: item.color}">
-							<i :class="item.icon" :style="`background-image: -webkit-linear-gradient(top left, #fff, ${item.color} 100px)`"></i>
+							<el-icon :style="`background-image: -webkit-linear-gradient(top left, #fff, ${item.color} 100px)`"><component :is="item.icon" /></el-icon>
 						</div>
 						<div class="title">
 							<h2>{{item.title}}</h2>
@@ -27,17 +27,17 @@
 			return {
 				list: [
 					{
-						title: "CRUD",
+						title: "CRUD v2",
 						des: "配置型生成经典的增删改查列表",
-						icon: "sc-icon-file-list-fill",
-						color: "#09f",
-						ver: "1.0.0-beta.1",
-						url: "/test/autocode/list"
+						icon: "el-icon-finished",
+						color: "#ccc",
+						ver: "开发中",
+						url: "/test/autocode/list_n"
 					},
 					{
 						title: "FormDesigner",
 						des: "表单设计器",
-						icon: "sc-icon-edit-box-fill",
+						icon: "el-icon-list",
 						color: "#ccc",
 						ver: "开发中",
 						url: "/test/autocode/form"
diff --git a/src/views/userCenter/index.vue b/src/views/userCenter/index.vue
index 515060da..863a0f10 100644
--- a/src/views/userCenter/index.vue
+++ b/src/views/userCenter/index.vue
@@ -12,12 +12,12 @@
 						</div>
 						<div class="user-info-main">
 							<ul>
-								<li><label><i class="el-icon-user"></i></label><span>81883387@qq.com</span></li>
-								<li><label><i class="el-icon-present"></i></label><span>1988-05-07</span></li>
-								<li><label><i class="el-icon-male"></i></label><span>男</span></li>
-								<li><label><i class="el-icon-location-outline"></i></label><span>中国/上海/金山</span></li>
-								<li><label><i class="el-icon-office-building"></i></label><span>集团/上海分公司/软件研发部/摸鱼组</span></li>
-								<li><label><i class="el-icon-coin"></i></label><span>超级管理员</span></li>
+								<li><label><el-icon><el-icon-user /></el-icon></label><span>81883387@qq.com</span></li>
+								<li><label><el-icon><el-icon-present /></el-icon></label><span>1988-05-07</span></li>
+								<li><label><el-icon><el-icon-male /></el-icon></label><span>男</span></li>
+								<li><label><el-icon><el-icon-location /></el-icon></label><span>中国/上海/金山</span></li>
+								<li><label><el-icon><el-icon-office-building /></el-icon></label><span>集团/上海分公司/软件研发部/摸鱼组</span></li>
+								<li><label><el-icon><el-icon-coin /></el-icon></label><span>超级管理员</span></li>
 							</ul>
 						</div>
 						<div class="user-info-bottom">
@@ -74,7 +74,7 @@
 						<el-tab-pane :label="$t('user.settings')">
 							<el-form ref="form" :model="form" label-width="120px" style="margin-top:20px;">
 								<el-form-item :label="$t('user.nightmode')">
-									<el-switch v-model="config.theme" active-value="dark" inactive-value="default"></el-switch>
+									<el-switch v-model="config.theme" active-value="dark" inactive-value="default" inline-prompt active-icon="el-icon-moon" inactive-icon="el-icon-sunny"></el-switch>
 									<div class="el-form-item-msg">{{ $t('user.nightmode_msg') }}</div>
 								</el-form-item>
 								<el-form-item label="主题颜色">
diff --git a/src/views/userCenter/login.vue b/src/views/userCenter/login.vue
index 63f26f3e..7829acfb 100644
--- a/src/views/userCenter/login.vue
+++ b/src/views/userCenter/login.vue
@@ -6,9 +6,15 @@
 				<h4>{{ $t('login.slogan') }}</h4>
 				<p>{{ $t('login.describe') }}</p>
 				<div>
-					<span><i class="sc-icon-vuejs-fill"></i></span>
-					<span><i class="add el-icon-plus"></i></span>
-					<span><i class="el-icon-platform-eleme"></i></span>
+					<span>
+						<el-icon><sc-icon-vue /></el-icon>
+					</span>
+					<span>
+						<el-icon class="add"><el-icon-plus /></el-icon>
+					</span>
+					<span>
+						<el-icon><el-icon-eleme-filled /></el-icon>
+					</span>
 				</div>
 			</div>
 			<div class="login_adv__bottom">
@@ -69,7 +75,7 @@
 				<el-divider>{{ $t('login.signInOther') }}</el-divider>
 
 				<div class="login-oauth">
-					<el-button size="small" type="success" icon="sc-icon-wechat-fill" circle></el-button>
+					<el-button size="small" type="success" icon="sc-icon-wechat" circle></el-button>
 				</div>
 			</div>
 		</div>
diff --git a/src/views/vab/filterBar.vue b/src/views/vab/filterBar.vue
index dca564d5..21ef6cda 100644
--- a/src/views/vab/filterBar.vue
+++ b/src/views/vab/filterBar.vue
@@ -4,7 +4,7 @@
 			<scFilterBar filterName="filterName" :options="options" @filterChange="change">
 				<template #default="{filterLength, openFilter}">
 					<el-badge :value="filterLength" type="danger" :hidden="filterLength<=0">
-						<el-button size="small" icon="sc-icon-filter-fill" @click="openFilter"></el-button>
+						<el-button size="small" icon="el-icon-filter" @click="openFilter"></el-button>
 					</el-badge>
 				</template>
 			</scFilterBar>
diff --git a/src/views/vab/iconfont.vue b/src/views/vab/iconfont.vue
index efa6b1d2..d6747090 100644
--- a/src/views/vab/iconfont.vue
+++ b/src/views/vab/iconfont.vue
@@ -1,11 +1,11 @@
 <template>
 	<el-main>
-		<el-alert title="扩展了Element Plus图标库,也可以使用阿里iconfont在@/assets/font中新增自己的图标库,记得在@style/style.less中引入" type="success" style="margin-bottom:20px;"></el-alert>
+		<el-alert title="扩展了Element Plus图标库,可以在@/assets/icons中新增自己的SVG图标组件,记得在@/assets/icons/index.js中引入. 建议前往阿里iconfont复制SVG代码 https://www.iconfont.cn/collections/detail?spm=a313x.7781069.0.da5a778a4&cid=25353" type="success" style="margin-bottom:20px;"></el-alert>
 		<el-row :gutter="0" class="box">
 			<el-col :span="4" v-for="(icon, index) in icons" :key="index" >
 				<div class="icon-box">
-					<i :class="'sc-icon-'+icon.font_class"></i>
-					<p>{{ 'sc-icon-'+icon.font_class }}</p>
+					<el-icon><component :is="icon" /></el-icon>
+					<p>{{ icon }}</p>
 				</div>
 			</el-col>
 		</el-row>
@@ -14,15 +14,18 @@
 </template>
 
 <script>
-	import icons from '@/assets/font/scicon/iconfont.json'
+	import * as scIcons from '@/assets/icons'
+
 	export default {
 		data() {
 			return {
-				icons: ""
+				icons: []
 			}
 		},
 		mounted() {
-			this.icons = icons.glyphs
+			for(let icon in scIcons){
+				this.icons.push('sc-icon'+icon.replace(/[A-Z]/g,(match)=>'-'+match.toLowerCase()))
+			}
 		}
 	}
 </script>
diff --git a/src/views/vab/print.vue b/src/views/vab/print.vue
index f10505d8..7370895f 100644
--- a/src/views/vab/print.vue
+++ b/src/views/vab/print.vue
@@ -7,7 +7,7 @@
 					<el-button type="primary" @click="print">普通打印</el-button>
 					<div style="height:20px"></div>
 					<div class="printMain" ref="printMain">
-						<div class="item">打印内容1 <i class="el-icon-platform-eleme"></i> <p class="no-print">忽略打印</p></div>
+						<div class="item">打印内容1 <el-icon><el-icon-eleme-filled /></el-icon> <p class="no-print">忽略打印</p></div>
 						<div style="page-break-after: always;"></div>
 						<div class="item">打印内容2</div>
 					</div>
diff --git a/src/views/vab/statistic.vue b/src/views/vab/statistic.vue
index fdfe50af..1264f394 100644
--- a/src/views/vab/statistic.vue
+++ b/src/views/vab/statistic.vue
@@ -19,14 +19,14 @@
 			<el-col :lg="8">
 				<el-card shadow="never">
 					<sc-statistic title="今日净利润" value="112893.00" prefix="¥" groupSeparator>
-						比昨日<span class="up"><i class="el-icon-top"></i>+7.7%</span>
+						<sc-trend v-model="trendValue1"></sc-trend>
 					</sc-statistic>
 				</el-card>
 			</el-col>
 			<el-col :lg="8">
 				<el-card shadow="never">
 					<sc-statistic title="留言" value="112893" suffix="条" groupSeparator>
-						比昨日<span class="down"><i class="el-icon-bottom"></i>-18.9%</span>
+						<sc-trend v-model="trendValue2"></sc-trend>
 					</sc-statistic>
 				</el-card>
 			</el-col>
@@ -44,7 +44,8 @@
 		},
 		data() {
 			return {
-
+				trendValue1: 7.7,
+				trendValue2: -18.9
 			}
 		},
 		mounted() {
diff --git a/src/views/vab/upload.vue b/src/views/vab/upload.vue
index fd657a5c..d1e831eb 100644
--- a/src/views/vab/upload.vue
+++ b/src/views/vab/upload.vue
@@ -3,10 +3,10 @@
 
 		<el-card shadow="never" header="基础示例">
 			<sc-upload v-model="imgurl"></sc-upload>
-			<sc-upload v-model="imgurl2" title="自定义标题" icon="el-icon-picture-outline"></sc-upload>
+			<sc-upload v-model="imgurl2" title="自定义标题" icon="el-icon-picture"></sc-upload>
 			<sc-upload v-model="imgurl3" :apiObj="uploadApi" accept=".xls,.xlsx" :on-success="success" :width="220">
 				<div class="custom-empty">
-					<i class="el-icon-upload"></i>
+					<el-icon><el-icon-upload /></el-icon>
 					<p>自定义插槽</p>
 				</div>
 			</sc-upload>
@@ -107,6 +107,6 @@
 	.imglist {margin-bottom:0;}
 	.imglist .el-col+.el-col {margin-left: 10px;}
 	.custom-empty {width: 100%;height: 100%;line-height: 1;display: flex;flex-direction: column;align-items: center;justify-content: center;}
-	.custom-empty i {font-size: 40px;color: #8c939d;}
+	.custom-empty i {font-size: 30px;color: #8c939d;}
 	.custom-empty p {font-size: 12px;font-weight: normal;color: #8c939d;margin-top: 10px;}
 </style>
diff --git a/vue.config.js b/vue.config.js
index 47e2506b..33359f70 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -36,7 +36,7 @@ module.exports = {
 		}
 		config.optimization = {
 			splitChunks: {
-				chunks: "async",
+				chunks: "all",
 				automaticNameDelimiter: '~',
 				name: true,
 				cacheGroups: {
@@ -46,6 +46,10 @@ module.exports = {
 						test: /[\\/]node_modules[\\/]/,
 						priority: -10
 					},
+					elicons: {
+						name: "elicons",
+						test: /[\\/]node_modules[\\/]@element-plus[\\/]icons[\\/]/
+					},
 					tinymce: {
 						name: "tinymce",
 						test: /[\\/]node_modules[\\/]tinymce[\\/]/