修复飞行模式切换后，gis得状态

.env.development

@@ -11,7 +11,7 @@ VITE_APP_CLIENT_SECRET = 'NjHifmmB41rH6bJTd4A7RA=='
 
 #程璐
 #VITE_APP_API_BASE_URL=http://192.168.12.117:9060/airport/
-VITE_APP_API_BASE_URL=  https://virtualplane-test.t-aaron.com
+VITE_APP_API_BASE_URL=  https://virtualplane-test.t-aaron.com/airport
 #VITE_APP_API_BASE_URL=https://airport-develop.t-aaron.com:3443
 # VUE_APP_API_BASE_URL=https://airport.t-aaron.com/airport/
 # VUE_APP_API_BASE_URL=https://airportdev.t-aaron.com/airport/
@@ -27,8 +27,4 @@ VITE_APP_AUTHORITY =https://login-test.t-aaron.com
 #令牌
 #VUE_APP_OUT_AUTHORITY = 'https://oidc-develop.t-aaron.com:3443'
 
-# 机场大屏跳转地址
-VITE_APP_ASURL =  'https://airport-screen-test.t-aaron.com'
 
-# 低空
-VITE_APP_BUSINESS ='http://192.168.14.12:8082'

src/App.vue

@@ -1,9 +1,6 @@
 <script setup>
-// import { RouterLink, RouterView, useRoute } from 'vue-router'
 // const { VITE_APP_AUTHORITY, VITE_APP_CLIENT_ID } = import.meta.env
 
-// const router = useRoute()
-
 // let t = setInterval(() => {
 //   if (router.query.access_token) {
 //     clearInterval(t)

src/apis/common.js

@@ -4,42 +4,42 @@ import axios from 'axios'
 //机场查询
 export function queryAirportApi(params) {
   return request({
-    url: `/api/airportStatus/index`,
+    url: `/api/airportStatus/index?airportId=${params.airportId}`,
     method: 'get',
-    params: params,
+    data: params,
   })
 }
-//无人机查询
+//无人机查询(暂时没用)
 export function queryDroneApi(params) {
   return request({
     url: `/api/drone/getDroneList`,
     method: 'get',
-    params: params,
+    data: params,
   })
 }
-//电池查询
+//电池查询(暂时没用)
 export function queryBatteryApi(params) {
   return request({
     url: `/api/batteryRecord/queryBatteryBaseInfoList`,
     method: 'get',
-    params: params,
+    data: params,
   })
 }
-//航线查询
+//航线查询(暂时没用)
 // api/airlineFile/getAirlineFileListByAirportId?airportId=67
 export function queryAirLineApi(params) {
   return request({
-    url: `api/airlineFile/getAirlineFileListByAirportId`,
+    url: `api/airlineFile/getAirlineFileListByAirportId?airportId=${params.airportId}`,
     method: 'get',
-    params: params,
+    data: params,
   })
 }
 //无人机飞前自检
 export function beforeCheckApi(params) {
   return request({
-    url: `/api/airportLog/virtualCockpit/progressBar`,
+    url: `/api/airportLog/virtualCockpit/progressBar?airportId=${params.airportId}&taskId=${params.taskId}`,
     method: 'get',
-    params: params,
+    data: params,
   })
 }
 //获取航线文件
@@ -96,7 +96,7 @@ export async function getAirWayPointsToJson2(url) {
     }
     arr.shift()
     arr.pop()
-    console.log(arr)
+    // console.log(arr)
 
     arr = arr.map((text) => {
       return text.split(/\s+/)
@@ -131,6 +131,6 @@ export function getweatherApi(params) {
   return request({
     url: `/api/airportLog/getCallback`,
     method: 'get',
-    params: params,
+    data: params,
   })
 }

src/main.js

@@ -40,21 +40,24 @@ if (!qiankunWindow.__POWERED_BY_QIANKUN__) {
   const queryParams = new URLSearchParams(window.location.search)
   const access_token = queryParams.get('access_token')
   const token_type = queryParams.get('token_type')
-  const airporId = queryParams.get('airporId')
+  const airporId = queryParams.get('airportId')
 
-  let oidcSession = {
-    access_token: access_token,
-    token_type: token_type,
-  }
-
-  oidcSession = JSON.stringify(oidcSession)
   window.iframe_AirPortID = airporId
-  sessionStorage.setItem(`oidc.user:${VITE_APP_AUTHORITY}:${VITE_APP_CLIENT_ID}`, oidcSession)
-  let access_token_str = `Bearer ${access_token}`
-  //设置token
-  localStorage.setItem('access_token', access_token_str)
-  sessionStorage.setItem('access_token', access_token_str)
 
+  if (access_token) {
+    let oidcSession = {
+      access_token: access_token,
+      token_type: token_type,
+    }
+
+    oidcSession = JSON.stringify(oidcSession)
+
+    sessionStorage.setItem(`oidc.user:${VITE_APP_AUTHORITY}:${VITE_APP_CLIENT_ID}`, oidcSession)
+    let access_token_str = `Bearer ${access_token}`
+    //设置token
+    localStorage.setItem('access_token', access_token_str)
+    sessionStorage.setItem('access_token', access_token_str)
+  }
   setupAll({ container: '#airapp' })
 
   //监听消息事件

src/router/index.js

@@ -7,9 +7,15 @@ const router = createRouter({
   routes: [
     {
       path: '/',
+      name: 'container',
+      component: () => import('../views/container/index.vue'),
+    },
+    {
+      path: '/plane',
       name: 'carbin',
       component: () => import('../views/carbin/index.vue'),
     },
+
     // {
     //   path: '/about',
     //   name: 'about',

src/utils/request/index.js

@@ -4,21 +4,19 @@ import router from '@/router'
 import { useSettingStore } from '@/stores/setting.js'
 
 // request是一个axios实例,每一个实例你都可以单独定制它的baseURL,超时时间,请求头和一些其他配置项。
-const baseUrl = import.meta.env.VITE_APP_API_BASE_URL + '/airport/admin' //接口统一域名
-// const baseUrl = '/airport/admin' //接口统一域名
-// const baseUrl = '/airport/admin'
-
+//const baseUrl = import.meta.env.VITE_APP_API_BASE_URL + 'airport/admin' //接口统一域名
+//const baseUrl = 'https://virtualplane-test.t-aaron.com/airport/admin' //接口统一域名
+const baseUrl = '/airport/admin'
 // 设置统一的url
 // axios.defaults.baseURL = '/airport/admin'
-
 const instance = axios.create({
   baseURL: baseUrl,
   timeout: 60 * 1000, //设置超时
-  headers: {
-    'Content-Type': 'application/json;charset=UTF-8;',
-    'Accept-Language': 'zh-CN,zh;q=0.9,en;q=0.8',
-    '.AspNetCore.Culture': 'c=zh-Hans|uic=zh-Hans',
-  },
+  // headers: {
+  // 'Content-Type': 'application/json;charset=UTF-8;',
+  // 'Accept-Language': 'zh-CN,zh;q=0.9,en;q=0.8',
+  // '.AspNetCore.Culture': 'c=zh-Hans|uic=zh-Hans',
+  // },
 })
 
 let loading
@@ -48,9 +46,8 @@ instance.interceptors.request.use(
   (config) => {
     // 每次发送请求之前判断是否存在token，如果存在，则统一在http请求的header都加上token，不用每次请求都手动添加了
     // const { token_type, access_token } = userInfo
-
     config.headers.Authorization = `${localStorage.getItem('access_token')}`
-    config.headers['Client-Id'] = import.meta.env.VITE_APP_CLIENT_ID
+    // config.headers['Client-Id'] = import.meta.env.VITE_APP_CLIENT_ID
     //若请求方式为post，则将data参数转为JSON字符串
     if (config.method === 'POST') {
       config.data = JSON.stringify(config.data)

src/views/carbin/components/flying.vue

@@ -24,8 +24,8 @@ const airPortSocketStore = useAirPortSocketStore()
 let size1Img = ref(new URL(`@/assets/icons/size1active.png`, import.meta.url).href)
 let size2Img = ref(new URL(`@/assets/icons/size2.png`, import.meta.url).href)
 let viewMode = ref(1) //1-1/4方式 2-对半方式
-let littleViewMode = ref(2) //1-舱外视频 2-舱内视频 3-无人机视频
-let littleViewModeName = ref('舱内画面')
+let littleViewMode = ref(1) //1-舱外视频 2-舱内视频 3-无人机视频
+let littleViewModeName = ref('舱外画面')
 
 import img_default from '@/assets/icons/state1.png'
 import img_touch from '@/assets/icons/state2.png'
@@ -43,7 +43,7 @@ let planeStateList = reactive({
     value: '0',
     touch: false,
     content: '爬升<br>速度',
-    unit: '/s',
+    unit: 'm/s',
   },
   hspeed: {
     id: 2,
@@ -52,7 +52,7 @@ let planeStateList = reactive({
     value: '0',
     touch: false,
     content: '平飞<br>速度',
-    unit: '/s',
+    unit: 'm/s',
   },
   distToHome: {
     id: 3,
@@ -174,7 +174,7 @@ const setCurrentData = (data) => {
     //飞行中
     littleViewMode.value = 1
     littleViewModeName.value = '舱外画面'
-    small_area_showType.value = 'video_in'
+    small_area_showType.value = 'video_out'
     //不允许再修改了
     isModifedSmallScreen.value = true
   }

src/views/carbin/index.vue

@@ -95,6 +95,23 @@ const switchViewFn = (viewPrecent) => {
   }
   sendGisMessage(params)
 }
+//gis底部工具栏得高度
+const changeGisToolHeight = () => {
+  let bottomPlane = document.getElementById('bottomPlane')
+  if (bottomPlane) {
+    //获取高度
+    let height = bottomPlane.clientHeight
+    let t = {
+      toolbarStartY: height,
+    }
+    sendGisMessage(t)
+  } else {
+    let t = {
+      toolbarStartY: 0,
+    }
+    sendGisMessage(t)
+  }
+}
 //底部切换小屏和大屏的视频
 const bottom_switchScreenVideo = (smallVideoType) => {
   big_area_showType.value = smallVideoType
@@ -105,11 +122,16 @@ const queryAirLine_AirPort = async () => {
   let params = {
     airportId: window.iframe_AirPortID, //67  1011
   }
+
   let res = await Promise.allSettled([queryAirportApi(params), queryAirLineApi(params)])
   // console.log(res)
   if (res[0].value.code == 0) {
     //机场
     currentAirPortInfo.value = res[0].value.data[0]
+    if (!currentAirPortInfo.value.online) {
+      //强制退出
+      // window.close()
+    }
     airPortSocketStore.ceurrentAirPortData = currentAirPortInfo.value
 
     airPortName.value = currentAirPortInfo.value.name
@@ -117,14 +139,17 @@ const queryAirLine_AirPort = async () => {
     //机场当前状态
     if (currentAirPortStatus.value != Number(currentAirPortInfo.value.status)) {
       currentAirPortStatus.value = Number(currentAirPortInfo.value.status)
-      console.log(
-        '现在的状态是:',
-        currentAirPortStatus.value,
-        statusList[currentAirPortStatus.value],
-      )
+      // console.log(
+      //   '现在的状态是:',
+      //   currentAirPortStatus.value,
+      //   statusList[currentAirPortStatus.value],
+      // )
 
       //机场当前状态
-      if (Number(currentAirPortInfo.value.status) == 2) {
+      if (
+        Number(currentAirPortInfo.value.status) == 2 ||
+        Number(currentAirPortInfo.value.status) == 3
+      ) {
         //飞行中 请求航线文件
         queryAirLine(currentAirPortInfo.value.fileUrl)
       } else {
@@ -185,32 +210,41 @@ const queryAirPort = async () => {
   let params = {
     airportId: window.iframe_AirPortID,
   }
+  // console.log(params)
 
   let res = await queryAirportApi(params)
   if (res.code == 0) {
     currentAirPortInfo.value = res.data[0]
+    if (!currentAirPortInfo.value.online) {
+      //强制退出
+      // window.close()
+    }
     airPortSocketStore.ceurrentAirPortData = currentAirPortInfo.value
+
     // console.log(currentAirPortInfo.value)
 
-    currentAirPortInfo.value.status = 2
+    // currentAirPortInfo.value.status = 1
 
     if (currentAirPortStatus.value != Number(currentAirPortInfo.value.status)) {
       currentAirPortStatus.value = Number(currentAirPortInfo.value.status)
-      console.log(
-        '现在的状态是:',
-        currentAirPortStatus.value,
-        statusList[currentAirPortStatus.value],
-      )
+      // console.log(
+      //   '现在的状态是:',
+      //   currentAirPortStatus.value,
+      //   statusList[currentAirPortStatus.value],
+      // )
 
       //机场当前状态
-      if (Number(currentAirPortInfo.value.status) == 2) {
+      if (
+        Number(currentAirPortInfo.value.status) == 2 ||
+        Number(currentAirPortInfo.value.status) == 3
+      ) {
         //飞行中 请求航线文件
         queryAirLine(currentAirPortInfo.value.fileUrl)
       }
 
       resetScreen()
     }
-    console.log('现在的状态是:', currentAirPortStatus.value, statusList[currentAirPortStatus.value])
+    // console.log('现在的状态是:', currentAirPortStatus.value, statusList[currentAirPortStatus.value])
   }
   //轮询
   setTimeout(() => {
@@ -221,7 +255,7 @@ const queryAirPort = async () => {
 const queryAirLine = async (fileUrl) => {
   //请求航线数据
   let resultWayPoint = await getAirWayPointsToJson2(fileUrl)
-  console.log(resultWayPoint)
+  // console.log(resultWayPoint)
   //地图数据
   iframeData = {
     airportName: currentAirPortInfo.value.name,
@@ -232,30 +266,6 @@ const queryAirLine = async (fileUrl) => {
     flyPath: resultWayPoint,
     coverage: currentAirPortInfo.value.coverage,
   }
-
-  //下面是以前的
-  // let params = {
-  //   airportId: window.iframe_AirPortID, //67  1011
-  // }
-  // let res = await queryAirLineApi(params)
-
-  // if (res.code == 0) {
-  //   //航线文件
-  //   let airLineInfo = res.data
-  //   //请求航线数据
-  //   let resultWayPoint = await getAirWayPointsToJson(airLineInfo.fileUrl)
-
-  //   //地图数据
-  //   iframeData = {
-  //     airportName: currentAirPortInfo.value.name,
-  //     airportLocation: {
-  //       lon: currentAirPortInfo.value.longitude,
-  //       lat: currentAirPortInfo.value.latitude,
-  //     },
-  //     flyPath: resultWayPoint,
-  //     coverage: currentAirPortInfo.value.coverage,
-  //   }
-  // }
 }
 //获取天气
 // const getweatherFn = async () => {
@@ -299,8 +309,8 @@ const socketFn = (workParams) => {
 const iframeLoaded = (iframeContent) => {
   setTimeout(() => {
     map_iframeContent = iframeContent
-    console.log('iframeData:')
-    console.log(iframeData)
+    // console.log('iframeData:')
+    // console.log(iframeData)
 
     //必须等待数值
     let tempTime = null
@@ -308,9 +318,15 @@ const iframeLoaded = (iframeContent) => {
       if (iframeData) {
         clearInterval(tempTime)
         let data = JSON.stringify(iframeData)
-        console.log('向gis发送数据....................................')
-        console.log(data)
+        // console.log('向gis发送数据....................................')
+        // console.log(data)
         iframeContent.postMessage(data, '*')
+
+        //如果是飞行中
+        if (currentAirPortInfo.value.status == 2) {
+          //gis底部工具栏得高度
+          changeGisToolHeight()
+        }
       }
     }, 50)
   }, 0)
@@ -343,9 +359,21 @@ const sendPosToPlane = (socketData) => {
 //给gis发送消息
 const sendGisMessage = (params) => {
   let contentWindow = document.getElementById('virturalDrive_iframe_full').contentWindow
+
   let data = JSON.stringify(params)
-  // console.log(data)
+  console.log('...............发送给gis数据是:', data)
   contentWindow.postMessage(data, '*')
+
+  // let t = setInterval(() => {
+  //   if (document.getElementById('virturalDrive_iframe_full').hasOwnProperty('contentWindow')) {
+  //     contentWindow = document.getElementById('virturalDrive_iframe_full').contentWindow
+  //     let data = JSON.stringify(params)
+
+  //     console.log('...............发送给gis数据是:', data)
+  //     contentWindow.postMessage(data, '*')
+  //     clearInterval(t)
+  //   }
+  // }, 50)
 }
 
 //重置screen
@@ -577,6 +605,7 @@ onMounted(() => {
       <!-- 底部面板 -->
       <div
         v-if="currentAirPortStatus == 2"
+        id="bottomPlane"
         class="bottomPlane w-full lg:h-[150px] xk:h-[150px] x1k:h-[212px] x2k:h-[282px] bg-[#001626] bg-opacity-70 absolute bottom-0 left-0 z-[3]"
       >
         <bottomPlaneFlying
@@ -617,6 +646,9 @@ onMounted(() => {
 :deep(.live-player-stretch-btn) {
   // display: none !important;
 }
+:deep(.video-title) {
+  display: none !important;
+}
 :deep(.video-js .vjs-tech) {
   max-width: unset !important;
   width: auto;
@@ -625,7 +657,7 @@ onMounted(() => {
   left: 0;
   right: 0;
   margin: auto;
-  height: 120%;
+  // height: 120%;
 }
 
 .rem-header {

src/views/carbin/toolComp/planeControl.vue

@@ -23,9 +23,9 @@ let items = reactive({
 })
 
 //电池百分比
-let precent = ref('-')
+let precent = ref('20')
 //电池剩余时间
-let lastTime = ref('-')
+let lastTime = ref('30')
 
 const setCurrentData = (data) => {
   // console.log(data)
@@ -35,7 +35,7 @@ const setCurrentData = (data) => {
   items.temperature.value = data ? data.weather.cellTemp + '℃' : '0℃'
 
   precent.value = data ? Number(data.battery) * 100 : '-'
-  lastTime.value = data ? data.allflytime : '-'
+  lastTime.value = data ? parseInt(data.allflytime, 10) : '-'
 }
 
 const droneCommand = async (type) => {
@@ -91,7 +91,7 @@ onMounted(() => {})
         </div>
       </template>
       <div
-        class="relative middlePlane w-[210px] h-[46px] mx-3 flex flex-row items-center justify-around"
+        class="relative middlePlane w-[210px] h-[46px] mx-3 px-1 flex flex-row items-center justify-around"
       >
         <img src="@/assets/icons/middleplane.png" alt="" class="absolute w-full h-full z-[-1]" />
         <div
@@ -101,7 +101,7 @@ onMounted(() => {})
         </div>
         <span class="text-sm text-[#ffffff]">电池电量</span>
         <div class="lastTime text-sm font-bold">{{ precent }}%/{{ lastTime }}min</div>
-        <span class="iconfont icon-xiashuangjiantou text-[#ffffff50]"></span>
+        <span class="iconfont icon-xiashuangjiantou text-[#ffffff50] text-[12px]"></span>
       </div>
     </a-tooltip>
     <!-- <div class="middlePlane w-[210px] h-[46px] mx-3 flex flex-row items-center justify-around">

src/views/carbin/toolComp/screen.vue

@@ -80,7 +80,7 @@ watch(
       ref="OutlivePlayerRef"
       :options="LiveOptions"
     />
-
+    <!-- https://gisdata.t-aaron.com/virturalDrive/test/VirturalDrive.html -->
     <iframe
       v-if="showType == 'map'"
       id="virturalDrive_iframe_full"

src/views/container/index.vue

@@ -0,0 +1,13 @@
+<script setup>
+import { ref, defineAsyncComponent, onMounted, watch, toRaw, defineProps, reactive } from 'vue'
+import { RouterLink, RouterView, useRoute, useRouter } from 'vue-router'
+
+const router = useRouter()
+console.log(router)
+
+router.push({ path: '/plane', query: { airportId: window.iframe_AirPortID } })
+</script>
+
+<template>
+  <div></div>
+</template>

vite.config.js

@@ -109,15 +109,19 @@ export default ({ command, mode }) => {
       host: '0.0.0.0',
       port: 8080,
       cors: true,
-      http: true,
       open: false, //不自动开启
       proxy: {
         '/airport': {
           target: env.VITE_APP_API_BASE_URL,
           changeOrigin: true,
           logLeve: 'debug', //输出真实的地址
-          rewrite: {
-            '^/airport': '',
+          rewrite: (path) => path.replace(/^\/airport/, ''),
+          //获取真实的转发地址
+          bypass(req, res, options) {
+            const proxyURL = options.target + options.rewrite(req.url)
+            console.log('proxyURL', proxyURL)
+            req.headers['x-req-proxyURL'] = proxyURL // 设置未生效
+            res.setHeader('x-req-proxyURL', proxyURL) // 设置响应头可以看到
           },
         },
       },