652 lines
14 KiB
Vue
652 lines
14 KiB
Vue
<template>
|
|
<view :class="{popupShow:showPop}">
|
|
<view class="cont">
|
|
<landInfo :land_id='land_id'></landInfo>
|
|
<view class="operate" v-for="(item,index) in actionData" :key="index" v-show="title==index">
|
|
<view class="tit">
|
|
{{index}}
|
|
</view>
|
|
<view class="card">
|
|
<view class="operate-li" style="margin: 20rpx 0;margin-right: 20rpx;" @click="showPopFn(items.id)"
|
|
v-for="items,indexs in item.actions" :key='indexs'>
|
|
{{items.name}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- {{actionList}} -->
|
|
<view class="fertilize" v-for="(item,index) in actionList" :key="index">
|
|
<!-- {{actionList}} -->
|
|
<view class="card" style="padding-bottom: 0;">
|
|
<view class="fertilize-tit">
|
|
<view class="">
|
|
{{item.action_name}}
|
|
</view>
|
|
<view class="fertilize-tit-r">
|
|
<view class="" style="color: red;" @tap="del(item.id)">
|
|
删除
|
|
</view>
|
|
<view style="margin-left: 40rpx;color: #00A15E;" @tap='editFn(item)'>
|
|
编辑
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="fertilize-li">
|
|
<view class="fertilize-li-a" v-for="(items,indexs) in item.action_content" :key="indexs"
|
|
v-show="items[0]?.tit">
|
|
<!-- {{indexs}} -->
|
|
<view class="" v-for="item2 in items" :key="item2" v-show="item2.tit">
|
|
<view class="" v-if="indexs=='text'||indexs=='select'">
|
|
{{item2.tit}}: {{item2.value}}
|
|
</view>
|
|
<view v-if="indexs=='pic'">
|
|
{{item2.tit}}: <text style="color: #3274F9;"
|
|
@click="previewImage(item2.value)">图片</text>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
<view class="" style="height: 100px">
|
|
</view>
|
|
</view>
|
|
|
|
<view class="ripe-btn" @click="finshFn">
|
|
完成今日操作
|
|
</view>
|
|
<!-- 组件 -->
|
|
<view class="">
|
|
<u-popup :show="showPop" :round="10" :closeable='true' @close="popCloseFn" @open="showPop=true">
|
|
<scroll-view scroll-y style="max-height: 90vh;">
|
|
<!-- 滚动内容 -->
|
|
|
|
<!-- 文本 -->
|
|
<view class="pop-content" v-for="item,index in popList.text" :key='index'>
|
|
<view class="">
|
|
{{item.title}}
|
|
</view>
|
|
<view class="pop-li">
|
|
<up-input placeholder="请输入" border="surround" v-model="formData1.text[index].value"
|
|
@change="change1(item.title,index)"></up-input>
|
|
</view>
|
|
</view>
|
|
<!-- 下拉 -->
|
|
<view class="pop-content" v-for="item,index in popList.select" :key='index'>
|
|
<view class="">
|
|
{{item.title}}
|
|
</view>
|
|
<view class="pop-li">
|
|
<up-input placeholder="点击选择" @change="change2(item.title,index)" border="surround"
|
|
v-model="formData1.select[index].value" @tap="choseSelect(item,index)"></up-input>
|
|
</view>
|
|
</view>
|
|
<!-- 图片 -->
|
|
<view class="pop-content" v-for="item,index in popList.pic" :key='index'>
|
|
<view class="">
|
|
{{item.title}}
|
|
</view>
|
|
<view class="pop-li" @click="updateImgFn(item.title,index)">
|
|
<view v-if="formData1.pic[index]?.value">
|
|
<u--image :src="formData1.pic[index]?.value" width="100%" height="196.26rpx"></u--image>
|
|
</view>
|
|
<view class="code-img" v-else>
|
|
<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 class="pop-content" v-for="item,index in popList.serch" :key='index'>
|
|
<view class="">
|
|
{{item.title}}
|
|
</view>
|
|
<view class="pop-li">
|
|
<up-input placeholder="请输入品种" border="surround" v-model="formData1.serch[index].value"
|
|
@change="change4(item.title,index)"></up-input>
|
|
</view>
|
|
<view style="margin-bottom: 20rpx;" v-for="(item,index) in serchList" :key="item">
|
|
<u-swipe-action>
|
|
<u-swipe-action-item :options="options1"
|
|
style="border-radius: 20rpx;border: 1px solid #C7C6CD;" @click="swipeDel(index)">
|
|
<view class="" style="padding: 20rpx 30rpx;">
|
|
<view class="swipe-action-tit">
|
|
<view class="">
|
|
编号: {{item.animal_code}}
|
|
</view>
|
|
<view class="" style="color: #00A15E;" v-if="item.animal_status==1">
|
|
健康
|
|
</view>
|
|
<view class="" style="color: #FFD736;" v-if="item.animal_status==2">
|
|
怀孕中
|
|
</view>
|
|
<view class="" style="color: #3274F9;" v-if="item.animal_status==3">
|
|
可出栏
|
|
</view>
|
|
<view class="" style="color: #3274F9;" v-if="item.animal_status==5">
|
|
可出栏
|
|
</view>
|
|
</view>
|
|
<view class="swipe-action-li">
|
|
<view class="">
|
|
养殖品种:{{item.animal_kind}}
|
|
</view>
|
|
<view class="">
|
|
年龄: {{item.animal_age}}个月
|
|
</view>
|
|
<view class="">
|
|
体重: {{item.animal_weight}}kg
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</u-swipe-action-item>
|
|
</u-swipe-action>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="pop-confirm" @tap="confirm">
|
|
确认
|
|
</view>
|
|
</scroll-view>
|
|
</u-popup>
|
|
</view>
|
|
<!-- 组件 -->
|
|
<u-picker :show="showPicker" :columns="columns" @confirm="confirmFn" @close="showPicker=false"
|
|
@cancel="showModal=false"></u-picker>
|
|
<u-modal :show="showModal" :showCancelButton='true' :closeOnClickOverlay="true" @close="showModal=false"
|
|
content='确认删除吗?' @confirm="delFn" @cancel="showModal=false"></u-modal>
|
|
</view>
|
|
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
ref,
|
|
reactive
|
|
} from "vue"
|
|
import landInfo from "@/components/plant/landInfo.vue"
|
|
import {
|
|
actionsListAPI,
|
|
actionsDetailAPI,
|
|
addLandCropRecordAPI,
|
|
landCropRecordListAPI,
|
|
delLandCropRecordAPI,
|
|
ediLandCropRecordAPI
|
|
} from "@/api/plant.js"
|
|
import {
|
|
onLoad
|
|
} from "@dcloudio/uni-app"
|
|
|
|
|
|
import {
|
|
addFishRecordAPI
|
|
} from "@/api/aquatic.js"
|
|
import uplodeImg from "@/utils/uplodeImg.js"
|
|
const serchList = reactive([])
|
|
const actionList = reactive([])
|
|
const options1 = reactive([{
|
|
text: '删除'
|
|
}])
|
|
const showPicker = ref(false)
|
|
const columns = reactive([
|
|
['中国', '美国', '日本']
|
|
], )
|
|
const confirmFn = (e) => {
|
|
showPicker.value = false
|
|
formData1.select[selectIndex.value].value = e.value[0]
|
|
}
|
|
const crop_id = ref(0)
|
|
const land_id = ref(0)
|
|
const type = ref(0)
|
|
const actionData = reactive({})
|
|
const delIndex = ref(0)
|
|
const title = ref('')
|
|
onLoad((options) => {
|
|
title.value = options.title
|
|
land_id.value = options.land_id
|
|
crop_id.value = options.crop_id
|
|
getAcyionListFn()
|
|
})
|
|
const getAcyionListFn = (type) => {
|
|
actionList.splice(0, actionList.length)
|
|
actionsListAPI({
|
|
type: 1,
|
|
crop_id: crop_id.value
|
|
}).then(res => {
|
|
for (let key in res.data) {
|
|
if (key == title.value) {
|
|
actionData[key] = res.data[key]
|
|
actionData[key].action_record.forEach(item => {
|
|
item.action_content = JSON.parse(item.action_content)
|
|
})
|
|
actionList.push(...(res.data[key].action_record))
|
|
}
|
|
}
|
|
console.log(actionList)
|
|
})
|
|
}
|
|
const showPop = ref(false)
|
|
const baseData = reactive({
|
|
text: {
|
|
value: "",
|
|
tit: ""
|
|
},
|
|
select: {
|
|
value: "",
|
|
tit: ""
|
|
},
|
|
pic: {
|
|
value: "",
|
|
tit: ""
|
|
},
|
|
serch: {
|
|
value: "",
|
|
tit: "",
|
|
list: [],
|
|
},
|
|
})
|
|
let formData = reactive({
|
|
text: [{
|
|
value: "",
|
|
tit: ""
|
|
}],
|
|
select: {
|
|
value: "",
|
|
tit: ""
|
|
},
|
|
pic: {
|
|
value: "",
|
|
tit: ""
|
|
},
|
|
serch: {
|
|
value: "",
|
|
tit: "",
|
|
list: [],
|
|
},
|
|
})
|
|
let formData1 = reactive({
|
|
text: [],
|
|
select: [],
|
|
pic: [],
|
|
serch: []
|
|
|
|
})
|
|
// 操作类型,true为添加,false为编辑
|
|
const actionType = ref(false)
|
|
const confirm = () => {
|
|
showPop.value = false
|
|
if (actionType.value) {
|
|
addLandCropRecordAPI({
|
|
crop_id: Number(crop_id.value),
|
|
action_id: action_id.value,
|
|
action_content: JSON.stringify(formData1)
|
|
}).then(res => {
|
|
setPropertiesToNull(formData1)
|
|
})
|
|
} else {
|
|
ediLandCropRecordAPI({
|
|
record_id: delIndex.value,
|
|
action_content: JSON.stringify(formData1)
|
|
})
|
|
}
|
|
objClear(popList)
|
|
getAcyionListFn(type.value)
|
|
serchList.splice(0, serchList.length)
|
|
|
|
}
|
|
const navgo = (url) => {
|
|
uni.navigateTo({
|
|
url
|
|
})
|
|
}
|
|
const del = (index) => {
|
|
showModal.value = true
|
|
delIndex.value = index
|
|
}
|
|
const showModal = ref(false)
|
|
const delFn = () => {
|
|
showModal.value = false
|
|
delLandCropRecordAPI({
|
|
record_id: delIndex.value
|
|
}).then(res => {
|
|
getAcyionListFn(type.value)
|
|
})
|
|
}
|
|
const editFn = (item) => {
|
|
delIndex.value = item.id
|
|
showPopFn(item.action_id)
|
|
formData1 = reactive(deepCopy(item.action_content))
|
|
if (item.action_content.serch?.list?.length) {
|
|
item.action_content.serch.list.forEach(item => {
|
|
animalSearchByCodeAPI({
|
|
code: item
|
|
}).then(res => {
|
|
serchList.push(res.data)
|
|
})
|
|
})
|
|
}
|
|
actionType.value = false
|
|
|
|
}
|
|
const popList = reactive({
|
|
text: [],
|
|
serch: [],
|
|
select: [],
|
|
pic: []
|
|
})
|
|
const action_id = ref("")
|
|
const showPopFn = (id) => {
|
|
actionType.value = true
|
|
// 清除上次表单与popList数据,
|
|
objClear(formData1)
|
|
objClear(popList)
|
|
action_id.value = id
|
|
actionsDetailAPI({
|
|
action_id: id
|
|
}).then(res => {
|
|
res.data.forEach(item => {
|
|
if (item.type == 1) {
|
|
formData1.text.push({
|
|
tit: "",
|
|
value: ""
|
|
})
|
|
popList.text.push(item)
|
|
|
|
}
|
|
if (item.type == 2) {
|
|
formData1.pic.push({
|
|
tit: "",
|
|
value: ""
|
|
})
|
|
popList.pic.push(item)
|
|
|
|
}
|
|
if (item.type == 4) {
|
|
formData1.select.push({
|
|
tit: "",
|
|
value: ""
|
|
})
|
|
popList.select.push(item)
|
|
|
|
}
|
|
if (item.type == 3) {
|
|
formData1.serch.push({
|
|
value: "",
|
|
tit: "",
|
|
list: [],
|
|
})
|
|
popList.serch.push(item)
|
|
}
|
|
if (item.type == 4) {
|
|
|
|
}
|
|
})
|
|
showPop.value = true
|
|
|
|
})
|
|
}
|
|
const updateImgFn = (tit, index) => {
|
|
change3(tit, index)
|
|
uplodeImg().then(res => {
|
|
formData1.pic[index].value = res.data.image
|
|
})
|
|
}
|
|
const previewImage = (src) => {
|
|
uni.previewImage({
|
|
urls: [src],
|
|
})
|
|
}
|
|
const selectIndex = ref('')
|
|
const choseSelect = (item, index) => {
|
|
|
|
formData1.select[index].tit = item.title
|
|
selectIndex.value = index
|
|
columns[0] = item.options.split(',')
|
|
showPicker.value = true
|
|
}
|
|
const change1 = (tit, index) => {
|
|
formData1.text[index].tit = tit
|
|
}
|
|
const change2 = (tit) => {
|
|
formData.select.tit = tit
|
|
}
|
|
const change3 = (tit, index) => {
|
|
formData1.pic[index].tit = tit
|
|
}
|
|
const change4 = (tit) => {
|
|
formData.serch.tit = tit
|
|
if (formData.serch.value) {
|
|
animalSearchByCodeAPI({
|
|
code: formData.serch.value
|
|
}).then(res => {
|
|
if (res.data.id) {
|
|
serchList.push(res.data)
|
|
console.log(formData.serch, 54554)
|
|
formData.serch.list.push(formData.serch.value)
|
|
}
|
|
formData.serch.value = ''
|
|
})
|
|
}
|
|
|
|
}
|
|
|
|
function deepCopy(obj) {
|
|
if (typeof obj !== 'object' || obj === null) {
|
|
return obj;
|
|
}
|
|
|
|
var newObj = Array.isArray(obj) ? [] : {};
|
|
|
|
for (var key in obj) {
|
|
if (obj.hasOwnProperty(key)) {
|
|
newObj[key] = deepCopy(obj[key]);
|
|
}
|
|
}
|
|
|
|
return newObj;
|
|
}
|
|
|
|
const objFn = (res, data) => {
|
|
for (let key in res) {
|
|
if (typeof res[key] === 'object') {
|
|
objFn(res[key], data[key]);
|
|
|
|
} else {
|
|
data[key] = res[key]
|
|
}
|
|
}
|
|
}
|
|
const setPropertiesToNull = (obj) => {
|
|
for (var prop in obj) {
|
|
if (obj.hasOwnProperty(prop)) {
|
|
if (typeof obj[prop] === 'object') {
|
|
setPropertiesToNull(obj[prop]);
|
|
} else {
|
|
obj[prop] = null;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
const objClear = (obj) => {
|
|
for (let key in obj) {
|
|
obj[key].splice(0, obj[key].length)
|
|
}
|
|
}
|
|
const popCloseFn = () => {
|
|
showPop.value = false
|
|
serchList.splice(0, serchList.length)
|
|
objClear(popList)
|
|
objClear(formData1)
|
|
|
|
// setPropertiesToNull(formData)
|
|
}
|
|
const swipeDel = (e) => {
|
|
serchList.splice(e, 1);
|
|
formData1.serch.list.splice(e, 1)
|
|
}
|
|
const finshFn = () => {
|
|
uni.navigateTo({
|
|
url: "/pages/index/index"
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.cont {
|
|
padding-top: 30rpx;
|
|
background-color: #F4F4F4;
|
|
min-height: 100vh;
|
|
}
|
|
|
|
.card {
|
|
.tit {
|
|
display: flex;
|
|
padding-bottom: 20rpx;
|
|
border-bottom: 1px solid #EBF1EF;
|
|
}
|
|
|
|
.card-li {
|
|
margin-top: 20rpx;
|
|
display: flex;
|
|
}
|
|
}
|
|
|
|
.operate {
|
|
width: 693.93rpx;
|
|
margin: auto;
|
|
|
|
.tit {
|
|
margin: 20rpx 0;
|
|
}
|
|
|
|
.card {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
|
|
.operate-li {
|
|
font-size: 29.79rpx;
|
|
padding: 0 60rpx;
|
|
background-color: #F4F4F4;
|
|
margin-bottom: 28rpx;
|
|
height: 63.08rpx;
|
|
line-height: 63rpx;
|
|
border-radius: 31.54rpx 31.54rpx 31.54rpx 31.54rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.ripe-btn {
|
|
position: fixed;
|
|
bottom: 50rpx;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
width: 588.79rpx;
|
|
height: 84.11rpx;
|
|
background-color: #00A15E;
|
|
color: white;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin: 0 auto;
|
|
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
|
|
background: linear-gradient(to right, #00A15E, #4CC593);
|
|
}
|
|
|
|
.fertilize {
|
|
.fertilize-tit {
|
|
display: flex;
|
|
// justify-self: center;
|
|
justify-content: space-between;
|
|
padding-bottom: 20rpx;
|
|
border-bottom: 1px solid #F4F4F4;
|
|
margin-bottom: 20rpx;
|
|
|
|
.fertilize-tit-r {
|
|
display: flex;
|
|
}
|
|
}
|
|
|
|
.fertilize-li {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-bottom: 20rpx;
|
|
flex-wrap: wrap;
|
|
|
|
.fertilize-li-a {
|
|
margin-bottom: 20rpx;
|
|
min-width: 40vw;
|
|
}
|
|
}
|
|
}
|
|
|
|
.pop-content {
|
|
padding: 20rpx;
|
|
padding-bottom: 0;
|
|
|
|
.pop-tit {
|
|
margin-bottom: 20rpx;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.pop-li {
|
|
margin: 20rpx 0;
|
|
// margin-bottom: 40rpx;
|
|
}
|
|
}
|
|
|
|
.pop-confirm {
|
|
width: 693.93rpx;
|
|
height: 84.11rpx;
|
|
background: linear-gradient(to right, #00A15E, #4CC593);
|
|
color: white;
|
|
border-radius: 42.06rpx 42.06rpx 42.06rpx 42.06rpx;
|
|
text-align: center;
|
|
line-height: 84rpx;
|
|
margin-top: 70rpx;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.code-img {
|
|
background-color: #F4F4F4;
|
|
height: 196.26rpx;
|
|
position: relative;
|
|
|
|
.carime-icon {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
|
|
}
|
|
|
|
.swipe-action-tit {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
border-bottom: 1px solid #F4F4F4;
|
|
padding-bottom: 20rpx;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.swipe-action-li {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
// align-items: ;
|
|
}
|
|
|
|
.popupShow {
|
|
// overflow: hidden;
|
|
position: fixed;
|
|
left: 30rpx;
|
|
}
|
|
</style> |