Buildings and levels for the floor map, and make every identifier searchable

plugins/network/frontend/views/NetworkDeviceForm.vue

@@ -234,9 +234,11 @@
             <div class="map-location-control">
               <div v-if="form.mapx !== null && form.mapy !== null" class="current-position">
                 Position: {{ form.mapx }}, {{ form.mapy }}
+                <span v-if="form.levelid" class="position-level">on {{ levelName(form.levelid) }}</span>
+                <span v-else class="position-level position-level-missing">level not set</span>
                 <button type="button" class="btn btn-sm btn-secondary" @click="clearMapPosition">Clear</button>
               </div>
-              <button type="button" class="btn btn-secondary" @click="showMapPicker = true">
+              <button type="button" class="btn btn-secondary" @click="openMapPicker">
                 Set Location on Map
               </button>
             </div>
@@ -246,8 +248,19 @@
         <!-- Map Picker Modal -->
         <Modal v-model="showMapPicker" title="Select Location on Map" size="fullscreen">
           <div class="map-modal-content">
+            <div v-if="levelOptions().length > 1" class="map-level-picker">
+              <label>Level</label>
+              <select v-model.number="pickerLevelId" class="form-control">
+                <option v-for="option in levelOptions()" :key="option.levelid"
+                        :value="option.levelid">{{ option.label }}</option>
+              </select>
+              <span class="input-hint">
+                The position is pixels on this drawing, so pick the level first.
+              </span>
+            </div>
             <ShopFloorMap
               :pickerMode="true"
+              :levelid="pickerLevelId"
               :initialPosition="form.mapx !== null ? { left: form.mapx, top: form.mapy } : null"
               :theme="currentTheme"
               @positionPicked="handlePositionPicked"
@@ -307,6 +320,8 @@ import {
 } from '@/api'
 import CustomFieldsInputs from '@/components/CustomFieldsInputs.vue'
 import ShopFloorMap from '@/components/ShopFloorMap.vue'
+import { loadMapConfig, levelOptions, levelName, state as mapConfig }
+  from '@/composables/mapConfig'
 import Modal from '@/components/Modal.vue'
 import { currentTheme } from '@/stores/theme'
 import { useIdentifierFlags } from '@/composables/identifierSettings'
@@ -315,6 +330,10 @@ import { apiError } from '@/utils/apiError'
 const { isEnabled } = useIdentifierFlags()
 
 const showMapPicker = ref(false)
+// Which drawing the picker shows, and therefore which level the coordinates it
+// returns belong to (ADR-017). Opens on the position's existing level so editing
+// a marker does not silently move it to the default one.
+const pickerLevelId = ref(null)
 const tempMapPosition = ref(null)
 const route = useRoute()
 const router = useRouter()
@@ -348,6 +367,7 @@ const form = ref({
   ismanaged: false,
   mapx: null,
   mapy: null,
+  levelid: null,
   notes: ''
 })
 
@@ -459,6 +479,7 @@ async function loadDevice() {
     form.value.businessunitid = data.businessunitid || ''
     form.value.mapx = data.mapx
     form.value.mapy = data.mapy
+    form.value.levelid = data.levelid
     form.value.notes = data.notes || ''
     // The IP lives in a Communication row, not on the extension table; the API
     // flattens it onto the response as ipaddress.
@@ -508,6 +529,7 @@ async function submitForm() {
       ismanaged: form.value.ismanaged,
       mapx: form.value.mapx,
       mapy: form.value.mapy,
+      levelid: form.value.levelid,
       notes: form.value.notes || null
     }
 
@@ -550,10 +572,21 @@ function handlePositionPicked(position) {
   tempMapPosition.value = position
 }
 
+function openMapPicker() {
+  loadMapConfig().then(() => {
+    pickerLevelId.value = form.value.levelid || mapConfig.defaultlevelid
+    showMapPicker.value = true
+  })
+}
+
 function confirmMapPosition() {
   if (tempMapPosition.value) {
     form.value.mapx = tempMapPosition.value.left
     form.value.mapy = tempMapPosition.value.top
+    // Never one without the other: coordinates saved with no level render as
+    // "level unknown", and coordinates saved against the wrong level render
+    // convincingly in the wrong place.
+    form.value.levelid = pickerLevelId.value
   }
   showMapPicker.value = false
 }
@@ -561,6 +594,7 @@ function confirmMapPosition() {
 function clearMapPosition() {
   form.value.mapx = null
   form.value.mapy = null
+  form.value.levelid = null
   tempMapPosition.value = null
 }