Merge pull request '梁航：发布页信息整理' (#63) from lh into master

Reviewed-on: http://git.feashow.cn/odjbin/city-store-transfer/pulls/63

pages/publish/publishAddress/publishAddress.vue

@@ -1,46 +1,60 @@
 <template>
 	<view class="form">
 		<u-form :model="form" ref="uForm">
-				<u-form-item label="标题" label-position="top" border-bottom="true" label-width="100%">
+			<u-form-item label="标题" label-position="top" border-bottom="true" prop="title" label-width="auto">
-					<u-input v-model="form.name" placeholder="请输入标题以便吸引人的注意哦" placeholder-class="input-class" border="none"></u-input>
+				<u-input v-model="form.title" placeholder="请输入标题以便吸引人的注意哦" placeholder-class="input-class" border="none"></u-input>
-				</u-form-item>
+			</u-form-item>
-				<u-form-item label="区域" label-position="top" border-bottom="true" label-width="100%" right-icon="arrow-right">
+			<u-form-item label="区域" label-position="top" border-bottom="true" right-icon="arrow-right" prop="region" label-width="auto">
-					<text @click="show1 = true" class="checktext">请选择所属区域</text>
+				<text @click="show1 = true" class="checkedtext" v-if="form.region.length>0">{{form.region}}</text>
-					<view class="arrow-icon">
+				<text @click="show1 = true" class="checktext" v-else>请选择所属区域</text>
-						<u-icon name="arrow-right" size="30px"></u-icon>
-					</view>
-					<u-picker :columns="regionColumns" :show="show1" :closeOnClickOverlay="true" @close="show1 = false"></u-picker>
-				</u-form-item>
-				<u-form-item label="业态" label-position="top" border-bottom="true" label-width="100%">
-					<text @click="show3 = true" class="checktext">请选择行业业态</text>
-					<view class="arrow-icon">
-						<u-icon name="arrow-right" size="30px"></u-icon>
-					</view>
-					<u-picker mode="region" :show="show3" :closeOnClickOverlay="true" @close="show3 = false"></u-picker>
-				</u-form-item>
-				<u-form-item label="面积" label-position="top" border-bottom="true" label-width="100%">
-					<u-input v-model="form.name" placeholder="请输入店铺面积" placeholder-class="input-class" border="none"></u-input>
-				</u-form-item>
-				<u-form-item label="租金（元/月）" label-position="top" border-bottom="true" label-width="100%">
-					<u-input v-model="form.name" placeholder="请输入店铺租金" placeholder-class="input-class" border="none"></u-input>
-				</u-form-item>
-				<u-form-item label="预计投资" label-position="top" border-bottom="true" label-width="100%">
-					<u-input v-model="form.name" placeholder="请输入店铺转让费" placeholder-class="input-class" border="none"></u-input>
-				</u-form-item>
-				<u-form-item label="详情介绍" label-position="top" border-bottom="true" label-width="100%">
-					<u-input v-model="form.name" placeholder="请输入介绍详情" placeholder-class="input-class" border="none"></u-input>
-				</u-form-item>
-				<u-form-item label="联系人" label-position="top" border-bottom="true" label-width="100%">
-					<u-input v-model="form.name" placeholder="请输入联系人姓名" placeholder-class="input-class" border="none"></u-input>
-				</u-form-item>
-				<u-form-item label="手机号码" label-position="top" border-bottom="true" label-width="100%">
-					<u-input v-model="form.name" placeholder="请输入联系人手机号码" placeholder-class="input-class" border="none"></u-input>
-				</u-form-item>
 				
-			</u-form>
+				<view class="arrow-icon">
-			<view class="bug-figure"></view>
+					<u-icon name="arrow-right" size="30px" @click="show1 = true"></u-icon>
-			<u-button @click="submit" color="linear-gradient(to right, #E86262, #CC3333)" :size="normal" shape="circle" class="submit-btn">发布</u-button>
+				</view>
-			<view class="bug-figure"></view>
+				<u-picker :columns="regionColumns" :show="show1" :closeOnClickOverlay="true" @close="show1 = false"
+					v-model="form.region" @confirm="regionConfirm"></u-picker>
+			</u-form-item>
+			<u-form-item label="行业" label-position="top" border-bottom="true" class="picker" label-width="auto" prop="trade" >
+				<text @click="show2 = true" class="checkedtext" v-if="form.trade.length>0">{{form.trade}}</text>
+				<text @click="show2 = true" class="checktext" v-else>请选择行业</text>
+				<view class="arrow-icon">
+					<u-icon name="arrow-right" size="30px" @click="show2 = true"></u-icon>
+				</view>
+				<u-picker mode="region" :show="show2" :closeOnClickOverlay="true" @close="show2 = false" :columns="[Classcolumns]"
+					v-model="form.trade" @confirm="tradeConfirm"></u-picker>
+			</u-form-item>
+			<u-form-item label="业态" label-position="top" border-bottom="true" label-width="auto" prop="karma">
+				<text @click="show3 = true" class="checkedtext" v-if="form.karma.length>0">{{form.karma}}</text>
+				<text @click="show3 = true" class="checktext" v-else>请选择业态</text>
+				<view class="arrow-icon">
+					<u-icon name="arrow-right" size="30px" @click="show3 = true"></u-icon>
+				</view>
+				<u-picker mode="region" :show="show3" :closeOnClickOverlay="true" @close="show3 = false" :columns="[Karmacolumns]"
+					v-model="form.karma" @confirm="karmaConfirm"></u-picker>
+			</u-form-item>
+			<u-form-item label="面积" label-position="top" border-bottom="true" label-width="auto" prop="size">
+				<u-input v-model="form.size" placeholder="请输入面积" placeholder-class="input-class" border="none"></u-input>
+			</u-form-item>
+			<u-form-item label="租金（元/月）" label-position="top" border-bottom="true" label-width="auto" prop="rent">
+				<u-input v-model="form.rent" placeholder="请输入租金" placeholder-class="input-class" border="none"></u-input>
+			</u-form-item>
+			<u-form-item label="预计投资" label-position="top" border-bottom="true" label-width="auto" prop="sell">
+				<u-input v-model="form.sell" placeholder="请输入预计投资" placeholder-class="input-class" border="none"></u-input>
+			</u-form-item>
+			<u-form-item label="联系人" label-position="top" border-bottom="true" label-width="auto" prop="name">
+				<u-input v-model="form.name" placeholder="请输入联系人姓名" placeholder-class="input-class" border="none"></u-input>
+			</u-form-item>
+			<u-form-item label="手机号码" label-position="top" border-bottom="true" label-width="auto" prop="call">
+				<u-input v-model="form.call" placeholder="请输入联系人手机号码" placeholder-class="input-class" border="none"></u-input>
+			</u-form-item>
+			<u-form-item label="详情介绍" label-position="top" border-bottom="true" label-width="auto" prop="introduce">
+				<u-input v-model="form.introduce" placeholder="请输入介绍详情" placeholder-class="input-class" border="none"></u-input>
+			</u-form-item>
+		</u-form>
+		<view class="bug-figure"></view>
+		<u-button @click="submit" color="linear-gradient(to right, #E86262, #CC3333)" :size="normal" shape="circle"
+			class="submit-btn">发布</u-button>
+		<view class="bug-figure"></view>
 	</view>
 </template>
 
@@ -48,53 +62,183 @@
 	export default {
 		data() {
 			return {
-				regionColumns:[JSON.parse(uni.getStorageSync('regionList'))]||[],
+				regionColumns: [JSON.parse(uni.getStorageSync('regionList'))] || [],
-				ShopInfomation:{
+				ShopInfomation: {
-				city:'',
+					city: '',
-				area:'',
+					area: '',
-				count:0,
+					count: 0,
 
 				},
 
-				form:{
+				form: {
-					title:''
+					title: '',
+					region: '',
+					place: '',
+					trade: '',
+					karma: '',
+					size: '',
+					rent: '',
+					sell: '',
+					name: '',
+					call: '',
+					introduce: ''
+				},
+				Classcolumns: [],
+				ClassCheckId:'',
+				Karmacolumns: [],
+				pid:[],
+				show1: false,
+				show2: false,
+				show3: false,
+				rules: {
+					'title': [{
+						required: true,
+						message: '请输入标题',
+						trigger: ['change', 'blur']
+					}],
+					'trade': [{
+						required: true,
+						message: '请选择行业',
+						trigger: ['change', 'blur']
+					}],
+					'region': [{
+						required: true,
+						message: '请选择地区',
+						trigger: ['change', 'blur']
+					}],
+					'karma': [{
+						required: true,
+						message: '请选择业态',
+						trigger: ['change', 'blur']
+					}],
+					'name': [{
+						required: true,
+						message: '请输入姓名',
+						trigger: ['change', 'blur']
+					}],
+					'sell': [{
+						required: true,
+						message: '请输入转让金',
+						trigger: ['change', 'blur']
+					}],
+					'introduce': [{
+						required: true,
+						message: '请输入介绍',
+						trigger: ['change', 'blur']
+					}],
+					'size': [{
+						required: true,
+						message: '请输入面积',
+						trigger: ['change', 'blur']
+					}],
+					'rent': [{
+						required: true,
+						message: '请输入租金',
+						trigger: ['change', 'blur']
+					}],
+					'place': [{
+						required: true,
+						message: '请输入地址',
+						trigger: ['change', 'blur']
+					}],
+					'call':[{
+						required: true,
+						message: '请输入电话号码',
+					},
+					{
+						validator: (rule, value, callback) => {
+							if(value) {
+								return this.$u.test.mobile(value);
+							} else {
+								return true
+							}
+						},
+						message: '号码不正确',
+						trigger: ['change','blur'],
+					}]
+
 				},
-				columns:[
-				],
-				show1:false,
-				show2:false,
-				show3:false,
 			}
-			
 		},
 		methods: {
-			confirmArea(e) {
+			handleSearchAddress() {
-			                this.ShopInfomation.city = e.value[0]
+				uni.navigateTo({
-							this.ShopInfomation.area = e.value[1]
+					url: '/pages/publish/chooseAddress/chooseAddress'
-			                this.show1 = false
+				})
-						},
+			},
-			submit(){
+			submit() {
-				console.log('提交');
+				this.$refs.uForm.validate().then(res => {
+					console.log("提交表单信息:" + JSON.stringify(this.form))
+					uni.$u.toast('发布成功')
+					// 调用服务端入表接口W
+				}).catch(errors => {
+					console.log("失败信息:" + JSON.stringify(errors))
+					// uni.$u.toast('校验失败')
+				})
+			},
+			tradeConfirm(e){
+				this.show2 = false
+				this.form.trade = e.value[0]
+				this.ClassCheckId = this.pid[e.indexs[0]]
+				this.$api.getClassList(this.ClassCheckId).then(res => {
+					// console.log(res);
+					this.Karmacolumns = res.data.data.map((item) => {
+					return item = item.name
+				})
+				})
+			},
+			karmaConfirm(e){
+				this.show3 = false
+				this.form.karma = e.value[0]
+			},
+			regionConfirm(e){
+				this.show1 = false
+				this.form.region = e.value[0]
+			},
+		},
+		onReady() {
+			this.$refs.uForm.setRules(this.rules)
+			
+		},
+		onLoad() {
+			this.$api.getClassList().then(res =>{
+				// console.log(res.data.data.length);
+				this.Classcolumns = res.data.data.map((item) => {
+					return item = item.name
+				})
+				this.pid = res.data.data.map((item) => {
+					return item = item.id
+				})
+				
+			})
+		},
+		computed:{
+			isChecked(index){
+				if(index.length > 0)
+				return true;
+				else
+				return false;
 			}
 		}
 	}
 </script>
 
 <style lang="scss">
-	.count{
+	.count {}
 
-	}
+	.form {
-	.form{
 		margin-left: 20px;
 		margin-right: 20px;
 	}
-	.input-class{
+
+	.input-class {
 		font-size: 30rpx;
-		font-weight:1px;
+		font-weight: 1px;
 		border-style: none;
 
 	}
-	.upload{
+
+	.upload {
 		display: flex;
 		flex-direction: column;
 		justify-content: center;
@@ -103,28 +247,38 @@
 		height: 300rpx;
 		// margin-right: 20px;
 	}
-	.submit-btn{
+
+	.submit-btn {
 		width: 80%;
 	}
-	.bug-figure{
+
+	.bug-figure {
 		height: 100rpx;
 	}
-	.checkbox1{
+
+	.checkbox1 {
 		display: flex;
 		justify-content: space-between;
 	}
-	.checktext{
-		margin-top: 5rpx;
-		font-size: 30rpx;
-		font-weight:1px;
-		color: #c1c4c7;
-	}
 
-	.picker{
+	.checktext {
+		margin-top: 5rpx;
+		font-size: 30rpx;
+		font-weight: 1px;
+		color: #c1c4c7;
+	}
+	.checkedtext{
+		margin-top: 5rpx;
+		font-size: 28rpx;
+		font-weight: 1px;
+		border-style: none;
+	}
+	.picker {
 		display: flex;
 		justify-content: space-between;
 	}
-	.arrow-icon{
+
+	.arrow-icon {
 		position: absolute;
 		right: 10rpx;
 		transform: translateY(-20rpx);

pages/publish/publishInvestment/publishInvestment.vue

@@ -3,50 +3,57 @@
 		<u-form :model="form" ref="uForm">
 			<view class="upload">
 				<u-upload max-count="5" upload-icon="photo"></u-upload>
-				<text class="count">发布项目图片({{ShopInfomation.count}}/5)</text>
+				<text class="count">发布房源图片({{ShopInfomation.count}}/5)</text>
 			</view>
+			<u-form-item label="标题" label-position="top" border-bottom="true" prop="title" label-width="auto">
+				<u-input v-model="form.title" placeholder="请输入标题以便吸引人的注意哦" placeholder-class="input-class" border="none"></u-input>
+			</u-form-item>
+			<u-form-item label="地址" label-position="top" border-bottom="true" prop="place" label-width="auto">
+				<u-input v-model="form.place" placeholder="请输入店铺地址" placeholder-class="input-class" border="none"
+					@change="changeAddress"></u-input>
+			</u-form-item>
+			<u-form-item label="区域" label-position="top" border-bottom="true" right-icon="arrow-right" prop="region" label-width="auto">
+				<text @click="show1 = true" class="checkedtext" v-if="form.region.length>0">{{form.region}}</text>
+				<text @click="show1 = true" class="checktext" v-else>请选择所属区域</text>
 				
-				<u-form-item label="项目标题" label-position="top" border-bottom="true" label-width="100%">
+				<view class="arrow-icon">
-					<u-input v-model="form.name" placeholder="请输入标题以便吸引人的注意哦" placeholder-class="input-class" border="none"></u-input>
+					<u-icon name="arrow-right" size="30px" @click="show1 = true"></u-icon>
-				</u-form-item>
+				</view>
-				<u-form-item label="区域" label-position="top" border-bottom="true" label-width="100%" right-icon="arrow-right">
+				<u-picker :columns="regionColumns" :show="show1" :closeOnClickOverlay="true" @close="show1 = false"
-					<text @click="show1 = true" class="checktext">请选择所属区域</text>
+					v-model="form.region" @confirm="regionConfirm"></u-picker>
-					<view class="arrow-icon">
+			</u-form-item>
-						<u-icon name="arrow-right" size="30px"></u-icon>
+			<u-form-item label="行业" label-position="top" border-bottom="true" class="picker" label-width="auto" prop="trade" >
-					</view>
+				<text @click="show2 = true" class="checkedtext" v-if="form.trade.length>0">{{form.trade}}</text>
-					<u-picker :columns="regionColumns" :show="show1" :closeOnClickOverlay="true" @close="show1 = false"></u-picker>
+				<text @click="show2 = true" class="checktext" v-else>请选择行业</text>
-				</u-form-item>
+				<view class="arrow-icon">
-				<u-form-item label="项目地址" label-position="top" border-bottom="true" label-width="100%">
+					<u-icon name="arrow-right" size="30px" @click="show2 = true"></u-icon>
-					<u-input v-model="form.name" placeholder="请输入店铺地址" placeholder-class="input-class" border="none"></u-input>
+				</view>
-				</u-form-item>
+				<u-picker mode="region" :show="show2" :closeOnClickOverlay="true" @close="show2 = false" :columns="[Classcolumns]"
-				<u-form-item label="行业" label-position="top" border-bottom="true" label-width="100%" class="picker">
+					v-model="form.trade" @confirm="tradeConfirm"></u-picker>
-					<text @click="show2 = true" class="checktext">请选择行业类型</text>
+			</u-form-item>
-					<view class="arrow-icon">
+			<u-form-item label="业态" label-position="top" border-bottom="true" label-width="auto" prop="karma">
-						<u-icon name="arrow-right" size="30px"></u-icon>
+				<text @click="show3 = true" class="checkedtext" v-if="form.karma.length>0">{{form.karma}}</text>
-					</view>
+				<text @click="show3 = true" class="checktext" v-else>请选择业态</text>
-					<u-picker mode="region" :show="show2" :closeOnClickOverlay="true" @close="show2 = false"></u-picker>
+				<view class="arrow-icon">
-				</u-form-item>
+					<u-icon name="arrow-right" size="30px" @click="show3 = true"></u-icon>
-				<u-form-item label="业态" label-position="top" border-bottom="true" label-width="100%">
+				</view>
-					<text @click="show3 = true" class="checktext">请选择行业业态</text>
+				<u-picker mode="region" :show="show3" :closeOnClickOverlay="true" @close="show3 = false" :columns="[Karmacolumns]"
-					<view class="arrow-icon">
+					v-model="form.karma" @confirm="karmaConfirm"></u-picker>
-						<u-icon name="arrow-right" size="30px"></u-icon>
+			</u-form-item>
-					</view>
+			<u-form-item label="联系人" label-position="top" border-bottom="true" label-width="auto" prop="name">
-					<u-picker mode="region" :show="show3" :closeOnClickOverlay="true" @close="show3 = false"></u-picker>
+				<u-input v-model="form.name" placeholder="请输入联系人姓名" placeholder-class="input-class" border="none"></u-input>
-				</u-form-item>
+			</u-form-item>
-				<u-form-item label="详情介绍" label-position="top" border-bottom="true" label-width="100%">
+			<u-form-item label="手机号码" label-position="top" border-bottom="true" label-width="auto" prop="call">
-					<u-input v-model="form.name" placeholder="请输入介绍详情" placeholder-class="input-class" border="none"></u-input>
+				<u-input v-model="form.call" placeholder="请输入联系人手机号码" placeholder-class="input-class" border="none"></u-input>
-				</u-form-item>
+			</u-form-item>
-				<u-form-item label="联系人" label-position="top" border-bottom="true" label-width="100%">
+			<u-form-item label="详情介绍" label-position="top" border-bottom="true" label-width="auto" prop="introduce">
-					<u-input v-model="form.name" placeholder="请输入联系人姓名" placeholder-class="input-class" border="none"></u-input>
+				<u-input v-model="form.introduce" placeholder="请输入介绍详情" placeholder-class="input-class" border="none"></u-input>
-				</u-form-item>
+			</u-form-item>
-				<u-form-item label="手机号码" label-position="top" border-bottom="true" label-width="100%">
+		</u-form>
-					<u-input v-model="form.name" placeholder="请输入联系人手机号码" placeholder-class="input-class" border="none"></u-input>
+		<view class="bug-figure"></view>
-				</u-form-item>
+		<u-button @click="submit" color="linear-gradient(to right, #E86262, #CC3333)" :size="normal" shape="circle"
-				
+			class="submit-btn">发布</u-button>
-			</u-form>
+		<view class="bug-figure"></view>
-			<view class="bug-figure"></view>
-			<u-button @click="submit" color="linear-gradient(to right, #E86262, #CC3333)" :size="normal" shape="circle" class="submit-btn">发布</u-button>
-			<view class="bug-figure"></view>
 	</view>
 </template>
 
@@ -54,53 +61,202 @@
 	export default {
 		data() {
 			return {
-				regionColumns:[JSON.parse(uni.getStorageSync('regionList'))]||[],
+				regionColumns: [JSON.parse(uni.getStorageSync('regionList'))] || [],
-				ShopInfomation:{
+				ShopInfomation: {
-				city:'',
+					city: '',
-				area:'',
+					area: '',
-				count:0,
+					count: 0,
 
 				},
 
-				form:{
+				form: {
-					title:''
+					title: '',
+					region: '',
+					place: '',
+					trade: '',
+					karma: '',
+					size: '',
+					rent: '',
+					sell: '',
+					name: '',
+					call: '',
+					introduce: ''
+				},
+				Classcolumns: [],
+				ClassCheckId:'',
+				Karmacolumns: [],
+				pid:[],
+				show1: false,
+				show2: false,
+				show3: false,
+				rules: {
+					'title': [{
+						required: true,
+						message: '请输入标题',
+						trigger: ['change', 'blur']
+					}],
+					'trade': [{
+						required: true,
+						message: '请选择行业',
+						trigger: ['change', 'blur']
+					}],
+					'region': [{
+						required: true,
+						message: '请选择地区',
+						trigger: ['change', 'blur']
+					}],
+					'karma': [{
+						required: true,
+						message: '请选择业态',
+						trigger: ['change', 'blur']
+					}],
+					'name': [{
+						required: true,
+						message: '请输入姓名',
+						trigger: ['change', 'blur']
+					}],
+					'sell': [{
+						required: true,
+						message: '请输入转让金',
+						trigger: ['change', 'blur']
+					}],
+					'introduce': [{
+						required: true,
+						message: '请输入介绍',
+						trigger: ['change', 'blur']
+					}],
+					'size': [{
+						required: true,
+						message: '请输入面积',
+						trigger: ['change', 'blur']
+					}],
+					'rent': [{
+						required: true,
+						message: '请输入租金',
+						trigger: ['change', 'blur']
+					}],
+					'place': [{
+						required: true,
+						message: '请输入地址',
+						trigger: ['change', 'blur']
+					}],
+					'call':[{
+						required: true,
+						message: '请输入电话号码',
+					},
+					{
+						validator: (rule, value, callback) => {
+							if(value) {
+								return this.$u.test.mobile(value);
+							} else {
+								return true
+							}
+						},
+						message: '号码不正确',
+						trigger: ['change','blur'],
+					}]
+
 				},
-				columns:[
-				],
-				show1:false,
-				show2:false,
-				show3:false,
 			}
-			
 		},
 		methods: {
-			confirmArea(e) {
+			handleSearchAddress() {
-			                this.ShopInfomation.city = e.value[0]
+				uni.navigateTo({
-							this.ShopInfomation.area = e.value[1]
+					url: '/pages/publish/chooseAddress/chooseAddress'
-			                this.show1 = false
+				})
-						},
+			},
-			submit(){
+			changeAddress(e) {
-				console.log('提交');
+				// console.log('changeAddress', e);
+				this.getAddressList(e)
+			},
+			getAddressList(value) {
+				var that = this
+				uni.request({
+					url: 'https://apis.map.qq.com/ws/geocoder/v1/?address=' + value + '&key=' +
+						that.$api.key,
+					success(res) {
+						console.log('diz', res.data.result.location);
+						console.log('lat', res.data.result.location.lat);
+						console.log('lng', res.data.result.location.lng);
+					},
+					fail(err) {
+						console.log('请求区域失败：', err);
+					}
+				})
+			},
+			submit() {
+				this.$refs.uForm.validate().then(res => {
+					console.log("提交表单信息:" + JSON.stringify(this.form))
+					uni.$u.toast('发布成功')
+					// 调用服务端入表接口W
+				}).catch(errors => {
+					console.log("失败信息:" + JSON.stringify(errors))
+					// uni.$u.toast('校验失败')
+				})
+			},
+			tradeConfirm(e){
+				this.show2 = false
+				this.form.trade = e.value[0]
+				this.ClassCheckId = this.pid[e.indexs[0]]
+				this.$api.getClassList(this.ClassCheckId).then(res => {
+					// console.log(res);
+					this.Karmacolumns = res.data.data.map((item) => {
+					return item = item.name
+				})
+				})
+			},
+			karmaConfirm(e){
+				this.show3 = false
+				this.form.karma = e.value[0]
+			},
+			regionConfirm(e){
+				this.show1 = false
+				this.form.region = e.value[0]
+			},
+		},
+		onReady() {
+			this.$refs.uForm.setRules(this.rules)
+			
+		},
+		onLoad() {
+			this.$api.getClassList().then(res =>{
+				// console.log(res.data.data.length);
+				this.Classcolumns = res.data.data.map((item) => {
+					return item = item.name
+				})
+				this.pid = res.data.data.map((item) => {
+					return item = item.id
+				})
+				
+			})
+		},
+		computed:{
+			isChecked(index){
+				if(index.length > 0)
+				return true;
+				else
+				return false;
 			}
 		}
 	}
 </script>
 
 <style lang="scss">
-	.count{
+	.count {}
 
-	}
+	.form {
-	.form{
 		margin-left: 20px;
 		margin-right: 20px;
 	}
-	.input-class{
+
+	.input-class {
 		font-size: 30rpx;
-		font-weight:1px;
+		font-weight: 1px;
 		border-style: none;
 
 	}
-	.upload{
+
+	.upload {
 		display: flex;
 		flex-direction: column;
 		justify-content: center;
@@ -109,28 +265,38 @@
 		height: 300rpx;
 		// margin-right: 20px;
 	}
-	.submit-btn{
+
+	.submit-btn {
 		width: 80%;
 	}
-	.bug-figure{
+
+	.bug-figure {
 		height: 100rpx;
 	}
-	.checkbox1{
+
+	.checkbox1 {
 		display: flex;
 		justify-content: space-between;
 	}
-	.checktext{
-		margin-top: 5rpx;
-		font-size: 30rpx;
-		font-weight:1px;
-		color: #c1c4c7;
-	}
 
-	.picker{
+	.checktext {
+		margin-top: 5rpx;
+		font-size: 30rpx;
+		font-weight: 1px;
+		color: #c1c4c7;
+	}
+	.checkedtext{
+		margin-top: 5rpx;
+		font-size: 28rpx;
+		font-weight: 1px;
+		border-style: none;
+	}
+	.picker {
 		display: flex;
 		justify-content: space-between;
 	}
-	.arrow-icon{
+
+	.arrow-icon {
 		position: absolute;
 		right: 10rpx;
 		transform: translateY(-20rpx);

pages/publish/publishRent/publishRent.vue

@@ -6,40 +6,45 @@
 				<text class="count">发布店铺图片({{ShopInfomation.count}}/5)</text>
 			</view>
 				
-				<u-form-item label="标题" label-position="top" border-bottom="true" >
+				<u-form-item label="标题" label-position="top" border-bottom="true" prop="title" label-width="auto">
-					<u-input v-model="form.name" placeholder="请输入标题以便吸引人的注意哦" placeholder-class="input-class" border="none"></u-input>
+					<u-input v-model="form.title" placeholder="请输入标题以便吸引人的注意哦" placeholder-class="input-class" border="none"></u-input>
 				</u-form-item>
-				<u-form-item label="区域" label-position="top" border-bottom="true"  right-icon="arrow-right">
+				<u-form-item label="区域" label-position="top" border-bottom="true"  right-icon="arrow-right" prop="region" label-width="auto">
-					<text @click="show1 = true" class="checktext">请选择所属区域</text>
+					<text @click="show1 = true" class="checkedtext" v-if="form.region.length>0">{{form.region}}</text>
+					<text @click="show1 = true" class="checktext" v-else>请选择所属区域</text>
+					
 					<view class="arrow-icon">
-						<u-icon name="arrow-right" size="30px"></u-icon>
+						<u-icon name="arrow-right" size="30px" @click="show1 = true"></u-icon>
 					</view>
-					<u-picker :columns="regionColumns" :show="show1" :closeOnClickOverlay="true" @close="show1 = false"></u-picker>
+					<u-picker :columns="regionColumns" :show="show1" :closeOnClickOverlay="true" @close="show1 = false"
+						v-model="form.region" @confirm="regionConfirm"></u-picker>
 				</u-form-item>
-				<u-form-item label="地址" label-position="top" border-bottom="true" >
+				<u-form-item label="地址" label-position="top" border-bottom="true"  prop="place" label-width="auto">
-					<u-input v-model="form.name" placeholder="请输入店铺地址" placeholder-class="input-class" border="none"></u-input>
+					<u-input v-model="form.place" placeholder="请输入店铺地址" placeholder-class="input-class" border="none"></u-input>
 				</u-form-item>
-				<u-form-item label="适合行业" label-position="top" border-bottom="true"  class="picker" label-width="100%">
+				<u-form-item label="适合行业" label-position="top" border-bottom="true"  class="picker" label-width="auto" prop="trade" >
-					<text @click="show2 = true" class="checktext">请选择行业类型</text>
+					<text @click="show2 = true" class="checkedtext" v-if="form.trade.length>0">{{form.trade}}</text>
+					<text @click="show2 = true" class="checktext" v-else>请选择店铺行业</text>
 					<view class="arrow-icon">
-						<u-icon name="arrow-right" size="30px"></u-icon>
+						<u-icon name="arrow-right" size="30px" @click="show2 = true"></u-icon>
 					</view>
-					<u-picker mode="region" :show="show2" :closeOnClickOverlay="true" @close="show2 = false"></u-picker>
+					<u-picker mode="region" :show="show2" :closeOnClickOverlay="true" @close="show2 = false" :columns="[Classcolumns]"
+						v-model="form.trade" @confirm="tradeConfirm"></u-picker>
 				</u-form-item>
-				<u-form-item label="面积" label-position="top" border-bottom="true" >
+				<u-form-item label="面积" label-position="top" border-bottom="true"  label-width="auto" prop="size">
-					<u-input v-model="form.name" placeholder="请输入店铺面积" placeholder-class="input-class" border="none"></u-input>
+					<u-input v-model="form.size" placeholder="请输入店铺面积" placeholder-class="input-class" border="none"></u-input>
 				</u-form-item>
-				<u-form-item label="租金（元/月）" label-position="top" border-bottom="true" label-width="100%">
+				<u-form-item label="租金（元/月）" label-position="top" border-bottom="true" label-width="auto" prop="rent">
-					<u-input v-model="form.name" placeholder="请输入店铺租金" placeholder-class="input-class" border="none"></u-input>
+					<u-input v-model="form.rent" placeholder="请输入店铺租金" placeholder-class="input-class" border="none"></u-input>
 				</u-form-item>
-				<u-form-item label="详情" label-position="top" border-bottom="true" >
+				<u-form-item label="详情" label-position="top" border-bottom="true" label-width="auto" prop="introduce">
-					<u-input v-model="form.name" placeholder="请输入店铺转让费" placeholder-class="input-class" border="none"></u-input>
+					<u-input v-model="form.introduce" placeholder="请输入详情" placeholder-class="input-class" border="none"></u-input>
 				</u-form-item>
-				<u-form-item label="联系人" label-position="top" border-bottom="true" label-width="100%">
+				<u-form-item label="联系人" label-position="top" border-bottom="true" label-width="auto" prop="name">
 					<u-input v-model="form.name" placeholder="请输入联系人姓名" placeholder-class="input-class" border="none"></u-input>
 				</u-form-item>
-				<u-form-item label="手机号码" label-position="top" border-bottom="true" label-width="100%">
+				<u-form-item label="手机号码" label-position="top" border-bottom="true" label-width="auto" prop="call">
-					<u-input v-model="form.name" placeholder="请输入联系人手机号码" placeholder-class="input-class" border="none"></u-input>
+					<u-input v-model="form.call" placeholder="请输入联系人手机号码" placeholder-class="input-class" border="none"></u-input>
 				</u-form-item>
 			</u-form>
 			<view class="bug-figure"></view>
@@ -60,14 +65,79 @@
 				
 				},
 				
-				form:{
+				form: {
-					title:''
+					title: '',
+					region: '',
+					place: '',
+					trade: '',
+					size: '',
+					rent: '',
+					name: '',
+					call: '',
+					introduce: ''
 				},
-				columns:[
+				Classcolumns:[],
-				],
 				show1:false,
 				show2:false,
 				show3:false,
+				rules: {
+					'title': [{
+						required: true,
+						message: '请输入标题',
+						trigger: ['change', 'blur']
+					}],
+					'trade': [{
+						required: true,
+						message: '请选择行业',
+						trigger: ['change', 'blur']
+					}],
+					'region': [{
+						required: true,
+						message: '请选择地区',
+						trigger: ['change', 'blur']
+					}],
+					'name': [{
+						required: true,
+						message: '请输入姓名',
+						trigger: ['change', 'blur']
+					}],
+					'introduce': [{
+						required: true,
+						message: '请输入介绍',
+						trigger: ['change', 'blur']
+					}],
+					'size': [{
+						required: true,
+						message: '请输入面积',
+						trigger: ['change', 'blur']
+					}],
+					'rent': [{
+						required: true,
+						message: '请输入租金',
+						trigger: ['change', 'blur']
+					}],
+					'place': [{
+						required: true,
+						message: '请输入地址',
+						trigger: ['change', 'blur']
+					}],
+					'call':[{
+						required: true,
+						message: '请输入电话号码',
+					},
+					{
+						validator: (rule, value, callback) => {
+							if(value) {
+								return this.$u.test.mobile(value);
+							} else {
+								return true
+							}
+						},
+						message: '号码不正确',
+						trigger: ['change','blur'],
+					}]
+				
+				},
 			}
 			
 		},
@@ -77,10 +147,37 @@
 							this.ShopInfomation.area = e.value[1]
 			                this.show1 = false
 						},
-			submit(){
+			submit() {
-				console.log('提交');
+				this.$refs.uForm.validate().then(res => {
+					console.log("提交表单信息:" + JSON.stringify(this.form))
+					uni.$u.toast('发布成功')
+					// 调用服务端入表接口W
+				}).catch(errors => {
+					console.log("失败信息:" + JSON.stringify(errors))
+					// uni.$u.toast('校验失败')
+				})
+			},
+			tradeConfirm(e){
+				this.show2 = false
+				this.form.trade = e.value[0]
+			},
+			regionConfirm(e){
+				this.show1 = false
+				this.form.region = e.value[0]
 			}
-		}
+		},
+		onLoad() {
+			this.$api.getClassList().then(res =>{
+				// console.log(res.data.data.length);
+				this.Classcolumns = res.data.data.map((item) => {
+					return item = item.name
+				})
+			})
+		},
+		onReady() {
+			this.$refs.uForm.setRules(this.rules)
+			
+		},
 	}
 </script>
 
@@ -123,7 +220,12 @@
 		font-weight:1px;
 		color: #c1c4c7;
 	}
-		
+	.checkedtext{
+		margin-top: 5rpx;
+		font-size: 28rpx;
+		font-weight: 1px;
+		border-style: none;
+	}
 	.picker{
 		display: flex;
 		justify-content: space-between;

pages/publish/publishTransfer/publishTransfer.vue

@@ -10,19 +10,22 @@
 				<u-input v-model="form.title" placeholder="请输入标题以便吸引人的注意哦" placeholder-class="input-class" border="none"></u-input>
 			</u-form-item>
 			<u-form-item label="区域" label-position="top" border-bottom="true" right-icon="arrow-right" prop="region" label-width="auto">
-				<text @click="show1 = true" class="checktext">请选择所属区域</text>
+				<text @click="show1 = true" class="checkedtext" v-if="form.region.length>0">{{form.region}}</text>
+				<text @click="show1 = true" class="checktext" v-else>请选择所属区域</text>
+				
 				<view class="arrow-icon">
 					<u-icon name="arrow-right" size="30px" @click="show1 = true"></u-icon>
 				</view>
 				<u-picker :columns="regionColumns" :show="show1" :closeOnClickOverlay="true" @close="show1 = false"
-					v-model="form.region"></u-picker>
+					v-model="form.region" @confirm="regionConfirm"></u-picker>
 			</u-form-item>
 			<u-form-item label="地址" label-position="top" border-bottom="true" prop="place" label-width="auto">
 				<u-input v-model="form.place" placeholder="请输入店铺地址" placeholder-class="input-class" border="none"
 					@change="changeAddress"></u-input>
 			</u-form-item>
 			<u-form-item label="行业" label-position="top" border-bottom="true" class="picker" label-width="auto" prop="trade" >
-				<text @click="show2 = true" class="checktext">{{form.trade}}</text>
+				<text @click="show2 = true" class="checkedtext" v-if="form.trade.length>0">{{form.trade}}</text>
+				<text @click="show2 = true" class="checktext" v-else>请选择店铺行业</text>
 				<view class="arrow-icon">
 					<u-icon name="arrow-right" size="30px" @click="show2 = true"></u-icon>
 				</view>
@@ -30,7 +33,8 @@
 					v-model="form.trade" @confirm="tradeConfirm"></u-picker>
 			</u-form-item>
 			<u-form-item label="业态" label-position="top" border-bottom="true" label-width="auto" prop="karma">
-				<text @click="show3 = true" class="checktext">{{form.karma}}</text>
+				<text @click="show3 = true" class="checkedtext" v-if="form.karma.length>0">{{form.karma}}</text>
+				<text @click="show3 = true" class="checktext" v-else>请选择店铺业态</text>
 				<view class="arrow-icon">
 					<u-icon name="arrow-right" size="30px" @click="show3 = true"></u-icon>
 				</view>
@@ -67,7 +71,7 @@
 	export default {
 		data() {
 			return {
-				// regionColumns: [JSON.parse(uni.getStorageSync('regionList'))] || [],
+				regionColumns: [JSON.parse(uni.getStorageSync('regionList'))] || [],
 				ShopInfomation: {
 					city: '',
 					area: '',
@@ -79,8 +83,8 @@
 					title: '',
 					region: '',
 					place: '',
-					trade: '请选择行业',
+					trade: '',
-					karma: '请选择业态',
+					karma: '',
 					size: '',
 					rent: '',
 					sell: '',
@@ -214,7 +218,11 @@
 			karmaConfirm(e){
 				this.show3 = false
 				this.form.karma = e.value[0]
-			}
+			},
+			regionConfirm(e){
+				this.show1 = false
+				this.form.region = e.value[0]
+			},
 		},
 		onReady() {
 			this.$refs.uForm.setRules(this.rules)
@@ -231,6 +239,14 @@
 				})
 				
 			})
+		},
+		computed:{
+			isChecked(index){
+				if(index.length > 0)
+				return true;
+				else
+				return false;
+			}
 		}
 	}
 </script>
@@ -279,7 +295,12 @@
 		font-weight: 1px;
 		color: #c1c4c7;
 	}
-
+	.checkedtext{
+		margin-top: 5rpx;
+		font-size: 28rpx;
+		font-weight: 1px;
+		border-style: none;
+	}
 	.picker {
 		display: flex;
 		justify-content: space-between;