src/App.vue

@@ -138,7 +138,7 @@ const router = useRouter();
 // 首页loading加载完才显示底部导航栏
 const showTab = ref(false);
 // 0: 农户, 1: 专家, 2:农资农服
-const curRole = ref(1);
+const curRole = ref(0);
 
 let tabBarHeight = 0;
 onMounted(() => {

src/api/modules/farm.js

@@ -5,4 +5,12 @@ module.exports = {
         url: config.base_dev_url + "container/specieList",
         type: "get",
     },
+    fetchPhenologyList: {
+        url: config.base_dev_url + "container/phenology/select/{containerId}",
+        type: "get",
+    },
+    saveFarm: {
+        url: config.base_dev_url + "v2/farm/createFarm",
+        type: "post",
+    },
 }

src/views/old_mini/create_farm/index.vue

@@ -46,12 +46,12 @@
                                     label-width="auto"
                                     class="demo-ruleForm"
                                 >
-                                    <el-form-item label="农场位置" prop="position">
+                                    <el-form-item label="农场位置" prop="address">
                                         <div class="position-wrap">
                                             <el-input
                                                 placeholder="农场位置"
                                                 readonly
-                                                v-model="ruleForm.position"
+                                                v-model="ruleForm.address"
                                                 autocomplete="off"
                                             />
                                             <div class="draw-btn" @click="toSubPage">点击勾选地块</div>
@@ -68,20 +68,17 @@
                                             <div class="unit">亩</div>
                                         </div>
                                     </el-form-item>
-                                    <el-form-item label="种植作物" prop="period">
+                                    <el-form-item label="种植作物" prop="phenologyId">
                                         <div class="select-wrap">
-                                            <el-select class="select-item" v-model="ruleForm.type" placeholder="作物类型">
-                                                <el-option v-for="(item, index) in specieList" :key="index" :value="item.id">{{ item.name }}</el-option>
+                                            <el-select @change="changeSpecie" class="select-item" v-model="ruleForm.speciesItem" placeholder="作物类型">
+                                                <el-option v-for="(item, index) in specieList" :key="index" :label="item.name" :value="{value: item.id, ...item}" />
                                             </el-select>
                                             <el-select
-                                                v-model="ruleForm.period"
+                                                v-model="ruleForm.phenologyId"
                                                 placeholder="物候期"
                                                 class="period-select select-item"
                                             >
-                                                <el-option label="秋梢期" value="秋梢期" />
-                                                <el-option label="开花期" value="开花期" />
-                                                <el-option label="膨果期" value="膨果期" />
-                                                <el-option label="成熟期" value="成熟期" />
+                                                <el-option v-for="(item, index) in phenologyList" :key="index" :label="item.name" :value="item.id" />
                                             </el-select>
                                         </div>
                                     </el-form-item>
@@ -114,6 +111,7 @@ import { mapLocation } from "./map/index.js"
 import { onMounted, ref, reactive, watch, onActivated } from "vue";
 import { useStore } from "vuex";
 import { convertPointToArray } from "@/utils/index";
+import { ElMessage } from "element-plus";
 const route = useRoute();
 const router = useRouter();
 const store = useStore();
@@ -186,24 +184,24 @@ const handleSearchRes = (v) => {
     const coordinateArray = [parseFloat(parts[1]), parseFloat(parts[0])];
     indexMap.setMapPosition(coordinateArray);
     centerPoint.value = `POINT (${coordinateArray[0]} ${coordinateArray[1]})`
-    ruleForm.position = v.item?.title || v.item?.address;
+    ruleForm.address = v.item?.title || v.item?.address;
     pointAddress.value = v.item?.province + v.item?.city + v.item?.district
 };
 
 // 表单
 const ruleFormRef = ref(null);
 const ruleForm = reactive({
-    position: "",
+    address: "",
     area: "",
-    type: "",
-    period: "",
+    speciesItem: "",
+    phenologyId: "",
     name: "",
 });
 const rules = reactive({
-    position: [{ required: true, message: "请选择农场位置", trigger: "blur" }],
+    address: [{ required: true, message: "请选择农场位置", trigger: "blur" }],
     area: [{ required: true, message: "请勾选地块获得农场面积", trigger: "blur" }],
-    type: [{ required: true, message: "请选择品类", trigger: "blur" }],
-    period: [{ required: true, message: "请选择物候期", trigger: "blur" }],
+    speciesItem: [{ required: true, message: "请选择品类", trigger: "blur" }],
+    phenologyId: [{ required: true, message: "请选择物候期", trigger: "blur" }],
     name: [{ required: true, message: "请输入您的农场名称", trigger: "blur" }],
 });
 
@@ -213,8 +211,16 @@ const submitForm = (formEl) => {
         if (valid) {
             const params = {
                 ...ruleForm,
-                gemo: polygonArr.value
+                wkt: centerPoint.value,
+                speciesId: ruleForm.speciesItem?.id,
+                containerId: ruleForm.speciesItem?.defaultContainerId,
+                // geom: polygonArr.value
             }
+            VE_API.farm.saveFarm(params).then((res) => {
+                console.log('code', res.code);
+                ElMessage.success("创建成功")
+                router.replace('/home?reload=true')
+            })
             console.log("submit!", params);
         } else {
             console.log("error submit!");
@@ -231,7 +237,7 @@ const resetForm = (formEl) => {
 const centerPoint = ref(null)
 
 function toSubPage() {
-    router.push(`/edit_map?mapCenter=${centerPoint.value}&pointName=${ruleForm.position}&pointAddress=${pointAddress.value}`);
+    router.push(`/edit_map?mapCenter=${centerPoint.value}&pointName=${ruleForm.address}&pointAddress=${pointAddress.value}`);
 }
 
 const pointAddress = ref(null)
@@ -245,7 +251,7 @@ function getLocationName(location) {
             const add = result.formatted_addresses?.recommend
                 ? result.formatted_addresses.recommend
                 : result.address + "";
-            ruleForm.position = add
+            ruleForm.address = add
             pointAddress.value = result.address
         });
 }
@@ -264,6 +270,18 @@ function getSpecieList() {
         specieList.value = data
     })
 }
+
+function changeSpecie(v) {
+    getPhenology(v.defaultContainerId)
+}
+
+const phenologyList = ref([])
+function getPhenology(containerId) {
+    VE_API.farm.fetchPhenologyList({containerId}).then(({data}) => {
+        console.log('getPhenology', data);
+        phenologyList.value = data
+    })
+}
 </script>
 
 <style lang="scss" scoped>

src/views/old_mini/modify_work/completedWork.vue

@@ -67,6 +67,70 @@
                         </div>
                     </div>
                 </div>
+
+                <div class="box-wrap farm-table">
+                    <div class="card-title">药物处方</div>
+                    <div class="table-item">
+                        <div class="form-item">
+                            <div class="item-name">农事编号</div>
+                            <div class="item-text">BZ-YY-04-SQYY-20</div>
+                        </div>
+                    </div>
+                    <div class="new-wrap">
+                            <div class="new-title">
+                                <div class="title-1"><div class="table-name">使用功效</div></div>
+                                <div class="title-2"><div class="table-name">肥药名称</div></div>
+                                <div class="title-3"><div class="table-name">执行方式</div></div>
+                                <div class="title-4"><div class="table-name">亩兑水量</div></div>
+                                <div class="title-5"><div class="table-name">单亩用量</div></div>
+                            </div>
+                            <div
+                                class="new-table-wrap"
+                                v-for="(prescriptionItem, prescriptionI) in prescriptioData.prescriptionList"
+                                :key="prescriptionI"
+                            >
+                                <div
+                                    class="new-prescription"
+                                    v-for="(subP, subI) in prescriptionItem.pesticideFertilizerList"
+                                    :key="subI"
+                                >
+                                    <div class="new-table">
+                                        <div class="line-l">
+                                            <div class="line-1 title-1">{{ subP.typeName }}</div>
+                                            <div class="line-2">{{ subP.defaultName }}</div>
+                                        </div>
+                                        <div
+                                            class="line-r"
+                                            :class="{ 'has-border': prescriptioData.usageMode === '叶面施' }"
+                                        >
+                                            <div class="line-3">
+                                                <div
+                                                    class="sub-line title-3"
+                                                    :class="{ 'execute-line': prescriptioData.usageMode === '叶面施' }"
+                                                >
+                                                    人工
+                                                </div>
+                                                <div class="sub-line title-4">{{ subP.ratio }}ML</div>
+                                                <div class="sub-line title-5">{{ subP.muUsage }}{{ subP.unit }}</div>
+                                            </div>
+                                            <div class="line-4" v-if="prescriptioData.usageMode === '叶面施'">
+                                                <div class="sub-line title-3 execute-line">无人机</div>
+                                                <div class="sub-line title-4">
+                                                    {{ subP.ratio2 ? subP.ratio2 + subP.unit : "---" }}
+                                                </div>
+                                                <div class="sub-line title-5">
+                                                    {{ subP.muUsage2 ? subP.muUsage2 + subP.unit : "---" }}
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="note-text" v-if="subP.remark">{{ subP.remark }}</div>
+                                </div>
+                            </div>
+                        </div>
+                </div>
+
+                <div class="work-map"></div>
             </div>
         </div>
     </div>
@@ -78,6 +142,26 @@ import { ref } from "vue";
 
 // 0：执行， 1： 复核
 const status = ref(0);
+
+const prescriptioData = ref({
+    prescriptionList: [{
+        name: "营养",
+        pesticideFertilizerList: [
+            {
+                key: 1,
+                typeName: "营养",
+                defaultName: "乙烯利",
+                muUsage: "50",
+                muUsage2: "500",
+                ratio: "400",
+                ratio2: "400",
+                unit: "ml",
+                remark: "这是是用药注意事项的备注，这是是用药注意事项的备注",
+            },
+        ]
+    }],
+    usageMode: "叶面施",
+})
 </script>
 
 <style lang="scss" scoped>
@@ -213,6 +297,8 @@ const status = ref(0);
                 border-top: 1px solid #f5f5f5;
                 padding: 8px 0;
             }
+        }
+        
             .form-item {
                 display: flex;
                 align-items: center;
@@ -227,7 +313,104 @@ const status = ref(0);
             .form-item + .form-item {
                 padding-top: 2px;
             }
+
+        .farm-table {
+            margin-top: 10px;
+            .table-item {
+                padding: 10px 0 12px 0;
+            }
+        }
+
+        .new-wrap {
+    border-radius: 5px;
+    text-align: center;
+    border: 1px solid rgba(225, 225, 225, 0.5);
+    .new-title {
+        background: rgba(241, 241, 241, 0.4);
+        border-radius: 5px 5px 0 0;
+        border-bottom: 1px solid rgba(225, 225, 225, 0.5);
+        display: flex;
+        color: #767676;
+        // justify-content: space-around;
+        padding: 5px 6px;
+        font-size: 12px;
+        .table-name {
+            width: 24px;
+            font-size: 12px;
+            margin: 0 auto;
+        }
+    }
+
+    .title-1 {
+        width: 46px;
+    }
+    .title-2 {
+        flex: 1;
+    }
+    .title-3 {
+        width: 52px;
+    }
+    .title-4 {
+        width: 56px;
+    }
+    .title-5 {
+        width: 52px;
+    }
+    .new-table-wrap {
+        padding: 5px;
+        .new-prescription {
+            .new-table {
+                display: flex;
+                align-items: center;
+                border: 1px solid rgba(225, 225, 225, 0.8);
+                background: #fff;
+                border-radius: 5px;
+                color: rgba(0, 0, 0, 0.6);
+                font-size: 11px;
+                .line-l {
+                    display: flex;
+                    flex: 1;
+                    .line-2 {
+                        flex: 1;
+                        padding: 0 2px;
+                    }
+                }
+                .line-r {
+                    &.has-border {
+                        border-left: 1px solid rgba(225, 225, 225, 0.8);
+                    }
+                    .line-3 {
+                        display: flex;
+                        align-items: center;
+                    }
+                    .sub-line {
+                        padding: 10px 0;
+                    }
+                    .line-4 {
+                        display: flex;
+                        align-items: center;
+                        border-top: 1px solid rgba(225, 225, 225, 0.8);
+                    }
+                    .execute-line {
+                        border-right: 1px solid rgba(225, 225, 225, 0.8);
+                    }
+                }
+            }
+            .note-text {
+                margin: 8px 0 4px 0;
+                color: rgba(0, 0, 0, 0.4);
+                background: #fff;
+                padding: 6px 8px;
+                border-radius: 5px;
+                text-align: left;
+                font-size: 11px;
+            }
+        }
+        .new-prescription + .new-prescription {
+            padding-top: 8px;
         }
     }
 }
+    }
+}
 </style>