xinelu-applet-ui/pagesB/hospitalcare/hospitalcare.vue

<template>
	<view class="app" v-if="orderlist.totalPrice">
		<view class="userinfo">
			<view class="item">
				<span>姓名：</span>
				<u-input :clearable='false' v-model="orderlist.caregiverName" type="text" placeholder='请输入'
					maxlength='30' />
			</view>
			<view class="item">
				<span>电话：</span>
				<u-input :clearable='false' v-model="orderlist.caregiverPhone" type="number" placeholder='请输入'
					maxlength='11' />
			</view>
			<view class="item">
				<span>医院：</span>
				<u-input :clearable='false' v-model="orderlist.hospitalName" type="text" placeholder='请输入'
					maxlength='20' />
			</view>
			<view class="item">
				<span>科室：</span>
				<u-input :clearable='false' v-model="orderlist.departmentName" type="text" placeholder='请输入'
					maxlength='20' />
			</view>
			<view class="item">
				<span>病床号：</span>
				<u-input :clearable='false' v-model="orderlist.hospitalBedNumber" type="text" placeholder='请输入'
					maxlength='20' />
			</view>
			<view class="item" style="border: none;" @tap='timepickertrue'>
				<span>时间：</span>
				<p v-if="timevalue" style='color: black;'>{{timevalue}}</p>
				<p v-else>请选择服务时间</p>
			</view>
		</view>
		<view class="bottomitem">
			<view class="item">
				<span>数量：</span>
				<u-number-box v-model="companionDays" @change="numbervalChange" bg-color='#557BC2' :min='1'
					color='#fff'>
				</u-number-box>
			</view>
		</view>
		<timepicker :timepicker="timepicker" @timeconfirm='timeconfirm' @input='timeclose'></timepicker>
		<u-toast ref="uToast" />
		<view class="updata">
			<view class="price">
				￥{{orderlist.totalPrice}}
			</view>
			<view class="purchase" @click="updata">
				购买
			</view>
		</view>
	</view>
</template>
<script>
	import timepicker from '../../components/timepicker/timepicker.vue'
	import {
		getAppStationItemInfo,
		appletAppointmentOrderPay
	} from '@/api/pagesB/appointmenttime/appointmenttime.js'
	import {
		accompanyingDiagnosis
	} from '@/api/pagesB/hospitalcare/index.js'
	export default {
		components: {
			timepicker
		},
		data() {
			return {
				timer: null,
				companionDays: 1,
				orderlist: {
					caregiverName: undefined,
					caregiverPhone: undefined,
					hospitalName: undefined,
					departmentName: undefined,
					hospitalBedNumber: undefined,
					nurseStationItemId: undefined,
					companionStartDate: undefined,
					companionEndDate: undefined,
					totalPrice: undefined,
					nurseItemPrice: undefined
				},
				timevalue: undefined,
				timepicker: false,
			}
		},
		onShow() {},
		onLoad(options) {
			this.orderlist.nurseStationItemId = options.stationItemId
			this.orderlist.nurseStationItemPriceId = options.stationItemPriceId
			this.getPatientInfo(options.stationId, options.stationItemId, options.stationItemPriceId)
		},
		watch: {
			companionDays() {
				this.orderlist.totalPrice = this.argMul(this.companionDays, this.orderlist.nurseItemPrice)
			},
		},
		methods: {
			updata() {
				var that = this
				this.orderlist.companionDays = this.companionDays
				this.orderlist.orderType = 'COMPANION_IN_HOSPITAL'
				this.orderlist.patientId = uni.getStorageSync('patientId');
				this.orderlist.orderCount = 1;
				this.orderlist.orderChannel = 'WECHAT_APPLET'
				accompanyingDiagnosis(this.orderlist).then(res => {
					if (res.code == 500) {
						that.$refs.uToast.show({
							title: res.msg,
							type: 'error'
						})
					} else if (res.code == 200) {
						let obj = {
							patientId: uni.getStorageSync('patientId'),
							openid: uni.getStorageSync('openid'),
							orderNo: res.data.orderNo,
							orderChannel: 'WECHAT_APPLET',
							paymentPrice: res.data.totalPrice,
							payType: "WECHAT_PAY",
							buySource: "NURSE_STATION",
						}
						appletAppointmentOrderPay(obj).then(response => {
							if (response.code == 200) {
								uni.requestPayment({
									timeStamp: response.data.timeStamp,
									nonceStr: response.data.nonceStr,
									package: response.data.prepayId,
									signType: response.data.signType,
									paySign: response.data.paySign,
									success: function(res) {
										uni.removeStorageSync('scenenurseStationId');
										that.$refs.uToast.show({
											title: '预约成功',
											type: 'success',
											duration: 1500,
										})
										if (that.timer) {
											clearTimeout(that.timer)
										}
										that.timer = setTimeout(e => {
											uni.redirectTo({
												url: `/pagesB/Nursingstationserviceorder/Nursingstationserviceorder`
												// url: `/pagesB/ServiceDetails/ServiceDetails?orderNo=${obj.orderNo}`
											})
										}, 1500)
									},
									fail: function(err) {
										that.$refs.uToast.show({
											title: '取消预约',
											type: 'error',
											duration: 1500,
										})
										if (that.timer) {
											clearTimeout(that.timer)
										}
										that.timer = setTimeout(e => {
											uni.redirectTo({
												url: `/pagesB/ServiceDetails/ServiceDetails?orderNo=${obj.orderNo}`
											})
										}, 1500)
									}
								});
							} else {
								that.$refs.uToast.show({
									title: response.msg,
									type: 'error',
									duration: 2000
								})
							}
						})
					}
				})
			},
			//获取耗材包详情
			getPatientInfo(stationId, stationItemId, stationItemPriceId) {
				getAppStationItemInfo(stationId, stationItemId, stationItemPriceId).then(res => {
					res.data.nurseItemContent = ''
					this.orderlist.totalPrice = res.data.nurseItemPrice
					this.orderlist.nurseItemPrice = res.data.nurseItemPrice
					this.orderlist.nurseItemName = res.data.nurseItemName
					this.orderlist.itemServeDurationUnit = res.data.serveDurationUnit;
				})
			},
			numbervalChange(e) {
				this.orderlist.orderCount = e.value
			},
			timeclose(e) {
				this.timepicker = false
			},
			timepickertrue() {
				this.timepicker = true
			},
			timeconfirm(e) {
				this.orderlist.companionStartDate = e.year + '-' + e.month + '-' + e.day
				this.orderlist.companionEndDate = e.year + '-' + e.endmonth + '-' + e.endday
				var starttime = e.year + '.' + e.month + '.' + e.day
				var endtime = e.year + '.' + e.endmonth + '.' + e.endday
				this.timevalue = starttime + ' - ' + endtime
				this.timepicker = false
			},
			argMul(arg1, arg2) {
				// 乘法函数
				var _this = this,
					m = 0,
					s1 = arg1.toString(),
					s2 = arg2.toString();
				try {
					m += s1.split(".")[1].length
				} catch (e) {}
				try {
					m += s2.split(".")[1].length
				} catch (e) {}
				return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m)
			},
		}
	}
</script>
<style lang="scss">
	.app {
		padding: 10rpx 0 0;

		.updata {
			width: 100%;
			height: 120rpx;
			background: #FFFFFF;
			position: fixed;
			bottom: 0;

			.purchase {
				position: absolute;
				right: 30rpx;
				top: 50%;
				transform: translateY(-50%);
				width: 190rpx;
				height: 60rpx;
				background: #F44B2F;
				border-radius: 30rpx;
				font-size: 32rpx;
				color: #FFFFFF;
				line-height: 60rpx;
				text-align: center;
			}

			.price {
				position: absolute;
				left: 30rpx;
				top: 50%;
				transform: translateY(-50%);
				font-size: 48rpx;
				font-weight: 500;
				color: #F44B2F;
			}
		}

		.bottomitem {
			height: 120rpx;
			line-height: 120rpx;
			position: relative;

			.u-numberbox {
				position: absolute;
				right: 5%;
				top: 50%;
				transform: translateY(-50%);
			}
		}

		.userinfo,
		.bottomitem {
			background: #FFFFFF;
			box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03);
			border-radius: 5rpx;
			width: 96%;
			margin: 0 auto 20rpx;
			padding-bottom: 5rpx;

			.item {
				width: 94%;
				margin: 0 auto;
				height: 120rpx;
				line-height: 120rpx;
				border-bottom: 1rpx solid #D8D4D4;
				position: relative;

				p {
					color: #c0c4cc;
					display: inline-block;
					height: 120rpx;
					line-height: 120rpx;
					position: absolute;
					left: 25%;
					top: 50%;
					width: 75%;
					transform: translateY(-50%);
					font-size: 30rpx;
				}

				.address {
					position: absolute;
					left: 25%;
					top: 50%;
					width: 75%;
					transform: translateY(-50%);
					display: inline-block;
					height: 120rpx;
					line-height: 120rpx;
					white-space: nowrap;
					text-overflow: ellipsis;
					overflow: hidden;
				}

				span {
					display: inline-block;
					line-height: 120rpx;
					height: 120rpx;
					width: 25%;
					font-size: 36rpx;
				}

				::v-deep .u-input__input {
					height: 120rpx;
					font-size: 30rpx;
				}

				::v-deep .uni-input-wrapper {
					display: inline-block;
					height: 120rpx;
					line-height: 120rpx;
				}

				::v-deep u-input {
					height: 120rpx;
					line-height: 120rpx;
					position: absolute;
					left: 25%;
					top: 50%;
					width: 75%;
					transform: translateY(-50%);
				}
			}
		}
	}
</style>