Compare commits

..

No commits in common. "37acb9954dea9b06be6d141bf8cab70e0eddae01" and "71023e0153abb2eaba09a2dedabe6b1b77e60942" have entirely different histories.

3 changed files with 138 additions and 210 deletions

View File

@ -1,10 +1,10 @@
<template> <template>
<div class="twin-situation"> <div class="twin-situation" >
<!-- 资源列表 --> <!-- 资源列表 -->
<dt-card <dt-card
:class="{ :class="{
'resource-list': true, 'resource-list': true,
'resource-list__large': isIconModeLarge, 'resource-list__large': isIconModeLarge
}" }"
icon="ri-send-plane-line" icon="ri-send-plane-line"
title="可用资源" title="可用资源"
@ -19,50 +19,30 @@
可用资源 可用资源
</span> </span>
</template> </template>
<!-- <template v-slot:command>--> <!-- <template v-slot:command>-->
<!-- <el-tooltip--> <!-- <el-tooltip-->
<!-- effect="dark"--> <!-- effect="dark"-->
<!-- content="详情"--> <!-- content="详情"-->
<!-- placement="bottom"--> <!-- placement="bottom"-->
<!-- >--> <!-- >-->
<!-- <i class="ri-eye-2-line" @click="toggleRightShow"></i>--> <!-- <i class="ri-eye-2-line" @click="toggleRightShow"></i>-->
<!-- </el-tooltip>--> <!-- </el-tooltip>-->
<!-- </template>--> <!-- </template>-->
<div class="resource-list__content"> <div class="resource-list__content">
<div <div v-for="item in resourceList.data" :key="item.id" class="resource-item" @click.stop="resourceClick(item)">
v-for="item in resourceList.data" <span class="device-status" :class="item.status ? 'device-status__online' : ''"></span>
:key="item.id"
class="resource-item"
@click.stop="resourceClick(item)"
>
<span
class="device-status"
:class="item.status ? 'device-status__online' : ''"
></span>
<span class="icon"><i class="ri-dv-line"></i></span> <span class="icon"><i class="ri-dv-line"></i></span>
<span class="device-name">{{ item.name }}</span> <span class="device-name">{{item.name}}</span>
<span <span class="battery" :class="getDeviceBatteryClass(item.battery)" style="opacity: 0;"><i class="ri-battery-saver-line"></i>{{item.battery}}%</span>
class="battery" <span class="fly-height"><i class="ri-expand-vertical-line"></i>{{item.flyHeight}}m</span>
:class="getDeviceBatteryClass(item.battery)" <span class="device-location"><i class="ri-map-pin-line"></i>{{item.lon}},{{item.lat}}</span>
style="opacity: 0" <i class="iconfont icon-zhuizong device-lock" @click.stop="flyToTarget(item.lon, item.lat, item.flyHeight)"></i>
><i class="ri-battery-saver-line"></i>{{ item.battery }}%</span
>
<span class="fly-height"
><i class="ri-expand-vertical-line"></i>{{ item.flyHeight }}m</span
>
<span class="device-location"
><i class="ri-map-pin-line"></i>{{ item.lon }},{{ item.lat }}</span
>
<i
class="iconfont icon-zhuizong device-lock"
@click.stop="flyToTarget(item.lon, item.lat, item.flyHeight)"
></i>
</div> </div>
</div> </div>
</dt-card> </dt-card>
<!-- 任务列表 --> <!-- 任务列表 -->
<!-- <dt-card <!-- <dt-card
:class="{ :class="{
'task-list': true, 'task-list': true,
'task-list__large': isIconModeLarge 'task-list__large': isIconModeLarge
@ -80,21 +60,21 @@
任务列表 任务列表
</span> </span>
</template> --> </template> -->
<!-- <template v-slot:command>--> <!-- <template v-slot:command>-->
<!-- <el-tooltip--> <!-- <el-tooltip-->
<!-- effect="dark"--> <!-- effect="dark"-->
<!-- content="上传精处理图片"--> <!-- content="上传精处理图片"-->
<!-- placement="top"--> <!-- placement="top"-->
<!-- >--> <!-- >-->
<!-- <i class="ri-upload-2-line" @click.stop="showUpload"></i>--> <!-- <i class="ri-upload-2-line" @click.stop="showUpload"></i>-->
<!-- </el-tooltip>--> <!-- </el-tooltip>-->
<!-- </template>--> <!-- </template>-->
<!-- <!--
<div class="task-list__content"> <div class="task-list__content">
<div v-for="(item, index) in taskList.data" :key="item.id" class="task-item"> <div v-for="(item, index) in taskList.data" :key="item.id" class="task-item">
<div class="left-part">--> <div class="left-part">-->
<!-- <div class="task-progress-bar" :style="'width: ' + item.uavCompletion +'%;'"></div>--> <!-- <div class="task-progress-bar" :style="'width: ' + item.uavCompletion +'%;'"></div>-->
<!-- <div class="execute-info" @click="openTaskLineDetail(item)"> <!-- <div class="execute-info" @click="openTaskLineDetail(item)">
<span class="execute-type-icon" :class="'execute-state-' + item.status"><i class="ri-dv-line"></i></span> <span class="execute-type-icon" :class="'execute-state-' + item.status"><i class="ri-dv-line"></i></span>
<span class="task-execute">{{ item.name }}</span> <span class="task-execute">{{ item.name }}</span>
</div> </div>
@ -138,21 +118,18 @@
<i class="ri-repeat-line" @click.stop="reRunTask(item, index)"></i> <i class="ri-repeat-line" @click.stop="reRunTask(item, index)"></i>
</el-tooltip>--> </el-tooltip>-->
<!-- <i class="el-icon-edit-outline edit-task" @click.stop="editTask(item)"></i>--> <!-- <i class="el-icon-edit-outline edit-task" @click.stop="editTask(item)"></i>-->
<!-- <i class="el-icon-close delete-task" @click.stop="deleteTask(item)"></i>--> <!-- <i class="el-icon-close delete-task" @click.stop="deleteTask(item)"></i>-->
<!-- </div> <!-- </div>
</div> </div>
</div> </div>
</dt-card> </dt-card>
--> -->
<!-- 图片上传 --> <!-- 图片上传 -->
<pictures-upload <pictures-upload v-if="uploadPictureInfo.visible" :visible.sync="uploadPictureInfo.visible"></pictures-upload>
v-if="uploadPictureInfo.visible"
:visible.sync="uploadPictureInfo.visible"
></pictures-upload>
<!-- 气象预警 --> <!-- 气象预警 -->
<!-- <!--
<right-slide class="weather-info-wrap"> <right-slide class="weather-info-wrap">
<dt-card <dt-card
:class="{ :class="{
@ -191,7 +168,7 @@
--> -->
<!-- 雷达图 --> <!-- 雷达图 -->
<!-- <!--
<right-slide class="radar-info-wrap"> <right-slide class="radar-info-wrap">
<dt-card <dt-card
:class="{ :class="{
@ -224,7 +201,7 @@
<dt-card <dt-card
:class="{ :class="{
'detail-info': true, 'detail-info': true,
'detail-info__large': isIconModeLarge, 'detail-info__large': isIconModeLarge
}" }"
icon="iconfont icon-target" icon="iconfont icon-target"
title="详细信息" title="详细信息"
@ -237,29 +214,13 @@
<div class="detail-info__content"> <div class="detail-info__content">
<div class="base-info"> <div class="base-info">
<!-- 无人机 --> <!-- 无人机 -->
<div class="uav-item"> <div class="uav-item" >
<span <span class="device-status" :class="getDeviceSignalClass(detailInfo.baseInfo.signal)"></span>
class="device-status"
:class="getDeviceSignalClass(detailInfo.baseInfo.signal)"
></span>
<span class="icon"><i class="ri-dv-line"></i></span> <span class="icon"><i class="ri-dv-line"></i></span>
<span class="device-name">{{ detailInfo.baseInfo.name }}</span> <span class="device-name">{{ detailInfo.baseInfo.name }}</span>
<span <span class="battery" :class="getDeviceBatteryClass(detailInfo.baseInfo.battery)" style="opacity: 0;"><i class="ri-battery-saver-line"></i>{{detailInfo.baseInfo.battery}}%</span>
class="battery" <span class="fly-height"><i class="ri-expand-vertical-line"></i>{{detailInfo.baseInfo.flyHeight}}m</span>
:class="getDeviceBatteryClass(detailInfo.baseInfo.battery)" <span class="device-location"><i class="ri-map-pin-line"></i>{{detailInfo.baseInfo.lon}},{{detailInfo.baseInfo.lat}}</span>
style="opacity: 0"
><i class="ri-battery-saver-line"></i
>{{ detailInfo.baseInfo.battery }}%</span
>
<span class="fly-height"
><i class="ri-expand-vertical-line"></i
>{{ detailInfo.baseInfo.flyHeight }}m</span
>
<span class="device-location"
><i class="ri-map-pin-line"></i>{{ detailInfo.baseInfo.lon }},{{
detailInfo.baseInfo.lat
}}</span
>
<i class="el-icon-info device-lock" @click="showUavMore"></i> <i class="el-icon-info device-lock" @click="showUavMore"></i>
</div> </div>
</div> </div>
@ -274,36 +235,21 @@
<!-- </div>--> <!-- </div>-->
<div class="picture-list"> <div class="picture-list">
<div>回传图像</div> <div>回传图像</div>
<div <div v-for="item in detailInfo.pictureList" :key="item.createTime" class="picture-list-item">
v-for="item in detailInfo.pictureList"
:key="item.createTime"
class="picture-list-item"
>
<div class="picture-item-image"> <div class="picture-item-image">
<el-image <el-image
style="width: 40px; height: 40px" style="width: 40px; height: 40px"
:src="item.url" :src="item.url"
:preview-src-list="[item.url]" :preview-src-list="[item.url]">
>
</el-image> </el-image>
</div> </div>
<div class="picture-item-info"> <div class="picture-item-info">
<div> <div>拍摄任务{{item.taskName}} | 拍摄载荷{{item.loaderName}}</div>
拍摄任务{{ item.taskName }} | 拍摄载荷{{ <div>拍摄时间{{item.createTime}}</div>
item.loaderName
}}
</div>
<div>拍摄时间{{ item.createTime }}</div>
</div> </div>
<div class="picture-command"> <div class="picture-command">
<i <i class="iconfont icon-dt-icon-dingwei" @click="lockHistoryPicture(item)"></i>
class="iconfont icon-dt-icon-dingwei" <i class="iconfont icon-quanjushijiao-copy" @click="toggleHistoryPicture(item)"></i>
@click="lockHistoryPicture(item)"
></i>
<i
class="iconfont icon-quanjushijiao-copy"
@click="toggleHistoryPicture(item)"
></i>
</div> </div>
</div> </div>
</div> </div>
@ -311,11 +257,12 @@
</dt-card> </dt-card>
</right-slide> </right-slide>
<!-- 详情 --> <!-- 详情 -->
<dt-card <dt-card
:class="{ :class="{
'detail-uav': true, 'detail-uav': true,
'detail-uav__large': isIconModeLarge, 'detail-uav__large': isIconModeLarge
}" }"
icon="iconfont icon-target" icon="iconfont icon-target"
title="详细信息" title="详细信息"
@ -327,92 +274,59 @@
> >
<div class="detail-uav__content"> <div class="detail-uav__content">
<div class="image-info"> <div class="image-info">
<img :src="detailUav.baseInfo.url" alt="" /> <img :src="detailUav.baseInfo.url" alt="">
<div class="status-info"> <div class="status-info">
<div> <div>
<span <span :class="detailUav.baseInfo.status ? 'uav-status-online' : 'uav-status-offline'"></span>
:class=" <span>{{detailUav.baseInfo.status ? '在线' : '离线'}}</span>
detailUav.baseInfo.status <!-- <span style="opacity: 0;"><i class="ri-battery-saver-line"></i>{{detailUav.baseInfo.battery}}%</span>-->
? 'uav-status-online' <span><i class="ri-expand-vertical-line"></i>{{detailUav.baseInfo.flyHeight}}m</span>
: 'uav-status-offline' <!-- <span><i class="ri-expand-horizontal-line"></i>{{detailUav.baseInfo.flyWidth}}m</span>-->
"
></span>
<span>{{ detailUav.baseInfo.status ? '在线' : '离线' }}</span>
<!-- <span style="opacity: 0;"><i class="ri-battery-saver-line"></i>{{detailUav.baseInfo.battery}}%</span>-->
<span
><i class="ri-expand-vertical-line"></i
>{{ detailUav.baseInfo.flyHeight }}m</span
>
<!-- <span><i class="ri-expand-horizontal-line"></i>{{detailUav.baseInfo.flyWidth}}m</span>-->
</div> </div>
<div> <div>
<span>{{ detailUav.baseInfo.longitude }}</span> <span>{{detailUav.baseInfo.longitude}}</span>
<span>{{ detailUav.baseInfo.latitude }}</span> <span>{{detailUav.baseInfo.latitude}}</span>
<i <i class="iconfont icon-zhuizong" @click.stop="flyToTarget(detailUav.baseInfo.longitude, detailUav.baseInfo.latitude, detailUav.baseInfo.flyHeight)"></i>
class="iconfont icon-zhuizong"
@click.stop="
flyToTarget(
detailUav.baseInfo.longitude,
detailUav.baseInfo.latitude,
detailUav.baseInfo.flyHeight
)
"
></i>
</div> </div>
</div> </div>
</div> </div>
<div class="other-info"> <div class="other-info">
<el-collapse <el-collapse v-model="detailUav.activeNames" @change="handleUavDetailCollapse">
v-model="detailUav.activeNames" <!-- <el-collapse-item title="基本信息" name="1">-->
@change="handleUavDetailCollapse" <!-- <div class="uav-span-wrap"><span>名称</span><span>{{detailUav.basicsInfo.name}}</span></div>-->
> <!-- <div class="uav-span-wrap"><span>分组</span><span>{{detailUav.basicsInfo.group}}</span></div>-->
<!-- <el-collapse-item title="基本信息" name="1">--> <!-- </el-collapse-item>-->
<!-- <div class="uav-span-wrap"><span>名称</span><span>{{detailUav.basicsInfo.name}}</span></div>--> <!-- <el-collapse-item title="任务信息" name="2">-->
<!-- <div class="uav-span-wrap"><span>分组</span><span>{{detailUav.basicsInfo.group}}</span></div>--> <!-- <div class="target-task-item" v-for="item in detailUav.taskList" :key="item.id">-->
<!-- </el-collapse-item>--> <!-- <div class="task-progress-bar" :style="'width: ' + item.uavCompletion +'%;'"></div>-->
<!-- <el-collapse-item title="任务信息" name="2">--> <!-- <div class="task-info">-->
<!-- <div class="target-task-item" v-for="item in detailUav.taskList" :key="item.id">--> <!-- <i :class="item.typeIcon"></i>-->
<!-- <div class="task-progress-bar" :style="'width: ' + item.uavCompletion +'%;'"></div>--> <!-- <span class="task-name">{{ item.taskName }}</span>-->
<!-- <div class="task-info">--> <!-- <span :class="{ 'task-finish': item.isFinish }">{{-->
<!-- <i :class="item.typeIcon"></i>--> <!-- item.uavCompletionName-->
<!-- <span class="task-name">{{ item.taskName }}</span>--> <!-- }}</span>-->
<!-- <span :class="{ 'task-finish': item.isFinish }">{{--> <!-- </div>-->
<!-- item.uavCompletionName--> <!-- <div class="task-time">{{item.taskTime}}</div>-->
<!-- }}</span>--> <!-- </div>-->
<!-- </div>--> <!-- </el-collapse-item>-->
<!-- <div class="task-time">{{item.taskTime}}</div>-->
<!-- </div>-->
<!-- </el-collapse-item>-->
<el-collapse-item title="状态信息" name="3"> <el-collapse-item title="状态信息" name="3">
<el-tabs v-model="detailUav.activeTab"> <el-tabs v-model="detailUav.activeTab">
<el-tab-pane label="DEV" name="DEV"> <el-tab-pane label="DEV" name="DEV">
<div <div class="uav-span-wrap" v-for="item in detailUav.statusInfo.dev" :key="item.name">
class="uav-span-wrap" <span>{{item.name}}</span>
v-for="item in detailUav.statusInfo.dev" <span>{{item.value}}{{item.unit}}</span>
:key="item.name"
>
<span>{{ item.name }}</span>
<span>{{ item.value }}{{ item.unit }}</span>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="GPS" name="GPS"> <el-tab-pane label="GPS" name="GPS">
<div <div class="uav-span-wrap" v-for="item in detailUav.statusInfo.gps" :key="item.name">
class="uav-span-wrap" <span>{{item.name}}</span>
v-for="item in detailUav.statusInfo.gps" <span>{{item.value}}{{item.unit}}</span>
:key="item.name"
>
<span>{{ item.name }}</span>
<span>{{ item.value }}{{ item.unit }}</span>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="IMU" name="IMU"> <el-tab-pane label="IMU" name="IMU">
<div <div class="uav-span-wrap" v-for="item in detailUav.statusInfo.imu" :key="item.name">
class="uav-span-wrap" <span>{{item.name}}</span>
v-for="item in detailUav.statusInfo.imu" <span>{{item.value}}{{item.unit}}</span>
:key="item.name"
>
<span>{{ item.name }}</span>
<span>{{ item.value }}{{ item.unit }}</span>
</div> </div>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
@ -433,36 +347,21 @@
</el-collapse-item> </el-collapse-item>
<el-collapse-item title="回传图像" name="5"> <el-collapse-item title="回传图像" name="5">
<div class="back-image"> <div class="back-image">
<div <div v-for="item in detailInfo.pictureList" :key="item.time" class="picture-list-item">
v-for="item in detailInfo.pictureList"
:key="item.time"
class="picture-list-item"
>
<div class="picture-item-image"> <div class="picture-item-image">
<el-image <el-image
style="width: 40px; height: 40px" style="width: 40px; height: 40px"
:src="item.url" :src="item.url"
:preview-src-list="[item.url]" :preview-src-list="[item.url]">
>
</el-image> </el-image>
</div> </div>
<div class="picture-item-info"> <div class="picture-item-info">
<div> <div>拍摄任务{{item.taskName}} | 拍摄载荷{{item.loaderName}}</div>
拍摄任务{{ item.taskName }} | 拍摄载荷{{ <div>拍摄时间{{item.time}}</div>
item.loaderName
}}
</div>
<div>拍摄时间{{ item.time }}</div>
</div> </div>
<div class="picture-command"> <div class="picture-command">
<i <i class="iconfont icon-dt-icon-dingwei" @click="lockHistoryPicture(item)"></i>
class="iconfont icon-dt-icon-dingwei" <i class="iconfont icon-quanjushijiao-copy" @click="toggleHistoryPicture(item)"></i>
@click="lockHistoryPicture(item)"
></i>
<i
class="iconfont icon-quanjushijiao-copy"
@click="toggleHistoryPicture(item)"
></i>
</div> </div>
</div> </div>
</div> </div>
@ -472,6 +371,7 @@
</div> </div>
</dt-card> </dt-card>
<dt-dialog <dt-dialog
:title="taskLineDetail.title" :title="taskLineDetail.title"
top="20vh" top="20vh"
@ -480,25 +380,53 @@
append-to-body append-to-body
> >
<div class="task-line-detail"> <div class="task-line-detail">
<el-table :data="taskLineDetail.data" height="100%" style="width: 100%"> <el-table
<el-table-column type="index" width="50"> </el-table-column> :data="taskLineDetail.data"
<el-table-column prop="startLon" label="起点经度"> </el-table-column> height="100%"
<el-table-column prop="startLat" label="起点纬度"> </el-table-column> style="width: 100%"
<el-table-column prop="startHeight" label="起点相对高度"> >
<el-table-column
type="index"
width="50">
</el-table-column> </el-table-column>
<el-table-column prop="startAlt" label="起点海拔高度"> <el-table-column
prop="startLon"
label="起点经度">
</el-table-column> </el-table-column>
<el-table-column prop="endLon" label="终点经度"> </el-table-column> <el-table-column
<el-table-column prop="endLat" label="终点纬度"> </el-table-column> prop="startLat"
<el-table-column prop="endHeight" label="终点相对高度"> label="起点纬度">
</el-table-column> </el-table-column>
<el-table-column prop="endAlt" label="终点海拔高度"> <el-table-column
prop="startHeight"
label="起点相对高度">
</el-table-column>
<el-table-column
prop="startAlt"
label="起点海拔高度">
</el-table-column>
<el-table-column
prop="endLon"
label="终点经度">
</el-table-column>
<el-table-column
prop="endLat"
label="终点纬度">
</el-table-column>
<el-table-column
prop="endHeight"
label="终点相对高度">
</el-table-column>
<el-table-column
prop="endAlt"
label="终点海拔高度">
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
</dt-dialog> </dt-dialog>
<!-- <dt-loading :visible="loadingCount > 0"></dt-loading> --> <dt-loading :visible="loadingCount > 0"></dt-loading>
</div> </div>
</template> </template>
<script src="./index.js"></script> <script src="./index.js"></script>

View File

@ -92,7 +92,7 @@
</div> </div>
<div class="task-time">{{ item.beginTime }}</div> <div class="task-time">{{ item.beginTime }}</div>
</div> </div>
<div class="right-part"> <div class="right-part" >
<el-tooltip <el-tooltip
effect="dark" effect="dark"
:content="item.check ? '隐藏' : '显示'" :content="item.check ? '隐藏' : '显示'"
@ -526,7 +526,7 @@
</div> </div>
</dt-dialog> </dt-dialog>
<!-- <dt-loading :visible="loadingCount > 0"></dt-loading> --> <dt-loading :visible="loadingCount > 0"></dt-loading>
</div> </div>
</template> </template>
<script src="./index.js"></script> <script src="./index.js"></script>

View File

@ -61,7 +61,7 @@
<info-bar v-if="menus.situation.active || menus.taskManage.active" /> <info-bar v-if="menus.situation.active || menus.taskManage.active" />
<!-- 遮罩 --> <!-- 遮罩 -->
<!-- <dt-loading :visible="loadingCount > 0"></dt-loading> --> <dt-loading :visible="loadingCount > 0"></dt-loading>
</div> </div>
</template> </template>
<script src="./index.js"></script> <script src="./index.js"></script>