Browse Source

2022.9.27 成本统计前端优化

ggooalice 2 năm trước cách đây
mục cha
commit
90745c5ed4

+ 2 - 2
fhKeeper/formulahousekeeper/timesheet/src/views/corpreport/list.vue

@@ -541,10 +541,10 @@
                 <el-table-column prop="userName" :label="$t('ren-yuan')" min-width="200" align="center">
                   <template slot-scope="scope" >
                     <span v-if="user.userNameNeedTranslate == '1'">
-                      <ww-open-data type='userName' :openid='scope.row.username'></ww-open-data>
+                      <ww-open-data type='userName' :openid='scope.row.userName'></ww-open-data>
                     </span>
                     <span v-if="user.userNameNeedTranslate != '1'">
-                      {{scope.row.username}}
+                      {{scope.row.userName}}
                     </span>
                   </template>
                 </el-table-column>

+ 73 - 203
fhKeeper/formulahousekeeper/timesheet/src/views/project/cost.vue

@@ -58,7 +58,7 @@
              <div id="container" :style="'height:'+containerHeight+'px;width:100%'"></div>
         </div> -->
         <div id="clearfix" :class="radio == $t('ren-yuan') ? 'ryuans' : ''" :style="'overflow-x: auto;width:100%;padding-bottom: 100px; position: relative; height:'+containerHeight+'px;'">
-            <div id="container" :style="'height:'+containerHeight+'px;width:100%'"></div>
+            <div id="container" :style="'height:'+(containerHeight - 20)+'px;width:100%'"></div>
             <div class="poss">
                 <el-pagination
                   @size-change="echartsSizeChange"
@@ -165,6 +165,7 @@
     export default {
         data() {
             return {
+                allListData: [],
                 page: 1,
                 size: 50,
                 total: 0,
@@ -203,6 +204,14 @@
             };
         },
         methods: {
+            echartsCurrentChange(){
+                if(this.radio == this.$t('ren-yuan')){
+                    this.gtff()
+                }else{
+                    this.jieliu_echarts()
+                }
+                
+            },
             //Y轴点击改变显示的数据
             onYAxisChange() {
                 localStorage.yAxisValue = this.yAxisValue;
@@ -380,6 +389,7 @@
             },
             // 人员筛选
             personnel() {
+                this.page = 1
                 if(this.personnelValue) {
                     var arrlist = JSON.parse(JSON.stringify(this.personnelAll))
                     var arr = []
@@ -389,9 +399,11 @@
                         }
                     }
                     arrlist.list = arr
-                    this.gtff(arrlist)
+                    this.allListData = arrlist
+                    this.gtff()
                 } else {
-                    this.gtff(this.personnelAll)
+                    this.allListData = this.personnelAll
+                    this.gtff()
                 }
             },
             //获取人员成本统计列表
@@ -419,169 +431,11 @@
                     this.hasReportUserList = [];
                     if (res.code == "ok") {
                         // 
-                            // var sss = []
-                            // var ddd = []
-                            // for(var i = 0; i < 120; i++) {
-                            //     sss.push(res.data.list[0])
-                            //     ddd.push(res.data.userList[0])
-                            // }
-                            // res.data.list = sss
-                            // res.data.userList = ddd
-                            for(var i in res.data.list) {
-                                if(i>20) {
-                                    // this.widthHtval = +this.widthHtval + 2
-                                    this.widthHtval = +this.widthHtval + 40
-                                } else {
-                                    this.widthHtval = document.body.clientWidth - 230
-                                }
-                            }
+                            
                         // 
                         this.personnelAll = res.data
-                        this.gtff(res.data)
-                        //工时总成本
-                        // this.hasReportUserList = res.data.userList;
-                        // var xList = [] yList = [] , list = res.data.list, array = [] , series = [];
-                        // var totalMoneyCost = res.data.totalCostMoney;
-                        // var totalHours = 0.0;
-                        // if (list.length > 0) {
-                        //     var num = list.length==0?0:list[0].project.length;
-                        //     for(var i in list) {
-                        //         xList.push(list[i].name);
-                        //         var pro = list[i].project;
-                        //         for(var j in pro) {
-                        //             if(array.indexOf(pro[j].project) == -1) {
-                        //                 array.push(pro[j].project)
-                        //             }
-                        //         }
-                        //     }
-
-                        //     for(var i in array) {
-                        //         yList.push(array[i]);
-                        //         var dataList = [];
-                        //         for(var j in list) {
-                        //             var project = list[j].project , num = 0;
-                        //             if(project.length != 0) {
-                        //                 for(var k in project) {
-                        //                     if(project[k].project == array[i]) {
-                        //                         dataList.push({
-                        //                             "value": this.yAxisValue==0?project[k].money:project[k].time,
-                        //                             "cost": project[k].time,
-                        //                              "money":project[k].money
-                        //                         })
-                        //                         totalHours += parseFloat(project[k].time);
-                        //                     } else {
-                        //                         num++;
-                        //                     }
-                        //                     if(k == project.length-1 && num != project.length-1) {
-                        //                         dataList.push({
-                        //                             "value": 0,
-                        //                             "cost": 0,
-                        //                             "money":0,
-                        //                         })
-                        //                     }
-                        //                 }
-                        //             } else {
-                        //                 dataList.push({
-                        //                     "value": 0,
-                        //                     "cost": 0,
-                        //                     "money":0,
-                        //                 })
-                        //             }
-                        //         }
-                        //         series.push({
-                        //             name: array[i],
-                        //             type: 'bar',
-                        //             stack:'1',
-                        //             barMaxWidth: 30,
-                        //             data: dataList,
-                        //         })
-                        //     }
-                        // } 
-                            
-                            
-                        //     var myChart = echarts.init(document.getElementById("container"));
-                        //     totalHours = totalHours.toFixed(1);
-                        //     // 设置宽度
-                        //     myChart.resize({
-                        //         width: this.widthHtval
-                        //     })
-                        //     // 设置宽度
-                        //     _this.myChart = myChart;
-                        //     var option = {
-                        //         //总成本
-                        //         title: {
-                        //             text: '工时成本总计' + totalMoneyCost.toFixed(2) + '元, 时长'+totalHours+'小时',
-                        //             left:'left',
-                        //         },
-                        //         // 工具箱
-                        //         legend: {
-                        //             x: 80,
-                        //             y: 10,
-                        //             data: yList,
-                        //             show: true,
-                        //        top:"5%",//与上方的距离 可百分比% 可像素px
-                        //         },
-                        //         grid : {
-                        //             top : 80,    //距离容器上边界40像素
-                        //             // bottom: 100,   //距离容器下边界30像素
-                        //             bottom: 35,   //距离容器下边界30像素
-                        //             left: 150,
-                        //             right: 150
-                        //         },
-                        //         toolbox: {
-                        //             show: true,
-                        //             feature:{
-                        //                 saveAsImage:{
-                        //                     show:true
-                        //                 },
-                        //                 restore:{
-                        //                     show:true
-                        //                 },
-                        //                 // dataView:{
-                        //                 //     show:true
-                        //                 // },
-                        //                 // dataZoom:{
-                        //                 //     show:true
-                        //                 // },
-                        //                 magicType:{
-                        //                     type:['line','bar']
-                        //                 }
-                        //             }
-                        //         },
-                        //         tooltip:{
-                        //             trigger:'axis',
-                        //             formatter: function (params,ticket,callback) {
-                        //                 var totalTime = 0;
-                        //                 var totalCost = 0;
-                        //                 var res = "";
-                        //                 for(var i in params) {
-                        //                     if (params[i].data.value > 0) {
-                        //                         res += "<div style='margin-top:3px;font-size:12px;'><font color='#ddd'>项目名称:" + params[i].seriesName 
-                        //                             + "</font><br/>工作成本 : " + params[i].data.money
-                        //                             + "元 <br/>工作时长"+" : " + params[i].data.cost + "小时</br></div>";
-                        //                         totalTime += Number(params[i].data.cost);
-                        //                         totalCost += Number(params[i].data.money);
-                        //                     }
-                        //                 }
-                        //                 res = res +'<br/>'+ params[0].name+ '<br/>总计: ' + totalTime.toFixed(1)+'小时 '+totalCost.toFixed(2) + "元<br/>";
-                        //                 return res;
-                        //             }
-                        //         },
-                        //         xAxis: {
-                        //             data: xList,
-                        //             axisLabel: {
-                        //                 interval:0,rotate:20
-                        //             }
-                        //         },
-                        //         yAxis: [{
-                        //             type : 'value',
-                        //             axisLabel: {
-                        //                 formatter:this.yAxisValue==0?'{value} (元)':'{value} (小时)'
-                        //             }
-                        //         }],
-                        //         series: series,
-                        //     };
-                        //     myChart.setOption(option,{notMerge:true});
+                        this.allListData = res.data
+                        this.gtff()
                     } else {
                         this.$message({
                         message: res.msg,
@@ -598,12 +452,20 @@
                 });
             },
             // 共同方法
-            gtff(data) {
+            gtff() {
+                let data = this.allListData
                 var _this = this;
                 this.hasReportUserList = data.userList;
-                var xList = [] , yList = [] , list = data.list, array = [] , series = [];
+                var xList = [] , yList = [] , list = data.list.slice(0+50*(this.page-1),49+50*(this.page-1)), array = [] , series = [];
                 var totalMoneyCost = data.totalCostMoney;
                 var totalHours = 0.0;
+                for(var i in list) {
+                    if(i>20) {
+                        this.widthHtval = +this.widthHtval + 60
+                    } else {
+                        this.widthHtval = document.body.clientWidth - 230
+                    }
+                }
                 if (list.length > 0) {
                     var num = list.length==0?0:list[0].project.length;
                     console.log('for 1');
@@ -840,7 +702,7 @@
             // 脱离出来的方法
             jieliu() {
                 sessionStorage.radio = this.radio;
-                var _this = this;
+                
                 var param = {};
                 if (this.dateRange != null) {
                     param = {
@@ -877,22 +739,28 @@
                 this.http.post(url, param,
                 res => {
                     if (res.code == "ok") {
-                        // 更具数据的长度去加每个柱子的间距
-                        for(var i in res.data.costList) {
-                            if(i>20) {
-                                this.widthHtval = +this.widthHtval + 40
-                            } else {
-                                this.widthHtval = document.body.clientWidth - 230
-                            }
-                        }
-                        // console.log(this.dayjs().add('0','day').format("YYYY-MM-DD HH:mm:ss"), '结束处理')
-                        // if(res.data.costList.length > 20) {
-                        //     for(var i in res.data.costList) {
-                        //         this.widthHtval = +this.widthHtval + 40
-                        //     }
-                        // } else {
-                        //     this.widthHtval = document.body.clientWidth - 230
-                        // }
+                        this.allListData = res.data
+                        this.page = 1
+                        
+                        this.jieliu_echarts()
+                    } else {
+                        this.$message({
+                            message: res.msg,
+                            type: "error"
+                        });
+                    }
+                },
+                error => {
+                    this.$message({
+                        message: error,
+                        type: "error"
+                    });
+                });
+            },
+            jieliu_echarts(){
+                var _this = this;
+                // 更具数据的长度去加每个柱子的间距
+                        
 
                         var xList = []
                         var yList = []
@@ -900,8 +768,18 @@
                         var totalMoneyCost;
                         var totalHours = 0.0;
                         if(this.radio == this.$t('other.project') || this.radio == this.$t('projectclassification') || this.radio==this.$t('lable.department') || this.radio == this.$t('zhu-xiang-mu')) {
-                            list = res.data.costList
-                            totalMoneyCost = ((this.radio==this.$t('other.project') || this.radio == this.$t('projectclassification'))?res.data.totalMoneyCost:res.data.totalCostMoney);
+                            // this.allListData = res.data.costList
+                            this.total = this.allListData.costList.length
+                            list = this.allListData.costList.slice(0+50*(this.page-1),49+50*(this.page-1))
+                            for(var i in list) {
+                                if(i>20) {
+                                    this.widthHtval = +this.widthHtval + 60
+                                } else {
+                                    this.widthHtval = document.body.clientWidth - 230
+                                }
+                            }
+                            // list = res.data.costList
+                            totalMoneyCost = ((this.radio==this.$t('other.project') || this.radio == this.$t('projectclassification'))?this.allListData.totalMoneyCost:this.allListData.totalCostMoney);
 
                             for(var i in list) {
                                 if(this.radio==this.$t('other.project') || this.radio == this.$t('zhu-xiang-mu')) {
@@ -963,7 +841,10 @@
                             }
                         } 
                         else if(this.theCustomListFlg) {
-                            list = res.data.list
+                            // this.allListData = res.data.list
+                            this.total = this.allListData.list.length
+                            list = this.allListData.list.slice(0+50*(this.page-1),49+50*(this.page-1))
+                            // list = res.data.list
                             
                             for(var i in list) {
                                 // console.log(list[i].name, list[i].costMoney, list[i].cost)
@@ -986,7 +867,10 @@
                             }
                         } 
                         else {
-                            list = res.data
+                            // list = res.data
+                            // this.allListData = res.data
+                            this.total = this.allListData.length
+                            list = this.allListData.slice(0+50*(this.page-1),49+50*(this.page-1))
                             
                             for(var i in list) {
                                 // console.log(list[i].name, list[i].costMoney, list[i].cost)
@@ -1009,8 +893,7 @@
                             }
                         }
                         totalHours = totalHours.toFixed(1);
-                                            
-                        var myChart = echarts.init(document.getElementById("container"));
+                var myChart = echarts.init(document.getElementById("container"));
                         myChart.resize({
                             width: this.widthHtval
                         })
@@ -1162,19 +1045,6 @@
                                 }
                             }
                         });
-                    } else {
-                        this.$message({
-                            message: res.msg,
-                            type: "error"
-                        });
-                    }
-                },
-                error => {
-                    this.$message({
-                        message: error,
-                        type: "error"
-                    });
-                });
             },
 
             // 左右滚动
@@ -1335,7 +1205,7 @@
     }
     .poss {
         position: fixed;
-        bottom: 4px;
+        bottom: -10px;
         right: 1%;
         box-sizing: border-box;
     }