<style lang="scss">
	.content{
		min-height: 100%;
		background:#f6f6f6;
		padding:30rpx 0;

		.cu-navbar{
			.action>button{
				background:rgba(255, 255, 255, 0.1);
				width:96rpx;
				height:48rpx;
				line-height: 48rpx;
				text-align: center;
				font-size:32rpx;
				padding:0;
				color:#fff;
			}
		}

		.card{
			margin-top:0;
			.plant-dikuaimianji{
				display: flex;
				align-items: center;
				font-weight: bold;
				&:before{
					font-weight: normal;
					color:#10C176;
					font-size:40rpx;
					margin-right:16rpx;
					transform: translateY(5rpx);
				}
			}
			.plant-batch-add{
				margin-top:20rpx;
				display: flex;
				align-items: center;
				padding:0 30rpx;
				justify-content: space-between;
				flex-direction: row-reverse;
				background:#F7F7F7;
				border-radius: 24rpx;
				height:80rpx;
				&:before{
					color:#10C176;
				}
				&:after{
					content:"添加农资";
					color:#777;
				}
			}
			.info{
				display:flex;
				align-items: center;
				background:rgba(16, 193, 119, 0.1);
				border-radius: 24rpx;
				height:94rpx;
				margin-top:20rpx;
				padding:0 30rpx;
				text{
					&:first-child{
						flex-shrink: 0;
						color:#fff;
						background:#10C176;
						font-size: 20rpx;
						border-radius:4px 40px 4px 40px;
						width:80rpx;
						height:40rpx;
						text-align: center;
						line-height: 40rpx;
						margin-right:20rpx;
					}
					&:nth-child(2){
						flex-grow: 1;
					}
					&:nth-child(3){
						flex-shrink: 0;
						color:#10C176;
						font-weight: bold;
						margin-left:20rpx;
					}
				}
			}
			.item{
				display:flex;
				justify-content: space-between;
				height:80rpx;
				align-items: center;
				border-bottom:2rpx solid rgba(216, 216, 216, 0.4);
				text{
					color:#777;
					&.plant-youbian{
						display: flex;
						align-items: center;
						flex-direction: row-reverse;
					}
				}
			}
			button{
				display: flex;
				width:80%;
				margin:60rpx auto 0;
			}
		}
	}
</style>
<template>
	<view class="content">
		<cu-navbar style="--bg:#10C176;--c:#fff;" isBack>
			<button slot="right" class="cu-btn round">提交</button>
		</cu-navbar>

		<view class="card">
			<view class="plant-dikuaimianji">阳光玫瑰种植1号地块</view>
			<view class="plant-batch-add"/>
		</view>

		<view class="card">
			<view class="plant-dikuaimianji">阳光玫瑰种植1号地块</view>
			<view class="info">
				<text>化肥</text> <text>中量元素水溶肥</text> <text>200kg</text>
			</view>
			<button class="cu-btn round bg-green shadow">+继续添加农资</button>
		</view>

		<view class="card">
			<view class="item"> <text>操作人</text><text>张召忠</text> </view>
			<view class="item"> <text>操作日期</text><text class="plant-youbian">2022-12-23</text> </view>
			<u-form class="inline" :model="formData" :rules="rules" ref="form" labelWidth="auto">
				<d-form
					v-for="(v,k) in fields"
					:key="k"
					v-bind="v"
					:field="k"
					:required="!!rules[k]"/>
			</u-form>
		</view>
	</view>
</template>
<script>
export default {
	data(){
		return{
			fields:{
				imgs:{label:"农事图片",type:"upImg"},
				intro:{label:"产品介绍",type:"textarea"},
			},
			formData:{
				name:"",
			},
			rules:{

			}
		}
	},
	onLoad(){
		
	}
}
</script>