You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

407 lines
12 KiB

<template>
<section class="padding">
<el-row class="padding-bottom">
<span>报告概览</span>
</el-row>
<el-row ref="table">
<el-row class="box">
<el-col :span="6" class="box-red">
<div class="box-info">
<div class="num">{{xmTestPlan.totalCases?xmTestPlan.totalCases:'0'}}</div>
<div class="label">用例数</div>
</div>
</el-col>
<el-col :span="6" class="box-blue">
<div class="box-info">
<div class="num">{{caseFuGaiLv}}%</div>
<div class="label">用例覆盖率</div>
</div>
</el-col>
<el-col :span="6" class="box-green">
<div class="box-info">
<div class="num">{{caseTongGuoLv}}%</div>
<div class="label">用例通过率</div>
</div>
</el-col>
<el-col :span="6" class="box-orange">
<div class="box-info">
<div class="num">{{xmTestPlan.bugCnt?xmTestPlan.bugCnt:0}}</div>
<div class="label">缺陷数</div>
</div>
</el-col>
</el-row>
<!--编辑界面 XmTestPlan 测试计划-->
<el-form :model="rawDatas" label-width="120px" :rules="rawDatasRules" ref="rawDatasRef" label-position="left">
<el-form-item prop="name" label-width="0px">
<el-row class="padding-bottom">
<my-input v-model="rawDatas.name" placeholder="计划名称" :maxlength="255" @change="editSomeFields(rawDatas,'name',$event)"></my-input>
</el-row>
</el-form-item>
<el-row class="padding">
<el-col :span="8">
<mdp-select-user-xm label="负责人" userid-key="cuserid" username-key="cusername" v-model="rawDatas" @change="editSomeFields(rawDatas,'cuserid',$event)"></mdp-select-user-xm>
</el-col>
<el-col :span="8">
<mdp-select-dict-x label="状态" :dict="dicts['testPlanStatus']" v-model="rawDatas.status" @change="editSomeFields(rawDatas,'status',$event)"></mdp-select-dict-x>
</el-col>
<el-col :span="8">
<mdp-select-dict-x label="测试结果" :dict="dicts['testPlanTcode']" v-model="rawDatas.tcode" @change="editSomeFields(rawDatas,'tcode',$event)"></mdp-select-dict-x>
</el-col>
</el-row>
<el-form-item label="归属测试库" prop="casedbName">
{{rawDatas.casedbName}}
</el-form-item>
<el-form-item label="归属项目" prop="projectId">
<span v-if="opType=='add'">
<xm-project-select v-if="!selProject || !selProject.id" ref="xmProjectSelect" :link-product-id="xmTestCasedb? xmTestCasedb.productId:null" @row-click="onPorjectConfirm" :auto-select="false">
<span slot="title">选择项目</span>
</xm-project-select>
<div v-else>{{rawDatas.projectName}}</div>
</span>
<div v-else>{{rawDatas.projectName}}</div>
</el-form-item>
<el-form-item label="归属产品" prop="productName">
{{rawDatas.productName}}
</el-form-item>
<el-form-item label="起止时间" prop="stime">
<mdp-date-range :auto-default="false" placeholder="选择日期" v-model="rawDatas" start-key="stime" end-key="etime" value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd" @change="editSomeFields(rawDatas,'stime',rawDatas)"></mdp-date-range>
</el-form-item>
</el-form>
</el-row>
<el-row class="padding-bottom">
<span>报告总结</span>
</el-row>
<el-row>
<el-input type="textarea" :rows="8" v-model="rawDatas.summaryRemark"></el-input>
</el-row>
<el-row v-if="rawDatas.summaryRemark!==rawDatasBak.summaryRemark" >
<span style="float:right;">
<el-button type="primary" @click.native="editSomeFields(rawDatas,'summaryRemark',rawDatas.summaryRemark)">提交</el-button>
</span>
</el-row>
</section>
</template>
<script>
import util from '@/common/js/util';//全局公共库
import config from "@/common/config"; //全局公共库import
import { initDicts, addXmTestPlan,editXmTestPlan,editSomeFieldsXmTestPlan } from '@/api/xm/core/xmTestPlan';
import { mapGetters } from 'vuex'
import XmProjectSelect from '@/views/xm/core/components/XmProjectSelect';
import MdpSelectUserXm from '@/views/xm/core/components/MdpSelectUserXm';//修改界面
export default {
name:'xmTestPlanEdit',
components: {
XmProjectSelect,MdpSelectUserXm,
},
computed: {
...mapGetters([ 'userInfo' ]),
caseFuGaiLv(){
if(!this.xmTestPlan.totalCases){
return 0
}
var okCases=parseInt(this.xmTestPlan.okCases>0?this.xmTestPlan.okCases:0)
var errCases=parseInt(this.xmTestPlan.errCases>0?this.xmTestPlan.errCases:0)
var igCases=parseInt(this.xmTestPlan.igCases>0?this.xmTestPlan.igCases:0)
var blCases=parseInt(this.xmTestPlan.blCases>0?this.xmTestPlan.blCases:0)
var totalExecs=okCases+errCases+igCases+blCases
var rate=parseInt(totalExecs/this.xmTestPlan.totalCases*100)
return rate;
},
caseTongGuoLv(){
if(!this.xmTestPlan.totalCases){
return 0
}
var okCases=parseInt(this.xmTestPlan.okCases>0?this.xmTestPlan.okCases:0)
var errCases=parseInt(this.xmTestPlan.errCases>0?this.xmTestPlan.errCases:0)
var igCases=parseInt(this.xmTestPlan.igCases>0?this.xmTestPlan.igCases:0)
var blCases=parseInt(this.xmTestPlan.blCases>0?this.xmTestPlan.blCases:0)
var totalExecs=okCases+igCases
var rate=parseInt(totalExecs/this.xmTestPlan.totalCases*100)
return rate;
}
},
props:['xmTestPlan','visible','opType','selProject','xmTestCasedb','rptDatas'],
watch: {
'xmTestPlan':function( xmTestPlan ) {
if(xmTestPlan){
this.rawDatas = {...xmTestPlan};
}
},
'visible':function(visible) {
if(visible==true){
this.initData()
}
}
},
data() {
return {
currOpType:'add',//add/edit
load:{ list: false, edit: false, del: false, add: false },//查询中...
dicts:{
testPlanStatus:[],
testPlanTcode:[],
},//下拉选择框的所有静态数据 params={categoryId:'all',itemCodes:['sex']} 返回结果 {sex: [{id:'1',name:'男'},{id:'2',name:'女'}]}
rawDatasRules: {
},
rawDatas: {
id:'',name:'',casedbId:'',casedbName:'',projectId:'',projectName:'',cuserid:'',cusername:'',ctime:'',stime:'',etime:'',status:'',tcode:'',totalCases:'',okCases:'',errCases:'',igCases:'',blCases:'',productId:'',productName:'',flowState:'',summaryRemark:''
},
rawDatasBak: {
id:'',name:'',casedbId:'',casedbName:'',projectId:'',projectName:'',cuserid:'',cusername:'',ctime:'',stime:'',etime:'',status:'',tcode:'',totalCases:'',okCases:'',errCases:'',igCases:'',blCases:'',productId:'',productName:'',flowState:'',summaryRemark:''
},
maxTableHeight:300,
summaryRemarkEditVisible:false,
}//end return
},//end data
methods: {
...util,
// 取消按钮点击 父组件监听@cancel="rawDatasVisible=false" 监听
handleCancel:function(){
this.$refs['rawDatasRef'].resetFields();
this.$emit('cancel');
},
//新增、编辑提交XmTestPlan 测试计划父组件监听@submit="afterEditSubmit"
saveSubmit: function () {
this.$refs.rawDatasRef.validate((valid) => {
if (valid) {
this.$confirm('确认提交吗?', '提示', {}).then(() => {
this.load.edit=true
let params = Object.assign({}, this.rawDatas);
var func=addXmTestPlan
if(this.currOpType=='edit'){
func=editXmTestPlan
}
func(params).then((res) => {
this.load.edit=false
var tips=res.data.tips;
if(tips.isOk){
this.rawDatas=res.data.data
this.initData()
this.currOpType="edit";
this.$emit('submit');// @submit="afterAddSubmit"
}
this.$notify({ position:'bottom-left',showClose:true, message: tips.msg, type: tips.isOk?'success':'error' });
}).catch( err =>this.load.edit=false);
});
}else{
this.$notify({ showClose:true, message: "表单验证不通过,请修改表单数据再提交", type: 'error' });
}
});
},
initData: function(){
if(this.xmTestPlan){
this.rawDatas = Object.assign({},this.xmTestPlan);
}
if(this.rptDatas){
this.rawDatas=Object.assign({},this.rptDatas)
}
this.rawDatasBak={...this.rawDatas}
},
editSomeFields(row,fieldName,$event){
if(this.opType=='add'){
return;
}
let params={};
params['ids']=[row].map(i=>i.id)
if(fieldName=='stime'){
params[fieldName]=$event.stime
params.etime=$event.etime
}else if(fieldName=='cuserid'){
params[fieldName]=$event[0].userid
params.cusername=$event[0].username
}else{
params[fieldName]=$event
}
var func = editSomeFieldsXmTestPlan
func(params).then(res=>{
let tips = res.data.tips;
if(tips.isOk){
this.rawDatasBak=[...this.rawDatas]
this.$emit('edit-fields',params)
}else{
Object.assign(this.rawDatas,this.rawDatasBak)
this.$notify({position:'bottom-left',showClose:true,message:tips.msg,type:tips.isOk?'success':'error'})
}
}).catch((e)=>Object.assign(this.rawDatas,this.rawDatasBak))
},
onPorjectConfirm(row){
this.rawDatas.projectId=row.id
this.rawDatas.projectName=row.name
this.rawDatas.name=this.rawDatas.projectName+'-测试计划-V1.0'
},
sizeAutoChange(){
}
},//end method
mounted() {
this.$nextTick(() => {
initDicts(this);
this.initData()
this.maxTableHeight = util.calcTableMaxHeight(this.$refs.table.$el)
});
}
}
</script>
<style lang="scss" scoped>
.box{
.box-red{
background-color: #ff75750d;
height: 100px;
border-left-width: 2px;
border-left-color: red;
border-left-style: solid;
align-items: center;
line-height: 100px;
text-align: center;
display:flex;
flex-direction: column;
.box-info{
display:flex;
flex-direction: column;
margin-top: 20px;
height: 100px;
line-height: 100px;
.label{
color: #999;
height: 30px;
line-height: 30px;
font-size: 0.875rem;
}
.num{
height: 30px;
line-height: 30px;
color:red ;
font-size: 30px;
}
}
}
.box-green{
background-color: #73d8970d;;
height: 100px;
border-left-width: 2px;
border-left-color: green;
border-left-style: solid;
align-items: center;
line-height: 100px;
text-align: center;
display:flex;
flex-direction: column;
.box-info{
display:flex;
flex-direction: column;
margin-top: 20px;
height: 100px;
line-height: 100px;
.label{
color: #999;
height: 30px;
line-height: 30px;
font-size: 0.875rem;
}
.num{
height: 30px;
line-height: 30px;
color:green ;
font-size: 30px;
}
}
}
.box-blue{
background-color: #5dcfff0d;
height: 100px;
border-left-width: 2px;
border-left-color: blue;
border-left-style: solid;
align-items: center;
line-height: 100px;
text-align: center;
display:flex;
flex-direction: column;
.box-info{
display:flex;
flex-direction: column;
margin-top: 20px;
height: 100px;
line-height: 100px;
.label{
color: #999;
height: 30px;
line-height: 30px;
font-size: 0.875rem;
}
.num{
height: 30px;
line-height: 30px;
color:blue ;
font-size: 30px;
}
}
}
.box-orange{
background-color: #ffcd5d0d;
height: 100px;
border-left-width: 2px;
border-left-color: orange;
border-left-style: solid;
align-items: center;
line-height: 100px;
text-align: center;
display:flex;
flex-direction: column;
.box-info{
display:flex;
flex-direction: column;
margin-top: 20px;
height: 100px;
line-height: 100px;
.label{
color: #999;
height: 30px;
line-height: 30px;
font-size: 0.875rem;
}
.num{
height: 30px;
line-height: 30px;
color:orange ;
font-size: 30px;
}
}
}
box-font{
font-size: 0.875rem;
}
}
</style>