1
1
import { Component , EventEmitter , Input , OnDestroy , OnInit , Output } from '@angular/core'
2
- import { FormBuilder , FormControl , FormGroup , Validators } from '@angular/forms'
2
+ import { AbstractControl , FormBuilder , FormControl , FormGroup , Validators } from '@angular/forms'
3
3
import { MatSnackBar } from '@angular/material/snack-bar'
4
4
import * as _ from 'lodash'
5
5
import { CreateMDOService } from '../../../routes/home/services/create-mdo.services'
6
6
import { ActivatedRoute } from '@angular/router'
7
7
import { LoaderService } from '../../../routes/home/services/loader.service'
8
8
import { IUploadedLogoresponse } from '../interface/interfaces'
9
+ import { debounceTime , distinctUntilChanged , takeUntil } from 'rxjs/operators'
10
+ import { Subject } from 'rxjs'
9
11
@Component ( {
10
12
selector : 'ws-app-create-organisation' ,
11
13
templateUrl : './create-organisation.component.html' ,
@@ -14,6 +16,7 @@ import { IUploadedLogoresponse } from '../interface/interfaces'
14
16
export class CreateOrganisationComponent implements OnInit , OnDestroy {
15
17
16
18
@Input ( ) rowData : any
19
+ @Input ( ) orgList : any [ ] = [ ]
17
20
@Input ( ) dropdownList : {
18
21
statesList : any [ ] ,
19
22
ministriesList : any [ ]
@@ -31,14 +34,17 @@ export class CreateOrganisationComponent implements OnInit, OnDestroy {
31
34
selectedLogo : any
32
35
selectedLogoName = ''
33
36
validFileTypes = [ 'image/png' , 'image/jpeg' , 'image/jpg' ]
34
- maxFileSize = 500 // In KB
37
+ maxFileSize = 5 // In MB
35
38
loggedInUserId = ""
36
39
isLoading = false
37
40
filteredStates : any [ ] = [ ]
38
41
filteredMinistry : any [ ] = [ ]
39
42
heirarchyObject : any
40
43
selectedLogoFile : any
41
44
uploadedLogoResponse ! : IUploadedLogoresponse
45
+ organizationNameList : string [ ] = [ ]
46
+
47
+ untilDestroyed$ = new Subject < void > ( ) ;
42
48
constructor (
43
49
private formBuilder : FormBuilder ,
44
50
private snackBar : MatSnackBar ,
@@ -56,14 +62,18 @@ export class CreateOrganisationComponent implements OnInit, OnDestroy {
56
62
if ( this . openMode === 'editMode' ) {
57
63
this . getOrganization ( this . rowData . organisation , this . rowData . type . toLowerCase ( ) )
58
64
}
65
+
66
+ this . organizationNameList = this . orgList . map ( org => org . organisation . trim ( ) . toLowerCase ( ) )
59
67
}
60
68
61
69
ngOnDestroy ( ) : void {
62
70
this . removeOverflowHidden ( )
71
+
72
+ this . untilDestroyed$ . next ( )
73
+ this . untilDestroyed$ . complete ( )
63
74
}
64
75
65
76
initialization ( ) {
66
- console . log ( this . rowData )
67
77
68
78
if ( this . dropdownList ) {
69
79
this . statesList = _ . get ( this . dropdownList , 'statesList' , [ ] )
@@ -85,6 +95,16 @@ export class CreateOrganisationComponent implements OnInit, OnDestroy {
85
95
this . valueChangeEvents ( )
86
96
}
87
97
98
+ createDuplicateOrgNameValidator ( organizationNameList : string [ ] ) {
99
+ return ( control : AbstractControl ) => {
100
+ if ( ! organizationNameList || ! control . value ) {
101
+ return null
102
+ }
103
+ const isDuplicate = organizationNameList . includes ( control . value . trim ( ) . toLowerCase ( ) )
104
+ return isDuplicate ? { duplicateOrgName : true } : null
105
+ }
106
+ }
107
+
88
108
get controls ( ) {
89
109
return this . organisationForm . controls
90
110
}
@@ -109,22 +129,36 @@ export class CreateOrganisationComponent implements OnInit, OnDestroy {
109
129
110
130
valueChangeEvents ( ) {
111
131
if ( this . organisationForm && this . organisationForm . controls . category ) {
112
- this . organisationForm . controls . category . valueChanges . subscribe ( val => {
113
- if ( val === 'state' ) {
114
- this . organisationForm . controls . state . setValidators ( [ Validators . required ] )
115
- this . organisationForm . controls . state . updateValueAndValidity ( )
116
- this . organisationForm . controls . ministry . setValue ( '' )
117
- this . organisationForm . controls . ministry . clearValidators ( )
118
- this . organisationForm . controls . ministry . updateValueAndValidity ( )
119
- } else if ( val === 'ministry' ) {
120
- this . organisationForm . controls . ministry . setValidators ( [ Validators . required ] )
121
- this . organisationForm . controls . ministry . updateValueAndValidity ( )
122
- this . organisationForm . controls . state . setValue ( '' )
123
- this . organisationForm . controls . state . clearValidators ( )
124
- this . organisationForm . controls . state . updateValueAndValidity ( )
132
+ this . organisationForm . controls . category . valueChanges
133
+ . pipe ( takeUntil ( this . untilDestroyed$ ) ) . subscribe ( val => {
134
+ if ( val === 'state' ) {
135
+ this . organisationForm . controls . state . setValidators ( [ Validators . required ] )
136
+ this . organisationForm . controls . state . updateValueAndValidity ( )
137
+ this . organisationForm . controls . ministry . setValue ( '' )
138
+ this . organisationForm . controls . ministry . clearValidators ( )
139
+ this . organisationForm . controls . ministry . updateValueAndValidity ( )
140
+ } else if ( val === 'ministry' ) {
141
+ this . organisationForm . controls . ministry . setValidators ( [ Validators . required ] )
142
+ this . organisationForm . controls . ministry . updateValueAndValidity ( )
143
+ this . organisationForm . controls . state . setValue ( '' )
144
+ this . organisationForm . controls . state . clearValidators ( )
145
+ this . organisationForm . controls . state . updateValueAndValidity ( )
146
+ }
147
+ } )
148
+ }
149
+
150
+
151
+ this . organisationForm . controls . organisationName . valueChanges
152
+ . pipe ( takeUntil ( this . untilDestroyed$ ) , debounceTime ( 500 ) , distinctUntilChanged ( ) )
153
+ . subscribe ( ( _value ) => {
154
+ const control = this . organisationForm . controls . organisationName
155
+ const error = this . createDuplicateOrgNameValidator ( this . organizationNameList ) ( control )
156
+ if ( error ) {
157
+ control . setErrors ( error )
158
+ } else {
159
+ control . setErrors ( null )
125
160
}
126
161
} )
127
- }
128
162
}
129
163
130
164
get getCategory ( ) {
@@ -216,15 +250,15 @@ export class CreateOrganisationComponent implements OnInit, OnDestroy {
216
250
if ( input . files ?. length ) {
217
251
this . selectedLogoFile = input . files [ 0 ]
218
252
this . selectedLogoName = this . selectedLogoFile . name
219
- const maxFileSize = this . maxFileSize * 1024
253
+ const maxFileSize = this . maxFileSize * 1024 * 1024
220
254
221
255
if ( ! this . validFileTypes . includes ( this . selectedLogoFile . type ) ) {
222
256
this . snackBar . open ( 'Invalid file type' , 'X' , { panelClass : [ 'error' ] } )
223
257
return
224
258
}
225
259
226
260
if ( this . selectedLogoFile . size > maxFileSize ) {
227
- this . snackBar . open ( `File size exceeds ${ this . maxFileSize } KB . Please select a smaller file.` , 'X' , { panelClass : [ 'error' ] } )
261
+ this . snackBar . open ( `File size exceeds ${ this . maxFileSize } MB . Please select a smaller file.` , 'X' , { panelClass : [ 'error' ] } )
228
262
return
229
263
}
230
264
this . uploadOrganizationLogo ( )
0 commit comments