TraceabilityAPP/pages/index/massif.vue

120 lines
2.3 KiB
Vue

<template>
<view class="">
<view class="content">
<view class="" style="height: 30rpx;">
</view>
<view class="serch">
<u-search bgColor="white" :show-action="false" placeholder="搜索你的土地信息" v-model="keyword"
shape="round"></u-search>
</view>
<view class="card" v-for="(item,index) in [1,1,1]" :key="index" @click="navgo('/pages/landDetail/index')">
<view class="tit card-li">
<view class="">
土地名称
</view>
<view class="" style="color: #00A15E;">
已种植
</view>
<view class="" style="color: #00A15E;">
未种植
</view>
</view>
<view class="card-li">
<view class="">
面积: 20亩
</view>
</view>
<view class="card-li tit">
<view class="" style="font-weight: normal;">
农作物: 洋芋
</view>
</view>
</view>
<view style="height: 170rpx;">
</view>
</view>
</view>
</template>
<script setup>
import {
reactive
} from "vue"
const props = defineProps({
userInfo: Object
})
// 获取位置
const getPositionFn = () => {
uni.getLocation({
type: 'gcj02',
geocode: true,
isHighAccuracy: true,
success: function(res) {
uni.request({
url: `https://restapi.amap.com/v3/geocode/regeo?output=JSON&location=${res.longitude},${res.latitude}&key=b0c21bc6b220aa882bad8ffb6bce8829&radius=1000&extensions=all`,
success: (res) => {
console.log(res)
}
})
}
});
}
const userInfo = reactive(props.userInfo)
const navgo = (url) => {
uni.navigateTo({
url
})
}
</script>
<style lang="scss">
.serch {
width: 695rpx;
margin: 0 auto;
margin-bottom: 20rpx;
}
.content {
min-height: 100vh;
position: relative;
// padding: 0 20rpx;
// padding-top: 50rpx;
background-color: #EAF2EF;
padding: 0;
.border-bgc {
height: 200rpx;
background-color: #34D190;
border-radius: 0 0 40rpx 40rpx;
position: absolute;
width: 750rpx;
}
.card {
position: relative;
width: 693.93rpx;
margin: auto;
background-color: #fff;
box-sizing: border-box;
border-radius: 21.03rpx 21.03rpx 21.03rpx 21.03rpx;
margin-bottom: 40rpx;
.tit {
display: flex;
font-size: 33.29rpx;
font-weight: bold;
justify-content: space-between;
}
}
}
</style>