ServicePlatfrom/GDH5/pages/invoice/edit.vue

<template>
	<view class="invoice_edit">
		<view class="top">
			<!-- <view class="top_1">申请开票</view> -->
			<view class="top_1">发票金额：<span style="color: #ff5500;">￥{{FormData.price}}</span></view>
		</view>
		<view class="content">
			<uni-forms ref="baseForm" :label-width="80" :modelValue="FormData">
				<uni-forms-item label="发票类型">
					<view class="form_wenzi ">
						<uni-tag text="纸质发票" type="success" />
					</view>
				</uni-forms-item>
				<uni-forms-item label="发票内容">
					<view class="form_wenzi ">
						{{FormData.content}}
					</view>
				</uni-forms-item>
				<uni-forms-item label="发票类型">
					<view class="leixing_select form_wenzi">
						<view class="leixing_select_item" @click="UnitTypeClick(0)"
							:class="FormData.unit_type==0?'active':''">个人</view>
						<view class="leixing_select_item" @click="UnitTypeClick(1)"
							:class="FormData.unit_type==1?'active':''">公司</view>
					</view>
				</uni-forms-item>
				<uni-forms-item label="抬头名称" required>
					<uni-easyinput v-model="FormData.unit_name" placeholder="请输入名称" />
				</uni-forms-item>
				<uni-forms-item label="公司税号" required>
					<uni-easyinput v-model="FormData.unit_num" placeholder="请输入税号" />
				</uni-forms-item>
				<uni-forms-item label="备注说明">
					<uni-easyinput v-model="FormData.user_note" />
				</uni-forms-item>
				<uni-forms-item label="开票金额">
					<uni-easyinput v-model="FormData.price" disabled />
				</uni-forms-item>
				<uni-forms-item label="电话">
					<uni-easyinput v-model="FormData.tel" />
				</uni-forms-item>
				<uni-forms-item label="收票地址" required>
					<uni-easyinput v-model="FormData.receive_address" placeholder="请填写收票地址" />
				</uni-forms-item>
			</uni-forms>
			<button @click="AddClick()" class="addbutton">申请开票</button>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		onMounted
	} from "vue"
	import {
		InvoiceSave,
		InvoiceGetHistory
	} from "@/api"
	import {
		onLoad
	} from "@dcloudio/uni-app"
	let FormData = ref({
		type: 0,
		content: "体检服务费",
		unit_type: 1,
		unit_name: '',
		unit_num: '',
		user_note: '',
		tel: '',
		price: 0,
		receive_address: '',
		link_order_num:''
	})
	const UnitTypeClick = (id) => {
		FormData.value.unit_type = id
	}
	const Save = () => {
		InvoiceSave({
			invoiceInfo: FormData.value
		}).then(res => {
			if (res.status) {
				uni.showToast({
					title: '操作成功',
					duration: 1000
				});
				uni.navigateTo({
					url: '/pages/invoice/list'
				})
			}
		})
	}
	const AddClick = () => {
		if (FormData.value.price == 0) {
			uni.showToast({
				title: '请填写金额',
				icon: 'none'
			});
			return false
		}
		uni.showModal({
			title: '提示',
			content: '确定申请开票吗？金额￥' + FormData.value.price,
			cancelText: "取消",
			confirmText: "确定",
			success: function(res) {
				if (res.confirm) {
					Save()
				} else if (res.cancel) {
					console.log('用户点击取消');
				}
			}
		});
	}
	//获取上次填写的历史
	const getHistory = () => {
		InvoiceGetHistory().then(res => {
			if (res.status && res.data != null) {
				FormData.value.unit_type = res.data.unit_type
				FormData.value.unit_name = res.data.unit_name
				FormData.value.unit_num = res.data.unit_num
				FormData.value.receive_address = res.data.receive_address
				FormData.value.tel = res.data.tel
			}
		})
	}

	onLoad((e) => {
		if (e.ordernum != undefined) {
			FormData.value.link_order_num = e.ordernum
		}
		if (e.price != undefined && e.price > 0) {
			FormData.value.price = e.price
		}
	})
	onMounted(() => {
		getHistory()
	})
</script>

<style scoped>
	.invoice_edit {
		padding: 20rpx;
	}

	.top {
		text-align: center;
		background-color: #fff;
		padding: 20rpx 20rpx 40rpx 20rpx;
		border-radius: 20rpx;
	}

	.top_1 {
		margin-top: 20rpx;
	}

	.content {
		margin-top: 20rpx;
		background-color: #fff;
		padding: 20rpx;
		border-radius: 20rpx;
	}

	.form_wenzi {
		margin-top: 17rpx;
	}

	.leixing_select {
		display: flex;
	}

	.leixing_select_item {
		border: 1px solid #ccc;
		padding: 8rpx 30rpx;
		font-size: 22rpx;
		color: #a6a6a6;
	}

	.active {
		background-color: #18bc37;
		border: 1px solid #13a42e;
		color: #fff;
	}

	.addbutton {
		margin-top: 80rpx;
		background-color: coral;
		height: 80rpx;
		line-height: 80rpx;
		color: #fff;
	}
</style>