certPreview.vue 1.16 KB
<template>
	<view class="preview-container">
		<view class="loading-tip" v-if="loading">加载中...</view>
		<view class="error-tip" v-else-if="showError">{{ errorMsg }}</view>

		<web-view v-if="pdfUrl" :src="pdfUrl"></web-view>
	</view>
</template>

<script setup>
	import { ref } from "vue";
	import { onLoad } from "@dcloudio/uni-app";
	import config from "@/config.js";

	const pdfUrl = ref("");
	const loading = ref(true);
	const showError = ref(false);
	const errorMsg = ref("");

	onLoad((option) => {
		if (option.url) {
			pdfUrl.value = config.baseUrl_api + decodeURIComponent(option.url);
			loading.value = false;
		} else {
			showError.value = true;
			errorMsg.value = "参数错误";
		}
	});
</script>

<style lang="scss" scoped>
	.preview-container {
		width: 100vw;
		height: 100vh;
		background: #f5f5f5;
		position: relative;
	}

	.loading-tip {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		font-size: 28rpx;
		color: #666;
	}

	.error-tip {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		font-size: 28rpx;
		color: #C40F18;
	}

	web-view {
		width: 100%;
		height: 100%;
	}
</style>