安保管理添加活动区域

guoshilong

2023-02-13 c42289cc56a240c466bfb366670c14b7e93a145b

 src/views/security/security.vue

@@ -16,6 +16,10 @@
                <el-button icon="el-icon-data-line" :size="size" :type="type"
                    @click="handleCarList(row)">活动车辆</el-button>
            </template>
            <template slot="activityAreaForm">
              <map-box ref="OpenLayersMap" @toData="toData" :routeRange="form.activityArea"></map-box>
            </template>

        </avue-crud>

        <el-drawer title="活动人员区域" :visible.sync="personBox" :append-to-body="true" size="50%" :destroy-on-close="true">
@@ -35,9 +39,11 @@
import { mapGetters } from "vuex"
import securityManage from "@/views/securityManage/securityManage"
import securityManageCar from "@/views/securityManageCar/securityManageCar"
import MapBox from "@/components/map/mapBox";

export default {
    components: {
      MapBox,
        securityManage,
        securityManageCar
    },
@@ -109,9 +115,41 @@
                    {
                        label: "活动地点",
                        prop: "place",
                        span: 24
                        // addDisplay: false,
                        // editDisplay: false,
                        // viewDisplay: false,
                    },
                    {
                      label: "经度",
                      prop: "longitude",
                      span: 12,
                      hide: true,
                      rules: [{
                        required: true,
                        message: "请输入纬度",
                        trigger: "blur"
                      }],
                    },
                    {
                      label: "纬度",
                      prop: "latitude",
                      span: 12,
                      hide: true,
                      rules: [{
                        required: true,
                        message: "请输入纬度",
                        trigger: "blur"
                      }],
                    },
                    {
                      label: "活动区域",
                      prop: "activityArea",
                      type: "input",
                      hide: true,
                      span: 24,
                      display: true,
                      addDisplay: true
                    },
                    {
                        label: "所属辖区",
@@ -125,6 +163,7 @@
                        },
                        search: true,
                        searchSpan: 4,
                        span: 24,
                        width: 110,
                        rules: [{
                            required: true,
@@ -165,29 +204,6 @@
                        }],
                        width: 120,
                    },

                    {
                        label: "经度",
                        prop: "longitude",
                        span: 12,
                        hide: true,
                        rules: [{
                            required: true,
                            message: "请输入纬度",
                            trigger: "blur"
                        }],
                    },
                    {
                        label: "纬度",
                        prop: "latitude",
                        span: 12,
                        hide: true,
                        rules: [{
                            required: true,
                            message: "请输入纬度",
                            trigger: "blur"
                        }],
                    },
                    // {
                    //   label: "",
                    //   prop: "map",
@@ -199,7 +215,6 @@
                    //   // display:false,
                    //   component: "AvueMap",
                    // },

                    {
                        label: "活动类型",
                        prop: "type",
@@ -408,6 +423,10 @@
        handleCarList (row) {
            this.carBox = true
            this.securityId = row.id
        },
        //地图传回的polygon坐标
        toData(data){
          this.form.activityArea = data
        }
    }
}