Merge branch 'dev'

package.json

@@ -1,6 +1,6 @@
 {
   "name": "beep-ui",
-  "version": "4.0.10",
+  "version": "4.0.11",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production vue-cli-service build",

src/components/svg/svg-category.vue

@@ -42,7 +42,7 @@ export default {
       // if page nr is too high (i.e. if nextPage was called but no items are printed afterwards, such that the svg contains 1 empty page)
       // set the max page nr as pagenr - 1 (in the svg the last page will then be omitted)
       if (
-        (this.absoluteY - this.maxRowHeight) / this.pageHeight <
+        (this.absoluteY + this.maxRowHeight) / this.pageHeight <
         this.svgPageNr - 1
       ) {
         setTimeout(() => {

src/components/svg/svg-checkbox.vue

@@ -2,6 +2,7 @@
   <rect
     data-type="checkbox"
     :data-category-id="categoryId"
+    :data-label="label"
     :data-parent-category-id="parentId"
     :x="x"
     :y="y"
@@ -32,6 +33,11 @@ export default {
       required: false,
       default: null,
     },
+    label: {
+      type: String,
+      required: false,
+      default: '',
+    },
     parentId: {
       type: [String, Number],
       required: false,

src/components/svg/svg-fieldset.vue

@@ -158,10 +158,7 @@ export default {
         if (fullRowItem || this.svgColumnCounter >= this.columnsPerRow) {
           var columnCounter = 1
           // for new row, set Y (height so far) as previous Y + row height of previous row
-          this.$store.commit(
-            'inspections/setY',
-            this.svgY + this.svgRowHeight - (fullRowItem ? 1 : 0)
-          )
+          this.$store.commit('inspections/setY', this.svgY + this.svgRowHeight)
           // reset row height to current item height for new row
           this.$store.commit('inspections/setRowHeight', itemHeight)
         } else {

src/components/svg/svg-label.vue

@@ -1,16 +1,19 @@
 <template>
   <g>
     <text :x="x + 'mm'" :y="y + 'mm'" :style="svgLabel">
-      {{ label.substring(0, maxLabelLength) }}
+      {{
+        label.substring(0, maxLabelLength) +
+          (label.length > maxLabelLength ? '...' : '')
+      }}
     </text>
-    <text
+    <!-- <text
       v-if="label.length > maxLabelLength"
       :x="x + 'mm'"
       :y="y + 2 + 'mm'"
       :style="svgLabel"
     >
       {{ label.substring(maxLabelLength) }}
-    </text>
+    </text> -->
   </g>
 </template>
 
@@ -36,7 +39,7 @@ export default {
   },
   data() {
     return {
-      maxLabelLength: 34,
+      maxLabelLength: 32,
     }
   },
 }

src/components/svg/svg-number-box.vue

@@ -17,7 +17,7 @@
 import { svgData } from '@mixins/svgMixin'
 
 export default {
-  // TODO remove whole component if single-digits won't be used for sure
+  // TODO remove whole component if single-digits won't be used for sure, else add :data-label="label" + label prop
   mixins: [svgData],
   props: {
     x: {

src/components/svg/svg-number.vue

@@ -10,6 +10,7 @@
       <rect
         :data-type="inputType === 'date' ? 'text' : 'number'"
         :data-category-id="inputType === 'date' ? 'date-field' : ''"
+        :data-label="label"
         :data-parent-category-id="position.id"
         :x="x + prependOffset + 'mm'"
         :y="y + 2 + 'mm'"

src/components/svg/svg-print-corners.vue

@@ -6,7 +6,7 @@
         :y="(pageNumber - 1) * pageHeight + 9 + 'mm'"
         :style="svgTextSmall"
       >
-        {{ checklistHeaderText }}
+        {{ checklistHeaderText + ' - p.' + pageNumber + ' / ' + totalPages }}
       </text>
 
       <text
@@ -18,6 +18,7 @@
       </text>
       <rect
         data-type="number"
+        data-label="Print ID"
         :data-parent-category-id="'svgid'"
         :x="pageWidth - (xMargin + 37) + 'mm'"
         :y="(pageNumber - 1) * pageHeight + 7.5 + 'mm'"
@@ -34,8 +35,16 @@
       >
         {{ checklistSvgId }}
       </text>
+      <text
+        :x="pageWidth - (xMargin + 18.8) + 'mm'"
+        :y="(pageNumber - 1) * pageHeight + 7 + 'mm'"
+        :style="svgLabel"
+      >
+        {{ 'Page' }}
+      </text>
       <rect
         data-type="number"
+        data-label="Page"
         :data-parent-category-id="'pagenr'"
         :data-category-id="pageNumber"
         :x="pageWidth - (xMargin + 18.8) + 'mm'"
@@ -53,13 +62,6 @@
       >
         {{ pageNumber }}
       </text>
-      <text
-        :x="pageWidth - (xMargin + 9) + 'mm'"
-        :y="(pageNumber - 1) * pageHeight + 9 + 'mm'"
-        :style="svgTextSmall"
-      >
-        {{ 'p.' + pageNumber + ' / ' + totalPages }}
-      </text>
     </g>
 
     <g class="A">

src/components/svg/svg-select.vue

@@ -11,6 +11,7 @@
           :x="x + item.depth * checkBoxSpace + 'mm'"
           :y="y + 2 + index * checkBoxSpace + 'mm'"
           :category-id="item.id"
+          :label="label"
           :parent-id="item.parent_id"
         />
         <text
@@ -29,6 +30,7 @@
     <g v-else-if="flattenedItems.length > maxNrOfItems">
       <rect
         data-type="text"
+        :data-label="label"
         :data-parent-category-id="position.id"
         :x="x + 'mm'"
         :y="y + 2 + 'mm'"
@@ -52,6 +54,7 @@
           :key="'stc-' + stars"
           :x="x + 'mm'"
           :category-id="'stars'"
+          :label="label"
           :parent-id="position.id"
           :y="y + 2 + index * checkBoxSpace + 'mm'"
         />
@@ -81,6 +84,7 @@
           :x="x + 'mm'"
           :y="y + 2 + index * checkBoxSpace + 'mm'"
           :category-id="'score'"
+          :label="label"
           :parent-id="position.id"
         />
         <text

src/components/svg/svg-text.vue

@@ -42,6 +42,7 @@
     <rect
       v-else-if="!line && !textOnly"
       data-type="text"
+      :data-label="label"
       :data-parent-category-id="position.id"
       :x="x + 'mm'"
       :y="y + 2 + 'mm'"
@@ -55,6 +56,7 @@
     <rect
       v-else-if="line && !textOnly"
       data-type="text"
+      :data-label="label"
       :data-parent-category-id="position.id"
       :x="x + 'mm'"
       :y="y + 2 + 'mm'"

src/mixins/svgMixin.js

@@ -38,14 +38,14 @@ export const svgData = {
       yMargin: 15,
       pageHeight: 296.82,
       pageWidth: 210,
-      maxRowHeight: 40, // 41
+      maxRowHeight: 42.6, // 41
       headerHeight: 6.5,
       numberBoxWidth: 4.65,
       numberBoxHeight: 8,
       numberFields: 3,
       spaceWidth: 3,
       inputHeight: {
-        label: 4,
+        label: 6.7,
         select_item: 5,
         date: 32,
         grade: 23,
@@ -96,8 +96,8 @@ export const svgStyles = {
       colorGreyDark: '#242424; ',
       fontSize: 'font: 3.8mm ',
       fontSizeHeader: 'font: 600 4mm ',
-      fontSizeHeaderSmall: 'font: 600 2.8mm ',
-      fontSizeSmall: 'font: 2.8mm ',
+      fontSizeHeaderSmall: 'font: 600 2.7mm ',
+      fontSizeSmall: 'font: 2.7mm ',
       fontSizeLarge: 'font: 5mm ',
       fontFamily: 'Helvetica, Arial, sans-serif; ',
     }

src/router/views/new.vue

@@ -2,7 +2,7 @@
   <Layout :title="$t('Whats_new')">
     <v-container>
       <div class="overline mb-1"
-        ><span class="lowercase">v</span>4.0.10 (06-07-2023) - Current
+        ><span class="lowercase">v</span>4.0.11 (13-07-2023) - Current
         version</div
       >
       <div class="rounded-border mb-4">
@@ -11,6 +11,15 @@
         </ul>
       </div>
 
+      <div class="overline mb-1"
+        ><span class="lowercase">v</span>4.0.10 (06-07-2023)</div
+      >
+      <div class="rounded-border mb-4">
+        <ul>
+          <li>Small improvements</li>
+        </ul>
+      </div>
+
       <div class="overline mb-1"
         ><span class="lowercase">v</span>4.0.9 (29-06-2023)</div
       >