<script setup>
const webviewStyles = ref({
  top: `${uni.getSystemInfoSync().statusBarHeight + 44}px`, // 距离顶部的距离
  height: `${uni.getSystemInfoSync().windowHeight - uni.getSystemInfoSync().statusBarHeight - 44}px`, // 高度
  position: 'absolute', // 绝对定位
  dock: 'bottom', // 停靠在底部
  bounce: 'vertical', // 垂直方向的回弹效果
})
const id = ref(null)

function handleMessage(event) {
  const data = event.detail.data[0]
  if (data.loaded) {
    onWebViewLoaded()
  }
  else if (data.action === 'agreed') {
    uni.redirectTo({ url: `/pages/pay?id=${id.value}` })
  }
  else if (data.action === 'cancelled') {
    uni.showModal({
      title: '注意',
      content: '是否确认取消，退出当前页面',
      success(res) {
        if (res.confirm) {
          uni.navigateBack()
        }
      },
    })
  }
}

function onWebViewLoaded() {
}
const src = ref('https://app.quannengcha.com/authorization')
onLoad((option) => {
  if (option.id) {
    src.value = `${src.value}?id=${encodeURIComponent(option.id)}&token=${encodeURIComponent(uni.getStorageSync('token'))}`
    id.value = option.id
  }
})
</script>

<template>
  <view>
    <web-view :webview-styles="webviewStyles" :src="src" @message="handleMessage" />
  </view>
</template>

<route lang="json">
{
  "layout": "page",
  "title": "授权书"
}
</route>
