Merge pull request #10817 from terlinhe/feat_atomOutput

feat：Code 方式创建的流水线，变量面板-输出变量未获取到问题优化 #10755

src/frontend/devops-pipeline/src/components/PipelineEditTabs/components/atom-output-var.vue

@@ -115,7 +115,8 @@
         },
         computed: {
             ...mapState('atom', [
-                'editingElementPos'
+                'editingElementPos',
+                'atomsOutputMap'
             ]),
             ...mapGetters('atom', [
                 'getStage',
@@ -155,7 +156,12 @@
                     if (stage) {
                         (stage.containers || []).forEach((container, containerIndex) => {
                             (container.elements || []).forEach((element, elementIndex) => {
-                                if (element?.data?.output && typeof (element?.data?.output) && Object.keys(element?.data?.output).length) {
+                                // 从api获取的output信息
+                                const apiOutput = this.atomsOutputMap[`${element.atomCode}@${element.version}`] || {}
+                                // 从model解析的output信息
+                                const modelOutput = element?.data?.output || {}
+                                if (Object.keys(modelOutput).length || Object.keys(apiOutput).length) {
+                                    const realOutput = Object.keys(apiOutput).length > 0 ? apiOutput : modelOutput
                                     list.push({
                                         id: element.id,
                                         location: {
@@ -169,9 +175,9 @@
                                         stepId: element.stepId,
                                         stepName: element.name,
                                         envPrefix: `jobs.${container.jobId}.steps.${element.stepId}.outputs.`,
-                                        params: Object.keys(element.data.output).map(item => ({
+                                        params: Object.keys(realOutput).map(item => ({
                                             name: item,
-                                            desc: ''
+                                            desc: realOutput[item]?.description
                                         }))
                                     })
                                 }
@@ -196,9 +202,13 @@
                 }))
             }
         },
+        created () {
+            this.fetchAtomsOutput()
+        },
         methods: {
             ...mapActions('atom', [
-                'updateAtom'
+                'updateAtom',
+                'fetchAtomsOutput'
             ]),
             async handleUpdateStepId () {
                 const valid = await this.$validator.validate('step.*')

src/frontend/devops-pipeline/src/components/PipelineEditTabs/components/children/param-value-option.vue

@@ -1,5 +1,64 @@
 <template>
     <section class="bk-form-item">
+        <form-field
+            :hide-colon="true"
+            v-if="isCodelibParam(param.type)"
+            :label="$t('editPage.codelibParams')"
+            :is-error="errors.has(`pipelineParam.scmType`)"
+            :error-msg="errors.first(`pipelineParam.scmType`)"
+        >
+            <selector
+                :disabled="disabled"
+                :list="codeTypeList"
+                :handle-change="(name, value) => handleCodeTypeChange(name, value)"
+                name="scmType"
+                placeholder=""
+                :value="param.scmType"
+                :clearable="false"
+            ></selector>
+        </form-field>
+        <form-field
+            :hide-colon="true"
+            v-if="isGitParam(param.type)"
+            :label="$t('editPage.gitRepo')"
+            :required="true"
+            :is-error="errors.has(`pipelineParam.repoHashId`)"
+            :error-msg="errors.first(`pipelineParam.repoHashId`)"
+        >
+            <request-selector
+                v-bind="getRepoOption('CODE_GIT,CODE_GITLAB,GITHUB,CODE_TGIT')"
+                :disabled="disabled"
+                name="repoHashId"
+                :value="param.repoHashId"
+                :handle-change="handleChange"
+                v-validate="'required'"
+                :data-vv-scope="'pipelineParam'"
+                replace-key="{keyword}"
+                :search-url="getSearchUrl()"
+            >
+            </request-selector>
+        </form-field>
+        <form-field
+            :hide-colon="true"
+            v-if="isSvnParam(param.type)"
+            :label="$t('editPage.svnParams')"
+            :required="true"
+            :is-error="errors.has(`pipelineParam.repoHashId`)"
+            :error-msg="errors.first(`pipelineParam.repoHashId`)"
+        >
+            <request-selector
+                v-bind="getRepoOption('CODE_SVN')"
+                :disabled="disabled"
+                name="repoHashId"
+                :value="param.repoHashId"
+                :handle-change="handleChange"
+                v-validate="'required'"
+                :data-vv-scope="'pipelineParam'"
+                :replace-key="param.replaceKey"
+                :search-url="param.searchUrl"
+            >
+            </request-selector>
+        </form-field>
         <select-type-param
             v-if="isSelectorParam(param.type)"
             :param="param"
@@ -129,32 +188,11 @@
             </request-selector>
         </form-field>
 
-        <form-field
-            :hide-colon="true"
-            v-if="isSvnParam(param.type)"
-            :label="$t('editPage.svnParams')"
-            :is-error="errors.has(`repoHashId`)"
-            :error-msg="errors.first(`pipelineParam.repoHashId`)"
-        >
-            <request-selector
-                v-bind="getRepoOption('CODE_SVN')"
-                :disabled="disabled"
-                name="repoHashId"
-                :value="param.repoHashId"
-                :handle-change="handleChange"
-                v-validate="'required'"
-                :data-vv-scope="'pipelineParam'"
-                :replace-key="param.replaceKey"
-                :search-url="param.searchUrl"
-            >
-            </request-selector>
-        </form-field>
-
         <form-field
             :hide-colon="true"
             v-if="isSvnParam(param.type)"
             :label="$t('editPage.relativePath')"
-            :is-error="errors.has(`relativePath`)"
+            :is-error="errors.has(`pipelineParam.relativePath`)"
             :error-msg="errors.first(`pipelineParam.relativePath`)"
         >
             <vuex-input
@@ -166,49 +204,11 @@
             ></vuex-input>
         </form-field>
 
-        <form-field
-            :hide-colon="true"
-            v-if="isGitParam(param.type)"
-            :label="$t('editPage.gitRepo')"
-            :is-error="errors.has(`repoHashId`)"
-            :error-msg="errors.first(`pipelineParam.repoHashId`)"
-        >
-            <request-selector
-                v-bind="getRepoOption('CODE_GIT,CODE_GITLAB,GITHUB,CODE_TGIT')"
-                :disabled="disabled"
-                name="repoHashId"
-                :value="param.repoHashId"
-                :handle-change="handleChange"
-                v-validate="'required'"
-                :data-vv-scope="'pipelineParam'"
-                replace-key="{keyword}"
-                :search-url="getSearchUrl()"
-            >
-            </request-selector>
-        </form-field>
-
-        <form-field
-            :hide-colon="true"
-            v-if="isCodelibParam(param.type)"
-            :label="$t('editPage.codelibParams')"
-            :is-error="errors.has(`scmType`)"
-            :error-msg="errors.first(`pipelineParam.scmType`)"
-        >
-            <selector
-                :disabled="disabled"
-                :list="codeTypeList"
-                :handle-change="(name, value) => handleCodeTypeChange(name, value)"
-                name="scmType"
-                placeholder=""
-                :value="param.scmType"
-            ></selector>
-        </form-field>
-
         <template v-if="isBuildResourceParam(param.type)">
             <form-field
                 :hide-colon="true"
                 :label="$t('editPage.buildEnv')"
-                :is-error="errors.has(`os`)"
+                :is-error="errors.has(`pipelineParam.os`)"
                 :error-msg="errors.first(`pipelineParam.os`)"
             >
                 <selector
@@ -225,7 +225,7 @@
             <form-field
                 :hide-colon="true"
                 :label="$t('editPage.addMetaData')"
-                :is-error="errors.has(`buildType`)"
+                :is-error="errors.has(`pipelineParam.buildType`)"
                 :error-msg="errors.first(`pipelineParam.buildType`)"
             >
                 <selector
@@ -240,41 +240,79 @@
                 ></selector>
             </form-field>
         </template>
+
+        <template v-if="isArtifactoryParam(param.type)">
+            <form-field
+                :hide-colon="true"
+                :label="$t('editPage.filterRule')"
+                :is-error="errors.has(`pipelineParam.glob`)"
+                :error-msg="errors.first(`pipelineParam.glob`)"
+            >
+                <vuex-input
+                    :disabled="disabled"
+                    :handle-change="handleChange"
+                    name="glob"
+                    :data-vv-scope="'pipelineParam'"
+                    :placeholder="$t('editPage.filterRuleTips')"
+                    :value="param.glob"
+                ></vuex-input>
+            </form-field>
+
+            <form-field
+                :hide-colon="true"
+                :label="$t('metaData')"
+                :is-error="errors.has(`pipelineParam.properties`)"
+                :error-msg="errors.first(`pipelineParam.properties`)"
+            >
+                <key-value-normal
+                    :disabled="disabled"
+                    name="properties"
+                    :data-vv-scope="'pipelineParam'"
+                    :is-metadata-var="true"
+                    :add-btn-text="$t('editPage.addMetaData')"
+                    :value="getProperties(param)"
+                    :handle-change="
+                        (name, value) => handleProperties(name, value)
+                    "
+                ></key-value-normal>
+            </form-field>
+        </template>
     </section>
 </template>
 
 <script>
-    import { mapGetters } from 'vuex'
-    import SelectTypeParam from './select-type-param'
     import FormField from '@/components/AtomPropertyPanel/FormField'
-    import VuexInput from '@/components/atomFormField/VuexInput'
-    import VuexTextarea from '@/components/atomFormField/VuexTextarea'
-    import RequestSelector from '@/components/atomFormField/RequestSelector'
+    import FileParamInput from '@/components/FileParamInput'
     import EnumInput from '@/components/atomFormField/EnumInput'
+    import KeyValueNormal from '@/components/atomFormField/KeyValueNormal'
+    import RequestSelector from '@/components/atomFormField/RequestSelector'
     import Selector from '@/components/atomFormField/Selector'
-    import FileParamInput from '@/components/FileParamInput'
+    import VuexInput from '@/components/atomFormField/VuexInput'
+    import VuexTextarea from '@/components/atomFormField/VuexTextarea'
     import validMixins from '@/components/validMixins'
+    import { PROCESS_API_URL_PREFIX, REPOSITORY_API_URL_PREFIX, STORE_API_URL_PREFIX } from '@/store/constants'
     import {
-        isTextareaParam,
-        isStringParam,
+        CODE_LIB_OPTION,
+        CODE_LIB_TYPE,
+        getParamsDefaultValueLabel,
+        getParamsDefaultValueLabelTips,
+        getRepoOption,
+        isArtifactoryParam,
         isBooleanParam,
         isBuildResourceParam,
-        isEnumParam,
-        isMultipleParam,
         isCodelibParam,
-        isSvnParam,
+        isEnumParam,
+        isFileParam,
         isGitParam,
-        isArtifactoryParam,
+        isMultipleParam,
+        isStringParam,
         isSubPipelineParam,
-        isFileParam,
-        getRepoOption,
-        getParamsDefaultValueLabel,
-        getParamsDefaultValueLabelTips,
-        CODE_LIB_OPTION,
-        CODE_LIB_TYPE,
+        isSvnParam,
+        isTextareaParam,
         SUB_PIPELINE_OPTION
     } from '@/store/modules/atom/paramsConfig'
-    import { STORE_API_URL_PREFIX, REPOSITORY_API_URL_PREFIX, PROCESS_API_URL_PREFIX } from '@/store/constants'
+    import { mapGetters } from 'vuex'
+    import SelectTypeParam from './select-type-param'
 
     const BOOLEAN = [
         {
@@ -296,7 +334,8 @@
             Selector,
             VuexTextarea,
             RequestSelector,
-            FileParamInput
+            FileParamInput,
+            KeyValueNormal
         },
         mixins: [validMixins],
         props: {
@@ -480,6 +519,25 @@
                     value = value.join(',')
                 }
                 this.handleChange(key, value)
+            },
+            getProperties (param) {
+                try {
+                    return Object.keys(param.properties).map((item) => {
+                        return {
+                            key: item,
+                            value: param.properties[item]
+                        }
+                    })
+                } catch (e) {
+                    return []
+                }
+            },
+            handleProperties (key, value) {
+                const properties = {}
+                value.forEach((val) => {
+                    properties[val.key] = val.value
+                })
+                this.handleChange(key, properties)
             }
         }
     }

src/frontend/devops-pipeline/src/store/modules/atom/actions.js

@@ -52,6 +52,7 @@ import {
     SET_ATOM_MODAL_FETCHING,
     SET_ATOM_PAGE_OVER,
     SET_ATOM_VERSION_LIST,
+    SET_ATOMS_OUTPUT_MAP,
     SET_COMMEND_ATOM_COUNT,
     SET_COMMEND_ATOM_PAGE_OVER,
     SET_COMMON_PARAMS,
@@ -399,6 +400,24 @@ export default {
         })
     },
 
+    fetchAtomsOutput: async ({ commit, state, getters }) => {
+        const elements = getters.getAllElements(state.pipeline?.stages)
+        const arr = elements.map(ele => `${ele.atomCode}@${ele.version}`)
+        const data = Array.from(new Set(arr))
+        try {
+            request.post(`${STORE_API_URL_PREFIX}/user/pipeline/atom/output/info/list`, data).then(res => {
+                const map = {}
+                for (const item in res.data) {
+                    map[item] = JSON.parse(res.data[item])
+                }
+                console.log(map, 88552)
+                commit(SET_ATOMS_OUTPUT_MAP, map)
+            })
+        } catch (error) {
+            commit(SET_ATOMS_OUTPUT_MAP, {})
+        }
+    },
+
     fetchAtoms: async ({ commit, state, getters }, { projectCode, category, jobType, classifyId, os, searchKey, queryProjectAtomFlag, fitOsFlag = undefined }) => {
         try {
             const isCommendAtomPageOver = state.isCommendAtomPageOver

src/frontend/devops-pipeline/src/store/modules/atom/constants.js

@@ -36,6 +36,7 @@ export const RESET_ATOM_MODAL_MAP = 'RESET_ATOM_MODAL_MAP'
 export const SET_ATOM_MODAL_FETCHING = 'SET_FETCHING_ATOM_MODAL'
 export const SET_CONTAINER_FETCHING = 'SET_CONTAINER_FETCHING'
 export const SET_CONTAINER = 'SET_CONTAINER'
+export const SET_ATOMS_OUTPUT_MAP = 'SET_ATOMS_OUTPUT_MAP'
 
 export const UPDATE_ATOM_TYPE = 'UPDATE_ATOM_TYPE'
 export const INSERT_ATOM = 'INSERT_ATOM'

src/frontend/devops-pipeline/src/store/modules/atom/index.js

@@ -38,6 +38,7 @@ export default {
         isCommendAtomPageOver: false,
         isAtomPageOver: false,
         atomList: [],
+        atomsOutputMap: {},
         requestAtomData: {
             recommendFlag: true,
             keyword: '',