mirror of https://github.com/ctk-hq/ctk
Artem Golub
5 years ago
committed by
GitHub
commit
b475341251
@ -0,0 +1,62 @@
|
||||
<h1 mat-dialog-title><span>Build Config</span></h1>
|
||||
<mat-dialog-content>
|
||||
<mat-tab-group animationDuration="0ms">
|
||||
<mat-tab label="General">
|
||||
<form [formGroup]="formGeneral" fxLayout="column">
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Build</mat-label>
|
||||
<input matInput formControlName="build" />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Context</mat-label>
|
||||
<input matInput formControlName="context" />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Dockerfile</mat-label>
|
||||
<input matInput formControlName="dockerfile" />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Network</mat-label>
|
||||
<input matInput formControlName="network" />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>SHM size</mat-label>
|
||||
<input matInput formControlName="shm_size" />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Target</mat-label>
|
||||
<input matInput formControlName="target" />
|
||||
</mat-form-field>
|
||||
</form>
|
||||
</mat-tab>
|
||||
<mat-tab label="Arguments">
|
||||
<h2 mat-dialog-title>Arguments</h2>
|
||||
<key-value #args [keyValueArray]="currentArgs"></key-value>
|
||||
</mat-tab>
|
||||
|
||||
<mat-tab label="Cache from">
|
||||
<h2 mat-dialog-title>Cache from</h2>
|
||||
<key-value #cache_from [keyValueArray]="currentCacheFrom"></key-value>
|
||||
</mat-tab>
|
||||
|
||||
<mat-tab label="Labels">
|
||||
<h2 mat-dialog-title>Labels</h2>
|
||||
<key-value #labels [keyValueArray]="currentLabels"></key-value>
|
||||
</mat-tab>
|
||||
</mat-tab-group>
|
||||
</mat-dialog-content>
|
||||
|
||||
<mat-dialog-actions class="dialog-actions">
|
||||
<check-circle></check-circle>
|
||||
<button mat-button (click)="dialogRef.close()">
|
||||
Cancel
|
||||
</button>
|
||||
<button mat-raised-button color="success" (click)="onSave()" [disabled]="formGeneral.invalid">
|
||||
Save
|
||||
</button>
|
||||
</mat-dialog-actions>
|
||||
@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { BuildDialogComponent } from './build-dialog.component';
|
||||
|
||||
describe('BuildDialogComponent', () => {
|
||||
let component: BuildDialogComponent;
|
||||
let fixture: ComponentFixture<BuildDialogComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ BuildDialogComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(BuildDialogComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,64 @@
|
||||
import { Component, OnInit, ViewChild, Inject } from '@angular/core'
|
||||
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'
|
||||
import { FormControl, Validators, FormGroup, FormBuilder, AbstractControl } from '@angular/forms'
|
||||
import { KeyValueComponent } from '../../common/key-value/key-value/key-value.component'
|
||||
import { Service, Project, Volume, ServicePort, Network } from '../../../store/models'
|
||||
import { CheckCircleComponent } from '../../widgets/check-circle/check-circle.component'
|
||||
import { Store } from '@ngrx/store'
|
||||
import * as ProjectActions from './../../../store/project.actions'
|
||||
import { EventEmitterService } from 'src/app/core/services/event-emitter.service'
|
||||
|
||||
@Component({
|
||||
selector: 'app-build-dialog',
|
||||
templateUrl: './build-dialog.component.html',
|
||||
styleUrls: ['./build-dialog.component.scss']
|
||||
})
|
||||
export class BuildDialogComponent implements OnInit {
|
||||
@ViewChild(CheckCircleComponent) checkCircle: CheckCircleComponent
|
||||
@ViewChild('args') args: KeyValueComponent
|
||||
@ViewChild('cache_from') cache_from: KeyValueComponent
|
||||
@ViewChild('labels') labels: KeyValueComponent
|
||||
|
||||
formGeneral: FormGroup
|
||||
currentArgs: [] = []
|
||||
currentCacheFrom: [] = []
|
||||
currentLabels: [] = []
|
||||
constructor(public dialogRef: MatDialogRef<BuildDialogComponent>, private formBuilder: FormBuilder, @Inject(MAT_DIALOG_DATA) public data: Service, private store: Store, private eventEmitterService: EventEmitterService,) { }
|
||||
|
||||
ngOnInit(): void {
|
||||
this.formGeneral = this.formBuilder.group({
|
||||
build: new FormControl(''),
|
||||
context: new FormControl(''),
|
||||
dockerfile: new FormControl(''),
|
||||
network: new FormControl(''),
|
||||
shm_size: new FormControl(''),
|
||||
target: new FormControl(''),
|
||||
})
|
||||
|
||||
if (this.data.build) {
|
||||
this.data.build.labels.forEach(val => this.currentLabels.push(val))
|
||||
this.data.build.cache_from.forEach(val => this.currentCacheFrom.push(val))
|
||||
this.data.build.args.forEach(val => this.currentArgs.push(val))
|
||||
|
||||
let fields = Object.keys(this.data.build).reduce((acc, key) => {
|
||||
if(this.data.build[key]) acc[key] = this.data.build[key]
|
||||
return acc
|
||||
}, {})
|
||||
|
||||
this.formGeneral.patchValue(fields)
|
||||
}
|
||||
}
|
||||
|
||||
onSave() {
|
||||
const fields = {
|
||||
...this.formGeneral.getRawValue(),
|
||||
args: this.args.getKeyValuePaies(),
|
||||
cache_from: this.cache_from.getKeyValuePaies(),
|
||||
labels: this.labels.getKeyValuePaies()
|
||||
}
|
||||
this.store.dispatch(ProjectActions.UpdateService({data: {...this.data, build: fields}}))
|
||||
this.checkCircle.showCircle()
|
||||
this.eventEmitterService.broadcast('save:project', {})
|
||||
}
|
||||
|
||||
}
|
||||
Loading…
Reference in New Issue