Merge remote-tracking branch 'yudao/dev' into dev-to-dev

# Conflicts:
#	package.json
#	src/views/member/user/detail/UserOrderList.vue
This commit is contained in:
puhui999
2023-10-20 16:40:19 +08:00
59 changed files with 2766 additions and 611 deletions

View File

@@ -307,7 +307,7 @@ onMounted(async () => {
// 时间线样式调整
:deep(.el-timeline) {
margin: 10px 0px 0px 160px;
margin: 10px 0 0 160px;
.el-timeline-item__wrapper {
position: relative;
@@ -328,27 +328,27 @@ onMounted(async () => {
background-color: #f7f8fa;
&::before {
content: '';
position: absolute;
top: 10px;
left: 13px;
border-width: 8px; /* 调整尖角大小 */
border-style: solid;
border-color: transparent #f7f8fa transparent transparent; /* 尖角颜色,左侧朝向 */
border-style: solid;
border-width: 8px; /* 调整尖角大小 */
content: '';
}
}
.dot-node-style {
width: 20px;
height: 20px;
position: absolute;
left: -5px;
display: flex;
width: 20px;
height: 20px;
font-size: 10px;
color: #fff;
border-radius: 50%;
justify-content: center;
align-items: center;
border-radius: 50%;
color: #fff;
font-size: 10px;
}
}
</style>

View File

@@ -122,7 +122,7 @@
<el-image
v-if="scope.row.accountQrCodeUrl"
:src="scope.row.accountQrCodeUrl"
class="w-40px h-40px"
class="h-40px w-40px"
:preview-src-list="[scope.row.accountQrCodeUrl]"
preview-teleported
/>

View File

@@ -16,9 +16,9 @@
<el-form-item label="退款理由" prop="afterSaleRefundReasons">
<el-select
v-model="formData.afterSaleRefundReasons"
allow-create
filterable
multiple
allow-create
placeholder="请直接输入退款理由"
>
<el-option

View File

@@ -0,0 +1,324 @@
<template>
<!-- 搜索 -->
<ContentWrap>
<el-form
ref="queryFormRef"
:inline="true"
:model="queryParams"
class="-mb-15px"
label-width="68px"
>
<el-form-item label="创建时间" prop="createTime">
<el-date-picker
v-model="queryParams.createTime"
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
class="!w-280px"
end-placeholder="自定义时间"
start-placeholder="自定义时间"
type="daterange"
value-format="YYYY-MM-DD HH:mm:ss"
/>
</el-form-item>
<el-form-item label="自提门店" prop="pickUpStoreId">
<el-select
v-model="queryParams.pickUpStoreId"
class="!w-280px"
clearable
multiple
placeholder="全部"
>
<el-option
v-for="item in pickUpStoreList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="聚合搜索">
<el-input
v-show="true"
v-model="queryParams[queryType.queryParam]"
class="!w-280px"
clearable
placeholder="请输入"
:type="queryType.queryParam === 'userId' ? 'number' : 'text'"
>
<template #prepend>
<el-select
v-model="queryType.queryParam"
class="!w-110px"
placeholder="全部"
@change="inputChangeSelect"
>
<el-option
v-for="dict in dynamicSearchList"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</template>
</el-input>
</el-form-item>
<el-form-item>
<el-button @click="handleQuery">
<Icon class="mr-5px" icon="ep:search" />
搜索
</el-button>
<el-button @click="resetQuery">
<Icon class="mr-5px" icon="ep:refresh" />
重置
</el-button>
<el-button @click="handlePickup" type="success" plain v-hasPermi="['trade:order:pick-up']">
<Icon class="mr-5px" icon="ep:check" />
核销
</el-button>
</el-form-item>
</el-form>
</ContentWrap>
<!-- 统计卡片 -->
<el-row :gutter="16" class="summary">
<el-col :sm="6" :xs="12" v-loading="loading">
<SummaryCard
title="订单数量"
icon="icon-park-outline:transaction-order"
icon-color="bg-blue-100"
icon-bg-color="text-blue-500"
:value="summary?.orderCount || 0"
/>
</el-col>
<el-col :sm="6" :xs="12" v-loading="loading">
<SummaryCard
title="订单金额"
icon="streamline:money-cash-file-dollar-common-money-currency-cash-file"
icon-color="bg-purple-100"
icon-bg-color="text-purple-500"
prefix="¥"
:decimals="2"
:value="fenToYuan(summary?.orderPayPrice || 0)"
/>
</el-col>
<el-col :sm="6" :xs="12" v-loading="loading">
<SummaryCard
title="退款单数"
icon="heroicons:receipt-refund"
icon-color="bg-yellow-100"
icon-bg-color="text-yellow-500"
:value="summary?.afterSaleCount || 0"
/>
</el-col>
<el-col :sm="6" :xs="12" v-loading="loading">
<SummaryCard
title="退款金额"
icon="ri:refund-2-line"
icon-color="bg-green-100"
icon-bg-color="text-green-500"
prefix="¥"
:decimals="2"
:value="fenToYuan(summary?.afterSalePrice || 0)"
/>
</el-col>
</el-row>
<!-- 列表 -->
<ContentWrap>
<el-table v-loading="loading" :data="list">
<el-table-column label="订单号" align="center" prop="no" min-width="180" />
<el-table-column label="用户信息" align="center" prop="user.nickname" min-width="80" />
<el-table-column
label="推荐人信息"
align="center"
prop="brokerageUser.nickname"
min-width="100"
/>
<el-table-column label="商品信息" align="center" prop="spuName" min-width="300">
<template #default="{ row }">
<div class="flex items-center" v-for="item in row.items" :key="item.id">
<el-image
:src="item.picUrl"
class="mr-10px h-30px w-30px flex-shrink-0"
:preview-src-list="[item.picUrl]"
preview-teleported
/>
<span class="mr-10px">{{ item.spuName }}</span>
<div class="flex flex-col flex-wrap gap-1">
<el-tag
v-for="property in item.properties"
:key="property.propertyId"
class="mr-10px"
>
{{ property.propertyName }}: {{ property.valueName }}
</el-tag>
<span>{{ floatToFixed2(item.price) }} x {{ item.count }}</span>
</div>
</div>
</template>
</el-table-column>
<el-table-column
label="实付金额(元)"
align="center"
prop="payPrice"
min-width="110"
:formatter="fenToYuanFormat"
/>
<el-table-column label="核销员" align="center" prop="storeStaffName" min-width="70" />
<el-table-column label="核销门店" align="center" prop="pickUpStoreId" min-width="80">
<template #default="{ row }">
{{ pickUpStoreList.find((p) => p.id === row.pickUpStoreId)?.name }}
</template>
</el-table-column>
<el-table-column label="支付状态" align="center" prop="payStatus" min-width="80">
<template #default="{ row }">
<dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="row.payStatus || false" />
</template>
</el-table-column>
<el-table-column align="center" label="订单状态" prop="status" width="120">
<template #default="{ row }">
<dict-tag :type="DICT_TYPE.TRADE_ORDER_STATUS" :value="row.status" />
</template>
</el-table-column>
<el-table-column
label="下单时间"
align="center"
prop="createTime"
min-width="170"
:formatter="dateFormatter"
/>
</el-table>
<!-- 分页 -->
<Pagination
v-model:limit="queryParams.pageSize"
v-model:page="queryParams.pageNo"
:total="total"
@pagination="getList"
/>
</ContentWrap>
<!-- 各种操作的弹窗 -->
<OrderPickUpForm ref="pickUpForm" @success="getList" />
</template>
<script lang="ts" setup>
import type { FormInstance } from 'element-plus'
import * as TradeOrderApi from '@/api/mall/trade/order'
import * as PickUpStoreApi from '@/api/mall/trade/delivery/pickUpStore'
import { DICT_TYPE } from '@/utils/dict'
import { fenToYuan, floatToFixed2 } from '@/utils'
import { fenToYuanFormat } from '@/utils/formatter'
import SummaryCard from '@/components/SummaryCard/index.vue'
import { dateFormatter } from '@/utils/formatTime'
import { DeliveryTypeEnum } from '@/utils/constants'
import { TradeOrderSummaryRespVO } from '@/api/mall/trade/order'
import { DeliveryPickUpStoreVO } from '@/api/mall/trade/delivery/pickUpStore'
import OrderPickUpForm from '@/views/mall/trade/order/form/OrderPickUpForm.vue'
defineOptions({ name: 'PickUpOrder' })
// 列表的加载中
const loading = ref(true)
// 列表的总页数
const total = ref(2)
// 列表的数据
const list = ref<TradeOrderApi.OrderVO[]>([])
// 搜索的表单
const queryFormRef = ref<FormInstance>()
// 初始表单参数
const INIT_QUERY_PARAMS = {
// 页数
pageNo: 1,
// 每页显示数量
pageSize: 10,
// 创建时间
createTime: undefined,
// 配送方式
deliveryType: DeliveryTypeEnum.PICK_UP.type,
// 自提门店
pickUpStoreId: undefined
}
// 表单搜索
const queryParams = ref({ ...INIT_QUERY_PARAMS })
// 订单搜索类型 queryParam
const queryType = reactive({ queryParam: 'no' })
// 订单统计数据
const summary = ref<TradeOrderSummaryRespVO>()
// 订单聚合搜索 select 类型配置(动态搜索)
const dynamicSearchList = ref([
{ value: 'no', label: '订单号' },
{ value: 'userId', label: '用户UID' },
{ value: 'userNickname', label: '用户昵称' },
{ value: 'userMobile', label: '用户电话' }
])
/**
* 聚合搜索切换查询对象时触发
* @param val
*/
const inputChangeSelect = (val: string) => {
dynamicSearchList.value
.filter((item) => item.value !== val)
?.forEach((item) => {
// 清除集合搜索无用属性
if (queryParams.value.hasOwnProperty(item.value)) {
delete queryParams.value[item.value]
}
})
}
/** 查询列表 */
const getList = async () => {
loading.value = true
try {
// 统计
summary.value = await TradeOrderApi.getOrderSummary(unref(queryParams))
// 分页
const data = await TradeOrderApi.getOrderPage(unref(queryParams))
list.value = data.list
total.value = data.total
} finally {
loading.value = false
}
}
/** 搜索按钮操作 */
const handleQuery = async () => {
queryParams.value.pageNo = 1
await getList()
}
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields()
queryParams.value = { ...INIT_QUERY_PARAMS }
handleQuery()
}
/** 自提门店精简列表 */
const pickUpStoreList = ref<DeliveryPickUpStoreVO[]>([])
const getPickUpStoreList = async () => {
pickUpStoreList.value = await PickUpStoreApi.getListAllSimple()
}
/** 显示核销表单 */
const pickUpForm = ref()
const handlePickup = () => {
pickUpForm.value.open()
}
/** 初始化 **/
onMounted(() => {
getList()
getPickUpStoreList()
})
</script>
<style lang="scss" scoped>
:deep(.order-table-col > .cell) {
padding: 0;
}
.summary {
.el-col {
margin-bottom: 1rem;
}
}
</style>

View File

@@ -54,7 +54,7 @@
</el-button>
<!-- 到店自提 -->
<el-button
v-if="formData.deliveryType === DeliveryTypeEnum.PICK_UP.type"
v-if="formData.deliveryType === DeliveryTypeEnum.PICK_UP.type && showPickUp"
type="primary"
@click="handlePickUp"
>
@@ -235,6 +235,7 @@ import * as DeliveryExpressApi from '@/api/mall/trade/delivery/express'
import { useTagsViewStore } from '@/store/modules/tagsView'
import { DeliveryTypeEnum, TradeOrderStatusEnum } from '@/utils/constants'
import * as DeliveryPickUpStoreApi from '@/api/mall/trade/delivery/pickUpStore'
import { propTypes } from '@/utils/propTypes'
defineOptions({ name: 'TradeOrderDetail' })
@@ -294,8 +295,12 @@ const handlePickUp = async () => {
/** 获得详情 */
const { params } = useRoute() // 查询参数
const props = defineProps({
id: propTypes.number.def(undefined), // 订单ID
showPickUp: propTypes.bool.def(true) // 显示核销按钮
})
const id = (params.id || props.id) as unknown as number
const getDetail = async () => {
const id = params.id as unknown as number
if (id) {
const res = (await TradeOrderApi.getOrder(id)) as TradeOrderApi.OrderVO
// 没有表单信息则关闭页面返回
@@ -395,27 +400,27 @@ onMounted(async () => {
background-color: #f7f8fa;
&::before {
content: ''; /* 必须设置 content 属性 */
position: absolute;
top: 10px;
left: 13px; /* 将伪元素水平居中 */
border-width: 8px; /* 调整尖角大小 */
border-style: solid;
border-color: transparent #f7f8fa transparent transparent; /* 尖角颜色,左侧朝向 */
border-style: solid;
border-width: 8px; /* 调整尖角大小 */
content: ''; /* 必须设置 content 属性 */
}
}
.dot-node-style {
width: 20px;
height: 20px;
position: absolute;
left: -5px;
display: flex;
width: 20px;
height: 20px;
font-size: 10px;
color: #fff;
border-radius: 50%;
justify-content: center;
align-items: center;
border-radius: 50%;
color: #fff;
font-size: 10px;
}
}
</style>

View File

@@ -0,0 +1,108 @@
<template>
<!-- 核销对话框 -->
<Dialog v-model="dialogVisible" title="订单核销" width="35%">
<el-form
ref="formRef"
v-loading="formLoading"
:model="formData"
:rules="formRules"
label-width="100px"
>
<el-form-item prop="pickUpVerifyCode" label="核销码">
<el-input v-model="formData.pickUpVerifyCode" placeholder="请输入核销码" />
</el-form-item>
</el-form>
<template #footer>
<el-button type="primary" :disabled="formLoading" @click="getOrderByPickUpVerifyCode">
查询
</el-button>
<el-button @click="dialogVisible = false"> </el-button>
</template>
</Dialog>
<!-- 核销确认对话框 -->
<Dialog v-model="detailDialogVisible" title="订单详情" width="55%">
<TradeOrderDetail v-if="orderDetails.id" :id="orderDetails.id" :show-pick-up="false" />
<template #footer>
<el-button type="primary" :disabled="formLoading" @click="submitForm"> 确认核销 </el-button>
<el-button @click="detailDialogVisible = false"> </el-button>
</template>
</Dialog>
</template>
<script lang="ts" setup>
import * as TradeOrderApi from '@/api/mall/trade/order'
import { OrderVO } from '@/api/mall/trade/order'
import { DeliveryTypeEnum, TradeOrderStatusEnum } from '@/utils/constants'
import TradeOrderDetail from '@/views/mall/trade/order/detail/index.vue'
/** 订单核销表单 */
defineOptions({ name: 'OrderPickUpForm' })
const message = useMessage() // 消息弹窗
const dialogVisible = ref(false) // 弹窗的是否展示
const detailDialogVisible = ref(false) // 详情弹窗的是否展示
const formLoading = ref(false) // 表单的加载中1修改时的数据加载2提交的按钮禁用
const formRules = reactive({
pickUpVerifyCode: [{ required: true, message: '核销码不能为空', trigger: 'blur' }]
})
const formData = ref({
pickUpVerifyCode: '' // 核销码
})
const formRef = ref() // 表单 Ref
const orderDetails = ref<OrderVO>({})
/** 打开弹窗 */
const open = async () => {
resetForm()
dialogVisible.value = true
}
defineExpose({ open }) // 提供 open 方法,用于打开弹窗
/** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调
const submitForm = async () => {
// 提交请求
formLoading.value = true
try {
await TradeOrderApi.pickUpOrderByVerifyCode(formData.value.pickUpVerifyCode)
message.success('核销成功')
detailDialogVisible.value = false
dialogVisible.value = false
// 发送操作成功的事件
emit('success', true)
} finally {
formLoading.value = false
}
}
/** 重置表单 */
const resetForm = () => {
formData.value = {
pickUpVerifyCode: '' // 核销码
}
formRef.value?.resetFields()
}
/** 查询核销码对应的订单 */
const getOrderByPickUpVerifyCode = async () => {
// 校验表单
if (!formRef) return
const valid = await formRef.value.validate()
if (!valid) return
formLoading.value = true
const data = await TradeOrderApi.getOrderByPickUpVerifyCode(formData.value.pickUpVerifyCode)
formLoading.value = false
if (data?.deliveryType !== DeliveryTypeEnum.PICK_UP.type) {
message.error('请输入正确的核销码')
return
}
if (data?.status !== TradeOrderStatusEnum.UNDELIVERED.status) {
message.error('订单不是待核销状态')
return
}
orderDetails.value = data
// 显示详情对话框
detailDialogVisible.value = true
}
</script>

View File

@@ -128,6 +128,7 @@
class="!w-280px"
clearable
placeholder="请输入"
:type="queryType.queryParam === 'userId' ? 'number' : 'text'"
>
<template #prepend>
<el-select