<template>
|
<div>
|
<list-condition-template ref="table" :form="listQuery" v-loading="loading"
|
element-loading-custom-class="customLoading"
|
@handle-form-Value="handleFormValue" :formLabel="formLabel"
|
:tableData="tableData" :total="total"
|
@page-info-change="handlePageInfoChange" :dataKey="'key'">
|
<template slot="otherElement">
|
<el-col :span="6" :offset="0">
|
<el-form-item>
|
<el-button size="mini" type="primary" @click="queryData">查询</el-button>
|
<el-button size="mini" @click="resetQuery">重置</el-button>
|
</el-form-item>
|
</el-col>
|
</template>
|
<template slot="operationSection">
|
<el-button size="mini" icon="el-icon-download" type="primary" @click="exportData">导出
|
</el-button>
|
</template>
|
<template slot="columns">
|
<el-table-column type="expand">
|
<template slot-scope="props">
|
<el-table border v-if="props.row.invoiceStatus&&props.row.invoiceStatus==='1'"
|
:data="[props.row]">
|
<el-table-column label="开票日期" prop="invoiceDate"></el-table-column>
|
<!-- <el-table-column label="发票代码" prop="invoiceCode"></el-table-column> -->
|
<el-table-column label="发票代码-发票号" prop="invoiceNo"></el-table-column>
|
<el-table-column label="开票金额">
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.invoiceAmount) ? '¥ ' + scope.row.invoiceAmount.toFixed(2) : '-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="开票类型">
|
<template slot-scope="scope">
|
{{ scope.row.invoiceType === '1' ? '蓝票' : '-' }}
|
</template>
|
</el-table-column>
|
<el-table-column label="发票类型" prop="invoiceTypeEle">
|
</el-table-column>
|
<el-table-column label="发票商品编码" prop="invoiceSpuNum" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="发票商品名称" prop="invoiceSpuName" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="发票价格">
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.invoicePrice)? '¥ ' + scope.row.invoicePrice.toFixed(2): '-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="发票数量" prop="invoiceCount"></el-table-column>
|
<el-table-column label="发票行折扣">
|
<template slot="header">
|
发票行折扣
|
<el-popover placement="top" width="200" trigger="click" content="注:金额+税额">
|
<i class="el-icon-question" style="cursor:pointer;" slot="reference"></i>
|
</el-popover>
|
</template>
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.invoiceDiscount)? '¥ ' + scope.row.invoiceDiscount.toFixed(2): '-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="发票金额">
|
<template slot="header">
|
发票金额
|
<el-popover placement="top" width="200" trigger="click" content="注:单价*数量+折扣">
|
<i class="el-icon-question" style="cursor:pointer;" slot="reference"></i>
|
</el-popover>
|
</template>
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.invoiceOrderAmount) ? '¥ ' + scope.row.invoiceOrderAmount.toFixed(2) : '-' }}
|
</template>
|
</el-table-column>
|
<el-table-column label="收入与开票差额">
|
<template slot="header">
|
收入与开票差额
|
<el-popover placement="top" width="200" trigger="click" content="注:实际收入-发票金额">
|
<i class="el-icon-question" style="cursor:pointer;" slot="reference"></i>
|
</el-popover>
|
</template>
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.inComeSubInAmt)? '¥ ' + scope.row.inComeSubInAmt.toFixed(2): '-'}}
|
</template>
|
</el-table-column>
|
</el-table>
|
<p class="saleDetailedP" v-else>
|
暂无开票信息
|
</p>
|
</template>
|
</el-table-column>
|
<el-table-column label="平台号" prop="platformNo" show-overflow-tooltip></el-table-column>
|
<el-table-column label="订单来源" width="150px" prop="orderSourceName" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="门店名称" prop="shopName" width="160px" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="订单日期" prop="orderDate" width="160px" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="订单编号" prop="orderId" width="160px" show-overflow-tooltip>
|
<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="订单状态" prop="orderStatus">
|
<template slot-scope="scope">
|
{{scope.row.orderStatus ? scope.row.orderStatusName:'-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="订单金额" width="120px" prop="orderPrice" show-overflow-tooltip>
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.orderPrice) ? '¥ ' + scope.row.orderPrice.toFixed(2) : '-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="订单折扣" width="120px" prop="messageNo" show-overflow-tooltip>
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.orderDiscount)? '¥ ' + scope.row.orderDiscount.toFixed(2) : '-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="订单应收金额" width="120px" prop="messageNo" show-overflow-tooltip>
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.orderPayPrice) ? '¥ ' + scope.row.orderPayPrice.toFixed(2) : '-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="订单商品主编码" width="150px" prop="spuNum" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="订单商品名称" width="160px" prop="spuName" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="订单单价" width="120px" prop="title" show-overflow-tooltip>
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.listPrice) ? '¥ ' + scope.row.listPrice.toFixed(2) : '-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="订单数量" width="120px" prop="buyQuantity" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="赠品" prop="isGiftProd">
|
</el-table-column>
|
<el-table-column label="订单行折扣" width="120px">
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.spuDiscount)? '¥ ' + scope.row.spuDiscount.toFixed(2) : '-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="订单应计金额" width="120px">
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.spuTotelAmtAct)? '¥ ' + scope.row.spuTotelAmtAct.toFixed(2) : '-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="交易日期" width="160px" prop="payTime" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="原始订单编号" width="160px" prop="tradeNo" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="开票状态" width="120px" prop="invoiceMainStatus" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="到账日期" width="160px" prop="accountDate" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="到账折扣" width="120px">
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.accountDiscount) ? '¥ ' + scope.row.accountDiscount.toFixed(2) : '-' }}
|
</template>
|
</el-table-column>
|
<el-table-column label="实际收入" width="140px">
|
<template slot="header">
|
实际收入
|
<el-popover placement="top" width="260" trigger="click">
|
<div class="tips-content">
|
<p>注:</p>
|
<div>
|
<p>1、实际付款金额</p>
|
</div>
|
<div>
|
<p>2、各渠道收入取值如下所示:</p>
|
<p>天猫:取值【在线支付】</p>
|
<p>京东:取值【货款+尾款货款+定金货款+价保扣款+预付首付款 +售后卖家赔付费】</p>
|
<p>抖音:取值结算状态【已结算】金额</p>
|
</div>
|
</div>
|
<i class="el-icon-question" style="cursor:pointer;" slot="reference"></i>
|
</el-popover>
|
</template>
|
<template slot-scope="scope">
|
<span>
|
{{valueIsNaN(scope.row.income)? '¥ ' + scope.row.income.toFixed(2): '-'}}
|
</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="实际收入分摊" width="140px" prop="spuIncomShare">
|
<template slot="header">
|
实际收入分摊
|
<el-popover placement="top" width="200" trigger="click" content="注:订单应计金额/订单应收金额*实际收入">
|
<i class="el-icon-question" style="cursor:pointer;" slot="reference"></i>
|
</el-popover>
|
</template>
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.spuIncomShare)? '¥ ' + scope.row.spuIncomShare.toFixed(2): '-' }}
|
</template>
|
</el-table-column>
|
<el-table-column label="订单应收金额与实际收入差额" width="140px">
|
<template slot="header">
|
订单应收金额与实际收入差额
|
<el-popover placement="top" width="160" trigger="click" content="注:订单应收金额-实际收入">
|
<i class="el-icon-question" style="cursor:pointer;" slot="reference"></i>
|
</el-popover>
|
</template>
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.paySubInCom)? '¥ ' + scope.row.paySubInCom.toFixed(2): '-' }}
|
</template>
|
</el-table-column>
|
<el-table-column label="实际支出" width="140px">
|
<template slot="header">
|
实际支出
|
<el-popover placement="top" width="260" trigger="click">
|
<div class="tips-content">
|
<p>注:</p>
|
<div>
|
<p>1、账单支出金额</p>
|
</div>
|
<div>
|
<p>2、各渠道支出取值如下:</p>
|
<p>天猫:取值【保证金+退款(交易退款)】</p>
|
<p>京东:取值【货款+尾款货款+定金货款+价保扣款+预付首付款 +售后卖家赔付费】</p>
|
<p>抖音:取值【已退款、已退款/原账户】</p>
|
</div>
|
</div>
|
<i class="el-icon-question" style="cursor:pointer;" slot="reference"></i>
|
</el-popover>
|
</template>
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.outgoing)? '¥ ' + scope.row.outgoing.toFixed(2): '-' }}
|
</template>
|
</el-table-column>
|
<el-table-column label="实际支出分摊" width="140px" prop="spuOutShare">
|
<template slot="header">
|
实际支出分摊
|
<el-popover placement="top" width="180" trigger="click" content="注:订单应计金额/订单应收金额*实际支出">
|
<i class="el-icon-question" style="cursor:pointer;" slot="reference"></i>
|
</el-popover>
|
</template>
|
<template slot-scope="scope">
|
{{valueIsNaN(scope.row.spuOutShare)? '¥ ' + scope.row.spuOutShare.toFixed(2): '-' }}
|
</template>
|
</el-table-column>
|
<el-table-column label="确认状态" width="140px" prop="confirmed" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="确认时间" width="160px" prop="confirmedTime"></el-table-column>
|
<el-table-column label="确认人" width="120px" prop="confirmedUser" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="收货地区" width="220px" prop="deliveryAddress" show-overflow-tooltip>
|
</el-table-column>
|
</template>
|
</list-condition-template>
|
</div>
|
</template>
|
|
<script>
|
import businessReportApi from '@/api/businessReport'
|
import orderSourceArr from '@/utils/constant/orderSourceArr'
|
import { getDate, dateDiffer } from '@/utils/getDate'
|
import { downloadFile } from '@/utils/downloadFile'
|
// 已确认发票状态变更
|
var _this = null
|
const invoiceArr = [
|
{
|
id: '0',
|
name: '未开票'
|
},
|
{
|
id: '1',
|
name: '已开票'
|
}
|
]
|
export default {
|
name: 'confirmedBillingCompList',
|
data () {
|
return {
|
loading: false,
|
listQuery: {
|
accountStartDate: null,
|
accountEndDate: null,
|
orderStartDate: null,
|
orderEndDate: null,
|
invoiceStartDate: null,
|
invoiceEndDate: null,
|
orderIds: null,
|
invoiceStatus: null,
|
orderSourceArr: null
|
},
|
formLabel: [
|
{
|
model: 'accountStartDate',
|
label: '账单日期',
|
type: 'date',
|
pickerOptions: {
|
disabledDate (time) {
|
return _this.listQuery.accountEndDate && time.getTime() > new Date(_this.listQuery.accountEndDate).getTime()
|
}
|
},
|
clearable: false,
|
timeClass: 'start-time-style'
|
},
|
{
|
model: 'accountEndDate',
|
label: '-',
|
customLabel: '账单日期',
|
type: 'date',
|
valueFormat: 'yyyy-MM-dd 23:59:59',
|
labelWidth: '20px',
|
pickerOptions: {
|
disabledDate (time) {
|
return _this.listQuery.accountStartDate && time.getTime() < new Date(_this.listQuery.accountStartDate).getTime()
|
}
|
},
|
clearable: false,
|
timeClass: 'end-time-style'
|
},
|
{
|
model: 'orderStartDate',
|
label: '订单日期',
|
type: 'date',
|
pickerOptions: {
|
disabledDate (time) {
|
return _this.listQuery.orderEndDate && time.getTime() > new Date(_this.listQuery.orderEndDate).getTime()
|
}
|
},
|
timeClass: 'start-time-style'
|
},
|
{
|
model: 'orderEndDate',
|
label: '-',
|
customLabel: '订单日期',
|
type: 'date',
|
valueFormat: 'yyyy-MM-dd 23:59:59',
|
labelWidth: '20px',
|
pickerOptions: {
|
disabledDate (time) {
|
return _this.listQuery.orderStartDate && time.getTime() < new Date(_this.listQuery.orderStartDate).getTime()
|
}
|
},
|
clearable: false,
|
timeClass: 'end-time-style'
|
},
|
{
|
model: 'invoiceStartDate',
|
label: '开票日期',
|
type: 'date',
|
pickerOptions: {
|
disabledDate (time) {
|
return _this.listQuery.invoiceEndDate && time.getTime() > new Date(_this.listQuery.invoiceEndDate).getTime()
|
}
|
},
|
timeClass: 'start-time-style'
|
},
|
{
|
model: 'invoiceEndDate',
|
label: '-',
|
customLabel: '开票日期',
|
type: 'date',
|
valueFormat: 'yyyy-MM-dd 23:59:59',
|
labelWidth: '20px',
|
pickerOptions: {
|
disabledDate (time) {
|
return _this.listQuery.invoiceStartDate && time.getTime() < new Date(_this.listQuery.invoiceStartDate).getTime()
|
}
|
},
|
clearable: false,
|
timeClass: 'end-time-style'
|
},
|
{
|
model: 'orderIds',
|
label: '订单编号',
|
type: 'input'
|
// rule: /[^\w]/g // 可输入数字字母
|
},
|
{
|
model: 'invoiceStatus',
|
label: '开票状态',
|
type: 'select',
|
opts: invoiceArr
|
},
|
{
|
model: 'orderSourceArr',
|
label: '订单来源',
|
type: 'select',
|
multiple: true,
|
opts: orderSourceArr
|
}
|
],
|
tableData: [],
|
total: 0,
|
exportQuery: null
|
}
|
},
|
created () {
|
_this = this
|
},
|
methods: {
|
/**
|
* 查看订单详情
|
*/
|
lookOrderInfo (row) {
|
this.$router.push({
|
name: 'orderMgtInfo',
|
query: {
|
orderId: row.orderId
|
// promotionStatus: row.promotionStatus
|
}
|
})
|
},
|
/**
|
* 设置账单日期最大值不超过一个月
|
*/
|
handleFormValue (data) {
|
const startTime = this.listQuery.accountStartDate
|
const endTime = this.listQuery.accountEndDate
|
if (startTime && data === startTime && (!endTime || dateDiffer(startTime, endTime) > 30)) {
|
const date = new Date(startTime)
|
date.setDate(date.getDate() + 30)
|
const m = (date.getMonth() + 1) < 10 ? '0' + (date.getMonth() + 1) : (date.getMonth() + 1)
|
this.listQuery.accountEndDate = date.getFullYear() + '-' + m + '-' + date.getDate() + ' 23:59:59'
|
} else if (endTime && data === endTime && (!startTime || dateDiffer(startTime, endTime) > 30)) {
|
const date = new Date(endTime)
|
date.setDate(date.getDate() - 30)
|
const m = (date.getMonth() + 1) < 10 ? '0' + (date.getMonth() + 1) : (date.getMonth() + 1)
|
this.listQuery.accountStartDate = date.getFullYear() + '-' + m + '-' + date.getDate() + ' 00:00:00'
|
}
|
},
|
// true:数值型的,false:非数值型
|
valueIsNaN (value) {
|
return (typeof value === 'number' && !isNaN(value))
|
},
|
/**
|
* 重置
|
*/
|
resetQuery () {
|
this.$refs.table.reloadCurrent()
|
},
|
/**
|
* 点击查询按钮
|
*/
|
queryData () {
|
this.$refs.table.changeCondition()
|
},
|
/**
|
* '分页信息改变时查询列表
|
*/
|
handlePageInfoChange (pageInfo) {
|
this.queryList(pageInfo)
|
},
|
/**
|
* 查询列表
|
*/
|
queryList (pageInfo = { pageNum: 1, pageSize: 10 }) {
|
if (!this.listQuery.accountStartDate && !this.listQuery.accountEndDate) {
|
const initTime = getDate(-30)
|
this.listQuery.accountStartDate = initTime[0] + ' 00:00:00'
|
this.listQuery.accountEndDate = initTime[1] + ' 23:59:59'
|
} else if (this.listQuery.accountStartDate && !this.listQuery.accountEndDate) {
|
this.handleFormValue(this.listQuery.accountStartDate)
|
} else if (!this.listQuery.accountStartDate && this.listQuery.accountEndDate) {
|
this.handleFormValue(this.listQuery.accountEndDate)
|
}
|
const param = JSON.parse(JSON.stringify(this.listQuery))
|
if (param.orderStatus === '') {
|
delete param.orderStatus
|
}
|
param.orderSources = this.listQuery.orderSourceArr.join(',')
|
delete param.orderSourceArr
|
businessReportApi.getConfirmedBillingCompList({ ...param, ...pageInfo, ...{ confirmed: true } }).then(res => {
|
if (res.data) {
|
this.setKey(res.data.list, pageInfo)
|
this.tableData = res.data.list
|
this.total = res.data.total
|
this.exportQuery = JSON.parse(JSON.stringify(param))
|
}
|
})
|
},
|
/**
|
* 设置表格行唯一key
|
*/
|
setKey (data, pageInfo) {
|
if (data && data.length) {
|
data.forEach((item, index) => {
|
const curIndex = index + 1
|
item.key = (pageInfo.pageNum - 1) * pageInfo.pageSize + curIndex
|
})
|
}
|
},
|
/**
|
* 判断查询条件是否为空
|
*/
|
queryConditionIsNull (listQuery) {
|
let queryIsNull = true
|
for (const i in listQuery) {
|
if ((Array.isArray(listQuery[i]) && listQuery[i].length) || (!Array.isArray(listQuery[i]) && listQuery[i])) {
|
queryIsNull = false
|
break
|
}
|
}
|
if (queryIsNull) {
|
this.$message({
|
message: '请输入查询条件进行导出',
|
type: 'info'
|
})
|
}
|
return queryIsNull
|
},
|
/**
|
* 导出
|
*/
|
async exportData () {
|
if (this.tableData.length === 0) {
|
this.$message({
|
message: '请输入查询条件进行导出',
|
type: 'info'
|
})
|
return
|
}
|
this.loading = true
|
const config = {
|
url: 'awl-analysis-service/order/shopSaleChangeDetailQueryExport',
|
data: { ...this.exportQuery, ...{ confirmed: true } },
|
fileName: '已确认发票状态变更',
|
Method: 'get',
|
type: '.xlsx'
|
}
|
const res = await downloadFile(config)
|
if (res) {
|
this.loading = false
|
} else {
|
this.loading = false
|
}
|
}
|
}
|
}
|
</script>
|
|
<style>
|
</style>
|