From 505f5cfa0c543f779abe43d6d77f260991486fdf Mon Sep 17 00:00:00 2001 From: xiaobai <2511883673@qq.com> Date: Fri, 2 Jun 2023 16:10:33 +0800 Subject: [PATCH 1/2] =?UTF-8?q?=E4=B8=B4=E6=97=B6=E6=8F=90=E4=BA=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/mall/trade/order/index.ts | 14 + src/api/mall/trade/order/type/orderType.ts | 183 +++++++++++ src/utils/dict.ts | 14 +- src/views/mall/trade/order/index.vue | 348 +++++++++++++++++++++ 4 files changed, 557 insertions(+), 2 deletions(-) create mode 100644 src/api/mall/trade/order/index.ts create mode 100644 src/api/mall/trade/order/type/orderType.ts create mode 100644 src/views/mall/trade/order/index.vue diff --git a/src/api/mall/trade/order/index.ts b/src/api/mall/trade/order/index.ts new file mode 100644 index 00000000..22b8f205 --- /dev/null +++ b/src/api/mall/trade/order/index.ts @@ -0,0 +1,14 @@ +import request from '@/config/axios' + +// 获得交易订单分页 +export const getOrderList = (params: PageParam) => { + return request.get({ url: '/trade/order/page', params }) +} + +// // 获得交易订单详情 +// export function getOrderDetail(id) { +// return request({ +// url: '/trade/order/get-detail?id=' + id, +// method: 'get' +// }) +// } diff --git a/src/api/mall/trade/order/type/orderType.ts b/src/api/mall/trade/order/type/orderType.ts new file mode 100644 index 00000000..cba4fbff --- /dev/null +++ b/src/api/mall/trade/order/type/orderType.ts @@ -0,0 +1,183 @@ +export interface TradeOrderPageItemRespVO { + // 订单编号 + id: number + // 订单流水号 + no: string + // 下单时间 + createTime: Date + // 订单类型 + type: number + // 订单来源 + terminal: number + // 用户编号 + userId: number + // 用户 IP + userIp: string + // 用户备注 + userRemark: string + // 订单状态 + status: number + // 购买的商品数量 + productCount: number + // 订单完成时间 + finishTime?: Date + // 订单取消时间 + cancelTime?: Date + // 取消类型 + cancelType?: number + // 商家备注 + remark?: string + // 支付订单编号 + payOrderId: number + // 是否已支付 + payed: boolean + // 付款时间 + payTime?: Date + // 支付渠道 + payChannelCode: string + // 商品原价（总） + originalPrice: number + // 订单原价（总） + orderPrice: number + // 订单优惠（总） + discountPrice: number + // 运费金额 + deliveryPrice: number + // 订单调价（总） + adjustPrice: number + // 应付金额（总） + payPrice: number + // 配送模板编号 + deliveryTemplateId?: number + // 发货物流公司编号 + logisticsId?: number + // 发货物流单号 + logisticsNo?: string + // 发货状态 + deliveryStatus: number + // 发货时间 + deliveryTime?: Date + // 收货时间 + receiveTime?: Date + // 收件人名称 + receiverName: string + // 收件人手机 + receiverMobile: string + // 收件人地区编号 + receiverAreaId: number + // 收件人邮编 + receiverPostCode: number + // 收件人详细地址 + receiverDetailAddress: string + // 售后状态 + afterSaleStatus?: number + // 退款金额 + refundPrice: number + // 优惠劵编号 + couponId?: number + // 优惠劵减免金额 + couponPrice: number + // 积分抵扣的金额 + pointPrice: number + //收件人地区名字 + receiverAreaName: string + // 订单项列表 + items: TradeOrderItemBaseVO[] +} + +/** + * 交易订单项 Base VO，提供给添加、修改、详细的子 VO 使用 + * 如果子 VO 存在差异的字段，请不要添加到这里，影响 Swagger 文档生成 + */ +export interface TradeOrderItemBaseVO { + // ========== 订单项基本信息 ========== + /** + * 编号 + */ + id: number + /** + * 用户编号 + */ + userId: number + /** + * 订单编号 + */ + orderId: number + // ========== 商品基本信息 ========== + /** + * 商品 SPU 编号 + */ + spuId: number + /** + * 商品 SPU 名称 + */ + spuName: string + /** + * 商品 SKU 编号 + */ + skuId: number + /** + * 商品图片 + */ + picUrl: string + /** + * 购买数量 + */ + count: number + // ========== 价格 + 支付基本信息 ========== + /** + * 商品原价（总） + */ + originalPrice: number + /** + * 商品原价（单） + */ + originalUnitPrice: number + /** + * 商品优惠（总） + */ + discountPrice: number + /** + * 商品实付金额（总） + */ + payPrice: number + /** + * 子订单分摊金额（总） + */ + orderPartPrice: number + /** + * 分摊后子订单实付金额（总） + */ + orderDividePrice: number + // ========== 营销基本信息 ========== + // TODO 芋艿：在捉摸一下 + // ========== 售后基本信息 ========== + /** + * 售后状态 + */ + afterSaleStatus: number + //属性数组 + properties: ProductPropertyValueDetailRespVO[] +} + +/** + * 管理后台 - 商品属性值的明细 Response VO + */ +export interface ProductPropertyValueDetailRespVO { + /** + * 属性的编号 + */ + propertyId: number + /** + * 属性的名称 + */ + propertyName: string + /** + * 属性值的编号 + */ + valueId: number + /** + * 属性值的名称 + */ + valueName: string +} diff --git a/src/utils/dict.ts b/src/utils/dict.ts index d11debc9..c5f49566 100644 --- a/src/utils/dict.ts +++ b/src/utils/dict.ts @@ -33,7 +33,6 @@ export const getIntDictOptions = (dictType: string) => { value: parseInt(dict.value + '') }) }) - return dictOption } @@ -148,5 +147,16 @@ export enum DICT_TYPE { // ========== MALL 模块 ========== PRODUCT_UNIT = 'product_unit', // 商品单位 - PRODUCT_SPU_STATUS = 'product_spu_status' //商品状态 + PRODUCT_SPU_STATUS = 'product_spu_status', //商品状态 + + //===add by 20230530==== + // ========== MALL - ORDER 模块 ========== + TRADE_AFTER_SALE_STATUS = 'trade_after_sale_status', // 售后 - 状态 + TRADE_AFTER_SALE_WAY = 'trade_after_sale_way', // 售后 - 方式 + 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', // 订单项 - 售后状态 + + TERMINAL = 'terminal' } diff --git a/src/views/mall/trade/order/index.vue b/src/views/mall/trade/order/index.vue new file mode 100644 index 00000000..e5a1e28e --- /dev/null +++ b/src/views/mall/trade/order/index.vue @@ -0,0 +1,348 @@ + + From 985d764f623e24402b1ba91562d2994b28d1aeec Mon Sep 17 00:00:00 2001 From: xiaobai <2511883673@qq.com> Date: Tue, 6 Jun 2023 01:08:38 +0800 Subject: [PATCH 2/2] 20230606 add trade-order and details --- src/api/mall/trade/order/index.ts | 11 +- src/router/modules/remaining.ts | 16 + src/views/mall/trade/order/index.vue | 233 ++++++++++-- .../trade/order/tradeOrderDetail-crmeb.vue | 141 +++++++ .../mall/trade/order/tradeOrderDetail.vue | 355 ++++++++++++++++++ 5 files changed, 717 insertions(+), 39 deletions(-) create mode 100644 src/views/mall/trade/order/tradeOrderDetail-crmeb.vue create mode 100644 src/views/mall/trade/order/tradeOrderDetail.vue diff --git a/src/api/mall/trade/order/index.ts b/src/api/mall/trade/order/index.ts index 22b8f205..5a401030 100644 --- a/src/api/mall/trade/order/index.ts +++ b/src/api/mall/trade/order/index.ts @@ -5,10 +5,7 @@ export const getOrderList = (params: PageParam) => { return request.get({ url: '/trade/order/page', params }) } -// // 获得交易订单详情 -// export function getOrderDetail(id) { -// return request({ -// url: '/trade/order/get-detail?id=' + id, -// method: 'get' -// }) -// } +// 获得交易订单详情 +export const getOrderDetail = (id: number) => { + return request.get({ url: '/trade/order/get-detail?id=' + id }) +} diff --git a/src/router/modules/remaining.ts b/src/router/modules/remaining.ts index 4f5a16bd..6b7a2fd4 100644 --- a/src/router/modules/remaining.ts +++ b/src/router/modules/remaining.ts @@ -195,6 +195,22 @@ const remainingRouter: AppRouteRecordRaw[] = [ noTagsView: true } }, + { + path: '/trade/order', + component: Layout, + name: 'order', + meta: { + hidden: true + }, + children: [ + { + path: 'detail', + name: 'TradeOrderDetail', + component: () => import('@/views/mall/trade/order/tradeOrderDetail.vue'), + meta: { title: '订单详情', hidden: true } + } + ] + }, { path: '/403', component: () => import('@/views/Error/403.vue'), diff --git a/src/views/mall/trade/order/index.vue b/src/views/mall/trade/order/index.vue index e5a1e28e..61b22856 100644 --- a/src/views/mall/trade/order/index.vue +++ b/src/views/mall/trade/order/index.vue @@ -45,7 +45,7 @@ /> - + - - - + + + + + + @@ -93,13 +101,19 @@ 重置 + + + 导出TODO + - + - + + + + + @@ -218,8 +249,13 @@ @@ -242,17 +278,38 @@ import { DICT_TYPE, getStrDictOptions } from '@/utils/dict' import * as TradeOrderApi from '@/api/mall/trade/order' import { dateFormatter, formatDate } from '@/utils/formatTime' +import download from '@/utils/download' +// import TradeOrderDetail from './tradeOrderDetail.vue' +interface CurrentType { + checkTotal: number //选中的数量 + currentType: string //页面选中类型, 0-noPage无选中页面 1-currentPage 当前页面 2-allPage所有页面 + selectAll: boolean //全选标识 + multipleSelection: [] // 选中的数据 暂未记录,需考虑全选时数据应该如何处理 ,部分选中可以使用该数据,需要登记 + pageNoList: [] //当前页面选中的页号 如果再次选中当前页将取消本页面的选中数据 全选时 将所有的页面list 都放进去 再次全选时 全部清空 +} +const orderSelect: CurrentType = reactive({ + checkTotal: 0, + currentType: '0', + selectAll: false, + multipleSelection: [], + pageNoList: [] +}) +const message = useMessage() + +const { push } = useRouter() const queryFormRef = ref() //表单搜索 const queryParams = ref({ pageNo: 1, //首页 pageSize: 10, //页面大小 - searchType: '', - searchValue: '' + tabIndex: 0 //详情页面数据 }) + const loading = ref(false) +const exportLoading = ref(false) // 总记录数 const total = ref(0) + //表数据 const list = ref([]) //订单搜索 @@ -284,16 +341,115 @@ const searchList = ref([ ]) const imgViewVisible = ref(false) // 商品图预览 + const imageViewerList = ref([]) // 商品图预览列表 + +/**当前页 所有页 暂不考虑数据本地化 会导致选中当前页 从后台重新拉取数据时出现数据不一致*/ +const handleDropType = (command: string) => { + orderSelect.currentType = command + let i = 0 + if (command === '1') { + // pageNoList 当前页面选中的页号 如果再次选中当前页将取消本页面的选中数据 + //取消本页面记录 + var index = orderSelect.pageNoList.indexOf(queryParams.value.pageNo) + if (index > -1) { + for (i; i < list.value.length; i++) { + if (list.value[i]['itemSelect'] === true) { + list.value[i]['itemSelect'] = false + orderSelect.checkTotal = orderSelect.checkTotal - 1 + } + } + orderSelect.pageNoList.splice(index, 1) + } else { + for (i; i < list.value.length; i++) { + if (list.value[i]['itemSelect'] === false) { + list.value[i]['itemSelect'] = true + orderSelect.checkTotal = orderSelect.checkTotal + 1 + } + } + orderSelect.pageNoList.splice(0, 0, queryParams.value.pageNo) + } + } + if (command === '2') { + orderSelect.selectAll = !orderSelect.selectAll + //全选时 将所有的页面list 都放进去 再次全选时 全部清空 + if (orderSelect.selectAll) { + //打勾勾 + for (i; i < list.value.length; i++) { + list.value[i]['itemSelect'] = true + } + // 初始化页面数组 + const array1: [] = Array.from( + { length: total.value / queryParams.value.pageSize + 1 }, + (item, idx) => idx + 1 + ) + orderSelect.pageNoList = [] //清空原有的 + orderSelect.pageNoList = [].concat(array1) + orderSelect.checkTotal = total.value + } else { + //取消勾勾 + for (i; i < list.value.length; i++) { + list.value[i]['itemSelect'] = false + } + orderSelect.pageNoList = [] //清空 + orderSelect.checkTotal = 0 + } + } +} +/***复选框选中 */ +const handcheckclick = (row: any) => { + //选中增加1 + if (!row.itemSelect) { + // 取消 -1 + orderSelect.checkTotal = orderSelect.checkTotal - 1 + // + } else { + //选中 +1 + orderSelect.checkTotal = orderSelect.checkTotal + 1 + } +} +/** + * 导出数据 + */ + +const handleExport = async () => { + try { + // 导出的二次确认 + await message.exportConfirm() + // 发起导出 + exportLoading.value = true + //TODO导出的数据是后台导出还是从前端中获取数据(全选时数据怎么打印?) + download.excel(orderSelect.multipleSelection as any, '订单信息.xls') // + } catch { + } finally { + exportLoading.value = false + } + //TODO + exportLoading.value = false +} + /** 搜索按钮操作 */ const handleQuery = () => { + //选中状态初始化 + orderSelect.checkTotal = 0 + orderSelect.currentType = '0' + orderSelect.multipleSelection = [] + orderSelect.pageNoList = [] + orderSelect.selectAll = false + getList() } /** 重置按钮操作 */ const resetQuery = () => { + //选中状态初始化 + orderSelect.checkTotal = 0 + orderSelect.currentType = '0' + orderSelect.multipleSelection = [] + orderSelect.pageNoList = [] + orderSelect.selectAll = false + queryFormRef.value.resetFields() - console.log(queryParams) handleQuery() } @@ -303,6 +459,22 @@ const getList = async () => { const data = await TradeOrderApi.getOrderList(queryParams.value) list.value = data.list total.value = data.total + + let i = 0 + //给数组添加选中属性 itemSelect 默认为false 当前状态如果时全选 则新加载的页面都为选中状态 + if ( + orderSelect.currentType === '2' || //全选状态加载状态设置为选中 + orderSelect.pageNoList.indexOf(queryParams.value.pageNo) > -1 //已选择页面加载状态设置为默认选中，会存在选中当前页面后手动取消该页面部分数据，再重新加载该页面时设置为选中状态，但是没有增加选中的数量 + ) { + for (i; i < list.value.length; i++) { + list.value[i]['itemSelect'] = true + } + } else { + //还需要判断当前页面是否已经选中了? 而且还要出来选中的数据是否后来手动一行行取消了处理 + for (i; i < list.value.length; i++) { + list.value[i]['itemSelect'] = false //暂定为未选中状态, 实际情况需要考虑已选中状态,后期优化 + } + } } finally { loading.value = false } @@ -311,8 +483,9 @@ const getList = async () => { /** * 跳转订单详情 */ -const goOrderDetail = (row: any) => { - console.log('TODO Order Detail: ' + row.no) +const showOrderDetail = (row: any) => { + console.log('TODO Order Detail: ' + row.id) + push({ name: 'TradeOrderDetail', query: { id: row.id } }) } /** @@ -328,10 +501,6 @@ const sendXX = (row: any) => { console.log('TODO Send XX: ' + row.no) } -const handleSelectionChange = (val: list) => { - multipleSelection.value = val -} - /** * 商品图预览 * @param imgUrl diff --git a/src/views/mall/trade/order/tradeOrderDetail-crmeb.vue b/src/views/mall/trade/order/tradeOrderDetail-crmeb.vue new file mode 100644 index 00000000..ae4fe01c --- /dev/null +++ b/src/views/mall/trade/order/tradeOrderDetail-crmeb.vue @@ -0,0 +1,141 @@ + + + diff --git a/src/views/mall/trade/order/tradeOrderDetail.vue b/src/views/mall/trade/order/tradeOrderDetail.vue new file mode 100644 index 00000000..3e261550 --- /dev/null +++ b/src/views/mall/trade/order/tradeOrderDetail.vue @@ -0,0 +1,355 @@ + + +