Merge pull request #7503 from GuoLiBin6/feat/glb-master/src

feat: 组件扩展,列表支持展示标签列自定义资源来源和参数

src/components/PageList/components/Header.vue

@@ -178,6 +178,8 @@ export default {
     config: Object,
     // 开启标签列
     showTagColumns: Boolean,
+    tagColumnManager: Function,
+    tagColumnParamsFormatter: Function,
     showTagColumns2: Boolean,
     showTagColumns3: Boolean,
     tagColumn2Resource: String,
@@ -255,6 +257,7 @@ export default {
     ignoreWithUserMetaParam: Boolean,
     ignoreWithUserMetaParam2: Boolean,
     ignoreWithUserMetaParam3: Boolean,
+    tagColumnsGenerator: Function,
     tagColumns2Generator: Function,
     tagBtnText: String,
     hiddenExportKeys: Array,
@@ -346,6 +349,7 @@ export default {
         showTagColumns3: this.showTagColumns3,
         hiddenExportKeys: this.hiddenExportKeys,
         callback: this.exportDataOptions.callback,
+        tagColumnsGenerator: this.tagColumnsGenerator,
         tagColumns2Generator: this.tagColumns2Generator,
       })
     },
@@ -368,6 +372,8 @@ export default {
         showTagColumns3: this.showTagColumns3,
         customs: grid.getTableColumn().collectColumn,
         resource: this.resource,
+        tagColumnManager: this.tagColumnManager,
+        tagColumnParamsFormatter: this.tagColumnParamsFormatter,
         tagColumn2Resource: this.tagColumn2Resource,
         tagColumn2ParamsFormatter: this.tagColumn2ParamsFormatter,
         hidenColumns,

src/components/PageList/components/Table.vue

@@ -177,6 +177,7 @@ export default {
       type: Boolean,
       default: false,
     },
+    tagColumnsGenerator: Function,
     tagColumns2Generator: Function,
   },
   data () {
@@ -504,39 +505,44 @@ export default {
         }, defaultColumns)
       }
       if (this.config && this.config.showTagKeys && this.config.showTagKeys.length) {
-        const tagColumns = this.config.showTagKeys.map(item => {
-          const config = {
-            minWidth: 100,
-          }
-          if (this.storageConfig && this.storageConfig[item] && this.storageConfig[item].width) {
-            config.minWidth = this.storageConfig[item].width
-            config.width = this.storageConfig[item].width
-          }
-          return {
-            ...config,
-            field: item,
-            title: getTagTitle(item),
-            showOverflow: 'title',
-            sortable: true,
-            slots: {
-              tag_type: ({ row }) => 'resource',
-              default: ({ row }) => {
-                const message = row.metadata && row.metadata[item]
-                return [
-                  this.$createElement('list-body-cell-wrap', {
-                    props: {
-                      copy: true,
-                      field: item,
-                      row,
-                      message,
-                      hideField: true,
-                    },
-                  }, message),
-                ]
+        let tagColumns = []
+        if (this.tagColumnsGenerator) {
+          tagColumns = this.tagColumnsGenerator(this.config.showTagKeys)
+        } else {
+          tagColumns = this.config.showTagKeys.map(item => {
+            const config = {
+              minWidth: 100,
+            }
+            if (this.storageConfig && this.storageConfig[item] && this.storageConfig[item].width) {
+              config.minWidth = this.storageConfig[item].width
+              config.width = this.storageConfig[item].width
+            }
+            return {
+              ...config,
+              field: item,
+              title: getTagTitle(item),
+              showOverflow: 'title',
+              sortable: true,
+              slots: {
+                tag_type: ({ row }) => 'resource',
+                default: ({ row }) => {
+                  const message = row.metadata && row.metadata[item]
+                  return [
+                    this.$createElement('list-body-cell-wrap', {
+                      props: {
+                        copy: true,
+                        field: item,
+                        row,
+                        message,
+                        hideField: true,
+                      },
+                    }, message),
+                  ]
+                },
               },
-            },
-          }
-        })
+            }
+          })
+        }
         const insertIndex = this.checkboxEnabled ? 2 : 1
         defaultColumns = R.insertAll(insertIndex, tagColumns, defaultColumns)
       }

src/components/PageList/index.vue

@@ -28,6 +28,8 @@
       :refresh-method="refreshMethod"
       :config="config"
       :show-tag-columns="showTagColumns"
+      :tag-column-manager="tagColumnManager"
+      :tag-column-params-formatter="tagColumnParamsFormatter"
       :show-tag-columns2="showTagColumns2"
       :show-tag-columns3="showTagColumns3"
       :tag-column2-resource="tagColumn2Resource"
@@ -56,6 +58,7 @@
       :tagFilterResource="tagFilterResource"
       :tagFilterResource2="tagFilterResource2"
       :tagFilterResource3="tagFilterResource3"
+      :tagColumnsGenerator="tagColumnsGenerator"
       :tagColumns2Generator="tagColumns2Generator"
       :ignoreWithUserMetaParam="ignoreWithUserMetaParam"
       :ignoreWithUserMetaParam2="ignoreWithUserMetaParam2"
@@ -118,6 +121,7 @@
         :edit-config="editConfig"
         :tableOverviewIndexs="tableOverviewIndexs"
         :enableVirtualScroll="enableVirtualScroll"
+        :tagColumnsGenerator="tagColumnsGenerator"
         :tagColumns2Generator="tagColumns2Generator"
         @change-current-page="changeCurrentPage"
         @change-page-size="changePageSize"
@@ -189,10 +193,13 @@ export default {
     showTagFilter3: Boolean,
     // 开启标签列
     showTagColumns: Boolean,
+    tagColumnManager: Function,
+    tagColumnParamsFormatter: Function,
     showTagColumns2: Boolean,
     showTagColumns3: Boolean,
     tagColumn2Resource: String,
     tagColumn2ParamsFormatter: Function,
+    tagColumnsGenerator: Function,
     tagColumns2Generator: Function,
     // 是否显示搜索框
     showSearchbox: {

src/sections/DialogManager/components/CustomList.vue

@@ -165,7 +165,7 @@ export default {
   computed: {
     ...mapGetters(['scope']),
     tagParams () {
-      const ret = {
+      let ret = {
         with_user_meta: true,
         // with_cloud_meta: true,
         limit: 0,
@@ -176,6 +176,9 @@ export default {
       } else {
         ret.resources = this.params.resource.resource.substr(0, this.params.resource.resource.length - 1)
       }
+      if (this.params.tagColumnParamsFormatter) {
+        ret = this.params.tagColumnParamsFormatter(ret)
+      }
       return ret
     },
     instanceTagParams () {
@@ -228,10 +231,10 @@ export default {
     async fetchTags () {
       let manager = new this.$Manager('metadatas')
       try {
-        const response = await manager.get({
+        const response = await (this.params.tagColumnManager ? this.params.tagColumnManager({ params: this.tagParams }) : manager.get({
           id: 'tag-value-pairs',
           params: this.tagParams,
-        })
+        }))
         const data = response.data.data || []
         // 将已显示的标签列进行合并
         let tags = data.map(item => item.key)

src/sections/DialogManager/components/ExportListData.vue

@@ -78,7 +78,7 @@ export default {
       allExportKeys = R.insertAll(0, exportTags.map(item => {
         return `tag:${item}`
       }), allExportKeys)
-      exportOptionItems = R.insertAll(0, exportTags.map(item => {
+      exportOptionItems = R.insertAll(0, this.params.tagColumnsGenerator ? this.params.tagColumnsGenerator(exportTags) : exportTags.map(item => {
         return {
           label: getTagTitle(item),
           key: `tag:${item}`,