FatttSnake/oxygen-ui
1
0
Fork 0
Code Pull Requests Activity

Fix modal bug. Optimize Turnstile load. #39

Merged
FatttSnake merged 2 commits from FatttSnake into dev 2024-03-01 17:52:36 +08:00
Conversation 0 Commits 2 Files Changed 14 +178 -85
8 changed files with 178 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 3b11b262b9 - Show all commits

24
src/pages/Sign/SignIn.tsx
View File

@@ -105,24 +105,30 @@ const SignIn = () => {
twoFactorForm.resetFields()
void modal.confirm({
title: '双因素验证',
getContainer: false,
centered: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<>
<AntdForm form={twoFactorForm}>
<AntdForm
form={twoFactorForm}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('twoFactorCode').focus()
}, 50)
}}
>
<AntdForm.Item
name={'twoFactorCode'}
label={'验证码'}
style={{ marginTop: 10 }}
rules={[{ required: true, len: 6 }]}
>
<AntdInput
showCount
maxLength={6}
ref={(input) => {
input?.focus()
}}
/>
<AntdInput showCount maxLength={6} />
</AntdForm.Item>
</AntdForm>
</>

22
src/pages/System/Settings/Mail.tsx
View File

@@ -17,23 +17,31 @@ const Mail = () => {
const handleOnTest = () => {
void modal.confirm({
title: '发送测试邮件',
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<>
<AntdForm form={mailSendForm}>
<AntdForm
form={mailSendForm}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('to').focus()
}, 50)
}}
>
<AntdForm.Item
name={'to'}
label={'接收人'}
style={{ marginTop: 10 }}
rules={[{ required: true, type: 'email' }]}
>
<AntdInput
ref={(input) => {
input?.focus()
}}
/>
<AntdInput />
</AntdForm.Item>
</AntdForm>
<AntdTag style={{ whiteSpace: 'normal' }}>

50
src/pages/System/Tools/Base.tsx
View File

@@ -234,6 +234,12 @@ const Base = () => {
title: '编译',
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<>
<AntdForm form={compileForm}>
@@ -538,11 +544,23 @@ const Base = () => {
const handleOnAddFile = () => {
void modal.confirm({
title: '新建文件',
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<AntdForm form={addFileForm}>
<AntdForm
form={addFileForm}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('fileName').focus()
}, 50)
}}
>
<AntdForm.Item
name={'fileName'}
label={'文件名'}
@@ -568,11 +586,7 @@ const Base = () => {
})
]}
>
<AntdInput
ref={(input) => {
input?.focus()
}}
/>
<AntdInput />
</AntdForm.Item>
</AntdForm>
),
@@ -721,11 +735,23 @@ const Base = () => {
renameFileForm.setFieldValue('fileName', fileName)
void modal.confirm({
title: '重命名文件',
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<AntdForm form={renameFileForm}>
<AntdForm
form={renameFileForm}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('fileName').focus()
}, 50)
}}
>
<AntdForm.Item
name={'fileName'}
label={'新文件名'}
@@ -754,11 +780,7 @@ const Base = () => {
})
]}
>
<AntdInput
ref={(input) => {
input?.focus()
}}
/>
<AntdInput />
</AntdForm.Item>
</AntdForm>
),

44
src/pages/System/Tools/Template.tsx
View File

@@ -399,11 +399,23 @@ const Template = () => {
const handleOnAddFile = () => {
void modal.confirm({
title: '新建文件',
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<AntdForm form={addFileForm}>
<AntdForm
form={addFileForm}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('fileName').focus()
}, 50)
}}
>
<AntdForm.Item
name={'fileName'}
label={'文件名'}
@@ -429,11 +441,7 @@ const Template = () => {
})
]}
>
<AntdInput
ref={(input) => {
input?.focus()
}}
/>
<AntdInput />
</AntdForm.Item>
</AntdForm>
),
@@ -585,11 +593,23 @@ const Template = () => {
renameFileForm.setFieldValue('fileName', fileName)
void modal.confirm({
title: '重命名文件',
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<AntdForm form={renameFileForm}>
<AntdForm
form={renameFileForm}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('fileName').focus()
}, 50)
}}
>
<AntdForm.Item
name={'fileName'}
label={'新文件名'}
@@ -618,11 +638,7 @@ const Template = () => {
})
]}
>
<AntdInput
ref={(input) => {
input?.focus()
}}
/>
<AntdInput />
</AntdForm.Item>
</AntdForm>
),

6
src/pages/System/Tools/index.tsx
View File

@@ -197,6 +197,12 @@ const Tools = () => {
title: '审核',
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<AntdForm form={form}>
<AntdForm.Item

18
src/pages/System/User.tsx
View File

@@ -336,15 +336,25 @@ const User = () => {
修改用户 {value.username} 的密码
</>
),
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<AntdForm
form={changePasswordForm}
style={{ marginTop: 20 }}
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('password').focus()
}, 50)
}}
>
<AntdForm.Item name={'id'} label={'ID'} labelAlign={'right'}>
<AntdInput disabled />
@@ -358,11 +368,7 @@ const User = () => {
}
]}
>
<AntdInput.Password
ref={(input) => {
input?.focus()
}}
/>
<AntdInput.Password />
</AntdForm.Item>
<AntdForm.Item
name={'passwordConfirm'}

25
src/pages/Tools/index.tsx
View File

@@ -262,12 +262,24 @@ const Tools = () => {
const handleOnUpgradeTool = (tool: ToolVo) => {
void modal.confirm({
title: '更新工具',
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<>
<AntdForm form={upgradeForm}>
<AntdForm
form={upgradeForm}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('toolId').focus()
}, 50)
}}
>
<AntdForm.Item
initialValue={tool.toolId}
name={'toolId'}
@@ -287,14 +299,7 @@ const Tools = () => {
}
]}
>
<AntdInput
maxLength={10}
showCount
placeholder={'请输入版本'}
ref={(input) => {
input?.focus()
}}
/>
<AntdInput maxLength={10} showCount placeholder={'请输入版本'} />
</AntdForm.Item>
</AntdForm>
</>

74
src/pages/User/index.tsx
View File

@@ -99,15 +99,25 @@ const User = () => {
修改密码
</>
),
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<AntdForm
form={changePasswordForm}
style={{ marginTop: 20 }}
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('originalPassword').focus()
}, 50)
}}
>
<AntdForm.Item
name={'originalPassword'}
@@ -115,12 +125,7 @@ const User = () => {
labelAlign={'right'}
rules={[{ required: true, message: '请输入原密码' }]}
>
<AntdInput.Password
placeholder={'请输入原密码'}
ref={(input) => {
input?.focus()
}}
/>
<AntdInput.Password placeholder={'请输入原密码'} />
</AntdForm.Item>
<AntdForm.Item
name={'newPassword'}
@@ -217,29 +222,42 @@ const User = () => {
title: '双因素',
centered: true,
maskClosable: true,
focusTriggerAfterClose: false,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: '确定解除双因素？',
onOk: () => {
void modal.confirm({
title: '解除双因素',
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<>
<AntdForm form={twoFactorForm}>
<AntdForm
form={twoFactorForm}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('twoFactorCode').focus()
}, 50)
}}
>
<AntdForm.Item
name={'twoFactorCode'}
label={'验证码'}
style={{ marginTop: 10 }}
rules={[{ required: true, len: 6 }]}
>
<AntdInput
showCount
maxLength={6}
ref={(input) => {
input?.focus()
}}
/>
<AntdInput showCount maxLength={6} />
</AntdForm.Item>
</AntdForm>
</>
@@ -289,9 +307,14 @@ const User = () => {
if (response.success) {
void modal.confirm({
title: '绑定双因素',
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<>
<AntdImage
@@ -299,20 +322,21 @@ const User = () => {
alt={'Two-factor'}
preview={false}
/>
<AntdForm form={twoFactorForm}>
<AntdForm
form={twoFactorForm}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('twoFactorCode').focus()
}, 50)
}}
>
<AntdForm.Item
name={'twoFactorCode'}
label={'验证码'}
style={{ marginTop: 10, marginRight: 30 }}
rules={[{ required: true, len: 6 }]}
>
<AntdInput
showCount
maxLength={6}
ref={(input) => {
input?.focus()
}}
/>
<AntdInput showCount maxLength={6} />
</AntdForm.Item>
</AntdForm>
</>