diff --git a/gasStation-uni/pagesRefuel/orderDetail/index.vue b/gasStation-uni/pagesRefuel/orderDetail/index.vue
new file mode 100644
index 000000000..4cb3e4c6b
--- /dev/null
+++ b/gasStation-uni/pagesRefuel/orderDetail/index.vue
@@ -0,0 +1,221 @@
+<template>
+	<!-- 订单详情页 -->
+	<view class="content">
+		<view class="container">
+			<view class="my-header">
+				<view class="my-icons" @click="goBack"> <uni-icons type="left" size="16"></uni-icons> </view>
+				<view class="my-text">支付订单</view>
+				<view class="my-icons"></view>
+			</view>
+			<!-- 顶部区域 -->
+			<view style="background-color: white;width: 94%;margin: 15px auto;">
+				<view style="font-weight: bold;height: 40px;line-height: 40px;margin-left: 10px;margin-top: 20px;">订单详情</view>
+				<view class="desc">
+					<view>油站名称</view>
+					<view>{{store.name}}{{store.description ? "("+store.description+")" : ""}}</view>
+				</view>
+				<view class="desc">
+					<view>油号油枪</view>
+					<view>{{oilName}}/{{oilOrder.oilGunNum}}</view>
+				</view>
+				<view class="desc">
+					<view>加油金额</view>
+					<view>{{oilOrder.orderAmount}}</view>
+				</view>
+				<view class="desc">
+					<view>加油数量</view>
+					<view>{{oilOrder.oilNum}}</view>
+				</view>
+				<view class="desc">
+					<view>油品单价</view>
+					<view>{{oilPrice}}/元</view>
+				</view>
+				<view class="desc">
+					<view>加油员工</view>
+					<view>{{staff.realName}}</view>
+				</view>
+			</view>
+			
+			<view style="background-color: white;width: 94%;margin: 15px auto;">
+				<view class="desc">
+					<view>优惠券</view>
+					<view>未选择优惠券</view>
+					<view class="my-icons"></view>
+				</view>
+				<view class="desc">
+					<view style="display: flex;">
+						加油金
+						<span style="color: red;display: flex;">(余额：0.00)<u-icon name="question-circle" color="red"></u-icon></span>
+					</view>
+					<view>未选择优惠券</view>
+				</view>
+			</view>
+			
+			<view style="background-color: white;width: 94%;margin: 15px auto;">
+				<view style="font-weight: bold;height: 40px;line-height: 40px;margin-left: 10px;margin-top: 20px;">支付方式</view>
+				<view class="desc">
+					<view>微信支付</view>
+					<u-radio-group v-model="value">
+						<u-radio name="wx"></u-radio>
+					</u-radio-group>
+				</view>
+			</view>
+
+			<!-- 支付信息 -->
+			<view class="bar">
+				<view style="margin-left: 20px;">
+					<view>
+						￥<span style="font-size: 22px;font-weight: bold;">0.01</span>
+					</view>
+					<view style="color: red;font-size: 12px;">应付金额</view>
+				</view>
+				<view style="margin-right: 20px;width: 30%;border-radius:30px;background-color: #1879ff;height: 40px;line-height: 40px;text-align: center;color: white">
+					确认支付
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import request from '../../utils/request'
+	export default {
+		data() {
+			return {
+				title: '',
+				value:'',
+				orderNo:"",
+				// 油品订单信息
+				oilOrder:{},
+				// 员工列表信息
+				staff: {},
+				// 店铺信息
+				store:{},
+				oilPrice:0,
+				// 油品名称
+				oilName:"",
+			}
+		},
+		onLoad(e) {
+			this.orderNo = e.orderNo
+			// this.orderNo = "20231201114800ebe24b"
+		},
+		onShow() {
+			this.getOilOrder();
+		},
+		components: {
+
+		},
+		methods: {
+			// 获取油品订单
+			getOilOrder(){
+				let _this = this;
+				request({
+					url: "business/oilOrder/orderNo",
+					method: 'post',
+					data: {orderNo:_this.orderNo},
+				}).then((res)=>{
+					_this.oilOrder = res.data
+					_this.getStaffList(res.data.staffId)
+					_this.getStore(res.data.storeId)
+					_this.getOilNumber(res.data.storeId)
+				})
+			},
+			// 获取门店信息
+			getStore(id){
+				let _this = this;
+				request({
+					url: "business/storeInformation/store/queryStoreById",
+					method: 'post',
+					data:{"storeId":id},
+				}).then((res)=>{
+					_this.store = res.data;
+				})
+			},
+			// 根据员工id获取员工信息
+			getStaffList(staffId){
+				let _this = this;
+				request({
+					url: "business/member/staff/" + staffId,
+					method: 'get',
+				}).then((res)=>{
+					_this.staff = res.data
+					console.log(res,1)
+				})
+			},
+			// 获取当前店铺油号信息
+			getOilNumber(storeId){
+				let _this = this;
+				request({
+					url: "business/petrolStationManagement/oilNumber/getOilNumberName/" + storeId,
+					method: 'get',
+				}).then((res)=>{
+					res.data.forEach(item => {
+						if (item.oilName == _this.oilOrder.oils){
+							_this.oilPrice = item.gbPrice;
+							_this.oilName = item.oilNames;
+						}
+					})
+				})
+			},
+			goBack() {
+				uni.navigateBack()
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.desc{
+		height: 35px;
+		line-height: 35px;
+		margin-left: 20px;
+		margin-right: 20px;
+		display: flex;
+		justify-content: space-between;
+		font-size: 15px;
+		color: rgba(0, 0, 0, 0.65);
+	}
+	.bar {
+		width: 100%;
+		height: 70px;
+		background-color: white;
+		position: fixed;
+		bottom: 0px;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+	}
+	
+	.content {
+		background: #f4f5f6;
+	}
+
+	.container {
+		width: 100%;
+		height: 100vh;
+		box-sizing: border-box;
+		padding-top: 88px;
+	}
+
+	.my-header {
+		width: 100%;
+		height: 88px;
+		background: #ffffff;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		color: #000;
+		box-sizing: border-box;
+		padding: 0px 15px;
+		padding-top: 40px;
+
+		.my-icons {
+			width: 20px;
+
+		}
+
+		position: fixed;
+		top: 0px;
+	}
+</style>
\ No newline at end of file