hs_hzl_uniapp_ml/pageA/psq/form.vue

<template>
	<view class="wrapper" style="padding: 30px">
		<div class="header">
			<div>
				<h2>防疫调查登记问卷</h2>
			</div>
			<div style="position: absolute;padding: 5px 20px;font-size: 15px;color: rgba(0,0,0,0.39);
      right: 10px;top:10px;border: 1px solid rgba(0,0,0,0.39);border-radius: 10px">
				<span>{{form.orgName}}</span>
			</div>
		</div>
		<view class="main">
			<view v-for="(item,index) in queDbList">
				<text class="u-block__title" style="font-size: 18px;">{{index+1+"."+item.label}}</text>
				<view class="u-demo-block__content" style="padding: 15px;">
					<view class="u-page__radio-item">
						<u-radio-group v-model="form.queResults[index]" placement="column" activeColor="#73a6a4">
							<u-radio :customStyle="{marginBottom: '8px'}" v-for="item in item.resultList"
								:key="item.id" :label="item.value" :name="item.value" size="25">
							</u-radio>
						</u-radio-group>
					</view>
				</view>
			</view>
		</view>
		<view>
			<u-button type="success" @click="submit" color="#73a6a4" :disabled="disabled">提交</u-button>
		</view>
		<view class="uni-fixed-bottom">
			<div style="margin-bottom: 5px;">
				<u-row>
					<u-col span="5">
						<u-text text="技术支持：会山科技" color="#cacaca">
						</u-text>
					</u-col>
					<u-col span="2">
						<div></div>
					</u-col>
					<u-col span="5">
						<u-text text="hs@willalp.com" color="#cacaca">
						</u-text>
					</u-col>
				</u-row>
			</div>
		</view>
	</view>
</template>

<script>
	export default {
		name: "form",
		data() {
			return {
				queDbList: [],
				disabled: false,
				form: {
					userName: '',
					userNo: '',
					orgNo: '',
					orgName: '',
					queResults: ['', '', '', '', '', '', ''],
					ques: []
				},
			}
		},
		onLoad() {
			const userInfo = uni.getStorageSync('userInfo');
			const orgInfo = uni.getStorageSync('orgInfo');
			this.form.userName = userInfo.nickName
			this.form.userNo = userInfo.userName
			this.form.orgNo = orgInfo.organizationCode
			this.form.orgName = orgInfo.organizationName
		},
		created() {
			this.getList()
		},
		methods: {
			async getQueList() {
				const {
					data: res
				} = await this.$httpRequest({
					url: '/api/yq/list?queGroupId=' + 1,
					method: 'get',
				})
				if (res.code == 200) {
					this.queDbList = res.data
					this.queDbList.forEach(q => {
						this.form.ques.push(q.id)
					})
				} else {

				}
			},
			async save() {
				const {
					data: res
				} = await this.$httpRequest({
					method: 'POST',
					url: '/api/yq/save',
					data: this.form
				})
				if (res.code == 200) {
					uni.showToast({
						title: res.msg,
						icon: 'success'
					})
					setTimeout(() => {
						location.reload()
					}, 1000)
				} else {

				}
			},
			getList() {
				this.getQueList();
			},
			submit() {
				this.disabled = true
				var message = "";
				var isOk = false;
				// var myreg =
				// 	/^(((13[0-9]{1})|(14[0-9]{1})|(17[0-9]{1})|(15[0-3]{1})|(15[4-9]{1})|(18[0-9]{1})|(199))+\d{8})$/;
				// if (phone == '') {
				// 	// console.log("手机号码不能为空");
				// 	message = "手机号码不能为空！";
				// 	isOk = true;
				// } else if (phone.length !== 11) {
				// 	//console.log("请输入11位手机号码！");
				// 	message = "请输入11位手机号码！";
				// 	isOk = true;
				// } else if (!myreg.test(phone)) {
				// 	//console.log("请输入有效的手机号码！");
				// 	message = "请输入有效的手机号码！";
				// 	isOk = true;
				// }
				if (isOk) {
					uni.showToast({
						title: message,
						icon: 'error'
					})
					return;
				}
				this.save()
				setTimeout(() => {
					this.disabled = false
				}, 2000)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.wrapper {
		display: flex;
		flex-direction: column;
		min-height: 100%;
	}

	.header {
		flex: 0;
		margin-top: 20px;
	}

	.main {
		flex: 1;
		margin: 20px 0;
	}

	.footer {
		flex: 0;
	}


	.uni-fixed-bottom {
		width: 100%;
		bottom: 0upx;
		padding: 0upx;
		position: fixed;
		background: #FFFFFF;
		transform: translateZ(0);
		bottom: env(safe-area-inset-bottom);
		bottom: constant(safe-area-inset-bottom);
	}

	.u-page {
		&__style {
			font-size: 16px;
			color: rgb(96, 98, 102);
			margin-bottom: 20rpx;
			font-weight: bold;
		}

		&__title {
			font-size: 16px;
			color: rgb(96, 98, 102);
			margin-bottom: 20rpx;
		}
	}
</style>