Add edit contact information functionallity on lendingStations

pull/6/head
Max Ehrlicher-Schmidt 4 years ago
parent 169c0bbc58
commit 4aae9c8ff5

@ -62,7 +62,7 @@ import { EquipmentComponent } from './pages/tables/equipment/equipment.component
import { TimeFramesComponent } from './pages/tables/time-frames/time-frames.component'; import { TimeFramesComponent } from './pages/tables/time-frames/time-frames.component';
import { NumberRangeCellComponent } from './components/tableComponents/number-range-cell/number-range-cell.component'; import { NumberRangeCellComponent } from './components/tableComponents/number-range-cell/number-range-cell.component';
import { DateRangeCellComponent } from './components/tableComponents/date-range-cell/date-range-cell.component'; import { DateRangeCellComponent } from './components/tableComponents/date-range-cell/date-range-cell.component';
import { SelectObjectDialogComponent } from './components/tableComponents/select-object-dialog/select-object-dialog.component'; import { SelectObjectDialogComponent } from './components/select-object-dialog/select-object-dialog.component';
import { AutocompleteSelectComponent } from './components/autocomplete-select/autocomplete-select.component'; import { AutocompleteSelectComponent } from './components/autocomplete-select/autocomplete-select.component';
import { LendingStationComponent } from './pages/dataPages/lending-station/lending-station.component'; import { LendingStationComponent } from './pages/dataPages/lending-station/lending-station.component';

@ -14,7 +14,16 @@
</h1> </h1>
<ng-container *ngFor="let object of propertiesInfo"> <ng-container *ngFor="let object of propertiesInfo">
<mat-card class="inline-card" *ngIf="object.type === 'Group'"> <mat-card class="inline-card" *ngIf="object.type === 'Group'">
<mat-card-title>{{ object.title }}</mat-card-title> <mat-card-title
>{{ object.title }}
<button
mat-button
*ngIf="data.isLockedByMe && object.possibleObjects"
(click)="openSelectObjectDialog(object)"
>
<mat-icon>expand_more</mat-icon>
</button>
</mat-card-title>
<ng-container *ngFor="let prop of object.properties"> <ng-container *ngFor="let prop of object.properties">
<app-cell <app-cell
*ngIf="prop.type !== 'NumRange'" *ngIf="prop.type !== 'NumRange'"

@ -6,10 +6,12 @@ import {
OnInit, OnInit,
Output, Output,
} from '@angular/core'; } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { ActivatedRoute } from '@angular/router'; import { ActivatedRoute } from '@angular/router';
import { deepen } from 'src/app/helperFunctions/deepenObject'; import { deepen } from 'src/app/helperFunctions/deepenObject';
import { flatten } from 'src/app/helperFunctions/flattenObject'; import { flatten } from 'src/app/helperFunctions/flattenObject';
import { SchemaService } from 'src/app/services/schema.service'; import { SchemaService } from 'src/app/services/schema.service';
import { SelectObjectDialogComponent } from '../select-object-dialog/select-object-dialog.component';
interface PropertyTypeInfo { interface PropertyTypeInfo {
dataPath: string; dataPath: string;
@ -76,7 +78,8 @@ export class DataPageComponent implements OnInit, OnDestroy {
constructor( constructor(
private route: ActivatedRoute, private route: ActivatedRoute,
private schemaService: SchemaService private schemaService: SchemaService,
public dialog: MatDialog,
) {} ) {}
ngOnInit(): void { ngOnInit(): void {
@ -170,6 +173,27 @@ export class DataPageComponent implements OnInit, OnDestroy {
this.cancelEvent.emit(deepen(this.data)); this.cancelEvent.emit(deepen(this.data));
} }
openSelectObjectDialog(object: any) {
const dialogRef = this.dialog.open(SelectObjectDialogComponent, {
width: 'auto',
autoFocus: false,
data: {
nameToShowInSelection: object.nameToShowInSelection,
currentlySelectedObjectId: object.currentlySelectedObjectId(this.data),
possibleObjects: object.possibleObjects,
},
});
dialogRef.afterClosed().subscribe((selectedObject) => {
if (selectedObject) {
this.data[object.propertyNameOfReferenceId] = selectedObject.id
const newObjectFlattened = flatten(selectedObject);
for(const newProperty in newObjectFlattened) {
this.data[object.propertyPrefixToOverwrite + '.' + newProperty ] = newObjectFlattened[newProperty];
}
}
});
}
addReferenceIdsToObject(ids: string[], object) { addReferenceIdsToObject(ids: string[], object) {
this.data[object.propertyNameOfUpdateInput] = ids; this.data[object.propertyNameOfUpdateInput] = ids;
} }

@ -1,6 +1,5 @@
import { Component, Inject, OnInit } from '@angular/core'; import { Component, Inject, OnInit } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { DeleteConfirmationDialog } from '../../table/table.component';
@Component({ @Component({
selector: 'app-select-object-dialog', selector: 'app-select-object-dialog',
@ -9,11 +8,9 @@ import { DeleteConfirmationDialog } from '../../table/table.component';
}) })
export class SelectObjectDialogComponent implements OnInit { export class SelectObjectDialogComponent implements OnInit {
constructor( constructor(
public dialogRef: MatDialogRef<DeleteConfirmationDialog>, public dialogRef: MatDialogRef<any>,
@Inject(MAT_DIALOG_DATA) public data: any @Inject(MAT_DIALOG_DATA) public data: any
) { ) {}
console.log(this.data);
}
ngOnInit(): void {} ngOnInit(): void {}
@ -24,13 +21,13 @@ export class SelectObjectDialogComponent implements OnInit {
getSelectedObject() { getSelectedObject() {
return this.data.possibleObjects.find( return this.data.possibleObjects.find(
(object) => object.id === this.data.currentlySelectedObjectId (object) => object.id === this.data.currentlySelectedObjectId
) );
} }
getSelectedObjectName() { getSelectedObjectName() {
const selectedObject = this.getSelectedObject(); const selectedObject = this.getSelectedObject();
if (!selectedObject) { if (!selectedObject) {
return ""; return '';
} }
return this.data.nameToShowInSelection(selectedObject); return this.data.nameToShowInSelection(selectedObject);
} }

@ -20,8 +20,7 @@ import { MatDialog, MatDialogRef } from '@angular/material/dialog';
import { ActivatedRoute } from '@angular/router'; import { ActivatedRoute } from '@angular/router';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { debounceTime } from 'rxjs/internal/operators/debounceTime'; import { debounceTime } from 'rxjs/internal/operators/debounceTime';
import { type } from 'os'; import { SelectObjectDialogComponent } from '../select-object-dialog/select-object-dialog.component';
import { SelectObjectDialogComponent } from '../tableComponents/select-object-dialog/select-object-dialog.component';
@Component({ @Component({
selector: 'app-table', selector: 'app-table',

@ -0,0 +1,33 @@
query GetContactInformation {
contactInformation {
...ContactInformationFields
}
}
mutation CreateContactInformation($contactInformation: ContactInformationCreateInput!) {
createContactInformation(contactInformation: $contactInformation) {
...ContactInformationFields
}
}
mutation UpdateContactInformation($contactInformation: ContactInformationUpdateInput!) {
updateContactInformation(contactInformation: $contactInformation) {
...ContactInformationFields
}
}
mutation LockContactInformation($id: ID!) {
lockContactInformation(id: $id) {
...ContactInformationFields
}
}
mutation UnlockContactInformation($id: ID!) {
unlockContactInformation(id: $id) #{
#add this: ...ContactInformationFields
# }
}
mutation DeleteContactInformation($id: ID!) {
deleteContactInformation(id: $id)
}

@ -9,3 +9,11 @@ fragment ContactInformationFieldsGeneral on ContactInformation {
email2 email2
note note
} }
fragment ContactInformationFields on ContactInformation {
...ContactInformationFieldsGeneral
isLocked
isLockedByMe
isLockedByMe
lockedUntil
}

@ -1,5 +1,6 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { LendingStationsService } from 'src/app/services/lending-stations.service'; import { LendingStationsService } from 'src/app/services/lending-stations.service';
import { ContactInformationService } from 'src/app/services/contactInformation.service';
@Component({ @Component({
selector: 'app-lending-station', selector: 'app-lending-station',
@ -33,6 +34,23 @@ export class LendingStationComponent implements OnInit {
{ {
type: 'Group', type: 'Group',
title: 'Kontaktinformationen intern', title: 'Kontaktinformationen intern',
possibleObjects: [],
nameToShowInSelection: (contact) => {
return (
contact.person.firstName +
' ' +
contact.person.name +
' ' +
contact.email +
' ' +
contact.phone
);
},
propertyPrefixToOverwrite: 'contactInformationIntern',
currentlySelectedObjectId: (station) => {
return station['contactInformationIntern.id'];
},
propertyNameOfReferenceId: 'contactInformationInternId',
properties: [ properties: [
{ {
dataPath: 'contactInformationIntern.person.firstName', dataPath: 'contactInformationIntern.person.firstName',
@ -58,6 +76,23 @@ export class LendingStationComponent implements OnInit {
{ {
type: 'Group', type: 'Group',
title: 'Kontaktinformationen extern', title: 'Kontaktinformationen extern',
possibleObjects: [],
nameToShowInSelection: (contact) => {
return (
contact.person.firstName +
' ' +
contact.person.name +
' ' +
contact.email +
' ' +
contact.phone
);
},
propertyPrefixToOverwrite: 'contactInformationExtern',
currentlySelectedObjectId: (station) => {
return station['contactInformationExtern.id'];
},
propertyNameOfReferenceId: 'contactInformationExternId',
properties: [ properties: [
{ {
dataPath: 'contactInformationExtern.person.firstName', dataPath: 'contactInformationExtern.person.firstName',
@ -124,10 +159,23 @@ export class LendingStationComponent implements OnInit {
dataService: any; dataService: any;
constructor(private lendingStationsService: LendingStationsService) { constructor(
private lendingStationsService: LendingStationsService,
private contactInformationService: ContactInformationService
) {
/*this.propertiesInfo.find( /*this.propertiesInfo.find(
(prop) => prop.dataPath === 'equipmentType' (prop) => prop.dataPath === 'equipmentType'
).dataService = this.equipmentTypeService;*/ ).dataService = this.equipmentTypeService;*/
this.contactInformationService.loadTableData();
this.contactInformationService.tableData.subscribe((data) => {
this.propertiesInfo.find(
(prop) => prop.propertyPrefixToOverwrite === 'contactInformationIntern'
).possibleObjects = data;
this.propertiesInfo.find(
(prop) => prop.propertyPrefixToOverwrite === 'contactInformationExtern'
).possibleObjects = data;
});
} }
ngOnInit(): void { ngOnInit(): void {

@ -0,0 +1,128 @@
import { Injectable } from '@angular/core';
import { BehaviorSubject, Subject } from 'rxjs';
import {
GetContactInformationGQL,
UpdateContactInformationGQL,
UpdateContactInformationMutationVariables,
LockContactInformationGQL,
LockContactInformationMutationVariables,
UnlockContactInformationGQL,
UnlockContactInformationMutationVariables,
CreateContactInformationGQL,
CreateContactInformationMutationVariables,
DeleteContactInformationGQL,
DeleteContactInformationMutationVariables,
} from '../../generated/graphql';
@Injectable({
providedIn: 'root',
})
export class ContactInformationService {
/** ContactInformation Array */
tableData: BehaviorSubject<any[]> = new BehaviorSubject(null);
loadingRowIds: BehaviorSubject<string[]> = new BehaviorSubject([]);
successfullyCreatedRowWithId: Subject<string> = new Subject();
pageData: BehaviorSubject<any> = new BehaviorSubject(null);
isLoadingPageData: BehaviorSubject<boolean> = new BehaviorSubject(false);
constructor(
private getContactInformationGQL: GetContactInformationGQL,
private updateContactInformationGQL: UpdateContactInformationGQL,
private lockContactInformationGQL: LockContactInformationGQL,
private unlockContactInformationGQL: UnlockContactInformationGQL,
private createContactInformationGQL: CreateContactInformationGQL,
private deleteContactInformationGQL: DeleteContactInformationGQL
) {}
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.getContactInformationGQL.fetch().subscribe((result) => {
this.tableData.next(result.data?.contactInformation);
});
}
createContactInformation(currentId: string, variables: CreateContactInformationMutationVariables) {
this.createContactInformationGQL.mutate(variables).subscribe((result) => {
const newContactInformation = result.data.createContactInformation;
this.tableData.next([newContactInformation, ...this.tableData.value]);
this.successfullyCreatedRowWithId.next(currentId);
});
}
updateContactInformation(variables: UpdateContactInformationMutationVariables) {
this.addLoadingRowId(variables.contactInformation.id);
this.updateContactInformationGQL
.mutate(variables)
.subscribe((result) => {
this.updateDataRowFromResponse(result.data.updateContactInformation);
})
.add(() => {
this.removeLoadingRowId(variables.contactInformation.id);
});
}
lockContactInformation(variables: LockContactInformationMutationVariables) {
this.addLoadingRowId(variables.id);
this.lockContactInformationGQL
.mutate(variables)
.subscribe((result) => {
this.updateDataRowFromResponse(result.data.lockContactInformation);
})
.add(() => {
this.removeLoadingRowId(variables.id);
});
}
unlockContactInformation(variables: UnlockContactInformationMutationVariables) {
this.addLoadingRowId(variables.id);
this.unlockContactInformationGQL
.mutate(variables)
.subscribe((result) => {
this.updateDataRowFromResponse(result.data.unlockContactInformation);
})
.add(() => {
this.removeLoadingRowId(variables.id);
});
}
deleteContactInformation(variables: DeleteContactInformationMutationVariables) {
this.addLoadingRowId(variables.id);
this.deleteContactInformationGQL
.mutate(variables)
.subscribe((result) => {
if (result.data) {
this.tableData.next(
[...this.tableData.value].filter((contactInformation) => contactInformation.id !== variables.id)
);
}
})
.add(() => {
this.removeLoadingRowId(variables.id);
});
}
private updateDataRowFromResponse(rowFromResponse: any) {
if (this.tableData.value) {
const newTableData = this.tableData.value.map((row) =>
rowFromResponse.id === row.id ? rowFromResponse : row
);
this.tableData.next(newTableData);
}
if (rowFromResponse.id === this.pageData?.value?.id) {
this.pageData.next(rowFromResponse);
}
}
}

@ -1844,6 +1844,58 @@ export type DeleteCargoBikeMutationVariables = Exact<{
export type DeleteCargoBikeMutation = { __typename?: 'Mutation', deleteCargoBike: boolean }; export type DeleteCargoBikeMutation = { __typename?: 'Mutation', deleteCargoBike: boolean };
export type GetContactInformationQueryVariables = Exact<{ [key: string]: never; }>;
export type GetContactInformationQuery = { __typename?: 'Query', contactInformation: Array<(
{ __typename?: 'ContactInformation' }
& ContactInformationFieldsFragment
)> };
export type CreateContactInformationMutationVariables = Exact<{
contactInformation: ContactInformationCreateInput;
}>;
export type CreateContactInformationMutation = { __typename?: 'Mutation', createContactInformation: (
{ __typename?: 'ContactInformation' }
& ContactInformationFieldsFragment
) };
export type UpdateContactInformationMutationVariables = Exact<{
contactInformation: ContactInformationUpdateInput;
}>;
export type UpdateContactInformationMutation = { __typename?: 'Mutation', updateContactInformation: (
{ __typename?: 'ContactInformation' }
& ContactInformationFieldsFragment
) };
export type LockContactInformationMutationVariables = Exact<{
id: Scalars['ID'];
}>;
export type LockContactInformationMutation = { __typename?: 'Mutation', lockContactInformation: (
{ __typename?: 'ContactInformation' }
& ContactInformationFieldsFragment
) };
export type UnlockContactInformationMutationVariables = Exact<{
id: Scalars['ID'];
}>;
export type UnlockContactInformationMutation = { __typename?: 'Mutation', unlockContactInformation: boolean };
export type DeleteContactInformationMutationVariables = Exact<{
id: Scalars['ID'];
}>;
export type DeleteContactInformationMutation = { __typename?: 'Mutation', deleteContactInformation: boolean };
export type GetEquipmentsQueryVariables = Exact<{ [key: string]: never; }>; export type GetEquipmentsQueryVariables = Exact<{ [key: string]: never; }>;
@ -2002,6 +2054,11 @@ export type ContactInformationFieldsGeneralFragment = { __typename?: 'ContactInf
& PersonFieldsGeneralFragment & PersonFieldsGeneralFragment
) }; ) };
export type ContactInformationFieldsFragment = (
{ __typename?: 'ContactInformation', isLocked: boolean, isLockedByMe: boolean, lockedUntil?: Maybe<any> }
& ContactInformationFieldsGeneralFragment
);
export type EngagementFieldsForBikePageFragment = { __typename?: 'Engagement', id: string, isLocked: boolean, isLockedByMe: boolean, lockedBy?: Maybe<string>, lockedUntil?: Maybe<any>, engagementType: ( export type EngagementFieldsForBikePageFragment = { __typename?: 'Engagement', id: string, isLocked: boolean, isLockedByMe: boolean, lockedBy?: Maybe<string>, lockedUntil?: Maybe<any>, engagementType: (
{ __typename?: 'EngagementType' } { __typename?: 'EngagementType' }
& EngagementTypeFieldsFragment & EngagementTypeFieldsFragment
@ -2514,6 +2571,15 @@ ${EquipmentFieldsForBikePageFragmentDoc}
${EquipmentTypeFieldsFragmentDoc} ${EquipmentTypeFieldsFragmentDoc}
${EngagementFieldsForBikePageFragmentDoc} ${EngagementFieldsForBikePageFragmentDoc}
${TimeFrameFieldsForBikePageFragmentDoc}`; ${TimeFrameFieldsForBikePageFragmentDoc}`;
export const ContactInformationFieldsFragmentDoc = gql`
fragment ContactInformationFields on ContactInformation {
...ContactInformationFieldsGeneral
isLocked
isLockedByMe
isLockedByMe
lockedUntil
}
${ContactInformationFieldsGeneralFragmentDoc}`;
export const EquipmentFieldsForTableFragmentDoc = gql` export const EquipmentFieldsForTableFragmentDoc = gql`
fragment EquipmentFieldsForTable on Equipment { fragment EquipmentFieldsForTable on Equipment {
id id
@ -2741,6 +2807,110 @@ export const DeleteCargoBikeDocument = gql`
export class DeleteCargoBikeGQL extends Apollo.Mutation<DeleteCargoBikeMutation, DeleteCargoBikeMutationVariables> { export class DeleteCargoBikeGQL extends Apollo.Mutation<DeleteCargoBikeMutation, DeleteCargoBikeMutationVariables> {
document = DeleteCargoBikeDocument; document = DeleteCargoBikeDocument;
constructor(apollo: Apollo.Apollo) {
super(apollo);
}
}
export const GetContactInformationDocument = gql`
query GetContactInformation {
contactInformation {
...ContactInformationFields
}
}
${ContactInformationFieldsFragmentDoc}`;
@Injectable({
providedIn: 'root'
})
export class GetContactInformationGQL extends Apollo.Query<GetContactInformationQuery, GetContactInformationQueryVariables> {
document = GetContactInformationDocument;
constructor(apollo: Apollo.Apollo) {
super(apollo);
}
}
export const CreateContactInformationDocument = gql`
mutation CreateContactInformation($contactInformation: ContactInformationCreateInput!) {
createContactInformation(contactInformation: $contactInformation) {
...ContactInformationFields
}
}
${ContactInformationFieldsFragmentDoc}`;
@Injectable({
providedIn: 'root'
})
export class CreateContactInformationGQL extends Apollo.Mutation<CreateContactInformationMutation, CreateContactInformationMutationVariables> {
document = CreateContactInformationDocument;
constructor(apollo: Apollo.Apollo) {
super(apollo);
}
}
export const UpdateContactInformationDocument = gql`
mutation UpdateContactInformation($contactInformation: ContactInformationUpdateInput!) {
updateContactInformation(contactInformation: $contactInformation) {
...ContactInformationFields
}
}
${ContactInformationFieldsFragmentDoc}`;
@Injectable({
providedIn: 'root'
})
export class UpdateContactInformationGQL extends Apollo.Mutation<UpdateContactInformationMutation, UpdateContactInformationMutationVariables> {
document = UpdateContactInformationDocument;
constructor(apollo: Apollo.Apollo) {
super(apollo);
}
}
export const LockContactInformationDocument = gql`
mutation LockContactInformation($id: ID!) {
lockContactInformation(id: $id) {
...ContactInformationFields
}
}
${ContactInformationFieldsFragmentDoc}`;
@Injectable({
providedIn: 'root'
})
export class LockContactInformationGQL extends Apollo.Mutation<LockContactInformationMutation, LockContactInformationMutationVariables> {
document = LockContactInformationDocument;
constructor(apollo: Apollo.Apollo) {
super(apollo);
}
}
export const UnlockContactInformationDocument = gql`
mutation UnlockContactInformation($id: ID!) {
unlockContactInformation(id: $id)
}
`;
@Injectable({
providedIn: 'root'
})
export class UnlockContactInformationGQL extends Apollo.Mutation<UnlockContactInformationMutation, UnlockContactInformationMutationVariables> {
document = UnlockContactInformationDocument;
constructor(apollo: Apollo.Apollo) {
super(apollo);
}
}
export const DeleteContactInformationDocument = gql`
mutation DeleteContactInformation($id: ID!) {
deleteContactInformation(id: $id)
}
`;
@Injectable({
providedIn: 'root'
})
export class DeleteContactInformationGQL extends Apollo.Mutation<DeleteContactInformationMutation, DeleteContactInformationMutationVariables> {
document = DeleteContactInformationDocument;
constructor(apollo: Apollo.Apollo) { constructor(apollo: Apollo.Apollo) {
super(apollo); super(apollo);
} }

Loading…
Cancel
Save