diff --git a/pages/shop/cikarDrtail.vue b/pages/shop/cikarDrtail.vue
new file mode 100644
index 0000000..e0da1e1
--- /dev/null
+++ b/pages/shop/cikarDrtail.vue
@@ -0,0 +1,1350 @@
+<template>
+	<view class="content">
+		<view class="header">
+			<view class="header-top" :style="backgroundStyle" @click="goNav('/my/vip/index')">
+				<image src="../../static/servicePackage/member_ba.png" mode="widthFix" v-if="!isVIP"></image>
+				<image src="../../static/activate2.png" mode="widthFix" v-if="isVIP"></image>
+			</view>
+			<view class="header-bottom">
+				<view class="header-bottom-top">
+					<view class="header-bottom-title">
+						<view class="header-bottom-title-text">
+							<span>灸之道古法艾灸</span>
+						</view>
+					</view>
+					<view class="shop_label">
+						<span>有包厢</span>
+						<span>有吸烟区</span>
+						<span>有淋浴房</span>
+						<span>有免费wifi</span>
+					</view>
+					<view class="header-bottom-money-view">
+						<view class="shop-bottom-money1">
+							<image src="../../static/clock.png" class="shop-img"></image><span class="shop-bottom-text">营业中</span>
+							<view><span>营业时间：</span><span>周一至周日</span><span>09:30-21:30</span></view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="shop-qualifi">
+			<view class="shop-tis">经营资质备案</view>
+			<view class="view-more"></view>
+		</view>
+		<!-- <view class="detail-foot">
+			<view class="detail-foot-nav">
+				<span class="detail-foot-nav-text">适用说明</span>
+				<span class="detail-foot-nav-bor"></span>
+			</view>
+			<view class="detail-foot-mian detail-pad">
+				<view class="detail-foot-mian-top">
+					<span class="detail-foot-mian-top-title">性别限制: </span>
+					<span class="detail-foot-mian-top-text">不限性别</span>
+				</view>	
+				<view class="detail-foot-mian-top-bottom">
+					<span class="detail-foot-mian-top-title">适应人群: </span>
+					<span class="detail-foot-mian-top-text">
+						{{mainData.applyPeople}}
+					</span>
+				</view>
+			</view>
+		</view> -->
+		<view class="detail-foot">
+			<view class="detail-foot-nav">
+				<span class="detail-foot-nav-text">项目详情</span>
+				<span class="detail-foot-nav-bor"></span>
+			</view>
+			<view class="detail-foot-mian detail-pad">
+				<image class="detail-foot-mian-img" v-for="(item,index) in contentImg" :key="index" :src="item" mode="widthFix"></image>	
+				<!-- <view class="lab-view">
+					<view class="detail-foot-mian-txet" v-for="item in labels" :key="item">
+						<span class="detail-foot-mian-txetList">{{item}}</span>
+					</view>
+				</view> -->
+			</view>
+		</view>
+		<view class="detail-foot" v-if="dataList.name=='my'">
+			<view class="detail-foot-nav">
+				<span class="detail-foot-nav-text">次卡详情</span>
+				<span class="detail-foot-nav-bor"></span>
+			</view>
+			<view class="detail-foot-mian1">
+				<view class="detail-foot-list" v-for="(item,index) in detailData" :key="index">
+					<view class="detail-foot-list-top">
+						<span style="margin-right: 5px;">{{item.title}}</span>
+						<!-- <span style="display: none;">详情</span>
+						<span>服务时长:{{item.duration}}分钟</span> -->
+					</view>
+					<view class="header-bottom-money">
+						<view class="header-bottom-money-zhen">
+							已使用{{item.usedQuantity}}次
+						</view>
+						<view class="dingdan-btn" @click="detail(item)" :class="[item.usedQuantity=='0'?'dingdan-btn-h':'dingdan-btn-l']">
+							订单详情
+						</view>
+					</view>
+					<view class="header-bottom-money" style="margin-top: 5px;">
+						<view class="header-bottom-money-zhen">
+							未使用{{item.unUsedQuantity}}次
+						</view>
+						<view class="dingdan-btn" @click="goumai(item)" :class="[item.unUsedQuantity=='0'?'dingdan-btn-h':'dingdan-btn-l']">
+							立即预约
+						</view>
+					</view>
+					<view class="detail-foot-title">
+						项目次卡
+					</view>
+				</view>
+			</view>
+		</view>
+		
+		<!-- 支付方式 -->
+		<u-popup v-model="showpay" mode="bottom" :closeable="closeable">
+			<view class="popup_pay">
+				<view style="background-color: #fff;">
+					<view style="padding: 0 20upx;margin-top: 60rpx;margin-bottom: 20rpx;display: flex;flex-direction: column;justify-content: center;">
+						<view
+							style="width:92%;display: flex;height: 100upx;align-items: center;padding: 20upx 0;justify-content: center;"
+							v-for="(item,index) in openLists" :key='item.id'>
+							<image :src="item.image" style="width: 55upx;height: 55upx;border-radius: 50upx;">
+							</image>
+							<view style="font-size: 30upx;margin-left: 20upx;width: 70%;">
+								{{item.text}}
+							</view>
+							<radio-group name="openWay" style="margin-left: 45upx;" @tap='selectWay(item)'>
+								<label class="tui-radio">
+									<radio color="#096f4b" :checked="openWay === item.id ? true : false" />
+								</label>
+							</radio-group>
+						</view>
+					</view>
+				</view>
+				<view class="pay_btn" @click="pay()">确认支付</view>
+			</view>
+		</u-popup>
+	</view>
+</template>
+<script>
+	export default{
+		data(){
+			return{
+				detailData:[],
+				dataList:[],
+				mainData:[],
+				isVIP:false,
+				contentImg:[],
+				// 背景图片的URL可以是动态的，比如从API获取或根据条件生成
+				backgroundImageUrl: '',
+				couponId:'',
+				couponData:[],
+				checkbox:false,
+				showpay:false,
+				closeable: true,
+				openWay: 1,
+				paySel: 0,
+				tpayMoney: '',
+				mainId:'',
+				serviceCount:'',
+				labels:[]
+			}
+		},
+		computed: {
+		    backgroundStyle() {
+		      return {
+		        backgroundImage: `url(${this.backgroundImageUrl})`,
+		        backgroundSize: 'cover', // 根据需要调整
+		      };
+		    }
+		  },
+		onLoad(e) {
+			var that=this;
+			that.dataList=e;
+			that.isVIP=this.$queue.getData('isVIP');
+			that.getData()
+			that.youhui()
+		},
+		onShow() {
+			// #ifndef MP-WEIXIN
+			this.openLists = [{
+					image: '../../static/images/icon_weixin.png',
+					text: '微信支付',
+					id: 2
+				}, {
+					image: '../../static/images/zhifubao.png',
+					text: '支付宝支付',
+					id: 3
+				}, {
+					image: '../../static/images/lingqian.png',
+					text: '零钱支付',
+					id: 1
+				}],
+				this.openWay = 2;
+			// #endif
+		
+			// #ifdef MP-WEIXIN
+			this.openLists = [{
+					image: '../../static/images/icon_weixin.png',
+					text: '微信支付',
+					id: 2
+				}, {
+					image: '../../static/images/lingqian.png',
+					text: '零钱支付',
+					id: 1
+				}],
+				this.openWay = 2;
+			// #endif
+		},
+		methods:{
+			detail(item){//详情
+				console.log("item=====>",item)
+				if(item.usedQuantity){
+					item.id=this.mainData.id
+					uni.navigateTo({
+						url:'/pages/my/orderDetailsList?id='+item.id+'&mainId='+this.mainId+'&name='+'次卡'
+					})
+				}else{
+					uni.showToast({
+						icon:'error',
+						title:'项目次卡尚未使用，无订单信息！'
+					})
+				}
+			},
+			goumai(item){//立即购买
+				if(item.unUsedQuantity>'0'){
+					uni.navigateTo({
+						url:'/pages/my/myCiLiaoDetail?id='+item.massageTypeId+'&mainId='+this.mainId+'&name='+'次卡'
+					})
+				}else{
+					uni.showToast({
+						icon:'error',
+						title:'项目次卡已使用完成，无订单信息！'
+					})
+				}
+			},
+			goNav(e) {
+				uni.navigateTo({
+					url: e
+				})
+			},
+			payJZ() {
+				let that = this;
+				if (that.openWay == 1) { //零钱支付
+					uni.showModal({
+						title: '付款提示',
+						content: '确认支付' + that.tpayMoney + '元吗?',
+						success: function(re) {
+							if (re.confirm) {
+								that.$queue.showLoading('支付中...')
+								// console.log('用户点击确定');
+								that.$Request.post("/app/user/package/order/payOrder", {
+									ordersId: that.tordersId,
+								}).then(ret => {
+									uni.hideLoading();
+									if (ret.code == 0) {
+										uni.showToast({
+											title: '支付成功',
+											icon: 'none'
+										})
+										that.getData()
+									} else {
+										uni.showToast({
+											title: ret.msg,
+											icon: 'none'
+										})
+									}
+								});
+							} else if (re.cancel) {
+							}
+						}
+					})
+				} else if (that.openWay == 2) { //微信支付
+					// #ifdef MP-WEIXIN
+					let data = {
+						ordersId: that.tordersId,
+						type: 3
+					}
+					that.$Request.post('/app/wxPay/payOrder', data).then(ret => {
+						console.log(ret)
+						if (ret.code == 0) {
+							uni.hideLoading();
+							uni.requestPayment({
+								provider: 'wxpay',
+								timeStamp: ret.data.timestamp,
+								nonceStr: ret.data.noncestr,
+								package: ret.data.package,
+								signType: ret.data.signType,
+								paySign: ret.data.sign,
+								success: function(ret) {
+									console.log(ret)
+									uni.showToast({
+										title: '支付成功',
+										icon: 'none'
+									})
+									that.getData()
+									// this.$queue.showToast('支付成功');
+			
+									// uni.switchTab({
+									// 	url: '/pages/my/index'
+									// })
+								},
+								fail: function(err) {
+									// this.$queue.showToast('支付失败');
+									uni.showToast({
+										title: '支付失败',
+										icon: 'nones'
+									});
+								}
+							});
+						}
+					});
+					// #endif
+			
+					// #ifdef H5
+					let ua = navigator.userAgent.toLowerCase();
+					if (ua.indexOf('micromessenger') != -1) {
+						let data = {
+							ordersId: that.tordersId,
+							type: 2
+						}
+						that.$Request.post('/app/wxPay/payOrder', data).then(rea => {
+							that.showpay = false
+							if (rea.code == 0) {
+								that.callPay(rea.data);
+								that.getData()
+							} else {
+								uni.showToast({
+									title: rea.msg,
+									icon: 'none'
+								})
+							}
+						});
+					} else {
+						let data = {
+							ordersId: that.tordersId,
+							type: 4
+						}
+						that.$Request.post('/app/wxPay/payOrder', data).then(rea => {
+							that.showpay = false
+							if (rea.code == 0) {
+								const urlArr = window.location.href;
+								const hostUrl = urlArr.split("/");
+								const callBack = hostUrl[0] + "//" + hostUrl[2] + "/";
+								const url = '&redirect_url=' + callBack + 'my/order/pay';
+								window.location = rea.data.mweb_url + url
+								that.getData()
+							} else {
+								uni.showToast({
+									title: rea.msg,
+									icon: 'none'
+								})
+							}
+						});
+					}
+			
+					// #endif
+			
+					// #ifdef APP
+					let data = {
+						ordersId: that.order.ordersId,
+						type: 1
+					}
+					that.$Request.post('/app/wxPay/payOrder', data).then(rea => {
+						console.log(rea)
+						that.showpay = false
+						if (rea.code == 0) {
+							that.isCheckPay(rea.code, 'wxpay', JSON.stringify(rea.data));
+						}
+					});
+					// #endif
+				} else if (that.openWay == 3) { //支付宝支付
+					// #ifdef H5
+					let data = {
+						ordersId: that.tordersId,
+						type: 2
+					}
+					that.$Request.post('/app/aliPay/payOrder', data).then(
+						rea => {
+							that.showpay = false
+							const div = document.createElement('div')
+							div.innerHTML = rea.data //此处form就是后台返回接收到的数据
+							document.body.appendChild(div)
+							document.forms[0].submit()
+							that.getData()
+						});
+					// #endif
+			
+					// #ifdef APP-PLUS
+					let data = {
+						ordersId: that.tordersId,
+						type: 1
+					}
+					that.$Request.post('/app/aliPay/payOrder', data).then(
+						rea => {
+							that.showpay = false
+							that.setPayment('alipay', rea.data);
+							that.getData()
+						});
+					// #endif
+				}
+			
+			},
+			// 支付订单
+			pay() {
+				let that = this
+				this.showpay = false
+				if (this.paySel != 0) {
+					this.payJZ();
+					return;
+				}
+				if (that.openWay == 1) { //零钱支付
+					uni.showModal({
+						title: '付款提示',
+						content: '确认支付' + that.order.payMoney + '元吗?',
+						success: function(re) {
+							if (re.confirm) {
+								that.$queue.showLoading('支付中...')
+								console.log('用户点击确定');
+								that.$Request.post("/app/user/package/order/payOrder", {
+									ordersId: that.order.ordersId,
+								}).then(res => {
+									uni.hideLoading();
+									if (res.code == 0) {
+										uni.showToast({
+											title: '支付成功'
+										})
+										that.getData()
+									} else {
+										uni.showToast({
+											title: res.msg,
+											icon: 'none'
+										})
+									}
+								});
+							} else if (re.cancel) {
+								uni.hideLoading();
+								console.log('用户点击取消');
+							}
+						}
+			
+					})
+				} else if (that.openWay == 2) { //微信支付
+					that.$queue.showLoading('支付中...')
+					// #ifdef MP-WEIXIN
+					let data = {
+						ordersId: that.order.ordersId,
+						type: 3
+					}
+					that.$Request.post('/app/wxPay/payOrder', data).then(ret => {
+						console.log(ret)
+						if (ret.code == 0) {
+							uni.hideLoading();
+							uni.requestPayment({
+								provider: 'wxpay',
+								timeStamp: ret.data.timestamp,
+								nonceStr: ret.data.noncestr,
+								package: ret.data.package,
+								signType: ret.data.signType,
+								paySign: ret.data.sign,
+								success: function(ret) {
+									console.log(ret)
+									uni.showToast({
+										title: '支付成功',
+										icon: 'none'
+									})
+									that.getData()
+									// this.$queue.showToast('支付成功');
+			
+									// uni.switchTab({
+									// 	url: '/pages/my/index'
+									// })
+								},
+								fail: function(err) {
+									// this.$queue.showToast('支付失败');
+									uni.showToast({
+										title: '支付失败',
+										icon: 'nones'
+									});
+								}
+							});
+						}
+					});
+					// #endif
+			
+					// #ifdef H5
+					let ua = navigator.userAgent.toLowerCase();
+					if (ua.indexOf('micromessenger') != -1) {
+						let data = {
+							ordersId: that.order.ordersId,
+							type: 2
+						}
+						that.$Request.post('/app/wxPay/payOrder', data).then(rea => {
+							that.showpay = false
+							if (rea.code == 0) {
+								that.callPay(rea.data);
+								that.getData()
+							} else {
+								uni.showToast({
+									title: rea.msg,
+									icon: 'none'
+								})
+							}
+						});
+					} else {
+						let data = {
+							ordersId: that.order.ordersId,
+							type: 4
+						}
+						// debugger;
+						that.$Request.post('/app/wxPay/payOrder', data).then(rea => {
+							// const urlArr = window.location.href;
+							// const hostUrl = urlArr.split("/");
+							// const callBack = hostUrl[0] + "//" + hostUrl[2] + "/";
+							// const url = '&redirect_url=' + callBack + 'my/order/pay';
+							// window.location = rea.mweb_url + url
+							that.showpay = false
+							if (rea.code == 0) {
+								const urlArr = window.location.href;
+								const hostUrl = urlArr.split("/");
+								const callBack = hostUrl[0] + "//" + hostUrl[2] + "/";
+								const url = '&redirect_url=' + callBack + 'my/order/pay';
+								window.location = rea.data.mweb_url + url
+								that.getData()
+							} else {
+								uni.showToast({
+									title: rea.msg,
+									icon: 'none'
+								})
+							}
+						});
+					}
+			
+					// #endif
+			
+					// #ifdef APP
+					let data = {
+						ordersId: that.order.ordersId,
+						type: 1
+					}
+					that.$Request.post('/app/wxPay/payOrder', data).then(rea => {
+						console.log(rea)
+						that.showpay = false
+						if (rea.code == 0) {
+							that.getData()
+							that.isCheckPay(rea.code, 'wxpay', JSON.stringify(rea.data));
+						}
+					});
+					// #endif
+				} else if (that.openWay == 3) { //支付宝支付
+					that.$queue.showLoading('支付中...')
+					// #ifdef H5
+					let data = {
+						ordersId: that.order.ordersId,
+						type: 2
+					}
+					that.$Request.post('/app/aliPay/payOrder', data).then(
+						rea => {
+							const div = document.createElement('div')
+							div.innerHTML = rea.data //此处form就是后台返回接收到的数据
+							document.body.appendChild(div)
+							document.forms[0].submit()
+							that.getData()
+						});
+					// #endif
+			
+					// #ifdef APP-PLUS
+					let data = {
+						ordersId: that.order.ordersId,
+						type: 1
+					}
+					that.$Request.post('/app/aliPay/payOrder', data).then(
+						rea => {
+							that.setPayment('alipay', rea.data);
+							that.getData()
+						});
+					// #endif
+				}
+			},
+			openpay(item) {//立即预约
+				this.$queue.setData('mainData',item)
+				this.$queue.setData('detailData',this.detailData)
+				this.$queue.setData('xiangmu',item)
+				this.$queue.setData('youhui','');
+				uni.navigateTo({
+					url:'/my/order/payModifyCi?ordersId='+item.id
+				})
+				// this.goOrder()
+				// this.showpay = true
+			},
+			//支付选择
+			selectWay: function(item) {
+				this.openWay = item.id;
+			},
+			goOrder() {//生成orderId
+				let that = this
+				console.log('asdasd',that.couponId)
+				// let payMoney =item.price;
+				// let payMoney = that.isVip ? item.memberPrice : item.price;
+				let data = {
+				  userId: uni.getStorageSync('userId'),
+				  couponId: that.couponId,
+				  oldSumMoney: that.mainData.oldPrice*that.detailData.length,
+				  sumMoney: that.mainData.price*that.detailData.length,
+				  ordersPackageList:[
+				    {packageId: that.mainData.id,num: 1},
+				  ]
+				}
+				that.$Request.postJson("/app/user/package/order/insertOrders", data).then(res => {
+					that.showorder = false
+					if (res.code == 0) {
+						that.tordersId = res.data.ordersId;
+						that.tpayMoney = res.data.payMoney;
+						that.showpay = true;
+						that.paySel = 1;
+					} else {
+						that.$queue.showToast(res.msg)
+					}
+			
+				});
+			},
+			checkboxChange(e){
+				this.couponId=e.detail.value.join(",")
+			},
+			youhui(){//获取优惠卷
+				let that = this
+				let data = {
+							  status: 0,
+							  page: 1,
+							  limit: 10
+							}
+				that.$Request.get("/app/coupon/selectCouponUserList", data).then(res => {
+					if (res.code == 0) {
+						that.couponData=res.data.list
+					} else {
+						that.$queue.showToast(res.msg)
+					}
+							
+				});
+			},
+			getData(){
+				var that=this;
+				if(that.dataList.name=='index'){
+					let data = {
+								mainId: that.dataList.id,
+								page: that.dataList.page,
+								limit:  that.dataList.limit,
+							}
+					that.$Request.get('/app/massage/packageDetail/findAppPage', data).then(res => {
+						if (res.code == 0) {
+							that.mainData=res.mainData;
+							that.contentImg=that.mainData.contentImg.split(",");
+							that.detailData=res.detailData.list;
+							that.backgroundImageUrl=that.mainData.packageImg;
+							that.serviceCount=that.detailData[0].serviceCount;
+							that.labels=that.mainData.labels.split(',');
+						}
+					})
+				}else{
+					let data = {
+							  mainId: that.dataList.id,
+							  page: that.dataList.page,
+							  limit:  that.dataList.limit,
+							}
+					that.$Request.get('/app/user/package/detail/findMyPackageDetailList', data).then(res => {
+						if (res.code == 0) {
+							that.mainData=res.data.mainData;
+							that.contentImg=that.mainData.contentImg.split(",");
+							that.detailData=res.data.detailData;
+							that.mainId=that.mainData.id;
+							that.backgroundImageUrl=that.mainData.packageImg;
+							that.labels=that.mainData.labels.split(',');
+						}
+					})
+				}
+				
+			},
+			
+		}
+	}
+</script>
+<style scoped>
+	.lab-view{
+		width:100%;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		flex-wrap: wrap;
+	}
+	.detail-foot-mian-txet{
+		width: 50%;
+		margin-top: 20px;
+		text-align: center;
+	}
+	/deep/uni-checkbox .uni-checkbox-input{
+		width: 26px;
+		height: 26px;
+		border-radius: 50%;
+	}
+	.header-fubz{
+		font-size: 26rpx;
+		color: #029c88;
+		font-weight: bold;
+	}
+	.youhui-img{
+		width: 111.81rpx;
+		height: 111.81rpx;
+	}
+	.youhui-view-right-btn{
+		width: 158rpx;
+		height: 64rpx;
+		background: linear-gradient(-90deg, #019C88, #2DC48E);
+		border-radius: 32rpx;
+		text-align: center;
+		line-height: 64rpx;
+		font-weight: 400;
+		font-size: 28rpx;
+		color: #FFFFFF;
+		text-shadow: 0rpx 2rpx 4rpx rgba(0,119,104,0.44);
+		margin-left: 10px;
+	}
+	.youhui-view-right-time{
+		font-weight: 400;
+		font-size: 22rpx;
+		color: #999999;
+	}
+	.youhui-view-right-title{
+		width: 105px;
+		font-weight: 400;
+		font-size: 32rpx;
+		color: #333333;
+	}
+	.youhui-view-right-top{
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+	}
+	.youhui-view-right{
+		width: 502.08rpx;
+		height: 100%;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: space-around;
+	}
+	.youhui-view-left-bottom{
+		font-weight: 400;
+		font-size: 22rpx;
+		color: #FFFFFF;
+	}
+	.youhui-view-left-yuan{
+		display: flex;
+		flex-direction: row;
+		align-items: baseline;
+		color: #FFFFFF;
+	}
+	.youhui-view-left-num{
+		font-weight: bold;
+		font-size: 89rpx;
+	}
+	.youhui-view-left-text{
+		font-weight: bold;
+		font-size:24.31rpx;
+	}
+	.youhui-view-left{
+		width: 199rpx;
+		height: 242rpx;
+		display: flex;
+		flex-direction:column;
+		align-items: center;
+		justify-content: center;
+	}
+	.youhui-yiyong{
+		background-image: url('../../static/youhuijuan/coupons7.png');
+	}
+	.youhui-weiyong{
+		background-image: url('../../static/youhuijuan/coupons1.png');
+	}
+	.youhui-list{
+		width: 95%;
+		display: flex;
+		flex-direction: row;
+		height: 242rpx;
+		border-radius: 21rpx;
+		background-size: 100%;
+		margin: 20px auto;
+		justify-content: space-between;
+	}
+	.popup_pay {
+		width: 100%;
+		position: relative;
+		padding-bottom: 45rpx;
+		/* height: 400px; */
+		/* height: 160px; */
+		/* #ifndef MP-WEIXIN */
+		/* height: 130px; */
+		/* #endif */
+	
+	}
+	.pay_btn {
+		width: 90%;
+		margin: 0 auto;
+		text-align: center;
+		background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
+		height: 80rpx;
+		border-radius: 60rpx;
+		color: #ffffff;
+		line-height: 80rpx;
+	}
+	
+	.dingdan-btn{
+		text-align: center;
+		width: 80px;
+		height: 30px;
+		line-height: 30px;
+		border-radius: 4px;
+		font-weight: bold;
+		font-size: 11px;
+		border-radius: 30rpx;
+	}
+	.dingdan-btn-l{
+		background: linear-gradient(90deg, #019C88, #0FA78B, #35C495);
+		color: #FFFFFF;
+	}
+	.dingdan-btn-h{
+		background: #666;
+		color: #FFFFFF;
+	}
+	.tese span:nth-child(1){
+		font-weight: bold;
+		font-size: 22rpx;
+		color: #333333;
+	}
+	.tese span:nth-child(2){
+		font-weight: 400;
+		font-size: 22rpx;
+		color: #8D9194;
+	}
+	.tese{
+		width: 100%;
+		display: -webkit-box;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 2; /* 显示的行数，可以根据需要修改 */
+		overflow: hidden;
+		text-overflow: ellipsis;
+	}
+	.detail-foot-nav-bor{
+		width: 64px;
+		height: 11rpx;
+		border-radius: 6rpx;
+		position: absolute;
+		bottom: 0;
+		background: linear-gradient(90deg,rgba(28, 177, 143,0.3),rgba(0, 157, 136,0.7));
+	}
+	.detail-foot-nav-text{
+		font-weight: bold;
+		font-size: 32rpx;
+		color: #000000;
+	}
+	.detail-foot-nav{
+		width: 90%;
+		display: flex;
+		flex-direction: column;
+		position: relative;
+	}
+	.detail-foot-title{
+		width: 115px;
+		height: 32px;
+		background-image: url(../../static/servicePackage/horn.png);
+		background-repeat: no-repeat;
+	    background-size: 100% 100%;
+		font-weight: 400;
+		font-size: 12px;
+		color: #FFFFFF;
+		text-align: right;
+		line-height: 32px;
+		padding-right: 15px;
+		position: absolute;
+		right: 0;
+		top: 0;
+	}
+	.detail-foot-list-top{
+		width: 95%;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		margin-bottom: 25px;
+		margin-left: 10px;
+	}
+	.detail-foot-list{
+		border-radius: 21rpx;
+		position: relative;
+		display: flex;
+		flex-direction: column;
+		background-color: #fff;
+		padding: 10px;
+		margin-bottom: 10px;
+	}
+	.detail-foot{
+		width: 100%;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+	}
+	.detail-foot-list-top span:nth-child(1){
+		font-weight: bold;
+		font-size: 31rpx;
+		color: #3F3F3F;
+	}
+	.detail-foot-list-top span:nth-child(2){
+		width: 76rpx;
+		height: 33rpx;
+		line-height: 33rpx;
+		text-align: center;
+		border-radius: 16rpx;
+		border: 1px solid #7D7D7D;
+		font-weight: 400;
+		font-size: 20rpx;
+		color: #777777;
+		margin: 0px 25px 0px 5px;
+	}
+	.detail-foot-list-top span:nth-child(3){
+		font-weight: 400;
+		font-size: 22rpx;
+		color: #777777;
+	}
+	.detail-foot-mian{
+		margin: 0 auto;
+		width: 94%;
+		display: flex;
+		flex-direction: column;
+		margin: 0 auto;
+		border-radius: 21rpx;
+		background: #fff;
+	}
+	.detail-foot-mian1{
+		width: 94%;
+		display: flex;
+		flex-direction: column;
+		margin: 0 auto;
+		border-radius: 21rpx;
+		background: #fff;
+	}
+	.detail-pad{
+		padding: 30rpx;
+	}
+	.header-bottom-title-liao{
+		padding: 3px 8px;
+		height: 16px;
+		line-height: 16px;
+		text-align: center;
+		background: linear-gradient(-90deg, #FF6F48, #FF9E69);
+		border-radius: 7px;
+		margin-left: 5px;
+		font-size: 10px;
+		border-top-left-radius: 20px;
+		border-bottom-right-radius: 20px;
+		color: #fff;
+	}
+	.detail-btn{
+		width:95%;
+		height: 90rpx;
+		line-height: 90rpx;
+		background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
+		border-radius: 46rpx;
+		margin: 0 auto;
+		text-align: center;
+		font-weight: 400;
+		font-size: 36rpx;
+		color: #FFFFFF;
+	}
+	.detail-foot-mian-txet span:nth-child(1){
+		color: #777777;
+		font-size: 12px;
+		font-weight: bold;
+		margin-bottom: 5px;
+	}
+	.detail-foot-mian-txet span:nth-child(2){
+		color: #333;
+		font-size: 15px;
+		font-weight: bold;
+		margin-bottom:3px;
+	}
+	.detail-foot-mian-txetList{
+		color: #777777;
+		font-size: 14px;
+		font-weight: bold;
+	}
+	
+	.detail-foot-mian-img{
+		width: 100%;
+		height:auto;
+	}
+	.detail-foot-mian-top-bottom{
+		margin-top: 10px;
+	}
+	.detail-foot-mian-top-title{
+		color: #333333;
+	}
+	.detail-foot-mian-top-text{
+		color: #777777;
+		width:80%;
+		margin-left: 5px;
+	}
+	.detail-foot-mian-top,.detail-foot-mian-top-bottom{
+		width: 100%;
+		display: flex;
+		flex-direction: row;		
+		font-size: 26rpx;
+	}
+	.header-bottom-title-bottom span{
+		font-weight: bold;
+		font-size: 26rpx;
+		color: #20AB95;
+	}
+	.header-bottom-title-bottom image{
+		width: 34.03rpx;
+		height: 30.56rpx;
+		margin-right: 3px;
+	}
+	.header-bottom-title-bottom{
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		margin: 5px 0px;
+	}
+	.shouc image{
+		width: 34.03rpx;
+		height: 32.64rpx;
+	}
+	
+	.shouc{
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.detail-foot-nav-text{
+		font-weight: bold;
+		font-size: 32rpx;
+		color: #000000;
+	}
+	.detail-foot-nav{
+		width: 90%;
+		display: flex;
+		flex-direction: column;
+		position: relative;
+		margin-bottom: 16px;
+		margin-top: 16px;
+	}
+	.tese span:nth-child(1){
+		font-weight: bold;
+		font-size: 22rpx;
+		color: #333333;
+	}
+	.tese span:nth-child(2){
+		font-weight: 400;
+		font-size: 22rpx;
+		color: #8D9194;
+	}
+	.tese{
+		width: 100%;
+		display: -webkit-box;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 2; /* 显示的行数，可以根据需要修改 */
+		overflow: hidden;
+		text-overflow: ellipsis;
+	}
+	.detail-foot-list-top span:nth-child(1){
+		font-weight: bold;
+		font-size: 31rpx;
+		color: #3F3F3F;
+	}
+	.detail-foot-list-top span:nth-child(2){
+		width: 76rpx;
+		height: 33rpx;
+		line-height: 33rpx;
+		text-align: center;
+		border-radius: 16rpx;
+		border: 1px solid #7D7D7D;
+		font-weight: 400;
+		font-size: 20rpx;
+		color: #777777;
+		margin: 0px 25px 0px 5px;
+	}
+	.detail-foot-list-top span:nth-child(3){
+		font-weight: 400;
+		font-size: 22rpx;
+		color: #777777;
+	}
+	
+	
+	.jianjie{
+		font-weight: 400;
+		font-size: 22rpx;
+		color: #8D9194;
+		display: -webkit-box;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 2; /* 显示的行数，可以根据需要修改 */
+		overflow: hidden;
+		text-overflow: ellipsis;
+	}
+	.header-bottom-mian{
+		margin: 10px 0px;
+	}
+	.header-bottom-mian-title{
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		margin-bottom: 6px;
+	}
+	.header-bottom-mian-title span{
+		font-weight: 400;
+		font-size: 26rpx;
+		color: #20AB95;
+		margin-left: 5px;
+	}
+	.header-bottom-mian-title image{
+		width: 30.56rpx;
+		height: 29.86rpx;
+	}
+	.header-bottom-foot-view-img1{
+		width: 30rpx;
+		height: 30rpx;
+	}
+	.header-bottom-foot-view-img2{
+		width: 23rpx;
+		height: 23rpx;
+	}
+	.header-bottom-foot-view-img3{
+		width: 26rpx;
+		height: 26rpx;
+	}
+	.header-bottom-foot-view image{
+		margin-right: 1px;
+	}
+	.header-bottom-foot-view{
+		width: 32%;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: center;
+		height: 22px;
+		line-height: 22px;
+		background-color: rgba(230, 246, 243, 1);
+		border-radius: 15px;
+		font-weight: 400;
+		font-size: 10px;
+		color: #029c88;
+	}
+	.header-bottom-foot-title{
+		width:100%;
+		height: 22px;
+		line-height: 22px;
+		text-align: left;
+		font-weight: 600;
+		font-size: 23rpx;
+		color: #08A28A;
+		margin-top: 5px;
+	}
+	.header-bottom-foot-cont{
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: space-between;
+		margin-top: 40rpx;
+	}
+	.header-bottom-foot{
+		width: 100%;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+	}
+	.header-bottom-money-jia{
+		font-size: 28rpx;
+		color: #848484;
+		line-height: 37rpx;
+		margin-left: 5px;
+		text-decoration: line-through;
+	}
+	.header-bottom-money-zhen span{
+		color: #F95900;
+	}
+	.header-bottom-money-zhen span:nth-child(1){
+		font-size: 25rpx;
+	}
+	.header-bottom-money-zhen span:nth-child(2){
+		font-size:40rpx;
+		font-weight: bold;
+	}
+	.header-bottom-money-zhen span:nth-child(3){
+		font-size: 25rpx;
+	}
+	.header-bottom-money-zhen{
+		display: flex;
+		flex-direction: row;
+		align-items: baseline;
+	}
+	
+	.header-bottom-money-view{
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		justify-content: space-between;
+		margin-top:5px;
+	}
+	.header-bottom-money{
+		padding: 5px 0;
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		margin-top: 5rpx;
+		justify-content: space-between;
+	}
+	.header-bottom-money1{
+		padding: 5px 0;
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		margin-top: 5rpx;
+		align-items: flex-end;
+	}
+	.header-bottom-title-num span{
+		font-size: 30rpx;
+	}
+	.header-bottom-title-num span:nth-child(1){
+		font-weight: bold;		
+		color: #08A28A;
+	}
+	.header-bottom-title-num span:nth-child(2){
+		color: #848485;
+		margin-left: 5px;
+	}
+	.header-bottom-title-text{
+		font-weight: bold;
+		font-size: 35rpx;
+		color: #13141A;
+	}
+	.header-bottom-title{
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: space-between;
+	}
+	.header-bottom-top{
+		width: 100%;
+		display: flex;
+		flex-direction: column;
+	}
+	.header-bottom{
+		width: 100%;
+		background-color: #fff;
+		padding: 15px;
+		display: flex;
+		flex-direction: column;
+	}
+	.header-top image{
+		width: 706.25rpx;
+		height: 105.07rpx;
+	}
+	.header-top{
+		width: 100%;
+		height: 745.83rpx;
+		background-image: url('../../static/servicePackage/display.png');
+		background-size: 100%;
+		background-repeat: no-repeat;
+		display: flex;
+		align-items: flex-end;
+		justify-content: center;
+	}
+	.header{
+		width: 100%;
+		display: flex;
+		flex-direction: column;
+	}
+	.content{
+		width: 100%;
+		height: auto;
+		background-color: #f7f7f7;
+	}
+	.btn {
+    background: linear-gradient(to right, rgb(1, 156, 136), rgb(49, 193, 148));
+    color: rgb(255, 255, 255);
+    margin: 8px 16px;
+    position: fixed;
+    bottom: 0px;
+    width: 90%;
+    border-radius: 27px;
+    height: 43px;
+    line-height: 43px;
+    font-size: 17px;
+	text-align: center;
+	}
+	.shop_label{
+		display: flex;
+		flex-wrap: wrap;
+		margin-top: 20rpx;
+	}
+	.shop-arrow{
+		display: inline-block;
+		    border-top: 1px solid;
+		    border-right: 1px solid;
+		    width: 7px;
+		    height: 7px;
+		    border-color: #999;
+		    -webkit-transform: rotate(45deg);
+		    transform: rotate(45deg);
+		    margin-top: 7px;
+	}
+	.shop_label span{
+		background: #e5e5e5;
+		border-radius: 8rpx;
+		padding: 2rpx 8rpx;
+		font-size: 20rpx;
+		margin-right: 8rpx;
+		margin-bottom: 8rpx;
+	}
+	.shop-img{
+		width: 30rpx;
+		height: 30rpx;
+		margin-top: 5rpx;
+	}
+	.shop-bottom-text{
+		color: #019c88;
+		margin-right: 10rpx;
+	}
+	.shop-bottom-money1{
+		padding: 5px 0;
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		font-size: 26rpx;
+	}
+	.view-more{
+		display: inline-block;
+		border-top: 1px solid;
+		border-right: 1px solid;
+		width: 7px;
+		height: 7px;
+		border-color: #999;
+		-webkit-transform: rotate(45deg);
+		transform: rotate(45deg);
+	}
+	.shop-qualifi{
+		background: #fff;
+		margin: 10rpx auto;
+		padding: 30rpx;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: space-between;
+	}
+	.shop-tis{
+		font-size: 30rpx;
+		color: #333;
+		font-weight: bold;
+	}
+</style>
\ No newline at end of file
diff --git a/pages/shop/index.vue b/pages/shop/index.vue
new file mode 100644
index 0000000..c1f9de3
--- /dev/null
+++ b/pages/shop/index.vue
@@ -0,0 +1,511 @@
+<!-- 自定义下拉刷新与上拉加载演示(vue) -->
+<template>
+	<view class="content-view">
+		<view class="service-head-top">
+			<view class="service-head-top-left">
+				<image @click="backImg" src="../../static/fanhui.png" mode="widthFix"></image>
+				<span>{{typeData=='104'?'服务套餐':typeData=='105'?'次卡':'服务疗程'}}</span>
+			</view>
+			<view>
+				<uni-search-bar @service="serviceTrue" @confirm="search" :cancelext="'取消'" v-model="searchValue" @input="input"
+				 @clear="clear">
+				</uni-search-bar>
+				<view class="search-btn" @click="searchBtn">
+					搜索
+				</view>
+			</view>
+		</view>
+		<t-refresh ref="refresh"  v-if="dataList.length>0"  @refresh="refresh" @loadMore="loadMore" :loadingType="loadingType"   :tPadding="0">
+			<template slot="content">
+				<view>
+					<span>主营项目</span>
+				</view>
+				<view>
+					<view class="item" v-for="(item,index) in dataList" :key="index" @click="itemClick(item)">
+						<image :src="item.packageImg" mode=""  class="item-img"></image>
+						<view class="item-view">
+							<view class="view-cata">
+								<view class="item-view-title">{{item.title}}门店名称</view>
+								<span class="xiaoer item-view-biao">{{item.classifyName}}</span>
+							</view>
+							
+							<!--<view class="item-view-bottom-qian">
+								<span>￥</span>
+								<span>{{item.price}}</span>
+								<span>/ <text v-if="item.type!='104'">{{item.serviceCount}}</text>	{{typeData=='104'?'套':typeData=='105'?'次':'次'}}</span>
+								<span>￥</span>
+								<span>{{item.oldPrice}}<text  v-if="item.type!='104'">/{{item.serviceCount}}</text>{{typeData=='104'?'套':typeData=='105'?'次':'次'}}</span>
+							</view>
+							<view class="item-view-jianjie">
+								{{item.content}}
+							</view>-->
+							<!--<view class="item-view-bottom">
+								<view class="item-view-xiangmu">
+									<span>已售</span><span>{{item.sales}}w+</span> | 好评{{item.esteemRate}}% 
+								</view>
+								<view class="item-view-bottom-btn">
+									查看
+								</view>
+							</view>-->
+							<view class="flex shop_category">
+								<view class="shop_category_a">中医理疗</view>
+								<view>6.7km</view>
+							</view>
+							<view class="shop_label">
+								<span>有包厢</span>
+								<span>有吸烟区</span>
+								<span>有淋浴房</span>
+								<span>有免费wifi</span>
+							</view>
+						</view>
+					</view>
+					<view class="shop_item">
+						<view>
+							<span>￥</span>
+							<span class="shop_color">980</span>
+							<span>元</span>
+						</view>
+						<view>【冬病夏治】无烟明火艾灸疗</view>
+						<view class="shop-arrow"></view>
+					</view>
+				</view>
+				<empty v-if="dataList.length==0"></empty>
+			</template> 
+		</t-refresh>
+			
+	</view>
+</template>
+
+<script>
+	import empty from '@/components/empty.vue'
+	import tRefresh from "@/components/t-refresh/t-refresh.vue"
+	export default {
+		components:{tRefresh,empty},
+		data() {
+			return {
+				loadingType:0,
+				myId: '',
+				// v-model绑定的这个变量不要在分页请求结束中自己赋值！！！
+				dataList: [],
+				typeData:'104',
+				tabIndex: 0,
+				searchValue:'',
+				serviceTrue:true,
+				page:1,
+				limit:10,
+				titleNmae:'',
+				classifyId:'',
+				getName:'',
+			}
+		},
+		onLoad(e){
+			this.typeData=e.type
+			this.getName=e.name;
+			this.myId = uni.getStorageSync('userId')
+			this.getData()
+		},
+		onPullDownRefresh: function() {
+			this.page = 1;
+			this.getData()
+		},
+		methods: {
+			// 加载更多
+			loadMore: async function() {
+				//loadingType: 0.数据未加载完 1.数据全部加载完了 2.数据加载中
+				if(this.loadingType==0){
+					this.loadingType=2
+					//模拟数据请求
+					setTimeout(()=>{
+						this.page++;
+						this.loadingType=0;
+						this.getData()
+					},1000)
+				}
+			},
+			
+			input(res) {//搜索 输入框
+				this.searchValue=res;
+				console.log('----input:', res)
+			},
+			searchBtn(){//搜索按钮
+				if(this.searchValue!=""){
+					this.getData()
+				}
+			},
+			getData(){
+				var that=this;
+					that.$Request.get("/app/massage/package/findPage", {
+						type:that.typeData,
+						page:that.page,
+						limit:that.limit,
+						title:that.searchValue
+					}).then(res => {
+						if (res.code == 0) {
+							if (res.data) {
+								if (this.page == 1) this.dataList = []; //如果是第一页需手动制空列表
+								this.dataList = [...this.dataList, ...res.data.list]; //追加新数据
+								uni.stopPullDownRefresh()
+							}
+						}
+					});
+			},
+			backImg(){//返回上一页
+				uni.reLaunch({
+					url:'/pages/index/index'
+				})
+			},	
+			clear(res) {
+				this.getData()
+			},
+			itemClick(item) {
+				if(this.typeData=='104'){
+					uni.navigateTo({
+						url:'/pages/my/serviceOderDrtail?id='+item.id+'&limit='+this.limit+'&page='+this.page+'&name='+this.getName+'&isCanCoupon='+item.isCanCoupon
+					})
+				}else if(this.typeData=='105'){
+					uni.navigateTo({
+						url:'/pages/my/cikarDrtail?id='+item.id+'&limit='+this.limit+'&page='+this.page+'&name='+this.getName+'&isCanCoupon='+item.isCanCoupon
+					})
+				}else if(this.typeData=='106'){
+					uni.navigateTo({
+						url:'/pages/my/fuwuliaochengDetail?id='+item.id+'&limit='+this.limit+'&page='+this.page+'&name='+this.getName+'&isCanCoupon='+item.isCanCoupon
+					})
+				}
+				
+				
+			}
+		}
+	}
+</script>
+
+<style scoped>
+	.item-view-bottom-qian{
+		margin-top: 5px;
+	}
+	/deep/.refresh-body .content{
+		background-color: #f7f7f7;
+	}
+	/deep/.refresh-body{
+		height: 100% !important;
+		border-top: 2px solid #f7f7f7;
+		margin: 50px 0px;
+	}
+	.content-view{
+		width: 100%;
+		height: 100vh;
+		overflow: auto;
+		background-color: #f7f7f7;
+		position: relative;
+	}
+	.item-view-bottom-btn{
+		text-align: center;
+		width: 131rpx;
+		height: 55rpx;
+		line-height: 55rpx;
+		background: linear-gradient(90deg, #019C88, #0FA78B, #35C495);
+		border-radius: 10rpx;
+		font-weight: bold;
+		font-size: 28rpx;
+		color: #FFFFFF;
+	}
+	.item-view-bottom-qian span:nth-child(4){
+		 font-size: 28rpx;
+		 color: #848484;
+		 text-decoration-line: line-through;
+		 margin-left: 5px;
+	}
+	.item-view-bottom-qian span:nth-child(5){
+		 font-size: 28rpx;
+		 color: #848484;
+		 text-decoration-line: line-through;
+		}
+	.item-view-bottom-qian span:nth-child(1){
+		 font-weight: 400;
+		 font-size: 25rpx;
+		 color: #F95900;
+	}
+	.item-view-bottom-qian span:nth-child(2){
+		 font-weight: bold;
+		 font-size: 36.81rpx;
+		  color: #F95900;
+	}
+	.item-view-bottom-qian span:nth-child(3){
+		 font-size: 25rpx;
+		 color: #F95900;
+	}
+	.item-view-bottom{
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		justify-content: space-between;
+		align-items: center;
+	}
+	.item-view-jianjie{
+		font-weight: 400;
+		font-size: 24rpx;
+		color: #999999;
+		margin:5px 0px;
+		display: -webkit-box;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 2; /* 显示的行数，可以根据需要修改 */
+		overflow: hidden;
+		text-overflow: ellipsis;
+	}
+	.item-view-biao{
+		padding: 1px 5px;
+		border-radius: 15rpx 3rpx 15rpx 3rpx;
+	}
+	.tuina{
+		background-color:#d1f2df;
+		color: #17984d;
+	}
+	.xiaoer{
+		background-color:#f1f8d7;
+		color: #58b314;
+	}
+	.taishi{
+		background-color:#e5d5c6;
+		color: #805d39;
+	}
+	.kangfu{
+		background-color:#fcf3da;
+		color: #ff8600;
+	}
+	.item-view-xiangmu span:nth-child(2){
+		font-weight: normal;
+		color: #666666;
+	}
+	.item-view-xiangmu span:nth-child(1){
+		font-weight: normal;
+		color: #999;
+		margin-right: 5rpx;
+	}
+	.item-view-xiangmu{
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		font-weight: 400;
+		font-size: 25rpx;
+		align-items: flex-end;
+	}
+	.item-view-title{
+		width: 76%;
+		font-weight: bold;
+		font-size: 32rpx;
+		color: #333333;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+	}
+	.item-view{
+		width: 55%;
+		height: 100%;
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+	}
+	.item-img{
+		width: 285rpx;
+		height: 120px;
+		border-radius: 14rpx;
+		position: relative;
+	}
+	.item-img img{
+		border-radius: 14rpx;	
+	}
+	.img-span{
+		padding: 2px 5px;
+		font-weight: 400;
+		font-size: 8px;
+		color: #FFFFFF;
+		background: linear-gradient(-90deg, #FF6F48, #FF9E69);
+		border-radius: 7px 0px 7px 0px;
+		position: absolute;
+		bottom: 0px;
+		right: 0;
+		margin-bottom: 5px;
+		margin-right: 5px;
+	}
+	.item-img image{
+		width: 100%;
+		height: 100%;
+	}
+	.item {
+		width: 96%;
+		margin: 0 2% ;
+		display: flex;
+		flex-direction: row;
+		justify-content: space-between;
+		height: 140px;
+		background: #FFFFFF;
+		border-radius: 21rpx;
+		margin-top:10px;
+		align-items: center;
+		padding: 0px 10px;
+	}
+	
+	.item-detail {
+		padding: 5rpx 15rpx;
+		border-radius: 10rpx;
+		font-size: 28rpx;
+		color: white;
+		background-color: #007AFF;
+	}
+	
+	.item-line {
+		position: absolute;
+		bottom: 0rpx;
+		left: 0rpx;
+		height: 1px;
+		width: 100%;
+		background-color: #eeeeee;
+	}
+	/deep/.zp-paging-container{
+		background-color: #f7f7f7;
+		width:100%;
+	}
+	/deep/.zp-paging-container-content{
+		width: 95%;
+		margin: 0 auto;
+	}
+	.fenlei{
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: space-between;
+	}
+	.index-fenl-title{
+		width: 81rpx;
+		text-align: center;
+		position: relative;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		font-weight: bold;
+		font-size: 34rpx;
+		color:#019C88;
+	}
+	.index-fenl-title-bottom{
+		position: absolute;
+		bottom: 0;
+		margin-bottom: 0px;
+		width: 81rpx;
+		height: 14rpx;
+		border-radius: 7rpx;
+		background: linear-gradient(-48deg,rgba(1, 156, 136, 0.35),rgba(45, 196, 142, 0.35));
+	}
+	/deep/.uni-searchbar__cancel{
+		display: none;
+	}
+	.search-btn{
+		text-align: center;
+		line-height: 31px;
+		color: #fff;
+		position: absolute;
+		right: 0;
+		top: 0;
+		margin-top:9.4px;
+		margin-right: 11px;
+		height: 32px !important;
+	}
+	/deep/.uni-searchbar__box-icon-search,.search-btn{
+		width: 150rpx;
+		height: 60rpx;
+		background: #18A689;
+		border-radius: 31rpx;
+		
+	}
+	/deep/.uni-searchbar__box{
+		height: 31px;
+		border-radius: 15px !important;
+		background-color: #fff !important;
+		border: 1px solid #E5E5E5;
+		padding: 0px;
+		display: flex;
+		flex-direction: row;
+		flex-flow: row-reverse;
+		position: relative;
+	}
+	/deep/.uni-searchbar{
+		width: 240px;
+		border-radius: 31rpx;
+	}
+	.service-head-top-left image{
+		width: 25px;
+		height: 30rpx;
+		margin-right: 10px;
+	}
+	.service-head-top-left span{
+		font-weight: bold;
+		font-size: 34rpx;
+		color: #171717;
+	}
+	.service-head-top-left{
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: space-between;
+	}
+	.service-head-top{
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: space-between;
+		background-color: #fff;
+		position: fixed;
+		z-index: 999;
+	}
+	.view-cata{
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+	}
+	.shop_category{
+		display: flex;
+		flex-wrap: wrap;
+		align-items: flex-end;
+		justify-content: space-between;
+		font-size: 26rpx;
+		padding: 8rpx 0;
+		margin-top:40rpx ;
+	}
+	.shop_category_a{
+		color: #019c88;
+	}
+	.shop_item{
+		display: flex;
+		flex-wrap: wrap;
+		justify-content: space-between;
+		width: 90%;
+		margin: 15rpx auto;
+	}
+	.shop_color{
+		color:#fb672b;
+		font-weight: bold;
+		font-size: 38rpx;
+	}
+	.shop_label{
+		display: flex;
+		flex-wrap: wrap;
+	}
+	.shop-arrow{
+		display: inline-block;
+		    border-top: 1px solid;
+		    border-right: 1px solid;
+		    width: 7px;
+		    height: 7px;
+		    border-color: #999;
+		    -webkit-transform: rotate(45deg);
+		    transform: rotate(45deg);
+		    margin-top: 7px;
+	}
+	.shop_label span{
+		background: #e5e5e5;
+		border-radius: 8rpx;
+		padding: 2rpx 8rpx;
+		font-size: 20rpx;
+		margin-right: 8rpx;
+		margin-bottom: 8rpx;
+	}
+</style>
diff --git a/static/clock.png b/static/clock.png
new file mode 100644
index 0000000..8faf428
Binary files /dev/null and b/static/clock.png differ