Merge pull request #326 from laughing0li/master

AUS-4071 Status report should appear when user clicks on warning tria…
AuScope · Jan 15, 2024 · ff7e15a · ff7e15a
2 parents 0540a88 + d2c6a82
commit ff7e15a
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 7 deletions.
diff --git a/src/app/menupanel/activelayers/activelayerspanel.component.html b/src/app/menupanel/activelayers/activelayerspanel.component.html
@@ -8,25 +8,25 @@
         </div>
         <div class="activeLayerContent">
             <div>
-                <u style="cursor:pointer;" (click)="openStatusReport(getUILayerModel(layer.id)); $event.stopPropagation();">{{ layer.name }}
+                <u>{{ layer.name }}
                     <span *ngIf="getUILayerModel(layer.id).statusMap.getRenderStarted()" class="float-right project-percentage hasEvent light-blue">
                         <i *ngIf="!getUILayerModel(layer.id).statusMap.getRenderComplete()" class="fa fa-spin fa-spinner"></i>
                         <i *ngIf="getUILayerModel(layer.id).statusMap.getContainsError()" class="fa fa-warning text-warning"></i>
                     </span>
                 </u>
                 <i *ngIf="getUILayerModel(layer.id).statusMap.getRenderStarted()" class="fa fa-trash float-right red layerLoadClickable" (click)="removeLayer(layer);$event.stopPropagation()"></i>
             </div>
-            <div *ngIf="(showOpacitySlider(layer) && getUILayerModel(layer.id).statusMap.getRenderStarted()) || hasLegend(layer)" class="opacity-slider-panel d-flex" (click)="$event.stopPropagation()">
+            <div style="clear: right" *ngIf="(showOpacitySlider(layer) && getUILayerModel(layer.id).statusMap.getRenderStarted()) || hasLegend(layer)" class="opacity-slider-panel d-flex" (click)="$event.stopPropagation()">
                 <div class="opacity-label">Opacity {{ getUILayerModel(layer.id).opacity }}%&nbsp;</div>
-                <mat-slider class="opacity-slider" min="0" max="100" class="opacity-slider flex-grow-1" (input)="layerOpacityChangeValue($event, layer)">
+                <mat-slider class="opacity-slider" min="0" max="100"  (input)="layerOpacityChangeValue($event, layer)">
                     <input matSliderThumb
                         [(ngModel)]="getUILayerModel(layer.id).opacity">
                 </mat-slider>
-                <div *ngIf="hasLegend(layer)">
-                    <button class="btn btn-primary btn-sm pull-right" style="margin-left:5px;margin-top:6px;font-size:0.8rem;padding:0 2px;" [disabled]="isLegendShown(layer.id)" (click)="showLegend(layer)">Legend</button>
+                <div style="display: flex;" *ngIf="hasLegend(layer)">
+                    <button class="btn btn-primary btn-sm legend"  [disabled]="isLegendShown(layer.id)" (click)="showLegend(layer)">Legend</button>
+                    <button class="btn btn-primary btn-sm status"  (click)="openStatusReport(getUILayerModel(layer.id)); $event.stopPropagation();">Status</button>
                 </div>
-            </div>
-            <div class="split-panel" *ngIf="getShowSplitMapButtons(layer)" (click)="$event.stopPropagation()">
+            </div>            <div class="split-panel" *ngIf="getShowSplitMapButtons(layer)" (click)="$event.stopPropagation()">
                 Split Direction&nbsp;
                 <div *ngIf="getApplicableSplitLayer(layer)" class="split-button-panel">
                     <button [className]="getLayerSplitDirection(layer.id) === 'left' ? 'btn btn-split btn-primary' : 'btn btn-split btn-warning'" (click)="setLayerSplitDirection($event, layer, 'left')">Left</button>

diff --git a/src/app/menupanel/activelayers/activelayerspanel.component.scss b/src/app/menupanel/activelayers/activelayerspanel.component.scss
@@ -49,4 +49,15 @@
 
 .cdk-drop-list-dragging {
   cursor: grabbing;
+}
+
+u {
+  text-decoration: none;
+}
+
+.legend, .status {
+  font-size: 0.8rem;
+  padding: 0 2px;
+  margin-left: 12px;
+  margin-top:6px;
 }