<!-- 导入--内容冲突弹出框 -->
<template>
  <div>
    <dialog-edit :visible.sync="dialogVisible" :api="{}" :editModel="editModel" :form="form" :autoSave="autoSave" :saveBtnFlag="false" :width="width"
                 :title="$t('cyjg.businessRegionInfo.importConflictInfo')" @onSaved="onSaved" :saveLabel="$t('cyjg.businessRegionInfo.import')" :loading="loading">
      <span class="font-class">{{$t('cyjg.businessRegionInfo.tableTip')}}</span>
      <data-table :operateBtnLayout="operateBtnLayout" :sourceData.sync="sourceData" :toolMenuFlag="toolMenuFlag"
                  :queryParas="queryParas" :loadCount.sync="loadCount" :columns="columns" :showPage="showPage" class="position-class">
        <!-- 区域专员 -->
        <template slot="commissionerName" slot-scope="scope">
          <span v-for="(item, index) in scope.data.row.areaCommissionerList" :key="index" :class="item.flag ? (item.handleFlag ? 'green-class' : 'red-class') : ''" @click="showDetailEdit(item, scope.data.$index)">
            <span v-if="index > 0" class="cut-class">,</span>{{item.commissioner}}
          </span>
        </template>
        <!-- 业务专员 -->
        <template slot="businessCommissioner" slot-scope="scope">
          <span v-for="(item, index) in scope.data.row.businessCommissionerList" :key="index" :class="item.flag ? (item.handleFlag ? 'green-class' : 'red-class') : ''" @click="showDetailEdit(item, scope.data.$index)">
            <span v-if="index > 0" class="cut-class">,</span>{{item.business}}
          </span>
        </template>
        <!-- 城市公司 -->
        <template slot="cityCompany" slot-scope="scope">
          <span>{{scope.data.row.projectCompanyRel}}</span>
        </template>
        <!-- 区域对接人信息-->
        <template slot="contactInfo" slot-scope="scope">
          <el-row v-for="(item, index) in formatData(scope.data.row)" :key="index">
            <span>{{item.contact}}</span>
          </el-row>
        </template>
        <!-- 电话 -->
        <!-- <el-table-column :label="$t('cyjg.businessRegionInfo.phoneNumber')" align="center">
          <template slot-scope="scope">
            <span>{{formatData(scope.row).phone}}</span>
          </template>
        </el-table-column> -->
      </data-table>
    </dialog-edit>
    <choose-account-edit :visible.sync="selectVisible" :form="selectItem" :editModel="selectModel" :index="rowIndex"
                         :chooseData="chooseData" @checkData="checkData"></choose-account-edit>
  </div>
</template>

<script>
import { DialogEdit, DataTable } from 'newepoch-components'
import BaseEdit from '@/pages/baseEditPage'
import businessRegionInfoApi from '@/api/cyjg/businessRegionInfoApi.js'
import ChooseAccountEdit from '@/pages/cyjg/businessRegionInfo/chooseAccountEdit.vue'
export default {
  extends: new BaseEdit(),
  name: 'businessImportEdit',
  props: {
    // 传参TableData
    importData: {
      type: [Array, Object],
      default: function () {
        return null
      }
    }
  },
  components: {
    DialogEdit,
    DataTable,
    ChooseAccountEdit
  },
  data () {
    return {
      width: '1480px',
      loadCount: 0,
      loading: false,
      toolMenuFlag: false,
      selectVisible: false,
      showPage: false,
      autoSave: false,
      selectModel: 'C',
      operateBtnLayout: '',
      rowIndex: 0,
      selectItem: {},
      queryParas: {},
      sourceData: [],
      chooseData: [],
      saveData: [],
      columns: [
        // 核心企业
        {
          prop: 'coreCompanyName',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].cyjg.businessRegionInfo.coreEnterprise
        },
        // 大区域
        {
          prop: 'largeAreaName',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].cyjg.businessRegionInfo.lageArea
        },
        // 小区域
        {
          prop: 'smallAreaName',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].cyjg.businessRegionInfo.littleArea
        },
        // 区域专员
        {
          prop: 'commissionerName',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].cyjg.businessRegionInfo.commissionerName,
          slot: true
        },
        // 业务专员
        {
          prop: 'businessCommissioner',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].cyjg.businessRegionInfo.businessCommissioner,
          slot: true
        },
        // 城市公司
        {
          prop: 'cityCompany',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].cyjg.businessRegionInfo.cityCompany,
          slot: true
        },
        // 区域对接人信息
        {
          prop: 'contactInfo',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].cyjg.businessRegionInfo.contactAndPhone,
          slot: true
        }
      ]
    }
  },
  methods: {
    // 区域专员
    commissionerFormat (data) {
      let areaData = []
      if (!this.UtilJs.isEmpty(data.areaCommissioner)) {
        Object.keys(data.areaCommissioner).forEach(it => {
          let info = {
            commissioner: '',
            flag: false,
            handleFlag: false,
            dataList: [],
            chooseRadio: {}
          }
          info.commissioner = it
          if (data.areaCommissioner[it].length > 1) {
            info.flag = true
          } else {
            info.flag = false
          }
          info.dataList = data.areaCommissioner[it]
          areaData.push(info)
        })
      }
      return areaData
    },
    // 业务经理
    businessFormat (data) {
      let businessData = []
      if (!this.UtilJs.isEmpty(data.businessCommissioner)) {
        for (let key of Object.keys(data.businessCommissioner)) {
          let info = {
            business: '',
            flag: false,
            handleFlag: false,
            dataList: [],
            chooseRadio: {}
          }
          info.business = key
          if (data.businessCommissioner[key].length > 1) {
            info.flag = true
          } else {
            info.flag = false
          }
          info.dataList = data.businessCommissioner[key]
          businessData.push(info)
        }
      }
      return businessData
    },
    // 弹出详细信息
    showDetailEdit (data, index) {
      let $this = this
      if (data.flag) {
        $this.chooseData = data
        $this.rowIndex = index
        $this.selectVisible = true
      } else {
        $this.chooseData = []
        $this.selectVisible = false
      }
    },
    // 构造导入数据
    checkData (obj, index, chooseData) {
      let $this = this
      if (chooseData.commissioner) {
        $this.sourceData[index].areaCommissionerList.forEach(it => {
          if (it.commissioner === chooseData.commissioner) {
            it.handleFlag = chooseData.handleFlag
            it.chooseRadio = obj
          }
        })
      }
      if (chooseData.business) {
        $this.sourceData[index].businessCommissionerList.forEach(it => {
          if (it.business === chooseData.business) {
            it.handleFlag = chooseData.handleFlag
            it.chooseRadio = obj
          }
        })
      }
      if (obj.type === '1') {
        let areaList = $this.commissionerFormat($this.sourceData[index])
        // 区域专员
        if ($this.saveData[index].areaCommissioner.length > 0) {
          for (let n = 0; n < $this.saveData[index].areaCommissioner.length; n++) {
            for (let i = 0; i < areaList.length; i++) {
              // 判断是否 是有重复数据的人员
              if (this.UtilJs.isEmpty($this.saveData[index].areaCommissioner[n].single)) {
                // 判断是否是 再次勾选的数据 则进行数据重赋值
                if ($this.saveData[index].areaCommissioner[n].name === obj.name) {
                  $this.saveData[index].areaCommissioner[n].keyId = obj.keyId
                } else {
                  // 否 则直接push一个新的 有重复数据的人员
                  if (areaList[i].dataList.length > 1 && obj.name === areaList[i].commissioner) {
                    let q = {
                      keyId: '',
                      name: ''
                    }
                    q.keyId = obj.keyId
                    q.name = obj.name
                    $this.saveData[index].areaCommissioner.push(q)
                  }
                }
              }
            }
          }
        } else {
          // 第一次勾选，将没有重复数据的人员筛选出来
          for (let i = 0; i < areaList.length; i++) {
            // 区域专员
            if (areaList[i].dataList.length === 1) {
              let p = {
                keyId: '',
                name: '',
                single: true
              }
              p.keyId = areaList[i].dataList[0].keyId
              p.name = areaList[i].dataList[0].name
              $this.saveData[index].areaCommissioner.push(p)
            } else {
              if (obj.name === areaList[i].commissioner) {
                let m = {
                  keyId: '',
                  name: ''
                }
                m.keyId = obj.keyId
                m.name = obj.name
                $this.saveData[index].areaCommissioner.push(m)
              }
            }
          }
        }
      } else if (obj.type === '2') {
        let businessList = $this.businessFormat($this.sourceData[index])
        // 业务经理
        if ($this.saveData[index].businessCommissioner.length > 0) {
          for (let n = 0; n < $this.saveData[index].businessCommissioner.length; n++) {
            for (let i = 0; i < businessList.length; i++) {
              // 判断是否 是有重复数据的业务经理
              if (this.UtilJs.isEmpty($this.saveData[index].businessCommissioner[n].single)) {
                // 判断是否是 再次勾选的数据 则进行数据重赋值
                if ($this.saveData[index].businessCommissioner[n].name === obj.name) {
                  $this.saveData[index].businessCommissioner[n].keyId = obj.keyId
                } else {
                  // 否 则直接push一个新的 有重复数据的业务经理
                  if (businessList[i].dataList.length > 1 && obj.name === businessList[i].business) {
                    let m = {
                      keyId: '',
                      name: ''
                    }
                    m.keyId = obj.keyId
                    m.name = obj.name
                    $this.saveData[index].businessCommissioner.push(m)
                  }
                }
              }
            }
          }
        } else {
          // 第一次勾选，将没有重复数据的业务经理筛选出来
          for (let i = 0; i < businessList.length; i++) {
            if (businessList[i].dataList.length === 1) {
              let p = {
                keyId: '',
                name: '',
                single: true
              }
              p.keyId = businessList[i].dataList[0].keyId
              p.name = businessList[i].dataList[0].name
              $this.saveData[index].businessCommissioner.push(p)
            } else {
              if (obj.name === businessList[i].business) {
                let m = {
                  keyId: '',
                  name: ''
                }
                m.keyId = obj.keyId
                m.name = obj.name
                $this.saveData[index].businessCommissioner.push(m)
              }
            }
          }
        }
      }
    },
    // 保存
    onSaved () {
      let $this = this
      let tip = this.$i18n.messages[this.$i18n.locale].cyjg.businessRegionInfo
      let flag = 0
      $this.saveData.forEach(it => {
        if (it.areaCommissioner.length === 0 || it.businessCommissioner.length === 0) {
          flag++
        }
      })
      if (flag > 0) {
        $this.warning(tip.importTip)
        return
      }
      $this.loading = true
      businessRegionInfoApi.companyView.import($this.saveData).then(res => {
        if (res && res.data) {
          $this.success(tip.importSuccess)
          $this.dialogVisible = false
          $this.loading = false
          $this.$emit('import-success')
        }
      }).catch(() => {
        $this.loading = false
      })
    },
    // 构造联系人-电话信息
    formatData (data) {
      let dataList = []
      if (data.dockingPeopleRel) {
        for (let i = 0; i < data.dockingPeopleRel.length; i++) {
          let info = {
            contact: ''
          }
          info.contact = data.dockingPeopleRel[i].contactName + '(' + data.dockingPeopleRel[i].contactPhone + ')'
          dataList.push(info)
        }
      }
      return dataList
    }
  },
  watch: {
    visible (val) {
      let $this = this
      if (val) {
        $this.saveData = JSON.parse(JSON.stringify($this.importData))
        $this.saveData.forEach(it => {
          it.areaCommissioner = []
        })
        $this.saveData.forEach(it => {
          it.businessCommissioner = []
        })
        $this.sourceData = $this.importData
        $this.sourceData.forEach((it, index) => {
          let areaCount = 0
          let businessCount = 0
          if (it.areaCommissioner) {
            let areaList = $this.commissionerFormat(it)
            $this.$set($this.sourceData[index], 'areaCommissionerList', areaList)
            areaList.forEach(it => {
              if (it.flag) {
                areaCount++
              }
            })
            if (areaCount === 0) {
              for (let i = 0; i < areaList.length; i++) {
                let m = {
                  keyId: '',
                  name: ''
                }
                m.keyId = areaList[i].dataList[0].keyId
                m.name = areaList[i].commissioner
                $this.saveData[index].areaCommissioner.push(m)
              }
            }
          }
          if (it.businessCommissioner) {
            let businessList = $this.businessFormat(it)
            $this.$set($this.sourceData[index], 'businessCommissionerList', businessList)
            businessList.forEach(it => {
              if (it.flag) {
                businessCount++
              }
            })
            if (businessCount === 0) {
              for (let j = 0; j < businessList.length; j++) {
                let n = {
                  keyId: '',
                  name: ''
                }
                n.keyId = businessList[j].dataList[0].keyId
                n.name = businessList[j].business
                $this.saveData[index].businessCommissioner.push(n)
              }
            }
          }
        })
        /* $this.sourceData.forEach((it, index) => {
          let areaCount = 0
          let businessCount = 0
          let areaList = this.commissionerFormat(it)
          areaList.forEach(it => {
            if (it.flag) {
              areaCount++
            }
          })
          if (areaCount === 0) {
            for (let i = 0; i < areaList.length; i++) {
              let m = {
                keyId: '',
                name: ''
              }
              m.keyId = areaList[i].dataList[0].keyId
              m.name = areaList[i].commissioner
              $this.saveData[index].areaCommissioner.push(m)
            }
          }
          let businessList = this.businessFormat(it)
          businessList.forEach(it => {
            if (it.flag) {
              businessCount++
            }
          })
          if (businessCount === 0) {
            for (let j = 0; j < businessList.length; j++) {
              let n = {
                keyId: '',
                name: ''
              }
              n.keyId = businessList[j].dataList[0].keyId
              n.name = businessList[j].business
              $this.saveData[index].businessCommissioner.push(n)
            }
          }
        }) */
      } else {
        $this.sourceData = []
        $this.saveData = []
      }
    }
  }
}
</script>

<style scoped lang="scss" src="@/styles/cyjg/businessRegionInfo/businessImportEdit.scss">
</style>
