|
|
<template> |
|
|
<view class=""> |
|
|
<cu-custom class="main-totextbar bg-main-oil" :isBack="true" bgColor="bg-main-oil"> |
|
|
<block slot="backText">返回</block> |
|
|
<block slot="content">发票信息</block> |
|
|
</cu-custom> |
|
|
<view class="padding-top-sm"> |
|
|
<view |
|
|
class="shadow-warp radius move-top bg-gray margin margin-top-0 margin-bottom-sm bg-white text-bold text-xl padding-lg "> |
|
|
<view class="Invoicing-header"> |
|
|
<view class="Invoicing-header-text text-lg">开票信息</view> |
|
|
</view> |
|
|
<view class="Invoicing-box " :class="[showBoxsing ? 'showBox':'hidenBox']"> |
|
|
<view class="Invoicing-box-list solid-top padding-top-sm padding-bottom-sm"> |
|
|
<view class="Invoicing-box-list-title text-df"> |
|
|
发票抬头: |
|
|
</view> |
|
|
<view class="Invoicing-box-list-text text-sm "> |
|
|
{{InvoiceDetails.invoicName}} |
|
|
</view> |
|
|
</view> |
|
|
<view class="Invoicing-box-list solid-top padding-top-sm padding-bottom-sm"> |
|
|
<view class="Invoicing-box-list-title text-df"> |
|
|
税号: |
|
|
</view> |
|
|
<view class="Invoicing-box-list-text text-sm "> |
|
|
{{InvoiceDetails.invoicTaxIdentiNumber}} |
|
|
</view> |
|
|
</view> |
|
|
<view class="Invoicing-box-list solid-top padding-top-sm padding-bottom-sm"> |
|
|
<view class="Invoicing-box-list-title text-df"> |
|
|
电子邮箱: |
|
|
</view> |
|
|
<view class="Invoicing-box-list-text text-df"> |
|
|
{{InvoiceDetails.invoicEmail}} |
|
|
</view> |
|
|
</view> |
|
|
<view class="Invoicing-box-list solid-top padding-top-sm padding-bottom-sm"> |
|
|
<view class="Invoicing-box-list-title text-df"> |
|
|
发票备注: |
|
|
</view> |
|
|
<view class="Invoicing-box-list-text text-df"> |
|
|
{{InvoiceDetails.remark}} |
|
|
</view> |
|
|
</view> |
|
|
<view class="Invoicing-box-list solid-top padding-top-sm padding-bottom-sm"> |
|
|
<view class="Invoicing-box-list-title text-df"> |
|
|
开票金额: |
|
|
</view> |
|
|
<view class="Invoicing-box-list-text text-df"> |
|
|
{{InvoiceDetails.invoicAmount}} |
|
|
</view> |
|
|
</view> |
|
|
<view class="Invoicing-box-list solid-top padding-top-sm padding-bottom-sm"> |
|
|
<view class="Invoicing-box-list-title text-df"> |
|
|
发票类型: |
|
|
</view> |
|
|
<view class="Invoicing-box-list-text text-df"> |
|
|
普通电子发票 |
|
|
</view> |
|
|
</view> |
|
|
<view class="Invoicing-box-list solid-top padding-top-sm padding-bottom-sm"> |
|
|
<view class="Invoicing-box-list-title text-df"> |
|
|
抬头类型: |
|
|
</view> |
|
|
<view class="Invoicing-box-list-text text-df"> |
|
|
公司 |
|
|
</view> |
|
|
</view> |
|
|
<view class="Invoicing-box-list solid-top padding-top-sm padding-bottom-sm"> |
|
|
<view class="Invoicing-box-list-title text-df"> |
|
|
公司地址: |
|
|
</view> |
|
|
<view class="Invoicing-box-list-text text-df"> |
|
|
{{InvoiceDetails.invoicAddress}} |
|
|
</view> |
|
|
</view> |
|
|
<view class="Invoicing-box-list solid-top padding-top-sm padding-bottom-sm"> |
|
|
<view class="Invoicing-box-list-title text-df"> |
|
|
电话号码: |
|
|
</view> |
|
|
<view class="Invoicing-box-list-text text-df"> |
|
|
{{InvoiceDetails.invoicTel}} |
|
|
</view> |
|
|
</view> |
|
|
<view class="Invoicing-box-list solid-top padding-top-sm padding-bottom-sm"> |
|
|
<view class="Invoicing-box-list-title text-df"> |
|
|
开户银行: |
|
|
</view> |
|
|
<view class="Invoicing-box-list-text text-df"> |
|
|
{{InvoiceDetails.invoicOpenBank}} |
|
|
</view> |
|
|
</view> |
|
|
<view class="Invoicing-box-list solid-top padding-top-sm padding-bottom-sm"> |
|
|
<view class="Invoicing-box-list-title text-df"> |
|
|
银行账号: |
|
|
</view> |
|
|
<view class="Invoicing-box-list-text text-df"> |
|
|
{{InvoiceDetails.invoicBankNumber}} |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
<view class=" text-center text-lg padding-top-sm" @tap="showBoxsings" v-text="showText"> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
<view class=""> |
|
|
<view |
|
|
class="shadow-warp radius bg-gray margin margin-top-20 margin-bottom-sm bg-white text-bold text-xl padding-lg"> |
|
|
<view class="Invoicing-header-text text-lg "> |
|
|
订单编号 |
|
|
</view> |
|
|
<view class="text-df padding-left-sm " @tap="onCopy(InvoiceDetails.orderSerialNumber)"> |
|
|
{{InvoiceDetails.orderSerialNumber}} <text class="cuIcon-copy padding-left-xs text-sm "></text> |
|
|
</view> |
|
|
<view class="Invoicing-header-text text-lg margin-top-lg "> |
|
|
开票进度 |
|
|
</view> |
|
|
<view class="text-df padding-sm" style="width: 100%;"> |
|
|
<u-time-line> |
|
|
<u-time-line-item :class="{'showIcons':item.check === true}" v-for="(item,index) in numList" |
|
|
:key='index'> |
|
|
<template v-slot:content> |
|
|
<view class="time_lineDispay"> |
|
|
<view class="u-order-desc margin-right-lg">{{item.name}}</view> |
|
|
<view class="u-order-time ">{{item.time}}</view> |
|
|
</view> |
|
|
<view class="time_lineDispay margin-top-xs" v-if="item.errcheck == 1" |
|
|
v-show='index == 3'> |
|
|
<view class="u-order-desc text-xs margin-right-lg text-red light">24小时内未收到发票请与客服联系 |
|
|
</view> |
|
|
</view> |
|
|
<view class="time_lineDispay margin-top-xs" v-if="item.errcheck == -1" |
|
|
v-show='index == 1'> |
|
|
<view class="u-order-desc text-xs margin-right-lg "> <text |
|
|
class="text-red text-xs ">原因:</text> {{item.errtext}}</view> |
|
|
<view class="u-order-time text-blue text-xs" @tap="gotochanges">前往修改开票信息</view> |
|
|
</view> |
|
|
</template> |
|
|
</u-time-line-item> |
|
|
</u-time-line> |
|
|
<!-- <u-steps direction="column" :list="numList" :current="1" active-color="#FF0000"></u-steps> --> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</template> |
|
|
|
|
|
<script> |
|
|
import financelApi from '@/api/oil-finance.js' |
|
|
export default { |
|
|
data() { |
|
|
return { |
|
|
showText: '查看更多', |
|
|
showBoxsing: false, |
|
|
orderId: '', |
|
|
numList: [{ |
|
|
name: '待申请', |
|
|
time: '', |
|
|
check: false, |
|
|
}, { |
|
|
name: '待审核', |
|
|
time: '', |
|
|
check: false, |
|
|
errcheck: false |
|
|
}, { |
|
|
name: '待开票', |
|
|
time: '', |
|
|
check: false, |
|
|
}, { |
|
|
name: '待发件', |
|
|
time: '', |
|
|
check: false, |
|
|
errcheck: 0, |
|
|
errtext: '' |
|
|
}], |
|
|
InvoiceDetails: { |
|
|
id: '', //主键id |
|
|
orderSerialNumber: '', // 订单编号 |
|
|
invoicAmount: '', //开票金额 |
|
|
userName: '', //司机名 |
|
|
phone: '', //司机电话号码 |
|
|
invoicTel: '', //公司电话号码 |
|
|
siteName: '', //油站名 |
|
|
siteCode: '', //油站编码 |
|
|
auditMark: '', //审核状态 |
|
|
openInvoicMark: '', //开票状态 |
|
|
invoicEnclosure: '', //电子发票附件 |
|
|
remark: '', //开票备注 |
|
|
customerId: '', //司机id |
|
|
auditRemark: '', //审核备注 |
|
|
invoicName: '', //发票抬头 |
|
|
invoicTaxIdentiNumber: '', //税号 |
|
|
openInvoicTime: '', //开票时间 |
|
|
invoicEmail: '', //接收邮件 |
|
|
invoicBankNumber: '', //银行账号 |
|
|
invoicOpenBank: '', //开户银行 |
|
|
invoicAddress: '', //公司地址 |
|
|
auditRecordTime: '', //开票申请时间 |
|
|
auditTime: '' //审核时间 |
|
|
} |
|
|
} |
|
|
}, |
|
|
onLoad(option) { |
|
|
console.log(option) |
|
|
this.orderId = option.orderId |
|
|
this.getOrderInvoice() |
|
|
}, |
|
|
methods: { |
|
|
gotochanges() { |
|
|
console.log(this.InvoiceDetails.invoicAmount) |
|
|
uni.navigateTo({ |
|
|
url: "../orderInvoicing/orderInvoicing?orderId=" + this.orderId + '&&code=' + 2 + |
|
|
'&&realAmount=' + this.InvoiceDetails.invoicAmount |
|
|
}) |
|
|
}, |
|
|
showBoxsings() { |
|
|
if (this.showBoxsing) { |
|
|
this.showBoxsing = false |
|
|
this.showText = '查看更多' |
|
|
} else { |
|
|
this.showText = '收回' |
|
|
this.showBoxsing = true |
|
|
|
|
|
} |
|
|
}, |
|
|
onCopy(id) { |
|
|
uni.setClipboardData({ |
|
|
data: id, |
|
|
success: () => { |
|
|
uni.showToast({ |
|
|
icon: 'none', |
|
|
title: '订单号复制成功' |
|
|
}) |
|
|
} |
|
|
}) |
|
|
}, |
|
|
getOrderInvoice() { //获取发票详情 |
|
|
console.log('这里是传来的 orderId') |
|
|
console.log(this.orderId) |
|
|
financelApi.getRecordByOrderId(this.orderId).then((res) => { |
|
|
console.log('这里的发票详情') |
|
|
console.log(res) |
|
|
let _that = this |
|
|
if (res.data.auditMark == 1) { |
|
|
console.log('审核通过') |
|
|
this.timeLineStates(2) |
|
|
_that.numList[0].name = '已申请' |
|
|
_that.numList[1].name = '已审核' |
|
|
_that.numList[0].time = res.data.auditRecordTime |
|
|
_that.numList[1].time = res.data.auditTime |
|
|
} else if (res.data.auditMark == -1) { |
|
|
console.log('审核未通过') |
|
|
_that.numList[0].name = '已申请' |
|
|
_that.numList[1].name = '审核未通过' |
|
|
_that.numList[0].time = res.data.auditRecordTime |
|
|
console.log() |
|
|
this.timeLineStates(2, res.data) |
|
|
} else if (res.data.auditMark == 0) { |
|
|
_that.numList[0].time = res.data.auditRecordTime |
|
|
console.log('待审核') |
|
|
_that.numList[0].name = '已申请' |
|
|
_that.numList[1].name = '待审核' |
|
|
this.timeLineStates(2) |
|
|
} |
|
|
if (res.data.auditMark == 1 && res.data.openInvoicMark === 'INVOICED') { |
|
|
_that.numList[0].name = '已申请' |
|
|
_that.numList[2].name = '开票成功' |
|
|
_that.numList[1].name = '已审核' |
|
|
console.log(res) |
|
|
_that.numList[0].time = res.data.auditRecordTime |
|
|
_that.numList[1].time = res.data.auditTime |
|
|
_that.numList[2].time = res.data.openInvoicTime |
|
|
this.timeLineStates(3) |
|
|
} else if (res.data.auditMark == 1 && res.data.openInvoicMark === 'TO_INVOICED') { |
|
|
_that.numList[0].name = '已申请' |
|
|
_that.numList[2].name = '待开票' |
|
|
_that.numList[1].name = '已审核' |
|
|
_that.numList[0].time = res.data.auditRecordTime |
|
|
_that.numList[1].time = res.data.auditTime |
|
|
console.log('待开票') |
|
|
this.timeLineStates(3) |
|
|
} else if (res.data.auditMark == 1 && res.data.openInvoicMark === "INVOICING") { |
|
|
_that.numList[0].name = '已申请' |
|
|
_that.numList[2].name = '正在开票中' |
|
|
_that.numList[1].name = '已审核' |
|
|
_that.numList[0].time = res.data.auditRecordTime |
|
|
_that.numList[1].time = res.data.auditTime |
|
|
console.log('开票中') |
|
|
this.timeLineStates(3) |
|
|
} else if (res.data.auditMark == 1 && res.data.openInvoicMark === "INVOICE_FAIL") { |
|
|
_that.numList[0].name = '已申请' |
|
|
_that.numList[2].name = '开票失败' |
|
|
_that.numList[1].name = '已审核' |
|
|
_that.numList[0].time = res.data.auditRecordTime |
|
|
_that.numList[1].time = res.data.auditTime |
|
|
console.log('开票中') |
|
|
this.timeLineStates(3, res.data) |
|
|
} |
|
|
// else if(res.data.auditMark == 1 && res.data.openInvoicMark === 'INVOICED'){ |
|
|
// _that.numList[0].name = '已申请' |
|
|
// _that.numList[2].name = '正在开票' |
|
|
// _that.numList[1].name = '已审核' |
|
|
// _that.numList[2].time =res.data.openInvoicTime |
|
|
// _that.numList[0].time = res.data.createTime |
|
|
// _that.numList[1].time = res.data.auditTime |
|
|
// console.log('待开票') |
|
|
// this.timeLineStates(3) |
|
|
// } |
|
|
if (res.data.auditMark == 1 && res.data.openInvoicMark === 'INVOICED' && res.data |
|
|
.sendEmailMark == 1) { |
|
|
console.log('邮件发件成功') |
|
|
_that.numList[0].name = '已申请' |
|
|
_that.numList[1].name = '已审核' |
|
|
_that.numList[2].name = '已开票' |
|
|
_that.numList[3].name = '已发邮箱' |
|
|
_that.numList[0].time = res.data.auditRecordTime |
|
|
_that.numList[1].time = res.data.auditTime |
|
|
_that.numList[2].time = res.data.openInvoicTime |
|
|
_that.numList[3].time = res.data.sendEmailTime |
|
|
this.timeLineStates(4, res.data) |
|
|
} else if (res.data.auditMark == 1 && res.data.openInvoicMark === 'INVOICED' && res.data |
|
|
.sendEmailMark == -1) { |
|
|
_that.numList[0].name = '已申请' |
|
|
_that.numList[1].name = '已审核' |
|
|
_that.numList[2].name = '已开票' |
|
|
_that.numList[3].name = '邮件发送失败' |
|
|
_that.numList[0].time = res.data.auditRecordTime |
|
|
_that.numList[1].time = res.data.auditTime |
|
|
_that.numList[2].time = res.data.openInvoicTime |
|
|
console.log('邮件发件失败') |
|
|
this.timeLineStates(4, res.data) |
|
|
} else if (res.data.auditMark == 1 && res.data.openInvoicMark === 'INVOICED' && res.data |
|
|
.sendEmailMark == 0) { |
|
|
_that.numList[0].name = '已申请' |
|
|
_that.numList[1].name = '已审核' |
|
|
_that.numList[2].name = '已开票' |
|
|
_that.numList[3].name = '邮件正在发送' |
|
|
_that.numList[0].time = res.data.auditRecordTime |
|
|
_that.numList[1].time = res.data.auditTime |
|
|
_that.numList[2].time = res.data.openInvoicTime |
|
|
console.log('邮件发送中') |
|
|
this.timeLineStates(4, res.data) |
|
|
} else if (res.data.auditMark == 1 && res.data.openInvoicMark === 'INVOICED' && res.data |
|
|
.sendEmailMark == null) { |
|
|
_that.numList[0].name = '已申请' |
|
|
_that.numList[1].name = '已审核' |
|
|
_that.numList[2].name = '已开票' |
|
|
_that.numList[3].name = '代发件' |
|
|
_that.numList[0].time = res.data.auditRecordTime |
|
|
_that.numList[1].time = res.data.auditTime |
|
|
_that.numList[2].time = res.data.openInvoicTime |
|
|
console.log('邮件发送中') |
|
|
this.timeLineStates(4, res.data) |
|
|
} |
|
|
this.InvoiceDetails = res.data |
|
|
}) |
|
|
}, |
|
|
// 获取当前步骤条状态 |
|
|
timeLineStates(num, obj) { |
|
|
console.log('这里是obj') |
|
|
console.log(obj) |
|
|
console.log(num) |
|
|
let listTime = this.numList |
|
|
for (let i = 0; i < listTime.length; i++) { |
|
|
if (i < num) { |
|
|
listTime[i].check = true |
|
|
console.log('123') |
|
|
if (obj) { |
|
|
if (obj.sendEmailMark == 1 && obj.auditMark == 1) { |
|
|
console.log('这里是邮件1') |
|
|
listTime[num - 1].errcheck = obj.sendEmailMark |
|
|
} else if (obj.sendEmailMark != -1 && obj.auditMark == -1) { |
|
|
console.log('这里是审核2') |
|
|
listTime[num - 1].name = '审核失败' |
|
|
listTime[num - 1].errcheck = obj.auditMark |
|
|
listTime[num - 1].errtext = obj.auditRemark |
|
|
console.log('这里进入obj') |
|
|
} else if (obj.openInvoicMark == 'INVOICE_FAIL' && obj.auditMark == 1) { |
|
|
console.log('这里是开票2') |
|
|
let checkErr = 0 |
|
|
if (obj.openInvoicMark == 'INVOICE_FAIL') { |
|
|
checkErr = -1 |
|
|
} |
|
|
listTime[num - 1].name = '开票失败' |
|
|
listTime[num - 1].errcheck = checkErr |
|
|
listTime[num - 1].errtext = obj.openInvoicRemark |
|
|
console.log('这里进入obj') |
|
|
} |
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
</script> |
|
|
|
|
|
<style> |
|
|
.showBox { |
|
|
height: auto; |
|
|
overflow: hidden; |
|
|
} |
|
|
|
|
|
.hidenBox { |
|
|
height: 300upx; |
|
|
overflow: hidden; |
|
|
} |
|
|
|
|
|
.time_lineDispay { |
|
|
display: flex; |
|
|
justify-content: space-between; |
|
|
align-items: center; |
|
|
width: 100%; |
|
|
} |
|
|
|
|
|
.showIcons /deep/ .u-dot { |
|
|
background: #FF0000 !important; |
|
|
} |
|
|
|
|
|
page { |
|
|
background-color: #F1F2F7; |
|
|
} |
|
|
|
|
|
.weight-2 { |
|
|
font-weight: 600; |
|
|
} |
|
|
|
|
|
.weight-4 { |
|
|
font-weight: 400; |
|
|
} |
|
|
|
|
|
.weight-0 { |
|
|
font-weight: 100; |
|
|
} |
|
|
|
|
|
.clomes-box { |
|
|
display: flex; |
|
|
justify-content: flex-start; |
|
|
align-items: flex-start; |
|
|
flex-direction: column; |
|
|
} |
|
|
|
|
|
.Invoicing-header-text { |
|
|
border-left: 4px solid #FF0000; |
|
|
padding-left: 10upx; |
|
|
margin-bottom: 20upx; |
|
|
} |
|
|
|
|
|
.Invoicing-box { |
|
|
display: flex; |
|
|
justify-content: flex-start; |
|
|
align-items: flex-start; |
|
|
flex-direction: column; |
|
|
width: 100%; |
|
|
box-shadow: inset 0 -5px 5px #f1f1f17a; |
|
|
} |
|
|
|
|
|
.Invoicing-box-list-title { |
|
|
flex: 0 0 auto; |
|
|
width: 30%; |
|
|
} |
|
|
|
|
|
.Invoicing-box-list-text {} |
|
|
|
|
|
.Invoicing-box-list { |
|
|
display: flex; |
|
|
justify-content: flex-start; |
|
|
align-items: center; |
|
|
width: 100%; |
|
|
} |
|
|
</style>
|
|
|
|
