Merge remote-tracking branch 'origin/dev' into owen_dev
This commit is contained in:
commit
ec412f7a7f
@ -9,18 +9,19 @@ export interface Property {
|
||||
|
||||
export interface Sku {
|
||||
id?: number // 商品 SKU 编号
|
||||
name?: string // 商品 SKU 名称
|
||||
spuId?: number // SPU 编号
|
||||
properties?: Property[] // 属性数组
|
||||
price?: number // 商品价格
|
||||
marketPrice?: number // 市场价
|
||||
costPrice?: number // 成本价
|
||||
price?: number | string // 商品价格
|
||||
marketPrice?: number | string // 市场价
|
||||
costPrice?: number | string // 成本价
|
||||
barCode?: string // 商品条码
|
||||
picUrl?: string // 图片地址
|
||||
stock?: number // 库存
|
||||
weight?: number // 商品重量,单位:kg 千克
|
||||
volume?: number // 商品体积,单位:m^3 平米
|
||||
subCommissionFirstPrice?: number // 一级分销的佣金
|
||||
subCommissionSecondPrice?: number // 二级分销的佣金
|
||||
subCommissionFirstPrice?: number | string // 一级分销的佣金
|
||||
subCommissionSecondPrice?: number | string // 二级分销的佣金
|
||||
salesCount?: number // 商品销量
|
||||
}
|
||||
|
||||
|
@ -102,20 +102,20 @@ export interface DeliveryVO {
|
||||
|
||||
// 订单发货
|
||||
export const delivery = async (data: DeliveryVO) => {
|
||||
return await request.post({ url: `/trade/order/delivery`, data })
|
||||
return await request.put({ url: `/trade/order/delivery`, data })
|
||||
}
|
||||
|
||||
// 订单备注
|
||||
export const remark = async (data) => {
|
||||
return await request.post({ url: `/trade/order/remark`, data })
|
||||
export const updateRemark = async (data: any) => {
|
||||
return await request.put({ url: `/trade/order/update-remark`, data })
|
||||
}
|
||||
|
||||
// 订单调价
|
||||
export const adjustPrice = async (data) => {
|
||||
return await request.post({ url: `/trade/order/adjust-price`, data })
|
||||
export const updatePrice = async (data: any) => {
|
||||
return await request.put({ url: `/trade/order/update-price`, data })
|
||||
}
|
||||
|
||||
// 修改订单地址
|
||||
export const adjustAddress = async (data) => {
|
||||
return await request.post({ url: `/trade/order/adjust-address`, data })
|
||||
export const updateAddress = async (data: any) => {
|
||||
return await request.put({ url: `/trade/order/update-address`, data })
|
||||
}
|
||||
|
@ -346,22 +346,6 @@ const remainingRouter: AppRouteRecordRaw[] = [
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/property', // TODO @puhui999:这里的 path 有问题,应该是 /product/property
|
||||
component: Layout,
|
||||
name: 'Property',
|
||||
meta: {
|
||||
hidden: true
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'value/:propertyId(\\d+)',
|
||||
component: () => import('@/views/mall/product/property/value/index.vue'),
|
||||
name: 'ProductPropertyValue',
|
||||
meta: { title: '商品属性值', icon: '', activeMenu: '/product/property' }
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/product',
|
||||
component: Layout,
|
||||
@ -408,6 +392,19 @@ const remainingRouter: AppRouteRecordRaw[] = [
|
||||
title: '商品详情',
|
||||
activeMenu: '/product/product-spu'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'property/value/:propertyId(\\d+)',
|
||||
component: () => import('@/views/mall/product/property/value/index.vue'),
|
||||
name: 'ProductPropertyValue',
|
||||
meta: {
|
||||
noCache: true,
|
||||
hidden: true,
|
||||
canTo: true,
|
||||
icon: 'ep:view',
|
||||
title: '商品属性值',
|
||||
activeMenu: '/product/property'
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -421,7 +418,7 @@ const remainingRouter: AppRouteRecordRaw[] = [
|
||||
children: [
|
||||
{
|
||||
path: 'detail/:orderId(\\d+)',
|
||||
component: () => import('@/views/mall/trade/order/components/OrderDetailForm.vue'),
|
||||
component: () => import('@/views/mall/trade/order/detail/index.vue'),
|
||||
name: 'TradeOrderDetailForm',
|
||||
meta: { title: '订单详情', icon: '', activeMenu: '/trade/trade/order' }
|
||||
}
|
||||
|
@ -131,7 +131,7 @@ export enum DICT_TYPE {
|
||||
BPM_OA_LEAVE_TYPE = 'bpm_oa_leave_type',
|
||||
|
||||
// ========== PAY 模块 ==========
|
||||
PAY_CHANNEL_CODE = 'pay_channel_code', // 支付渠道编码类型
|
||||
PAY_CHANNEL_CODE = 'pay_channel_code_type', // 支付渠道编码类型
|
||||
PAY_ORDER_STATUS = 'pay_order_status', // 商户支付订单状态
|
||||
PAY_REFUND_STATUS = 'pay_refund_status', // 退款订单状态
|
||||
PAY_NOTIFY_STATUS = 'pay_notify_status', // 商户支付回调状态
|
||||
|
@ -174,7 +174,6 @@ export const copyValueToTarget = (target, source) => {
|
||||
Object.assign(target, newObj)
|
||||
}
|
||||
|
||||
// TODO @puhui999:返回要带上 .00 哈.例如说 1.00
|
||||
/**
|
||||
* 将一个整数转换为分数保留两位小数
|
||||
* @param num
|
||||
@ -185,6 +184,31 @@ export const formatToFraction = (num: number | string | undefined): number => {
|
||||
return parseFloat((parsedNumber / 100).toFixed(2))
|
||||
}
|
||||
|
||||
/**
|
||||
* 将一个数转换为 1.00 这样
|
||||
* 数据呈现的时候使用
|
||||
*
|
||||
* @param num 整数
|
||||
*/
|
||||
export const floatToFixed2 = (num: number | string | undefined): string => {
|
||||
let str = '0.00'
|
||||
if (typeof num === 'undefined') {
|
||||
return str
|
||||
}
|
||||
const f = formatToFraction(num)
|
||||
const decimalPart = f.toString().split('.')[1]
|
||||
const len = decimalPart ? decimalPart.length : 0
|
||||
switch (len) {
|
||||
case 0:
|
||||
str = f.toString() + '.00'
|
||||
break
|
||||
case 1:
|
||||
str = f.toString() + '0'
|
||||
break
|
||||
}
|
||||
return str
|
||||
}
|
||||
|
||||
/**
|
||||
* 将一个分数转换为整数
|
||||
* @param num
|
||||
|
@ -36,6 +36,7 @@
|
||||
<el-form-item label="评论内容" prop="content">
|
||||
<el-input type="textarea" v-model="formData.content" />
|
||||
</el-form-item>
|
||||
<!-- TODO @疯狂:formData.scores 是通过后端计算的哈,不要前端传递 -->
|
||||
<el-form-item label="评分星级" prop="scores">
|
||||
<el-rate v-model="formData.scores" />
|
||||
</el-form-item>
|
||||
|
@ -37,6 +37,7 @@ import { ElTable } from 'element-plus'
|
||||
import * as ProductSpuApi from '@/api/mall/product/spu'
|
||||
import { propTypes } from '@/utils/propTypes'
|
||||
|
||||
// TODO @疯狂:是不是挪到 spu 的 components 下哈
|
||||
defineOptions({ name: 'SkuTableSelect' })
|
||||
|
||||
const props = defineProps({
|
||||
|
@ -86,6 +86,7 @@ import { defaultProps, handleTree } from '@/utils/tree'
|
||||
import * as ProductCategoryApi from '@/api/mall/product/category'
|
||||
import * as ProductSpuApi from '@/api/mall/product/spu'
|
||||
|
||||
// TODO @疯狂:是不是挪到 spu 的 components 下哈
|
||||
defineOptions({ name: 'SpuTableSelect' })
|
||||
|
||||
const message = useMessage() // 消息弹窗
|
||||
|
@ -60,6 +60,7 @@
|
||||
<ContentWrap>
|
||||
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="false">
|
||||
<el-table-column label="评论编号" align="center" prop="id" min-width="60" />
|
||||
<!-- TODO @疯狂:后端貌似没读取? -->
|
||||
<el-table-column label="用户名称" align="center" prop="userNickname" width="80" />
|
||||
<el-table-column label="商品信息" align="center" min-width="210">
|
||||
<template #default="scope">
|
||||
@ -210,7 +211,7 @@ const getList = async () => {
|
||||
loading.value = true
|
||||
try {
|
||||
const data = await CommentApi.getCommentPage(queryParams)
|
||||
// visible 如果为 null,会导致刷新的时候触发e-switch的change事件
|
||||
// visible 如果为 null,会导致刷新的时候触发 e-switch 的 change 事件
|
||||
data.list.forEach((item) => {
|
||||
if (!item.visible) {
|
||||
item.visible = false
|
||||
@ -241,6 +242,7 @@ const openForm = (type: string, id?: number) => {
|
||||
formRef.value.open(type, id)
|
||||
}
|
||||
|
||||
// TODO @疯狂:要不回复,也搞一个组件出去?
|
||||
/** 回复 **/
|
||||
const replyFormRef = ref()
|
||||
const replyDialog = reactive({
|
||||
|
@ -101,6 +101,7 @@
|
||||
import { dateFormatter } from '@/utils/formatTime'
|
||||
import * as PropertyApi from '@/api/mall/product/property'
|
||||
import PropertyForm from './PropertyForm.vue'
|
||||
|
||||
const { push } = useRouter()
|
||||
|
||||
defineOptions({ name: 'ProductProperty' })
|
||||
@ -164,7 +165,7 @@ const handleDelete = async (id: number) => {
|
||||
|
||||
/** 跳转商品属性列表 */
|
||||
const goValueList = (id: number) => {
|
||||
push({ path: '/property/value/' + id })
|
||||
push({ path: '/product/property/value/' + id })
|
||||
}
|
||||
|
||||
/** 初始化 **/
|
||||
|
@ -42,7 +42,9 @@ import { useTagsViewStore } from '@/store/modules/tagsView'
|
||||
import { BasicInfoForm, DescriptionForm, OtherSettingsForm } from './components'
|
||||
// 业务api
|
||||
import * as ProductSpuApi from '@/api/mall/product/spu'
|
||||
import { convertToInteger, formatToFraction } from '@/utils'
|
||||
import { convertToInteger, floatToFixed2, formatToFraction } from '@/utils'
|
||||
|
||||
// TODO @芋艿:后续稍微调整下;
|
||||
|
||||
defineOptions({ name: 'ProductSpuForm' })
|
||||
|
||||
@ -107,12 +109,20 @@ const getDetail = async () => {
|
||||
try {
|
||||
const res = (await ProductSpuApi.getSpu(id)) as ProductSpuApi.Spu
|
||||
res.skus?.forEach((item) => {
|
||||
if (isDetail.value === true) {
|
||||
item.price = floatToFixed2(item.price)
|
||||
item.marketPrice = floatToFixed2(item.marketPrice)
|
||||
item.costPrice = floatToFixed2(item.costPrice)
|
||||
item.subCommissionFirstPrice = floatToFixed2(item.subCommissionFirstPrice)
|
||||
item.subCommissionSecondPrice = floatToFixed2(item.subCommissionSecondPrice)
|
||||
} else {
|
||||
// 回显价格分转元
|
||||
item.price = formatToFraction(item.price)
|
||||
item.marketPrice = formatToFraction(item.marketPrice)
|
||||
item.costPrice = formatToFraction(item.costPrice)
|
||||
item.subCommissionFirstPrice = formatToFraction(item.subCommissionFirstPrice)
|
||||
item.subCommissionSecondPrice = formatToFraction(item.subCommissionSecondPrice)
|
||||
}
|
||||
})
|
||||
formData.value = res
|
||||
} finally {
|
||||
@ -132,19 +142,19 @@ const submitForm = async () => {
|
||||
await unref(descriptionRef)?.validate()
|
||||
await unref(otherSettingsRef)?.validate()
|
||||
// 深拷贝一份, 这样最终 server 端不满足,不需要恢复,
|
||||
const deepCopyFormData = cloneDeep(unref(formData.value))
|
||||
const deepCopyFormData = cloneDeep(unref(formData.value)) as ProductSpuApi.Spu
|
||||
// 兜底处理 sku 空数据
|
||||
formData.value.skus!.forEach((sku) => {
|
||||
// 因为是空数据这里判断一下商品条码是否为空就行
|
||||
if (sku.barCode === '') {
|
||||
const index = deepCopyFormData.skus.findIndex(
|
||||
const index = deepCopyFormData.skus!.findIndex(
|
||||
(item) => JSON.stringify(item.properties) === JSON.stringify(sku.properties)
|
||||
)
|
||||
// 删除这条 sku
|
||||
deepCopyFormData.skus.splice(index, 1)
|
||||
deepCopyFormData.skus!.splice(index, 1)
|
||||
}
|
||||
})
|
||||
deepCopyFormData.skus.forEach((item) => {
|
||||
deepCopyFormData.skus!.forEach((item) => {
|
||||
// 给sku name赋值
|
||||
item.name = deepCopyFormData.name
|
||||
// sku相关价格元转分
|
||||
@ -156,7 +166,7 @@ const submitForm = async () => {
|
||||
})
|
||||
// 处理轮播图列表
|
||||
const newSliderPicUrls: any[] = []
|
||||
deepCopyFormData.sliderPicUrls.forEach((item: any) => {
|
||||
deepCopyFormData.sliderPicUrls!.forEach((item: any) => {
|
||||
// 如果是前端选的图
|
||||
typeof item === 'object' ? newSliderPicUrls.push(item.url) : newSliderPicUrls.push(item)
|
||||
})
|
||||
|
@ -7,7 +7,6 @@ import SkuList from './SkuList.vue'
|
||||
|
||||
import { Spu } from '@/api/mall/product/spu'
|
||||
|
||||
// TODO @puhui999:Properties 改成 Property 更合适?Property 在 Spu 中已存在避免冲突 PropertyAndValues
|
||||
interface PropertyAndValues {
|
||||
id: number
|
||||
name: string
|
||||
|
@ -80,7 +80,7 @@
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column type="expand" width="30">
|
||||
<template #default="{ row }">
|
||||
<el-form class="demo-table-expand" label-position="left">
|
||||
<el-form class="spu-table-expand" label-position="left">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-row>
|
||||
@ -91,12 +91,12 @@
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="市场价:">
|
||||
<span>{{ formatToFraction(row.marketPrice) }}</span>
|
||||
<span>{{ floatToFixed2(row.marketPrice) }}元</span>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="成本价:">
|
||||
<span>{{ formatToFraction(row.costPrice) }}</span>
|
||||
<span>{{ floatToFixed2(row.costPrice) }}元</span>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -130,9 +130,7 @@
|
||||
</el-table-column>
|
||||
<el-table-column :show-overflow-tooltip="true" label="商品名称" min-width="300" prop="name" />
|
||||
<el-table-column align="center" label="商品售价" min-width="90" prop="price">
|
||||
<template #default="{ row }">
|
||||
{{ formatToFraction(row.price) }}
|
||||
</template>
|
||||
<template #default="{ row }"> {{ floatToFixed2(row.price) }}元</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="销量" min-width="90" prop="salesCount" />
|
||||
<el-table-column align="center" label="库存" min-width="90" prop="stock" />
|
||||
@ -229,7 +227,7 @@ import { createImageViewer } from '@/components/ImageViewer'
|
||||
import { dateFormatter } from '@/utils/formatTime'
|
||||
import { checkSelectedNode, defaultProps, handleTree, treeToString } from '@/utils/tree'
|
||||
import { ProductSpuStatusEnum } from '@/utils/constants'
|
||||
import { formatToFraction } from '@/utils'
|
||||
import { floatToFixed2 } from '@/utils'
|
||||
import download from '@/utils/download'
|
||||
import * as ProductSpuApi from '@/api/mall/product/spu'
|
||||
import * as ProductCategoryApi from '@/api/mall/product/category'
|
||||
@ -392,7 +390,7 @@ const resetQuery = () => {
|
||||
const openForm = (id?: number) => {
|
||||
// 修改
|
||||
if (typeof id === 'number') {
|
||||
push('/product/spu/edit/' + id)
|
||||
push({ name: 'ProductSpuEdit', params: { spuId: id } })
|
||||
return
|
||||
}
|
||||
// 新增
|
||||
@ -402,8 +400,8 @@ const openForm = (id?: number) => {
|
||||
/**
|
||||
* 查看商品详情
|
||||
*/
|
||||
const openDetail = (id?: number) => {
|
||||
push('/product/spu/detail/' + id)
|
||||
const openDetail = (id: number) => {
|
||||
push({ name: 'ProductSpuDetail', params: { spuId: id } })
|
||||
}
|
||||
|
||||
/** 导出按钮操作 */
|
||||
@ -458,7 +456,7 @@ onMounted(async () => {
|
||||
})
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.demo-table-expand {
|
||||
.spu-table-expand {
|
||||
padding-left: 42px;
|
||||
|
||||
:deep(.el-form-item__label) {
|
||||
|
@ -193,16 +193,4 @@ const resetForm = async () => {
|
||||
await nextTick()
|
||||
formRef.value.getElFormRef().resetFields()
|
||||
}
|
||||
// TODO @puhui999:下面的 css 名字,是不是可以改下;demo-table-expand
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.demo-table-expand {
|
||||
padding-left: 42px;
|
||||
|
||||
:deep(.el-form-item__label) {
|
||||
width: 82px;
|
||||
font-weight: bold;
|
||||
color: #99a9bf;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -2,12 +2,12 @@
|
||||
<Dialog v-model="dialogVisible" title="订单发货" width="25%">
|
||||
<el-form ref="formRef" v-loading="formLoading" :model="formData" label-width="80px">
|
||||
<el-form-item label="发货方式">
|
||||
<el-radio-group v-model="radio">
|
||||
<el-radio border label="1">快递物流</el-radio>
|
||||
<el-radio border label="2">无需发货</el-radio>
|
||||
<el-radio-group v-model="expressType">
|
||||
<el-radio border label="express">快递物流</el-radio>
|
||||
<el-radio border label="none">无需发货</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<template v-if="radio === '1'">
|
||||
<template v-if="expressType === 'express'">
|
||||
<el-form-item label="物流公司">
|
||||
<el-select v-model="formData.logisticsId" placeholder="请选择" style="width: 100%">
|
||||
<el-option
|
||||
@ -32,16 +32,17 @@
|
||||
<script lang="ts" setup>
|
||||
import * as DeliveryExpressApi from '@/api/mall/trade/delivery/express'
|
||||
import * as TradeOrderApi from '@/api/mall/trade/order'
|
||||
import { copyValueToTarget } from '@/utils'
|
||||
|
||||
// TODO @puhui999:是不是名字叫 OrderDeliveryForm 保持统一
|
||||
defineOptions({ name: 'DeliveryOrderForm' })
|
||||
// TODO @puhui999:要不 Form 保持和别的模块一样,和 index.vue 放在一个目录下,不作为 components;components 更多要支持给多个模块使用哈。
|
||||
defineOptions({ name: 'OrderDeliveryForm' })
|
||||
|
||||
const { t } = useI18n() // 国际化
|
||||
const message = useMessage() // 消息弹窗
|
||||
|
||||
const dialogVisible = ref(false) // 弹窗的是否展示
|
||||
const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用
|
||||
const radio = ref('1') // TODO @puhui999:尽量不用 radio 这种命名,无业务含义。这里的话,可以考虑用 expressType,如果值是 express,则是快递;none 则是无;未来做同城配送,就比较容易拓展啦;
|
||||
const expressType = ref('express') // 如果值是 express,则是快递;none 则是无;未来做同城配送;
|
||||
const formData = ref<TradeOrderApi.DeliveryVO>({
|
||||
id: 0, // 订单编号
|
||||
logisticsId: null, // 物流公司编号
|
||||
@ -49,12 +50,14 @@ const formData = ref<TradeOrderApi.DeliveryVO>({
|
||||
})
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
// TODO @puhui999:每次点击发货的时候,是不是可以把之前的信息带过来哈。
|
||||
/** 打开弹窗 */
|
||||
const open = async (orderId: number) => {
|
||||
const open = async (row: TradeOrderApi.OrderVO) => {
|
||||
resetForm()
|
||||
// 设置数据
|
||||
formData.value.id = orderId
|
||||
copyValueToTarget(formData.value, row)
|
||||
if (row.logisticsId === null || row.logisticsId === 0) {
|
||||
expressType.value = 'none'
|
||||
}
|
||||
dialogVisible.value = true
|
||||
}
|
||||
defineExpose({ open }) // 提供 open 方法,用于打开弹窗
|
||||
@ -66,7 +69,7 @@ const submitForm = async () => {
|
||||
formLoading.value = true
|
||||
try {
|
||||
const data = unref(formData)
|
||||
if (radio.value === '2') {
|
||||
if (expressType.value === 'none') {
|
||||
// 无需发货的情况
|
||||
data.logisticsId = 0
|
||||
data.logisticsNo = ''
|
@ -1,18 +1,27 @@
|
||||
<template>
|
||||
<Dialog v-model="dialogVisible" title="修改订单收货地址" width="35%">
|
||||
<el-form ref="formRef" v-loading="formLoading" :model="formData" label-width="120px">
|
||||
<el-form-item label="收件人名称">
|
||||
<el-input v-model="formData.receiverName" />
|
||||
<el-form-item label="收件人">
|
||||
<el-input v-model="formData.receiverName" placeholder="请输入收件人名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="收件人手机">
|
||||
<el-input v-model="formData.receiverMobile" />
|
||||
<el-form-item label="手机号">
|
||||
<el-input v-model="formData.receiverMobile" placeholder="请输入收件人手机号" />
|
||||
</el-form-item>
|
||||
<!-- TODO @puhui999:应该是个地区下拉框,可以看下 UserForm 所在地 -->
|
||||
<el-form-item label="收件人地区编号">
|
||||
<el-input v-model="formData.receiverAreaId" />
|
||||
<el-form-item label="所在地">
|
||||
<el-tree-select
|
||||
v-model="formData.receiverAreaId"
|
||||
:data="areaList"
|
||||
:props="defaultProps"
|
||||
:render-after-expand="true"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="收件人详细地址">
|
||||
<el-input v-model="formData.receiverDetailAddress" />
|
||||
<el-form-item label="详细地址">
|
||||
<el-input
|
||||
v-model="formData.receiverDetailAddress"
|
||||
:rows="3"
|
||||
placeholder="请输入收件人详细地址"
|
||||
type="textarea"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
@ -23,10 +32,11 @@
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import * as TradeOrderApi from '@/api/mall/trade/order'
|
||||
import { getAreaTree } from '@/api/system/area'
|
||||
import { copyValueToTarget } from '@/utils'
|
||||
import { defaultProps } from '@/utils/tree'
|
||||
|
||||
// TODO @puhui999:OrderAdjustAddressForm 改成 OrderUpdateAddressForm 更新哈,保持统一;
|
||||
defineOptions({ name: 'OrderAdjustAddressForm' })
|
||||
defineOptions({ name: 'OrderUpdateAddressForm' })
|
||||
|
||||
const { t } = useI18n() // 国际化
|
||||
const message = useMessage() // 消息弹窗
|
||||
@ -40,6 +50,7 @@ const formData = ref({
|
||||
receiverAreaId: null, //收件人地区编号
|
||||
receiverDetailAddress: '' //收件人详细地址
|
||||
})
|
||||
const areaList = ref([]) // 地区列表
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
/** 打开弹窗 */
|
||||
@ -58,7 +69,7 @@ const submitForm = async () => {
|
||||
formLoading.value = true
|
||||
try {
|
||||
const data = unref(formData)
|
||||
await TradeOrderApi.adjustAddress(data)
|
||||
await TradeOrderApi.updateAddress(data)
|
||||
message.success(t('common.updateSuccess'))
|
||||
dialogVisible.value = false
|
||||
// 发送操作成功的事件
|
||||
@ -79,4 +90,9 @@ const resetForm = () => {
|
||||
}
|
||||
formRef.value?.resetFields()
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
// 获得地区列表
|
||||
areaList.value = await getAreaTree()
|
||||
})
|
||||
</script>
|
@ -20,11 +20,10 @@
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import * as TradeOrderApi from '@/api/mall/trade/order'
|
||||
import { convertToInteger, formatToFraction } from '@/utils'
|
||||
import { convertToInteger, floatToFixed2, formatToFraction } from '@/utils'
|
||||
import { cloneDeep } from 'lodash-es'
|
||||
|
||||
// TODO @puhui999:OrderAdjustPriceForm 改成 OrderUpdatePriceForm 更新哈,保持统一;
|
||||
defineOptions({ name: 'OrderAdjustPriceForm' })
|
||||
defineOptions({ name: 'OrderUpdatePriceForm' })
|
||||
|
||||
const { t } = useI18n() // 国际化
|
||||
const message = useMessage() // 消息弹窗
|
||||
@ -40,7 +39,9 @@ const formData = ref({
|
||||
watch(
|
||||
() => formData.value.adjustPrice,
|
||||
(data: number) => {
|
||||
formData.value.newPayPrice = formData.value.payPrice.replace('元', '') * 1 + data + '元'
|
||||
const num = formData.value.payPrice!.replace('元', '')
|
||||
// @ts-ignore
|
||||
formData.value.newPayPrice = (num * 1 + data).toFixed(2) + '元'
|
||||
}
|
||||
)
|
||||
|
||||
@ -49,10 +50,11 @@ const formRef = ref() // 表单 Ref
|
||||
/** 打开弹窗 */
|
||||
const open = async (row: TradeOrderApi.OrderVO) => {
|
||||
resetForm()
|
||||
formData.value.id = row.id
|
||||
formData.value.id = row.id!
|
||||
// 设置数据
|
||||
formData.value.adjustPrice = formatToFraction(row.adjustPrice)
|
||||
formData.value.payPrice = formatToFraction(row.payPrice) + '元'
|
||||
formData.value.adjustPrice = formatToFraction(row.adjustPrice!)
|
||||
formData.value.payPrice = floatToFixed2(row.payPrice!) + '元'
|
||||
formData.value.newPayPrice = formData.value.payPrice
|
||||
dialogVisible.value = true
|
||||
}
|
||||
defineExpose({ open }) // 提供 open 方法,用于打开弹窗
|
||||
@ -67,7 +69,7 @@ const submitForm = async () => {
|
||||
data.adjustPrice = convertToInteger(data.adjustPrice)
|
||||
delete data.payPrice
|
||||
delete data.newPayPrice
|
||||
await TradeOrderApi.adjustPrice(data)
|
||||
await TradeOrderApi.updatePrice(data)
|
||||
message.success(t('common.updateSuccess'))
|
||||
dialogVisible.value = false
|
||||
// 发送操作成功的事件
|
@ -1,8 +1,13 @@
|
||||
<template>
|
||||
<Dialog v-model="dialogVisible" title="商家备注" width="25%">
|
||||
<Dialog v-model="dialogVisible" title="商家备注" width="45%">
|
||||
<el-form ref="formRef" v-loading="formLoading" :model="formData" label-width="80px">
|
||||
<el-form-item label="备注">
|
||||
<el-input v-model="formData.remark" />
|
||||
<el-input
|
||||
v-model="formData.remark"
|
||||
:rows="3"
|
||||
placeholder="请输入订单备注"
|
||||
type="textarea"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
@ -14,8 +19,7 @@
|
||||
<script lang="ts" setup>
|
||||
import * as TradeOrderApi from '@/api/mall/trade/order'
|
||||
|
||||
// TODO @puhui999:OrderRemarksForm 改成 OrderUpdateRemarkForm 更新哈,保持统一;
|
||||
defineOptions({ name: 'OrderRemarksForm' })
|
||||
defineOptions({ name: 'OrderUpdateRemarkForm' })
|
||||
|
||||
const { t } = useI18n() // 国际化
|
||||
const message = useMessage() // 消息弹窗
|
||||
@ -46,7 +50,7 @@ const submitForm = async () => {
|
||||
try {
|
||||
const data = unref(formData)
|
||||
console.log(data)
|
||||
await TradeOrderApi.remark(data)
|
||||
await TradeOrderApi.updateRemark(data)
|
||||
message.success(t('common.updateSuccess'))
|
||||
dialogVisible.value = false
|
||||
// 发送操作成功的事件
|
@ -41,10 +41,10 @@
|
||||
<dict-tag :type="DICT_TYPE.TRADE_ORDER_STATUS" :value="orderInfo.status" />
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label-class-name="no-colon">
|
||||
<el-button type="primary" @click="openForm('adjustPrice')">调整价格</el-button>
|
||||
<el-button type="primary" @click="openForm('updatePrice')">调整价格</el-button>
|
||||
<el-button type="primary" @click="openForm('remark')">备注</el-button>
|
||||
<el-button type="primary" @click="openForm('delivery')">发货</el-button>
|
||||
<el-button type="primary" @click="openForm('adjustAddress')">修改地址</el-button>
|
||||
<el-button type="primary" @click="openForm('updateAddress')">修改地址</el-button>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item>
|
||||
<template #label><span style="color: red">提醒: </span></template>
|
||||
@ -68,12 +68,12 @@
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品原价(元)" prop="price" width="150">
|
||||
<template #default="{ row }">{{ formatToFraction(row.price) }}</template>
|
||||
<el-table-column label="商品原价" prop="price" width="150">
|
||||
<template #default="{ row }">{{ floatToFixed2(row.price) }}元</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="数量" prop="count" width="100" />
|
||||
<el-table-column label="合计(元)" prop="payPrice" width="150">
|
||||
<template #default="{ row }">{{ formatToFraction(row.payPrice) }}</template>
|
||||
<el-table-column label="合计" prop="payPrice" width="150">
|
||||
<template #default="{ row }">{{ floatToFixed2(row.payPrice) }}元</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="售后状态" prop="afterSaleStatus" width="120">
|
||||
<template #default="{ row }">
|
||||
@ -91,32 +91,32 @@
|
||||
</el-descriptions>
|
||||
<el-descriptions :column="6">
|
||||
<el-descriptions-item label="商品总额: ">
|
||||
{{ formatToFraction(orderInfo.totalPrice) }}元
|
||||
{{ floatToFixed2(orderInfo.totalPrice) }}元
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="运费金额: ">
|
||||
{{ formatToFraction(orderInfo.deliveryPrice) }}元
|
||||
{{ floatToFixed2(orderInfo.deliveryPrice) }}元
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="订单调价: ">
|
||||
{{ formatToFraction(orderInfo.adjustPrice) }}元
|
||||
{{ floatToFixed2(orderInfo.updatePrice) }}元
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item>
|
||||
<template #label><span style="color: red">商品优惠: </span></template>
|
||||
{{ formatToFraction(orderInfo.couponPrice) }}元
|
||||
{{ floatToFixed2(orderInfo.couponPrice) }}元
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item>
|
||||
<template #label><span style="color: red">订单优惠: </span></template>
|
||||
{{ formatToFraction(orderInfo.discountPrice) }}元
|
||||
{{ floatToFixed2(orderInfo.discountPrice) }}元
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item>
|
||||
<template #label><span style="color: red">积分抵扣: </span></template>
|
||||
{{ formatToFraction(orderInfo.pointPrice) }}元
|
||||
{{ floatToFixed2(orderInfo.pointPrice) }}元
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item v-for="item in 5" :key="item" label-class-name="no-colon" />
|
||||
<!-- 占位 -->
|
||||
<el-descriptions-item label="应付金额: ">
|
||||
{{ formatToFraction(orderInfo.payPrice) }}元
|
||||
{{ floatToFixed2(orderInfo.payPrice) }}元
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
||||
@ -199,71 +199,27 @@
|
||||
</ContentWrap>
|
||||
|
||||
<!-- 各种操作的弹窗 -->
|
||||
<DeliveryOrderForm ref="deliveryFormRef" @success="getDetail" />
|
||||
<OrderRemarksForm ref="remarksFormRef" @success="getDetail" />
|
||||
<OrderAdjustAddressForm ref="adjustAddressFormRef" @success="getDetail" />
|
||||
<OrderAdjustPriceForm ref="adjustPriceFormRef" @success="getDetail" />
|
||||
<OrderDeliveryForm ref="deliveryFormRef" @success="getDetail" />
|
||||
<OrderUpdateRemarkForm ref="updateRemarkForm" @success="getDetail" />
|
||||
<OrderUpdateAddressForm ref="updateAddressFormRef" @success="getDetail" />
|
||||
<OrderUpdatePriceForm ref="updatePriceFormRef" @success="getDetail" />
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import * as TradeOrderApi from '@/api/mall/trade/order'
|
||||
import { formatToFraction } from '@/utils'
|
||||
import { floatToFixed2 } from '@/utils'
|
||||
import { DICT_TYPE } from '@/utils/dict'
|
||||
import OrderRemarksForm from '@/views/mall/trade/order/components/OrderRemarksForm.vue'
|
||||
import DeliveryOrderForm from '@/views/mall/trade/order/components/DeliveryOrderForm.vue'
|
||||
import OrderAdjustAddressForm from '@/views/mall/trade/order/components/OrderAdjustAddressForm.vue'
|
||||
import OrderAdjustPriceForm from '@/views/mall/trade/order/components/OrderAdjustPriceForm.vue'
|
||||
import OrderUpdateRemarkForm from '@/views/mall/trade/order/components/OrderUpdateRemarkForm.vue'
|
||||
import OrderDeliveryForm from '@/views/mall/trade/order/components/OrderDeliveryForm.vue'
|
||||
import OrderUpdateAddressForm from '@/views/mall/trade/order/components/OrderUpdateAddressForm.vue'
|
||||
import OrderUpdatePriceForm from '@/views/mall/trade/order/components/OrderUpdatePriceForm.vue'
|
||||
|
||||
// TODO @puhui999:TradeOrderDetailForm 可以挪到 order/detail/index.vue 中,它是一个 vue 界面哈。
|
||||
defineOptions({ name: 'TradeOrderDetailForm' })
|
||||
|
||||
const message = useMessage() // 消息弹窗
|
||||
const { params } = useRoute() // 查询参数
|
||||
// TODO @puhui999:orderInfo 应该不用把属性弄出来也;
|
||||
const orderInfo = ref<TradeOrderApi.OrderVO>({
|
||||
no: '',
|
||||
createTime: null,
|
||||
type: null,
|
||||
terminal: null,
|
||||
userId: null,
|
||||
userIp: '',
|
||||
userRemark: '',
|
||||
status: null,
|
||||
productCount: null,
|
||||
finishTime: null,
|
||||
cancelTime: null,
|
||||
cancelType: null,
|
||||
remark: '',
|
||||
payOrderId: null,
|
||||
payed: false,
|
||||
payTime: null,
|
||||
payChannelCode: '',
|
||||
originalPrice: null,
|
||||
orderPrice: null,
|
||||
discountPrice: null,
|
||||
deliveryPrice: null,
|
||||
adjustPrice: null,
|
||||
payPrice: null,
|
||||
deliveryTemplateId: null,
|
||||
logisticsId: null,
|
||||
logisticsNo: '',
|
||||
deliveryStatus: null,
|
||||
deliveryTime: null,
|
||||
receiveTime: null,
|
||||
receiverName: '',
|
||||
receiverMobile: '',
|
||||
receiverAreaId: null,
|
||||
receiverPostCode: null,
|
||||
receiverDetailAddress: '',
|
||||
afterSaleStatus: null,
|
||||
refundPrice: null,
|
||||
couponPrice: null,
|
||||
pointPrice: null,
|
||||
receiverAreaName: '',
|
||||
items: [],
|
||||
user: {}
|
||||
})
|
||||
const orderInfo = ref<TradeOrderApi.OrderVO>({})
|
||||
|
||||
// TODO @puhui999:这个改成直接读属性,不用按照这种写法;
|
||||
// TODO @puhui999:这个改成直接读属性,不用按照这种写法;后续再改
|
||||
const detailGroups = ref([
|
||||
{
|
||||
title: '物流信息',
|
||||
@ -282,7 +238,7 @@ const detailGroups = ref([
|
||||
}
|
||||
])
|
||||
|
||||
// TODO @puhui999:从后台读数据哈。
|
||||
// TODO @puhui999:从后台读数据哈。后续再改
|
||||
const detailInfo = ref({
|
||||
// 物流信息
|
||||
expressInfo: {
|
||||
@ -330,22 +286,22 @@ const detailInfo = ref({
|
||||
})
|
||||
|
||||
const deliveryFormRef = ref() // 发货表单 Ref
|
||||
const remarksFormRef = ref() // 订单备注表单 Ref
|
||||
const adjustAddressFormRef = ref() // 收货地址表单 Ref
|
||||
const adjustPriceFormRef = ref() // 订单调价表单 Ref
|
||||
const updateRemarkForm = ref() // 订单备注表单 Ref
|
||||
const updateAddressFormRef = ref() // 收货地址表单 Ref
|
||||
const updatePriceFormRef = ref() // 订单调价表单 Ref
|
||||
const openForm = (type: string) => {
|
||||
switch (type) {
|
||||
case 'remark':
|
||||
remarksFormRef.value?.open(orderInfo.value)
|
||||
updateRemarkForm.value?.open(orderInfo.value)
|
||||
break
|
||||
case 'delivery':
|
||||
deliveryFormRef.value?.open(orderInfo.value.id)
|
||||
deliveryFormRef.value?.open(orderInfo.value)
|
||||
break
|
||||
case 'adjustAddress':
|
||||
adjustAddressFormRef.value?.open(orderInfo.value)
|
||||
case 'updateAddress':
|
||||
updateAddressFormRef.value?.open(orderInfo.value)
|
||||
break
|
||||
case 'adjustPrice':
|
||||
adjustPriceFormRef.value?.open(orderInfo.value)
|
||||
case 'updatePrice':
|
||||
updatePriceFormRef.value?.open(orderInfo.value)
|
||||
break
|
||||
}
|
||||
}
|
@ -64,6 +64,9 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- TODO @puhui999:要不加个 deliveryType 筛选;配送方式;然后如果选了快递,就有【快递公司】筛选;如果选了自提,就有【自提门店】;然后把他们这 3 个,坐在一个 el-form-item 里;
|
||||
目的是;有的时候,会筛选门店,然后做核销;这个时候,就需要筛选自提门店;
|
||||
-->
|
||||
<el-form-item label="快递公司" prop="type">
|
||||
<el-select v-model="queryParams.logisticsId" class="!w-280px" clearable placeholder="全部">
|
||||
<el-option
|
||||
@ -90,7 +93,7 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- TODO 考虑是否移除或重构;这个还是需要的哈-->
|
||||
<!-- TODO 聚合搜索等售后结束后实现-->
|
||||
<el-form-item label="聚合搜索">
|
||||
<el-input
|
||||
v-show="true"
|
||||
@ -100,7 +103,7 @@
|
||||
placeholder="请输入"
|
||||
>
|
||||
<template #prepend>
|
||||
<el-select v-model="queryType.k" clearable placeholder="全部" class="!w-110px">
|
||||
<el-select v-model="queryType.k" class="!w-110px" clearable placeholder="全部">
|
||||
<el-option
|
||||
v-for="dict in searchList"
|
||||
:key="dict.value"
|
||||
@ -125,24 +128,59 @@
|
||||
</ContentWrap>
|
||||
|
||||
<!-- 列表 -->
|
||||
<!-- TODO @puhui999:列表有可能尽量对齐 https://gitee.com/niushop_team/niushop_b2c_v5_stand/raw/master/image/back_end5.png 哇,主要感觉视觉上有点无法分辨一个订单项,是和哪个订单关联。
|
||||
|
||||
1、订单号、订单类型、订单来源、支付时间那一行,直接做到订单项的数据中
|
||||
2、商品信息、商品原价那一行,应该是在最顶上一行,不用每个订单项都写一条
|
||||
3、然后点击展开和收拢订单项,可以不做哈。
|
||||
-->
|
||||
<ContentWrap>
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:data="list"
|
||||
:show-overflow-tooltip="true"
|
||||
:stripe="true"
|
||||
default-expand-all
|
||||
>
|
||||
<el-table-column fixed="left" type="expand">
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column class-name="order-table-col">
|
||||
<template #header>
|
||||
<!-- TODO @phui999:小屏幕下,会有偏移,后续看看 -->
|
||||
<div class="flex items-center" style="width: 100%">
|
||||
<div class="ml-100px mr-200px">商品信息</div>
|
||||
<div class="mr-60px">单价(元)/数量</div>
|
||||
<div class="mr-60px">售后状态</div>
|
||||
<div class="mr-60px">实付金额(元)</div>
|
||||
<div class="mr-60px">买家/收货人</div>
|
||||
<div class="mr-60px">配送方式</div>
|
||||
<div class="mr-60px">订单状态</div>
|
||||
<div class="mr-60px">操作</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<el-table :data="scope.row.items" :span-method="spanMethod" border style="width: 100%">
|
||||
<el-table-column label="商品信息" min-width="300" prop="spuName">
|
||||
<el-table
|
||||
:data="scope.row.items"
|
||||
:header-cell-style="headerStyle"
|
||||
:span-method="spanMethod"
|
||||
border
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column min-width="300" prop="spuName">
|
||||
<template #header>
|
||||
<div
|
||||
class="flex items-center"
|
||||
style="height: 35px; background-color: #f7f7f7; width: 100%"
|
||||
>
|
||||
<span class="mr-20px">订单号:{{ scope.row.no }} </span>
|
||||
<span class="mr-20px">下单时间:{{ formatDate(scope.row.createTime) }}</span>
|
||||
<span>订单来源:</span>
|
||||
<dict-tag
|
||||
:type="DICT_TYPE.TERMINAL"
|
||||
:value="scope.row.terminal"
|
||||
class="mr-20px"
|
||||
/>
|
||||
<span>支付方式:</span>
|
||||
<dict-tag
|
||||
v-if="scope.row.payChannelCode"
|
||||
:type="DICT_TYPE.PAY_CHANNEL_CODE"
|
||||
:value="scope.row.payChannelCode"
|
||||
class="mr-20px"
|
||||
/>
|
||||
<v-else class="mr-20px" v-else>未支付</v-else>
|
||||
<span class="mr-20px" v-if="scope.row.payTime">
|
||||
支付时间:{{ formatDate(scope.row.payTime) }}
|
||||
</span>
|
||||
<span>订单类型:</span>
|
||||
<dict-tag :type="DICT_TYPE.TRADE_ORDER_TYPE" :value="scope.row.type" />
|
||||
</div>
|
||||
</template>
|
||||
<template #default="{ row }">
|
||||
<div class="flex items-center">
|
||||
<el-image
|
||||
@ -163,13 +201,9 @@
|
||||
</el-table-column>
|
||||
<el-table-column label="商品原价*数量" prop="price" width="150">
|
||||
<template #default="{ row }">
|
||||
<!-- TODO @puhui999:价格,要有 xxx.00 这种格式 -->
|
||||
{{ formatToFraction(row.price) }} 元 * {{ row.count }}
|
||||
{{ floatToFixed2(row.price) }} 元 / {{ row.count }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="合计" prop="payPrice" width="150">
|
||||
<template #default="{ row }">{{ formatToFraction(row.payPrice) }}元</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="售后状态" prop="afterSaleStatus" width="120">
|
||||
<template #default="{ row }">
|
||||
<dict-tag
|
||||
@ -180,8 +214,7 @@
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="实际支付" min-width="120" prop="payPrice">
|
||||
<template #default>
|
||||
<!-- TODO @puhui999:价格,要有 xxx.00 这种格式 -->
|
||||
{{ formatToFraction(scope.row.payPrice) + '元' }}
|
||||
{{ floatToFixed2(scope.row.payPrice) + '元' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="买家/收货人" min-width="160">
|
||||
@ -218,6 +251,11 @@
|
||||
<dict-tag :type="DICT_TYPE.TRADE_DELIVERY_TYPE" :value="scope.row.deliveryType" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="订单状态" width="120">
|
||||
<template #default>
|
||||
<dict-tag :type="DICT_TYPE.TRADE_ORDER_STATUS" :value="scope.row.status" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="160">
|
||||
<template #default>
|
||||
<!-- TODO 权限后续补齐 -->
|
||||
@ -233,14 +271,16 @@
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<!-- TODO puhui999:可以判断下状态 + 物流类型,展示【发货】按钮 -->
|
||||
<el-dropdown-item command="delivery">
|
||||
<!-- 如果是【快递】,并且【未发货】,则展示【发货】按钮 -->
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.deliveryType === 1 && scope.row.status === 10"
|
||||
command="delivery"
|
||||
>
|
||||
<Icon icon="ep:takeaway-box" />
|
||||
发货
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item command="orderRemarks">
|
||||
<Icon icon="ep:chat-line-square" />
|
||||
订单备注
|
||||
<el-dropdown-item command="remark">
|
||||
<Icon icon="ep:chat-line-square" /> 备注
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
@ -251,51 +291,6 @@
|
||||
</el-table>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="订单号" min-width="110" prop="no" />
|
||||
<el-table-column align="center" label="订单类型" min-width="100">
|
||||
<template #default="{ row }">
|
||||
<dict-tag :type="DICT_TYPE.TRADE_ORDER_TYPE" :value="row.type" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="订单来源" min-width="145">
|
||||
<template #default="{ row }">
|
||||
<dict-tag v-if="row.terminal" :type="DICT_TYPE.TERMINAL" :value="row.terminal" />
|
||||
<span v-else>{{ row.terminal }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:formatter="dateFormatter"
|
||||
align="center"
|
||||
label="支付时间"
|
||||
min-width="180"
|
||||
prop="payTime"
|
||||
/>
|
||||
<el-table-column align="center" label="支付类型" min-width="120" prop="payChannelCode">
|
||||
<template #default="{ row }">
|
||||
<dict-tag
|
||||
v-if="row.payChannelCode"
|
||||
:type="DICT_TYPE.PAY_CHANNEL_CODE"
|
||||
:value="row.payChannelCode"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="订单状态" min-width="100" prop="status">
|
||||
<template #default="{ row }">
|
||||
<dict-tag
|
||||
v-if="row.status !== ''"
|
||||
:type="DICT_TYPE.TRADE_ORDER_STATUS"
|
||||
:value="row.status"
|
||||
/>
|
||||
<span v-else>{{ row.status }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:formatter="dateFormatter"
|
||||
align="center"
|
||||
label="创建时间"
|
||||
min-width="180"
|
||||
prop="createTime"
|
||||
/>
|
||||
</el-table>
|
||||
<!-- 分页 -->
|
||||
<Pagination
|
||||
@ -307,22 +302,19 @@
|
||||
</ContentWrap>
|
||||
|
||||
<!-- 各种操作的弹窗 -->
|
||||
<DeliveryOrderForm ref="deliveryOrderFormRef" @success="getList" />
|
||||
<OrderRemarksForm ref="orderRemarksFormRef" @success="getList" />
|
||||
<OrderDeliveryForm ref="deliveryFormRef" @success="getList" />
|
||||
<OrderUpdateRemarkForm ref="updateRemarkForm" @success="getList" />
|
||||
</template>
|
||||
|
||||
<script lang="ts" name="Order" setup>
|
||||
import type { FormInstance, TableColumnCtx } from 'element-plus'
|
||||
import DeliveryOrderForm from './components/DeliveryOrderForm.vue'
|
||||
import OrderRemarksForm from './components/OrderRemarksForm.vue'
|
||||
import { dateFormatter } from '@/utils/formatTime'
|
||||
import OrderDeliveryForm from './components/OrderDeliveryForm.vue'
|
||||
import OrderUpdateRemarkForm from './components/OrderUpdateRemarkForm.vue'
|
||||
import * as TradeOrderApi from '@/api/mall/trade/order'
|
||||
// @puhui999:通过 TradeOrderApi 去引用对应的 VO 就可以啦
|
||||
import { OrderItemRespVO, OrderVO } from '@/api/mall/trade/order'
|
||||
// @puhui999:使用 XXXApi 哈
|
||||
import { getListAllSimple } from '@/api/mall/trade/delivery/pickUpStore'
|
||||
import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
|
||||
import { formatToFraction } from '@/utils'
|
||||
import * as PickUpStoreApi from '@/api/mall/trade/delivery/pickUpStore'
|
||||
import { DICT_TYPE, getIntDictOptions, getStrDictOptions } from '@/utils/dict'
|
||||
import { formatDate } from '@/utils/formatTime'
|
||||
import { floatToFixed2 } from '@/utils'
|
||||
import { createImageViewer } from '@/components/ImageViewer'
|
||||
import * as DeliveryExpressApi from '@/api/mall/trade/delivery/express'
|
||||
|
||||
@ -330,7 +322,7 @@ const { currentRoute, push } = useRouter() // 路由跳转
|
||||
|
||||
const loading = ref(true) // 列表的加载中
|
||||
const total = ref(2) // 列表的总页数
|
||||
const list = ref<OrderVO[]>([]) // 列表的数据
|
||||
const list = ref<TradeOrderApi.OrderVO[]>([]) // 列表的数据
|
||||
const queryFormRef = ref<FormInstance>() // 搜索的表单
|
||||
// 表单搜索
|
||||
const queryParams = reactive({
|
||||
@ -367,25 +359,43 @@ const searchList = ref([
|
||||
{ value: 'userMobile', label: '用户电话' }
|
||||
])
|
||||
|
||||
const headerStyle = ({ row, columnIndex }: any) => {
|
||||
// 表头第一行第一列占 8
|
||||
if (columnIndex === 0) {
|
||||
row[columnIndex].colSpan = 8
|
||||
} else {
|
||||
// 其余的不要
|
||||
row[columnIndex].colSpan = 0
|
||||
return {
|
||||
display: 'none'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
interface SpanMethodProps {
|
||||
row: OrderItemRespVO
|
||||
column: TableColumnCtx<OrderItemRespVO>
|
||||
row: TradeOrderApi.OrderItemRespVO
|
||||
column: TableColumnCtx<TradeOrderApi.OrderItemRespVO>
|
||||
rowIndex: number
|
||||
columnIndex: number
|
||||
}
|
||||
const spanMethod = ({ rowIndex, columnIndex }: SpanMethodProps) => {
|
||||
const colIndex = [4, 5, 6, 7]
|
||||
// 处理列
|
||||
|
||||
const spanMethod = ({ row, rowIndex, columnIndex }: SpanMethodProps) => {
|
||||
const len = list.value.find(
|
||||
(order) => order.items?.findIndex((item) => item.id === row.id) !== -1
|
||||
)?.items?.length
|
||||
// 要合并的列,从零开始
|
||||
const colIndex = [3, 4, 5, 6]
|
||||
if (colIndex.includes(columnIndex)) {
|
||||
// 处理被合并的行
|
||||
// 除了第一行其余的不要
|
||||
if (rowIndex !== 0) {
|
||||
return {
|
||||
rowspan: 0,
|
||||
colspan: 0
|
||||
}
|
||||
}
|
||||
// 动态合并行
|
||||
return {
|
||||
rowspan: 2,
|
||||
rowspan: len,
|
||||
colspan: 1
|
||||
}
|
||||
}
|
||||
@ -404,9 +414,9 @@ const getList = async () => {
|
||||
}
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
const handleQuery = async () => {
|
||||
queryParams.pageNo = 1
|
||||
getList()
|
||||
await getList()
|
||||
}
|
||||
|
||||
/** 重置按钮操作 */
|
||||
@ -422,27 +432,26 @@ const imagePreview = (imgUrl: string) => {
|
||||
})
|
||||
}
|
||||
|
||||
/** 查看商品详情 */
|
||||
/** 查看订单详情 */
|
||||
const openForm = (id: number) => {
|
||||
// TODO @puhui999:这里最好用 name 来跳转,因为 url 可能会改
|
||||
push('/trade/order/detail/' + id)
|
||||
push({ name: 'TradeOrderDetailForm', params: { orderId: id } })
|
||||
}
|
||||
|
||||
/** 操作分发 */
|
||||
const deliveryOrderFormRef = ref()
|
||||
const orderRemarksFormRef = ref()
|
||||
const handleCommand = (command: string, row: OrderVO) => {
|
||||
const deliveryFormRef = ref()
|
||||
const updateRemarkForm = ref()
|
||||
const handleCommand = (command: string, row: TradeOrderApi.OrderVO) => {
|
||||
switch (command) {
|
||||
case 'orderRemarks': // TODO @puhui999:orderRemarks 是不是改成 remark 会好点,保持统一
|
||||
orderRemarksFormRef.value?.open(row)
|
||||
case 'remark':
|
||||
updateRemarkForm.value?.open(row)
|
||||
break
|
||||
case 'delivery':
|
||||
deliveryOrderFormRef.value?.open(row.id)
|
||||
deliveryFormRef.value?.open(row)
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
// 监听路由变化更新列表,解决商品保存后,列表不刷新的问题。
|
||||
// 监听路由变化更新列表,解决订单保存/更新后,列表不刷新的问题。
|
||||
watch(
|
||||
() => currentRoute.value,
|
||||
() => {
|
||||
@ -455,7 +464,12 @@ const deliveryExpressList = ref([]) // 物流公司
|
||||
/** 初始化 **/
|
||||
onMounted(async () => {
|
||||
await getList()
|
||||
pickUpStoreList.value = await getListAllSimple()
|
||||
pickUpStoreList.value = await PickUpStoreApi.getListAllSimple()
|
||||
deliveryExpressList.value = await DeliveryExpressApi.getSimpleDeliveryExpressList()
|
||||
})
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
:deep(.order-table-col > .cell) {
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
|
Loading…
Reference in New Issue
Block a user