<script setup lang="ts">
import { ref } from 'vue';
import { Modal, message } from 'ant-design-vue';
import { AIRPLANE_MISSION_MODE } from '../enum';
import type { deviceAirPortLoad } from './columns';
import { defaultDeviceKindColumns, deviceAirportLoadColumns, deviceDefaultAbilityColumns } from './columns';
import orgSelectDropTree from './orgSelectDropTree.vue';
import LoadSelect from './loadSelect.vue';
// const emit = defineEmits(['confirm']);
defineOptions({
name: 'DeviceAirportAdd',
});
const loadBind = {
1: '机场 ',
2: '无人机',
};
const loading = {
1: '内置',
2: '外挂',
};
// 获取默认飞控能力信息
const defaultDeviceUavModelList = ref<API.DeviceModelAbilityBo[]>();
// const deviceUavForm = ref<API.DeviceUavDto>({ deviceName: '', deviceSn: '', orgId: '', deviceType: '', deviceSubType: '' });
function getDefaultAbility(factoryCode: string | undefined, modelId: any) {
const params = ref<API.DeviceUavModelListDto>({
factoryCode,
modelId,
});
postDeviceUavModelGetModelAbility({ ...params.value }).then((res) => {
if (res.success) {
defaultDeviceUavModelList.value = res.data ? res.data : [];
}
});
}
const airportLoadData = ref<deviceAirPortLoad[]>([]); // 机场设备种类
const deviceLoadData = ref<deviceAirPortLoad[]>([]); // 无人机默认设备种类
// 获取无人机默认设备种类信息
const defaultDeviceKindList = ref<API.DeviceUavModelKindBo[]>([]);
function getDefaultDeviceKindList(factoryCode: string | undefined, modelId: any) {
const params = ref<API.DeviceUavModelListDto>({
factoryCode,
modelId,
});
postDeviceUavModelGetModelKind({ ...params.value }).then((res) => {
if (res.success) {
defaultDeviceKindList.value = res.data?.map((item: any) => {
return {
...item,
abilityName: getDeviceAblity(item),
loadBingName: loadBind[item.loadBind],
loadingName: loading[item.loading],
};
});
}
});
}
const airPlaneUavMode = ref<string[]>([]); // 无人机-航线配置
const deviceAirportAddDetail = ref();
// 表单数据
const airportForm = ref<API.DeviceAirportDto>({
deviceName: '',
orgId: '',
airLine: '',
deviceType: '',
firmwareVersion: '',
deviceSn: '',
deviceSonType: '',
});
// 窗口
const modelValue = ref<boolean>(false);
const deviceUavFormList: any = ref([]);
const factorynametext = ref('');
function openModel(node: API.FlyDockEquipmentDTO, factory: any, factoryname: any) {
// console.log('node', node)
// console.log('factory', factory);
// console.log('factoryname', factoryname);
factorynametext.value = factoryname;
modelValue.value = true;
airportForm.value.deviceName = node.deviceName;
airportForm.value.deviceType = node.deviceType;
airportForm.value.firmwareVersion = node.firmwareVersion;
airportForm.value.deviceSonType = node.deviceSubType;
airportForm.value.deviceSn = node.deviceSn;
airportForm.value.dockerId = node.id;
airportForm.value.modelName = node.deviceName;
airportForm.value.department = node.workspaceName; // 机场
airportForm.value.factoryCode = node.manufacturer; // 厂家id
// console.log('node.uavList列表多个', node.uavList)
deviceUavFormList.value = [];
if (node.uavList) {
// deviceUavForm.value.airportId = node.id; //机场id
// deviceUavForm.value.deviceName = node.uavList[0]?.deviceName;//设备名称
// deviceUavForm.value.deviceSn = node.uavList[0]?.deviceSn;
// deviceUavForm.value.deviceType = node.uavList[0]?.deviceType;
// deviceUavForm.value.deviceSubType = node.uavList[0]?.deviceSubType;
// deviceUavForm.value.uavId = node.uavList[0]?.id;
// // deviceUavForm.value.factoryId = node.uavList[0]?.manufacturer; //厂家id
// deviceUavForm.value.factoryId = node.manufacturer; //厂家id
// deviceUavForm.value.relStatue = node.uavList[0]?.relStatue;
// // getTypeList(deviceUavForm.value.factoryId);
// 型号下拉
node.uavList.forEach((item) => {
deviceUavFormList.value.push({
airportId: node.id,
deviceName: item.deviceName,
deviceSn: item.deviceSn,
deviceType: item.deviceType,
deviceSubType: item.deviceSubType,
uavId: item.id,
factoryId: node.manufacturer,
relStatue: item.relStatue,
});
});
// console.log('deviceUavFormList', deviceUavFormList.value)
// getTypeList(deviceUavForm.value.factoryId);
getTypeList(node.manufacturer);
}
}
// 校验表单
const airportRef = ref(); // 机场信息
// const airplaneRef = ref();//无人机信息
const uavDialogRefs: Ref<any> = ref({});
// 确认新增
async function confirmCheck() {
try {
await airportRef.value.validateFields();
// await airplaneRef.value.validateFields();
for (let i = 0; i < deviceUavFormList.value.length; i++) {
await uavDialogRefs.value[deviceUavFormList.value[i].uavId];
}
// deviceUavForm.value.orgId = airportForm.value.orgId;
// deviceUavForm.value.deviceRelKindOtherList = deviceLoadData.value; // 无人机列表
// deviceUavForm.value.uavLine = airPlaneUavMode.value.toString();
// deviceUavForm.value.deviceRelKindList = defaultDeviceKindList.value;
deviceUavFormList.value.forEach((item: any) => {
item.orgId = airportForm.value.orgId;
item.deviceRelKindOtherList = deviceLoadData.value;
item.uavLine = airPlaneUavMode.value.toString();
item.deviceRelKindList = defaultDeviceKindList.value;
});
// console.log('deviceUavFormList.value2222', deviceUavFormList.value)
// airportForm.value.deviceUav = deviceUavForm.value;
airportForm.value.deviceUav = deviceUavFormList.value;
airportForm.value.deviceRelKindList = airportLoadData.value; // 无人机列表
// console.log('保存传参', airportForm.value)
postDeviceAirportSave(airportForm.value).then((res) => {
if (res.success) {
message.success('新增成功');
modelValue.value = false;
}
});
}
catch (errorInfo) {
}
}
// 根据无人机厂商获取型号列表
const typeModelList = ref<API.DeviceUavModel[] | undefined>([]);
async function getTypeList(factoryCode: string | undefined) {
const params = { factoryCode };
const res = await postDeviceUavModelGetAll(params);
if (res.success) {
typeModelList.value = res.data;
}
}
// 选取组织
function onSelectOrg(value: string | number) {
airportForm.value.orgId = value;
}
// 打开新增负载窗口
const loadSelectRef = ref();
const loadDataType = ref<number>(1); // 负载挂在哪个设备上 1机场，2无人机
function openLoadDrawer(type: number) {
loadDataType.value = type;
loadSelectRef.value.open();
}
// 设置新增设备种类数据
function setLoadData(data: deviceAirPortLoad[]) {
data.forEach((item) => {
item.open = '1';
item.kindId = item.id; // 将装置id 转换为kindId
});
if (loadDataType.value === 1) { // 新增机场设备种类
airportLoadData.value = [...airportLoadData.value, ...data];
}
else { // 新增无人机其他设备种类
deviceLoadData.value = [...deviceLoadData.value, ...data];
}
}
// 复制设备种类
function copyLoad(record: any, index: number, type: number) {
if (type === 1) {
airportLoadData.value.splice(index, 0, JSON.parse(JSON.stringify(record)));
}
else {
deviceLoadData.value.splice(index, 0, JSON.parse(JSON.stringify(record)));
}
}
// 删除设备种类
function deleteLoad(index: number, type: number) {
if (type === 1) {
airportLoadData.value.splice(index, 1);
}
else {
deviceLoadData.value.splice(index, 1);
}
}
// 无人机型号更改时获取默认信息
function getModelAbilityAndKind(v: any) {
getDefaultAbility(airportForm.value.factoryCode, v); // 获取无人机默认飞控能力
getDefaultDeviceKindList(airportForm.value.factoryCode, v); // 获取无人机默认种类
}
defineExpose({
openModel,
});
// 获取飞机能力信息
function getDeviceAblity(record: any) {
const str = record.deviceKindAbilityBoList.map((item: any, index: number) => {
return (index + 1) + item.abilityName;
});
return str.join(',');
}
const activeKey = ref(['0']);
// const tableData = ref<API.[]>()
</script>
<template>
<Modal
ref="deviceAirportAddDetail" v-model:open="modelValue" width="1000px" :destroy-on-close="true"
:body-style="{ height: '500px', overflow: 'auto' }" title="新增设备(2/2)" @ok="confirmCheck"
>
<div>
<p class="font-bold mb-2">
机场信息
</p>
<a-form
ref="airportRef" :model="airportForm" name="basic" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }"
autocomplete="off"
>
<a-row>
<a-col :span="8">
<a-form-item label="厂家">
<a-input v-model:value="factorynametext" :disabled="true" />
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span="8">
<a-form-item label="设备信息" name="deviceName" :rules="[{ required: true, message: '请输入设备信息!' }]">
<a-input v-model:value="airportForm.deviceName" />
</a-form-item>
</a-col>
<a-col :span="8">
<a-form-item label="所属组织" name="orgId" :rules="[{ required: true, message: '请选中组织!' }]">
<orgSelectDropTree :bordered="true" auth="organization" @change="onSelectOrg" />
</a-form-item>
</a-col>
<a-col :span="8">
<a-form-item label="作业半径" name="airLine" :rules="[{ required: true, message: '请输入作业半径!' }]">
<a-input v-model:value="airportForm.airLine" />
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span="8">
<a-form-item label="机身序列号">
<a-input v-model:value="airportForm.deviceSn" :disabled="true" />
</a-form-item>
</a-col>
<a-col :span="8">
<a-form-item label="固件版本">
<a-input v-model:value="airportForm.firmwareVersion" :disabled="true" />
</a-form-item>
</a-col>
<a-col :span="8">
<a-form-item label="型号" name="modelName">
<a-input v-model:value="airportForm.modelName" :disabled="true" />
</a-form-item>
</a-col>
</a-row>
<div class="flex justify-between">
<p class="font-bold mb-2">
机场设备种类
</p>
<a-space>
<a-button class="mb-1" type="primary" @click="openLoadDrawer(1)">
添加机场设备种类
</a-button>
</a-space>
</div>
<a-table :columns="deviceAirportLoadColumns" :data-source="airportLoadData" :pagination="false">
<template #bodyCell="{ column, record, index }">
<template v-if="column.dataIndex === 'action'">
<a-space>
<a-button type="primary" @click="copyLoad(record, index, 1)">
<template #icon>
<CopyOutlined />
</template>
</a-button>
<a-button type="primary" danger @click="deleteLoad(index, 1)">
<template #icon>
<DeleteOutlined />
</template>
</a-button>
</a-space>
</template>
<template v-if="column.dataIndex === 'loadIndex'">
<a-input v-model:value="record.loadIndex" />
</template>
<template v-if="column.dataIndex === 'showName'">
<a-input v-model:value="record.showName" />
</template>
<template v-if="column.dataIndex === 'open'">
<a-switch v-model:checked="record.open" checked-value="0" un-checked-value="1" />
</template>
</template>
</a-table>
</a-form>
<!-- 多个设备多个无人机信息 -->
<a-collapse v-model:activeKey="activeKey">
<a-collapse-panel v-for="(item, index) in deviceUavFormList" :key="index" header="无人机配置">
<div>
<p class="font-bold mb-2">
无人机信息
</p>
</div>
<a-form
:ref="(el: any) => {
uavDialogRefs[item.uavId] = el
}" :model="item" name="basic" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }" autocomplete="off"
>
<a-row>
<a-col :span="8">
<a-form-item label="设备名称" name="deviceName" :rules="[{ required: true, message: '请输入设备信息!' }]">
<a-input v-model:value="item.deviceName" />
</a-form-item>
</a-col>
<a-col :span="8">
<a-form-item label="厂家" name="factory">
<a-input v-model:value="item.factoryId" :disabled="true" />
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span="8">
<a-form-item label="型号" name="deviceType">
<a-select
v-model:value="item.modelId" :field-names="{ label: 'modelName', value: 'id' }"
:options="typeModelList" @change="getModelAbilityAndKind"
/>
</a-form-item>
</a-col>
<a-col :span="8">
<a-form-item label="机身序列号">
<a-input v-model:value="item.deviceSn" :disabled="true" />
</a-form-item>
</a-col>
</a-row>
</a-form>
<div>
<p class="font-bold mb-2">
无人机-默认设备种类
</p>
</div>
<a-table :columns="defaultDeviceKindColumns" :data-source="defaultDeviceKindList" :pagination="false">
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'action'" />
<template v-if="column.dataIndex === 'loadIndex'">
<a-input v-model:value="record.loadIndex" />
</template>
<template v-if="column.dataIndex === 'showName'">
<a-input v-model:value="record.showName" />
</template>
<template v-if="column.dataIndex === 'open'">
<a-switch v-model:checked="record.open" checked-value="0" un-checked-value="1" />
</template>
</template>
</a-table>
<div>
<div class="flex justify-between mr-1">
<p class="font-bold mb-2">
无人机-其他设备种类
</p>
<a-space>
<a-button class="mb-1" type="primary" @click="openLoadDrawer(2)">
添加无人机其他设备种类
</a-button>
</a-space>
</div>
<a-table :columns="deviceAirportLoadColumns" :data-source="deviceLoadData" :pagination="false">
<template #bodyCell="{ column, record, index }">
<template v-if="column.dataIndex === 'action'">
<a-space>
<a-button type="primary" @click="copyLoad(record, index, 1)">
<template #icon>
<CopyOutlined />
</template>
</a-button>
<a-button type="primary" danger @click="deleteLoad(index, 2)">
<template #icon>
<DeleteOutlined />
</template>
</a-button>
</a-space>
</template>
<template v-if="column.dataIndex === 'loadIndex'">
<a-input v-model:value="record.loadIndex" />
</template>
<template v-if="column.dataIndex === 'showName'">
<a-input v-model:value="record.showName" />
</template>
<template v-if="column.dataIndex === 'open'">
<a-switch v-model:checked="record.open" checked-value="0" un-checked-value="1" />
</template>
</template>
</a-table>
</div>
<div>
<div class="flex justify-between">
<p class="font-bold mb-2">
无人机-默认飞控能力
</p>
</div>
<a-table
:columns="deviceDefaultAbilityColumns" :data-source="defaultDeviceUavModelList"
:pagination="false"
>
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'action'" />
<template v-if="column.dataIndex === 'loadIndex'">
<a-input v-model:value="record.loadIndex" />
</template>
<template v-if="column.dataIndex === 'showName'">
<a-input v-model:value="record.showName" />
</template>
<template v-if="column.dataIndex === 'open'">
<a-switch v-model:checked="record.open" checked-value="0" un-checked-value="1" />
</template>
</template>
</a-table>
</div>
<div>
<p class="font-bold mb-2">
无人机-航线模式配置
</p>
<a-checkbox-group v-model:value="airPlaneUavMode" name="checkboxgroup" :options="AIRPLANE_MISSION_MODE" />
</div>
</a-collapse-panel>
</a-collapse>
</div>
<LoadSelect ref="loadSelectRef" @select-load-data="setLoadData" />
</Modal>
</template>
