<!-- 业务操作信息 -->
<template>
  <div>
    <up-down-layout :handleFlag.sync="handleFlag">
      <search-form :componentList="searchList" :formValue.sync="searchForm"
                   @handleFilter="handleFilter" @clearParam="clearParam" @selectChanged="selectChanged" slot="query"></search-form>
      <template slot="table">
        <data-table :api="api" :headTitle="$t('enterpriseInfoManage.supplierInfoManage.contactHeadTitle')" class="none-checkbox"
                    :queryParas="searchForm" :sourceData.sync="sourceData" :showSelection="showSelection" :operateBtnLayout="operateBtnLayout"
                    :menuFlag="menuFlag" @selectRowChange="selectRowChange" :columns="columns" :selectTable="selectTable"
                    @getTableData="getTableData"
                    :row-style="rowForbidden" ref="dataTableLocal" :loadCount.sync="loadCount">
          <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="buCreate" :openPerms="true"></auth-button>
                <auth-button type="danger" :label="$t('enterpriseInfoManage.supplierInfoManage.del')"
                             icon="iconfont iconshanchu" size="medium" @click="batchDel"
                             :menuCode="menuId" perms="buDelete" :openPerms="true"></auth-button>
              </el-col>
            </el-row>
          </template>
          <!-- 区域 -->
          <template slot="plateAreaRelDtoList" slot-scope="scope">
            <expand-collapse :sourceData="sourceData" :colProp="'plateAreaRelDtoList'" v-if="searchForm.tagCode === '140'"
                             :valueProp="'coreEnterpriseAreaName'" :rowIndex="scope.data.$index"></expand-collapse>
          </template>
          <!-- 合同名称 -->
          <template slot="plateContractRelDtoList" slot-scope="scope">
            <expand-collapse :sourceData="sourceData" :colProp="'projectPlateContractRelDTOList'" v-if="searchForm.tagCode === '150'"
                             :valueProp="'contractName'" :rowIndex="scope.data.$index"></expand-collapse>
            <expand-collapse :sourceData="sourceData" :colProp="'plateContractRelDtoList'" v-if="searchForm.tagCode === '140'"
                             :valueProp="'contractName'" :rowIndex="scope.data.$index"></expand-collapse>
          </template>
          <!-- 联系人 -->
          <template slot="employeeDtoList" slot-scope="scope">
            <expand-collapse :sourceData="sourceData" :colProp="'employeeDtoList'"
                             :valueProp="'employeeName'" :rowIndex="scope.data.$index"></expand-collapse>
          </template>
          <!-- 手机号码 -->
          <template slot="employeeDtoListmobilePhone" slot-scope="scope">
            <expand-collapse :sourceData="sourceData" :colProp="'employeeDtoList'"
                             :valueProp="'telephone'" :rowIndex="scope.data.$index"></expand-collapse>
          </template>
          <el-table-column :label="$t('common.operate')" align="center" min-width="100px"  width="160px">
            <template slot-scope="scope">
              <auth-button v-if="scope.row.delStatus === '0' || !scope.row.delStatus" size="mini" class="iconCircle" icon="iconfont iconbianji"
                           :title="$t('common.edit')" @click="showEdit(scope.row)"
                           :menuCode="menuId" perms="buEdit" :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="buVitae" :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="buReset" :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="buRestore" :openPerms="true"></auth-button>
            </template>
          </el-table-column>
        </data-table>
      </template>
    </up-down-layout>
    <contact-maintain-edit :visible.sync="showDetail" :menuId="menuId" :form="item" :editModel="editModel" :regMsg="regMsg" @createSuccess="createSuccess"></contact-maintain-edit>
    <contact-info-edit :visible.sync="showContact" :menuId="menuId" :enterpriseType="enterpriseType" :form="contactItem" :editModel="contactModel" :regMsg="regMsg" @createSuccess="createSuccess"></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" @delSuccess="delSuccess"></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 SelectProjContract from '@/components/element/enterpriseInfoManage/SelectProjContract.vue'
import supplierInfoManageApi from '@/api/enterpriseInfoManage/supplierInfoManageApi.js'
import BasePage from '@/pages/basePage'
import CreateContactEdit from '@/pages/enterpriseInfoManage/supplierInfoManage/createContactEdit.vue'
import ContactInfoEdit from '@/pages/enterpriseInfoManage/supplierInfoManage/contactInfoEdit/contactInfoEdit.vue'
import ContactRecordEdit from '@/pages/enterpriseInfoManage/supplierInfoManage/contactRecordEdit.vue'
import DelHintEdit from '@/pages/enterpriseInfoManage/supplierInfoManage/delHintEdit.vue'
import ContactMaintainEdit from '@/pages/enterpriseInfoManage/supplierInfoManage/contactMaintainEdit.vue'
import editContactEdit from '@/pages/enterpriseInfoManage/supplierInfoManage/editContactEdit.vue'
import storage from '@/utils/storage'
export default {
  extends: new BasePage(),
  name: 'businessOperateInfo',
  components: {
    upDownLayout,
    searchForm,
    dymForm,
    DataTable,
    authButton,
    SelectArea,
    SelectContract,
    SelectProjContract,
    CreateContactEdit,
    ContactInfoEdit,
    ContactRecordEdit,
    DelHintEdit,
    ContactMaintainEdit,
    editContactEdit,
    ExpandCollapse
  },
  props: {
    enterpriseType: {
      type: String,
      default: function () {
        return null
      }
    }
  },
  data () {
    return {
      handleFlag: true,
      menuFlag: true,
      showSelection: true,
      showContact: false,
      // 编辑属性
      showEditContact: false,
      showRecord: false,
      showDelInfo: false,
      reloadContract: false,
      contactModel: '',
      recordModel: '',
      contactItem: {},
      operateBtnLayout: '',
      // 当前企业ID
      currentId: '',
      searchForm: {
        pageIndex: 1,
        pageSize: 10,
        employeeName: '',
        regionCode: '',
        account: '',
        employeeAccountType: '',
        businessStatus: '',
        preContractId: '',
        contractId: '',
        bizMode: ''
      },
      sourceData: [],
      presearchList: [
        // 区域
        {
          value: 'regionCodeTemp',
          disabled: false,
          clearable: true,
          componentName: SelectArea,
          filterable: true,
          name: 'regionCode',
          multiple: false,
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.area,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          labelWidth: '130px'
        },
        // 合同名称
        {
          value: 'contractId',
          disabled: false,
          clearable: true,
          componentName: SelectContract,
          queryName: 'enterpriseId',
          queryValue: 'enterpriseId',
          reload: this.reloadContract,
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.contractName,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          labelWidth: '130px'
        },
        // 合同名称
        {
          value: 'preContractId',
          disabled: false,
          clearable: true,
          componentName: SelectProjContract,
          queryName: 'enterpriseId',
          queryValue: 'enterpriseId',
          reload: this.reloadContract,
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.contractName,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          labelWidth: '130px'
        }
      ],
      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: 'regionCodeTemp',
          disabled: false,
          clearable: true,
          componentName: SelectArea,
          filterable: true,
          name: 'regionCode',
          multiple: false,
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.area,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          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'
        },
        // 合同名称
        {
          value: 'contractId',
          disabled: false,
          clearable: true,
          componentName: SelectContract,
          queryName: 'enterpriseId',
          queryValue: 'enterpriseId',
          reload: this.reloadContract,
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.contractName,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          labelWidth: '130px'
        },
        // 业务模式
        {
          value: 'bizMode',
          disabled: false,
          clearable: true,
          componentName: 'SelectDictionary',
          dictTypeCode: 'biz_mode',
          store: this.$store,
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.businessModel,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          labelWidth: '130px'
        }
      ],
      preColumns: [
        // 区域
        {
          prop: 'plateAreaRelDtoList',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.area,
          width: '100px',
          slot: true
        }
      ],
      columns: [
        // 账号类型
        {
          prop: 'employeeAccountType',
          align: 'center',
          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: '100px',
          slot: true
        },
        // 合同名称
        {
          prop: 'plateContractRelDtoList',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.contractName,
          width: '100px',
          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: '50px',
          slot: true
        }
      ]
    }
  },
  computed: {
    menuId () {
      return storage.getLocal('params').menuId
    },
    api () {
      return supplierInfoManageApi.busnisssApi
    }
  },
  activated () {
    let pa = storage.getLocal('params')
    this.setColumns(pa)
    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())
    this.reloadContract = !this.reloadContract
  },
  mounted () {
    let pa = storage.getLocal('params')
    this.setColumns(pa)
    this.$nextTick(() => {
      if (this.currentId !== pa.enterpriseId.toString()) {
        this.sourceData = []
      }
      this.$set(this.searchForm, 'enterpriseId', pa.enterpriseId.toString())
      this.$set(this.searchForm, 'tagCode', pa.tagCode.toString())
      this.reloadContract = !this.reloadContract
    })
  },
  methods: {
    // 处理列表显示
    setColumns (data) {
      if (data.tagCode.toString() === '150') {
        if (this.searchList[1].value === 'regionCodeTemp') {
          this.searchList.splice(1, 1)
        }
        this.searchList.splice(4, 1, this.presearchList[2])
        if (this.columns[2].prop === 'plateAreaRelDtoList') {
          this.columns.splice(2, 1)
        }
      } else {
        if (this.searchList[1].value !== 'regionCodeTemp') {
          this.searchList.splice(1, 0, this.presearchList[0])
        }
        this.searchList.splice(5, 1, this.presearchList[1])
        if (this.columns[2].prop !== 'plateAreaRelDtoList') {
          this.columns.splice(2, 0, this.preColumns[0])
        } else {
        }
      }
    },
    // 接收到创建成功刷新
    createSuccess () {
      this.handleFilterFun()
      // this.$emit('saveSuccess')
    },
    // 区域
    selectChanged (selectObj) {
      if (selectObj['regionCodeInfo'] && selectObj['regionCodeInfo'].length >= 1) {
        this.searchForm.regionCode = selectObj['regionCodeInfo'][0].areaId
      } else {
        this.searchForm.regionCode = ''
      }
    },

    // 查询成功加载数据
    getTableData (data) {
    },
    // 查询
    getList (parmas) {
      let that = this
      let keys = Object.keys(parmas)
      keys.forEach(it => {
        if (parmas[it] === '' || parmas[it].length === 0) {
          delete parmas[it]
        }
      })
      that.$refs['dataTableLocal'].vLoading = true
      supplierInfoManageApi.invoiceListApi.getbussList(parmas).then(res => {
        that.$refs['dataTableLocal'].buildTableData(res.data.datas, res.data.totalRow)
      }).finally(() => {
        that.$refs['dataTableLocal'].vLoading = false
      })
    },
    // 复选框勾选数据
    selectRowChange (val) {
      this.selectedRows = val
    },
    batchDel () {
      if (this.selectedRows.length > 0) {
        let employeeIds = []
        let keyIds = []
        let accountIds = []
        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({ employeeIds: employeeIds, keyIds: keyIds, enterpriseId: this.searchForm.enterpriseId, tagCode: this.searchForm.tagCode, accountIds: accountIds })
        this.showDelInfo = true
      } else {
        this.warning('请先勾选数据')
      }
    },
    // 联系人删除成功
    delSuccess () {
      this.handleFilterFun()
      // this.$emit('saveSuccess')
    },
    // 新增
    showCreate () {
      this.editModel = 'C'
      // 供应商名称
      this.item = { tagCode: this.searchForm.tagCode, enterpriseId: this.searchForm.enterpriseId, loading: false }
      this.showDetail = true
    },
    // 编辑
    showEdit (data) {
      this.contactModel = 'E'
      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 $this = this
      $this.$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) {
            $this.success(this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.supplierInfoManage.midifyTextSues)
            $this.handleFilterFun()
          } else {
            $this.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
      }
    },
    // 展开收起
    changeRow (index, data) {
      // this.sourceData[index].moreFlag = !data.moreFlag
      let $this = this
      $this.$set($this.sourceData[index], 'moreFlag', !data.moreFlag)
    },
    handleFilterFun () {
      this.handleFilter()
      this.$emit('saveSuccess')
    },
    // 重置
    clearParam () {
      this.searchForm = {
        pageIndex: 1,
        pageSize: 10,
        // employeeName: '',
        // regionCode: '',
        // account: '',
        enterpriseId: this.searchForm.enterpriseId,
        tagCode: this.searchForm.tagCode
        // employeeAccountType: '',
        // businessStatus: '',
        // contractId: '',
        // bizMode: ''
      }
    }
  },
  watch: {
    'searchForm.employeeAccountType' (val) {
      if (val) {
        if (val === '1') {
          // this.searchForm.bizMode = '1'
          this.$set(this.searchForm, 'bizMode', '1')
        }
      } else {
        this.$set(this.searchForm, 'bizMode', '')
      }
    }
  }
}
</script>

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