|
|
@@ -1,388 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class="report-detail-page">
|
|
|
- <custom-header name="农场报告" :isClose="!isMiniPage ? false : true"></custom-header>
|
|
|
- <div class="report-content">
|
|
|
- <div class="report-header" v-if="!showFilter">
|
|
|
- <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-select>
|
|
|
- <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-select>
|
|
|
- </div>
|
|
|
- <tabs v-model:active="active" class="tabs" scrollspy sticky offset-top="40" background="#f5f7fb">
|
|
|
- <!-- <tab title="果园总览" class="tab-item">
|
|
|
- <div class="item-title">果园总览</div>
|
|
|
- <div class="item-content">
|
|
|
- <div class="item-text">果园面积共XX亩，共有XX棵生产树。</div>
|
|
|
- <div class="item-text">
|
|
|
- 本次飞巡拍摄了XX张照片，包括了XX棵树，目前为施用根部有机肥阶段，根据树体冠幅大小，果园预计施用有机肥XXkg。
|
|
|
- </div>
|
|
|
- <div class="item-text">
|
|
|
- 目前XX%的树体暂未萌动新梢，需要进行剪枝农事，提高树体光合效率与通风效率。
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="item-content">
|
|
|
- <div class="photo-list">
|
|
|
- <div class="img-item" v-for="(item, index) in 6" :key="index">
|
|
|
- <img
|
|
|
- class="photo-item"
|
|
|
- src="https://birdseye-img-ali-cdn.sysuimars.com/16926861-1e20-4cbd-8bf2-90208db5a2d0/806080da-1a30-4b5b-b64b-b22e722c6cb6/DJI_202509010800_001_806080da-1a30-4b5b-b64b-b22e722c6cb6/DJI_20250901080536_0045_V_code-ws0fsmge97gh.jpeg"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="list-text" @click="handleSeeMore">点击查看更多</div>
|
|
|
- </div>
|
|
|
- </tab> -->
|
|
|
- <!-- <tab title="整体园相" class="tab-item">
|
|
|
- <div class="item-title">整体园相</div>
|
|
|
- <div class="item-content">
|
|
|
- <div class="item-name">透光率</div>
|
|
|
- <div class="item-value">
|
|
|
- 透光率体现树体自身郁闭程度，当前XX%的树体透光性较差，可能造成整体减产XX%，需立即执行剪枝农事；XX%的树体透光正常，建议继续保持现有管理措施并及时巡园。
|
|
|
- </div>
|
|
|
- </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>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </tab> -->
|
|
|
- <tab title="营养管理" class="tab-item">
|
|
|
- <div class="item-title">营养管理</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>
|
|
|
- </template>
|
|
|
- <div class="item-content" v-else>暂无数据</div>
|
|
|
- </tab>
|
|
|
- <tab title="病虫管理" class="tab-item">
|
|
|
- <div class="item-title">病虫管理</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>
|
|
|
- </template>
|
|
|
- <div class="item-content" v-else>暂无数据</div>
|
|
|
- </tab>
|
|
|
- <tab title="农事记录" class="tab-item">
|
|
|
- <div class="item-title">农事记录</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>
|
|
|
- </tabs>
|
|
|
- </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>
|
|
|
- <!-- 报告弹窗 -->
|
|
|
- <report-popup ref="reportPopupRef"></report-popup>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script setup>
|
|
|
-import customHeader from "@/components/customHeader.vue";
|
|
|
-import { Tab, Tabs } from "vant";
|
|
|
-import wx from "weixin-js-sdk";
|
|
|
-import { ref, onMounted } from "vue";
|
|
|
-import recordItem from "@/components/recordItem.vue";
|
|
|
-import reportPopup from "@/components/reportPopup.vue";
|
|
|
-import { useRouter, useRoute } from "vue-router";
|
|
|
-
|
|
|
-const route = useRoute();
|
|
|
-const farmId = ref(null);
|
|
|
-const isMiniPage = ref(false);
|
|
|
-const showFilter = ref(false);
|
|
|
-onMounted(() => {
|
|
|
- const pageParams = route.query.miniJson ? JSON.parse(route.query.miniJson) : {};
|
|
|
- if(pageParams.farmId){
|
|
|
- farmId.value = pageParams.farmId;
|
|
|
- }
|
|
|
- if(pageParams.goBack){
|
|
|
- isMiniPage.value = true;
|
|
|
- }
|
|
|
- if(pageParams.paramsPage){
|
|
|
- const paramsPage = JSON.parse(pageParams.paramsPage);
|
|
|
- if(paramsPage.showFilter){
|
|
|
- showFilter.value = true;
|
|
|
- }
|
|
|
- }
|
|
|
- if(pageParams.showFilter){
|
|
|
- showFilter.value = true;
|
|
|
- }
|
|
|
- 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 value = ref("");
|
|
|
-const options = [];
|
|
|
-const value1 = ref("");
|
|
|
-const options1 = [
|
|
|
- {
|
|
|
- value: "Option1",
|
|
|
- label: "全区",
|
|
|
- },
|
|
|
-];
|
|
|
-
|
|
|
-const active = ref(0);
|
|
|
-
|
|
|
-const reportPopupRef = ref(null);
|
|
|
--+
|
|
|
-function sharePopup() {
|
|
|
- reportPopupRef.value.handleShow();
|
|
|
-}
|
|
|
-
|
|
|
-const handleSeeMore = () => {
|
|
|
- router.push("/review-results?farmId=" + farmId.value);
|
|
|
-};
|
|
|
-
|
|
|
-const handleClick = (section) => {
|
|
|
- router.push({
|
|
|
- path: "/review_work",
|
|
|
- query: {
|
|
|
- miniJson: JSON.stringify({ id: section.id, goBack: true }),
|
|
|
- },
|
|
|
- });
|
|
|
-};
|
|
|
-
|
|
|
-const shareReport = () => {
|
|
|
- const query = {
|
|
|
- askInfo: { title: "分享报告", content: "是否分享该报告给好友" },
|
|
|
- shareText: "我分享了农场报告，快来查看吧~",
|
|
|
- farmId: farmId.value,
|
|
|
- targetUrl: `farm_report`,
|
|
|
- goBack: true,
|
|
|
- paramsPage: JSON.stringify({
|
|
|
- showFilter: showFilter.value,
|
|
|
- }),
|
|
|
- imageUrl: 'https://birdseye-img.sysuimars.com/birdseye-look-mini/share-report-bg.png',
|
|
|
- };
|
|
|
- wx.miniProgram.navigateTo({
|
|
|
- url: `/pages/subPages/share_page/index?pageParams=${JSON.stringify(query)}&type=sharePage`,
|
|
|
- });
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss" scoped>
|
|
|
-.report-detail-page {
|
|
|
- width: 100%;
|
|
|
- height: 100vh;
|
|
|
- background-color: #f5f7fb;
|
|
|
- .report-content {
|
|
|
- height: calc(100% - 40px - 76px);
|
|
|
- overflow: auto;
|
|
|
- padding: 12px;
|
|
|
- box-sizing: border-box;
|
|
|
- .report-header {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- gap: 10px;
|
|
|
- margin-bottom: 16px;
|
|
|
- .header-item {
|
|
|
- flex: 1;
|
|
|
- ::v-deep {
|
|
|
- .el-select__wrapper {
|
|
|
- padding: 5px 0;
|
|
|
- justify-content: center;
|
|
|
- background: #fff;
|
|
|
- }
|
|
|
- .el-select__selection {
|
|
|
- flex: none;
|
|
|
- width: fit-content;
|
|
|
- }
|
|
|
- .el-select__placeholder {
|
|
|
- position: static;
|
|
|
- transform: none;
|
|
|
- width: fit-content;
|
|
|
- color: #4e5969;
|
|
|
- }
|
|
|
- .el-select__caret {
|
|
|
- color: #4e5969;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .tabs {
|
|
|
- ::v-deep {
|
|
|
- .van-tabs__nav {
|
|
|
- height: 70%;
|
|
|
- .van-tab {
|
|
|
- border-bottom: 2px solid #e5e6eb;
|
|
|
- }
|
|
|
- .van-tab--active {
|
|
|
- color: #2199f8;
|
|
|
- border-bottom: 2px solid #2199f8;
|
|
|
- }
|
|
|
- }
|
|
|
- .van-tabs__line {
|
|
|
- display: none;
|
|
|
- }
|
|
|
- }
|
|
|
- .tab-item {
|
|
|
- border-radius: 14px;
|
|
|
- padding: 12px;
|
|
|
- background: #fff;
|
|
|
- color: #171717;
|
|
|
-
|
|
|
- .item-title {
|
|
|
- font-size: 16px;
|
|
|
- font-weight: 500;
|
|
|
- text-align: center;
|
|
|
- position: relative;
|
|
|
- &::before {
|
|
|
- content: "";
|
|
|
- position: absolute;
|
|
|
- left: 50%;
|
|
|
- transform: translateX(-50%);
|
|
|
- bottom: -1px;
|
|
|
- width: 66px;
|
|
|
- height: 8px;
|
|
|
- background: rgba(33, 153, 248, 0.3);
|
|
|
- border-radius: 4px;
|
|
|
- }
|
|
|
- }
|
|
|
- .item-content {
|
|
|
- margin-top: 12px;
|
|
|
- border-radius: 8px;
|
|
|
- background: rgba(238, 238, 238, 0.3);
|
|
|
- padding: 10px;
|
|
|
- line-height: 21px;
|
|
|
- .photo-list {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- width: 100%;
|
|
|
- overflow: auto;
|
|
|
- padding-bottom: 10px;
|
|
|
- .photo-item {
|
|
|
- width: 92px;
|
|
|
- height: 92px;
|
|
|
- border-radius: 8px;
|
|
|
- object-fit: cover;
|
|
|
- }
|
|
|
- .img-item + .img-item {
|
|
|
- margin-left: 12px;
|
|
|
- }
|
|
|
- }
|
|
|
- .list-text {
|
|
|
- text-align: center;
|
|
|
- color: rgba(0, 0, 0, 0.5);
|
|
|
- padding-top: 2px;
|
|
|
- }
|
|
|
- .item-name {
|
|
|
- font-weight: 500;
|
|
|
- }
|
|
|
- .item-value {
|
|
|
- font-size: 12px;
|
|
|
- color: rgba(23, 23, 23, 0.6);
|
|
|
- }
|
|
|
- .map-wrap {
|
|
|
- margin-top: 10px;
|
|
|
- .map-img {
|
|
|
- width: 100%;
|
|
|
- height: 137px;
|
|
|
- }
|
|
|
- .map-text {
|
|
|
- font-size: 12px;
|
|
|
- color: rgba(23, 23, 23, 0.6);
|
|
|
- text-align: center;
|
|
|
- margin-top: 5px;
|
|
|
- }
|
|
|
- }
|
|
|
- .item-text + .item-text {
|
|
|
- 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 {
|
|
|
- margin-top: 10px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .custom-bottom-fixed-btns {
|
|
|
- justify-content: center;
|
|
|
- padding: 16px 12px 20px 12px;
|
|
|
- .primary-btn {
|
|
|
- padding: 10px 50px;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|
wangsisi