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