xinelu-nurse-app/pages/taskDetails/taskDetails.vue

<template>
	<view class="app" v-if="baseurl">
		<view class="top">
			<view class="title">
				<image src="../../static/fuwu.png" mode=""></image>
				<view class="text">
					{{list.nurseItemName}}
				</view>
				<view class="righttext">
					<span v-if="list.orderCommissionAmount&&list.orderCommissionAmount>=0">
						￥{{list.orderCommissionAmount}}
					</span>
					<span v-else>
						￥ 0
					</span>
				</view>
			</view>
			<view class="content">
				<view class="time" style="line-height: 60rpx;padding-top: 15rpx;">
					单号：
					<span v-if="list.orderNo">{{list.orderNo}}</span>
				</view>
				<view class="time">
					时间：{{list.serviceDate}}
					<span style='padding-left: 10rpx;'>{{list.serviceStartTime}}</span>
				</view>
				<view class="address">
					地点：{{list.serviceAddress}}
				</view>
			</view>
		</view>
		<view class="top">
			<view class="title">
				<image src="../../static/user.png" mode=""></image>
				<view class="text">
					用户信息
				</view>
			</view>
			<view class="content" style="margin-top: 20rpx;">
				<view class="item">
					姓名：
					<span v-if="list.patientName">{{list.patientName}}</span>
				</view>
				<view class="item">
					年龄：{{list.age}}
					<span v-if="list.age>=0">{{list.age}}</span>
				</view>
				<view class="item">
					电话：
					<span v-if="list.phone">{{list.phone}}</span>
				</view>
				<view class="item address" @tap='getlocations'>
					<view class="text" style="line-height: 60rpx;">
						住址：
						<span v-if="list.address">{{list.address}}</span>
					</view>
					<view class="daohang">
						<image src="../../static/daohang.png" mode=""></image>
						<span class='p'>导航</span>
					</view>
				</view>
				<view class="item">
					是否失能：{{list.disablingCondition=="NOT_DISABLED"?'未失能':''}}
					{{list.disablingCondition=="DISABLED"?'已失能':''}}
				</view>
				<view class="item" v-if="list.disablingCondition=='DISABLED'">
					失能情况：
					<span v-if="list.disablingReason">{{list.disablingReason}}</span>
				</view>
			</view>
		</view>
		<span v-if="list.orderStatus=='NOT_FINISH'||list.orderStatus=='WAIT_RECEIVE'">
			<view class="btnsuccess" @tap='goconfirmCompletion' v-if="list.orderStatus=='NOT_FINISH'">
				去完成
			</view>
			<view class="btnsuccess" @tap='Receivingorders' v-if="list.orderStatus=='WAIT_RECEIVE'">
				接单
			</view>
			<view class="btnreturn" @tap='gotaskReturn'>
				退回
			</view>
		</span>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import {
		taskDetails
	} from '@/api/taskDetails/taskDetails.js'
	import {
		receiveOrders
	} from '@/api/Mymission/Mymission.js'
	import baseurl from '@/api/baseurl.js'
	export default {
		data() {
			return {
				nursePersonId: null, //护理员id
				baseurl: null,
				list: {}, //详情对象
				tude: { //经纬度
					latitude: null,
					longitude: null,
				},
				orderNo: null, //工单orderno
			}
		},
		methods: {
			//详情接口
			taskDetailsinfo(orderNo) {
				taskDetails(orderNo).then(res => {
					if (res.code == 200) {
						this.list = res.data
					}
					this.baseurl = baseurl
				})
			},
			//接单
			Receivingorders() {
				var obj = {
					"appointmentOrderId": this.list.orderDetailsId,
					"stationPersonId": this.nursePersonId,
					"appointmentOrderNo": this.list.orderNo
				}
				receiveOrders(obj).then(res => {
					if (res.code == 200) {
						this.$refs.uToast.show({
							title: '接单成功',
							type: 'success',
							duration: '1500'
						})
						this.taskDetailsinfo(this.orderNo)
					}
				})
			},
			//经纬度
			getlocations() {
				let that = this
				uni.request({
					url: 'https://apis.map.qq.com/ws/geocoder/v1/?address=',
					method: 'GET',
					data: {
						key: 'TXGBZ-VGEWW-LJHRR-3CDLI-N57YO-YQBHJ', //高德地图key
						address: that.list.address // 详细地址
					},
					success: function(res) {
						that.tude.latitude = res.data.result.location.lat
						that.tude.longitude = res.data.result.location.lng
						that.goaddress();
					},
					fail(err) {}
				})
			},
			//跳转地图
			goaddress() {
				let that = this
				uni.openLocation({
					latitude: Number(that.tude.latitude),
					longitude: Number(that.tude.longitude),
				})
			},
			//退回
			gotaskReturn() {
				uni.navigateTo({
					url: `/pages/taskReturn/taskReturn?item=${JSON.stringify(this.list)}`
				})
			},
			//去完成
			goconfirmCompletion() {
				uni.navigateTo({
					url: `/pages/confirmCompletion/confirmCompletion?list=${JSON.stringify(this.list)}&&orderDetailsId=${this.list.orderDetailsId}`
				})
			},
		},
		onLoad(options) {
			this.orderNo = options.orderNo
		},
		onShow() {
			var that = this
			const value = uni.getStorageSync('nursePersonId');
			if (value) {
				that.nursePersonId = value
			} else {}
			this.taskDetailsinfo(this.orderNo)
		},
	}
</script>

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