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.

156 lines
3.6 KiB

2 years ago
<style lang="scss">
2 years ago
.container{
2 years ago
height: 100%;
2 years ago
background:#F6F6F6;
&>map{
2 years ago
flex-shrink: 0;
2 years ago
height:348rpx;
width:100%;
2 years ago
margin-bottom:-9rpx;
2 years ago
}
&>.u-tabs{
2 years ago
flex-shrink: 0;
2 years ago
background:#fff;
box-shadow: 0 6rpx 12rpx 2rpx rgba(0,0,0,0.1);
}
2 years ago
swiper{
flex-grow: 1;
height:1rpx;
}
2 years ago
}
</style>
<template>
2 years ago
<view class="container flex">
2 years ago
<map id="amap"/>
2 years ago
2 years ago
<u-tabs :list="tabs" :current="tabIndex" activeStyle="color:#10C176;" lineColor="#10C176" lineWidth="50" :scrollable="false" @change="plantId='';tabIndex=$event.index"/>
2 years ago
2 years ago
<swiper :current="tabIndex" @change="tabIndex=$event.detail.current">
<swiper-item>
<plant-plan
:plotId="plotId"
@trigger="plantId=$event"
@farm="farm_plantId=$event"/>
2 years ago
</swiper-item>
<swiper-item>
<farmRecord :plantId="farm_plantId" :plotId="plotId" ref="farmRecord"/>
2 years ago
</swiper-item>
<swiper-item>
<recovery :plotId="plotId" :plantId="plantId" ref="recovery" @trigger="recoveryId=$event"/>
2 years ago
</swiper-item>
<swiper-item>
<transactions :recoveryId="recoveryId" :plotId="plotId" ref="transactions"/>
</swiper-item>
2 years ago
</swiper>
2 years ago
</view>
</template>
<script>
import plantPlan from './plantPlan.vue'
import farmRecord from './farmRecord.vue'
import recovery from './recovery.vue'
import transactions from './transactions.vue'
import request from '@/common/request.js'
import {computeArea} from '@/common/utils'
2 years ago
export default {
components:{plantPlan,farmRecord,recovery,transactions},
2 years ago
data(){
return{
tabIndex:0,
tabs:[
{name:"种植计划"},
{name:"农事操作"},
{name:"采收记录"},
{name:"交易记录"},
],
2 years ago
plotId:"",
plantId:"",
farm_plantId:"",
recoveryId:"",
maps:null,
2 years ago
}
},
watch:{
plantId(n){
this.$nextTick(()=>{
this.$refs.recovery.reSearch()
})
if(n)this.tabIndex=2;
},
farm_plantId(n){
this.$nextTick(()=>{
this.$refs.farmRecord.reSearch()
})
if(n)this.tabIndex=1;
},
recoveryId(n){
this.$nextTick(()=>{
this.$refs.transactions.reSearch()
})
if(n)this.tabIndex=3
},
tabIndex(n,o){
if(n!=2)this.plantId="";
if(n!=1)this.farm_plantId="";
if(n!=3)this.recoveryId="";
}
},
onLoad(options){
2 years ago
this.plotId=options.id
},
async onReady(){
2 years ago
/* #ifdef APP-PLUS */
var amap=uni.createMapContext("amap",this)
var points=await this.getDetail()
2 years ago
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)
}
})
2 years ago
}
2 years ago
/* #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[]
}
},
2 years ago
}
2 years ago
}
</script>