CommunityApp/pages/services/demand/publish.vue

<template>
	<view>
		<view class="card" >
			<view class="form">
				<view >标题</view>
				<input  placeholder="请输入标题" ></input>
			</view>
			<view class="form">
				<view >联系人</view>
				<input placeholder="请输入联系人姓名" ></input>
			</view>
			<view class="form">
				<view class="title">联系电话</view>
				<input placeholder="电话/微信 可选其一" ></input>
			</view>
			<view class="form">
				<view >联系微信</view>
				<input placeholder="电话/微信 可选其一" ></input>
			</view>
			<view class="form">
				<view >大概价格</view>
				<input placeholder="例如:面议,100~200元" ></input>
			</view>
			<view class="form">
				<view >小区</view>
				<input placeholder="点击选择小区" ></input>
			</view>
		</view>
		
		<view class="card">
			<view class="form" style="height: 200rpx;">
				<textarea maxlength="-1"  placeholder="详细描述你的需求"></textarea>
			</view>
		</view>
		<view class="card">
			<view class="text-center padding-20">
				<text>请提供取件短信截图</text>
			</view>
			<view style="margin-bottom: 20rpx;">
				<u-upload :action="action" :file-list="fileList" ></u-upload>
			</view>
		</view>
		
		<view class="read">
			<u-checkbox v-model="isCheck" active-color="blue">
				<text>我已阅读并同意</text>
				<text class="text-red-btn">《小区需求发布免责协议》</text>
			</u-checkbox>
		</view>
		
		<view class="" style="height: 160rpx;">
			
		</view>
		
		<view  class=" footer-fixed" >
			<view class="cu-btn  flex  text-lg bg-red-btn" style="padding: 46rpx 0;">
				确认下单
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isCheck:false,
				//上传
				action: 'http://www.example.com/upload',
				fileList: [],
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
	.card{
		width: 700rpx;
		margin:20rpx auto 0rpx auto;
		box-sizing: border-box;
		border-radius: 12rpx;
		border-bottom: 1rpx solid #b6b6b6;
		background-color: #FFFFFF;
	}
 	.card:first-child{
		margin-top: 30rpx;
	}
	.card .form{
		padding: 30rpx;
		display: flex;
		border-bottom: 1rpx solid #e4e4e4;
		view{
			flex-basis: 30%;
		}
		input{
			flex-basis: 70%;
		}
	}
	
	.read{
		width: 700rpx;
		margin:30rpx auto 0rpx auto;
	}
</style>