<!-- 业务操作信息 -->
<template>
  <div>
    <up-down-layout :handleFlag.sync="handleFlag">
      <search-form :componentList="searchList" :formValue.sync="searchForm"
                   @handleFilter="handleFilter" @clearParam="clearParam" slot="query"></search-form>
      <template slot="table">
        <data-table :api="api" :headTitle="$t('enterpriseInfoManage.supplierInfoManage.contactHeadTitle')" :loadCount.sync="loadCount"
                    :queryParas="searchForm" :sourceData.sync="sourceData" :showSelection="showSelection" :operateBtnLayout="operateBtnLayout"
                    :menuFlag="menuFlag" @selectRowChange="selectRowChange" :columns="columns" :selectTable="selectTable" @getTableData="getTableData"
                    :row-style="rowForbidden">
          <template slot="headButton">
            <el-row>
              <el-col :span="24" align="right">
                <auth-button type="primary" :label="$t('enterpriseInfoManage.supplierInfoManage.create')"
                             icon="iconfont iconxinzeng" size="medium" @click="showCreate"
                             :menuCode="menuId" perms="crBussCreate" :openPerms="true"></auth-button>
                <auth-button type="danger" :label="$t('enterpriseInfoManage.supplierInfoManage.del')"
                             icon="iconfont iconshanchu"  size="medium" @click="batchDel"
                             :menuCode="menuId" perms="crBussDelete" :openPerms="true"></auth-button>
              </el-col>
            </el-row>
          </template>
          <!-- 区域 -->
          <template slot="plateAreaRelDtoList" slot-scope="scope">
            <expand-collapse :sourceData="sourceData" :colProp="'coreAreaList'" v-if="searchForm.tagCode === '60'"
                             :valueProp="'areaName'" :rowIndex="scope.data.$index"></expand-collapse>
<!--            <expand-collapse :sourceData="sourceData" :colProp="'plateAreaRelDtoList'"-->
<!--                             :valueProp="'coreEnterpriseAreaName'" :rowIndex="scope.data.$index"></expand-collapse>-->
                <!--<span>{{item.coreEnterpriseAreaName}}</span>-->
              <!--</el-row>-->
            <!--</div>-->
          </template>
          <!-- 合同名称 -->
          <template slot="plateContractRelDtoList" slot-scope="scope">
            <expand-collapse :sourceData="sourceData" :colProp="'corePlateProjectList'" v-if="searchForm.tagCode === '60'"
                             :valueProp="'projectName'" :rowIndex="scope.data.$index"></expand-collapse>
<!--            <expand-collapse :sourceData="sourceData" :colProp="'plateContractRelDtoList'"-->
<!--                             :valueProp="'contractName'" :rowIndex="scope.data.$index"></expand-collapse>-->
            <!--<div :class="scope.data.row.moreFlag ? 'base_columns' : 'base_columns_more'">-->
              <!--<el-row v-for="(item, index) in scope.data.row.plateContractRelDtoList" :key="index">-->
                <!--<span>{{item.contractName}}</span>-->
              <!--</el-row>-->
            <!--</div>-->
          </template>
          <!-- 联系人 -->
          <template slot="employeeDtoList" slot-scope="scope">
            <expand-collapse :sourceData="sourceData" :colProp="'employeeDtoList'"
                             :valueProp="'employeeName'" :rowIndex="scope.data.$index"></expand-collapse>
            <!--<div :class="scope.data.row.moreFlag ? 'base_columns' : 'base_columns_more'">-->
              <!--<el-row v-for="(item, index) in scope.data.row.employeeDtoList" :key="index">-->
                <!--<span>{{item.employeeName}}</span>-->
              <!--</el-row>-->
            <!--</div>-->
          </template>
          <!-- 手机号码 -->
          <template slot="employeeDtoListmobilePhone" slot-scope="scope">
            <expand-collapse :sourceData="sourceData" :colProp="'employeeDtoList'"
                             :valueProp="'telephone'" :rowIndex="scope.data.$index"></expand-collapse>
            <!--<div :class="scope.data.row.moreFlag ? 'base_columns' : 'base_columns_more'">-->
              <!--<el-row v-for="(item, index) in scope.data.row.employeeDtoList" :key="index">-->
                <!--<span>{{item.telephone}}</span>-->
              <!--</el-row>-->
            <!--</div>-->
          </template>
          <el-table-column :label="$t('common.operate')" align="center" min-width="100px">
            <template slot-scope="scope">
              <!--<auth-button v-if="scope.row.btnFlag" class="iconCircle" :icon="scope.row.moreFlag ? 'iconfont iconxia' :'iconfont iconshang'"-->
                           <!--:title="scope.row.moreFlag ? $t('common.open') : $t('common.retract')"  @click="changeRow(scope.$index, scope.row)"></auth-button>-->
              <auth-button v-if="scope.row.delStatus === '0' || !scope.row.delStatus" size="small" class="iconCircle" icon="iconfont iconbianji"
                           :title="$t('common.edit')" @click="showEdit(scope.row)"
                           :menuCode="menuId" perms="crBussEdit" :openPerms="true"></auth-button>
              <auth-button v-if="scope.row.delStatus === '0'" size="mini" class="iconCircle" icon="iconfont iconlvli"
                           :title="$t('enterpriseInfoManage.supplierInfoManage.record')" @click="showRecordEdit(scope.row)"
                           :menuCode="menuId" perms="crBussVitae" :openPerms="true"></auth-button>
              <auth-button v-if="scope.row.delStatus === '0'" size="mini" class="iconCircle" icon="iconfont iconzhongzhimima"
                           :title="$t('enterpriseInfoManage.supplierInfoManage.resetPassword')" @click="reset(scope.row)"
                           :menuCode="menuId" perms="crBussReset" :openPerms="true"></auth-button>
              <auth-button v-if="scope.row.delStatus === '1'" size="mini" class="iconCircle" icon="iconfont iconshengcheng"
                           :title="$t('enterpriseInfoManage.supplierInfoManage.restoreAccount')" @click="restoreAccount(scope.row)"
                           :menuCode="menuId" perms="crBussRecovery" :openPerms="true"></auth-button>
            </template>
          </el-table-column>
        </data-table>
      </template>
    </up-down-layout>
    <contact-maintain-edit :visible.sync="showDetail" :menuId="menuId" :form="item" @createSuccess="createSuccess" :editModel="editModel" :regMsg="regMsg"></contact-maintain-edit>
    <contact-info-edit :visible.sync="showContact" :menuId="menuId" :form="contactItem" @createSuccess="success" :editModel="contactModel" :regMsg="regMsg"></contact-info-edit>
    <contact-record-edit :visible.sync="showRecord" :form="item" :editModel="recordModel"></contact-record-edit>
    <del-hint-edit :visible.sync="showDelInfo" :menuId="menuId" :form="item" :editModel="editModel"></del-hint-edit>
    <edit-contact-edit :visible.sync="showEditContact" :menuId="menuId" :regMsg="regMsg" :form="contactItem" :editModel="contactModel" @createSuccess="createSuccess"></edit-contact-edit>
  </div>
</template>

<script>
import * as format from '@/filters/index.js'
import { upDownLayout, searchForm, dymForm, DataTable, authButton, ExpandCollapse } from 'newepoch-components'
import SelectArea from '@/components/element/enterpriseInfoManage/SelectArea.vue'
import SelectContract from '@/components/element/enterpriseInfoManage/SelectContract.vue'
import supplierInfoManageApi from '@/api/enterpriseInfoManage/supplierInfoManageApi.js'
import BasePage from '@/pages/basePage'
import ContactMaintainEdit from '@/pages/enterpriseInfoManage/supplierInfoManage/contactMaintainEdit.vue'
import ContactInfoEdit from '@/pages/enterpriseInfoManage/supplierInfoManage/contactInfoEdit/contactInfoEdit.vue'
import DelHintEdit from '@/pages/enterpriseInfoManage/supplierInfoManage/delHintEdit.vue'
import ContactRecordEdit from '@/pages/enterpriseInfoManage/supplierInfoManage/contactRecordEdit.vue'
import storage from '@/utils/storage'
import editContactEdit from '@/pages/enterpriseInfoManage/supplierInfoManage/editContactEdit.vue'
export default {
  extends: new BasePage(),
  name: 'coreEnterbusinessOperateInfo',
  components: {
    upDownLayout,
    searchForm,
    dymForm,
    DataTable,
    authButton,
    SelectArea,
    SelectContract,
    ContactMaintainEdit,
    ContactInfoEdit,
    DelHintEdit,
    ContactRecordEdit,
    editContactEdit,
    ExpandCollapse
  },
  data () {
    return {
      handleFlag: true,
      menuFlag: true,
      showSelection: true,
      showContact: false,
      showEditContact: false,
      showRecord: false,
      showDelInfo: false,
      contactModel: '',
      recordModel: '',
      // 当前企业ID
      currentId: '',
      contactItem: {},
      operateBtnLayout: '',
      searchForm: {
        pageIndex: 1,
        pageSize: 10
      },
      sourceData: [],
      searchList: [
        // 联系人
        {
          value: 'employeeName',
          disabled: false,
          clearable: true,
          componentName: 'el-input',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.contact,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          labelWidth: '130px'
        },
        // 登录账号
        {
          value: 'account',
          disabled: false,
          clearable: true,
          componentName: 'el-input',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.loginAccount,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          labelWidth: '130px'
        },
        // 账号类型
        {
          value: 'employeeAccountType',
          disabled: false,
          clearable: true,
          componentName: 'SelectDictionary',
          dictTypeCode: 'create_account_type',
          store: this.$store,
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.accountType,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          labelWidth: '130px'
        },
        // 是否做业务
        {
          value: 'businessStatus',
          disabled: false,
          clearable: true,
          componentName: 'SelectDictionary',
          dictTypeCode: 'ZD0003',
          store: this.$store,
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.doBusiness,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          labelWidth: '130px'
        }
      ],
      columns: [
        // 账号类型
        {
          prop: 'employeeAccountType',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.accountType,
          width: '50px',
          format: (row) => {
            return format.formatDict(row.employeeAccountType, 'create_account_type')
          }
        },
        // 是否做业务
        {
          prop: 'businessStatus',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.doBusiness,
          width: '40px',
          format: (row) => { return format.formatDict(row.businessStatus, 'ZD0003') }
        },
        // 区域
        {
          prop: 'plateAreaRelDtoList',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.area,
          width: '80px',
          slot: true
        },
        // 合同名称
        {
          prop: 'plateContractRelDtoList',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.projectName,
          width: '120px',
          slot: true
        },
        // 登录账号
        {
          prop: 'account',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.loginAccount,
          width: '40px'
        },
        // 联系人
        {
          prop: 'employeeDtoList',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.contact,
          width: '50px',
          slot: true
        },
        // 手机号码
        {
          prop: 'employeeDtoListmobilePhone',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.mobilePhone,
          width: '',
          slot: true
        }
      ]
    }
  },
  computed: {
    menuId () {
      return storage.getLocal('params').menuId
    },
    api () {
      return supplierInfoManageApi.busnisssApi
    }
  },
  activated () {
    let pa = storage.getLocal('params')
    if (this.currentId !== pa.enterpriseId.toString()) {
      this.sourceData = []
    }
    this.currentId = pa.enterpriseId.toString()
    this.$set(this.searchForm, 'enterpriseId', pa.enterpriseId.toString())
    this.$set(this.searchForm, 'tagCode', pa.tagCode.toString())
  },
  mounted () {
    this.$nextTick(() => {
      this.$el.getElementsByClassName('el-checkbox')[7].style.display = 'none'
      let pa = storage.getLocal('params')
      if (this.currentId !== pa.enterpriseId.toString()) {
        this.sourceData = []
      }
      this.$set(this.searchForm, 'enterpriseId', pa.enterpriseId.toString())
      this.$set(this.searchForm, 'tagCode', pa.tagCode.toString())
    })
  },
  methods: {
    // 保存成功查询
    createSuccess () {
      this.handleFilter()
    },
    success () {
      this.handleFilter()
    },
    // 展开收起
    changeRow (index, data) {
      // this.sourceData[index].moreFlag = !data.moreFlag
      let $this = this
      $this.$set($this.sourceData[index], 'moreFlag', !data.moreFlag)
    },
    // 数据处理
    getTableData (data) {
      var that = this
      data.forEach(it => {
        if (that.searchForm.tagCode === '60') {
          it.coreAreaList = []
          it.corePlateProjectList = []
          if (it.corePlateAreaRelDTOList) {
            it.corePlateAreaRelDTOList.forEach(it1 => {
              if (it1.bigAreaName && it1.areaName) {
                it.coreAreaList.push({ areaName: it1.bigAreaName + '-' + it1.areaName })
              } else if (it1.bigAreaName && !it1.areaName) {
                it.coreAreaList.push({ areaName: it1.bigAreaName })
              } else if (!it1.bigAreaName && it1.areaName) {
                it.coreAreaList.push({ areaName: it1.areaName })
              }
              it1.fincrmCorePlateProjectRelDTOList.forEach(it2 => {
                it.corePlateProjectList.push({ projectName: it2.projectEnterpriseName })
              })
            })
          }
        }
      })
      this.sourceData = data
    },
    // 查询
    getList (parmas) {
      let keys = Object.keys(parmas)
      keys.forEach(it => {
        if (parmas[it] === '' || parmas[it].length === 0) {
          delete parmas[it]
        }
      })
      let that = this
      supplierInfoManageApi.invoiceListApi.getbussList(parmas).then(res => {
        if (res.data && res.data.datas) {
          that.sourceData = res.data.datas
        }
      })
    },
    // 复选框勾选数据
    selectRowChange (val) {
      this.selectedRows = val
    },
    batchDel () {
      if (this.selectedRows.length > 0) {
        let employeeIds = []
        let keyIds = []
        let accountIds = []
        // let keyIds2 = this.selectedRows.keyId
        this.selectedRows.forEach(it => {
          keyIds.push(it.keyId)
          accountIds.push(it.accountId)
          it.employeeDtoList.forEach(it1 => {
            employeeIds.push(it1.keyId)
          })
        })
        this.editModel = 'D'
        // this.item = Object.assign({ keyIds: keyIds, keyId: keyIds2, enterpriseId: this.searchForm.enterpriseId })
        this.item = Object.assign({ employeeIds: employeeIds, keyIds: keyIds, enterpriseId: this.searchForm.enterpriseId, tagCode: this.searchForm.tagCode, accountIds: accountIds })
        this.showDelInfo = true
      } else {
        this.warning('请先勾选数据')
      }
    },
    // 新增
    showCreate () {
      this.editModel = 'C'
      // 供应商名称
      this.item = { tagCode: this.searchForm.tagCode, enterpriseId: this.searchForm.enterpriseId, loading: false }
      this.showDetail = true
    },
    // 编辑
    showEdit (data) {
      this.contactModel = 'E'
      // this.contactItem = Object.assign({ tagCode: this.searchForm.tagCode }, data)
      // this.showContact = true
      if (data.employeeAccountType && data.account) {
        this.contactItem = Object.assign({ tagCode: this.searchForm.tagCode, loading: false }, data)
        this.showContact = true
      } else {
        this.showEditContact = true
        if (data.employeeInfoDto && data.employeeInfoDto.enterpriseDeptId === '0') {
          data.employeeInfoDto.enterpriseDeptId = ''
        }
        let factoringResponsibility = []
        data.attributeDTOList.forEach(it => {
          if (it.attributeType === '3') {
            factoringResponsibility.push(it.attributeValue)
          }
        })
        this.contactItem = Object.assign({
          loading: false,
          employeeType: this.searchForm.tagCode,
          enterpriseId: this.searchForm.enterpriseId,
          enterpriseName: storage.getLocal('params').enterpriseName,
          deptId: data.employeeInfoDto.enterpriseDeptId,
          position: data.employeeInfoDto.position,
          factoringResponsibility: factoringResponsibility,
          cenerateType: '0' }, data.employeeDtoList[0])
      }
    },
    // 联系人履历
    showRecordEdit (data) {
      this.recordModel = 'V'
      this.item = Object.assign({}, data)
      this.showRecord = true
    },
    // 重置密码
    reset (rowData) {
      let $this = this
      $this.$confirm(this.$i18n.messages[this.$i18n.locale].regMsg.enterpriseInfoManage.restPassward, this.$i18n.messages[this.$i18n.locale].common.tip, {
        confirmButtonText: this.$i18n.messages[this.$i18n.locale].common.assign,
        cancelButtonText: this.$i18n.messages[this.$i18n.locale].common.cancel,
        type: 'warning'
      }).then(() => {
        supplierInfoManageApi.accountApi.resetPassword(rowData.keyId).then(res => {
          if (res.data) {
            $this.warning($this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.midifyPassWordsu)
          } else {
            $this.error(this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.midifyPassWordfa)
          }
        })
      })
    },
    // 恢复账号
    restoreAccount (rowData) {
      let that = this
      that.$confirm(this.$i18n.messages[this.$i18n.locale].regMsg.enterpriseInfoManage.recoveryAccount, this.$i18n.messages[this.$i18n.locale].common.tip, {
        confirmButtonText: this.$i18n.messages[this.$i18n.locale].common.assign,
        cancelButtonText: this.$i18n.messages[this.$i18n.locale].common.cancel,
        type: 'warning'
      }).then(() => {
        supplierInfoManageApi.accountApi.setAccountStatus(rowData).then(res => {
          if (res.data) {
            that.success(this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.midifyTextSues)
            that.handleFilter()
          } else {
            that.error(this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.midifyTextfail)
          }
        })
      })
    },
    // 账号禁用
    rowForbidden ({ row, index }) {
      if (row.delStatus === '1') {
        return 'color: #cccbcb'
      } else {
        return 'color: #606266'
      }
    },
    // 勾选框禁用
    selectTable (row) {
      if (row.delStatus === '1' || row.delStatus === null) {
        return false
      } else {
        return true
      }
    },
    // 重置
    clearParam () {
      this.searchForm = {
        pageIndex: 1,
        pageSize: 10,
        // employeeName: '',
        // regionCode: '',
        // account: '',
        enterpriseId: this.searchForm.enterpriseId,
        tagCode: this.searchForm.tagCode
        // employeeAccountType: '',
        // businessStatus: '',
        // contractId: '',
        // bizMode: ''
      }
    }
  },
  watch: {
    showDelInfo (val) {
      if (!val) {
        this.handleFilter()
      }
    }
  }
}
</script>

<style scoped lang="scss">
  @import '~@/styles/enterpriseInfoManage/supplierInfoManage/businessOperateInfo.scss';
</style>
