From d517e5eacb38b075ae7cdffc011fc84401e587a8 Mon Sep 17 00:00:00 2001
From: songshankun <songshankun@foxmail.com>
Date: 星期三, 08 十一月 2023 10:12:50 +0800
Subject: [PATCH] feat: 添加报工输入弹窗

---
 src/views/dashboard/components/DashboardTitle.vue |   26 +++++++++++++++++++++-----
 1 files changed, 21 insertions(+), 5 deletions(-)

diff --git a/src/views/dashboard/components/DashboardTitle.vue b/src/views/dashboard/components/DashboardTitle.vue
index 981972f..49d3323 100644
--- a/src/views/dashboard/components/DashboardTitle.vue
+++ b/src/views/dashboard/components/DashboardTitle.vue
@@ -1,23 +1,28 @@
 <template>
   <div class="dashboard-title">
     <div class="title-text">
-      鏅鸿兘宸ヤ綔鍙� 鈥� {{ deviceStore?.deviceInfo?.currentDeviceID ?? '' }}
+      鏅鸿兘宸ヤ綔鍙� 鈥�
+      <el-popover placement="bottom" :width="200" trigger="click" :content="currentDeviceName">
+        <template #reference>
+          <el-text truncated class="device-name">{{ currentDeviceName }}</el-text>
+        </template>
+      </el-popover>
       <el-icon size="32" color="#0db7f5" style="margin-left: 20px; cursor: pointer" @click="openDevicesModal">
         <IconSlider></IconSlider>
       </el-icon>
     </div>
     <div class="title-status">
       <div class="connection-info" @click="openProblemsModal">
-        <el-icon size="30" :color="problemsIconStatus ? '#00ff00' : '#ff0000'">
+        <el-icon size="26" :color="problemsIconStatus ? '#00ff00' : '#ff0000'">
           <AlertLightIcon></AlertLightIcon>
         </el-icon>
       </div>
       <div class="cloud-connection-status">
-        <el-icon v-if="cloudConnectionIconStatus" size="45" color="#00ff00">
+        <el-icon v-if="cloudConnectionIconStatus" size="38" color="#00ff00">
           <IconCloudDone></IconCloudDone>
         </el-icon>
 
-        <el-icon v-else size="45" color="#ff0000">
+        <el-icon v-else size="38" color="#ff0000">
           <IconCloudOff></IconCloudOff>
         </el-icon>
       </div>
@@ -63,6 +68,12 @@
 
 // 鑾峰彇褰撳墠璁惧鍚�
 const deviceStore = useDevicesStore()
+const currentDeviceName = computed(() => {
+  return (
+    deviceStore?.deviceInfo?.deviceList?.find((ele) => ele?.deviceID === deviceStore?.deviceInfo?.currentDeviceID)
+      ?.deviceName ?? ''
+  )
+})
 
 // 闂璇婃柇鍒楄〃
 const problemList = computed(() => {
@@ -121,10 +132,15 @@
   align-items: center;
   position: absolute;
   top: 16px;
-  right: 40px;
+  right: 6px;
 }
 .connection-info {
   margin-right: 10px;
   cursor: pointer;
 }
+.device-name {
+  max-width: 340px;
+  font-size: 40px;
+  color: #fff;
+}
 </style>

--
Gitblit v1.8.0