<template>
|
<div>
|
<list-condition-template ref="table" v-loading="loading"
|
element-loading-custom-class="customLoading"
|
@handle-form-Value="handleFormValue" :form="listQuery"
|
:formLabel="formLabel" :tableData="tableData" :total="total"
|
@selected="selectItem" @page-info-change="handlePageInfoChange">
|
<template slot="otherElement">
|
<el-col :span="24" :offset="0" class="buttonPosition">
|
<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"
|
type="primary"
|
@click="summaryConfirm(1)"
|
>批量确认</el-button> -->
|
<el-tooltip class="item" effect="dark" content="导出时查询条件不能为空" placement="top">
|
<el-button size="mini" type="primary" icon="el-icon-download" @click="exportData">销售汇总导出
|
</el-button>
|
</el-tooltip>
|
</template>
|
<template slot="columns">
|
<el-table-column label="平台编码" prop="shopCode">
|
</el-table-column>
|
<el-table-column label="销售区域" prop="salesArea" width="160px"></el-table-column>
|
<el-table-column label="店铺名称" width="180px" prop="shopName" show-overflow-tooltip>
|
</el-table-column>
|
<!-- <el-table-column label="订单日期" width="160px" prop="orderDate" show-overflow-tooltip></el-table-column> -->
|
<!-- <el-table-column label="店铺名称" width="160px" prop="shopName" 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="160px" prop="spuNum" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="规格型号" width="160px" prop="auxiliaryModel" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="单位" show-overflow-tooltip prop="auxiliaryUnit"></el-table-column>
|
<el-table-column label="数量" prop="buyQuantity" show-overflow-tooltip>
|
<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>
|
</el-table-column>
|
<el-table-column label="单价" width="120px" prop="salePrice" show-overflow-tooltip>
|
<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.salePrice)? '￥ ' + scope.row.salePrice.toFixed(2): '-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="金额" width="120px" prop="spuTotelAmtAct" show-overflow-tooltip>
|
<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.spuTotelAmtAct)? '￥ ' + scope.row.spuTotelAmtAct.toFixed(2): '-'}}
|
</template>
|
</el-table-column>
|
<el-table-column label="开票状态" width="120px" prop="invoiceMainStatus" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="转NC单价" width="120px" prop="salePriceNC" show-overflow-tooltip>
|
<template slot="header">
|
转NC单价
|
<el-popover placement="top" width="200" trigger="click" content="注：单价/1.13">
|
<i class="el-icon-question" style="cursor:pointer;" slot="reference"></i>
|
</el-popover>
|
</template>
|
</el-table-column>
|
<el-table-column label="转NC金额" width="120px" prop="spuTotelAmtActNC" show-overflow-tooltip>
|
<template slot="header">
|
转NC金额
|
<el-popover placement="top" width="200" trigger="click" content="注：金额（销售金额）/1.13">
|
<i class="el-icon-question" style="cursor:pointer;" slot="reference"></i>
|
</el-popover>
|
</template>
|
</el-table-column>
|
<el-table-column label="转NC税额" width="120px" prop="taxNC" show-overflow-tooltip>
|
<template slot="header">
|
转NC税额
|
<el-popover placement="top" width="200" trigger="click" content="注：金额（销售金额）-转nc金额">
|
<i class="el-icon-question" style="cursor:pointer;" slot="reference"></i>
|
</el-popover>
|
</template>
|
</el-table-column>
|
<el-table-column label="转NC商品主编码" width="160px" prop="spuNumNC" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="转NC商品名称" width="160px" prop="spuNameNC" show-overflow-tooltip>
|
</el-table-column>
|
<!-- <el-table-column label="确认状态">
|
<template slot-scope="scope">
|
<span>{{scope.row.sorderEndDate}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="确认时间" prop="title" show-overflow-tooltip></el-table-column>
|
<el-table-column label="备注" prop="title" show-overflow-tooltip></el-table-column>
|
<el-table-column label="操作">
|
<template slot-scope="scope">
|
<el-button size="mini" type="primary" @click="summaryConfirm(0,scope.row)">确认</el-button>
|
</template>
|
</el-table-column> -->
|
</template>
|
</list-condition-template>
|
</div>
|
</template>
|
<script>
|
import businessReportApi from '@/api/businessReport'
|
import salesAreaApi from '@/api/salesArea'
|
import orderSourceArr from '@/utils/constant/orderSourceArr'
|
import { downloadFile } from '@/utils/downloadFile'
|
import { getDate, dateDiffer } from '@/utils/getDate'
|
|
var _this = null
|
export default {
|
components: {
|
},
|
data () {
|
return {
|
orderSourceArr,
|
tableData: [],
|
total: 0,
|
listQuery: {
|
spuName: null,
|
spuNum: null,
|
invoiceStatus: null,
|
orderStartDate: null,
|
orderEndDate: null,
|
orderSourceArr: null,
|
accountStartDate: null,
|
accountEndDate: null,
|
merchantId: null,
|
salesArea: null,
|
contractIdsArr: null
|
},
|
form: {},
|
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',
|
labelWidth: '20px',
|
valueFormat: 'yyyy-MM-dd 23:59:59',
|
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: '-',
|
// type: 'date',
|
// valueFormat: 'yyyy-MM-dd 23:59:59',
|
// pickerOptions: {
|
// disabledDate (time) {
|
// return _this.listQuery.orderStartDate && time.getTime() < new Date(_this.listQuery.orderStartDate).getTime()
|
// }
|
// },
|
// timeClass: 'end-time-style'
|
// },
|
// {
|
// model: 'merchantId',
|
// label: '店铺名称',
|
// type: 'select',
|
// opts: []
|
// },
|
{
|
model: 'spuName',
|
label: '商品名称',
|
type: 'input'
|
},
|
{
|
model: 'spuNum',
|
label: '商品主编码',
|
type: 'input',
|
labelWidth: '100px',
|
rule: /[^\w]/g // 可输入数字字母
|
},
|
{
|
model: 'invoiceStatus',
|
label: '开票状态',
|
type: 'select',
|
opts: [
|
{
|
id: '0',
|
name: '未开票'
|
},
|
{
|
id: '1',
|
name: '已开票'
|
}
|
]
|
},
|
{
|
model: 'orderSourceArr',
|
label: '渠道名称',
|
type: 'select',
|
multiple: true,
|
opts: orderSourceArr
|
},
|
{
|
model: 'contractIdsArr',
|
label: '店铺名称',
|
type: 'select',
|
multiple: true,
|
opts: []
|
},
|
{
|
model: 'salesArea',
|
label: '销售区域',
|
type: 'select',
|
opts: []
|
}
|
],
|
rows: [],
|
exportQuery: null,
|
loading: false
|
}
|
},
|
created () {
|
_this = this
|
this.getShopNameList()
|
this.getSalesAreaData()
|
},
|
methods: {
|
/**
|
* 获取店铺名称下拉数据
|
*/
|
async getShopNameList () {
|
const res = await businessReportApi.getShopNameArr({ dictGroup: 'platform_shop_name' })
|
const _data = res.data
|
if (res.code === '0' && _data.length) {
|
const arr = []
|
_data.forEach((item) => {
|
arr.push({
|
id: item.code,
|
name: item.name
|
})
|
})
|
this.formLabel[6].opts = arr
|
}
|
},
|
/**
|
* 获取销售区域下拉数据
|
*/
|
async getSalesAreaData () {
|
const res = await salesAreaApi.getSalesAreaList()
|
const _data = res.data
|
if (res.code === '0' && _data.length) {
|
const arr = []
|
_data.forEach((item) => {
|
arr.push({
|
id: item.code,
|
name: item.name
|
})
|
})
|
this.formLabel[7].opts = arr
|
}
|
},
|
/**
|
* 设置订单日期最大值不超过一个月
|
*/
|
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))
|
},
|
/**
|
* 获取店铺数组
|
*/
|
async getShopArr () {
|
const res = await businessReportApi.getShopArr()
|
if (res.code === '0') {
|
this.formLabel.forEach(item => {
|
if (item.model === 'merchantId') {
|
item.opts = res.data.map(item => {
|
return {
|
id: item.thirdCode,
|
name: item.dictName
|
}
|
})
|
}
|
})
|
}
|
},
|
/**
|
* 汇总确认
|
*/
|
summaryConfirm (isBatch, row) {
|
if (isBatch && !this.rows.length) {
|
this.$message({
|
message: '请勾选需要确认的销售汇总数据',
|
type: 'info'
|
})
|
return
|
}
|
this.$confirm('确认后不可取消确认，是否确认？', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(async () => {
|
try {
|
const res = await businessReportApi.summaryConfirm({
|
orderId: row.orderId
|
})
|
if (res.code === '0') {
|
this.$message({
|
message: '操作成功',
|
type: 'success'
|
})
|
this.rows = []
|
this.$refs.table.changeCondition()
|
this.$refs.table.clearTableSelected() // 清空表格勾选项
|
}
|
} catch (error) { }
|
})
|
},
|
/**
|
*
|
*获取勾选的表格数据
|
*/
|
selectItem (val) {
|
this.rows = []
|
val.forEach((item) => {
|
this.rows.push(item.id)
|
})
|
},
|
/**
|
* 判断查询条件是否为空
|
*/
|
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.queryConditionIsNull(this.exportQuery)) {
|
return
|
}
|
this.loading = true
|
const config = {
|
url: 'awl-analysis-service/order/shopSaleGatherQueryExport',
|
data: this.exportQuery,
|
fileName: 'C端自营店铺销售汇总数据',
|
Method: 'get',
|
type: '.xlsx'
|
}
|
const res = await downloadFile(config)
|
if (res) {
|
this.loading = false
|
this.$refs.table.clearTableSelected() // 清空表格勾选项
|
} else {
|
this.loading = false
|
}
|
},
|
/**
|
* 获取数组的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.listQuery.orderSourceArr = []
|
this.listQuery.contractIdsArr = []
|
this.$refs.table.reloadCurrent()
|
},
|
/**
|
* 点击查询按钮
|
*/
|
queryData () {
|
this.$refs.table.changeCondition()
|
},
|
/**
|
* 查询列表
|
*/
|
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))
|
param.orderSources = this.listQuery.orderSourceArr.join(',')
|
param.contractIds = this.listQuery.contractIdsArr.join(',')
|
delete param.orderSourceArr
|
delete param.contractIdsArr
|
businessReportApi.summaryGetList({ ...param, ...pageInfo }).then(res => {
|
if (res.data) {
|
this.tableData = res.data.list
|
this.total = res.data.total
|
this.exportQuery = JSON.parse(JSON.stringify(param))
|
}
|
})
|
}
|
}
|
}
|
</script>
|
<style lang="scss">
|
</style>
|
