From eaaf3fb346beb2618e312f9a769826af4051e9ca Mon Sep 17 00:00:00 2001
From: huliyong <2783385703@qq.com>
Date: Tue, 3 Dec 2024 14:09:46 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=8A=E4=BC=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/api.js                        |  25 ++++++++
 components/base/navbar.vue        |  48 ++++++++++-----
 config.js                         |   2 +-
 mixins/list.js                    |  70 +++++++++++++++++++++
 mixins/share.js                   |  29 +++++++++
 pages.json                        |  11 +++-
 pages/index/cancelArticle.vue     |  75 +++++++++++++++++++++++
 pages/index/index.vue             |  11 +++-
 pages/index/order.vue             | 124 +++++++++-----------------------------
 pages_order/info/appoint.vue      |  75 ++++++++++++++++++++---
 pages_order/order/orderDetail.vue |   2 -
 11 files changed, 349 insertions(+), 123 deletions(-)
 create mode 100644 mixins/list.js
 create mode 100644 mixins/share.js
 create mode 100644 pages/index/cancelArticle.vue

diff --git a/api/api.js b/api/api.js
index 1dee580..ad3008f 100644
--- a/api/api.js
+++ b/api/api.js
@@ -77,6 +77,31 @@ const config = {
 		auth: true, 
 		showLoading : true,
 	},
+	//查询预约记录
+	queryReservation: {
+		url: '/applet_post/queryReservation',
+		method: 'GET',
+		auth: true, 
+	},
+	//查询预约详情
+	queryReservationDetail: {
+		url: '/applet_post/queryReservationDetail',
+		method: 'GET',
+		auth: true, 
+	},
+	//查询预约详情
+	queryReservationDetail: {
+		url: '/applet_post/queryReservationDetail',
+		method: 'GET',
+		auth: true, 
+	},
+	//取消预约
+	cancelReservation: {
+		url: '/applet_post/cancelReservation',
+		method: 'GET',
+		auth: true, 
+		showLoading : true,
+	},
 	
 }
 
diff --git a/components/base/navbar.vue b/components/base/navbar.vue
index a7526b9..49636c4 100644
--- a/components/base/navbar.vue
+++ b/components/base/navbar.vue
@@ -1,28 +1,34 @@
 <template>
-	<view class="navbar"
-	:style="{backgroundColor : bgColor}">
+<!-- 	<view class="navbar"
+	:style="{backgroundColor : bgColor}"> -->
 		<view class="title"
-		:style="{backgroundColor : bgColor}">
+		:style="{backgroundColor : bgColor,color}">
 			<view class="left">
+				
+				<uv-icon name="home"
+				v-if="leftClick && length == 1"
+				@click="toHome"
+				:color="color"  size="46rpx"></uv-icon>
+				
 				<uv-icon name="arrow-left"
-				v-if="leftClick"
+				v-else-if="leftClick"
 				@click="$emit('leftClick')"
-				color="#333" size="46rpx"></uv-icon>
+				:color="color"  size="46rpx"></uv-icon>
 			</view>
 			<view>{{ title }}</view>
 			<view class="icon">
 				
 				<uv-icon name="search"
 				v-if="isSearch"
-				color="#333" size="58rpx"></uv-icon>
+				:color="color"  size="58rpx"></uv-icon>
 				
-				<uv-icon name="plus-circle" color="#333" 
+				<uv-icon name="plus-circle" :color="color"  
 				v-if="isPlus"
 				@click="plusCircleShow = true"
 				size="46rpx" style="margin-left: 30rpx;"></uv-icon>
 				
 				<view v-if="moreClick" style="margin-left: 30rpx;">
-					<uv-icon name="more-dot-fill" color="#333"
+					<uv-icon name="more-dot-fill" :color="color" 
 					v-if="!moreText"
 					@click="moreClick()"
 					size="46rpx"></uv-icon>
@@ -34,7 +40,7 @@
 			</view>
 		</view>
 		
-	</view>
+	<!-- </view> -->
 </template>
 
 <script>
@@ -64,6 +70,9 @@
 			},
 			bgColor : {
 				default : '#fff'
+			},
+			color : {
+				default : '#333'
 			}
 		},
 		created() {
@@ -72,22 +81,31 @@
 		},
 		data() {
 			return {
+				length : getCurrentPages().length
 			};
 		},
 		methods : {
+			toHome(){
+				if(this.length != 1){
+					return
+				}
+				uni.reLaunch({
+					url: '/pages/index/index'
+				})
+			}
 		}
 	}
 </script>
 
 
 <style lang="scss" scoped>
-.navbar{
-	width: 100%;
-	height: 120rpx;
-	padding-top: var(--status-bar-height);
-}
+// .navbar{
+// 	width: 100%;
+// 	height: 120rpx;
+// 	padding-top: var(--status-bar-height);
+// }
 .title{
-	position: fixed;
+	position: sticky;
 	top: 0;
 	left: 0;
 	padding-top: calc(var(--status-bar-height) + 20rpx);
diff --git a/config.js b/config.js
index 4befc4c..b1943e6 100644
--- a/config.js
+++ b/config.js
@@ -7,7 +7,7 @@ import uvUI from '@/uni_modules/uv-ui-tools'
 Vue.use(uvUI);
 
 // 当前环境
-const type = 'prod'
+const type = 'dev'
 
 
 // 环境配置
diff --git a/mixins/list.js b/mixins/list.js
new file mode 100644
index 0000000..a27db1c
--- /dev/null
+++ b/mixins/list.js
@@ -0,0 +1,70 @@
+
+
+
+function query(self, queryParams){
+	// return (self.beforeGetData && self.beforeGetData()) ||
+	// queryParams || self.queryParams
+	
+	// 深度合并对象
+	return self.$utils.deepMergeObject(
+	
+	self.$utils.deepMergeObject(self.queryParams,
+	
+	(self.beforeGetData && self.beforeGetData()) || {}),
+	
+	queryParams)
+}
+
+
+
+export default {
+	data() {
+		return {
+			queryParams: {
+				pageNo: 1,
+				pageSize: 10,
+			},
+			total : 0,
+			list : [],
+		}
+	},
+	onPullDownRefresh() {
+		this.getData()
+	},
+	onReachBottom() {
+		this.loadMoreData()
+	},
+	onShow() {
+		this.getData()
+	},
+	methods: {
+		getData(queryParams){
+			return new Promise((success, error) => {
+				if(!this.mixinsListApi){
+					return console.error('mixinsListApi 缺失');
+				}
+				this.$api(this.mixinsListApi, 
+				query(this, queryParams), res => {
+					uni.stopPullDownRefresh()
+					if(res.code == 200){
+						
+						this.getDataThen && this.getDataThen(res.result.records, res.result.total, res.result)
+						
+						success(res.result)
+						
+						this[this.mixinsListKey || 'list'] = res.result.records || res.result
+						
+						this.total = res.result.total || res.result.length
+					}
+				})
+			})
+		},
+		loadMoreData(){
+			console.log('loadMoreData----', this.queryParams.pageSize < this.total);
+			if(this.queryParams.pageSize < this.total){
+				this.queryParams.pageSize += 10
+				this.getData()
+			}
+		},
+	}
+}
\ No newline at end of file
diff --git a/mixins/share.js b/mixins/share.js
new file mode 100644
index 0000000..13e20f5
--- /dev/null
+++ b/mixins/share.js
@@ -0,0 +1,29 @@
+export default {
+	data() {
+		return {
+			// 默认的全局分享内容
+			share: {
+				title: '补周到',
+				path: '/pages/index/index',    // 全局分享的路径，比如 首页
+				// imageUrl: '/static/image/login/logo.png',    // 全局分享的图片(可本地可网络)
+			}
+		}
+	},
+	// 定义全局分享
+	// 1.发送给朋友
+    onShareAppMessage(res) {
+        return {
+			title: this.share.title,
+			path: this.share.path,
+			imageUrl: this.share.imageUrl,
+		}
+    },
+	//2.分享到朋友圈
+    onShareTimeline(res) {
+        return {
+			title: this.share.title,
+			path: this.share.path,
+			imageUrl: this.share.imageUrl,
+		}
+    },
+}
\ No newline at end of file
diff --git a/pages.json b/pages.json
index 74c6ba1..a7855b4 100644
--- a/pages.json
+++ b/pages.json
@@ -14,6 +14,15 @@
 		},
 		{
 			"path": "pages/index/article"
+		},
+		{
+			"path": "pages/index/cancelArticle"
+		},
+		{
+			"path": "pages/index/order",
+			"style": {
+				"enablePullDownRefresh": true
+			}
 		}
 	],
 	"preloadRule": {
@@ -41,7 +50,7 @@
 	}],
 	"globalStyle": {
 		"navigationBarTextStyle": "black",
-		"navigationBarTitleText": "酒店桌布",
+		"navigationBarTitleText": "",
 		"navigationBarBackgroundColor": "#F8F8F8",
 		"backgroundColor": "#F8F8F8",
 		"navigationStyle": "custom"
diff --git a/pages/index/cancelArticle.vue b/pages/index/cancelArticle.vue
new file mode 100644
index 0000000..afe8ee2
--- /dev/null
+++ b/pages/index/cancelArticle.vue
@@ -0,0 +1,75 @@
+<template>
+	<view class="home">
+			
+		<image src="/static/image/bg/1.png"
+		class="page-bg"
+		mode="aspectFill"></image>
+		
+		<view class="content_now">
+			<view class="article">
+				<uv-parse :content="configList.cancel_value"></uv-parse>
+			</view>
+		</view>
+		
+		<view class="an">
+			<view class="btn2"
+			@click="next">
+				返回
+			</view>
+			<text class="second-color">{{ configList.bg_title }}</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { mapState } from 'vuex'
+	export default {
+		computed : {
+			...mapState(['articleList', 'configList']),
+		},
+		data() {
+			return {
+				key : 'cancel_value'
+			}
+		},
+		onLoad(args) {
+			this.key = args.key || 'cancel_value'
+		},
+		methods: {
+			next(){
+				uni.reLaunch({
+					url: '/pages/index/index'
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.article{
+		width: 600rpx;
+		font-size: 28rpx;
+		line-height: 50rpx;
+	}
+	.an{
+		position: fixed;
+		bottom: 330rpx;
+		text-align: center;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		width: 100%;
+	}
+	.second-color{
+		margin-top: 20rpx;
+	}
+	.btn2 {
+		border: 4rpx solid $uni-color;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		padding: 16rpx 200rpx;
+		color: $uni-color;
+		border-radius: 10rpx;
+	}
+</style>
\ No newline at end of file
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 9853519..4f6bf73 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -25,6 +25,10 @@
 					点击进入
 				</view>
 			</view>
+			<view class="link"
+			@click="$utils.navigateTo('/pages/index/order')">
+				预约记录
+			</view>
 		</view>
 	</view>
 </template>
@@ -53,5 +57,10 @@
 </script>
 
 <style lang="scss" scoped>
-
+.link{
+	margin-top: 30rpx;
+	font-size: 26rpx;
+	color: $uni-color;
+	text-decoration: underline;
+}
 </style>
\ No newline at end of file
diff --git a/pages/index/order.vue b/pages/index/order.vue
index 7a53962..cfacaec 100644
--- a/pages/index/order.vue
+++ b/pages/index/order.vue
@@ -1,36 +1,34 @@
 <template>
-	<view class="page">
+	<view class="pagea">
 		
-		<navbar
-		title="订单中心"
-		/>
+		<navbar 
+		title="预约列表" 
+		leftClick 
+		@leftClick="$utils.navigateBack" />
 		
-		<uv-tabs :list="tabs" 
+		<!-- <uv-tabs :list="tabs" 
 		:activeStyle="{color : '#FD5100', fontWeight : 600}"
 		lineColor="#FD5100"
 		lineHeight="8rpx"
 		lineWidth="50rpx"
-		@click="clickTabs"></uv-tabs>
+		@click="clickTabs"></uv-tabs> -->
 		
-		<view v-if="orderList.length > 0" class="list">
+		<view class="list">
 			<view class="item" 
-			v-for="(item, index) in orderList.records" 
+			v-for="(item, index) in list" 
 			@click="toOrderDetail(item.id)"
 			:key="index">
 	
 				<view class="top">
 					<view class="service">
-						<text>{{item.projectId_dictText}}</text>
-						<text>{{item.type_dictText}}</text>
-					</view>
-					<view class="status">
-						<text> {{item.state_dictText}}</text>
+						<text>预约日期：{{item.yearValue}}-{{item.monthDay}}</text>
 					</view>
 				</view>
 	
-				<view class="content">
+				<view class="contenta">
 	
-					<view class="left">
+					<view class="left"
+					v-if="item.image">
 						<image mode="aspectFill" :src="item.image"></image>
 					</view>
 	
@@ -39,56 +37,36 @@
 							客户姓名：{{item.name}}
 						</view>
 						<view class="text-hidden-1">
-							产品规格：{{item.unit}}
+							电话：{{item.phone}}
 						</view>
 						<view class="text-hidden-1">
-							租赁地址：{{item.address}}
+							预约时间：{{item.dayTime}}
 						</view>
-						<!-- <view class="text-hidden-1">
-							总计时间：{{item.useTime}}分钟
-						</view> -->
-						
 					</view>
 	
 				</view>
 	
 				<view class="bottom">
-					<view class="price">
-						总价格：<text class="num">{{item.money}}元</text>
-					</view>
-					<view class="b1">
-						查看物流
-					</view>
-					<!-- <view @click.stop="toPayOrder(item)" class="b2" v-if="item.state == 0">
-						立即付款
-					</view>
-					<view class="b1" @click.stop="moreOrder(item.projectId,toPlaceorder)" v-if="item.state == 3">
-						再来一单
-					</view>
-					<view class="b2" @click.stop="toEvaluate(item.id,item.projectId,item.technicianId)" v-if="item.state == 3">
-						立即评价
-					</view>
-					<view class="b2" @click.stop="moreOrder(item.projectId,toPlaceorder)" v-if="item.state == 4">
-						再来一单
-					</view> -->
+					地址：{{ item.province }}
+					{{ item.city }}
+					{{ item.area }}
+					{{ item.address }}
 				</view>
 	
 			</view>
 		</view>
 		
-		<tabber select="2"/>
 	</view>
 </template>
 
 <script>
-	import tabber from '@/components/base/tabbar.vue'
 	import { mapGetters } from 'vuex'
+	import mixinsList from '@/mixins/list.js'
 	export default {
+		mixins : [mixinsList],
 		components : {
-			tabber,
 		},
 		computed : {
-			...mapGetters(['userShop']),
 		},
 		data() {
 			return {
@@ -108,77 +86,33 @@
 						name: '退货退款'
 					}
 				],
-				queryParams: {
-					pageNo: 1,
-					pageSize: 10
-				},
-				// orderList: [
-				// 	{
-				// 		money : 99.99,
-				// 		address : '广东省广州市越秀区城南故事C3栋2802',
-				// 		name : '李**',
-				// 		phone : '150*****091',
-				// 		unit : '120*40*75【桌子尺寸】',
-				// 		image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg',
-				// 		state_dictText : '已完成',
-				// 	}
-				// ], //订单列表数据
-				orderList : {
-					records : [],
-					total : 0,
-				},
-				state : -1,
+				mixinsListApi : 'queryReservation',
 			}
 		},
 		onShow() {
-			this.orderPage()
-		},
-		//滚动到屏幕底部
-		onReachBottom() {
-			if(this.queryParams.pageSize < this.orderList.total){
-				this.queryParams.pageSize += 10
-				this.orderPage()
-			}
 		},
 		methods: {
-			orderPage(){
-				let queryParams = {
-					...this.queryParams,
-				}
-				if(this.state != -1){
-					queryParams.state = this.state
-				}
-				this.$api('orderPage', queryParams, res => {
-					if(res.code == 200){
-						this.orderList = res.result
-					}
-				})
-			},
 			//点击tab栏
 			clickTabs(index) {
 				if (index == 0) {
-					this.state = -1;
 				} else {
-					this.state = index - 1;
 				}
 				this.queryParams.pageSize = 10
-				this.orderPage()
+				this.getData()
 			},
+			
 			//跳转订单详情页面
 			toOrderDetail(id) {
 				uni.navigateTo({
-					url: '/pages_order/order/orderDetail?id=' + id
+					url: '/pages_order/info/appoint?id=' + id
 				})
 			},
-			getOrderList(){
-				
-			},
 		}
 	}
 </script>
 
 <style scoped lang="scss">
-	.page{
+	.pagea{
 	}
 	.list {
 		.item {
@@ -193,7 +127,7 @@
 				display: flex;
 				justify-content: space-between;
 				align-items: center;
-				font-size: 30rpx;
+				font-size: 26rpx;
 	
 				.service {}
 	
@@ -203,7 +137,7 @@
 				}
 			}
 	
-			.content {
+			.contenta {
 				display: flex;
 				margin: 10rpx 0;
 	
@@ -220,7 +154,7 @@
 				}
 	
 				.right {
-					width: calc(100% - 160rpx);
+					flex: 1;
 					color: #777;
 					font-size: 24rpx;
 					padding-left: 20rpx;
diff --git a/pages_order/info/appoint.vue b/pages_order/info/appoint.vue
index ff12294..d319101 100644
--- a/pages_order/info/appoint.vue
+++ b/pages_order/info/appoint.vue
@@ -6,7 +6,9 @@
 		mode="aspectFill"></image>
 		
 		<view class="content_now">
-			<view class="flex-col" style="width: 600rpx; padding: 20rpx 0; gap: 10rpx; border-radius: 12rpx;  border: 2rpx solid #ecb864;">
+			<view class="flex-col" 
+			v-if="!id"
+			style="width: 600rpx; padding: 20rpx 0; gap: 10rpx; border-radius: 12rpx;  border: 2rpx solid #ecb864;">
 				<span style="font-size: 25rpx;">请选择您方便的时间，</span>
 				<span style="font-size: 25rpx;">我们将根据您的日程为您安排上门威士忌品鉴服务，</span>
 				<span style="font-size: 25rpx;">确保您能在舒适的环境中尽享专属体验</span>
@@ -14,7 +16,7 @@
 			<span class="font-bold" style="margin-top: 10rpx;">预约信息</span>
 			<view class="" style="width: 600rpx;">
 				<view class="flex-sb" style="margin-top: 10rpx;"
-				@click="$refs.datetimePicker.open()">
+				@click="id || $refs.datetimePicker.open()">
 					<view class="date">
 						{{ $dayjs(date).format('YYYY') }}年
 						<img src="../static/info/a.png" style="width: 25rpx; height: 25rpx;"/>
@@ -32,21 +34,29 @@
 					<view class="flex-center" style="align-items: flex-end;">
 						<view class="flex-start-col" style="gap: 10rpx;">
 							<span>姓名:</span>
-							<input v-model="form.username" type="text" class="input" style="width: 20vw;"></input>
+							<input v-model="form.username" 
+							:disabled="id"
+							type="text" class="input" style="width: 20vw;"></input>
 						</view>
 						<!-- <span style="margin-left: 20rpx; color: #dddddc; font-size: 26rpx;">(最开始填写的直接导入)</span> -->
 					</view>
 					<view class="flex-center" style="align-items: flex-end;">
 						<view class="flex-start-col" style="gap: 10rpx;">
 							<span>联系电话:</span>
-							<input v-model="form.phone" type="tel" class="input"></input>
+							<input v-model="form.phone" 
+							:disabled="id"
+							type="tel" class="input"></input>
 						</view>
 						<!-- <span style="margin-left: 20rpx; color: #dddddc; font-size: 26rpx;">(最开始填写的直接导入)</span> -->
 					</view>
 					<view class="flex-center">
 						<view class="flex-start-col" style="gap: 10rpx; width: 80vw;">
 							<span>地址: {{ addressCity }}</span>
-							<input v-model="address.address" placeholder="请输入详情地址" type="text" class="input" style="width: 100%; height: 60rpx;"></input>
+							<input v-model="address.address" 
+							:disabled="id"
+							placeholder="请输入详情地址" 
+							type="text" class="input" 
+							style="width: 100%; height: 60rpx;"></input>
 						</view>
 					</view>
 				</view>
@@ -58,10 +68,16 @@
 				<view class="btn2" style="padding: 16rpx 80rpx;" @click="pre">
 					返回
 				</view>
-				<view class="btn2" style="padding: 16rpx 80rpx;" @click="submit">
-					<!-- 确定 / 提交 -->
+				<view class="btn2" 
+				v-if="!id"
+				style="padding: 16rpx 80rpx;" @click="submit">
 					预约
 				</view>
+				<view class="btn2" 
+				v-else
+				style="padding: 16rpx 80rpx;" @click="closeSubmit">
+					取消预约
+				</view>
 			</view>
 			<text class="second-color">{{ configList.bg_title }}</text>
 		</view>
@@ -102,6 +118,7 @@
 					username:'',
 					phone:'',
 				},
+				id : 0,
 			}
 		},
 		computed : {
@@ -112,7 +129,11 @@
 			},
 			...mapState(['problemList', 'configList', 'queryMyLog']),
 		},
-		onLoad() {
+		onLoad(args) {
+			if(args.id){
+				this.id = args.id
+				return
+			}
 			if(uni.getStorageSync('user_address')){
 				this.address = JSON.parse(uni.getStorageSync('user_address'))
 			}
@@ -120,7 +141,26 @@
 				this.form = JSON.parse(uni.getStorageSync('user_phone'))
 			}
 		},
+		onShow() {
+			this.getDetail()
+		},
 		methods: {
+			getDetail(){
+				if(!this.id){
+					return
+				}
+				this.$api('queryReservationDetail',{
+					id : this.id
+				}, res => {
+					if(res.code == 200){
+						this.date = new Date(`${res.result.yearValue}-${res.result.monthDay} ${res.result.dayTime}:00`).getTime()
+						this.address = res.result
+						this.address.district = res.result.area
+						this.form = res.result
+						this.form.username = res.result.name
+					}
+				})
+			},
 			next() {
 				// uni.navigate
 				
@@ -181,6 +221,25 @@
 					}
 				})
 			},
+			// 取消预约
+			closeSubmit(){
+				uni.showModal({
+					title: '确认取消预约吗？',
+					success: (res) => {
+						if(res.confirm){
+							this.$api('cancelReservation', {
+								id : this.id
+							}, res => {
+								if(res.code == 200){
+									uni.navigateTo({
+										url: '/pages/index/cancelArticle?key=cancel_value'
+									})
+								}
+							})
+						}
+					}
+				})
+			},
 		},
 	}
 </script>
diff --git a/pages_order/order/orderDetail.vue b/pages_order/order/orderDetail.vue
index 8ca27b7..4da01ac 100644
--- a/pages_order/order/orderDetail.vue
+++ b/pages_order/order/orderDetail.vue
@@ -213,10 +213,8 @@
 </template>
 
 <script>
-	import { mapGetters } from 'vuex'
 	export default {
 		computed : {
-			...mapGetters(['userShop']),
 		},
 		data() {
 			return {