<!-- 合规抽查意见报表 -->
<template>
  <div>
    <up-down-layout :header="$t('complianceCheck.complianceOpinionReportTitle')" :handleFlag.sync="handleFlag">
      <search-form @clearParam="clearParam" @handleFilter="handleFilter" :formValue.sync="queryParas"
                   v-model="queryParas" :componentList="componentList" slot="query"
                   :menuCode="menuId" searchPerms="search" resetPerms="reset"></search-form>
      <template slot="table">
        <data-table :handleFlag.sync="handleFlag" :queryParas="queryParas" :sourceData.sync="sourceData"
                    :api="api" :loadCount.sync="loadCount" operateBtnLayout="" :menuFlag="true" ref="dataTable"
                    :columns="columns" v-bind="elHeightObj" :headTitle="$t('complianceCheck.complianceOpinionReportTable')">
          <template slot="headButton">
            <div class="export-btn">
              <Json-Excel :fetch="exportFile" :name="exportFileName">
                <auth-button type="primary" size="medium" icon="iconfont icondaochu" :label="$t('common.export')"></auth-button>
              </Json-Excel>
            </div>
          </template>
          <!-- 线上审核人员 -->
          <template v-slot:onlineAuditors="scope">
            <div v-for="(item, index) in scope.data.row.onlineAuditors" :key="index">
              <span>{{item}}</span>
            </div>
          </template>
          <!-- 线下审核人员 -->
          <template v-slot:offlineAuditors="scope">
            <div v-for="(item, index) in scope.data.row.offlineAuditors" :key="index">
              <span>{{item}}</span>
            </div>
          </template>
          <!-- 线上审核意见 -->
          <template v-slot:onlineAuditOpinions="scope">
            <div v-for="(item, index) in scope.data.row.onlineAuditOpinions" :key="index">
              <span>{{item}}</span>
            </div>
          </template>
          <!-- 线下审核意见 -->
          <template v-slot:offlineAuditOpinions="scope">
            <div v-for="(item, index) in scope.data.row.offlineAuditOpinions" :key="index">
              <span>{{item}}</span>
            </div>
          </template>
        </data-table>
      </template>
    </up-down-layout>
  </div>
</template>
<script>
import BasePage from '@/pages/basePage.js'
import { authButton, upDownLayout, searchForm, DataTable, btnExport, SelectProductName, SelectCoreEnterpriseCascade, SelectFinancialInstitutionsCascade } from 'newepoch-components'
import complianceApi from '@/api/dataAudit/complianceApi.js'
import * as format from '@/filters/index'
import cn from '@/i18n/langs/cn.js'
import JsonExcel from 'vue-json-excel'
import mixin from '@/pages/mixin.js'
import { regExp } from '@/validator/index'

const { complianceCheck, common } = cn
export default {
  name: 'complianceOpinionReportList',
  extends: new BasePage(),
  mixins: [mixin],
  components: {
    upDownLayout,
    searchForm,
    DataTable,
    authButton,
    btnExport,
    SelectProductName,
    SelectCoreEnterpriseCascade,
    SelectFinancialInstitutionsCascade,
    JsonExcel
  },
  data () {
    return {
      exportFileName: '',
      templateCode: '',
      queryParas: {
        ifsComplianceOpinions: '0'
      },
      sourceData: [],
      componentList: [
        // 产品名称
        {
          label: complianceCheck.project,
          value: 'projectId',
          disabled: false,
          componentName: SelectProductName,
          labelWidth: '160px'
        },
        // 核心企业
        {
          label: complianceCheck.coreEnterprise,
          value: 'coreEnterpriseId',
          queryName: 'projectId',
          queryValue: 'projectId',
          disabled: false,
          componentName: SelectCoreEnterpriseCascade,
          labelWidth: '160px'
        },
        // 计划管理人/再保理银行
        {
          label: complianceCheck.planningManagerName,
          value: 'planningManagerId',
          queryName: 'projectId',
          queryValue: 'projectId',
          disabled: false,
          componentName: SelectFinancialInstitutionsCascade,
          labelWidth: '160px'
        },
        // 期数
        {
          label: complianceCheck.periods,
          value: 'specialPlanPeriods',
          disabled: false,
          componentName: 'el-input',
          placeholder: common.pleaseInput,
          labelWidth: '160px'
        },
        // 月份筛选
        {
          label: complianceCheck.monthScreen,
          value: 'queryDate',
          disabled: false,
          componentName: 'el-date-picker',
          type: 'monthrange',
          format: 'timestamp',
          startPlaceholder: complianceCheck.startDateTip,
          endPlaceholder: complianceCheck.endDateTip,
          labelWidth: '160px'
        }
      ],
      columns: [
        // 付款确认书编号
        {
          prop: 'assetCode',
          align: 'left',
          label: complianceCheck.payCode,
          width: '200px',
          sortable: true
        },
        // 核心企业
        {
          prop: 'coreEnterpriseName',
          align: 'left',
          label: complianceCheck.coreEnterprise,
          width: '200px',
          sortable: true
        },
        // 计划管理人/再保理银行
        {
          prop: 'planningManagerName',
          align: 'left',
          label: complianceCheck.planningManagerName,
          width: '200px',
          sortable: true
        },
        // 期数
        {
          prop: 'specialPlanPeriods',
          align: 'right',
          label: complianceCheck.periods,
          width: '120px',
          sortable: true
        },
        // 供应商名称
        {
          prop: 'creditor',
          align: 'left',
          label: complianceCheck.supplierName,
          width: '240px'
        },
        // 项目公司名称
        {
          prop: 'debtor',
          align: 'left',
          label: complianceCheck.projectCompanyName,
          width: '240px'
        },
        // 供应商是否电子章
        {
          prop: 'creditorWay',
          align: 'center',
          label: complianceCheck.supplierElectronicStamp,
          format: (row) => { return row.creditorWay === '1' ? common.yes : common.no },
          width: '150px'
        },
        // 项目公司是否电子章
        {
          prop: 'debtorWay',
          align: 'center',
          label: complianceCheck.projCompanyEleStamp,
          format: (row) => { return row.debtorWay === '1' ? common.yes : common.no },
          width: '160px'
        },
        // 线上审核人员
        {
          prop: 'onlineAuditors',
          align: 'center',
          label: '线上审核人员',
          width: '150px',
          slot: true
        },
        // 线下审核人员
        {
          prop: 'offlineAuditors',
          align: 'center',
          label: '线下审核人员',
          width: '150px',
          slot: true
        },
        // 线上审核意见
        {
          prop: 'onlineAuditOpinions',
          align: 'center',
          label: '线上审核意见',
          width: '200px',
          slot: true
        },
        // 线下审核意见
        {
          prop: 'offlineAuditOpinions',
          align: 'center',
          label: '线下审核意见',
          width: '200px',
          slot: true
        },
        // 合规审查人
        {
          prop: 'auditorsName',
          align: 'center',
          label: complianceCheck.complianceCheckPerson,
          width: '150px'
        },
        // 合规抽查意见
        {
          prop: 'complianceOpinions',
          align: 'left',
          label: complianceCheck.complianceCheckOpinion,
          width: '200px'
        },
        // 反馈文件
        {
          prop: 'fileName',
          align: 'left',
          label: complianceCheck.feedbackFile,
          width: '200px'
        },
        // 是否停补寄
        {
          prop: 'ifsSupplement',
          align: 'center',
          label: complianceCheck.mail,
          format: (row) => { return format.formatDict(row.ifsSupplement, 'ZDZD0024') },
          width: '100px'
        }
      ]
    }
  },
  computed: {
    api () {
      return complianceApi.statisticApi
    }
  },
  mounted () {
    this.handleFilter()
  },
  methods: {
    // 重写查询
    handleFilter () {
      // 期数数字校验
      if (!this.UtilJs.isEmpty(this.queryParas.specialPlanPeriods) && !regExp.number.test(this.queryParas.specialPlanPeriods)) {
        return this.warning(complianceCheck.specialPlanPeriodsCheck)
      }
      // 月份筛选不能同月
      if (!this.UtilJs.isEmpty(this.queryParas.startDate) && !this.UtilJs.isEmpty(this.queryParas.endDate)) {
        if (this.queryParas.startDate === this.queryParas.endDate) {
          return this.warning(complianceCheck.queryDateCheck)
        }
      }
      this.$refs.dataTable.loadTableData()
    },
    // 重置
    clearParam () {
      this.queryParas = {
        projectId: '',
        coreEnterpriseId: '',
        planningManagerId: '',
        specialPlanPeriods: '',
        ifsComplianceOpinions: '0',
        queryDate: [],
        pageIndex: 1,
        pageSize: 10
      }
    },
    // 过滤null
    formatArr (arr) {
      let result = []
      result = arr.filter(it => { return it !== null })
      return result
    },
    // 导出
    async exportFile () {
      let _this = this
      let newList = []
      let newObj = {}
      await complianceApi.statisticApi.export(_this.queryParas).then(res => {
        if (res && res.data.data) {
          if (res.data.data.length === 0) {
            newObj = {
              '付款确认书编号': '',
              '核心企业': '',
              '计划管理人/再保理银行': '',
              '期数': '',
              '供应商名称': '',
              '项目公司名称': '',
              '供应商是否电子章': '',
              '项目公司是否电子章': '',
              '线上审核人员': '',
              '线下审核人员': '',
              '线上审核意见': '',
              '线下审核意见': '',
              '合规审查人': '',
              '合规抽查意见': '',
              '反馈文件': '',
              '是否停补寄': ''
            }
            newList.push(newObj)
          } else {
            res.data.data.forEach(it => {
              newObj = {
                '付款确认书编号': it.assetCode,
                '核心企业': it.coreEnterpriseName,
                '计划管理人/再保理银行': it.planningManagerName,
                '期数': it.specialPlanPeriods,
                '供应商名称': it.creditor,
                '项目公司名称': it.debtor,
                '供应商是否电子章': it.creditorWay,
                '项目公司是否电子章': it.debtorWay,
                '线上审核人员': _this.UtilJs.isNull(it.onlineAuditors) ? '' : it.onlineAuditors.length === 0 ? '' : this.formatArr(it.onlineAuditors).join(),
                '线下审核人员': _this.UtilJs.isNull(it.offlineAuditors) ? '' : it.offlineAuditors.length === 0 ? '' : this.formatArr(it.offlineAuditors).join(),
                '线上审核意见': _this.UtilJs.isNull(it.onlineAuditOpinions) ? '' : it.onlineAuditOpinions.length === 0 ? '' : this.formatArr(it.onlineAuditOpinions).join(),
                '线下审核意见': _this.UtilJs.isNull(it.offlineAuditOpinions) ? '' : it.offlineAuditOpinions.length === 0 ? '' : this.formatArr(it.offlineAuditOpinions).join(),
                '合规审查人': it.auditorsName,
                '合规抽查意见': it.complianceOpinions,
                '反馈文件': it.fileName,
                '是否停补寄': it.ifsSupplement
              }
              newList.push(newObj)
            })
          }
          this.exportFileName = '合规抽查意见信息导出表' + '-' + format.formatDatetime(new Date())
        } else {
          _this.error(common.exportFail)
          return []
        }
      })
      return newList
    }
  },
  watch: {
    'queryParas.projectId' (now, old) {
      if (now !== old) {
        this.$set(this.queryParas, 'coreEnterpriseId', '')
        this.$set(this.queryParas, 'planningManagerId', '')
      }
    },
    'queryParas.queryDate' (val) {
      if (val.length === 0) {
        this.$set(this.queryParas, 'startDate', '')
        this.$set(this.queryParas, 'endDate', '')
      } else {
        this.$set(this.queryParas, 'startDate', val[0])
        this.$set(this.queryParas, 'endDate', val[1])
      }
    }
  }
}
</script>
<style scoped lang="scss" src="@/styles/dataAudit/assetInfo/assetInfoEdit.scss">
</style>
