133 lines
3.5 KiB
JavaScript
133 lines
3.5 KiB
JavaScript
// import { h } from 'vue'
|
||
import { NButton, NInputNumber, NSwitch } from 'naive-ui'
|
||
import { useModal } from '@/views/Content/hooks/modal'
|
||
import Detection from '@/views/Payload/Detection.jsx'
|
||
import Communication from '@/views/Payload/Communication.jsx'
|
||
import { updateMbPayload } from '@/api/Mubiao'
|
||
import { useEntity } from '@/hooks/entity'
|
||
import { useMubiao } from './mubiao'
|
||
|
||
const { openDetailsModal } = useModal()
|
||
export const useMubiaoDetail = () => {
|
||
const payloadData = ref([])
|
||
|
||
function addCommunicationPayload(mbData) {
|
||
const { id, targetType, extendInfo } = mbData
|
||
|
||
const payLoadType = window.settings.mbDict[targetType].payload
|
||
if (payLoadType === 'radar') {
|
||
payloadData.value = [
|
||
{
|
||
id,
|
||
radius: null,
|
||
minimumClock: null,
|
||
maximumClock: 90,
|
||
minimumCone: null,
|
||
maximumCone: null,
|
||
show: false,
|
||
},
|
||
]
|
||
} else if (payLoadType === 'conic') {
|
||
payloadData.value = [
|
||
{
|
||
id,
|
||
angle: null,
|
||
show: false,
|
||
},
|
||
]
|
||
}
|
||
}
|
||
const { mbPayloadShowMap } = useEntity()
|
||
|
||
function renderMubiaoDetailsContent(mbData) {
|
||
payloadData.value = []
|
||
const { id, targetType, extendInfo } = mbData
|
||
const payLoadType = window.settings.mbDict[targetType].payload
|
||
|
||
if (extendInfo) {
|
||
payloadData.value = [
|
||
{
|
||
id,
|
||
...extendInfo.detectingPayload,
|
||
show: mbPayloadShowMap.get(id).detectingPayload.show,
|
||
},
|
||
]
|
||
}
|
||
// return h(
|
||
// 'div',
|
||
// {},
|
||
// Object.keys(mbData).map(key => h('div', {}, `${key}：${mbData[key]}`))
|
||
// )
|
||
return () => (
|
||
<div class="detail-container w-[45vw]">
|
||
<div class="detail-item-title">基本信息</div>
|
||
<div>
|
||
{Object.keys(mbData).map(key => (
|
||
<div>
|
||
{key}：{mbData[key]}
|
||
</div>
|
||
))}
|
||
</div>
|
||
{/* <div class="detail-item-title">探测载荷</div>
|
||
*/}
|
||
<div class="flex justify-between">
|
||
<div class="detail-item-title">探测载荷</div>
|
||
{payloadData.value.length === 0 && (
|
||
<NButton
|
||
quaternary
|
||
type="primary"
|
||
onClick={() => addCommunicationPayload(mbData)}
|
||
>
|
||
添加
|
||
</NButton>
|
||
)}
|
||
</div>
|
||
{payloadData.value.length > 0 && (
|
||
<Detection target="mb" type={payLoadType} data={payloadData.value} />
|
||
)}
|
||
|
||
<div class="flex justify-end gap-2">
|
||
<NButton
|
||
type="primary"
|
||
onClick={() =>
|
||
updateMbLoad({
|
||
mbData,
|
||
detection: payloadData.value,
|
||
})
|
||
}
|
||
>
|
||
确定
|
||
</NButton>
|
||
{/* <NButton onClick={closeDetailsModal}>取消</NButton> */}
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|
||
function showDetailsMubiao(mbData) {
|
||
openDetailsModal({
|
||
titleString: 'zb详情',
|
||
contentSlot: renderMubiaoDetailsContent(mbData),
|
||
})
|
||
}
|
||
|
||
function updateMbLoad({ mbData, detection }) {
|
||
const { getMubiaoData } = useMubiao()
|
||
const { id, show, ...detectionData } = detection[0]
|
||
const payloadData = {
|
||
id: mbData.id,
|
||
extendInfo: {
|
||
detectingPayload: { ...detectionData },
|
||
},
|
||
}
|
||
// console.log(payloadData)
|
||
updateMbPayload(payloadData).then(res => {
|
||
if (res.code === '200') {
|
||
window.$message.success('保存成功')
|
||
getMubiaoData()
|
||
}
|
||
})
|
||
}
|
||
|
||
return { showDetailsMubiao }
|
||
}
|