<template>
|
<div>
|
<list-condition-template ref="table" :form="listQuery" class="table" v-loading="loading"
|
element-loading-custom-class="customLoading"
|
@handle-form-Value="handleFormValue" :formLabel="formLabel"
|
:multipleSelected="true" :tableData="tableData" :total="total"
|
@page-info-change="handlePageInfoChange" :dataKey="'key'"
|
:isHiddenRow="true" :isAllCheck="true"
|
@expand-change="handleExpandChange"
|
@handle-selected="handleLineSelected" @select-all="handAllSelected">
|
<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-row>
|
<el-col :span="12" class="oper-left">
|
<el-checkbox v-model="allCheck" :disabled="tableData.length > 0? false : true"
|
@change="handleAllCheck" style="margin-left:10px;">
|
全选所有
|
</el-checkbox>
|
</el-col>
|
<el-col :span="12" class="oper-right">
|
<el-button size="mini" type="primary" @click="handleBatchConfirm">批量确认</el-button>
|
</el-col>
|
</el-row>
|
</template>
|
<template slot="columns">
|
<el-table-column type="expand">
|
<template slot-scope="props">
|
<el-table ref="billTable" class="billTable" row-key="id" border
|
:data="props.row.billInfo" v-if="props.row.billInfo" size="small"
|
@select="handleBillLineSelect" @select-all="handleBillSelected">
|
<el-table-column type="selection" :reserve-selection="true" label="全选" width="50">
|
</el-table-column>
|
<el-table-column type="index" label="序号" width="50" align="center">
|
</el-table-column>
|
<el-table-column label="账单流水号" prop="statementFlowCode" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="业务流水号" prop="business" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="账单时间" prop="acountDate"></el-table-column>
|
<el-table-column label="账户类型" prop="acountType"></el-table-column>
|
<el-table-column label="账单收入" prop="income" show-overflow-tooltip>
|
<template slot-scope="scope">
|
<span>{{valueIsNaN(scope.row.income) ? '￥ ' + scope.row.income.toFixed(2) : '-'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="账单支出" prop="outgoings" show-overflow-tooltip>
|
<template slot-scope="scope">
|
<span>{{valueIsNaN(scope.row.outgoings) ? '￥ ' + scope.row.outgoings.toFixed(2) : '-'}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="确认状态" prop="confirmed">
|
<template slot-scope="scope">
|
<span> {{ scope.row.confirmed ? "已确认" : '未确认' }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="确认时间" prop="confirmedTime"></el-table-column>
|
<el-table-column label="确认人" prop="confirmedUser" show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column label="操作" :width="`${$store.getters.colSize + 90}px`">
|
<template slot-scope="scope">
|
<wly-btn type="success" @click="handleConfirm(scope.row)">确认</wly-btn>
|
</template>
|
</el-table-column>
|
</el-table>
|
<p class="salesBillsConfim-noData" 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">
|
<!-- {{getLabel(orderStatus, scope.row.orderStatus, scope.row)}} -->
|
{{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="220px" prop="deliveryAddress" show-overflow-tooltip>
|
</el-table-column>
|
</template>
|
</list-condition-template>
|
</div>
|
</template>
|
|
<script>
|
import businessReportApi from '@/api/businessReport'
|
import { getDate, dateDiffer } from '@/utils/getDate'
|
import orderSourceArr from '@/utils/constant/orderSourceArr'
|
// 业务销售账单确认
|
var _this = null
|
const invoiceArr = [
|
{
|
id: '0',
|
name: '未开票'
|
},
|
{
|
id: '1',
|
name: '已开票'
|
}
|
]
|
const confirmArr = [
|
{
|
id: false,
|
name: '未确认'
|
},
|
{
|
id: true,
|
name: '已确认'
|
}
|
]
|
const orderStatusArr = [
|
{
|
id: '',
|
name: '全部'
|
},
|
{
|
id: '05',
|
name: '已完成'
|
},
|
{
|
id: '10',
|
name: '退款成功'
|
}
|
]
|
export default {
|
name: 'salesBillsConfimList',
|
data () {
|
return {
|
loading: false,
|
listQuery: {
|
accountStartDate: null,
|
accountEndDate: null,
|
orderStartDate: null,
|
orderEndDate: null,
|
orderIds: null,
|
orderStatus: null,
|
orderSourceArr: null,
|
spuNum: null,
|
invoiceStatus: null
|
},
|
exportQuery: {},
|
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: 'orderIds',
|
label: '订单编号',
|
type: 'input'
|
// rule: /[^\w]/g // 可输入数字字母
|
},
|
{
|
model: 'orderStatus',
|
label: '订单状态',
|
type: 'select',
|
opts: orderStatusArr
|
},
|
{
|
model: 'spuNum',
|
label: '订单商品主编码',
|
labelWidth: '120px',
|
type: 'input',
|
rule: /[^\w]/g // 可输入数字字母
|
},
|
{
|
model: 'invoiceStatus',
|
label: '开票状态',
|
type: 'select',
|
opts: invoiceArr
|
},
|
{
|
model: 'orderSourceArr',
|
label: '订单来源',
|
type: 'select',
|
multiple: true,
|
opts: orderSourceArr
|
},
|
{
|
model: 'confirmed',
|
label: '确认状态',
|
type: 'select',
|
opts: confirmArr
|
}
|
],
|
orderStatusArr,
|
orderSourceArr,
|
confirmArr,
|
entexpandData: {},
|
// 订单数据
|
tableData: [],
|
newTableData: [],
|
total: 0,
|
// 展开订单下的账单数据
|
billData: [],
|
// 选中的订单数据
|
orderQos: [],
|
// 排除掉的订单数据
|
excludeOrderQos: [],
|
// 排除掉的父级选中子级未选中数据
|
excludeOrderQosChild: [],
|
// 全选所有
|
allCheck: false,
|
allCheckOrderData: []
|
}
|
},
|
watch: {
|
tableData: {
|
handler (newVal) {
|
// 切换分页的时候设置订单数据行是否选中
|
if (this.allCheck && newVal.length) {
|
newVal.forEach((v1) => {
|
const isE = this.excludeOrderQos.find((v2) => v2.key === v1.key)
|
if (isE) { // 取消
|
this.$refs.table.setTableChecked(v1, false)
|
} else { // 选中
|
this.$refs.table.setTableChecked(v1, true)
|
}
|
})
|
}
|
},
|
deep: true
|
}
|
},
|
created () {
|
_this = this
|
},
|
methods: {
|
/**
|
* 查看订单详情
|
*/
|
lookOrderInfo (row) {
|
this.$router.push({
|
name: 'orderMgtInfo',
|
query: {
|
orderId: row.orderId
|
// promotionStatus: row.promotionStatus
|
}
|
})
|
},
|
// 分页信息改变时查询列表
|
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(',')
|
param.canConfirmed = true
|
delete param.orderSourceArr
|
businessReportApi.saleDetailedGetList({ ...param, ...pageInfo }).then(res => {
|
if (res.data) {
|
this.setKey(res.data.list, pageInfo)
|
this.tableData = res.data.list
|
if (res.data.list && res.data.list.length) {
|
res.data.list.forEach((v1) => {
|
const isE = this.newTableData.find((v2) => v2.key === v1.key)
|
if (!isE) {
|
this.newTableData = [...this.newTableData, ...res.data.list]
|
}
|
})
|
}
|
this.total = res.data.total
|
this.exportQuery = JSON.parse(JSON.stringify(param))
|
}
|
})
|
},
|
// true:数值型的，false：非数值型
|
valueIsNaN (value) {
|
return (typeof value === 'number' && !isNaN(value))
|
},
|
// 获取对账单信息
|
handleExpandChange (row, entexpands) {
|
const params = {
|
orderId: row.orderId
|
}
|
this.entexpandData = row
|
if (entexpands.length > 0) {
|
businessReportApi.getStatementInformationList(params).then(res => {
|
if (res.data) {
|
this.billData = res.data
|
this.tableData.forEach((item) => {
|
if (item.orderId === row.orderId) {
|
res.data.forEach((item, index) => {
|
item.key = index + 1
|
})
|
this.$set(item, 'billInfo', res.data)
|
}
|
})
|
if (this.allCheck) {
|
this.setBillTableCheckStatus1(res.data)
|
} else {
|
this.setBillTableCheckStatus2(res.data)
|
}
|
}
|
})
|
}
|
},
|
// 设置账单日期最大值不超过一个月
|
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'
|
}
|
},
|
// 设置表格行唯一key
|
setKey (data, pageInfo) {
|
if (data && data.length) {
|
data.forEach((item, index) => {
|
const curIndex = index + 1
|
item.key = (pageInfo.pageNum - 1) * pageInfo.pageSize + curIndex
|
})
|
}
|
},
|
// 重置
|
resetQuery () {
|
this.allCheck = false
|
this.resetTableCheckItem()
|
this.$refs.table.reloadCurrent()
|
},
|
// 点击查询按钮
|
queryData () {
|
this.allCheck = false
|
this.resetTableCheckItem()
|
this.$refs.table.changeCondition()
|
},
|
// 批量确认操作
|
handleBatchConfirm () {
|
let params = {}
|
if (this.allCheck) {
|
const arr = [...this.excludeOrderQos, ...this.excludeOrderQosChild]
|
params = {
|
excludeOrderQos: this.handlePrams(arr)// 排除订单集合，当全选后再去掉部分数据
|
}
|
params = { ...params, ...this.exportQuery }
|
} else {
|
if (this.orderQos.length === 0) {
|
this.$message({
|
message: '请选择要确认的销售账单明细！',
|
type: 'info'
|
})
|
return
|
}
|
params = {
|
orderQos: this.handlePrams(this.orderQos)// 确认订单集合
|
}
|
}
|
this.sendComfirmRequest(params)
|
},
|
// [批量确认]参数处理
|
handlePrams (allData) {
|
// 处理传参
|
const _data = []
|
allData.forEach((item) => {
|
const _obj = {
|
orderId: item.orderId
|
}
|
if (item.statementIds) {
|
_obj.statementIds = item.statementIds
|
}
|
_data.push(_obj)
|
})
|
return _data
|
},
|
// 确认
|
handleConfirm (row) {
|
const { orderId, id } = row
|
const params = {
|
orderQos: [{
|
orderId: orderId,
|
statementIds: [id]
|
}]
|
}
|
this.$confirm('确认后无法撤回操作，是否要确认？', '确认', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(async () => {
|
this.sendComfirmRequest(params)
|
})
|
},
|
// 发送确认请求
|
sendComfirmRequest (params) {
|
businessReportApi.billConfirmed(params).then(res => {
|
if (res.code === '0') {
|
this.$message({
|
message: '操作成功',
|
type: 'success'
|
})
|
this.$refs.table.changeCondition()
|
this.resetTableCheckItem()
|
this.allCheck = false
|
}
|
})
|
},
|
//* *****************************************表格选择框操作******************************************
|
// 操作全选所有
|
handleAllCheck (val) {
|
this.resetTableCheckItem()
|
if (val) {
|
this.setOrderCheckStatus(true)
|
this.initOrderCheckData()
|
if (Object.keys(this.entexpandData).length) {
|
this.setExpandDataStatus()
|
}
|
} else {
|
this.setAllTableChecked()
|
}
|
},
|
// 重置所有表格选中项
|
setAllTableChecked () {
|
this.$refs.table.clearTableSelected()
|
if (this.$refs.billTable) {
|
this.$refs.billTable.clearSelection()
|
}
|
},
|
// 选中[全选所有]，若[展开行]展开的情况同样设置[选中]状态
|
setExpandDataStatus () {
|
this.tableData.forEach((v1) => {
|
if (v1.key === this.entexpandData.key && v1.billInfo) {
|
v1.billInfo.forEach((v2) => {
|
_this.billLineCheckStatus(false, v2, true)
|
})
|
}
|
})
|
},
|
// [全选所有]初始订单选中数据
|
initOrderCheckData () {
|
this.orderQos = [...this.tableData]
|
},
|
// 设置当前页订单数据选中状态
|
setOrderCheckStatus (bool) {
|
this.tableData.forEach(item => {
|
if (item) {
|
this.$refs.table.setTableChecked(item, bool)
|
}
|
})
|
},
|
// 重置表格选中项数据
|
resetTableCheckItem () {
|
this.orderQos = []
|
this.excludeOrderQos = []
|
this.excludeOrderQosChild = []
|
this.allCheckOrderData = []
|
},
|
// 订单---当用户手动勾选数据行的 Checkbox 时触发的事件
|
handleLineSelected (selection, row) {
|
const bool = !!(selection.length && selection.indexOf(row) !== -1)
|
if (this.allCheck) {
|
this.checkAllorderLineHandle(selection, row, bool)
|
} else {
|
this.noCheckAllorderLineHandle(selection, row, bool)
|
}
|
},
|
// [全选所有]操作订单行情况下的处理
|
checkAllorderLineHandle (selection, row, bool) {
|
if (bool) {
|
const arr = []
|
this.excludeOrderQos.forEach((item) => {
|
if (item.key != row.key) {
|
arr.push(item)
|
}
|
})
|
this.excludeOrderQos = arr
|
if (Object.keys(this.entexpandData).length && this.billData.length > 0) {
|
this.billData.forEach((item) => {
|
this.billLineCheckStatus(false, item, true)
|
})
|
}
|
} else {
|
this.excludeOrderQos.push({
|
key: row.key,
|
orderId: row.orderId
|
})
|
this.billLineCheckStatus(true)
|
}
|
this.allCheckOrderData = selection
|
this.resetAllCheckStatus(true)
|
},
|
// 未选中[全选所有]操作订单行情况下的处理
|
noCheckAllorderLineHandle (selection, row, bool) {
|
// 获取选中的数据
|
if (bool) {
|
const iSE = this.orderQos.length ? this.orderQos.find((item) => item.key === row.key) : null
|
if (!iSE) {
|
this.orderQos.push({
|
key: row.key,
|
orderId: row.orderId
|
})
|
}
|
if (Object.keys(this.entexpandData).length) {
|
const _ids = []
|
if (row.key === this.entexpandData.key && row.billInfo) {
|
row.billInfo.forEach((v2) => {
|
_ids.push(v2.id)
|
_this.billLineCheckStatus(false, v2, true)
|
})
|
}
|
this.orderQos.forEach((v1) => {
|
if (v1.key === row.key) {
|
this.$set(v1, 'statementIds', _ids)
|
}
|
})
|
}
|
} else {
|
const arr = []
|
this.orderQos.forEach((v1) => {
|
if (v1.key != row.key) {
|
arr.push({
|
key: v1.key,
|
orderId: v1.orderId,
|
statementIds: v1.statementIds ? v1.statementIds : []
|
})
|
}
|
})
|
this.orderQos = arr
|
if (Object.keys(this.entexpandData).length) {
|
const _ids = []
|
if (row.key === this.entexpandData.key && row.billInfo) {
|
row.billInfo.forEach((v2) => {
|
_ids.push(v2.id)
|
_this.billLineCheckStatus(false, v2, false)
|
})
|
}
|
const arr = []
|
this.orderQos.forEach((v1) => {
|
if (v1.key != row.key) {
|
arr.push(v1)
|
}
|
})
|
this.orderQos = arr
|
}
|
}
|
this.resetAllCheckStatus(false)
|
},
|
// 订单---当用户手动勾选全选 Checkbox 时触发的事件
|
handAllSelected (selection) {
|
const bool = selection.indexOf(this.tableData[0]) !== -1
|
if (this.allCheck) {
|
if (bool) {
|
const arr = []
|
this.excludeOrderQos.forEach((v1) => {
|
const isE = selection.find((v2) => v2.key === v1.key)
|
if (!isE) {
|
arr.push(v1)
|
}
|
})
|
this.excludeOrderQos = arr
|
if (Object.keys(this.entexpandData).length && this.billData.length > 0) {
|
this.billData.forEach((item) => {
|
this.billLineCheckStatus(false, item, true)
|
})
|
}
|
} else {
|
this.tableData.forEach((item) => {
|
this.excludeOrderQos.push({
|
key: item.key,
|
orderId: item.orderId
|
})
|
})
|
this.billLineCheckStatus(true)
|
}
|
this.allCheckOrderData = selection
|
this.resetAllCheckStatus(true)
|
} else {
|
// 获取选中的数据
|
if (bool) {
|
selection.forEach((v1) => {
|
const iSE = this.orderQos.length ? this.orderQos.find((v2) => v1.key === v2.key) : null
|
if (!iSE) {
|
this.orderQos.push({
|
key: v1.key,
|
orderId: v1.orderId
|
})
|
}
|
})
|
if (Object.keys(this.entexpandData).length && this.billData.length > 0) {
|
this.billData.forEach((item) => {
|
this.billLineCheckStatus(false, item, true)
|
})
|
}
|
} else {
|
const arr = []
|
this.orderQos.forEach((v1) => {
|
const isE = this.tableData.find((v2) => v2.key === v1.key)
|
if (!isE) {
|
arr.push({
|
key: v1.key,
|
orderId: v1.orderId
|
})
|
}
|
})
|
this.orderQos = arr
|
this.billLineCheckStatus(true)
|
}
|
this.resetAllCheckStatus(false)
|
}
|
},
|
// 账单---当用户手动勾选全选 Checkbox 时触发的事件
|
handleBillSelected (selection) {
|
const bool = selection.indexOf(this.billData[0]) !== -1
|
if (this.allCheck) {
|
this.billCheckboxAllHandle(selection, bool)
|
} else {
|
this.billNoCheckboxAllHandle(selection, bool)
|
}
|
},
|
// [全选所有]的情况下账单全选操作
|
billCheckboxAllHandle (selection, bool) {
|
// 获取上级订单选中状态
|
let _orderStatus = false
|
if (this.excludeOrderQos.length) {
|
for (let i = 0; i < this.excludeOrderQos.length; i++) {
|
if (this.excludeOrderQos[i].key === this.entexpandData.key) {
|
_orderStatus = true
|
break
|
}
|
}
|
}
|
if (_orderStatus) { // 父级订单是取消选中状态
|
if (bool) { // 选中
|
const arr = []
|
this.excludeOrderQos.forEach((item) => {
|
if (item.key != this.entexpandData.key) {
|
arr.push(item)
|
}
|
})
|
this.excludeOrderQos = arr
|
// 父级设置为选中状态
|
this.tableData.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
this.$refs.table.setTableChecked(item, true)
|
}
|
})
|
}
|
} else { // 父级订单为选中状态
|
if (!bool) {
|
this.excludeOrderQos.push({
|
key: this.entexpandData.key,
|
orderId: this.entexpandData.orderId
|
})
|
// 父级设置为取消状态
|
this.tableData.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
this.$refs.table.setTableChecked(item, false)
|
}
|
})
|
}
|
}
|
},
|
// 未选中[全选所有]的情况下账单全选操作
|
billNoCheckboxAllHandle (selection, bool) {
|
// 获取上级订单选中状态
|
let _orderStatus = false
|
if (this.orderQos.length) {
|
for (let i = 0; i < this.orderQos.length; i++) {
|
if (this.orderQos[i].key === this.entexpandData.key) {
|
_orderStatus = true
|
break
|
}
|
}
|
}
|
if (_orderStatus) {
|
if (!bool) {
|
// 设置父级选中状态
|
this.tableData.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
this.$refs.table.setTableChecked(item, false)
|
}
|
})
|
// 删除当前订单及订单下所有的账单
|
const arr = []
|
this.orderQos.forEach((item) => {
|
if (item.key != this.entexpandData.key) {
|
arr.push(item)
|
}
|
})
|
this.orderQos = arr
|
}
|
} else {
|
if (bool) {
|
// 设置父级选中状态
|
this.tableData.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
this.$refs.table.setTableChecked(item, true)
|
}
|
})
|
// 同步选中的账单数据
|
const _ids = []
|
selection.forEach((item) => {
|
_ids.push(item.id)
|
})
|
this.orderQos.push({
|
key: this.entexpandData.key,
|
orderId: this.entexpandData.orderId,
|
statementIds: _ids
|
})
|
}
|
}
|
},
|
// [全选所有]的情况下勾选账单行处理
|
checkAllCheckBillLineHandle (selection, row, selected) {
|
// 获取上级订单选中状态
|
let _orderStatus = false
|
if (this.excludeOrderQos.length) {
|
for (let i = 0; i < this.excludeOrderQos.length; i++) {
|
if (this.excludeOrderQos[i].key === this.entexpandData.key) {
|
_orderStatus = true
|
break
|
}
|
}
|
}
|
if (_orderStatus) { // 上级订单是取消状态
|
if (selected) {
|
// 只有子级有一个选中，就删除excludeOrderQos中的数据
|
const arr = []
|
this.excludeOrderQos.forEach((item) => {
|
if (item.key != this.entexpandData.key) {
|
arr.push(item)
|
}
|
})
|
this.excludeOrderQos = arr
|
// 将子级中未选中的存放到excludeOrderQosChild中
|
const _data = []
|
this.tableData.forEach((v1) => {
|
if (v1.key === this.entexpandData.key) {
|
v1.billInfo.forEach((v2) => {
|
const isE = selection.find((v3) => v3.key === v2.key)
|
if (!isE) {
|
_data.push(v2.id)
|
}
|
})
|
}
|
})
|
if (_data.length) {
|
this.excludeOrderQosChild.push({
|
key: this.entexpandData.key,
|
orderId: this.entexpandData.orderId,
|
statementIds: _data
|
})
|
}
|
// 父级设置为选中状态
|
this.tableData.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
this.$refs.table.setTableChecked(item, true)
|
}
|
})
|
}
|
} else { // 上级订单是选中状态
|
if (selected) {
|
if (this.excludeOrderQosChild.length) {
|
const _data = []
|
this.tableData.forEach((v1) => {
|
if (v1.key === this.entexpandData.key) {
|
v1.billInfo.forEach((v2) => {
|
const isE = selection.find((v3) => v3.key === v2.key)
|
if (!isE) {
|
_data.push(v2.id)
|
}
|
})
|
}
|
})
|
this.excludeOrderQosChild.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
item.statementIds = _data
|
}
|
if (item.statementIds && item.statementIds.length === 0) {
|
const arr = []
|
this.excludeOrderQosChild.forEach((v2) => {
|
if (v2.key != this.entexpandData.key) {
|
arr.push(v2)
|
}
|
})
|
this.excludeOrderQosChild = arr
|
}
|
})
|
} else {
|
const _data = []
|
this.tableData.forEach((v1) => {
|
if (v1.key === this.entexpandData.key) {
|
v1.billInfo.forEach((v2) => {
|
const isE = selection.find((v3) => v3.key === v2.key)
|
if (!isE) {
|
_data.push(v2.id)
|
}
|
})
|
}
|
})
|
this.excludeOrderQosChild.push({
|
key: this.entexpandData.key,
|
orderId: this.entexpandData.orderId,
|
statementIds: _data
|
})
|
}
|
} else {
|
let flag = false
|
if (this.excludeOrderQosChild.length) {
|
this.excludeOrderQosChild.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
flag = true
|
}
|
})
|
}
|
if (flag) {
|
let _billInfo = []
|
this.tableData.forEach((item3) => {
|
if (item3.key === this.entexpandData.key) {
|
_billInfo = [...item3.billInfo]
|
}
|
})
|
this.excludeOrderQosChild.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
item.statementIds.push(row.id)
|
}
|
if (item.statementIds && item.statementIds.length === _billInfo.length) {
|
const arr = []
|
this.excludeOrderQosChild.forEach((item1) => {
|
if (item1.key != this.entexpandData.key) {
|
arr.push(item1)
|
}
|
})
|
this.excludeOrderQosChild = arr
|
this.excludeOrderQos.push({
|
key: this.entexpandData.key,
|
orderId: this.entexpandData.orderId
|
})
|
// 子级所有都取消的情况下父级同步设置为取消选中状态
|
this.tableData.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
this.$refs.table.setTableChecked(item, false)
|
}
|
})
|
}
|
})
|
} else {
|
if (this.billData.length === 1) {
|
this.excludeOrderQos.push({
|
key: this.entexpandData.key,
|
orderId: this.entexpandData.orderId
|
})
|
// 父级设置为取消选中状态
|
this.tableData.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
this.$refs.table.setTableChecked(item, false)
|
}
|
})
|
} else {
|
this.excludeOrderQosChild.push({
|
key: this.entexpandData.key,
|
orderId: this.entexpandData.orderId,
|
statementIds: [row.id]
|
})
|
}
|
}
|
}
|
}
|
},
|
// 未选中[全选所有]的情况下勾选账单行处理
|
noCheckAllCheckBillLineHandle (selection, row, selected) {
|
// 获取上级订单选中状态
|
let _orderStatus = false
|
if (this.orderQos.length) {
|
for (let i = 0; i < this.orderQos.length; i++) {
|
if (this.orderQos[i].key === this.entexpandData.key) {
|
_orderStatus = true
|
break
|
}
|
}
|
}
|
if (_orderStatus) {
|
// 上级订单选中的情况
|
if (selected) {
|
this.orderQos.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
item.statementIds.push(row.id)
|
}
|
})
|
} else {
|
this.orderQos.forEach((v1) => {
|
const _index = v1.statementIds ? v1.statementIds.indexOf(row.id) : -1
|
if (v1.key === this.entexpandData.key && _index != -1) {
|
v1.statementIds.splice(_index, 1)
|
}
|
// 下级账单所有的数据都取消的情况下删除父级选中状态
|
if (v1.statementIds && v1.statementIds.length === 0) {
|
const arr = []
|
this.orderQos.forEach((v2) => {
|
if (v2.key != this.entexpandData.key) {
|
arr.push(v2)
|
}
|
})
|
this.orderQos = arr
|
this.tableData.forEach((v3) => {
|
if (v3.key === this.entexpandData.key) {
|
this.$refs.table.setTableChecked(v3, false)
|
}
|
})
|
}
|
})
|
}
|
} else {
|
// 上级订单未选中的情况
|
if (selected) {
|
const { id } = row
|
this.orderQos.push({
|
key: this.entexpandData.key,
|
orderId: this.entexpandData.orderId,
|
statementIds: [id]
|
})
|
this.tableData.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
this.$refs.table.setTableChecked(item, true)
|
}
|
})
|
}
|
}
|
},
|
// 账单---当用户手动勾选数据行的 Checkbox 时触发的事件
|
handleBillLineSelect (selection, row) {
|
const selected = selection.length && selection.indexOf(row) !== -1
|
if (this.allCheck) {
|
this.checkAllCheckBillLineHandle(selection, row, selected)
|
} else {
|
this.noCheckAllCheckBillLineHandle(selection, row, selected)
|
}
|
},
|
// 选择[全选所有]的情况下设置账单的选中状态
|
setBillTableCheckStatus1 (_data) {
|
const _this = this
|
const isE = this.excludeOrderQos.find((v1) => v1.key === this.entexpandData.key)
|
const _ids = []
|
_data.forEach((item) => {
|
_ids.push(item.id)
|
})
|
if (isE) { // 取消
|
this.excludeOrderQos.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
this.$set(item, 'statementIds', _ids)
|
}
|
})
|
_this.billLineCheckStatus(true)
|
} else { // 选中
|
if (this.excludeOrderQosChild.length) {
|
const _statementIds = []
|
this.excludeOrderQosChild.forEach((v1) => {
|
if (v1.key === this.entexpandData.key) {
|
v1.statementIds.forEach((v2) => {
|
_statementIds.push(v2)
|
})
|
}
|
})
|
_data.forEach((v2) => {
|
if (_statementIds && _statementIds.indexOf(v2.id) != -1) {
|
_this.billLineCheckStatus(false, v2, false)
|
} else {
|
_this.billLineCheckStatus(false, v2, true)
|
}
|
})
|
} else {
|
_data.forEach((v1) => {
|
_this.billLineCheckStatus(false, v1, true)
|
})
|
}
|
}
|
},
|
// 未选择[全选所有]的情况下设置账单的选中状态
|
setBillTableCheckStatus2 (_data) {
|
const _this = this
|
const isE = this.orderQos.find((v1) => v1.key === this.entexpandData.key)
|
const _ids = []
|
_data.forEach((item) => {
|
_ids.push(item.id)
|
})
|
if (isE) { // 选中
|
// 获取是否有选中的账单
|
const isE = this.orderQos.find((v1) => v1.key === this.entexpandData.key)
|
if (isE && isE.statementIds && isE.statementIds.length > 0) {
|
_data.forEach((v1) => {
|
if (isE.statementIds.indexOf(v1.id) != -1) {
|
_this.billLineCheckStatus(false, v1, true)
|
} else {
|
_this.billLineCheckStatus(false, v1, false)
|
}
|
})
|
} else {
|
// 没有指定选中的账单的情况下,设置下级所有都选中
|
this.orderQos.forEach((item) => {
|
if (item.key === this.entexpandData.key) {
|
this.$set(item, 'statementIds', _ids)
|
}
|
})
|
_this.tableData.forEach((v1) => {
|
if (v1.key === _this.entexpandData.key) {
|
v1.billInfo.forEach((v2) => {
|
_this.billLineCheckStatus(false, v2, true)
|
})
|
}
|
})
|
}
|
} else { // 取消
|
_this.billLineCheckStatus(true)
|
}
|
},
|
// 操作子级账单表格行是否选中
|
// isClear:是否清空选中项 rowData:行数据 bool:不清空的情况操作状态选中还是取消选中
|
billLineCheckStatus (isClear, rowData, bool) {
|
const _this = this
|
_this.$nextTick(() => {
|
if (_this.$refs.billTable) {
|
if (isClear) {
|
_this.$refs.billTable.clearSelection()
|
} else {
|
_this.$refs.billTable.toggleRowSelection(rowData, bool)
|
}
|
}
|
})
|
},
|
// 重置[全选所有选中状态]
|
resetAllCheckStatus (bool) {
|
if (bool) {
|
if (this.newTableData.length === this.total && this.allCheckOrderData.length === 0) {
|
this.allCheck = false
|
this.orderQos = []
|
}
|
} else {
|
if (this.orderQos.length === this.total) {
|
this.allCheck = true
|
}
|
}
|
}
|
}
|
}
|
</script>
|
|
<style>
|
.salesBillsConfim-noData {
|
text-align: center;
|
}
|
.oper-right {
|
text-align: right;
|
}
|
</style>
|
