<!--
  @description: 服务费退款申请查看
  @Modifier: sunxinman/haofengxian
  @routerPath: /fee/serviceRefundApplyDetail
  @date: 2020/04/07-16:25
-->
<template>
  <div>
    <section class="title p0-16 clearfix">
      <!-- 返回 -->
      <div class="title-back pointer" @click="back()">
        <i class="iconfont icon-fanhui mr10" />服务费退款申请查看
      </div>
    </section>
    <div class="p0-16">
      <table class="tableData">
        <tr>
          <td>表单编号</td>
          <td>{{ formData.djbh }}</td>
          <td>表单名称</td>
          <td>{{ formData.outApplyName }}</td>
        </tr>
        <tr>
          <td>收款单位</td>
          <td>{{ formData.supplierName }}</td>
          <td>开户银行</td>
          <td>{{ formData.bankName }}</td>
        </tr>
        <tr>
          <td>银行账号</td>
          <td>{{ formData.supplierAccount }}</td>
          <td>联行号</td>
          <td>{{ formData.bankNo }}</td>
        </tr>
        <tr>
          <td>
            是否同城转账
          </td>
          <td>
            <span
              v-for="(item,index) in cityTransferList"
              v-if="formData.sameCity === item.typecode"
              :key="index"
            >{{ item.typename }}</span>
          </td>
          <td>是否跨行转账</td>
          <td>
            <span
              v-for="(item,index) in interbankTransferList"
              v-if="formData.sameBank === item.typecode"
              :key="index"
            >{{ item.typename }}</span>
          </td>
        </tr>
        <tr>
          <td>金额（元）</td>
          <td>
            {{ formData.returnAmount }}
          </td>
          <td>用款方式</td>
          <td>电汇</td>
        </tr>
        <tr>
          <td>用款部门</td>
          <td colspan="3">
            {{ formData.tenderDepart }}
          </td>
        </tr>
        <tr>
          <td>用途</td>
          <td colspan="3">
            {{ formData.purpose }}
          </td>
        </tr>
        <tr>
          <td>摘要</td>
          <td colspan="3">
            {{ formData.summary }}
          </td>
        </tr>
        <tr>
          <td>备注</td>
          <td colspan="3">
            {{ formData.remark }}
          </td>
        </tr>
      </table>
    </div>
    <!--操作按钮-->
    <div class="but_footer">
      <div class="but_footer-h" />
      <div class="but_footer-but">
        <el-button @click="back">
          关闭
        </el-button>
      </div>
    </div>
  </div>
</template>

<script>
import { detailTenderFeeWinServiceOut } from '@/api/fee/servicefee'
/* 混入公共方法 */
import { ServiceGroupMixin } from '../../mixins/serviceFeeGroupMixin'
export default {
  name: 'ServiceRefundApplyDetail',
  mixins: [ServiceGroupMixin],
  data() {
    return {
      formData: {
        auditStatus: '', // 审批状态
        bankName: '', // 开户银行
        bankNo: '', // 联行号
        djbh: '', // 单据编号
        outApplyName: '', // 表单名称
        outId: '', // 服务费退款信息ID
        purpose: '', // 用途
        remark: '', // 备注
        returnAmount: 0, // 退款金额（元）
        returnMethod: '', // 用款方式
        sameBank: '', // 是否跨行
        sameCity: '', // 是否同城
        sendTime: '', // 审批发送时间
        summary: '', // 摘要
        supplierAccount: '', // 收款单位银行账号
        supplierId: '', // 收款单位id
        supplierName: '', // 收款单位名称
        tenderDepart: '', // 业务部门
        tenderDepartId: '', // 业务部门ID
        useStatus: '', // 使用状态
        winServiceId: this.$route.query.winServiceId // 中标服务费ID
      }
    }
  },
  created() {
    this.getTenderFeeWinServiceOutDetail()
  },
  methods: {
    // 查看中标服务费退款信息
    getTenderFeeWinServiceOutDetail() {
      const outId = this.$route.query.outId // 服务费退款信息ID
      detailTenderFeeWinServiceOut(outId).then(res => {
        this.formData = res.data
      }).catch(() => {
      })
    },
    // 返回
    back() {
      this.$router.push({
        path: '/fee/serviceInvoiceRecords'
      })
    }
  }
}
</script>

<style lang="less" scoped>

</style>
