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

Improve creation UI for pages.

Browse Source
This commit is contained in:
Gucheng Wang 2021-12-12 18:51:12 +08:00
parent 2f71d9743b
commit 1762d19787
12 changed files with 94 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
web/src/ApplicationEditPage.js
View File

@ -123,7 +123,8 @@ class ApplicationEditPage extends React.Component {
<Card size="small" title={
<div>
{i18next.t("application:Edit Application")}&nbsp;&nbsp;&nbsp;&nbsp;
<Button type="primary" onClick={this.submitApplicationEdit.bind(this)}>{i18next.t("general:Save")}</Button>
<Button onClick={() => this.submitApplicationEdit(false)}>{i18next.t("general:Save")}</Button>
<Button style={{marginLeft: '20px'}} type="primary" onClick={() => this.submitApplicationEdit(true)}>{i18next.t("general:Save & Exit")}</Button>
</div>
} style={(Setting.isMobile())? {margin: '5px'}:{}} type="inner">
<Row style={{marginTop: '10px'}} >
@ -509,7 +510,7 @@ class ApplicationEditPage extends React.Component {
)
}
submitApplicationEdit() {
submitApplicationEdit(willExist) {
let application = Setting.deepCopy(this.state.application);
ApplicationBackend.updateApplication(this.state.application.owner, this.state.applicationName, application)
.then((res) => {
@ -518,7 +519,12 @@ class ApplicationEditPage extends React.Component {
this.setState({
applicationName: this.state.application.name,
});
if (willExist) {
this.props.history.push(`/applications`);
} else {
this.props.history.push(`/applications/${this.state.application.name}`);
}
} else {
Setting.showMessage("error", res.msg);
this.updateApplicationField('name', this.state.applicationName);
@ -536,7 +542,8 @@ class ApplicationEditPage extends React.Component {
this.state.application !== null ? this.renderApplication() : null
}
<div style={{marginTop: '20px', marginLeft: '40px'}}>
<Button type="primary" size="large" onClick={this.submitApplicationEdit.bind(this)}>{i18next.t("general:Save")}</Button>
<Button size="large" onClick={() => this.submitApplicationEdit(false)}>{i18next.t("general:Save")}</Button>
<Button style={{marginLeft: '20px'}} type="primary" size="large" onClick={() => this.submitApplicationEdit(true)}>{i18next.t("general:Save & Exit")}</Button>
</div>
</div>
);

3
web/src/ApplicationListPage.js
View File

@ -48,7 +48,7 @@ class ApplicationListPage extends React.Component {
}
newApplication() {
var randomName = Math.random().toString(36).slice(-6)
const randomName = Setting.getRandomName();
return {
owner: "admin", // this.props.account.applicationname,
name: `application_${randomName}`,
@ -83,6 +83,7 @@ class ApplicationListPage extends React.Component {
applications: Setting.prependRow(this.state.applications, newApplication),
total: this.state.total + 1
});
this.props.history.push(`/applications/${newApplication.name}`);
}
)
.catch(error => {

2
web/src/OrganizationListPage.js
View File

@ -47,7 +47,7 @@ class OrganizationListPage extends React.Component {
}
newOrganization() {
var randomName = Math.random().toString(36).slice(-6)
const randomName = Setting.getRandomName();
return {
owner: "admin", // this.props.account.organizationname,
name: `organization_${randomName}`,

13
web/src/ProviderEditPage.js
View File

@ -181,7 +181,8 @@ class ProviderEditPage extends React.Component {
<Card size="small" title={
<div>
{i18next.t("provider:Edit Provider")}&nbsp;&nbsp;&nbsp;&nbsp;
<Button type="primary" onClick={this.submitProviderEdit.bind(this)}>{i18next.t("general:Save")}</Button>
<Button onClick={() => this.submitProviderEdit(false)}>{i18next.t("general:Save")}</Button>
<Button style={{marginLeft: '20px'}} type="primary" onClick={() => this.submitProviderEdit(true)}>{i18next.t("general:Save & Exit")}</Button>
</div>
} style={(Setting.isMobile())? {margin: '5px'}:{}} type="inner">
<Row style={{marginTop: '10px'}} >
@ -521,7 +522,7 @@ class ProviderEditPage extends React.Component {
)
}
submitProviderEdit() {
submitProviderEdit(willExist) {
let provider = Setting.deepCopy(this.state.provider);
ProviderBackend.updateProvider(this.state.provider.owner, this.state.providerName, provider)
.then((res) => {
@ -530,7 +531,12 @@ class ProviderEditPage extends React.Component {
this.setState({
providerName: this.state.provider.name,
});
if (willExist) {
this.props.history.push(`/providers`);
} else {
this.props.history.push(`/providers/${this.state.provider.name}`);
}
} else {
Setting.showMessage("error", res.msg);
this.updateProviderField('name', this.state.providerName);
@ -548,7 +554,8 @@ class ProviderEditPage extends React.Component {
this.state.provider !== null ? this.renderProvider() : null
}
<div style={{marginTop: '20px', marginLeft: '40px'}}>
<Button type="primary" size="large" onClick={this.submitProviderEdit.bind(this)}>{i18next.t("general:Save")}</Button>
<Button size="large" onClick={() => this.submitProviderEdit(false)}>{i18next.t("general:Save")}</Button>
<Button style={{marginLeft: '20px'}} type="primary" size="large" onClick={() => this.submitProviderEdit(true)}>{i18next.t("general:Save & Exit")}</Button>
</div>
</div>
);

3
web/src/ProviderListPage.js
View File

@ -48,7 +48,7 @@ class ProviderListPage extends React.Component {
}
newProvider() {
var randomName = Math.random().toString(36).slice(-6)
const randomName = Setting.getRandomName();
return {
owner: "admin", // this.props.account.providername,
name: `provider_${randomName}`,
@ -75,6 +75,7 @@ class ProviderListPage extends React.Component {
providers: Setting.prependRow(this.state.providers, newProvider),
total: this.state.total + 1
});
this.props.history.push(`/providers/${newProvider.name}`);
}
)
.catch(error => {

4
web/src/Setting.js
View File

@ -554,3 +554,7 @@ export function getTags(tags) {
export function getApplicationOrgName(application) {
return `${application?.organizationObj.owner}/${application?.organizationObj.name}`;
}
export function getRandomName() {
return Math.random().toString(36).slice(-6);
}

33
web/src/TokenEditPage.js
View File

@ -63,7 +63,8 @@ class TokenEditPage extends React.Component {
<Card size="small" title={
<div>
{i18next.t("token:Edit Token")}&nbsp;&nbsp;&nbsp;&nbsp;
<Button type="primary" onClick={this.submitTokenEdit.bind(this)}>{i18next.t("general:Save")}</Button>
<Button onClick={() => this.submitTokenEdit(false)}>{i18next.t("general:Save")}</Button>
<Button style={{marginLeft: '20px'}} type="primary" onClick={() => this.submitTokenEdit(true)}>{i18next.t("general:Save & Exit")}</Button>
</div>
} style={(Setting.isMobile())? {margin: '5px'}:{}} type="inner">
<Row style={{marginTop: '10px'}} >
@ -86,6 +87,26 @@ class TokenEditPage extends React.Component {
}} />
</Col>
</Row>
<Row style={{marginTop: '20px'}} >
<Col style={{marginTop: '5px'}} span={(Setting.isMobile()) ? 22 : 2}>
{i18next.t("general:Organization")}:
</Col>
<Col span={22} >
<Input value={this.state.token.organization} onChange={e => {
this.updateTokenField('organization', e.target.value);
}} />
</Col>
</Row>
<Row style={{marginTop: '20px'}} >
<Col style={{marginTop: '5px'}} span={(Setting.isMobile()) ? 22 : 2}>
{i18next.t("general:User")}:
</Col>
<Col span={22} >
<Input value={this.state.token.user} onChange={e => {
this.updateTokenField('user', e.target.value);
}} />
</Col>
</Row>
<Row style={{marginTop: '20px'}} >
<Col style={{marginTop: '5px'}} span={(Setting.isMobile()) ? 22 : 2}>
{i18next.t("general:Authorization code")}:
@ -140,7 +161,7 @@ class TokenEditPage extends React.Component {
)
}
submitTokenEdit() {
submitTokenEdit(willExist) {
let token = Setting.deepCopy(this.state.token);
TokenBackend.updateToken(this.state.token.owner, this.state.tokenName, token)
.then((res) => {
@ -149,7 +170,12 @@ class TokenEditPage extends React.Component {
this.setState({
tokenName: this.state.token.name,
});
if (willExist) {
this.props.history.push(`/tokens`);
} else {
this.props.history.push(`/tokens/${this.state.token.name}`);
}
} else {
Setting.showMessage("error", res.msg);
this.updateTokenField('name', this.state.tokenName);
@ -167,7 +193,8 @@ class TokenEditPage extends React.Component {
this.state.token !== null ? this.renderToken() : null
}
<div style={{marginTop: '20px', marginLeft: '40px'}}>
<Button type="primary" size="large" onClick={this.submitTokenEdit.bind(this)}>{i18next.t("general:Save")}</Button>
<Button size="large" onClick={() => this.submitTokenEdit(false)}>{i18next.t("general:Save")}</Button>
<Button style={{marginLeft: '20px'}} type="primary" size="large" onClick={() => this.submitTokenEdit(true)}>{i18next.t("general:Save & Exit")}</Button>
</div>
</div>
);

6
web/src/TokenListPage.js
View File

@ -47,11 +47,14 @@ class TokenListPage extends React.Component {
}
newToken() {
const randomName = Setting.getRandomName();
return {
owner: "admin", // this.props.account.tokenname,
name: `token_${Math.random().toString(36).slice(-6)}`,
name: `token_${randomName}`,
createdTime: moment().format(),
application: "app-built-in",
organization: "built-in",
user: "admin",
accessToken: "",
expiresIn: 7200,
scope: "read",
@ -68,6 +71,7 @@ class TokenListPage extends React.Component {
tokens: Setting.prependRow(this.state.tokens, newToken),
total: this.state.total + 1
});
this.props.history.push(`/tokens/${newToken.name}`);
}
)
.catch(error => {

12
web/src/UserEditPage.js
View File

@ -110,7 +110,8 @@ class UserEditPage extends React.Component {
<Card size="small" title={
<div>
{i18next.t("user:Edit User")}&nbsp;&nbsp;&nbsp;&nbsp;
<Button type="primary" onClick={this.submitUserEdit.bind(this)}>{i18next.t("general:Save")}</Button>
<Button onClick={() => this.submitUserEdit(false)}>{i18next.t("general:Save")}</Button>
<Button style={{marginLeft: '20px'}} type="primary" onClick={() => this.submitUserEdit(true)}>{i18next.t("general:Save & Exit")}</Button>
</div>
} style={(Setting.isMobile())? {margin: '5px'}:{}} type="inner">
<Row style={{marginTop: '10px'}} >
@ -370,7 +371,7 @@ class UserEditPage extends React.Component {
)
}
submitUserEdit() {
submitUserEdit(willExist) {
let user = Setting.deepCopy(this.state.user);
UserBackend.updateUser(this.state.organizationName, this.state.userName, user)
.then((res) => {
@ -382,8 +383,12 @@ class UserEditPage extends React.Component {
});
if (this.props.history !== undefined) {
if (willExist) {
this.props.history.push(`/users`);
} else {
this.props.history.push(`/users/${this.state.user.owner}/${this.state.user.name}`);
}
}
} else {
Setting.showMessage("error", res.msg);
this.updateUserField('owner', this.state.organizationName);
@ -402,7 +407,8 @@ class UserEditPage extends React.Component {
this.state.user !== null ? this.renderUser() : null
}
<div style={{marginTop: '20px', marginLeft: '40px'}}>
<Button type="primary" size="large" onClick={this.submitUserEdit.bind(this)}>{i18next.t("general:Save")}</Button>
<Button size="large" onClick={() => this.submitUserEdit(false)}>{i18next.t("general:Save")}</Button>
<Button style={{marginLeft: '20px'}} type="primary" size="large" onClick={() => this.submitUserEdit(true)}>{i18next.t("general:Save & Exit")}</Button>
</div>
</div>
);

4
web/src/UserListPage.js
View File

@ -60,7 +60,7 @@ class UserListPage extends React.Component {
}
newUser() {
var randomName = Math.random().toString(36).slice(-6)
const randomName = Setting.getRandomName();
return {
owner: "built-in", // this.props.account.username,
name: `user_${randomName}`,
@ -81,6 +81,7 @@ class UserListPage extends React.Component {
IsForbidden: false,
isDeleted: false,
properties: {},
signupApplication: "app-built-in",
}
}
@ -93,6 +94,7 @@ class UserListPage extends React.Component {
users: Setting.prependRow(this.state.users, newUser),
total: this.state.total + 1
});
this.props.history.push(`/users/${newUser.owner}/${newUser.name}`);
}
)
.catch(error => {

13
web/src/WebhookEditPage.js
View File

@ -78,7 +78,8 @@ class WebhookEditPage extends React.Component {
<Card size="small" title={
<div>
{i18next.t("webhook:Edit Webhook")}&nbsp;&nbsp;&nbsp;&nbsp;
<Button type="primary" onClick={this.submitWebhookEdit.bind(this)}>{i18next.t("general:Save")}</Button>
<Button onClick={() => this.submitWebhookEdit(false)}>{i18next.t("general:Save")}</Button>
<Button style={{marginLeft: '20px'}} type="primary" onClick={() => this.submitWebhookEdit(true)}>{i18next.t("general:Save & Exit")}</Button>
</div>
} style={(Setting.isMobile())? {margin: '5px'}:{}} type="inner">
<Row style={{marginTop: '10px'}} >
@ -154,7 +155,7 @@ class WebhookEditPage extends React.Component {
)
}
submitWebhookEdit() {
submitWebhookEdit(willExist) {
let webhook = Setting.deepCopy(this.state.webhook);
WebhookBackend.updateWebhook(this.state.webhook.owner, this.state.webhookName, webhook)
.then((res) => {
@ -163,7 +164,12 @@ class WebhookEditPage extends React.Component {
this.setState({
webhookName: this.state.webhook.name,
});
if (willExist) {
this.props.history.push(`/webhooks`);
} else {
this.props.history.push(`/webhooks/${this.state.webhook.name}`);
}
} else {
Setting.showMessage("error", res.msg);
this.updateWebhookField('name', this.state.webhookName);
@ -181,7 +187,8 @@ class WebhookEditPage extends React.Component {
this.state.webhook !== null ? this.renderWebhook() : null
}
<div style={{marginTop: '20px', marginLeft: '40px'}}>
<Button type="primary" size="large" onClick={this.submitWebhookEdit.bind(this)}>{i18next.t("general:Save")}</Button>
<Button size="large" onClick={() => this.submitWebhookEdit(false)}>{i18next.t("general:Save")}</Button>
<Button style={{marginLeft: '20px'}} type="primary" size="large" onClick={() => this.submitWebhookEdit(true)}>{i18next.t("general:Save & Exit")}</Button>
</div>
</div>
);

5
web/src/WebhookListPage.js
View File

@ -47,14 +47,14 @@ class WebhookListPage extends React.Component {
}
newWebhook() {
var randomName = Math.random().toString(36).slice(-6)
const randomName = Setting.getRandomName();
return {
owner: "admin", // this.props.account.webhookname,
name: `webhook_${randomName}`,
createdTime: moment().format(),
url: "https://example.com/callback",
contentType: "application/json",
events: [],
events: ["signup", "login", "logout", "update-user"],
organization: "built-in",
}
}
@ -68,6 +68,7 @@ class WebhookListPage extends React.Component {
webhooks: Setting.prependRow(this.state.webhooks, newWebhook),
total: this.state.total + 1
});
this.props.history.push(`/webhooks/${newWebhook.name}`);
}
)
.catch(error => {