更改

ruoyi-ui/src/views/JiHeExpressway/components/Descriptions.vue

@@ -1,20 +1,37 @@
 <template>
-  <div class='Descriptions keep-ratio' origin="left" :style="getStyle()">
-    <div class="item" v-for="(item, index) in getResolveList" :key="`${item.key || item.label}${index}`"
-      :style="[gridStyle(item, index), transformStyle(itemStyle)]">
-      <div class="text title" :style="{
+  <div class="Descriptions keep-ratio" origin="left" :style="getStyle()">
+    <div
+      class="item"
+      v-for="(item, index) in getResolveList"
+      :key="`${item.key || item.label}${index}`"
+      :style="[gridStyle(item, index), transformStyle(itemStyle)]"
+    >
+      <div
+        class="text title"
+        :style="{
           ...transformStyle(titleStyle),
-        width: labelWidth
-      }">
+          width: labelWidth,
+        }"
+      >
         <p>
           <slot :name="`title-${item.key || item.label}`" :data="item">
-            {{ item.label || '-' }}
+            {{ item.label || "-" }}
           </slot>
-        </p>:
+        </p>
+        :
       </div>
-      <ContentText :style="transformStyle(titleStyle)" class="content text" :data="data" :_config="item">
+      <ContentText
+        :style="transformStyle(titleStyle)"
+        class="content text"
+        :data="data"
+        :_config="item"
+      >
         <template #default="{ value }">
-          <slot :name="`content-${item.key || item.label}`" :value="value" :data="item">
+          <slot
+            :name="`content-${item.key || item.label}`"
+            :value="value"
+            :data="item"
+          >
             {{ value }}
           </slot>
         </template>
@@ -24,18 +41,18 @@
 </template>
 
 <script>
-import { getContent } from "@screen/components/FormConfig/utils/index.js"
-import ContentText from "@screen/components/FormConfig/components/Text.vue"
+import { getContent } from "@screen/components/FormConfig/utils/index.js";
+import ContentText from "@screen/components/FormConfig/components/Text.vue";
 
 export default {
-  name: 'Descriptions',
+  name: "Descriptions",
   components: {
-    ContentText
+    ContentText,
   },
   props: {
     data: {
       type: Object,
-      default: () => ({})
+      default: () => ({}),
     },
     /**
      * {
@@ -47,74 +64,73 @@ export default {
      */
     list: {
       type: Array,
-      default: () => []
+      default: () => [],
     },
     column: {
       type: String,
-      default: "2"
+      default: "2",
     },
     labelWidth: String,
     titleStyle: {
       type: [String, Object],
-      default: null
+      default: null,
     },
     contentStyle: {
       type: [String, Object],
-      default: null
+      default: null,
     },
     itemStyle: {
       type: [String, Object],
-      default: null
-    }
+      default: null,
+    },
   },
   computed: {
     gridStyle() {
       return (item, index) => ({
         gridRow: `span ${item.gridRow || 1}`,
         gridColumn: `span ${item.gridColumn || 1}`,
-      })
+      });
     },
     getText() {
-      return (item) => getContent(this.data, item)
+      return (item) => getContent(this.data, item);
     },
     getResolveList() {
       return this.list.reduce((prev, data) => {
-
-        if (typeof data.visible === 'function') {
+        if (typeof data.visible === "function") {
           if (!data.visible(data)) return prev;
         }
 
         prev.push(data);
 
-        return prev
-      }, [])
-    }
+        return prev;
+      }, []);
+    },
   },
   methods: {
     getStyle() {
       return {
         gridTemplateColumns: `repeat(${this.column}, 1fr)`,
-      }
+      };
     },
     getComponent(type) {
-      return `Form${type.replace(/^[a-z]/, word => word.toUpperCase())}`
+      return `Form${type.replace(/^[a-z]/, (word) => word.toUpperCase())}`;
     },
     transformStyle(style) {
-      if (typeof style != 'string') return style;
+      if (typeof style != "string") return style;
 
-      return style.split(';').reduce((prev, cur) => {
+      return style.split(";").reduce((prev, cur) => {
         const [key, value] = cur.split(":");
 
         prev[key] = value;
 
         return prev;
       }, {});
-    }
-  }
-}
+    },
+  },
+};
 </script>
 
-<style lang='scss' scoped>
+<style lang="scss" scoped>
 .Descriptions {
   display: grid;
   gap: 9px;
@@ -123,7 +139,7 @@ export default {
     font-size: 15px;
     font-family: PingFang SC, PingFang SC;
     font-weight: 400;
-    color: #FFF;
+    color: #fff;
     line-height: 18px;
     gap: 3px;
     display: flex;
@@ -135,7 +151,7 @@ export default {
     gap: 6px;
 
     .title {
-      color: #3DE8FF;
+      color: #3de8ff;
 
       p {
         width: 100%;

ruoyi-ui/src/views/JiHeExpressway/components/Dialog/index.vue

@@ -1,22 +1,38 @@
 <template>
   <Teleport>
     <Transition name="fade">
-      <div :class="['mask-layer', { 'none-mask': noneMask }]" v-if="modelVisible">
-        <BackgroundClip class='dialog'
+      <div
+        :class="['mask-layer', { 'none-mask': noneMask }]"
+        v-if="modelVisible"
+      >
+        <BackgroundClip
+          class="dialog"
           clipPath="polygon(calc(100% - var(--clip-width)) 0, 100% var(--clip-width), 100% 100%, var(--clip-width) 100%, 0 calc(100% - var(--clip-width)), 0 0)"
           borderColor="linear-gradient(180deg, rgba(78, 174, 204, .9), rgba(78, 174, 204, 0))"
-          bgColor="linear-gradient(180deg, rgba(14, 69, 92, 0.9) 0%, rgba(20, 89, 119, 0.9) 100%)" ref="DialogContentRef">
+          bgColor="linear-gradient(180deg, rgba(14, 69, 92, 0.9) 0%, rgba(20, 89, 119, 0.9) 100%)"
+          ref="DialogContentRef"
+        >
           <div class="dialog-title">
-            <img class="title-icon" src="@screen/images/dialog/title-icon.svg" />
+            <img
+              class="title-icon"
+              src="@screen/images/dialog/title-icon.svg"
+            />
             <span>{{ title }}</span>
-            <img class="icon-close" @click.stop="modelVisible = false" src="@screen/images/dialog/icon-close.svg" />
+            <img
+              class="icon-close"
+              @click.stop="modelVisible = false"
+              src="@screen/images/dialog/icon-close.svg"
+            />
           </div>
 
           <div class="dialog-content">
             <slot />
           </div>
 
-          <img class="bottom-right" src="@screen/images/dialog/right-bottom.svg">
+          <img
+            class="bottom-right"
+            src="@screen/images/dialog/right-bottom.svg"
+          />
 
           <div class="footer" v-if="$slots.footer">
             <slot name="footer"></slot>
@@ -28,71 +44,74 @@
 </template>
 
 <script>
-import Teleport from '../Teleport.vue';
+import Teleport from "../Teleport.vue";
 import BackgroundClip from "@screen/components/Decorations/BackgroundClip.vue";
-import { moveable, stopPropagation } from "./utils"
+import { moveable, stopPropagation } from "./utils";
 
 export default {
   components: {
     Teleport,
-    BackgroundClip
+    BackgroundClip,
   },
   model: {
-    prop: 'visible',
-    event: "update:value"
+    prop: "visible",
+    event: "update:value",
   },
-  name: 'Dialog',
+  name: "Dialog",
   props: {
     title: {
-      type: String
+      type: String,
     },
     visible: Boolean,
     noneMask: {
       type: Boolean,
-      default: false
-    }
+      default: false,
+    },
   },
   watch: {
     visible: {
       deep: true,
       handler(bool) {
         this.$nextTick(() => {
-          if (!bool) return this.destroyMoveable?.()
+          if (!bool) return this.destroyMoveable?.();
 
           const container = this.$refs.DialogContentRef.$el;
 
-          this.destroyMoveable = moveable(container, { target: container.querySelector(".dialog-title") });
+          this.destroyMoveable = moveable(container, {
+            target: container.querySelector(".dialog-title"),
+          });
 
-          stopPropagation(container.querySelector(".dialog-title").lastChild)
+          stopPropagation(container.querySelector(".dialog-title").lastChild);
 
           this.$once("hook:beforeDestroy", () => this.destroyMoveable?.());
-        })
-      }
-    }
+        });
+      },
+    },
   },
   computed: {
     modelVisible: {
       get() {
-        return this.visible
+        return this.visible;
       },
       set(val) {
-        this.$emit('update:value', val)
-      }
-    }
+        console.log("val", val);
+        this.$emit("update:value", val);
+      },
+    },
   },
   beforeDestroy() {
     this.modelVisible = false;
   },
-}
+};
 </script>
 
-<style lang='scss' scoped>
+<style lang="scss" scoped>
 .mask-layer {
   position: fixed;
   top: 0;
   width: 100%;
   height: 100%;
-  background: rgba(0, 0, 0, .36);
+  background: rgba(0, 0, 0, 0.36);
   border-radius: 0px 0px 0px 0px;
   z-index: 100;
   display: flex;
@@ -111,7 +130,7 @@ export default {
 
 .fade-enter-active,
 .fade-leave-active {
-  transition: opacity .24s;
+  transition: opacity 0.24s;
 }
 
 .fade-enter,

ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/FatigueWakesUp/index.vue

@@ -2,42 +2,56 @@
   <Dialog v-model="obverseVisible" title="疲劳唤醒弹窗">
     <div class="FatigueWakesUp">
       <Video class="video-stream" :pileNum="dialogData.stakeMark" />
-
-      <Descriptions labelWidth="72px" :list="list" :data="data" style="gap: 18px" />
+      <ElTabs v-model="activeName" @tab-click="handleClickTabs" class="tabs">
+        <ElTabPane label="基本信息" name="first">
+          <Descriptions
+            labelWidth="72px"
+            :list="list"
+            :data="data"
+            style="gap: 18px"
+          />
+        </ElTabPane>
+        <ElTabPane label="设备参数" name="second">设备参数</ElTabPane>
+        <ElTabPane label="在线率统计" name="third">在线率统计</ElTabPane>
+      </ElTabs>
     </div>
 
     <template #footer>
       <Button @click.native="deviceControlVisible = true">设备操作</Button>
     </template>
 
-    <DeviceControlDialog v-model="deviceControlVisible" :deviceId="dialogData.iotDeviceId" />
+    <DeviceControlDialog
+      v-model="deviceControlVisible"
+      :deviceId="dialogData.iotDeviceId"
+    />
   </Dialog>
 </template>
 
 <script>
 import Dialog from "@screen/components/Dialog/index.vue";
-import Descriptions from '@screen/components/Descriptions.vue';
-import Button from "@screen/components/Buttons/Button.vue"
+import Descriptions from "@screen/components/Descriptions.vue";
+import Button from "@screen/components/Buttons/Button.vue";
 // import { getRoadInfoByStakeMark, getProduct } from "@screen/pages/Home/components/RoadAndEvents/utils/httpList.js"
-import Video from "@screen/components/Video"
-import DeviceControlDialog from "./components/DeviceControlDialog.vue"
+import Video from "@screen/components/Video";
+import DeviceControlDialog from "./components/DeviceControlDialog.vue";
 
 import request from "@/utils/request";
-import { dialogDelayVisible } from "./../mixin"
+import { dialogDelayVisible } from "./../mixin";
 
 // 疲劳唤醒弹窗
 export default {
-  name: 'FatigueWakesUp',
+  name: "FatigueWakesUp",
   mixins: [dialogDelayVisible],
   components: {
     Dialog,
     Descriptions,
     Video,
     DeviceControlDialog,
-    Button
+    Button,
   },
   data() {
     return {
+      activeName: "first",
       deviceControlVisible: false,
       data: {
         deviceType: "行车诱导",
@@ -49,52 +63,52 @@ export default {
       },
       list: [
         {
-          label: '设备名称',
+          label: "设备名称",
           key: "deviceName",
         },
         {
-          label: '设备桩号',
+          label: "设备桩号",
           key: "stakeMark",
         },
         {
-          label: '道路名称',
+          label: "道路名称",
           key: "roadName",
         },
         {
-          label: '设备方向',
+          label: "设备方向",
           key: "direction",
-          enum: "CameraDirectionEnum"
+          enum: "CameraDirectionEnum",
         },
         {
-          label: '设备状态',
+          label: "设备状态",
           key: "deviceState",
-          enum: "DeviceTypeEnum"
+          enum: "DeviceTypeEnum",
         },
         {
-          label: '设备厂商',
+          label: "设备厂商",
           key: "brand",
         },
-      ]
-    }
+      ],
+    };
   },
   async created() {
     this.data = { ...this.dialogData };
 
-    getProduct(this.dialogData.productId)
-      .then(data => {
+    getProduct(this.dialogData.productId).then((data) => {
       this.dialogData.brand = data.brand;
-      })
+    });
 
     const roadInfo = await getRoadInfoByStakeMark(this.dialogData.stakeMark);
 
     if (roadInfo) this.data.roadName = roadInfo.roadName;
   },
   methods: {
-  }
-}
+    handleClickTabs() {},
+  },
+};
 </script>
 
-<style lang='scss' scoped>
+<style lang="scss" scoped>
 .FatigueWakesUp {
   width: 420px;
   color: #fff;

ruoyi-ui/src/views/JiHeExpressway/pages/control/event/governanceAnalysis/components/auditAnalytics/StatsDialogVisible/index.vue

@@ -1,5 +1,6 @@
 <template>
   <Dialog v-model="modelVisible" title="收费站管制统计" style="width: 100%">
+    {{ modelVisible }}
     <div class="search">
       <InputSearch
         :formList="searchFormList"
@@ -379,9 +380,7 @@ export default {
           });
           this.searchFormList[2].options.options = dataList;
           this.facilityIds = res[0].value.data.map((item) => item.id);
-          this.searchFormList[2].default = res[0].value.data.map(
-            (item) => item.id
-          );
+          this.searchFormList[2].default = dataList.map((item) => item.key);
           console.log(56, this.searchFormList[2].default);
           let currentMonth = moment().format("YYYY-MM");
           let currentDate = moment().format("YYYY-MM-DD");

ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/data.js

@@ -29,6 +29,7 @@ export const searchFormList = [
     key: "time",
     required: true,
     type: "datePicker",
+    default: "",
     options: {
       format: "yyyy-MM-dd",
       type: "daterange",
@@ -39,6 +40,7 @@ export const searchFormList = [
     key: "type",
     required: true,
     type: "select",
+    default: "",
     options: {
       options: [
         {

ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/index.vue

@@ -200,9 +200,6 @@ export default {
   },
   methods: {
     initData() {
-      this.startTime = moment().startOf("month").format("YYYY-MM-DD HH:mm:ss");
-      this.time = moment().format("YYYY-MM-DD HH:mm:ss");
-      this.typeQuery = searchFormList[1].options.options[0].value;
       console.log(8888, this.startTime, this.time, this.typeQuery);
       clearInterval(this.interval);
       if (this.activeName == "first") {
@@ -247,8 +244,8 @@ export default {
     handleSearch(data) {
       console.log(777, data);
       this.typeQuery = data.type;
-      this.startTime = this.formatDate(data.time[0]);
-      this.time = this.formatDate(data.time[1]);
+      this.startTime = moment(data.time[0]).format("YYYY-MM-DD HH:mm:ss");
+      this.time = moment(data.time[1]).format("YYYY-MM-DD HH:mm:ss");
       let typeText =
         this.searchFormList[1].options.options[this.typeQuery - 1].label;
       this.searchText = `${moment(this.startTime).format(
@@ -259,7 +256,6 @@ export default {
     },
     changeTabs() {
       this.initData();
-      console.log("======================", this.queryChart);
       this.$nextTick(() => {
         this.queryChart.resize();
       });
@@ -415,7 +411,15 @@ export default {
     },
   },
   mounted() {
+    this.$nextTick(() => {
+      this.startTime = moment().startOf("month").format("YYYY-MM-DD HH:mm:ss");
+      this.time = moment().format("YYYY-MM-DD HH:mm:ss");
+      this.typeQuery = searchFormList[1].options.options[0].value;
+      searchFormList[0].default = [this.startTime, this.time];
+      searchFormList[1].default = this.typeQuery;
+      console.log("__________________", searchFormList[0].default);
       this.initData();
+    });
   },
 };
 </script>

ruoyi-ui/src/views/JiHeExpressway/pages/perception/meteorologyCheck/components/weatherInfoQuery/components/TemperatureTrend/assets/charts.js

@@ -6,10 +6,10 @@ var options = {
   },
   color: "#FFD15C",
   grid: {
-    left: "2%",
-    right: "5%",
-    bottom: "10%",
-    top: "10%",
+    left: "0",
+    right: "0",
+    bottom: "0",
+    top: "30px",
     containLabel: true,
   },
   legend: {
@@ -72,14 +72,12 @@ var options = {
     ],
   },
   yAxis: {
+    name: "℃  ",
     type: "value",
-    min: 0,
-    max: 40,
-    minInterval: 1,
     nameTextStyle: {
-      fontSize: 10,
+      fontSize: 12,
       color: "#fff",
-      align: "center",
+      align: "right",
     },
     splitLine: {
       lineStyle: {

ruoyi-ui/src/views/JiHeExpressway/pages/perception/meteorologyCheck/components/weatherInfoQuery/components/visibilityTrends/assets/charts.js

@@ -11,10 +11,10 @@ var options = {
     // },
   },
   grid: {
-    left: "2%",
-    right: "5%",
-    bottom: "10%",
-    top: "10%",
+    left: "0",
+    right: "0",
+    bottom: "0",
+    top: "30px",
     containLabel: true,
   },
   legend: {
@@ -75,15 +75,13 @@ var options = {
     ],
   },
   yAxis: {
+    name: "M  ",
     type: "value",
-    min: 0,
-    max: 40,
-    minInterval: 5,
     splitNumber: 5,
     nameTextStyle: {
       fontSize: 12,
-      color: "#BDD8FB",
-      align: "center",
+      color: "#fff",
+      align: "right",
     },
     splitLine: {
       lineStyle: {

ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/flowstate/assets/charts.js

@@ -9,7 +9,11 @@ var options = {
         ""
       )}<br/>${params[0].marker}${
         params[0].seriesName
-      }: <span style="font-weight:bold;"> ${params[0].value}  辆</span>`;
+      }: <span style="font-weight:bold;"> ${params[0].value}  辆</span><br/>${
+        params[1].marker
+      }${params[1].seriesName}: <span style="font-weight:bold;"> ${
+        params[1].value
+      }  辆</span>`;
     },
   },
   axisPointer: {

ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/flowstate/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class='flowstate'>
+  <div class="flowstate">
     <WgtTitle :title="'全路车流量状况'"></WgtTitle>
     <div class="board">
       <div class="tag1">方向：济南</div>
@@ -10,38 +10,33 @@
 </template>
 
 <script>
-
-import WgtTitle from '../../../widgets/title'
+import WgtTitle from "../../../widgets/title";
 import * as echarts from "echarts";
 import chartsStatistics from "./assets/charts";
 export default {
-  name: 'Flowstate',
+  name: "Flowstate",
   components: {
-    WgtTitle
+    WgtTitle,
   },
   data() {
-    return {
-
-    }
+    return {};
   },
   mounted() {
     setTimeout(() => {
       this.$nextTick(() => {
-        var myChart = echarts.init(document.getElementById('flowStateEchartBox'));
+        var myChart = echarts.init(
+          document.getElementById("flowStateEchartBox")
+        );
         myChart.setOption(chartsStatistics);
       });
     });
   },
-  created() {
-
-  },
-  methods: {
-
-  }
-}
+  created() {},
+  methods: {},
+};
 </script>
 
-<style lang='scss' scoped>
+<style lang="scss" scoped>
 .flowstate {
   width: 100%;
 
@@ -53,11 +48,15 @@ export default {
     border-radius: 5px 5px 5px 5px;
     opacity: 1;
     border: 1px solid;
-    border-image: linear-gradient(360deg, rgba(55, 231, 255, 0.3), rgba(55, 231, 255, 0)) 1 1;
+    border-image: linear-gradient(
+        360deg,
+        rgba(55, 231, 255, 0.3),
+        rgba(55, 231, 255, 0)
+      )
+      1 1;
     display: flex;
     justify-content: space-between;
     align-items: center;
-
   }
 
   .charts {

ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/index.vue

@@ -6,7 +6,6 @@
       <!-- 在途车流量车型分类 -->
       <!--  全路段拥堵状况 -->
       <Congestion class="content-l"></Congestion>
-
       <!--  畅通率 -->
       <!-- <Unblocked class="content-m" /> -->
       <!-- 全路车流量状况 -->

ruoyi-ui/src/views/JiHeExpressway/pages/service/sensitive/index.vue

@@ -84,7 +84,7 @@
         :total="numTotal"
         :current-page.sync="currentPage"
         :page-size="pageSize"
-        layout="total,prev, pager, next, jumper"
+        layout="total,sizes,prev, pager, next, jumper"
         @size-change="handleSizeChange"
         @current-change="handleCurrentChange"
       />