From a411e6a6e8baf3a0f0ebf6255f312669903d3754 Mon Sep 17 00:00:00 2001
From: haoxuan <haoxuan>
Date: 星期一, 22 一月 2024 17:38:23 +0800
Subject: [PATCH] 安装适配样式的插件和配置vite+调整页面样式
---
src/views/dashboard/components/DeviceNumberInfo.vue | 36 +++++++++++++++++++++++++-----------
1 files changed, 25 insertions(+), 11 deletions(-)
diff --git a/src/views/dashboard/components/DeviceNumberInfo.vue b/src/views/dashboard/components/DeviceNumberInfo.vue
index eaff37b..c0b8a7f 100644
--- a/src/views/dashboard/components/DeviceNumberInfo.vue
+++ b/src/views/dashboard/components/DeviceNumberInfo.vue
@@ -4,17 +4,27 @@
<div class="device-t">鏈満璁惧缂栫爜</div>
<div class="device-b">
<div class="device-info">
- {{ deviceInfo?.currentDeviceID }}
+ <el-popover placement="top" :width="200" trigger="click" :content="deviceInfo?.systemDeviceID">
+ <template #reference>
+ <el-text truncated style="color: #fff; max-width: 70px">{{ deviceInfo?.systemDeviceID }}</el-text>
+ </template>
+ </el-popover>
</div>
</div>
</div>
<div class="device-r">
- <div class="device-t">浜戠璁惧缂栫爜</div>
- <div class="device-b">
- <div v-for="(item, index) in deviceInfo?.deviceIDList" :key="index" class="device-info">
- {{ item }}
+ <el-scrollbar always class="scroller">
+ <div class="device-t">浜戠璁惧缂栫爜</div>
+ <div class="device-b">
+ <div v-for="item in deviceInfo?.deviceList" :key="item.deviceID" class="device-info">
+ <el-popover placement="top" :width="200" trigger="click" :content="item.deviceID">
+ <template #reference>
+ <el-text truncated style="color: #fff; max-width: 100px">{{ item.deviceID }}</el-text>
+ </template>
+ </el-popover>
+ </div>
</div>
- </div>
+ </el-scrollbar>
</div>
</div>
</template>
@@ -46,13 +56,17 @@
border: 1px solid $status-border;
box-sizing: border-box;
border-radius: 4px;
- padding: 5px 20px;
+ padding: 5px 5px 5px 20px;
.device-l {
- width: 120px;
+ width: 100px;
+ height: 100%;
float: left;
+ padding-right: 10px;
+ border-right: 1px solid $status-border;
}
.device-r {
- width: calc(100% - 130px);
+ width: calc(100% - 120px);
+ height: 100%;
float: right;
}
.device-t {
@@ -66,8 +80,8 @@
overflow: hidden;
}
.device-info {
- padding: 0px 6px;
- font-size: 12px;
+ padding: 2px 10px;
+ font-size: 14px;
line-height: 20px;
background: $status-ready;
color: #fff;
--
Gitblit v1.8.0