From 7d4dab8429f2979713b3ff2c99fc1504126bafd3 Mon Sep 17 00:00:00 2001
From: hzz <hzz>
Date: Wed, 21 Jun 2023 16:58:51 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B0=B4=E6=94=BE=E5=A4=A7=E5=B1=8F=20?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E5=8D=95=E4=BD=8D=20=E6=9C=BA=E6=A2=B0?=
 =?UTF-8?q?=E5=88=86=E5=8E=82=E8=AE=BE=E5=A4=87=E5=A4=A7=E5=B1=8F=20?=
 =?UTF-8?q?=E6=8F=90=E9=86=92=E6=B7=BB=E5=8A=A0=E6=97=A0=E6=95=B0=E6=8D=AE?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Mechanics/components/devStatusTip.vue     | 77 ++++++++++---------
 src/views/Waterhouse/index.vue                | 10 +--
 2 files changed, 47 insertions(+), 40 deletions(-)

diff --git a/src/views/Mechanics/components/devStatusTip.vue b/src/views/Mechanics/components/devStatusTip.vue
index 08d743e..167430d 100644
--- a/src/views/Mechanics/components/devStatusTip.vue
+++ b/src/views/Mechanics/components/devStatusTip.vue
@@ -11,10 +11,12 @@
   <div style="height: 100%; width: 100%">
     <h2 class="components-header">{{ title }}</h2>
     <div class="components-content" :key="keynum">
-      <swiper-container :slidesPerView="props.per_view" :loop="true" :initialSlide="0"  :spaceBetween="0" direction="vertical" :autoplay="{
-        delay: 3000,
-        disableOnInteraction: false,
-      }" autoHeight=true observer=true observeParents=true @progress="onProgress" :loopAdditionalSlides="1" @slidechange="onSlideChange">
+      <swiper-container :slidesPerView="props.per_view" :loop="true" :initialSlide="0" :spaceBetween="0"
+        direction="vertical" :autoplay="{
+          delay: 3000,
+          disableOnInteraction: false,
+        }" autoHeight=true observer=true observeParents=true @progress="onProgress" :loopAdditionalSlides="1"
+        @slidechange="onSlideChange" v-if="props.tipList.length > 0">
         <swiper-slide v-for="(res, index) in props.tipList" :key="res.id">
           <div class="itemclass">
             <el-row :gutter="5" class="row-flex">
@@ -29,32 +31,38 @@
                   <span>{{ label.duration }}：</span><span>{{ res.duration }}</span>
                 </p>
               </el-col>
-              <el-col :span="4" class="col-flex" style="font-size: 25px;font-weight: bold;" :style="{color:compare[res.status]?compare[res.status]:'red'}"> {{res.status}} </el-col>
+              <el-col :span="4" class="col-flex" style="font-size: 25px;font-weight: bold;"
+                :style="{ color: compare[res.status] ? compare[res.status] : 'red' }"> {{ res.status }} </el-col>
             </el-row>
           </div>
         </swiper-slide>
-      <template v-if="props.tipList.length>=props.per_view && props.tipList.length<props.per_view*2">
-        <swiper-slide v-for="(res, index) in props.tipList" :key="res.id">
-          <div class="itemclass">
-            <el-row :gutter="5" class="row-flex">
-              <el-col :span="2" class="col-flex" style="color: #fff; font-size: 18px;">
-                {{ index + 1 }}
-              </el-col>
-              <el-col :span="18" class="col-flex"
-                style="flex-direction: column; font-size: 18px; color: #fff; align-items: flex-start;">
-                <p><span>{{ label.name }} ：</span><span>{{ res.name }}</span></p>
-                <p style="margin-top: 10px 0;">
-                  <span>{{ label.date }}：</span><span>{{ res.date }}</span> &nbsp;
-                  <span>{{ label.duration }}：</span><span>{{ res.duration }}</span>
-                </p>
-              </el-col>
-              <el-col :span="4" class="col-flex" style="font-size: 25px;font-weight: bold;" :style="{color:compare[res.status]?compare[res.status]:'red'}"> {{res.status}} </el-col>
-            </el-row>
-          </div>
-        </swiper-slide>
-      </template>
+        <template v-if="props.tipList.length >= props.per_view && props.tipList.length < props.per_view * 2">
+          <swiper-slide v-for="(res, index) in props.tipList" :key="res.id">
+            <div class="itemclass">
+              <el-row :gutter="5" class="row-flex">
+                <el-col :span="2" class="col-flex" style="color: #fff; font-size: 18px;">
+                  {{ index + 1 }}
+                </el-col>
+                <el-col :span="18" class="col-flex"
+                  style="flex-direction: column; font-size: 18px; color: #fff; align-items: flex-start;">
+                  <p><span>{{ label.name }} ：</span><span>{{ res.name }}</span></p>
+                  <p style="margin-top: 10px 0;">
+                    <span>{{ label.date }}：</span><span>{{ res.date }}</span> &nbsp;
+                    <span>{{ label.duration }}：</span><span>{{ res.duration }}</span>
+                  </p>
+                </el-col>
+                <el-col :span="4" class="col-flex" style="font-size: 25px;font-weight: bold;"
+                  :style="{ color: compare[res.status] ? compare[res.status] : 'red' }"> {{ res.status }} </el-col>
+              </el-row>
+            </div>
+          </swiper-slide>
+        </template>
       </swiper-container>
+      <div v-else style="display: flex; align-items: center;width: 100%;height: 100%;justify-content: center;">
+        <el-empty :image-size="120" />
+      </div>
     </div>
+
   </div>
 </template>
   
@@ -64,18 +72,18 @@ import { register } from "swiper/element/bundle";
 import { useI18n } from "vue-i18n";
 let { t } = useI18n();
 register();
-const props:any = defineProps({
+const props: any = defineProps({
   title: {
     type: String,
     default: "",
   },
   tipList: {
     type: Array,
-    default: [{name:'',date:'',duration:'',status:''}],
+    default: [{ name: '', date: '', duration: '', status: '' }],
   },
   label: {
     type: Object,
-    default: { name: "设备名称", date: "保养日期", duration: "保养时长"}
+    default: { name: "设备名称", date: "保养日期", duration: "保养时长" }
   },
   per_view: {
     type: Number,
@@ -83,11 +91,11 @@ const props:any = defineProps({
   },
 });
 let compare = {
-  '进行中':'#83C710',
-  '未开始':'#E44610',
-  '未进行':'#E54711',
-  '故障':'#DA0F10',
-  '维修中':'#83C710',
+  '进行中': '#83C710',
+  '未开始': '#E44610',
+  '未进行': '#E54711',
+  '故障': '#DA0F10',
+  '维修中': '#83C710',
 }
 let useSwiper: any = ref(null);
 let swiperRef = ref(null);
@@ -144,6 +152,5 @@ swiper-container {
   width: 100%;
   height: 100%;
   display: inline-block !important;
-}
-</style>
+}</style>
   
\ No newline at end of file
diff --git a/src/views/Waterhouse/index.vue b/src/views/Waterhouse/index.vue
index 3878aaa..51f1b53 100644
--- a/src/views/Waterhouse/index.vue
+++ b/src/views/Waterhouse/index.vue
@@ -88,9 +88,9 @@ document.title = t('messages.南门水房物联监测系统')
 const colors = ['#5470C6', '#91CC75', '#EE6666'];
 //进水量 出水量 用电量 最大值 最小值 平均值
 let mathList = reactive([
-    { color: '#5470C6', name: '进水量', max: 100, min: 0, avg: 50 },
-    { color: '#91CC75', name: '出水量', max: 100, min: 0, avg: 50 },
-    { color: '#EE6666', name: '用电量', max: 100, min: 0, avg: 50 }
+    { color: '#5470C6', name: '进水量（m³）', max: 100, min: 0, avg: 50 },
+    { color: '#91CC75', name: '出水量（m³）', max: 100, min: 0, avg: 50 },
+    { color: '#EE6666', name: '用电量（kW·h）', max: 100, min: 0, avg: 50 }
 ])
 
 function initChart(date,inChart, outChart, currentChart) {
@@ -123,11 +123,11 @@ function initChart(date,inChart, outChart, currentChart) {
         yAxis: [
             {
                 type: 'value',
-                name: '水量',
+                name: '水量（m³）',
             },
             {
                 type: 'value',
-                name: '电量',
+                name: '电量（kW·h）',
                 position: 'right',
                 axisLine: {
                     show: true,