trustchain-oc1-orchestral/authentik
Archived
10
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

web/admin: add edit button to application view page

Browse source 
Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2021-04-04 13:44:57 +02:00
parent 67fef02d71
commit 5b5d7e4997
4 changed files with 36 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
web/src/elements/buttons/ModalButton.ts
View file

@ -29,6 +29,7 @@ export class ModalButton extends LitElement {
css` css`
:host { :host {
text-align: left; text-align: left;
font-size: var(--pf-global--FontSize--md);
} }
.pf-c-modal-box.pf-m-lg { .pf-c-modal-box.pf-m-lg {
overflow-y: auto; overflow-y: auto;

16
web/src/elements/forms/ConfirmationForm.ts
View file

@ -57,18 +57,10 @@ export class ConfirmationForm extends ModalButton {
</h1> </h1>
</div> </div>
</section> </section>
<section class="pf-c-page__main-section"> <section class="pf-c-page__main-section pf-m-light">
<div class="pf-l-stack"> <form class="pf-c-form pf-m-horizontal">
<div class="pf-l-stack__item"> <slot name="body"></slot>
<div class="pf-c-card"> </form>
<div class="pf-c-card__body">
<form class="pf-c-form pf-m-horizontal">
<slot name="body"></slot>
</form>
</div>
</div>
</div>
</div>
</section> </section>
<footer class="pf-c-modal-box__footer"> <footer class="pf-c-modal-box__footer">
<ak-spinner-button <ak-spinner-button

20
web/src/elements/forms/DeleteForm.ts
View file

@ -55,20 +55,12 @@ export class DeleteForm extends ModalButton {
</h1> </h1>
</div> </div>
</section> </section>
<section class="pf-c-page__main-section"> <section class="pf-c-page__main-section pf-m-light">
<div class="pf-l-stack"> <form class="pf-c-form pf-m-horizontal">
<div class="pf-l-stack__item"> <p>
<div class="pf-c-card"> ${t`Are you sure you want to delete ${this.objectLabel} '${this.obj?.name}'?`}
<div class="pf-c-card__body"> </p>
<form class="pf-c-form pf-m-horizontal"> </form>
<p>
${t`Are you sure you want to delete ${this.objectLabel} '${this.obj?.name}'?`}
</p>
</form>
</div>
</div>
</div>
</div>
</section> </section>
<footer class="pf-c-modal-box__footer"> <footer class="pf-c-modal-box__footer">
<ak-spinner-button <ak-spinner-button

26
web/src/pages/applications/ApplicationViewPage.ts
View file

@ -7,6 +7,7 @@ import "../../elements/buttons/SpinnerButton";
import "../../elements/EmptyState"; import "../../elements/EmptyState";
import "../../elements/events/ObjectChangelog"; import "../../elements/events/ObjectChangelog";
import "../policies/BoundPoliciesList"; import "../policies/BoundPoliciesList";
import "./ApplicationForm";
import { Application, CoreApi } from "authentik-api"; import { Application, CoreApi } from "authentik-api";
import { DEFAULT_CONFIG } from "../../api/Config"; import { DEFAULT_CONFIG } from "../../api/Config";
import PFPage from "@patternfly/patternfly/components/Page/page.css"; import PFPage from "@patternfly/patternfly/components/Page/page.css";
@ -15,6 +16,7 @@ import PFGallery from "@patternfly/patternfly/layouts/Gallery/gallery.css";
import PFCard from "@patternfly/patternfly/components/Card/card.css"; import PFCard from "@patternfly/patternfly/components/Card/card.css";
import AKGlobal from "../../authentik.css"; import AKGlobal from "../../authentik.css";
import PFBase from "@patternfly/patternfly/patternfly-base.css"; import PFBase from "@patternfly/patternfly/patternfly-base.css";
import PFButton from "@patternfly/patternfly/components/Button/button.css";
@customElement("ak-application-view") @customElement("ak-application-view")
export class ApplicationViewPage extends LitElement { export class ApplicationViewPage extends LitElement {
@ -32,7 +34,7 @@ export class ApplicationViewPage extends LitElement {
application!: Application; application!: Application;
static get styles(): CSSResult[] { static get styles(): CSSResult[] {
return [PFBase, PFPage, PFContent, PFGallery, PFCard, AKGlobal].concat( return [PFBase, PFPage, PFContent, PFButton, PFGallery, PFCard, AKGlobal].concat(
css` css`
img.pf-icon { img.pf-icon {
max-height: 24px; max-height: 24px;
@ -96,6 +98,28 @@ export class ApplicationViewPage extends LitElement {
</dd> </dd>
</div>`: </div>`:
html``} html``}
<div class="pf-c-description-list__group">
<dt class="pf-c-description-list__term">
<span class="pf-c-description-list__text">${t`Edit`}</span>
</dt>
<dd class="pf-c-description-list__description">
<div class="pf-c-description-list__text">
<ak-forms-modal>
<span slot="submit">
${t`Update`}
</span>
<span slot="header">
${t`Update Application`}
</span>
<ak-application-form slot="form" .application=${this.application}>
</ak-application-form>
<button slot="trigger" class="pf-c-button pf-m-secondary">
${t`Edit`}
</button>
</ak-forms-modal>
</div>
</dd>
</div>
</dl> </dl>
</div> </div>
</div> </div>