Merge branch 'dev' of http://122.51.230.86:3000/dianliang/lanan-system-vue into dev

2024-10-23 14:33:42 +08:00 · 2024-10-23 14:33:42 +08:00 · 54f0c80496
commit 54f0c80496
parent 0509974c82 0103ae6612
2 changed files with 228 additions and 101 deletions
--- a/src/views/inspection/screen/api/jcBigScreen.js
+++ b/src/views/inspection/screen/api/jcBigScreen.js
@ -64,6 +64,13 @@ export function getfive3(params) {
    params: params
  })
 }
+// 检测商品统计
+export function hotGoodsList() {
+  return request({
+    url: '/partnerOwn/partner/newHotGoodsList',
+    method: 'get',
+  })
+}



--- a/src/views/inspection/screen/jcBigScreen.vue
+++ b/src/views/inspection/screen/jcBigScreen.vue
@ -21,7 +21,9 @@
          <div class="dis-t">

            <div class="lan-you">
-              <div class="yi" :class="{'er' : qhindex == index}" v-for="(item,index) in zilist" :key="index" @click="gbindex(index,item.unit)"> {{item.text}}</div>
+              <div class="yi" :class="{'er' : qhindex == index}" v-for="(item,index) in zilist" :key="index"
+                   @click="gbindex(index,item.unit)"> {{ item.text }}
+              </div>
            </div>
          </div>
          <div class="echaets_box">
@ -35,7 +37,9 @@
          <div class="dis-t">

            <div class="lan-you">
-              <div class="yi" :class="{'er' : qhindex1 == index}" v-for="(item,index) in zilist" :key="index" @click="gbindex1(index,item.unit)"> {{item.text}}</div>
+              <div class="yi" :class="{'er' : qhindex1 == index}" v-for="(item,index) in zilist" :key="index"
+                   @click="gbindex1(index,item.unit)"> {{ item.text }}
+              </div>
            </div>
          </div>
          <div class="echaets_box">
@ -45,101 +49,114 @@
      </div>
      <div class="c_cont">
        <div class="tab_">
-<!--          <div @click="countOrAmount()" class="tab_buttom tab_acvit">数量</div>-->
-<!--          <div @click="countOrAmount()" class="tab_buttom">金额</div>-->
+          <!--          <div @click="countOrAmount()" class="tab_buttom tab_acvit">数量</div>-->
+          <!--          <div @click="countOrAmount()" class="tab_buttom">金额</div>-->
        </div>


        <div class="tab_bt">
-          <div class="yb_">
-            <div class="yb_title">工单总金额（元）</div>
-            <div class="numlist">
-              <!--                <div class="num_box" v-for="(item,index) in 6" :key="index">-->
-              <!--                  {{index}}-->
-              <!--                </div>-->
-              <div class="num_box">
-<!--                {{ statistics.totalAmount }}-->
-              </div>
+          <el-date-picker
+            v-model="value1"
+            type="daterange"
+            @change="handleChange"
+            value-format="yyyy-MM-dd"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期">
+          </el-date-picker>
+        </div>
+        <div class="five_box">
+          <div class="f_box">
+            <div class="img_left">
+              <!--              <img src="./imgs/1.png" style="width: 60px;height: 60px">-->
+              订单数量
+            </div>
+            <div>
+              <div class="f_size">{{ data2.allNum || 0 }}</div>
+              <!--              <div class="f_size">2</div>-->
+              <!--              <div class="f_num">{{ statusTickets[3].value }}</div>-->
            </div>
          </div>
-          <div class="yb_">
-            <div class="yb_title">今日工单金额（元）</div>
-            <div class="numlist">
-              <!--              <div class="num_box" v-for="(item,index) in 6" :key="index">-->
-              <!--                {{index}}-->
-              <!--              </div>-->
-              <div class="num_box">
-<!--                {{ statistics.todayAmount }}-->
-              </div>
+          <div class="f_box">
+            <div class="img_left">
+              <!--              <img src="./imgs/2.png" style="width: 60px;height: 60px">-->
+              完成数量
+            </div>
+            <div>
+              <div class="f_size">{{ data2.ywcNum || 0 }}</div>
+              <!--              <div class="f_num">{{ statusTickets[4].value }}</div>-->
+            </div>
+          </div>
+          <div class="f_box">
+            <div class="img_left">
+              <!--              <img src="./imgs/3.png" style="width: 60px;height: 60px">-->
+              检测中数量
+            </div>
+            <div>
+              <div class="f_size">{{ data2.jxzNum || 0 }}</div>
+              <!--              <div class="f_num">{{ statusTickets[0].value }}</div>-->
            </div>
          </div>
        </div>
        <div class="five_box">
          <div class="f_box">
            <div class="img_left">
-              <img src="./imgs/1.png" style="width: 60px;height: 60px">
+              <!--              <img src="./imgs/1.png" style="width: 60px;height: 60px">-->
+              公示价格
            </div>
            <div>
-<!--              <div class="f_size">{{ statusTickets[3].name }}</div>-->
-<!--              <div class="f_num">{{ statusTickets[3].value }}</div>-->
+              <!--              <div class="f_size">1</div>-->
+              <div class="f_size">{{ data1.gsAmount || 0 }}</div>
+              <!--              <div class="f_num">{{ statusTickets[3].value }}</div>-->
            </div>
          </div>
          <div class="f_box">
            <div class="img_left">
-              <img src="./imgs/2.png" style="width: 60px;height: 60px">
+              <!--              <img src="./imgs/2.png" style="width: 60px;height: 60px">-->
+              应收款
            </div>
            <div>
-<!--              <div class="f_size">{{ statusTickets[4].name }}</div>-->
-<!--              <div class="f_num">{{ statusTickets[4].value }}</div>-->
+              <div class="f_size">{{ data1.ysAmount || 0 }}</div>
+              <!--              <div class="f_num">{{ statusTickets[4].value }}</div>-->
            </div>
          </div>
          <div class="f_box">
            <div class="img_left">
-              <img src="./imgs/3.png" style="width: 60px;height: 60px">
+              已收款
            </div>
            <div>
-<!--              <div class="f_size">{{ statusTickets[0].name }}</div>-->
-<!--              <div class="f_num">{{ statusTickets[0].value }}</div>-->
+              <div class="f_size">{{ data1.yjsAmount || 0 }}</div>
            </div>
          </div>
          <div class="f_box">
            <div class="img_left">
-              <img src="./imgs/4.png" style="width: 60px;height: 60px">
+              <!--                        <img src="./imgs/4.png" style="width: 60px;height: 60px">-->
+              待收款
            </div>
            <div>
-<!--              <div class="f_size">{{ statusTickets[1].name }}</div>-->
-<!--              <div class="f_num">{{ statusTickets[1].value }}</div>-->
-            </div>
-          </div>
-          <div class="f_box">
-            <div class="img_left">
-              <img src="./imgs/5.png" style="width: 60px;height: 60px">
-            </div>
-            <div>
-<!--              <div class="f_size">{{ statusTickets[5].name }}</div>-->
-<!--              <div class="f_num">{{ statusTickets[5].value }}</div>-->
+              <div class="f_size">{{ data1.ysAmount - data1.yjsAmount || 0 }}</div>
+              <!--              <div class="f_num">{{ statusTickets[1].value }}</div>-->
            </div>
          </div>
        </div>
        <div class="co_title">
-          今日工单
+          客户来源统计
+        </div>
+        <div class="list_long">
+          <div class="long_title">
+            <div class="l_one">客户来源</div>
+            <div class="l_two">数量</div>
+            <div class="l_three">公示金额</div>
+            <!--            <div class="l_four">创建时间</div>-->
+          </div>
+          <div class="ot_vox">
+            <div class="long_box" v-for="(item,index) in data3" :key="index">
+              <div class="l_one">{{ item.remark || '' }}</div>
+              <div class="l_two">{{ item.theNum || '' }}</div>
+              <div class="l_three">{{ item.theAmount || '' }}</div>
+            </div>
+          </div>
        </div>
-<!--        <div class="list_long">-->
-<!--          <div class="long_title">-->
-<!--            <div class="l_one">工单号</div>-->
-<!--            <div class="l_two">服务客户</div>-->
-<!--            <div class="l_three">服务顾问</div>-->
-<!--            <div class="l_four">创建时间</div>-->
-<!--          </div>-->
-<!--          <div class="ot_vox">-->
-<!--            <div class="long_box" v-for="(item,index) in todayTickets" :key="index">-->
-<!--              <div class="l_one">{{ item.ticketNo }}</div>-->
-<!--              <div class="l_two">{{ item.userName }}</div>-->
-<!--              <div class="l_three">{{ item.adviserName }}</div>-->
-<!--              <div class="l_four">{{ parseTime(item.createTime) }}</div>-->
-<!--            </div>-->
-<!--          </div>-->
-<!--        </div>-->
      </div>
      <div class="c_right">
        <div class="six_box">
@ -157,7 +174,9 @@
          <div class="dis-t">

            <div class="lan-you">
-              <div class="yi" :class="{'er' : qhindex2 == index}" v-for="(item,index) in zilist" :key="index" @click="gbindex2(index,item.unit)"> {{item.text}}</div>
+              <div class="yi" :class="{'er' : qhindex2 == index}" v-for="(item,index) in zilist" :key="index"
+                   @click="gbindex2(index,item.unit)"> {{ item.text }}
+              </div>
            </div>
          </div>
          <div class="echaets_box">
@ -166,7 +185,10 @@
        </div>
        <div class="six_box">
          <div class="s_title">
-            维修工人排行
+            检测商品统计
+          </div>
+          <div class="echaets_box">
+            <div id="jcsptj" style="width: 400px; height: 267px;"></div>
          </div>
        </div>
      </div>
@ -178,29 +200,43 @@
 <script>
 import * as echarts from 'echarts';
 import * as jcBigScreen from '@/views/inspection/screen/api/jcBigScreen';
-import {chartInfoNum, chartLineInspectionAmount} from "@/views/inspection/screen/api/jcBigScreen";
+import {
+  chartInfoNum,
+  chartLineInspectionAmount,
+  getfive1,
+  getfive2,
+  getfive3, hotGoodsList
+} from "@/views/inspection/screen/api/jcBigScreen";

 export default {
  name: 'Index',
  components: {},
  data() {
+    const formatDate = (date) => {
+      return date.toISOString().split('T')[0];
+    };
    return {
      Amount: [],
-      unit: '',
-      unit1: '',
-      unit2: '',
+      unit: 'day',
+      unit1: 'day',
+      unit2: 'day',
+      data2: '',
+      data1: '',
+      data3: '',
      chartData1: {},
-      params : {
-        unit:this.unit,
+      params: {
+        unit: this.unit,
      },
-      qhindex:0,
-      qhindex1:0,
-      qhindex2:0,
-      zilist:[
-        {text:'日',unit:'day'},
-        {text:'周',unit:'week'},
-        {text:'月',unit:'month'},
-        {text:'年',unit:'year'},
+      // value1: [new Date(), new Date()],
+      value1: [formatDate(new Date()), formatDate(new Date())], // 格式化日期
+      qhindex: 0,
+      qhindex1: 0,
+      qhindex2: 0,
+      zilist: [
+        {text: '日', unit: 'day'},
+        {text: '周', unit: 'week'},
+        {text: '月', unit: 'month'},
+        {text: '年', unit: 'year'},

      ],
    }
@ -211,24 +247,33 @@ export default {
    this.chartInfoNum()
    this.chartLineInspectionNum()
    this.chartInfoRatio()
+    this.getfive2()
+    this.getfive1()
+    this.getfive3()
+    this.getProduct()

  },
  mounted() {

  },
  methods: {
-    gbindex(index,unit){
+    handleChange() {
+      console.log('选择的时间', this.value1)
+      this.getfive2()
+      this.getfive1()
+    },
+    gbindex(index, unit) {
      this.qhindex = index
      this.unit = unit
      this.getServerData1()
    },
-    gbindex1(index,unit){
-      console.log('22',unit);
+    gbindex1(index, unit) {
+      console.log('22', unit);
      this.qhindex1 = index
      this.unit1 = unit
      this.chartInfoNum()
    },
-    gbindex2(index,unit){
+    gbindex2(index, unit) {
      console.log('33');
      this.qhindex2 = index
      this.unit2 = unit
@ -241,10 +286,10 @@ export default {
     */
    async getServerData1() {
      const params = {
-        unit:this.unit,
+        unit: this.unit,
      }
      let res = await jcBigScreen.getServerData1(params)
-      console.log('已收款金额',res)
+      console.log('已收款金额', res)
      res.data.series.forEach(item => {
        item.type = 'bar'
      })
@ -263,16 +308,64 @@ export default {
      };
      option && myChart.setOption(option);
    },
+    /**
+     * 检测商品统计
+     * @returns {Promise<void>}
+     */
+    async getProduct() {
+      let res = await jcBigScreen.hotGoodsList()
+      console.log('检测商品统计', res)
+      res.data.forEach(item => {
+        item.name = item.goodsName
+        item.value = item.salesNum
+      })
+      setTimeout(() => {
+        var chartDom = document.getElementById('jcsptj');
+        var myChart = echarts.init(chartDom);
+        var option;
+        option = {
+          title: {
+            // text: 'Referer of a Website',
+            // subtext: 'Fake Data',
+            left: 'center'
+          },
+          tooltip: {
+            trigger: 'item'
+          },
+          legend: {
+            orient: 'vertical',
+            left: 'left'
+          },
+          series: [
+            {
+              // name: 'Access From',
+              type: 'pie',
+              radius: '50%',
+              data: res.data,
+              emphasis: {
+                itemStyle: {
+                  shadowBlur: 10,
+                  shadowOffsetX: 0,
+                  shadowColor: 'rgba(0, 0, 0, 0.5)'
+                }
+              }
+            }
+          ]
+        };
+        option && myChart.setOption(option);
+      }, 2000)
+
+    },
    /**
     * 数量统计
     * @returns {Promise<void>}
     */
    async chartInfoNum() {
      const params = {
-        unit:this.unit1,
+        unit: this.unit1,
      }
      let res = await jcBigScreen.chartInfoNum(params)
-      console.log('数量统计',res)
+      console.log('数量统计', res)
      res.data.series.forEach(item => {
        item.type = 'bar'
      })
@ -297,10 +390,10 @@ export default {
     */
    async chartInfoRatio() {
      const params = {
-        unit:this.unit2,
+        unit: this.unit2,
      }
      let res = await jcBigScreen.chartInfoRatio(params)
-      console.log('检测合格率',res)
+      console.log('检测合格率', res)
      res.data.series.forEach(item => {
        item.type = 'bar'
      })
@ -325,10 +418,10 @@ export default {
     */
    async chartLineInspectionNum() {
      const params = {
-        unit:this.unit,
+        unit: this.unit,
      }
      let res = await jcBigScreen.chartLineInspectionNum(params)
-      console.log('检测数量',res)
+      console.log('检测数量', res)
      res.data.series.forEach(item => {
        item.type = 'bar'
      })
@ -336,16 +429,6 @@ export default {
      var chartDom = document.getElementById('jcsl');
      var myChart = echarts.init(chartDom);
      var option;
-      // option = {
-      //   xAxis: {
-      //     type: 'category',
-      //     data: res.data.categories
-      //   },
-      //   yAxis: {
-      //     type: 'value'
-      //   },
-      //   series: res.data.series
-      // };
      option = {
        title: {
          text: '最近七天'
@ -385,7 +468,7 @@ export default {
     */
    async customerSource() {
      const params = {
-        unit:this.unit,
+        unit: this.unit,
      }
      const res = await jcBigScreen.chartLineInspectionAmount(params);
      res.data.series.forEach(item => {
@ -406,6 +489,41 @@ export default {
      };
      option && myChart.setOption(option);
    },
+    /**
+     * 订单数量
+     */
+    async getfive2() {
+      let data2 = {
+        startTime: this.value1[0],
+        endTime: this.value1[1]
+      }
+      console.log('订单数量等参数', data2)
+      const res = await getfive2(data2)
+      console.log('订单数量等', res.data)
+      this.data2 = res.data
+    },
+    /**
+     * 营业额统计
+     * @returns {Promise<void>}
+     */
+    async getfive1() {
+      let data1 = {
+        startTime: this.value1[0],
+        endTime: this.value1[1]
+      }
+      const res = await getfive1(data1)
+      console.log('营业额统计', res.data)
+      this.data1 = res.data
+    },
+    /**
+     * 客户来源
+     * @returns {Promise<void>}
+     */
+    async getfive3() {
+      const res = await getfive3()
+      console.log('客户来源', res.data)
+      this.data3 = res.data
+    }
  }

 }
@ -440,14 +558,16 @@ export default {
  //align-items: center;
  justify-content: space-between;
 }
-.dis-t{
+
+.dis-t {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 10px auto;
 }
-.lan-you{
+
+.lan-you {
  display: flex;
  align-items: center;
 }