Web/admin-govern
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

提交

Browse Source
This commit is contained in:
GGJ
2024-01-03 14:50:26 +08:00
parent 6e6717d23c
commit 956c235e82
4 changed files with 111 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
src/views/dashboard/components/Tableabove.vue
View File

@@ -5,59 +5,51 @@
</span>
<el-tabs tab-position="left" class="demo-tabs" style="margin-top: 10px">
<el-tab-pane label="区域">
<el-table :data="areaData" border height="calc(100vh - 220px)" stripe style="width: 100%">
<template v-for="item in tableHeaderAera">
<el-table-column
align="center"
:prop="item.prop"
:label="item.label"
<div class="default-main">
<vxe-table :data="areaData" v-bind="defaultAttribute" height="auto" auto-resize>
<vxe-column
v-for="item in tableHeaderAera"
:field="item.prop"
:title="item.label"
:min-width="item.width"
:sortable="item.sortable"
></el-table-column>
</template>
</el-table>
:formatter="formatter"
></vxe-column>
</vxe-table>
</div>
</el-tab-pane>
<el-tab-pane label="电压等级">
<el-table :data="levelData" border height="calc(100vh - 220px)" stripe style="width: 100%">
<template v-for="item in tableHeaderLevel">
<el-table-column
align="center"
:prop="item.prop"
:label="item.label"
<div class="default-main">
<vxe-table :data="levelData" v-bind="defaultAttribute" height="auto" auto-resize>
<vxe-column
v-for="item in tableHeaderLevel"
:field="item.prop"
:title="item.label"
:min-width="item.width"
:sortable="item.sortable"
></el-table-column>
</template>
</el-table>
></vxe-column>
</vxe-table>
</div>
</el-tab-pane>
<el-tab-pane label="月份">
<el-table :data="shareData" border height="calc(100vh - 220px)" stripe style="width: 100%">
<el-table-column
prop="month"
label="月份"
align="center"
min-width="120px"
sortable
></el-table-column>
<el-table-column prop="notAssociated" align="center" label="电压暂降次数" sortable>
<!-- <template slot-scope="scope">
<span v-if="scope.row.month != '总计'">
{{ scope.row.linked + scope.row.notAssociated }}
</span>
<span v-else>{{ scope.row.notAssociated }}</span>
</template> -->
</el-table-column>
</el-table>
<div class="default-main">
<vxe-table :data="shareData" v-bind="defaultAttribute" height="auto" auto-resize>
<vxe-column field="month" title="月份" min-width="120px" sortable></vxe-column>
<vxe-column field="notAssociated" title="电压暂降次数" sortable></vxe-column>
</vxe-table>
</div>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script setup lang="ts">
import { ref, reactive, defineExpose } from 'vue'
const tableData = ref<any[]>([])
import { ref, reactive, defineExpose, computed } from 'vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
const areaData = ref<any[]>([])
const levelData = ref<any[]>([])
const shareData = ref<any[]>([])
const tableHeaderAera = ref<any[]>([
{ prop: 'areaName', label: '区域名称', width: '120px' },
{ prop: 'monitoringPoints', label: '监测点数', sortable: true },
@@ -104,10 +96,20 @@ const info = (list: any) => {
...list.monthlyStatistics.monthCalculation
]
}
const formatter = (row: any) => {
if (row.column.field == 'areaName') {
return (row.cellValue = row.cellValue.replace('\n', ''))
} else {
return row.cellValue
}
}
defineExpose({ info })
</script>
<style lang="scss" scoped>
::v-deep(.el-tabs--left) {
height: calc(100vh - 220px);
}
.default-main {
height: calc(100vh - 220px);
}
</style>