diff --git a/frontend/src/components/widget/DeWidget/DeTabs.vue b/frontend/src/components/widget/DeWidget/DeTabs.vue
index 26ffb9a7b2..18fa38d54a 100644
--- a/frontend/src/components/widget/DeWidget/DeTabs.vue
+++ b/frontend/src/components/widget/DeWidget/DeTabs.vue
@@ -34,7 +34,7 @@
           </el-dropdown>
         </span>
 
-        <div class="de-tab-content">
+        <div v-if="activeTabName === item.name" class="de-tab-content">
           <user-view v-if="item.content" :ref="item.name" :element="item.content" :out-style="outStyle" />
         </div>
 
@@ -75,7 +75,7 @@
       center
     >
       <div style="width: 100%;min-height: 250px; max-height: 300px; overflow-y: auto;">
-        <view-select ref="viewSelect" :select-model="true" />
+        <view-select v-if="viewDialogVisible" ref="viewSelect" :select-model="true" />
       </div>
 
       <span slot="footer" class="dialog-footer">
@@ -161,6 +161,10 @@ export default {
     },
     sureViewSelector() {
       const nodes = this.$refs.viewSelect.getCurrentSelected()
+      if (!nodes || nodes.length === 0) {
+        this.viewDialogVisible = false
+        return
+      }
       const node = nodes[0]
 
       let component
@@ -250,23 +254,8 @@ export default {
   }
   .de-tabs {
     height: 100%;
-    >>>div.el-tabs__content {
-        height: calc(100% - 55px);
-        .el-tab-pane {
-          height: 100%;
-        }
-    }
-  }
-  /* .de-tab-i {
-    transition: 0.1s;
-    opacity: 0;
-    transform:  translateY(100%);
   }
 
-  .de-tab-drop:hover .de-tab-i {
-    opacity: 1;
-    transform:  translateY(0);
-  } */
   .de-tab-content {
     width: 100%;
     height: 100%;
diff --git a/frontend/src/styles/index.scss b/frontend/src/styles/index.scss
index 36e3cc149a..486ee5df21 100644
--- a/frontend/src/styles/index.scss
+++ b/frontend/src/styles/index.scss
@@ -43,9 +43,6 @@ html {
   box-sizing: border-box;
 }
 
-#app {
-  //height: $contentHeight;
-}
 
 *,
 *:before,
@@ -151,6 +148,18 @@ div:focus {
   }
 }
 
+.de-tabs {
+  .el-tabs__header {
+    margin: 0 0 0 0 !important;
+  }
+  .el-tabs__content {
+    height: calc(100% - 55px) !important;
+    .el-tab-pane {
+        height: 100% !important;
+    }
+  }
+}
+
 .de-search-header {
   .el-tabs__header {
     display: none !important;;
@@ -418,6 +427,10 @@ div:focus {
     border: none !important;
 }
 
+.blackTheme .el-picker-panel__footer {
+    background-color: var(--MainBG) !important;
+}
+
 
 .el-pagination {
     button:disabled {
@@ -602,6 +615,10 @@ div:focus {
     background-color: #000000 ;
 }
 
+.blackTheme .CodeMirror-line {
+    background-color: #000000 !important;
+}
+
 .blackTheme .el-radio-button__inner {
     background-color: var(--TableBG);
     color: var(--TableColor);
diff --git a/frontend/src/views/chart/view/ChartEdit.vue b/frontend/src/views/chart/view/ChartEdit.vue
index 4bb044ae7a..1f74048d75 100644
--- a/frontend/src/views/chart/view/ChartEdit.vue
+++ b/frontend/src/views/chart/view/ChartEdit.vue
@@ -613,7 +613,7 @@
       :fullscreen="true"
     >
       <field-edit :param="table" />
-      <div slot="title" class="dialog-footer">
+      <div slot="title" class="dialog-footer title-text">
         <span style="font-size: 14px;">
           {{ $t('dataset.field_manage') }}
           <span v-if="table">[{{ table.name }}]</span>
diff --git a/frontend/src/views/dataset/data/UpdateInfo.vue b/frontend/src/views/dataset/data/UpdateInfo.vue
index 975a744b73..79361f9f9e 100644
--- a/frontend/src/views/dataset/data/UpdateInfo.vue
+++ b/frontend/src/views/dataset/data/UpdateInfo.vue
@@ -96,7 +96,7 @@
         append-to-body
       >
         <el-col>
-          <el-form :form="taskForm" :model="taskForm" label-width="100px" size="mini" ref="taskForm" :rules="taskFormRules">
+          <el-form ref="taskForm" :form="taskForm" :model="taskForm" label-width="100px" size="mini" :rules="taskFormRules">
             <el-form-item :label="$t('dataset.task_name')" prop="name">
               <el-input
                 v-model="taskForm.name"
@@ -143,12 +143,12 @@
 
             <el-form-item v-if="taskForm.rate === 'SIMPLE_CRON'" label="">
               <el-form :inline="true">
-                <el-form-item :label="$t('cron.every')" >
-                  <el-input v-model="taskForm.extraData.simple_cron_value" size="mini" type="number"  min="1" @change="onSimpleCronChange()" />
+                <el-form-item :label="$t('cron.every')">
+                  <el-input v-model="taskForm.extraData.simple_cron_value" size="mini" type="number" min="1" @change="onSimpleCronChange()" />
                 </el-form-item>
 
                 <el-form-item class="form-item">
-                  <el-select v-model="taskForm.extraData.simple_cron_type"  filterable size="mini" @change="onSimpleCronChange()" >
+                  <el-select v-model="taskForm.extraData.simple_cron_type" filterable size="mini" @change="onSimpleCronChange()">
                     <el-option :label="$t('cron.minute_default')" value="minute" />
                     <el-option :label="$t('cron.hour_default')" value="hour" />
                     <el-option :label="$t('cron.day_default')" value="day" />
@@ -189,7 +189,7 @@
           </el-form>
         </el-col>
         <div slot="footer" class="dialog-footer">
-          <el-button size="mini" @click="closeTask">{{ $t('dataset.cancel') }}</el-button>
+          <el-button class="dialog_cancel_button" size="mini" @click="closeTask">{{ $t('dataset.cancel') }}</el-button>
           <el-button type="primary" size="mini" @click="saveTask(taskForm)">{{ $t('dataset.confirm') }}</el-button>
         </div>
       </el-dialog>
@@ -222,19 +222,19 @@
           </el-table-column>
           <el-table-column prop="status" :label="$t('dataset.task.task_status')">
             <template slot-scope="scope">
-            <span v-if="scope.row.status === 'Underway'" style="color: green">
-              <el-link type="success" style="font-size: 12px" @click="changeTaskStatus(scope.row)">{{ $t('dataset.task.underway') }}</el-link>
-            </span>
+              <span v-if="scope.row.status === 'Underway'" style="color: green">
+                <el-link type="success" style="font-size: 12px" @click="changeTaskStatus(scope.row)">{{ $t('dataset.task.underway') }}</el-link>
+              </span>
               <span v-if="scope.row.status === 'Stopped'" style="color: red">
-              <div type="danger" style="font-size: 12px">{{ $t('dataset.task.stopped') }}</div>
-            </span>
+                <div type="danger" style="font-size: 12px">{{ $t('dataset.task.stopped') }}</div>
+              </span>
               <span v-if="scope.row.status === 'Pending'" style="color: blue">
-              <el-link type="primary" style="font-size: 12px" @click="changeTaskStatus(scope.row)">{{ $t('dataset.task.pending') }}</el-link>
-            </span>
+                <el-link type="primary" style="font-size: 12px" @click="changeTaskStatus(scope.row)">{{ $t('dataset.task.pending') }}</el-link>
+              </span>
               <span v-if="scope.row.status === 'Exec'" style="color: blue">
-              <i class="el-icon-loading" />
-              {{ $t('dataset.underway') }}
-            </span>
+                <i class="el-icon-loading" />
+                {{ $t('dataset.underway') }}
+              </span>
             </template>
           </el-table-column>
           <el-table-column
@@ -432,7 +432,7 @@ export default {
   created() {
     this.timer = setInterval(() => {
       this.listTaskLog(false)
-    }, 5000);
+    }, 5000)
     this.taskTimer = setInterval(() => {
       this.listTask(false)
     }, 5000)
@@ -574,10 +574,9 @@ export default {
             this.listTask()
             this.listTaskLog()
           })
-        }else {
+        } else {
           return false
         }
-
       })
     },
     changeTaskStatus(task) {
@@ -617,27 +616,27 @@ export default {
     },
     onSimpleCronChange() {
       if (this.taskForm.extraData.simple_cron_type === 'minute') {
-        if(this.taskForm.extraData.simple_cron_value < 1 || this.taskForm.extraData.simple_cron_value > 59){
-          this.$message({message: this.$t('cron.minute_limit'), type: 'warning', showClose: true})
+        if (this.taskForm.extraData.simple_cron_value < 1 || this.taskForm.extraData.simple_cron_value > 59) {
+          this.$message({ message: this.$t('cron.minute_limit'), type: 'warning', showClose: true })
           this.taskForm.extraData.simple_cron_value = 59
         }
-        this.taskForm.cron = '0 0/'+ this.taskForm.extraData.simple_cron_value + ' * * * ? *'
+        this.taskForm.cron = '0 0/' + this.taskForm.extraData.simple_cron_value + ' * * * ? *'
         return
       }
       if (this.taskForm.extraData.simple_cron_type === 'hour') {
-        if(this.taskForm.extraData.simple_cron_value < 1 || this.taskForm.extraData.simple_cron_value > 23){
-          this.$message({message: this.$t('cron.hour_limit'), type: 'warning', showClose: true})
+        if (this.taskForm.extraData.simple_cron_value < 1 || this.taskForm.extraData.simple_cron_value > 23) {
+          this.$message({ message: this.$t('cron.hour_limit'), type: 'warning', showClose: true })
           this.taskForm.extraData.simple_cron_value = 23
         }
-        this.taskForm.cron = '0 0 0/'+ this.taskForm.extraData.simple_cron_value + ' * * ? *'
+        this.taskForm.cron = '0 0 0/' + this.taskForm.extraData.simple_cron_value + ' * * ? *'
         return
       }
       if (this.taskForm.extraData.simple_cron_type === 'day') {
-        if(this.taskForm.extraData.simple_cron_value < 1 || this.taskForm.extraData.simple_cron_value > 31){
-          this.$message({message: this.$t('cron.day_limit'), type: 'warning', showClose: true})
+        if (this.taskForm.extraData.simple_cron_value < 1 || this.taskForm.extraData.simple_cron_value > 31) {
+          this.$message({ message: this.$t('cron.day_limit'), type: 'warning', showClose: true })
           this.taskForm.extraData.simple_cron_value = 31
         }
-        this.taskForm.cron = '0 0 0 1/'+ this.taskForm.extraData.simple_cron_value + ' * ? *'
+        this.taskForm.cron = '0 0 0 1/' + this.taskForm.extraData.simple_cron_value + ' * ? *'
         return
       }
     },
@@ -647,16 +646,16 @@ export default {
         this.taskForm.endTime = ''
         this.taskForm.cron = ''
       }
-      if (this.taskForm.rate === 'SIMPLE_CRON'){
+      if (this.taskForm.rate === 'SIMPLE_CRON') {
         this.taskForm.cron = '0 0 0/1 *  * ? *'
       }
-      if (this.taskForm.rate === 'CRON'){
+      if (this.taskForm.rate === 'CRON') {
         this.taskForm.cron = '00 00 * ? * * *'
       }
     },
     listTaskLog(loading = true) {
-      const params = {"conditions":[{"field":"dataset_table_task_log.table_id","operator":"eq","value": this.table.id}],"orders":[]}
-      post('/dataset/taskLog/list/' +  this.table.type + '/' + this.page.currentPage + '/' + this.page.pageSize, params, loading).then(response => {
+      const params = { 'conditions': [{ 'field': 'dataset_table_task_log.table_id', 'operator': 'eq', 'value': this.table.id }], 'orders': [] }
+      post('/dataset/taskLog/list/' + this.table.type + '/' + this.page.currentPage + '/' + this.page.pageSize, params, loading).then(response => {
         this.taskLogData = response.data.listObject
         this.page.total = response.data.itemCount
       })
@@ -754,6 +753,11 @@ export default {
     overflow: hidden ;
   }
 
+  .blackTheme .dialog_cancel_button {
+    background-color: #171b22 !important;
+    color: #2681ff !important;
+  }
+
   .span{
     font-size: 12px;
   }