From 40ed65ebe8138ae2f1125cf11e5390ccc5e79db6 Mon Sep 17 00:00:00 2001
From: hui <770260999@qq.com>
Date: Fri, 2 Feb 2024 17:16:50 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/AppMain.vue                    |   0
 .../components/InnerLink/index.vue            |   0
 .../{_layout => layout}/components/Navbar.vue |   0
 .../components/Settings/index.vue             |   0
 .../components/Sidebar/FixiOSBug.js           |   0
 .../components/Sidebar/Item.vue               |   0
 .../components/Sidebar/Link.vue               |   0
 .../components/Sidebar/Logo.vue               |   0
 .../components/Sidebar/SidebarItem.vue        |   0
 .../components/Sidebar/index.vue              |   0
 .../components/Sidebarblue/FixiOSBug.js       |   0
 .../components/Sidebarblue/ItemBlue.vue       |   0
 .../components/Sidebarblue/LinkBlue.vue       |   0
 .../components/Sidebarblue/LogoBlue.vue       |   0
 .../Sidebarblue/SidebarItemBlue.vue           |   0
 .../components/Sidebarblue/index.vue          |   0
 .../components/TagsView/ScrollPane.vue        |   0
 .../components/TagsView/index.vue             |   0
 .../{_layout => layout}/components/index.js   |   0
 ruoyi-ui/src/{_layout => layout}/index.vue    |   1 +
 .../mixin/ResizeHandler.js                    |   0
 ruoyi-ui/src/main.js                          |   4 +-
 ruoyi-ui/src/router/index.js                  |  30 +-
 ruoyi-ui/src/router/routerCreater.js          |   1 -
 ruoyi-ui/src/settings.js                      |   2 +-
 .../views/JiHeExpressway/components/empty.vue |   2 +
 .../components/infoBoard/BoardInfoEditor.vue  |   2 +-
 .../JiHeExpressway/images/deviceType/ball.svg |  44 +-
 .../views/JiHeExpressway/mixins/InfoBoard.js  |   5 +-
 .../statisticalAnalysis/assets/charts.js      |  23 +-
 .../components/deviceSummary/index.vue        | 253 ++++++++
 .../components/deviceUptime/assets/charts.js  | 147 +----
 .../components/deviceUptime/index.vue         |  59 +-
 .../monthlyEquipment/EllipseData.vue          | 105 ++++
 .../components/monthlyEquipment/index.vue     | 410 +++++--------
 .../statisticalAnalysis/index.vue             | 543 +++++-------------
 ruoyi-ui/vue.config.js                        |   5 +-
 37 files changed, 774 insertions(+), 862 deletions(-)
 rename ruoyi-ui/src/{_layout => layout}/components/AppMain.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/InnerLink/index.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Navbar.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Settings/index.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Sidebar/FixiOSBug.js (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Sidebar/Item.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Sidebar/Link.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Sidebar/Logo.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Sidebar/SidebarItem.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Sidebar/index.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Sidebarblue/FixiOSBug.js (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Sidebarblue/ItemBlue.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Sidebarblue/LinkBlue.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Sidebarblue/LogoBlue.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Sidebarblue/SidebarItemBlue.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/Sidebarblue/index.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/TagsView/ScrollPane.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/TagsView/index.vue (100%)
 rename ruoyi-ui/src/{_layout => layout}/components/index.js (100%)
 rename ruoyi-ui/src/{_layout => layout}/index.vue (99%)
 rename ruoyi-ui/src/{_layout => layout}/mixin/ResizeHandler.js (100%)
 create mode 100644 ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/deviceSummary/index.vue
 create mode 100644 ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/monthlyEquipment/EllipseData.vue

diff --git a/ruoyi-ui/src/_layout/components/AppMain.vue b/ruoyi-ui/src/layout/components/AppMain.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/AppMain.vue
rename to ruoyi-ui/src/layout/components/AppMain.vue
diff --git a/ruoyi-ui/src/_layout/components/InnerLink/index.vue b/ruoyi-ui/src/layout/components/InnerLink/index.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/InnerLink/index.vue
rename to ruoyi-ui/src/layout/components/InnerLink/index.vue
diff --git a/ruoyi-ui/src/_layout/components/Navbar.vue b/ruoyi-ui/src/layout/components/Navbar.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Navbar.vue
rename to ruoyi-ui/src/layout/components/Navbar.vue
diff --git a/ruoyi-ui/src/_layout/components/Settings/index.vue b/ruoyi-ui/src/layout/components/Settings/index.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Settings/index.vue
rename to ruoyi-ui/src/layout/components/Settings/index.vue
diff --git a/ruoyi-ui/src/_layout/components/Sidebar/FixiOSBug.js b/ruoyi-ui/src/layout/components/Sidebar/FixiOSBug.js
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Sidebar/FixiOSBug.js
rename to ruoyi-ui/src/layout/components/Sidebar/FixiOSBug.js
diff --git a/ruoyi-ui/src/_layout/components/Sidebar/Item.vue b/ruoyi-ui/src/layout/components/Sidebar/Item.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Sidebar/Item.vue
rename to ruoyi-ui/src/layout/components/Sidebar/Item.vue
diff --git a/ruoyi-ui/src/_layout/components/Sidebar/Link.vue b/ruoyi-ui/src/layout/components/Sidebar/Link.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Sidebar/Link.vue
rename to ruoyi-ui/src/layout/components/Sidebar/Link.vue
diff --git a/ruoyi-ui/src/_layout/components/Sidebar/Logo.vue b/ruoyi-ui/src/layout/components/Sidebar/Logo.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Sidebar/Logo.vue
rename to ruoyi-ui/src/layout/components/Sidebar/Logo.vue
diff --git a/ruoyi-ui/src/_layout/components/Sidebar/SidebarItem.vue b/ruoyi-ui/src/layout/components/Sidebar/SidebarItem.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Sidebar/SidebarItem.vue
rename to ruoyi-ui/src/layout/components/Sidebar/SidebarItem.vue
diff --git a/ruoyi-ui/src/_layout/components/Sidebar/index.vue b/ruoyi-ui/src/layout/components/Sidebar/index.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Sidebar/index.vue
rename to ruoyi-ui/src/layout/components/Sidebar/index.vue
diff --git a/ruoyi-ui/src/_layout/components/Sidebarblue/FixiOSBug.js b/ruoyi-ui/src/layout/components/Sidebarblue/FixiOSBug.js
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Sidebarblue/FixiOSBug.js
rename to ruoyi-ui/src/layout/components/Sidebarblue/FixiOSBug.js
diff --git a/ruoyi-ui/src/_layout/components/Sidebarblue/ItemBlue.vue b/ruoyi-ui/src/layout/components/Sidebarblue/ItemBlue.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Sidebarblue/ItemBlue.vue
rename to ruoyi-ui/src/layout/components/Sidebarblue/ItemBlue.vue
diff --git a/ruoyi-ui/src/_layout/components/Sidebarblue/LinkBlue.vue b/ruoyi-ui/src/layout/components/Sidebarblue/LinkBlue.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Sidebarblue/LinkBlue.vue
rename to ruoyi-ui/src/layout/components/Sidebarblue/LinkBlue.vue
diff --git a/ruoyi-ui/src/_layout/components/Sidebarblue/LogoBlue.vue b/ruoyi-ui/src/layout/components/Sidebarblue/LogoBlue.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Sidebarblue/LogoBlue.vue
rename to ruoyi-ui/src/layout/components/Sidebarblue/LogoBlue.vue
diff --git a/ruoyi-ui/src/_layout/components/Sidebarblue/SidebarItemBlue.vue b/ruoyi-ui/src/layout/components/Sidebarblue/SidebarItemBlue.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Sidebarblue/SidebarItemBlue.vue
rename to ruoyi-ui/src/layout/components/Sidebarblue/SidebarItemBlue.vue
diff --git a/ruoyi-ui/src/_layout/components/Sidebarblue/index.vue b/ruoyi-ui/src/layout/components/Sidebarblue/index.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/Sidebarblue/index.vue
rename to ruoyi-ui/src/layout/components/Sidebarblue/index.vue
diff --git a/ruoyi-ui/src/_layout/components/TagsView/ScrollPane.vue b/ruoyi-ui/src/layout/components/TagsView/ScrollPane.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/TagsView/ScrollPane.vue
rename to ruoyi-ui/src/layout/components/TagsView/ScrollPane.vue
diff --git a/ruoyi-ui/src/_layout/components/TagsView/index.vue b/ruoyi-ui/src/layout/components/TagsView/index.vue
similarity index 100%
rename from ruoyi-ui/src/_layout/components/TagsView/index.vue
rename to ruoyi-ui/src/layout/components/TagsView/index.vue
diff --git a/ruoyi-ui/src/_layout/components/index.js b/ruoyi-ui/src/layout/components/index.js
similarity index 100%
rename from ruoyi-ui/src/_layout/components/index.js
rename to ruoyi-ui/src/layout/components/index.js
diff --git a/ruoyi-ui/src/_layout/index.vue b/ruoyi-ui/src/layout/index.vue
similarity index 99%
rename from ruoyi-ui/src/_layout/index.vue
rename to ruoyi-ui/src/layout/index.vue
index fe8f9720..b2f24420 100644
--- a/ruoyi-ui/src/_layout/index.vue
+++ b/ruoyi-ui/src/layout/index.vue
@@ -1,5 +1,6 @@
 <template>
   <div>
+    {{ sideTheme }}
     <template v-if="sideTheme == 'theme-dark' ||
       sideTheme == 'theme-light' ||
       sideTheme == 'theme-blue'
diff --git a/ruoyi-ui/src/_layout/mixin/ResizeHandler.js b/ruoyi-ui/src/layout/mixin/ResizeHandler.js
similarity index 100%
rename from ruoyi-ui/src/_layout/mixin/ResizeHandler.js
rename to ruoyi-ui/src/layout/mixin/ResizeHandler.js
diff --git a/ruoyi-ui/src/main.js b/ruoyi-ui/src/main.js
index 01793689..a93db47b 100644
--- a/ruoyi-ui/src/main.js
+++ b/ruoyi-ui/src/main.js
@@ -61,9 +61,9 @@ import preventClick from './api/clickOnceAtime'
 // import gisMap from 'gis-map-admin'
 import config from '../public/config'
 
-
 import request from '../public/config'
 import moment from 'moment'
+window.moment = moment
 import dayjs from "dayjs"
 
 //定义全局过滤器
@@ -78,7 +78,7 @@ Vue.filter('dateformat', function (dataStr, pattern = 'YYY-MM-DD HH:mm:ss') {
 
 window.IS_TESTING = false;
 if (process.env.NODE_ENV == 'development'){
-  window.IS_TESTING = false;
+  window.IS_TESTING = true;
 }
 
 import Empty from "@screen/components/empty";
diff --git a/ruoyi-ui/src/router/index.js b/ruoyi-ui/src/router/index.js
index a5ff008c..e2f85b24 100644
--- a/ruoyi-ui/src/router/index.js
+++ b/ruoyi-ui/src/router/index.js
@@ -1,4 +1,4 @@
-// import Layout from "@/layout";
+import Layout from "@/layout";
 const constantRoutes = [
   // {
   //   path: '/redirect',
@@ -75,20 +75,20 @@ const constantRoutes = [
       }
     ]
   }, */
-  // {
-  //   path: '/user',
-  //   component: Layout,
-  //   hidden: true,
-  //   redirect: 'noredirect',
-  //   children: [
-  //     {
-  //       path: 'profile',
-  //       component: (resolve) => require(['@/views/system/user/profile/index'], resolve),
-  //       name: 'Profile',
-  //       meta: { title: '个人中心', icon: 'user' }
-  //     }
-  //   ]
-  // },
+  {
+    path: '/user',
+    component: Layout,
+    hidden: true,
+    redirect: 'noredirect',
+    children: [
+      {
+        path: 'profile',
+        component: (resolve) => require(['@/views/system/user/profile/index'], resolve),
+        name: 'Profile',
+        meta: { title: '个人中心', icon: 'user' }
+      }
+    ]
+  },
   // {
   //   path: '/system/user-auth',
   //   component: Layout,
diff --git a/ruoyi-ui/src/router/routerCreater.js b/ruoyi-ui/src/router/routerCreater.js
index a79be1b6..33d2266e 100644
--- a/ruoyi-ui/src/router/routerCreater.js
+++ b/ruoyi-ui/src/router/routerCreater.js
@@ -7,7 +7,6 @@ Vue.use(Router);
 /* Layout */
 // import Layout from "@/layout";
 import menuData from "@/common/menuData";
-import { resolve } from "mathjs";
 // 公共路由
 
 import {constantRoutes} from "./index.js";
diff --git a/ruoyi-ui/src/settings.js b/ruoyi-ui/src/settings.js
index 4077a26c..47469165 100644
--- a/ruoyi-ui/src/settings.js
+++ b/ruoyi-ui/src/settings.js
@@ -10,7 +10,7 @@ module.exports = {
   /**
    * 侧边栏主题 深色主题theme-dark，浅色主题theme-light
    */
-  sideTheme: 'theme-dark',
+  sideTheme: 'theme-jihe',
 
   /**
    * 是否系统布局配置
diff --git a/ruoyi-ui/src/views/JiHeExpressway/components/empty.vue b/ruoyi-ui/src/views/JiHeExpressway/components/empty.vue
index a6584e84..2fab079e 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/components/empty.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/components/empty.vue
@@ -27,6 +27,8 @@ export default {
 <style lang='scss' scoped>
 .empty {
   // padding-top:160px;
+  width: 100%;
+  height: 100%;
   color: #8A9EAA;
   display: flex;
   justify-content: center;
diff --git a/ruoyi-ui/src/views/JiHeExpressway/components/infoBoard/BoardInfoEditor.vue b/ruoyi-ui/src/views/JiHeExpressway/components/infoBoard/BoardInfoEditor.vue
index 7e3de1d3..f0911cab 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/components/infoBoard/BoardInfoEditor.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/components/infoBoard/BoardInfoEditor.vue
@@ -377,7 +377,7 @@ export default {
   
         this.loading = true
         // let templateId = "";
-  
+
         if(this.type == "template"){
           if(this.mode=='edit'){
             editTemplate(data).then(res=>{
diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/deviceType/ball.svg b/ruoyi-ui/src/views/JiHeExpressway/images/deviceType/ball.svg
index 17e57887..4d22656b 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/images/deviceType/ball.svg
+++ b/ruoyi-ui/src/views/JiHeExpressway/images/deviceType/ball.svg
@@ -1,14 +1,34 @@
-<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g id="Frame 10218">
-<g id="Frame" clip-path="url(#clip0_507_10)">
-<path id="Vector" d="M16.0002 13.451C16.3331 13.4513 16.6584 13.5502 16.9351 13.7353C17.2118 13.9204 17.4274 14.1834 17.5546 14.4911C17.6819 14.7987 17.715 15.1372 17.6499 15.4636C17.5848 15.7901 17.4244 16.09 17.1889 16.3253C16.9534 16.5606 16.6535 16.7208 16.3269 16.7857C16.0004 16.8505 15.662 16.8171 15.3545 16.6897C15.0469 16.5622 14.7841 16.3464 14.5991 16.0696C14.4142 15.7928 14.3155 15.4674 14.3155 15.1345C14.3158 14.6879 14.4935 14.2597 14.8094 13.944C15.1253 13.6283 15.5536 13.451 16.0002 13.451ZM16.0002 12.1082C15.4014 12.1082 14.8161 12.2857 14.3182 12.6184C13.8203 12.9511 13.4323 13.4239 13.2031 13.9771C12.974 14.5303 12.914 15.139 13.0308 15.7263C13.1476 16.3136 13.436 16.8531 13.8594 17.2765C14.2828 17.6999 14.8223 17.9882 15.4095 18.105C15.9968 18.2219 16.6056 18.1619 17.1588 17.9328C17.712 17.7036 18.1848 17.3156 18.5175 16.8177C18.8502 16.3198 19.0277 15.7345 19.0277 15.1357C19.0277 14.3327 18.7087 13.5627 18.141 12.9949C17.5732 12.4271 16.8031 12.1082 16.0002 12.1082Z" fill="#0FD4FF"/>
-<path id="Vector_2" d="M16.0006 6C10.9558 6 6.86621 10.0896 6.86621 15.1343C6.86621 20.1791 10.9563 24.2684 16.0006 24.2684C21.0448 24.2684 25.1347 20.1791 25.1347 15.1343C25.1347 10.0896 21.0453 6 16.0006 6ZM16.0006 7.51694C16.1633 7.51694 16.3225 7.56521 16.4578 7.65565C16.5932 7.74608 16.6987 7.87463 16.761 8.02502C16.8232 8.17541 16.8395 8.3409 16.8078 8.50056C16.776 8.66021 16.6976 8.80686 16.5825 8.92197C16.4674 9.03708 16.3208 9.11546 16.1611 9.14722C16.0015 9.17898 15.836 9.16268 15.6856 9.10038C15.5352 9.03809 15.4067 8.9326 15.3162 8.79725C15.2258 8.6619 15.1775 8.50277 15.1775 8.33999C15.1775 8.23189 15.1987 8.12485 15.2401 8.02498C15.2814 7.92511 15.3421 7.83437 15.4185 7.75793C15.4949 7.6815 15.5857 7.62087 15.6856 7.57952C15.7854 7.53817 15.8925 7.51691 16.0006 7.51694ZM16.0006 19.5655C15.1241 19.5656 14.2673 19.3057 13.5385 18.8188C12.8097 18.3319 12.2417 17.6398 11.9063 16.83C11.5708 16.0203 11.483 15.1293 11.654 14.2696C11.825 13.41 12.2471 12.6204 12.8668 12.0006C13.4866 11.3809 14.2762 10.9588 15.1358 10.7878C15.9955 10.6168 16.8865 10.7046 17.6963 11.04C18.506 11.3755 19.1981 11.9435 19.685 12.6723C20.1719 13.4011 20.4318 14.2579 20.4317 15.1343C20.4317 15.7163 20.3171 16.2925 20.0944 16.8301C19.8717 17.3677 19.5453 17.8562 19.1339 18.2677C18.7224 18.6791 18.2339 19.0055 17.6963 19.2282C17.1587 19.4509 16.5825 19.5655 16.0006 19.5655Z" fill="#0FD4FF"/>
-<path id="Vector_3" d="M15.9997 25.4203C14.1167 25.4232 12.2693 24.9068 10.6608 23.9277L8.58887 25.9999H23.4106L21.3384 23.9277C19.73 24.9068 17.8827 25.4233 15.9997 25.4203Z" fill="#0FD4FF"/>
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 26.3.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 32 32" style="enable-background:new 0 0 32 32;" xml:space="preserve">
+<style type="text/css">
+	.st0{clip-path:url(#SVGID_00000150790116670837349330000009162923057626297022_);}
+	.st1{fill:#0FD4FF;}
+</style>
+<g id="Frame_10218">
+	<g>
+		<defs>
+			<rect id="SVGID_1_" x="1" y="1" width="30" height="30"/>
+		</defs>
+		<clipPath id="SVGID_00000183230552375839184220000008410617905307219637_">
+			<use xlink:href="#SVGID_1_"  style="overflow:visible;"/>
+		</clipPath>
+		<g id="Frame" style="clip-path:url(#SVGID_00000183230552375839184220000008410617905307219637_);">
+			<path id="Vector" class="st1" d="M16,12.2c0.5,0,1,0.1,1.4,0.4c0.4,0.3,0.7,0.7,0.9,1.1c0.2,0.5,0.2,1,0.1,1.5
+				c-0.1,0.5-0.3,0.9-0.7,1.3c-0.4,0.4-0.8,0.6-1.3,0.7c-0.5,0.1-1,0-1.5-0.1c-0.5-0.2-0.9-0.5-1.1-0.9c-0.3-0.4-0.4-0.9-0.4-1.4
+				c0-0.7,0.3-1.3,0.7-1.8C14.7,12.4,15.3,12.2,16,12.2z M16,10.2c-0.9,0-1.8,0.3-2.5,0.8c-0.7,0.5-1.3,1.2-1.7,2
+				c-0.3,0.8-0.4,1.7-0.3,2.6c0.2,0.9,0.6,1.7,1.2,2.3c0.6,0.6,1.4,1.1,2.3,1.2c0.9,0.2,1.8,0.1,2.6-0.3c0.8-0.3,1.5-0.9,2-1.7
+				c0.5-0.7,0.8-1.6,0.8-2.5c0-1.2-0.5-2.4-1.3-3.2C18.4,10.6,17.2,10.2,16,10.2z"/>
+			<path id="Vector_2" class="st1" d="M16,1C8.4,1,2.3,7.1,2.3,14.7c0,7.6,6.1,13.7,13.7,13.7c7.6,0,13.7-6.1,13.7-13.7
+				C29.7,7.1,23.6,1,16,1z M16,3.3c0.2,0,0.5,0.1,0.7,0.2c0.2,0.1,0.4,0.3,0.5,0.6c0.1,0.2,0.1,0.5,0.1,0.7c0,0.2-0.2,0.5-0.3,0.6
+				c-0.2,0.2-0.4,0.3-0.6,0.3c-0.2,0-0.5,0-0.7-0.1c-0.2-0.1-0.4-0.3-0.6-0.5c-0.1-0.2-0.2-0.4-0.2-0.7c0-0.2,0-0.3,0.1-0.5
+				c0.1-0.1,0.2-0.3,0.3-0.4c0.1-0.1,0.3-0.2,0.4-0.3C15.7,3.3,15.8,3.3,16,3.3z M16,21.3c-1.3,0-2.6-0.4-3.7-1.1s-1.9-1.8-2.4-3
+				c-0.5-1.2-0.6-2.5-0.4-3.8c0.3-1.3,0.9-2.5,1.8-3.4c0.9-0.9,2.1-1.6,3.4-1.8c1.3-0.3,2.6-0.1,3.8,0.4c1.2,0.5,2.3,1.4,3,2.4
+				c0.7,1.1,1.1,2.4,1.1,3.7c0,0.9-0.2,1.7-0.5,2.5c-0.3,0.8-0.8,1.5-1.4,2.2c-0.6,0.6-1.3,1.1-2.2,1.4C17.7,21.2,16.9,21.3,16,21.3
+				z"/>
+			<path id="Vector_3" class="st1" d="M16,30.1c-2.8,0-5.6-0.8-8-2.2L4.9,31h22.2L24,27.9C21.6,29.3,18.8,30.1,16,30.1z"/>
+		</g>
+	</g>
 </g>
-</g>
-<defs>
-<clipPath id="clip0_507_10">
-<rect width="20" height="20" fill="white" transform="translate(6 6)"/>
-</clipPath>
-</defs>
 </svg>
diff --git a/ruoyi-ui/src/views/JiHeExpressway/mixins/InfoBoard.js b/ruoyi-ui/src/views/JiHeExpressway/mixins/InfoBoard.js
index e38a3a45..2bdaa2d8 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/mixins/InfoBoard.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/mixins/InfoBoard.js
@@ -87,8 +87,11 @@ export default{
                 } else {
                     publishToBoard(data).then(res => {
                         this.saveLog(content);
-                        loading.close()
                         this.____getDeviceInfo();
+                    }).catch(err=>{
+                        
+                    }).finally(()=>{
+                        loading.close()
                     });
                 }
 
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/assets/charts.js
index a7d54ec2..0195f1de 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/assets/charts.js
@@ -1,7 +1,5 @@
 import * as echarts from "echarts";
 
-var data1 = [50, 32, 41, 61, 70, 39, 40, 55, 63, 55, 36, 45, 62, 74, 46, 73, 92, 60, 45, 33, 45,66,55, 32, 46, 36, 67, 49, 60, 55, 33, 35, 66]
-var data2 = [5, 12, 4, 6, 7, 9, 10, 15, 3, 5, 6, 15,12, 4, 6, 7, 9, 10, 15, 3, 5, 6,5, 12, 4, 6, 7, 9, 10, 15, 3, 5, 6]
 let options = {
   tooltip: {
     trigger: 'axis',
@@ -10,13 +8,7 @@ let options = {
       color: "#fff"
     },
     formatter: function (params) {
-      return params[1].marker + '' + params[1].name + '\n' +
-        "<div>" +
-        "<span style='display:inline-block;border-radius:1px;width:10px;height:10px;background-color:#007AFF;option:0.5'></span>" +
-        "<span style=''> " + params[1].seriesName + ': ' + params[1].value + "\n" + ' </span>' +
-        "</div>" +
-        "<span style='display:inline-block;border-radius:1px;width:10px;height:10px;background-color:#FF9B61;'></span>" +
-        '' + "<span style=''> " + params[3].seriesName + ': ' + params[3].value;
+      return params[0].name + params[0].seriesName + ': ' + params[0].value
     }
   },
   grid: {
@@ -26,7 +18,7 @@ let options = {
     bottom: '12%'
   },
   xAxis: {
-    data: ['1日', '2日', '3日', '4日', '5日', '6日','7日', '8日', '9日', '10日', '11日', '12日', '13日', '14日', '15日', '16日', '17日', '18日', '19日', '20日', '21日', '22日', '23日', '24日', '25日', '26日', '27日', '28日', '29日', '30日'],
+    data: [],
     show: true,
     axisTick: {
       show: false
@@ -59,7 +51,7 @@ let options = {
     type: 'value',
     minInterval:20,
     maxInterval:20,
-    name: '(单位：万)',
+    name: "",
     nameTextStyle: {
       align: 'left',
       color: 'rgba(255,255,255,0.8)',
@@ -131,7 +123,7 @@ let options = {
    
   // 下半截柱状图
     {
-      name: '增收金额',
+      name: '',
       type: 'bar',
       barWidth: 12,
       barGap: '-100%',
@@ -150,11 +142,8 @@ let options = {
         }
       },
 
-      data: data1
+      data: []
     },
-  
-
-
     {
       name: '',
       type: 'bar',
@@ -165,7 +154,7 @@ let options = {
         color: '#0BA7DA',
         opacity: .1,
       },
-      data: [100, 100, 100, 100, 100, 100,100, 100, 100, 100, 100, 100, 100, 100, 100, 100,100, 100, 100, 100,100, 100, 100, 100, 100, 100,100, 100, 100, 100]
+      data: []
     }
   ]
 }
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/deviceSummary/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/deviceSummary/index.vue
new file mode 100644
index 00000000..13b1d20d
--- /dev/null
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/deviceSummary/index.vue
@@ -0,0 +1,253 @@
+<template>
+  <Empty v-if="!dataList || dataList.length<=0" text="暂无数据..."></Empty>
+    <div v-else class='deviceSummary'>
+        
+        <div class="item" v-for=" (item, index) in dataList" :key="index">
+          <div class="item_con">
+              <div class="title-tool">
+                <span class="text">{{ item.title }}</span>
+              </div>
+              <div class="item-body">
+                <div class="left-body">
+                  <div class="icon">
+                    <i class="el-icon-menu" v-if="item.title.includes('全部')"/>
+                    <img src="@screen/images/layer/路测设备/毫米波雷达.svg" v-if="item.title.includes('雷达')" />
+                    <img src="@screen/images/layer/路测设备/情报板.svg" v-if="item.title.includes('可变信息标志')" />
+                    <img src="@screen/images/layer/路测设备/摄像机.svg" v-if="item.title.includes('枪型')" />
+                    <img src="@screen/images/layer/路测设备/设备箱.svg" v-if="item.title.includes('设备箱')" />
+                    <img src="@screen/images/deviceType/ball.svg" v-if="item.title.includes('球形摄像机')" />
+                    <img src="@screen/images/layer/路测设备/合流区.svg" v-if="item.title.includes('合流区预警')" />
+                    <img src="@screen/images/layer/路测设备/行车诱导.svg" v-if="item.title.includes('行车诱导')" />
+                    <img src="@screen/images/layer/路测设备/护栏碰撞.svg" v-if="item.title.includes('护栏碰撞')" />
+                    <img src="@screen/images/deviceType/ball.svg" v-if="item.title.includes('全景摄像机')" />
+                    <img src="@screen/images/layer/路测设备/交调.svg" v-if="item.title.includes('交通量调查站')" />
+                    <img src="@screen/images/layer/路测设备/气象检测器.svg" v-if="item.title.includes('气象')" />
+                    <img src="@screen/images/layer/路测设备/语音广播.svg" v-if="item.title.includes('语音广播')" />
+                    <img src="@screen/images/layer/路测设备/疲劳唤醒.svg" v-if="item.title.includes('疲劳唤醒')" />
+                  </div>
+                  <div class="numUnit">
+                    <span class="num">{{ item.total }}</span>
+                    <span class="unit">套</span>
+                  </div>
+                </div>
+                <div class="line"></div>
+                <div class="right-list">
+                  <div class="list-text">
+                    <span class="title">在线：</span>
+                    <div class="value value1">
+                      {{ item.pctOnl }}
+                    </div>
+                  </div>
+                  <div class="list-text"><span class="title">离线：</span>
+                    <div class="value value2">
+                      {{ item.pctOffl }}
+                    </div>
+                  </div>
+                  <div class="list-text">
+                    <span class="title">丢包：</span>
+                    <div class="value value3">
+                      {{ item.pctLose }}
+                    </div>
+                  </div>
+                </div>
+              </div>
+          </div>
+        </div>
+      
+    </div>
+  </template>
+  
+  <script>
+  export default {
+    name: '',
+    components: {
+        
+    },
+    props:{
+      dataList:{
+        type:Array,
+        default:()=>[],
+      }
+    },
+    data() {
+      return {
+      }
+    },
+    watch:{
+
+    },
+    created() {
+        
+    },
+    methods: {
+        
+    },
+    mounted() {
+    },
+  }
+  </script>
+  
+  <style lang='scss' scoped>
+  .deviceSummary {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    margin-right: 0px;
+    overflow-y: scroll;
+    >.item {
+      flex-basis:percentage(1/8);
+      width: 0;
+      margin: 0;
+      padding: 0 15px 15px 0;
+      height: 194px;
+      >.item_con{
+        width: 100%;
+        height: 100%;
+        display: flex;
+        position: relative;
+        flex-direction: column;
+        background: linear-gradient(180deg, rgba(6, 66, 88, 0) 0%, #06425868 93%);
+        border-radius: 3px 3px 3px 3px;
+      .item-body {
+        height: 90px;
+        margin-top: 30px;
+        display: flex;
+        flex-direction: row;
+        align-items: stretch;
+      
+        .left-body {
+          display: flex;
+          width: 90px;
+          flex-direction: column;
+          justify-content: center;
+          align-items: center;
+        
+          .icon{
+            border-radius: 50%;
+            border: 1px solid #00D1FF;
+            width: 30px;
+            height: 30px;
+            padding:8px;
+            box-sizing: content-box;
+            text-align: center;
+            img{
+              width: 100%;
+              height: 100%;
+            }
+            i{ font-size: 26px; color: #00D1FF; line-height: 30px;}
+          }
+          .numUnit{
+            display: flex;
+            flex-direction: row;
+            justify-content: center;
+            align-items: center;
+            height: 40px;
+            .num {
+              font-size: 19px;
+              font-family: PangMenZhengDao;
+              font-weight: 400;
+              color: #00D1FF;
+            }
+            .unit {
+              margin-left: 3px;
+              font-size: 12px;
+              padding-top: 3px;
+              font-family: PingFang SC, PingFang SC;
+              font-weight: 500;
+              color: #FFFFFFF0;
+            }
+
+          }
+
+        }
+
+        .line {
+          width: 2px;
+          margin: 0 10px 0 5px;
+          background: linear-gradient(180deg, rgba(3, 60, 81, 0), rgba(0, 100, 137, 1), rgba(3, 60, 81, 0));
+        }
+
+        .right-list {
+          flex: 1;
+          display: flex;
+          flex-direction: column;
+          justify-content: center;
+          align-items: center;
+
+          .list-text {
+            height: 30px;
+            line-height: 30px;
+            width: 100%;
+            font-size: 12px;
+            font-family: PingFang SC, PingFang SC;
+            font-weight: 400;
+            color: #FFFFFF;
+
+            .title {
+              float: left;
+              width: 40px;
+              text-align: left;
+            }
+            .value{
+              font-size: 14px;
+              font-family: PangMenZhengDao;
+              font-weight: 800;
+            }
+
+            .value1 {
+              color: #00EBC1ee;
+            }
+
+            .value2 {
+              color: #FFFFFFee;
+            }
+
+            .value3 {
+              color: #FFD15Cee;
+            }
+          }
+
+        }
+
+
+      }
+
+      .title-tool {
+        position: relative;
+        display: inline-flex;
+        justify-content: center;
+        align-items: center;
+        height: 36px;
+        background: linear-gradient(180deg, rgba(1, 139, 182, 0) 0%, #1FCAF160 100%);
+        border-radius: 3px 3px 0px 0px;
+
+        .text {
+          font-size: 15px;
+          letter-spacing: 3px;
+          font-family: "PangMenZhengDao";
+          font-weight: 400;
+          color: #FFFFFF;
+        }
+
+
+
+
+
+
+      }
+
+      .title-tool::after {
+        content: "";
+        position: absolute;
+        bottom: 1px;
+        width: 100%;
+        height: 1px;
+        background: linear-gradient(90deg, rgba(81, 181, 255, 0) 3%, #51B5FF 49%, rgba(81, 181, 255, 0) 100%);
+      }
+  
+    }
+    }
+  }
+
+  </style>
+  
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/deviceUptime/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/deviceUptime/assets/charts.js
index 48948996..55b7c350 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/deviceUptime/assets/charts.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/deviceUptime/assets/charts.js
@@ -1,5 +1,3 @@
-
-let data = [0, 0, 0, 0, 0, 0,0, 0,0, 0,0, 0]
 let indicator = [
 
     { name: '智能设备箱', max: 100 },
@@ -19,25 +17,21 @@ let indicator = [
     { name: '高清网络枪型固定摄像机', max: 100 },
     { name: '高清网络球形摄像机', max: 100 },
 ]
+let data = [{
+    value: [60, 30, 50, 80, 90, 98, 50, 56],
+    name: "哈哈哈佛挡杀佛很多事"
+}];
 
 let options = {
-  
-    tooltip: {},
+    tooltip:{
+        show: false
+    },
     radar: {
         center: ['50%', '50%'],
         radius: '72%',
         nameGap: 0,
-        indicator: indicator,
-        splitLine: {
-            show: false
-
-        },
-        splitArea: {
-            show: false
-        },
-        axisLine: {
-            show: true
-        },
+        indicator:[],
+        // shape: 'circle',
         name: {
             textStyle: {
                 color: '#F2F3F5',
@@ -46,16 +40,31 @@ let options = {
                 padding: [3, 5]
             }
         },
+        splitArea: {
+            areaStyle: {
+                color: ["#2AD1BC12", "#275558", "#244c51", "#204147", "#1b353e"]
+            }
+        },
+        axisLine: {
+            lineStyle: {
+                color: '#FFFFFF80'
+            }
+        },
+        splitLine: {
+            lineStyle: {
+                color: '#2AD1BCCC'
+            }
+        }
     },
-    series: [{
+    series: [
+        {
         type: 'radar',
-        data: [data],
+        data:[],
         name: '设备在线率',
         label: {
             show: true,
             formatter: function (params) {
-                console.log(params)
-                return params.value;
+                return params.value + "%";
             },
             color: '#fff',
             // position:[-20,-10,-10,-10],
@@ -77,105 +86,7 @@ let options = {
             color: '#2287FE60',
             opacity: 1
         }
-    },
-    {
-        type: 'radar',
-        name: '设备在线率',
-        data: [
-            [100, 100, 100, 100, 100, 100, 100, 100,100, 100, 100, 100, 100, 100, 100, 100,100, 100, 100],
-        ],
-     
-        symbol: 'none',
-        lineStyle: {
-            width: 1
-        },
-        itemStyle: {
-            color: '#2AD1BC'
-        },
-
-        areaStyle: {
-             color: '#2AD1BC29',
-             opacity: 0.1
-        }
-    },
-    {
-        type: 'radar',
-        name: '设备在线率',
-        data: [
-            [80, 80, 80, 80, 80, 80, 80, 80,80, 80, 80, 80, 80, 80, 80, 80, 80, 80, 80]
-        ],
-
-        symbol: 'none',
-        lineStyle: {
-            width: 1
-        },
-        itemStyle: {
-            color: '#2AD1BC'
-        },
-
-        areaStyle: {
-             color: '#2AD1BC29',
-             opacity: 0.2
-        }
-    },
-    {
-        type: 'radar',
-        name: '设备在线率',
-        data: [
-            [60, 60, 60, 60, 60, 60, 60, 60,60, 60, 60, 60, 60, 60, 60, 60, 60, 60, 60],
-        ],
-
-          symbol: 'none',
-        lineStyle: {
-            width: 1
-        },
-        itemStyle: {
-            color: '#2AD1BC'
-        },
-
-        areaStyle: {
-             color: '#2AD1BC29',
-             opacity: 0.1
-        }
-    },
-    {
-        type: 'radar',
-        name: '设备在线率',
-        data: [
-            [40, 40, 40, 40, 40, 40, 40, 40,40, 40, 40, 40, 40, 40, 40, 40, 40, 40, 40],
-        ],
-       symbol: 'none',
-        lineStyle: {
-            width: 1
-        },
-        itemStyle: {
-            color: '#2AD1BC'
-        },
-
-        areaStyle: {
-             color: '#2AD1BC29',
-             opacity: 0.1
-        }
-    },
-    {
-        type: 'radar',
-        name: '设备在线率',
-        data: [
-            [20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20],
-        ],
-       symbol: 'none',
-        lineStyle: {
-            width: 1
-        },
-        itemStyle: {
-            color: '#2AD1BC'
-        },
-
-        areaStyle: {
-             color: '#2AD1BC29',
-             opacity: 0.1
-        }
-    },
+    }
     ]
 };
 
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/deviceUptime/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/deviceUptime/index.vue
index b8751ab7..c774915b 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/deviceUptime/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/deviceUptime/index.vue
@@ -2,7 +2,8 @@
     <div class='congestion'>
       <WgtTitle :title="'设备在线率'"></WgtTitle>
       <div class="board">
-        <div class="charts keep-ratio " id="deviceUptime"></div>
+        <Empty v-if="isEmpty" text="暂无数据..."></Empty>
+        <div v-else class="charts keep-ratio " ref="deviceUptime"></div>
        </div>
     </div>
   </template>
@@ -19,29 +20,47 @@
     props:{
       dataList:{
         type:Array,
-        default:[],
+        default:()=>[],
       }
     },
     data() {
       return {
-       
+       isEmpty:true
       }
     },
     watch:{
-      dataList:(newD,oldD)=>{
-          let data = [];
-          let texts = [];
-          newD.forEach(element => {
-              data.push(parseInt(element.sucessRate,10));
-              texts.push({name:element.text, max: 100 });
-          });
+      dataList:{
+        handler(newD,oldD){
+
+          if (!newD || newD.length <= 0) {
+            this.isEmpty = true;
+            return
+          }
 
-         chartsStatistics.radar.indicator = texts;
-         chartsStatistics.series[0].data = [data];
+            let value = [];
+            let indicator = [];
+            newD.forEach(element => {
+                value.push(+element.pctOnl.replace("%",""));
+                indicator.push({name:element.title, max: 100 });
+            });
+  
+           chartsStatistics.radar.indicator = indicator;
+           chartsStatistics.series[0].data = [{
+              value:value,
+              name:"设备在线率"
+           }];
+  
+           this.isEmpty = false;
+           this.$nextTick(()=>{
+             var myChart = echarts.init(this.$refs['deviceUptime']);
+             myChart.setOption(chartsStatistics); 
+           });
 
-         //console.log("=====aaa=========",this)
-         var myChart = echarts.init(document.getElementById('deviceUptime'));
-          myChart.setOption(chartsStatistics); 
+
+
+        },
+        deep:true,
+        immediate:true
       }
     },
     created() {
@@ -51,13 +70,7 @@
         
     },
     mounted() {
-      setTimeout(() => {
-        this.$nextTick(() => {
-          var myChart = echarts.init(document.getElementById('deviceUptime'));
-          myChart.setOption(chartsStatistics);
-          this.myChart = myChart;
-        });
-      });
+
     },
   }
   </script>
@@ -72,7 +85,7 @@
       height:510px;
       width: 100%;
       padding: 0px 20px;
-      background: linear-gradient(180deg, rgba(6,66,88,0.2) 0%, #064258 100%);
+      background: linear-gradient(180deg, rgba(6,66,88,0) 0%,  rgba(6,66,88,0.4) 93%);
       border-radius: 5px 5px 5px 5px;
         opacity:1;
         border: 1px solid;
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/monthlyEquipment/EllipseData.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/monthlyEquipment/EllipseData.vue
new file mode 100644
index 00000000..3eea03df
--- /dev/null
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/monthlyEquipment/EllipseData.vue
@@ -0,0 +1,105 @@
+<template>
+    <div class="compBox" :style="boxStyle">
+        <div class="info">
+            <p class="value" :style="{color:skinLib[skin].numColor}">{{ value }}{{ unit }}</p>
+            <p class="title" :style="`font-size:${titleFontSize}px`">{{ title }}</p>
+        </div>
+        <svg width="100%" height="100%" version="1.1" xmlns="http://www.w3.org/2000/svg" class="bg">
+            <defs>
+                <template v-for="item,key in skinLib">
+                    <linearGradient :id="'stroke'+key" x1="92%" y1="20%" x2="50%" y2="100%">
+                        <stop offset="0%" :style="`stop-color:${item.bgColor}; stop-opacity:${item.strokeOpacity[0]}`" />
+                        <stop offset="100%" :style="`stop-color:${item.bgColor}; stop-opacity:${item.strokeOpacity[1]}`" />
+                    </linearGradient>
+                    <linearGradient :id="'fill'+key" x1="90%" y1="12%" x2="30%" y2="100%">
+                        <stop offset="0%" :style="`stop-color:${item.bgColor}; stop-opacity:${item.fillOpacity[0]}`" />
+                        <stop offset="100%" :style="`stop-color:${item.bgColor}; stop-opacity:${item.fillOpacity[1]}`" />
+                    </linearGradient>
+                </template>
+            </defs>
+            <ellipse cx="50%" cy="50%" :rx="width / 2 - 1" :ry="height / 2 - 1"
+                :style="`fill:url(#fill${skin}); stroke:url(#stroke${skin}); stroke-width:2`" />
+        </svg>
+    </div>
+</template>
+  
+<script>
+import { color } from 'echarts';
+
+export default {
+    name: 'EllipseData',
+    components: {
+    },
+    data() {
+        return {
+            skinLib: {
+                blue: { bgColor: "rgb(23,162,255)", numColor: "#2CA7F7", strokeOpacity: [0,0.7], fillOpacity: [0,0.6],  },
+                cyan: { bgColor: "rgb(23,227,255)", numColor: "#22D0E5", strokeOpacity: [0,0.7], fillOpacity: [0,0.6],  },
+                yellow: { bgColor: "rgb(255,206,133)", numColor: "#ECC27F", strokeOpacity: [0,1], fillOpacity: [0,0.85],  },
+                green: { bgColor: "rgb(28,124,58)", numColor: "#26B768", strokeOpacity: [0,1], fillOpacity: [0,1],  },
+            }
+        }
+    },
+
+    created() {
+
+    },
+    props: {
+        width: {
+            type: Number,
+            default: 300
+        },
+        height: {
+            type: Number,
+            default: 80
+        },
+        value: {
+            type: [Number, String],
+            default: 0
+        },
+        unit: {
+            type: String,
+            default: ""
+        },
+        title: {
+            type: String,
+            default: "标题"
+        },
+        level:{
+            type: Number,
+            default: 0
+        }
+    },
+    computed: {
+        boxStyle(){
+            return {
+                width:this.width + "px",
+                height:this.height + "px"
+            }
+        },
+        titleFontSize(){
+            return [16,14,12,10][this.level];
+        },
+        skin(){
+            return ["yellow", "cyan", "blue", "green"][this.level];
+        }
+    },
+    methods: {
+
+    },
+    mounted() { },
+}
+</script>
+  
+<style lang='scss' scoped>
+.compBox{
+    position: relative;
+    .info{ position: absolute; left: 0; top:0; bottom: 0; right: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
+        .value{ font-size: 18px; font-family: "PangMenZhengDao";}
+        .title{ font-size: 14px; font-weight: bold;}
+    }
+    .bg{
+    }
+}
+</style>
+  
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/monthlyEquipment/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/monthlyEquipment/index.vue
index e9b3d3f0..9e721ed9 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/monthlyEquipment/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/components/monthlyEquipment/index.vue
@@ -1,192 +1,153 @@
 <template>
-    <div class='congestion'>
-      <WgtTitle :title="'月设备变化曲线'"></WgtTitle>
-      <div class="board">
-        
-          <div class="round-div"  v-for="(item) in dataList"  :style="{background:'linear-gradient(80deg, '+item.color+'66 0%, '+item.color+'00 100%)',width:'calc('+ (100 - parseInt(item.num,10) ) / 100 +' * 250px)',top:item.top+'px',left:item.left+'px'}"   >
-             <div class="round-num" :style="{color:item.color}" >
-                {{ item.num }}
-             </div>
-             <div class="round-text" >
-                {{ item.text }}
-             </div>
-          </div>
+  <div class='congestion'>
+    <WgtTitle :title="'月设备变化曲线'"></WgtTitle>
+    <div class="board" ref="box">
+        <Empty v-if="isEmpty" text="暂无数据..."></Empty>
+        <template v-else>
+          <EllipseData v-for="(item,index) in dataShow"
+          :style = "`left:${item.left}px; top:${item.top}px`"
+          class="ball ballAnimation" :class="'level_'+item.level" :width="item.width" :height="item.height" :value="item.value" :title="item.title" :level="item.level" :unit="item.unit"></EllipseData>
+        </template>
        </div>
     </div>
   </template>
   
   <script>
   import WgtTitle from "../../../../perception/widgets/title";
-  import * as echarts from "echarts";
-  import { getSystemStatusType } from "@/api/MonthlyEquipment";
-  
+  import EllipseData from "./EllipseData.vue"
   export default {
     name: 'MonthlyEquipment',
     components: {
-        WgtTitle
+        WgtTitle, EllipseData
     },
     data() {
       return {
-        dataList:[],
-        copyList:[
-            {
-                num:40,
-                text:"高清网络球形摄像机",
-                color:"#17A2FF",
-                top:200,
-                left:100,
-            },
-            {
-                num:30,
-                text:"360°全景摄像机",
-                color:"#1C7C3A",
-                top:100,
-                left:100,
-            },
-            {
-                num:80,
-                text:"门架式可变信息标志",
-                color:"#17A2FF",
-                top:130,
-                left:500,
-            },
-            {
-                num:70,
-                text:"站前悬臂式可变信息标志",
-                color:"#17E3FF",
-                top:200,
-                left:580,
-            },
-            {
-                num:60,
-                text:"气象检测器",
-                color:"#17A2FF",
-                top:330,
-                left:250,
-            },
-            {
-                num:70,
-                text:"合流区预警系统",
-                color:"#17A2FF",
-                top:330,
-                left:550,
-            },
-            {
-                num:40,
-                text:"高清网络枪型固定摄像机",
-                color:"#17E3FF",
-                top:30,
-                left:250,
-            },
-            {
-                num:40,
-                text:"雨棚可变信息标志",
-                color:"#17A2FF",
-                top:260,
-                left:320,
-            },
-            {
-                num:80,
-                text:"毫米波雷达",
-                color:"#FFCE85",
-                top:100,
-                left:680,
-            },
-            {
-                num:80,
-                text:"路段语音广播系统",
-                color:"#17A2FF",
-                top:250,
-                left:820,
-            },
-            {
-                num:60,
-                text:"护碰撞预警系统",
-                color:"#17A2FF",
-                top:170,
-                left:920,
-            },{
-                num:70,
-                text:"激光疲劳唤醒系统",
-                color:"#17E3FF" ,
-                top:70,
-                left:1020,
-            },{
-                num:40,
-                text:"180°全景摄像机" ,
-                color:"#1C7C3A",
-                top:20,
-                left:820,
-            },{
-                num:50,
-                text:"一类交通量调音站" ,
-                color:'#17A2FF',
-                top:20,
-                left:520,
-            },{
-                num:50,
-                text:"智能行车诱导系统" ,
-                color:'#17E3FF',
-                top:350,
-                left:920,
-            },{
-                num:60,
-                text:"智能设备箱" ,
-                color:"#FFCE85",
-                top:430,
-                left:320,
-            },{
-                num:60,
-                text:"智能设备箱" ,
-                color:"#FFCE85",
-                top:430,
-                left:620,
-            },{
-                num:60,
-                text:"智能设备箱" ,
-                color:"#FFCE85",
-                top:430,
-                left:920,  
-            }
-        ]
+        isEmpty:true,
+        dataShow:[],
+        titles : [
+              "高清网络球形摄像机",
+              "360°全景摄像机",
+              "门架式可变信息标志",
+              "站前悬臂式可变信息标志",
+              "气象检测器",
+              "合流区预警系统",
+              "高清网络枪型固定摄像机",
+              "智能设备箱",
+              "毫米波雷达",
+              "路段语音广播系统",
+              "护碰撞预警系统",
+              "激光疲劳唤醒系统",
+              "180°全景摄像机",
+              "一类交通量调音站",
+              "雨棚可变信息标志",
+              "智能行车诱导系统",
+      ]
+      }
+    },
+    props:{
+      dataList:{
+        type:Array,
+        default:()=>[]
       }
     },
-  
     created() {
         
     },
     methods: {
-        
-    },
-    mounted() {
-    
-      setTimeout(() => {
+      generatePosiArr(boxWidth , boxHeight){
+        let pdHV = [180,80];
+        let rows = 6;
+        let cols = 6;
+        let unitSize = [ (boxWidth - pdHV[0]*2)/(rows-1) , (boxHeight - pdHV[1] * 2) /(cols-1)];
+        let posiArr = [];
+        for(let i=0 ; i<cols; i++){
+          let temp = [];
+          for(let j=0 ; j<rows; j++){
+            temp.push([pdHV[0] + j*unitSize[0] , pdHV[1] + i * unitSize[1]]);
+          }
+          posiArr.push(temp);
+        }
+        return posiArr
+      },
+      initData() {
+        let posiToUse = [
+          [0, 0], [0, 2], [0, 4],
+          [1, 1], [1, 3], [1, 5],
+          [2, 0], [2, 2], [2, 4],
+          [3, 1], [3, 3], [3, 5],
+          [4, 0], [4, 2], [4, 4],
+          [5, 1], [5, 3], [5, 5]
+        ]
         this.$nextTick(() => {
-          let colors = ['#17E3FF',"#FFCE85",'#17A2FF','#1C7C3A'];
-          getSystemStatusType().then((res)=>{
-           
-             this.dataList = [];
-             let allList = [];
-             let data = res.data;
-             let i = 0;
-             for (var it in data){
-                let item = {
-                  text:it,
-                  num:data[it].sucessRate,
-                  color: colors[(i + 1)%4],
-                  top: this.copyList[i]?this.copyList[i].top:0, //(i + 1)%4 * 80,
-                  left: this.copyList[i]?this.copyList[i].left:0,
-                }
-                console.log(it,i);
-                i+= 1;
-                allList.push(item);
-             }
-             console.log(allList);
-             this.dataList = allList;
+          this.dataShow = [];
+          let ele = this.$refs["box"];
+          let boxW = ele.clientWidth;
+          let boxH = ele.clientHeight;
+          let posiArr = this.generatePosiArr(boxW, boxH);
+
+          let levelArr = [];
+          this.dataList.forEach((item, index) => {
+            let val = +item.pctOnl.replace("%", "");
+            levelArr.push(val);
+
+            this.dataShow.push({
+              title: item.title,
+              value: val,
+              unit: "%",
+            })
           })
+
+          //去重并找出阶梯界限
+          let temp1 = _.uniq(levelArr);
+          let temp2 = temp1.sort((a,b)=>{
+            return a-b
+          })
+          let temp3 = _.chunk(temp2 , Math.floor(temp2.length/4));
+          temp3[3] = _.concat(temp3[3], temp3[4]);
+          temp3.splice(4, 1);
+          levelArr = temp3;
+
+          //再遍历一遍设置尺寸和位置
+          this.dataShow.forEach((item,index)=>{
+
+            let level = 3;
+            levelArr.forEach((arr,idx)=>{
+              if(arr.includes(item.value)){
+                level = idx;
+              }
+            });
+
+            let width = 300 - 48 * level;
+            let height = 80 - 9 * level;
+
+            item.width = width;
+            item.height = height;
+            item.level = level;
+            item.left = posiArr[posiToUse[index][0]][posiToUse[index][1]][0] - width / 2;
+            item.top = posiArr[posiToUse[index][0]][posiToUse[index][1]][1] - height / 2;
+          })
+
+
         });
-      });
+      }
+    },
+    watch:{
+      dataList:{
+        deep:true,
+        immediate:true,
+        handler(newV){
+          if(!newV || newV.length<=0){
+            this.isEmpty = true;
+            return;
+          }
+          this.isEmpty = false;
+          this.initData();
+        }
+      }
     },
+    mounted() {
+      
+    }
   }
   </script>
   
@@ -197,113 +158,42 @@
     flex-direction: column;
 
     .board{
-        position: relative;
+      position: relative;
       height:510px;
-      width: 100%;
-      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;
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      flex-direction: column;
-
-      .round-div:nth-child(5n + 1) {
-        animation:mymove 6.5s infinite;
-	   -webkit-animation:mymove 1.5s infinite;
-      }
+      background: linear-gradient(180deg, rgba(6,66,88,0) 0%,  rgba(6,66,88,0.4) 93%);
+      border: 1px solid;
+      border-image: linear-gradient(360deg, rgba(55, 231, 255,0.3), rgba(55, 231, 255, 0)) 1 1;
 
-      .round-div:nth-child(4n + 1){
-        animation:mymove_dow 5.5s infinite;
-        animation-delay: 3s;
-      }
-
-      .round-div:nth-child(3n + 1){
-        animation:mymove 4.5s infinite;
-        animation-delay: 2s;
-      }
-
-      .round-div:nth-child(2n + 1){
-        animation:mymove 3.5s infinite;
-        animation-delay: 1s;
-      }
-
-      .round-div:nth-child(n + 1){
-        animation:mymove 2.5s infinite;
-        animation-delay: 0s;
-      }
-
-      .round-div {
+      .ball {
         position: absolute;
-        flex-direction: column;
-        display: inline-flex;
-        width: 182px;
-        height: 69px;
-        background: linear-gradient(80deg, rgba(23,162,255,0.6) 0%, rgba(23,162,255,0) 100%);
-        border-radius: 0px 0px 0px 0px;
-        opacity: 1;
-        border-radius: 50%;
-        border: 0px solid;
-// border-image: linear-gradient(33deg, rgba(23, 162, 255, 0.71), rgba(23, 162, 255, 0)) 2 2;
+      }
 
-        > .round-num {
-            width:100%;
-            height:30px;
-            display: inline-flex;
-            justify-content: center;
-            align-items: center;
-            font-size: 18px !important;
-            font-family: PangMenZhengDao;
-            font-weight: 400;
-            color: #2CA7F7;
+       .ballAnimation {
+          transform: translate(0px, -10px);
+          animation:mymove 2s infinite ease-in-out alternate;
+        &.level_0{
+          animation-delay:0s;
         }
-
-        .round-text {
-            display: inline-flex;
-            justify-content: center;
-            align-items: center;    
-            width: 100%;
-            height: 21px;
-            font-size: 14px;
-            font-family: Hiragino Sans GB, Hiragino Sans GB;
-            font-weight: normal;
-            color: #FFFFFF;
+        &.level_1{
+          animation-delay:0.6s;
         }
-      }
+        &.level_2{
+          animation-delay:1.4s;
+        }
+        &.level_3{
+          animation-delay:1.8s;
+        }
+        }
+
      
     }
   }
-      .charts {
-        height:100%;
-        width: 100%;
-      }
 
 
 @keyframes mymove{
-	0% {transform: translate(0px, 0px);}
-    50% {transform: translate(0px, -10px);}
-	100% {transform: translate(0px, 0px);}
-	
-}
-
-@keyframes mymove_dow{
-	0% {transform: translate(0px, 0px);}
-    50% {transform: translate(0px, 20px);}
-	100% {transform: translate(0px, 0px);}
-	
+	0% {transform: translate(0px, -10px);}
+  100% {transform: translate(0px, 10px);}
 }
-
-/*Safari 和 Chrome:*/
-@-webkit-keyframes mymove
-{
-	0% {transform: translate(0px, 0px);}
-    50% {transform: translate(0px, -10px);}
-	100% {transform: translate(0px, 0px);}
-}
-
   
   </style>
   
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/index.vue
index adb35566..ae55cafa 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/index.vue
@@ -1,45 +1,13 @@
 <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="topTabs">
-            <div class="item" v-for=" (item, index) in equipments" :key="index">
-              <div class="title-tool">
-                <span class="text">{{ item.text }}</span>
-              </div>
-              <div class="item-body">
-                <div class="left-body">
-                  <img src="./assets/shexiangtou.png" />
-                  <span class="num">{{ item.num }} <span class="unit">套</span></span>
-                </div>
-                <div class="line"></div>
-                <div class="right-list">
-                  <div class="list-text">
-                    <span>在线：</span>
-                    <div class="show-text1">
-                      {{ item.sucessRate }}
-                    </div>
-                  </div>
-                  <div class="list-text"><span>离线：</span>
-                    <div class="show-text2">
-                      {{ item.failRate }}
-                    </div>
-                  </div>
-                  <div class="list-text">
-                    <span>丢包：</span>
-                    <div class="show-text3">
-                      {{ item.lostRate }}
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
+  <div class='statisticAnalysis'>
+      <el-tabs class="saContent" v-model="activeName" @tab-click="changeTabs">
+        <el-tab-pane label="设备分析" name="first" class="deviceAnalysis">
+          <DeviceSummary class="deviceSummary" :dataList="equipments"></DeviceSummary>
           <div class="bottomTabs">
             <DeviceUptime :dataList="equipments" class="tabs-lo" />
-            <MonthlyEquipment class="tabs-mo" />
+            <MonthlyEquipment class="tabs-mo" :dataList="equipments" />
           </div>
+
         </el-tab-pane>
         <el-tab-pane label="设备查询" name="second">
           <div class="topdiv">
@@ -53,13 +21,13 @@
             </div>
           </div>
           <div class="middleDiv">
-            <div id="chart1" class="keep-ratio">
+            <div ref="queryChart" class="keep-ratio">
 
             </div>
           </div>
           <div>
             <el-table :border="false" :data="tableData" height="480" style="width: 100%">
-              <el-table-column prop="nem" label="序号" width="80">
+              <el-table-column prop="order" label="序号" width="80">
               </el-table-column>
               <el-table-column prop="deviceName" label="设备名称"></el-table-column>
               <el-table-column prop="deviceNo" label="设备桩号" width="">
@@ -110,7 +78,6 @@
           </div>
         </el-tab-pane>
       </el-tabs>
-    </section>
   </div>
 </template>
   
@@ -120,12 +87,14 @@ import * as echarts from "echarts";
 import chartsStatistics from "./assets/charts";
 import DeviceUptime from './components/deviceUptime';
 import MonthlyEquipment from './components/monthlyEquipment';
+import DeviceSummary from './components/deviceSummary';
 import { getSystemStatusList, getSystemStatusTabList, getSystemStatusType, getSystemStatusExport } from "../../../../../api/MonthlyEquipment";
 import { download } from '../../../../../utils/request.js';
 import Pagination from '@screen/components/Pagination.vue';
 import InputSearch from '@screen/components/InputSearch/index.vue';
 import { searchFormList } from "./data";
 import { Loading } from 'element-ui';
+import { first } from "lodash";
 
 export default {
   name: 'publicService',
@@ -133,7 +102,8 @@ export default {
     DeviceUptime,
     MonthlyEquipment,
     Pagination,
-    InputSearch
+    InputSearch,
+    DeviceSummary
   },
   data() {
     return {
@@ -144,105 +114,26 @@ export default {
       pageIndex: 1,
       pageSize: 10,
       searchFormList,
-      equipments: [
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
-        {
-          num: 315,
-          online: 30,
-          outline: 30,
-          lost: 40
-        },
+      equipSeries: [
+        "高清网络球形摄像机",
+        "360°全景摄像机",
+        "门架式可变信息标志",
+        "站前悬臂式可变信息标志",
+        "气象检测器",
+        "合流区预警系统",
+        "高清网络枪型固定摄像机",
+        "智能设备箱",
+        "毫米波雷达",
+        "路段语音广播系统",
+        "护碰撞预警系统",
+        "激光疲劳唤醒系统",
+        "180°全景摄像机",
+        "一类交通量调音站",
+        "雨棚可变信息标志",
+        "智能行车诱导系统",
       ],
-      activeName: "first",
+      equipments:[],
+      activeName: "second",
       tableData: [{
         date: '2023-12-31 13:00:00',
         name: '高清网络球形摄像机',
@@ -374,13 +265,38 @@ export default {
         jcsj: "2024-01-17",
         cz: "在线",
       }
-      ]
+      ],
+      interval:null
     }
   },
+  destroyed() {
+    clearInterval(this.interval);
+  },
   methods: {
+    initData(){
+      
+      clearInterval(this.interval);
+      if(this.activeName=="first"){
+        this.initDevice();
+      }else if(this.activeName=='second'){
+        this.queryChart = echarts.init(this.$refs["queryChart"]);
+        this.queryChart.setOption(chartsStatistics);
+        
+          // this.initQueryTable(1);
+          // this.initQueryChart();
+
+      }
+
+      this.interval = setInterval(() => {
+        if (this.activeName == "first") {
+          this.initDevice();
+        }
+      }, 30000)
+
+    },
     changePage(page) {
 
-      this.queryTabList(page);
+      this.initQueryTable(page);
     },
     formatDate(val) {
       let year = val.getFullYear();
@@ -393,17 +309,17 @@ export default {
       return year + "-" + m + "-" + day + " 00:00:00";
     },
     handleSearch(data) {
-      console.log(data);
       this.typeQuery = data.type;
       this.startTime = this.formatDate(data.time[0]);
       this.time = this.formatDate(data.time[1]);
-      this.queryChartList();
-      this.queryTabList(1);
+      this.initQueryChart();
+      this.initQueryTable(1);
     },
     changeTabs() {
-      console.log("======================", this.myChart);
+      this.initData();
+      console.log("======================", this.queryChart);
       this.$nextTick(() => {
-        this.myChart.resize();
+        this.queryChart.resize();
       });
     },
     //导出
@@ -431,65 +347,85 @@ export default {
         loadingInstance.close();
       })
     },
-    queryChartList() {
-
-
+    initQueryChart() {
+      
       getSystemStatusList({
         startTime: this.startTime,
         time: this.time,
         type: this.typeQuery,
       }).then((res) => {
         if (res.code == 200) {
-          let data = res.data;
-          let startTime = new Date(this.startTime);
-          let month = startTime.getMonth() + 1;
-          let dayS = startTime.getDate();
-          let backCooDatas = [];
-          let dayArr = [];
-          for (var i = 1; i < 31; i++) {
-            let daystr = startTime.getFullYear() + "-" + month + "-" + i;
-            let dataObj = data[daystr] ? parseFloat(data[daystr]) : 0;
-            dayArr.push(daystr);
-            backCooDatas.push(dataObj);
+          let origin = res.data;
+
+          let startStamp = +moment(this.startTime).startOf('day').format("x");
+          let endStamp = +moment(this.time).endOf('day').format("x");
+          let oneDay = 86400000;
+          let daysTotal = Math.ceil((endStamp - startStamp) / oneDay);
+          let queryChartData = [];
+          let dataX = [];
+          let data0 = [];
+          let data1 = [];
+          for (let i = 0; i < daysTotal; i++) {
+            let ts = startStamp + i * oneDay;
+            let date = moment(ts).format("YYYY-M-D");
+            let val = origin[date] ? +origin[date].replace("%","") : 0;
+            dataX.push(moment(ts).format("MM月DD日"));
+            data0.push(val);
+            data1.push(100);
           }
-          console.log("===================", backCooDatas);
-          chartsStatistics.series[0].data = backCooDatas;
+          chartsStatistics.xAxis.data = dataX;
+          chartsStatistics.series[0].data = data0;
+          chartsStatistics.series[1].data = data1;
+          chartsStatistics.yAxis[0].name = "在线率(%)";
+
           this.$nextTick(() => {
-            this.myChart.setOption(chartsStatistics);
+            this.queryChart.setOption(chartsStatistics);
           });
-        }
 
+        }
       })
     },
-    queryTypes() {
+    initDevice() {   //设备在线离线率接口
+
       getSystemStatusType().then((res) => {
-        console.log("===========================", res);
-        this.equipments = [];
+
+        if(!res.data || res.msg=="暂无数据"){
+
+            this.equipments = [];
+            this.equipSeries.forEach(item => {
+              this.equipments.push({
+                title: item,
+                total: Math.floor(Math.random() * 600) + 800,
+                pctOnl: Math.floor(100*Math.random()) + "%",
+                pctOffl: "25%",
+                pctLose: "15%"
+              });
+
+            });
+            return;
+        }
         let allList = [];
-        let data = res.data;
-        let i = 0;
-        for (var it in data) {
+        for (let key in res.data) {
+          let val = res.data[key];
           let item = {
-            text: it,
-            num: data[it].sum,
-            sucessRate: data[it].sucessRate,
-            lostRate: data[it].lostRate,
-            failRate: data[it].failRate
+            title: key,
+            total: val.sum,
+            pctOnl: val.sucessRate,
+            pctLose: val.failRate,
+            pctOffl: val.lostRate
           }
-          console.log(it, i);
-          i += 1;
-          if (it == "全部设备") {
-            allList.splice(0, 0, item);
-          } else
+          if(key.includes("全部设备")){
+            allList.unshift(item);
+          }else{
             allList.push(item);
+          }
         }
-        console.log(allList);
         this.equipments = allList;
       })
 
     },
     //查询列表
-    queryTabList(pageIndex, pageSize = 30) {
+    initQueryTable(pageIndex, pageSize = 30) {
       getSystemStatusTabList({
         startTime: this.startTime,
         time: this.time,
@@ -497,33 +433,22 @@ export default {
         pageNum: pageIndex,
         pageSize: pageSize,
       }).then((res) => {
-        console.log(res);
         if (res.code == 200) {
           this.pageIndex = pageIndex;
           this.pageSize = pageSize;
           this.pageTotal = res.total;
           this.tableData = res.rows;
-
           this.tableData.forEach((it, index) => {
-            it.nem = (pageIndex - 1) * (pageSize) + index + 1;
+            it.order = (pageIndex - 1) * (pageSize) + index + 1;
           })
         }
       })
     }
   },
   mounted() {
-    setTimeout(() => {
-      this.$nextTick(() => {
-        var myChart = echarts.init(document.getElementById('chart1'));
-        myChart.setOption(chartsStatistics);
-        this.myChart = myChart;
-      });
-      this.queryTypes();
-      this.queryTabList(1);
-      this.queryChartList();
-
-
-    });
+    
+      this.initData();
+    
   },
 }
 </script>
@@ -538,185 +463,19 @@ export default {
 
   .tabs-lo {
     display: inline-flex;
-    width: 30%;
+    width: 670px;
     margin-right: 15px;
   }
 
   .tabs-mo {
     display: inline-flex;
-    width: 70%;
+    flex: 1;
   }
 }
 
-
-
-.topTabs {
-  display: inline-flex;
-  width: 100%;
-  height: 100%;
-  min-height: 300px;
-  position: relative;
-  flex-direction: row;
-  flex-wrap: wrap;
-
-
-  >.item {
-    display: inline-flex;
-    position: relative;
-    flex-direction: column;
-    width: calc(100% /9 - 15px);
-    height: 175px;
-    margin-right: 15px;
-    margin-bottom: 15px;
-    background: linear-gradient(180deg, rgba(6, 66, 88, 0) 0%, #06425868 93%);
-    border-radius: 3px 3px 3px 3px;
-
-    .item-body {
-      position: relative;
-      display: inline-flex;
-      flex-direction: row;
-      width: 100%;
-      height: 100%;
-
-      img {
-        display: inline-flex;
-        width: 34px;
-        height: 34px;
-        border-radius: 50%;
-        border: 1px solid #00D1FF;
-      }
-
-      .left-body {
-        display: inline-flex;
-        position: relative;
-        width: 30%;
-        height: 100%;
-        flex-direction: column;
-        justify-content: center;
-        align-items: center;
-        margin: 0 10px;
-
-        .num {
-          display: inline-flex;
-          font-size: 19px;
-          font-family: PangMenZhengDao;
-          font-weight: 400;
-          color: #00D1FF;
-          margin: 0 10px;
-          margin-top: 20px;
-        }
-
-
-        .unit {
-          font-size: 12px;
-          font-family: PingFang SC, PingFang SC;
-          font-weight: 500;
-          color: #FFFFFFF0;
-          position: relative;
-          top: 5px;
-          left: 5px;
-        }
-
-      }
-
-      .line {
-        display: inline-flex;
-        width: 2px;
-        height: 100px;
-        background: linear-gradient(180deg, rgba(3, 60, 81, 0), rgba(0, 100, 137, 1), rgba(3, 60, 81, 0));
-        position: relative;
-        top: 30px;
-      }
-
-      .right-list {
-        display: inline-flex;
-        position: relative;
-        flex-direction: column;
-        justify-content: center;
-        align-items: center;
-        width: 100%;
-        height: 100%;
-
-        .list-text {
-          display: inline-flex;
-          position: relative;
-          width: 100%;
-          height: 40px;
-          font-size: 12px;
-          font-family: PingFang SC, PingFang SC;
-          font-weight: 400;
-          color: #FFFFFF;
-          justify-content: center;
-          align-items: center;
-
-          >span:first-child {
-            display: inline-flex;
-            width: 40px;
-          }
-
-          .show-text1 {
-            width: 100px;
-            color: #00EBC1ee;
-            font-size: 14px;
-            font-family: PangMenZhengDao;
-            font-weight: 800;
-          }
-
-          .show-text2 {
-            width: 100px;
-            color: #FFFFFFee;
-            font-size: 14px;
-            font-family: PangMenZhengDao;
-            font-weight: 800;
-          }
-
-          .show-text3 {
-            width: 100px;
-            color: #FFD15Cee;
-            font-size: 14px;
-            font-family: PangMenZhengDao;
-            font-weight: 800;
-          }
-        }
-
-      }
-
-
-    }
-
-    .title-tool {
-      position: relative;
-      display: inline-flex;
-      justify-content: center;
-      align-items: center;
-      width: 100%;
-      height: 36px;
-      background: linear-gradient(180deg, rgba(1, 139, 182, 0) 0%, #1FCAF160 100%);
-      border-radius: 3px 3px 0px 0px;
-
-      .text {
-        font-size: 17px;
-        font-family: PangMenZhengDao;
-        font-weight: 400;
-        color: #FFFFFF;
-      }
-
-
-
-
-
-
-    }
-
-    .title-tool::after {
-      content: "";
-      position: absolute;
-      bottom: 1px;
-      width: 100%;
-      height: 1px;
-      background: linear-gradient(90deg, rgba(81, 181, 255, 0) 3%, #51B5FF 49%, rgba(81, 181, 255, 0) 100%);
-    }
-  }
+.deviceSummary {
+    height: 390px;
+    margin-bottom: 10px;
 }
 
 .btnSearch {
@@ -802,10 +561,12 @@ export default {
   opacity: 0.1;
 }
 
-.footTabs {
-  display: inline;
+.saContent {
   width: 100%;
+  height: 100%;
+  .deviceAnalysis{
 
+  }
 }
 
 .topdiv {
@@ -822,13 +583,8 @@ export default {
   }
 }
 
-.TrafficFlow {
-  width: 100%;
-  height: 100%;
-  position: relative;
-  z-index: 6;
-  color: white;
-
+.statisticAnalysis {
+  padding: 8px 20px;
   .header-shot {
     width: 98%;
     margin: auto;
@@ -895,37 +651,6 @@ export default {
     }
   }
 
-  .foot {
-    width: 98%;
-    margin: auto;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    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
diff --git a/ruoyi-ui/vue.config.js b/ruoyi-ui/vue.config.js
index 4c77aff7..7b307e3c 100644
--- a/ruoyi-ui/vue.config.js
+++ b/ruoyi-ui/vue.config.js
@@ -49,8 +49,9 @@ module.exports = {
         // target: `http://10.0.81.202:8087`, //现场后台
         // target: `http://10.0.81.204:8087`, //现场后台 刘文阁
         // target: `http://10.168.69.255:8087`, //正晨后台 连现场物联 刘文阁
-        // target: `http://10.168.78.135:8087`,  //王钦
-        target: `http://10.168.66.196:8087`, //正晨后台 连现场物联 刘文阁2
+        target: `http://10.168.78.135:8087`,  //王钦
+        // target: `http://10.168.66.196:8087`, //正晨后台 连现场物联 刘文阁2
+        // target: `http://10.168.68.42:8087`, //王思祥
         changeOrigin: true,
         pathRewrite: {
           ["^" + process.env.VUE_APP_BASE_API]: "",