You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@dolphinscheduler.apache.org by jo...@apache.org on 2020/01/09 08:52:04 UTC

[incubator-dolphinscheduler] branch dev-1.2.1 updated: merge dev branch front-end code (#1786)

This is an automated email from the ASF dual-hosted git repository.

journey pushed a commit to branch dev-1.2.1
in repository https://gitbox.apache.org/repos/asf/incubator-dolphinscheduler.git


The following commit(s) were added to refs/heads/dev-1.2.1 by this push:
     new 1490c70  merge dev branch front-end code (#1786)
1490c70 is described below

commit 1490c70544a0a4b27307d991183e3240d68f87bd
Author: break60 <79...@qq.com>
AuthorDate: Thu Jan 9 16:51:53 2020 +0800

    merge dev branch front-end code (#1786)
---
 .../src/js/conf/home/pages/dag/_source/dag.js      |  7 +-
 .../src/js/conf/home/pages/dag/_source/dag.scss    | 25 +++---
 .../src/js/conf/home/pages/dag/_source/dag.vue     | 20 +++--
 .../dag/_source/formModel/_source/selectInput.vue  |  4 +-
 .../pages/dag/_source/formModel/formModel.scss     |  2 -
 .../home/pages/dag/_source/formModel/formModel.vue | 97 +++++++++++++++++-----
 .../conf/home/pages/dag/_source/formModel/log.vue  |  8 +-
 .../_source/formModel/tasks/_source/datasource.vue | 17 +++-
 .../formModel/tasks/_source/dependItemList.vue     | 10 +--
 .../_source/formModel/tasks/_source/httpParams.vue |  6 +-
 .../formModel/tasks/_source/localParams.vue        |  6 +-
 .../_source/formModel/tasks/_source/scriptBox.vue  |  2 +-
 .../_source/formModel/tasks/_source/sqlType.vue    |  1 -
 .../formModel/tasks/_source/statementList.vue      |  6 +-
 .../dag/_source/formModel/tasks/_source/udfs.vue   |  6 +-
 .../dag/_source/formModel/tasks/dependent.vue      |  8 +-
 .../pages/dag/_source/formModel/tasks/http.vue     | 19 +++++
 .../pages/dag/_source/formModel/tasks/shell.vue    |  2 +-
 .../home/pages/dag/_source/formModel/tasks/sql.vue | 39 ++++++++-
 .../home/pages/dag/_source/jumpAffirm/index.js     |  1 -
 .../home/pages/dag/_source/plugIn/downChart.js     |  6 +-
 .../home/pages/dag/_source/plugIn/jsPlumbHandle.js |  8 +-
 .../js/conf/home/pages/dag/_source/plugIn/util.js  |  2 +-
 .../home/pages/dag/_source/startingParam/index.vue |  2 +-
 .../pages/dag/_source/variable/variablesView.vue   | 10 +--
 .../pages/list/_source/createDataSource.vue        | 18 ++--
 .../pages/datasource/pages/list/_source/list.vue   | 18 ++--
 .../home/pages/datasource/pages/list/index.vue     | 11 ++-
 .../pages/servers/_source/zookeeperList.vue        |  4 +-
 .../conf/home/pages/monitor/pages/servers/db.vue   | 12 +--
 .../home/pages/monitor/pages/servers/master.vue    |  2 +-
 .../home/pages/monitor/pages/servers/servers.scss  |  2 +-
 .../pages/monitor/pages/servers/statistics.vue     |  8 +-
 .../home/pages/monitor/pages/servers/worker.vue    |  2 +-
 .../pages/_source/instanceConditions/index.vue     |  4 +-
 .../_source/taskRecordList/_source/conditions.vue  |  4 +-
 .../pages/_source/taskRecordList/index.vue         |  4 +-
 .../pages/definition/pages/list/_source/email.vue  |  2 +-
 .../pages/definition/pages/list/_source/list.vue   | 18 ++--
 .../pages/definition/pages/list/_source/start.vue  |  4 +-
 .../pages/definition/pages/list/_source/timing.vue |  4 +-
 .../projects/pages/definition/pages/list/index.vue |  4 +-
 .../projects/pages/definition/pages/tree/index.vue |  4 +-
 .../projects/pages/instance/pages/gantt/index.vue  |  2 +-
 .../pages/instance/pages/list/_source/list.vue     | 26 +++---
 .../projects/pages/instance/pages/list/index.vue   |  4 +-
 .../projects/pages/list/_source/createProject.vue  |  3 +-
 .../pages/projects/pages/list/_source/list.vue     | 23 ++---
 .../conf/home/pages/projects/pages/list/index.vue  |  4 +-
 .../projects/pages/taskInstance/_source/list.vue   | 24 +++---
 .../resource/pages/file/pages/create/index.vue     |  7 +-
 .../resource/pages/file/pages/details/index.vue    |  2 +-
 .../pages/file/pages/list/_source/list.vue         | 16 ++--
 .../pages/file/pages/list/_source/rename.vue       |  2 +-
 .../pages/resource/pages/file/pages/list/index.vue |  9 +-
 .../pages/udf/pages/function/_source/createUdf.vue |  8 +-
 .../pages/udf/pages/function/_source/list.vue      | 22 ++---
 .../resource/pages/udf/pages/function/index.vue    |  6 +-
 .../pages/udf/pages/resource/_source/list.vue      | 18 ++--
 .../pages/udf/pages/resource/_source/rename.vue    |  3 +-
 .../resource/pages/udf/pages/resource/index.vue    |  9 +-
 .../security/pages/queue/_source/createQueue.vue   |  6 +-
 .../conf/home/pages/security/pages/queue/index.vue |  4 +-
 .../pages/tenement/_source/createTenement.vue      |  8 +-
 .../pages/security/pages/tenement/_source/list.vue |  2 +-
 .../home/pages/security/pages/tenement/index.vue   |  8 +-
 .../security/pages/users/_source/createUser.vue    | 12 +--
 .../pages/security/pages/users/_source/list.vue    |  2 +-
 .../conf/home/pages/security/pages/users/index.vue |  8 +-
 .../pages/warningGroups/_source/createWarning.vue  |  5 +-
 .../security/pages/warningGroups/_source/list.vue  |  2 +-
 .../pages/security/pages/warningGroups/index.vue   |  8 +-
 .../pages/workerGroups/_source/createWorker.vue    |  5 +-
 .../security/pages/workerGroups/_source/list.vue   |  2 +-
 .../pages/security/pages/workerGroups/index.vue    | 10 ++-
 .../pages/user/pages/token/_source/createToken.vue |  4 +-
 .../home/pages/user/pages/token/_source/list.vue   |  2 +-
 .../js/conf/home/pages/user/pages/token/index.vue  | 11 ++-
 .../src/js/conf/home/store/dag/actions.js          |  5 ++
 .../src/js/conf/home/store/dag/mutations.js        | 17 ++++
 .../src/js/conf/home/store/dag/state.js            |  2 +
 .../crontab/source/_source/input-number.vue        |  2 +-
 .../js/module/components/crontab/source/app.vue    | 12 +--
 .../components/fileUpdate/definitionUpdate.vue     |  9 +-
 .../js/module/components/fileUpdate/fileUpdate.vue | 10 +--
 .../src/js/module/components/listBoxF/listBoxF.vue |  2 +-
 .../src/js/module/components/nav/nav.vue           | 40 ++++-----
 .../src/js/module/components/priority/priority.vue |  6 +-
 .../components/secondaryMenu/secondaryMenu.vue     |  8 +-
 .../components/tooltipsJSON/tooltipsJSON.vue       |  4 +-
 .../src/js/module/components/transfer/resource.vue |  4 +-
 .../src/js/module/components/transfer/transfer.vue |  4 +-
 dolphinscheduler-ui/src/sass/common/index.scss     | 24 ++----
 93 files changed, 527 insertions(+), 348 deletions(-)

diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.js b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.js
index 11f2213..8225673 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.js
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.js
@@ -177,8 +177,6 @@ Dag.prototype.backfill = function (arg) {
       // Number of tree node levels
       let countTree = getLeafCountTree(datas[0])
       function getMaxFloor(treeData) {
-        let floor = 0
-        let v = this
         let max = 0
         function each (data, floor) {
           data.forEach(e => {
@@ -224,9 +222,8 @@ Dag.prototype.backfill = function (arg) {
           return []
         }
         function toLine(data){
-          return data.reduce((arr, {id, name, targetarr, x, y, children = []}) =>
-          arr.concat([{id, name, targetarr, x, y}], toLine(children)), [])
-          return result;
+          return data.reduce((arrData, {id, name, targetarr, x, y, children = []}) =>
+          arrData.concat([{id, name, targetarr, x, y}], toLine(children)), [])
         }
         let listarr = toLine(datas);
         let listarrs = toLine(datas)
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.scss b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.scss
index f6b7ddf..237e6f5 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.scss
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.scss
@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
- .dag-model {
+.dag-model {
   background: url("../img/dag_bg.png");
   height: calc(100vh - 100px);
   ::selection {
@@ -317,6 +317,7 @@ svg path:hover {
 .jtk-demo-canvas {
   position: relative;
   height: 100%;
+  display: flex;
 }
 
 .jtk-bootstrap {
@@ -359,10 +360,6 @@ svg path:hover {
   list-style-type: disc !important;
 }
 
-.jtk-demo-canvas {
-  display: flex;
-}
-
 .canvas-wide {
   padding-top: 10px;
   margin-left: 0;
@@ -459,6 +456,12 @@ svg path:hover {
   -webkit-transition: background-color 0.25s ease-in;
   -moz-transition: background-color 0.25s ease-in;
   transition: background-color 0.25s ease-in;
+  background-color: white;
+  opacity: 0.8;
+  padding: 0.3em;
+  border-radius: 0.5em;
+  border: 1px solid #346789;
+  cursor: pointer;
 }
 
 .aLabel.jtk-hover,
@@ -485,14 +488,6 @@ svg path:hover {
   }
 }
 
-.aLabel {
-  background-color: white;
-  opacity: 0.8;
-  padding: 0.3em;
-  border-radius: 0.5em;
-  border: 1px solid #346789;
-  cursor: pointer;
-}
 
 .jtk-ep {
   .ep {
@@ -551,4 +546,6 @@ svg path:hover {
 .ans-drawer.ans-drawer-right {
   width: 628px;
   left: auto;
-}
\ No newline at end of file
+}
+
+
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.vue
index 3b70f01..feb756d 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.vue
@@ -58,7 +58,7 @@
           </x-button>
           <span class="name">{{name}}</span>
           &nbsp;
-          <span v-if="name"  class="copy-name" @click="_copyName" :data-clipboard-text="name"><i class="ans-icon-copy" data-container="body"  data-toggle="tooltip" :title="$t('Copy name')" ></i></span>
+          <span v-if="name"  class="copy-name" @click="_copyName" :data-clipboard-text="name"><em class="ans-icon-copy" data-container="body"  data-toggle="tooltip" :title="$t('Copy name')" ></em></span>
         </div>
         <div class="save-btn">
           <div class="operation" style="vertical-align: middle;">
@@ -68,7 +68,7 @@
                :id="item.code"
                :key="$index"
                @click="_ckOperation(item,$event)">
-              <i :class="item.icon" data-toggle="tooltip" :title="item.description" ></i>
+              <em :class="item.icon" data-toggle="tooltip" :title="item.description" ></em>
             </a>
           </div>
           <x-button type="text" icon="ans-icon-triangle-solid-right" @click="dagAutomaticLayout"></x-button>
@@ -156,8 +156,8 @@
     },
     methods: {
       ...mapActions('dag', ['saveDAGchart', 'updateInstance', 'updateDefinition', 'getTaskState']),
-      ...mapMutations('dag', ['addTasks', 'resetParams', 'setIsEditDag', 'setName']),
-      
+      ...mapMutations('dag', ['addTasks', 'cacheTasks', 'resetParams', 'setIsEditDag', 'setName']),
+
       // DAG automatic layout
       dagAutomaticLayout() {
         $('#canvas').html('')
@@ -257,8 +257,8 @@
                   let state = dom.find('.state-p')
                   dom.attr('data-state-id', v1.stateId)
                   dom.attr('data-dependent-result', v1.dependentResult || '')
-                  state.append(`<b class="${v1.icoUnicode} ${v1.isSpin ? 'as as-spin' : ''}" style="color:${v1.color}" data-toggle="tooltip" data-html="true" data-container="body"></b>`)
-                  state.find('b').attr('title', titleTpl(v2, v1.desc))
+                  state.append(`<strong class="${v1.icoUnicode} ${v1.isSpin ? 'as as-spin' : ''}" style="color:${v1.color}" data-toggle="tooltip" data-html="true" data-container="body"></strong>`)
+                  state.find('strong').attr('title', titleTpl(v2, v1.desc))
                 }
               })
             })
@@ -495,6 +495,14 @@
                   removeNodesEvent(fromThis)
                 }, 100)
               },
+              /**
+               * Cache the item
+               * @param item
+               * @param fromThis
+               */
+              cacheTaskInfo({item, fromThis}) {
+                self.cacheTasks(item)
+              },
               close ({ flag, fromThis }) {
                 // Edit status does not allow deletion of nodes
                 if (flag) {
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/_source/selectInput.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/_source/selectInput.vue
index f04e8f4..1d3902c 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/_source/selectInput.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/_source/selectInput.vue
@@ -32,8 +32,8 @@
               :value="selectedModel === null ? '0' : selectedModel.value"
               style="width: 100%;"
               @on-click-icon.stop="_ckIcon">
-        <i slot="suffix" class="ans-icon-fail-solid" style="font-size: 15px;cursor: pointer;" v-show="!isIconState"></i>
-        <i slot="suffix" class="ans-icon-arrow-down" style="font-size: 12px;" v-show="isIconState"></i>
+        <em slot="suffix" class="ans-icon-fail-solid" style="font-size: 15px;cursor: pointer;" v-show="!isIconState"></em>
+        <em slot="suffix" class="ans-icon-arrow-down" style="font-size: 12px;" v-show="isIconState"></em>
       </x-input>
     <x-option
             v-for="city in list"
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/formModel.scss b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/formModel.scss
index abe06b9..9d9667f 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/formModel.scss
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/formModel.scss
@@ -115,8 +115,6 @@
         color: #0097e0;
       }
     }
-    &:hover {
-    }
     .list-t {
       width: 50%;
       float: left;
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/formModel.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/formModel.vue
index 59307fa..9d6a10f 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/formModel.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/formModel.vue
@@ -16,15 +16,15 @@
  */
 <template>
   <div class="form-model-model" v-clickoutside="_handleClose">
-    <div class="title-box"> 
+    <div class="title-box">
       <span class="name">{{$t('Current node settings')}}</span>
       <span class="go-subtask">
         <!-- Component can't pop up box to do component processing -->
         <m-log :item="backfillItem">
-          <template slot="history"><a href="javascript:" @click="_seeHistory" ><i class="ansicon ans-icon-timer"></i><em>{{$t('View history')}}</em></a></template>
-          <template slot="log"><a href="javascript:"><i class="ansicon ans-icon-log"></i><em>{{$t('View log')}}</em></a></template>
+          <template slot="history"><a href="javascript:" @click="_seeHistory" ><em class="ansicon ans-icon-timer"></em><em>{{$t('View history')}}</em></a></template>
+          <template slot="log"><a href="javascript:"><em class="ansicon ans-icon-log"></em><em>{{$t('View log')}}</em></a></template>
         </m-log>
-        <a href="javascript:" @click="_goSubProcess" v-if="_isGoSubProcess"><i class="ansicon ans-icon-node"></i><em>{{$t('Enter this child node')}}</em></a>
+        <a href="javascript:" @click="_goSubProcess" v-if="_isGoSubProcess"><em class="ansicon ans-icon-node"></em><em>{{$t('Enter this child node')}}</em></a>
       </span>
     </div>
     <div class="content-box" v-if="isContentBox">
@@ -143,6 +143,7 @@
         <m-sql
           v-if="taskType === 'SQL'"
           @on-params="_onParams"
+          @on-cache-params="_onCacheParams"
           ref="SQL"
           :create-node-id="id"
           :backfill-item="backfillItem">
@@ -184,6 +185,7 @@
         <m-http
           v-if="taskType === 'HTTP'"
           @on-params="_onParams"
+          @on-cache-params="_onCacheParams"
           ref="HTTP"
           :backfill-item="backfillItem">
         </m-http>
@@ -333,6 +335,31 @@
       _onParams (o) {
         this.params = Object.assign(this.params, {}, o)
       },
+
+      _onCacheParams (o) {
+        this.params = Object.assign(this.params, {}, o)
+        this._cacheItem()
+      },
+
+      _cacheItem () {
+        this.$emit('cacheTaskInfo', {
+          item: {
+            type: this.taskType,
+            id: this.id,
+            name: this.name,
+            params: this.params,
+            description: this.description,
+            runFlag: this.runFlag,
+            dependence: this.dependence,
+            maxRetryTimes: this.maxRetryTimes,
+            retryInterval: this.retryInterval,
+            timeout: this.timeout,
+            taskInstancePriority: this.taskInstancePriority,
+            workerGroupId: this.workerGroupId
+          },
+          fromThis: this
+        })
+      },
       /**
        * verification name
        */
@@ -431,29 +458,43 @@
       }
     },
     watch: {
-
+      /**
+       * Watch the item change, cache the value it changes
+       **/
+      _item (val) {
+        this._cacheItem()
+      }
     },
     created () {
       // Unbind copy and paste events
       JSP.removePaste()
       // Backfill data
       let taskList = this.store.state.dag.tasks
+
+      //fillback use cacheTasks
+      let cacheTasks = this.store.state.dag.cacheTasks
       let o = {}
-      if (taskList.length) {
-        taskList.forEach(v => {
-          if (v.id === this.id) {
-          o = v
-          this.backfillItem = v
+      if (cacheTasks[this.id]) {
+        o = cacheTasks[this.id]
+        this.backfillItem = cacheTasks[this.id]
+      } else {
+        if (taskList.length) {
+          taskList.forEach(v => {
+            if (v.id === this.id) {
+              o = v
+              this.backfillItem = v
+            }
+          })
         }
-      })
-        // Non-null objects represent backfill
-        if (!_.isEmpty(o)) {
-          this.name = o.name
-          this.taskInstancePriority = o.taskInstancePriority
-          this.runFlag = o.runFlag || 'NORMAL'
-          this.description = o.description
-          this.maxRetryTimes = o.maxRetryTimes
-          this.retryInterval = o.retryInterval
+      }
+      // Non-null objects represent backfill
+      if (!_.isEmpty(o)) {
+        this.name = o.name
+        this.taskInstancePriority = o.taskInstancePriority
+        this.runFlag = o.runFlag || 'NORMAL'
+        this.description = o.description
+        this.maxRetryTimes = o.maxRetryTimes
+        this.retryInterval = o.retryInterval
 
           // If the workergroup has been deleted, set the default workergroup
           var hasMatch = false;
@@ -471,7 +512,6 @@
             this.workerGroupId = o.workerGroupId
           }
 
-        }
       }
       this.isContentBox = true
     },
@@ -490,6 +530,23 @@
        */
       _isGoSubProcess () {
         return this.taskType === 'SUB_PROCESS' && this.name
+      },
+
+      //Define the item model
+      _item () {
+        return {
+          type: this.taskType,
+          id: this.id,
+          name: this.name,
+          description: this.description,
+          runFlag: this.runFlag,
+          dependence: this.dependence,
+          maxRetryTimes: this.maxRetryTimes,
+          retryInterval: this.retryInterval,
+          timeout: this.timeout,
+          taskInstancePriority: this.taskInstancePriority,
+          workerGroupId: this.workerGroupId
+        }
       }
     },
     components: {
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/log.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/log.vue
index 7ec9cdf..dbe3e1d 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/log.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/log.vue
@@ -29,16 +29,16 @@
             <span>{{$t('View log')}}</span>
             <div class="full-screen">
               <a href="javascript:" @click="_downloadLog" data-container="body" data-toggle="tooltip" :title="$t('Download Log')">
-                <i class="ans-icon-download" style="font-size: 20px"></i>
+                <em class="ans-icon-download" style="font-size: 20px"></em>
               </a>
               <a href="javascript:" class="refresh-log" :class="loading ? 'active' :''" @click="!loading && _refreshLog()" data-container="body" data-toggle="tooltip" :title="$t('Refresh Log')">
-                <i class="ans-icon-refresh"></i>
+                <em class="ans-icon-refresh"></em>
               </a>
               <a href="javascript:" @click="_screenOpen" v-show="!isScreen" data-container="body" data-toggle="tooltip" :title="$t('Enter full screen')">
-                <i class="ans-icon-max"></i>
+                <em class="ans-icon-max"></em>
               </a>
               <a href="javascript:" @click="_screenClose" v-show="isScreen" data-container="body" data-toggle="tooltip" :title="$t('Cancel full screen')">
-                <i class="ans-icon-min"></i>
+                <em class="ans-icon-min"></em>
               </a>
             </div>
           </div>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/datasource.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/datasource.vue
index 8bf855b..aa067d8 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/datasource.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/datasource.vue
@@ -112,7 +112,20 @@
         })
       }
     },
-    watch: {},
+    computed: {
+      cacheParams () {
+        return {
+          type: this.type,
+          datasource: this.datasource
+        }
+      }
+    },
+    // Watch the cacheParams
+    watch: {
+      cacheParams (val) {
+        this.$emit('on-dsData', val);
+      }
+    },
     created () {
       let supportType = this.supportType || []
       this.typeList = _.cloneDeep(this.store.state.dag.dsTypeListS)
@@ -146,4 +159,4 @@
     },
     components: { }
   }
-</script>
\ No newline at end of file
+</script>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/dependItemList.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/dependItemList.vue
index 8ae0a78..d6c8657 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/dependItemList.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/dependItemList.vue
@@ -39,17 +39,17 @@
       </x-select>
       <template v-if="isInstance">
         <span class="instance-state">
-          <i class="iconfont ans-icon-success-solid" :class="'icon-' + el.state" v-if="el.state === 'SUCCESS'" data-toggle="tooltip" data-container="body" :title="$t('success')"></i>
-          <i class="iconfont ans-icon-clock" :class="'icon-' + el.state" v-if="el.state === 'WAITING'" data-toggle="tooltip" data-container="body" :title="$t('waiting')"></i>
-          <i class="iconfont ans-icon-fail-solid" :class="'icon-' + el.state" v-if="el.state === 'FAILED'" data-toggle="tooltip" data-container="body" :title="$t('failed')"></i>
+          <em class="iconfont ans-icon-success-solid" :class="'icon-' + el.state" v-if="el.state === 'SUCCESS'" data-toggle="tooltip" data-container="body" :title="$t('success')"></em>
+          <em class="iconfont ans-icon-clock" :class="'icon-' + el.state" v-if="el.state === 'WAITING'" data-toggle="tooltip" data-container="body" :title="$t('waiting')"></em>
+          <em class="iconfont ans-icon-fail-solid" :class="'icon-' + el.state" v-if="el.state === 'FAILED'" data-toggle="tooltip" data-container="body" :title="$t('failed')"></em>
         </span>
       </template>
       <span class="operation">
         <a href="javascript:" class="delete" @click="!isDetails && _remove($index)">
-          <i class="ans-icon-trash" :class="_isDetails" data-toggle="tooltip" data-container="body" :title="$t('delete')" ></i>
+          <em class="ans-icon-trash" :class="_isDetails" data-toggle="tooltip" data-container="body" :title="$t('delete')" ></em>
         </a>
         <a href="javascript:" class="add" @click="!isDetails && _add()" v-if="$index === (dependItemList.length - 1)">
-          <i class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" data-container="body" :title="$t('Add')"></i>
+          <em class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" data-container="body" :title="$t('Add')"></em>
         </a>
       </span>
     </div>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/httpParams.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/httpParams.vue
index c5e635b..de5f781 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/httpParams.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/httpParams.vue
@@ -52,18 +52,18 @@
       </x-input>
       <span class="lt-add">
         <a href="javascript:" style="color:red;" @click="!isDetails && _removeUdp($index)" >
-          <i class="ans-icon-trash" :class="_isDetails" data-toggle="tooltip" :title="$t('delete')" ></i>
+          <em class="ans-icon-trash" :class="_isDetails" data-toggle="tooltip" :title="$t('delete')" ></em>
         </a>
       </span>
       <span class="add" v-if="$index === (httpParamsList.length - 1)">
         <a href="javascript:" @click="!isDetails && _addUdp()" >
-          <i class="ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></i>
+          <em class="ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
         </a>
       </span>
     </div>
     <span class="add-dp" v-if="!httpParamsList.length">
       <a href="javascript:" @click="!isDetails && _addUdp()" >
-        <i class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></i>
+        <em class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
       </a>
     </span>
   </div>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/localParams.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/localParams.vue
index 2b4ade1..0bbbb66 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/localParams.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/localParams.vue
@@ -66,18 +66,18 @@
       </x-input>
       <span class="lt-add">
         <a href="javascript:" style="color:red;" @click="!isDetails && _removeUdp($index)" >
-          <i class="ans-icon-trash" :class="_isDetails" data-toggle="tooltip" :title="$t('delete')" ></i>
+          <em class="ans-icon-trash" :class="_isDetails" data-toggle="tooltip" :title="$t('delete')" ></em>
         </a>
       </span>
       <span class="add" v-if="$index === (localParamsList.length - 1)">
         <a href="javascript:" @click="!isDetails && _addUdp()" >
-          <i class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></i>
+          <em class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
         </a>
       </span>
     </div>
     <span class="add-dp" v-if="!localParamsList.length">
       <a href="javascript:" @click="!isDetails && _addUdp()" >
-        <i class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></i>
+        <em class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
       </a>
     </span>
   </div>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/scriptBox.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/scriptBox.vue
index c16d18c..91e1cb7 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/scriptBox.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/scriptBox.vue
@@ -28,7 +28,7 @@
       </div>
     </m-list-box>
     <a class="ans-modal-box-close">
-      <i class="ans-icon-min" @click="closeModal"></i>
+      <em class="ans-icon-min" @click="closeModal"></em>
     </a>
   </div>
 </template>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/sqlType.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/sqlType.vue
index 6cad8f1..49fb4a2 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/sqlType.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/sqlType.vue
@@ -60,7 +60,6 @@
     },
     created () {
       this.$nextTick(() => {
-        console.log(this.sqlType)
         if (this.sqlType != 0) {
           this.sqlTypeId = this.sqlType
         } else {
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/statementList.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/statementList.vue
index 226e232..ecd10a9 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/statementList.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/statementList.vue
@@ -32,18 +32,18 @@
       </x-input>
       <span class="lt-add">
         <a href="javascript:" style="color:red;" @click="!isDetails && _removeStatement($index)" >
-          <i class="ans-icon-trash" :class="_isDetails" data-toggle="tooltip" :title="$t('delete')" ></i>
+          <em class="ans-icon-trash" :class="_isDetails" data-toggle="tooltip" :title="$t('delete')" ></em>
         </a>
       </span>
       <span class="add" v-if="$index === (localStatementList.length - 1)">
         <a href="javascript:" @click="!isDetails && _addStatement()" >
-          <i class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></i>
+          <em class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
         </a>
       </span>
     </div>
     <span class="add" v-if="!localStatementList.length">
       <a href="javascript:" @click="!isDetails && _addStatement()" >
-        <i class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></i>
+        <em class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
       </a>
     </span>
   </div>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/udfs.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/udfs.vue
index cc81593..87ede38 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/udfs.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/_source/udfs.vue
@@ -53,7 +53,7 @@
        * verification
        */
       _verifUdfs () {
-        this.$emit('on-udfsData', _.map(this.udfsStr, v => v.id).join(','))
+        this.$emit('on-udfsData', this.udfsStr.join(','))
         return true
       },
       /**
@@ -68,7 +68,6 @@
               code: v.funcName
             }
           })
-
           let udfs = _.cloneDeep(this.udfs.split(','))
           if (udfs.length) {
             let arr = []
@@ -87,6 +86,9 @@
       }
     },
     watch: {
+      udfsStr (val) {
+        this._verifUdfs()
+      },
       type (a) {
         // The props parameter needs to be changed due to the scene.
         this.udfs = ''
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/dependent.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/dependent.vue
index 785a4fe..cca9ec7 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/dependent.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/dependent.vue
@@ -23,8 +23,8 @@
           <a href="javascript:"
              @click="!isDetails && _addDep()"
              class="add-dep">
-            <i v-if="!isLoading" class="ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></i>
-            <i v-if="isLoading" class="ans-icon-spinner2 as as-spin" data-toggle="tooltip" :title="$t('Add')"></i>
+            <em v-if="!isLoading" class="ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
+            <em v-if="isLoading" class="ans-icon-spinner2 as as-spin" data-toggle="tooltip" :title="$t('Add')"></em>
           </a>
         </div>
         <div class="dep-box">
@@ -40,13 +40,13 @@
                   @click="!isDetails && _setRelation($index)">
               {{el.relation === 'AND' ? $t('and') : $t('or')}}
             </span>
-            <i class="ans-icon-trash dep-delete"
+            <em class="ans-icon-trash dep-delete"
                data-toggle="tooltip"
                data-container="body"
                :class="_isDetails"
                @click="!isDetails && _deleteDep($index)"
                :title="$t('delete')" >
-            </i>
+            </em>
             <m-depend-item-list
               :dependTaskList='dependTaskList'
               v-model="el.dependItemList"
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/http.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/http.vue
index adb5441..3e2f6ef 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/http.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/http.vue
@@ -164,7 +164,26 @@
         return true
       }
     },
+    computed: {
+      cacheParams () {
+        return {
+          localParams: this.localParams,
+          httpParams: this.httpParams,
+          url: this.url,
+          httpMethod: this.httpMethod,
+          httpCheckCondition: this.httpCheckCondition,
+          condition: this.condition
+        }
+      }
+    },
     watch: {
+      /**
+       * Watch the cacheParams
+       * @param val
+       */
+      cacheParams (val) {
+        this.$emit('on-cache-params', val);
+      }
     },
     created () {
         let o = this.backfillItem
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/shell.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/shell.vue
index 8b45e7c..17184ee 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/shell.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/shell.vue
@@ -26,7 +26,7 @@
             style="opacity: 0">
           </textarea>
           <a class="ans-modal-box-max">
-            <i class="ans-icon-max" @click="setEditorVal"></i>
+            <em class="ans-icon-max" @click="setEditorVal"></em>
           </a>
         </div>
       </div>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/sql.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/sql.vue
index 9cef7bb..eb5c409 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/sql.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/sql.vue
@@ -45,7 +45,7 @@
     </m-list-box>
     <template v-if="sqlType==0">
       <m-list-box>
-        <div slot="text"><b class='requiredIcon'>*</b>{{$t('Title')}}</div>
+        <div slot="text"><strong class='requiredIcon'>*</strong>{{$t('Title')}}</div>
         <div slot="content">
           <x-input
             type="input"
@@ -56,7 +56,7 @@
         </div>
       </m-list-box>
       <m-list-box>
-        <div slot="text"><b class='requiredIcon'>*</b>{{$t('Recipient')}}</div>
+        <div slot="text"><strong class='requiredIcon'>*</strong>{{$t('Recipient')}}</div>
         <div slot="content">
           <m-email ref="refEmail" v-model="receivers" :disabled="isDetails" :repeat-data="receiversCc"></m-email>
         </div>
@@ -371,6 +371,10 @@
           this.connParams = ''
         }
       },
+      //Watch the cacheParams
+      cacheParams (val) {
+        this.$emit('on-cache-params', val);
+      }
     },
     created () {
       let o = this.backfillItem
@@ -396,7 +400,8 @@
         this.receivers = o.params.receivers && o.params.receivers.split(',') || []
         this.receiversCc = o.params.receiversCc && o.params.receiversCc.split(',') || []
       }
-      if (!_.some(this.store.state.dag.tasks, { id: this.createNodeId }) &&
+      // read tasks from cache
+      if (!_.some(this.store.state.dag.cacheTasks, { id: this.createNodeId }) &&
         this.router.history.current.name !== 'definition-create') {
         this._getReceiver()
       }
@@ -415,7 +420,33 @@
         editor.off($('.code-sql-mirror'), 'keypress', this.keypress)
       }
     },
-    computed: {},
+    computed: {
+      cacheParams () {
+        return {
+          type: this.type,
+          datasource: this.rtDatasource,
+          sql: editor ? editor.getValue() : '',
+          udfs: this.udfs,
+          sqlType: this.sqlType,
+          title: this.title,
+          receivers: this.receivers.join(','),
+          receiversCc: this.receiversCc.join(','),
+          showType: (() => {
+
+            let showType = this.showType
+            if (showType.length === 2 && showType[0] === 'ATTACHMENT') {
+              return [showType[1], showType[0]].join(',')
+            } else {
+              return showType.join(',')
+            }
+          })(),
+          localParams: this.localParams,
+          connParams: this.connParams,
+          preStatements: this.preStatements,
+          postStatements: this.postStatements
+        }
+      }
+    },
     components: { mListBox, mDatasource, mLocalParams, mUdfs, mSqlType, mStatementList, mEmail }
   }
 </script>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/jumpAffirm/index.js b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/jumpAffirm/index.js
index 72e7d5a..6ac87b3 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/jumpAffirm/index.js
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/jumpAffirm/index.js
@@ -67,7 +67,6 @@ Affirm.paramVerification = (name) => {
       if (!dagStore.name) {
         store.commit('dag/setName', `${uuid('dag_')}${uuid() + uuid()}`)
       }
-      flag = false
     } else {
       flag = true
     }
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/downChart.js b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/downChart.js
index 8ee991f..3dd1389 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/downChart.js
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/downChart.js
@@ -54,12 +54,12 @@ DownChart.prototype.download = function ({ dagThis }) {
     const copyDom = $('#canvas')
     // gain
     const scale = 1
-    // svg handle
-    const nodesToRecover = []
-    const nodesToRemove = []
     // divReport is the id of the dom that needs to be intercepted into a picture
     const svgElem = copyDom.find('svg')
     svgElem.each((index, node) => {
+      // svg handle
+      const nodesToRecover = []
+      const nodesToRemove = []
       let parentNode = node.parentNode
       let svg = node.outerHTML.trim()
       let canvas = document.createElement('canvas')
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/jsPlumbHandle.js b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/jsPlumbHandle.js
index a918b80..6523a1c 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/jsPlumbHandle.js
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/jsPlumbHandle.js
@@ -266,10 +266,10 @@ JSP.prototype.tasksContextmenu = function (event) {
     let isTwo = store.state.dag.isDetails
 
     let html = [
-      `<a href="javascript:" id="startRunning" class="${isOne ? '' : 'disbled'}"><i class="ans-icon-play"></i><span>${i18n.$t('Start')}</span></a>`,
-      `<a href="javascript:" id="editNodes" class="${isTwo ? 'disbled' : ''}"><i class="ans-icon-edit"></i><span>${i18n.$t('Edit')}</span></a>`,
-      `<a href="javascript:" id="copyNodes" class="${isTwo ? 'disbled' : ''}"><i class="ans-icon-copy"></i><span>${i18n.$t('Copy')}</span></a>`,
-      `<a href="javascript:" id="removeNodes" class="${isTwo ? 'disbled' : ''}"><i class="ans-icon-trash"></i><span>${i18n.$t('Delete')}</span></a>`
+      `<a href="javascript:" id="startRunning" class="${isOne ? '' : 'disbled'}"><em class="ans-icon-play"></em><span>${i18n.$t('Start')}</span></a>`,
+      `<a href="javascript:" id="editNodes" class="${isTwo ? 'disbled' : ''}"><em class="ans-icon-edit"></em><span>${i18n.$t('Edit')}</span></a>`,
+      `<a href="javascript:" id="copyNodes" class="${isTwo ? 'disbled' : ''}"><em class="ans-icon-copy"></em><span>${i18n.$t('Copy')}</span></a>`,
+      `<a href="javascript:" id="removeNodes" class="${isTwo ? 'disbled' : ''}"><em class="ans-icon-trash"></em><span>${i18n.$t('Delete')}</span></a>`
     ]
 
     let operationHtml = () => {
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/util.js b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/util.js
index d9338a0..c10dfda 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/util.js
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/util.js
@@ -37,7 +37,7 @@ const saveTargetarr = (valId, domId) => {
 }
 
 const rtBantpl = () => {
-  return `<i class="ans-icon-forbidden" data-toggle="tooltip" data-html="true" data-container="body" data-placement="left" title="${i18n.$t('Prohibition execution')}"></i>`
+  return `<em class="ans-icon-forbidden" data-toggle="tooltip" data-html="true" data-container="body" data-placement="left" title="${i18n.$t('Prohibition execution')}"></em>`
 }
 
 /**
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/startingParam/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/startingParam/index.vue
index d5956a4..892cead 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/startingParam/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/startingParam/index.vue
@@ -18,7 +18,7 @@
   <div class="starting-params-dag-index">
     <template v-if="isView && isActive">
        <div class="box">
-         <p class="box-hd"><i class="fa ans-icon-arrow-circle-right"></i><b>{{$t('Startup parameter')}}</b></p>
+         <p class="box-hd"><em class="fa ans-icon-arrow-circle-right"></em><strong>{{$t('Startup parameter')}}</strong></p>
          <ul class="box-bd">
            <li><span class="tab">{{$t('Startup type')}}:</span><span class="content">{{_rtRunningType(startupParam.commandType)}}</span></li>
            <li><span class="tab">{{$t('Complement range')}}:</span><span class="content" v-if="startupParam.commandParam && startupParam.commandParam.complementStartDate">{{startupParam.commandParam.complementStartDate}}-{{startupParam.commandParam.complementEndDate}}</span><span class="content" v-else>-</span></li>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/variable/variablesView.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/variable/variablesView.vue
index d139e5d..7209c4d 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/variable/variablesView.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/variable/variablesView.vue
@@ -18,7 +18,7 @@
   <div class="variable-model">
     <template v-if="list">
       <div class="list">
-        <div class="name"><i class="fa ans-icon-code"></i><b style="padding-top: 3px;display: inline-block">{{$t('Global parameters')}}</b></div>
+        <div class="name"><em class="fa ans-icon-code"></em><strong style="padding-top: 3px;display: inline-block">{{$t('Global parameters')}}</strong></div>
         <div class="var-cont">
           <template v-for="(item,$index) in list.globalParams">
             <x-button
@@ -28,13 +28,13 @@
                     :key="$index"
                     :data-clipboard-text="item.prop + ' = ' +item.value"
                     :class="'gbudp-' + $index">
-              <b style="color: #2A455B;">{{item.prop}}</b> = {{item.value}}
+              <strong style="color: #2A455B;">{{item.prop}}</strong> = {{item.value}}
             </x-button>
           </template>
         </div>
       </div>
       <div class="list" style="height: 30px;">
-        <div class="name"><i class="fa ans-icon-code"></i><b style="padding-top: 3px;display: inline-block">{{$t('Local parameters')}}</b></div>
+        <div class="name"><em class="fa ans-icon-code"></em><strong style="padding-top: 3px;display: inline-block">{{$t('Local parameters')}}</strong></div>
         <div class="var-cont">
           &nbsp;
         </div>
@@ -47,11 +47,11 @@
               <span v-for="(e,k,i) in el" :key="i">
                 <template v-if="item.taskType === 'SQL' || item.taskType === 'PROCEDURE'">
                   <template v-if="(k !== 'direct' && k !== 'type')">
-                    <b style="color: #2A455B;">{{k}}</b> = {{e}}
+                    <strong style="color: #2A455B;">{{k}}</strong> = {{e}}
                   </template>
                 </template>
                 <template v-else>
-                  <b style="color: #2A455B;">{{k}}</b> = {{e}}
+                  <strong style="color: #2A455B;">{{k}}</strong> = {{e}}
                 </template>
               </span>
             </x-button>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/datasource/pages/list/_source/createDataSource.vue b/dolphinscheduler-ui/src/js/conf/home/pages/datasource/pages/list/_source/createDataSource.vue
index d308cee..001535b 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/datasource/pages/list/_source/createDataSource.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/datasource/pages/list/_source/createDataSource.vue
@@ -22,7 +22,7 @@
     <div class="content-p">
       <div class="create-datasource-model">
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Datasource')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Datasource')}}</template>
           <template slot="content">
             <x-radio-group v-model="type" size="small">
               <x-radio :label="'MYSQL'">MYSQL</x-radio>
@@ -37,11 +37,12 @@
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Datasource Name')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Datasource Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
                     v-model="name"
+                    maxlength="60"
                     :placeholder="$t('Please enter datasource name')"
                     autocomplete="off">
             </x-input>
@@ -59,18 +60,19 @@
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('IP')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('IP')}}</template>
           <template slot="content">
             <x-input
                     type="input"
                     v-model="host"
+                    maxlength="60"
                     :placeholder="$t('Please enter IP')"
                     autocomplete="off">
             </x-input>
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Port')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Port')}}</template>
           <template slot="content">
             <x-input
                     type="input"
@@ -81,7 +83,7 @@
           </template>
         </m-list-box-f>
         <m-list-box-f :class="{hidden:showPrincipal}">
-          <template slot="name"><b>*</b>Principal</template>
+          <template slot="name"><strong>*</strong>Principal</template>
           <template slot="content">
             <x-input
               type="input"
@@ -92,11 +94,12 @@
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('User Name')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('User Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
                     v-model="userName"
+                    maxlength="60"
                     :placeholder="$t('Please enter user name')"
                     autocomplete="off">
             </x-input>
@@ -114,11 +117,12 @@
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b :class="{hidden:showdDatabase}">*</b>{{$t('Database Name')}}</template>
+          <template slot="name"><strong :class="{hidden:showdDatabase}">*</strong>{{$t('Database Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
                     v-model="database"
+                    maxlength="60"
                     :placeholder="$t('Please enter database name')"
                     autocomplete="off">
             </x-input>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/datasource/pages/list/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/datasource/pages/list/_source/list.vue
index f6b90ab..ef6f839 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/datasource/pages/list/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/datasource/pages/list/_source/list.vue
@@ -19,28 +19,28 @@
     <div class="table-box">
       <table class="fixed">
         <tr>
-          <th>
+          <th scope="col">
             <span>{{$t('#')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Datasource Name')}}</span>
           </th>
-          <th width="120">
+          <th scope="col" width="120">
             <span>{{$t('Datasource Type')}}</span>
           </th>
-          <th width="100">
+          <th scope="col" width="100">
             <span>{{$t('Datasource Parameter')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Description')}}</span>
           </th>
-          <th width="150">
+          <th scope="col" width="150">
             <span>{{$t('Create Time')}}</span>
           </th>
-          <th width="150">
+          <th scope="col" width="150">
             <span>{{$t('Update Time')}}</span>
           </th>
-          <th width="80">
+          <th scope="col" width="80">
             <span>{{$t('Operation')}}</span>
           </th>
         </tr>
@@ -148,7 +148,7 @@
         this.deleteDatasource({
           id: item.id
         }).then(res => {
-          this.list.splice(i, 1)
+          this.$emit('on-update')
           this.$message.success(res.msg)
         }).catch(e => {
           this.$message.error(e.msg || '')
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/datasource/pages/list/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/datasource/pages/list/index.vue
index 5f746b0..19640cc 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/datasource/pages/list/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/datasource/pages/list/index.vue
@@ -24,13 +24,13 @@
       </m-conditions>
     </template>
     <template slot="content">
-      <template v-if="datasourcesList.length">
-        <m-list :datasources-list="datasourcesList" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize"></m-list>
+      <template v-if="datasourcesList.length || total>0">
+        <m-list @on-update="_onUpdate" :datasources-list="datasourcesList" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize"></m-list>
         <div class="page-box">
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
         </div>
       </template>
-      <template v-if="!datasourcesList.length">
+      <template v-if="!datasourcesList.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading" :is-left="false">
@@ -131,7 +131,10 @@
         }).catch(e => {
           this.isLoading = false
         })
-      }
+      },
+      _onUpdate () {
+        this._debounceGET('false')
+      },
     },
     watch: {
       // router
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/_source/zookeeperList.vue b/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/_source/zookeeperList.vue
index 24902ee..de187dd 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/_source/zookeeperList.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/_source/zookeeperList.vue
@@ -97,8 +97,8 @@
           </td>
           <td>
             <span class="state">
-              <i class="ans-icon-success-solid success" v-if="item.state"></i>
-              <i class="ans-icon-fail-solid error" v-else></i>
+              <em class="ans-icon-success-solid success" v-if="item.state"></em>
+              <em class="ans-icon-fail-solid error" v-else></em>
             </span>
           </td>
         </tr>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/db.vue b/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/db.vue
index 2fca966..873cd4a 100755
--- a/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/db.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/db.vue
@@ -30,8 +30,8 @@
             </div>
             <div class="value-p">
               <span class="state">
-                <i class="ans-icon-success-solid success" v-if="item.state"></i>
-                <i class="ans-icon-fail-solid error" v-else></i>
+                <em class="ans-icon-success-solid success" v-if="item.state"></em>
+                <em class="ans-icon-fail-solid error" v-else></em>
               </span>
             </div>
             <div class="text-1">{{$t('Health status')}}</div>
@@ -43,7 +43,7 @@
               <span>{{$t('Max connections')}} - {{item.date | formatDate}}</span>
             </div>
             <div class="value-p">
-              <b :style="{color:color[0]}">{{item.maxConnections}}</b>
+              <strong :style="{color:color[0]}">{{item.maxConnections}}</strong>
             </div>
             <div class="text-1">{{$t('Max connections')}}</div>
           </div>
@@ -54,7 +54,7 @@
               <span>{{$t('Threads connections')}}</span>
             </div>
             <div class="value-p">
-              <b :style="{color:color[8]}">{{item.threadsConnections}}</b>
+              <strong :style="{color:color[8]}">{{item.threadsConnections}}</strong>
             </div>
             <div class="text-1">{{$t('Threads connections')}}</div>
           </div>
@@ -65,7 +65,7 @@
                 <span>{{$t('Max used connections')}}</span>
               </div>
               <div class="value-p">
-                <b :style="{color:color[2]}">{{item.maxUsedConnections}}</b>
+                <strong :style="{color:color[2]}">{{item.maxUsedConnections}}</strong>
               </div>
               <div class="text-1">
                 {{$t('Max used connections')}}
@@ -78,7 +78,7 @@
               <span>{{$t('Threads running connections')}}</span>
             </div>
             <div class="value-p">
-              <b :style="{color:color[4]}">{{item.threadsRunningConnections}}</b>
+              <strong :style="{color:color[4]}">{{item.threadsRunningConnections}}</strong>
             </div>
             <div class="text-1">{{$t('Threads running connections')}}</div>
           </div>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/master.vue b/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/master.vue
index bd760d5..dc06712 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/master.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/master.vue
@@ -48,7 +48,7 @@
             <div class="col-md-4">
               <div class="text-num-model">
                 <div class="value-p">
-                  <b :style="{color:color[$index]}">{{item.resInfo.loadAverage > 0? item.resInfo.loadAverage.toFixed(2):0}}</b>
+                  <strong :style="{color:color[$index]}">{{item.resInfo.loadAverage > 0? item.resInfo.loadAverage.toFixed(2):0}}</strong>
                 </div>
                 <div class="text-1">
                   loadAverage
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/servers.scss b/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/servers.scss
index 7971381..2c100e2 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/servers.scss
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/servers.scss
@@ -60,7 +60,7 @@
       height: 276px;
       line-height: 276px;
       text-align: center;
-      >b {
+      >strong {
         font-size: 100px;
         color: #333;
       }
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/statistics.vue b/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/statistics.vue
index f660b38..e47c163 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/statistics.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/statistics.vue
@@ -25,7 +25,7 @@
                 <span>{{$t('command number of waiting for running')}}</span>
               </div>
               <div class="value-p">
-                <b :style="{color:color[0]}"> {{commandCountData.normalCount}}</b>
+                <strong :style="{color:color[0]}"> {{commandCountData.normalCount}}</strong>
               </div>
             </div>
           </div>
@@ -35,7 +35,7 @@
               <span >{{$t('failure command number')}}</span>
             </div>
             <div class="value-p">
-              <b :style="{color:color[1]}"> {{commandCountData.errorCount}}</b>
+              <strong :style="{color:color[1]}"> {{commandCountData.errorCount}}</strong>
             </div>
           </div>
         </div>
@@ -45,7 +45,7 @@
               <span >{{$t('tasks number of waiting running')}}</span>
             </div>
             <div class="value-p">
-              <b :style="{color:color[0]}"> {{queueCount.taskQueue}}</b>
+              <strong :style="{color:color[0]}"> {{queueCount.taskQueue}}</strong>
             </div>
           </div>
         </div>
@@ -55,7 +55,7 @@
               <span >{{$t('task number of ready to kill')}}</span>
             </div>
             <div class="value-p">
-              <b :style="{color:color[1]}">{{queueCount.taskKill}}</b>
+              <strong :style="{color:color[1]}">{{queueCount.taskKill}}</strong>
             </div>
           </div>
         </div>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/worker.vue b/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/worker.vue
index f935628..b386ea0 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/worker.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/monitor/pages/servers/worker.vue
@@ -48,7 +48,7 @@
             <div class="col-md-4">
               <div class="text-num-model">
                 <div class="value-p">
-                  <b :style="{color:color[$index]}">{{item.resInfo.loadAverage > 0? item.resInfo.loadAverage.toFixed(2):0}}</b>
+                  <strong :style="{color:color[$index]}">{{item.resInfo.loadAverage > 0? item.resInfo.loadAverage.toFixed(2):0}}</strong>
                 </div>
                 <div class="text-1">
                   loadAverage
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/_source/instanceConditions/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/_source/instanceConditions/index.vue
index 6ca3836..bbade46 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/_source/instanceConditions/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/_source/instanceConditions/index.vue
@@ -30,12 +30,12 @@
                 :value="[searchParams.startDate,searchParams.endDate]"
                 :panelNum="2">
           <x-input slot="input" readonly slot-scope="{value}" :value="value" style="width: 310px;" size="small" :placeholder="$t('Select date range')">
-            <i slot="suffix"
+            <em slot="suffix"
                @click.stop="_dateEmpty()"
                class="ans-icon-fail-solid"
                v-show="value"
                style="font-size: 13px;cursor: pointer;margin-top: 1px;">
-            </i>
+            </em>
           </x-input>
         </x-datepicker>
       </div>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/_source/taskRecordList/_source/conditions.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/_source/taskRecordList/_source/conditions.vue
index 459f0fc..a82bd45 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/_source/taskRecordList/_source/conditions.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/_source/taskRecordList/_source/conditions.vue
@@ -30,12 +30,12 @@
                 placement="bottom-end"
                 :panelNum="2">
           <x-input slot="input" readonly slot-scope="{value}" :value="value" style="width: 310px;" size="small" :placeholder="$t('Select date range')">
-            <i slot="suffix"
+            <em slot="suffix"
                @click.stop="_dateEmpty()"
                class="ans-icon-fail-solid"
                v-show="value"
                style="font-size: 13px;cursor: pointer;margin-top: 1px;">
-            </i>
+            </em>
           </x-input>
         </x-datepicker>
       </div>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/_source/taskRecordList/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/_source/taskRecordList/index.vue
index b5ace15..08a964f 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/_source/taskRecordList/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/_source/taskRecordList/index.vue
@@ -20,14 +20,14 @@
       <m-conditions @on-query="_onQuery"></m-conditions>
     </template>
     <template slot="content">
-      <template v-if="taskRecordList.length">
+      <template v-if="taskRecordList.length || total>0">
         <m-list :task-record-list="taskRecordList" @on-update="_onUpdate" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize">
         </m-list>
         <div class="page-box">
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" show-elevator @on-change="_page"></x-page>
         </div>
       </template>
-      <template v-if="!taskRecordList.length">
+      <template v-if="!taskRecordList.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading"></m-spin>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/email.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/email.vue
index ba99b14..2585744 100755
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/email.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/email.vue
@@ -19,7 +19,7 @@
     <div class="clearfix input-element" :class="disabled ? 'disabled' : ''">
       <span class="tag-wrapper" v-for="(item,$index) in activeList" :key="$index" :class="activeIndex === $index ? 'active' : ''">
         <span class="tag-text">{{item}}</span>
-        <i class="remove-tag ans-icon-close" @click.stop="_del($index)" v-if="!disabled"></i>
+        <em class="remove-tag ans-icon-close" @click.stop="_del($index)" v-if="!disabled"></em>
       </span>
       <x-poptip
               placement="bottom-start"
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/list.vue
index 3de59d9..7a9a165 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/list.vue
@@ -19,31 +19,31 @@
     <div class="table-box">
       <table class="fixed">
         <tr>
-          <th width="50">
+          <th scope="col" width="50">
             <x-checkbox @on-change="_topCheckBoxClick" v-model="checkAll"></x-checkbox>
           </th>
-          <th width="40">
+          <th scope="col" width="40">
             <span>{{$t('#')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Process Name')}}</span>
           </th>
-          <th width="50">
+          <th scope="col" width="50">
             <span>{{$t('State')}}</span>
           </th>
-          <th width="130">
+          <th scope="col" width="130">
             <span>{{$t('Create Time')}}</span>
           </th>
-          <th width="130">
+          <th scope="col" width="130">
             <span>{{$t('Update Time')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Description')}}</span>
           </th>
-          <th width="90">
+          <th scope="col" width="90">
             <span>{{$t('Timing state')}}</span>
           </th>
-          <th width="240">
+          <th scope="col" width="240">
             <span>{{$t('Operation')}}</span>
           </th>
         </tr>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/start.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/start.vue
index 2049b6b..8672c41 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/start.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/start.vue
@@ -89,8 +89,8 @@
                 v-model="warningGroupId"
                 :disabled="!notifyGroupList.length">
           <x-input slot="trigger" slot-scope="{ selectedModel }" readonly :placeholder="$t('Please select a notification group')" :value="selectedModel ? selectedModel.label : ''" style="width: 200px;" @on-click-icon.stop="warningGroupId = ''">
-            <i slot="suffix" class="ans-icon-fail-solid" style="font-size: 15px;cursor: pointer;" v-show="warningGroupId"></i>
-            <i slot="suffix" class="ans-icon-arrow-down" style="font-size: 12px;" v-show="!warningGroupId"></i>
+            <em slot="suffix" class="ans-icon-fail-solid" style="font-size: 15px;cursor: pointer;" v-show="warningGroupId"></em>
+            <em slot="suffix" class="ans-icon-arrow-down" style="font-size: 12px;" v-show="!warningGroupId"></em>
           </x-input>
           <x-option
                   v-for="city in notifyGroupList"
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/timing.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/timing.vue
index a15999e..16f7020 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/timing.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/timing.vue
@@ -122,8 +122,8 @@
                 :disabled="!notifyGroupList.length"
                 v-model="warningGroupId">
           <x-input slot="trigger" readonly slot-scope="{ selectedModel }" :placeholder="$t('Please select a notification group')" :value="selectedModel ? selectedModel.label : ''" style="width: 200px;" @on-click-icon.stop="warningGroupId = {}">
-            <i slot="suffix" class="ans-icon-fail-solid" style="font-size: 15px;cursor: pointer;" v-show="warningGroupId.id"></i>
-            <i slot="suffix" class="ans-icon-arrow-down" style="font-size: 12px;" v-show="!warningGroupId.id"></i>
+            <em slot="suffix" class="ans-icon-fail-solid" style="font-size: 15px;cursor: pointer;" v-show="warningGroupId.id"></em>
+            <em slot="suffix" class="ans-icon-arrow-down" style="font-size: 12px;" v-show="!warningGroupId.id"></em>
           </x-input>
           <x-option
                   v-for="city in notifyGroupList"
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/index.vue
index a33c01f..d168ce7 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/index.vue
@@ -26,13 +26,13 @@
       </m-conditions>
     </template>
     <template slot="content">
-      <template v-if="processListP.length">
+      <template v-if="processListP.length || total>0">
         <m-list :process-list="processListP" @on-update="_onUpdate" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize"></m-list>
         <div class="page-box">
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
         </div>
       </template>
-      <template v-if="!processListP.length">
+      <template v-if="!processListP.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading"></m-spin>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/tree/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/tree/index.vue
index 99633cc..4bc102d 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/tree/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/tree/index.vue
@@ -43,7 +43,7 @@
               <span>Node Type</span>
             </a>
             <a href="javascript:" v-for="(k,v) in tasksType" :key="v">
-              <i class="ans-icon-circle-solid" :style="{color:k.color}"></i>
+              <em class="ans-icon-circle-solid" :style="{color:k.color}"></em>
               <span>{{v}}</span>
             </a>
           </div>
@@ -52,7 +52,7 @@
               <span>{{$t('Task Status')}}</span>
             </a>
             <a href="javascript:" v-for="(item) in tasksState" :key="item.id">
-              <i class="ans-icon-rect-solid" :style="{color:item.color}"></i>
+              <em class="ans-icon-rect-solid" :style="{color:item.color}"></em>
               <span>{{item.desc}}</span>
             </a>
           </div>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/gantt/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/gantt/index.vue
index ab4f440..e2e7d9b 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/gantt/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/gantt/index.vue
@@ -24,7 +24,7 @@
               <span>{{$t('Task Status')}}</span>
             </a>
             <a href="javascript:" v-for="(item) in tasksState" :key="item.id">
-              <i class="ans-icon-rect-solid" :style="{color:item.color}"></i>
+              <em class="ans-icon-rect-solid" :style="{color:item.color}"></em>
               <span>{{item.desc}}</span>
             </a>
           </div>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/list/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/list/_source/list.vue
index 6cc0fb0..1410a67 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/list/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/list/_source/list.vue
@@ -19,43 +19,43 @@
     <div class="table-box">
       <table class="fixed">
         <tr>
-          <th width="50">
+          <th scope="col" width="50">
             <x-checkbox @on-change="_topCheckBoxClick" v-model="checkAll"></x-checkbox>
           </th>
-          <th width="40">
+          <th scope="col" width="40">
             <span>{{$t('#')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Process Name')}}</span>
           </th>
-          <th width="70">
+          <th scope="col" width="70">
             <span>{{$t('Run Type')}}</span>
           </th>
-          <th width="130">
+          <th scope="col" width="130">
             <span>{{$t('Scheduling Time')}}</span>
           </th>
-          <th width="130">
+          <th scope="col" width="130">
             <span>{{$t('Start Time')}}</span>
           </th>
-          <th width="130">
+          <th scope="col" width="130">
             <span>{{$t('End Time')}}</span>
           </th>
-          <th width="60">
+          <th scope="col" width="60">
             <span>{{$t('Duration')}}s</span>
           </th>
-          <th width="60">
+          <th scope="col" width="60">
             <span>{{$t('Run Times')}}</span>
           </th>
-          <th width="100">
+          <th scope="col" width="100">
             <span>{{$t('host')}}</span>
           </th>
-          <th width="60">
+          <th scope="col" width="60">
             <span>{{$t('fault-tolerant sign')}}</span>
           </th>
-          <th width="30">
+          <th scope="col" width="30">
             <span>{{$t('State')}}</span>
           </th>
-          <th width="210">
+          <th scope="col" width="210">
             <span>{{$t('Operation')}}</span>
           </th>
         </tr>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/list/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/list/index.vue
index 5c628a1..4bf169b 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/list/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/list/index.vue
@@ -20,14 +20,14 @@
       <m-instance-conditions @on-query="_onQuery"></m-instance-conditions>
     </template>
     <template slot="content">
-      <template v-if="processInstanceList.length">
+      <template v-if="processInstanceList.length || total>0">
         <m-list :process-instance-list="processInstanceList" @on-update="_onUpdate" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize">
         </m-list>
         <div class="page-box">
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
         </div>
       </template>
-      <template v-if="!processInstanceList.length">
+      <template v-if="!processInstanceList.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading"></m-spin>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/list/_source/createProject.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/list/_source/createProject.vue
index b78a72d..b5a2c52 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/list/_source/createProject.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/list/_source/createProject.vue
@@ -19,11 +19,12 @@
     <template slot="content">
       <div class="projects-create-model">
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Project Name')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Project Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
                     v-model="projectName"
+                    maxlength="60"
                     :placeholder="$t('Please enter name')"
                     autocomplete="off">
             </x-input>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/list/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/list/_source/list.vue
index b9cb59b..bf5bc12 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/list/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/list/_source/list.vue
@@ -19,31 +19,31 @@
     <div class="table-box">
       <table class="fixed">
         <tr>
-          <th>
+          <th scope="col">
             <span>{{$t('#')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Project Name')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Owned Users')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Process Define Count')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Process Instance Running Count')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Description')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Create Time')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Update Time')}}</span>
           </th>
-          <th width="80">
+          <th scope="col" width="80">
             <span>{{$t('Operation')}}</span>
           </th>
         </tr>
@@ -152,7 +152,7 @@
           projectId: item.id
         }).then(res => {
           this.$refs[`poptip-${i}`][0].doClose()
-          this.list.splice(i, 1)
+          this.$emit('on-update')
           this.$message.success(res.msg)
         }).catch(e => {
           this.$refs[`poptip-${i}`][0].doClose()
@@ -165,7 +165,8 @@
        */
       _edit (item) {
         findComponentDownward(this.$root, 'projects-list')._create(item)
-      }
+      },
+
     },
     watch: {
       projectsList (a) {
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/list/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/list/index.vue
index 0e1bb7c..74121f5 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/list/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/list/index.vue
@@ -24,13 +24,13 @@
       </m-conditions>
     </template>
     <template slot="content">
-      <template v-if="projectsList.length">
+      <template v-if="projectsList.length || total>0">
         <m-list :projects-list="projectsList" @on-update="_onUpdate" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize"></m-list>
         <div class="page-box">
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
         </div>
       </template>
-      <template v-if="!projectsList.length">
+      <template v-if="!projectsList.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading" :is-left="false"></m-spin>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/taskInstance/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/taskInstance/_source/list.vue
index 30e327e..bb972c3 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/taskInstance/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/taskInstance/_source/list.vue
@@ -19,40 +19,40 @@
     <div class="table-box">
       <table class="fixed">
         <tr>
-          <th>
+          <th scope="col">
             <span>{{$t('#')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Name')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Process Instance')}}</span>
           </th>
-          <th width="90">
+          <th scope="col" width="90">
             <span>{{$t('Node Type')}}</span>
           </th>
-          <th width="40">
+          <th scope="col" width="40">
             <span>{{$t('State')}}</span>
           </th>
-          <th width="140">
+          <th scope="col" width="140">
             <span>{{$t('Submit Time')}}</span>
           </th>
-          <th width="140">
+          <th scope="col" width="140">
             <span>{{$t('Start Time')}}</span>
           </th>
-          <th width="140">
+          <th scope="col" width="140">
             <span>{{$t('End Time')}}</span>
           </th>
-          <th width="110">
+          <th scope="col" width="110">
             <span>{{$t('host')}}</span>
           </th>
-          <th width="74">
+          <th scope="col" width="74">
             <span>{{$t('Duration')}}(s)</span>
           </th>
-          <th width="84">
+          <th scope="col" width="84">
             <span>{{$t('Retry Count')}}</span>
           </th>
-          <th width="50">
+          <th scope="col" width="50">
             <span>{{$t('Operation')}}</span>
           </th>
         </tr>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/create/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/create/index.vue
index c5651ad..caa31ed 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/create/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/create/index.vue
@@ -19,11 +19,12 @@
     <template slot="content">
       <div class="resource-create-model">
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('File Name')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('File Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
                     v-model="fileName"
+                    maxlength="60"
                     style="width: 300px;"
                     :placeholder="$t('Please enter name')"
                     autocomplete="off">
@@ -31,7 +32,7 @@
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('File Format')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('File Format')}}</template>
           <template slot="content">
             <x-select v-model="suffix" style="width: 100px;" @on-change="_onChange">
               <x-option
@@ -56,7 +57,7 @@
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('File Content')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('File Content')}}</template>
           <template slot="content">
             <textarea id="code-create-mirror" name="code-create-mirror"></textarea>
           </template>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/details/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/details/index.vue
index e8087aa..e961d8b 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/details/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/details/index.vue
@@ -21,7 +21,7 @@
         <h2>
           <span>{{name}}</span>
           <div class="down">
-            <i class="ans-icon-download" data-container="body" data-toggle="tooltip" :title="$t('Download Details')" @click="_downloadFile"></i>
+            <em class="ans-icon-download" data-container="body" data-toggle="tooltip" :title="$t('Download Details')" @click="_downloadFile"></em>
             <em>{{size}}</em>
           </div>
         </h2>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/list/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/list/_source/list.vue
index e40a038..513d0d1 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/list/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/list/_source/list.vue
@@ -19,25 +19,25 @@
     <div class="table-box">
       <table class="fixed">
         <tr>
-          <th>
+          <th scope="col">
             <span>{{$t('#')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Name')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('File Name')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Description')}}</span>
           </th>
-          <th width="100">
+          <th scope="col" width="100">
             <span>{{$t('Size')}}</span>
           </th>
-          <th width="140">
+          <th scope="col" width="140">
             <span>{{$t('Update Time')}}</span>
           </th>
-          <th width="140">
+          <th scope="col" width="140">
             <span>{{$t('Operation')}}</span>
           </th>
         </tr>
@@ -166,7 +166,7 @@
           id: item.id
         }).then(res => {
           this.$refs[`poptip-${i}`][0].doClose()
-          this.list.splice(i, 1)
+          this.$emit('on-update')
           this.$message.success(res.msg)
         }).catch(e => {
           this.$refs[`poptip-${i}`][0].doClose()
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/list/_source/rename.vue b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/list/_source/rename.vue
index 6248b93..b082f88 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/list/_source/rename.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/list/_source/rename.vue
@@ -19,7 +19,7 @@
     <template slot="content">
       <div class="resource-rename-model">
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Name')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/list/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/list/index.vue
index a6e0f9f..de7f773 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/list/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/file/pages/list/index.vue
@@ -27,14 +27,14 @@
       </m-conditions>
     </template>
     <template slot="content">
-      <template v-if="fileResourcesList.length">
-        <m-list :file-resources-list="fileResourcesList" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize">
+      <template v-if="fileResourcesList.length || total>0">
+        <m-list @on-update="_onUpdate" :file-resources-list="fileResourcesList" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize">
         </m-list>
         <div class="page-box">
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
         </div>
       </template>
-      <template v-if="!fileResourcesList.length">
+      <template v-if="!fileResourcesList.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading">
@@ -102,6 +102,9 @@
         this.searchParams.pageNo = 1
         this.searchParams.searchVal = ''
         this._debounceGET()
+      },
+       _onUpdate () {
+        this._debounceGET()
       }
     },
     watch: {
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/function/_source/createUdf.vue b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/function/_source/createUdf.vue
index 0176122..13a337d 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/function/_source/createUdf.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/function/_source/createUdf.vue
@@ -19,7 +19,7 @@
     <template slot="content">
       <div class="udf-create-model">
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('type')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('type')}}</template>
           <template slot="content">
             <x-radio-group v-model="type">
               <x-radio :label="'HIVE'">HIVE UDF</x-radio>
@@ -28,7 +28,7 @@
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('UDF Function Name')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('UDF Function Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
@@ -39,7 +39,7 @@
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Package Name')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Package Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
@@ -70,7 +70,7 @@
           </template>
         </m-list-box-f> -->
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('UDF Resources')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('UDF Resources')}}</template>
           <template slot="content">
             <x-select
                     filterable
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/function/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/function/_source/list.vue
index 7369400..febb215 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/function/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/function/_source/list.vue
@@ -19,34 +19,34 @@ v-ps<template>
     <div class="table-box">
       <table class="fixed">
         <tr>
-          <th>
+          <th scope="col">
             <span>{{$t('#')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('UDF Function Name')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Class Name')}}</span>
           </th>
-          <!-- <th>
+          <!-- <th scope="col">
             <span>{{$t('Parameter')}}</span>
           </th> -->
-          <th width="80">
+          <th scope="col" width="80">
             <span>{{$t('type')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Description')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Jar Package')}}</span>
           </th>
-          <!-- <th>
+          <!-- <th scope="col">
             <span>{{$t('Library Name')}}</span>
           </th> -->
-          <th width="140">
+          <th scope="col" width="140">
             <span>{{$t('Update Time')}}</span>
           </th>
-          <th width="80">
+          <th scope="col" width="80">
             <span>{{$t('Operation')}}</span>
           </th>
         </tr>
@@ -142,7 +142,7 @@ v-ps<template>
           id: item.id
         }).then(res => {
           this.$refs[`poptip-${i}`][0].doClose()
-          this.list.splice(i, 1)
+          this.$emit('_updateList')
           this.$message.success(res.msg)
         }).catch(e => {
           this.$refs[`poptip-${i}`][0].doClose()
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/function/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/function/index.vue
index c04018a..c94a8dc 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/function/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/function/index.vue
@@ -24,14 +24,14 @@
       </m-conditions>
     </template>
     <template slot="content">
-      <template v-if="udfFuncList.length">
+      <template v-if="udfFuncList.length || total>0">
         <m-list :udf-func-list="udfFuncList" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize" @on-update="_updateList">
         </m-list>
         <div class="page-box">
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
         </div>
       </template>
-      <template v-if="!udfFuncList.length">
+      <template v-if="!udfFuncList.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading">
@@ -104,8 +104,6 @@
         })
       },
       _updateList () {
-        this.searchParams.pageNo = 1
-        this.searchParams.searchVal = ''
         this._debounceGET()
       },
       _getList (flag) {
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/resource/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/resource/_source/list.vue
index 84674b2..6337ef4 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/resource/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/resource/_source/list.vue
@@ -19,28 +19,28 @@
     <div class="table-box">
       <table class="fixed">
         <tr>
-          <th>
+          <th scope="col">
             <span>{{$t('#')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('UDF Resource Name')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('File Name')}}</span>
           </th>
-          <th width="80">
+          <th scope="col" width="80">
             <span>{{$t('File Size')}}</span>
           </th>
-          <th>
+          <th scope="col">
             <span>{{$t('Description')}}</span>
           </th>
-          <th width="140">
+          <th scope="col" width="140">
             <span>{{$t('Create Time')}}</span>
           </th>
-          <th width="140">
+          <th scope="col" width="140">
             <span>{{$t('Update Time')}}</span>
           </th>
-          <th width="110">
+          <th scope="col" width="110">
             <span>{{$t('Operation')}}</span>
           </th>
         </tr>
@@ -151,7 +151,7 @@
           id: item.id
         }).then(res => {
           this.$refs[`poptip-${i}`][0].doClose()
-          this.list.splice(i, 1)
+          this.$emit('on-update')
           this.$message.success(res.msg)
         }).catch(e => {
           this.$refs[`poptip-${i}`][0].doClose()
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/resource/_source/rename.vue b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/resource/_source/rename.vue
index 59fd32c..69acdef 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/resource/_source/rename.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/resource/_source/rename.vue
@@ -19,11 +19,12 @@
     <template slot="content">
       <div class="resource-rename-model">
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Name')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
                     v-model="name"
+                    maxlength="60"
                     :placeholder="$t('Please enter name')"
                     autocomplete="off">
             </x-input>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/resource/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/resource/index.vue
index e4f76e3..8b86966 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/resource/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/resource/pages/udf/pages/resource/index.vue
@@ -24,14 +24,14 @@
       </m-conditions>
     </template>
     <template slot="content">
-      <template v-if="udfResourcesList.length">
-        <m-list :udf-resources-list="udfResourcesList" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize">
+      <template v-if="udfResourcesList.length || total>0">
+        <m-list @on-update="_onUpdate" :udf-resources-list="udfResourcesList" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize">
         </m-list>
         <div class="page-box">
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
         </div>
       </template>
-      <template v-if="!udfResourcesList.length">
+      <template v-if="!udfResourcesList.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading">
@@ -85,6 +85,9 @@
       _pageSize (val) {
         this.searchParams.pageSize = val
       },
+      _onUpdate () {
+        this._debounceGET()
+      },
       _updateList () {
         this.searchParams.pageNo = 1
         this.searchParams.searchVal = ''
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/queue/_source/createQueue.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/queue/_source/createQueue.vue
index 46be94c..6afc4d5 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/queue/_source/createQueue.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/queue/_source/createQueue.vue
@@ -23,22 +23,24 @@
     <template slot="content">
       <div class="create-tenement-model">
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Name')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
                     v-model="queueName"
+                    maxlength="60"
                     :placeholder="$t('Please enter name')"
                     autocomplete="off">
             </x-input>
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Queue value')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Queue value')}}</template>
           <template slot="content">
             <x-input
                     type="input"
                     v-model="queue"
+                    maxlength="60"
                     :placeholder="$t('Please enter queue value')"
                     autocomplete="off">
             </x-input>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/queue/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/queue/index.vue
index 358e9ab..ed5bf2c 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/queue/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/queue/index.vue
@@ -24,7 +24,7 @@
       </m-conditions>
     </template>
     <template slot="content">
-      <template v-if="queueList.length">
+      <template v-if="queueList.length || total>0">
         <m-list @on-edit="_onEdit"
                 :queue-list="queueList"
                 :page-no="searchParams.pageNo"
@@ -35,7 +35,7 @@
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
         </div>
       </template>
-      <template v-if="!queueList.length">
+      <template v-if="!queueList.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading"></m-spin>
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/tenement/_source/createTenement.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/tenement/_source/createTenement.vue
index ec4efee..ebf644c 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/tenement/_source/createTenement.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/tenement/_source/createTenement.vue
@@ -23,29 +23,31 @@
     <template slot="content">
       <div class="create-tenement-model">
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Tenant Code')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Tenant Code')}}</template>
           <template slot="content">
             <x-input
                     type="input"
                     :disabled="item ? true : false"
                     v-model="tenantCode"
+                    maxlength="60"
                     :placeholder="$t('Please enter name')">
             </x-input>
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Tenant Name')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Tenant Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
                     v-model="tenantName"
+                    maxlength="60"
                     :placeholder="$t('Please enter name')"
                     autocomplete="off">
             </x-input>
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Queue')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Queue')}}</template>
           <template slot="content">
             <x-select v-model="queueId">
               <x-option
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/tenement/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/tenement/_source/list.vue
index 6258f93..521b96d 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/tenement/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/tenement/_source/list.vue
@@ -135,7 +135,7 @@
           id: item.id
         }).then(res => {
           this.$refs[`poptip-${i}`][0].doClose()
-          this.list.splice(i, 1)
+          this.$emit('on-update')
           this.$message.success(res.msg)
         }).catch(e => {
           this.$refs[`poptip-${i}`][0].doClose()
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/tenement/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/tenement/index.vue
index d15a2c6..8063fd0 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/tenement/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/tenement/index.vue
@@ -24,8 +24,9 @@
       </m-conditions>
     </template>
     <template slot="content">
-      <template v-if="tenementList.length">
+      <template v-if="tenementList.length || total>0">
         <m-list @on-edit="_onEdit"
+                @on-update="_onUpdate"
                 :tenement-list="tenementList"
                 :page-no="searchParams.pageNo"
                 :page-size="searchParams.pageSize">
@@ -35,7 +36,7 @@
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
         </div>
       </template>
-      <template v-if="!tenementList.length">
+      <template v-if="!tenementList.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading"></m-spin>
@@ -86,6 +87,9 @@
       _pageSize (val) {
         this.searchParams.pageSize = val
       },
+      _onUpdate () {
+        this._debounceGET()
+      },
       _onEdit (item) {
         this._create(item)
       },
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/users/_source/createUser.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/users/_source/createUser.vue
index a7fcfab..39dc278 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/users/_source/createUser.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/users/_source/createUser.vue
@@ -23,7 +23,7 @@
     <template slot="content">
       <div class="create-user-model">
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('User Name')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('User Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
@@ -34,7 +34,7 @@
           </template>
         </m-list-box-f>
         <m-list-box-f v-if="router.history.current.name !== 'account'">
-          <template slot="name"><b>*</b>{{$t('Password')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Password')}}</template>
           <template slot="content">
             <x-input
                     type="input"
@@ -44,7 +44,7 @@
           </template>
         </m-list-box-f>
         <m-list-box-f v-if="isADMIN">
-          <template slot="name"><b>*</b>{{$t('Tenant')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Tenant')}}</template>
           <template slot="content">
             <x-select v-model="tenantId">
               <x-option
@@ -61,8 +61,8 @@
           <template slot="content">
             <x-select v-model="queueName">
               <x-input slot="trigger" slot-scope="{ selectedModel }" readonly :placeholder="$t('Please select a queue')" :value="selectedModel ? selectedModel.label : ''" style="width: 200px;" @on-click-icon.stop="queueName = ''">
-                <i slot="suffix" class="ans-icon-fail-solid" style="font-size: 15px;cursor: pointer;" v-show="queueName ==''"></i>
-                <i slot="suffix" class="ans-icon-arrow-down" style="font-size: 12px;" v-show="queueName!=''"></i>
+                <em slot="suffix" class="ans-icon-fail-solid" style="font-size: 15px;cursor: pointer;" v-show="queueName ==''"></em>
+                <em slot="suffix" class="ans-icon-arrow-down" style="font-size: 12px;" v-show="queueName!=''"></em>
               </x-input>
               <x-option
                       v-for="city in queueList"
@@ -74,7 +74,7 @@
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Email')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Email')}}</template>
           <template slot="content">
             <x-input
                     type="input"
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/users/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/users/_source/list.vue
index 7ed786c..6e8887b 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/users/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/users/_source/list.vue
@@ -153,7 +153,7 @@
           id: item.id
         }).then(res => {
           this.$refs[`poptip-delete-${i}`][0].doClose()
-          this.list.splice(i, 1)
+          this.$emit('on-update')
           this.$message.success(res.msg)
         }).catch(e => {
           this.$refs[`poptip-delete-${i}`][0].doClose()
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/users/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/users/index.vue
index b457dcb..b137de7 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/users/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/users/index.vue
@@ -24,8 +24,9 @@
       </m-conditions>
     </template>
     <template slot="content">
-      <template v-if="userList.length">
+      <template v-if="userList.length || total>0">
         <m-list @on-edit="_onEdit"
+                @on-update="_onUpdate"
                 :user-list="userList"
                 :page-no="searchParams.pageNo"
                 :page-size="searchParams.pageSize">
@@ -35,7 +36,7 @@
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
         </div>
       </template>
-      <template v-if="!userList.length">
+      <template v-if="!userList.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading"></m-spin>
@@ -84,6 +85,9 @@
       _pageSize (val) {
         this.searchParams.pageSize = val
       },
+      _onUpdate () {
+        this._debounceGET()
+      },
       _onEdit (item) {
         this._create(item)
       },
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/warningGroups/_source/createWarning.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/warningGroups/_source/createWarning.vue
index c2ca85e..28d53c5 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/warningGroups/_source/createWarning.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/warningGroups/_source/createWarning.vue
@@ -23,17 +23,18 @@
     <template slot="content">
       <div class="create-warning-model">
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Group Name')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Group Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
                     v-model="groupName"
+                    maxlength="60"
                     :placeholder="$t('Please enter group name')">
             </x-input>
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Group Type')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Group Type')}}</template>
           <template slot="content">
             <x-select v-model="groupType">
               <x-option
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/warningGroups/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/warningGroups/_source/list.vue
index cac2cf1..a27e4da 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/warningGroups/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/warningGroups/_source/list.vue
@@ -115,7 +115,7 @@
           id: item.id
         }).then(res => {
           this.$refs[`poptip-delete-${i}`][0].doClose()
-          this.list.splice(i, 1)
+          this.$emit('on-update')
           this.$message.success(res.msg)
         }).catch(e => {
           this.$refs[`poptip-delete-${i}`][0].doClose()
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/warningGroups/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/warningGroups/index.vue
index 9e4943c..76bbc32 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/warningGroups/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/warningGroups/index.vue
@@ -24,8 +24,9 @@
       </m-conditions>
     </template>
     <template slot="content">
-      <template v-if="alertgroupList.length">
+      <template v-if="alertgroupList.length || total>0">
         <m-list @on-edit="_onEdit"
+                @on-update="_onUpdate"
                 :alertgroup-list="alertgroupList"
                 :page-no="searchParams.pageNo"
                 :page-size="searchParams.pageSize">
@@ -35,7 +36,7 @@
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
         </div>
       </template>
-      <template v-if="!alertgroupList.length">
+      <template v-if="!alertgroupList.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading"></m-spin>
@@ -86,6 +87,9 @@
       _pageSize (val) {
         this.searchParams.pageSize = val
       },
+      _onUpdate () {
+        this._debounceGET()
+      },
       _onEdit (item) {
         this._create(item)
       },
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/workerGroups/_source/createWorker.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/workerGroups/_source/createWorker.vue
index 80ea40e..dd42565 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/workerGroups/_source/createWorker.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/workerGroups/_source/createWorker.vue
@@ -23,17 +23,18 @@
     <template slot="content">
       <div class="create-worker-model">
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Group Name')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Group Name')}}</template>
           <template slot="content">
             <x-input
                     type="input"
                     v-model="name"
+                    maxlength="60"
                     :placeholder="$t('Please enter group name')">
             </x-input>
           </template>
         </m-list-box-f>
         <m-list-box-f>
-          <template slot="name"><b>*</b>IP</template>
+          <template slot="name"><strong>*</strong>IP</template>
           <template slot="content">
             <x-input
                     :autosize="{ minRows: 4, maxRows: 6 }"
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/workerGroups/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/workerGroups/_source/list.vue
index caf2cf6..edfdee2 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/workerGroups/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/workerGroups/_source/list.vue
@@ -106,7 +106,7 @@
           id: item.id
         }).then(res => {
           this.$refs[`poptip-delete-${i}`][0].doClose()
-          this.list.splice(i, 1)
+          this.$emit('on-update')
           this.$message.success(res.msg)
         }).catch(e => {
           this.$refs[`poptip-delete-${i}`][0].doClose()
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/workerGroups/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/workerGroups/index.vue
index 9bdc354..10f4932 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/workerGroups/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/security/pages/workerGroups/index.vue
@@ -24,8 +24,9 @@
       </m-conditions>
     </template>
     <template slot="content">
-      <template v-if="workerGroupList.length">
-        <m-list @on-edit="_onEdit"
+      <template v-if="workerGroupList.length || total>0">
+        <m-list @on-update="_onUpdate"
+                @on-edit="_onEdit"
                 :worker-group-list="workerGroupList"
                 :page-no="searchParams.pageNo"
                 :page-size="searchParams.pageSize">
@@ -34,7 +35,7 @@
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
         </div>
       </template>
-      <template v-if="!workerGroupList.length">
+      <template v-if="!workerGroupList.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading"></m-spin>
@@ -85,6 +86,9 @@
       _pageSize (val) {
         this.searchParams.pageSize = val
       },
+      _onUpdate () {
+        this._debounceGET()
+      },
       _onEdit (item) {
         this._create(item)
       },
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/user/pages/token/_source/createToken.vue b/dolphinscheduler-ui/src/js/conf/home/pages/user/pages/token/_source/createToken.vue
index cef3969..5cc1ca8 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/user/pages/token/_source/createToken.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/user/pages/token/_source/createToken.vue
@@ -23,7 +23,7 @@
     <template slot="content">
       <div class="create-token-model">
         <m-list-box-f>
-          <template slot="name"><b>*</b>{{$t('Failure time')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('Failure time')}}</template>
           <template slot="content">
             <x-datepicker
                     :disabled-date="disabledDate"
@@ -35,7 +35,7 @@
           </template>
         </m-list-box-f>
         <m-list-box-f v-if="auth">
-          <template slot="name"><b>*</b>{{$t('User')}}</template>
+          <template slot="name"><strong>*</strong>{{$t('User')}}</template>
           <template slot="content">
             <x-select v-model="userId" @on-change="_onChange">
               <x-option
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/user/pages/token/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/user/pages/token/_source/list.vue
index d35e56b..9507d6d 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/user/pages/token/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/user/pages/token/_source/list.vue
@@ -111,7 +111,7 @@
           id: item.id
         }).then(res => {
           this.$refs[`poptip-delete-${i}`][0].doClose()
-          this.list.splice(i, 1)
+          this.$emit('on-update')
           this.$message.success(res.msg)
         }).catch(e => {
           this.$refs[`poptip-delete-${i}`][0].doClose()
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/user/pages/token/index.vue b/dolphinscheduler-ui/src/js/conf/home/pages/user/pages/token/index.vue
index f4044d5..a9fbeb0 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/user/pages/token/index.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/user/pages/token/index.vue
@@ -24,8 +24,10 @@
       </m-conditions>
     </template>
     <template slot="content">
-      <template v-if="tokenList.length">
-        <m-list @on-edit="_onEdit"
+      <template v-if="tokenList.length || total>0">
+        <m-list 
+                @on-update="_onUpdate"
+                @on-edit="_onEdit"
                 :token-list="tokenList"
                 :page-no="searchParams.pageNo"
                 :page-size="searchParams.pageSize">
@@ -35,7 +37,7 @@
           <x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
         </div>
       </template>
-      <template v-if="!tokenList.length">
+      <template v-if="!tokenList.length && total<=0">
         <m-no-data></m-no-data>
       </template>
       <m-spin :is-spin="isLoading"></m-spin>
@@ -88,6 +90,9 @@
       _onEdit (item) {
         this._create(item)
       },
+      _onUpdate () {
+        this._debounceGET()
+      },
       _create (item) {
         let self = this
         let modal = this.$modal.dialog({
diff --git a/dolphinscheduler-ui/src/js/conf/home/store/dag/actions.js b/dolphinscheduler-ui/src/js/conf/home/store/dag/actions.js
index b854dc8..52237a6 100644
--- a/dolphinscheduler-ui/src/js/conf/home/store/dag/actions.js
+++ b/dolphinscheduler-ui/src/js/conf/home/store/dag/actions.js
@@ -110,6 +110,11 @@ export default {
         let processDefinitionJson = JSON.parse(res.data.processDefinitionJson)
         // tasks info
         state.tasks = processDefinitionJson.tasks
+        // tasks cache
+        state.cacheTasks = {}
+        processDefinitionJson.tasks.forEach(v => {
+          state.cacheTasks[v.id] = v
+        })
         // global params
         state.globalParams = processDefinitionJson.globalParams
         // timeout
diff --git a/dolphinscheduler-ui/src/js/conf/home/store/dag/mutations.js b/dolphinscheduler-ui/src/js/conf/home/store/dag/mutations.js
index 692fde7..6ceabed 100644
--- a/dolphinscheduler-ui/src/js/conf/home/store/dag/mutations.js
+++ b/dolphinscheduler-ui/src/js/conf/home/store/dag/mutations.js
@@ -125,6 +125,11 @@ export default {
     } else {
       state.tasks.push(payload)
     }
+    if (state.cacheTasks[payload.id]) {
+      state.cacheTasks[payload.id] = Object.assign(state.cacheTasks[payload.id], {}, payload)
+    } else {
+      state.cacheTasks[payload.id] = payload;
+    }
     let dom = $(`#${payload.id}`)
     state.locations[payload.id] = _.assign(state.locations[payload.id], {
       name: dom.find('.name-p').text(),
@@ -132,5 +137,17 @@ export default {
       x: parseInt(dom.css('left'), 10),
       y: parseInt(dom.css('top'), 10)
     })
+  },
+  /**
+   * Cache the input
+   * @param state
+   * @param payload
+   */
+  cacheTasks (state, payload) {
+    if (state.cacheTasks[payload.id]) {
+      state.cacheTasks[payload.id] = Object.assign(state.cacheTasks[payload.id], {}, payload)
+    } else {
+      state.cacheTasks[payload.id] = payload;
+    }
   }
 }
diff --git a/dolphinscheduler-ui/src/js/conf/home/store/dag/state.js b/dolphinscheduler-ui/src/js/conf/home/store/dag/state.js
index 9eb4d74..b7d592a 100644
--- a/dolphinscheduler-ui/src/js/conf/home/store/dag/state.js
+++ b/dolphinscheduler-ui/src/js/conf/home/store/dag/state.js
@@ -29,6 +29,8 @@ export default {
   globalParams: [],
   // Node information
   tasks: [],
+  // Node cache information, cache the previous input
+  cacheTasks: {},
   // Timeout alarm
   timeout: 0,
   // tenant id
diff --git a/dolphinscheduler-ui/src/js/module/components/crontab/source/_source/input-number.vue b/dolphinscheduler-ui/src/js/module/components/crontab/source/_source/input-number.vue
index f531942..ad13327 100755
--- a/dolphinscheduler-ui/src/js/module/components/crontab/source/_source/input-number.vue
+++ b/dolphinscheduler-ui/src/js/module/components/crontab/source/_source/input-number.vue
@@ -109,7 +109,7 @@
       }
     }
     .ans-input {
-      width: 60px;
+      width: 80px;
       margin:0 -2px 0 -1px;
       input {
         text-align: center;
diff --git a/dolphinscheduler-ui/src/js/module/components/crontab/source/app.vue b/dolphinscheduler-ui/src/js/module/components/crontab/source/app.vue
index 74747c4..3860409 100755
--- a/dolphinscheduler-ui/src/js/module/components/crontab/source/app.vue
+++ b/dolphinscheduler-ui/src/js/module/components/crontab/source/app.vue
@@ -24,12 +24,12 @@
 
     <div class="v-crontab-model">
       <div class="clearfix v-crontab-tab">
-        <a href="javascript:" :class="tabVal === 'second' ?' active' :''" @click="onTab('second')"><i class="ans-icon-calendar"></i><span>{{$t('秒')}}</span></a>
-        <a href="javascript:" :class="tabVal === 'minute' ?' active' :''" @click="onTab('minute')"><i class="ans-icon-calendar"></i><span>{{$t('分')}}</span></a>
-        <a href="javascript:" :class="tabVal === 'hour' ?' active' :''" @click="onTab('hour')"><i class="ans-icon-calendar"></i><span>{{$t('时')}}</span></a>
-        <a href="javascript:" :class="tabVal === 'day' ?' active' :''" @click="onTab('day')"><i class="ans-icon-calendar"></i><span>{{$t('天')}}</span></a>
-        <a href="javascript:" :class="tabVal === 'month' ?' active' :''" @click="onTab('month')"><i class="ans-icon-calendar"></i><span>{{$t('月')}}</span></a>
-        <a href="javascript:" :class="tabVal === 'year' ?' active' :''" @click="onTab('year')"><i class="ans-icon-calendar"></i><span>{{$t('年')}}</span></a>
+        <a href="javascript:" :class="tabVal === 'second' ?' active' :''" @click="onTab('second')"><em class="ans-icon-calendar"></em><span>{{$t('秒')}}</span></a>
+        <a href="javascript:" :class="tabVal === 'minute' ?' active' :''" @click="onTab('minute')"><em class="ans-icon-calendar"></em><span>{{$t('分')}}</span></a>
+        <a href="javascript:" :class="tabVal === 'hour' ?' active' :''" @click="onTab('hour')"><em class="ans-icon-calendar"></em><span>{{$t('时')}}</span></a>
+        <a href="javascript:" :class="tabVal === 'day' ?' active' :''" @click="onTab('day')"><em class="ans-icon-calendar"></em><span>{{$t('天')}}</span></a>
+        <a href="javascript:" :class="tabVal === 'month' ?' active' :''" @click="onTab('month')"><em class="ans-icon-calendar"></em><span>{{$t('月')}}</span></a>
+        <a href="javascript:" :class="tabVal === 'year' ?' active' :''" @click="onTab('year')"><em class="ans-icon-calendar"></em><span>{{$t('年')}}</span></a>
       </div>
       <div class="v-crontab-content">
         <template v-if="tabVal === 'second'">
diff --git a/dolphinscheduler-ui/src/js/module/components/fileUpdate/definitionUpdate.vue b/dolphinscheduler-ui/src/js/module/components/fileUpdate/definitionUpdate.vue
index e8d8ee3..115b939 100644
--- a/dolphinscheduler-ui/src/js/module/components/fileUpdate/definitionUpdate.vue
+++ b/dolphinscheduler-ui/src/js/module/components/fileUpdate/definitionUpdate.vue
@@ -29,22 +29,22 @@
              @dragleave.prevent="dragOver = false"
              id="file-update-model">
           <div class="tooltip-info">
-            <i class="fa ans-icon-notice-solid"></i>
+            <em class="fa ans-icon-notice-solid"></em>
             <span>{{$t('Drag the file into the current upload window')}}</span>
           </div>
           <!--<div class="hide-archive" v-if="progress !== 0" @click="_ckArchive">
-            <i class="fa fa-minus" data-toggle="tooltip" title="关闭窗口 继续上传" data-container="body" ></i>
+            <em class="fa fa-minus" data-toggle="tooltip" title="关闭窗口 继续上传" data-container="body" ></em>
           </div>-->
           <div class="update-popup" v-if="dragOver">
             <div class="icon-box">
-              <i class="ans ans-icon-upload"></i>
+              <em class="ans ans-icon-upload"></em>
             </div>
             <p class="p1">
               <span>{{$t('Drag area upload')}}</span>
             </p>
           </div>
           <m-list-box-f>
-            <template slot="name"><b>*</b>{{$t('Upload Files')}}</template>
+            <template slot="name"><strong>*</strong>{{$t('Upload Files')}}</template>
             <template slot="content">
               <div class="file-update-box">
                 <template v-if="progress === 0">
@@ -141,6 +141,7 @@
           let self = this
           let formData = new FormData()
           formData.append('file', this.file)
+          formData.append('projectName',this.store.state.dag.projectName)
           io.post(`projects/import-definition`, res => {
             this.$message.success(res.msg)
             resolve()
diff --git a/dolphinscheduler-ui/src/js/module/components/fileUpdate/fileUpdate.vue b/dolphinscheduler-ui/src/js/module/components/fileUpdate/fileUpdate.vue
index 4699466..b7cef4e 100644
--- a/dolphinscheduler-ui/src/js/module/components/fileUpdate/fileUpdate.vue
+++ b/dolphinscheduler-ui/src/js/module/components/fileUpdate/fileUpdate.vue
@@ -29,22 +29,22 @@
              @dragleave.prevent="dragOver = false"
              id="file-update-model">
           <div class="tooltip-info">
-            <i class="ans ans-icon-warn-solid"></i>
+            <em class="ans ans-icon-warn-solid"></em>
             <span>{{$t('Drag the file into the current upload window')}}</span>
           </div>
           <!--<div class="hide-archive" v-if="progress !== 0" @click="_ckArchive">
-            <i class="fa fa-minus" data-toggle="tooltip" title="关闭窗口 继续上传" data-container="body" ></i>
+            <em class="fa fa-minus" data-toggle="tooltip" title="关闭窗口 继续上传" data-container="body" ></em>
           </div>-->
           <div class="update-popup" v-if="dragOver">
             <div class="icon-box">
-              <i class="ans ans-icon-upload"></i>
+              <em class="ans ans-icon-upload"></em>
             </div>
             <p class="p1">
               <span>{{$t('Drag area upload')}}</span>
             </p>
           </div>
           <m-list-box-f>
-            <template slot="name"><b>*</b>{{$t('File Name')}}</template>
+            <template slot="name"><strong>*</strong>{{$t('File Name')}}</template>
             <template slot="content">
               <x-input
                       type="input"
@@ -68,7 +68,7 @@
             </template>
           </m-list-box-f>
           <m-list-box-f>
-            <template slot="name"><b>*</b>{{$t('Upload Files')}}</template>
+            <template slot="name"><strong>*</strong>{{$t('Upload Files')}}</template>
             <template slot="content">
               <div class="file-update-box">
                 <template v-if="progress === 0">
diff --git a/dolphinscheduler-ui/src/js/module/components/listBoxF/listBoxF.vue b/dolphinscheduler-ui/src/js/module/components/listBoxF/listBoxF.vue
index 04b2c65..36c7027 100644
--- a/dolphinscheduler-ui/src/js/module/components/listBoxF/listBoxF.vue
+++ b/dolphinscheduler-ui/src/js/module/components/listBoxF/listBoxF.vue
@@ -42,7 +42,7 @@
       text-align: right;
       line-height: 32px;
       padding-right: 8px;
-      >b {
+      >strong {
         color: #ff0000;
         padding-right: 4px;
       }
diff --git a/dolphinscheduler-ui/src/js/module/components/nav/nav.vue b/dolphinscheduler-ui/src/js/module/components/nav/nav.vue
index 486385e..7212f51 100644
--- a/dolphinscheduler-ui/src/js/module/components/nav/nav.vue
+++ b/dolphinscheduler-ui/src/js/module/components/nav/nav.vue
@@ -23,42 +23,42 @@
       <div class="clearfix list">
         <div class="nav-links">
           <router-link :to="{ path: '/home'}" tag="a" active-class="active">
-            <span><i class="ansiconfont ans-icon-home-empty"></i>{{$t('Home')}}</span><b></b>
+            <span><em class="ansiconfont ans-icon-home-empty"></em>{{$t('Home')}}</span><strong></strong>
           </router-link>
         </div>
       </div>
       <div class="clearfix list">
         <div class="nav-links">
           <router-link :to="{ path: '/projects'}" tag="a" active-class="active">
-            <span><i class="ansiconfont ans-icon-setting"></i>{{$t('Project Manage')}}</span><b></b>
+            <span><em class="ansiconfont ans-icon-setting"></em>{{$t('Project Manage')}}</span><strong></strong>
           </router-link>
         </div>
       </div>
       <div class="clearfix list">
         <div class="nav-links">
           <router-link :to="{ path: '/resource'}" tag="a" active-class="active">
-            <span><i class="ansiconfont ans-icon-folder-empty"></i>{{$t('Resources manage')}}</span><b></b>
+            <span><em class="ansiconfont ans-icon-folder-empty"></em>{{$t('Resources manage')}}</span><strong></strong>
           </router-link>
         </div>
       </div>
       <div class="clearfix list">
         <div class="nav-links">
           <router-link :to="{ path: '/datasource'}" tag="a" active-class="active">
-            <span><i class="ansiconfont ans-icon-database"></i>{{$t('Datasource manage')}}</span><b></b>
+            <span><em class="ansiconfont ans-icon-database"></em>{{$t('Datasource manage')}}</span><strong></strong>
           </router-link>
         </div>
       </div>
       <div class="clearfix list">
         <div class="nav-links">
           <router-link :to="{ path: '/monitor'}" tag="a" active-class="active">
-            <span><i class="ansiconfont ans-icon-monitor"></i>{{$t('Monitor')}}</span><b></b>
+            <span><em class="ansiconfont ans-icon-monitor"></em>{{$t('Monitor')}}</span><strong></strong>
           </router-link>
         </div>
       </div>
       <div class="clearfix list" >
         <div class="nav-links">
           <router-link :to="{ path: '/security'}" tag="a" active-class="active" v-ps="['ADMIN_USER']">
-            <span><i class="ansiconfont ans-icon-shield"></i>{{$t('Security')}}</span><b></b>
+            <span><em class="ansiconfont ans-icon-shield"></em>{{$t('Security')}}</span><strong></strong>
           </router-link>
         </div>
       </div>
@@ -76,7 +76,7 @@
         </div>
         <div class="login-model" slot="reference">
           <span>{{activeLocale.name}}</span>
-          <i class="ans-icon-arrow-down"></i>
+          <em class="ans-icon-arrow-down"></em>
         </div>
       </x-poptip>
       </span>
@@ -87,24 +87,24 @@
               placement="bottom-end">
         <div class="lrns-list">
           <a href="javascript:" @click="_goAccount">
-            <i class="ans-icon-user-empty"></i>
+            <em class="ans-icon-user-empty"></em>
             <span>{{$t('User Information')}}</span>
           </a>
           <a href="javascript:" @click="_signOut">
-            <i class="ans-icon-off"></i>
+            <em class="ans-icon-off"></em>
             <span>{{$t('Logout')}}</span>
           </a>
         </div>
         <div class="login-model" slot="reference">
-          <i class="ans-icon-user-solid"></i>
+          <em class="ans-icon-user-solid"></em>
           <span>{{userInfo.userName}}</span>
-          <i class="ans-icon-arrow-down"></i>
+          <em class="ans-icon-arrow-down"></em>
         </div>
       </x-poptip>
     </div>
     <div class="file-update-model" @click="_toggleArchive" v-if="isUpdate">
       <div class="icon-cloud">
-        <i class="ans ans-icon-upload"></i>
+        <em class="ans ans-icon-upload"></em>
       </div>
       <div class="progress-box">
         <m-progress-bar :value="progress" text-placement="bottom"></m-progress-bar>
@@ -112,35 +112,35 @@
     </div>
     <div class="adaptive-m-nav">
       <div class="m-nav-box ">
-        <a href="javascript:" @click="mIsNav = !mIsNav"><i class="ans-icon-database"></i></a>
+        <a href="javascript:" @click="mIsNav = !mIsNav"><em class="ans-icon-database"></em></a>
       </div>
       <div class="m-title-box">
         <div class="logo-m"></div>
       </div>
       <div class="m-user-box">
-        <a href="javascript:" @click="_goAccount"><i class="ans-icon-user-empty"></i></a>
+        <a href="javascript:" @click="_goAccount"><em class="ans-icon-user-empty"></em></a>
       </div>
       <transition name="slide-fade">
         <div class="m-nav-list" v-if="mIsNav">
           <ul @click="mIsNav = false">
             <router-link :to="{ path: '/home'}" tag="li" active-class="active">
-              <i class="ans-icon-home-empty"></i>
+              <em class="ans-icon-home-empty"></em>
               <span>{{$t('Home')}}</span>
             </router-link>
             <router-link :to="{ path: '/projects'}" tag="li" active-class="active">
-              <i class="ans-icon-setting"></i>
+              <em class="ans-icon-setting"></em>
               <span>{{$t('Project manage')}}</span>
             </router-link>
             <router-link :to="{ path: '/resource'}" tag="li" active-class="active">
-              <i class="ans-icon-folder-empty"></i>
+              <em class="ans-icon-folder-empty"></em>
               <span>{{$t('Resources manage')}}</span>
             </router-link>
             <router-link :to="{ path: '/datasource'}" tag="li" active-class="active">
-              <i class="ans-icon-database"></i>
+              <em class="ans-icon-database"></em>
               <span>{{$t('Datasource manage')}}</span>
             </router-link>
             <router-link :to="{ path: '/security'}" tag="li" active-class="active" v-ps="['ADMIN_USER']">
-              <i class="ans-icon-shield"></i>
+              <em class="ans-icon-shield"></em>
               <span>{{$t('Security')}}</span>
             </router-link>
           </ul>
@@ -431,7 +431,7 @@
         margin-right: 20px;
         cursor: pointer;
         margin-top: 16px;
-        i {
+        em {
           font-size: 18px;
           vertical-align: middle;
           color: #fff;
diff --git a/dolphinscheduler-ui/src/js/module/components/priority/priority.vue b/dolphinscheduler-ui/src/js/module/components/priority/priority.vue
index 3f59433..653343d 100644
--- a/dolphinscheduler-ui/src/js/module/components/priority/priority.vue
+++ b/dolphinscheduler-ui/src/js/module/components/priority/priority.vue
@@ -21,7 +21,7 @@
         <div class="input-element" :class="isDetails?'disabled' : ''">
           <span v-html="_rtUnicode(selectedModel ? selectedModel.label : 'MEDIUM')"></span>
           <span class="label-p">{{selectedModel ? selectedModel.label : 'MEDIUM'}}</span>
-          <i class="ans-icon-arrow-down" ></i>
+          <em class="ans-icon-arrow-down" ></em>
         </div>
       </div>
       <x-option
@@ -31,7 +31,7 @@
               :label="item.code">
         <li class="ans-option ans-option-listp">
           <span class="default-option-class">
-            <i :class="item.unicode" :style="{color:item.color}"></i>
+            <em :class="item.unicode" :style="{color:item.color}"></em>
             {{item.code}}
           </span>
         </li>
@@ -90,7 +90,7 @@
     methods: {
       _rtUnicode (value) {
         let o = _.find(this.priorityList, ['code', value])
-        return `<i class="${o.unicode}" style="color:${o.color}"></i>`
+        return `<em class="${o.unicode}" style="color:${o.color}"></em>`
       },
       _onChange (o) {
         this.value = o.value
diff --git a/dolphinscheduler-ui/src/js/module/components/secondaryMenu/secondaryMenu.vue b/dolphinscheduler-ui/src/js/module/components/secondaryMenu/secondaryMenu.vue
index 0038a35..102df8f 100644
--- a/dolphinscheduler-ui/src/js/module/components/secondaryMenu/secondaryMenu.vue
+++ b/dolphinscheduler-ui/src/js/module/components/secondaryMenu/secondaryMenu.vue
@@ -26,9 +26,9 @@
           <router-link :to="{ name: item.path}">
             <div class="name" @click="_toggleSubMenu(item)">
               <a href="javascript:">
-                <i class="fa icon" :class="item.icon"></i>
+                <em class="fa icon" :class="item.icon"></em>
                 <span>{{item.name}}</span>
-                <i class="fa angle" :class="item.isOpen ? 'ans-icon-arrow-down' : 'ans-icon-arrow-right'" v-if="item.children.length"></i>
+                <em class="fa angle" :class="item.isOpen ? 'ans-icon-arrow-down' : 'ans-icon-arrow-right'" v-if="item.children.length"></em>
               </a>
             </div>
           </router-link>
@@ -36,9 +36,9 @@
         <template v-if="!item.path">
           <div class="name" @click="_toggleSubMenu(item)">
             <a href="javascript:">
-              <i class="fa icon" :class="item.icon"></i>
+              <em class="fa icon" :class="item.icon"></em>
               <span>{{item.name}}</span>
-              <i class="fa angle" :class="item.isOpen ? 'ans-icon-arrow-down' : 'ans-icon-arrow-right'" v-if="item.children.length"></i>
+              <em class="fa angle" :class="item.isOpen ? 'ans-icon-arrow-down' : 'ans-icon-arrow-right'" v-if="item.children.length"></em>
             </a>
           </div>
         </template>
diff --git a/dolphinscheduler-ui/src/js/module/components/tooltipsJSON/tooltipsJSON.vue b/dolphinscheduler-ui/src/js/module/components/tooltipsJSON/tooltipsJSON.vue
index 9fe9873..f5b1ee5 100644
--- a/dolphinscheduler-ui/src/js/module/components/tooltipsJSON/tooltipsJSON.vue
+++ b/dolphinscheduler-ui/src/js/module/components/tooltipsJSON/tooltipsJSON.vue
@@ -20,9 +20,9 @@
             trigger="click"
             placement="bottom-start">
       <pre :id="'result-' + id" class="result"></pre>
-      <i class="iconfont" slot="reference">
+      <em class="iconfont" slot="reference">
         <slot name="reference"></slot>
-      </i>
+      </em>
     </x-poptip>
   </div>
 </template>
diff --git a/dolphinscheduler-ui/src/js/module/components/transfer/resource.vue b/dolphinscheduler-ui/src/js/module/components/transfer/resource.vue
index 3e07a94..8b7da81 100644
--- a/dolphinscheduler-ui/src/js/module/components/transfer/resource.vue
+++ b/dolphinscheduler-ui/src/js/module/components/transfer/resource.vue
@@ -37,7 +37,7 @@
                      placeholder="Please enter keyword"
                      type="text"
                      style="width:202px;">
-              <i slot="suffix" class="ans-icon-search"></i>
+              <em slot="suffix" class="ans-icon-search"></em>
             </x-input>
           </div>-->
           <div class="scrollbar tf-content">
@@ -63,7 +63,7 @@
                      placeholder="Please enter keyword"
                      type="text"
                      style="width:202px;">
-              <i slot="suffix" class="ans-icon-search"></i>
+              <em slot="suffix" class="ans-icon-search"></em>
             </x-input>
           </div>-->
           <div class="scrollbar tf-content">
diff --git a/dolphinscheduler-ui/src/js/module/components/transfer/transfer.vue b/dolphinscheduler-ui/src/js/module/components/transfer/transfer.vue
index 97780b4..eaa9057 100644
--- a/dolphinscheduler-ui/src/js/module/components/transfer/transfer.vue
+++ b/dolphinscheduler-ui/src/js/module/components/transfer/transfer.vue
@@ -31,7 +31,7 @@
                      placeholder="Please enter keyword"
                      type="text"
                      style="width:202px;">
-              <i slot="suffix" class="ans-icon-search"></i>
+              <em slot="suffix" class="ans-icon-search"></em>
             </x-input>
           </div>-->
           <div class="scrollbar tf-content">
@@ -57,7 +57,7 @@
                      placeholder="Please enter keyword"
                      type="text"
                      style="width:202px;">
-              <i slot="suffix" class="ans-icon-search"></i>
+              <em slot="suffix" class="ans-icon-search"></em>
             </x-input>
           </div>-->
           <div class="scrollbar tf-content">
diff --git a/dolphinscheduler-ui/src/sass/common/index.scss b/dolphinscheduler-ui/src/sass/common/index.scss
index d97501d..ba0f93a 100644
--- a/dolphinscheduler-ui/src/sass/common/index.scss
+++ b/dolphinscheduler-ui/src/sass/common/index.scss
@@ -22,8 +22,6 @@
 @import "table";
 
 .ans-input {
-  &.ans-input--default {
-  }
   textarea,input {
     font-weight: 400;
   }
@@ -43,6 +41,7 @@ a:focus {
 }
 
 a:hover{
+  color:#0097e0;
   text-decoration: none !important;
 }
 
@@ -60,7 +59,6 @@ a:hover{
 
 body{
   background: #EDEEED;
-  font-family: "PingFangSC-Light,Helvetica Neue,Helvetica,Microsoft Yahei,Arial,Hiragino Sans GB,tahoma,SimSun,sans-serif";
   .home-main {
     min-height: calc(100vh - 100px);
     background: #fff;
@@ -119,6 +117,13 @@ body{
       }
     }
   }
+  font-family:13px/1.5 PingFangSC-Light,Helvetica Neue,Helvetica,Microsoft Yahei,Arial,Hiragino Sans GB,tahoma,SimSun,sans-serif;
+	-webkit-backface-visibility:hidden;
+	-webkit-tap-highlight-color:transparent;
+	-webkit-text-size-adjust:none;
+	-webkit-touch-callout:none;
+	-webkit-font-smoothing:antialiased;
+	-moz-osx-font-smoothing:grayscale
 }
 
 // icon disabled state
@@ -225,15 +230,6 @@ ol,ul {
 img {
 	border:0
 }
-body {
-	font:13px/1.5 PingFangSC-Light,Helvetica Neue,Helvetica,Microsoft Yahei,Arial,Hiragino Sans GB,tahoma,SimSun,sans-serif;
-	-webkit-backface-visibility:hidden;
-	-webkit-tap-highlight-color:transparent;
-	-webkit-text-size-adjust:none;
-	-webkit-touch-callout:none;
-	-webkit-font-smoothing:antialiased;
-	-moz-osx-font-smoothing:grayscale
-}
 input::-ms-clear,input::-ms-reveal {
 	display:none
 }
@@ -247,10 +243,6 @@ a,body {
 	-webkit-box-sizing:border-box;
 	box-sizing:border-box
 }
-a:hover {
-	color:#0097e0;
-	text-decoration:none
-}
 [hidden],[v-cloak] {
 	display:none
 }