mirror of
https://github.com/PlayEdu/frontend.git
synced 2025-06-07 05:46:11 +08:00
弹窗组件open外置并使用三元运算
This commit is contained in:
parent
9425cae0da
commit
565df9891d
@ -40,63 +40,65 @@ export const ChangePasswordModel: 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="change-password"
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 16 }}
|
||||
initialValues={{ remember: true }}
|
||||
onFinish={onFinish}
|
||||
onFinishFailed={onFinishFailed}
|
||||
autoComplete="off"
|
||||
>
|
||||
<Form.Item
|
||||
label="请输入原密码"
|
||||
name="old_password"
|
||||
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="change-password"
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 16 }}
|
||||
initialValues={{ remember: true }}
|
||||
onFinish={onFinish}
|
||||
onFinishFailed={onFinishFailed}
|
||||
autoComplete="off"
|
||||
>
|
||||
<Input.Password
|
||||
style={{ width: 200 }}
|
||||
autoComplete="off"
|
||||
placeholder="请输入原密码"
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="输入新密码"
|
||||
name="new_password"
|
||||
rules={[{ required: true, message: "请输入新密码!" }]}
|
||||
>
|
||||
<Input.Password
|
||||
style={{ width: 200 }}
|
||||
autoComplete="off"
|
||||
placeholder="请输入新密码"
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="再次输入新密码"
|
||||
name="again_new_password"
|
||||
rules={[{ required: true, message: "再次输入新密码!" }]}
|
||||
>
|
||||
<Input.Password
|
||||
style={{ width: 200 }}
|
||||
autoComplete="off"
|
||||
placeholder="再次输入新密码"
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</div>
|
||||
</Modal>
|
||||
<Form.Item
|
||||
label="请输入原密码"
|
||||
name="old_password"
|
||||
rules={[{ required: true, message: "请输入原密码!" }]}
|
||||
>
|
||||
<Input.Password
|
||||
style={{ width: 200 }}
|
||||
autoComplete="off"
|
||||
placeholder="请输入原密码"
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="输入新密码"
|
||||
name="new_password"
|
||||
rules={[{ required: true, message: "请输入新密码!" }]}
|
||||
>
|
||||
<Input.Password
|
||||
style={{ width: 200 }}
|
||||
autoComplete="off"
|
||||
placeholder="请输入新密码"
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="再次输入新密码"
|
||||
name="again_new_password"
|
||||
rules={[{ required: true, message: "再次输入新密码!" }]}
|
||||
>
|
||||
<Input.Password
|
||||
style={{ width: 200 }}
|
||||
autoComplete="off"
|
||||
placeholder="再次输入新密码"
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</div>
|
||||
</Modal>
|
||||
) : null}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
@ -75,60 +75,62 @@ export const UserInfoModel: React.FC<PropInterface> = ({ open, onCancel }) => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Modal
|
||||
title="个人信息"
|
||||
centered
|
||||
forceRender
|
||||
open={open}
|
||||
width={416}
|
||||
onCancel={() => onCancel()}
|
||||
maskClosable={false}
|
||||
footer={null}
|
||||
>
|
||||
<div className="mt-24">
|
||||
<Form
|
||||
form={form}
|
||||
name="user-info"
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 16 }}
|
||||
initialValues={{ remember: true }}
|
||||
autoComplete="off"
|
||||
>
|
||||
<Form.Item
|
||||
label="学员头像"
|
||||
labelCol={{ style: { marginTop: 15, marginLeft: 52 } }}
|
||||
{open ? (
|
||||
<Modal
|
||||
title="个人信息"
|
||||
centered
|
||||
forceRender
|
||||
open={true}
|
||||
width={416}
|
||||
onCancel={() => onCancel()}
|
||||
maskClosable={false}
|
||||
footer={null}
|
||||
>
|
||||
<div className="mt-24">
|
||||
<Form
|
||||
form={form}
|
||||
name="user-info"
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 16 }}
|
||||
initialValues={{ remember: true }}
|
||||
autoComplete="off"
|
||||
>
|
||||
<div className="d-flex">
|
||||
{avatar && (
|
||||
<Image
|
||||
loading="lazy"
|
||||
width={60}
|
||||
height={60}
|
||||
style={{ borderRadius: "50%" }}
|
||||
src={avatar}
|
||||
preview={false}
|
||||
/>
|
||||
)}
|
||||
<div className="d-flex ml-16">
|
||||
<Upload {...props} showUploadList={false}>
|
||||
<Button>更换头像</Button>
|
||||
</Upload>
|
||||
<Form.Item
|
||||
label="学员头像"
|
||||
labelCol={{ style: { marginTop: 15, marginLeft: 52 } }}
|
||||
>
|
||||
<div className="d-flex">
|
||||
{avatar && (
|
||||
<Image
|
||||
loading="lazy"
|
||||
width={60}
|
||||
height={60}
|
||||
style={{ borderRadius: "50%" }}
|
||||
src={avatar}
|
||||
preview={false}
|
||||
/>
|
||||
)}
|
||||
<div className="d-flex ml-16">
|
||||
<Upload {...props} showUploadList={false}>
|
||||
<Button>更换头像</Button>
|
||||
</Upload>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Form.Item>
|
||||
{name && (
|
||||
<Form.Item label="学员姓名">
|
||||
<div>{name}</div>
|
||||
</Form.Item>
|
||||
)}
|
||||
{idCard && (
|
||||
<Form.Item label="身份证号" style={{ marginBottom: 16 }}>
|
||||
<div>{idCard}</div>
|
||||
</Form.Item>
|
||||
)}
|
||||
</Form>
|
||||
</div>
|
||||
</Modal>
|
||||
{name && (
|
||||
<Form.Item label="学员姓名">
|
||||
<div>{name}</div>
|
||||
</Form.Item>
|
||||
)}
|
||||
{idCard && (
|
||||
<Form.Item label="身份证号" style={{ marginBottom: 16 }}>
|
||||
<div>{idCard}</div>
|
||||
</Form.Item>
|
||||
)}
|
||||
</Form>
|
||||
</div>
|
||||
</Modal>
|
||||
) : null}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
Loading…
x
Reference in New Issue
Block a user