glib-web 4.25.0 → 4.26.0

package/app.vue

@@ -375,6 +375,14 @@ body,
   }
 }
 
+.v-btn--disabled {
+  pointer-events: auto;
+}
+
+.v-btn--disabled:active {
+  pointer-events: none;
+}
+
 /******/
 </style>
 

package/components/fields/dynamicGroup2.vue

@@ -63,14 +63,29 @@ export default defineComponent({
       }
     }
 
+    function processChildViewsIfExists(index, view, properties) {
+      if (view && view.childViews) {
+        view.childViews.forEach((childView) => processView(index, childView, properties));
+      }
+    }
+
+    function processViewPanelsSplit(index, view, properties) {
+      processChildViewsIfExists(index, view.left, properties);
+      processChildViewsIfExists(index, view.center, properties);
+      processChildViewsIfExists(index, view.right, properties);
+    }
+
     function processView(index, view, properties) {
       if (view.name && view.view.startsWith('fields')) {
         Object.assign(view, properties[view.name]);
         view.name = prefixFieldName(index, view.name);
       }
-      if (view.childViews) {
+      else if (view.childViews) {
         view.childViews.forEach((childView) => processView(index, childView, properties));
       }
+      else if (view.center || view.left || view.right) {
+        processViewPanelsSplit(index, view, properties);
+      }
     }
 
     function removeGroupEntry(groupSpec) {

package/components/fields/dynamicSelect.vue

@@ -1,29 +1,19 @@
 <template>
   <div :style="$styles()" v-if="loadIf">
-    <v-autocomplete ref="autocomplete" v-model="model" :items="allItems" v-model:search="search"
-      :label="spec.label" hide-selected no-filter return-object
-      chips closable-chips :clearable="spec.clearable"
-      :variant="variant" :density="density"
-      :placeholder="spec.placeholder" persistent-placeholder
-      :multiple="spec.multiple" @update:focused="focused = $event"
-      no-data-text="No result"
-      >
+    <v-autocomplete ref="autocomplete" v-model="model" :items="allItems" v-model:search="search" :label="spec.label"
+      hide-selected no-filter return-object chips closable-chips :clearable="spec.clearable" :variant="variant"
+      :density="density" :placeholder="spec.placeholder" persistent-placeholder :multiple="spec.multiple"
+      @update:focused="focused = $event" no-data-text="No result">
 
       <template #item="{ item, index, props }">
-        <v-list-item
-          v-bind="props"
-          dense
-        >
+        <v-list-item v-bind="props" dense>
           <template #title>
             <div>
               {{ item.title ?? item.raw.title }}
             </div>
           </template>
           <template #default>
-            <div
-              v-if="item.raw.subtitle"
-              style="opacity: 0.8"
-            >
+            <div v-if="item.raw.subtitle" style="opacity: 0.8">
               {{ item.raw.subtitle }}
             </div>
             <!-- <div
@@ -95,8 +85,16 @@ export default {
     spec: { type: Object, required: true }
   },
   data() {
+    let model;
+    const selectedItems = this.spec.selectedOptions;
+    if (selectedItems) {
+      model = this.spec.multiple ? selectedItems : selectedItems[0];
+    } else {
+      model = this.spec.multiple ? [] : null;
+    }
+
     return {
-      model: null,
+      model,
       search: null,
       nextPageUrl: null,
       keyword: "",
@@ -111,7 +109,7 @@ export default {
       if (this.model) {
         // Depends on whether the field is single or multiple
         if (this.$type.isArray(this.model)) {
-          return this.model
+          return this.model;
         } else {
           return [this.model];
         }
@@ -173,12 +171,7 @@ export default {
   },
   methods: {
     $ready() {
-      const selectedItems = this.spec.selectedOptions;
-      if (selectedItems) {
-        this.model = this.spec.multiple ? selectedItems : selectedItems[0];
-      } else {
-        this.model = this.spec.multiple ? [] : null;
-      }
+
 
       this.updateAllItems();
       this.loadItems(this.spec.url, false);

package/components/panels/form.vue

@@ -5,7 +5,7 @@
       <input type="hidden" :name="key" :value="value" />
     </template>
 
-    <panels-responsive :spec="augmentedSpec" />
+    <panels-responsive :spec="spec" />
 
     <!-- Used by app.vue -->
     <slot />
@@ -13,14 +13,14 @@
 </template>
 
 <script>
-import { provide, ref } from "vue";
+import { onMounted, provide, ref } from "vue";
 import { useGlibForm } from "../composable/form";
 
 export default {
   props: {
     spec: { type: Object, required: true },
   },
-  setup() {
+  setup(props) {
     const formCtx = ref({ form: null });
 
     const form = ref(null);
@@ -28,6 +28,27 @@ export default {
 
     provide('formCtx', formCtx);
 
+    function firstInput() {
+      return form.value.$el.querySelector('input:not([type="hidden"]):not([disabled]):not([readonly]),textarea,select');
+    }
+
+    function firstInputPromise() {
+      return new Promise((resolve) => {
+        let intervalId = setInterval(() => {
+          if (firstInput()) {
+            clearInterval(intervalId);
+            resolve(firstInput());
+          }
+        }, 50);
+      });
+    }
+
+    onMounted(() => {
+      if (props.spec.autofocus) {
+        firstInputPromise().then((firstInput) => firstInput.focus());
+      }
+    });
+
     return { formCtx, glibForm, form };
   },
   data: () => ({
@@ -39,26 +60,26 @@ export default {
     // modifiedSpec: {},
   }),
   computed: {
-    augmentedSpec() {
-      const spec = this.spec;
-
-      if (spec.autoFocus) {
-        let firstAutoFocus = false;
-
-        // TODO: Use map() instead for immutability
-        spec.childViews.forEach(childView => {
-          if (
-            childView.view.startsWith("fields/") &&
-            childView.view !== "fields/hidden-v1" &&
-            !firstAutoFocus
-          ) {
-            childView.autoFocus = true;
-            firstAutoFocus = true;
-          }
-        });
-      }
-      return spec;
-    }
+    // augmentedSpec() {
+    //   const spec = this.spec;
+
+    //   if (spec.autoFocus) {
+    //     let firstAutoFocus = false;
+
+    //     // TODO: Use map() instead for immutability
+    //     spec.childViews.forEach(childView => {
+    //       if (
+    //         childView.view.startsWith("fields/") &&
+    //         childView.view !== "fields/hidden-v1" &&
+    //         !firstAutoFocus
+    //       ) {
+    //         childView.autoFocus = true;
+    //         firstAutoFocus = true;
+    //       }
+    //     });
+    //   }
+    //   return spec;
+    // }
   },
   watch: {
     spec: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "glib-web",
-  "version": "4.25.0",
+  "version": "4.26.0",
   "description": "",
   "main": "index.js",
   "scripts": {