diff --git a/backend/src/main/java/io/dataease/controller/dataset/DataSetTableController.java b/backend/src/main/java/io/dataease/controller/dataset/DataSetTableController.java
index 471297caff..3fd116cee9 100644
--- a/backend/src/main/java/io/dataease/controller/dataset/DataSetTableController.java
+++ b/backend/src/main/java/io/dataease/controller/dataset/DataSetTableController.java
@@ -72,11 +72,12 @@ public class DataSetTableController {
     }, logical = Logical.AND)
     @ApiOperation("更新")
     @PostMapping("update")
-    public List<DatasetTable> save(@RequestBody DataSetTableRequest datasetTable) throws Exception {
+    public List<VAuthModelDTO> save(@RequestBody DataSetTableRequest datasetTable) throws Exception {
         if (datasetTable.getType().equalsIgnoreCase("excel")) {
-            return dataSetTableService.saveExcel(datasetTable);
+            List<String> ids = dataSetTableService.saveExcel(datasetTable).stream().map(DatasetTable::getId).collect(Collectors.toList());
+            return vAuthModelService.queryAuthModelByIds("dataset", ids);
         } else {
-            return Collections.singletonList(dataSetTableService.save(datasetTable));
+            return vAuthModelService.queryAuthModelByIds("dataset", Collections.singletonList(dataSetTableService.save(datasetTable).getId()));
         }
     }
 
diff --git a/backend/src/main/java/io/dataease/provider/datasource/ApiProvider.java b/backend/src/main/java/io/dataease/provider/datasource/ApiProvider.java
index ddbcb5c9e0..913168cf15 100644
--- a/backend/src/main/java/io/dataease/provider/datasource/ApiProvider.java
+++ b/backend/src/main/java/io/dataease/provider/datasource/ApiProvider.java
@@ -336,14 +336,15 @@ public class ApiProvider extends Provider {
         o.put("deType", 0);
         o.put("extField", 0);
         o.put("checked", false);
-//        for (DatasetTableFieldDTO fieldDTO : apiDefinition.getFields()) {
-//            if (StringUtils.isNotEmpty(o.getString("jsonPath")) && StringUtils.isNotEmpty(fieldDTO.getJsonPath()) && fieldDTO.getJsonPath().equals(o.getString("jsonPath"))) {
-//                o.put("checked", true);
-//                o.put("deExtractType", fieldDTO.getDeExtractType());
-//                o.put("name", fieldDTO.getName());
-//            }
-//        }
-
+        if (!apiDefinition.isUseJsonPath()) {
+            for (DatasetTableFieldDTO fieldDTO : apiDefinition.getFields()) {
+                if (StringUtils.isNotEmpty(o.getString("jsonPath")) && StringUtils.isNotEmpty(fieldDTO.getJsonPath()) && fieldDTO.getJsonPath().equals(o.getString("jsonPath"))) {
+                    o.put("checked", true);
+                    o.put("deExtractType", fieldDTO.getDeExtractType());
+                    o.put("name", fieldDTO.getName());
+                }
+            }
+        }
     }
 
     static private boolean hasItem(ApiDefinition apiDefinition, List<JSONObject> fields, JSONObject item) {
diff --git a/frontend/src/components/canvas/utils/style.js b/frontend/src/components/canvas/utils/style.js
index d6e254e97a..448ac7e418 100644
--- a/frontend/src/components/canvas/utils/style.js
+++ b/frontend/src/components/canvas/utils/style.js
@@ -381,7 +381,10 @@ export function adaptCurThemeCommonStyle(component) {
   if (isFilterComponent(component.component)) {
     const filterStyle = store.state.canvasStyleData.chartInfo.filterStyle
     for (const styleKey in filterStyle) {
-      Vue.set(component.style, styleKey, filterStyle[styleKey])
+      // 位置属性不修改
+      if (styleKey !== 'horizontal' && styleKey !== 'vertical') {
+        Vue.set(component.style, styleKey, filterStyle[styleKey])
+      }
     }
   } else if (isTabComponent(component.component)) {
     const tabStyle = store.state.canvasStyleData.chartInfo.tabStyle
diff --git a/frontend/src/components/widget/deWidget/TitlePosition.vue b/frontend/src/components/widget/deWidget/TitlePosition.vue
index 1af68342f3..fb9b0e2645 100644
--- a/frontend/src/components/widget/deWidget/TitlePosition.vue
+++ b/frontend/src/components/widget/deWidget/TitlePosition.vue
@@ -19,12 +19,14 @@
           <el-radio-group
             v-model="styleInfo.horizontal"
             size="mini"
+            @change="styleChange"
           >
             <el-radio-button label="left">{{ $t('chart.text_pos_left') }}</el-radio-button>
             <el-radio-button
               :disabled="styleInfo.vertical === 'center' && elementType !== 'de-select-grid'"
               label="center"
-            >{{ $t('chart.text_pos_center') }}</el-radio-button>
+            >{{ $t('chart.text_pos_center') }}
+            </el-radio-button>
             <el-radio-button label="right">{{ $t('chart.text_pos_right') }}</el-radio-button>
           </el-radio-group>
         </el-form-item>
@@ -36,12 +38,14 @@
           <el-radio-group
             v-model="styleInfo.vertical"
             size="mini"
+            @change="styleChange"
           >
             <el-radio-button label="top">{{ $t('chart.text_pos_top') }}</el-radio-button>
             <el-radio-button
               :disabled="styleInfo.horizontal === 'center'"
               label="center"
-            >{{ $t('chart.text_pos_center') }}</el-radio-button>
+            >{{ $t('chart.text_pos_center') }}
+            </el-radio-button>
           </el-radio-group>
         </el-form-item>
 
@@ -73,6 +77,12 @@ export default {
       type: String,
       default: ''
     }
+  },
+
+  methods: {
+    styleChange() {
+      this.$store.commit('canvasChange')
+    }
   }
 
 }
diff --git a/frontend/src/views/chart/components/functionStyle/MapMarkSelector.vue b/frontend/src/views/chart/components/functionStyle/MapMarkSelector.vue
index 8439fa2b92..0068368aa7 100644
--- a/frontend/src/views/chart/components/functionStyle/MapMarkSelector.vue
+++ b/frontend/src/views/chart/components/functionStyle/MapMarkSelector.vue
@@ -393,7 +393,6 @@ export default {
     },
     getItemTagType() {
       this.$refs['markForm'].validate((valid) => {
-        console.log(valid)
       })
     }
   }
diff --git a/frontend/src/views/dataset/add/AddCustom.vue b/frontend/src/views/dataset/add/AddCustom.vue
index d2d473d78e..e336ce4bb0 100644
--- a/frontend/src/views/dataset/add/AddCustom.vue
+++ b/frontend/src/views/dataset/add/AddCustom.vue
@@ -5,7 +5,7 @@
       class="title-text"
     >
       <span style="line-height: 26px;">
-        {{ param.tableId?$t('dataset.edit_custom_table'):$t('dataset.add_custom_table') }}
+        {{ param.tableId ? $t('dataset.edit_custom_table') : $t('dataset.add_custom_table') }}
       </span>
       <el-row style="float: right">
         <el-button
@@ -24,7 +24,7 @@
         </el-button>
       </el-row>
     </el-row>
-    <el-divider />
+    <el-divider/>
     <el-row>
       <el-form :inline="true">
         <el-form-item
@@ -105,9 +105,10 @@
 </template>
 
 <script>
-import { post, getTable } from '@/api/dataset/dataset'
+import { getTable, post } from '@/api/dataset/dataset'
 import DatasetGroupSelector from '../common/DatasetGroupSelector'
 import DatasetCustomField from '../common/DatasetCustomField'
+import { updateCacheTree } from '@/components/canvas/utils/utils'
 
 export default {
   name: 'AddCustom',
@@ -252,6 +253,12 @@ export default {
       }
       post('/dataset/table/update', table).then(response => {
         // this.$store.dispatch('dataset/setSceneData', new Date().getTime())
+        if (table.id) {
+          const renameNode = { id: table.id, name: table.name, label: table.name }
+          updateCacheTree('rename', 'dataset-tree', renameNode, JSON.parse(localStorage.getItem('dataset-tree')))
+        } else {
+          updateCacheTree('batchNew', 'dataset-tree', response.data, JSON.parse(localStorage.getItem('dataset-tree')))
+        }
         this.$emit('saveSuccess', table)
         this.cancel()
       })
@@ -296,49 +303,50 @@ export default {
 </script>
 
 <style scoped>
-  .el-divider--horizontal {
-    margin: 12px 0;
-  }
+.el-divider--horizontal {
+  margin: 12px 0;
+}
 
-  .form-item {
-    margin-bottom: 6px;
-  }
+.form-item {
+  margin-bottom: 6px;
+}
 
-  .el-checkbox {
-    margin-bottom: 14px;
-    margin-left: 0;
-    margin-right: 14px;
-  }
+.el-checkbox {
+  margin-bottom: 14px;
+  margin-left: 0;
+  margin-right: 14px;
+}
 
-  .el-checkbox.is-bordered + .el-checkbox.is-bordered {
-    margin-left: 0;
-  }
+.el-checkbox.is-bordered + .el-checkbox.is-bordered {
+  margin-left: 0;
+}
 
-  .dataPreview ::v-deep .el-card__header{
-    padding: 0 8px 12px;
-  }
+.dataPreview ::v-deep .el-card__header {
+  padding: 0 8px 12px;
+}
 
-  .dataPreview ::v-deep .el-card__body{
-    padding:10px;
-  }
+.dataPreview ::v-deep .el-card__body {
+  padding: 10px;
+}
 
-  span{
-    font-size: 14px;
-  }
+span {
+  font-size: 14px;
+}
 
-  .panel-height{
-    height: calc(100vh - 56px - 15px - 26px - 25px - 43px);
-  }
+.panel-height {
+  height: calc(100vh - 56px - 15px - 26px - 25px - 43px);
+}
 
-  .blackTheme .panel-height{
-    height: calc(100vh - 56px - 15px - 26px - 25px - 43px);
-    border-color: var(--TableBorderColor) !important;
-  }
+.blackTheme .panel-height {
+  height: calc(100vh - 56px - 15px - 26px - 25px - 43px);
+  border-color: var(--TableBorderColor) !important;
+}
 
-  .span-number{
-    color: #0a7be0;
-  }
-  .table-count{
-    color: #606266;
-  }
+.span-number {
+  color: #0a7be0;
+}
+
+.table-count {
+  color: #606266;
+}
 </style>
diff --git a/frontend/src/views/dataset/add/AddExcel.vue b/frontend/src/views/dataset/add/AddExcel.vue
index cae74db8ae..83c3f58d83 100644
--- a/frontend/src/views/dataset/add/AddExcel.vue
+++ b/frontend/src/views/dataset/add/AddExcel.vue
@@ -8,7 +8,7 @@
       class="arrow-right"
       @click="showLeft = true"
     >
-      <i class="el-icon-d-arrow-right" />
+      <i class="el-icon-d-arrow-right"/>
     </p>
     <div
       v-show="showLeft"
@@ -21,16 +21,16 @@
             effect="dark"
             placement="right"
           >
-            <div slot="content">
-              {{ $t('dataset.excel_info_1') }}<br>
-              {{ $t('dataset.excel_info_2') }}<br>
-              {{ $t('dataset.excel_info_3') }}
-            </div>
-            <i class="el-icon-warning-outline" /> </el-tooltip></span>
-        <i
-          class="el-icon-d-arrow-left"
-          @click="showLeft = false"
-        />
+      <div slot="content">
+        {{ $t('dataset.excel_info_1') }}<br>
+        {{ $t('dataset.excel_info_2') }}<br>
+        {{ $t('dataset.excel_info_3') }}
+      </div>
+      <i class="el-icon-warning-outline"/> </el-tooltip></span>
+      <i
+        class="el-icon-d-arrow-left"
+        @click="showLeft = false"
+      />
       </p>
       <el-upload
         :action="baseUrl + 'dataset/table/excel/upload'"
@@ -160,7 +160,7 @@
                   :key="field.fieldName + field.fieldType"
                   @command="(type) => handleCommand(type, field)"
                 >
-                  <span  class="type-switch">
+                  <span class="type-switch">
                     <svg-icon
                       v-if="field.fieldType === 'TEXT'"
                       icon-class="field_text"
@@ -179,7 +179,7 @@
                       icon-class="field_value"
                       class="field-icon-value"
                     />
-                    <i class="el-icon-arrow-down el-icon--right" /></span>
+                    <i class="el-icon-arrow-down el-icon--right"/></span>
                   <el-dropdown-menu
                     slot="dropdown"
                     style="width: 178px"
@@ -237,8 +237,11 @@ import { $alert } from '@/utils/message'
 import store from '@/store'
 import msgCfm from '@/components/msgCfm/index'
 import cancelMix from './cancelMix'
+import Config from "@/settings";
+import { updateCacheTree } from '@/components/canvas/utils/utils'
 
 const token = getToken()
+const RefreshTokenKey = Config.RefreshTokenKey
 
 export default {
   name: 'AddExcel',
@@ -453,6 +456,12 @@ export default {
         this.$refs.tree.setCheckedKeys(this.defaultCheckedKeys)
       })
       this.fileList = fileList
+
+      if (response.headers[RefreshTokenKey]) {
+        const refreshToken = response.headers[RefreshTokenKey]
+        setToken(refreshToken)
+        store.dispatch('user/refreshToken', refreshToken)
+      }
     },
 
     save() {
@@ -569,6 +578,9 @@ export default {
             table.mergeSheet = false
             post('/dataset/table/update', table)
               .then((response) => {
+                if (!table.id) {
+                  updateCacheTree('batchNew', 'dataset-tree', response.data, JSON.parse(localStorage.getItem('dataset-tree')))
+                }
                 this.openMessageSuccess('deDataset.set_saved_successfully')
                 this.cancel(response.data)
               })
@@ -582,6 +594,9 @@ export default {
         this.loading = true
         post('/dataset/table/update', table)
           .then((response) => {
+            if (!table.id) {
+              updateCacheTree('batchNew', 'dataset-tree', response.data, JSON.parse(localStorage.getItem('dataset-tree')))
+            }
             this.openMessageSuccess('deDataset.set_saved_successfully')
             this.cancel(response.data)
           })
@@ -637,10 +652,12 @@ export default {
     border-top-right-radius: 13px;
     border-bottom-right-radius: 13px;
   }
+
   .table-list {
     p {
       margin: 0;
     }
+
     height: 100%;
     width: 240px;
     padding: 16px 12px;
@@ -653,6 +670,7 @@ export default {
       display: flex;
       justify-content: space-between;
       color: var(--deTextPrimary, #1f2329);
+
       i {
         font-size: 14px;
         color: var(--deTextPlaceholder, #8f959e);
@@ -666,10 +684,12 @@ export default {
     .table-checkbox-list {
       height: calc(100% - 100px);
       overflow-y: auto;
+
       .custom-tree-node {
         position: relative;
         width: 80%;
         display: flex;
+
         .label {
           overflow: hidden;
           white-space: nowrap;
@@ -677,11 +697,13 @@ export default {
           width: 85%;
         }
       }
+
       .error-name-exist {
         position: absolute;
         top: 0;
         right: 0;
       }
+
       .item {
         height: 40px;
         width: 215px;
@@ -719,6 +741,7 @@ export default {
       display: flex;
       align-items: center;
       position: relative;
+
       .name {
         font-size: 14px;
         font-weight: 400;
@@ -749,10 +772,12 @@ export default {
         padding: 2px 1.5px;
         display: inline-block;
         cursor: pointer;
+
         i {
           margin-left: 4px;
           font-size: 12px;
         }
+
         &:hover {
           background: rgba(31, 35, 41, 0.1);
           border-radius: 4px;
diff --git a/frontend/src/views/dataset/add/AddSQL.vue b/frontend/src/views/dataset/add/AddSQL.vue
index d3cef63e5c..fb193a2f0e 100644
--- a/frontend/src/views/dataset/add/AddSQL.vue
+++ b/frontend/src/views/dataset/add/AddSQL.vue
@@ -70,7 +70,7 @@
             class="de-text-btn"
             @click="dataReference = true"
           >
-            <svg-icon icon-class="data-reference" />
+            <svg-icon icon-class="data-reference"/>
             {{ $t('deDataset.data_reference') }}
           </el-button>
           <el-button
@@ -80,17 +80,17 @@
             class="de-text-btn"
             @click="variableMgm"
           >
-            <svg-icon icon-class="reference-setting" />
+            <svg-icon icon-class="reference-setting"/>
             {{ $t('sql_variable.variable_mgm') }}
           </el-button>
-          <el-divider direction="vertical" />
+          <el-divider direction="vertical"/>
           <el-button
             class="de-text-btn"
             type="text"
             size="small"
             @click="getSQLPreview"
           >
-            <svg-icon icon-class="reference-play" />
+            <svg-icon icon-class="reference-play"/>
             {{ $t('deDataset.run_a_query') }}
           </el-button>
         </el-col>
@@ -111,7 +111,7 @@
                 dataTable = ''
                 ;keywords = ''
               "
-            ><i class="el-icon-arrow-left" /> {{ $t('chart.back') }}</span>
+            ><i class="el-icon-arrow-left"/> {{ $t('chart.back') }}</span>
             <span v-else>{{ $t('deDataset.data_reference') }}</span>
             <i
               style="cursor: pointer"
@@ -131,7 +131,7 @@
               :title="(showTable && dataTable) || selectedDatasource.name"
               class="grey-name"
             >
-              <svg-icon icon-class="db-de" />
+              <svg-icon icon-class="db-de"/>
               {{ (showTable && dataTable) || selectedDatasource.name }}
             </span>
             <span class="grey">
@@ -146,59 +146,61 @@
           v-if="!dataSource"
           class="no-select-datasource"
         >{{
-          $t('deDataset.to_start_using')
-        }}</span>
+            $t('deDataset.to_start_using')
+          }}</span>
         <template v-else>
-          <el-input :placeholder="$t('fu.search_bar.please_input')" style="padding: 5px" size="small" v-model="keywords"></el-input>
+          <el-input :placeholder="$t('fu.search_bar.please_input')" style="padding: 5px" size="small"
+                    v-model="keywords"
+          ></el-input>
           <div
-          v-if="dataSource && !dataTable"
-          v-loading="tableLoading"
-          class="item-list"
-        >
-          <div
-            v-for="ele in tableDataCopy"
-            :key="ele.name"
-            class="table-or-field"
-            @click="typeSwitch(ele)"
+            v-if="dataSource && !dataTable"
+            v-loading="tableLoading"
+            class="item-list"
           >
+            <div
+              v-for="ele in tableDataCopy"
+              :key="ele.name"
+              class="table-or-field"
+              @click="typeSwitch(ele)"
+            >
             <span
               :title="ele.remark"
               class="name"
             >{{ ele.name }}</span>
-            <i
-              v-clipboard:copy="ele.name"
-              v-clipboard:success="onCopy"
-              v-clipboard:error="onError"
-              class="el-icon-document-copy"
-              @click.stop
-            />
+              <i
+                v-clipboard:copy="ele.name"
+                v-clipboard:success="onCopy"
+                v-clipboard:error="onError"
+                class="el-icon-document-copy"
+                @click.stop
+              />
+            </div>
           </div>
-        </div>
-        <div
-          v-else-if="dataSource && dataTable"
-          v-loading="tableLoading"
-          class="item-list"
-        >
           <div
-            v-for="ele in fieldDataCopy"
-            :key="ele.fieldName"
-            class="table-or-field field"
+            v-else-if="dataSource && dataTable"
+            v-loading="tableLoading"
+            class="item-list"
           >
+            <div
+              v-for="ele in fieldDataCopy"
+              :key="ele.fieldName"
+              class="table-or-field field"
+            >
             <span
               :title="ele.remarks"
               class="name"
             >{{ ele.fieldName }}</span>
-            <i
-              v-clipboard:copy="ele.fieldName"
-              v-clipboard:success="onCopy"
-              v-clipboard:error="onError"
-              class="el-icon-document-copy"
-              @click.stop
-            />
+              <i
+                v-clipboard:copy="ele.fieldName"
+                v-clipboard:success="onCopy"
+                v-clipboard:error="onError"
+                class="el-icon-document-copy"
+                @click.stop
+              />
+            </div>
           </div>
-        </div>
         </template>
-        
+
       </div>
       <div class="sql-table">
         <div
@@ -229,10 +231,10 @@
               v-if="tabActive === 'result'"
               class="result-num"
             >{{
-              `(${$t('dataset.preview_show')} 1000 ${$t(
-                'dataset.preview_item'
-              )})`
-            }}</span>
+                `(${$t('dataset.preview_show')} 1000 ${$t(
+                  'dataset.preview_item'
+                )})`
+              }}</span>
 
             <span
               class="drag"
@@ -269,7 +271,8 @@
               :image-size="60"
               :image="errImg"
               :description="$t('deDataset.run_failed')"
-            >{{ errMsgCont }}</el-empty>
+            >{{ errMsgCont }}
+            </el-empty>
             <el-table
               v-else
               :data="plxTableData"
@@ -365,7 +368,7 @@
             direction="rtl"
           >
             <div class="content">
-              <i class="el-icon-info" />
+              <i class="el-icon-info"/>
               {{ $t('dataset.sql_variable_limit_1') }}<br>
               {{ $t('dataset.sql_variable_limit_2') }}<br>
             </div>
@@ -451,7 +454,7 @@
                     :content="$t('commons.parameter_effect')"
                     placement="top"
                   >
-                    <i class="el-icon-warning" />
+                    <i class="el-icon-warning"/>
                   </el-tooltip>
                 </template>
                 <template slot-scope="scope">
@@ -519,14 +522,16 @@
                 secondary
                 @click="closeVariableMgm"
               >{{
-                $t('dataset.cancel')
-              }}</deBtn>
+                  $t('dataset.cancel')
+                }}
+              </deBtn>
               <deBtn
                 type="primary"
                 @click="saveVariable()"
               >{{
-                $t('dataset.confirm')
-              }}</deBtn>
+                  $t('dataset.confirm')
+                }}
+              </deBtn>
             </div>
           </el-drawer>
         </div>
@@ -536,9 +541,8 @@
 </template>
 
 <script>
-import { post, listDatasource, isKettleRunning } from '@/api/dataset/dataset'
+import { getTable, isKettleRunning, listDatasource, post } from '@/api/dataset/dataset'
 import { codemirror } from 'vue-codemirror'
-import { getTable } from '@/api/dataset/dataset'
 import { Base64 } from 'js-base64'
 // 核心样式
 import 'codemirror/lib/codemirror.css'
@@ -568,6 +572,8 @@ import cancelMix from './cancelMix'
 import { pySort } from './util'
 import _ from 'lodash'
 import GridTable from '@/components/gridTable/index.vue'
+import { updateCacheTree } from '@/components/canvas/utils/utils'
+
 export default {
   name: 'AddSQL',
   components: { codemirror, GridTable },
@@ -575,7 +581,8 @@ export default {
   props: {
     param: {
       type: Object,
-      default: () => {}
+      default: () => {
+      }
     }
   },
   data() {
@@ -762,7 +769,7 @@ export default {
         this.fieldData = res.data
         this.fieldDataCopy = this.arrSort([...this.fieldData])
       })
-      .finally(() => {
+        .finally(() => {
           this.tableLoading = false
         })
     },
@@ -827,8 +834,8 @@ export default {
     },
     arrSort(arr = [], field = 'fieldName') {
       arr.sort((a, b) => {
-            return a[field][0].toLowerCase().charCodeAt() - b[field][0].toLowerCase().charCodeAt()
-          })
+        return a[field][0].toLowerCase().charCodeAt() - b[field][0].toLowerCase().charCodeAt()
+      })
 
       return arr
     },
@@ -923,16 +930,17 @@ export default {
     listSqlLog() {
       post(
         '/dataset/table/sqlLog/' +
-          this.paginationConfig.currentPage +
-          '/' +
-          this.paginationConfig.pageSize,
+        this.paginationConfig.currentPage +
+        '/' +
+        this.paginationConfig.pageSize,
         { id: this.param.tableId, dataSourceId: this.dataSource }
       )
         .then((response) => {
           this.sqlData = response.data.listObject
           this.paginationConfig.total = response.data.itemCount
         })
-        .catch(() => {})
+        .catch(() => {
+        })
     },
     save() {
       if (!this.dataSource || this.datasource === '') {
@@ -965,6 +973,12 @@ export default {
       }
       post('/dataset/table/update', table)
         .then((response) => {
+          if (table.id) {
+            const renameNode = { id: table.id, name: table.name, label: table.name }
+            updateCacheTree('rename', 'dataset-tree', renameNode, JSON.parse(localStorage.getItem('dataset-tree')))
+          } else {
+            updateCacheTree('batchNew', 'dataset-tree', response.data, JSON.parse(localStorage.getItem('dataset-tree')))
+          }
           this.openMessageSuccess('deDataset.set_saved_successfully')
           this.cancel(response.data)
         })
@@ -975,14 +989,16 @@ export default {
     onCopy(e) {
       this.openMessageSuccess('commons.copy_success')
     },
-    onError(e) {},
+    onError(e) {
+    },
     showSQL(val) {
       this.sql = val || ''
     },
     onCmReady(cm) {
       this.codemirror.setSize('-webkit-fill-available', 'auto')
     },
-    onCmFocus(cm) {},
+    onCmFocus(cm) {
+    },
     onCmCodeChange(newCode) {
       this.sql = newCode
       this.$emit('codeChange', this.sql)
@@ -1068,6 +1084,7 @@ export default {
 
   .select-type {
     width: 180px;
+
     .el-input__inner {
       padding-left: 32px;
     }
@@ -1079,6 +1096,7 @@ export default {
     top: 50%;
     transform: translateY(-50%);
   }
+
   .content {
     height: 62px;
     width: 822px;
@@ -1097,14 +1115,17 @@ export default {
       font-size: 14px;
       color: var(--primary, #3370ff);
     }
+
     margin-bottom: 16px;
   }
 }
+
 .dataset-sql {
   height: 100%;
   width: 100%;
   display: flex;
   flex-direction: column;
+
   .sql-editer {
     background: #f5f6f7;
     padding: 16px 24px;
@@ -1115,11 +1136,13 @@ export default {
     display: flex;
     flex-direction: row-reverse;
     overflow: hidden;
+
     .data-reference {
       width: 280px;
       height: 100%;
       overflow: hidden;
       border-left: 1px solid var(--deCardStrokeColor, #dee0e3);
+
       .no-select-datasource {
         font-family: PingFang SC;
         font-size: 14px;
@@ -1129,6 +1152,7 @@ export default {
         width: 100%;
         padding: 16px 12px;
       }
+
       .table-database-name {
         font-family: PingFang SC;
         font-size: 16px;
@@ -1136,6 +1160,7 @@ export default {
         color: var(--deTextPrimary, #1f2329);
         padding: 16px 12px;
         border-bottom: 1px solid var(--deCardStrokeColor, #dee0e3);
+
         p {
           display: flex;
           align-items: center;
@@ -1161,6 +1186,7 @@ export default {
         padding: 16px 8px;
         height: calc(100vh - 242px);
         overflow: auto;
+
         .table-or-field {
           height: 40px;
           width: 100%;
@@ -1203,34 +1229,40 @@ export default {
             i {
               display: block;
             }
+
             background: rgba(31, 35, 41, 0.1);
           }
         }
       }
     }
+
     .sql-table {
       flex: 1;
       height: 100%;
       display: flex;
       flex-direction: column;
       overflow: hidden;
+
       .code-container {
         background: #f5f6f7;
         box-sizing: border-box;
         min-height: 248px;
         color: var(--deTextPrimary, #1f2329);
+
         .CodeMirror {
           height: 100% !important;
         }
       }
     }
   }
+
   .sql-result {
     font-family: PingFang SC;
     font-size: 14px;
     overflow-y: auto;
     box-sizing: border-box;
     flex: 1;
+
     .sql-title {
       user-select: none;
       height: 54px;
@@ -1247,6 +1279,7 @@ export default {
         color: var(--deTextSecondary, #646a73);
         margin-left: 12px;
       }
+
       .drag {
         position: absolute;
         top: 0;
@@ -1271,6 +1304,7 @@ export default {
       padding: 0 25px 18px 25px;
       overflow-y: auto;
       box-sizing: border-box;
+
       .el-empty__bottom,
       .el-empty__description p {
         font-family: PingFang SC;
@@ -1281,16 +1315,20 @@ export default {
       }
     }
   }
+
   .table-container {
     height: calc(100% - 125px);
     padding: 0 24px;
+
     .mar6 {
       margin-right: 6px;
     }
+
     .mar3 {
       margin-left: -3px;
     }
   }
+
   .table-container-filter {
     height: calc(100% - 110px);
   }
diff --git a/frontend/src/views/dataset/add/AddUnion.vue b/frontend/src/views/dataset/add/AddUnion.vue
index b4cc3fe473..1e59168035 100644
--- a/frontend/src/views/dataset/add/AddUnion.vue
+++ b/frontend/src/views/dataset/add/AddUnion.vue
@@ -53,8 +53,8 @@
       <div class="sql-title">
         {{ $t('deDataset.data_preview') }}
         <span class="result-num">{{
-          `(${$t('dataset.preview_show')} 1000 ${$t('dataset.preview_item')})`
-        }}</span>
+            `(${$t('dataset.preview_show')} 1000 ${$t('dataset.preview_item')})`
+          }}</span>
         <span
           class="drag"
           @mousedown="mousedownDrag"
@@ -96,13 +96,15 @@
           secondary
           @click="closeSelectDs()"
         >{{
-          $t('dataset.cancel')
-        }}</deBtn>
+            $t('dataset.cancel')
+          }}
+        </deBtn>
         <deBtn
           :disabled="!tempDs.id"
           type="primary"
           @click="confirmSelectDs()"
-        >{{ $t('dataset.confirm') }}</deBtn>
+        >{{ $t('dataset.confirm') }}
+        </deBtn>
       </div>
     </el-drawer>
 
@@ -120,20 +122,22 @@
       size="840px"
       direction="rtl"
     >
-      <union-edit :union-param="unionParam" />
+      <union-edit :union-param="unionParam"/>
       <div class="de-foot">
         <deBtn
           secondary
           @click="closeEditUnion()"
         >{{
-          $t('dataset.cancel')
-        }}</deBtn>
+            $t('dataset.cancel')
+          }}
+        </deBtn>
         <deBtn
           type="primary"
           @click="confirmEditUnion()"
         >{{
-          $t('dataset.confirm')
-        }}</deBtn>
+            $t('dataset.confirm')
+          }}
+        </deBtn>
       </div>
     </el-drawer>
   </div>
@@ -148,6 +152,8 @@ import { post } from '@/api/dataset/dataset'
 import UnionPreview from '@/views/dataset/add/union/UnionPreview'
 import cancelMix from './cancelMix'
 import msgCfm from '@/components/msgCfm/index'
+import { updateCacheTree } from '@/components/canvas/utils/utils'
+
 export default {
   name: 'AddUnion',
   components: {
@@ -267,6 +273,12 @@ export default {
       }
       post('/dataset/table/update', table)
         .then((response) => {
+          if (table.id) {
+            const renameNode = { id: table.id, name: table.name, label: table.name }
+            updateCacheTree('rename', 'dataset-tree', renameNode, JSON.parse(localStorage.getItem('dataset-tree')))
+          } else {
+            updateCacheTree('batchNew', 'dataset-tree', response.data, JSON.parse(localStorage.getItem('dataset-tree')))
+          }
           this.$emit('saveSuccess', table)
           this.cancel(response.data)
         })
@@ -413,6 +425,7 @@ export default {
     overflow-y: auto;
     box-sizing: border-box;
     flex: 1;
+
     .sql-title {
       user-select: none;
       height: 54px;
@@ -437,6 +450,7 @@ export default {
         color: var(--deTextSecondary, #646a73);
         margin-left: 12px;
       }
+
       .drag {
         position: absolute;
         top: 0;