首次提交

+{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
+  // launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
+    "version": "0.0",
+    "configurations": [{
+     	"default" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"mp-weixin" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"type" : "uniCloud"
+     }
+    ]
+}

+<script>
+	export default {
+		onLaunch: function() {
+			console.log('App Launch')
+		},
+		onShow: function() {
+			console.log('App Show')
+		},
+		onHide: function() {
+			console.log('App Hide')
+		}
+	}
+</script>
+
+<style lang="scss">
+	/*每个页面公共css */
+	@import "@/uni_modules/uview-ui/index.scss";
+	@import url('~@/static/css/YouSheBiaoTiHei.css');
+	*{
+		padding: 0;
+		margin: 0;
+		box-sizing: border-box;
+	}
+	.container_box{
+		min-height: 100vh;
+		background-color: #f6f6f6;
+		padding: 24rpx 30rpx;
+		box-sizing: border-box;
+	}
+</style>

+const http = uni.$u.http
+// 获取运动类型列表
+export const getSportList = (data) =>  http.get('/system/sports/list', {params: data, custom: {auth: true} })
+
+/**
+ * 查询球馆列表
+ * @param {
+	 longitude,
+	 latitude
+ }
+ * @returns {
+	 businessId, businessName, businessLicenseNo, gymName, contacts, contactsPhone, province, city, county, address, gymNum,
+	 serviceCharge, commission, username, businessLicensePicture, gymPicture, longitude, latitude, sportsRange, distance, rank, price, businessTime
+	}
+ */
+export const getArenaList = (data) => http.get('/ground-business/business/list', {params: data, custom: {auth: true} })
+
+/**
+ * 根据id查询球馆
+ * @param {
+	 businessId: 球馆ID
+ }
+ * @returns {
+	 businessId, businessName, businessLicenseNo, gymName, contacts, contactsPhone, province, city, county, address, gymNum,
+	 serviceCharge, commission, username, businessLicensePicture, gymPicture, longitude, latitude, sportsRange, distance, rank, price, businessTime
+	}
+ */
+export const getArenaDetail = (businessId) => http.get(`/ground-business/business/${businessId}`, {custom: {auth: true} })
+
+/**
+ * 发起约球
+ * @param {
+	 groundId: 场地id,
+	 peopleNum: 参与人数（不包括发起人）,
+	 orderDate: 订场日期,
+	 hourList: {
+		 startHour: 开始时间,
+		 endHour: 结束时间
+	 }
+ }
+ * @returns {
+	 orderId, orderNo, belongGym, groundNum, orderTime, appointmentStartTime, appointmentEndTime,
+	 payAmount, peopleNum, serviceCharge, commission, orderType, state, businessId, clientId, groundId
+	}
+ */
+export const sendBall = (data) => http.post('/ground-business/ground/createDateOrder', data, {custom: {auth: true} })

+const http = uni.$u.http
+// 用户登录
+export const userLogin = (data, config= {}) => http.post('/login', data, config)
+
+// 商家注册
+/* data参数
+{
+  "username":  用户名
+  "password":  密码
+  "businessName": 商家名称
+  "businessLicenseNo": 统一社会信用代码
+  "gymName": 球馆名称
+  "contacts": 联系人
+  "contactsPhone": 联系人电话
+  "province": 省
+  "city": 市
+  "county": 县
+  "address": 地址
+  "gymPicture" 球馆图片
+}
+*/
+export const userReg = ({ username, password, businessName, businessLicenseNo, gymName, contacts, contactsPhone, province, city, county, address, gymPicture }) => {
+	return request({
+		url: '/register',
+		method: 'post',
+		data: {
+			username,
+			password,
+			businessName,
+			businessLicenseNo,
+			gymName,
+			contacts,
+			contactsPhone,
+			province,
+			city,
+			county,
+			address,
+			gymPicture
+		}
+	})
+}

+<template>
+	<view class="comment_card" :class="{isPadding: isPadding}">
+		<CommentRate></CommentRate>
+		<view class="comment_content u-line-2">
+			不错不错，这个地方环境非常好，水饮料种类也很多，非常推荐过来，尤其是附近的小伙伴一定要过来看看
+		</view>
+		<!-- 评价图片 -->
+		<u-album :urls="urls2" :rowCount="4"></u-album>
+	</view>
+</template>
+
+<script>
+	import CommentRate from './commentRate.vue'
+	export default{
+		components: { CommentRate },
+		props: {
+			isPadding: {
+				type: Boolean,
+				default: false
+			}
+		},
+		data(){
+			return {
+				urls2: [
+					'https://cdn.uviewui.com/uview/album/1.jpg',
+					'https://cdn.uviewui.com/uview/album/2.jpg',
+					'https://cdn.uviewui.com/uview/album/3.jpg',
+					'https://cdn.uviewui.com/uview/album/4.jpg',
+					'https://cdn.uviewui.com/uview/album/5.jpg',
+					'https://cdn.uviewui.com/uview/album/6.jpg',
+					'https://cdn.uviewui.com/uview/album/7.jpg',
+					'https://cdn.uviewui.com/uview/album/8.jpg',
+					'https://cdn.uviewui.com/uview/album/9.jpg',
+					'https://cdn.uviewui.com/uview/album/10.jpg'
+				]
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.comment_card{
+		margin-top: 40rpx;
+		background-color: #fff;
+	}
+	.isPadding{
+		border-radius: 16rpx;
+		padding: 30rpx 24rpx 40rpx;
+	}
+	.comment_content{
+		color: #333;
+		font-size: 24rpx;
+		line-height: 40rpx;
+		margin: 24rpx 0 18rpx 0;
+	}
+	.album {
+		@include flex;
+		align-items: flex-start;
+	
+		&__avatar {
+		 background-color: $u-bg-color;
+		 padding: 5px;
+		 border-radius: 3px;
+		}
+	
+		&__content {
+			 margin-left: 10px;
+			 flex: 1;
+		}
+	}
+</style>

+<template>
+	<view class="commentRate">
+		<view class="left">
+			<image class="avatar" src="@/static/logo.png" mode="widthFix"></image>
+		</view>
+		<view class="right">
+			<view class="info">
+				<view class="top">
+					<text class="name">CLOOL</text>
+					<text class="arenaNum">预订场号：3号场</text>
+				</view>
+				<u-rate :count="count" active-color="#FF9900" size="20" inactiveColor="#CDCDCD" v-model="value"></u-rate>
+			</view>
+			<view class="comment_time">2022-12-26</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return {
+				count: 5,
+				value: 2
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.commentRate{
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		font-size: 24rpx;
+		line-height: 32rpx;
+		color: #999;
+		.left{
+			width: 64rpx;
+			height: 64rpx;
+			border-radius: 50%;
+			overflow: hidden;
+			margin-right: 16rpx;
+			.avatar{
+				width: 100%;
+				height: 100%;
+			}
+		}
+		.right{
+			display: flex;
+			justify-content: space-between;
+			flex: 1;
+			height: 100%;
+			.top	{
+				margin-bottom: 8rpx;
+				.name{
+					color: #333;
+					margin-right: 10rpx;
+				}
+			}
+		}
+	}
+</style>

+<template>
+	<view class="box">
+		<u-cell-group v-if="headTitle !== ''" :border="false">
+			<u-cell :title="headTitle" :titleStyle="{color: '#333', fontSize: '24rpx'}">
+				<text slot="right-icon" style="font-size: 24rpx;font-weight: 500;" :style="{color: colorState(state)}">{{ orderState(state) }}</text>
+			</u-cell>
+		</u-cell-group>
+		<view class="orderInfo">
+			<view class="order_line" :class="{isBorder: border}" v-for="(item, index) in lineInfo" :key="index">
+				<text class="left_text">{{ item.title }}</text>
+				<u-avatar v-if="item.type === 'avatar'" :src="userInfo[item.valueName]"></u-avatar>
+				<text v-if="item.type === 'text'">{{ item.valueName }}</text>
+				<u--input
+					v-if="item.type === 'input'"
+					:customStyle="{border: 0, width: '200rpx'}"
+					:placeholder="userInfo[item.valueName]"
+					v-model="userInfo[item.valueName]"
+					inputAlign="right"
+					color="#333"
+					fontSize="13px"
+					border="surround"
+					@blur="UpdataInfo"
+				/>
+			</view>
+		</view>
+		<u-cell-group v-if="rightTitle !== ''" :border="false">
+			<u-cell :title="rightTitle" :titleStyle="{color: '#666', fontSize: '24rpx'}">
+				<MyButton v-show="state === 2"  slot="right-icon" title="立即支付" size="small"></MyButton>
+				<MyButton v-show="state === 1" slot="right-icon" title="取消/退款" size="small" color="#666666" bgColor="#F6F6F6"></MyButton>
+				<MyButton v-show="state === 3" slot="right-icon" size="small" title="去评价"></MyButton>
+				<MyButton v-show="state === 6" slot="right-icon" size="small" title="亮核销码" @comfirn="showQR"></MyButton>
+			</u-cell>
+		</u-cell-group>
+	</view>
+</template>
+
+<script>
+	import MyButton from '@/components/myButton.vue'
+	export default {
+		props: {
+			lineInfo: {
+				type: Array,
+				require: true
+			},
+			border: {
+				type: Boolean,
+				default: false
+			},
+			headTitle: {
+				type: String,
+				default: ''
+			},
+			rightTitle: {
+				type: String,
+				default: ''
+			},
+			state: {
+				type: Number,
+				default: 0
+			}
+		},
+		components: { MyButton },
+		data(){
+			return {
+				userInfo: {
+					avatar: 'https://cdn.uviewui.com/uview/album/1.jpg',
+					nickname: 'CLOOL',
+					sex: '男',
+					phoneNum: '13336668888',
+					Birthday: '1999-12-26'
+				},
+			}
+		},
+		computed: {
+			orderState(){
+				return (index) => {
+					let orderObj ={
+						1: '已完成',
+						2: '待支付',
+						3: '待评价',
+						4: '已取消',
+						5: '退款/售后',
+						6: '待使用'
+					}
+					return orderObj[index]
+				}
+			},
+			colorState(){
+				return (index) => {
+					let colorObj ={
+						1: '#FFA100',
+						2: '#F33B10',
+						3: '#FFA100',
+						4: '#999999',
+						5: '#F33B10',
+						6: '#999999'
+					}
+					return colorObj[index]
+				}
+			}
+		},
+		methods: {
+			UpdataInfo(value){
+				this.$emit('updataInfo', this.userInfo)
+			},
+			showQR(){
+				this.$emit('showQRcode', true)
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.box{
+		background: #FFFFFF;
+		border-radius: 12rpx;
+		box-sizing: border-box;
+	}
+	.orderInfo{
+		padding: 0 30rpx;
+		.order_line{
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			height: 90rpx;
+			font-size: 26rpx;
+			color: #333;
+			&.isBorder {
+				border-bottom: 2rpx solid #E1E1E1;
+			}
+			&:last-child{
+				border-bottom: 0;
+			}
+			.left_text{ 
+				color: #666;
+			}
+		}
+	}
+</style>

+<template>
+	<view class="common_content">
+		<u-icon :name="iconName"></u-icon>
+		<text class="title">{{ titleContent }}</text>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			iconName: {
+				type: String,
+				default: 'chat'
+			},
+			titleContent: {
+				type: String,
+				default: ''
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.common_content{
+		display: flex;
+		align-content: center;
+		.title{
+			margin-left: 4rpx;
+		}
+	}
+</style>

+<template>
+	<view class="common_title_nav">
+		<view class="name">
+			<text style="font-weight: 600;">{{ titleName }}</text>
+			<text class="mark" :style="{ color: markColor }">{{ rightTitle }}</text>
+		</view>
+		<view :style="{ color: sideTitleColor, fontSize: sideTitleSize }">
+			<slot name="side-content"></slot>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			titleName: {
+				type: String,
+				default: ''
+			},
+			rightTitle: {
+				type: String,
+				default: ''
+			},
+			sideTitle: {
+				type: String,
+				default: ''
+			},
+			sideTitleColor: {
+				type: String,
+				default: '#333'
+			},
+			markColor: {
+				type: String,
+				default: '#333'
+			},
+			sideTitleSize: {
+				type: Number,
+				default: 28
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.common_title_nav{
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		.name{
+			font-size: 32rpx;
+			color: #333;
+			.mark{
+				font-size: 24rpx;
+				margin-left: 16rpx;
+			}
+		}
+	}
+</style>

+<template>
+	<view class="my_button" :class="{border, size: size === 'small'}" :style="{background: bgColor, color}" @click="comfirn">
+		{{ title }}
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			title: {
+				type: String,
+				require: true
+			},
+			color: {
+				type: String,
+				default: '#fff'
+			},
+			size: {
+				type: String,
+				default: 'normal'
+			},
+			bgColor: {
+				type: String,
+				default: ''
+			},
+			border: {
+				type: Boolean,
+				default: false
+			}
+		},
+		methods: {
+			comfirn(){
+				this.$emit('comfirn')
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.my_button{
+		box-sizing: border-box;
+		background: linear-gradient( 270deg, #FFA100 0%, #FCD723 100%);
+		border-radius: 112rpx;
+		text-align: center;
+		line-height: 80rpx;
+		color: #fff;
+		font-size: 28rpx;
+		&.border{
+			border: 2rpx solid #FFA100;
+		}
+	}
+	.size{
+		padding: 8rpx 34rpx;
+		text-align: center;
+		color: #fff;
+		font-size: 24rpx;
+		line-height: 40rpx;
+		background: linear-gradient( 270deg, #FFA100 0%, #FCD723 100%);
+		border-radius: 112rpx;
+		box-sizing: border-box;
+	}
+</style>

+<template>
+	<view class="systemTip">
+		<view v-for="(item, index) in systemInfo" :key="index" class="sytem_row">
+			<u-notice-bar :text="item" :fontSize="12" bgColor="transparent" color="#FFA100"></u-notice-bar>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return {
+				systemInfo: [
+					'（CLOOL发起拼场）2022-12-26 14:23:45',
+					'（奇犽加入拼场并成功支付）2022-12-26 14:23:45',
+					'（奇犽加入拼场并成功支付）2022-12-26 14:23:45'
+				]
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.systemTip{
+		display: flex;
+		flex-direction: column;
+		gap: 20rpx;
+		background: rgba(255,161,0, .16);
+		border-radius: 12rpx;
+		margin: 0 30rpx;
+		padding: 16rpx 20rpx;
+		.sytem_row{
+			font-size: 24rpx;
+			line-height: 36rpx;
+		}
+	}
+</style>

+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <script>
+      var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
+        CSS.supports('top: constant(a)'))
+      document.write(
+        '<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
+        (coverSupport ? ', viewport-fit=cover' : '') + '" />')
+    </script>
+    <title></title>
+    <!--preload-links-->
+    <!--app-context-->
+  </head>
+  <body>
+    <div id="app"><!--app-html--></div>
+    <script type="module" src="/main.js"></script>
+  </body>
+</html>

+import App from './App'
+
+// #ifndef VUE3
+import Vue from 'vue'
+import './uni.promisify.adaptor'
+import uView from '@/uni_modules/uview-ui'
+import store from './store/index.js'
+Vue.use(uView)
+Vue.config.productionTip = false
+App.mpType = 'app'
+const app = new Vue({
+	store,
+  ...App,
+})
+// 引入请求封装，将app参数传递到配置中
+require('./utils/request.js')(app)
+app.$mount()
+// #endif
+
+// #ifdef VUE3
+import { createSSRApp } from 'vue'
+export function createApp() {
+  const app = createSSRApp(App)
+  return {
+    app
+  }
+}
+// #endif

+{
+    "name" : "arena_app",
+    "appid" : "__UNI__6C14005",
+    "description" : "",
+    "versionName" : "1.0.0",
+    "versionCode" : "100",
+    "transformPx" : false,
+    /* 5+App特有相关 */
+    "app-plus" : {
+        "usingComponents" : true,
+        "nvueStyleCompiler" : "uni-app",
+        "compilerVersion" : 3,
+        "splashscreen" : {
+            "alwaysShowBeforeRender" : true,
+            "waiting" : true,
+            "autoclose" : true,
+            "delay" : 0
+        },
+        /* 模块配置 */
+        "modules" : {
+            "OAuth" : {}
+        },
+        /* 应用发布信息 */
+        "distribute" : {
+            /* android打包配置 */
+            "android" : {
+                "permissions" : [
+                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
+                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CAMERA\"/>",
+                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
+                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera\"/>",
+                    "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
+                ]
+            },
+            /* ios打包配置 */
+            "ios" : {},
+            /* SDK配置 */
+            "sdkConfigs" : {
+                "oauth" : {
+                    "weixin" : {
+                        "appid" : "wx7902d7df47ea6739",
+                        "UniversalLinks" : ""
+                    }
+                }
+            },
+            "splashscreen" : {
+                "androidStyle" : "common",
+                "android" : {
+                    "hdpi" : "static/images/start/login-bg.png",
+                    "xhdpi" : "static/images/start/login-bg.png",
+                    "xxhdpi" : "static/images/start/login-bg.png"
+                }
+            }
+        }
+    },
+    /* 快应用特有相关 */
+    "quickapp" : {},
+    /* 小程序特有相关 */
+    "mp-weixin" : {
+        "appid" : "wx7902d7df47ea6739",
+        "setting" : {
+            "urlCheck" : false
+        },
+        "usingComponents" : true
+    },
+    "mp-alipay" : {
+        "usingComponents" : true
+    },
+    "mp-baidu" : {
+        "usingComponents" : true
+    },
+    "mp-toutiao" : {
+        "usingComponents" : true
+    },
+    "uniStatistics" : {
+        "enable" : false
+    },
+    "vueVersion" : "2",
+    "h5" : {
+        "router" : {
+            "mode" : "hash"
+        },
+        "devServer" : {
+            "proxy" : {
+                "/rpa" : {
+                    "target" : "http://rpa.crgx.xyz"
+                }
+            },
+            "https" : true
+        }
+    }
+}

+{
+  "name": "arena_app",
+  "version": "1.0.0",
+  "lockfileVersion": 2,
+  "requires": true,
+  "packages": {}
+}

+{
+  "name": "arena_app",
+  "version": "1.0.0",
+  "lockfileVersion": 2,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "arena_app",
+      "version": "1.0.0",
+      "license": "ISC"
+    }
+  }
+}

+{
+  "name": "arena_app",
+  "version": "1.0.0",
+  "description": "",
+  "main": "main.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC"
+}

+{
+	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
+		{
+			"path" : "pages/home/home",
+			"style" : 
+			{
+				"navigationBarTitleText" : "",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/booking/booking",
+			"style" : 
+			{
+				"navigationBarTitleText" : "",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/aboutSphere/aboutSphere",
+			"style" : 
+			{
+				"navigationBarTitleText" : "",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/mall/mall",
+			"style" : 
+			{
+				"navigationBarTitleText" : "",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/my/my",
+			"style" : 
+			{
+				"navigationBarTitleText" : "",
+				"navigationStyle": "custom",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/arenaDetail/arenaDetail",
+			"style" : 
+			{
+				"navigationBarTitleText" : "",
+				"navigationStyle": "custom",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/arenaDetail/vipRecharge",
+			"style" : 
+			{
+				"navigationBarTitleText" : "",
+				"navigationStyle": "custom",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/morePhotos/morePhotos",
+			"style" : 
+			{
+				"navigationBarTitleText" : "场馆照片",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/moreComment/moreComment",
+			"style" : 
+			{
+				"navigationBarTitleText" : "球馆评论",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/comfirmOrder/comfirmOrder",
+			"style" : 
+			{
+				"navigationBarTitleText" : "确认订单",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/timeBooking/timeBooking",
+			"style" : 
+			{
+				"navigationBarTitleText" : "选时订场",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/paysuccess/paysuccess",
+			"style" : 
+			{
+				"navigationBarTitleText" : "支付成功",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/aboutBalls/aboutBalls",
+			"style" : 
+			{
+				"navigationBarTitleText" : "发起约球",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/aboutBallsDetail/aboutBallsDetail",
+			"style" : 
+			{
+				"navigationBarTitleText" : "",
+				"navigationStyle": "custom",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/editInfo/editInfo",
+			"style" : 
+			{
+				"navigationBarTitleText" : "编辑信息",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/myOrder/myOrder",
+			"style" : 
+			{
+				"navigationBarTitleText" : "我的订单",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/myWallet/myWallet",
+			"style" : 
+			{
+				"navigationBarTitleText" : "我的钱包",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/moneyEdit/moneyEdit",
+			"style" : 
+			{
+				"navigationBarTitleText" : "金额操作",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/operateSuccess/operateSuccess",
+			"style" : 
+			{
+				"navigationBarTitleText" : "",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/login/login",
+			"style" : 
+			{
+				"navigationBarTitleText" : "",
+				"navigationStyle": "custom",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/login/index",
+			"style" : 
+			{
+				"navigationBarTitleText" : "用户名登录",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/register/register",
+			"style" : 
+			{
+				"navigationBarTitleText" : "注册",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/applyRefund/applyRefund",
+			"style" : 
+			{
+				"navigationBarTitleText" : "申请退款",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/orderEvaluate/orderEvaluate",
+			"style" : 
+			{
+				"navigationBarTitleText" : "订单评价",
+				"enablePullDownRefresh" : false
+			}
+		}
+	],
+	"tabBar": {
+	  "color": "#888888",
+	  "selectedColor": "#FFA100",
+	  "borderStyle": "black",
+	  "backgroundColor": "#ffffff",
+	  "list": [{
+	    "pagePath": "pages/home/home",
+	    "iconPath": "static/tabbar/House.png",
+	    "selectedIconPath": "static/tabbar/House_active.png",
+	    "text": "首页"
+	  }, {
+	    "pagePath": "pages/booking/booking",
+	    "iconPath": "static/tabbar/Timer.png",
+	    "selectedIconPath": "static/tabbar/Timer_active.png",
+	    "text": "订场"
+	  }, {
+	    "pagePath": "pages/aboutSphere/aboutSphere",
+	    "iconPath": "static/tabbar/Basketball.png",
+	    "selectedIconPath": "static/tabbar/Basketball_active.png",
+	    "text": "约球"
+	  }, {
+	    "pagePath": "pages/mall/mall",
+	    "iconPath": "static/tabbar/shopping.png",
+	    "selectedIconPath": "static/tabbar/shopping_active.png",
+	    "text": "商城"
+	  },{
+		  "pagePath": "pages/my/my",
+		  "iconPath": "static/tabbar/SmileyBlank.png",
+		  "selectedIconPath": "static/tabbar/SmileyWink_active.png",
+		  "text": "我的"
+		}]
+	},
+	"globalStyle": {
+	  // #ifdef H5
+	  // "navigationStyle": "custom",
+	  "maxWidth": 750,
+	  "rpxCalcMaxDeviceWidth": 750, // rpx 计算所支持的最大设备宽度，单位 px，默认值为 960
+	  "rpxCalcBaseDeviceWidth": 560, // rpx 计算使用的基准设备宽度，设备实际宽度超出 rpx 计算所支持的最大设备宽度时将按基准宽度计算，单位 px，默认值为 375
+	  "rpxCalcIncludeWidth": 9999, // rpx 计算特殊处理的值，始终按实际的设备宽度计算，单位 rpx，默认值为 750
+	  // #endif
+	  "navigationBarBackgroundColor": "#ffffff",
+	  "navigationBarTitleText": "",
+	  "navigationBarTextStyle": "black",
+	  "backgroundTextStyle": "dark"
+	},
+	"easycom": {
+		"^u-(.*)": "@/uni_modules/uview-ui/components/u-$1/u-$1.vue"
+	},
+	"uniIdRouter": {}
+}

+<template>
+	<view class="about_balls">
+		<!-- 选项卡片 -->
+		<view class="select_card">
+			<view class="title">运动项目</view>
+			<view class="ball_list">
+				<view class="ball_item" v-for="(item, index) in imageList" :key="index" @click="ballActive = index">
+					<image class="ball_icon" v-show="ballActive !== index" :src="item.activeIcon" mode="widthFix"></image>
+					<image class="ball_icon" v-show="ballActive === index" :src="item.icon" mode="widthFix"></image>
+					<text :class="{ ballname: ballActive === index }">{{ item.title }}</text>
+				</view>
+			</view>
+			<view class="title">选择场馆</view>
+			<!-- 选择场馆 -->
+			<view class="select_arena" @click="show = true">
+				<text>{{ arenaName }}</text>
+				<u-icon name="arrow-right" color="#999"></u-icon>
+			</view>
+			<view class="title">项目时间</view>
+			<!-- 时间范围 -->
+			<view class="time_list">
+				<view class="startTime" @click="selectTime('start')">{{ startTime }}</view>
+				<view class="line"></view>
+				<view class="endTime" @click="selectTime('end')">{{ endTime }}</view>
+			</view>
+		</view>
+		<!-- 运动人数 -->
+		<view class="sport_number">
+			<view class="title">运动人数</view>
+			<text>8 人</text>
+		</view>
+		<!-- 去人约球 -->
+		<view class="footer">
+			<MyButton title="发起约球" @comfirn="goRouter" />
+		</view>
+		<!-- 场馆选择 -->
+		<u-picker :show="show" title="选择场馆" confirmColor="#FFA100" :columns="columns" :closeOnClickOverlay="true" @cancel="show = false" @close="show = false" @confirm="confirm"></u-picker>
+		<!-- 时间选择 -->
+		<u-datetime-picker
+			ref="datetimePicker"
+			:show="showDate"
+			v-model="dateValue"
+			title="选择约球时间"
+			mode="datetime"
+			:formatter="formatter"
+			@cancel="showDate = false"
+			@confirm="confirmTime"
+    />
+	</view>
+</template>
+
+<script>
+	import badminton from '@/static/images/sport/badminton.png'
+	import badminton1 from '@/static/images/sport/badminton-1.png'
+	import basketball from '@/static/images/sport/basketball.png'
+	import basketball1 from '@/static/images/sport/basketball-1.png'
+	import football from '@/static/images/sport/football.png'
+	import football1 from '@/static/images/sport/football-1.png'
+	import frisbee from '@/static/images/sport/frisbee.png'
+	import frisbee1 from '@/static/images/sport/frisbee-1.png'
+	import tableTennis from '@/static/images/sport/table-tennis.png'
+	import tableTennis1 from '@/static/images/sport/table-tennis-1.png'
+	import tennis from '@/static/images/sport/tennis.png'
+	import tennis1 from '@/static/images/sport/tennis-1.png'
+	import MyButton from '@/components/myButton.vue'
+	export default {
+		components: { MyButton },
+		data() {
+			return {
+				ballActive: 0, // 动态球类索引
+				show: false, // 显示场馆列表
+				showDate: false, // 时间选择列表
+				dateValue: '', // 选择的时间值
+				startTime: '开始时间', // 开始时间
+				endTime: '结束时间', // 结束时间
+				timeMode: '', // 时间状态
+				arenaName: '',
+				columns: [
+					['彩虹体育馆', '飞人网球场', 'L2T体育馆']
+				],
+				// 球类列表
+				imageList: [
+					{ title: '羽毛球', icon: badminton, activeIcon: badminton1 },
+					{ title: '足球', icon: football, activeIcon: football1 },
+					{ title: '网球', icon: tennis, activeIcon: tennis1 },
+					{ title: '飞盘', icon: frisbee, activeIcon: frisbee1 },
+					{ title: '篮球', icon: basketball, activeIcon: basketball1 },
+					{ title: '乒乓球', icon: tableTennis, activeIcon: tableTennis1 }
+				]
+			}
+		},
+		onReady() {
+			// 微信小程序需要用此写法
+			this.$refs.datetimePicker.setFormatter(this.formatter)
+		},
+		methods: {
+			// 确认选择场馆
+			confirm({value}){
+				this.show = false
+				this.arenaName = value
+			},
+			// 时间过滤器
+			formatter(type, value) {
+				let timeObj = {
+					year: `${value}年`,
+					month: `${value}月`,
+					day: `${value}日`,
+					hour: `${value}时`,
+					minute: `${value}分`,
+				}
+				return timeObj[type]
+			},
+			// 选择时间
+			selectTime(value){
+				this.timeMode = value
+				this.showDate = true
+			},
+			// 选择时间的值
+			confirmTime({value}){
+				if(this.timeMode === 'start') {
+					this.startTime = uni.$u.timeFormat(value, 'yyyy-mm-dd hh:MM')
+				} else {
+					this.endTime = uni.$u.timeFormat(value, 'yyyy-mm-dd hh:MM')
+				}
+				this.showDate = false
+			},
+			// 前往订单详情
+			goRouter(){
+				uni.navigateTo({
+					url: '/pages/comfirmOrder/comfirmOrder'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.title{
+		position: relative;
+		font-weight: 500;
+		font-size: 28rpx;
+		line-height: 36rpx;
+		color: #333;
+		margin-left: 20rpx;
+		&::before{
+			content: '';
+			position: absolute;
+			left: -20rpx;
+			top: 50%;
+			transform: translateY(-50%);
+			width: 8rpx;
+			height: 8rpx;
+			background-color: #FFA100;
+			border-radius: 50%;
+		}
+	}
+.about_balls{
+	padding: 24rpx 30rpx 0;
+	background-color: #F6F6F6;
+	min-height: 100vh;
+	box-sizing: border-box;
+	.select_card{
+		height: 548rpx;
+		background: #FFFFFF;
+		box-sizing: border-box;
+		padding: 24rpx;
+		border-radius: 12rpx 12rpx 12rpx 12rpx;
+		.ball_list{
+			display: flex;
+			align-items: center;
+			justify-content: space-around;
+			margin: 34rpx 0;
+			.ball_item{
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				font-size: 24rpx;
+				color: #999;
+				line-height: 28rpx;
+				.ballname{
+					color: #FFA100;
+					font-weight: 500;
+				}
+				.ball_icon{
+					width: 48rpx;
+					height: 48rpx;
+					margin-bottom: 16rpx;
+				}
+			}
+		}
+		// 选择场馆
+		.select_arena{
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			padding: 0 32rpx;
+			height: 68rpx;
+			background: #F6F6F6;
+			border-radius: 68rpx;
+			color: #333;
+			font-size: 24rpx;
+			margin: 24rpx 0 36rpx 0;
+		}
+		// 选择时间
+		.time_list {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			margin-top: 22rpx;
+			.startTime, .endTime{
+				width: 256rpx;
+				height: 56rpx;
+				background: #F6F6F6;
+				border-radius: 68rpx;
+				font-size: 24rpx;
+				color: #333;
+				text-align: center;
+				line-height: 56rpx;
+			}
+			.line{
+				width: 44rpx;
+				height: 0rpx;
+				border: 2rpx solid rgba(225,225,225,0.7);
+			}
+		}
+	}
+	// 人数
+	.sport_number{
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 24rpx;
+		height: 88rpx;
+		box-sizing: border-box;
+		background: #FFFFFF;
+		border-radius: 12rpx 12rpx 12rpx 12rpx;
+		margin-top: 24rpx;
+	}
+	// 确认约球
+	.footer{
+		position: fixed;
+		height: 112rpx;
+		width: 100%;
+		box-sizing: border-box;
+		bottom: 0;
+		left: 0;
+		background-color: #fff;
+		padding: 16rpx 30rpx;
+	}
+}
+</style>

+<template>
+	<view class="detail_container">
+		<!-- 头部详情 -->
+		<view class="detail_head">
+			<image class="head_cover" src="@/static/images/start/login-bg-mob.png" mode="widthFix"></image>
+			<view class="nav_item">
+				<u-icon name="arrow-left" color="#fff" @click="goBack"></u-icon>
+			</view>
+		</view>
+		
+		<!-- 球馆信息卡片 -->
+		<view class="arnea_card">
+			<view class="arena_box">
+				<ArenaDetailCard />
+			</view>
+		</view>
+		
+		<!-- 场馆评价 -->
+		<EvaluateCard />
+		<!-- 拼球信息卡 -->
+		<BookingInfoCard />
+		<!-- 系统通知 -->
+		<SystemTip />
+		
+	</view>
+</template>
+
+<script>
+	import SystemTip from '@/components/systemTip.vue'
+	import BookingInfoCard from './components/bookingInfoCard.vue'
+	import EvaluateCard from './components/evaluateCard.vue'
+	import ArenaDetailCard from '@/pages/arenaDetail/components/ArenaDetailCard.vue'
+	export default {
+		components: { ArenaDetailCard, EvaluateCard, BookingInfoCard, SystemTip },
+		data() {
+			return {
+				status: 'loadmore'
+			}
+		},
+		methods: {
+			goBack() {
+				uni.navigateBack()
+			},
+			goRouter(path) {
+				uni.navigateTo({
+					url: path
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.detail_container{
+	background-color: #F6F6F6;
+	min-height: 100vh;
+	padding-bottom: 60rpx;
+	// 头部背景
+	.detail_head{
+		position: relative;
+		height: 396rpx;
+		overflow: hidden;
+		.head_cover{
+			position: absolute;
+			top: -344rpx;
+			left: 0;
+			width: 100%;
+		}
+		.nav_item{
+			width: 100%;
+			box-sizing: border-box;
+			margin: 68rpx 0 0 40rpx;
+		}
+	}
+	// 球馆信息
+	.arnea_card{
+		position: relative;
+		.arena_box{ 
+			margin-top: -172rpx;
+		}
+	}
+
+}
+</style>

+<template>
+	<view class="bookingInfoCard">
+		<view class="row_info">
+			<view class="left">拼球发起人：CLOOL</view>
+		</view>
+		<view class="row_info" style="margin: 28rpx 0;">
+			<view class="left">需求拼场：6人</view>
+			<MyButton title="拼场" size="small"></MyButton>
+		</view>
+		<view class="row_info">
+			<view class="left">
+				<text>已经拼场：</text>
+				<u-avatar-group
+					:urls="urls"
+					size="20"
+					gap="0"
+				/>
+			</view>
+			<MyButton title="邀请" size="small"></MyButton>
+		</view>
+	</view>
+</template>
+
+<script>
+	import MyButton from '@/components/myButton.vue'
+	export default{
+		components: { MyButton },
+		data(){
+			return {
+				urls: [
+						'https://cdn.uviewui.com/uview/album/1.jpg',
+						'https://cdn.uviewui.com/uview/album/2.jpg',
+						'https://cdn.uviewui.com/uview/album/3.jpg',
+						'https://cdn.uviewui.com/uview/album/4.jpg'
+				]
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.bookingInfoCard{
+		background: #FFFFFF;
+		border-radius: 16rpx;
+		padding: 26rpx 32rpx;
+		margin: 0 30rpx 24rpx;
+		.row_info{
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			color: #333;
+			font-size: 28rpx;
+			line-height: 40rpx;
+			.left{
+				display: flex;
+				align-items: center;
+			}
+		}
+	}
+</style>

+<template>
+	<view class="comment_arena">
+		<CommonTitleNav titleName="场馆评价">
+			<template #side-content>
+				<view style="display: flex;align-items: center;font-size: 24rpx;color: #999;">
+					<text style="margin-right: 6rpx;">更多评价</text>
+					<u-icon name="arrow-right" color="#999999" size="14"></u-icon>
+				</view>
+			</template>
+		</CommonTitleNav>
+		
+		<!-- 评分 -->
+		<view class="evaluate">
+			<view class="left_box">
+				<view class="evaluate_item">
+					<text>整体评价</text>
+					<text class="score">4.8</text>
+				</view>
+			</view>
+			<view class="right_box">
+				<view v-for="(item, index) in evaluateList" :key="index" class="evaluate_item">
+					<text>{{ item.title }}</text>
+					<text class="score">{{ item.score }}</text>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import CommonTitleNav from '@/components/commonTitleNav.vue'
+	export default{
+		components: { CommonTitleNav },
+		data() {
+			return {
+				evaluateList: [
+					{ title: '环境', score: '4.6' },
+					{ title: '服务', score: '4.5' },
+					{ title: '性价比', score: '4.9' },
+				]
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	// 场馆评价
+	.comment_arena{
+		background: #FFFFFF;
+		border-radius: 16rpx;
+		margin: 24rpx 30rpx;
+		padding: 24rpx 32rpx;
+		box-sizing: border-box;
+		// 评价
+		.evaluate{
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			margin-top: 26rpx;
+			.left_box{
+				flex: 3;
+				.evaluate_item{
+					align-items: flex-start;
+				}
+			}
+			.right_box{
+				flex: 4;
+				display: flex;
+				justify-content: space-around;
+			}
+			.evaluate_item{
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				color: #333;
+				font-size: 24rpx;
+				line-height: 32rpx;
+				.score{
+					color: #FFA100;
+					font-size: 32rpx;
+					margin-top: 24rpx;
+				}
+			}
+		}
+	}
+</style>

+<template>
+	<view class="booking">
+		<u-sticky bgColor="#fff">
+		  <view class="header_booking">
+		  	<u-tabs :list="list" lineColor="#FFA100" :activeStyle="{color: '#ffa100'}"></u-tabs>
+		  	<view class="select_list">
+		  		<view class="select_item" @click="show = true">
+		  			<text class="text">距离</text>
+		  			<u-icon name="arrow-down-fill"></u-icon>
+		  		</view>
+		  		<view class="select_item" @click="show = true">
+		  			<text class="text">价格</text>
+		  			<u-icon name="arrow-down-fill" color="#666"></u-icon>
+		  		</view>
+		  		<view class="select_item">
+		  			<text>时间段</text>
+		  			<u-icon name="arrow-down-fill" color="#666"></u-icon>
+		  		</view>
+		  	</view>
+		  </view>
+		</u-sticky>
+	
+		<!-- 球场列表 -->
+		<view class="arena_list">
+			<ArenaCard v-for="item in 5" :isBooking="false" :key="item" />
+		</view>
+		
+		<view class="footer">
+			<MyButton title="发起约球" @comfirn="goRouter" />
+		</view>
+		<u-picker :show="show" confirmColor="#ffa100" :columns="columns" :closeOnClickOverlay="true" @close="show = false"  @cancel="show = false" @confirm="show = false"></u-picker>
+	</view>
+</template>
+
+<script>
+	import MyButton from '@/components/myButton.vue'
+	import ArenaCard from '@/pages/home/components/arenaCard.vue'
+	export default {
+		components: { ArenaCard, MyButton },
+		data() {
+			return {
+				show: false,
+				columns: [
+					['1km以内', '3km以内', '5km以内', '10km以内']
+				],
+				list: [
+					{name: '羽毛球'},
+					{name: '网球'},
+					{name: '飞盘'},
+					{name: '足球'},
+					{name: '篮球'},
+					{name: '兵乒球'}
+				]
+			}
+		},
+		methods: {
+			goRouter(){
+				uni.navigateTo({
+					url: '/pages/aboutBalls/aboutBalls'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.booking{
+	background-color: #F6F6F6;
+	padding-bottom: 112rpx;
+	.header_booking{
+		 background-color: #fff;
+		 .select_list{
+			 display: flex;
+			 align-items: center;
+			 justify-content: space-around;
+			 height: 84rpx;
+			 padding: 0 30rpx;
+			 border-top: 2rpx solid #E1E1E1;
+			 box-sizing: border-box;
+			 .select_item{
+				 display: flex;
+				 align-items: center;
+				 font-size: 28rpx;
+				 line-height: 32rpx;
+				 color: #666;
+				 .text{
+					 margin-right: 8rpx;
+				 }
+			 }
+		 }
+	 }
+
+	.arena_list{
+		padding: 30rpx;
+	}
+	
+	.footer{
+		position: fixed;
+		height: 112rpx;
+		width: 100%;
+		box-sizing: border-box;
+		bottom: 0;
+		left: 0;
+		background-color: #fff;
+		padding: 16rpx 30rpx;
+	}
+}
+</style>

+<template>
+	<view class="apply_refund">
+		<view class="box">
+			<view class="arenaInfo">
+				<view class="detail">预约详情</view>
+				<view class="info">场馆信息</view>
+				<ArenaCard />
+			</view>
+			<u-cell-group :border="false">
+				<u-cell :border="false"  v-for="(item, index) in orderInfo" :key="index" :titleStyle="{color: '#666', fontSize: '24rpx'}" :title="item.title">
+					<text slot="right-icon" style="font-size: 24rpx;color: #333;">{{ item.info }}</text>
+				</u-cell>
+			</u-cell-group>
+		</view>
+		<!-- 退款原因 -->
+		<view class="user_intro">
+			<view class="intro">退款原因：</view>
+			<u--textarea v-model="introStr" :placeholder="defaultTip" placeholderClass  height="188rpx" count ></u--textarea>
+		</view>
+		
+		<!-- 联系方式 -->
+		<view class="user_intro">
+			<view class="intro">联系方式：</view>
+			<u--form :model="form" ref="uForm" :labelStyle="{color: '#666', fontSize: '24rpx'}">
+				<u-form-item label="联系人:" prop="name">
+					<u-input v-model="form.name" placeholder="请输入您的姓名" :customStyle="{padding: '10rpx', backgroundColor: '#F6F6F6'}" />
+				</u-form-item>
+				<u-form-item label="手机号:" prop="phone">
+					<u-input v-model="form.phone" placeholder="请输入正确的手机号码，便于商家联系" :customStyle="{padding: '10rpx', backgroundColor: '#F6F6F6'}" />
+				</u-form-item>
+			</u--form>
+		</view>
+		<!-- 提交申请 -->
+		<view class="footer">
+			<MyButton title="提交申请" />
+		</view>
+	</view>
+</template>
+
+<script>
+	import MyButton from '@/components/myButton.vue'
+	import ArenaCard from '@/pages/home/components/arenaCard.vue'
+	export default {
+		components: { ArenaCard, MyButton },
+		data() {
+			return {
+				form: {
+					name: '',
+					phone: ''
+				},
+				introStr: '',
+				defaultTip: '请正确输入退款原因，以便于商家审核，小于5小时退款订单，有可能对商家造成损失，可能无法进行退款。请尽可能的与商家进行友好协商',
+				orderInfo: [
+					{ title: '订单信息', info: '' },
+					{ title: '订单编号', info: '000026' },
+					{ title: '预约时间', info: '2022-12-26 14:00-16:66' },
+					{ title: '支付金额', info: '¥ 268' },
+					{ title: '支付流水号', info: '123456' }
+				]
+			};
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+/deep/ .textarea-placeholder{
+	font-size: 22rpx;
+	color: #999;
+	line-height: 40rpx;
+}
+/deep/ .input-placeholder{
+	font-size: 24rpx;
+	color: #999;
+}
+
+.apply_refund{
+	min-height: 100vh;
+	padding: 18rpx 30rpx;
+	background-color: #F6F6F6;
+	box-sizing: border-box;
+	padding-bottom: 10rpx;
+	.box{
+		padding: 24rpx 0;
+		background: #FFFFFF;
+		border-radius: 12rpx;
+	}
+	.arenaInfo{
+		font-size: 28rpx;
+		color: #333;
+		line-height: 36rpx;
+		padding-bottom: 10rpx;
+		border-bottom: 2rpx solid #D8D8D8;
+		.detail{
+			padding: 0 30rpx;
+		}
+		.info{
+			padding: 0 30rpx;
+			font-size: 24rpx;
+			color: #999;
+			line-height: 32rpx;
+			margin: 16rpx 0 8rpx 0;
+		}
+	}
+	.user_intro{
+		margin-top: 24rpx;
+		padding: 28rpx;
+		background: #FFFFFF;
+		border-radius: 12rpx;
+		.intro{
+			font-size: 26rpx;
+			color: #333;
+			margin-bottom: 24rpx;
+			line-height: 36rpx;
+		}
+	}
+	
+	.footer{
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		box-sizing: border-box;
+		background-color: #fff;
+		padding: 16rpx 30rpx;
+	}
+}
+</style>

+<template>
+	<view class="detail_container">
+		<!-- 头部详情 -->
+		<view class="detail_head">
+			<image class="head_cover" src="@/static/images/start/login-bg-mob.png" mode="widthFix"></image>
+			<view class="nav_item">
+				<u-icon name="arrow-left" color="#fff" @click="goBack"></u-icon>
+			</view>
+		</view>
+		
+		<!-- 球馆信息卡片 -->
+		<view class="arnea_card">
+			<view class="arena_box">
+				<ArenaDetailCard />
+			</view>
+		</view>
+		
+		<!-- 会员充值提示 -->
+		<view class="vip" @click="goRouter('/pages/arenaDetail/vipRecharge')">
+			<vipCard></vipCard>
+		</view>
+		
+		<!-- 选场 -->
+		<view class="book">
+			<view class="book_title">
+				<view>选场预订</view>
+				<view class="bookNum">本球场共6个场地</view>
+			</view>
+			<view class="book_content">
+				<BookCard v-for="item in 4" :key="item" />
+				<u-loadmore :status="status" line />
+			</view>
+		</view>
+		<!-- 评论 -->
+		<view class="comment">
+			<view class="comment_box">
+				<CommonTitleNav title-name="用户评论" mark-color="#666666" right-title="（1265+评论）" >
+					<template #side-content>
+						<view style="display: flex;align-items: center;font-size: 24rpx;" @click="goRouter('/pages/moreComment/moreComment')">
+							<text style="margin-right: 6rpx;color: #999;">更多评价</text>
+							<u-icon name="arrow-right" color="#999999" size="12"></u-icon>
+						</view>
+					</template>
+				</CommonTitleNav>
+			
+				<view class="comment_content">
+					<!-- 评价内容 -->
+					<CommentCard v-for="item in 3" :key="item" />
+				</view>
+			</view>
+		</view>
+		
+	</view>
+</template>
+
+<script>
+	import CommonTitleNav from '@/components/commonTitleNav.vue'
+	import ArenaDetailCard from './components/ArenaDetailCard.vue'
+	import vipCard from './components/vipCard.vue'
+	import BookCard from './components/bookCard.vue'
+	import CommentCard from '@/components/commentCard.vue'
+	export default {
+		components: { ArenaDetailCard, BookCard, CommonTitleNav, CommentCard, vipCard },
+		data() {
+			return {
+				status: 'loadmore',
+			}
+		},
+		methods: {
+			goBack() {
+				uni.navigateBack()
+			},
+			goRouter(path) {
+				uni.navigateTo({
+					url: path
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.detail_container{
+	background-color: #F6F6F6;
+	min-height: 100vh;
+	padding-bottom: 60rpx;
+	
+	.detail_head{
+		position: relative;
+		height: 396rpx;
+		overflow: hidden;
+		.head_cover{
+			position: absolute;
+			top: -344rpx;
+			left: 0;
+			width: 100%;
+		}
+		.nav_item{
+			width: 100%;
+			box-sizing: border-box;
+			margin: 68rpx 0 0 40rpx;
+		}
+	}
+	
+	.arnea_card{
+		position: relative;
+		.arena_box{ 
+			margin-top: -172rpx;
+		}
+	}
+	
+	.vip{
+		padding: 0 30rpx;
+		margin: 20rpx 0;
+		box-sizing: border-box;
+	}
+	
+	.book{
+		margin-top: 30rpx;
+		padding: 0 30rpx;
+		.book_title{
+			display: flex;
+			align-items: center;
+			margin-bottom: 24rpx;
+			font-size: 32rpx;
+			line-height: 40rpx;
+			color: #333;
+			.bookNum{
+				color: #999;
+				font-size: 24rpx;
+				line-height: 32rpx;
+				margin-left: 20rpx;
+			}
+		}
+		.book_content{
+			min-height: 548rpx;
+			background: #FFFFFF;
+			border-radius: 16rpx;
+			padding: 34rpx 26rpx;
+		}
+	}
+
+	.comment{
+		margin-top: 20rpx;
+		padding: 0 30rpx;
+		.comment_box{
+			min-height: 684rpx;
+			background: #FFFFFF;
+			border-radius: 16rpx;
+			padding: 24rpx 26rpx 30rpx;
+		}
+	}
+	.comment_content{
+		margin-top: 40rpx;
+	}
+}
+</style>

+<template>
+	<view class="detail_card">
+		<view class="header_module">
+			<CommonTitleNav title-name="彩虹体育馆" mark-color="#FFA100" right-title="4.8分" sideTitleColor="#ffa100" >
+				<template #side-content>
+					<view style="display: flex;align-items: center;font-size: 24rpx;" @click="goMore">
+						<text style="margin-right: 6rpx;">更多场照</text>
+						<u-icon name="play-right-fill" color="#ffa100" size="12"></u-icon>
+					</view>
+				</template>
+			</CommonTitleNav>
+			<view class="range">距离您1.2km</view>
+		</view>
+		
+		<u-scroll-list indicatorWidth="0">
+			<view class="list_card" v-for="(item, index) in list" :key="index">
+					<image class="cover" :src="item.thumb"></image>
+			</view>
+		</u-scroll-list>
+		
+		<view class="footer-module">
+			<view class="left">
+				<view class="businessTime">营业时间：周一至周五 9:00-23:00</view>
+				<CommonIconNav icon-name="map" title-content="1.2km 滨湖路地铁C口"></CommonIconNav>
+			</view>
+			<view class="right">
+				<view class="nav">
+					<u-icon size="20" name="https://bpic.588ku.com/element_origin_min_pic/19/06/15/bf733c98b302dd7b87f9d086310e75ea.jpg"></u-icon>
+					<text class="text">导航</text>
+				</view>
+				<view class="phone">
+					<u-icon size="20" name="phone"></u-icon>
+					<text class="text">电话</text>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import CommonTitleNav from '@/components/commonTitleNav.vue'
+	import CommonIconNav from '@/components/commonIconNav.vue'
+	export default {
+		components: { CommonTitleNav, CommonIconNav },
+		data(){
+			return {
+				list: [{
+						thumb: "https://cdn.uviewui.com/uview/goods/1.jpg"
+				}, {
+						thumb: "https://cdn.uviewui.com/uview/goods/2.jpg"
+				}, {
+						thumb: "https://cdn.uviewui.com/uview/goods/3.jpg"
+				}, {
+						thumb: "https://cdn.uviewui.com/uview/goods/4.jpg"
+				}, {
+						thumb: "https://cdn.uviewui.com/uview/goods/5.jpg"
+				}]
+			}
+		},
+		methods: {
+			goMore(){
+				uni.navigateTo({
+					url: '/pages/morePhotos/morePhotos'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.u-scroll-list__indicator{
+		margin-top: 0;
+	}
+	.detail_card{
+		width: 690rpx;
+		height: 384rpx;
+		background: #FFFFFF;
+		border-radius: 16rpx;
+		margin: 0 auto;
+		padding: 34rpx 34rpx 20rpx;
+		box-sizing: border-box;
+		.header_module{
+			.range{
+				margin: 14rpx 0;
+				color: #999;
+				font-size: 24rpx;
+				line-height: 28rpx;
+			}
+		}
+		
+		.list_card{
+			width: 224rpx;
+			height: 136rpx;
+			margin-right: 20rpx;
+			&:last-child{
+				margin-right: 0;
+			}
+			.cover{
+				width: 224rpx;
+				height: 136rpx;
+			}
+		}
+		
+		
+		.footer-module{
+			display: flex;
+			align-content: center;
+			justify-content: space-between;
+			margin-top: -40rpx;
+			.left{
+				color: #333;
+				font-size: 24rpx;
+				line-height: 32rpx;
+				.businessTime{
+					margin-bottom: 14rpx;
+				}
+			}
+			.right{
+				display: flex;
+				align-items: center;
+				font-size: 24rpx;
+				color: #666;
+				.nav, .phone{
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					.text{
+						margin-top: 6rpx;
+					}
+				}
+				.nav{
+					margin-right: 40rpx;
+				}
+			}
+		}
+	}
+</style>

+<template>
+	<view class="bookCard">
+		<view class="left">
+			<image class="arena_img" src="@/static/images/home/bg-1.png" mode="scaleToFill"></image>
+		</view>
+		<view class="right">
+			<view class="arenaInfo">
+				<view>羽毛球1号场</view>
+				<view class="price">¥ 160/小时</view>
+			</view>
+			<MyButton title="订场" size="small" @comfirn="goRouter" />
+		</view>
+	</view>
+</template>
+
+<script>
+	import MyButton from '@/components/myButton.vue'
+	export default {
+		components: { MyButton },
+		methods: {
+			goRouter(){
+				uni.navigateTo({
+					url: '/pages/timeBooking/timeBooking'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.bookCard{
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		margin-bottom: 24rpx;
+		.left{
+			width: 124rpx;
+			height: 124rpx;
+			margin-right: 24rpx;
+			.arena_img{
+				width: 100%;
+				max-height: 126rpx;
+			}
+		}
+		.right {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			flex: 1;
+			height: 100%;
+			.arenaInfo{
+				font-size: 28rpx;
+				color: #333;
+				line-height: 32rpx;
+				.price{
+					font-size: 500;
+					margin-top: 20rpx;
+				}
+			}
+		}
+	}
+</style>

+<template>
+	<view class="priceCard" :style="{backgroundColor: active ? '#FFE6B4' : '#fff'}" @click="toggle">
+		<text class="card_name">{{ info.name }}</text>
+		<text class="price">￥<text style="font-size: 72rpx; line-height: 96rpx;">{{ info.price }}</text></text>
+		<text class="old_price">￥{{ info.oldPrice }}</text>
+		<view class="avg_price" :style="{backgroundColor: active ? '#FFC675' : '#FFFAF1', color: active ? '#722F06' : '#DEB468'}">{{ info.avgText }}</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			active: {
+				type: Number,
+				default: false
+			},
+			info: {
+				type: Object,
+				require: true
+			}
+		},
+		methods: {
+			toggle(){
+				this.$emit('toggle')
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.priceCard{
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: space-between;
+		padding-top: 8rpx;
+		width: 330rpx;
+		height: 240rpx;
+		border-radius: 16rpx 16rpx 16rpx 16rpx;
+		overflow: hidden;
+		border: 2rpx solid #EEEEEE;
+		box-sizing: border-box;
+		color: #722F06;
+		.card_name, .price{
+			font-size: 32rpx;
+			line-height: 42rpx;
+			font-weight: 500;
+		}
+		.old_price{
+			color: #BF9363;
+			font-size: 28rpx;
+			line-height: 38rpx;
+			text-decoration: line-through;
+		}
+		.avg_price{
+			height: 48rpx;
+			line-height: 48rpx;
+			color: #DEB468;
+			font-size: 28rpx;
+			width: 100%;
+			text-align: center;
+		}
+	}
+</style>

+<template>
+	<view class="vip_card">
+		<view class="left">
+			<image src="@/static/images/arenaDetail/detail_banner.png" mode="widthFix"></image>
+		</view>
+		<view class="center">
+			<text class="admin">会员优惠</text>
+			<text class="select">更多选择</text>
+		</view>
+		<view class="right">
+			<view class="apply">立即申请</view>
+			<u-icon name="arrow-right-double" color="#E6B976"></u-icon>
+		</view>
+	</view>
+</template>
+
+<script>
+</script>
+
+<style lang="scss" scoped>
+	.vip_card{
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		height: 120rpx;
+		background: linear-gradient( 90deg, #EEC09F 0%, #FDF9F7 100%);
+		border-radius: 16rpx;
+		padding: 0 14rpx;
+		.left{
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			width: 200rpx;
+		}
+		.center{
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			flex: 1;
+			font-family: 'YouSheBiaoTiHei';
+			font-size: 28rpx;
+			line-height: 36rpx;
+			.admin{
+				background: linear-gradient(0deg, #D09351 0%, #E6B976 33%, #D09351 69%, #E6B976 100%);
+				-webkit-background-clip: text;/*将设置的背景颜色限制在文字中*/
+				-webkit-text-fill-color: transparent;/*给文字设置成透明*/
+				font-size: 48rpx;
+				line-height: 62rpx;
+			}
+			.select{
+				background: linear-gradient(0deg, #D09351 0%, #E6B976 33%, #D09351 69%, #E6B976 100%);
+				-webkit-background-clip: text;/*将设置的背景颜色限制在文字中*/
+				-webkit-text-fill-color: transparent;/*给文字设置成透明*/
+			}
+		}
+		.right{
+			display: flex;
+			align-items: center;
+			.apply{
+				width: 120rpx;
+				height: 36rpx;
+				background: linear-gradient( 270deg, #D09351 0%, #E6B976 26%, #D09351 69%, #E6B976 100%);
+				border-radius: 200rpx;
+				font-size: 24rpx;
+				line-height: 36rpx;
+				text-align: center;
+				color: #fff;
+				margin-right: 20rpx;
+			}
+		}
+	}
+</style>

+<template>
+	<view class="vip_recharge">
+		<!-- 头部详情 -->
+		<view class="vip_head">
+			<image class="head_cover" src="@/static/images/arenaDetail/vip_bg.png" mode="widthFix"></image>
+			<u-navbar
+				title="申请场馆会员卡"
+				:autoBack="true"
+				:bgColor="bgColor"
+			/>
+			
+			<view class="uesrInfoCard">
+				<view class="userInfo">
+					<u-avatar :src="src"></u-avatar>
+					<text class="name">CLOOL</text>
+					<text class="phone">（158****1234）</text>
+				</view>
+			</view>
+		</view>
+		<!-- 充值列表 -->
+		<view class="vip_list">
+			<view class="list_title">VIP会员</view>
+			<view class="price_list">
+				<PriceCard v-for="(item, index) in priceList" :key="index" :info="item" :active="index === current" @toggle="ontoggle(item, index)"/>
+			</view>
+			
+			<view class="pay_btn">确认并支付￥{{ price }}</view>
+			<view class="agreement">
+				<u-checkbox-group>
+					<u-checkbox v-model="checked" shape="circle"  activeColor="#ffa100" label="开通前请阅读《世纪创软运动系列会员服务协议》"></u-checkbox>
+				</u-checkbox-group>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import PriceCard from './components/priceCard.vue'
+	export default {
+		components: { PriceCard },
+		data(){
+			return {
+				current: 0,
+				bgColor: 'transparent',
+				checked: false,
+				price: 0,
+				priceList: [
+					{ name: '3次卡', price: 40, oldPrice: 68, avgText: '约13.3/次'},
+					{ name: '周卡', price: 150, oldPrice: 500, avgText: '约21.4/天'},
+					{ name: '季卡', price: 999, oldPrice: 1500, avgText: '约333/月'},
+					{ name: '年卡', price: 3000, oldPrice: 5000, avgText: '约250/月'}
+				],
+				src: 'https://cdn.uviewui.com/uview/album/1.jpg'
+			}
+		},
+		mounted() {
+			this.price = this.priceList[0].price
+		},
+		methods: {
+			ontoggle(item, index){
+				this.current = index
+				this.price = item.price
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.vip_recharge{
+		min-height: 100vh;
+	}
+	// 头部
+	.vip_head{
+		position: relative;
+		height: 540rpx;
+		overflow: hidden;
+		.head_cover{
+			position: absolute;
+			top: 0;
+			left: 0;
+			width: 100%;
+		}
+		.uesrInfoCard {
+			width: 100%;
+			position: absolute;
+			bottom: 40rpx;
+			padding: 0 30rpx;
+			height: 100rpx;
+			box-sizing: border-box;
+			.userInfo{
+				display: flex;
+				align-items: center;
+				height: 100%;
+				padding: 0 40rpx;
+				background: rgba(255,255,255,0.7);
+				border-radius: 16rpx;
+				color: #999999;
+				font-size: 24rpx;
+				.name{
+					margin-left: 20rpx;
+					color: #3d3d3d;
+					font-size: 28rpx;
+				}
+			}
+		}
+	}
+	
+	// 充值列表
+	.vip_list{
+		position: relative;
+		min-height: calc(100vh - 540rpx);
+		background-color: #fff;
+		margin-top: -55rpx;
+		border-radius: 40rpx 40rpx 0rpx 0rpx;
+		padding: 40rpx 30rpx 0;
+		.list_title{
+			font-size: 36rpx;
+			line-height: 48rpx;
+			font-weight: 600;
+			color: #3d3d3d;
+			padding-left: 30rpx;
+			margin-bottom: 20rpx;
+		}
+		.price_list{
+			display: flex;
+			flex-wrap: wrap;
+			gap: 30rpx;
+		}
+		.pay_btn{
+			margin: 30rpx 0;
+			width: 100%;
+			height: 100rpx;
+			background: linear-gradient( 90deg, #FFD176 0%, #FEDE9C 100%);
+			border-radius: 200rpx;
+			line-height: 100rpx;
+			text-align: center;
+			font-size: 40rpx;
+			color: #722F06;
+		}
+	}
+</style>

+<template>
+	<view class="booking">
+		<u-sticky bgColor="#fff">
+		  <view class="header_booking">
+		  	<u-tabs :list="list" lineColor="#FFA100" :activeStyle="{color: '#ffa100'}"></u-tabs>
+		  	<view class="select_list">
+		  		<view class="select_item" @click="show = true">
+		  			<text class="text">距离</text>
+		  			<u-icon name="arrow-down-fill"></u-icon>
+		  		</view>
+		  		<view class="select_item" @click="show = true">
+		  			<text class="text">价格</text>
+		  			<u-icon name="arrow-down-fill" color="#666"></u-icon>
+		  		</view>
+		  		<view class="select_item">
+		  			<text>时间段</text>
+		  			<u-icon name="arrow-down-fill" color="#666"></u-icon>
+		  		</view>
+		  	</view>
+		  </view>
+		</u-sticky>
+	
+		<!-- 球场列表 -->
+		<view class="arena_list">
+			<ArenaCard v-for="item in 5" :key="item" />
+		</view>
+		<u-picker :show="show" :columns="columns" @cancel="show = false" @confirm="show = false"></u-picker>
+	</view>
+</template>
+
+<script>
+	import ArenaCard from '@/pages/home/components/arenaCard.vue'
+	export default {
+		components: { ArenaCard },
+		data() {
+			return {
+				show: false,
+				columns: [
+					['1km以内', '3km以内', '5km以内', '10km以内']
+				],
+				list: [
+					{name: '羽毛球'},
+					{name: '网球'},
+					{name: '飞盘'},
+					{name: '足球'},
+					{name: '篮球'},
+					{name: '兵乒球'}
+				]
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.booking{
+	min-height: 100vh;
+	background-color: #F6F6F6;
+	.header_booking{
+		 background-color: #fff;
+		 .select_list{
+			 display: flex;
+			 align-items: center;
+			 justify-content: space-around;
+			 height: 84rpx;
+			 padding: 0 30rpx;
+			 border-top: 2rpx solid #E1E1E1;
+			 box-sizing: border-box;
+			 .select_item{
+				 display: flex;
+				 align-items: center;
+				 font-size: 28rpx;
+				 line-height: 32rpx;
+				 color: #666;
+				 .text{
+					 margin-right: 8rpx;
+				 }
+			 }
+		 }
+	 }
+
+	.arena_list{
+		padding: 30rpx;
+	}
+}
+</style>

+<template>
+	<view class="comfirmOrder">
+		<CommonCell :lineInfo="lineInfo" />
+		<view class="cost">人均费用：<text style="margin-left: 20rpx;color: #333;">20元/人</text></view>
+		
+		<view class="agreement_list">
+			<u-checkbox-group
+				v-model="checkboxValue"
+				placement="column"
+				@change="checkboxChange"
+			>
+				<u-checkbox
+					:customStyle="{marginBottom: '8px'}"
+					v-for="(item, index) in checkboxList"
+					shape="circle"
+					activeColor="#ffa100"
+					labelSize="26rpx"
+					size="26rpx"
+					:key="index"
+					:label="item.name"
+					:name="item.name"
+				/>
+			</u-checkbox-group>
+		</view>
+	
+	
+		<view class="pay_box">
+			<MyButton title="立即支付" @comfirn="goRouter"/>
+		</view>
+		
+		<u-popup :show="show" :round="10" mode="center" :customStyle="{width: '690rpx'}" @close="show = false">
+			<view class="popup_tip">
+				<view class="popup_title">-  温馨提示  -</view>
+				<view class="tip_box">
+					<image class="order_bg" src="@/static/images/arenaDetail/order_bg.png" mode="widthFix"></image>
+					<view class="tip_list">
+						<view class="tip_item" v-for="(item, index) in tipList" :key="index">
+							{{ item }}
+						</view>
+					</view>
+				</view>
+				
+				<view class="btn" @click="show = false">我知道了</view>
+			</view>
+		</u-popup>
+	</view>
+</template>
+
+<script>
+	import CommonCell from '@/components/commonCell.vue'
+	import MyButton from '@/components/myButton.vue'
+	export default {
+		components: { MyButton, CommonCell },
+		data() {
+			return {
+				show: false, // 弹出层提示
+				tipList: [
+					'1.下单后10分钟内可以全额退款，距离开场8小时前取消可以全额退款。',
+					'2.下单后超过10分钟取消订单退订规则如下：',
+					'3.开场前8小时内取消订单则发起人可退回支付金额的50%；',
+					'4.室外场地因天气原因取消订单，则全额退款；需场地管理人员人工审核。'
+				],
+				lineInfo: [
+					{ title: '订单流水号', valueName: '南宁站 2022-12-26 16:23:45 000026', type: 'text' },
+					{ title: '参与人数', valueName: '8人', type: 'text' },
+					{ title: '场馆', valueName: '彩虹体育馆', type: 'text' },
+					{ title: '场地', valueName: '羽毛球1号场', type: 'text' },
+					{ title: '预约时间段', valueName: '2022-12-26（周一） 15:00-16:00', type: 'text' }
+				],
+				// 选择的值
+				checkboxValue:[],
+				// 协议数据列表
+				checkboxList: [
+					{ name: '我已阅读并同意《订场条款》', disabled: false },
+					{ name: '使用余额组合支付：¥236', disabled: false },
+					{ name: '使用周卡支付', disabled: false }
+				]
+			}
+		},
+		created() {
+			this.show = true
+		},
+		 methods: {
+			checkboxChange(n) {
+				console.log('change', n);
+			},
+			goRouter(){
+				uni.navigateTo({
+					url: '/pages/paysuccess/paysuccess'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.comfirmOrder{
+	position: relative;
+	padding: 24rpx 30rpx 0;
+	box-sizing: border-box;
+	min-height: 100vh;
+	background-color: #F6F6F6;
+
+	.cost{
+		display: flex;
+		align-items: center;
+		height: 96rpx;
+		background: #FFFFFF;
+		border-radius: 12rpx 12rpx 12rpx 12rpx;
+		margin: 20rpx 0;
+		padding: 0 30rpx;
+		font-size: 26rpx;
+		color: #666;
+	}
+	.agreement_list{
+		padding-top: 20rpx;
+	}
+}
+
+.pay_box{
+	position: absolute;
+	height: 112rpx;
+	width: 100%;
+	box-sizing: border-box;
+	bottom: 0;
+	left: 0;
+	background-color: #fff;
+	padding: 16rpx 30rpx;
+}
+
+
+.popup_tip{
+	height: 784rpx;
+	background: #FFFFFF;
+	border-radius: 24rpx;
+	padding: 38rpx 52rpx;
+	.popup_title{
+		color: #ff9900;
+		font-size: 32rpx;
+		line-height: 44rpx;
+		margin-bottom: 30rpx;
+		text-align: center;
+	}
+	.tip_box{
+		position: relative;
+		height: 530rpx;
+		margin-bottom: 70rpx;
+		.order_bg{
+			position: absolute;
+			left: 0;
+			bottom: 0;
+			width: 544rpx;
+			height: 438rpx;
+		}
+		.tip_list{
+			display: flex;
+			flex-direction: column;
+			font-size: 28rpx;
+			color: #666;
+			line-height: 48rpx;
+			.tip_item{
+				margin-bottom: 60rpx;
+				&:last-child{
+					margin-bottom: 0;
+				}
+			}
+		}
+	}
+	.btn{
+		width: 372rpx;
+		height: 76rpx;
+		margin: 0 auto;
+		background: linear-gradient( 270deg, #FFA100 0%, #FCD723 100%);
+		border-radius: 686rpx;
+		font-size: 28rpx;
+		color: #fff;
+		line-height: 76rpx;
+		text-align: center;
+	}
+}
+</style>

+<template>
+	<view class="editInfo">
+		<CommonCell :lineInfo="rowTitle" @updataInfo="getUserInfo" />
+		<!-- 个人简介 -->
+		<view class="user_intro">
+			<view class="intro">个人介绍：</view>
+			<u--textarea v-model="introStr" placeholder="请输入内容" height="188rpx" border="bottom" count ></u--textarea>
+		</view>
+		
+		<view class="footer">
+			<MyButton title="确定保存"></MyButton>
+		</view>
+	</view>
+</template>
+
+<script>
+	import CommonCell from '@/components/commonCell.vue'
+	import MyButton from '@/components/myButton.vue'
+	export default {
+		components: { CommonCell, MyButton },
+		data() {
+			return {
+				introStr: '', // 简介
+				rowTitle: [
+					{ title: '头像', type: 'avatar', valueName: 'avatar' },
+					{ title: '昵称', type: 'input', valueName: 'nickname' },
+					{ title: '性别', type: 'input', valueName: 'sex' },
+					{ title: '手机号', type: 'input', valueName: 'phoneNum' },
+					{ title: '生日', type: 'input', valueName: 'Birthday' }
+				]
+			};
+		},
+		methods: {
+			getUserInfo(value) {
+				console.log((value))
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.editInfo{
+	padding: 24rpx 30rpx;
+	min-height: calc(100vh - 88rpx);
+	background-color: #F6F6F6;
+	.user_intro{
+		margin-top: 24rpx;
+		padding: 28rpx;
+		height: 312rpx;
+		background: #FFFFFF;
+		border-radius: 12rpx;
+		.intro{
+			font-size: 26rpx;
+			color: #333;
+			margin-bottom: 24rpx;
+			line-height: 36rpx;
+		}
+	}
+	.footer{
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		padding: 16rpx 30rpx;
+		background-color: #fff;
+		box-sizing: border-box;
+	}
+}
+</style>

+<template>
+	<view class="arenaCard" :style="customStyle">
+		<view class="left">
+			<image class="cover_img" src="@/static/images/home/bg-1.png" mode="scaleToFill"></image>
+		</view>
+		<view class="right">
+			<CommonTitleNav title-name="彩虹体育馆" mark-color="#FFA100" right-title="4.8分" >
+				<template #side-content>
+					{{ isBooking ? '160/小时' : '¥ 36/人' }}
+				</template>
+			</CommonTitleNav>
+			<view class="center">
+				<CommonIconNav v-if="isBooking" icon-name="map" title-content="1.2km 滨湖路地铁C口"></CommonIconNav>
+				<CommonIconNav v-else icon-name="clock" title-content="2023-02-06 9:00-23:00"></CommonIconNav>
+			</view>
+			<view v-if="isBooking" class="startTime">
+				<CommonIconNav icon-name="clock" title-content="9:00-23:00"></CommonIconNav>
+				<view class="detail" @click="goRouter('/pages/arenaDetail/arenaDetail')">
+					<text>详情</text>
+					<u-icon name="play-right-fill" color="#FFA100" size="12"></u-icon>
+				</view>
+			</view>
+		
+			<view v-else class="startTime">
+				<view class="number">
+					<u-avatar-group
+					:urls="urls"
+					size="24"
+					gap="0.4"
+				/>
+				</view>
+				<MyButton title="拼场" size="small" @comfirn="goRouter('/pages/aboutBallsDetail/aboutBallsDetail')" />
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import CommonIconNav from '@/components/commonIconNav.vue'
+	import CommonTitleNav from '@/components/commonTitleNav.vue'
+	import MyButton from '@/components/myButton.vue'
+	export default {
+		components: { CommonIconNav, CommonTitleNav, MyButton },
+		props: {
+			isBooking: {
+				type: Boolean,
+				default: true
+			},
+			customStyle: {
+				type: String,
+				default: ''
+			}
+		},
+		data() {
+			return {
+				urls: [
+					'https://cdn.uviewui.com/uview/album/1.jpg',
+					'https://cdn.uviewui.com/uview/album/2.jpg',
+					'https://cdn.uviewui.com/uview/album/3.jpg',
+					'https://cdn.uviewui.com/uview/album/4.jpg',
+					'https://cdn.uviewui.com/uview/album/7.jpg',
+					'https://cdn.uviewui.com/uview/album/6.jpg',
+					'https://cdn.uviewui.com/uview/album/5.jpg'
+				]
+			}
+		},
+		methods: {
+			goRouter(path){
+				uni.navigateTo({
+					url: path
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.arenaCard{
+		display: flex;
+		align-items: center;
+		padding: 20rpx;
+		height: 188rpx;
+		background-color: #fff;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		box-sizing: border-box;
+		.left{
+			width: 144rpx;
+			height: 144rpx;
+			margin-right: 20rpx;
+			.cover_img{
+				width: 100%;
+				height: 100%;
+			}
+		}
+		.right{
+			display: flex;
+			flex-direction: column;
+			justify-content: space-between;
+			flex: 1;
+			height: 100%;
+			.center{
+				display: flex;
+				align-items: center;
+				color: #333;
+				font-size: 24rpx;
+				line-height: 32rpx;
+			}
+			.startTime{
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				position: relative;
+				color: #666666;
+				font-size: 24rpx;
+				.detail{
+					display: flex;
+					align-items: center;
+					position: absolute;
+					color: #FFA100;
+					font-size: 24rpx;
+					top: 0;
+					right: 0;
+				}
+			}
+		}
+	}
+</style>

+<template>
+	<view class="ballNav">
+		<view class="headerNav">
+			<u-tabs :list="navlist" lineColor="#FFA100"></u-tabs>
+			<view class="classify">
+				<u-icon name="grid" color="#FFA100" size="24" :activeStyle="activeStyle" @click="isShow = !isShow"></u-icon>
+			</view>
+			<view class="select_ball" :class="{show: isShow}">
+				<view class="ball_item" @click="isShow = false">飞盘</view>
+				<view class="line"></view>
+				<view class="ball_item" @click="isShow = false">网球</view>
+			</view>
+		</view>
+		
+		<view class="date_show">
+			<view class="date_item" v-for="(item, index) in timeList" :key="index">
+				<view class="left">
+					<u-icon :name="item.iconName" color="#FFA100" size="22"></u-icon>
+					<text style="margin-left: 18rpx;">{{ item.time }}</text>
+				</view>
+				<view class="right">
+					<u-icon name="more-dot-fill" color="#999"></u-icon>
+				</view>
+			</view>
+		</view>
+	
+		<view class="btn_list">
+			<view class="boking">立即找场</view>
+			<view class="ball">发起约球</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return {
+				isShow: false, //  是否显示下拉列表
+				navlist: [
+					{ name: '篮球', id: '1'},
+					{ name: '足球', id: '2'},
+					{ name: '羽毛球', id: '3'},
+					{ name: '乒乓球', id: '4'}
+				],
+				activeStyle: {
+					color: '#111111',
+					fontSize: '30rpx'
+				},
+				timeList: [
+					{ iconName: 'calendar', time: '2月25日（今天' },
+					{ iconName: 'clock', time: '14:00 - 15:00 1小时' }
+				]
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.ballNav{
+		padding: 0 24rpx;
+		min-height: 452rpx;
+		background: #FFFFFF;
+		margin: 62rpx 0 28rpx 0;
+		border-radius: 4rpx 4rpx 4rpx 4rpx;
+		.headerNav{
+			position: relative;
+			.classify{
+				position: absolute;
+				width: 50rpx;
+				height: 50rpx;
+				right: 0;
+				top: 50%;
+				transform: translateY(-50%);
+			}
+			.select_ball{
+				position: absolute;
+				top: 76rpx;
+				left: 64%;
+				padding: 22rpx;
+				width: 220rpx;
+				min-height: 196rpx;
+				background: #FFFFFF;
+				box-shadow: 0rpx 12rpx 32rpx 0rpx rgba(0,0,0,0.1);
+				border-radius: 12rpx;
+				z-index: 99;
+				box-sizing: border-box;
+				opacity: 0;
+				transition: all .5s ease;
+				&.show{
+					opacity: 1;
+				}
+				.ball_item{
+					text-align: center;
+					font-size: 28rpx;
+					color: #333;
+				}
+				.line{
+					height: 2rpx;
+					background-color: #E1E1E1;
+					margin: 34rpx 0 ;
+				}
+			}
+		}
+	
+		.date_show{
+			.date_item{
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				height: 100rpx;
+				box-sizing: border-box;
+				border-bottom: 2rpx solid #E1E1E1;
+				.left {
+					display: flex;
+					align-items: center;
+					font-size: 28rpx;
+					line-height: 32rpx;
+					color: #111;
+				}
+			}
+		}
+		
+		.btn_list{
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			gap: 30rpx;
+			margin: 40rpx 0 54rpx 0;
+			.boking, .ball {
+				flex: 1;
+				height: 72rpx;
+				line-height: 72rpx;
+				text-align: center;
+				font-size: 28rpx;
+				color: #FFA100;
+				border-radius: 8rpx 8rpx 8rpx 8rpx;
+			}
+			.boking{
+				border: 2rpx solid #FFA100;
+			}
+			.ball {
+				background: linear-gradient( 270deg, #FFA100 0%, #FCD723 100%);
+				color: #fff;
+			}
+		}
+	}
+</style>

+<template>
+	<view class="banner">
+		<u-swiper
+			:list="list"
+			:indicator="true"
+			indicatorActiveColor="#FFA100"
+			indicatorInactiveColor="#E1E1E1"
+			indicatorMode="dot"
+		/>
+	</view>
+</template>
+
+<script>
+	import banner from '@/static/images/home/banner.png'
+	export default {
+		data() {
+			return {
+				list: [
+					banner,
+					banner,
+					banner
+				]
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.banner{
+		width: 100%;
+		box-sizing: border-box;
+	}
+</style>

+<template>
+	<view class="booking_container">
+		<view class="nav_title">
+			<view class="nav_item" v-for="(item, index) in navList" :key="index" @click="current = index">
+				<text class="ballName" :class="{ ballActive: current === index}">{{ item.ballName }}</text>
+				<text class="booking" :class="{ bookingActive: current === index}">订场</text>
+			</view>
+		</view>
+		<ArenaCard v-for="item in navList" :key="item.id" />
+	</view>
+</template>
+
+<script>
+	import ArenaCard from './arenaCard.vue'
+	export default {
+		components: { ArenaCard },
+		data(){
+			return {
+				current: 0,
+				navList: [
+					{ ballName: '羽毛球', id: 1 },
+					{ ballName: '篮球', id: 2 },
+					{ ballName: '网球', id: 3 },
+					{ ballName: '足球', id: 4 },
+				]
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.booking_container{
+		margin-top: 30rpx;
+		.nav_title{
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			margin-bottom: 28rpx;
+			.nav_item{
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				.ballName{
+					color: #333333;
+					font-size: 32rpx;
+					line-height: 44rpx;
+					&.ballActive{
+						background: linear-gradient(180deg, #FFA100 0%, #FFD400 100%);
+						-webkit-background-clip: text;
+						background-clip: text;
+						color: transparent;
+						font-weight: 400;
+					}
+				}
+				.booking{
+					color: #666666;
+					font-size: 24rpx;
+					margin-top: 8rpx;
+					&.bookingActive{
+						padding: 6rpx 24rpx;
+						color: #fff;
+						background: linear-gradient( 270deg, #FFA100 0%, #FCD723 100%);
+					}
+				}
+			}
+		}
+	}
+</style>

+<template>
+	<view class="venue">
+		<view class="title">热门场馆</view>
+		<view class="content_list">
+			<u-scroll-list indicatorWidth="0">
+				<view class="list_item" v-for="(item, index) in list" :key="index" @click="goArenaDetail">
+					<image class="cover" :src="item.thumb"></image>
+					<text class="name">{{ item.title }}</text>
+					<view class="tip">
+						<CommonIconNav icon-name="map" :title-content="item.address" />
+						<text class="price">￥{{ item.price }}人</text>
+					</view>
+				</view>
+			</u-scroll-list>
+		</view>
+	</view>
+</template>
+
+<script>
+	import bg1 from '@/static/images/home/bg-1.png'
+	import CommonIconNav from '@/components/commonIconNav.vue'
+	export default {
+		components: { CommonIconNav },
+		data(){
+			return {
+				list: [
+					{ thumb: bg1, title: '彩虹体育馆', address: '青秀区', price: 23 },	
+					{ thumb: bg1, title: '飞人网球场', address: '兴宁区', price: 23 },	
+					{ thumb: bg1, title: 'L2T体育馆', address: '西乡塘', price: 23 },
+					{ thumb: bg1, title: '广西体育馆', address: '五象新区', price: 24 },	
+				]
+			}
+		},
+		methods: {
+			goArenaDetail(){
+				uni.navigateTo({
+					url: '/pages/arenaDetail/arenaDetail'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.venue{
+		margin-top: 28rpx;
+		.title{
+			position: relative;
+			padding-left: 18rpx;
+			color: #333333;
+			font-size: 32rpx;
+			line-height: 36rpx;
+			margin-bottom: 24rpx;
+			&::before{
+				position: absolute;
+				left: 0;
+				top: 50%;
+				transform: translateY(-50%);
+				content: '';
+				width: 8rpx;
+				height: 26rpx;
+				background-color: #FFA100;
+			}
+		}
+		
+		.content_list{
+			padding: 24rpx;
+			padding-bottom: 0;
+			height: 284rpx;
+			background: #FFFFFF;
+			border-radius: 16rpx 16rpx 16rpx 16rpx;
+			box-sizing: border-box;
+			.list_item{
+				display: flex;
+				flex-direction: column;
+				margin-right: 20rpx;
+				&:last-child{
+					margin-right: 0;
+				}
+				.cover{
+					width: 220rpx;
+					height: 156rpx;
+					border-radius: 12rpx;
+					margin-bottom: 16rpx;
+				}
+				.name{
+					color: #333333;
+					font-weight: 500;
+					line-height: 34rpx;
+					font-size: 24rpx;
+					margin-bottom: 6rpx;
+				}
+				.tip{
+					display: flex;
+					align-items: center;
+					color: #666;
+					font-size: 20rpx;
+					.price{
+						margin-left: 16rpx;
+					}
+				}
+			}
+		}
+	}
+</style>

+<template>
+	<view class="search_box">
+		<view class="search_input">
+			<u-search placeholder="输入球场名字搜索" placeholder-color="#CDCDCD" bg-color="#F6F6F6" v-model="keyword" :show-action="false"></u-search>
+		</view>
+		<view class="location">
+			<u-icon name="map" color="#FFA100"></u-icon>
+			<text>南宁</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				keyword: ''
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.search_box{
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		height: 108rpx;
+		margin: 20rpx 0;
+		padding: 24rpx 30rpx;
+		box-sizing: border-box;
+		background-color: #fff;
+		.search_input{
+			flex: 1;
+		}
+		.location{
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			width: 50rpx;
+			font-size: 24rpx;
+			line-height: 28rpx;
+			color: #FFA100;
+			margin-left: 28rpx;
+		}
+	}
+</style>

+<template>
+	<view class="home_container">
+		<SearchHead />
+		<view class="content_box">
+			<Banner />
+			<BallNav />
+			<u-notice-bar :text="text"></u-notice-bar>
+			<HotVnue />
+			<BookingNavlist />
+		</view>
+	</view>
+</template>
+
+<script>
+	import SearchHead from './components/searchHead.vue'
+	import Banner from './components/banner.vue'
+	import BallNav from './components/ballNav.vue'
+	import HotVnue from './components/hotvenue.vue'
+	import BookingNavlist from './components/bookingNavlist.vue'
+	import { getSportList } from '@/api/sport.js'
+	export default {
+		components: { SearchHead, Banner, BallNav, HotVnue, BookingNavlist },
+		data() {
+			return {
+				text: '用户45553发起了琅东羽毛球场约球...'
+			};
+		},
+		async onLoad() {
+			// const res = await getSportList({pageNum: 1, pageSize: 10})
+			// console.log(res)
+		}
+	}
+</script>
+
+<style lang="scss">
+.home_container{
+	background-color: #f6f6f6;
+	min-height: calc(100vh - 88rpx);
+	padding-bottom: 60rpx;
+	.content_box{
+		padding: 0 30rpx;
+	}
+}
+</style>

+<template>
+	<view class="login-container">
+		<view class="login-title">用户名登录</view>
+		<u-form :model="logForm" ref="logForm">
+			<u-form-item prop="username">
+				<u-input v-model="logForm.username" placeholder="请输入用户名" />
+			</u-form-item>
+			<u-form-item prop="password">
+				<u-input v-model="logForm.password" type="password" placeholder="请输入密码" />
+			</u-form-item>
+			<u-form-item>
+				<u-checkbox-group>
+					<u-checkbox v-model="checked" shape="circle" active-color="#FFA100"></u-checkbox>
+					<text class="agreement">我已阅读并同意《用户协议》及《隐私协议》</text>
+				</u-checkbox-group>
+			</u-form-item>
+		</u-form>
+		<view class="btn" @click="submit">登录</view>
+		<view class="tip">
+			没有账号？<text style="color: #FFA100;" @click="goReg">去注册</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				logForm: { username: '', password: ''},
+				checked: false,
+				logRules: {
+					username: [
+						{ required: true, message: '请填写用户名', trigger: ['blur']},
+						{ pattern: /^[0-9a-zA-Z]*$/g, transform(value) { return String(value) }, message: '只能包含字母或数字', trigger: 'change' },
+						{ min: 4, max: 12, message: '长度在6-12个字符之间', trigger: 'change' }
+					],
+					password: [
+						{ required: true, message: '请填写密码', trigger: ['blur']},
+						// { pattern: /^(?=.*[A-Z])[a-zA-Z0-9]+$/, transform(value) { return String(value) }, message: '字母数字组成且必须包含大写字母', trigger: ['change', 'blur'] },
+						{ min: 6, max: 8, message: '长度在6-16个字符之间',  trigger: ['change'] },
+					]
+				}
+			}
+		},
+		// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
+		onReady() {
+			this.$refs.logForm.setRules(this.logRules);
+		},
+		methods: {
+			goReg(){
+				uni.navigateTo({
+					url: '/pages/register/register'
+				})
+			},
+			// 提交登录
+			submit() {
+				this.$refs.logForm.validate().then(valid => {
+					if (valid) {
+						this.$store.dispatch('Login', this.logForm).then(res => {
+							console.log(res)
+							uni.switchTab({
+								url: '/pages/home/home'
+							})
+						})
+					} else {
+						console.log('验证失败');
+					}
+				});
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.login-container{
+		position: relative;
+		padding: 0 30rpx;
+		box-sizing: border-box;
+		height: calc(100vh - 88rpx);
+		max-height: 100vh;
+		.login-title{
+			color: #3d3d3d;
+			font-size: 56rpx;
+			margin: 40rpx 0 60rpx 0;
+			line-height: 74rpx;
+			font-weight: 500;
+		}
+		.agreement{
+			color: #333;
+			line-height: 38rpx;
+			font-size: 28rpx;
+		}
+		.btn{
+			width: 100%;
+			height: 88rpx;
+			text-align: center;
+			line-height: 88rpx;
+			font-size: 32rpx;
+			background-color: #FFA100;
+			border-radius: 12rpx;
+			color: #fff;
+			margin-top: 30rpx;
+		}
+		.tip{
+			position: absolute;
+			bottom: 44rpx;
+			left: 50%;
+			font-size: 36rpx;
+			color: #333;
+			transform: translateX(-50%);
+		}
+	}
+</style>

+<template>
+	<view class="login-container">
+		<image class="login-bg" src="../../static/images/start/login-bg-mob.png" mode="widthFix"></image>
+		<view class="login-btn">
+			<u-button shape="circle" @click="goLogin">用户名登录/注册</u-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { userLogin } from '@/api/user.js'
+	export default {
+		onLoad() {
+			
+		},
+		methods: {
+			goLogin(){
+				uni.redirectTo({
+					url: '/pages/login/index'
+				});
+			}
+		}
+		
+	}
+</script>
+
+<style lang="scss" scoped>
+.login-container {
+	position: relative;
+	height: 100vh;
+	.login-bg{
+		width: 100%;
+		max-height: 100vh;
+		position: absolute;
+		top: 0;
+		left: 0;
+	}
+	.login-btn{
+		position: absolute;
+		top: 55%;
+		left: 50%;
+		width: 600rpx;
+		transform: translateX(-50%);
+	}
+}
+</style>

+<template>
+	<view class="mall_container">
+		<view class="locate">
+			<u-icon name="map"></u-icon>
+			<text class="site">南宁市活力篮球公园</text>
+		</view>
+		<view class="search_box">
+			<u-search placeholder="输入商品名字搜索" v-model="shopValue"></u-search>
+		</view>
+	
+	
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				shopValue: '', // 商品名称
+			};
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.mall_container{
+	min-height: 100vh;
+	box-sizing: border-box;
+	.locate{
+		height: 88rpx;
+		display: flex;
+		align-items: center;
+		padding: 0 20rpx;
+		.site{
+			color: #3d3d3d;
+			font-size: 28rpx;
+			margin-left: 10rpx;
+		}
+	}
+	.search_box{
+		height: 106rpx;
+		box-sizing: border-box;
+		padding: 14rpx 20rpx 20rpx;
+		border-bottom: 2rpx solid #eee;
+	}
+}
+</style>

+<template>
+	<view class="money_edit">
+		<view class="banner">
+			<image class="bg-img" src="@/static/myImage/wallet-bg.png" mode="widthFix"></image>
+			<view class="my_money">
+				<text>可提现金额（元）</text>
+				<text>¥<text class="number">2000.00</text> </text>
+			</view>
+		</view>
+	
+		<view class="edit_box">
+			<view class="edit_title">提现金额</view>
+			<view class="money_line">¥<text class="number">1800</text></view>
+			<view class="option">
+				<u-cell-group :border="false">
+					<u-cell title="充值方式" :border="false">
+						<view slot="right-icon" class="opton-item">
+							<u-icon name="weixin-circle-fill" color="#04B62F"></u-icon>
+							<text style="margin-left: 12rpx;">微信</text>
+						</view>
+					</u-cell>
+				</u-cell-group>
+			</view>
+			
+			<!-- 提交按钮 -->
+			<view class="footer">
+				<MyButton title="申请提现" ></MyButton>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import MyButton from '@/components/myButton.vue'
+	export default {
+		components: { MyButton },
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.money_edit{
+	min-height: 100vh;
+	background-color: #f6f6f6;
+}
+.banner{
+	position: relative;
+	height: 288rpx;
+	.bg-img{
+		width: 100%;
+		height: 100%;
+		position: absolute;
+		top: 0;
+		left: 0;
+	}
+	.my_money{
+		position: absolute;
+		top: 38rpx;
+		left: 28rpx;
+		display: flex;
+		flex-direction: column;
+		gap: 8rpx;
+		font-size: 28rpx;
+		line-height: 40rpx;
+		color: #fff;
+		.number{
+			font-size: 52rpx;
+			font-weight: 700;
+			line-height: 64rpx;
+			margin-left: 4rpx;
+		}
+	}
+}
+
+.edit_box{
+	position: relative;
+	height: 496rpx;
+	margin: 0 30rpx;
+	padding: 0 30rpx;
+	margin-top: -86rpx;
+	background: #FFFFFF;
+	border-radius: 12rpx;
+	.edit_title{
+		height: 86rpx;
+		color: #333;
+		line-height: 86rpx;
+		font-size: 28rpx;
+	}
+	.money_line{
+		font-size: 40rpx;
+		line-height: 52rpx;
+		color: #333;
+		padding-bottom: 6rpx;
+		border-bottom: 2rpx solid #D8D8D8;
+		.number{
+			font-size: 56rpx;
+			font-weight: 500;
+			margin-left: 12rpx;
+		}
+	}
+	.footer{
+		margin: 100rpx 72rpx 0;
+	}
+	.option{
+		margin-top: 30rpx;
+	}
+	
+	.opton-item{
+		display: flex;
+	}
+}
+</style>

+<template>
+	<view class="more_comment">
+		<CommentCard v-for="item in 5" :key="item" :isPadding="true"></CommentCard>
+	</view>
+</template>
+
+<script>
+	import CommentCard from '@/components/commentCard.vue'
+	export default {
+		components: { CommentCard },
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.more_comment{
+	padding: 30rpx;
+	background-color: #F6F6F6;
+}
+</style>

+<template>
+	<view class="more_photos">
+		<image v-for="(item, index) in urls2" :key="index" class="photo" :src="item" mode="widthFix"></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				urls2: [
+					'https://cdn.uviewui.com/uview/album/1.jpg',
+					'https://cdn.uviewui.com/uview/album/2.jpg',
+					'https://cdn.uviewui.com/uview/album/3.jpg',
+					'https://cdn.uviewui.com/uview/album/4.jpg',
+					'https://cdn.uviewui.com/uview/album/5.jpg',
+					'https://cdn.uviewui.com/uview/album/6.jpg',
+					'https://cdn.uviewui.com/uview/album/7.jpg',
+					'https://cdn.uviewui.com/uview/album/8.jpg',
+					'https://cdn.uviewui.com/uview/album/9.jpg',
+					'https://cdn.uviewui.com/uview/album/10.jpg'
+				],
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.more_photos {
+	display: flex;
+	flex-wrap: wrap;
+	gap: 18rpx;
+	padding: 30rpx;
+	.photo{
+		width: 330rpx;
+	}
+}
+</style>

+<template>
+	<view class="function_card">
+		<view class="function_title">{{ title }}</view>
+		<view class="function_list">
+			<view class="function_item" v-for="(item, index) in functionData" :key="index">
+				<image class="list_icon" :src="item.icon" mode="widthFix"></image>
+				<text class="list_name">{{ item.text }}</text>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	
+	export default {
+		props: {
+			title: {
+				type: String,
+				default: ''
+			},
+			functionData: {
+				tyep: Array,
+				require: true
+			}
+		},
+		methods: {
+			goRouter(){}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.function_card{
+		background: #FFFFFF;
+		border-radius: 12rpx;
+		.function_title{
+			line-height: 84rpx;
+			height: 84rpx;
+			padding-left: 36rpx;
+			font-size: 28rpx;
+			color: #333;
+			border-bottom: 2rpx solid #E1E1E1;
+			box-sizing: border-box;
+		}
+		.function_list{
+			display: flex;
+			gap: 28rpx;
+			flex-wrap: wrap;
+			padding: 24rpx 30rpx;
+			.function_item{
+				width: calc((100% - 90rpx) / 4);
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				font-size: 28rpx;
+				list-style: 40rpx;
+				color: #333;
+				.list_icon{
+					width: 52rpx;
+					height: 52rpx;
+					margin-bottom: 14rpx;
+				}
+			}
+		}
+	}
+</style>

+<template>
+	<view class="my_pages">
+		<view class="header_box">
+			<view v-if="token === ''" class="userInfo">
+				<u-avatar src="" size="108rpx"></u-avatar>
+				<view class="right" @click="goRouter('/pages/login/index')">
+					<view class="username">登录/注册</view>
+				</view>
+			</view>
+			<view v-else class="userInfo">
+				<u-avatar :src="src" size="108rpx"></u-avatar>
+				<view class="right">
+					<view class="username">CLOOL</view>
+					<view class="intro">
+						<text>一枚爱运动的少年吖~</text>
+						<u-icon name="edit-pen" color="#fff" @click="goRouter('/pages/editInfo/editInfo')"></u-icon>
+					</view>
+				</view>
+			</view>
+		</view>
+		<!-- 用户金额 -->
+		<view class="user_money">
+			<view class="left">
+				<view class="money">
+					<text>余额</text>
+					<u-icon name="eye"></u-icon>
+				</view>
+				<text>2000.00</text>
+			</view>
+			<view class="btn">我的钱包</view>
+		</view>
+		
+		<!-- 列表 -->
+		<view class="list">
+			<FunctionList title="我的订单" :functionData="orderList" />
+			<FunctionList title="我的服务" :functionData="serviceList" />
+		</view>
+	</view>
+</template>
+
+<script>
+	import All from '@/static/myImage/all.png'
+	import BookingOrder from '@/static/myImage/booking_order.png'
+	import CustomerService from '@/static/myImage/customer_service.png'
+	import EmptyWalletTime from '@/static/myImage/empty-wallet-time.png'
+	import EmptyWallet from '@/static/myImage/empty-wallet.png'
+	import Recharge from '@/static/myImage/recharge.png'
+	import SingUp from '@/static/myImage/sing_up.png'
+	import Vip from '@/static/myImage/vip.png'
+	import ToBeUsed from '@/static/myImage/to_be_used.png'
+	import FunctionList from './components/functionList.vue'
+	import { mapGetters } from 'vuex'
+	export default {
+		components: { FunctionList },
+		data() {
+			return {
+				src: 'https://cdn.uviewui.com/uview/album/1.jpg',
+				orderList: [
+					{ text: '全部', icon: All },
+					{ text: '待付款', icon: EmptyWalletTime },
+					{ text: '待使用', icon: ToBeUsed },
+					{ text: '退款售后', icon: CustomerService },
+				],
+				serviceList: [
+					{ text: '钱包', icon: EmptyWallet },
+					{ text: '充值', icon: Recharge },
+					{ text: '约球订单', icon: BookingOrder },
+					{ text: '我的报名', icon: SingUp },
+					{ text: '我的会员', icon: Vip },
+				]
+			};
+		},
+		computed: {
+			...mapGetters(['token'])
+		},
+		methods: {
+			goRouter(path){
+				uni.navigateTo({
+					url: path
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.my_pages{
+	background-color: #f6f6f6;
+	height: 100vh;
+}
+.header_box{
+	position: relative;
+	height: 330rpx;
+	padding: 0 30rpx;
+	box-sizing: border-box;
+	background: linear-gradient( 270deg, #FCD723 0%, #FFA100 100%);
+	&::after{
+		content: '';
+		position: absolute;
+		bottom: -40rpx;
+		left: 0;
+		width: 100%;
+		height: 100rpx;
+		background: linear-gradient( 270deg, #FCD723 0%, #FFA100 100%);
+		border-radius: 50%;
+	}
+	.userInfo{
+		position: absolute;
+		top: 160rpx;
+		display: flex;
+		align-items: center;
+		z-index: 10;
+		.right{
+			display: flex;
+			flex-direction: column;
+			justify-content: space-between;
+			flex: 1;
+			margin-left: 20rpx;
+			height: 100%;
+			font-size: 24rpx;
+			color: #fff;
+			.username{
+				font-size: 32rpx;
+				line-height: 48rpx;
+				font-weight: 500;
+			}
+			.intro{
+				display: flex;
+				align-items: center;
+				gap: 20rpx;
+			}
+		}
+	}
+}
+
+.user_money{
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	position: relative;
+	padding: 30rpx 32rpx;
+	background: #FFFFFF;
+	border-radius: 12rpx;
+	margin: 0 30rpx;
+	margin-top: -44rpx;
+	z-index: 20;
+	.left{
+		display: flex;
+		flex-direction: column;
+		justify-content: space-between;
+		gap: 16rpx;
+		font-size: 36rpx;
+		color: #333;
+		.money{
+			display: flex;
+			align-items: center;
+			color: #666;
+			font-size: 28rpx;
+			gap: 14rpx;
+		}
+	}
+	.btn{
+		width: 176rpx;
+		height: 60rpx;
+		background: linear-gradient( 270deg, #FFA100 0%, #FCD723 100%);
+		border-radius: 90rpx;
+		line-height: 60rpx;
+		font-size: 28rpx;
+		text-align: center;
+		color: #fff;
+	}
+}
+
+.list{
+	display: flex;
+	flex-direction: column;
+	gap: 20rpx;
+	margin: 20rpx 30rpx 0;
+}
+</style>

+<template>
+	<view class="myOrder">
+		<!-- 头部导航 -->
+		<u-sticky>
+			<view class="tab_nav">
+				<u-tabs :list="list" lineColor="#FFA100" :activeStyle="{ color: '#FFA100' }" @click="toggleOrder"></u-tabs>
+			</view>
+		</u-sticky>
+		<!-- 订单列表 -->
+		<view class="order_list">
+			<CommonCell 
+				v-for="(item, index) in showList" 
+				:key="index" 
+				:lineInfo="item.orderInfo" 
+				:headTitle="item.createTime" 
+				:state="item.orderState" 
+				:rightTitle="'合计：¥200.15'"
+				@showQRcode="showQRcode = true"
+			/>
+		</view>
+		<view v-show="showList.length === 0">
+			<u-empty
+				mode="list"
+				text="暂无订单"
+			/>
+		</view>
+		<!-- 弹出使用二维码框 -->
+		<u-popup :show="showQRcode" mode="center" @close="showQRcode = false" round="12rpx">
+			<view class="QRbox">
+				<view class="use_tip">
+					<text class="title">核销码</text>
+					<text class="use_time">有效期至 2023-02-023 13:00-16:30</text>
+					<text>错过有效期该核销码即失效</text>
+				</view>
+				<!-- 二维码使用 -->
+				<view class="qr_code">
+					<image class="qr_logo" src="@/static/myImage/QR_Code.png" mode="widthFix"></image>
+					<text>0000000000001</text>
+				</view>
+			</view>
+		</u-popup>
+	</view>
+</template>
+
+<script>
+	import CommonCell from '@/components/commonCell.vue'
+	export default {
+		components: { CommonCell },
+		data() {
+			return {
+				showQRcode: false,
+				list: [{name: '全部', id: 0}, {name: '待支付', id: 2}, {name: '已完成', id: 1}, {name: '已取消', id: 4}, {name: '待使用', id: 6}, {name: '待评价', id: 3}, {name: '退款/售后', id: 5}],
+				current: 1,
+				showList: [],
+				orderList: [
+					{
+						createTime: '2022-12-22 15:23:45',
+						orderState: 1, // 已完成
+						orderInfo: [
+							{ title: '订单编号：', valueName: '000015', type: 'text' },
+							{ title: '场馆：', valueName: '壹号球馆-1号场', type: 'text' },
+							{ title: '预约时段：', valueName: '2022-12-26 14:00-16:00', type: 'text' },
+						]
+					},
+					{
+						createTime: '2022-12-22 15:23:45',
+						orderState: 2, // 待付款
+						orderInfo: [
+							{ title: '订单编号：', valueName: '000015', type: 'text' },
+							{ title: '场馆：', valueName: '壹号球馆-1号场', type: 'text' },
+							{ title: '预约时段：', valueName: '2022-12-26 14:00-16:00', type: 'text' },
+						]
+					},
+					{
+						createTime: '2022-12-22 15:23:45',
+						orderState: 4, // 已取消
+						orderInfo: [
+							{ title: '订单编号：', valueName: '000015', type: 'text' },
+							{ title: '场馆：', valueName: '壹号球馆-1号场', type: 'text' },
+							{ title: '预约时段：', valueName: '2022-12-26 14:00-16:00', type: 'text' },
+						]
+					},
+					{
+						createTime: '2022-12-22 15:23:45',
+						orderState: 3, // 待评价
+						orderInfo: [
+							{ title: '订单编号：', valueName: '000015', type: 'text' },
+							{ title: '场馆：', valueName: '壹号球馆-1号场', type: 'text' },
+							{ title: '预约时段：', valueName: '2022-12-26 14:00-16:00', type: 'text' },
+						]
+					},
+					{
+						createTime: '2022-12-22 15:23:45',
+						orderState: 6, // 待使用
+						orderInfo: [
+							{ title: '订单编号：', valueName: '000015', type: 'text' },
+							{ title: '场馆：', valueName: '壹号球馆-1号场', type: 'text' },
+							{ title: '预约时段：', valueName: '2022-12-26 14:00-16:00', type: 'text' },
+						]
+					}
+				]
+			};
+		},
+		mounted() {
+			this.showList = this.orderList
+		},
+		methods: {
+			toggleOrder(value){
+				let id = value.id
+				if(id === 0) {
+					this.showList = this.orderList
+				} else{
+					let list = this.orderList.filter(item => item.orderState === id)
+					this.showList = list
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.myOrder{
+	background-color: #F6F6F6;
+	min-height: 100vh;
+	.tab_nav{
+		background-color: #fff;
+	}
+	.order_list{
+		display: flex;
+		flex-direction: column;
+		gap: 24rpx;
+		padding: 24rpx 30rpx;
+	}
+}
+
+.QRbox{
+	width: 690rpx;
+	height: 544rpx;
+	background: #FFFFFF;
+	border-radius: 12rpx;
+	overflow: hidden;
+	.use_tip{
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		height: 168rpx;
+		background: #FFA100;
+		padding: 20rpx 0;
+		box-sizing: border-box;
+		font-size: 24rpx;
+		color: #fff;
+		line-height: 32rpx;
+		.title{
+			font-weight: 500;
+			font-size: 28rpx;
+		}
+		.use_time{
+			margin: 24rpx 0 10rpx 0;
+		}
+	}
+	.qr_code{
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		flex-direction: column;
+		gap: 22rpx;
+		color: #333;
+		font-size: 28rpx;
+		line-height: 32rpx;
+		margin-top: 56rpx;
+		.qr_logo{
+			width: 196rpx;
+			height: 196rpx;
+		}
+	}
+}
+</style>

+<template>
+	<view class="wallet_bg">
+		<view class="banner">
+			<image class="bg-img" src="@/static/myImage/wallet-bg.png" mode="widthFix"></image>
+			<view class="my_money">
+				<text>我的余额</text>
+				<text>¥<text class="number">0.00</text> </text>
+			</view>
+			<view class="use">提现</view>
+			<view class="recharge">充值</view>
+		</view>
+		
+		<u-tabs 
+			:list="list" 
+			lineColor="#FFA100" 
+			:activeStyle="{ color: '#FFA100' }" 
+			itemStyle="padding-left: 15px; padding-right: 15px; height: 92rpx;width: 33%;box-sizing: border-box;"
+			@click="toggleData" 
+		/>
+		
+		<!-- 账单列表 -->
+		<view class="bill_list">
+			<u-cell-group :border="false">
+				<u-cell
+					v-for="(item, index) in billList" 
+					:key="index" :title="item.name" 
+					:label="item.createTime" 
+					:value="priceActive(item)"
+					:border="false"
+				/>
+			</u-cell-group>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				list: [
+					{ name: '全部', id: 1},
+					{ name: '收入', id: 2},
+					{ name: '支出', id: 3},
+				],
+				billList: [
+					{ name: '南宁站 000026', createTime: '2022-12-26 14:00:35', price: '1.09', status: 'add' },
+					{ name: '南宁站 000026', createTime: '2022-12-26 14:00:35', price: '1.09', status: 'add' },
+					{ name: '提现', createTime: '2022-12-26 14:00:35', price: '1.09', status: 'minus' },
+					{ name: '提现', createTime: '2022-12-26 14:00:35', price: '1.09', status: 'minus' },
+				]
+			};
+		},
+		computed: {
+			priceActive(){
+				return (item) => {
+					return item.status === 'add' ? `+ ${item.price}` : `- ${item.price}`
+				}
+			}
+		},
+		methods: {
+			toggleData(){
+				
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.wallet_bg{
+	padding: 20rpx 30rpx;
+	background-color: #F6F6F6;
+	min-height: 100vh;
+	.banner{
+		position: relative;
+		height: 288rpx;
+		border-radius: 16rpx;
+		.bg-img{
+			width: 100%;
+			height: 100%;
+			position: absolute;
+			top: 0;
+			left: 0;
+		}
+		.my_money{
+			position: absolute;
+			top: 38rpx;
+			left: 28rpx;
+			display: flex;
+			flex-direction: column;
+			gap: 8rpx;
+			font-size: 28rpx;
+			line-height: 40rpx;
+			color: #fff;
+			.number{
+				font-size: 52rpx;
+				font-weight: 700;
+				line-height: 64rpx;
+				margin-left: 4rpx;
+			}
+		}
+		.use{
+			position: absolute;
+			top: 96rpx;
+			left: 192rpx;
+			width: 96rpx;
+			height: 44rpx;
+			background: #FFFFFF;
+			border-radius: 40rpx;
+			text-align: center;
+			line-height: 44rpx;
+			color: #FFA100;
+			font-size: 24rpx;
+		}
+		.recharge{
+			position: absolute;
+			top: 34rpx;
+			right: 34rpx;
+			width: 128rpx;
+			height: 48rpx;
+			background: rgba(255,255,255,0.4);
+			border-radius: 40rpx;
+			color: #fff;
+			line-height: 48rpx;
+			text-align: center;
+			font-size: 24rpx;
+			border: 2rpx solid #FFFFFF;
+		}
+	}
+	.bill_list{
+		margin-top: 30rpx;
+	}
+}
+</style>

+<template>
+	<view class="edit_success">
+		<view class="header_logo">
+			<view class="logo_box">
+				<image class="success_logo" src="@/static/myImage/edit_success.png" mode="widthFix"></image>
+				<text>充值成功</text>
+			</view>
+		</view>
+		<u-cell-group :border="false">
+			<u-cell v-for="(item, index) in editInfo" :key="index" :title="item.title" :border="false" :value="item.content"></u-cell>
+		</u-cell-group>
+		
+		<view class="footer">
+			<MyButton title="完成" />
+		</view>
+	</view>
+</template>
+
+<script>
+	import MyButton from '@/components/myButton.vue'
+	export default {
+		components: { MyButton },
+		data() {
+			return {
+				editInfo: [
+					{ title: '充值金额', content: '¥1800' },
+					{ title: '充值方式', content: '微信' }
+				]
+			};
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.edit_success{
+	background-color: #fff;
+	min-height: 100vh;
+	.header_logo{
+		display: flex;
+		align-items: center;
+		flex-direction: column;
+		justify-content: center;
+		padding: 0 30rpx;
+		margin-bottom: 30rpx;
+		.logo_box{
+			display: flex;
+			align-items: center;
+			flex-direction: column;
+			justify-content: center;
+			border-bottom: 2rpx solid #E1E1E1;
+			padding: 132rpx 0 36rpx 0;
+			width: 100%;
+			.success_logo{
+				width: 136rpx;
+				height: 136rpx;
+				margin-bottom: 36rpx;
+			}
+		}	
+	}
+	.footer{
+		padding: 0 30rpx;
+		margin-top: 80rpx;
+	}
+}
+</style>

+<template>
+	<view class="container_box" style="padding-bottom: 200rpx;">
+		<!-- 球馆 -->
+		<view class="evaluate_box">
+			<!-- 头部信息 -->
+			<view class="header">
+				<view class="left_box">
+					<image class="arena_logo" src="@/static/images/home/bg-1.png" mode=""></image>
+				</view>
+				<view class="right_box">
+					<text class="title">彩虹体育馆</text>
+					<text>订单编号：000026</text>
+					<text>合计：¥200.15</text>
+				</view>
+			</view>
+			<!-- 评分列表 -->
+			<view class="evaluate_list">
+				<view v-for="(item, index) in rateList" :key="index" class="evaluate_item">
+					<view class="rate">
+						<text>{{ item.title }}</text>
+						<u-rate :count="5" v-model="item.retaValue" activeColor="#FFA100" inactiveColor="#D8D8D8" ></u-rate>
+					</view>
+					<view class="number">{{ item.retaValue }} 分</view>
+				</view>
+			</view>
+		</view>
+	
+	<!-- 评论 -->
+		<view class="user_intro">
+			<view class="intro">退款原因：</view>
+			<u--textarea v-model="introStr" :placeholder="defaultTip" placeholderClass  height="188rpx" count ></u--textarea>
+		</view>
+		
+		<view class="user_intro">
+			<view class="intro">上传图片：</view>
+			<u-upload
+				:fileList="fileList1"
+				@afterRead="afterRead"
+				@delete="deletePic"
+				name="1"
+				multiple
+				:maxCount="10"
+		 />
+		</view>
+		
+		<view class="footer">
+			<view style="flex: 1;">
+				<MyButton title="取消" bgColor="#fff" color="#999999" :border="true" />
+			</view>
+			<view style="flex: 1;">
+				<MyButton title="提交评论" />
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import MyButton from '@/components/myButton.vue'
+	export default {
+		components: { MyButton },
+		data() {
+			return {
+				introStr: '',
+				fileList1: [], // 上传图片列表
+				defaultTip: '请在此写下您的评论',
+				rateList: [
+					{ title: '环境：', retaValue: 4 },
+					{ title: '服务：', retaValue: 5 },
+					{ title: '性价比：', retaValue: 3 }
+				]
+			};
+		},
+		methods: {
+			// 删除图片
+			deletePic(event) {
+				this[`fileList${event.name}`].splice(event.index, 1)
+			},
+			// 新增图片
+			async afterRead(event) {
+				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
+				let lists = [].concat(event.file)
+				let fileListLen = this[`fileList${event.name}`].length
+				lists.map((item) => {
+					this[`fileList${event.name}`].push({
+						...item,
+						status: 'uploading',
+						message: '上传中'
+					})
+				})
+				for (let i = 0; i < lists.length; i++) {
+					const result = await this.uploadFilePromise(lists[i].url)
+					let item = this[`fileList${event.name}`][fileListLen]
+					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+						status: 'success',
+						message: '',
+						url: result
+					}))
+					fileListLen++
+				}
+			},
+			uploadFilePromise(url) {
+				return new Promise((resolve, reject) => {
+					let a = uni.uploadFile({
+						url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
+						filePath: url,
+						name: 'file',
+						formData: {
+							user: 'test'
+						},
+						success: (res) => {
+							setTimeout(() => {
+								resolve(res.data.data)
+							}, 1000)
+						}
+					});
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	// 球馆信息
+.evaluate_box{
+	height: 440rpx;
+	background: #FFFFFF;
+	border-radius: 12rpx;
+	box-sizing: border-box;
+	padding: 30rpx;
+	.header{
+		display: flex;
+		align-items: center;
+		padding-bottom: 30rpx;
+		border-bottom: 2rpx solid #E1E1E1;
+		.left_box{
+			width: 136rpx;
+			height: 136rpx;
+			margin-right: 20rpx;
+			.arena_logo{
+				width: 136rpx;
+				height: 136rpx;
+			}
+		}
+		.right_box{
+			flex: 1;
+			height: 100%;
+			display: flex;
+			flex-direction: column;
+			gap: 12rpx;
+			font-size: 24rpx;
+			color: #666;
+			line-height: 32rpx;
+			.title{
+				color: #333;
+				font-size: 28rpx;
+				line-height: 36rpx;
+			}
+		}
+	}
+
+	.evaluate_list{
+		display: flex;
+		flex-direction: column;
+		padding-top: 26rpx;
+		gap: 36rpx;
+		.evaluate_item{
+			display: flex;
+			align-items: center;
+			justify-content: space-between;	
+			font-size: 28rpx;
+			color: #333;
+			line-height: 36rpx;
+			.rate{
+				display: flex;
+				align-items: center;
+			}
+		}
+	}
+
+}
+
+// 评论
+.user_intro{
+	margin-top: 24rpx;
+	padding: 28rpx;
+	background: #FFFFFF;
+	border-radius: 12rpx;
+	.intro{
+		font-size: 26rpx;
+		color: #333;
+		margin-bottom: 24rpx;
+		line-height: 36rpx;
+	}
+}
+
+.footer{
+	position: fixed;
+	bottom: 0;
+	left: 0;
+	box-sizing: border-box;
+	display: flex;
+	align-items: center;
+	background-color: #fff;
+	justify-content: space-between;
+	gap: 34rpx;
+	width: 100%;
+	padding: 16rpx 30rpx; 
+}
+</style>

+<template>
+	<view class="pay_success">
+		<view class="header_box"></view>
+		
+		<view class="content_box">
+			<view class="dataCard">
+				<!-- 成功logo -->
+				<view class="success_log">
+					<image class="logo" src="@/static/images/arenaDetail/pay_success.png" mode="widthFix"></image>
+					<text>支付成功！</text>
+				</view>
+				<!-- 订单信息 -->
+				<view class="orderInfo">
+					<view class="order_line" v-for="(item, index) in lineInfo" :key="index">
+						<text class="left_text">{{ item.title }}</text>
+						<view class="right_text">{{ item.content }}</view>
+					</view>
+				</view>
+				
+				<!-- 总金额 -->
+				<view v-if="!isVip" class="total_money">
+					<text>总支付金额</text>
+					<text style="color: #FFA100;font-weight: 700;">¥ 234.83</text>
+				</view>
+				<!-- 周卡支付 -->
+				<view v-else class="total_money">
+					<text>周卡剩余</text>
+					<text style="color: #FFA100;">5天</text>
+				</view>
+				<view v-if="!isVip" class="avg_money">人均费用：¥ 20/人</view>
+				
+			</view>
+		</view>
+		
+		<view class="btn_list">
+			<MyButton title="查看订单" @comfirn="goRouter" />
+			<MyButton title="返回首页" :border="true" bgColor="#fff" color="#FFA100" @comfirn="goRouter" />
+		</view>
+		
+	</view>
+</template>
+
+<script>
+	import MyButton from '@/components/myButton.vue'
+	export default {
+		components: { MyButton },
+		data() {
+			return {
+				isVip: false,
+				lineInfo: [
+					{ title: '订单流水号：', content: '南宁站 2022-12-26 16:23:45 000026' },
+					{ title: '参与人数：', content: '8人' },
+					{ title: '场馆：', content: '彩虹体育馆' },
+					{ title: '场地：', content: '羽毛球1号场' },
+					{ title: '预约时间段：', content: '2022-12-26（周一） 15:00-16:00' }
+				]
+			}
+		},
+		methods: {
+			goRouter(){
+				uni.switchTab({
+					url: '/pages/home/home'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+.pay_success{
+	background-color: #F6F6F6;
+	box-sizing: border-box;
+	padding-bottom: 60rpx;
+	.header_box{
+		width: 100%;
+		height: 208rpx;
+		background: linear-gradient( 270deg, #FCD723 0%, #FFA100 100%);
+	}
+	.content_box{
+		margin-top: -140rpx;
+		padding: 0 30rpx;
+		.dataCard{
+			position: relative;
+			padding: 32rpx;
+			background-color: #fff;
+			background-blend-mode: soft-light;
+			background-size: cover;
+			background-position: center;
+			// 成功logo
+			.success_log{
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				color: #333;
+				font-size: 36rpx;
+				font-weight: 600;
+				border-bottom: 2rpx dashed rgba(225,225,225,0.7);
+				padding-bottom: 36rpx;
+				.logo{
+					width: 122rpx;
+					height: 122rpx;
+					margin-bottom: 20rpx;
+				}
+			}
+			// 订单信息
+			.orderInfo{
+				height: 468rpx;
+				background: #FFFFFF;
+				border-radius: 12rpx;
+				box-sizing: border-box;
+				border-bottom: 2rpx dashed rgba(225,225,225,0.7);
+				.order_line{
+					display: flex;
+					align-items: center;
+					height: 90rpx;
+					font-size: 26rpx;
+					.left_text{ 
+						color: #666;
+						margin-right: 6rpx;
+					}
+					.right_text{ 
+						color: #333;
+					}
+				}
+			}
+			
+			// 总金额
+			.total_money{
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				font-size: 32rpx;
+				line-height: 36rpx;
+				color: #333;
+				margin: 32rpx 0;
+			}
+			// 均额
+			.avg_money{
+				text-align: right;
+				color: #666;
+				font-size: 24rpx;
+				line-height: 36rpx;
+			}
+			
+			&::before{
+				content: '';
+				position: absolute;
+				top: -20rpx;
+				left: 0;
+				width: 100%;
+				height: 40rpx;
+				display: block;
+				background: linear-gradient(-45deg,transparent 33.33%,#fff 33.33%,#fff 66.666%,transparent 66.666%),
+				linear-gradient(45deg,transparent 33.33%,#fff 33.33%,#fff 66.666%,transparent 66.666%);
+				background-size: 28rpx 44rpx;
+			}
+			&::after{
+				content: '';
+				position: absolute;
+				bottom: -20rpx;
+				left: 0;
+				width: 100%;
+				height: 40rpx;
+				display: block;
+				background: linear-gradient(-45deg,transparent 33.33%,#fff 33.33%,#fff 66.666%,transparent 66.666%),
+				linear-gradient(45deg,transparent 33.33%,#fff 33.33%,#fff 66.666%,transparent 66.666%);
+				background-size: 28rpx 44rpx;
+				transform: rotateX(180deg);
+				
+			}
+		}
+	}
+	
+	.btn_list{
+		display: flex;
+		flex-direction: column;
+		gap: 32rpx;
+		padding: 0 30rpx;
+		margin-top: 80rpx;
+	}
+
+}
+</style>

+<template>
+	<view class="login-container">
+		<view class="login-title">用户注册</view>
+		<u-form :model="regForm" ref="regForm">
+			<u-form-item prop="username">
+				<u-input v-model="regForm.username" placeholder="请输入用户名" />
+			</u-form-item>
+			<u-form-item prop="password">
+				<u-input v-model="regForm.password" type="password" placeholder="请输入密码" />
+			</u-form-item>
+			<u-form-item prop="repassword">
+				<u-input v-model="regForm.repassword" type="password" placeholder="请再次输入密码" />
+			</u-form-item>
+			<u-form-item>
+				<u-checkbox-group>
+					<u-checkbox v-model="checked" shape="circle" active-color="#FFA100"></u-checkbox>
+					<text class="agreement">我已阅读并同意《用户协议》及《隐私协议》</text>
+				</u-checkbox-group>
+			</u-form-item>
+		</u-form>
+		<view class="btn">注册</view>
+		<view class="tip">
+			已有账号，<text style="color: #FFA100;" @click="goLog">立即登录</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				regForm: { username: '', password: '', repassword: ''},
+				checked: false,
+				regRules: {
+					username: [
+						{ required: true, message: '请填写用户名', trigger: ['blur']},
+						{ pattern: /^[0-9a-zA-Z]*$/g, transform(value) { return String(value) }, message: '只能包含字母或数字', trigger: 'blur' },
+						{ min: 6, max: 8, message: '长度在6-8个字符之间', trigger: 'change' }
+					],
+					password: [
+						{ required: true, message: '请填写密码', trigger: ['blur']},
+						{ pattern: /^(?=.*[A-Z])[a-zA-Z0-9]+$/, transform(value) { return String(value) }, message: '字母数字组成且必须包含大写字母', trigger: ['change', 'blur'] },
+						{ min: 6, max: 8, message: '长度在6-16个字符之间',  trigger: ['change'] },
+					],
+					repassword: [
+						{ required: true, message: '请填写密码', trigger: ['blur']},
+						{ pattern: /^(?=.*[A-Z])[a-zA-Z0-9]+$/, transform(value) { return String(value) }, message: '字母数字组成且必须包含大写字母', trigger: ['change', 'blur'] },
+						{ min: 6, max: 8, message: '长度在6-16个字符之间',  trigger: ['change'] },
+						{
+							validator: (rule, value, callback) => {
+								value !== this.regForm.password ? callback(new Error('两次密码输入不一致')) : callback()
+							},
+							trigger: ['change']
+						}
+					]
+				}
+			}
+		},
+		// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
+		onReady() {
+			this.$refs.regForm.setRules(this.regRules);
+		},
+		methods: {
+			// 前往登录
+			goLog() {
+				uni.redirectTo({
+					url: '/pages/login/index'
+				})
+			},
+			submit() {
+				this.$refs.regForm.validate().then(valid => {
+					if (valid) {
+						console.log('验证通过');
+					} else {
+						console.log('验证失败');
+					}
+				})
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.login-container{
+		position: relative;
+		padding: 0 30rpx;
+		box-sizing: border-box;
+		height: calc(100vh - 88rpx);
+		max-height: 100vh;
+		.login-title{
+			color: #3d3d3d;
+			font-size: 56rpx;
+			margin: 40rpx 0 60rpx 0;
+			line-height: 74rpx;
+			font-weight: 500;
+		}
+		.agreement{
+			color: #333;
+			line-height: 38rpx;
+			font-size: 28rpx;
+		}
+		.btn{
+			width: 100%;
+			height: 88rpx;
+			text-align: center;
+			line-height: 88rpx;
+			font-size: 32rpx;
+			background-color: #FFA100;
+			border-radius: 12rpx;
+			color: #fff;
+			margin-top: 30rpx;
+		}
+		.tip{
+			position: absolute;
+			bottom: 44rpx;
+			left: 50%;
+			font-size: 36rpx;
+			color: #333;
+			transform: translateX(-50%);
+		}
+	}
+</style>