manage-client 3.2.146 → 3.2.147

package/src/filiale/xinkang/sale.js

@@ -0,0 +1,10 @@
+// 分公司特殊组件页面注册
+let specialComp = {
+  //卡表抄表查询
+  'charge-query': (resolve) => {require(['./ChargeQuery'], resolve)}
+}
+exports.specialComp = specialComp
+
+
+
+

package/src/filiale/zhongyi/CallReport/CallReportMainPage.vue

@@ -0,0 +1,116 @@
+<template>
+  <div class="main-basic">
+
+
+
+<!--    <basic-page ></basic-page>-->
+
+<!--    &lt;!&ndash;左侧内容模块&ndash;&gt;-->
+<!--    <template v-slot:contentLeft>-->
+<!--      <left-content-page></left-content-page>-->
+<!--    </template>-->
+<!--    &lt;!&ndash;右侧&ndash;&gt;-->
+
+    <weather-data></weather-data>
+    <time></time>
+    <div class="content-header">中邑燃气</div>
+    <div class="inform"><span><i></i>{{ data.inform }}</span></div>
+    <!--工单模块-->
+    <work-order-page></work-order-page>
+    <!--完成率模块-->
+    <percentage-complete></percentage-complete>
+    <!--完成率echart-->
+    <percentage-complete-echart></percentage-complete-echart>
+    <!--用户模块-->
+    <userinfo></userinfo>
+    <!--来电统计模块-->
+    <incoming-telegram :row="model"></incoming-telegram>
+
+    <!---->
+
+    <rate-top></rate-top>-->
+    <rate-bottom></rate-bottom>-->
+    <!--客服状态模块-->
+    <service-status></service-status>
+
+
+
+
+  </div>
+
+
+</template>
+
+<script>
+import WorkOrderPage from "./WorkOrderPage";
+import PercentageComplete from "./PercentageComplete";
+import RateBottom from "./RateBottom";
+import WeatherData from "./WeatherData";
+export default {
+  components: {WeatherData, RateBottom, PercentageComplete, WorkOrderPage},
+  title:'CallReportMainPage',
+  data() {
+    return {
+      // model:"初入数据",
+      data:{
+        inform:'2022.3.7号停气',
+        // inform:'2022.3.7号停气2022.3.7号停气',
+      }
+    }
+  },
+  name: "CallReportMainPage"
+}
+</script>
+
+<style scoped>
+.main-basic{
+  /* margin: 0; */
+  width: 100vw;
+  height: 100vh;
+  background-image: url("../../../../static/images/zhongyi/background.png");
+  background-repeat: no-repeat;
+}
+.content-header {
+  width: 8.333vw;
+  height: 3.519vh;
+  font-size: 40px;
+  color: #fff;
+  position: absolute;
+  top: 1.389vh;
+  left: 45.99vw;
+  line-height: 3.333vh;
+}
+.inform {
+  width: 35.833vw;
+  height: 6.019vh;
+  background-image: url("../../../../static/images/zhongyi/orangebg.png");
+  background-repeat: no-repeat;
+  background-position: 0px 0px;
+  background-size: cover;
+  position: absolute;
+  top: 11.204vh;
+  left: 31.458vw;
+  text-align: center;
+}
+
+.inform span {
+  font-size: 40px;
+  font-weight: bold;
+  color: #FFFFFF;
+  line-height: 33px;
+  position: relative;
+  top: 1.204vh;
+}
+
+.inform i {
+  width: 2.03125vw;
+  height: 2.87vh;
+  background-image: url("../../../../static/images/zhongyi/trumpet.png");
+  background-repeat: no-repeat;
+  background-position: 0px 0px;
+  background-size: cover;
+  position: absolute;
+  left: -2.604vw;
+  top: 1.111vh;
+}
+</style>

package/src/filiale/zhongyi/CallReport/IncomingTelegram.vue

@@ -0,0 +1,162 @@
+<template>
+  <!-- 来电模块 -->
+  <div class="incoming-telegram">
+    <p><i></i><span>来电数量统计</span></p>
+    <i></i><i></i>
+    <div>
+      <span>{{ data.netAppointment}}</span><br>
+      <span>年度网厅预约话务(次)</span>
+    </div>
+    <div>
+      <span>{{ data.hotLine }}</span><br>
+      <span>年度热线服务话务(次)</span>
+    </div>
+    <span class="text1">接通率</span>
+    <span class="text2">接通率</span>
+
+
+  </div>
+</template>
+
+<script>
+import echarts from "echarts";
+import {HttpResetClass} from "vue-client";
+export default {
+  name: "IncomingTelegram",
+
+  data(){
+    return{
+      data:{
+        netAppointment:'16,871',
+        hotLine:'85,917',
+
+
+      }
+    }
+  },
+  methods:{
+    getInitData(){
+      let http = new HttpResetClass()
+      http.load('post','rs/sql/getCallSumData',{}).then((res)=>{
+        console.log(res.data)
+        // this.data = res.data[0]
+      })
+    }
+  },
+  ready(){
+    // this.getInitData()
+  }
+
+
+}
+</script>
+
+<style scoped>
+
+/* 来电统计样式 */
+.incoming-telegram {
+  width: 23.4375vw;
+  height: 51.667vh;
+  background: rgba(255, 255, 255, .04);
+  position: absolute;
+  top: 12.315vh;
+  right: 1.198vw;
+}
+
+.incoming-telegram p i {
+  width: 1.458vw;
+  height: 2.593vh;
+  background-image: url('../../../../static/images/zhongyi/chart-2@2x.png');
+  background-repeat: no-repeat;
+  background-size: cover;
+  background-position: 0 0;
+  position: absolute;
+  top: 2.315vh;
+  left: 1.51vw;
+}
+
+.incoming-telegram i {
+  width: 22.8125vw;
+  height: 0.093vh;
+  background-image: url('../../../../static/images/zhongyi/blueLine.png');
+  background-repeat: no-repeat;
+  background-size: cover;
+  position: absolute;
+  top: 6.852vh;
+  left: 1.09375vw;
+}
+
+.incoming-telegram i:nth-of-type(2) {
+  top: 6.667vh;
+}
+
+.incoming-telegram p span {
+  /* width: 161px;
+  height: 26px; */
+  font-size: 27px;
+  color: #FFFFFF;
+  position: absolute;
+  top: 1.852vh;
+  left: 3.698vw;
+}
+
+
+.incoming-telegram div {
+  position: absolute;
+  top: 11vh;
+  left: 1.042vw;
+  height: 13.889vh;
+}
+
+.incoming-telegram div:nth-of-type(2) {
+  top: 32.185vh;
+}
+
+.incoming-telegram div span:nth-of-type(1) {
+  font-size: 54px;
+  font-weight: bold;
+  color: #FFCD00;
+  display: block;
+  text-align: center;
+  margin-bottom: -24px;
+}
+
+.incoming-telegram div:nth-of-type(2) span:nth-of-type(1) {
+  color: #00FFEA;
+}
+
+.incoming-telegram div span:nth-of-type(2) {
+  font-size: 22px;
+  /* font-weight: bold; */
+  color: #FFFEFE;
+}
+
+.rate-top{
+  width: 45%;
+  height: 30% !important;
+  margin: 1px 1px 1px 220px;
+}
+.rate-bottom{
+  width: 45%;
+  height: 30% !important;
+  margin: 240px 1px 1px 220px;
+}
+
+.text1 {
+  font-size: 22px;
+  font-weight: bold;
+  color: #FFFEFE;
+  position: absolute;
+  top: 24.722vh;
+  right: 3.385vw;
+}
+.text2 {
+  font-size: 22px;
+  font-weight: bold;
+  color: #FFFEFE;
+  position: absolute;
+  top: 45.185vh;
+  right: 3.385vw;
+}
+/* 来电统计样式结束 */
+</style>

package/src/filiale/zhongyi/CallReport/PercentageComplete.vue

@@ -0,0 +1,291 @@
+<template>
+  <!-- 完成率组件 -->
+  <div class="percentageComplete">
+    <div class="view">
+      <div class="pending"><i></i><span>待处理</span><span class="pendingNum">{{ data.pendingNum }}</span></div>
+      <div class="beingProcessed"><i></i><span>处理中</span><span class="beingProcessedNum">{{ data.beingProcessedNum }}</span></div>
+      <div class="completed"><i></i><span>已完成</span><span class="completedNum">{{ data.completedNum }}</span></div>
+      <div class="completedEcharts"></div>
+    </div>
+    <div class="data">
+      <ul>
+        <li><span>昨日工单</span><span class="day">{{ data.day }}</span><span>日环比</span><i></i><span class="daysFrom">{{ data.daysFrom }}</span></li>
+        <li><span>月度工单量</span><span class="month">{{ data.month }}</span><span>月环比</span><i></i><span class="onAMonthlyBasis">{{ data.onAMonthlyBasis }}</span></li>
+        <li><span>年度工单量</span><span class="year">{{ data.year }}</span><span>同比</span><i></i><span class="yoy">{{ data.yoy }}</span></li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script>
+import {HttpResetClass} from "vue-client";
+
+export default {
+  name: "PercentageComplete",
+  data(){
+    return{
+      data:{
+        //待处理
+        pendingNum:'29',
+        // 处理中
+        beingProcessedNum:'16',
+        //已完成
+        completedNum:'37',
+        //昨日工单
+        day:'154',
+        //月度工单量
+        month:'5149',
+        //年度工单量
+        year:'145784',
+        //日环比
+        daysFrom:'44.18%',
+        //月环比
+        onAMonthlyBasis:'71.12%',
+        //同比
+        yoy:'95.07%',
+
+
+      }
+    }
+  },
+  methods:{
+    getInitData(){
+      let http = new HttpResetClass()
+      http.load('post','rs/sql/getCallSumData',{}).then((res)=>{
+        console.log(res.data)
+      })
+    }
+  },
+  ready(){
+    // this.getInitData()
+  }
+}
+</script>
+
+<style scoped>
+/* 完成率组件样式 */
+.percentageComplete {
+  width: 24.198vw;
+  height: 42.852vh;
+  position: absolute;
+  top: 53.241vh;
+  left: 1.146vw;
+  background: #0f136c;
+}
+
+.pending {
+  width: 4.948vw;
+  height: 13.981vh;
+  position: absolute;
+  top: 4.63vh;
+  left: 0.573vw;
+  border: 1px dashed #fff;
+}
+
+.pending i {
+  width: 100%;
+  height: 100%;
+  background-repeat: no-repeat;
+  background-position: 1px 0px;
+  background-size: cover;
+  position: absolute;
+  background-image: url("../../../../static/images/zhongyi/exclamationPoint.png");
+}
+
+.pending span:nth-of-type(1) {
+  font-size: 22px;
+  color: #FFFFFF;
+  position: absolute;
+  bottom: 9.259vh;
+  left: 0.885vw;
+}
+
+.pending span:nth-of-type(2) {
+  font-size: 32px;
+  font-weight: bold;
+  color: #FF7E00;
+  position: absolute;
+  bottom: 12.222vh;
+  left: 1.5625vw;
+}
+
+.beingProcessed {
+  width: 4.948vw;
+  height: 13.981vh;
+  position: absolute;
+  top: 4.63vh;
+  left: 5.417vw;
+  border: 1px dashed #fff;
+}
+
+.beingProcessed i {
+  width: 100%;
+  height: 100%;
+  background-repeat: no-repeat;
+  background-position: 1px 0px;
+  background-size: cover;
+  position: absolute;
+  background-image: url("../../../../static/images/zhongyi/refresh.png");
+}
+
+.beingProcessed span:nth-of-type(1) {
+  font-size: 22px;
+  color: #FFFFFF;
+  position: absolute;
+  bottom: 9.259vh;
+  left: 0.885vw;
+}
+
+.beingProcessed span:nth-of-type(2) {
+  font-size: 32px;
+  font-weight: bold;
+  color: #FFCC0F;
+  position: absolute;
+  bottom: 12.222vh;
+  left: 1.5625vw;
+}
+
+.completed {
+  width: 4.948vw;
+  height: 13.981vh;
+  position: absolute;
+  top: 4.63vh;
+  left: 10.208vw;
+  border: 1px dashed #fff;
+}
+
+.completed i {
+  width: 100%;
+  height: 100%;
+  background-repeat: no-repeat;
+  background-position: 1px 0px;
+  background-size: cover;
+  position: absolute;
+  background-image: url("../../../../static/images/zhongyi/Pigeon.png");
+}
+
+.completed span:nth-of-type(1) {
+  font-size: 22px;
+  color: #FFFFFF;
+  position: absolute;
+  bottom: 9.259vh;
+  left: 0.885vw;
+}
+
+.completed span:nth-of-type(2) {
+  font-size: 32px;
+  font-weight: bold;
+  color: #01F7E6;
+  position: absolute;
+  bottom: 12.222vh;
+  left: 1.5625vw;
+}
+
+.completedEcharts {
+  width: 7.24vw;
+  height: 12.87vh;
+  opacity: 0.08;
+  border-radius: 50%;
+  position: absolute;
+  top: 4.352vh;
+  right: 1.146vw;
+  /*background-color: #00F6FF;*/
+}
+.data{
+  height: 1vh;
+}
+
+.data li {
+  width: 22.8125vw;
+  height: 4.537vh;
+  position: absolute;
+  /* position: relative; */
+  left: 1.09375vw;
+  list-style: none;
+  display: inline-block;
+}
+
+.data li:nth-of-type(1) {
+  width: 22.8125vw;
+  height: 4.537vh;
+  background-image: url('../../../../static/images/zhongyi/bluebg.png');
+  background-repeat: no-repeat;
+  background-size: cover;
+  bottom: 16.389vh;
+  border: 1px dashed #fff;
+}
+
+.data li:nth-of-type(2) {
+  width: 22.8125vw;
+  height: 4.537vh;
+  background-image: url('../../../../static/images/zhongyi/yellowbg.png');
+  background-repeat: no-repeat;
+  background-size: cover;
+  bottom: 9.259vh;
+  border: 1px dashed #fff;
+}
+
+.data li:nth-of-type(3) {
+  width: 22.8125vw;
+  height: 4.537vh;
+  background-image: url('../../../../static/images/zhongyi/bulebg2.png');
+  background-repeat: no-repeat;
+  background-size: cover;
+  bottom: 2.037vh;
+  border: 1px dashed #fff;
+}
+
+.data li span:nth-of-type(1) {
+  font-size: 22px;
+  color: #FFFFFF;
+  position: relative;
+  top: 0.833vh;
+  left: 0.625vw;
+}
+.data li span:nth-of-type(2) {
+  font-size: 27px;
+  position: absolute;
+  font-weight: bold;
+  top: 0.556vh;
+  left: 6.823vw;
+}
+.day{
+  color: #00D2FF;
+}
+.month{
+  color: #FFCD00;
+}
+.year{
+  color: #01F7E6;
+}
+.data li span:nth-of-type(3) {
+  font-size: 22px;
+  color: #FFFFFF;
+  position: absolute;
+  top: 0.833vh;
+  right: 7.292vw;
+}
+.data li span:nth-of-type(4) {
+  font-size: 22px;
+
+  position: absolute;
+  font-weight: bold;
+  top: 0.833vh;
+  right: 0.833vw;
+}
+.daysFrom{
+  color: #FF7E00;
+}
+.onAMonthlyBasis,.yoy{
+  color: #01F7E6;
+}
+/*.data ul li i{*/
+/*  width: 22px;*/
+/*  height: 22px;*/
+/*  background-image: url('./images/zhongyi/箭头\ 19\ 1.png');*/
+/*  background-repeat: no-repeat;*/
+/*  background-size: cover;*/
+/*  position: absolute;*/
+/*}*/
+/* 完成率组件样式结束 */
+</style>

package/src/filiale/zhongyi/CallReport/PercentageCompleteEchart.vue

@@ -0,0 +1,140 @@
+<template>
+  <div id="echart"></div>
+</template>
+
+
+<!--PercentageCompleteEchart-->
+<script>
+import echarts from "echarts";
+export default {
+  name: "PercentageCompleteEchart",
+  // components: {},
+  // props:['row','dat1'],
+  data(){
+    return {
+      percentageComplete:66,
+    }
+  },
+  ready(){
+    // console.log(this.row)
+    this.percentageCompleteEchart()
+  },
+  mounted(){
+  },
+  methods:{
+
+    percentageCompleteEchart(){
+      let myChart = echarts.init(document.getElementById("echart"));
+      let value = this.percentageComplete;
+      let option = {
+// backgroundColor:"#061740",
+        title: {
+          text: `${value}%`,
+          x: 'center',
+          y: 'center',
+          textStyle: {
+            color: '#00F6FF',
+            fontSize:20
+          }
+        },
+        series: [  {
+          type: 'pie',
+          radius: ['58%', '45%'],
+          silent: true,
+          clockwise: true,
+          startAngle: 90,
+          z: 0,
+          zlevel: 0,
+          label: {
+            normal: {
+              position: "center",
+
+            }
+          },
+          data: [{
+            value: value,
+            name: "",
+            itemStyle: {
+              normal: {
+                color:"#00F6FF",
+              }
+            }
+          },
+            {
+              value: 100-value,
+              name: "",
+              label: {
+                normal: {
+                  show: false
+                }
+              },
+              itemStyle: {
+                normal: {
+                  color: "transparent"
+                }
+              }
+            }
+          ]
+        },
+
+          {
+            name: "",
+            type: "gauge",
+            radius: "58%",
+            center: ['50%', '50%'],
+            startAngle: 0,
+            endAngle: 359.9,
+            splitNumber: 15,
+            hoverAnimation: true,
+            axisTick: {
+              show: false
+            },
+            splitLine: {
+              length: 17,
+              lineStyle: {
+                width: 5,
+                color: "#061740"
+              }
+            },
+            axisLabel: {
+              show: false
+            },
+            pointer: {
+              show: false
+            },
+            axisLine: {
+              lineStyle: {
+                opacity: 0
+              }
+            },
+            detail: {
+              show: false
+            },
+            data: [{
+              value: 0,
+              name: ""
+            }]
+          },
+
+        ]
+      };
+
+      myChart.setOption(option);
+
+    },
+
+  }
+
+}
+</script>
+
+
+<style scoped>
+#echart{
+  margin-left: 270px;
+  margin-top: 140px;
+  width: 250px;
+  height: 250px;
+}
+canvas{}
+</style>