From 3a64511eaac77a4677d0ecf41c65af6b56ea7978 Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期四, 25 七月 2024 11:15:56 +0800
Subject: [PATCH] 表格自适应
---
src/components/chat/chatComponents/summaryCom/components/deviceLastValue/MonitorContent.vue | 17 +++++++++++++----
1 files changed, 13 insertions(+), 4 deletions(-)
diff --git a/src/components/chat/chatComponents/summaryCom/components/deviceLastValue/MonitorContent.vue b/src/components/chat/chatComponents/summaryCom/components/deviceLastValue/MonitorContent.vue
index b2a2bd5..b37996f 100644
--- a/src/components/chat/chatComponents/summaryCom/components/deviceLastValue/MonitorContent.vue
+++ b/src/components/chat/chatComponents/summaryCom/components/deviceLastValue/MonitorContent.vue
@@ -9,7 +9,7 @@
<div
:class="ROW_HEADER_CELL_CLASS"
:style="{
- width: `${CELL_WIDTH}px`,
+ width: `${firstColWidth}px`,
height: `${CELL_HEIGHT}px`,
}"
>
@@ -20,18 +20,20 @@
:key="index"
:class="CONTENT_CELL_CLASS"
:style="{
- width: `${CELL_WIDTH}px`,
+ width: `${restColWidth}px`,
height: `${CELL_HEIGHT}px`,
}"
>
- {{ item[type] }}
+ <span>
+ {{ item[type] }}
+ </span>
</div>
</div>
</template>
<script setup lang="ts">
import type { PropType } from 'vue';
-import { BORDER_COLOR, CELL_HEIGHT, CELL_WIDTH, CONTENT_CELL_CLASS, ROW_HEADER_CELL_CLASS, THICK_BORDER_WIDTH } from './constants';
+import { BORDER_COLOR, CELL_HEIGHT, CONTENT_CELL_CLASS, ROW_HEADER_CELL_CLASS, THICK_BORDER_WIDTH } from './constants';
import type { MonitorValue } from './types';
const props = defineProps({
/** @description 鏍囬 */
@@ -46,6 +48,13 @@
values: {
type: Object as PropType<MonitorValue[]>,
},
+ firstColWidth: {
+ type: Number,
+ },
+
+ restColWidth: {
+ type: Number,
+ },
});
</script>
<style scoped lang="scss"></style>
--
Gitblit v1.9.3