github/quartz-manager
1
0
Fork 0
mirror of https://github.com/fabioformosa/quartz-manager.git synced 2025-12-30 06:03:15 +09:00
Code Issues Packages Projects Releases Wiki Activity

#57 enhanced the layout of the trigger form

Browse Source
This commit is contained in:
Fabio Formosa
2022-11-05 17:43:48 +01:00
parent 014c348a89
commit 85ba371b72
3 changed files with 63 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
quartz-manager-frontend/src/app/components/simple-trigger-config/simple-trigger-config.component.html
View File

@@ -1,10 +1,10 @@
<mat-card>
<mat-card fxFlex="1 1 auto">
<mat-card-header>
<mat-card-subtitle><b>TRIGGER DETAILS</b></mat-card-subtitle>
</mat-card-header>
<mat-card-content *ngIf="shouldShowTheTriggerCardContent()">
<div fxLayout="column">
<mat-divider></mat-divider>
<mat-card-content *ngIf="shouldShowTheTriggerCardContent()" style="position: relative; height: 100%">
<div fxLayout="column" style="overflow-y: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; overflow: auto;height: calc(100% - 3em)">
<form name="triggerConfigForm" fxFlex="1 1 100%"
[formGroup]="simpleTriggerReactiveForm" (ngSubmit)="onSubmitTriggerConfig()">
<div>
@@ -132,9 +132,9 @@
repeatCount and repeatInterval must be <strong>both</strong> set or unset
</mat-error>
</mat-form-field>
<!-- <mat-error *ngIf="simpleTriggerReactiveForm.controls.triggerRecurrence.errors?.invalidTriggerRecurrence" style="font-size: small">-->
<!-- repeatCount and repeatInterval must be <strong>both</strong> set or unset-->
<!-- </mat-error>-->
<!-- <mat-error *ngIf="simpleTriggerReactiveForm.controls.triggerRecurrence.errors?.invalidTriggerRecurrence" style="font-size: small">-->
<!-- repeatCount and repeatInterval must be <strong>both</strong> set or unset-->
<!-- </mat-error>-->
</div>
<div>
<mat-form-field
@@ -157,26 +157,33 @@
<br/>
<button mat-raised-button
type="button"
*ngIf="enabledTriggerForm"
(click)="onResetReactiveForm()">
Cancel
</button>
<button mat-raised-button
type="submit" color="primary"
[disabled]="simpleTriggerReactiveForm.invalid"
*ngIf="enabledTriggerForm">
Submit
</button>
<button mat-raised-button type="button"
*ngIf="!enabledTriggerForm"
(click)="enabledTriggerForm = true">
Reschedule
</button>
<div fxLayout="row" fxFlexAlign="space-evenly center" style="padding-bottom: 1em;">
<div fxFlex="1 1 auto" style="text-align: center" *ngIf="enabledTriggerForm">
<button mat-raised-button
type="button"
*ngIf="enabledTriggerForm"
(click)="onResetReactiveForm()">
Cancel
</button>
</div>
<div fxFlex="1 1 auto" style="text-align: center" *ngIf="enabledTriggerForm">
<button mat-raised-button
type="submit" color="primary"
[disabled]="simpleTriggerReactiveForm.invalid"
*ngIf="enabledTriggerForm">
Submit
</button>
</div>
<div fxFlex="1 1 auto" style="text-align: center" *ngIf="!enabledTriggerForm">
<button mat-raised-button type="button"
*ngIf="!enabledTriggerForm"
(click)="enabledTriggerForm = true">
Reschedule
</button>
</div>
</div>
</form>
</div>
</mat-card-content>
</mat-card>

22
quartz-manager-frontend/src/app/components/simple-trigger-config/simple-trigger-config.component.scss
View File

@@ -5,3 +5,25 @@
.full-size-input{
width: 100%;
}
/* ===== Scrollbar CSS ===== */
/* Firefox */
* {
scrollbar-width: auto;
scroll-margin-right: 0;
scrollbar-color: #b8b8b8 #ffffff;
}
/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
width: 12px;
}
*::-webkit-scrollbar-track {
background: #ffffff;
}
*::-webkit-scrollbar-thumb {
background-color: #b8b8b8;
border-radius: 10px;
border: 3px solid #ffffff;
}

18
quartz-manager-frontend/src/app/views/manager/manager.component.html
View File

@@ -16,22 +16,22 @@
</div>
</div>
<div fxFlex="1 1 350px" >
<div fxLayout="column">
<qrzmng-simple-trigger-config
[triggerKey]="selectedTriggerKey"
(onNewTrigger)="onNewTriggerCreated($event)">
</qrzmng-simple-trigger-config>
</div>
<div fxFlex="1 1 350px">
<div fxLayout="row" fxFill>
<div fxLayout="column" fxFill>
<qrzmng-simple-trigger-config fxFill
[triggerKey]="selectedTriggerKey"
(onNewTrigger)="onNewTriggerCreated($event)">
</qrzmng-simple-trigger-config>
</div>
</div>
</div>
<div fxFlex="1 1 auto" style="margin-left: 20px;">
<div fxLayout="row" fxLayoutAlign="stretch" fxFill>
<div fxFlex="1 1 auto" fxLayout="column" fxLayoutAlign="start stretch" fxLayoutGap="6px">
<progress-panel></progress-panel>
<logs-panel fxFlex="1 1 auto" fxFill></logs-panel>
</div>
</div>
</div>
</div>