You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
119 lines
2.9 KiB
119 lines
2.9 KiB
<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'
|
|
import request from '@/common/request.js'
|
|
import {computeArea} from '@/common/utils'
|
|
export default {
|
|
components:{plantPlan,farmRecord,recovery},
|
|
data(){
|
|
return{
|
|
tabIndex:0,
|
|
tabs:[
|
|
{name:"种植计划",},
|
|
{name:"农事记录",},
|
|
{name:"采收记录",},
|
|
],
|
|
plotId:"",
|
|
|
|
maps:null,
|
|
}
|
|
},
|
|
onLoad(options){
|
|
this.plotId=options.id
|
|
},
|
|
async onReady(){
|
|
/* #ifdef APP-PLUS */
|
|
var amap=uni.createMapContext("amap",this)
|
|
var points=await this.getDetail()
|
|
|
|
this.maps=amap.$getAppMap()
|
|
|
|
this.maps.setMapType(plus.maps.MapType.MAPTYPE_SATELLITE)
|
|
if(points.length>0){
|
|
var bound=computeArea(points)
|
|
this.maps.centerAndZoom(new plus.maps.Point(bound.center.longitude, bound.center.latitude),10)
|
|
|
|
var polygon=new plus.maps.Polygon( points.map(v=>new plus.maps.Point(v.longitude, v.latitude)) )
|
|
polygon.setLineWidth(2)
|
|
polygon.setStrokeColor("#10C176")
|
|
polygon.setFillColor("#10C176")
|
|
polygon.setFillOpacity(0.3)
|
|
this.maps.addOverlay(polygon)
|
|
}else{
|
|
this.maps.getUserLocation((state,point)=>{
|
|
if(state==0){
|
|
this.maps.centerAndZoom(new plus.maps.Point(point.longitude, point.latitude),10)
|
|
}else{
|
|
this.maps.centerAndZoom(new plus.maps.Point(102.712251,25.040609),10)
|
|
}
|
|
})
|
|
}
|
|
|
|
/* #endif */
|
|
},
|
|
methods:{
|
|
async getDetail(){
|
|
var res=await request('/api/plantPlot/queryById',{
|
|
params:{id:this.plotId}
|
|
})
|
|
if(res.statu){
|
|
return (res.data.longitude||'').split("|").map(v=>{
|
|
var point=v.split(",")
|
|
if(point.length==2){
|
|
return {longitude:point[0],latitude:point[1]}
|
|
}
|
|
return null
|
|
}).filter(v=>v)
|
|
}else{
|
|
uni.showModal({
|
|
title:"提示",
|
|
content:res.msg||"获取地块详情失败！",
|
|
showCancel:false,
|
|
})
|
|
return[]
|
|
}
|
|
},
|
|
}
|
|
}
|
|
</script>
|