|
|
<template>
|
|
|
<div class="app-container">
|
|
|
<div class="top">
|
|
|
<div class="title">探测系统</div>
|
|
|
<div class="items">
|
|
|
<div @click="setItemsId(1)" :class="{click:itemsId === 1}" class="item">
|
|
|
<span>
|
|
|
主界面
|
|
|
</span>
|
|
|
</div>
|
|
|
<div @click="setItemsId(2)" :class="{click:itemsId === 2}" class="item"><span>
|
|
|
区域标定
|
|
|
</span></div>
|
|
|
<div @click="setItemsId(3)" :class="{click:itemsId === 3}" class="item"><span>
|
|
|
软件设置
|
|
|
</span></div>
|
|
|
<div @click="setItemsId(4)" :class="{click:itemsId === 4}" class="item"><span>
|
|
|
历史记录
|
|
|
</span></div>
|
|
|
<!-- <div class="item">视频接口</div>-->
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="left">
|
|
|
<Ruler ref="rulerRef" :index="dotIndex" :box-pos="locationData"/>
|
|
|
</div>
|
|
|
<div class="right">
|
|
|
<div v-if="itemsId === 1" class="tabsItem">
|
|
|
<el-card shadow="always">
|
|
|
<el-form :inline="true" :model="form1" class="demo-form-inline">
|
|
|
<el-form-item>
|
|
|
<el-select
|
|
|
v-model="form1.region"
|
|
|
placeholder="请选择机场名称"
|
|
|
style="width: 200px"
|
|
|
clearable
|
|
|
>
|
|
|
<el-option label="机场1" value="shanghai"/>
|
|
|
<el-option label="机场2" value="beijing"/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-select
|
|
|
v-model="form1.region1"
|
|
|
placeholder="请选择区域名称"
|
|
|
style="width: 200px"
|
|
|
clearable
|
|
|
>
|
|
|
<el-option label="区域1" value="shanghai"/>
|
|
|
<el-option label="区域2" value="beijing"/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" @click="onSubmit">固定目标</el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</el-card>
|
|
|
<el-card shadow="always" style="margin-top: 12px;">
|
|
|
<el-button :disabled="radarWorkState === 1" type="primary"
|
|
|
@click="StartWorkBtn">启动雷达
|
|
|
</el-button>
|
|
|
<el-button :disabled="radarWorkState === 0" type="danger" @click="StopWorkBtn">关闭雷达</el-button>
|
|
|
<el-button type="warning" @click="RestartWorkBtn">重启雷达</el-button>
|
|
|
<el-button type="info" @click="ShutDownWorkBtn">急停雷达</el-button>
|
|
|
</el-card>
|
|
|
<el-card shadow="always" style="margin-top: 12px;">
|
|
|
<div v-if="radarWorkState === 1"
|
|
|
style="width:calc( 50% - 50px);position: relative;border-radius: 5px;background-color: #01CE69;height: 44px;display: inline-block;padding:0 20px;margin-right: 20px;">
|
|
|
<span
|
|
|
style="position:absolute;top: 50%;transform: translateY(-50%);left:20%;color: #fff;letter-spacing: 2px">雷达通讯状态</span>
|
|
|
<el-icon size="20px" style="position:absolute;top: 50%;transform: translateY(-50%);right: 40px">
|
|
|
<SuccessFilled color="#fff"/>
|
|
|
</el-icon>
|
|
|
</div>
|
|
|
<div
|
|
|
v-if="radarWorkState === 0"
|
|
|
style="width:calc( 50% - 50px);position: relative;border-radius: 5px;background-color: #E8370D;height: 44px;display: inline-block;padding:0 20px;">
|
|
|
<span
|
|
|
style="position:absolute;top: 50%;transform: translateY(-50%);left:20%;color: #fff;letter-spacing: 2px">雷达通讯状态</span>
|
|
|
|
|
|
<el-icon size="20px" style="position:absolute;top: 50%;transform: translateY(-50%);right: 40px">
|
|
|
<WarningFilled color="#fff"/>
|
|
|
</el-icon>
|
|
|
</div>
|
|
|
</el-card>
|
|
|
<el-card shadow="always" style="margin-top: 12px;">
|
|
|
<el-form :inline="true" :model="form2" class="demo-form-inline">
|
|
|
<el-form-item>
|
|
|
<el-date-picker
|
|
|
v-model="form2.date"
|
|
|
type="date"
|
|
|
placeholder="选择时间"
|
|
|
clearable
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-button @click="onSubmit">停止检测</el-button>
|
|
|
<el-button type="primary" @click="onSubmit">批量操作</el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
|
|
|
<el-table highlight-current-row @current-change="table1Current" :data="tableData1"
|
|
|
style="width: 100%">
|
|
|
<el-table-column type="selection" width="55"/>
|
|
|
<el-table-column label="序号" type="index" width="60"/>
|
|
|
<el-table-column property="Lon" label="目标经度" width="120"/>
|
|
|
<el-table-column property="Lat" label="目标纬度" width="120"/>
|
|
|
<el-table-column label="告警等级" width="160">
|
|
|
<template #default="scope">
|
|
|
<el-rate :model-value="scope.row.rate ||3" disabled/>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="处理状态"
|
|
|
show-overflow-tooltip>
|
|
|
<template #default="scope">
|
|
|
<el-button type="primary" link>已处理</el-button>
|
|
|
<el-button type="primary" link @click="addShildItem">不处理</el-button>
|
|
|
<el-button type="primary" link>未发现</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</el-card>
|
|
|
<el-card shadow="always" style="margin-top: 12px;">
|
|
|
<el-table :data="tableData2" style="width: 100%">
|
|
|
<el-table-column label="序号" type="index" width="60"/>
|
|
|
<el-table-column property="name" label="目标名称" width="120"/>
|
|
|
<el-table-column property="lon" label="目标经度" width="120"/>
|
|
|
<el-table-column property="lat" label="目标纬度" width="120"/>
|
|
|
<el-table-column property="deviation" label="deviation" width="120"/>
|
|
|
<el-table-column property="shielding" label="shielding" width="120"/>
|
|
|
<!-- <el-table-column label="告警等级" width="160">-->
|
|
|
<!-- <template #default="scope">-->
|
|
|
<!-- <el-rate v-model="scope.row.rate" disabled/>-->
|
|
|
<!-- </template>-->
|
|
|
<!-- </el-table-column>-->
|
|
|
<!-- <el-table-column-->
|
|
|
<!-- label="处理状态"-->
|
|
|
<!-- show-overflow-tooltip>-->
|
|
|
<!-- <template #default="scope">-->
|
|
|
<!-- <span v-if="scope.row.type === 1">已处理</span>-->
|
|
|
<!-- <span v-if="scope.row.type === 2">不处理</span>-->
|
|
|
<!-- <span v-if="scope.row.type === 3">未发现</span>-->
|
|
|
<!-- </template>-->
|
|
|
<!-- </el-table-column>-->
|
|
|
<!-- <el-table-column label="其他操作" width="160">-->
|
|
|
<!-- <template #default="scope">-->
|
|
|
<!-- <el-input v-model="scope.row.notes" placeholder="详细信息填写"/>-->
|
|
|
<!-- </template>-->
|
|
|
<!-- </el-table-column>-->
|
|
|
<el-table-column
|
|
|
label="操作"
|
|
|
show-overflow-tooltip>
|
|
|
<template #default="scope">
|
|
|
<el-button type="primary" link @click="delShildItem(scope.row)">删除</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</el-card>
|
|
|
</div>
|
|
|
<div v-if="itemsId === 2" class="tabsItem">
|
|
|
<el-card shadow="always">
|
|
|
<el-form :inline="true" :model="form5" class="demo-form-inline">
|
|
|
<el-form-item>
|
|
|
<el-input v-model="form5.region" style="width: 200px" placeholder="请输入机场名称"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-input v-model="form5.region1" style="width: 200px" placeholder="请输入区域名称"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" @click="onSubmit">添加</el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
<el-form :inline="true" :model="form6" class="demo-form-inline">
|
|
|
<el-form-item>
|
|
|
<el-select
|
|
|
v-model="form6.region"
|
|
|
placeholder="请选择机场名称"
|
|
|
style="width: 200px"
|
|
|
clearable
|
|
|
>
|
|
|
<el-option label="机场1" value="shanghai"/>
|
|
|
<el-option label="机场2" value="beijing"/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-select
|
|
|
v-model="form6.region1"
|
|
|
placeholder="请选择区域名称"
|
|
|
style="width: 200px"
|
|
|
clearable
|
|
|
>
|
|
|
<el-option label="区域1" value="shanghai"/>
|
|
|
<el-option label="区域2" value="beijing"/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" @click="onSubmit">确定</el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</el-card>
|
|
|
<el-card shadow="always" style="margin-top: 12px;">
|
|
|
<div v-for="(i,k) in points" style="margin-bottom: 12px;">
|
|
|
<el-input disabled v-model="i.name" style="width: 100px"/>
|
|
|
<el-input v-model="i.lon" style="width: 150px;margin-left: 20px;"/>
|
|
|
<el-input v-model="i.lat" style="width: 150px;margin-left: 20px;"/>
|
|
|
<el-button type="primary" @click="getPoint(k)" style=" margin-left: 20px;">获取</el-button>
|
|
|
</div>
|
|
|
</el-card>
|
|
|
<div style="text-align: center;margin-top: 12px;">
|
|
|
<el-button type="primary" @click="savePoint" style=" margin-left: 20px;">提交</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div v-if="itemsId === 3" class="tabsItem">
|
|
|
<div>成像设置</div>
|
|
|
<el-form :model="parasSignalproForm" label-width="auto" label-position="top" :inline="true">
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="成像近端距离(米)">
|
|
|
<el-input v-model="(parasSignalproForm.imaging || {}).imaging_rangemin"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="成像远端距离(米)">
|
|
|
<el-input v-model="(parasSignalproForm.imaging || {}).imaging_rangemax"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="成像距离分辨率(米)">
|
|
|
<el-input v-model="(parasSignalproForm.imaging || {}).imaging_rangeres"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="成像方位长度(米)">
|
|
|
<el-input v-model="(parasSignalproForm.imaging || {}).imaging_azimuthlength"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="成像方位分辨率(米)">
|
|
|
<el-input v-model="(parasSignalproForm.imaging || {}).imaging_azimuthres"/>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
<div>检测设置</div>
|
|
|
<el-form :model="parasSignalproForm" label-width="auto" label-position="top" :inline="true">
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="检测系数">
|
|
|
<el-input v-model="(parasSignalproForm.dectection ||{}).alpha"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="检测的最近端">
|
|
|
<el-input v-model="(parasSignalproForm.dectection ||{}).decstartr"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="检测的最远端">
|
|
|
<el-input v-model="(parasSignalproForm.dectection ||{}).decwidth"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="小目标距离最小像素">
|
|
|
<el-input v-model="(parasSignalproForm.dectection ||{}).sk_r"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="小目标方位最小像素">
|
|
|
<el-input v-model="(parasSignalproForm.dectection ||{}).sk_a"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="大目标距离最小像素">
|
|
|
<el-input v-model="(parasSignalproForm.dectection ||{}).lk_r"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="大目标方位最小像素">
|
|
|
<el-input v-model="(parasSignalproForm.dectection ||{}).lk_a"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width:100%; ">
|
|
|
<div style="text-align:center; width:100%">
|
|
|
<el-button type="primary" @click="saveParasSignalproForm">保存</el-button>
|
|
|
</div>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
<div>路线设置</div>
|
|
|
<el-form :model="parasPosForm" label-width="auto" label-position="top" :inline="true">
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="路线数量">
|
|
|
<el-input-number v-model="(parasPosForm.runwaynum ||{}).startpos_num" :precision="0" :step="1"
|
|
|
:min="0" @change="updateRunwayNum"></el-input-number>
|
|
|
</el-form-item>
|
|
|
<div style="width: 100%"></div>
|
|
|
<template v-for="(i,k) in (parasPosForm.runwaynum || {}).startpos_num || 0">
|
|
|
<div style="width: 100%">路线{{ k + 1 }}设置</div>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="startpos_lon_a">
|
|
|
<el-input v-model="((parasPosForm.runwayedges||[])[k]||{}).startpos_lon_a"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="startpos_lat_a">
|
|
|
<el-input v-model="((parasPosForm.runwayedges||[])[k]||{}).startpos_lat_a"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="startpos_alt_a">
|
|
|
<el-input v-model="((parasPosForm.runwayedges||[])[k]||{}).startpos_alt_a"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="startpos_lon_b">
|
|
|
<el-input v-model="((parasPosForm.runwayedges||[])[k]||{}).startpos_lon_b"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="startpos_lat_b">
|
|
|
<el-input v-model="((parasPosForm.runwayedges||[])[k]||{}).startpos_lat_b"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="startpos_alt_b">
|
|
|
<el-input v-model="((parasPosForm.runwayedges||[])[k]||{}).startpos_alt_b"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width: calc(33% - 32px)" label="startpos_ori">
|
|
|
<el-input v-model="((parasPosForm.runwayedges||[])[k]||{}).startpos_ori"/>
|
|
|
</el-form-item>
|
|
|
</template>
|
|
|
<el-form-item style="width:100%; ">
|
|
|
<div style="text-align:center; width:100%">
|
|
|
<el-button type="primary" @click="saveParasPosForm">保存</el-button>
|
|
|
</div>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
<div v-if="itemsId === 4" class="tabsItem">
|
|
|
<el-card shadow="always">
|
|
|
<el-date-picker
|
|
|
style="width: calc(100% - 20px)"
|
|
|
v-model="date1"
|
|
|
type="datetimerange"
|
|
|
range-separator="到"
|
|
|
start-placeholder="选择开始时间"
|
|
|
end-placeholder="选择结束时间"
|
|
|
/>
|
|
|
</el-card>
|
|
|
<el-card shadow="always" style="margin-top: 12px;">
|
|
|
<el-form :inline="true" :model="form3" class="demo-form-inline">
|
|
|
<el-form-item>
|
|
|
<el-select
|
|
|
v-model="form3.region"
|
|
|
placeholder="请选择机场名称"
|
|
|
style="width: 170px"
|
|
|
clearable
|
|
|
>
|
|
|
<el-option label="机场1" value="shanghai"/>
|
|
|
<el-option label="机场2" value="beijing"/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-select
|
|
|
v-model="form3.region1"
|
|
|
placeholder="请选择区域名称"
|
|
|
style="width: 170px"
|
|
|
clearable
|
|
|
>
|
|
|
<el-option label="区域1" value="shanghai"/>
|
|
|
<el-option label="区域2" value="beijing"/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-select
|
|
|
v-model="form3.region2"
|
|
|
placeholder="请选择固定目标"
|
|
|
style="width: 170px"
|
|
|
clearable
|
|
|
>
|
|
|
<el-option label="目标1" value="shanghai"/>
|
|
|
<el-option label="目标2" value="beijing"/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</el-card>
|
|
|
<el-card shadow="always" style="margin-top: 12px;">
|
|
|
<el-form :inline="true" :model="form4" class="demo-form-inline">
|
|
|
<el-form-item>
|
|
|
<el-input v-model="form4.input1" style="width: 170px" placeholder="请输入检测序号"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-date-picker
|
|
|
v-model="form4.date1"
|
|
|
type="date"
|
|
|
style="width: 170px"
|
|
|
placeholder="选择检测时间"
|
|
|
clearable
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-input v-model="form4.input2" style="width: 170px" placeholder="请输入检测人员"/>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</el-card>
|
|
|
<el-card shadow="always" style="margin-top: 12px;">
|
|
|
<el-table :data="tableData2" style="width: 100%">
|
|
|
<el-table-column label="序号" type="index" width="60"/>
|
|
|
<el-table-column property="coordinate" label="目标坐标" width="120"/>
|
|
|
<el-table-column label="告警等级" width="160">
|
|
|
<template #default="scope">
|
|
|
<el-rate v-model="scope.row.rate" disabled/>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="处理状态"
|
|
|
show-overflow-tooltip>
|
|
|
<template #default="scope">
|
|
|
<span v-if="scope.row.type === 1">已处理</span>
|
|
|
<span v-if="scope.row.type === 2">不处理</span>
|
|
|
<span v-if="scope.row.type === 3">未发现</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</el-card>
|
|
|
</div>
|
|
|
<div v-if="itemsId === 5" class="tabsItem">
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script setup>
|
|
|
import Ruler from "@/components/ruler.vue";
|
|
|
import {nextTick, onMounted, ref} from "vue";
|
|
|
import {
|
|
|
getParasPos,
|
|
|
getParasSignalpro,
|
|
|
setParasPos,
|
|
|
setParasSignalpro,
|
|
|
getShildList,
|
|
|
addShildData,
|
|
|
delShildData, StartWork, StopWork, RestartWork, ShutDownWork
|
|
|
} from "@/api/api";
|
|
|
|
|
|
const socketData = [
|
|
|
{
|
|
|
"TimeQuality": 19124,
|
|
|
"GpsWeek": 2378,
|
|
|
"GpsSeconds": 443388.33,
|
|
|
"Latitude": 28.24388795549,
|
|
|
"Longitude": 113.00382002762,
|
|
|
"EllipsoidHeight": 14.6323,
|
|
|
"VelocityNorth": -0.1931,
|
|
|
"VelocityEast": 3.2447,
|
|
|
"ActualSpeed": 11.701587,
|
|
|
"RollAngle": 1.047412,
|
|
|
"HeadingAngle": 92.054855,
|
|
|
"IncludedAngle": 0.0,
|
|
|
"SolutionStatus": "",
|
|
|
"Fps": 3.485E-42,
|
|
|
"FpsNum": 0.0,
|
|
|
"MotorPitchAngle": 0.0,
|
|
|
"MotorAzimuthAngle": 0.0,
|
|
|
"ty": 3
|
|
|
},
|
|
|
{
|
|
|
"radar_type": 0,
|
|
|
"radar_ver": "0.1.1",
|
|
|
"arm_ver": "0.0.0",
|
|
|
"al_ver": "0.0.0",
|
|
|
"pwc_ver": "0.0.0",
|
|
|
"cd_ver": "0.0.0",
|
|
|
"v1": 0,
|
|
|
"v2": 0,
|
|
|
"v3": 0,
|
|
|
"v4": 0,
|
|
|
"radar_total_vol": 23.5,
|
|
|
"radar_total_cur": 0.0,
|
|
|
"nx_vol": 0.0,
|
|
|
"nx_cur": 0.0,
|
|
|
"nx_temp": 25.0,
|
|
|
"arm_vol": 23.5,
|
|
|
"arm_cur": 0.0,
|
|
|
"arm_temp": 25.0,
|
|
|
"ant_vol": 23.5,
|
|
|
"ant_cur": 0.0,
|
|
|
"ant_temp": 0.0,
|
|
|
"at_work_area_status": 0,
|
|
|
"pwb_err_code": 0,
|
|
|
"pwa_err_code": 0,
|
|
|
"al_err_code": 0,
|
|
|
"arm_err_code": 0,
|
|
|
"radar_err_code": 0,
|
|
|
"radar_work_state": 0,
|
|
|
"ty": 1
|
|
|
},
|
|
|
{
|
|
|
"Seq": 3.0,
|
|
|
"MD5": null,
|
|
|
"TimeStamp": 5.644776E+24,
|
|
|
"MissionID": 5.644776E+24,
|
|
|
"RngRes": 0.075,
|
|
|
"RngNum": 0.0,
|
|
|
"RngMin": 15.0,
|
|
|
"AziRes": 0.1,
|
|
|
"AziNum": 0.0,
|
|
|
"AziMin": 600.0,
|
|
|
"DataType": 2.8E-44,
|
|
|
"LonMin": 112.99582,
|
|
|
"LatMin": 28.242912,
|
|
|
"TarNum": 6E-45,
|
|
|
"ty": 4
|
|
|
}
|
|
|
]
|
|
|
let area = {
|
|
|
"LatMin": 36.14505053622,
|
|
|
"LatMax": 36.15302618219,
|
|
|
"LonMin": 120.38532472236,
|
|
|
"LonMax": 120.39109582218,
|
|
|
}
|
|
|
|
|
|
const points = ref([
|
|
|
{
|
|
|
lon: 120.38532472236,
|
|
|
lat: 36.14505053622,
|
|
|
name: '点位1',
|
|
|
},
|
|
|
{
|
|
|
lon: 120.38532472236,
|
|
|
lat: 36.15302618219,
|
|
|
name: '点位2',
|
|
|
},
|
|
|
{
|
|
|
lon: 120.39109582218,
|
|
|
lat: 36.15302618219,
|
|
|
name: '点位3',
|
|
|
},
|
|
|
{
|
|
|
lon: 120.39109582218,
|
|
|
lat: 36.14505053622,
|
|
|
name: '点位4',
|
|
|
},
|
|
|
])
|
|
|
|
|
|
|
|
|
const list = ref([
|
|
|
{
|
|
|
value1: '点位1',
|
|
|
value2: '经纬度：(528,11)'
|
|
|
},
|
|
|
{
|
|
|
value1: '点位1',
|
|
|
value2: '经纬度：(528,11)'
|
|
|
},
|
|
|
{
|
|
|
value1: '点位1',
|
|
|
value2: '经纬度：(528,11)'
|
|
|
},
|
|
|
])
|
|
|
const rulerRef = ref()
|
|
|
const itemsId = ref(1)
|
|
|
const form1 = ref({})
|
|
|
const form2 = ref({})
|
|
|
const form3 = ref({})
|
|
|
const form4 = ref({})
|
|
|
const form5 = ref({})
|
|
|
const form6 = ref({})
|
|
|
const radarWorkState = ref(0)
|
|
|
const dotIndex = ref(-1)
|
|
|
const tableData1 = ref([])
|
|
|
const tableData2 = ref([
|
|
|
{
|
|
|
"id": 2,
|
|
|
"name": "测试",
|
|
|
"lon": 12.2299995,
|
|
|
"lat": 323.329987,
|
|
|
"deviation": 12,
|
|
|
"shielding": 20
|
|
|
},
|
|
|
{
|
|
|
"id": 1,
|
|
|
"name": "测试",
|
|
|
"lon": 12.2299995,
|
|
|
"lat": 323.329987,
|
|
|
"deviation": 12,
|
|
|
"shielding": 20
|
|
|
}
|
|
|
])
|
|
|
const date1 = ref([])
|
|
|
const setItemsId = (e) => {
|
|
|
itemsId.value = e
|
|
|
}
|
|
|
const locationData = ref({})
|
|
|
const currentPosition = ref({})
|
|
|
|
|
|
const processData = (data) => {
|
|
|
// console.log('data',data.ty)
|
|
|
console.log('FodName', data.FodName)
|
|
|
if (data.FodName === '雷达信息') {
|
|
|
console.log('雷达信息', data.radar_work_state)
|
|
|
radarWorkState.value = data.radar_work_state
|
|
|
}
|
|
|
if (data.FodName === '图像数据') {
|
|
|
}
|
|
|
if (data.FodName === 'fod信息') {
|
|
|
setDot(data)
|
|
|
}
|
|
|
if (data.ty === 3) {
|
|
|
}
|
|
|
if (data.FodName === '车辆信息') {
|
|
|
currentPosition.value = {
|
|
|
lon: data.Longitude,
|
|
|
lat: data.Latitude,
|
|
|
}
|
|
|
// console.log(data.Longitude > area.LonMin, data.Longitude < area.LonMax, data.Latitude > area.LatMin, data.Latitude < area.LatMax)
|
|
|
if (data.Longitude > area.LonMin && data.Longitude < area.LonMax && data.Latitude > area.LatMin && data.Latitude < area.LatMax) {
|
|
|
let location = {
|
|
|
x: 300 - (area.LonMax - data.Longitude) / ((area.LonMax - area.LonMin) / 300),
|
|
|
y: 1800 - (area.LatMax - data.Latitude) / ((area.LatMax - area.LatMin) / 1800),
|
|
|
rotate: data.HeadingAngle
|
|
|
// rotate: 0
|
|
|
}
|
|
|
console.log('location',location)
|
|
|
locationData.value = location
|
|
|
}
|
|
|
|
|
|
}
|
|
|
};
|
|
|
const parasSignalproForm = ref({
|
|
|
imaging: {},
|
|
|
dectection: {}
|
|
|
})
|
|
|
const parasPosForm = ref({
|
|
|
runwaynum: {
|
|
|
startpos_num: 1
|
|
|
},
|
|
|
runwayedges: [
|
|
|
{
|
|
|
startpos_lon_a: '',
|
|
|
startpos_lat_a: '',
|
|
|
startpos_alt_a: '',
|
|
|
startpos_lon_b: '',
|
|
|
startpos_lat_b: '',
|
|
|
startpos_alt_b: '',
|
|
|
startpos_ori: ''
|
|
|
}
|
|
|
]
|
|
|
})
|
|
|
|
|
|
onMounted(() => {
|
|
|
ad()
|
|
|
getOption()
|
|
|
getShildTableList()
|
|
|
points.value = localStorage.getItem('points') ? JSON.parse(localStorage.getItem('points')) : [
|
|
|
{
|
|
|
lon: 117.213524,
|
|
|
lat: 36.837967,
|
|
|
name: '点位1',
|
|
|
},
|
|
|
{
|
|
|
lon: 117.213524,
|
|
|
lat: 36.847967,
|
|
|
name: '点位2',
|
|
|
},
|
|
|
{
|
|
|
lon: 117.223524,
|
|
|
lat: 36.847967,
|
|
|
name: '点位3',
|
|
|
},
|
|
|
{
|
|
|
lon: 117.223524,
|
|
|
lat: 36.837967,
|
|
|
name: '点位4',
|
|
|
},
|
|
|
]
|
|
|
getArea()
|
|
|
|
|
|
// setDot({
|
|
|
// "DarDatas": [{"Lon": 117.213524, "Lat": 36.837967}, {"Lon": 0.0, "Lat": 0.0}, {
|
|
|
// "Lon": 0.0,
|
|
|
// "Lat": 0.0
|
|
|
// }, {"Lon": 0.0, "Lat": 0.0}, {"Lon": 117.2134, "Lat": 36.837967}, {"Lon": 0.0, "Lat": 0.0}, {
|
|
|
// "Lon": 0.0,
|
|
|
// "Lat": 0.0
|
|
|
// }, {"Lon": 0.0, "Lat": 0.0}, {"Lon": 117.21341, "Lat": 36.837986}, {"Lon": 0.0, "Lat": 0.0}, {
|
|
|
// "Lon": 0.0,
|
|
|
// "Lat": 0.0
|
|
|
// }, {"Lon": 0.0, "Lat": 0.0}, {"Lon": 117.21337, "Lat": 36.838}, {"Lon": 0.0, "Lat": 0.0}],
|
|
|
// "Seq": 0,
|
|
|
// "MD5": "038fb0493c415f58c703ab205f9f2c94",
|
|
|
// "TimeStamp": 1757556826,
|
|
|
// "MissionID": 1757556826,
|
|
|
// "RngRes": 0.075,
|
|
|
// "RngNum": 0,
|
|
|
// "RngMin": 10.0,
|
|
|
// "AziRes": 0.1,
|
|
|
// "AziNum": 0,
|
|
|
// "AziMin": 0.03593219,
|
|
|
// "DataType": 20,
|
|
|
// "LonMin": 117.213844,
|
|
|
// "LatMin": 36.83799,
|
|
|
// "TarNum": 14,
|
|
|
// "ty": 0,
|
|
|
// "FodName": "fod信息"
|
|
|
// })
|
|
|
})
|
|
|
|
|
|
const getOption = () => {
|
|
|
getParasPos().then((e) => {
|
|
|
parasPosForm.value = {
|
|
|
runwaynum: e.runwaynum,
|
|
|
runwayedges: e.runwayedges,
|
|
|
}
|
|
|
})
|
|
|
getParasSignalpro().then((e) => {
|
|
|
parasSignalproForm.value = {
|
|
|
imaging: e.imaging,
|
|
|
dectection: e.dectection,
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
const saveParasSignalproForm = () => {
|
|
|
setParasSignalpro(parasSignalproForm.value).then(e => {
|
|
|
console.log(e)
|
|
|
})
|
|
|
}
|
|
|
const saveParasPosForm = () => {
|
|
|
setParasPos(parasPosForm.value).then(e => {
|
|
|
console.log(e)
|
|
|
})
|
|
|
}
|
|
|
const updateRunwayNum = (e) => {
|
|
|
let arr = new Array(e).fill(0)
|
|
|
.map((item, index) => {
|
|
|
if (index <= parasPosForm.value.runwayedges.length - 1) {
|
|
|
return JSON.parse(JSON.stringify(parasPosForm.value.runwayedges[index]))
|
|
|
} else {
|
|
|
return {
|
|
|
startpos_lon_a: '',
|
|
|
startpos_lat_a: '',
|
|
|
startpos_alt_a: '',
|
|
|
startpos_lon_b: '',
|
|
|
startpos_lat_b: '',
|
|
|
startpos_alt_b: '',
|
|
|
startpos_ori: ''
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
console.log(arr)
|
|
|
parasPosForm.value.runwayedges = JSON.parse(JSON.stringify(arr))
|
|
|
}
|
|
|
|
|
|
const addShildItem = () => {
|
|
|
addShildData({
|
|
|
name: 'string',
|
|
|
lon: 123,
|
|
|
lat: 12,
|
|
|
deviation: 12,
|
|
|
shielding: 23
|
|
|
}).then(e => {
|
|
|
getShildTableList()
|
|
|
})
|
|
|
}
|
|
|
const delShildItem = (e) => {
|
|
|
delShildData(e).then(e => {
|
|
|
getShildTableList()
|
|
|
})
|
|
|
}
|
|
|
const getShildTableList = () => {
|
|
|
getShildList({
|
|
|
pageIndex: 1,
|
|
|
pageSize: 10,
|
|
|
name: 'string'
|
|
|
}).then((e) => {
|
|
|
tableData2.value = e.data
|
|
|
|
|
|
})
|
|
|
}
|
|
|
|
|
|
const ad = () => {
|
|
|
|
|
|
// 1. 创建 WebSocket 连接（ws:// 或 wss://）
|
|
|
// const socket = new WebSocket("ws://192.168.1.123:7789/ws");
|
|
|
const socket = new WebSocket("ws://192.168.1.123:7789/ws");
|
|
|
|
|
|
// 2. 连接成功时触发
|
|
|
socket.addEventListener("open", () => {
|
|
|
console.log("✅ WebSocket 连接成功");
|
|
|
});
|
|
|
|
|
|
// 3. 接收消息
|
|
|
socket.addEventListener("message", (event) => {
|
|
|
console.log(JSON.parse(event.data))
|
|
|
processData(JSON.parse(event.data))
|
|
|
});
|
|
|
|
|
|
// 4. 连接关闭时触发
|
|
|
socket.addEventListener("close", () => {
|
|
|
console.log("❌ WebSocket 已关闭");
|
|
|
});
|
|
|
|
|
|
// 5. 出错时触发
|
|
|
socket.addEventListener("error", (error) => {
|
|
|
console.error("⚠️ WebSocket 出错:", error);
|
|
|
});
|
|
|
}
|
|
|
|
|
|
const StartWorkBtn = () => {
|
|
|
StartWork()
|
|
|
rulerRef.value.setDot([], true)
|
|
|
}
|
|
|
const StopWorkBtn = () => {
|
|
|
StopWork()
|
|
|
}
|
|
|
const RestartWorkBtn = () => {
|
|
|
RestartWork()
|
|
|
}
|
|
|
const ShutDownWorkBtn = () => {
|
|
|
ShutDownWork()
|
|
|
}
|
|
|
const getPoint = (k) => {
|
|
|
points.value[k].lon = currentPosition.value.lon || 0
|
|
|
points.value[k].lat = currentPosition.value.lat || 0
|
|
|
}
|
|
|
const getArea = () => {
|
|
|
if (points.value.length < 4) return
|
|
|
let data = points.value
|
|
|
|
|
|
let latMin = data[0].lat;
|
|
|
let latMax = data[0].lat;
|
|
|
let lonMin = data[0].lon;
|
|
|
let lonMax = data[0].lon;
|
|
|
|
|
|
for (let i = 1; i < data.length; i++) {
|
|
|
const p = data[i];
|
|
|
if (p.lat < latMin) latMin = p.lat;
|
|
|
if (p.lat > latMax) latMax = p.lat;
|
|
|
if (p.lon < lonMin) lonMin = p.lon;
|
|
|
if (p.lon > lonMax) lonMax = p.lon;
|
|
|
}
|
|
|
area = {
|
|
|
LatMin: latMin,
|
|
|
LatMax: latMax,
|
|
|
LonMin: lonMin,
|
|
|
LonMax: lonMax,
|
|
|
}
|
|
|
}
|
|
|
const savePoint = () => {
|
|
|
localStorage.setItem('points', JSON.stringify(points.value))
|
|
|
getArea()
|
|
|
}
|
|
|
const setDot = (e) => {
|
|
|
let dots = e.DarDatas.map((v, k) => {
|
|
|
if (v.Lon == 0 && v.Lat == 0) return null
|
|
|
console.log(v)
|
|
|
console.log(area)
|
|
|
return {
|
|
|
x: 300 - (area.LonMax - v.Lon) / ((area.LonMax - area.LonMin) / 300),
|
|
|
y: 1800 - (area.LatMax - v.Lat) / ((area.LatMax - area.LatMin) / 1800),
|
|
|
index: k
|
|
|
}
|
|
|
}).filter(v => v)
|
|
|
tableData1.value = [...tableData1.value, ...e.DarDatas.filter(v => v.Lon !== 0 && v.Lat !== 0).map((v, k) => {
|
|
|
return {...v, index: k}
|
|
|
})]
|
|
|
console.log(dots)
|
|
|
rulerRef.value.setDot(dots)
|
|
|
}
|
|
|
const table1Current = (e, v) => {
|
|
|
console.log(e)
|
|
|
dotIndex.value = e.index || 0
|
|
|
}
|
|
|
</script>
|
|
|
<style>
|
|
|
.app-container {
|
|
|
width: 100%;
|
|
|
height: 1920px;
|
|
|
margin: 0 auto;
|
|
|
border: 1px solid #888888;
|
|
|
}
|
|
|
|
|
|
.top {
|
|
|
width: 100%;
|
|
|
height: 80px;
|
|
|
font-size: 24px;
|
|
|
background-color: #202227;
|
|
|
position: relative;
|
|
|
}
|
|
|
|
|
|
.items {
|
|
|
position: absolute;
|
|
|
top: 15%;
|
|
|
left: 50%;
|
|
|
transform: translateX(-50%);
|
|
|
white-space: nowrap;
|
|
|
}
|
|
|
|
|
|
.item {
|
|
|
display: inline-block;
|
|
|
width: 120px;
|
|
|
height: 100%;
|
|
|
color: #8C9A9C;
|
|
|
line-height: 56px;
|
|
|
cursor: pointer;
|
|
|
font-size: 18px;
|
|
|
font-weight: 600;
|
|
|
letter-spacing: 2px;
|
|
|
}
|
|
|
|
|
|
.item span {
|
|
|
display: inline-block;
|
|
|
height: 100%;
|
|
|
}
|
|
|
|
|
|
.item.click span, .item:hover span {
|
|
|
color: #0D52BF;
|
|
|
border-bottom: 2px solid #0D52BF;
|
|
|
}
|
|
|
|
|
|
.title {
|
|
|
line-height: 80px;
|
|
|
color: #fff;
|
|
|
margin-left: 20px;
|
|
|
display: inline-block;
|
|
|
text-align: left;
|
|
|
}
|
|
|
|
|
|
.left {
|
|
|
display: inline-block;
|
|
|
height: 1840px;
|
|
|
width: 380px;
|
|
|
vertical-align: top;
|
|
|
}
|
|
|
|
|
|
.right {
|
|
|
display: inline-block;
|
|
|
height: 1800px;
|
|
|
width: 660px;
|
|
|
padding: 20px;
|
|
|
background-color: #F6F7FB;
|
|
|
}
|
|
|
</style> |