122 lines
6.0 KiB
JavaScript
122 lines
6.0 KiB
JavaScript
import React from 'react';
|
|
import { Form, Input, Switch, Select } from 'antd';
|
|
import Styles from './styles.module.less';
|
|
const Upsert = (props) => {
|
|
const { item } = props.data;
|
|
const { t, update } = props.methods;
|
|
if (item === undefined) {
|
|
return <div>{t('noData')}</div>;
|
|
}
|
|
return (<div className={Styles.id}>
|
|
<Form layout="vertical" autoComplete="off">
|
|
<Form.Item label={t('name')} rules={[{ required: true, message: t('nameRequired') }]}>
|
|
<Input placeholder={t('namePlaceholder')} value={item.name || ""} onChange={(v) => {
|
|
update({ name: v.target.value });
|
|
}}/>
|
|
</Form.Item>
|
|
|
|
<Form.Item label={t('type')} rules={[{ required: true, message: t('typeRequired') }]}>
|
|
<Select placeholder={t('typePlaceholder')} value={item.type || ""} onChange={(v) => {
|
|
update({ type: v });
|
|
}}>
|
|
<Select.Option value="oak">Oak</Select.Option>
|
|
<Select.Option value="gitea">Gitea</Select.Option>
|
|
<Select.Option value="github">GitHub</Select.Option>
|
|
<Select.Option value="google">Google</Select.Option>
|
|
<Select.Option value="facebook">Facebook</Select.Option>
|
|
<Select.Option value="twitter">Twitter</Select.Option>
|
|
<Select.Option value="linkedin">LinkedIn</Select.Option>
|
|
<Select.Option value="custom">Custom</Select.Option>
|
|
<Select.Option value="gitlab">GitLab</Select.Option>
|
|
<Select.Option value="microsoft">Microsoft</Select.Option>
|
|
<Select.Option value="apple">Apple</Select.Option>
|
|
<Select.Option value="tencent">Tencent</Select.Option>
|
|
<Select.Option value="weixin">Weixin</Select.Option>
|
|
<Select.Option value="weibo">Weibo</Select.Option>
|
|
<Select.Option value="dingtalk">DingTalk</Select.Option>
|
|
</Select>
|
|
</Form.Item>
|
|
|
|
<Form.Item label={t('logo')}>
|
|
<Input placeholder={t('logoPlaceholder')} value={item.logo || ""} onChange={(v) => {
|
|
update({ logo: v.target.value });
|
|
}}/>
|
|
</Form.Item>
|
|
|
|
<Form.Item label={t('authorizationEndpoint')} rules={[{ required: true, message: t('authorizationEndpointRequired') }]}>
|
|
<Input placeholder={t('authorizationEndpointPlaceholder')} value={item.authorizationEndpoint || ""} onChange={(v) => {
|
|
update({ authorizationEndpoint: v.target.value });
|
|
}}/>
|
|
</Form.Item>
|
|
|
|
<Form.Item label={t('tokenEndpoint')} rules={[{ required: true, message: t('tokenEndpointRequired') }]}>
|
|
<Input placeholder={t('tokenEndpointPlaceholder')} value={item.tokenEndpoint || ""} onChange={(v) => {
|
|
update({ tokenEndpoint: v.target.value });
|
|
}}/>
|
|
</Form.Item>
|
|
|
|
<Form.Item label={t('refreshEndpoint')}>
|
|
<Input placeholder={t('refreshEndpointPlaceholder')} value={item.refreshEndpoint || ""} onChange={(v) => {
|
|
update({ refreshEndpoint: v.target.value });
|
|
}}/>
|
|
</Form.Item>
|
|
|
|
<Form.Item label={t('userInfoEndpoint')}>
|
|
<Input placeholder={t('userInfoEndpointPlaceholder')} value={item.userInfoEndpoint || ""} onChange={(v) => {
|
|
update({ userInfoEndpoint: v.target.value });
|
|
}}/>
|
|
</Form.Item>
|
|
|
|
<Form.Item label={t('revokeEndpoint')}>
|
|
<Input placeholder={t('revokeEndpointPlaceholder')} value={item.revokeEndpoint || ""} onChange={(v) => {
|
|
update({ revokeEndpoint: v.target.value });
|
|
}}/>
|
|
</Form.Item>
|
|
|
|
<Form.Item label={t('clientId')} rules={[{ required: true, message: t('clientIdRequired') }]}>
|
|
<Input placeholder={t('clientIdPlaceholder')} value={item.clientId || ""} onChange={(v) => {
|
|
update({ clientId: v.target.value });
|
|
}}/>
|
|
</Form.Item>
|
|
|
|
<Form.Item label={t('clientSecret')} rules={[{ required: true, message: t('clientSecretRequired') }]}>
|
|
<Input.Password placeholder={t('clientSecretPlaceholder')} value={item.clientSecret || ""} onChange={(v) => {
|
|
update({ clientSecret: v.target.value });
|
|
}}/>
|
|
</Form.Item>
|
|
|
|
<Form.Item label={t('scopes')}>
|
|
<Select mode="tags" placeholder={t('scopesPlaceholder')} value={item.scopes || []} onChange={(v) => {
|
|
update({ scopes: v });
|
|
}} tokenSeparators={[',']} open={false}/>
|
|
</Form.Item>
|
|
|
|
<Form.Item label={t('redirectUri')} rules={[{ required: true, message: t('redirectUriRequired') }]}>
|
|
<Input placeholder={t('redirectUriPlaceholder')} value={item.redirectUri || ""} onChange={(v) => {
|
|
update({ redirectUri: v.target.value });
|
|
}}/>
|
|
</Form.Item>
|
|
|
|
<Form.Item label={t('autoRegister')} valuePropName="checked">
|
|
<Switch checked={!!item.autoRegister} onChange={(checked) => update({ autoRegister: checked })}/>
|
|
</Form.Item>
|
|
|
|
<Form.Item label={t('ableState')} valuePropName="checked">
|
|
<Switch checked={!!item.ableState} onChange={(checked) => update({ ableState: checked ? "enabled" : "disabled" })}/>
|
|
</Form.Item>
|
|
|
|
{/* <Form.Item>
|
|
<Space>
|
|
<Button type="primary" htmlType="submit">
|
|
{t('confirm')}
|
|
</Button>
|
|
<Button onClick={handleCancel}>
|
|
{t('cancel')}
|
|
</Button>
|
|
</Space>
|
|
</Form.Item> */}
|
|
</Form>
|
|
</div>);
|
|
};
|
|
export default Upsert;
|