
55 changed files with 2897 additions and 1484 deletions
@ -0,0 +1,249 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<div> |
|||
<div class="tab-header webtop"> |
|||
<div>款票详情</div> |
|||
<div> |
|||
<el-button type="info" size="small" @click="handleReturn()">关闭</el-button> |
|||
</div> |
|||
</div> |
|||
<div class=""> |
|||
<el-form ref="dataForm" :model="formobj" class="formaddcopy02" :rules="rules"> |
|||
<el-row style="border-top: 1px solid #E0E3EB"> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">车架号</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinNo }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">销售类型</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.paymentMethod }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">合同编号</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.contractNo }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">客户名称</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.customerName }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="span-sty">车型</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.modelName }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<!--Start 预订车辆信息--> |
|||
<div class="title"> |
|||
<div>款项情况(平台收款)</div> |
|||
</div> |
|||
<el-table :key="tableKey" v-loading="listLoading" ref="multipleTable" :data="formobj.finSelectVoList" border style="width: 100%" :index="index"> |
|||
<el-table-column fixed align="center" label="序号" type="index" :index="index + 1" width="60"/> |
|||
<el-table-column label="款项名称" align="center" width="150"> |
|||
<template slot-scope="scope"> |
|||
<span>{{ scope.row.receivablesName }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column label="应收金额" align="center" width="150"> |
|||
<template slot-scope="scope"> |
|||
<span>{{ scope.row.reveivableMoney }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column label="已收款" align="center" width="150"> |
|||
<template slot-scope="scope"> |
|||
<span>{{ scope.row.subscriptionMoneyAll }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column label="未收款" align="center" width="150"> |
|||
<template slot-scope="scope"> |
|||
<span>{{ scope.row.notSubscriptionMoney }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column label="备注" align="center"> |
|||
<template slot-scope="scope"> |
|||
<span>{{ scope.row.remark }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<div class="title">发票情况</div> |
|||
<el-row> |
|||
<el-col :span="16"> |
|||
<div class="span-sty">开票名称</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.invoicingName }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div class="span-sty">税号</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.invoiceNo }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="16"> |
|||
<div class="span-sty">地址</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.address }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div class="span-sty">联系电话</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.telPhone }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="16"> |
|||
<div class="span-sty">开户行</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.openingBank }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div class="span-sty">银行账号</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.bankNum }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="16"> |
|||
<div class="span-sty">开票单位</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.invoiceTitle }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div class="span-sty">开票类型</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.invoiceType }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="8"> |
|||
<div class="span-sty">开票状态</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.billingState }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div class="span-sty">开票金额</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.invoiceAmount }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div class="span-sty">开票日期</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.invoiceDate }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="8"> |
|||
<div class="span-sty">移交状态</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.transferState }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div class="span-sty">接收人</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.recipient }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<div class="span-sty">移交日期</div> |
|||
<el-form-item><span class="addinputInfo">{{ formobj.vinInvoiceVo.transferTime }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { deliveredFinSelect } from '@/api/chukuguanli/chukubanli' |
|||
|
|||
export default { |
|||
name: 'PaymentTicket', |
|||
data() { |
|||
return { |
|||
tableKey: 0, |
|||
index: 0, |
|||
// --按钮菜单------- |
|||
listLoading: false, |
|||
formobj: { |
|||
vinNo: '', |
|||
paymentMethod: '', |
|||
contractNo: '', |
|||
customerName: '', |
|||
modelName: '', |
|||
finSelectVoList: [], |
|||
vinInvoiceVo: { |
|||
invoicingName: '', |
|||
invoiceNo: '', |
|||
invoiceTitle: '', |
|||
invoiceType: '', |
|||
billingState: '', |
|||
invoiceAmount: '', |
|||
invoiceDate: '', |
|||
transferState: '', |
|||
address: '', |
|||
telPhone: '', |
|||
openingBank: '', |
|||
bankNum: '', |
|||
recipient: '', |
|||
transferTime: '' |
|||
} |
|||
}, |
|||
rules: {} |
|||
} |
|||
}, |
|||
methods: { |
|||
// ------------ 页面初始化 ------------ |
|||
showInfo(contractId, row) { |
|||
this.$nextTick(() => { |
|||
this.$refs['dataForm'].clearValidate() |
|||
}) |
|||
deliveredFinSelect({ contractNo: contractId, vinSid: row.vinSid }).then((response) => { |
|||
if (response.success) { |
|||
console.log(response.data) |
|||
this.formobj = response.data |
|||
} |
|||
}) |
|||
}, |
|||
// ------------ 功能实现 ------------ |
|||
// 返回 |
|||
handleReturn() { |
|||
this.$refs['dataForm'].resetFields() |
|||
this.formobj = { |
|||
vinNo: '', |
|||
paymentMethod: '', |
|||
contractNo: '', |
|||
customerName: '', |
|||
modelName: '', |
|||
finSelectVoList: [], |
|||
vinInvoiceVo: { |
|||
invoicingName: '', |
|||
invoiceNo: '', |
|||
invoiceTitle: '', |
|||
invoiceType: '', |
|||
billingState: '', |
|||
invoiceAmount: '', |
|||
invoiceDate: '', |
|||
transferState: '', |
|||
address: '', |
|||
telPhone: '', |
|||
openingBank: '', |
|||
bankNum: '', |
|||
recipient: '', |
|||
transferTime: '' |
|||
} |
|||
} |
|||
this.$emit('doback') |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style scoped> |
|||
.titwu { |
|||
font-size: 28px; |
|||
text-align: center; |
|||
padding: 30px 0 20px 0; |
|||
} |
|||
.span-sty { |
|||
width: 120px !important; |
|||
} |
|||
.addinputInfo { |
|||
margin-left: 110px !important; |
|||
} |
|||
/*表格列设置fixed后固定列出现下边框的设置*/ |
|||
/deep/ .el-table__fixed { |
|||
height: 100% !important; |
|||
} |
|||
/*表格列设置fixed后固定列出现下边框的设置*/ |
|||
/deep/ .el-table__fixed-right { |
|||
height: 100% !important; |
|||
} |
|||
</style> |
Loading…
Reference in new issue