diff client/src/components/map/fairway/Profiles.vue @ 1480:9b81ac91a43e

fix: linting
author Thomas Junk <thomas.junk@intevation.de>
date Tue, 04 Dec 2018 10:02:31 +0100
parents bb47531bdd22
children cff2cf1f3038
line wrap: on
line diff
--- a/client/src/components/map/fairway/Profiles.vue	Tue Dec 04 09:56:11 2018 +0100
+++ b/client/src/components/map/fairway/Profiles.vue	Tue Dec 04 10:02:31 2018 +0100
@@ -1,5 +1,10 @@
 <template>
-  <div :class="['box ui-element rounded bg-white text-nowrap', { expanded: showProfiles }]">
+  <div
+    :class="[
+      'box ui-element rounded bg-white text-nowrap',
+      { expanded: showProfiles }
+    ]"
+  >
     <div style="width: 20rem">
       <h6 class="mb-0 py-2 px-3 border-bottom d-flex align-items-center">
         <font-awesome-icon icon="chart-area" class="mr-2"></font-awesome-icon>
@@ -10,12 +15,14 @@
           @click="$store.commit('application/showProfiles', false)"
         ></font-awesome-icon>
       </h6>
-      <div class="d-flex flex-column p-3 flex-grow-1 text-left position-relative">
+      <div
+        class="d-flex flex-column p-3 flex-grow-1 text-left position-relative"
+      >
         <div
           class="loading d-flex justify-content-center align-items-center"
           v-if="surveysLoading || profileLoading"
         >
-          <font-awesome-icon icon="spinner" spin/>
+          <font-awesome-icon icon="spinner" spin />
         </div>
         <select
           @click="moveToBottleneck"
@@ -29,7 +36,8 @@
             v-for="bn in bottlenecks"
             :key="bn.properties.name"
             :value="bn.properties.name"
-          >{{ bn.properties.name }}</option>
+            >{{ bn.properties.name }}</option
+          >
         </select>
         <div v-if="selectedBottleneck">
           <div class="d-flex mt-2">
@@ -37,60 +45,79 @@
               <small class="text-muted">
                 <translate>Sounding Result</translate>:
               </small>
-              <select v-model="selectedSurvey" class="form-control form-control-sm">
+              <select
+                v-model="selectedSurvey"
+                class="form-control form-control-sm"
+              >
                 <option
                   v-for="survey in surveys"
                   :key="survey.date_info"
                   :value="survey"
-                >{{ survey.date_info }}</option>
+                  >{{ survey.date_info }}</option
+                >
               </select>
             </div>
-            <div class="flex-fill ml-3" v-if="selectedSurvey && surveys.length > 1">
+            <div
+              class="flex-fill ml-3"
+              v-if="selectedSurvey && surveys.length > 1"
+            >
               <small class="text-muted mt-1">
                 <translate>Compare with</translate>:
               </small>
-              <select v-model="additionalSurvey" class="form-control form-control-sm">
+              <select
+                v-model="additionalSurvey"
+                class="form-control form-control-sm"
+              >
                 <option :value="null">None</option>
                 <option
                   v-for="survey in additionalSurveys"
                   :key="survey.date_info"
                   :value="survey"
-                >{{ survey.date_info }}</option>
+                  >{{ survey.date_info }}</option
+                >
               </select>
             </div>
           </div>
-          <hr class="w-100 mb-0">
+          <hr class="w-100 mb-0" />
           <small class="text-muted d-block mt-2">
             <translate>Saved cross profiles</translate>:
           </small>
           <div class="d-flex">
             <select
-              :class="['form-control form-control-sm flex-fill', { 'rounded-left-only': selectedCut }]"
+              :class="[
+                'form-control form-control-sm flex-fill',
+                { 'rounded-left-only': selectedCut }
+              ]"
               v-model="selectedCut"
             >
               <option></option>
-              <option v-for="(cut, index) in previousCuts" :value="cut" :key="index">{{ cut.label }}</option>
+              <option
+                v-for="(cut, index) in previousCuts"
+                :value="cut"
+                :key="index"
+                >{{ cut.label }}</option
+              >
             </select>
             <button
               class="btn btn-sm btn-danger input-button-right"
               @click="confirmDeleteSelectedCut = true"
               v-if="selectedCut && !confirmDeleteSelectedCut"
             >
-              <font-awesome-icon icon="trash"/>
+              <font-awesome-icon icon="trash" />
             </button>
             <button
               class="btn btn-sm btn-info rounded-0"
               @click="confirmDeleteSelectedCut = false"
               v-if="selectedCut && confirmDeleteSelectedCut"
             >
-              <font-awesome-icon icon="times"/>
+              <font-awesome-icon icon="times" />
             </button>
             <button
               class="btn btn-sm btn-danger input-button-right"
               @click="deleteSelectedCut"
               v-if="selectedCut && confirmDeleteSelectedCut"
             >
-              <font-awesome-icon icon="check"/>
+              <font-awesome-icon icon="check" />
             </button>
           </div>
           <small class="text-muted d-block mt-2">
@@ -101,31 +128,25 @@
               class="form-control form-control-sm pr-5"
               placeholder="Lat,Lon,Lat,Lon"
               v-model="coordinatesInput"
-            >
+            />
             <button
               class="btn btn-sm btn-info position-absolute input-button-right"
               @click="applyManualCoordinates"
               style="top: 0; right: 0;"
               v-if="coordinatesInputIsValid"
             >
-              <font-awesome-icon icon="check"/>
+              <font-awesome-icon icon="check" />
             </button>
           </div>
           <small class="d-flex text-left mt-2" v-if="startPoint && endPoint">
             <div class="text-nowrap mr-3">
-              <b>
-                <translate>Start</translate>:
-              </b>
-              <br>
-              Lat: {{ startPoint[1] }}
-              <br>
+              <b> <translate>Start</translate>: </b> <br />
+              Lat: {{ startPoint[1] }} <br />
               Lon: {{ startPoint[0] }}
             </div>
             <div class="text-nowrap">
-              <b>End:</b>
-              <br>
-              Lat: {{ endPoint[1] }}
-              <br>
+              <b>End:</b> <br />
+              Lat: {{ endPoint[1] }} <br />
               Lon: {{ endPoint[0] }}
             </div>
             <button
@@ -133,19 +154,29 @@
               v-clipboard:success="onCopyCoordinates"
               class="btn btn-info btn-sm ml-auto mt-auto"
             >
-              <font-awesome-icon icon="copy"/>
+              <font-awesome-icon icon="copy" />
             </button>
           </small>
           <div class="d-flex mt-3">
-            <div class="pr-3 w-50" v-if="startPoint && endPoint && !selectedCut">
-              <button class="btn btn-info btn-sm w-100" @click="showLabelInput = !showLabelInput">
-                <font-awesome-icon :icon="showLabelInput ? 'times' : 'check'"/>
+            <div
+              class="pr-3 w-50"
+              v-if="startPoint && endPoint && !selectedCut"
+            >
+              <button
+                class="btn btn-info btn-sm w-100"
+                @click="showLabelInput = !showLabelInput"
+              >
+                <font-awesome-icon :icon="showLabelInput ? 'times' : 'check'" />
                 {{ showLabelInput ? "Cancel" : "Save" }}
               </button>
             </div>
-            <div :class="startPoint && endPoint && !selectedCut ? 'w-50' : 'w-100'">
+            <div
+              :class="startPoint && endPoint && !selectedCut ? 'w-50' : 'w-100'"
+            >
               <button class="btn btn-info btn-sm w-100" @click="toggleCutTool">
-                <font-awesome-icon :icon="cutTool && cutTool.getActive() ? 'times' : 'plus'"></font-awesome-icon>
+                <font-awesome-icon
+                  :icon="cutTool && cutTool.getActive() ? 'times' : 'plus'"
+                ></font-awesome-icon>
                 {{ cutTool && cutTool.getActive() ? "Cancel" : "New" }}
               </button>
             </div>
@@ -155,14 +186,17 @@
               <translate>Enter label for cross profile</translate>:
             </small>
             <div class="position-relative">
-              <input class="form-control form-control-sm pr-5" v-model="cutLabel">
+              <input
+                class="form-control form-control-sm pr-5"
+                v-model="cutLabel"
+              />
               <button
                 class="btn btn-sm btn-info position-absolute input-button-right"
                 @click="saveCut"
                 v-if="cutLabel"
                 style="top: 0; right: 0;"
               >
-                <font-awesome-icon icon="check"/>
+                <font-awesome-icon icon="check" />
               </button>
             </div>
           </div>