<template>
|
<el-row class="wrap">
|
<el-col span="2" class="flex-col">
|
<el-row justify="end">
|
<CardButton
|
name="走航数据详情"
|
direction="left"
|
@click="() => (show = !show)"
|
></CardButton>
|
</el-row>
|
<el-row class="flex-col">
|
<DataSummary
|
v-show="show"
|
:loading="loading"
|
:factor-datas="factorDatas"
|
:select-factor-type="selectFactorType"
|
></DataSummary>
|
</el-row>
|
</el-col>
|
<el-col v-show="show" span="10">
|
<el-row align="bottom">
|
<DataTable
|
:loading="loading"
|
:select-factor-type="selectFactorType"
|
:factor-datas="factorDatas"
|
:device-type="deviceType"
|
:locate-index="locateIndex"
|
@table-click="handleTableClick"
|
></DataTable>
|
<FactorCheckbox
|
direction="left"
|
vertical
|
borderless-direction="r"
|
v-model="selectFactorType"
|
:device-type="deviceType"
|
></FactorCheckbox>
|
</el-row>
|
</el-col>
|
</el-row>
|
</template>
|
<script>
|
import { TYPE0 } from '@/constant/device-type';
|
import { FactorDatas } from '@/model/FactorDatas';
|
|
export default {
|
props: {
|
loading: Boolean,
|
factorDatas: FactorDatas,
|
deviceType: {
|
type: String,
|
// type0: 车载或无人机; type1:无人船
|
default: TYPE0
|
},
|
// 当前选中高亮的数据点索引
|
locateIndex: Number
|
},
|
data() {
|
return {
|
selectFactorType: ['1', '2', '3'],
|
show: false
|
};
|
},
|
emits: ['tableClick'],
|
methods: {
|
handleTableClick(index) {
|
this.$emit('tableClick', index);
|
}
|
}
|
};
|
</script>
|
<style scoped>
|
.flex-col {
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
}
|
</style>
|