增加农场地址在地图上获取经纬度

xiebin

2022-08-12 206369fe8a0e65d3bbf0b012a3da853d66f76426

 src/views/farm/farm.vue

@@ -51,6 +51,8 @@

import { getList, add, update, remove, getDetails } from "@/api/farm/farm"
import { mapGetters } from "vuex"
import AvueMap from 'avue-plugin-map'
Vue.use(AvueMap);

export default {
    components: {
@@ -143,13 +145,17 @@
                    },
                    {
                        label: "农场地址",
                        prop: "farmAddress",
                        rules: [{
                            required: true,
                            message: "请输入农场地址",
                            trigger: "blur"
                        }],
                        prop: "avueMapAddress",
                        type: "map",
                        component: 'avueMap',
                        value: {
                          "formattedAddress": "",
                          "longitude": 0,
                          "latitude": 0
                        },
                        // formslot: true,
                        labelWidth: 145,
                        hide: true,
                        overHidden: true,
                    },
                    {
@@ -160,7 +166,21 @@
                            required: true,
                            message: "请输入农场面积",
                            trigger: "blur"
                        }],
                        }]
                    },
                    {
                        label: "经度",
                        prop: "longitude",
                        disabled: true,
                        hide: true,
                        labelWidth: 145
                    },
                    {
                        label: "纬度",
                        prop: "latitude",
                        disabled: true,
                        hide: true,
                        labelWidth: 145
                    },
                    {
                        label: "口号",
@@ -233,6 +253,19 @@
    },
    created () {
        // this.getRailLazyTree();
    },
    watch: {
        //latitude   longitude   formattedAddress
        "form.avueMapAddress":{
            handler (newObj, oldObj) {
                console.log(newObj,111)
                if (newObj) {
                  this.form.farmAddress = newObj.formattedAddress
                  this.form.latitude = newObj.latitude
                  this.form.longitude = newObj.longitude
                }
            }
        }
    },
    computed: {
        ...mapGetters(["userInfo", "permission", "polygonsFarm"]),
@@ -371,6 +404,12 @@
                getDetails(this.form.id).then((res) => {
                    if (res.data.code == 200) {
                        this.form = res.data.data
                        console.log(this.form,22222)
                        this.form.avueMapAddress = {
                          "formattedAddress": this.form.farmAddress,
                          "longitude": this.form.longitude,
                          "latitude": this.form.latitude
                        }
                        let usePolygons = this.form.position
                            .split("POLYGON((")[1]
                            .split("))")[0]