You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1089 lines
33 KiB
1089 lines
33 KiB
<template> |
|
<div> |
|
<div class="table-header table-div el-scrollbar styleTime"> |
|
<ListLayout :table-columns="tableColumns"> |
|
<div slot="search" style="margin-top: 5px"> |
|
<!--这里放顶部搜索--> |
|
<el-collapse-transition> |
|
<!-- 搜索部分开始 --> |
|
<el-form |
|
v-show="showSearch" |
|
label-width="90px" |
|
:inline="true" |
|
:model="page" |
|
class="search-form" |
|
:size="$store.getters.size" |
|
> |
|
<el-form-item> |
|
<el-input |
|
v-model="page.params.companyName" |
|
placeholder="请输入公司名称" |
|
clearable |
|
@keyup.enter.native="getByPage" |
|
/> |
|
</el-form-item> |
|
<el-form-item> |
|
<el-select |
|
v-model="page.params.type" |
|
filterable |
|
placeholder="消费类型" |
|
> |
|
<el-option value="1" label="已消费" /> |
|
<el-option value="0" label="未消费" /> |
|
</el-select> |
|
</el-form-item> |
|
<el-form-item> |
|
<gl-date-time-picker |
|
timeFrame="60" |
|
v-model="page.params.btw_createTime" |
|
msg="创建时间" |
|
@keyup.enter.native="getByPage" |
|
/> |
|
</el-form-item> |
|
</el-form> |
|
</el-collapse-transition> |
|
<!-- 搜索部分结束 --> |
|
</div> |
|
|
|
<div slot="button-group"> |
|
<el-row style="margin-top: 5px"> |
|
<el-col :span="16" style="text-align:left"> |
|
<el-button class="group-item" :size="$store.getters.size" type="primary" @click="toOutPut"> |
|
<svg-icon icon-class="icondaochu" /> 导出 |
|
</el-button> |
|
</el-col> |
|
<el-col :span="8"> |
|
<el-button |
|
type="primary" |
|
:size="$store.getters.size" |
|
icon="el-icon-search" |
|
@click="search" |
|
>查询</el-button |
|
> |
|
<el-button |
|
:size="$store.getters.size" |
|
icon="el-icon-refresh" |
|
type="info" |
|
@click="page.params = {type:'1'}" |
|
>重置 |
|
</el-button> |
|
</el-col> |
|
</el-row> |
|
<!-- <el-row> |
|
<el-col :span="24" :offset="0"> |
|
<el-collapse-transition> |
|
<div v-show="showStatistic" class="statistic-container"> |
|
<div class="statictic-item"> |
|
<div class="left-count"> |
|
<div class="text">订单总数</div> |
|
<div class="count"> |
|
{{ totalData.totalCount | numSplit }} |
|
</div> |
|
</div> |
|
<div class="right-container"> |
|
<div |
|
v-for="(item, index) in totalChannelData" |
|
:key="index" |
|
class="right-item" |
|
> |
|
<div class="pie-table"> |
|
<ripple-chart |
|
:chart-id="item.type" |
|
:title="sites[item.type]" |
|
:chart-color="pieColors[index]" |
|
:percent="item.percent" |
|
/> |
|
</div> |
|
<div class="statis-info"> |
|
<div class="info-item">{{ sites[item.type] }}</div> |
|
<div class="info-item"> |
|
订单总数：{{ item.totalCount }}单 |
|
</div> |
|
<div class="info-item"> |
|
订单总金额：{{ item.totalMoney }}￥ |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
<div class="statictic-item"> |
|
<div class="left-count"> |
|
<div class="text">订单总金额</div> |
|
<div class="count"> |
|
{{ totalData.totalMoney | numSplit }} |
|
</div> |
|
</div> |
|
<div class="right-container"> |
|
<div |
|
v-for="(item, index) in totalTypeData" |
|
:key="index" |
|
class="right-item" |
|
> |
|
<div class="pie-table"> |
|
<ripple-chart |
|
:chart-id="item.type" |
|
:title="item.type === '1' ? '企业' : '个人'" |
|
:chart-color="pieColors[index]" |
|
:percent="item.percent" |
|
/> |
|
</div> |
|
<div class="statis-info"> |
|
<div class="info-item"> |
|
{{ item.type === "1" ? "企业" : "个人" }} |
|
</div> |
|
<div class="info-item"> |
|
订单总数：{{ item.totalCount }}单 |
|
</div> |
|
<div class="info-item"> |
|
订单总金额：{{ item.totalMoney }}￥ |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</el-collapse-transition> |
|
</el-col> |
|
</el-row> --> |
|
</div> |
|
<div slot="table"> |
|
<!--这里放表格和分页--> |
|
<!-- 列表开始 --> |
|
<el-table |
|
v-loading="listLoading" |
|
stripe |
|
fit |
|
row-key="companyId" |
|
:expand-row-keys="expands" |
|
:data="dataPage.list" |
|
:max-height="tableHeight" |
|
style="width: 100%" |
|
:size="$store.getters.size" |
|
@sort-change="sortHandler" |
|
@selection-change="handleSelectionChange" |
|
@row-click="clickRowHandle" |
|
@expand-change="expandSelect" |
|
> |
|
<el-table-column type="expand"> |
|
<template slot-scope="scope"> |
|
<el-form label-position="left" inline class="demo-table-expand"> |
|
<el-col :span="9" style="font-size: initial;"> |
|
<el-form-item> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="9" style="display:flex;flex-direction: column"> |
|
<el-form-item label="充值金额"> |
|
<span> {{scope.row.rechargeBalance|balanceType}} </span> |
|
</el-form-item> |
|
<el-form-item label="赊销金额"> |
|
<span> {{scope.row.chargeRechargeBalance|balanceType}}</span> |
|
</el-form-item> |
|
<el-form-item label="消返金额"> |
|
<span>{{scope.row.consumeRebateBalance|balanceType}}</span> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="6" style="display:flex;flex-direction: column"> |
|
<el-form-item label="累计充值金额"> |
|
<span> {{dataListChild.czje?dataListChild.czje:'0.00'}} </span> |
|
</el-form-item> |
|
<el-form-item label="累计赊销金额"> |
|
<span> {{dataListChild.sxje?dataListChild.sxje:'0.00'}}</span> |
|
</el-form-item> |
|
<el-form-item label="累计消返金额"> |
|
<span>{{dataListChild.xfje?dataListChild.xfje:'0.00'}}</span> |
|
</el-form-item> |
|
</el-col> |
|
</el-form> |
|
<!-- <div> |
|
<div class="rowBalance"> |
|
<div></div> |
|
<div> |
|
<span>充值金额</span> |
|
<span>1</span> |
|
</div> |
|
<div> |
|
<span>累计充值金额</span> |
|
<span>2</span> |
|
</div> |
|
</div> |
|
<div class="rowBalance"> |
|
<div></div> |
|
<div> |
|
<span>赊销金额</span> |
|
<span>3</span> |
|
</div> |
|
<div> |
|
<span>累计赊销金额</span> |
|
<span>4</span> |
|
</div> |
|
</div> |
|
<div class="rowBalance"> |
|
<div></div> |
|
<div> |
|
<span>充返金额</span> |
|
<span>5</span> |
|
</div> |
|
<div> |
|
<span>累计充返金额</span> |
|
<span>6</span> |
|
</div> |
|
</div> |
|
<div class="rowBalance"> |
|
<div></div> |
|
<div> |
|
<span>消返金额</span> |
|
<span>7</span> |
|
</div> |
|
<div> |
|
<span>累计消返金额</span> |
|
<span>8</span> |
|
</div> |
|
</div> |
|
</div> --> |
|
</template> |
|
</el-table-column> |
|
<template v-for="(item, index) in tableColumns"> |
|
<el-table-column |
|
v-if="item.show" |
|
:key="index" |
|
:fixed="item.fixed" |
|
:align="item.align" |
|
:header-align="item.headerAlign" |
|
:show-overflow-tooltip="true" |
|
:min-width="item.minWidth" |
|
:width="item.width" |
|
:prop="item.prop" |
|
:sortable="item.sortable" |
|
:label="item.label" |
|
:formatter="item.render" |
|
/> |
|
</template> |
|
</el-table> |
|
<!-- 列表结束 --> |
|
|
|
<!-- 分页组件开始 --> |
|
<div class="page-div"> |
|
<el-pagination |
|
:current-page="page.currentPage" |
|
:page-sizes="[10, 15, 20, 30]" |
|
:page-size="page.pageSize" |
|
layout="total, sizes, prev, pager, next, jumper" |
|
:total="page.totalCount" |
|
@size-change="handleSizeChange" |
|
@current-change="handleCurrentChange" |
|
/> |
|
</div> |
|
<!-- 分页组件结束 --> |
|
</div> |
|
</ListLayout> |
|
<!-- 导出弹窗 --> |
|
<el-dialog v-el-drag-dialog title="导出" :visible.sync="outPutDialog" width="20%"> |
|
<OilSiteOilsPriceOutput :page="page" :dataPage="dataPage" v-if="outPutDialog" |
|
:multipleSelection="multipleSelection" @getByPage="getByPage" @closeDialog="closeDialog" /> |
|
</el-dialog> |
|
<!-- 详情抽屉 --> |
|
<el-drawer |
|
title="详情" |
|
:with-header="false" |
|
class="table-detail-drawer" |
|
:visible.sync="showTableDrawer" |
|
size="70%" |
|
direction="ltr" |
|
> |
|
详情抽屉 |
|
</el-drawer> |
|
</div> |
|
</div> |
|
</template> |
|
<script> |
|
import tyApi from "@/api/finance/ty"; |
|
import AreaCodeApi from "@/api/base/areaCode"; |
|
import OrderRefund from "@/api/finance/oilCompanyAccount"; |
|
import orderInfoApi from "@/api/order/orderInfo"; |
|
import payOrderApi from "@/api/pay/payOrder"; |
|
import sysCustomerInfoApi from "@/api/user/sysCustomerInfo"; |
|
import oilSiteInfoApi from "@/api/user/oilSiteInfo"; |
|
import { mapGetters } from "vuex"; |
|
import OilSiteOilsPriceOutput from "./OilSiteOilsPriceOutput.vue"; |
|
import api from "@/api/statisticalReport/companyConsumptionStatistics"; |
|
export default { |
|
filters:{ |
|
balanceType(val){ |
|
if(val||val==0){ |
|
return val |
|
}else{ |
|
return '--' |
|
} |
|
} |
|
}, |
|
components: { |
|
OilSiteOilsPriceOutput |
|
}, |
|
data() { |
|
return { |
|
dataListChild:{ |
|
// czje:0, |
|
// sxje:0, |
|
// cfje:0, |
|
// xfje:0 |
|
}, |
|
// 获取row的key值 |
|
getRowKeys(row) { |
|
return row.companyId; |
|
}, |
|
// 要展开的行，数值的元素是row的key值 |
|
expands: [], |
|
listLoading:false, |
|
output: { |
|
outputType: 4, // 导出方式，1导出选中，2导出本页，3条件导出，4导出全部 |
|
startPage: 1, // 导出开始页 |
|
endPage: 1, // 导出结束页 |
|
pageSize: 10, // 每页条数 |
|
}, |
|
tableLoading: false, |
|
siteList: [], |
|
multipleSelection: [], // 选择表格数据集合 |
|
importDialog: false, // 导入弹窗 |
|
outPutDialog: false, // 导出弹窗 |
|
showTableDrawer: false, |
|
page: { |
|
pageSize: 10, // 每页显示条数 |
|
currentPage: 1, // 默认页 |
|
params: { |
|
type : '1', |
|
btw_createTime: |
|
`${new Date( Date.parse(new Date()) - 2592000000).getFullYear()}-${new Date(Date.parse(new Date()) - 2592000000).getMonth()+1}-${new Date(Date.parse(new Date()) - 2592000000).getDate() + 1} 00:00:00~${new Date().getFullYear()}-${new Date().getMonth()+1}-${new Date().getDate()} 00:00:00` , |
|
}, // 查询参数 |
|
sorted: { |
|
balance: "desc", |
|
}, |
|
columns: [], |
|
}, |
|
tableHeight: "", |
|
filters: this.$options.filters, |
|
dataPage: { |
|
// 分页显示page |
|
pageSize: 10, // 每页显示条数 |
|
currentPage: 1, // 默认页 |
|
params: { |
|
// 查询参数 |
|
}, |
|
sorted: {}, |
|
}, |
|
tableColumns: [ |
|
{ |
|
prop: "orderSerialNumber", |
|
minWidth: 216, |
|
sortable: "custom", |
|
label: "企业名称", |
|
show: true, |
|
render: (row, column, cell) => { |
|
// 订单号查询 |
|
return ( |
|
<div> |
|
<div>{row.companyName||'--'}</div> |
|
<div>{row.companyId || "暂无数据"}</div> |
|
</div> |
|
); |
|
}, |
|
}, |
|
{ |
|
prop: "balance", |
|
minWidth: 200, |
|
sortable: "custom", |
|
label: "当前企业余额", |
|
show: true, |
|
render: (row, column, cell) => { |
|
return ( |
|
<div> |
|
<div class="column-info-container"> |
|
<span>{Number(row.balance).toFixed(2)}</span> |
|
</div> |
|
</div> |
|
); |
|
}, |
|
}, |
|
{ |
|
prop: "payRealAmount", |
|
minWidth: 120, |
|
sortable: "custom", |
|
label: "累计消费金额", |
|
show: true, |
|
render: (row, column, cell) => { |
|
return ( |
|
<div class="column-info-container"> |
|
{Number(row.payRealAmount).toFixed(2)} |
|
</div> |
|
); |
|
}, |
|
}, |
|
], |
|
updateDialog: false, // 修改弹窗 |
|
supplementDialog: false, // 补单 |
|
supplementZeYiDialog: false, // 则一补单 |
|
orderTfDialog: false, // 订单匹配 |
|
orderInfo: {}, |
|
showStatistic: false, // 是否展示统计信息 |
|
showSearch: true, // 是否展示统计信息 |
|
totalData: {}, // 总金额和总订单数 |
|
totalTypeData: [], // 个人和企业统计信息 |
|
totalChannelData: [], // 渠道统计信息 |
|
sysCustomerList: [], // 用户集合 |
|
pieColors: [ |
|
// 饼图颜色 |
|
"#fe6b45", |
|
"#ff2e3b", |
|
"#fe6a46", |
|
"#5ed65e", |
|
], |
|
sites: { |
|
XOIL: "星油", |
|
WJY: "万金油", |
|
LV: "老吕", |
|
TY: "团油", |
|
YDJY: "一点加油", |
|
}, |
|
}; |
|
}, |
|
computed: { |
|
...mapGetters(["sysUserList", "markData"]), |
|
addrCode: { |
|
get() { |
|
const arr = []; |
|
arr[0] = this.page.params.provinceCode; |
|
arr[1] = this.page.params.cityCode; |
|
arr[2] = this.page.params.areaCode; |
|
return arr; |
|
}, |
|
set(val) { |
|
this.page.params.provinceCode = val[0]; |
|
this.page.params.cityCode = val[1]; |
|
this.page.params.areaCode = val[2]; |
|
}, |
|
}, |
|
}, |
|
watch: { |
|
"page.params.btw_createTime":{ |
|
handler(n) { |
|
let time = n.split("~") || []; |
|
if (time.length !== 0) { |
|
this.page.params["dateStartTime"] = time[0]; |
|
this.page.params["dateEndTime"] = time[1]; |
|
} else { |
|
delete this.page.params["dateStartTime"]; |
|
delete this.page.params["dateEndTime"]; |
|
} |
|
}, |
|
immediate:true |
|
}, |
|
tableHeight(newValue, oldValue) { |
|
this.tableHeight = document.documentElement.clientHeight - 350; |
|
}, |
|
}, |
|
created() { |
|
this.getByPage(); |
|
this.getHeight(); |
|
// 增加监听事件，窗口变化时得到高度。 |
|
window.addEventListener("resize", this.getHeight, false); |
|
AreaCodeApi.getTree().then((res) => { |
|
this.areaTree = res.data; |
|
}); |
|
}, |
|
methods: { |
|
expandSelect(row, expandedRows) { |
|
console.log('expandedRows', expandedRows) |
|
// console.log('row', row) |
|
var that = this |
|
if (expandedRows.length) { |
|
that.expands = [] |
|
if (row) { |
|
let data = { |
|
companyId: row.companyId, |
|
dateStartTime: this.page.params["dateStartTime"], |
|
dateEndTime: this.page.params["dateEndTime"] |
|
} |
|
api.getAccountTypeByCompanyId(data).then( res =>{ |
|
if(res.data){ |
|
this.dataListChild = res.data |
|
} |
|
}) |
|
that.expands.push(row.companyId)// 每次push进去的是每行的ID |
|
} |
|
} else { |
|
that.expands = []// 默认不展开 |
|
} |
|
// console.log('that.expands', that.expands) |
|
}, |
|
clickRowHandle(row, column, event) { |
|
let data = { |
|
companyId: row.companyId, |
|
dateStartTime: this.page.params["dateStartTime"], |
|
dateEndTime: this.page.params["dateEndTime"] |
|
} |
|
api.getAccountTypeByCompanyId(data).then( res =>{ |
|
if(res.data){ |
|
this.dataListChild = res.data |
|
} |
|
console.log(res.data,'aaaaaaaaaaaaaaaaaaaaaaaaaaa') |
|
|
|
}) |
|
console.log(row, this.expands,this.dataListChild,'ssssssssssssssssssssss') |
|
if (this.expands.includes(row.companyId)) { |
|
this.expands = this.expands.filter(val => val !== row.companyId); |
|
} else { |
|
this.expands = [] |
|
this.expands.push(row.companyId); |
|
|
|
} |
|
|
|
}, |
|
RefundToBalance(row) { |
|
// 退款到余额 |
|
console.log(row.id); |
|
OrderRefund.RefundToAccount(row.id).then((res) => { |
|
console.log(res); |
|
this.getByPage(); |
|
}); |
|
}, |
|
ManualCheck(row) { |
|
console.log(row); |
|
payOrderApi.CheckList(row).then((res) => { |
|
if (res.code === 20000) { |
|
this.search(); |
|
} |
|
console.log(res); |
|
}); |
|
}, |
|
searchUserInfo(info) { |
|
if (info && info !== "") { |
|
sysCustomerInfoApi.searchInfo(info).then((res) => { |
|
this.sysCustomerList = res.data; |
|
}); |
|
} |
|
}, |
|
// 远程搜索主油站 |
|
getSimpleOilSiteInfo(siteName) { |
|
if (siteName) { |
|
const oilSiteInfo = {}; |
|
oilSiteInfo.siteName = siteName; |
|
oilSiteInfoApi.getSimpleOilSiteInfo(oilSiteInfo).then((res) => { |
|
this.siteList = res.data; |
|
}); |
|
} else { |
|
this.sites = []; |
|
} |
|
}, |
|
indexMethod(index) { |
|
return (index + 1) * 1; |
|
}, |
|
handleSelectionChange(val) { |
|
// 选择表格数据 |
|
this.multipleSelection = val; |
|
}, |
|
toForbid() { |
|
// 禁用 |
|
if (!this.multipleSelection || this.multipleSelection.length < 1) { |
|
this.$message.error("请选择需要操作的数据"); |
|
return; |
|
} |
|
}, |
|
toStartUsing() { |
|
// 启用 |
|
if (!this.multipleSelection || this.multipleSelection.length < 1) { |
|
this.$message.error("请选择需要操作的数据"); |
|
return; |
|
} |
|
}, |
|
changeEditor(row, r) { |
|
// 修改是否允许修改标识 |
|
this.$set(row, "editor", true); |
|
this.$nextTick(() => { |
|
console.log(this.$refs[r]); |
|
this.$refs[r].focus(); |
|
}); |
|
}, |
|
changeRowPlate(row) { |
|
// 修改车牌号 |
|
row.accountCardCode = null; |
|
orderInfoApi.update(row).then((res) => { |
|
this.$message.success(res.msg); |
|
this.$set(row, "editor", false); |
|
}); |
|
}, |
|
toSupplement() { |
|
// 补单 |
|
this.supplementDialog = true; |
|
}, |
|
toSupplementZeYi() { |
|
// 则一补单 |
|
this.supplementZeYiDialog = true; |
|
}, |
|
toOrderTf() { |
|
// 订单匹配 |
|
this.orderTfDialog = true; |
|
}, |
|
toOutPut() { |
|
// 导出 |
|
this.outPutDialog = true; |
|
}, |
|
formatJson(filterVal, jsonData) { |
|
// 处理数据 |
|
console.log("filterVal：" + JSON.stringify(filterVal)); |
|
console.log("jsonData：" + JSON.stringify(jsonData)); |
|
return jsonData.map((v) => |
|
filterVal.map((j) => { |
|
if (j.indexOf(".") < 0) { |
|
return v[j]; |
|
} |
|
const keyArr = j.split("."); |
|
let data = v[keyArr[0]]; |
|
for (var i = 1; i < keyArr.length; i++) { |
|
if (data) { |
|
data = data[keyArr[i]]; |
|
} |
|
} |
|
return data; |
|
}) |
|
); |
|
}, |
|
async outputData() { |
|
// 导出数据 |
|
// orderInfoApi.exportDispatchWeb().then(res=>{ |
|
// console.log(res,'outputData') |
|
// }); |
|
let tmpData = []; |
|
const status = this.output.outputType; |
|
if (status === 1) { |
|
tmpData = this.multipleSelection; |
|
} else if (status === 2) { |
|
tmpData = this.dataPage.list; |
|
} else if (status === 3) { |
|
const endIndex = |
|
(parseInt(this.output.endPage) + |
|
1 - |
|
parseInt(this.output.startPage)) * |
|
parseInt(this.output.pageSize); |
|
const searchParam = { ...this.page }; |
|
searchParam.pageSize = endIndex; |
|
searchParam.currentPage = this.output.startPage; |
|
const res = await orderInfoApi.getByPage(searchParam); |
|
tmpData = res.data.list; |
|
} else if (status === 4) { |
|
const endIndex = |
|
(parseInt(this.output.endPage) + |
|
1 - |
|
parseInt(this.output.startPage)) * |
|
parseInt(this.output.pageSize); |
|
const searchParam = { ...this.page }; |
|
searchParam.pageSize = endIndex; |
|
searchParam.currentPage = this.output.startPage; |
|
searchParam.params.null_convertRelationOrderId = true; |
|
searchParam.params.payAccountType = 0; |
|
console.time(); |
|
orderInfoApi.exportDispatchWeb(searchParam).then((res) => { |
|
this.tableHeight = this.tableHeight + this.sHeight; |
|
// console.log("123") |
|
// console.log(res) |
|
const link = document.createElement("a"); |
|
// 创建Blob对象，设置文件类型 |
|
const blob = new Blob([res], { type: "application/vnd.ns-excel" }); // MIME类型 |
|
link.href = URL.createObjectURL(blob); // 创建URL |
|
link.setAttribute("download", decodeURI(Date.now() + ".xlsx")); // 设置下载文件名称 |
|
link.click(); // 下载文件 |
|
document.body.appendChild(link); |
|
console.timeEnd(); |
|
this.$message.success("导出成功"); |
|
URL.revokeObjectURL(link.href); // 释放内存 |
|
}); |
|
} else { |
|
const cs = await orderInfoApi.getCount(); |
|
const dataCount = cs.data; |
|
const searchParam = { |
|
currentPage: 1, |
|
pageSize: dataCount, |
|
}; |
|
const res = await orderInfoApi.getByPage(searchParam); |
|
tmpData = res.data.list; |
|
} |
|
// const orderStatusObj = { |
|
// '0': '待支付', |
|
// '1': '已支付', |
|
// '-1': '支付失败', |
|
// '2': '已取消', |
|
// '3': '已退款' |
|
// } |
|
// const payAccountTypeObj = { |
|
// '0': '个人账户', |
|
// '1': '企业账户' |
|
// } |
|
// tmpData.forEach(e => { |
|
// const orderStatus = e.orderStatus |
|
// e.orderStatusText = orderStatusObj[orderStatus + ''] |
|
// const payAccountType = e.payAccountType |
|
// e.payAccountTypeText = payAccountTypeObj[payAccountType + ''] |
|
// }) |
|
|
|
// import('@/vendor/Export2Excel').then(excel => { |
|
// const data = this.formatJson(this.valColumn, tmpData) |
|
// excel.export_json_to_excel({ |
|
// header: this.headers, |
|
// data: data, |
|
// autoWidth: true, |
|
// bookType: 'xlsx' |
|
// }) |
|
// }) |
|
}, |
|
handleDetail(id) { |
|
// 查看行 详情 |
|
orderInfoApi.getInfo(id).then((res) => { |
|
this.orderInfo = res.data; |
|
this.showTableDrawer = true; |
|
}); |
|
}, |
|
handleDetailBySerialNumber(id) { |
|
// 查看行 详情 |
|
orderInfoApi.getInfoBySerialNumber(id).then((res) => { |
|
this.orderInfo = res.data; |
|
this.showTableDrawer = true; |
|
}); |
|
}, |
|
getHeight() { |
|
// 获取浏览器高度并计算得到表格所用高度。 |
|
this.tableHeight = |
|
document.documentElement.clientHeight - 350; |
|
}, |
|
search() { |
|
// 搜索 |
|
this.page.currentPage = 1; |
|
this.getByPage(); |
|
}, |
|
toggleSearchAdvance() { |
|
this.searchAdvice = !this.searchAdvice; |
|
}, |
|
handleSizeChange(val) { |
|
this.page.pageSize = val; |
|
this.getByPage(); |
|
}, |
|
handleCurrentChange(val) { |
|
this.page.currentPage = val; |
|
this.getByPage(); |
|
}, |
|
sortHandler(column) { |
|
// 排序查询 |
|
console.log(column); |
|
const key = column.prop; |
|
const value = column.order; |
|
this.page.sorted = {}; |
|
this.page.sorted[key] = value; |
|
this.getByPage(); |
|
}, |
|
toUpdate(id) { |
|
// 跳转到更新 |
|
orderInfoApi.get(id).then((res) => { |
|
this.orderInfo = res.data; |
|
this.updateDialog = true; |
|
}); |
|
}, |
|
toTYRefund(row) { |
|
// 团油退款 |
|
this.$confirm( |
|
` |
|
您确定要对该团油订单进行退款?当前退款人为[<span style="color:red">${row.oilCustomerInfo.name}</span>]。<br/> |
|
退款人手机号[<span style="color: red">${row.oilCustomerInfo.phone}</span>]， |
|
退款金额[<span style="color: red">${row.payRealAmount}</span>]元<br/> |
|
`, |
|
|
|
"提示", |
|
{ type: "info", dangerouslyUseHTMLString: true } |
|
).then(() => { |
|
tyApi.refund(row.id).then((res) => { |
|
this.$message.success(res.msg); |
|
this.getByPage(); |
|
}); |
|
}); |
|
}, |
|
toRefund(row) { |
|
// 星油退款 |
|
this.$confirm( |
|
` |
|
您确定要对该星油订单进行退款?当前退款人为[<span style="color:red">${row.oilCustomerInfo.name}</span>]。<br/> |
|
退款人手机号[<span style="color: red">${row.oilCustomerInfo.phone}</span>]， |
|
退款金额[<span style="color: red">${row.payRealAmount}</span>]元<br/> |
|
`, |
|
|
|
"提示", |
|
{ type: "info", dangerouslyUseHTMLString: true } |
|
).then(() => { |
|
if (row.openStatus == 1) { |
|
console.log(row); |
|
orderInfoApi.refundByOpenStatus(row).then((res) => { |
|
this.$message.success(res.msg); |
|
this.getByPage(); |
|
}); |
|
} else { |
|
orderInfoApi.refund(row.id).then((res) => { |
|
this.$message.success(res.msg); |
|
this.getByPage(); |
|
}); |
|
} |
|
}); |
|
}, |
|
toTongLianRefund(row) { |
|
console.log(row.id); |
|
// 通联退款 |
|
this.$confirm( |
|
` |
|
您确定要对该星油订单进行退款?当前退款人为[<span style="color:red">${row.oilCustomerInfo.name}</span>]。<br/> |
|
退款人手机号[<span style="color: red">${row.oilCustomerInfo.phone}</span>]， |
|
退款金额[<span style="color: red">${row.payRealAmount}</span>]元<br/> |
|
`, |
|
|
|
"提示", |
|
{ type: "info", dangerouslyUseHTMLString: true } |
|
).then(() => { |
|
if (row.openStatus == 1) { |
|
console.log(row); |
|
orderInfoApi.refundByOpenStatus(row).then((res) => { |
|
this.$message.success(res.msg); |
|
this.getByPage(); |
|
}); |
|
} else { |
|
orderInfoApi.refund(row.id).then((res) => { |
|
this.$message.success(res.msg); |
|
this.getByPage(); |
|
}); |
|
} |
|
}); |
|
}, |
|
toCancelOrder(row) { |
|
// 则一退款 |
|
this.$confirm( |
|
` |
|
您确定要对该则一订单进行退款?当前退款人为[<span style="color:red">${row.oilCustomerInfo.name}</span>]。<br/> |
|
退款人手机号[<span style="color: red">${row.oilCustomerInfo.phone}</span>]， |
|
退款金额[<span style="color: red">${row.payRealAmount}</span>]元<br/> |
|
`, |
|
|
|
"提示", |
|
{ type: "info", dangerouslyUseHTMLString: true } |
|
).then(() => { |
|
oilSiteInfoApi.cancelOrder(row.id).then((res) => { |
|
this.$message.success(res.msg); |
|
this.getByPage(); |
|
}); |
|
}); |
|
}, |
|
// 微信退款 |
|
wechartRefund(row) { |
|
this.$confirm( |
|
` |
|
您确定要对该订单进行退款?当前退款人为[<span style="color:red">${row.oilCustomerInfo.name}</span>]。<br/> |
|
退款人手机号[<span style="color: red">${row.oilCustomerInfo.phone}</span>]， |
|
退款金额[<span style="color: red">${row.payRealAmount}</span>]元<br/> |
|
`, |
|
"提示", |
|
{ type: "info", dangerouslyUseHTMLString: true } |
|
).then(() => { |
|
this.tableLoading = true; |
|
OrderRefund.wechatPayRefund({ |
|
orderNum: row.orderSerialNumber, |
|
}).then((res) => { |
|
try { |
|
if (res.code === 20000) { |
|
this.$message.success("退款已发起，请稍后刷新列表查看"); |
|
this.getByPage(); |
|
} else { |
|
this.$message.error(res.msg); |
|
} |
|
} finally { |
|
this.tableLoading = false; |
|
} |
|
}); |
|
}); |
|
}, |
|
toDelete(id) { |
|
// 删除 |
|
this.$confirm("确定删除?", "提示", { type: "error" }).then(() => { |
|
orderInfoApi.deleteById(id).then((res) => { |
|
this.$message.success(res.msg); |
|
this.getByPage(); |
|
}); |
|
}); |
|
}, |
|
getByPage() { |
|
// 分页查询 |
|
this.listLoading = true |
|
this.addDialog = false; |
|
this.page.params.eq_payAccountType = 0; |
|
api.getStatisticalReportByPage(this.page).then((res) => { |
|
this.dataPage = res.data; |
|
this.page.totalCount = this.dataPage.totalCount; |
|
this.page.totalPage = this.dataPage.totalPage; |
|
this.listLoading = false |
|
}).catch(err=>{ |
|
this.listLoading = false |
|
}) |
|
// this.getStatisticData() |
|
}, |
|
getStatisticData() { |
|
// 查询统计信息 |
|
orderInfoApi.statisticOrderTotalData(this.page).then((res) => { |
|
this.totalData = res.data ? res.data : {}; |
|
}); |
|
orderInfoApi.statisticOrderTotalDataByType(this.page).then((res) => { |
|
this.totalTypeData = res.data; |
|
}); |
|
orderInfoApi.statisticOrderTotalDataByChannel(this.page).then((res) => { |
|
this.totalChannelData = res.data; |
|
}); |
|
}, |
|
closeDialog() { |
|
this.addDialog = false; |
|
this.updateDialog = false; |
|
this.supplementDialog = false; |
|
this.supplementZeYiDialog = false; |
|
this.outPutDialog = false; // 导出弹窗 |
|
this.orderTfDialog = false; |
|
}, |
|
}, |
|
}; |
|
</script> |
|
<style lang="scss" scoped> |
|
::v-deep { |
|
.demo-table-expand .el-form-item { |
|
margin-right: 0; |
|
margin-bottom: 0; |
|
width: auto; |
|
} |
|
.demo-table-expand .el-form-item__label{ |
|
color: #999; |
|
width: auto; |
|
} |
|
} |
|
>>> .foot-page { |
|
margin-top: 0px !important; |
|
} |
|
.statistic-container { |
|
display: flex; |
|
flex-direction: column; |
|
text-align: left; |
|
background-color: #3595f8; |
|
margin-top: 20px; |
|
color: #fff; |
|
|
|
.statictic-item { |
|
display: flex; |
|
height: 100px; |
|
justify-content: space-between; |
|
align-items: center; |
|
margin: 15px 0; |
|
|
|
.left-count { |
|
width: 16%; |
|
display: flex; |
|
flex-direction: column; |
|
justify-content: center; |
|
align-items: center; |
|
|
|
.count { |
|
font-size: 34px; |
|
font-weight: bold; |
|
} |
|
|
|
.text { |
|
font-size: 14px; |
|
margin-top: 5px; |
|
} |
|
} |
|
|
|
.right-container { |
|
width: 84%; |
|
height: 100%; |
|
display: flex; |
|
justify-content: start; |
|
align-items: center; |
|
|
|
.right-item { |
|
width: 25%; |
|
height: 100%; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
|
|
.pie-table { |
|
margin-right: 15px; |
|
background-color: #fff; |
|
width: 100px; |
|
height: 100px; |
|
border-radius: 50%; |
|
color: #33334d; |
|
display: flex; |
|
justify-content: center; |
|
align-items: center; |
|
} |
|
|
|
.statis-info { |
|
font-size: 14px; |
|
font-weight: bold; |
|
display: flex; |
|
height: 100%; |
|
flex-direction: column; |
|
justify-content: space-evenly; |
|
} |
|
} |
|
} |
|
} |
|
} |
|
</style> |
|
<style scoped> |
|
/* >>> .el-table{ |
|
display: flex !important; |
|
flex-direction: column !important; |
|
} */ |
|
.column-info-container { |
|
display: flex; |
|
align-items: center; |
|
} |
|
|
|
.column-info-icon { |
|
color: #4988fd; |
|
margin-right: 10px; |
|
} |
|
|
|
.column-info-icon .icon { |
|
width: 20px; |
|
height: 20px; |
|
} |
|
|
|
.column-info-content { |
|
font-size: 12px; |
|
} |
|
|
|
.handle-button-group { |
|
margin-bottom: 10px; |
|
} |
|
|
|
.supplement-header { |
|
display: flex; |
|
line-height: 2.5rem; |
|
color: #000; |
|
} |
|
|
|
.supplement-header img { |
|
background-size: cover; |
|
width: 2.5rem; |
|
margin-right: 0.8rem; |
|
} |
|
</style> |
|
<style> |
|
.styleTime .el-date-editor { |
|
width: 424px !important; |
|
} |
|
|
|
.table-header .table-list { |
|
/* max-height: 100% !important; */ |
|
} |
|
.rowBalance{ |
|
display: flex; |
|
} |
|
</style>
|
|
|