<template>
  <div class="app-container" v-loading="loading">
    <el-page-header @back="goBack" content="流程详情" />

    <el-card class="mt-20" v-if="!loading && detail">
      <el-tabs v-model="activeTab">
        <!-- 基本信息 -->
        <el-tab-pane label="基本信息" name="basic">
          <el-descriptions :column="2" border>
            <el-descriptions-item label="业务方流水号" :span="2">{{ detail.serialNum }}</el-descriptions-item>
            <el-descriptions-item label="机构编码">{{ detail.orgCode }}</el-descriptions-item>
            <el-descriptions-item label="运行模式">{{ detail.runType }}</el-descriptions-item>
            <el-descriptions-item label="客户内码">{{ detail.custIsn }}</el-descriptions-item>
            <el-descriptions-item label="客户名称">{{ detail.custName }}</el-descriptions-item>
            <el-descriptions-item label="证件类型" :span="2">{{ detail.idType }}</el-descriptions-item>
          </el-descriptions>
        </el-tab-pane>

        <!-- 业务信息 -->
        <el-tab-pane label="业务信息" name="business">
          <el-descriptions :column="2" border>
            <el-descriptions-item label="客户类型">{{ detail.custType }}</el-descriptions-item>
            <el-descriptions-item label="担保方式">{{ detail.guarType }}</el-descriptions-item>
            <el-descriptions-item label="申请金额">{{ detail.applyAmt }} 元</el-descriptions-item>
            <el-descriptions-item label="贷款利率">{{ detail.loanRate }} %</el-descriptions-item>
            <el-descriptions-item label="贷款用途">{{ detail.loanPurpose === 'consumer' ? '消费贷款' : detail.loanPurpose === 'business' ? '经营贷款' : detail.loanPurpose }}</el-descriptions-item>
            <el-descriptions-item label="是否有经营佐证">{{ detail.bizProof === 'true' ? '是' : '否' }}</el-descriptions-item>
            <el-descriptions-item label="抵质押类型">{{ detail.collType }}</el-descriptions-item>
            <el-descriptions-item label="抵质押物三方所有">{{ detail.collThirdParty === 'true' ? '是' : '否' }}</el-descriptions-item>
          </el-descriptions>
        </el-tab-pane>

        <!-- 中间业务标识 -->
        <el-tab-pane label="中间业务标识" name="mid">
          <el-descriptions :column="2" border>
            <el-descriptions-item label="个人快捷支付">{{ detail.midPerQuickPay === 'true' ? '是' : '否' }}</el-descriptions-item>
            <el-descriptions-item label="个人电费代扣">{{ detail.midPerEleDdc === 'true' ? '是' : '否' }}</el-descriptions-item>
            <el-descriptions-item label="企业电费代扣">{{ detail.midEntEleDdc === 'true' ? '是' : '否' }}</el-descriptions-item>
            <el-descriptions-item label="企业水费代扣">{{ detail.midEntWaterDdc === 'true' ? '是' : '否' }}</el-descriptions-item>
          </el-descriptions>
        </el-tab-pane>

        <!-- 企业标识 -->
        <el-tab-pane label="企业标识" name="ent">
          <el-descriptions :column="2" border>
            <el-descriptions-item label="净身企业">{{ detail.isCleanEnt === 'true' ? '是' : '否' }}</el-descriptions-item>
            <el-descriptions-item label="开立基本结算账户">{{ detail.hasSettleAcct === 'true' ? '是' : '否' }}</el-descriptions-item>
            <el-descriptions-item label="制造业企业">{{ detail.isManufacturing === 'true' ? '是' : '否' }}</el-descriptions-item>
            <el-descriptions-item label="省农担担保贷款">{{ detail.isAgriGuar === 'true' ? '是' : '否' }}</el-descriptions-item>
            <el-descriptions-item label="纳税信用等级A级">{{ detail.isTaxA === 'true' ? '是' : '否' }}</el-descriptions-item>
            <el-descriptions-item label="县级及以上农业龙头企业">{{ detail.isAgriLeading === 'true' ? '是' : '否' }}</el-descriptions-item>
            <el-descriptions-item label="普惠小微借款人">{{ detail.isInclusiveFinance === 'true' ? '是' : '否' }}</el-descriptions-item>
          </el-descriptions>
        </el-tab-pane>

        <!-- 其他信息 -->
        <el-tab-pane label="其他信息" name="other">
          <el-descriptions :column="2" border>
            <el-descriptions-item label="创建时间">{{ detail.createTime }}</el-descriptions-item>
            <el-descriptions-item label="创建者">{{ detail.createBy }}</el-descriptions-item>
            <el-descriptions-item label="更新时间">{{ detail.updateTime }}</el-descriptions-item>
            <el-descriptions-item label="更新者">{{ detail.updateBy }}</el-descriptions-item>
          </el-descriptions>
        </el-tab-pane>
      </el-tabs>
    </el-card>

    <el-row :gutter="10" class="mt-20">
      <el-col :span="24">
        <el-button @click="goBack">返回</el-button>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { getWorkflow } from "@/api/loanPricing/workflow"

export default {
  name: "LoanPricingWorkflowDetail",
  data() {
    return {
      loading: true,
      detail: null,
      activeTab: 'basic'
    }
  },
  created() {
    this.getDetail()
  },
  methods: {
    /** 获取流程详情 */
    getDetail() {
      const serialNum = this.$route.params.serialNum
      if (!serialNum) {
        this.$modal.msgError("缺少业务方流水号参数")
        this.goBack()
        return
      }

      getWorkflow(serialNum).then(response => {
        this.detail = response.data
        this.loading = false
      }).catch(error => {
        this.$modal.msgError("获取流程详情失败：" + (error.message || "未知错误"))
        this.loading = false
      })
    },
    /** 返回上一页 */
    goBack() {
      this.$router.go(-1)
    }
  }
}
</script>
