fix：修改大屏总览传参，修改大屏下拉框样式

src/api/xj/screen/disease-screen.js

@@ -27,11 +27,11 @@ export function roadTrends(query) {
 //     params: query,
 //   });
 // }
-export function roadToday(query) {
+export function roadToday(params) {
   return request({
     url: "/bigscreen/v2/getInspectionInfo",
     method: "get",
-    params: query,
+    params,
   });
 }
 

src/views/big-screen/disease-components/traffic-log.vue

@@ -22,10 +22,10 @@
           <el-form-item class="form-item" label="路线名称" prop="routeId">
             <el-select
               v-model="trafficForm.routeId"
-              :popper-append-to-body="false"
               placeholder="请选择路线"
               filterable
               clearable
+              popper-class="screen-select"
               @change="chengeLine"
             >
               <el-option
@@ -39,7 +39,7 @@
           <el-form-item class="form-item" label="路段名称" prop="segmentId">
             <el-select
               v-model="trafficForm.segmentId"
-              :popper-append-to-body="false"
+              popper-class="screen-select"
               placeholder="请选择路段"
               filterable
               clearable
@@ -59,6 +59,7 @@
           >
             <el-select
               v-model="trafficForm.inspectDirection"
+              popper-class="screen-select"
               :popper-append-to-body="false"
               placeholder="请选择上下行"
               clearable
@@ -99,7 +100,7 @@
           <el-form-item class="form-item" label="病害类型" prop="defectType">
             <el-select
               v-model="trafficForm.defectType"
-              :popper-append-to-body="false"
+              popper-class="screen-select"
               placeholder="请选择病害类型"
               clearable
             >
@@ -114,7 +115,7 @@
           <el-form-item class="form-item" label="病害状态" prop="state">
             <el-select
               v-model="trafficForm.state"
-              :popper-append-to-body="false"
+              popper-class="screen-select"
               placeholder="请选择病害状态"
               clearable
             >

src/views/big-screen/disease-components/traffic-statistic.vue

@@ -10,9 +10,9 @@
   <div class="content">
     <div class="statistic-select">
       <el-select
-        :popper-append-to-body="false"
         v-model="itemSelect"
         placeholder="请选择"
+        popper-class="screen-select"
       >
         <el-option
           v-for="item in currentList"

src/views/big-screen/disease-components/traffic-trend.vue

@@ -2,7 +2,7 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2024-10-21 10:03:08
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-12-19 10:44:06
+ * @LastEditTime: 2024-12-20 10:53:53
  * @FilePath: \znxjxt-ui\src\views\big-screen\traffic-components\traffic-trend.vue
  * @Description: 病害巡检大屏-病害趋势
 -->
@@ -11,9 +11,9 @@
   <div class="content">
     <div class="traffic-select">
       <el-select
-        :popper-append-to-body="false"
         v-model="itemSelect"
         placeholder="请选择"
+        popper-class="screen-select"
       >
         <el-option
           v-for="item in trafficList"

src/views/big-screen/index.vue

@@ -2,7 +2,7 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2024-10-17 11:34:00
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-12-19 15:22:15
+ * @LastEditTime: 2024-12-20 11:54:55
  * @FilePath: \znxjxt-ui\src\views\big-screen\index.vue
  * @Description: 大屏首页
 -->
@@ -107,6 +107,7 @@
               :select="item.select"
               :is="item.component"
               :bottomTipClick="bottomTipClick"
+              :companyId="companyId"
             ></component>
           </template>
           <template slot="operation" v-if="item.selectIsShow">
@@ -136,6 +137,7 @@
               :select="item.select"
               :is="item.component"
               :bottomTipClick="bottomTipClick"
+              :companyId="companyId"
               @imagePoint="getimagePoint"
             ></component>
           </template>
@@ -171,15 +173,30 @@
           v-if="elementDiv === 'OverviewScreen' && !showMap"
         >
           <div class="work-order-left">
-            <el-button class="btn-time" size="mini" @click="changeOrder(1)"
+            <div
-              >本周</el-button
+              class="btn-time"
+              :class="workOrderType === 1 ? 'btn-time-click' : ''"
+              size="mini"
+              @click="changeOrder(1)"
             >
-            <el-button class="btn-time" size="mini" @click="changeOrder(2)"
+              本周
-              >本月</el-button
+            </div>
+            <div
+              class="btn-time"
+              :class="workOrderType === 2 ? 'btn-time-click' : ''"
+              size="mini"
+              @click="changeOrder(2)"
             >
-            <el-button class="btn-time" size="mini" @click="changeOrder(3)"
+              本月
-              >本年</el-button
+            </div>
+            <div
+              class="btn-time"
+              :class="workOrderType === 3 ? 'btn-time-click' : ''"
+              size="mini"
+              @click="changeOrder(3)"
             >
+              本年
+            </div>
           </div>
           <div class="work-order-right">
             <div
@@ -204,7 +221,7 @@
           </div>
         </div>
         <!-- 地图图例 -->
-        <div class="map-legend">
+        <div class="map-legend" v-if="elementDiv != 'RoadScreen'">
           <span>≥{{ mapLegendList.s5 }}</span>
           <span>≥{{ mapLegendList.s4 }}</span>
           <span>≥{{ mapLegendList.s3 }}</span>
@@ -311,7 +328,7 @@
                     </div>
                   </div> -->
                 </div>
-                <span slot="reference" @click="showMapByCompany">{{
+                <span slot="reference" @click="showMapByCompany(item)">{{
                   item.name
                 }}</span>
               </el-popover>
@@ -556,6 +573,8 @@ export default {
         { name: "未完成工单数", value: 562254 },
         { name: "已完成工单数", value: 562254 },
       ],
+      // 工单时间选择绑定
+      workOrderType: 1,
       // 图片背景下打点坐标数据
       mapCareList: [],
       // 图例循环数据
@@ -578,6 +597,8 @@ export default {
       showMap: false,
       // 图片背景下popover弹窗病害名称
       screenMapPopoverName: "",
+      // 图片背景下点击得公司id
+      companyId: null,
 
       // 图标类别切换标识
       bottomTipClick: "1",
@@ -633,6 +654,7 @@ export default {
       carPointList: [],
       // 小车地图点位features数组
       mapPointFeatures: [],
+      // websocket监听事件id
       indexListenerId: Symbol("index-listener"),
     };
   },
@@ -702,29 +724,6 @@ export default {
           this.noticeNum = total;
         }
       });
-      // this.messageList = [
-      //   {
-      //     title: "成功",
-      //     status: "SUCCESS",
-      //     time: "2024/45/62",
-      //     car: "辽jskdn",
-      //     content: "骄傲的是否哈德half绝对符合卡的法拉第",
-      //   },
-      //   {
-      //     title: "告警",
-      //     status: "WARNING",
-      //     time: "2024/45/62",
-      //     car: "辽jskdn",
-      //     content: "骄傲的是否哈德half绝对符合卡的法拉第",
-      //   },
-      //   {
-      //     title: "提醒",
-      //     status: "REMIND",
-      //     time: "2024/45/62",
-      //     car: "辽jskdn",
-      //     content: "骄傲的是否哈德half绝对符合卡的法拉第",
-      //   },
-      // ];
     },
 
     /**
@@ -778,6 +777,7 @@ export default {
       const [node] = this.$refs.screenCascader.getCheckedNodes();
       this.screenMapPopoverName = node?.label;
       this.getMapCare(value);
+      this.getLinePoint();
     },
 
     /**
@@ -785,15 +785,19 @@ export default {
      * @return {void}
      */
     changeOrder(val) {
+      if (this.workOrderType != val) {
+        this.workOrderType = val;
+        this.companyId;
         this.workOrderList = [
           { name: "生成工单数", value: 54 },
           { name: "未完成工单数", value: 5254 },
           { name: "已完成工单数", value: 554 },
         ];
+      }
     },
 
     /**
-     * @description: 获取图片背景下坐标数据
+     * @description: 获取图片背景下坐标数据以及图例数据
      * @return {void}
      */
     getMapCare(value) {
@@ -803,6 +807,13 @@ export default {
       };
       comppanyImg(data).then(({ code, data }) => {
         if (code === 200) {
+          this.mapLegendList = {
+            s1: "0",
+            s2: "20",
+            s3: "40",
+            s4: "60",
+            s5: "80",
+          };
           this.mapCareList = data;
         }
       });
@@ -812,7 +823,8 @@ export default {
      * @description: 点击图片背景下公司名称切换地图
      * @return {void}
      */
-    showMapByCompany() {
+    showMapByCompany(val) {
+      this.companyId = val.id;
       this.showMap = true;
       this.getLinePoint();
     },
@@ -824,6 +836,7 @@ export default {
     disabledMapCompany() {
       this.showMap = false;
       this.markLayerLines = null;
+      this.companyId = null;
     },
 
     /**
@@ -1021,7 +1034,19 @@ export default {
      * @return {void}
      */
     getLinePoint() {
-      if (!this.markLayerLines) {
+      if (this.markLayerLines) {
+        // 清除线段图层
+        this.$nextTick(() => {
+          let map = null;
+          if (this.$refs.roadMap) {
+            map = this.$refs.roadMap.instance.get("map");
+          } else {
+            map = this.$refs.overViewMap.instance.get("map");
+          }
+          map.removeLayer(this.markLayerLines);
+          this.markLayerLines = null;
+        });
+      }
       mapPciList().then(({ code, data }) => {
         // if (code === 200 && data) {
         //   this.lineString = data.filter((item) => item.coordinates !== null);
@@ -1042,7 +1067,6 @@ export default {
           this.drawLine();
         }
       });
-      }
     },
 
     /**
@@ -1358,7 +1382,17 @@ export default {
           this.showIconList = true;
           // 进行地图打点
           this.getCenterPiont();
-          this.getLinePoint();
+          // 清除线段图层
+          this.$nextTick(() => {
+            let map = null;
+            if (this.$refs.roadMap) {
+              map = this.$refs.roadMap.instance.get("map");
+            } else {
+              map = this.$refs.overViewMap.instance.get("map");
+            }
+            map.removeLayer(this.markLayerLines);
+            this.markLayerLines = null;
+          });
         } else if (item.component === "DiseaseScreen") {
           this.leftModuleList = [
             {
@@ -1696,14 +1730,18 @@ export default {
         align-items: flex-end;
 
         .btn-time {
+          cursor: pointer;
           width: 7rem;
           height: 2rem;
+          display: flex;
+          justify-content: center;
+          align-items: center;
           margin: 0;
           background: url("~@/assets/screen/index/btn-time.png") no-repeat;
           background-size: 100% 100%;
           border-color: transparent;
           color: #ffffff;
-          font-size: 0.8rem;
+          font-size: 0.7rem;
           font-family: "DouYu";
 
           &:hover {
@@ -1711,12 +1749,12 @@ export default {
               no-repeat;
             background-size: 100% 100%;
           }
-
-          &:focus {
-            background: url("~@/assets/screen/index/btn-time-click.png")
-              no-repeat;
-            background-size: 100% 100%;
         }
+
+        .btn-time-click {
+          cursor: pointer;
+          background: url("~@/assets/screen/index/btn-time-click.png") no-repeat;
+          background-size: 100% 100%;
         }
       }
 
@@ -1734,12 +1772,12 @@ export default {
           align-items: center;
 
           .value {
-            font-size: 0.8rem;
+            font-size: 0.7rem;
             font-family: "DouYu";
             color: #ffffff;
 
             span {
-              font-size: 1.5rem;
+              font-size: 1.4rem;
               font-family: "DouYu";
               background: linear-gradient(
                 to bottom,
@@ -1755,7 +1793,7 @@ export default {
           }
 
           .name {
-            font-size: 0.8rem;
+            font-size: 0.7rem;
             font-family: "DouYu";
             color: #ffffff;
           }
@@ -2149,8 +2187,23 @@ export default {
     color: #89c5e8;
     border-color: #6991cd;
   }
+}
 
-  .el-select-dropdown {
+// 修改级联样式
+::v-deep .el-cascader {
+  width: 10rem;
+
+  .el-input--medium .el-input__inner {
+    height: 1.5rem;
+    background-color: rgba(38, 38, 38, 0.7);
+    color: #89c5e8;
+    border-color: #6991cd;
+  }
+}
+</style>
+<style lang="scss">
+// 下拉样式
+.screen-select {
   background-color: #102649;
   border-color: #08204f;
 
@@ -2179,22 +2232,9 @@ export default {
       }
     }
   }
-  }
 }
 
-// 修改级联样式
+// 级联样式
-::v-deep .el-cascader {
-  width: 10rem;
-
-  .el-input--medium .el-input__inner {
-    height: 1.5rem;
-    background-color: rgba(38, 38, 38, 0.7);
-    color: #89c5e8;
-    border-color: #6991cd;
-  }
-}
-</style>
-<style lang="scss">
 .screen-index-cascader {
   background-color: #102649;
   border-color: #08204f;

src/views/big-screen/overview-components/disease-current.vue

@@ -2,7 +2,7 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2024-10-18 10:19:56
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-12-13 16:44:58
+ * @LastEditTime: 2024-12-20 10:50:40
  * @FilePath: \znxjxt-ui\src\views\big-screen\overview-components\disease-current.vue
  * @Description: 总览大屏-病害三维饼图
 -->
@@ -19,9 +19,10 @@
         >返回</el-button
       >
       <el-select
-        :popper-append-to-body="false"
         v-model="itemSelect"
         placeholder="请选择"
+        @change="getChartList"
+        popper-class="screen-select"
       >
         <el-option
           v-for="item in currentList"
@@ -89,10 +90,16 @@ export default {
     FssmScroll,
   },
   props: {
+    // 数据栏右上角
     select: {
       type: String,
       default: "",
     },
+    // 传过来得公司id
+    companyId: {
+      type: Number,
+      default: null,
+    },
   },
   data() {
     return {
@@ -142,10 +149,11 @@ export default {
       },
       immediate: true,
     },
-    itemSelect: {
+    companyId: {
       handler() {
         this.getChartList();
       },
+      immediate: true,
     },
   },
   mounted() {
@@ -167,6 +175,7 @@ export default {
         type: this.select,
         itemName: this.itemSelect,
         classType: this.clickType,
+        companyId: this.companyId,
       };
       roadCurrent(data).then(({ code, data }) => {
         if (code === 200) {

src/views/big-screen/overview-components/disease-trends.vue

@@ -2,9 +2,9 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2024-10-18 10:16:30
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-12-19 13:42:02
+ * @LastEditTime: 2024-12-20 10:36:54
  * @FilePath: \znxjxt-ui\src\views\big-screen\disease-components\disease-trends.vue
- * @Description: 总览大屏-病害趋势
+ * @Description: 总览大屏-主要病害趋势
 -->
 <template>
   <div class="content">
@@ -17,19 +17,36 @@ import * as echarts from "echarts";
 import { roadTrends } from "@/api/xj/screen/disease-screen";
 export default {
   name: "DiseaseTrends",
+  props: {
+    // 传过来得公司id
+    companyId: {
+      type: Number,
+      default: null,
+    },
+  },
   data() {
     return {
       // echart数据
       echartList: [],
+      // chart对象
+      chart: null,
     };
   },
+  watch: {
+    companyId: {
+      handler() {
+        this.geteEhartList();
+      },
+      immediate: true,
+    },
+  },
   mounted() {
     this.geteEhartList();
   },
   methods: {
     /* 获取折线图数据 */
     geteEhartList() {
-      roadTrends().then(({ data, code }) => {
+      roadTrends({ companyId: this.companyId }).then(({ data, code }) => {
         if (code === 200) {
           this.echartList = data;
           this.$nextTick(() => {
@@ -52,9 +69,12 @@ export default {
       const yData3 = this.echartList.map((item) => {
         return item.sanluowu;
       });
+      if (this.chart) {
+        this.chart.dispose();
+      }
       if (this.$refs.trendsChart) {
-        const chart = echarts.init(this.$refs.trendsChart);
+        this.chart = echarts.init(this.$refs.trendsChart);
-        chart.setOption({
+        this.chart.setOption({
           //你的代码
           title: {
             text: "",
@@ -278,7 +298,7 @@ export default {
           ],
         });
         window.addEventListener("resize", () => {
-          chart.resize();
+          this.chart.resize();
         });
       }
     },

src/views/big-screen/overview-components/inspection-vehicles.vue

@@ -2,7 +2,7 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2024-11-08 09:40:18
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-12-13 09:51:07
+ * @LastEditTime: 2024-12-20 11:15:31
  * @FilePath: \znxjxt-ui\src\views\big-screen\overview-components\inspection-vehicles.vue
  * @Description: 总览大屏-巡检车辆
 -->
@@ -168,6 +168,13 @@ export default {
     InspectionFollow,
     InspectionView,
   },
+  props: {
+    // 传过来得公司id
+    companyId: {
+      type: Number,
+      default: null,
+    },
+  },
   data() {
     return {
       // 车辆总数
@@ -199,6 +206,14 @@ export default {
       viewTitle: "",
     };
   },
+  watch: {
+    companyId: {
+      handler() {
+        this.getTableData();
+      },
+      immediate: true,
+    },
+  },
   mounted() {
     this.getTableData();
   },
@@ -209,24 +224,32 @@ export default {
      * @return {*}
      */
     getTableData() {
+      if (this.timer) {
+        clearInterval(this.timer);
+        this.timer = null;
+      }
       this.timer = setInterval(() => {
-        getCarList({ no: this.tableInput }).then(({ code, data }) => {
+        getCarList({ no: this.tableInput, companyId: this.companyId }).then(
+          ({ code, data }) => {
             if (code === 200) {
               this.carNum = data.total;
               this.tableTotal = data.total;
               this.onlineNum = data.online;
               this.inspectionTableData = data.rows;
             }
-        });
+          }
+        );
       }, 5000);
-      getCarList({ no: this.tableInput }).then(({ code, data }) => {
+      getCarList({ no: this.tableInput, companyId: this.companyId }).then(
+        ({ code, data }) => {
           if (code === 200) {
             this.carNum = data.total;
             this.tableTotal = data.total;
             this.onlineNum = data.online;
             this.inspectionTableData = data.rows;
           }
-      });
+        }
+      );
     },
 
     /**

src/views/big-screen/overview-components/patrol-order.vue

@@ -69,6 +69,12 @@ import * as echarts from "echarts";
 import { getMileage, getMileageDetail } from "@/api/xj/screen/disease-screen";
 export default {
   name: "PatrolOrder",
+  props: {
+    companyId: {
+      type: Number,
+      default: null,
+    },
+  },
   data() {
     return {
       // 时间选择
@@ -85,6 +91,14 @@ export default {
       echartData: [],
     };
   },
+  watch: {
+    companyId: {
+      handler() {
+        this.getData();
+      },
+      immediate: true,
+    },
+  },
   mounted() {
     this.getData();
   },
@@ -95,7 +109,7 @@ export default {
      * @return {*}
      */
     getData() {
-      getMileage().then(({ code, data }) => {
+      getMileage({ companyId: this.companyId }).then(({ code, data }) => {
         if (code === 200) {
           this.patrolObject = data;
         }

src/views/big-screen/overview-components/today-inspection.vue

@@ -2,7 +2,7 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2024-10-18 09:42:49
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-12-19 10:42:31
+ * @LastEditTime: 2024-12-20 11:22:56
  * @FilePath: \znxjxt-ui\src\views\big-screen\overview-components\today-inspection.vue
  * @Description: 总览大屏-今日巡查
 -->
@@ -90,6 +90,13 @@ import * as echarts from "echarts";
 import { roadToday, roadTodayDetail } from "@/api/xj/screen/disease-screen";
 export default {
   name: "TodayInspection",
+  props: {
+    // 传过来得公司id
+    companyId: {
+      type: Number,
+      default: null,
+    },
+  },
   data() {
     return {
       // 新增病害总数
@@ -122,13 +129,21 @@ export default {
       rightChartData: [],
     };
   },
+  watch: {
+    companyId: {
+      handler() {
+        this.getData();
+      },
+      immediate: true,
+    },
+  },
   mounted() {
     this.getData();
   },
   methods: {
     /* 获取数据 */
     getData() {
-      roadToday().then(({ data, code }) => {
+      roadToday({ companyId: this.companyId }).then(({ data, code }) => {
         if (code === 200) {
           this.today = data.today;
           this.all = data.all;
@@ -723,7 +738,8 @@ export default {
           color: red;
         }
 
-        .el-icon-bottom,.el-icon-minus {
+        .el-icon-bottom,
+        .el-icon-minus {
           font-size: 1.5rem;
           color: #19eb27;
         }

src/views/big-screen/road-components/ancillary-facilities.vue

@@ -2,7 +2,7 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2024-10-18 15:18:03
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-11-19 10:41:33
+ * @LastEditTime: 2024-12-20 14:01:09
  * @FilePath: \znxjxt-ui\src\views\big-screen\road-components\ancillary-facilities.vue
  * @Description: 道路资产大屏-附属设施分布
 -->
@@ -83,8 +83,6 @@ export default {
     getAncillaryList() {
       ancillaryList().then(({ code, data }) => {
         if (code === 200) {
-          console.log(data, "ddddd");
-
           this.ancillaryList = data;
         }
       });

src/views/big-screen/road-components/anomaly-facilities.vue

@@ -10,8 +10,17 @@
 <template>
   <div class="content">
     <div class="anomaly-select">
-      <el-select :popper-append-to-body="false" v-model="itemSelect" placeholder="请选择">
+      <el-select
-        <el-option v-for="item in currentList" :key="item.value" :label="item.label" :value="item.value" />
+        v-model="itemSelect"
+        placeholder="请选择"
+        popper-class="screen-select"
+      >
+        <el-option
+          v-for="item in currentList"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"
+        />
       </el-select>
     </div>
     <div ref="anomalyChart" class="anomaly-echart"></div>
@@ -251,7 +260,8 @@ export default {
             // 是否显示detail，即拖拽时候显示详细数值信息
             showDetail: false,
             // 数据窗口范围的起始数值
-            startValue: this.anomalyData.length > 8 ? this.anomalyData.length - 8 : 0,
+            startValue:
+              this.anomalyData.length > 8 ? this.anomalyData.length - 8 : 0,
             // 数据窗口范围的结束数值（一页显示多少条数据）
             endValue: this.anomalyData.length,
             // empty：当前数据窗口外的数据，被设置为空。
@@ -302,7 +312,6 @@ export default {
     z-index: 1;
     right: 0;
     top: 0.2rem;
-
   }
 
   .anomaly-echart {