test-version22
/
MeterSphere
mirror of https://gitee.com/fit2cloud-feizhiyun/MeterSphere.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: 自定义表头

This commit is contained in:
wenyann 2021-02-08 17:22:27 +08:00
parent 67a420e78e
commit 21b6481b8b
11 changed files with 498 additions and 480 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
backend/src/main/java/io/metersphere/base/mapper/SwaggerUrlProjectMapper.xml
View File

@ -27,8 +27,7 @@
</when>
<when test="criterion.listValue">
and ${criterion.condition}
<foreach close=")" collection="criterion.value" item="listItem" open="("
separator=",">
<foreach close=")" collection="criterion.value" item="listItem" open="(" separator=",">
#{listItem}
</foreach>
</when>
@ -57,8 +56,7 @@
</when>
<when test="criterion.listValue">
and ${criterion.condition}
<foreach close=")" collection="criterion.value" item="listItem" open="("
separator=",">
<foreach close=")" collection="criterion.value" item="listItem" open="(" separator=",">
#{listItem}
</foreach>
</when>

11
backend/src/main/java/io/metersphere/controller/SystemParameterController.java
View File

@ -1,8 +1,10 @@
package io.metersphere.controller;
import io.metersphere.base.domain.SystemParameter;
import io.metersphere.base.domain.UserHeader;
import io.metersphere.commons.constants.ParamConstants;
import io.metersphere.commons.constants.RoleConstants;
import io.metersphere.controller.request.HeaderRequest;
import io.metersphere.dto.BaseSystemConfigDTO;
import io.metersphere.ldap.domain.LdapInfo;
import io.metersphere.notice.domain.MailInfo;
@ -67,4 +69,13 @@ public class SystemParameterController {
return SystemParameterService.getLdapInfo(ParamConstants.Classify.LDAP.getValue());
}
@PostMapping("save/header")
public void saveHeader(@RequestBody UserHeader userHeader) {
SystemParameterService.saveHeader(userHeader);
}
@PostMapping("/header/info")
public UserHeader getHeaderInfo(@RequestBody HeaderRequest headerRequest) {
return SystemParameterService.queryUserHeader(headerRequest);
}
}

11
backend/src/main/java/io/metersphere/controller/request/HeaderRequest.java Normal file
View File

@ -0,0 +1,11 @@
package io.metersphere.controller.request;
import lombok.Getter;
import lombok.Setter;
@Getter
@Setter
public class HeaderRequest {
private String userId;
private String type;
}

19
backend/src/main/java/io/metersphere/service/SystemParameterService.java
View File

@ -2,12 +2,16 @@ package io.metersphere.service;
import io.metersphere.base.domain.SystemParameter;
import io.metersphere.base.domain.SystemParameterExample;
import io.metersphere.base.domain.UserHeader;
import io.metersphere.base.domain.UserHeaderExample;
import io.metersphere.base.mapper.SystemParameterMapper;
import io.metersphere.base.mapper.UserHeaderMapper;
import io.metersphere.base.mapper.ext.ExtSystemParameterMapper;
import io.metersphere.commons.constants.ParamConstants;
import io.metersphere.commons.exception.MSException;
import io.metersphere.commons.utils.EncryptUtils;
import io.metersphere.commons.utils.LogUtil;
import io.metersphere.controller.request.HeaderRequest;
import io.metersphere.dto.BaseSystemConfigDTO;
import io.metersphere.i18n.Translator;
import io.metersphere.ldap.domain.LdapInfo;
@ -29,7 +33,8 @@ import java.util.*;
@Service
@Transactional(rollbackFor = Exception.class)
public class SystemParameterService {
@Resource
private UserHeaderMapper userHeaderMapper;
@Resource
private SystemParameterMapper systemParameterMapper;
@Resource
@ -233,4 +238,16 @@ public class SystemParameterService {
example.clear();
});
}
//保存表头
public void saveHeader(UserHeader userHeader) {
userHeader.setId(UUID.randomUUID().toString());
userHeaderMapper.insert(userHeader);
}
public UserHeader queryUserHeader(HeaderRequest headerRequest) {
UserHeaderExample example = new UserHeaderExample();
example.createCriteria().andUserIdEqualTo(headerRequest.getUserId()).andTypeEqualTo(headerRequest.getType());
return userHeaderMapper.selectByExample(example).get(0);
}
}

10
backend/src/main/resources/db/migration/V74__user_header.sql Normal file
View File

@ -0,0 +1,10 @@
create table user_header
(
id varchar(50) not null,
user_id varchar(50) null,
props varchar(1000) null,
type varchar(150) null,
constraint user_header_pk
primary key (id)
) ENGINE = InnoDB
DEFAULT CHARSET = utf8mb4

1
backend/src/main/resources/generatorConfig.xml
View File

@ -66,6 +66,7 @@
<table tableName="auth_source"/>
<table tableName="swagger_url_project"/>
<table tableName="user_header"/>
<!--<table tableName="test_plan_api_scenario"/>-->
<!--<table tableName="test_plan"/>-->
<!--<table tableName="api_scenario_report"/>-->

64
frontend/src/business/components/common/head/HeaderCustom.vue Normal file
View File

@ -0,0 +1,64 @@
<template>
<el-dialog title="表头显示字段" :visible.sync="dialogTableVisible" :append-to-body="true">
<template>
<el-transfer
:titles="['待选字段', '已选字段']"
v-model="value"
:props="{
key: 'prop',
label: 'label'
}"
:data="optionalField"
></el-transfer>
</template>
<template v-slot:footer>
<ms-dialog-footer
@cancel="close"
@confirm="saveHeader"
/>
</template>
</el-dialog>
</template>
<script>
import MsDialogFooter from "@/business/components/common/components/MsDialogFooter";
import {getCurrentUser} from "@/common/js/utils";
import {TEST_CASE_LIST} from "@/common/js/constants";
export default {
name: "HeaderCustom",
components: {MsDialogFooter},
data() {
return {
dialogTableVisible: false,
optionalField: [],
value: [],
fieldSelected:[]
}
},
methods: {
open(items) {
console.log(items)
this.dialogTableVisible = true
this.optionalField = items
},
saveHeader() {
let param={
userId:getCurrentUser().id,
type:TEST_CASE_LIST,
props:JSON.stringify(this.value)
}
this.$post("/system/save/header",param,response=>{
this.$success(this.$t("commons.save_success"));
this.dialogTableVisible = false
})
},
close() {
}
}
}
</script>
<style scoped>
</style>

15
frontend/src/business/components/common/model/JsonData.js Normal file
View File

@ -0,0 +1,15 @@
import i18n from '../../../../i18n/i18n'
//自定义默认表头
export const Track_Test_Case=[
{prop: 'num', label: i18n.t('commons.id')},
{prop: 'name', label: i18n.t('commons.name')},
{prop: 'priority', label: i18n.t('test_track.case.priority')},
{prop: 'type', label: i18n.t('test_track.case.type')},
{prop: 'method', label: i18n.t('test_track.case.method')},
{prop: 'reviewStatus', label:i18n.t('test_track.case.status')},
{prop: 'tags', label: i18n.t('commons.tag')},
{prop: 'nodePath', label: i18n.t('test_track.case.module')},
{prop: 'updateTime', label: i18n.t('commons.update_time')},
{prop: 'operating', label: i18n.t('commons.operating')},
]

136
frontend/src/business/components/track/case/components/CustomHeader.vue
View File

@ -1,136 +0,0 @@
<template>
<el-dialog
title="表头显示字段"
:visible.sync="centerDialogVisible"
width="50%"
>
<el-divider style="margin-top: 0;margin-right: 10px"></el-divider>
<el-form :inline="true" :model="headerItem" class="demo-form-inline" type="selection">
<el-row :gutter="20">
<el-col :span="10">
<label>可选择字段可选择字段:{{ this.headerItem.optionalField.length }}</label>
<div class="grid-content bg-purple" style="margin-top: 25px">
<el-form-item>
<el-card class="box-card">
<div v-for="item in headerItem.optionalField" :key="item.prop" class="text item"
@click="selectItem(item)">
<input type="checkbox"/>
<label>{{ item.name }}</label>
</div>
</el-card>
</el-form-item>
</div>
</el-col>
<el-col :span="4">
<div class="grid-content bg-purple" style="margin-top: 160px">
<el-form-item>
<el-button size="medium" round @click="addItem">添加</el-button>
<!-- <i class="el-icon-arrow-right" @click="addItem"></i>-->
</el-form-item>
<el-form-item>
<el-button size="medium" round>移除</el-button>
<!-- <i class="el-icon-arrow-right" @click="addItem"></i>-->
</el-form-item>
</div>
</el-col>
<el-col :span="10">
<label>已选择字段</label>
<div class="grid-content bg-purple" style="margin-top: 25px">
<el-form-item>
<el-card class="box-card">
<div v-for="item in headerItem.fieldSelected" :key="item.prop" class="text item"
@click="moveItem(item)">
<el-checkbox v-model="checked1">{{ item.name }}</el-checkbox>
</div>
</el-card>
</el-form-item>
</div>
</el-col>
</el-row>
<el-form-item>
<el-button type="primary" style="margin-right: 0" @click="save('headerItem')">保存</el-button>
</el-form-item>
</el-form>
</el-dialog>
</template>
<script>
export default {
name: "CustomHeader",
data() {
return {
centerDialogVisible: false,
headerItem: {
optionalField: [
{prop: 'name', name: '名称'},
{prop: 'name', name: '名称'},
{prop: 'name', name: '名称'},
{prop: 'name', name: '名称'},
{prop: 'name', name: '名称'},
{prop: 'name', name: '名称'},
{prop: 'name', name: '名称'},
{prop: 'name', name: '名称'},
],
fieldSelected: []
},
selectItems: [],
checked1: false
};
},
methods: {
open() {
this.centerDialogVisible = true
},
selectItem(item) {
this.checked1 = !this.checked1
this.selectItems.push(item)
},
//移除
moveItem(item) {
this.headerItem.fieldSelected.remove(item)
},
//添加
addItem() {
console.log(this.selectItems)
this.headerItem.fieldSelected = this.selectItems
console.log(this.headerItem.fieldSelected)
},
save(headerItem) {
}
}
}
</script>
<style scoped>
.text {
font-size: 14px;
}
.item {
margin-bottom: 18px;
}
.clearfix:before,
.clearfix:after {
display: table;
content: "";
}
.clearfix:after {
clear: both
}
.box-card {
width: 250px;
height: 400px;
overflow: auto;
}
</style>

82
frontend/src/business/components/track/case/components/TestCaseList.vue
View File

@ -34,7 +34,6 @@
row-key="id"
class="test-content adjust-table ms-select-all-fixed"
ref="table" @row-click="handleEdit">
<el-table-column
width="50"
type="selection"/>
@ -50,16 +49,22 @@
<show-more-btn :is-show="scope.row.showMore" :buttons="buttons" :size="selectDataCounts"/>
</template>
</el-table-column>
<template v-for="(item, index) in tableLabel">
<el-table-column
v-if="item.prop == 'num'"
prop="num"
sortable="custom"
:label="$t('commons.id')"
:key="index"
show-overflow-tooltip>
</el-table-column>
<el-table-column
v-if="item.prop == 'name'"
prop="name"
:label="$t('commons.name')"
show-overflow-tooltip
:key="index"
>
<template v-slot:default="scope">
<!--<div @mouseover="showDetail(scope.row)">
@ -76,43 +81,51 @@
</template>
</el-table-column>
<el-table-column
v-if="item.prop == 'priority'"
prop="priority"
:filters="priorityFilters"
column-key="priority"
min-width="100px"
:label="$t('test_track.case.priority')"
show-overflow-tooltip>
show-overflow-tooltip
:key="index">
<template v-slot:default="scope">
<priority-table-item :value="scope.row.priority"/>
</template>
</el-table-column>
<el-table-column
v-if="item.prop == 'type'"
prop="type"
:filters="typeFilters"
column-key="type"
:label="$t('test_track.case.type')"
show-overflow-tooltip>
show-overflow-tooltip
:key="index">
<template v-slot:default="scope">
<type-table-item :value="scope.row.type"/>
</template>
</el-table-column>
<el-table-column
v-if="item.prop=='method'"
prop="method"
column-key="method"
:filters="methodFilters"
min-width="100px"
:label="$t('test_track.case.method')"
show-overflow-tooltip>
show-overflow-tooltip
:key="index">
<template v-slot:default="scope">
<method-table-item :value="scope.row.method"/>
</template>
</el-table-column>
<el-table-column
v-if="item.prop=='status'"
:filters="statusFilters"
column-key="status"
min-width="100px"
:label="$t('test_track.case.status')">
:label="$t('test_track.case.status')"
:key="index">
<template v-slot:default="scope">
<span class="el-dropdown-link">
<review-status :value="scope.row.reviewStatus"/>
@ -120,7 +133,7 @@
</template>
</el-table-column>
<el-table-column prop="tags" :label="$t('commons.tag')">
<el-table-column v-if="item.prop=='tags'" prop="tags" :label="$t('commons.tag')" :key="index">
<template v-slot:default="scope">
<div v-for="(itemName,index) in scope.row.tags" :key="index">
<ms-tag type="success" effect="plain" :content="itemName"/>
@ -129,25 +142,27 @@
</el-table-column>
<el-table-column
v-if="item.prop=='nodePath'"
prop="nodePath"
:label="$t('test_track.case.module')"
min-width="150px"
show-overflow-tooltip>
show-overflow-tooltip
:key="index">
</el-table-column>
<el-table-column
v-if="item.prop=='updateTime'"
prop="updateTime"
sortable="custom"
:label="$t('commons.update_time')"
min-width="150px"
show-overflow-tooltip>
show-overflow-tooltip
:key="index">
<template v-slot:default="scope">
<span>{{ scope.row.updateTime | timestampFormatDate }}</span>
</template>
</el-table-column>
<el-table-column fixed="right"
:label="$t('commons.operating')" min-width="150">
<el-table-column fixed="right" min-width="150">
<el-table-column v-if="item.prop=='operating'" fixed="right" min-width="150" :key="index">
<template slot="header">
<span>{{ $t('commons.operating') }}
<i class='el-icon-setting' style="color:#7834c1; margin-left:10px" @click="customHeader"> </i>
@ -164,12 +179,11 @@
</ms-table-operator>
</template>
</el-table-column>
</el-table>
<custom-header ref="customHeader"/>
</template>
<header-custom ref="headerCustom"></header-custom>
<ms-table-pagination :change="initTableData" :current-page.sync="currentPage" :page-size.sync="pageSize"
:total="total"/>
</el-table>
</el-card>
<batch-edit ref="batchEdit" @batchEdit="batchEdit"
@ -198,12 +212,12 @@ import MsTableButton from "../../../common/components/MsTableButton";
import {TEST_CASE_CONFIGS} from "../../../common/components/search/search-components";
import ShowMoreBtn from "./ShowMoreBtn";
import BatchEdit from "./BatchEdit";
import {WORKSPACE_ID} from "@/common/js/constants";
import {TEST_CASE_LIST, WORKSPACE_ID} from "@/common/js/constants";
import {LIST_CHANGE, TrackEvent} from "@/business/components/common/head/ListEvent";
import StatusTableItem from "@/business/components/track/common/tableItems/planview/StatusTableItem";
import TestCaseDetail from "./TestCaseDetail";
import ReviewStatus from "@/business/components/track/case/components/ReviewStatus";
import {getCurrentProjectID} from "../../../../../common/js/utils";
import {getCurrentProjectID, getCurrentUser} from "../../../../../common/js/utils";
import MsTag from "@/business/components/common/components/MsTag";
import {
_filter,
@ -215,12 +229,13 @@ import {
toggleAllSelection
} from "@/common/js/tableUtils";
import BatchMove from "./BatchMove";
import CustomHeader from "@/business/components/track/case/components/CustomHeader";
import {Track_Test_Case} from "@/business/components/common/model/JsonData";
import HeaderCustom from "@/business/components/common/head/HeaderCustom";
export default {
name: "TestCaseList",
components: {
CustomHeader,
HeaderCustom,
BatchMove,
MsTableHeaderSelectPopover,
MsTableButton,
@ -244,11 +259,8 @@ export default {
},
data() {
return {
cols: [{label: "id", prop: "num"},
{label: "名称", prop: "name"},
{label: "级别", prop: "priority"},
{label: "类型", prop: "type"},
{label: "测试方式", prop: "method"}],
// 子组件的表头数据
tableLabel:Track_Test_Case,
result: {},
deletePath: "/test/case/delete",
condition: {
@ -347,10 +359,9 @@ export default {
},
methods: {
customHeader() {
this.$refs.customHeader.open()
this.$refs.headerCustom.open(this.tableLabel)
},
initTableData() {
this.projectId = getCurrentProjectID();
this.condition.planId = "";
this.condition.nodeIds = [];
@ -365,8 +376,23 @@ export default {
// param.nodeIds = this.selectNodeIds;
this.condition.nodeIds = this.selectNodeIds;
}
this.getLabel()
this.getData();
},
getLabel(){
let param={}
param.userId=getCurrentUser().id;
param.type=TEST_CASE_LIST
this.result=this.$post('/system/header/info',param,response=>{
console.log(response.data)
/*if(response.data){
this.tableLabel=response.data.props
}else{
this.tableLabel=Track_Test_Case
}*/
})
},
getData() {
if (this.projectId) {
this.condition.projectId = this.projectId;
@ -576,9 +602,9 @@ export default {
this.selectDataCounts = getSelectDataCounts(this.condition, this.total, this.selectRows);
toggleAllSelection(this.$refs.table, this.tableData, this.selectRows);
},
headerDragend(newWidth,oldWidth,column,event){
headerDragend(newWidth, oldWidth, column, event) {
let finalWidth = newWidth;
if(column.minWidth>finalWidth){
if (column.minWidth > finalWidth) {
finalWidth = column.minWidth;
}
column.width = finalWidth;

1
frontend/src/common/js/constants.js
View File

@ -1,3 +1,4 @@
export const TEST_CASE_LIST='test_case_list'
export const TokenKey = 'Admin-Token';
export const LicenseKey = 'License';
export const DEFAULT_LANGUAGE = 'default_language';