jsy-app/pages/irrigation/add/addtask.vue

<template>
	<!-- 顶部导航栏 -->
	<custom-nav-bar :left="true" leftText="" @leftClick="" title="新增任务"></custom-nav-bar>

	<view class="create-container">
		<u-form ref="form" :model="formData" :rules="rules">
			<u-form-item label="任务名称" prop="username" required="">
				<u-input v-model="formData.username" placeholder="请输入任务名称" />
			</u-form-item>
			 <u-form-item label="轮灌方案" required="">
			      <u-input placeholder="请选择轮灌方案"></u-input>
			    </u-form-item>
			<u-form-item label="自动调压" prop="gender" required="">
				<u-radio-group v-model="formData.gender" color="#39ac4f">
					<u-radio label="是" name="male"></u-radio>
					<u-radio label="否" name="female"></u-radio>
				</u-radio-group>
			</u-form-item>
			<view class="form-btn">
				<u-button type="success" size="large" text="立即执行" @click="" />
				<u-button size="large" text="取消" @click="" />
			</view>
		</u-form>
	</view>

	<!-- <uni-forms ref="baseForm" :modelValue="baseFormData">
		<uni-forms-item label="任务名称" required>
			<uni-easyinput v-model="baseFormData.name" placeholder="请输入任务名称" />
		</uni-forms-item>
		<uni-forms-item label="轮灌方案" required>
			<view class="select" @click="openPopup">
				<view>请选择轮灌方案</view>
			</view>
		</uni-forms-item>
		<uni-forms-item label="起始组" required>
			<view class="select" @click="openPopup">
				<view>请选择起始组</view>
			</view>
		</uni-forms-item>
		<uni-forms-item label="自动调压" required>
			<uni-data-checkbox v-model="baseFormData.sex" :localdata="sexs" />
		</uni-forms-item>
		<view class="form-btn">
			<u-button type="success" size="large" text="立即执行"  @click="" />
			<u-button size="large" text="取消"  @click="" />
		</view>
	</uni-forms> -->
	<!-- 底部弹出框 -->
	<uni-popup ref="popup" type="bottom">
		<view class="popup-content">
			<text>这是底部弹出框的内容。</text>
		</view>
	</uni-popup>
</template>

<script>
	export default {
		data() {
			return {
				formData: {
					username: '',
					gender: ''
				},
				rules: {
					username: [{
						required: true,
						message: '请输入任务名称',
						trigger: ['change', 'blur']
					}]
				}

			};
		},
		methods: {
			openPopup() {
				this.$refs.popup.open();
			},
			closePopup() {
				this.$refs.popup.close();
			},

		}
	}
</script>

<style lang="scss" scoped>
	body {
		background-color: #fff;
	}

	// 表单
	.create-container {
		padding: 0 20px;
		background-color: #FFF;

		// .custom-input {
		//   width: 280px;
		// }
		// .form-item {
		// 	margin-left: 20px;
		// 	display: flex;
		// 	align-items: flex-start;
		// 	width: 100%;
		// }
		::v-deep .u-form-item__body__left {
			width: 80px !important;
		}
	}

	// 弹出框
	.popup-content {
		padding: 20px;
		background-color: #fff;
		text-align: center;
	}
</style>