<template>
  <div class="app-warp">
    <div class="detail-structure">
      <el-page-header :content="msg == 'add'?'新增页面':'编辑页面'" @back="goBack"/>
      <div class="detail-container">
        <div class="level-title">
          <h1>基本信息</h1>
        </div>
        <el-form ref="form" :model="form" :form="form" :rules="rules" label-width="150px" class="detail_form">
          <el-row :gutter="60">
            <el-col :span="12">
              <el-form-item label="机构（企业）名称" prop="CORP_NAME">
                <el-input v-model="form.CORP_NAME" placeholder="请输入内容" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="统一社会信用代码" prop="CODE">
                <el-input v-model="form.CODE" placeholder="请输入内容" />
              </el-form-item>
            </el-col>

          </el-row>
          <el-row :gutter="60">
            <el-col :span="12">
              <el-form-item label="属地" prop="POSSESSION">
                <el-cascader id="POSSESSION" ref="POSSESSION" v-model="form.POSSESSION" :options="areaList" :props="areaProps" placeholder="请选择省市县" style="width: 100%"/>
              </el-form-item>
            </el-col>

            <el-col :span="12">
              <el-form-item label="企事业单位经营地址" prop="ADDRESS_BUSINESS">
                <el-input v-model="form.ADDRESS_BUSINESS" maxlength="255" placeholder="这里输入企事业单位经营地址..." title="企事业单位经营地址"/>
              </el-form-item>
            </el-col>
          </el-row>

          <!-- <el-row :gutter="60">
          <el-col :span="12">
            <el-form-item label="所属行业" prop="INDUSTRYALL">

              <el-cascader
                ref="industryCascader"
                v-model="form.INDUSTRYALL"
                :options="hylxList"
                :props="industryProps"
                :show-all-levels="false"
              />
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="经济类型" prop="ECO_TYPEALL">

              <el-cascader
                ref="ecoCascader"
                v-model="form.ECO_TYPEALL"
                :options="jjlxList"
                :props="ecoProps"
                :show-all-levels="false"
              />
            </el-form-item>
          </el-col>
        </el-row> -->

          <!-- <el-row :gutter="60">

          <el-col :span="24">
            <el-form-item label="培训行业类型" prop="TRAINTYPE">
              <SelectTree ref="keyHyRef" :options="trainDicList" :props="defaultProps" v-model="form.TRAINTYPE" placeholder="请选择培训行业类型" />
            </el-form-item>
          </el-col>

        </el-row> -->
          <el-row/>

          <el-row :gutter="60">
            <el-col :span="12">
              <el-form-item label="经度" prop="LONGITUDE">
                <el-input v-model="form.LONGITUDE" placeholder="请输入内容" disabled />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <div class="ud-flex">
                <div style="flex:1">
                  <el-form-item label="纬度" prop="LATITUDE">
                    <el-input v-model="form.LATITUDE" placeholder="请输入内容" disabled />
                  </el-form-item>
                </div>
                <div>
                  <el-button style="margin-left:10px" @click="handleMap">
                    <span class="svg-container">
                      <svg-icon icon-class="international" />
                    </span>
                  </el-button>
                </div>
              </div>
            </el-col>
          </el-row>
          <el-row :gutter="60">
            <el-col :span="12">
              <el-form-item label="主要负责人" prop="CONTACTS">
                <el-input v-model="form.CONTACTS" placeholder="请输入内容" />
              </el-form-item>
            </el-col>

            <el-col :span="12">
              <el-form-item label="主要负责人电话" prop="CONTACTS_PHONE">
                <el-input v-model="form.CONTACTS_PHONE" placeholder="请输入内容" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="60">

            <el-col :span="12">
              <el-form-item label="法定代表人">
                <el-input v-model="form.LR_NAME" placeholder="请输入内容" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="法人手机号">
                <el-input v-model="form.LR_MOBILE" placeholder="请输入内容" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="60">
            <el-col :span="12">
              <el-form-item label="职工人数(人)">
                <el-input-number :min="0" v-model="form.EMPLOYEES" controls-position="right" style="width: 100%;" placeholder="请输入内容" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="成立时间">
                <el-date-picker id="CREATE_DATE" ref="CREATE_DATE" v-model="form.CREATE_DATE" value-format="yyyy-MM-dd" format="yyyy-MM-dd" style="width: 100%" type="date" placeholder="请选择" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="60">
            <el-col :span="12">
              <el-form-item label="注册资金（万元）">
                <el-input v-model="form.REGCAPITAL" type="number" placeholder="请输入内容" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="资产总额（万元）">
                <el-input v-model="form.TOTALASSETS" type="number" placeholder="请输入内容" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="60">
            <el-col :span="12">
              <el-form-item label="类型" prop="TYPE">
                <el-select v-model="form.TYPE" clearable placeholder="请选类型" style="width: 100%">
                  <el-option v-for="item in typeList" :key="item.DICTIONARIES_ID" :label="item.NAME" :value="item.DICTIONARIES_ID" />
                </el-select>
              </el-form-item>
            </el-col>

          </el-row>
          <el-row :gutter="60">
            <el-col :span="24">
              <div class="lh-1">
                <el-form-item label="营业执照" class="is-required">
                  <div class="disContent">
                    <div v-for="(item, index) in bus_images" :key="index" class="img-div">
                      <img :src="config.fileUrl + item.FILEPATH" alt="">
                      <div class="disContent-hide">
                        <el-tooltip class="item" effect="dark" content="预览" placement="top">
                          <span class="el-icon-zoom-in yuLan">
                            <viewer :images="bus_images">
                              <img :src="config.fileUrl + item.FILEPATH" alt="" class="yuLanImg">
                            </viewer>
                          </span>
                        </el-tooltip>
                        <el-tooltip class="item" effect="dark" content="删除" placement="top">
                          <span class="Delete" @click="deleteImage(index)"><i class="el-icon-delete" /></span>
                        </el-tooltip>
                      </div>
                    </div>
                    <el-upload

                      ref="upload"
                      :limit="1"
                      :class="{hide:hideUpload}"
                      :on-remove="handleRemove"
                      :on-preview="handlePictureCardPreview"
                      :on-change="beforeFileUpload"
                      :auto-upload="false"
                      class="avatar-uploader"
                      action="#"
                      accept=".jpg,.jpeg,.png"
                      list-type="picture-card">
                      <i class="el-icon-plus" />
                    </el-upload>
                  </div>

                  <el-dialog :visible.sync="dialogVisible">
                    <img :src="dialogImageUrl" width="100%" alt="">
                  </el-dialog>
                </el-form-item>
              </div>

            </el-col>
          </el-row>

        </el-form>
        <div class="detail_foot">
          <el-button type="primary" @click="confirm">保存</el-button>
          <el-button icon="el-icon-arrow-left" @click="goBack">返回</el-button>
        </div>
      </div>

    </div>
    <!-- <div class="ui-height" />
    <div class="ui-foot">
      <el-button type="success" @click="confirm">保存</el-button>
      <el-button type="info" @click="goBack">返回</el-button>
    </div> -->

    <el-dialog :visible.sync="dialogFormMap" title="编辑坐标" width="800px" class="dy-dialog">
      <baidu-map
        v-loading="loadingMap"
        :zoom="zoom"
        :scroll-wheel-zoom="true"
        :style="{height: clientHeight+'px'}"
        @click="getClickInfo"
        @ready="handler">
        <bm-view style="width: 100%; height:100%; flex: 1" />
        <bm-control ref="control" :offset="{width: 10, height: 10}" anchor="BMAP_ANCHOR_TOP_LEFT">
          <div class="map-flex">

            <div class="map-lable">关键词：</div>
            <div style="flex:1;">
              <el-autocomplete v-model="addressKeyword" :fetch-suggestions="querySearch" :trigger-on-focus="false" placeholder="请输入详细地址" style="width:100%" @select="handleSelect" />
            </div>
            <!--            <el-input v-model="addressKeyword" style="width: 200px" placeholder="请输入内容" />-->
            <!--            <el-button slot="append" icon="el-icon-search" @click="mapNameChange"/>-->
          </div>
        </bm-control>
        <!--        <bm-local-search :keyword="addressKeyword" :auto-viewport="true"/>-->
      </baidu-map>
      <div slot="footer" class="dialog-footer">
        <span>经度：</span>
        <el-input v-model="LATITUDE" style="width: 200px" placeholder="请输入内容" disabled />
        <span>纬度：</span>
        <el-input v-model="LONGITUDE" style="width: 200px" placeholder="请输入内容" disabled />
        <el-button @click="dialogFormMap = false">取 消</el-button>
        <el-button type="primary" @click="setPosition">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { requestFN } from '@/utils/request'
import SelectTree from '@/components/SelectTree'
import { upload } from '@/utils/upload'
export default {
  components: { SelectTree },
  data() {
    return {
      config: config,
      // 地图相关
      // clientHeight: document.documentElement.clientHeight - 250,
      clientHeight: 600,
      loadingMap: true,
      listLoading: false,
      BMap: '',
      map: '',
      showMap: false,
      addressKeyword: '',
      pointLngLat: '',
      zoom: 10,
      dialogFormMap: false,
      LATITUDE: '',
      LONGITUDE: '',
      dialogImageUrl: '',
      dialogVisible: false,
      provinceList: [],
      cityList: [],
      countyList: [],
      scaleList: [],
      hylxList: [],
      jjlxList: [],
      trainDicList: [],
      safStaLevList: [], // 安全标准化等级
      areaList: [], // 属地
      OLDFOURTYPE: '',
      defaultProps: {
        children: 'nodes',
        label: 'name',
        value: 'id'
      },
      form: {
        CORP_NAME: '', // 企业名称
        CODE: '', // 统一社会信用代码
        COMPANY_AREA: '', // 所属区域
        ADDRESS: '', // 通讯地址
        CREATE_DATE: '', // 成立时间
        SCALE: '', // 规模
        LONGITUDE: '', // 纬度
        LATITUDE: '', // 纬度
        POSTAL_CODE: '', // 邮政编码
        EMPLOYEES: '', // 职工人数(人)
        AREA_COVERED: '', // 占地面积（㎡）
        TOTALASSETS: '', // 资产总额（万元）
        REGCAPITAL: '', // 注册资金（万元）
        SALESREVENUE: '', // 上年度实际营收（万元）
        ANNUALPROFIT: '', // 年利润（万元）
        ECO_TYPEAll: [], // 经济类型
        ECO_TYPE: '', // 经济类型
        ECO_TYPE2: '', // 经济类型
        INDUSTRY: '', // 所属行业
        CORP_TYPE: '', // 所属专业
        CORP_TYPE2: '',
        CORP_TYPE3: '',
        CORP_TYPE4: '',
        CORP_TYPE_SMALL: '', // 所属小专业
        CORP_TYPE_VAL: '',
        CORP_TYPEAll: '',
        LR_NAME: '', // 法定代表人
        LR_POSITION: '', // 法人职务
        LR_PHONE: '', // 法人办公电话
        LR_MOBILE: '', // 法人手机号
        CONTACTS: '', // 联系人
        CONTACTS_PHONE: '', // 联系人手机号
        CHECKPERSON: '', // 整改负责人
        CHECKPERSONPHONE: '', // 整改人电话
        ISDELETE: '', // 是否删除
        OPERATOR: '', // 修改人
        OPERATTIME: '', // 修改时间
        CREATTIME: '', // 添加时间
        CREATOR: '', // 添加人
        FOURTYPE: '1', // 四色图类型1平面,23D
        ISRECEIVE: '', // 是否接收短信
        LOGIN_USER_ID: '', // 登录账号
        ADDRESS_BUSINESS: '', // 企事业单位经营地址
        ADDRESS_OFFICE: '', // 企事业单位办公地址
        CORP_STATE: '', // 企业状态
        FIXED_ASSETS: '', // 固定资产
        YEAR_OUTPUT_VALUE: '', // 年产值
        REG_TYPE: '', // 单位注册登记类型
        SUBORDINATION: '', // 隶属关系
        CORP_OF_TYPEAll: '', // 企业类型
        INDUSTRY_DEPARTMENT: '', // 行业监管部门
        INDUSTRY_DEPARTMENTName: '',
        SCALE_TYPE: 0, // 是否规模以上
        SAFETY_NAME: '', // 安全负责人姓名
        SAFETY_POST: '', // 安全负责人职务
        SAFETY_BACKGROUND: '', // 安全负责人学历
        SAFETY_MAJOR: '', // 安全负责人专业
        SAFETY_NUMBER: '', // 安全负责人单位电话
        SAFETY_PHONE: '', // 安全负责人手机号码
        SAFETY_TECHNICAL: '', // 安全负责人技术职称
        AQ_BZ_LEVEL: '', // 安全标准化等级
        AQ_BZ_NO: '', // 安全标准化证书编号
        AQ_BZ_UNIT: '', // 安全标准化发证单位
        AQ_BZ_TIME: '', // 安全标准化有效期
        CORP_ATTRIBUTE: '', // 企业相关属性
        POSSESSION: '',
        PROVINCE: '',
        CITY: '',
        COUNTY: '',
        VILLAGE: '',
        CORP_EXAMINE: '1',
        WHETHER_HYGIENE: '', // 有无职业卫生信息
        WHETHER_HAZARDS: '', // 有无重大危险源
        WHETHER_SCARCE: '', // 是否有稀缺大型应急物资或设施
        WHETHER_CHEMICALS: '', // 是否涉及危化品
        WHETHER_SPECIALEQUIPMENT: '', // 有无特种设备
        WHETHER_SPECIALPEOPLE: '', // 有无特存种作业人员
        WHETHER_COALGAS: '', // 是否涉及煤气
        WHETHER_FIRE: '', // 是否属于消防重点单位
        WHETHER_CONFINED: '', // 是否在有限空间作业
        WHETHER_POWDER: '', // 是否存在涉爆粉尘作业
        WHETHER_LIGHTNING: '', // 是否涉及防雷防静电
        WHETHER_ACTINOGEN: '', // 是否持有放射源
        WHETHER_LIQUIDAMMONIA: '', // 是否涉及液氨制冷
        WHETHER_PIPELINE: '', // 是否涉及危化品管道
        jinweidu: '',
        AGENT_NUMBER_ID: '',
        VIPLEVEL: ''
      },
      ECO_TYPE: '',
      ecoArr: [],
      ecoNameArr: [],
      INDUSTRY: '',
      industryArr: [],
      industryNameArr: [],
      bus_images: [],
      bus_files: [],
      four_images: [],
      four_files: [],
      corpFoTypeList: [],
      corpStateList: [],
      subordinationList: [],
      imgUrl: require('@/assets/images/map.png'),
      rules: {

        CORP_NAME: [
          { required: true, message: '企业名称不能为空', trigger: 'blur' }
        ],
        CODE: [
          { required: true, message: '统一社会信用代码不能为空', trigger: 'blur' },
          {
            pattern: /^[^_IOZSVa-z\W]{2}\d{6}[^_IOZSVa-z\W]{10}$/,
            message: '请输入正确的统一社会信用代码'
          }
        ],
        POSSESSION: [
          { required: true, message: '属地不能为空', trigger: 'blur' }
        ],
        // INDUSTRYALL: [
        //   { required: true, message: '所属行业不能为空', trigger: 'blur' }
        // ],
        // ECO_TYPEALL: [
        //   { required: true, message: '经济类型不能为空', trigger: 'blur' }
        // ],
        ADDRESS_BUSINESS: [
          { required: true, message: '企事业单位经营地址不能为空', trigger: 'blur' }
        ],

        LONGITUDE: [
          { required: true, message: '经度不能为空', trigger: 'blur' }
        ],
        LATITUDE: [
          { required: true, message: '纬度不能为空', trigger: 'blur' }
        ],
        CONTACTS: [
          { required: true, message: '主要负责人不能为空', trigger: 'blur' }
        ],
        CONTACTS_PHONE: [
          { required: true, message: '主要负责人电话不能为空', trigger: 'blur' },
          { min: 11, max: 11, message: '请输入11位手机号码', trigger: 'blur' },
          {
            pattern: /^(1[3-9][0-9])\d{8}$/,
            message: '请输入正确的手机号码'
          }
        ],
        // TRAINTYPE: [
        //   { required: true, message: '培训行业类型不能为空', trigger: 'blur' }
        // ],

        LR_MOBILE: [
          { min: 11, max: 11, message: '请输入11位手机号码', trigger: 'blur' },
          {
            pattern: /^(1[3-9][0-9])\d{8}$/,
            message: '请输入正确的手机号码'
          }
        ],
        TYPE: [
          { required: true, message: '请选择类型', trigger: 'blur' }
        ]

        // CITY: [
        //   { required: true, message: '市不能为空', trigger: 'blur' }
        // ],
        // COUNTY: [
        //   { required: true, message: '区不能为空', trigger: 'blur' }
        // ],
        // ADDRESS: [
        //   { required: true, message: '通讯地址不能为空', trigger: 'blur' }
        // ],
        // CHECKPERSONPHONE: [
        //   { required: true, message: '主要负责人电话不能为空', trigger: 'blur' }
        // ]
      },

      propsCorpFoType: { value: 'id', id: 'id', label: 'label', children: 'children' },

      ecoProps: {
        lazy: true,
        lazyLoad: this.lazyLoad,
        value: 'id',
        id: 'id',
        label: 'label',
        children: 'children'
      },
      industryProps: {
        lazy: true,
        lazyLoad: this.lazyLoad,
        value: 'id',
        id: 'id',
        label: 'label',
        children: 'children',
        checkStrictly: true
      },
      areaProps: {
        lazy: true,
        lazyLoad: this.lazyLoad,
        value: 'numValue',
        id: 'id',
        label: 'label',
        children: 'children',
        checkStrictly: true
      },
      agentNumList: [],
      // AGENT_NUMBER_ID: '',
      msg: 'edit',
      isAdmin: false,

      hideUpload: false,
      typeList: []
    }
  },
  // watch: {
  //   'form.AGENT_NUMBER_ID': {
  //     handler() {
  //       console.info(this.form.AGENT_NUMBER_ID)
  //     }
  //   }
  // 'form.CITY': {
  //   handler() {
  //     this.getCountyList()
  //   }
  // }
  // },
  created() {
    const loading = this.$loading({
      lock: true,
      text: '读取中...',
      spinner: 'el-icon-loading',
      background: 'rgba(0, 0, 0, 0.7)'
    })
    // var user = sessionStorage.getItem('user')
    // var obj = JSON.parse(user)
    // if (obj && obj.USER_ID == '1') {
    //   this.isAdmin = true
    // }

    // this.getAgentList()
    if (this.$parent.CORPINFO_ID) {
      this.CORPINFO_ID = this.$parent.CORPINFO_ID
      this.getData()
    } else {
      this.msg = 'add'
      // this.getDictByDicId('688d2cf1c6cd4dab999a0106e09aec83').then(data => {
      //   this.jjlxList = data
      // })
      // this.getDictByDicId('f2598ba72e864eadabf0ca4b664d26b9').then(data => {
      //   this.hylxList = data
      // })
      this.getAreaDict('e725d2a91b8248f4b8f49889038df7de', '0').then(data => {
        this.areaList = data
      })
    }
    // this.getHylx()
    // this.getJjlx()
    // this.getDict()
    // this.getProvinceList()

    // this.getTrainDicList()
    // this.getCorpFoType()
    this.getDict()
    loading.close()
  },
  methods: {
    // 加载级联的方法
    lazyLoad(nodeValue, resolve) {
      if (nodeValue.data && (!nodeValue.children || nodeValue.children.length == 0)) {
        this.getDictByDicId(nodeValue.data.id).then(data => {
          resolve(data)
        })
      } else {
        resolve(null)
      }
    },
    // 加载级联的方法
    lazyLoadArea(nodeValue, resolve) {
      if (nodeValue.data && (!nodeValue.children || nodeValue.children.length == 0)) {
        this.getAreaDict(nodeValue.data.id, nodeValue.data.level, nodeValue.data.disabled).then(data => {
          resolve(data)
        })
      } else {
        resolve(null)
      }
    },
    handleMap() {
      this.dialogFormMap = true
      this.LATITUDE = this.form.LATITUDE
      this.LONGITUDE = this.form.LONGITUDE
      this.$forceUpdate()
    },
    getClickInfo(e) {
      this.LONGITUDE = e.point.lng
      this.LATITUDE = e.point.lat
    },
    setPosition() {
      this.dialogFormMap = false
      this.$set(this.form, 'LATITUDE', this.LATITUDE)
      this.$set(this.form, 'LONGITUDE', this.LONGITUDE)
      // this.form.LATITUDE = this.LATITUDE
      // this.form.LONGITUDE = this.LONGITUDE
      // this.$forceUpdate()
    },
    getData() {
      requestFN(
        '/corpinfo/goEdit',
        {
          CORPINFO_ID: this.CORPINFO_ID,
          tm: new Date().getTime()
        }
      ).then((data) => {
        // const PROVINCE = data.pd.PROVINCE + '000000'
        // const CITY = data.pd.CITY + '000000'
        // const COUNTY = data.pd.COUNTY + '000000'
        //
        // data.pd.PROVINCE = PROVINCE.substring(0, 6)
        // data.pd.CITY = CITY.substring(0, 6)
        // data.pd.COUNTY = COUNTY.substring(0, 6)
        // this.OLDFOURTYPE = data.pd.FOURTYPE
        this.form = Object.assign({}, data.pd)
        // this.form.FOURTYPE = data.pd.FOURTYPE ? data.pd.FOURTYPE + '' : '1'
        // if (data.pd.ecoOption && data.pd.ecoOption.length > 0) {
        //   this.jjlxList = data.pd.ecoOption
        // }
        // if (data.pd.industryOption && data.pd.industryOption.length > 0) {
        //   this.hylxList = data.pd.industryOption
        // }
        if (data.pd.posOption && data.pd.posOption.length > 0) {
          this.areaList = data.pd.posOption
        }

        // console.info(this.areaList)
        // this.hylxList = data.pd.industryOption
        // this.$nextTick(() => {
        //   this.$refs.ecoCascader.presentText = this.censusRegisterPlaceName
        // })
        // if (this.form.CORP_OF_TYPE2 && this.form.CORP_OF_TYPE2 != '') {
        //   const node = {}
        //   node.id = this.form.CORP_OF_TYPE2
        //   this.$nextTick(() => {
        //     this.$refs.corpOfTypeRef.handleNodeClick(node)
        //   })
        // } else if (this.form.CORP_OF_TYPE && this.form.CORP_OF_TYPE != '') {
        //   const node = {}
        //   node.id = this.form.CORP_OF_TYPE
        //   this.$nextTick(() => {
        //     this.$refs.corpOfTypeRef.handleNodeClick(node)
        //   })
        // }
        // const nodea = {}
        // nodea.id = this.form.TRAINTYPE
        // this.$nextTick(() => { // 此处使用这个可以等节点渲染后再获取节点
        //   this.$refs.keyHyRef.handleNodeClick(nodea)
        // })
        this.$forceUpdate()
        this.bus_images = data.busImgs

        this.hideUpload = this.bus_images.length >= 1
        // this.four_images = data.fourImgs
      }).catch((e) => {
        this.$message({
          message: '操作失败',
          type: 'error'
        })
      })
    },
    deleteImage(index) {
      this.$confirm('确定要删除吗?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        requestFN(
          '/imgfiles/delete',
          {
            IMGFILES_ID: this.bus_images[index].IMGFILES_ID
          }
        ).then(() => {
          this.$message({
            message: '删除成功',
            type: 'success'
          })
          this.bus_images.splice(index, 1)
          this.hideUpload = this.bus_images.length >= 1
        }).catch((e) => {
        })
      }).catch(() => {
      })
    },
    deleteFourImage(index) {
      this.$confirm('确定要删除吗?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        requestFN(
          '/imgfiles/delete',
          {
            IMGFILES_ID: this.four_images[index].IMGFILES_ID
          }
        ).then(() => {
          this.$message({
            message: '删除成功',
            type: 'success'
          })
          this.four_images.splice(index, 1)
        }).catch((e) => {
        })
      }).catch(() => {
      })
    },
    confirm() {
      // if (this.msg == 'add' && this.AGENT_NUMBER_ID == '') {
      //   this.$message({
      //     message: '请选择企业级别',
      //     type: 'error'
      //   })
      //   return false
      // }
      if (this.bus_images.length + this.$refs.upload.uploadFiles.length < 1) {
        this.$message({
          message: '请上传营业执照',
          type: 'error'
        })
        return false
      }

      this.$refs.form.validate(valid => {
        if (valid) {
          const loading = this.$loading({
            lock: true,
            text: '提交中...',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.7)'
          })
          // this.form.COMPANY_AREA = this.$refs.PROVINCE.selected.label + this.$refs.CITY.selected.label + this.$refs.COUNTY.selected.label
          if (this.form.POSSESSION && this.form.POSSESSION.length > 0) {
            this.form.PROVINCE = this.form.POSSESSION[0] || ''
            this.form.CITY = this.form.POSSESSION[1] || ''
            this.form.COUNTY = this.form.POSSESSION[2] || ''
            this.form.VILLAGE = this.form.POSSESSION[3] || ''
            this.form.STREET = this.form.POSSESSION[4] || ''
            this.form.COMPANY_AREA = this.$refs.POSSESSION.getCheckedNodes()[0].pathLabels ? this.$refs.POSSESSION.getCheckedNodes()[0].pathLabels.join('') : ''
          }
          // this.form.SMALL = '2'
          // if (this.form.ECO_TYPEALL && this.form.ECO_TYPEALL.length > 0) {
          //   this.form.ECO_TYPE = this.form.ECO_TYPEALL[0] || ''
          //   this.form.ECO_TYPE2 = this.form.ECO_TYPEALL[1] || ''
          //   this.form.ECO_TYPE_NAME = this.$refs.ecoCascader.getCheckedNodes()[0].pathLabels ? this.$refs.ecoCascader.getCheckedNodes()[0].pathLabels.join('/') : ''
          // }
          // if (this.form.INDUSTRYALL && this.form.INDUSTRYALL.length > 0) {
          //   this.form.CORP_TYPE = this.form.INDUSTRYALL[0] || ''
          //   this.form.CORP_TYPE2 = this.form.INDUSTRYALL[1] || ''
          //   this.form.CORP_TYPE3 = this.form.INDUSTRYALL[2] || ''
          //   this.form.CORP_TYPE4 = this.form.INDUSTRYALL[3] || ''
          //   this.form.CORP_TYPE_NAME = this.$refs.industryCascader.getCheckedNodes()[0].pathLabels ? this.$refs.industryCascader.getCheckedNodes()[0].pathLabels.join('/') : ''
          // }
          // this.form.ECO_TYPE = this.form.ECO_TYPEALL[this.form.ECO_TYPEALL.length - 1]
          // this.form.INDUSTRY = this.form.INDUSTRYALL[this.form.INDUSTRYALL.length - 1]

          const formData = new FormData()
          Object.keys(this.form).map(key => {
            formData.append(key, this.form[key])
          })
          if (this.$refs.upload.uploadFiles.length > 0) {
            for (var i = 0; i < this.$refs.upload.uploadFiles.length; i++) {
              if (this.$refs.upload.uploadFiles[i]) {
                formData.append('imgFiles', this.$refs.upload.uploadFiles[i].raw)
              }
            }
          }
          // if (this.form.FOURTYPE == '1') {
          //   if (this.$refs.fourUpload.uploadFiles.length > 0) {
          //     // eslint-disable-next-line no-redeclare
          //     for (var i = 0; i < this.$refs.fourUpload.uploadFiles.length; i++) {
          //       if (this.$refs.fourUpload.uploadFiles[i]) {
          //         formData.append('fourFiles', this.$refs.fourUpload.uploadFiles[i].raw)
          //       }
          //     }
          //   }
          // } else if (this.form.FOURTYPE == '2') {
          //   formData.append('fourFiles', this.FFILE)
          // }

          // formData.append('EDITFOURTYPE', this.form.FOURTYPE == this.OLDFOURTYPE)
          upload(
            '/corpinfo/' + this.msg,
            formData
          ).then((data) => {
            loading.close()
            if (data.message) {
              this.$message({
                message: data.message,
                type: 'warning'
              })
            } else {
              this.$message({
                message: '操作成功',
                type: 'success'
              })
              this.$parent.activeName = 'refreshCorpList'
            }
          }).catch((e) => {
            loading.close()
            this.$message({
              message: '操作失败',
              type: 'error'
            })
          })
        }
      })
    },
    // uploadImg() {
    //   this.$refs.upload.submit()
    //   const loading = this.$loading({
    //     lock: true,
    //     text: '上传中...',
    //     spinner: 'el-icon-loading',
    //     background: 'rgba(0, 0, 0, 0.7)'
    //   })
    //   const formData = new FormData()
    //   for (var i = 0; i < this.$refs.upload.uploadFiles.length; i++) {
    //     if (this.$refs.upload.uploadFiles[i]) {
    //       formData.append('FFILE', this.$refs.upload.uploadFiles[i])
    //     }
    //   }
    //   formData.append('FOREIGN_KEY', this.form.CORPINFO_ID)
    //   formData.append('TYPE', 1)
    //   upload(
    //     '/imgfiles/add',
    //     formData
    //   ).then((data) => {
    //     loading.close()
    //     if (this.form.FOURTYPE == '1' && this.$refs.fourUpload.uploadFiles.length > 0) {
    //       this.uploadFourImg()
    //     } else if (this.form.FOURTYPE == '2' && this.FFILE != null && this.FFILE.length > 0) {
    //       this.uploadFourFile()
    //     } else {
    //       this.$message({
    //         message: '操作成功',
    //         type: 'success'
    //       })
    //       this.$parent.activeName = 'CorpList'
    //     }
    //   }).catch((e) => {
    //     loading.close()
    //     this.$message({
    //       message: '营业执照上传失败',
    //       type: 'error'
    //     })
    //   })
    // },
    // uploadFourImg() {
    //   this.$refs.fourUpload.submit()
    //   const loading = this.$loading({
    //     lock: true,
    //     text: '上传中...',
    //     spinner: 'el-icon-loading',
    //     background: 'rgba(0, 0, 0, 0.7)'
    //   })
    //   const formData = new FormData()
    //   for (var i = 0; i < this.four_files.length; i++) {
    //     if (this.four_files[i]) {
    //       formData.append('FFILE', this.four_files[i])
    //     }
    //   }
    //   formData.append('FOREIGN_KEY', this.form.CORPINFO_ID)
    //   formData.append('TYPE', 2)
    //   formData.append('EDITFOURTYPE', this.form.FOURTYPE == this.OLDFOURTYPE)
    //   upload(
    //     '/imgfiles/add',
    //     formData
    //   ).then((data) => {
    //     loading.close()
    //     this.$message({
    //       message: '操作成功',
    //       type: 'success'
    //     })
    //     this.$parent.activeName = 'CorpList'
    //   }).catch((e) => {
    //     loading.close()
    //     this.$message({
    //       message: '四色图上传失败',
    //       type: 'error'
    //     })
    //   })
    // },
    // uploadFourFile() {
    //   const loading = this.$loading({
    //     lock: true,
    //     text: '上传中...',
    //     spinner: 'el-icon-loading',
    //     background: 'rgba(0, 0, 0, 0.7)'
    //   })
    //   const formData = new FormData()
    //   formData.append('FFILE', this.FFILE)
    //   formData.append('FOREIGN_KEY', this.form.CORPINFO_ID)
    //   formData.append('TYPE', 2)
    //   formData.append('EDITFOURTYPE', this.form.FOURTYPE == this.OLDFOURTYPE)
    //   upload(
    //     '/imgfiles/add',
    //     formData
    //   ).then((data) => {
    //     loading.close()
    //     this.$message({
    //       message: '操作成功',
    //       type: 'success'
    //     })
    //     this.$parent.activeName = 'CorpList'
    //   }).catch((e) => {
    //     loading.close()
    //     this.$message({
    //       message: '四色图上传失败',
    //       type: 'error'
    //     })
    //   })
    // },
    beforeFileUpload(file, fileList) {
      const types = ['image/jpeg', 'image/jpg', 'image/png']
      const isImage = types.includes(file.raw.type)
      if (!isImage) {
        this.$message.error('上传图片只能是 JPG、JPEG、PNG 格式!')
        fileList.pop()
      }

      this.hideUpload = fileList.length >= 1
    },

    handleRemove(file, fileList) {
      this.form.ccfile = file
      this.form.COURSEWARECAPTURE = file
      this.hideUpload = fileList.length >= 1
    },
    before3DFileUpload(file) {
      this.form.FFILE = file // 列表显示使用
      this.FFILE = file // 上传使用（修改时，如果没选择文件，则不上传）
      this.$forceUpdate()
      return false
    },
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url
      this.dialogVisible = true
    },
    fourBeforeFileUpload(file, fileList) {
      const types = ['image/jpeg', 'image/jpg', 'image/png']
      const isImage = types.includes(file.raw.type)
      if (!isImage) {
        this.$message.error('上传图片只能是 JPG、JPEG、PNG 格式!')
        fileList.pop()
      }
      const isSize = new Promise((resolve, reject) => {
        const width = 1480
        const height = 640
        // const _URL = window.URL || window.webkitURL
        const img = new Image()
        img.onload = () => {
          const valid = img.width === width && img.height === height
          valid ? resolve() : reject()
        }
        img.src = file.url
      }).then(
        () => {
          return true
        },
        () => {
          this.$message.error('图片尺寸限制为1480 x 640')

          fileList.pop()
          return false
        }
      )
      return isImage && isSize
    },
    fourHandlePictureCardPreview(file) {
      this.dialogImageUrl = file.url
      this.dialogVisible = true
    },
    // 企业类型的点击事件
    changeCorpType(form, val) {
      this.$nextTick(() => {
        this.$refs[form].validateField(val)
      })
      requestFN(
        '/corptypetodept/goLisByCorpTypeId',
        {
          tm: new Date().getTime(),
          CORPTYPE_ID: this.form.CORP_OF_TYPE
        }
      ).then((data) => {
        this.pd.INDUSTRY_DEPARTMENTName = data.pd.NAME
        this.pd.INDUSTRY_DEPARTMENT = data.pd.DEPARTMENT_ID
      })
        .catch((e) => {
          this.listLoading = false
        })
    },
    getTrainDicList() { // trainDicList
      requestFN(
        '/dictionaries/listAllDictToParId',
        {
          parentId: '052369aa22d242118236cde52d0c67ea'
        }
      ).then((data) => {
        this.trainDicList = JSON.parse(data.zTreeNodes)
      }).catch((e) => {
        this.listLoading = false
      })
    },
    // getHylx() {
    //   requestFN(
    //     '/dictionaries/listHylxDictToCreateCode',
    //     {}
    //   ).then((data) => {
    //     this.hylxList = JSON.parse(data.zTreeNodes)
    //   }).catch((e) => {
    //     this.listLoading = false
    //   })
    // },
    // getJjlx() {
    //   requestFN(
    //     '/dictionaries/listJjlxDictToCreateCode',
    //     {}
    //   ).then((data) => {
    //     this.jjlxList = JSON.parse(data.zTreeNodes)
    //   }).catch((e) => {
    //     this.listLoading = false
    //   })
    // },

    // 企业类型
    async getCorpFoType() {
      return new Promise((resolve) => {
        requestFN(
          '/corptype/listAllCorpTypeMent',
          {
            tm: new Date().getTime(),
            DICTIONARIES_ID: '0'
          }
        ).then((data) => {
          this.corpFoTypeList = JSON.parse(data.zTreeNodes)
          resolve()
        }).catch((e) => {
          this.listLoading = false
        })
      })
    },
    getProvinceList() {
      requestFN(
        '/dictionaries/getLevels',
        {
          DICTIONARIES_ID: 'e725d2a91b8248f4b8f49889038df7de'
        }
      ).then((data) => {
        /* this.provinceList = data.list*/
        this.provinceList = data.list
        // this.provinceList = [{ DICTIONARIES_ID: 'acd05c42faf346db9a0d067402b97c10', BIANMA: '130000', NAME: '河北省' }]
      }).catch((e) => {
      })
    },

    handleEditChange(file, fileList) {
      this.hideUpload = fileList.length >= 1
    },
    async getCityList() {
      if (this.form.PROVINCE) {
        var dictID = await this.getDictID(this.form.PROVINCE)
        requestFN(
          '/dictionaries/getLevels',
          {
            DICTIONARIES_ID: dictID
          }
        ).then((data) => {
          this.cityList = data.list
        }).catch((e) => {
        })
      }
    },
    async getCountyList() {
      if (this.form.CITY) {
        var dictID = await this.getDictID(this.form.CITY)
        requestFN(
          '/dictionaries/getLevels',
          {
            DICTIONARIES_ID: dictID
          }
        ).then((data) => {
          this.countyList = data.list
        }).catch((e) => {
        })
      }
    },
    getDictID(BIANMA) {
      return new Promise((resolve) => {
        requestFN(
          '/dictionaries/findByBianma',
          {
            BIANMA: BIANMA
          }
        ).then((data) => {
          resolve(data.DICTIONARIES_ID)
        }).catch((e) => {
        })
      })
    },
    // getAgentList() {
    //   requestFN(
    //     '/agentnumber/getAgentList',
    //     {
    //     }
    //   ).then((data) => {
    //     this.agentNumList = data.varList
    //   }).catch((e) => {
    //   })
    // },
    getDict() {
      requestFN(
        '/dictionaries/getLevels',
        {
          DICTIONARIES_ID: 'e2c777c811954e7285349684525aa26b'
        }
      ).then((data) => {
        this.typeList = data.list
      }).catch((e) => {
      })
    },
    // 获取数据字典数据
    getAreaDict(dicId, level, disabled) {
      var dicListVal = []
      return new Promise((resolve) => {
        let id = ''
        if (!dicId) {
          id = '0'
        } else {
          id = dicId
        }
        requestFN(
          '/dictionaries/getAreaDict',
          {
            DICTIONARIES_ID: id,
            LEVEL: level,
            DISABLED: disabled

          }
        ).then((data) => {
          if (data.list.length > 0) {
            dicListVal = data.list.map((e) => {
              if (e.zcount == '0') {
                return { value: e.DICTIONARIES_ID.toString(), numValue: e.BIANMA.toString(), label: e.NAME, id: e.DICTIONARIES_ID, leaf: true, disabled: e.DISABLED, level: e.LEVEL }
              } else {
                return { value: e.DICTIONARIES_ID.toString(), numValue: e.BIANMA.toString(), label: e.NAME, id: e.DICTIONARIES_ID, children: [], leaf: false, disabled: e.DISABLED, level: e.LEVEL }
              }
            })
          } else {
            dicListVal = undefined
          }
          return resolve(dicListVal)
        }).catch((e) => {
        })
      })
    },
    // 获取数据字典数据
    getDictByDicId(dicId) {
      var dicListVal = []
      return new Promise((resolve) => {
        let id = ''
        if (!dicId) {
          id = '0'
        } else {
          id = dicId
        }
        requestFN(
          '/dictionaries/getLevelsAndSCount',
          {
            DICTIONARIES_ID: id
          }
        ).then((data) => {
          if (data.list.length > 0) {
            dicListVal = data.list.map((e) => {
              if (e.zcount == '0') {
                return { value: e.DICTIONARIES_ID.toString(), numValue: e.BIANMA.toString(), label: e.NAME, id: e.DICTIONARIES_ID, leaf: true }
              } else {
                return { value: e.DICTIONARIES_ID.toString(), numValue: e.BIANMA.toString(), label: e.NAME, id: e.DICTIONARIES_ID, children: [], leaf: false }
              }
            })
          } else {
            dicListVal = undefined
          }
          return resolve(dicListVal)
        }).catch((e) => {
        })
      })
    },
    // 地图相关
    mapOpen() {
      this.top = this.getScrollTop()
      if (this.top) {
        this.setScrollTop(0)
      }
    },
    // 关闭地图后调用
    mapClose() {
      this.setScrollTop(this.top)
      this.top = 0
      this.showMap = false
    },
    getScrollTop() {
      let scrollTop = 0
      if (document.documentElement && document.documentElement.scrollTop) {
        scrollTop = document.documentElement.scrollTop
      } else if (document.body) {
        scrollTop = document.body.scrollTop
      }
      return scrollTop
    },
    setScrollTop(top) {
      if (!isNaN(top)) {
        if (document.documentElement && document.documentElement.scrollTop !== undefined) {
          document.documentElement.scrollTop = top
        } else if (document.body) {
          document.body.scrollTop = top
        }
      }
    },
    // 地图初始化
    handler({ BMap, map }) {
      this.mapOpen()
      this.BMap = BMap
      this.map = map
      this.loadingMap = true
      var geolocation = new BMap.Geolocation()
      const myGeo = new BMap.Geocoder()
      var $this = this
      // 调用百度地图api 中的获取当前位置接口
      geolocation.getCurrentPosition(function(r) {
        myGeo.getLocation(new BMap.Point(r.point.lng, r.point.lat), function(result) {
          console.log(result)
          if (result) {
            $this.loadingMap = false
            $this.$set($this, 'pointLngLat', { lng: result.point.lng, lat: result.point.lat })
            map.enableScrollWheelZoom(true) // 开启鼠标滚轮缩放,默认关闭
            $this.setCenter({ BMap, map }, { lng: result.point.lng, lat: result.point.lat })
          }
        })
      })
    },
    // 搜索地图
    querySearch(queryString, cb) {
      var options = {
        onSearchComplete: function(results) {
          if (local.getStatus() === 0) {
            // 判断状态是否正确
            var s = []
            for (var i = 0; i < results.getCurrentNumPois(); i++) {
              var x = results.getPoi(i)
              var item = { value: x.address + x.title, point: x.point }
              s.push(item)
              cb(s)
            }
          } else {
            cb()
          }
        }
      }
      var local = new this.BMap.LocalSearch(this.map, options)
      local.search(queryString)
    },
    handleSelect(item) {
      var { point } = item
      this.map.clearOverlays() // 清除地图上所有覆盖物
      this.map.centerAndZoom(point, this.zoom)
      const marker = new this.BMap.Marker(point) // 创建标注
      this.map.addOverlay(marker) // 将标注添加到地图中
      marker.enableDragging() // 可拖拽
      this.LONGITUDE = point.lng
      this.LATITUDE = point.lat
    },
    // 设置打开中心位置
    setCenter({ BMap, map }, location) {
      var point = new BMap.Point(this.form.LONGITUDE || location.lng, this.form.LATITUDE || location.lat)
      const zoom = map.getZoom()
      setTimeout(() => {
        map.centerAndZoom(point, zoom)
      }, 0)
      // var marker = new BMap.Marker(point) // 创建标注
      // map.addOverlay(marker) // 将标注添加到地图中
    },
    goBack() {
      this.$parent.activeName = 'CorpList'
    },

    async getDicForActive(valListKey, valkey) {
      var children = []
      await this.getDictByDicId(valkey[valkey.length - 1]).then(data => {
        children = data
      })
      var jParentLis = this[valListKey]
      for (let i = 0; i < valkey.length; i++) {
        var ilistIndex = 0
        // console.info('i==' + i + ';valkey[i]' + valkey[i] + ';jParentLis' + jParentLis.length)
        await this.getIndex(jParentLis, valkey[i]).then(data => {
          ilistIndex = data
        })
        if ((valkey.length - 1) == i) {
          jParentLis = jParentLis[ilistIndex]
        } else {
          jParentLis = jParentLis[ilistIndex].children
        }
      }
      jParentLis.children = children
    },
    getIndex(list, listKye) {
      return new Promise((resolve) => {
        for (let i = 0; i < list.length; i++) {
          if (list[i].id == listKye) {
            return resolve(i)
          }
        }
      })
    }
  }
}
</script>

<style lang="sass" scoped>
.avatar-uploader
  ul
    margin: 0
    li
      padding: 0
.el-dialog__body
  padding: 0
.map-flex
  display: flex
  width: 500px
  align-items: center

.ud-flex
  display: flex
.form-group
  display: flex
  align-items: center
  .form-label
    padding: 0px 15px
    font-size: 14px
    width: 240px
    font-weight: 400
    text-align: right
    margin-bottom: 18px
    .star
      color: red
      padding-right: 4px
  .input-block
    display: flex

.disContent
  display: flex
  align-items: center
  flex-wrap: wrap
  .img-div
    position: relative
    margin: 0 10px 0px 0
    width: 108px
    height: 108px
    border-radius: 4px
    overflow: hidden
    &>img
      width: 100%
      height: 100%

.disContent-hide
  position: absolute
  width: 100%
  height: 100%
  border-radius: 4px
  background-color: rgba(48, 48, 48, 0.59)
  display: none
  top: 0
  left: 0
  line-height: 32px

  .Delete
    position: absolute
    bottom: 14px
    right: 10px
    font-size: 16px
    color: white
    cursor: pointer
  .yuLan
    position: absolute
    bottom: 23px
    right: 50px
    font-size: 16px
    color: white
    cursor: pointer
    .yuLanImg
      position: absolute
      bottom: 0
      right: 0
      width: 100%
      height: 100%
      opacity: 0

.img-div:hover .disContent-hide
  display: block

  .pitchCss
    border: 1px solid #202e78
    transition: all linear 0.1s
    width: 116px
    height: 116px

</style>

