UI: callback 优化

Author: coding-hui

src/pages/IdentityProvider/Create/CallbackURL.tsx

@@ -1,8 +1,11 @@
 import React from 'react';
+import { Typography } from 'antd';
 import { useIntl } from '@umijs/max';
 import { getRedirectURL } from '@/services/system/oauth';
 import { ProFormDependency, ProFormText } from '@ant-design/pro-components';
 
+const { Paragraph } = Typography;
+
 const INTL = {
   NAME: {
     id: 'idp.form.name',
@@ -24,8 +27,22 @@ export const CallbackURL = () => {
             width="xl"
             label={intl.formatMessage(INTL.AUTH_URL)}
             name={['config', 'redirectURL']}
-            allowClear={false}
+            readonly
+            fieldProps={{ autoComplete: 'off' }}
             initialValue={redirectURL}
+            proFieldProps={{
+              render: () => {
+                return (
+                  <Paragraph copyable={{ text: redirectURL }} style={{ marginBottom: '0' }}>
+                    <span
+                      dangerouslySetInnerHTML={{
+                        __html: `<span>${redirectURL}</span>`,
+                      }}
+                    />
+                  </Paragraph>
+                );
+              },
+            }}
           ></ProFormText>
         );
       }}

src/pages/IdentityProvider/Create/index.tsx

@@ -22,6 +22,9 @@ const INTL = {
   BASIC_INFO: {
     id: 'policy.form.title.basicInfo',
   },
+  LOGIN_CONFIG: {
+    id: 'policy.form.title.loginConfig',
+  },
   NAME: {
     id: 'idp.form.name',
   },
@@ -151,6 +154,11 @@ const CreatePolicy: React.FC = () => {
               return null;
             }}
           </ProFormDependency>
+          <ProForm.Group
+            align="center"
+            title={intl.formatMessage(INTL.LOGIN_CONFIG)}
+            titleStyle={{ marginBottom: '14px' }}
+          ></ProForm.Group>
         </ProForm>
       </ProCard>
     </PageContainer>

src/pages/Policy/locales/zh-CN.ts

@@ -25,6 +25,7 @@ export default {
   'policy.type.allowAll': '全部操作',
   'policy.type.specific': '特定操作',
   'policy.form.title.basicInfo': '基本信息',
+  'policy.form.title.loginConfig': '登录配置',
   'policy.form.title.subjectInfo': '授权主体',
   'policy.form.placeholder.api': '请输入请求接口',
   'policy.form.placeholder.method': '请输入请求方法',