NurseStationApp/pages/appointmenttime/appointmenttime.vue

<template>
	<view class="app">
		<!-- <view class="message">请填写下面的信息</view> -->
		<view class="user">
			<view class="item">
				<span>姓名：</span>
				<span class='addition'>{{personInfo.patientName}}</span>
			</view>
			<view class="item">
				<span>电话：</span>
				<span class='addition'>{{personInfo.phone}}</span>
			</view>
			<view class="item">
				<span>地址：</span>
				<span class='addition'>{{personInfo.address}}</span>
			</view>
			<view class="selecttime" @tap='timeshow=true'>
				<span>时间：</span>
				<text v-if="usertime==''" class='addition'>请选择时间
					<image src="../../static/jiantou.png"></image>
				</text>
				<text v-else class='addition'>{{usertime}}</text>
			</view>
		</view>
		<view class="remarks">
			服务时长:
			<span style='padding-left: 30rpx;' class='addition'>{{orderlist.serveDurationUnit}}</span>
		</view>
		<view class="Package">套餐信息：
			<text class="money">￥{{orderlist.nurseItemPrice}}</text>
			<text class="detail">
				·<span style='padding-left: 10rpx;'>{{orderlist.nurseItemName}}</span>
			</text>
		</view>
		<view class="Consumablespackage">耗材包详情：
			<text class="money">￥{{orderlist.consumableTotalPrice}}</text>
			<view class="detail" v-for="(item,index) in orderlist.itemConsumableList">
				·<span style='padding-left: 10rpx;'>{{item.consumableDetail}}</span>
			</view>
		</view>
		<view class="remarks">
			<span>备注：</span>
			<input placeholder="">
		</view>
		<view class="radio-content" @tap="changeRadio">
			<view class="radio-right">
				<view class="radio" :class="radio == 2 ? 'radio-default':''">
					<view :class="radio == 2 ? 'radio-active':''"></view>
				</view>
			</view>
			<text class="agreement">我已阅读并同意</text>
			<text @tap='maskshow=true;showRegectAgreeButton=false'>《用户协议》</text>
		</view>
		<view class="priceback">
			<view class="prices">￥{{orderlist.totalPrice}}</view>
			<view class="xiugai" @tap='goaddress'>修改信息</view>
			<view class="queren" @tap='updata'>确认预约</view>
		</view>
		<u-toast ref="uToast" />
		<upicker v-model="timeshow" mode="time" start-year='2022' :params="timeparams" @confirm='timeconfirm'></upicker>
	</view>
</template>
<script>
	import {
		getAppStationItemInfo,
		getAppPatientList,
		submitAppointment
	} from '@/api/appointmenttime/appointmenttime.js'
	import baseurl from '@/api/baseurl.js'
	import upicker from '../picker/picker.vue'
	export default {
		components: {
			upicker
		},
		data() {
			return {
				timeparams: { //picker组件所需
					year: true,
					month: true,
					day: true,
					hour: true,
					endhour: true,
					minute: true,
					endminute: true,
				},
				timeshow: false, //时间开关
				maskshow: false, //用户协议开关
				radio: 1, //用户协议
				personInfo: [], //用户信息
				patientId: null,
				usertime: '', //页面展示时间
				orderlist: {
					orderCount: 1,
					patientId: '',
					stationId: '',
					stationItemId: '',
					stationItemPriceId: '',
					serviceAddress: "",
					serviceDate: "",
					serviceStartTime: "",
					serviceEndTime: "",
					nurseItemName: "",
					nurseItemPrice: '',
					serveDurationUnit: "",
					consumableTotalPrice: '',
					totalPrice: '',
					remark: "",
					orderConsumableList: []
				},
			}
		},
		onLoad(options) {
			if (options.updata) {
				this.orderlist = JSON.parse(options.updata)
			}
			if (options.useritem) {
				let useritem = JSON.parse(options.useritem)
				this.orderlist.serviceAddress = useritem.address
				this.personInfo.patientName = useritem.receiveName
				this.personInfo.phone = useritem.receivePhone
				this.personInfo.address = useritem.address
			} else {
				this.userinfo();
			}
			//耗材包详情方法调用
			this.getPatientInfo(options.stationId, options.stationItemId, options.stationItemPriceId)
		},
		methods: {
			userinfo() {
				//取出patientId
				var that = this
				uni.getStorage({
					key: 'patientId',
					success: function(res) {
						that.patientId = res.data
						console.log(that.patientId)
						//被护理人信息
						getAppPatientList(that.patientId).then(response => {
							that.personInfo = response.data
							that.personInfo.address = response.data.provinceName + response.data
								.cityName + response.data.regionName + response.data.streetName +
								response.data.address
							that.orderlist.patientId = response.data.patientId
							that.orderlist.serviceAddress = response.data.provinceName + response.data
								.cityName + response.data.regionName + response.data.streetName +
								response.data.address
						})
					}
				});
			},
			//获取耗材包详情
			getPatientInfo(stationId, stationItemId, stationItemPriceId) {
				let that = this;
				getAppStationItemInfo(stationId, stationItemId, stationItemPriceId).then(res => {
					if (res.code == 200) {
						this.orderlist = res.data
					}
				})
			},
			//确认预约
			updata() {
				if (this.radio == 1) {
					this.$refs.uToast.show({
						title: '请阅读用户协议并同意',
						type: 'error',
					})
				} else {
					this.orderlist.orderCount = 1;
					submitAppointment(this.orderlist).then(res => {
						if (res.code == 500) {
							this.$refs.uToast.show({
								title: res.msg,
								type: 'error',
							})
						} else if (res.code == 200) {
							this.$refs.uToast.show({
								title: '预约成功',
								type: 'success',
								toast: 1500
							})
							setTimeout(() => {
								uni.reLaunch({
									url: `/pages/Personal/Personal`
								})
							}, 1500)
						}
					})
				}

			},
			changeRadio() {
				if (this.radio == 1) {
					this.radio = 2;
				} else {
					this.radio = 1;
				}
			},
			//获取时间
			timeconfirm(e) {
				this.orderlist.serviceDate = e.year + '-' + e.month + '-' + e.day
				this.orderlist.serviceStartTime = e.hour + ":" + e.minute
				this.orderlist.serviceEndTime = e.endhour + ":" + e.endminute
				this.usertime = e.year + '年' + e.month + '月' + e.day + '日' + e.hour + ":" + e.minute + '至' + e.endhour +
					":" + e.endminute
				console.log(this.orderlist, this.usertime)
			},
			goaddress() {
				uni.navigateTo({
					url: `/pages/modifyAddress/modifyAddress?url=${'appointmenttime'}&updata=${JSON.stringify(this.orderlist)}`
				})
			},
		}
	}
</script>
<style lang="scss">
	@import './appointmenttime.scss'
</style>