From 9f1a613b75ef6d3416b2435759d953f10309efde Mon Sep 17 00:00:00 2001 From: chenjianxing Date: Mon, 5 Dec 2022 13:46:58 +0800 Subject: [PATCH] =?UTF-8?q?refactor(=E6=B5=8B=E8=AF=95=E8=B7=9F=E8=B8=AA):?= =?UTF-8?q?=20=E7=BC=BA=E9=99=B7=E5=88=97=E8=A1=A8=E9=A1=B5=E9=9D=A2?= =?UTF-8?q?=E6=B8=B2=E6=9F=93=E6=80=A7=E8=83=BD=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --bug=1016482 --user=陈建星 [测试跟踪]github#17569缺陷对接了JIRA或者禅道等第三方平台，缺陷管理列表加载数据响应慢 https://www.tapd.cn/55049933/s/1312385 --bug=1018002 --user=陈建星 【测试跟踪】github#18351，测试跟踪-缺陷管理，加载过慢（共78条缺陷，进入缺陷管理需要7s才能加载页面） https://www.tapd.cn/55049933/s/1312383 --- .../frontend/src/components/table/MsTable.vue | 1 + .../frontend/src/utils/tableUtils.js | 32 +- .../frontend/src/business/issue/IssueList.vue | 317 +++++++++--------- .../src/business/utils/track-table-header.js | 2 +- 4 files changed, 196 insertions(+), 156 deletions(-) diff --git a/framework/sdk-parent/frontend/src/components/table/MsTable.vue b/framework/sdk-parent/frontend/src/components/table/MsTable.vue index a71f492d69..72fb82efa3 100644 --- a/framework/sdk-parent/frontend/src/components/table/MsTable.vue +++ b/framework/sdk-parent/frontend/src/components/table/MsTable.vue @@ -546,6 +546,7 @@ export default { this.tableActive = true; }); this.listenRowDrop(); + this.$emit('headChange'); }, toggleRowSelection() { this.$refs.table.toggleRowSelection(); diff --git a/framework/sdk-parent/frontend/src/utils/tableUtils.js b/framework/sdk-parent/frontend/src/utils/tableUtils.js index 6809a43e08..61b54c7abe 100644 --- a/framework/sdk-parent/frontend/src/utils/tableUtils.js +++ b/framework/sdk-parent/frontend/src/utils/tableUtils.js @@ -6,7 +6,8 @@ import Sortable from 'sortablejs' import {datetimeFormat} from "fit2cloud-ui/src/filters/time"; import {hasLicense} from "../utils/permission"; import {getUUID, humpToLine} from "./index"; -import {CUSTOM_FIELD_TYPE_OPTION} from "./table-constants"; +import {CUSTOM_FIELD_TYPE_OPTION, SYSTEM_FIELD_NAME_MAP} from "./table-constants"; +import {generateColumnKey} from "../components/search/custom-component"; export function _handleSelectAll(component, selection, tableData, selectRows, condition) { if (selection.length > 0) { @@ -307,8 +308,22 @@ export function getTableHeaderWithCustomFields(key, customFields, projectMembers let field = { id: item.name, key: item.key, - label: item.name, - isCustom: true + label: item.system ? i18n.t(SYSTEM_FIELD_NAME_MAP[item.name]) : item.name, + type: item.type, + isCustom: true, + sortable: ['richText', 'textarea'].indexOf(item.type) > -1 ? false : true, + columnKey: generateColumnKey(item), + filters: getCustomFieldFilter(item) + } + // 设置宽度 + if (!field.minWidth) { + field.minWidth = 25 + field.label.length * 16; + if (field.sortable) { + field.minWidth += 20; + } + if (field.filters && field.filters.length > 0) { + field.minWidth += 20; + } } fieldSetting.push(field); if ((item.type === 'member' || item.type === 'multipleMember') && projectMembers && projectMembers.length > 0) { @@ -684,7 +699,14 @@ export function getCustomFieldFilter(field, userFilter) { .filter(x => x.hasOption) .map(x => x.value); - return optionTypes.indexOf(field.type) > -1 && Array.isArray(field.options) ? - (field.options.length > 0 ? field.options : null) : null; + if (optionTypes.indexOf(field.type) > -1 && Array.isArray(field.options) && field.options.length > 0) { + field.options.forEach(item => { + if (item.system && i18n.t(item.text)) { + item.text = i18n.t(item.text); + } + }); + return field.options; + } + return null; } diff --git a/test-track/frontend/src/business/issue/IssueList.vue b/test-track/frontend/src/business/issue/IssueList.vue index ebb8554edc..36bf3f587d 100644 --- a/test-track/frontend/src/business/issue/IssueList.vue +++ b/test-track/frontend/src/business/issue/IssueList.vue @@ -3,7 +3,8 @@ - - - - - + + + - - + @@ -251,7 +207,8 @@ export default { custom: false, }), fields: [], - tableHeaderKey:"ISSUE_LIST", + customFields: [], // 通过表头过滤后的自定义字段列表 + tableHeaderKey: "ISSUE_LIST", fieldsWidth: getCustomTableWidth('ISSUE_LIST'), screenHeight: 'calc(100vh - 160px)', operators: [ @@ -285,19 +242,47 @@ export default { loading: false, dataSelectRange: "", platformOptions: [], - hasLicense: false + hasLicense: false, + columns: { + num: { + sortable: true, + minWidth: 100 + }, + title: { + sortable: true, + minWidth: 120, + }, + platform: { + minWidth: 80, + filters: this.platformFilters + }, + platformStatus: { + minWidth: 110, + }, + creatorName: { + columnKey: 'creator', + minWidth: 100, + filters: this.creatorFilters + }, + resourceName: {}, + createTime: { + sortable: true, + minWidth: 180 + }, + caseCount: {} + } }; }, watch: { '$route'(to, from) { window.removeEventListener("resize", this.tableDoLayout); - }, + } }, activated() { if (this.$route.params.dataSelectRange) { this.dataSelectRange = this.$route.params.dataSelectRange; } - this.page.result.loading = true; + this.loading = true; this.$nextTick(() => { // 解决错位问题 window.addEventListener('resize', this.tableDoLayout); @@ -309,7 +294,6 @@ export default { }); getIssuePartTemplateWithProject((template) => { this.initFields(template); - this.page.result.loading = false; }); }); this.getIssues(); @@ -340,7 +324,7 @@ export default { projectId() { return getCurrentProjectID(); }, - workspaceId(){ + workspaceId() { return getCurrentWorkspaceId(); } }, @@ -362,39 +346,43 @@ export default { getCustomFieldFilter(field) { return getCustomFieldFilter(field, this.userFilter); }, - i18nCustomStatus(options) { - let i18ns = []; - if (options) { - options.forEach(option => { - option.text = this.$t(option.text); - i18ns.push(option); - }); - } - return i18ns; - }, initFields(template) { - this.issueTemplate = template; - if (this.issueTemplate.platform === LOCAL) { + if (template.platform === LOCAL) { this.isThirdPart = false; } else { this.isThirdPart = true; } - this.fields = getTableHeaderWithCustomFields('ISSUE_LIST', this.issueTemplate.customFields, this.members); + let fields = getTableHeaderWithCustomFields('ISSUE_LIST', template.customFields, this.members); if (!this.isThirdPart) { - for (let i = 0; i < this.fields.length; i++) { - if (this.fields[i].id === 'platformStatus') { - this.fields.splice(i, 1); + for (let i = 0; i < fields.length; i++) { + if (fields[i].id === 'platformStatus') { + fields.splice(i, 1); break; } } // 如果不是三方平台则移除备选字段中的平台状态 let removeField = {id: 'platformStatus', name: 'platformStatus', remove: true}; - this.issueTemplate.customFields.push(removeField); + template.customFields.push(removeField); } + this.issueTemplate = template; + fields.forEach(item => { + if (this.columns[item.id]) { + Object.assign(item, this.columns[item.id]); + if (this.columns[item.id].filters) { + item.filters = this.columns[item.id].filters; + } + } + }); + + this.fields = fields; + // 过滤自定义字段 this.page.condition.components = this.page.condition.components.filter(item => item.custom !== true); - let comp = getAdvSearchCustomField(this.page.condition, this.issueTemplate.customFields); + let comp = getAdvSearchCustomField(this.page.condition, template.customFields); this.page.condition.components.push(...comp); + + this.initCustomFieldValue(); + if (this.$refs.table) this.$refs.table.reloadTable(); }, search() { @@ -402,7 +390,11 @@ export default { this.page.currentPage = 1; this.getIssues(); }, + handleHeadChange() { + this.initFields(this.issueTemplate); + }, getIssues() { + this.loading = true; if (this.dataSelectRange === 'thisWeekUnClosedIssue') { this.page.condition.thisWeekUnClosedTestPlanIssue = true; } else if (this.dataSelectRange === 'unClosedRelatedTestPlan') { @@ -411,13 +403,38 @@ export default { this.page.condition.allTestPlanIssue = true; } this.page.condition.projectId = this.projectId; - this.page.condition.workspaceId= this.workspaceId; + this.page.condition.workspaceId = this.workspaceId; this.page.condition.orders = getLastTableSortField(this.tableHeaderKey); - this.page.result = getIssues(this.page.currentPage, this.page.pageSize, this.page.condition).then((response) => { - this.page.total = response.data.itemCount; - this.page.data = response.data.listObject; - parseCustomFilesForList(this.page.data); + getIssues(this.page.currentPage, this.page.pageSize, this.page.condition) + .then((response) => { + this.page.total = response.data.itemCount; + this.page.data = response.data.listObject; + parseCustomFilesForList(this.page.data); + this.initCustomFieldValue(); + }); + }, + initCustomFieldValue() { + if (this.fields.length <= 0) { + return; + } + this.page.data.forEach(item => { + let displayValueMap = new Map(); + let fieldIdSet = new Set(this.fields.map(i => i.id)); + this.issueTemplate.customFields.forEach(field => { + let displayValue; + if (!fieldIdSet.has(field.name)) { + return; + } + if (field.name === '状态') { + displayValue = this.getCustomFieldValue(item, field, this.issueStatusMap[item.status]); + } else { + displayValue = this.getCustomFieldValue(item, field); + } + displayValueMap.set(field.name, displayValue); + }); + item.displayValueMap = displayValueMap; }); + this.loading = false; }, getMaintainerOptions() { getProjectMemberUserFilter((data) => { @@ -470,7 +487,7 @@ export default { this.$warning(this.$t("test_track.issue.check_select")); return; } - batchDeleteIssue({"batchDeleteIds" : selectIds, "batchDeleteAll" : this.page.condition.selectAll}) + batchDeleteIssue({"batchDeleteIds": selectIds, "batchDeleteAll": this.page.condition.selectAll}) .then(() => { this.$success(this.$t('commons.delete_success')); this.getIssues(); @@ -539,7 +556,7 @@ export default { } }); }, - editParam(){ + editParam() { let id = this.$route.query.id; if (id) { getIssuesById(id).then((response) => { diff --git a/test-track/frontend/src/business/utils/track-table-header.js b/test-track/frontend/src/business/utils/track-table-header.js index 82e126bd7d..a051b15652 100644 --- a/test-track/frontend/src/business/utils/track-table-header.js +++ b/test-track/frontend/src/business/utils/track-table-header.js @@ -128,7 +128,7 @@ const TRACK_HEADER = { ISSUE_LIST: [ {id: 'num', key: '1', label: 'test_track.issue.id'}, {id: 'title', key: '2', label: 'test_track.issue.title'}, - {id: 'platformStatus', key: '3', label: 'test_track.issue.status'}, + {id: 'platformStatus', key: '3', label: 'test_track.issue.platform_status'}, {id: 'platform', key: '4', label: 'test_track.issue.platform'}, {id: 'creatorName', key: '5', label: 'custom_field.issue_creator'}, {id: 'resourceName', key: '6', label: 'test_track.issue.issue_resource'},