create a selectbox in between-date searchType with 3 items (null, not null,...

create a selectbox in between-date searchType with 3 items (null, not null, Bw), desable dateRange input when null or not null are chosen

client/src/app/instance/search/components/criteria/search-type/between-date.component.html

 <form [formGroup]="form" novalidate>
     <div class="row form-group">
         <div class="col-md-3 col-sm-auto pr-sm-1 mb-1 mb-sm-0">
-            <div class="operator_readonly">BW</div>
+           <select class="custom-select" (change)="labelOnChange($event.target.value)">
+               <option [value]="">Bw</option>
+               <option [value]="'nl'">Null</option>
+               <option [value]="'nnl'">Not Null</option>
+           </select>
         </div>
         <div class="w-100 d-block d-sm-none"></div>
         <div class="col pl-sm-1">

client/src/app/instance/search/components/criteria/search-type/between-date.component.ts

@@ -11,13 +11,18 @@ import { Criterion, BetweenCriterion } from 'src/app/instance/store/models';
 export class BetweenDateComponent extends AbstractSearchTypeComponent {
     constructor() {
         super();
+        // dateRange is desabled when the user select null or not null
+       if(! this.nullOrNotNull){
         this.form = new FormGroup({
-            dateRange: new FormControl('', [Validators.required])
+            dateRange: new FormControl('', [Validators.required]),
         });
+       }
     }
 
     setCriterion(criterion: Criterion) {
         super.setCriterion(criterion);
+
+
         if (criterion) {
             const betweenCriterion = criterion as BetweenCriterion;
             this.form.controls.dateRange.setValue([
@@ -26,7 +31,7 @@ export class BetweenDateComponent extends AbstractSearchTypeComponent {
             ]);
         }
     }
-    
+
     /**
      * Return new criterion
      *
@@ -51,6 +56,15 @@ export class BetweenDateComponent extends AbstractSearchTypeComponent {
      *
      * @return string
      */
+    labelOnChange(value: string) {
+        if (value === 'nl' || value === 'nnl') {
+            this.nullOrNotNull = value;
+            this.form.controls.dateRange.disable();
+        } else {
+            this.form.controls.dateRange.enable();
+        }
+    }
+
     getDateString(date: Date): string {
         const month = ('0' + (date.getMonth() + 1)).slice(-2);
         const day = ('0' + (date.getDate())).slice(-2);