diff --git a/api/Nursingstationserviceorder/Nursingstationserviceorder.js b/api/Nursingstationserviceorder/Nursingstationserviceorder.js
new file mode 100644
index 0000000..4fd1a85
--- /dev/null
+++ b/api/Nursingstationserviceorder/Nursingstationserviceorder.js
@@ -0,0 +1,7 @@
+import request from "../request.js"
+export function appServiceOrder(id,pageSize,pageNum) {
+	return request({
+		url: `/nurseApp/login/appServiceOrder?pageSize=${pageSize}&pageNum=${pageNum}&patientId=${id}`,
+		method: 'GET'
+	})
+}
diff --git a/api/ServiceDetails/ServiceDetails.js b/api/ServiceDetails/ServiceDetails.js
new file mode 100644
index 0000000..e4ec850
--- /dev/null
+++ b/api/ServiceDetails/ServiceDetails.js
@@ -0,0 +1,28 @@
+import request from "../request.js"
+
+export function getOrderPatientInfo(orderNo) {
+	return request({
+		url: `/nurseApp/login/getOrderPatientInfo?orderNo=${orderNo}`,
+		method: 'GET'
+	})
+}
+export function getAppStationItemInfo(stationId,stationItemId,stationItemPriceId) {
+	return request({
+		url: `/nurseApp/login/getAppStationItemInfo?stationId=${stationId}&stationItemId=${stationItemId}&stationItemPriceId=${stationItemPriceId}`,
+		method: 'GET'
+	})
+}
+
+export function introductionList(nurseStationId) {
+	return request({
+		url: `/nurseApplet/nearbyNursingStation/introductionList?nurseStationId=${nurseStationId}`,
+		method: 'GET'
+	})
+}
+
+export function cancellationOrder(appointmentOrderId) {
+	return request({
+		url: `/nurseApp/login/cancellationOrder?appointmentOrderId=${appointmentOrderId}`,
+		method: 'post'
+	})
+}
\ No newline at end of file
diff --git a/api/cancelorder/cancelorder.js b/api/cancelorder/cancelorder.js
new file mode 100644
index 0000000..d6172f8
--- /dev/null
+++ b/api/cancelorder/cancelorder.js
@@ -0,0 +1,8 @@
+import request from "../request.js"
+
+export function cancellationOrder(appointmentOrderId,cancelAppointmentReason) {
+	return request({
+		url: `/nurseApp/login/cancellationOrder?appointmentOrderId=${appointmentOrderId}&cancelAppointmentReason=${cancelAppointmentReason}`,
+		method: 'post'
+	})
+}
\ No newline at end of file
diff --git a/pages/Nursingstationserviceorder/Nursingstationserviceorder.vue b/pages/Nursingstationserviceorder/Nursingstationserviceorder.vue
index d14689e..70ea842 100644
--- a/pages/Nursingstationserviceorder/Nursingstationserviceorder.vue
+++ b/pages/Nursingstationserviceorder/Nursingstationserviceorder.vue
@@ -2,42 +2,22 @@
 	<view class="app">
 		<view class="content">
 			<view class="name">
-				2022-10-11 15:44
-				<span>待服务</span>
+				{{list.createTime}}
+				<span>{{list.orderStatus=='WAIT_PAY'?'待付款':''}}
+					{{list.orderStatus=='WAIT_DISPATCH'?'待派单':''}}
+					{{list.orderStatus=='NOT_FINISH'?'未完成':''}}
+					{{list.orderStatus=='COMPLETE'?'服务完成':''}}</span>
 			</view>
 			<view class="details">
 				<view class="detailslist">
 					<image src="/static/fuwutu.png" mode=""></image>
 					<view class="model">
 						<view class="top">
-							<span>换药</span>
-							<span>￥50.0</span>
+							<span>{{list.nurseItemName}}</span>
+							<span>￥{{list.totalPrice}}</span>
 						</view>
 						<view class="bottom">
-							<span>服务时长：1小时</span>
-						</view>
-					</view>
-				</view>
-				<view class="submit" @tap="gofinished" >
-					确认完成
-				</view>
-			</view>
-		</view>
-		<view class="content">
-			<view class="name">
-				2022-10-11 15:44
-				<span>完成</span>
-			</view>
-			<view class="details">
-				<view class="detailslist">
-					<image src="/static/fuwutu.png" mode=""></image>
-					<view class="model">
-						<view class="top">
-							<span>换药</span>
-							<span>￥50.0</span>
-						</view>
-						<view class="bottom">
-							<span>服务时长：1小时</span>
+							<span>服务时长：{{list.itemServeDurationUnit}}</span>
 						</view>
 					</view>
 				</view>
@@ -46,22 +26,37 @@
 				</view>
 			</view>
 		</view>
-
-
 	</view>
 </template>
 
 <script>
+	import baseurl from '@/api/baseurl.js'
+	import {
+		appServiceOrder
+	} from '@/api/Nursingstationserviceorder/Nursingstationserviceorder.js'
 	export default {
 		data() {
 			return {
-
+				patientId: 46,
+				pageNum: 1,
+				pageSize: 10,
+				list: [],
 			}
 		},
+		onLoad() {
+			this.getinfo()
+		},
 		methods: {
+			getinfo() {
+				appServiceOrder(this.patientId, this.pageNum, this.pageSize).then(res => {
+					// console.log(res)
+					this.list = res.rows[0];
+					console.log(this.list)
+				})
+			},
 			gofinished() {
 				uni.navigateTo({
-					url: '/pages/Service Details/Service Details'
+					url: '/pages/ServiceDetails/ServiceDetails'
 				})
 			},
 		}
diff --git a/pages/Service Details/Service Details.vue b/pages/ServiceDetails/ServiceDetails.vue
similarity index 66%
rename from pages/Service Details/Service Details.vue
rename to pages/ServiceDetails/ServiceDetails.vue
index fef5651..988bfe8 100644
--- a/pages/Service Details/Service Details.vue	
+++ b/pages/ServiceDetails/ServiceDetails.vue
@@ -9,10 +9,10 @@
 					<image src="/static/fuwutu.png" mode=""></image>
 					<view class="model">
 						<view class="top">
-							<span>济南护理万家有限公司</span>
+							<span>{{nursestationlist.nurseStationName}}</span>
 						</view>
 						<view class="bottom">
-							<span>济南市历下区和平路47号诚基中心 6号楼-118 </span>
+							<span>{{nursestationlist.address}}</span>
 						</view>
 					</view>
 				</view>
@@ -22,8 +22,9 @@
 						联系我们
 					</view>
 					<view class="Navigation">
-						<image src="/static/daohang.png" mode="">导航</image>
+						<image src="/static/daoh.png" mode="">导航</image>
 					</view>
+					
 				</view>
 			</view>
 		</view>
@@ -31,26 +32,26 @@
 			<view class="name">
 				服务项目
 			</view>
-			<view class="drug">·换药 </view>
+			<view class="drug">·{{orderlist.nurseItemName}} </view>
 		</view>
 
 		<view class="content" style="height: 390rpx;line-height: 60rpx;padding:3% ;">服务信息
-			<view class="contacts">·联系人：某某某</view>
-			<view class="contacts">·电话:1888888888</view>
-			<view class="contacts">·地址：某某省某某市某区</view>
-			<view class="contacts">·时间：10月10号</view>
+			<view class="contacts">·联系人：{{list.patientName}}</view>
+			<view class="contacts">·电话:{{list.phone}}</view>
+			<view class="contacts">·地址：{{list.serviceAddress}}</view>
+			<view class="contacts">·时间：{{list.serviceDate}}</view>
 
 		</view>
 		<view class="Package">套餐信息：
-			<span>￥50.0</span>
+			<span>￥{{orderlist.nurseItemPrice}}</span>
 			<view class="detail">
-				·气管切开置管护理
+				·{{orderlist.nurseItemName}}
 			</view>
 		</view>
-		<view class="Consumablespackage">耗材包详情：
-			<span>￥50.0</span>
-			<view class="detail">
-				·一次性换药包X1，一次性注射器X1
+		<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">
@@ -58,21 +59,68 @@
 			<input placeholder="">
 		</view>
 		<view class="evaluate">
-			<view class="cancelorder">取消订单</view>
+			<view class="cancelorder" @tap="cancelorderment()">取消订单</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 {
-
+				// patientId: 46,
+				list:[],
+				orderlist:[],//获取耗材包详情
+				nursestationlist:[],// 护理站信息列表
+				stationId:3,
+				stationItemId:3,
+				stationItemPriceId:4,
+				nurseStationId:2,
+				orderNo:'00001511774895025200',
+				appointmentOrderId:16,
 			}
 		},
+		onLoad() {
+			this.getinfo()
+			this.getPatientInfo()
+			this.getlist()
+		},
 		methods: {
-
+			getinfo() {
+				getOrderPatientInfo(this.orderNo).then(res => {
+					console.log(res)
+					this.list = res.data;
+					// console.log(this.list)
+				})
+			},
+			// 护理站信息列表
+			getlist() {
+				introductionList(this.nurseStationId).then(res => {
+					this.nursestationlist = res[0];
+					console.log(this.nursestationlist)
+				})
+			},
+			//获取耗材包详情
+			getPatientInfo(stationId, stationItemId, stationItemPriceId) {
+				getAppStationItemInfo(this.stationId, this.stationItemId, this.stationItemPriceId).then(res => {
+					this.orderlist = res.data
+					console.log(this.orderlist)
+					//被护理人信
+				})
+			},
+			cancelorderment(){
+					uni.navigateTo({
+						url: `/pages/cancelorder/cancelorder?nurseItemPrice=${this.orderlist.nurseItemPrice}`
+					})
+				},
 		}
 	}
 </script>
@@ -83,6 +131,7 @@
 		padding: 2%;
 		font-size: 36rpx;
 		padding-top: 10rpx;
+
 		// 服务商家
 		.detail {
 			margin-top: 3%;
@@ -93,6 +142,7 @@
 			margin-left: 10%;
 
 		}
+
 		.name {
 			width: 95%;
 			height: 90rpx;
@@ -102,7 +152,8 @@
 			border-bottom: 1rpx solid #D8D4D4;
 			margin: 0 auto;
 		}
-//按钮取消订单和评价
+
+		//按钮取消订单和评价
 		.evaluate {
 			display: flex;
 			float: right;
@@ -138,6 +189,7 @@
 				margin-left: 15%;
 			}
 		}
+
 		/* 耗材包 */
 		.Consumablespackage {
 			width: 94%;
@@ -180,7 +232,8 @@
 
 			}
 		}
-//服务项目和服务商家
+
+		//服务项目和服务商家
 		.content {
 			width: 95%;
 			height: 336rpx;
@@ -209,11 +262,10 @@
 
 			.details {
 				height: 250rpx;
-
 				.call {
 					display: flex;
-					margin-top: -5%;
-
+					margin-top: -7%;
+					margin-left: 3%;
 					.Navigation {
 						width: 103rpx;
 						height: 48rpx;
@@ -224,7 +276,6 @@
 						line-height: 48rpx;
 						margin-left: 3%;
 						text-align: center;
-
 						image {
 							width: 24rpx;
 							height: 24rpx;
diff --git a/pages/cancelorder/cancelorder.vue b/pages/cancelorder/cancelorder.vue
new file mode 100644
index 0000000..71ba8c3
--- /dev/null
+++ b/pages/cancelorder/cancelorder.vue
@@ -0,0 +1,113 @@
+<template>
+	<view class="app">
+		<view class="content">退款金额
+			<span>￥{{orderlist.nurseItemPrice}}</span>
+		</view>
+		<view class="reason">
+			<view class="ability">退款原因</view>
+			<input type="text" placeholder="请输入退款原因" v-model="cancelAppointmentReason">
+		</view>
+		<view class="ConfirmCancel" @tap="gocancel()">确认取消
+
+		</view>
+		<u-toast ref="uToast" />
+	</view>
+</template>
+
+<script>
+	import baseurl from '@/api/baseurl.js'
+	import {
+		cancellationOrder
+	} from '@/api/cancelorder/cancelorder.js'
+	export default {
+		data() {
+			return {
+				orderlist: [],
+				appointmentOrderId: 14,
+				cancelAppointmentReason: '',
+			}
+		},
+		onLoad(options) {
+			console.log(options)
+			this.orderlist.nurseItemPrice = options.nurseItemPrice
+
+		},
+		methods: {
+			gocancel() {
+				cancellationOrder(this.appointmentOrderId, this.cancelAppointmentReason).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: 1000
+						})
+					}
+
+				})
+			}
+
+		},
+	}
+</script>
+
+<style lang="scss">
+	.app {
+		background-color: #F4F5F7;
+		width: 100%;
+		height: 100vh;
+		color: #000000;
+
+		.ConfirmCancel {
+			width: 217rpx;
+			height: 68rpx;
+			background: #4C7BC9;
+			border-radius: 26rpx;
+			color: #FFFFFF;
+			line-height: 68rpx;
+			text-align: center;
+			margin-top: 65%;
+			float: right;
+		}
+
+		.reason {
+			width: 95%;
+			height: 342rpx;
+			background: #FFFFFF;
+			box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03);
+			border-radius: 20rpx;
+			margin: 10px auto;
+			padding: 2%;
+			font-size: 30rpx;
+
+			.ability {
+				width: 100%;
+				height: 60rpx;
+				border-bottom: 1rpx solid #D8D4D4;
+			}
+		}
+
+		.content {
+			width: 95%;
+			height: 96rpx;
+			background: #FFFFFF;
+			box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03);
+			border-radius: 20rpx;
+			margin: 0 auto;
+			line-height: 70rpx;
+			padding: 2%;
+			font-size: 30rpx;
+
+			span {
+				float: right;
+				font-size: 38rpx;
+				color: red;
+			}
+		}
+
+	}
+</style>
diff --git a/static/daoh.png b/static/daoh.png
new file mode 100644
index 0000000..758f9ed
Binary files /dev/null and b/static/daoh.png differ