From 0067bb9f3cca1925ed7de259c1731e79a2918545 Mon Sep 17 00:00:00 2001 From: Max Ehrlicher-Schmidt Date: Tue, 10 Nov 2020 17:35:35 +0100 Subject: [PATCH] Add cell types --- src/app/app.module.ts | 5 +- .../tableComponents/cell/cell.component.html | 41 ++++- .../tableComponents/cell/cell.component.scss | 4 + .../tableComponents/cell/cell.component.ts | 6 +- src/app/graphqlOperations/bikes.graphql | 2 + .../fragments/bikeFragment.graphql | 6 +- .../fragments/introspection.graphql | 8 + .../pages/tables/bikes/bikes.component.html | 43 +++++ src/app/pages/tables/bikes/bikes.component.ts | 9 +- src/app/services/bikes.service.ts | 5 +- src/generated/graphql.ts | 155 +++++++++++++++--- 11 files changed, 250 insertions(+), 34 deletions(-) create mode 100644 src/app/graphqlOperations/fragments/introspection.graphql diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 3928f73..ea6649b 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -22,6 +22,8 @@ import { MatCheckboxModule } from '@angular/material/checkbox'; import {MatCardModule} from '@angular/material/card'; import {MatGridListModule} from '@angular/material/grid-list'; import {MatTooltipModule} from '@angular/material/tooltip'; +import {MatSelectModule} from '@angular/material/select'; + import { AppRoutingModule } from './app-routing.module'; @@ -72,7 +74,8 @@ import { NavService }from './components/menu-list-item/nav.service'; MatCheckboxModule, GraphQLModule, DragDropModule, - MatTooltipModule + MatTooltipModule, + MatSelectModule, ], providers: [NavService], bootstrap: [AppComponent], diff --git a/src/app/components/tableComponents/cell/cell.component.html b/src/app/components/tableComponents/cell/cell.component.html index 72bde49..349ce5f 100644 --- a/src/app/components/tableComponents/cell/cell.component.html +++ b/src/app/components/tableComponents/cell/cell.component.html @@ -1,6 +1,35 @@ - - - - - {{ value }} - +
+ +
+ +
+ + + + {{ option }} + + + + + {{ value }} + +
+ +
+ + + + + {{ value }} + +
diff --git a/src/app/components/tableComponents/cell/cell.component.scss b/src/app/components/tableComponents/cell/cell.component.scss index e69de29..8f011b5 100644 --- a/src/app/components/tableComponents/cell/cell.component.scss +++ b/src/app/components/tableComponents/cell/cell.component.scss @@ -0,0 +1,4 @@ +::ng-deep.mat-form-field-infix { + width: auto !important; + min-width: 50px !important; +} \ No newline at end of file diff --git a/src/app/components/tableComponents/cell/cell.component.ts b/src/app/components/tableComponents/cell/cell.component.ts index 420f71a..8f210bd 100644 --- a/src/app/components/tableComponents/cell/cell.component.ts +++ b/src/app/components/tableComponents/cell/cell.component.ts @@ -8,12 +8,14 @@ import { catchError } from 'rxjs/operators'; }) export class CellComponent { @Input() - value: number | string; - @Output() valueChange = new EventEmitter(); + value: number | string | boolean; + @Output() valueChange = new EventEmitter(); @Input() editable = false; @Input() inputType = 'text'; + @Input() + enumValues: string[] = []; change(newValue) { this.value = this.inputType === 'number' ? +newValue : newValue; diff --git a/src/app/graphqlOperations/bikes.graphql b/src/app/graphqlOperations/bikes.graphql index 05b0c3b..2a78581 100644 --- a/src/app/graphqlOperations/bikes.graphql +++ b/src/app/graphqlOperations/bikes.graphql @@ -1,5 +1,7 @@ query GetCargoBikes { + ...Introspection cargoBikes(limit: 100, offset: 0) { ...CargoBikeFields + } } diff --git a/src/app/graphqlOperations/fragments/bikeFragment.graphql b/src/app/graphqlOperations/fragments/bikeFragment.graphql index b1f9e76..49a0aa4 100644 --- a/src/app/graphqlOperations/fragments/bikeFragment.graphql +++ b/src/app/graphqlOperations/fragments/bikeFragment.graphql @@ -57,9 +57,6 @@ fragment CargoBikeFieldsMutable on CargoBike { projectAllowance notes } - lendingStation { - ...LendingStationFieldsGeneral - } taxes { costCenter organisationArea @@ -71,6 +68,9 @@ fragment CargoBikeFields on CargoBike { provider { ...ProviderFieldsGeneral } + lendingStation { + ...LendingStationFieldsGeneral + } isLocked isLockedByMe lockedBy diff --git a/src/app/graphqlOperations/fragments/introspection.graphql b/src/app/graphqlOperations/fragments/introspection.graphql new file mode 100644 index 0000000..6bcadee --- /dev/null +++ b/src/app/graphqlOperations/fragments/introspection.graphql @@ -0,0 +1,8 @@ +fragment Introspection on Query { + __type(name: "Group") { + name + enumValues { + name + } + } +} diff --git a/src/app/pages/tables/bikes/bikes.component.html b/src/app/pages/tables/bikes/bikes.component.html index a3e8b3d..08fd065 100644 --- a/src/app/pages/tables/bikes/bikes.component.html +++ b/src/app/pages/tables/bikes/bikes.component.html @@ -64,6 +64,21 @@ {{ element.id }} + + + + Gruppe + + + + + + @@ -77,6 +92,20 @@ + + + + Für Kinder + + + + + + @@ -105,6 +134,20 @@ + + + + Für Lasten + + + + + + diff --git a/src/app/pages/tables/bikes/bikes.component.ts b/src/app/pages/tables/bikes/bikes.component.ts index 503c136..8cf6dd6 100644 --- a/src/app/pages/tables/bikes/bikes.component.ts +++ b/src/app/pages/tables/bikes/bikes.component.ts @@ -25,13 +25,17 @@ export class BikesComponent { 'select', 'name', 'id', + 'group', 'frameNumber', + 'forChildren', 'numberOfChildren', 'numberOfWheels', + 'forCargo', 'buttons', ]; bikes = >[]; + groupEnum: string[] = []; selection = new SelectionModel(true, []); reloadingTable = false; @@ -40,6 +44,10 @@ export class BikesComponent { relockingDuration = 1000 * 60 * 1; constructor(private bikesService: BikesService) { + bikesService.groupEnum.subscribe(groupEnum => { + this.groupEnum = groupEnum; + }) + bikesService.bikes.subscribe((bikes) => { this.reloadingTable = false; this.bikes = bikes.map((bike) => { @@ -68,7 +76,6 @@ export class BikesComponent { } reloadTable() { - console.log("reload") this.reloadingTable = true; this.bikesService.loadBikes(); } diff --git a/src/app/services/bikes.service.ts b/src/app/services/bikes.service.ts index 3d9d25c..659f972 100644 --- a/src/app/services/bikes.service.ts +++ b/src/app/services/bikes.service.ts @@ -24,6 +24,7 @@ export type CargoBikeResult = DeepExtractTypeSkipArrays< }) export class BikesService { bikes: BehaviorSubject = new BehaviorSubject([]); + groupEnum: BehaviorSubject = new BehaviorSubject([]); constructor( private getCargoBikesGQL: GetCargoBikesGQL, @@ -36,6 +37,8 @@ export class BikesService { loadBikes() { this.getCargoBikesGQL.fetch().subscribe((result) => { this.bikes.next(result.data.cargoBikes); + let enumValues = result.data.__type.enumValues.map(value => value.name); + this.groupEnum.next(enumValues); }); } @@ -72,7 +75,7 @@ export class BikesService { }) } - unlockBike(variables: LockCargoBikeMutationVariables) { + unlockBike(variables: UnlockCargoBikeMutationVariables) { this.unlockCargoBikeGQL.mutate(variables).subscribe((result) => { const unlockedBike = result.data.unlockCargoBike; this.bikes.next( diff --git a/src/generated/graphql.ts b/src/generated/graphql.ts index cab7988..2db4516 100644 --- a/src/generated/graphql.ts +++ b/src/generated/graphql.ts @@ -1668,6 +1668,95 @@ export enum CacheControlScope { } +/** + * The fundamental unit of any GraphQL Schema is the type. There are many kinds of types in GraphQL as represented by the `__TypeKind` enum. + * + * Depending on the kind of a type, certain fields describe information about that type. Scalar types provide no information beyond a name, description and optional `specifiedByUrl`, while Enum types provide their values. Object and Interface types provide the fields they describe. Abstract types, Union and Interface, provide the Object types possible at runtime. List and NonNull types compose other types. + */ +export type __Type = { + __typename?: '__Type'; + kind: __TypeKind; + name?: Maybe; + description?: Maybe; + specifiedByUrl?: Maybe; + fields?: Maybe>; + interfaces?: Maybe>; + possibleTypes?: Maybe>; + enumValues?: Maybe>; + inputFields?: Maybe>; + ofType?: Maybe<__Type>; +}; + + +/** + * The fundamental unit of any GraphQL Schema is the type. There are many kinds of types in GraphQL as represented by the `__TypeKind` enum. + * + * Depending on the kind of a type, certain fields describe information about that type. Scalar types provide no information beyond a name, description and optional `specifiedByUrl`, while Enum types provide their values. Object and Interface types provide the fields they describe. Abstract types, Union and Interface, provide the Object types possible at runtime. List and NonNull types compose other types. + */ +export type __TypeFieldsArgs = { + includeDeprecated?: Maybe; +}; + + +/** + * The fundamental unit of any GraphQL Schema is the type. There are many kinds of types in GraphQL as represented by the `__TypeKind` enum. + * + * Depending on the kind of a type, certain fields describe information about that type. Scalar types provide no information beyond a name, description and optional `specifiedByUrl`, while Enum types provide their values. Object and Interface types provide the fields they describe. Abstract types, Union and Interface, provide the Object types possible at runtime. List and NonNull types compose other types. + */ +export type __TypeEnumValuesArgs = { + includeDeprecated?: Maybe; +}; + +/** An enum describing what kind of type a given `__Type` is. */ +export enum __TypeKind { + /** Indicates this type is a scalar. */ + Scalar = 'SCALAR', + /** Indicates this type is an object. `fields` and `interfaces` are valid fields. */ + Object = 'OBJECT', + /** Indicates this type is an interface. `fields`, `interfaces`, and `possibleTypes` are valid fields. */ + Interface = 'INTERFACE', + /** Indicates this type is a union. `possibleTypes` is a valid field. */ + Union = 'UNION', + /** Indicates this type is an enum. `enumValues` is a valid field. */ + Enum = 'ENUM', + /** Indicates this type is an input object. `inputFields` is a valid field. */ + InputObject = 'INPUT_OBJECT', + /** Indicates this type is a list. `ofType` is a valid field. */ + List = 'LIST', + /** Indicates this type is a non-null. `ofType` is a valid field. */ + NonNull = 'NON_NULL' +} + +/** Object and Interface types are described by a list of Fields, each of which has a name, potentially a list of arguments, and a return type. */ +export type __Field = { + __typename?: '__Field'; + name: Scalars['String']; + description?: Maybe; + args: Array<__InputValue>; + type: __Type; + isDeprecated: Scalars['Boolean']; + deprecationReason?: Maybe; +}; + +/** Arguments provided to Fields or Directives and the input fields of an InputObject are represented as Input Values which describe their type and optionally a default value. */ +export type __InputValue = { + __typename?: '__InputValue'; + name: Scalars['String']; + description?: Maybe; + type: __Type; + /** A GraphQL-formatted string representing the default value for this input value. */ + defaultValue?: Maybe; +}; + +/** One possible value for a given Enum. Enum values are unique values, not a placeholder for a string or numeric value. However an Enum value is returned in a JSON response as a string. */ +export type __EnumValue = { + __typename?: '__EnumValue'; + name: Scalars['String']; + description?: Maybe; + isDeprecated: Scalars['Boolean']; + deprecationReason?: Maybe; +}; + export type GetCargoBikeByIdQueryVariables = Exact<{ id: Scalars['ID']; }>; @@ -1729,6 +1818,7 @@ export type GetCargoBikesQuery = ( { __typename?: 'CargoBike' } & CargoBikeFieldsFragment )>> } + & IntrospectionFragment ); export type BikeEventFieldsFragment = ( @@ -1758,9 +1848,6 @@ export type CargoBikeFieldsMutableFragment = ( ), technicalEquipment?: Maybe<( { __typename?: 'TechnicalEquipment' } & Pick - )>, lendingStation?: Maybe<( - { __typename?: 'LendingStation' } - & LendingStationFieldsGeneralFragment )>, taxes?: Maybe<( { __typename?: 'Taxes' } & Pick @@ -1773,10 +1860,25 @@ export type CargoBikeFieldsFragment = ( & { provider?: Maybe<( { __typename?: 'Provider' } & ProviderFieldsGeneralFragment + )>, lendingStation?: Maybe<( + { __typename?: 'LendingStation' } + & LendingStationFieldsGeneralFragment )> } & CargoBikeFieldsMutableFragment ); +export type IntrospectionFragment = ( + { __typename?: 'Query' } + & { __type?: Maybe<( + { __typename?: '__Type' } + & Pick<__Type, 'name'> + & { enumValues?: Maybe + )>> } + )> } +); + export type LendingStationFieldsGeneralFragment = ( { __typename?: 'LendingStation' } & Pick @@ -1818,17 +1920,6 @@ export const BikeEventFieldsFragmentDoc = gql` } } `; -export const LendingStationFieldsGeneralFragmentDoc = gql` - fragment LendingStationFieldsGeneral on LendingStation { - id - name - address { - number - street - zip - } -} - `; export const CargoBikeFieldsMutableFragmentDoc = gql` fragment CargoBikeFieldsMutable on CargoBike { id @@ -1908,15 +1999,12 @@ export const CargoBikeFieldsMutableFragmentDoc = gql` projectAllowance notes } - lendingStation { - ...LendingStationFieldsGeneral - } taxes { costCenter organisationArea } } - ${LendingStationFieldsGeneralFragmentDoc}`; + `; export const ProviderFieldsGeneralFragmentDoc = gql` fragment ProviderFieldsGeneral on Provider { id @@ -1934,19 +2022,44 @@ export const ProviderFieldsGeneralFragmentDoc = gql` } } `; +export const LendingStationFieldsGeneralFragmentDoc = gql` + fragment LendingStationFieldsGeneral on LendingStation { + id + name + address { + number + street + zip + } +} + `; export const CargoBikeFieldsFragmentDoc = gql` fragment CargoBikeFields on CargoBike { ...CargoBikeFieldsMutable provider { ...ProviderFieldsGeneral } + lendingStation { + ...LendingStationFieldsGeneral + } isLocked isLockedByMe lockedBy lockedUntil } ${CargoBikeFieldsMutableFragmentDoc} -${ProviderFieldsGeneralFragmentDoc}`; +${ProviderFieldsGeneralFragmentDoc} +${LendingStationFieldsGeneralFragmentDoc}`; +export const IntrospectionFragmentDoc = gql` + fragment Introspection on Query { + __type(name: "Group") { + name + enumValues { + name + } + } +} + `; export const GetCargoBikeByIdDocument = gql` query GetCargoBikeById($id: ID!) { cargoBikeById(id: $id) { @@ -2021,11 +2134,13 @@ export const UnlockCargoBikeDocument = gql` } export const GetCargoBikesDocument = gql` query GetCargoBikes { + ...Introspection cargoBikes(limit: 100, offset: 0) { ...CargoBikeFields } } - ${CargoBikeFieldsFragmentDoc}`; + ${IntrospectionFragmentDoc} +${CargoBikeFieldsFragmentDoc}`; @Injectable({ providedIn: 'root'