新增团购订单

This commit is contained in:
gyq
2024-05-08 17:13:11 +08:00
parent 2c6a00feeb
commit 11c6823d12
3 changed files with 366 additions and 41 deletions

View File

@@ -3,8 +3,8 @@ ENV = 'development'
# 接口地址
# VUE_APP_BASE_API = 'http://192.168.2.128:8000'
# VUE_APP_BASE_API = 'http://192.168.2.133:8000'
VUE_APP_BASE_API = 'https://cashieradmin.sxczgkj.cn'
# VUE_APP_BASE_API = 'http://192.168.2.98:8000'
# VUE_APP_BASE_API = 'https://cashieradmin.sxczgkj.cn'
VUE_APP_BASE_API = 'http://192.168.2.96:8000'
VUE_APP_WS_API = 'ws://192.168.2.128:8000'
# 是否启用 babel-plugin-dynamic-import-node插件

View File

@@ -1,63 +1,92 @@
import request from '@/utils/request'
import request from "@/utils/request";
/**
* 查询订单
* @param {*} data
* @returns
* @param {*} data
* @returns
*/
export function tbOrderInfoData(data) {
return request({
url: '/api/tbOrderInfo/date',
method: 'post',
data: {
shopId: localStorage.getItem('shopId'),
...data
}
})
return request({
url: "/api/tbOrderInfo/date",
method: "post",
data: {
shopId: localStorage.getItem("shopId"),
...data
}
});
}
/**
* 导出数据
* @param {*} data
* @returns
* @returns
*/
export function tbOrderInfoDownload(data) {
return request({
url: '/api/tbOrderInfo/download',
method: 'post',
data: {
shopId: localStorage.getItem('shopId'),
...data
},
responseType: 'blob'
})
return request({
url: "/api/tbOrderInfo/download",
method: "post",
data: {
shopId: localStorage.getItem("shopId"),
...data
},
responseType: "blob"
});
}
/**
* 通过Id查询订单
* @param {*} id
* @returns
* @param {*} id
* @returns
*/
export function tbOrderInfoDetail(id) {
return request({
url: `/api/tbOrderInfo/${id}`,
method: 'get'
})
return request({
url: `/api/tbOrderInfo/${id}`,
method: "get"
});
}
/**
* 通过Id查询订单
* @param {*} createdAt
* @returns
* @param {*} createdAt
* @returns
*/
export function payCount(createdAt) {
console.log(createdAt);
return request({
url: `/api/tbOrderInfo/payCount`,
method: 'post',
data: {
shopId: localStorage.getItem('shopId'),
createdAt: createdAt
}
})
}
console.log(createdAt);
return request({
url: `/api/tbOrderInfo/payCount`,
method: "post",
data: {
shopId: localStorage.getItem("shopId"),
createdAt: createdAt
}
});
}
/**
* 订单列表
* @param {*} createdAt
* @returns
*/
export function tbGroupOrderInfo(params) {
return request({
url: `/api/tbGroupOrderInfo`,
method: "post",
data: {
shopId: localStorage.getItem("shopId"),
...params
}
});
}
/**
* 退单
* @param {*} data
* @returns
*/
export function returnGpOrder(data) {
return request({
url: `/api/tbGroupOrderInfo/returnGpOrder`,
method: "post",
data
});
}

View File

@@ -0,0 +1,296 @@
<template>
<div class="app-container">
<div class="head-container">
<el-form :model="query" inline>
<el-form-item>
<el-input v-model="query.orderNo" placeholder="订单号"></el-input>
</el-form-item>
<el-form-item>
<el-select v-model="query.payType" placeholder="支付类型">
<el-option label="微信支付" value="wechatPay" />
<el-option label="支付宝支付" value="aliPay" />
</el-select>
</el-form-item>
<el-form-item>
<el-input v-model="query.phone" placeholder="联系电话"></el-input>
</el-form-item>
<el-form-item>
<el-input v-model="query.proName" placeholder="商品名称"></el-input>
</el-form-item>
<el-form-item>
<el-select v-model="query.status" placeholder="状态">
<el-option label="待付款" value="unpaid" />
<el-option label="待使用" value="unused" />
<el-option label="已完成" value="closed" />
<el-option label="退款中" value="refunding" />
<el-option label="已退款" value="refund" />
<el-option label="已取消" value="cancelled" />
</el-select>
</el-form-item>
<el-form-item>
<el-date-picker v-model="query.createdAt" type="daterange" range-separator="至"
start-placeholder="开始日期" end-placeholder="结束日期" :default-time="['00:00:00', '23:59:59']"
value-format="yyyy-MM-dd HH:mm:ss">
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getTableData">查询</el-button>
<el-button @click="resetHandle">重置</el-button>
</el-form-item>
</el-form>
</div>
<div class="head-container">
<el-table :data="tableData.data" v-loading="tableData.loading">
<el-table-column label="订单号" prop="orderNo"></el-table-column>
<el-table-column label="团购卷名称" prop="proName"></el-table-column>
<el-table-column label="到期日期" prop="expDate"></el-table-column>
<el-table-column label="创建时间" prop="createTime"></el-table-column>
<el-table-column label="下单数量" prop="number"></el-table-column>
<el-table-column label="已退数量" prop="refundNumber"></el-table-column>
<el-table-column label="订单金额" prop="orderAmount">
<template v-slot="scope">
{{ scope.row.orderAmount }}
</template>
</el-table-column>
<el-table-column label="支付金额" prop="payAmount">
<template v-slot="scope">
{{ scope.row.payAmount }}
</template>
</el-table-column>
<el-table-column label="支付方式" prop="payType">
<template v-slot="scope">
{{ payF(scope.row.payType) }}
</template>
</el-table-column>
<el-table-column label="下单人电话" prop="phone"></el-table-column>
<el-table-column label="是否支持退款" prop="refundAble">
<template v-slot="scope">
{{ scope.row.refundAble ? "" : "" }}
</template>
</el-table-column>
<el-table-column label="备注" prop="remark"></el-table-column>
<el-table-column label="状态" prop="status">
<template v-slot="scope">
<el-tag :type="statusF(scope.row.status)">
{{ scope.row.status }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="交易日期" prop="tradeDay"></el-table-column>
<el-table-column label="核销员" prop="verifier"></el-table-column>
<el-table-column label="操作" width="100">
<template v-slot="scope">
<el-button type="text" icon="el-icon-edit" @click="showRefund(scope.row)"
:disabled="!scope.row.refundAble">退款</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div class="head-container">
<el-pagination :total="tableData.total" :current-page="tableData.page + 1" :page-size="tableData.size"
@current-change="paginationChange" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
</div>
<el-dialog title="退款" :visible.sync="showDialog" width="400px">
<el-form ref="refundForm" :model="refundForm" :rules="refundFormRules" label-position="top">
<el-form-item label="退单数" prop="num">
<el-select v-model="refundForm.num" placeholder="请选择退单数" style="width: 100%;"
@change="refundNumChange">
<el-option :label="item" :value="item" v-for="item in refundNumList" :key="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="退单金额">
<el-input v-model="refundForm.refundAmount" disabled placeholder="请选择退单数"></el-input>
</el-form-item>
<el-form-item label="退款原因">
<el-input v-model="refundForm.refundReason" type="textarea" placeholder="请输入退款原因"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="showDialog = false">取消</el-button>
<el-button type="primary" :loading="refundLoading" @click="refundConfirm"> </el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { tbGroupOrderInfo, returnGpOrder } from "@/api/order";
import dayjs from "dayjs";
export default {
data() {
return {
query: {
orderNo: "",
payType: "",
phone: "",
proName: "",
status: "",
createTime: []
},
resetQuery: "",
tableData: {
data: [],
page: 0,
size: 10,
loading: false,
total: 0
},
payTypes: [
{
value: "wechatPay",
label: "微信支付"
},
{
value: "aliPay",
label: "支付宝支付"
}
],
statusList: [
{
value: "unpaid",
label: "待付款",
type: "warning"
},
{
value: "unused",
label: "待使用",
type: "primary"
},
{
value: "closed",
label: "已完成",
type: "success"
},
{
value: "refunding",
label: "退款中",
type: "warning"
},
{
value: "refund",
label: "已退款",
type: "default"
},
{
value: "cancelled",
label: "已取消",
type: "danger"
}
],
row: '',
showDialog: false,
refundNumList: [],
refundLoading: false,
refundForm: {
num: '',
orderId: '',
refundAmount: '',
refundDesc: '',
refundReason: ''
},
refundFormRules: {
num: [
{
required: true,
message: ' ',
trigger: 'change'
}
]
}
};
},
filters: {
timeFilter(s) {
return dayjs(s).format("YYYY-MM-DD HH:mm:ss");
}
},
mounted() {
this.getTableData();
this.resetQuery = { ...this.query };
},
methods: {
// 提交退单
refundConfirm() {
this.$refs.refundForm.validate(async valid => {
if (valid) {
try {
this.refundLoading = true
const res = await returnGpOrder(this.refundForm)
this.refundLoading = false
this.$notify({
title: '成功',
message: `退单成功`,
type: 'success'
});
this.showDialog = false
} catch (error) {
console.log(error);
this.refundLoading = false
}
}
})
},
// 计算退单金额
refundNumChange(e) {
this.refundForm.refundAmount = Math.floor(this.row.orderAmount / e * 100) / 100
},
// 显示退款
showRefund(row) {
this.row = row
let arr = []
for (let i = 1; i <= row.number - row.refundNumber; i++) {
arr.push(i)
}
this.refundNumList = arr
this.refundForm.orderId = row.id
this.showDialog = true
},
payF(p) {
return p && this.payTypes.find(item => item.value == p).label;
},
statusF(t) {
return t && this.statusList.find(item => item.label == t).type;
},
// 切换状态
async statusChange(e, row) {
try {
this.tableData.loading = true;
const data = { ...row };
data.status = e;
await tbPrintMachine(data, "put");
this.getTableData();
} catch (error) {
console.log(error);
this.tableData.loading = false;
}
},
// 重置查询
resetHandle() {
this.query = { ...this.resetQuery };
this.getTableData();
},
// 分页回调
paginationChange(e) {
this.tableData.page = e - 1;
this.getTableData();
},
// 获取列表
async getTableData() {
this.tableData.loading = true;
try {
const res = await tbGroupOrderInfo({
...this.query,
page: this.tableData.page,
size: this.tableData.size,
sort: "id"
});
this.tableData.loading = false;
this.tableData.data = res.content;
this.tableData.total = res.totalElements;
} catch (error) {
console.log(error);
}
}
}
};
</script>