@7365admin1/layer-common 4.35.1-staging.417 → 4.35.1-staging.419

package/components/InventoryMain.vue

@@ -2,8 +2,20 @@
   <div class="inventory">
     <PageHeader :title="store ? store.name : 'Inventory'" :subtitle="subtitle">
       <template #actions>
+        <!-- Many stores (staff of several organisations at one property): a list, not a row of buttons. -->
+        <v-select
+          v-if="stores.length > 3"
+          v-model="storeId"
+          :items="stores"
+          :item-title="(s: TInventoryStore) => inventoryStoreLabel(s, stores)"
+          item-value="_id"
+          label="Store"
+          density="compact"
+          hide-details
+          style="min-width: 300px"
+        />
         <v-btn-toggle
-          v-if="stores.length > 1"
+          v-else-if="stores.length > 1"
           v-model="storeId"
           mandatory
           density="comfortable"
@@ -11,7 +23,7 @@
           divided
         >
           <v-btn v-for="s in stores" :key="s._id" :value="s._id" class="text-none">
-            {{ s.ownerType === "property" ? "Property store" : "Our store" }}
+            {{ inventoryStoreLabel(s, stores) }}
           </v-btn>
         </v-btn-toggle>
       </template>
@@ -102,6 +114,7 @@
 import useInventory from "../composables/useInventory";
 import useSite from "../composables/useSite";
 import useUtils from "../composables/useUtils";
+import { inventoryStoreLabel } from "../utils/inventory-store-label";
 
 const props = defineProps({
   orgId: { type: String, required: true },
@@ -144,7 +157,7 @@ const storeSites = computed(() =>
 const subtitle = computed(() => {
   if (!store.value) return "";
   if (storeSites.value.length > 1) return `Supplies ${storeSites.value.map((s) => s.name).join(", ")}`;
-  return store.value.ownerType === "property" ? "Property store" : "Our own store";
+  return inventoryStoreLabel(store.value, stores.value);
 });
 
 const tabs = computed(() => {

package/components/InventoryUsageDialog.vue

@@ -72,14 +72,15 @@
 
           <v-row dense>
             <v-col cols="12" sm="6">
-              <InputLabel title="Photo before (optional)" class="mb-1" />
+              <InputLabel title="Photo before" required class="mb-1" />
               <InventoryPhotoInput v-model="photosBefore" :max="3" />
             </v-col>
             <v-col cols="12" sm="6">
-              <InputLabel title="Photo after (optional)" class="mb-1" />
+              <InputLabel title="Photo after" required class="mb-1" />
               <InventoryPhotoInput v-model="photosAfter" :max="3" />
             </v-col>
           </v-row>
+          <div v-if="photoError" class="text-error text-body-2 mt-1" role="alert">{{ photoError }}</div>
 
           <InputLabel title="Date used" class="mb-1 mt-3" />
           <v-text-field v-model="date" type="date" :max="today" density="comfortable" style="max-width: 200px" />
@@ -128,6 +129,8 @@ const reportedBy = ref("");
 const date = ref(today);
 const photosBefore = ref<string[]>([]);
 const photosAfter = ref<string[]>([]);
+const photoError = ref("");
+const USAGE_PHOTOS_REQUIRED = "Add a before photo and an after photo to record usage.";
 
 const siteChoices = computed(() =>
   props.sites.length ? props.sites : props.store.sites.map((_id) => ({ _id, name: _id === props.siteId ? "This property" : "Other property" })),
@@ -158,7 +161,9 @@ async function loadAreas() {
 
 async function save() {
   const { valid } = await form.value.validate();
-  if (!valid || !props.holding) return;
+  // Owner decision 2026-09-27: a before AND an after photo on every usage record (the API refuses without).
+  photoError.value = photosBefore.value.length && photosAfter.value.length ? "" : USAGE_PHOTOS_REQUIRED;
+  if (!valid || photoError.value || !props.holding) return;
   saving.value = true;
   try {
     await api.recordUsage(props.store._id, {
@@ -190,8 +195,13 @@ watch(site, () => {
   loadAreas();
 });
 
+watch([photosBefore, photosAfter], () => {
+  if (photosBefore.value.length && photosAfter.value.length) photoError.value = "";
+});
+
 watch(show, (open) => {
   if (!open) return;
+  photoError.value = "";
   photosBefore.value = [];
   photosAfter.value = [];
   qty.value = 1;

package/package.json

@@ -2,7 +2,7 @@
   "name": "@7365admin1/layer-common",
   "license": "MIT",
   "type": "module",
-  "version": "4.35.1-staging.417",
+  "version": "4.35.1-staging.419",
   "author": "7365admin1",
   "main": "./nuxt.config.ts",
   "//files": "What a consumer extending this layer actually loads. Without this npm ships the whole working tree - the changesets, the CI workflows, the render harness in tools/ and any scratch directory that happened to exist at publish time. Nuxt resolves a layer by directory, so every runtime directory below has to stay listed; adding a new top-level runtime directory means adding it here too.",

package/utils/inventory-store-label.ts

@@ -0,0 +1,13 @@
+/**
+ * The store switcher's button text. "Property store" / "Our store" is enough
+ * when each kind appears once; when a person can see several stores of the
+ * same kind (e.g. staff of several organisations at one property), each one
+ * also names its organisation so the buttons can be told apart.
+ */
+type TStoreLike = { ownerType: string; orgName?: string };
+
+export function inventoryStoreLabel(store: TStoreLike, all: TStoreLike[]) {
+  const kind = store.ownerType === "property" ? "Property store" : "Our store";
+  const sameKind = all.filter((s) => s.ownerType === store.ownerType).length;
+  return sameKind > 1 && store.orgName ? `${kind} · ${store.orgName}` : kind;
+}