Просмотр исходного кода

changed data download form layout

kunickyd 3 лет назад
Родитель
Сommit
691c259462

+ 26 - 15
src/app/shared/nav-bar/components/data-download/data-download-popup.component.html

@@ -2,9 +2,13 @@
           [baseZIndex]="10000" [className]="'popup-form'">
 
   <form [formGroup]="downloadForm">
-    <div class="input-group form-group">
-      <div class="input-group-prepend">
-        <span class="input-group-text"><i class="fas fa-file-signature"></i></span>
+
+    <div>
+      
+      <div class="input-group form-group">
+        <div class="input-group-prepend">
+          <span class="input-group-text"><i class="fas fa-file-signature"></i></span>
+        </div>
         <select formControlName="sensor_id" id="sensor_id">
           <option value="null" disabled>Select sensor</option>
           <option *ngFor="let s of sensors; let i = index" [value]="sensors[i].sensorId">
@@ -12,24 +16,31 @@
           </option>
         </select>
       </div>
-    </div>
-    <div class="input-group form-group">
-      <div class="input-group-prepend">
-        <span class="input-group-text"><i class="far fa-calendar-alt"></i>From</span>
+
+      <div class="input-group form-group">
+        <div class="input-group-prepend">
+          <span class="input-group-text"><i class="far fa-calendar-alt"></i>From</span>          
+        </div>      
         <p-calendar [monthNavigator]="true" [yearNavigator]="true" yearRange="2000:2021" dateFormat="d. m. yy" inputId="navigators" formControlName="from"></p-calendar>
       </div>
-    </div>
-    <div class="input-group form-group">
-      <div class="input-group-prepend">
-        <span class="input-group-text"><i class="far fa-calendar-alt"></i>To</span>
+
+      <div class="input-group form-group">
+        <div class="input-group-prepend">
+          <span class="input-group-text"><i class="far fa-calendar-alt"></i>To</span>         
+        </div>
         <p-calendar [monthNavigator]="true" [yearNavigator]="true" yearRange="2000:2021" dateFormat="d. m. yy" inputId="navigators" formControlName="to"></p-calendar>
       </div>
+
+      <p-listbox [options]="units" formControlName="selectedUnits" [metaKeySelection]="false" [checkbox]="true" [filter]="true" filterPlaceHolder="Search and select units"
+                 optionLabel="description" optionValue="unitId"
+                 emptyFilterMessage="No units for specified filter" [multiple]="true" [listStyle]="{'max-height':'250px'}" [style]="{'width':'100%'}">
+      </p-listbox>
+
     </div>
-    <p-listbox [options]="units" formControlName="selectedUnits" [metaKeySelection]="false" [checkbox]="true" [filter]="true" filterPlaceHolder="Search and select units"
-               optionLabel="description" optionValue="unitId"
-               emptyFilterMessage="No units for specified filter" [multiple]="true" [listStyle]="{'max-height':'250px'}" [style]="{'width':'100%'}">
-    </p-listbox>
+
+  
   </form>
+
   <div *ngIf="inProgress" class="download-progress">Export in progress<p-progressBar mode="indeterminate" [style]="{'height': '6px'}"></p-progressBar></div>
   <p-footer>
     <div class="row">