预算执行弹窗新需求等

src/store/getters.js

@@ -21,6 +21,7 @@ const getters = {
 
   // kzks
   departNameList: state => state.kzks.departNameList,
+  pcDateRange: state => state.kzks.pcDateRange,
 }
 
 export default getters

src/store/modules/kzks.js

@@ -6,7 +6,8 @@ import Vue from 'vue'
 const kzksInfo = {
   state: {
     //存储数据，用于组件之间的数据传输
-    departNameList: []
+    departNameList: [], // 管理驾驶舱部门选择
+    pcDateRange: [], // 项目成本预算执行弹窗日期范围选择
   },
   // （大概）区别：mutations用来修改state数据 同步
   mutations: {
@@ -15,12 +16,20 @@ const kzksInfo = {
       // Vue.set(state, 'baseInfos', fields)
       state.departNameList = infos
     },
+    SET_PCDATERANGE: (state, infos) => {
+      // console.log('fields',fields)
+      // Vue.set(state, 'baseInfos', fields)
+      state.pcDateRange = infos
+    },
   },
   // （大概）区别：actions用来设计复杂逻辑 异步
   actions: {
     setDepartNameList({ commit }, record) {
       commit('SET_DEPARTNAMELIST', record)
-    }
+    },
+    setPcDateRange({ commit }, record) {
+      commit('SET_PCDATERANGE', record)
+    },
     // this.$store.state.kzksInfo.baseInfos
     // this.$store.dispatch('setWeituoBaseInfos', data)
   }

src/views/module_kzks/projectCostList/ProjectCostList.vue

@@ -362,7 +362,6 @@ import { number } from 'echarts';
           pageSize: 11, // 设置a-table调用时加上筛选行
           pageSizeOptions: ['11', '21', '31'],
           showTotal: (total, range) => {
-            // console.log(total, range, this.ipagination.current)
             var current = this.ipagination.current
             if(this.showListTotal){
               return (range[0] - current + 1) + "-" + (range[1] - current) + " 共" + this.showListTotal + "条"
@@ -592,8 +591,19 @@ import { number } from 'echarts';
             // scopedSlots: {
             //   customRender: 'clf',
             // },
-            customRender: (text) => {
-              return (Number(text)/10000).toFixed(2)
+            // customRender: (text) => {
+            //   return (Number(text)/10000).toFixed(2)
+            // },
+            customRender:function (text,record,index) {
+              var wanyuan = (Number(text)/10000).toFixed(2)
+              let classTag = {
+                class: `${ record.id !== 'amount' && record.clys != 0 && wanyuan > record.clys ? 'exceed-budget-status':''}`
+              }
+              return {
+                children: (
+                  <span {...classTag}>{wanyuan}</span>
+                )
+              };
             },
             customCell: (record, index)=>{ return this.customCellDetail(record, index, 'clf', '材料费')}
           },
@@ -614,8 +624,16 @@ import { number } from 'echarts';
             // scopedSlots: {
             //   customRender: 'zyf',
             // },
-            customRender: (text) => {
-              return (Number(text)/10000).toFixed(2)
+            customRender:function (text,record,index) {
+              var wanyuan = (Number(text)/10000).toFixed(2)
+              let classTag = {
+                class: `${ record.id !== 'amount' && record.zyys != 0 && wanyuan > record.zyys ? 'exceed-budget-status':''}`
+              }
+              return {
+                children: (
+                  <span {...classTag}>{wanyuan}</span>
+                )
+              };
             },
             customCell: (record, index)=>{ return this.customCellDetail(record, index, 'zyf', '专用费')}
           },
@@ -636,8 +654,16 @@ import { number } from 'echarts';
             // scopedSlots: {
             //   customRender: 'swf',
             // },
-            customRender: (text) => {
-              return (Number(text)/10000).toFixed(2)
+            customRender:function (text,record,index) {
+              var wanyuan = (Number(text)/10000).toFixed(2)
+              let classTag = {
+                class: `${ record.id !== 'amount' && record.swys != 0 && wanyuan > record.swys ? 'exceed-budget-status':''}`
+              }
+              return {
+                children: (
+                  <span {...classTag}>{wanyuan}</span>
+                )
+              };
             },
             customCell: (record, index)=>{ return this.customCellDetail(record, index, 'swf', '事务费')}
           },
@@ -658,8 +684,16 @@ import { number } from 'echarts';
             // scopedSlots: {
             //   customRender: 'wxf',
             // },
-            customRender: (text) => {
-              return (Number(text)/10000).toFixed(2)
+            customRender:function (text,record,index) {
+              var wanyuan = (Number(text)/10000).toFixed(2)
+              let classTag = {
+                class: `${ record.id !== 'amount' && record.wxys != 0 && wanyuan > record.wxys ? 'exceed-budget-status':''}`
+              }
+              return {
+                children: (
+                  <span {...classTag}>{wanyuan}</span>
+                )
+              };
             },
             customCell: (record, index)=>{ return this.customCellDetail(record, index, 'wxf', '外协费')}
           },
@@ -677,8 +711,19 @@ import { number } from 'echarts';
             align:"center",
             width: 80,
             dataIndex: 'jjfhz',
-            customRender: (text) => {
-              return Number(text).toFixed(2)
+            // customRender: (text) => {
+            //   return Number(text).toFixed(2)
+            // },
+            customRender:function (text,record,index) {
+              var wanyuan = (Number(text)/10000).toFixed(2)
+              let classTag = {
+                class: `${ record.id !== 'amount' && record.jjys != 0 && wanyuan > record.jjys ? 'exceed-budget-status':''}`
+              }
+              return {
+                children: (
+                  <span {...classTag}>{wanyuan}</span>
+                )
+              };
             },
           },
           {
@@ -920,7 +965,7 @@ import { number } from 'echarts';
       this.getSuperFieldList();
     },
     mounted() {
-      console.log(window.innerHeight, this.$refs.table)
+      // console.log(window.innerHeight, this.$refs.table)
       this.$nextTick(() => {
         this.scrollHeight = window.innerHeight - 60 - 25 - 55 - 25
         // this.scrollHeight = window.innerHeight - this.$refs.table.$el.offsetTop - 60 - 52 - 50 - 56 - 60 - 34
@@ -938,7 +983,7 @@ import { number } from 'echarts';
         this.mouseOffset = e.clientX;
         this.handlerFirstTime = new Date().getTime()
         this.mouseFlag = true;
-        console.log(this.mouseOffset)
+        // console.log(this.mouseOffset)
       },
       mouseUpHandler(e) {
         var lastTime = new Date().getTime();
@@ -960,7 +1005,6 @@ import { number } from 'echarts';
         }
       },
       loadData(arg) {
-        console.log(111)
         if(!this.url.list){
           this.$message.error("请设置url.list属性!")
           return
@@ -970,12 +1014,10 @@ import { number } from 'echarts';
           this.ipagination.current = 1;
         }
         var params = this.getQueryParams();//查询条件
-        console.log(params)
         // 查询时减去筛选行
         params.pageSize = (Number(params.pageSize) - 1).toString()
         this.loading = true;
         getAction(this.url.list, params).then((res) => {
-          console.log(res)
           if (res.success) {
             //update-begin---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
             this.dataSource = res.result.pageList.records||res.result.pageList;
@@ -994,7 +1036,6 @@ import { number } from 'echarts';
             }else{
               this.ipagination.total = 0;
             }
-            console.log(this.dataSource)
             //update-end---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
           }else{
             this.$message.warning(res.message)
@@ -1037,7 +1078,6 @@ import { number } from 'echarts';
       },
       // 行颜色设置
       setRowClassName(record, index){
-        // console.log(record)
         if(record.lrl < 0){
           // 亏损标红
           return 'table-kuisun-color'
@@ -1053,7 +1093,6 @@ import { number } from 'echarts';
       },
       //列设置更改事件
       onColSettingsChange (checkedValues) {
-        console.log(checkedValues)
         // 获取浏览器方式
         // var key = this.$route.name+":colsettings";
         // Vue.ls.set(key, checkedValues, 7 * 24 * 60 * 60 * 1000)
@@ -1080,6 +1119,7 @@ import { number } from 'echarts';
         }
         return {
           style: {
+            // 'color': "#1890ff",
             'color': "#1890ff !important",
             'cursor': "pointer",
           },
@@ -1089,7 +1129,7 @@ import { number } from 'echarts';
               
             },
             dblclick: (event) => {
-              console.log(record, index, columnValue, columnTitle)
+              // console.log(record, index, columnValue, columnTitle)
               // 没有值不弹窗--也弹窗
               // if(!event.target.textContent){
               //   return
@@ -1111,7 +1151,7 @@ import { number } from 'echarts';
                   proportion: record.proportion,
                   columnValue: columnValue,
                 }
-                console.log(columnValue)
+                // console.log(columnValue)
                 this.$refs.proCostDetail.columnValue = 'pichanTask'
                 this.$refs.proCostDetail.title = columnTitle + '批产明细'
               } else {
@@ -1143,7 +1183,7 @@ import { number } from 'echarts';
             },
             // 双击事件
             dblclick: (event) => {
-              console.log(record, index, columnValue, columnTitle)
+              // console.log(record, index, columnValue, columnTitle)
               var tasknos = record.children.map(item=>item.taskno)
               this.$refs.proCostZcbDetail.taskno = tasknos.join(',')
               this.$refs.proCostZcbDetail.title =  columnTitle + '明细'
@@ -1169,7 +1209,6 @@ import { number } from 'echarts';
             proportion: record.proportion,
             columnValue: columnValue,
           }
-          console.log(columnValue)
           this.$refs.proCostDetail.columnValue = 'pichanTask'
           this.$refs.proCostDetail.title = columnTitle + '批产明细'
         } else {
@@ -1221,7 +1260,6 @@ import { number } from 'echarts';
       handleComputed(){
         this.loading = true
         visibleClientStart().then(response => {
-          console.log(response)
           this.loadData()
         })
       },
@@ -1231,11 +1269,9 @@ import { number } from 'echarts';
         // console.log(JSON.stringify(this.selectedRowKeys))
 
         var selectTasknos = this.selectionRows.map( res => {
-          console.log(res.status)
           var value = res.status === '1' ? res.taskno+'_-_pc' :  res.taskno
           return value
         })
-        console.log(selectTasknos)
         this.duibiTasknos = selectTasknos.toString()
         this.duibiIds = this.selectedRowKeys.toString()
         this.duiBi = true
@@ -1244,7 +1280,6 @@ import { number } from 'echarts';
         //   var a = this.selectedRowKeys
         //   var ids = a.toString()
         //   getHjList({ids: ids}).then((res) => {
-        //     console.log(res)
         //     this.duibiList = res
         //     this.duibiclList = []
         //   })
@@ -1252,9 +1287,7 @@ import { number } from 'echarts';
         //     return res.taskno
         //   })
         //   var tasknos = selectTasknos.toString()
-        //   console.log(tasknos)
         //   getDbClList({tasknos: tasknos}).then((res) => {
-        //     console.log(res)
         //     this.duibiclList = res.result.resultVOList
         //     this.duiBi = true
         //   })
@@ -1262,16 +1295,13 @@ import { number } from 'echarts';
         //   var a = this.selectedRowKeys
         //   var ids = a.toString()
         //   getDbList({ids: ids}).then((res) => {
-        //     console.log(res)
         //     this.duibiList = res
         //   })
         //   var selectTasknos = this.selectionRows.map( res => {
         //     return res.taskno
         //   })
         //   var tasknos = selectTasknos.toString()
-        //   console.log(tasknos)
         //   getDbClList({tasknos: tasknos}).then((res) => {
-        //     console.log(res)
         //     this.duibiclList = res.result.resultVOList
         //     this.duiBi = true
         //   })
@@ -1279,16 +1309,13 @@ import { number } from 'echarts';
         // var a = this.selectedRowKeys
         // var ids = a.toString()
         // getDbList({ids: ids}).then((res) => {
-        //   console.log(res)
         //   this.duibiList = res
         // })
         // var selectTasknos = this.selectionRows.map( res => {
         //   return res.taskno
         // })
         // var tasknos = selectTasknos.toString()
-        // console.log(tasknos)
         // getDbClList({tasknos: tasknos}).then((res) => {
-        //   console.log(res)
         //   this.duibiclList = res
         //   this.duiBi = true
         // })
@@ -1301,7 +1328,7 @@ import { number } from 'echarts';
       },
       // 一键折叠展开
       handleExpand(){
-        console.log(this.isExpanded)
+        // console.log(this.isExpanded)
         if(this.isExpanded){
           // 当前为展开，全部折叠
           this.expandedRowKeys = []
@@ -1313,7 +1340,6 @@ import { number } from 'echarts';
       },
       onExpand (expanded, record) {
         if (expanded) {
-          console.log(record.id)
           // 设置展开窗Key，代表展开操作
           this.expandedRowKeys.push(record.id)
         } else {
@@ -1327,22 +1353,18 @@ import { number } from 'echarts';
       },
       // 虚实比对（堆叠图）
       handleXushi(record){
-        console.log(record)
         this.$refs.xushi.open(record)
       },
       // 加入产品模型
       handleAddProjectModel(record){
-        console.log(record)
         var arr = []
         arr.push(record)
         insertIntoProject(arr).then(response => {
-          console.log(response)
           this.loadData()
         })
       },
       // 比对禁选判断
       onSelectChange(selectedRowKeys, selectionRows) {
-        console.log(selectedRowKeys, selectionRows)
         // this.selectedRowKeys = selectedRowKeys;
         // this.selectionRows = selectionRows;
         // 解决分页后selectionRows只获取本页面勾选的问题
@@ -1358,14 +1380,14 @@ import { number } from 'echarts';
 
       },
       onSelect(record, selected, selectedRows, nativeEvent){
-        console.log(record, selected, selectedRows, nativeEvent)
-        console.log(this.selectionRows)
+        // console.log(record, selected, selectedRows, nativeEvent)
+        // console.log(this.selectionRows)
         if(selected) {
           if (this.selectionRows.length == 1) {
             this.chooseRowType = record.ji
             this.chooseStatus = true
           } else {
-            console.log(this.chooseRowType,record.ji)
+            // console.log(this.chooseRowType,record.ji)
             if (this.chooseRowType != record.ji) {
               this.chooseRowType = this.chooseRowType
               this.chooseStatus = true
@@ -1374,7 +1396,6 @@ import { number } from 'echarts';
               // this.chooseStatus = false
               for (let i = 0; i < this.selectionRows.length; i++) {
                 const element = this.selectionRows[i].ji;
-                console.log(888,this.chooseRowType,element)
                 if (this.chooseRowType != element) {
                   this.chooseStatus = true
                 } else {
@@ -1385,13 +1406,11 @@ import { number } from 'echarts';
           }
         } else{
           if (this.selectionRows.length == 1) {
-            console.log(777,this.selectionRows[0].ji)
             this.chooseRowType = this.selectionRows[0].ji
             this.chooseStatus = true
           } else {
             for (let i = 0; i < this.selectionRows.length; i++) {
               const element = this.selectionRows[i].ji;
-              console.log(888,this.chooseRowType,element)
               if (this.chooseRowType != element) {
                 this.chooseStatus = true
                 this.$message.error("请选择同级项进行比对");
@@ -1408,7 +1427,6 @@ import { number } from 'echarts';
             //   // this.chooseStatus = false
             //   for (let i = 0; i < selectedRows.length; i++) {
             //     const element = selectedRows[i].ji;
-            //     console.log(888,this.chooseRowType,element)
             //     if (this.chooseRowType != element) {
             //       this.chooseStatus = true
             //     } else {
@@ -1418,7 +1436,6 @@ import { number } from 'echarts';
             // }
           }
         }
-        // console.log(record.ji)
         // if (record.ji == '2') {
         //   // 选中二级，一级禁选
         //   this.chooseRowType == 'chengben'
@@ -1435,10 +1452,9 @@ import { number } from 'echarts';
         // if(this.selectedRowKeys && this.selectedRowKeys.length>0){
         //   param['selections'] = this.selectedRowKeys.join(",")
         // }
-        // console.log("导出参数",param)
         var param = {isFolding: value}
         downFile(this.url.exportXlsUrl,param).then((data)=>{
-          console.log(data)
+          // console.log(data)
           if (!data) {
             this.$message.warning("文件下载失败")
             return
@@ -1552,6 +1568,10 @@ import { number } from 'echarts';
   }
 </style>
 <style>
+  /* 超出预算 */
+  .exceed-budget-status{
+    color: #ffa300 !important;
+  }
   .table-kuisun-color{
     color: red !important;
     /* user-select: 'none'; */

src/views/module_kzks/projectXushiContrast/contrastGraph.vue

@@ -1,6 +1,6 @@
 <template>
-  <div style="height:600px;width:1000px; display:flex; justify-content:center; align-items:center;">
-      <div class="echarts" style="height:90%;width:100%;" ref="zhexian"></div>
+  <div style="height:600px;width:1000px;">
+    <div class="echarts" style="height:100%;width:100%;" ref="zhexian"></div>
   </div>
 </template>
 
@@ -8,129 +8,118 @@
 import * as echarts from 'echarts';
 require('echarts/theme/macarons') // echarts theme
 export default {
+  // props: ['echartsData'],
   data() {
     return {
-        model: {}
+      zheChart: null,
     }
   },
-  mounted () {
-    this.drawZhexian()
-    window.addEventListener("resize", () =>{
-      this.zheChart.resize();
-    });
-  },
+  // mounted () {
+  //   this.drawZhexian()
+  // },
+  // watch: {
+  //   echartsData: {
+  //     handler(newValue, oldValue){
+  //       console.log(newValue, oldValue)
+  //       if(newValue){
+  //         this.drawZhexian(newValue)
+  //       }
+  //     },
+  //     deep: true,
+  //     immediate: true
+  //   }
+  // },
   methods:{
-    // 获取数据
-    getList(record) {
-        console.log(1111,record)
-        this.model = Object.assign({}, record);
-        console.log(22222,this.model)
-        var yusuan = []
-        var zhixing = []
-        yusuan.push(this.model.clys)
-        yusuan.push(this.model.wxys)
-        var zongys = this.model.wxys + this.model.clys
-        yusuan.push(zongys)
-        zhixing.push(this.model.clf)
-        zhixing.push(this.model.wxf)
-        var zongzx = this.model.wxf + this.model.clf
-        zhixing.push(zongzx)
-        console.log(7777,yusuan,zhixing),
-        this.zheChart.setOption({
-            yAxis: [
-                {
-                type: 'category',
-                data: ['材料费','外协费','总计']
-                }
-            ],
-            series: [
-                {
-                name: '预算',
-                type: 'bar',
-                data: yusuan,
-                emphasis: {
-                    focus: 'series'
-                },
-                itemStyle: {
-                    normal: {
-                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-                            offset: 0,
-                            color: '#8FEEBB'
-                        }, {
-                            offset: 1,
-                            color: '#66DD9E'
-                        }]),
-                        // barBorderRadius: 11,
-                    }
-                    
-                },
-                },
-                {
-                name: '执行',
-                type: 'bar',
-                emphasis: {
-                    focus: 'series'
-                },
-                itemStyle: {
-                    normal: {
-                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-                            offset: 0,
-                            color: '#AEDFFA'
-                        }, {
-                            offset: 1,
-                            color: '#95C7FC'
-                        }]),
-                    // barBorderRadius: 11,
-                    }
-                },
-                data: zhixing
-                },
-                // {
-                // name: '外协费',
-                // type: 'bar',
-                // stack: 'Ad',
-                // emphasis: {
-                //     focus: 'series'
-                // },
-                // data: [that.model.wxf]
-                // },
-            ]
-        });
-    },
-    // 绘制折线图
-    drawZhexian(){
+    drawZhexian(data){
+      console.log(1111,data)
+      var yusuan = []
+      var zhixing = []
+      yusuan.push(data.clys)
+      yusuan.push(data.wxys)
+      var zongys = data.wxys + data.clys
+      yusuan.push(zongys)
+      zhixing.push(data.clf)
+      zhixing.push(data.wxf)
+      var zongzx = data.wxf + data.clf
+      zhixing.push(zongzx)
+      console.log(7777,yusuan,zhixing)
+
       var chartDom = this.$refs.zhexian
       this.zheChart = echarts.init(chartDom);
-
       var option;
 
-        option = {
-            tooltip: {
-                trigger: 'axis',
-                axisPointer: {
-                type: 'shadow'
-                }
+      option = {
+        tooltip: {
+          trigger: 'axis',
+            axisPointer: {
+            type: 'shadow'
+          }
+        },
+        legend: {},
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true
+        },
+        xAxis: [
+          {
+            type: 'value',
+          }
+        ],
+        yAxis: [
+          {
+            type: 'category',
+            data: ['材料费','外协费','总计']
+          }
+        ],
+        series: [
+          {
+            name: '预算',
+            type: 'bar',
+            data: yusuan,
+            emphasis: {
+              focus: 'series'
+            },
+            itemStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+                  offset: 0,
+                  color: '#8FEEBB'
+                }, {
+                  offset: 1,
+                  color: '#66DD9E'
+                }]),
+                  // barBorderRadius: 11,
+              }
+          },
+          },
+          {
+            name: '执行',
+            type: 'bar',
+            emphasis: {
+              focus: 'series'
             },
-            legend: {},
-            grid: {
-                left: '3%',
-                right: '4%',
-                bottom: '3%',
-                containLabel: true
+            itemStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+                  offset: 0,
+                  color: '#AEDFFA'
+                }, {
+                  offset: 1,
+                  color: '#95C7FC'
+                }]),
+              // barBorderRadius: 11,
+              }
             },
-            xAxis: [
-                {
-                type: 'value',
-                }
-            ],
-            // yAxis: [
-            //     {
-            //     type: 'category',
-            //     data: ['Mon']
-            //     }
-            // ],
-        };
-        option && this.zheChart.setOption(option);
+            data: zhixing
+          },
+        ]
+      };
+      option && this.zheChart.setOption(option);
+      window.addEventListener("resize", () =>{
+        this.zheChart.resize();
+      });
     },
   },
 }

src/views/module_kzks/projectXushiContrast/contrastModal.vue

@@ -1,44 +1,119 @@
 <template>
-   <j-modal
-      :width="width"
-      :visible="duiBi"
-      @cancel="handleGb">
-      
-      <contrast-graph ref="xushiDuibi"></contrast-graph>
+  <j-modal
+    :title="title"
+    :width="width"
+    :visible="visible"
+    switchFullscreen
+    cancelText="关闭"
+    @cancel="handleCancel">
+    <!-- :okButtonProps="{ class:{'jee-hidden': disableSubmit} }" -->
+    
+    <a-tabs :default-active-key="0" tab-position="left" @change="changeTab">
+      <a-tab-pane :key="index" :tab="item.title" v-for="(item, index) in chengbenTabs">
+        <div v-if="chooseTab === 'contractfpe' || chooseTab === 'taskmoney'">
+          日期范围：
+          <a-range-picker v-model="dateRange" @change="onChange"/>
+        </div>
+        <!-- 执行图 -->
+        <contrast-graph v-show="chooseTab === 'xushi'" ref="xushiDuibi" :echartsData="echartsData"></contrast-graph>
+        <!-- 合同额 -->
+        <contract-detail-list v-show="chooseTab === 'contractfpe'" :taskno="taskno"></contract-detail-list>
+        <!-- 已收款 -->
+        <collect-detail-list v-show="chooseTab === 'taskmoney'" :taskno="taskno"></collect-detail-list>
+        <!-- 总成本 -->
+        <chengben-detail-list v-if="chooseTab === 'zcb'" :taskno="taskno"></chengben-detail-list>
+        <!-- <clf-detail v-else-if="chooseTab === 0"></clf-detail> -->
+        <!-- <other-detail v-else :listUrl="listUrl"></other-detail> -->
+        <!-- <other-detail v-if="chooseTabIndex !== 0 && chooseTab === item.value" :listUrl="listUrl"></other-detail> -->
+      </a-tab-pane>
+    </a-tabs>
 
-      <template slot="footer">
-        <a-button @click="handleGb">关闭</a-button>
-      </template>
-    </j-modal>
+    <template slot="footer">
+      <a-button @click="handleCancel">关闭</a-button>
+    </template>
+  </j-modal>
 </template>
 
 <script>
-import contrastGraph from './contrastGraph.vue';
+  import contrastGraph from './contrastGraph.vue';
+  import CollectDetailList from './modulesDetail/CollectDetailList.vue';
+  import ContractDetailList from './modulesDetail/ContractDetailList.vue';
+  import ChengbenDetailList from './modulesDetail/ChengbenDetailList.vue';
 
   export default {
-  components: { contrastGraph },
+    components: {
+      contrastGraph,
+      ContractDetailList,
+      CollectDetailList,
+      ChengbenDetailList
+    },
     name: 'ContrastModal',
     data () {
       return {
-        title:'',
-        width:1100,
-        duiBi: false,
+        title:'详情',
+        width: 1200,
+        // width: '60%',
+        visible: false,
+        chengbenTabs: [
+          { title: '执行图', value: 'xushi'},
+          { title: '合同额', value: 'contractfpe'},
+          { title: '已收款', value: 'taskmoney'},
+          { title: '总成本', value: 'zcb'},
+          // { title: '材料费', value: 'clf', url: '/index/getClfDetailNew'},
+          // { title: '专用费', value: 'zyf', url: '/index/getZyfDetailNew'},
+          // { title: '事务费', value: 'swf', url: '/index/getSwfDetailNew'},
+          // { title: '外协费', value: 'wxf', url: '/index/getWxfDetailNew'},
+          // { title: '燃动费', value: 'rdf', url: '/index/getRdfDetailNew'},
+          // { title: '固资费', value: 'gzf', url: '/index/getZjfDetailNew'},
+          // { title: '人工费', value: 'rgf', url: '/index/getRgfDetailNew'},
+          // { title: '管理费', value: 'glf', url: '/index/getGlfDetailNew'},
+          // { title: '筛选费', value: 'sxf', url: '/index/getSxfDetailNew'},
+        ],
+        chooseTabIndex: 0,
+        chooseTab: 'xushi', // 为了解决用v-else会出现多个请求的问题
+        listUrl: '',
+        taskno: null,
+        echartsData: {},
+        dateRange: this.$store.getters.pcDateRange,
       }
     },
+    computed: {
+      // dateRange() {
+      //   return this.$store.getters.pcDateRange
+      // },
+    },
     methods: {
       open(record) {
-        this.duiBi = true;
+        var tasknos = record.children.map(item=>item.taskno)
+        this.taskno = tasknos.join(',')
+        // this.echartsData = record
+        this.visible = true
         this.$nextTick(()=>{
-          this.$refs.xushiDuibi.getList(record);
+          this.$refs.xushiDuibi[0].drawZhexian(record);
         })
       },
       close () {
         this.$emit('close');
-        this.duiBi = false;
+        this.visible = false;
       },
-      handleGb () {
+      handleCancel () {
+        // this.dateRange = []
+        this.$store.commit('SET_PCDATERANGE', []);
+        this.chooseTab = 'xushi'
         this.close()
-      }
+      },
+      changeTab(e){
+        this.chooseTabIndex = e
+        this.chooseTab = this.chengbenTabs[e].value
+        if(e !== 0){
+          this.listUrl = this.chengbenTabs[e].url
+        }
+      },
+      // 日期范围选择
+      onChange(date, dateString) {
+        // this.dateRange = dateString
+        this.$store.commit('SET_PCDATERANGE', dateString);
+      },
     }
   }
 </script>