<style lang="scss" scoped>
	.container {
		background:#F6F6F6;
		padding-bottom:20rpx;
		min-height:100%;
		&>.head{
			padding:30rpx;
			width:calc(100% - 60rpx);
			background:#31C888;
			height:290rpx;
			margin-bottom:-80rpx;
			border-radius: 0 0 80rpx 80rpx;
			box-sizing:content-box;
		}
		swiper.headImg{
			height:424rpx;
			margin-bottom:-80rpx;
			.u-transition{
				height:100%;
			}
		}
		swiper.data{
			height:213rpx;
			swiper-item{
				&>view{
					margin:15rpx;
					border-radius: 15rpx;
					height:170rpx;
					background-size:100% 100%;
					background-color:#fff;
					padding:14rpx;
					display: flex;
					justify-content: space-between;
					position: relative;
					padding:90rpx 30rpx 0 30rpx;
					color:rgba(var(--c),1);
					font-size:40rpx;
					&:before{
						content:attr(data-title);
						position:absolute;
						top:38rpx;
						color:#333333;
						font-size:28rpx;
					}
					text.value{
						font-weight: bold;
						text-align: center;
						min-width: 160rpx;
					}
					text[class*=plant-]{
						font-size:60rpx;
					}
				}
				&:first-child>view{
					background-image: url("data:image/svg+xml,%3Csvg width='333' height='170' viewBox='0 0 333 170' fill='none' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3Cg transform='translate(-60,-0)'%3E %3Cellipse cx='69.5' cy='145.5' rx='69.5' ry='73.5' fill='%2310C176' fill-opacity='0.2'/%3E %3Cellipse cx='114.5' cy='39' rx='10.5' ry='11' fill='%2310C176' fill-opacity='0.2'/%3E %3Ccircle cx='253' cy='97' r='14' fill='%2310C176' fill-opacity='0.2'/%3E %3Cpath d='M209 0L289 71.5C296.5 77.5 304 78 311.5 71.5C315.5 66.5 353.333 19.1667 368 0L209 0Z' fill-rule='evenodd' fill='url(%23paint_linear_31_5_0)'/%3E %3C/g%3E %3Cdefs%3E %3ClinearGradient id='paint_linear_31_5_0' x1='338.5' y1='-12.5' x2='284' y2='62.999901' gradientUnits='userSpaceOnUse'%3E %3Cstop stop-color='%23C4C4C4' stop-opacity='0'/%3E %3Cstop offset='1' stop-color='%2310C176' stop-opacity='0.2'/%3E %3C/linearGradient%3E %3C/defs%3E %3C/svg%3E");
				}
				&:nth-child(2)>view{
					background-image: url("data:image/svg+xml,%3Csvg width='333' height='170' viewBox='0 0 333 170' fill='none' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3Cg transform='translate(-60,-0)'%3E %3Cellipse cx='69.5' cy='145.5' rx='69.5' ry='73.5' fill='%23FFC353' fill-opacity='0.2'/%3E %3Cellipse cx='114.5' cy='39' rx='10.5' ry='11' fill='%23FFC353' fill-opacity='0.2'/%3E %3Ccircle cx='253' cy='97' r='14' fill='%23FFC353' fill-opacity='0.2'/%3E %3Cpath d='M209 0L289 71.5C296.5 77.5 304 78 311.5 71.5C315.5 66.5 353.333 19.1667 368 0L209 0Z' fill-rule='evenodd' fill='url(%23paint_linear_31_5_0)'/%3E %3C/g%3E %3Cdefs%3E %3ClinearGradient id='paint_linear_31_5_0' x1='338.5' y1='-12.5' x2='284' y2='62.999901' gradientUnits='userSpaceOnUse'%3E %3Cstop stop-color='%23C4C4C4' stop-opacity='0'/%3E %3Cstop offset='1' stop-color='%23FFC353' stop-opacity='0.2'/%3E %3C/linearGradient%3E %3C/defs%3E %3C/svg%3E");
				}
				&:nth-child(3)>view{
					background-image: url("data:image/svg+xml,%3Csvg width='333' height='170' viewBox='0 0 333 170' fill='none' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3Cg transform='translate(-60,-0)'%3E %3Cellipse cx='69.5' cy='145.5' rx='69.5' ry='73.5' fill='%2306B8F9' fill-opacity='0.2'/%3E %3Cellipse cx='114.5' cy='39' rx='10.5' ry='11' fill='%2306B8F9' fill-opacity='0.2'/%3E %3Ccircle cx='253' cy='97' r='14' fill='%2306B8F9' fill-opacity='0.2'/%3E %3Cpath d='M209 0L289 71.5C296.5 77.5 304 78 311.5 71.5C315.5 66.5 353.333 19.1667 368 0L209 0Z' fill-rule='evenodd' fill='url(%23paint_linear_31_5_0)'/%3E %3C/g%3E %3Cdefs%3E %3ClinearGradient id='paint_linear_31_5_0' x1='338.5' y1='-12.5' x2='284' y2='62.999901' gradientUnits='userSpaceOnUse'%3E %3Cstop stop-color='%23C4C4C4' stop-opacity='0'/%3E %3Cstop offset='1' stop-color='%2306B8F9' stop-opacity='0.2'/%3E %3C/linearGradient%3E %3C/defs%3E %3C/svg%3E");}
				&:nth-child(4)>view{
					background-image: url("data:image/svg+xml,%3Csvg width='333' height='170' viewBox='0 0 333 170' fill='none' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3Cg transform='translate(-60,-0)'%3E %3Cellipse cx='69.5' cy='145.5' rx='69.5' ry='73.5' fill='%237E6BE5' fill-opacity='0.2'/%3E %3Cellipse cx='114.5' cy='39' rx='10.5' ry='11' fill='%237E6BE5' fill-opacity='0.2'/%3E %3Ccircle cx='253' cy='97' r='14' fill='%237E6BE5' fill-opacity='0.2'/%3E %3Cpath d='M209 0L289 71.5C296.5 77.5 304 78 311.5 71.5C315.5 66.5 353.333 19.1667 368 0L209 0Z' fill-rule='evenodd' fill='url(%23paint_linear_31_5_0)'/%3E %3C/g%3E %3Cdefs%3E %3ClinearGradient id='paint_linear_31_5_0' x1='338.5' y1='-12.5' x2='284' y2='62.999901' gradientUnits='userSpaceOnUse'%3E %3Cstop stop-color='%23C4C4C4' stop-opacity='0'/%3E %3Cstop offset='1' stop-color='%237E6BE5' stop-opacity='0.2'/%3E %3C/linearGradient%3E %3C/defs%3E %3C/svg%3E");
				}
			}
		}
		.card{
			&.area{
				position:relative;
				z-index: 20;
				table{
					width:100%;
					border-bottom:2rpx solid rgba(216, 216, 216, 0.2);
					tr{
						&.title{
							font-size:24rpx;
						}
						&.value{
							color:#10C176;
							font-size:32rpx;
							font-weight: bold;
						}
					}
				}
				.article{
					display:flex;
					align-items: center;
					padding-top:20rpx;
					text{
						&:before{
							color:#31C888;
							margin-right:14rpx;
						}
						&.line{
							width:5rpx;
							height: 52rpx;
							background:rgba(216, 216, 216, 0.2);
							margin:0 30rpx 0 auto;
						}
					}
				}
			}
			&.mana{
				width:calc(50% - 46rpx);
				flex-shrink: 0;
				margin-top:0;
				.title{
					color:#333;
					font-size:32rpx;
					display:flex;
					align-items: center;
					padding-bottom:24rpx;
					border-bottom:2rpx solid #D8D8D8;
					[class*=plant-]{
						color:#10C176;
					}
					.more{
						color:#999;
						font-size:24rpx;
						margin-left:auto;
					}
				}
				.item{
					display:flex;
					align-items: center;
					margin-top:24rpx;
					color:#707070;
					font-size:24rpx;
					&:nth-child(2){ --c:235, 67, 118; }
					&:nth-child(3){ --c:255, 195, 83; }
					&:nth-child(4){ --c:16, 193, 118; }
					&:before{
						flex-shrink: 0;
						content:" ";
						width:20rpx;
						height:20rpx;
						border-radius: 50%;
						background-image:radial-gradient(rgba(var(--c), 1) 2px,rgba(var(--c), 0.2) 2.5px);
						margin-right:10rpx;
					}
					text{
						&:nth-child(2){
							margin-left:auto;
							flex-shrink: 0;
						}
					}
				}
				.u-empty{
					min-height:auto;
				}
				&:first-child{
					margin-right:calc(30rpx/2);
				}
				&:nth-child(2){
					margin-left:calc(30rpx/2);
				}
			}
			&.stock{
				width:calc(50% - 46rpx);
				margin-top:0;
				background-color:var(--c);
				background-image:url(data:image/png;base64,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);
				background-size:100% 100%;
				.title{
					font-size:32rpx;
					color:#fff;
					display: flex;
					align-items: center;
					border-bottom:2rpx solid rgba(255,255,255,0.7);
					padding-bottom:26rpx;
					&:before{
						content:" ";
						width:12rpx;
						height:30rpx;
						border-radius: 20rpx;
						background:#fff;
						margin-right:14rpx;
					}
				}
				.item{
					color:#fff;
					font-size:28rpx;
					margin-top:20rpx;
					display: flex;
					align-items: center;
					&:before{
						content:" ";
						margin-right:20rpx;
						width:34rpx;
						height:34rpx;
						background-size:100% 100%;
					}
					&.meansAgrProd:before{
						background-image: url("data:image/svg+xml,%3Csvg t='1672908080899' class='icon' viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='1328' xmlns:xlink='http://www.w3.org/1999/xlink' width='300' height='300'%3E%3Cpath d='M948.554539 168.007631a32.559618 32.559618 0 0 0 3.255962-14.163434V32.559618a32.559618 32.559618 0 0 0-31.745628-32.559618H104.609229a32.559618 32.559618 0 0 0-32.559619 32.559618v121.284579a32.559618 32.559618 0 0 0 3.41876 14.163434l54.862957 112.65628v462.346582L75.305572 855.666773a32.559618 32.559618 0 0 0-3.255962 14.163434v121.610175a32.559618 32.559618 0 0 0 32.559619 32.559618h815.455644a32.559618 32.559618 0 0 0 31.745628-32.559618v-121.610175a32.559618 32.559618 0 0 0-3.255962-14.163434l-55.025755-112.65628v-462.346582z m-60.235294 734.382194v56.816534H135.540866v-56.816534z m-54.862957-643.703656a33.536407 33.536407 0 0 0-3.255962 14.326232v477.649602a34.187599 34.187599 0 0 0 3.255962 14.48903L869.760262 837.758983H155.076637L190.566622 765.151033a33.536407 33.536407 0 0 0 3.255961-14.326232V273.012401a33.536407 33.536407 0 0 0-3.255961-14.326232L155.076637 186.078219H869.760262zM135.540866 121.447377V65.119237h752.778379v56.32814z' fill='%23fff' p-id='1329'%3E%3C/path%3E%3Cpath d='M511.604459 240.778378a268.291256 268.291256 0 0 0-264.546899 271.058824 276.756757 276.756757 0 0 0 32.559618 130.238474 32.559618 32.559618 0 0 0 2.279173 4.069952 261.779332 261.779332 0 0 0 461.044197 0 35.489984 35.489984 0 0 0 2.279174-4.069952 276.756757 276.756757 0 0 0 32.559618-130.238474A268.454054 268.454054 0 0 0 511.604459 240.778378z m-116.237837 333.247695a54.048967 54.048967 0 0 1 20.675357 4.232751 31.094436 31.094436 0 0 0 26.047695-1.139587 32.559618 32.559618 0 0 0 16.279809-20.349762 55.025755 55.025755 0 0 1 106.958347 0 32.559618 32.559618 0 0 0 16.279809 20.675358 30.931638 30.931638 0 0 0 26.047695 0.976789 54.862957 54.862957 0 0 1 75.375516 42.164706 198.776471 198.776471 0 0 1-342.852782 0 56.002544 56.002544 0 0 1 55.188554-46.560255zM511.604459 449.811129a118.354213 118.354213 0 0 0-102.562798 60.56089c-4.883943 0-9.930684 0-14.326232-0.976788a117.540223 117.540223 0 0 0-82.213036 33.862003 202.032432 202.032432 0 1 1 400.971701-31.420032 226.614944 226.614944 0 0 1-2.279174 31.420032 117.865819 117.865819 0 0 0-81.399046-33.862003 104.190779 104.190779 0 0 0-14.326232 0.976788A118.679809 118.679809 0 0 0 511.604459 449.811129z' fill='%23fff' p-id='1330'%3E%3C/path%3E%3C/svg%3E");
					}
					&.agrProd:before{
						background-image: url("data:image/svg+xml,%3Csvg width='943.000000' height='770.000000' viewBox='0 0 943 770' fill='none' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3Cpath d='M943 440.11L943 618.76C943 629.111 940.294 638.695 934.689 647.513C929.277 656.331 921.739 663.04 912.076 667.64L718.025 764.058C710.874 768.083 702.563 770 693.286 770C684.008 770 675.891 768.083 668.546 764.058L474.496 667.832C473.336 667.257 472.37 666.682 471.403 666.107C470.823 666.682 469.857 667.257 468.311 667.832L274.454 764.058C267.303 768.083 258.992 770 249.714 770C240.437 770 232.319 768.083 224.975 764.058L30.9243 667.832C21.4538 663.231 13.916 656.522 8.31091 647.705C2.89917 638.887 0 629.303 0 618.952L0 440.11C0 429.184 3.09247 419.216 9.27734 410.015C15.4622 400.814 23.5798 393.913 33.8235 389.313L221.882 309.38L221.882 137.438C221.882 126.512 224.975 116.545 231.16 107.344C237.345 98.1429 245.462 91.2422 255.706 86.6418L449.756 4.21707C456.328 1.3418 463.672 0 471.403 0C479.134 0 486.479 1.3418 493.05 4.21707L687.101 86.6418C697.151 91.2422 705.269 98.1429 711.647 107.344C717.832 116.545 720.924 126.512 720.924 137.438L720.924 309.38L908.983 389.313C919.42 393.913 927.538 400.814 933.722 410.015C939.907 419.216 943 429.183 943 440.11ZM249.908 506.241L424.824 431.867L249.908 357.685L74.7983 432.059L249.908 506.241ZM277.546 701.377L443.958 618.952L443.958 484.006L277.546 554.546L277.546 701.377ZM471.597 217.563L662.555 136.288L471.597 55.0136L280.639 136.288L471.597 217.563ZM499.428 380.304L665.84 309.38L665.84 195.136L499.429 265.676L499.428 380.304ZM693.479 506.241L868.395 431.867L693.479 357.685L518.37 431.867L693.479 506.241ZM721.118 701.377L887.529 618.952L887.529 484.006L721.118 554.546L721.118 701.377Z' fill-rule='nonzero' fill='%23FFFFFF'/%3E %3C/svg%3E");
					}
					&.warehousing:before{
						background-image: url("data:image/svg+xml,%3Csvg width='1024.000000' height='1024.000000' viewBox='0 0 1024 1024' fill='none' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3Cpath d='M730.904 741.89L897.568 741.89C920.443 741.89 939 759.806 939 781.892L939 862.797C939 884.882 920.443 902.798 897.568 902.798L730.904 902.798L730.904 950.688C730.904 984.154 690.873 1002.86 663.679 982.126L493.981 852.43C472.857 836.317 472.973 805.442 494.215 789.441L663.912 661.548C691.106 641.04 730.904 659.745 730.904 693.099L730.904 741.89Z' fill-rule='nonzero' fill='%23FFFFFF'/%3E %3Cpath d='M510 29L26 404.003L26 963.69L526.223 963.69L450.944 906.11C424.451 885.827 409.279 855.516 409.395 822.838C409.512 790.161 424.918 759.962 451.528 739.905L621.226 612.012C640.716 597.251 663.942 589.588 688.451 589.588C742.955 589.588 788.239 628.125 796.642 678.381L966.806 678.381C976.26 678.381 985.247 679.959 994 682.1L994 404.003L510 29ZM310.191 881.545L120.769 881.545L120.769 698.551L310.308 698.551L310.191 881.545ZM310.191 611.449L120.769 611.449L120.769 428.454L310.308 428.454L310.191 611.449Z' fill-rule='evenodd' fill='%23FFFFFF'/%3E %3C/svg%3E ");
					}
					&.lssue:before{
						background-image: url("data:image/svg+xml,%3Csvg width='1024.000000' height='1024.000000' viewBox='0 0 1024 1024' fill='none' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3Cpath d='M293.096 741.89L126.432 741.89C103.557 741.89 85.0001 759.806 85.0001 781.892L85.0001 862.797C85.0001 884.882 103.557 902.798 126.432 902.798L293.096 902.798L293.096 950.688C293.096 984.154 333.127 1002.86 360.321 982.126L530.019 852.43C551.143 836.317 551.027 805.442 529.785 789.441L360.088 661.548C332.894 641.04 293.096 659.745 293.096 693.099L293.096 741.89Z' fill-rule='nonzero' fill='%23FFFFFF'/%3E %3Cpath d='M514 29L998 404.003L998 963.69L497.777 963.69L573.056 906.11C599.549 885.827 614.721 855.516 614.605 822.838C614.488 790.161 599.082 759.962 572.472 739.905L402.774 612.012C383.284 597.251 360.058 589.588 335.549 589.588C281.045 589.588 235.761 628.125 227.358 678.381L57.1937 678.381C47.7401 678.381 38.7533 679.959 30 682.1L30 404.003L514 29ZM713.809 881.545L903.231 881.545L903.231 698.551L713.692 698.551L713.809 881.545ZM713.809 611.449L903.231 611.449L903.231 428.454L713.692 428.454L713.809 611.449Z' fill-rule='evenodd' fill='%23FFFFFF'/%3E %3C/svg%3E");
					}
				}
			}
			&.base{
				margin-top:0;
				background:linear-gradient(#fff,#F1FBF6);
				.title{
					display:flex;
					align-items: center;
					&:before{
						content:" ";
						width:12rpx;
						height:30rpx;
						border-radius: 20rpx;
						background:#10C176;
						margin-right:14rpx;
					}
					.plant-jiantou_zuoyouqiehuan{
						margin-left:auto;
						color:#10C176;
						font-size:28rpx;
						&:before{
							margin-right:8rpx;
							color:#fff;
							background:#10C176;
							font-weight: normal;
							border-radius: 50%;
							width:34rpx;
							height:34rpx;
							text-align: center;
							line-height: 34rpx;
						}
					}
				}
				.matter{
					margin:20rpx 0;
					padding-bottom:20rpx;
					border-bottom:2rpx solid #D8D8D8;
					display:flex;
					align-items: center;
					text{
						flex-shrink: 0;
						display: inline-flex;
						align-items: center;
						&:before{
							color:rgba(var(--c),1);
							margin-right:12rpx;
							text-shadow: 6rpx -6rpx rgba(var(--c),0.3);
						}
						&.active{
							color:rgba(var(--c),1);
						}
						&.more{
							color:#999;
							margin-left:auto;
						}
					}
				}
				.item{
					display:flex;
					align-items: center;
					margin-top:40rpx;
					&:before{
						content:" ";
						flex-shrink: 0;
						width:20rpx;
						height:20rpx;
						margin-right:16rpx;
						border-radius: 50%;
						background-image:radial-gradient(rgba(var(--c),1) 2px, rgba(var(--c),0.3) 2.5px)
					}
					text{
						&:first-child{
							flex-shrink: 0;
							min-width:90rpx;
							color:#333333;
							font-size:28rpx;
							margin-right:20rpx;
						}
					}
				}
			}
		}

		.u-popup{
			&/deep/ .u-popup__content{
				border-radius: 24rpx 24rpx 0 0;
				padding-top:90px;
				background-image:url(@/static/home_picker_head.png);
				background-repeat: no-repeat;
				background-size:100% 90px;
			}
		}
	}
</style>
<template>
	<view class="container">
		<swiper autoplay :interval="5*1000" v-if="headImgs.length>0" class="headImg" circular>
			<swiper-item v-for="(v,k) in headImgs" :key="k">
				<u-image :src="`${host}/${v}`" width="100%" height="100%" mode="aspectFill">
					<text slot="error" class="plant-xiaopangchetupianjiazaishibai"/>
				</u-image>
			</swiper-item>
		</swiper>
		<image v-else class="head" src="@/static/banner.png" mode="aspectFit"/>

		<view class="area card">
			<table>
				<tr class="title"> <td>地块个数(个)</td><td>地块面积(亩)</td><td>在种品种(种)</td><td>在种面积(亩)</td> </tr>
				<tr class="value"> <td>{{massif.plotNum||0}}</td><td>{{massif.totalArea||0}}</td><td>{{massif.plantArea||0}}</td><td>{{massif.productCount||0}}</td> </tr>
			</table>
			<view class="article">
				<text class="plant-bijibenjilutongxunlu" @click="$u.route({url:'pages/massif/myPlant'})"/>
				<u-image
					v-for="(v,k) in massif.images||[]" :key="k"
					:title="`${host}/${massif.images[k]}`"
					width="56rpx"
					height="46rpx"
					radius="8rpx"
					:src="`${host}/${massif.images[k]}`"/>
				
				<text class="line"/>
				<text class="plant-nongzi" style="margin-right:64rpx;" @click="$u.route({url:'pages/stock/mana'})">库存</text>
				<text class="plant-caigou" @click="$u.route({url:'pages/purchase/apply'})">采购</text>
			</view>
		</view>

		<!-- <swiper class="data" :display-multiple-items="2" circular>
			<swiper-item>
				<view data-title="地块个数(个)" style="--c:16, 193, 118;">
					<text class="value">{{massif.plotNum}}</text>
					<text class="plant-24gf-chartBarUpward"/>
				</view>
			</swiper-item>
			<swiper-item>
				<view data-title="地块总面积(亩)" style="--c:255, 195, 83;">
					<text class="value">{{massif.totalArea}}</text>
					<text class="plant-mianji"/>
				</view>
			</swiper-item>
			<swiper-item>
				<view data-title="当前种植面积(亩)" style="--c:6, 184, 249;">
					<text class="value">{{massif.plantArea}}</text>
					<text class="plant-chayuanmianji"/>
				</view>
			</swiper-item>
			<swiper-item>
				<view data-title="当前种植品种(种)" style="--c:126, 107, 229;">
					<text class="value">{{massif.productCount}}</text>
					<text class="plant-zhongzhipinzhong"/>
				</view>
			</swiper-item>
		</swiper> -->
		<view style="display:flex;">
			<view class="card mana">
				<view class="title">
					<text class="plant-dikuaimianji"/> 种植管理 <text class="more" @click="$u.route({type:'switchTab',url:'pages/massif/index'})">更多>></text>
				</view>
				<view class="item" v-for="(v,k) in massif.plotList||[]" :key="k">
					<text class="over">{{v.plotName}}</text> <text>{{v.realityArea}}亩</text>
				</view>
				<u-empty :show="(massif.plotList||[]).length<=0" text=" " width="70%" icon="/static/noData.png"/>
			</view>
			<view class="card mana">
				<view class="title">
					<text class="plant-cangkuguanliguanli"/> 仓库管理 <text class="more" @click="$u.route({url:'pages/warehouse/mana'})">更多>></text>
				</view>
				<view class="item" v-for="(v,k) in stockList" :key="k">
					<text class="over">{{v.warehouseName}}</text> <text>{{v.warehouseVolume}}㎡</text>
				</view>
				<u-empty :show="stockList.length<=0" text=" " width="60%" icon="/static/noData.png"/>
			</view>
		</view>
		<!-- <view style="display:flex;">
			<view class="card stock" style="margin-right:0px;--c:#10C176;" @click="$u.route({url:'pages/stock/mana'})">
				<view class="title">库存管理</view>

				<view class="item meansAgrProd">农资库存</view>
				<view class="item agrProd">农产品库存</view>
			</view>
			<view class="card stock" style="--c:#ffc353;" @click="$u.route({url:'pages/purchase/apply'})">
				<view class="title">采购申请</view>

				<view class="item warehousing">入库管理</view>
				<view class="item lssue">出库管理</view>
			</view>
		</view> -->
		<view class="card base">
			<view class="title">
				{{$store.state.baseInfo.name||'基地管理'}} <text class="plant-jiantou_zuoyouqiehuan" v-if="isAdmin" @click="show=true">切换基地</text>
			</view>
			<view class="matter">
				<text class="plant-jilu" :class="{active:baseIndex=='record'}" style="--c:16, 193, 118;margin-right:40px;" @click="baseIndex=='record'?baseIndex='':baseIndex='record'">农事记录</text>
				<text class="plant-tourupin" :class="{active:baseIndex=='input'}" style="--c:255, 195, 83;" @click="baseIndex=='input'?baseIndex='':baseIndex='input'">投入品</text>
				<text class="more" @click="$u.route({url:'/pages/baseMana/formReacord'})">更多>></text>
			</view>

			<template v-if="!baseIndex || baseIndex=='record'">
				<view v-for="(v,k) in baseInfo.farmWork||[]" :key="`${k}_work`" class="item" style="--c:16, 193, 118;">
					<text>农事</text>
					<u-notice-bar style="padding:0rpx;" icon="" speed="45" color="#777" bgColor="" :text="`${v.userName}${new Date(v.time).format('yyyy-MM-dd')}日完成了${v.plotName}${v.farmWorkName}任务`"/>
				</view>
			</template>
			<template v-if="!baseIndex || baseIndex=='input'">
				<view v-for="(v,k) in baseInfo.farmingInput||[]" :key="`${k}_input`" class="item" style="--c:255, 195, 83;">
					<text>投入品</text>
					<u-notice-bar style="padding:0rpx;" icon="" speed="45" color="#777" bgColor="" :text="`${v.userName}${new Date(v.time).format('yyyy-MM-dd')}日完成了${v.plotName}${v.farmWorkName}任务`"/>
				</view>
			</template>
			<u-empty :show="isEmpty" text="为查询到相关信息" width="50%" icon="/static/noData.png"/>
		</view>

		<u-picker v-if="isAdmin" :show="show" :columns="plantBase" keyName="baseName" closeOnClickOverlay @close="show=false" @confirm="$store.commit('setBaseId', {id:$event.value[0].id,name:$event.value[0].baseName});show=false" @cancel="show=false"/>
	</view>
</template>

<script>
import request,{host} from '@/common/request'
	export default {
		data() {
			return {
				host:host('imgUrl'),
				headImgs:[],
				mapContext:null,
				show:false,
				plantBase:[[]],
				massif:{},
				baseInfo:{},
				baseIndex:"",
				stockList:[],
			}
		},
		computed:{
			isAdmin(){
				return this.$store.getters.userInfo.roleCode=='companyAdmin'
			},
			isEmpty(){
				if(!this.baseIndex)return (this.baseInfo.farmWork||[]).length+(this.baseInfo.farmingInput||[]).length<=0
				else if(this.baseIndex=='record')return (this.baseInfo.farmWork||[]).length<=0
				else return (this.baseInfo.farmingInput||[]).length<=0
			},
		},
		watch:{
			"$store.state.baseInfo.id"(n){
				this.getMassif()
				this.getBaseInfo()
				this.getStock()
			}
		},
		onLoad() {
			// uni.setTabBarItem({
			// 	index:0,
			// 	pagePath:"/pages/home/rePassword"
			// })
			this.getHeadImg()
			if(this.isAdmin){
				this.getPlantBase()
			}else{
				this.getBaseName(this.$store.getters['userInfo'].plantBaseInfoId)
			}
			this.$provise.on("updateMassif", this.getMassif)
			this.$provise.on("updateStock", this.getStock)
		},
		methods: {
			async getHeadImg(){
				var res=await request("/base/api/plantCompany/queryCompanyPicById")
				if(res.statu){
					this.headImgs=res.data
				}
			},
			//获取地块信息
			async getMassif(){
				if(this.$store.state.baseInfo.id){
					var res=await request("/api/plantIndex/queryPlot",{
						params:{plantBaseId: this.$store.state.baseInfo.id}
					})
					if(res.statu){
						this.massif=res.data
					}else{
						uni.showModal({
							title:"提示",
							content:res.msg||"获取地块信息失败！",
							showCancel:false,
						})
					}
				}
			},
			//获取基地列表
			async getPlantBase(){
				var res=await request("/api/plantPlot/getAllPlantBaseInfo",{
					params:{companyId:this.$store.getters.userInfo.companyId}
				})
				if(res.statu){
					this.plantBase=[res.data]
					this.$store.commit("setBaseId", {id:res.data[0].id,name:res.data[0].baseName})
				}else{
					uni.showModal({
						title:"提示",
						content:res.msg||"获取基地列表失败！",
						showCancel:false,
					})
				}
			},
			//获取基地名称
			async getBaseName(plantBaseInfoId){
				var res=await request("/api/purchase/purchaseUserShow",{
					params:{plantBaseInfoId}
				})
				if(res.statu){
					this.$store.commit("setBaseId", {id:plantBaseInfoId,name:res.data.baseName})
				}else{
					uni.showModal({
						title:"提示",
						content:res.msg||"获取基地名称失败！",
						showCancel:false,
					})
				}
			},
			async getBaseInfo(){
				if(this.$store.state.baseInfo.id){
					var res=await request("/api/plantIndex/queryFarmWorkAndInput",{
						params:{plantBaseId: this.$store.state.baseInfo.id}
					})
					if(res.statu){
						this.baseInfo=res.data
					}else{
						uni.showModal({
							title:"提示",
							content:res.msg||"获取基地管理信息失败！",
							showCancel:false,
						})
					}
				}
			},
			// 获取仓库
			async getStock(){
				if(this.$store.state.baseInfo.id){
					var res=await request("/api/plantIndex/queryWarehouse",{
						params:{baseId: this.$store.state.baseInfo.id}
					})
					if(res.statu){
						this.stockList=res.data
					}else{
						uni.showModal({
							title:"提示",
							content:res.msg||"获取仓库信息失败！",
							showCancel:false,
						})
					}
				}
			},
		},
		onUnload(){
			this.$provise.off("updateMassif")
			this.$provise.off("updateStock")
		},
	}
</script>
