Merge branch 'develop' of http://39.106.31.193:9211/mengff/jihe-hs into develop

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

@@ -51,8 +51,8 @@ export default {
       return this.scale
     }
   },
-  watch:{
+  watch: {
-    headerHeight(){
+    headerHeight() {
     }
   },
   methods: {

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

@@ -1,20 +1,37 @@
 <template>
-  <div class='Descriptions keep-ratio' origin="left" :style="getStyle()">
+  <div class="Descriptions keep-ratio" origin="left" :style="getStyle()">
-    <div class="item" v-for="(item, index) in getResolveList" :key="`${item.key || item.label}${index}`"
+    <div
-      :style="[gridStyle(item, index), transformStyle(itemStyle)]">
+      class="item"
-      <div class="text title" :style="{
+      v-for="(item, index) in getResolveList"
-        ...transformStyle(titleStyle),
+      :key="`${item.key || item.label}${index}`"
-        width: labelWidth
+      :style="[gridStyle(item, index), transformStyle(itemStyle)]"
-      }">
+    >
+      <div
+        class="text title"
+        :style="{
+          ...transformStyle(titleStyle),
+          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 { getContent } from "@screen/components/FormConfig/utils/index.js";
-import ContentText from "@screen/components/FormConfig/components/Text.vue"
+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">
+      <div
-        <BackgroundClip class='dialog'
+        :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',
+    prop: "visible",
-    event: "update:value"
+    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,
@@ -185,7 +204,7 @@ export default {
     padding: 0 27px;
 
     ::v-deep {
-      >div {
+      > div {
         min-width: 96px;
       }
     }

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" />
-
+      <ElTabs v-model="activeName" @tab-click="handleClickTabs" class="tabs">
-      <Descriptions labelWidth="72px" :list="list" :data="data" style="gap: 18px" />
+        <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 Descriptions from "@screen/components/Descriptions.vue";
-import Button from "@screen/components/Buttons/Button.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 Video from "@screen/components/Video";
-import DeviceControlDialog from "./components/DeviceControlDialog.vue"
+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)
+    getProduct(this.dialogData.productId).then((data) => {
-      .then(data => {
+      this.dialogData.brand = data.brand;
-        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;
@@ -130,7 +144,7 @@ export default {
     align-items: center;
     justify-content: end;
 
-    >div {
+    > div {
       font-size: 16px;
       padding: 6px 12px;
     }

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

@@ -1,24 +1,38 @@
 <template>
-  <div class='HomeFilter'>
+  <div class="HomeFilter">
-    <ElPopover trigger="manual" :value="activeIcon === 'filter'" :visibleArrow="false" placement="left"
+    <ElPopover
-      popper-class="global-input-search-popover">
+      trigger="manual"
-      <Button :class="['btn', { 'btn-active': activeIcon }]" slot="reference" @click.native="handleClick('filter')">
+      :value="activeIcon === 'filter'"
-        <img src="@screen/images/home-filter/filter.svg">
+      :visibleArrow="false"
+      placement="left"
+      popper-class="global-input-search-popover"
+    >
+      <Button
+        :class="['btn', { 'btn-active': activeIcon }]"
+        slot="reference"
+        @click.native="handleClick('filter')"
+      >
+        <img src="@screen/images/home-filter/filter.svg" />
       </Button>
 
       <div class="body">
-        <div class="title">
+        <div class="title">设备筛选</div>
-          设备筛选
+        <Form
-        </div>
+          labelWidth="90px"
-        <Form labelWidth="90px" column="1" class="form" ref="FormConfigRef" :formList="formList" />
+          column="1"
+          class="form"
+          ref="FormConfigRef"
+          :formList="formList"
+        />
 
         <div class="footer">
-          <Button style="background-color: rgba(0, 179, 204, .3);" @click.native="handleResetForm">
+          <Button
+            style="background-color: rgba(0, 179, 204, 0.3)"
+            @click.native="handleResetForm"
+          >
             重置
           </Button>
-          <Button @click.native="handleSearch">
+          <Button @click.native="handleSearch"> 搜索 </Button>
-            搜索
-          </Button>
         </div>
       </div>
     </ElPopover>
@@ -26,17 +40,18 @@
 </template>
 
 <script>
-import Button from '@screen/components/Buttons/Button.vue';
+import Button from "@screen/components/Buttons/Button.vue";
-import Form from '@screen/components/FormConfig';
+import Form from "@screen/components/FormConfig";
 import * as PresetFormItems from "@screen/common/PresetFormItems.js";
-import { merge, cloneDeep } from "lodash"
+import { merge, cloneDeep } from "lodash";
 import request from "@/utils/request";
+import { log } from "mathjs";
 
 export default {
-  name: 'HomeFilter',
+  name: "HomeFilter",
   components: {
     Button,
-    Form
+    Form,
   },
   data() {
     return {
@@ -49,7 +64,7 @@ export default {
           key: "deviceType",
           type: "select",
           options: {
-            options: []
+            options: [],
           },
           // visible: data => {
           //   if (data.searchType == 1) {
@@ -57,29 +72,32 @@ export default {
           //   }
           // },
         },
-      ]
+      ],
-    }
+    };
   },
   methods: {
     handleClick(type) {
+      console.log("type: ", type);
       this.activeIcon = this.activeIcon === type ? null : type;
+      console.log("this.activeIcon", this.activeIcon);
     },
     filterEnd(data) {
-      this.activeIcon = null;
-      // this.filterData = data;
       this.$parent.$refs.RoadAndEventsRef?.setFilterData?.(data);
     },
     async handleResetForm() {
       this.$refs.FormConfigRef?.reset();
-      this.filterEnd(null)
+      this.activeIcon = "filter";
+      this.filterEnd(null);
     },
     async handleSearch() {
       const data = await this.$refs.FormConfigRef.validate();
 
-      if (!data.startStakeMark[0] || !data.startStakeMark[1]) delete data.startStakeMark;
+      if (!data.startStakeMark[0] || !data.startStakeMark[1])
-      if (!data.endStakeMark[0] || !data.endStakeMark[1]) delete data.endStakeMark;
+        delete data.startStakeMark;
-
+      if (!data.endStakeMark[0] || !data.endStakeMark[1])
-      this.filterEnd(data)
+        delete data.endStakeMark;
+      this.activeIcon = null;
+      this.filterEnd(data);
     },
     async getDeviceTypeOptions() {
       // try {
@@ -90,15 +108,15 @@ export default {
       // });
       // } catch (e) { console.error(e); }
       // return ;
-    }
+    },
   },
   async created() {
     // await this.getDeviceTypeOptions();
-  }
+  },
-}
+};
 </script>
 
-<style lang='scss'>
+<style lang="scss">
 div.el-popper.global-input-search-popover {
   background: rgba(6, 66, 88, 0.8);
   border: 1px solid rgba(42, 217, 253, 0.6);
@@ -108,23 +126,25 @@ div.el-popper.global-input-search-popover {
 
   .body {
     .title {
-      background: linear-gradient(90deg, #237E9B 0%, rgba(23, 145, 184, 0) 100%);
+      background: linear-gradient(
+        90deg,
+        #237e9b 0%,
+        rgba(23, 145, 184, 0) 100%
+      );
       padding: 3px 9px;
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
-
     }
   }
 }
 </style>
-<style lang='scss' scoped>
+<style lang="scss" scoped>
 .HomeFilter {
-
   .btn {
     padding: 9px;
-    background: linear-gradient(180deg, #152E3C 0%, #163A45 100%);
+    background: linear-gradient(180deg, #152e3c 0%, #163a45 100%);
     border-radius: 4px;
     overflow: hidden;
     height: unset;
@@ -132,7 +152,7 @@ div.el-popper.global-input-search-popover {
   }
 
   .btn-active {
-    background: linear-gradient(180deg, #005C79 0%, #009BCC 100%);
+    background: linear-gradient(180deg, #005c79 0%, #009bcc 100%);
   }
 }
 </style>

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

@@ -1,6 +1,13 @@
 <template>
-  <div class='Home'>
+  <div class="Home">
-    <AMapContainer ref="AMapContainerRef" @update:isGisCompleted="(data) => { this.isGisCompleted = data; }" />
+    <AMapContainer
+      ref="AMapContainerRef"
+      @update:isGisCompleted="
+        (data) => {
+          this.isGisCompleted = data;
+        }
+      "
+    />
     <section class="content">
       <!-- 左侧 -->
       <div class="content-l">
@@ -8,7 +15,11 @@
         <FocusedMonitoring class="card-menu" />
 
         <!-- 下 -->
-        <RoadAndEvents ref="RoadAndEventsRef" :isGisCompleted="isGisCompleted" class="content-l-b card-menu" />
+        <RoadAndEvents
+          ref="RoadAndEventsRef"
+          :isGisCompleted="isGisCompleted"
+          class="content-l-b card-menu"
+        />
       </div>
 
       <!-- 右侧 -->
@@ -24,7 +35,11 @@
     <footer class="footer card-menu">
       <div class="footer-title">
         <span>济菏高速缩略图</span>
-        <i class="el-icon-s-fold" style="color: #2AD9FD; transform: rotate(-90deg);" @click.stop="handleShrink" />
+        <i
+          class="el-icon-s-fold"
+          style="color: #2ad9fd; transform: rotate(-90deg)"
+          @click.stop="handleShrink"
+        />
       </div>
       <div class="footer-content">
         <Thumbnail />
@@ -41,12 +56,12 @@ import RoadAndEvents from "./components/RoadAndEvents/index.vue";
 import AMapContainer from "./components/AMapContainer/index.vue";
 import HomeFilter from "./components/HomeFilter/index.vue";
 import HomeFrame from "./components/HomeFrame/index.vue";
-import Button from '@screen/components/Buttons/Button.vue';
+import Button from "@screen/components/Buttons/Button.vue";
 
 // import InfoBoard from "./components/InfoBoard"
 
 export default {
-  name: 'Home',
+  name: "Home",
   components: {
     FocusedMonitoring,
     ConditionStatistics,
@@ -63,34 +78,37 @@ export default {
       isShowInfoBoard: false,
       selectedDevice: null,
       isGisCompleted: false,
-    }
+    };
   },
   provide() {
     return {
-      getMap: () => this.$refs.AMapContainerRef.getMapInstance()
+      getMap: () => this.$refs.AMapContainerRef.getMapInstance(),
-    }
+    };
   },
   methods: {
     handleShrink(e) {
       const translateXElement = e.target.parentElement.parentElement;
 
-      const result = (e.target.style.transform.match(/[-0-9]+/)?.[0] || -90) * -1
+      const result =
+        (e.target.style.transform.match(/[-0-9]+/)?.[0] || -90) * -1;
 
       e.target.style.transform = `rotate(${result}deg)`;
-      if (translateXElement.style.transform !== `translateY(calc(100% - 36px))`) {
+      if (
-        translateXElement.style.transform = `translateY(calc(100% - 36px))`
+        translateXElement.style.transform !== `translateY(calc(100% - 36px))`
+      ) {
+        translateXElement.style.transform = `translateY(calc(100% - 36px))`;
         translateXElement.style.position = `absolute`;
         translateXElement.style.bottom = `0px`;
       } else {
-        translateXElement.style.transform = `translateY(0)`
+        translateXElement.style.transform = `translateY(0)`;
         translateXElement.style.position = `relative`;
       }
-    }
+    },
-  }
+  },
-}
+};
 </script>
 
-<style lang='scss' scoped>
+<style lang="scss" scoped>
 .Home {
   height: 100%;
   z-index: 6;
@@ -101,7 +119,7 @@ export default {
   justify-content: center;
 
   .card-menu {
-    transition: all .24s linear;
+    transition: all 0.24s linear;
   }
 
   .content {
@@ -113,7 +131,7 @@ export default {
     height: min-content;
     pointer-events: none;
 
-    >div {
+    > div {
       pointer-events: auto;
     }
 
@@ -127,7 +145,7 @@ export default {
       overflow: hidden;
       height: 100%;
 
-      >div {
+      > div {
         pointer-events: all;
         flex: 1;
       }
@@ -176,7 +194,7 @@ export default {
     will-change: height;
     bottom: 0;
 
-    >div {
+    > div {
       pointer-events: all;
     }
 
@@ -205,7 +223,7 @@ export default {
       }
 
       i {
-        transition: all .24s linear;
+        transition: all 0.24s linear;
         cursor: pointer;
       }
 

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(
+          this.searchFormList[2].default = dataList.map((item) => item.key);
-            (item) => item.id
-          );
           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,10 @@ export const searchFormList = [
     key: "time",
     required: true,
     type: "datePicker",
+    default: [
+      moment().startOf("month").format("YYYY-MM-DD HH:mm:ss"),
+      moment().format("YYYY-MM-DD HH:mm:ss"),
+    ],
     options: {
       format: "yyyy-MM-dd",
       type: "daterange",
@@ -39,6 +43,7 @@ export const searchFormList = [
     key: "type",
     required: true,
     type: "select",
+    default: "1",
     options: {
       options: [
         {

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

@@ -202,8 +202,7 @@ export default {
     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;
+      this.typeQuery = this.searchFormList[1].options.options[0].value;
-      console.log(8888, this.startTime, this.time, this.typeQuery);
       clearInterval(this.interval);
       if (this.activeName == "first") {
         this.initDevice();
@@ -247,8 +246,8 @@ export default {
     handleSearch(data) {
       console.log(777, data);
       this.typeQuery = data.type;
-      this.startTime = this.formatDate(data.time[0]);
+      this.startTime = moment(data.time[0]).format("YYYY-MM-DD HH:mm:ss");
-      this.time = this.formatDate(data.time[1]);
+      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 +258,6 @@ export default {
     },
     changeTabs() {
       this.initData();
-      console.log("======================", this.queryChart);
       this.$nextTick(() => {
         this.queryChart.resize();
       });
@@ -414,8 +412,9 @@ export default {
       });
     },
   },
-  mounted() {
+  async mounted() {
-    this.initData();
+    console.log("__________________", searchFormList[0].default);
+    await 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%",
+    left: "0",
-    right: "5%",
+    right: "0",
-    bottom: "10%",
+    bottom: "0",
-    top: "10%",
+    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%",
+    left: "0",
-    right: "5%",
+    right: "0",
-    bottom: "10%",
+    bottom: "0",
-    top: "10%",
+    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",
+      color: "#fff",
-      align: "center",
+      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,47 +1,42 @@
 <template>
-  <div class='flowstate'>
+  <div class="flowstate">
     <WgtTitle :title="'全路车流量状况'"></WgtTitle>
     <div class="board">
       <div class="tag1">方向：济南</div>
       <div class="tag2">方向：菏泽</div>
-      <div class="charts keep-ratio " id="flowStateEchartBox"></div>
+      <div class="charts keep-ratio" id="flowStateEchartBox"></div>
     </div>
   </div>
 </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() {
+  created() {},
-
+  methods: {},
-  },
+};
-  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/perception/trafficSituation/components/IndicatorAnalysis/components/trafficIndicators/assets/chartsRadar.js

@@ -1,14 +1,22 @@
-import * as echarts from "echarts";
+window.radarData = {'交通特征':9,'拥挤度':8,'饱和度':5,}
+
 let options = {
   legend: {
     show: false,
   },
+  tooltip: {
+    trigger: "item",
+    formatter: function (params) {
+      let data = params.data;
+      return `交通特征: ${data.value[0]}<br>拥挤度: ${data.value[1]}<br>饱和度: ${data.value[2]}`;
+    },
+  },
   radar: [
     {
       indicator: [
-        { text: "Indicator1" },
+        { name: "交通特征",max: 10 }, 
-        { text: "Indicator2" },
+        { name: "拥挤度" ,max: 10},
-        { text: "Indicator3" },
+        { name: "饱和度",max: 10 }, 
       ],
       center: ["50%", "55%"],
       radius: 70,
@@ -16,8 +24,10 @@ let options = {
       splitNumber: 4,
       shape: "circle",
       axisName: {
-        formatter: "{value}",
+        formatter: function (value) {
-        color: "#428BD4",
+          return value + ' '+ (radarData[value] / 10 * 100) + "%";
+      },
+        color: "#fff",
       },
       splitArea: {
         areaStyle: {
@@ -45,8 +55,8 @@ let options = {
       },
       data: [
         {
-          value: [1, 5, 1],
+          value: [9,8,5],
-          name: "Data B",
+          name: "月指标",
           areaStyle: {
             color: {
               type: "linear",
@@ -56,12 +66,12 @@ let options = {
               y2: 1,
               colorStops: [
                 {
-                  offset: 0.1,
+                  offset: 0,
                   color: "#DC6A00", // 0% 处的颜色
                 },
                 {
                   offset: 0.5,
-                  color: "#5D887C", // 100% 处的颜色
+                  color: "#5D887C", // 50% 处的颜色
                 },
                 {
                   offset: 1,

ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/trafficIndicators/index.vue

@@ -33,87 +33,38 @@
           <el-button type="primary" size="mini" class="btnSearch"  icon="el-icon-search">查询</el-button>
           <el-button class="btnReset"  size="mini" icon="el-icon-refresh-left" >重置</el-button>
         </div> -->
-      <ProgressBar
+      <ProgressBar :dataList="dataList" class="keep-ratio progressbar" :selectIndex="7" />
-        :dataList="dataList"
-        class="keep-ratio progressbar"
-        :selectIndex="7"
-      />
       <div class="body">
         <div class="body-l">
           <div class="searchPanel_1">
             <!-- <el-from ref="form"> -->
-            <RadioGroup
+            <RadioGroup :options="[
-              :options="[
+      { key: '1', label: '菏泽' },
-                { key: '1', label: '菏泽' },
+      { key: '3', label: '济南' },
-                { key: '3', label: '济南' },
+    ]" v-model="direction" type="button" />
-              ]"
+            <el-select v-model="type" size="mini" class="selectRoad" placeholder="请选择">
-              v-model="direction"
+              <el-option v-for="item in typeOptions" :key="item.value" :label="item.label" :value="item.value">
-              type="button"
-            />
-            <el-select
-              v-model="type"
-              size="mini"
-              class="selectRoad"
-              placeholder="请选择"
-            >
-              <el-option
-                v-for="item in typeOptions"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
-              >
               </el-option>
             </el-select>
-            <el-select
+            <el-select v-model="quarter" size="medium" v-if="type == '3'" class="selectRoad-medium" placeholder="请选择">
-              v-model="quarter"
+              <el-option v-for="item in quarterOptions" :key="item.value" :label="item.label" :value="item.value">
-              size="medium"
-              v-if="type == '3'"
-              class="selectRoad-medium"
-              placeholder="请选择"
-            >
-              <el-option
-                v-for="item in quarterOptions"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
-              >
               </el-option>
             </el-select>
             <!-- <el-quarter-picker size="mini" class="selectRoad" style="width:180px;" v-if="type == '3'" v-model="dateTime"
             aria-placeholder="请选季度" /> -->
-            <el-date-picker
+            <el-date-picker size="mini" v-if="type != '3'" class="selectRoad" v-model="dateTime" style="width: 140px"
-              size="mini"
+              :type="type == 1
-              v-if="type != '3'"
+      ? 'date'
-              class="selectRoad"
+      : type == 2
-              v-model="dateTime"
+        ? 'month'
-              style="width: 140px"
+        : type == 4
-              :type="
+          ? 'year'
-                type == 1
+          : ''
-                  ? 'date'
+      " placeholder="请选择" />
-                  : type == 2
+
-                  ? 'month'
+            <el-button type="primary" size="mini" class="btnSearch" @click="searchQuery"
-                  : type == 4
+              icon="el-icon-search">查询</el-button>
-                  ? 'year'
+            <el-button class="btnReset" size="mini" icon="el-icon-refresh-left" @click="handleClear">重置</el-button>
-                  : ''
-              "
-              placeholder="请选择"
-            />
-
-            <el-button
-              type="primary"
-              size="mini"
-              class="btnSearch"
-              @click="searchQuery"
-              icon="el-icon-search"
-              >查询</el-button
-            >
-            <el-button
-              class="btnReset"
-              size="mini"
-              icon="el-icon-refresh-left"
-              @click="handleClear"
-              >重置</el-button
-            >
             <!-- </el-from> -->
           </div>
           <!-- <div class="searchPanel_1">
@@ -138,7 +89,7 @@
         <div class="chartOrg">
           <div class="itemChart">
             <div class="title">上月指标</div>
-            <div id="chart2" class="keep-ratio"></div>
+            <div id="chart2" class=""></div>
           </div>
           <div class="itemChart">
             <div class="title">本月指标</div>
@@ -338,7 +289,7 @@ export default {
     };
   },
 
-  created() {},
+  created() { },
   methods: {},
   mounted() {
     setTimeout(() => {
@@ -358,46 +309,60 @@ export default {
         canvas.height = parentDiv.offsetHeight;
         parentDiv.appendChild(canvas);
         const context = canvas.getContext("2d");
+        context.lineWidth = 1; // 设置线段宽度
 
         // 填充渐变颜色
-        var gr = context.createLinearGradient(247, 63, 450, 0);
+        var gr = context.createLinearGradient(140, 0, 180, 0);
         // 颜色断点
         gr.addColorStop(1, "rgba(92,197,255,0)");
         gr.addColorStop(0, "rgba(92,197,255,0.5)");
-
-        context.lineWidth = 1; // 设置线段宽度
-
         // 绘制圆角矩形
-        drawRoundRect(context, 300, 78, 160, 24, 12, gr);
+        drawRoundRect(context, 98, 1, 90, 22, 12, gr);
 
-        var gr = context.createLinearGradient(240, 63, 450, 0);
+        var gr = context.createLinearGradient(35, 0, 75, 0);
         // 颜色断点
         gr.addColorStop(1, "rgba(92,197,255,0)");
         gr.addColorStop(0, "rgba(92,197,255,0.5)");
-        drawRoundRect(context, 300, 148, 160, 24, 12, gr);
+        drawRoundRect(context, -1, 136, 80, 20, 12, gr);
 
-        var gr = context.createLinearGradient(240, 63, 450, 0);
+        var gr = context.createLinearGradient(230, 0, 275, 0);
         // 颜色断点
         gr.addColorStop(1, "rgba(92,197,255,0)");
         gr.addColorStop(0, "rgba(92,197,255,0.5)");
-        drawRoundRect(context, 300, 218, 160, 24, 12, gr);
+        context.lineWidth = 1; // 设置线段宽度
+        drawRoundRect(context, 211, 136, 220, 20, 12, gr);
+
 
-        var gr = context.createLinearGradient(400, 63, 450, 0);
+        const domMap3 = document.getElementById("chart3");
+        let parentDiv3 = domMap3.firstChild;
+        // 创建canvas
+        let canvas3 = document.createElement("canvas");
+        canvas3.width = parentDiv3.offsetWidth;
+        canvas3.height = parentDiv3.offsetHeight;
+        parentDiv3.appendChild(canvas3);
+        const context3 = canvas3.getContext("2d");
+        context3.lineWidth = 1; // 设置线段宽度
+
+        // 填充渐变颜色
+        var gr = context3.createLinearGradient(140, 0, 180, 0);
         // 颜色断点
         gr.addColorStop(1, "rgba(92,197,255,0)");
         gr.addColorStop(0, "rgba(92,197,255,0.5)");
+        // 绘制圆角矩形
+        drawRoundRect(context3, 98, 4, 90, 20, 12, gr);
 
-        drawRoundRect(context, 460, 78, 160, 24, 12, gr);
+        var gr = context3.createLinearGradient(35, 0, 75, 0);
-        var gr = context.createLinearGradient(350, 63, 450, 0);
         // 颜色断点
         gr.addColorStop(1, "rgba(92,197,255,0)");
         gr.addColorStop(0, "rgba(92,197,255,0.5)");
-        drawRoundRect(context, 460, 148, 160, 24, 12, gr);
+        drawRoundRect(context3, -1, 138, 80, 20, 12, gr);
-        var gr = context.createLinearGradient(300, 63, 450, 0);
+
+        var gr = context3.createLinearGradient(240, 0, 290, 0);
         // 颜色断点
         gr.addColorStop(1, "rgba(92,197,255,0)");
         gr.addColorStop(0, "rgba(92,197,255,0.5)");
-        drawRoundRect(context, 460, 218, 160, 24, 12, gr);
+        context3.lineWidth = 1; // 设置线段宽度
+        drawRoundRect(context3, 211, 138, 220, 20, 12, gr);
       });
     });
   },
@@ -420,7 +385,7 @@ export default {
     width: 100%;
     font-size: 14px;
 
-    > div {
+    >div {
       display: inline-flex;
       flex-direction: column;
       height: 100%;
@@ -436,7 +401,7 @@ export default {
     .chartOrg {
       flex-direction: row !important;
 
-      > div {
+      >div {
         display: inline-flex;
         flex-direction: column;
         width: 50%;
@@ -444,7 +409,7 @@ export default {
       }
 
       .itemChart {
-        > .title {
+        >.title {
           display: inline-flex;
           width: 100%;
           height: 30px;

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"
       />