diff --git a/package.json b/package.json
index 9cd3a2085..8a0f82d7e 100644
--- a/package.json
+++ b/package.json
@@ -45,7 +45,7 @@
         "stylus-loader": "^6.2.0",
         "tinymce": "^5.10.3",
         "tui-calendar-hi": "^1.15.1-5",
-        "view-design-hi": "^4.7.0-24",
+        "view-design-hi": "^4.7.0-25",
         "vue": "^2.6.14",
         "vue-clipboard2": "^0.3.3",
         "vue-kityminder-ggg": "^1.3.10",
diff --git a/resources/assets/js/app.js b/resources/assets/js/app.js
index 26e52b71e..92adfad68 100644
--- a/resources/assets/js/app.js
+++ b/resources/assets/js/app.js
@@ -50,7 +50,6 @@ import {
     Dropdown,
     DropdownMenu,
     DropdownItem,
-    Progress,
 } from 'element-ui';
 
 Vue.component('EAvatar', Avatar);
@@ -59,7 +58,6 @@ Vue.component('EPopover', Popover);
 Vue.component('EDropdown', Dropdown);
 Vue.component('EDropdownMenu', DropdownMenu);
 Vue.component('EDropdownItem', DropdownItem);
-Vue.component('EProgress', Progress);
 
 const originalPush = VueRouter.prototype.push
 VueRouter.prototype.push = function push(location) {
diff --git a/resources/assets/js/functions/eeui.js b/resources/assets/js/functions/eeui.js
index f1b06276b..42d57496b 100755
--- a/resources/assets/js/functions/eeui.js
+++ b/resources/assets/js/functions/eeui.js
@@ -16,6 +16,11 @@
             requireModuleJs("eeui").alert(object, callback);
         },
 
+        eeuiAppToast(object) {
+            if (!$A.isEEUiApp) return;
+            requireModuleJs("eeui").toast(object);
+        },
+
         eeuiAppOpenPage(object, callback) {
             if (!$A.isEEUiApp) return;
             if (typeof callback !== "function") callback = _ => {};
diff --git a/resources/assets/js/pages/manage/components/ProjectArchived.vue b/resources/assets/js/pages/manage/components/ProjectArchived.vue
index 17e8f9c86..1d454a62e 100644
--- a/resources/assets/js/pages/manage/components/ProjectArchived.vue
+++ b/resources/assets/js/pages/manage/components/ProjectArchived.vue
@@ -166,7 +166,7 @@ export default {
                                 style: {
                                     fontSize: '13px',
                                     cursor: 'pointer',
-                                    color: '#8bcf70',
+                                    color: '#84C56A',
                                 },
                                 on: {
                                     'on-ok': () => {
diff --git a/resources/assets/js/pages/manage/components/ProjectList.vue b/resources/assets/js/pages/manage/components/ProjectList.vue
index 0663185b0..a716b82d1 100644
--- a/resources/assets/js/pages/manage/components/ProjectList.vue
+++ b/resources/assets/js/pages/manage/components/ProjectList.vue
@@ -33,13 +33,17 @@
                         </div>
                     </div>
                     <div v-if="item.task_num > 0" class="item-right" @click.stop="modalPercent(item)">
-                        <EProgress
+                        <iCircle
                             type="circle"
-                            color="#8bcf70"
-                            :percentage="item.task_percent"
-                            :status="item.task_percent >= 100 ? 'success' : ''"
-                            :width="60"
-                            :stroke-width="5"/>
+                            trail-color="rgba(132, 197, 106, 0.2)"
+                            :trail-width="8"
+                            :stroke-color="item.task_percent === 100 ? 'rgba(132, 197, 106, 0)' : '#84C56A'"
+                            :stroke-width="8"
+                            :percent="item.task_percent"
+                            :size="56">
+                            <Icon v-if="item.task_percent === 100" type="ios-checkmark"></Icon>
+                            <span v-else class="percent-text">{{item.task_percent}}%</span>
+                        </iCircle>
                     </div>
                 </div>
             </li>
diff --git a/resources/assets/js/pages/manage/components/TaskArchived.vue b/resources/assets/js/pages/manage/components/TaskArchived.vue
index d59f62171..83a098d2c 100644
--- a/resources/assets/js/pages/manage/components/TaskArchived.vue
+++ b/resources/assets/js/pages/manage/components/TaskArchived.vue
@@ -184,7 +184,7 @@ export default {
                                 style: {
                                     fontSize: '13px',
                                     cursor: 'pointer',
-                                    color: '#8bcf70',
+                                    color: '#84C56A',
                                 },
                                 on: {
                                     'click': () => {
@@ -203,7 +203,7 @@ export default {
                                     marginLeft: '6px',
                                     fontSize: '13px',
                                     cursor: 'pointer',
-                                    color: '#8bcf70',
+                                    color: '#84C56A',
                                 },
                                 on: {
                                     'on-ok': () => {
diff --git a/resources/assets/js/pages/manage/components/TaskDeleted.vue b/resources/assets/js/pages/manage/components/TaskDeleted.vue
index e54d963c0..1a8bf7237 100644
--- a/resources/assets/js/pages/manage/components/TaskDeleted.vue
+++ b/resources/assets/js/pages/manage/components/TaskDeleted.vue
@@ -170,7 +170,7 @@ export default {
                                 style: {
                                     fontSize: '13px',
                                     cursor: 'pointer',
-                                    color: '#8bcf70',
+                                    color: '#84C56A',
                                 },
                                 on: {
                                     'on-ok': () => {
diff --git a/resources/assets/js/pages/manage/file.vue b/resources/assets/js/pages/manage/file.vue
index 6aec9eb6e..6e16017d4 100644
--- a/resources/assets/js/pages/manage/file.vue
+++ b/resources/assets/js/pages/manage/file.vue
@@ -73,7 +73,7 @@
                         <p>{{$L('没有任何文件')}}</p>
                     </div>
                     <div v-else class="file-list" @contextmenu.prevent="handleRightClick">
-                        <ul class="clearfix">
+                        <ul>
                             <li
                                 v-for="item in fileList"
                                 :class="{
diff --git a/resources/assets/js/pages/manage/setting/components/SystemTaskPriority.vue b/resources/assets/js/pages/manage/setting/components/SystemTaskPriority.vue
index b59669c2f..a1f76df05 100644
--- a/resources/assets/js/pages/manage/setting/components/SystemTaskPriority.vue
+++ b/resources/assets/js/pages/manage/setting/components/SystemTaskPriority.vue
@@ -58,7 +58,7 @@ export default {
                 'name': '',
                 'priority': 1,
                 'days': 1,
-                'color': '#8bcf70',
+                'color': '#84C56A',
             }
         }
     },
diff --git a/resources/assets/sass/components/mobile.scss b/resources/assets/sass/components/mobile.scss
index dc65b9a8e..1d3226148 100644
--- a/resources/assets/sass/components/mobile.scss
+++ b/resources/assets/sass/components/mobile.scss
@@ -7,6 +7,7 @@
     bottom: 0;
     right: 0;
     z-index: 99;
+    user-select: none;
 
     .tabbar-box {
         position: relative;
diff --git a/resources/assets/sass/element.scss b/resources/assets/sass/element.scss
index 216fe7eab..0df34d3c5 100644
--- a/resources/assets/sass/element.scss
+++ b/resources/assets/sass/element.scss
@@ -14,7 +14,6 @@ $--dropdown-menuItem-hover-color: #606266;
 @import "~element-ui/packages/theme-chalk/src/dropdown-menu";
 @import "~element-ui/packages/theme-chalk/src/dropdown-item";
 @import "~element-ui/packages/theme-chalk/src/notification";
-@import "~element-ui/packages/theme-chalk/src/progress";
 
 
 .el-dropdown-menu__item {
diff --git a/resources/assets/sass/pages/components/chat-input.scss b/resources/assets/sass/pages/components/chat-input.scss
index ff9e2665f..79793e3a0 100755
--- a/resources/assets/sass/pages/components/chat-input.scss
+++ b/resources/assets/sass/pages/components/chat-input.scss
@@ -223,9 +223,10 @@
     .chat-emoji-box {
         width: 360px;
         height: 280px;
+        display: grid;
+        justify-content: space-between;
+        grid-template-columns: repeat(auto-fill, 40px);
         padding: 8px;
-        display: flex;
-        justify-content: space-around;
         flex-wrap: wrap;
         overflow-x: hidden;
         word-break: break-all;
@@ -252,6 +253,7 @@
         }
 
         &.emoticon {
+            grid-template-columns: repeat(auto-fill, 72px);
             > li {
                 width: 72px;
                 height: 72px;
@@ -530,16 +532,20 @@
             background-color: #ffffff;
             .chat-emoji-box {
                 height: 246px;
+                grid-template-columns: repeat(auto-fill, 50px);
                 > li {
                     width: 50px;
                     height: 50px;
                     line-height: 50px;
                     font-size: 28px;
                 }
-                &.emoticon > li {
-                    width: 80px;
-                    height: 80px;
-                    padding: 8px;
+                &.emoticon {
+                    grid-template-columns: repeat(auto-fill, 80px);
+                    > li {
+                        width: 80px;
+                        height: 80px;
+                        padding: 8px;
+                    }
                 }
             }
             .chat-emoji-menu {
diff --git a/resources/assets/sass/pages/components/project-list.scss b/resources/assets/sass/pages/components/project-list.scss
index aea0313f7..da347c9b2 100644
--- a/resources/assets/sass/pages/components/project-list.scss
+++ b/resources/assets/sass/pages/components/project-list.scss
@@ -54,6 +54,7 @@
         width: 100%;
         overflow: auto;
         background-color: #f8f8f8;
+        user-select: none;
         > li {
             padding: 16px;
             margin: 16px;
@@ -136,17 +137,15 @@
                     display: flex;
                     align-items: center;
                     margin-left: 28px;
-                    .el-progress {
-                        &.is-success {
-                            opacity: 0.5;
-                            .el-icon-check {
-                                font-size: 28px;
-                                font-weight: 900;
-                                color: $primary-color;
-                            }
+                    .ivu-chart-circle {
+                        .ivu-icon {
+                            font-size: 40px;
+                            font-weight: 900;
+                            color: rgba($primary-color, 0.25);
                         }
-                        .el-progress__text {
-                            font-size: 12px !important;
+                        .percent-text {
+                            color: $primary-color;
+                            font-weight: 600;
                         }
                     }
                 }
diff --git a/resources/assets/sass/pages/page-calendar.scss b/resources/assets/sass/pages/page-calendar.scss
index 6e4458b26..f6962e783 100644
--- a/resources/assets/sass/pages/page-calendar.scss
+++ b/resources/assets/sass/pages/page-calendar.scss
@@ -209,6 +209,7 @@
         }
         .calendar-box {
             padding: 0 24px 5px;
+            user-select: none;
         }
     }
 }
diff --git a/resources/assets/sass/pages/page-dashboard.scss b/resources/assets/sass/pages/page-dashboard.scss
index 16d20ee8b..7f915e1e6 100644
--- a/resources/assets/sass/pages/page-dashboard.scss
+++ b/resources/assets/sass/pages/page-dashboard.scss
@@ -302,6 +302,7 @@
                 padding-bottom: 2px;
                 .dashboard-ul {
                     margin-bottom: 36px;
+                    user-select: none;
                 }
             }
         }
diff --git a/resources/assets/sass/pages/page-file.scss b/resources/assets/sass/pages/page-file.scss
index af088865c..da7f6b5da 100644
--- a/resources/assets/sass/pages/page-file.scss
+++ b/resources/assets/sass/pages/page-file.scss
@@ -324,11 +324,12 @@
                 margin-top: 16px;
                 overflow: auto;
                 > ul {
-                    margin-top: -12px;
+                    display: grid;
+                    justify-content: space-between;
+                    grid-template-columns: repeat(auto-fill, 100px);
+                    grid-gap: 12px;
                     > li {
                         list-style: none;
-                        float: left;
-                        margin: 12px;
                         width: 100px;
                         height: 110px;
                         position: relative;
@@ -659,6 +660,12 @@
                 margin: 0 24px 0;
             }
             .file-drag {
+                .file-list {
+                    user-select: none;
+                    > ul {
+                        grid-gap: 4px;
+                    }
+                }
                 .file-table {
                     margin: 16px 24px 24px;
                 }
diff --git a/resources/assets/sass/pages/page-messenger.scss b/resources/assets/sass/pages/page-messenger.scss
index c1478014f..052257f50 100644
--- a/resources/assets/sass/pages/page-messenger.scss
+++ b/resources/assets/sass/pages/page-messenger.scss
@@ -453,6 +453,7 @@
                     overflow-x: hidden;
                     overflow-y: auto;
                     > ul {
+                        user-select: none;
                         &.dialog {
                             > li {
                                 .dialog-split {
diff --git a/resources/assets/sass/var.scss b/resources/assets/sass/var.scss
index ec440e036..4b6150baa 100644
--- a/resources/assets/sass/var.scss
+++ b/resources/assets/sass/var.scss
@@ -1,4 +1,4 @@
-$primary-color: #8bcf70;
+$primary-color: #84C56A;
 $primary-title-color: #303133;
 $primary-text-color: #606266;