From 15f938d1756a9da8bd1323edda92bd0f52537bb4 Mon Sep 17 00:00:00 2001
From: songshankun <songshankun@foxmail.com>
Date: 星期四, 02 十一月 2023 16:55:47 +0800
Subject: [PATCH] feat: 调整设备信息取值
---
src/views/dashboard/components/DashboardTitle.vue | 30 +++++++++++++++++++++---------
1 files changed, 21 insertions(+), 9 deletions(-)
diff --git a/src/views/dashboard/components/DashboardTitle.vue b/src/views/dashboard/components/DashboardTitle.vue
index ed14226..b55e9fb 100644
--- a/src/views/dashboard/components/DashboardTitle.vue
+++ b/src/views/dashboard/components/DashboardTitle.vue
@@ -1,32 +1,41 @@
<template>
<div class="dashboard-title">
- <div class="title-text">鏅鸿兘宸ヤ綔鍙� 鈥� {{ props?.deviceInfo?.currentDeviceID ?? '' }}</div>
+ <div class="title-text">鏅鸿兘宸ヤ綔鍙� 鈥� {{ deviceStore?.deviceInfo?.currentDeviceID ?? '' }}</div>
<div class="title-status">
<div class="connection-info" @click="openSelectDeviceModal">
<el-icon size="30" color="red">
<AlertLightIcon></AlertLightIcon>
</el-icon>
</div>
- <div class="connection-status"></div>
+ <div class="cloud-connection-status">
+ <el-icon size="45" color="#ff0000">
+ <IconCloudOff></IconCloudOff>
+ </el-icon>
+
+ <el-icon size="45" color="#00ff00">
+ <IconCloudDone></IconCloudDone>
+ </el-icon>
+ </div>
</div>
</div>
+
+ <TroubleTrackerModal v-model="showModal"></TroubleTrackerModal>
</template>
<script setup lang="ts">
-import type { Devices } from '@/api/device'
import AlertLightIcon from '@/components/icons/AlertLightIcon.vue'
import { ref } from 'vue'
-
-export interface DashBoardTitleProps {
- deviceInfo: Devices
-}
-
-const props = defineProps<DashBoardTitleProps>()
+import { useDevicesStore } from '@/stores/devices'
+import TroubleTrackerModal from '@/views/dashboard/components/TroubleTrackerModal.vue'
+import IconCloudDone from '~icons/material-symbols-light/cloud-done-outline'
+import IconCloudOff from '~icons/material-symbols-light/cloud-off-outline'
const showModal = ref(false)
function openSelectDeviceModal() {
showModal.value = true
}
+
+const deviceStore = useDevicesStore()
</script>
<style scoped lang="scss">
@@ -41,11 +50,14 @@
font-weight: 700;
}
.title-status {
+ display: flex;
+ align-items: center;
position: absolute;
top: 16px;
right: 40px;
}
.connection-info {
+ margin-right: 10px;
cursor: pointer;
}
</style>
--
Gitblit v1.8.0