jp-housekeep-hall/pages/invoiceManagement/viewE-invoice.vue

<template>
	<view>
		<u-navbar title="查看电子发票"  title-color="#101010" ></u-navbar>
		<view class="img-box">
			<image class="img" src="@/assets/img/e-invoice.png" mode=""></image>
		</view>
		<view class="btn-box">
			<button class="picture">下载图片</button>
			<button class="pdf">下载PDF</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss" scoped>
	.img-box{
		width: 100%;
		height: 576rpx;
		.img{
			width: 100%;
			height: 100%;
		}
	}
    .btn-box{
		
		display: flex;
		
		margin-top: 24rpx;
		.picture{
			width: 332rpx;
			
			line-height: 88rpx;
			border-radius: 8px;
			background-color: rgba(255,255,255,1);
			color: rgba(119,119,119,1);
			font-size: 32rpx;
			
			
			border: 1px solid rgba(205,205,205,1);
		}
		.pdf{
			width: 330rpx;
			
			line-height: 88rpx;
			border-radius: 8px;
			background-color: rgba(22,119,255,1);
			color: rgba(255,255,255,1);
			font-size: 32rpx;
		}
	}
</style>