363 lines
11 KiB
Vue
363 lines
11 KiB
Vue
<template>
|
|
<div class="app-containers">
|
|
<div class="bai-box" >
|
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
|
|
|
<el-form-item label="" prop="orderNo">
|
|
<el-input
|
|
v-model="queryParams.orderNo"
|
|
placeholder="请输入订单号"
|
|
clearable
|
|
style="width: 240px;"
|
|
@keyup.enter.native="handleQuery"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="" prop="type">
|
|
<el-select
|
|
v-model="queryParams.payChannel"
|
|
clearable
|
|
placeholder="请选择订单状态"
|
|
>
|
|
<el-option label="小程序" value="applet"/>
|
|
<el-option label="收银台" value="cashier"/>
|
|
<el-option label="POS端" value="POS"/>
|
|
<el-option label="平台" value="PC"/>
|
|
</el-select>
|
|
|
|
|
|
</el-form-item>
|
|
<el-form-item label="" prop="paymentChannel">
|
|
<el-select
|
|
v-model="queryParams.paymentChannel"
|
|
clearable
|
|
placeholder="请选择订单类型"
|
|
>
|
|
<el-option label="全部" value=""/>
|
|
<el-option label="拉卡拉" value="cashier"/>
|
|
<el-option label="富友" value="POS"/>
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
<el-form-item label="" prop="status">
|
|
<el-select
|
|
v-model="queryParams.status"
|
|
clearable
|
|
placeholder="支付通道"
|
|
>
|
|
<el-option label="已支付" value="paid"/>
|
|
<el-option label="未支付" value="unpaid"/>
|
|
<el-option label="已退款" value="refund"/>
|
|
<el-option label="支付失败" value="payFail"/>
|
|
<el-option label="退款中" value="refunding"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item label="">
|
|
<el-date-picker
|
|
v-model="dateRange"
|
|
style="width: 240px;height: 32px"
|
|
size="medium"
|
|
value-format="yyyy-MM-dd"
|
|
type="daterange"
|
|
|
|
range-separator="-"
|
|
start-placeholder="开始日期"
|
|
end-placeholder="结束日期"
|
|
></el-date-picker>
|
|
</el-form-item>
|
|
|
|
<el-form-item style="float: right;margin-right: 0px">
|
|
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
|
|
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
|
|
|
|
</el-form-item>
|
|
</el-form>
|
|
<div style="width: 100%;height: 74vh;overflow: auto">
|
|
<el-table ref="tables" border v-loading="loading" :data="list" @selection-change="handleSelectionChange" :default-sort="defaultSort" @sort-change="handleSortChange">
|
|
<el-table-column label="序号" align="center" type="index" />
|
|
<el-table-column label="订单号" align="center" prop="orderNo" width="220"/>
|
|
<el-table-column label="所属机构" align="center" prop="deptName" width="200">
|
|
</el-table-column>
|
|
<el-table-column :label="sumPayMoney" align="center" prop="payMoney" >
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column label="订单类型" align="center" prop="type">
|
|
</el-table-column>
|
|
<el-table-column label="支付方式" align="center" prop="payType">
|
|
</el-table-column>
|
|
<el-table-column label="订单状态" align="center" prop="status">
|
|
</el-table-column>
|
|
|
|
<el-table-column label="付款用户/手机号" align="center" prop="userMobile" width="150">
|
|
</el-table-column>
|
|
|
|
<el-table-column label="支付通道" align="center" prop="payChannel" width="150">
|
|
</el-table-column>
|
|
|
|
<el-table-column label="商户号编号" align="center" prop="mchntCd" width="150">
|
|
<template slot-scope="scope">
|
|
<span>{{ scope.row.mchntCd?scope.row.mchntCd: '--'}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="订单创建时间" align="center" prop="createTime">
|
|
<template slot-scope="scope">
|
|
<span>{{ parseTime(scope.row.createTime) || '--'}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="订单完成时间" align="center" prop="updateTime">
|
|
<template slot-scope="scope">
|
|
<span>{{ parseTime(scope.row.updateTime) || '--'}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
|
|
</el-table>
|
|
|
|
</div>
|
|
<pagination
|
|
v-show="total>0"
|
|
:total="total"
|
|
:page.sync="queryParams.page"
|
|
:limit.sync="queryParams.pageSize"
|
|
@pagination="getList"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {getName} from "../../../utils/fuint";
|
|
import {addStaff, delStaff, getStaff, listStaff, updateStaff} from "../../../api/staff/staff";
|
|
// import {getDuty, listDuty} from "@/api/staff/duty";
|
|
import { getOrderListApis,getSumPayMoneyApi } from "../../../api/allOrder";
|
|
export default {
|
|
name: "asdf",
|
|
dicts: ['transaction','handover','handover_quit','payment_type','pay_status',
|
|
'jbjl','official','notice','role'],
|
|
props: ["id"],
|
|
|
|
data() {
|
|
return {
|
|
drawer: false,
|
|
// 标题
|
|
title: "",
|
|
// 遮罩层
|
|
loading: false,
|
|
// 选中数组
|
|
ids: [],
|
|
// 非多个禁用
|
|
multiple: true,
|
|
// 显示搜索条件
|
|
showSearch: true,
|
|
categoryOptions: [],
|
|
storeOptions: [],
|
|
posPrem:'',
|
|
|
|
props: { multiple: true },
|
|
appletPrem:'',
|
|
|
|
writeOff:[],
|
|
write:[],
|
|
specialPrem:[],
|
|
special:[],
|
|
// 总条数
|
|
total: 0,
|
|
// 表格数据
|
|
list: [],
|
|
// 是否显示弹出层
|
|
open: false,
|
|
// 日期范围
|
|
dateRange: [],
|
|
// 默认排序
|
|
defaultSort: {prop: 'createTime', order: 'descending'},
|
|
// 表单参数
|
|
form: {
|
|
id:'', category:'', userId:'', mobile:'', realName:'', wechat:'', merchantId:'', storeId:this.id, auditedStatus:'',
|
|
auditedTime:'', description:'', isRefuel:'yc', handoverMode:'dqmdtyjb', handoverPrem:'yqx', handoverOut:'jbtc', record:'qbjl',
|
|
merchantStatus:'qy',screen:'qy', posPrem:'', appletPrem:'', notice:'advice_jy', oilGunId:'', timeFrame:'bx', refund:'yqx',
|
|
transaction:'qbjy', writeOff:'',specialPrem:'', official:'', status:'qy',pos:'jy',role:''
|
|
},
|
|
// 查询参数
|
|
queryParams: {
|
|
type:'',
|
|
orderNo:'',
|
|
payChannel:'',
|
|
payType:'',
|
|
page: 1,
|
|
pageSize: 10,
|
|
},
|
|
|
|
typeList:[
|
|
{ value: '1',label: '油品'},
|
|
{ value: '2',label: '商品'},
|
|
{ value: '3',label: '储值卡'},
|
|
{ value: '4',label: '积分'},
|
|
{ value: '5',label: '囤油卡'},
|
|
{ value: '6',label: '油品加加商品(收银台订单)'},
|
|
{ value: '7',label: '挂账订单'},
|
|
],
|
|
payTypeList:[
|
|
{ value: '选项1',label: '黄金糕'},
|
|
|
|
],
|
|
payChannelList:[
|
|
{ value: 'applet',label: '小程序'},
|
|
{ value: 'cashier',label: '收银台'},
|
|
],
|
|
sumPayMoney:'订单金额'
|
|
};
|
|
},
|
|
created() {
|
|
this.getList();
|
|
},
|
|
methods: {
|
|
// 查询列表
|
|
getList() {
|
|
this.loading = true;
|
|
this.queryParams.storeId = this.id
|
|
getOrderListApis(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
|
this.list = response.data.records;
|
|
this.total = response.data.total;
|
|
this.getSumPayMoney()
|
|
this.loading = false;
|
|
}
|
|
);
|
|
},
|
|
|
|
// 查询总钱数
|
|
getSumPayMoney() {
|
|
// this.loading = true;
|
|
this.queryParams.storeId = this.id
|
|
getSumPayMoneyApi(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
|
if(response.data > 0) {
|
|
const sum = response.data
|
|
this.sumPayMoney = '订单金额(总计：￥'+sum+')'
|
|
}else {
|
|
this.sumPayMoney = '订单金额'
|
|
|
|
}
|
|
// this.loading = false;
|
|
}
|
|
);
|
|
},
|
|
|
|
getType(data) {
|
|
const matchedElement = this.typeList.find(element => element.value === data);
|
|
if (matchedElement) {
|
|
return matchedElement.label;
|
|
}
|
|
return null;
|
|
},
|
|
|
|
showDesc(){
|
|
this.drawer = true;
|
|
},
|
|
handleNodeClick1(data) {
|
|
this.form.posPrem = JSON.stringify(data);
|
|
},
|
|
handleNodeClick2(data) {
|
|
this.form.appletPrem = JSON.stringify(data);
|
|
},
|
|
getCheckbox(){
|
|
this.form.writeOff = this.writeOff.toString();
|
|
this.form.specialPrem = this.specialPrem.toString();
|
|
},
|
|
// 页面跳转
|
|
toTarget(url) {
|
|
this.$router.push( { path: url } );
|
|
},
|
|
|
|
// 查询角色列表
|
|
getDuty(){
|
|
listDuty().then(response => {
|
|
this.role = response.data
|
|
})
|
|
},
|
|
// 店铺列表
|
|
getStoreList() {
|
|
listStaff().then(response => {
|
|
this.storeOptions = response.data.records;
|
|
}
|
|
);
|
|
// searchStore().then(response => {
|
|
// this.storeOptions = response.data.storeList;
|
|
// }
|
|
// );
|
|
},
|
|
// 搜索按钮操作
|
|
handleQuery() {
|
|
this.queryParams.page = 1;
|
|
this.getList();
|
|
},
|
|
// 重置按钮操作
|
|
resetQuery() {
|
|
this.dateRange = [];
|
|
this.resetForm("queryForm");
|
|
this.$refs.tables.sort(this.defaultSort.prop, this.defaultSort.order)
|
|
this.handleQuery();
|
|
},
|
|
|
|
// 多选框选中数据
|
|
handleSelectionChange(selection) {
|
|
this.ids = selection.map(item => item.operId)
|
|
this.multiple = !selection.length
|
|
},
|
|
// 排序触发事件
|
|
handleSortChange(column, prop, order) {
|
|
this.queryParams.orderByColumn = column.prop;
|
|
this.queryParams.isAsc = column.order;
|
|
this.getList();
|
|
},
|
|
// 新增按钮操作
|
|
handleAdd() {
|
|
this.reset();
|
|
this.open = true;
|
|
this.title = "新增员工";
|
|
},
|
|
// 表单重置
|
|
reset() {
|
|
this.posPrem = '';
|
|
this.appletPrem = '';
|
|
this.writeOff = []
|
|
this.form = {
|
|
id:'', category:'', userId:'', mobile:'', realName:'', wechat:'', merchantId:'', storeId:this.id, auditedStatus:'A',
|
|
auditedTime:'', description:'', isRefuel:'yc', handoverMode:'dqmdtyjb', handoverPrem:'yqx', handoverOut:'jbtc', record:'qbjl',
|
|
merchantStatus:'qy',screen:'qy', posPrem:'', appletPrem:'', notice:'advice_jy', oilGunId:'', timeFrame:'bx', refund:'yqx',
|
|
transaction:'qbjy', writeOff:'',specialPrem:'', official:'', status:'qy',pos:'jy',role:''
|
|
};
|
|
this.resetForm("form");
|
|
},
|
|
// 取消按钮
|
|
cancel() {
|
|
this.open = false;
|
|
this.reset();
|
|
},
|
|
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
.app-containers{
|
|
width: 100%;
|
|
height: 100%;
|
|
/* height: 100vh; */
|
|
background: #f9f9f9;
|
|
box-sizing: border-box;
|
|
padding: 10px;
|
|
padding-bottom: 0px;
|
|
}
|
|
|
|
.bai-box{
|
|
background: #fff;
|
|
box-sizing: border-box;
|
|
padding: 20px;
|
|
}
|
|
</style>
|