fapiaodetail.vue 3.0 KB
<template>
	<view class="box">
		<view class="fapiaodetail">
			<view class="detailitem">
				<view class="detaileft">发票状态</view>
				
				<view class="detailright" v-if="fapiaodetail.status==0">待审核</view>
				<view class="detailright" v-if="fapiaodetail.status==1">待开票</view>
				<view class="detailright" v-if="fapiaodetail.status==2">待邮寄</view>
				<view class="detailright" v-if="fapiaodetail.status==3">已邮寄</view>
			</view>
			<view class="detailitem">
				<view class="detaileft">发票抬头</view>
				<view class="detailright">{{fapiaodetail.payable}}</view>
			</view>
			<view class="detailitem">
				<view class="detaileft">快递单号</view>
				<view class="detailright">{{fapiaodetail.number}}</view>
			</view>
			<view class="detailitem">
				<view class="detaileft">税号</view>
				<view class="detailright">{{fapiaodetail.paragraph}}</view>
			</view>
			<view class="detailitem">
				<view class="detaileft">发票内容</view>
				<view class="detailright">{{fapiaodetail.mark}}</view>
			</view>
			<view class="dizhi">
				<view class="detaileft">地址和电话</view>
				<view class="detailright address">
					<view>{{fapiaodetail.address}}</view>
					<view class="code">{{fapiaodetail.mobile}}</view>
				</view>
			</view>
			<view class="dizhi">
				<view class="detaileft">开户行和账号</view>
				<view class="detailright address">
					<view>{{fapiaodetail.open_bank}}</view>
					<view class="code">{{fapiaodetail.open_account}}</view>
				</view>
			</view>
			<view class="detailitem">
				<view class="detaileft">发票金额</view>
				<view class="detailright">{{fapiaodetail.money}}元</view>
			</view>
			<view class="detailitem">
				<view class="detaileft">申请时间</view>
				<view class="detailright">{{fapiaodetail.createtime}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	import app from "../../App.vue"
	export default {
		data() {
			return {
				id: '',
				fapiaodetail:''
			}
		},
		methods: {
			//获取发票详情
			
			getfapiaodetail() {
				let param = {
					id: this.id
				}
				app.post("api/person/invoiceDetail", param, 'get')
					.then(res => {
						console.log(res);
						this.fapiaodetail=res

					})
					.catch(err => {});
			}
		},
		mounted() {
			this.getfapiaodetail()
		},
		onLoad(options) {
			console.log(options)
			this.id = options.id
		}
	}
</script>

<style>
	.fapiaodetail {
		width: 686rpx;
		background: #fff;
		border-radius: 14rpx;
		margin: 20rpx auto 48rpx;
		padding: 0 32rpx;
		box-sizing: border-box;
	}

	.detailitem {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 40rpx 0;
		box-sizing: border-box;
		border-bottom: 1rpx solid #f5f5f5;
	}

	.detaileft {
		color: #0A0808;
		font-size: 30rpx;
	}

	.detailright {
		color: #7F8389;
		font-size: 28rpx;

	}

	.dizhi {
		padding: 40rpx 0;
		box-sizing: border-box;
		border-bottom: 1rpx solid #f5f5f5;
	}

	.address {
		margin-top: 24rpx
	}

	.code {
		margin-top: 24rpx
	}
</style>