<template>
|
<el-button
|
type="primary"
|
icon="Memo"
|
class="el-button-custom p-events-auto"
|
@click="dialogVisible = !dialogVisible"
|
>
|
设备管理
|
</el-button>
|
<CardDialog v-model="dialogVisible" title="走航设备管理">
|
<el-row class="mission-table">
|
<el-col :span="20">
|
<el-table
|
:data="deviceStore.deviceList"
|
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" />
|
<el-table-column prop="deviceCode" label="设备编号" align="center" />
|
<el-table-column
|
prop="createTime"
|
label="创建时间"
|
align="center"
|
:formatter="timeFormatter"
|
/>
|
<el-table-column label="管理" width="140" 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>
|
<!-- todo 设备创建 -->
|
</div>
|
</el-col>
|
</el-row>
|
</CardDialog>
|
<MessageBox
|
v-model="msgBoxVisible"
|
:on-confirm="onConfirm"
|
title="删除走航任务"
|
msg="确认是否删除该走航任务"
|
confirmText="删除"
|
></MessageBox>
|
</template>
|
<script>
|
import moment from 'moment';
|
import deviceApi from '@/api/deviceApi';
|
import { mapStores } from 'pinia';
|
import { useDeviceStore } from '@/stores/device';
|
import { useFetchData } from '@/composables/fetchData';
|
|
export default {
|
setup() {
|
const { loading, fetchData } = useFetchData();
|
return { loading, fetchData };
|
},
|
props: {},
|
data() {
|
return {
|
dialogVisible: false,
|
msgBoxVisible: false,
|
onConfirm: undefined
|
};
|
},
|
computed: {
|
...mapStores(useDeviceStore)
|
},
|
methods: {
|
deleteDevice(row) {
|
this.onConfirm = () => {
|
this.deviceStore.deleteDevice(row.deviceCode);
|
};
|
this.msgBoxVisible = true;
|
},
|
timeFormatter(row, col, cellValue, index) {
|
return moment(cellValue).format('YYYY-MM-DD HH:mm:ss');
|
}
|
}
|
};
|
</script>
|
