This commit is contained in:
aaron 2025-03-27 23:46:52 +08:00
parent 004726f422
commit f9f6d8abf3

View File

@ -222,36 +222,35 @@
v-model:value="formState.delivery_time_type" v-model:value="formState.delivery_time_type"
@change="handleDeliveryTimeTypeChange" @change="handleDeliveryTimeTypeChange"
> >
<a-radio value="IMMEDIATE">时达</a-radio> <a-radio value="IMMEDIATE">时达</a-radio>
<a-radio value="SCHEDULED">定时</a-radio> <a-radio value="SCHEDULED">预约</a-radio>
</a-radio-group> </a-radio-group>
<div class="form-item-help"> <div class="form-item-help">
<template v-if="formState.delivery_time_type === 'IMMEDIATE'"> <template v-if="formState.delivery_time_type === 'IMMEDIATE'">
时达商品将配送到家默认当天配送 时达商品将配送到家默认当天配送
</template> </template>
<template v-else> <template v-else>
定时达商品将由顾客自提需填写自提点信息和自提时间 预约达商品将由顾客兑换需填写兑换点信息和兑换时间
</template> </template>
</div> </div>
</a-form-item> </a-form-item>
<!-- 当选择"定时达"显示自提信息 --> <!-- 当选择"预约达"显示兑换信息 -->
<template v-if="formState.delivery_time_type === 'SCHEDULED'"> <template v-if="formState.delivery_time_type === 'SCHEDULED'">
<a-form-item <a-form-item
label="自提点" label="兑换点"
name="pickup_place" name="pickup_place"
required required
> >
<a-input <a-input
v-model:value="formState.pickup_place" v-model:value="formState.pickup_place"
placeholder="请输入自提点地址" placeholder="请输入兑换点地址"
/> />
</a-form-item> </a-form-item>
<a-form-item <a-form-item
label="自提日期" label="兑换日期"
name="delivery_date" name="delivery_date"
required
> >
<a-date-picker <a-date-picker
v-model:value="formState.delivery_date" v-model:value="formState.delivery_date"
@ -259,12 +258,12 @@
format="YYYY-MM-DD" format="YYYY-MM-DD"
valueFormat="YYYY-MM-DD" valueFormat="YYYY-MM-DD"
style="width: 100%" style="width: 100%"
placeholder="请选择自提日期" placeholder="请选择兑换日期"
/> />
</a-form-item> </a-form-item>
<a-form-item <a-form-item
label="自提时间" label="兑换时间"
required required
> >
<div class="time-range-wrapper"> <div class="time-range-wrapper">
@ -274,11 +273,12 @@
> >
<a-time-picker <a-time-picker
v-model:value="pickupTimeFrom" v-model:value="pickupTimeFrom"
format="HH:mm:ss" format="HH:mm"
placeholder="开始时间" placeholder="开始时间"
style="width: 100%" style="width: 100%"
@change="updatePickupTimeFrom" @change="updatePickupTimeFrom"
:minute-step="10" :minute-step="10"
:value-format="'HH:mm:ss'"
/> />
</a-form-item> </a-form-item>
<span class="time-separator"></span> <span class="time-separator"></span>
@ -288,15 +288,16 @@
> >
<a-time-picker <a-time-picker
v-model:value="pickupTimeTo" v-model:value="pickupTimeTo"
format="HH:mm:ss" format="HH:mm"
placeholder="结束时间" placeholder="结束时间"
style="width: 100%" style="width: 100%"
@change="updatePickupTimeTo" @change="updatePickupTimeTo"
:minute-step="10" :minute-step="10"
:value-format="'HH:mm:ss'"
/> />
</a-form-item> </a-form-item>
</div> </div>
<div class="form-item-help">请选择自提的时间范围</div> <div class="form-item-help">请选择兑换的时间范围</div>
</a-form-item> </a-form-item>
</template> </template>
</div> </div>
@ -463,36 +464,35 @@
v-model:value="editFormState.delivery_time_type" v-model:value="editFormState.delivery_time_type"
@change="handleEditDeliveryTimeTypeChange" @change="handleEditDeliveryTimeTypeChange"
> >
<a-radio value="IMMEDIATE">时达</a-radio> <a-radio value="IMMEDIATE">时达</a-radio>
<a-radio value="SCHEDULED">定时</a-radio> <a-radio value="SCHEDULED">预约</a-radio>
</a-radio-group> </a-radio-group>
<div class="form-item-help"> <div class="form-item-help">
<template v-if="editFormState.delivery_time_type === 'IMMEDIATE'"> <template v-if="editFormState.delivery_time_type === 'IMMEDIATE'">
时达商品将配送到家默认当天配送 时达商品将配送到家默认当天配送
</template> </template>
<template v-else> <template v-else>
定时达商品将由顾客自提需填写自提点信息和自提时间 预约达商品将由顾客兑换需填写兑换点信息和兑换时间
</template> </template>
</div> </div>
</a-form-item> </a-form-item>
<!-- 当选择"定时达"显示自提信息 --> <!-- 当选择"预约达"显示兑换信息 -->
<template v-if="editFormState.delivery_time_type === 'SCHEDULED'"> <template v-if="editFormState.delivery_time_type === 'SCHEDULED'">
<a-form-item <a-form-item
label="自提点" label="兑换点"
name="pickup_place" name="pickup_place"
required required
> >
<a-input <a-input
v-model:value="editFormState.pickup_place" v-model:value="editFormState.pickup_place"
placeholder="请输入自提点地址" placeholder="请输入兑换点地址"
/> />
</a-form-item> </a-form-item>
<a-form-item <a-form-item
label="自提日期" label="兑换日期"
name="delivery_date" name="delivery_date"
required
> >
<a-date-picker <a-date-picker
v-model:value="editFormState.delivery_date" v-model:value="editFormState.delivery_date"
@ -500,12 +500,12 @@
format="YYYY-MM-DD" format="YYYY-MM-DD"
valueFormat="YYYY-MM-DD" valueFormat="YYYY-MM-DD"
style="width: 100%" style="width: 100%"
placeholder="请选择自提日期" placeholder="请选择兑换日期"
/> />
</a-form-item> </a-form-item>
<a-form-item <a-form-item
label="自提时间" label="兑换时间"
required required
> >
<div class="time-range-wrapper"> <div class="time-range-wrapper">
@ -515,11 +515,13 @@
> >
<a-time-picker <a-time-picker
v-model:value="editPickupTimeFrom" v-model:value="editPickupTimeFrom"
format="HH:mm:ss" format="HH:mm"
placeholder="开始时间" placeholder="开始时间"
style="width: 100%" style="width: 100%"
@change="updateEditPickupTimeFrom"
:minute-step="10" :minute-step="10"
:value-format="'HH:mm:ss'"
:show-second="false"
:use12-hours="false"
/> />
</a-form-item> </a-form-item>
<span class="time-separator"></span> <span class="time-separator"></span>
@ -529,15 +531,17 @@
> >
<a-time-picker <a-time-picker
v-model:value="editPickupTimeTo" v-model:value="editPickupTimeTo"
format="HH:mm:ss" format="HH:mm"
placeholder="结束时间" placeholder="结束时间"
style="width: 100%" style="width: 100%"
@change="updateEditPickupTimeTo"
:minute-step="10" :minute-step="10"
:value-format="'HH:mm:ss'"
:show-second="false"
:use12-hours="false"
/> />
</a-form-item> </a-form-item>
</div> </div>
<div class="form-item-help">请选择自提的时间范围</div> <div class="form-item-help">请选择兑换的时间范围</div>
</a-form-item> </a-form-item>
</template> </template>
</div> </div>
@ -760,8 +764,8 @@ export default defineComponent({
align: 'center', align: 'center',
customRender: ({ text }) => { customRender: ({ text }) => {
const typeMap = { const typeMap = {
'IMMEDIATE': '时达', 'IMMEDIATE': '时达',
'SCHEDULED': '定时达' 'SCHEDULED': '预约达'
}; };
const colorMap = { const colorMap = {
'IMMEDIATE': 'blue', 'IMMEDIATE': 'blue',
@ -773,32 +777,32 @@ export default defineComponent({
} }
}, },
{ {
title: '自提信息', title: '兑换信息',
key: 'pickup_info', key: 'pickup_info',
dataIndex: 'delivery_time_type', dataIndex: 'delivery_time_type',
width: '15%', width: '15%',
align: 'center', align: 'center',
customRender: ({ text, record }) => { customRender: ({ text, record }) => {
// "" // ""
if (text === 'IMMEDIATE') { if (text === 'IMMEDIATE') {
return h('span', { style: { color: '#999' } }, '无需自提'); return h('span', { style: { color: '#999' } }, '无需兑换');
} }
// //
let infoText = ''; let infoText = '';
// //
if (record.delivery_date) { if (record.delivery_date) {
infoText += `日期: ${record.delivery_date}`; infoText += `日期: ${record.delivery_date}`;
} }
// //
if (record.pickup_time_from && record.pickup_time_to) { if (record.pickup_time_from && record.pickup_time_to) {
infoText += infoText ? '\n' : ''; infoText += infoText ? '\n' : '';
infoText += `时间: ${record.pickup_time_from.substring(0, 5)}-${record.pickup_time_to.substring(0, 5)}`; infoText += `时间: ${record.pickup_time_from.substring(0, 5)}-${record.pickup_time_to.substring(0, 5)}`;
} }
// //
if (record.pickup_place) { if (record.pickup_place) {
infoText += infoText ? '\n' : ''; infoText += infoText ? '\n' : '';
infoText += `地点: ${record.pickup_place}`; infoText += `地点: ${record.pickup_place}`;
@ -810,7 +814,7 @@ export default defineComponent({
lineHeight: '1.5', lineHeight: '1.5',
fontSize: '12px' fontSize: '12px'
} }
}, infoText || '暂无自提信息'); }, infoText || '暂无兑换信息');
} }
}, },
{ {
@ -858,6 +862,16 @@ export default defineComponent({
if (visible) { if (visible) {
// //
editActiveTabKey.value = 'basic' editActiveTabKey.value = 'basic'
//
if (editFormState.value.delivery_time_type === 'SCHEDULED') {
nextTick(() => {
console.log('模态框显示后,检查时间选择器值:', {
from: editPickupTimeFrom.value,
to: editPickupTimeTo.value
})
})
}
} }
}) })
@ -875,10 +889,15 @@ export default defineComponent({
try { try {
currentEditId.value = record.id currentEditId.value = record.id
//
editPickupTimeFrom.value = null
editPickupTimeTo.value = null
// //
const res = await request.get(`/api/merchant/product/${record.id}`) const res = await request.get(`/api/merchant/product/${record.id}`)
if (res.code === 200) { if (res.code === 200) {
const productData = res.data const productData = res.data
console.log('商品详情数据:', productData)
// //
editFormState.value = { editFormState.value = {
@ -899,16 +918,28 @@ export default defineComponent({
product_detail: productData.product_detail || '', product_detail: productData.product_detail || '',
purchase_note: productData.purchase_note || '' purchase_note: productData.purchase_note || ''
} }
console.log('编辑表单数据:', editFormState.value)
// //
editModalVisible.value = true
//
nextTick(() => {
console.log('设置时间选择器值...')
//
if (productData.pickup_time_from) { if (productData.pickup_time_from) {
editPickupTimeFrom.value = dayjs(productData.pickup_time_from, 'HH:mm:ss') console.log('设置兑换开始时间:', productData.pickup_time_from)
const timeFrom = dayjs(`2023-01-01 ${productData.pickup_time_from}`)
editPickupTimeFrom.value = timeFrom
console.log('设置后的时间值:', editPickupTimeFrom.value)
} }
if (productData.pickup_time_to) { if (productData.pickup_time_to) {
editPickupTimeTo.value = dayjs(productData.pickup_time_to, 'HH:mm:ss') console.log('设置兑换结束时间:', productData.pickup_time_to)
const timeTo = dayjs(`2023-01-01 ${productData.pickup_time_to}`)
editPickupTimeTo.value = timeTo
console.log('设置后的时间值:', editPickupTimeTo.value)
} }
})
editModalVisible.value = true
} else { } else {
message.error('获取商品详情失败') message.error('获取商品详情失败')
} }
@ -941,6 +972,8 @@ export default defineComponent({
}) })
if (res.code === 200) { if (res.code === 200) {
merchantOptions.value = res.data.items merchantOptions.value = res.data.items
//
fetchData()
} }
} catch (error) { } catch (error) {
console.error('获取商家列表失败:', error) console.error('获取商家列表失败:', error)
@ -964,10 +997,20 @@ export default defineComponent({
const res = await getMerchantProducts(filterForm.value.merchant_id) const res = await getMerchantProducts(filterForm.value.merchant_id)
if (res.code === 200) { if (res.code === 200) {
tableData.value = (res.data.items || []).map(item => ({ tableData.value = (res.data.items || []).map(item => {
//
let merchant_name = ''
if (item.merchant_id) {
const merchant = merchantOptions.value.find(m => m.id === item.merchant_id)
merchant_name = merchant ? merchant.name : `商家ID: ${item.merchant_id}`
}
return {
...item, ...item,
merchant_name: merchant_name, //
statusLoading: false statusLoading: false
})) }
})
pagination.value.total = res.data.total pagination.value.total = res.data.total
} else { } else {
tableData.value = [] tableData.value = []
@ -1006,6 +1049,23 @@ export default defineComponent({
const editPickupTimeFrom = ref(null); const editPickupTimeFrom = ref(null);
const editPickupTimeTo = ref(null); const editPickupTimeTo = ref(null);
//
const editPickupTimeFromComputed = computed({
get: () => editPickupTimeFrom.value,
set: (val) => {
editPickupTimeFrom.value = val;
updateEditPickupTimeFrom();
}
});
const editPickupTimeToComputed = computed({
get: () => editPickupTimeTo.value,
set: (val) => {
editPickupTimeTo.value = val;
updateEditPickupTimeTo();
}
});
// //
const updatePickupTimeFrom = () => { const updatePickupTimeFrom = () => {
if (pickupTimeFrom.value) { if (pickupTimeFrom.value) {
@ -1024,23 +1084,27 @@ export default defineComponent({
} }
}; };
// //
const updateEditPickupTimeFrom = () => { const updateEditPickupTimeFrom = () => {
console.log('更新兑换开始时间:', editPickupTimeFrom.value)
if (editPickupTimeFrom.value) { if (editPickupTimeFrom.value) {
editFormState.value.pickup_time_from = dayjs(editPickupTimeFrom.value).format('HH:mm:ss'); editFormState.value.pickup_time_from = dayjs(editPickupTimeFrom.value).format('HH:mm:ss')
} else { } else {
editFormState.value.pickup_time_from = ''; editFormState.value.pickup_time_from = ''
}
console.log('表单兑换开始时间:', editFormState.value.pickup_time_from)
} }
};
// //
const updateEditPickupTimeTo = () => { const updateEditPickupTimeTo = () => {
console.log('更新兑换结束时间:', editPickupTimeTo.value)
if (editPickupTimeTo.value) { if (editPickupTimeTo.value) {
editFormState.value.pickup_time_to = dayjs(editPickupTimeTo.value).format('HH:mm:ss'); editFormState.value.pickup_time_to = dayjs(editPickupTimeTo.value).format('HH:mm:ss')
} else { } else {
editFormState.value.pickup_time_to = ''; editFormState.value.pickup_time_to = ''
}
console.log('表单兑换结束时间:', editFormState.value.pickup_time_to)
} }
};
// delivery_type // delivery_type
watch(() => formState.value.delivery_time_type, (newType) => { watch(() => formState.value.delivery_time_type, (newType) => {
@ -1079,47 +1143,37 @@ export default defineComponent({
gift_points_rate: [{ required: true, message: '请输入赠送积分比例' }], gift_points_rate: [{ required: true, message: '请输入赠送积分比例' }],
qty: [{ required: true, message: '请输入库存数量' }], qty: [{ required: true, message: '请输入库存数量' }],
delivery_time_type: [{ required: true, message: '请选择配送时间类型' }], delivery_time_type: [{ required: true, message: '请选择配送时间类型' }],
// //
pickup_place: [{ pickup_place: [{
required: true, required: true,
message: '请输入自提点地址', message: '请输入兑换点地址',
trigger: 'change', trigger: 'change',
validator: (rule, value) => { validator: (rule, value) => {
if (formState.value.delivery_time_type === 'SCHEDULED' && (!value || value.trim() === '')) { if (formState.value.delivery_time_type === 'SCHEDULED' && (!value || value.trim() === '')) {
return Promise.reject('请输入自提点地址'); return Promise.reject('请输入兑换点地址');
}
return Promise.resolve();
}
}],
delivery_date: [{
required: true,
message: '请选择自提日期',
trigger: 'change',
validator: (rule, value) => {
if (formState.value.delivery_time_type === 'SCHEDULED' && !value) {
return Promise.reject('请选择自提日期');
} }
return Promise.resolve(); return Promise.resolve();
} }
}], }],
// delivery_date
pickup_time_from: [{ pickup_time_from: [{
required: true, required: true,
message: '请选择自提开始时间', message: '请选择兑换开始时间',
trigger: 'change', trigger: 'change',
validator: (rule, value) => { validator: (rule, value) => {
if (formState.value.delivery_time_type === 'SCHEDULED' && (!value || value.trim() === '')) { if (formState.value.delivery_time_type === 'SCHEDULED' && (!value || value.trim() === '')) {
return Promise.reject('请选择自提开始时间'); return Promise.reject('请选择兑换开始时间');
} }
return Promise.resolve(); return Promise.resolve();
} }
}], }],
pickup_time_to: [{ pickup_time_to: [{
required: true, required: true,
message: '请选择自提结束时间', message: '请选择兑换结束时间',
trigger: 'change', trigger: 'change',
validator: (rule, value) => { validator: (rule, value) => {
if (formState.value.delivery_time_type === 'SCHEDULED' && (!value || value.trim() === '')) { if (formState.value.delivery_time_type === 'SCHEDULED' && (!value || value.trim() === '')) {
return Promise.reject('请选择自提结束时间'); return Promise.reject('请选择兑换结束时间');
} }
return Promise.resolve(); return Promise.resolve();
} }
@ -1139,24 +1193,27 @@ export default defineComponent({
// //
if (formData.delivery_time_type === 'IMMEDIATE') { if (formData.delivery_time_type === 'IMMEDIATE') {
// //
formData.delivery_type = 'DELIVERY' formData.delivery_type = 'DELIVERY'
formData.delivery_date = dayjs().format('YYYY-MM-DD') formData.delivery_date = dayjs().format('YYYY-MM-DD')
// //
delete formData.pickup_place delete formData.pickup_place
delete formData.pickup_time_from delete formData.pickup_time_from
delete formData.pickup_time_to delete formData.pickup_time_to
} else if (formData.delivery_time_type === 'SCHEDULED') { } else if (formData.delivery_time_type === 'SCHEDULED') {
// //
formData.delivery_type = 'PICKUP' formData.delivery_type = 'PICKUP'
// //
if (formData.delivery_date) { if (formData.delivery_date) {
formData.delivery_date = dayjs(formData.delivery_date).format('YYYY-MM-DD') formData.delivery_date = dayjs(formData.delivery_date).format('YYYY-MM-DD')
} else {
// 使
formData.delivery_date = dayjs().format('YYYY-MM-DD')
} }
// //
if (pickupTimeFrom.value) { if (pickupTimeFrom.value) {
formData.pickup_time_from = dayjs(pickupTimeFrom.value).format('HH:mm:ss') formData.pickup_time_from = dayjs(pickupTimeFrom.value).format('HH:mm:ss')
} }
@ -1334,24 +1391,27 @@ export default defineComponent({
// //
if (formData.delivery_time_type === 'IMMEDIATE') { if (formData.delivery_time_type === 'IMMEDIATE') {
// //
formData.delivery_type = 'DELIVERY' formData.delivery_type = 'DELIVERY'
formData.delivery_date = dayjs().format('YYYY-MM-DD') formData.delivery_date = dayjs().format('YYYY-MM-DD')
// //
delete formData.pickup_place delete formData.pickup_place
delete formData.pickup_time_from delete formData.pickup_time_from
delete formData.pickup_time_to delete formData.pickup_time_to
} else if (formData.delivery_time_type === 'SCHEDULED') { } else if (formData.delivery_time_type === 'SCHEDULED') {
// //
formData.delivery_type = 'PICKUP' formData.delivery_type = 'PICKUP'
// //
if (formData.delivery_date) { if (formData.delivery_date) {
formData.delivery_date = dayjs(formData.delivery_date).format('YYYY-MM-DD') formData.delivery_date = dayjs(formData.delivery_date).format('YYYY-MM-DD')
} else {
// 使
formData.delivery_date = dayjs().format('YYYY-MM-DD')
} }
// //
if (editPickupTimeFrom.value) { if (editPickupTimeFrom.value) {
formData.pickup_time_from = dayjs(editPickupTimeFrom.value).format('HH:mm:ss') formData.pickup_time_from = dayjs(editPickupTimeFrom.value).format('HH:mm:ss')
} }
@ -1410,8 +1470,9 @@ export default defineComponent({
// //
const handleDeliveryTimeTypeChange = (e) => { const handleDeliveryTimeTypeChange = (e) => {
console.log('配送时间类型变更:', e.target.value)
if (e.target.value === 'IMMEDIATE') { if (e.target.value === 'IMMEDIATE') {
// - // -
formState.value.delivery_type = 'DELIVERY' formState.value.delivery_type = 'DELIVERY'
formState.value.pickup_place = '' formState.value.pickup_place = ''
formState.value.pickup_time_from = '' formState.value.pickup_time_from = ''
@ -1419,17 +1480,21 @@ export default defineComponent({
formState.value.delivery_date = dayjs().format('YYYY-MM-DD') formState.value.delivery_date = dayjs().format('YYYY-MM-DD')
pickupTimeFrom.value = null pickupTimeFrom.value = null
pickupTimeTo.value = null pickupTimeTo.value = null
console.log('小时达模式下的表单数据:', formState.value)
} else if (e.target.value === 'SCHEDULED') { } else if (e.target.value === 'SCHEDULED') {
// - // -
formState.value.delivery_type = 'PICKUP' formState.value.delivery_type = 'PICKUP'
formState.value.delivery_date = null // delivery_date
// pickup_time_from pickup_time_to
console.log('预约达模式下的表单数据:', formState.value)
} }
} }
// //
const handleEditDeliveryTimeTypeChange = (e) => { const handleEditDeliveryTimeTypeChange = (e) => {
console.log('配送时间类型变更:', e.target.value)
if (e.target.value === 'IMMEDIATE') { if (e.target.value === 'IMMEDIATE') {
// - // -
editFormState.value.delivery_type = 'DELIVERY' editFormState.value.delivery_type = 'DELIVERY'
editFormState.value.pickup_place = '' editFormState.value.pickup_place = ''
editFormState.value.pickup_time_from = '' editFormState.value.pickup_time_from = ''
@ -1437,17 +1502,18 @@ export default defineComponent({
editFormState.value.delivery_date = dayjs().format('YYYY-MM-DD') editFormState.value.delivery_date = dayjs().format('YYYY-MM-DD')
editPickupTimeFrom.value = null editPickupTimeFrom.value = null
editPickupTimeTo.value = null editPickupTimeTo.value = null
console.log('小时达模式下的表单数据:', editFormState.value)
} else if (e.target.value === 'SCHEDULED') { } else if (e.target.value === 'SCHEDULED') {
// - // -
editFormState.value.delivery_type = 'PICKUP' editFormState.value.delivery_type = 'PICKUP'
// delivery_date // delivery_date
// pickup_time_from pickup_time_to // pickup_time_from pickup_time_to
console.log('预约达模式下的表单数据:', editFormState.value)
} }
} }
onMounted(() => { onMounted(() => {
fetchMerchantOptions() fetchMerchantOptions() //
fetchData() //
}) })
return { return {
@ -1486,8 +1552,8 @@ export default defineComponent({
pickupTimeTo, pickupTimeTo,
updatePickupTimeFrom, updatePickupTimeFrom,
updatePickupTimeTo, updatePickupTimeTo,
editPickupTimeFrom, editPickupTimeFrom: editPickupTimeFromComputed,
editPickupTimeTo, editPickupTimeTo: editPickupTimeToComputed,
updateEditPickupTimeFrom, updateEditPickupTimeFrom,
updateEditPickupTimeTo, updateEditPickupTimeTo,
activeTabKey, activeTabKey,