|
|
@@ -1,12 +1,90 @@
|
|
|
<template>
|
|
|
-<el-row>
|
|
|
- <el-tabs type="border-card">
|
|
|
- <!-- 资产信息-->
|
|
|
- <el-tab-pane label="资产信息">
|
|
|
- <!-- <div class="app-container"> -->
|
|
|
- <el-form ref="form" :model="form" :rules="rules" :inline="true" style="margin-top: 20px" label-width="auto">
|
|
|
- <el-divider content-position="left">融信详情</el-divider>
|
|
|
- <table class="gridtable" style="width:80%;text-align:center" align="center" v-show="financeStatus != null && financeStatus != '00' && financeStatus != '03'">
|
|
|
+<div class="app-container zap-main zap-credit-detail">
|
|
|
+ <div v-if="this.financeStatus == null || this.financeStatus == '00' || this.financeStatus == '03'" class="zap-No">
|
|
|
+ <el-row type="flex" align="middle" :gutter="10">
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-row type="flex" align="middle">
|
|
|
+ <img class="icon" src="../../../assets/images/icon_contract_no.png" alt="">
|
|
|
+ <span class="label">融信编号</span>
|
|
|
+ <span class="value">{{form.zfiNumber}}</span>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-row type="flex" align="middle">
|
|
|
+ <img class="icon" src="../../../assets/images/icon_calendar.png" alt="">
|
|
|
+ <span class="label">创建时间</span>
|
|
|
+ <el-date-picker disabled v-model="form.createTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-row type="flex" align="middle">
|
|
|
+ <img class="icon" src="../../../assets/images/icon_person.png" alt="">
|
|
|
+ <span class="label">创建人</span>
|
|
|
+ <span class="value">{{form.createName}}</span>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-row type="flex" align="middle" justify="end">
|
|
|
+ <el-button type="success">成功按钮</el-button>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <el-row class="zap-credit-detial__form zap-margin-top">
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form label-width="95px">
|
|
|
+ <template v-if="this.financeStatus == null || this.financeStatus == '00' || this.financeStatus == '03'">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="10">
|
|
|
+ <el-form-item size="large" label="开立方" prop="openName">
|
|
|
+ <el-input v-model="form.openName" readonly />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="10">
|
|
|
+ <el-form-item size="large" label="接收方" prop="receiveName">
|
|
|
+ <el-input v-model="form.receiveName" readonly />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="10">
|
|
|
+ <el-form-item size="large" label="授信额度" prop="zfpName">
|
|
|
+ <el-input v-model="form.zfpName" readonly />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="10">
|
|
|
+ <el-form-item size="large" label="签发有效期" prop="zfiEffectiveDate">
|
|
|
+ <el-date-picker disabled v-model="form.zfiEffectiveDate" type="date" value-format="yyyy-MM-dd">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="10">
|
|
|
+ <el-form-item size="large" label="承诺还款日" prop="zfiExpireDate">
|
|
|
+ <el-date-picker disabled v-model="form.zfiExpireDate" type="date" value-format="yyyy-MM-dd">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </template>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="10">
|
|
|
+ <el-form-item size="large" label="签发金额">
|
|
|
+ <el-input v-model="form.zfiAmount" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4">
|
|
|
+ <span class="issued-words__label">金额大写</span>
|
|
|
+ <span class="issued-words__value">{{issuedAmount}}</span>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <div class="zap-margin-top" style="margin-bottom: 28px;">
|
|
|
+ <table class="gridtable" style="width:100%;text-align:center" align="center" v-show="financeStatus != null && financeStatus != '00' && financeStatus != '03'">
|
|
|
<tr>
|
|
|
<td rowspan="4">开立方</td>
|
|
|
<td>全称</td>
|
|
|
@@ -42,111 +120,44 @@
|
|
|
<td colspan="4">{{stopDate}}</td>
|
|
|
</tr>
|
|
|
</table>
|
|
|
- <el-row v-show="this.financeStatus == null || this.financeStatus == '00' || this.financeStatus == '03'">
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item label="融信编号" prop="zfiNumber">
|
|
|
- <el-input v-model="form.zfiNumber" style="width: 200px" readonly />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item label="创建时间" prop="createTime">
|
|
|
- <el-date-picker disabled size="small" style="width: 200px" v-model="form.createTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss">
|
|
|
- </el-date-picker>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item label="创建人" prop="createName">
|
|
|
- <el-input v-model="form.createName" style="width: 200px" readonly />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <el-row v-show="this.financeStatus == null || this.financeStatus == '00' || this.financeStatus == '03'">
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item label="开立方" prop="openName">
|
|
|
- <el-input v-model="form.openName" style="width: 200px" readonly />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item label="接收方" prop="receiveName">
|
|
|
- <el-input v-model="form.receiveName" style="width: 200px" readonly />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item label="授信额度" prop="zfpName">
|
|
|
- <el-input v-model="form.zfpName" style="width: 200px" readonly />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <el-row v-show="this.financeStatus == null || this.financeStatus == '00' || this.financeStatus == '03'">
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item label="签发有效期" prop="zfiEffectiveDate">
|
|
|
- <el-date-picker disabled size="small" style="width: 200px" v-model="form.zfiEffectiveDate" type="date" value-format="yyyy-MM-dd">
|
|
|
- </el-date-picker>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item label="承诺还款日" prop="zfiExpireDate">
|
|
|
- <el-date-picker disabled size="small" style="width: 200px" v-model="form.zfiExpireDate" type="date" value-format="yyyy-MM-dd">
|
|
|
- </el-date-picker>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <!-- <el-col :span="8">
|
|
|
- <el-form-item label="收款账号" prop="zfiCollectionAccount" v-if="isShow">
|
|
|
- <el-input v-model="form.zfiCollectionAccount" style="width: 200px"/>
|
|
|
- </el-form-item>
|
|
|
- </el-col> -->
|
|
|
- </el-row>
|
|
|
- <el-divider content-position="left">{{tableTitle}}</el-divider>
|
|
|
- <el-form-item style="margin-left: 100px">
|
|
|
- <el-form-item label="合计金额:">
|
|
|
- <span>{{checkTotalAmt}}</span>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="金额大写:">
|
|
|
- <span>{{checkTotalBigAmt}}</span>
|
|
|
- </el-form-item>
|
|
|
-
|
|
|
- <el-table :data="payList" style="width: 1100px">
|
|
|
- <el-table-column label="账款名称" align="center" prop="zbiName" show-overflow-tooltip />
|
|
|
- <el-table-column label="应收企业" align="center" prop="receiveName" />
|
|
|
- <el-table-column label="应付企业" align="center" prop="payName" />
|
|
|
- <el-table-column label="预计还款期" align="center" prop="zbiPayDate" show-overflow-tooltip />
|
|
|
- <el-table-column label="金额" align="center" prop="zbiAmount" />
|
|
|
- <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="250">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-button size="mini" type="text" icon="el-icon-view" @click="handleDetail(scope.$index, payList)">详情</el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </el-form-item>
|
|
|
- <el-row>
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item label="签发金额" prop="zfiAmount">
|
|
|
- <el-input v-model="form.zfiAmount" style="width: 200px" />
|
|
|
- </el-form-item>
|
|
|
+ </div>
|
|
|
+ <!-- 应收账款 -->
|
|
|
+ <div class="zap-credit-detail__receivable">
|
|
|
+ <el-row type="flex" justify="space-between" align="middle">
|
|
|
+ <el-col>
|
|
|
+ <el-row type="flex" align="middle">
|
|
|
+ <div class="title"><span class="snow-tag">*</span>应收账款</div>
|
|
|
+ <el-button type="primary">选择</el-button>
|
|
|
+ </el-row>
|
|
|
</el-col>
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item label="金额大写" prop="issuedAmount">
|
|
|
- {{issuedAmount}}
|
|
|
- </el-form-item>
|
|
|
+ <el-col>
|
|
|
+ <el-row class="zap-credit-detail__receivable-total" type="flex" justify="end" align="middle">
|
|
|
+ <span class="label">合计金额：</span>
|
|
|
+ <span class="value">{{checkTotalAmt}}</span>
|
|
|
+ <span class="label" style="margin-left: 48px;">金额大写：</span>
|
|
|
+ <span class="value">{{checkTotalBigAmt}}</span>
|
|
|
+ </el-row>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
- </el-form>
|
|
|
- <div style="margin-top: 100px; margin-left:45%">
|
|
|
- <el-button type="info" @click="cancel">取消</el-button>
|
|
|
- <!-- <el-button type="success" @click="submitForm"
|
|
|
- >提交</el-button> -->
|
|
|
</div>
|
|
|
- <!-- 附件详情 -->
|
|
|
- <el-dialog title="详情" :visible.sync="openDetailBill" width="1120px" append-to-body>
|
|
|
- <detail-bill :zbiId="this.zbiId" v-if="openDetailBill"></detail-bill>
|
|
|
- </el-dialog>
|
|
|
- <!--预览-->
|
|
|
- <el-dialog :visible.sync="openFile" width="1000px" append-to-body>
|
|
|
- <img :src="wordUrl" v-if="show" width='450px' height='500px' />
|
|
|
- <iframe :src="wordUrl" width='800px' height='600px' frameborder='1' v-if="heid" />
|
|
|
- </el-dialog>
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane label="签署合同">
|
|
|
+ <el-table class="zap-margin-top" :data="payList" style="width: 100%;">
|
|
|
+ <el-table-column label="账款名称" align="center" prop="zbiName" show-overflow-tooltip />
|
|
|
+ <el-table-column label="应收企业" align="center" prop="receiveName" />
|
|
|
+ <el-table-column label="应付企业" align="center" prop="payName" />
|
|
|
+ <el-table-column label="预计还款期" align="center" prop="zbiPayDate" show-overflow-tooltip />
|
|
|
+ <el-table-column label="金额" align="center" prop="zbiAmount" />
|
|
|
+ <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="250">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button size="mini" type="text" icon="el-icon-view" @click="handleDetail(scope.$index, payList)">详情</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <!-- 签署合同 -->
|
|
|
+ <el-row class="zap-margin-top">
|
|
|
+ <div class="zap-title">附件信息</div>
|
|
|
+ <div class="zap-enclosure">
|
|
|
<el-table :data="creditSealList" style="width: 100%">
|
|
|
<el-table-column label="文件名称" align="center" prop="pfiFileName" show-overflow-tooltip>
|
|
|
<template slot-scope="scope">
|
|
|
@@ -162,8 +173,11 @@
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane label="最终还款明细" v-if="this.companyType == '01'">
|
|
|
+ </div>
|
|
|
+ </el-row>
|
|
|
+ <template v-if="this.companyType == '01'">
|
|
|
+ <!-- 最终还款明细 -->
|
|
|
+ <el-row class="zap-margin-top">
|
|
|
<el-form :inline="true" ref="forms" :model="forms" label-width="auto" style="margin-top: 20px" disabled>
|
|
|
<el-row>
|
|
|
<el-col :span="8">
|
|
|
@@ -217,19 +231,27 @@
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-table v-loading="loading" :data="list" border>
|
|
|
- <!-- <el-table-column label="序号" type="index" width="50" align="center">
|
|
|
- <template slot-scope="scope">
|
|
|
- <span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span>
|
|
|
- </template>
|
|
|
- </el-table-column> -->
|
|
|
<el-table-column label="收款账户" align="center" prop="zfrCollectionAccount" :show-overflow-tooltip="true" />
|
|
|
<el-table-column label="收款账户户名" align="center" prop="supplier" :show-overflow-tooltip="true" />
|
|
|
<el-table-column label="收款金额" align="center" prop="zfrLoanAmount" :show-overflow-tooltip="true" />
|
|
|
</el-table>
|
|
|
</el-form>
|
|
|
- </el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
-</el-row>
|
|
|
+ </el-row>
|
|
|
+ </template>
|
|
|
+ <el-row type="flex" justify="center" align="middle" style="height: 67px">
|
|
|
+ <el-button type="primary" plain @click="cancel">取消</el-button>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <!-- 附件详情 -->
|
|
|
+ <el-dialog title="详情" :visible.sync="openDetailBill" width="1120px" append-to-body>
|
|
|
+ <detail-bill :zbiId="this.zbiId" v-if="openDetailBill"></detail-bill>
|
|
|
+ </el-dialog>
|
|
|
+ <!--预览-->
|
|
|
+ <el-dialog :visible.sync="openFile" width="1000px" append-to-body>
|
|
|
+ <img :src="wordUrl" v-if="show" width='450px' height='500px' />
|
|
|
+ <iframe :src="wordUrl" width='800px' height='600px' frameborder='1' v-if="heid" />
|
|
|
+ </el-dialog>
|
|
|
+</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
@@ -633,4 +655,102 @@ table.gridtable td {
|
|
|
padding: 8px;
|
|
|
border-style: solid;
|
|
|
}
|
|
|
+</style><style lang="scss" scoped>
|
|
|
+.zap-credit-detail {}
|
|
|
+
|
|
|
+.zap-credit-detial__form {
|
|
|
+ padding: 24px 12px 20px;
|
|
|
+ background-color: #ffffff;
|
|
|
+}
|
|
|
+
|
|
|
+.zap-credet-detail__electronic--title {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #333333;
|
|
|
+}
|
|
|
+
|
|
|
+.zap-credit-detial__title {
|
|
|
+ padding: 20px 12px 28px;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #333333;
|
|
|
+}
|
|
|
+
|
|
|
+.zap-credit-detail__receivable {
|
|
|
+ .title {
|
|
|
+ margin-right: 20px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.zap-credit-detail__receivable-total {
|
|
|
+ .label {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+
|
|
|
+ .vlaue {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.snow-tag {
|
|
|
+ margin-right: 14px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #f41d27;
|
|
|
+}
|
|
|
+
|
|
|
+.issued-words__label,
|
|
|
+.issued-words__value {
|
|
|
+ display: inline-block;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ font-size: 12px;
|
|
|
+ color: #333333;
|
|
|
+}
|
|
|
+
|
|
|
+.issued-words__label {
|
|
|
+ margin-left: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.zap-enclosure {
|
|
|
+ padding: 0 12px 18px;
|
|
|
+ background-color: #ffffff;
|
|
|
+}
|
|
|
+
|
|
|
+.zap-title {
|
|
|
+ height: 60px;
|
|
|
+ line-height: 60px;
|
|
|
+ padding: 0 25px;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #333333;
|
|
|
+ background-color: #ffffff;
|
|
|
+}
|
|
|
+
|
|
|
+.el-date-editor.el-input,
|
|
|
+.el-date-editor.el-input__inner {
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.zap-No {
|
|
|
+ padding: 14px 25px;
|
|
|
+ background-color: #ffffff;
|
|
|
+
|
|
|
+ .icon {
|
|
|
+ width: 18px;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label {
|
|
|
+ white-space: nowrap;
|
|
|
+ margin-right: 8px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+
|
|
|
+ .value {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
guolufei123
