<template>
  <div class="app-container">
    <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
      <h2 style="color: #409eff; background: #e8e8e8; padding: 15px; border-radius: 10px">当前施工信息</h2>
      <el-row>
        <el-col :span="7">
          <el-form-item label-width="120px" label="承包商数量">
            <el-input
              v-model="formData.consNum"
              clearable
              :disabled="true"
              v-no-whitespace
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label-width="120px" label="分包商数量">
            <el-input
              v-model="formData.subNum"
              clearable
              :disabled="true"
              v-no-whitespace
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label-width="120px" label="当前在场人数">
            <el-input
              v-model="formData.presentNum"
              clearable
              :disabled="true"
              v-no-whitespace
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="7">
          <el-form-item label-width="120px" label="特殊工种人数">
            <el-input
              v-model="formData.specialJobsNum"
              clearable
              :disabled="true"
              v-no-whitespace
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label-width="120px" label="工器具总数">
            <el-input
              v-model="formData.equipmentNum"
              clearable
              :disabled="true"
              v-no-whitespace
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label-width="120px" label="特殊设备数量">
            <el-input
              v-model="formData.specialEquipmentNum"
              clearable
              :disabled="true"
              v-no-whitespace
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="7">
          <el-form-item label-width="120px" label="监理人数">
            <el-input
              v-model="formData.supervisorNum"
              clearable
              :disabled="true"
              v-no-whitespace
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label-width="120px" label="工程状态">
            <el-select
              v-model="formData.proStatus"
              placeholder="请选择工程状态"
              clearable
              :style="{ width: '100%' }"
              :disabled="true"
            >
              <el-option
                v-for="dict in proStatusOptions"
                :key="dict.value"
                :label="dict.label"
                :value="dict.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <h2 style="color: #409eff; background: #e8e8e8; padding: 15px; border-radius: 10px">工程基本信息填写</h2>
      <el-row>
        <el-col :span="7">
          <el-form-item label-width="120px" label="工程名称" style="width: 100%">
            <el-input
              v-model="formData.proName"
              clearable
              :disabled="true"
              v-no-whitespace
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label-width="120px" label="工程负责人" style="width: 100%">
            <el-input
              v-model="formData.proLeader"
              clearable
              :disabled="true"
              v-no-whitespace
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label-width="120px" label="负责人联系方式" style="width: 100%">
            <el-input
              v-model="formData.proLeaderPhone"
              clearable
              :disabled="true"
              v-no-whitespace
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="7">
          <el-form-item label-width="120px" label="工程类型" style="width: 100%">
            <el-select
              v-model="formData.proType"
              placeholder="请选择工程类型"
              clearable
              :style="{ width: '100%' }"
              :disabled="true"
            >
              <el-option
                v-for="dict in proTypeOptions"
                :key="dict.value"
                :label="dict.label"
                :value="dict.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label-width="120px" label="计划开工日期" prop="startDate" style="width: 100%">
            <el-date-picker
              v-model="formData.startDate"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              :style="{ width: '100%' }"
              placeholder="请选择开工期日计划开工日期"
              :editable="false"
              clearable
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label-width="120px" label="计划竣工日期" prop="endDate">
            <el-date-picker
              v-model="formData.endDate"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              :editable="false"
              :style="{ width: '100%' }"
              placeholder="请选择计划竣工日期"
              clearable
            ></el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row v-if="formData.proType == 2">
        <el-col :span="7">
          <el-form-item label-width="120px" label="选择监理单位" prop="supervisorUnitId">
            <el-select
              v-model="formData.supervisorUnitId"
              placeholder="请选择监理单位"
              clearable
              :disabled="true"
              :style="{ width: '100%' }"
            >
              <el-option
                v-for="(item, index) in supervisorUnitOptions"
                :key="index"
                :label="item.label"
                :value="item.value"
                :disabled="item.disabled"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <h2 style="color: #409eff; background: #e8e8e8; padding: 15px; border-radius: 10px">工程地址配置</h2>
      <el-row>
        <el-form-item
          v-for="(domain, index) in formData.proAddress"
          :label="'工程地址' + (index + 1)"
          label-width="130px"
          :key="domain.key"
          :prop="'proAddress.' + index + '.value'"
          :rules="{
            required: true,
            message: '请选择工程地址',
            trigger: 'blur',
          }"
        >
          <el-select
            v-model="domain.value"
            placeholder="请选择工程地址"
            clearable
            @clear="clearAddress(index)"
            :style="{ width: '26%' }"
            @change="changeLonLat(domain.value, index)"
          >
            <el-option
              v-for="(option, i) in proAddressOptions"
              :key="i"
              :label="option.label"
              :value="option.value"
              :disabled="option.disabled"
            ></el-option>
          </el-select>
          <el-input
            v-model="domain.lon"
            placeholder="经度"
            clearable
            :disabled="true"
            :style="{ width: '20%', marginLeft: '2%' }"
            v-no-whitespace
          ></el-input>
          <el-input
            v-model="domain.lat"
            placeholder="经度"
            clearable
            :disabled="true"
            :style="{ width: '20%', marginLeft: '2%' }"
            v-no-whitespace
          ></el-input>
          <el-button
            type="primary"
            plain
            size="medium"
            icon="el-icon-circle-plus"
            circle
            :style="{ marginLeft: '2%' }"
            @click="addAddressOption"
          ></el-button>
          <el-button
            v-if="index !== 0"
            v-show="true"
            type="danger"
            plain
            icon="el-icon-remove"
            circle
            @click="removeAddressOption(domain)"
          ></el-button>
          <el-button v-if="index === 0" v-show="true" type="primary" @click="addAddress">新增地址</el-button>
        </el-form-item>
      </el-row>
      <h2 style="color: #409eff; background: #e8e8e8; padding: 15px; border-radius: 10px">承包商配置</h2>
      <el-row>
        <el-form-item v-for="(domain, index) in formData.consArr" :label="`选择承包商${index + 1}`" :key="domain.key">
          <el-col :span="7">
            <el-select
              v-model="domain.value"
              placeholder="请选择承包商"
              clearable
              :style="{ width: '100%' }"
              @change="changeCons(domain.value, index)"
            >
              <el-option
                v-for="(option, i) in consOptions"
                :key="i"
                :label="option.label"
                :value="option.value"
                :disabled="option.disabled"
              ></el-option>
            </el-select>
          </el-col>

          <el-col :span="12">
            <el-checkbox-group v-model="domain.checkList" style="margin-left: 2%">
              <el-checkbox v-for="(option, index) in materialOptions" :label="option.value" :key="index">
                {{ option.label }}
              </el-checkbox>
            </el-checkbox-group>
          </el-col>
          <el-col :span="4">
            <el-button
              type="primary"
              plain
              size="medium"
              icon="el-icon-circle-plus"
              circle
              @click="addConsOption"
            ></el-button>
            <el-button
              v-if="
                index !== 0 &&
                (proStatusUseInfo === '规划中' || proStatusUseInfo === '筹备中' || proStatusUseInfo === '在建中')
              "
              v-show="true"
              type="danger"
              plain
              icon="el-icon-remove"
              circle
              @click="removeConsOption(domain)"
            ></el-button>
            <el-button
              v-show="
                index === 0 &&
                (proStatusUseInfo === '规划中' || proStatusUseInfo === '筹备中' || proStatusUseInfo === '在建中')
              "
              type="primary"
              @click="addCons"
            >
              新增承包商单位
            </el-button>
          </el-col>
        </el-form-item>
      </el-row>
      <h2 style="color: #409eff; background: #e8e8e8; padding: 15px; border-radius: 10px">其他信息</h2>
      <el-row>
        <el-col :span="7">
          <el-form-item label-width="120px" label="创建人">
            <el-input
              v-model="formData.createPerson"
              clearable
              :disabled="true"
              v-no-whitespace
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label-width="120px" label="创建时间">
            <el-input
              v-model="formData.createTime"
              clearable
              :disabled="true"
              v-no-whitespace
              :style="{ width: '100%' }"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-dialog :title="'创建工程地址'" :visible.sync="open" width="500px" append-to-body :close-on-click-modal="false">
      <bns-map :items="mapItems" v-on:closeMain="closeMain"></bns-map>
    </el-dialog>
    <!--   创建承包商单位 -->
    <el-dialog :title="'创建承包商单位'" :visible.sync="consFormOpen" width="30%" :close-on-click-modal="false">
      <el-form ref="consForm" :model="consForm" :rules="consRules" size="medium" label-width="100px">
        <el-form-item label="承包商单位名称" prop="consName" label-width="170px">
          <el-input
            v-model="consForm.consName"
            placeholder="请输入承包商单位名称"
            show-word-limit
            :maxlength="60"
            @blur="checkIsExistConsName"
            v-no-whitespace
            clearable
            :style="{ width: '100%' }"
          ></el-input>
        </el-form-item>
        <el-form-item label="单位地址" prop="consAddress" label-width="170px">
          <el-input
            v-model="consForm.consAddress"
            placeholder="请输入单位地址"
            show-word-limit
            :maxlength="200"
            clearable
            v-no-whitespace
            :style="{ width: '100%' }"
          ></el-input>
        </el-form-item>
        <el-form-item label="法人姓名" prop="corporateName" label-width="170px">
          <el-input
            v-model="consForm.corporateName"
            placeholder="请输入法人姓名"
            show-word-limit
            :maxlength="20"
            clearable
            v-no-whitespace
            :style="{ width: '100%' }"
          ></el-input>
        </el-form-item>
        <el-form-item label="法人联系方式" prop="corporatePhone" label-width="170px">
          <el-input
            v-model="consForm.corporatePhone"
            placeholder="请输入法人联系方式"
            show-word-limit
            :maxlength="11"
            clearable
            v-no-whitespace
            :style="{ width: '100%' }"
          ></el-input>
        </el-form-item>
        <el-form-item label="社会统一征信代码" prop="socialUnifiedCreditCode" label-width="170px">
          <el-input
            v-model="consForm.socialUnifiedCreditCode"
            placeholder="请输入社会统一征信代码"
            show-word-limit
            :maxlength="20"
            clearable
            v-no-whitespace
            :style="{ width: '100%' }"
          ></el-input>
        </el-form-item>
        <el-form-item label="承包商负责人" prop="contractorPrincipal" label-width="170px">
          <el-input
            v-model="consForm.contractorPrincipal"
            placeholder="请输入承包商负责人"
            show-word-limit
            :maxlength="20"
            clearable
            v-no-whitespace
            :style="{ width: '100%' }"
          ></el-input>
        </el-form-item>
        <el-form-item label="承包商负责人联系方式" prop="contractorPrincipalPhone" label-width="170px">
          <el-input
            v-model="consForm.contractorPrincipalPhone"
            placeholder="请输入承包商负责人联系方式"
            show-word-limit
            :maxlength="11"
            clearable
            v-no-whitespace
            :style="{ width: '100%' }"
          ></el-input>
        </el-form-item>
        <el-form-item label="承包商负责人身份证" prop="contractorPrincipalIdCard" label-width="170px">
          <el-input
            v-model="consForm.contractorPrincipalIdCard"
            placeholder="请输入承包商负责人身份证"
            show-word-limit
            :maxlength="18"
            clearable
            v-no-whitespace
            :style="{ width: '100%' }"
          ></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitConsForm" v-preventReClick="5000">提 交</el-button>
        <el-button @click="consCancel">取 消</el-button>
      </div>
    </el-dialog>

    <div slot="footer" class="dialog-footer">
      <el-button
        type="primary"
        @click="submitForm"
        :style="{ float: 'right', marginLeft: '10px' }"
        v-preventReClick="5000"
      >
        提 交
      </el-button>
      <el-button @click="resetForm" :style="{ float: 'right' }">取 消</el-button>
    </div>
  </div>
</template>
<script>
import { dictTableOption, selectCons, selectMaterial, selectProAddress, selectSupervisionUnit } from '@/api/tool/select'
import bnsMap from '@/components/pro-tabs/bns-map.vue'
import { selectProInfoDetails, editProInfo, addConsUnit, checkIsExistConsName } from '@/api/pro/proList'
import numberUtils from '@/utils/validate'

export default {
  components: { bnsMap },
  props: [],
  data() {
    return {
      // 遮罩层
      loading: true,
      // 是否显示创建承包商单位弹出层
      consFormOpen: false,
      // 是否显示创建工程地址弹出层
      open: false,
      // 工程地址form表单
      proAddressForm: {},
      //工程地址form表单 校验
      proAddressRules: {
        proAddress: [
          {
            required: true,
            message: '请输入工程地址',
            trigger: 'blur',
          },
        ],
        lon: [
          {
            required: true,
            message: '请输入经度',
            trigger: 'blur',
          },
        ],
        lat: [
          {
            required: true,
            message: '请输入纬度',
            trigger: 'blur',
          },
        ],
      },
      //工程地址
      mapItems: {},
      // 承包商单位form表单
      consForm: {},
      //承包商单位form表单 校验
      consRules: {
        consName: [
          {
            required: true,
            message: '请输入承包商单位名称',
            trigger: 'blur',
          },
        ],
        consAddress: [
          {
            required: true,
            message: '请输入单位地址',
            trigger: 'blur',
          },
        ],
        corporateName: [
          {
            required: true,
            message: '请输入法人姓名',
            trigger: 'blur',
          },
        ],
        corporatePhone: [
          {
            required: true,
            validator: numberUtils.checkPhone,
            trigger: 'blur',
          },
        ],
        socialUnifiedCreditCode: [
          {
            required: true,
            message: '请输入社会统一征信代码',
            trigger: 'blur',
          },
          {
            pattern: /^[a-zA-Z0-9]+$/,
            message: '请输入数字或字母',
            trigger: 'blur',
          },
        ],
        contractorPrincipal: [
          {
            required: true,
            message: '请输入承包商负责人',
            trigger: 'blur',
          },
        ],
        contractorPrincipalPhone: [
          {
            required: true,
            validator: numberUtils.checkPhone,
            trigger: 'blur',
          },
        ],
        contractorPrincipalIdCard: [
          {
            required: true,
            validator: numberUtils.checkIdCardNumber,
            trigger: 'blur',
          },
        ],
      },
      gutterValue: parseInt('24', 10),
      mainFormFields: [
        // 主表单字段定义
        {
          label: '工程地址',
          prop: 'proAddress',
          type: 'select',
          labelWidth: '120px',
          disabled: false,
          options: this.proAddressOptions,
        },
        { label: '经度', prop: 'lon', type: 'input', labelWidth: '120px', disabled: true },
        { label: '纬度', prop: 'lat', type: 'input', labelWidth: '120px', disabled: true },
      ],
      formData: {
        // 承包商数量
        consNum: '',
        // 分包商数量
        subNum: '',
        // 当前在场人数
        presentNum: '',
        // 特殊工种人数
        specialJobsNum: '',
        // 工器具总数
        equipmentNum: '',
        // 特殊设备数量
        specialEquipmentNum: '',
        // 监理人数
        supervisorNum: '',
        // 工程状态
        proStatus: '',
        //工程名称
        proName: '',
        //工程负责人
        proLeader: '',
        //工程负责人联系方式
        proLeaderPhone: '',
        //工程类型
        proType: '',
        //开工日期
        startDate: '',
        //竣工日期
        endDate: '',
        //监理单位
        supervisorUnit: '',
        //工程地址
        proAddress: [
          {
            label: '',
            value: '',
            lon: '',
            lat: '',
            key: Date.now(),
          },
        ],
        //承包商
        consArr: [],
        //创建人
        createPerson: '',
        //创建时间
        createTime: '',
      },
      //主表单校验
      rules: {
        proName: [
          {
            required: true,
            message: '请输入工程名称',
            trigger: 'blur',
          },
        ],
        proLeader: [
          {
            required: true,
            message: '请输入工程负责人',
            trigger: 'blur',
          },
        ],
        proLeaderPhone: [
          {
            required: true,
            message: '请输入负责人联系方式',
            trigger: 'blur',
          },
        ],
        supervisorUnit: [
          {
            required: true,
            message: '请选择监理单位',
            trigger: 'change',
          },
        ],
        startDate: [
          {
            required: true,
            message: '请选择开工期日计划开工日期',
            trigger: 'change',
          },
        ],
        endDate: [
          {
            required: true,
            message: '请选择计划竣工日期',
            trigger: 'change',
          },
        ],
        proType: [
          {
            required: true,
            message: '请选择工程类型',
            trigger: 'change',
          },
        ],
      },
      //工程类型下拉选
      proTypeOptions: [],
      proStatusOptions: [],
      //监理单位下拉选
      supervisorUnitOptions: [],
      //承包商下拉选
      consOptions: [],
      //材料选项
      materialOptions: [],
      //工程地址选项
      proAddressOptions: [],
      paramsData: {},
      proId: '',

      proStatusUseInfo: '',
    }
  },
  created() {
    this.proId = this.$route.params && this.$route.params.proId
    this.getProType()
    this.getStatus()
    this.getProAddress()
    this.getCons()
    this.getMaterial()
    this.getSupervisionUnit()
    this.getData(this.proId)

    this.proStatusUseInfo = localStorage.getItem('proStatusUseInfo') || ''
  },
  mounted() {},
  watch: {
    open: {
      handler(newVal, oldVal) {
        // 在 mapItems 数据变化后，关闭 el-dialog
        if (newVal === false) {
          // 或者其他关闭对话框的逻辑
          this.getProAddress()
        }
      },
      deep: true, // 监听对象或数组的变化
    },
  },
  methods: {
    //获取工程类型
    getProType() {
      const params = {
        dictType: 'sys_pro_type',
        dictValue: '',
      }
      dictTableOption(params).then(response => {
        this.proTypeOptions = response.data
      })
    },
    //获取工程类型
    getStatus() {
      const params = {
        dictType: 'sys_pro_status',
        dictValue: '',
      }
      dictTableOption(params).then(response => {
        this.proStatusOptions = response.data
      })
    },
    //获取工程地址选项
    getProAddress() {
      const params = {}
      selectProAddress(params).then(response => {
        this.proAddressOptions = response.data
      })
    },
    //获取承包商选项
    getCons() {
      const params = {}
      selectCons(params).then(response => {
        this.consOptions = response.data
      })
    },
    //获取材料选项
    getMaterial() {
      const params = {}
      selectMaterial(params).then(response => {
        this.materialOptions = response.data
      })
    },
    //获取监理单位选项
    getSupervisionUnit() {
      const params = {}
      selectSupervisionUnit(params).then(response => {
        console.log(response)
        this.supervisorUnitOptions = response.data
      })
    },
    getData(proId) {
      this.loading = true
      // TODO 获取数据
      selectProInfoDetails(proId).then(response => {
        console.log(response)
        this.formData = response.projectInfo[0]
        this.loading = false
      })
    },
    //检查承包商单位名称是否存在
    async checkIsExistConsName() {
      const params = {
        consName: this.consForm.consName,
      }
      try {
        const response = await checkIsExistConsName(params)
        if (response.code === 500) {
          this.$message({
            message: response.msg,
            type: 'error',
          })
          // 返回 false 或者其他值，表示单位名称已存在
          return false
        } else {
          // 返回 true 或者其他值，表示单位名称不存在重复
          return true
        }
      } catch (error) {
        return false
      }
    },
    //提交承包商表单
    async submitConsForm() {
      this.$refs['consForm'].validate(async valid => {
        if (!valid) {
          return false
        } else {
          // 前端验证通过，再进行唯一性检查
          const isExist = await this.checkIsExistConsName()
          if (isExist === false) {
            // 如果单位名称已存在，可以做出相应的提示或处理
            return
          }
          // TODO 提交表单
          addConsUnit(this.consForm).then(response => {
            if (response.code === 200) {
              this.$message({
                message: '新建成功',
                type: 'success',
              })
              this.getCons()
              for (let i = 0; i < this.consOptions.length; i++) {
                if (this.consOptions[i].label === this.consForm.consName) {
                  this.formData.consArr[this.formData.consArr.length - 1].value = this.consOptions[i].value
                  this.formData.consArr[this.formData.consArr.length - 1].label = this.consOptions[i].label
                }
              }

              this.consResetForm()
              this.consFormOpen = false
            } else {
              this.$message({
                message: response.msg,
                type: 'error',
              })
            }
          })
        }
      })
    },
    //承包商单位表单重置
    consCancel() {
      this.consResetForm()
      this.consFormOpen = false
    },
    //提交工程表单
    submitForm() {
      this.$refs['elForm'].validate(valid => {
        console.log(valid)
        console.log(this.formData)
        if (!valid) {
          return false
        } else {
          if (this.hasDuplicates(this.formData.proAddress, 'label')) {
            this.$message({
              message: '工程地址不能重复',
              type: 'error',
            })
            return false
          }
          editProInfo(this.formData).then(response => {
            if (response.code === 200) {
              this.$message({
                message: '修改成功',
                type: 'success',
              })
              //关闭tab页
              this.$tab.closePage()
            }
          })
          if (this.hasDuplicates(this.formData.consArr, 'label')) {
            this.$message({
              message: '承包商不能重复',
              type: 'error',
            })
            return false
          }
        }
        // TODO 提交表单
      })
    },
    /**
     * 判断对象数组中的数据是否重复
     * @param arr
     * @param key
     * @returns {boolean}
     */
    hasDuplicates(arr, key) {
      const seen = new Set()
      for (const item of arr) {
        if (seen.has(item[key])) {
          return true
        }
        seen.add(item[key])
      }
      return false
    },

    //工程表单重置
    resetForm() {
      this.$refs['elForm'].resetFields()
      this.$tab.closePage()
    },
    //工程地址表单重置
    proAddressReset() {
      this.form = {
        proAddress: undefined,
        lon: undefined,
        lat: undefined,
      }
      this.resetForm('proAddressForm')
    },
    //工程地址表单重置
    proAddressCancel() {
      this.proAddressReset()
      this.open = false
    },
    //新增工程地址
    addAddress() {
      // this.proAddressCancel();
      this.open = true
      this.mapItems = { addressId: -1, open: 'true' }
    },
    //添加工程地址选项
    addAddressOption() {
      this.formData.proAddress.push({
        label: '',
        value: '',
        lon: '',
        lat: '',
        key: Date.now(),
      })
    },
    //添加承包商选项
    addConsOption() {
      this.formData.consArr.push({
        label: '',
        value: '',
        checkList: [],
        key: Date.now(),
      })
    },
    //移除承包商选项
    removeConsOption(item) {
      const i = this.formData.consArr.indexOf(item)
      if (i !== -1) {
        this.formData.consArr.splice(i, 1)
      }
    },
    addCons() {
      //创建监理单位
      this.consResetForm()
      this.consFormOpen = true
    },
    //承包商表单重置
    consResetForm() {
      this.consForm = {
        consName: undefined,
        consAddress: undefined,
        corporateName: undefined,
        corporatePhone: undefined,
        socialUnifiedCreditCode: undefined,
        contractorPrincipal: undefined,
        contractorPrincipalPhone: undefined,
      }
    },
    //移除工程地址选项
    removeAddressOption(item) {
      const i = this.formData.proAddress.indexOf(item)
      if (i !== -1) {
        this.formData.proAddress.splice(i, 1)
      }
    },
    //更改工程地址选项   同时修改对应的经纬度
    changeLonLat(e, index) {
      if (e === undefined || e === '') {
        return
      }
      for (let i = 0; i < this.proAddressOptions.length; i++) {
        const item = this.proAddressOptions[i]
        if (e === item.value) {
          this.formData.proAddress[index].label = item.label
          this.formData.proAddress[index].value = item.value
          this.formData.proAddress[index].lon = item.lon
          this.formData.proAddress[index].lat = item.lat
        }
      }
    },

    //更改承包商名称值
    changeCons(e, index) {
      if (e === undefined || e === '') {
        return
      }
      for (let i = 0; i < this.consOptions.length; i++) {
        const item = this.consOptions[i]
        if (e === item.value) {
          this.formData.consArr[index].label = item.label
          this.formData.consArr[index].value = item.value
        }
      }
    },
    clearAddress(index) {
      this.formData.proAddress[index].lon = ''
      this.formData.proAddress[index].lat = ''
    },
    closeMain() {
      this.open = false
      console.log('closeMain')
    },
  },
}
</script>
<style></style>
