hx-mini-uni/pages/user/license.vue

<template>
	<view>
		<block v-if="loading">
			<view class="skeleton">
				<view class="skeleton-line max animate" style="height: 200upx;"></view>
				<view class="skeleton-line animate"></view>
				<view class="skeleton-line min animate"></view>
				<view class="skeleton-line min animate"></view>
				<view class="skeleton-line max animate" style="height: 200upx;"></view>
				<view class="skeleton-line max animate" style="height: 200upx;"></view>
			</view>
		</block>
		<block v-else>
		<view class="info-item">
			<view class="title">营业执照</view>
			<view class="img" @click="preview"><image :src="license" mode="widthFix"></image></view>
		</view>
		<view class="info-item">
			<view class="title">特别提示</view>
			<view class="info">商家资质图片为官方展示<text>严禁下载复印</text>，违者后果自负</view>
		</view>
		</block>
	</view>
</template>

<script>
var app;
import * as Api from "@/static/api/home.js";
export default {
	data() {
		return {
			loading:true,
			license:""
		}
	},
	onLoad() {
		app = this;
		app.getLicense()
	},
	methods: {
		preview(){
			uni.previewImage({
				urls:[app.license]
			})
		},
		getLicense(){
			Api.license({}).then((res)=>{
				app.loading = false;
				if (res.code !== 1) {
					return app.$dialog.showSuccess(res.msg,function(){
						uni.navigateBack()
					})
				}
				app.license = res.data.img;
			})
		}
	}
}
</script>

<style>
page{background-color: #f8f8f8;}
.info-item{background-color: #fff;padding: 20upx;margin-bottom: 20upx;}
.info-item .title{font-size: 30upx;color: #333;font-weight: bold;line-height: 80upx;border-bottom: 2upx solid #f8f8f8;}
.info-item .info{font-size: 28upx;color: #666;line-height: 60upx;}
.info-item .info text{color: #fe2c56;}
.info-item image{width: 100%;}
</style>