invoiceDetail.vue 4.95 KB
<template>
	<view class="graybg">
		<view class="pads">
			<view class="box">
				<view class="whiteItem">
	<!-- 				<view class="pp">
						发票形式
						<text v-if="form.invoiceForm=='1'">电子发票</text>
						<text v-if="form.invoiceForm=='2'">纸质普票</text>
						<text v-if="form.invoiceForm=='3'">纸质专票</text>
					</view>
					<view class="pp">
						开票金额
						<text>¥ {{form.total}}</text>
					</view> -->
<!-- 					<view class="pp" v-if="form.invoiceForm=='1'">
						邮箱
						<text>{{form.address}}</text>
					</view>
					<view class="pp" v-else style="display: flex;width: 100%;justify-content: space-between;">
						邮寄地址
						<view style="text-align: right;">
							<view style="color: #333;">{{nowAddress.contact}} {{nowAddress.phone}}</view>
							<view style="color: #333;">{{nowAddress.addName}}</view>
						</view>
					</view> -->
					<view class="pp">
						发票类型
						<text v-show="form.invoiceType=='0'"> 企业</text>
						<text v-show="form.invoiceType=='1'"> 个人非企业</text>
					</view>
					<view class="pp">发票抬头
						<text>{{form.invoiceTitle}}</text>
					</view>
					<view class="pp" v-if="form.invoiceTfn">税号
						<text>{{form.invoiceTfn}}</text>
					</view>
					<view>
						<view class="pp" v-if="form.invoiceAddress">邮箱
							<text>{{form.invoiceAddress}}</text>
						</view>
						<view class="pp" v-if="form.invoicePhone">电话
							<text>{{form.invoicePhone}}</text>
						</view>
						<view class="pp" v-if="form.invoiceBank">开户行
							<text>{{form.invoiceBank}}</text>
						</view>
						<view class="pp" v-if="form.invoiceAccount">账户
							<text>{{form.invoiceAccount}}</text>
						</view>
					</view>

				</view>
			</view>
		</view>
	</view>


</template>

<script setup>
	import {
		ref
	} from 'vue';
	import {
		onShow,
		onPullDownRefresh,
		onReachBottom,
		onLoad
	} from '@dcloudio/uni-app';
	import * as hotel from '@/common/hotel.js';
	import _ from 'lodash';
	const list = ref([])
	const form = ref({})
	const nowAddress = ref({})
	const addressList = ref([])

	const currUser = uni.getStorageSync('currUser');
	onShow(() => {
		list.value = []
		getList()
	});
	let invoiceId
	onLoad((option) => {
		invoiceId = option.invoiceId
	});

	function getList() {
		hotel.getInvoiceDetail(invoiceId).then(res => {
			form.value = res.data;
		});
	}
</script>

<style lang="scss" scoped>
	.fixedBtn {
		position: fixed;
		right: 30rpx;
		bottom: 10%;
		width: 100rpx;
		height: 100rpx;
		color: #fff;
		background: linear-gradient(270deg, #54e1b9, #00caa6);
		border-radius: 50%;
		box-shadow: 0 0 15rpx #666;
		font-size: 24rpx;
		text-align: center;
	}

	.pads {
		padding: 0 25rpx 70rpx;
	}

	.billItem {
		&>label {
			position: absolute;
			top: -10rpx;
			right: 0;
			font-size: 28rpx;
		}

		width: auto;
		position: relative;
		padding: 30rpx 0;

		.poPrice {
			position: absolute;
			right: 0;
			font-size: 36rpx;
			bottom: 30rpx;
			color: #000;
		}

		.uni-input {
			padding: 15rpx 0;
			color: #000;
		}

		.billFoot {
			margin-bottom: 20rpx;
		}
	}

	.rrcard .box {
		padding: 0 0 1px;
		margin: 20rpx 0 0;
	}

	.graybg {
		background: #f7f8fa;
		height: 100vh;
		width: 100vw;
		overflow: auto;
	}

	.whitebg {
		background: #fff;
		margin-top: 15rpx;
		border-radius: 20rpx;
		margin-bottom: 180rpx;
	}

	.whiteItem {
		width: 700rpx;
		box-sizing: border-box;
		margin: 26rpx auto 0;
		padding: 26rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 0rpx 27rpx 0rpx #DEDEDE;
		border-radius: 15rpx;
		.pp{font-size: 30rpx;
			text{float: right;font-size: 30rpx;}
		}
	}

	.name {
		font-size: 34rpx;
		color: #000;
	}

	.blueTag {
		color: #fff;
		background-color: #1EC886;
		padding: 10rpx 10rpx;
	}

	.purpleTag {
		color: #fff;
		background-color: #717bef;
		padding: 10rpx 10rpx;
	}

	.orangeTag {
		color: #fff;
		background-color: #ff8124;
		padding: 10rpx 10rpx;
	}

	.padh20 {
		padding: 0 25rpx;
	}

	.price {
		width: 100%;
		overflow: hidden;
	}

	.billbtn {
		color: #1EC886;
		border: 1px solid #1EC886;
		margin: initial;
		border-radius: 0;
		background-color: transparent;
		font-size: 28rpx;
	}

	.billFoot .tip {
		font-size: 24rpx;
		font-size: 24rpx;
		color: #999;
		font-weight: 500;
		margin: 0 20rpx;
	}

	.billItem>view {
		margin-bottom: 10rpx;
	}

	.billFoot text {
		white-space: nowrap;
	}

	.billFoot text.danger {
		color: #da2a2a;
	}

	.blueTag {
		color: #fff;
		background-color: #1EC886;
		padding: 10rpx 10rpx;
	}

	.status {
		.warning {
			color: #ff8124;
		}

		.danger {
			color: #da2a2a;
		}

		.gary {
			color: #666;
		}

		.success {
			color: #1EC886;
		}
	}

	.bigSize {
		font-size: 32rpx;
		margin-bottom: 10rpx;
	}

	.smallSize {
		font-size: 26rpx;
		color: #999;
	}
</style>