Skip to content

M
mmc-stl-vue2
提交 7fcd220c 作者: 翁进城
操作

feat: 飞控中心无人机应用无人机列表接入

上级 60781650
正在显示 包含 2463 行增加 和 194 行删除
src/components/MMCFlightControlCenter/api/modules/uav_control.js
......@@ -33,6 +33,7 @@ class Control_API {
static getUavTree(params) {
return request({
url: '/dms/uav/tree',
// url: '/crm/personalCenter/list?id=4',
method: 'get',
params
});
......
src/components/MMCFlightControlCenter/api/request_tg.js
......@@ -5,10 +5,11 @@ import router from '../router';
import store from '../store';
let prodUrl = 'https://tmj.mmcuav.cn';
let devUrl = 'https://test.tmj.mmcuav.cn'
let devUrl = 'https://test.tmj.mmcuav.cn/'
const $axios = axios.create({
// baseURL: process.env.VUE_APP_BASE_API_TG
// withCredentials: true
});
Vue.prototype.$http = axios;
......@@ -27,10 +28,12 @@ $axios.interceptors.request.use(
config.baseURL = prodUrl;
}
const token = localStorage.getItem('tmj_token');
const token = store.state.token;
if (token) {
config.headers['token'] = token;
config.headers['channel'] = 'channel'; // 渠道 主平台 子平台 后台
// config.headers['channel'] = 'channel'; // 渠道 主平台 子平台 后台
console.log('config', config)
config.params.token = token;
}
return config;
},
......@@ -65,11 +68,6 @@ $axios.interceptors.response.use(
return Promise.resolve(response.data);
case 401:
// resetMessage.error('登录失效');
store.commit('user/LOGIN_OUT');
router.replace({
path: '/login'
});
return Promise.reject(response);
case 403:
......
src/components/MMCFlightControlCenter/components/cesium-layer/index.vue
<template>
<div class="wih100 ht100 cpt-cesium_layerBox">
<div id="layer-container"></div>
<div id="layer-container" class="cpt-cesium_layer">
</div>
</template>
<script>
import { mapState, mapActions } from "vuex";
import { User } from "../../api";
import _3dList from "./lib/3d";
import _2dList from './lib/2d';
export default {
data() {
return {
......@@ -22,34 +24,17 @@ export default {
};
},
computed: {
...mapState([]),
...mapState('MMCFlightControlCenter', ['cesiumImagesLayers', 'cesium3DModels']),
...mapState(["mapMode"]),
},
watch: {
mapMode(newVal) {
switch (newVal) {
case 0:
this.imageryLayers.satellite.show = true;
this.imageryLayers.night.show = false;
// this.imageryLayers.text.show = true;
break;
case 1:
this.imageryLayers.satellite.show = false;
this.imageryLayers.night.show = true;
// this.imageryLayers.text.show = false;
break;
}
},
},
mounted() {
if (!window.$mmc) {
window.$mmc = {};
}
window.$mmc.viewer = {};
// this.get_user_position()//获取用户位置
this.init_viewer();
this.bus_getPositions();
},
methods: {
...mapActions([]),
......@@ -87,11 +72,13 @@ export default {
shouldAnimate: true,
homeButton: false,
fullscreenButton: false,
vrButton: false,
baseLayerPicker: false,
geocoder: true,
geocoder: false,
timeline: false,
sceneModePicker: true,
sceneModePicker: false,
navigationHelpButton: false,
navigationInstructionsInitiallyVisible: false,
infoBox: false,
requestRenderMode: true,
scene3DOnly: false,
......@@ -104,19 +91,64 @@ export default {
`layer-container`,
viewerOptions
);
// 卫星图
this.imageryLayers.satellite = this.viewer.imageryLayers.addImageryProvider(
new Cesium.UrlTemplateImageryProvider({
url: "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}",
maximumLevel: 18,
})
);
// 街道图
this.imageryLayers.street = this.viewer.imageryLayers.addImageryProvider(
new Cesium.UrlTemplateImageryProvider({
url:
"https://webrd01.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&lang=zh_cn&size=1&scale=1&style=8"
})
);
// 夜视图
this.imageryLayers.night = this.viewer.imageryLayers.addImageryProvider(
new Cesium.UrlTemplateImageryProvider({
url: "https://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineStreetPurplishBlue/MapServer/tile/{z}/{y}/{x}",
maximumLevel: 16,
})
);
// 地图标注
this.imageryLayers.text = this.viewer.imageryLayers.addImageryProvider(
new Cesium.WebMapTileServiceImageryProvider({
url:
"https://{s}.tianditu.gov.cn/cia_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&STYLE={style}&TILEMATRIXSET={TileMatrixSet}&FORMAT=tiles&TILEMATRIX={TileMatrix}&TILEROW={TileRow}&TILECOL={TileCol}&tk=a5e0a8dcf07f40afe19b76bf8a32eef0",
layer: "cia",
style: "default",
format: "tiles",
tileMatrixSetID: "c",
credit: new Cesium.Credit("天地图全球影像服务"),
tilingScheme: new Cesium.GeographicTilingScheme(), //采用经纬度投影
subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
tileMatrixLabels: [
"1",
"2",
"3",
"4",
"5",
"6",
"7",
"8",
"9",
"10",
"11",
"12",
"13",
"14",
"15",
"16",
"17",
"18"
],
maximumLevel: 18
})
)
this.imageryLayers.night.show = false;
this.imageryLayers.street.show = false;
this.viewer.scene.camera.flyTo({
destination: Cesium.Cartesian3.fromDegrees(
this.init_lng,
......@@ -125,11 +157,16 @@ export default {
),
});
this.$store.commit('MMCFlightControlCenter/setState', {
key: 'cesiumImagesLayers',
value: this.imageryLayers
})
// 加载三维倾斜
window._3d = [];
window.$mmc._3d = [];
/* const token =
'r0G6d8tdvfgN_Aad1j28SGqj6ILgt1DNHpP9dK-FNVOVBPgcyaHiEs2z2qyv455bTHU8QaFTbt_Y_AdeAsPp-Q..'; */
window.___s3m.forEach(async (item) => {
_3dList.forEach(async (item) => {
const obj = await this.viewer.scene.addS3MTilesLayerByScp(
`https://ct.mmcuav.cn:8443/iserver/services/${item}/rest/realspace/datas/Config/config`,
{
......@@ -137,15 +174,19 @@ export default {
// cullEnabled: false
}
);
window._3d.push(obj);
window.$mmc._3d.push(obj);
if (item === "3D-ZQ-JLH") {
// 肇庆九龙湖的模型需要修改海拔, 使其贴地
obj.style3D.bottomAltitude = -20;
}
});
this.$store.commit('MMCFlightControlCenter/setState', {
key: 'cesium3DModels',
value: window.$mmc._3d
})
// 二维影像缓存加载方式
window._2d = [];
window.$mmc._2d = [];
["3D-ZQ-DH", "3D-local3DCache-s3mb"].forEach((item) => {
this.viewer.scene
.open(
......@@ -157,7 +198,7 @@ export default {
}
)
.then((obj) => {
window._2d.push(obj);
window.$mmc._2d.push(obj);
});
});
......@@ -170,21 +211,6 @@ export default {
});
};
},
add_polyline(entities, data) {
return entities.add({
id: data.entity_id,
parent: data.parent || null,
polyline: {
positions: new Cesium.CallbackProperty(() => {
return data.positions;
}, false),
width: 5,
material: Cesium.Color.fromCssColorString("#6DD400"),
show: true,
...(data.options ? data.options : {}),
},
});
},
},
};
</script>
......@@ -193,25 +219,20 @@ export default {
.cesium_layerBox {
}
.cpt-cesium_layer_1 {
position: absolute;
.cpt-cesium_layer {
width: 100%;
height: 100%;
left: 0;
bottom: 0;
right: 0;
top: 0;
// #layer-container_1 {
// position: absolute;
// left: 0;
// bottom: 0;
// top: 0;
// right: 0;
// width: 100%;
// height: 100%;
// box-sizing: border-box;
// }
#layer-container {
}
::v-deep .cesium-viewer-bottom {
display: none;
}
::v-deep .cesium-viewer-zoomIndicatorContainer {
display: none;
}
}
.videoWallMapStyle {
......
src/components/MMCFlightControlCenter/components/cesium-layer/lib/2d.js 0 → 100644
export default["3D-ZQ-DH", "3D-local3DCache-s3mb"];
src/components/MMCFlightControlCenter/components/cesium-layer/lib/3d.js 0 → 100644
export default [
'3D-DH-LHZ',
'3D-FSJD',
'3D-HY-GXQ',
'3D-SX-TY',
'3D-SZ-SLSQ',
'3D-ZQYS',
'3D-SCYTS',
'3D-SZ-FT',
'3D-GZ',
'3D-SM',
'3D-ZQ-JLH',
'3D-DG-YJYAD'
];
src/components/MMCFlightControlCenter/components/cesium-layer/lib/s3m.js deleted 100644 → 0
switch (process.env.VUE_APP_ENV_TYPE) {
case "公网":
window.___s3m = [
"3D-DH-LHZ",
"3D-FSJD",
"3D-HY-GXQ",
"3D-SX-TY",
"3D-SZ-SLSQ",
"3D-ZQYS",
"3D-SCYTS",
"3D-SZ-FT",
"3D-GZ",
];
break;
default:
window.___s3m = [
"3D-9-1",
"3D-9-2",
"3D-9-3",
"3D-9-4",
"3D-9-4-bu",
// "3D-13-1",
// "3D-13-2",
"3D-LGZ-1",
"3D-XFZ",
"3D-XXZ-1-2",
"3D-XXZ-2-2",
"3D-XXZ-3-2",
"3D-YDZ",
// 永丰镇
"3D-YFZ-JM",
// 秦南镇
// 龙岗镇 JM
"3D-DGZ-JM-1",
"3D-DGZ-JM-2",
"3D-XXZ-3-3",
//数梦小镇
"3D-SMXZ",
//珠溪古镇
"3D-ZXGZ",
//先锋岛
"3D-XFD",
//金茂府周边
"3D-JMFZB",
//特警基地附近
"3D-TJJD",
// 2023年更新
"3D-YDZ",
"3D-QK15-2",
"3D-1619",
"3D-QK12",
"3D-QK14-6",
"3D-BCZ-2",
"3D-QK18-2",
"3D-dgz",
"3D-QK3",
"3D-QK5-S3MB",
"3D-QK10_11S3MB_2023",
"3D-YiQiQK10-2S3MB",
"3D-YiQiQK10-3-S3MB",
"3D-YiQiQK11-1S3MB",
"3D-YiQiQK11-2-S3MB",
"3D-YiQiQK11-3-S3MB",
"3D-QK1",
"3D-QK2",
"3D-QK6_2021_S3MB",
"3D-QK7_2021_S3MB",
"3D-QK8-2-S3MB",
"3D-QK8-5-S3MB",
"3D-QK9_S3MB",
// 粗模
"3D-_2_S3MB",
"3D-_1_S3MB_JM",
"3D-DZHZ-S3MB",
"3D-GW-S3MB",
"3D-LG-S3MB",
"3D-LW-S3MB",
// 南洋镇
"3D-NY-S3MB",
"3D-QN-S3MB",
"3D-SZ-S3MB",
"3D-XF-S3MB",
"3D-17S3MB",
"3D-QK8-3-S3MB",
"3D-QK8-4-S3MB",
"3D-QK13_S3M7",
"3D-BJ-S3MB-JM",
"3D-GM-S3MB-JM",
"3D-QK6-S3MB-JM",
"3D-QK7-S3MB-JM",
"3D-QK8-S3MB-JM",
"3D-YF-S3MB-JM",
"3D-ZZJD-S3MB-JM",
"3D-XX-S3MB-JM",
// 10-21 部署
"3D-QK4-X",
"3D-DZHDJQ",
"3D-BLGZ",
"3D-GWSQ-2",
"3D-NYZ",
"3D-LWZ-2",
"3D-DZH",
"3D-XFZ-4",
"3D-SZZ-2",
"3D-QK13_S3M"
];
break;
}
\ No newline at end of file
src/components/MMCFlightControlCenter/components/mapImageSwitch/index.vue 0 → 100644
<!-- 飞控地图选择 -->
<template>
<div class="cpt-hwkeys">
<div class="hwkeys-wrap cp" @click="change" @mouseout="likai">
<div :class="{
'hwkeys-item': 1,
'hwkeys-item-satellite': 1,
}" v-for="item in tabs" :key="item.id" v-show="item.id == current" @click="handle_change(item.id)">
<!-- <div class="typeNmae">{{ item.name }}</div> -->
</div>
</div>
<div class="changeMapBox pa cp">
<div class="dise" @mouseout="likai">
<div class="bai" :class="{ active: !is_3d }" v-show="!is_3d" @click="handle_change_3d(true)">
2D
</div>
<div class="bai" :class="{ active: is_3d }" v-show="is_3d" @click="handle_change_3d(false)">
3D
</div>
</div>
<div v-for="item in tabs" :key="item.id" class="dise" @mousemove="jinru(item.id)">
<div :class="{
'hwkeys-item': 1,
[item.class_name]: 1,
}" @click="handle_change(item.id)" style="position: relative; overflow: hidden">
<div class="zimu" :class="{ sh: numId == item.id + 1 }">
{{ item.name }}
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { mapState } from 'vuex';
export default {
components: { },
data() {
return {
numId: null, //鼠标悬浮效果
active: false,
is_3d: true,
current: 1,
tabs: [
{
id: 1,
name: "卫星",
class_name: "hwkeys-item-satellite",
},
{
id: 2,
name: "街道",
class_name: "hwkeys-item-street",
},
{
id: 3,
name: "夜景",
class_name: "hwkeys-item-night-blue",
},
],
};
},
computed: {
...mapState('MMCFlightControlCenter', ['cesiumImagesLayers', 'cesium3DModels']),
},
mounted() {
console.log('handle_change2')
setTimeout(() => {
this.handle_change(1);
this.handle_change_3d(false);
}, 3500);
},
watch: {
},
methods: {
// 鼠标悬浮效果
jinru(id) {
this.numId = id + 1;
},
likai() {
this.numId = null;
},
handle_change_3d(bool) {
this.is_3d = bool;
this.$store.dispatch('MMCFlightControlCenter/switch3DModelsShow', {show: bool})
},
handle_change(id) {
this.current = id;
if (id == 1) {
this.cesiumImagesLayers.street && (this.cesiumImagesLayers.street.show = false);
this.cesiumImagesLayers.satellite && (this.cesiumImagesLayers.satellite.show = true);
this.cesiumImagesLayers.night && (this.cesiumImagesLayers.night.show = false);
} else if (id == 2) {
this.cesiumImagesLayers.street && (this.cesiumImagesLayers.street.show = true);
this.cesiumImagesLayers.satellite && (this.cesiumImagesLayers.satellite.show = false);
this.cesiumImagesLayers.night && (this.cesiumImagesLayers.night.show = false);
} else {
this.cesiumImagesLayers.street && (this.cesiumImagesLayers.street.show = false);
this.cesiumImagesLayers.satellite && (this.cesiumImagesLayers.satellite.show = false);
this.cesiumImagesLayers.night && (this.cesiumImagesLayers.night.show = true);
}
console.log('this.cesiumImagesLayers', this.cesiumImagesLayers, id)
},
change() {
this.active = !this.active;
// global_leyers.forEach(promise => {
// promise.then((layer) =>{
// layer.visible = this.active;
// });
// })
// base_layer.BASIC && (base_layer.BASIC.show = !this.active)
// base_layer.SATELLITE && (base_layer.SATELLITE.show = this.active)
},
},
};
</script>
<style lang="scss" scoped>
.cpt-hwkeys {
z-index: 1;
bottom: 30px;
.changeMapBox {
position: absolute;
width: 201px;
height: 48px;
background: rgba(9, 32, 87, 0.7);
border: 1px solid #43deff;
left: -159px;
margin-top: 3px;
display: none;
justify-content: space-around;
align-items: center;
// display: flex;
.hwkeys-item {
width: 30px;
height: 30px;
color: #04d5da;
text-align: right;
line-height: 49px;
// margin-top: 5px;
border-radius: 4px;
font-size: 9px;
border: 1px solid #eee;
cursor: pointer;
}
.hwkeys-item-satellite {
background: url(./assets/images/3d.png) center no-repeat;
}
.hwkeys-item-street {
background: url(./assets/images/2d.png) center no-repeat;
}
.hwkeys-item-night-blue {
background: url(./assets/images/night-blue.png) center no-repeat;
}
.hwkeys-item-3d {
background: url(./assets/images/3d.png) center no-repeat;
}
.hwkeys-item-2d {
background: url(./assets/images/2d.png) center no-repeat;
}
}
position: absolute;
right: 14px;
width: 104px;
height: 78px;
transition: 0.2s;
transform: translateX(0);
&.wkeysRight {
transition: 0.3s;
transform: translateX(-12px);
right: 40px;
}
.hwkeys-wrap {
position: absolute;
right: 0;
min-width: 52px;
height: 52px;
border-radius: 2px;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
transition: width 0.25s;
&.active {
width: 166px;
}
.hwkeys-item {
width: 52px;
height: 52px;
box-sizing: border-box;
border-radius: 50%;
border: 3px solid #fff;
position: relative;
&.hwkeys-item-satellite {
// background: url(./assets/images/3d.png) center no-repeat;
background: url('./assets/images/ditu_icon.png') center no-repeat;
background-size: 112% 112%;
}
&.hwkeys-item-street {
background: url(./assets/images/2d.png) center no-repeat;
}
&.hwkeys-item-night-blue {
background: url(./assets/images/night-blue.png) center no-repeat;
// background-size: 115% 115%;
}
&.hwkeys-item-3d {
background: url(./assets/images/3d.png) center no-repeat;
}
&.hwkeys-item-2d {
background: url(./assets/images/2d.png) center no-repeat;
}
&.hwkeys-item-street {}
.typeNmae {
position: absolute;
bottom: 0;
right: 0;
z-index: 1;
height: 20px;
border: 1px solid #43ddfe;
box-shadow: inset 0 0 7px 0 #43ddfe;
border-radius: 1px;
font-size: 12px;
line-height: 20px;
text-align: center;
color: #04d5da;
}
}
}
.waterbox {
height: 48px;
width: 48px;
position: absolute;
top: 130px;
right: 0px;
border: 1px solid #04d5da;
background: rgba(22, 29, 45, 0.7);
color: #43deff;
font-size: 20px;
line-height: 48px;
}
.water_quality {
width: 459px;
height: 418px;
background: rgba(0, 23, 79, 0.7);
box-shadow: 0 2px 4px 0 rgba(1, 162, 255, 0.35),
inset 0 0 40px 0 rgba(0, 184, 255, 0.5);
border-radius: 13px;
}
}
.cpt-hwkeys:hover {
.changeMapBox {
display: flex;
}
}
.dise {
width: 34px;
height: 34px;
border-radius: 4px;
display: flex;
align-items: center;
justify-content: center;
background: #fff;
}
.bai {
text-align: center;
line-height: 30px;
font-size: 14px;
color: #ffffff !important;
font-weight: 700;
width: 30px;
height: 30px;
// border: 2px solid #fff;
border-radius: 4px;
// margin: 5px 0 0 0;
background: #000000;
cursor: pointer;
}
.zimu {
position: absolute;
left: 0;
bottom: 0;
height: 18px;
opacity: 0.64;
background: #fff;
border-radius: 0 0 4px 4px;
width: 100%;
text-align: center;
font-size: 12px;
font-family: MicrosoftYaHei;
color: #000;
line-height: 16px;
font-weight: 400;
display: none;
pointer-events: auto;
}
@keyframes fr {
from {
bottom: -60%;
}
to {
bottom: 0%;
}
}
.sh {
display: block;
animation: fr 1s linear;
animation-fill-mode: forwards;
pointer-events: auto;
}
.anniu {
width: 48px;
height: 48px;
background: #fff;
border-radius: 50%;
display: flex;
justify-content: center;
align-content: center;
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/dialog/index.vue 0 → 100644
<template>
<div class="cpt-nest-dialog">
<div class="dialog-ctx" :style="containerStyle" :class="{ collapse,changeHeightStyle }">
<div v-if="showTitle" class="dialog-title">
{{ title }}
<div class="nav__left">
<slot name="nav__left"></slot>
</div>
<div class="nav__right " @click='handleClose'>
<slot name="nav__right"></slot>
</div>
</div>
<div class="dialog-bd">
<slot></slot>
</div>
<img v-if="isCollapse" @click="collapse = !collapse" src="./assets/images/collapse.png"
class="icon-collapse" />
<div class="wih100 h24 pa bottom0 nest-dialog_bottom cp pt5 tc" @click='changeHeight'>
<div class="w24 h24 dib " :class="changeHeightStyle ? 'xbStyle':'' "> <img src="./assets/images/xb.png" alt=""> </div>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
title: {
type: String,
default: () => "",
},
showTitle: {
type: Boolean,
default: () => false,
},
containerStyle: {
type: Object,
default: () => ({}),
},
isCollapse: {
type: Boolean,
default: () => true,
},
isCollapse2: {
type: Boolean,
default: () => false,
}
},
data() {
return {
collapse: false,
changeHeightStyle: false
};
},
methods: {
changeHeight() {
this.changeHeightStyle = !this.changeHeightStyle
},
handleClose() {
this.$emit("close");
},
},
};
</script>
<style lang="scss" scoped>
.cpt-nest-dialog {
position: absolute;
width: 100%;
z-index: 99;
.nest-dialog_bottom {
background: rgba(13, 82, 143, 0.60);
}
.changeHeightStyle {
height: 637px !important;
}
.xbStyle{
transform:rotateX(141deg) ;
}
.dialog-ctx {
position: absolute;
width: 476px;
height: 648px;
background: rgba(9, 32, 87, 0.70);
border: 1px solid #70DAF9;
background-position: center;
background-repeat: no-repeat;
background-size: 100% 100%;
top: 90px;
left: 116px;
box-sizing: border-box;
display: flex;
flex-direction: column;
transform: translateY(0);
transition: 0.3s;
&.collapse {
transform: translateX(-100%);
}
.dialog-title {
width: 100%;
height: 32px;
line-height: 32px;
background-image: linear-gradient(180deg, #9198FF 0%, rgba(45, 81, 153, 0.22) 40%, #05091A 100%);
border: 1px solid #70DAF9;
box-shadow: inset 0 0 10px 2px #3F9DFF;
flex-shrink: 0;
margin: 0 auto;
background-size: 100% 100%;
color: #fff;
text-align: center;
font-family: Microsoft YaHei;
font-weight: bold;
font-size: 16px;
color: #92d9ff;
letter-spacing: 0;
text-align: center;
font-weight: 700;
position: relative;
.nav__right {
position: absolute;
right: 0;
top: 0;
bottom: 0;
}
}
.dialog-bd {
flex: 1;
box-sizing: border-box;
overflow: auto;
}
.icon-close {
position: absolute;
top: 15px;
right: 13px;
font-size: 18px;
color: #2edfff;
cursor: pointer;
&:hover {
opacity: 0.8;
}
}
.icon-collapse {
position: absolute;
right: -24px;
top: 50%;
transform: translateY(-50%);
height: 80px;
z-index: 1;
cursor: pointer;
}
}
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/fckernel/common/airway-edit/index.vue 0 → 100644
<template>
<div class="cpt-command-airway-edit">
<div class="header" v-interact>
<div class="hd-box">手动规划</div>
<div style="color: #08c2d1" class="hd-box cp">
<!-- <div @click="change_airway" v-if="isShow">
<span
class="iconfont"
:class="flag ? 'icon-shebeiliebiao' : 'icon-shebeiliebiao'"
></span>
<span class="ml5 mr5">{{ flag ? "鹰巢" : "无人机" }}</span>
<span
class="iconfont icon-shujushangchuan"
:class="flag ? 'icon-shujushangchuan' : 'icon-shujushangchuan'"
></span>
</div> -->
</div>
<div class="hd-box cp mr20" @click="exit">关闭</div>
</div>
<manual
:nestData="data"
v-if="visibleFlag"
:flag="flag"
@add="testEmit"
></manual>
<autoPlan v-if="!visibleFlag" :flag="flag" @add="testEmit"></autoPlan>
</div>
</template>
<script>
import autoPlan from "./autoPlan";
import manual from "./manual";
import dayjs from "dayjs";
let entitie = null;
export default {
components: {
autoPlan,
manual,
},
props: {
//为true是 规划航线为鹰巢
flag: {
type: Boolean,
default: false,
},
// 是否展示切换按钮
data: {
type: Object || Array,
default: () => {},
},
},
data() {
return {
// 手动规划还是自动规划
visibleFlag: true,
};
},
watch: {
data: {
handler(value) {
this.showAreaFn(value);
},
immediate: true,
deep: true,
},
},
beforeDestroy() {
window.viewer.entities.remove(entitie);
},
methods: {
showAreaFn(data) {
if (entitie) {
window.viewer.entities.remove(entitie);
}
let positions = Cesium.Cartesian3.fromDegrees(
Number(data.longitude),
Number(data.latitude),
0
);
let ellipse = {
semiMinorAxis: 2500,
material: Cesium.Color.fromCssColorString("#2f6947").withAlpha(0.7),
semiMajorAxis: 2500,
rotation: Cesium.Math.toRadians(-40.0),
outline: true,
outlineWidth: 4,
stRotation: Cesium.Math.toRadians(90),
};
let entities = this.createAreaPoint(window.viewer, {
id: "showArea" + data.id + "yc",
position: positions,
title: data.name,
ellipse,
});
entitie = entities;
},
createAreaPoint(viewer, { position, title, id, ellipse, longitude }) {
let point = viewer.entities.add({
id: id || null,
name: "pointArea",
position,
ellipse: ellipse,
longitude: longitude || null,
// label: {
// text: title,
// font: "14pt monospace",
// style: Cesium.LabelStyle.FILL_AND_OUTLINE,
// outlineWidth: 2,
// verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
// pixelOffset: new Cesium.Cartesian3(0.0, 32, 0.0),
// disableDepthTestDistance: Number.POSITIVE_INFINITY,
// },
});
return point;
},
exit() {
// 为false时为飞控中心创建航线
this.$emit("quit");
},
testEmit(item) {
this.$emit("add", item);
},
},
inject: ["g_cesium_layer"],
};
</script>
<style lang="scss" scoped>
@import "~@/styles/var.scss";
@import "~@/styles/mixins.scss";
.cpt-command-airway-edit {
position: absolute;
left: 100px;
top: 54px;
width: 560px;
box-sizing: border-box;
background: rgba(0, 23, 79, 0.7);
box-shadow: 0 2px 4px 0 rgba(1, 162, 255, 0.35),
inset 0 0 40px 0 rgba(0, 184, 255, 0.5);
border-radius: 13px;
z-index: 4;
.header {
display: flex;
justify-content: space-between;
align-items: center;
height: 44px;
background: rgba(16, 65, 215, 0.2);
box-shadow: inset 0 0 15px 0 rgba(0, 182, 255, 0.6);
border-radius: 10px 10px 0 0;
}
.hd-box {
font-family: MicrosoftYaHei-Bold;
font-size: 18px;
color: #00ffff;
letter-spacing: 0;
font-weight: 700;
margin-left: 20px;
}
.ctx-box {
height: calc(100% - 56px - 88px);
box-sizing: border-box;
padding: 25px 0px 0px 58px;
overflow: auto;
.form-box {
::v-deep .el-form {
.divider {
@include linear_gradient_border(0, auto, 0, 0);
height: 22px;
}
.el-form-item {
.item-group {
display: flex;
align-items: center;
.unit {
font-family: MicrosoftYaHeiUI;
font-size: 18px;
color: rgb(179, 201, 203);
font-weight: 400;
margin-left: 12px;
}
.iconfont {
color: rgb(179, 201, 203);
font-size: 30px;
margin-left: 0.3em;
cursor: pointer;
}
.el-icon-location-outline {
color: rgb(179, 201, 203);
font-size: 30px;
margin-left: 0.3em;
cursor: pointer;
}
}
.el-form-item__label {
font-family: Microsoft YaHei;
font-size: 16px;
color: #ccedff;
text-align: right;
font-weight: 400;
}
.el-input {
width: 356px;
height: 40px;
border: 1px solid #08c2d1;
.el-input__inner {
width: 100%;
border: none;
border-radius: 0;
background-color: #000000;
color: #fff;
}
}
.el-input-number {
width: 356px;
.el-input-number__decrease,
.el-input-number__increase {
bottom: 1px;
background: #606266;
color: #f5f7fa;
border-radius: 0;
border: none;
}
.el-input-number__decrease {
left: 1px;
}
.el-input-number__increase {
right: -1px;
}
}
}
}
}
}
.bottom-box {
box-sizing: border-box;
padding-bottom: 20px;
height: 88px;
display: flex;
justify-content: space-evenly;
align-items: center;
@include linear_gradient_border(0, auto, 0, 0);
.iconfont {
cursor: pointer;
font-size: 44px;
color: #08c2d1;
}
}
}
</style>
<style lang="scss">
.actions-box {
.title-box {
display: flex;
align-items: center;
.title {
font-size: 14px;
width: 70px;
}
}
.list-box {
max-height: 210px;
overflow: auto;
margin-top: 12px;
.action-item {
background-color: #ececec;
display: flex;
align-items: center;
justify-content: space-between;
border-top: 1px solid #fff;
box-sizing: border-box;
padding: 12px;
&:hover {
background-color: #ccc;
}
.item-inner {
display: flex;
align-items: center;
}
.iconfont {
color: red;
cursor: pointer;
font-size: 20px;
}
}
}
}
</style>
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/fckernel/common/dialog.vue 0 → 100644
<template>
<div class="cpt-nest-dialog">
<div class="dialog-ctx" :style="containerStyle" :class="{ collapse,changeHeightStyle }">
<div v-if="showTitle" class="dialog-title">
{{ title }}
<div class="nav__left">
<slot name="nav__left"></slot>
</div>
<div class="nav__right " @click='handleClose'>
<slot name="nav__right"></slot>
</div>
</div>
<div class="dialog-bd">
<slot></slot>
</div>
<img v-if="isCollapse" @click="collapse = !collapse" src="~@/assets/images/observe/fckernel/collapse.png"
class="icon-collapse" />
<div class="wih100 h24 pa bottom0 nest-dialog_bottom cp pt5 tc" @click='changeHeight'>
<div class="w24 h24 dib " :class="changeHeightStyle ? 'xbStyle':'' "> <img src="~@/assets/images/observe/fckernel/xb.png" alt=""> </div>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
title: {
type: String,
default: () => "",
},
showTitle: {
type: Boolean,
default: () => false,
},
containerStyle: {
type: Object,
default: () => ({}),
},
isCollapse: {
type: Boolean,
default: () => true,
},
isCollapse2: {
type: Boolean,
default: () => false,
}
},
data() {
return {
collapse: false,
changeHeightStyle: false
};
},
methods: {
changeHeight() {
this.changeHeightStyle = !this.changeHeightStyle
},
handleClose() {
this.$emit("close");
},
},
};
</script>
<style lang="scss" scoped>
.cpt-nest-dialog {
position: absolute;
width: 100%;
z-index: 99;
.nest-dialog_bottom {
background: rgba(13, 82, 143, 0.60);
}
.changeHeightStyle {
height: 637px !important;
}
.xbStyle{
transform:rotateX(141deg) ;
}
.dialog-ctx {
position: absolute;
width: 476px;
height: 648px;
background: rgba(9, 32, 87, 0.70);
border: 1px solid #70DAF9;
background-position: center;
background-repeat: no-repeat;
background-size: 100% 100%;
top: 90px;
left: 116px;
box-sizing: border-box;
display: flex;
flex-direction: column;
transform: translateY(0);
transition: 0.3s;
&.collapse {
transform: translateX(-100%);
}
.dialog-title {
width: 100%;
height: 32px;
line-height: 32px;
background-image: linear-gradient(180deg, #9198FF 0%, rgba(45, 81, 153, 0.22) 40%, #05091A 100%);
border: 1px solid #70DAF9;
box-shadow: inset 0 0 10px 2px #3F9DFF;
flex-shrink: 0;
margin: 0 auto;
background-size: 100% 100%;
color: #fff;
text-align: center;
font-family: Microsoft YaHei;
font-weight: bold;
font-size: 16px;
color: #92d9ff;
letter-spacing: 0;
text-align: center;
font-weight: 700;
position: relative;
.nav__left {
position: absolute;
left: 0;
top: 0;
bottom: 0;
}
.nav__right {
position: absolute;
right: 0;
top: 0;
bottom: 0;
}
}
.dialog-bd {
flex: 1;
box-sizing: border-box;
overflow: auto;
}
.icon-close {
position: absolute;
top: 15px;
right: 13px;
font-size: 18px;
color: #2edfff;
cursor: pointer;
&:hover {
opacity: 0.8;
}
}
.icon-collapse {
position: absolute;
right: -24px;
top: 50%;
transform: translateY(-50%);
height: 80px;
z-index: 1;
cursor: pointer;
}
}
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/fckernel/common/symbol-icon.vue 0 → 100644
<template>
<svg class="symbol-svg-icon" aria-hidden="true">
<use :xlink:href="iconName"></use>
</svg>
</template>
<script>
import "@/assets/fonts/ali/iconfont.js";
export default {
name: "symbol-icon",
props: {
icon: {
type: String,
required: true,
},
},
computed: {
iconName() {
return `#icon-${this.icon}`;
},
},
};
</script>
<style>
.symbol-svg-icon {
width: 28px;
height: 28px;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/fckernel/header/index.vue 0 → 100644
<!-- 飞控中心头部 -->
<template>
<div class="cpt-fckernel-header">
<div class="title">飞控中心</div>
<div class="nav-list"
@click="go_home">
<div class="nav-item"
v-for="(item, index) in list"
:key="item.id"
:class="`${index <= list.length / 2 - 1 ? '_1' : '_2'} ${
curr_val === item.id ? 'selected' : undefined
}`"
@click.stop="handle_change_nav(item)">
<div class="text-box">{{ item.label }}</div>
</div>
</div>
<div class="date-box">
<div class="yyyy">{{ date}}</div>
<div class="week-box">
<div class="week">{{ week }}</div>
<div class="hhmm">{{ time }}</div>
</div>
</div>
</div>
</template>
<script>
import dayjs from "dayjs";
export default {
props: {
value: {
type: Number | String,
default: 0,
},
},
data () {
return {
now: null,
curr_val: 0,
list: [
{ id: 1, label: "无人机应用" },
{ id: 2, label: "鹰巢应用" },
],
week_map: {
0: "天",
1: "一",
2: "二",
3: "三",
4: "四",
5: "五",
6: "六",
},
};
},
watch: {
value: {
handler (value) {
this.curr_val = value;
},
deep: true,
immediate: true,
},
},
methods: {
handle_change_nav (item) {
if(item.id==1){
this.$store.commit("device/SET_VIDEO", false);
}else{}
this.curr_val = item.id;
this.$emit("input", this.curr_val);
this.$emit("nav-click", item);
},
go_home () {
let { href } = this.$router.resolve({ path: "/home" });
window.open(href, "_self");
setTimeout(() => {
this.$router.go(0);
}, 100);
},
},
computed: {
date () {
let { now } = this;
return now ? `${now.format("YYYY/MM/DD")}` : "0000/00/00";
},
week () {
let { now, week_map } = this;
return now ? `周${week_map[now.day()]}` : "周N/A";
},
time () {
let { now } = this;
return now ? `${now.format("HH:mm")}` : "00:00";
},
},
mounted () {
setInterval(() => {
this.now = dayjs();
}, 500);
},
created () {
this.now = dayjs();
},
};
</script>
<style lang="scss" scoped>
.cpt-fckernel-header {
height: 91px;
background-color: black;
position: fixed;
top: 0;
left: 0;
right: 0;
background: center url("~@/assets/images/observe/fckernel/01_header_bg.png")
no-repeat;
background-size: cover;
.title {
font-size: 32px;
font-family: Microsoft YaHei;
font-weight: bold;
text-align: center;
line-height: 80px;
background-image: linear-gradient(0deg, #e3aa77, #f9ecd3, #e3aa77);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.nav-list {
width: 590px;
height: 77px;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
display: flex;
justify-content: space-between;
.nav-item {
width: 223px;
height: 77px;
box-sizing: border-box;
background: center url("~@/assets/images/observe/fckernel/nav-item.png")
no-repeat;
background-size: cover;
text-align: center;
cursor: pointer;
transition: 0.3s;
&:hover,
&.selected {
background: center
url("~@/assets/images/observe/fckernel/nav-item-selected.png")
no-repeat;
.text-box {
color: #3df1ff;
}
}
.text-box {
line-height: 77px;
font-family: Microsoft YaHei Bold;
font-size: 20px;
color: #aab8d1;
font-weight: 700;
transition: 0.3s;
}
&._2 {
transform: scaleX(-1);
.text-box {
transform: scaleX(-1);
}
}
}
}
.date-box {
display: flex;
flex-direction: column;
justify-content: center;
position: absolute;
left: 20px;
top: 0;
height: 60px;
box-sizing: border-box;
.yyyy {
font-family: Microsoft YaHei;
font-size: 16px;
color: #ffffff;
letter-spacing: 0;
font-weight: 400;
margin-bottom: 3px;
}
.week-box {
display: flex;
justify-content: space-between;
.week {
font-family: Microsoft YaHei;
font-size: 16px;
color: #ffffff;
letter-spacing: 0;
font-weight: 400;
}
.hhmm {
font-family: Microsoft YaHei;
font-size: 16px;
color: #ffffff;
letter-spacing: 0;
font-weight: 400;
}
}
}
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/fckernel/nest/control/components/box/index.vue 0 → 100644
<template>
<div class="nset_control_box">
<div class="nset_control_box_header lh34">
<slot name="nset__left" ></slot>
<slot name="nset__right" ></slot>
</div>
<div class="nset_control_box_area p10 pb30" :class="{changeHeightStyle}">
<slot></slot>
</div>
<div @click='changeHeight' class="wih100 h24 pa bottom0 cp nset_control_box_bottom tc">
<div class="w24 h24 dib " :class="changeHeightStyle ? 'xbStyle':'' "> <img
src="~@/assets/images/observe/fckernel/xb.png" alt=""> </div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
changeHeightStyle: false
}
},
methods: {
changeHeight() {
this.changeHeightStyle = !this.changeHeightStyle
},
},
}
</script>
<style lang="scss" scoped>
.nset_control_box {
min-height: 200px;
background: rgba(9, 32, 87, 0.70);
border: 1px solid #70DAF9;
position: absolute;
left: calc(50% - 352px);
top: 70px;
min-width: 700px;
.nset_control_box_header {
display: flex;
justify-content: space-between;
height: 32px;
background-image: linear-gradient(180deg, #9198FF 0%, rgba(45, 81, 153, 0.22) 40%, #05091A 100%);
border: 1px solid #70DAF9;
box-shadow: inset 0 0 10px 2px #3F9DFF;
}
.nset_control_box_bottom {
background: rgba(13, 82, 143, 0.60);
}
.xbStyle {
transform: rotateX(141deg);
}
.changeHeightStyle {
height: 300px;
}
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/fckernel/uav/control/components/notice/index.vue 0 → 100644
<template>
<div class="w440 h177 noticeBox">
<div class="headerBox" v-interact>
<div class=" jcsb">
<div class="jcsb title">
<div style="border:1px solid #FFBD36;background-color:#FFBD36 ; " class="w1 h16 mr10"></div>
{{ title }}
</div>
<div class="cp" @click="$emit('exit')" style="color: #70DAF9;">
关闭
</div>
</div>
</div>
<div class="contant pt34 ">
<div class="mb34 cf pl22 pr22">
{{ content }}
</div>
<div class="jcsb pl76 pr76">
<div class="w122 h32 tc lh32 cf cp btn" @click="$emit('close')">{{ leftText }}</div>
<div v-if="flag" class="w122 h32 tc lh32 cf cp btn ml10 mr10" @click="$emit('qzjg')">强制接管</div>
<div class="w122 h32 tc lh32 cf cp btn" @click="$emit('handle')">{{ rightText }}</div>
</div>
</div>
</div>
</template>
<script>
import API from "@/api";
export default {
data() {
return {
}
},
props: {
title: {
'type': String,
default: '提示'
},
content: {
'type': String,
default: '某某某某某某某某某某某某单位请求接管000000无人机无人机无人机'
},
leftText: {
'type': String,
default: '拒绝'
},
rightText: {
'type': String,
default: '同意'
},
flag:{
'type': Boolean,
default: ()=>{ false}
}
},
methods: {
},
}
</script>
<style lang="scss" scoped>
.noticeBox {
position: absolute;
left: 50%;
top: 40%;
transform: translateX(-50%);
z-index: 99;
background: rgba(9, 32, 87, 0.70);
border: 1px solid #70DAF9;
.headerBox {
background-image: linear-gradient(180deg, #9198FF 0%, rgba(45, 81, 153, 0.22) 40%, #05091A 100%);
border: 1px solid #70DAF9;
box-shadow: inset 0 0 10px 2px #3F9DFF;
padding: 5px 14px;
.title {
font-family: MicrosoftYaHei-Bold;
font-size: 16px;
color: #70DAF9;
letter-spacing: 0;
font-weight: 700;
}
}
.contant {
height: 146px;
text-align: center;
.btn {
background-image: linear-gradient(180deg, #9198FF 0%, rgba(45, 81, 153, 0.22) 40%, #05091A 100%);
border: 1px solid #70DAF9;
box-shadow: inset 0 0 10px 2px #3F9DFF;
}
}
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/item/assets/images/I.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="4px" height="8px" viewBox="0 0 4 8" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>路径</title>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="无人机应用" transform="translate(-235.000000, -394.000000)" fill="#FFFFFF" fill-rule="nonzero">
<g id="编组-8" transform="translate(24.000000, 177.000000)">
<g id="编组-56备份-2" transform="translate(48.000000, 213.000000)">
<g id="编组-4" transform="translate(158.000000, 2.000000)">
<g id="I" transform="translate(5.875000, 2.436523)">
<polygon id="路径" points="2.90039062 1.25488281 2.25097656 1.25488281 2.25097656 6.30859375 2.90039062 6.30859375 2.90039062 7.56347656 0 7.56347656 0 6.30859375 0.639648438 6.30859375 0.639648438 1.25488281 0 1.25488281 0 0 2.90039062 0"></polygon>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/item/assets/images/cq.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="4px" height="3px" viewBox="0 0 4 3" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 3</title>
<g id="城市之鹰APP" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="编组-3">
<g id="编组-53备份-2" transform="translate(1.000000, 1.000000)">
<rect id="矩形" x="0" y="-1.44822075e-13" width="2" height="1.69849126"></rect>
<g id="编组" transform="translate(0.090952, 0.212364)" fill-rule="nonzero">
<path d="M1.36360537,0.532745286 C1.63632645,0.532745286 1.81809504,0.616723904 1.81809504,0.829250299 C1.81809504,1.15466744 1.40744529,1.3630127 0.909047522,1.3630127 C0.410649758,1.3630127 0,1.15466744 0,0.829250299 C0,0.61574534 0.227244835,0.532745286 0.454489671,0.532745286 L0.545442149,0.532745286 L0.5431922,0.534880336 C0.533919684,0.543776376 0.496147815,0.577759249 0.454012409,0.592081873 C0.264198541,0.656311282 0.181768596,0.761818316 0.181768596,0.829250299 C0.181768596,0.962424018 0.503715825,1.12584427 0.909047522,1.12584427 C1.31437922,1.12584427 1.63632645,0.962424018 1.63632645,0.829250299 C1.63632645,0.762263118 1.55164655,0.656400242 1.36360537,0.592081873 C1.31499284,0.575446278 1.27265289,0.575446278 1.27265289,0.532745286 C1.27265289,0.490044295 1.3044249,0.532745286 1.36360537,0.532745286 Z" id="形状" fill="#FFFFFF"></path>
<polygon id="路径" fill="#FFBD36" transform="translate(0.909048, 0.371532) rotate(-180.000000) translate(-0.909048, -0.371532) " points="1.09061158 0.318467112 1.09061158 0 0.727210745 0 0.727210745 0.318467112 0.454489671 0.318467112 0.909047522 0.743063388 1.36360537 0.318467112"></polygon>
</g>
</g>
<path d="M3.36360537,0 C3.40942251,0 3.44733074,0.0799228627 3.45360333,0.183736876 C3.58682757,0.173023355 3.70805209,0.142918363 3.79859549,0.142918363 C3.87018477,0.142918363 4,0.168630812 4,0.214270409 C4,0.260017142 3.87018477,0.285729591 3.79859549,0.285729591 C3.70805209,0.285729591 3.58682757,0.255624598 3.45360333,0.244589672 C3.44773982,0.342189844 3.41405877,0.418470109 3.37205973,0.427683737 L3.36442354,0.428433683 L3.63632645,0.428540819 L3.45455785,0.714270409 L3.45455785,0.785729591 C3.45452631,0.897856976 3.34447243,0.991003701 3.2021545,0.999357189 L3.18170042,1 L3.0908843,1 L3.0908843,0.714163274 L2.54544215,0.714270409 C2.54544215,0.79312192 2.447808,0.857081637 2.32726529,0.857081637 L1.67273471,0.857081637 C1.552192,0.857081637 1.45455785,0.79312192 1.45455785,0.714270409 L0.909115702,0.714270409 L0.909115702,1 L0.818163224,1 C0.667543533,1 0.545442149,0.90406787 0.545442149,0.785729591 L0.545442149,0.714270409 L0.363673553,0.428540819 L0.635303743,0.428540819 L0.627940274,0.427683737 C0.585941229,0.418470109 0.552260176,0.342189844 0.546396673,0.244803943 C0.413308788,0.255517463 0.29194791,0.285729591 0.201404514,0.285729591 C0.129815231,0.285729591 0,0.260017142 0,0.214270409 C0,0.168630812 0.129815231,0.142918363 0.201404514,0.142918363 C0.29194791,0.142918363 0.413308788,0.173023355 0.546396673,0.183951146 C0.552669258,0.0799228627 0.590577487,0 0.636394627,0 C0.682211768,0 0.720119997,0.0799228627 0.726392582,0.183736876 C0.859616827,0.173023355 0.980841345,0.142918363 1.07138474,0.142918363 C1.14297402,0.142918363 1.27278925,0.168630812 1.27278925,0.214270409 C1.27278925,0.260017142 1.14297402,0.285729591 1.07138474,0.285729591 C0.980841345,0.285729591 0.859616827,0.255624598 0.726392582,0.244589672 C0.720529079,0.342189844 0.686848026,0.418470109 0.644848981,0.427683737 L0.637212791,0.428433683 L1.63632645,0.428433683 L1.63632645,0.392864795 C1.63632645,0.333695656 1.69737714,0.285729591 1.77268698,0.285729591 L2.22731302,0.285729591 C2.30262286,0.285729591 2.36367355,0.333695656 2.36367355,0.392864795 L2.36367355,0.428433683 L3.36251449,0.428433683 L3.35515102,0.427683737 C3.31315197,0.418470109 3.27947092,0.342189844 3.27360742,0.244803943 C3.14051953,0.255517463 3.01915866,0.285729591 2.92861526,0.285729591 C2.85702598,0.285729591 2.72721075,0.260017142 2.72721075,0.214270409 C2.72721075,0.168630812 2.85702598,0.142918363 2.92861526,0.142918363 C3.01915866,0.142918363 3.14051953,0.173023355 3.27360742,0.183951146 C3.27988,0.0799228627 3.31778823,0 3.36360537,0 Z" id="路径" fill="#FFFFFF"></path>
</g>
</g>
</svg>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/item/assets/images/goodsName_one.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="9px" height="18px" viewBox="0 0 9 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>一代</title>
<g id="无人机列表改" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="一代" transform="translate(0.000000, 0.000000)" fill="#43DEFF" fill-rule="nonzero">
<path d="M2.60526316,16.0632911 L2.60526316,1.90822785 C2.60526316,1.58544304 2.55098684,1.35759494 2.44243421,1.22468354 C2.33388158,1.09177215 2.14144737,1.01582278 1.86513158,0.996835443 L0,0.740506329 L0,0 C0.197368421,0.0569620253 2.26973684,0.085443038 6.21710526,0.085443038 C7.38157895,0.085443038 8.30921053,0.0569620253 9,0 L9,0.768987342 L7.13486842,1.02531646 C6.85855263,1.0443038 6.66611842,1.11075949 6.55756579,1.22468354 C6.44901316,1.33860759 6.39473684,1.5664557 6.39473684,1.90822785 L6.39473684,16.0632911 C6.39473684,16.4050633 6.44407895,16.6234177 6.54276316,16.7183544 C6.64144737,16.8132911 6.83881579,16.8702532 7.13486842,16.8892405 L9,17.0316456 L9,18 C8.60526316,17.9620253 8.03782895,17.9335443 7.29769737,17.914557 C6.55756579,17.8955696 5.625,17.8860759 4.5,17.8860759 C3.375,17.8860759 2.44243421,17.8955696 1.70230263,17.914557 C0.962171053,17.9335443 0.394736842,17.9620253 0,18 L0,17.0316456 L1.86513158,16.8892405 C2.16118421,16.8512658 2.35855263,16.7848101 2.45723684,16.6898734 C2.55592105,16.5949367 2.60526316,16.3860759 2.60526316,16.0632911 Z" id="路径"></path>
</g>
</g>
</svg>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/item/assets/images/goodsName_two.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>二代</title>
<g id="无人机列表改" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="二代" transform="translate(0.000000, 0.000000)" fill="#43DEFF" fill-rule="nonzero">
<g id="I备份-2">
<path d="M2.60526316,16.0632911 L2.60526316,1.90822785 C2.60526316,1.58544304 2.55098684,1.35759494 2.44243421,1.22468354 C2.33388158,1.09177215 2.14144737,1.01582278 1.86513158,0.996835443 L0,0.740506329 L0,0 C0.197368421,0.0569620253 2.26973684,0.085443038 6.21710526,0.085443038 C7.38157895,0.085443038 8.30921053,0.0569620253 9,0 L9,0.768987342 L7.13486842,1.02531646 C6.85855263,1.0443038 6.66611842,1.11075949 6.55756579,1.22468354 C6.44901316,1.33860759 6.39473684,1.5664557 6.39473684,1.90822785 L6.39473684,16.0632911 C6.39473684,16.4050633 6.44407895,16.6234177 6.54276316,16.7183544 C6.64144737,16.8132911 6.83881579,16.8702532 7.13486842,16.8892405 L9,17.0316456 L9,18 C8.60526316,17.9620253 8.03782895,17.9335443 7.29769737,17.914557 C6.55756579,17.8955696 5.625,17.8860759 4.5,17.8860759 C3.375,17.8860759 2.44243421,17.8955696 1.70230263,17.914557 C0.962171053,17.9335443 0.394736842,17.9620253 0,18 L0,17.0316456 L1.86513158,16.8892405 C2.16118421,16.8512658 2.35855263,16.7848101 2.45723684,16.6898734 C2.55592105,16.5949367 2.60526316,16.3860759 2.60526316,16.0632911 Z" id="路径"></path>
</g>
<g id="I备份-3" transform="translate(9.000000, 0.000000)">
<path d="M2.60526316,16.0632911 L2.60526316,1.90822785 C2.60526316,1.58544304 2.55098684,1.35759494 2.44243421,1.22468354 C2.33388158,1.09177215 2.14144737,1.01582278 1.86513158,0.996835443 L0,0.740506329 L0,0 C0.197368421,0.0569620253 2.26973684,0.085443038 6.21710526,0.085443038 C7.38157895,0.085443038 8.30921053,0.0569620253 9,0 L9,0.768987342 L7.13486842,1.02531646 C6.85855263,1.0443038 6.66611842,1.11075949 6.55756579,1.22468354 C6.44901316,1.33860759 6.39473684,1.5664557 6.39473684,1.90822785 L6.39473684,16.0632911 C6.39473684,16.4050633 6.44407895,16.6234177 6.54276316,16.7183544 C6.64144737,16.8132911 6.83881579,16.8702532 7.13486842,16.8892405 L9,17.0316456 L9,18 C8.60526316,17.9620253 8.03782895,17.9335443 7.29769737,17.914557 C6.55756579,17.8955696 5.625,17.8860759 4.5,17.8860759 C3.375,17.8860759 2.44243421,17.8955696 1.70230263,17.914557 C0.962171053,17.9335443 0.394736842,17.9620253 0,18 L0,17.0316456 L1.86513158,16.8892405 C2.16118421,16.8512658 2.35855263,16.7848101 2.45723684,16.6898734 C2.55592105,16.5949367 2.60526316,16.3860759 2.60526316,16.0632911 Z" id="路径"></path>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/item/assets/images/jieguan.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 12备份</title>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="接管中" transform="translate(-1267.000000, -201.000000)">
<g id="编组-25" transform="translate(641.000000, 172.000000)">
<g transform="translate(0.000000, -60.000000)" id="编组-12备份">
<g transform="translate(626.000000, 89.000000)">
<rect id="矩形" x="0" y="0" width="18" height="18"></rect>
<g id="编组" transform="translate(0.000000, 1.000000)" fill="#B3C9CB" fill-rule="nonzero">
<path d="M17.850016,13.5103629 C17.5788626,12.8481305 16.9357273,12.4165056 16.2228035,12.4182979 C15.7931026,12.4195874 15.3790797,12.5805555 15.0605089,12.8701869 L13.163344,11.763059 L13.163344,7.47764569 L9.47399584,5.33870477 L9.47399584,3.50102313 C10.3177515,3.28747031 10.8817508,2.48954009 10.8042077,1.61907713 C10.7266645,0.748614175 10.0305891,0.0639190733 9.16248966,0.00420007209 C8.29439023,-0.0555189291 7.51186606,0.527459147 7.31687937,1.37917401 C7.12189267,2.23088887 7.57230367,3.09860323 8.37918928,3.42570831 L8.37918928,5.33117328 L4.71233711,7.47764569 L4.71233711,11.6500868 L2.98764183,12.6818998 C2.40679718,12.1116776 1.51039599,12.0210201 0.82802338,12.4634868 C0.113289308,12.9100641 -0.1850107,13.8034942 0.117159798,14.5925747 C0.419330296,15.3816552 1.23683126,15.8440536 2.06530479,15.6944927 C2.89243426,15.5317097 3.48747791,14.8012523 3.48255439,13.9547203 C3.48992794,13.8670091 3.48992794,13.7788297 3.48255439,13.6911184 L5.21474835,12.6894313 L8.96408594,14.8810926 L12.6234394,12.7496832 L14.5206042,13.8492795 C14.4924107,13.9703061 14.4773257,14.094039 14.4756122,14.2183222 C14.4708638,14.9381924 14.9007044,15.5892294 15.5627925,15.8649668 C16.2248806,16.1407041 16.9872866,15.9861975 17.4911185,15.4741788 C17.9949504,14.96216 18.1398132,14.1946555 17.8575147,13.5329573 L17.850016,13.5103629 Z M11.5136355,7.81656238 L8.94908859,9.32285881 L6.36204565,7.81656238 L8.92659257,6.31026596 L11.5136355,7.81656238 Z M12.0460414,8.77306061 L12.0460414,11.7856535 L9.47399584,13.2919499 L9.47399584,10.279357 L12.0460414,8.77306061 Z" id="形状"></path>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/item/assets/images/uav_item2.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 65备份</title>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="无人机应用" transform="translate(-62.000000, -209.000000)" fill="#00B7FF">
<g id="编组-8" transform="translate(24.000000, 177.000000)">
<g id="编组-41" transform="translate(0.000000, 2.000000)">
<g id="编组-24" transform="translate(24.000000, 30.000000)">
<g id="编组-66" transform="translate(14.000000, 0.000000)">
<g id="站点地图,分级,组织,层级备份-2" fill-rule="nonzero">
<rect id="矩形" opacity="0" x="0" y="0" width="16" height="16"></rect>
<path d="M16,11.453125 L16,13.5 C16,14.328125 15.328125,15 14.5,15 L13,15 C12.171875,15 11.5,14.328125 11.5,13.5 L11.5,11.453125 C11.5,10.625 12.171875,9.953125 13,9.953125 C13.1375,9.953125 13.25,9.840625 13.25,9.703125 L13.25,8.5 C13.25,8.2234375 13.0265625,8 12.75,8 L3.25,8 C2.9734375,8 2.75,8.2234375 2.75,8.5 L2.75,9.703125 C2.75,9.840625 2.8625,9.953125 3,9.953125 C3.828125,9.953125 4.5,10.625 4.5,11.453125 L4.5,13.5 C4.5,14.328125 3.828125,15 3,15 L1.5,15 C0.671875,15 0,14.328125 0,13.5 L0,11.453125 C0,10.625 0.671875,9.953125 1.5,9.953125 C1.6375,9.953125 1.75,9.840625 1.75,9.703125 L1.75,8.5 C1.75,7.671875 2.421875,7 3.25,7 L7.25,7 C7.3875,7 7.5,6.8875 7.5,6.75 L7.5,6 L6,6 C5.171875,6 4.5,5.328125 4.5,4.5 L4.5,2.25 C4.5,1.421875 5.171875,0.75 6,0.75 L10,0.75 C10.828125,0.75 11.5,1.421875 11.5,2.25 L11.5,4.5 C11.5,5.328125 10.828125,6 10,6 L8.5,6 L8.5,6.75 C8.5,6.8875 8.6125,7 8.75,7 L12.75,7 C13.578125,7 14.25,7.671875 14.25,8.5 L14.25,9.703125 C14.25,9.840625 14.3625,9.953125 14.5,9.953125 C15.328125,9.953125 16,10.625 16,11.453125 Z" id="路径"></path>
</g>
<text id="2" font-family="PingFangSC-Semibold, PingFang SC" font-size="8" font-weight="500" line-spacing="8">
<tspan x="5.94444444" y="16">2</tspan>
</text>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/item/assets/images/uav_item3.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 65备份 5</title>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="无人机应用" transform="translate(-86.000000, -390.000000)" fill="#00B7FF">
<g id="编组-8" transform="translate(24.000000, 177.000000)">
<g id="编组-56备份-2" transform="translate(48.000000, 213.000000)">
<g id="编组-66" transform="translate(14.000000, 0.000000)">
<g id="站点地图,分级,组织,层级备份-2" fill-rule="nonzero">
<rect id="矩形" opacity="0" x="0" y="0" width="16" height="16"></rect>
<path d="M16,11.453125 L16,13.5 C16,14.328125 15.328125,15 14.5,15 L13,15 C12.171875,15 11.5,14.328125 11.5,13.5 L11.5,11.453125 C11.5,10.625 12.171875,9.953125 13,9.953125 C13.1375,9.953125 13.25,9.840625 13.25,9.703125 L13.25,8.5 C13.25,8.2234375 13.0265625,8 12.75,8 L3.25,8 C2.9734375,8 2.75,8.2234375 2.75,8.5 L2.75,9.703125 C2.75,9.840625 2.8625,9.953125 3,9.953125 C3.828125,9.953125 4.5,10.625 4.5,11.453125 L4.5,13.5 C4.5,14.328125 3.828125,15 3,15 L1.5,15 C0.671875,15 0,14.328125 0,13.5 L0,11.453125 C0,10.625 0.671875,9.953125 1.5,9.953125 C1.6375,9.953125 1.75,9.840625 1.75,9.703125 L1.75,8.5 C1.75,7.671875 2.421875,7 3.25,7 L7.25,7 C7.3875,7 7.5,6.8875 7.5,6.75 L7.5,6 L6,6 C5.171875,6 4.5,5.328125 4.5,4.5 L4.5,2.25 C4.5,1.421875 5.171875,0.75 6,0.75 L10,0.75 C10.828125,0.75 11.5,1.421875 11.5,2.25 L11.5,4.5 C11.5,5.328125 10.828125,6 10,6 L8.5,6 L8.5,6.75 C8.5,6.8875 8.6125,7 8.75,7 L12.75,7 C13.578125,7 14.25,7.671875 14.25,8.5 L14.25,9.703125 C14.25,9.840625 14.3625,9.953125 14.5,9.953125 C15.328125,9.953125 16,10.625 16,11.453125 Z" id="路径"></path>
</g>
<text id="3" font-family="PingFangSC-Semibold, PingFang SC" font-size="8" font-weight="500" line-spacing="8">
<tspan x="5.94444444" y="16">3</tspan>
</text>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/item/index.vue 0 → 100644
<template>
<div class="cpt-app-uav-list">
<div class="uav-item-box">
<div class="uav-item-inner" @click="$set(data, 'collapse', !data.collapse)">
<div class="title-box">
<span class="el-icon-caret-right" :class="{ collapse: data.collapse }"></span>
<img class="level-icon" src="./assets/images/uav_item1_1.png" v-if="level === 1" />
<img class="level-icon" src="./assets/images/uav_item2.svg" v-if="level === 2" />
<img class="level-icon" src="./assets/images/uav_item3.svg" v-if="level === 3" />
<div class="org-name" :title="data.name">{{ data.name }}</div>
<i class="refresh-icon el-icon-refresh-right" v-if="level === 1" @click.stop="$emit('refresh')" />
</div>
<div class="online-info">
（共 {{data.online + data.offline}} 架
<span
class="ml10"
:class="{ online: data.online }"
>{{ data.online }} 在线</span>
/
{{ data.offline }} 离线）
</div>
</div>
<div class="uav-item-child-box" :class="{ collapse: data.collapse }">
<Item v-for="child in data.childs" :key="child.id" :data="child" :level="level+1" />
<div
class="device-item-box"
:class="{ online: device.online == 1 }"
v-for="device in data.uavs"
:key="`device_${device.id}`"
>
<div class="device-name" >
<span style="margin-right:10px" :class="device.online==1&&device.currentOperator==1? 'blue' : device.online==1&&device.currentOperator!=1 ?'yellow':'' " :title="device.name">{{device.name}}</span>
<span style="color:#31DB24 " class="dib" v-if=" device.online == 1 ">(在线)</span>
<span v-else class="dib">(离线)</span>
<div class="symbol-icon-box">
<template v-if="device.modelName && device.modelName.includes('入云龙1')">
<div class="uav_version status-icon cp">
<img src="./assets/images/I.svg" />
</div>
</template>
<template v-if="device.modelName && device.modelName.includes('入云龙2')">
<div class="uav_version status-icon cp">
<img src="./assets/images/I.svg"/>
<img src="./assets/images/I.svg"/>
</div>
</template>
<template v-if="device.modelName && device.modelName.includes('插翅虎')">
<div class="uav_version status-icon cp">
<img src="./assets/images/cq.svg"/>
</div>
</template>
</div>
</div>
<div class="device-fns">
<div
class="iconfont icon-luxiang_xianxing"
:class="{ active: device.showPlayer }"
title="视频"
></div>
<div
v-if="device.online"
class="iconfont icon-kongzhi_xianxing"
:class="{ active: device.showPanel }"
title="控制面板"
></div>
<div
class="jieg"
title="接管无人机 "
v-if="device.online"
></div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: "Item",
data() {
return {
}
},
props: {
data: {
type: Object,
default: () => ({})
},
level: {
type: Number,
default: -1
}
},
inject: ["fn"],
};
</script>
<style lang="scss" scoped>
.cpt-app-uav-list {
.uav-item-box {
font-family: Microsoft YaHei;
font-size: 16px;
color: #b3bbc5;
font-weight: 400;
.uav-item-inner {
height: 30px;
display: flex;
align-items: center;
box-sizing: border-box;
cursor: pointer;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
display: flex;
justify-content: space-between;
align-items: center;
.title-box {
display: flex;
align-content: center;
align-items: center;
.el-icon-caret-right {
cursor: pointer;
transition: 0.3s;
transform-origin: center;
transform: rotate(90deg);
margin-right: 4px;
&.collapse {
transform: rotate(0deg);
}
}
.org-name {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 13px;
}
}
.online-info {
font-size: 12px;
white-space: nowrap;
.online {
color: #31db24;
}
}
}
.uav-item-child-box {
padding-left: 20px;
max-height: 20000px;
transition: 0.3s;
overflow: hidden;
position: relative;
&::before {
content: " ";
display: block;
height: 100%;
width: 1px;
background-color: #129c9c;
position: absolute;
left: 7px;
top: 0;
}
&.collapse {
max-height: 0;
}
.device-item-box {
height: 30px;
display: flex;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
transition: 0.2s;
.device-name {
display: flex;
align-items: center;
width: calc(100% - 150px);
white-space: nowrap;
text-overflow: ellipsis;
font-size: 13px;
}
&.online {
.device-name {
color: #00ffff;
}
}
.device-fns {
display: flex;
align-items: center;
justify-content: space-between;
.jieg {
width: 20px;
cursor: pointer;
height: 20px;
background: url("./assets/images/jieguan.svg") no-repeat;
background-size: 100% 100%;
}
.iconfont {
font-size: 24px;
margin-right: 8px;
cursor: pointer;
&.active {
color: #00ffff;
}
}
}
}
}
}
.goodsName_two{
background-image: url("./assets/images/goodsName_two.svg");
background-size: 100% 100%;
}
.goodsName_one{
background-image: url("./assets/images/goodsName_one.svg");
background-size: 100% 100%;
}
}
.green{
color:#31DB24
}
.red{
color:red
}
.item_items{
align-items: center;
}
.level-icon{
width: 16px;
margin-right: 6px;
}
.refresh-icon{
width: 16px;
margin-left: 34px;
}
.jcsb{
justify-content: left;
}
.status-icon{
margin-left: 12px;
font-size: 14px;
color: RGBA(251, 192, 1, 1);
}
.uav_version{
margin-top: 1px;
width: 14px;
height: 12px;
background: rgba(255, 255, 255, 0.4);
border-radius: 2px;
display: flex;
justify-content: center;
align-items: center;
}
.symbol-icon-box{
display: flex;
align-items: center;
img {
height: 8px;
}
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/components/search/index.vue 0 → 100644
<template>
<div class="uavSearch">
<el-input
:placeholder="placeholder"
:suffix-icon="icon"
v-model="input"
@input="searchFn"
clearable
>
</el-input>
</div>
</template>
<script>
export default {
data() {
return {
input: "",
};
},
props: {
placeholder: {
type: String,
default: "请输入内容",
},
icon: {
type: String,
default: "el-icon-search",
},
},
methods: {
searchFn() {
this.$emit("searchFn", this.input);
},
},
};
</script>
<style lang="scss" >
.uavSearch {
padding: 0 10px;
.el-input--suffix {
color: #6e9fbf;
.el-input__inner {
border: 1px solid #00b6ff;
box-shadow: 0 2px 4px 0 rgba(28, 94, 124, 0.5), inset 0 0 3px 0 #00b6ff;
background: transparent;
color: #6e9fbf;
border-radius: 6px;
height: 40px;
}
.el-icon-search:before {
color: #00f8f9;
}
}
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/components/list/index.vue 0 → 100644
<!-- 飞控中心无人机应slot -->
<template>
<div class="h700 list">
<template v-if="wsList && wsList.length">
<!-- <div class="all">全部</div> -->
<div class="pl10 pb30 pr8">
<Item
v-for="item in wsList"
:key="item.id"
:data="item"
:level="1"
@refresh="$emit('refresh')"
/>
</div>
</template>
</div>
<!-- </Dialog> -->
</template>
<script>
import Dialog from "./components/dialog";
import Item from "./components/item";
export default {
data() {
return {
components_start: true, //组件当前的状态
wsList: [],
num: 0,
};
},
props: {
containerStyle: {
type: String | Object,
default: () => ({}),
},
list: {
type: Array,
default: () => [],
},
},
components: { Dialog, Item },
watch: {
list: {
handler(val) {
this.wsList = val;
},
},
},
methods: {},
mounted() {
this.wsList = this.list;
},
provide() {
return {
fn: (...args) => this.$emit("fn", ...args),
};
},
};
</script>
<style lang="scss">
.list {
overflow-y: auto;
}
.cpt-observe-uav_list {
height: 100%;
box-sizing: border-box;
}
.nestlist {
background: rgba(4, 18, 50, 0.5);
}
.mountItem {
background: rgba(25, 42, 61, 0.5);
box-shadow: inset 0 0 38px 0 rgba(0, 219, 255, 0.71);
border-radius: 10px;
padding: 10px;
}
.wrjBtn {
background: rgba(6, 23, 56, 0.6);
border: 0 solid #00b6ff;
box-shadow: 1px 1px 2px 0 rgba(3, 16, 50, 0.5), inset 0 0 12px 0 #00b6ff;
border-radius: 3px;
}
.all {
margin-top: 10px;
text-indent: 1em;
background-image: linear-gradient(
270deg,
rgba(12, 134, 242, 0) 0%,
rgba(37, 151, 251, 0.62) 99%
);
width: 100px;
color: #a6caeb;
height: 20px;
border-radius: 4px;
}
.jz {
height: 100%;
display: flex;
align-items: center;
}
.mar {
margin: 0 0 0 5px;
color: #70daf9 !important;
font-weight: 700 !important;
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/components/uavList/index.vue 0 → 100644
<template>
<div class="uav-list" :class="{ collapse: collapseFlag }">
<img
@click="collapseFlagfn"
v-if="collapseFlag"
style="transform: rotate(180deg)"
src="./assets/images/hs.png"
class="icon-collapse uav-list_btn"
/>
<img
@click="collapseFlagfn"
v-else
src="./assets/images/collapse.png"
class="icon-collapse uav-list_btn"
/>
<div class="uav-list-header">
<img class="uav-list-header__icon" src="./assets/images/uav_list_header.png" />
<span class="uav-list-header__text">无人机列表</span>
</div>
<div class="uav-search">
<el-input
class="uav-search__input"
clearable
placeholder="请输入无人机名称/机构名称"
v-model="uavSearchContent"
v-on:keyup.enter.native="onUavSearch"
>
<i
slot="suffix"
class="el-input__icon el-icon-search"
style="color: rgba(123, 181, 213, 1)"
></i>
</el-input>
<el-button class="uav-search__btn" @click="onUavSearch">搜索</el-button>
</div>
<List
class="uav-list-main"
@exit
:containerStyle="{
width: '400PX',
height: '275px',
}"
:list="uavList"
@refresh="onUavSearch"
/>
<div></div>
</div>
</template>
<script>
import { Control_API } from "../../../../api";
import List from "./components/list";
import data from "./data.json";
export default {
components: {
List,
},
data() {
return {
uavList: [], // 无人机列表
collapseFlag: false, // 收起列表按钮
uavSearchContent: "", // 无人机搜索内容
};
},
mounted() {
// this.uavList = data.data;
this.initList();
},
methods: {
async initList() {
let res = await Control_API.getUavTree({ name: this.uavSearchContent });
this.uavList = res.data;
},
collapseFlagfn() {
this.collapseFlag = !this.collapseFlag;
},
/**
* 无人机搜索
*/
onUavSearch() {
this.initList();
},
},
};
</script>
<style lang="scss" scoped>
.collapse {
transform: translateX(-100%);
transition: 0.3s;
}
.uav-list {
display: flex;
flex-direction: column;
padding-bottom: 10px;
position: absolute;
width: 460px;
height: 85%;
left: 0;
top: 60px;
// height: 86vh;
z-index: 99;
transition: 0.3s;
background: rgba(9, 32, 87, 0.7);
border-radius: 10px 10px 0px 0px;
// border: 1px solid #70daf9;
.uav-list_btn {
position: absolute;
cursor: pointer;
right: -22px;
top: 50%;
transform: translate(0, -50%);
z-index: 99;
}
}
.uav-list-header {
flex-shrink: 0;
box-sizing: border-box;
display: flex;
align-items: center;
width: 460px;
height: 33px;
background: linear-gradient(
180deg,
#9198ff 0%,
rgba(45, 81, 153, 0.45) 40%,
#05091a 100%
);
box-shadow: inset 0px 0px 10px 2px #3f9dff;
border-radius: 10px 10px 0px 0px;
border: 1px solid #427dff;
.uav-list-header__text {
font-size: 20px;
font-family: YouSheBiaoTiHei;
color: #14faff;
line-height: 26px;
text-shadow: 0px 1px 1px rgba(2, 32, 56, 0.2);
background: linear-gradient(
135deg,
#f7b67d 38%,
#f9eacb 58%,
#f5d2a6 79%,
#f59743 100%
);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.uav-list-header__icon {
width: 26px;
margin-left: 9px;
}
}
::v-deep .uav-search {
flex-shrink: 0;
padding: 0 24px;
display: flex;
justify-content: space-between;
align-items: center;
// margin-bottom: 7px;
margin-top: 14px;
.uav-search__input {
width: 317px;
height: 32px;
box-shadow: 0px 2px 4px 0px rgba(28, 94, 124, 0.5),
inset 0px 0px 3px 0px #00b6ff;
border-radius: 4px;
.el-input__icon {
line-height: 32px;
}
input {
height: 32px;
background: #02173d;
color: #43deff;
border: 1px solid #315ec7;
&::placeholder {
font-size: 12px;
color: #7bb5d5;
}
}
}
.uav-search__btn {
padding: 7px 25px 6px 26px;
// background: rgba(38, 71, 238, 0.71);
background: url("./assets/images/twobg.png");
border-radius: 4px;
border: 1px solid;
font-size: 14px;
color: #fff;
}
}
.uav-list-main {
margin-top: 20px;
/* 滚动条整体样式 */
&::-webkit-scrollbar {
width: 10px; /* 滚动条宽度 */
}
/* 滚动条滑块样式 */
&::-webkit-scrollbar-thumb {
background-color: #02173d; /* 滑块颜色 */
}
/* 滚动条滑块悬停样式 */
&::-webkit-scrollbar-thumb:hover {
background-color: #112d5b; /* 悬停时滑块颜色 */
}
&::-webkit-scrollbar-track-piece {
/* background-color: #182F5C; */
}
&::-webkit-scrollbar-track {
background-color: #182f5c;
}
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/uavApplications/index.vue 0 → 100644
<template>
<div>
<uavList></uavList>
</div>
</template>
<script>
import uavList from './components/uavList';
export default {
components: {
uavList
}
}
</script>
<style>
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/index.vue
<template>
<div>
<CesiumLayout>
</CesiumLayout>
<div class="mmc-filght-control-center">
<!-- cesium地图层 -->
<cesiumLayout></cesiumLayout>
<!-- 地图切换组件 -->
<mapImageSwitch></mapImageSwitch>
<!-- 无人机应用 -->
<uavApplications></uavApplications>
</div>
</template>
<script>
import CesiumLayout from './components/cesium-layer';
import cesiumLayout from "./components/cesium-layer";
import mapImageSwitch from "./components/mapImageSwitch";
import uavApplications from './components/uavApplications';
export default {
name: 'MMCFlightControlCenter',
name: "MMCFlightControlCenter",
components: {
CesiumLayout
cesiumLayout,
mapImageSwitch,
uavApplications
},
props: {
devMode: { // 开发环境
type: Boolean,
default: false
},
token: {
type: String,
default: ''
}
},
created(){
this.$store.commit('MMCFlightControlCenter/setState', {
key: 'devMode',
value: this.devMode
})
this.$store.commit('MMCFlightControlCenter/setState', {
key: 'token',
value: this.token
})
}
}
};
</script>
<style>
<style scope="scss">
.mmc-filght-control-center {
overflow: hidden;
position: relative;
height: 100%;
width: 100%;
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/store/index.js
import uavApplications from "./uavApplications";
export default {
namespaced: true,
state: {
devMode: false, //开发模式, 使用开发环境接口
devMode: false, //开发模式, 使用开发环境接口
token: "", //登录token
cesiumImagesLayers: {
//cesium的地图图层
street: {
//街道影像
show: false,
},
satellite: {
//卫星影像
show: false,
},
night: {
//夜景影像
show: false,
},
text: {
// 地图标注
show: false,
},
},
cesium3DModels: [], //cesium的3D模型
},
mutations: {
/**
......@@ -18,6 +40,19 @@ export default {
}
},
},
actions: {
/**
* 切换3D模型展示
* @param {Object} param0
* @param {Object} data
* @param {Boolean} data.show是否展示
*/
switch3DModelsShow({ state }, data) {
state.cesium3DModels.forEach((layer) => {
layer.visible = data.show;
});
},
},
modules: {
uavApplications,
},
......
vue2/public/index.html
......@@ -6,6 +6,7 @@
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
<link rel="stylesheet" href="./cesium/Widgets/widgets.css">
<script src="./cesium/Cesium.js"></script>
<script src="./js/icontfont.js"></script>
<script type="text/javascript" src="./js/nipplejs.min.js"></script>
......
vue2/src/App.vue
......@@ -40,11 +40,17 @@
</template>
<script>
import store from '@/../../src/components/MMCFlightControlCenter/store';
export default {
name: 'App',
components: {
},
created(){
if(!this.$store.hasModule('MMCFlightControlCenter')){
this.$store.registerModule("MMCFlightControlCenter", store);
}
},
methods: {
onSelect(index){
this.$router.push({
......
vue2/src/views/fkzx/demo.vue
<template>
<div>
<div style="width: 1920px; height: 1080px;">
<div ref="el"></div>
</div>
</template>
......
vue2/src/views/fkzx1/demo.vue
<template>
<div>
<MMCFlightControlCenter></MMCFlightControlCenter>
<el-form>
<el-form-item label="账号">
<el-input v-model="account"></el-input>
</el-form-item>
<el-form-item label="密码">
<el-input v-model="password"></el-input>
</el-form-item>
<el-form-item label="token">{{ token }}</el-form-item>
<el-button @click="login">登录</el-button>
</el-form>
<MMCFlightControlCenter v-if="token" :token="token" :devMode="true"></MMCFlightControlCenter>
</div>
</template>
<script>
import { Base64 } from "js-base64"
export default {
name: "fkzx1",
data() {
return {};
return {
account: "mmctest@admin",
password: "test@Admin001",
token: "",
};
},
computed: {},
async mounted() {
async mounted() {},
methods: {
async login() {
let formData = new FormData();
formData.append("userAccount", this.account);
formData.append("password", Base64.encode(this.password));
let res1 = await fetch("/crm/login", {
method: "post",
headers: {
// "Content-Type": "multipart/form-data",
},
body: formData,
});
let data1 = await res1.json();
if (data1.code == 200) {
await fetch("/crm/user/platformPermission", {
method: "get",
headers: {
"Token": data1.data.token
},
})
this.token = data1.data.token;
}
},
},
methods: {},
};
</script>
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论