huangge1199/vue-pro
1
0
Fork 0
mirror of https://gitee.com/huangge1199_admin/vue-pro.git synced 2024-11-22 23:31:52 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

trade：完成管理后台的订单详情的简单对接

Browse Source
This commit is contained in:
YunaiV 2022-12-10 21:02:32 +08:00
parent c5408965eb
commit b7d78a24a4
5 changed files with 102 additions and 136 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
yudao-module-mall/yudao-module-trade-api/src/main/java/cn/iocoder/yudao/module/trade/enums/order/TradeOrderItemAfterSaleStatusEnum.java
View File

@ -16,9 +16,9 @@ import java.util.Arrays;
@Getter
public enum TradeOrderItemAfterSaleStatusEnum implements IntArrayValuable {
NONE(0, "未申请"),
APPLY(1, "已申请"),
SUCCESS(2, "申请成功");
NONE(0, "未售后"),
APPLY(1, "售后中"),
SUCCESS(2, "已退款");
public static final int[] ARRAYS = Arrays.stream(values()).mapToInt(TradeOrderItemAfterSaleStatusEnum::getStatus).toArray();

3
yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/controller/admin/order/vo/TradeOrderBaseVO.java
View File

@ -24,6 +24,9 @@ public class TradeOrderBaseVO {
@ApiModelProperty(value = "创建时间", required = true, notes = "下单时间")
private Date createTime;
@ApiModelProperty(value = "订单类型", required = true, example = "1", notes = "参见 TradeOrderTypeEnum 枚举")
private Integer type;
@ApiModelProperty(value = "订单来源", required = true, example = "1", notes = "参见 TerminalEnum 枚举")
private Integer terminal;

1
yudao-ui-admin/src/utils/dict.js
View File

@ -67,6 +67,7 @@ export const DICT_TYPE = {
TRADE_AFTER_SALE_TYPE: 'trade_after_sale_type', // 售后 - 类型
TRADE_ORDER_TYPE: 'trade_order_type', // 订单 - 类型
TRADE_ORDER_STATUS: 'trade_order_status', // 订单 - 状态
TRADE_ORDER_ITEM_AFTER_SALE_STATUS: 'trade_order_item_after_sale_status', // 订单项 - 售后状态
// ========== MALL - PROMOTION 模块 ==========
PROMOTION_DISCOUNT_TYPE: 'promotion_discount_type', // 优惠类型

211
yudao-ui-admin/src/views/mall/trade/order/detail.vue
View File

@ -2,23 +2,104 @@
<div class="app-container order-detail-page">
<!-- 订单信息 -->
<el-descriptions title="订单信息">
<el-descriptions-item label="支付单号">123</el-descriptions-item>
<el-descriptions-item label="订单号">{{ order.no }}</el-descriptions-item>
<el-descriptions-item label="配送方式">物流配送</el-descriptions-item> <!-- TODO 芋艿：待实现 -->
<el-descriptions-item label="营销活动">物流配送</el-descriptions-item> <!-- TODO 芋艿：待实现 -->
<el-descriptions-item label="订单类型">
<dict-tag :type="DICT_TYPE.TRADE_ORDER_TYPE" :value="order.type" />
</el-descriptions-item>
<el-descriptions-item label="收货人">{{ order.receiverName }}</el-descriptions-item>
<el-descriptions-item label="买家留言">{{ order.userRemark }}</el-descriptions-item>
<el-descriptions-item label="订单来源">
<dict-tag :type="DICT_TYPE.TERMINAL" :value="order.terminal" />
</el-descriptions-item>
<el-descriptions-item label="联系电话">{{ order.receiverMobile }}</el-descriptions-item>
<el-descriptions-item label="商家备注">{{ order.remark }}</el-descriptions-item>
<el-descriptions-item label="支付单号">{{ order.payOrderId }}</el-descriptions-item>
<el-descriptions-item label="付款方式">
<dict-tag :type="DICT_TYPE.PAY_CHANNEL_CODE_TYPE" :value="order.payChannelCode" />
</el-descriptions-item>
<el-descriptions-item label="买家">{{ order.user.nickname }}</el-descriptions-item> <!-- TODO 芋艿：待实现：跳转会员 -->
<el-descriptions-item label="收货地址">
{{ order.receiverAreaName }} &nbsp; {{ order.receiverDetailAddress }} &nbsp;
<el-link v-clipboard:copy="order.receiverAreaName + ' ' + order.receiverDetailAddress"
v-clipboard:success="clipboardSuccess" icon="el-icon-document-copy" type="primary"/>
</el-descriptions-item>
</el-descriptions>
<!-- 订单状态 -->
<el-descriptions title="订单状态" :column="1">
<el-descriptions-item label="订单状态">
<dict-tag :type="DICT_TYPE.TRADE_ORDER_STATUS" :value="order.status" />
</el-descriptions-item>
<el-descriptions-item label-class-name="no-colon">
<el-button type="primary" size="small">调整价格</el-button> <!-- TODO 芋艿：待实现 -->
<el-button type="primary" size="small">备注</el-button> <!-- TODO 芋艿：待实现 -->
<el-button type="primary" size="small">发货</el-button> <!-- TODO 芋艿：待实现 -->
<el-button type="primary" size="small">关闭订单</el-button> <!-- TODO 芋艿：待实现 -->
<el-button type="primary" size="small">修改地址</el-button> <!-- TODO 芋艿：待实现 -->
<el-button type="primary" size="small">打印电子面单</el-button> <!-- TODO 芋艿：待实现 -->
<el-button type="primary" size="small">打印发货单</el-button> <!-- TODO 芋艿：待实现 -->
<el-button type="primary" size="small">确认收货</el-button> <!-- TODO 芋艿：待实现 -->
</el-descriptions-item>
<el-descriptions-item label="提醒" label-style="color: red">
买家付款成功后，货款将直接进入您的商户号（微信、支付宝）<br />
请及时关注你发出的包裹状态，确保可以配送至买家手中 <br />
如果买家表示没收到货或货物有问题，请及时联系买家处理，友好协商
</el-descriptions-item>
</el-descriptions>
<!-- 物流信息 TODO -->
<!-- 商品信息 -->
<el-descriptions title="商品信息" :column="6">
<el-descriptions-item labelClassName="no-colon">
<el-table :data="order.items" border>
<el-table-column prop="spuName" label="商品" width="700">
<template slot-scope="{ row }">
{{row.spuName}}
<el-tag size="medium" v-for="property in row.properties">{{property.propertyName}}：{{property.valueName}}</el-tag>
</template>
</el-table-column>
<el-table-column prop="originalUnitPrice" label="单价(元)" width="180">
<template slot-scope="{ row }">
￥{{ (row.originalUnitPrice / 100.0).toFixed(2) }}
</template>
</el-table-column>
<el-table-column prop="count" label="数量" width="180"/>
<el-table-column prop="originalPrice" label="小计（元）" width="180">
<template slot-scope="{ row }">
￥{{ (row.originalPrice / 100.0).toFixed(2) }}
</template>
</el-table-column>
<el-table-column prop="afterSaleStatus" label="退款状态">
<template slot-scope="{ row }">
<dict-tag :type="DICT_TYPE.TRADE_ORDER_ITEM_AFTER_SALE_STATUS" :value="row.afterSaleStatus" />
</template>
</el-table-column>
</el-table>
</el-descriptions-item>
<el-descriptions-item v-for="(item,index) in 5" label-class-name="no-colon" /> <!-- 占位 -->
<el-descriptions-item label="商品总额">￥{{ (order.originalPrice / 100.0).toFixed(2) }}</el-descriptions-item>
<el-descriptions-item label="运费金额">￥{{ (order.deliveryPrice / 100.0).toFixed(2) }}</el-descriptions-item>
<el-descriptions-item label="订单调价">￥{{ (order.adjustPrice / 100.0).toFixed(2) }}</el-descriptions-item>
<el-descriptions-item label="商品优惠" label-style="color: red">
￥{{ ((order.originalPrice - order.originalPrice) / 100.0).toFixed(2) }}
</el-descriptions-item>
<el-descriptions-item label="订单优惠" label-style="color: red">
￥{{ (order.discountPrice / 100.0).toFixed(2) }}
</el-descriptions-item>
<el-descriptions-item label="积分抵扣" label-style="color: red">
￥{{ (order.pointPrice / 100.0).toFixed(2) }}
</el-descriptions-item>
<el-descriptions-item v-for="(item,index) in 5" label-class-name="no-colon" /> <!-- 占位 -->
<el-descriptions-item label="应付金额">
￥{{ (order.payPrice / 100.0).toFixed(2) }}
</el-descriptions-item>
</el-descriptions>
<template v-for="(group, index) in detailGroups">
<el-descriptions v-bind="group.groupProps" :key="`group_${index}`" :title="group.title">
<!-- 商品信息 -->
<el-descriptions-item v-if="group.key === 'goodsInfo'" labelClassName="no-colon">
<el-table border>
<el-table-column prop="date" label="商品" width="180"/>
<el-table-column prop="jg" label="价格"/>
<el-table-column prop="spbm" label="商品编码"/>
<el-table-column prop="xl" label="数量"/>
<el-table-column prop="xj" label="小计（元）"/>
<el-table-column prop="tkzt" label="退款状态"/>
<el-table-column prop="zt" label="状态"/>
</el-table>
</el-descriptions-item>
<!-- 订单操作日志 -->
<el-descriptions-item v-if="group.key === 'orderLog'" labelClassName="no-colon">
@ -74,30 +155,12 @@
</el-tab-pane>
</el-tabs>
</el-descriptions-item>
<!--订单详情、订单状态-->
<el-descriptions-item v-else v-for="(child, cIdx) in group.children" v-bind="child.childProps" :key="`child_${cIdx}`" :label="child.label">
<!-- 操作按钮(订单状态)-->
<template v-if="group.key === 'orderStatus' && child.valueKey === 'actions'" slot="label">
<el-button type="primary">备注</el-button>
<el-button type="primary">打印发货单</el-button>
</template>
<!-- 内容 -->
<template v-else>
{{detailInfo[child.valueKey]}}
<!--复制地址(订单详情) -->
<el-link v-if="child.valueKey==='shdz'" v-clipboard:copy="detailInfo[child.valueKey]" v-clipboard:success="clipboardSuccess" icon="el-icon-document-copy" type="primary"/>
</template>
</el-descriptions-item>
</el-descriptions>
</template>
</div>
</template>
<script>
import {DICT_TYPE, getDictDatas} from "@/utils/dict";
import { getOrderDetail } from "@/api/mall/trade/order";
export default {
@ -105,36 +168,6 @@ export default {
data () {
return {
detailGroups: [
{
title: '订单详情',
children: [
{ label: '支付单号', valueKey: 'jylsh'},
{ label: '配送方式', valueKey: 'psfs'},
{ label: '营销活动', valueKey: 'yxhd'},
{ label: '订单编号', valueKey: 'ddbh'},
{ label: '收货人', valueKey: 'shr'},
{ label: '买家留言', valueKey: 'mjly'},
{ label: '订单类型', valueKey: 'ddlx'},
{ label: '联系电话', valueKey: 'lxdh'},
{ label: '备注', valueKey: 'bz'},
{ label: '订单来源', valueKey: 'ddly'},
{ label: '付款方式', valueKey: 'fkfs'},
{ label: '买家', valueKey: 'mj'},
{ label: '收货地址', valueKey: 'shdz'}
]
},
{
title: '订单状态',
key: 'orderStatus',
groupProps: {
column: 1
},
children: [
{ label: '订单状态', valueKey: 'ddzt', childProps: { contentStyle: { color: 'red' }}},
{ label: '', valueKey: 'actions', childProps: { labelClassName: 'no-colon'}},
{ label: '提醒', valueKey: 'tx', childProps: { labelStyle: { color: 'red' }}}
]
},
{
title: '物流信息',
key: 'expressInfo',
@ -142,36 +175,16 @@ export default {
{ label: '发货时间', valueKey: 'fhsj'},
{ label: '物流公司', valueKey: 'wlgs'},
{ label: '运单号', valueKey: 'ydh'},
{ label: '商品信息', valueKey: 'goodsList', childProps: { span: 3 }},
{ label: '物流状态', valueKey: 'wlzt', childProps: { span: 3 }},
{ label: '物流详情', valueKey: 'wlxq'}
]
},
{
title: '商品信息',
key: 'goodsInfo'
},
{
title: '订单操作日志',
key: 'orderLog'
}
],
detailInfo: {
jylsh: '16674653573152181000',
psfs: '物流配送',
yxhd: '',
ddbh: '20221103164918001',
shr: '',
mjly: '',
ddlx: '',
lxdh: '',
bz: '',
ddly: '',
shdz: '陕西省-西安市-莲湖区-九座花园西区(莲湖区二环南路西段202)陕西省-西安市-莲湖区-九座花园西区(莲湖区二环南路西段202)',
fkfs: '',
mj: '',
ddzt: '已完成',
tx: '买家付款成功后，货款将直接进入您的商户号（微信、支付宝）请及时关注你发出的包裹状态，确保可以配送至买家手中如果买家表示没收到货或货物有问题，请及时联系买家处理，友好协商',
expressInfo: [ // 物流信息
{
label: '包裹1',
@ -201,42 +214,7 @@ export default {
content: '快件已发车',
timestamp: '2018-04-11 12:55:52'
}
],
goodsList: [ // 包裹下的商品列表
{
name: 'Otic 巴拉啦小魔仙联名麦克风儿童早教家用一体卡拉OK宝宝话筒唱歌 魔仙粉',
count: 6,
imgUrl: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'
},
{
name: 'Otic 巴拉啦小魔仙联名麦克风儿童早教家用一体卡拉OK宝宝话筒唱歌 魔仙粉',
count: 6,
imgUrl: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'
},
{
name: 'Otic 巴拉啦小魔仙联名麦克风儿童早教家用一体卡拉OK宝宝话筒唱歌 魔仙粉',
count: 6,
imgUrl: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'
}
]
},
{
label: '包裹2',
name: 'bg1',
fhsj: '',
wlgs: '',
ydh: '',
wlzt: '',
goodsInfo: {}
},
{
label: '包裹3',
name: 'bg1',
fhsj: '',
wlgs: '',
ydh: '',
wlzt: '',
goodsInfo: {}
}
],
orderLog: [ // 订单操作日志
@ -253,6 +231,7 @@ export default {
},
order: {
items: [],
user: {},
},
}
},

17
yudao-ui-admin/src/views/mall/trade/order/index.vue
View File

@ -89,23 +89,6 @@
</el-col>
<el-col :span="6" align="right">
<el-button type="text" @click="goToDetail(row)">详情</el-button>
<el-dropdown style="margin-left: 10px">
<el-button type="text">
更多操作<i class="el-icon-arrow-down el-icon--right"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<!-- TODO @芋艿：【暂未开发】关闭订单 -->
<el-dropdown-item><el-button type="text">关闭订单</el-button></el-dropdown-item>
<!-- TODO @芋艿：【暂未开发】修改地址 -->
<el-dropdown-item><el-button type="text">修改地址</el-button></el-dropdown-item>
<!-- TODO @芋艿：【暂未开发】调整价格 -->
<el-dropdown-item><el-button type="text">调整价格</el-button></el-dropdown-item>
<!-- TODO @芋艿：【暂未开发】备注 -->
<el-dropdown-item><el-button type="text">备注</el-button></el-dropdown-item>
<!-- TODO @芋艿：【暂未开发】关闭订单 -->
<el-dropdown-item><el-button type="text">打印发货单</el-button></el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</el-col>
</el-row>
<!-- 订单下的商品 -->