|
@@ -1,6 +1,22 @@
|
|
|
<template>
|
|
|
<div class="prescription-page">
|
|
|
<div class="filter-wrap">
|
|
|
+ <div class="farm-list">
|
|
|
+ <el-select
|
|
|
+ @change="changeFarm"
|
|
|
+ class="select-item"
|
|
|
+ v-model="farmItem"
|
|
|
+ placeholder="作物类型"
|
|
|
+ style="width: 100px"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in farmList"
|
|
|
+ :key="index"
|
|
|
+ :label="item.name"
|
|
|
+ :value="{ value: item.organId, ...item }"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
<div class="plan-box">
|
|
|
<div
|
|
|
class="plan-item"
|
|
@@ -21,36 +37,38 @@
|
|
|
<el-sub-menu v-for="(menu, index) in menuData" :key="index" :index="String(menu.id)">
|
|
|
<template #title>
|
|
|
<img class="menu-icon" :src="require(`@/assets/img/gallery/icon-${index}.png`)" />
|
|
|
- <span class="menu-text">{{ menu.title }}</span>
|
|
|
+ <span class="menu-text">{{ menu.name }}</span>
|
|
|
</template>
|
|
|
- <el-menu-item v-for="item in menu.children" :key="item.id" :index="`${menu.id}-${item.id}`">
|
|
|
- <el-anchor-link :href="item.href" :title="item.title" />
|
|
|
+ <el-menu-item v-for="item in menu.farmWorkArrangeList" :key="item.id" :index="`${menu.id}-${item.id}`">
|
|
|
+ <el-anchor-link :href="'#'+menu.name+item.farmWorkDetail?.name" :title="item.farmWorkDetail?.name" />
|
|
|
</el-menu-item>
|
|
|
</el-sub-menu>
|
|
|
</el-menu>
|
|
|
</el-anchor>
|
|
|
</div>
|
|
|
<div class="expert-content" ref="containerRef">
|
|
|
- <div v-for="(section, index) in contentData" :key="index" class="content-section">
|
|
|
- <div class="section-id" :id="section.targetId"></div>
|
|
|
- <record-item :record-item-data="section">
|
|
|
- <template #title>
|
|
|
- <div class="box-title">
|
|
|
- <div class="title-l">
|
|
|
- {{ section.title }}
|
|
|
- <span class="parent-text">{{ section.parentTitle || "秋梢期" }}</span>
|
|
|
- </div>
|
|
|
- <div class="title-r">
|
|
|
- <div class="btn-item del-btn" @click="deletePlan">
|
|
|
- <el-icon color="#fff" size="14"><Delete /></el-icon>
|
|
|
+ <div v-for="(section, index) in menuData" :key="index" class="content-section">
|
|
|
+ <div class="section-item" v-for="(sub, subI) in section.farmWorkArrangeList" :key="index+'-'+subI">
|
|
|
+ <div class="section-id" :id="section.name+sub.farmWorkDetail?.name"></div>
|
|
|
+ <record-item :record-item-data="sub">
|
|
|
+ <template #title>
|
|
|
+ <div class="box-title">
|
|
|
+ <div class="title-l">
|
|
|
+ {{ sub.farmWorkDetail?.name }}
|
|
|
+ <span class="parent-text">{{ section.name }}</span>
|
|
|
</div>
|
|
|
- <div class="btn-item edit-btn">
|
|
|
- <el-icon color="#fff" size="14"><Edit /></el-icon>
|
|
|
+ <div class="title-r">
|
|
|
+ <div class="btn-item del-btn" @click="deletePlan">
|
|
|
+ <el-icon color="#fff" size="14"><Delete /></el-icon>
|
|
|
+ </div>
|
|
|
+ <div class="btn-item edit-btn">
|
|
|
+ <el-icon color="#fff" size="14"><Edit /></el-icon>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </record-item>
|
|
|
+ </template>
|
|
|
+ </record-item>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -66,7 +84,7 @@
|
|
|
<div class="bottom-r" @click="addWork">新增农事</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <add-group ref="addGroupRef" />
|
|
|
+ <add-group ref="addGroupRef" @updateGroupList="getPlan" />
|
|
|
<action-sheet :style="{ bottom: tabBarHeight + 'px' }" v-model:show="showAction" title="选择农事类型(可多选)">
|
|
|
<div class="content">
|
|
|
<checkbox-group v-model="checkedType">
|
|
@@ -99,7 +117,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import { computed, ref } from "vue";
|
|
|
+import { computed, onMounted, ref } from "vue";
|
|
|
import addGroup from "./addGroup.vue";
|
|
|
import recordItem from "@/components/recordItem.vue";
|
|
|
import { useStore } from "vuex";
|
|
@@ -119,26 +137,7 @@ const tabBarHeight = computed(() => store.state.home.tabBarHeight);
|
|
|
// 菜单
|
|
|
const defaultActive = ref("1-1");
|
|
|
|
|
|
-const menuData = [
|
|
|
- {
|
|
|
- id: 1,
|
|
|
- title: "秋梢期",
|
|
|
- children: [
|
|
|
- { id: 1, title: "巡园农事", href: "#part1" },
|
|
|
- { id: 2, title: "梢期防虫", href: "#part2" },
|
|
|
- { id: 3, title: "梢期营养", href: "#part3" },
|
|
|
- ],
|
|
|
- },
|
|
|
- {
|
|
|
- id: 2,
|
|
|
- title: "开花期",
|
|
|
- children: [
|
|
|
- { id: 1, title: "巡园农事", href: "#part4" },
|
|
|
- { id: 2, title: "摇花吹花", href: "#part5" },
|
|
|
- { id: 3, title: "花期防治", href: "#part6" },
|
|
|
- ],
|
|
|
- },
|
|
|
-];
|
|
|
+const menuData = ref([]);
|
|
|
|
|
|
const contentData = ref([
|
|
|
{
|
|
@@ -1095,8 +1094,8 @@ const contentData = ref([
|
|
|
},
|
|
|
]);
|
|
|
|
|
|
-const activePlanIndex = ref(0);
|
|
|
-const planList = ref([{ name: "方案1" }, { name: "方案2" }]);
|
|
|
+const activePlanIndex = ref(null);
|
|
|
+const planList = ref([]);
|
|
|
const handlePlanClick = (index) => {
|
|
|
activePlanIndex.value = index;
|
|
|
};
|
|
@@ -1121,7 +1120,7 @@ const handleClick = (e) => {
|
|
|
const addGroupRef = ref(null);
|
|
|
// 新增方案
|
|
|
function newPlan() {
|
|
|
- addGroupRef.value.openClientPopup();
|
|
|
+ addGroupRef.value.openClientPopup({params: {farmIds: [farmId.value], containerId: containerId.value}});
|
|
|
}
|
|
|
|
|
|
|
|
@@ -1148,6 +1147,52 @@ const toNewFarming = () => {
|
|
|
};
|
|
|
|
|
|
const containerRef = ref(null);
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ getFarmList(() => {
|
|
|
+ getPlan()
|
|
|
+ getWorkList()
|
|
|
+ })
|
|
|
+
|
|
|
+})
|
|
|
+
|
|
|
+const miniUserId = store.state.home.miniUserId;
|
|
|
+
|
|
|
+const farmItem = ref(null)
|
|
|
+const farmId = ref(null)
|
|
|
+const containerId = ref(null)
|
|
|
+const farmList = ref([])
|
|
|
+function getFarmList(callback) {
|
|
|
+ VE_API.farm.fetchFarmList({userId: miniUserId, show3dFarm: false}).then(({data}) => {
|
|
|
+ farmList.value = data || []
|
|
|
+ if (data && data.length) {
|
|
|
+ console.log('ddd', data);
|
|
|
+ farmItem.value = {...data[0], value: data[0].organId}
|
|
|
+ farmId.value = data[0].organId
|
|
|
+ containerId.value = data[0].containerId
|
|
|
+ callback && callback()
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function getWorkList() {
|
|
|
+ console.log('farmId', farmId.value, containerId.value);
|
|
|
+ VE_API.home.getPhenologyFarmWorkList({farmId: farmId.value, containerId: containerId.value}).then(({data}) => {
|
|
|
+ // contentData.value = data
|
|
|
+ menuData.value = data
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function getPlan() {
|
|
|
+ VE_API.home.listByFarmIdAndContainerId({farmId: farmId.value, containerId: containerId.value}).then(({data}) => {
|
|
|
+ planList.value = data
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function changeFarm(v) {
|
|
|
+ containerId.value = v.containerId
|
|
|
+ getPlan()
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
@@ -1161,12 +1206,33 @@ const containerRef = ref(null);
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: space-between;
|
|
|
+ .farm-list {
|
|
|
+ padding-left: 12px;
|
|
|
+ ::v-deep {
|
|
|
+ .el-select__wrapper {
|
|
|
+ box-shadow: 0 0 0 1px rgba(33, 153, 248, 0.3) inset;
|
|
|
+ }
|
|
|
+ .el-input__inner, .el-select__placeholder {
|
|
|
+ color: #2199f8;
|
|
|
+ }
|
|
|
+ .el-input__prefix {
|
|
|
+ color: #2199f8;
|
|
|
+ }
|
|
|
+ .el-select__caret {
|
|
|
+ color: #2199f8;
|
|
|
+ }
|
|
|
+ .el-input {
|
|
|
+ --el-input-placeholder-color: #2199f8;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
.plan-box {
|
|
|
+ flex: 1;
|
|
|
+ padding-left: 10px;
|
|
|
display: flex;
|
|
|
overflow: auto;
|
|
|
white-space: nowrap;
|
|
|
align-items: center;
|
|
|
- padding-left: 12px;
|
|
|
.plan-item {
|
|
|
color: #000000;
|
|
|
background: #f1f1f1;
|
|
@@ -1287,7 +1353,9 @@ const containerRef = ref(null);
|
|
|
padding-bottom: 80px;
|
|
|
box-sizing: border-box;
|
|
|
.content-section {
|
|
|
- position: relative;
|
|
|
+ .section-item {
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
.section-id {
|
|
|
position: absolute;
|
|
|
// top: -6px;
|