feat: vr图比例调整

This commit is contained in:
mozzie 2023-03-08 18:00:09 +08:00
parent ddc823cf9e
commit 3f9ad4b2df

View File

@ -1,10 +1,71 @@
import { MinusCircleOutlined, PlusOutlined } from "@ant-design/icons";
import { Button, Col, Form, Input, Row, Space, Typography } from "antd";
const { Text } = Typography;
interface IProps { interface IProps {
onChange?: Function; onChange?: Function;
styles?: React.CSSProperties; styles?: React.CSSProperties;
} }
const Chatpter = (props: IProps) => { const Chatpter = (props: IProps) => {
return <div style={{ ...props.styles }}>123</div>; const [form] = Form.useForm();
const onBlur = () => {
console.log(form.getFieldsValue().chapter);
};
return (
<div style={{ ...props.styles }}>
<Form form={form} style={{ maxWidth: 600 }}>
<Form.List name="chapter">
{(fields, { add, remove }, { errors }) => (
<>
{fields.map((field, index) => (
<Form.Item required={false} key={field.key}>
<Form.Item
{...field}
validateTrigger={["onChange", "onBlur"]}
rules={[{ required: true, message: "请输入章节名称" }]}
noStyle
>
<Input
placeholder="请输入章节名称"
onBlur={onBlur}
style={{ width: "60%" }}
/>
<Text>{JSON.stringify(field)}</Text>
</Form.Item>
{fields.length > 1 ? (
<MinusCircleOutlined onClick={() => remove(field.name)} />
) : null}
</Form.Item>
))}
<Form.Item>
<Space>
<Button
type="dashed"
onClick={() => add("The head item", 0)}
block
icon={<PlusOutlined />}
>
1
</Button>
<Button
type="primary"
onClick={() => add("The head item", 0)}
block
icon={<PlusOutlined />}
>
2
</Button>
</Space>
</Form.Item>
</>
)}
</Form.List>
</Form>
</div>
);
}; };
export default Chatpter; export default Chatpter;