loan-pricing/ruoyi-ui/src/views/loanPricing/workflow/detail.vue

<template>
  <div class="app-container workflow-detail-container" v-loading="loading">
    <!-- 页面头部：标题和返回按钮 -->
    <div class="page-header">
      <h2 class="page-title">流程详情</h2>
      <el-button icon="el-icon-back" size="small" @click="goBack">返回</el-button>
    </div>

    <!-- 根据客户类型渲染对应的详情组件 -->
    <personal-workflow-detail
      v-if="!loading && workflowDetail && workflowDetail.custType === '个人'"
      :detail-data="workflowDetail"
      :retail-output="retailOutput"
      :bargaining-pool="bargainingPool"
      @refresh="getDetail"
    />

    <corporate-workflow-detail
      v-if="!loading && workflowDetail && workflowDetail.custType === '企业'"
      :detail-data="workflowDetail"
      :corp-output="corpOutput"
      :bargaining-pool="bargainingPool"
      @refresh="getDetail"
    />
  </div>
</template>

<script>
import {getWorkflow} from "@/api/loanPricing/workflow"
import PersonalWorkflowDetail from "./components/PersonalWorkflowDetail.vue"
import CorporateWorkflowDetail from "./components/CorporateWorkflowDetail.vue"

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

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

<style lang="scss" scoped>
.workflow-detail-container {
  .page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding: 0 4px;

    .page-title {
      margin: 0;
      font-size: 20px;
      font-weight: 500;
      color: #303133;
    }
  }
}
</style>