telephone-clients 3.0.77 → 3.0.78

package/src/filiale/hanzhong/pc/StateStatistics.vue

@@ -1,292 +1,292 @@
-<template>
-  <div>
-    <span class="stateback" v-if="!type" @click="back()"><img src="../../../components/image/图层16.png">返回</span>
-    <div id="statistics"></div>
-  </div>
-</template>
-
-<script>
-    import * as DataSql from '../../../plugins/DataSql'
-    import * as Util from '../../../components/Util'
-
-    export default {
-        name: "StateStatistics",
-        data() {
-            return {
-                resdata: [],
-                year: Util.toStandardTimeString().substring(0, 4),
-                timer: '',
-                xc: '',
-                type: true,
-                param: '',
-            }
-        },
-        methods: {
-            back() {
-                //tag
-                this.type = true
-                this.getcall()
-            },
-            setBar() {
-                this.xc = this.$echarts.init(document.getElementById('statistics'))
-                var scale = 1
-                var grade = []
-                var echartsdata = []
-                var echartsdata1 = []
-                var echartsdata2 = []
-                var echartsdata3 = []
-                var echartsdata4 = []
-
-                for (var i = 0; i < this.resdata.length; i++) {
-                  grade.push(this.resdata[i].name)
-                    echartsdata.push(this.resdata[i].zongshu)
-                    echartsdata1.push(this.resdata[i].wancheng)
-                    echartsdata2.push(this.resdata[i].zongshu-this.resdata[i].wancheng)
-
-                }
-
-
-                var data = []
-                data.push(echartsdata)
-                data.push(echartsdata1)
-                data.push(echartsdata2)
-                data.push(echartsdata3)
-                data.push(echartsdata4)
-
-                var rich = {
-                    blue: {
-                        color: '#15dce2'
-                    },
-                    white: {
-                        color: '#fff'
-                    }
-                }
-                var unit = ''
-                if (this.type) {
-                    unit = '周'
-                } else {
-                    unit = '日'
-                }
-
-                var series = []
-                var name = ['派单量', '已完成', '未完成']
-                var color = ['#012c40', '#043144', '#0a3345', '#043144', '#0a3345', '#245ffe', '#245ffe']
-                var color1 = ['#6fd9d0', '#ee8686', '#5199f1', '#f1a758', '#245ffe', '#245ffe', '#245ffe']
-                for (var i = 0; i < 3; i++) {
-                    var s1 = {}
-                    s1 = {
-                        name: name[i],
-                        type: 'bar',
-                        // barGap: 0,
-                        barCategoryGap: '1%',
-                        barWidth: '10%',
-                        barGap: '0',
-                        data: data[i],
-                        hoverAnimation: false,
-                        label: {
-                            show: false,
-                            position: 'top',
-                            textStyle: { //数值样式
-                                color: '#fefefe',
-                                fontSize: 14 * scale
-                            }
-                        },
-                        itemStyle: {
-                            normal: {
-                                color: new this.$echarts.graphic.LinearGradient(0, 1, 0, 0, [{
-                                    offset: 0,
-                                    color: color[i]
-                                }, {
-                                    offset: 1,
-                                    color: color1[i]
-                                }], false),
-                                barBorderRadius: [7, 7, 0, 0],
-                                borderWidth: 0,
-                            },
-                        }
-                    }
-                    series.push(s1)
-                }
-
-                //tag
-
-                this.xc.setOption({
-                    title: {
-                        text: '当日工单详情',
-                        textAlign: 'left',
-                        padding: [10, 0, 0, 10],
-                        textStyle: {
-                            color: "#5cf5f5",
-                            fontSize: 16 * scale,
-                        }
-                    },
-                    legend: {//图例组件，颜色和名字
-                        right: '1%',
-                        top: '2%',
-                        itemGap: 16,
-                        itemWidth: 18,
-                        itemHeight: 10,
-                        textStyle: {
-                            color: ' #e3effb',
-                            fontStyle: 'normal',
-                            fontFamily: '微软雅黑',
-                            fontSize: 16,
-                        },
-                        data: name
-                    },
-                    tooltip: {
-                        alwaysShowContent: true,
-                        // position: function (point, params, dom, rect, size) {
-                        //     //其中point为当前鼠标的位置，size中有两个属性：viewSize和contentSize，分别为外层div和tooltip提示框的大小
-                        //     var x = point[0]; //
-                        //     var y = point[1];
-                        //     var viewWidth = size.viewSize[0];
-                        //     var viewHeight = size.viewSize[1];
-                        //     var boxWidth = size.contentSize[0];
-                        //     var boxHeight = size.contentSize[1];
-                        //     var posX = 0; //x坐标位置
-                        //     var posY = 0; //y坐标位置
-                        //     if (x < boxWidth) { //左边放不开
-                        //         posX = 5;
-                        //     } else { //左边放的下
-                        //         posX = x - boxWidth;
-                        //     }
-                        //
-                        //     if (y < boxHeight) { //上边放不开
-                        //         posY = 5;
-                        //     } else { //上边放得下
-                        //         posY = y - boxHeight;
-                        //     }
-                        //     return [posX, posY];
-                        // },
-                        formatter: function (params) {
-                            var result = ''
-                            var color = ['#6fd9d0', '#ee8686', '#5199f1', '#f1a758', '#245ffe', '#245ffe', '#245ffe']
-                            var i = 0
-                            params.forEach(function (item) {
-                                result += "<span style=\"text-align: left\"><span style=\"display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:" + color[i] + "\"></span>" + " " + item.seriesName + "&nbsp;&nbsp; <span style=\"color:#e1e52a;\">" + item.value + "&nbsp;&nbsp; </span></span></br>";
-                                i++
-                            });
-                            return "<div style='text-align: center;height: 1px'>" + params[0].name + '' + '</div><br/>' + result
-                        },
-                        backgroundColor: 'rgba(0, 101, 113, 0.66)',
-                        // borderColor :'rgba(13, 109, 180)',
-                        borderWidth: 0,
-                        hideDelay: 100,
-                        triggerOn: 'mousemove',
-                        enterable: true,
-                        padding: 10,
-                        trigger: 'axis',
-                        axisPointer: { // 坐标轴指示器，坐标轴触发有效
-                            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
-                        },
-                        extraCssText: 'width: auto;height: auto;',
-                    },
-                    grid: {
-                        left: '4%',
-                        right: '4%',
-                        top: '18%',
-                        bottom: '10%'
-                    },
-                    xAxis: [{
-                        name: '',
-                        type: 'category',
-                        nameTextStyle: {
-                            fontSize: 14 * scale,
-                            color: '#4ed6d9',
-                            padding: [48 * scale, 0, 0, -50 * scale],
-                        },
-                        axisLine: {show: true, lineStyle: {color: '#08738e', width: 1}},
-                        axisLabel: {interval: 0, textStyle: {color: '#e3effb', fontSize: 14 * scale}},
-                        axisTick: {show: false},
-                        data: grade,
-                    }],
-                    yAxis: [{
-                        name: '',
-                        type: 'value',
-                        nameTextStyle: {
-                            fontSize: 14 * scale,
-                            padding: [-10 * scale, 35 * scale, 0, 0],
-                        },
-                        axisTick: {show: false},
-                        splitLine: {show: true, lineStyle: {type: 'dashed', color: '#03556a'}},
-                        axisLabel: {interval: 0, textStyle: {color: '#e3effb', fontSize: 14 * scale}},
-                        axisLine: {show: false, lineStyle: {color: '#08738e', fontSize: 14 * scale}},
-                    }],
-                    series: series
-                })
-                let idx = -1;
-                var dataLen = echartsdata.length
-                var oroptionmapjsonr_charts1 = this.xc
-                this.timer = setInterval(() => {
-                  //tag
-                  dataLen = (dataLen + 1) % 8;
-                    oroptionmapjsonr_charts1.dispatchAction({
-                        type: 'showTip',
-                        seriesIndex: 1,
-                        dataIndex: dataLen
-                    });
-
-                }, 3000)
-                this.xc.on("click", this.eConsole)
-            },
-            eConsole(param) {
-                //tag
-                if (this.type) {
-                    this.type = false
-                    this.param = param.name - 1
-                    this.getcall()
-                }
-            },
-            getcall() {
-
-                this.claerdata()
-
-                var condition = {}
-              var nowdate = Util.toStandardTimeString()
-                var condition2 = {
-                startdate: nowdate.substring(0, 10)
-              }
-                if (this.type) {
-                    condition = {
-                        condition: 'datediff(dd,\'' + Util.getMthon() + '\',z.rq)',
-                        startdate: Util.getMthon(),
-                        datecon: '1=1'
-                    }
-                } else {
-                    condition = {
-                        condition: 'z.rq',
-                        startdate: Util.getMthon(),
-                        datecon: 'datediff(dd,\'' + Util.getMthon() + '\',z.rq)=' + this.param
-                    }
-                }
-                DataSql.getData(this, 'getDayWork', {yearmonthday:condition2.startdate}, 'resdata')
-
-            },
-            claerdata() {
-                // this.echartsdata.splice(0, this.echartsdata.length)
-                clearInterval(this.timer)
-            }
-        },
-        beforeDestroy() {
-            //清除定时器
-            clearInterval(this.timer);
-        },
-        watch: {
-            'resdata': {
-                deep: true,
-                handler(val) {
-                    //tag
-                    this.setBar()
-                }
-            },
-        },
-        ready() {
-            // this.getcall()
-        }
-    }
-</script>
-
-<style scoped>
-
-</style>
+<template>
+  <div>
+    <span class="stateback" v-if="!type" @click="back()"><img src="../../../components/image/图层16.png">返回</span>
+    <div id="statistics"></div>
+  </div>
+</template>
+
+<script>
+    import * as DataSql from '../../../plugins/DataSql'
+    import * as Util from '../../../components/Util'
+
+    export default {
+        name: "StateStatistics",
+        data() {
+            return {
+                resdata: [],
+                year: Util.toStandardTimeString().substring(0, 4),
+                timer: '',
+                xc: '',
+                type: true,
+                param: '',
+            }
+        },
+        methods: {
+            back() {
+                //tag
+                this.type = true
+                this.getcall()
+            },
+            setBar() {
+                this.xc = this.$echarts.init(document.getElementById('statistics'))
+                var scale = 1
+                var grade = []
+                var echartsdata = []
+                var echartsdata1 = []
+                var echartsdata2 = []
+                var echartsdata3 = []
+                var echartsdata4 = []
+
+                for (var i = 0; i < this.resdata.length; i++) {
+                  grade.push(this.resdata[i].name)
+                    echartsdata.push(this.resdata[i].zongshu)
+                    echartsdata1.push(this.resdata[i].wancheng)
+                    echartsdata2.push(this.resdata[i].zongshu-this.resdata[i].wancheng)
+
+                }
+
+
+                var data = []
+                data.push(echartsdata)
+                data.push(echartsdata1)
+                data.push(echartsdata2)
+                data.push(echartsdata3)
+                data.push(echartsdata4)
+
+                var rich = {
+                    blue: {
+                        color: '#15dce2'
+                    },
+                    white: {
+                        color: '#fff'
+                    }
+                }
+                var unit = ''
+                if (this.type) {
+                    unit = '周'
+                } else {
+                    unit = '日'
+                }
+
+                var series = []
+                var name = ['派单量', '已完成', '未完成']
+                var color = ['#012c40', '#043144', '#0a3345', '#043144', '#0a3345', '#245ffe', '#245ffe']
+                var color1 = ['#6fd9d0', '#ee8686', '#5199f1', '#f1a758', '#245ffe', '#245ffe', '#245ffe']
+                for (var i = 0; i < 3; i++) {
+                    var s1 = {}
+                    s1 = {
+                        name: name[i],
+                        type: 'bar',
+                        // barGap: 0,
+                        barCategoryGap: '1%',
+                        barWidth: '10%',
+                        barGap: '0',
+                        data: data[i],
+                        hoverAnimation: false,
+                        label: {
+                            show: false,
+                            position: 'top',
+                            textStyle: { //数值样式
+                                color: '#fefefe',
+                                fontSize: 14 * scale
+                            }
+                        },
+                        itemStyle: {
+                            normal: {
+                                color: new this.$echarts.graphic.LinearGradient(0, 1, 0, 0, [{
+                                    offset: 0,
+                                    color: color[i]
+                                }, {
+                                    offset: 1,
+                                    color: color1[i]
+                                }], false),
+                                barBorderRadius: [7, 7, 0, 0],
+                                borderWidth: 0,
+                            },
+                        }
+                    }
+                    series.push(s1)
+                }
+
+                //tag
+
+                this.xc.setOption({
+                    title: {
+                        text: '当日工单详情',
+                        textAlign: 'left',
+                        padding: [10, 0, 0, 10],
+                        textStyle: {
+                            color: "#5cf5f5",
+                            fontSize: 16 * scale,
+                        }
+                    },
+                    legend: {//图例组件，颜色和名字
+                        right: '1%',
+                        top: '2%',
+                        itemGap: 16,
+                        itemWidth: 18,
+                        itemHeight: 10,
+                        textStyle: {
+                            color: ' #e3effb',
+                            fontStyle: 'normal',
+                            fontFamily: '微软雅黑',
+                            fontSize: 16,
+                        },
+                        data: name
+                    },
+                    tooltip: {
+                        alwaysShowContent: true,
+                        // position: function (point, params, dom, rect, size) {
+                        //     //其中point为当前鼠标的位置，size中有两个属性：viewSize和contentSize，分别为外层div和tooltip提示框的大小
+                        //     var x = point[0]; //
+                        //     var y = point[1];
+                        //     var viewWidth = size.viewSize[0];
+                        //     var viewHeight = size.viewSize[1];
+                        //     var boxWidth = size.contentSize[0];
+                        //     var boxHeight = size.contentSize[1];
+                        //     var posX = 0; //x坐标位置
+                        //     var posY = 0; //y坐标位置
+                        //     if (x < boxWidth) { //左边放不开
+                        //         posX = 5;
+                        //     } else { //左边放的下
+                        //         posX = x - boxWidth;
+                        //     }
+                        //
+                        //     if (y < boxHeight) { //上边放不开
+                        //         posY = 5;
+                        //     } else { //上边放得下
+                        //         posY = y - boxHeight;
+                        //     }
+                        //     return [posX, posY];
+                        // },
+                        formatter: function (params) {
+                            var result = ''
+                            var color = ['#6fd9d0', '#ee8686', '#5199f1', '#f1a758', '#245ffe', '#245ffe', '#245ffe']
+                            var i = 0
+                            params.forEach(function (item) {
+                                result += "<span style=\"text-align: left\"><span style=\"display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:" + color[i] + "\"></span>" + " " + item.seriesName + "&nbsp;&nbsp; <span style=\"color:#e1e52a;\">" + item.value + "&nbsp;&nbsp; </span></span></br>";
+                                i++
+                            });
+                            return "<div style='text-align: center;height: 1px'>" + params[0].name + '' + '</div><br/>' + result
+                        },
+                        backgroundColor: 'rgba(0, 101, 113, 0.66)',
+                        // borderColor :'rgba(13, 109, 180)',
+                        borderWidth: 0,
+                        hideDelay: 100,
+                        triggerOn: 'mousemove',
+                        enterable: true,
+                        padding: 10,
+                        trigger: 'axis',
+                        axisPointer: { // 坐标轴指示器，坐标轴触发有效
+                            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+                        },
+                        extraCssText: 'width: auto;height: auto;',
+                    },
+                    grid: {
+                        left: '4%',
+                        right: '4%',
+                        top: '18%',
+                        bottom: '10%'
+                    },
+                    xAxis: [{
+                        name: '',
+                        type: 'category',
+                        nameTextStyle: {
+                            fontSize: 14 * scale,
+                            color: '#4ed6d9',
+                            padding: [48 * scale, 0, 0, -50 * scale],
+                        },
+                        axisLine: {show: true, lineStyle: {color: '#08738e', width: 1}},
+                        axisLabel: {interval: 0, textStyle: {color: '#e3effb', fontSize: 14 * scale}},
+                        axisTick: {show: false},
+                        data: grade,
+                    }],
+                    yAxis: [{
+                        name: '',
+                        type: 'value',
+                        nameTextStyle: {
+                            fontSize: 14 * scale,
+                            padding: [-10 * scale, 35 * scale, 0, 0],
+                        },
+                        axisTick: {show: false},
+                        splitLine: {show: true, lineStyle: {type: 'dashed', color: '#03556a'}},
+                        axisLabel: {interval: 0, textStyle: {color: '#e3effb', fontSize: 14 * scale}},
+                        axisLine: {show: false, lineStyle: {color: '#08738e', fontSize: 14 * scale}},
+                    }],
+                    series: series
+                })
+                let idx = -1;
+                var dataLen = echartsdata.length
+                var oroptionmapjsonr_charts1 = this.xc
+                this.timer = setInterval(() => {
+                  //tag
+                  dataLen = (dataLen + 1) % 8;
+                    oroptionmapjsonr_charts1.dispatchAction({
+                        type: 'showTip',
+                        seriesIndex: 1,
+                        dataIndex: dataLen
+                    });
+
+                }, 3000)
+                this.xc.on("click", this.eConsole)
+            },
+            eConsole(param) {
+                //tag
+                if (this.type) {
+                    this.type = false
+                    this.param = param.name - 1
+                    this.getcall()
+                }
+            },
+            getcall() {
+
+                this.claerdata()
+
+                var condition = {}
+              var nowdate = Util.toStandardTimeString()
+                var condition2 = {
+                startdate: nowdate.substring(0, 10)
+              }
+                if (this.type) {
+                    condition = {
+                        condition: 'datediff(dd,\'' + Util.getMthon() + '\',z.rq)',
+                        startdate: Util.getMthon(),
+                        datecon: '1=1'
+                    }
+                } else {
+                    condition = {
+                        condition: 'z.rq',
+                        startdate: Util.getMthon(),
+                        datecon: 'datediff(dd,\'' + Util.getMthon() + '\',z.rq)=' + this.param
+                    }
+                }
+                DataSql.getData(this, 'getDayWork', {yearmonthday:condition2.startdate}, 'resdata')
+
+            },
+            claerdata() {
+                // this.echartsdata.splice(0, this.echartsdata.length)
+                clearInterval(this.timer)
+            }
+        },
+        beforeDestroy() {
+            //清除定时器
+            clearInterval(this.timer);
+        },
+        watch: {
+            'resdata': {
+                deep: true,
+                handler(val) {
+                    //tag
+                    this.setBar()
+                }
+            },
+        },
+        ready() {
+            // this.getcall()
+        }
+    }
+</script>
+
+<style scoped>
+
+</style>