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

# Conflicts:
#	package.json
#	src/views/member/user/detail/UserOrderList.vue

src/views/mall/trade/order/detail/index.vue

@@ -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>

src/views/mall/trade/order/form/OrderPickUpForm.vue

@@ -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>

src/views/mall/trade/order/index.vue

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