uniapp/pages/add-test/add-test.vue

<template>
	<view class="container">
				<form @submit="formSubmit" @reset="formReset">			
				
					    
							<view class="line">
								<label style="float: left;width: 20%;text-align: center;">姓名：</label>
								<input name="name" class="chat_input"  style="width: 70%;float: left;font-size: large;border-bottom: 1rpx solid #F1F1F1;" type="text" placeholder="请正确填写姓名..."/>
							</view>
					        <view class="line">
								<view style="width: 20%;text-align: center;">性别：</view>
								<view>
									<radio-group name="gender">
										<label class="radio">
											<radio value="男" />男
										</label>
										<label class="radio" style="padding-left: 20rpx;">
											<radio value="女" />女
										</label>
									</radio-group>
								</view>
							</view>
							<view class="line">
								<label style="float: left;padding-left: 20rpx;">出生日期：</label>
								<input name="birth" class="chat_input" style="float: left;" type="text" placeholder="格式:2020-01-01(选填)"/>
							</view>
							<view class="line">
								<label style="float: left;width: 25%;padding-left:20rpx;text-align: center;">患者电话：</label>
								<input name="tel" class="chat_input" style="width: 70%;float: left;font-size: large;" type="text" placeholder="请填写患者或家属手机号"/>
							</view>
					   
						
							<view class="line">
								<label style="float: left;width: 25%;padding-left:20rpx;text-align: center;">初步诊断：</label>
								<input name="diagnose" class="chat_input" style="width: 70%;float: left;font-size: large;" type="text" placeholder="选填"/>
							</view>
							<view class="line">
								<label style="float: left;width: 25%;padding-left:20rpx;text-align: center;">检查项目：</label>
								<input name="item" class="chat_input" style="width: 70%;float: left;font-size: large;" type="text" placeholder="请填写检查、检查部位"/>
							</view>
						
			
					
					<view style="padding-top:20rpx;padding-bottom: 400rpx;">
						<view type="submit" w_size="600" h_size="80" text="提交预约">提交预约</view>
					</view>
					
				</form>
				
			</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			formSubmit:function(e){
							let tmp = JSON.stringify(e.detail.value)
							console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value))
							var formdata = e.detail.value
							// 数据校验
							// console.log(formdata.birth);
							//正则表达式
							let reg_name = /^[\u4e00-\u9fa5]{0,}$/
							let reg_birth = /^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/;
							let reg_tel = /(\d{11})|^((\d{7,8})|(\d{4}|\d{3})-(\d{7,8})|(\d{4}|\d{3})-(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1})|(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1}))$/
							//结果标记
							let sign_name = RegExp(reg_name).test(formdata.name);
							let sign_birth = RegExp(reg_birth).test(formdata.birth);
							let sign_tel = RegExp(reg_tel).test(formdata.tel);	
							// console.log(sign+"，数据类型："+typeof(sign));
							if(!sign_name||formdata.name==''){
								this.showModal('请检查姓名');	
							}else if(formdata.gender==''){
								this.showModal('请选择性别')
							}else if(!sign_birth||formdata.name==''){
								this.showModal("请检查出生日期");
							}else if(!sign_tel||formdata.name==''){
								this.showModal("请检查电话号码");
							}else if(formdata.diagnose==''){
								this.showModal('请填写初步诊断')
							}else if(formdata.item==''){
								this.showModal("请填写检查部位");
							}else{
								uni.request({
									url: this.$baseUrl.baseUrl+"Wxtest/ApplyCheck",
									data: tmp,
									method: "post",
									success:(res)=> {
										this.showModal(res.data.msg);
										if (res.confirm||res.cancel) {
											console.log('用户点击确定');
										}
									},
									fail:(res)=>{
										console.log("错误") 
									}
								})
							}
							
						},
						formReset: function(e) {
							console.log('清空数据')
						},
						showModal:function(content){
							uni.showModal({
								title:'提示',
								content:content,
							})
						}
			
		}
	}
</script>

<style>

</style>