实时数据冻结图表滚动,改为表格区域滚动
This commit is contained in:
@@ -21,80 +21,6 @@
|
||||
<div class="right_charts"><MyEchart ref="pieChart6" :options="echartsDataA3"></MyEchart></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="view_bot" style="display: none">
|
||||
<div class="view_bot_tables">
|
||||
<!-- 表格数据 -->
|
||||
<div v-if="tableData.length != 0">
|
||||
<!-- div设计table -->
|
||||
<div class="table_container">
|
||||
<div class="table" v-for="(item, index) in columnsDataTop" :key="index">
|
||||
<div class="table_info">
|
||||
<!-- 单层表头 -->
|
||||
<div class="thead">
|
||||
<div class="thead_top">
|
||||
{{ item[0].showName ? item[0].showName : '' }}({{ item[0].unit }})
|
||||
</div>
|
||||
<div class="thead_bot">
|
||||
<div class="thead_bot_cell" v-for="(vv, key) in item" :key="key">
|
||||
{{ vv.phase == 'M' ? '' : vv.phase + '相 ' }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 有合并表头的数据 -->
|
||||
<div class="tbody">
|
||||
<div class="tbody_cell" v-for="(vv, key) in item" :key="key">
|
||||
{{
|
||||
tableData.find(item => {
|
||||
return item.anotherName == vv.showName && item.phase == vv.phase
|
||||
})?.statisticalData
|
||||
? tableData.find(item => {
|
||||
return item.anotherName == vv.showName && item.phase == vv.phase
|
||||
})?.statisticalData
|
||||
: '/'
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="table_container">
|
||||
<div class="table" v-for="(item, index) in columnsDataBot" :key="index">
|
||||
<div class="table_info">
|
||||
<!-- 单层表头 -->
|
||||
<div class="thead">
|
||||
<div class="thead_top">
|
||||
{{ item[0].showName ? item[0].showName : '' }}({{ item[0].unit }})
|
||||
</div>
|
||||
<div class="thead_bot">
|
||||
<div class="thead_bot_cell" v-for="(vv, key) in item" :key="key">
|
||||
{{ vv.phase == 'M' ? '' : vv.phase + '相 ' }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 有合并表头的数据 -->
|
||||
<div class="tbody">
|
||||
<div class="tbody_cell" v-for="(vv, key) in item" :key="key">
|
||||
{{
|
||||
tableData.find((item: any) => {
|
||||
return item.anotherName == vv.showName && item.phase == vv.phase
|
||||
})?.statisticalData
|
||||
? tableData.find((item: any) => {
|
||||
return item.anotherName == vv.showName && item.phase == vv.phase
|
||||
})?.statisticalData
|
||||
: '/'
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else style="border: 1px solid #eee">
|
||||
<el-empty description="暂无数据" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="view_bot">
|
||||
<vxe-table
|
||||
border
|
||||
@@ -663,9 +589,9 @@ onMounted(() => {
|
||||
.view {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding-bottom: 200px;
|
||||
box-sizing: border-box;
|
||||
overflow: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.view_top {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
@@ -718,6 +644,10 @@ onMounted(() => {
|
||||
.view_bot {
|
||||
min-height: 300px;
|
||||
margin: 10px 0 20px 0;
|
||||
overflow: auto !important;
|
||||
flex: 1 !important;
|
||||
padding-bottom: 200px !important;
|
||||
box-sizing: border-box !important;
|
||||
.view_bot_tables {
|
||||
margin-bottom: 10px;
|
||||
height: auto;
|
||||
|
||||
Reference in New Issue
Block a user