feat:退款详情
This commit is contained in:
dzc committed
1 parent
1b31fe32f9
commit
4891ac46b2
4 files changed
+248
-9
No files matched your search
@@ -1,5 +1,22 @@
|
||||
import request from "/@/utils/request"
|
||||
|
||||
|
||||
export function history(query?: Object) {
|
||||
return request({
|
||||
url: '/hard/hard-after-sale/history',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
export function detailByOrderId(query?: Object) {
|
||||
return request({
|
||||
url: '/hard/hard-after-sale/detail-by-order-id',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
export function pageJoin(query?: Object) {
|
||||
return request({
|
||||
url: '/hard/hard-after-sale/page',
|
||||
|
||||
@@ -0,0 +1,209 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-descriptions :column="3" border title="订单信息">
|
||||
<el-descriptions-item :span="3" label="订单号: ">
|
||||
{{ globalData.detail.id }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="订单类型: ">
|
||||
<dict-tag :options="hard_order_type" :value="globalData.detail.orderType" />
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="付款方式: ">
|
||||
<dict-tag :options="hard_pay_type" :value="globalData.detail.payType" />
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="订单状态: ">
|
||||
<dict-tag :options="hard_order_status" :value="globalData.detail.orderStatus" />
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="商户: ">
|
||||
<span> {{ globalData.detail.merchantName }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="设备名: ">
|
||||
<span> {{ globalData.detail.hardName }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="设备类型: ">
|
||||
<span> {{ globalData.detail.hardType }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="商品总价: ">
|
||||
<span class="color-success">
|
||||
{{ displayPrice(globalData.detail.totalPrice) }}
|
||||
</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="额外支付: ">
|
||||
<span class="color-danger">
|
||||
{{ displayPrice(globalData.detail.extraPrice) }}
|
||||
</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="实际支付: ">
|
||||
<span class="color-primary">
|
||||
{{ displayPrice(globalData.detail.payPrice) }}
|
||||
</span>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<el-descriptions :column="1" title="商品信息">
|
||||
<el-descriptions-item labelClassName="no-colon">
|
||||
<el-table :data="state.dataList" v-loading="state.loading" border :cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle" @sort-change="sortChangeHandle">
|
||||
<el-table-column label="商品名" align="center" prop="productName" />
|
||||
<el-table-column label="商品图片" align="center" prop="code">
|
||||
<template #default="{ row }">
|
||||
<preview-image v-if="row.productPic" :src="row.productPic" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品价格" align="center" prop="ticketId">
|
||||
<template #default="{ row }">
|
||||
<span>{{ displayPrice(row.productPrice) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品数量" align="center" prop="productCount" />
|
||||
<el-table-column label="商品总额" align="center" prop="totalPrice">
|
||||
<template #default="{ row }">
|
||||
<span>{{ displayPrice(row.totalPrice) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<el-descriptions v-if="globalData.afterSaleData.id" title="售后信息">
|
||||
</el-descriptions>
|
||||
<el-descriptions v-if="globalData.log && globalData.log.length" title="售后日志">
|
||||
</el-descriptions>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="order-refund">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { useDict } from '/@/hooks/dict';
|
||||
import * as hardOrder from "/@/api/hard/hard-order";
|
||||
import * as hardCar from "/@/api/hard/hard-car";
|
||||
import * as hardAfterSaleApi from '/@/api/hard/hard-after-sale'
|
||||
import * as hardAfterSaleLogApi from '/@/api/hard/hard-after-sale-log'
|
||||
import { displayPrice } from "/@/utils/formatMoney"
|
||||
import { data } from "autoprefixer";
|
||||
|
||||
// 定义查询字典
|
||||
const { hard_pay_type, hard_order_type, hard_order_status, hard_type } = useDict("hard_pay_type", "hard_order_type", "hard_order_status", "hard_type")
|
||||
|
||||
const { query } = useRoute()
|
||||
|
||||
const globalData = reactive<any>({
|
||||
detail: {},
|
||||
afterSaleData: {},
|
||||
log: []
|
||||
})
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
createdIsNeed: false,
|
||||
queryForm: {},
|
||||
pagination: {
|
||||
size: 100,
|
||||
},
|
||||
pageList: hardCar.getCarByOrderId
|
||||
})
|
||||
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state)
|
||||
|
||||
onMounted(async () => {
|
||||
await getDetail()
|
||||
})
|
||||
|
||||
const getDetail = async () => {
|
||||
const id = query.id as unknown as any
|
||||
if (!id) return
|
||||
state.queryForm.orderId = id
|
||||
const { data: orderData } = await hardOrder.getObj(id)
|
||||
globalData.detail = orderData
|
||||
getDataList()
|
||||
const { data: afterSaleData } = await hardAfterSaleApi.detailByOrderId({ orderId: id })
|
||||
if (afterSaleData && afterSaleData.id) {
|
||||
globalData.afterSaleData = afterSaleData
|
||||
const { data: log } = await hardAfterSaleApi.history(afterSaleData.id)
|
||||
globalData.log = log
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
:deep(.el-descriptions) {
|
||||
&:not(:nth-child(1)) {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.el-descriptions__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
&::before {
|
||||
display: inline-block;
|
||||
width: 3px;
|
||||
height: 20px;
|
||||
margin-right: 10px;
|
||||
background-color: #409eff;
|
||||
content: '';
|
||||
}
|
||||
}
|
||||
|
||||
.el-descriptions-item__container {
|
||||
margin: 0 10px;
|
||||
|
||||
.no-colon {
|
||||
margin: 0;
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 时间线样式调整
|
||||
:deep(.el-timeline) {
|
||||
margin: 10px 0 0 160px;
|
||||
|
||||
.el-timeline-item__wrapper {
|
||||
position: relative;
|
||||
top: -20px;
|
||||
|
||||
.el-timeline-item__timestamp {
|
||||
position: absolute !important;
|
||||
top: 10px;
|
||||
left: -150px;
|
||||
}
|
||||
}
|
||||
|
||||
.el-timeline-right-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-height: 30px;
|
||||
padding: 10px;
|
||||
background-color: var(--app-content-bg-color);
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 13px;
|
||||
border-color: transparent var(--app-content-bg-color) transparent transparent;
|
||||
/* 尖角颜色，左侧朝向 */
|
||||
border-style: solid;
|
||||
border-width: 8px;
|
||||
/* 调整尖角大小 */
|
||||
content: '';
|
||||
}
|
||||
}
|
||||
|
||||
.dot-node-style {
|
||||
position: absolute;
|
||||
left: -5px;
|
||||
display: flex;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
font-size: 10px;
|
||||
color: #fff;
|
||||
border-radius: 50%;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -26,7 +26,7 @@
|
||||
:header-cell-style="tableStyle.headerCellStyle" @selection-change="selectionChangHandle"
|
||||
@sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" label="#" width="40" />
|
||||
<el-table-column type="index" label="#" width="50" />
|
||||
<el-table-column prop="username" label="用户" />
|
||||
<el-table-column prop="userAvatar" label="头像">
|
||||
<template #default="{ row }">
|
||||
@@ -101,12 +101,13 @@
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="支付时间" align="center" prop="payTime" width="180px" />
|
||||
<el-table-column label="操作" width="150">
|
||||
<el-table-column label="操作" width="200">
|
||||
<template #default="{ row }">
|
||||
<el-button icon="ShoppingCartFull" text type="primary"
|
||||
@click="shopCarDialogRef.openDialog(row.id)">购物车</el-button>
|
||||
<el-button icon="WalletFilled" v-if="!row.payRefundId && row.orderType != 3 && row.orderType != 4 && false"
|
||||
link type="primary" @click="formDialogRef.openDialog(row)">
|
||||
<el-button icon="WalletFilled"
|
||||
v-if="!row.payRefundId && row.orderType != 3 && row.orderType != 4 && ['5', '10'].includes(row.orderStatus)"
|
||||
link type="primary" @click="doRefund(row)">
|
||||
退款
|
||||
</el-button>
|
||||
<el-button v-if="false" icon="edit-pen" text type="primary" v-auth="'hard_hardwareOrder_edit'"
|
||||
@@ -135,6 +136,8 @@ import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { useDict } from '/@/hooks/dict';
|
||||
import { displayPrice } from "/@/utils/formatMoney"
|
||||
|
||||
const { push } = useRouter()
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const ShopCar = defineAsyncComponent(() => import('../components/shop-car.vue'));
|
||||
@@ -187,6 +190,10 @@ const handleClick = (e: any) => {
|
||||
getDataList()
|
||||
}
|
||||
|
||||
const doRefund = (row: any) => {
|
||||
push({ path: '/hard/hard-after-sale/order-refund', query: { id: row.id } })
|
||||
}
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/hard/hardwareOrder/export', Object.assign(state.queryForm, { ids: selectObjs }), 'hardwareOrder.xlsx')
|
||||
|
||||
@@ -43,7 +43,7 @@ import { getObj, putObj } from "/@/api/wallet/wallet-setting"
|
||||
const dataFormRef = ref();
|
||||
const loading = ref(false)
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
const form = reactive<any>({
|
||||
id: undefined,
|
||||
afterSaleRefundReasons: undefined,
|
||||
afterSaleReturnReasons: undefined,
|
||||
@@ -62,13 +62,12 @@ onMounted(() => {
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => { });
|
||||
if (!valid) return false;
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
const pa = {
|
||||
...form,
|
||||
payPrice: storePrice(form.payPrice),
|
||||
bonusPrice: storePrice(form.bonusPrice),
|
||||
afterSaleRefundReasons: form.afterSaleRefundReasons?.join(","),
|
||||
afterSaleReturnReasons: form.afterSaleReturnReasons?.join(",")
|
||||
}
|
||||
await putObj(pa)
|
||||
useMessage().success('修改成功');
|
||||
@@ -85,7 +84,14 @@ const getwalletRechargePackageData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
getObj(id).then((res: any) => {
|
||||
Object.assign(form, res.data)
|
||||
const data: any = res.data;
|
||||
if (data.afterSaleRefundReasons) {
|
||||
data.afterSaleRefundReasons = data.afterSaleRefundReasons?.split(",")
|
||||
}
|
||||
if (data.afterSaleReturnReasons) {
|
||||
data.afterSaleReturnReasons = data.afterSaleReturnReasons?.split(",")
|
||||
}
|
||||
Object.assign(form, data)
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
|
||||
Reference in new issue
Block a user