Skip to content

M
merchant-manage-ui
Commit d55b139b authored by 陈万宝's avatar 陈万宝
Browse files
Options

add lint

parent a123c667
Show whitespace changes
Inline Side-by-side
Showing with 263 additions and 264 deletions
src/pages/ServiceGoods/common.less
View file @ d55b139b
......@@ -217,8 +217,8 @@
}
.ant-form-text {
display: flex;
justify-content: center;
align-items: center;
justify-content: center;
}
}
}
......@@ -260,9 +260,9 @@
}
.specsSingularBetween {
display: flex;
align-items: center;
justify-content: flex-start;
width: max-content;
align-items: center;
:global {
.ant-form-item-label {
overflow: inherit;
......@@ -336,8 +336,8 @@
}
.rowWarp {
display: flex;
background: #f8f8f8;
flex-direction: column;
background: #f8f8f8;
}
:global {
......
src/pages/ServiceGoods/components/AddMultiSpecModal.jsx
View file @ d55b139b
import React, { useState, useEffect, forwardRef, useRef, useImperativeHandle } from 'react';
import { Button, Modal, Radio, Space, Form, InputNumber, Switch, Input } from 'antd';
import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
import styles from '../common.less';
import { ENUM_SET_REPERTORY } from '../config';
// import React, { useState, useEffect, forwardRef, useRef, useImperativeHandle } from 'react';
// import { Button, Modal, Radio, Space, Form, InputNumber, Switch, Input } from 'antd';
// import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
// import styles from '../common.less';
// import { ENUM_SET_REPERTORY } from '../config';
// const AddMultiSpecModal = (props, ref) => {
// const [confirmLoading, setConfirmLoading] = useState(false);
// const [modalText, setModalText] = useState('Content of the modal');
// const [multiRepertory, setMultiRepertory] = useState(false);
const AddMultiSpecModal = (props, ref) => {
const [confirmLoading, setConfirmLoading] = useState(false);
const [modalText, setModalText] = useState('Content of the modal');
const [multiRepertory, setMultiRepertory] = useState(false);
// // const {
// // open,
// // setOpen,
// // } = props;
// useImperativeHandle(ref, () => ({
// // changeVal 就是暴露给父组件的方法
// setMultiRepertory: newVal => {
// setMultiRepertory(newVal);
// },
// }));
// const onChange3 = () => {};
// const {
// open,
// setOpen,
// } = props;
useImperativeHandle(ref, () => ({
// changeVal 就是暴露给父组件的方法
setMultiRepertory: newVal => {
setMultiRepertory(newVal);
},
}));
const onChange3 = () => {};
// const handleOk = () => {
// setModalText('The modal will be closed after two seconds');
// setConfirmLoading(true);
// setTimeout(() => {
// setMultiRepertory(false);
// setConfirmLoading(false);
// }, 2000);
// };
const handleOk = () => {
setModalText('The modal will be closed after two seconds');
setConfirmLoading(true);
setTimeout(() => {
setMultiRepertory(false);
setConfirmLoading(false);
}, 2000);
};
// const handleCancel = () => {
// console.log('Clicked cancel button');
// setMultiRepertory(false);
// };
// useEffect(() => {
// console.log('open', multiRepertory);
// }, [multiRepertory]);
// return (
// <>
// {multiRepertory && (
// <Modal
// title="修改库存"
// visible={multiRepertory}
// onOk={handleOk}
// width={1050}
// confirmLoading={confirmLoading}
// onCancel={handleCancel}
// >
// <Form>
// <Form.Item>
// <div>份量(如大小/小份、微辣/特辣等)</div>
// <Form.List name="users">
// {(fields, { add, remove }) => (
// <>
// {fields.map(({ key, name, ...restField }) => (
// <Space
// key={key}
// style={{
// display: 'flex',
// flexDirection: 'column',
// marginBottom: 8,
// }}
// align="baseline"
// >
// <Form.Item className={styles.deal}>
// <Form.Item
// {...restField}
// name={[name, 'first']}
// rules={[
// {
// required: true,
// message: 'Missing first name',
// },
// ]}
// >
// <Input placeholder="名称" />
// </Form.Item>
// <Form.Item
// {...restField}
// name={[name, 'last']}
// rules={[
// {
// required: true,
// message: 'Missing last name',
// },
// ]}
// >
// <Input placeholder="约 份量（数字）" />
// </Form.Item>
// <Form.Item
// {...restField}
// name={[name, 'last']}
// rules={[
// {
// required: true,
// message: 'Missing last name',
// },
// ]}
// >
// <Input placeholder="约 份量（数字）" />
// </Form.Item>
// <Form.Item
// {...restField}
// name={[name, 'last']}
// rules={[
// {
// required: true,
// message: 'Missing last name',
// },
// ]}
// >
// <Input placeholder="销售价（元）" />
// </Form.Item>
// <Form.Item
// {...restField}
// name={[name, 'last']}
// rules={[
// {
// required: true,
// message: 'Missing last name',
// },
// ]}
// >
// <Input placeholder="活动价（元）" />
// </Form.Item>
// <MinusCircleOutlined onClick={() => remove(name)} />
// </Form.Item>
// <Form.Item>
// <Form.Item>
// <div>添加规格(如加料、甜度、辣度等)</div>
// <Form.Item>
// <Form.List name="names">
// {(fields, { add, remove }, { errors }) => (
// <>
// {fields.map((field, index) => (
// <Form.Item
// // {...(index === 0 ? formItemLayout : formItemLayoutWithOutLabel)}
// // label={index === 0 ? 'Passengers' : ''}
// required={false}
// key={field.key}
// >
// <Form.Item
// {...field}
// validateTrigger={['onChange', 'onBlur']}
// className={styles.deal}
const handleCancel = () => {
console.log('Clicked cancel button');
setMultiRepertory(false);
};
useEffect(() => {
console.log('open', multiRepertory);
}, [multiRepertory]);
return (
<>
{multiRepertory && (
<Modal
title="修改库存"
visible={multiRepertory}
onOk={handleOk}
width={1050}
confirmLoading={confirmLoading}
onCancel={handleCancel}
>
<Form>
<Form.Item>
<div>份量(如大小/小份、微辣/特辣等)</div>
<Form.List name="users">
{(fields, { add, remove }) => (
<>
{fields.map(({ key, name, ...restField }) => (
<Space
key={key}
style={{
display: 'flex',
flexDirection: 'column',
marginBottom: 8,
}}
align="baseline"
>
<Form.Item className={styles.deal}>
<Form.Item
{...restField}
name={[name, 'first']}
rules={[
{
required: true,
message: 'Missing first name',
},
]}
>
<Input placeholder="名称" />
</Form.Item>
<Form.Item
{...restField}
name={[name, 'last']}
rules={[
{
required: true,
message: 'Missing last name',
},
]}
>
<Input placeholder="约 份量（数字）" />
</Form.Item>
<Form.Item
{...restField}
name={[name, 'last']}
rules={[
{
required: true,
message: 'Missing last name',
},
]}
>
<Input placeholder="约 份量（数字）" />
</Form.Item>
<Form.Item
{...restField}
name={[name, 'last']}
rules={[
{
required: true,
message: 'Missing last name',
},
]}
>
<Input placeholder="销售价（元）" />
</Form.Item>
<Form.Item
{...restField}
name={[name, 'last']}
rules={[
{
required: true,
message: 'Missing last name',
},
]}
>
<Input placeholder="活动价（元）" />
</Form.Item>
<MinusCircleOutlined onClick={() => remove(name)} />
</Form.Item>
<Form.Item>
<Form.Item>
<div>添加规格(如加料、甜度、辣度等)</div>
<Form.Item>
<Form.List name="names">
{(fields, { add, remove }, { errors }) => (
<>
{fields.map((field, index) => (
<Form.Item
// {...(index === 0 ? formItemLayout : formItemLayoutWithOutLabel)}
// label={index === 0 ? 'Passengers' : ''}
required={false}
key={field.key}
>
<Form.Item
{...field}
validateTrigger={['onChange', 'onBlur']}
className={styles.deal}
// rules={[
// {
// required: true,
// whitespace: true,
// message:
// "Please input passenger's name or delete this field.",
// },
// ]}
// >
// <Input
// placeholder="规格名称"
// className={styles.nameWidth}
// />
// {fields.length > 1 ? (
// <MinusCircleOutlined
// className="dynamic-delete-button"
// onClick={() => remove(field.name)}
// />
// ) : null}
// </Form.Item>
// <Form.Item>
// <Form.List name="sights">
// {(fields, { add, remove }) => (
// <>
// {fields.map(field => (
// <Space key={field.key} align="baseline">
// <Form.Item
// noStyle
// shouldUpdate={(prevValues, curValues) =>
// prevValues.area !== curValues.area ||
// prevValues.sights !== curValues.sights
// }
// >
// {() => (
// <Form.Item
// {...field}
// // label="Sight"
// name={[field.name, 'sight']}
// rules={[
// {
// required: true,
// message: 'Missing sight',
// },
// ]}
// >
// <Input style={{ width: '200px' }} placeholder="加价名称" />
// </Form.Item>
// )}
// </Form.Item>
// <Form.Item
// {...field}
// // label="Price"
// // name={[field.name, 'price']}
// rules={[
// {
// required: true,
// message: 'Missing price',
// },
// ]}
// >
// <InputNumber style={{ width: '200px' }} placeholder="加价名称金额（元）" />
// </Form.Item>
rules={[
{
required: true,
whitespace: true,
message:
"Please input passenger's name or delete this field.",
},
]}
>
<Input
placeholder="规格名称"
className={styles.nameWidth}
/>
{fields.length > 1 ? (
<MinusCircleOutlined
className="dynamic-delete-button"
onClick={() => remove(field.name)}
/>
) : null}
</Form.Item>
<Form.Item>
<Form.List name="sights">
{(fields, { add, remove }) => (
<>
{fields.map(field => (
<Space key={field.key} align="baseline">
<Form.Item
noStyle
shouldUpdate={(prevValues, curValues) =>
prevValues.area !== curValues.area ||
prevValues.sights !== curValues.sights
}
>
{() => (
<Form.Item
{...field}
// label="Sight"
name={[field.name, 'sight']}
rules={[
{
required: true,
message: 'Missing sight',
},
]}
>
<Input style={{ width: '200px' }} placeholder="加价名称" />
</Form.Item>
)}
</Form.Item>
<Form.Item
{...field}
// label="Price"
// name={[field.name, 'price']}
rules={[
{
required: true,
message: 'Missing price',
},
]}
>
<InputNumber style={{ width: '200px' }} placeholder="加价名称金额（元）" />
</Form.Item>
// <MinusCircleOutlined
// onClick={() => remove(field.name)}
// />
// </Space>
// ))}
<MinusCircleOutlined
onClick={() => remove(field.name)}
/>
</Space>
))}
// <Form.Item>
// <Button
// type="dashed"
// onClick={() => add()}
// block
// icon={<PlusOutlined />}
// >
// 新增加价
// </Button>
// </Form.Item>
// </>
// )}
// </Form.List>
// </Form.Item>
// </Form.Item>
// ))}
// <Form.Item>
// <Button
// type="dashed"
// onClick={() => add()}
// style={{ width: '60%' }}
// icon={<PlusOutlined />}
// >
// 新增规格
// </Button>
// </Form.Item>
// </>
// )}
// </Form.List>
// </Form.Item>
// </Form.Item>
// </Form.Item>
// </Space>
// ))}
// <Form.Item>
// <Button type="dashed" onClick={() => add()} block icon={<PlusOutlined />}>
// 新增份量
// </Button>
// </Form.Item>
// </>
// )}
// </Form.List>
// </Form.Item>
// </Form>
// </Modal>
// )}
// </>
// );
// };
<Form.Item>
<Button
type="dashed"
onClick={() => add()}
block
icon={<PlusOutlined />}
>
新增加价
</Button>
</Form.Item>
</>
)}
</Form.List>
</Form.Item>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => add()}
style={{ width: '60%' }}
icon={<PlusOutlined />}
>
新增规格
</Button>
</Form.Item>
</>
)}
</Form.List>
</Form.Item>
</Form.Item>
</Form.Item>
</Space>
))}
<Form.Item>
<Button type="dashed" onClick={() => add()} block icon={<PlusOutlined />}>
新增份量
</Button>
</Form.Item>
</>
)}
</Form.List>
</Form.Item>
</Form>
</Modal>
)}
</>
);
};
export default forwardRef(AddMultiSpecModal);
// export default forwardRef(AddMultiSpecModal);
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment