# HG changeset patch
# User Thomas Junk <thomas.junk@intevation.de>
# Date 1549625422 -3600
# Node ID a08e0f532304221da761f99ad512a7aaf5f6a979
# Parent  cdd68f555ad754646ecadea4131af62513c89a3b
staging: improve UI

diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/Bottlenecks.vue
--- a/client/src/components/Bottlenecks.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/Bottlenecks.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -71,12 +71,14 @@
             v-if="bottleneck.properties.current"
           >
             <font-awesome-icon
+              class="pointer"
               icon="spinner"
               fixed-width
               spin
               v-if="loading === bottleneck.properties.name"
             ></font-awesome-icon>
             <font-awesome-icon
+              class="pointer"
               icon="angle-down"
               fixed-width
               v-if="
@@ -85,6 +87,7 @@
               "
             ></font-awesome-icon>
             <font-awesome-icon
+              class="pointer"
               icon="angle-up"
               fixed-width
               v-if="
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/Contextbox.vue
--- a/client/src/components/Contextbox.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/Contextbox.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -1,7 +1,7 @@
 <template>
   <div :class="style">
     <div @click="close" class="ui-element close-contextbox text-muted">
-      <font-awesome-icon icon="times"></font-awesome-icon>
+      <font-awesome-icon icon="times" class="pointer"></font-awesome-icon>
     </div>
     <Bottlenecks v-if="contextBoxContent === 'bottlenecks'"></Bottlenecks>
     <Staging v-if="contextBoxContent === 'staging'"></Staging>
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/ImportApprovedGaugeMeasurement.vue
--- a/client/src/components/ImportApprovedGaugeMeasurement.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/ImportApprovedGaugeMeasurement.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -22,7 +22,7 @@
                   class="custom-file-input"
                   id="uploadFile"
                 />
-                <label class="custom-file-label" for="uploadFile">
+                <label class="pointer custom-file-label" for="uploadFile">
                   {{ uploadLabel }}
                 </label>
               </div>
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/ImportSoundingresults.vue
--- a/client/src/components/ImportSoundingresults.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/ImportSoundingresults.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -104,7 +104,7 @@
                 class="custom-file-input"
                 id="uploadFile"
               />
-              <label class="custom-file-label" for="uploadFile">
+              <label class="pointer custom-file-label" for="uploadFile">
                 {{ uploadLabel }}
               </label>
             </div>
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/ImportStretches.vue
--- a/client/src/components/ImportStretches.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/ImportStretches.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -41,6 +41,7 @@
             <td>{{ stretch.properties["source_organization"] }}</td>
             <td>
               <font-awesome-icon
+                class="pointer"
                 @click="editStretch(index)"
                 icon="pencil-alt"
                 fixed-width
@@ -48,6 +49,7 @@
             </td>
             <td>
               <font-awesome-icon
+                class="pointer"
                 @click="deleteStretch(index)"
                 icon="trash"
                 fixed-width
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/ImportWaterwayProfiles.vue
--- a/client/src/components/ImportWaterwayProfiles.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/ImportWaterwayProfiles.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -79,7 +79,7 @@
                   class="custom-file-input"
                   id="uploadFile"
                 />
-                <label class="custom-file-label" for="uploadFile">
+                <label class="pointer custom-file-label" for="uploadFile">
                   {{ uploadLabel }}
                 </label>
               </div>
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/Pdftool.vue
--- a/client/src/components/Pdftool.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/Pdftool.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -11,7 +11,7 @@
         <translate>Generate PDF</translate>
         <font-awesome-icon
           icon="times"
-          class="ml-auto text-muted"
+          class="ml-auto text-muted pointer"
           @click="$store.commit('application/showPdfTool', false)"
         ></font-awesome-icon>
       </h6>
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/fairway/Fairwayprofile.vue
--- a/client/src/components/fairway/Fairwayprofile.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/fairway/Fairwayprofile.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -12,7 +12,7 @@
       @click="$store.dispatch('fairwayprofile/clearSelection')"
       v-if="showSplitscreen"
     >
-      <font-awesome-icon icon="times" />
+      <font-awesome-icon icon="times" class="pointer" />
     </button>
     <div class="profile bg-white position-relative d-flex flex-column">
       <h5
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/fairway/Infobar.vue
--- a/client/src/components/fairway/Infobar.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/fairway/Infobar.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -11,13 +11,13 @@
         class="p-2 border-left d-flex align-items-center"
         @click="$store.commit('application/showSplitscreen', true)"
       >
-        <font-awesome-icon icon="angle-up"></font-awesome-icon>
+        <font-awesome-icon class="pointer" icon="angle-up"></font-awesome-icon>
       </span>
       <span
         class="p-2 border-left d-flex align-items-center"
         @click="$store.dispatch('fairwayprofile/clearSelection')"
       >
-        <font-awesome-icon icon="times"></font-awesome-icon>
+        <font-awesome-icon icon="times" class="pointer"></font-awesome-icon>
       </span>
     </div>
   </div>
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/fairway/Profiles.vue
--- a/client/src/components/fairway/Profiles.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/fairway/Profiles.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -11,7 +11,7 @@
         <translate>Profiles</translate>
         <font-awesome-icon
           icon="times"
-          class="ml-auto text-muted"
+          class="ml-auto text-muted pointer"
           @click="$store.commit('application/showProfiles', false)"
         ></font-awesome-icon>
       </h6>
@@ -110,7 +110,7 @@
               @click="confirmDeleteSelectedCut = false"
               v-if="selectedCut && confirmDeleteSelectedCut"
             >
-              <font-awesome-icon icon="times" />
+              <font-awesome-icon icon="times" class="pointer" />
             </button>
             <button
               class="btn btn-sm btn-danger input-button-right"
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/importqueue/Importqueuedetail.vue
--- a/client/src/components/importqueue/Importqueuedetail.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/importqueue/Importqueuedetail.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -23,16 +23,19 @@
       </div>
       <div @click="showDetails(job.id)" class="mt-1 text-info detailsbutton">
         <font-awesome-icon
+          class="pointer"
           v-if="show"
           icon="angle-up"
           fixed-width
         ></font-awesome-icon>
         <font-awesome-icon
+          class="pointer"
           v-if="loading"
           icon="spinner"
           fixed-width
         ></font-awesome-icon>
         <font-awesome-icon
+          class="pointer"
           v-if="!show && !loading"
           icon="angle-down"
           fixed-width
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/importschedule/Importscheduledetail.vue
--- a/client/src/components/importschedule/Importscheduledetail.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/importschedule/Importscheduledetail.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -9,7 +9,7 @@
       >
         {{ dialogLabel }}
         <span @click="closeDetailview" class="closebutton">
-          <font-awesome-icon icon="times"></font-awesome-icon>
+          <font-awesome-icon icon="times" class="pointer"></font-awesome-icon>
         </span>
       </h6>
       <div class="card-body">
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/layers/Layers.vue
--- a/client/src/components/layers/Layers.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/layers/Layers.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -11,7 +11,7 @@
         ><translate>Layers</translate>
         <font-awesome-icon
           icon="times"
-          class="ml-auto text-muted"
+          class="ml-auto text-muted pointer"
           @click="$store.commit('application/showLayers', false)"
         ></font-awesome-icon>
       </h6>
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/layers/Layerselect.vue
--- a/client/src/components/layers/Layerselect.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/layers/Layerselect.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -12,9 +12,11 @@
         :layername="layername"
         :layerindex="layerindex"
       ></LegendElement>
-      <label class="layername form-check-label" @click="visibilityToggled">{{
-        layername
-      }}</label>
+      <label
+        class="pointer layername form-check-label"
+        @click="visibilityToggled"
+        >{{ layername }}</label
+      >
     </div>
     <div v-if="isVisible && layername == 'Bottleneck isolines'">
       <img class="rounded my-1 d-block" :src="isolinesLegendImgDataURL" />
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/staging/StagingDetail.vue
--- a/client/src/components/staging/StagingDetail.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/staging/StagingDetail.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -4,7 +4,7 @@
       <div class="mt-auto d-flex flex-row mb-auto small name text-left">
         <a
           v-if="isSoundingResult(data.kind.toUpperCase())"
-          class="text-left pointer"
+          class="text-left"
           @click="zoomTo()"
           href="#"
           >{{ data.summary.bottleneck }}</a
@@ -16,20 +16,20 @@
         >
         <a
           v-if="isApprovedGaugeMeasurement(data.kind.toUpperCase())"
-          class="text-left pointer"
+          class="text-left"
           ><translate>Approved Gauge Measurements</translate> ({{
             data.summary.length
           }})</a
         >
         <span
-          class="text-left pointer"
+          class="text-left"
           v-if="isFairwayDimension(data.kind.toUpperCase())"
           >{{ data.summary["source-organization"] }} (LOS:
           {{ data.summary.los }})</span
         >
         <a
           href="#"
-          class="text-left pointer"
+          class="text-left"
           @click="zoomToStretch(data.summary.stretch)"
           v-if="isStretch(data.kind.toUpperCase())"
           >{{ data.summary.stretch }}</a
@@ -75,25 +75,27 @@
             }"
             @click="toggleApproval(data.id, $options.STATES.REJECTED)"
           >
-            <font-awesome-icon icon="times"></font-awesome-icon>
+            <font-awesome-icon icon="times" class="pointer"></font-awesome-icon>
           </button>
         </div>
         <div v-if="isBottleneck(data.kind.toUpperCase())">
-          <div
-            @click="showDetails()"
-            class="mt-auto mb-auto text-info text-left"
-          >
+          <div class="mt-auto mb-auto text-info text-left">
             <font-awesome-icon
+              class="pointer"
+              @click="showDetails()"
               v-if="show"
               icon="angle-up"
               fixed-width
             ></font-awesome-icon>
             <font-awesome-icon
+              class="pointer"
+              @click="showDetails()"
               v-if="loading"
               icon="spinner"
               fixed-width
             ></font-awesome-icon>
             <font-awesome-icon
+              class="pointer"
               v-if="!show && !loading"
               icon="angle-down"
               fixed-width
@@ -106,11 +108,13 @@
             class="mt-auto mb-auto text-info text-left"
           >
             <font-awesome-icon
+              class="pointer"
               v-if="showAGMDetails"
               icon="angle-up"
               fixed-width
             ></font-awesome-icon>
             <font-awesome-icon
+              class="pointer"
               v-if="!showAGMDetails"
               icon="angle-down"
               fixed-width
@@ -136,11 +140,13 @@
               class="small mt-auto mb-auto text-info text-left"
             >
               <font-awesome-icon
+                class="pointer"
                 v-if="showBottleneckDetails"
                 icon="angle-up"
                 fixed-width
               ></font-awesome-icon>
               <font-awesome-icon
+                class="pointer"
                 v-if="!showBottleneckDetails"
                 icon="angle-down"
                 fixed-width
@@ -175,15 +181,32 @@
         >
       </div>
       <div v-for="(result, index) in data.summary" :key="index">
-        <div class="pl-3 d-flex flex-row">
+        <div @click="toggleDiff(index)" class="pl-3 d-flex flex-row">
           <span class="condensed agmcode text-left">{{
             result["fk-gauge-id"]
           }}</span>
           <span class="condensed agmdetail text-left">{{
             formatSurveyDate(result["measure-date"])
           }}</span>
+          <div
+            @click="showBottleneckDetails = !showBottleneckDetails"
+            class="small ml-auto mt-auto mb-auto text-info text-left"
+          >
+            <font-awesome-icon
+              class="pointer"
+              v-if="showDiff == index"
+              icon="angle-up"
+              fixed-width
+            ></font-awesome-icon>
+            <font-awesome-icon
+              class="pointer"
+              v-if="showDiff != index"
+              icon="angle-down"
+              fixed-width
+            ></font-awesome-icon>
+          </div>
         </div>
-        <div class="pl-3 d-flex flex-row">
+        <div v-if="showDiff == index" class="pl-3 d-flex flex-row">
           <div>
             <div
               class="d-flex flex-row condensed pl-3 text-left"
@@ -234,6 +257,7 @@
   props: ["data"],
   data() {
     return {
+      showDiff: -1,
       showAGMDetails: false,
       showBottleneckDetails: false,
       show: false,
@@ -272,6 +296,13 @@
     }
   },
   methods: {
+    toggleDiff(number) {
+      if (this.showDiff == -1) {
+        this.showDiff = number;
+      } else {
+        this.showDiff = -1;
+      }
+    },
     zoomToStretch(name) {
       this.$store.commit("map/setLayerVisible", LAYERS.STRETCHES);
       this.$store
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/toolbar/Toolbar.vue
--- a/client/src/components/toolbar/Toolbar.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/toolbar/Toolbar.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -6,18 +6,19 @@
           (expandToolbar ? 'expanded' : 'collapsed')
       "
     >
-      <Identify></Identify>
-      <Layers></Layers>
-      <Profiles></Profiles>
-      <Linetool></Linetool>
-      <Polygontool></Polygontool>
-      <Pdftool></Pdftool>
+      <Identify class="pointer"></Identify>
+      <Layers class="pointer"></Layers>
+      <Profiles class="pointer"></Profiles>
+      <Linetool class="pointer"></Linetool>
+      <Polygontool class="pointer"></Polygontool>
+      <Pdftool class="pointer"></Pdftool>
     </div>
     <div
       @click="$store.commit('application/expandToolbar', !expandToolbar)"
       class="toolbar-button toolbar-toggle rounded-bottom bg-info text-white"
     >
       <font-awesome-icon
+        class="pointer"
         :icon="expandToolbar ? 'angle-up' : 'angle-down'"
       ></font-awesome-icon>
     </div>
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/usermanagement/Userdetail.vue
--- a/client/src/components/usermanagement/Userdetail.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/usermanagement/Userdetail.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -5,7 +5,7 @@
     >
       {{ this.cardHeader }}
       <span @click="closeDetailview" class="closebutton">
-        <font-awesome-icon icon="times"></font-awesome-icon>
+        <font-awesome-icon icon="times" class="pointer"></font-awesome-icon>
       </span>
     </h6>
     <div class="card-body">
diff -r cdd68f555ad7 -r a08e0f532304 client/src/components/usermanagement/Usermanagement.vue
--- a/client/src/components/usermanagement/Usermanagement.vue	Fri Feb 08 12:11:15 2019 +0100
+++ b/client/src/components/usermanagement/Usermanagement.vue	Fri Feb 08 12:30:22 2019 +0100
@@ -124,7 +124,7 @@
           <translate>Delete user</translate>
           <font-awesome-icon
             icon="times"
-            class="ml-auto text-muted"
+            class="ml-auto text-muted pointer"
             @click="showDeleteUserPrompt = false"
           ></font-awesome-icon>
         </h6>