<template>
|
<div>
|
<!-- {{listQuery}} -->
|
<list-condition-template ref="table" :form="listQuery" :formLabel="formLabel"
|
:tableData="tableData" :total="total"
|
@page-info-change="handlePageInfoChange" :showFormItem="showFormItem"
|
:dataKey="'key'">
|
<template slot="otherElement">
|
<el-col :span="24" :offset="0" style="text-align:center;">
|
<el-form-item>
|
<el-button size="mini" type="primary" @click="queryData">查询</el-button>
|
<el-button size="mini" @click="resetQuery">重置</el-button>
|
<el-button type="text" @click.stop="toggleForm" style="font-size:14px;">
|
{{showFormItem ? '收起' : '展开'}} <i
|
:class="showFormItem?'el-icon-arrow-up':'el-icon-arrow-down'"></i>
|
</el-button>
|
</el-form-item>
|
</el-col>
|
</template>
|
<template slot="operationSection">
|
<!-- 手动开票 -->
|
<el-button size="mini" type="success" @click="shoudongkaipiao">手动开票</el-button>
|
</template>
|
<template slot="columns">
|
<el-table-column type="expand">
|
<template slot-scope="props">
|
<el-table border class="expand" :data="props.row.orderInfo.omsOrderItems">
|
<el-table-column type="index" align="center" label="序号" width="80px">
|
</el-table-column>
|
<el-table-column label="商品图片" align="center">
|
<template slot-scope="scope">
|
<product-img :imgUrl="scope.row.imgUrl"></product-img>
|
</template>
|
</el-table-column>
|
<el-table-column label="商品名称" prop="spuName" show-overflow-tooltip>
|
<template slot-scope="scope">
|
<span class="giftStyle"
|
v-if="scope.row.promotionType === '2'">赠</span><span>{{scope.row.spuName}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="商品规格" prop="spuUnit">
|
<template slot-scope="scope">
|
{{scope.row.skuProps && JSON.parse(scope.row.skuProps).length ? JSON.parse(scope.row.skuProps).map(item=>item.propValueName).join('/') : '-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="数量" prop="state">
|
<template slot-scope="scope">
|
{{scope.row.buyQuantity}} * {{JSON.parse(scope.row.expInfo).skuReduceStorage}}
|
({{scope.row.spuUnit ? scope.row.spuUnit : '瓶'}})
|
</template>
|
</el-table-column>
|
<el-table-column label="销售金额（元）">
|
<template slot-scope="scope">
|
<span v-if="scope.row.promotionType !== '2'">
|
{{scope.row.totelAmt ? '￥'+scope.row.totelAmt.toFixed(2) : ''}}
|
</span>
|
<span v-else>-</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="实收金额（元）" width="460px">
|
<template slot-scope="scope">
|
<span v-if="scope.row.promotionType !== '2'">
|
{{scope.row.totelAmtAct ? '￥'+scope.row.totelAmtAct.toFixed(2) : ''}}
|
</span>
|
<span v-else>-</span>
|
<el-button size="mini" @click="discountDetails(scope.row)"
|
v-if="scope.row.promotionType !== '2'">优惠明细</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</template>
|
</el-table-column>
|
<el-table-column label="原始订单编号" :key="Math.random()" width="180px" show-overflow-tooltip>
|
<template slot-scope="scope">
|
{{(scope.row.orderInfo.expInfo && JSON.parse(scope.row.orderInfo.expInfo).sourceOrderCode) ? JSON.parse(scope.row.orderInfo.expInfo).sourceOrderCode : '-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="订单号" :key="Math.random()" width="180px" show-overflow-tooltip
|
prop="orderId">
|
<template slot-scope="scope">
|
<el-link class="urlLink" @click="lookOrderInfo(scope.row)">{{ scope.row.orderId }}</el-link>
|
</template>
|
</el-table-column>
|
<el-table-column label="下单时间" :key="Math.random()" prop="orderInfo.orderTime" width="180"
|
show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="发票代码-发票号" :key="Math.random()" v-if="invoiceStatus === '1'"
|
width="130px" show-overflow-tooltip prop="fpqqlsh"></el-table-column>
|
<el-table-column label="开票人" width="150px" :key="Math.random()"
|
prop="orderInfo.creatorName">
|
</el-table-column>
|
<el-table-column label="开票金额" :key="Math.random()" width="130px" prop="invoiceAmount"
|
show-overflow-tooltip>
|
<template slot-scope="scope">
|
{{scope.row.invoiceAmount ? '￥' +scope.row.invoiceAmount.toFixed(2) : ''}}
|
</template>
|
</el-table-column>
|
<el-table-column label="开票来源" :key="Math.random()" width="130px"
|
prop="orderInfo.orderSource">
|
<template slot-scope="scope">
|
{{getLabel(orderSourceArr, scope.row.orderInfo.orderSource)}}
|
</template>
|
</el-table-column>
|
<!-- 开票类型 申请开票和手动开票-->
|
<el-table-column label="开票类型" :key="Math.random()" width="130px" prop="invoiceSource"
|
show-overflow-tooltip>
|
<template slot-scope="scope">
|
<span>{{getinvoiceSource(scope.row)}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="开票日期" width="180px" :key="Math.random()"
|
v-if="invoiceStatus !== '0'" prop="invoiceTime" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="ESB推送状态" key='7' prop="pushStatus" width="140"
|
show-overflow-tooltip>
|
<template slot-scope="scope">
|
<span class="statusTag"
|
:style="{ background: getPushStatus(scope.row).color == 'success' ? '#52c41a' :'#f5222d'}"></span>
|
<span>{{getPushStatus(scope.row).name}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="开票状态" width="120px" :key="Math.random()" prop="status"
|
show-overflow-tooltip>
|
<template slot-scope="scope">
|
<span v-if="getStatus(scope.row).color == 'info'">
|
<span class="statusTag" :style="{ background: '#d0931e'}"></span>
|
<span>{{getStatus(scope.row).name}}</span>
|
</span>
|
<span v-else-if="getStatus(scope.row).color == 'success'">
|
<span class="statusTag" :style="{ background: '#10b434'}"></span>
|
<span>{{getStatus(scope.row).name}}</span>
|
</span>
|
<span v-else-if="getStatus(scope.row).color == 'warning'">
|
<span class="statusTag" :style="{ background: '#f5222d'}"></span>
|
<span>{{getStatus(scope.row).name}}</span>
|
</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="备注" :key="Math.random()" prop="invoiceFailMsg" show-overflow-tooltip
|
width="200px">
|
<template slot-scope="scope">
|
<span v-if="scope.row.status === '2'">失败原因：{{scope.row.invoiceFailMsg}}</span>
|
<span v-else>-</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="抬头类型" :key="Math.random()" prop="invoiceType" width="100px">
|
<template slot-scope="scope">
|
<!-- <span>{{getInvoiceType(scope.row)}}</span> -->
|
{{scope.row.invoiceType === '0' ? "个人" : scope.row.invoiceType === '1' ? "企业" : ' '}}
|
</template>
|
</el-table-column>
|
<el-table-column label="操作" :key="Math.random()" fixed="right" align="center" width="200px">
|
<template slot-scope="scope">
|
<wly-btn @click="lookInfo(scope.row)">查看</wly-btn>
|
<wly-btn type="primary" @click="itemAudit(scope.row)"
|
v-if="scope.row.pushStatus === '0' && scope.row.auditStatus === '0'">审核
|
</wly-btn>
|
<!-- 添加手动推送 -->
|
<!-- <el-button size="mini" type="warning" @click="getmanualPush(scope.row)" v-if="scope.row.pushStatus === '0' && scope.row.pushStatus === '2'">手动推送</el-button> -->
|
<wly-btn type="warning" @click="getmanualPush(scope.row)"
|
v-if="scope.row.pushStatus !== '1'">手动推送</wly-btn>
|
<wly-btn type="success" @click="lookAccountStatement(scope.row)">对账单
|
</wly-btn>
|
</template>
|
</el-table-column>
|
</template>
|
</list-condition-template>
|
<account-statement ref="accountStatement" :show.sync="accountStatementIsShow">
|
</account-statement>
|
</div>
|
</template>
|
<script>
|
import orderSourceArr from '@/utils/constant/orderSourceArr'
|
import BillingResources from '@/api/invoice/invoiceapi.js'
|
import productImg from '@/views/product/components/productImg.vue'
|
import accountStatement from './components/accountStatement.vue'
|
import { getDate } from '@/utils/getDate'
|
|
var _this = null
|
export default {
|
components: { productImg, accountStatement },
|
data() {
|
return {
|
orderSourceArr,
|
listQuery: {
|
orderStatuss: null, // 订单状态
|
isInvoice: null, // 是否需要开具发票 (1=需要，0=不需要)
|
auditStatus: null, // 审计状态 （0待审核 1已审核）
|
orderId: null, // 订单编号
|
fpqqlsh: null, // esb发票编号 1
|
pushStatus: null, // 1
|
invoiceCode: null, // 发票代码
|
invoiceStartTime: null, // 开票开始时间 1
|
invoiceEndTime: null, // 开票结束时间 1
|
status: null, // 开票状态 1
|
spuName: null,
|
orderSourceArr: null,
|
orderSource: null, // 订单来源
|
invoiceType: null, // 发票类型 1
|
invoiceAmount: null,
|
invoiceSource: null,
|
invoiceTime: null, // 开票时间
|
sourceOrderCode: null, // 原始订单号
|
startOrderTime: null, // 订单开始时间
|
endOrderTime: null// 订单截止时间
|
},
|
formLabel: [
|
{
|
model: 'orderId',
|
label: '订单号',
|
type: 'input',
|
rule: /[^\w]/g // 可输入数字字母
|
},
|
{
|
model: 'sourceOrderCode',
|
label: '原始订单号',
|
labelWidth: '100px',
|
type: 'input',
|
rule: /[^\w]/g // 可输入数字字母
|
},
|
{
|
model: 'invoiceStartTime',
|
label: '开票日期',
|
type: 'date',
|
pickerOptions: {
|
disabledDate(time) {
|
return _this.listQuery.invoiceEndTime && time.getTime() >= new Date(_this.listQuery.invoiceEndTime).getTime() + 86400000
|
}
|
},
|
timeClass: 'start-time-style'
|
},
|
{
|
model: 'invoiceEndTime',
|
label: '-',
|
customLabel: '开票日期',
|
type: 'date',
|
valueFormat: 'yyyy-MM-dd 23:59:59',
|
labelWidth: '20px',
|
pickerOptions: {
|
disabledDate(time) {
|
return _this.listQuery.invoiceStartTime && time.getTime() <= new Date(_this.listQuery.invoiceStartTime).getTime() - 86400000
|
}
|
},
|
timeClass: 'end-time-style'
|
},
|
|
{
|
model: 'startOrderTime',
|
label: '下单时间',
|
type: 'date',
|
pickerOptions: {
|
disabledDate(time) {
|
return _this.listQuery.endOrderTime && time.getTime() >= new Date(_this.listQuery.endOrderTime).getTime() + 86400000
|
}
|
},
|
timeClass: 'start-time-style'
|
},
|
{
|
model: 'endOrderTime',
|
label: '-',
|
customLabel: '下单时间',
|
type: 'date',
|
valueFormat: 'yyyy-MM-dd 23:59:59',
|
labelWidth: '20px',
|
pickerOptions: {
|
disabledDate(time) {
|
return _this.listQuery.startOrderTime && time.getTime() <= new Date(_this.listQuery.startOrderTime).getTime() - 86400000
|
}
|
},
|
timeClass: 'end-time-style'
|
},
|
{
|
model: 'status',
|
label: '开票状态',
|
type: 'select',
|
opts: [
|
{
|
id: '0',
|
name: '未开票'
|
},
|
{
|
id: '1',
|
name: '已开票'
|
},
|
{
|
id: '2',
|
name: '开票失败'
|
}
|
]
|
},
|
{
|
model: 'orderSource',
|
label: '开票来源',
|
type: 'select',
|
multiple: false,
|
opts: orderSourceArr
|
},
|
{
|
model: 'fpqqlsh',
|
label: '发票号',
|
type: 'input',
|
showItem: false
|
},
|
{
|
model: 'pushStatus',
|
label: 'ESB推送状态',
|
type: 'select',
|
labelWidth: '100px',
|
showItem: false,
|
opts: [
|
{
|
id: '1',
|
name: '推送成功'
|
},
|
{
|
id: '0',
|
name: '推送失败'
|
}
|
]
|
},
|
{
|
model: 'invoiceType',
|
label: '抬头类型',
|
type: 'select',
|
showItem: false,
|
opts: [
|
{
|
id: '0',
|
name: '个人'
|
},
|
{
|
id: '1',
|
name: '企业'
|
}
|
]
|
}
|
],
|
tableData: [],
|
total: 0,
|
form: {},
|
accountStatementIsShow: false, // 对账单弹出框是否展示
|
invoiceStatus: null, // 查询成功后存入发票状态
|
showFormItem: false
|
}
|
},
|
/**
|
* 数据变化后刷新列表
|
*/
|
activated() {
|
this.queryList(this.$refs.table.getPageInfo())
|
},
|
created() {
|
_this = this
|
},
|
methods: {
|
toggleForm() {
|
this.showFormItem = !this.showFormItem
|
},
|
/**
|
* 查看对账单
|
*/
|
lookAccountStatement(row) {
|
this.$refs.accountStatement.accountStatementInfo(row.orderId)
|
this.accountStatementIsShow = true
|
},
|
shoudongkaipiao() {
|
this.$router.push({ name: 'manualInvoice' })
|
},
|
getPushStatus(row) {
|
switch (row.pushStatus) {
|
case '1': return {
|
name: '推送成功',
|
color: 'success'
|
}
|
default: return {
|
name: '推送失败',
|
color: 'warning'
|
}
|
}
|
},
|
// getInvoiceType (row) {
|
// if (row.invoiceType === '0') {
|
// return '个人'
|
// } else {
|
// return '企业'
|
// }
|
// },
|
getinvoiceSource(row) {
|
if (row.invoiceSource === '0') {
|
return '用户申请'
|
} else {
|
return '手动开票'
|
}
|
},
|
getStatus(row) {
|
switch (row.status) {
|
case '0': return {
|
name: '未开票',
|
color: 'info'
|
}
|
case '1': return {
|
name: '已开票',
|
color: 'success'
|
}
|
case '2': return {
|
name: '开票失败',
|
color: 'warning'
|
}
|
default: break
|
}
|
},
|
/**
|
* 获取数组的label
|
*/
|
getLabel(array, id) {
|
var lableText = array.find((item) => {
|
return item.id === id
|
})
|
if (lableText) {
|
return lableText.name
|
}
|
return ''
|
},
|
/**
|
* '分页信息改变时查询列表
|
*/
|
handlePageInfoChange(pageInfo) {
|
this.queryList(pageInfo)
|
},
|
|
/**
|
* 重置
|
*/
|
resetQuery() {
|
this.$refs.table.reloadCurrent()
|
},
|
/**
|
* 点击查询按钮
|
*
|
},
|
*/
|
queryData() {
|
this.$refs.table.changeCondition()
|
},
|
/**
|
* 点击查看
|
*/
|
lookInfo(row) {
|
this.$router.push({
|
name: 'invoiceInfo',
|
query: { orderId: row.orderId }
|
})
|
},
|
/**
|
* 查看订单详情
|
*/
|
lookOrderInfo(row) {
|
this.$router.push({
|
name: 'orderMgtInfo',
|
query: {
|
orderId: row.orderId,
|
// promotionStatus: row.promotionStatus
|
}
|
})
|
},
|
/**
|
* 点击审核
|
*/
|
itemAudit(row) {
|
this.$router.push({
|
name: 'invoiceAudit',
|
query: { orderId: row.orderId }
|
})
|
},
|
/**
|
* 手动推送
|
*/
|
getmanualPush(row, index) {
|
this.$confirm('是否手动推送？', '手动推送', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
})
|
.then(() => {
|
BillingResources.manualPush(row.orderId).then((res) => {
|
if (res.code === '0') {
|
this.$message.success('操作成功')
|
this.$refs.table.changeCondition()
|
}
|
})
|
})
|
},
|
/**
|
*优惠明细
|
*/
|
discountDetails(row) {
|
this.$router.push({
|
name: 'invoiceInfo',
|
query: { orderId: row.orderId, name: 'productdetails' }
|
})
|
},
|
/**
|
* 查询列表
|
*/
|
queryList(pageInfo = { pageNum: 1, pageSize: 10 }) {
|
let queryIsNull = true
|
for (const i in this.listQuery) {
|
if (this.listQuery[i]) {
|
queryIsNull = false
|
break
|
}
|
}
|
const params = JSON.parse(JSON.stringify(this.listQuery))
|
// 当查询条件为空时设置开票状态和推送状态的值
|
if (queryIsNull) {
|
const initTime = getDate(-30)
|
params.status = '1'
|
params.pushStatus = '1'
|
params.invoiceStartTime = initTime[0] + ' 00:00:00'
|
params.invoiceEndTime = initTime[1] + ' 23:59:59'
|
}
|
BillingResources.getList({
|
...params,
|
...pageInfo
|
}).then((res) => {
|
if (res.data) {
|
this.tableData = res.data.list
|
this.setKey(res.data.list, pageInfo);
|
this.total = res.data.total
|
this.invoiceStatus = this.listQuery.status
|
this.$nextTick(() => {
|
this.$refs.table.$refs.table.doLayout()
|
})
|
}
|
})
|
},
|
/**
|
* 设置表格行唯一key
|
*/
|
setKey(data, pageInfo) {
|
if (data && data.length) {
|
data.forEach((item, index) => {
|
let curIndex = index + 1;
|
item.key = (pageInfo.pageNum - 1) * pageInfo.pageSize + curIndex;
|
})
|
}
|
}
|
}
|
}
|
</script>
|
<style lang="scss">
|
.el-table__body img {
|
width: 50px;
|
}
|
.refundInfo {
|
.el-dialog__body {
|
padding: 15px 20px;
|
height: 700px;
|
max-height: 800px;
|
position: relative;
|
overflow: hidden;
|
.refund {
|
position: absolute;
|
left: 0;
|
top: 0;
|
right: -17px;
|
bottom: 0;
|
overflow-y: scroll;
|
padding: 5px 10px;
|
}
|
}
|
}
|
</style>
|
