zkxw/mobile-h5/pages/oa/webview/index.vue

<template>
  <!-- 通用 OA web-view：发起 + 详情共用；结构对齐 start/webview -->
  <web-view v-if="src" :src="src" @message="onMessage" />
</template>

<script>
import {
  buildOaDetailUrl,
  buildOaStartUrl,
  takeOaDetailTitle,
  takeOaStartTitle
} from '../../../utils/oa-h5.js'
import { forceRelogin, getToken } from '../../../utils/auth.js'
import { fetchOaTemplateDetail } from '../../../utils/oa-api.js'

const CLOSE_ACTIONS = new Set([
  'oa-start-close',
  'oa-start-cancel',
  'oa-start-draft',
  'oa-start-submitted',
  'oa-detail-close',
  'oa-detail-done',
  'oa-detail-withdraw',
  'oa-detail-restart'
])

export default {
  data() {
    return { src: '', _closing: false }
  },
  onLoad(query) {
    if (!getToken()) {
      forceRelogin('请先登录')
      return
    }

    const instanceId = String((query && query.instanceId) || '')
    const taskId = String((query && query.taskId) || '')
    const mode = String((query && query.mode) || '') || 'view'
    const autoPrint = String((query && query.autoPrint) || '') === '1'
    const appId = String((query && query.appId) || '')
    const draftId = String((query && query.draftId) || '')
    const fromInstanceId = String((query && query.fromInstanceId) || '')

    let src = ''

    if (instanceId) {
      const cachedName = takeOaDetailTitle()
      if (cachedName) {
        uni.setNavigationBarTitle({ title: cachedName })
      }
      src = buildOaDetailUrl({ instanceId, taskId, mode, autoPrint })
    } else if (draftId || appId || fromInstanceId) {
      const cachedName = takeOaStartTitle()
      if (cachedName) {
        uni.setNavigationBarTitle({ title: cachedName })
      } else if (appId) {
        this.resolveTitle(appId)
      }
      src = buildOaStartUrl({ appId, draftId, fromInstanceId })
    } else {
      uni.showToast({ title: '参数错误', icon: 'none' })
      setTimeout(() => {
        uni.navigateBack({
          fail: () => {}
        })
      }, 400)
      return
    }

    if (!/\btoken=/.test(src)) {
      forceRelogin('请先登录')
      return
    }

    console.log('[oa webview] src=', src)
    this.src = src

    // H5：OA 页在 iframe 内，靠 postMessage 通知本页 uni.navigateBack
    // （微信小程序由 OA 内 wx.miniProgram.navigateBack，勿在此再退一层）
    // #ifdef H5
    this._onParentMessage = (e) => {
      const d = e && e.data
      if (!d || d.source !== 'zkxw-oa-h5') return
      this.navigateBackFromOa(d)
    }
    window.addEventListener('message', this._onParentMessage)
    // #endif
  },
  onUnload() {
    // #ifdef H5
    if (this._onParentMessage) {
      window.removeEventListener('message', this._onParentMessage)
      this._onParentMessage = null
    }
    // #endif
  },
  methods: {
    async resolveTitle(appId) {
      try {
        const detail = await fetchOaTemplateDetail(appId)
        const name = String(
          (detail && (detail.appName || detail.name)) || ''
        ).trim()
        if (name) uni.setNavigationBarTitle({ title: name })
      } catch (_) {
        /* 保留 pages.json 兜底标题 */
      }
    },
    navigateBackFromOa(payload) {
      if (this._closing) return
      const action = String((payload && payload.action) || '')
      if (action && !CLOSE_ACTIONS.has(action)) return

      // 复制重开：离开详情 webview 栈时，改开发起页（同页 redirect）
      if (action === 'oa-detail-restart') {
        const appId = String((payload && payload.appId) || '').trim()
        const fromInstanceId = String(
          (payload && (payload.fromInstanceId || payload.instanceId)) || ''
        ).trim()
        if (!appId && !fromInstanceId) return
        this._closing = true
        const q = []
        if (appId) q.push('appId=' + encodeURIComponent(appId))
        if (fromInstanceId) {
          q.push('fromInstanceId=' + encodeURIComponent(fromInstanceId))
        }
        uni.redirectTo({
          url: '/pages/oa/webview/index?' + q.join('&'),
          fail: () => {
            this._closing = false
            uni.navigateTo({
              url: '/pages/oa/webview/index?' + q.join('&'),
              fail: () => {
                this._closing = false
              }
            })
          }
        })
        return
      }

      this._closing = true
      const msg = String((payload && payload.message) || '').trim()
      if (msg) {
        uni.showToast({ title: msg, icon: 'none', duration: 1200 })
      }
      setTimeout(() => {
        uni.navigateBack({
          fail: () => {
            this._closing = false
          }
        })
      }, msg ? 400 : 0)
    },
    onMessage(e) {
      /* 微信：多在后退/销毁时触发；列表页 onShow 可刷新。勿再 navigateBack */
      console.log('[oa webview] message', e && e.detail)
    }
  }
}
</script>