<template>
|
<!-- <el-button
|
type="primary"
|
icon="Memo"
|
class="el-button-custom p-events-auto"
|
@click="dialogVisible = !dialogVisible"
|
>
|
设备管理
|
</el-button> -->
|
<CardDialog v-bind="$attrs" title="走航设备管理">
|
<el-row class="device-table">
|
<el-col :span="20">
|
<el-table
|
:data="deviceData"
|
table-layout="fixed"
|
size="small"
|
:show-overflow-tooltip="true"
|
border
|
height="64vh"
|
row-class-name="t-row"
|
cell-class-name="t-cell"
|
header-row-class-name="t-header-row"
|
header-cell-class-name="t-header-cell"
|
>
|
<el-table-column
|
type="index"
|
label="序号"
|
align="center"
|
width="50"
|
/>
|
<el-table-column
|
prop="deviceType"
|
label="设备类型"
|
align="center"
|
width="70"
|
:formatter="deviceFormatter"
|
/>
|
<el-table-column prop="deviceName" label="设备名称" align="center" />
|
<el-table-column prop="deviceCode" label="设备编号" align="center" />
|
<el-table-column
|
prop="createTime"
|
label="创建时间"
|
align="center"
|
:formatter="timeFormatter"
|
/>
|
<el-table-column label="管理" width="70" align="center">
|
<template #default="{ row }">
|
<el-button
|
type="primary"
|
size="small"
|
class="el-button-custom"
|
@click="deleteDevice(row)"
|
>删除</el-button
|
>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-col>
|
<el-col :span="4" class="flex-col">
|
<div>
|
<DeviceCreate></DeviceCreate>
|
</div>
|
</el-col>
|
</el-row>
|
</CardDialog>
|
<MessageBox
|
v-model="msgBoxVisible"
|
:on-confirm="onConfirm"
|
title="删除走航设备"
|
msg="确认是否删除该走航设备"
|
confirmText="删除"
|
></MessageBox>
|
</template>
|
<script>
|
import moment from 'moment';
|
import { mapStores } from 'pinia';
|
import { useDeviceStore } from '@/stores/device';
|
import { useFetchData } from '@/composables/fetchData';
|
import { typeName } from '@/constant/device-type';
|
|
export default {
|
setup() {
|
const { loading, fetchData } = useFetchData();
|
return { loading, fetchData };
|
},
|
props: {
|
// modelValue: Boolean
|
},
|
// emits: ['update:modelValue'],
|
data() {
|
return {
|
dialogVisible: false,
|
msgBoxVisible: false,
|
onConfirm: undefined
|
};
|
},
|
computed: {
|
...mapStores(useDeviceStore),
|
deviceData() {
|
return this.deviceStore.getDevice();
|
}
|
},
|
methods: {
|
// handleChange(value) {
|
// this.$emit('update:modelValue', value);
|
// },
|
deleteDevice(row) {
|
this.onConfirm = () => {
|
this.deviceStore.deleteDevice(row.deviceCode);
|
};
|
this.msgBoxVisible = true;
|
},
|
// eslint-disable-next-line no-unused-vars
|
deviceFormatter(row, col, cellValue, index) {
|
return typeName(cellValue);
|
},
|
// eslint-disable-next-line no-unused-vars
|
timeFormatter(row, col, cellValue, index) {
|
return moment(cellValue).format('YYYY-MM-DD HH:mm:ss');
|
}
|
}
|
};
|
</script>
|
<style scoped>
|
.flex-col {
|
display: flex;
|
flex-direction: column;
|
gap: 4px;
|
align-items: flex-end;
|
}
|
</style>
|
