This commit is contained in:
parent
d18e6756e0
commit
f8c40ab799
|
|
@ -0,0 +1,111 @@
|
|||
<template>
|
||||
<view class="" style="margin-top: 10rpx;">
|
||||
<view class="" style="display: flex;align-items: center;height: 60rpx;">
|
||||
<u-icon name="map"></u-icon>
|
||||
栏舍一号
|
||||
</view>
|
||||
|
||||
<view class="info">
|
||||
<view class="info-li" style="background-image: url('/static/main/house/dong_wu_ming_cheng.png');">
|
||||
耳号
|
||||
<view class="">
|
||||
黑山羊
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-li" style="background-image: url('/static/main/house/dong_wu_lei_xing.png');">
|
||||
品类
|
||||
<view class="">
|
||||
哺乳动物
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-li" style="background-image: url('/static/main/house/lan_she_rong_liang.png');">
|
||||
品种
|
||||
<view class="">
|
||||
50只
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-li" style="background-image: url('/static/main/house/lan_she_fu_ze_ren.png');">
|
||||
生理阶段
|
||||
<view class="">
|
||||
赵桑
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-li" style="background-image: url('/static/main/house/dian_hua.png');">
|
||||
体重
|
||||
<view class="">
|
||||
20kg
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-li" style="background-image: url('/static/main/house/dian_hua.png');">
|
||||
健康状况
|
||||
<view class="">
|
||||
健康
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
reactive,
|
||||
watch
|
||||
|
||||
} from "vue";
|
||||
const props = defineProps({
|
||||
info: Object,
|
||||
isDetail: Boolean
|
||||
|
||||
})
|
||||
|
||||
const perviewFn = (url) => {
|
||||
|
||||
uni.previewImage({
|
||||
urls: [url]
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.info {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
|
||||
.info-li {
|
||||
width: 223rpx;
|
||||
height: 129rpx;
|
||||
border-radius: 10rpx;
|
||||
background-size: 100% 100%;
|
||||
padding: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
box-shadow: 1rpx 1rpx 10rpx 1rpx rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.info-li-d {
|
||||
width: 223rpx;
|
||||
height: 129rpx;
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
// width: 710rpx;
|
||||
margin: 0 auto;
|
||||
|
||||
.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;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,108 +1,46 @@
|
|||
<template>
|
||||
|
||||
|
||||
<view class="" style="margin-top: 10rpx;">
|
||||
<view class="" style="display: flex;align-items: center;height: 50rpx;">
|
||||
<u--image src="/static/main/index/dw.png" width="25rpx" height="30rpx"
|
||||
style="margin-right: 10rpx;"></u--image>
|
||||
{{info.title}}
|
||||
<view class="" style="display: flex;align-items: center;height: 60rpx;">
|
||||
<u-icon name="map"></u-icon>
|
||||
栏舍一号
|
||||
</view>
|
||||
|
||||
<view class="info">
|
||||
<view class="info-li" style="background-image: url('/static/main/index/tdmj1.png');">
|
||||
当前种植
|
||||
<view class="info-li" style="background-image: url('/static/main/house/dong_wu_ming_cheng.png');">
|
||||
动物名称
|
||||
<view class="">
|
||||
{{info.kindarea|| info.total_area-info.residual_area}}亩
|
||||
黑山羊
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-li" style="background-image: url('/static/main/index/tdmj1.png');">
|
||||
土地面积
|
||||
<view class="info-li" style="background-image: url('/static/main/house/dong_wu_lei_xing.png');">
|
||||
动物类型
|
||||
<view class="">
|
||||
{{info.total_area}}亩
|
||||
哺乳动物
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-li" style="background-image: url('/static/main/index/tdfzr.png');">
|
||||
土地负责人
|
||||
<view class="info-li" style="background-image: url('/static/main/house/lan_she_rong_liang.png');">
|
||||
栏舍容量
|
||||
<view class="">
|
||||
{{info.master_name}}
|
||||
50只
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-li" style="background-image: url('/static/main/index/fzrdh.png');">
|
||||
<view class="info-li" style="background-image: url('/static/main/house/lan_she_fu_ze_ren.png');">
|
||||
栏舍负责人
|
||||
<view class="">
|
||||
赵桑
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-li" style="background-image: url('/static/main/house/dian_hua.png');">
|
||||
负责人电话
|
||||
<view class="">
|
||||
{{info.master_phone}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-li" v-if="isDetail" style="background-image: url('/static/main/index/dqzz.png');">
|
||||
种植品种
|
||||
<view class="">
|
||||
{{info.kind}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-li" v-if="isDetail" style="background-image: url('/static/main/index/pin_pai.png');">
|
||||
种植品牌
|
||||
<view class="">
|
||||
{{info.breed}}
|
||||
</view>
|
||||
<view class="info-li-d">
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
<!-- <view class="card">
|
||||
<view class="tit">
|
||||
<view class="">
|
||||
{{info.title}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="card-li">
|
||||
|
||||
<view class="" v-if="info.kindarea">
|
||||
当前种植: {{info.kindarea}}亩
|
||||
</view>
|
||||
<view class="" v-else>
|
||||
当前种植: {{info.total_area-info.residual_area}}亩
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="card-li" v-if="info.kind">
|
||||
|
||||
<view class="">
|
||||
种植品种: {{info.kind}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="card-li" v-if="info.breed">
|
||||
<view class="">
|
||||
种植品牌: {{info.breed}}
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="card-li">
|
||||
<view class="">
|
||||
土地面积: {{info.total_area}}亩
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
<view class="card-li">
|
||||
<view class="">
|
||||
土地负责人: {{info.master_name}}
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="card-li">
|
||||
<view class="">
|
||||
联系方式: {{info.master_phone}}
|
||||
</view>
|
||||
|
||||
</view> -->
|
||||
|
||||
<!-- </view> -->
|
||||
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
|
@ -140,6 +78,13 @@
|
|||
margin-bottom: 20rpx;
|
||||
box-shadow: 1rpx 1rpx 10rpx 1rpx rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.info-li-d {
|
||||
width: 223rpx;
|
||||
height: 129rpx;
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
|
|
|
|||
|
|
@ -10,6 +10,9 @@
|
|||
"usingComponents" : true,
|
||||
"nvueStyleCompiler" : "uni-app",
|
||||
"compilerVersion" : 3,
|
||||
"compatible":{
|
||||
"ignoreVersion": true //true表示忽略版本检查提示框，HBuilderX1.9.0及以上版本支持
|
||||
},
|
||||
"screenOrientation" : [
|
||||
"portrait-primary",
|
||||
"portrait-secondary",
|
||||
|
|
|
|||
115
pages.json
115
pages.json
|
|
@ -15,8 +15,8 @@
|
|||
"navigationBarTitleText": "首页",
|
||||
"navigationStyle": "custom",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/index/index",
|
||||
|
|
@ -31,8 +31,8 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "土地详情",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -40,8 +40,8 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "种植详情",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -49,8 +49,8 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "添加收获信息",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -58,8 +58,8 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "添加虫害防治信息",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -67,8 +67,8 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "添加灌溉信息",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -76,8 +76,8 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "添加除草信息",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -85,8 +85,8 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "添加施肥信息",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -94,17 +94,17 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "添加种植信息",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/live/live",
|
||||
"style": {
|
||||
"navigationBarTitleText": "苗情监测",
|
||||
"navigationBarTitleText": "栏舍监控",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -112,8 +112,8 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "添加养殖场信息",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
// {
|
||||
|
|
@ -121,8 +121,8 @@
|
|||
// "style": {
|
||||
// "navigationBarTitleText": "选择位置",
|
||||
// "enablePullDownRefresh": false,
|
||||
// "navigationBarBackgroundColor": "#F4F4F4",
|
||||
// "navigationBarTextStyle": "black"
|
||||
// "navigationBarBackgroundColor": "#feb048",
|
||||
// "navigationBarTextStyle": "white"
|
||||
// }
|
||||
// },
|
||||
{
|
||||
|
|
@ -139,16 +139,16 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "溯源结果",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/husbandryForm/detail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "操作详情",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -156,8 +156,8 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "密码修改",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#F4F4F4",
|
||||
"navigationBarTextStyle": "black"
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -178,24 +178,67 @@
|
|||
},
|
||||
{
|
||||
"path": "pages/index/manager",
|
||||
"style" :
|
||||
{
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/plantAdmin/house",
|
||||
"style" :
|
||||
{
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/plantAdmin/addHouse",
|
||||
"style": {
|
||||
"navigationBarTitleText": "新增栏舍",
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/plantAdmin/houseDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "栏舍详情",
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/plantAdmin/breedDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "养殖详情",
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/plantAdmin/addBreed",
|
||||
"style": {
|
||||
"navigationBarTitleText": "新增养殖",
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/feed/feed",
|
||||
"style": {
|
||||
"navigationBarTitleText": "添加喂食记录",
|
||||
"navigationBarBackgroundColor": "#feb048",
|
||||
"navigationBarTextStyle": "white",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
],
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTextStyle": "white",
|
||||
"navigationBarTitleText": "uni-app",
|
||||
"navigationBarBackgroundColor": "#F8F8F8",
|
||||
"backgroundColor": "#F8F8F8"
|
||||
|
|
|
|||
|
|
@ -194,7 +194,7 @@
|
|||
您好！
|
||||
</view>
|
||||
<view class="tit">
|
||||
欢迎进入吟龙土壤墒情监测溯系统!
|
||||
欢迎进入吟龙养殖溯源系统!
|
||||
</view>
|
||||
|
||||
<view class="input-card">
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@
|
|||
您好！
|
||||
</view>
|
||||
<view class="tit">
|
||||
欢迎进入吟龙土壤墒情监测溯系统!
|
||||
欢迎进入吟龙养殖溯源系统!
|
||||
</view>
|
||||
<view class="input-card" style="color: #7A7A7A;">
|
||||
<view class="login-type" style="color: black;font-weight: bold;">
|
||||
|
|
|
|||
|
|
@ -0,0 +1,504 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
|
||||
<view class="card">
|
||||
|
||||
<u--form labelPosition="top" labelWidth='100' :model="formData" :rules="rules" ref="form">
|
||||
<u-form-item label="土地名称" prop="formData.title" borderBottom ref='item1' required>
|
||||
<up-input placeholder="请输入土地名称" border="surround" v-model="formData.title"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="土地面积" prop="formData.area" borderBottom required>
|
||||
<up-input placeholder="请输入土地面积" border="surround" v-model="formData.area"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="所在省份" prop="formData.province_code" borderBottom required>
|
||||
<up-input placeholder="请选择所在省份" border="surround" v-model="province_name" disabled="true"
|
||||
@click="isshow1"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="所在城市" prop="formData.city_code" borderBottom required>
|
||||
<up-input placeholder="请选择所在城市" border="surround" v-model="city_name" @click="isshow2"
|
||||
disabled="true"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="所在区县" prop="formData.county_code" borderBottom required>
|
||||
<up-input placeholder="请选择所在区县" border="surround" v-model="county_name" @click="isshow3"
|
||||
disabled="true"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="所在镇街" prop="formData.town_code" borderBottom required>
|
||||
<up-input placeholder="请选择所在镇街" border="surround" v-model="town_name" @click="isshow4"
|
||||
disabled="true"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="所在乡村" prop="formData.village_code" borderBottom required>
|
||||
<up-input placeholder="请选择所在乡村" border="surround" v-model="village_name" @click="isshow5"
|
||||
disabled="true"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="所在小队" prop="formData.group_code" borderBottom required>
|
||||
<up-input placeholder="请选择所在小队" border="surround" v-model="group_name" @click="isshow6"
|
||||
disabled="true"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="土地负责人" prop="formData.master_name" borderBottom required>
|
||||
<up-input placeholder="请输入土地负责人" border="surround" v-model="formData.master_name"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="负责人电话" prop="formData.master_phone" borderBottom required>
|
||||
<up-input placeholder="请输入负责人电话" type="number" border="surround"
|
||||
v-model="formData.master_phone"></up-input>
|
||||
</u-form-item>
|
||||
<view class="card-li">
|
||||
<view class="card-li-tit">
|
||||
土地图片
|
||||
</view>
|
||||
<view class="code-img">
|
||||
<view class="" @click="updateImgFn">
|
||||
<view class="" v-if="formData.pic">
|
||||
<u-image :src="formData.buy_cert" width="637.85rpx" height="350.47rpx"></u-image>
|
||||
</view>
|
||||
<view class="carime-icon" v-else>
|
||||
<u-image src="/static/img/DJSC.png" width="91.12rpx" height="91.12rpx"></u-image>
|
||||
<view class="">
|
||||
点击上传图片
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</u--form>
|
||||
</view>
|
||||
|
||||
|
||||
<u-action-sheet :show="show" keyName="name" closeOnClickOverlay :actions="columns" title="请选择"
|
||||
@close="show = false" @select="leavaType1">
|
||||
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show1" keyName="name" :actions="columns1" title="请选择" @close="show1 = false"
|
||||
@select="leavaType2">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show2" keyName="name" :actions="columns2" title="请选择" @close="show2 = false"
|
||||
@select="leavaType3">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show3" keyName="name" :actions="columns3" title="请选择" @close="show3 = false"
|
||||
@select="leavaType4">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show4" keyName="name" :actions="columns4" title="请选择" @close="show4 = false"
|
||||
@select="leavaType5">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show5" keyName="name" :actions="columns5" title="请选择" @close="show5 = false"
|
||||
@select="leavaType6">
|
||||
</u-action-sheet>
|
||||
<!-- <view class="up-img confim-btn">
|
||||
+上传播种图片
|
||||
</view> -->
|
||||
<view class="confirm">
|
||||
<view class="confirm-btn" style="color: white;background-color: #0AA565;" @click="addFn">
|
||||
完成添加
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<!-- <view class="today-btn confim-btn" @tap="sowFn">
|
||||
今日播种
|
||||
</view> -->
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import uplodeImg from "@/utils/uplodeImg.js"
|
||||
import {
|
||||
reactive,
|
||||
ref
|
||||
} from "vue";
|
||||
import {
|
||||
onLoad,
|
||||
onReady
|
||||
} from "@dcloudio/uni-app"
|
||||
|
||||
|
||||
import {
|
||||
addland,
|
||||
province,
|
||||
city,
|
||||
county,
|
||||
towns,
|
||||
villages,
|
||||
groups
|
||||
} from '@/api/api.js'
|
||||
|
||||
const form = ref(null);
|
||||
const formData = ref({
|
||||
title: '',
|
||||
area: '',
|
||||
province_code: '',
|
||||
city_code: '',
|
||||
county_code: '',
|
||||
code: '',
|
||||
village_code: '',
|
||||
group_code: '',
|
||||
master_name: '',
|
||||
master_phone: ''
|
||||
})
|
||||
const rules = reactive({
|
||||
title: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请填写土地名称',
|
||||
trigger: ['blur']
|
||||
},
|
||||
area: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请填写土地面积',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
province_code: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请请选择所在省份',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
city_code: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择所在城市',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
county_code: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择所在区县',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
town_code: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择所在镇街',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
village_code: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择所在乡村',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
group_code: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择小队',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
master_name: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请天下负责人',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
master_phone: [{
|
||||
required: true,
|
||||
message: '请输入手机号',
|
||||
trigger: ['change', 'blur'],
|
||||
},
|
||||
{
|
||||
// 自定义验证函数，见上说明
|
||||
validator: (rule, value, callback) => {
|
||||
// 上面有说，返回true表示校验通过，返回false表示不通过
|
||||
// this.$u.test.mobile()就是返回true或者false的
|
||||
// return this.$u.test.mobile(value);
|
||||
},
|
||||
message: '手机号码不正确',
|
||||
// 触发器可以同时用blur和change
|
||||
trigger: ['change', 'blur'],
|
||||
}
|
||||
],
|
||||
})
|
||||
|
||||
|
||||
const province_name = ref(null)
|
||||
const city_name = ref(null)
|
||||
const county_name = ref(null)
|
||||
const town_name = ref(null)
|
||||
const village_name = ref(null)
|
||||
const group_name = ref(null)
|
||||
const show = ref(false)
|
||||
const show1 = ref(false)
|
||||
const show2 = ref(false)
|
||||
const show3 = ref(false)
|
||||
const show4 = ref(false)
|
||||
const show5 = ref(false)
|
||||
const columns = reactive([])
|
||||
const columns1 = reactive([])
|
||||
const columns2 = reactive([])
|
||||
const columns3 = reactive([])
|
||||
const columns4 = reactive([])
|
||||
const columns5 = reactive([])
|
||||
const provincen = () => {
|
||||
province().then((res) => {
|
||||
columns.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.province_name,
|
||||
id: step.province_code,
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const cityn = (id) => {
|
||||
console.log(id)
|
||||
city({
|
||||
province_code: id
|
||||
}).then((res) => {
|
||||
columns1.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.city_name,
|
||||
id: step.city_code,
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
const countyn = (id) => {
|
||||
county({
|
||||
city_code: id
|
||||
|
||||
}).then((res) => {
|
||||
columns2.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.county_name,
|
||||
id: step.county_code,
|
||||
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
const townsn = (id) => {
|
||||
towns({
|
||||
county_code: id
|
||||
}).then((res) => {
|
||||
columns3.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.town_name,
|
||||
id: step.town_code,
|
||||
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
const villagesn = (id) => {
|
||||
villages({
|
||||
town_code: id
|
||||
}).then((res) => {
|
||||
columns4.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.village_name,
|
||||
id: step.village_code,
|
||||
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const groupsn = () => {
|
||||
groups().then((res) => {
|
||||
columns5.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.group_name,
|
||||
id: step.group_code,
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
// 地址 省 市 街道 乡村 小队
|
||||
|
||||
const isshow1 = () => {
|
||||
show.value = true
|
||||
}
|
||||
const isshow2 = () => {
|
||||
|
||||
show1.value = true
|
||||
}
|
||||
const isshow3 = () => {
|
||||
show2.value = true
|
||||
}
|
||||
const isshow4 = () => {
|
||||
show3.value = true
|
||||
}
|
||||
const isshow5 = () => {
|
||||
show4.value = true
|
||||
|
||||
}
|
||||
const isshow6 = () => {
|
||||
show5.value = true
|
||||
}
|
||||
|
||||
const leavaType1 = (e) => {
|
||||
console.log('Received value:', e)
|
||||
province_name.value = e.name
|
||||
formData.province_code = e.id
|
||||
cityn(e.id)
|
||||
|
||||
}
|
||||
const leavaType2 = (e) => {
|
||||
city_name.value = e.name
|
||||
formData.city_code = e.id
|
||||
countyn(e.id)
|
||||
}
|
||||
|
||||
const leavaType3 = (e) => {
|
||||
county_name.value = e.name
|
||||
formData.county_code = e.id
|
||||
townsn(e.id)
|
||||
}
|
||||
const leavaType4 = (e) => {
|
||||
town_name.value = e.name
|
||||
formData.town_code = e.id
|
||||
villagesn(e.id)
|
||||
}
|
||||
const leavaType5 = (e) => {
|
||||
village_name.value = e.name
|
||||
formData.village_code = e.id
|
||||
groupsn()
|
||||
}
|
||||
const leavaType6 = (e) => {
|
||||
group_name.value = e.name
|
||||
formData.group_code = e.id
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
const navgo = (url) => {
|
||||
uni.navigateTo({
|
||||
url
|
||||
})
|
||||
}
|
||||
const addFn = () => {
|
||||
console.log('11111');
|
||||
form.value.validate((valid) => {
|
||||
console.log(valid);
|
||||
if (valid) {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: "表单验证通过"
|
||||
})
|
||||
|
||||
addland(this.formData).then((res) => {
|
||||
console.log(res)
|
||||
})
|
||||
} else {
|
||||
uni.$u.toast('校验失败')
|
||||
}
|
||||
})
|
||||
// form.value.validate().then(res => {
|
||||
// console.log(6)
|
||||
// }).catch(errors => {
|
||||
// uni.$u.toast('校验失败')
|
||||
// })
|
||||
// console.log()
|
||||
// return
|
||||
// this.$refs.form.validate(valid).then(res => {
|
||||
// console.log(valid)
|
||||
// uni.$u.toast('校验通过')
|
||||
// }).catch(errors => {
|
||||
// uni.$u.toast('校验失败')
|
||||
// })
|
||||
// navgo('/pages/index/index')
|
||||
}
|
||||
|
||||
const updateImgFn = async () => {
|
||||
let res = await uplodeImg()
|
||||
formData.buy_cert = res.data.image
|
||||
}
|
||||
onLoad((options) => {
|
||||
|
||||
provincen()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
.tit {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.card-li {
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.confim-btn {
|
||||
margin: 0 auto;
|
||||
width: 196.26rpx;
|
||||
height: 66.59rpx;
|
||||
/* border: ; */
|
||||
border: #00A15E 1px solid;
|
||||
color: #00A15E;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
|
||||
}
|
||||
|
||||
.up-img {
|
||||
width: 341.71rpx
|
||||
}
|
||||
|
||||
.today-btn {
|
||||
width: 588.79rpx;
|
||||
background-color: #00A15E;
|
||||
color: white;
|
||||
position: fixed;
|
||||
bottom: 40rpx;
|
||||
/* transform: ; */
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: linear-gradient(to right, #00A15E, #4CC593);
|
||||
/* margin: 0 auto; */
|
||||
}
|
||||
|
||||
.code-img {
|
||||
background-color: #F4F4F4;
|
||||
height: 350.47rpx;
|
||||
position: relative;
|
||||
margin-bottom: 100rpx;
|
||||
|
||||
.carime-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.confirm {
|
||||
position: fixed;
|
||||
height: 84.11rpx;
|
||||
display: flex;
|
||||
bottom: 30rpx;
|
||||
width: 750rpx;
|
||||
|
||||
.confirm-btn {
|
||||
width: 315.42rpx;
|
||||
height: 84.11rpx;
|
||||
border: #00A15E 1px solid;
|
||||
margin: 0 auto;
|
||||
border-radius: 80rpx;
|
||||
text-align: center;
|
||||
line-height: 84rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,403 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
|
||||
<view class="card">
|
||||
<u-form labelPosition="top" labelWidth='100' :model="data.formData" ref="form1">
|
||||
<!-- <u-form-item label="姓名" prop="name"><u-input v-model="data.formData.name" /></u-form-item>
|
||||
<u-form-item label="简介" prop="intro"><u-input v-model="data.formData.intro" /></u-form-item> -->
|
||||
|
||||
<u-form-item label="土地名称" prop="title" borderBottom ref='item1' required>
|
||||
<up-input placeholder="请输入土地名称" border="surround" v-model="data.formData.title"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="土地面积" prop="area" borderBottom required>
|
||||
<up-input placeholder="请输入土地面积" border="surround" v-model="data.formData.area"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="所在省份" prop="province_code" borderBottom required>
|
||||
<up-input placeholder="请选择所在省份" border="surround" v-model="province_name" disabled="true"
|
||||
@click="isshow1"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="所在城市" prop="city_code" borderBottom required>
|
||||
<up-input placeholder="请选择所在城市" border="surround" v-model="city_name" @click="isshow2"
|
||||
disabled="true"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="所在区县" prop="county_code" borderBottom required>
|
||||
<up-input placeholder="请选择所在区县" border="surround" v-model="county_name" @click="isshow3"
|
||||
disabled="true"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="所在镇街" prop="town_code" borderBottom required>
|
||||
<up-input placeholder="请选择所在镇街" border="surround" v-model="town_name" @click="isshow4"
|
||||
disabled="true"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="所在乡村" prop="village_code" borderBottom required>
|
||||
<up-input placeholder="请选择所在乡村" border="surround" v-model="village_name" @click="isshow5"
|
||||
disabled="true"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="所在小队" prop="group_code" borderBottom required>
|
||||
<up-input placeholder="请选择所在小队" border="surround" v-model="group_name" @click="isshow6"
|
||||
disabled="true"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="土地负责人" prop="master_name" borderBottom required>
|
||||
<up-input placeholder="请输入土地负责人" border="surround" v-model="data.formData.master_name"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="负责人电话" prop="master_phone" borderBottom required>
|
||||
<up-input placeholder="请输入负责人电话" type="number" border="surround"
|
||||
v-model="data.formData.master_phone"></up-input>
|
||||
</u-form-item>
|
||||
<view class="card-li">
|
||||
<view class="card-li-tit">
|
||||
土地图片
|
||||
</view>
|
||||
<view class="code-img">
|
||||
<view class="" @click="updateImgFn">
|
||||
<view class="" v-if="data.formData.pic">
|
||||
<u-image :src="data.formData.pic" width="637.85rpx" height="350.47rpx"></u-image>
|
||||
</view>
|
||||
<view class="carime-icon" v-else>
|
||||
<u-image src="/static/img/DJSC.png" width="91.12rpx" height="91.12rpx"></u-image>
|
||||
<view class="">
|
||||
点击上传图片
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-form>
|
||||
<u-action-sheet :show="show" keyName="name" closeOnClickOverlay :actions="columns" title="请选择"
|
||||
@close="show = false" @select="leavaType1">
|
||||
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show1" keyName="name" :actions="columns1" title="请选择" @close="show1 = false"
|
||||
@select="leavaType2">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show2" keyName="name" :actions="columns2" title="请选择" @close="show2 = false"
|
||||
@select="leavaType3">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show3" keyName="name" :actions="columns3" title="请选择" @close="show3 = false"
|
||||
@select="leavaType4">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show4" keyName="name" :actions="columns4" title="请选择" @close="show4 = false"
|
||||
@select="leavaType5">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show5" keyName="name" :actions="columns5" title="请选择" @close="show5 = false"
|
||||
@select="leavaType6">
|
||||
</u-action-sheet>
|
||||
<u-button @click="submit">提交</u-button>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
onMounted,
|
||||
unref,
|
||||
computed,
|
||||
watch
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad,
|
||||
onReady
|
||||
} from '@dcloudio/uni-app';
|
||||
import {
|
||||
addland,
|
||||
province,
|
||||
city,
|
||||
county,
|
||||
towns,
|
||||
villages,
|
||||
groups
|
||||
} from '@/api/api.js'
|
||||
|
||||
const form1 = ref();
|
||||
const data = reactive({
|
||||
formData: {
|
||||
title: '',
|
||||
area: '',
|
||||
province_code: '',
|
||||
city_code: '',
|
||||
county_code: '',
|
||||
town_code: '',
|
||||
village_code: '',
|
||||
group_code: '',
|
||||
master_name: '',
|
||||
master_phone: ''
|
||||
},
|
||||
rules: {
|
||||
// name: [{
|
||||
// required: true,
|
||||
// message: '请输入姓名',
|
||||
// // 可以单个或者同时写两个触发验证方式
|
||||
// trigger: ['change', 'blur'],
|
||||
// }],
|
||||
// intro: [{
|
||||
// min: 5,
|
||||
// message: '简介不能少于5个字',
|
||||
// trigger: 'change'
|
||||
// }],
|
||||
title: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请填写土地名称',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
area: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请填写土地面积',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
province_code: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请请选择所在省份',
|
||||
trigger: 'change'
|
||||
}],
|
||||
city_code: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择所在城市',
|
||||
trigger: 'change'
|
||||
}],
|
||||
county_code: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择所在区县',
|
||||
trigger: 'change'
|
||||
}],
|
||||
town_code: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择所在镇街',
|
||||
trigger: 'change'
|
||||
}],
|
||||
village_code: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择所在乡村',
|
||||
trigger: 'change'
|
||||
}],
|
||||
group_code: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择小队',
|
||||
trigger: 'change'
|
||||
}],
|
||||
master_name: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请天下负责人',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
master_phone: [{
|
||||
required: true,
|
||||
message: '请输入手机号',
|
||||
trigger: ['change', 'blur'],
|
||||
},
|
||||
{
|
||||
// 自定义验证函数，见上说明
|
||||
validator: (rule, value, callback) => {
|
||||
// 上面有说，返回true表示校验通过，返回false表示不通过
|
||||
// this.$u.test.mobile()就是返回true或者false的
|
||||
// return this.$u.test.mobile(value);
|
||||
},
|
||||
message: '手机号码不正确',
|
||||
// 触发器可以同时用blur和change
|
||||
trigger: ['change', 'blur'],
|
||||
}
|
||||
],
|
||||
|
||||
}
|
||||
});
|
||||
const province_name = ref(null)
|
||||
const city_name = ref(null)
|
||||
const county_name = ref(null)
|
||||
const town_name = ref(null)
|
||||
const village_name = ref(null)
|
||||
const group_name = ref(null)
|
||||
const show = ref(false)
|
||||
const show1 = ref(false)
|
||||
const show2 = ref(false)
|
||||
const show3 = ref(false)
|
||||
const show4 = ref(false)
|
||||
const show5 = ref(false)
|
||||
const columns = reactive([])
|
||||
const columns1 = reactive([])
|
||||
const columns2 = reactive([])
|
||||
const columns3 = reactive([])
|
||||
const columns4 = reactive([])
|
||||
const columns5 = reactive([])
|
||||
const provincen = () => {
|
||||
province().then((res) => {
|
||||
columns.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.province_name,
|
||||
id: step.province_code,
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const cityn = (id) => {
|
||||
console.log(id)
|
||||
city({
|
||||
province_code: id
|
||||
}).then((res) => {
|
||||
columns1.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.city_name,
|
||||
id: step.city_code,
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
const countyn = (id) => {
|
||||
county({
|
||||
city_code: id
|
||||
|
||||
}).then((res) => {
|
||||
columns2.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.county_name,
|
||||
id: step.county_code,
|
||||
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
const townsn = (id) => {
|
||||
towns({
|
||||
county_code: id
|
||||
}).then((res) => {
|
||||
columns3.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.town_name,
|
||||
id: step.town_code,
|
||||
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
const villagesn = (id) => {
|
||||
villages({
|
||||
town_code: id
|
||||
}).then((res) => {
|
||||
columns4.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.village_name,
|
||||
id: step.village_code,
|
||||
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const groupsn = () => {
|
||||
groups().then((res) => {
|
||||
columns5.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.group_name,
|
||||
id: step.group_code,
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
// 地址 省 市 街道 乡村 小队
|
||||
|
||||
const isshow1 = () => {
|
||||
show.value = true
|
||||
}
|
||||
const isshow2 = () => {
|
||||
|
||||
show1.value = true
|
||||
}
|
||||
const isshow3 = () => {
|
||||
show2.value = true
|
||||
}
|
||||
const isshow4 = () => {
|
||||
show3.value = true
|
||||
}
|
||||
const isshow5 = () => {
|
||||
show4.value = true
|
||||
|
||||
}
|
||||
const isshow6 = () => {
|
||||
show5.value = true
|
||||
}
|
||||
|
||||
const leavaType1 = (e) => {
|
||||
console.log('Received value:', e)
|
||||
province_name.value = e.name
|
||||
data.formData.province_code = e.id
|
||||
cityn(e.id)
|
||||
|
||||
}
|
||||
const leavaType2 = (e) => {
|
||||
city_name.value = e.name
|
||||
data.formData.city_code = e.id
|
||||
countyn(e.id)
|
||||
}
|
||||
|
||||
const leavaType3 = (e) => {
|
||||
county_name.value = e.name
|
||||
data.formData.county_code = e.id
|
||||
townsn(e.id)
|
||||
}
|
||||
const leavaType4 = (e) => {
|
||||
town_name.value = e.name
|
||||
data.formData.town_code = e.id
|
||||
villagesn(e.id)
|
||||
}
|
||||
const leavaType5 = (e) => {
|
||||
village_name.value = e.name
|
||||
data.formData.village_code = e.id
|
||||
|
||||
}
|
||||
const leavaType6 = (e) => {
|
||||
console.log(e)
|
||||
group_name.value = e.name
|
||||
data.formData.group_code = e.id.toString()
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
onReady(() => {
|
||||
form1.value.setRules(data.rules);
|
||||
});
|
||||
|
||||
const submit = (e) => {
|
||||
|
||||
form1.value.validate(valid => {
|
||||
console.log(valid)
|
||||
if (valid) {
|
||||
uni.showToast({
|
||||
title: "验证通过",
|
||||
icon: 'none'
|
||||
});
|
||||
console.log('验证通过');
|
||||
} else {
|
||||
console.log('验证失败');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
onLoad((options) => {
|
||||
|
||||
provincen()
|
||||
groupsn()
|
||||
})
|
||||
</script>
|
||||
|
|
@ -0,0 +1,571 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
|
||||
<view class="card">
|
||||
<up-form labelWidth='130' :model="data.formData" ref="form1">
|
||||
<!-- <up-form-item label="姓名" prop="name"><u-input v-model="data.formData.name" /></up-form-item>
|
||||
<up-form-item label="简介" prop="intro"><u-input v-model="data.formData.intro" /></up-form-item> -->
|
||||
|
||||
<view class="c-title">养殖场信息</view>
|
||||
<view class="c-box">
|
||||
<up-form-item label="养殖场名称" prop="title" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入养殖场名称" border="none"
|
||||
v-model="data.formData.title"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="养殖场类型" prop="title" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入养殖场类型" border="none"
|
||||
v-model="data.formData.title"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="养殖种类" prop="area" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入养殖种类" border="none"
|
||||
v-model="data.formData.area"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="养殖场规模(亩)" prop="master_name" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入养殖场规模" border="none"
|
||||
v-model="data.formData.master_name"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="负责人" prop="master_phone" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入负责人姓名" type="number" border="none"
|
||||
v-model="data.formData.master_phone"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="负责人电话" prop="master_phone" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入负责人电话" type="number" border="none"
|
||||
v-model="data.formData.master_phone"></up-input>
|
||||
</up-form-item>
|
||||
</view>
|
||||
|
||||
<view class="c-title">地址信息</view>
|
||||
<view class="c-box">
|
||||
<up-form-item label="所在省份" prop="province_code" borderBottom required @click="isshow1">
|
||||
<up-input input-align="right" placeholder="请选择所在省份" suffixIcon="arrow-down"
|
||||
suffix-icon-style="color: #b6b6b6;" border="none" v-model="province_name" readonly
|
||||
style="pointer-events: none;"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="所在城市" prop="city_code" borderBottom required @click="isshow2">
|
||||
<up-input input-align="right" placeholder="请选择所在城市" suffixIcon="arrow-down"
|
||||
suffix-icon-style="color: #b6b6b6;" border="none" v-model="city_name" readonly
|
||||
style="pointer-events: none;"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="所在区县" prop="county_code" borderBottom required @click="isshow3">
|
||||
<up-input input-align="right" placeholder="请选择所在区县" suffixIcon="arrow-down"
|
||||
suffix-icon-style="color: #b6b6b6;" border="none" v-model="county_name" readonly
|
||||
style="pointer-events: none;"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="养殖场详细地址" prop="town_code" style="position: relative;" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入养殖场详细地址" suffixIcon="map"
|
||||
suffix-icon-style="color: #b6b6b6;" border="none" v-model="data.formData.address">
|
||||
</up-input>
|
||||
<view style="position: absolute;right: 0;width: 50rpx; height: 100%; " @click="location">
|
||||
</view>
|
||||
</up-form-item>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="card-li">
|
||||
<view class="c-title">养殖场图片</view>
|
||||
<view class="c-box c-box-p">
|
||||
<view class="code-img1">
|
||||
<view class="" v-if="pic.length>0"
|
||||
style="display: flex;flex-direction: row;flex-wrap: wrap;margin-bottom: 30rpx;">
|
||||
<view class="" v-for="(item,i) in pic" style="margin-right: 30rpx;">
|
||||
<view class="">
|
||||
<u-icon name="close" size="15" style="margin-left:120.85rpx;"
|
||||
@click="delimg(i)"></u-icon>
|
||||
<u-image :src="item" width="150.85rpx" height="150.85rpx"></u-image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="code-img">
|
||||
<view class="" @click="updateImgFn">
|
||||
<view class="carime-icon">
|
||||
<u-image src="/static/img/DJSC.png" width="91.12rpx" height="91.12rpx"></u-image>
|
||||
<view class="">
|
||||
点击上传图片
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</up-form>
|
||||
<u-action-sheet :show="show" keyName="name" closeOnClickOverlay :actions="columns" title="请选择"
|
||||
@close="show = false" @select="leavaType1">
|
||||
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show1" keyName="name" :actions="columns1" title="请选择" @close="show1 = false"
|
||||
@select="leavaType2">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show2" keyName="name" :actions="columns2" title="请选择" @close="show2 = false"
|
||||
@select="leavaType3">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show3" keyName="name" :actions="columns3" title="请选择" @close="show3 = false"
|
||||
@select="leavaType4">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show4" keyName="name" :actions="columns4" title="请选择" @close="show4 = false"
|
||||
@select="leavaType5">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show5" keyName="name" :actions="columns5" title="请选择" @close="show5 = false"
|
||||
@select="leavaType6">
|
||||
</u-action-sheet>
|
||||
<u-button class="btn" @click="submit">提交</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
onMounted,
|
||||
unref,
|
||||
computed,
|
||||
watch
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad,
|
||||
onReady
|
||||
} from '@dcloudio/uni-app';
|
||||
import {
|
||||
Uploads
|
||||
} from "@/api/upload.js"
|
||||
import {
|
||||
addland,
|
||||
province,
|
||||
city,
|
||||
county,
|
||||
towns,
|
||||
villages,
|
||||
groups
|
||||
} from '@/api/api.js'
|
||||
|
||||
const form1 = ref(null);
|
||||
const data = reactive({
|
||||
formData: {
|
||||
title: '',
|
||||
area: '',
|
||||
province_code: '',
|
||||
city_code: '',
|
||||
county_code: '',
|
||||
address: '',
|
||||
lat: "",
|
||||
lon: "",
|
||||
master_name: '',
|
||||
master_phone: '',
|
||||
pic: ['https://img0.baidu.com/it/u=1717510975,3258230326&fm=253&fmt=auto?w=120&h=80',
|
||||
'https://img0.baidu.com/it/u=1717510975,3258230326&fm=253&fmt=auto?w=120&h=80'
|
||||
]
|
||||
},
|
||||
rules: {
|
||||
// name: [{
|
||||
// required: true,
|
||||
// message: '请输入姓名',
|
||||
// // 可以单个或者同时写两个触发验证方式
|
||||
// trigger: ['change', 'blur'],
|
||||
// }],
|
||||
// intro: [{
|
||||
// min: 5,
|
||||
// message: '简介不能少于5个字',
|
||||
// trigger: 'change'
|
||||
// }],
|
||||
title: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请填写养殖场名称',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
area: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请填写养殖场面积',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
province_code: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请请选择所在省份',
|
||||
trigger: 'change'
|
||||
}],
|
||||
city_code: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择所在城市',
|
||||
trigger: 'change'
|
||||
}],
|
||||
county_code: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择所在区县',
|
||||
trigger: 'change'
|
||||
}],
|
||||
address: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请输入养殖场详细地址',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
master_name: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请输入养殖场负责人名称',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
master_phone: [{
|
||||
required: true,
|
||||
message: '请输入手机号',
|
||||
trigger: ['change', 'blur'],
|
||||
},
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
// 上面有说，返回true表示校验通过，返回false表示不通过
|
||||
// uni.$u.test.mobile()就是返回true或者false的
|
||||
return uni.$u.test.mobile(value);
|
||||
},
|
||||
message: '手机号码不正确',
|
||||
// 触发器可以同时用blur和change
|
||||
trigger: ['change', 'blur'],
|
||||
}
|
||||
],
|
||||
|
||||
}
|
||||
});
|
||||
const pic = reactive([]);
|
||||
const province_name = ref(null)
|
||||
const city_name = ref(null)
|
||||
const county_name = ref(null)
|
||||
|
||||
const show = ref(false)
|
||||
const show1 = ref(false)
|
||||
const show2 = ref(false)
|
||||
const columns = reactive([])
|
||||
const columns1 = reactive([])
|
||||
const columns2 = reactive([])
|
||||
|
||||
|
||||
const provincen = () => {
|
||||
province().then((res) => {
|
||||
columns.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.province_name,
|
||||
id: step.province_code,
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const cityn = (id) => {
|
||||
|
||||
city({
|
||||
province_code: id
|
||||
}).then((res) => {
|
||||
columns1.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.city_name,
|
||||
id: step.city_code,
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
const countyn = (id) => {
|
||||
county({
|
||||
city_code: id
|
||||
|
||||
}).then((res) => {
|
||||
columns2.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.county_name,
|
||||
id: step.county_code,
|
||||
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
//图片删除
|
||||
const delimg = (i) => {
|
||||
pic.splice(i, 1);
|
||||
}
|
||||
|
||||
//图片上传
|
||||
const updateImgFn = async () => {
|
||||
|
||||
uni.chooseImage({
|
||||
count: 1,
|
||||
sizeType: ['original', 'compressed'],
|
||||
sourceType: ['album', 'camera'],
|
||||
success: (res) => {
|
||||
Uploads(res.tempFilePaths[0], 'img').then(res => {
|
||||
// console.log(res)
|
||||
if (res.code == 1) {
|
||||
pic.push(res.data.url)
|
||||
console.log(data.formData)
|
||||
|
||||
uni.$u.toast('上传成功')
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}).catch(err => {
|
||||
//console.log('err', err);
|
||||
// uni.$u.toast('上传失败')
|
||||
})
|
||||
},
|
||||
fail: function(err) {
|
||||
//console.log('choose失败');
|
||||
uni.$u.toast('添加失败')
|
||||
}
|
||||
});
|
||||
// let res = await Uploads()
|
||||
// data.formData.pic = res.data.image
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 地址 省 市 街道 乡村 小队
|
||||
|
||||
const isshow1 = () => {
|
||||
show.value = true
|
||||
}
|
||||
const isshow2 = () => {
|
||||
|
||||
show1.value = true
|
||||
}
|
||||
const isshow3 = () => {
|
||||
show2.value = true
|
||||
}
|
||||
const isshow4 = () => {
|
||||
show3.value = true
|
||||
}
|
||||
const isshow5 = () => {
|
||||
show4.value = true
|
||||
|
||||
}
|
||||
const isshow6 = () => {
|
||||
show5.value = true
|
||||
}
|
||||
|
||||
const leavaType1 = (e) => {
|
||||
|
||||
province_name.value = e.name
|
||||
data.formData.province_code = e.id
|
||||
cityn(e.id)
|
||||
|
||||
}
|
||||
const leavaType2 = (e) => {
|
||||
city_name.value = e.name
|
||||
data.formData.city_code = e.id
|
||||
countyn(e.id)
|
||||
}
|
||||
|
||||
const leavaType3 = (e) => {
|
||||
county_name.value = e.name
|
||||
data.formData.county_code = e.id
|
||||
|
||||
}
|
||||
const location = () => {
|
||||
|
||||
uni.showLoading({
|
||||
title: '获取位置中'
|
||||
})
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
geocode: true,
|
||||
isHighAccuracy: true,
|
||||
success: async (res) => {
|
||||
console.log(res)
|
||||
|
||||
|
||||
data.formData.lat = res.latitude
|
||||
data.formData.lon = res.longitude
|
||||
|
||||
data.formData.address = res.address.street + res
|
||||
.address.streetNum + res.address.poiName
|
||||
|
||||
uni.hideLoading();
|
||||
|
||||
console.log(data.formData)
|
||||
},
|
||||
fail: (err) => {
|
||||
// uni.hideLoading();
|
||||
console.log(err)
|
||||
console.log("erer")
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
onReady(() => {
|
||||
form1.value.setRules(data.rules);
|
||||
|
||||
});
|
||||
|
||||
|
||||
const submit = async () => {
|
||||
try {
|
||||
const valid = await form1.value.validate();
|
||||
if (valid) {
|
||||
// console.log('表单通过', data.formData);
|
||||
if (pic.length == 0) {
|
||||
|
||||
uni.$u.toast('请上传图片')
|
||||
return
|
||||
}
|
||||
data.formData.pic = JSON.stringify(pic)
|
||||
|
||||
|
||||
// 表单验证通过，执行提交操作
|
||||
addland(data.formData).then((res) => {
|
||||
console.log(res)
|
||||
if (res.code == 1) {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
uni.$u.toast(res.msg)
|
||||
// console.log('提交通过');
|
||||
}
|
||||
})
|
||||
} else {
|
||||
// 表单验证不通过
|
||||
console.log('表单验证未通过');
|
||||
}
|
||||
} catch (error) {
|
||||
// 捕获验证过程中的错误
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
|
||||
onLoad((options) => {
|
||||
|
||||
provincen()
|
||||
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fffcf5;
|
||||
|
||||
}
|
||||
|
||||
.card {
|
||||
background-color: #fffcf5;
|
||||
padding: 0;
|
||||
padding-bottom: 80rpx;
|
||||
|
||||
.c-title {
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 30rpx;
|
||||
padding-bottom: 15rpx;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
height: 0.8rem;
|
||||
width: 6rpx;
|
||||
margin-top: 0.2rem;
|
||||
margin-right: 10rpx;
|
||||
background-color: #feb048;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.c-box {
|
||||
background-color: #fff;
|
||||
padding-left: 30rpx;
|
||||
padding-right: 20rpx;
|
||||
padding-bottom: 20rpx;
|
||||
box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.c-box-p {
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 20rpx auto;
|
||||
width: 694rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 80rpx;
|
||||
background-color: #ffb049;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.card-li-tit {
|
||||
position: relative;
|
||||
|
||||
span {
|
||||
position: absolute;
|
||||
left: -9px;
|
||||
color: #f56c6c;
|
||||
line-height: 20px;
|
||||
font-size: 20px;
|
||||
top: 3px;
|
||||
}
|
||||
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.confim-btn {
|
||||
margin: 0 auto;
|
||||
width: 196.26rpx;
|
||||
height: 66.59rpx;
|
||||
/* border: ; */
|
||||
border: #00A15E 1px solid;
|
||||
color: #00A15E;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
|
||||
}
|
||||
|
||||
.up-img {
|
||||
width: 341.71rpx
|
||||
}
|
||||
|
||||
.today-btn {
|
||||
width: 588.79rpx;
|
||||
background-color: #00A15E;
|
||||
color: white;
|
||||
position: fixed;
|
||||
bottom: 40rpx;
|
||||
/* transform: ; */
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: linear-gradient(to right, #00A15E, #4CC593);
|
||||
/* margin: 0 auto; */
|
||||
}
|
||||
|
||||
.code-img {
|
||||
background-color: #F4F4F4;
|
||||
height: 350.47rpx;
|
||||
position: relative;
|
||||
|
||||
.carime-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,418 @@
|
|||
<template>
|
||||
<view class="" style="background-color: #fff;">
|
||||
<u-sticky customNavHeight="0">
|
||||
<view class="head_top">
|
||||
<!-- <u-search placeholder="搜索小区、办公楼等" @custom="searchMap"></u-search>
|
||||
<view style="height: 20rpx;"></view> -->
|
||||
<u-tabs :list="tabsList" itemStyle="font-size: 32rpx;height: 74rpx;" :current="current"
|
||||
@change="changeCurrent" lineColor="#FF6D20" lineWidth="105rpx" height="7rpx">
|
||||
</u-tabs>
|
||||
</view>
|
||||
</u-sticky>
|
||||
<view style="background-color: #f4f4f4;height: 30rpx;"></view>
|
||||
<view class="address-box" v-if="current==0" style="padding: 0;">
|
||||
<map style="width: 750rpx;height: 750rpx;" :longitude="longitude" :latitude="latitude" :markers="[markers]"
|
||||
show-location @tap="handleMapTap"></map>
|
||||
<view class="head_item" style="padding: 10rpx 20rpx;">
|
||||
<view class="re-location">
|
||||
<view style="width: 120rpx;"><text class="text">当前位置: </text></view>
|
||||
<view style="flex: 1;">
|
||||
<text
|
||||
class="text">{{locationInfo.formatted_addresses?locationInfo.formatted_addresses.recommend:locationInfo.address}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="re-btn" @click="reGetLocation">
|
||||
<image class="re-address-img" src="@/static/images/re_address.png"></image><text
|
||||
class="text">重新定位</text>
|
||||
</view>
|
||||
</view>
|
||||
<u-button text="确认" @click="submitAddress"></u-button>
|
||||
</view>
|
||||
<view class="address-box" v-if="current==1">
|
||||
<view class="head_item_tips">
|
||||
<view><text class="text">泸州区县</text></view>
|
||||
</view>
|
||||
<view class="area">
|
||||
<view class="area-item" :class="{'area-item-on': item.code==area_change}"
|
||||
v-for="(item, index) in areaList" :key="index" @click="changeArea(item)">
|
||||
<text class="text">{{item.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="head_item_tips">
|
||||
<view><text class="text">选择街道/镇</text></view>
|
||||
</view>
|
||||
<view class="street">
|
||||
<view class="letter-item" v-for="key in mapKey" :key="key">
|
||||
<view class="letter"><text class="text">{{key}}</text></view>
|
||||
<view class="item-box">
|
||||
<view class="street-item" v-for="item in mapList[key]" :key="item.code"
|
||||
@click="changeStreet(item)">
|
||||
<text class="text">{{item.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getGeocoder,
|
||||
merClassifly,
|
||||
getProductslist
|
||||
} from '@/api/store.js';
|
||||
import {
|
||||
getArea,
|
||||
getStreet
|
||||
} from "@/api/article.js";
|
||||
import {
|
||||
Toast
|
||||
} from '@/libs/uniApi';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tabsList: [{
|
||||
name: '地图定位',
|
||||
}, {
|
||||
name: '泸州区县',
|
||||
}],
|
||||
current: 0,
|
||||
latitude: '28.87',
|
||||
longitude: '105.44',
|
||||
markers: {
|
||||
id: 1,
|
||||
longitude: '28.87',
|
||||
latitude: '105.44',
|
||||
iconPath: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/cbbd5202311241523412538.png',
|
||||
width: 28,
|
||||
height: 28
|
||||
},
|
||||
locationInfo: {},
|
||||
town: '',
|
||||
street_id: '',
|
||||
street: '',
|
||||
areaList: [],
|
||||
streetList: [],
|
||||
mapList: {},
|
||||
area_change: '',
|
||||
street_change: '',
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
this.getLoaction();
|
||||
this.loadArea();
|
||||
},
|
||||
onShow() {},
|
||||
computed: {
|
||||
mapKey() {
|
||||
return Object.keys(this.mapList).sort()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeCurrent(e) {
|
||||
this.current = e.index;
|
||||
},
|
||||
getLoaction() {
|
||||
this.street = '定位中'
|
||||
this.locationInfo = {};
|
||||
this.locationInfo.formatted_addresses = {};
|
||||
this.locationInfo.formatted_addresses.recommend = '定位中'
|
||||
uni.getLocation({
|
||||
type: 'wgs84',
|
||||
timeout: '4',
|
||||
success: (res) => {
|
||||
let latitude, longitude;
|
||||
latitude = res.latitude.toString();
|
||||
longitude = res.longitude.toString();
|
||||
this.latitude = res.latitude.toFixed(6);
|
||||
this.longitude = res.longitude.toFixed(6);
|
||||
this.$store.commit('setLocation', {
|
||||
lat: res.latitude.toFixed(6),
|
||||
long: res.longitude.toFixed(6),
|
||||
});
|
||||
getGeocoder({
|
||||
lat: latitude,
|
||||
long: longitude
|
||||
}).then(res => {
|
||||
this.locationInfo = res.data;
|
||||
this.town = res.data.address_reference.town.title
|
||||
this.street_id = res.data.address_reference.town.id
|
||||
this.street = res.data.address_reference.town.title;
|
||||
}).catch(err => {
|
||||
uni.showToast({
|
||||
title: err,
|
||||
icon: 'none'
|
||||
})
|
||||
this.street = '定位失败'
|
||||
})
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log('定位失败');
|
||||
this.isshow = false
|
||||
Toast('定位失败,请检查定位权限是否开启')
|
||||
this.street = '定位失败'
|
||||
this.locationInfo.formatted_addresses.recommend = '定位失败'
|
||||
|
||||
// uni.showToast({
|
||||
// title: "获取定位超时",
|
||||
// icon: 'none',
|
||||
// duration: 2000
|
||||
// });
|
||||
}
|
||||
});
|
||||
},
|
||||
reGetLocation() {
|
||||
this.getLoaction()
|
||||
},
|
||||
loadArea() {
|
||||
getArea({
|
||||
city_code: 510500
|
||||
}).then((res) => {
|
||||
this.areaList = res.data;
|
||||
this.changeArea(this.areaList[0]);
|
||||
})
|
||||
},
|
||||
loadStreet(area_code) {
|
||||
this.street_change = '';
|
||||
getStreet({
|
||||
area_code
|
||||
}).then((res) => {
|
||||
this.streetList = res.data;
|
||||
this.initPinyin();
|
||||
})
|
||||
},
|
||||
initPinyin() {
|
||||
this.mapList = {};
|
||||
this.streetList.forEach((item) => {
|
||||
let str = item.pinyin?.toUpperCase();
|
||||
str = str ? str : '#';
|
||||
if (this.mapList[str]) {
|
||||
this.mapList[str].push(item);
|
||||
} else {
|
||||
this.mapList[str] = [];
|
||||
this.mapList[str].push(item)
|
||||
}
|
||||
})
|
||||
},
|
||||
changeArea(item) {
|
||||
this.area_change = item.code;
|
||||
this.loadStreet(this.area_change);
|
||||
},
|
||||
// 选择位置
|
||||
changeStreet(item) {
|
||||
uni.navigateBack({
|
||||
success: () => {
|
||||
uni.$emit('changeAddress', {
|
||||
area: this.area_change,
|
||||
street: item
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 点击地图
|
||||
handleMapTap(e) {
|
||||
// console.log('点击地图', e);
|
||||
// #ifdef H5
|
||||
return Toast('H5暂不支持选择坐标');
|
||||
// #endif
|
||||
let longitude = e.detail.longitude;
|
||||
let latitude = e.detail.latitude;
|
||||
this.markers.longitude = longitude;
|
||||
this.markers.latitude = latitude;
|
||||
// console.log('修改成功', this.markers);
|
||||
getGeocoder({
|
||||
lat: latitude,
|
||||
long: longitude
|
||||
}).then(res => {
|
||||
// console.log(res);
|
||||
this.locationInfo = res.data;
|
||||
}).catch(err => {
|
||||
uni.showToast({
|
||||
title: err,
|
||||
icon: 'none'
|
||||
})
|
||||
this.locationInfo = {};
|
||||
this.locationInfo.formatted_addresses = {};
|
||||
this.locationInfo.formatted_addresses.recommend = '定位失败'
|
||||
})
|
||||
},
|
||||
submitAddress() {
|
||||
console.log(this.locationInfo);
|
||||
try {
|
||||
this.town = this.locationInfo.address_reference.town.title;
|
||||
this.street_id = this.locationInfo.address_reference.town.id;
|
||||
this.street = this.locationInfo.address_reference.town.title;
|
||||
let obj = {
|
||||
area: this.locationInfo.ad_info.adcode,
|
||||
street: {
|
||||
name: this.street,
|
||||
code: this.street_id
|
||||
},
|
||||
latitude: this.latitude,
|
||||
longitude: this.longitude
|
||||
}
|
||||
console.log({
|
||||
...obj
|
||||
});
|
||||
uni.navigateBack({
|
||||
success: () => {
|
||||
uni.$emit('changeAddress', obj)
|
||||
}
|
||||
})
|
||||
} catch (e) {
|
||||
return Toast('地址有误,请重新选择')
|
||||
}
|
||||
},
|
||||
searchMap() {
|
||||
uni.request({
|
||||
url: 'https://restapi.amap.com/v3/place/text?keywords=北京大学&city=beijing&offset=20&page=1&key=0799f37420c0784f1e6cba230a68bdb1&extensions=all',
|
||||
success: (res) => {
|
||||
console.log(res);
|
||||
},
|
||||
fail: (e) => {
|
||||
console.log(e);
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
uni.stopPullDownRefresh()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* page {
|
||||
background-color: #fff;
|
||||
} */
|
||||
|
||||
.text {
|
||||
font-size: 28rpx;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.head_top {
|
||||
background-color: #fff;
|
||||
padding: 28rpx;
|
||||
}
|
||||
|
||||
.address-box {
|
||||
border-radius: 21rpx 21rpx 0rpx 0rpx;
|
||||
padding: 30rpx 28rpx;
|
||||
width: 750rpx;
|
||||
}
|
||||
|
||||
.head_item {
|
||||
width: 750rpx;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 28rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.re-location {
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
width: 480rpx;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.re-address-img {
|
||||
width: 38.55rpx;
|
||||
height: 38.55rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.re-btn {
|
||||
flex-direction: row;
|
||||
padding-left: 10rpx;
|
||||
width: 200rpx;
|
||||
height: 100rpx;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.head_item_tips {
|
||||
height: 44rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #737373;
|
||||
}
|
||||
|
||||
.address-list {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
height: 80rpx;
|
||||
line-height: 75rpx;
|
||||
border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.area {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
padding-top: 30rpx;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.area-item {
|
||||
height: 64rpx;
|
||||
/* width: 100px; */
|
||||
background-color: #fff;
|
||||
border-radius: 11rpx 11rpx 11rpx 11rpx;
|
||||
border: 2rpx solid #B3B3B3;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 20rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #737373;
|
||||
margin-bottom: 22rpx;
|
||||
margin-right: 22rpx;
|
||||
}
|
||||
|
||||
.area-item-on {
|
||||
color: #ff6d20;
|
||||
border: 2rpx solid #ff6d20;
|
||||
}
|
||||
|
||||
.street {
|
||||
padding-top: 28rpx;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.letter-item {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.letter {
|
||||
margin-right: 28rpx;
|
||||
font-size: 25rpx;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 400;
|
||||
width: 40rpx;
|
||||
text-align: center;
|
||||
color: #737373;
|
||||
}
|
||||
|
||||
.item-box {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.street-item {
|
||||
width: 100%;
|
||||
padding-bottom: 28rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,410 @@
|
|||
<template>
|
||||
<!-- 播种 -->
|
||||
<view class="content">
|
||||
<view class="card">
|
||||
<u--form labelWidth='130' :model="formData" :rules="rules" ref="form">
|
||||
|
||||
<view class="c-title">喂食信息</view>
|
||||
<view class="c-box">
|
||||
<u-form-item label="饲料种类" prop="user" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入饲料种类" :disabled="mode=='detail'" type="txt"
|
||||
border="none" v-model="formData.user"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="饲料品牌" prop="formData.breed" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入饲料品牌" :disabled="mode=='detail'" type="number"
|
||||
border="none" v-model="formData.breed"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="饲料消耗量(kg)" prop="start_date" @click="openDate" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入饲料消耗量" :disabled="mode=='detail'" type="number"
|
||||
border="none" v-model="formData.breed"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="喂养人员" prop="start_date" @click="openDate" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入喂养人员" :disabled="mode=='detail'" type="number"
|
||||
border="none" v-model="formData.breed"></up-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="喂食时间" prop="start_date" @click="openDate" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请选择时间" suffixIcon="arrow-down"
|
||||
suffix-icon-style="color: #b6b6b6;" readonly border="none" v-model="formData.start_date"
|
||||
style="pointer-events: none;"></up-input>
|
||||
</u-form-item>
|
||||
</view>
|
||||
|
||||
<view class="card-li">
|
||||
<view class="c-title">收获图片</view>
|
||||
<view class="c-box c-box-p">
|
||||
<view class="code-img1">
|
||||
<view class="" v-if="pic.length>0"
|
||||
style="display: flex;flex-direction: row;flex-wrap: wrap;margin-bottom: 30rpx;">
|
||||
<view class="" v-for="(item,i) in pic" style="margin-right: 30rpx;">
|
||||
<view class="">
|
||||
<u-icon name="close" size="15" style="margin-left:120.85rpx;" @click="delimg(i)"
|
||||
v-show="mode=='add'"></u-icon>
|
||||
<u-image :src="item" width="150.85rpx" height="150.85rpx"
|
||||
@click="perviewFn(item)"></u-image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="code-img" v-if="mode=='add'">
|
||||
<view class="" @click="updateImgFn">
|
||||
<view class="carime-icon">
|
||||
<u-image src="/static/img/DJSC.png" width="91.12rpx" height="91.12rpx"></u-image>
|
||||
<view class="">
|
||||
点击上传图片
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="c-title">备注信息</view>
|
||||
<view class="c-box" style="padding: 0 20rpx;">
|
||||
<u-form-item prop="remark" borderBottom>
|
||||
<u--textarea v-model="formData.remark" :disabled="mode=='detail'"
|
||||
placeholder="请输入内容"></u--textarea>
|
||||
</u-form-item>
|
||||
</view>
|
||||
|
||||
|
||||
</u--form>
|
||||
<u-button class="btn" v-if="mode=='add'" @click="addFn">完成添加</u-button>
|
||||
</view>
|
||||
<u-datetime-picker :show="show1" :max-date="getNowTime()" v-model="value1" mode="datetime"
|
||||
@confirm="dateConfirmfn" :formatter="formatter" @cancel="show1=false"></u-datetime-picker>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
Uploads
|
||||
} from "@/api/upload.js"
|
||||
import {
|
||||
reactive,
|
||||
ref
|
||||
} from "vue";
|
||||
import {
|
||||
onLoad,
|
||||
onReady
|
||||
} from "@dcloudio/uni-app"
|
||||
import {
|
||||
addaction
|
||||
} from '@/api/api.js'
|
||||
|
||||
const form = ref(null)
|
||||
const task_id = ref('');
|
||||
const pic = reactive([]);
|
||||
const show1 = ref(false)
|
||||
const formData = reactive({
|
||||
user: "",
|
||||
remark: "",
|
||||
pic: [],
|
||||
start_date: ''
|
||||
})
|
||||
const dateConfirmfn = (e) => {
|
||||
formData.start_date = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM ')
|
||||
show1.value = false
|
||||
}
|
||||
const formatter = (type, value) => {
|
||||
if (type === 'year') {
|
||||
return `${value}年`;
|
||||
}
|
||||
if (type === 'month') {
|
||||
return `${value}月`;
|
||||
}
|
||||
if (type === 'day') {
|
||||
return `${value}日`;
|
||||
}
|
||||
return value;
|
||||
};
|
||||
const rules = {
|
||||
'user': {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请填写参与人',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
// 'remark': {
|
||||
// type: 'string',
|
||||
// required: true,
|
||||
// message: '请填写备注',
|
||||
// trigger: ['blur', 'change']
|
||||
// },
|
||||
}
|
||||
onReady(() => {
|
||||
form.value.setRules(rules);
|
||||
|
||||
});
|
||||
const navgo = (url) => {
|
||||
uni.navigateTo({
|
||||
url
|
||||
})
|
||||
}
|
||||
const openDate = () => {
|
||||
// calendar.value.open()
|
||||
show1.value = true
|
||||
// alert(455)
|
||||
}
|
||||
const value1 = ref(Date.now());
|
||||
const getNowTime = () => {
|
||||
const now = new Date();
|
||||
|
||||
|
||||
const timestamp = now.getTime();
|
||||
// console.log(timestamp)
|
||||
return timestamp
|
||||
|
||||
}
|
||||
const addFn = () => {
|
||||
form.value.validate().then(res => {
|
||||
console.log(res)
|
||||
if (res) {
|
||||
|
||||
|
||||
|
||||
|
||||
formData.pic = pic
|
||||
let data1 = {
|
||||
plant_id: task_id.value,
|
||||
type: 5,
|
||||
detail: JSON.stringify(formData)
|
||||
};
|
||||
if (formData.pic.length == 0) {
|
||||
|
||||
uni.$u.toast('请上传图片')
|
||||
return
|
||||
}
|
||||
|
||||
console.log('表单通过');
|
||||
|
||||
// 表单验证通过，执行提交操作
|
||||
|
||||
addaction(data1).then((res) => {
|
||||
console.log(res)
|
||||
if (res.code == 1) {
|
||||
uni.$u.toast(res.msg)
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
}
|
||||
})
|
||||
// uni.$u.toast('校验成功')
|
||||
}
|
||||
|
||||
}).catch((err) => {
|
||||
uni.$u.toast(err[0].message)
|
||||
console.log(err)
|
||||
})
|
||||
|
||||
|
||||
|
||||
}
|
||||
//查看图片
|
||||
const perviewFn = (url) => {
|
||||
|
||||
uni.previewImage({
|
||||
urls: [url]
|
||||
})
|
||||
}
|
||||
//图片删除
|
||||
const delimg = (i) => {
|
||||
pic.splice(i, 1);
|
||||
}
|
||||
//图片上传
|
||||
const updateImgFn = async () => {
|
||||
|
||||
uni.chooseImage({
|
||||
count: 1,
|
||||
sizeType: ['original', 'compressed'],
|
||||
sourceType: ['album', 'camera'],
|
||||
success: (res) => {
|
||||
Uploads(res.tempFilePaths[0], 'img').then(res => {
|
||||
console.log(res)
|
||||
if (res.code == 1) {
|
||||
pic.push(res.data.url)
|
||||
console.log(data.formData)
|
||||
|
||||
uni.$u.toast('上传成功')
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}).catch(err => {
|
||||
//console.log('err', err);
|
||||
// uni.$u.toast('上传失败')
|
||||
})
|
||||
},
|
||||
fail: function(err) {
|
||||
//console.log('choose失败');
|
||||
uni.$u.toast('添加失败')
|
||||
}
|
||||
});
|
||||
// let res = await Uploads()
|
||||
// data.formData.pic = res.data.image
|
||||
}
|
||||
const mode = ref('add')
|
||||
onLoad((options) => {
|
||||
if (options.task) {
|
||||
let data = options.task ? JSON.parse(decodeURIComponent(options.task)) : null;
|
||||
// console.log(data, data.detail)
|
||||
Object.assign(formData, data.detail);
|
||||
pic.splice(0, pic.length, ...data.detail.pic);
|
||||
|
||||
mode.value = 'detail'
|
||||
uni.setNavigationBarTitle({
|
||||
title: '收获详情'
|
||||
})
|
||||
// formData=data.detail
|
||||
|
||||
|
||||
} else {
|
||||
task_id.value = options.id
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
page {
|
||||
background-color: #f7fffc;
|
||||
}
|
||||
|
||||
.card {
|
||||
background-color: #f7fffc;
|
||||
padding: 0;
|
||||
padding-bottom: 80rpx;
|
||||
|
||||
.c-title {
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 30rpx;
|
||||
padding-bottom: 15rpx;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
height: 0.8rem;
|
||||
width: 6rpx;
|
||||
margin-top: 0.2rem;
|
||||
margin-right: 10rpx;
|
||||
background-color: #feb048;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.c-box {
|
||||
background-color: #fff;
|
||||
padding-left: 30rpx;
|
||||
padding-right: 20rpx;
|
||||
padding-bottom: 20rpx;
|
||||
box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.c-box-p {
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 20rpx auto;
|
||||
width: 694rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 80rpx;
|
||||
background-color: #feb048;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.tit {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.card-li {
|
||||
position: relative;
|
||||
margin-bottom: 0;
|
||||
|
||||
span {
|
||||
position: absolute;
|
||||
left: -9px;
|
||||
color: #f56c6c;
|
||||
line-height: 20px;
|
||||
font-size: 20px;
|
||||
top: 3px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.confim-btn {
|
||||
margin: 0 auto;
|
||||
width: 196.26rpx;
|
||||
height: 66.59rpx;
|
||||
/* border: ; */
|
||||
border: #00A15E 1px solid;
|
||||
color: #00A15E;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
|
||||
}
|
||||
|
||||
.up-img {
|
||||
width: 341.71rpx
|
||||
}
|
||||
|
||||
.today-btn {
|
||||
width: 588.79rpx;
|
||||
background-color: #00A15E;
|
||||
color: white;
|
||||
position: fixed;
|
||||
bottom: 40rpx;
|
||||
/* transform: ; */
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: linear-gradient(to right, #00A15E, #4CC593);
|
||||
/* margin: 0 auto; */
|
||||
}
|
||||
|
||||
.code-img {
|
||||
background-color: #F4F4F4;
|
||||
height: 350.47rpx;
|
||||
position: relative;
|
||||
/* margin-bottom: 100rpx; */
|
||||
|
||||
.carime-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.confirm {
|
||||
position: fixed;
|
||||
height: 84.11rpx;
|
||||
display: flex;
|
||||
bottom: 30rpx;
|
||||
width: 750rpx;
|
||||
|
||||
.confirm-btn {
|
||||
width: 315.42rpx;
|
||||
height: 84.11rpx;
|
||||
border: #00A15E 1px solid;
|
||||
margin: 0 auto;
|
||||
border-radius: 80rpx;
|
||||
text-align: center;
|
||||
line-height: 84rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,162 @@
|
|||
<template>
|
||||
<view style="position: relative;">
|
||||
<view class="top">
|
||||
<view class="" style="height:var(--status-bar-height) ;">
|
||||
</view>
|
||||
<view class="nav-con">
|
||||
<view class="left"></view>
|
||||
<view class="title">
|
||||
牲畜管理
|
||||
</view>
|
||||
<view class="btn" style="margin-top: -5rpx;">
|
||||
<Myindex url='/pages/index/massif' />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="" style="height:var(--status-bar-height) ;">
|
||||
</view>
|
||||
<view class="nav-con">
|
||||
</view>
|
||||
|
||||
<view class="card-list">
|
||||
<block v-for="(item, index) in list" :key="index">
|
||||
<view class="card-box" @click="navTo(item.url)" :style="{backgroundImage: `url(${item.bg})`, color: item.color}">
|
||||
<view class="box-top">
|
||||
<view class="title">{{item.name}}</view>
|
||||
<view class="btn" :style="{border: `2rpx solid ${item.color}`}">点击进入</view>
|
||||
</view>
|
||||
<view class="box-bottom">
|
||||
{{item.tips}}
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Myindex from '@/components/return/index.vue';
|
||||
import { reactive, ref } from 'vue';
|
||||
|
||||
const list = reactive([
|
||||
{
|
||||
name: '栏舍设置',
|
||||
tips: '栏舍新增/详情喂养、记录',
|
||||
bg: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/be364202312191601547849.png',
|
||||
color: '#cc841f',
|
||||
url: '/pages/plantAdmin/house'
|
||||
},
|
||||
{
|
||||
name: '档案管理',
|
||||
tips: '档案新增、档案详情/编辑',
|
||||
bg: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/3246c202312191633441356.png',
|
||||
color: '#1f84cc',
|
||||
url: ''
|
||||
},
|
||||
{
|
||||
name: '转栏记录',
|
||||
tips: '转入/转出舍栏、转栏时间',
|
||||
bg: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/cee51202312191634095436.png',
|
||||
color: '#c36136',
|
||||
url: ''
|
||||
},
|
||||
{
|
||||
name: '离栏记录',
|
||||
tips: '离舍类型/原因、离舍时间',
|
||||
bg: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/3246c202312191633441356.png',
|
||||
color: '#366ecf',
|
||||
url: ''
|
||||
},
|
||||
])
|
||||
|
||||
const navTo = (url: string)=>{
|
||||
if(url) uni.navigateTo({
|
||||
url: url
|
||||
})
|
||||
else uni.showToast({
|
||||
title: '暂未开放',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: $theme-bg-color;
|
||||
}
|
||||
|
||||
.top {
|
||||
background-color: #feb048;
|
||||
position: fixed;
|
||||
z-index: 999999;
|
||||
width: 750rpx;
|
||||
|
||||
}
|
||||
|
||||
.nav-con {
|
||||
width: 100vw;
|
||||
height: 44px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding-top: 20rpx;
|
||||
padding-bottom: 10rpx;
|
||||
color: #fff;
|
||||
.left{
|
||||
flex: 1;
|
||||
}
|
||||
.title{
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
}
|
||||
.btn {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
.card-list {
|
||||
padding: 28rpx;
|
||||
|
||||
.card-box {
|
||||
height: 170rpx;
|
||||
width: 694rpx;
|
||||
background-size: 100% 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 40rpx;
|
||||
margin-bottom: 28rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
font-size: 28rpx;
|
||||
|
||||
.box-top {
|
||||
display: flex;
|
||||
|
||||
.title {
|
||||
font-size: 33rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.btn {
|
||||
height: 50rpx;
|
||||
width: 160rpx;
|
||||
margin-left: 30rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border: 2rpx solid #cc841f;
|
||||
border-radius: 50rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.box-bottom {
|
||||
width: 60%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,411 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
|
||||
<view class="cards">
|
||||
<up-form labelWidth='130' :model="data.formData" ref="form1">
|
||||
<view class="c-title">养殖信息</view>
|
||||
<view class="c-box">
|
||||
<up-form-item label="耳号" prop="title" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入耳号" border="none" v-model="data.formData.title"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="品类" prop="title" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入品类名称" border="none" v-model="data.formData.title"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="品种" prop="area" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入品种名称" border="none" v-model="data.formData.area"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="性别" prop="master_name" borderBottom required @click="showSex=true">
|
||||
<up-input input-align="right" placeholder="请选择性别" border="none" suffixIcon="arrow-down"
|
||||
suffix-icon-style="color: #b6b6b6;" v-model="data.formData.sex" readonly></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="生理阶段" prop="master_phone" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入生理阶段" border="none"
|
||||
v-model="data.formData.master_phone"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="血统纯度" prop="master_phone" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入血统纯度" border="none"
|
||||
v-model="data.formData.master_phone"></up-input>
|
||||
</up-form-item>
|
||||
<block v-if="data.formData.type==1">
|
||||
<up-form-item label="来源" borderBottom>
|
||||
<up-input input-align="right" border="none" v-model="data.formData.type_name" readonly></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="栏舍" prop="master_phone" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入栏舍" border="none"
|
||||
v-model="data.formData.master_phone"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="现估重(kg)" prop="master_phone" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入现估重" type="number" border="none"
|
||||
v-model="data.formData.master_phone"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="入场日期" prop="master_phone" borderBottom required @click="showDate=true">
|
||||
<up-input input-align="right" placeholder="请选择入场日期" border="none" suffixIcon="arrow-down"
|
||||
suffix-icon-style="color: #b6b6b6;" v-model="data.formData.join_date"></up-input>
|
||||
</up-form-item>
|
||||
</block>
|
||||
<block v-else>
|
||||
<up-form-item label="来源" borderBottom>
|
||||
<up-input input-align="right" border="none" v-model="data.formData.type_name" readonly></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="栏舍" prop="master_phone" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入栏舍" border="none"
|
||||
v-model="data.formData.master_phone"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="代数" prop="" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入代数" type="number" border="none"
|
||||
v-model="data.formData.master_phone"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="现估重(kg)" prop="master_phone" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入现估重" type="number" border="none"
|
||||
v-model="data.formData.master_phone"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="出生体重(kg)" prop="master_phone" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入出生体重" type="number" border="none"
|
||||
v-model="data.formData.master_phone"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="出生日期" borderBottom required @click="showDate=true">
|
||||
<up-input input-align="right" placeholder="请选择出生日期" border="none" suffixIcon="arrow-down"
|
||||
suffix-icon-style="color: #b6b6b6;" v-model="data.formData.brith_date"></up-input>
|
||||
</up-form-item>
|
||||
</block>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="card-li">
|
||||
<view class="c-title">养殖场图片</view>
|
||||
<view class="c-box c-box-p">
|
||||
<view class="code-img1">
|
||||
<view class="" v-if="pic.length>0"
|
||||
style="display: flex;flex-direction: row;flex-wrap: wrap;margin-bottom: 30rpx;">
|
||||
<view class="" v-for="(item,i) in pic" style="margin-right: 30rpx;">
|
||||
<view class="">
|
||||
<u-icon name="close" size="15" style="margin-left:120.85rpx;" @click="delimg(i)"></u-icon>
|
||||
<u-image :src="item" width="150.85rpx" height="150.85rpx"></u-image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="code-img">
|
||||
<view class="" @click="updateImgFn">
|
||||
<view class="carime-icon">
|
||||
<u-image src="/static/img/DJSC.png" width="91.12rpx" height="91.12rpx"></u-image>
|
||||
<view class="">
|
||||
点击上传图片
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</up-form>
|
||||
<u-action-sheet :show="showSex" keyName="name" closeOnClickOverlay :actions="[{name:'公'}, {name:'母'}]" title="请选择"
|
||||
@close="showSex = false" @select="selectSex"></u-action-sheet>
|
||||
<u-datetime-picker :show="showDate" :max-date="Date.now()" mode="date" v-model="changeTime"
|
||||
@confirm="selectDate" :formatter="formatter" @cancel="showDate=false"></u-datetime-picker>
|
||||
<u-button class="btn" @click="submit">提交</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
onMounted,
|
||||
unref,
|
||||
computed,
|
||||
watch
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad,
|
||||
onReady
|
||||
} from '@dcloudio/uni-app';
|
||||
import {
|
||||
Uploads
|
||||
} from "@/api/upload.js"
|
||||
|
||||
const form1 = ref(null);
|
||||
const data = reactive({
|
||||
formData: {
|
||||
title: '',
|
||||
sex: '',
|
||||
type: 1,
|
||||
brith_date: '', //出生日期
|
||||
join_date: '', //入场日期
|
||||
type_name: '购买', // 来源
|
||||
master_name: '',
|
||||
master_phone: '',
|
||||
pic: ['https://img0.baidu.com/it/u=1717510975,3258230326&fm=253&fmt=auto?w=120&h=80',
|
||||
'https://img0.baidu.com/it/u=1717510975,3258230326&fm=253&fmt=auto?w=120&h=80'
|
||||
]
|
||||
},
|
||||
rules: {
|
||||
title: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请填写养殖场名称',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
area: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请填写养殖场面积',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
master_name: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请输入养殖场负责人名称',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
master_phone: [{
|
||||
required: true,
|
||||
message: '请输入手机号',
|
||||
trigger: ['change', 'blur'],
|
||||
},
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
// 上面有说，返回true表示校验通过，返回false表示不通过
|
||||
// uni.$u.test.mobile()就是返回true或者false的
|
||||
return uni.$u.test.mobile(value);
|
||||
},
|
||||
message: '手机号码不正确',
|
||||
// 触发器可以同时用blur和change
|
||||
trigger: ['change', 'blur'],
|
||||
}
|
||||
],
|
||||
}
|
||||
});
|
||||
const pic = reactive([]);
|
||||
|
||||
const showSex = ref(false);
|
||||
const showDate = ref(false);
|
||||
|
||||
//图片删除
|
||||
const delimg = (i) => {
|
||||
pic.splice(i, 1);
|
||||
}
|
||||
|
||||
//图片上传
|
||||
const updateImgFn = async () => {
|
||||
|
||||
uni.chooseImage({
|
||||
count: 1,
|
||||
sizeType: ['original', 'compressed'],
|
||||
sourceType: ['album', 'camera'],
|
||||
success: (res) => {
|
||||
Uploads(res.tempFilePaths[0], 'img').then(res => {
|
||||
// console.log(res)
|
||||
if (res.code == 1) {
|
||||
pic.push(res.data.url)
|
||||
console.log(data.formData)
|
||||
|
||||
uni.$u.toast('上传成功')
|
||||
|
||||
}
|
||||
|
||||
}).catch(err => {
|
||||
//console.log('err', err);
|
||||
// uni.$u.toast('上传失败')
|
||||
})
|
||||
},
|
||||
fail: function(err) {
|
||||
//console.log('choose失败');
|
||||
uni.$u.toast('添加失败')
|
||||
}
|
||||
});
|
||||
// let res = await Uploads()
|
||||
// data.formData.pic = res.data.image
|
||||
}
|
||||
|
||||
const selectSex = (e)=>{
|
||||
data.formData.sex = e.name;
|
||||
}
|
||||
|
||||
const changeTime = ref(Date.now())
|
||||
const selectDate = (e)=>{
|
||||
let date = new Date(e.value);
|
||||
if(data.formData.type>1) data.formData.brith_date = `${date.getFullYear()}-${date.getMonth()+1}-${date.getDate()}`;
|
||||
else data.formData.join_date = `${date.getFullYear()}-${date.getMonth()+1}-${date.getDate()}`;
|
||||
showDate.value = false;
|
||||
}
|
||||
|
||||
onReady(() => {
|
||||
form1.value.setRules(data.rules);
|
||||
});
|
||||
|
||||
const formatter = (type, value) => {
|
||||
if (type === 'year') {
|
||||
return `${value}年`;
|
||||
}
|
||||
if (type === 'month') {
|
||||
return `${value}月`;
|
||||
}
|
||||
if (type === 'day') {
|
||||
return `${value}日`;
|
||||
}
|
||||
return value;
|
||||
};
|
||||
|
||||
const submit = async () => {
|
||||
try {
|
||||
const valid = await form1.value.validate();
|
||||
if (valid) {
|
||||
// console.log('表单通过', data.formData);
|
||||
if (pic.length == 0) {
|
||||
|
||||
uni.$u.toast('请上传图片')
|
||||
return
|
||||
}
|
||||
data.formData.pic = JSON.stringify(pic)
|
||||
|
||||
|
||||
// 表单验证通过，执行提交操作
|
||||
addland(data.formData).then((res) => {
|
||||
console.log(res)
|
||||
if (res.code == 1) {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
uni.$u.toast(res.msg)
|
||||
// console.log('提交通过');
|
||||
}
|
||||
})
|
||||
} else {
|
||||
// 表单验证不通过
|
||||
console.log('表单验证未通过');
|
||||
}
|
||||
} catch (error) {
|
||||
// 捕获验证过程中的错误
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
|
||||
onLoad((options) => {
|
||||
if (options.type > 1) {
|
||||
data.formData.type = +options.type;
|
||||
data.formData.type_name = options.name;
|
||||
} else {
|
||||
data.formData.type = 1;
|
||||
data.formData.type_name = '购买';
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fffcf5;
|
||||
|
||||
}
|
||||
|
||||
.cards {
|
||||
background-color: #fffcf5;
|
||||
padding: 0;
|
||||
padding-bottom: 80rpx;
|
||||
|
||||
.c-title {
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 30rpx;
|
||||
padding-bottom: 15rpx;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
height: 0.8rem;
|
||||
width: 6rpx;
|
||||
margin-top: 0.2rem;
|
||||
margin-right: 10rpx;
|
||||
background-color: #feb048;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.c-box {
|
||||
background-color: #fff;
|
||||
padding-left: 30rpx;
|
||||
padding-right: 20rpx;
|
||||
padding-bottom: 20rpx;
|
||||
box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.c-box-p {
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 20rpx auto;
|
||||
width: 694rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 80rpx;
|
||||
background-color: #ffb049;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.card-li-tit {
|
||||
position: relative;
|
||||
|
||||
span {
|
||||
position: absolute;
|
||||
left: -9px;
|
||||
color: #f56c6c;
|
||||
line-height: 20px;
|
||||
font-size: 20px;
|
||||
top: 3px;
|
||||
}
|
||||
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.confim-btn {
|
||||
margin: 0 auto;
|
||||
width: 196.26rpx;
|
||||
height: 66.59rpx;
|
||||
/* border: ; */
|
||||
border: #00A15E 1px solid;
|
||||
color: #00A15E;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
|
||||
}
|
||||
|
||||
.up-img {
|
||||
width: 341.71rpx
|
||||
}
|
||||
|
||||
.today-btn {
|
||||
width: 588.79rpx;
|
||||
background-color: #00A15E;
|
||||
color: white;
|
||||
position: fixed;
|
||||
bottom: 40rpx;
|
||||
/* transform: ; */
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: linear-gradient(to right, #00A15E, #4CC593);
|
||||
/* margin: 0 auto; */
|
||||
}
|
||||
|
||||
.code-img {
|
||||
background-color: #F4F4F4;
|
||||
height: 350.47rpx;
|
||||
position: relative;
|
||||
|
||||
.carime-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,543 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
|
||||
<view class="cards">
|
||||
<up-form labelWidth='130' :model="data.formData" ref="form1">
|
||||
|
||||
<view class="c-title">栏舍信息</view>
|
||||
<view class="c-box">
|
||||
<up-form-item label="栏舍名称" prop="title" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入栏舍名称" border="none"
|
||||
v-model="data.formData.title"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="动物类型" prop="title" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入动物类型" border="none"
|
||||
v-model="data.formData.title"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="栏舍类型" prop="area" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入栏舍类型" border="none"
|
||||
v-model="data.formData.area"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="容量" prop="master_name" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入栏舍容量" border="none"
|
||||
v-model="data.formData.master_name"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="负责人" prop="master_phone" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入负责人姓名" type="number" border="none"
|
||||
v-model="data.formData.master_phone"></up-input>
|
||||
</up-form-item>
|
||||
<up-form-item label="负责人电话" prop="master_phone" borderBottom required>
|
||||
<up-input input-align="right" placeholder="请输入负责人电话" type="number" border="none"
|
||||
v-model="data.formData.master_phone"></up-input>
|
||||
</up-form-item>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="card-li">
|
||||
<view class="c-title">养殖场图片</view>
|
||||
<view class="c-box c-box-p">
|
||||
<view class="code-img1">
|
||||
<view class="" v-if="pic.length>0"
|
||||
style="display: flex;flex-direction: row;flex-wrap: wrap;margin-bottom: 30rpx;">
|
||||
<view class="" v-for="(item,i) in pic" style="margin-right: 30rpx;">
|
||||
<view class="">
|
||||
<u-icon name="close" size="15" style="margin-left:120.85rpx;"
|
||||
@click="delimg(i)"></u-icon>
|
||||
<u-image :src="item" width="150.85rpx" height="150.85rpx"></u-image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="code-img">
|
||||
<view class="" @click="updateImgFn">
|
||||
<view class="carime-icon">
|
||||
<u-image src="/static/img/DJSC.png" width="91.12rpx" height="91.12rpx"></u-image>
|
||||
<view class="">
|
||||
点击上传图片
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</up-form>
|
||||
<u-action-sheet :show="show" keyName="name" closeOnClickOverlay :actions="columns" title="请选择"
|
||||
@close="show = false" @select="leavaType1">
|
||||
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show1" keyName="name" :actions="columns1" title="请选择" @close="show1 = false"
|
||||
@select="leavaType2">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show2" keyName="name" :actions="columns2" title="请选择" @close="show2 = false"
|
||||
@select="leavaType3">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show3" keyName="name" :actions="columns3" title="请选择" @close="show3 = false"
|
||||
@select="leavaType4">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show4" keyName="name" :actions="columns4" title="请选择" @close="show4 = false"
|
||||
@select="leavaType5">
|
||||
</u-action-sheet>
|
||||
<u-action-sheet :show="show5" keyName="name" :actions="columns5" title="请选择" @close="show5 = false"
|
||||
@select="leavaType6">
|
||||
</u-action-sheet>
|
||||
<u-button class="btn" @click="submit">提交</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
onMounted,
|
||||
unref,
|
||||
computed,
|
||||
watch
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad,
|
||||
onReady
|
||||
} from '@dcloudio/uni-app';
|
||||
import {
|
||||
Uploads
|
||||
} from "@/api/upload.js"
|
||||
import {
|
||||
addland,
|
||||
province,
|
||||
city,
|
||||
county,
|
||||
towns,
|
||||
villages,
|
||||
groups
|
||||
} from '@/api/api.js'
|
||||
|
||||
const form1 = ref(null);
|
||||
const data = reactive({
|
||||
formData: {
|
||||
title: '',
|
||||
area: '',
|
||||
province_code: '',
|
||||
city_code: '',
|
||||
county_code: '',
|
||||
address: '',
|
||||
lat: "",
|
||||
lon: "",
|
||||
master_name: '',
|
||||
master_phone: '',
|
||||
pic: ['https://img0.baidu.com/it/u=1717510975,3258230326&fm=253&fmt=auto?w=120&h=80',
|
||||
'https://img0.baidu.com/it/u=1717510975,3258230326&fm=253&fmt=auto?w=120&h=80'
|
||||
]
|
||||
},
|
||||
rules: {
|
||||
// name: [{
|
||||
// required: true,
|
||||
// message: '请输入姓名',
|
||||
// // 可以单个或者同时写两个触发验证方式
|
||||
// trigger: ['change', 'blur'],
|
||||
// }],
|
||||
// intro: [{
|
||||
// min: 5,
|
||||
// message: '简介不能少于5个字',
|
||||
// trigger: 'change'
|
||||
// }],
|
||||
title: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请填写养殖场名称',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
area: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请填写养殖场面积',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
province_code: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请请选择所在省份',
|
||||
trigger: 'change'
|
||||
}],
|
||||
city_code: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择所在城市',
|
||||
trigger: 'change'
|
||||
}],
|
||||
county_code: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择所在区县',
|
||||
trigger: 'change'
|
||||
}],
|
||||
address: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请输入养殖场详细地址',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
master_name: [{
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请输入养殖场负责人名称',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
master_phone: [{
|
||||
required: true,
|
||||
message: '请输入手机号',
|
||||
trigger: ['change', 'blur'],
|
||||
},
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
// 上面有说，返回true表示校验通过，返回false表示不通过
|
||||
// uni.$u.test.mobile()就是返回true或者false的
|
||||
return uni.$u.test.mobile(value);
|
||||
},
|
||||
message: '手机号码不正确',
|
||||
// 触发器可以同时用blur和change
|
||||
trigger: ['change', 'blur'],
|
||||
}
|
||||
],
|
||||
|
||||
}
|
||||
});
|
||||
const pic = reactive([]);
|
||||
const province_name = ref(null)
|
||||
const city_name = ref(null)
|
||||
const county_name = ref(null)
|
||||
|
||||
const show = ref(false)
|
||||
const show1 = ref(false)
|
||||
const show2 = ref(false)
|
||||
const columns = reactive([])
|
||||
const columns1 = reactive([])
|
||||
const columns2 = reactive([])
|
||||
|
||||
|
||||
const provincen = () => {
|
||||
province().then((res) => {
|
||||
columns.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.province_name,
|
||||
id: step.province_code,
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const cityn = (id) => {
|
||||
|
||||
city({
|
||||
province_code: id
|
||||
}).then((res) => {
|
||||
columns1.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.city_name,
|
||||
id: step.city_code,
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
const countyn = (id) => {
|
||||
county({
|
||||
city_code: id
|
||||
|
||||
}).then((res) => {
|
||||
columns2.splice(0, columns.length, ...res.data.map((step, index) => {
|
||||
return {
|
||||
name: step.county_name,
|
||||
id: step.county_code,
|
||||
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
//图片删除
|
||||
const delimg = (i) => {
|
||||
pic.splice(i, 1);
|
||||
}
|
||||
|
||||
//图片上传
|
||||
const updateImgFn = async () => {
|
||||
|
||||
uni.chooseImage({
|
||||
count: 1,
|
||||
sizeType: ['original', 'compressed'],
|
||||
sourceType: ['album', 'camera'],
|
||||
success: (res) => {
|
||||
Uploads(res.tempFilePaths[0], 'img').then(res => {
|
||||
// console.log(res)
|
||||
if (res.code == 1) {
|
||||
pic.push(res.data.url)
|
||||
console.log(data.formData)
|
||||
|
||||
uni.$u.toast('上传成功')
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}).catch(err => {
|
||||
//console.log('err', err);
|
||||
// uni.$u.toast('上传失败')
|
||||
})
|
||||
},
|
||||
fail: function(err) {
|
||||
//console.log('choose失败');
|
||||
uni.$u.toast('添加失败')
|
||||
}
|
||||
});
|
||||
// let res = await Uploads()
|
||||
// data.formData.pic = res.data.image
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 地址 省 市 街道 乡村 小队
|
||||
|
||||
const isshow1 = () => {
|
||||
show.value = true
|
||||
}
|
||||
const isshow2 = () => {
|
||||
|
||||
show1.value = true
|
||||
}
|
||||
const isshow3 = () => {
|
||||
show2.value = true
|
||||
}
|
||||
const isshow4 = () => {
|
||||
show3.value = true
|
||||
}
|
||||
const isshow5 = () => {
|
||||
show4.value = true
|
||||
|
||||
}
|
||||
const isshow6 = () => {
|
||||
show5.value = true
|
||||
}
|
||||
|
||||
const leavaType1 = (e) => {
|
||||
|
||||
province_name.value = e.name
|
||||
data.formData.province_code = e.id
|
||||
cityn(e.id)
|
||||
|
||||
}
|
||||
const leavaType2 = (e) => {
|
||||
city_name.value = e.name
|
||||
data.formData.city_code = e.id
|
||||
countyn(e.id)
|
||||
}
|
||||
|
||||
const leavaType3 = (e) => {
|
||||
county_name.value = e.name
|
||||
data.formData.county_code = e.id
|
||||
|
||||
}
|
||||
const location = () => {
|
||||
|
||||
uni.showLoading({
|
||||
title: '获取位置中'
|
||||
})
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
geocode: true,
|
||||
isHighAccuracy: true,
|
||||
success: async (res) => {
|
||||
console.log(res)
|
||||
|
||||
|
||||
data.formData.lat = res.latitude
|
||||
data.formData.lon = res.longitude
|
||||
|
||||
data.formData.address = res.address.street + res
|
||||
.address.streetNum + res.address.poiName
|
||||
|
||||
uni.hideLoading();
|
||||
|
||||
console.log(data.formData)
|
||||
},
|
||||
fail: (err) => {
|
||||
// uni.hideLoading();
|
||||
console.log(err)
|
||||
console.log("erer")
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
onReady(() => {
|
||||
form1.value.setRules(data.rules);
|
||||
|
||||
});
|
||||
|
||||
|
||||
const submit = async () => {
|
||||
try {
|
||||
const valid = await form1.value.validate();
|
||||
if (valid) {
|
||||
// console.log('表单通过', data.formData);
|
||||
if (pic.length == 0) {
|
||||
|
||||
uni.$u.toast('请上传图片')
|
||||
return
|
||||
}
|
||||
data.formData.pic = JSON.stringify(pic)
|
||||
|
||||
|
||||
// 表单验证通过，执行提交操作
|
||||
addland(data.formData).then((res) => {
|
||||
console.log(res)
|
||||
if (res.code == 1) {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
uni.$u.toast(res.msg)
|
||||
// console.log('提交通过');
|
||||
}
|
||||
})
|
||||
} else {
|
||||
// 表单验证不通过
|
||||
console.log('表单验证未通过');
|
||||
}
|
||||
} catch (error) {
|
||||
// 捕获验证过程中的错误
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
|
||||
onLoad((options) => {
|
||||
|
||||
provincen()
|
||||
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fffcf5;
|
||||
|
||||
}
|
||||
|
||||
.cards {
|
||||
background-color: #fffcf5;
|
||||
padding: 0;
|
||||
padding-bottom: 80rpx;
|
||||
|
||||
.c-title {
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 30rpx;
|
||||
padding-bottom: 15rpx;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
height: 0.8rem;
|
||||
width: 6rpx;
|
||||
margin-top: 0.2rem;
|
||||
margin-right: 10rpx;
|
||||
background-color: #feb048;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.c-box {
|
||||
background-color: #fff;
|
||||
padding-left: 30rpx;
|
||||
padding-right: 20rpx;
|
||||
padding-bottom: 20rpx;
|
||||
box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.c-box-p {
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 20rpx auto;
|
||||
width: 694rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 80rpx;
|
||||
background-color: #ffb049;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.card-li-tit {
|
||||
position: relative;
|
||||
|
||||
span {
|
||||
position: absolute;
|
||||
left: -9px;
|
||||
color: #f56c6c;
|
||||
line-height: 20px;
|
||||
font-size: 20px;
|
||||
top: 3px;
|
||||
}
|
||||
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.confim-btn {
|
||||
margin: 0 auto;
|
||||
width: 196.26rpx;
|
||||
height: 66.59rpx;
|
||||
/* border: ; */
|
||||
border: #00A15E 1px solid;
|
||||
color: #00A15E;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
|
||||
}
|
||||
|
||||
.up-img {
|
||||
width: 341.71rpx
|
||||
}
|
||||
|
||||
.today-btn {
|
||||
width: 588.79rpx;
|
||||
background-color: #00A15E;
|
||||
color: white;
|
||||
position: fixed;
|
||||
bottom: 40rpx;
|
||||
/* transform: ; */
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: linear-gradient(to right, #00A15E, #4CC593);
|
||||
/* margin: 0 auto; */
|
||||
}
|
||||
|
||||
.code-img {
|
||||
background-color: #F4F4F4;
|
||||
height: 350.47rpx;
|
||||
position: relative;
|
||||
|
||||
.carime-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,432 @@
|
|||
<template>
|
||||
<view class="box">
|
||||
<view class="content">
|
||||
|
||||
<view class="" style="display: flex;justify-content: space-between;margin-bottom: 20rpx;">
|
||||
<view class="tit" style="margin-bottom: 0;">
|
||||
栏舍监控数据
|
||||
</view>
|
||||
<view class="" style="display: flex;align-items: center;">
|
||||
<u-icon name="clock" style="margin-right: 10rpx;"></u-icon>
|
||||
<text style="color: #ACACAC;font-size: 25rpx;">刷新时间: {{getNowTimeFn()}} </text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="video" @click="navTo('/pages/live/live')">
|
||||
<u--image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/91fb0202311021455371420.jpg" width="100%"
|
||||
height="300rpx"></u--image>
|
||||
</view>
|
||||
|
||||
<breedInfo :info='dataobj'></breedInfo>
|
||||
|
||||
<view class="add-btn">
|
||||
<view class="add-thing" @click="addshowPicke(2)" style="width: 694rpx;">
|
||||
新增喂养
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="">
|
||||
<view class="tit tit-more" style="margin: 20rpx 0;">
|
||||
<view>喂养信息</view>
|
||||
<view class="more">查看更多 <u-icon name="arrow-right"></u-icon> </view>
|
||||
</view>
|
||||
<block class="" v-if="feedDataList.length>0">
|
||||
<view class="thing-card" v-for="(item,index) in feedDataList" :key="index">
|
||||
<view class="card_body">
|
||||
<view class="left">
|
||||
<u--image @click="perviewFn(item.img)" radius='10' :src="item.img" width="200rpx"
|
||||
height="200rpx"></u--image>
|
||||
</view>
|
||||
<u--image src="/static/main/house/xia_yi_ji_btn.png" class="next" width="38rpx" height="38rpx"></u--image>
|
||||
<view class="right" style="color: #7B7B7B;" @click="navtoForm(item,i)">
|
||||
<view class="r-item">
|
||||
<view class="item-title">操作类型:</view>
|
||||
<view>喂食</view>
|
||||
</view>
|
||||
<view class="r-item">
|
||||
<view class="item-title">操作人员:</view>
|
||||
<view>赵桑</view>
|
||||
</view>
|
||||
<view class="r-item">
|
||||
<view class="item-title">操作日期:</view>
|
||||
<view>2023-12-20</view>
|
||||
</view>
|
||||
<view class="r-item" style="height: 80rpx;">
|
||||
<view class="item-title">备注:</view>
|
||||
<view class="row2">栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<view class="coneng-detail" v-else>
|
||||
<view class="">
|
||||
<image src="@/static/img/zw.png" mode="aspectFit"></image>
|
||||
<view class="">
|
||||
暂无数据
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<u-action-sheet :show="show" keyName="name" closeOnClickOverlay :actions="selectList" title="请选择"
|
||||
@close="show = false" @select="selectOne">
|
||||
</u-action-sheet>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import breedInfo from "@/components/plant/breedInfo.vue"
|
||||
import {
|
||||
ref,
|
||||
reactive
|
||||
} from "vue"
|
||||
|
||||
import {
|
||||
plantlist,
|
||||
landdetail
|
||||
} from '@/api/api.js'
|
||||
|
||||
import {
|
||||
onLoad,
|
||||
onShow
|
||||
} from "@dcloudio/uni-app"
|
||||
const dataList = reactive([{
|
||||
name: '栏舍一号',
|
||||
img: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/91fb0202311021455371420.jpg',
|
||||
animal_name: '山羊',
|
||||
animal_type: '哺乳动物',
|
||||
capacity: '50只',
|
||||
create_by: '张三',
|
||||
create_time: '2023-12-19',
|
||||
qr_code: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/76751202312201347169905.png',
|
||||
showCode: false
|
||||
}])
|
||||
const feedDataList = reactive([{
|
||||
name: '栏舍一号',
|
||||
img: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/91fb0202311021455371420.jpg',
|
||||
animal_name: '山羊',
|
||||
animal_type: '哺乳动物',
|
||||
capacity: '50只',
|
||||
create_by: '张三',
|
||||
create_time: '2023-12-19',
|
||||
qr_code: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/76751202312201347169905.png',
|
||||
showCode: false
|
||||
}])
|
||||
const dataobj = reactive({})
|
||||
const typeID = ref('')
|
||||
|
||||
const columns = reactive([
|
||||
[{
|
||||
label: '种植',
|
||||
route: "/pages/husbandryForm/sow"
|
||||
}, {
|
||||
label: '施肥',
|
||||
route: "/pages/husbandryForm/fertilize"
|
||||
}, {
|
||||
label: '除草',
|
||||
route: "/pages/husbandryForm/weeding"
|
||||
}, {
|
||||
label: '灌溉',
|
||||
route: "/pages/husbandryForm/irrigate"
|
||||
}, {
|
||||
label: '除虫',
|
||||
route: "/pages/husbandryForm/Pest"
|
||||
}, {
|
||||
label: '收获',
|
||||
route: "/pages/husbandryForm/harvest"
|
||||
}]
|
||||
]);
|
||||
|
||||
onLoad((option) => {
|
||||
typeID.value = option.id;
|
||||
});
|
||||
onShow(() => {
|
||||
// getlist();
|
||||
// getlist1();
|
||||
})
|
||||
|
||||
const getlist1 = () => {
|
||||
landdetail({
|
||||
land_id: typeID.value
|
||||
}).then((res) => {
|
||||
if (res.code == 1) {
|
||||
Object.assign(dataobj, res.data);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
const getlist = () => {
|
||||
plantlist({
|
||||
land_id: typeID.value
|
||||
}).then((res) => {
|
||||
|
||||
if (res.code == 1) {
|
||||
dataList.splice(0, dataList.length, ...res.data);
|
||||
dataList.forEach(item => {
|
||||
item.showCode = false
|
||||
})
|
||||
console.log(dataList)
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const show = ref(false);
|
||||
const selectList = ref([]);
|
||||
const navType = ref(1);
|
||||
//新增种植
|
||||
const addshowPicke = (type=1) => {
|
||||
if(type==1){
|
||||
selectList.value = [
|
||||
{name: '购买'},
|
||||
{name: '自繁'},
|
||||
];
|
||||
}else {
|
||||
selectList.value = [
|
||||
{name: '喂食'},
|
||||
{name: '喂水'},
|
||||
{name: '消毒'},
|
||||
{name: '疫苗'},
|
||||
{name: '驱虫'},
|
||||
];
|
||||
}
|
||||
navType.value = type;
|
||||
show.value = true;
|
||||
}
|
||||
|
||||
const selectOne = (e)=>{
|
||||
if(navType.value==1){
|
||||
navTo(`/pages/plantAdmin/addBreed?name=${e.name}&type=${e.name=='购买'?1:2}`)
|
||||
}
|
||||
}
|
||||
|
||||
//跳转
|
||||
const navTo = (url) => {
|
||||
uni.navigateTo({
|
||||
url
|
||||
})
|
||||
}
|
||||
const navtoForm = (item, type) => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/landDetail/tudi?data=' + item.id
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
const getNowTimeFn = () => {
|
||||
const now = new Date();
|
||||
const hour = now.getHours();
|
||||
const minute = now.getMinutes();
|
||||
const formattedHour = hour < 10 ? '0' + hour : hour;
|
||||
const formattedMinute = minute < 10 ? '0' + minute : minute;
|
||||
const currentTime = formattedHour + ':' + formattedMinute;
|
||||
return currentTime
|
||||
}
|
||||
//查看
|
||||
const perviewFn = (url) => {
|
||||
uni.previewImage({
|
||||
urls: [url]
|
||||
})
|
||||
}
|
||||
|
||||
let img = ''
|
||||
let codeImg = ''
|
||||
const showCodeFn = (i) => {
|
||||
// dataList[i].showCode != dataList[i].showCode
|
||||
dataList[i].showCode = !dataList[i].showCode
|
||||
console.log(dataList[i].showCode)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.box {
|
||||
width: 750rpx;
|
||||
min-height: 100vh;
|
||||
background-color: $theme-bg-color;
|
||||
padding: 0;
|
||||
|
||||
.content {
|
||||
width: 693.93rpx;
|
||||
margin: auto;
|
||||
padding-top: 20rpx;
|
||||
|
||||
.add-btn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.add-thing {
|
||||
height: 90rpx;
|
||||
width: 335rpx;
|
||||
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
|
||||
line-height: 90rpx;
|
||||
text-align: center;
|
||||
color: white;
|
||||
background-color: $theme-main-color;
|
||||
}
|
||||
}
|
||||
|
||||
// padding: 20rpx;
|
||||
.time {
|
||||
display: flex;
|
||||
font-size: 26.29rpx;
|
||||
color: #737373;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.video {
|
||||
// margin-top: 10rpx;
|
||||
border-radius: 14rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.coneng-detail {
|
||||
width: 478rpx;
|
||||
height: 341rpx;
|
||||
// background: #FFFFFF;
|
||||
border-radius: 6px 6px 6px 6px;
|
||||
opacity: 1;
|
||||
font-size: 25rpx;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #737373;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
margin: 70rpx auto;
|
||||
|
||||
image {
|
||||
width: 280rpx;
|
||||
height: 142rpx;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.thing-card {
|
||||
width: 693.93rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
margin-bottom: 30rpx;
|
||||
box-shadow: 1rpx 1rpx 10rpx 1rpx rgba(0, 0, 0, 0.1);
|
||||
|
||||
.head {
|
||||
height: 90rpx;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
background-color: $theme-main-color;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
line-height: 90rpx;
|
||||
color: white;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
.card_body {
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
.next {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
right: 20rpx;
|
||||
}
|
||||
|
||||
.left {
|
||||
flex-shrink: 0;
|
||||
position: relative;
|
||||
.qr-code{
|
||||
position: absolute;
|
||||
right: 10rpx;
|
||||
bottom: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
margin-left: 20rpx;
|
||||
|
||||
.name {
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.r-item {
|
||||
font-size: 28rpx;
|
||||
display: flex;
|
||||
|
||||
.item-title {
|
||||
color: #333;
|
||||
flex-shrink: 0;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.row2 {
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 2;
|
||||
/* 设置为需要显示的行数 */
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tit {
|
||||
position: relative;
|
||||
padding-left: 20rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.tit-more {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.more {
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
.tit::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
left: 0;
|
||||
width: 3px;
|
||||
/* 左边框的宽度 */
|
||||
height: 30rpx;
|
||||
background-color: #FFB049;
|
||||
}
|
||||
|
||||
.code-btn {
|
||||
border: 1px solid $theme-main-color;
|
||||
border-radius: 30rpx;
|
||||
padding: 3rpx 20rpx;
|
||||
color: $theme-main-color;
|
||||
position: absolute;
|
||||
right: 20rpx;
|
||||
}
|
||||
|
||||
.actBtn {
|
||||
background: linear-gradient(to right, #FEFFFF 0%, #E8FAF2 100%);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,394 @@
|
|||
<template>
|
||||
<view style="position: relative;">
|
||||
<view class="top">
|
||||
<view class="" style="height:var(--status-bar-height) ;">
|
||||
</view>
|
||||
<view class="nav-con">
|
||||
<view class="left"></view>
|
||||
<view class="title" @click="navBack">
|
||||
<u-icon name="arrow-left" color="#fff" style="margin-right: 10rpx;"></u-icon> <text
|
||||
style="padding-bottom: 5rpx;">栏舍设置</text>
|
||||
</view>
|
||||
<view class="btn" style="margin-top: -5rpx;">
|
||||
<u-icon name="plus" color="#fff" style="margin-right: 20rpx;" @click="navTo('/pages/plantAdmin/addHouse')"></u-icon>
|
||||
<Myindex url='/pages/index/massif' />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="" style="height:var(--status-bar-height) ;">
|
||||
</view>
|
||||
<view class="nav-con">
|
||||
</view>
|
||||
|
||||
<view class="content">
|
||||
<view class="serch">
|
||||
<u-search bgColor="white" :show-action="false" placeholder="请输入栏舍名称" v-model="fomData.keyword" shape="round"
|
||||
:clearabled='false' @change="inputval"></u-search>
|
||||
<view class="ser-text" @click="search">
|
||||
搜索
|
||||
</view>
|
||||
</view>
|
||||
<view class="tits">
|
||||
栏舍信息
|
||||
</view>
|
||||
<view class="card" v-for="(item,index) in datalist" :key="index" @click="navTo('/pages/plantAdmin/houseDetail?id=23')">
|
||||
<image class="img" :src="item.img"></image>
|
||||
<view class="tips">
|
||||
<view class="title">{{item.name}}</view>
|
||||
<view class="item">
|
||||
<view class="tip-name">动物名称: </view>
|
||||
<view>{{item.animal_name}} </view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="tip-name">动物类型: </view>
|
||||
<view>{{item.animal_type}} </view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="tip-name">容量: </view>
|
||||
<view>{{item.capacity}} </view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="tip-name">创建人: </view>
|
||||
<view>{{item.create_by}} </view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="tip-name">创建时间: </view>
|
||||
<view>{{item.create_time}} </view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="coneng-detail" v-if="datalist.length==0">
|
||||
<view class="">
|
||||
<image src="@/static/img/zw.png" mode="aspectFit"></image>
|
||||
<view class="">
|
||||
暂无数据
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
onLoad,
|
||||
onShow,
|
||||
onReachBottom,
|
||||
onPullDownRefresh
|
||||
} from "@dcloudio/uni-app"
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
onMounted
|
||||
} from "vue"
|
||||
import Myindex from '@/components/return/index.vue';
|
||||
import store from "@/store/index.js"
|
||||
import {
|
||||
landlist
|
||||
} from '@/api/api.js'
|
||||
onLoad(() => {
|
||||
if (!store.state.userInfo) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/Login/login'
|
||||
})
|
||||
}
|
||||
})
|
||||
onShow(() => {
|
||||
// list()
|
||||
})
|
||||
onPullDownRefresh(() => {
|
||||
list()
|
||||
uni.stopPullDownRefresh()
|
||||
})
|
||||
onReachBottom(() => {
|
||||
getlist()
|
||||
})
|
||||
const datalist = reactive([
|
||||
{
|
||||
name: '栏舍一号',
|
||||
img: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/91fb0202311021455371420.jpg',
|
||||
animal_name: '山羊',
|
||||
animal_type: '哺乳动物',
|
||||
capacity: '50只',
|
||||
create_by: '张三',
|
||||
create_time: '2023-12-19',
|
||||
}
|
||||
])
|
||||
const fomData = reactive({
|
||||
page_no: 1,
|
||||
page_size: 15,
|
||||
keyword: ''
|
||||
})
|
||||
|
||||
const list = () => {
|
||||
datalist.splice(0)
|
||||
fomData.page_no = 1
|
||||
getlist()
|
||||
}
|
||||
const getlist = () => {
|
||||
// landlist(fomData).then((res) => {
|
||||
// if (res.code == 1) {
|
||||
// datalist.push(...res.data)
|
||||
// fomData.page_no = fomData.page_no + 1;
|
||||
// }
|
||||
// })
|
||||
|
||||
}
|
||||
|
||||
//输入监听
|
||||
const inputval = (e) => {
|
||||
// console.log(e)
|
||||
if (e.length == 0) {
|
||||
list()
|
||||
}
|
||||
}
|
||||
|
||||
//搜索
|
||||
const search = () => {
|
||||
list()
|
||||
}
|
||||
const navTo = (url: string)=>{
|
||||
if(url) uni.navigateTo({
|
||||
url: url
|
||||
})
|
||||
else uni.showToast({
|
||||
title: '暂未开放',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
const navBack = ()=>{
|
||||
uni.navigateBack()
|
||||
}
|
||||
onMounted(() => {
|
||||
// console.log('22222222')
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: $theme-bg-color;
|
||||
}
|
||||
|
||||
.top {
|
||||
background-color: #feb048;
|
||||
position: fixed;
|
||||
z-index: 999999;
|
||||
width: 750rpx;
|
||||
|
||||
}
|
||||
|
||||
.nav-con {
|
||||
width: 100vw;
|
||||
height: 44px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding-top: 20rpx;
|
||||
padding-bottom: 10rpx;
|
||||
color: #fff;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
.header {
|
||||
background-color: #feb048;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 10rpx 0 10rpx 20rpx;
|
||||
}
|
||||
|
||||
.tits {
|
||||
position: relative;
|
||||
padding-left: 20rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.tits::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
left: 0;
|
||||
width: 3px;
|
||||
/* 左边框的宽度 */
|
||||
height: 30rpx;
|
||||
background-color: #FFB049;
|
||||
}
|
||||
|
||||
.content {
|
||||
|
||||
position: relative;
|
||||
padding: 0 20rpx;
|
||||
|
||||
|
||||
// padding-top: 100rpx;
|
||||
|
||||
.head-img {
|
||||
// position: absolute;
|
||||
// display: flex;
|
||||
// top: 0;
|
||||
// right: 10rpx;
|
||||
// margin-top: 20rpx;
|
||||
|
||||
}
|
||||
|
||||
.land {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
line-height: 100rpx;
|
||||
text-align: center;
|
||||
background-color: #fff;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
right: 60rpx;
|
||||
bottom: 130rpx;
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
|
||||
.serch {
|
||||
|
||||
// padding-bottom: 20rpx;
|
||||
box-shadow: 1rpx 1rpx 10rpx 1rpx rgba(0, 0, 0, 0.1);
|
||||
border-radius: 200rpx;
|
||||
position: relative;
|
||||
color: #feb048;
|
||||
font-size: 28rpx;
|
||||
margin-top: 20rpx;
|
||||
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.ser-text {
|
||||
position: absolute;
|
||||
padding-left: 20rpx;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
right: 40rpx;
|
||||
|
||||
}
|
||||
|
||||
.ser-text::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
left: 0;
|
||||
width: 2px;
|
||||
/* 左边框的宽度 */
|
||||
height: 20rpx;
|
||||
background-color: #FFB049;
|
||||
}
|
||||
|
||||
// width: 100%;
|
||||
// height: 100rpx;
|
||||
// background-color: #EAF2EF;
|
||||
// position: absolute;
|
||||
// position: fixed;
|
||||
// display: flex;
|
||||
// top: 0;
|
||||
// // padding-top: calc(70rpx + var(--status-bar-height) + 20rpx);
|
||||
// padding-right: 20rpx;
|
||||
|
||||
|
||||
// .custom-style {
|
||||
// color: #606266;
|
||||
// width: 140rpx;
|
||||
// border-radius: 30rpx;
|
||||
// margin-top: 10rpx;
|
||||
// margin-right: 20rpx;
|
||||
// }
|
||||
|
||||
// z-index: 8888 !important;
|
||||
|
||||
}
|
||||
|
||||
.border-bgc {
|
||||
height: 200rpx;
|
||||
background-color: #feb048;
|
||||
border-radius: 0 0 40rpx 40rpx;
|
||||
position: absolute;
|
||||
width: 750rpx;
|
||||
|
||||
}
|
||||
|
||||
.coneng-detail {
|
||||
width: 478rpx;
|
||||
height: 341rpx;
|
||||
border-radius: 6px 6px 6px 6px;
|
||||
opacity: 1;
|
||||
font-size: 25rpx;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #737373;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
|
||||
margin: 300rpx auto;
|
||||
|
||||
image {
|
||||
width: 280rpx;
|
||||
height: 142rpx;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
position: relative;
|
||||
|
||||
margin: auto;
|
||||
background-color: #FFFFFF;
|
||||
box-sizing: border-box;
|
||||
border-radius: 14rpx;
|
||||
margin-bottom: 40rpx;
|
||||
display: flex;
|
||||
|
||||
.img{
|
||||
width: 250rpx;
|
||||
height: 250rpx;
|
||||
margin-right: 20rpx;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
.tips{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
.title{
|
||||
font-weight: bold;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
.item{
|
||||
display: flex;
|
||||
color: #999;
|
||||
font-size: 28rpx;
|
||||
.tip-name{
|
||||
flex-shrink: 0;
|
||||
color: #333;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,493 @@
|
|||
<template>
|
||||
<view class="box">
|
||||
<view class="content">
|
||||
|
||||
<view class="" style="display: flex;justify-content: space-between;margin-bottom: 20rpx;">
|
||||
<view class="tit" style="margin-bottom: 0;">
|
||||
栏舍监控数据
|
||||
</view>
|
||||
<view class="" style="display: flex;align-items: center;">
|
||||
<u-icon name="clock" style="margin-right: 10rpx;"></u-icon>
|
||||
<text style="color: #ACACAC;font-size: 25rpx;">刷新时间: {{getNowTimeFn()}} </text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="video" @click="navTo('/pages/live/live')">
|
||||
<u--image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/91fb0202311021455371420.jpg" width="100%"
|
||||
height="300rpx"></u--image>
|
||||
</view>
|
||||
|
||||
<landInfo :info='dataobj'></landInfo>
|
||||
|
||||
<view class="add-btn">
|
||||
<view class="add-thing" @click="addshowPicke(1)">
|
||||
新增养殖
|
||||
</view>
|
||||
<view class="add-thing" @click="addshowPicke(2)">
|
||||
新增喂养
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="">
|
||||
<view class="tit tit-more" style="margin: 20rpx 0;">
|
||||
<view>养殖信息</view>
|
||||
<view class="more">查看更多 <u-icon name="arrow-right"></u-icon> </view>
|
||||
</view>
|
||||
<block class="" v-if="dataList.length>0">
|
||||
<view class="thing-card" v-for="(item,index) in dataList" :key="index">
|
||||
<view class="card_body">
|
||||
<view class="left">
|
||||
<u--image @click="perviewFn(item.img)" radius='10' :src="item.img" width="250rpx"
|
||||
height="250rpx"></u--image>
|
||||
<u---image class="qr-code" @click="perviewFn(item.qr_code)" src="/static/main/house/su_yuan_ma_btn.png" width="60rpx" height="60rpx"></u---image>
|
||||
</view>
|
||||
<u--image src="/static/main/house/xia_yi_ji_btn.png" class="next" width="38rpx" height="38rpx" @click="navTo(`/pages/plantAdmin/breedDetail?id=${item.id}`)"></u--image>
|
||||
<view class="right" style="color: #7B7B7B;" @click="navTo(`/pages/plantAdmin/breedDetail?id=${item.id}`)">
|
||||
<view class="name">耳号</view>
|
||||
<view class="r-item">
|
||||
<view class="item-title">品类:</view>
|
||||
<view>黑山羊</view>
|
||||
</view>
|
||||
<view class="r-item">
|
||||
<view class="item-title">品种:</view>
|
||||
<view>山羊</view>
|
||||
</view>
|
||||
<view class="r-item">
|
||||
<view class="item-title">性别:</view>
|
||||
<view>公</view>
|
||||
</view>
|
||||
<view class="r-item">
|
||||
<view class="item-title">栏舍:</view>
|
||||
<view>栏舍一号</view>
|
||||
</view>
|
||||
<view class="r-item">
|
||||
<view class="item-title">来源:</view>
|
||||
<view>购买</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</block>
|
||||
<view class="coneng-detail" v-else>
|
||||
<view class="">
|
||||
<image src="@/static/img/zw.png" mode="aspectFit"></image>
|
||||
<view class="">
|
||||
暂无数据
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="">
|
||||
<view class="tit tit-more" style="margin: 20rpx 0;">
|
||||
<view>喂养信息</view>
|
||||
<view class="more">查看更多 <u-icon name="arrow-right"></u-icon> </view>
|
||||
</view>
|
||||
<block class="" v-if="feedDataList.length>0">
|
||||
<view class="thing-card" v-for="(item,index) in feedDataList" :key="index">
|
||||
<view class="card_body">
|
||||
<view class="left">
|
||||
<u--image @click="perviewFn(item.img)" radius='10' :src="item.img" width="200rpx"
|
||||
height="200rpx"></u--image>
|
||||
</view>
|
||||
<u--image src="/static/main/house/xia_yi_ji_btn.png" class="next" width="38rpx" height="38rpx"></u--image>
|
||||
<view class="right" style="color: #7B7B7B;" @click="navtoForm(item,i)">
|
||||
<view class="r-item">
|
||||
<view class="item-title">操作类型:</view>
|
||||
<view>喂食</view>
|
||||
</view>
|
||||
<view class="r-item">
|
||||
<view class="item-title">操作人员:</view>
|
||||
<view>赵桑</view>
|
||||
</view>
|
||||
<view class="r-item">
|
||||
<view class="item-title">操作日期:</view>
|
||||
<view>2023-12-20</view>
|
||||
</view>
|
||||
<view class="r-item" style="height: 80rpx;">
|
||||
<view class="item-title">备注:</view>
|
||||
<view class="row2">栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号栏舍一号</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<view class="coneng-detail" v-else>
|
||||
<view class="">
|
||||
<image src="@/static/img/zw.png" mode="aspectFit"></image>
|
||||
<view class="">
|
||||
暂无数据
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<u-action-sheet :show="show" keyName="name" closeOnClickOverlay :actions="selectList" title="请选择"
|
||||
@close="show = false" @select="selectOne">
|
||||
</u-action-sheet>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import landInfo from "@/components/plant/landInfo.vue"
|
||||
import {
|
||||
ref,
|
||||
reactive
|
||||
} from "vue"
|
||||
|
||||
import {
|
||||
plantlist,
|
||||
landdetail
|
||||
} from '@/api/api.js'
|
||||
|
||||
import {
|
||||
onLoad,
|
||||
onShow
|
||||
} from "@dcloudio/uni-app"
|
||||
const dataList = reactive([{
|
||||
id: 1,
|
||||
name: '栏舍一号',
|
||||
img: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/91fb0202311021455371420.jpg',
|
||||
animal_name: '山羊',
|
||||
animal_type: '哺乳动物',
|
||||
capacity: '50只',
|
||||
create_by: '张三',
|
||||
create_time: '2023-12-19',
|
||||
qr_code: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/76751202312201347169905.png',
|
||||
showCode: false
|
||||
}])
|
||||
const feedDataList = reactive([{
|
||||
name: '栏舍一号',
|
||||
img: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/91fb0202311021455371420.jpg',
|
||||
animal_name: '山羊',
|
||||
animal_type: '哺乳动物',
|
||||
capacity: '50只',
|
||||
create_by: '张三',
|
||||
create_time: '2023-12-19',
|
||||
qr_code: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/def/76751202312201347169905.png',
|
||||
showCode: false
|
||||
}])
|
||||
const dataobj = reactive({})
|
||||
const typeID = ref('')
|
||||
|
||||
const columns = reactive([
|
||||
[{
|
||||
label: '种植',
|
||||
route: "/pages/husbandryForm/sow"
|
||||
}, {
|
||||
label: '施肥',
|
||||
route: "/pages/husbandryForm/fertilize"
|
||||
}, {
|
||||
label: '除草',
|
||||
route: "/pages/husbandryForm/weeding"
|
||||
}, {
|
||||
label: '灌溉',
|
||||
route: "/pages/husbandryForm/irrigate"
|
||||
}, {
|
||||
label: '除虫',
|
||||
route: "/pages/husbandryForm/Pest"
|
||||
}, {
|
||||
label: '收获',
|
||||
route: "/pages/husbandryForm/harvest"
|
||||
}]
|
||||
]);
|
||||
|
||||
onLoad((option) => {
|
||||
typeID.value = option.id;
|
||||
});
|
||||
onShow(() => {
|
||||
// getlist();
|
||||
// getlist1();
|
||||
})
|
||||
|
||||
const getlist1 = () => {
|
||||
landdetail({
|
||||
land_id: typeID.value
|
||||
}).then((res) => {
|
||||
|
||||
if (res.code == 1) {
|
||||
Object.assign(dataobj, res.data);
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
const getlist = () => {
|
||||
plantlist({
|
||||
land_id: typeID.value
|
||||
}).then((res) => {
|
||||
|
||||
if (res.code == 1) {
|
||||
dataList.splice(0, dataList.length, ...res.data);
|
||||
dataList.forEach(item => {
|
||||
item.showCode = false
|
||||
})
|
||||
console.log(dataList)
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const show = ref(false);
|
||||
const selectList = ref([]);
|
||||
const navType = ref(1);
|
||||
//新增种植
|
||||
const addshowPicke = (type=1) => {
|
||||
if(type==1){
|
||||
selectList.value = [
|
||||
{name: '购买'},
|
||||
{name: '自繁'},
|
||||
];
|
||||
}else {
|
||||
selectList.value = [
|
||||
{name: '喂食'},
|
||||
{name: '喂水'},
|
||||
{name: '消毒'},
|
||||
{name: '疫苗'},
|
||||
{name: '驱虫'},
|
||||
];
|
||||
}
|
||||
navType.value = type;
|
||||
show.value = true;
|
||||
}
|
||||
|
||||
const selectOne = (e)=>{
|
||||
if(navType.value==1){
|
||||
navTo(`/pages/plantAdmin/addBreed?name=${e.name}&type=${e.name=='购买'?1:2}`)
|
||||
}else {
|
||||
navTo(`/pages/feed/feed?id=23`);
|
||||
}
|
||||
}
|
||||
|
||||
//跳转
|
||||
const navTo = (url) => {
|
||||
uni.navigateTo({
|
||||
url
|
||||
})
|
||||
}
|
||||
const navtoForm = (item, type) => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/landDetail/tudi?data=' + item.id
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
const getNowTimeFn = () => {
|
||||
const now = new Date();
|
||||
const hour = now.getHours();
|
||||
const minute = now.getMinutes();
|
||||
const formattedHour = hour < 10 ? '0' + hour : hour;
|
||||
const formattedMinute = minute < 10 ? '0' + minute : minute;
|
||||
const currentTime = formattedHour + ':' + formattedMinute;
|
||||
return currentTime
|
||||
}
|
||||
//查看
|
||||
const perviewFn = (url) => {
|
||||
uni.previewImage({
|
||||
urls: [url]
|
||||
})
|
||||
}
|
||||
|
||||
let img = ''
|
||||
let codeImg = ''
|
||||
const showCodeFn = (i) => {
|
||||
// dataList[i].showCode != dataList[i].showCode
|
||||
dataList[i].showCode = !dataList[i].showCode
|
||||
console.log(dataList[i].showCode)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.box {
|
||||
width: 750rpx;
|
||||
min-height: 100vh;
|
||||
background-color: $theme-bg-color;
|
||||
padding: 0;
|
||||
|
||||
.content {
|
||||
width: 693.93rpx;
|
||||
margin: auto;
|
||||
padding-top: 20rpx;
|
||||
|
||||
.add-btn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.add-thing {
|
||||
height: 90rpx;
|
||||
width: 335rpx;
|
||||
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
|
||||
line-height: 90rpx;
|
||||
text-align: center;
|
||||
color: white;
|
||||
background-color: $theme-main-color;
|
||||
}
|
||||
}
|
||||
|
||||
// padding: 20rpx;
|
||||
.time {
|
||||
display: flex;
|
||||
font-size: 26.29rpx;
|
||||
color: #737373;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.video {
|
||||
// margin-top: 10rpx;
|
||||
border-radius: 14rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.coneng-detail {
|
||||
width: 478rpx;
|
||||
height: 341rpx;
|
||||
// background: #FFFFFF;
|
||||
border-radius: 6px 6px 6px 6px;
|
||||
opacity: 1;
|
||||
font-size: 25rpx;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #737373;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
margin: 70rpx auto;
|
||||
|
||||
image {
|
||||
width: 280rpx;
|
||||
height: 142rpx;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.thing-card {
|
||||
width: 693.93rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
margin-bottom: 30rpx;
|
||||
box-shadow: 1rpx 1rpx 10rpx 1rpx rgba(0, 0, 0, 0.1);
|
||||
|
||||
.head {
|
||||
height: 90rpx;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
background-color: $theme-main-color;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
line-height: 90rpx;
|
||||
color: white;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
.card_body {
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
.next {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
right: 20rpx;
|
||||
}
|
||||
|
||||
.left {
|
||||
flex-shrink: 0;
|
||||
position: relative;
|
||||
.qr-code{
|
||||
position: absolute;
|
||||
right: 10rpx;
|
||||
bottom: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
margin-left: 20rpx;
|
||||
|
||||
.name {
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.r-item {
|
||||
font-size: 28rpx;
|
||||
display: flex;
|
||||
|
||||
.item-title {
|
||||
color: #333;
|
||||
flex-shrink: 0;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.row2 {
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 2;
|
||||
/* 设置为需要显示的行数 */
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tit {
|
||||
position: relative;
|
||||
padding-left: 20rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.tit-more {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.more {
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
.tit::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
left: 0;
|
||||
width: 3px;
|
||||
/* 左边框的宽度 */
|
||||
height: 30rpx;
|
||||
background-color: #FFB049;
|
||||
}
|
||||
|
||||
.code-btn {
|
||||
border: 1px solid $theme-main-color;
|
||||
border-radius: 30rpx;
|
||||
padding: 3rpx 20rpx;
|
||||
color: $theme-main-color;
|
||||
position: absolute;
|
||||
right: 20rpx;
|
||||
}
|
||||
|
||||
.actBtn {
|
||||
background: linear-gradient(to right, #FEFFFF 0%, #E8FAF2 100%);
|
||||
}
|
||||
</style>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Loading…
Reference in New Issue