|
|
@@ -0,0 +1,68 @@
|
|
|
+<template>
|
|
|
+ <cwg-popup
|
|
|
+ :visible="visible"
|
|
|
+ :title="displayTitle"
|
|
|
+ width="min(920px, 94vw)"
|
|
|
+ :show-footers="false"
|
|
|
+ footer-type="none"
|
|
|
+ :mask-click="true"
|
|
|
+ @update:visible="onVisibleChange"
|
|
|
+ @close="handleClose"
|
|
|
+ >
|
|
|
+ <view class="pay-webview-body">
|
|
|
+ <!-- #ifdef H5 -->
|
|
|
+ <iframe v-if="payUrl" :src="payUrl" class="pay-webview-frame" frameborder="0" />
|
|
|
+ <!-- #endif -->
|
|
|
+ </view>
|
|
|
+ </cwg-popup>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { computed } from 'vue'
|
|
|
+import { useI18n } from 'vue-i18n'
|
|
|
+import { payWebviewState, closePayWebview } from '@/hooks/usePayWebview'
|
|
|
+
|
|
|
+const { t } = useI18n()
|
|
|
+
|
|
|
+const visible = computed({
|
|
|
+ get: () => payWebviewState.value.visible,
|
|
|
+ set: (val) => {
|
|
|
+ if (!val) closePayWebview()
|
|
|
+ },
|
|
|
+})
|
|
|
+
|
|
|
+const payUrl = computed(() => payWebviewState.value.url)
|
|
|
+
|
|
|
+const displayTitle = computed(() => {
|
|
|
+ return t('Shop.Order.OrderDetails')
|
|
|
+})
|
|
|
+
|
|
|
+function onVisibleChange(val) {
|
|
|
+ if (!val) closePayWebview()
|
|
|
+}
|
|
|
+
|
|
|
+function handleClose() {
|
|
|
+ closePayWebview()
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+@import "@/uni.scss";
|
|
|
+
|
|
|
+.pay-webview-body {
|
|
|
+ width: 100%;
|
|
|
+ height: 70vh;
|
|
|
+ min-height: px2rpx(360);
|
|
|
+ max-height: 80vh;
|
|
|
+ overflow: hidden;
|
|
|
+ border-radius: px2rpx(8);
|
|
|
+ background: var(--bs-body-bg, #fff);
|
|
|
+}
|
|
|
+
|
|
|
+.pay-webview-frame {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ border: none;
|
|
|
+ display: block;
|
|
|
+}
|
|
|
+</style>
|