<template>
  <el-container style="width: 100%;height: 100%;">
    <el-button type="primary" size="small" @click="regionalContourClick">{{buttonName}}</el-button>

    <el-dialog :close-on-click-modal="false" :title="title" :visible.sync="regionalContourDialog"
               append-to-body :width="width" top="5vh" :height="height" @close="closeClick">
      <pl-map-component v-if="regionalContourDialog" :type="specialSet.type" :color="specialSet.color" :fill-color="specialSet.fillColor"
                        :operate="operate" :ptArea="ptArea" :is-view="isView" @setLocation="setLocation" @getLocation="getLocation">
      </pl-map-component>
      <div slot="footer" class="dialog-footer">
        <el-button v-if="!isView" type="primary" size="small" icon="el-icon-success" @click="clickDefine">确 定</el-button>
        <el-button @click="closeClick" size="small" icon="el-icon-error">关 闭</el-button>
      </div>
    </el-dialog>
  </el-container>
</template>

<script>
    // import $ from '../../components/public/gis/jquery.min';
    // window.$  = $;
    // import '../../components/public/gis/core.min';

    export default {
    name: 'pl-regional-contour-map',
    props:{
      buttonName:{type:String,default:""},
      title:{type:String,default:""},
      acceptMultiple:{type:String,default:""},//是否支持多选
      width:{type:String,default:"80%"},
      height:{type:String,default:"80%"},
      optFormData: {type:Object,default:() => {return {};}},
      fieldId: {type:String,default:null},
      specialSet: {type:Object,default:() => {return {};}},
      formId: {type:String,default:null},
      isView: {type:Boolean,default:false},
      operate: {type:String,default:"add"},
    },
    data() {
      return {
        regionalContourDialog:false,
        ptArea: "",
        isConfirm: false
      }
    },
    watch: {
      // regionalContourDialog(newVal) {
      //   if (newVal) {
      //     this.getLocation();
      //     // if (this.$refs.plMapRefs) {
      //     //   this.$refs.plMapRefs.initLocationPoint();
      //     // }
      //   }
      // }
    },
    methods: {
      async getLocation() {
        if (!this.ptArea) {
          let dotLocationData = await this.spcpFormAxios.post(this.api.gisMapDoting.find, {
            formId: this.formId,
            ptName: this.optFormData[this.specialSet.ptName] ? this.optFormData[this.specialSet.ptName] : this.specialSet.ptNameDefault,
            type: this.specialSet.type,
            relationId: this.optFormData["ID"] ? this.optFormData["ID"] : "",
          });
          if (dotLocationData && dotLocationData.data.length > 0 && this.specialSet.type === 'regionalContour') {
            this.ptArea = dotLocationData.data[0].ptArea;
          }
        }
      },
      async regionalContourClick() {
        await this.getLocation();
        if (this.isView && !this.ptArea) {
          this.$message({type: 'success', message: "当前暂无点位信息!", duration: 3000});
          this.regionalContourDialog = false;
          return;
        }
        this.regionalContourDialog = true;
      },
      clickDefine() {
        if (this.fieldId) {
          this.$set(this.optFormData, this.fieldId + "_ptArea", this.ptArea);
        }
        if (!this.isConfirm) {
          this.isConfirm = true;
        }
        this.regionalContourDialog = false;
      },
      setLocation(data,type) {
        this.ptArea = data;
      },
      closeClick() {
        this.regionalContourDialog = false;
        if (!this.isConfirm) {
          this.ptArea = "";
        }
      }
    }
  }
</script>

<style scoped>

</style>
