1090 lines
33 KiB
Vue
1090 lines
33 KiB
Vue
<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>
|