manage_mobile/pages/massif/mana/index.vue

<style lang="scss">
	.container{
		height: 100%;
		background:#F6F6F6;
		&>map{
			flex-shrink: 0;
			height:348rpx;
			width:100%;
			margin-bottom:-9rpx;
		}
		&>.u-tabs{
			flex-shrink: 0;
			background:#fff;
			box-shadow: 0 6rpx 12rpx 2rpx rgba(0,0,0,0.1);
		}
		swiper{
			flex-grow: 1;
			height:1rpx;
		}
	}
</style>
<template>
	<view class="container flex">
		<map id="amap"/>

		<u-tabs :list="tabs" :current="tabIndex" activeStyle="color:#10C176;" lineColor="#10C176" lineWidth="50" :scrollable="false" @change="plantId='';tabIndex=$event.index"/>

		<swiper :current="tabIndex" @change="tabIndex=$event.detail.current">
			<swiper-item>
				<plant-plan :plotId="plotId" @trigger="$refs.recovery.reSearch($event.plantId);tabIndex=$event.tabIndex"/>
			</swiper-item>
			<swiper-item>
				<farmRecord :plotId="plotId"/>
			</swiper-item>
			<swiper-item>
				<recovery :plotId="plotId" ref="recovery"/>
			</swiper-item>
		</swiper>
	</view>
</template>
<script>
import plantPlan from './plantPlan.vue'
import farmRecord from './farmRecord.vue'
import recovery from './recovery.vue'
export default {
	components:{plantPlan,farmRecord,recovery},
	data(){
		return{
			tabIndex:0,
			tabs:[
				{name:"种植计划",},
				{name:"农事记录",},
				{name:"采收记录",},
			],
			plotId:"",
		}
	},
	onLoad(options){
		this.plotId=options.id
	},
	onReady(){
		/* #ifdef APP-PLUS */
			var a=uni.createMapContext("amap",this)
			
			var maps=a.$getAppMap()
			maps.setMapType(plus.maps.MapType.MAPTYPE_SATELLITE)
			maps.onclick=(e)=>{
				console.log(e,'-------maps--click---------')
			}
			var polygon=new plus.maps.Polygon([
				new plus.maps.Point(116.39524,39.925301),
				new plus.maps.Point(116.400444,39.925285),
				new plus.maps.Point(116.400558,39.923282),
				new plus.maps.Point(116.395502,39.923082),
			])
			polygon.setLineWidth(2)
			polygon.setStrokeColor("#10C176")
			polygon.setFillColor("#10C176")
			polygon.setFillOpacity(0.3)
			maps.addOverlay(polygon)
			
			var marker=new plus.maps.Marker(new plus.maps.Point(116.396137,39.924055));
			marker.setIcon("/static/tab_home.png");
			marker.bringToTop()
			marker.setDraggable(true)
			maps.addOverlay(marker);
		/* #endif */
	},
	methods:{
		
	}
}
</script>