web/admin: add edit button to application view page
Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
parent
67fef02d71
commit
5b5d7e4997
|
@ -29,6 +29,7 @@ export class ModalButton extends LitElement {
|
|||
css`
|
||||
:host {
|
||||
text-align: left;
|
||||
font-size: var(--pf-global--FontSize--md);
|
||||
}
|
||||
.pf-c-modal-box.pf-m-lg {
|
||||
overflow-y: auto;
|
||||
|
|
|
@ -57,18 +57,10 @@ export class ConfirmationForm extends ModalButton {
|
|||
</h1>
|
||||
</div>
|
||||
</section>
|
||||
<section class="pf-c-page__main-section">
|
||||
<div class="pf-l-stack">
|
||||
<div class="pf-l-stack__item">
|
||||
<div class="pf-c-card">
|
||||
<div class="pf-c-card__body">
|
||||
<form class="pf-c-form pf-m-horizontal">
|
||||
<slot name="body"></slot>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="pf-c-page__main-section pf-m-light">
|
||||
<form class="pf-c-form pf-m-horizontal">
|
||||
<slot name="body"></slot>
|
||||
</form>
|
||||
</section>
|
||||
<footer class="pf-c-modal-box__footer">
|
||||
<ak-spinner-button
|
||||
|
|
|
@ -55,20 +55,12 @@ export class DeleteForm extends ModalButton {
|
|||
</h1>
|
||||
</div>
|
||||
</section>
|
||||
<section class="pf-c-page__main-section">
|
||||
<div class="pf-l-stack">
|
||||
<div class="pf-l-stack__item">
|
||||
<div class="pf-c-card">
|
||||
<div class="pf-c-card__body">
|
||||
<form class="pf-c-form pf-m-horizontal">
|
||||
<p>
|
||||
${t`Are you sure you want to delete ${this.objectLabel} '${this.obj?.name}'?`}
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="pf-c-page__main-section pf-m-light">
|
||||
<form class="pf-c-form pf-m-horizontal">
|
||||
<p>
|
||||
${t`Are you sure you want to delete ${this.objectLabel} '${this.obj?.name}'?`}
|
||||
</p>
|
||||
</form>
|
||||
</section>
|
||||
<footer class="pf-c-modal-box__footer">
|
||||
<ak-spinner-button
|
||||
|
|
|
@ -7,6 +7,7 @@ import "../../elements/buttons/SpinnerButton";
|
|||
import "../../elements/EmptyState";
|
||||
import "../../elements/events/ObjectChangelog";
|
||||
import "../policies/BoundPoliciesList";
|
||||
import "./ApplicationForm";
|
||||
import { Application, CoreApi } from "authentik-api";
|
||||
import { DEFAULT_CONFIG } from "../../api/Config";
|
||||
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 AKGlobal from "../../authentik.css";
|
||||
import PFBase from "@patternfly/patternfly/patternfly-base.css";
|
||||
import PFButton from "@patternfly/patternfly/components/Button/button.css";
|
||||
|
||||
@customElement("ak-application-view")
|
||||
export class ApplicationViewPage extends LitElement {
|
||||
|
@ -32,7 +34,7 @@ export class ApplicationViewPage extends LitElement {
|
|||
application!: Application;
|
||||
|
||||
static get styles(): CSSResult[] {
|
||||
return [PFBase, PFPage, PFContent, PFGallery, PFCard, AKGlobal].concat(
|
||||
return [PFBase, PFPage, PFContent, PFButton, PFGallery, PFCard, AKGlobal].concat(
|
||||
css`
|
||||
img.pf-icon {
|
||||
max-height: 24px;
|
||||
|
@ -96,6 +98,28 @@ export class ApplicationViewPage extends LitElement {
|
|||
</dd>
|
||||
</div>`:
|
||||
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>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Reference in a new issue