138 lines
2.3 KiB
Vue
138 lines
2.3 KiB
Vue
|
<template>
|
||
|
<view class="cont">
|
||
|
|
||
|
<view class="card">
|
||
|
<view class="tit">
|
||
|
<view class="">
|
||
|
1号土地
|
||
|
</view>
|
||
|
<view class="">
|
||
|
溯源码: 12302
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="card-li">
|
||
|
<view class="">
|
||
|
当前种植: 土豆
|
||
|
</view>
|
||
|
<view class="">
|
||
|
种植品牌: 的划分等级
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="card-li">
|
||
|
<view class="">
|
||
|
土地面积: 20亩
|
||
|
</view>
|
||
|
<view class="">
|
||
|
种子品牌: 的划分等级
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="card-li">
|
||
|
<view class="">
|
||
|
播种时间: 2020.12.01
|
||
|
</view>
|
||
|
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="operate">
|
||
|
<view class="tit">
|
||
|
操作选择
|
||
|
</view>
|
||
|
<view class="card">
|
||
|
<view class="operate-li">
|
||
|
胶水
|
||
|
</view>
|
||
|
<view class="operate-li">
|
||
|
胶水
|
||
|
</view>
|
||
|
<view class="operate-li">
|
||
|
胶水
|
||
|
</view>
|
||
|
<view class="operate-li">
|
||
|
胶水dassdd
|
||
|
</view>
|
||
|
<view class="operate-li">
|
||
|
胶水
|
||
|
</view>
|
||
|
<view class="operate-li">
|
||
|
胶水
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
|
||
|
</view>
|
||
|
<view class="ripe-btn">
|
||
|
完成今日操作
|
||
|
</view>
|
||
|
</template>
|
||
|
|
||
|
<script setup>
|
||
|
import {
|
||
|
ref,
|
||
|
reactive
|
||
|
} from "vue"
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss" scoped>
|
||
|
.cont {
|
||
|
padding-top: 30rpx;
|
||
|
background-color: #F4F4F4;
|
||
|
min-height: 100vh;
|
||
|
}
|
||
|
|
||
|
.card {
|
||
|
.tit {
|
||
|
display: flex;
|
||
|
justify-content: space-between;
|
||
|
padding-bottom: 20rpx;
|
||
|
border-bottom: 1px solid #EBF1EF;
|
||
|
}
|
||
|
|
||
|
.card-li {
|
||
|
margin-top: 20rpx;
|
||
|
display: flex;
|
||
|
justify-content: space-between;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.operate {
|
||
|
width: 693.93rpx;
|
||
|
margin: auto;
|
||
|
|
||
|
.tit {
|
||
|
margin: 20rpx 0;
|
||
|
}
|
||
|
|
||
|
.card {
|
||
|
display: flex;
|
||
|
flex-wrap: wrap;
|
||
|
justify-content: space-between;
|
||
|
|
||
|
.operate-li {
|
||
|
font-size: 29.79rpx;
|
||
|
padding: 0 60rpx;
|
||
|
background-color: #F4F4F4;
|
||
|
margin-bottom: 28rpx;
|
||
|
height: 63.08rpx;
|
||
|
line-height: 63rpx;
|
||
|
border-radius: 31.54rpx 31.54rpx 31.54rpx 31.54rpx;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.ripe-btn {
|
||
|
position: fixed;
|
||
|
bottom: 50rpx;
|
||
|
left: 50%;
|
||
|
transform: translateX(-50%);
|
||
|
width: 588.79rpx;
|
||
|
height: 84.11rpx;
|
||
|
background-color: #00A15E;
|
||
|
color: white;
|
||
|
display: flex;
|
||
|
justify-content: center;
|
||
|
align-items: center;
|
||
|
margin: 0 auto;
|
||
|
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
|
||
|
background: linear-gradient(to right, #00A15E, #4CC593);
|
||
|
}
|
||
|
</style>
|