|
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="table-header table-div el-scrollbar">
|
|
|
|
|
<ListLayout :table-columns="tableColumns">
|
|
|
|
|
<div slot="search" ref="searchHeight" 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-select v-model="page.params.companyId" clearable filterable remote reserve-keyword placeholder="企业名称"
|
|
|
|
|
:remote-method="companyRemoteMethod" @keyup.enter.native="getByPage">
|
|
|
|
|
<el-option v-for="item in queryCompanyList" :key="item.id" :label="item.name" :value="item.id" />
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="page.params.customerId"
|
|
|
|
|
filterable
|
|
|
|
|
remote
|
|
|
|
|
reserve-keyword
|
|
|
|
|
clearable
|
|
|
|
|
placeholder="请输入司机编号/姓名/手机号码"
|
|
|
|
|
:remote-method="searchUserInfo"
|
|
|
|
|
>
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in sysCustomerList"
|
|
|
|
|
:key="item.id"
|
|
|
|
|
:label="item.userName"
|
|
|
|
|
:value="item.id"
|
|
|
|
|
>
|
|
|
|
|
{{ item.id }}--{{ item.userName }}--{{ item.phone }}
|
|
|
|
|
</el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-input
|
|
|
|
|
v-model="page.params.siteName"
|
|
|
|
|
placeholder="请输入油站名称"
|
|
|
|
|
clearable
|
|
|
|
|
@keyup.enter.native="getByPage"
|
|
|
|
|
/>
|
|
|
|
|
<!-- <el-select
|
|
|
|
|
v-model="page.params.siteId"
|
|
|
|
|
style="width:100%"
|
|
|
|
|
filterable
|
|
|
|
|
remote
|
|
|
|
|
clear
|
|
|
|
|
clearable
|
|
|
|
|
reserve-keyword
|
|
|
|
|
placeholder="油站名称"
|
|
|
|
|
:remote-method="getSimpleOilSiteInfo"
|
|
|
|
|
>
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in siteList"
|
|
|
|
|
:key="item.id"
|
|
|
|
|
:label="item.siteName"
|
|
|
|
|
:value="item.id"
|
|
|
|
|
/>
|
|
|
|
|
</el-select> -->
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<!-- <el-form-item>
|
|
|
|
|
<el-select v-model="page.params.payChannel" placeholder="支付渠道" clearable>
|
|
|
|
|
<el-option value="BALANCE_PAYMENT" label="余额支付" />
|
|
|
|
|
<el-option value="WECHAT_MINIAPPS_PAYMENT" label="微信小程序支付" />
|
|
|
|
|
<el-option value="WECHAT_OFFICIAL_ACCOUNT_PAYMENT" label="微信公众号支付" />
|
|
|
|
|
<el-option value="WECHAT_SCANNING_PAYMENT" label="微信扫码支付" />
|
|
|
|
|
<el-option value="WECHAT_APP_PAYMENT" label="微信APP支付" />
|
|
|
|
|
<el-option value="ALIPAY_MINIAPPS_PAYMENT" label="支付宝小程序支付" />
|
|
|
|
|
<el-option value="ALIPAY_OFFICIAL_ACCOUNT_PAYMENT" label="支付宝公众号支付" />
|
|
|
|
|
<el-option value="ALIPAY_SCANNING_PAYMENT" label="支付宝扫码支付" />
|
|
|
|
|
<el-option value="ALIPAY_APP_PAYMENT" label="支付宝APP支付" />
|
|
|
|
|
<el-option value="FFLINE_PAYMENT" label="线下支付" />
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item> -->
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="page.params.orderStatus"
|
|
|
|
|
placeholder="订单状态"
|
|
|
|
|
clearable
|
|
|
|
|
>
|
|
|
|
|
<el-option label="支付失败" value="-1" />
|
|
|
|
|
<el-option label="支付中" value="0" />
|
|
|
|
|
<el-option label="支付成功" value="1" />
|
|
|
|
|
<el-option label="已取消" value="2" />
|
|
|
|
|
<el-option label="已退款" value="3" />
|
|
|
|
|
<el-option label="退款中" value="4" />
|
|
|
|
|
<el-option label="退款失败" value="5" />
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<!-- <el-form-item>
|
|
|
|
|
<el-radio-group v-model="page.params.payAccountType">
|
|
|
|
|
<el-radio-button :label="0">
|
|
|
|
|
<svg-icon icon-class="iconsiji1" /> 个人账户
|
|
|
|
|
</el-radio-button>
|
|
|
|
|
<el-radio-button :label="1">
|
|
|
|
|
<svg-icon icon-class="icongongsi-" /> 企业账户
|
|
|
|
|
</el-radio-button>
|
|
|
|
|
</el-radio-group>
|
|
|
|
|
</el-form-item> -->
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-input
|
|
|
|
|
v-model="page.params.orderSerialNumber"
|
|
|
|
|
placeholder="输入订单号准确搜索"
|
|
|
|
|
clearable
|
|
|
|
|
@keyup.enter.native="getByPage"
|
|
|
|
|
/>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<gl-date-time-picker
|
|
|
|
|
style="width: 424px"
|
|
|
|
|
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="12" class="tal">
|
|
|
|
|
<el-button
|
|
|
|
|
class="group-item"
|
|
|
|
|
:size="$store.getters.size"
|
|
|
|
|
type="primary"
|
|
|
|
|
@click="toOrderTf"
|
|
|
|
|
><svg-icon icon-class="iconxinzeng" />订单匹配</el-button
|
|
|
|
|
>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="12">
|
|
|
|
|
<!-- <el-button
|
|
|
|
|
type="text"
|
|
|
|
|
:size="$store.getters.size"
|
|
|
|
|
:icon="showSearch?'el-icon-arrow-up':'el-icon-arrow-down'"
|
|
|
|
|
@click="showSearch = !showSearch"
|
|
|
|
|
>{{ showStatistic?'隐藏搜索':'展开搜索' }}</el-button> -->
|
|
|
|
|
<!-- <el-button
|
|
|
|
|
type="text"
|
|
|
|
|
:size="$store.getters.size"
|
|
|
|
|
:icon="showStatistic?'el-icon-arrow-up':'el-icon-arrow-down'"
|
|
|
|
|
@click="showStatistic = !showStatistic"
|
|
|
|
|
>{{ showStatistic?'折叠':'展开' }}</el-button> -->
|
|
|
|
|
<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 = {}"
|
|
|
|
|
>重置</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
|
|
|
|
|
stripe
|
|
|
|
|
:data="dataPage.list"
|
|
|
|
|
fit
|
|
|
|
|
:max-height="tableHeight"
|
|
|
|
|
style="width: 100%"
|
|
|
|
|
:size="$store.getters.size"
|
|
|
|
|
@sort-change="sortHandler"
|
|
|
|
|
@selection-change="handleSelectionChange"
|
|
|
|
|
>
|
|
|
|
|
<el-table-column type="selection" width="55" />
|
|
|
|
|
<el-table-column label="序号" type="index" :index="indexMethod" />
|
|
|
|
|
<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-column fixed="right" label="操作" width="150px">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-button
|
|
|
|
|
:size="$store.getters.size"
|
|
|
|
|
type="text"
|
|
|
|
|
@click="handleDetail(scope.row.id)"
|
|
|
|
|
><svg-icon icon-class="iconxiangqing1" /> 详情</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-dropdown>
|
|
|
|
|
<el-button type="text">
|
|
|
|
|
更多<i class="el-icon-arrow-down el-icon--right" />
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-dropdown-menu slot="dropdown">
|
|
|
|
|
<!-- <el-dropdown-item
|
|
|
|
|
@click.native="toUpdate(scope.row.id)"
|
|
|
|
|
>
|
|
|
|
|
<el-button
|
|
|
|
|
:size="$store.getters.size"
|
|
|
|
|
type="text"
|
|
|
|
|
><svg-icon icon-class="iconicon-" /> 编辑</el-button>
|
|
|
|
|
</el-dropdown-item> -->
|
|
|
|
|
|
|
|
|
|
<el-dropdown-item @click.native="toTFRefund(scope.row)">
|
|
|
|
|
<el-button
|
|
|
|
|
v-if="
|
|
|
|
|
scope.row.orderType == 'REAL_ORDER' &&
|
|
|
|
|
scope.row.orderStatus == 1 &&
|
|
|
|
|
scope.row.convertCompanyCode == 1 &&
|
|
|
|
|
scope.row.convertStatus == 1
|
|
|
|
|
"
|
|
|
|
|
:size="$store.getters.size"
|
|
|
|
|
type="text"
|
|
|
|
|
><svg-icon icon-class="iconlajitong" />
|
|
|
|
|
转换单退款</el-button
|
|
|
|
|
>
|
|
|
|
|
</el-dropdown-item>
|
|
|
|
|
|
|
|
|
|
<el-dropdown-item @click.native="toRefund(scope.row)">
|
|
|
|
|
<el-button
|
|
|
|
|
v-if="
|
|
|
|
|
scope.row.orderType == 'REAL_ORDER' &&
|
|
|
|
|
scope.row.orderStatus == 1 &&
|
|
|
|
|
scope.row.createSource != 'ZEYI' &&
|
|
|
|
|
scope.row.createSource != 'TY' &&
|
|
|
|
|
scope.row.createSource != 'WJY' &&
|
|
|
|
|
scope.row.convertCompanyCode != 1 &&
|
|
|
|
|
scope.row.createSource != 'QIAOPAI' &&
|
|
|
|
|
scope.row.createSource != 'RIRISHUN' &&
|
|
|
|
|
(scope.row.payChannel == 'BALANCE_PAYMENT' ||
|
|
|
|
|
scope.row.payChannel == 'WECHAT_MINIAPPS_PAYMENT' ||
|
|
|
|
|
scope.row.payChannel == 'WECHAT_APP_PAYMENT')
|
|
|
|
|
"
|
|
|
|
|
:size="$store.getters.size"
|
|
|
|
|
type="text"
|
|
|
|
|
><svg-icon icon-class="iconlajitong" />
|
|
|
|
|
星油退款</el-button
|
|
|
|
|
>
|
|
|
|
|
</el-dropdown-item>
|
|
|
|
|
|
|
|
|
|
<el-dropdown-item @click.native="toCancelOrder(scope.row)">
|
|
|
|
|
<el-button
|
|
|
|
|
v-if="
|
|
|
|
|
scope.row.orderType == 'REAL_ORDER' &&
|
|
|
|
|
scope.row.orderStatus == 1 &&
|
|
|
|
|
scope.row.createSource === 'ZEYI' &&
|
|
|
|
|
scope.row.payChannel == 'BALANCE_PAYMENT' &&
|
|
|
|
|
scope.row.suppleMark == 0
|
|
|
|
|
"
|
|
|
|
|
:size="$store.getters.size"
|
|
|
|
|
type="text"
|
|
|
|
|
><svg-icon icon-class="iconlajitong" />
|
|
|
|
|
则一退款</el-button
|
|
|
|
|
>
|
|
|
|
|
</el-dropdown-item>
|
|
|
|
|
|
|
|
|
|
<el-dropdown-item @click.native="toTYRefund(scope.row)">
|
|
|
|
|
<el-button
|
|
|
|
|
v-if="
|
|
|
|
|
scope.row.orderType == 'REAL_ORDER' &&
|
|
|
|
|
scope.row.orderStatus == 1 &&
|
|
|
|
|
scope.row.createSource === 'TY' &&
|
|
|
|
|
scope.row.payChannel == 'BALANCE_PAYMENT' &&
|
|
|
|
|
scope.row.suppleMark == 0
|
|
|
|
|
"
|
|
|
|
|
:size="$store.getters.size"
|
|
|
|
|
type="text"
|
|
|
|
|
><svg-icon icon-class="iconlajitong" />
|
|
|
|
|
团油退款</el-button
|
|
|
|
|
>
|
|
|
|
|
</el-dropdown-item>
|
|
|
|
|
|
|
|
|
|
<el-dropdown-item @click.native="toDelete(scope.row.id)">
|
|
|
|
|
<!-- <el-button
|
|
|
|
|
:size="$store.getters.size"
|
|
|
|
|
type="text"
|
|
|
|
|
><svg-icon icon-class="iconlajitong" /> 删除</el-button> -->
|
|
|
|
|
</el-dropdown-item>
|
|
|
|
|
</el-dropdown-menu>
|
|
|
|
|
</el-dropdown>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</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-drawer
|
|
|
|
|
v-el-drag-dialog
|
|
|
|
|
direction="ltr"
|
|
|
|
|
:visible.sync="supplementDialog"
|
|
|
|
|
size="60%"
|
|
|
|
|
>
|
|
|
|
|
<div slot="title" class="supplement-header">
|
|
|
|
|
<div class="icon">
|
|
|
|
|
<img
|
|
|
|
|
src="https://publicxingyou.oss-cn-hangzhou.aliyuncs.com/other/2021-4/a1eddda6dfde405a9a40da30af96eda5.png"
|
|
|
|
|
alt=""
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div>补单</div>
|
|
|
|
|
</div>
|
|
|
|
|
<OrderInfoSupplement
|
|
|
|
|
@getByPage="getByPage"
|
|
|
|
|
@closeDialog="closeDialog"
|
|
|
|
|
/>
|
|
|
|
|
</el-drawer>
|
|
|
|
|
<!-- 则一补单弹窗 -->
|
|
|
|
|
<el-drawer
|
|
|
|
|
v-el-drag-dialog
|
|
|
|
|
direction="ltr"
|
|
|
|
|
:visible.sync="supplementZeYiDialog"
|
|
|
|
|
size="60%"
|
|
|
|
|
>
|
|
|
|
|
<div slot="title" class="supplement-header">
|
|
|
|
|
<div class="icon">
|
|
|
|
|
<img
|
|
|
|
|
src="https://publicxingyou.oss-cn-hangzhou.aliyuncs.com/other/2021-4/a1eddda6dfde405a9a40da30af96eda5.png"
|
|
|
|
|
alt=""
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div>三方补单</div>
|
|
|
|
|
</div>
|
|
|
|
|
<OrderInfoZeYiSupplement
|
|
|
|
|
@getByPage="getByPage"
|
|
|
|
|
@closeDialog="closeDialog"
|
|
|
|
|
/>
|
|
|
|
|
</el-drawer>
|
|
|
|
|
|
|
|
|
|
<!-- 添加弹窗 -->
|
|
|
|
|
<el-dialog
|
|
|
|
|
v-el-drag-dialog
|
|
|
|
|
title="添加"
|
|
|
|
|
:visible.sync="addDialog"
|
|
|
|
|
width="55%"
|
|
|
|
|
>
|
|
|
|
|
<OrderInfoAdd @getByPage="getByPage" @closeDialog="closeDialog" />
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
<!-- 订单匹配弹窗 -->
|
|
|
|
|
<el-drawer
|
|
|
|
|
v-el-drag-dialog
|
|
|
|
|
direction="ltr"
|
|
|
|
|
title="订单匹配"
|
|
|
|
|
:visible.sync="orderTfDialog"
|
|
|
|
|
size="60%"
|
|
|
|
|
>
|
|
|
|
|
<OrderTfAdd
|
|
|
|
|
v-if="orderTfDialog"
|
|
|
|
|
@getByPage="getByPage"
|
|
|
|
|
@closeDialog="closeDialog"
|
|
|
|
|
/>
|
|
|
|
|
</el-drawer>
|
|
|
|
|
|
|
|
|
|
<!-- 导出弹窗 -->
|
|
|
|
|
<!-- <el-dialog
|
|
|
|
|
v-el-drag-dialog
|
|
|
|
|
title="导出"
|
|
|
|
|
:visible.sync="outPutDialog"
|
|
|
|
|
width="55%"
|
|
|
|
|
>
|
|
|
|
|
<OrderInfoOutput @getByPage="getByPage" @closeDialog="closeDialog" />
|
|
|
|
|
</el-dialog> -->
|
|
|
|
|
|
|
|
|
|
<el-dialog
|
|
|
|
|
v-el-drag-dialog
|
|
|
|
|
title="导出"
|
|
|
|
|
:visible.sync="outPutDialog"
|
|
|
|
|
width="20%"
|
|
|
|
|
>
|
|
|
|
|
<el-form label-width="75px" size="small">
|
|
|
|
|
<el-row>
|
|
|
|
|
<el-col :span="24">
|
|
|
|
|
<el-form-item label="导出方式">
|
|
|
|
|
<el-select v-model="output.outputType" style="width: 100%">
|
|
|
|
|
<el-option label="导出选中" :value="1" />
|
|
|
|
|
<el-option label="导出本页" :value="2" />
|
|
|
|
|
<el-option label="条件导出" :value="3" />
|
|
|
|
|
<!-- <el-option label="导出全部" :value="4" /> -->
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="24">
|
|
|
|
|
<el-form-item v-if="output.outputType !== 4">
|
|
|
|
|
<div style="color: red">
|
|
|
|
|
<span v-if="output.outputType === 1"
|
|
|
|
|
>当前选中数据 {{ multipleSelection.length }} 条</span
|
|
|
|
|
>
|
|
|
|
|
<span v-if="output.outputType === 2"
|
|
|
|
|
>本页数据 {{ dataPage.list.length }} 条</span
|
|
|
|
|
>
|
|
|
|
|
<span v-if="output.outputType === 3"
|
|
|
|
|
>条件导出将直接使用页面搜索条件进行数据过滤</span
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col v-if="output.outputType === 3" :span="12">
|
|
|
|
|
<el-form-item label="开始页">
|
|
|
|
|
<el-input v-model="output.startPage" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col v-if="output.outputType === 3" :span="12">
|
|
|
|
|
<el-form-item label="结束页">
|
|
|
|
|
<el-input v-model="output.endPage" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="24">
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-button type="primary" @click="outputData">导出</el-button>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-row>
|
|
|
|
|
</el-form>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
<!-- 导入弹窗 -->
|
|
|
|
|
<el-dialog
|
|
|
|
|
v-el-drag-dialog
|
|
|
|
|
title="导入"
|
|
|
|
|
:visible.sync="importDialog"
|
|
|
|
|
width="55%"
|
|
|
|
|
>
|
|
|
|
|
<OrderInfoImport @getByPage="getByPage" @closeDialog="closeDialog" />
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
<!-- 修改弹窗 -->
|
|
|
|
|
<el-dialog
|
|
|
|
|
v-el-drag-dialog
|
|
|
|
|
title="修改"
|
|
|
|
|
:visible.sync="updateDialog"
|
|
|
|
|
width="55%"
|
|
|
|
|
>
|
|
|
|
|
<OrderInfoUpdate
|
|
|
|
|
:order-info="orderInfo"
|
|
|
|
|
@getByPage="getByPage"
|
|
|
|
|
@closeDialog="closeDialog"
|
|
|
|
|
/>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
<!-- 详情抽屉 -->
|
|
|
|
|
<el-drawer
|
|
|
|
|
title="详情"
|
|
|
|
|
:with-header="false"
|
|
|
|
|
class="table-detail-drawer"
|
|
|
|
|
:visible.sync="showTableDrawer"
|
|
|
|
|
size="70%"
|
|
|
|
|
direction="ltr"
|
|
|
|
|
>
|
|
|
|
|
<OrderInfoInfo :order-info="orderInfo" />
|
|
|
|
|
</el-drawer>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<script>
|
|
|
|
|
import tyApi from "@/api/finance/ty";
|
|
|
|
|
import OrderTfAdd from "./OrderTfAdd";
|
|
|
|
|
import orderInfoApi from "@/api/order/orderInfo";
|
|
|
|
|
import sysCustomerInfoApi from "@/api/user/sysCustomerInfo";
|
|
|
|
|
import oilSiteInfoApi from "@/api/user/oilSiteInfo";
|
|
|
|
|
import OrderInfoAdd from "./OrderInfoAdd";
|
|
|
|
|
import OrderInfoUpdate from "./OrderInfoUpdate";
|
|
|
|
|
import OrderInfoInfo from "./OrderInfoInfo";
|
|
|
|
|
import OrderInfoImport from "./OrderInfoImport";
|
|
|
|
|
import OrderInfoSupplement from "./OrderInfoSupplement";
|
|
|
|
|
import OrderInfoZeYiSupplement from "./OrderInfoZeYiSupplement";
|
|
|
|
|
import rippleChart from "@/views/dashboard/admin/components/RippleChart";
|
|
|
|
|
import oilCompanyInfoApi from "@/api/user/oilCompanyInfo";
|
|
|
|
|
import { mapGetters } from "vuex";
|
|
|
|
|
export default {
|
|
|
|
|
components: {
|
|
|
|
|
OrderInfoAdd,
|
|
|
|
|
OrderTfAdd,
|
|
|
|
|
OrderInfoUpdate,
|
|
|
|
|
OrderInfoInfo,
|
|
|
|
|
OrderInfoImport,
|
|
|
|
|
OrderInfoSupplement,
|
|
|
|
|
OrderInfoZeYiSupplement,
|
|
|
|
|
rippleChart,
|
|
|
|
|
},
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
output: {
|
|
|
|
|
outputType: 1, // 导出方式，1导出选中，2导出本页，3条件导出，4导出全部
|
|
|
|
|
startPage: 1, // 导出开始页
|
|
|
|
|
endPage: 1, // 导出结束页
|
|
|
|
|
pageSize: 10, // 每页条数
|
|
|
|
|
},
|
|
|
|
|
oilCompanyOrderMatchTask: {},
|
|
|
|
|
queryCompanyList: [], // 企业列表
|
|
|
|
|
siteList: [],
|
|
|
|
|
multipleSelection: [], // 选择表格数据集合
|
|
|
|
|
importDialog: false, // 导入弹窗
|
|
|
|
|
outPutDialog: false, // 导出弹窗
|
|
|
|
|
showTableDrawer: false,
|
|
|
|
|
page: {
|
|
|
|
|
pageSize: 10, // 每页显示条数
|
|
|
|
|
currentPage: 1, // 默认页
|
|
|
|
|
params: {}, // 查询参数
|
|
|
|
|
sorted: {
|
|
|
|
|
// createTime: "desc",
|
|
|
|
|
"source":"DISPATCH" // 必填：写死DISPATCH
|
|
|
|
|
},
|
|
|
|
|
columns: [],
|
|
|
|
|
},
|
|
|
|
|
tableHeight: 0,
|
|
|
|
|
filters: this.$options.filters,
|
|
|
|
|
dataPage: {
|
|
|
|
|
// 分页显示page
|
|
|
|
|
pageSize: 10, // 每页显示条数
|
|
|
|
|
currentPage: 1, // 默认页
|
|
|
|
|
params: {
|
|
|
|
|
// 查询参数
|
|
|
|
|
},
|
|
|
|
|
sorted: {},
|
|
|
|
|
},
|
|
|
|
|
tableColumns: [
|
|
|
|
|
{
|
|
|
|
|
prop: "orderSerialNumber",
|
|
|
|
|
minWidth: 250,
|
|
|
|
|
sortable: "custom",
|
|
|
|
|
label: "订单号",
|
|
|
|
|
show: true,
|
|
|
|
|
render: (row, column, cell) => {
|
|
|
|
|
// 订单号查询
|
|
|
|
|
return (
|
|
|
|
|
<div>
|
|
|
|
|
<div>
|
|
|
|
|
<el-button
|
|
|
|
|
on-click={() => this.handleDetailBySerialNumber(cell)}
|
|
|
|
|
type="text"
|
|
|
|
|
>
|
|
|
|
|
ID:{row.id}
|
|
|
|
|
</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<el-button
|
|
|
|
|
on-click={() => this.handleDetailBySerialNumber(cell)}
|
|
|
|
|
type="text"
|
|
|
|
|
>
|
|
|
|
|
订单号：{cell}
|
|
|
|
|
</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
prop: "customerId",
|
|
|
|
|
minWidth: 200,
|
|
|
|
|
sortable: "custom",
|
|
|
|
|
label: "司机信息",
|
|
|
|
|
show: true,
|
|
|
|
|
render: (row, column, cell) => {
|
|
|
|
|
return (
|
|
|
|
|
<div class="column-info-container">
|
|
|
|
|
<div class="column-info-icon">
|
|
|
|
|
<svg-icon
|
|
|
|
|
v-show={row.payAccountType === 0}
|
|
|
|
|
icon-class="iconsiji1"
|
|
|
|
|
/>
|
|
|
|
|
<svg-icon
|
|
|
|
|
v-show={row.payAccountType === 1}
|
|
|
|
|
icon-class="icongongsi-"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="column-info-content">
|
|
|
|
|
<div class="column-info-content-item">
|
|
|
|
|
{row.userName
|
|
|
|
|
? row.userName
|
|
|
|
|
: "暂无"}
|
|
|
|
|
-
|
|
|
|
|
{row.phone
|
|
|
|
|
? row.phone
|
|
|
|
|
: "暂无"}
|
|
|
|
|
</div>
|
|
|
|
|
<div v-show={row.companyName} class='column-info-content-item'>{row.companyName ? row.companyName : '暂无'}</div>
|
|
|
|
|
<div
|
|
|
|
|
v-show={row.payAccountType === 1}
|
|
|
|
|
class="column-info-content-item"
|
|
|
|
|
>
|
|
|
|
|
{row.userName ? row.userName : "暂无"}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="column-info-content-item" v-show={!row.editor}>
|
|
|
|
|
<span>{row.plateNumber}</span>
|
|
|
|
|
<el-button
|
|
|
|
|
on-click={() =>
|
|
|
|
|
this.changeEditor(row, row.orderSerialNumber)
|
|
|
|
|
}
|
|
|
|
|
type="text"
|
|
|
|
|
>
|
|
|
|
|
<svg-icon
|
|
|
|
|
style="width: 15px;height:15px;"
|
|
|
|
|
icon-class="iconxiugai"
|
|
|
|
|
/>
|
|
|
|
|
</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="column-info-content-item" v-show={row.editor}>
|
|
|
|
|
<el-input
|
|
|
|
|
ref={row.orderSerialNumber}
|
|
|
|
|
on-blur={() => this.changeRowPlate(row)}
|
|
|
|
|
size="mini"
|
|
|
|
|
v-model={row.plateNumber}
|
|
|
|
|
clearable
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
// { prop: 'siteId', minWidth: 200, headerAlign: 'center', sortable: 'custom', label: '油卡信息', show: true, render: (row, column, cell) => {
|
|
|
|
|
// // <div class='column-info-content-item'>油卡余额：{row.plateNumber}</div>
|
|
|
|
|
// return <div class='column-info-container'>
|
|
|
|
|
// <div class='column-info-icon'>
|
|
|
|
|
// <el-tag size='small' v-show={row.oilCardNature === 1} effect='plain' type='success'>个人</el-tag>
|
|
|
|
|
// <el-tag size='small' v-show={row.oilCardNature === 2} effect='plain' type='primary'>直营</el-tag>
|
|
|
|
|
// <el-tag size='small' v-show={row.oilCardNature === 3} effect='plain' type='danger'>外请</el-tag>
|
|
|
|
|
// </div>
|
|
|
|
|
// <div class='column-info-content'>
|
|
|
|
|
// <div class='column-info-content-item'>{row.name}</div>
|
|
|
|
|
// <div class='column-info-content-item'>卡号：{row.phone}</div>
|
|
|
|
|
// </div>
|
|
|
|
|
// </div>
|
|
|
|
|
// } },
|
|
|
|
|
{
|
|
|
|
|
prop: "siteId",
|
|
|
|
|
minWidth: 250,
|
|
|
|
|
sortable: "custom",
|
|
|
|
|
label: "油站",
|
|
|
|
|
show: true,
|
|
|
|
|
render: (row, column, cell) => {
|
|
|
|
|
return (
|
|
|
|
|
<div class="column-info-container">
|
|
|
|
|
<div class="column-info-content">
|
|
|
|
|
<div class="column-info-content-item">
|
|
|
|
|
{row.siteName}-{row.id}
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<span style="color: red;font-size=16px;margin-right: 10px;font-weight:bold">
|
|
|
|
|
{row.oilsCode}
|
|
|
|
|
</span>
|
|
|
|
|
<span>{row.realPrice} ￥/L</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div>
|
|
|
|
|
{row.volume}L/{row.payRealAmount}￥
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
prop: "orderStatus",
|
|
|
|
|
minWidth: 120,
|
|
|
|
|
sortable: "custom",
|
|
|
|
|
label: "订单状态",
|
|
|
|
|
show: true,
|
|
|
|
|
render: (row, column, cell) => {
|
|
|
|
|
if (cell === -1) {
|
|
|
|
|
return <el-tag type="danger">支付失败</el-tag>;
|
|
|
|
|
} else if (cell === 0) {
|
|
|
|
|
return <el-tag type="primary">支付中</el-tag>;
|
|
|
|
|
} else if (cell === 1) {
|
|
|
|
|
return <el-tag type="success">支付成功</el-tag>;
|
|
|
|
|
} else if (cell === 2) {
|
|
|
|
|
return (
|
|
|
|
|
<el-tag type="info" minWidth="80">
|
|
|
|
|
已取消
|
|
|
|
|
</el-tag>
|
|
|
|
|
);
|
|
|
|
|
} else if (cell === 3) {
|
|
|
|
|
return (
|
|
|
|
|
<el-tag type="info" minWidth="80">
|
|
|
|
|
已退款
|
|
|
|
|
</el-tag>
|
|
|
|
|
);
|
|
|
|
|
} else if (cell === 4) {
|
|
|
|
|
return (
|
|
|
|
|
<el-tag type="info" minWidth="80">
|
|
|
|
|
退款中
|
|
|
|
|
</el-tag>
|
|
|
|
|
);
|
|
|
|
|
} else if (cell === 5) {
|
|
|
|
|
return (
|
|
|
|
|
<el-tag type="info" minWidth="80">
|
|
|
|
|
退款失败
|
|
|
|
|
</el-tag>
|
|
|
|
|
);
|
|
|
|
|
} else {
|
|
|
|
|
return cell;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
prop: "convertStatus",
|
|
|
|
|
minWidth: 120,
|
|
|
|
|
label: "转化状态",
|
|
|
|
|
show: true,
|
|
|
|
|
render: (row, column, cell) => {
|
|
|
|
|
let convertStatusName;
|
|
|
|
|
switch(Number(row.convertStatus)){
|
|
|
|
|
case 0:
|
|
|
|
|
convertStatusName = '待转化'
|
|
|
|
|
break;
|
|
|
|
|
case 1:
|
|
|
|
|
convertStatusName = '转化成功'
|
|
|
|
|
break;
|
|
|
|
|
case -1:
|
|
|
|
|
convertStatusName = '转化失败'
|
|
|
|
|
break;
|
|
|
|
|
case 2:
|
|
|
|
|
convertStatusName = '转换中'
|
|
|
|
|
break;
|
|
|
|
|
default : convertStatusName = '暂无数据'
|
|
|
|
|
}
|
|
|
|
|
return <el-tag type="danger">{convertStatusName}</el-tag>;
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
// { prop: 'realAmount', minWidth: 150, sortable: 'custom', label: '油品/升数/金额', show: true, render: (row, column, cell) => {
|
|
|
|
|
// return <div>
|
|
|
|
|
// <div>
|
|
|
|
|
// <span style='color: red;font-size=16px;margin-right: 10px;font-weight:bold'>{row.oilsCode}</span>
|
|
|
|
|
// <span>{row.realPrice} ￥/L</span>
|
|
|
|
|
// </div>
|
|
|
|
|
// <div>
|
|
|
|
|
// <div>{row.volume}L/{row.payRealAmount}￥</div>
|
|
|
|
|
// </div>
|
|
|
|
|
// </div>
|
|
|
|
|
// } },
|
|
|
|
|
{
|
|
|
|
|
prop: "orderTime",
|
|
|
|
|
minWidth: 160,
|
|
|
|
|
sortable: "custom",
|
|
|
|
|
label: "订单时间",
|
|
|
|
|
show: true,
|
|
|
|
|
render: (row, column, cell) => {
|
|
|
|
|
return cell;
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
prop: "orderSource",
|
|
|
|
|
minWidth: 180,
|
|
|
|
|
label: "来源/支付方式",
|
|
|
|
|
show: true,
|
|
|
|
|
render: (row, column, cell) => {
|
|
|
|
|
let payChannelName;
|
|
|
|
|
switch(row.payChannel?row.payChannel:null){
|
|
|
|
|
case 'BALANCE_PAYMENT':
|
|
|
|
|
payChannelName = '余额支付'
|
|
|
|
|
break;
|
|
|
|
|
case 'WECHAT_MINIAPPS_PAYMENT':
|
|
|
|
|
payChannelName = '微信小程序支付'
|
|
|
|
|
break;
|
|
|
|
|
case 'YIBAO_WECHAT_MINIAPPS_PAYMENT':
|
|
|
|
|
payChannelName = '易宝支付'
|
|
|
|
|
break;
|
|
|
|
|
default : payChannelName = '暂无数据'
|
|
|
|
|
}
|
|
|
|
|
return (
|
|
|
|
|
<div>
|
|
|
|
|
<div>来源：{cell}</div>
|
|
|
|
|
<div>
|
|
|
|
|
支付：
|
|
|
|
|
{payChannelName}
|
|
|
|
|
</div>
|
|
|
|
|
</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: "一点加油",
|
|
|
|
|
},
|
|
|
|
|
valColumn: [
|
|
|
|
|
"id",
|
|
|
|
|
"oilCustomerInfo.customerId",
|
|
|
|
|
"oilCustomerInfo.name",
|
|
|
|
|
"plateNumber",
|
|
|
|
|
"createTime",
|
|
|
|
|
"orderStatusText",
|
|
|
|
|
"siteId",
|
|
|
|
|
"siteInfo.siteName",
|
|
|
|
|
"oilsBar",
|
|
|
|
|
"sitePrice",
|
|
|
|
|
"realPrice",
|
|
|
|
|
"volume",
|
|
|
|
|
"otherPriceAmount",
|
|
|
|
|
"realPriceAmount",
|
|
|
|
|
"siteUser",
|
|
|
|
|
"couponMark",
|
|
|
|
|
"settlementScaleAmount",
|
|
|
|
|
"oilsCode",
|
|
|
|
|
"payTime",
|
|
|
|
|
"orderSerialNumber",
|
|
|
|
|
"updateTime",
|
|
|
|
|
"siteName",
|
|
|
|
|
"payAccountTypeText",
|
|
|
|
|
"companyInfo.name",
|
|
|
|
|
"otherOrderId",
|
|
|
|
|
"suppleRemak",
|
|
|
|
|
],
|
|
|
|
|
headers: [
|
|
|
|
|
"订单编号",
|
|
|
|
|
"司机编号",
|
|
|
|
|
"司机姓名",
|
|
|
|
|
"车牌号",
|
|
|
|
|
"创建时间",
|
|
|
|
|
"状态",
|
|
|
|
|
"油站编号",
|
|
|
|
|
"油站名称",
|
|
|
|
|
"油枪号",
|
|
|
|
|
"单价",
|
|
|
|
|
"实际单价",
|
|
|
|
|
"体积",
|
|
|
|
|
"金额",
|
|
|
|
|
"实际金额",
|
|
|
|
|
"油站工作人员号",
|
|
|
|
|
"券",
|
|
|
|
|
"打折率",
|
|
|
|
|
"油品类型",
|
|
|
|
|
"支付时间",
|
|
|
|
|
"流水号",
|
|
|
|
|
"修改时间",
|
|
|
|
|
"油站名称",
|
|
|
|
|
"账户类型",
|
|
|
|
|
"公司名称",
|
|
|
|
|
"三方订单编号",
|
|
|
|
|
"备注",
|
|
|
|
|
],
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
computed: {
|
|
|
|
|
...mapGetters(["sysUserList", "markData"]),
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
this.getByPage();
|
|
|
|
|
// 增加监听事件，窗口变化时得到高度。
|
|
|
|
|
this.getHeight();
|
|
|
|
|
window.addEventListener("resize", this.getHeight, false);
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
searchUserInfo(info) {
|
|
|
|
|
if (info && info !== "") {
|
|
|
|
|
sysCustomerInfoApi.liekQuery(info).then((res) => {
|
|
|
|
|
this.sysCustomerList = res.data;
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
companyRemoteMethod(value) {
|
|
|
|
|
// 远程搜索企业
|
|
|
|
|
if (value) {
|
|
|
|
|
oilCompanyInfoApi.getLikeByNameSuccess({ 'name': value }).then((res) => {
|
|
|
|
|
this.queryCompanyList = 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() {
|
|
|
|
|
// 导出数据
|
|
|
|
|
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 {
|
|
|
|
|
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.toBeConfirmed(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() {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.sHeight = this.$refs.searchHeight.offsetHeight;
|
|
|
|
|
let fixedHeaderHeight =
|
|
|
|
|
document.querySelector(".fixed-header").clientHeight;
|
|
|
|
|
let elPaginationHeight =
|
|
|
|
|
document.querySelector(".el-pagination").clientHeight;
|
|
|
|
|
this.tableHeight =
|
|
|
|
|
document.documentElement.clientHeight -
|
|
|
|
|
this.sHeight -
|
|
|
|
|
fixedHeaderHeight -
|
|
|
|
|
elPaginationHeight -
|
|
|
|
|
160;
|
|
|
|
|
}, 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.name}</span>]。<br/>
|
|
|
|
|
退款人手机号[<span style="color: red">${row.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.name}</span>]。<br/>
|
|
|
|
|
退款人手机号[<span style="color: red">${row.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();
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
toTFRefund(row) {
|
|
|
|
|
// 转换单退款
|
|
|
|
|
this.$confirm(
|
|
|
|
|
`
|
|
|
|
|
您确定要对该星油转换订单进行退款?当前退款人为[<span style="color:red">${row.name}</span>]。<br/>
|
|
|
|
|
退款人手机号[<span style="color: red">${row.phone}</span>]，
|
|
|
|
|
退款金额[<span style="color: red">${row.payRealAmount}</span>]元<br/>
|
|
|
|
|
`,
|
|
|
|
|
|
|
|
|
|
"提示",
|
|
|
|
|
{ type: "info", dangerouslyUseHTMLString: true }
|
|
|
|
|
).then(() => {
|
|
|
|
|
orderInfoApi.refundTaskOrder(row).then((res) => {
|
|
|
|
|
this.$message.success(res.msg);
|
|
|
|
|
this.getByPage();
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
toCancelOrder(row) {
|
|
|
|
|
// 则一退款
|
|
|
|
|
this.$confirm(
|
|
|
|
|
`
|
|
|
|
|
您确定要对该则一订单进行退款?当前退款人为[<span style="color:red">${row.name}</span>]。<br/>
|
|
|
|
|
退款人手机号[<span style="color: red">${row.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();
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
toDelete(id) {
|
|
|
|
|
// 删除
|
|
|
|
|
this.$confirm("确定删除?", "提示", { type: "error" }).then(() => {
|
|
|
|
|
orderInfoApi.deleteById(id).then((res) => {
|
|
|
|
|
this.$message.success(res.msg);
|
|
|
|
|
this.getByPage();
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
getByPage() {
|
|
|
|
|
// 分页查询
|
|
|
|
|
this.addDialog = false;
|
|
|
|
|
this.page.params.convertCompanyCode = 1;
|
|
|
|
|
this.page.params = Object.assign(this.page.params,{
|
|
|
|
|
dateStartTime:this.page.params.btw_createTime?this.page.params.btw_createTime.split('~')[0]:'',
|
|
|
|
|
dateStartEnd:this.page.params.btw_createTime?this.page.params.btw_createTime.split('~')[1]:''
|
|
|
|
|
})
|
|
|
|
|
orderInfoApi.getByPage(this.page).then((res) => {
|
|
|
|
|
this.dataPage = res.data;
|
|
|
|
|
this.page.totalCount = this.dataPage.totalCount;
|
|
|
|
|
this.page.totalPage = this.dataPage.totalPage;
|
|
|
|
|
});
|
|
|
|
|
// 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.orderTfDialog = false;
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
.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>
|
|
|
|
|
.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>
|
