3 changed files with 216 additions and 1 deletions
@ -0,0 +1,186 @@ |
|||||
|
<style lang="scss"> |
||||
|
.container{ |
||||
|
background:#F6F6F6; |
||||
|
height:100%; |
||||
|
|
||||
|
scroll-view{ |
||||
|
flex-grow: 1; |
||||
|
height:1rpx; |
||||
|
border-bottom:1rpx solid transparent; |
||||
|
.card.item{ |
||||
|
display:flex; |
||||
|
margin-top:0; |
||||
|
&.PA-guanbi{ |
||||
|
position:relative; |
||||
|
background-image:linear-gradient(-135deg, #10C176 38rpx,transparent 38.3rpx); |
||||
|
&:before{ |
||||
|
position:absolute; |
||||
|
color:#fff; |
||||
|
top:0; |
||||
|
right:0; |
||||
|
} |
||||
|
} |
||||
|
&>.u-transition{ |
||||
|
flex-shrink: 0; |
||||
|
margin-right:24rpx; |
||||
|
} |
||||
|
&>.info{ |
||||
|
flex-grow: 1; |
||||
|
width:1rpx; |
||||
|
.title{ |
||||
|
display:flex; |
||||
|
align-items: center; |
||||
|
text{ |
||||
|
font-family: system-ui; |
||||
|
font-size:28rpx; |
||||
|
&:first-child{ |
||||
|
flex-grow: 1; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.code,.area{ |
||||
|
font-family: system-ui; |
||||
|
color:#999; |
||||
|
font-size:24rpx; |
||||
|
margin-top:14rpx; |
||||
|
} |
||||
|
.data{ |
||||
|
margin-top:16rpx; |
||||
|
display:flex; |
||||
|
align-items: center; |
||||
|
text{ |
||||
|
font-family: system-ui; |
||||
|
&:first-child{ |
||||
|
color:#10C176; |
||||
|
font-size:32rpx; |
||||
|
font-weight: bold; |
||||
|
&:after{ |
||||
|
content:"亩"; |
||||
|
} |
||||
|
} |
||||
|
&:nth-child(2){ |
||||
|
color:#F8CB36; |
||||
|
font-size:24rpx; |
||||
|
margin-left:16rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.btns{ |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
border-top:2rpx solid #D8D8D8; |
||||
|
margin:20rpx 0 -30rpx 0; |
||||
|
text{ |
||||
|
font-family: system-ui; |
||||
|
color:#999; |
||||
|
font-size:24rpx; |
||||
|
padding:16rpx 0 30rpx 0; |
||||
|
&:before{ |
||||
|
color:#10C176; |
||||
|
margin-right:8rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
|
<template> |
||||
|
<view class="container flex"> |
||||
|
<d-navbar style="--bg:#10C176;--c:#fff;" isBack text="地块管理"> |
||||
|
<button slot="right" class="cu-btn round" @click="submit">提交</button> |
||||
|
</d-navbar> |
||||
|
|
||||
|
<d-search v-model="searchVal.search" @search="search('pageOne')" placeholder="输入地块名称或编号搜索"/> |
||||
|
|
||||
|
<scroll-view scroll-y @scrolltolower="search"> |
||||
|
<view class="card item" :class="{'PA-guanbi':!!select.find(i=>i.id==v.id)}" v-for="(v,k) in list" :key="k" @click="selectPlot(v)"> |
||||
|
<u-image width="220rpx" height="220rpx" radius="16rpx" :src="`${host}/${v.image}`" mode="aspectFill"> |
||||
|
<text slot="error" style="font-size:65rpx" class="plant-xiaopangchetupianjiazaishibai"/> |
||||
|
</u-image> |
||||
|
<view class="info"> |
||||
|
<view class="title"><text class="over">{{v.plotName}}</text></view> |
||||
|
<view class="code">编号：{{v.plotNumber}}</view> |
||||
|
<view class="area">地块面积：{{v.realityArea}}亩</view> |
||||
|
<view class="data"> |
||||
|
<text>{{v.usedArea}}</text> <text>(在用面积)</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<u-empty v-if="list.length==0" text="未查询到相关信息" width="70%" icon="/static/noData.png"/> |
||||
|
<view style="border:0.5rpx solid transparent"/> |
||||
|
</scroll-view> |
||||
|
</view> |
||||
|
</template> |
||||
|
<script> |
||||
|
import request,{host} from '@/common/request' |
||||
|
export default{ |
||||
|
data(){ |
||||
|
return{ |
||||
|
host:host('imgUrl'), |
||||
|
searchVal:{ |
||||
|
search:"", |
||||
|
pageNo:1, |
||||
|
pageSize:5, |
||||
|
}, |
||||
|
list:[], |
||||
|
select:[], |
||||
|
total:0, |
||||
|
eventChannel:null, |
||||
|
} |
||||
|
}, |
||||
|
onLoad(){ |
||||
|
this.eventChannel=this.getOpenerEventChannel() |
||||
|
this.eventChannel.on("list", e=>this.select=e) |
||||
|
this.search() |
||||
|
}, |
||||
|
methods:{ |
||||
|
async search(type){ |
||||
|
if(type=='pageOne'){ |
||||
|
this.searchVal.pageNo=1 |
||||
|
this.list=[] |
||||
|
this.total=0 |
||||
|
} |
||||
|
if(this.total==0 || this.list.length<this.total){ |
||||
|
var res=await request("/api/plantPlot/list",{ |
||||
|
params: { |
||||
|
...this.searchVal, |
||||
|
companyId:this.$store.getters.userInfo.companyId, |
||||
|
plantBaseInfoId:this.$store.state.baseInfo.id, |
||||
|
} |
||||
|
}) |
||||
|
if(res.statu){ |
||||
|
this.list=this.list.concat(res.data.records) |
||||
|
this.total=res.data.total |
||||
|
this.searchVal.pageNo++ |
||||
|
if(this.list.length==this.total)uni.showToast({title:"加载完成！",icon:"none"}) |
||||
|
}else{ |
||||
|
uni.showModal({ |
||||
|
title:"提示", |
||||
|
content:res.msg||"获取地块列表失败！", |
||||
|
showCancel:false, |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
selectPlot(e){ |
||||
|
if(this.select.find(v=>v.id==e.id)){ |
||||
|
this.select=this.select.filter(v=>v.id!=e.id) |
||||
|
}else{ |
||||
|
this.select.push(e) |
||||
|
} |
||||
|
}, |
||||
|
submit(){ |
||||
|
if(this.select.length>0){ |
||||
|
this.eventChannel.emit("update", this.select) |
||||
|
uni.navigateBack() |
||||
|
}else{ |
||||
|
uni.showToast({title:"请选择地块！",icon:"none"}) |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
} |
||||
|
</script> |
||||
Loading…
Reference in new issue