feat:webview通信处理

shuishen

2025-12-19 32febb140d320b35d580c8d4e78a80ef846e75fc

feat:webview通信处理

 src/pages/inspectionTask/index.vue

@@ -1,73 +1,80 @@
<!-- 巡检任务 -->
<template>
  <view>
    <WebViewPlus :src="`${viewUrl}`" @webMessage="onPostMessage"/>
    <WebViewPlus :src="`${viewUrl}`" @webMessage="onPostMessage" />
  </view>
</template>

<script setup>
import { getWebViewUrl } from "@/utils/index.js";
import WebViewPlus from "@/components/WebViewPlus.vue";
import {onHide, onShow} from "@dcloudio/uni-app";
import {errorFactory} from "sass-loader/dist/utils.js";
import { useAppStore } from "@/store/index.js"
import { onHide, onShow } from "@dcloudio/uni-app";
import { errorFactory } from "sass-loader/dist/utils.js";
import { useAppStore } from "@/store/index.js";

const appStore = useAppStore()
const appStore = useAppStore();

// const viewUrl = getWebViewUrl('/inspectionTask')

const updateKey = ref(0)
const sxListKey = ref(0)
const updateKey = ref(0);
const sxListKey = ref(0);
const viewUrl = computed(() => {
  return getWebViewUrl(  '/inspectionTask', { updateKey: updateKey.value,sxListKey: sxListKey.value })
})
  return getWebViewUrl("/inspectionTask", {
    updateKey: updateKey.value,
    sxListKey: sxListKey.value,
  });
});

watch(() => [appStore.jobUpdateKey, appStore.deviceUpdateKey], () => {
  sxListKey.value = sxListKey.value + 1
})

watch(
  () => [appStore.jobUpdateKey, appStore.deviceUpdateKey],
  () => {
    sxListKey.value = sxListKey.value + 1;
  }
);

function onPostMessage(data) {
  if (data.type === 'taskDetails'){
    if ([1,2].includes(data.rowItem.status)){
  if (data.type === "taskDetails") {
    // #ifdef MP-WEIXIN
    // #endif

    // #ifndef MP-WEIXIN
    if ([1, 2].includes(data.rowItem.status)) {
      uni.navigateTo({
        url: `/subPackages/inProgress/index?wayLineJobInfoId=${data.rowItem.id}`
        url: `/subPackages/inProgress/index?wayLineJobInfoId=${data.rowItem.id}`,
      });
    } else {
      uni.navigateTo({
        url: `/subPackages/taskDetail/execution/index?wayLineJobInfoId=${data.rowItem.id}&waylineJobId=${data.rowItem.wayline_job_id}&batch_no=${data.rowItem.batch_no}`
        url: `/subPackages/taskDetail/execution/index?wayLineJobInfoId=${data.rowItem.id}&waylineJobId=${data.rowItem.wayline_job_id}&batch_no=${data.rowItem.batch_no}`,
      });
    }
    // #endif
  }
}
const isApp = ref(false)
const isApp = ref(false);
onShow(() => {
  const joinParams = uni.getStorageSync('joinParams');
  const joinParams = uni.getStorageSync("joinParams");
  if (joinParams) {
    // 使用后清除
    console.log('是否打印', updateKey.value)
    updateKey.value = updateKey.value + 1
    uni.removeStorageSync('joinParams');
    console.log("是否打印", updateKey.value);
    updateKey.value = updateKey.value + 1;
    uni.removeStorageSync("joinParams");
  }
  // isApp.value = true
  // 清除数据
  const encodedData = encodeURIComponent(JSON.stringify({ device_sn: '' }))
  uni.setStorageSync('webview_params', encodedData);
  
  uni.setStorageSync('lastTab', 'task');
  const encodedData = encodeURIComponent(JSON.stringify({ device_sn: "" }));
  uni.setStorageSync("webview_params", encodedData);

  uni.setStorageSync("lastTab", "task");
  uni.setTabBarItem({
    index: 2,
    text: '',
    iconPath: 'static/images/tabbar/add.png',
    selectedIconPath: 'static/images/tabbar/add.png'
    text: "",
    iconPath: "static/images/tabbar/add.png",
    selectedIconPath: "static/images/tabbar/add.png",
  });
});

onHide(() => {
  // isApp.value = false
});

</script>
<style scoped lang="scss">

</style>
<style scoped lang="scss"></style>

 src/pages/map/index.vue

@@ -2,10 +2,10 @@
 * @Author       : yuan
 * @Date         : 2025-12-03 14:20:57
 * @LastEditors  : yuan
 * @LastEditTime : 2025-12-16 17:23:02
 * @LastEditTime : 2025-12-19 15:32:31
 * @FilePath     : \src\pages\map\index.vue
 * @Description  : 
 * Copyright 2025 OBKoro1, All Rights Reserved. 
 * @Description  :
 * Copyright 2025 OBKoro1, All Rights Reserved.
 * 2025-12-03 14:20:57
-->
<template>
@@ -37,6 +37,17 @@
});

const onPostMessage = (data) => {
  // #ifdef MP-WEIXIN
  if (data.type === "scanCode") {
  } else if (data.type === "jumpAddWork") {
  } else if (data.type === "jumpMapNav") {
    //事件导航
  } else if (data.type === "workid") {
    //事件详情
  }
  // #endif

  // #ifndef MP-WEIXIN
  if (data.type === "scanCode") {
    uni.navigateTo({
      url: "/subPackages/qrCode/index",
@@ -59,6 +70,7 @@
      url: `/subPackages/workDetail/index?eventNum=${data.eventNum}`,
    });
  }
  // #endif
};

onShow(() => {

 src/subPackages/inProgress/index.vue

@@ -1,43 +1,64 @@
<!--
 * @Author       : yuan
 * @Date         : 2025-12-05 11:32:36
 * @LastEditors  : yuan
 * @LastEditTime : 2025-12-19 15:56:31
 * @FilePath     : \src\subPackages\inProgress\index.vue
 * @Description  : 
 * Copyright 2025 OBKoro1, All Rights Reserved. 
 * 2025-12-05 11:32:36
-->
<template>
  <WebViewPlus v-if="showComponent" :src="`${viewUrl}`" @webMessage="onPostMessage"/>
  <WebViewPlus
    v-if="showComponent"
    :src="`${viewUrl}`"
    @webMessage="onPostMessage"
  />
</template>

<script setup>
import WebViewPlus from "@/components/WebViewPlus.vue";
import {getWebViewUrl} from "@/utils/index.js";
import {onHide, onLoad, onShow} from "@dcloudio/uni-app";
import { getWebViewUrl } from "@/utils/index.js";
import { onHide, onLoad, onShow } from "@dcloudio/uni-app";

const wayLineJobInfoId = ref(null)
const viewUrl = ref('')
const showComponent = ref(false)
const wayLineJobInfoId = ref(null);
const viewUrl = ref("");
const showComponent = ref(false);
function onPostMessage(data) {
  if (data.type === 'back') {
  // #ifdef MP-WEIXIN
  // #endif

  // #ifndef MP-WEIXIN
  if (data.type === "back") {
    uni.switchTab({
      url: '/pages/inspectionTask/index'
      url: "/pages/inspectionTask/index",
    });
  } else if (data.type === 'control') {
  } else if (data.type === "control") {
    uni.navigateTo({
      url: `/subPackages/droneConsole/index?wayLineJobInfoId=${wayLineJobInfoId.value}&dockSn=${data.dockSn}`
      url: `/subPackages/droneConsole/index?wayLineJobInfoId=${wayLineJobInfoId.value}&dockSn=${data.dockSn}`,
    });
  }
  // #endif
}

onLoad((options) => {
  wayLineJobInfoId.value = options.wayLineJobInfoId
  viewUrl.value = getWebViewUrl('/TaskInProgress', {wayLineJobInfoId: wayLineJobInfoId.value})
})
  wayLineJobInfoId.value = options.wayLineJobInfoId;
  viewUrl.value = getWebViewUrl("/TaskInProgress", {
    wayLineJobInfoId: wayLineJobInfoId.value,
  });
});

onShow(function () {
  showComponent.value = true
  showComponent.value = true;
  // #ifdef APP-PLUS
  plus.navigator.setFullscreen(false);
  plus.screen.lockOrientation("portrait-primary");
  // #endif
})
});

onHide(() =>{
  showComponent.value = false
})
onHide(() => {
  showComponent.value = false;
});
</script>

<style scoped lang="scss">

 src/subPackages/qrCode/index.vue

@@ -1,3 +1,13 @@
<!--
 * @Author       : yuan
 * @Date         : 2025-10-14 17:43:52
 * @LastEditors  : yuan
 * @LastEditTime : 2025-12-19 15:33:48
 * @FilePath     : \src\subPackages\qrCode\index.vue
 * @Description  : 
 * Copyright 2025 OBKoro1, All Rights Reserved. 
 * 2025-10-14 17:43:52
-->
<template>
  <view class="page-wrap">
    <WebViewPlus :src="`${viewUrl}`" @webMessage="onPostMessage" />
@@ -5,26 +15,31 @@
</template>

<script setup>
  import {
    getWebViewUrl
  } from "@/utils/index.js";
  import WebViewPlus from "@/components/WebViewPlus.vue";
import { getWebViewUrl } from "@/utils/index.js";
import WebViewPlus from "@/components/WebViewPlus.vue";

  const viewUrl = getWebViewUrl("/QrCodeScanner");
const viewUrl = getWebViewUrl("/QrCodeScanner");

  const onPostMessage = (data) => {
    if (data.type === 'browser') {
      uni.navigateTo({
        url: '/subPackages/browser/index?url=' + encodeURIComponent(data.data.url)
      });
    }
  };
const onPostMessage = (data) => {
  if (data.type === "browser") {
    // #ifdef MP-WEIXIN

  onLoad(() => {});
    // #endif

    // #ifndef MP-WEIXIN
    uni.navigateTo({
      url:
        "/subPackages/browser/index?url=" + encodeURIComponent(data.data.url),
    });
    // #endif
  }
};

onLoad(() => {});
</script>

<style lang="scss" scoped>
  .page-wrap {
    font-size: 20px;
  }
.page-wrap {
  font-size: 20px;
}
</style>

 src/subPackages/taskDetail/addTask/index.vue

@@ -1,27 +1,33 @@
<!-- 新建任务 -->
<template>
  <WebViewPlus v-if="isApp" :src="`${viewUrl}`" @webMessage="onPostMessage"/>
  <WebViewPlus v-if="isApp" :src="`${viewUrl}`" @webMessage="onPostMessage" />
</template>

<script setup>
import WebViewPlus from "@/components/WebViewPlus.vue";

import {getWebViewUrl} from "@/utils/index.js";
import {onHide, onLoad, onShow} from "@dcloudio/uni-app";
import { getWebViewUrl } from "@/utils/index.js";
import { onHide, onLoad, onShow } from "@dcloudio/uni-app";

// const viewUrl = ref(getWebViewUrl('/addTask'))
const sWebViewRef = ref(null);
const viewUrl = ref('')
const viewUrl = ref("");

function onPostMessage(data) {
  if (data.type === 'submitSuccess'){
    uni.setStorageSync('joinParams', {
      type: 'add'
  if (data.type === "submitSuccess") {
    // #ifdef MP-WEIXIN
    // #endif

    // #ifndef MP-WEIXIN
    uni.setStorageSync("joinParams", {
      type: "add",
    });
    // console.log('打印新增成功')
    uni.switchTab({
      url: '/pages/inspectionTask/index'
      url: "/pages/inspectionTask/index",
    });
    // #endif

    // uni.redirectTo({
    //   url: `/pages/inspectionTask/index?addLog=1111`
    // });
@@ -34,23 +40,23 @@
//
// });

const isApp = ref(false)
const isApp = ref(false);
onShow(() => {
  isApp.value = true
  let params = {}
  const encodedData = uni.getStorageSync('webview_params')
  isApp.value = true;
  let params = {};
  const encodedData = uni.getStorageSync("webview_params");
  if (encodedData) {
      try {
          params = JSON.parse(decodeURIComponent(encodedData))
      } catch (e) {
          console.error(e)
      }
    try {
      params = JSON.parse(decodeURIComponent(encodedData));
    } catch (e) {
      console.error(e);
    }
  }
  viewUrl.value = getWebViewUrl('/addTask', params)
  viewUrl.value = getWebViewUrl("/addTask", params);
});

onHide(() => {
  isApp.value = false
  isApp.value = false;
});
</script>


 src/subPackages/workDetail/mapWork/index.vue

@@ -2,7 +2,7 @@
 * @Author       : yuan
 * @Date         : 2025-10-22 14:59:10
 * @LastEditors  : yuan
 * @LastEditTime : 2025-10-22 19:41:27
 * @LastEditTime : 2025-12-19 14:52:54
 * @FilePath     : \src\subPackages\workDetail\mapWork\index.vue
 * @Description  : 
 * Copyright 2025 OBKoro1, All Rights Reserved. 
@@ -29,6 +29,10 @@
  viewUrl.value = getWebViewUrl("/mapWork", { currentItem: currentItem });
});
function onPostMessage(data) {
  // #ifdef MP-WEIXIN
  // #endif

  // #ifndef MP-WEIXIN
  if (data.type === "workDetailback") {
    // uni.navigateTo({
    //   url: '/subPackages/workDetail/index'
@@ -44,6 +48,7 @@
        "/subPackages/browser/index?url=" + encodeURIComponent(data.data.url),
    });
  }
  // #endif
}
</script>