[cherry-pick] add processDefinitionSimpleList api and optimize page load (#6834)

* [Feature][API] add processDefinitionSimpleList api (#6814)

* add processDefinitionSimpleList api

* add processDefinitionSimpleList api

* Optimize DAG page opening speed (#6830)
Co-authored-by: NJinYong Li <42576980+JinyLeeChina@users.noreply.github.com>
Co-authored-by: Nwangyizhi <wangyizhi1_yewu@cmss.chinamobile.com>

dolphinscheduler-api/src/main/java/org/apache/dolphinscheduler/api/controller/ProcessDefinitionController.java

@@ -438,6 +438,24 @@ public class ProcessDefinitionController extends BaseController {
         return returnDataList(result);
     }
 
+    /**
+     * query Process definition simple list
+     *
+     * @param loginUser login user
+     * @param projectCode project code
+     * @return process definition list
+     */
+    @ApiOperation(value = "querySimpleList", notes = "QUERY_PROCESS_DEFINITION_SIMPLE_LIST_NOTES")
+    @GetMapping(value = "/simple-list")
+    @ResponseStatus(HttpStatus.OK)
+    @ApiException(QUERY_PROCESS_DEFINITION_LIST)
+    @AccessLogAnnotation(ignoreRequestArgs = "loginUser")
+    public Result queryProcessDefinitionSimpleList(@ApiIgnore @RequestAttribute(value = Constants.SESSION_USER) User loginUser,
+                                                   @ApiParam(name = "projectCode", value = "PROJECT_CODE", required = true) @PathVariable long projectCode) {
+        Map<String, Object> result = processDefinitionService.queryProcessDefinitionSimpleList(loginUser, projectCode);
+        return returnDataList(result);
+    }
+
     /**
      * query process definition list paging
      *

dolphinscheduler-api/src/main/java/org/apache/dolphinscheduler/api/service/ProcessDefinitionService.java

@@ -68,6 +68,16 @@ public interface ProcessDefinitionService {
     Map<String, Object> queryProcessDefinitionList(User loginUser,
                                                    long projectCode);
 
+    /**
+     * query process definition simple list
+     *
+     * @param loginUser login user
+     * @param projectCode project code
+     * @return definition simple list
+     */
+    Map<String, Object> queryProcessDefinitionSimpleList(User loginUser,
+                                                         long projectCode);
+
     /**
      * query process definition list paging
      *

dolphinscheduler-api/src/main/java/org/apache/dolphinscheduler/api/service/impl/ProcessDefinitionServiceImpl.java

@@ -103,6 +103,8 @@ import org.springframework.web.multipart.MultipartFile;
 
 import com.baomidou.mybatisplus.core.metadata.IPage;
 import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
+import com.fasterxml.jackson.databind.node.ArrayNode;
+import com.fasterxml.jackson.databind.node.ObjectNode;
 import com.google.common.collect.Lists;
 
 /**
@@ -349,6 +351,36 @@ public class ProcessDefinitionServiceImpl extends BaseServiceImpl implements Pro
         return result;
     }
 
+    /**
+     * query process definition simple list
+     *
+     * @param loginUser   login user
+     * @param projectCode project code
+     * @return definition simple list
+     */
+    @Override
+    public Map<String, Object> queryProcessDefinitionSimpleList(User loginUser, long projectCode) {
+        Project project = projectMapper.queryByCode(projectCode);
+        //check user access for project
+        Map<String, Object> result = projectService.checkProjectAndAuth(loginUser, project, projectCode);
+        if (result.get(Constants.STATUS) != Status.SUCCESS) {
+            return result;
+        }
+        List<ProcessDefinition> processDefinitions = processDefinitionMapper.queryAllDefinitionList(projectCode);
+        ArrayNode arrayNode = JSONUtils.createArrayNode();
+        for (ProcessDefinition processDefinition : processDefinitions) {
+            ObjectNode processDefinitionNode = JSONUtils.createObjectNode();
+            processDefinitionNode.put("id", processDefinition.getId());
+            processDefinitionNode.put("code", processDefinition.getCode());
+            processDefinitionNode.put("name", processDefinition.getName());
+            processDefinitionNode.put("projectCode", processDefinition.getCode());
+            arrayNode.add(processDefinitionNode);
+        }
+        result.put(Constants.DATA_LIST, arrayNode);
+        putMsg(result, Status.SUCCESS);
+        return result;
+    }
+
     /**
      * query process definition list paging
      *

dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/formModel.vue

@@ -659,10 +659,10 @@
           const processDefinitionId =
             this.backfillItem.params.processDefinitionId
           const process = this.processListS.find(
-            (process) => process.processDefinition.id === processDefinitionId
+            (def) => def.id === processDefinitionId
           )
           this.$emit('onSubProcess', {
-            subProcessCode: process.processDefinition.code,
+            subProcessCode: process.code,
             fromThis: this
           })
         }
@@ -949,7 +949,7 @@
        * Child workflow entry show/hide
        */
       _isGoSubProcess () {
-        return this.nodeData.taskType === 'SUB_PROCESS' && this.name
+        return this.nodeData.taskType === 'SUB_PROCESS' && this.name && this.processListS && this.processListS.length > 0
       },
       taskInstance () {
         if (this.taskInstances.length > 0) {

dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/sub_process.vue

@@ -42,6 +42,7 @@
   import i18n from '@/module/i18n'
   import disabledState from '@/module/mixin/disabledState'
   import mListBox from './_source/listBox'
+  import { mapActions, mapState } from 'vuex'
 
   export default {
     name: 'sub_process',
@@ -57,7 +58,11 @@
     props: {
       backfillItem: Object
     },
+    computed: {
+      ...mapState('dag', ['processListS'])
+    },
     methods: {
+      ...mapActions('dag', ['getProcessList']),
       /**
        * Node unified authentication parameters
        */
@@ -82,6 +87,15 @@
        */
       _handleName (id) {
         return _.filter(this.processDefinitionList, v => id === v.id)[0].name
+      },
+      /**
+       * Get all processDefinition list
+       */
+      getAllProcessDefinitions () {
+        if (!this.processListS || this.processListS.length === 0) {
+          return this.getProcessList()
+        }
+        return Promise.resolve(this.processListS)
       }
     },
     watch: {
@@ -92,32 +106,32 @@
       }
     },
     created () {
-      let processListS = _.cloneDeep(this.store.state.dag.processListS)
       let code = null
       if (this.router.history.current.name === 'projects-instance-details') {
         code = this.router.history.current.query.code || null
       } else {
         code = this.router.history.current.params.code || null
       }
-      this.processDefinitionList = processListS.map(v => {
-        return {
-          id: v.processDefinition.id,
-          code: v.processDefinition.code,
-          name: v.processDefinition.name,
-          disabled: false
+      this.getAllProcessDefinitions().then((processListS) => {
+        this.processDefinitionList = processListS.map(def => {
+          return {
+            id: def.id,
+            code: def.code,
+            name: def.name,
+            disabled: false
+          }
+        }).filter(a => (a.code + '') !== code)
+        let o = this.backfillItem
+        // Non-null objects represent backfill
+        if (!_.isEmpty(o)) {
+          this.wdiCurr = o.params.processDefinitionId
+        } else {
+          if (this.processDefinitionList.length) {
+            this.wdiCurr = this.processDefinitionList[0].id
+            this.$emit('on-set-process-name', this._handleName(this.wdiCurr))
+          }
         }
-      }).filter(a => (a.code + '') !== code)
-
-      let o = this.backfillItem
-      // Non-null objects represent backfill
-      if (!_.isEmpty(o)) {
-        this.wdiCurr = o.params.processDefinitionId
-      } else {
-        if (this.processDefinitionList.length) {
-          this.wdiCurr = this.processDefinitionList[0].id
-          this.$emit('on-set-process-name', this._handleName(this.wdiCurr))
-        }
-      }
+      })
     },
     mounted () {
     },

dolphinscheduler-ui/src/js/conf/home/pages/dag/definitionDetails.vue

@@ -46,7 +46,7 @@
     props: {},
     methods: {
       ...mapMutations('dag', ['resetParams', 'setIsDetails']),
-      ...mapActions('dag', ['getProcessList', 'getProjectList', 'getResourcesList', 'getProcessDetails', 'getResourcesListJar']),
+      ...mapActions('dag', ['getProjectList', 'getResourcesList', 'getProcessDetails', 'getResourcesListJar']),
       ...mapActions('security', ['getTenantList', 'getWorkerGroupsAll', 'getAlarmGroupsAll']),
       /**
        * init
@@ -59,8 +59,6 @@
         Promise.all([
           // Node details
           this.getProcessDetails(this.$route.params.code),
-          // get process definition
-          this.getProcessList(),
           // get project
           this.getProjectList(),
           // get resource

dolphinscheduler-ui/src/js/conf/home/pages/dag/index.vue

@@ -40,7 +40,7 @@
     props: {},
     methods: {
       ...mapMutations('dag', ['resetParams']),
-      ...mapActions('dag', ['getProcessList', 'getProjectList', 'getResourcesList', 'getResourcesListJar', 'getResourcesListJar']),
+      ...mapActions('dag', ['getProjectList', 'getResourcesList', 'getResourcesListJar', 'getResourcesListJar']),
       ...mapActions('security', ['getTenantList', 'getWorkerGroupsAll', 'getAlarmGroupsAll']),
       /**
        * init
@@ -51,8 +51,6 @@
         this.resetParams()
         // Promise Get node needs data
         Promise.all([
-          // get process definition
-          this.getProcessList(),
           // get project
           this.getProjectList(),
           // get jar

dolphinscheduler-ui/src/js/conf/home/pages/dag/instanceDetails.vue

@@ -43,7 +43,7 @@
     props: {},
     methods: {
       ...mapMutations('dag', ['setIsDetails', 'resetParams']),
-      ...mapActions('dag', ['getProcessList', 'getProjectList', 'getResourcesList', 'getInstancedetail', 'getResourcesListJar']),
+      ...mapActions('dag', ['getProjectList', 'getResourcesList', 'getInstancedetail', 'getResourcesListJar']),
       ...mapActions('security', ['getTenantList', 'getWorkerGroupsAll', 'getAlarmGroupsAll']),
       /**
        * init
@@ -56,8 +56,6 @@
         Promise.all([
           // Process instance details
           this.getInstancedetail(this.$route.params.id),
-          // get process definition
-          this.getProcessList(),
           // get project
           this.getProjectList(),
           // get resources

dolphinscheduler-ui/src/js/conf/home/store/dag/actions.js

@@ -345,7 +345,7 @@ export default {
         resolve()
         return
       }
-      io.get(`projects/${state.projectCode}/process-definition/list`, payload, res => {
+      io.get(`projects/${state.projectCode}/process-definition/simple-list`, payload, res => {
         state.processListS = res.data
         resolve(res.data)
       }).catch(res => {