fix: 修复左侧模块树拉宽后点击模块名称又恢复默认宽度

This commit is contained in:
RubyLiu 2023-11-14 18:25:57 +08:00 committed by 刘瑞斌
parent 84467c1063
commit 4a2694e77e
17 changed files with 961 additions and 694 deletions

View File

@ -1,7 +1,8 @@
<template> <template>
<ms-container v-if="renderComponent" v-loading="loading"> <ms-container v-if="renderComponent" v-loading="loading">
<ms-aside-container v-show="isAsideHidden"> <ms-aside-container v-show="isAsideHidden" pageKey="API_AUTOMATION">
<ms-api-scenario-module <template #default>
<ms-api-scenario-module
:show-operator="true" :show-operator="true"
@nodeSelectEvent="nodeChange" @nodeSelectEvent="nodeChange"
@refreshTable="refresh" @refreshTable="refresh"
@ -17,6 +18,7 @@
:type="'edit'" :type="'edit'"
:total="total" :total="total"
ref="nodeTree" /> ref="nodeTree" />
</template>
</ms-aside-container> </ms-aside-container>
<ms-main-container> <ms-main-container>
<el-tabs v-model="activeName" @tab-click="addTab" @tab-remove="closeConfirm"> <el-tabs v-model="activeName" @tab-click="addTab" @tab-remove="closeConfirm">

View File

@ -1,6 +1,6 @@
<template> <template>
<ms-container> <ms-container>
<ms-aside-container> <ms-aside-container pageKey="API_SCENARIO">
<ms-api-scenario-module <ms-api-scenario-module
@selectModule="selectModule" @selectModule="selectModule"
@getApiModuleTree="initTree" @getApiModuleTree="initTree"

View File

@ -1,9 +1,9 @@
<template> <template>
<test-case-relevance-base <test-case-relevance-base
:is-across-space="isAcrossSpace" :is-across-space="isAcrossSpace"
@setProject="setProject" @setProject="setProject"
:dialog-title="$t('api_test.definition.api_import')" :dialog-title="$t('api_test.definition.api_import')"
ref="baseRelevance"> ref="baseRelevance">
<template v-slot:aside> <template v-slot:aside>
<ms-api-module <ms-api-module
class="node-tree" class="node-tree"
@ -18,60 +18,60 @@
</template> </template>
<scenario-relevance-api-list <scenario-relevance-api-list
v-if="isApiListEnable" v-if="isApiListEnable"
:project-id="projectId" :project-id="projectId"
:version-filters="versionFilters" :version-filters="versionFilters"
:current-version="currentVersion" :current-version="currentVersion"
:current-protocol="currentProtocol" :current-protocol="currentProtocol"
:select-node-ids="selectNodeIds" :select-node-ids="selectNodeIds"
:is-api-list-enable="isApiListEnable" :is-api-list-enable="isApiListEnable"
@isApiListEnableChange="isApiListEnableChange" @isApiListEnableChange="isApiListEnableChange"
@selectCountChange="setSelectCounts" @selectCountChange="setSelectCounts"
ref="apiList"> ref="apiList">
<template v-slot:version> <template v-slot:version>
<mx-version-select <mx-version-select
v-xpack v-xpack
:project-id="projectId" :project-id="projectId"
:default-version="currentVersion" :default-version="currentVersion"
@changeVersion="currentVersionChange"/> @changeVersion="currentVersionChange" />
</template> </template>
</scenario-relevance-api-list> </scenario-relevance-api-list>
<scenario-relevance-case-list <scenario-relevance-case-list
v-if="!isApiListEnable" v-if="!isApiListEnable"
:project-id="projectId" :project-id="projectId"
:version-filters="versionFilters" :version-filters="versionFilters"
:current-version="currentVersion" :current-version="currentVersion"
:current-protocol="currentProtocol" :current-protocol="currentProtocol"
:select-node-ids="selectNodeIds" :select-node-ids="selectNodeIds"
:is-api-list-enable="isApiListEnable" :is-api-list-enable="isApiListEnable"
@isApiListEnableChange="isApiListEnableChange" @isApiListEnableChange="isApiListEnableChange"
@selectCountChange="setSelectCounts" @selectCountChange="setSelectCounts"
ref="apiCaseList"> ref="apiCaseList">
<template v-slot:version> <template v-slot:version>
<mx-version-select <mx-version-select
v-xpack v-xpack
:project-id="projectId" :project-id="projectId"
:default-version="currentVersion" :default-version="currentVersion"
@changeVersion="currentVersionChange"/> @changeVersion="currentVersionChange" />
</template> </template>
</scenario-relevance-case-list> </scenario-relevance-case-list>
<template v-slot:headerBtn> <template v-slot:headerBtn>
<!-- 显示数量 --> <!-- 显示数量 -->
<table-select-count-bar :count="selectCounts" style="float: left; margin: 5px"/> <table-select-count-bar :count="selectCounts" style="float: left; margin: 5px" />
<el-button size="mini" icon="el-icon-refresh" @click="refreshData"/> <el-button size="mini" icon="el-icon-refresh" @click="refreshData" />
<el-button type="primary" @click="copy" :loading="buttonIsWorking" @keydown.enter.native.prevent size="mini"> <el-button type="primary" @click="copy" :loading="buttonIsWorking" @keydown.enter.native.prevent size="mini">
{{ $t('commons.copy') }} {{ $t('commons.copy') }}
</el-button> </el-button>
<el-button <el-button
v-if="!isApiListEnable" v-if="!isApiListEnable"
type="primary" type="primary"
:loading="buttonIsWorking" :loading="buttonIsWorking"
@click="reference" @click="reference"
size="mini" size="mini"
@keydown.enter.native.prevent> @keydown.enter.native.prevent>
{{ $t('api_test.scenario.reference') }} {{ $t('api_test.scenario.reference') }}
</el-button> </el-button>
</template> </template>
@ -79,9 +79,9 @@
</template> </template>
<script> <script>
import {getApiCaseWithBLOBs} from '@/api/api-test-case'; import { getApiCaseWithBLOBs } from '@/api/api-test-case';
import {apiListBatch} from '@/api/definition'; import { apiListBatch } from '@/api/definition';
import {getProjectVersions} from '@/api/xpack'; import { getProjectVersions } from '@/api/xpack';
import ScenarioRelevanceCaseList from './RelevanceCaseList'; import ScenarioRelevanceCaseList from './RelevanceCaseList';
import MsApiModule from '../../../definition/components/module/ApiModule'; import MsApiModule from '../../../definition/components/module/ApiModule';
import MsContainer from 'metersphere-frontend/src/components/MsContainer'; import MsContainer from 'metersphere-frontend/src/components/MsContainer';
@ -90,9 +90,9 @@ import MsMainContainer from 'metersphere-frontend/src/components/MsMainContainer
import ScenarioRelevanceApiList from './RelevanceApiList'; import ScenarioRelevanceApiList from './RelevanceApiList';
import RelevanceDialog from '@/business/commons/RelevanceDialog'; import RelevanceDialog from '@/business/commons/RelevanceDialog';
import TestCaseRelevanceBase from '@/business/commons/TestCaseRelevanceBase'; import TestCaseRelevanceBase from '@/business/commons/TestCaseRelevanceBase';
import {hasLicense} from 'metersphere-frontend/src/utils/permission'; import { hasLicense } from 'metersphere-frontend/src/utils/permission';
import TableSelectCountBar from '@/business/automation/scenario/api/TableSelectCountBar'; import TableSelectCountBar from '@/business/automation/scenario/api/TableSelectCountBar';
import {operationConfirm} from 'metersphere-frontend/src/utils'; import { operationConfirm } from 'metersphere-frontend/src/utils';
export default { export default {
name: 'ApiRelevance', name: 'ApiRelevance',
@ -166,15 +166,15 @@ export default {
} else { } else {
if (params.condition.selectAll) { if (params.condition.selectAll) {
operationConfirm( operationConfirm(
this, this,
this.$t('automation.scenario_step_ref_message') + '', this.$t('automation.scenario_step_ref_message') + '',
() => { () => {
this.$emit('save', apis, 'API', reference); this.$emit('save', apis, 'API', reference);
this.$refs.baseRelevance.close(); this.$refs.baseRelevance.close();
}, },
() => { () => {
this.buttonIsWorking = false; this.buttonIsWorking = false;
} }
); );
} else { } else {
this.$emit('save', apis, 'API', reference); this.$emit('save', apis, 'API', reference);
@ -192,15 +192,15 @@ export default {
} else { } else {
if (this.$refs.apiCaseList.condition.selectAll) { if (this.$refs.apiCaseList.condition.selectAll) {
operationConfirm( operationConfirm(
this, this,
this.$t('automation.scenario_step_ref_message') + '', this.$t('automation.scenario_step_ref_message') + '',
() => { () => {
this.$emit('save', apiCases, 'CASE', reference); this.$emit('save', apiCases, 'CASE', reference);
this.$refs.baseRelevance.close(); this.$refs.baseRelevance.close();
}, },
() => { () => {
this.buttonIsWorking = false; this.buttonIsWorking = false;
} }
); );
} else { } else {
this.$emit('save', apiCases, 'CASE', reference); this.$emit('save', apiCases, 'CASE', reference);
@ -258,13 +258,13 @@ export default {
getProjectVersions(this.projectId).then((response) => { getProjectVersions(this.projectId).then((response) => {
if (currentVersion) { if (currentVersion) {
this.versionFilters = response.data this.versionFilters = response.data
.filter((u) => u.id === currentVersion) .filter((u) => u.id === currentVersion)
.map((u) => { .map((u) => {
return {text: u.name, value: u.id}; return { text: u.name, value: u.id };
}); });
} else { } else {
this.versionFilters = response.data.map((u) => { this.versionFilters = response.data.map((u) => {
return {text: u.name, value: u.id}; return { text: u.name, value: u.id };
}); });
} }
}); });

View File

@ -1,27 +1,29 @@
<template> <template>
<div> <div>
<ms-container v-if="renderComponent"> <ms-container v-if="renderComponent">
<ms-aside-container v-show="isAsideHidden"> <ms-aside-container v-show="isAsideHidden" pageKey="API_DEFINITION">
<ms-api-module <template #default>
:show-operator="true" <ms-api-module
:default-protocol="defaultProtocol" :show-operator="true"
:select-default-protocol="isSelectDefaultProtocol" :default-protocol="defaultProtocol"
@nodeSelectEvent="nodeChange" :select-default-protocol="isSelectDefaultProtocol"
@protocolChange="handleProtocolChange" @nodeSelectEvent="nodeChange"
@refreshTable="refresh" @protocolChange="handleProtocolChange"
@exportAPI="exportAPI" @refreshTable="refresh"
@debug="debug" @exportAPI="exportAPI"
@saveAsEdit="editApi" @debug="debug"
@setModuleOptions="setModuleOptions" @saveAsEdit="editApi"
@setNodeTree="setNodeTree" @setModuleOptions="setModuleOptions"
@enableTrash="enableTrash" @setNodeTree="setNodeTree"
@schedule="handleTabsEdit($t('api_test.api_import.timing_synchronization'), 'SCHEDULE')" @enableTrash="enableTrash"
:type="'edit'" @schedule="handleTabsEdit($t('api_test.api_import.timing_synchronization'), 'SCHEDULE')"
page-source="definition" :type="'edit'"
:is-trash-data="trashEnable" page-source="definition"
:total="total" :is-trash-data="trashEnable"
:current-version="currentVersion" :total="total"
ref="nodeTree" /> :current-version="currentVersion"
ref="nodeTree" />
</template>
</ms-aside-container> </ms-aside-container>
<ms-main-container> <ms-main-container>
@ -261,9 +263,9 @@
</div> </div>
</template> </template>
<script> <script>
import {createDefinitionEnv, getDefinitionById, getDefinitionEnv} from '@/api/definition'; import { createDefinitionEnv, getDefinitionById, getDefinitionEnv } from '@/api/definition';
import {getProjectConfig} from '@/api/project'; import { getProjectConfig } from '@/api/project';
import {getApiModuleByProjectIdAndProtocol, trashCount} from '@/api/definition-module'; import { getApiModuleByProjectIdAndProtocol, trashCount } from '@/api/definition-module';
import MsApiList from './components/list/ApiList'; import MsApiList from './components/list/ApiList';
import MsContainer from 'metersphere-frontend/src/components/MsContainer'; import MsContainer from 'metersphere-frontend/src/components/MsContainer';
import MsMainContainer from 'metersphere-frontend/src/components/MsMainContainer'; import MsMainContainer from 'metersphere-frontend/src/components/MsMainContainer';
@ -277,9 +279,9 @@ import MsRunTestHttpPage from './components/runtest/RunTestHTTPPage';
import MsRunTestTcpPage from './components/runtest/RunTestTCPPage'; import MsRunTestTcpPage from './components/runtest/RunTestTCPPage';
import MsRunTestSqlPage from './components/runtest/RunTestSQLPage'; import MsRunTestSqlPage from './components/runtest/RunTestSQLPage';
import MsRunTestDubboPage from './components/runtest/RunTestDubboPage'; import MsRunTestDubboPage from './components/runtest/RunTestDubboPage';
import {getCurrentProjectID, getCurrentUser, getCurrentUserId} from 'metersphere-frontend/src/utils/token'; import { getCurrentProjectID, getCurrentUser, getCurrentUserId } from 'metersphere-frontend/src/utils/token';
import {hasPermission} from 'metersphere-frontend/src/utils/permission'; import { hasPermission } from 'metersphere-frontend/src/utils/permission';
import {getUUID} from 'metersphere-frontend/src/utils'; import { getUUID } from 'metersphere-frontend/src/utils';
import MsApiModule from './components/module/ApiModule'; import MsApiModule from './components/module/ApiModule';
import ApiCaseSimpleList from './components/list/ApiCaseSimpleList'; import ApiCaseSimpleList from './components/list/ApiCaseSimpleList';
import ApiDocumentsPage from '@/business/definition/components/list/ApiDocumentsPage'; import ApiDocumentsPage from '@/business/definition/components/list/ApiDocumentsPage';
@ -288,12 +290,12 @@ import MsTabButton from '@/business/commons/MsTabs';
import ApiSchedule from '@/business/definition/components/import/ApiSchedule'; import ApiSchedule from '@/business/definition/components/import/ApiSchedule';
import MsEditCompleteContainer from './components/EditCompleteContainer'; import MsEditCompleteContainer from './components/EditCompleteContainer';
import MsEnvironmentSelect from './components/case/MsEnvironmentSelect'; import MsEnvironmentSelect from './components/case/MsEnvironmentSelect';
import {PROJECT_ID, WORKSPACE_ID} from 'metersphere-frontend/src/utils/constants'; import { PROJECT_ID, WORKSPACE_ID } from 'metersphere-frontend/src/utils/constants';
import {useApiStore} from '@/store'; import { useApiStore } from '@/store';
import {buildTree} from 'metersphere-frontend/src/model/NodeTree'; import { buildTree } from 'metersphere-frontend/src/model/NodeTree';
import {createMockConfig, getMockApiParams, mockExpectConfig} from '@/api/api-mock'; import { createMockConfig, getMockApiParams, mockExpectConfig } from '@/api/api-mock';
import MockEditDrawer from '@/business/definition/components/mock/MockEditDrawer'; import MockEditDrawer from '@/business/definition/components/mock/MockEditDrawer';
import {getUserDefaultApiType} from "metersphere-frontend/src/api/environment"; import { getUserDefaultApiType } from 'metersphere-frontend/src/api/environment';
const store = useApiStore(); const store = useApiStore();
export default { export default {
@ -482,11 +484,11 @@ export default {
}, },
}, },
beforeCreate() { beforeCreate() {
getUserDefaultApiType().then(response => { getUserDefaultApiType().then((response) => {
if (!this.currentProtocol) { if (!this.currentProtocol) {
this.currentProtocol = response.data; this.currentProtocol = response.data;
} }
}) });
}, },
created() { created() {
let routeParamObj = this.$route.params; let routeParamObj = this.$route.params;
@ -690,10 +692,10 @@ export default {
this.handleTabsEdit(this.$t('api_test.definition.request.title'), e, api); this.handleTabsEdit(this.$t('api_test.definition.request.title'), e, api);
}, },
_getCurrentUserId() { _getCurrentUserId() {
const {id, userGroups} = getCurrentUser(); const { id, userGroups } = getCurrentUser();
if (userGroups) { if (userGroups) {
// //
let index = userGroups.findIndex(ug => ug.sourceId === getCurrentProjectID()); let index = userGroups.findIndex((ug) => ug.sourceId === getCurrentProjectID());
if (index !== -1) { if (index !== -1) {
return id; return id;
} }

View File

@ -109,7 +109,7 @@
<!--前置返回--> <!--前置返回-->
<el-tab-pane :label="$t('api_test.definition.request.pre_return')" v-if="scenarioDefinition != undefined"> <el-tab-pane :label="$t('api_test.definition.request.pre_return')" v-if="scenarioDefinition != undefined">
<ms-container :class="{ 'maximize-container': !asideHidden }" v-outside-click="outsideClick"> <ms-container :class="{ 'maximize-container': !asideHidden }" v-outside-click="outsideClick">
<ms-aside-container @setAsideHidden="setAsideHidden" style="padding-top: 0px"> <ms-aside-container @setAsideHidden="setAsideHidden" style="padding-top: 0px" pageKey="API_VARIABLE_ADVANCE">
<div v-loading="loading" v-show="!asideHidden"> <div v-loading="loading" v-show="!asideHidden">
<el-tree <el-tree
node-key="resourceId" node-key="resourceId"

View File

@ -1,76 +1,87 @@
<template> <template>
<el-aside :width="width" class="ms-aside-container" <el-aside
:id="id" :width="asideHidden ? '0' : defaultWidth"
:style="{ class="ms-aside-container"
'margin-left': !asideHidden ? 0 : '-' + width, :id="id"
'min-width': minWidth + 'px', :style="{ 'min-width': minWidth, 'max-width': maxWidth }"
'max-width': maxWidth + 'px', >
'height': calHeight, <div
}"> v-if="enableAsideHidden"
<div v-if="enableAsideHidden" class="hiddenBottom" :style="{'top': hiddenBottomTop ? hiddenBottomTop : 0}" @click="asideHidden = !asideHidden"> class="hiddenBottom"
<i v-if="!asideHidden" class="el-icon-arrow-left"/> :style="{ top: hiddenBottomTop ? hiddenBottomTop : 0 }"
<i v-if="asideHidden" class="el-icon-arrow-right"/> @click="asideHidden = !asideHidden"
>
<i v-if="!asideHidden" class="el-icon-arrow-left" />
<i v-if="asideHidden" class="el-icon-arrow-right" />
</div> </div>
<div style="overflow: scroll" class="ms-aside-node-tree" :style="{'height': containerCalHeight }"> <div
style="overflow: scroll"
class="ms-aside-node-tree"
:style="{ height: containerCalHeight }"
>
<slot></slot> <slot></slot>
</div> </div>
<ms-horizontal-drag-bar v-if="draggable"/> <ms-horizontal-drag-bar v-if="draggable" />
</el-aside> </el-aside>
</template> </template>
<script> <script>
import MsHorizontalDragBar from "./dragbar/MsLeft2RightDragBar"; import MsHorizontalDragBar from "./dragbar/MsLeft2RightDragBar";
import {getUUID} from "../utils"; import { getUUID } from "../utils";
import {boolean} from "../../public/js/dev/mock";
export default { export default {
name: "MsAsideContainer", name: "MsAsideContainer",
components: {MsHorizontalDragBar}, components: { MsHorizontalDragBar },
props: { props: {
width: {
type: String,
default: '300px'
},
enableAsideHidden: { enableAsideHidden: {
type: Boolean, type: Boolean,
default: true default: true,
},
width: {
type: String,
default: "300px",
}, },
minWidth: { minWidth: {
type: String, type: String,
default: null default: null,
}, },
maxWidth: { maxWidth: {
type: String, type: String,
default: null default: null,
}, },
height: { height: {
type: String, type: String,
default: null default: null,
}, },
enableAutoHeight: { enableAutoHeight: {
type: Boolean, type: Boolean,
default: false default: false,
}, },
defaultHiddenBottomTop: { defaultHiddenBottomTop: {
type: Number, type: Number,
default: null default: null,
},
pageKey: {
type: String,
default: null,
}, },
draggable: { draggable: {
type: Boolean, type: Boolean,
default: true, default: true,
} },
}, },
watch: { watch: {
asideHidden() { asideHidden() {
this.$emit('setAsideHidden', this.asideHidden); this.$emit("setAsideHidden", this.asideHidden);
} },
}, },
computed: { computed: {
calHeight() {
return this.height ? (this.height + 'px') : (this.enableAutoHeight ? null : 'calc(100vh - 50px)')
},
containerCalHeight() { containerCalHeight() {
return this.height ? (this.height - 30 + 'px') : (this.enableAutoHeight ? null : 'calc(100vh - 62px)') return this.height
? this.height - 30 + "px"
: this.enableAutoHeight
? null
: "calc(100vh - 62px)";
}, },
}, },
created() { created() {
@ -80,37 +91,76 @@ export default {
this.$nextTick(() => { this.$nextTick(() => {
this.setHiddenBottomTop(); this.setHiddenBottomTop();
}); });
if (this.pageKey) {
const rememberKey = "WIDTH_" + this.pageKey;
const rememberWidth = localStorage.getItem(rememberKey);
if (rememberWidth) {
//
this.defaultWidth = rememberWidth;
} else {
this.defaultWidth = this.width;
}
const element = document.getElementById(this.id);
const MutationObserver =
window.MutationObserver ||
window.WebKitMutationObserver ||
window.MozMutationObserver;
this.observer = new MutationObserver(() => {
// localStorage
const width = getComputedStyle(element).getPropertyValue("width");
if (!this.asideHidden) {
localStorage.setItem(rememberKey, width);
//
this.defaultWidth = width;
}
});
this.observer.observe(element, {
attributes: true,
attributeFilter: ["style"],
attributeOldValue: true,
});
}
},
beforeDestroyed() {
if (this.observer) {
this.observer.disconnect();
this.observer.takeRecords();
this.observer = null;
}
}, },
data() { data() {
return { return {
asideHidden: false, asideHidden: false,
hiddenBottomTop: null, hiddenBottomTop: null,
id: null id: null,
} defaultWidth: this.width,
observer: null,
};
}, },
methods: { methods: {
setHiddenBottomTop() { setHiddenBottomTop() {
if (this.defaultHiddenBottomTop) { if (this.defaultHiddenBottomTop) {
this.hiddenBottomTop = this.defaultHiddenBottomTop + 'px'; this.hiddenBottomTop = this.defaultHiddenBottomTop + "px";
} else { } else {
let e = document.getElementById(this.id); const e = document.getElementById(this.id);
if (!e) return; if (!e) return;
// 3/1 // 3/1
this.hiddenBottomTop = e.clientHeight / 3 + 'px'; this.hiddenBottomTop = e.clientHeight / 3 + "px";
} }
} },
} },
} };
</script> </script>
<style scoped> <style scoped>
.ms-aside-container { .ms-aside-container {
border: 1px solid #E6E6E6; border: 1px solid #e6e6e6;
padding: 10px; padding: 10px;
border-radius: 2px; border-radius: 2px;
box-sizing: border-box; box-sizing: border-box;
background-color: #FFF; background-color: #fff;
/*height: calc(100vh - 80px);*/ /*height: calc(100vh - 80px);*/
border-right: 0px; border-right: 0px;
position: relative; position: relative;
@ -148,5 +198,4 @@ export default {
margin-left: 0; margin-left: 0;
color: white; color: white;
} }
</style> </style>

View File

@ -1,6 +1,6 @@
<template> <template>
<ms-container> <ms-container>
<ms-aside-container> <ms-aside-container pageKey="FILE_MANAGE">
<ms-file-module @nodeSelectEvent="change" @myFile="myFile" @setNodeTree="setNodeTree" ref="module"/> <ms-file-module @nodeSelectEvent="change" @myFile="myFile" @setNodeTree="setNodeTree" ref="module"/>
</ms-aside-container> </ms-aside-container>
<ms-main-container> <ms-main-container>

View File

@ -1,6 +1,6 @@
<template> <template>
<ms-container :is-show-warning="isShowWarning && isSystemGroup"> <ms-container :is-show-warning="isShowWarning && isSystemGroup">
<ms-aside-container :enable-aside-hidden="enableAsideHidden" :width="enableAsideHidden ? '300px' : '0px'"> <ms-aside-container pageKey="SETTING" :enable-aside-hidden="enableAsideHidden" :width="enableAsideHidden ? '300px' : '0px'">
<ms-setting-menu/> <ms-setting-menu/>
</ms-aside-container> </ms-aside-container>
<ms-main-container> <ms-main-container>

View File

@ -48,14 +48,17 @@
<div class="content-box"> <div class="content-box">
<div class="body-wrap"> <div class="body-wrap">
<ms-aside-container <ms-aside-container
:min-width="'350'" min-width="350px"
:max-width="'800'" max-width="800px"
:enable-aside-hidden="false" :enable-aside-hidden="false"
:default-hidden-bottom-top="200" :default-hidden-bottom-top="200"
:enable-auto-height="true" :enable-auto-height="true"
pageKey="CASE_RELEVANCE"
> >
<div class="aside-wrap"> <div class="aside-wrap">
<span v-if="isAcrossSpace" class="menu-title">{{ $t("commons.space") }}:</span> <span v-if="isAcrossSpace" class="menu-title"
>{{ $t("commons.space") }}:</span
>
<el-select <el-select
v-if="isAcrossSpace" v-if="isAcrossSpace"
filterable filterable
@ -92,8 +95,13 @@
<div class="options"> <div class="options">
<div class="options-btn"> <div class="options-btn">
<div class="check-row" v-if="selectCounts > 0"> <div class="check-row" v-if="selectCounts > 0">
<div class="label">{{$t('case.selected')}} {{ selectCounts }} {{$t('case.strip')}}</div> <div class="label">
<div class="clear" @click="clearSelect">{{$t('case.clear')}}</div> {{ $t("case.selected") }} {{ selectCounts }}
{{ $t("case.strip") }}
</div>
<div class="clear" @click="clearSelect">
{{ $t("case.clear") }}
</div>
</div> </div>
<div class="cancel"> <div class="cancel">
<el-button size="small" @click="visible = false">{{ <el-button size="small" @click="visible = false">{{
@ -139,7 +147,7 @@ export default {
SelectMenu, SelectMenu,
MsDialogHeader, MsDialogHeader,
TableSelectCountBar, TableSelectCountBar,
MsAsideContainer MsAsideContainer,
}, },
data() { data() {
return { return {

View File

@ -4,6 +4,7 @@
width="500px" width="500px"
:default-hidden-bottom-top="200" :default-hidden-bottom-top="200"
:enable-auto-height="true" :enable-auto-height="true"
pageKey="API_CASE_FAILURE_RESULT"
> >
<el-card> <el-card>
<el-scrollbar> <el-scrollbar>

View File

@ -4,6 +4,7 @@
width="500px" width="500px"
:default-hidden-bottom-top="200" :default-hidden-bottom-top="200"
:enable-auto-height="true" :enable-auto-height="true"
pageKey="API_SCENARIO_FAILURE_RESULT"
> >
<el-card> <el-card>
<el-scrollbar> <el-scrollbar>

View File

@ -1,49 +1,61 @@
<template> <template>
<el-container> <el-container>
<ms-aside-container width="500px" :default-hidden-bottom-top="200" :enable-auto-height="true"> <ms-aside-container
<load-failure-result :class="{'init-height': !showResponse}" width="500px"
:is-db="isDb" :default-hidden-bottom-top="200"
:is-all="isAll" :enable-auto-height="true"
:share-id="shareId" pageKey="LOAD_ALL_RESULT"
:is-share="isShare" >
:is-template="isTemplate" <load-failure-result
:report="report" :class="{ 'init-height': !showResponse }"
:plan-id="planId" :is-db="isDb"
@rowClick="getReport" :is-all="isAll"
@setSize="setAllSize"/> :share-id="shareId"
:is-share="isShare"
:is-template="isTemplate"
:report="report"
:plan-id="planId"
@rowClick="getReport"
@setSize="setAllSize"
/>
</ms-aside-container> </ms-aside-container>
<ms-main-container> <ms-main-container>
<div v-if="showResponse"> <div v-if="showResponse">
<div v-if="!isTemplate && reportShow"> <div v-if="!isTemplate && reportShow">
<micro-app v-if="isShare" <micro-app
route-name="sharePerReportView" v-if="isShare"
service="performance" route-name="sharePerReportView"
:route-params="{ service="performance"
reportId, :route-params="{
isShare, reportId,
shareId, isShare,
isPlanReport: true, shareId,
}"/> isPlanReport: true,
<micro-app v-else }"
route-name="perReportView" />
service="performance" <micro-app
:route-params="{ v-else
reportId, route-name="perReportView"
}"/> service="performance"
:route-params="{
reportId,
}"
/>
</div> </div>
<load-case-report-view
<load-case-report-view v-else v-else
:is-plan-report="true" :is-plan-report="true"
:share-id="shareId" :share-id="shareId"
:is-share="isShare" :is-share="isShare"
:plan-report-template="response" :plan-report-template="response"
:report-id="reportId" :report-id="reportId"
ref="loadCaseReportView"/> ref="loadCaseReportView"
/>
</div>
<div class="empty" v-show="!showResponse">
{{ $t("test_track.plan.load_case.content_empty") }}
</div> </div>
<div class="empty" v-show="!showResponse">{{ $t('test_track.plan.load_case.content_empty') }}</div>
</ms-main-container> </ms-main-container>
</el-container> </el-container>
</template> </template>
@ -54,7 +66,10 @@ import LoadCaseReportView from "../load/LoadCaseReportView";
import TypeTableItem from "../../../../../../common/tableItems/planview/TypeTableItem"; import TypeTableItem from "../../../../../../common/tableItems/planview/TypeTableItem";
import MethodTableItem from "../../../../../../common/tableItems/planview/MethodTableItem"; import MethodTableItem from "../../../../../../common/tableItems/planview/MethodTableItem";
import StatusTableItem from "../../../../../../common/tableItems/planview/StatusTableItem"; import StatusTableItem from "../../../../../../common/tableItems/planview/StatusTableItem";
import {checkoutLoadReport, shareCheckoutLoadReport} from "@/api/remote/plan/test-plan"; import {
checkoutLoadReport,
shareCheckoutLoadReport,
} from "@/api/remote/plan/test-plan";
import LoadFailureResult from "@/business/plan/view/comonents/report/detail/component/LoadFailureResult"; import LoadFailureResult from "@/business/plan/view/comonents/report/detail/component/LoadFailureResult";
import MsAsideContainer from "metersphere-frontend/src/components/MsAsideContainer"; import MsAsideContainer from "metersphere-frontend/src/components/MsAsideContainer";
@ -66,9 +81,12 @@ export default {
components: { components: {
MsMainContainer, MsMainContainer,
MsAsideContainer, MsAsideContainer,
LoadFailureResult, StatusTableItem, MethodTableItem, TypeTableItem, LoadFailureResult,
StatusTableItem,
MethodTableItem,
TypeTableItem,
LoadCaseReportView, LoadCaseReportView,
MicroApp MicroApp,
}, },
props: { props: {
planId: String, planId: String,
@ -79,8 +97,8 @@ export default {
isDb: Boolean, isDb: Boolean,
isAll: { isAll: {
type: Boolean, type: Boolean,
default: false default: false,
} },
}, },
data() { data() {
return { return {
@ -88,8 +106,8 @@ export default {
showResponse: false, showResponse: false,
reportId: "", reportId: "",
response: null, response: null,
reportShow: true reportShow: true,
} };
}, },
methods: { methods: {
getReport(row) { getReport(row) {
@ -103,28 +121,25 @@ export default {
} else { } else {
let param = { let param = {
testPlanLoadCaseId: row.id, testPlanLoadCaseId: row.id,
reportId: row.loadReportId reportId: row.loadReportId,
} };
if (!row.loadReportId) { if (!row.loadReportId) {
this.showResponse = false; this.showResponse = false;
return; return;
} }
if (this.isShare) { if (this.isShare) {
shareCheckoutLoadReport(this.shareId, param) shareCheckoutLoadReport(this.shareId, param).then((r) => {
.then(r => { this.openReport(r.data, row.loadReportId);
this.openReport(r.data, row.loadReportId); });
});
} else { } else {
checkoutLoadReport(param) checkoutLoadReport(param).then((r) => {
.then(r => { this.openReport(r.data, row.loadReportId);
this.openReport(r.data, row.loadReportId); });
});
} }
} }
}, },
openReport(exist, loadReportId) { openReport(exist, loadReportId) {
if (exist) { if (exist) {
if (this.reportId === loadReportId) { if (this.reportId === loadReportId) {
return; return;
} }
@ -137,14 +152,16 @@ export default {
}); });
} else { } else {
this.showResponse = false; this.showResponse = false;
this.$message.warning(this.$t('test_track.plan.load_case.report_not_found')); this.$message.warning(
this.$t("test_track.plan.load_case.report_not_found")
);
} }
}, },
setAllSize(size) { setAllSize(size) {
this.$emit('setSize', size); this.$emit("setSize", size);
} },
} },
} };
</script> </script>
<style scoped> <style scoped>

View File

@ -4,6 +4,7 @@
width="500px" width="500px"
:default-hidden-bottom-top="200" :default-hidden-bottom-top="200"
:enable-auto-height="true" :enable-auto-height="true"
pageKey="UI_SCENARIO_FAILURE_RESULT"
> >
<el-card> <el-card>
<el-scrollbar> <el-scrollbar>
@ -45,7 +46,11 @@
prop="lastResult" prop="lastResult"
> >
<template v-slot:default="{ row }"> <template v-slot:default="{ row }">
<ms-test-plan-api-status :status="row.lastResult === 'UnExecute' ? 'PENDING' : row.lastResult" /> <ms-test-plan-api-status
:status="
row.lastResult === 'UnExecute' ? 'PENDING' : row.lastResult
"
/>
</template> </template>
</ms-table-column> </ms-table-column>
</ms-table> </ms-table>
@ -56,7 +61,7 @@
<div v-if="showResponse"> <div v-if="showResponse">
<micro-app <micro-app
v-show="!isTemplate" v-show="!isTemplate"
v-if="reportId!==null" v-if="reportId !== null"
service="ui" service="ui"
route-name="ApiReportView" route-name="ApiReportView"
:route-params="getRouteParams()" :route-params="getRouteParams()"
@ -134,7 +139,6 @@ export default {
Running: "Running", Running: "Running",
UnExecute: "Prepare", UnExecute: "Prepare",
}, },
}; };
}, },
mounted() { mounted() {

View File

@ -6,26 +6,36 @@
:data="testReviews" :data="testReviews"
:current-data="currentReview" :current-data="currentReview"
:title="$t('test_track.review_view.review')" :title="$t('test_track.review_view.review')"
@dataChange="changeReview"/> @dataChange="changeReview"
/>
</template> </template>
<template v-slot:menu> <template v-slot:menu>
<el-menu v-if="isMenuShow" :active-text-color="color" <el-menu
class="el-menu-demo header-menu" mode="horizontal" @select="handleSelect" v-if="isMenuShow"
:default-active="activeIndex"> :active-text-color="color"
<el-menu-item index="functional">{{ $t('test_track.functional_test_case') }}</el-menu-item> class="el-menu-demo header-menu"
mode="horizontal"
@select="handleSelect"
:default-active="activeIndex"
>
<el-menu-item index="functional">{{
$t("test_track.functional_test_case")
}}</el-menu-item>
</el-menu> </el-menu>
</template> </template>
</ms-test-plan-header-bar> </ms-test-plan-header-bar>
<test-review-function v-if="activeIndex === 'functional'" :redirectCharType="redirectCharType" <test-review-function
:clickType="clickType" :review-id="reviewId" :version-enable="versionEnable" v-if="activeIndex === 'functional'"
ref="testReviewFunction"/> :redirectCharType="redirectCharType"
:clickType="clickType"
:review-id="reviewId"
:version-enable="versionEnable"
ref="testReviewFunction"
/>
</div> </div>
</template> </template>
<script> <script>
import MsMainContainer from "metersphere-frontend/src/components/MsMainContainer"; import MsMainContainer from "metersphere-frontend/src/components/MsMainContainer";
import MsAsideContainer from "metersphere-frontend/src/components/MsAsideContainer"; import MsAsideContainer from "metersphere-frontend/src/components/MsAsideContainer";
import MsContainer from "metersphere-frontend/src/components/MsContainer"; import MsContainer from "metersphere-frontend/src/components/MsContainer";
@ -34,12 +44,12 @@ import SelectMenu from "../../common/SelectMenu";
import TestReviewRelevance from "./components/TestReviewRelevance"; import TestReviewRelevance from "./components/TestReviewRelevance";
import MsTestPlanHeaderBar from "./components/head/TestPlanHeaderBar"; import MsTestPlanHeaderBar from "./components/head/TestPlanHeaderBar";
import TestReviewFunction from "@/business/review/view/components/TestReviewFunction"; import TestReviewFunction from "@/business/review/view/components/TestReviewFunction";
import {getCurrentProjectID} from "metersphere-frontend/src/utils/token"; import { getCurrentProjectID } from "metersphere-frontend/src/utils/token";
import {hasLicense} from "metersphere-frontend/src/utils/permission"; import { hasLicense } from "metersphere-frontend/src/utils/permission";
import {PROJECT_ID} from "metersphere-frontend/src/utils/constants"; import { PROJECT_ID } from "metersphere-frontend/src/utils/constants";
import {getTestReviewTestCase, testReviewListAll} from "@/api/test-review"; import { getTestReviewTestCase, testReviewListAll } from "@/api/test-review";
import {testCaseNodeListReview} from "@/api/test-case-node"; import { testCaseNodeListReview } from "@/api/test-case-node";
import {versionEnableByProjectId} from "@/api/project"; import { versionEnableByProjectId } from "@/api/project";
export default { export default {
name: "TestCaseReviewView", name: "TestCaseReviewView",
@ -51,7 +61,7 @@ export default {
MsContainer, MsContainer,
NodeTree, NodeTree,
TestReviewRelevance, TestReviewRelevance,
SelectMenu SelectMenu,
}, },
data() { data() {
return { return {
@ -65,30 +75,30 @@ export default {
activeIndex: "functional", activeIndex: "functional",
isMenuShow: true, isMenuShow: true,
//- //-
redirectCharType: '', redirectCharType: "",
//- //-
clickType: '', clickType: "",
projectId: null, projectId: null,
versionEnable: false, versionEnable: false,
} };
}, },
computed: { computed: {
reviewId: function () { reviewId: function () {
return this.$route.params.reviewId; return this.$route.params.reviewId;
}, },
color: function () { color: function () {
return `var(--primary_color)` return `var(--primary_color)`;
} },
}, },
created() { created() {
let projectId = this.$route.query.projectId; let projectId = this.$route.query.projectId;
if (projectId) { if (projectId) {
sessionStorage.setItem(PROJECT_ID, projectId); sessionStorage.setItem(PROJECT_ID, projectId);
} }
this.$EventBus.$on('projectChange', this.handleProjectChange); this.$EventBus.$on("projectChange", this.handleProjectChange);
}, },
destroyed() { destroyed() {
this.$EventBus.$off('projectChange', this.handleProjectChange); this.$EventBus.$off("projectChange", this.handleProjectChange);
}, },
mounted() { mounted() {
this.initData(); this.initData();
@ -103,12 +113,12 @@ export default {
} }
}, },
watch: { watch: {
'$route'(to, from) { $route(to, from) {
this.openTestCaseEdit(to.path); this.openTestCaseEdit(to.path);
}, },
reviewId() { reviewId() {
this.initData(); this.initData();
} },
}, },
activated() { activated() {
this.genRedirectParam(); this.genRedirectParam();
@ -117,7 +127,7 @@ export default {
handleProjectChange() { handleProjectChange() {
if (this.$route.path.indexOf("track/review") > -1) { if (this.$route.path.indexOf("track/review") > -1) {
this.$nextTick(() => { this.$nextTick(() => {
this.$router.push('/track/review/all'); this.$router.push("/track/review/all");
}); });
} }
}, },
@ -128,9 +138,12 @@ export default {
this.redirectCharType = this.$route.params.charType; this.redirectCharType = this.$route.params.charType;
this.clickType = this.$route.params.clickType; this.clickType = this.$route.params.clickType;
if (this.redirectCharType != "") { if (this.redirectCharType != "") {
if (this.redirectCharType == 'scenario') { if (this.redirectCharType == "scenario") {
this.activeIndex = 'api'; this.activeIndex = "api";
} else if (this.redirectCharType != null && this.redirectCharType != '') { } else if (
this.redirectCharType != null &&
this.redirectCharType != ""
) {
this.activeIndex = this.redirectCharType; this.activeIndex = this.redirectCharType;
} }
} else { } else {
@ -146,15 +159,14 @@ export default {
this.$refs.testReviewRelevance.openTestReviewRelevanceDialog(); this.$refs.testReviewRelevance.openTestReviewRelevanceDialog();
}, },
getTestReviews() { getTestReviews() {
testReviewListAll() testReviewListAll().then((response) => {
.then((response) => { this.testReviews = response.data;
this.testReviews = response.data; this.testReviews.forEach((review) => {
this.testReviews.forEach(review => { if (this.reviewId && review.id === this.reviewId) {
if (this.reviewId && review.id === this.reviewId) { this.currentReview = review;
this.currentReview = review; }
} });
}); });
})
}, },
nodeChange(node, nodeIds, pNodes) { nodeChange(node, nodeIds, pNodes) {
this.selectNodeIds = nodeIds; this.selectNodeIds = nodeIds;
@ -162,27 +174,25 @@ export default {
}, },
changeReview(review) { changeReview(review) {
this.currentReview = review; this.currentReview = review;
this.$router.push('/track/review/view/' + review.id); this.$router.push("/track/review/view/" + review.id);
}, },
getNodeTreeByReviewId() { getNodeTreeByReviewId() {
if (this.reviewId) { if (this.reviewId) {
testCaseNodeListReview(this.reviewId) testCaseNodeListReview(this.reviewId).then((response) => {
.then((response) => { this.treeNodes = response.data;
this.treeNodes = response.data; });
})
} }
}, },
openTestCaseEdit(path) { openTestCaseEdit(path) {
if (path.indexOf("/review/view/edit") >= 0) { if (path.indexOf("/review/view/edit") >= 0) {
let caseId = this.$route.params.caseId; let caseId = this.$route.params.caseId;
getTestReviewTestCase(caseId) getTestReviewTestCase(caseId).then((response) => {
.then((response) => { let testCase = response.data;
let testCase = response.data; if (testCase) {
if (testCase) { this.$refs.testPlanTestCaseList.handleEdit(testCase);
this.$refs.testPlanTestCaseList.handleEdit(testCase); this.$router.push("/track/review/view/" + testCase.reviewId);
this.$router.push('/track/review/view/' + testCase.reviewId); }
} });
})
} }
}, },
reloadMenu() { reloadMenu() {
@ -196,23 +206,21 @@ export default {
return; return;
} }
if (hasLicense()) { if (hasLicense()) {
versionEnableByProjectId(this.projectId) versionEnableByProjectId(this.projectId).then((response) => {
.then((response) => { this.versionEnable = response.data;
this.versionEnable = response.data; });
})
} }
}, },
} },
} };
</script> </script>
<style scoped> <style scoped>
:deep(.ms-main-container) { :deep(.ms-main-container) {
height: calc(100vh - 93px); height: calc(100vh - 93px);
} }
:deep(.ms-aside-container ){ :deep(.ms-aside-container) {
height: calc(100vh - 93px) !important; height: calc(100vh - 93px) !important;
margin-top: 1px; margin-top: 1px;
} }

View File

@ -1,150 +1,188 @@
<template> <template>
<div> <div>
<el-dialog :title="$t('test_track.review_view.relevance_case')" :visible.sync="dialogFormVisible" @close="close" <el-dialog
width="75%" :title="$t('test_track.review_view.relevance_case')"
:close-on-click-modal="false" :visible.sync="dialogFormVisible"
:fullscreen="isFullScreen" @close="close"
top="50px" :destroy-on-close="true" width="75%"
append-to-body> :close-on-click-modal="false"
:fullscreen="isFullScreen"
<template slot="title" :slot-scope="$t('test_track.review_view.relevance_case')" v-if="!$slots.headerBtn"> top="50px"
<ms-dialog-header :title="$t('test_track.review_view.relevance_case')" @cancel="dialogFormVisible = false" :destroy-on-close="true"
@confirm="saveReviewRelevance" append-to-body
@fullScreen="fullScreen" >
:enable-full-screen="false" <template
:is-full-screen.sync="isFullScreen"> slot="title"
:slot-scope="$t('test_track.review_view.relevance_case')"
v-if="!$slots.headerBtn"
>
<ms-dialog-header
:title="$t('test_track.review_view.relevance_case')"
@cancel="dialogFormVisible = false"
@confirm="saveReviewRelevance"
@fullScreen="fullScreen"
:enable-full-screen="false"
:is-full-screen.sync="isFullScreen"
>
<template #other> <template #other>
<table-select-count-bar :count="selectCounts" style="float: left; margin: 5px;"/> <table-select-count-bar
:count="selectCounts"
style="float: left; margin: 5px"
/>
</template> </template>
</ms-dialog-header> </ms-dialog-header>
</template> </template>
<el-container class="main-content"> <el-container class="main-content">
<ms-aside-container <ms-aside-container
:min-width="'350'" min-width="350px"
:max-width="'600'" max-width="600px"
:enable-aside-hidden="false" :enable-aside-hidden="false"
:default-hidden-bottom-top="200" :default-hidden-bottom-top="200"
:enable-auto-height="true" :enable-auto-height="true"
pageKey="TEST_REVIEW_RELEVANCE_CASE"
> >
>
<select-menu <select-menu
:data="projects" :data="projects"
width="173px" width="173px"
:current-data="currentProject" :current-data="currentProject"
:title="$t('test_track.switch_project')" :title="$t('test_track.switch_project')"
@dataChange="changeProject"/> @dataChange="changeProject"
<node-tree class="node-tree" />
:all-label="$t('commons.all_label.review')" <node-tree
v-loading="result.loading" class="node-tree"
local-suffix="test_case" :all-label="$t('commons.all_label.review')"
default-label="未规划用例" v-loading="result.loading"
@nodeSelectEvent="nodeChange" local-suffix="test_case"
:tree-nodes="treeNodes" default-label="未规划用例"
ref="nodeTree"/> @nodeSelectEvent="nodeChange"
:tree-nodes="treeNodes"
ref="nodeTree"
/>
</ms-aside-container> </ms-aside-container>
<el-container> <el-container>
<el-main class="case-content"> <el-main class="case-content">
<ms-table-header :tip="$t('review.search_by_id_or_name_or_tag')" :condition.sync="condition" @search="search" <ms-table-header
title="" :show-create="false"> :tip="$t('review.search_by_id_or_name_or_tag')"
:condition.sync="condition"
@search="search"
title=""
:show-create="false"
>
<template v-slot:searchBarBefore> <template v-slot:searchBarBefore>
<version-select v-xpack :project-id="projectId" @changeVersion="changeVersion" margin-right="20"/> <version-select
v-xpack
:project-id="projectId"
@changeVersion="changeVersion"
margin-right="20"
/>
</template> </template>
</ms-table-header> </ms-table-header>
<ms-table :data="testReviews" <ms-table
@filter-change="filter" row-key="id" :data="testReviews"
v-loading="result.loading" @filter-change="filter"
:total="total" row-key="id"
:page-size.sync="pageSize" v-loading="result.loading"
:screen-height="screenHeight" :total="total"
@handlePageChange="getReviews" :page-size.sync="pageSize"
@refresh="getReviews" :screen-height="screenHeight"
@selectCountChange="setSelectCounts" @handlePageChange="getReviews"
:condition="condition" @refresh="getReviews"
ref="table"> @selectCountChange="setSelectCounts"
:condition="condition"
ref="table"
>
<el-table-column <el-table-column
v-if="!customNum" v-if="!customNum"
prop="num" prop="num"
min-width="120" min-width="120"
sortable sortable
:label="$t('commons.id')"> :label="$t('commons.id')"
>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
v-if="customNum" v-if="customNum"
prop="customNum" prop="customNum"
min-width="120" min-width="120"
sortable sortable
:label="$t('commons.id')"> :label="$t('commons.id')"
>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="name" prop="name"
:label="$t('test_track.case.name')" :label="$t('test_track.case.name')"
min-width="120" min-width="120"
show-overflow-tooltip> show-overflow-tooltip
>
<template v-slot:default="scope"> <template v-slot:default="scope">
{{ scope.row.name }} {{ scope.row.name }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
v-if="versionEnable" v-if="versionEnable"
prop="versionName" prop="versionName"
:label="$t('test_track.case.version')" :label="$t('test_track.case.version')"
column-key="versionId" column-key="versionId"
:filters="versionFilters" :filters="versionFilters"
style="width: 100%"> style="width: 100%"
>
<template v-slot:default="scope"> <template v-slot:default="scope">
{{ scope.row.versionName }} {{ scope.row.versionName }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="priority" prop="priority"
:filters="priorityFilters" :filters="priorityFilters"
column-key="priority" column-key="priority"
:label="$t('test_track.case.priority')" :label="$t('test_track.case.priority')"
min-width="120" min-width="120"
show-overflow-tooltip> show-overflow-tooltip
>
<template v-slot:default="scope"> <template v-slot:default="scope">
<priority-table-item :value="scope.row.priority" :priority-options="priorityFilters"/> <priority-table-item
:value="scope.row.priority"
:priority-options="priorityFilters"
/>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
:filters="statusFilters" :filters="statusFilters"
column-key="reviewStatus" column-key="reviewStatus"
:label="$t('test_track.case.status')" :label="$t('test_track.case.status')"
min-width="120" min-width="120"
show-overflow-tooltip> show-overflow-tooltip
>
<template v-slot:default="scope"> <template v-slot:default="scope">
<review-status :value="scope.row.reviewStatus"/> <review-status :value="scope.row.reviewStatus" />
</template> </template>
</el-table-column> </el-table-column>
<ms-update-time-column/> <ms-update-time-column />
<ms-create-time-column/> <ms-create-time-column />
</ms-table> </ms-table>
<ms-table-pagination :change="getReviews" :current-page.sync="currentPage" :page-size.sync="pageSize" <ms-table-pagination
:total="total"/> :change="getReviews"
:current-page.sync="currentPage"
:page-size.sync="pageSize"
:total="total"
/>
</el-main> </el-main>
</el-container> </el-container>
</el-container> </el-container>
</el-dialog> </el-dialog>
<switch-project ref="switchProject" @getProjectNode="getProjectNode"/> <switch-project ref="switchProject" @getProjectNode="getProjectNode" />
</div> </div>
</template> </template>
<script> <script>
import MsAsideContainer from "metersphere-frontend/src/components/MsAsideContainer"; import MsAsideContainer from "metersphere-frontend/src/components/MsAsideContainer";
import NodeTree from "metersphere-frontend/src/components/module/MsNodeTree"; import NodeTree from "metersphere-frontend/src/components/module/MsNodeTree";
import MsDialogFooter from "metersphere-frontend/src/components/MsDialogFooter"; import MsDialogFooter from "metersphere-frontend/src/components/MsDialogFooter";
@ -154,27 +192,37 @@ import MsTableSearchBar from "metersphere-frontend/src/components/MsTableSearchB
import MsTableAdvSearchBar from "metersphere-frontend/src/components/search/MsTableAdvSearchBar"; import MsTableAdvSearchBar from "metersphere-frontend/src/components/search/MsTableAdvSearchBar";
import MsTableHeader from "metersphere-frontend/src/components/MsTableHeader"; import MsTableHeader from "metersphere-frontend/src/components/MsTableHeader";
import SwitchProject from "../../../case/components/SwitchProject"; import SwitchProject from "../../../case/components/SwitchProject";
import {TEST_REVIEW_RELEVANCE_CASE_CONFIGS} from "metersphere-frontend/src/components/search/search-components"; import { TEST_REVIEW_RELEVANCE_CASE_CONFIGS } from "metersphere-frontend/src/components/search/search-components";
import ReviewStatus from "@/business/case/components/ReviewStatus"; import ReviewStatus from "@/business/case/components/ReviewStatus";
import elTableInfiniteScroll from 'el-table-infinite-scroll'; import elTableInfiniteScroll from "el-table-infinite-scroll";
import SelectMenu from "@/business/common/SelectMenu"; import SelectMenu from "@/business/common/SelectMenu";
import {hasLicense} from "metersphere-frontend/src/utils/permission"; import { hasLicense } from "metersphere-frontend/src/utils/permission";
import {_filter, initCondition} from "metersphere-frontend/src/utils/tableUtils"; import {
import {getCurrentProjectID, getCurrentUserId, getCurrentWorkspaceId} from "metersphere-frontend/src/utils/token"; _filter,
initCondition,
} from "metersphere-frontend/src/utils/tableUtils";
import {
getCurrentProjectID,
getCurrentUserId,
getCurrentWorkspaceId,
} from "metersphere-frontend/src/utils/token";
import MsTablePagination from "metersphere-frontend/src/components/pagination/TablePagination"; import MsTablePagination from "metersphere-frontend/src/components/pagination/TablePagination";
import MsDialogHeader from "metersphere-frontend/src/components/MsDialogHeader"; import MsDialogHeader from "metersphere-frontend/src/components/MsDialogHeader";
import MsTable from "metersphere-frontend/src/components/table/MsTable"; import MsTable from "metersphere-frontend/src/components/table/MsTable";
import TableSelectCountBar from "metersphere-frontend/src/components/table/TableSelectCountBar"; import TableSelectCountBar from "metersphere-frontend/src/components/table/TableSelectCountBar";
import VersionSelect from "metersphere-frontend/src/components/version/MxVersionSelect"; import VersionSelect from "metersphere-frontend/src/components/version/MxVersionSelect";
import {getTestCaseReviewRelevance, getTestCaseReviewsCasePage} from "@/api/test-review"; import {
import {testCaseNodeListReviewRelate} from "@/api/test-case-node"; getTestCaseReviewRelevance,
import {getVersionFilters} from "@/business/utils/sdk-utils"; getTestCaseReviewsCasePage,
import {projectRelated} from "@/api/project"; } from "@/api/test-review";
import {getTestTemplate} from "@/api/custom-field-template"; import { testCaseNodeListReviewRelate } from "@/api/test-case-node";
import {initTestCaseConditionComponents} from "@/business/case/test-case"; import { getVersionFilters } from "@/business/utils/sdk-utils";
import { projectRelated } from "@/api/project";
import { getTestTemplate } from "@/api/custom-field-template";
import { initTestCaseConditionComponents } from "@/business/case/test-case";
import MsCreateTimeColumn from "metersphere-frontend/src/components/table/MsCreateTimeColumn"; import MsCreateTimeColumn from "metersphere-frontend/src/components/table/MsCreateTimeColumn";
import MsUpdateTimeColumn from "metersphere-frontend/src/components/table/MsUpdateTimeColumn"; import MsUpdateTimeColumn from "metersphere-frontend/src/components/table/MsUpdateTimeColumn";
import {getProjectApplicationConfig} from "@/api/project-application"; import { getProjectApplicationConfig } from "@/api/project-application";
export default { export default {
name: "TestReviewRelevance", name: "TestReviewRelevance",
@ -191,7 +239,7 @@ export default {
MsTableHeader, MsTableHeader,
SwitchProject, SwitchProject,
ReviewStatus, ReviewStatus,
'VersionSelect': VersionSelect, VersionSelect: VersionSelect,
MsTablePagination, MsTablePagination,
MsDialogHeader, MsDialogHeader,
MsTable, MsTable,
@ -199,11 +247,11 @@ export default {
MsCreateTimeColumn, MsCreateTimeColumn,
}, },
directives: { directives: {
'el-table-infinite-scroll': elTableInfiniteScroll "el-table-infinite-scroll": elTableInfiniteScroll,
}, },
data() { data() {
return { return {
openType: 'relevance', openType: "relevance",
checked: true, checked: true,
result: {}, result: {},
currentProject: {}, currentProject: {},
@ -215,8 +263,8 @@ export default {
treeNodes: [], treeNodes: [],
selectNodeIds: [], selectNodeIds: [],
selectNodeNames: [], selectNodeNames: [],
projectId: '', projectId: "",
projectName: '', projectName: "",
projects: [], projects: [],
pageSize: 10, pageSize: 10,
currentPage: 1, currentPage: 1,
@ -224,29 +272,29 @@ export default {
lineStatus: true, lineStatus: true,
customNum: false, customNum: false,
condition: { condition: {
components: TEST_REVIEW_RELEVANCE_CASE_CONFIGS components: TEST_REVIEW_RELEVANCE_CASE_CONFIGS,
}, },
priorityFilters: [], priorityFilters: [],
statusFilters: [ statusFilters: [
{text: this.$t('test_track.review.prepare'), value: 'Prepare'}, { text: this.$t("test_track.review.prepare"), value: "Prepare" },
{text: this.$t('test_track.review.pass'), value: 'Pass'}, { text: this.$t("test_track.review.pass"), value: "Pass" },
{text: this.$t('test_track.review.un_pass'), value: 'UnPass'}, { text: this.$t("test_track.review.un_pass"), value: "UnPass" },
{text: this.$t('test_track.review.again'), value: 'Again'}, { text: this.$t("test_track.review.again"), value: "Again" },
{text: this.$t('test_track.review.underway'), value: 'Underway'}, { text: this.$t("test_track.review.underway"), value: "Underway" },
], ],
selectCounts: null, selectCounts: null,
isFullScreen: false, isFullScreen: false,
screenHeight: 'calc(100vh - 420px)' screenHeight: "calc(100vh - 420px)",
}; };
}, },
props: { props: {
reviewId: { reviewId: {
type: String type: String,
}, },
versionEnable: { versionEnable: {
type: Boolean, type: Boolean,
default: false default: false,
} },
}, },
watch: { watch: {
reviewId() { reviewId() {
@ -264,7 +312,7 @@ export default {
this.getVersionOptions(); this.getVersionOptions();
this.getProjectNode(); this.getProjectNode();
this.getCustomNum(); this.getCustomNum();
} },
}, },
mounted() { mounted() {
if (hasLicense()) { if (hasLicense()) {
@ -278,30 +326,36 @@ export default {
loadConditionComponents() { loadConditionComponents() {
getTestTemplate(this.projectId).then((template) => { getTestTemplate(this.projectId).then((template) => {
this.initPriorityFilters(template); this.initPriorityFilters(template);
this.condition.components = initTestCaseConditionComponents(this.condition, template.customFields, false); this.condition.components = initTestCaseConditionComponents(
this.condition,
template.customFields,
false
);
}); });
}, },
initPriorityFilters(template) { initPriorityFilters(template) {
template.customFields.forEach(field => { template.customFields.forEach((field) => {
if (field.name === '用例等级') { if (field.name === "用例等级") {
this.priorityFilters = field.options; this.priorityFilters = field.options;
} }
}) });
}, },
fullScreen() { fullScreen() {
this.isFullScreen = !this.isFullScreen; this.isFullScreen = !this.isFullScreen;
this.screenHeight = this.isFullScreen ? 'calc(100vh - 180px)' : 'calc(100vh - 420px)' this.screenHeight = this.isFullScreen
? "calc(100vh - 180px)"
: "calc(100vh - 420px)";
}, },
setConditionModuleIdParam() { setConditionModuleIdParam() {
this.condition.components.forEach(component => { this.condition.components.forEach((component) => {
if (component.key === 'moduleIds') { if (component.key === "moduleIds") {
component.options.params = {"projectId": this.projectId}; component.options.params = { projectId: this.projectId };
} }
}); });
}, },
async openTestReviewRelevanceDialog() { async openTestReviewRelevanceDialog() {
// //
this.condition = {components: TEST_REVIEW_RELEVANCE_CASE_CONFIGS}; this.condition = { components: TEST_REVIEW_RELEVANCE_CASE_CONFIGS };
this.getProject(); this.getProject();
this.dialogFormVisible = true; this.dialogFormVisible = true;
await this.getProjectNode(this.projectId); await this.getProjectNode(this.projectId);
@ -319,16 +373,15 @@ export default {
*/ */
// //
if (this.condition.selectAll) { if (this.condition.selectAll) {
param.testCaseIds = ['all']; param.testCaseIds = ["all"];
} }
getTestCaseReviewRelevance(param) getTestCaseReviewRelevance(param).then(() => {
.then(() => { this.selectIds.clear();
this.selectIds.clear(); this.selectCounts = 0;
this.selectCounts = 0; this.$success(this.$t("commons.save_success"));
this.$success(this.$t('commons.save_success')); this.dialogFormVisible = false;
this.dialogFormVisible = false; this.$emit("refresh");
this.$emit('refresh'); });
});
}, },
buildPagePath(path) { buildPagePath(path) {
return path + "/" + this.currentPage + "/" + this.pageSize; return path + "/" + this.currentPage + "/" + this.pageSize;
@ -345,13 +398,16 @@ export default {
this.result.loading = true; this.result.loading = true;
initCondition(this.condition, this.condition.selectAll); initCondition(this.condition, this.condition.selectAll);
this.condition.projectId = this.projectId || getCurrentProjectID(); this.condition.projectId = this.projectId || getCurrentProjectID();
getTestCaseReviewsCasePage(this.currentPage, this.pageSize, this.condition) getTestCaseReviewsCasePage(
.then((response) => { this.currentPage,
let data = response.data; this.pageSize,
this.total = data.itemCount; this.condition
this.testReviews = data.listObject; ).then((response) => {
this.result.loading = false; let data = response.data;
}); this.total = data.itemCount;
this.testReviews = data.listObject;
this.result.loading = false;
});
}, },
setSelectCounts(data) { setSelectCounts(data) {
this.selectCounts = data; this.selectCounts = data;
@ -376,45 +432,51 @@ export default {
if (this.condition.projectId) { if (this.condition.projectId) {
delete this.condition.projectId; delete this.condition.projectId;
} }
this.projectId = ''; this.projectId = "";
}, },
filter(filters) { filter(filters) {
_filter(filters, this.condition); _filter(filters, this.condition);
this.search(); this.search();
}, },
toggleSelection(rows) { toggleSelection(rows) {
rows.forEach(row => { rows.forEach((row) => {
this.selectIds.forEach(id => { this.selectIds.forEach((id) => {
if (row.id === id) { if (row.id === id) {
// true // true
this.$refs.table.toggleRowSelection(row, true) this.$refs.table.toggleRowSelection(row, true);
} }
}) });
}) });
}, },
getProject() { getProject() {
if (this.reviewId) { if (this.reviewId) {
projectRelated({userId: getCurrentUserId(), workspaceId: getCurrentWorkspaceId()}) projectRelated({
.then((res) => { userId: getCurrentUserId(),
let data = res.data; workspaceId: getCurrentWorkspaceId(),
if (data) { }).then((res) => {
this.projects = data; let data = res.data;
const index = data.findIndex(d => d.id === getCurrentProjectID()); if (data) {
if (index !== -1) { this.projects = data;
this.projectId = data[index].id; const index = data.findIndex((d) => d.id === getCurrentProjectID());
this.projectName = data[index].name; if (index !== -1) {
this.currentProject = data[index]; this.projectId = data[index].id;
} else { this.projectName = data[index].name;
this.projectId = data[0].id; this.currentProject = data[index];
this.projectName = data[0].name; } else {
this.currentProject = data[0]; this.projectId = data[0].id;
} this.projectName = data[0].name;
} this.currentProject = data[0];
}); }
}
});
} }
}, },
switchProject() { switchProject() {
this.$refs.switchProject.open({id: this.reviewId, url: '/test/case/review/project/', type: 'review'}); this.$refs.switchProject.open({
id: this.reviewId,
url: "/test/case/review/project/",
type: "review",
});
}, },
search() { search() {
this.currentPage = 1; this.currentPage = 1;
@ -428,7 +490,9 @@ export default {
}, },
getProjectNode(projectId, condition) { getProjectNode(projectId, condition) {
return new Promise((resolve) => { return new Promise((resolve) => {
const index = this.projects.findIndex(project => project.id === projectId); const index = this.projects.findIndex(
(project) => project.id === projectId
);
if (index !== -1) { if (index !== -1) {
this.projectName = this.projects[index].name; this.projectName = this.projects[index].name;
this.currentProject = this.projects[index]; this.currentProject = this.projects[index];
@ -436,39 +500,41 @@ export default {
if (projectId) { if (projectId) {
this.projectId = projectId; this.projectId = projectId;
} }
testCaseNodeListReviewRelate({reviewId: this.reviewId, projectId: this.projectId, ...condition}) testCaseNodeListReviewRelate({
.then((response) => { reviewId: this.reviewId,
this.treeNodes = response.data; projectId: this.projectId,
resolve(); ...condition,
}); }).then((response) => {
this.treeNodes = response.data;
resolve();
});
this.selectNodeIds = []; this.selectNodeIds = [];
}); });
}, },
getVersionOptions() { getVersionOptions() {
getVersionFilters(this.projectId) getVersionFilters(this.projectId).then(
.then(r => this.versionFilters = r.data); (r) => (this.versionFilters = r.data)
);
}, },
changeVersion(version) { changeVersion(version) {
this.condition.versionId = version || null; this.condition.versionId = version || null;
this.search(); this.search();
}, },
getCustomNum() { getCustomNum() {
getProjectApplicationConfig('CASE_CUSTOM_NUM') getProjectApplicationConfig("CASE_CUSTOM_NUM").then((result) => {
.then(result => { let data = result.data;
let data = result.data; if (data && data.typeValue === "true") {
if (data && data.typeValue === 'true') { this.customNum = true;
this.customNum = true; } else {
} else { this.customNum = false;
this.customNum = false; }
} });
});
}, },
} },
} };
</script> </script>
<style scoped> <style scoped>
.tb-edit .el-input { .tb-edit .el-input {
display: none; display: none;
color: black; color: black;
@ -476,12 +542,10 @@ export default {
.tb-edit .current-row .el-input { .tb-edit .current-row .el-input {
display: block; display: block;
} }
.tb-edit .current-row .el-input + span { .tb-edit .current-row .el-input + span {
display: none; display: none;
} }
.node-tree { .node-tree {
@ -519,5 +583,4 @@ export default {
margin-right: 12px; margin-right: 12px;
margin-bottom: 10px; margin-bottom: 10px;
} }
</style> </style>

View File

@ -1,6 +1,6 @@
<template> <template>
<ms-container> <ms-container>
<ms-aside-container> <ms-aside-container pageKey="WORKSTATION_DETAIL">
<project-menu <project-menu
ref="projectMenu" ref="projectMenu"
@setProject="setProject" @setProject="setProject"
@ -15,72 +15,99 @@
<el-row> <el-row>
<table-header <table-header
ref="tableHeader" ref="tableHeader"
:select-show=!isFocus :select-show="!isFocus"
@rushTableNode="rushTableNode" @rushTableNode="rushTableNode"
> >
</table-header> </table-header>
</el-row> </el-row>
<el-row> <el-row>
<template <template
v-if="currentTodo === 'performance'||((currentTodo === 'api_automation'||currentTodo === 'track_case'||currentTodo === 'api_case')&& isUpcoming ===false)"> v-if="
<mx-version-select v-xpack :project-id="projectId" @changeVersion="changeVersion"/> currentTodo === 'performance' ||
((currentTodo === 'api_automation' ||
currentTodo === 'track_case' ||
currentTodo === 'api_case') &&
isUpcoming === false)
"
>
<mx-version-select
v-xpack
:project-id="projectId"
@changeVersion="changeVersion"
/>
</template> </template>
<ms-tab-button <ms-tab-button
v-if="currentTodo ==='track_case' && isUpcoming ===true" v-if="currentTodo === 'track_case' && isUpcoming === true"
:active-dom="activeDom" :active-dom="activeDom"
@update:activeDom="updateActiveDom" @update:activeDom="updateActiveDom"
:left-tip="$t('test_track.case.list')" :left-tip="$t('test_track.case.list')"
:left-content="$t('test_track.case.list')" :left-content="$t('test_track.case.list')"
:right-tip="$t('commons.dash_board')" :right-tip="$t('commons.dash_board')"
:right-content="$t('commons.dash_board')" :right-content="$t('commons.dash_board')"
:middle-button-enable="false"> :middle-button-enable="false"
>
<template v-slot:version> <template v-slot:version>
<mx-version-select v-xpack :project-id="projectId" @changeVersion="changeVersion"/> <mx-version-select
v-xpack
:project-id="projectId"
@changeVersion="changeVersion"
/>
</template> </template>
<div v-if="activeDom === 'left'" style="padding-top: 20px"> <div v-if="activeDom === 'left'" style="padding-top: 20px">
<case-table-list <case-table-list
v-if="currentTodo ==='track_case'" v-if="currentTodo === 'track_case'"
@refresh="refresh" @refresh="refresh"
@setCondition="setCondition" @setCondition="setCondition"
:is-focus=isFocus :is-focus="isFocus"
:is-creation=isCreation :is-creation="isCreation"
:custom-num="custom_num" :custom-num="custom_num"
:current-version="currentVersion" :current-version="currentVersion"
ref="caseTableList"> ref="caseTableList"
>
</case-table-list> </case-table-list>
</div> </div>
</ms-tab-button> </ms-tab-button>
<case-table-list <case-table-list
v-if="currentTodo ==='track_case'&& isUpcoming===false" v-if="currentTodo === 'track_case' && isUpcoming === false"
@refresh="refresh" @refresh="refresh"
@setCondition="setCondition" @setCondition="setCondition"
:is-focus=isFocus :is-focus="isFocus"
:is-creation=isCreation :is-creation="isCreation"
:current-version="currentVersion" :current-version="currentVersion"
:custom-num="custom_num" :custom-num="custom_num"
ref="caseTableList"> ref="caseTableList"
>
</case-table-list> </case-table-list>
<status-tap-button <status-tap-button
v-if="(currentTodo ==='api_automation'||currentTodo ==='api_case'||currentTodo === 'api_definition') && isUpcoming===true" v-if="
(currentTodo === 'api_automation' ||
currentTodo === 'api_case' ||
currentTodo === 'api_definition') &&
isUpcoming === true
"
:active-status="activeStatus" :active-status="activeStatus"
@update:activeStatus="updateActiveStatus" @update:activeStatus="updateActiveStatus"
:left-tip="$t('commons.to_be_completed')" :left-tip="$t('commons.to_be_completed')"
:left-content="$t('commons.to_be_completed')" :left-content="$t('commons.to_be_completed')"
:right-tip="$t('commons.pending_upgrade')" :right-tip="$t('commons.pending_upgrade')"
:right-content="$t('commons.pending_upgrade')" :right-content="$t('commons.pending_upgrade')"
:middle-button-enable="false"> :middle-button-enable="false"
>
<template v-slot:version> <template v-slot:version>
<mx-version-select v-xpack :project-id="projectId" @changeVersion="changeVersion"/> <mx-version-select
v-xpack
:project-id="projectId"
@changeVersion="changeVersion"
/>
</template> </template>
<div style="padding-top: 20px"> <div style="padding-top: 20px">
<api-case-table-list <api-case-table-list
v-if="currentTodo === 'api_case'" v-if="currentTodo === 'api_case'"
:is-focus=isFocus :is-focus="isFocus"
:is-creation=isCreation :is-creation="isCreation"
:is-upcoming=isUpcoming :is-upcoming="isUpcoming"
:relevanceProjectId=projectId :relevanceProjectId="projectId"
:current-version="currentVersion" :current-version="currentVersion"
:current-protocol="currentProtocol" :current-protocol="currentProtocol"
ref="apiCaseTableList" ref="apiCaseTableList"
@ -88,10 +115,11 @@
</api-case-table-list> </api-case-table-list>
<automation-table-list <automation-table-list
v-if="currentTodo === 'api_automation'" v-if="currentTodo === 'api_automation'"
:is-focus=isFocus :is-focus="isFocus"
:is-creation=isCreation :is-creation="isCreation"
:current-version="currentVersion" :current-version="currentVersion"
ref="automationTableList"> ref="automationTableList"
>
</automation-table-list> </automation-table-list>
<api-definition-table-list <api-definition-table-list
v-if="currentTodo === 'api_definition'" v-if="currentTodo === 'api_definition'"
@ -99,75 +127,77 @@
:current-protocol="currentProtocol" :current-protocol="currentProtocol"
:queryDataType="queryDataType" :queryDataType="queryDataType"
:current-version="currentVersion" :current-version="currentVersion"
:is-focus=isFocus :is-focus="isFocus"
:is-creation=isCreation :is-creation="isCreation"
:is-upcoming=isUpcoming :is-upcoming="isUpcoming"
ref="apiDefinitionTableList" ref="apiDefinitionTableList"
> >
</api-definition-table-list> </api-definition-table-list>
</div> </div>
</status-tap-button> </status-tap-button>
<api-case-table-list <api-case-table-list
v-if="currentTodo ==='api_case'&& isUpcoming===false" v-if="currentTodo === 'api_case' && isUpcoming === false"
:is-focus=isFocus :is-focus="isFocus"
:is-creation=isCreation :is-creation="isCreation"
:is-upcoming=isUpcoming :is-upcoming="isUpcoming"
:relevanceProjectId=projectId :relevanceProjectId="projectId"
:current-version="currentVersion" :current-version="currentVersion"
:current-protocol="currentProtocol" :current-protocol="currentProtocol"
ref="apiCaseTableList" ref="apiCaseTableList"
> >
</api-case-table-list> </api-case-table-list>
<automation-table-list <automation-table-list
v-if="currentTodo ==='api_automation'&& isUpcoming===false" v-if="currentTodo === 'api_automation' && isUpcoming === false"
:is-focus=isFocus :is-focus="isFocus"
:is-creation=isCreation :is-creation="isCreation"
:current-version="currentVersion" :current-version="currentVersion"
ref="automationTableList"> ref="automationTableList"
>
</automation-table-list> </automation-table-list>
<plan-table-list <plan-table-list
v-if="currentTodo === 'track_plan'" v-if="currentTodo === 'track_plan'"
:is-focus=isFocus :is-focus="isFocus"
:is-creation=isCreation :is-creation="isCreation"
ref="testPlanList"> ref="testPlanList"
>
</plan-table-list> </plan-table-list>
<review-table-list <review-table-list
v-if="currentTodo === 'track_review'" v-if="currentTodo === 'track_review'"
:is-focus=isFocus :is-focus="isFocus"
:is-creation=isCreation :is-creation="isCreation"
ref="testPlanList"> ref="testPlanList"
>
</review-table-list> </review-table-list>
<issue-table-list <issue-table-list
v-if="currentTodo === 'track_issue'" v-if="currentTodo === 'track_issue'"
@handlePageChange="getIssues" @handlePageChange="getIssues"
:is-focus=isFocus :is-focus="isFocus"
:is-creation=isCreation :is-creation="isCreation"
@refresh="getIssues" @refresh="getIssues"
ref="issueTableList" ref="issueTableList"
> >
</issue-table-list> </issue-table-list>
<api-definition-table-list <api-definition-table-list
v-if="currentTodo === 'api_definition' && isUpcoming===false" v-if="currentTodo === 'api_definition' && isUpcoming === false"
@runTest="runTest" @runTest="runTest"
:current-protocol="currentProtocol" :current-protocol="currentProtocol"
:queryDataType="queryDataType" :queryDataType="queryDataType"
:current-version="currentVersion" :current-version="currentVersion"
:is-read-only="false" :is-read-only="false"
:is-focus=isFocus :is-focus="isFocus"
:is-creation=isCreation :is-creation="isCreation"
:is-upcoming=isUpcoming :is-upcoming="isUpcoming"
ref="apiDefinitionTableList" ref="apiDefinitionTableList"
> >
</api-definition-table-list> </api-definition-table-list>
<performance-table-list <performance-table-list
v-if="currentTodo === 'performance'" v-if="currentTodo === 'performance'"
:is-focus=isFocus :is-focus="isFocus"
:is-creation=isCreation :is-creation="isCreation"
:current-version="currentVersion" :current-version="currentVersion"
ref="performanceTableList" ref="performanceTableList"
> >
</performance-table-list> </performance-table-list>
</el-row> </el-row>
</el-card> </el-card>
</ms-main-container> </ms-main-container>
@ -187,32 +217,30 @@ import ApiDefinitionTableList from "@/business/component/ApiDefinitionTableList"
import PerformanceTableList from "@/business/component/PerformanceTableList"; import PerformanceTableList from "@/business/component/PerformanceTableList";
import AutomationTableList from "@/business/component/AutomationTableList"; import AutomationTableList from "@/business/component/AutomationTableList";
import ApiCaseTableList from "@/business/component/ApiCaseTableList"; import ApiCaseTableList from "@/business/component/ApiCaseTableList";
import {getIssues} from "@/api/issue"; import { getIssues } from "@/api/issue";
import { import {
fullScreenLoading, fullScreenLoading,
getUUID, getUUID,
stopFullScreenLoading stopFullScreenLoading,
} from "metersphere-frontend/src/utils"; } from "metersphere-frontend/src/utils";
import { import {
getCurrentProjectID, getCurrentProjectID,
getCurrentUser, getCurrentUser,
getCurrentUserId, getCurrentUserId,
getCurrentWorkspaceId getCurrentWorkspaceId,
} from "metersphere-frontend/src/utils/token"; } from "metersphere-frontend/src/utils/token";
import {switchProject} from "metersphere-frontend/src/api/project"; import { switchProject } from "metersphere-frontend/src/api/project";
import MsTabButton from "metersphere-frontend/src/components/MsTabButton"; import MsTabButton from "metersphere-frontend/src/components/MsTabButton";
import StatusTapButton from "@/business/component/StatusTapButton"; import StatusTapButton from "@/business/component/StatusTapButton";
import {useUserStore} from "@/store"; import { useUserStore } from "@/store";
import MxVersionSelect from "metersphere-frontend/src/components/version/MxVersionSelect"; import MxVersionSelect from "metersphere-frontend/src/components/version/MxVersionSelect";
import {hasPermissions} from "metersphere-frontend/src/utils/permission"; import { hasPermissions } from "metersphere-frontend/src/utils/permission";
import {getDefaultSecondLevelMenu} from "metersphere-frontend/src/router"; import { getDefaultSecondLevelMenu } from "metersphere-frontend/src/router";
import {getUserProjectList} from "@/api/project"; import { getUserProjectList } from "@/api/project";
import {PROJECT_NAME} from "metersphere-frontend/src/utils/constants"; import { PROJECT_NAME } from "metersphere-frontend/src/utils/constants";
export default { export default {
name: 'WorkstationDetail', name: "WorkstationDetail",
components: { components: {
MsMainContainer, MsMainContainer,
MsContainer, MsContainer,
@ -229,7 +257,7 @@ export default {
ApiCaseTableList, ApiCaseTableList,
MsTabButton, MsTabButton,
StatusTapButton, StatusTapButton,
MxVersionSelect MxVersionSelect,
}, },
watch: { watch: {
tableKey() { tableKey() {
@ -239,44 +267,44 @@ export default {
this.changeTableByState(); this.changeTableByState();
}, },
currentTodo() { currentTodo() {
this.activeStatus = 'left' this.activeStatus = "left";
}, },
currentTodoName() { currentTodoName() {
this.$nextTick(function () { this.$nextTick(function () {
this.$refs.tableHeader.setActiveIndex(this.currentTodoName); this.$refs.tableHeader.setActiveIndex(this.currentTodoName);
this.rushTableNode(this.currentTodoName) this.rushTableNode(this.currentTodoName);
}) });
} },
}, },
data() { data() {
return { return {
projectId: '', projectId: "",
tableKey: '', tableKey: "",
currentTodo: 'track_case', currentTodo: "track_case",
condition: {}, condition: {},
custom_num: false, custom_num: false,
currentProtocol: 'HTTP', currentProtocol: "HTTP",
activeTab: "api", activeTab: "api",
apiTabs: [{ apiTabs: [
title: this.$t('api_test.definition.api_title'), {
name: 'default', title: this.$t("api_test.definition.api_title"),
type: "list", name: "default",
closable: false type: "list",
}], closable: false,
apiDefaultTab: 'default', },
],
apiDefaultTab: "default",
selectCase: {}, selectCase: {},
userId: getCurrentUser().id, userId: getCurrentUser().id,
currentProjectId: '', currentProjectId: "",
activeDom: 'left', activeDom: "left",
activeStatus: '', activeStatus: "",
currentVersion: null, currentVersion: null,
searchArray:[], searchArray: [],
userStore: {} userStore: {},
} };
}, },
inject: [ inject: ["reloadTopMenus"],
'reloadTopMenus'
],
computed: { computed: {
queryDataType: function () { queryDataType: function () {
let routeParam = this.$route.params.dataType; let routeParam = this.$route.params.dataType;
@ -288,18 +316,23 @@ export default {
methods: { methods: {
reloadPage: function () { reloadPage: function () {
// todo refactor permission check // todo refactor permission check
let redirectUrl = sessionStorage.getItem('redirectUrl'); let redirectUrl = sessionStorage.getItem("redirectUrl");
let copyRedirectUrl = redirectUrl; let copyRedirectUrl = redirectUrl;
if (!copyRedirectUrl) { if (!copyRedirectUrl) {
this.$router.push("/"); this.$router.push("/");
this.reload(); this.reload();
return; return;
} }
if (copyRedirectUrl.startsWith("/track") || copyRedirectUrl.startsWith("/performance") if (
|| copyRedirectUrl.startsWith("/api") || copyRedirectUrl.startsWith("/ui") || copyRedirectUrl.startsWith("/workstation")) { copyRedirectUrl.startsWith("/track") ||
copyRedirectUrl.startsWith("/performance") ||
copyRedirectUrl.startsWith("/api") ||
copyRedirectUrl.startsWith("/ui") ||
copyRedirectUrl.startsWith("/workstation")
) {
// //
copyRedirectUrl = getDefaultSecondLevelMenu(copyRedirectUrl); copyRedirectUrl = getDefaultSecondLevelMenu(copyRedirectUrl);
if (copyRedirectUrl !== '/') { if (copyRedirectUrl !== "/") {
this.$router.push(copyRedirectUrl); this.$router.push(copyRedirectUrl);
this.reloadTopMenus(); this.reloadTopMenus();
this.reload(); this.reload();
@ -307,13 +340,24 @@ export default {
} }
} }
// //
let projectPermission = hasPermissions('PROJECT_USER:READ', 'PROJECT_ENVIRONMENT:READ', 'PROJECT_OPERATING_LOG:READ', 'PROJECT_FILE:READ+JAR', 'PROJECT_FILE:READ+FILE', 'PROJECT_CUSTOM_CODE:READ'); let projectPermission = hasPermissions(
let uiPermission = hasPermissions('PROJECT_UI_ELEMENT:READ', 'PROJECT_UI_SCENARIO:READ', 'PROJECT_UI_REPORT:READ'); "PROJECT_USER:READ",
"PROJECT_ENVIRONMENT:READ",
"PROJECT_OPERATING_LOG:READ",
"PROJECT_FILE:READ+JAR",
"PROJECT_FILE:READ+FILE",
"PROJECT_CUSTOM_CODE:READ"
);
let uiPermission = hasPermissions(
"PROJECT_UI_ELEMENT:READ",
"PROJECT_UI_SCENARIO:READ",
"PROJECT_UI_REPORT:READ"
);
let redirectMap = { let redirectMap = {
project: projectPermission, project: projectPermission,
ui: uiPermission, ui: uiPermission,
}; };
let locations = redirectUrl.split('/'); let locations = redirectUrl.split("/");
if (locations.length > 2 && !redirectMap[locations[1]]) { if (locations.length > 2 && !redirectMap[locations[1]]) {
let v = true; let v = true;
for (const k in redirectMap) { for (const k in redirectMap) {
@ -337,10 +381,10 @@ export default {
return; return;
} }
const loading = fullScreenLoading(this); const loading = fullScreenLoading(this);
switchProject({id: this.userId, lastProjectId: projectId}) switchProject({ id: this.userId, lastProjectId: projectId })
.then(response => { .then((response) => {
this.userStore.switchProject(response); this.userStore.switchProject(response);
this.$EventBus.$emit('projectChange'); this.$EventBus.$emit("projectChange");
this.changeProjectName(projectId); this.changeProjectName(projectId);
// //
this.reloadPage(); this.reloadPage();
@ -352,7 +396,7 @@ export default {
}, },
changeProjectName(projectId) { changeProjectName(projectId) {
if (projectId) { if (projectId) {
let project = this.searchArray.filter(p => p.id === projectId); let project = this.searchArray.filter((p) => p.id === projectId);
if (project.length > 0) { if (project.length > 0) {
sessionStorage.setItem(PROJECT_NAME, project[0].name); sessionStorage.setItem(PROJECT_NAME, project[0].name);
} }
@ -362,34 +406,38 @@ export default {
this.tableKey = tableKey; this.tableKey = tableKey;
}, },
changeTableByState() { changeTableByState() {
if (this.currentTodo === 'api_automation' && this.$refs.automationTableList) { if (
if (this.activeStatus === 'left') { this.currentTodo === "api_automation" &&
this.$refs.automationTableList.changeTabState('finish') this.$refs.automationTableList
) {
if (this.activeStatus === "left") {
this.$refs.automationTableList.changeTabState("finish");
} else { } else {
this.$refs.automationTableList.changeTabState('update') this.$refs.automationTableList.changeTabState("update");
} }
} }
if (this.currentTodo === 'api_case' && this.$refs.apiCaseTableList) { if (this.currentTodo === "api_case" && this.$refs.apiCaseTableList) {
if (this.activeStatus === 'left') { if (this.activeStatus === "left") {
this.$refs.apiCaseTableList.changeTabState('finish') this.$refs.apiCaseTableList.changeTabState("finish");
} else { } else {
this.$refs.apiCaseTableList.changeTabState('update') this.$refs.apiCaseTableList.changeTabState("update");
} }
} }
if (this.currentTodo === 'api_definition' && this.$refs.apiDefinitionTableList) { if (
if (this.activeStatus === 'left') { this.currentTodo === "api_definition" &&
this.$refs.apiDefinitionTableList.changeTabState("finish") this.$refs.apiDefinitionTableList
) {
if (this.activeStatus === "left") {
this.$refs.apiDefinitionTableList.changeTabState("finish");
} else { } else {
this.$refs.apiDefinitionTableList.changeTabState("update") this.$refs.apiDefinitionTableList.changeTabState("update");
} }
} }
}, },
getTableData() { getTableData() {
this.currentTodo = this.tableKey this.currentTodo = this.tableKey;
},
refresh() {
}, },
refresh() {},
setCondition(data) { setCondition(data) {
this.condition = data; this.condition = data;
}, },
@ -419,18 +467,19 @@ export default {
for (let index in this.apiTabs) { for (let index in this.apiTabs) {
let tab = this.apiTabs[index]; let tab = this.apiTabs[index];
if (tab.name === this.apiDefaultTab) { if (tab.name === this.apiDefaultTab) {
tab.title = this.$t('api_test.definition.request.edit_api') + "-" + data.name; tab.title =
this.$t("api_test.definition.request.edit_api") + "-" + data.name;
break; break;
} }
} }
}, },
handleTabsEdit(targetName, action, api) { handleTabsEdit(targetName, action, api) {
if (!this.projectId) { if (!this.projectId) {
this.$warning(this.$t('commons.check_project_tip')); this.$warning(this.$t("commons.check_project_tip"));
return; return;
} }
if (targetName === undefined || targetName === null) { if (targetName === undefined || targetName === null) {
targetName = this.$t('api_test.definition.request.title'); targetName = this.$t("api_test.definition.request.title");
} }
let newTabName = getUUID(); let newTabName = getUUID();
this.apiTabs.push({ this.apiTabs.push({
@ -446,16 +495,20 @@ export default {
this.apiDefaultTab = newTabName; this.apiDefaultTab = newTabName;
}, },
updateActiveDom(activeDom) { updateActiveDom(activeDom) {
if (activeDom === 'right') { if (activeDom === "right") {
this.$alert(this.$t('commons.function_planning'), this.$t('commons.dash_board'), { this.$alert(
confirmButtonText: '确定', this.$t("commons.function_planning"),
callback: action => { this.$t("commons.dash_board"),
/*this.$message({ {
confirmButtonText: "确定",
callback: (action) => {
/*this.$message({
type: 'info', type: 'info',
message: `action: ${ action }` message: `action: ${ action }`
});*/ });*/
},
} }
}); );
} }
this.activeDom = activeDom; this.activeDom = activeDom;
}, },
@ -463,7 +516,7 @@ export default {
this.activeStatus = activeStatus; this.activeStatus = activeStatus;
}, },
setCurrentProtocol(protocol) { setCurrentProtocol(protocol) {
this.currentProtocol = protocol this.currentProtocol = protocol;
}, },
changeVersion(currentVersion) { changeVersion(currentVersion) {
this.currentVersion = currentVersion || null; this.currentVersion = currentVersion || null;
@ -471,44 +524,46 @@ export default {
init() { init() {
let data = { let data = {
userId: getCurrentUserId(), userId: getCurrentUserId(),
workspaceId: getCurrentWorkspaceId() workspaceId: getCurrentWorkspaceId(),
}; };
this.loading = true; this.loading = true;
getUserProjectList(data) getUserProjectList(data).then((response) => {
.then(response => { this.searchArray = response.data;
this.searchArray = response.data; let projectId = getCurrentProjectID();
let projectId = getCurrentProjectID(); if (projectId) {
if (projectId) { // projectId ;
// projectId ; if (
if (this.searchArray.length > 0 && this.searchArray.map(p => p.id).indexOf(projectId) === -1) { this.searchArray.length > 0 &&
this.change(this.items[0].id); this.searchArray.map((p) => p.id).indexOf(projectId) === -1
} ) {
} else { this.change(this.items[0].id);
if (this.items.length > 0) {
this.change(this.items[0].id);
}
} }
this.changeProjectName(projectId); } else {
}); if (this.items.length > 0) {
this.change(this.items[0].id);
}
}
this.changeProjectName(projectId);
});
}, },
setDefaultCurrentTodo() { setDefaultCurrentTodo() {
// TABTAB // TABTAB
if (hasPermissions('PROJECT_TRACK_CASE:READ')) { if (hasPermissions("PROJECT_TRACK_CASE:READ")) {
this.currentTodo = 'track_case'; this.currentTodo = "track_case";
} else if (hasPermissions('PROJECT_TRACK_PLAN:READ')) { } else if (hasPermissions("PROJECT_TRACK_PLAN:READ")) {
this.currentTodo = 'track_plan'; this.currentTodo = "track_plan";
} else if (hasPermissions('PROJECT_TRACK_REVIEW:READ')) { } else if (hasPermissions("PROJECT_TRACK_REVIEW:READ")) {
this.currentTodo = 'track_review'; this.currentTodo = "track_review";
} else if (hasPermissions('PROJECT_TRACK_ISSUE:READ')) { } else if (hasPermissions("PROJECT_TRACK_ISSUE:READ")) {
this.currentTodo = 'track_issue'; this.currentTodo = "track_issue";
} else if (hasPermissions('PROJECT_API_DEFINITION:READ')) { } else if (hasPermissions("PROJECT_API_DEFINITION:READ")) {
this.currentTodo = 'api_definition'; this.currentTodo = "api_definition";
} else if (hasPermissions('PROJECT_API_SCENARIO:READ')) { } else if (hasPermissions("PROJECT_API_SCENARIO:READ")) {
this.currentTodo = 'api_automation'; this.currentTodo = "api_automation";
} else if (hasPermissions('PROJECT_PERFORMANCE_TEST:READ')) { } else if (hasPermissions("PROJECT_PERFORMANCE_TEST:READ")) {
this.currentTodo = 'performance'; this.currentTodo = "performance";
} }
} },
}, },
props: { props: {
isFocus: { isFocus: {
@ -525,24 +580,24 @@ export default {
}, },
currentTodoName: { currentTodoName: {
type: String, type: String,
default: 'track_case', default: "track_case",
} },
}, },
mounted() { mounted() {
this.$nextTick(function () { this.$nextTick(function () {
this.$refs.tableHeader.setActiveIndex(this.currentTodoName); this.$refs.tableHeader.setActiveIndex(this.currentTodoName);
this.rushTableNode(this.currentTodoName) this.rushTableNode(this.currentTodoName);
}) });
this.activeStatus = 'left' this.activeStatus = "left";
if (this.isUpcoming === true) { if (this.isUpcoming === true) {
if (this.currentTodo === 'api_automation') { if (this.currentTodo === "api_automation") {
this.$refs.automationTableList.changeTabState('finish') this.$refs.automationTableList.changeTabState("finish");
} }
if (this.currentTodo === 'api_case') { if (this.currentTodo === "api_case") {
this.$refs.apiCaseTableList.changeTabState('finish') this.$refs.apiCaseTableList.changeTabState("finish");
} }
if (this.currentTodo === 'api_definition') { if (this.currentTodo === "api_definition") {
this.$refs.apiDefinitionTableList.changeTabState('finish') this.$refs.apiDefinitionTableList.changeTabState("finish");
} }
} }
}, },
@ -551,7 +606,7 @@ export default {
this.init(); this.init();
this.userStore = useUserStore(); this.userStore = useUserStore();
}, },
} };
</script> </script>
<style scoped> <style scoped>
.workstation-card { .workstation-card {

View File

@ -2,35 +2,71 @@
<div> <div>
<el-card class="table-card" v-loading="loading"> <el-card class="table-card" v-loading="loading">
<template v-slot:header> <template v-slot:header>
<ms-table-header :create-tip="btnTips" :condition.sync="condition" :show-create="!readOnly" <ms-table-header
@search="search" @create="createEnvironment" :create-permission="['WORKSPACE_PROJECT_ENVIRONMENT:READ+CREATE_GROUP']"> :create-tip="btnTips"
:condition.sync="condition"
:show-create="!readOnly"
@search="search"
@create="createEnvironment"
:create-permission="[
'WORKSPACE_PROJECT_ENVIRONMENT:READ+CREATE_GROUP',
]"
>
</ms-table-header> </ms-table-header>
</template> </template>
<el-table :data="environmentGroupList" <el-table
style="width: 100%" ref="table" :data="environmentGroupList"
row-key="id" style="width: 100%"
@expand-change="expandChange" ref="table"
:height="screenHeight"> row-key="id"
@expand-change="expandChange"
:height="screenHeight"
>
<el-table-column type="expand" prop="id"> <el-table-column type="expand" prop="id">
<template v-slot:default="scope"> <template v-slot:default="scope">
<environment-group-row :env-group-id="scope.row.id" ref="environmentGroupRow" <environment-group-row
:read-only="!scope.row.readOnly" :env-group-id="scope.row.id"
style="overflow-x:hidden; overflow-y: auto; height: 180px;"/> ref="environmentGroupRow"
:read-only="!scope.row.readOnly"
style="overflow-x: hidden; overflow-y: auto; height: 180px"
/>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column :label="$t('commons.name')" prop="name" show-overflow-tooltip min-width="200"> <el-table-column
:label="$t('commons.name')"
prop="name"
show-overflow-tooltip
min-width="200"
>
<template v-slot:default="scope"> <template v-slot:default="scope">
<span @click.stop v-if="scope.row.showNameInput"> <span @click.stop v-if="scope.row.showNameInput">
<el-input size="mini" v-model="scope.row.name" class="name-input" @blur="updateGroupName(scope.row)" show-word-limit <el-input
maxlength="50" :placeholder="$t('commons.input_name')" ref="nameEdit"/> size="mini"
v-model="scope.row.name"
class="name-input"
@blur="updateGroupName(scope.row)"
show-word-limit
maxlength="50"
:placeholder="$t('commons.input_name')"
ref="nameEdit"
/>
</span> </span>
<span v-else> <span v-else>
<span>{{ scope.row.name }}</span> <span>{{ scope.row.name }}</span>
<i class="el-icon-edit" style="cursor:pointer;margin-left: 4px;" @click="editName(scope.row)" v-permission="['WORKSPACE_PROJECT_ENVIRONMENT:READ+EDIT_GROUP']"/> <i
class="el-icon-edit"
style="cursor: pointer; margin-left: 4px"
@click="editName(scope.row)"
v-permission="['WORKSPACE_PROJECT_ENVIRONMENT:READ+EDIT_GROUP']"
/>
</span> </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="createTime" :label="$t('commons.create_time')" min-width="200"> <el-table-column
prop="createTime"
:label="$t('commons.create_time')"
min-width="200"
>
<template v-slot:default="scope"> <template v-slot:default="scope">
<span>{{ scope.row.createTime | datetimeFormat }}</span> <span>{{ scope.row.createTime | datetimeFormat }}</span>
</template> </template>
@ -38,27 +74,46 @@
<el-table-column :label="$t('commons.operating')" width="350"> <el-table-column :label="$t('commons.operating')" width="350">
<template v-slot:default="scope"> <template v-slot:default="scope">
<div v-if="!readOnly"> <div v-if="!readOnly">
<ms-table-operator @editClick="editEnvironment(scope.row)" <ms-table-operator
:edit-permission="['WORKSPACE_PROJECT_ENVIRONMENT:READ+EDIT_GROUP']" @editClick="editEnvironment(scope.row)"
:delete-permission="['WORKSPACE_PROJECT_ENVIRONMENT:READ+DELETE_GROUP']" :edit-permission="[
@deleteClick="deleteEnvironment(scope.row)"> 'WORKSPACE_PROJECT_ENVIRONMENT:READ+EDIT_GROUP',
]"
:delete-permission="[
'WORKSPACE_PROJECT_ENVIRONMENT:READ+DELETE_GROUP',
]"
@deleteClick="deleteEnvironment(scope.row)"
>
<template v-slot:middle> <template v-slot:middle>
<ms-table-operator-button :tip="$t('commons.copy')" @exec="copyEnvironment(scope.row)" <ms-table-operator-button
v-permission="['WORKSPACE_PROJECT_ENVIRONMENT:READ+COPY_GROUP']" :tip="$t('commons.copy')"
icon="el-icon-document-copy" type="info"/> @exec="copyEnvironment(scope.row)"
v-permission="[
'WORKSPACE_PROJECT_ENVIRONMENT:READ+COPY_GROUP',
]"
icon="el-icon-document-copy"
type="info"
/>
</template> </template>
</ms-table-operator> </ms-table-operator>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<ms-table-pagination :change="init" :current-page.sync="currentPage" :page-size.sync="pageSize" <ms-table-pagination
:total="total"/> :change="init"
:current-page.sync="currentPage"
:page-size.sync="pageSize"
:total="total"
/>
</el-card> </el-card>
<edit-environment-group ref="editEnvironmentGroup" @refresh="init"/> <edit-environment-group ref="editEnvironmentGroup" @refresh="init" />
<ms-delete-confirm :title="$t('workspace.env_group.delete')" @delete="_handleDelete" ref="deleteConfirm"/> <ms-delete-confirm
:title="$t('workspace.env_group.delete')"
@delete="_handleDelete"
ref="deleteConfirm"
/>
</div> </div>
</template> </template>
@ -78,7 +133,7 @@ import {
copyEnvironmentGroup, copyEnvironmentGroup,
delEnvironmentById, delEnvironmentById,
getEnvironmentGroupPages, getEnvironmentGroupPages,
modifyEnvironmentGroup modifyEnvironmentGroup,
} from "@/api/environment"; } from "@/api/environment";
export default { export default {
@ -94,34 +149,34 @@ export default {
MsTableButton, MsTableButton,
MsTableHeader, MsTableHeader,
EnvironmentGroupRow, EnvironmentGroupRow,
MsDeleteConfirm MsDeleteConfirm,
}, },
data() { data() {
return { return {
btnTips: this.$t('workspace.env_group.create'), btnTips: this.$t("workspace.env_group.create"),
envGroupId: '', envGroupId: "",
condition: {}, condition: {},
environmentGroupList: [], environmentGroupList: [],
loading: false, loading: false,
currentPage: 1, currentPage: 1,
pageSize: 10, pageSize: 10,
total: 0, total: 0,
showNameInput: false showNameInput: false,
} };
}, },
props: { props: {
screenHeight: { screenHeight: {
type: String, type: String,
default() { default() {
return 'calc(100vh - 170px)'; return "calc(100vh - 170px)";
} },
}, },
readOnly: { readOnly: {
type: Boolean, type: Boolean,
default() { default() {
return false; return false;
} },
} },
}, },
created() { created() {
this.init(); this.init();
@ -131,9 +186,13 @@ export default {
}, },
methods: { methods: {
init() { init() {
this.loading = getEnvironmentGroupPages(this.currentPage, this.pageSize, this.condition).then(res => { this.loading = getEnvironmentGroupPages(
this.currentPage,
this.pageSize,
this.condition
).then((res) => {
let data = res.data; let data = res.data;
let {listObject, itemCount} = data; let { listObject, itemCount } = data;
this.environmentGroupList = listObject; this.environmentGroupList = listObject;
this.total = itemCount; this.total = itemCount;
}); });
@ -147,7 +206,7 @@ export default {
}, },
deleteEnvironment(row) { deleteEnvironment(row) {
if (row.system) { if (row.system) {
this.$warning(this.$t('group.admin_not_allow_delete')); this.$warning(this.$t("group.admin_not_allow_delete"));
return; return;
} }
this.$refs.deleteConfirm.open(row); this.$refs.deleteConfirm.open(row);
@ -165,7 +224,7 @@ export default {
}, },
_handleDelete(row) { _handleDelete(row) {
delEnvironmentById(row.id).then(() => { delEnvironmentById(row.id).then(() => {
this.$success(this.$t('commons.delete_success')); this.$success(this.$t("commons.delete_success"));
this.init(); this.init();
}); });
}, },
@ -188,17 +247,15 @@ export default {
let param = { let param = {
id: row.id, id: row.id,
name: row.name, name: row.name,
workspaceId: row.workspaceId workspaceId: row.workspaceId,
}; };
modifyEnvironmentGroup(param).then(() => { modifyEnvironmentGroup(param).then(() => {
this.$success(this.$t("commons.modify_success")); this.$success(this.$t("commons.modify_success"));
this.init(); this.init();
}); });
} },
}, },
} };
</script> </script>
<style scoped> <style scoped></style>
</style>