perf:不分人等、不限增加校验并通过后再关闭

main
LiaoYijun 2 months ago
parent f1ab003667
commit 1b302f0f7a

@ -231,7 +231,7 @@ function Management() {
}}
title={t('account:detail')}
open={isAccountModalOpen} onCancel={() => setAccountModalOpen(false)}
destroyOnClose
destroyOnHidden
forceRender
modalRender={(dom) => (
<Form

@ -164,7 +164,7 @@ function RoleList() {
}}
title={t('account:detail')}
open={isRoleModalOpen} onCancel={() => setRoleModalOpen(false)}
destroyOnClose
destroyOnHidden
forceRender
modalRender={(dom) => (
<Form

@ -71,7 +71,7 @@ export const ContractRemarksModal = () => {
open={isRemarksModalOpen}
onOk={() => onRemarksFinish()}
onCancel={() => setRemarksModalOpen(false)}
destroyOnClose
destroyOnHidden
forceRender
>
<Form

@ -1,355 +1,493 @@
import { useState, useEffect } from 'react'
import { Table, Form, Modal, Button, Radio, Input, Flex, Card, InputNumber, Checkbox, DatePicker, Space, App, Tooltip } from 'antd'
import { useTranslation } from 'react-i18next'
import { CloseOutlined, StarTwoTone, PlusOutlined, ExclamationCircleFilled, QuestionCircleOutlined } from '@ant-design/icons'
import { useDatePresets } from '@/hooks/useDatePresets'
import dayjs from 'dayjs'
import { useState, useEffect } from "react";
import {
Table,
Form,
Modal,
Button,
Radio,
Input,
Flex,
Card,
InputNumber,
Checkbox,
DatePicker,
Space,
App,
Tooltip,
} from "antd";
import { useTranslation } from "react-i18next";
import {
CloseOutlined,
StarTwoTone,
PlusOutlined,
ExclamationCircleFilled,
QuestionCircleOutlined,
} from "@ant-design/icons";
import { useDatePresets } from "@/hooks/useDatePresets";
import dayjs from "dayjs";
import useProductsStore from '@/stores/Products/Index'
import PriceCompactInput from '@/views/products/Detail/PriceCompactInput'
import { formatGroupSize } from '@/hooks/useProductsSets'
import useProductsStore from "@/stores/Products/Index";
import PriceCompactInput from "@/views/products/Detail/PriceCompactInput";
import { formatGroupSize } from "@/hooks/useProductsSets";
const { RangePicker } = DatePicker
const { RangePicker } = DatePicker;
const defaultPriceValue = {
'priceInput': {
'numberStart': 1,
'numberEnd': 2,
'audultPrice': 0,
'childrenPrice': 0
}
}
priceInput: {
numberStart: 1,
numberEnd: 2,
audultPrice: 0,
childrenPrice: 0,
},
};
const getYearRange = (year) => [dayjs().year(year).startOf('y'), dayjs().year(year).endOf('y')]
const getYearRange = (year) => [
dayjs().year(year).startOf("y"),
dayjs().year(year).endOf("y"),
];
const generateDefinitionValue = (year) => ({
'useDateList': [{'useDate': getYearRange(year)}],
'unitId': '0',
'currency': 'RMB',
'weekend': [],
'priceList': [defaultPriceValue]
})
useDateList: [{ useDate: getYearRange(year) }],
unitId: "0",
currency: "RMB",
weekend: [],
priceList: [defaultPriceValue],
});
const ProductInfoQuotation = ({ editable, ...props }) => {
const { onChange } = props;
const { onChange } = props
const { t } = useTranslation();
const { t } = useTranslation()
const [quotationList, newEmptyQuotation, appendQuotationList, saveOrUpdateQuotation, deleteQuotation, switchParams] =
useProductsStore((state) => [
state.quotationList, state.newEmptyQuotation, state.appendQuotationList, state.saveOrUpdateQuotation, state.deleteQuotation,
state.switchParams
])
const [
quotationList,
newEmptyQuotation,
appendQuotationList,
saveOrUpdateQuotation,
deleteQuotation,
switchParams,
] = useProductsStore((state) => [
state.quotationList,
state.newEmptyQuotation,
state.appendQuotationList,
state.saveOrUpdateQuotation,
state.deleteQuotation,
state.switchParams,
]);
const batchSetupInitialValues = {
'defList': [
defList: [
//
{
'useDateList': [{'useDate': getYearRange(switchParams.use_year)}],
'unitId': '0',
'currency': 'RMB',
'weekend': [],
'priceList': [
useDateList: [{ useDate: getYearRange(switchParams.use_year) }],
unitId: "0",
currency: "RMB",
weekend: [],
priceList: [
{
'priceInput': {
'numberStart': 1,
'numberEnd': 2,
'audultPrice': 0,
'childrenPrice': 0
}
priceInput: {
numberStart: 1,
numberEnd: 2,
audultPrice: 0,
childrenPrice: 0,
},
},
{
'priceInput': {
'numberStart': 3,
'numberEnd': 4,
'audultPrice': 0,
'childrenPrice': 0
}
priceInput: {
numberStart: 3,
numberEnd: 4,
audultPrice: 0,
childrenPrice: 0,
},
},
{
'priceInput': {
'numberStart': 5,
'numberEnd': 6,
'audultPrice': 0,
'childrenPrice': 0
}
priceInput: {
numberStart: 5,
numberEnd: 6,
audultPrice: 0,
childrenPrice: 0,
},
},
{
'priceInput': {
'numberStart': 7,
'numberEnd': 9,
'audultPrice': 0,
'childrenPrice': 0
}
}
]
priceInput: {
numberStart: 7,
numberEnd: 9,
audultPrice: 0,
childrenPrice: 0,
},
},
],
},
//
{
'useDateList': [
useDateList: [
{
'useDate': [
dayjs().year(switchParams.use_year).subtract(2, 'M').startOf('M'), dayjs().year(switchParams.use_year).endOf('M')
]
}
useDate: [
dayjs().year(switchParams.use_year).subtract(2, "M").startOf("M"),
dayjs().year(switchParams.use_year).endOf("M"),
],
},
],
'unitId': '0',
'currency': 'RMB',
'weekend': [],
'priceList': [
unitId: "0",
currency: "RMB",
weekend: [],
priceList: [
{
'priceInput': {
'numberStart': 1,
'numberEnd': 2,
'audultPrice': 0,
'childrenPrice': 0
}
priceInput: {
numberStart: 1,
numberEnd: 2,
audultPrice: 0,
childrenPrice: 0,
},
},
{
'priceInput': {
'numberStart': 3,
'numberEnd': 4,
'audultPrice': 0,
'childrenPrice': 0
}
priceInput: {
numberStart: 3,
numberEnd: 4,
audultPrice: 0,
childrenPrice: 0,
},
},
{
'priceInput': {
'numberStart': 5,
'numberEnd': 6,
'audultPrice': 0,
'childrenPrice': 0
}
priceInput: {
numberStart: 5,
numberEnd: 6,
audultPrice: 0,
childrenPrice: 0,
},
},
{
'priceInput': {
'numberStart': 7,
'numberEnd': 9,
'audultPrice': 0,
'childrenPrice': 0
}
}
]
}
]
}
priceInput: {
numberStart: 7,
numberEnd: 9,
audultPrice: 0,
childrenPrice: 0,
},
},
],
},
],
};
const [defaultUseDates, setDefaultUseDates] = useState(getYearRange(switchParams.use_year))
const [defaultDefinitionValue, setDefaultDefinitionValue] = useState(generateDefinitionValue(switchParams.use_year))
const [isQuotationModalOpen, setQuotationModalOpen] = useState(false)
const [isBatchSetupModalOpen, setBatchSetupModalOpen] = useState(false)
const [groupSizeUnlimit, setGroupSizeUnlimit] = useState(false)
const [groupMaxUnlimit, setGroupMaxUnlimit] = useState(false)
const { modal, notification } = App.useApp()
const [quotationForm] = Form.useForm()
const [batchSetupForm] = Form.useForm()
const [defaultUseDates, setDefaultUseDates] = useState(
getYearRange(switchParams.use_year)
);
const [defaultDefinitionValue, setDefaultDefinitionValue] = useState(
generateDefinitionValue(switchParams.use_year)
);
const [isQuotationModalOpen, setQuotationModalOpen] = useState(false);
const [isBatchSetupModalOpen, setBatchSetupModalOpen] = useState(false);
const [groupAllSize, setGroupAllSize] = useState(false);
const [groupMaxUnlimit, setGroupMaxUnlimit] = useState(false);
const { modal, notification } = App.useApp();
const [quotationForm] = Form.useForm();
const [batchSetupForm] = Form.useForm();
const datePresets = useDatePresets()
const datePresets = useDatePresets();
useEffect(() => {
setDefaultUseDates(getYearRange(switchParams.use_year))
setDefaultDefinitionValue(generateDefinitionValue(switchParams.use_year))
}, [switchParams])
setDefaultUseDates(getYearRange(switchParams.use_year));
setDefaultDefinitionValue(generateDefinitionValue(switchParams.use_year));
}, [switchParams]);
const triggerChange = (changedValue) => {
onChange?.(
changedValue
)
}
onChange?.(changedValue);
};
const onQuotationSeleted = async (quotation) => {
// start, end RangePicker
quotation.use_dates = [dayjs(quotation.use_dates_start), dayjs(quotation.use_dates_end)]
quotation.weekdayList = quotation.weekdays.split(',')
quotationForm.setFieldsValue(quotation)
setQuotationModalOpen(true)
}
quotation.use_dates = [
dayjs(quotation.use_dates_start),
dayjs(quotation.use_dates_end),
];
quotation.weekdayList = quotation.weekdays.split(",");
quotationForm.setFieldsValue(quotation);
setQuotationModalOpen(true);
};
const onNewQuotation = () => {
const emptyQuotation = newEmptyQuotation(defaultUseDates)
quotationForm.setFieldsValue(emptyQuotation)
setQuotationModalOpen(true)
}
const emptyQuotation = newEmptyQuotation(defaultUseDates);
quotationForm.setFieldsValue(emptyQuotation);
setQuotationModalOpen(true);
};
const onQuotationFinish = (values) => {
const newList = saveOrUpdateQuotation(values)
triggerChange(newList)
setQuotationModalOpen(false)
}
const newList = saveOrUpdateQuotation(values);
triggerChange(newList);
setQuotationModalOpen(false);
};
const onBatchSetupFinish = () => {
const defList = batchSetupForm.getFieldsValue().defList
const newList = appendQuotationList(defList)
triggerChange(newList)
setBatchSetupModalOpen(false)
}
const defList = batchSetupForm.getFieldsValue().defList;
const newList = appendQuotationList(defList);
triggerChange(newList);
setBatchSetupModalOpen(false);
};
const onDeleteQuotation = (quotation) => {
modal.confirm({
title: '请确认',
title: "请确认",
icon: <ExclamationCircleFilled />,
content: '你要删除这条价格吗?',
content: "你要删除这条价格吗?",
onOk() {
deleteQuotation(quotation)
.catch(ex => {
notification.error({
message: 'Notification',
description: ex.message,
placement: 'top',
duration: 4,
})
})
deleteQuotation(quotation).catch((ex) => {
notification.error({
message: "Notification",
description: ex.message,
placement: "top",
duration: 4,
});
});
},
})
}
});
};
const quotationColumns = [
// { title: 'id', dataIndex: 'id', width: 40, className: 'italic text-gray-400' }, // test: 0
// { title: 'WPI_SN', dataIndex: 'WPI_SN', width: 40, className: 'italic text-gray-400' }, // test: 0
{ title: t('products:adultPrice'), dataIndex: 'adult_cost', width: '5rem' },
{ title: t('products:childrenPrice'), dataIndex: 'child_cost', width: '5rem' },
{ title: t('products:currency'), dataIndex: 'currency', width: '4rem' },
{ title: t("products:adultPrice"), dataIndex: "adult_cost", width: "5rem" },
{
title: t("products:childrenPrice"),
dataIndex: "child_cost",
width: "5rem",
},
{ title: t("products:currency"), dataIndex: "currency", width: "4rem" },
{
title: (<>{t('products:unit_name')} <Tooltip placement='top' overlayInnerStyle={{width: '24rem'}} title={t('products:FormTooltip.PriceUnit')}><QuestionCircleOutlined className='text-gray-500' /></Tooltip> </>),
dataIndex: 'unit_id',
width: '6rem',
title: (
<>
{t("products:unit_name")}{" "}
<Tooltip
placement="top"
overlayInnerStyle={{ width: "24rem" }}
title={t("products:FormTooltip.PriceUnit")}
>
<QuestionCircleOutlined className="text-gray-500" />
</Tooltip>{" "}
</>
),
dataIndex: "unit_id",
width: "6rem",
render: (text) => t(`products:PriceUnit.${text}`), // (text === '0' ? '' : text === '1' ? '' : text),
},
{
title: t('products:group_size'),
dataIndex: 'group_size',
width: '6rem',
render: (_, record) => formatGroupSize(record.group_size_min,record.group_size_max),
title: t("products:group_size"),
dataIndex: "group_size",
width: "6rem",
render: (_, record) =>
formatGroupSize(record.group_size_min, record.group_size_max),
},
{
title: (<>{t('products:use_dates')} <Tooltip placement='top' overlayInnerStyle={{width: '24rem'}} title={t('products:FormTooltip.UseDates')}><QuestionCircleOutlined className='text-gray-500' /></Tooltip> </>),
dataIndex: 'use_dates',
title: (
<>
{t("products:use_dates")}{" "}
<Tooltip
placement="top"
overlayInnerStyle={{ width: "24rem" }}
title={t("products:FormTooltip.UseDates")}
>
<QuestionCircleOutlined className="text-gray-500" />
</Tooltip>{" "}
</>
),
dataIndex: "use_dates",
// width: '6rem',
render: (_, record) => `${record.use_dates_start}-${record.use_dates_end}`,
render: (_, record) =>
`${record.use_dates_start}-${record.use_dates_end}`,
},
{ title: t('products:Weekdays'), dataIndex: 'weekdays', width: '4rem' },
{ title: t("products:Weekdays"), dataIndex: "weekdays", width: "4rem" },
{
title: t('products:operation'),
dataIndex: 'operation',
width: '10rem',
title: t("products:operation"),
dataIndex: "operation",
width: "10rem",
render: (_, quotation) => {
// const _rowEditable = [-1,3].includes(quotation.audit_state_id);
const _rowEditable = true; // test: 0
return (
<Space>
<Button type='link' disabled={!_rowEditable} onClick={() => onQuotationSeleted(quotation)}>{t('Edit')}</Button>
<Button type='link' danger disabled={!_rowEditable} onClick={() => onDeleteQuotation(quotation)}>{t('Delete')}</Button>
<Button
type="link"
disabled={!_rowEditable}
onClick={() => onQuotationSeleted(quotation)}
>
{t("Edit")}
</Button>
<Button
type="link"
danger
disabled={!_rowEditable}
onClick={() => onDeleteQuotation(quotation)}
>
{t("Delete")}
</Button>
</Space>
)
);
},
},
]
];
return (
<>
<h2>{t('products:EditComponents.Quotation')}</h2>
<Table size='small'
<h2>{t("products:EditComponents.Quotation")}</h2>
<Table
size="small"
bordered
dataSource={quotationList}
columns={quotationColumns}
pagination={false}
/>
{
editable &&
{editable && (
<Space>
<Button onClick={() => onNewQuotation()} type='primary' ghost style={{ marginTop: 16 }}>
{t('products:addQuotation')}
<Button
onClick={() => onNewQuotation()}
type="primary"
ghost
style={{ marginTop: 16 }}
>
{t("products:addQuotation")}
</Button>
<Button onClick={() => setBatchSetupModalOpen(true)} type='primary' ghost style={{ marginTop: 16, marginLeft: 16 }}>
<Button
onClick={() => setBatchSetupModalOpen(true)}
type="primary"
ghost
style={{ marginTop: 16, marginLeft: 16 }}
>
批量设置
</Button>
</Space>
}
)}
<Modal
centered
title='批量设置价格'
width={'640px'}
title="批量设置价格"
width={"640px"}
open={isBatchSetupModalOpen}
onOk={() => onBatchSetupFinish()}
onCancel={() => setBatchSetupModalOpen(false)}
destroyOnClose
destroyOnHidden
forceRender
>
<Form
labelCol={{ span: 3 }}
wrapperCol={{ span: 20 }}
form={batchSetupForm}
name='batchSetupForm'
autoComplete='off'
name="batchSetupForm"
autoComplete="off"
initialValues={batchSetupInitialValues}
>
<Form.List name='defList'>
<Form.List name="defList">
{(fields, { add, remove }) => (
<Flex gap='middle' vertical>
<Flex gap="middle" vertical>
{fields.map((field, index) => (
<Card
size='small'
title={index == 0 ? '全年' : index == 1 ? '特殊时间段' : '其他'}
size="small"
title={
index == 0 ? "全年" : index == 1 ? "特殊时间段" : "其他"
}
key={field.key}
extra={index == 0 ? <StarTwoTone twoToneColor='#eb2f96' /> : <CloseOutlined onClick={() => {
remove(field.name)
}} />}
extra={
index == 0 ? (
<StarTwoTone twoToneColor="#eb2f96" />
) : (
<CloseOutlined
onClick={() => {
remove(field.name);
}}
/>
)
}
>
<Form.Item label='币种' name={[field.name, 'currency']}>
<Form.Item label="币种" name={[field.name, "currency"]}>
<Radio.Group>
<Radio value='RMB'>RMB</Radio>
<Radio value='USD'>USD</Radio>
<Radio value='THB'>THB</Radio>
<Radio value='JPY'>JPY</Radio>
<Radio value="RMB">RMB</Radio>
<Radio value="USD">USD</Radio>
<Radio value="THB">THB</Radio>
<Radio value="JPY">JPY</Radio>
</Radio.Group>
</Form.Item>
<Form.Item label='类型' name={[field.name, 'unitId']}>
<Form.Item label="类型" name={[field.name, "unitId"]}>
<Radio.Group>
<Radio value='0'>每人</Radio>
<Radio value='1'>每团</Radio>
<Radio value="0">每人</Radio>
<Radio value="1">每团</Radio>
</Radio.Group>
</Form.Item>
<Form.Item label='周末' name={[field.name, 'weekend']}>
<Checkbox.Group
options={['5', '6', '7']}
/>
<Form.Item label="周末" name={[field.name, "weekend"]}>
<Checkbox.Group options={["5", "6", "7"]} />
</Form.Item>
<Form.Item label='有效期'>
<Form.List name={[field.name, 'useDateList']}>
<Form.Item label="有效期">
<Form.List name={[field.name, "useDateList"]}>
{(useDateFieldList, useDateOptList) => (
<Flex gap='middle' vertical>
<Flex gap="middle" vertical>
{useDateFieldList.map((useDateField, index) => (
<Space key={useDateField.key}>
<Form.Item noStyle name={[useDateField.name, 'useDate']}>
<RangePicker style={{ width: '100%' }} allowClear={true} inputReadOnly={true} presets={datePresets} placeholder={['From', 'Thru']} />
<Form.Item
noStyle
name={[useDateField.name, "useDate"]}
>
<RangePicker
style={{ width: "100%" }}
allowClear={true}
inputReadOnly={true}
presets={datePresets}
placeholder={["From", "Thru"]}
/>
</Form.Item>
{index == 0 ? <StarTwoTone twoToneColor='#eb2f96' /> : <CloseOutlined onClick={() => useDateOptList.remove(useDateField.name)} />}
{index == 0 ? (
<StarTwoTone twoToneColor="#eb2f96" />
) : (
<CloseOutlined
onClick={() =>
useDateOptList.remove(useDateField.name)
}
/>
)}
</Space>
))}
<Button type='dashed' icon={<PlusOutlined />} onClick={() => useDateOptList.add({'useDate': defaultUseDates})} block>
<Button
type="dashed"
icon={<PlusOutlined />}
onClick={() =>
useDateOptList.add({ useDate: defaultUseDates })
}
block
>
新增有效期
</Button>
</Flex>
)}
</Form.List>
</Form.Item>
<Form.Item label='人等'>
<Form.List name={[field.name, 'priceList']}>
<Form.Item label="人等">
<Form.List name={[field.name, "priceList"]}>
{(priceFieldList, priceOptList) => (
<Flex gap='middle' vertical>
<Flex gap="middle" vertical>
{priceFieldList.map((priceField, index) => (
<Space key={priceField.key}>
<Form.Item noStyle name={[priceField.name, 'priceInput']}>
<Form.Item
noStyle
name={[priceField.name, "priceInput"]}
>
<PriceCompactInput />
</Form.Item>
{index == 0 ? <StarTwoTone twoToneColor='#eb2f96' /> : <CloseOutlined onClick={() => priceOptList.remove(priceField.name)} />}
{index == 0 ? (
<StarTwoTone twoToneColor="#eb2f96" />
) : (
<CloseOutlined
onClick={() =>
priceOptList.remove(priceField.name)
}
/>
)}
</Space>
))}
<Button type='dashed' icon={<PlusOutlined />} onClick={() => priceOptList.add(defaultPriceValue)} block>
<Button
type="dashed"
icon={<PlusOutlined />}
onClick={() =>
priceOptList.add(defaultPriceValue)
}
block
>
新增人等
</Button>
</Flex>
@ -358,7 +496,12 @@ const ProductInfoQuotation = ({ editable, ...props }) => {
</Form.Item>
</Card>
))}
<Button type='dashed' icon={<PlusOutlined />} onClick={() => add(defaultDefinitionValue)} block>
<Button
type="dashed"
icon={<PlusOutlined />}
onClick={() => add(defaultDefinitionValue)}
block
>
新增设置
</Button>
</Flex>
@ -371,152 +514,180 @@ const ProductInfoQuotation = ({ editable, ...props }) => {
centered
okButtonProps={{
autoFocus: true,
htmlType: 'submit',
htmlType: "submit",
}}
title={t('account:detail')}
open={isQuotationModalOpen} onCancel={() => setQuotationModalOpen(false)}
destroyOnClose
title={t("products:EditComponents.Quotation")}
open={isQuotationModalOpen}
onCancel={() => setQuotationModalOpen(false)}
destroyOnHidden
forceRender
modalRender={(dom) => (
<Form
name='quotationForm'
name="quotationForm"
form={quotationForm}
labelCol={{ span: 4 }}
wrapperCol={{ span: 20 }}
className='max-w-2xl'
className="max-w-2xl"
onFinish={onQuotationFinish}
autoComplete='off'
autoComplete="off"
>
{dom}
</Form>
)}
>
<Form.Item name='id' className='hidden' ><Input /></Form.Item>
<Form.Item name='key' className='hidden' ><Input /></Form.Item>
<Form.Item name='fresh' className='hidden' ><Input /></Form.Item>
<Form.Item name="id" className="hidden">
<Input />
</Form.Item>
<Form.Item name="key" className="hidden">
<Input />
</Form.Item>
<Form.Item name="fresh" className="hidden">
<Input />
</Form.Item>
<Form.Item
label={t('products:adultPrice')}
name='adult_cost'
label={t("products:adultPrice")}
name="adult_cost"
rules={[
{
required: true,
message: t('products:Validation.adultPrice'),
message: t("products:Validation.adultPrice"),
},
]}
>
<InputNumber style={{ width: '100%' }} />
<InputNumber style={{ width: "100%" }} />
</Form.Item>
<Form.Item
label={t('products:childrenPrice')}
name='child_cost'
label={t("products:childrenPrice")}
name="child_cost"
rules={[
{
required: true,
message: t('products:Validation.childrenPrice'),
message: t("products:Validation.childrenPrice"),
},
]}
>
<InputNumber style={{ width: '100%' }} />
<InputNumber style={{ width: "100%" }} />
</Form.Item>
<Form.Item
label={t('products:currency')}
name='currency'
label={t("products:currency")}
name="currency"
rules={[
{
required: true,
message: t('products:Validation.currency'),
message: t("products:Validation.currency"),
},
]}
>
<Radio.Group>
<Radio value='RMB'>RMB</Radio>
<Radio value='USD'>USD</Radio>
<Radio value='THB'>THB</Radio>
<Radio value='JPY'>JPY</Radio>
<Radio value="RMB">RMB</Radio>
<Radio value="USD">USD</Radio>
<Radio value="THB">THB</Radio>
<Radio value="JPY">JPY</Radio>
</Radio.Group>
</Form.Item>
<Form.Item
label={t('products:unit_name')}
name='unit_id'
label={t("products:unit_name")}
name="unit_id"
rules={[
{
required: true,
message: t('products:Validation.unit_name'),
message: t("products:Validation.unit_name"),
},
]}
>
<Radio.Group>
<Radio value='0'>每人</Radio>
<Radio value='1'>每团</Radio>
<Radio value="0">每人</Radio>
<Radio value="1">每团</Radio>
</Radio.Group>
</Form.Item>
<Checkbox onChange={e => {
<Checkbox
onChange={(e) => {
if (e.target.checked) {
quotationForm.setFieldValue('group_size_min', 0)
quotationForm.setFieldValue('group_size_max', 1000)
setGroupSizeUnlimit(true)
quotationForm.setFieldValue("group_size_min", 1);
quotationForm.setFieldValue("group_size_max", 1000);
setGroupAllSize(true);
} else {
quotationForm.setFieldValue('group_size_min', 1)
if (!groupMaxUnlimit) quotationForm.setFieldValue('group_size_max', 999)
setGroupSizeUnlimit(false)
setGroupAllSize(false);
}
}}><span className='font-bold'>不分人等(0~1000)</span></Checkbox>
}}
>
<span className="font-bold">不分人等(1~1000)</span>
</Checkbox>
<Form.Item
label={t('products:group_size')}
name='group_size_min'
label={t("products:group_size")}
name="group_size_min"
rules={[
{
required: true,
message: t('products:Validation.group_size_min'),
message: t("products:Validation.group_size_min"),
},
{
validator: (_, value) => {
if (value > 1000 || value < 1) {
return Promise.reject("人等必须在 1~1000 之间");
}
return Promise.resolve();
},
},
]}
>
<InputNumber disabled={groupSizeUnlimit} min='0' max='999' style={{ width: '100%' }} />
<InputNumber disabled={groupAllSize} style={{ width: "100%" }} />
</Form.Item>
<Checkbox disabled={groupSizeUnlimit} onChange={e => {
<Checkbox
disabled={groupAllSize}
onChange={(e) => {
if (e.target.checked) {
quotationForm.setFieldValue('group_size_max', 1000)
setGroupMaxUnlimit(true)
quotationForm.setFieldValue("group_size_max", 1000);
setGroupMaxUnlimit(true);
} else {
quotationForm.setFieldValue('group_size_max', 999)
setGroupMaxUnlimit(false)
setGroupMaxUnlimit(false);
}
}}><span className='font-bold'>不限(1000)</span></Checkbox>
}}
>
<span className="font-bold">不限(1000)</span>
</Checkbox>
<Form.Item
label={t('products:group_size')}
name='group_size_max'
label={t("products:group_size")}
name="group_size_max"
rules={[
{
required: true,
message: t('products:Validation.group_size_max'),
message: t("products:Validation.group_size_max"),
},
{
validator: (_, value) => {
if (value > 1000 || value < 1) {
return Promise.reject("人等必须在 1~1000 之间");
}
return Promise.resolve();
},
},
]}
>
<InputNumber disabled={groupSizeUnlimit || groupMaxUnlimit} min='0' max='999' style={{ width: '100%' }} />
<InputNumber
disabled={groupAllSize || groupMaxUnlimit}
style={{ width: "100%" }}
/>
</Form.Item>
<Form.Item
label={t('products:use_dates')}
name='use_dates'
label={t("products:use_dates")}
name="use_dates"
rules={[
{
required: true,
message: t('products:Validation.use_dates'),
message: t("products:Validation.use_dates"),
},
]}
>
<RangePicker presets={datePresets} style={{ width: '100%' }} />
<RangePicker presets={datePresets} style={{ width: "100%" }} />
</Form.Item>
<Form.Item
label={t('products:Weekdays')}
name='weekdayList'
>
<Checkbox.Group options={['5', '6', '7']} />
<Form.Item label={t("products:Weekdays")} name="weekdayList">
<Checkbox.Group options={["5", "6", "7"]} />
</Form.Item>
</Modal>
</>
)
}
);
};
export default ProductInfoQuotation
export default ProductInfoQuotation;

Loading…
Cancel
Save