<template>
	<view class="invoice_detail">
		<view class="top">
			<view class="top_1"><span v-if="Info.status==2" style="color:#18bc37">已开票</span><span v-if="Info.status==0 || Info.status==1 " style="color:#666">未开票</span></view>
			<view class="top_1">发票金额：<span style="color: #ff5500;">￥{{Info.price}}</span></view>
		</view>
		<view class="content">
			<view class="content_row">
				<uni-icons type="flag" color="#afafaf" size="20"></uni-icons><view class="row_left">发票类型</view><view class="row_right"><span v-if="Info.type==0">纸质发票</span><span v-if="Info.type==1">电子发票</span></view>
			</view>
			<view class="content_row">
				<uni-icons type="compose" color="#afafaf" size="20"></uni-icons><view class="row_left">发票内容</view><view class="row_right">{{Info.content}}</view>
			</view>
			<view class="content_row">
				<uni-icons type="vip" color="#afafaf" size="20"></uni-icons><view class="row_left">发票类型</view><view class="row_right"><span v-if="Info.unit_type==0">个人</span><span v-if="Info.unit_type==1">单位</span></view>
			</view>
			<view class="content_row">
				<uni-icons type="person" color="#afafaf" size="20"></uni-icons><view class="row_left">抬头名称</view><view class="row_right">{{Info.unit_name}}</view>
			</view>
			<view class="content_row">
				<uni-icons type="fire" color="#afafaf" size="20"></uni-icons><view class="row_left">公司税号</view><view class="row_right">{{Info.unit_num}}</view>
			</view>
			<view class="content_row">
				<uni-icons type="star" color="#afafaf" size="20"></uni-icons><view class="row_left">开票金额</view><view class="row_right">{{Info.price}}</view>
			</view>
			<view class="content_row" v-if="Info.status==2">
				<uni-icons type="calendar" color="#afafaf" size="20"></uni-icons><view class="row_left">开票时间</view><view class="row_right">{{Info.kaipiao_time}}</view>
			</view>
			<view class="content_row">
				<uni-icons type="calendar" color="#afafaf" size="20"></uni-icons><view class="row_left">申请时间</view><view class="row_right">{{Info.shenqing_time}}</view>
			</view>
			<view class="content_row">
				<uni-icons type="map-pin" color="#afafaf" size="20"></uni-icons><view class="row_left">收票方式</view><view class="row_right"><span v-if="Info.receive_type==0">邮寄</span><span v-if="Info.receive_type==1">其他</span></view>
			</view>
			<view class="content_row">
				<uni-icons type="phone" color="#afafaf" size="20"></uni-icons><view class="row_left">电话</view><view class="row_right">{{Info.tel}}</view>
			</view>
			<view class="content_row">
				<uni-icons type="map-pin-ellipse" color="#afafaf" size="20"></uni-icons><view class="row_left">收票地址</view><view class="row_right">{{Info.receive_address}}</view>
			</view>
			<view class="content_row"  v-if="Info.status==0">
				<uni-icons type="closeempty" color="#ff5500" size="20"></uni-icons><view class="row_left" style="color:#ff5500 ;">拒绝原因</view><view class="row_right">{{Info.refuse_content}}</view>
			</view>
			<button v-if="Info.status==0" @click="ShenQing()" class="addbutton"  >重新申请</button>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,onMounted
	} from "vue"
	import {InvoiceGetDetail} from "@/api"
	import {onLoad} from "@dcloudio/uni-app"
	let id=ref(0);
	let ordernum=ref('')
	let Info=ref('');
	const GetDetail=()=>{
		InvoiceGetDetail({id:id.value,ordernum:ordernum.value}).then(res => {
			if(res.status){
				Info.value=res.data
			} else{
				uni.navigateTo({
					url: '/pages/invoice/list'
				})
			}
		})
	}
	const ShenQing=()=>{
		uni.navigateTo({
			url: '/pages/invoice/edit'
		})
	}
	onLoad((e)=>{
		 id.value=e.id
		 if(e.ordernum!=undefined){
			  ordernum.value=e.ordernum
		 }
		
	})
	onMounted(()=>{
		GetDetail()
	})
</script>

<style scoped>
	.invoice_detail{
		padding: 20rpx;
	}
	.top {
		text-align: center;
		background-color: #fff;
		padding: 20rpx 20rpx 40rpx 20rpx;
		border-radius: 20rpx;
		font-weight: 700;
	}
	
	.top_1 {
		margin-top: 20rpx;
	}
	.content {
		margin-top: 20rpx;
		background-color: #fff;
		padding: 20rpx;
		border-radius: 20rpx;
		font-size: 28rpx;
	}
	.content_row{
		display: flex;
		border-bottom: 1px solid #d5efff;
		padding: 28rpx 20rpx;
	}
	.row_left{
		margin-right: 30rpx;
		color: #55aaff;
		margin-left: 10rpx;
		font-weight: 700;
		min-width: 130rpx;
	}
	.row_right{
		color:#afafaf
	}
	.addbutton{
		margin-top:40rpx;
		background-color: coral;
		height: 80rpx;
		line-height: 80rpx;
		color: #fff;
	}
</style>
