manage-client 3.2.33 → 3.2.37

package/src/components/ManageHome/CustomerService/ServiceStatistics.vue

@@ -1,147 +1,147 @@
-<template>
-  <div>
-  <div class="label">每月话务统计</div>
-  <div id="servicestatistics" class="d1"></div>
-</div>
-</template>
-
-<script>
-  export default {
-    name: "servicestatistics",
-    data() {
-      return {
-        xc: '',
-      }
-    },
-    methods: {
-      setBar() {
-        this.xc = this.$echarts.init(document.getElementById('servicestatistics'))
-        var scale = 0.8
-        var xAxisData = ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '', ''];
-        var legendData = ['月累计热线话务量', '月累计咨询量', '月累计派单数'];
-        var serieData = [];
-        var metaDate = [
-          [120, 140, 100, 120, 300, 230, 130, 170, 140, 120, 300, 230],
-          [200, 120, 300, 200, 170, 300, 200, 180, 200, 190, 300, 200],
-          [100, 200, 140, 300, 200, 180, 100, 300, 230, 130, 100, 300]
-        ]
-        for (var v = 0; v < legendData.length; v++) {
-          var serie = {
-            name: legendData[v],
-            type: 'line',
-            symbol: "circle",
-            symbolSize: 5 * scale,
-            itemStyle: {
-              normal: {
-                lineStyle: {
-                  width: 1,
-                  shadowBlur: 10 * scale,
-                  shadowOffsetY: 15 * scale,
-                }
-              }
-            },
-            data: metaDate[v]
-          }
-          serieData.push(serie)
-        }
-        var colors = ["#6fd9d0", "#6e93e0", "#f7cb32", "#2EF7F3", "#FFFFFF"];
-
-        this.xc.setOption({
-          title: {
-            text: '',
-            textAlign: 'left',
-            textStyle: {color: "#FFFFFF", fontSize: 20 * scale, fontWeight: "normal"}
-          },
-          legend: {
-            itemGap: 0,
-            width: '90%',
-            show: true,
-            left: "right",
-            bottom:'1%',
-            data: legendData,
-            y: 'top',
-            // padding: [0, 25*scale, 0, 0],
-            itemWidth: 14 * scale,
-            itemHeight: 6 * scale,
-            textStyle: {width: '20%', color: "#15dce2", fontSize: 12 * scale},
-          },
-          color: colors,
-          grid: {left: '5%', top: "22%", bottom: "5%", right: "5%", width: '90%', containLabel: true},
-          tooltip: {
-            formatter: function (params) {
-              if (params[0].data == '') {
-                return ''
-              }
-              var result = ''
-              params.forEach(function (item) {
-                result += item.marker + " " + item.seriesName + " : " + item.value + "</br>";
-              });
-              return params[0].axisValue + '月<br/>' + result
-            },
-            trigger: 'axis',
-            axisPointer: {type: 'line', lineStyle: {width: 0}},
-            extraCssText: 'width: auto;height: auto;'
-          },
-          xAxis: [
-            {
-              name: '      月份\n(2018-2019)',
-              type: 'category',
-              nameTextStyle: {
-                fontSize: 12 * scale,
-                color: '#15dce2',
-                padding: [38, 0, 0, -80 * scale],
-              },
-              axisLine: {show: true, lineStyle: {color: '#04669e', width: 1}},
-              axisLabel: {interval: 0, textStyle: {color: '#ffffff', fontSize: 14 * scale}},
-              axisTick: {show: false},
-              data: xAxisData,
-            },
-          ],
-          yAxis: [
-            {
-              name: '数量',
-              nameTextStyle: {
-                fontSize: 12 * scale,
-                padding: [0, 35 * scale, 0, 0],
-              },
-              axisTick: {show: false},
-              splitLine: {show: true, lineStyle: {type: 'dashed', color: '#004371'}},
-              axisLabel: {textStyle: {color: '#15dce2', fontSize: 14 * scale}},
-              axisLine: {show: false, lineStyle: {color: '#15dce2', fontSize: 14 * scale}},
-            },
-          ],
-          series: serieData
-        })
-      },
-      selfAdaption() {
-        let _this = this
-        setTimeout(() => {
-          window.addEventListener('resize', function () {
-            _this.xc.resize()
-          })
-        }, 10)
-      }
-    },
-    mounted() {
-      // this.selfAdaption()
-    },
-    ready() {
-      this.setBar()
-    }
-  }
-</script>
-
-<style scoped>
-  .label {
-    margin-left: 6%;
-    font-size: 0.85em;
-    color: #fff;
-    height: 8%;
-  }
-
-  #servicestatistics {
-    height: 88%;
-    width: 99%;
-    padding: 1% 2% 3% 2%;
-  }
-</style>
+<template>
+  <div>
+  <div class="label">每月话务统计</div>
+  <div id="servicestatistics" class="d1"></div>
+</div>
+</template>
+
+<script>
+  export default {
+    name: "servicestatistics",
+    data() {
+      return {
+        xc: '',
+      }
+    },
+    methods: {
+      setBar() {
+        this.xc = this.$echarts.init(document.getElementById('servicestatistics'))
+        var scale = 0.8
+        var xAxisData = ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '', ''];
+        var legendData = ['月累计热线话务量', '月累计咨询量', '月累计派单数'];
+        var serieData = [];
+        var metaDate = [
+          [120, 140, 100, 120, 300, 230, 130, 170, 140, 120, 300, 230],
+          [200, 120, 300, 200, 170, 300, 200, 180, 200, 190, 300, 200],
+          [100, 200, 140, 300, 200, 180, 100, 300, 230, 130, 100, 300]
+        ]
+        for (var v = 0; v < legendData.length; v++) {
+          var serie = {
+            name: legendData[v],
+            type: 'line',
+            symbol: "circle",
+            symbolSize: 5 * scale,
+            itemStyle: {
+              normal: {
+                lineStyle: {
+                  width: 1,
+                  shadowBlur: 10 * scale,
+                  shadowOffsetY: 15 * scale,
+                }
+              }
+            },
+            data: metaDate[v]
+          }
+          serieData.push(serie)
+        }
+        var colors = ["#6fd9d0", "#6e93e0", "#f7cb32", "#2EF7F3", "#FFFFFF"];
+
+        this.xc.setOption({
+          title: {
+            text: '',
+            textAlign: 'left',
+            textStyle: {color: "#FFFFFF", fontSize: 20 * scale, fontWeight: "normal"}
+          },
+          legend: {
+            itemGap: 0,
+            width: '90%',
+            show: true,
+            left: "right",
+            bottom:'1%',
+            data: legendData,
+            y: 'top',
+            // padding: [0, 25*scale, 0, 0],
+            itemWidth: 14 * scale,
+            itemHeight: 6 * scale,
+            textStyle: {width: '20%', color: "#15dce2", fontSize: 12 * scale},
+          },
+          color: colors,
+          grid: {left: '5%', top: "22%", bottom: "5%", right: "5%", width: '90%', containLabel: true},
+          tooltip: {
+            formatter: function (params) {
+              if (params[0].data == '') {
+                return ''
+              }
+              var result = ''
+              params.forEach(function (item) {
+                result += item.marker + " " + item.seriesName + " : " + item.value + "</br>";
+              });
+              return params[0].axisValue + '月<br/>' + result
+            },
+            trigger: 'axis',
+            axisPointer: {type: 'line', lineStyle: {width: 0}},
+            extraCssText: 'width: auto;height: auto;'
+          },
+          xAxis: [
+            {
+              name: '      月份\n(2018-2019)',
+              type: 'category',
+              nameTextStyle: {
+                fontSize: 12 * scale,
+                color: '#15dce2',
+                padding: [38, 0, 0, -80 * scale],
+              },
+              axisLine: {show: true, lineStyle: {color: '#04669e', width: 1}},
+              axisLabel: {interval: 0, textStyle: {color: '#ffffff', fontSize: 14 * scale}},
+              axisTick: {show: false},
+              data: xAxisData,
+            },
+          ],
+          yAxis: [
+            {
+              name: '数量',
+              nameTextStyle: {
+                fontSize: 12 * scale,
+                padding: [0, 35 * scale, 0, 0],
+              },
+              axisTick: {show: false},
+              splitLine: {show: true, lineStyle: {type: 'dashed', color: '#004371'}},
+              axisLabel: {textStyle: {color: '#15dce2', fontSize: 14 * scale}},
+              axisLine: {show: false, lineStyle: {color: '#15dce2', fontSize: 14 * scale}},
+            },
+          ],
+          series: serieData
+        })
+      },
+      selfAdaption() {
+        let _this = this
+        setTimeout(() => {
+          window.addEventListener('resize', function () {
+            _this.xc.resize()
+          })
+        }, 10)
+      }
+    },
+    mounted() {
+      // this.selfAdaption()
+    },
+    ready() {
+      this.setBar()
+    }
+  }
+</script>
+
+<style scoped>
+  .label {
+    margin-left: 6%;
+    font-size: 0.85em;
+    color: #fff;
+    height: 8%;
+  }
+
+  #servicestatistics {
+    height: 88%;
+    width: 99%;
+    padding: 1% 2% 3% 2%;
+  }
+</style>

package/src/components/ManageHome/CustomerService/TrafficStatistics.vue

@@ -1,160 +1,160 @@
-<template>
-  <div>
-    <div class="label">每周话务员接入统计</div>
-    <div id="Traffic" ></div>
-  </div>
-</template>
-
-<script>
-  export default {
-    name: "TrafficStatistics",
-    data() {
-      return {
-        xc: '',
-      }
-    },
-    methods: {
-      setBar() {
-        this.xc = this.$echarts.init(document.getElementById('Traffic'))
-        var scale = 0.8
-        var xAxisData = ['一', '二', '三', '四', '五', '六', '日', ''];
-        var legendData = ['话务量'];
-        var serieData = [];
-        var metaDate = [100, 140, 100, 120, 300, 230, 130]
-        var Auxiliarydata=[]
-        var data0=0
-        metaDate.forEach(function (s) {
-          data0=data0+s
-        })
-        for (var i=0;i<metaDate.length;i++){
-          Auxiliarydata.push(data0/60)
-        }
-        var rich={
-          white:{
-            color: "#f7cb32",
-            padding:[0,0,-20,0]
-          }
-        }
-        var yname = ' 星期'
-        for (var v = 0; v < legendData.length; v++) {
-          var serie = {
-            name: legendData[0],
-            type: "bar",
-            stack: "总量",
-            // barMaxWidth: 35,
-            barGap: "20%",
-            itemStyle: {
-              normal: {
-                color: "#013e48",
-                label: {
-                  show: true,
-                  textStyle: {
-                    color: "#fff"
-                  },
-                  position: "top",
-
-                  formatter: function (p) {
-                    var s=p.value > 0 ? (p.value) : ''
-                    return '{white|'+s+'}'
-                  },
-                  rich:rich
-                }
-              }
-            },
-            data: metaDate,
-          }
-          var serie1 = {
-            name:'ser',
-            type: "bar",
-            stack: "总量",
-            itemStyle: {
-              normal: {
-                color: "#6fd9d0",
-                barBorderRadius: 0,
-                label: {
-                  show: false,
-                }
-              }
-            },
-            data: Auxiliarydata
-          }
-          serieData.push(serie)
-          serieData.push(serie1)
-        }
-        var colors = ["#036BC8", "#4A95FF", "#5EBEFC", "#2EF7F3", "#FFFFFF"]
-        this.xc.setOption({
-          title: {text: '', textAlign: 'left', textStyle: {color: "#fff", fontSize: "16*scale", fontWeight: "normal"}},
-
-          color: colors,
-          grid: {left: '4%', top: "18%", bottom: "3%", right: "5%", containLabel: true},
-          tooltip: {
-            formatter: function (params) {
-              if (params[0].axisValue== '') {
-                return ''
-              }
-              var result = ''
-              params.forEach(function (item) {
-                if(item.seriesName!=='ser'){
-                  result += item.seriesName + " : " + item.value + "</br>";
-                }
-              });
-
-              return '星期'+params[0].axisValue + '<br/> ' + result
-            },
-            axisPointer: {type: 'line', lineStyle: {width: 0}},
-            trigger: 'axis',
-            extraCssText: 'width: auto;height: auto;'
-          },
-          xAxis: [
-            {
-              name: yname,
-              type: 'category',
-              nameTextStyle: {
-                fontSize: 14 * scale,
-                color: '#15dce2',
-                padding: [48 * scale, 0, 0, -50 * scale],
-              },
-              axisLine: {show: true, lineStyle: {color: '#04669e', width: 1}},
-              axisLabel: {interval: 0, textStyle: {color: '#ffffff', fontSize: 14 * scale}},
-              axisTick: {show: false},
-              data: xAxisData,
-            },
-          ],
-          yAxis: [
-            {
-              name: '话务量',
-              nameTextStyle: {
-                fontSize: 14 * scale,
-                padding: [-10 * scale, 35 * scale, 0, 0],
-              },
-              axisTick: {show: false},
-              splitLine: {show: true, lineStyle: {type: 'dashed', color: '#004371'}},
-              axisLabel: {interval: 0,textStyle: {color: '#15dce2', fontSize: 14 * scale}},
-              axisLine: {show: false, lineStyle: {color: '#15dce2', fontSize: 14 * scale}},
-            },
-          ],
-          series: serieData
-        })
-      },
-    },
-    ready() {
-      this.setBar()
-    }
-  }
-</script>
-
-<style scoped>
-  .label {
-    margin-left: 6%;
-    font-size: 0.85em;
-    color: #fff;
-    height: 8%;
-  }
-
-  #Traffic {
-    height: 91%;
-    width: 99%;
-    padding: 1% 2% 3% 2%;
-
-  }
-</style>
+<template>
+  <div>
+    <div class="label">每周话务员接入统计</div>
+    <div id="Traffic" ></div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "TrafficStatistics",
+    data() {
+      return {
+        xc: '',
+      }
+    },
+    methods: {
+      setBar() {
+        this.xc = this.$echarts.init(document.getElementById('Traffic'))
+        var scale = 0.8
+        var xAxisData = ['一', '二', '三', '四', '五', '六', '日', ''];
+        var legendData = ['话务量'];
+        var serieData = [];
+        var metaDate = [100, 140, 100, 120, 300, 230, 130]
+        var Auxiliarydata=[]
+        var data0=0
+        metaDate.forEach(function (s) {
+          data0=data0+s
+        })
+        for (var i=0;i<metaDate.length;i++){
+          Auxiliarydata.push(data0/60)
+        }
+        var rich={
+          white:{
+            color: "#f7cb32",
+            padding:[0,0,-20,0]
+          }
+        }
+        var yname = ' 星期'
+        for (var v = 0; v < legendData.length; v++) {
+          var serie = {
+            name: legendData[0],
+            type: "bar",
+            stack: "总量",
+            // barMaxWidth: 35,
+            barGap: "20%",
+            itemStyle: {
+              normal: {
+                color: "#013e48",
+                label: {
+                  show: true,
+                  textStyle: {
+                    color: "#fff"
+                  },
+                  position: "top",
+
+                  formatter: function (p) {
+                    var s=p.value > 0 ? (p.value) : ''
+                    return '{white|'+s+'}'
+                  },
+                  rich:rich
+                }
+              }
+            },
+            data: metaDate,
+          }
+          var serie1 = {
+            name:'ser',
+            type: "bar",
+            stack: "总量",
+            itemStyle: {
+              normal: {
+                color: "#6fd9d0",
+                barBorderRadius: 0,
+                label: {
+                  show: false,
+                }
+              }
+            },
+            data: Auxiliarydata
+          }
+          serieData.push(serie)
+          serieData.push(serie1)
+        }
+        var colors = ["#036BC8", "#4A95FF", "#5EBEFC", "#2EF7F3", "#FFFFFF"]
+        this.xc.setOption({
+          title: {text: '', textAlign: 'left', textStyle: {color: "#fff", fontSize: "16*scale", fontWeight: "normal"}},
+
+          color: colors,
+          grid: {left: '4%', top: "18%", bottom: "3%", right: "5%", containLabel: true},
+          tooltip: {
+            formatter: function (params) {
+              if (params[0].axisValue== '') {
+                return ''
+              }
+              var result = ''
+              params.forEach(function (item) {
+                if(item.seriesName!=='ser'){
+                  result += item.seriesName + " : " + item.value + "</br>";
+                }
+              });
+
+              return '星期'+params[0].axisValue + '<br/> ' + result
+            },
+            axisPointer: {type: 'line', lineStyle: {width: 0}},
+            trigger: 'axis',
+            extraCssText: 'width: auto;height: auto;'
+          },
+          xAxis: [
+            {
+              name: yname,
+              type: 'category',
+              nameTextStyle: {
+                fontSize: 14 * scale,
+                color: '#15dce2',
+                padding: [48 * scale, 0, 0, -50 * scale],
+              },
+              axisLine: {show: true, lineStyle: {color: '#04669e', width: 1}},
+              axisLabel: {interval: 0, textStyle: {color: '#ffffff', fontSize: 14 * scale}},
+              axisTick: {show: false},
+              data: xAxisData,
+            },
+          ],
+          yAxis: [
+            {
+              name: '话务量',
+              nameTextStyle: {
+                fontSize: 14 * scale,
+                padding: [-10 * scale, 35 * scale, 0, 0],
+              },
+              axisTick: {show: false},
+              splitLine: {show: true, lineStyle: {type: 'dashed', color: '#004371'}},
+              axisLabel: {interval: 0,textStyle: {color: '#15dce2', fontSize: 14 * scale}},
+              axisLine: {show: false, lineStyle: {color: '#15dce2', fontSize: 14 * scale}},
+            },
+          ],
+          series: serieData
+        })
+      },
+    },
+    ready() {
+      this.setBar()
+    }
+  }
+</script>
+
+<style scoped>
+  .label {
+    margin-left: 6%;
+    font-size: 0.85em;
+    color: #fff;
+    height: 8%;
+  }
+
+  #Traffic {
+    height: 91%;
+    width: 99%;
+    padding: 1% 2% 3% 2%;
+
+  }
+</style>