NurseStationApp/pages/ServiceDetails/ServiceDetails.vue

<template>
	<view class="app">
		<view class="OrderStatus" v-if="orderStatus=='REFUNDED'||orderStatus=='CANCEL'">
			订单已关闭
		</view>
		<view class="content">
			<view class="name">
				服务商家
			</view>
			<view class="details">
				<view class="detailslist">
					<image :src="baseurl+nursestationlist.stationPictureUrl" mode=""></image>
					<view class="model">
						<view class="top">
							<view>{{nursestationlist.nurseStationName}}</view>
						</view>
						<view class="bottom">
							<view>{{nursestationlist.address}}</view>
						</view>
						<view class="callme" @tap="gophone()">
							<u-icon class='icon' name="phone-fill" color="#ffffff" size="30"></u-icon>
							<view class="text">联系我们</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="content">
			<view class="name">
				服务项目
			</view>
			<view class="drug">·{{orderlist.nurseItemName}} </view>
		</view>
		<view class="content">服务信息
			<view class="contacts">·联系人：{{userinfo.patientName}}</view>
			<view class="contacts">·电话:{{userinfo.phone}}</view>
			<view class="contacts">·地址：{{userinfo.serviceAddress}}</view>
			<view class="contacts">·时间：{{userinfo.serviceDate}}</view>
		</view>
		<view class="Package">套餐信息：
			<span>￥{{orderlist.nurseItemPrice}}</span>
			<view class="detail">
				·{{orderlist.nurseItemName}}
			</view>
		</view>
		<view class="Consumablespackage" v-if='orderlist.itemConsumableList'>耗材包详情：
			<span>￥{{orderlist.itemConsumableList[0].consumablePrice}}</span>
			<view class="detail">
				·{{orderlist.itemConsumableList[0].consumableDetail}}
			</view>
		</view>
		<view class="remarks">
			<view>备注：</view>
			<input placeholder="" v-model='userinfo.remark'>
		</view>
		<view class="evaluate">
			<view class="cancelorder" @tap="cancelorderment()"
				v-if="orderStatus=='PAY'||orderStatus=='WAIT_DISPATCH'||orderStatus=='NOT_FINISH'">取消订单</view>
			<!-- <view class="cancelorder " style="background: #4C7BC9;">评价</view> -->
		</view>
	</view>
</template>

<script>
	import baseurl from '@/api/baseurl.js'
	import {
		getOrderPatientInfo,
		getAppStationItemInfo,
		introductionList,
		cancellationOrder
	} from '@/api/ServiceDetails/ServiceDetails.js'
	export default {
		data() {
			return {
				baseurl: '',
				userinfo: [], //被护理人
				orderlist: [], //获取耗材包详情
				nursestationlist: [], // 护理站信息列表
				stationId: '',
				stationItemId: '',
				stationItemPriceId: '',
				orderNo: '',
				orderStatus: '',
			}
		},
		onLoad(options) {
			this.stationId = options.stationId
			this.stationItemId = options.stationItemId
			this.stationItemPriceId = options.stationItemPriceId
			this.orderStatus = options.orderStatus
			this.orderNo = options.orderNo
			this.baseurl = baseurl
			this.getinfo()
			this.getlist()
			this.getPatientInfo()
		},
		methods: {
			gophone() {
				var that = this
				uni.getSystemInfo({
					success: function(res) {
						console.log(res)
						if (res.platform == 'ios') {
							uni.makePhoneCall({
								phoneNumber: that.nursestationlist.phone //仅为示例
							});
						} else {
							uni.showActionSheet({
								itemList: ['呼叫', ],
								success: function(res) {
									if (res.tapIndex + 1 == 1) {
										uni.makePhoneCall({
											phoneNumber: that.nursestationlist.phone //仅为示例
										});
									}
								},
								fail: function(res) {}
							});
						}
					}
				});
			},
			//被护理人信息
			getinfo() {
				getOrderPatientInfo(this.orderNo).then(res => {
					this.userinfo = res.data;
				})
			},
			// 护理站信息列表
			getlist() {
				introductionList(this.stationId).then(res => {
					this.nursestationlist = res[0];
				})
			},
			//获取耗材包详情
			getPatientInfo() {
				getAppStationItemInfo(this.stationId, this.stationItemId, this.stationItemPriceId).then(res => {
					this.orderlist = res.data
				})
			},
			cancelorderment() {
				uni.navigateTo({
					url: `/pages/cancelorder/cancelorder?nurseItemPrice=${this.orderlist.nurseItemPrice}&appointmentOrderId=${this.userinfo.appointmentOrderId}`
				})
			},
		}
	}
</script>

<style lang="scss">
	@import './ServiceDetails.scss';
</style>