<template>
  <div>
    <dialog-edit :visible.sync="dialogVisible" :editModel="editModel" :form="form" :api="api" :width="width"
                 :title="$t('enterpriseInfoManage.organization.adjustPerson')">
      <div class="organ-item">
        <search-form :componentList="searchList"
                     :isShowFoldBtn="false"
                     :formValue.sync="queryParas" @handleFilter="handleFilter" @clearParam="clearParam"></search-form>
      </div>
      <data-table :api="api" :headTitle="$t('enterpriseInfoManage.organization.orgPersonHead')" :operateBtnLayout="operateBtnLayout"
                  @getTableData="getTableData"
                  :queryParas="queryParas" :sourceData.sync="sourceData" :loadCount.sync="loadCount" :columns="columns" :menuFlag="menuFlag"
                  :showSelection="showSelection" @selectRowChange="selectRowChange" :pageSizes="pageSizes">
        <template slot="headButton">
          <div class="btn-right">
            <btn-auto-import :xhr="$xhr" @upload="upload" size="medium" class="btnMarginRigth"></btn-auto-import>
<!--            <btn-download :fileID="fileId" :imageFlage="true"-->
<!--                          :classType="true" :xhr="$xhr" :store="$store" :openPerms="false"-->
<!--                          type="primary" size="medium"-->
<!--                          :downloadButtonMsg="$t('common.downloadTemplate')"></btn-download>-->
            <!--下载模板-->
            <auth-button type="primary" icon="iconfont iconycxiazai" :label="$t('cyjg.financialRegionInfo.downloadTemplate')"
                         :loading="downloadFileByTemplateCodeLoading"
                         @click="downloadFileByTemplateCode" size="medium"></auth-button>
            <auth-button type="primary" :label="$t('enterpriseInfoManage.organization.adjustPerson')" icon="iconfont iconquyuzhuanyuanbeizhu"
                         size="medium" @click="showAdjust">
            </auth-button>
            <auth-button type="danger" :label="$t('enterpriseInfoManage.supplierInfoManage.del')" icon="iconfont iconshanchu"
                         size="medium" @click="delBatch">
            </auth-button>
          </div>
        </template>
        <template slot="leaderFlag" slot-scope="scope">
          <el-switch v-model="scope.data.row.leaderFlag" @change="leaderFlagChange(scope.data.row)"></el-switch>
        </template>
        <!-- 操作 -->
        <!--<el-table-column :label="$t('common.operate')" align="center" width="120px">
          <template slot-scope="scope">
            <auth-button size="small" class="iconCircle" icon="iconfont iconshanchu"
                         :title="$t('enterpriseInfoManage.supplierInfoManage.del')" @click="del(scope.$index, scope.row)"></auth-button>
          </template>
        </el-table-column>-->
      </data-table>
      <adjust-person-edit :visible.sync="personFlag" :form="personItem" :editModel="personModel" :openModel="openModel" @refreshTable="handleFilter"></adjust-person-edit>
      <import-result :visible.sync="ResultFlag" :form="result" editModel="V" @refreshTable="handleFilter"></import-result>
    </dialog-edit>
  </div>
</template>

<script>
import ImportResult from '@/pages/enterpriseInfoManage/organization/ImportResult.vue'
import BaseEdit from '@/pages/baseEditPage'
import organizationApi from '@/api/enterpriseInfoManage/organizationApi.js'
import { DialogEdit, DataTable, searchForm, authButton, btnAutoImport, btnDownload } from 'newepoch-components'
import AdjustPersonEdit from '@/pages/enterpriseInfoManage/organization/adjustPersonEdit.vue'
import * as format from '@/filters/index'
import fileApi from '@/api/fileApi'
import { downFile } from '@/utils/devUtils'
export default {
  extends: new BaseEdit(),
  name: 'orgPersonEdit',
  components: {
    ImportResult,
    DataTable,
    DialogEdit,
    authButton,
    searchForm,
    AdjustPersonEdit,
    btnAutoImport,
    btnDownload
  },
  data () {
    return {
      downloadFileByTemplateCodeLoading: false,
      ResultFlag: false,
      result: {},
      width: '1480px',
      loadCount: 0,
      menuFlag: true,
      showSelection: true,
      operateBtnLayout: '',
      queryParas: {
        pageIndex: 1,
        pageSize: 5,
        orgId: '',
        nickName: '',
        account: ''
      },
      pageSizes: [5, 10, 15, 20, 25],
      rows: [],
      sourceData: [],
      columns: [
        // 组织机构名称
        {
          prop: 'orgNameIndex',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.organizationName,
          width: '100px'
        },
        // 登录账号
        {
          prop: 'account',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.loginAccount,
          width: '100px'
        },
        // 是否为部门负责人
        {
          prop: 'leaderFlag',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.leaderFlag,
          width: '50px',
          slot: true
        },
        // 人员姓名
        {
          prop: 'nickName',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.personName,
          width: '100px'
        }
      ],
      searchList: [
        // 登录账号
        {
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.loginAccount,
          disabled: false,
          value: 'account',
          maxlength: 128,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          labelWidth: '80px',
          componentName: 'el-input'
        },
        // 姓名
        {
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.name,
          disabled: false,
          value: 'nickName',
          maxlength: 255,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          labelWidth: '80px',
          componentName: 'el-input'
        }
      ],
      personFlag: false,
      personItem: {},
      personModel: '',
      openModel: ''
    }
  },
  computed: {
    fileId () {
      return format.formatDict('zcjg001', 'ZDZCJ001')
    },
    api () {
      return organizationApi.person
    }
  },
  methods: {
    // 通过模板下载
    downloadFileByTemplateCode () {
      this.downloadFileByTemplateCodeLoading = true
      fileApi.file.downloadFileByTemplateCode({ templateCode: 'zcjgdrmb001' }).then(res => {
        downFile(res)
      }).finally(res => {
        this.downloadFileByTemplateCodeLoading = false
      })
    },
    getTableData (data) {
      data.forEach(it => {
        // it.leaderFlag = it.leaderFlag === '1'
        this.$set(it, 'leaderFlag', it.leaderFlag === '1')
      })
    },
    leaderFlagChange (data) {
      var resultDto = {
        account: data.account,
        accountId: data.accountId,
        mobile: data.mobile,
        nickName: this.form.nickName,
        leaderFlag: data.leaderFlag ? '1' : '0',
        orgName: this.form.orgName,
        orgId: this.form.keyId
      }
      this.setLeaderFlag(resultDto, data)
    },
    setLeaderFlag (data, souceData) {
      this.api.setLeaderFlagApi(data).then(res => {
        if (res && res.data) {
          this.success(this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.leaderFlagChangeSuccess)
        } else {
          souceData.leaderFlag = !souceData.leaderFlag
        }
      }).catch(res => {
        souceData.leaderFlag = !souceData.leaderFlag
      })
    },
    upload (returnData) {
      let $this = this
      let fm = new FormData()
      fm.append('file', returnData)
      organizationApi.importPersonApi.importPerson(fm).then(res => {
        if (res.data) {
          $this.result = res.data
          $this.ResultFlag = true
          $this.handleFilter()
        } else {
          $this.error(this.$i18n.messages[this.$i18n.locale].cyjg.ladingManageList.importFileFaile)
        }
      })
    },
    // 查询
    handleFilter () {
      this.queryParas.account = this.queryParas.account.trim()
      this.queryParas.nickName = this.queryParas.nickName.trim()
      this.loadCount = this.loadCount + 1
      this.$emit('organ-person')
    },
    // 重置
    clearParam () {
      this.queryParas = {
        pageIndex: 1,
        pageSize: 5,
        orgId: this.form.keyId,
        account: '',
        nickName: ''
      }
    },
    selectRowChange (val) {
      this.rows = val
    },
    showAdjust () {
      this.personItem = Object.assign({}, this.form)
      this.personModel = 'C'
      this.openModel = 'org'
      this.personFlag = true
    },
    delBatch () {
      let $this = this
      if (this.rows.length === 0) {
        this.warning(this.$i18n.messages[this.$i18n.locale].common.delSelectedTip)
        return
      }
      let arr = this.rows.map(it => {
        return it.accountId
      })
      let str = this.$i18n.messages[this.$i18n.locale].regMsg.organization.ImportResult.confirmDel
      if (this.rows.length === this.sourceData.length) {
        str += this.$i18n.messages[this.$i18n.locale].regMsg.organization.ImportResult.delAll
      } else {
        this.rows.forEach(item => {
          str += item.nickName + ','
        })
        str = str.replace(/,$/gi, this.$i18n.messages[this.$i18n.locale].regMsg.organization.ImportResult.ma)
      }
      $this.$confirm(str, this.$i18n.messages[this.$i18n.locale].common.warningTip, {
        type: 'warning'
      }).then(() => {
        $this.api.dels({ orgId: $this.form.keyId, accountIds: arr }).then(res => {
          if (res && res.data) {
            $this.success(this.$i18n.messages[this.$i18n.locale].common.delSuccess)
            $this.handleFilter()
            $this.$emit('delRefresh')
          } else {
            $this.error(this.$i18n.messages[this.$i18n.locale].common.delFailure)
          }
        })
      }).catch(() => {})
    },
    del (index, data) {
      let $this = this
      $this.$confirm(this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.deleteNode,
        this.$i18n.messages[this.$i18n.locale].common.tip, {
          type: 'warning'
        }).then(() => {
        $this.api.del(data).then(res => {
          if (res && res.data) {
            $this.success(this.$i18n.messages[this.$i18n.locale].common.delSuccess)
          } else {
            $this.error(this.$i18n.messages[this.$i18n.locale].common.delFailure)
          }
        })
      }).catch(() => {})
    }
  },
  watch: {
    visible (val) {
      let $this = this
      if (val) {
        $this.$nextTick(() => {
          $this.queryParas.orgId = $this.form.keyId
          $this.loadCount = $this.loadCount + 1
        })
      } else {
        this.queryParas = {
          pageIndex: 1,
          pageSize: 5,
          orgId: '',
          account: '',
          nickName: ''
        }
      }
    }
  }
}
</script>

<style scoped>
</style>
