88 lines
2.7 KiB
React
88 lines
2.7 KiB
React
![]() |
import { NTabs, NTabPane, NButton, NScrollbar } from 'naive-ui'
|
||
|
import TrajTable from './components/TrajTable'
|
||
|
import TrajUpload from './components/TrajUpload'
|
||
|
import Panel from '@/components/Panel/index.vue'
|
||
|
import { useDaodan } from './daodan'
|
||
|
|
||
|
const panels = ['手动配置', 'STK轨迹文件配置']
|
||
|
export default defineComponent({
|
||
|
setup() {
|
||
|
const { daodanData, showOrHideDdConfig } = useDaodan()
|
||
|
const name = ref('手动配置')
|
||
|
|
||
|
const data = ref([
|
||
|
{
|
||
|
name: '起始点',
|
||
|
lon: 120,
|
||
|
lat: 21,
|
||
|
alt: 0,
|
||
|
time: 1183135260000,
|
||
|
},
|
||
|
{
|
||
|
name: '中间特征点',
|
||
|
lon: 120,
|
||
|
lat: 21,
|
||
|
alt: 0,
|
||
|
time: 1183135260000,
|
||
|
detached: false,
|
||
|
},
|
||
|
{
|
||
|
name: '落点',
|
||
|
lon: 120,
|
||
|
lat: 21,
|
||
|
alt: 0,
|
||
|
time: 1183135260000,
|
||
|
},
|
||
|
])
|
||
|
const handleClose = () => {}
|
||
|
return () => (
|
||
|
<div>
|
||
|
<Panel title={`${daodanData.value.targetName}配置`}>
|
||
|
<div class="flex h-full w-full flex-col gap-2 p-2">
|
||
|
<NTabs
|
||
|
class="flex h-[calc(100%-42px)] flex-col"
|
||
|
v-model:value={name.value}
|
||
|
type="card"
|
||
|
tab-style="min-width: 80px;"
|
||
|
onClose={handleClose}
|
||
|
>
|
||
|
{panels.map(panel => (
|
||
|
<NTabPane
|
||
|
class="flex-1 overflow-y-auto rounded-b-[var(--n-tab-border-radius)] border border-[var(--n-tab-border-color)] border-t-transparent"
|
||
|
key={panel}
|
||
|
tab={panel}
|
||
|
name={panel}
|
||
|
>
|
||
|
<NScrollbar>
|
||
|
<div class="px-4 pb-4">
|
||
|
<div class="detail-container">
|
||
|
{panel === '手动配置' ? (
|
||
|
<>
|
||
|
<TrajTable title="轨迹点" data={data.value} />
|
||
|
<TrajTable title="拦截弹" data={data.value} />
|
||
|
</>
|
||
|
) : (
|
||
|
<>
|
||
|
<TrajUpload title="轨迹点" />
|
||
|
<TrajUpload title="拦截弹" />
|
||
|
</>
|
||
|
)}
|
||
|
</div>
|
||
|
</div>
|
||
|
</NScrollbar>
|
||
|
</NTabPane>
|
||
|
))}
|
||
|
</NTabs>
|
||
|
<div class="flex justify-end gap-2">
|
||
|
<NButton type="primary" onClick={() => showOrHideDdConfig({})}>
|
||
|
确认
|
||
|
</NButton>
|
||
|
<NButton onClick={() => showOrHideDdConfig({})}>取消</NButton>
|
||
|
</div>
|
||
|
</div>
|
||
|
</Panel>
|
||
|
</div>
|
||
|
)
|
||
|
},
|
||
|
})
|