Add equipmentType table and fix creation bug

urls
Max Ehrlicher-Schmidt 4 years ago
parent 6ec98d868c
commit 5b2ae731c4

@ -4,6 +4,8 @@ import { BikeComponent } from './pages/dataPages/bike/bike.component';
import { LoginComponent} from './pages/login/login.component'
import { TableOverviewComponent } from './pages/table-overview/table-overview.component';
import { BikesComponent} from './pages/tables/bikes/bikes.component'
import { EngagementTypesComponent } from './pages/tables/engagement-types/engagement-types.component';
import { EquipmentTypesComponent } from './pages/tables/equipment-types/equipment-types.component';
import { LendingStationsComponent } from './pages/tables/lending-stations/lending-stations.component';
import { ParticipantsComponent } from './pages/tables/participants/participants.component';
@ -14,8 +16,11 @@ const routes: Routes = [
{ path: 'bike/:id', component: BikeComponent },
{ path: 'table/participants', component: ParticipantsComponent },
{ path: 'table/lendingStations', component: LendingStationsComponent },
{ path: 'table/equipmentTypes', component: EquipmentTypesComponent },
{ path: 'table/engagementTypes', component: EngagementTypesComponent },
{ path: '', redirectTo: 'tableOverview', pathMatch: 'full' },
{ path: 'table', redirectTo: 'tableOverview', pathMatch: 'full' },
{ path: '**', redirectTo: 'tableOverview' },
];
@NgModule({

@ -46,7 +46,10 @@ import { NavService }from './components/menu-list-item/nav.service';
import { TokenInterceptor } from './helper/token.interceptor';
import { BikeComponent } from './pages/dataPages/bike/bike.component';
import { TableComponent, DeleteConfirmationDialog } from './components/table/table.component';
import { DataPageComponent } from './components/data-page/data-page.component'
import { DataPageComponent } from './components/data-page/data-page.component';
import { EquipmentTypesComponent } from './pages/tables/equipment-types/equipment-types.component';
import { EngagementTypesComponent } from './pages/tables/engagement-types/engagement-types.component';
import { WorkshopsComponent } from './pages/tables/workshops/workshops.component'
@NgModule({
@ -63,7 +66,10 @@ import { DataPageComponent } from './components/data-page/data-page.component'
DeleteConfirmationDialog,
BikeComponent,
TableComponent,
DataPageComponent
DataPageComponent,
EquipmentTypesComponent,
EngagementTypesComponent,
WorkshopsComponent
],
imports: [
BrowserModule,

@ -198,10 +198,7 @@
<div
class="button-wrapper"
*ngIf="element.newObject"
[matTooltip]="
'Nicht ausgefüllte Pflichtfelder (rot): ' +
countUnvalidFields(element)
"
[matTooltip]="(countUnvalidFields(element) > 0) ? ('Nicht ausgefüllte Pflichtfelder (rot): ' + countUnvalidFields(element)) : 'Erstellen'"
>
<button
mat-icon-button

@ -114,11 +114,18 @@ export class TableComponent {
this.loadingRowIds = rowIds;
});
this.dataService.successfullyCreatedRowWithId.subscribe(id => {
this.data.data = this.data.data.filter(row => row.id !== id);
})
this.dataService.tableData.subscribe((newTableDataSource) => {
this.reloadingTable = false;
const tempDataSource = [];
if (newTableDataSource === null) {
return;
}
this.isLoaded = true;
for (const row of newTableDataSource) {
this.isLoaded = true;
const oldRow = this.getRowById(row.id);
/** make sure to not overwrite a row that is being edited */
if (!oldRow) {
@ -172,8 +179,8 @@ export class TableComponent {
this.tableDataGQLCreateInputType,
column.name
);
column.requiredForCreation = typeInformation.isRequired;
column.acceptedForCreation = typeInformation.isPartOfType;
column.requiredForCreation = column.requiredForCreation || typeInformation.isRequired;
column.acceptedForCreation = column.acceptedForCreation || typeInformation.isPartOfType;
}
}
@ -249,7 +256,7 @@ export class TableComponent {
this.tableDataGQLCreateInputType,
deepen(row)
);
this.createEvent.emit(newRow);
this.createEvent.emit({currentId: row.id, row: newRow});
}
lock(row: any) {

@ -0,0 +1,33 @@
query GetEquipmentTypes {
equipmentTypes {
...EquipmentTypeFields
}
}
mutation CreateEquipmentType($equipmentType: EquipmentTypeCreateInput!) {
createEquipmentType(equipmentType: $equipmentType) {
...EquipmentTypeFields
}
}
mutation UpdateEquipmentType($equipmentType: EquipmentTypeUpdateInput!) {
updateEquipmentType(equipmentType: $equipmentType) {
...EquipmentTypeFields
}
}
mutation LockEquipmentType($id: ID!) {
lockEquipmentType(id: $id) {
...EquipmentTypeFields
}
}
mutation UnlockEquipmentType($id: ID!) {
unlockEquipmentType(id: $id) {
...EquipmentTypeFields
}
}
mutation DeleteEquipmentType($id: ID!) {
deleteEquipmentType(id: $id)
}

@ -82,7 +82,7 @@ equipment {
...EquipmentFieldsForBikePage
}
equipmentType {
...EquipmentTypeFieldsForBikePage
...EquipmentTypeFields
}
engagement {
...EngagementFieldsForBikePage

@ -1,4 +1,4 @@
fragment EquipmentTypeFieldsForBikePage on EquipmentType {
fragment EquipmentTypeFields on EquipmentType {
id
name
description

@ -1,18 +1,12 @@
import { SelectionModel } from '@angular/cdk/collections';
import { Component, ViewChild } from '@angular/core';
import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
import { BikesService, CargoBikeResult } from 'src/app/services/bikes.service';
import { flatten } from 'src/app/helperFunctions/flattenObject';
import { deepen } from 'src/app/helperFunctions/deepenObject';
import { SchemaService } from 'src/app/services/schema.service';
import { MatDialog, MatDialogRef } from '@angular/material/dialog';
import { Component, OnInit } from '@angular/core';
import { BikesService } from 'src/app/services/bikes.service';
@Component({
selector: 'app-bikes',
templateUrl: './bikes.component.html',
styleUrls: ['./bikes.component.scss'],
})
export class BikesComponent {
export class BikesComponent implements OnInit {
columnInfo = [
{
name: 'name',
@ -124,8 +118,8 @@ export class BikesComponent {
this.dataService = this.bikesService;
}
create(row: any) {
this.bikesService.createBike({ bike: row });
create(object: {currentId: string, row: any}) {
this.bikesService.createBike(object.currentId, { bike: object.row });
}
lock(row: any) {

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { EngagementTypesComponent } from './engagement-types.component';
describe('EngagementTypesComponent', () => {
let component: EngagementTypesComponent;
let fixture: ComponentFixture<EngagementTypesComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ EngagementTypesComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(EngagementTypesComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

@ -0,0 +1,15 @@
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-engagement-types',
templateUrl: './engagement-types.component.html',
styleUrls: ['./engagement-types.component.scss']
})
export class EngagementTypesComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
}

@ -0,0 +1,12 @@
<app-table
[columnInfo]="columnInfo"
[dataService]="dataService"
[tableDataGQLType]="tableDataGQLType"
[tableDataGQLCreateInputType]="tableDataGQLCreateInputType"
[tableDataGQLUpdateInputType]="tableDataGQLUpdateInputType"
(createEvent)="create($event)"
(lockEvent)="lock($event)"
(saveEvent)="save($event)"
(cancelEvent)="cancel($event)"
(deleteEvent)="delete($event)"
></app-table>

@ -0,0 +1,50 @@
import { Component, OnInit } from '@angular/core';
import {EquipmentTypeService} from 'src/app/services/equipmentType.service'
@Component({
selector: 'app-equipment-types',
templateUrl: './equipment-types.component.html',
styleUrls: ['./equipment-types.component.scss']
})
export class EquipmentTypesComponent implements OnInit {
columnInfo = [
{ name: 'id', translation: 'ID', readonly: true },
{ name: 'name', translation: 'Name', requiredForCreation: true },
{ name: 'description', translation: 'Beschreibung' },
];
dataService: EquipmentTypeService;
tableDataGQLType: string = 'EquipmentType';
tableDataGQLCreateInputType: string = 'EquipmentTypeCreateInput';
tableDataGQLUpdateInputType: string = 'EquipmentTypeUpdateInput';
loadingRowIds: string[] = [];
constructor(
private service: EquipmentTypeService
) {}
ngOnInit() {
this.dataService = this.service;
}
create(value: {currentId: string, row: any}) {
this.dataService.create(value.currentId, { equipmentType: value.row });
}
lock(row: any) {
this.dataService.lock({ id: row.id });
}
save(row: any) {
this.dataService.update({ equipmentType: row });
}
cancel(row: any) {
this.dataService.unlock({ id: row.id });
}
delete(row: any) {
this.dataService.delete({ id: row.id });
}
}

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { WorkshopsComponent } from './workshops.component';
describe('WorkshopsComponent', () => {
let component: WorkshopsComponent;
let fixture: ComponentFixture<WorkshopsComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ WorkshopsComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(WorkshopsComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

@ -0,0 +1,15 @@
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-workshops',
templateUrl: './workshops.component.html',
styleUrls: ['./workshops.component.scss']
})
export class WorkshopsComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
}

@ -1,5 +1,5 @@
import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
import { BehaviorSubject, Subject } from 'rxjs';
import {
GetCargoBikesGQL,
GetCargoBikesQuery,
@ -30,9 +30,10 @@ export type CargoBikeResult = DeepExtractTypeSkipArrays<
})
export class BikesService {
/** CargoBikes Array */
tableData: BehaviorSubject<CargoBikeResult[]> = new BehaviorSubject([]);
tableData: BehaviorSubject<CargoBikeResult[]> = new BehaviorSubject(null);
loadingRowIds: BehaviorSubject<string[]> = new BehaviorSubject([]);
pageData: BehaviorSubject<any> = new BehaviorSubject([]);
successfullyCreatedRowWithId: Subject<string> = new Subject();
pageData: BehaviorSubject<any> = new BehaviorSubject(null);
isLoadingPageData: BehaviorSubject<boolean> = new BehaviorSubject(false);
constructor(
@ -60,6 +61,7 @@ export class BikesService {
}
loadTableData() {
this.tableData.next(null);
this.getCargoBikesGQL.fetch().subscribe((result) => {
this.tableData.next(result.data.cargoBikes);
});
@ -90,10 +92,11 @@ export class BikesService {
});
}
createBike(variables: CreateCargoBikeMutationVariables) {
createBike(currentId: string, variables: CreateCargoBikeMutationVariables) {
this.createCargoBikeGQL.mutate(variables).subscribe((result) => {
const newBike = result.data.createCargoBike;
this.tableData.next([newBike, ...this.tableData.value]);
this.successfullyCreatedRowWithId.next(currentId);
});
}

@ -0,0 +1,124 @@
import { Injectable } from '@angular/core';
import { BehaviorSubject, Subject } from 'rxjs';
import {
GetEquipmentTypesGQL,
GetEquipmentTypesQueryVariables,
CreateEquipmentTypeGQL,
CreateEquipmentTypeMutationVariables,
UpdateEquipmentTypeGQL,
UpdateEquipmentTypeMutationVariables,
LockEquipmentTypeGQL,
LockEquipmentTypeMutationVariables,
UnlockEquipmentTypeGQL,
UnlockEquipmentTypeMutationVariables,
DeleteEquipmentTypeGQL,
DeleteEquipmentTypeMutationVariables,
} from '../../generated/graphql';
@Injectable({
providedIn: 'root',
})
export class EquipmentTypeService {
/** EquipmentTypes Array */
tableData: BehaviorSubject<any[]> = new BehaviorSubject(null);
loadingRowIds: BehaviorSubject<string[]> = new BehaviorSubject([]);
successfullyCreatedRowWithId: Subject<string> = new Subject();
//pageData: BehaviorSubject<any> = new BehaviorSubject([]);
//isLoadingPageData: BehaviorSubject<boolean> = new BehaviorSubject(false);
constructor(
private getEquipmentTypesGQL: GetEquipmentTypesGQL,
private createEquipmentTypeGQL: CreateEquipmentTypeGQL,
private updateEquipmentTypeGQL: UpdateEquipmentTypeGQL,
private lockEquipmentTypeGQL: LockEquipmentTypeGQL,
private unlockEquipmentTypeGQL: UnlockEquipmentTypeGQL,
private deleteEquipmentTypeGQL: DeleteEquipmentTypeGQL,
) {}
addLoadingRowId(id: string) {
this.loadingRowIds.next([...this.loadingRowIds.value, id]);
}
removeLoadingRowId(id: string) {
this.loadingRowIds.value.forEach((item, index) => {
if (item === id) {
this.loadingRowIds.value.splice(index, 1);
}
});
this.loadingRowIds.next(this.loadingRowIds.value);
}
loadTableData() {
this.tableData.next(null);
this.getEquipmentTypesGQL.fetch().subscribe((result) => {
this.tableData.next(result.data.equipmentTypes);
});
}
create(currentId: string, variables: CreateEquipmentTypeMutationVariables) {
this.createEquipmentTypeGQL.mutate(variables).subscribe((result) => {
const newRow = result.data.createEquipmentType;
this.tableData.next([newRow, ...this.tableData.value]);
this.successfullyCreatedRowWithId.next(currentId);
});
}
update(variables: UpdateEquipmentTypeMutationVariables) {
this.addLoadingRowId(variables.equipmentType.id);
this.updateEquipmentTypeGQL
.mutate(variables)
.subscribe((result) => {
this.updateDataRowFromResponse(result.data.updateEquipmentType);
})
.add(() => {
this.removeLoadingRowId(variables.equipmentType.id);
});
}
lock(variables: LockEquipmentTypeMutationVariables) {
this.addLoadingRowId(variables.id);
this.lockEquipmentTypeGQL
.mutate(variables)
.subscribe((result) => {
this.updateDataRowFromResponse(result.data.lockEquipmentType);
})
.add(() => {
this.removeLoadingRowId(variables.id);
});
}
unlock(variables: UnlockEquipmentTypeMutationVariables) {
this.addLoadingRowId(variables.id);
this.unlockEquipmentTypeGQL
.mutate(variables)
.subscribe((result) => {
this.updateDataRowFromResponse(result.data.unlockEquipmentType);
})
.add(() => {
this.removeLoadingRowId(variables.id);
});
}
delete(variables: DeleteEquipmentTypeMutationVariables) {
this.addLoadingRowId(variables.id);
this.deleteEquipmentTypeGQL
.mutate(variables)
.subscribe((result) => {
if (result.data.deleteEquipmentType) {
this.tableData.next(
[...this.tableData.value].filter((bike) => bike.id !== variables.id)
);
}
})
.add(() => {
this.removeLoadingRowId(variables.id);
});
}
private updateDataRowFromResponse(rowFromResponse: any) {
const newTableData = this.tableData.value.map((row) =>
rowFromResponse.id === row.id ? rowFromResponse : row
);
this.tableData.next(newTableData);
}
}

@ -1823,6 +1823,79 @@ export type DeleteCargoBikeMutation = (
& Pick<Mutation, 'deleteCargoBike'>
);
export type GetEquipmentTypesQueryVariables = Exact<{ [key: string]: never; }>;
export type GetEquipmentTypesQuery = (
{ __typename?: 'Query' }
& { equipmentTypes: Array<(
{ __typename?: 'EquipmentType' }
& EquipmentTypeFieldsFragment
)> }
);
export type CreateEquipmentTypeMutationVariables = Exact<{
equipmentType: EquipmentTypeCreateInput;
}>;
export type CreateEquipmentTypeMutation = (
{ __typename?: 'Mutation' }
& { createEquipmentType: (
{ __typename?: 'EquipmentType' }
& EquipmentTypeFieldsFragment
) }
);
export type UpdateEquipmentTypeMutationVariables = Exact<{
equipmentType: EquipmentTypeUpdateInput;
}>;
export type UpdateEquipmentTypeMutation = (
{ __typename?: 'Mutation' }
& { updateEquipmentType: (
{ __typename?: 'EquipmentType' }
& EquipmentTypeFieldsFragment
) }
);
export type LockEquipmentTypeMutationVariables = Exact<{
id: Scalars['ID'];
}>;
export type LockEquipmentTypeMutation = (
{ __typename?: 'Mutation' }
& { lockEquipmentType: (
{ __typename?: 'EquipmentType' }
& EquipmentTypeFieldsFragment
) }
);
export type UnlockEquipmentTypeMutationVariables = Exact<{
id: Scalars['ID'];
}>;
export type UnlockEquipmentTypeMutation = (
{ __typename?: 'Mutation' }
& { unlockEquipmentType: (
{ __typename?: 'EquipmentType' }
& EquipmentTypeFieldsFragment
) }
);
export type DeleteEquipmentTypeMutationVariables = Exact<{
id: Scalars['ID'];
}>;
export type DeleteEquipmentTypeMutation = (
{ __typename?: 'Mutation' }
& Pick<Mutation, 'deleteEquipmentType'>
);
export type AddressFieldsFragment = (
{ __typename?: 'Address' }
& Pick<Address, 'street' | 'number' | 'zip'>
@ -1865,7 +1938,7 @@ export type CargoBikeFieldsForPageFragment = (
& EquipmentFieldsForBikePageFragment
)>>>, equipmentType?: Maybe<Array<Maybe<(
{ __typename?: 'EquipmentType' }
& EquipmentTypeFieldsForBikePageFragment
& EquipmentTypeFieldsFragment
)>>>, engagement?: Maybe<Array<Maybe<(
{ __typename?: 'Engagement' }
& EngagementFieldsForBikePageFragment
@ -1928,7 +2001,7 @@ export type EquipmentFieldsForBikePageFragment = (
& Pick<Equipment, 'id' | 'serialNo' | 'title' | 'description' | 'isLocked' | 'isLockedByMe' | 'lockedBy' | 'lockedUntil'>
);
export type EquipmentTypeFieldsForBikePageFragment = (
export type EquipmentTypeFieldsFragment = (
{ __typename?: 'EquipmentType' }
& Pick<EquipmentType, 'id' | 'name' | 'description' | 'isLocked' | 'isLockedByMe' | 'lockedBy' | 'lockedUntil'>
);
@ -2218,8 +2291,8 @@ export const EquipmentFieldsForBikePageFragmentDoc = gql`
lockedUntil
}
`;
export const EquipmentTypeFieldsForBikePageFragmentDoc = gql`
fragment EquipmentTypeFieldsForBikePage on EquipmentType {
export const EquipmentTypeFieldsFragmentDoc = gql`
fragment EquipmentTypeFields on EquipmentType {
id
name
description
@ -2283,7 +2356,7 @@ export const CargoBikeFieldsForPageFragmentDoc = gql`
...EquipmentFieldsForBikePage
}
equipmentType {
...EquipmentTypeFieldsForBikePage
...EquipmentTypeFields
}
engagement {
...EngagementFieldsForBikePage
@ -2298,7 +2371,7 @@ export const CargoBikeFieldsForPageFragmentDoc = gql`
${CargoBikeFieldsForTableFragmentDoc}
${BikeEventFieldsForBikePageFragmentDoc}
${EquipmentFieldsForBikePageFragmentDoc}
${EquipmentTypeFieldsForBikePageFragmentDoc}
${EquipmentTypeFieldsFragmentDoc}
${EngagementFieldsForBikePageFragmentDoc}
${TimeFrameFieldsForBikePageFragmentDoc}`;
export const GetCargoBikesDocument = gql`
@ -2439,6 +2512,112 @@ export const DeleteCargoBikeDocument = gql`
export class DeleteCargoBikeGQL extends Apollo.Mutation<DeleteCargoBikeMutation, DeleteCargoBikeMutationVariables> {
document = DeleteCargoBikeDocument;
constructor(apollo: Apollo.Apollo) {
super(apollo);
}
}
export const GetEquipmentTypesDocument = gql`
query GetEquipmentTypes {
equipmentTypes {
...EquipmentTypeFields
}
}
${EquipmentTypeFieldsFragmentDoc}`;
@Injectable({
providedIn: 'root'
})
export class GetEquipmentTypesGQL extends Apollo.Query<GetEquipmentTypesQuery, GetEquipmentTypesQueryVariables> {
document = GetEquipmentTypesDocument;
constructor(apollo: Apollo.Apollo) {
super(apollo);
}
}
export const CreateEquipmentTypeDocument = gql`
mutation CreateEquipmentType($equipmentType: EquipmentTypeCreateInput!) {
createEquipmentType(equipmentType: $equipmentType) {
...EquipmentTypeFields
}
}
${EquipmentTypeFieldsFragmentDoc}`;
@Injectable({
providedIn: 'root'
})
export class CreateEquipmentTypeGQL extends Apollo.Mutation<CreateEquipmentTypeMutation, CreateEquipmentTypeMutationVariables> {
document = CreateEquipmentTypeDocument;
constructor(apollo: Apollo.Apollo) {
super(apollo);
}
}
export const UpdateEquipmentTypeDocument = gql`
mutation UpdateEquipmentType($equipmentType: EquipmentTypeUpdateInput!) {
updateEquipmentType(equipmentType: $equipmentType) {
...EquipmentTypeFields
}
}
${EquipmentTypeFieldsFragmentDoc}`;
@Injectable({
providedIn: 'root'
})
export class UpdateEquipmentTypeGQL extends Apollo.Mutation<UpdateEquipmentTypeMutation, UpdateEquipmentTypeMutationVariables> {
document = UpdateEquipmentTypeDocument;
constructor(apollo: Apollo.Apollo) {
super(apollo);
}
}
export const LockEquipmentTypeDocument = gql`
mutation LockEquipmentType($id: ID!) {
lockEquipmentType(id: $id) {
...EquipmentTypeFields
}
}
${EquipmentTypeFieldsFragmentDoc}`;
@Injectable({
providedIn: 'root'
})
export class LockEquipmentTypeGQL extends Apollo.Mutation<LockEquipmentTypeMutation, LockEquipmentTypeMutationVariables> {
document = LockEquipmentTypeDocument;
constructor(apollo: Apollo.Apollo) {
super(apollo);
}
}
export const UnlockEquipmentTypeDocument = gql`
mutation UnlockEquipmentType($id: ID!) {
unlockEquipmentType(id: $id) {
...EquipmentTypeFields
}
}
${EquipmentTypeFieldsFragmentDoc}`;
@Injectable({
providedIn: 'root'
})
export class UnlockEquipmentTypeGQL extends Apollo.Mutation<UnlockEquipmentTypeMutation, UnlockEquipmentTypeMutationVariables> {
document = UnlockEquipmentTypeDocument;
constructor(apollo: Apollo.Apollo) {
super(apollo);
}
}
export const DeleteEquipmentTypeDocument = gql`
mutation DeleteEquipmentType($id: ID!) {
deleteEquipmentType(id: $id)
}
`;
@Injectable({
providedIn: 'root'
})
export class DeleteEquipmentTypeGQL extends Apollo.Mutation<DeleteEquipmentTypeMutation, DeleteEquipmentTypeMutationVariables> {
document = DeleteEquipmentTypeDocument;
constructor(apollo: Apollo.Apollo) {
super(apollo);
}

Loading…
Cancel
Save