Merge branch 'main' of http://123.132.248.154:10000/gitY/DiKongGanZhiPingTai
commit
e70a32934c
Binary file not shown.
|
Before Width: | Height: | Size: 844 B After Width: | Height: | Size: 428 B |
|
|
@ -0,0 +1,18 @@
|
|||
import { defHttp } from '@/utils/http/axios';
|
||||
enum Api {
|
||||
GetUavList = '/api/Manage/GetUavList',
|
||||
AddWorkspace = '/api/Manage/AddWorkspace'
|
||||
}
|
||||
|
||||
export function GetUavList(params?) {
|
||||
return defHttp.get({
|
||||
url: Api.GetUavList,
|
||||
params
|
||||
});
|
||||
}
|
||||
export function AddWorkspace(params) {
|
||||
return defHttp.post({
|
||||
url: Api.AddWorkspace,
|
||||
params
|
||||
});
|
||||
}
|
||||
|
|
@ -0,0 +1,330 @@
|
|||
<template>
|
||||
<div ref="vChartRef" id="mars3d-container" class="mars3d-container"></div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import {ref,onMounted, defineEmits} from 'vue'
|
||||
|
||||
import * as mars3d from "mars3d";
|
||||
|
||||
const emits = defineEmits(['mapOnLoad'])
|
||||
let map: mars3d.Map; // 地图对象
|
||||
let graphicLayer = null;
|
||||
|
||||
const vChartRef = ref<HTMLElement>()
|
||||
|
||||
|
||||
onMounted(()=>{
|
||||
initMap();
|
||||
})
|
||||
|
||||
|
||||
|
||||
const initMap = ()=>{
|
||||
map = new mars3d.Map(vChartRef.value,
|
||||
{
|
||||
"scene": {
|
||||
"center": {
|
||||
"lat": 35.362625,
|
||||
"lng": 118.033886,
|
||||
"alt": 8306.3,
|
||||
"heading": 360,
|
||||
"pitch": -45
|
||||
},
|
||||
"scene3DOnly": false,
|
||||
"shadows": false,
|
||||
"removeDblClick": true,
|
||||
"sceneMode": 3,
|
||||
"showSun": true,
|
||||
"showMoon": true,
|
||||
"showSkyBox": true,
|
||||
"showSkyAtmosphere": true,
|
||||
"fog": true,
|
||||
"fxaa": true,
|
||||
"requestRenderMode": true,
|
||||
"contextOptions": {
|
||||
"requestWebgl1": false,
|
||||
"webgl": {
|
||||
"preserveDrawingBuffer": true,
|
||||
"alpha": false,
|
||||
"stencil": true,
|
||||
"powerPreference": "high-performance"
|
||||
}
|
||||
},
|
||||
"globe": {
|
||||
"depthTestAgainstTerrain": false,
|
||||
"baseColor": "#546a53",
|
||||
"showGroundAtmosphere": true,
|
||||
"enableLighting": false
|
||||
},
|
||||
"cameraController": {
|
||||
"zoomFactor": 3,
|
||||
"minimumZoomDistance": 1,
|
||||
"maximumZoomDistance": 50000000,
|
||||
"enableRotate": true,
|
||||
"enableTranslate": true,
|
||||
"enableTilt": true,
|
||||
"enableZoom": true,
|
||||
"enableCollisionDetection": true,
|
||||
"minimumCollisionTerrainHeight": 15000
|
||||
}
|
||||
},
|
||||
"control": {
|
||||
"homeButton": true,
|
||||
"baseLayerPicker": false,
|
||||
"sceneModePicker": true,
|
||||
"vrButton": false,
|
||||
"fullscreenButton": true,
|
||||
"navigationHelpButton": true,
|
||||
"animation": false,
|
||||
"timeline": false,
|
||||
"infoBox": false,
|
||||
"geocoder": false,
|
||||
"selectionIndicator": false,
|
||||
"showRenderLoopErrors": true,
|
||||
"contextmenu": {
|
||||
"hasDefault": true
|
||||
},
|
||||
"mouseDownView": true,
|
||||
"zoom": {
|
||||
"insertIndex": 1
|
||||
},
|
||||
"compass": {
|
||||
"bottom": "toolbar",
|
||||
"left": "5px",
|
||||
"rotation": true
|
||||
},
|
||||
"distanceLegend": {
|
||||
"left": "10px",
|
||||
"bottom": "2px"
|
||||
},
|
||||
"locationBar": {
|
||||
"crs": "CGCS2000_GK_Zone_3",
|
||||
"crsDecimal": 0,
|
||||
"template": "<div>经度:{lng}</div> <div>纬度:{lat}</div> <div class='hide1000'>横{crsx} 纵{crsy}</div> <div>海拔：{alt}米</div> <div class='hide700'>层级：{level}</div><div>方向：{heading}°</div> <div>俯仰角：{pitch}°</div><div class='hide700'>视高：{cameraHeight}米</div>",
|
||||
"cacheTime": 50
|
||||
}
|
||||
},
|
||||
"method": {
|
||||
"templateValues": {
|
||||
"dataServer": "//data.mars3d.cn",
|
||||
"gltfServerUrl": "//data.mars3d.cn/gltf"
|
||||
}
|
||||
},
|
||||
"terrain": {
|
||||
"url": "//data.mars3d.cn/terrain",
|
||||
"show": true,
|
||||
"clip": true
|
||||
},
|
||||
"basemaps": [
|
||||
{
|
||||
"id": 10,
|
||||
"name": "地图底图",
|
||||
"type": "group",
|
||||
"opacity": 1
|
||||
},
|
||||
{
|
||||
"id": 2021,
|
||||
"pid": 10,
|
||||
"name": "天地图影像",
|
||||
"icon": "https://data.mars3d.cn/img/thumbnail/basemap/tdt_img.png",
|
||||
"type": "group",
|
||||
"layers": [
|
||||
{
|
||||
"name": "底图",
|
||||
"type": "tdt",
|
||||
"layer": "img_d",
|
||||
"eventParent": {
|
||||
"id": 2021,
|
||||
"pid": 10,
|
||||
"name": "天地图影像",
|
||||
"icon": "https://data.mars3d.cn/img/thumbnail/basemap/tdt_img.png",
|
||||
"type": "group",
|
||||
"layers": [
|
||||
{
|
||||
"name": "底图",
|
||||
"type": "tdt",
|
||||
"layer": "img_d",
|
||||
"show": true
|
||||
},
|
||||
{
|
||||
"name": "注记",
|
||||
"type": "tdt",
|
||||
"layer": "img_z",
|
||||
"show": true
|
||||
}
|
||||
],
|
||||
"show": true
|
||||
},
|
||||
"private": false,
|
||||
"id": "m-770c35e7-9054-4259-b5ee-c15f108becd0",
|
||||
"opacity": 1,
|
||||
"pid": 2021,
|
||||
"parent": {
|
||||
"id": 2021,
|
||||
"pid": 10,
|
||||
"name": "天地图影像",
|
||||
"icon": "https://data.mars3d.cn/img/thumbnail/basemap/tdt_img.png",
|
||||
"type": "group",
|
||||
"layers": [
|
||||
{
|
||||
"name": "底图",
|
||||
"type": "tdt",
|
||||
"layer": "img_d",
|
||||
"show": true
|
||||
},
|
||||
{
|
||||
"name": "注记",
|
||||
"type": "tdt",
|
||||
"layer": "img_z",
|
||||
"show": true
|
||||
}
|
||||
],
|
||||
"show": true
|
||||
},
|
||||
"zIndex": 1
|
||||
},
|
||||
{
|
||||
"name": "注记",
|
||||
"type": "tdt",
|
||||
"layer": "img_z",
|
||||
"eventParent": {
|
||||
"id": 2021,
|
||||
"pid": 10,
|
||||
"name": "天地图影像",
|
||||
"icon": "https://data.mars3d.cn/img/thumbnail/basemap/tdt_img.png",
|
||||
"type": "group",
|
||||
"layers": [
|
||||
{
|
||||
"name": "底图",
|
||||
"type": "tdt",
|
||||
"layer": "img_d",
|
||||
"show": true
|
||||
},
|
||||
{
|
||||
"name": "注记",
|
||||
"type": "tdt",
|
||||
"layer": "img_z",
|
||||
"show": true
|
||||
}
|
||||
],
|
||||
"show": true
|
||||
},
|
||||
"private": false,
|
||||
"id": "m-3b881368-574b-48a5-88b2-8b3c2c48fd62",
|
||||
"opacity": 1,
|
||||
"pid": 2021,
|
||||
"parent": {
|
||||
"id": 2021,
|
||||
"pid": 10,
|
||||
"name": "天地图影像",
|
||||
"icon": "https://data.mars3d.cn/img/thumbnail/basemap/tdt_img.png",
|
||||
"type": "group",
|
||||
"layers": [
|
||||
{
|
||||
"name": "底图",
|
||||
"type": "tdt",
|
||||
"layer": "img_d",
|
||||
"show": true
|
||||
},
|
||||
{
|
||||
"name": "注记",
|
||||
"type": "tdt",
|
||||
"layer": "img_z",
|
||||
"show": true
|
||||
}
|
||||
],
|
||||
"show": true
|
||||
},
|
||||
"zIndex": 2
|
||||
}
|
||||
],
|
||||
"show": true,
|
||||
"opacity": 1
|
||||
}
|
||||
],
|
||||
"layers": []
|
||||
});
|
||||
emits('mapOnLoad',map)
|
||||
|
||||
|
||||
}
|
||||
|
||||
//
|
||||
|
||||
const bindLayerContextMenu =()=> {
|
||||
graphicLayer.bindContextMenu([
|
||||
{
|
||||
text: "删除对象",
|
||||
icon: "fa fa-trash-o",
|
||||
show: (event) => {
|
||||
const graphic = event.graphic
|
||||
if (!graphic || graphic.isDestroy || graphic.isPrivate || graphic.graphicIds) {
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
},
|
||||
callback: (e) => {
|
||||
const graphic = e.graphic
|
||||
if (!graphic) {
|
||||
return
|
||||
}
|
||||
const parent = graphic.parent // 右击是编辑点时
|
||||
graphicLayer.removeGraphic(graphic)
|
||||
if (parent) {
|
||||
graphicLayer.removeGraphic(parent)
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
text: "停止编辑对象",
|
||||
icon: "fa fa-edit",
|
||||
show: function (e) {
|
||||
const graphic = e.graphic
|
||||
if (!graphic || !graphic.hasEdit) {
|
||||
return false
|
||||
}
|
||||
return graphic.isEditing
|
||||
},
|
||||
callback: (e) => {
|
||||
const graphic = e.graphic
|
||||
if (!graphic) {
|
||||
return false
|
||||
}
|
||||
if (graphic) {
|
||||
graphic.stopEditing()
|
||||
}
|
||||
}
|
||||
},
|
||||
])
|
||||
}
|
||||
|
||||
const drawPint = async ()=>{
|
||||
const graphic = await graphicLayer.startDraw({
|
||||
type: "polylineP",
|
||||
style: {
|
||||
pixelSize: 12,
|
||||
color: "#3388ff",
|
||||
label: {
|
||||
// 不需要文字时，去掉label配置即可
|
||||
text: "可以同时支持文字",
|
||||
font_size: 20,
|
||||
color: "#ffffff",
|
||||
outline: true,
|
||||
outlineColor: "#000000",
|
||||
pixelOffsetY: -20
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
console.log("标绘完成", graphic.toJSON())
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.mars3d-container{
|
||||
width:100%;
|
||||
height:100%;
|
||||
background:red;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,133 @@
|
|||
<template>
|
||||
<div class="search-div">
|
||||
<a-input class="search-input" v-model:value="searchInput" placeholder="搜索">
|
||||
<template #suffix>
|
||||
<div class="search-icon" @click="search"></div>
|
||||
</template>
|
||||
</a-input>
|
||||
</div>
|
||||
<div class="setting-table-title-div">
|
||||
<div class="table-title-item" style="width: 29px;">
|
||||
</div>
|
||||
<div class="table-title-item" style="width: 121px;">
|
||||
设备名称
|
||||
</div>
|
||||
<div class="table-title-item" style="width: 121px;border-right: 0px;">设备型号</div>
|
||||
</div>
|
||||
<div class="setting-table-item" v-for="item in props.deviceList">
|
||||
<div class="table-item-col" style="width: 29px;">
|
||||
<a-checkbox class="item-check" :checked="getCheck(item.id)" @change="changeCheck(item)"></a-checkbox>
|
||||
</div>
|
||||
<div class="table-item-col" style="width: 121px;">
|
||||
{{ item.name }}
|
||||
<div class="user-icon" v-if="props.userId == item.id"></div>
|
||||
</div>
|
||||
<div class="table-item-col" style="width: 121px;">
|
||||
{{ item.account }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref, defineProps, defineEmits } from "vue"
|
||||
const props = defineProps(['project','deviceList','userId'])
|
||||
const emits = defineEmits(['searchDevice'])
|
||||
const searchInput = ref("")
|
||||
const search = () => {
|
||||
emits('searchDevice',searchInput.value)
|
||||
}
|
||||
const changeCheck = (item) => {
|
||||
console.log(item)
|
||||
if(props.project.deviceIds.find(device => device.id == item.id)){
|
||||
props.project.deviceIds = props.project.deviceIds.filter(device => device.id != item.id)
|
||||
}else{
|
||||
props.project.deviceIds.push(item)
|
||||
}
|
||||
}
|
||||
const getCheck = (id) => {
|
||||
return props.project.deviceIds.find(item => item.id == id)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.search-div{
|
||||
height: 30px;
|
||||
margin-bottom: 10px;
|
||||
.search-input{
|
||||
:deep(.ant-input){
|
||||
background: #17181F;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
background: #17181F;
|
||||
box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 0px 4px 0px rgba(58,87,232,0.48);
|
||||
border-radius: 2px;
|
||||
border: 1px solid #3B4154;
|
||||
color: #FFFFFF;
|
||||
.search-icon{
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
background-image: url('/public/projecthome/result_search_icon.png');
|
||||
background-size: 100% 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
.setting-table-title-div{
|
||||
display: flex;
|
||||
height: 30px;
|
||||
background: #2D3342;
|
||||
border-radius: 2px 2px 0px 0px;
|
||||
border-top: 1px solid #444B5F;
|
||||
border-left: 1px solid #444B5F;
|
||||
border-right: 1px solid #444B5F;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
color: #FFFFFF;
|
||||
line-height: 18px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
.table-title-item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-right: 1px solid #444B5F;
|
||||
.sort-icon{
|
||||
width: 11px;
|
||||
height: 14px;
|
||||
background-image: url('/public/projecthome/table_sort_icon.png');
|
||||
background-size: 100% 100%;
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.setting-table-item{
|
||||
display: flex;
|
||||
height: 35px;
|
||||
border-bottom: 1px solid #444B5F ;
|
||||
border-left: 1px solid #444B5F ;
|
||||
border-right: 1px solid #444B5F ;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
color: #FFFFFF;
|
||||
line-height: 17px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
.table-item-col{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.user-icon{
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
background-image: url('/public/projecthome/user_icon.png');
|
||||
background-size: 100% 100%;
|
||||
margin-left: 3px;
|
||||
}
|
||||
.item-check{
|
||||
:deep(.ant-checkbox-inner){
|
||||
background-color: #17181F;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,124 @@
|
|||
<template>
|
||||
<div class="setting-item">
|
||||
<div class="setting-label-div">
|
||||
<div class="setting-label">机场自动录制</div>
|
||||
<div class="hint"></div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<a-switch class="setting-switch" v-model:checked="props.project.isAirportRecord" />
|
||||
</div>
|
||||
</div>
|
||||
<p class="tip">开启后，该项目内所选设备将自动开启直播录制，录制文件可以在媒体库「自动录制回放」文件夹中查看。 </p>
|
||||
<div class="setting-item">
|
||||
<div class="setting-label-div">
|
||||
<div class="setting-label"> 飞行器自动录制(遥控器接入) </div>
|
||||
<div class="hint"></div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<a-switch class="setting-switch" v-model:checked="props.project.isAircraftRecord" />
|
||||
</div>
|
||||
</div>
|
||||
<p class="tip"> 开启后，该项目内遥控器接入的飞行器在线后将自动录制，录制文件可以在媒体库「自动录制回放」文件夹中查看。 </p>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineProps, defineEmits, ref } from "vue"
|
||||
const props = defineProps(['project'])
|
||||
const emits = defineEmits([])
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.hint{
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
background-image: url('/public/projecthome/hint.png');
|
||||
background-size: 100% 100%;
|
||||
margin-left: 6px;
|
||||
}
|
||||
.tip{
|
||||
font-family: 'PingFangSC-Medium';
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
color: #fff;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.setting-item{
|
||||
height: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: 'PingFangSC-Medium';
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
color: #FFFFFF;
|
||||
line-height: 18px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
margin-bottom: 10px;
|
||||
.setting-label-div{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.setting-value-div{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
.arrow-icon{
|
||||
width: 8px;
|
||||
height: 12px;
|
||||
background-image: url('/public/projecthome/arrow_icon.png');
|
||||
background-size: 100% 100%;
|
||||
margin-left: 8px;
|
||||
}
|
||||
.setting-switch{
|
||||
min-width: 40px;
|
||||
width: 40px;
|
||||
height: 21px;
|
||||
background: #ccc;
|
||||
}
|
||||
:deep(.ant-switch-checked){
|
||||
background: #2941B0;
|
||||
}
|
||||
.setting-number-input{
|
||||
min-width: 40px;
|
||||
width: 40px !important;
|
||||
height: 30px;
|
||||
background: #151823;
|
||||
box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
|
||||
border-radius: 2px;
|
||||
border: 1px solid #3B4154;
|
||||
color: #FFFFFF;
|
||||
line-height: 18px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.setting-weather-select{
|
||||
:deep(.ant-select-selector){
|
||||
background-color: #151823;
|
||||
border: 1px solid #3B4154;
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
:deep(.ant-select-selection-item){
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
:deep(input){
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
:deep(input::placeholder){
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,151 @@
|
|||
<template>
|
||||
<p class="tip">开启后，用户可在组织管理页面，通过项目ID和申请码加入此项目。
|
||||
通过此方法加入项目的用户在项目中为项目成员，在组织中为组织临时成员。
|
||||
</p>
|
||||
<div class="setting-item">
|
||||
<div class="setting-label-div">
|
||||
<div class="setting-label">申请码加入</div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<a-switch class="setting-switch" v-model:checked="props.project.isAllowRequestCode" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="setting-title" v-if="props.project.isAllowRequestCode">
|
||||
<div class="setting-title-content">申请码</div>
|
||||
</div>
|
||||
<div class="setting-name-input-div" v-if="props.project.isAllowRequestCode">
|
||||
<a-input class="setting-name-input" :disabled="disable" v-model:value="props.project.requestCode" />
|
||||
</div>
|
||||
<div class="setting-title" v-if="props.project.isAllowRequestCode">
|
||||
<div class="setting-title-content">截止时间</div>
|
||||
</div>
|
||||
<div class="setting-name-input-div" v-if="props.project.isAllowRequestCode">
|
||||
<a-date-picker class="setting-date" :disabled="disable" v-model:value="props.project.requestCodeCutOffTime" :allowClear="false" show-time placeholder="请选择日期" />
|
||||
</div>
|
||||
<div class="button-div" v-if="props.project.isAllowRequestCode">
|
||||
<a-button v-if="disable" class="button-item" style="margin-right: 15px;" type="primary" @click="openChange(false)">编辑</a-button>
|
||||
<a-button v-if="disable" class="button-item" type="primary">复制申请码</a-button>
|
||||
<a-button v-if="!disable" class="button-item" style="margin-right: 15px;background: #6b6b6b;" type="primary" @click="openChange(true)">取消</a-button>
|
||||
<a-button v-if="!disable" class="button-item" type="primary" @click="openChange(true)">确定</a-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineProps, defineEmits, ref } from "vue"
|
||||
const props = defineProps(['project'])
|
||||
const emits = defineEmits([])
|
||||
|
||||
const disable = ref(true)
|
||||
const openChange = (type) => {
|
||||
disable.value = type
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.tip{
|
||||
font-family: 'PingFangSC-Medium';
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
color: #fff;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.setting-item{
|
||||
height: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: 'PingFangSC-Medium';
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
color: #FFFFFF;
|
||||
line-height: 18px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
margin-bottom: 10px;
|
||||
.setting-label-div{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.setting-value-div{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
.arrow-icon{
|
||||
width: 8px;
|
||||
height: 12px;
|
||||
background-image: url('/public/projecthome/arrow_icon.png');
|
||||
background-size: 100% 100%;
|
||||
margin-left: 8px;
|
||||
}
|
||||
.setting-switch{
|
||||
min-width: 40px;
|
||||
width: 40px;
|
||||
height: 21px;
|
||||
background: #ccc;
|
||||
}
|
||||
:deep(.ant-switch-checked){
|
||||
background: #2941B0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.setting-title{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-family: 'PingFangSC-Medium';
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
margin-bottom: 9px;
|
||||
line-height: 20px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
.setting-title-content{
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.setting-name-input-div{
|
||||
margin-bottom: 13px;
|
||||
.setting-name-input{
|
||||
height: 30px;
|
||||
background: #151823;
|
||||
box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
|
||||
border-radius: 2px;
|
||||
border: 1px solid #3B4154;
|
||||
color: #FFFFFF;
|
||||
line-height: 18px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
.setting-date{
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
background: #151823;
|
||||
box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
|
||||
border-radius: 2px;
|
||||
border: 1px solid #3B4154;
|
||||
:deep(input){
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
:deep(input::placeholder){
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.button-div{
|
||||
display: flex;
|
||||
.button-item{
|
||||
background: #3A57E8;
|
||||
border-radius: 4px;
|
||||
font-family: 'PingFangSC-Medium';
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
color: #FFFFFF;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,128 @@
|
|||
<template>
|
||||
<div class="setting-item">
|
||||
<div class="setting-label-div">
|
||||
<div class="setting-label">直播分享</div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<a-switch class="setting-switch" v-model:checked="props.project.isLiveShare" />
|
||||
</div>
|
||||
</div>
|
||||
<p class="tip"> 开启后，该项目将使用直播分享，项目成员可将直播二维码分享出去，非组织项目成员或没有DJI账号者均可通过二维码查看直播。
|
||||
<br/>
|
||||
关闭后，该项目不使用直播分享。
|
||||
</p>
|
||||
<div class="setting-item">
|
||||
<div class="setting-label-div">
|
||||
<div class="setting-label">媒体分享</div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<a-switch class="setting-switch" v-model:checked="props.project.isMediaShare" />
|
||||
</div>
|
||||
</div>
|
||||
<p class="tip"> 开启后，该项目将使用媒体分享，项目成员可将直播二维码分享出去，非组织项目成员或没有DJI账号者均可通过二维码查看媒体。
|
||||
<br/>
|
||||
关闭后，该项目不使用媒体分享。
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineProps, defineEmits, ref } from "vue"
|
||||
const props = defineProps(['project'])
|
||||
const emits = defineEmits([])
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.hint{
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
background-image: url('/public/projecthome/hint.png');
|
||||
background-size: 100% 100%;
|
||||
margin-left: 6px;
|
||||
}
|
||||
.tip{
|
||||
font-family: 'PingFangSC-Medium';
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
color: #fff;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.setting-item{
|
||||
height: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: 'PingFangSC-Medium';
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
color: #FFFFFF;
|
||||
line-height: 18px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
margin-bottom: 10px;
|
||||
.setting-label-div{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.setting-value-div{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
.arrow-icon{
|
||||
width: 8px;
|
||||
height: 12px;
|
||||
background-image: url('/public/projecthome/arrow_icon.png');
|
||||
background-size: 100% 100%;
|
||||
margin-left: 8px;
|
||||
}
|
||||
.setting-switch{
|
||||
min-width: 40px;
|
||||
width: 40px;
|
||||
height: 21px;
|
||||
background: #ccc;
|
||||
}
|
||||
:deep(.ant-switch-checked){
|
||||
background: #2941B0;
|
||||
}
|
||||
.setting-number-input{
|
||||
min-width: 40px;
|
||||
width: 40px !important;
|
||||
height: 30px;
|
||||
background: #151823;
|
||||
box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
|
||||
border-radius: 2px;
|
||||
border: 1px solid #3B4154;
|
||||
color: #FFFFFF;
|
||||
line-height: 18px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.setting-weather-select{
|
||||
:deep(.ant-select-selector){
|
||||
background-color: #151823;
|
||||
border: 1px solid #3B4154;
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
:deep(.ant-select-selection-item){
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
:deep(input){
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
:deep(input::placeholder){
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,133 @@
|
|||
<template>
|
||||
<div class="search-div">
|
||||
<a-input class="search-input" v-model:value="searchInput" placeholder="搜索">
|
||||
<template #suffix>
|
||||
<div class="search-icon" @click="search"></div>
|
||||
</template>
|
||||
</a-input>
|
||||
</div>
|
||||
<div class="setting-table-title-div">
|
||||
<div class="table-title-item" style="width: 29px;">
|
||||
</div>
|
||||
<div class="table-title-item" style="width: 121px;">
|
||||
人员名称
|
||||
</div>
|
||||
<div class="table-title-item" style="width: 121px;border-right: 0px;">成员账号</div>
|
||||
</div>
|
||||
<div class="setting-table-item" v-for="item in props.userList">
|
||||
<div class="table-item-col" style="width: 29px;">
|
||||
<a-checkbox class="item-check" :checked="getCheck(item.id)" @change="changeCheck(item)"></a-checkbox>
|
||||
</div>
|
||||
<div class="table-item-col" style="width: 121px;">
|
||||
{{ item.name }}
|
||||
<div class="user-icon" v-if="props.userId == item.id"></div>
|
||||
</div>
|
||||
<div class="table-item-col" style="width: 121px;">
|
||||
{{ item.account }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref, defineProps, defineEmits } from "vue"
|
||||
const props = defineProps(['project','userList','userId'])
|
||||
const emits = defineEmits(['searchUser'])
|
||||
const searchInput = ref("")
|
||||
const search = () => {
|
||||
emits('searchUser',searchInput.value)
|
||||
}
|
||||
const changeCheck = (item) => {
|
||||
console.log(item)
|
||||
if(props.project.userIds.find(userObj => userObj.id == item.id)){
|
||||
props.project.userIds = props.project.userIds.filter(userObj => userObj.id != item.id)
|
||||
}else{
|
||||
props.project.userIds.push(item)
|
||||
}
|
||||
}
|
||||
const getCheck = (id) => {
|
||||
return props.project.userIds.find(item => item.id == id)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.search-div{
|
||||
height: 30px;
|
||||
margin-bottom: 10px;
|
||||
.search-input{
|
||||
:deep(.ant-input){
|
||||
background: #17181F;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
background: #17181F;
|
||||
box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 0px 4px 0px rgba(58,87,232,0.48);
|
||||
border-radius: 2px;
|
||||
border: 1px solid #3B4154;
|
||||
color: #FFFFFF;
|
||||
.search-icon{
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
background-image: url('/public/projecthome/result_search_icon.png');
|
||||
background-size: 100% 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
.setting-table-title-div{
|
||||
display: flex;
|
||||
height: 30px;
|
||||
background: #2D3342;
|
||||
border-radius: 2px 2px 0px 0px;
|
||||
border-top: 1px solid #444B5F;
|
||||
border-left: 1px solid #444B5F;
|
||||
border-right: 1px solid #444B5F;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
color: #FFFFFF;
|
||||
line-height: 18px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
.table-title-item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-right: 1px solid #444B5F;
|
||||
.sort-icon{
|
||||
width: 11px;
|
||||
height: 14px;
|
||||
background-image: url('/public/projecthome/table_sort_icon.png');
|
||||
background-size: 100% 100%;
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.setting-table-item{
|
||||
display: flex;
|
||||
height: 35px;
|
||||
border-bottom: 1px solid #444B5F ;
|
||||
border-left: 1px solid #444B5F ;
|
||||
border-right: 1px solid #444B5F ;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
color: #FFFFFF;
|
||||
line-height: 17px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
.table-item-col{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.user-icon{
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
background-image: url('/public/projecthome/user_icon.png');
|
||||
background-size: 100% 100%;
|
||||
margin-left: 3px;
|
||||
}
|
||||
.item-check{
|
||||
:deep(.ant-checkbox-inner){
|
||||
background-color: #17181F;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,282 @@
|
|||
<template>
|
||||
<div class="setting-item">
|
||||
<div class="setting-label-div">
|
||||
<div class="setting-label">云端天气阻飞</div>
|
||||
<div class="hint"></div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<a-switch class="setting-switch" v-model:checked="props.project.isCloudBlockFlight" />
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="props.project.isCloudBlockFlight">
|
||||
<div class="setting-item">
|
||||
<div class="setting-label-div">
|
||||
<div class="setting-label">使用天气预报数据阻飞</div>
|
||||
<div class="hint"></div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<a-switch class="setting-switch" v-model:checked="props.project.isWeatherBlockFlight" />
|
||||
</div>
|
||||
</div>
|
||||
<div v-for="item in props.project.lockfly">
|
||||
<div class="setting-title">
|
||||
<div class="setting-title-content">{{item.name}}</div>
|
||||
</div>
|
||||
<div style="margin-bottom: 10px;">
|
||||
<div class="setting-item" style="margin-bottom: 0px;">
|
||||
<div class="setting-label-div">
|
||||
<div class="setting-label">风速</div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<template v-if="!isEdit">{{ item.windSpeed }}m/s</template>
|
||||
<template v-else>
|
||||
<a-input-number v-model:value="item.windSpeed" class="setting-number-input" :min="1" :max="12" :controls=false :precision="0"/>m/s
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<div class="weather-hint">(风速计)(1-12m/s)</div>
|
||||
</div>
|
||||
<div style="margin-bottom: 10px;" v-if="props.project.isWeatherBlockFlight">
|
||||
<div class="setting-item" style="margin-bottom: 0px;">
|
||||
<div class="setting-label-div">
|
||||
<div class="setting-label">风速</div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<template v-if="!isEdit">{{ item.weatherWindSpeed }}m/s</template>
|
||||
<template v-else>
|
||||
<a-input-number v-model:value="item.weatherWindSpeed" class="setting-number-input" :min="1" :max="12" :controls=false :precision="0"/>m/s
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<div class="weather-hint">(天气预报)(1-12m/s)</div>
|
||||
</div>
|
||||
<div style="margin-bottom: 20px;">
|
||||
<div class="setting-item" style="margin-bottom: 0px;">
|
||||
<div class="setting-label-div">
|
||||
<div class="setting-label">雨量</div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<template v-if="!isEdit"> {{ item.rainFall }}</template>
|
||||
<template v-else>
|
||||
<a-select
|
||||
class="setting-weather-select"
|
||||
popupClassName="setting-weather-dropdown"
|
||||
v-model:value="item.rainFall"
|
||||
:options="weatherOptions"/>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<div class="weather-hint">(雨量计/天气预报)</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="button-div">
|
||||
<a-button v-if="!isEdit" class="button-item" type="primary" @click="changeEdit(true,'')">编辑</a-button>
|
||||
<a-button v-if="isEdit" class="button-item" style="margin-right: 15px;background: #6b6b6b;" type="primary" @click="changeEdit(false,'cancel')">取消</a-button>
|
||||
<a-button v-if="isEdit" class="button-item" type="primary" @click="changeEdit(false,'save')">确定</a-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineProps, defineEmits, ref } from "vue"
|
||||
const props = defineProps(['project'])
|
||||
const emits = defineEmits([])
|
||||
const isEdit = ref(false)
|
||||
const oldValue = ref('')
|
||||
const weatherOptions = [
|
||||
{ label: '小雨', value: '小雨' },
|
||||
{ label: '中雨', value: '中雨' },
|
||||
{ label: '大雨', value: '大雨' }
|
||||
]
|
||||
|
||||
const changeEdit = (value,type) => {
|
||||
if(value){
|
||||
oldValue.value = JSON.stringify(props.project.lockfly)
|
||||
isEdit.value = value
|
||||
return
|
||||
}
|
||||
if(type == 'cancel'){
|
||||
props.project.lockfly = JSON.parse(oldValue.value)
|
||||
isEdit.value = value
|
||||
return
|
||||
}
|
||||
isEdit.value = value
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.hint{
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
background-image: url('/public/projecthome/hint.png');
|
||||
background-size: 100% 100%;
|
||||
margin-left: 6px;
|
||||
}
|
||||
.tip{
|
||||
font-family: 'PingFangSC-Medium';
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
color: #fff;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.setting-item{
|
||||
height: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: 'PingFangSC-Medium';
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
color: #FFFFFF;
|
||||
line-height: 18px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
margin-bottom: 10px;
|
||||
.setting-label-div{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.setting-value-div{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
.arrow-icon{
|
||||
width: 8px;
|
||||
height: 12px;
|
||||
background-image: url('/public/projecthome/arrow_icon.png');
|
||||
background-size: 100% 100%;
|
||||
margin-left: 8px;
|
||||
}
|
||||
.setting-switch{
|
||||
min-width: 40px;
|
||||
width: 40px;
|
||||
height: 21px;
|
||||
background: #ccc;
|
||||
}
|
||||
:deep(.ant-switch-checked){
|
||||
background: #2941B0;
|
||||
}
|
||||
.setting-number-input{
|
||||
min-width: 40px;
|
||||
width: 40px !important;
|
||||
height: 30px;
|
||||
background: #151823;
|
||||
box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
|
||||
border-radius: 2px;
|
||||
border: 1px solid #3B4154;
|
||||
color: #FFFFFF;
|
||||
line-height: 18px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.setting-weather-select{
|
||||
:deep(.ant-select-selector){
|
||||
background-color: #151823;
|
||||
border: 1px solid #3B4154;
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
:deep(.ant-select-selection-item){
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
:deep(input){
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
:deep(input::placeholder){
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.setting-title{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-family: 'PingFangSC-Medium';
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
margin-bottom: 9px;
|
||||
line-height: 20px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
.setting-title-content{
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
|
||||
.setting-name-input-div{
|
||||
margin-bottom: 13px;
|
||||
.setting-name-input{
|
||||
height: 30px;
|
||||
background: #151823;
|
||||
box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
|
||||
border-radius: 2px;
|
||||
border: 1px solid #3B4154;
|
||||
color: #FFFFFF;
|
||||
line-height: 18px;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
.setting-date{
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
background: #151823;
|
||||
box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
|
||||
border-radius: 2px;
|
||||
border: 1px solid #3B4154;
|
||||
:deep(input){
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
:deep(input::placeholder){
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.button-div{
|
||||
display: flex;
|
||||
.button-item{
|
||||
background: #3A57E8;
|
||||
border-radius: 4px;
|
||||
font-family: 'PingFangSC-Medium';
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
color: #FFFFFF;
|
||||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
}
|
||||
}
|
||||
.weather-hint{
|
||||
font-family: 'PingFangSC-Medium';
|
||||
font-size: 13px;
|
||||
color: #fff;
|
||||
opacity: 0.7;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.setting-weather-dropdown{
|
||||
background-color: #151823;
|
||||
color: #FFFFFF;
|
||||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
.ant-select-item{
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,23 +1,23 @@
|
|||
<template>
|
||||
<div class="add-project">
|
||||
<div :class="`add-project ${props.addModal? 'showModal': ''}`">
|
||||
<div class="title">
|
||||
<div class="title-span">项目设置</div>
|
||||
<div class="close-add-modal"></div>
|
||||
<div class="close-add-modal" @click="closeAddModal"></div>
|
||||
</div>
|
||||
<div class="add-project-interval"></div>
|
||||
<div class="add-project-content">
|
||||
<div class="add-project-title">
|
||||
<div class="require-mark">*</div>
|
||||
<div class="add-project-title-content">项目名称（项目ID:HERK3Q)</div>
|
||||
<div class="add-project-title-content">项目名称（项目ID:{{ project.id }})</div>
|
||||
</div>
|
||||
<div class="add-project-name-input-div">
|
||||
<a-input class="add-project-name-input" />
|
||||
<a-input class="add-project-name-input" v-model:value="project.workspaceName" />
|
||||
</div>
|
||||
<div class="add-project-title">
|
||||
<div class="add-project-title-content">项目简介</div>
|
||||
</div>
|
||||
<div class="add-project-info-div">
|
||||
<a-textarea class="add-project-info" :autoSize="false" />
|
||||
<a-textarea class="add-project-info" v-model:value="project.workspaceDesc" :autoSize="false" />
|
||||
</div>
|
||||
<div class="add-project-title" style="justify-content: space-between;margin-bottom: 7px;">
|
||||
<div style="display: flex;align-items: center;">
|
||||
|
|
@ -25,18 +25,22 @@
|
|||
<div class="add-project-title-content">项目作业中心点</div>
|
||||
<div class="hint"></div>
|
||||
</div>
|
||||
<div style="display: flex;align-items: center;">
|
||||
<div class="location-div" @click="getLocationCenter">
|
||||
<div class="location-icon"></div>
|
||||
<div class="location-span">设置项目中心点</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="lng-lat">经纬度：22.578074372° N113.909930055°E</div>
|
||||
<div class="lng-lat" v-if="project.centerLng && project.centerLat">经纬度：{{project.centerLat.toFixed(9)}}° N {{project.centerLng.toFixed(9)}}°E</div>
|
||||
<div class="setting-item">
|
||||
<div class="setting-label-div">
|
||||
<div class="setting-label">申请码加入项目</div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<div>已开启</div>
|
||||
<div v-if="props.modalType == 'insert'" class="setting-value-div setting-value-div-disable">
|
||||
<div>{{project.isAllowRequestCode? "已开启": "未开启"}}</div>
|
||||
<div class="arrow-icon"></div>
|
||||
</div>
|
||||
<div v-else class="setting-value-div" @click="openChildSetting('申请码加入项目')">
|
||||
<div>{{project.isAllowRequestCode? "已开启": "未开启"}}</div>
|
||||
<div class="arrow-icon"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -44,8 +48,8 @@
|
|||
<div class="setting-label-div">
|
||||
<div class="setting-label">天气阻飞设置</div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<div>已开启</div>
|
||||
<div class="setting-value-div" @click="openChildSetting('天气阻飞设置')">
|
||||
<div>{{project.isCloudBlockFlight? "已开启": "未开启"}}</div>
|
||||
<div class="arrow-icon"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -55,15 +59,19 @@
|
|||
<div class="hint"></div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<a-switch class="setting-switch" v-model:checked="checked" />
|
||||
<a-switch class="setting-switch" v-model:checked="project.isMultipleAircraft" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="setting-item">
|
||||
<div class="setting-label-div">
|
||||
<div class="setting-label">录制设置</div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<div>未开启</div>
|
||||
<div v-if="props.modalType == 'insert'" class="setting-value-div setting-value-div-disable">
|
||||
<div>{{(project.isAirportRecord || project.isAircraftRecord)? "已开启": "未开启"}}</div>
|
||||
<div class="arrow-icon"></div>
|
||||
</div>
|
||||
<div v-else class="setting-value-div" @click="openChildSetting('录制设置')">
|
||||
<div>{{(project.isAirportRecord || project.isAircraftRecord)? "已开启": "未开启"}}</div>
|
||||
<div class="arrow-icon"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -71,7 +79,7 @@
|
|||
<div class="setting-label-div">
|
||||
<div class="setting-label">分享设置</div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<div class="setting-value-div" @click="openChildSetting('分享设置')">
|
||||
<div class="arrow-icon"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -81,7 +89,7 @@
|
|||
<div class="hint"></div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<a-switch class="setting-switch" v-model:checked="checked" />
|
||||
<a-switch class="setting-switch" v-model:checked="project.isDeviceTrans" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="setting-item" style="margin-bottom: 12px;">
|
||||
|
|
@ -90,13 +98,13 @@
|
|||
<div class="hint"></div>
|
||||
</div>
|
||||
<div class="setting-value-div">
|
||||
<a-switch class="setting-switch" v-model:checked="checked" />
|
||||
<a-switch class="setting-switch" v-model:checked="project.isDeicePlaneTrans" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="setting-list-item" style="margin-bottom: 15px;">
|
||||
<div class="setting-list-title-div">
|
||||
<div class="setting-list-title">项目成员</div>
|
||||
<div class="setting-list-add">
|
||||
<div class="setting-list-add" @click="openChildSetting('项目成员')">
|
||||
<div class="add-icon"></div>
|
||||
添加成员
|
||||
</div>
|
||||
|
|
@ -112,25 +120,24 @@
|
|||
</div>
|
||||
<div class="table-title-item" style="width: 57px;border-right: 0px;">编辑</div>
|
||||
</div>
|
||||
<div class="setting-table-item">
|
||||
<div class="setting-table-item" v-for="item in project.userIds">
|
||||
<div class="table-item-col" style="width: 119px;padding-left: 12px; justify-content: start;">
|
||||
1
|
||||
<div class="user-icon"></div>
|
||||
{{ item.name }}
|
||||
<div class="user-icon" v-if="userId == item.id"></div>
|
||||
</div>
|
||||
<div class="table-item-col" style="width: 94px;">
|
||||
项目管理员
|
||||
<CaretDownOutlined />
|
||||
{{ item.role }}
|
||||
</div>
|
||||
<div class="table-item-col" style="width: 57px;">
|
||||
<div class="list-edit" style="margin-right: 7px;"></div>
|
||||
<div class="list-del list-del-disable"></div>
|
||||
<div v-if="userId == item.id" class="list-del list-del-disable"></div>
|
||||
<div v-else class="list-del" @click="delUser(item)"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="setting-list-item" style="margin-bottom: 15px;">
|
||||
<div class="setting-list-title-div">
|
||||
<div class="setting-list-title">项目设备</div>
|
||||
<div class="setting-list-add">
|
||||
<div class="setting-list-add" @click="openChildSetting('项目设备')">
|
||||
<div class="add-icon"></div>
|
||||
添加飞行器
|
||||
</div>
|
||||
|
|
@ -145,50 +152,295 @@
|
|||
</div>
|
||||
<div class="table-title-item" style="width: 57px;border-right: 0px;">编辑</div>
|
||||
</div>
|
||||
<div class="setting-table-item">
|
||||
<div class="setting-table-item" v-for="item in project.deviceIds">
|
||||
<div class="table-item-col" style="width: 119px;padding-left: 12px; justify-content: start;">
|
||||
M30T
|
||||
{{item.name}}
|
||||
<div class="time-icon"></div>
|
||||
</div>
|
||||
<div class="table-item-col" style="width: 94px;">
|
||||
M30T
|
||||
{{item.type}}
|
||||
</div>
|
||||
<div class="table-item-col" style="width: 57px;">
|
||||
<div class="list-edit" style="margin-right: 7px;"></div>
|
||||
<div class="list-del"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="setting-table-item">
|
||||
<div class="table-item-col" style="width: 119px;padding-left: 12px; justify-content: start;">
|
||||
M105
|
||||
<div class="time-icon"></div>
|
||||
</div>
|
||||
<div class="table-item-col" style="width: 94px;">
|
||||
M350 RTK
|
||||
</div>
|
||||
<div class="table-item-col" style="width: 57px;">
|
||||
<div class="list-edit" style="margin-right: 7px;"></div>
|
||||
<div class="list-del"></div>
|
||||
<div class="list-del" @click="delDevice(item)"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="save-button">完成</div>
|
||||
<div class="save-button" @click="saveProject">完成</div>
|
||||
<div :class="`child-setting ${childSetting.open? 'show-child-setting': ''}`">
|
||||
<div class="title">
|
||||
<div class="title-span">{{ childSettingTitle }}</div>
|
||||
<div class="close-add-modal" @click="closeChildSetting"></div>
|
||||
</div>
|
||||
<div class="add-project-interval"></div>
|
||||
<div class="add-project-content" style="max-height: calc(100% - 65px);">
|
||||
<RequestCode v-if="childSetting.type == '申请码加入项目'" :project="project"/>
|
||||
<Weather v-if="childSetting.type == '天气阻飞设置'" :project="project"/>
|
||||
<Record v-if="childSetting.type == '录制设置'" :project="project"/>
|
||||
<ShareSetting v-if="childSetting.type == '分享设置'" :project="project"/>
|
||||
<UserSetting v-if="childSetting.type == '项目成员'" :userId="userId" :project="project" :userList="userList" @searchUser="searchUser"/>
|
||||
<DeviceSetting v-if="childSetting.type == '项目设备'" :project="project" :deviceList="deviceList" @searchDevice="searchDevice"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from "vue"
|
||||
import { ref, defineProps, defineEmits, onMounted, watch } from "vue"
|
||||
import { CaretDownOutlined } from '@ant-design/icons-vue'
|
||||
import { getAccountList } from '@/api/demo/system';
|
||||
import { AddWorkspace } from '@/api/demo/projecthome'
|
||||
import RequestCode from './RequestCode/index.vue'
|
||||
import Weather from './Weather/index.vue'
|
||||
import Record from './Record/index.vue'
|
||||
import ShareSetting from './ShareSetting/index.vue'
|
||||
import UserSetting from './UserSetting/index.vue'
|
||||
import DeviceSetting from './DeviceSetting/index.vue'
|
||||
import { GetUavList } from '@/api/demo/projecthome'
|
||||
import { defaultPorject } from './utils'
|
||||
import * as mars3d from "mars3d";
|
||||
import * as Cesium from "mars3d-cesium"
|
||||
import cloneDeep from 'lodash/cloneDeep'
|
||||
import { message } from "ant-design-vue";
|
||||
|
||||
const checked = ref(false)
|
||||
const props = defineProps(['addModal', 'modalType','map'])
|
||||
const emits = defineEmits(['update:addModal'])
|
||||
|
||||
let graphicLayer
|
||||
watch(() => props.map, (val) => {
|
||||
if (val) {
|
||||
initGraphicLayer(val)
|
||||
}
|
||||
}, { immediate: true })
|
||||
function initGraphicLayer(map) {
|
||||
graphicLayer = new mars3d.layer.GraphicLayer()
|
||||
map.addLayer(graphicLayer)
|
||||
}
|
||||
|
||||
watch(() => props.addModal, (newValue) => {
|
||||
console.log('addModal',newValue,props.modalType,props.map)
|
||||
if(newValue && props.modalType == 'insert'){
|
||||
project.value = JSON.parse(JSON.stringify(defaultPorject))
|
||||
console.log('userId',userId)
|
||||
console.log('userId == -1',userId == -1)
|
||||
if(userId == -1){
|
||||
project.value.userIds.push({id:-1,name:'超级管理员',role:'超级管理员'})
|
||||
}else{
|
||||
let user = userList.value.find(item => item.id == userId)
|
||||
project.value.userIds.push(user)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const userId = localStorage.getItem('userid')
|
||||
const childSetting = ref({
|
||||
open: false,
|
||||
type: ''
|
||||
})
|
||||
const childSettingTitle = ref('')
|
||||
const project = ref({
|
||||
id: '',
|
||||
workspaceName: '',
|
||||
workspaceDesc: '',
|
||||
platformName: '',
|
||||
createTime: '',
|
||||
createId: '',
|
||||
bindCode: '',
|
||||
centerLng: '',
|
||||
centerLat: '',
|
||||
isAllowRequestCode: false,
|
||||
requestCode: '',
|
||||
requestCodeCutOffTime: '',
|
||||
isCloudBlockFlight: true,
|
||||
isWeatherBlockFlight: true,
|
||||
isMultipleAircraft: false,
|
||||
isAirportRecord: false,
|
||||
isAircraftRecord: false,
|
||||
isLiveShare: true,
|
||||
isMediaShare: true,
|
||||
isDeviceTrans: false,
|
||||
isDeicePlaneTrans: false,
|
||||
sate: 0,
|
||||
isDelete: true,
|
||||
lockfly:[
|
||||
{
|
||||
id: "",
|
||||
name: '大疆机场',
|
||||
windSpeed: 12,
|
||||
weatherWindSpeed: 15,
|
||||
rainFall: '大雨',
|
||||
workSpaceId: "",
|
||||
},
|
||||
{
|
||||
id: "",
|
||||
name: '大疆机场2',
|
||||
windSpeed: 8,
|
||||
weatherWindSpeed: 12,
|
||||
rainFall: '大雨',
|
||||
workSpaceId: "",
|
||||
},
|
||||
{
|
||||
id: "",
|
||||
name: '大疆机场3',
|
||||
windSpeed: 12,
|
||||
weatherWindSpeed: 12,
|
||||
rainFall: '大雨',
|
||||
workSpaceId: "",
|
||||
},
|
||||
],
|
||||
userIds:[],
|
||||
deviceIds:[],
|
||||
})
|
||||
const userList = ref([])
|
||||
const deviceList = ref([])
|
||||
|
||||
onMounted(() => {
|
||||
getAccountList({page:1,limit:999}).then(res => {
|
||||
userList.value = res.items
|
||||
if(userId == -1){
|
||||
project.value.userIds.push({id:-1,name:'超级管理员',role:'超级管理员'})
|
||||
return
|
||||
}
|
||||
let user = userList.value.find(item => item.id == userId)
|
||||
project.value.userIds.push(user)
|
||||
})
|
||||
GetUavList().then(res => {
|
||||
deviceList.value = res
|
||||
})
|
||||
})
|
||||
|
||||
const closeAddModal = () => {
|
||||
emits('update:addModal',false)
|
||||
}
|
||||
const closeChildSetting = () => {
|
||||
childSetting.value.open = false
|
||||
}
|
||||
const openChildSetting = (type) => {
|
||||
let time = 0
|
||||
if(childSetting.value.open){
|
||||
if(childSetting.value.type == type){
|
||||
childSetting.value.open = false
|
||||
return
|
||||
}else{
|
||||
childSetting.value.open = false
|
||||
time = 100
|
||||
}
|
||||
}
|
||||
setTimeout(() => {
|
||||
childSetting.value.type = type
|
||||
switch(type){
|
||||
case '申请码加入项目':
|
||||
childSettingTitle.value = '申请码加入项目'
|
||||
break
|
||||
case '天气阻飞设置':
|
||||
childSettingTitle.value = '以下设置只在当前项目生效'
|
||||
break
|
||||
case '录制设置':
|
||||
childSettingTitle.value = '项目录制设置'
|
||||
break
|
||||
case '分享设置':
|
||||
childSettingTitle.value = '项目分享设置'
|
||||
break
|
||||
case '项目成员':
|
||||
childSettingTitle.value = '添加成员'
|
||||
break
|
||||
case '项目设备':
|
||||
childSettingTitle.value = '添加飞行器'
|
||||
break
|
||||
}
|
||||
childSetting.value.open = true
|
||||
},time)
|
||||
}
|
||||
|
||||
const getLocationCenter = () => {
|
||||
const container = props.map.container
|
||||
container.style.cursor = "crosshair"
|
||||
props.map.on('click', (event) => {
|
||||
const cartesian = event.cartesian
|
||||
if (!cartesian) return
|
||||
const cartographic = Cesium.Cartographic.fromCartesian(cartesian)
|
||||
const lon = Cesium.Math.toDegrees(cartographic.longitude)
|
||||
const lat = Cesium.Math.toDegrees(cartographic.latitude)
|
||||
const height = cartographic.height
|
||||
const position = { lng: lon, lat }
|
||||
project.value.centerLng = lon
|
||||
project.value.centerLat = lat
|
||||
const pointGraphic = new mars3d.graphic.PointEntity({
|
||||
position: Cesium.Cartesian3.fromDegrees(lon, lat, height),
|
||||
style: {
|
||||
color: '#ff0000',
|
||||
pixelSize: 10,
|
||||
outlineColor: '#ffffff',
|
||||
outlineWidth: 2,
|
||||
label: {
|
||||
text: `经度: ${lon.toFixed(6)}\n纬度: ${lat.toFixed(6)}`,
|
||||
font_size: 16,
|
||||
color: '#000000',
|
||||
outline: true,
|
||||
outlineColor: '#ffffff',
|
||||
horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
|
||||
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||
pixelOffsetY: -20
|
||||
}
|
||||
}
|
||||
})
|
||||
graphicLayer.clear()
|
||||
graphicLayer.addGraphic(pointGraphic)
|
||||
})
|
||||
}
|
||||
const searchUser = (key: string) => {
|
||||
getAccountList({page:1,limit:999,key,}).then(res => {
|
||||
console.log(123123)
|
||||
userList.value = res.items
|
||||
})
|
||||
}
|
||||
const searchDevice = (key: string) => {
|
||||
GetUavList({key}).then(res => {
|
||||
deviceList.value = res
|
||||
})
|
||||
}
|
||||
const delUser = (item) => {
|
||||
project.value.userIds = project.value.userIds.filter(userObj => userObj.id != item.id)
|
||||
}
|
||||
const delDevice = (item) => {
|
||||
project.value.deviceIds = project.value.deviceIds.filter(device => device.id != item.id)
|
||||
}
|
||||
const saveProject = () => {
|
||||
let error = 0
|
||||
let errorMessage = ''
|
||||
if(!project.value.workspaceName){
|
||||
error++
|
||||
errorMessage = errorMessage + '项目名称不能为空; '
|
||||
}
|
||||
if(!project.value.centerLat || !project.value.centerLng){
|
||||
error++
|
||||
errorMessage = errorMessage + '项目作业中心点不能为空; '
|
||||
}
|
||||
if(error > 0){
|
||||
message.warning(errorMessage)
|
||||
return
|
||||
}
|
||||
// let params = cloneDeep(project.value)
|
||||
let result = {
|
||||
lasaWorkspace: project.value,
|
||||
userIds: project.value.userIds.map(item => item.id),
|
||||
deviceIds: project.value.deviceIds.map(item => item.id),
|
||||
lockfly: project.value.lockfly
|
||||
}
|
||||
AddWorkspace(result).then(res => {
|
||||
console.log(res)
|
||||
message.success('项目添加成功')
|
||||
childSetting.value.open = false
|
||||
emits('update:addModal',false)
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.add-project{
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 349px;
|
||||
left: 300px;
|
||||
width: 300px;
|
||||
height: 937px;
|
||||
max-height: calc(100vh - 144px);
|
||||
|
|
@ -197,6 +449,9 @@ const checked = ref(false)
|
|||
border-radius: 6px;
|
||||
backdrop-filter: blur(3px);
|
||||
padding: 10px 14px;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
transition: 0.2s;
|
||||
.hint{
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
|
|
@ -223,6 +478,7 @@ const checked = ref(false)
|
|||
height: 20px;
|
||||
background-image: url('/public/projecthome/close_button.png');
|
||||
background-size: 100% 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.add-project-interval{
|
||||
|
|
@ -260,6 +516,12 @@ const checked = ref(false)
|
|||
.add-project-title-content{
|
||||
color: #ffffff;
|
||||
}
|
||||
.location-div{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #0A99EB;
|
||||
transition: 0.2s;
|
||||
cursor: pointer;
|
||||
.location-icon{
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
|
|
@ -268,7 +530,10 @@ const checked = ref(false)
|
|||
margin-right: 4px;
|
||||
}
|
||||
.location-span{
|
||||
color: #0A99EB;
|
||||
}
|
||||
}
|
||||
.location-div:hover{
|
||||
color: #45a6df;
|
||||
}
|
||||
}
|
||||
.add-project-name-input-div{
|
||||
|
|
@ -332,6 +597,7 @@ const checked = ref(false)
|
|||
.setting-value-div{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
.arrow-icon{
|
||||
width: 8px;
|
||||
height: 12px;
|
||||
|
|
@ -349,6 +615,10 @@ const checked = ref(false)
|
|||
background: #2941B0;
|
||||
}
|
||||
}
|
||||
.setting-value-div-disable{
|
||||
opacity: 0.7;
|
||||
cursor: no-drop;
|
||||
}
|
||||
}
|
||||
.setting-list-item{
|
||||
.setting-list-title-div{
|
||||
|
|
@ -371,6 +641,7 @@ const checked = ref(false)
|
|||
font-family: 'PingFangSC-Regular';
|
||||
font-weight: 400;
|
||||
color: #3A57E8;
|
||||
cursor: pointer;
|
||||
.add-icon{
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
|
|
@ -449,6 +720,7 @@ const checked = ref(false)
|
|||
height: 16px;
|
||||
background-image: url('/public/projecthome/list_del.png');
|
||||
background-size: 100% 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
.list-del-disable{
|
||||
background-image: url('/public/projecthome/list_del_disable.png');
|
||||
|
|
@ -472,5 +744,33 @@ const checked = ref(false)
|
|||
text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
|
||||
cursor: pointer;
|
||||
}
|
||||
.child-setting{
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 250px;
|
||||
width: 300px;
|
||||
height: 937px;
|
||||
max-height: calc(100vh - 144px);
|
||||
background: rgba(13, 14, 21, 0.8);
|
||||
box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), inset 0px 0px 36px 0px rgba(58,87,232,0.73);
|
||||
border-radius: 6px;
|
||||
backdrop-filter: blur(3px);
|
||||
padding: 10px 14px;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
transition: 0.2s;
|
||||
z-index: 0;
|
||||
}
|
||||
.show-child-setting{
|
||||
left: 310px;
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
}
|
||||
}
|
||||
.showModal{
|
||||
left: 349px;
|
||||
pointer-events: auto;
|
||||
opacity: 1;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,53 @@
|
|||
export const defaultPorject = {
|
||||
id: '',
|
||||
workspaceName: '',
|
||||
workspaceDesc: '',
|
||||
platformName: '',
|
||||
createTime: '',
|
||||
createId: '',
|
||||
bindCode: '',
|
||||
centerLng: '',
|
||||
centerLat: '',
|
||||
isAllowRequestCode: false,
|
||||
requestCode: '',
|
||||
requestCodeCutOffTime: '',
|
||||
isCloudBlockFlight: true,
|
||||
isWeatherBlockFlight: true,
|
||||
isMultipleAircraft: false,
|
||||
isAirportRecord: false,
|
||||
isAircraftRecord: false,
|
||||
isLiveShare: true,
|
||||
isMediaShare: true,
|
||||
isDeviceTrans: false,
|
||||
isDeicePlaneTrans: false,
|
||||
sate: 0,
|
||||
isDelete: true,
|
||||
lockfly:[
|
||||
{
|
||||
id: "",
|
||||
name: '大疆机场',
|
||||
windSpeed: 12,
|
||||
weatherWindSpeed: 15,
|
||||
rainFall: '大雨',
|
||||
workSpaceId: "",
|
||||
},
|
||||
{
|
||||
id: "",
|
||||
name: '大疆机场2',
|
||||
windSpeed: 8,
|
||||
weatherWindSpeed: 12,
|
||||
rainFall: '大雨',
|
||||
workSpaceId: "",
|
||||
},
|
||||
{
|
||||
id: "",
|
||||
name: '大疆机场3',
|
||||
windSpeed: 12,
|
||||
weatherWindSpeed: 12,
|
||||
rainFall: '大雨',
|
||||
workSpaceId: "",
|
||||
},
|
||||
],
|
||||
userIds:[],
|
||||
deviceIds:[],
|
||||
}
|
||||
|
|
@ -35,16 +35,19 @@
|
|||
</div>
|
||||
</div>
|
||||
<!-- 添加项目组件 -->
|
||||
<AddProject />
|
||||
<AddProject v-model:addModal="addModal" :modalType="modalType" :map="props.map"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import AddProject from './AddProject/index.vue'
|
||||
import { ref } from "vue"
|
||||
import { ref, defineProps } from "vue"
|
||||
|
||||
const props = defineProps(['map'])
|
||||
const addModal = ref(false)
|
||||
const modalType = ref('')
|
||||
const addProject = () => {
|
||||
modalType.value = 'insert'
|
||||
addModal.value = true
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
<template>
|
||||
<div class="home-page">
|
||||
<div style="width: 100%;height: calc(100vh - 80px);">
|
||||
<Map />
|
||||
<Map @mapOnLoad="mapOnLoad"/>
|
||||
</div>
|
||||
<div ref="leftComponentRef" style="position: absolute;top: 0px;left: 0px;">
|
||||
<!-- 项目列表 -->
|
||||
<ProjectList />
|
||||
<ProjectList :map="map"/>
|
||||
<!-- 基本信息 -->
|
||||
<Info />
|
||||
</div>
|
||||
|
|
@ -19,7 +19,8 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Map from '@/views/demo/workmanagement/workplan/components/map.vue'
|
||||
// import Map from '@/views/demo/workmanagement/workplan/components/map.vue'
|
||||
import Map from './Map/index.vue'
|
||||
import ProjectList from './ProjectList/index.vue'
|
||||
import Info from './Info/index.vue'
|
||||
import Inspection from './Inspection/index.vue'
|
||||
|
|
@ -30,6 +31,7 @@ const DESIGN_WIDTH = 1912
|
|||
const DESIGN_HEIGHT = 962
|
||||
const leftComponentRef = ref<HTMLElement | null>(null)
|
||||
const rightComponentRef = ref<HTMLElement | null>(null)
|
||||
let map
|
||||
|
||||
function updateScale() {
|
||||
const scaleX = window.innerWidth / DESIGN_WIDTH
|
||||
|
|
@ -53,6 +55,9 @@ onMounted(() => {
|
|||
onBeforeUnmount(() => {
|
||||
window.removeEventListener('resize', updateScale)
|
||||
})
|
||||
const mapOnLoad = (value) => {
|
||||
map = value
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
|||
Loading…
Reference in New Issue