From c3e649b6c665085984eeef2324d83d8a3ac026fa Mon Sep 17 00:00:00 2001
From: chentaiyu <chentaiyu>
Date: Mon, 19 Jul 2021 19:32:06 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E9=A1=B9=E7=9B=AE=E6=A6=82?=
 =?UTF-8?q?=E8=A7=88=EF=BC=8C=E6=B7=BB=E5=8A=A0=E4=BA=A7=E5=93=81=E6=A6=82?=
 =?UTF-8?q?=E8=A7=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../xm/core/xmProduct/XmProductOverview.vue   | 585 +++++++++---------
 .../xmProduct/XmProductOverviewComplex.vue    | 131 ++--
 .../xm/core/xmProject/XmProjectOverview.vue   | 264 +++++++-
 3 files changed, 593 insertions(+), 387 deletions(-)

diff --git a/src/views/xm/core/xmProduct/XmProductOverview.vue b/src/views/xm/core/xmProduct/XmProductOverview.vue
index 4eaf08ad..08c04197 100644
--- a/src/views/xm/core/xmProduct/XmProductOverview.vue
+++ b/src/views/xm/core/xmProduct/XmProductOverview.vue
@@ -1,23 +1,18 @@
 <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>
+                <span>产品信息</span>
               </div>
               <el-row style="margin-bottom:18px">
                 <el-row>
-                  <span v-text="taskMng"></span>
+                  <span v-text="this.xmProduct.pmUsername"></span>
                 </el-row>
                 <el-row>
-                  <span>项目负责人</span>
+                  <span>产品负责人</span>
                 </el-row>
               </el-row>
               <el-row style="margin-bottom:18px">
@@ -27,8 +22,8 @@
                       <i class="el-icon-right"></i>
                     </div>
                     <div class="info">
-                      <div v-text="totalTask"></div>
-                      <div class="title">总任务量</div>
+                      <div v-text="this.xmProduct.taskCnt"></div>
+                      <div class="title">任务总数</div>
                     </div>
                   </div>
                 </el-col>
@@ -50,7 +45,7 @@
                       <i class="el-icon-check"></i>
                     </div>
                     <div class="info">
-                      <div v-text="finish" >
+                      <div v-text="this.xmProduct.finishTaskCnt" >
                       </div>
                       <div class="title">已完成</div>
                     </div>
@@ -63,7 +58,7 @@
                     <i class="el-icon-date"></i>
                   </div>
                   <div class="info">
-                    <div v-text="taskStartTime+'~'+taskEndTime">
+                    <div v-text="productStartTime+'~'+productEndTime">
                     </div>
                     <div class="title">项目计划周期</div>
                   </div>
@@ -75,7 +70,7 @@
                     <i class="el-icon-star-off"></i>
                   </div>
                   <div class="info">
-                    <div class="title"> 需求数： {{this.xmProjectState.menuCnt}}</div>
+                    <div class="title"> 需求数： {{this.xmProduct.menuCnt}}</div>
                   </div>
                 </div>
               </el-row>
@@ -85,7 +80,7 @@
                     <i class="el-icon-refresh"></i>
                   </div>
                   <div class="info">
-                    <div class="title"> 迭代数： {{(this.xmProjectState.iterationCnt==null?0:this.xmProjectState.iterationCnt)}} </div>
+                    <div class="title"> 迭代数： {{this.xmProduct.iterationCnt}} </div>
                   </div>
                 </div>
               </el-row>
@@ -96,7 +91,7 @@
                   </div>
                   <div>
                     <div class="info">
-                      <el-progress v-if="progress1" :percentage="progress1"></el-progress>
+                      <el-progress :percentage="taskProgress"></el-progress>
                     </div>
                     <div class="title">任务进度</div>
                   </div>
@@ -110,7 +105,7 @@
                 <span>所有工作项及其完成情况</span>
               </div>
               <div>
-                <div id="allChart" :style="{width: '425px', height: '350px'}"></div>
+                <div id="allChart" :style="{width: '400px', height: '370px'}"></div>
               </div>
             </el-card>
           </el-col>
@@ -120,257 +115,203 @@
                 <span>缺陷情况</span>
               </div>
               <div>
-                <div id="bugPieChart" :style="{width: '440px', height: '400px'}"></div>
+                <div id="bugPieChart" :style="{width: '450px', height: '410px'}"></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>
+        <el-col :span="8" >
+          <el-card class="box-card" style="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.xmProductCpd.planWorkload"></span>
+                        <span style="font-size:5px;">h</span>
                       </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 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.xmProduct.actWorkload"></span>
+                        <span style="font-size:5px;">h</span>
                       </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 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>
-                    </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 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>
-                    </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 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>
-                    </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 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>
-                    </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>
+                      <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: 400px;margin-left:20px;margin-top: 10px;margin-bottom: 20px;" :text-inside="true" :stroke-width="20" :percentage="planProgress"></el-progress>
+              </el-row>
+              <el-row>
+                <span style="margin-left:20px;">工时实际进度</span>
+                <el-progress style="width: 400px;margin-left:20px;margin-top: 10px;" :text-inside="true" :stroke-width="20" :percentage="realProgress"></el-progress>
+              </el-row>
+            </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="projectAndIteration" :style="{width: '420px', height: '415px'}"></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="casePie" :style="{width: '400px', height: '415px'}"></div>
+            </div>
+          </el-card>
+        </el-col>
       </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;
+      return this.xmProduct.taskCnt-this.xmProduct.finishTaskCnt;
     },
-    progress1: function (){
-      return Math.round(this.xmProjectState.totalCompleteTaskCnt/this.xmProjectState.totalTaskCnt*100);
+    taskProgress: function (){
+      return Math.round(this.xmProduct.finishTaskCnt/this.xmProduct.taskCnt*100);
     },
-    taskStartTime: function (){
-      return this.selProject.startTime.substring(0,10);
-    },
-    taskEndTime: function (){
-      return this.selProject.endTime.substring(0,10);
+    productStartTime: function (){
+      if(this.xmProduct.planStartTime){
+        return this.xmProduct.planStartTime.substring(0,10);
+      } else{
+        return '暂无';
+      }
     },
-    taskMng: function (){
-      return this.selProject.createUsername;
+    productEndTime: function (){
+      if(this.xmProduct.planEndTime){
+        return this.xmProduct.planEndTime.substring(0,10);
+      } else{
+        return '暂无';
+      }
     },
     workloadProgress:function (){
-      return Math.round(this.xmProjectState.totalActWorkload/this.xmProjectState.totalPlanWorkload*100);
+      return Math.round(this.xmProduct.actWorkload/this.xmProduct.planWorkload*100);
+    },
+    remainWorkload:function (){
+      return this.xmProduct.planWorkload - this.xmProduct.actWorkload;
     },
     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)
+      let productStartTime = new Date(this.xmProduct.planStartTime);
+      let productEndTime = new Date(this.xmProduct.planEndTime);
+      if(now<=productEndTime){
+        let allDays=productEndTime-productStartTime;
+        return this.xmProduct.planWorkload - Math.round((now-productStartTime)/allDays*this.xmProduct.planWorkload);
       }else{
-        return this.xmProjectState.totalActWorkload - this.xmProjectState.totalPlanWorkload;
+        return this.xmProduct.actWorkload - this.xmProduct.planWorkload;
       }
     },
     deviationRate:function (){
-      return Math.round(this.deviation/this.xmProjectState.totalPlanWorkload*100);
-    },
-    remainWorkload:function (){
-      return this.xmProjectState.totalPlanWorkload - this.xmProjectState.totalActWorkload;
+      return Math.round(this.deviation/this.xmProduct.planWorkload*100);
     },
     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)
+      let productStartTime = new Date(this.xmProduct.planStartTime);
+      let productEndTime = new Date(this.xmProduct.planEndTime);
+      if(now<=productEndTime){
+        let allDays=productEndTime-productStartTime;
+        return Math.round((now-productStartTime)/allDays*100)
       }else{
         return 100;
       }
     },
     realProgress:function (){
-      if(this.xmProjectState.totalActWorkload < this.xmProjectState.totalPlanWorkload){
-        return Math.round(this.xmProjectState.totalActWorkload/this.xmProjectState.totalPlanWorkload*100)
+      if(this.xmProduct.actWorkload < this.xmProduct.planWorkload){
+        return Math.round(this.xmProduct.actWorkload/this.xmProduct.planWorkload*100)
       }else{
         return 100;
       }
     },
-    xmProjectStateCpd(){
-      return this.xmProjectState
+    xmProductCpd(){
+      return this.xmProduct;
     },
-    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'],
+  props:['xmProduct'],
   watch:{
-    xmProjectStateCpd:function(){
+    xmProductCpd:function(){
       this.drawAllBar();
-      this.drawTaskByDate();
       this.drawPieBug();
+      this.drawProjectAndIteration();
+      this.drawCasePie();
     }
   },
   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"));
@@ -398,7 +339,7 @@ export default {
           {
             data: [
               {
-                value: this.xmProjectState.menuCnt,
+                value: this.xmProduct.menuCnt,
                 itemStyle: {
                   normal:{
                     color: '#99CCFF'
@@ -406,7 +347,7 @@ export default {
                 }
               },
               {
-                value: this.xmProjectState.totalTaskCnt,
+                value: this.xmProduct.taskCnt,
                 itemStyle: {
                   normal:{
                     color: '#99CCFF'
@@ -414,7 +355,7 @@ export default {
                 }
               },
               {
-                value: this.xmProjectState.totalBugCnt,
+                value: this.xmProduct.bugCnt,
                 itemStyle: {
                   normal:{
                     color: '#99CCFF'
@@ -430,119 +371,192 @@ export default {
       // 绘制图表
       allChart.setOption(option);
     },
-    drawTaskByDate() {
-      let taskChart = this.$echarts.init(document.getElementById("taskChart"));
+    drawPieBug() {
+      let bugPieChart = this.$echarts.init(document.getElementById("bugPieChart"));
       let option = {
         tooltip: {
-          trigger: 'axis'
+          trigger: 'item',
+          formatter: '{b} : {c} ({d}%)'
         },
-        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'
+          orient: 'vertical',
+          left: 'left',
         },
         series: [
           {
-            name: '未开始',
-            type: 'line',
-            //stack: '总量',
-            data: [120, 132, 101, 134, 90, 230, 210],
-            areaStyle: {
+            center:['55%','40%'],
+            type: 'pie',
+            radius: '68%',
+            label:{            //饼图图形上的文本标签
               normal:{
-                color:"rgb(153, 204, 255)" , //设置折线图颜色
+                show:true,
+                position:'outer', //标签的位置:内部
+                textStyle : {
+                  fontWeight : 100 ,
+                  fontSize: document.body.clientWidth / 120, //标签字体大小
+                  color: "#000000"
+                },
+                formatter:'{b}\n{c}({d}%)',//b：name,c:value,d:占比
+                alignTo:'edge',
+                margin:10
               }
             },
-            lineStyle:{
-              normal:{
-                color:'rgb(0, 153, 255)'
+            data: [
+              {value: this.xmProduct.closedBugs,
+                itemStyle: {
+                  normal:{
+                    color: '#5470C6'
+                  }
+                },
+                name: '已关闭'},
+              {value: this.xmProduct.resolvedBugs,
+                itemStyle: {
+                  normal:{
+                    color: '#91CC75'
+                  }
+                },
+                name: '已解决'},
+              {value: this.xmProduct.activeBugs,
+                itemStyle: {
+                  normal:{
+                    color: '#FAC858'
+                  }
+                },
+                name: '已激活'},
+              {value: this.xmProduct.confirmedBugs,
+                itemStyle: {
+                  normal:{
+                    color: '#EE6666'
+                  }
+                },
+                name: '已确认'},
+            ],
+            emphasis: {
+              itemStyle: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
               }
-            },
-          },
+            }
+          }
+        ]
+      };
+
+      // 绘制图表
+      bugPieChart.setOption(option);
+    },
+    drawProjectAndIteration() {
+      let projectAndIteration = this.$echarts.init(document.getElementById("projectAndIteration"));
+      let option = {
+        tooltip: {
+          trigger: 'item',
+          formatter: '{b} :<br/> {c} ({d}%)'
+        },
+        legend: {
+          bottom: 10,
+          left: 'center',
+        },
+        series: [
           {
-            name: '进行中',
-            type: 'line',
-            //stack: '总量',
-            data: [220, 182, 191, 234, 290, 330, 310],
-            areaStyle: {
+            center:['55%','40%'],//饼图位置
+            type: 'pie',
+            radius: '60%',//饼图半径大小
+            label:{            //饼图图形上的文本标签
               normal:{
-                color:"rgb(153, 204, 255)", //设置折线图颜色
+                show:true,
+                position:'outer', //标签的位置:外部
+                textStyle : {
+                  fontWeight : 100 ,
+                  fontSize: document.body.clientWidth / 120, //标签字体大小
+                  color: "#000000"
+                },
+                formatter:'{b}\n{c}({d}%)',//b：name,c:value,d:占比
+                alignTo:'edge',
+                margin:10
               }
             },
-            lineStyle:{
-              normal:{
-                color:'#6699CC'
+            data: [
+              {value: this.xmProduct.iterationCnt,
+                itemStyle: {
+                  normal:{
+                    color: '#EE6666'
+                  }
+                },
+                name: '迭代数'},
+              {value: this.xmProduct.projectCnt,
+                itemStyle: {
+                  normal:{
+                    color: '#F4A460'
+                  }
+                },
+                name: '项目数'},
+            ],
+            emphasis: {
+              itemStyle: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
               }
-            },
-          },
-        ],
+            }
+          }
+        ]
       };
 
       // 绘制图表
-      taskChart.setOption(option);
+      projectAndIteration.setOption(option);
     },
-    drawPieBug() {
-      let bugPieChart = this.$echarts.init(document.getElementById("bugPieChart"));
+    drawCasePie() {
+      let casePie = this.$echarts.init(document.getElementById("casePie"));
       let option = {
         tooltip: {
           trigger: 'item',
-          formatter: '{b} : {c} ({d}%)'
+          formatter: '{b} :<br/> {c} ({d}%)'
         },
         legend: {
-          orient: 'vertical',
-          left: 'left',
+          bottom: 10,
+          left: 'center',
         },
         series: [
           {
-            center:['55%','40%'],
+            center:['55%','40%'],//饼图位置
             type: 'pie',
-            radius: '68%',
-            data: [
-              {value: this.xmProjectState.totalClosedBugCnt,
-                itemStyle: {
-                  normal:{
-                    color: '#5470C6'
-                  }
+            radius: '60%',//饼图半径大小
+            label:{            //饼图图形上的文本标签
+              normal:{
+                show:true,
+                position:'outer', //标签的位置:外部
+                textStyle : {
+                  fontWeight : 100 ,
+                  fontSize: document.body.clientWidth / 120, //标签字体大小
+                  color: "#000000"
                 },
-                name: '已关闭'},
-              {value: this.xmProjectState.totalResolvedBugCnt,
+                formatter:'{b}\n{c}({d}%)',//b：name,c:value,d:占比
+                alignTo:'edge',
+                margin:10
+              }
+            },
+            data: [
+              {value: this.xmProduct.execCases,
                 itemStyle: {
                   normal:{
-                    color: '#91CC75'
+                    color: '#73C0DE'
                   }
                 },
-                name: '已解决'},
-              {value: this.xmProjectState.totalActiveBugCnt,
+                name: '测试中案例'},
+              {value: this.xmProduct.designCases,
                 itemStyle: {
                   normal:{
                     color: '#FAC858'
                   }
                 },
-                name: '已激活'},
-              {value: this.xmProjectState.totalConfirmedBugCnt,
+                name: '设计中案例'},
+              {value: this.xmProduct.finishCases,
                 itemStyle: {
                   normal:{
-                    color: '#EE6666'
+                    color: '#91CC75'
                   }
                 },
-                name: '已确认'},
+                name: '完成案例'},
             ],
             emphasis: {
               itemStyle: {
@@ -556,24 +570,17 @@ export default {
       };
 
       // 绘制图表
-      bugPieChart.setOption(option);
-    }
+      casePie.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
-      }
-    });
-
+    this.drawAllBar();
+    this.drawPieBug();
+    this.drawProjectAndIteration();
+    this.drawCasePie();
   },
 
 };
diff --git a/src/views/xm/core/xmProduct/XmProductOverviewComplex.vue b/src/views/xm/core/xmProduct/XmProductOverviewComplex.vue
index 7413173c..d3b9d70d 100644
--- a/src/views/xm/core/xmProduct/XmProductOverviewComplex.vue
+++ b/src/views/xm/core/xmProduct/XmProductOverviewComplex.vue
@@ -1,87 +1,87 @@
 <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"> 
+  <section class="page-container page-height-90 padding-left padding-right">
+      <el-menu mode="horizontal" default-active="overview"  @select="onMenuToolBarSelect">
+        <el-menu-item index="overview">
           <span slot="title">项目概览</span>
         </el-menu-item>
-        <el-menu-item index="detail"> 
+        <el-menu-item index="detail">
           <span slot="title">项目详情</span>
         </el-menu-item>
         <el-submenu index="project-change">
-          <template slot="title"> 
+          <template slot="title">
             <span slot="title">项目变更</span>
-          </template>   
+          </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> 
+              <span slot="title">基础信息修改</span>
             </el-menu-item>
-            <el-menu-item index="project-change-budget"> 
-              <span slot="title">预算+-</span> 
+            <el-menu-item index="project-change-start">
+              <span slot="title">立项申请</span>
             </el-menu-item>
-            <el-menu-item index="project-change-cost"> 
-              <span slot="title">成本+-</span>  
+            <el-menu-item index="project-change-budget">
+              <span slot="title">预算+-</span>
             </el-menu-item>
-            <el-menu-item index="project-change-collection"> 
-              <span slot="title">收款</span> 
+            <el-menu-item index="project-change-cost">
+              <span slot="title">成本+-</span>
             </el-menu-item>
-            <el-menu-item index="project-change-conclusion">  
-              <span slot="title">结项申请</span> 
+            <el-menu-item index="project-change-collection">
+              <span slot="title">收款</span>
             </el-menu-item>
-            <el-menu-item index="project-change-suspend">  
-              <span slot="title">暂停申请</span> 
+            <el-menu-item index="project-change-conclusion">
+              <span slot="title">结项申请</span>
             </el-menu-item>
-            <el-menu-item index="project-change-activation">  
-              <span slot="title">激活申请</span> 
+            <el-menu-item index="project-change-suspend">
+              <span slot="title">暂停申请</span>
             </el-menu-item>
-            <el-menu-item index="project-change-to-after-sales">  
+            <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">  
+            </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">  
+            </el-menu-item>
+            <el-menu-item index="project-change-new-leader">
               <span slot="title">组长变更申请</span>
-            </el-menu-item> 
-        </el-submenu> 
+            </el-menu-item>
+        </el-submenu>
         <el-submenu index="menu-change">
-          <template slot="title"> 
+          <template slot="title">
             <span slot="title">需求变更</span>
-          </template>    
+          </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> 
-        
+              <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"> 
+          <template slot="title">
             <span slot="title">迭代变更</span>
-          </template>    
+          </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> 
-        
+              <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"> 
+          <template slot="title">
             <span slot="title">阶段计划变更</span>
-          </template>    
+          </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-product-overview  v-if="showPanelName=='overiew'" :xm-product="xmProduct"></xm-product-overview>
+              <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-product-overview  v-if="showPanelName=='overview'" :xm-product="xmProduct"></xm-product-overview>
         <xm-product-edit  v-if="showPanelName=='detail'" :xm-product="xmProduct"></xm-product-edit>
   </section>
 </template>
@@ -90,7 +90,6 @@
 import util from "@/common/js/util"; // 全局公共库
 //import Sticky from "@/components/Sticky"; // 粘性header组件
 import { mapGetters } from "vuex";
-import { listXmProjectState } from '@/api/xm/core/xmProductState';
 import XmProductOverview from './XmProductOverview.vue';
 import XmProductEdit from './XmProductEdit.vue';
 
@@ -98,27 +97,27 @@ import XmProductEdit from './XmProductEdit.vue';
 export default {
   components: { XmProductOverview, XmProductEdit },
   computed: {
-    ...mapGetters(["userInfo"]), 
+    ...mapGetters(["userInfo"]),
   },
 
-  props:['selProject'],
-  watch:{ 
+  props:['xmProduct'],
+  watch:{
   },
   data() {
-    return { 
-      showPanelName:'overiew'
+    return {
+      showPanelName:'overview'
     };
   },
 
   methods:{
-     
+
     onMenuToolBarSelect(menuIndex){
       this.showPanelName=menuIndex;
     }
   },
 
   mounted() {
-    this.$nextTick(() => { 
+    this.$nextTick(() => {
     });
   },
 
@@ -126,5 +125,5 @@ export default {
 </script>
 
 <style scoped lang="scss">
- 
+
 </style>
diff --git a/src/views/xm/core/xmProject/XmProjectOverview.vue b/src/views/xm/core/xmProject/XmProjectOverview.vue
index 3ad9e1a3..a9b88623 100644
--- a/src/views/xm/core/xmProject/XmProjectOverview.vue
+++ b/src/views/xm/core/xmProject/XmProjectOverview.vue
@@ -1,10 +1,5 @@
 <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" >
@@ -120,7 +115,7 @@
                 <span>缺陷情况</span>
               </div>
               <div>
-                <div id="bugPieChart" :style="{width: '425px', height: '400px'}"></div>
+                <div id="bugPieChart" :style="{width: '400px', height: '415px'}"></div>
               </div>
             </el-card>
           </el-col>
@@ -217,6 +212,38 @@
             </el-card>
           </el-col>
         </el-row>
+      <el-row :gutter="10" style="margin-bottom:10px">
+        <el-col :span="8" >
+          <el-card class="box-card" style="height:425px">
+            <div slot="header" class="clearfix">
+              <span>总预算情况</span>
+            </div>
+            <div>
+              <div id="planTotalCostPie" :style="{width: '400px', height: '415px'}"></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="workloadDistribution" :style="{width: '400px', height: '415px'}"></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="iterationAndProduct" :style="{width: '400px', height: '415px'}"></div>
+            </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">
@@ -334,6 +361,9 @@ export default {
       this.drawAllBar();
       this.drawTaskByDate();
       this.drawPieBug();
+      this.drawCostPie();
+      this.drawWorkload();
+      this.drawIterationProduct();
     }
   },
   data() {
@@ -341,7 +371,6 @@ export default {
       isActive: true,
       load:{ list: false},
       selProject:[],
-      //xmProjectState: [],//查询结果
       options:{
         projectType:[],
         urgencyLevel:[],
@@ -352,24 +381,6 @@ export default {
   },
 
   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"));
@@ -512,17 +523,17 @@ export default {
           {
             center:['55%','40%'],//饼图位置
             type: 'pie',
-            radius: '68%',//饼图半径大小
+            radius: '60%',//饼图半径大小
             label:{            //饼图图形上的文本标签
               normal:{
                 show:true,
-                position:'inner', //标签的位置:内部
+                position:'outer', //标签的位置:内部
                 textStyle : {
-                  fontWeight : 120 ,
-                  fontSize: document.body.clientWidth / 150, //标签字体大小
+                  fontWeight : 100 ,
+                  fontSize: document.body.clientWidth / 120, //标签字体大小
                   color: "#000000"
                 },
-                formatter:'{b} : {c} ({d}%)',//b：name,c:value,d:占比
+                formatter:'{b}\n{c}({d}%)',//b：name,c:value,d:占比
                 alignTo:'edge',
                 margin:10
               }
@@ -570,12 +581,198 @@ export default {
 
       // 绘制图表
       bugPieChart.setOption(option);
-    }
+    },
+    drawCostPie() {
+      let planTotalCostPie = this.$echarts.init(document.getElementById("planTotalCostPie"));
+      let option = {
+        tooltip: {
+          trigger: 'item',
+          formatter: '{b} : {c} ({d}%)'
+        },
+        legend: {
+          bottom: 10,
+          left: 'center',
+        },
+        series: [
+          {
+            center:['55%','40%'],//饼图位置
+            type: 'pie',
+            radius: '60%',//饼图半径大小
+            label:{            //饼图图形上的文本标签
+              normal:{
+                show:true,
+                position:'outer', //标签的位置:外部
+                textStyle : {
+                  fontWeight : 100 ,
+                  fontSize: document.body.clientWidth / 120, //标签字体大小
+                  color: "#000000"
+                },
+                formatter:'{b}\n{c}({d}%)',//b：name,c:value,d:占比
+                alignTo:'edge',
+                margin:10
+              }
+            },
+            data: [
+              {value: this.selProject.planNouserAt,
+                itemStyle: {
+                  normal:{
+                    color: '#FAC858'
+                  }
+                },
+                name: '非人力'},
+              {value: this.selProject.planInnerUserAt,
+                itemStyle: {
+                  normal:{
+                    color: '#73C0DE'
+                  }
+                },
+                name: '内部人力'},
+              {value: this.selProject.planOutUserAt,
+                itemStyle: {
+                  normal:{
+                    color: '#5470C6'
+                  }
+                },
+                name: '外购人力'},
+            ],
+            emphasis: {
+              itemStyle: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      };
+
+      // 绘制图表
+      planTotalCostPie.setOption(option);
+    },
+    drawWorkload() {
+      let workloadDistribution = this.$echarts.init(document.getElementById("workloadDistribution"));
+      let option = {
+        tooltip: {
+          trigger: 'item',
+          formatter: '{b} :<br/> {c} ({d}%)'
+        },
+        legend: {
+          bottom: 10,
+          left: 'center',
+        },
+        series: [
+          {
+            center:['55%','40%'],//饼图位置
+            type: 'pie',
+            radius: '60%',//饼图半径大小
+            label:{            //饼图图形上的文本标签
+              normal:{
+                show:true,
+                position:'outer', //标签的位置:外部
+                textStyle : {
+                  fontWeight : 100 ,
+                  fontSize: document.body.clientWidth / 120, //标签字体大小
+                  color: "#000000"
+                },
+                formatter:'{b}\n{c}({d}%)',//b：name,c:value,d:占比
+                alignTo:'edge',
+                margin:10
+              }
+            },
+            data: [
+              {value: this.selProject.planInnerUserWorkload,
+                itemStyle: {
+                  normal:{
+                    color: '#91CC75'
+                  }
+                },
+                name: '内部人力工作量'},
+              {value: this.selProject.planOutUserWorkload,
+                itemStyle: {
+                  normal:{
+                    color: '#3BA272'
+                  }
+                },
+                name: '外购人力工作量'},
+            ],
+            emphasis: {
+              itemStyle: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      };
+
+      // 绘制图表
+      workloadDistribution.setOption(option);
+    },
+    drawIterationProduct() {
+      let iterationAndProduct = this.$echarts.init(document.getElementById("iterationAndProduct"));
+      let option = {
+        tooltip: {
+          trigger: 'item',
+          formatter: '{b} :<br/> {c} ({d}%)'
+        },
+        legend: {
+          bottom: 10,
+          left: 'center',
+        },
+        series: [
+          {
+            center:['55%','40%'],//饼图位置
+            type: 'pie',
+            radius: '60%',//饼图半径大小
+            label:{            //饼图图形上的文本标签
+              normal:{
+                show:true,
+                position:'outer', //标签的位置:外部
+                textStyle : {
+                  fontWeight : 100 ,
+                  fontSize: document.body.clientWidth / 120, //标签字体大小
+                  color: "#000000"
+                },
+                formatter:'{b}\n{c}({d}%)',//b：name,c:value,d:占比
+                alignTo:'edge',
+                margin:10
+              }
+            },
+            data: [
+              {value: this.selProject.iterationCnt,
+                itemStyle: {
+                  normal:{
+                    color: '#EE6666'
+                  }
+                },
+                name: '迭代数'},
+              {value: this.selProject.productCnt,
+                itemStyle: {
+                  normal:{
+                    color: '#73C0DE'
+                  }
+                },
+                name: '产品数'},
+            ],
+            emphasis: {
+              itemStyle: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      };
+
+      // 绘制图表
+      iterationAndProduct.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){
@@ -588,6 +785,9 @@ export default {
     this.drawAllBar();
     this.drawTaskByDate();
     this.drawPieBug();
+    this.drawCostPie();
+    this.drawWorkload();
+    this.drawIterationProduct();
 
   },