Haina
/
GHHub
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

批量添加价格可以同时设置人等

Browse Source
perf/export-docx
Jimmy Liow 11 months ago
parent 606c54a4f9
commit f68370fa72
4 changed files with 257 additions and 55 deletions
Show Stats Download Patch File Download Diff File

1
prerelease.bat
Unescape Escape View File

@ -0,0 +1 @@
npm version prerelease

1
src/views/account/Management.jsx
Unescape Escape View File

@ -356,7 +356,6 @@ function Management() {
showSizeChanger: true,
showTotal: (total) => { return t('Total') + `：${total}` }
}}
onChange={(pagination) => { onSearchClick(pagination.current) }}
columns={accountListColumns} dataSource={accountList}
/>
</Col>

3
src/views/products/Detail.jsx
Unescape Escape View File

@ -380,7 +380,7 @@ function Detail() {
};
fetchData();
}, [productsTypes, travel_agency_id, use_year, audit_state, agencyProducts]);
const flattenTreeData = (tree) => {
let flatList = [];
const flatten = (nodes) => {
@ -1169,7 +1169,6 @@ function Detail() {
}
{
!isCanEditable &&
<Button onClick={handleBatchImport} type="primary" style={{ marginTop: 16, marginLeft: 16 }}>批量添加</Button>
}
</Form.Item>

307
src/views/products/Detail/BatchImportPrice.jsx
Unescape Escape View File

@ -1,13 +1,14 @@
import React, { useState } from 'react';
import { Button, Card, Checkbox, Col, DatePicker, Form, Input, Row, Select, Space, Tag, Table, InputNumber } from 'antd';
import { useEffect, useState } from 'react';
import { Button, Card, Checkbox, Col, DatePicker, Typography, Form, Input, Row, Select, Space, Tag, Table, InputNumber } from 'antd';
import { CloseOutlined } from '@ant-design/icons';
import dayjs from 'dayjs';
import { useDatePresets } from '@/hooks/useDatePresets';
const { Option } = Select;
const { RangePicker } = DatePicker;
const BatchImportPrice = ({ onBatchImportData }) => {
const [form] = Form.useForm();
const [peopleForm] = Form.useForm();
const [tags, setTags] = useState([]);
const [minPeople, setMinPeople] = useState('');
const [maxPeople, setMaxPeople] = useState('');
@ -16,6 +17,35 @@ const BatchImportPrice = ({ onBatchImportData }) => {
const [sendData, setSendData] = useState(null);
const presets = useDatePresets();
useEffect(() => {
peopleForm.setFieldValue({
"items": [
{
"weekend": [
"5",
"6",
"7"
],
"peopleList": [
{
"peoplePrice": "22",
"numberStart": "1",
"numberEnd": "2",
"audultPrice": "23",
"childrenPrice": "44"
},
{
"numberStart": "3",
"numberEnd": "5",
"audultPrice": "24",
"childrenPrice": "12"
}
]
}
]
})
})
const handleTagClose = (removedTag) => {
setTags(tags.filter(tag => tag !== removedTag));
};
@ -237,63 +267,228 @@ const BatchImportPrice = ({ onBatchImportData }) => {
...generatePeopleColumns(),
];
const PriceInput = (props) => {
const { id, value = {}, onChange } = props
const [numberStart, setNumberStart] = useState(0)
const [numberEnd, setNumberEnd] = useState(0)
const [audultPrice, setAudultPrice] = useState(0)
const [childrenPrice, setChildrenPrice] = useState(0)
const triggerChange = (changedValue) => {
onChange?.({
numberStart,
numberEnd,
audultPrice,
childrenPrice,
...value,
...changedValue,
})
}
const onNumberStartChange = (e) => {
const newNumber = parseInt(e.target.value || '0', 10)
if (Number.isNaN(numberStart)) {
return
}
if (!('numberStart' in value)) {
setNumberStart(newNumber);
}
triggerChange({
numberStart: newNumber,
})
}
const onNumberEndChange = (e) => {
const newNumber = parseInt(e.target.value || '0', 10)
if (Number.isNaN(numberEnd)) {
return
}
if (!('numberEnd' in value)) {
setNumberEnd(newNumber)
}
triggerChange({
numberEnd: newNumber,
});
};
const onAudultPriceChange = (e) => {
const newNumber = parseInt(e.target.value || '0', 10)
if (Number.isNaN(audultPrice)) {
return
}
if (!('audultPrice' in value)) {
setAudultPrice(newNumber)
}
triggerChange({
audultPrice: newNumber,
})
}
const onChildrenPriceChange = (e) => {
const newNumber = parseInt(e.target.value || '0', 10)
if (Number.isNaN(childrenPrice)) {
return
}
if (!('childrenPrice' in value)) {
setChildrenPrice(newNumber)
}
triggerChange({
childrenPrice: newNumber,
})
};
return (
<Space.Compact id={id}>
<Input
type="text"
value={value.numberStart || numberStart}
onChange={onNumberStartChange}
style={{
width: '20%',
}}
/>
<Input
type="text"
value={value.numberEnd || numberEnd}
onChange={onNumberEndChange}
style={{
width: '40%',
}}
addonBefore="~"
/>
<Input
type="text"
value={value.audultPrice || audultPrice}
onChange={onAudultPriceChange}
style={{
width: '70%',
}}
addonBefore="成人价"
/>
<Input
type="text"
value={value.childrenPrice || childrenPrice}
onChange={onChildrenPriceChange}
style={{
width: '70%',
}}
addonBefore="儿童价"
/>
</Space.Compact>
)
}
return (
<div>
<Card
size="small"
title="选择人等、周末"
style={{ marginBottom: 16 }}
<Row gutter={16}>
<Col span={10}>
<Form
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
form={peopleForm}
name="peopleForm"
autoComplete="off"
initialValues={{
"items": [
{
"weekend": [
"5",
"6",
"7"
],
"prieceList": [
{
"priceInput": {
"numberStart": 1,
"numberEnd": 2,
"audultPrice": 0,
"childrenPrice": 0
}
},
{
"priceInput": {
"numberStart": 3,
"numberEnd": 4,
"audultPrice": 0,
"childrenPrice": 0
}
},
{
"priceInput": {
"numberStart": 5,
"numberEnd": 6,
"audultPrice": 0,
"childrenPrice": 0
}
},
{
"priceInput": {
"numberStart": 7,
"numberEnd": 9,
"audultPrice": 0,
"childrenPrice": 0
}
}
]
}
]
}}
>
<Row>
<Col>
<Input.Group compact style={{ marginTop: 10 }}>
<Input
style={{ width: 100, textAlign: 'center' }}
placeholder="Start"
value={minPeople}
onChange={(e) => setMinPeople(e.target.value)}
/>
<Input
style={{ width: 30, borderLeft: 0, pointerEvents: 'none', backgroundColor: '#fff' }}
placeholder="~"
disabled
/>
<Input
style={{ width: 100, textAlign: 'center', borderLeft: 0 }}
placeholder="End"
value={maxPeople}
onChange={(e) => setMaxPeople(e.target.value)}
/>
</Input.Group>
</Col>
<Col>
<Button size="small" type="primary" onClick={handleInputConfirm} style={{ marginLeft: 12, marginTop: 12 }}>
添加人等
</Button>
</Col>
</Row>
<div style={{ marginTop: 16 }}>
{tags.map((tag) => (
<Tag key={tag} closable onClose={() => handleTagClose(tag)}>
{tag}
</Tag>
))}
</div>
<Form.List name="items" >
{(fields, { add, remove }) => (
<div style={{ display: 'flex', rowGap: 16, flexDirection: 'column' }}>
{fields.map((field, index) => (
<Card
size="small"
title={`周末、人等`}
key={field.key}
>
<Form.Item label="周末" name={[field.name, 'weekend']}>
<Checkbox.Group
options={['5', '6', '7']}
onChange={handleCheckboxChange}
/>
</Form.Item>
<Form.Item label="价格">
<Form.List name={[field.name, 'prieceList']}>
{(priceFields, priceOpt) => (
<>
{priceFields.map((priceField) => (
<Space key={priceField.key}>
<Form.Item noStyle name={[priceField.name, 'priceInput']}>
<PriceInput />
</Form.Item>
<Checkbox.Group
style={{ marginTop: 16 }}
options={['5', '6', '7']}
onChange={handleCheckboxChange}
/>
</Card>
<CloseOutlined onClick={() => priceOpt.remove(priceField.name)} />
</Space>
))}
<Button type="dashed" onClick={() => priceOpt.add()} block>
+ 新增人等
</Button>
</>
)}
</Form.List>
</Form.Item>
</Card>
))}
</div>
)}
</Form.List>
<Form.Item noStyle shouldUpdate>
{() => (
<Typography>
<pre>{JSON.stringify(peopleForm.getFieldsValue(), null, 2)}</pre>
</Typography>
)}
</Form.Item>
</Form>
</Col>
<Col span={14}>
<Form
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
form={form}
name="dynamic_form_complex"
style={{ maxWidth: 600 }}
autoComplete="off"
initialValues={{ items: [{}] }}
>
@ -348,6 +543,13 @@ const BatchImportPrice = ({ onBatchImportData }) => {
</div>
)}
</Form.List>
<Form.Item noStyle shouldUpdate>
{() => (
<Typography>
<pre>{JSON.stringify(form.getFieldsValue(), null, 2)}</pre>
</Typography>
)}
</Form.Item>
</Form>
<Button type="primary" onClick={generateTableData} style={{ marginTop: 20 }}>
@ -364,7 +566,8 @@ const BatchImportPrice = ({ onBatchImportData }) => {
/>
</div>
)}
</div>
</Col>
</Row>
);
};

Write Preview
Loading…
Cancel
Save