diff --git a/ruoyi-ui/src/assets/images/login/139.png b/ruoyi-ui/src/assets/images/login/139.png
new file mode 100644
index 00000000..edd626e4
Binary files /dev/null and b/ruoyi-ui/src/assets/images/login/139.png differ
diff --git a/ruoyi-ui/src/assets/images/login/login-background.png b/ruoyi-ui/src/assets/images/login/login-background.png
new file mode 100644
index 00000000..26a364dc
Binary files /dev/null and b/ruoyi-ui/src/assets/images/login/login-background.png differ
diff --git a/ruoyi-ui/src/assets/images/login/logo.png b/ruoyi-ui/src/assets/images/login/logo.png
new file mode 100644
index 00000000..bb77139b
Binary files /dev/null and b/ruoyi-ui/src/assets/images/login/logo.png differ
diff --git a/ruoyi-ui/src/assets/images/login/password.png b/ruoyi-ui/src/assets/images/login/password.png
new file mode 100644
index 00000000..8231760a
Binary files /dev/null and b/ruoyi-ui/src/assets/images/login/password.png differ
diff --git a/ruoyi-ui/src/assets/images/login/user.png b/ruoyi-ui/src/assets/images/login/user.png
new file mode 100644
index 00000000..9c5c54d9
Binary files /dev/null and b/ruoyi-ui/src/assets/images/login/user.png differ
diff --git a/ruoyi-ui/src/views/JiHeExpressway/components/Pagination.vue b/ruoyi-ui/src/views/JiHeExpressway/components/Pagination.vue
index 97dcbe14..5c3ed94a 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/components/Pagination.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/components/Pagination.vue
@@ -14,7 +14,7 @@ export default {
     getProps() {
       return {
         // total
-        layout: "prev, pager, next, sizes, jumper,total",
+        layout: "prev, pager, next, sizes, jumper, total",
         ...this.$attrs,
         small: true,
       };
@@ -109,5 +109,8 @@ export default {
       margin-right: 6px;
     }
   }
+  ::v-deep .el-pagination__total {
+    margin-left: 10px;
+  }
 }
 </style>
diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/home-Frame/logoMean.jpg b/ruoyi-ui/src/views/JiHeExpressway/images/home-Frame/logoMean.jpg
deleted file mode 100644
index 67814fe5..00000000
Binary files a/ruoyi-ui/src/views/JiHeExpressway/images/home-Frame/logoMean.jpg and /dev/null differ
diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/home-Frame/logoMean.png b/ruoyi-ui/src/views/JiHeExpressway/images/home-Frame/logoMean.png
new file mode 100644
index 00000000..fa12035a
Binary files /dev/null and b/ruoyi-ui/src/views/JiHeExpressway/images/home-Frame/logoMean.png differ
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFrame/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFrame/index.vue
index 4f7ea6e3..2ac7dcd5 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFrame/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFrame/index.vue
@@ -1,17 +1,24 @@
 <template>
-  <div class='HomeFrame'>
-    <ElPopover trigger="manual" :value="activeIcon === 'Frame'" :visibleArrow="false" placement="left"
-      popper-class="global-input-search-popover">
-      <Button :class="['btn', { 'btn-active': activeIcon }]" slot="reference" @click.native="handleClick('Frame')">
-        <img src="@screen/images/home-Frame/Frame.svg">
+  <div class="HomeFrame">
+    <ElPopover
+      trigger="manual"
+      :value="activeIcon === 'Frame'"
+      :visibleArrow="false"
+      placement="left"
+      popper-class="global-input-search-popover"
+    >
+      <Button
+        :class="['btn', { 'btn-active': activeIcon }]"
+        slot="reference"
+        @click.native="handleClick('Frame')"
+      >
+        <img src="@screen/images/home-Frame/Frame.svg" />
       </Button>
 
       <div class="body">
-        <div class="title">
-          图标含义
-        </div>
+        <div class="title">图标含义</div>
         <!-- <Form labelWidth="90px" column="1" class="form" ref="FormConfigRef" :formList="formList" /> -->
-        <img class="image" src="@screen/images/home-Frame/logoMean.jpg">
+        <img class="image" src="@screen/images/home-Frame/logoMean.png" />
         <!-- <div class="footer">
         </div> -->
       </div>
@@ -20,21 +27,21 @@
 </template>
 
 <script>
-import Button from '@screen/components/Buttons/Button.vue';
-import Form from '@screen/components/FormConfig';
+import Button from "@screen/components/Buttons/Button.vue";
+import Form from "@screen/components/FormConfig";
 import * as PresetFormItems from "@screen/pages/control/event/event/FormEvent/PresetFormItems.js";
-import { merge, cloneDeep } from "lodash"
+import { merge, cloneDeep } from "lodash";
 
 export default {
-  name: 'HomeFrame',
+  name: "HomeFrame",
   components: {
     Button,
-    Form
+    Form,
   },
   data() {
     return {
-      activeIcon: null
-    }
+      activeIcon: null,
+    };
   },
   methods: {
     handleClick(type) {
@@ -45,43 +52,45 @@ export default {
       // this.filterData = data;
       this.$parent.$refs.RoadAndEventsRef?.setFilterData?.(data);
     },
-  }
-}
+  },
+};
 </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);
   position: relative;
   padding-top: 36px;
   transform: translateY(24px);
-  margin-top: 3vh;
+  margin-top: 6vh;
 
   .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>
 .image {
-  width: 45vw;
+  width: 60vw;
   height: 65vh;
 }
 
 .HomeFrame {
-
   .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;
@@ -89,7 +98,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>
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/dispatch/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/dispatch/index.vue
index 8d6451a1..2e422e03 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/dispatch/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/dispatch/index.vue
@@ -42,6 +42,12 @@ import EventDispatchDialog from "./EventDispatchDialog/index";
 import { searchFormList } from './data';
 import request from "@/utils/request";
 
+const directionMapping = {
+  '1': '菏泽方向',
+  '2': '双向',
+  '3': '济南方向'
+}
+
 export default {
   name: 'RoadNetworkMonitoring',
   components: {
@@ -81,8 +87,11 @@ export default {
         params: this.searchData,
       }).then((result) => {
         if (result.code != 200) return Message.error(result?.msg);
-        this.data = result.rows;
         this.total = result.total;
+        result.rows.forEach(it => {
+          it.stringDirection = directionMapping[it.direction] || it.direction;
+        })
+        this.data = result.rows;
       });
     },
     onSizeChange(pageSize) {
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/index.vue
index 19d2210e..3d4d0d68 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/index.vue
@@ -1,13 +1,13 @@
 <template>
   <Dialog v-model="modelVisible" title="事件详情">
-    <div class="EventDetail" :style="{ height: (activeName == '-1' || activeName == '0') ? '380px' : '768px'}">
+    <div class="EventDetail" :style="{ height: (activeName == '-1' || activeName == '0') ? '380px' : '768px' }">
       <Form :formList="formList" :dFormData="formData" label-width="100px" />
 
       <div class="video-pic">
-        <Video style="height: 100%;" :showHeader="activeName != '-1'"/>
+        <Video style="height: 100%;" :showHeader="activeName != '-1'" />
         <Video v-if="activeName != '-1'" style="height: 100%;" />
 
-        <Carousel v-else style="flex: 1" :pictures="formData.pictures"/>
+        <Carousel v-else style="flex: 1" :pictures="formData.pictures" />
       </div>
 
       <TimeLine1 v-if="activeName == '1' || activeName == '2'" :data="timeLine1List" />
@@ -15,9 +15,10 @@
 
     </div>
     <template #footer>
-      <Button v-if="activeName == '-1' || activeName == '0'" style="padding: 0 24px;" @click.native="modelVisible = false">误报</Button>
+      <Button style="padding: 0 24px;" @click.native="onDelete">误报</Button>
       <Button :style="{ backgroundColor: '#C9C9C9', padding: '0 24px' }" @click.native="modelVisible = false">取消</Button>
-      <Button v-if="activeName == '-1' || activeName == '0'" style="padding: 0 24px;" @click.native="modelVisible = false">确认</Button>
+      <Button v-if="activeName == '-1' || activeName == '0'" style="padding: 0 24px;"
+        @click.native="modelVisible = false">确认</Button>
     </template>
   </Dialog>
 </template>
@@ -33,6 +34,7 @@ import Video from "@screen/components/Video";
 import Carousel from "./Carousel/index.vue"
 import Button from '@screen/components/Buttons/Button.vue';
 import request from "@/utils/request";
+import { Message } from "element-ui";
 var moment = require("moment");
 
 export default {
@@ -92,7 +94,7 @@ export default {
   },
   methods: {
     getProcess() {
-      if(this.activeName == '-1' || this.activeName == '0'){
+      if (this.activeName == '-1' || this.activeName == '0') {
         this.timeLine1List = [];
         this.timeLine2List = [];
         return;
@@ -144,6 +146,31 @@ export default {
 
       })
 
+    },
+    onDelete() {
+      if (this.formData.id) {
+        this.$confirm('确定误报吗？', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          // this.modelVisible = false;
+          //   this.$emit('queryData', true);
+          //   return;
+          request({
+            url: `/business/warning/delete`,
+            method: "post",
+            data: { id: this.formData.id }
+          }).then(result => {
+            if (result.code == 200) Message.success('成功！');
+            else Message.error(result?.msg);
+            this.modelVisible = false;
+            this.$emit('queryData', true);
+          })
+        })
+
+      }
+
     }
   }
 }
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/PresetFormItems.js b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/PresetFormItems.js
index 5f63793a..bde66452 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/PresetFormItems.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/PresetFormItems.js
@@ -367,6 +367,9 @@ export const vehicleCondition = (keyPrefix = "dcEventAccident") => ({
           text: "辆",
         },
         type: "inputNumber",
+        options: {
+          min: 0,
+        },
         key: `${keyPrefix}.smallCar`,
       },
       {
@@ -376,6 +379,9 @@ export const vehicleCondition = (keyPrefix = "dcEventAccident") => ({
         suffix: {
           text: "辆",
         },
+        options: {
+          min: 0,
+        },
         type: "inputNumber",
         key: `${keyPrefix}.trucks`,
       },
@@ -387,6 +393,9 @@ export const vehicleCondition = (keyPrefix = "dcEventAccident") => ({
           text: "辆",
         },
         type: "inputNumber",
+        options: {
+          min: 0,
+        },
         key: `${keyPrefix}.buses`,
       },
       {
@@ -397,6 +406,9 @@ export const vehicleCondition = (keyPrefix = "dcEventAccident") => ({
           text: "辆",
         },
         type: "inputNumber",
+        options: {
+          min: 0,
+        },
         key: `${keyPrefix}.tankers`,
       },
     ],
@@ -630,23 +642,23 @@ export const trafficAccidentType = {
   options: {
     options: [
       {
-        value: "1",
+        value: "1-1",
         label: "追尾",
       },
       {
-        value: "2",
+        value: "1-2",
         label: "侧翻",
       },
       {
-        value: "3",
+        value: "1-3",
         label: "撞护栏",
       },
       {
-        value: "4",
+        value: "1-4",
         label: "自然",
       },
       {
-        value: "5",
+        value: "1-5",
         label: "其他事故",
       },
     ],
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/data.js b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/data.js
index 2f1098d2..0516f4e2 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/data.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/data.js
@@ -63,10 +63,7 @@ export const tabConfigList = [
           ...PresetFormItems.callPolicePersonPhone,
           key: "dcEventAccident.reporterPhoneNumber",
         },
-        {
-          ...PresetFormItems.trafficAccidentType,
-          key: "dcEventAccident.accidentType",
-        },
+        PresetFormItems.trafficAccidentType,
         PresetFormItems.eventLevel,
         {
           ...PresetFormItems.locationMode,
@@ -422,7 +419,14 @@ export const tabConfigList = [
           },
         },
         PresetFormItems.direction,
-        PresetFormItems.station,
+        { ...PresetFormItems.station,
+          visible: (data) => {
+            if (data.dcEventVehicleAccident && data.dcEventVehicleAccident.locationType != 1) {
+              return false;
+            }
+            return true;
+          },
+        },
         PresetFormItems.eventHappenTime,
         PresetFormItems.aEstimatedReleaseTime,
         {
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/data.js b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/data.js
index a5423158..775dc18d 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/data.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/data.js
@@ -83,6 +83,10 @@ export const gjSearchFormList = [
           key: "6",
           label: "非机预警",
         },
+        {
+          key: "7",
+          label: "气象监测器",
+        },
       ],
     },
   },
@@ -145,17 +149,17 @@ export const gzSearchFormList = [
     options: {
       options: [
         {
-          key: "济南方向",
-          label: "济南方向",
-        },
-        {
-          key: "菏泽方向",
+          key: "1",
           label: "菏泽方向",
         },
         {
-          key: "双向",
-          label: "双向",
+          key: "3",
+          label: "济南方向",
         },
+        // {
+        //   key: "双向",
+        //   label: "双向",
+        // },
       ],
     },
   },
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/index.vue
index 6a44b764..3fe4e4c2 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/index.vue
@@ -5,7 +5,7 @@
     <!-- 搜索栏 -->
     <div class="filter">
       <div>
-        <ButtonGradient @click="onAddNew">
+        <ButtonGradient @click="onAddNew" v-if="activeName != '1' && activeName != '2'">
           <template #prefix>
             <img src="./images/insert.svg" />
           </template>
@@ -43,7 +43,7 @@
     </div>
 
     <!-- "详情"弹出框 -->
-    <EventDetailDialog :visible="eventDetailDialogVisible" :formData="detailDialogFormData" :activeName="activeName" @update:value="handleClose" />
+    <EventDetailDialog :visible="eventDetailDialogVisible" :formData="detailDialogFormData" :activeName="activeName" @update:value="handleClose" @queryData="queryData"/>
     <!-- "新增"弹出框 -->
     <FormEvent :visible="isShowAddNew" @close="onCloseAddNew" />
   </div>
@@ -59,6 +59,7 @@ import EventDetailDialog from "./EventDetailDialog/index";
 import FormEvent from "./FormEvent/index";
 import { tabMap, gjSearchFormList, gzSearchFormList } from "./data";
 import request from "@/utils/request";
+import { Message } from "element-ui";
 import { Loading } from 'element-ui';
 
 function getRandomData(min = 1, max = 15) {
@@ -81,6 +82,7 @@ const warningSourceMapping = {
   4: '护栏碰撞',
   5: '扫码报警',
   6: '非机预警',
+  7: '气象监测器'
 }
 const directionMapping = {
   '1': '上行',
@@ -179,6 +181,9 @@ export default {
         lastBtnText: text,
       };
     },
+    queryData(flag){
+      this.getData()
+    },
     getData() {
       if (this.activeName === '-1') {
         request({
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/governanceAnalysis/components/postTrendsDay/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/governanceAnalysis/components/postTrendsDay/assets/charts.js
index bf55ef05..322bd9bd 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/governanceAnalysis/components/postTrendsDay/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/governanceAnalysis/components/postTrendsDay/assets/charts.js
@@ -24,7 +24,7 @@ var options = {
   grid: {
     top: "15%", //上边距
     right: "0", //右边距
-    left: "10px", //左边距
+    left: "15px", //左边距
     bottom: "10%", //下边距
     containLabel: true,
   },
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/data.js b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/data.js
index d605840d..e5324981 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/data.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/data.js
@@ -27,7 +27,7 @@ export const searchFormList = [
   {
     label: "时间范围:",
     key: "time",
-    required: true,
+    // required: true,
     type: "datePicker",
     options: {
       format:"yyyy-MM-dd",
@@ -35,9 +35,9 @@ export const searchFormList = [
     },
   },
   {
-    label: "型号类型:",
+    label: "设备类型:",
     key: "type",
-    required: true,
+    // required: true,
     type: "select",
     options: {
       options: [
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/dayTotal/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/dayTotal/assets/charts.js
index edffb3de..61c85463 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/dayTotal/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/dayTotal/assets/charts.js
@@ -39,7 +39,7 @@ var options = {
     },
   },
   grid: {
-    left: "1%",
+    left: "10px",
     right: "0%",
     top: "16%",
     bottom: "5%",
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/dayTotal/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/dayTotal/index.vue
index 9d533bae..879158ae 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/dayTotal/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/dayTotal/index.vue
@@ -1,52 +1,55 @@
 <template>
-  <div class='congestion'>
+  <div class="congestion">
     <WgtTitle :title="'日累计感知事件趋势'"></WgtTitle>
     <div class="board">
-      <Empty v-show="!dataList || dataList.length <= 0" text="暂无数据..."></Empty>
-      <div v-show="dataList && dataList.length > 0" style="width: 450px;" class="charts keep-ratio " id="daytotal"></div>
+      <Empty
+        v-show="!dataList || dataList.length <= 0"
+        text="暂无数据..."
+      ></Empty>
+      <div
+        v-show="dataList && dataList.length > 0"
+        style="width: 450px"
+        class="charts keep-ratio"
+        id="daytotal"
+      ></div>
     </div>
   </div>
 </template>
-  
-<script>
 
-import WgtTitle from '../../../widgets/title'
+<script>
+import WgtTitle from "../../../widgets/title";
 import * as echarts from "echarts";
 import chartsStatistics from "./assets/charts";
-import { getDailyCumulative } from '../../../../../../../api/event/perceiveEvent';
+import { getDailyCumulative } from "../../../../../../../api/event/perceiveEvent";
 import moment from "moment";
 
 export default {
-  name: 'RailWayDay',
+  name: "RailWayDay",
   components: {
-    WgtTitle
+    WgtTitle,
   },
   data() {
     return {
-      dataList: []
-    }
-  },
-
-  created() {
-
+      dataList: [],
+    };
   },
-  methods: {
 
-  },
+  created() {},
+  methods: {},
   mounted() {
     setTimeout(() => {
       this.$nextTick(() => {
-        var myChart = echarts.init(document.getElementById('daytotal'));
+        var myChart = echarts.init(document.getElementById("daytotal"));
 
-        getDailyCumulative().then(res => {
+        getDailyCumulative().then((res) => {
           if (res.code == 200) {
-            this.dataList = res.data
+            this.dataList = res.data;
             let data = res.data;
             let timer = [];
             let number = [];
 
             data.forEach((it) => {
-              timer.push(moment(it.time).format('HH:mm'));
+              timer.push(moment(it.time).format("HH:mm"));
               number.push(it.number);
             });
 
@@ -55,32 +58,34 @@ export default {
 
             myChart.setOption(chartsStatistics);
           }
-
         });
-
       });
     });
   },
-}
+};
 </script>
-  
-<style lang='scss' scoped>
+
+<style lang="scss" scoped>
 .congestion {
   width: 100%;
 
   .board {
     height: 200px;
     width: 100%;
-    padding: 0px 20px;
+    // padding: 0px 20px;
     background: linear-gradient(180deg, rgba(6, 66, 88, 0.2) 0%, #064258 100%);
     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;
-
   }
 }
 
@@ -89,4 +94,3 @@ export default {
   width: 100%;
 }
 </style>
-  
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/assets/charts2.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/assets/charts2.js
index 221623b2..86fa33f2 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/assets/charts2.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/assets/charts2.js
@@ -51,8 +51,8 @@ let chartData = [],
     "#50EED3",
     "#5DEF9E",
     "#29B3FF",
-    "#FB5C38",
-    "#FB5C38",
+    "#29A1AF",
+    "#2D5CA8",
     "#FCBB14",
   ];
 for (let i = 0; i < data.length; i++) {
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/assets/charts3.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/assets/charts3.js
index b18cc633..59bddcab 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/assets/charts3.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/assets/charts3.js
@@ -54,7 +54,7 @@ let options = {
       name: "（起）",
       nameTextStyle: {
         color: "#fff",
-        fomtSize: 10,
+        fontSize: 10,
         align: "right",
       },
       min: 0,
@@ -191,6 +191,9 @@ let options = {
       zlevel: 10,
       data: [],
       animationDelay: 500,
+      tooltip: {
+        show: false,
+      },
     },
   ],
 };
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/index.vue
index 9abb5d86..60366b91 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/index.vue
@@ -220,8 +220,8 @@ export default {
       dateTime: "2024",
       direction: "1",
       dataList: [],
-      selectIndex: 3,
-      selectId: 3,
+      selectIndex: 1,
+      selectId: 1,
       type: "year",
       chart1List: [],
       chart2List: [],
@@ -400,30 +400,24 @@ export default {
           data.forEach((it) => {
             if (it.warningType == 1) {
               types.push("交通拥堵");
-            }
-            if (it.warningType == 2) {
+            } else if (it.warningType == 2) {
               types.push("行人");
-            }
-            if (it.warningType == 3) {
+            } else if (it.warningType == 3) {
               types.push("非机动车");
-            }
-            if (it.warningType == 4) {
+            } else if (it.warningType == 4) {
               types.push("停车");
-            }
-            if (it.warningType == 5) {
+            } else if (it.warningType == 5) {
               types.push("倒车/逆行");
-            }
-            if (it.warningType == 6) {
+            } else if (it.warningType == 6) {
               types.push("烟火");
-            }
-            if (it.warningType == 7) {
+            } else if (it.warningType == 7) {
               types.push("撒落物");
-            }
-            if (it.warningType == 8) {
+            } else if (it.warningType == 8) {
               types.push("异常天气");
-            }
-            if (it.warningType == 9) {
+            } else if (it.warningType == 9) {
               types.push("护栏碰撞");
+            } else {
+              types.push("其他");
             }
 
             numbers.push({
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventSource/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventSource/assets/charts.js
index 6ea73b0c..7bfe5e2e 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventSource/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventSource/assets/charts.js
@@ -1,25 +1,4 @@
-let data = [
-  {
-    average: 30,
-    name: "视频识别",
-    percent: 0.2,
-  },
-  {
-    average: 25,
-    name: "雷达识别",
-    percent: 0.25,
-  },
-  {
-    average: 15,
-    name: "锥桶",
-    percent: 0.3,
-  },
-  {
-    average: 30,
-    name: "护栏碰撞",
-    percent: 0.25,
-  },
-];
+let data = [];
 
 window.mainData = data;
 
@@ -115,7 +94,7 @@ var options = {
     right: 0,
     orient: "vertical", //改变排列方式
     icon: "circle", //改变legend小图标形状
-    itemGap: 15, // 设置legend的间距
+    itemGap: 10, // 设置legend的间距
     itemWidth: 8, // 设置宽度
     // itemHeight: 15, // 设置高度
 
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventSource/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventSource/index.vue
index 4ec2128f..5de3c418 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventSource/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventSource/index.vue
@@ -86,7 +86,7 @@ export default {
               {
                 average: 0,
                 name: "护栏碰撞",
-                percent: 0.2,
+                percent: 0.1,
               },
               {
                 average: 0,
@@ -98,6 +98,11 @@ export default {
                 name: "非机预警",
                 percent: 0.1,
               },
+              {
+                average: 0,
+                name: "气象监测器",
+                percent: 0.1,
+              },
             ];
             data.forEach((it) => {
               if (it.warningSource == 1) {
@@ -118,6 +123,9 @@ export default {
               if (it.warningSource == 6) {
                 chartData[5].average += it.number;
               }
+              if (it.warningSource == 7) {
+                chartData[6].average += it.number;
+              }
               // total ++;
               // drawRoundRect(context, 231, 37 + (index * 27), 138, 20, 12, gr);
             });
@@ -148,7 +156,7 @@ export default {
               });
             }
             window.mainData = mainData;
-            console.log("mainData", mainData);
+            // console.log("mainData", mainData);
             chartsStatistics.title.text = `{tb|${total}}`;
             chartsStatistics.title.subtext = "{zb|总数}";
 
@@ -208,12 +216,13 @@ export default {
         let gr = context.createLinearGradient(230, 0, 360, 0);
         gr.addColorStop(1, "rgba(92,197,255,0)");
         gr.addColorStop(0, "rgba(92,197,255,0.3)");
-        drawRoundRect(context, 214, 15, 134, 21, 12, gr);
-        drawRoundRect(context, 214, 42, 134, 21, 12, gr);
-        drawRoundRect(context, 214, 69, 134, 21, 12, gr);
-        drawRoundRect(context, 214, 96, 134, 21, 12, gr);
-        drawRoundRect(context, 214, 123, 134, 21, 12, gr);
-        drawRoundRect(context, 214, 150, 134, 21, 12, gr);
+        drawRoundRect(context, 206, 16, 134, 18, 12, gr);
+        drawRoundRect(context, 206, 39, 134, 18, 12, gr);
+        drawRoundRect(context, 206, 61, 134, 18, 12, gr);
+        drawRoundRect(context, 206, 83, 134, 18, 12, gr);
+        drawRoundRect(context, 206, 105, 134, 18, 12, gr);
+        drawRoundRect(context, 206, 127, 134, 18, 12, gr);
+        drawRoundRect(context, 206, 149, 134, 18, 12, gr);
 
         context.lineWidth = 1; // 设置线段宽度
 
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/monthStatistics/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/monthStatistics/index.vue
index 9a758274..ec5c19d6 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/monthStatistics/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/monthStatistics/index.vue
@@ -1,42 +1,44 @@
 <template>
-  <div class='congestion'>
+  <div class="congestion">
     <WgtTitle :title="'近一月感知事件时段分布统计'"></WgtTitle>
     <div class="board">
-      <Empty v-show="!dataList || dataList.length <= 0" text="暂无数据..."></Empty>
-      <div v-show="dataList && dataList.length > 0" style="width: 450px;" class="charts keep-ratio " id="monthStatistics">
-      </div>
+      <Empty
+        v-show="!dataList || dataList.length <= 0"
+        text="暂无数据..."
+      ></Empty>
+      <div
+        v-show="dataList && dataList.length > 0"
+        style="width: 450px"
+        class="charts keep-ratio"
+        id="monthStatistics"
+      ></div>
     </div>
   </div>
 </template>
-  
-<script>
 
-import WgtTitle from '../../../widgets/title'
+<script>
+import WgtTitle from "../../../widgets/title";
 import * as echarts from "echarts";
 import chartsStatistics from "./assets/charts";
-import { getDailyCumulativeMonth } from '../../../../../../../api/event/perceiveEvent';
+import { getDailyCumulativeMonth } from "../../../../../../../api/event/perceiveEvent";
 
 export default {
-  name: 'MonthStatistics',
+  name: "MonthStatistics",
   components: {
-    WgtTitle
+    WgtTitle,
   },
   data() {
     return {
-      dataList: []
-    }
-  },
-
-  created() {
-
+      dataList: [],
+    };
   },
-  methods: {
 
-  },
+  created() {},
+  methods: {},
   mounted() {
     setTimeout(() => {
       this.$nextTick(() => {
-        var myChart = echarts.init(document.getElementById('monthStatistics'));
+        var myChart = echarts.init(document.getElementById("monthStatistics"));
         getDailyCumulativeMonth().then((res) => {
           console.log(res);
           if (res.code == 200) {
@@ -64,31 +66,34 @@ export default {
 
             myChart.setOption(chartsStatistics);
           }
-
         });
       });
     });
   },
-}
+};
 </script>
-  
-<style lang='scss' scoped>
+
+<style lang="scss" scoped>
 .congestion {
   width: 100%;
 
   .board {
     height: 200px;
     width: 100%;
-    padding: 0px 20px;
+    // padding: 0px 20px;
     background: linear-gradient(180deg, rgba(6, 66, 88, 0.2) 0%, #064258 100%);
     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;
-
   }
 }
 
@@ -97,4 +102,3 @@ export default {
   width: 100%;
 }
 </style>
-  
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/railway/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/railway/index.vue
index aac78436..74e7399f 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/railway/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/railway/index.vue
@@ -6,10 +6,16 @@
           <div class="checked">路段车流量Top10</div>
           <div>断面交通量Top10</div>
         </div> -->
-      <Empty v-show="!dataList || dataList.length <= 0" text="暂无数据..."></Empty>
-      <div v-show="dataList && dataList.length > 0" style="width: 450px;" class="charts keep-ratio"
-        id="situationEchartBox"></div>
-
+      <Empty
+        v-show="!dataList || dataList.length <= 0"
+        text="暂无数据..."
+      ></Empty>
+      <div
+        v-show="dataList && dataList.length > 0"
+        style="width: 450px"
+        class="charts keep-ratio"
+        id="situationEchartBox"
+      ></div>
     </div>
   </div>
 </template>
@@ -27,7 +33,7 @@ export default {
   },
   data() {
     return {
-      dataList: []
+      dataList: [],
     };
   },
 
@@ -41,7 +47,7 @@ export default {
         getSectionPerceivedList().then((res) => {
           console.log(res);
           if (res.code == 200) {
-            this.dataList = res.data
+            this.dataList = res.data;
             let data = res.data;
 
             let texts = [];
@@ -60,7 +66,7 @@ export default {
       });
     });
   },
-  created() { },
+  created() {},
   methods: {},
 };
 </script>
@@ -77,9 +83,12 @@ export default {
     border-radius: 5px 5px 5px 5px;
     opacity: 1;
     border: 1px solid;
-    border-image: linear-gradient(360deg,
+    border-image: linear-gradient(
+        360deg,
         rgba(55, 231, 255, 0.3),
-        rgba(55, 231, 255, 0)) 1 1;
+        rgba(55, 231, 255, 0)
+      )
+      1 1;
     display: flex;
     justify-content: flex-start;
     align-items: center;
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/railwayDay/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/railwayDay/assets/charts.js
index 32496833..2de31be1 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/railwayDay/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/railwayDay/assets/charts.js
@@ -58,7 +58,7 @@ var options = {
   grid: {
     top: "15%", //上边距
     right: "0", //右边距
-    left: "0", //左边距
+    left: "10px", //左边距
     bottom: "0%", //下边距
     containLabel: true,
   },
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/railwayDay/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/railwayDay/index.vue
index 02b0c23b..8e043c37 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/railwayDay/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/railwayDay/index.vue
@@ -1,42 +1,44 @@
 <template>
-  <div class='congestion'>
+  <div class="congestion">
     <WgtTitle :title="'路段日感知事件'"></WgtTitle>
     <div class="board">
-      <Empty v-show="!dataList || dataList.length <= 0" text="暂无数据..."></Empty>
-      <div v-show="dataList && dataList.length > 0" style="width: 450px;" class="charts keep-ratio " id="railwayDay">
-      </div>
+      <Empty
+        v-show="!dataList || dataList.length <= 0"
+        text="暂无数据..."
+      ></Empty>
+      <div
+        v-show="dataList && dataList.length > 0"
+        style="width: 450px"
+        class="charts keep-ratio"
+        id="railwayDay"
+      ></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";
-import { getSectionPerceivedNumber } from '../../../../../../../api/event/perceiveEvent';
+import { getSectionPerceivedNumber } from "../../../../../../../api/event/perceiveEvent";
 
 export default {
-  name: 'RailWayDay',
+  name: "RailWayDay",
   components: {
-    WgtTitle
+    WgtTitle,
   },
   data() {
     return {
-      dataList: []
-    }
+      dataList: [],
+    };
   },
 
-  created() {
-
-  },
-  methods: {
-
-  },
+  created() {},
+  methods: {},
   mounted() {
     setTimeout(() => {
       this.$nextTick(() => {
-        var myChart = echarts.init(document.getElementById('railwayDay'));
+        var myChart = echarts.init(document.getElementById("railwayDay"));
         getSectionPerceivedNumber().then((res) => {
           if (res.code == 200) {
             this.dataList = res.data;
@@ -44,9 +46,11 @@ export default {
             if (data.length > 0) {
               let texts = [];
               let datas = [];
-              const maxObject = data.reduce((prev, current) => (current.number > prev.number ? current : prev));
+              const maxObject = data.reduce((prev, current) =>
+                current.number > prev.number ? current : prev
+              );
 
-              data.forEach(it => {
+              data.forEach((it) => {
                 texts.push(it.sectionName);
 
                 if (it.number == maxObject.number) {
@@ -54,62 +58,69 @@ export default {
                     value: it.number,
                     itemStyle: {
                       color: {
-                        type: 'linear',
+                        type: "linear",
                         x: 0,
                         y: 0,
                         x2: 0,
                         y2: 1,
-                        colorStops: [{
-                          offset: 0, color: '#0469FF' // 0% 处的颜色
-                        }, {
-                          offset: 1, color: '#699CFF' // 100% 处的颜色
-                        }],
-                        global: false // 缺省为 false
+                        colorStops: [
+                          {
+                            offset: 0,
+                            color: "#0469FF", // 0% 处的颜色
+                          },
+                          {
+                            offset: 1,
+                            color: "#699CFF", // 100% 处的颜色
+                          },
+                        ],
+                        global: false, // 缺省为 false
                       },
-                      borderRadius: 6
+                      borderRadius: 6,
                     },
                   });
                 } else {
                   datas.push({
                     value: it.number,
                     itemStyle: {
-                      borderRadius: 6
+                      borderRadius: 6,
                     },
                   });
                 }
-
               });
 
               chartsStatistics.xAxis.data = texts;
               chartsStatistics.series[0].data = datas;
             }
             myChart.setOption(chartsStatistics);
-
           }
-        })
+        });
       });
     });
   },
-}
+};
 </script>
 
-<style lang='scss' scoped>
+<style lang="scss" scoped>
 .congestion {
   width: 100%;
 
   .board {
     height: 200px;
     width: 100%;
-    padding: 0px 20px;
+    // padding: 0px 20px;
     background: linear-gradient(180deg, rgba(6, 66, 88, 0.2) 0%, #064258 100%);
     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;
-
   }
 }
 
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/typeAnalysis/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/typeAnalysis/assets/charts.js
index 7fe27863..95cb7750 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/typeAnalysis/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/typeAnalysis/assets/charts.js
@@ -21,6 +21,8 @@ window.colorList1 = ["#61D8FF", "#FFB905", "#6AE0BC"];
 var options = {
   color: colorList,
   legend: {
+    width: "500px",
+    height: "160px",
     orient: "vertical",
     top: "10",
     icon: "circle",
@@ -54,17 +56,25 @@ var options = {
     },
     formatter: (params) => {
       let count = 0;
+      console.log("typeAnalysisData", typeAnalysisData);
       typeAnalysisData.forEach((it) => {
         count += it.value;
       });
+      console.log("count", count);
       let obj = typeAnalysisData.filter((it) => {
         return it.name == params;
       });
-      // console.log(obj);
       return `{ast|${obj[0].name}}    {bst|${
         Math.round((obj[0].value / count) * 100) || 0
       }%} {cst|${obj[0].value}起}`;
     },
+    pageIconColor: "#fff",
+    pageIconSize: 10,
+    pageTextStyle: {
+      color: "#fff",
+    },
+    type: "scroll",
+    pageButtonPosition: "end",
     // data: typeAnalysisData?.map(x => x.name),
   },
   tooltip: {
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/typeAnalysis/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/typeAnalysis/index.vue
index a31445f2..206fcb26 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/typeAnalysis/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/typeAnalysis/index.vue
@@ -1,179 +1,193 @@
 <template>
-  <div class='congestion'>
+  <div class="congestion">
     <WgtTitle :title="'感知事件类型分析'"></WgtTitle>
     <div class="board">
-      <div class="charts keep-ratio " id="typeAnalysis"></div>
+      <div class="charts keep-ratio" id="typeAnalysis"></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";
-import { getWarningTypeDay } from '../../../../../../../api/event/perceiveEvent';
-
+import { getWarningTypeDay } from "../../../../../../../api/event/perceiveEvent";
 
 const drawRoundRect = (ctx, x, y, width, height, radius, gr) => {
-  // ctx, 矩形距离x坐标位置, 矩形距离y坐标的位置, 矩形的宽, 矩形的长,圆角角度 
+  // ctx, 矩形距离x坐标位置, 矩形距离y坐标的位置, 矩形的宽, 矩形的长,圆角角度
   ctx.beginPath();
   ctx.fillStyle = gr;
-  ctx.arc(x + radius, y + radius, radius, Math.PI, Math.PI * 3 / 2);
+  ctx.arc(x + radius, y + radius, radius, Math.PI, (Math.PI * 3) / 2);
   ctx.lineTo(width - radius + x, y);
-  ctx.arc(width - radius + x, radius + y, radius, Math.PI * 3 / 2, Math.PI * 2);
+  ctx.arc(
+    width - radius + x,
+    radius + y,
+    radius,
+    (Math.PI * 3) / 2,
+    Math.PI * 2
+  );
   ctx.lineTo(width + x, height + y - radius);
-  ctx.arc(width - radius + x, height - radius + y, radius, 0, Math.PI * 1 / 2);
+  ctx.arc(
+    width - radius + x,
+    height - radius + y,
+    radius,
+    0,
+    (Math.PI * 1) / 2
+  );
   ctx.lineTo(radius + x, height + y);
-  ctx.arc(radius + x, height - radius + y, radius, Math.PI * 1 / 2, Math.PI);
+  ctx.arc(radius + x, height - radius + y, radius, (Math.PI * 1) / 2, Math.PI);
   ctx.closePath();
   //ctx.stroke();
-  ctx.fill()
-}
-
+  ctx.fill();
+};
 
 export default {
-  name: 'TypeAnalysis',
+  name: "TypeAnalysis",
   components: {
-    WgtTitle
+    WgtTitle,
   },
   data() {
-    return {
-
-    }
-  },
-  created() {
-
-  },
-  methods: {
-
+    return {};
   },
+  created() {},
+  methods: {},
   mounted() {
     setTimeout(() => {
       this.$nextTick(() => {
-        var myChart = echarts.init(document.getElementById('typeAnalysis'));
+        var myChart = echarts.init(document.getElementById("typeAnalysis"));
 
-
-        getWarningTypeDay().then(res => {
+        getWarningTypeDay().then((res) => {
           console.log(res);
           if (res.code == 200) {
             let data = res.data;
-            console.log("===================", data);
-            typeAnalysisData = [];
-            for (var i = 0; i < data.length; i++) {
-              var it = data[i];
-              if (it.warningType == 1) {
-                typeAnalysisData.push({
-                  name: '交通拥堵',
-                  value: it.number
-                });
-              }
-              if (it.warningType == 2) {
-                typeAnalysisData.push({
-                  name: '行人',
-                  value: it.number
-                });
-              }
-              if (it.warningType == 3) {
-                typeAnalysisData.push({
-                  name: '非机动车',
-                  value: it.number
-                });
-              }
-              if (it.warningType == 4) {
-                typeAnalysisData.push({
-                  name: '停车',
-                  value: it.number
-                });
-              }
-              if (it.warningType == 5) {
-                typeAnalysisData.push({
-                  name: '倒车/逆行',
-                  value: it.number
-                });
-              }
-              if (it.warningType == 6) {
-                typeAnalysisData.push({
-                  name: '烟火',
-                  value: it.number
-                });
-              }
-              if (it.warningType == 7) {
-                typeAnalysisData.push({
-                  name: '撒落物',
-                  value: it.number
-                });
-              }
-              if (it.warningType == 8) {
-                typeAnalysisData.push({
-                  name: '异常天气',
-                  value: it.number
-                });
-              }
-              if (it.warningType == 9) {
-                typeAnalysisData.push({
-                  name: '护栏碰撞',
-                  value: it.number
-                });
-              }
-
-              drawRoundRect(context, 250, 8 + i * 28, 120, 24, 12, gr)
-            }
-
-            chartsStatistics.legend.data = typeAnalysisData?.map(x => x.name);
-            chartsStatistics.series[0].data = typeAnalysisData.map((item, index) => {
-              return {
-                ...item,
-                label: {
-                  color: colorList[index]
+            console.log("===================22", data);
+            typeAnalysisData = [
+              {
+                name: "交通拥堵",
+                warningType: 1,
+                value: 0,
+              },
+              {
+                name: "行人",
+                warningType: 1,
+                value: 0,
+              },
+              {
+                name: "非机动车",
+                warningType: 3,
+                value: 0,
+              },
+              {
+                name: "停车",
+                warningType: 4,
+                value: 0,
+              },
+              {
+                name: "倒车/逆行",
+                warningType: 5,
+                value: 0,
+              },
+              {
+                name: "烟火",
+                warningType: 6,
+                value: 0,
+              },
+              {
+                name: "撒落物",
+                warningType: 7,
+                value: 0,
+              },
+              {
+                name: "异常天气",
+                warningType: 8,
+                value: 0,
+              },
+              {
+                name: "护栏碰撞",
+                warningType: 9,
+                value: 0,
+              },
+              {
+                name: "交通事故",
+                warningType: 10,
+                value: 0,
+              },
+              {
+                name: "车辆故障",
+                warningType: 11,
+                value: 0,
+              },
+              {
+                name: "其他",
+                warningType: 99,
+                value: 0,
+              },
+            ];
+            data.forEach((item, index) => {
+              typeAnalysisData.forEach((r) => {
+                if (item.warningType == r.warningType) {
+                  r.value += item.number;
                 }
+              });
+              // drawRoundRect(context, 250, 8 + index * 28, 120, 24, 12, gr);
+            });
+
+            chartsStatistics.legend.data = typeAnalysisData?.map((x) => x.name);
+            chartsStatistics.series[0].data = typeAnalysisData.map(
+              (item, index) => {
+                return {
+                  ...item,
+                  label: {
+                    color: colorList[index],
+                  },
+                };
               }
-            })
-            chartsStatistics.series[1].data = typeAnalysisData.map((item, index) => {
-              return {
-                ...item,
-                label: {
-                  color: colorList[index]
-                }
+            );
+            chartsStatistics.series[1].data = typeAnalysisData.map(
+              (item, index) => {
+                return {
+                  ...item,
+                  label: {
+                    color: colorList[index],
+                  },
+                };
               }
-            })
+            );
           }
 
           myChart.setOption(chartsStatistics);
-        })
+        });
 
         const domMap = document.getElementById("typeAnalysis");
         let parentDiv = domMap.firstChild;
         // 创建canvas
-        let canvas = document.createElement('canvas');
+        let canvas = document.createElement("canvas");
         canvas.width = parentDiv.offsetWidth;
         canvas.height = parentDiv.offsetHeight;
         parentDiv.appendChild(canvas);
-        const context = canvas.getContext('2d');
+        const context = canvas.getContext("2d");
 
         // 填充渐变颜色
         var gr = context.createLinearGradient(230, 0, 360, 0);
         // 颜色断点
-        gr.addColorStop(1, 'rgba(92,197,255,0)');
-        gr.addColorStop(0, 'rgba(92,197,255,0.5)');
-
+        gr.addColorStop(1, "rgba(92,197,255,0)");
+        gr.addColorStop(0, "rgba(92,197,255,0.5)");
 
         context.lineWidth = 1; // 设置线段宽度
 
         // 绘制圆角矩形
-
-        // drawRoundRect(context, 260, 36, 120, 24, 12,gr)
-        // drawRoundRect(context, 260, 64, 120, 24, 12,gr)
-        // drawRoundRect(context, 260, 92, 120, 24, 12,gr)
-        // drawRoundRect(context, 260, 120, 120, 24, 12,gr)
-        // drawRoundRect(context, 260, 148, 120, 24, 12,gr)
+        drawRoundRect(context, 260, 6, 120, 24, 12, gr);
+        drawRoundRect(context, 260, 36, 120, 24, 12, gr);
+        drawRoundRect(context, 260, 64, 120, 24, 12, gr);
+        drawRoundRect(context, 260, 92, 120, 24, 12, gr);
+        drawRoundRect(context, 260, 120, 120, 24, 12, gr);
       });
     });
   },
-}
+};
 </script>
-  
-<style lang='scss' scoped>
+
+<style lang="scss" scoped>
 .congestion {
   width: 100%;
 
@@ -181,15 +195,23 @@ export default {
     height: 200px;
     width: 100%;
     padding: 0px 20px;
-    background: linear-gradient(180deg, rgba(6, 66, 88, 0.2) 0%, #06425888 100%);
+    background: linear-gradient(
+      180deg,
+      rgba(6, 66, 88, 0.2) 0%,
+      #06425888 100%
+    );
     border-radius: 5px 5px 5px 5px;
     opacity: 1;
     border: 1px solid;
-    border-image: linear-gradient(360deg, rgba(55, 231, 255, 0.1), rgba(55, 231, 255, 0)) 1 1;
+    border-image: linear-gradient(
+        360deg,
+        rgba(55, 231, 255, 0.1),
+        rgba(55, 231, 255, 0)
+      )
+      1 1;
     display: flex;
     justify-content: space-between;
     align-items: center;
-
   }
 }
 
@@ -198,4 +220,3 @@ export default {
   width: 100%;
 }
 </style>
-  
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/index.vue
index c4379cb6..4cd1a98d 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class='TrafficFlow'>
+  <div class="TrafficFlow">
     <section class="content">
       <Railway class="content-l" />
       <div class="content-m">
@@ -10,7 +10,7 @@
         <EventSource class="content-m-t" />
         <DailyDisposal class="content-m-t" />
       </div>
-      <div class="content-m" style="margin-right: 0;">
+      <div class="content-m" style="margin-right: 0">
         <MonthStatistice class="content-m-t" />
         <TypeAnalysis class="content-m-t" />
       </div>
@@ -20,19 +20,19 @@
     </section>
   </div>
 </template>
-  
+
 <script>
-import Railway from './components/railway/index.vue';
-import RailWayDay from './components/railwayDay/index.vue';
-import DayTotal from './components/dayTotal/index.vue';
-import EventSource from './components/eventSource/index.vue';
-import DailyDisposal from './components/dailyDisposal/index.vue';
-import TypeAnalysis from './components/typeAnalysis';
-import MonthStatistice from './components/monthStatistics/index.vue';
-import EventQuery from './components/eventQuery';
+import Railway from "./components/railway/index.vue";
+import RailWayDay from "./components/railwayDay/index.vue";
+import DayTotal from "./components/dayTotal/index.vue";
+import EventSource from "./components/eventSource/index.vue";
+import DailyDisposal from "./components/dailyDisposal/index.vue";
+import TypeAnalysis from "./components/typeAnalysis";
+import MonthStatistice from "./components/monthStatistics/index.vue";
+import EventQuery from "./components/eventQuery";
 
 export default {
-  name: 'EventDetection',
+  name: "EventDetection",
   components: {
     Railway,
     RailWayDay,
@@ -42,11 +42,11 @@ export default {
     TypeAnalysis,
     MonthStatistice,
     EventQuery,
-  }
-}
+  },
+};
 </script>
-  
-<style lang='scss' scoped>
+
+<style lang="scss" scoped>
 .TrafficFlow {
   width: 100%;
   height: 100%;
@@ -68,7 +68,7 @@ export default {
     pointer-events: none;
     margin-top: 19px;
 
-    >div {
+    > div {
       pointer-events: auto;
     }
 
@@ -76,10 +76,8 @@ export default {
       width: calc(100% / 4 - 25px * 3);
       min-width: 475px;
       margin-right: 15px;
-
     }
 
-
     .content-m {
       display: inline-flex;
       flex-direction: column;
@@ -107,13 +105,12 @@ export default {
     pointer-events: none;
     margin-top: 0px;
 
-    >div {
+    > div {
       pointer-events: auto;
     }
 
     .foot-w {
       width: 100%;
-
     }
 
     .foot-l {
@@ -130,4 +127,3 @@ export default {
   }
 }
 </style>
-  
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/classification/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/classification/assets/charts.js
index 0c5d9bd3..fd3edf39 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/classification/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/classification/assets/charts.js
@@ -189,7 +189,7 @@ var options = {
       itemStyle: {
         normal: {
           borderRadius: "5",
-          borderWidth: 2,
+          borderWidth: 4,
           borderType: "solid",
           borderCap: "round",
           borderJoin: "round",
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/congestion/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/congestion/assets/charts.js
index 46e65aa3..213ed6ef 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/congestion/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/congestion/assets/charts.js
@@ -55,6 +55,10 @@ nameList.map((item, index) => {
 });
 
 var options = {
+  tooltip: {
+    show: true,
+    trigger: "axis",
+  },
   grid: {
     top: "5%", //上边距
     right: "20px", //右边距
@@ -157,6 +161,9 @@ var options = {
           borderRadius: 6,
         },
       },
+      tooltip: {
+        show: false,
+      },
     },
   ],
 };
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/flowstate/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/flowstate/assets/charts.js
index a2ed2068..a6743533 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/flowstate/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/flowstate/assets/charts.js
@@ -1,5 +1,9 @@
 import * as echarts from "echarts";
 var options = {
+  tooltip: {
+    show: true,
+    trigger: "axis",
+  },
   axisPointer: {
     link: [
       {
@@ -127,7 +131,7 @@ var options = {
   ],
   series: [
     {
-      name: "Evaporation",
+      name: "",
       type: "line",
       symbolSize: 0,
       lineStyle: {
@@ -160,7 +164,7 @@ var options = {
       ],
     },
     {
-      name: "Rainfall",
+      name: "",
       type: "line",
       symbol: "circle",
       symbolSize: 0,
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorQuery/data.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorQuery/data.js
new file mode 100644
index 00000000..ceb40be9
--- /dev/null
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorQuery/data.js
@@ -0,0 +1,43 @@
+export const searchFormList = [
+  {
+    label: "路段名称:",
+    key: "ld",
+    // required: true,
+    type: "select",
+    options: {
+      options: [],
+    },
+  },
+  {
+    label: "指标名称:",
+    key: "type",
+    // required: true,
+    type: "select",
+    options: {
+      options: [
+        {
+          value: "1",
+          label: "拥挤度",
+        },
+        {
+          value: "2",
+          label: "饱和度",
+        },
+        {
+          value: "3",
+          label: "交通组成特征指数",
+        },
+      ],
+    },
+  },
+  {
+    label: "时间范围:",
+    key: "time",
+    // required: true,
+    type: "datePicker",
+    options: {
+      format: "yyyy-MM-dd",
+      type: "daterange",
+    },
+  },
+];
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorQuery/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorQuery/index.vue
index b974fb6f..e365ea3e 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorQuery/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorQuery/index.vue
@@ -1,12 +1,19 @@
 <template>
   <div class='congestion'>
     <div class="buttonbar">
-      <div class="button">
-        <i class="el-icon-refresh-right"></i>刷新
-      </div>
-      <div class="button">
-        <i class="el-icon-upload2"></i>导出Excal
-      </div>
+      <ButtonGradient class="button">
+        <template #prefix>
+          <i class="el-icon-refresh-right"></i>
+        </template>
+        刷新
+      </ButtonGradient>
+      <ButtonGradient class="button">
+        <template #prefix>
+          <i class="el-icon-upload2"></i>
+        </template>
+        导出
+      </ButtonGradient>
+      <InputSearch style="width: 402px;margin-left: 1300px;" :formList="formList" @handleSearch="handleSearch" />
     </div>
     <div class="board">
 
@@ -26,15 +33,29 @@
         </el-table>
       </div>
     </div>
+    <!-- 分页 -->
+    <div class="footer">
+      <Pagination @current-change="getData" @size-change="onSizeChange" width="'100%'" :page-sizes="[10, 20, 30, 40, 50]"
+        :page-size="pageSize" :current-page.sync="pageNum" layout="total, sizes, prev, pager, next" :total="50">
+      </Pagination>
+    </div>
   </div>
 </template>
   
 <script>
+import Pagination from "@screen/components/Pagination.vue";
+import ButtonGradient from "@screen/components/Buttons/ButtonGradient.vue";
+import InputSearch from "@screen/components/InputSearch/index.vue";
+import request from "@/utils/request";
+import { Message } from "element-ui";
+import { searchFormList } from './data.js'
 
 export default {
   name: 'IndicatorQuery',
   components: {
-
+    Pagination,
+    ButtonGradient,
+    InputSearch
   },
   data() {
     return {
@@ -199,17 +220,46 @@ export default {
         name: '2640.78m',
         address: 'K100+000-K110+000'
       },
-      ]
+      ],
+      formList: [],
+      pageSize: 10,
+      pageNum: 1
     }
   },
-
   created() {
-
+    // this.formList = searchFormList;
+    this.queryLdAll();
   },
   methods: {
     selectItem(index) {
       this.selectIndex = index;
     },
+    getData() {
+
+    },
+    onSizeChange() {
+
+    },
+    handleSearch() {
+
+    },
+    queryLdAll() {
+      request({
+        url: `/business/roadSection/listAll`,
+        method: "get",
+      }).then((result) => {
+        if (result.code != 200) return Message.error(result?.msg);
+        let lds = [];
+        result.data.forEach(it => {
+          lds.push({
+            value: it.id,
+            label: it.sectionName
+          })
+        })
+        searchFormList[0].options.options = lds;
+        this.formList = searchFormList;
+      });
+    }
   },
   mounted() {
 
@@ -303,7 +353,7 @@ export default {
   }
 
   .board {
-    height: 880px;
+    height: 829px;
     width: 100%;
     padding: 0px 0px;
     border-radius: 5px 5px 5px 5px;
@@ -313,7 +363,7 @@ export default {
     align-items: center;
     flex-direction: column;
     margin-top: 20px;
-
+    overflow-y: auto;
 
 
     .warningList {
@@ -496,6 +546,14 @@ export default {
     }
 
   }
+
+  .footer {
+    margin-top: 15px;
+    height: 36px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
 }
 
 .charts {
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/auditAnalytics/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/auditAnalytics/assets/charts.js
index 8d1412fa..5f088a5c 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/auditAnalytics/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/auditAnalytics/assets/charts.js
@@ -1,391 +1,399 @@
 var res = [
-   { value: 50, name: '情报板发布' },
-   { value: 1, name: '' },
-   { value: 20, name: '微博发布' },
-   { value: 1, name: '' },
-   { value: 30, name: '服务网站' },
-   { value: 1, name: '' },
-  ];
- //  var res = this.evaluatedCountList;
-  var data1 = [], data2 = [], data3 = [], legendData = [];
-  var curIndex = 0;
-  var index = 0;
-  let angle = 0; //角度，用来做简单的动画效果的
+  { value: 50, name: "情报板发布" },
+  { value: 20, name: "微博发布" },
+  { value: 30, name: "服务网站" },
+];
+//  var res = this.evaluatedCountList;
+var data1 = [],
+  data2 = [],
+  data3 = [],
+  legendData = [];
+var curIndex = 0;
+var index = 0;
+let angle = 0; //角度，用来做简单的动画效果的
 
-  for (var i = 0; i < res.length; i++) {
+for (var i = 0; i < res.length; i++) {
+  data1.push({
+    value: res[i].value,
+    name: res[i].name,
+  });
+  data2.push({
+    value: res[i].value,
+    name: res[i].name,
+    itemStyle: {
+      opacity: 0.4,
+    },
+  });
 
-    data1.push({
-      value: res[i].value,
-      name: res[i].name,
-    })
-    data2.push({
-      value: res[i].value,
-      name: res[i].name,
-      itemStyle: {
-        opacity: 0.4,
-      },
-    })
+  data3.push({
+    value: res[i].value,
+    name: res[i].name,
+    itemStyle: {
+      opacity: 0.1,
+    },
+  });
+  if (res[i].name != "") legendData.push(res[i].name);
+}
 
-    data3.push({
-      value: res[i].value,
-      name: res[i].name,
-      itemStyle: {
-        opacity: 0.1,
+var options = {
+  color: ["#5CC5FF", "#54EFD5", "#FD9666", "#5C8CFE", "#51D5AD"],
+  title: [
+    {
+      text: "999",
+      top: "27%",
+      textAlign: "center",
+      left: "49%",
+      textStyle: {
+        color: "#ffffff",
+        fontSize: 30,
+        fontFamily: "PangMenZhengDao",
       },
-    })
-    if ( res[i].name != "" )
-    legendData.push(res[i].name);
-  }
-
- var  options = {
-    color: ['#5CC5FF', 'transparent', '#54EFD5', 'transparent', '#FD9666', 'transparent', '#5C8CFE', 'transparent', '#51D5AD', 'transparent'],
-    title: [
-      {
-        text:'999',
-        top: '27%',
-        textAlign: 'center',
-        left: '49%',
-        textStyle: {
-          color: '#ffffff',
-          fontSize: 30,
-          fontFamily: 'PangMenZhengDao',
-        },
+    },
+    {
+      text: "总数",
+      top: "38%",
+      textAlign: "center",
+      left: "49%",
+      textStyle: {
+        color: "rgba(242, 252, 253, 0.84)",
+        fontSize: 14,
+        fontWeight: 400,
       },
-      {
-        text: '总数',
-        top: '38%',
-        textAlign: 'center',
-        left: '49%',
-        textStyle: {
-          color: 'rgba(242, 252, 253, 0.84)',
+    },
+  ],
+  grid: {
+    top: "3%",
+    left: "6%",
+    right: "6%",
+    bottom: "3%",
+    containLabel: true,
+  },
+  tooltip: {
+    trigger: "item",
+    // formatter: '{b} : {c}:{d}'
+  },
+  legend: {
+    orient: "vertical",
+    height: "80px",
+    // left: "10%",
+    top: "68%",
+    itemWidth: 10,
+    itemHeight: 10,
+    icon: "circle",
+    textStyle: {
+      color: "#ffffff",
+      fontSize: 14,
+      lineHeight: 22,
+      rich: {
+        text: {
+          width: 80,
+          marginLeft: 32,
+          fontSize: 14,
+        },
+        number: {
+          fontSize: 14,
+          color: "#37E7FF",
+          marginLeft: 32,
+          fontWeight: "bold",
+        },
+        unit: {
           fontSize: 14,
-          fontWeight: 400,
         },
       },
-    ],
-    grid: {
-      top: '3%',
-      left: '6%',
-      right: '6%',
-      bottom: '3%',
-      containLabel: true
     },
-    tooltip: {
-      trigger: 'item',
-      formatter: '{b} : {c}:{d}'
-    },
-    legend: {
-      orient: '',
-      left: '10%',
-      top: '68%',
-      itemWidth: 10,
-      itemHeight: 10,
-      icon:"circle",
-      textStyle: {
-        color: "#ffffff",
-        fontSize: 14,
-        lineHeight: 22,
-        rich: {
-          text: {
-            marginLeft:32,
-            fontSize: 14,
-          },
-          number: {
-            fontSize: 14,
-            color: "#37E7FF",
-            marginLeft:32,
-            fontWeight: 'bold'
-          },
-          unit: {
-            fontSize: 14,
-          }
+    data: legendData,
+    formatter(name) {
+      if (name == "") return "";
+      const newData = res;
+      let tarValue = 0;
+      let total = 0;
+      for (let i = 0; i < newData.length; i++) {
+        total += newData[i].value;
+        if (newData[i].name === name) {
+          tarValue = newData[i].value;
         }
-      },
-      data: legendData,
-      formatter(name) {
-        if ( name == "" ) return ""; 
-        const newData = res;
-        let tarValue = 0;
-        let total = 0;
-        for (let i = 0; i < newData.length; i++) {
-          total += newData[i].value;
-          if (newData[i].name === name) {
-            tarValue = newData[i].value;
-          }
-        }
-        var percert = total == 0 ? 0 : ((tarValue / total) * 100).toFixed(2);
-        const arr = name + '  ' + tarValue;
-        return `{text|${name}} {number|${percert}%}`;;
-      },
+      }
+      var percert = total == 0 ? 0 : ((tarValue / total) * 100).toFixed(2);
+      const arr = name + "  " + tarValue;
+      return `{text|${name}} {number|${percert}%}`;
+    },
+    pageIconColor: "#fff",
+    pageIconSize: 10,
+    pageTextStyle: {
+      color: "#fff",
     },
-    series: [
-              /** 饼图上刻度 */
+    type: "scroll",
+    pageButtonPosition: "end",
+  },
+  series: [
+    /** 饼图上刻度 */
     {
-      type: 'gauge',
-      center: ['50%', '35%'],
-      radius: '40%', // 错位调整此处
+      type: "gauge",
+      center: ["50%", "35%"],
+      radius: "40%", // 错位调整此处
       startAngle: 0,
       endAngle: 360,
       splitNumber: 52,
       axisLine: { show: false },
-      splitLine: { 
+      splitLine: {
         // length: 39,
-        length: '2',
+        length: "2",
         lineStyle: {
           width: 5,
-          color: '#5CC5FF'
-        }
+          color: "#5CC5FF",
+        },
       },
       axisTick: { show: false },
-      axisLabel: { show: false }
+      axisLabel: { show: false },
     },
-        /** 绘制外部圆弧-2-开始圆点 <left-top> */
+    /** 绘制外部圆弧-2-开始圆点 <left-top> */
     {
-      type: 'custom',
-      coordinateSystem: 'none',
+      type: "custom",
+      coordinateSystem: "none",
       renderItem: (params, api) => {
         let x0 = api.getWidth() / 2;
         let y0 = api.getHeight() / 2 - 59;
-        let r = Math.min(api.getWidth(), api.getHeight()) / 2 * 0.50;
+        let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.5;
         return {
-          type: 'circle',
+          type: "circle",
           shape: {
             /** 角度175° 外弧2开始角度 */
-            cx: x0 + r * Math.cos((350 + -angle) * Math.PI / 180),
-            cy: y0 + r * Math.sin((350 + -angle) * Math.PI / 180),
-            r: 4
+            cx: x0 + r * Math.cos(((350 + -angle) * Math.PI) / 180),
+            cy: y0 + r * Math.sin(((350 + -angle) * Math.PI) / 180),
+            r: 4,
           },
           style: {
-            fill: '#5BC4FF',
-            stroke: '#5BC4FF'
+            fill: "#5BC4FF",
+            stroke: "#5BC4FF",
           },
-          silent: true
-        }
+          silent: true,
+        };
       },
-      data: [0]
+      data: [0],
     },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          return {
-            type: 'arc',
-            shape: {
-              cx: api.getWidth() / 2,
-              cy: api.getHeight() / 2 - 59,
-              r: Math.min(api.getWidth(), api.getHeight()) / 2 * 0.50,
-              startAngle: (350 + -angle) * Math.PI / 180,
-              endAngle: (120 + -angle) * Math.PI / 180
-            },
-            style: {
-              fill: 'transparent',
-              stroke: '#5BC4FF66',
-              lineWidth: 2.6
-            },
-            silent: true
-          }
-        },
-        data: [0]
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        return {
+          type: "arc",
+          shape: {
+            cx: api.getWidth() / 2,
+            cy: api.getHeight() / 2 - 59,
+            r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.5,
+            startAngle: ((350 + -angle) * Math.PI) / 180,
+            endAngle: ((120 + -angle) * Math.PI) / 180,
+          },
+          style: {
+            fill: "transparent",
+            stroke: "#5BC4FF66",
+            lineWidth: 2.6,
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          let x0 = api.getWidth() / 2;
-          let y0 = api.getHeight() / 2 - 59;
-          let r = Math.min(api.getWidth(), api.getHeight()) / 2 * 0.50;
-          return {
-            type: 'circle',
-            shape: {
-              /** 角度175° 外弧2开始角度 */
-              cx: x0 + r * Math.cos((150 + -angle) * Math.PI / 180),
-              cy: y0 + r * Math.sin((150 + -angle) * Math.PI / 180),
-              r: 4
-            },
-            style: {
-              fill: '#5BC4FF',
-              stroke: '#5BC4FF'
-            },
-            silent: true
-          }
-        },
-        data: [0]
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        let x0 = api.getWidth() / 2;
+        let y0 = api.getHeight() / 2 - 59;
+        let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.5;
+        return {
+          type: "circle",
+          shape: {
+            /** 角度175° 外弧2开始角度 */
+            cx: x0 + r * Math.cos(((150 + -angle) * Math.PI) / 180),
+            cy: y0 + r * Math.sin(((150 + -angle) * Math.PI) / 180),
+            r: 4,
+          },
+          style: {
+            fill: "#5BC4FF",
+            stroke: "#5BC4FF",
+          },
+          silent: true,
+        };
       },
-        {
-          type: 'custom',
-          coordinateSystem: 'none',
-          renderItem: (params, api) => {
-            return {
-              type: 'arc',
-              shape: {
-                cx: api.getWidth() / 2,
-                cy: api.getHeight() / 2 - 59,
-                r: Math.min(api.getWidth(), api.getHeight()) / 2 * 0.50,
-                startAngle: (150 + -angle) * Math.PI / 180,
-                endAngle: (-30 + -angle) * Math.PI / 180
-              },
-              style: {
-                fill: 'transparent',
-                stroke: '#5BC4FF66',
-                lineWidth: 2.6
-              },
-              silent: true
-            }
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        return {
+          type: "arc",
+          shape: {
+            cx: api.getWidth() / 2,
+            cy: api.getHeight() / 2 - 59,
+            r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.5,
+            startAngle: ((150 + -angle) * Math.PI) / 180,
+            endAngle: ((-30 + -angle) * Math.PI) / 180,
           },
-          data: [0]
-        },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          let x0 = api.getWidth() / 2;
-          let y0 = api.getHeight() / 2 - 59;
-          let r = Math.min(api.getWidth(), api.getHeight()) / 2 * 0.56;
-          return {
-            type: 'circle',
-            shape: {
-              /** 角度175° 外弧2开始角度 */
-              cx: x0 + r * Math.cos((590 + -angle) * Math.PI / 180),
-              cy: y0 + r * Math.sin((590 + -angle) * Math.PI / 180),
-              r: 4
-            },
-            style: {
-              fill: '#5BC4FF',
-              stroke: '#5BC4FF'
-            },
-            silent: true
-          }
-        },
-        data: [0]
+          style: {
+            fill: "transparent",
+            stroke: "#5BC4FF66",
+            lineWidth: 2.6,
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          return {
-            type: 'arc',
-            shape: {
-              cx: api.getWidth() / 2,
-              cy: api.getHeight() / 2 - 59,
-              r: Math.min(api.getWidth(), api.getHeight()) / 2 * 0.56,
-              startAngle: (590 + -angle) * Math.PI / 180,
-              endAngle: (350 + -angle) * Math.PI / 180
-            },
-            style: {
-              fill: 'transparent',
-              stroke: '#5BC4FF66',
-              lineWidth: 2.6
-            },
-            silent: true
-          }
-        },
-        data: [0]
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        let x0 = api.getWidth() / 2;
+        let y0 = api.getHeight() / 2 - 59;
+        let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.56;
+        return {
+          type: "circle",
+          shape: {
+            /** 角度175° 外弧2开始角度 */
+            cx: x0 + r * Math.cos(((590 + -angle) * Math.PI) / 180),
+            cy: y0 + r * Math.sin(((590 + -angle) * Math.PI) / 180),
+            r: 4,
+          },
+          style: {
+            fill: "#5BC4FF",
+            stroke: "#5BC4FF",
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          let x0 = api.getWidth() / 2;
-          let y0 = api.getHeight() / 2 - 59;
-          let r = Math.min(api.getWidth(), api.getHeight()) / 2 * 0.56;
-          return {
-            type: 'circle',
-            shape: {
-              /** 角度175° 外弧2开始角度 */
-              cx: x0 + r * Math.cos((90 + -angle) * Math.PI / 180),
-              cy: y0 + r * Math.sin((90 + -angle) * Math.PI / 180),
-              r: 4
-            },
-            style: {
-              fill: '#5BC4FF',
-              stroke: '#5BC4FF'
-            },
-            silent: true
-          }
-        },
-        data: [0]
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        return {
+          type: "arc",
+          shape: {
+            cx: api.getWidth() / 2,
+            cy: api.getHeight() / 2 - 59,
+            r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.56,
+            startAngle: ((590 + -angle) * Math.PI) / 180,
+            endAngle: ((350 + -angle) * Math.PI) / 180,
+          },
+          style: {
+            fill: "transparent",
+            stroke: "#5BC4FF66",
+            lineWidth: 2.6,
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          return {
-            type: 'arc',
-            shape: {
-              cx: api.getWidth() / 2,
-              cy: api.getHeight() / 2 - 59,
-              r: Math.min(api.getWidth(), api.getHeight()) / 2 * 0.56,
-              startAngle: (90 + -angle) * Math.PI / 180,
-              endAngle: (160 + -angle) * Math.PI / 180
-            },
-            style: {
-              fill: 'transparent',
-              stroke: '#5BC4FF66',
-              lineWidth: 2.6
-            },
-            silent: true
-          }
-        },
-        data: [0]
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        let x0 = api.getWidth() / 2;
+        let y0 = api.getHeight() / 2 - 59;
+        let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.56;
+        return {
+          type: "circle",
+          shape: {
+            /** 角度175° 外弧2开始角度 */
+            cx: x0 + r * Math.cos(((90 + -angle) * Math.PI) / 180),
+            cy: y0 + r * Math.sin(((90 + -angle) * Math.PI) / 180),
+            r: 4,
+          },
+          style: {
+            fill: "#5BC4FF",
+            stroke: "#5BC4FF",
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'pie',
-        radius: ['45%', '39%'],
-        center: ['50%', '35%'],
-        z: 10,
-        label: {
-          show: false,
-          position: 'center',
-          formatter: (params) => {
-            return params.name + "\r\n" + params.value
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        return {
+          type: "arc",
+          shape: {
+            cx: api.getWidth() / 2,
+            cy: api.getHeight() / 2 - 59,
+            r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.56,
+            startAngle: ((90 + -angle) * Math.PI) / 180,
+            endAngle: ((160 + -angle) * Math.PI) / 180,
           },
-          rich: {
-            total: {
-              fontSize: 16,
-              color: '#04F5FE',
-            },
-            efficiency: {
-              fontSize: 12,
-              color: '#00FD6D',
-            },
+          style: {
+            fill: "transparent",
+            stroke: "#5BC4FF66",
+            lineWidth: 2.6,
           },
-          color: '#FFFFFF',
-          fontSize: 12,
-          lineHeight: 16,
+          silent: true,
+        };
+      },
+      data: [0],
+    },
+    {
+      type: "pie",
+      radius: ["45%", "39%"],
+      center: ["50%", "35%"],
+      z: 10,
+      label: {
+        show: false,
+        position: "center",
+        formatter: (params) => {
+          return params.name + "\r\n" + params.value;
         },
-        data: data1,
-        labelLine: {
-          show: false,
+        rich: {
+          total: {
+            fontSize: 16,
+            color: "#04F5FE",
+          },
+          efficiency: {
+            fontSize: 12,
+            color: "#00FD6D",
+          },
         },
-         itemStyle: {
-          normal: {
-             borderWidth: 6,
-             shadowBlur: 10,
-             borderRadius: 50, // 圆角
-          }
-       }
+        color: "#FFFFFF",
+        fontSize: 12,
+        lineHeight: 16,
       },
-      {
-        type: 'pie',
-        radius: ['25%', '39%'],
-        center: ['50%', '35%'],
-        label: {
-          show: false,
+      data: data1,
+      labelLine: {
+        show: false,
+      },
+      itemStyle: {
+        normal: {
+          borderRadius: "5",
+          borderWidth: 4,
+          borderType: "solid",
+          borderColor: "#0C2D3A",
         },
-        data: data2,
-        labelLine: {
-          show: false,
+      },
+    },
+    {
+      type: "pie",
+      radius: ["25%", "39%"],
+      center: ["50%", "35%"],
+      label: {
+        show: false,
+      },
+      data: data2,
+      labelLine: {
+        show: false,
+      },
+      itemStyle: {
+        normal: {
+          borderRadius: "5",
+          borderWidth: 4,
+          borderType: "solid",
+          borderColor: "#0C2D3A",
         },
-         itemStyle: {
-          normal: {
-             borderWidth: 6,
-             shadowBlur: 10,
-             borderRadius: 0, // 圆角
-          }
-       }
       },
-    ],
-
-  };
+    },
+  ],
+};
 
-  export default options
\ No newline at end of file
+export default options;
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/channelAnalytics/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/channelAnalytics/assets/charts.js
index d57f651c..435b6e5b 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/channelAnalytics/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/channelAnalytics/assets/charts.js
@@ -1,392 +1,406 @@
 var res = [
-   { value: 20, name: '情报板发布' },
-   { value: 1, name: '' },
-   { value: 20, name: '微博发布' },
-   { value: 1, name: '' },
-   { value: 20, name: '服务网站' },
-   { value: 1, name: '' },
-   { value: 20, name: '短信发布' },
-   { value: 1, name: '' },
-   { value: 20, name: '微信发布' },
-   { value: 1, name: '' },
-  ];
- //  var res = this.evaluatedCountList;
-  var data1 = [], data2 = [], data3 = [], legendData = [];
-  var curIndex = 0;
-  var index = 0;
+  { value: 20, name: "情报板发布" },
+  { value: 20, name: "微博发布" },
+  { value: 20, name: "服务网站" },
+  { value: 20, name: "短信发布" },
+  { value: 20, name: "微信发布" },
+];
+//  var res = this.evaluatedCountList;
+var data1 = [],
+  data2 = [],
+  data3 = [],
+  legendData = [];
+var curIndex = 0;
+var index = 0;
 
-  for (var i = 0; i < res.length; i++) {
-    data1.push({
-      value: res[i].value,
-      name: res[i].name,
-    })
-    data2.push({
-      value: res[i].value,
-      name: res[i].name,
-      itemStyle: {
-        opacity: 0.4,
-      },
-    })
+for (var i = 0; i < res.length; i++) {
+  data1.push({
+    value: res[i].value,
+    name: res[i].name,
+  });
+  data2.push({
+    value: res[i].value,
+    name: res[i].name,
+    itemStyle: {
+      opacity: 0.4,
+    },
+  });
 
-    data3.push({
-      value: res[i].value,
-      name: res[i].name,
-      itemStyle: {
-        opacity: 0.1,
+  data3.push({
+    value: res[i].value,
+    name: res[i].name,
+    itemStyle: {
+      opacity: 0.1,
+    },
+  });
+  if (res[i].name != "") legendData.push(res[i].name);
+}
+let angle = 0; //角度，用来做简单的动画效果的
+var options = {
+  color: ["#68F4DD", "#FFDD69", "#3CC3F0", "#5C8CFE", "#51D5AD"],
+  title: [
+    {
+      text: "999",
+      top: "27%",
+      textAlign: "center",
+      left: "49%",
+      textStyle: {
+        color: "#ffffff",
+        fontSize: 30,
+        fontFamily: "PangMenZhengDao",
       },
-    })
-    if ( res[i].name != "" )
-    legendData.push(res[i].name);
-  }
-  let angle = 0; //角度，用来做简单的动画效果的
- var  options = {
-    color: ['#68F4DD', 'transparent', '#FFDD69', 'transparent', '#3CC3F0', 'transparent', '#5C8CFE', 'transparent', '#51D5AD', 'transparent'],
-    title: [
-      {
-        text:'999',
-        top: '27%',
-        textAlign: 'center',
-        left: '49%',
-        textStyle: {
-          color: '#ffffff',
-          fontSize: 30,
-          fontFamily: 'PangMenZhengDao',
-        },
+    },
+    {
+      text: "总数",
+      top: "38%",
+      textAlign: "center",
+      left: "49%",
+      textStyle: {
+        color: "rgba(242, 252, 253, 0.84)",
+        fontSize: 14,
+        fontWeight: 400,
       },
-      {
-        text: '总数',
-        top: '38%',
-        textAlign: 'center',
-        left: '49%',
-        textStyle: {
-          color: 'rgba(242, 252, 253, 0.84)',
+    },
+  ],
+  grid: {
+    top: "3%",
+    left: "6%",
+    right: "6%",
+    bottom: "3%",
+    containLabel: true,
+  },
+  tooltip: {
+    trigger: "item",
+    // formatter: "{b} : {c}:{d}",
+  },
+  legend: {
+    orient: "vertical",
+    // width: "350px",
+    height: "80px",
+    // left: "10%",
+    top: "68%",
+    itemWidth: 10,
+    itemHeight: 10,
+    icon: "circle",
+    textStyle: {
+      color: "#ffffff",
+      fontSize: 12,
+      lineHeight: 22,
+      rich: {
+        text: {
+          width: 80,
+          marginLeft: 32,
+          fontSize: 14,
+        },
+        number: {
+          fontSize: 14,
+          color: "#37E7FF",
+          marginLeft: 32,
+          fontWeight: "bold",
+        },
+        unit: {
           fontSize: 14,
-          fontWeight: 400,
         },
       },
-    ],
-    grid: {
-      top: '3%',
-      left: '6%',
-      right: '6%',
-      bottom: '3%',
-      containLabel: true
-    },
-    tooltip: {
-      trigger: 'item',
-      formatter: '{b} : {c}:{d}'
     },
-    legend: {
-      orient: '',
-      left: '10%',
-      top: '68%',
-      itemWidth: 10,
-      itemHeight: 10,
-      icon:"circle",
-      textStyle: {
-        color: "#ffffff",
-        fontSize: 14,
-        lineHeight: 22,
-        rich: {
-          text: {
-            marginLeft:32,
-            fontSize: 14,
-          },
-          number: {
-            fontSize: 14,
-            color: "#37E7FF",
-            marginLeft:32,
-            fontWeight: 'bold'
-          },
-          unit: {
-            fontSize: 14,
-          }
-        }
-      },
-      data: legendData,
-      formatter(name) {
-        const newData = res;
-        let tarValue = 0;
-        let total = 0;
-        for (let i = 0; i < newData.length; i++) {
-          total += newData[i].value;
-          if (newData[i].name === name) {
-            tarValue = newData[i].value;
-          }
+    data: legendData,
+    formatter(name) {
+      const newData = res;
+      let tarValue = 0;
+      let total = 0;
+      for (let i = 0; i < newData.length; i++) {
+        total += newData[i].value;
+        if (newData[i].name === name) {
+          tarValue = newData[i].value;
         }
-        var percert = total == 0 ? 0 : ((tarValue / total) * 100).toFixed(2);
-        const arr = name + '  ' + tarValue;
-        return `{text|${name}} {number|${percert}%}`;;
-      },
+      }
+      var percert = total == 0 ? 0 : ((tarValue / total) * 100).toFixed(2);
+      const arr = name + "  " + tarValue;
+      return `{text|${name}} {number|${percert}%}`;
+    },
+    pageIconColor: "#fff",
+    pageIconSize: 10,
+    pageTextStyle: {
+      color: "#fff",
     },
-    series: [
-          /** 饼图上刻度 */
+    type: "scroll",
+    pageButtonPosition: "end",
+  },
+  series: [
+    /** 饼图上刻度 */
     {
-      type: 'gauge',
-      center: ['50%', '35%'],
-      radius: '46%', // 错位调整此处
+      type: "gauge",
+      center: ["50%", "35%"],
+      radius: "46%", // 错位调整此处
       startAngle: 0,
       endAngle: 360,
       splitNumber: 52,
       axisLine: { show: false },
-      splitLine: { 
+      splitLine: {
         // length: 39,
-        length: '2',
+        length: "2",
         lineStyle: {
           width: 5,
-          color: '#5CC5FF'
-        }
+          color: "#5CC5FF",
+        },
       },
       axisTick: { show: false },
-      axisLabel: { show: false }
+      axisLabel: { show: false },
     },
-        /** 绘制外部圆弧-2-开始圆点 <left-top> */
+    /** 绘制外部圆弧-2-开始圆点 <left-top> */
     {
-      type: 'custom',
-      coordinateSystem: 'none',
+      type: "custom",
+      coordinateSystem: "none",
       renderItem: (params, api) => {
         let x0 = api.getWidth() / 2;
         let y0 = api.getHeight() / 2 - 59;
-        let r = Math.min(api.getWidth(), api.getHeight()) / 2 * 0.50;
+        let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.5;
         return {
-          type: 'circle',
+          type: "circle",
           shape: {
             /** 角度175° 外弧2开始角度 */
-            cx: x0 + r * Math.cos((350 + -angle) * Math.PI / 180),
-            cy: y0 + r * Math.sin((350 + -angle) * Math.PI / 180),
-            r: 4
+            cx: x0 + r * Math.cos(((350 + -angle) * Math.PI) / 180),
+            cy: y0 + r * Math.sin(((350 + -angle) * Math.PI) / 180),
+            r: 4,
           },
           style: {
-            fill: '#5BC4FF',
-            stroke: '#5BC4FF'
+            fill: "#5BC4FF",
+            stroke: "#5BC4FF",
           },
-          silent: true
-        }
+          silent: true,
+        };
       },
-      data: [0]
+      data: [0],
     },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          return {
-            type: 'arc',
-            shape: {
-              cx: api.getWidth() / 2,
-              cy: api.getHeight() / 2 - 59,
-              r: Math.min(api.getWidth(), api.getHeight()) / 2 * 0.50,
-              startAngle: (350 + -angle) * Math.PI / 180,
-              endAngle: (120 + -angle) * Math.PI / 180
-            },
-            style: {
-              fill: 'transparent',
-              stroke: '#5BC4FF66',
-              lineWidth: 2.6
-            },
-            silent: true
-          }
-        },
-        data: [0]
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        return {
+          type: "arc",
+          shape: {
+            cx: api.getWidth() / 2,
+            cy: api.getHeight() / 2 - 59,
+            r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.5,
+            startAngle: ((350 + -angle) * Math.PI) / 180,
+            endAngle: ((120 + -angle) * Math.PI) / 180,
+          },
+          style: {
+            fill: "transparent",
+            stroke: "#5BC4FF66",
+            lineWidth: 2.6,
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          let x0 = api.getWidth() / 2;
-          let y0 = api.getHeight() / 2 - 59;
-          let r = Math.min(api.getWidth(), api.getHeight()) / 2 * 0.50;
-          return {
-            type: 'circle',
-            shape: {
-              /** 角度175° 外弧2开始角度 */
-              cx: x0 + r * Math.cos((150 + -angle) * Math.PI / 180),
-              cy: y0 + r * Math.sin((150 + -angle) * Math.PI / 180),
-              r: 4
-            },
-            style: {
-              fill: '#5BC4FF',
-              stroke: '#5BC4FF'
-            },
-            silent: true
-          }
-        },
-        data: [0]
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        let x0 = api.getWidth() / 2;
+        let y0 = api.getHeight() / 2 - 59;
+        let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.5;
+        return {
+          type: "circle",
+          shape: {
+            /** 角度175° 外弧2开始角度 */
+            cx: x0 + r * Math.cos(((150 + -angle) * Math.PI) / 180),
+            cy: y0 + r * Math.sin(((150 + -angle) * Math.PI) / 180),
+            r: 4,
+          },
+          style: {
+            fill: "#5BC4FF",
+            stroke: "#5BC4FF",
+          },
+          silent: true,
+        };
       },
-        {
-          type: 'custom',
-          coordinateSystem: 'none',
-          renderItem: (params, api) => {
-            return {
-              type: 'arc',
-              shape: {
-                cx: api.getWidth() / 2,
-                cy: api.getHeight() / 2 - 59,
-                r: Math.min(api.getWidth(), api.getHeight()) / 2 * 0.50,
-                startAngle: (150 + -angle) * Math.PI / 180,
-                endAngle: (-30 + -angle) * Math.PI / 180
-              },
-              style: {
-                fill: 'transparent',
-                stroke: '#5BC4FF66',
-                lineWidth: 2.6
-              },
-              silent: true
-            }
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        return {
+          type: "arc",
+          shape: {
+            cx: api.getWidth() / 2,
+            cy: api.getHeight() / 2 - 59,
+            r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.5,
+            startAngle: ((150 + -angle) * Math.PI) / 180,
+            endAngle: ((-30 + -angle) * Math.PI) / 180,
           },
-          data: [0]
-        },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          let x0 = api.getWidth() / 2;
-          let y0 = api.getHeight() / 2 - 59;
-          let r = Math.min(api.getWidth(), api.getHeight()) / 2 * 0.56;
-          return {
-            type: 'circle',
-            shape: {
-              /** 角度175° 外弧2开始角度 */
-              cx: x0 + r * Math.cos((590 + -angle) * Math.PI / 180),
-              cy: y0 + r * Math.sin((590 + -angle) * Math.PI / 180),
-              r: 4
-            },
-            style: {
-              fill: '#5BC4FF',
-              stroke: '#5BC4FF'
-            },
-            silent: true
-          }
-        },
-        data: [0]
+          style: {
+            fill: "transparent",
+            stroke: "#5BC4FF66",
+            lineWidth: 2.6,
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          return {
-            type: 'arc',
-            shape: {
-              cx: api.getWidth() / 2,
-              cy: api.getHeight() / 2 - 59,
-              r: Math.min(api.getWidth(), api.getHeight()) / 2 * 0.56,
-              startAngle: (590 + -angle) * Math.PI / 180,
-              endAngle: (350 + -angle) * Math.PI / 180
-            },
-            style: {
-              fill: 'transparent',
-              stroke: '#5BC4FF66',
-              lineWidth: 2.6
-            },
-            silent: true
-          }
-        },
-        data: [0]
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        let x0 = api.getWidth() / 2;
+        let y0 = api.getHeight() / 2 - 59;
+        let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.56;
+        return {
+          type: "circle",
+          shape: {
+            /** 角度175° 外弧2开始角度 */
+            cx: x0 + r * Math.cos(((590 + -angle) * Math.PI) / 180),
+            cy: y0 + r * Math.sin(((590 + -angle) * Math.PI) / 180),
+            r: 4,
+          },
+          style: {
+            fill: "#5BC4FF",
+            stroke: "#5BC4FF",
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          let x0 = api.getWidth() / 2;
-          let y0 = api.getHeight() / 2 - 59;
-          let r = Math.min(api.getWidth(), api.getHeight()) / 2 * 0.56;
-          return {
-            type: 'circle',
-            shape: {
-              /** 角度175° 外弧2开始角度 */
-              cx: x0 + r * Math.cos((90 + -angle) * Math.PI / 180),
-              cy: y0 + r * Math.sin((90 + -angle) * Math.PI / 180),
-              r: 4
-            },
-            style: {
-              fill: '#5BC4FF',
-              stroke: '#5BC4FF'
-            },
-            silent: true
-          }
-        },
-        data: [0]
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        return {
+          type: "arc",
+          shape: {
+            cx: api.getWidth() / 2,
+            cy: api.getHeight() / 2 - 59,
+            r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.56,
+            startAngle: ((590 + -angle) * Math.PI) / 180,
+            endAngle: ((350 + -angle) * Math.PI) / 180,
+          },
+          style: {
+            fill: "transparent",
+            stroke: "#5BC4FF66",
+            lineWidth: 2.6,
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          return {
-            type: 'arc',
-            shape: {
-              cx: api.getWidth() / 2,
-              cy: api.getHeight() / 2 - 59,
-              r: Math.min(api.getWidth(), api.getHeight()) / 2 * 0.56,
-              startAngle: (90 + -angle) * Math.PI / 180,
-              endAngle: (160 + -angle) * Math.PI / 180
-            },
-            style: {
-              fill: 'transparent',
-              stroke: '#5BC4FF66',
-              lineWidth: 2.6
-            },
-            silent: true
-          }
-        },
-        data: [0]
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        let x0 = api.getWidth() / 2;
+        let y0 = api.getHeight() / 2 - 59;
+        let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.56;
+        return {
+          type: "circle",
+          shape: {
+            /** 角度175° 外弧2开始角度 */
+            cx: x0 + r * Math.cos(((90 + -angle) * Math.PI) / 180),
+            cy: y0 + r * Math.sin(((90 + -angle) * Math.PI) / 180),
+            r: 4,
+          },
+          style: {
+            fill: "#5BC4FF",
+            stroke: "#5BC4FF",
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'pie',
-        radius: ['45%', '40%'],
-        center: ['50%', '35%'],
-        z: 10,
-        label: {
-          show: false,
-          position: 'center',
-          formatter: (params) => {
-            return params.name + "\r\n" + params.value
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        return {
+          type: "arc",
+          shape: {
+            cx: api.getWidth() / 2,
+            cy: api.getHeight() / 2 - 59,
+            r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.56,
+            startAngle: ((90 + -angle) * Math.PI) / 180,
+            endAngle: ((160 + -angle) * Math.PI) / 180,
           },
-          rich: {
-            total: {
-              fontSize: 16,
-              color: '#04F5FE',
-            },
-            efficiency: {
-              fontSize: 12,
-              color: '#00FD6D',
-            },
+          style: {
+            fill: "transparent",
+            stroke: "#5BC4FF66",
+            lineWidth: 2.6,
           },
-          color: '#FFFFFF',
-          fontSize: 12,
-          lineHeight: 16,
+          silent: true,
+        };
+      },
+      data: [0],
+    },
+    {
+      type: "pie",
+      radius: ["45%", "40%"],
+      center: ["50%", "35%"],
+
+      z: 10,
+      label: {
+        show: false,
+        position: "center",
+        formatter: (params) => {
+          return params.name + "\r\n" + params.value;
         },
-        data: data1,
-        labelLine: {
-          show: false,
+        rich: {
+          total: {
+            fontSize: 16,
+            color: "#04F5FE",
+          },
+          efficiency: {
+            fontSize: 12,
+            color: "#00FD6D",
+          },
         },
-         itemStyle: {
-          normal: {
-             borderWidth: 6,
-             shadowBlur: 10,
-             borderRadius: 50, // 圆角
-          }
-       }
+        color: "#FFFFFF",
+        fontSize: 12,
+        lineHeight: 16,
       },
-      {
-        type: 'pie',
-        radius: ['29%', '40%'],
-        center: ['50%', '35%'],
-        label: {
-          show: false,
+      data: data1,
+      labelLine: {
+        show: false,
+      },
+      itemStyle: {
+        // normal: {
+        //   borderWidth: 4,
+        //   shadowBlur: 10,
+        //   borderRadius: 50, // 圆角
+        // },
+        normal: {
+          borderRadius: "5",
+          borderWidth: 4,
+          borderType: "solid",
+          borderColor: "#0C2D3A",
         },
-        data: data2,
-        labelLine: {
-          show: false,
+      },
+    },
+    {
+      type: "pie",
+      radius: ["29%", "40%"],
+      center: ["50%", "35%"],
+      label: {
+        show: false,
+      },
+      data: data2,
+      labelLine: {
+        show: false,
+      },
+      itemStyle: {
+        normal: {
+          borderRadius: "5",
+          borderWidth: 8,
+          borderType: "solid",
+          borderColor: "#0C2D3A",
         },
-         itemStyle: {
-          normal: {
-             borderWidth: 6,
-             shadowBlur: 10,
-             borderRadius: 0, // 圆角
-          }
-       }
       },
-    ],
-
-  };
+    },
+  ],
+};
 
-  export default options
\ No newline at end of file
+export default options;
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/eventTypeAnalysis/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/eventTypeAnalysis/assets/charts.js
index 4c0891f5..6b71da75 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/eventTypeAnalysis/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/eventTypeAnalysis/assets/charts.js
@@ -1,25 +1,16 @@
 var res = [
-   { value: 20, name: '交通事故' },
-   { value: 1, name: '' },
-   { value: 20, name: '车辆故障' },
-   { value: 1, name: '' },
-   { value: 15, name: '路障清除' },
-   { value: 1, name: '' },
-   { value: 10, name: '交通管制' },
-   { value: 1, name: '' },
-   { value: 5, name: '道路拥堵' },
-   { value: 1, name: '' },
-   { value: 5, name: '异常天气' },
-   { value: 1, name: '' },
-   { value: 5, name: '其他事件' },
-   { value: 1, name: '' },
-   { value: 10, name: '施工建设' },
-   { value: 1, name: '' },
-   { value: 10, name: '服务区异常' },
-   { value: 1, name: '' },
-  ];
-  let angle = 0; //角度，用来做简单的动画效果的
-  
+  { value: 20, name: "交通事故" },
+  { value: 20, name: "车辆故障" },
+  { value: 15, name: "路障清除" },
+  { value: 10, name: "交通管制" },
+  { value: 5, name: "道路拥堵" },
+  { value: 5, name: "异常天气" },
+  { value: 5, name: "其他事件" },
+  { value: 10, name: "施工建设" },
+  { value: 10, name: "服务区异常" },
+];
+let angle = 0; //角度，用来做简单的动画效果的
+
 //获取圆上面某点的坐标(x0,y0表示坐标，r半径，angle角度)
 function getCirlPoint(x0, y0, r, angle) {
   let x1 = x0 + r * Math.cos((angle * Math.PI) / 180);
@@ -30,383 +21,405 @@ function getCirlPoint(x0, y0, r, angle) {
   };
 }
 
- //  var res = this.evaluatedCountList;
-  var data1 = [], data2 = [], data3 = [], legendData = [];
-  var curIndex = 0;
-  var index = 0;
+//  var res = this.evaluatedCountList;
+var data1 = [],
+  data2 = [],
+  data3 = [],
+  legendData = [];
+var curIndex = 0;
+var index = 0;
 
-  for (var i = 0; i < res.length; i++) {
-    data1.push({
-      value: res[i].value,
-      name: res[i].name,
-    })
-    data2.push({
-      value: res[i].value,
-      name: res[i].name,
-      itemStyle: {
-        opacity: 0.4,
-      },
-    })
+for (var i = 0; i < res.length; i++) {
+  data1.push({
+    value: res[i].value,
+    name: res[i].name,
+  });
+  data2.push({
+    value: res[i].value,
+    name: res[i].name,
+    itemStyle: {
+      opacity: 0.4,
+    },
+  });
 
-    data3.push({
-      value: res[i].value,
-      name: res[i].name,
-      itemStyle: {
-        opacity: 0.1,
-      },
-    })
-    if ( res[i].name != "" )
-    legendData.push(res[i].name);
-  }
+  data3.push({
+    value: res[i].value,
+    name: res[i].name,
+    itemStyle: {
+      opacity: 0.1,
+    },
+  });
+  if (res[i].name != "") legendData.push(res[i].name);
+}
 
- var  options = {
-    color: ['#2867FF', 'transparent', '#58C3FF', 'transparent', '#FF6A3B', 'transparent','#FDA474', 'transparent','#FEE58F','transparent', '#8DFEBF','transparent', '#66F4DC', 'transparent','#33E27D', 'transparent','#5D8CFE','transparent',],
-    title: [
-      {
-        text:'999',
-        top: '27%',
-        textAlign: 'center',
-        left: '49%',
-        textStyle: {
-          color: '#ffffff',
-          fontSize: 30,
-          fontFamily: 'PangMenZhengDao',
-        },
-      },
-      {
-        text: '总数',
-        top: '38%',
-        textAlign: 'center',
-        left: '49%',
-        textStyle: {
-          color: 'rgba(242, 252, 253, 0.84)',
-          fontSize: 14,
-          fontWeight: 400,
-        },
+var options = {
+  color: [
+    "#2867FF",
+    "#58C3FF",
+    "#FF6A3B",
+    "#FDA474",
+    "#FEE58F",
+    "#8DFEBF",
+    "#66F4DC",
+    "#33E27D",
+    "#5D8CFE",
+  ],
+  title: [
+    {
+      text: "999",
+      top: "27%",
+      textAlign: "center",
+      left: "49%",
+      textStyle: {
+        color: "#ffffff",
+        fontSize: 30,
+        fontFamily: "PangMenZhengDao",
       },
-    ],
-    grid: {
-      top: '38%',
-      left: '6%',
-      right: '6%',
-      bottom: '3%',
-      containLabel: true
-    },
-    tooltip: {
-      trigger: 'item',
-      formatter: '{b} : {c}:{d}'
     },
-    legend: {
-      orient: '',
-      left: '0%',
-      top: '68%',
-      itemWidth: 10,
-      itemHeight: 10,
-      icon:"circle",
+    {
+      text: "总数",
+      top: "38%",
+      textAlign: "center",
+      left: "49%",
       textStyle: {
-        color: "#ffffff",
+        color: "rgba(242, 252, 253, 0.84)",
         fontSize: 14,
-        lineHeight: 22,
-        rich: {
-          text: {
-            marginLeft:32,
-            fontSize: 14,
-          },
-          number: {
-            fontSize: 14,
-            color: "#37E7FF",
-            marginLeft:32,
-            fontWeight: 'bold'
-          },
-          unit: {
-            fontSize: 14,
-          }
-        }
+        fontWeight: 400,
       },
-      data: legendData,
-      formatter(name) {
-        const newData = res;
-        let tarValue = 0;
-        let total = 0;
-        for (let i = 0; i < newData.length; i++) {
-          total += newData[i].value;
-          if (newData[i].name === name) {
-            tarValue = newData[i].value;
-          }
-        }
-        var percert = total == 0 ? 0 : ((tarValue / total) * 100).toFixed(2);
-        const arr = name + '  ' + tarValue;
-        return `{text|${name}} {number|${percert}%}`;;
+    },
+  ],
+  grid: {
+    top: "38%",
+    left: "6%",
+    right: "6%",
+    bottom: "3%",
+    containLabel: true,
+  },
+  tooltip: {
+    trigger: "item",
+    // formatter: "{b} : {c}:{d}",
+  },
+  legend: {
+    orient: "vertical",
+    height: "80px",
+    // left: "0%",
+    top: "68%",
+    itemWidth: 10,
+    itemHeight: 10,
+    icon: "circle",
+    textStyle: {
+      color: "#ffffff",
+      fontSize: 14,
+      lineHeight: 22,
+      rich: {
+        text: {
+          width: 80,
+          marginLeft: 32,
+          fontSize: 14,
+        },
+        number: {
+          fontSize: 14,
+          color: "#37E7FF",
+          marginLeft: 32,
+          fontWeight: "bold",
+        },
+        unit: {
+          fontSize: 14,
+        },
       },
     },
-    series: [
-       /** 饼图上刻度 */
+    data: legendData,
+    formatter(name) {
+      const newData = res;
+      let tarValue = 0;
+      let total = 0;
+      for (let i = 0; i < newData.length; i++) {
+        total += newData[i].value;
+        if (newData[i].name === name) {
+          tarValue = newData[i].value;
+        }
+      }
+      var percert = total == 0 ? 0 : ((tarValue / total) * 100).toFixed(2);
+      const arr = name + "  " + tarValue;
+      return `{text|${name}} {number|${percert}%}`;
+    },
+    pageIconColor: "#fff",
+    pageIconSize: 10,
+    pageTextStyle: {
+      color: "#fff",
+    },
+    type: "scroll",
+    pageButtonPosition: "end",
+  },
+  series: [
+    /** 饼图上刻度 */
     {
-      type: 'gauge',
-      center: ['50%', '35%'],
-      radius: '46%', // 错位调整此处
+      type: "gauge",
+      center: ["50%", "35%"],
+      radius: "46%", // 错位调整此处
       startAngle: 0,
       endAngle: 360,
       splitNumber: 52,
       axisLine: { show: false },
-      splitLine: { 
+      splitLine: {
         // length: 39,
-        length: '2',
+        length: "2",
         lineStyle: {
           width: 5,
-          color: '#5CC5FF'
-        }
+          color: "#5CC5FF",
+        },
       },
       axisTick: { show: false },
-      axisLabel: { show: false }
+      axisLabel: { show: false },
     },
-        /** 绘制外部圆弧-2-开始圆点 <left-top> */
+    /** 绘制外部圆弧-2-开始圆点 <left-top> */
     {
-      type: 'custom',
-      coordinateSystem: 'none',
+      type: "custom",
+      coordinateSystem: "none",
       renderItem: (params, api) => {
         let x0 = api.getWidth() / 2;
         let y0 = api.getHeight() / 2 - 59;
-        let r = Math.min(api.getWidth(), api.getHeight()) / 2 * 0.50;
+        let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.5;
         return {
-          type: 'circle',
+          type: "circle",
           shape: {
             /** 角度175° 外弧2开始角度 */
-            cx: x0 + r * Math.cos((350 + -angle) * Math.PI / 180),
-            cy: y0 + r * Math.sin((350 + -angle) * Math.PI / 180),
-            r: 4
+            cx: x0 + r * Math.cos(((350 + -angle) * Math.PI) / 180),
+            cy: y0 + r * Math.sin(((350 + -angle) * Math.PI) / 180),
+            r: 4,
           },
           style: {
-            fill: '#5BC4FF',
-            stroke: '#5BC4FF'
+            fill: "#5BC4FF",
+            stroke: "#5BC4FF",
           },
-          silent: true
-        }
+          silent: true,
+        };
       },
-      data: [0]
+      data: [0],
     },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          return {
-            type: 'arc',
-            shape: {
-              cx: api.getWidth() / 2,
-              cy: api.getHeight() / 2 - 59,
-              r: Math.min(api.getWidth(), api.getHeight()) / 2 * 0.50,
-              startAngle: (350 + -angle) * Math.PI / 180,
-              endAngle: (120 + -angle) * Math.PI / 180
-            },
-            style: {
-              fill: 'transparent',
-              stroke: '#5BC4FF66',
-              lineWidth: 2.6
-            },
-            silent: true
-          }
-        },
-        data: [0]
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        return {
+          type: "arc",
+          shape: {
+            cx: api.getWidth() / 2,
+            cy: api.getHeight() / 2 - 59,
+            r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.5,
+            startAngle: ((350 + -angle) * Math.PI) / 180,
+            endAngle: ((120 + -angle) * Math.PI) / 180,
+          },
+          style: {
+            fill: "transparent",
+            stroke: "#5BC4FF66",
+            lineWidth: 2.6,
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          let x0 = api.getWidth() / 2;
-          let y0 = api.getHeight() / 2 - 59;
-          let r = Math.min(api.getWidth(), api.getHeight()) / 2 * 0.50;
-          return {
-            type: 'circle',
-            shape: {
-              /** 角度175° 外弧2开始角度 */
-              cx: x0 + r * Math.cos((150 + -angle) * Math.PI / 180),
-              cy: y0 + r * Math.sin((150 + -angle) * Math.PI / 180),
-              r: 4
-            },
-            style: {
-              fill: '#5BC4FF',
-              stroke: '#5BC4FF'
-            },
-            silent: true
-          }
-        },
-        data: [0]
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        let x0 = api.getWidth() / 2;
+        let y0 = api.getHeight() / 2 - 59;
+        let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.5;
+        return {
+          type: "circle",
+          shape: {
+            /** 角度175° 外弧2开始角度 */
+            cx: x0 + r * Math.cos(((150 + -angle) * Math.PI) / 180),
+            cy: y0 + r * Math.sin(((150 + -angle) * Math.PI) / 180),
+            r: 4,
+          },
+          style: {
+            fill: "#5BC4FF",
+            stroke: "#5BC4FF",
+          },
+          silent: true,
+        };
       },
-        {
-          type: 'custom',
-          coordinateSystem: 'none',
-          renderItem: (params, api) => {
-            return {
-              type: 'arc',
-              shape: {
-                cx: api.getWidth() / 2,
-                cy: api.getHeight() / 2 - 59,
-                r: Math.min(api.getWidth(), api.getHeight()) / 2 * 0.50,
-                startAngle: (150 + -angle) * Math.PI / 180,
-                endAngle: (-30 + -angle) * Math.PI / 180
-              },
-              style: {
-                fill: 'transparent',
-                stroke: '#5BC4FF66',
-                lineWidth: 2.6
-              },
-              silent: true
-            }
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        return {
+          type: "arc",
+          shape: {
+            cx: api.getWidth() / 2,
+            cy: api.getHeight() / 2 - 59,
+            r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.5,
+            startAngle: ((150 + -angle) * Math.PI) / 180,
+            endAngle: ((-30 + -angle) * Math.PI) / 180,
           },
-          data: [0]
-        },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          let x0 = api.getWidth() / 2;
-          let y0 = api.getHeight() / 2 - 59;
-          let r = Math.min(api.getWidth(), api.getHeight()) / 2 * 0.56;
-          return {
-            type: 'circle',
-            shape: {
-              /** 角度175° 外弧2开始角度 */
-              cx: x0 + r * Math.cos((590 + -angle) * Math.PI / 180),
-              cy: y0 + r * Math.sin((590 + -angle) * Math.PI / 180),
-              r: 4
-            },
-            style: {
-              fill: '#5BC4FF',
-              stroke: '#5BC4FF'
-            },
-            silent: true
-          }
-        },
-        data: [0]
+          style: {
+            fill: "transparent",
+            stroke: "#5BC4FF66",
+            lineWidth: 2.6,
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          return {
-            type: 'arc',
-            shape: {
-              cx: api.getWidth() / 2,
-              cy: api.getHeight() / 2 - 59,
-              r: Math.min(api.getWidth(), api.getHeight()) / 2 * 0.56,
-              startAngle: (590 + -angle) * Math.PI / 180,
-              endAngle: (350 + -angle) * Math.PI / 180
-            },
-            style: {
-              fill: 'transparent',
-              stroke: '#5BC4FF66',
-              lineWidth: 2.6
-            },
-            silent: true
-          }
-        },
-        data: [0]
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        let x0 = api.getWidth() / 2;
+        let y0 = api.getHeight() / 2 - 59;
+        let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.56;
+        return {
+          type: "circle",
+          shape: {
+            /** 角度175° 外弧2开始角度 */
+            cx: x0 + r * Math.cos(((590 + -angle) * Math.PI) / 180),
+            cy: y0 + r * Math.sin(((590 + -angle) * Math.PI) / 180),
+            r: 4,
+          },
+          style: {
+            fill: "#5BC4FF",
+            stroke: "#5BC4FF",
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          let x0 = api.getWidth() / 2;
-          let y0 = api.getHeight() / 2 - 59;
-          let r = Math.min(api.getWidth(), api.getHeight()) / 2 * 0.56;
-          return {
-            type: 'circle',
-            shape: {
-              /** 角度175° 外弧2开始角度 */
-              cx: x0 + r * Math.cos((90 + -angle) * Math.PI / 180),
-              cy: y0 + r * Math.sin((90 + -angle) * Math.PI / 180),
-              r: 4
-            },
-            style: {
-              fill: '#5BC4FF',
-              stroke: '#5BC4FF'
-            },
-            silent: true
-          }
-        },
-        data: [0]
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        return {
+          type: "arc",
+          shape: {
+            cx: api.getWidth() / 2,
+            cy: api.getHeight() / 2 - 59,
+            r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.56,
+            startAngle: ((590 + -angle) * Math.PI) / 180,
+            endAngle: ((350 + -angle) * Math.PI) / 180,
+          },
+          style: {
+            fill: "transparent",
+            stroke: "#5BC4FF66",
+            lineWidth: 2.6,
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'custom',
-        coordinateSystem: 'none',
-        renderItem: (params, api) => {
-          return {
-            type: 'arc',
-            shape: {
-              cx: api.getWidth() / 2,
-              cy: api.getHeight() / 2 - 59,
-              r: Math.min(api.getWidth(), api.getHeight()) / 2 * 0.56,
-              startAngle: (90 + -angle) * Math.PI / 180,
-              endAngle: (160 + -angle) * Math.PI / 180
-            },
-            style: {
-              fill: 'transparent',
-              stroke: '#5BC4FF66',
-              lineWidth: 2.6
-            },
-            silent: true
-          }
-        },
-        data: [0]
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        let x0 = api.getWidth() / 2;
+        let y0 = api.getHeight() / 2 - 59;
+        let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.56;
+        return {
+          type: "circle",
+          shape: {
+            /** 角度175° 外弧2开始角度 */
+            cx: x0 + r * Math.cos(((90 + -angle) * Math.PI) / 180),
+            cy: y0 + r * Math.sin(((90 + -angle) * Math.PI) / 180),
+            r: 4,
+          },
+          style: {
+            fill: "#5BC4FF",
+            stroke: "#5BC4FF",
+          },
+          silent: true,
+        };
       },
-      {
-        type: 'pie',
-        radius: ['45%', '40%'],
-        center: ['50%', '35%'],
-        z: 10,
-        label: {
-          show: false,
-          position: 'center',
-          formatter: (params) => {
-            return params.name + "\r\n" + params.value
+      data: [0],
+    },
+    {
+      type: "custom",
+      coordinateSystem: "none",
+      renderItem: (params, api) => {
+        return {
+          type: "arc",
+          shape: {
+            cx: api.getWidth() / 2,
+            cy: api.getHeight() / 2 - 59,
+            r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.56,
+            startAngle: ((90 + -angle) * Math.PI) / 180,
+            endAngle: ((160 + -angle) * Math.PI) / 180,
           },
-          rich: {
-            total: {
-              fontSize: 16,
-              color: '#04F5FE',
-            },
-            efficiency: {
-              fontSize: 12,
-              color: '#00FD6D',
-            },
+          style: {
+            fill: "transparent",
+            stroke: "#5BC4FF66",
+            lineWidth: 2.6,
           },
-          color: '#FFFFFF',
-          fontSize: 12,
-          lineHeight: 16,
+          silent: true,
+        };
+      },
+      data: [0],
+    },
+    {
+      type: "pie",
+      radius: ["45%", "40%"],
+      center: ["50%", "35%"],
+      z: 10,
+      label: {
+        show: false,
+        position: "center",
+        formatter: (params) => {
+          return params.name + "\r\n" + params.value;
         },
-        data: data1,
-        labelLine: {
-          show: false,
+        rich: {
+          total: {
+            fontSize: 16,
+            color: "#04F5FE",
+          },
+          efficiency: {
+            fontSize: 12,
+            color: "#00FD6D",
+          },
         },
-         itemStyle: {
-          normal: {
-             borderWidth: 6,
-             shadowBlur: 10,
-             borderRadius: 50, // 圆角
-          }
-       }
+        color: "#FFFFFF",
+        fontSize: 12,
+        lineHeight: 16,
       },
-      {
-        type: 'pie',
-        radius: ['29%', '39%'],
-        center: ['50%', '35%'],
-        label: {
-          show: false,
+      data: data1,
+      labelLine: {
+        show: false,
+      },
+      itemStyle: {
+        normal: {
+          borderRadius: "5",
+          borderWidth: 4,
+          borderType: "solid",
+          borderColor: "#0C2D3A",
         },
-        data: data2,
-        labelLine: {
-          show: false,
+      },
+    },
+    {
+      type: "pie",
+      radius: ["29%", "39%"],
+      center: ["50%", "35%"],
+      label: {
+        show: false,
+      },
+      data: data2,
+      labelLine: {
+        show: false,
+      },
+      itemStyle: {
+        normal: {
+          borderRadius: "5",
+          borderWidth: 4,
+          borderType: "solid",
+          borderColor: "#0C2D3A",
         },
-         itemStyle: {
-          normal: {
-             borderWidth: 6,
-             shadowBlur: 10,
-             borderRadius: 0, // 圆角
-          }
-       }
       },
-    ],
-
-  };
+    },
+  ],
+};
 
-  export default options
\ No newline at end of file
+export default options;
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/nucleusThrough/assets/charts3.js b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/nucleusThrough/assets/charts3.js
index a32f9e85..edac1849 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/nucleusThrough/assets/charts3.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/nucleusThrough/assets/charts3.js
@@ -19,25 +19,25 @@ let data2 = [120, 340, 750, 600, 400, 700, 900, 200, 540, 320, 370, 500];
 let data3 = [200, 530, 920, 400, 600, 700, 300, 800, 900, 120, 570, 800];
 let options = {
   tooltip: {
-    show: false,
+    show: true,
     trigger: "axis",
-    axisPointer: {
-      // 坐标轴指示器，坐标轴触发有效
-      type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
-    },
-    textStyle: {
-      color: "#fff",
-      fontSize: 14,
-    },
-    backgroundColor: "rgba(3, 31, 71, .0)", //设置背景颜色
-    borderColor: "rgba(3, 31, 71, .0)",
-    formatter: "健康监测<br>{b1}：{c1}人",
+    // axisPointer: {
+    //   // 坐标轴指示器，坐标轴触发有效
+    //   type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
+    // },
+    // textStyle: {
+    //   color: "#fff",
+    //   fontSize: 14,
+    // },
+    // backgroundColor: "rgba(3, 31, 71, .0)", //设置背景颜色
+    // borderColor: "rgba(3, 31, 71, .0)",
+    // formatter: "健康监测<br>{b1}：{c1}人",
   },
   grid: {
-    left: "2%",
-    right: "4%",
-    top: "20%",
-    bottom: "10%",
+    left: "0",
+    right: "0",
+    top: "80px",
+    bottom: "25px",
     containLabel: true,
   },
   xAxis: {
@@ -51,7 +51,7 @@ let options = {
     },
     axisLine: {
       lineStyle: {
-        color: "#1C82C5",
+        color: "#2CC9EC",
       },
     },
     axisLabel: {
@@ -60,17 +60,23 @@ let options = {
       rotate: "1",
       margin: "20",
       textStyle: {
-        fontSize: 12,
-        color: "#50A2C1",
+        fontSize: 10,
+        color: "#fff",
       },
     },
   },
   yAxis: [
     {
-      min: 0,
+      name: "(起)",
+      nameTextStyle: {
+        color: "#fff",
+        fontSize: 10,
+        align: "right",
+        verticalAlign: "center",
+      },
       axisLine: {
         lineStyle: {
-          color: "#1C82C5",
+          color: "#1D7B93",
         },
       },
       splitLine: {
@@ -81,9 +87,9 @@ let options = {
         },
       },
       axisLabel: {
-        color: "#DEEBFF",
+        color: "#fff",
         textStyle: {
-          fontSize: 12,
+          fontSize: 10,
         },
       },
       axisTick: {
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/nucleusThrough/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/nucleusThrough/index.vue
index 0c6f1fe6..ebc29771 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/nucleusThrough/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/nucleusThrough/index.vue
@@ -1,54 +1,70 @@
 <template>
-  <div class='congestion'>
+  <div class="congestion">
     <WgtTitle :title="'月审核通过趋势分析'"></WgtTitle>
     <div class="board">
       <div class="searchPanel_1">
-        <el-date-picker size="mini" type="month" class="selectRoad" v-model="dateTime" style="width:140px;"
-          placeholder="请选择" />
-        <el-quarter-picker size="mini" class="selectRoad" style="width:180px;" v-if="year == 'quarter'" v-model="quarter"
-          aria-placeholder="请选季度" />
-
-        <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>
+        <el-date-picker
+          size="mini"
+          type="month"
+          class="selectRoad"
+          v-model="dateTime"
+          style="width: 140px"
+          placeholder="请选择"
+        />
+        <el-quarter-picker
+          size="mini"
+          class="selectRoad"
+          style="width: 180px"
+          v-if="year == 'quarter'"
+          v-model="quarter"
+          aria-placeholder="请选季度"
+        />
+
+        <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>
-      <div class="charts keep-ratio " id="nucleusThrough"></div>
+      <div class="charts keep-ratio" id="nucleusThrough"></div>
     </div>
   </div>
 </template>
-  
+
 <script>
 import WgtTitle from "@screen/pages/perception/widgets/title";
 import * as echarts from "echarts";
 import chartsStatistics from "./assets/charts3";
 export default {
-  name: 'nucleusThrough',
+  name: "nucleusThrough",
   components: {
-    WgtTitle
+    WgtTitle,
   },
   data() {
     return {
       dateTime: "",
-    }
-  },
-
-  created() {
-
+    };
   },
-  methods: {
 
-  },
+  created() {},
+  methods: {},
   mounted() {
     setTimeout(() => {
       this.$nextTick(() => {
-        var myChart = echarts.init(document.getElementById('nucleusThrough'));
+        var myChart = echarts.init(document.getElementById("nucleusThrough"));
         myChart.setOption(chartsStatistics);
       });
     });
   },
-}
+};
 </script>
-  
-<style lang='scss' scoped>
+
+<style lang="scss" scoped>
 .congestion {
   width: 100%;
 
@@ -61,18 +77,22 @@ 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;
 
-
     .searchPanel_1 {
       position: absolute;
       display: flex;
       align-items: center;
       height: 40px;
-      width: 100%;
+      width: 50%;
       font-size: 14px;
       margin-bottom: 10px;
       left: 20px;
@@ -102,7 +122,7 @@ export default {
 
       .selectRoad {
         width: 89px;
-        border: 1px solid #00B3CC;
+        border: 1px solid #00b3cc;
 
         ::v-deep {
           .el-input__inner {
@@ -113,19 +133,17 @@ export default {
       }
 
       .btnSearch {
-        background: linear-gradient(180deg, #005C79 0%, #009BCC 100%);
+        background: linear-gradient(180deg, #005c79 0%, #009bcc 100%);
         margin-left: 10px;
         border-color: transparent;
       }
 
       .btnReset {
-        background: linear-gradient(180deg, #005C79 0%, #009BCC 100%);
-        ;
+        background: linear-gradient(180deg, #005c79 0%, #009bcc 100%);
         border-color: transparent;
         color: white;
       }
     }
-
   }
 }
 
@@ -134,4 +152,3 @@ export default {
   width: 100%;
 }
 </style>
-  
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/postTrendsDay/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/postTrendsDay/assets/charts.js
index 3bff0d09..9991db10 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/postTrendsDay/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/postTrendsDay/assets/charts.js
@@ -1,271 +1,302 @@
-
 /* 数据 */
-let nameList = ["00:00", "02:00", "04:00", "06:00", "08:00", "10:00", "12:00", "14:00", "16:00", "18:00", "20:00", "22:00"]; // 类别
-let valueList = [800, 520, 650, 950, 420, 600, 450, 720, 303, 503 , 203 ,703 , 903  ]; // 人数
-var yList = [ "1000","800","轻度拥堵","基本畅通","畅通"]
+let nameList = [
+  "00:00",
+  "02:00",
+  "04:00",
+  "06:00",
+  "08:00",
+  "10:00",
+  "12:00",
+  "14:00",
+  "16:00",
+  "18:00",
+  "20:00",
+  "22:00",
+]; // 类别
+let valueList = [
+  800, 520, 650, 950, 420, 600, 450, 720, 303, 503, 203, 703, 903,
+]; // 人数
+var yList = ["1000", "800", "轻度拥堵", "基本畅通", "畅通"];
 /* 数据整合 */
 let dataList = [];
 nameList.map((item, index) => {
-   if (index === 4) {
-      dataList.push({
-         name: item,
-         value: valueList[index],
-         itemStyle: {
-            color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [{
-                  offset: 0, color: '#FFB904' // 0% 处的颜色
-               }, {
-                  offset: 1, color: '#FF6969' // 100% 处的颜色
-               }],
-               global: false // 缺省为 false
+  if (index === 4) {
+    dataList.push({
+      name: item,
+      value: valueList[index],
+      itemStyle: {
+        color: {
+          type: "linear",
+          x: 0,
+          y: 0,
+          x2: 0,
+          y2: 1,
+          colorStops: [
+            {
+              offset: 0,
+              color: "#FFB904", // 0% 处的颜色
+            },
+            {
+              offset: 1,
+              color: "#FF6969", // 100% 处的颜色
             },
-            borderRadius: 6
-         },
-         label: { show: false }
-      })
-   } else {
-      dataList.push({
-         name: item,
-         value: valueList[index],
-         itemStyle:{
-            borderRadius: 6
-         }
-      })
-   }
-})
+          ],
+          global: false, // 缺省为 false
+        },
+        borderRadius: 6,
+      },
+      label: { show: false },
+    });
+  } else {
+    dataList.push({
+      name: item,
+      value: valueList[index],
+      itemStyle: {
+        borderRadius: 6,
+      },
+    });
+  }
+});
 
 var options = {
-   legend: {
-      // orient: 'vertical',
-      icon: "circle",
-      itemHeight: 8,
-      itemWidth: 8,
-      top: "5%",
-      x: "right",
-      textStyle: {
-        color: "#fff",
-      },
+  tooltip: {
+    show: true,
+    trigger: "axis",
+  },
+  legend: {
+    // orient: 'vertical',
+    icon: "circle",
+    itemHeight: 8,
+    itemWidth: 8,
+    top: "20px",
+    x: "right",
+    textStyle: {
+      color: "#fff",
     },
-   grid: {
-      top: '15%',//上边距
-      right: '0',//右边距
-      left: '0',//左边距
-      bottom: "10%",//下边距
-      containLabel: true,
-   },
-   xAxis: {
-      type: 'category',
-      data: nameList,
-      axisTick: {
-         show: false //隐藏X轴刻度
-      },
-      axisLine: {
-         lineStyle: {
-            color: "rgba(49, 217, 255, 0.8)"
-         }
-      },
-      axisLabel: {
-         show: true,
-         color: '#B6E6FF',
-         fontSize:8,
-         fontFamily: 'Source Han Sans CN-Regular',
+  },
+  grid: {
+    top: "75px", //上边距
+    right: "0", //右边距
+    left: "0", //左边距
+    bottom: "20px", //下边距
+    containLabel: true,
+  },
+  xAxis: {
+    type: "category",
+    data: nameList,
+    axisTick: {
+      show: false, //隐藏X轴刻度
+    },
+    axisLine: {
+      lineStyle: {
+        color: "rgba(49, 217, 255, 0.8)",
       },
-   },
-   yAxis: [{
-      type: 'value',
-      name: "",
-      max: 1200,
-      min:0,
-      splitNumber:5,
+    },
+    axisLabel: {
+      show: true,
+      color: "#fff",
+      fontSize: 10,
+    },
+  },
+  yAxis: [
+    {
+      type: "value",
+      name: "(起)",
       nameTextStyle: {
-         color: '#B6E6FF',
-         fontSize: 13,
-         fontFamily: 'Source Han Sans CN-Regular',
-         align: "left",
-         verticalAlign: "center",
+        color: "#fff",
+        fontSize: 10,
+        align: "right",
+        verticalAlign: "center",
       },
       axisLabel: {
-         fontSize: 13,
-         color: '#B6E6FF',
-         fontFamily: 'HarmonyOS Sans-Regular',
-         // formatter:function(value,index){
-         //    return yList[index]
-         // }
+        fontSize: 10,
+        color: "#fff",
+        // formatter:function(value,index){
+        //    return yList[index]
+        // }
       },
       axisLine: {
-         show: false,
+        show: false,
       },
       axisTick: {
-         show: false
+        show: false,
       },
       splitLine: {
-         lineStyle: {
-            color: 'rgba(49, 217, 255, 0.5)',
-         }
+        lineStyle: {
+          color: "rgba(49, 217, 255, 0.5)",
+        },
+      },
+    },
+  ],
+  series: [
+    {
+      name: "情报板发布",
+      type: "line",
+      symbol: "circle",
+      symbolSize: 0,
+      smooth: true,
+      areaStyle: {
+        width: 4,
+        opacity: 0.25,
+        color: {
+          type: "linear",
+          x: 0,
+          y: 0,
+          x2: 0,
+          y2: 1,
+          colorStops: [
+            { offset: 0.389, color: "#32BB8A90" },
+            { offset: 1, color: "#32BB8A00" },
+          ],
+          global: false,
+        },
+      },
+      // yAxisIndex: 1, // 与第二个 y 轴关联
+      itemStyle: {
+        color: "#32BB8A",
+      },
+      lineStyle: {
+        width: 2,
       },
-   }],
-   series: [
-      {
-         name: '情报板发布',
-         type: 'line',
-         symbol: 'circle',
-         symbolSize: 0,
-         smooth: true,
-         areaStyle: {
-            width: 4,
-            opacity: 0.25,
-            color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [
-                  { offset: 0.389, color: "#32BB8A90" },
-                  { offset: 1, color: "#32BB8A00" },
-               ],
-               global: false,
-            },
-         },
-         // yAxisIndex: 1, // 与第二个 y 轴关联
-         itemStyle: {
-           color: '#32BB8A',
-         },
-         lineStyle: {
-           width:2,
-         },
-         
-         data: [1000, 800, 520, 600, 900, 700, 700,1000, 800, 520, 600, 900, 700, 700], // 折线图的数据
-       },
-       {
-         name: '服务网站',
-         type: 'line',
-         symbol: 'circle',
-         symbolSize: 0,
 
-         // yAxisIndex: 1, // 与第二个 y 轴关联
-         itemStyle: {
-           color: '#08BAF4',
-         },
-         lineStyle: {
-           width: 2,
-         },
-         smooth: true,
-         areaStyle: {
-            width: 4,
-            opacity: 0.25,
-            color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [
-                  { offset: 0.389, color: "#08BAF490" },
-                  { offset: 1, color: "#08BAF400" },
-               ],
-               global: false,
-            },
-         },
-         data: [600, 700, 900, 400, 500, 800, 600,600, 700, 900, 400, 500, 800, 600], // 折线图的数据
-       },
-       {
-         name: '微信发布',
-         type: 'line',
-         symbol: 'circle',
-         symbolSize: 0,
-         // yAxisIndex: 1, // 与第二个 y 轴关联
-         itemStyle: {
-           color: '#E2BA74',
-         },
-         smooth: true,
-         areaStyle: {
-            width: 4,
-            opacity: 0.25,
-            color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [
-                  { offset: 0.389, color: "#E2BA7490" },
-                  { offset: 1, color: "#E2BA7400" },
-               ],
-               global: false,
-            },
-         },
-         lineStyle: {
-           width: 2,
-         },
-         data: [850, 810, 712, 580, 480, 480, 780,850, 810, 712, 580, 480, 480, 780], // 折线图的数据
-       },{
-         name: '微博发布',
-         type: 'line',
-         symbol: 'circle',
-         symbolSize: 0,
-         // yAxisIndex: 1, // 与第二个 y 轴关联
-         itemStyle: {
-           color: '#51BFA4',
-         },
-         smooth: true,
-         areaStyle: {
-            width: 4,
-            opacity: 0.25,
-            color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [
-                  { offset: 0.389, color: "#51BFA490" },
-                  { offset: 1, color: "#51BFA400" },
-               ],
-               global: false,
-            },
-         },
-         lineStyle: {
-           width: 2,
-         },
-         data: [850, 810, 712, 580, 480, 480, 780,850, 810, 712, 580, 480, 480, 780], // 折线图的数据
-       },{
-         name: '短信发布',
-         type: 'line',
-         symbol: 'circle',
-         symbolSize: 0,
-         // yAxisIndex: 1, // 与第二个 y 轴关联
-         itemStyle: {
-           color: '#08BAF4',
-         },
-         smooth: true,
-         areaStyle: {
-            width: 4,
-            opacity: 0.25,
-            color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [
-                  { offset: 0.389, color: "#08BAF490" },
-                  { offset: 1, color: "#08BAF400" },
-               ],
-               global: false,
-            },
-         },
-         lineStyle: {
-           width: 2,
-         },
-         data: [850, 410, 712, 680, 50, 280, 480,850, 810, 712, 580, 480, 480, 780], // 折线图的数据
-       },
-   ]
-}
+      data: [
+        1000, 800, 520, 600, 900, 700, 700, 1000, 800, 520, 600, 900, 700, 700,
+      ], // 折线图的数据
+    },
+    {
+      name: "服务网站",
+      type: "line",
+      symbol: "circle",
+      symbolSize: 0,
+
+      // yAxisIndex: 1, // 与第二个 y 轴关联
+      itemStyle: {
+        color: "#08BAF4",
+      },
+      lineStyle: {
+        width: 2,
+      },
+      smooth: true,
+      areaStyle: {
+        width: 4,
+        opacity: 0.25,
+        color: {
+          type: "linear",
+          x: 0,
+          y: 0,
+          x2: 0,
+          y2: 1,
+          colorStops: [
+            { offset: 0.389, color: "#08BAF490" },
+            { offset: 1, color: "#08BAF400" },
+          ],
+          global: false,
+        },
+      },
+      data: [
+        600, 700, 900, 400, 500, 800, 600, 600, 700, 900, 400, 500, 800, 600,
+      ], // 折线图的数据
+    },
+    {
+      name: "微信发布",
+      type: "line",
+      symbol: "circle",
+      symbolSize: 0,
+      // yAxisIndex: 1, // 与第二个 y 轴关联
+      itemStyle: {
+        color: "#E2BA74",
+      },
+      smooth: true,
+      areaStyle: {
+        width: 4,
+        opacity: 0.25,
+        color: {
+          type: "linear",
+          x: 0,
+          y: 0,
+          x2: 0,
+          y2: 1,
+          colorStops: [
+            { offset: 0.389, color: "#E2BA7490" },
+            { offset: 1, color: "#E2BA7400" },
+          ],
+          global: false,
+        },
+      },
+      lineStyle: {
+        width: 2,
+      },
+      data: [
+        850, 810, 712, 580, 480, 480, 780, 850, 810, 712, 580, 480, 480, 780,
+      ], // 折线图的数据
+    },
+    {
+      name: "微博发布",
+      type: "line",
+      symbol: "circle",
+      symbolSize: 0,
+      // yAxisIndex: 1, // 与第二个 y 轴关联
+      itemStyle: {
+        color: "#51BFA4",
+      },
+      smooth: true,
+      areaStyle: {
+        width: 4,
+        opacity: 0.25,
+        color: {
+          type: "linear",
+          x: 0,
+          y: 0,
+          x2: 0,
+          y2: 1,
+          colorStops: [
+            { offset: 0.389, color: "#51BFA490" },
+            { offset: 1, color: "#51BFA400" },
+          ],
+          global: false,
+        },
+      },
+      lineStyle: {
+        width: 2,
+      },
+      data: [
+        850, 810, 712, 580, 480, 480, 780, 850, 810, 712, 580, 480, 480, 780,
+      ], // 折线图的数据
+    },
+    {
+      name: "短信发布",
+      type: "line",
+      symbol: "circle",
+      symbolSize: 0,
+      // yAxisIndex: 1, // 与第二个 y 轴关联
+      itemStyle: {
+        color: "#08BAF4",
+      },
+      smooth: true,
+      areaStyle: {
+        width: 4,
+        opacity: 0.25,
+        color: {
+          type: "linear",
+          x: 0,
+          y: 0,
+          x2: 0,
+          y2: 1,
+          colorStops: [
+            { offset: 0.389, color: "#08BAF490" },
+            { offset: 1, color: "#08BAF400" },
+          ],
+          global: false,
+        },
+      },
+      lineStyle: {
+        width: 2,
+      },
+      data: [
+        850, 410, 712, 680, 50, 280, 480, 850, 810, 712, 580, 480, 480, 780,
+      ], // 折线图的数据
+    },
+  ],
+};
 
 export default options;
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/postTrendsMonth/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/postTrendsMonth/assets/charts.js
index b5d032e2..c0b1c0e7 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/postTrendsMonth/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/postTrendsMonth/assets/charts.js
@@ -1,271 +1,293 @@
-
 /* 数据 */
-let nameList = ["00:00", "02:00", "04:00", "06:00", "08:00", "10:00", "12:00", "14:00", "16:00", "18:00", "20:00", "22:00"]; // 类别
-let valueList = [800, 520, 650, 950, 420, 600, 450, 720, 303, 503 , 203 ,703 , 903  ]; // 人数
-var yList = [ "1000","800","轻度拥堵","基本畅通","畅通"]
+let nameList = [
+  "00:00",
+  "02:00",
+  "04:00",
+  "06:00",
+  "08:00",
+  "10:00",
+  "12:00",
+  "14:00",
+  "16:00",
+  "18:00",
+  "20:00",
+  "22:00",
+]; // 类别
+let valueList = [
+  800, 520, 650, 950, 420, 600, 450, 720, 303, 503, 203, 703, 903, 903,
+]; // 人数
+var yList = ["1000", "800", "轻度拥堵", "基本畅通", "畅通"];
 /* 数据整合 */
 let dataList = [];
 nameList.map((item, index) => {
-   if (index === 4) {
-      dataList.push({
-         name: item,
-         value: valueList[index],
-         itemStyle: {
-            color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [{
-                  offset: 0, color: '#FFB904' // 0% 处的颜色
-               }, {
-                  offset: 1, color: '#FF6969' // 100% 处的颜色
-               }],
-               global: false // 缺省为 false
+  if (index === 4) {
+    dataList.push({
+      name: item,
+      value: valueList[index],
+      itemStyle: {
+        color: {
+          type: "linear",
+          x: 0,
+          y: 0,
+          x2: 0,
+          y2: 1,
+          colorStops: [
+            {
+              offset: 0,
+              color: "#FFB904", // 0% 处的颜色
+            },
+            {
+              offset: 1,
+              color: "#FF6969", // 100% 处的颜色
             },
-            borderRadius: 6
-         },
-         label: { show: false }
-      })
-   } else {
-      dataList.push({
-         name: item,
-         value: valueList[index],
-         itemStyle:{
-            borderRadius: 6
-         }
-      })
-   }
-})
+          ],
+          global: false, // 缺省为 false
+        },
+        borderRadius: 6,
+      },
+      label: { show: false },
+    });
+  } else {
+    dataList.push({
+      name: item,
+      value: valueList[index],
+      itemStyle: {
+        borderRadius: 6,
+      },
+    });
+  }
+});
 
 var options = {
-   legend: {
-      // orient: 'vertical',
-      icon: "circle",
-      itemHeight: 8,
-      itemWidth: 8,
-      top: "5%",
-      x: "right",
-      textStyle: {
-        color: "#fff",
-      },
+  tooltip: {
+    show: true,
+    trigger: "axis",
+  },
+  legend: {
+    // orient: 'vertical',
+    icon: "circle",
+    itemHeight: 8,
+    itemWidth: 8,
+    top: "5%",
+    x: "right",
+    textStyle: {
+      color: "#fff",
     },
-   grid: {
-      top: '20%',//上边距
-      right: '0',//右边距
-      left: '0',//左边距
-      bottom: "10%",//下边距
-      containLabel: true,
-   },
-   xAxis: {
-      type: 'category',
-      data: nameList,
-      axisTick: {
-         show: false //隐藏X轴刻度
-      },
-      axisLine: {
-         lineStyle: {
-            color: "rgba(49, 217, 255, 0.8)"
-         }
-      },
-      axisLabel: {
-         show: true,
-         color: '#B6E6FF',
-         fontSize:8,
-         fontFamily: 'Source Han Sans CN-Regular',
+  },
+  grid: {
+    top: "80px", //上边距
+    right: "0", //右边距
+    left: "0", //左边距
+    bottom: "10px", //下边距
+    containLabel: true,
+  },
+  xAxis: {
+    type: "category",
+    data: nameList,
+    axisTick: {
+      show: false, //隐藏X轴刻度
+    },
+    axisLine: {
+      lineStyle: {
+        color: "rgba(49, 217, 255, 0.8)",
       },
-   },
-   yAxis: [{
-      type: 'value',
-      name: "",
-      max: 1000,
-      min:0,
-      splitNumber:5,
+    },
+    axisLabel: {
+      show: true,
+      color: "#fff",
+      fontSize: 10,
+    },
+  },
+  yAxis: [
+    {
+      type: "value",
+      name: "(起)",
       nameTextStyle: {
-         color: '#B6E6FF',
-         fontSize: 13,
-         fontFamily: 'Source Han Sans CN-Regular',
-         align: "left",
-         verticalAlign: "center",
+        color: "#fff",
+        fontSize: 10,
+        align: "right",
+        verticalAlign: "center",
       },
       axisLabel: {
-         fontSize: 13,
-         color: '#B6E6FF',
-         fontFamily: 'HarmonyOS Sans-Regular',
-         // formatter:function(value,index){
-         //    return yList[index]
-         // }
+        fontSize: 10,
+        color: "#fff",
+        //   fontFamily: "HarmonyOS Sans-Regular",
+        // formatter:function(value,index){
+        //    return yList[index]
+        // }
       },
       axisLine: {
-         show: false,
+        show: false,
       },
       axisTick: {
-         show: false
+        show: false,
       },
       splitLine: {
-         lineStyle: {
-            color: 'rgba(49, 217, 255, 0.5)',
-         }
+        lineStyle: {
+          color: "rgba(49, 217, 255, 0.5)",
+        },
+      },
+    },
+  ],
+  series: [
+    {
+      name: "情报板发布",
+      type: "line",
+      symbol: "circle",
+      symbolSize: 0,
+      smooth: true,
+      areaStyle: {
+        width: 4,
+        opacity: 0.25,
+        color: {
+          type: "linear",
+          x: 0,
+          y: 0,
+          x2: 0,
+          y2: 1,
+          colorStops: [
+            { offset: 0.389, color: "#51BFA490" },
+            { offset: 1, color: "#51BFA400" },
+          ],
+          global: false,
+        },
+      },
+      // yAxisIndex: 1, // 与第二个 y 轴关联
+      itemStyle: {
+        color: "#51BFA4",
+      },
+      lineStyle: {
+        width: 2,
       },
-   }],
-   series: [
-      {
-         name: '情报板发布',
-         type: 'line',
-         symbol: 'circle',
-         symbolSize: 0,
-         smooth: true,
-         areaStyle: {
-            width: 4,
-            opacity: 0.25,
-            color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [
-                  { offset: 0.389, color: "#51BFA490" },
-                  { offset: 1, color: "#51BFA400" },
-               ],
-               global: false,
-            },
-         },
-         // yAxisIndex: 1, // 与第二个 y 轴关联
-         itemStyle: {
-           color: '#51BFA4',
-         },
-         lineStyle: {
-           width:2,
-         },
-         
-         data: [1000, 800, 520, 600, 900, 700, 700,1000, 800, 520, 600, 900, 700, 700], // 折线图的数据
-       },
-       {
-         name: '服务网站',
-         type: 'line',
-         symbol: 'circle',
-         symbolSize: 0,
 
-         // yAxisIndex: 1, // 与第二个 y 轴关联
-         itemStyle: {
-           color: '#08BAF4',
-         },
-         lineStyle: {
-           width: 2,
-         },
-         smooth: true,
-         areaStyle: {
-            width: 4,
-            opacity: 0.25,
-            color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [
-                  { offset: 0.389, color: "#08BAF490" },
-                  { offset: 1, color: "#08BAF400" },
-               ],
-               global: false,
-            },
-         },
-         data: [600, 700, 900, 400, 500, 800, 600,600, 700, 900, 400, 500, 800, 600], // 折线图的数据
-       },
-       {
-         name: '微信发布',
-         type: 'line',
-         symbol: 'circle',
-         symbolSize: 0,
-         // yAxisIndex: 1, // 与第二个 y 轴关联
-         itemStyle: {
-           color: '#E2BA74',
-         },
-         smooth: true,
-         areaStyle: {
-            width: 4,
-            opacity: 0.25,
-            color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [
-                  { offset: 0.389, color: "#E2BA7490" },
-                  { offset: 1, color: "#E2BA7400" },
-               ],
-               global: false,
-            },
-         },
-         lineStyle: {
-           width: 2,
-         },
-         data: [850, 810, 712, 580, 480, 480, 780,850, 810, 712, 580, 480, 480, 780], // 折线图的数据
-       },{
-         name: '微博发布',
-         type: 'line',
-         symbol: 'circle',
-         symbolSize: 0,
-         // yAxisIndex: 1, // 与第二个 y 轴关联
-         itemStyle: {
-           color: '#FB6D07',
-         },
-         smooth: true,
-         areaStyle: {
-            width: 4,
-            opacity: 0.25,
-            color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [
-                  { offset: 0.389, color: "#FB6D0799" },
-                  { offset: 1, color: "#FB6D0700" },
-               ],
-               global: false,
-            },
-         },
-         lineStyle: {
-           width: 2,
-         },
-         data: [850, 810, 712, 580, 480, 480, 780,850, 810, 712, 580, 480, 480, 780], // 折线图的数据
-       },{
-         name: '短信发布',
-         type: 'line',
-         symbol: 'circle',
-         symbolSize: 0,
-         // yAxisIndex: 1, // 与第二个 y 轴关联
-         itemStyle: {
-           color: '#07DEFB',
-         },
-         smooth: true,
-         areaStyle: {
-            width: 4,
-            opacity: 0.25,
-            color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [
-                  { offset: 0.389, color: "#07DEFB90" },
-                  { offset: 1, color: "#07DEFB00" },
-               ],
-               global: false,
-            },
-         },
-         lineStyle: {
-           width: 2,
-         },
-         data: [850, 410, 712, 680, 50, 280, 480,850, 810, 712, 580, 480, 480, 780], // 折线图的数据
-       },
-   ]
-}
+      data: [1000, 800, 520, 600, 900, 700, 700, 1000, 800, 520, 600, 900], // 折线图的数据
+    },
+    {
+      name: "服务网站",
+      type: "line",
+      symbol: "circle",
+      symbolSize: 0,
+
+      // yAxisIndex: 1, // 与第二个 y 轴关联
+      itemStyle: {
+        color: "#08BAF4",
+      },
+      lineStyle: {
+        width: 2,
+      },
+      smooth: true,
+      areaStyle: {
+        width: 4,
+        opacity: 0.25,
+        color: {
+          type: "linear",
+          x: 0,
+          y: 0,
+          x2: 0,
+          y2: 1,
+          colorStops: [
+            { offset: 0.389, color: "#08BAF490" },
+            { offset: 1, color: "#08BAF400" },
+          ],
+          global: false,
+        },
+      },
+      data: [600, 700, 900, 400, 500, 800, 600, 600, 700, 900, 400, 500], // 折线图的数据
+    },
+    {
+      name: "微信发布",
+      type: "line",
+      symbol: "circle",
+      symbolSize: 0,
+      // yAxisIndex: 1, // 与第二个 y 轴关联
+      itemStyle: {
+        color: "#E2BA74",
+      },
+      smooth: true,
+      areaStyle: {
+        width: 4,
+        opacity: 0.25,
+        color: {
+          type: "linear",
+          x: 0,
+          y: 0,
+          x2: 0,
+          y2: 1,
+          colorStops: [
+            { offset: 0.389, color: "#E2BA7490" },
+            { offset: 1, color: "#E2BA7400" },
+          ],
+          global: false,
+        },
+      },
+      lineStyle: {
+        width: 2,
+      },
+      data: [850, 810, 712, 580, 480, 480, 780, 850, 810, 712, 580, 480], // 折线图的数据
+    },
+    {
+      name: "微博发布",
+      type: "line",
+      symbol: "circle",
+      symbolSize: 0,
+      // yAxisIndex: 1, // 与第二个 y 轴关联
+      itemStyle: {
+        color: "#FB6D07",
+      },
+      smooth: true,
+      areaStyle: {
+        width: 4,
+        opacity: 0.25,
+        color: {
+          type: "linear",
+          x: 0,
+          y: 0,
+          x2: 0,
+          y2: 1,
+          colorStops: [
+            { offset: 0.389, color: "#FB6D0799" },
+            { offset: 1, color: "#FB6D0700" },
+          ],
+          global: false,
+        },
+      },
+      lineStyle: {
+        width: 2,
+      },
+      data: [850, 810, 712, 580, 480, 480, 780, 850, 810, 712, 580, 480], // 折线图的数据
+    },
+    {
+      name: "短信发布",
+      type: "line",
+      symbol: "circle",
+      symbolSize: 0,
+      // yAxisIndex: 1, // 与第二个 y 轴关联
+      itemStyle: {
+        color: "#07DEFB",
+      },
+      smooth: true,
+      areaStyle: {
+        width: 4,
+        opacity: 0.25,
+        color: {
+          type: "linear",
+          x: 0,
+          y: 0,
+          x2: 0,
+          y2: 1,
+          colorStops: [
+            { offset: 0.389, color: "#07DEFB90" },
+            { offset: 1, color: "#07DEFB00" },
+          ],
+          global: false,
+        },
+      },
+      lineStyle: {
+        width: 2,
+      },
+      data: [850, 410, 712, 680, 50, 280, 480, 850, 810, 712, 580, 480], // 折线图的数据
+    },
+  ],
+};
 
 export default options;
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/postTrendsMonth/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/postTrendsMonth/index.vue
index 5afcef2d..57d54279 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/postTrendsMonth/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/components/postTrendsMonth/index.vue
@@ -1,54 +1,71 @@
 <template>
-  <div class='congestion'>
+  <div class="congestion">
     <WgtTitle :title="'月发布渠道趋势分析'"></WgtTitle>
     <div class="board">
       <div class="searchPanel_1">
-        <el-date-picker size="mini" v-if="year != 'quarter'" class="selectRoad" v-model="dateTime" style="width:140px;"
-          type="month" placeholder="请选择" />
-        <el-quarter-picker size="mini" class="selectRoad" style="width:180px;" v-if="year == 'quarter'" v-model="quarter"
-          aria-placeholder="请选季度" />
-
-        <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>
+        <el-date-picker
+          size="mini"
+          v-if="year != 'quarter'"
+          class="selectRoad"
+          v-model="dateTime"
+          style="width: 140px"
+          type="month"
+          placeholder="请选择"
+        />
+        <el-quarter-picker
+          size="mini"
+          class="selectRoad"
+          style="width: 180px"
+          v-if="year == 'quarter'"
+          v-model="quarter"
+          aria-placeholder="请选季度"
+        />
+
+        <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>
-      <div class="charts keep-ratio " id="postTrendsMonth"></div>
+      <div class="charts keep-ratio" id="postTrendsMonth"></div>
     </div>
   </div>
 </template>
-  
+
 <script>
 import WgtTitle from "@screen/pages/perception/widgets/title";
 import * as echarts from "echarts";
 import chartsStatistics from "./assets/charts";
 export default {
-  name: 'postTrendsMonth',
+  name: "postTrendsMonth",
   components: {
-    WgtTitle
+    WgtTitle,
   },
   data() {
     return {
       dateTime: "",
-    }
-  },
-
-  created() {
-
+    };
   },
-  methods: {
 
-  },
+  created() {},
+  methods: {},
   mounted() {
     setTimeout(() => {
       this.$nextTick(() => {
-        var myChart = echarts.init(document.getElementById('postTrendsMonth'));
+        var myChart = echarts.init(document.getElementById("postTrendsMonth"));
         myChart.setOption(chartsStatistics);
       });
     });
   },
-}
+};
 </script>
-  
-<style lang='scss' scoped>
+
+<style lang="scss" scoped>
 .congestion {
   width: 100%;
 
@@ -61,7 +78,12 @@ 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;
@@ -72,7 +94,7 @@ export default {
       display: flex;
       align-items: center;
       height: 40px;
-      width: 100%;
+      width: 50%;
       font-size: 14px;
       margin-bottom: 10px;
       left: 20px;
@@ -102,7 +124,7 @@ export default {
 
       .selectRoad {
         width: 89px;
-        border: 1px solid #00B3CC;
+        border: 1px solid #00b3cc;
 
         ::v-deep {
           .el-input__inner {
@@ -113,25 +135,22 @@ export default {
       }
 
       .btnSearch {
-        background: linear-gradient(180deg, #005C79 0%, #009BCC 100%);
+        background: linear-gradient(180deg, #005c79 0%, #009bcc 100%);
         margin-left: 10px;
         border-color: transparent;
       }
 
       .btnReset {
-        background: linear-gradient(180deg, #005C79 0%, #009BCC 100%);
-        ;
+        background: linear-gradient(180deg, #005c79 0%, #009bcc 100%);
         border-color: transparent;
         color: white;
       }
     }
-
-
   }
 }
 
 .charts {
   height: 300px;
   width: 100%;
-}</style>
-  
\ No newline at end of file
+}
+</style>
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/index.vue
index ef8fab4e..be27eb70 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/service/publicService/index.vue
@@ -1,177 +1,166 @@
 <template>
-    <div class='TrafficFlow'>
-      <section class="foot">
-        <el-tabs class="footTabs" v-model="activeName"  @tab-click="changeTabs">
-            <el-tab-pane label="公众服务统计分析" name="first">
-              <div class="header-shot" >
-                 <TopComponent  />
-              </div>
-              <div class="content" >
-                <ChannelAnalytics  class="content-l"  />
-                <EventTypeAnalysis class="content-l"  />
-                <AuditAnalytics class="content-l"  />
-                <PostTrendsDay class="content-l"  />
-              </div>
-              <div class="content" >
-                <PostTrendsMonth   class="content-mi" />
-                <NucleusThrough   class="content-mi" />
-              </div>
-            </el-tab-pane>
-            <el-tab-pane label="公众服务统计查询" name="second">
-              
-            </el-tab-pane>
-        </el-tabs>
-      </section>
-    </div>
-  </template>
-  
-  <script> 
-  import TopComponent from './components/topComponent';
-  import ChannelAnalytics from './components/channelAnalytics';
-  import EventTypeAnalysis from './components/eventTypeAnalysis';
-  import AuditAnalytics from './components/auditAnalytics';
-  import PostTrendsDay from './components/postTrendsDay';
-  import PostTrendsMonth from './components/postTrendsMonth';
-  import NucleusThrough from './components/nucleusThrough';
-
-  export default {
-    name: 'publicService',
-    components: {
-      TopComponent,
-      ChannelAnalytics,
-      EventTypeAnalysis,
-      AuditAnalytics,
-      PostTrendsDay,
-      PostTrendsMonth,
-      NucleusThrough
-    },
-    data(){
-        return {
-            activeName:"first"
-        }
-    },
-    methods:{
-      changeTabs(){
-         
-      }
-    }
-    
+  <div class="TrafficFlow">
+    <section class="foot">
+      <el-tabs class="footTabs" v-model="activeName" @tab-click="changeTabs">
+        <el-tab-pane label="公众服务统计分析" name="first">
+          <div class="header-shot">
+            <TopComponent />
+          </div>
+          <div class="content">
+            <ChannelAnalytics class="content-l" />
+            <EventTypeAnalysis class="content-l" />
+            <AuditAnalytics class="content-l" />
+            <PostTrendsDay class="content-l" style="margin-right: 0" />
+          </div>
+          <div class="content">
+            <PostTrendsMonth class="content-mi" />
+            <NucleusThrough class="content-mi" style="margin-right: 0" />
+          </div>
+        </el-tab-pane>
+        <el-tab-pane label="公众服务统计查询" name="second"> </el-tab-pane>
+      </el-tabs>
+    </section>
+  </div>
+</template>
+
+<script>
+import TopComponent from "./components/topComponent";
+import ChannelAnalytics from "./components/channelAnalytics";
+import EventTypeAnalysis from "./components/eventTypeAnalysis";
+import AuditAnalytics from "./components/auditAnalytics";
+import PostTrendsDay from "./components/postTrendsDay";
+import PostTrendsMonth from "./components/postTrendsMonth";
+import NucleusThrough from "./components/nucleusThrough";
+
+export default {
+  name: "publicService",
+  components: {
+    TopComponent,
+    ChannelAnalytics,
+    EventTypeAnalysis,
+    AuditAnalytics,
+    PostTrendsDay,
+    PostTrendsMonth,
+    NucleusThrough,
+  },
+  data() {
+    return {
+      activeName: "first",
+    };
+  },
+  methods: {
+    changeTabs() {},
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+::v-deep .el-tabs__item {
+  display: inline-flex;
+  justify-content: center;
+  font-size: 16px;
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 500;
+  color: #ffffff;
+  min-width: 128px;
+  position: relative;
+  left: 10px;
+}
+
+::v-deep .el-tabs__active-bar {
+  min-width: 128px;
+}
+
+::v-deep .el-tabs__nav-wrap::after {
+  background-color: #133242;
+  opacity: 0.1;
+}
+
+.footTabs {
+  display: inline;
+  width: 100%;
+}
+
+.TrafficFlow {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  z-index: 6;
+  color: white;
+
+  .header-shot {
+    width: 98%;
+    margin: auto;
+    margin-top: 15px;
+    height: 160px;
   }
-  </script>
-  
-  <style lang='scss' scoped>
-
-   ::v-deep .el-tabs__item{
-    display: inline-flex;
-    justify-content: center;
-    font-size: 16px;
-    font-family: PingFang SC, PingFang SC;
-    font-weight: 500;
-    color: #FFFFFF;
-    min-width:128px;
-    position: relative;
-    left:10px;
-   }
-
-   ::v-deep .el-tabs__active-bar {
-    min-width:128px;
-   }
-
-   ::v-deep .el-tabs__nav-wrap::after {
-    background-color: #133242;
-    opacity: 0.1;
-   }
-
-   .footTabs {
-     display: inline;
-     width:100%;
-
-   }
-
-  .TrafficFlow {
+
+  .content {
     width: 100%;
-    height: 100%;
-    position: relative;
-    z-index: 6;
-    color: white;
-  
-    .header-shot{
-      width: 98%;
-      margin: auto;
-      margin-top: 15px;
-      height:160px;
+    margin: auto;
+    display: flex;
+    flex: 1;
+    pointer-events: none;
+    margin-top: 19px;
+    --keep-ratio: scaleX(1);
 
+    > div {
+      pointer-events: auto;
     }
 
-    .content {
-      width: 100%;
-      margin: auto;
-      display: flex;
-      flex: 1;
-      pointer-events: none;
-      margin-top: 19px;
-
-      >div {
-        pointer-events: auto;
-      }
-  
-      .content-l {
-        width: calc(25%);
-     
-        margin-right:20px;
+    .content-l {
+      width: calc(25%);
 
-      }
+      margin-right: 20px;
+    }
 
-      .content-mi {
-        width: calc(50%);
-     
-        margin-right:20px;
-      }
-  
-  
-      .content-m {
-        display: inline-flex;
-        flex-direction: column;
-        width: calc(100% / 4 );
-        margin-right:20px;
-
-        .content-m-t {
-            width:100%;
-            height:240px;
-            margin-bottom: 20px;
-        }
-      }
-      .content-r {
-        width: 49.4%;
-      }
+    .content-mi {
+      width: calc(50%);
+
+      margin-right: 20px;
     }
-    .foot{
-      width: 98%;
-      margin: auto;
-      display: flex;
-      justify-content: space-between;
-      flex: 1;
-      pointer-events: none;
-      margin-top: 8px;
-      >div {
-        pointer-events: auto;
-      }
 
-      .foot-w {
-        width:100%;
+    .content-m {
+      display: inline-flex;
+      flex-direction: column;
+      width: calc(100% / 4);
+      margin-right: 20px;
 
+      .content-m-t {
+        width: 100%;
+        height: 240px;
+        margin-bottom: 20px;
       }
-  
-      .foot-l {
-        width: 726px;
-      }
-      .foot-m {
-        width: 613px;
-      }
-      .foot-r {
-        width: 493px;
-      }
+    }
+    .content-r {
+      width: 49.4%;
+    }
+  }
+  .foot {
+    width: 98%;
+    margin: auto;
+    display: flex;
+    justify-content: space-between;
+    flex: 1;
+    pointer-events: none;
+    margin-top: 8px;
+    > div {
+      pointer-events: auto;
+    }
+
+    .foot-w {
+      width: 100%;
+    }
+
+    .foot-l {
+      width: 726px;
+    }
+    .foot-m {
+      width: 613px;
+    }
+    .foot-r {
+      width: 493px;
     }
   }
-  </style>
-  
\ No newline at end of file
+}
+</style>
diff --git a/ruoyi-ui/src/views/JiHeExpressway/utils/enum.js b/ruoyi-ui/src/views/JiHeExpressway/utils/enum.js
index 33c2c982..cad7cfc3 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/utils/enum.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/utils/enum.js
@@ -129,6 +129,9 @@ export const InfoWarningSource = {
   6: {
     text: "非机预警",
   },
+  7: {
+    text: "气象监测器",
+  }
 };
 
 // 事件主类 warningType
diff --git a/ruoyi-ui/src/views/login copy.vue b/ruoyi-ui/src/views/login copy.vue
new file mode 100644
index 00000000..a65882cb
--- /dev/null
+++ b/ruoyi-ui/src/views/login copy.vue	
@@ -0,0 +1,461 @@
+<template>
+  <div class="login">
+    <!-- <Bg2 style=" width: 600px; height:800px; position: fixed; left: 100px; top:100px">发多少刚发的刚发的</Bg2> -->
+    <el-form
+      ref="loginForm"
+      :model="loginForm"
+      :rules="loginRules"
+      class="login-form"
+    >
+      <div
+        style="
+          width: 100%;
+          text-align: center;
+          padding-right: 20px;
+          padding-bottom: 10px;
+        "
+      >
+        <!-- <img src="../assets/image/login-logo.png" width="120px;" /> -->
+        <div class="loginTitle">欢迎登录</div>
+      </div>
+      <div class="title">{{ "" }}</div>
+      <el-form-item prop="username" style="margin-top: 40px">
+        <el-input
+          v-model="loginForm.username"
+          type="text"
+          auto-complete="off"
+          placeholder="请输入用户名"
+          class="username"
+        >
+          <img
+            slot="prefix"
+            src="../assets/images/Vector.png"
+            class="el-input__icon input-icon"
+          />
+        </el-input>
+        <!-- <div style="border-bottom: 1px solid #cfcfcf; margin-top: 5px"></div> -->
+      </el-form-item>
+      <el-form-item prop="password">
+        <el-input
+          v-model="loginForm.password"
+          type="password"
+          auto-complete="off"
+          placeholder="请输入密码"
+          @keyup.enter.native="handleLogin"
+          class="password"
+        >
+          <img
+            slot="prefix"
+            src="../assets/images/locked.png"
+            class="el-input__icon input-icon"
+          />
+        </el-input>
+        <!-- <div style="border-bottom: 1px solid #cfcfcf; margin-top: 5px"></div> -->
+      </el-form-item>
+      <Verify
+        @success="capctchaCheckSuccess"
+        :mode="'pop'"
+        :captchaType="'blockPuzzle'"
+        :imgSize="{ width: '330px', height: '155px' }"
+        ref="verify"
+      ></Verify>
+      <el-checkbox
+        v-model="loginForm.rememberMe"
+        style="margin: 40px 0px 20px 0px"
+        >记住密码</el-checkbox
+      >
+      <el-form-item style="width: 100%; text-align: center">
+        <el-button
+          :loading="loading"
+          size="medium"
+          type="goon"
+          style="width: 100%"
+          @click.native.prevent="handleLogin"
+        >
+          <span v-if="!loading">登 录</span>
+          <span v-else>登 录 中...</span>
+        </el-button>
+        <div style="float: right" v-if="register">
+          <router-link class="link-type" :to="'/register'"
+            >立即注册</router-link
+          >
+        </div>
+      </el-form-item>
+    </el-form>
+
+    <!--  底部  -->
+    <div class="el-login-footer">
+      <!-- <span>Copyright ©hamdell All Rights Reserved.</span> -->
+    </div>
+  </div>
+</template>
+
+<script>
+import Cookies from "js-cookie";
+import { encrypt, decrypt } from "@/utils/jsencrypt";
+import Verify from "@/components/Verifition/Verify";
+import { getCaptchaOnOff } from "@/api/login.js";
+import { listOrder } from "@/api/payment/order";
+import { getUserDeptId } from "@/api/system/user";
+import { listTunnels } from "@/api/equipment/tunnel/api.js";
+import { getConfigKey } from "@/api/system/config.js";
+
+import Bg2 from "@screen/components/Decorations/bg-2.vue";
+
+export default {
+  components: { Verify, Bg2 },
+  name: "Login",
+  data() {
+    return {
+      title: "", // 系统标题
+      cookiePassword: "",
+      loginForm: {
+        // username: "admin",
+        // password: "dxc123!@#",
+        //dxc123!@#
+        username: "",
+        password: "",
+        rememberMe: false,
+        code: "",
+        uuid: "",
+      },
+      loginRules: {
+        username: [
+          { required: true, trigger: "blur", message: "请输入您的账号" },
+        ],
+        password: [
+          { required: true, trigger: "blur", message: "请输入您的密码" },
+        ],
+      },
+      loading: false,
+      // 验证码开关
+      captchaOnOff: false,
+      // 注册开关
+      register: false,
+      redirect: undefined,
+    };
+  },
+  watch: {
+    $route: {
+      handler: function (route) {
+        this.redirect = route.query && route.query.redirect;
+      },
+      immediate: true,
+    },
+  },
+  created() {
+    this.getCookie();
+    //this.getCaptchaOnOffFun();
+    this.title = systemConfig.title(systemConfig.systemType);
+  },
+  methods: {
+    // 获取验证码是否开启
+    getCaptchaOnOffFun() {
+      getCaptchaOnOff().then((response) => {
+        this.captchaOnOff = response.captchaOnOff;
+      });
+    },
+    // 验证码
+    capctchaCheckSuccess(params) {
+      this.loginForm.code = params.captchaVerification;
+      this.loading = true;
+      console.log(this.loginForm.rememberMe, "=======================");
+      if (this.loginForm.rememberMe == true) {
+        Cookies.set("username", this.loginForm.username, { expires: 30 });
+        Cookies.set("password", encrypt(this.loginForm.password), {
+          expires: 30,
+        });
+        Cookies.set("rememberMe", this.loginForm.rememberMe, { expires: 30 });
+      } else {
+        Cookies.remove("username");
+        Cookies.remove("password");
+        Cookies.remove("rememberMe");
+      }
+      this.$store
+        .dispatch("Login", this.loginForm)
+        .then(() => {
+          this.$router.push({ path: this.redirect || "/" }).catch(() => {});
+        })
+        .catch(() => {
+          this.loading = false;
+        });
+    },
+    getCookie() {
+      const username = Cookies.get("username");
+      const password = Cookies.get("password");
+      const rememberMe = Cookies.get("rememberMe");
+      console.log("rem", rememberMe);
+      this.loginForm = {
+        username: username === undefined ? this.loginForm.username : username,
+        password:
+          password === undefined ? this.loginForm.password : decrypt(password),
+        rememberMe: rememberMe === undefined ? false : Boolean(rememberMe),
+      };
+    },
+    handleLogin() {
+      if (this.captchaOnOff) {
+        this.$refs.loginForm.validate((valid) => {
+          if (valid) {
+            this.$refs.verify.show();
+          }
+        });
+      } else {
+        if (this.loginForm.rememberMe == true) {
+          Cookies.set("username", this.loginForm.username, { expires: 30 });
+          Cookies.set("password", encrypt(this.loginForm.password), {
+            expires: 30,
+          });
+          Cookies.set("rememberMe", this.loginForm.rememberMe, { expires: 30 });
+        } else {
+          Cookies.remove("username");
+          Cookies.remove("password");
+          Cookies.remove("rememberMe");
+        }
+
+        this.$store
+          .dispatch("Login", this.loginForm)
+          .then(() => {
+            this.$router.push({ path: this.redirect || "/" }).catch(() => {});
+            // this.getManageStation();
+          })
+          .catch(() => {
+            this.loading = false;
+          });
+      }
+    },
+    getManageStation() {
+      getConfigKey("sd.moduleSwitch").then((res) => {
+        console.log(res, "管理站01");
+        this.$cache.local.set("manageStation", res.msg);
+      });
+      getConfigKey("sd.navigationBar").then((res) => {
+        console.log(res, "res");
+        let sideTheme = "theme-blue";
+        if (res.msg == "0") {
+          sideTheme = "theme-dark";
+        } else {
+          sideTheme = "theme-blue";
+        }
+        // console.log(res, "是否胡山隧道，胡山单独导航栏样式");
+        this.$cache.local.set("navigationBar", res.msg);
+        this.$store.dispatch("settings/changeSetting", {
+          key: "sideTheme",
+          value: sideTheme,
+        });
+        // this.sideTheme = val;
+        this.$cache.local.set(
+          "layout-setting",
+          `{
+            "topNav":${this.$store.state.settings.topNav},
+            "tagsView":${this.$store.state.settings.tagsView},
+            "weatherView":${this.$store.state.settings.weatherView},
+            "fixedHeader":${this.$store.state.settings.fixedHeader},
+            "sidebarLogo":${this.$store.state.settings.sidebarLogo},
+            "dynamicTitle":${this.$store.state.settings.dynamicTitle},
+            "sideTheme":"${sideTheme}",
+            "theme":"${this.$store.state.settings.theme}"
+          }`
+        );
+        // console.log(this.$store.state.settings.sideTheme)
+      });
+    },
+  },
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+::v-deep .el-input__inner {
+  background-color: transparent !important;
+  height: 100%;
+  font-size: 22px;
+  font-family: Source Han Sans CN, Source Han Sans CN;
+  font-weight: 400;
+  color: #07caf6;
+  margin-left: 68px;
+}
+
+::v-deep .el-checkbox__label {
+  color: #fff;
+  font-size: 18px !important;
+  font-family: Source Han Sans CN, Source Han Sans CN;
+  font-weight: 400;
+  color: #ffffff !important;
+  margin-bottom: 10px;
+}
+
+::v-deep .el-form-item__error {
+  position: absolute;
+  top: 75px;
+}
+
+::v-deep .el-input__inner::placeholder {
+  color: #07caf6;
+}
+
+.login {
+  position: relative;
+  height: 100%;
+  background-image: url("../assets/images/login-background.png");
+  // background-size: 100% auto;
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+}
+
+.login::after {
+  content: "";
+  position: absolute;
+  width: 100%;
+  height: 120px;
+  background-image: url("../assets/images/login-head.png");
+  background-repeat: no-repeat;
+  background-size: auto 100%;
+  background-position: center center;
+}
+
+.title {
+  margin: 0px auto 10px auto;
+  font-size: 24px;
+  text-align: center;
+  color: #353f55;
+  letter-spacing: 2px;
+}
+
+.login-form::after {
+  content: "";
+  position: absolute;
+  left: -4px;
+  top: 0px;
+  width: 4px;
+  height: 100%;
+  background: linear-gradient(
+    180deg,
+    #bdfff600 0%,
+    #bdfff6 50%,
+    #bdfff600 100%
+  );
+}
+
+.login-form::before {
+  content: "";
+  position: absolute;
+  right: -4px;
+  top: 0px;
+  width: 4px;
+  height: 100%;
+  background: linear-gradient(
+    180deg,
+    #bdfff600 0%,
+    #bdfff6 50%,
+    #bdfff600 100%
+  );
+}
+
+.login-form {
+  position: absolute;
+  left: 50%;
+  top: 20%;
+  transform: translateX(-50%);
+  width: 400px;
+  height: 500px;
+  background: #00000080;
+  border-radius: 0px 0px 0px 0px;
+  opacity: 1;
+  border: 4px solid #0c5963;
+  padding: 50px;
+  // margin-left: 50%;
+
+  .loginTitle {
+    display: inline-flex;
+    width: 100%;
+    height: 45px;
+    font-size: 30px;
+    font-family: Source Han Sans CN, Source Han Sans CN;
+    font-weight: 500;
+    color: #ffffff;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .el-input {
+    width: 300px;
+    height: 60px;
+    border-radius: 4px 4px 4px 4px;
+    opacity: 1;
+    border: 1px solid #01cffe;
+    background-color: transparent;
+    margin-bottom: 12px;
+
+    ::v-deep .el-input__inner {
+      font-size: 20px !important;
+    }
+
+    input {
+      border: 0;
+      height: 35px;
+    }
+  }
+
+  .input-icon {
+    height: 20px;
+    width: 20px;
+    margin-left: 2px;
+    position: relative;
+    left: 14px;
+    top: 18px;
+  }
+}
+
+.login-tip {
+  font-size: 13px;
+  text-align: center;
+  color: #bfbfbf;
+}
+
+.login-code {
+  width: 37%;
+  height: 35px;
+  float: right;
+
+  img {
+    cursor: pointer;
+    vertical-align: middle;
+  }
+}
+
+.el-login-footer {
+  height: 40px;
+  line-height: 40px;
+  position: fixed;
+  bottom: 0;
+  width: 100%;
+  text-align: center;
+  color: #fff;
+  font-family: Arial;
+  font-size: 12px;
+  letter-spacing: 1px;
+}
+
+.login-code-img {
+  height: 35px;
+}
+
+/* 重置按钮 */
+.el-button--goon {
+  font-size: 24px;
+  font-weight: 400;
+  color: #fff;
+  width: 380px;
+  height: 55px;
+  background: #07caf6;
+  border-radius: 4px;
+  opacity: 1;
+  border: none;
+}
+
+.el-button--goon:hover {
+}
+
+::v-deep .el-form-item__error {
+  top: 62px;
+}
+</style>
diff --git a/ruoyi-ui/src/views/login.vue b/ruoyi-ui/src/views/login.vue
index 6b0ab0a5..1f1ab1c8 100644
--- a/ruoyi-ui/src/views/login.vue
+++ b/ruoyi-ui/src/views/login.vue
@@ -1,43 +1,79 @@
 <template>
   <div class="login">
-    <!-- <Bg2 style=" width: 600px; height:800px; position: fixed; left: 100px; top:100px">发多少刚发的刚发的</Bg2> -->
-    <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
-      <div style="
-          width: 100%;
-          text-align: center;
-          padding-right: 20px;
-          padding-bottom: 10px;
-        ">
-        <!-- <img src="../assets/image/login-logo.png" width="120px;" /> -->
-        <div class="loginTitle">欢迎登录</div>
+    <div class="login-content">
+      <div class="login-l">
+        <div class="logo"><img src="../assets/images/login/logo.png" /></div>
+        <span>山东高速</span>
+        <span>济菏数字运营管理平台</span>
       </div>
-      <div class="title">{{ '' }}</div>
-      <el-form-item prop="username" style="margin-top: 40px;">
-        <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="请输入用户名" class="username">
-          <img slot="prefix" src="../assets/images/Vector.png" class="el-input__icon input-icon" />
-        </el-input>
-        <!-- <div style="border-bottom: 1px solid #cfcfcf; margin-top: 5px"></div> -->
-      </el-form-item>
-      <el-form-item prop="password">
-        <el-input v-model="loginForm.password" type="password" auto-complete="off" placeholder="请输入密码"
-          @keyup.enter.native="handleLogin" class="password">
-          <img slot="prefix" src="../assets/images/locked.png" class="el-input__icon input-icon" />
-        </el-input>
-        <!-- <div style="border-bottom: 1px solid #cfcfcf; margin-top: 5px"></div> -->
-      </el-form-item>
-      <Verify @success="capctchaCheckSuccess" :mode="'pop'" :captchaType="'blockPuzzle'"
-        :imgSize="{ width: '330px', height: '155px' }" ref="verify"></Verify>
-      <el-checkbox v-model="loginForm.rememberMe" style="margin:40px 0px 20px 0px;">记住密码</el-checkbox>
-      <el-form-item style="width: 100%; text-align: center">
-        <el-button :loading="loading" size="medium" type="goon" style="width: 100%" @click.native.prevent="handleLogin">
-          <span v-if="!loading">登 录</span>
-          <span v-else>登 录 中...</span>
-        </el-button>
-        <div style="float: right" v-if="register">
-          <router-link class="link-type" :to="'/register'">立即注册</router-link>
-        </div>
-      </el-form-item>
-    </el-form>
+      <div class="login-r">
+        <span class="title">欢迎登录</span>
+        <img class="line" src="../assets/images/login/139.png" />
+        <el-form
+          ref="loginForm"
+          :model="loginForm"
+          :rules="loginRules"
+          class="login-form"
+          ><el-form-item prop="username">
+            <el-input
+              v-model="loginForm.username"
+              type="text"
+              auto-complete="off"
+              placeholder="请输入用户名"
+              class="username"
+            >
+              <img
+                slot="prefix"
+                src="../assets/images/login/user.png"
+                class="el-input__icon input-icon"
+              />
+            </el-input>
+          </el-form-item>
+          <el-form-item prop="password">
+            <el-input
+              v-model="loginForm.password"
+              type="password"
+              auto-complete="off"
+              placeholder="请输入密码"
+              @keyup.enter.native="handleLogin"
+              class="password"
+            >
+              <img
+                slot="prefix"
+                src="../assets/images/login/password.png"
+                class="el-input__icon input-icon"
+              />
+            </el-input>
+          </el-form-item>
+          <Verify
+            @success="capctchaCheckSuccess"
+            :mode="'pop'"
+            :captchaType="'blockPuzzle'"
+            :imgSize="{ width: '330px', height: '155px' }"
+            ref="verify"
+          ></Verify>
+          <el-checkbox v-model="loginForm.rememberMe">记住密码</el-checkbox>
+          <el-form-item>
+            <el-button
+              class="btn"
+              :loading="loading"
+              size="medium"
+              type="goon"
+              style="width: 100%"
+              @click.native.prevent="handleLogin"
+            >
+              <span v-if="!loading">登 录</span>
+              <span v-else>登 录 中...</span>
+            </el-button>
+            <div style="float: right" v-if="register">
+              <router-link class="link-type" :to="'/register'"
+                >立即注册</router-link
+              >
+            </div>
+          </el-form-item>
+        </el-form>
+      </div>
+    </div>
 
     <!--  底部  -->
     <div class="el-login-footer">
@@ -56,9 +92,7 @@ import { getUserDeptId } from "@/api/system/user";
 import { listTunnels } from "@/api/equipment/tunnel/api.js";
 import { getConfigKey } from "@/api/system/config.js";
 
-
-import Bg2 from "@screen/components/Decorations/bg-2.vue"
-
+import Bg2 from "@screen/components/Decorations/bg-2.vue";
 
 export default {
   components: { Verify, Bg2 },
@@ -132,7 +166,7 @@ export default {
       this.$store
         .dispatch("Login", this.loginForm)
         .then(() => {
-          this.$router.push({ path: this.redirect || "/" }).catch(() => { });
+          this.$router.push({ path: this.redirect || "/" }).catch(() => {});
         })
         .catch(() => {
           this.loading = false;
@@ -158,7 +192,6 @@ export default {
           }
         });
       } else {
-
         if (this.loginForm.rememberMe == true) {
           Cookies.set("username", this.loginForm.username, { expires: 30 });
           Cookies.set("password", encrypt(this.loginForm.password), {
@@ -174,7 +207,7 @@ export default {
         this.$store
           .dispatch("Login", this.loginForm)
           .then(() => {
-            this.$router.push({ path: this.redirect || "/" }).catch(() => { });
+            this.$router.push({ path: this.redirect || "/" }).catch(() => {});
             // this.getManageStation();
           })
           .catch(() => {
@@ -188,7 +221,7 @@ export default {
         this.$cache.local.set("manageStation", res.msg);
       });
       getConfigKey("sd.navigationBar").then((res) => {
-        console.log(res, "res")
+        console.log(res, "res");
         let sideTheme = "theme-blue";
         if (res.msg == "0") {
           sideTheme = "theme-dark";
@@ -224,155 +257,170 @@ export default {
 
 <style rel="stylesheet/scss" lang="scss" scoped>
 ::v-deep .el-input__inner {
-  background-color: transparent !important;
-  height: 100%;
-  font-size: 22px;
-  font-family: Source Han Sans CN, Source Han Sans CN;
+  background-color: #fff !important;
+  height: 34px;
+  font-size: 14px;
   font-weight: 400;
-  color: #07CAF6;
-  margin-left: 68px;
+  color: #999999;
+  border: 1px solid rgba(0, 145, 67, 0.5);
+  // margin-left: 20px;
 }
 
 ::v-deep .el-checkbox__label {
-  color: #fff;
-  font-size: 18px !important;
-  font-family: Source Han Sans CN, Source Han Sans CN;
+  color: #999;
+  font-size: 12px !important;
   font-weight: 400;
-  color: #FFFFFF !important;
+  color: #999 !important;
   margin-bottom: 10px;
+  margin-top: 20px;
 }
 
-
-::v-deep .el-form-item__error {
-  position: absolute;
-  top: 75px;
-}
+// ::v-deep .el-form-item__error {
+//   position: absolute;
+//   top: 75px;
+// }
 
 ::v-deep .el-input__inner::placeholder {
-  color: #07CAF6;
+  color: #999999;
 }
 
 .login {
   position: relative;
   height: 100%;
-  background-image: url("../assets/images/login-background.png");
+  background-image: url("../assets/images/login/login-background.png");
   // background-size: 100% auto;
   background-repeat: no-repeat;
   background-size: 100% 100%;
 }
 
-.login::after {
-  content: "";
-  position: absolute;
-  width: 100%;
-  height: 120px;
-  background-image: url('../assets/images/login-head.png');
-  background-repeat: no-repeat;
-  background-size: auto 100%;
-  background-position: center center;
-}
-
-.title {
-  margin: 0px auto 10px auto;
-  font-size: 24px;
-  text-align: center;
-  color: #353f55;
-  letter-spacing: 2px;
-}
-
-.login-form::after {
-  content: "";
-  position: absolute;
-  left: -4px;
-  top: 0px;
-  width: 4px;
-  height: 100%;
-  background: linear-gradient(180deg, #BDFFF600 0%, #BDFFF6 50%, #BDFFF600 100%);
-  ;
-}
-
-.login-form::before {
-  content: "";
-  position: absolute;
-  right: -4px;
-  top: 0px;
-  width: 4px;
-  height: 100%;
-  background: linear-gradient(180deg, #BDFFF600 0%, #BDFFF6 50%, #BDFFF600 100%);
-}
-
-.login-form {
+.login-content {
   position: absolute;
   left: 50%;
-  top: 20%;
+  top: 367px;
   transform: translateX(-50%);
-  width: 400px;
-  height: 500px;
-  background: #00000080;
-  border-radius: 0px 0px 0px 0px;
-  opacity: 1;
-  border: 4px solid #0C5963;
-  padding: 50px;
-  // margin-left: 50%;
-
-  .loginTitle {
-    display: inline-flex;
-    width: 100%;
-    height: 45px;
-    font-size: 30px;
-    font-family: Source Han Sans CN, Source Han Sans CN;
-    font-weight: 500;
-    color: #FFFFFF;
-    justify-content: center;
-    align-items: center;
+  width: 700px;
+  height: 367px;
+  background: rgba(10, 82, 123, 0.6);
+  display: flex;
+  .login-l {
+    // width: 300px;
+    margin-top: 42px;
+    margin-left: 25px;
+    .logo {
+      width: 177px;
+      height: 135px;
+      margin: auto;
+      margin-bottom: 10px;
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+    span {
+      display: block;
+      font-family: PingFang;
+      font-weight: 600;
+      font-size: 30px;
+      color: rgba(42, 217, 253, 0.7);
+      line-height: 35px;
+      text-align: center;
+      margin-top: 20px;
+    }
   }
+  .login-r {
+    width: 320px;
+    height: 290px;
+    margin-right: 27px;
+    margin-top: 42px;
+    margin-left: 20px;
+    background: #c9e5eb;
+    padding: 25px 22px;
+
+    .title {
+      display: block;
+      width: 100%;
+      font-family: PingFang;
+      font-weight: 600;
+      font-size: 28px;
+      color: #009143;
+      text-align: center;
+    }
+    .line {
+      width: 210px;
+      height: 3px;
+      display: block;
+      margin: auto;
+      margin-bottom: 20px;
+    }
+    .btn {
+      margin: auto;
+      width: 155px;
+      height: 34px;
+      background: #009143;
+      border-radius: 1px;
+      color: #fff;
+      font-size: 16px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      margin-top: 5px;
+    }
+  }
+  // .loginTitle {
+  //   display: inline-flex;
+  //   width: 100%;
+  //   height: 45px;
+  //   font-size: 30px;
+  //   font-family: Source Han Sans CN, Source Han Sans CN;
+  //   font-weight: 500;
+  //   color: #ffffff;
+  //   justify-content: center;
+  //   align-items: center;
+  // }
 
   .el-input {
-    width: 300px;
-    height: 60px;
-    border-radius: 4px 4px 4px 4px;
-    opacity: 1;
-    border: 1px solid #01CFFE;
-    background-color: transparent;
-    margin-bottom: 12px;
+    width: 275px;
+    height: 36px;
+    border-radius: 2px;
+    background: #fff;
+    padding-left: 20px;
 
     ::v-deep .el-input__inner {
-      font-size: 20px !important;
+      font-size: 14px !important;
     }
 
-
     input {
       border: 0;
-      height: 35px;
+      height: 36px;
     }
   }
 
   .input-icon {
     height: 20px;
     width: 20px;
-    margin-left: 2px;
+    margin-right: 10px;
     position: relative;
-    left: 14px;
-    top: 18px;
+    left: 10px;
+    top: 7px;
   }
 }
 
-.login-tip {
-  font-size: 13px;
-  text-align: center;
-  color: #bfbfbf;
-}
+// .login-tip {
+//   font-size: 13px;
+//   text-align: center;
+//   color: #bfbfbf;
+// }
 
-.login-code {
-  width: 37%;
-  height: 35px;
-  float: right;
+// .login-code {
+//   width: 37%;
+//   height: 35px;
+//   float: right;
 
-  img {
-    cursor: pointer;
-    vertical-align: middle;
-  }
-}
+//   img {
+//     cursor: pointer;
+//     vertical-align: middle;
+//   }
+// }
 
 .el-login-footer {
   height: 40px;
@@ -395,18 +443,19 @@ export default {
 .el-button--goon {
   font-size: 24px;
   font-weight: 400;
-  color: #FFF;
+  color: #fff;
   width: 380px;
   height: 55px;
-  background: #07CAF6;
+  background: #07caf6;
   border-radius: 4px;
   opacity: 1;
   border: none;
 }
 
-.el-button--goon:hover {}
+.el-button--goon:hover {
+}
 
-::v-deep .el-form-item__error{
-  top:62px;
+::v-deep .el-form-item__error {
+  top: 62px;
 }
 </style>