From 39913b145347f509a1137a398f9803fca7e4f4b8 Mon Sep 17 00:00:00 2001 From: ZhangXianQiang <1135831638@qq.com> Date: 星期四, 29 二月 2024 14:00:13 +0800 Subject: [PATCH] fix:修改线段图表 --- src/views/daoAnOffice/right/danger/dataTable.vue | 79 +++++++++++++++++++++++++-------------- 1 files changed, 51 insertions(+), 28 deletions(-) diff --git a/src/views/daoAnOffice/right/danger/dataTable.vue b/src/views/daoAnOffice/right/danger/dataTable.vue index 99fd020..9df40e7 100644 --- a/src/views/daoAnOffice/right/danger/dataTable.vue +++ b/src/views/daoAnOffice/right/danger/dataTable.vue @@ -9,34 +9,37 @@ </div> </div> <div class="table-container flex-1"> - <el-table class="data-table" :data="tableData" :highlight-current-row="false" :stripe="true" - :header-cell-style="{ backgroundColor: 'transparent', color: '#79A5E9', borderColor: '#29466A' }" - :cell-style="{ color: '#79A5E9', borderColor: '#29466A', paddingTop: '10px', paddingBottom: '10px' }" - :row-style="{ backgroundColor: 'transparent' }"> - <el-table-column prop="street" label="闀�/琛楅亾" align="center" /> - <el-table-column label="鍙戠幇鏁伴噺" align="center"> - <template #default="scope"> - <div style="color: #6289E6;"> - {{ scope.row.num1 }} - </div> - </template> - </el-table-column> + <div class="table-content"> + <el-table class="data-table" :data="tableData" :highlight-current-row="false" :stripe="true" + :header-cell-style="{ backgroundColor: 'transparent', color: '#79A5E9', borderColor: '#29466A' }" + :cell-style="{ color: '#79A5E9', borderColor: '#29466A', paddingTop: '10px', paddingBottom: '10px' }" + :row-style="{ backgroundColor: 'transparent' }"> + <el-table-column prop="street" label="闀�/琛楅亾" align="center" /> + <el-table-column label="鍙戠幇鏁伴噺" align="center"> + <template #default="scope"> + <div style="color: #6289E6;"> + {{ scope.row.num1 }} + </div> + </template> + </el-table-column> - <el-table-column label="涓嬪彂閫氱煡涔�" align="center"> - <template #default="scope"> - <div style="color: #CFB249;"> - {{ scope.row.num2 }} - </div> - </template> - </el-table-column> - <el-table-column label="澶勭疆鏁伴噺" align="center"> - <template #default="scope"> - <div style="color: #2BB06D;"> - {{ scope.row.num3 }} - </div> - </template> - </el-table-column> - </el-table> + <el-table-column label="涓嬪彂閫氱煡涔�" align="center"> + <template #default="scope"> + <div style="color: #CFB249;"> + {{ scope.row.num2 }} + </div> + </template> + </el-table-column> + <el-table-column label="澶勭疆鏁伴噺" align="center"> + <template #default="scope"> + <div style="color: #2BB06D;"> + {{ scope.row.num3 }} + </div> + </template> + </el-table-column> + </el-table> + </div> + </div> </div> </template> @@ -86,6 +89,18 @@ num2: 5, num3: 2 }, + { + street: '濂庡厜濉旇閬�', + num1: 12, + num2: 5, + num3: 2 + }, + { + street: '濂庡厜濉旇閬�', + num1: 12, + num2: 5, + num3: 2 + }, ]; </script> @@ -93,7 +108,15 @@ .container { height: 360px; } - +.table-container { + position: relative; +} +.table-content { + width: 100%; + position: absolute; + top: 0; + bottom: 0; +} .table-top { height: 51px; background-color: rgba(17, 34, 58, 0.6); -- Gitblit v1.8.0