llvy.ltd/casdoor
1
0
Fork 0
mirror of https://github.com/casdoor/casdoor.git synced 2025-05-23 02:35:49 +08:00
Code Issues Packages Projects Releases Wiki Activity

Improve TokenEditPage

Browse Source
This commit is contained in:
Yang Luo 2023-12-22 00:44:34 +08:00
parent 63081641d6
commit 79159dc809
1 changed files with 43 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
web/src/TokenEditPage.js
View File

@ -17,6 +17,9 @@ import {Button, Card, Col, Input, Row} from "antd";
import * as TokenBackend from "./backend/TokenBackend"; import * as TokenBackend from "./backend/TokenBackend";
import * as Setting from "./Setting"; import * as Setting from "./Setting";
import i18next from "i18next"; import i18next from "i18next";
import copy from "copy-to-clipboard";
const {TextArea} = Input;
class TokenEditPage extends React.Component { class TokenEditPage extends React.Component {
constructor(props) { constructor(props) {
@ -70,6 +73,7 @@ class TokenEditPage extends React.Component {
} }
renderToken() { renderToken() {
const editorWidth = Setting.isMobile() ? 22 : 9;
return ( return (
<Card size="small" title={ <Card size="small" title={
<div> <div>
@ -81,7 +85,7 @@ class TokenEditPage extends React.Component {
} style={(Setting.isMobile()) ? {margin: "5px"} : {}} type="inner"> } style={(Setting.isMobile()) ? {margin: "5px"} : {}} type="inner">
<Row style={{marginTop: "10px"}} > <Row style={{marginTop: "10px"}} >
<Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}> <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
{i18next.t("general:Name")}: {Setting.getLabel(i18next.t("general:Name"), i18next.t("general:Name - Tooltip"))} :
</Col> </Col>
<Col span={22} > <Col span={22} >
<Input value={this.state.token.name} onChange={e => { <Input value={this.state.token.name} onChange={e => {
@ -91,7 +95,7 @@ class TokenEditPage extends React.Component {
</Row> </Row>
<Row style={{marginTop: "20px"}} > <Row style={{marginTop: "20px"}} >
<Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}> <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
{i18next.t("general:Application")}: {Setting.getLabel(i18next.t("general:Application"), i18next.t("general:Application - Tooltip"))} :
</Col> </Col>
<Col span={22} > <Col span={22} >
<Input value={this.state.token.application} onChange={e => { <Input value={this.state.token.application} onChange={e => {
@ -101,7 +105,7 @@ class TokenEditPage extends React.Component {
</Row> </Row>
<Row style={{marginTop: "20px"}} > <Row style={{marginTop: "20px"}} >
<Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}> <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
{i18next.t("general:Organization")}: {Setting.getLabel(i18next.t("general:Organization"), i18next.t("general:Organization - Tooltip"))} :
</Col> </Col>
<Col span={22} > <Col span={22} >
<Input disabled={!Setting.isAdminUser(this.props.account)} value={this.state.token.organization} onChange={e => { <Input disabled={!Setting.isAdminUser(this.props.account)} value={this.state.token.organization} onChange={e => {
@ -111,7 +115,7 @@ class TokenEditPage extends React.Component {
</Row> </Row>
<Row style={{marginTop: "20px"}} > <Row style={{marginTop: "20px"}} >
<Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}> <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
{i18next.t("general:User")}: {Setting.getLabel(i18next.t("general:User"), i18next.t("general:User - Tooltip"))} :
</Col> </Col>
<Col span={22} > <Col span={22} >
<Input value={this.state.token.user} onChange={e => { <Input value={this.state.token.user} onChange={e => {
@ -121,7 +125,7 @@ class TokenEditPage extends React.Component {
</Row> </Row>
<Row style={{marginTop: "20px"}} > <Row style={{marginTop: "20px"}} >
<Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}> <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
{i18next.t("token:Authorization code")}: {Setting.getLabel(i18next.t("token:Authorization code"), i18next.t("token:Authorization code - Tooltip"))} :
</Col> </Col>
<Col span={22} > <Col span={22} >
<Input value={this.state.token.code} onChange={e => { <Input value={this.state.token.code} onChange={e => {
@ -131,17 +135,7 @@ class TokenEditPage extends React.Component {
</Row> </Row>
<Row style={{marginTop: "20px"}} > <Row style={{marginTop: "20px"}} >
<Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}> <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
{i18next.t("token:Access token")}: {Setting.getLabel(i18next.t("token:Expires in"), i18next.t("token:Expires in - Tooltip"))} :
</Col>
<Col span={22} >
<Input value={this.state.token.accessToken} onChange={e => {
this.updateTokenField("accessToken", e.target.value);
}} />
</Col>
</Row>
<Row style={{marginTop: "20px"}} >
<Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
{i18next.t("token:Expires in")}:
</Col> </Col>
<Col span={22} > <Col span={22} >
<Input value={this.state.token.expiresIn} onChange={e => { <Input value={this.state.token.expiresIn} onChange={e => {
@ -151,7 +145,7 @@ class TokenEditPage extends React.Component {
</Row> </Row>
<Row style={{marginTop: "20px"}} > <Row style={{marginTop: "20px"}} >
<Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}> <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
{i18next.t("provider:Scope")}: {Setting.getLabel(i18next.t("provider:Scope"), i18next.t("provider:Scope - Tooltip"))}
</Col> </Col>
<Col span={22} > <Col span={22} >
<Input value={this.state.token.scope} onChange={e => { <Input value={this.state.token.scope} onChange={e => {
@ -161,7 +155,7 @@ class TokenEditPage extends React.Component {
</Row> </Row>
<Row style={{marginTop: "20px"}} > <Row style={{marginTop: "20px"}} >
<Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}> <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
{i18next.t("token:Token type")}: {Setting.getLabel(i18next.t("token:Token type"), i18next.t("token:Token type - Tooltip"))} :
</Col> </Col>
<Col span={22} > <Col span={22} >
<Input value={this.state.token.tokenType} onChange={e => { <Input value={this.state.token.tokenType} onChange={e => {
@ -169,6 +163,37 @@ class TokenEditPage extends React.Component {
}} /> }} />
</Col> </Col>
</Row> </Row>
<Row style={{marginTop: "20px"}} >
<Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
{Setting.getLabel(i18next.t("token:Access token"), i18next.t("token:Access token - Tooltip"))} :
</Col>
<Col span={editorWidth} >
<Button type="primary" style={{marginRight: "10px", marginBottom: "10px"}} disabled={this.state.token.accessToken === ""} onClick={() => {
copy(this.state.token.accessToken);
Setting.showMessage("success", i18next.t("general:Copied to clipboard successfully"));
}}
>
{i18next.t("token:Copy access token")}
</Button>
<TextArea autoSize={{minRows: 30, maxRows: 30}} value={this.state.token.accessToken} onChange={e => {
this.updateTokenField("accessToken", e.target.value);
}} />
</Col>
<Col span={1} />
<Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
{Setting.getLabel(i18next.t("token:Parsing result"), i18next.t("token:Parsing result - Tooltip"))} :
</Col>
<Col span={editorWidth} >
<Button type="primary" style={{marginRight: "10px", marginBottom: "10px"}} disabled={this.state.token.accessToken === ""} onClick={() => {
copy(this.state.token.accessToken);
Setting.showMessage("success", i18next.t("general:Copied to clipboard successfully"));
}}
>
{i18next.t("token:Copy parsing result")}
</Button>
<TextArea autoSize={{minRows: 30, maxRows: 30}} value={this.state.token.accessToken} onChange={e => {}} />
</Col>
</Row>
</Card> </Card>
); );
} }