陈裕财
5 years ago
3 changed files with 829 additions and 2 deletions
-
3src/views/xm/core/xmIteration/XmIterationInfo.vue
-
699src/views/xm/core/xmIteration/XmIterationOverview.vue
-
129src/views/xm/core/xmIteration/XmIterationOverviewComplex.vue
@ -0,0 +1,699 @@ |
|||
<template> |
|||
<section class="page-container padding"> |
|||
<!-- <el-row class="page-header page-height-10"> |
|||
<el-col :xs="22" :sm="22" :md="23" :lg="23" :xl="23"> |
|||
<span >项目总览</span> |
|||
</el-col> |
|||
</el-row>--> |
|||
<el-row class="page-main page-height-75" style="overflow-x: hidden;"> |
|||
<el-row :gutter="10" style="margin-bottom:10px"> |
|||
<el-col :span="8" > |
|||
<el-card class="box-card" style="padding:0px ;height:425px"> |
|||
<div slot="header" class="clearfix"> |
|||
<span>项目信息</span> |
|||
</div> |
|||
<el-row style="margin-bottom:18px"> |
|||
<el-row> |
|||
<span v-text="taskMng"></span> |
|||
</el-row> |
|||
<el-row> |
|||
<span>项目负责人</span> |
|||
</el-row> |
|||
</el-row> |
|||
<el-row style="margin-bottom:18px"> |
|||
<el-col :span="8" @click=""> |
|||
<div class="item"> |
|||
<div class="icon" style="background-color: rgb(79, 140, 255);"> |
|||
<i class="el-icon-right"></i> |
|||
</div> |
|||
<div class="info"> |
|||
<div v-text="totalTask"></div> |
|||
<div class="title">总任务量</div> |
|||
</div> |
|||
</div> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div class="item"> |
|||
<div class="icon" style="background-color: rgb(255, 153, 51);"> |
|||
<i class="el-icon-loading"></i> |
|||
</div> |
|||
<div class="info"> |
|||
<div v-text="notStart"> |
|||
</div> |
|||
<div class="title">待完成</div> |
|||
</div> |
|||
</div> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div class="item"> |
|||
<div class="icon" style="background-color: rgb(0, 153, 51);"> |
|||
<i class="el-icon-check"></i> |
|||
</div> |
|||
<div class="info"> |
|||
<div v-text="finish" > |
|||
</div> |
|||
<div class="title">已完成</div> |
|||
</div> |
|||
</div> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row style="margin-bottom:18px"> |
|||
<div class="item"> |
|||
<div class="icon2" style="background-color: rgb(204, 204, 204);"> |
|||
<i class="el-icon-date"></i> |
|||
</div> |
|||
<div class="info"> |
|||
<div v-text="taskStartTime+'~'+taskEndTime"> |
|||
</div> |
|||
<div class="title">项目计划周期</div> |
|||
</div> |
|||
</div> |
|||
</el-row> |
|||
<el-row style="margin-bottom:18px"> |
|||
<div class="item"> |
|||
<div class="icon2" style="background-color: rgb(204, 204, 204);"> |
|||
<i class="el-icon-star-off"></i> |
|||
</div> |
|||
<div class="info"> |
|||
<div class="title"> 需求数： {{this.xmProjectState.menuCnt}}</div> |
|||
</div> |
|||
</div> |
|||
</el-row> |
|||
<el-row style="margin-bottom:18px"> |
|||
<div class="item"> |
|||
<div class="icon2" style="background-color: rgb(204, 204, 204);"> |
|||
<i class="el-icon-refresh"></i> |
|||
</div> |
|||
<div class="info"> |
|||
<div class="title"> 迭代数： {{(this.xmProjectState.iterationCnt==null?0:this.xmProjectState.iterationCnt)}} </div> |
|||
</div> |
|||
</div> |
|||
</el-row> |
|||
<el-row style="margin-bottom:18px"> |
|||
<div class="item"> |
|||
<div class="icon2" style="background-color: rgb(204, 204, 204);"> |
|||
<i class="el-icon-alarm-clock"></i> |
|||
</div> |
|||
<div> |
|||
<div class="info"> |
|||
<el-progress v-if="progress1" :percentage="progress1"></el-progress> |
|||
</div> |
|||
<div class="title">任务进度</div> |
|||
</div> |
|||
</div> |
|||
</el-row> |
|||
</el-card> |
|||
</el-col> |
|||
<el-col :span="8" > |
|||
<el-card class="box-card" style="height:425px"> |
|||
<div slot="header" class="clearfix"> |
|||
<span>所有工作项及其完成情况</span> |
|||
</div> |
|||
<div> |
|||
<div id="allChart" :style="{width: '425px', height: '350px'}"></div> |
|||
</div> |
|||
</el-card> |
|||
</el-col> |
|||
<el-col :span="8" > |
|||
<el-card class="box-card" style="height:425px"> |
|||
<div slot="header" class="clearfix"> |
|||
<span>缺陷情况</span> |
|||
</div> |
|||
<div> |
|||
<div id="bugPieChart" :style="{width: '440px', height: '400px'}"></div> |
|||
</div> |
|||
</el-card> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row :gutter="10" style="margin-bottom:10px"> |
|||
<el-col :span="12" > |
|||
<el-card class="box-card" style="padding:0px ;height:425px"> |
|||
<div slot="header" class="clearfix"> |
|||
<span>任务每日状态趋势</span> |
|||
</div> |
|||
<div> |
|||
<div id="taskChart" :style="{width: '630px', height: '320px'}"></div> |
|||
</div> |
|||
</el-card> |
|||
</el-col> |
|||
<el-col :span="12" > |
|||
<el-card class="box-card" style="padding:0px ;height:425px"> |
|||
<div slot="header" class="clearfix"> |
|||
<span>项目工时</span> |
|||
</div> |
|||
<div> |
|||
<el-row style="padding:25px;"> |
|||
<div class="item"> |
|||
<el-col :span="8"> |
|||
<div> |
|||
<div style="text-align:center;"> |
|||
<span style="font-size:24px;" v-text="this.xmProjectState.totalPlanWorkload"></span> |
|||
<span style="font-size:5px;">h</span> |
|||
</div> |
|||
<div style="text-align:center;font-size:5px;">预估工时</div> |
|||
</div> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div> |
|||
<div style="text-align:center;"> |
|||
<span style="font-size:24px;" v-text="this.xmProjectState.totalActWorkload"></span> |
|||
<span style="font-size:5px;">h</span> |
|||
</div> |
|||
<div style="text-align:center;font-size:5px;">登记工时</div> |
|||
</div> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div> |
|||
<div style="text-align:center;"> |
|||
<span style="font-size:24px;" v-text="workloadProgress"></span> |
|||
<span style="font-size:5px;">%</span> |
|||
</div> |
|||
<div style="text-align:center;font-size:5px;">工时进度</div> |
|||
</div> |
|||
</el-col> |
|||
</div> |
|||
</el-row> |
|||
<el-row style="padding:25px;"> |
|||
<div class="item"> |
|||
<el-col :span="8"> |
|||
<div> |
|||
<div style="text-align:center;"> |
|||
<span style="font-size:24px;" v-text="remainWorkload"></span> |
|||
<span style="font-size:5px;">h</span> |
|||
</div> |
|||
<div style="text-align:center;font-size:5px;">剩余工时</div> |
|||
</div> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div> |
|||
<div style="text-align:center;"> |
|||
<span style="font-size:24px;" v-text="deviation"></span> |
|||
<span style="font-size:5px;">h</span> |
|||
</div> |
|||
<div style="text-align:center;font-size:5px;">预估偏差</div> |
|||
</div> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div> |
|||
<div style="text-align:center;"> |
|||
<span style="font-size:24px;" v-text="deviationRate"></span> |
|||
<span style="font-size:5px;">%</span> |
|||
</div> |
|||
<div style="text-align:center;font-size:5px;">预估偏差率</div> |
|||
</div> |
|||
</el-col> |
|||
</div> |
|||
</el-row> |
|||
<el-row> |
|||
<span style="margin-left:20px;">项目预计进度</span> |
|||
<el-progress style="width: 600px;margin-left:20px;margin-top: 10px;margin-bottom: 20px;" :text-inside="true" :stroke-width="24" :percentage="planProgress"></el-progress> |
|||
</el-row> |
|||
<el-row> |
|||
<span style="margin-left:20px;">项目实际进度</span> |
|||
<el-progress style="width: 600px;margin-left:20px;margin-top: 10px;" :text-inside="true" :stroke-width="24" :percentage="realProgress"></el-progress> |
|||
</el-row> |
|||
|
|||
</div> |
|||
</el-card> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row style="margin-bottom:10px"> |
|||
<el-card class="box-card" style="padding:0px ;height:200px"> |
|||
<div slot="header" class="clearfix" style="margin-bottom:10px"> |
|||
<span>项目阶段</span> |
|||
</div> |
|||
<div> |
|||
<el-row style="padding:10px"> |
|||
<el-steps :active="calcProjectStatusStep" finish-status="success"> |
|||
<el-step v-for="(i,index) in options['projectStatus']" :title="i.optionName" :key="index"> |
|||
<el-row slot="title" @click.native.stop="editForm.status=i.optionValue"> |
|||
{{i.optionName}} |
|||
</el-row> |
|||
</el-step> |
|||
</el-steps> |
|||
</el-row> |
|||
</div> |
|||
</el-card> |
|||
</el-row> |
|||
</el-row> |
|||
|
|||
</section> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from "@/common/js/util"; // 全局公共库 |
|||
//import Sticky from "@/components/Sticky"; // 粘性header组件 |
|||
import { mapGetters } from "vuex"; |
|||
import { listXmProjectState } from '@/api/xm/core/xmProjectState'; |
|||
import { listOption } from '@/api/mdp/meta/itemOption';//下拉框数据查询 |
|||
|
|||
|
|||
export default { |
|||
computed: { |
|||
...mapGetters(["userInfo"]), |
|||
finish: function (){ |
|||
return this.xmProjectState.totalCompleteTaskCnt; |
|||
}, |
|||
notStart: function() { |
|||
return this.xmProjectState.totalTaskCnt-this.xmProjectState.totalCompleteTaskCnt; |
|||
}, |
|||
totalTask: function() { |
|||
return this.xmProjectState.totalTaskCnt; |
|||
}, |
|||
progress1: function (){ |
|||
return Math.round(this.xmProjectState.totalCompleteTaskCnt/this.xmProjectState.totalTaskCnt*100); |
|||
}, |
|||
taskStartTime: function (){ |
|||
return this.selProject.startTime.substring(0,10); |
|||
}, |
|||
taskEndTime: function (){ |
|||
return this.selProject.endTime.substring(0,10); |
|||
}, |
|||
taskMng: function (){ |
|||
return this.selProject.createUsername; |
|||
}, |
|||
workloadProgress:function (){ |
|||
return Math.round(this.xmProjectState.totalActWorkload/this.xmProjectState.totalPlanWorkload*100); |
|||
}, |
|||
deviation:function (){ |
|||
let now = new Date(); |
|||
let taskStartTime = new Date(this.selProject.startTime); |
|||
let taskEndTime = new Date(this.selProject.endTime); |
|||
if(now<=taskEndTime){ |
|||
let allDays=taskEndTime-taskStartTime; |
|||
return this.xmProjectState.totalActWorkload - Math.round((now-taskStartTime)/allDays*this.xmProjectState.totalPlanWorkload) |
|||
}else{ |
|||
return this.xmProjectState.totalActWorkload - this.xmProjectState.totalPlanWorkload; |
|||
} |
|||
}, |
|||
deviationRate:function (){ |
|||
return Math.round(this.deviation/this.xmProjectState.totalPlanWorkload*100); |
|||
}, |
|||
remainWorkload:function (){ |
|||
return this.xmProjectState.totalPlanWorkload - this.xmProjectState.totalActWorkload; |
|||
}, |
|||
planProgress:function (){ |
|||
let now = new Date(); |
|||
let taskStartTime = new Date(this.selProject.startTime); |
|||
let taskEndTime = new Date(this.selProject.endTime); |
|||
if(now<=taskEndTime){ |
|||
let allDays=taskEndTime-taskStartTime; |
|||
return Math.round((now-taskStartTime)/allDays*100) |
|||
}else{ |
|||
return 100; |
|||
} |
|||
}, |
|||
realProgress:function (){ |
|||
if(this.xmProjectState.totalActWorkload < this.xmProjectState.totalPlanWorkload){ |
|||
return Math.round(this.xmProjectState.totalActWorkload/this.xmProjectState.totalPlanWorkload*100) |
|||
}else{ |
|||
return 100; |
|||
} |
|||
}, |
|||
xmProjectStateCpd(){ |
|||
return this.xmProjectState |
|||
}, |
|||
calcProjectStatusStep(){ |
|||
if(this.options['projectStatus'] && this.selProject){ |
|||
var index=this.options['projectStatus'].findIndex(i=>{ |
|||
if(i.optionValue==this.selProject.status){ |
|||
return true; |
|||
}else{ |
|||
return false; |
|||
} |
|||
}) |
|||
return index+1; |
|||
}else{ |
|||
return 0; |
|||
} |
|||
} |
|||
|
|||
}, |
|||
|
|||
props:['selProject'], |
|||
watch:{ |
|||
xmProjectStateCpd:function(){ |
|||
this.drawAllBar(); |
|||
this.drawTaskByDate(); |
|||
this.drawPieBug(); |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
isActive: true, |
|||
load:{ list: false}, |
|||
xmProjectState: [],//查询结果 |
|||
options:{ |
|||
projectType:[], |
|||
urgencyLevel:[], |
|||
priority:[], |
|||
projectStatus:[], |
|||
},//下拉选择框的所有静态数据 params=[{categoryId:'0001',itemCode:'sex'}] 返回结果 {'sex':[{optionValue:'1',optionName:'男',seqOrder:'1',fp:'',isDefault:'0'},{optionValue:'2',optionName:'女',seqOrder:'2',fp:'',isDefault:'0'}]} |
|||
}; |
|||
}, |
|||
|
|||
methods:{ |
|||
//获取对应的xmProjectsTate |
|||
getXmProjectState(){ |
|||
let params = { |
|||
projectId:this.selProject.id, |
|||
branchId:this.userInfo.branchId |
|||
}; |
|||
this.load.list = true; |
|||
listXmProjectState(params).then((res) => { |
|||
let tips=res.data.tips; |
|||
if(tips.isOk){ |
|||
this.xmProjectState = res.data.data[0]; |
|||
}else{ |
|||
this.$message({showClose: true, message: tips.msg, type: 'error' }); |
|||
} |
|||
this.load.list = false; |
|||
}).catch( err => this.load.list = false ); |
|||
}, |
|||
|
|||
drawAllBar() { |
|||
// 基于准备好的dom，初始化echarts实例 |
|||
let allChart = this.$echarts.init(document.getElementById("allChart")); |
|||
let option = { |
|||
tooltip: { |
|||
trigger: 'axis', |
|||
axisPointer: { |
|||
type: 'shadow' |
|||
} |
|||
}, |
|||
grid: { |
|||
left: '3%', |
|||
right: '4%', |
|||
bottom: '10%', |
|||
containLabel: true |
|||
}, |
|||
yAxis: { |
|||
type: 'value' |
|||
}, |
|||
xAxis: { |
|||
type: 'category', |
|||
data: ['需求', '任务', '缺陷'] |
|||
}, |
|||
series: [ |
|||
{ |
|||
data: [ |
|||
{ |
|||
value: this.xmProjectState.menuCnt, |
|||
itemStyle: { |
|||
normal:{ |
|||
color: '#99CCFF' |
|||
} |
|||
} |
|||
}, |
|||
{ |
|||
value: this.xmProjectState.totalTaskCnt, |
|||
itemStyle: { |
|||
normal:{ |
|||
color: '#99CCFF' |
|||
} |
|||
} |
|||
}, |
|||
{ |
|||
value: this.xmProjectState.totalBugCnt, |
|||
itemStyle: { |
|||
normal:{ |
|||
color: '#99CCFF' |
|||
} |
|||
} |
|||
}, |
|||
], |
|||
type: 'bar' |
|||
} |
|||
] |
|||
}; |
|||
|
|||
// 绘制图表 |
|||
allChart.setOption(option); |
|||
}, |
|||
drawTaskByDate() { |
|||
let taskChart = this.$echarts.init(document.getElementById("taskChart")); |
|||
let option = { |
|||
tooltip: { |
|||
trigger: 'axis' |
|||
}, |
|||
color:['rgb(0, 153, 255)','#6699CC'], |
|||
legend: { |
|||
data: ['未开始', '进行中'] |
|||
}, |
|||
grid: { |
|||
left: '1%', |
|||
right: '3%', |
|||
bottom: '5%', |
|||
containLabel: true |
|||
}, |
|||
toolbox: { |
|||
feature: { |
|||
saveAsImage: {} |
|||
} |
|||
}, |
|||
xAxis: { |
|||
type: 'category', |
|||
boundaryGap: false, |
|||
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'] |
|||
}, |
|||
yAxis: { |
|||
type: 'value' |
|||
}, |
|||
series: [ |
|||
{ |
|||
name: '未开始', |
|||
type: 'line', |
|||
//stack: '总量', |
|||
data: [120, 132, 101, 134, 90, 230, 210], |
|||
areaStyle: { |
|||
normal:{ |
|||
color:"rgb(153, 204, 255)" , //设置折线图颜色 |
|||
} |
|||
}, |
|||
lineStyle:{ |
|||
normal:{ |
|||
color:'rgb(0, 153, 255)' |
|||
} |
|||
}, |
|||
}, |
|||
{ |
|||
name: '进行中', |
|||
type: 'line', |
|||
//stack: '总量', |
|||
data: [220, 182, 191, 234, 290, 330, 310], |
|||
areaStyle: { |
|||
normal:{ |
|||
color:"rgb(153, 204, 255)", //设置折线图颜色 |
|||
} |
|||
}, |
|||
lineStyle:{ |
|||
normal:{ |
|||
color:'#6699CC' |
|||
} |
|||
}, |
|||
}, |
|||
], |
|||
}; |
|||
|
|||
// 绘制图表 |
|||
taskChart.setOption(option); |
|||
}, |
|||
drawPieBug() { |
|||
let bugPieChart = this.$echarts.init(document.getElementById("bugPieChart")); |
|||
let option = { |
|||
tooltip: { |
|||
trigger: 'item', |
|||
formatter: '{b} : {c} ({d}%)' |
|||
}, |
|||
legend: { |
|||
orient: 'vertical', |
|||
left: 'left', |
|||
}, |
|||
series: [ |
|||
{ |
|||
center:['55%','40%'], |
|||
type: 'pie', |
|||
radius: '68%', |
|||
data: [ |
|||
{value: this.xmProjectState.totalClosedBugCnt, |
|||
itemStyle: { |
|||
normal:{ |
|||
color: '#5470C6' |
|||
} |
|||
}, |
|||
name: '已关闭'}, |
|||
{value: this.xmProjectState.totalResolvedBugCnt, |
|||
itemStyle: { |
|||
normal:{ |
|||
color: '#91CC75' |
|||
} |
|||
}, |
|||
name: '已解决'}, |
|||
{value: this.xmProjectState.totalActiveBugCnt, |
|||
itemStyle: { |
|||
normal:{ |
|||
color: '#FAC858' |
|||
} |
|||
}, |
|||
name: '已激活'}, |
|||
{value: this.xmProjectState.totalConfirmedBugCnt, |
|||
itemStyle: { |
|||
normal:{ |
|||
color: '#EE6666' |
|||
} |
|||
}, |
|||
name: '已确认'}, |
|||
], |
|||
emphasis: { |
|||
itemStyle: { |
|||
shadowBlur: 10, |
|||
shadowOffsetX: 0, |
|||
shadowColor: 'rgba(0, 0, 0, 0.5)' |
|||
} |
|||
} |
|||
} |
|||
] |
|||
}; |
|||
|
|||
// 绘制图表 |
|||
bugPieChart.setOption(option); |
|||
} |
|||
}, |
|||
|
|||
mounted() { |
|||
this.$nextTick(() => { |
|||
this.getXmProjectState(); |
|||
}); |
|||
listOption([{categoryId:'all',itemCode:'projectType'},{categoryId:'all',itemCode:'urgencyLevel'},{categoryId:'all',itemCode:'priority'},{categoryId:'all',itemCode:'projectStatus'}] ).then(res=>{ |
|||
if(res.data.tips.isOk){ |
|||
|
|||
this.options['projectType']=res.data.data.projectType |
|||
this.options['urgencyLevel']=res.data.data.urgencyLevel |
|||
this.options['priority']=res.data.data.priority |
|||
this.options['projectStatus']=res.data.data.projectStatus |
|||
} |
|||
}); |
|||
|
|||
}, |
|||
|
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.container { |
|||
margin: 10px; |
|||
} |
|||
|
|||
.header { |
|||
display: flex; |
|||
justify-content: flex-start; |
|||
padding: 10px; |
|||
|
|||
span { |
|||
padding-right: 15px; |
|||
} |
|||
} |
|||
|
|||
.col { |
|||
margin-bottom: 20px; |
|||
} |
|||
|
|||
.icon { |
|||
color: #fff; |
|||
height: 30px; |
|||
width: 30px; |
|||
border-radius: 15px; |
|||
text-align: center; |
|||
line-height: 30px; |
|||
font-size: 20px; |
|||
display: inline-block; |
|||
margin-right: 5px; |
|||
} |
|||
|
|||
.icon2 { |
|||
color: #000000; |
|||
height: 30px; |
|||
width: 30px; |
|||
border-radius: 15px; |
|||
text-align: center; |
|||
line-height: 30px; |
|||
font-size: 20px; |
|||
display: inline-block; |
|||
margin-right: 5px; |
|||
margin-left: 5px; |
|||
} |
|||
|
|||
.item { |
|||
display: flex; |
|||
justify-content: flex-start; |
|||
} |
|||
|
|||
.card-font { |
|||
color: #000000; |
|||
font-size: 12px; |
|||
|
|||
.el-col { |
|||
margin-bottom: 20px; |
|||
} |
|||
} |
|||
|
|||
.calendar-header { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
|
|||
.cal-header-boxs { |
|||
flex: 1; |
|||
display: flex; |
|||
justify-content: flex-end; |
|||
|
|||
.cal-header-box { |
|||
padding: 5px; |
|||
height: 45px; |
|||
margin-left: 10px; |
|||
} |
|||
|
|||
.box-icon { |
|||
text-align: center; |
|||
} |
|||
|
|||
.box-info { |
|||
text-align: center; |
|||
font-size: 12px; |
|||
color: #000000; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.el-tag:hover { |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.el-progress { |
|||
width: 350px; |
|||
} |
|||
|
|||
.value { |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.reference { |
|||
margin-top: 10px; |
|||
font-size: 12px; |
|||
} |
|||
|
|||
.click { |
|||
background: #e9f7ff; |
|||
} |
|||
|
|||
.calendar-box { |
|||
display: flex; |
|||
justify-content: flex-start; |
|||
} |
|||
</style> |
|||
|
|||
<style> |
|||
.app-container{ |
|||
padding: 20px; |
|||
padding-bottom: 0; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,129 @@ |
|||
<template> |
|||
<section class="page-container page-height-90 padding-left padding-right"> |
|||
<el-menu mode="horizontal" default-active="overiew" @select="onMenuToolBarSelect"> |
|||
<el-menu-item index="overiew"> |
|||
<span slot="title">迭代概览</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="detail"> |
|||
<span slot="title">迭代详情</span> |
|||
</el-menu-item> |
|||
<el-submenu index="project-change"> |
|||
<template slot="title"> |
|||
<span slot="title">项目变更</span> |
|||
</template> |
|||
<el-menu-item index="project-change-base-info"> |
|||
<span slot="title">基础信息修改</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="project-change-start"> |
|||
<span slot="title">立项申请</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="project-change-budget"> |
|||
<span slot="title">预算+-</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="project-change-cost"> |
|||
<span slot="title">成本+-</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="project-change-collection"> |
|||
<span slot="title">收款</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="project-change-conclusion"> |
|||
<span slot="title">结项申请</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="project-change-suspend"> |
|||
<span slot="title">暂停申请</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="project-change-activation"> |
|||
<span slot="title">激活申请</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="project-change-to-after-sales"> |
|||
<span slot="title">转售后申请</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="project-change-new-pm"> |
|||
<span slot="title">项目经理变更申请</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="project-change-new-leader"> |
|||
<span slot="title">组长变更申请</span> |
|||
</el-menu-item> |
|||
</el-submenu> |
|||
<el-submenu index="menu-change"> |
|||
<template slot="title"> |
|||
<span slot="title">需求变更</span> |
|||
</template> |
|||
<el-menu-item index="menu-change-review"> |
|||
<span slot="title">需求评审</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="menu-change-border-review"> |
|||
<span slot="title">需求边界异动</span> |
|||
</el-menu-item> |
|||
</el-submenu> |
|||
|
|||
<el-submenu index="iteration-change"> |
|||
<template slot="title"> |
|||
<span slot="title">迭代变更</span> |
|||
</template> |
|||
<el-menu-item index="iteration-change-review"> |
|||
<span slot="title">迭代计划评审</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="iteration-change-border-review"> |
|||
<span slot="title">迭代上线申请</span> |
|||
</el-menu-item> |
|||
</el-submenu> |
|||
|
|||
<el-submenu index="phase-change"> |
|||
<template slot="title"> |
|||
<span slot="title">阶段计划变更</span> |
|||
</template> |
|||
<el-menu-item index="phase-change-review"> |
|||
<span slot="title">计划评审</span> |
|||
</el-menu-item> |
|||
<el-menu-item index="phase-change-border-review"> |
|||
<span slot="title">预算变更</span> |
|||
</el-menu-item> |
|||
</el-submenu> |
|||
</el-menu> |
|||
<xm-iteration-overview v-if="showPanelName=='overiew'" :xm-iteration="xmIteration"></xm-iteration-overview> |
|||
<xm-iteration-edit v-if="showPanelName=='detail'" :xm-iteration="xmIteration"></xm-iteration-edit> |
|||
</section> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from "@/common/js/util"; // 全局公共库 |
|||
//import Sticky from "@/components/Sticky"; // 粘性header组件 |
|||
import { mapGetters } from "vuex"; |
|||
import XmIterationOverview from './XmIterationOverview.vue'; |
|||
import XmIterationEdit from './XmIterationEdit.vue'; |
|||
|
|||
|
|||
export default { |
|||
components: {XmIterationOverview,XmIterationEdit }, |
|||
computed: { |
|||
...mapGetters(["userInfo"]), |
|||
}, |
|||
|
|||
props:['xmIteration'], |
|||
watch:{ |
|||
}, |
|||
data() { |
|||
return { |
|||
showPanelName:'overiew' |
|||
}; |
|||
}, |
|||
|
|||
methods:{ |
|||
|
|||
onMenuToolBarSelect(menuIndex){ |
|||
this.showPanelName=menuIndex; |
|||
} |
|||
}, |
|||
|
|||
mounted() { |
|||
this.$nextTick(() => { |
|||
}); |
|||
}, |
|||
|
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
|
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue