zhapp/pages/my/idPhoto.vue

<template>
	<view class="page">
		<view class="dis j-s a-c">
			<view class="item dis f-c a-c mr-2">
				<image :src="frontImg?frontImg:'/static/image/my/idCardfront.png'" mode=""></image>
				<text>人像面</text>
			</view>
			<view class="item dis f-c a-c">
				<image :src="backImg?backImg:'/static/image/my/idCardback.png'" mode=""></image>
				<text>国徽面</text>
			</view>
		</view>
		<u-empty v-if="!frontImg && !backImg" mode="car" icon="/static/image/Empty2.png" text="请先完成实名认证">
		</u-empty>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				frontImg: null, //正面
				backImg: null, //反面
			}
		},
		onShow() {

		},
		onLoad(options) {
			if (options.list) {
				const list = JSON.parse(decodeURIComponent(options.list));
				list.forEach(val => {
					if (val.fileType == 'sfz1') {
						this.frontImg = val.fileUrl;
					} else {
						this.backImg = val.fileUrl;
					}

				})
			}
		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #f8f8f8;
		padding: 30rpx;
		box-sizing: border-box;
	}

	.item {
		flex: 1;

		image {
			width: 100%;
			height: 208rpx;
			border-radius: 4rpx;
		}

		text {
			margin-top: 20rpx;
			font-size: 28rpx;
			color: #333;
		}
	}

	.u-empty {
		width: 100%;
		position: absolute;
		top: 20%;
		left: 50%;
		transform: translate(-50%);
	}
</style>