修改商品页面
This commit is contained in:
aaron
parent
373325859c
commit
9ab24be577
@ -255,84 +255,89 @@
|
|||||||
<div class="form-item-help">0 次表示不限购</div>
|
<div class="form-item-help">0 次表示不限购</div>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
|
|
||||||
<a-form-item label="配送方式" name="delivery_type" required>
|
<!-- 配送时间类型 -->
|
||||||
<a-radio-group v-model:value="formState.delivery_type">
|
|
||||||
<a-radio value="DELIVERY">配送到家</a-radio>
|
|
||||||
<a-radio value="PICKUP">自提</a-radio>
|
|
||||||
</a-radio-group>
|
|
||||||
</a-form-item>
|
|
||||||
|
|
||||||
<a-form-item
|
|
||||||
v-if="formState.delivery_type === 'PICKUP'"
|
|
||||||
label="自提点"
|
|
||||||
name="pickup_place"
|
|
||||||
required
|
|
||||||
>
|
|
||||||
<a-input
|
|
||||||
v-model:value="formState.pickup_place"
|
|
||||||
placeholder="请输入自提点地址"
|
|
||||||
/>
|
|
||||||
</a-form-item>
|
|
||||||
|
|
||||||
<a-form-item
|
|
||||||
v-if="formState.delivery_type === 'PICKUP'"
|
|
||||||
label="自提时间"
|
|
||||||
required
|
|
||||||
>
|
|
||||||
<div class="time-range-wrapper">
|
|
||||||
<a-form-item
|
|
||||||
name="pickup_time_from"
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<a-time-picker
|
|
||||||
v-model:value="pickupTimeFrom"
|
|
||||||
format="HH:mm"
|
|
||||||
placeholder="开始时间"
|
|
||||||
style="width: 100%"
|
|
||||||
@change="updatePickupTimeFrom"
|
|
||||||
:minute-step="10"
|
|
||||||
/>
|
|
||||||
</a-form-item>
|
|
||||||
<span class="time-separator">至</span>
|
|
||||||
<a-form-item
|
|
||||||
name="pickup_time_to"
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<a-time-picker
|
|
||||||
v-model:value="pickupTimeTo"
|
|
||||||
format="HH:mm"
|
|
||||||
placeholder="结束时间"
|
|
||||||
style="width: 100%"
|
|
||||||
@change="updatePickupTimeTo"
|
|
||||||
:minute-step="10"
|
|
||||||
/>
|
|
||||||
</a-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-item-help">请选择自提的时间范围</div>
|
|
||||||
</a-form-item>
|
|
||||||
|
|
||||||
<a-form-item label="配送时间类型" name="delivery_time_type" required>
|
<a-form-item label="配送时间类型" name="delivery_time_type" required>
|
||||||
<a-radio-group v-model:value="formState.delivery_time_type">
|
<a-radio-group
|
||||||
<a-radio value="IMMEDIATE">及时送</a-radio>
|
v-model:value="formState.delivery_time_type"
|
||||||
<a-radio value="SCHEDULED">定时送</a-radio>
|
@change="handleDeliveryTimeTypeChange"
|
||||||
|
>
|
||||||
|
<a-radio value="IMMEDIATE">及时达</a-radio>
|
||||||
|
<a-radio value="SCHEDULED">定时达</a-radio>
|
||||||
</a-radio-group>
|
</a-radio-group>
|
||||||
|
<div class="form-item-help">
|
||||||
|
<template v-if="formState.delivery_time_type === 'IMMEDIATE'">
|
||||||
|
及时达：商品将配送到家，默认当天配送
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
定时达：商品将由顾客自提，需填写自提点信息和自提时间
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
|
|
||||||
<a-form-item
|
<!-- 当选择"定时达"时，显示自提信息 -->
|
||||||
v-if="formState.delivery_time_type === 'SCHEDULED'"
|
<template v-if="formState.delivery_time_type === 'SCHEDULED'">
|
||||||
label="送货时间"
|
<a-form-item
|
||||||
name="delivery_date"
|
label="自提点"
|
||||||
required
|
name="pickup_place"
|
||||||
>
|
required
|
||||||
<a-date-picker
|
>
|
||||||
v-model:value="formState.delivery_date"
|
<a-input
|
||||||
:disabled-date="disabledDate"
|
v-model:value="formState.pickup_place"
|
||||||
format="YYYY-MM-DD"
|
placeholder="请输入自提点地址"
|
||||||
valueFormat="YYYY-MM-DD"
|
/>
|
||||||
style="width: 100%"
|
</a-form-item>
|
||||||
placeholder="请选择送货日期"
|
|
||||||
/>
|
<a-form-item
|
||||||
</a-form-item>
|
label="自提日期"
|
||||||
|
name="pickup_date"
|
||||||
|
required
|
||||||
|
>
|
||||||
|
<a-date-picker
|
||||||
|
v-model:value="formState.pickup_date"
|
||||||
|
:disabled-date="disabledDate"
|
||||||
|
format="YYYY-MM-DD"
|
||||||
|
valueFormat="YYYY-MM-DD"
|
||||||
|
style="width: 100%"
|
||||||
|
placeholder="请选择自提日期"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
|
||||||
|
<a-form-item
|
||||||
|
label="自提时间"
|
||||||
|
required
|
||||||
|
>
|
||||||
|
<div class="time-range-wrapper">
|
||||||
|
<a-form-item
|
||||||
|
name="pickup_time_from"
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<a-time-picker
|
||||||
|
v-model:value="pickupTimeFrom"
|
||||||
|
format="HH:mm"
|
||||||
|
placeholder="开始时间"
|
||||||
|
style="width: 100%"
|
||||||
|
@change="updatePickupTimeFrom"
|
||||||
|
:minute-step="10"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
<span class="time-separator">至</span>
|
||||||
|
<a-form-item
|
||||||
|
name="pickup_time_to"
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<a-time-picker
|
||||||
|
v-model:value="pickupTimeTo"
|
||||||
|
format="HH:mm"
|
||||||
|
placeholder="结束时间"
|
||||||
|
style="width: 100%"
|
||||||
|
@change="updatePickupTimeTo"
|
||||||
|
:minute-step="10"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</div>
|
||||||
|
<div class="form-item-help">请选择自提的时间范围</div>
|
||||||
|
</a-form-item>
|
||||||
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
@ -517,84 +522,89 @@
|
|||||||
<div class="form-item-help">0 次表示不限购</div>
|
<div class="form-item-help">0 次表示不限购</div>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
|
|
||||||
<a-form-item label="配送方式" name="delivery_type" required>
|
<!-- 配送时间类型 -->
|
||||||
<a-radio-group v-model:value="editFormState.delivery_type">
|
|
||||||
<a-radio value="DELIVERY">配送到家</a-radio>
|
|
||||||
<a-radio value="PICKUP">自提</a-radio>
|
|
||||||
</a-radio-group>
|
|
||||||
</a-form-item>
|
|
||||||
|
|
||||||
<a-form-item
|
|
||||||
v-if="editFormState.delivery_type === 'PICKUP'"
|
|
||||||
label="自提点"
|
|
||||||
name="pickup_place"
|
|
||||||
required
|
|
||||||
>
|
|
||||||
<a-input
|
|
||||||
v-model:value="editFormState.pickup_place"
|
|
||||||
placeholder="请输入自提点地址"
|
|
||||||
/>
|
|
||||||
</a-form-item>
|
|
||||||
|
|
||||||
<a-form-item
|
|
||||||
v-if="editFormState.delivery_type === 'PICKUP'"
|
|
||||||
label="自提时间"
|
|
||||||
required
|
|
||||||
>
|
|
||||||
<div class="time-range-wrapper">
|
|
||||||
<a-form-item
|
|
||||||
name="pickup_time_from"
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<a-time-picker
|
|
||||||
v-model:value="editPickupTimeFrom"
|
|
||||||
format="HH:mm"
|
|
||||||
placeholder="开始时间"
|
|
||||||
style="width: 100%"
|
|
||||||
@change="updateEditPickupTimeFrom"
|
|
||||||
:minute-step="10"
|
|
||||||
/>
|
|
||||||
</a-form-item>
|
|
||||||
<span class="time-separator">至</span>
|
|
||||||
<a-form-item
|
|
||||||
name="pickup_time_to"
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<a-time-picker
|
|
||||||
v-model:value="editPickupTimeTo"
|
|
||||||
format="HH:mm"
|
|
||||||
placeholder="结束时间"
|
|
||||||
style="width: 100%"
|
|
||||||
@change="updateEditPickupTimeTo"
|
|
||||||
:minute-step="10"
|
|
||||||
/>
|
|
||||||
</a-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-item-help">请选择自提的时间范围</div>
|
|
||||||
</a-form-item>
|
|
||||||
|
|
||||||
<a-form-item label="配送时间类型" name="delivery_time_type" required>
|
<a-form-item label="配送时间类型" name="delivery_time_type" required>
|
||||||
<a-radio-group v-model:value="editFormState.delivery_time_type">
|
<a-radio-group
|
||||||
<a-radio value="IMMEDIATE">及时送</a-radio>
|
v-model:value="editFormState.delivery_time_type"
|
||||||
<a-radio value="SCHEDULED">定时送</a-radio>
|
@change="handleEditDeliveryTimeTypeChange"
|
||||||
|
>
|
||||||
|
<a-radio value="IMMEDIATE">及时达</a-radio>
|
||||||
|
<a-radio value="SCHEDULED">定时达</a-radio>
|
||||||
</a-radio-group>
|
</a-radio-group>
|
||||||
|
<div class="form-item-help">
|
||||||
|
<template v-if="editFormState.delivery_time_type === 'IMMEDIATE'">
|
||||||
|
及时达：商品将配送到家，默认当天配送
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
定时达：商品将由顾客自提，需填写自提点信息和自提时间
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
|
|
||||||
<a-form-item
|
<!-- 当选择"定时达"时，显示自提信息 -->
|
||||||
v-if="editFormState.delivery_time_type === 'SCHEDULED'"
|
<template v-if="editFormState.delivery_time_type === 'SCHEDULED'">
|
||||||
label="送货时间"
|
<a-form-item
|
||||||
name="delivery_date"
|
label="自提点"
|
||||||
required
|
name="pickup_place"
|
||||||
>
|
required
|
||||||
<a-date-picker
|
>
|
||||||
v-model:value="editFormState.delivery_date"
|
<a-input
|
||||||
:disabled-date="disabledDate"
|
v-model:value="editFormState.pickup_place"
|
||||||
format="YYYY-MM-DD"
|
placeholder="请输入自提点地址"
|
||||||
valueFormat="YYYY-MM-DD"
|
/>
|
||||||
style="width: 100%"
|
</a-form-item>
|
||||||
placeholder="请选择送货日期"
|
|
||||||
/>
|
<a-form-item
|
||||||
</a-form-item>
|
label="自提日期"
|
||||||
|
name="pickup_date"
|
||||||
|
required
|
||||||
|
>
|
||||||
|
<a-date-picker
|
||||||
|
v-model:value="editFormState.pickup_date"
|
||||||
|
:disabled-date="disabledDate"
|
||||||
|
format="YYYY-MM-DD"
|
||||||
|
valueFormat="YYYY-MM-DD"
|
||||||
|
style="width: 100%"
|
||||||
|
placeholder="请选择自提日期"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
|
||||||
|
<a-form-item
|
||||||
|
label="自提时间"
|
||||||
|
required
|
||||||
|
>
|
||||||
|
<div class="time-range-wrapper">
|
||||||
|
<a-form-item
|
||||||
|
name="pickup_time_from"
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<a-time-picker
|
||||||
|
v-model:value="editPickupTimeFrom"
|
||||||
|
format="HH:mm"
|
||||||
|
placeholder="开始时间"
|
||||||
|
style="width: 100%"
|
||||||
|
@change="updateEditPickupTimeFrom"
|
||||||
|
:minute-step="10"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
<span class="time-separator">至</span>
|
||||||
|
<a-form-item
|
||||||
|
name="pickup_time_to"
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<a-time-picker
|
||||||
|
v-model:value="editPickupTimeTo"
|
||||||
|
format="HH:mm"
|
||||||
|
placeholder="结束时间"
|
||||||
|
style="width: 100%"
|
||||||
|
@change="updateEditPickupTimeTo"
|
||||||
|
:minute-step="10"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</div>
|
||||||
|
<div class="form-item-help">请选择自提的时间范围</div>
|
||||||
|
</a-form-item>
|
||||||
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
@ -700,6 +710,7 @@ export default defineComponent({
|
|||||||
const editActiveTabKey = ref('basic');
|
const editActiveTabKey = ref('basic');
|
||||||
|
|
||||||
const editFormState = ref({
|
const editFormState = ref({
|
||||||
|
merchant_id: undefined,
|
||||||
operation_type: 'MERCHANT',
|
operation_type: 'MERCHANT',
|
||||||
name: '',
|
name: '',
|
||||||
image_url: '',
|
image_url: '',
|
||||||
@ -711,12 +722,13 @@ export default defineComponent({
|
|||||||
gift_points_rate: 0,
|
gift_points_rate: 0,
|
||||||
promotion_text: '',
|
promotion_text: '',
|
||||||
qty: 0,
|
qty: 0,
|
||||||
delivery_type: 'DELIVERY',
|
delivery_type: 'DELIVERY', // 默认配送到家
|
||||||
pickup_place: '',
|
pickup_place: '',
|
||||||
pickup_time_from: '',
|
pickup_time_from: '',
|
||||||
pickup_time_to: '',
|
pickup_time_to: '',
|
||||||
delivery_time_type: 'IMMEDIATE',
|
pickup_date: null, // 自提日期
|
||||||
delivery_date: null,
|
delivery_time_type: 'IMMEDIATE', // 默认及时达
|
||||||
|
delivery_date: dayjs().format('YYYY-MM-DD'), // 默认当天
|
||||||
product_detail: '<h1>商品详情</h1><p>这里是商品的详细描述，支持<strong>富文本</strong>格式。</p><ul><li>特点一</li><li>特点二</li><li>特点三</li></ul>',
|
product_detail: '<h1>商品详情</h1><p>这里是商品的详细描述，支持<strong>富文本</strong>格式。</p><ul><li>特点一</li><li>特点二</li><li>特点三</li></ul>',
|
||||||
purchase_note: ''
|
purchase_note: ''
|
||||||
})
|
})
|
||||||
@ -734,12 +746,13 @@ export default defineComponent({
|
|||||||
gift_points_rate: 0,
|
gift_points_rate: 0,
|
||||||
promotion_text: '',
|
promotion_text: '',
|
||||||
qty: 0,
|
qty: 0,
|
||||||
delivery_type: 'DELIVERY',
|
delivery_type: 'DELIVERY', // 默认配送到家
|
||||||
pickup_place: '',
|
pickup_place: '',
|
||||||
pickup_time_from: '',
|
pickup_time_from: '',
|
||||||
pickup_time_to: '',
|
pickup_time_to: '',
|
||||||
delivery_time_type: 'IMMEDIATE',
|
pickup_date: null, // 自提日期
|
||||||
delivery_date: null,
|
delivery_time_type: 'IMMEDIATE', // 默认及时达
|
||||||
|
delivery_date: dayjs().format('YYYY-MM-DD'), // 默认当天
|
||||||
product_detail: '<h1>商品详情</h1><p>这里是商品的详细描述，支持<strong>富文本</strong>格式。</p><ul><li>特点一</li><li>特点二</li><li>特点三</li></ul>',
|
product_detail: '<h1>商品详情</h1><p>这里是商品的详细描述，支持<strong>富文本</strong>格式。</p><ul><li>特点一</li><li>特点二</li><li>特点三</li></ul>',
|
||||||
purchase_note: ''
|
purchase_note: ''
|
||||||
})
|
})
|
||||||
@ -780,6 +793,26 @@ export default defineComponent({
|
|||||||
width: '10%',
|
width: '10%',
|
||||||
align: 'right'
|
align: 'right'
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: '配送时间类型',
|
||||||
|
dataIndex: 'delivery_time_type',
|
||||||
|
key: 'delivery_time_type',
|
||||||
|
width: '10%',
|
||||||
|
align: 'center',
|
||||||
|
customRender: ({ text }) => {
|
||||||
|
const typeMap = {
|
||||||
|
'IMMEDIATE': '及时达',
|
||||||
|
'SCHEDULED': '定时达'
|
||||||
|
};
|
||||||
|
const colorMap = {
|
||||||
|
'IMMEDIATE': 'blue',
|
||||||
|
'SCHEDULED': 'green'
|
||||||
|
};
|
||||||
|
return h(Tag, {
|
||||||
|
color: colorMap[text]
|
||||||
|
}, typeMap[text] || text);
|
||||||
|
}
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: '限购',
|
title: '限购',
|
||||||
dataIndex: 'purchase_limit',
|
dataIndex: 'purchase_limit',
|
||||||
@ -1050,10 +1083,6 @@ export default defineComponent({
|
|||||||
gift_points_rate: record.gift_points_rate,
|
gift_points_rate: record.gift_points_rate,
|
||||||
promotion_text: record.promotion_text,
|
promotion_text: record.promotion_text,
|
||||||
qty: record.qty || 0,
|
qty: record.qty || 0,
|
||||||
delivery_type: record.delivery_type || 'DELIVERY',
|
|
||||||
pickup_place: record.pickup_place || '',
|
|
||||||
pickup_time_from: record.pickup_time_from || '',
|
|
||||||
pickup_time_to: record.pickup_time_to || '',
|
|
||||||
delivery_time_type: record.delivery_time_type || 'IMMEDIATE',
|
delivery_time_type: record.delivery_time_type || 'IMMEDIATE',
|
||||||
delivery_date: record.delivery_date || null,
|
delivery_date: record.delivery_date || null,
|
||||||
product_detail: productDetailHtml,
|
product_detail: productDetailHtml,
|
||||||
@ -1195,7 +1224,7 @@ export default defineComponent({
|
|||||||
};
|
};
|
||||||
|
|
||||||
// 监听delivery_type的变化，重置时间选择器
|
// 监听delivery_type的变化，重置时间选择器
|
||||||
watch(() => formState.value.delivery_type, (newType) => {
|
watch(() => formState.value.delivery_time_type, (newType) => {
|
||||||
if (newType !== 'PICKUP') {
|
if (newType !== 'PICKUP') {
|
||||||
pickupTimeFrom.value = null;
|
pickupTimeFrom.value = null;
|
||||||
pickupTimeTo.value = null;
|
pickupTimeTo.value = null;
|
||||||
@ -1205,7 +1234,7 @@ export default defineComponent({
|
|||||||
});
|
});
|
||||||
|
|
||||||
// 监听编辑模式下delivery_type的变化
|
// 监听编辑模式下delivery_type的变化
|
||||||
watch(() => editFormState.value.delivery_type, (newType) => {
|
watch(() => editFormState.value.delivery_time_type, (newType) => {
|
||||||
if (newType !== 'PICKUP') {
|
if (newType !== 'PICKUP') {
|
||||||
editPickupTimeFrom.value = null;
|
editPickupTimeFrom.value = null;
|
||||||
editPickupTimeTo.value = null;
|
editPickupTimeTo.value = null;
|
||||||
@ -1221,37 +1250,45 @@ export default defineComponent({
|
|||||||
};
|
};
|
||||||
|
|
||||||
const rules = {
|
const rules = {
|
||||||
merchant_id: [{ required: true, message: '请选择所属商家' }],
|
merchant_id: [{ required: true, message: '请选择商户' }],
|
||||||
operation_type: [{ required: true, message: '请选择营业类型' }],
|
operation_type: [{ required: true, message: '请选择营业类型' }],
|
||||||
name: [{ required: true, message: '请输入商品名称' }],
|
name: [{ required: true, message: '请输入商品名称' }],
|
||||||
image_url: [{ required: true, message: '请上传商品图片' }],
|
image_url: [{ required: true, message: '请上传商品图片' }],
|
||||||
product_price: [{ required: true, message: '请输入商品原价' }],
|
product_price: [{ required: true, message: '请输入商品原价' }],
|
||||||
sale_price: [{ required: true, message: '请输入销售价格' }],
|
sale_price: [{ required: true, message: '请输入销售价格' }],
|
||||||
settlement_amount: [{ required: true, message: '请输入结算价格' }],
|
settlement_amount: [{ required: true, message: '请输入结算价格' }],
|
||||||
gift_points_rate: [
|
gift_points_rate: [{ required: true, message: '请输入赠送积分比例' }],
|
||||||
{ required: true, message: '请输入赠送积分比例' },
|
|
||||||
{ type: 'number', message: '请输入有效的数字' },
|
|
||||||
{ type: 'number', min: 0, max: 100, message: '比例必须在0-100之间' }
|
|
||||||
],
|
|
||||||
qty: [{ required: true, message: '请输入库存数量' }],
|
qty: [{ required: true, message: '请输入库存数量' }],
|
||||||
delivery_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_type === 'PICKUP' && (!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_date: [{
|
||||||
|
required: true,
|
||||||
|
message: '请选择自提日期',
|
||||||
|
trigger: 'change',
|
||||||
|
validator: (rule, value) => {
|
||||||
|
if (formState.value.delivery_time_type === 'SCHEDULED' && !value) {
|
||||||
|
return Promise.reject('请选择自提日期');
|
||||||
|
}
|
||||||
|
return Promise.resolve();
|
||||||
|
}
|
||||||
|
}],
|
||||||
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_type === 'PICKUP' && (!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();
|
||||||
@ -1262,59 +1299,73 @@ export default defineComponent({
|
|||||||
message: '请选择自提结束时间',
|
message: '请选择自提结束时间',
|
||||||
trigger: 'change',
|
trigger: 'change',
|
||||||
validator: (rule, value) => {
|
validator: (rule, value) => {
|
||||||
if (formState.value.delivery_type === 'PICKUP' && (!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();
|
||||||
}
|
}
|
||||||
}],
|
}],
|
||||||
delivery_time_type: [{ required: true, message: '请选择配送时间类型' }],
|
product_detail: [{ max: 2000, message: '商品详情不能超过2000个字符' }],
|
||||||
delivery_date: [{
|
|
||||||
required: true,
|
|
||||||
message: '请选择送货日期',
|
|
||||||
trigger: 'change',
|
|
||||||
validator: (rule, value) => {
|
|
||||||
if (formState.value.delivery_time_type === 'SCHEDULED' && !value) {
|
|
||||||
return Promise.reject('请选择送货日期');
|
|
||||||
}
|
|
||||||
return Promise.resolve();
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 提交表单
|
// 提交表单
|
||||||
const handleSubmit = () => {
|
const handleSubmit = async () => {
|
||||||
formRef.value.validate().then(async () => {
|
try {
|
||||||
try {
|
await formRef.value.validate()
|
||||||
confirmLoading.value = true
|
|
||||||
// 处理日期格式 - 只取日期部分
|
// 设置加载状态
|
||||||
const formData = { ...formState.value };
|
confirmLoading.value = true
|
||||||
if (formData.delivery_date) {
|
|
||||||
formData.delivery_date = dayjs(formData.delivery_date).format('YYYY-MM-DD');
|
const formData = { ...formState.value }
|
||||||
|
|
||||||
|
// 根据配送时间类型确定配送类型和日期
|
||||||
|
if (formData.delivery_time_type === 'IMMEDIATE') {
|
||||||
|
// 及时达只能配送到家，自动设置为当天配送
|
||||||
|
formData.delivery_type = 'DELIVERY'
|
||||||
|
formData.delivery_date = dayjs().format('YYYY-MM-DD')
|
||||||
|
formData.pickup_place = ''
|
||||||
|
formData.pickup_time_from = ''
|
||||||
|
formData.pickup_time_to = ''
|
||||||
|
formData.pickup_date = null
|
||||||
|
} else if (formData.delivery_time_type === 'SCHEDULED') {
|
||||||
|
// 定时达只能自提
|
||||||
|
formData.delivery_type = 'PICKUP'
|
||||||
|
formData.delivery_date = null
|
||||||
|
|
||||||
|
// 格式化自提日期
|
||||||
|
if (formData.pickup_date) {
|
||||||
|
formData.pickup_date = dayjs(formData.pickup_date).format('YYYY-MM-DD')
|
||||||
}
|
}
|
||||||
|
|
||||||
// 确保product_detail存在并转换为Markdown格式
|
// 格式化自提时间
|
||||||
if (formData.product_detail) {
|
if (pickupTimeFrom.value) {
|
||||||
formData.product_detail = htmlToMarkdown(formData.product_detail);
|
formData.pickup_time_from = dayjs(pickupTimeFrom.value).format('HH:mm')
|
||||||
} else {
|
|
||||||
formData.product_detail = '';
|
|
||||||
}
|
}
|
||||||
|
if (pickupTimeTo.value) {
|
||||||
const res = await request.post('/api/merchant/product', formData)
|
formData.pickup_time_to = dayjs(pickupTimeTo.value).format('HH:mm')
|
||||||
if (res.code === 200) {
|
|
||||||
message.success('添加成功')
|
|
||||||
addModalVisible.value = false
|
|
||||||
fetchData()
|
|
||||||
} else {
|
|
||||||
throw new Error(res.message || '添加失败')
|
|
||||||
}
|
}
|
||||||
} catch (error) {
|
|
||||||
console.error('添加商品失败:', error)
|
|
||||||
message.error(error.message || '添加失败')
|
|
||||||
} finally {
|
|
||||||
confirmLoading.value = false
|
|
||||||
}
|
}
|
||||||
})
|
|
||||||
|
// 将HTML转换为Markdown
|
||||||
|
if (editorRef.value) {
|
||||||
|
formData.product_detail = turndownService.turndown(editorRef.value.getHTML())
|
||||||
|
}
|
||||||
|
|
||||||
|
const res = await request.post('/api/merchant/product', formData)
|
||||||
|
|
||||||
|
if (res.code === 200) {
|
||||||
|
message.success('添加成功')
|
||||||
|
handleCancel()
|
||||||
|
await fetchData()
|
||||||
|
} else {
|
||||||
|
throw new Error(res.message || '添加失败')
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('提交表单失败:', error)
|
||||||
|
message.error(error.message || '添加失败，请检查表单')
|
||||||
|
} finally {
|
||||||
|
confirmLoading.value = false
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 取消添加
|
// 取消添加
|
||||||
@ -1337,8 +1388,9 @@ export default defineComponent({
|
|||||||
pickup_place: '',
|
pickup_place: '',
|
||||||
pickup_time_from: '',
|
pickup_time_from: '',
|
||||||
pickup_time_to: '',
|
pickup_time_to: '',
|
||||||
|
pickup_date: null,
|
||||||
delivery_time_type: 'IMMEDIATE',
|
delivery_time_type: 'IMMEDIATE',
|
||||||
delivery_date: null,
|
delivery_date: dayjs().format('YYYY-MM-DD'),
|
||||||
product_detail: '<h1>商品详情</h1><p>这里是商品的详细描述，支持<strong>富文本</strong>格式。</p><ul><li>特点一</li><li>特点二</li><li>特点三</li></ul>',
|
product_detail: '<h1>商品详情</h1><p>这里是商品的详细描述，支持<strong>富文本</strong>格式。</p><ul><li>特点一</li><li>特点二</li><li>特点三</li></ul>',
|
||||||
purchase_note: ''
|
purchase_note: ''
|
||||||
}
|
}
|
||||||
@ -1461,38 +1513,63 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 提交修改
|
// 提交修改
|
||||||
const handleEditSubmit = () => {
|
const handleEditSubmit = async () => {
|
||||||
editFormRef.value.validate().then(async () => {
|
try {
|
||||||
try {
|
await editFormRef.value.validate()
|
||||||
editLoading.value = true
|
|
||||||
// 处理日期格式 - 只取日期部分
|
// 设置加载状态
|
||||||
const formData = { ...editFormState.value };
|
editLoading.value = true
|
||||||
if (formData.delivery_date) {
|
|
||||||
formData.delivery_date = dayjs(formData.delivery_date).format('YYYY-MM-DD');
|
const formData = { ...editFormState.value }
|
||||||
|
|
||||||
|
// 根据配送时间类型确定配送类型和日期
|
||||||
|
if (formData.delivery_time_type === 'IMMEDIATE') {
|
||||||
|
// 及时达只能配送到家，自动设置为当天配送
|
||||||
|
formData.delivery_type = 'DELIVERY'
|
||||||
|
formData.delivery_date = dayjs().format('YYYY-MM-DD')
|
||||||
|
formData.pickup_place = ''
|
||||||
|
formData.pickup_time_from = ''
|
||||||
|
formData.pickup_time_to = ''
|
||||||
|
formData.pickup_date = null
|
||||||
|
} else if (formData.delivery_time_type === 'SCHEDULED') {
|
||||||
|
// 定时达只能自提
|
||||||
|
formData.delivery_type = 'PICKUP'
|
||||||
|
formData.delivery_date = null
|
||||||
|
|
||||||
|
// 格式化自提日期
|
||||||
|
if (formData.pickup_date) {
|
||||||
|
formData.pickup_date = dayjs(formData.pickup_date).format('YYYY-MM-DD')
|
||||||
}
|
}
|
||||||
|
|
||||||
// 确保product_detail存在并转换为Markdown格式
|
// 格式化自提时间
|
||||||
if (formData.product_detail) {
|
if (editPickupTimeFrom.value) {
|
||||||
formData.product_detail = htmlToMarkdown(formData.product_detail);
|
formData.pickup_time_from = dayjs(editPickupTimeFrom.value).format('HH:mm')
|
||||||
} else {
|
|
||||||
formData.product_detail = '';
|
|
||||||
}
|
}
|
||||||
|
if (editPickupTimeTo.value) {
|
||||||
const res = await request.put(`/api/merchant/product/${currentEditId.value}`, formData)
|
formData.pickup_time_to = dayjs(editPickupTimeTo.value).format('HH:mm')
|
||||||
if (res.code === 200) {
|
|
||||||
message.success('修改成功')
|
|
||||||
editModalVisible.value = false
|
|
||||||
fetchData()
|
|
||||||
} else {
|
|
||||||
throw new Error(res.message || '修改失败')
|
|
||||||
}
|
}
|
||||||
} catch (error) {
|
|
||||||
console.error('修改商品失败:', error)
|
|
||||||
message.error(error.message || '修改失败')
|
|
||||||
} finally {
|
|
||||||
editLoading.value = false
|
|
||||||
}
|
}
|
||||||
})
|
|
||||||
|
// 将HTML转换为Markdown
|
||||||
|
if (editEditorRef.value) {
|
||||||
|
formData.product_detail = turndownService.turndown(editEditorRef.value.getHTML())
|
||||||
|
}
|
||||||
|
|
||||||
|
const res = await request.put(`/api/merchant/product/${currentEditId.value}`, formData)
|
||||||
|
|
||||||
|
if (res.code === 200) {
|
||||||
|
message.success('修改成功')
|
||||||
|
handleEditCancel()
|
||||||
|
await fetchData()
|
||||||
|
} else {
|
||||||
|
throw new Error(res.message || '修改失败')
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('提交编辑表单失败:', error)
|
||||||
|
message.error(error.message || '修改失败，请检查表单')
|
||||||
|
} finally {
|
||||||
|
editLoading.value = false
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 取消修改
|
// 取消修改
|
||||||
@ -1514,8 +1591,9 @@ export default defineComponent({
|
|||||||
pickup_place: '',
|
pickup_place: '',
|
||||||
pickup_time_from: '',
|
pickup_time_from: '',
|
||||||
pickup_time_to: '',
|
pickup_time_to: '',
|
||||||
|
pickup_date: null,
|
||||||
delivery_time_type: 'IMMEDIATE',
|
delivery_time_type: 'IMMEDIATE',
|
||||||
delivery_date: null,
|
delivery_date: dayjs().format('YYYY-MM-DD'),
|
||||||
product_detail: '<h1>商品详情</h1><p>这里是商品的详细描述，支持<strong>富文本</strong>格式。</p><ul><li>特点一</li><li>特点二</li><li>特点三</li></ul>',
|
product_detail: '<h1>商品详情</h1><p>这里是商品的详细描述，支持<strong>富文本</strong>格式。</p><ul><li>特点一</li><li>特点二</li><li>特点三</li></ul>',
|
||||||
purchase_note: ''
|
purchase_note: ''
|
||||||
}
|
}
|
||||||
@ -1529,6 +1607,46 @@ export default defineComponent({
|
|||||||
editModalVisible.value = false
|
editModalVisible.value = false
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 处理配送时间类型变更
|
||||||
|
const handleDeliveryTimeTypeChange = (e) => {
|
||||||
|
if (e.target.value === 'IMMEDIATE') {
|
||||||
|
// 及时达 - 只支持配送到家
|
||||||
|
formState.value.delivery_type = 'DELIVERY'
|
||||||
|
formState.value.pickup_place = ''
|
||||||
|
formState.value.pickup_time_from = ''
|
||||||
|
formState.value.pickup_time_to = ''
|
||||||
|
formState.value.pickup_date = null
|
||||||
|
pickupTimeFrom.value = null
|
||||||
|
pickupTimeTo.value = null
|
||||||
|
// 及时达默认设置为当天，但不显示日期选择
|
||||||
|
formState.value.delivery_date = dayjs().format('YYYY-MM-DD')
|
||||||
|
} else if (e.target.value === 'SCHEDULED') {
|
||||||
|
// 定时达 - 只支持自提
|
||||||
|
formState.value.delivery_type = 'PICKUP'
|
||||||
|
formState.value.delivery_date = null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 处理编辑时配送时间类型变更
|
||||||
|
const handleEditDeliveryTimeTypeChange = (e) => {
|
||||||
|
if (e.target.value === 'IMMEDIATE') {
|
||||||
|
// 及时达 - 只支持配送到家
|
||||||
|
editFormState.value.delivery_type = 'DELIVERY'
|
||||||
|
editFormState.value.pickup_place = ''
|
||||||
|
editFormState.value.pickup_time_from = ''
|
||||||
|
editFormState.value.pickup_time_to = ''
|
||||||
|
editFormState.value.pickup_date = null
|
||||||
|
editPickupTimeFrom.value = null
|
||||||
|
editPickupTimeTo.value = null
|
||||||
|
// 及时达默认设置为当天，但不显示日期选择
|
||||||
|
editFormState.value.delivery_date = dayjs().format('YYYY-MM-DD')
|
||||||
|
} else if (e.target.value === 'SCHEDULED') {
|
||||||
|
// 定时达 - 只支持自提
|
||||||
|
editFormState.value.delivery_type = 'PICKUP'
|
||||||
|
editFormState.value.delivery_date = null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
fetchMerchantOptions()
|
fetchMerchantOptions()
|
||||||
fetchData() // 直接加载所有商品
|
fetchData() // 直接加载所有商品
|
||||||
@ -1759,6 +1877,24 @@ export default defineComponent({
|
|||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.delivery-type-tag {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 3px 8px;
|
||||||
|
border-radius: 12px;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.delivery-type-tag.immediate {
|
||||||
|
background-color: #1890ff;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.delivery-type-tag.scheduled {
|
||||||
|
background-color: #52c41a;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
.two-column-form {
|
.two-column-form {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user