mkm
/
yanzhiAPP
Template
2
0
Fork 0
This commit is contained in:
zmj 2023-10-21 18:02:06 +08:00
parent 65785be284
commit cb92895547
15 changed files with 1967 additions and 11 deletions

View File

@ -13,6 +13,7 @@
<style scoped lang="scss">
.content {
background-color: #F4F4F4;
padding: 20rpx;
min-height: 100vh;
}

172
pages/allPlant/index.vue Normal file
View File

@ -0,0 +1,172 @@
<template>
<view class="content">
<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="">
预计产量: 20
</view>
<view class="">
已出售: 的划分等级
</view>
</view>
<view class="card-li">
<view class="">
播种时间: 2020.12.01
</view>
</view>
</view>
<view class="status">
<view class="" style="margin-bottom: 30rpx;">
今日种植状态
</view>
<view class="head-img">
<view class="">
<u--image src="/static/img/GJ.jpg" width="693.93rpx" height=" 394.28rpx" alt=""></u--image>
</view>
<!-- <u--image :showLoading="true" :src="src" width="80px" height="80px" @click="click"></u--image> -->
<view class="poisition">
更新时间: 2023-11-16
</view>
</view>
</view>
<view class="status">
<view class="" style="margin-bottom: 30rpx;">
播种图片
</view>
<view class="head-img">
<view class="">
<u--image src="/static/img/GJ.jpg" width="693.93rpx" height=" 394.28rpx" alt=""></u--image>
</view>
<!-- <u--image :showLoading="true" :src="src" width="80px" height="80px" @click="click"></u--image> -->
<view class="poisition">
更新时间: 2023-11-16
</view>
</view>
</view>
<view class="status">
<view class="" style="margin-bottom: 30rpx;">
生长情况
</view>
<view class="head-img">
<view class="">
<u--image src="/static/img/GJ.jpg" width="693.93rpx" height=" 394.28rpx" alt=""></u--image>
</view>
<!-- <u--image :showLoading="true" :src="src" width="80px" height="80px" @click="click"></u--image> -->
<view class="poisition">
更新时间: 2023-11-16
</view>
</view>
<view class="head-img">
<view class="">
<u--image src="/static/img/GJ.jpg" width="693.93rpx" height=" 394.28rpx" alt=""></u--image>
</view>
<!-- <u--image :showLoading="true" :src="src" width="80px" height="80px" @click="click"></u--image> -->
<view class="poisition">
更新时间: 2023-11-16
</view>
</view>
</view>
<view class="up-btn">
上传新的种植情况
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
.content {
padding: 20rpx;
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;
}
}
.status {
margin-bottom: 40rpx;
}
.head-img {
border-radius: 21.03rpx 21.03rpx 21.03rpx 21.03rpx;
margin: 20rpx auto;
position: relative;
.poisition {
opacity: 0.7;
position: absolute;
width: 360.26rpx;
height: 71rpx;
background-color: #FFFFFF;
left: 20rpx;
bottom: 36rpx;
border-radius: 21.03rpx 21.03rpx 21.03rpx 21.03rpx;
display: flex;
align-items: center;
font-size: 29.79rpx;
padding-left: 20rpx;
}
}
}
.up-btn {
width: 371.5rpx;
height: 66.59rpx;
border: 1px solid #00A15E;
color: #00A15E;
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
text-align: center;
line-height: 66rpx;
margin: 40rpx auto;
}
</style>

View File

@ -4,7 +4,6 @@
<view class="">
<u--image src="/static/img/GJ.jpg" width="693.93rpx" height=" 394.28rpx" alt=""></u--image>
</view>
<!-- <u--image :showLoading="true" :src="src" width="80px" height="80px" @click="click"></u--image> -->
<view class="poisition">
<view style="display: flex;">
<u--image src="/static/img/dw.png" style="margin: 0 5rpx;" width="35.05rpx"
@ -18,13 +17,14 @@
<u--image :src="urlFn('sj')" style="margin: 0 5rpx;" width="28.04rpx" height="28.04rpx"></u--image>
<text>刷新时间:{{dateFn()}}</text>
</view>
<view class="">
<view class="" @click="navgo('/pages/allPlant/index')">
查看历史条件>
</view>
</view>
<view class="up-plant-btn">
上传新的种植情况
</view>
<view class="card">
<view class="tit">
<view class="">
@ -65,23 +65,23 @@
<view class="">
生长记录操作
</view>
<view class="updata-btn">
<view class="updata-btn" @tap="navgo('/pages/growRecord/index')">
更新生长记录
</view>
</view>
<view class="card">
<view class="card" @tap="navgo('/pages/growRecord/index')">
<biaoge></biaoge>
</view>
</view>
<view class="data">
<view class="tit">
<view class="" style="display: flex;justify-content: space-between;font-size: 29.79rpx;">
<view class="">
土地监测数据
</view>
<view class="">
<view class="" @click="navgo('/pages/profile/index')">
查看全部检测记录>
</view>
</view>
@ -119,7 +119,7 @@
</view>
<view class="ripe-btn">
<view class="ripe-btn" @click="navgo('/pages/index/index')">
标记为成熟
</view>
@ -206,6 +206,11 @@
}, 500)
},
methods: {
navgo(url) {
uni.navigateTo({
url
})
},
dateFn() {
var today = new Date();

View File

@ -0,0 +1,151 @@
<template>
<view class="content">
<view class="card">
<view class="card-tit">
<view class="">
编号: 13254
</view>
<view class="" style="color: green;">
健康
</view>
</view>
<view class="card-cont">
<view class="card-l">
<view class="">
养殖品种: 黑山🐖
</view>
<view class="">
养殖类型: 黑山🐖
</view>
<view class="">
年龄: 黑山🐖
</view>
<view class="">
体重: 黑山🐖
</view>
</view>
<view class="card-r">
<u--image src="/static/img/GJ.jpg" width="353.97rpx" height="210.28rpx" alt=""></u--image>
</view>
</view>
</view>
<view class="card">
<view class="card-li">
<view class="card-li-tit">
养殖品种
</view>
<view class="">
<up-input placeholder="请输入品种" border="surround" v-model="value" @change="change"></up-input>
</view>
</view>
<view class="card-li">
<view class="card-li-tit">
年龄
</view>
<view class="">
<up-input placeholder="请输入品种" border="surround" v-model="value" @change="change"></up-input>
</view>
</view>
<view class="card-li">
<view class="card-li-tit">
养殖类型
</view>
<view class="">
<up-input placeholder="请输入品种" border="surround" v-model="value" @change="change"></up-input>
</view>
</view>
<view class="card-li">
<view class="card-li-tit">
状态
</view>
<view class="">
<up-input placeholder="请输入品种" border="surround" v-model="value" @change="change"></up-input>
</view>
</view>
<view class="card-li">
<view class="card-li-tit">
体重
</view>
<view class="">
<up-input placeholder="请输入品种" border="surround" v-model="value" @change="change"></up-input>
</view>
</view>
<view class="uplode">
</view>
</view>
<view class="next-btn">
下一个
</view>
<view class="ripe-btn">
完成添加
</view>
</view>
</template>
<script>
</script>
<style lang="scss">
.card-tit {
display: flex;
justify-content: space-between;
border-bottom: 1px solid #F4F4F4;
padding-bottom: 20rpx;
margin-bottom: 20rpx;
}
.card-cont {
display: flex;
justify-content: space-between;
.card-l {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.card-r {
overflow: hidden;
border-radius: 21.03rpx 21.03rpx 21.03rpx 21.03rpx;
width: 353.97rpx;
height: 210.28rpx;
}
}
.card-li-tit {
margin-bottom: 20rpx;
}
.uplode {
height: 350.47rpx;
background-color: red;
}
.next-btn {
width: 196.26rpx;
height: 66.59rpx;
border: 1px solid #00A15E;
color: #00A15E;
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
margin: 0 auto;
text-align: center;
line-height: 66rpx;
}
.ripe-btn {
width: 588.79rpx;
height: 84.11rpx;
background-color: #00A15E;
color: white;
display: flex;
justify-content: center;
align-items: center;
margin: 85rpx auto;
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
background: linear-gradient(to right, #00A15E, #4CC593);
}
</style>

78
pages/feedIng/allFeed.vue Normal file
View File

@ -0,0 +1,78 @@
<template>
<view class="content">
<view class="card">
<view class="tit">
<view class="">
编号: 52656
</view>
<view class="">
溯源码: 52656
</view>
</view>
<view class="card-li">
<view class="">
养殖品种: 土豆
</view>
<view class="">
年龄: 的划分等级
</view>
</view>
<view class="card-li">
<view class="">
养殖类型: 20
</view>
<view class="">
体重: 45kg
</view>
</view>
</view>
<view class="card">
<view class="card-li">
<view class="" style="display: flex;align-items: center;">
<u--image src="/static/img/GG.png" style="margin: 0 21rpx;" width="80rpx" height="80rpx"></u--image>
当前养殖状态
</view>
<view class="" style="color: green;">
健康
</view>
</view>
</view>
<view class="">
历史养殖状态
<view class="table">
</view>
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
.card {
margin-bottom: 20rpx;
.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;
align-items: center;
}
}
.table {
margin-top: 20rpx;
height: 500rpx;
background-color: red;
}
</style>

View File

@ -0,0 +1,79 @@
<template>
<view class="content">
<view class="card">
<view class="tit">
<view class="">
农户名称: 1号土地
</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="">
养殖种类: 20
</view>
<view class="">
母猪: 的划分等级
</view>
</view>
<view class="card-li">
<view class="">
具体种类: 20
</view>
<view class="">
幼崽: 的划分等级
</view>
</view>
</view>
<view class="">
饲养记录
</view>
<view class="table">
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
.card {
margin-bottom: 20rpx;
.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;
}
}
.table {
margin-top: 20rpx;
height: 500rpx;
background-color: red;
}
</style>

View File

@ -0,0 +1,230 @@
<template>
<view class="content">
<view class="card">
<view class="tit">
<view class="">
农户名称: 1号土地
</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="">
养殖种类: 20
</view>
<view class="">
母猪: 的划分等级
</view>
</view>
<view class="card-li">
<view class="">
具体种类: 20
</view>
<view class="">
幼崽: 的划分等级
</view>
</view>
</view>
<view class="serch">
<u-search bgColor='white' height='63.08rpx' :show-action="false" actionText="搜索"
:animation="true"></u-search>
<view class="serch-btn">
搜索
</view>
</view>
<view class="title">
<view class="">
编号: 13645
</view>
<view class="">
查看养殖详情>
</view>
</view>
<view class="card">
<view class="card-li">
<view class="">
养殖类型: 母猪
</view>
<view class="">
年龄: 2
</view>
</view>
<view class="card-li" style="align-items: center;">
<view class="">
状态: 母猪
</view>
<view class="" style="display: flex;align-items: center;">
体重: <up-input style="height: 49.07rpx;width: 215.54rpx;margin-left: 20rpx;" placeholder="请输入内容"
border="surround" v-model="value" @change="change"></up-input>
</view>
</view>
<view class="head-img">
<view class="">
<u--image src="/static/img/GJ.jpg" width="637.85rpx" height=" 394.28rpx" alt=""></u--image>
</view>
<view class="poisition">
<view style="margin-left: 20rpx;">
分水岭大南山北326米
</view>
</view>
</view>
<view class="up-plant-btn">
上传新的种植情况
</view>
</view>
<view class="title">
<view class="">
饲养记录
</view>
<view class="updata-btn">
更新生长记录
</view>
</view>
<view class="" style="height: 500rpx;background-color: red;">
</view>
<view class="ripe-btn">
标记状态为出栏
</view>
</view>
</template>
<script setup>
import {
ref,
reactive
} from "vue"
const value = ref("")
</script>
<style lang="scss" scoped>
.card {
margin-bottom: 20rpx;
.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;
}
}
.title {
display: flex;
justify-content: space-between;
margin-bottom: 20rpx;
.updata-btn {
width: 192.76rpx;
height: 57.83rpx;
border: 1px solid #00A15E;
color: #00A15E;
display: flex;
justify-content: center;
align-items: center;
border-radius: 31.54rpx 31.54rpx 31.54rpx 31.54rpx;
font-size: 26.29rpx;
}
}
.serch {
position: relative;
margin-bottom: 20rpx;
.serch-btn {
color: white;
width: 115.65rpx;
height: 63.08rpx;
background-color: #1BAB6F;
text-align: center;
line-height: 63.08rpx;
border-radius: 50rpx;
position: absolute;
top: 0;
right: 0;
}
}
.head-img {
border-radius: 21.03rpx 21.03rpx 21.03rpx 21.03rpx;
margin: 0 auto;
position: relative;
.poisition {
opacity: 0.7;
position: absolute;
width: 380.26rpx;
height: 71rpx;
background-color: #FFFFFF;
left: 20rpx;
bottom: 36rpx;
border-radius: 21.03rpx 21.03rpx 21.03rpx 21.03rpx;
display: flex;
align-items: center;
font-size: 29.79rpx;
.dw-cls {
margin: 0 5rpx;
}
}
}
.up-plant-btn {
width: 371.5rpx;
height: 66.59rpx;
color: #00A15E;
margin: 40rpx auto;
border: 1px solid #00A15E;
font-weight: bold;
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
display: flex;
align-items: center;
justify-content: center;
}
.ripe-btn {
width: 588.79rpx;
height: 84.11rpx;
background-color: #00A15E;
color: white;
display: flex;
justify-content: center;
align-items: center;
margin: 85rpx auto;
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
background: linear-gradient(to right, #00A15E, #4CC593);
}
</style>

143
pages/feedIng/feedList.vue Normal file
View File

@ -0,0 +1,143 @@
<template>
<view class="content">
<view class="card">
<view class="tit">
<view class="">
农户名称: 1号土地
</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="">
养殖种类: 20
</view>
<view class="">
母猪: 的划分等级
</view>
</view>
<view class="card-li">
<view class="">
具体种类: 20
</view>
<view class="">
幼崽: 的划分等级
</view>
</view>
</view>
<view class="serch">
<u-search bgColor='white' height='63.08rpx' :show-action="false" actionText="搜索"
:animation="true"></u-search>
<view class="serch-btn">
搜索
</view>
</view>
<view class="card" v-for="item in [1,1,1,1,1]">
<view class="tit">
<view class="">
编号: 12378
</view>
<view class="" style="color: #00A15E;" v-if='true'>
健康
</view>
<view class="" style="color: #FFD736;" v-if="false">
怀孕中
</view>
<view class="" style="color: #3274F9;" v-if="false">
可出栏
</view>
<view class="" style="color: #F84221;" v-if="false">
生殖隔离中
</view>
</view>
<view class="card-li">
<view class="">
养殖类型: 土豆
</view>
<view class="">
年龄: 7
</view>
<view class="">
体重: 70kg
</view>
</view>
</view>
<view class="" style="text-align: center;font-size: 29.79rpx;">
展开更多>
</view>
<view class="ripe-btn">
添加新动物
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
.card {
margin-bottom: 20rpx;
.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;
}
}
.serch {
position: relative;
margin-bottom: 20rpx;
.serch-btn {
color: white;
width: 115.65rpx;
height: 63.08rpx;
background-color: #1BAB6F;
text-align: center;
line-height: 63.08rpx;
border-radius: 50rpx;
position: absolute;
top: 0;
right: 0;
}
}
.ripe-btn {
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);
margin-top: 64rpx;
}
</style>

View File

@ -0,0 +1,100 @@
<template>
<view class="content">
<view class="card">
<view class="tit">
<view class="">
编号: 52656
</view>
<view class="">
溯源码: 52656
</view>
</view>
<view class="card-li">
<view class="">
养殖品种: 土豆
</view>
<view class="">
年龄: 的划分等级
</view>
</view>
<view class="card-li">
<view class="">
养殖类型: 20
</view>
<view class="">
体重: 45kg
</view>
</view>
</view>
<view class="card">
<view class="card-li">
<view class="" style="display: flex;align-items: center;">
<u--image src="/static/img/GG.png" style="margin: 0 21rpx;" width="80rpx" height="80rpx"></u--image>
当前养殖状态
</view>
<view class="" style="color: green;">
健康
</view>
</view>
</view>
<view class="">
<view class="">
今日养殖状态
</view>
<imgCard></imgCard>
<view class="">
养殖情况
</view>
<imgCard></imgCard>
<imgCard></imgCard>
</view>
<view class="up-plant-btn">
上传新的种植情况
</view>
</view>
</template>
<script setup>
import imgCard from "@/components/imgCard.vue"
</script>
<style lang="scss" scoped>
.card {
margin-bottom: 20rpx;
.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;
align-items: center;
}
}
.up-plant-btn {
width: 371.5rpx;
height: 66.59rpx;
color: #00A15E;
margin: 40rpx auto;
border: 1px solid #00A15E;
font-weight: bold;
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
display: flex;
align-items: center;
justify-content: center;
}
</style>

View File

@ -0,0 +1,250 @@
<template>
<view class="content">
<view class="card">
<view class="tit">
<view class="">
农户名称: 1号土地
</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="">
养殖种类: 20
</view>
<view class="">
母猪: 的划分等级
</view>
</view>
<view class="card-li">
<view class="">
具体种类: 20
</view>
<view class="">
幼崽: 的划分等级
</view>
</view>
</view>
<view class="">
<view style="margin-bottom: 20rpx;">
今日操作
</view>
<view class="card">
<view class="card-li">
<view class="">
喂食
</view>
<view class="" style="color: #00A15E;" @click="showPop=true">
+添加喂食记录
</view>
</view>
</view>
<view class="card">
<view class="card-li">
<view class="">
注射疫苗
</view>
<view class="" style="color: #00A15E;">
+添加喂食记录
</view>
</view>
</view>
</view>
<view style="margin-bottom: 20rpx;">
具体操作内容
</view>
<view class="card">
<view class="tit">
<view class="">
喂食
</view>
<view class="" style="display: flex;">
<view class="" style="margin-right: 40rpx;">
删除
</view>
<view class="" style="color: #00A15E;">
编辑
</view>
</view>
</view>
<view class="card-li">
<view class="">
饲料类型: 无机盐饲料
</view>
<view class="">
饲料品牌: 双胞胎
</view>
</view>
<view class="card-li">
<view class="">
喂食记录: 200kg
</view>
<view class="">
备注: 双胞胎
</view>
</view>
</view>
<view class="card">
<view class="tit">
<view class="">
疫苗注射对象
</view>
<view class="" style="display: flex;">
<view class="" style="margin-right: 40rpx;">
删除
</view>
<view class="" style="color: #00A15E;">
编辑
</view>
</view>
</view>
<view class="card-li">
<view class="">
疫苗名称: 无机盐饲料
</view>
<view class="">
疫苗品牌: 双胞胎
</view>
</view>
<view class="card-li">
<view class="">
操作人员: 200kg
</view>
<view class="">
注射数量: 双胞胎
</view>
</view>
<view class="">
疫苗条形码
<view class="code-img">
</view>
</view>
</view>
<view class="ripe-btn">
完成今日统计
</view>
<!-- 组件 -->
<view class="">
<u-popup :show="showPop" :round="10" :closeable='true' @close="showPop=false" @open="showPop=true">
<view class="pop-content">
<view class="pop-tit">
添加喂食记录
</view>
<view class="">
饲料类型
</view>
<view class="pop-li">
<up-input placeholder="请输入品种" border="surround" v-model="formData.value"
@change="change"></up-input>
</view>
<view class="">
饲料品牌
</view>
<view class="pop-li">
<up-input placeholder="请输入品种" border="surround" v-model="formData.value"
@change="change"></up-input>
</view>
<view class="pop-confirm" @tap="confirm">
确认
</view>
</view>
</u-popup>
</view>
</view>
</template>
<script setup>
import {
ref,
reactive
} from "vue"
const showPop = ref(false)
const formData = reactive({
value: ""
})
</script>
<style lang="scss" scoped>
.card {
margin-bottom: 20rpx;
.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;
}
}
.pop-content {
padding: 20rpx;
.pop-tit {
margin-bottom: 20rpx;
font-weight: bold;
}
.pop-li {
margin: 20rpx 0;
margin-bottom: 40rpx;
}
.pop-confirm {
width: 693.93rpx;
height: 84.11rpx;
background: linear-gradient(to right, #00A15E, #4CC593);
color: white;
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
text-align: center;
line-height: 84rpx;
margin-top: 70rpx;
}
}
.ripe-btn {
width: 588.79rpx;
height: 84.11rpx;
background-color: #00A15E;
color: white;
display: flex;
justify-content: center;
align-items: center;
margin: 85rpx auto;
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
background: linear-gradient(to right, #00A15E, #4CC593);
}
.code-img {
background-color: red;
height: 196.26rpx;
margin-top: 30rpx;
}
</style>

View File

@ -0,0 +1,153 @@
<template>
<view class="content">
<view class="title">
疫苗相关信息
</view>
<view class="card">
<view class="card-li">
<view class="card-li-tit">
疫苗名称
</view>
<view class="">
<up-input placeholder="请输入品种" border="surround" v-model="value" @change="change"></up-input>
</view>
</view>
<view class="card-li">
<view class="card-li-tit">
疫苗品牌
</view>
<view class="">
<up-input placeholder="请输入品种" border="surround" v-model="value" @change="change"></up-input>
</view>
</view>
<view class="card-li">
<view class="card-li-tit">
操作人员
</view>
<view class="">
<up-input placeholder="请输入品种" border="surround" v-model="value" @change="change"></up-input>
</view>
</view>
<view class="card-li">
<view class="card-li-tit">
疫苗条形码
</view>
<view class="code-img">
</view>
</view>
<view class="card-li">
<view class="card-li-tit">
注射对象
</view>
<view class="scan">
扫描动物耳标/脚标
</view>
</view>
</view>
<view style="margin-bottom: 20rpx;" v-for="item in [1,1,1,1,1]">
<u-swipe-action>
<u-swipe-action-item :options="options1" style="border-radius: 20rpx;">
<view class="" style="padding: 20rpx 30rpx;">
<view class="swipe-action-tit">
<view class="">
编号: 123456
</view>
<view class="" style="color: #00A15E;" v-if="true">
健康
</view>
<view class="" style="color: #FFD736;" v-if="0">
怀孕中
</view>
<view class="" style="color: #3274F9;" v-if="0">
可出栏
</view>
</view>
<view class="swipe-action-li">
<view class="">
养殖品种:黑山猪
</view>
<view class="">
年龄: 5
</view>
<view class="">
体重: 150kg
</view>
</view>
</view>
</u-swipe-action-item>
</u-swipe-action>
</view>
<view class="ripe-btn">
确认
</view>
</view>
</template>
<script setup>
import {
ref,
reactive
} from "vue"
const options1 = reactive([{
text: '删除'
}])
</script>
<style lang="scss" scoped>
.card-li-tit {
margin-bottom: 20rpx;
}
.title {
margin: 20rpx 0;
}
.code-img {
background-color: red;
height: 196.26rpx;
}
.scan {
// width: 623.83rpx;
height: 80.61rpx;
border: 2px solid #00A15E;
border-radius: 50rpx;
color: #00A15E;
text-align: center;
line-height: 80rpx;
}
.ripe-btn {
width: 588.79rpx;
height: 84.11rpx;
background-color: #00A15E;
color: white;
display: flex;
justify-content: center;
align-items: center;
margin: 85rpx auto;
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
background: linear-gradient(to right, #00A15E, #4CC593);
}
.swipe-action-tit {
display: flex;
justify-content: space-between;
border-bottom: 1px solid #F4F4F4;
padding-bottom: 20rpx;
margin-bottom: 20rpx;
}
.swipe-action-li {
display: flex;
justify-content: space-between;
// align-items: ;
}
</style>

View File

@ -33,12 +33,14 @@
</view>
</view>
<view class="operate">
<view class="tit">
操作选择
</view>
<view class="card">
<view class="operate-li">
<view class="operate-li" @click="showPop=true">
胶水
</view>
<view class="operate-li">
@ -58,11 +60,73 @@
</view>
</view>
</view>
<view class="fertilize">
<view class="card">
<view class="fertilize-tit">
<view class="">
施肥
</view>
<view class="fertilize-tit-r">
<view class="">
删除
</view>
<view style="margin-left: 40rpx;color: #00A15E;">
编辑
</view>
</view>
</view>
<view class="fertilize-li">
<view class="">
肥料类型: 地生上的飞机
</view>
<view class="">
肥料品牌: 地生上的
</view>
</view>
<view class="fertilize-li">
<view class="">
兑水浓度: 地生上的飞机
</view>
<view class="">
备注: 地生上的
</view>
</view>
</view>
</view>
</view>
<view class="ripe-btn">
完成今日操作
</view>
<!-- 组件 -->
<view class="">
<u-popup :show="showPop" :round="10" :closeable='true' @close="showPop=false" @open="showPop=true">
<view class="pop-content">
<view class="pop-tit">
添加肥料相关信息
</view>
<view class="">
肥料类型
</view>
<view class="pop-li">
<up-input placeholder="请输入品种" border="surround" v-model="formData.value"
@change="change"></up-input>
</view>
<view class="">
兑水浓度
</view>
<view class="pop-li">
<up-input placeholder="请输入品种" border="surround" v-model="formData.value"
@change="change"></up-input>
</view>
<view class="pop-confirm" @tap="confirm">
确认
</view>
</view>
</u-popup>
</view>
</template>
<script setup>
@ -70,6 +134,16 @@
ref,
reactive
} from "vue"
const showPop = ref(false)
const formData = reactive({
value: ""
})
const confirm = () => {
showPop.value = false
// var key of formData {
// }
}
</script>
<style lang="scss" scoped>
@ -135,4 +209,51 @@
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
background: linear-gradient(to right, #00A15E, #4CC593);
}
.fertilize {
.fertilize-tit {
display: flex;
// justify-self: center;
justify-content: space-between;
padding-bottom: 20rpx;
border-bottom: 1px solid #F4F4F4;
margin-bottom: 20rpx;
.fertilize-tit-r {
display: flex;
}
}
.fertilize-li {
display: flex;
justify-content: space-between;
margin-bottom: 20rpx;
}
}
.pop-content {
padding: 20rpx;
.pop-tit {
margin-bottom: 20rpx;
font-weight: bold;
}
.pop-li {
margin: 20rpx 0;
margin-bottom: 40rpx;
}
.pop-confirm {
width: 693.93rpx;
height: 84.11rpx;
background: linear-gradient(to right, #00A15E, #4CC593);
color: white;
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
text-align: center;
line-height: 84rpx;
margin-top: 70rpx;
}
}
</style>

View File

@ -7,7 +7,7 @@
<view class="" style="display: flex;">
<u--image src="/static/img/FH.png" width="50.82rpx" height="50.82rpx" alt=""></u--image>
<view class="scoll-list">
<view v-for="(item,index) in list" :key="index" class="scoll-list-li">
<view v-for="(item,index) in list" :key="index" :class="item.flag?'act':''" class="scoll-list-li">
{{item.tit}}
</view>
</view>
@ -21,10 +21,14 @@
</view>
</view>
<!-- 种植户首页 -->
<planting></planting>
<planting v-if='1'></planting>
<!-- 卖鱼的首页 -->
<fishing v-if='false'></fishing>
<!-- 养猪的 -->
<cultivation v-if="false"></cultivation>
</view>
</template>
@ -42,10 +46,12 @@
import {
onLoad
} from "@dcloudio/uni-app"
import cultivation from "@/components/index/cultivation.vue"
import planting from "@/components/index/planting.vue"
import fishing from "@/components/index/fishing.vue"
const list = reactive([{
tit: "土地种植管理"
tit: "土地种植管理",
flag: true
}, {
tit: "土地种植管理"
}, {
@ -91,4 +97,8 @@
}
}
.act {
color: white;
}
</style>

361
pages/profile/index.vue Normal file
View File

@ -0,0 +1,361 @@
<template>
<view class="" style="padding: 30rpx;">
<!-- <view class="" style="display: flex;align-items: center;font-size: 33.29rpx;margin-bottom: 20rpx;">
<u--image @tap="backFn" src="/static/img/FH.png" width="50.82rpx" height="50.82rpx" alt=""></u--image>
<text>生态概况</text>
</view> -->
<view class="" style="padding: 20rpx;box-sizing: border-box;">
<view class="head">
<view class="subsection">
<view class="subsection-li" @click="changeDate(10)">
小时
</view>
<view class="subsection-li" @click="changeDate(160.7)">
</view>
<view class="subsection-li sct" @click="changeDate(311.4)">
</view>
<view class="act" :style="{left:leftNum+'rpx'}">
</view>
</view>
<view class="set" @tap="navgo">
<view class="" style="margin: 0 10rpx;">
<u-icon name="setting" color="white" size="15"></u-icon>
</view> 自定义
</view>
</view>
<view class="">
<view class="tit">
土地检测数据
</view>
<view class="charts-box">
<qiun-data-charts type="mix" :opts="opts" :chartData="chartData" />
</view>
<view class="charts-box">
<qiun-data-charts type="mix" :opts="opts2" :chartData="chartData2" />
</view>
</view>
</view>
</view>
</template>
<script>
import {
companyMine
} from "@/api/test.js"
export default {
data() {
return {
leftNum: 10,
chartData: {},
chartData2: {},
// config-ucharts.js ['mix'] opts opts
opts: {
color: ["#1890FF", "#91CB74"],
padding: [15, 15, 0, 15],
enableScroll: false,
legend: {},
xAxis: {
disableGrid: true,
},
yAxis: {
disabled: false,
disableGrid: false,
splitNumber: 5,
gridType: "dash",
dashLength: 4,
gridColor: "#CCCCCC",
padding: 10,
showTitle: true,
data: [{
position: "left",
title: ""
},
{
position: "right",
min: 0,
max: 200,
title: "",
textAlign: "left"
},
]
},
extra: {
mix: {
column: {
width: 20
}
}
}
},
opts2: {
color: ["#1890FF", "#91CB74"],
padding: [15, 15, 0, 15],
enableScroll: false,
legend: {},
xAxis: {
disableGrid: true,
},
yAxis: {
disabled: false,
disableGrid: false,
splitNumber: 5,
gridType: "dash",
dashLength: 4,
gridColor: "#CCCCCC",
padding: 10,
showTitle: true,
data: [{
position: "left",
title: ""
},
{
position: "right",
min: 0,
max: 200,
title: "",
textAlign: "left"
},
]
},
extra: {
mix: {
column: {
width: 20
}
}
}
}
};
},
onReady() {
let datas = [
[20, 23, 25, 19, 23, 24],
[30, 25, 27, 28, 24, 25],
[40, 41, 32, 30, 32, 30],
[20, 23, 25, 19, 23, 24],
[100, 79, 89, 93, 98, 82],
[18, 20, 25, 26, 30, 31],
["12:00", "13:00", "14:00", "15:00", "16:00", "17:00"],
["12:00", "13:00", "14:00", "15:00", "16:00", "17:00"],
]
this.getServerData(datas)
},
onShow() {
companyMine({
id: 1,
flag: 1
}).then(res => {
console.log(res.data)
})
},
methods: {
changeDate(num) {
let datas = []
this.leftNum = num
if (num == 10) {
datas = [
[20, 23, 25, 19, 23, 24],
[30, 25, 27, 28, 24, 25],
[40, 41, 32, 30, 32, 30],
[20, 23, 25, 19, 23, 24],
[100, 79, 89, 93, 98, 82],
[18, 20, 25, 26, 30, 31],
["12:00", "13:00", "14:00", "15:00", "16:00", "17:00"],
["12:00", "13:00", "14:00", "15:00", "16:00", "17:00"],
]
} else if (num == 160.7) {
datas = [
[25, 22, 24, 19, 21, 22],
[38, 27, 21, 30, 32, 24],
[45, 43, 35, 33, 38, 40],
[27, 23, 25, 27, 30, 34],
[102, 107, 96, 95, 82, 83],
[19, 21, 26, 25, 22, 19],
["10-12", "10-13", "10-14", "10-15", "10-16", "10-17"],
["10-12", "10-13", "10-14", "10-15", "10-16", "10-17"],
]
} else if (num == 311.4) {
datas = [
[29, 32, 38, 31, 23, 24],
[36, 34, 30, 29, 27, 27],
[41, 40, 36, 32, 29, 24],
[29, 23, 25, 30, 34, 36],
[94, 109, 120, 116, 110, 113],
[18, 20, 25, 26, 30, 31],
["5月", "6月", "7月", "8月", "9月", "10月"],
["5月", "6月", "7月", "8月", "9月", "10月"],
]
}
this.getServerData(datas)
},
navgo() {
uni.navigateTo({
url: '/pages/index3/index'
})
},
backFn() {
uni.navigateBack()
},
getServerData(datas) {
//
setTimeout(() => {
//
let res = {
categories: datas[6],
series: [{
name: "土壤温度(℃)",
index: 1,
type: "column",
data: datas[0]
},
{
name: "降雨量(mm)",
type: "line",
color: "#2fc25b",
data: datas[1]
},
{
name: "湿度(WC)",
type: "line",
color: "pink",
data: datas[2]
},
]
};
let res2 = {
categories: datas[7],
series: [
{
name: "光照(lux)",
type: "line",
color: "#2fc25b",
data: datas[4]
},
{
name: "风速(m/h)",
type: "line",
color: "blue",
data: datas[5]
},
]
};
this.chartData = JSON.parse(JSON.stringify(res));
this.chartData2 = JSON.parse(JSON.stringify(res2));
}, 500);
},
}
};
</script>
<style lang="less" scoped>
.head {
// height: 10vh;
display: flex;
justify-content: space-between;
align-items: center;
// background-color: red;
.subsection {
display: flex;
width: 466.12rpx;
height: 98.13rpx;
background-color: #F4F4F4;
border-radius: 50.82rpx 50.82rpx 50.82rpx 50.82rpx;
line-height: 5vh;
position: relative;
.subsection-li {
width: 150.7rpx;
height: 84.11rpx;
border-radius: 50.82rpx 50.82rpx 50.82rpx 50.82rpx;
text-align: center;
line-height: 94rpx;
z-index: 8;
// margin-top: 10rpx;
}
.act {
position: absolute;
width: 130.7rpx;
height: 84.11rpx;
border-radius: 50.82rpx 50.82rpx 50.82rpx 50.82rpx;
background-color: #fff;
top: 50%;
transform: translateY(-50%);
transition: .5s;
}
}
.set {
width: 159.46rpx;
height: 63.08rpx;
font-size: 29.79rpx;
background-color: #0BC677;
border-radius: 31.54rpx 31.54rpx 31.54rpx 31.54rpx;
color: white;
text-align: center;
line-height: 63rpx;
display: flex;
align-items: center;
}
}
.tit {
text-align: center;
margin: 30rpx 0;
font-size: 36.8rpx;
}
.charts-box {
width: 100%;
height: 300px;
border: 1px solid black;
margin-bottom: 40rpx;
}
.detect {
.line {
width: 7.01rpx;
height: 31.54rpx;
background-color: #4CC593;
display: inline-block;
margin-right: 10rpx;
}
.detecttit {
font-size: 31.54rpx;
display: flex;
align-items: center;
}
.content {
padding-top: 20rpx;
}
}
</style>

102
pages/records/index.vue Normal file
View File

@ -0,0 +1,102 @@
<template>
<view class="content">
<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="">
预计产量: 20
</view>
<view class="">
已出售: 的划分等级
</view>
</view>
<view class="card-li">
<view class="">
播种时间: 2020.12.01
</view>
</view>
</view>
<view class="histroy">
<view class="tit" style="margin-bottom: 40rpx;">
历史操作记录
</view>
<view class="table">
</view>
</view>
<view class="btn">
记录今日操作
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
.content {
padding: 20rpx;
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;
}
}
.table {
height: 500rpx;
background-color: red;
}
.btn {
width: 371.5rpx;
height: 66.59rpx;
color: #00A15E;
border: 1px solid #00A15E;
text-align: center;
line-height: 66rpx;
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
margin: 0 auto;
margin-top: 80rpx;
}
}
</style>