Merge pull request #4085 from dataease/pr@dev@refactor_app-template

refactor(应用): 优化应用复用历史数据源

frontend/src/views/system/datasource/DsForm.vue

@@ -57,30 +57,6 @@
         @setParams="setParams"
       />
     </div>
-
-    <div
-      v-if="positionCheck('appMarket') && attachForm.datasourceFrom === 'history'"
-      class="de-ds-bottom"
-    >
-      <div
-        class="apply"
-        style="width: 100%"
-      >
-        <template v-if="canEdit">
-          <deBtn
-            secondary
-            @click="closeDraw"
-          >{{ $t('commons.cancel') }}
-          </deBtn>
-          <deBtn
-            v-if="formType === 'add'"
-            type="primary"
-            @click="saveAppMarketHistory"
-          >{{ $t('commons.save') }}
-          </deBtn>
-        </template>
-      </div>
-    </div>
   </div>
 </template>
 

frontend/src/views/system/datasource/DsFormContent.vue

@@ -71,8 +71,8 @@
           </el-form>
           <div class="de-row-rules">
             <span>{{
-              positionCheck('appMarket') ? $t('app_template.datasource_info') : $t('datasource.basic_info')
-            }}</span>
+                positionCheck('appMarket') ? $t('app_template.datasource_info') : $t('datasource.basic_info')
+              }}</span>
           </div>
           <el-form
             ref="historyDsForm"
@@ -325,7 +325,8 @@ export default {
     },
     configFromTabs: {
       type: Object,
-      default: () => {}
+      default: () => {
+      }
     },
     canEdit: {
       type: Boolean,
@@ -708,10 +709,10 @@ export default {
     getDatasourceDetail(id, showModel) {
       this.$emit('update:formLoading', true)
       return getDatasourceDetail(id).then((res) => {
-        if(res.data.configuration){
+        if (res.data.configuration) {
           res.data.configuration = Base64.decode(res.data.configuration)
         }
-        if(res.data.apiConfigurationStr){
+        if (res.data.apiConfigurationStr) {
           res.data.apiConfiguration = JSON.parse(Base64.decode(res.data.apiConfigurationStr))
         }
         this.params = { ...res.data, showModel }
@@ -733,10 +734,10 @@ export default {
       const newArr = []
       for (let index = 0; index < array.length; index++) {
         const element = array[index]
-        if(element.configuration){
+        if (element.configuration) {
           element.configuration = Base64.decode(element.configuration)
         }
-        if(element.apiConfigurationStr){
+        if (element.apiConfigurationStr) {
           element.apiConfiguration = Base64.decode(element.apiConfigurationStr)
         }
         if (this.msgNodeId) {
@@ -801,16 +802,16 @@ export default {
     },
     saveAppMarketHistory() {
       this.$refs.historyDsForm.validate(valid => {
-        if (!valid) {
-          return false
+          if (!valid) {
+            return false
+          }
+          const appApplyForm = {
+            ...this.attachForm,
+            ...this.historyDsForm
+          }
+          const method = this.formType === 'add' ? appApply : appEdit
+          this.appApplyMethod(method, appApplyForm)
         }
-        const appApplyForm = {
-          ...this.attachForm,
-          ...this.historyDsForm
-        }
-        const method = this.formType === 'add' ? appApply : appEdit
-        this.appApplyMethod(method, appApplyForm)
-      }
       )
     },
     save() {
@@ -956,10 +957,10 @@ export default {
       }
       if (this.positionCheck('appMarket')) {
         this.$refs.attachParamsForm.validate(valid => {
-          if (!valid) {
-            return false
+            if (!valid) {
+              return false
+            }
           }
-        }
         )
       }
       this.$refs.dsForm.validate((valid) => {
@@ -1102,10 +1103,10 @@ export default {
       }
       if (this.positionCheck('appMarket')) {
         this.$refs.attachParamsForm.validate(valid => {
-          if (!valid) {
-            return false
+            if (!valid) {
+              return false
+            }
           }
-        }
         )
       }
       this.$refs.dsForm.validate((valid) => {
@@ -1308,12 +1309,11 @@ export default {
   display: flex;
   width: 100%;
   height: 100%;
-  padding: 12px 24px 24px 24px;
-  background: #f5f6f7;
 
   .de-ds-inner {
+    padding: 12px 24px 24px 24px;
     width: 100%;
-    height: 100;
+    height: 100%;
     background: #fff;
     display: flex;
     align-items: center;
@@ -1327,4 +1327,27 @@ export default {
     padding-top: 24px;
   }
 }
+
+.de-ds-bottom {
+  display: flex;
+  text-align: right;
+  align-items: center;
+  justify-content: space-between;
+  height: 56px;
+  padding: 12px 24px;
+  box-shadow: 2px 2px 4px rgba(31, 35, 41, 0.08);
+
+  .name {
+    font-family: 'PingFang SC';
+    font-style: normal;
+    font-weight: 500;
+    font-size: 16px;
+    line-height: 24px;
+    color: var(--deTextPrimary, #1f2329);
+  }
+
+  i {
+    cursor: pointer;
+  }
+}
 </style>