From d148b5972bc7d528c512161974b43513c0a6066a Mon Sep 17 00:00:00 2001 From: haoxuan <haoxuan> Date: 星期五, 03 十一月 2023 17:49:57 +0800 Subject: [PATCH] 人员信息样式调整+云端设备编码增加滚动条和边框 --- src/views/dashboard/components/DeviceNumberInfo.vue | 26 ++++++++++++++++---------- 1 files changed, 16 insertions(+), 10 deletions(-) diff --git a/src/views/dashboard/components/DeviceNumberInfo.vue b/src/views/dashboard/components/DeviceNumberInfo.vue index 82086ed..839a73c 100644 --- a/src/views/dashboard/components/DeviceNumberInfo.vue +++ b/src/views/dashboard/components/DeviceNumberInfo.vue @@ -9,12 +9,14 @@ </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, index) in deviceInfo?.deviceIDList" :key="index" class="device-info"> + {{ item }} + </div> </div> - </div> + </el-scrollbar> </div> </div> </template> @@ -46,13 +48,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 +72,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