changeset 4593:3632cfc44b69

client: mark diagram strings for translations(waterlevels,hydrologicalconditions)
author Fadi Abbud <fadi.abbud@intevation.de>
date Wed, 09 Oct 2019 12:44:34 +0200
parents 680f1d8802f0
children 998f4d7d9626
files client/src/components/gauge/HydrologicalConditions.vue client/src/components/gauge/Waterlevel.vue
diffstat 2 files changed, 32 insertions(+), 14 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/gauge/HydrologicalConditions.vue	Wed Oct 09 11:50:33 2019 +0200
+++ b/client/src/components/gauge/HydrologicalConditions.vue	Wed Oct 09 12:44:34 2019 +0200
@@ -18,25 +18,33 @@
           <span
             style="background-color: orange; width: 20px; height: 20px;"
           ></span>
-          Q25%
+          <span class="fix-trans-space" style="display:inline;" v-translate
+            >Q25%</span
+          >
         </div>
         <div class="legend">
           <span
             style="background-color: black; width: 20px; height: 20px;"
           ></span>
-          Median
+          <span class="fix-trans-space" style="display:inline;" v-translate
+            >Median</span
+          >
         </div>
         <div class="legend">
           <span
             style="background-color: purple; width: 20px; height: 20px;"
           ></span>
-          Q75%
+          <span class="fix-trans-space" style="display:inline;" v-translate
+            >Q75%</span
+          >
         </div>
         <div class="legend">
           <span
             style="background-color: lightsteelblue; width: 20px; height: 20px;"
           ></span>
-          Long-term Amplitude
+          <span class="fix-trans-space" style="display:inline;" v-translate
+            >Long-term Amplitude</span
+          >
         </div>
         <select
           @change="applyChange"
@@ -282,16 +290,20 @@
       this.pdf.doc.text(x + padding, y + 1, "" + this.yearCompareD);
       this.pdf.doc.setFillColor("orange");
       this.pdf.doc.circle(x, y + 5, 2, "FD");
-      this.pdf.doc.text(x + padding, y + 6, "Q25%");
+      this.pdf.doc.text(x + padding, y + 6, this.$gettext("Q25%"));
       this.pdf.doc.setFillColor("black");
       this.pdf.doc.circle(x, y + 10, 2, "FD");
-      this.pdf.doc.text(x + 3, y + 11, "Median ");
+      this.pdf.doc.text(x + 3, y + 11, this.$gettext("Median"));
       this.pdf.doc.setFillColor("purple");
       this.pdf.doc.circle(x, y + 15, 2, "FD");
-      this.pdf.doc.text(x + padding, y + 16, "Q75%");
+      this.pdf.doc.text(x + padding, y + 16, this.$gettext("Q75%"));
       this.pdf.doc.setFillColor("lightsteelblue");
       this.pdf.doc.circle(x, y + 20, 2, "FD");
-      this.pdf.doc.text(x + padding, y + 21, "Long-term Amplitude");
+      this.pdf.doc.text(
+        x + padding,
+        y + 21,
+        this.$gettext("Long-term Amplitude")
+      );
     },
     getPrintLayout(svgHeight, svgWidth) {
       return {
--- a/client/src/components/gauge/Waterlevel.vue	Wed Oct 09 11:50:33 2019 +0200
+++ b/client/src/components/gauge/Waterlevel.vue	Wed Oct 09 12:44:34 2019 +0200
@@ -12,19 +12,25 @@
           <span
             style="background-color: steelblue; width: 20px; height: 20px;"
           ></span>
-          Waterlevel
+          <span class="fix-trans-space" style="display:inline;" v-translate
+            >Waterlevel</span
+          >
         </div>
         <div class="legend">
           <span
             style="width: 8px; height: 8px; background-color: rgba(70, 130, 180, 0.6); border: solid 7px rgba(70, 130, 180, 0.2); background-clip: padding-box; box-sizing: content-box;"
           ></span>
-          Prediction
+          <span class="fix-trans-space" style="display:inline;" v-translate
+            >Prediction</span
+          >
         </div>
         <div class="legend">
           <span
             style="background-color: rgba(0, 255, 0, 0.1); width: 20px; height: 20px;"
           ></span>
-          Navigable Range
+          <span class="fix-trans-space" style="display:inline;" v-translate
+            >Navigable Range</span
+          >
         </div>
         <div>
           <select
@@ -282,16 +288,16 @@
       this.pdf.doc.setDrawColor("white");
       this.pdf.doc.setFillColor("steelblue");
       this.pdf.doc.circle(x, y, 2, "FD");
-      this.pdf.doc.text(x + padding, y + 1, "Waterlevel");
+      this.pdf.doc.text(x + padding, y + 1, this.$gettext("Waterlevel"));
       this.pdf.doc.setFillColor("#dae6f0");
       this.pdf.doc.circle(x, y + 5, 2, "FD");
       this.pdf.doc.setFillColor("#e5ffe5");
       this.pdf.doc.circle(x, y + 10, 2, "FD");
-      this.pdf.doc.text(x + padding, y + 11, "Navigable Range");
+      this.pdf.doc.text(x + padding, y + 11, this.$gettext("Navigable Range"));
       this.pdf.doc.setDrawColor("#90b4d2");
       this.pdf.doc.setFillColor("#90b4d2");
       this.pdf.doc.circle(x, y + 5, 0.6, "FD");
-      this.pdf.doc.text(x + padding, y + 6, "Prediction");
+      this.pdf.doc.text(x + padding, y + 6, this.$gettext("Prediction"));
     },
     getPrintLayout(svgHeight, svgWidth) {
       return {