118 lines
2.9 KiB
Vue
118 lines
2.9 KiB
Vue
<template>
|
|
<div>
|
|
<el-table
|
|
class="common-table"
|
|
:data="tableData"
|
|
stripe
|
|
style="width: 100%; margin-top: 25px"
|
|
>
|
|
<el-table-column prop="deviceId" label="单体编号"></el-table-column>
|
|
<el-table-column prop="clusterDeviceId" label="簇号"></el-table-column>
|
|
<el-table-column prop="voltage" label="电压 (V)">
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
@click="chartDetail(scope.row, 'voltage')"
|
|
type="text"
|
|
size="small"
|
|
>
|
|
{{ scope.row.voltage }}
|
|
</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="temperature" label="温度 (℃)">
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
@click="chartDetail(scope.row, 'temperature')"
|
|
type="text"
|
|
size="small"
|
|
>
|
|
{{ scope.row.temperature }}
|
|
</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="soc" label="SOC (%)">
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
@click="chartDetail(scope.row, 'soc')"
|
|
type="text"
|
|
size="small"
|
|
>
|
|
{{ scope.row.soc }}
|
|
</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="soh" label="SOH (%)">
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
@click="chartDetail(scope.row, 'soh')"
|
|
type="text"
|
|
size="small"
|
|
>
|
|
{{ scope.row.soh }}
|
|
</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<!-- <el-pagination
|
|
v-show="tableData.length > 0"
|
|
background
|
|
@size-change="(val) => $emit('handleSizeChange', val)"
|
|
@current-change="(val) => $emit('handleCurrentChange', val)"
|
|
:current-page="pageNum"
|
|
:page-size="pageSize"
|
|
:page-sizes="[10, 20, 30, 40]"
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
:total="totalSize"
|
|
style="margin-top: 15px; text-align: center"
|
|
>
|
|
</el-pagination> -->
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
tableData: {
|
|
require: true,
|
|
type: Array,
|
|
default: () => {
|
|
return [];
|
|
},
|
|
},
|
|
pointIdList: {
|
|
require: true,
|
|
type: Object,
|
|
default: () => {
|
|
return {};
|
|
},
|
|
},
|
|
totalSize: {
|
|
require: true,
|
|
type: Number,
|
|
default: 0,
|
|
},
|
|
// pageNum: {
|
|
// require: true,
|
|
// type: Number,
|
|
// default: 1,
|
|
// },
|
|
// pageSize: {
|
|
// require: true,
|
|
// type: Number,
|
|
// default: 10,
|
|
// },
|
|
},
|
|
data() {
|
|
return {};
|
|
},
|
|
methods: {
|
|
//查看表格行图表
|
|
chartDetail(row, fieldKey = "") {
|
|
this.$emit("chart", {...row, fieldKey});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style></style>
|