Merge branch 'master' into moss_dev

* master: (26 commits)
  no message
  no message
  no message
  no message
  no message
  no message
  no message
  no message
  no message
  no message
  no message
  no message
  no message
  no message
  no message
  feat：数据大屏
  no message
  no message
  no message
  no message
  ...

package-lock.json

@@ -3927,11 +3927,6 @@
       "integrity": "sha512-iO9ZQHkZxHn4mSakYV0vFHAVDyEOIJQrV2uZ06HxEPcx+mt8swXoZHIbaaJ2crJYFfErySgktuTZ3BeLz+XmFA==",
       "dev": true
     },
-    "@vue-office/excel": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmmirror.com/@vue-office/excel/-/excel-1.3.0.tgz",
-      "integrity": "sha512-YWtZkMZfPSWfoW7IDcf+gU70AJlJ05vCSN5yT+Tl9WLJBwNvSIgS2U46nzNvIDqRGbc7k/jWpZHg2pED3UBAKg=="
-    },
     "@vue/babel-helper-vue-jsx-merge-props": {
       "version": "1.2.1",
       "resolved": "https://registry.npmmirror.com/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz",
@@ -4766,9 +4761,9 @@
       "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ=="
     },
     "@zjlib/element-plugins": {
-      "version": "2.14.0",
-      "resolved": "http://121.41.110.30:4873/@zjlib%2felement-plugins/-/element-plugins-2.14.0.tgz",
-      "integrity": "sha512-NN3xVPTNCjOASXZBHFJGs2gtJT4cGWWoesNA1ddf+JUAn66JUxXLUPKt4LzT1rU9O/0akKMlzkpPTqkFuGJ+mw==",
+      "version": "2.14.1",
+      "resolved": "http://121.41.110.30:4873/@zjlib%2felement-plugins/-/element-plugins-2.14.1.tgz",
+      "integrity": "sha512-VqrByNsnMj1e8ojBNy0+CWxLgp3kAk0j4JTFdWFbfqUdEYbksUmCgXz5z6Bwk7+wBk7I/kspOU3V56/EavoTmQ==",
       "requires": {
         "@turf/turf": "^6.5.0",
         "@vuemap/vue-amap": "^0.1.12",
@@ -8832,12 +8827,12 @@
       }
     },
     "echarts": {
-      "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/echarts/-/echarts-5.3.2.tgz",
-      "integrity": "sha512-LWCt7ohOKdJqyiBJ0OGBmE9szLdfA9sGcsMEi+GGoc6+Xo75C+BkcT/6NNGRHAWtnQl2fNow05AQjznpap28TQ==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmmirror.com/echarts/-/echarts-5.5.0.tgz",
+      "integrity": "sha512-rNYnNCzqDAPCr4m/fqyUFv7fD9qIsd50S6GDFgO1DxZhncCsNsG7IfUlAlvZe5oSEQxtsjnHiUuppzccry93Xw==",
       "requires": {
         "tslib": "2.3.0",
-        "zrender": "5.3.1"
+        "zrender": "5.5.0"
       }
     },
     "editorconfig": {
@@ -26364,9 +26359,9 @@
       }
     },
     "zrender": {
-      "version": "5.3.1",
-      "resolved": "https://registry.npmjs.org/zrender/-/zrender-5.3.1.tgz",
-      "integrity": "sha512-7olqIjy0gWfznKr6vgfnGBk7y4UtdMvdwFmK92vVQsQeDPyzkHW1OlrLEKg6GHz1W5ePf0FeN1q2vkl/HFqhXw==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmmirror.com/zrender/-/zrender-5.5.0.tgz",
+      "integrity": "sha512-O3MilSi/9mwoovx77m6ROZM7sXShR/O/JIanvzTwjN3FORfLSr81PsUGd7jlaYOeds9d8tw82oP44+3YucVo+w==",
       "requires": {
         "tslib": "2.3.0"
       }

package.json

@@ -17,16 +17,15 @@
   "dependencies": {
     "@jiaminghi/data-view": "^2.10.0",
     "@turf/turf": "^6.5.0",
-    "@vue-office/excel": "^1.3.0",
     "@vue/composition-api": "^1.7.1",
-    "@zjlib/element-plugins": "^2.14.0",
+    "@zjlib/element-plugins": "^2.14.1",
     "@zjlib/element-ui2": "^1.0.3",
     "axios": "0.18.1",
     "chatgpt": "^4.1.2",
     "clipboard": "^2.0.8",
     "concurrent-tasks": "^1.0.7",
     "core-js": "^3.6.5",
-    "echarts": "^5.1.1",
+    "echarts": "^5.5.0",
     "file-saver": "^2.0.5",
     "html2canvas": "^1.4.1",
     "js-cookie": "2.2.0",

src/api/bigView.js

@@ -0,0 +1,46 @@
+import request, { postBlob, getBlob, handleImport } from '@/utils/request'
+
+// 辅配件统计
+export function getMaterialStats(params) {
+  return request({
+    url: '/big/getLarge4',
+    method: 'post',
+    params
+  })
+}
+
+// 工单统计
+export function getWorkorderStats(params) {
+  return request({
+    url: '/big/getLarge5',
+    method: 'post',
+    params
+  })
+}
+
+// 订单统计
+export function getOrderStats(params) {
+  return request({
+    url: '/big/getLarge7',
+    method: 'post',
+    params
+  })
+}
+
+// 订单金额趋势
+export function getOrderTrend(params) {
+  return request({
+    url: '/big/getLarge8',
+    method: 'post',
+    params
+  })
+}
+
+// 订单金额趋势
+export function getWorkorderTrend(params) {
+  return request({
+    url: '/big/getLarge6',
+    method: 'post',
+    params
+  })
+}

src/api/common.js

@@ -9,6 +9,46 @@ export function lbsAmapRegion(params) {
   })
 }
 
+export function bigGetLarge1(params) {
+  return request({
+    url: '/big/getLarge1',
+    method: 'post',
+    params
+  })
+}
+
+export function bigGetLarge10(params) {
+  return request({
+    url: '/big/getLarge10',
+    method: 'get',
+    params
+  })
+}
+
+export function bigGetLarge3(params) {
+  return request({
+    url: '/big/getLarge3',
+    method: 'post',
+    params
+  })
+}
+
+export function bigGetLarge2(params) {
+  return request({
+    url: '/big/getLarge2',
+    method: 'post',
+    params
+  })
+}
+
+export function bigGetLarge9(params) {
+  return request({
+    url: '/big/getLarge9',
+    method: 'post',
+    params
+  })
+}
+
 export function commonCompanywechatGet(params) {
   return request({
     url: '/common/companywechat/get',
@@ -17,6 +57,14 @@ export function commonCompanywechatGet(params) {
   })
 }
 
+export function bigGetRegion(params) {
+  return request({
+    url: '/big/getRegion',
+    method: 'post',
+    params
+  })
+}
+
 
 // 模板下载
 export function commonTemplateDownload(params, name) {

src/components/Screenfull/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <svg-icon :icon-class="isFullscreen ? 'exit-fullscreen' : 'fullscreen'" @click="click" />
+    <svg-icon :className="className" :icon-class="isFullscreen ? 'exit-fullscreen' : 'fullscreen'" @click="click" />
   </div>
 </template>
 
@@ -9,6 +9,12 @@ import screenfull from 'screenfull'
 
 export default {
   name: 'Screenfull',
+  props:{
+    className: {
+      type: String,
+      default: ''
+    },
+  },
   data() {
     return {
       isFullscreen: false

src/components/Shortcut/index.vue

@@ -146,15 +146,15 @@ export default {
           androidIcon: "https://zf-mall.oss-cn-shenzhen.aliyuncs.com/2024-03/1711593045466d069e7f6-5c77-40a0-a7b3-6e2b3a6ce0eb.png"
         })
       }
-	  if (res?.data?.payQrcode) {
-	    this.QRcodeList.push({
-	      codeUrl: res.data.payQrcode,
-	      name: "收款码",
-	      saleName: "",
-	      iosIcon: "https://zf-mall.oss-cn-shenzhen.aliyuncs.com/2024-03/17115930219681afd35b0-8c93-400a-94f8-e49277c88616.png",
-        androidIcon: "https://zf-mall.oss-cn-shenzhen.aliyuncs.com/2024-03/1711593045466d069e7f6-5c77-40a0-a7b3-6e2b3a6ce0eb.png"
-	    })
-	  }
+      if (res?.data?.payQrcode) {
+        this.QRcodeList.push({
+          codeUrl: res.data.payQrcode,
+          name: "收款码",
+          saleName: "",
+          iosIcon: "https://zf-mall.oss-cn-shenzhen.aliyuncs.com/2024-03/17115930219681afd35b0-8c93-400a-94f8-e49277c88616.png",
+          androidIcon: "https://zf-mall.oss-cn-shenzhen.aliyuncs.com/2024-03/1711593045466d069e7f6-5c77-40a0-a7b3-6e2b3a6ce0eb.png"
+        })
+      }
     })
   },
   beforeDestroy() {

src/components/fileOnlineView/index.vue

@@ -1,75 +0,0 @@
-<template>
-  <div class="fileOnlineView">
-    <el-dialog
-      title="文件在线预览"
-      :show-close="true"
-      :modal="false"
-      :append-to-body="false"
-      :destroy-on-close="true"
-      :before-close="closeMapDispatch"
-      :visible.sync="mapDispatchDialog"
-    >
-      <div style="width: 100%; height: 100%" id="handout_wrap_inner">
-        <vue-office-excel :src="value" @rendered="rendered" />
-      </div>
-    </el-dialog>
-  </div>
-</template>
-
-<script>
-import VueOfficeExcel from '@vue-office/excel'
-import '@vue-office/excel/lib/index.css'
-export default {
-  components: {
-    VueOfficeExcel
-  },
-  props: {
-    value: {
-      type: String,
-      default: ''
-    }
-  },
-  data() {
-    return {
-      excel: '',
-      mapDispatchDialog: false
-    }
-  },
-  watch: {
-    value(newVal) {
-      this.$nextTick(() => {
-        this.mapDispatchDialog = newVal ? true : false
-      })
-    }
-  },
-  methods: {
-    rendered() {
-      console.log('渲染完成')
-    },
-    closeMapDispatch() {
-      this.$emit('input', '')
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-.fileOnlineView {
-  .el-dialog__wrapper {
-    width: 100% !important;
-    height: 100% !important;
-    position: absolute !important;
-  }
-  .el-dialog {
-    margin: 0 !important;
-    width: 100%;
-    height: 100%;
-  }
-  .el-dialog__body {
-    padding: 0 !important;
-    width: 100%;
-    height: calc(100% - 58px);
-    position: relative;
-  }
-}
-</style>

src/components/head.vue

@@ -1,21 +1,20 @@
 <template>
   <div class="headview">
-    <div class="asleft">
-      <dv-scroll-board
-        ref="scrollBoard"
-        :config="config"
-        style="width: 100%; height: 100%"
-      />
+    <div class="dierjibie">
+      <img :src="[img0, img1, img2][swindex]" alt="" srcset="" />
+      <div class="asleft">
+      </div>
+      <div class="aszhongjian">
+        {{userInfo.companyWechatId ? userInfo.companyName : "售修宝运营平台"}}
+      </div>
+      <div class="asright">{{ timeStr }}</div>
     </div>
-    <img :src="[img0, img1, img2][swindex]" alt="" srcset="" />
-    <div class="asright">{{ timeStr }}</div>
   </div>
 </template>
 
 <script>
-import { dateFormat } from '@/utils/tool.js';
-import { tq } from '@/api/bigView.js';
-import img0 from '@/assets/head0.png';
+import { dateFormat2 } from '@/utils/util.js';
+import img0 from '@/assets/head8.png';
 import img1 from '@/assets/head1.png';
 import img2 from '@/assets/head2.png';
 export default {
@@ -33,55 +32,26 @@ export default {
       timeStr: '',
       timeId: null,
       info: {},
-      config: {
-        rowNum: 1,
-        carousel: 'page',
-        data: [],
-        waitTime: 3000,
-      },
     };
   },
+  computed: {
+    // 用户信息
+    userInfo() {
+      return JSON.parse(localStorage.getItem('greemall_user'))
+    },
+  },
   mounted() {
-    this.gettq();
-    this.timeId2 = setInterval(this.gettq, 60000 * 60 * 8);
-    this.timeId = setInterval(() => {
-      let date = new Date();
-      this.timeStr = dateFormat('YYYY-mm-dd HH:MM:SS WWW', date);
-    }, 1000);
+    this.jishikaishi()
   },
   beforeUnmount() {
     this.timeId && clearInterval(this.timeId);
-    this.timeId2 && clearInterval(this.timeId2);
   },
   methods: {
-    gettq() {
-      Promise.all([
-        tq('广州市'),
-        tq('清远市'),
-        tq('韶关市'),
-        tq('佛山市'),
-        tq('肇庆市'),
-        tq('云浮市'),
-      ])
-        .then((reslist) => {
-          var atrlist = reslist.map((item2) => {
-            var item = item2.data;
-            return [
-              `<div class="jajajaj">${
-                item.result.city
-                  ? `${item.result.city} ：${item.result.weather || ''} ${
-                      item.result.templow || ''
-                    }℃ ~${item.result.temphigh || ''}℃`
-                  : ''
-              }</div>`,
-            ];
-          });
-          this.$refs['scrollBoard'].updateRows(atrlist);
-        })
-        .catch((err) => {
-          console.log(err);
-        });
-    },
+    jishikaishi(){
+      let date = new Date();
+      this.timeStr = dateFormat2('YYYY-mm-dd HH:MM:SS WWW', date);
+      this.timeId = setTimeout(this.jishikaishi,1000);
+    }
   },
 };
 </script>
@@ -109,19 +79,43 @@ export default {
   height: 100%;
   position: relative;
   overflow: hidden;
+  .dierjibie{
+    width: 100%;
+    min-width: 1600px;
+    height: 100%;
+    position: absolute;
+    top: 0;
+    left: 50%;
+    transform: translateX(-50%);
+  }
   img {
     position: absolute;
     bottom: 0;
-    width: 1920;
+    width: 100%;
+    min-width: 1600px;
     height: 58px;
   }
+  .aszhongjian {
+    font-family: Source Han Sans CN;
+    font-weight: 500;
+    font-size: 36px;
+    color: #FFFFFF;
+    line-height: 35px;
+    background: linear-gradient(0deg, #FFFFFF 0%, #B0D7FF 100%);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    position: absolute;
+    bottom: 12px;
+    left: 50%;
+    transform: translateX(-50%);
+    text-align: center;
+  }
   .asleft {
-    width: 500px;
     height: 24px;
     overflow: hidden;
     position: absolute;
-    bottom: 10px;
-    left: 67px;
+    bottom: 12px;
+    left: 160px;
   }
   .asright {
     font-size: 20px;
@@ -130,8 +124,8 @@ export default {
     text-align: left;
     color: #34c7ff;
     position: absolute;
-    bottom: 10px;
-    right: 67px;
+    bottom: 12px;
+    right: 160px;
   }
 }
 </style>

src/components/moduleEnclosure.vue

@@ -10,7 +10,7 @@
             />
             <span>{{ title }}</span>
           </div>
-          <div>
+          <div class="am-moduleEnclosureTitle-right">
             <slot name="rightce" />
           </div>
         </div>
@@ -50,22 +50,29 @@ export default {
   border: 3px solid #082570;
   border-image: linear-gradient(0deg, #34c7ff 0%, #26d5ff 51%, #34c7ff 100%) 3 3;
   box-sizing: border-box;
-  padding: 16px;
+  padding: 12px;
 }
 .am-moduleEnclosurecon {
   position: absolute;
-  top: 16px;
-  bottom: 16px;
-  left: 16px;
-  right: 16px;
+  top: 12px;
+  bottom: 12px;
+  left: 12px;
+  right: 12px;
   z-index: 999;
 }
 .am-moduleEnclosureTitle-div {
-  width: 100%;
   height: 20px;
   display: flex;
   flex-direction: row;
   align-items: center;
+  flex-shrink: 0;
+  margin-right: 20px;
+}
+.am-moduleEnclosureTitle-right {
+  width: 0;
+  flex: 1;
+  display: flex;
+  justify-content: flex-end;
 }
 .am-moduleEnclosureTitle {
   width: 100%;
@@ -73,6 +80,7 @@ export default {
   display: flex;
   flex-direction: row;
   align-items: center;
+  justify-content: space-between;
   margin-top: -4px;
   font-size: 14px;
   font-family: Source Han Sans CN, Source Han Sans CN-Bold;

src/permission.js

@@ -62,13 +62,13 @@ router.beforeEach(async (to, from, next) => {
           lay.children = []
           for (var route of store.getters.menus) {
             if (route.code == "bigViews") {
-              // router.addRoutes([{
-              //   path: '/bigViews',
-              //   code: "bigViews",
-              //   name: "bigViews",
-              //   component: _import(`${route.fullUrl}/index`),
-              //   hidden: true
-              // }])
+              router.addRoutes([{
+                path: '/bigViews',
+                code: "bigViews",
+                name: "bigViews",
+                component: _import(`${route.fullUrl}/index`),
+                hidden: true
+              }])
             } else if (moduleObj[route.code] !== false) {
               lay.children.push(...buildRoute(route))
             }
@@ -78,13 +78,13 @@ router.beforeEach(async (to, from, next) => {
           global.antRouter = []
           for (var route of store.getters.menus) {
             if (route.code == "bigViews") {
-              // global.antRouter.push({
-              //   path: '/bigViews',
-              //   code: "bigViews",
-              //   name: "bigViews",
-              //   component: _import(`${route.fullUrl}/index`),
-              //   hidden: true
-              // })
+              global.antRouter.push({
+                path: '/bigViews',
+                code: "bigViews",
+                name: "bigViews",
+                component: _import(`${route.fullUrl}/index`),
+                hidden: true
+              })
             } else if (moduleObj[route.code] !== false) {
               global.antRouter.push(...buildRoute(route, '', false))
             }

src/utils/util.js

@@ -2,6 +2,68 @@ import axios from 'axios'
 import FileSaver from 'file-saver'
 import { getToken } from '@/utils/auth'
 
+export function dateFormat2(format, date) {
+  if (typeof date === 'string') {
+    date = new Date(date);
+  }
+  const we = date.getDay(); // 星期
+  const qut = Math.floor((date.getMonth() + 3) / 3).toString(); // 季度
+  const opt = {
+    'Y+': date.getFullYear().toString(), // 年
+    'm+': (date.getMonth() + 1).toString(), // 月(月份从0开始，要+1)
+    'd+': date.getDate().toString(), // 日
+    'H+': date.getHours().toString(), // 时
+    'M+': date.getMinutes().toString(), // 分
+    'S+': date.getSeconds().toString(), // 秒
+    'q+': qut, // 季度
+  };
+  const week = {
+    // 中文数字 (星期)
+    0: '日',
+    1: '一',
+    2: '二',
+    3: '三',
+    4: '四',
+    5: '五',
+    6: '六',
+  };
+  const quarter = {
+    // 中文数字（季度）
+    1: '一',
+    2: '二',
+    3: '三',
+    4: '四',
+  };
+  if (/(W+)/.test(format)) {
+    format = format.replace(
+      RegExp.$1,
+      RegExp.$1.length > 1
+        ? RegExp.$1.length > 2
+          ? '星期' + week[we]
+          : '周' + week[we]
+        : week[we]
+    );
+  }
+  if (/(Q+)/.test(format)) {
+    // 输入一个Q，只输出一个中文数字，输入4个Q，则拼接上字符串
+    format = format.replace(
+      RegExp.$1,
+      RegExp.$1.length === 4 ? '第' + quarter[qut] + '季度' : quarter[qut]
+    );
+  }
+  for (const k in opt) {
+    const r = new RegExp('(' + k + ')').exec(format);
+    if (r) {
+      // 若输入的长度不为1，则前面补零
+      format = format.replace(
+        r[1],
+        RegExp.$1.length === 1 ? opt[k] : opt[k].padStart(RegExp.$1.length, '0')
+      );
+    }
+  }
+  return format;
+}
+
 // 定义一个函数将树形数据转换为列表
 export function treeToList(tree, key = "children", list = []) {
   // 将当前节点添加到列表中

src/views/auxiliaryFittings/purchasingManagement/mixins/form_tpl.js

@@ -870,6 +870,9 @@ export default {
                                 this.peijianList = []
                               }
                             }
+                            if(!this.formData.isImport){
+                              this.getorderlist()
+                            }
                             this.$nextTick(this.jiaoyan)
                           }}
                         >

src/views/bigViews/dataView1/components/accessoryStatistics.vue

@@ -1,37 +1,92 @@
 <template>
-  <moduleEnclosure title="近30日辅配件统计">
-    <div class="heat-lay">
-    </div>
-  </moduleEnclosure>
+	<moduleEnclosure title="近30日辅配件统计">
+		<div class="all-container">
+			<div class="item">
+				<div class="title">辅材销售</div>
+				<div class="num">{{statsData.fcxs || 0}}单</div>
+			</div>
+			<div class="item">
+				<div class="title">辅材退货</div>
+				<div class="num">{{statsData.fcth || 0}}单</div>
+			</div>
+			<div class="item">
+				<div class="title">配件销售</div>
+				<div class="num">{{statsData.pjxs || 0}}单</div>
+			</div>
+			<div class="item">
+				<div class="title">配件退货</div>
+				<div class="num">{{statsData.pjth || 0}}单</div>
+			</div>
+			<div class="item">
+				<div class="title">新件待返还</div>
+				<div class="num">{{statsData.xjdfh || 0}}件</div>
+			</div>
+			<div class="item">
+				<div class="title">旧件待返还</div>
+				<div class="num">{{statsData.jjdfh || 0}}件</div>
+			</div>
+			<div class="item">
+				<div class="title">旧件待返厂</div>
+				<div class="num">{{statsData.jjdfc || 0}}件</div>
+			</div>
+		</div>
+	</moduleEnclosure>
 </template>
 
 <script>
-import moduleEnclosure from '@/components/moduleEnclosure.vue';
-export default {
-  components: {
-    moduleEnclosure,
-  },
-  data() {
-    return {
-      
-    };
-  },
-  mounted() {
+	import moduleEnclosure from '@/components/moduleEnclosure.vue';
+	import { getMaterialStats } from '@/api/bigView.js';
 
-  },
-  beforeUnmount() {
+	export default {
+		components: {
+			moduleEnclosure,
+		},
+		
+		data() {
+			return {
+				statsData: {},
+			};
+		},
 
-  },
-  methods: {
+		mounted() {
+			this.getData();
+		},
 
-  },
-};
+		beforeUnmount() {
+
+		},
+
+		methods: {
+			getData() {
+				getMaterialStats().then(res => {
+					this.statsData = res.data;
+				})
+			},
+		},
+	};
 </script>
 
 <style scoped lang="scss">
-.heat-lay {
-  width: 100%;
-  height: 100%;
- 
+.all-container {
+	width: 100%;
+	height: 100%;
+	padding-top: 12px;
+	box-sizing: border-box;
+	display: flex;
+	flex-wrap: wrap;
+	.item {
+		width: 25%;
+		height: 50%;
+		.title {
+			font-size: 14px;
+			color: #ffffff;
+			margin-bottom: 8px;
+		}
+		.num {
+			color: #33a8c9;
+			font-size: 18px;
+			font-weight: bold;
+		}
+	}
 }
-</style>
+</style>

src/views/bigViews/dataView1/components/mapDataStatistics.vue

@@ -1,152 +1,29 @@
 <template>
   <div class="heat-lay">
     <div class="heat-lay-flex">
-      <div class="heat-lay-item" style="width: 190%">
+      <div class="heat-lay-item" style="width: 100%" v-if="userInfo.type==2">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">今日新增安装单</div>
-          <div class="duplicatelay">
-            <div
-              id="lingshou1"
-              style="cursor: pointer"
-              @click="
-                openPopUp($event, 'lingshou1', '今日新增安装单-零售（台/单）')
-              "
-            >
-              <div class="heat-item-style1-num1-2">零售</div>
-              <div class="heat-item-style1-num1">
-                <span class="heat-item-style1-num1-1 c1">
-                  {{ info.machineTotalR || 0 }}
-                </span>
-                <span class="heat-item-style1-num1-2"> 台 </span>
-              </div>
-              <div class="heat-item-style1-num2">
-                <span class="heat-item-style1-num2-1 c2">
-                  {{ info.orderTotalR || 0 }}
-                </span>
-                <span class="heat-item-style1-num2-2">单</span>
-              </div>
-            </div>
-            <div
-              id="gongcheng1"
-              style="cursor: pointer"
-              @click="
-                openPopUp($event, 'gongcheng1', '今日新增安装单-工程（台/单）')
-              "
-            >
-              <div class="heat-item-style1-num1-2">工程</div>
-              <div class="heat-item-style1-num1">
-                <span class="heat-item-style1-num1-1 c1">
-                  {{ info.machineTotalP || 0 }}
-                </span>
-                <span class="heat-item-style1-num1-2"> 台 </span>
-              </div>
-              <div class="heat-item-style1-num2">
-                <span class="heat-item-style1-num2-1 c2">
-                  {{ info.orderTotalP || 0 }}
-                </span>
-                <span class="heat-item-style1-num2-2">单</span>
-              </div>
-            </div>
+          <div class="heat-item-style1-title">总运营商户（家）</div>
+          <div class="fujimaintext">
+            <div class="mainText">{{Number(info.companyNum)}}</div>
           </div>
         </div>
       </div>
       <div class="averticalBart"></div>
-      <div class="heat-lay-item" style="width: 190%">
+      <div class="heat-lay-item" style="width: 100%">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">今日完工安装单</div>
-          <div class="duplicatelay">
-            <div
-              id="lingshou2"
-              style="cursor: pointer"
-              @click="
-                openPopUp($event, 'lingshou2', '今日完工安装单-零售（台/单）')
-              "
-            >
-              <div class="heat-item-style1-num1-2">零售</div>
-              <div class="heat-item-style1-num1">
-                <span class="heat-item-style1-num1-1 c1">
-                  {{ info.machineCompleteR || 0 }}
-                </span>
-                <span class="heat-item-style1-num1-2"> 台 </span>
-              </div>
-              <div class="heat-item-style1-num2">
-                <span class="heat-item-style1-num2-1 c2">
-                  {{ info.orderCompleteR || 0 }}
-                </span>
-                <span class="heat-item-style1-num2-2">单</span>
-              </div>
-            </div>
-            <div
-              id="gongcheng2"
-              style="cursor: pointer"
-              @click="
-                openPopUp($event, 'gongcheng2', '今日完工安装单-工程（台/单）')
-              "
-            >
-              <div class="heat-item-style1-num1-2">工程</div>
-              <div class="heat-item-style1-num1">
-                <span class="heat-item-style1-num1-1 c1">
-                  {{ info.machineCompleteP || 0 }}
-                </span>
-                <span class="heat-item-style1-num1-2"> 台 </span>
-              </div>
-              <div class="heat-item-style1-num2">
-                <span class="heat-item-style1-num2-1 c2">
-                  {{ info.orderCompleteP || 0 }}
-                </span>
-                <span class="heat-item-style1-num2-2">单</span>
-              </div>
-            </div>
+          <div class="heat-item-style1-title">总工程师（人）</div>
+          <div class="fujimaintext">
+            <div class="mainText">{{Number(info.allWorker)}}</div>
           </div>
         </div>
       </div>
       <div class="averticalBart"></div>
-      <div class="heat-lay-item" style="width: 190%">
+      <div class="heat-lay-item" style="width: 100%">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">安装未完工累计</div>
-          <div class="duplicatelay">
-            <div
-              id="lingshou3"
-              style="cursor: pointer"
-              @click="
-                openPopUp($event, 'lingshou3', '安装未完工累计-零售（台/单）')
-              "
-            >
-              <div class="heat-item-style1-num1-2">零售</div>
-              <div class="heat-item-style1-num1">
-                <span class="heat-item-style1-num1-1 c4">
-                  {{ info.machineOpenR || 0 }}
-                </span>
-                <span class="heat-item-style1-num1-2"> 台 </span>
-              </div>
-              <div class="heat-item-style1-num2">
-                <span class="heat-item-style1-num2-1 c3">
-                  {{ info.orderOpenR || 0 }}
-                </span>
-                <span class="heat-item-style1-num2-2">单</span>
-              </div>
-            </div>
-            <div
-              id="gongcheng3"
-              style="cursor: pointer"
-              @click="
-                openPopUp($event, 'gongcheng3', '安装未完工累计-工程（台/单）')
-              "
-            >
-              <div class="heat-item-style1-num1-2">工程</div>
-              <div class="heat-item-style1-num1">
-                <span class="heat-item-style1-num1-1 c4">
-                  {{ info.machineOpenP || 0 }}
-                </span>
-                <span class="heat-item-style1-num1-2"> 台 </span>
-              </div>
-              <div class="heat-item-style1-num2">
-                <span class="heat-item-style1-num2-1 c3">
-                  {{ info.orderOpenP || 0 }}
-                </span>
-                <span class="heat-item-style1-num2-2">单</span>
-              </div>
-            </div>
+          <div class="heat-item-style1-title">总分销员（人）</div>
+          <div class="fujimaintext">
+            <div class="mainText">{{Number(info.allService)}}</div>
           </div>
         </div>
       </div>
@@ -156,499 +33,140 @@
           id="jinrshifucq"
           class="heat-item-style1"
           style="cursor: pointer"
-          @click="openPopUp($event, 'jinrshifucq', '今日出勤师傅')"
         >
-          <div class="heat-item-style1-title">今日出勤师傅</div>
-          <br />
-          <div class="heat-item-style1-num1">
-            <span class="heat-item-style1-num1-1 c2">
-              {{ info.cqry || 0 }}
-            </span>
-            <span class="heat-item-style1-num1-2"> 人 </span>
-          </div>
-        </div>
-      </div>
-      <div class="averticalBart"></div>
-      <div class="heat-lay-item" style="cursor: pointer" @click="jinrhaop(0)">
-        <div class="heat-item-style1">
-          <div class="heat-item-style1-title">今日差评数</div>
-          <br />
-          <div class="heat-item-style1-num1">
-            <span class="heat-item-style1-num1-1 c4">
-              {{ info.badNum || 0 }}
-            </span>
-            <span class="heat-item-style1-num1-2"> 单 </span>
+          <div class="heat-item-style1-title">总用户数（人）</div>
+          <div class="fujimaintext">
+            <div class="mainText">{{Number(info.allUser)}}</div>
           </div>
         </div>
       </div>
     </div>
     <div class="horizontalLine"></div>
     <div class="heat-lay-flex">
-      <div class="heat-lay-item" style="width: 190%">
+      <div class="heat-lay-item" style="width: 100%" v-if="userInfo.type==2">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">今日新增维修单</div>
-          <div class="duplicatelay">
-            <div
-              id="weixiu1"
-              style="cursor: pointer"
-              @click="openPopUp($event, 'weixiu1', '今日新增维修单-维修（单）')"
-            >
-              <div class="heat-item-style1-num1-2">维修</div>
-              <div class="heat-item-style1-num1">
-                <span class="heat-item-style1-num1-1 c1">
-                  {{ info.newwx || 0 }}
-                </span>
-                <span class="heat-item-style1-num1-2"> 单 </span>
-              </div>
-            </div>
-            <div
-              id="qingxi1"
-              style="cursor: pointer"
-              @click="openPopUp($event, 'qingxi1', '今日新增清洗单-清洗（单）')"
-            >
-              <div class="heat-item-style1-num1-2">清洗</div>
-              <div class="heat-item-style1-num1">
-                <span class="heat-item-style1-num1-1 c1">
-                  {{ info.newqx || 0 }}
-                </span>
-                <span class="heat-item-style1-num1-2"> 单 </span>
-              </div>
-            </div>
+          <div class="heat-item-style1-title">今日登入商户（家）</div>
+          <div class="fujimaintext">
+            <div class="mainText">{{Number(info.loginCompanyNum)}}</div>
+            <div class="subText">{{Number(info.loginCompanyNumPer)}}%</div>
           </div>
         </div>
       </div>
       <div class="averticalBarb"></div>
-      <div class="heat-lay-item" style="width: 190%">
+      <div class="heat-lay-item" style="width: 100%">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">今日完工维修单</div>
-          <div class="duplicatelay">
-            <div
-              id="weixiu2"
-              style="cursor: pointer"
-              @click="openPopUp($event, 'weixiu2', '今日完工维修单-维修（单）')"
-            >
-              <div class="heat-item-style1-num1-2">维修</div>
-              <div class="heat-item-style1-num1">
-                <span class="heat-item-style1-num1-1 c1">
-                  {{ info.completewx || 0 }}
-                </span>
-                <span class="heat-item-style1-num1-2"> 单 </span>
-              </div>
-            </div>
-            <div
-              id="qingxi2"
-              style="cursor: pointer"
-              @click="openPopUp($event, 'qingxi2', '今日完工清洗单-清洗（单）')"
-            >
-              <div class="heat-item-style1-num1-2">清洗</div>
-              <div class="heat-item-style1-num1">
-                <span class="heat-item-style1-num1-1 c1">
-                  {{ info.completeqx || 0 }}
-                </span>
-                <span class="heat-item-style1-num1-2"> 单 </span>
-              </div>
-            </div>
+          <div class="heat-item-style1-title">今日登入工程师（人）</div>
+          <div class="fujimaintext">
+            <div class="mainText">{{Number(info.loginAllWorker)}}</div>
+            <div class="subText">{{Number(info.loginAllWorkerPer)}}%</div>
           </div>
         </div>
       </div>
       <div class="averticalBarb"></div>
-      <div class="heat-lay-item" style="width: 190%">
+      <div class="heat-lay-item" style="width: 100%">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">维修未完工累计</div>
-          <div class="duplicatelay">
-            <div
-              id="weixiu3"
-              style="cursor: pointer"
-              @click="openPopUp($event, 'weixiu3', '维修未完工累计-维修（单）')"
-            >
-              <div class="heat-item-style1-num1-2">维修</div>
-              <div class="heat-item-style1-num1">
-                <span class="heat-item-style1-num1-1 c4">
-                  {{ info.openwx || 0 }}
-                </span>
-                <span class="heat-item-style1-num1-2"> 单 </span>
-              </div>
-            </div>
-            <div
-              id="qingxi3"
-              style="cursor: pointer"
-              @click="openPopUp($event, 'qingxi3', '清洗未完工累计-清洗（单）')"
-            >
-              <div class="heat-item-style1-num1-2">清洗</div>
-              <div class="heat-item-style1-num1">
-                <span class="heat-item-style1-num1-1 c4">
-                  {{ info.openqx || 0 }}
-                </span>
-                <span class="heat-item-style1-num1-2"> 单 </span>
-              </div>
-            </div>
+          <div class="heat-item-style1-title">今日登入分销员（人）</div>
+          <div class="fujimaintext">
+            <div class="mainText">{{Number(info.loginAllService)}}</div>
+            <div class="subText">{{Number(info.loginAllServicePer)}}%</div>
           </div>
         </div>
       </div>
       <div class="averticalBarb"></div>
       <div class="heat-lay-item">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">今日回收工单</div>
-          <br />
-          <div class="heat-item-style1-num1">
-            <span class="heat-item-style1-num1-1 c1">
-              {{ info.hsgd || 0 }}
-            </span>
-            <span class="heat-item-style1-num1-2"> 单 </span>
-          </div>
-        </div>
-      </div>
-      <div class="averticalBarb"></div>
-      <!-- style="cursor: pointer" @click="jinrhaop(1)" -->
-      <div class="heat-lay-item">
-        <div class="heat-item-style1">
-          <div class="heat-item-style1-title">今日好评率</div>
-          <br />
-          <div class="heat-item-style1-num1">
-            <span class="heat-item-style1-num1-1 c2">
-              {{ info.goodRate || 0 }}
-            </span>
-            <span class="heat-item-style1-num1-2"> % </span>
+          <div class="heat-item-style1-title">今日登入用户（人）</div>
+          <div class="fujimaintext">
+            <div class="mainText">{{Number(info.loginAllUser)}}</div>
+            <div class="subText">{{Number(info.loginAllUserPer)}}%</div>
           </div>
         </div>
       </div>
     </div>
-    <Teleport to="body">
-      <popUp
-        :show="show"
-        :top="top"
-        :left="left"
-        :title="title"
-        :item="item"
-        :style="style"
-        @col="
-          (bool) => {
-            show = bool;
-            if (!bool) {
-              style = {};
-              item = [];
-              renshu = false;
-              timeId2 && timeId2();
-            }
-          }
-        "
-      >
-        <div v-if="renshu">
-          <div v-for="(item, index) in renshuliev" :key="index">
-            <br />
-            <div style="display: flex; justify-content: space-between">
-              <span class="subheading">{{ item.typeName }}:</span
-              ><span class="jinge">{{ item.numbers }}人</span>
-            </div>
-          </div>
-        </div>
-      </popUp>
-      <el-dialog
-        width="70%"
-        v-model="dialogVisible"
-        :before-close="handleClose"
-        style="z-index: 10000000000"
-      >
-        <table border="1" style="width: 100%">
-          <thead>
-            <tr>
-              <th>类型</th>
-              <th>工单号</th>
-              <th>网点名称</th>
-              <th>主服务人员编号</th>
-              <th>主服务人员名称</th>
-              <th>评价述</th>
-            </tr>
-          </thead>
-          <tbody>
-            <tr v-for="(item, index) in cplie" :key="index">
-              <td class="xiaolie">{{ item.type }}</td>
-              <td class="xiaolie300">{{ item.workerOrderNo }}</td>
-              <td class="xiaolie320">{{ item.websitName }}</td>
-              <td class="xiaolie150">{{ item.wonumber }}</td>
-              <td class="xiaolie120">{{ item.woname }}</td>
-              <td>{{ item.tips }}</td>
-            </tr>
-          </tbody>
-        </table>
-        <el-pagination
-          layout="prev, pager, next"
-          :page-size="pageSize"
-          :current-page="pageNum"
-          :total="total"
-          @current-change="currentChange"
-        />
-      </el-dialog>
-    </Teleport>
   </div>
 </template>
 
 <script>
-import {
-  getCommonly,
-  getQuery15,
-  getQuery22,
-  getQuery23_1,
-} from '@/api/bigView.js';
-import popUp from '@/components/pop-up.vue';
-import bus from '@/utils/eventBus.js';
+import { bigGetRegion, bigGetLarge1, bigGetLarge2 } from '@/api/common.js';
 export default {
-  components: { popUp },
+  components: {  },
   data() {
     return {
-      info: {},
-      show: false,
-      top: 0,
-      left: 0,
-      title: '',
-      item: [],
-      timeId2: null,
-      renshu: false,
-      style: {},
-      renshuliev: [],
-      dialogVisible: false,
-      cplie: [],
-      total: 0,
-      pageNum: 1,
-      pageSize: 10,
-      typenum: null,
+      info:{
+        "allService": 0,
+        "allUser": 0,
+        "allWorker": 0,
+        "allWorkerOrderNum": 0,
+        "companyNum": 0,
+        "increOrderNum": 0,
+        "loginAllService": 0,
+        "loginAllServicePer": 0,
+        "loginAllUser": 0,
+        "loginAllUserPer": 0,
+        "loginAllWorker": 0,
+        "loginAllWorkerPer": 0,
+        "loginCompanyNum": 0,
+        "loginCompanyNumPer": 0,
+        "neverWorkerNum": 0,
+        "salesOrderNum": 0
+      }
     };
   },
-  watch: {
-    dialogVisible() {
-      if (this.dialogVisible) {
-        bus.emit('autoplay', false);
-      } else {
-        bus.emit('autoplay', true);
-      }
+  computed: {
+    userInfo() {
+      return JSON.parse(localStorage.getItem('greemall_user'))
     },
   },
-  mounted() {
-    this.timeId = getCommonly((res) => {
-      this.info = res.data;
-    }, 60000);
-  },
-  beforeUnmount() {
-    this.timeId();
+  watch:{
+    "userInfo.type":{
+      handler(newVal, oldVal) {
+        this.getBigGetLarge1()
+      },
+      deep: true,
+      immediate: true,
+    }
   },
   methods: {
-    currentChange(a) {
-      this.pageNum = a;
-      this.jinrhaop();
-    },
-    jinrhaop() {
-      getQuery23_1({
-        params: {
-          typeCode: 0,
-          pageNum: this.pageNum,
-          pageSize: this.pageSize,
-        },
-      }).then((res) => {
-        if (!this.dialogVisible) {
-          this.dialogVisible = true;
-        }
-        this.total = res.data.total;
-        this.cplie = res.data.records;
-      });
-    },
-    handleClose() {
-      this.pageNum = 1;
-      this.dialogVisible = false;
-    },
-    openPopUp(e, id, title) {
-      if (id === 'jinrshifucq') {
-        getQuery22((res) => {
-          var { height, top, left } = document
-            .getElementById(id)
-            .getBoundingClientRect();
-          this.renshuliev = res.data;
-          this.title = title;
-          this.top = top + height;
-          this.left = left;
-          this.show = true;
-          this.renshu = true;
-          this.style = {
-            width: 'auto',
-          };
-        });
-      } else {
-        this.timeId2 = getQuery15((res) => {
-          var list = [
-            { city: '广州公司' },
-            { city: '佛山公司' },
-            { city: '天猫优品' },
-          ];
-          var keys = [];
-          var gz = [];
-          var fs = [];
-          res.data.map((item) => {
-            var { city, ...obj } = item;
-            var ind = ~['广州市', '清远市', '韶关市'].indexOf(city)
-              ? 0
-              : ~['佛山市', '肇庆市', '云浮市'].indexOf(city)
-              ? 1
-              : 2;
-            if (ind === 0) {
-              gz.push(item);
-            }
-            if (ind === 1) {
-              fs.push(item);
-            }
-            keys = Object.keys(obj);
-            keys.map((key) => {
-              if (list[ind][key] === undefined) {
-                list[ind][key] = 0;
-              }
-              list[ind][key] += obj[key];
-            });
-          });
-          list.map((obj) => {
-            if (Object.keys(obj).length === 1) {
-              keys.map((key) => {
-                obj[key] = 0;
-              });
-            }
-          });
-          gz.sort((a, b) => {
-            return (
-              ['广州市', '清远市', '韶关市'].indexOf(a.city) -
-              ['广州市', '清远市', '韶关市'].indexOf(b.city)
-            );
-          });
-          fs.sort((a, b) => {
-            return (
-              ['佛山市', '肇庆市', '云浮市'].indexOf(a.city) -
-              ['佛山市', '肇庆市', '云浮市'].indexOf(b.city)
-            );
-          });
-          this.item = [list[0], ...gz, list[1], ...fs, list[2]].map((item) => {
-            var obj = {
-              area: item.city,
-            };
-            if (id === 'lingshou1') {
-              obj.amount = item.insMacNewR;
-              obj.bills = item.insNewR;
-            } else if (id === 'lingshou2') {
-              obj.amount = item.insMacFinishR;
-              obj.bills = item.insFinishR;
-            } else if (id === 'lingshou3') {
-              obj.amount = item.insMacOpenR;
-              obj.bills = item.insOpenR;
-            } else if (id === 'gongcheng1') {
-              obj.amount = item.insMacNewP;
-              obj.bills = item.insNewP;
-            } else if (id === 'gongcheng2') {
-              obj.amount = item.insMacFinishP;
-              obj.bills = item.insFinishP;
-            } else if (id === 'gongcheng3') {
-              obj.amount = item.insMacOpenP;
-              obj.bills = item.insOpenP;
-            } else if (id === 'weixiu1') {
-              obj.amount = item.repNew;
-            } else if (id === 'weixiu2') {
-              obj.amount = item.repFinish;
-            } else if (id === 'weixiu3') {
-              obj.amount = item.repOpen;
-            } else if (id === 'qingxi1') {
-              obj.amount = item.repNewqx;
-            } else if (id === 'qingxi2') {
-              obj.amount = item.repFinishqx;
-            } else if (id === 'qingxi3') {
-              obj.amount = item.repOpenqx;
-            }
-            return obj;
-          });
-          var { height, top, left } = document
-            .getElementById(id)
-            .getBoundingClientRect();
-          this.title = title;
-          this.top = top + height;
-          this.left = left;
-          this.show = true;
-        }, 100000000000000);
-      }
-    },
+   getBigGetLarge1(pam){
+    if(this.userInfo){
+      (this.userInfo.type == 2 ? bigGetLarge1 : bigGetLarge2)(pam).then(res=>{
+        this.info = res.data
+        console.log(this.info,"niunpionpoimo;i")
+      })
+    }
+   }
   },
 };
 </script>
 
 <style scoped lang="scss">
-table {
-  width: 100%;
-  border-collapse: collapse;
-}
-
-table caption {
-  font-size: 2em;
-  font-weight: bold;
-  margin: 1em 0;
-}
-
-th,
-td {
-  border: 1px solid #ddd;
-  text-align: center;
-  padding: 6px 6px;
-}
-
-table thead tr {
-  background-color: #008c8c;
-  color: #fff;
-}
-
-table tbody tr:nth-child(odd) {
-  background-color: #eee;
-}
-
-table tbody tr:hover {
-  background-color: #ccc;
-}
-table tfoot tr td {
-  text-align: right;
-  padding-right: 20px;
-}
-.xiaolie {
-  width: 80px;
-}
-.xiaolie300 {
-  width: 220px;
-}
-.xiaolie320 {
-  width: 280px;
-}
-.xiaolie150 {
-  width: 150px;
-}
-.xiaolie120 {
-  width: 100px;
-}
 .heat-lay {
   width: 100%;
-  height: 180px;
+  height: 160px;
   & > div:nth-child(1) {
-    height: 90px;
+    height: 80px;
   }
   & > div:nth-child(3) {
-    height: 90px;
+    height: 80px;
   }
   .horizontalLine {
     width: 100%;
     height: 1px;
     border-radius: 2px;
-    background: linear-gradient(to right, #082570, #156ccf, #156ccf, #082570);
+    // background: linear-gradient(to right, #082570, #156ccf, #156ccf, #082570);
   }
   .averticalBart {
     height: 100%;
     min-width: 1px;
     border-radius: 2px;
-    background: linear-gradient(#082570, #156ccf);
+    // background: linear-gradient(#082570, #156ccf);
   }
 
   .averticalBarb {
     height: 100%;
     min-width: 1px;
     border-radius: 2px;
-    background: linear-gradient(#156ccf, #082570);
+    // background: linear-gradient(#156ccf, #082570);
   }
   .heat-lay-item {
     height: 100%;
@@ -663,13 +181,6 @@ table tfoot tr td {
     flex-direction: row;
     align-items: center;
   }
-  .heat-item-style1-num1-2 {
-    font-size: 14px;
-    font-family: Source Han Sans CN, Source Han Sans CN-Regular;
-    font-weight: 400;
-    // margin-left: 10px;
-    color: #8ab1dc;
-  }
   .heat-item-style1 {
     width: 100%;
     height: 100%;
@@ -677,73 +188,33 @@ table tfoot tr td {
       font-size: 14px;
       font-family: Source Han Sans CN, Source Han Sans CN-Regular;
       font-weight: 400;
-      // text-align: center;
-      color: #8ab1dc;
+      color: #fff;
       margin-bottom: 5px;
+      line-height: 28px;
+      box-sizing: border-box;
+      padding: 0 5px;
+      background:repeating-linear-gradient(to right, rgba(250,250,250,.3),rgba(250,250,250,.0));
     }
-    .heat-item-style1-num1,
-    .heat-item-style1-num2 {
-      width: 100%;
-      height: auto;
+    .fujimaintext{
+      width:100%;
       display: flex;
+      justify-content: space-between;
+      align-items: flex-end;
       flex-direction: row;
-      align-items: center;
-      // justify-content: flex-end;
-      .heat-item-style1-num1-1 {
-        font-size: 18px;
-        font-family: Source Han Sans CN, Source Han Sans CN-Medium;
-        font-weight: 500;
-      }
-
-      .heat-item-style1-num2-1 {
-        font-size: 14px;
-        font-family: Source Han Sans CN, Source Han Sans CN-Regular;
-        font-weight: 400;
-      }
-      .heat-item-style1-num2-2 {
-        font-size: 14px;
-        font-family: Source Han Sans CN, Source Han Sans CN-Regular;
-        font-weight: 400;
-        color: #8ab1dc;
-      }
-      .c1 {
-        color: #3be9ff;
-      }
-      .c2 {
-        color: #3ce783;
-      }
-      .c3 {
-        color: #e15960;
-      }
-      .c4 {
-        color: #ff9900;
-      }
+      margin-top: 18px;
+      box-sizing: border-box;
+      padding-right: 10px;
     }
-  }
-  .duplicatelay {
-    width: 100%;
-    height: auto;
-    display: flex;
-    justify-content: space-between;
-    & > div {
-      width: 100%;
+    .mainText{
+      font-size: 30px;
+      font-weight: bold;
+      line-height: 22px;
+      color: #fff;
+    }
+    .subText{
+      font-size: 14px;
+      color: #ff0;
     }
   }
 }
-.subheading {
-  font-size: 16px;
-  font-family: Source Han Sans CN, Source Han Sans CN-Medium;
-  font-weight: 500;
-  color: #93b0d8;
-  line-height: 25px;
-  text-align: right;
-}
-.jinge {
-  font-size: 16px;
-  font-family: Source Han Sans CN, Source Han Sans CN-Medium;
-  font-weight: 500;
-  color: #ffffff;
-  line-height: 25px;
-  text-align: right;
-}
 </style>

src/views/bigViews/dataView1/components/mapdata.vue

@@ -3,43 +3,16 @@
     <zj-page-container>
       <map-data-statistics />
       <zj-page-fill>
-        <div
-          style="
+        <div style="
             width: 100%;
             height: 100%;
             overflow: hidden;
             position: relative;
-          "
-        >
-          <div
-            id="chart_7"
-            class="chart t_btn9"
-            style="width: 100%; height: 100%"
-          ></div>
+          ">
+          <div id="chart_7" class="chart t_btn9" style="width: 100%; height: 100%"></div>
           <div class="leixingxianshi">
             <div class="viewfilediv">
-              <div class="zfx c1"></div>
-              <span>新增安装</span>
-            </div>
-            <div class="viewfilediv">
-              <div class="zfx c2"></div>
-              <span>安装设备</span>
-            </div>
-            <div class="viewfilediv">
-              <div class="zfx c3"></div>
-              <span>新增维修</span>
-            </div>
-            <div class="viewfilediv">
-              <div class="zfx c9"></div>
-              <span>新增清洗</span>
-            </div>
-            <div class="viewfilediv">
-              <div class="zfx c4"></div>
-              <span>安装未完工</span>
-            </div>
-            <div class="viewfilediv">
-              <div class="zfx c5"></div>
-              <span>维修未完工</span>
+              <div class="zfx" style="width:60px; background: linear-gradient(to right, #6ada40,#ebe24a,#d73921);"></div>
             </div>
           </div>
         </div>
@@ -53,8 +26,37 @@ import zhejiang from './js/zhejiang.js';
 import moduleEnclosure from '@/components/moduleEnclosure.vue';
 import mapDataStatistics from './mapDataStatistics.vue';
 import * as echarts from 'echarts';
-import { getQuery15 } from '@/api/bigView.js';
-import { csize } from '@/utils/const.js';
+import { bigGetRegion, bigGetLarge9, bigGetLarge10 } from '@/api/common.js';
+// 计算 GeoJSON 数据的边界框
+function calculateBoundingBox(geoJsonData) {
+  let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+  geoJsonData.features.forEach((feature) => {
+    const coordinates = feature.geometry.coordinates;
+    const type = feature.geometry.type;
+    if (type === 'Polygon') {
+      coordinates.forEach((polygon) => {
+        polygon.forEach((coord) => {
+          minX = Math.min(minX, coord[0]);
+          minY = Math.min(minY, coord[1]);
+          maxX = Math.max(maxX, coord[0]);
+          maxY = Math.max(maxY, coord[1]);
+        });
+      });
+    } else if (type === 'MultiPolygon') {
+      coordinates.forEach((multiPolygon) => {
+        multiPolygon.forEach((polygon) => {
+          polygon.forEach((coord) => {
+            minX = Math.min(minX, coord[0]);
+            minY = Math.min(minY, coord[1]);
+            maxX = Math.max(maxX, coord[0]);
+            maxY = Math.max(maxY, coord[1]);
+          });
+        });
+      });
+    }
+  });
+  return { minX, minY, maxX, maxY };
+}
 export default {
   components: {
     moduleEnclosure,
@@ -77,49 +79,89 @@ export default {
       cIndex: 0,
       oldcIndex: 0,
       myChart: null,
+      getLarge9: [],
+      getLarge10: []
     };
   },
-  mounted() {
-    echarts.registerMap('guangdong', zhejiang);
-    this.timeId = getQuery15((res) => {
-      var names = this.data.map((item) => item.name);
-      this.list = res.data.filter((item) => ~names.indexOf(item.city));
-      this.list.sort((a, b) => {
-        return names.indexOf(a.city) - names.indexOf(b.city);
-      });
-    }, 60000);
-    this.echart_7();
+  computed: {
+    userInfo() {
+      return JSON.parse(localStorage.getItem('greemall_user'))
+    },
   },
-  beforeUnmount() {
-    this.timeId();
+  watch:{
+    "userInfo.type":{
+      handler(newVal, oldVal) {
+        if(this.userInfo){
+          if (this.userInfo.type == 2){
+            this.getbigGetLarge9({ country: 100000 });
+          }else{
+            this.getbigGetLarge10({ province:this.userInfo.province, city: this.userInfo.city });
+          }
+        }
+      },
+      deep: true,
+      immediate: true,
+    }
   },
   methods: {
-    echart_7() {
+    getbigGetLarge9(pam) {
+      bigGetLarge9().then(res => {
+        this.getLarge9 = res.data
+        this.getLarge10 = []
+        this.echart_7(pam);
+      })
+    },
+    getbigGetLarge10(pam) {
+      bigGetLarge10(pam).then(res => {
+        this.getLarge9 = []
+        this.getLarge10 = res.data
+        this.echart_7({ province:this.userInfo.province, city: this.userInfo.city });
+      })
+    },
+    echart_7(pam) {
       var that = this;
-      if (this.myChart) {
-        this.myChart.dispose();
+      if (that.myChart) {
+        that.myChart.dispose();
       }
-      this.myChart = new echarts.init(document.getElementById('chart_7'));
-      function showProvince() {
-        var map = {
-          map: 'guangdong',
-          zoom: 1.2,
-          // roam: true,
-          label: {
-            normal: {
-              show: true,
-              textStyle: {
-                color: '#beecff',
-                fontSize: csize(20),
-              },
-            },
-            emphasis: {
-              textStyle: {
-                color: '#beecff',
-                fontSize: csize(24),
+      bigGetRegion(pam).then(res => {
+        // 初始化 ECharts 实例
+        that.myChart = echarts.init(document.getElementById('chart_7'));
+        const geoJsonData = JSON.parse(res.data);
+        // 计算边界框
+        const boundingBox = calculateBoundingBox(geoJsonData);
+        // 计算中心点
+        const center = [
+          (boundingBox.minX + boundingBox.maxX) / 2,
+          (boundingBox.minY + boundingBox.maxY) / 2
+        ];
+        echarts.registerMap('china', geoJsonData);
+        // 指定城市和颜色
+        var cityColors = {};
+        this.getLarge9.map(name => {
+          cityColors[name] = "#009eff";
+        });
+        this.getLarge10.map(item => {
+          cityColors[item.area] = item.num<=2 ? "#6ada40" : item.num<=4 ? "#ebe24a" : item.num > 4 ? "#d73921" : "none"
+        });
+
+        console.log(this.getLarge9, this.getLarge10, cityColors)
+        // 构建 series 数据
+        var seriesData = Object.keys(cityColors).map(function (city) {
+          return {
+            name: city,
+            itemStyle: {
+              normal: {
+                areaColor: cityColors[city],
+                borderColor: 'none'
               },
+              emphasis: {
+                areaColor: cityColors[city],
+                borderColor: 'none'
+              }
             },
-          },
+          };
+        });
+        var mapcon = {
           itemStyle: {
             normal: {
               borderColor: 'rgba(0,144,255, 1)',
@@ -136,7 +178,7 @@ export default {
                   },
                   {
                     offset: 1,
-                    color: 'rgba(0,144,255, .2)', // 100% 处的颜色
+                    color: 'rgba(0,144,255, .1)', // 100% 处的颜色
                   },
                   {
                     offset: 1,
@@ -163,123 +205,80 @@ export default {
             },
             itemStyle: {
               // 选中区域的默认样式
-              // areaColor: 'transparent',
-              areaColor: '#0082ff',
+              areaColor: '#7024fb',
             },
           },
           animation: false,
         };
-        that.myChart.setOption({
-          backgroundColor: '', //设置无背景色
-          visualMap: {
-            show: false,
-            min: 0,
-            max: 100,
-            left: 'left',
-            top: 'bottom',
-            text: ['高', '低'], // 文本，默认为数值文本
-            calculable: true,
+        // 配置项
+        var option = {
+          tooltip: {
+            trigger: 'item',
+            formatter: '{b}'
           },
-          grid: {
-            top: '-20px', //生成的图片和顶部的间距
-            containLabel: true, //为ture才会生效以上的设置
+          geo: {
+            map: 'china',
+            roam: true,
+            zoom: pam.country ? 1.3 : pam.city ? 4.5 : pam.province ? 1.7 : 2, // 设置缩放比例
+            center: center,
+            ...mapcon,
+            regions: [
+              ...seriesData,
+              {
+                name: "南海诸岛",
+                itemStyle: {
+                  normal: {
+                    opacity: 0,
+                  }
+                },
+                label: {
+                  show: false
+                }
+              }
+            ]
           },
-          geo: map,
-          series: [
-            {
-              type: 'map',
-              ...map,
-              data: that.data,
-            },
-          ],
+          series: [{
+            type: 'map',
+            map: 'china',
+            ...mapcon,
+            geoIndex: 0,
+            data: seriesData
+          }]
+        };
+        // 使用配置项生成图表
+        that.myChart.setOption(option);
+        // 监听点击事件
+        that.myChart.on('click', function (params) {
+          
         });
+      });
 
-        var hourIndex = 0;
-        var fhourTime = null;
-        function gl(index) {
-          that.cIndex = index;
-          setTimeout(() => {
-            that.oldcIndex = index;
-          }, 1000);
-          that.myChart.dispatchAction({
-            type: 'downplay',
-            seriesIndex: 0,
-          });
-          that.myChart.dispatchAction({
-            type: 'highlight',
-            seriesIndex: 0,
-            dataIndex: index,
-          });
-          that.myChart.dispatchAction({
-            type: 'showTip',
-            seriesIndex: 0,
-            dataIndex: index,
-          });
-        }
-        function lbgl() {
-          gl(hourIndex);
-          hourIndex++;
-          if (hourIndex >= that.data.length) {
-            hourIndex = 0;
-          }
-          fhourTime = setTimeout(lbgl, 8000);
-        }
-        lbgl();
-        //鼠标移入停止轮播
-        that.myChart.on('mousemove', function (e) {
-          clearTimeout(fhourTime);
-          hourIndex = e.dataIndex;
-          gl(e.dataIndex);
-        });
-        //鼠标移出恢复轮播
-        that.myChart.on('mouseout', lbgl);
-      }
-      showProvince();
     },
   },
 };
 </script>
 
 <style scoped lang="scss">
-.shujuxianshi {
-  position: absolute;
-  top: 40px;
-  left: 55px;
-  width: 177px;
-  height: auto;
-  background: #092a66;
-  border: 2px solid #0462b5;
-  border-radius: 5px;
-  box-sizing: border-box;
-  padding: 16px 20px;
-  .shujuxianshiTitle {
-    font-size: 16px;
-    font-family: Source Han Sans CN, Source Han Sans CN-Regular;
-    font-weight: 400;
-    text-align: left;
-    color: #5fe3ff;
-    margin-bottom: 12px;
-  }
-  .shujuxianshidw {
-    margin-left: 5px;
-  }
-}
+
 .leixingxianshi {
-  width: 120px;
+  // width: 120px;
   height: auto;
   position: absolute;
   bottom: 0px;
   right: -10px;
 }
+
 .viewfilediv {
   width: 100%;
   height: auto;
   display: flex;
   flex-direction: row;
   align-items: center;
+
   &:not(:last-child) {
     margin-bottom: 10px;
   }
+
   span {
     font-size: 14px;
     font-family: Source Han Sans CN, Source Han Sans CN-Regular;
@@ -288,56 +287,47 @@ export default {
     color: #8ab1dc;
   }
 }
+
 .zfx {
   width: 14px;
   height: 14px;
   margin-right: 6px;
 }
+
 .c1 {
   background: linear-gradient(0deg, #21c8fb 0%, #21c8fb 100%);
 }
+
 .c2 {
   background: linear-gradient(0deg, #ffc737 0%, #ffc737 100%);
 }
+
 .c3 {
   background: linear-gradient(0deg, #ea539b 0%, #e34691 100%);
 }
+
 .c4 {
   background: linear-gradient(0deg, #59cfe6 0%, #59cfe6 100%);
 }
+
 .c5 {
   background: linear-gradient(0deg, #8061ff 0%, #8061ff 100%);
 }
+
 .c6 {
   color: #e15960 !important;
 }
+
 .c7 {
   color: #ffffff !important;
 }
+
 .c8 {
   color: #ff9900 !important;
 }
+
 .c9 {
   background: linear-gradient(0deg, #3ce783 0%, #3ce783 100%);
 }
-@keyframes xing {
-  0% {
-    transform: scale(1);
-  }
-  25% {
-    transform: scale(1.1);
-  }
-  50% {
-    transform: scale(0.95);
-  }
-  75% {
-    transform: scale(1.05);
-  }
-}
-.my_xing {
-  -webkit-animation-name: xing;
-  -webkit-animation-timing-function: ease-in-out;
-  -webkit-animation-iteration-count: infinite;
-  -webkit-animation-duration: 1s;
-}
-</style>
+
+</style>

src/views/bigViews/dataView1/components/orderAmountTrend.vue

@@ -1,43 +1,190 @@
 <template>
   <moduleEnclosure title="近30日订单金额趋势">
-    <div class="dvScrollBoardView">
-      
+    <div class="all-container">
+      <div id="orderEcharts2" style="width: 100%; height: 100%"></div>
     </div>
   </moduleEnclosure>
 </template>
 
 <script>
+import * as echarts from 'echarts';
 import moduleEnclosure from '@/components/moduleEnclosure.vue';
-import img0 from '@/assets/xia.png';
-import img1 from '@/assets/shang.png';
-import img2 from '@/assets/y1.png';
-import img3 from '@/assets/y2.png';
-import img4 from '@/assets/y3.png';
-import { getQuery13, getQuery14 } from '@/api/bigView.js';
-var timeling = 5000;
+import { getOrderTrend } from '@/api/bigView.js';
+
 export default {
   components: {
     moduleEnclosure,
   },
+
   data() {
     return {
-     
+      
     };
   },
-  mounted() {
-    
+
+  async mounted() {
+    getOrderTrend().then(res => {
+      this.initEcharts(res.data);
+    })
   },
+
   beforeUnmount() {
     
   },
+
   methods: {
-    
+    getDate() {
+      const today = new Date();
+      const dates = [];
+      
+      for (let i = 0; i < 30; i++) {
+        const d = new Date();
+        d.setDate(today.getDate() - i);
+        dates.unshift(d.toISOString().split('T')[0].slice(5, 11));
+      }
+      
+      return dates;
+    },
+
+    initEcharts(data) {
+      var chartDom = document.getElementById('orderEcharts2');
+      var myChart = echarts.init(chartDom);
+      var option;
+
+      option = {
+        title: {
+          text: ''
+        },
+        tooltip: {
+          trigger: 'axis',
+          transitionDuration: 0,
+          backgroundColor: '#092a66',
+          borderColor: '#0462b5',
+          borderRadius: 8,
+          borderWidth: 2,
+          padding: [5, 10],
+          axisPointer: {
+            type: 'line',
+            lineStyle: {
+              type: 'dashed',
+              color: '#8AB1DC',
+            },
+          },
+          textStyle: {
+            color: '#ffffff'
+          }
+        },
+        legend: {
+          icon: 'circle',
+          data: ['新增销售金额', '新增辅材金额', '新增配件金额', '新增增值金额'],
+          textStyle: {
+            color: '#ffffff'
+          },
+          right: 0,
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true
+        },
+        toolbox: {
+          // feature: {
+          //   saveAsImage: {}
+          // }
+        },
+        xAxis: {
+          type: 'category',
+          boundaryGap: false,
+          axisLine: {
+            lineStyle: {
+              color: '#ffffff', // x轴文字颜色
+            }
+          },
+          splitLine: {
+            show: true,
+            lineStyle: {
+              color: '#364D95', // x轴辅助线颜色
+            }
+          },
+          data: this.getDate()
+        },
+        yAxis: {
+          type: 'value',
+          name: "（元）",
+          nameTextStyle: {
+            color: "#aaa",
+            nameLocation: "start",
+            align: 'right'
+          },
+          axisLine: {
+            lineStyle: {
+              color: '#ffffff', // y轴文字颜色
+            }
+          },
+          splitLine: {
+            show: true,
+            lineStyle: {
+              color: '#364D95', // y轴辅助线颜色
+            }
+          }
+        },
+        series: [
+          {
+            name: '新增销售金额',
+            type: 'line',
+            stack: 'Total',
+            itemStyle: {
+              normal: {
+                color: '#FDFE02',
+              },
+            },
+            data: data.map(o => o.sxddje)
+          },
+          {
+            name: '新增辅材金额',
+            type: 'line',
+            stack: 'Total',
+            itemStyle: {
+              normal: {
+                color: '#44E28F',
+              },
+            },
+            data: data.map(o => o.fcddje)
+          },
+          {
+            name: '新增配件金额',
+            type: 'line',
+            stack: 'Total',
+            itemStyle: {
+              normal: {
+                color: '#41C5E2',
+              },
+            },
+            data: data.map(o => o.pjddje)
+          },
+          {
+            name: '新增增值金额',
+            type: 'line',
+            stack: 'Total',
+            itemStyle: {
+              normal: {
+                color: '#D73A79',
+              },
+            },
+            data: data.map(o => o.zzddje)
+          }
+        ]
+      };
+
+      option && myChart.setOption(option);
+    }
   },
 };
 </script>
 
 <style scoped lang="scss">
-.dvScrollBoardView {
+.all-container {
   width: 100%;
   height: 100%;
   box-sizing: border-box;

src/views/bigViews/dataView1/components/orderStatistics.vue

@@ -1,228 +1,98 @@
 <template>
   <moduleEnclosure title="近30日累计订单统计">
-    <div
-      style="
-        width: 100%;
-        height: 100%;
-        box-sizing: border-box;
-        padding-top: 12px;
-        position: relative;
-      "
-    >
-      <div
-        id="echarts5"
-        style="width: 100%; height: 100%"
-        class="echarts5div"
-      ></div>
+    <div class="all-container">
+      <div class="table-container">
+        <div class="th row">
+          <div>订单类型</div>
+          <div>累计订单数</div>
+          <div>累计订单金额</div>
+        </div>
+        <div class="td row">
+          <div>销售订单</div>
+          <div>{{statsData.sxdds}}</div>
+          <div>{{statsData.sxddje}}</div>
+        </div>
+        <div class="td row">
+          <div>辅材订单</div>
+          <div>{{statsData.fcdds}}</div>
+          <div>{{statsData.fcddje}}</div>
+        </div>
+        <div class="td row">
+          <div>配件订单</div>
+          <div>{{statsData.pjdds}}</div>
+          <div>{{statsData.pjddje}}</div>
+        </div>
+        <div class="td row">
+          <div>增值订单</div>
+          <div>{{statsData.zzdds}}</div>
+          <div>{{statsData.zzddje}}</div>
+        </div>
+      </div>
     </div>
-    <Teleport to="body">
-      <div class="niiono" v-if="aaaaa"></div>
-    </Teleport>
   </moduleEnclosure>
 </template>
 
 <script>
-import moduleEnclosure from '@/components/moduleEnclosure.vue';
-import * as echarts from 'echarts';
-import { getQuery8 } from '@/api/bigView.js';
-import { csize } from '@/utils/const.js';
-import bus from '@/utils/eventBus.js';
-export default {
-  components: { moduleEnclosure },
-  data() {
-    return {
-      myChart: null,
-      list: [],
-      aaaaa: false,
-    };
-  },
-  watch: {
-    aaaaa() {
-      if (this.aaaaa) {
-        bus.emit('autoplay', false);
-      } else {
-        bus.emit('autoplay', true);
-      }
+  import moduleEnclosure from '@/components/moduleEnclosure.vue';
+	import { getOrderStats } from '@/api/bigView.js';
+  export default {
+    components: { moduleEnclosure },
+
+    data() {
+      return {
+        statsData: {},
+      };
     },
-  },
-  mounted() {
-    this.timeId = getQuery8((res) => {
-      this.echarts_5(res.data);
-    }, 50000);
-  },
-  beforeUnmount() {
-    this.timeId();
-  },
-  methods: {
-    echarts_5(value = []) {
-      this.list = value.sort((a, b) => {
-        return b.cut - a.cut;
-      });
-      if (this.myChart) {
-        this.myChart.dispose();
-      }
-      this.myChart = new echarts.init(document.getElementById('echarts5'));
-      this.myChart.setOption({
-        tooltip: {
-          formatter: function (params) {
-            return `<div style="color:#fff;">${params.seriesName}: ${params.name} (${params.percent}%)</div>`;
-          },
-          trigger: 'item',
-          transitionDuration: 0,
-          backgroundColor: '#092a66',
-          borderColor: '#0462b5',
-          borderRadius: 8,
-          borderWidth: 2,
-          padding: [0, 0],
-          axisPointer: {
-            type: 'line',
-            lineStyle: {
-              type: 'dashed',
-              color: '#8AB1DC',
-            },
-          },
-        },
-        // visualMap: {
-        //   show: false,
-        //   min: 400,
-        //   max: 500,
-        //   inRange: {},
-        // },
-        series: [
-          {
-            name: '类型',
-            type: 'pie',
-            radius: ['50%', '70%'],
-            center: ['50%', '50%'],
-            color: ['#21c8fb', '#ffc737', '#ea539b', '#59cfe6', '#8061ff'],
-            data: this.list
-              .slice(0, 8)
-              .map((item) => {
-                return {
-                  name: item.btype,
-                  value: item.cut,
-                };
-              })
-              .filter((item) => item.value > 0),
-            roseType: 'radius',
-            label: {
-              normal: {
-                formatter: ['{b|{b}:{d}%}', '{c|{c}单}'].join('\n'),
-                rich: {
-                  b: {
-                    color: '#fff',
-                    fontSize: csize(11),
-                    lineHeight: csize(11),
-                  },
-                  c: {
-                    color: 'rgb(98,137,169)',
-                    fontSize: csize(11),
-                    lineHeight: csize(11),
-                    height: csize(11),
-                  },
-                },
-              },
-            },
-            labelLine: {
-              normal: {
-                lineStyle: {
-                  color: 'rgb(98,137,169)',
-                },
-                smooth: 0.2,
-                length: 10,
-                length2: 20,
-              },
-            },
-          },
-        ],
-      });
+
+    mounted() {
+      this.getData();
+    },
+
+    beforeUnmount() {
+      
+    },
+
+    methods: {
+      getData() {
+				getOrderStats().then(res => {
+					this.statsData = res.data;
+				})
+			},
     },
-  },
-};
+  };
 </script>
 <style scoped lang="scss">
-.niiono {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  z-index: 1999;
-}
-.biuhoij {
-  display: inline-block;
-  position: absolute !important;
-  top: -8px;
-  right: -18px;
-}
-.minwiuhdu {
-  width: 150px;
-  text-align: right;
-}
-.setwidth {
-  width: 200px;
-  text-align: center;
-}
-table {
+.all-container {
   width: 100%;
-  border-collapse: collapse;
+  height: 100%;
+  box-sizing: border-box;
+  padding-top: 12px;
+  position: relative;
 }
-
-table caption {
-  font-size: 2em;
-  font-weight: bold;
-  margin: 1em 0;
-}
-
-th,
-td {
-  border: 1px solid #ddd;
-  text-align: center;
-  padding: 6px 6px;
-}
-
-table thead tr {
-  background-color: #008c8c;
-  color: #fff;
-}
-
-table tbody tr:nth-child(odd) {
-  background-color: #eee;
-}
-
-table tbody tr:hover {
-  background-color: #ccc;
-}
-table tfoot tr td {
-  padding-right: 20px;
-}
-.echarts5div {
-  position: absolute;
-  left: 0;
-  bottom: -14px;
-}
-.classbtns {
-  width: 80px;
-  height: 28px;
+.table-container {
+  height: 100%;
   display: flex;
-  flex-direction: row;
-  align-items: center;
-  border: 2px solid #0e72e6;
-  cursor: pointer;
-  transform: translatex(-10px);
-  div {
-    width: 100%;
-    height: 100%;
-    text-align: center;
-    line-height: 28px;
-  }
-
-  div:nth-child(1) {
-    border-right: 2px solid #0e72e6;
-  }
-  .select {
-    background: #0e72e6;
-    color: #bbd4ff;
+  flex-direction: column;
+  justify-content: space-between;
+  .row {
+    display: flex;
+    &.th {
+      font-weight: bold;
+      color: #26A3CE;
+    }
+    &.td {
+      color: #ffffff;
+    }
+    div {
+      flex: 1;
+      font-size: 14px;
+      &:nth-child(2) {
+        text-align: center;
+      }
+      &:nth-child(3) {
+        text-align: right;
+      }
+    }
   }
 }
 </style>

src/views/bigViews/dataView1/components/orderTrend.vue

@@ -1,15 +1,16 @@
 <template>
   <moduleEnclosure title="近30日订单趋势">
-    <div id="main3" style="width: 100%; height: 100%"></div>
+    <div id="orderEcharts1" style="width: 100%; height: 100%"></div>
   </moduleEnclosure>
 </template>
 
 <script>
 import moduleEnclosure from '@/components/moduleEnclosure.vue';
 import * as echarts from 'echarts';
-import { getQuery10 } from '@/api/bigView.js';
+import { getOrderTrend } from '@/api/bigView.js';
 import { csize } from '@/utils/const.js';
 let myChart4;
+
 export default {
   components: {
     moduleEnclosure,
@@ -20,40 +21,50 @@ export default {
     };
   },
   mounted() {
-    this.timeId = getQuery10((res) => {
-      this.init_myChart2(res.data);
-    }, 40000);
+    getOrderTrend().then(res => {
+      this.initEcharts(res.data);
+    })
   },
+
   beforeUnmount() {
-    this.timeId();
+    
   },
+
   methods: {
-    init_myChart2(value) {
-      var times = value.map((item) => {
-        var str1 = item.ddate.split(' ')[0];
-        return str1.slice(5);
+    getDate() {
+      const today = new Date();
+      const dates = [];
+      
+      for (let i = 0; i < 30; i++) {
+        const d = new Date();
+        d.setDate(today.getDate() - i);
+        dates.unshift(d.toISOString().split('T')[0].slice(5, 11));
+      }
+      
+      return dates;
+    },
+
+    initEcharts(data) {
+      var times = this.getDate();
+      var data1 = data.map((item) => {
+        return item.sxdds || 0;
+      });
+      var data2 = data.map((item) => {
+        return item.fcdds || 0;
       });
-      var data1 = value.map((item) => {
-        return item.completeOrder || 0;
+      var data3 = data.map((item) => {
+        return item.pjdds || 0;
       });
-      var data2 = value.map((item) => {
-        return item.totalOrder || 0;
+      var data4 = data.map((item) => {
+        return item.zzdds || 0;
       });
       if (myChart4) {
         myChart4.dispose();
       }
-      myChart4 = new echarts.init(document.getElementById('main3'));
+      myChart4 = new echarts.init(document.getElementById('orderEcharts1'));
       myChart4.setOption({
         tooltip: {
           trigger: 'axis',
-          formatter: function (params) {
-            var res = '';
-            for (var i = 0, l = params.length; i < l; i++) {
-              res +=
-                '' + params[i].seriesName + ' : ' + params[i].value + '<br>';
-            }
-            return `<div style="color:#fff;">${res}</div>`;
-          },
           transitionDuration: 0,
           backgroundColor: '#092a66',
           borderColor: '#0462b5',
@@ -67,6 +78,9 @@ export default {
               color: '#8AB1DC',
             },
           },
+          textStyle: {
+            color: '#ffffff'
+          }
         },
         legend: {
           icon: 'circle',
@@ -75,18 +89,16 @@ export default {
           itemGap: 10,
           top: '16',
           right: '10',
-          data: ['维修新增', '维修完成'],
+          data: ['新增销售单', '新增辅材单', '新增配件单', '新增增值单'],
           textStyle: {
-            fontSize: csize(16),
-            color: '#8AB1DC',
+            color: '#ffffff',
           },
         },
         grid: {
-          x: csize(65),
-          y: csize(50),
-          x2: csize(30),
-          y2: csize(30),
-          containLabel: false,
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true
         },
         xAxis: [
           {
@@ -96,7 +108,6 @@ export default {
               interval: Math.floor(times.length / 10),
               showMinLabel: true, //是否显示最小 tick 的 label
               showMaxLabel: true, //是否显示最大 tick 的 label
-              fontSize: csize(12),
             },
             axisLine: {
               show: false,
@@ -113,9 +124,11 @@ export default {
         yAxis: [
           {
             type: 'value',
-            name: '单',
+            name: '（单/台）',
             nameTextStyle: {
-              fontSize: csize(16),
+              color: "#aaa",
+              nameLocation: "start",
+              // align: 'right'
             },
             axisLine: {
               show: false,
@@ -141,7 +154,7 @@ export default {
         ],
         series: [
           {
-            name: '维修新增',
+            name: '新增销售单',
             type: 'line',
             smooth: true,
             showSymbol: false,
@@ -160,11 +173,11 @@ export default {
                   [
                     {
                       offset: 0,
-                      color: 'rgba(137, 189, 27, 0.3)',
+                      color: 'rgba(253, 173, 96, 0.3)',
                     },
                     {
                       offset: 0.8,
-                      color: 'rgba(137, 189, 27, 0)',
+                      color: 'rgba(253, 173, 96, 0)',
                     },
                   ],
                   false
@@ -175,13 +188,13 @@ export default {
             },
             itemStyle: {
               normal: {
-                color: '#F34799',
+                color: '#FDAD60',
               },
             },
             data: data1,
           },
           {
-            name: '维修完成',
+            name: '新增辅材单',
             type: 'line',
             smooth: true,
             showSymbol: false,
@@ -200,11 +213,11 @@ export default {
                   [
                     {
                       offset: 0,
-                      color: 'rgba(0, 136, 212, 0.3)',
+                      color: 'rgba(68, 226, 143, 0.3)',
                     },
                     {
                       offset: 0.8,
-                      color: 'rgba(0, 136, 212, 0)',
+                      color: 'rgba(68, 226, 143, 0)',
                     },
                   ],
                   false
@@ -215,11 +228,91 @@ export default {
             },
             itemStyle: {
               normal: {
-                color: '#38A0D6',
+                color: '#44E28F',
               },
             },
             data: data2,
           },
+          {
+            name: '新增配件单',
+            type: 'line',
+            smooth: true,
+            showSymbol: false,
+            lineStyle: {
+              normal: {
+                width: 2,
+              },
+            },
+            areaStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(
+                  0,
+                  0,
+                  0,
+                  1,
+                  [
+                    {
+                      offset: 0,
+                      color: 'rgba(160, 61, 239, 0.3)',
+                    },
+                    {
+                      offset: 0.8,
+                      color: 'rgba(160, 61, 239, 0)',
+                    },
+                  ],
+                  false
+                ),
+                shadowColor: 'rgba(0, 0, 0, 0.1)',
+                shadowBlur: 10,
+              },
+            },
+            itemStyle: {
+              normal: {
+                color: '#A03DEF',
+              },
+            },
+            data: data3,
+          },
+          {
+            name: '新增增值单',
+            type: 'line',
+            smooth: true,
+            showSymbol: false,
+            lineStyle: {
+              normal: {
+                width: 2,
+              },
+            },
+            areaStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(
+                  0,
+                  0,
+                  0,
+                  1,
+                  [
+                    {
+                      offset: 0,
+                      color: 'rgba(65, 197, 226, 0.3)',
+                    },
+                    {
+                      offset: 0.8,
+                      color: 'rgba(65, 197, 226, 0)',
+                    },
+                  ],
+                  false
+                ),
+                shadowColor: 'rgba(0, 0, 0, 0.1)',
+                shadowBlur: 10,
+              },
+            },
+            itemStyle: {
+              normal: {
+                color: '#41C5E2',
+              },
+            },
+            data: data4,
+          },
         ],
       });
     },

src/views/bigViews/dataView1/components/trendChart.vue

@@ -2,91 +2,75 @@
   <moduleEnclosure title="趋势图">
     <template v-slot:rightce>
       <div class="classbtns">
-        <div
-          @click="cindex = 0"
-          :class="{
-            select: cindex === 0,
-          }"
-        >
-          浏览量
+        <div @click="cindex = 0" :class="{
+          select: cindex === 0,
+        }">
+          浏览量(PV)
         </div>
-        <div
-          @click="cindex = 1"
-          :class="{
-            select: cindex === 1,
-          }"
-        >
-          访客量
+        <div @click="cindex = 1" :class="{
+          select: cindex === 1,
+        }">
+          访客量(UV)
         </div>
       </div>
     </template>
-    <el-carousel
-      height="100%"
-      style="width: 100%; height: 100%"
-      ref="elCarousel"
-      :autoplay="false"
-    >
-      <el-carousel-item v-for="(item, index) in 2" :key="index">
-        <div style="width: 100%; height: 100%">
-          <div
-            :id="`chartmain_${item}`"
-            style="width: 100%; height: 100%"
-          ></div>
-        </div>
-      </el-carousel-item>
-    </el-carousel>
+    <div style="width: 100%; height: 100%">
+      <div :id="`chartmain_fkell`" style="width: 100%; height: 100%"></div>
+    </div>
   </moduleEnclosure>
 </template>
 
 <script>
+import { bigGetLarge3 } from '@/api/common.js';
 import moduleEnclosure from '@/components/moduleEnclosure.vue';
 import * as echarts from 'echarts';
-import { getQuery12 } from '@/api/bigView.js';
 import { csize } from '@/utils/const.js';
-let myChart, myChart2;
 export default {
   components: {
     moduleEnclosure,
   },
   data() {
     return {
-      cindex: -1,
-      myChart: null,
-      myChart2: null,
+      cindex: 0,
     };
   },
   mounted() {
-    this.timeId = getQuery12((res) => {
-      this.eac(res.data);
-      this.init_myChart2(res.data);
-    }, 70000);
-    this.cindex = 0;
+    this.getbigGetLarge3()
   },
   beforeUnmount() {
-    this.timeId();
+
   },
   watch: {
-    cindex(newVal, oldValue) {
-      if (oldValue !== -1) {
-        this.$refs.elCarousel.next();
-      }
-      if (this.timed) {
-        clearTimeout(this.timed);
-      }
-      this.timed = setTimeout(() => {
-        this.cindex = this.cindex ? 0 : 1;
-      }, 30000);
-    },
+    cindex(){
+      this.getbigGetLarge3()
+    }
   },
   methods: {
+    getbigGetLarge3() {
+      bigGetLarge3().then(res => {
+        this.eac(res.data)
+      })
+    },
     eac(value) {
+      var that = this
+      if (that.myChart) {
+        that.myChart.dispose();
+      }
       var times = value.map((item) => {
-        var str1 = item.ddate.split(' ')[0];
+        var str1 = item.dstr.split(' ')[0];
         return str1.slice(5);
       });
       var data = value.map((item) => {
-        return item.badapp;
+        return item[["num", "userNum"][this.cindex]];
       });
+      // 计算刻度的间隔
+      var interval = Math.ceil((Math.max(...data) - Math.min(...data)) / 2); // 确保有 3 个刻度
+      interval = interval < 1 ? 1 : interval
+      // 计算 y 轴的最大值和最小值
+      var maxY = Math.ceil(Math.max(...data) / interval) * interval;
+      maxY = maxY < 3 ? 3 : maxY
+      var minY = Math.floor(Math.min(...data) / interval) * interval;
+      minY = minY < 1 ? 1 : minY
       var option = {
         tooltip: {
           trigger: 'axis',
@@ -113,10 +97,10 @@ export default {
           subtext: '',
         },
         grid: {
-          x: csize(65),
+          x: csize(40),
           y: csize(40),
-          x2: csize(30),
-          y2: csize(30),
+          x2: csize(20),
+          y2: csize(20),
         },
         xAxis: {
           data: times,
@@ -138,11 +122,15 @@ export default {
               color: '#8AB1DC',
             },
           },
+          boundaryGap: false,
         },
         yAxis: [
           {
+            // min: minY,
+            // max: maxY,
+            // interval: interval,
             type: 'value',
-            name: '单位（单）',
+            name: '人（次）',
             nameTextStyle: {
               fontSize: csize(16),
             },
@@ -176,8 +164,10 @@ export default {
         series: [
           {
             // For shadow
-            type: 'bar',
+            type: 'line',
             barWidth: 10,
+            smooth: true,  // 设置平滑曲线
+            symbol: 'none',  // 隐藏节点
             itemStyle: {
               color: 'rgba(0,0,0,0.05)',
             },
@@ -187,8 +177,10 @@ export default {
             animation: false,
           },
           {
-            type: 'bar',
+            type: 'line',
             barWidth: 10,
+            smooth: true,  // 设置平滑曲线
+            symbol: 'none',  // 隐藏节点
             itemStyle: {
               color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                 { offset: 0, color: '#0efdff' },
@@ -197,6 +189,18 @@ export default {
               ]),
               barBorderRadius: 5,
             },
+            areaStyle: {  // 设置阴影样式
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{  // 线性渐变，从上到下
+                offset: 0,
+                color: 'rgba(45,77,149,1)'  // 阴影起始颜色
+              }, {  // 线性渐变，从上到下
+                offset: 0.5,
+                color: 'rgba(45,77,149,.5)'  // 阴影起始颜色
+              }, {
+                offset: 1,
+                color: 'rgba(45,77,149,.2)'  // 阴影结束颜色
+              }])
+            },
             emphasis: {
               itemStyle: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -211,248 +215,8 @@ export default {
           },
         ],
       };
-      if (myChart) {
-        myChart.dispose();
-      }
-      myChart = new echarts.init(document.getElementById('chartmain_1'));
-      myChart.setOption(option);
-    },
-    init_myChart2(value) {
-      var times = value.map((item) => {
-        var str1 = item.ddate.split(' ')[0];
-        return str1.slice(5);
-      });
-      var data = value.map((item) => {
-        return item.goodrate;
-      });
-      var data1 = value.map((item) => {
-        return item.insrate;
-      });
-      var data2 = value.map((item) => {
-        return item.reprate;
-      });
-      if (myChart2) {
-        myChart2.dispose();
-      }
-      myChart2 = new echarts.init(document.getElementById('chartmain_2'));
-      myChart2.setOption({
-        tooltip: {
-          trigger: 'axis',
-          formatter: function (params) {
-            var res = '';
-            for (var i = 0, l = params.length; i < l; i++) {
-              res +=
-                '' + params[i].seriesName + ' : ' + params[i].value + '<br>';
-            }
-            return `<div style="color:#fff;">${res}</div>`;
-          },
-          transitionDuration: 0,
-          backgroundColor: '#092a66',
-          borderColor: '#0462b5',
-          borderRadius: 8,
-          borderWidth: 2,
-          padding: [5, 10],
-          axisPointer: {
-            type: 'line',
-            lineStyle: {
-              type: 'dashed',
-              color: '#8AB1DC',
-            },
-          },
-        },
-        legend: {
-          icon: 'circle',
-          itemWidth: 8,
-          itemHeight: 8,
-          itemGap: 10,
-          top: '16',
-          right: '10',
-          data: ['好评率', '安装评价率', '维修评价率'],
-          textStyle: {
-            fontSize: csize(16),
-            color: '#8AB1DC',
-          },
-        },
-        grid: {
-          x: csize(65),
-          y: csize(50),
-          x2: csize(30),
-          y2: csize(30),
-        },
-        xAxis: [
-          {
-            type: 'category',
-            boundaryGap: false,
-            axisLabel: {
-              interval: Math.floor(times.length / 15),
-              showMinLabel: true, //是否显示最小 tick 的 label
-              showMaxLabel: true, //是否显示最大 tick 的 label
-              fontSize: csize(12),
-            },
-            axisLine: {
-              show: false,
-              lineStyle: {
-                color: '#8AB1DC',
-              },
-            },
-            axisTick: {
-              show: false,
-            },
-            data: times,
-          },
-        ],
-        yAxis: [
-          {
-            type: 'value',
-            name: '单位（%）',
-            nameTextStyle: {
-              fontSize: csize(16),
-            },
-            axisLine: {
-              show: false,
-              lineStyle: {
-                color: '#8AB1DC',
-              },
-            },
-            axisLabel: {
-              margin: 10,
-              textStyle: {
-                fontSize: csize(12),
-              },
-            },
-            splitLine: {
-              lineStyle: {
-                color: '#364D95',
-              },
-            },
-            axisTick: {
-              show: false,
-            },
-          },
-        ],
-        series: [
-          {
-            name: '好评率',
-            type: 'line',
-            smooth: true,
-            showSymbol: false,
-            lineStyle: {
-              normal: {
-                width: 2,
-              },
-            },
-            areaStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(
-                  0,
-                  0,
-                  0,
-                  1,
-                  [
-                    {
-                      offset: 0,
-                      color: 'rgba(137, 189, 27, 0.3)',
-                    },
-                    {
-                      offset: 0.8,
-                      color: 'rgba(137, 189, 27, 0)',
-                    },
-                  ],
-                  false
-                ),
-                shadowColor: 'rgba(0, 0, 0, 0.1)',
-                shadowBlur: 10,
-              },
-            },
-            itemStyle: {
-              normal: {
-                color: '#F34799',
-              },
-            },
-            data: data,
-          },
-          {
-            name: '安装评价率',
-            type: 'line',
-            smooth: true,
-            showSymbol: false,
-            lineStyle: {
-              normal: {
-                width: 2,
-              },
-            },
-            areaStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(
-                  0,
-                  0,
-                  0,
-                  1,
-                  [
-                    {
-                      offset: 0,
-                      color: 'rgba(137, 189, 27, 0.3)',
-                    },
-                    {
-                      offset: 0.8,
-                      color: 'rgba(137, 189, 27, 0)',
-                    },
-                  ],
-                  false
-                ),
-                shadowColor: 'rgba(0, 0, 0, 0.1)',
-                shadowBlur: 10,
-              },
-            },
-            itemStyle: {
-              normal: {
-                color: '#1cc840',
-              },
-            },
-            data: data1,
-          },
-          {
-            name: '维修评价率',
-            type: 'line',
-            smooth: true,
-            showSymbol: false,
-            lineStyle: {
-              normal: {
-                width: 2,
-              },
-            },
-            areaStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(
-                  0,
-                  0,
-                  0,
-                  1,
-                  [
-                    {
-                      offset: 0,
-                      color: 'rgba(0, 136, 212, 0.3)',
-                    },
-                    {
-                      offset: 0.8,
-                      color: 'rgba(0, 136, 212, 0)',
-                    },
-                  ],
-                  false
-                ),
-                shadowColor: 'rgba(0, 0, 0, 0.1)',
-                shadowBlur: 10,
-              },
-            },
-            itemStyle: {
-              normal: {
-                color: '#43bbfb',
-              },
-            },
-            data: data2,
-          },
-        ],
-      });
+      that.myChart = new echarts.init(document.getElementById('chartmain_fkell'));
+      that.myChart.setOption(option);
     },
   },
 };
@@ -460,27 +224,34 @@ export default {
 
 <style scoped lang="scss">
 .classbtns {
-  width: 160px;
-  height: 28px;
+  width: 200px;
+  height: 30px;
   display: flex;
   flex-direction: row;
+  justify-content: space-between;
   align-items: center;
-  border: 2px solid #0e72e6;
   cursor: pointer;
-  div {
-    width: 50%;
+
+  div:nth-child(1),
+  div:nth-child(2) {
+    width: 48%;
     height: 100%;
     text-align: center;
     line-height: 28px;
+    border: 1px solid #0e72e6;
+    position: relative;
   }
+
   div:nth-child(1) {
-    border-right: 2px solid #0e72e6;
+    border-right: 1px solid #0e72e6;
   }
+
   .select {
     background: #0e72e6;
     color: #bbd4ff;
   }
 }
+
 ::v-deep .el-carousel__arrow,
 ::v-deep .el-carousel__indicators {
   display: none;

src/views/bigViews/dataView1/components/workOrderStatistics.vue

@@ -1,232 +1,109 @@
 <template>
-  <moduleEnclosure title="近30天累计工单统计">
-    <div id="main4" style="width: 100%; height: 100%"></div>
-  </moduleEnclosure>
+	<moduleEnclosure title="近30天累计工单统计">
+		<div class="all-container">
+			<div class="table-container">
+        <div class="th row">
+          <div>订单类型</div>
+          <div>数量</div>
+          <div>占比</div>
+        </div>
+        <div class="td row">
+          <div>累计安装台数</div>
+          <div>{{statsData.azgd || 0}}</div>
+          <div>{{statsData.azgdzb || 0}}%</div>
+        </div>
+				<div class="td row">
+          <div>累计维修台数</div>
+          <div>{{statsData.wxgd || 0}}</div>
+          <div>{{statsData.wxgdzb || 0}}%</div>
+        </div>
+				<div class="td row">
+          <div>累计清洗台数</div>
+          <div>{{statsData.qxgd || 0}}</div>
+          <div>{{statsData.qxgdzb || 0}}%</div>
+        </div>
+				<div class="td row">
+          <div>增值服务工单</div>
+          <div>{{statsData.zzgd || 0}}</div>
+          <div>{{statsData.zzgdzb || 0}}%</div>
+        </div>
+				<div class="td row">
+          <div>维保工程工单</div>
+          <div>{{statsData.wbgd || 0}}</div>
+          <div>{{statsData.wbgdzb || 0}}%</div>
+        </div>
+			</div>
+		</div>
+	</moduleEnclosure>
 </template>
 
 <script>
-import moduleEnclosure from '@/components/moduleEnclosure.vue';
-import * as echarts from 'echarts';
-import { getQuery9 } from '@/api/bigView.js';
-import { csize } from '@/utils/const.js';
-let myChart1;
-export default {
-  components: {
-    moduleEnclosure,
-  },
-  data() {
-    return {
-      myChart: null,
-    };
-  },
-  mounted() {
-    this.timeId = getQuery9((res) => {
-      this.eac(res.data);
-    }, 60000);
-  },
-  beforeUnmount() {
-    this.timeId();
-  },
-  methods: {
-    eac(value) {
-      var names = [];
-      var fz = 2000;
-      var values1 = [...value].sort((a, b) => {
-        return b.cut - a.cut;
-      });
-      var values2 = [...value].sort((a, b) => {
-        return b.machine_num - a.machine_num;
-      });
-      for (var i = 0; i < 4; i++) {
-        var name1 = values1[i].sales_type;
-        var name2 = values2[i].sales_type;
-        if (!~names.indexOf(name1)) {
-          names.push(name1);
-        }
-        if (!~names.indexOf(name2)) {
-          names.push(name2);
-        }
-      }
-      var obj = {
-        sales_type: '其他',
-        cut: 0,
-        machine_num: 0,
-      };
-      var list = value.filter((item) => {
-        if (
-          ~names.indexOf(item.sales_type) ||
-          item.cut > fz ||
-          item.machine_num > fz
-        ) {
-          return true;
-        } else {
-          obj.cut += item.cut;
-          obj.machine_num += item.machine_num;
-          return false;
-        }
-      });
-      list.push(obj);
-      var dataAxis = list.map((item) => item.sales_type);
-      var data1 = list.map((item) => item.cut);
-      var data2 = list.map((item) => item.machine_num);
-      var option = {
-        tooltip: {
-          trigger: 'axis',
-          formatter: function (params) {
-            var res = '新增工单' + ' : ' + params[0].value + '<br/>';
-            res += '设备总量' + ' : ' + params[1].value + '<br/>';
-            return `<div style="color:#fff;"><div>${params[0].name}</div>${res}</div>`;
-          },
-          transitionDuration: 0,
-          backgroundColor: '#092a66',
-          borderColor: '#0462b5',
-          borderRadius: 8,
-          borderWidth: 2,
-          padding: [5, 10],
-          axisPointer: {
-            type: 'line',
-            lineStyle: {
-              type: 'dashed',
-              color: '#8AB1DC',
-            },
-          },
-        },
-        title: {
-          text: '',
-          subtext: '',
-        },
-        legend: {
-          icon: 'circle',
-          itemWidth: 8,
-          itemHeight: 8,
-          itemGap: 10,
-          top: '16',
-          right: '10',
-          data: ['新增工单', '设备总量'],
-          textStyle: {
-            fontSize: csize(16),
-            color: '#8AB1DC',
-          },
-        },
-        grid: {
-          x: csize(65),
-          y: csize(50),
-          x2: csize(30),
-          y2: csize(30),
-        },
-        xAxis: {
-          data: dataAxis,
-          axisLabel: {
-            /*inside: true,*/
-            interval: 0,
-            textStyle: {
-              fontSize: csize(16),
-            },
-          },
-          axisTick: {
-            show: false,
-          },
-          axisLine: {
-            show: false,
-            symbol: ['none', 'arrow'],
-            symbolOffset: 12,
-            lineStyle: {
-              fontSize: csize(12),
-              color: '#8AB1DC',
-            },
-          },
-        },
-        yAxis: [
-          {
-            type: 'value',
-            name: '单',
-            nameTextStyle: {
-              fontSize: csize(16),
-            },
-            axisLine: {
-              show: false,
-              lineStyle: {
-                color: '#8AB1DC',
-              },
-            },
-            axisLabel: {
-              margin: 10,
-              textStyle: {
-                fontSize: csize(12),
-              },
-            },
-            splitLine: {
-              lineStyle: {
-                color: '#364D95',
-              },
-            },
-            axisTick: {
-              show: false,
-            },
-          },
-        ],
-        dataZoom: [
-          {
-            type: 'inside',
-          },
-        ],
-        series: [
-          {
-            name: '新增工单',
-            type: 'bar',
-            barGap: 0.2,
-            barWidth: 8,
-            itemStyle: {
-              normal: {
-                show: true,
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                  {
-                    offset: 0,
-                    color: '#35d4cb',
-                  },
-                  {
-                    offset: 1,
-                    color: '#3cf8ed',
-                  },
-                ]),
-                barBorderRadius: 10,
-              },
-            },
-            data: data1,
-          },
-          {
-            name: '设备总量',
-            type: 'bar',
-            barGap: 0.2,
-            barWidth: 8,
-            itemStyle: {
-              normal: {
-                show: true,
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                  {
-                    offset: 0,
-                    color: '#3077bd',
-                  },
-                  {
-                    offset: 1,
-                    color: '#3d99fd',
-                  },
-                ]),
-                barBorderRadius: 10,
-              },
-            },
-            data: data2,
-          },
-        ],
-      };
-      if (myChart1) {
-        myChart1.dispose();
-      }
-      myChart1 = new echarts.init(document.getElementById('main4'));
-      myChart1.setOption(option);
-    },
-  },
-};
+	import moduleEnclosure from '@/components/moduleEnclosure.vue';
+	import { getWorkorderStats } from '@/api/bigView.js';
+
+	export default {
+		components: {
+			moduleEnclosure,
+		},
+		data() {
+			return {
+				statsData: {},
+			};
+		},
+
+		mounted() {
+			this.getData();
+		},
+
+		beforeUnmount() {
+			
+		},
+
+		methods: {
+			getData() {
+				getWorkorderStats().then(res => {
+					this.statsData = res.data;
+				})
+			},
+		},
+	};
 </script>
 
-<style></style>
+<style scoped lang="scss">
+.all-container {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  padding-top: 12px;
+  position: relative;
+}
+.table-container {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  .row {
+    display: flex;
+    &.th {
+      font-weight: bold;
+      color: #26A3CE;
+    }
+    &.td {
+      color: #ffffff;
+			div:last-child {
+				color: #e4f824;
+			}
+    }
+    div {
+      flex: 1;
+      font-size: 14px;
+      &:nth-child(2) {
+        text-align: center;
+      }
+      &:nth-child(3) {
+        text-align: right;
+      }
+    }
+  }
+}
+</style>

src/views/bigViews/dataView1/components/workOrderTrend.vue

@@ -1,59 +1,93 @@
 <template>
   <moduleEnclosure title="近30天工单趋势">
-    <div id="main2" style="width: 100%; height: 100%"></div>
+	  <template v-slot:rightce>
+      <v-scroll-view :x="true" :y="false" slidingBgClassName="slidingBgClassName"
+        slidingBlockClassName="slidingBlockClassName">
+        <div class="tabbar">
+          <div
+            class="tab"
+            :class="tabCurrent == item ? 'active' : ''"
+            v-for="(item, index) in tabList"
+            :key="index"
+            @click="changeTab(item)">
+            {{item}}
+          </div>
+        </div>
+      </v-scroll-view>
+	    
+	  </template>
+		<div class="all-container">
+      <div id="workorderEcharts1" style="width: 100%; height: 100%"></div>
+    </div>
   </moduleEnclosure>
 </template>
 
 <script>
+import vScrollView from 'v-scroll-view'
 import moduleEnclosure from '@/components/moduleEnclosure.vue';
 import * as echarts from 'echarts';
-import { getQuery11 } from '@/api/bigView.js';
-import { csize } from '@/utils/const.js';
-let myChart3;
+import { getWorkorderTrend } from '@/api/bigView.js';
+
 export default {
   components: {
     moduleEnclosure,
+    vScrollView
   },
   data() {
     return {
-      myChart2: null,
+      tabList: [],
+      tabCurrent: '',
+      tableData: [],
     };
   },
+
   mounted() {
-    this.timeId = getQuery11((res) => {
-      this.init_myChart2(res.data);
-    }, 30000);
+    this.initData();
   },
+
   beforeUnmount() {
-    this.timeId();
+    
   },
+
   methods: {
-    init_myChart2(value) {
-      var times = value.map((item) => {
-        var str1 = item.ddate.split(' ')[0];
-        return str1.slice(5);
-      });
-      var data1 = value.map((item) => {
-        return item.completeMachine;
-      });
-      var data2 = value.map((item) => {
-        return item.completeOrder;
-      });
-      if (myChart3) {
-        myChart3.dispose();
+    getDate() {
+      const today = new Date();
+      const dates = [];
+      
+      for (let i = 0; i < 30; i++) {
+        const d = new Date();
+        d.setDate(today.getDate() - i);
+        dates.unshift(d.toISOString().split('T')[0].slice(5, 11));
       }
-      myChart3 = new echarts.init(document.getElementById('main2'));
-      myChart3.setOption({
+      
+      return dates;
+    },
+
+    changeTab(item) {
+      this.tabCurrent = item;
+      this.initEcharts();
+    },
+
+    initData() {
+      getWorkorderTrend().then(res => {
+        this.tabList = res.data.map(o => o.lx);
+        this.tabCurrent = this.tabList[0];
+        this.tableData = res.data;
+        this.initEcharts();
+      })
+    },
+
+    initEcharts() {
+      var chartDom = document.getElementById('workorderEcharts1');
+      var myChart = echarts.init(chartDom);
+      var option;
+
+      option = {
+        title: {
+          text: ''
+        },
         tooltip: {
           trigger: 'axis',
-          formatter: function (params) {
-            var res = '';
-            for (var i = 0, l = params.length; i < l; i++) {
-              res +=
-                '' + params[i].seriesName + ' : ' + params[i].value + '<br>';
-            }
-            return `<div style="color:#fff;">${res}</div>`;
-          },
           transitionDuration: 0,
           backgroundColor: '#092a66',
           borderColor: '#0462b5',
@@ -67,164 +101,134 @@ export default {
               color: '#8AB1DC',
             },
           },
+          textStyle: {
+            color: '#ffffff'
+          }
         },
         legend: {
           icon: 'circle',
-          itemWidth: 8,
-          itemHeight: 8,
-          itemGap: 10,
-          top: '16',
-          right: '10',
-          data: ['新增', '完成'],
+          data: ['已完工', '未完工'],
           textStyle: {
-            fontSize: csize(16),
-            color: '#8AB1DC',
+            color: '#ffffff'
           },
+          right: 0,
         },
         grid: {
-          x: csize(65),
-          y: csize(50),
-          x2: csize(30),
-          y2: csize(30),
-          containLabel: false,
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true
         },
-        xAxis: [
-          {
-            type: 'category',
-            boundaryGap: false,
-            axisLabel: {
-              interval: Math.floor(times.length / 10),
-              showMinLabel: true, //是否显示最小 tick 的 label
-              showMaxLabel: true, //是否显示最大 tick 的 label
-              fontSize: csize(12),
-            },
-            axisLine: {
-              show: false,
-              lineStyle: {
-                color: '#8AB1DC',
-              },
-            },
-            axisTick: {
-              show: false,
-            },
-            data: times,
+        toolbox: {
+          // feature: {
+          //   saveAsImage: {}
+          // }
+        },
+        xAxis: {
+          type: 'category',
+          boundaryGap: false,
+          axisLine: {
+            lineStyle: {
+              color: '#ffffff', // x轴文字颜色
+            }
           },
-        ],
-        yAxis: [
-          {
-            type: 'value',
-            name: '单',
-            nameTextStyle: {
-              fontSize: csize(16),
-            },
-            axisLine: {
-              show: false,
-              lineStyle: {
-                color: '#8AB1DC',
-              },
-            },
-            axisLabel: {
-              margin: 10,
-              textStyle: {
-                fontSize: csize(12),
-              },
-            },
-            splitLine: {
-              lineStyle: {
-                color: '#364D95',
-              },
-            },
-            axisTick: {
-              show: false,
-            },
+          splitLine: {
+            show: true,
+            lineStyle: {
+              color: '#364D95', // x轴辅助线颜色
+            }
+          },
+          data: this.getDate()
+        },
+        yAxis: {
+          type: 'value',
+          name: "（单/台）",
+          nameTextStyle: {
+            color: "#aaa",
+            nameLocation: "start",
+            // align: 'right'
+          },
+          axisLine: {
+            lineStyle: {
+              color: '#ffffff', // y轴文字颜色
+            }
           },
-        ],
+          splitLine: {
+            show: true,
+            lineStyle: {
+              color: '#364D95', // y轴辅助线颜色
+            }
+          }
+        },
         series: [
           {
-            name: '新增',
+            name: '已完工',
             type: 'line',
-            smooth: true,
-            showSymbol: false,
-            lineStyle: {
-              normal: {
-                width: 2,
-              },
-            },
-            areaStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(
-                  0,
-                  0,
-                  0,
-                  1,
-                  [
-                    {
-                      offset: 0,
-                      color: 'rgba(137, 189, 27, 0.3)',
-                    },
-                    {
-                      offset: 0.8,
-                      color: 'rgba(137, 189, 27, 0)',
-                    },
-                  ],
-                  false
-                ),
-                shadowColor: 'rgba(0, 0, 0, 0.1)',
-                shadowBlur: 10,
-              },
-            },
+            stack: 'Total',
             itemStyle: {
               normal: {
-                color: '#1cc840',
+                color: '#44E28F',
               },
             },
-            data: data1,
+            data: this.tableData.find(o => o.lx == this.tabCurrent).unitNum
           },
           {
-            name: '完成',
+            name: '未完工',
             type: 'line',
-            smooth: true,
-            showSymbol: false,
-            lineStyle: {
-              normal: {
-                width: 2,
-              },
-            },
-            areaStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(
-                  0,
-                  0,
-                  0,
-                  1,
-                  [
-                    {
-                      offset: 0,
-                      color: 'rgba(0, 136, 212, 0.3)',
-                    },
-                    {
-                      offset: 0.8,
-                      color: 'rgba(0, 136, 212, 0)',
-                    },
-                  ],
-                  false
-                ),
-                shadowColor: 'rgba(0, 0, 0, 0.1)',
-                shadowBlur: 10,
-              },
-            },
+            stack: 'Total',
             itemStyle: {
               normal: {
-                color: '#43bbfb',
+                color: '#D73A79',
               },
             },
-            data: data2,
+            data: this.tableData.find(o => o.lx == this.tabCurrent).unitNumWwg
           },
-        ],
-      });
-    },
+        ]
+      };
+
+      option && myChart.setOption(option);
+    }
   },
 };
 </script>
 
-<style></style>
+<style scoped lang="scss">
+
+::v-deep .slidingBgClassName {
+  background: #082570 !important;
+}
+
+::v-deep .slidingBlockClassName {
+  background: #81bcff !important;
+}
+
+.all-container {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  padding-top: 16px;
+}
+.tabbar{
+  width: fit-content;
+  display: flex;
+  .tab{
+    flex-shrink: 0;
+    width: 50px;
+    color: #ffffff;
+    border: 1px solid #254280;
+    font-size: 12px;
+    font-weight: bold;
+    padding: 2px 0;
+    margin-right: 10px;
+    text-align: center;
+    cursor: pointer;
+    &:last-child {
+      margin-right: 0;
+    }
+  }
+  .active{
+    border: 1px solid #153781;
+    color: #1a8dc8;
+  }
+}
+</style>

src/views/bigViews/dataView1/index.vue

@@ -5,17 +5,17 @@
         <zj-page-container direction="row">
           <div style="width: 26%">
             <zj-page-container>
-              <div class="module-inner-margin h47">
+              <div class="module-inner-margin" style="height: 28%">
                 <!-- 辅配件统计 -->
                 <accessoryStatistics />
               </div>
-              <div class="module-inner-margin h53">
+              <div class="module-inner-margin" style="height: 38%">
                 <!-- 工单统计 -->
                 <workOrderStatistics />
               </div>
               <div
                 class="module-inner-margin"
-                style="min-height: 30.32%; height: 30.32%"
+                style="min-height: 30.32%; height: 44.32%"
               >
                 <!-- 工单趋势 -->
                 <workOrderTrend />
@@ -25,7 +25,7 @@
           <div style="width: 48%">
             <zj-page-container>
               <div class="module-inner-margin h70">
-                <mapdata v-if="showMap" />
+                <mapdata />
               </div>
               <div class="module-inner-margin h30">
                 <trendChart />
@@ -34,15 +34,15 @@
           </div>
           <div style="width: 26%">
             <zj-page-container>
-              <div class="module-inner-margin h47">
+              <div class="module-inner-margin" style="height: 28%">
                 <orderStatistics />
               </div>
-              <div class="module-inner-margin h53">
+              <div class="module-inner-margin" style="height: 38%">
                 <orderTrend />
               </div>
               <div
                 class="module-inner-margin"
-                style="min-height: 30.32%; height: 30.32%"
+                style="min-height: 30.32%; height: 44.32%"
               >
                 <orderAmountTrend />
               </div>

src/views/bigViews/index.vue

@@ -20,12 +20,18 @@
         <zj-page-fill>
           <dataView1/>
         </zj-page-fill>
+        <div @click="shuxinyemian" :style="`position: fixed;right: 20px;bottom: 60px;background-image: url(${shuaxin});background-size: 100%;width:30px;height: 30px;z-index: 9999;`">
+        </div>
+        <div :style="`position: fixed;right: 20px;bottom: 20px;background-image: url(${quanpin});background-size: 100%;width:30px;height: 30px;z-index: 9999;display: flex;justify-content: center;align-items: center;`">
+          <screenfull id="screenfull" :className="'hahahdkdjshakdhssk'"/>
+        </div>
       </zj-page-container>
     </div>
   </page-size-limit>
 </template>
 
 <script>
+import Screenfull from '@/components/Screenfull'
 import pageSizeLimit from '@/components/page-size-limit.vue';
 import headView from '@/components/head.vue';
 import { delayPerform } from 'js-perform-lock';
@@ -33,6 +39,8 @@ import { login } from '@/api/bigView.js';
 import Cookies from 'js-cookie';
 import { commonly } from '@/api/bigView.js';
 import loginbg from '@/assets/loginbg.png';
+import quanpin from '@/assets/全屏@2x.png';
+import shuaxin from '@/assets/刷新@2x.png';
 import { ElMessage, ElLoading } from 'element-ui';
 var d;
 import dataView1 from './dataView1/index.vue';
@@ -42,9 +50,12 @@ export default {
     headView,
     dataView1,
     pageSizeLimit,
+    Screenfull
   },
   data() {
     return {
+      quanpin,
+      shuaxin,
       dayIndex: (new Date().getDate() - 1) % 5,
       loginbg,
       dialogVisible: Cookies.get('token') ? false : true,
@@ -74,6 +85,9 @@ export default {
     window.removeEventListener('resize', d);
   },
   methods: {
+    shuxinyemian(){
+      location.reload();
+    },
     changeswiper(index) {
       this.swindex = index;
     },
@@ -126,6 +140,10 @@ export default {
 </script>
 
 <style lang="scss">
+.hahahdkdjshakdhssk{
+  fill: #fff !important;
+  color: #fff !important;
+}
 .el-carousel__arrow {
   top: 75% !important;
 }