From db4cc27effde2a0359ed616b470c9d00d8c16b56 Mon Sep 17 00:00:00 2001
From: hzz <hzz>
Date: Fri, 22 Sep 2023 18:00:06 +0800
Subject: [PATCH] =?UTF-8?q?=E5=9C=BA=E5=A4=96=E7=A6=BB=E7=BA=BF=E7=8A=B6?=
 =?UTF-8?q?=E6=80=81=E9=A2=9C=E8=89=B2=E4=BF=AE=E6=94=B9=20=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E5=8D=B1=E5=BA=9F=E5=93=81=E7=AE=B1=E5=A4=A7=E5=B1=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/router/index.ts                           |  5 ++
 src/views/Hazardous/components/Border.vue     | 16 ++++
 src/views/Hazardous/index.vue                 | 76 +++++++++++++++++++
 .../Offsite/child/childContent/center.vue     |  4 +-
 .../child/childContent/chart/devTip.vue       |  2 +-
 .../OffsiteDevList/childContent/center.vue    |  4 +-
 .../childContent/chart/devTip.vue             |  2 +-
 7 files changed, 103 insertions(+), 6 deletions(-)
 create mode 100644 src/views/Hazardous/components/Border.vue
 create mode 100644 src/views/Hazardous/index.vue

diff --git a/src/router/index.ts b/src/router/index.ts
index 2284c40..c76d233 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -290,6 +290,11 @@ const routes: Array<RouteRecordRaw> = [
         name: "MicroExhibitionTable",
         component: () => import("../views/MicroExhibition/table.vue"),
       },
+      {
+        path: "/Hazardous",
+        name: "Hazardous",
+        component: () => import("../views/Hazardous/index.vue"),
+      },
 
 
 
diff --git a/src/views/Hazardous/components/Border.vue b/src/views/Hazardous/components/Border.vue
new file mode 100644
index 0000000..bbfc060
--- /dev/null
+++ b/src/views/Hazardous/components/Border.vue
@@ -0,0 +1,16 @@
+<template>
+  <div class="border-container">
+    
+  </div>
+</template>
+
+<script setup lang='ts'>
+</script>
+
+<style scoped>
+.border-container {
+    width: 100%;
+    height: 100%;
+}
+
+</style>
diff --git a/src/views/Hazardous/index.vue b/src/views/Hazardous/index.vue
new file mode 100644
index 0000000..7399b87
--- /dev/null
+++ b/src/views/Hazardous/index.vue
@@ -0,0 +1,76 @@
+<template>
+    <div class="container">
+        <div class="header">
+            <div class="title">
+                <header2 ref="headerref" :width="'100%'" :height="'100px'" :title="'危废品箱物联检测系统'" :titleTip="[]"
+                    :typeFun="['time']" :alarmType="[]"></header2>
+            </div>
+        </div>
+        <div class="content">
+            <div class="img-box">
+                <svg  t="1695353681154" class="icon" viewBox="0 0 1332 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6587" xmlns:xlink="http://www.w3.org/1999/xlink" width="166.5" height="128"><path d="M407.556511 774.956201a35.225282 35.225282 0 0 1 14.090113-22.191928 35.225282 35.225282 0 0 0-35.225282-60.939738 105.675846 105.675846 0 0 0-46.497372 66.22353 161.331791 161.331791 0 0 0 33.464018 126.458762 35.225282 35.225282 0 0 1 8.101814 30.998248 84.188424 84.188424 0 0 1-35.225281 42.270338 35.225282 35.225282 0 0 0 15.146871 63.757761 39.452316 39.452316 0 0 0 17.260388-4.579287 153.934482 153.934482 0 0 0 70.450564-87.710952 108.141615 108.141615 0 0 0-18.6694-87.006446 101.096559 101.096559 0 0 1-22.896433-67.280288zM959.88893 774.956201a35.225282 35.225282 0 0 1 14.090113-22.191928 35.225282 35.225282 0 0 0-35.225282-60.939738 105.675846 105.675846 0 0 0-46.497372 66.22353 161.331791 161.331791 0 0 0 35.225282 126.458762 35.225282 35.225282 0 0 1 8.101815 30.998248 84.188424 84.188424 0 0 1-35.225282 42.270338 35.225282 35.225282 0 0 0-13.73786 48.258637 35.225282 35.225282 0 0 0 30.998248 17.964893 39.452316 39.452316 0 0 0 17.260388-4.579286 155.343493 155.343493 0 0 0 70.450564-87.710952 108.141615 108.141615 0 0 0-18.6694-87.006446 101.096559 101.096559 0 0 1-26.771214-69.746058zM683.722721 774.956201a35.225282 35.225282 0 0 1 14.090112-22.191928 35.225282 35.225282 0 0 0-35.225281-60.939738 105.675846 105.675846 0 0 0-46.497373 66.22353 161.331791 161.331791 0 0 0 35.225282 126.458762 35.225282 35.225282 0 0 1 8.101815 30.998248 84.188424 84.188424 0 0 1-35.225282 42.270338A35.225282 35.225282 0 0 0 637.577601 1021.533174a39.452316 39.452316 0 0 0 17.260389-4.579287 155.343493 155.343493 0 0 0 70.450563-87.710952 108.141615 108.141615 0 0 0-18.669399-87.006446 101.096559 101.096559 0 0 1-22.896433-67.280288z" fill="#20AEC5" p-id="6588"></path><path d="M1141.299132 239.179664m-52.837923 0a52.837923 52.837923 0 1 0 105.675846 0 52.837923 52.837923 0 1 0-105.675846 0Z" fill="#20AEC5" p-id="6589"></path><path d="M1224.78305 0H105.675846a105.675846 105.675846 0 0 0-105.675846 105.675846v428.69168a105.675846 105.675846 0 0 0 105.675846 105.675845h1119.107204a105.675846 105.675846 0 0 0 105.675845-105.675845V105.675846a105.675846 105.675846 0 0 0-105.675845-105.675846zM105.675846 70.450564h1119.107204a35.225282 35.225282 0 0 1 35.225282 35.225282v281.802254H70.450564V105.675846a35.225282 35.225282 0 0 1 35.225282-35.225282z m1119.107204 499.142243H105.675846a35.225282 35.225282 0 0 1-35.225282-35.225281V457.928664h1189.557768v77.847873a35.225282 35.225282 0 0 1-35.225282 33.81627z" fill="#20AEC5" p-id="6590"></path></svg>
+            </div>
+
+        </div>
+    </div>
+</template>
+
+<script setup lang='ts'>
+import header2 from '@/components/headerBox/header2.vue'
+</script>
+
+<style scoped>
+.container {
+    height: 1080px;
+    width: 1920px;
+    color: #FFFFFF;
+    /* background-color: #0E0E0E; */
+    position: relative;
+
+}
+
+.header {
+    height: 100px;
+    width: 1920px;
+}
+
+.content {
+    height: 980px;
+    width: 1920px;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    padding: 0 5px;
+    box-sizing: border-box;
+}
+
+.img-box {
+    width: 100px;
+    height: 100px;
+    position: relative;
+}
+.img-box svg {
+    width: 100%;
+    height: 100%;
+}
+.img-box::after {
+    content: '';
+    position: absolute;
+    width: 100%;
+    height: 40%;
+    background-color: #100c2a;
+    box-sizing: border-box;
+    left: 0;
+    bottom: 0;
+    z-index: 1;
+    animation: myfirst 1.5s linear infinite;
+}
+
+@keyframes myfirst
+{
+    0%   {height: 40%;} 
+    25%  {height: 25%;}
+    50%  {height: 10%;}
+    100% {height: 0;}
+}
+</style>
diff --git a/src/views/Offsite/child/childContent/center.vue b/src/views/Offsite/child/childContent/center.vue
index 20efacf..3f57c1e 100644
--- a/src/views/Offsite/child/childContent/center.vue
+++ b/src/views/Offsite/child/childContent/center.vue
@@ -144,7 +144,7 @@ function changedevlist(val: any) {
       res.realityDate,
       JSON.parse(res.deviceStatus)
         ? `<span style="color:#20aec5;">${t('messages.onLine')}</span>`
-        : `<span style="color:rgb(228, 57, 97);">${t('messages.offline')}</span>`,
+        : `<span style="">${t('messages.offline')}</span>`,
       // "",
     ]);
     
@@ -191,7 +191,7 @@ function setDataList(val: any) {
   //设置页面数据
   topTitleRef.value.setData({ title: t('messages.OnlineNum'), num: tipdata.ison });
   topTitleRef2.value.setData({ title: t('messages.TOTAL'), num: tipdata.isall });
-  topTitleRef3.value.setData({ title: t('messages.OffNum'), num: tipdata.isoff ,color:'rgb(228, 57, 97)' });
+  topTitleRef3.value.setData({ title: t('messages.OffNum'), num: tipdata.isoff ,color:'' });
   changedevlist(val.citylist);
 }
 onMounted(() => {
diff --git a/src/views/Offsite/child/childContent/chart/devTip.vue b/src/views/Offsite/child/childContent/chart/devTip.vue
index b612142..e6583e7 100644
--- a/src/views/Offsite/child/childContent/chart/devTip.vue
+++ b/src/views/Offsite/child/childContent/chart/devTip.vue
@@ -33,7 +33,7 @@
                       <p>时间:<span>{{ res.ts }}</span></p>
                     </div>
                     <div class="item-text">
-                      <p><span :style="{ color: JSON.parse(res.status) ? '#20aec5' : 'rgb(228, 57, 97)' }">{{ JSON.parse(res.status) ? t('messages.onLine') : t('messages.offline') }}</span></p>
+                      <p><span :style="{ color: JSON.parse(res.status) ? '#20aec5' : '' }">{{ JSON.parse(res.status) ? t('messages.onLine') : t('messages.offline') }}</span></p>
                       <p>{{t('messages.JiqiName')}}:<span>{{ res.name }}</span></p>
                     </div>
                   </div>
diff --git a/src/views/Temp/OffsiteDevList/childContent/center.vue b/src/views/Temp/OffsiteDevList/childContent/center.vue
index 723e6af..df63526 100644
--- a/src/views/Temp/OffsiteDevList/childContent/center.vue
+++ b/src/views/Temp/OffsiteDevList/childContent/center.vue
@@ -145,7 +145,7 @@ function changedevlist(val: any) {
       res.realityDate,
       JSON.parse(res.deviceStatus)
         ? `<span style="color:#20aec5;">${t('messages.onLine')}</span>`
-        : `<span style="color:rgb(228, 57, 97);">${t('messages.offline')}</span>`,
+        : `<span style="">${t('messages.offline')}</span>`,
       // "",
     ]);
     
@@ -192,7 +192,7 @@ function setDataList(val: any) {
   //设置页面数据
   topTitleRef.value.setData({ title: t('messages.OnlineNum'), num: tipdata.ison });
   topTitleRef2.value.setData({ title: t('messages.TOTAL'), num: tipdata.isall });
-  topTitleRef3.value.setData({ title: t('messages.OffNum'), num: tipdata.isoff,color:'rgb(228, 57, 97)' });
+  topTitleRef3.value.setData({ title: t('messages.OffNum'), num: tipdata.isoff,color:'' });
   changedevlist(val.citylist);
 }
 onMounted(() => {
diff --git a/src/views/Temp/OffsiteDevList/childContent/chart/devTip.vue b/src/views/Temp/OffsiteDevList/childContent/chart/devTip.vue
index cd56798..3268382 100644
--- a/src/views/Temp/OffsiteDevList/childContent/chart/devTip.vue
+++ b/src/views/Temp/OffsiteDevList/childContent/chart/devTip.vue
@@ -33,7 +33,7 @@
                       <p>时间:<span>{{ res.ts }}</span></p>
                     </div>
                     <div class="item-text">
-                      <p><span :style="{ color: JSON.parse(res.status) ? '#20aec5' : 'rgb(228, 57, 97)' }">{{ JSON.parse(res.status) ? t('messages.onLine') : t('messages.offline') }}</span></p>
+                      <p><span :style="{ color: JSON.parse(res.status) ? '#20aec5' : '' }">{{ JSON.parse(res.status) ? t('messages.onLine') : t('messages.offline') }}</span></p>
                       <p>{{t('messages.DevName')}}:<span>{{ res.name }}</span></p>
                     </div>
                   </div>