|
@@ -1,12 +1,12 @@
|
|
|
<template>
|
|
<template>
|
|
|
<div class="report-detail-page">
|
|
<div class="report-detail-page">
|
|
|
- <custom-header name="农场报告"></custom-header>
|
|
|
|
|
|
|
+ <custom-header name="农场报告" :isClose="!isMiniPage ? false : true"></custom-header>
|
|
|
<div class="report-content">
|
|
<div class="report-content">
|
|
|
<div class="report-header">
|
|
<div class="report-header">
|
|
|
- <el-select class="header-item" v-model="value" placeholder="Select" style="width: 240px">
|
|
|
|
|
|
|
+ <el-select class="header-item" v-model="value" placeholder="时间筛选" style="width: 240px">
|
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
</el-select>
|
|
</el-select>
|
|
|
- <el-select class="header-item" v-model="value1" placeholder="Select" style="width: 240px">
|
|
|
|
|
|
|
+ <el-select class="header-item" v-model="value1" placeholder="区域筛选" style="width: 240px">
|
|
|
<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
|
|
<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
</el-select>
|
|
</el-select>
|
|
|
</div>
|
|
</div>
|
|
@@ -56,41 +56,61 @@
|
|
|
</tab> -->
|
|
</tab> -->
|
|
|
<tab title="营养管理" class="tab-item">
|
|
<tab title="营养管理" class="tab-item">
|
|
|
<div class="item-title">营养管理</div>
|
|
<div class="item-title">营养管理</div>
|
|
|
- <div class="item-content">
|
|
|
|
|
- <div class="item-name">根肥</div>
|
|
|
|
|
- <div class="item-value">
|
|
|
|
|
- 透光率体现树体自身郁闭程度,当前XX%的树体透光性较差,可能造成整体减产XX%,需立即执行剪枝农事;XX%的树体透光正常,建议继续保持现有管理措施并及时巡园。
|
|
|
|
|
- </div>
|
|
|
|
|
- <div class="map-wrap">
|
|
|
|
|
- <!-- <img class="map-img" src="@/assets/img/home/map.png" alt="" /> -->
|
|
|
|
|
- <!-- <div class="map-text">根肥农事地图</div> -->
|
|
|
|
|
|
|
+ <template v-if="nutritionManagementInfo && nutritionManagementInfo.length > 0">
|
|
|
|
|
+ <div class="item-content" v-for="item in nutritionManagementInfo" :key="item.id">
|
|
|
|
|
+ <!-- <div class="item-name">根肥</div> -->
|
|
|
|
|
+ <div class="item-value">
|
|
|
|
|
+ {{ item.content.renderedContent }}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <!-- <div class="map-wrap">
|
|
|
|
|
+ <img class="map-img" src="@/assets/img/home/map.png" alt="" />
|
|
|
|
|
+ <div class="map-text">根肥农事地图</div>
|
|
|
|
|
+ </div> -->
|
|
|
</div>
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div class="item-content" v-else>暂无数据</div>
|
|
|
</tab>
|
|
</tab>
|
|
|
<tab title="病虫管理" class="tab-item">
|
|
<tab title="病虫管理" class="tab-item">
|
|
|
<div class="item-title">病虫管理</div>
|
|
<div class="item-title">病虫管理</div>
|
|
|
- <div class="item-content">
|
|
|
|
|
- <div class="item-value">
|
|
|
|
|
- 透光率体现树体自身郁闭程度,当前XX%的树体透光性较差,可能造成整体减产XX%,需立即执行剪枝农事;XX%的树体透光正常,建议继续保持现有管理措施并及时巡园。
|
|
|
|
|
- </div>
|
|
|
|
|
- <div class="map-wrap">
|
|
|
|
|
- <!-- <img class="map-img" src="@/assets/img/home/map.png" alt="" /> -->
|
|
|
|
|
- <!-- <div class="map-text">防虫农事地图</div> -->
|
|
|
|
|
|
|
+ <template v-if="pestManagementInfo && pestManagementInfo.length > 0">
|
|
|
|
|
+ <div class="item-content" v-for="item in pestManagementInfo" :key="item.id">
|
|
|
|
|
+ <div class="item-value">
|
|
|
|
|
+ {{ item.content.renderedContent }}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <!-- <div class="map-wrap">
|
|
|
|
|
+ <img class="map-img" src="@/assets/img/home/map.png" alt="" />
|
|
|
|
|
+ <div class="map-text">防虫农事地图</div>
|
|
|
|
|
+ </div> -->
|
|
|
</div>
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div class="item-content" v-else>暂无数据</div>
|
|
|
</tab>
|
|
</tab>
|
|
|
<tab title="农事记录" class="tab-item">
|
|
<tab title="农事记录" class="tab-item">
|
|
|
<div class="item-title">农事记录</div>
|
|
<div class="item-title">农事记录</div>
|
|
|
- <div class="item-content">
|
|
|
|
|
- 暂无数据
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
+ <template v-if="contentData && contentData.length > 0">
|
|
|
|
|
+ <div v-for="(section, index) in contentData" :key="index" class="item-farm">
|
|
|
|
|
+ <record-item
|
|
|
|
|
+ :record-item-data="section"
|
|
|
|
|
+ content-mode="serviceDetail"
|
|
|
|
|
+ title-mode="default"
|
|
|
|
|
+ class="recipe-item"
|
|
|
|
|
+ titleRightDotText="全区"
|
|
|
|
|
+ titleRightType="dot"
|
|
|
|
|
+ showFarmImage
|
|
|
|
|
+ @click="handleClick(section, index)"
|
|
|
|
|
+ >
|
|
|
|
|
+ </record-item>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="view-more" @click.stop="handleSeeMore">查看更多</div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div class="item-content" v-else>暂无数据</div>
|
|
|
</tab>
|
|
</tab>
|
|
|
</tabs>
|
|
</tabs>
|
|
|
</div>
|
|
</div>
|
|
|
<!-- 底部 -->
|
|
<!-- 底部 -->
|
|
|
- <div class="fixed-bottom">
|
|
|
|
|
- <div class="btn bottom-l " @click="sharePopup">保存报告</div>
|
|
|
|
|
- <div class="btn bottom-r">转发报告</div>
|
|
|
|
|
|
|
+ <div class="custom-bottom-fixed-btns">
|
|
|
|
|
+ <!-- <div class="bottom-btn secondary-btn" @click="sharePopup">保存报告</div> -->
|
|
|
|
|
+ <div class="bottom-btn primary-btn" @click="shareReport">转发报告</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
<!-- 报告弹窗 -->
|
|
<!-- 报告弹窗 -->
|
|
@@ -100,44 +120,98 @@
|
|
|
<script setup>
|
|
<script setup>
|
|
|
import customHeader from "@/components/customHeader.vue";
|
|
import customHeader from "@/components/customHeader.vue";
|
|
|
import { Tab, Tabs } from "vant";
|
|
import { Tab, Tabs } from "vant";
|
|
|
-import { ref } from "vue";
|
|
|
|
|
|
|
+import wx from "weixin-js-sdk";
|
|
|
|
|
+import { ref, onMounted } from "vue";
|
|
|
|
|
+import recordItem from "@/components/recordItem.vue";
|
|
|
import reportPopup from "@/components/reportPopup.vue";
|
|
import reportPopup from "@/components/reportPopup.vue";
|
|
|
-import { useRouter } from "vue-router";
|
|
|
|
|
|
|
+import { useRouter, useRoute } from "vue-router";
|
|
|
|
|
+
|
|
|
|
|
+const route = useRoute();
|
|
|
|
|
+const farmId = ref(null);
|
|
|
|
|
+const isMiniPage = ref(false);
|
|
|
|
|
+onMounted(() => {
|
|
|
|
|
+ if(route.query.farmId){
|
|
|
|
|
+ farmId.value = route.query.farmId;
|
|
|
|
|
+ }
|
|
|
|
|
+ if(route.query.json){
|
|
|
|
|
+ isMiniPage.value = true;
|
|
|
|
|
+ const json = JSON.parse(route.query.json);
|
|
|
|
|
+ farmId.value = json.farmId;
|
|
|
|
|
+ }
|
|
|
|
|
+ getFarmSpeakInfo();
|
|
|
|
|
+ getFarmWorkList();
|
|
|
|
|
+});
|
|
|
|
|
+
|
|
|
|
|
+const pestManagementInfo = ref([]);
|
|
|
|
|
+const nutritionManagementInfo = ref([]);
|
|
|
|
|
+
|
|
|
|
|
+const getFarmSpeakInfo = () => {
|
|
|
|
|
+ VE_API.monitor.getFarmSpeakInfo({ farmId: farmId.value, code: "病虫管理" }).then((res) => {
|
|
|
|
|
+ pestManagementInfo.value = res.data || [];
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
|
|
+ VE_API.monitor.getFarmSpeakInfo({ farmId: farmId.value, code: "营养管理" }).then((res) => {
|
|
|
|
|
+ nutritionManagementInfo.value = res.data || [];
|
|
|
|
|
+ });
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+const contentData = ref([]);
|
|
|
|
|
+const getFarmWorkList = () => {
|
|
|
|
|
+ const params = {
|
|
|
|
|
+ farmId: farmId.value,
|
|
|
|
|
+ flowStatus: 5,
|
|
|
|
|
+ page: 1,
|
|
|
|
|
+ limit: 5,
|
|
|
|
|
+ };
|
|
|
|
|
+ VE_API.user.getDetailList(params).then((res) => {
|
|
|
|
|
+ contentData.value = res.data || [];
|
|
|
|
|
+ });
|
|
|
|
|
+};
|
|
|
|
|
|
|
|
const router = useRouter();
|
|
const router = useRouter();
|
|
|
|
|
|
|
|
-const value = ref("Option1");
|
|
|
|
|
-const options = [
|
|
|
|
|
- {
|
|
|
|
|
- value: "Option1",
|
|
|
|
|
- label: "时间筛选",
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- value: "Option2",
|
|
|
|
|
- label: "Option2",
|
|
|
|
|
- },
|
|
|
|
|
-];
|
|
|
|
|
-const value1 = ref("Option1");
|
|
|
|
|
|
|
+const value = ref("");
|
|
|
|
|
+const options = [];
|
|
|
|
|
+const value1 = ref("");
|
|
|
const options1 = [
|
|
const options1 = [
|
|
|
{
|
|
{
|
|
|
value: "Option1",
|
|
value: "Option1",
|
|
|
- label: "区域筛选",
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- value: "Option2",
|
|
|
|
|
- label: "Option2",
|
|
|
|
|
|
|
+ label: "全区",
|
|
|
},
|
|
},
|
|
|
];
|
|
];
|
|
|
|
|
|
|
|
const active = ref(0);
|
|
const active = ref(0);
|
|
|
|
|
|
|
|
const reportPopupRef = ref(null);
|
|
const reportPopupRef = ref(null);
|
|
|
|
|
+-+
|
|
|
function sharePopup() {
|
|
function sharePopup() {
|
|
|
reportPopupRef.value.handleShow();
|
|
reportPopupRef.value.handleShow();
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
const handleSeeMore = () => {
|
|
const handleSeeMore = () => {
|
|
|
- router.push("/farm_photo");
|
|
|
|
|
|
|
+ router.push("/review-results?farmId=" + farmId.value);
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+const handleClick = (section) => {
|
|
|
|
|
+ router.push({
|
|
|
|
|
+ path: "/review_work",
|
|
|
|
|
+ query: {
|
|
|
|
|
+ json: JSON.stringify({ id: section.id, goBack: true }),
|
|
|
|
|
+ },
|
|
|
|
|
+ });
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+const shareReport = () => {
|
|
|
|
|
+ const query = {
|
|
|
|
|
+ askInfo: { title: "分享报告", content: "是否分享该报告给好友" },
|
|
|
|
|
+ shareText: "我分享了农场报告,快来查看吧~",
|
|
|
|
|
+ farmId: farmId.value,
|
|
|
|
|
+ targetUrl: `farm_report`,
|
|
|
|
|
+ imageUrl: 'https://birdseye-img.sysuimars.com/birdseye-look-mini/share-lz-bg.png',
|
|
|
|
|
+ };
|
|
|
|
|
+ wx.miniProgram.navigateTo({
|
|
|
|
|
+ url: `/pages/subPages/share_page/index?pageParams=${JSON.stringify(query)}&type=sharePage`,
|
|
|
|
|
+ });
|
|
|
};
|
|
};
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
@@ -147,7 +221,7 @@ const handleSeeMore = () => {
|
|
|
height: 100vh;
|
|
height: 100vh;
|
|
|
background-color: #f5f7fb;
|
|
background-color: #f5f7fb;
|
|
|
.report-content {
|
|
.report-content {
|
|
|
- height: calc(100% - 40px);
|
|
|
|
|
|
|
+ height: calc(100% - 40px - 76px);
|
|
|
overflow: auto;
|
|
overflow: auto;
|
|
|
padding: 12px;
|
|
padding: 12px;
|
|
|
box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
@@ -157,8 +231,8 @@ const handleSeeMore = () => {
|
|
|
gap: 10px;
|
|
gap: 10px;
|
|
|
.header-item {
|
|
.header-item {
|
|
|
flex: 1;
|
|
flex: 1;
|
|
|
- ::v-deep{
|
|
|
|
|
- .el-select__wrapper{
|
|
|
|
|
|
|
+ ::v-deep {
|
|
|
|
|
+ .el-select__wrapper {
|
|
|
padding: 5px 0;
|
|
padding: 5px 0;
|
|
|
justify-content: center;
|
|
justify-content: center;
|
|
|
background: #fff;
|
|
background: #fff;
|
|
@@ -171,10 +245,10 @@ const handleSeeMore = () => {
|
|
|
position: static;
|
|
position: static;
|
|
|
transform: none;
|
|
transform: none;
|
|
|
width: fit-content;
|
|
width: fit-content;
|
|
|
- color: #4E5969;
|
|
|
|
|
|
|
+ color: #4e5969;
|
|
|
}
|
|
}
|
|
|
.el-select__caret {
|
|
.el-select__caret {
|
|
|
- color: #4E5969;
|
|
|
|
|
|
|
+ color: #4e5969;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
@@ -184,15 +258,15 @@ const handleSeeMore = () => {
|
|
|
::v-deep {
|
|
::v-deep {
|
|
|
.van-tabs__nav {
|
|
.van-tabs__nav {
|
|
|
height: 70%;
|
|
height: 70%;
|
|
|
- .van-tab{
|
|
|
|
|
- border-bottom: 2px solid #E5E6EB;
|
|
|
|
|
|
|
+ .van-tab {
|
|
|
|
|
+ border-bottom: 2px solid #e5e6eb;
|
|
|
}
|
|
}
|
|
|
- .van-tab--active{
|
|
|
|
|
- color: #2199F8;
|
|
|
|
|
- border-bottom: 2px solid #2199F8;
|
|
|
|
|
|
|
+ .van-tab--active {
|
|
|
|
|
+ color: #2199f8;
|
|
|
|
|
+ border-bottom: 2px solid #2199f8;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- .van-tabs__line{
|
|
|
|
|
|
|
+ .van-tabs__line {
|
|
|
display: none;
|
|
display: none;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
@@ -270,39 +344,31 @@ const handleSeeMore = () => {
|
|
|
margin-top: 5px;
|
|
margin-top: 5px;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+ .item-farm {
|
|
|
|
|
+ margin-top: 10px;
|
|
|
|
|
+ ::v-deep {
|
|
|
|
|
+ .record-item {
|
|
|
|
|
+ margin: 0;
|
|
|
|
|
+ padding: 10px;
|
|
|
|
|
+ background: rgba(238, 238, 238, 0.3);
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ .view-more {
|
|
|
|
|
+ margin-top: 10px;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
.tab-item + .tab-item {
|
|
.tab-item + .tab-item {
|
|
|
margin-top: 10px;
|
|
margin-top: 10px;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- .fixed-bottom {
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- bottom: 0;
|
|
|
|
|
- left: 0;
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- display: flex;
|
|
|
|
|
- align-items: center;
|
|
|
|
|
- justify-content: space-between;
|
|
|
|
|
- padding: 15px 12px;
|
|
|
|
|
- background: #fff;
|
|
|
|
|
- box-sizing: border-box;
|
|
|
|
|
- .btn{
|
|
|
|
|
- width: 142px;
|
|
|
|
|
- border-radius: 30px;
|
|
|
|
|
- padding: 10px;
|
|
|
|
|
- box-sizing: border-box;
|
|
|
|
|
- display: flex;
|
|
|
|
|
- align-items: center;
|
|
|
|
|
- justify-content: center;
|
|
|
|
|
- }
|
|
|
|
|
- .bottom-l {
|
|
|
|
|
- border: 1px solid rgba(133, 133, 133, 0.2);
|
|
|
|
|
- color: #666666;
|
|
|
|
|
- }
|
|
|
|
|
- .bottom-r {
|
|
|
|
|
- background: linear-gradient(160deg, #76C3FF, #2199F8);
|
|
|
|
|
- color: #fff;
|
|
|
|
|
|
|
+ .custom-bottom-fixed-btns {
|
|
|
|
|
+ justify-content: center;
|
|
|
|
|
+ padding: 16px 12px 20px 12px;
|
|
|
|
|
+ .primary-btn {
|
|
|
|
|
+ padding: 10px 50px;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|