diff --git a/frontend/src/components/canvas/store/layer.js b/frontend/src/components/canvas/store/layer.js
index d30413ff64..c9ee096d67 100644
--- a/frontend/src/components/canvas/store/layer.js
+++ b/frontend/src/components/canvas/store/layer.js
@@ -14,7 +14,6 @@ export default {
           toast('已经到顶了')
         }
       }
-
     },
 
     downComponent({ componentData, curComponent }) {
diff --git a/frontend/src/permission.js b/frontend/src/permission.js
index e490e0a576..ba89f734a7 100644
--- a/frontend/src/permission.js
+++ b/frontend/src/permission.js
@@ -53,7 +53,7 @@ const routeBefore = (callBack) => {
     callBack()
   }
 }
-router.beforeEach(async (to, from, next) => routeBefore(() => {
+router.beforeEach(async(to, from, next) => routeBefore(() => {
   // start progress bar
   NProgress.start()
   const mobileIgnores = ['/delink']
diff --git a/frontend/src/views/chart/components/ChartComponentS2.vue b/frontend/src/views/chart/components/ChartComponentS2.vue
index b1cb8b6555..ce21906be8 100644
--- a/frontend/src/views/chart/components/ChartComponentS2.vue
+++ b/frontend/src/views/chart/components/ChartComponentS2.vue
@@ -67,8 +67,8 @@
           >
             {{ $t('chart.total') }}
             <span>{{
-                (chart.datasetMode === 0 && !not_support_page_dataset.includes(chart.datasourceType)) ? chart.totalItems : ((chart.data && chart.data.tableRow) ? chart.data.tableRow.length : 0)
-              }}</span>
+              (chart.datasetMode === 0 && !not_support_page_dataset.includes(chart.datasourceType)) ? chart.totalItems : ((chart.data && chart.data.tableRow) ? chart.data.tableRow.length : 0)
+            }}</span>
             {{ $t('chart.items') }}
           </span>
           <de-pagination
@@ -199,7 +199,6 @@ export default {
       } else {
         return {}
       }
-
     },
     trackBarStyleTime() {
       return this.trackBarStyle
diff --git a/frontend/src/views/panel/appTemplateMarket/log/index.vue b/frontend/src/views/panel/appTemplateMarket/log/index.vue
index 6057b2be07..e95bfd403a 100644
--- a/frontend/src/views/panel/appTemplateMarket/log/index.vue
+++ b/frontend/src/views/panel/appTemplateMarket/log/index.vue
@@ -36,8 +36,8 @@
           icon="iconfont icon-icon-filter"
           @click="filterShow"
         >{{
-            $t('user.filter')
-          }}
+           $t('user.filter')
+         }}
           <template v-if="filterTexts.length">
             ({{ cacheCondition.length }})
           </template>
@@ -50,7 +50,7 @@
     >
       <span class="sum">{{ paginationConfig.total }}</span>
       <span class="title">{{ $t('user.result_one') }}</span>
-      <el-divider direction="vertical"/>
+      <el-divider direction="vertical" />
       <i
         v-if="showScroll"
         class="el-icon-arrow-left arrow-filter"
@@ -63,9 +63,9 @@
           class="text"
         >
           {{ ele }} <i
-          class="el-icon-close"
-          @click="clearOneFilter(index)"
-        />
+            class="el-icon-close"
+            @click="clearOneFilter(index)"
+          />
         </p>
       </div>
       <i
diff --git a/frontend/src/views/panel/edit/ComponentWait.vue b/frontend/src/views/panel/edit/ComponentWait.vue
index 7769373f06..e2be9e8339 100644
--- a/frontend/src/views/panel/edit/ComponentWait.vue
+++ b/frontend/src/views/panel/edit/ComponentWait.vue
@@ -1,8 +1,8 @@
 <template>
   <el-row class="component-wait">
     <el-tabs
-      class="wait-tab"
       v-model="activeName"
+      class="wait-tab"
       style="padding-left: 10px"
     >
       <el-tab-pane
@@ -37,7 +37,7 @@
       class="component-wait-main"
       style="padding:10px"
     >
-      <mobile-background-selector/>
+      <mobile-background-selector />
     </el-row>
   </el-row>
 </template>
@@ -142,7 +142,6 @@ export default {
   height: 100%;
 }
 
-
 .wait-tab {
   height: 40px !important;
   background-color: #9ea6b2;
diff --git a/frontend/src/views/system/datasource/DsFormContent.vue b/frontend/src/views/system/datasource/DsFormContent.vue
index c13ad0a377..cd3634b941 100644
--- a/frontend/src/views/system/datasource/DsFormContent.vue
+++ b/frontend/src/views/system/datasource/DsFormContent.vue
@@ -70,9 +70,9 @@
             </el-form-item>
           </el-form>
           <div class="de-row-rules">
-              <span>{{
-                  positionCheck('appMarket') ? $t('app_template.datasource_info') : $t('datasource.basic_info')
-                }}</span>
+            <span>{{
+              positionCheck('appMarket') ? $t('app_template.datasource_info') : $t('datasource.basic_info')
+            }}</span>
           </div>
           <el-form
             ref="historyDsForm"
@@ -85,9 +85,9 @@
             label-position="right"
           >
             <el-form-item
+              v-if="positionCheck('appMarket')"
               :label="$t('app_template.datasource_from')"
               prop="datasourceFrom"
-              v-if="positionCheck('appMarket')"
             >
               <el-radio-group
                 v-model="attachForm.datasourceFrom"
@@ -124,7 +124,7 @@
           </el-form>
 
           <el-form
-            v-if="!positionCheck('appMarket') ||  (positionCheck('appMarket')&& attachForm.datasourceFrom === 'new')"
+            v-if="!positionCheck('appMarket') || (positionCheck('appMarket')&& attachForm.datasourceFrom === 'new')"
             ref="dsForm"
             :model="form"
             :rules="rule"
@@ -287,19 +287,20 @@
 <script>
 import {
   addDs,
-  editDs,
-  getSchema,
-  validateDs,
-  validateDsById,
   checkApiDatasource,
+  editDs,
+  getDatasourceDetail,
+  getSchema,
+  listDatasource,
+  listDatasourceType,
   listDriverByType,
-  getDatasourceDetail
+  validateDs,
+  validateDsById
 } from '@/api/system/datasource'
 import { $confirm } from '@/utils/message'
 import i18n from '@/lang/index'
 import DsConfiguration from '@/views/system/datasource/DsConfiguration'
 import PluginCom from '@/views/system/plugin/PluginCom'
-import { listDatasourceType, listDatasource } from '@/api/system/datasource'
 import deTextarea from '@/components/deCustomCm/DeTextarea.vue'
 import msgCfm from '@/components/msgCfm'
 import { dsGroupTree } from '@/api/dataset/dataset'
@@ -347,6 +348,7 @@ export default {
   },
   data() {
     return {
+      appMarketDatasource: [],
       appMarketEdit: true,
       attachRule: {
         panelName: [
@@ -378,9 +380,20 @@ export default {
         panelName: '',
         datasetGroupPid: null,
         datasetGroupId: null,
-        datasetGroupName: ''
+        datasetGroupName: '',
+        datasourceFrom: 'new',
+        datasourceHistoryId: null
       },
       disabled: false,
+      historyFormRule: {
+        datasourceFrom: [
+          {
+            required: true,
+            trigger: 'blur'
+          }
+        ],
+        datasourceHistoryId: [{ required: true, message: i18n.t('dataset.pls_slc_data_source'), trigger: 'blur' }]
+      },
       form: {
         configuration: {
           initialPoolSize: 5,
@@ -601,7 +614,7 @@ export default {
   async created() {
     await this.datasourceTypes()
     this.queryTreeData()
-    const params = this.configFromTabs.id ? this.configFromTabs : this.$route.query
+    const params = this.configFromTabs?.id ? this.configFromTabs : this.$route.query
     let { id, showModel, type, name } = params
     this.params = params
     const appMarketCheck = this.positionCheck('appMarket')
@@ -618,6 +631,8 @@ export default {
       this.attachForm.datasetGroupPid = this.outerParams.datasetGroupPid ? this.outerParams.datasetGroupPid : '0'
       this.attachForm.datasetGroupId = this.outerParams.datasetGroupId
       this.attachForm.datasetGroupName = this.outerParams.datasetGroupName
+      this.attachForm.datasourceFrom = this.outerParams.datasourceFrom ? this.outerParams.datasourceFrom : 'new'
+      this.attachForm.datasourceHistoryId = this.outerParams.datasourceHistoryId
       this.params = {
         id: this.outerParams.datasourceId,
         showModel: this.outerParams.showModel,
@@ -646,6 +661,9 @@ export default {
     })
   },
   methods: {
+    editDatasource() {
+      this.disabled = false
+    },
     baseInfoDisabledCheck(privileges) {
       return !(this.formType === 'add' ? true : hasDataPermission('manage', privileges))
     },
@@ -655,6 +673,11 @@ export default {
         delete node.children
       }
     },
+    getDatasourceOptions() {
+      return listDatasource().then((response) => {
+        this.options = response.data.filter((item) => item.type !== 'api')
+      })
+    },
     getDatasetGroupTree() {
       dsGroupTree({ nodeType: 'group', excludedId: this.attachForm.datasetGroupId }).then(res => {
         this.datasetGroupList = [{
@@ -696,6 +719,9 @@ export default {
     queryTreeData() {
       listDatasource().then((res) => {
         this.tData = this.buildTree(res.data)
+        if (this.positionCheck('appMarket') && res.data) {
+          this.appMarketDatasource = res.data.filter((item) => item.type === this.outerParams.datasourceType)
+        }
       })
     },
     buildTree(array) {
@@ -763,8 +789,19 @@ export default {
     reset() {
       this.$refs.dsForm.resetFields()
     },
-    editDatasource() {
-      this.disabled = false
+    saveAppMarketHistory() {
+      this.$refs.historyDsForm.validate(valid => {
+        if (!valid) {
+          return false
+        }
+        const appApplyForm = {
+          ...this.attachForm,
+          ...this.historyDsForm
+        }
+        const method = this.formType === 'add' ? appApply : appEdit
+        this.appApplyMethod(method, appApplyForm)
+      }
+      )
     },
     save() {
       if (
@@ -942,6 +979,7 @@ export default {
           }
           appApplyForm = {
             ...this.attachForm,
+            ...this.historyDsForm,
             datasourceList: [deepCopy(form)]
           }
           method = this.formType === 'add' ? appApply : appEdit