auto

center/center.vue

@@ -101,7 +101,7 @@
 					refundNum:'0',
 				},
 				tools:[
-					{name:'充值中心',url:'/center/addrlist',ico:this.$commonConfig.staticUrl+'/img/tool-chongzhi.png'},
+					{name:'充值中心',url:'/center/recharge',ico:this.$commonConfig.staticUrl+'/img/tool-chongzhi.png'},
 					{name:'地址管理',url:'/center/addrlist',ico:this.$commonConfig.staticUrl+'/img/tool-map.png'},
 				]
 			}

center/recharge.vue

@@ -0,0 +1,108 @@
+<template>
+	<view class="">
+		<u-navbar
+			title="充值"
+			:autoBack="true"
+			bgColor="#00A447"
+			leftIconColor="#fff"
+			:titleStyle="{color:'#fff'}"
+			:safeAreaInsetTop="true"
+		>
+		</u-navbar>
+		<view class="top-bg"></view>
+		<view class="page-wrap">
+			<view class="num-wrap">
+				<view class="title">充值</view>
+				<view class="inner u-flex u-row-around u-flex-wrap">
+					<view class="num-item" 
+						:class="{active:activeIndex == index}" 
+						@click="numClick(index)"
+						v-for="(item,index) in numItem" :key="item">
+						¥ {{item}}
+					</view>
+				</view>
+				<view class="full-btn" @click="submit">充 值</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				activeIndex:0,
+				numItem:[500,10000,15000]
+				
+			}
+		},
+		onShow() {
+			
+		},
+		onLoad() {
+
+		},
+		methods: {
+			numClick(index){
+				this.activeIndex = index
+			},
+			submit(){
+				let num = this.numItem[this.activeIndex];
+				console.log('num',num);
+				return
+				this.$u.api.charge({num:num}).then(res=>{
+					console.log('res',res.data);
+				}).catch(err=>{
+					console.log('charge',err);
+				})
+			}
+		}
+	}
+</script>
+<style>
+page{
+	background-color: #F5F5F5;
+}
+</style>
+<style lang="scss" scoped>
+.top-bg{
+	width: 100%;
+	height: 450rpx;
+	background-color: #00A447;
+	border-radius: 0 0 20% 20%;
+	position: absolute;
+	top: 0;
+	left: 0;
+	z-index:-1;
+}
+.num-wrap{
+	padding: 20rpx;
+	background-color: #fff;
+	border-radius: 8rpx;
+	.title{
+		font-size: 32rpx;
+		font-weight: 600;
+		margin-bottom: 20rpx;
+	}
+	.inner{
+		margin-bottom: 40rpx;
+		.num-item{
+			width: 30%;
+			height: 260rpx;
+			line-height: 260rpx;
+			background-color: #EBF8F1;
+			border: 4rpx solid #EBF8F1;
+			text-align: center;
+			font-size: 36rpx;
+			font-weight: 600;
+			color: #333333;
+			&.active{
+				border-color: #00A447;
+			}
+		}
+	}
+	.full-btn{
+		background-color: #FFB600;;
+	}
+}
+</style>

common/apiurl.js

@@ -72,6 +72,11 @@ const apiurl = {
 		url: '/shop/getIntro',
 		type: 'get'
 	},
+	// 提交合作加盟联系信息
+	shopContact: {
+		url: '/shopContact/insert',
+		type: 'post'
+	},
 	// 商行产品类型
 	shopGoodsType: {
 		url: '/shopGoodsType/list',

credits/credits.vue

@@ -11,14 +11,14 @@
 			<view class="inner">
 				<view class="top u-flex u-row-between">
 					<text>积分商城</text>
-					<view class="right u-flex">
+					<view class="right u-flex" @click="$u.route('/credits/regulation')">
 						<u-icon name="error-circle" color="#fff" size="34rpx"></u-icon>
 						<text>规则</text>
 					</view>
 				</view>
 				<view class="num">64565</view>
 				<view class="bottom">
-					<text>积分明细</text>
+					<text  @click="$u.route('/credits/creditslist')">积分明细</text>
 				</view>
 			</view>
 		</view>

credits/creditslist.vue

@@ -0,0 +1,166 @@
+<template>
+	<view class="">
+		<u-navbar
+			title="积分明细"
+			:autoBack="true"
+			 :safeAreaInsetTop="true"
+		>
+		</u-navbar>
+		<view class="tabs-wrap">
+			<u-tabs 
+			:list="tabsList" 
+			lineColor="#00A447" 
+			 :activeStyle="{color:'#333','font-weight': '600','font-size':'30rpx'}"
+			 :inactiveStyle="{color:'#999'}"
+			@click="tabsClick"></u-tabs>
+		</view>
+		<mescroll-body class="" ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :down="downOption" :up="upOption">
+			<view class="page-wrap" >
+				<view class="list">
+					<view class="item u-flex u-row-between" v-for="item in 20" :key="item">
+						<view class="left">
+							<view class="name">兑换商品</view>
+							<view class="time">2023/04/14</view>
+						</view>
+						<text class="num" v-if="1==1">-10.00</text>
+						<text class="num plus" v-else>+10.00</text>
+					</view>
+				</view>
+			</view>
+		</mescroll-body>
+	</view>
+</template>
+
+<script>
+	// 引入mescroll-mixins.js
+	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
+	export default {
+		mixins: [MescrollMixin], // 使用mixin
+		data() {
+			return {
+				downOption: {},
+				// 上拉加载的配置(可选, 绝大部分情况无需配置)
+				upOption: {
+					page: {
+						size: 10 // 每页数据的数量,默认10
+					},
+					noMoreSize: 5, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
+					empty: {
+						tip: '暂无相关数据'
+					}
+				},
+				tabsList:[{name:'全部'},{name:'获得'},{name:'消耗'}],
+				params:{
+				},
+				activeIndex:0,
+				dataList: []
+			}
+		},
+		onShow() {	
+		},
+		onLoad() {
+
+		},
+		methods: {
+			/*下拉刷新的回调, 重置列表为第一页 (此处可删,mixins已默认)
+			downCallback(){
+				this.mescroll.resetUpScroll();
+			},
+			/*上拉加载的回调*/
+			upCallback(page) {
+				// 此处可以继续请求其他接口
+				// if(page.num == 1){
+				// 	// 请求其他接口...
+				// }
+			
+				// 如果希望先请求其他接口,再触发upCallback,可参考以下写法
+				// if(!this.params.id){
+				// 	this.mescroll.endErr()
+				// 	return // 此处return,先获取xx
+				// }
+			
+				let pageNum = page.num; // 页码, 默认从1开始
+				let pageSize = page.size; // 页长, 默认每页10条isAsc:0//时间排序 0:降序 1:升序 (默认星级降序排序)
+
+				this.params = Object.assign(this.params,{pageNum:pageNum,pageSize:pageSize});
+				this.$u.api.commentList(this.params).then(data => {
+					console.log('data',JSON.parse(JSON.stringify(data)));
+					// 接口返回的当前页数据列表 (数组)
+					let curPageData = data.data.rows;
+					console.log('curPageData',JSON.parse(JSON.stringify(curPageData)));
+					// 接口返回的当前页数据长度 (如列表有26个数据,当前页返回8个,则curPageLen=8)
+					let curPageLen = curPageData.length; 
+					// 接口返回的总页数 (如列表有26个数据,每页10条,共3页; 则totalPage=3)
+					// let totalPage =  data.data.data.totalPage; 
+					// 接口返回的总数据量(如列表有26个数据,每页10条,共3页; 则totalSize=26)
+					let totalSize = data.data.total; 
+					// 接口返回的是否有下一页 (true/false)
+					// let hasNext = data.xxx; 
+					// console.log('totalPage',totalPage,'curPageLen',curPageLen);
+					//设置列表数据
+					if(page.num == 1) this.dataList = []; //如果是第一页需手动置空列表
+					this.dataList = this.dataList.concat(curPageData); //追加新数据
+					// 请求成功,隐藏加载状态
+					//方法一(推荐): 后台接口有返回列表的总页数 totalPage
+					// this.mescroll.endByPage(curPageLen, totalPage); 
+					//方法二(推荐): 后台接口有返回列表的总数据量 totalSize
+					this.mescroll.endBySize(curPageLen, totalSize); 
+				}).catch(err => {
+					this.mescroll.endErr()
+					console.log(err)
+				});	
+			
+			},
+			/*若希望重新加载列表,只需调用此方法即可(内部会自动page.num=1,再主动触发up.callback)*/
+			reloadList() {
+				this.mescroll.resetUpScroll();
+			},
+			tabsClick(item){
+				this.params.name = item.name;
+				this.reloadList()
+				// console.log('item',item);
+			},
+		}
+	}
+</script>
+<style>
+page{
+	background-color: #f5f5f5;
+}
+</style>
+<style lang="scss" scoped>
+.tabs-wrap{
+	background-color: #fff;
+	margin-bottom: 10rpx;
+}
+.list{
+	border-radius: 8rpx;
+	padding: 0 20rpx 20rpx;
+	background-color: #fff;
+	.item{
+		padding: 20rpx 0;
+		border-bottom: 0.5px solid #ddd;
+		.name{
+			font-size: 30rpx;
+			font-weight: 400;
+			color: #333333;
+			line-height: 42rpx;
+			margin-bottom: 8rpx;
+		}
+		.time{
+			font-size: 24rpx;
+			font-weight: 400;
+			color: #999999;
+			line-height: 33rpx;
+		}
+		.num{
+			font-size: 30rpx;
+			font-weight: 600;
+			color: #FFB100;
+			&.plus{
+				color: #00A447;
+			}
+		}
+	}
+}
+</style>

credits/regulation.vue

@@ -0,0 +1,40 @@
+<template>
+	<view class="">
+		<u-navbar
+			title="积分规则"
+			:autoBack="true"
+			 :safeAreaInsetTop="true"
+		>
+		</u-navbar>
+		<view class="title">积分规则</view>
+		<u-parse :content="content"></u-parse>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				content:'',
+			}
+		},
+		onShow() {	
+		},
+		onLoad() {
+
+		},
+		methods: {
+
+		}
+	}
+</script>
+<style>
+page{
+	background-color: #f5f5f5;
+}
+</style>
+<style lang="scss" scoped>
+.title{
+	text-align: center;
+}
+</style>

pages.json

@@ -53,6 +53,13 @@
 						"navigationBarTitleText": "选择地址",
 						"navigationStyle": "custom"
 					}
+				},
+				{
+					"path": "recharge",
+					"style": {
+						"navigationBarTitleText": "充值中心",
+						"navigationStyle": "custom"
+					}
 				}
 			]
 		}, 
@@ -136,6 +143,13 @@
 						"navigationBarTitleText": "物流详情",
 						"navigationStyle": "custom"
 					}
+				},
+				{
+					"path": "evaluate",
+					"style": {
+						"navigationBarTitleText": "评价",
+						"navigationStyle": "custom"
+					}
 				}
 			]
 		},
@@ -209,6 +223,20 @@
 						"navigationBarTitleText": "积分商城",
 						"navigationStyle": "custom"
 					}
+				},
+				{
+					"path": "regulation",
+					"style": {
+						"navigationBarTitleText": "积分规则",
+						"navigationStyle": "custom"
+					}
+				},
+				{
+					"path": "creditslist",
+					"style": {
+						"navigationBarTitleText": "积分明细",
+						"navigationStyle": "custom"
+					}
 				}
 			]
 		}

pages/index/index.vue

@@ -50,7 +50,7 @@
 					<u--image class="image" :src="staticUrl+'/img/index-nav-3.png'" width="101rpx" height="101rpx"></u--image>
 					积分商城
 				</view>
-				<view class="nav-item">
+				<view class="nav-item" @click="$u.route('/center/recharge',{type:'reLaunch'})">
 					<u--image class="image" :src="staticUrl+'/img/index-nav-4.png'" width="101rpx" height="101rpx"></u--image>
 					充值中心
 				</view>

shopping/evaluate.vue

@@ -0,0 +1,139 @@
+<template>
+	<view class="page-wrap">
+		<u-navbar
+			title="发表评价"
+			:autoBack="true"
+			 :safeAreaInsetTop="true"
+		>
+		</u-navbar>
+		<view class="product u-flex" v-for="(item,index) in orderDetails.detailList" :key="item.id">
+			<u--image :showLoading="true" :src="item.mainImg" width="180rpx" height="180rpx"></u--image>
+			<view class="text">
+				<view class="up">
+					<view class="name ellipsis-2">{{item.goodsName}}</view>
+					<view class="info">
+						{{item.specification}}
+						{{item.unit}}
+					</view>
+				</view>
+				<!-- <view class="down u-flex u-row-between">
+					<view class="left">
+						<text class="price">¥ <text class="price-num">{{item.price}}</text></text>
+					</view>
+				</view> -->
+			</view>
+		</view>
+		<view class="rate-wrap u-flex">
+			<text class="rate-title">商品评价</text>
+			<u-rate count="5" v-model="params.rate"  active-color="#FFBE00" size="20"></u-rate>
+			<text class="rate-text">{{params.rate|rateText}}</text>
+		</view>
+		<u--textarea v-model="params.content" height="200rpx" maxlength="200" placeholder="如实描述商品和使用感受，更受欢迎" ></u--textarea>
+		<view class="upload-wrap">
+			<u-upload
+				 width="140rpx"
+				 height="140rpx"
+			    :fileList="fileList"
+			    @afterRead="afterRead"
+				@delete="deletePic"
+				:previewImage="true"
+				multiple
+			    name="name"
+			    :maxCount="9"
+			></u-upload>
+		</view>
+		<view class="full-btn" @click="submit">提交评价</view>
+	</view>
+</template>
+
+<script>
+	import {uploadImg} from '../utils/uploadImg.js'
+	export default {
+		data() {
+			return {
+				id:'',
+				params:{
+					rate:3,
+					content:'',
+					imgs:[]
+				},
+				fileList:[],
+				orderDetails:{},
+				staticUrl:this.$commonConfig.staticUrl,
+			}
+		},
+		onShow() {	
+		},
+		onLoad(page) {
+			console.log('page',page);
+			this.id = page.id;
+			this.getOrderDetails(this.id)
+		},
+		methods: {
+			getOrderDetails(id){
+				this.$u.api.orderDetails({id:id}).then(res=>{
+					this.orderDetails = res.data
+					console.log('orderDetails',JSON.parse(JSON.stringify(res.data)));
+				}).catch(err=>{
+					console.log('getOrderDetails',err);
+				})
+			},
+			// 新增图片
+			async afterRead(event){
+				//使用这个封装
+				const result = await uploadImg(event,this.fileList)
+				// let parseResult = JSON.parse(result.data).data;
+				let item = this.fileList[result.fileListLen]
+				this.fileList.splice(result.fileListLen, 1, Object.assign(item, {
+					status: 'success',
+					message: '成功',
+					url: JSON.parse(result.data).data
+				}));
+			},
+			// 删除图片
+			deletePic(event) {
+				this.fileList.splice(event.index, 1)
+			},
+			submit(){
+				this.params.imgs = this.fileList.map(item =>{
+					if(item.message=='成功'){
+						return item.url.url
+					}
+				})
+				console.log('params',this.params);
+			}
+		}
+	}
+</script>
+<style>
+page{
+	background-color: #F5F5F5;
+}
+</style>
+<style lang="scss" scoped>
+.product{
+	background-color: #fff;
+	margin-bottom: 0;
+}
+.rate-wrap{
+	background-color: #fff;
+	margin-bottom: 20rpx;
+	padding: 20rpx;
+	.rate-title{
+		font-size: 30rpx;
+		color: #333;
+		font-weight: 600;
+		margin-right: 20rpx;
+	}
+	.rate-text{
+		font-size: 26rpx;
+		margin-left: 20rpx;
+		color: #ccc;
+	}
+}
+.upload-wrap{
+	margin-top: 40rpx;
+	padding: 20rpx;
+	background-color: #fff;
+}
+</style>

shopping/order.vue

@@ -81,7 +81,7 @@
 				status:'',
 				dataList:[{status:0},{status:1},{status:2},{status:3},{status:4}],
 				statusBtn:{
-					0:[{name:'查看物流',fun:'logistics',class:''},{name:'取消订单',fun:'cancel ',class:''},{name:'去支付',fun:'pay',class:'red'}],
+					0:[{name:'取消订单',fun:'cancel ',class:''},{name:'去支付',fun:'pay',class:'red'}],
 					1:[{name:'申请退款',fun:'refund',class:'green'}],
 					2:[{name:'查看物流',fun:'logistics',class:''},{name:'确认收货',fun:'confirmReceipt',class:'green'}],
 					3:[{name:'查看物流',fun:'logistics',class:''},{name:'评价',fun:'evaluate',class:'green'}],
@@ -197,7 +197,8 @@
 				// console.log('fun',fun);
 				let funObj = {
 				  pay: this.pay,
-				  logistics:this.logistics
+				  logistics:this.logistics,
+				  evaluate:this.evaluate
 				};
 				if (fun in funObj) {
 				  funObj[fun](item);
@@ -211,6 +212,12 @@
 				uni.$u.route('/shopping/distribution', {
 					name: 'lisa'
 				});
+			},
+			evaluate(item){
+				console.log('logistics',item);
+				uni.$u.route('/shopping/evaluate', {
+					id: item.id
+				});
 			}
 		}
 	}

utils/filter.js

@@ -86,3 +86,10 @@ Vue.filter("filterOrderState", function(val) {
 	return orderList[val]
 });
 
+// 订单状态
+Vue.filter("rateText", function(val) {	
+	let rateList = ['很差', '差', '一般', '很好', '非常好']
+	return rateList[val-1]
+});
+
+

xushuo/about.vue

@@ -17,17 +17,29 @@
 			:current="curNow"></u-subsection>
 			<view class="content">
 				<view class="" v-if="curNow==0">
-					<view class="name">贵州旭烁食品有限公司简介</view>
-					<u--image v-if="pageData.uxImg" :src="pageData.uxImg" :showLoading="true" width="100%" mode="aspectFill"></u--image>
-					<view class="xsIntro">{{pageData.xsIntro}}</view>
-					<view class="shopIntro">
-						<view class="title">一、成立背景</view>
-						{{pageData.shopIntro}}
+					<!-- <view class="name">贵州旭烁食品有限公司简介</view> -->
+					<view class="u-content" style="margin-top: 40rpx;">
+						<u-parse :content="pageData.xsIntro"></u-parse>
+					</view>
+					<view class="contact">
+						<view class="item">联系电话：{{pageData.xsMobile}}</view>
+						<view class="item">营业世间：{{pageData.xsServiceTime}}</view>
+						<view class="item">旭烁地址：{{pageData.xsAddress}}</view>
 					</view>
-					<!-- <view class="shopIntro">{{pageData.shopIntro}}</view> -->
 				</view>
 				<view class="" v-if="curNow==1">
-					
+					<view class="u-content" style="margin-top: 40rpx;">
+						<u-parse :content="pageData.shopIntro"></u-parse>
+					</view>
+					<view class="contact">
+						<view class="item">联系电话：{{pageData.shopMobile}}</view>
+						<view class="item">营业世间：{{pageData.shopServiceTime}}</view>
+						<view class="item">商行地址：{{pageData.shopAddress}}</view>
+					</view>
+				</view>
+				<!-- <img :src="pageData.uxImg" style="width: 100%;" alt=""> -->
+				<view class="map-wrap" @click="mapClick">
+					<map style="width: 100%; height: 340rpx;" :latitude="latitude" :longitude="longitude" :markers="covers"></map>
 				</view>
 			</view>
 		</view>
@@ -41,6 +53,10 @@
 		},
 		data() {
 			return {
+				staticUrl:this.$commonConfig.staticUrl,
+				latitude: 30.659462,
+				longitude: 104.065735,
+				covers: [], //存放标记点数组
 				navbarTitle:'',
 				typeList:['旭烁简介','商行简介'],
 				curNow:0,
@@ -68,10 +84,43 @@
 				let type = this.curNow + 1;
 				this.$u.api.xsGetIntro({type:type}).then(res=>{
 					this.pageData = res.data;
+					this.setCovers(this.latitude,this.longitude);
 					// console.log('res',res);
 				}).catch(err=>{
 					console.log('xsGetIntro',err.data);
 				})
+			},
+			//设置点位
+			setCovers(latitude, longitude) {
+				let location = {
+					id: 0,
+					latitude: Number(latitude),
+					longitude: Number(longitude),
+					width: uni.upx2px(50),
+					height: uni.upx2px(55),
+					iconPath:this.$commonConfig.staticUrl+ '/img/mapicon.png'
+					// iconPath: './../../static/location.png'
+				}
+				this.covers = [location]
+			},
+			mapClick(){
+				if(this.curNow==0){
+					uni.openLocation({
+					  latitude:this.latitude,	//维度
+					  longitude: this.longitude, //经度
+					  name: "旭烁地址",	//目的地定位名称
+					  scale: 15,	//缩放比例
+					  address: this.pageData.xsAddress	//导航详细地址
+					})
+				}else{
+					uni.openLocation({
+					  latitude:this.latitude,	//维度
+					  longitude: this.longitude, //经度
+					  name: "商行地址",	//目的地定位名称
+					  scale: 15,	//缩放比例
+					  address: this.pageData.shopAddress	//导航详细地址
+					})
+				}
 			}
 		}
 	}
@@ -110,6 +159,20 @@ page{
 		line-height: 33rpx;
 		margin: 20rpx auto 50rpx;
 	}
+	.contact{
+		margin: 30rpx 0;
+		font-size: 32rpx;
+		font-weight: 400;
+		color: #333333;
+		line-height: 50rpx;
+		.item{
+			margin-bottom: 10rpx;
+		}
+		
+	}
+}
+.map-wrap{
+	margin: 20rpx 0;
+	
 }
-
 </style>

xushuo/cooperation.vue

@@ -13,11 +13,38 @@
 			<view class="video-wrap">
 				<video 
 					id="video" 
-					src="http://dl1.gj3.wangyuan.com/downloader/20180817/zhkokrbt/gjqt3_03.mp4" 
-					poster="http://i1.gbimg.cn/zt/2018/04/20/gjqt3x2018y20m/myc36x/images/yl/img1.jpg"
+					:src="pageData.jiVideo" 
 				    controls playsinline loop>
 				</video>
 			</view>
+			<view class="u-content" style="margin-top: 20rpx;">
+				<u-parse :content="pageData.jiIntro"></u-parse>
+			</view>
+			<!-- <view class="center-img" >
+				<img :src="staticUrl+'/img/index-nav-3.png'" alt="">
+			</view> -->
+			<view class="form-wrap">
+				<view class="form">
+					<img :src="staticUrl+'/img/shopContact.png'" alt="">
+					<view class="title">
+						<text>免费咨询</text><text class="sub-title">Free consultation</text>
+					</view>
+					<u--form :model="form" 
+						labelPosition="top" 
+						labelWidth="200rpx" 
+						:labelStyle="{color:'#fff'}"
+						ref="uForm">
+						<u-form-item label="您的姓名" prop="name">
+							<u-input v-model="form.name" shape="circle" color="#fff" placeholder="请输入您的姓名" />
+						</u-form-item>
+						<u-form-item label="您的电话" prop="mobile">
+							<u-input v-model="form.mobile" shape="circle" color="#fff" placeholder="请输入您的电话" />
+						</u-form-item>
+					</u--form>
+				</view>
+				<view class="full-btn" @click="submit">提交咨询</view>
+				<view class="tip">投资有风险 加盟需谨慎</view>
+			</view>
 		</view>
 	</view>
 </template>
@@ -27,15 +54,76 @@
 		data() {
 			return {
 				staticUrl:this.$commonConfig.staticUrl,
-				
+				pageData:{},
+				form:{
+					name:'',
+					mobile:''
+				},
+				rules: {
+					name:
+					// 必填规则
+					{
+						required: true,
+						message: '请输入您的姓名',
+						// blur和change事件触发检验
+						trigger: ['blur', 'change'],
+					},
+					// 字段名称
+					mobile: [
+						{
+							required: true, 
+							message: '请输入您的电话',
+							trigger: ['change','blur'],
+						},
+						{
+							// 自定义验证函数，见上说明
+							validator: (rule, value, callback) => {
+								// 上面有说，返回true表示校验通过，返回false表示不通过
+								// uni.$u.test.mobile()就是返回true或者false的
+								return uni.$u.test.mobile(value);
+							},
+							message: '手机号码不正确',
+							// 触发器可以同时用blur和change
+							trigger: ['change','blur'],
+						}
+					]
+				}
 			}
 		},
-		onShow() {		
+		onReady() {
+			//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
+			this.$refs.uForm.setRules(this.rules)
+		},
+		onShow() {
+			this.getIntro()
 		},
 		onLoad() {
 
 		},
 		methods: {
+			getIntro(){
+				this.$u.api.xsGetIntro().then(res=>{
+					this.pageData = res.data;
+					// console.log('res',res);
+				}).catch(err=>{
+					console.log('xsGetIntro',err);
+				})
+			},
+			submit() {
+				this.$refs.uForm.validate().then(res => {
+					// uni.$u.toast('校验通过')
+					// console.log('form',this.form);
+					this.$u.api.shopContact(this.form).then(res=>{
+						uni.$u.toast(res.msg)
+						// uni.navigateBack()
+						// console.log('res',res.msg);
+					}).catch(err=>{
+						console.log('shopContact',err);
+					})
+				}).catch(errors => {
+					uni.$u.toast('请正确填写表单')
+				})
+			}
 
 		}
 	}
@@ -51,4 +139,56 @@
 		width: 100%;
 	}
 }
+.center-img{
+	text-align: center;
+	margin-bottom: 40rpx;
+}
+.form-wrap{
+	margin-top: 20rpx;
+	.form{
+		position: relative;
+		min-height: 390rpx;
+		box-sizing: border-box;
+		padding: 40rpx;
+		color: #fff;
+		margin-bottom: 40rpx;
+		img{
+			position: absolute;
+			left: 0;
+			right: 0;
+			top: 0;
+			bottom: 0;
+			width: 100%;
+			height: 100%;
+			z-index: -1;
+		}
+		.title{
+			font-size: 36rpx;
+			font-weight: 600;
+			color: rgba(255,255,255,0.99);
+			line-height: 50rpx;
+			margin-bottom: 16rpx;
+			.sub-title{
+				margin-left: 16rpx;
+				font-size: 24rpx;
+				font-weight: 400;
+				color: rgba(255,255,255,0.5);
+				line-height: 33rpx;
+				text-transform: uppercase
+			}
+		}
+	}
+	.full-btn{
+		background-color: #FFB100;
+		margin-bottom: 37rpx;
+	}
+	.tip{
+		font-size: 30rpx;
+		font-weight: 400;
+		color: rgba(51,51,51,0.99);
+		line-height: 42rpx;
+		padding-bottom: 60rpx;
+		text-align: center;
+	}
+}
 </style>

xushuo/experience.vue

@@ -8,9 +8,9 @@
 		</u-navbar>
 		<view class="page-wrap news-content">
 			<view class="title">一、体验中心介绍</view>
-			<view class="">{{xsIntro.uxIntro}}</view>
+			<view class="">{{pageData.uxIntro}}</view>
 			<view class="title">二、体验店分布</view>
-			<u--image :src="xsIntro.uxImg" :showLoading="true" width="100%" mode="aspectFill"></u--image>
+			<u--image :src="pageData.uxImg" :showLoading="true" width="100%" mode="aspectFill"></u--image>
 		</view>
 	</view>
 </template>
@@ -22,7 +22,7 @@
 		},
 		data() {
 			return {
-				xsIntro:{}
+				pageData:{}
 			}
 		},
 		watch:{
@@ -34,12 +34,12 @@
 		methods: {
 			getIntro(){
 				this.$u.api.xsGetIntro().then(res=>{
-					this.xsIntro = res.data;
-					console.log('res',res);
+					this.pageData = res.data;
+					// console.log('res',res);
 				}).catch(err=>{
-					console.log('getIntro',err.data);
+					console.log('xsGetIntro',err);
 				})
-			}
+			},
 		}
 	}
 </script>