miniapp/pages/handlecase/component/newlyAddedCase.vue

<template>
	<view class="conent">
		<view class="assignrbitrators">
			<uni-forms ref="form" :modelValue="formData" :rules="rules">
				<uni-section title="案件信息" type="line" padding></uni-section>
				<uni-forms-item label="申请人调解请求:" name="arbitratClaims" label-width="120px" required>
					<uni-easyinput  v-model="formData.arbitratClaims" type="textarea" placeholder="请输入申请人调解请求" />
				</uni-forms-item>
				<uni-forms-item label="事实和理由:" name="facts" label-width="120px" required>
					<uni-easyinput v-model="formData.facts" type="textarea" placeholder="请输入事实和理由" />
				</uni-forms-item>
				<uni-forms-item label="案件标的:" name="caseSubjectAmount" label-width="120px" required>
					<uni-easyinput v-model="formData.caseSubjectAmount" type="text" placeholder="请输入案件标的" />
				</uni-forms-item>
				<uni-forms-item label="调解模板:" label-width="120px" required>
					<uni-data-select></uni-data-select>
				</uni-forms-item>
				<uni-forms-item label="申请人案件证据资料上传:" name="headImage" label-width="120px">
							<uni-file-picker ref="files" :auto-upload="false" @select="select" :limit='1' />
				</uni-forms-item>
				<uni-section title="双方信息" type="line" padding></uni-section>
				<uni-forms-item label="选择机构或自然人" label-width="120px" name="objectiJuris">
					<uni-data-checkbox class='checkbox' 
						:localdata="objectiJurisArr"
						v-model="formData.affiliate.organizeFlag"
						@change='clearValidate'></uni-data-checkbox>
				</uni-forms-item>
				<uni-forms-item label="申请人:"  label-width="120px" required v-if="formData.affiliate.organizeFlag==0">
					<uni-easyinput type="text" placeholder="请输入申请人名称" />
				</uni-forms-item>
				<uni-forms-item label="申请人机构名称:" label-width="120px" required 
				v-if="formData.affiliate.organizeFlag==1"
				>
					<uni-easyinput type="text" placeholder="请输入申请人机构名称" />
				</uni-forms-item>
				<uni-forms-item label="申请人身份证号码:" label-width="120px" required 
				v-if="formData.affiliate.organizeFlag==0"
				>
					<uni-easyinput type="text" placeholder="请输入申请人身份证号码" />
				</uni-forms-item>
				<uni-forms-item label="统一社会信用代码:" label-width="120px" required
				v-if="formData.affiliate.organizeFlag==1"
				>
					<uni-easyinput type="text" placeholder="请输入统一社会信用代码:" />
				</uni-forms-item>
				<uni-forms-item label="申请人邮箱:" label-width="120px" required>
					<uni-easyinput type="text" placeholder="请输入申请人邮箱" />
				</uni-forms-item>
				<uni-forms-item label="申请人电话:" label-width="120px" required>
					<uni-easyinput type="text" placeholder="请输入申请人电话" />
				</uni-forms-item>
				<uni-forms-item label="法定代表人:" label-width="120px" required>
					<uni-easyinput type="text" placeholder="请输入法定代表人" />
				</uni-forms-item>
				<uni-forms-item label="申请人住所:" label-width="120px" required>
					<uni-easyinput type="text" placeholder="请输入申请人住所" />
				</uni-forms-item>
				<uni-forms-item label="申请人联系地址:" label-width="120px" required>
					<uni-easyinput type="text" placeholder="请输入申请人联系地址" />
				</uni-forms-item>
				<uni-forms-item label="代理人联系电话:" label-width="120px" v-if="formData.affiliate.organizeFlag==0">
					<uni-easyinput type="text" placeholder="请输入代理人联系电话" />
				</uni-forms-item>
				<uni-forms-item label="代理人联系电话:" label-width="120px" required 
				v-if="formData.affiliate.organizeFlag==1"
				>
					<uni-easyinput type="text" placeholder="请输入代理人联系电话" />
				</uni-forms-item>
				<uni-forms-item label="委托代理人姓名:" label-width="120px" v-if="formData.affiliate.organizeFlag==0">
					<uni-easyinput type="text" placeholder="请输入委托代理人姓名" />
				</uni-forms-item>
				<uni-forms-item label="委托代理人姓名:" label-width="120px" required
				v-if="formData.affiliate.organizeFlag==1"
				>
					<uni-easyinput type="text" placeholder="请输入委托代理人姓名" />
				</uni-forms-item>
				<uni-forms-item label="代理人邮箱:" label-width="120px" v-if="formData.affiliate.organizeFlag==0">
					<uni-easyinput type="text" placeholder="请输入代理人邮箱" />
				</uni-forms-item>
				<uni-forms-item label="代理人邮箱:" label-width="120px" required
				v-if="formData.affiliate.organizeFlag==1"
				>
					<uni-easyinput type="text" placeholder="请输入代理人邮箱" />
				</uni-forms-item>
				<uni-forms-item label="被申请人姓名:" label-width="120px" required>
					<uni-easyinput type="text" placeholder="请输入被申请人姓名" />
				</uni-forms-item>
				<uni-forms-item label="被申请人联系电话:" label-width="120px" required>
					<uni-easyinput type="text" placeholder="请输入被申请人联系电话" />
				</uni-forms-item>
				<uni-forms-item label="被申请人身份证号:" label-width="120px" required>
					<uni-easyinput type="text" placeholder="请输入被申请人身份证号" />
				</uni-forms-item>
				<uni-forms-item label="被申请人性别" label-width="120px" required>
					<uni-data-checkbox class='checkbox'
						v-model="formData.affiliate.respondentSex"
						:localdata="respondentSexy"></uni-data-checkbox>
				</uni-forms-item>
				<uni-forms-item label="被申请人出生年月日" label-width="120px" >
					<uni-datetime-picker type="date" :clear-icon="false" />
				</uni-forms-item>
				<uni-forms-item label="被申请人住所:" label-width="120px" required>
					<uni-easyinput type="text" placeholder="请输入被申请人住所" />
				</uni-forms-item>
				<uni-forms-item label="被申请人邮箱:" label-width="120px" required>
					<uni-easyinput type="text" placeholder="请输入被申请人住所" />
				</uni-forms-item>
			</uni-forms>
			<view class="determine" style="text-align: center;">
				<button  class="mini-btn" 
				type="primary" size="mini" 
				@tap="submitReasont">确定</button>
				<button style="margin-left:30rpx;" class="mini-btn" 
				type="default" size="mini" 
				@tap="cencalBut">取消</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
				return {
					formData:{
						affiliate:{
							organizeFlag: 0,
							respondentSex: 0,
						}
					},
					
					objectiJurisArr: [{
						text: '自然人',
						value: 0
					}, {
						text: '机构',
						value: 1
					}],
					respondentSexy: [
						{
							text: '女',
							value: 1
						}, {
							text: '男',
							value: 0
						}
					],
					rules: {
						arbitratClaims: {
							rules:[
								{
									required: true,
									errorMessage: '请输入申请人调解请求',
								},
							],
						},
						facts:{
							rules:[
								{
									required: true,
									errorMessage: '请输入事实和理由',
								},
							],
						},
						caseSubjectAmount:{
							rules:[
								{
									required: true,
									errorMessage: '请输入案件标的',
								},
							],
						}
					}
				}
			
			
		},
		methods:{
			clearValidate(val){
				
			},
			submitReasont(){
				this.$refs.form.validate().then(res=>{
						
					}).catch(err =>{
						
				})
			},
			cencalBut(){
				uni.navigateBack({
					delta: 1
				})
			}
		}
	}
	
</script>

<style lang="scss">
	page {
		background-color: #ffffff;
	}
	.assignrbitrators{
		margin: 30rpx;
	}
</style>