弹窗组件open外置并使用三元运算

This commit is contained in:
unknown
2023-08-03 09:42:13 +08:00
parent 354bd23fc9
commit eb1e82fc12
20 changed files with 1592 additions and 1552 deletions

View File

@@ -96,55 +96,57 @@ export const CoursewareUpdateDialog: React.FC<PropInterface> = ({
return (
<>
<Modal
title="编辑课件"
centered
forceRender
open={open}
width={416}
onOk={() => form.submit()}
onCancel={() => onCancel()}
maskClosable={false}
>
<div className="float-left mt-24">
<Form
form={form}
name="videos-update"
labelCol={{ span: 8 }}
wrapperCol={{ span: 16 }}
initialValues={{ remember: true }}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
autoComplete="off"
>
<Form.Item
label="课件分类"
name="category_id"
rules={[{ required: true, message: "请选择课件分类!" }]}
{open ? (
<Modal
title="编辑课件"
centered
forceRender
open={true}
width={416}
onOk={() => form.submit()}
onCancel={() => onCancel()}
maskClosable={false}
>
<div className="float-left mt-24">
<Form
form={form}
name="videos-update"
labelCol={{ span: 8 }}
wrapperCol={{ span: 16 }}
initialValues={{ remember: true }}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
autoComplete="off"
>
<TreeSelect
showCheckedStrategy={TreeSelect.SHOW_ALL}
allowClear
style={{ width: 200 }}
treeData={categories}
placeholder="课件分类"
treeDefaultExpandAll
/>
</Form.Item>
<Form.Item
label="课件名称"
name="name"
rules={[{ required: true, message: "请输入课件名称!" }]}
>
<Input
allowClear
style={{ width: 200 }}
placeholder="请输入课件名称"
/>
</Form.Item>
</Form>
</div>
</Modal>
<Form.Item
label="课件分类"
name="category_id"
rules={[{ required: true, message: "请选择课件分类!" }]}
>
<TreeSelect
showCheckedStrategy={TreeSelect.SHOW_ALL}
allowClear
style={{ width: 200 }}
treeData={categories}
placeholder="课件分类"
treeDefaultExpandAll
/>
</Form.Item>
<Form.Item
label="课件名称"
name="name"
rules={[{ required: true, message: "请输入课件名称!" }]}
>
<Input
allowClear
style={{ width: 200 }}
placeholder="请输入课件名称"
/>
</Form.Item>
</Form>
</div>
</Modal>
) : null}
</>
);
};

View File

@@ -105,57 +105,59 @@ export const ResourceCategoryCreate: React.FC<PropInterface> = ({
return (
<>
<Modal
title="新建分类"
centered
forceRender
maskClosable={false}
open={open}
width={416}
onOk={() => form.submit()}
onCancel={() => onCancel()}
>
<div className="float-left mt-24">
<Form
form={form}
name="basic"
labelCol={{ span: 8 }}
wrapperCol={{ span: 16 }}
initialValues={{ remember: true }}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
autoComplete="off"
>
<Form.Item
label="所属上级"
name="parent_id"
rules={[{ required: true, message: "请选择所属上级!" }]}
{open ? (
<Modal
title="新建分类"
centered
forceRender
maskClosable={false}
open={true}
width={416}
onOk={() => form.submit()}
onCancel={() => onCancel()}
>
<div className="float-left mt-24">
<Form
form={form}
name="basic"
labelCol={{ span: 8 }}
wrapperCol={{ span: 16 }}
initialValues={{ remember: true }}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
autoComplete="off"
>
<Cascader
style={{ width: 200 }}
allowClear
placeholder="请选择所属上级"
onChange={handleChange}
options={categories}
changeOnSelect
expand-trigger="hover"
displayRender={displayRender}
/>
</Form.Item>
<Form.Item
label="分类名称"
name="name"
rules={[{ required: true, message: "请输入分类名称!" }]}
>
<Input
style={{ width: 200 }}
allowClear
placeholder="请输入分类名称"
/>
</Form.Item>
</Form>
</div>
</Modal>
<Form.Item
label="所属上级"
name="parent_id"
rules={[{ required: true, message: "请选择所属上级!" }]}
>
<Cascader
style={{ width: 200 }}
allowClear
placeholder="请选择所属上级"
onChange={handleChange}
options={categories}
changeOnSelect
expand-trigger="hover"
displayRender={displayRender}
/>
</Form.Item>
<Form.Item
label="分类名称"
name="name"
rules={[{ required: true, message: "请输入分类名称!" }]}
>
<Input
style={{ width: 200 }}
allowClear
placeholder="请输入分类名称"
/>
</Form.Item>
</Form>
</div>
</Modal>
) : null}
</>
);
};

View File

@@ -127,57 +127,59 @@ export const ResourceCategoryUpdate: React.FC<PropInterface> = ({
return (
<>
<Modal
title="编辑分类"
centered
forceRender
open={open}
width={416}
onOk={() => form.submit()}
onCancel={() => onCancel()}
maskClosable={false}
>
<div className="float-left mt-24">
<Form
form={form}
name="basic"
labelCol={{ span: 8 }}
wrapperCol={{ span: 16 }}
initialValues={{ remember: true }}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
autoComplete="off"
>
<Form.Item
label="所属上级"
name="parent_id"
rules={[{ required: true, message: "请选择所属上级!" }]}
{open ? (
<Modal
title="编辑分类"
centered
forceRender
open={true}
width={416}
onOk={() => form.submit()}
onCancel={() => onCancel()}
maskClosable={false}
>
<div className="float-left mt-24">
<Form
form={form}
name="basic"
labelCol={{ span: 8 }}
wrapperCol={{ span: 16 }}
initialValues={{ remember: true }}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
autoComplete="off"
>
<Cascader
style={{ width: 200 }}
allowClear
placeholder="请选择所属上级"
onChange={handleChange}
options={categories}
changeOnSelect
expand-trigger="hover"
displayRender={displayRender}
/>
</Form.Item>
<Form.Item
label="分类名称"
name="name"
rules={[{ required: true, message: "请输入分类名称!" }]}
>
<Input
style={{ width: 200 }}
allowClear
placeholder="请输入分类名称"
/>
</Form.Item>
</Form>
</div>
</Modal>
<Form.Item
label="所属上级"
name="parent_id"
rules={[{ required: true, message: "请选择所属上级!" }]}
>
<Cascader
style={{ width: 200 }}
allowClear
placeholder="请选择所属上级"
onChange={handleChange}
options={categories}
changeOnSelect
expand-trigger="hover"
displayRender={displayRender}
/>
</Form.Item>
<Form.Item
label="分类名称"
name="name"
rules={[{ required: true, message: "请输入分类名称!" }]}
>
<Input
style={{ width: 200 }}
allowClear
placeholder="请输入分类名称"
/>
</Form.Item>
</Form>
</div>
</Modal>
) : null}
</>
);
};

View File

@@ -89,55 +89,57 @@ export const VideosUpdateDialog: React.FC<PropInterface> = ({
return (
<>
<Modal
title="编辑视频"
centered
forceRender
open={open}
width={416}
onOk={() => form.submit()}
onCancel={() => onCancel()}
maskClosable={false}
>
<div className="float-left mt-24">
<Form
form={form}
name="videos-update"
labelCol={{ span: 8 }}
wrapperCol={{ span: 16 }}
initialValues={{ remember: true }}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
autoComplete="off"
>
<Form.Item
label="视频分类"
name="category_id"
rules={[{ required: true, message: "请选择视频分类!" }]}
{open ? (
<Modal
title="编辑视频"
centered
forceRender
open={true}
width={416}
onOk={() => form.submit()}
onCancel={() => onCancel()}
maskClosable={false}
>
<div className="float-left mt-24">
<Form
form={form}
name="videos-update"
labelCol={{ span: 8 }}
wrapperCol={{ span: 16 }}
initialValues={{ remember: true }}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
autoComplete="off"
>
<TreeSelect
showCheckedStrategy={TreeSelect.SHOW_ALL}
allowClear
style={{ width: 200 }}
treeData={categories}
placeholder="视频分类"
treeDefaultExpandAll
/>
</Form.Item>
<Form.Item
label="视频名称"
name="name"
rules={[{ required: true, message: "请输入视频名称!" }]}
>
<Input
allowClear
style={{ width: 200 }}
placeholder="请输入视频名称"
/>
</Form.Item>
</Form>
</div>
</Modal>
<Form.Item
label="视频分类"
name="category_id"
rules={[{ required: true, message: "请选择视频分类!" }]}
>
<TreeSelect
showCheckedStrategy={TreeSelect.SHOW_ALL}
allowClear
style={{ width: 200 }}
treeData={categories}
placeholder="视频分类"
treeDefaultExpandAll
/>
</Form.Item>
<Form.Item
label="视频名称"
name="name"
rules={[{ required: true, message: "请输入视频名称!" }]}
>
<Input
allowClear
style={{ width: 200 }}
placeholder="请输入视频名称"
/>
</Form.Item>
</Form>
</div>
</Modal>
) : null}
</>
);
};