- Creazione di un Nuovo Catalogo (e la sua relativa pagina), a partire da un modello ed un catalogo esistente.

- Aggiunta dei bottoni sul Ccatalogocard

src/components/CCatalogList/CCatalogList.ts

@@ -19,11 +19,13 @@ import { useUserStore } from '@store/UserStore';
 
 import { CTitlePage } from '@src/components/CTitlePage';
 import { CGridTableRec } from '@src/components/CGridTableRec';
-import type { ICatalog, IColGridTable, ISearchList } from 'model';
+import type { ICatalog, IColGridTable, INewCatalog, ISearchList } from 'model';
 import { useI18n } from 'vue-i18n';
 import { toolsext } from '@store/Modules/toolsext';
 import { fieldsTable } from '@store/Modules/fieldsTable';
 import { useQuasar } from 'quasar';
+import { useRouter } from 'vue-router';
+import { useCatalogStore } from 'app/src/store/CatalogStore';
 
 export default defineComponent({
   name: 'CCatalogList',
@@ -85,8 +87,11 @@ export default defineComponent({
     const $q = useQuasar();
     const globalStore = useGlobalStore();
     const userStore = useUserStore();
+    const catalogStore = useCatalogStore();
+    const $router = useRouter();
 
     const table = ref('catalogs');
+    const caricamentodati = ref(false);
 
     const arrfilterand: any = ref([]);
     const filtercustom: any = ref([]);
@@ -99,9 +104,12 @@ export default defineComponent({
     const col_footer = ref('');
     const col_tabfooter = ref('');
 
+    const cataloghi = ref(<any[]>[]);
+    const modelli = ref(<any[]>[]);
+
     const strextra = ref('');
     const myoptions = ref(<any>[]);
-    const newCatalog = ref(<any>{});
+    const newCatalog = ref(<INewCatalog>{});
 
     const col = ref(<IColGridTable[]>[]);
 
@@ -171,6 +179,17 @@ export default defineComponent({
       filtercustom.value = [];
 
       col.value = fieldsTable.getArrColsByTable(table.value);
+
+      modelli.value = globalStore.getMyPagesOptionsTemplate();
+
+      cataloghi.value = catalogStore.getCatalogsList();
+
+      if (modelli.value && modelli.value.length > 0) {
+        newCatalog.value.idPageTemplate = modelli.value[0].value;
+      }
+      if (cataloghi.value && cataloghi.value.length > 0) {
+        newCatalog.value.idCatalogToCopy = cataloghi.value[1].value;
+      }
     }
 
     function mySortFieldsAvailable() {
@@ -198,22 +217,41 @@ export default defineComponent({
       showFormAddNewCatalog.value = true;
     }
 
-    function addNewCatalogSave() {
+    async function addNewCatalogSave() {
       // Salva catalogo
+      caricamentodati.value = true;
+      const ris = await globalStore.addNewCatalog(newCatalog.value, $router);
+      if (ris.page) {
+        const newPagePath = ris.page.path;
+        const confirmNavigation = $q
+          .dialog({
+            message: t(t('mypages.catalogo_new', { title: ris.page.title })),
+            ok: { label: t('Sì'), push: true },
+            cancel: { label: t('No') },
+            title: t('mypages.confirm_nav'),
+          })
+          .onOk(() => {
+            $router.push({ path: `/${newPagePath}` });
+          });
+      } else {
+        tools.showNegativeNotif($q, t('mypages.catalogo_err'));
+      }
+
+      caricamentodati.value = false;
     }
 
-    function checkPathExist() {
+    function checkPathAlreadyExist(path: string) {
       const mypageexist = globalStore.mypage.find(
-        (myrec) => myrec.path.toLowerCase() === newCatalog.path.toLowerCase()
+        (myrec) => myrec?.path?.toLowerCase() === path?.toLowerCase()
       );
-      if (mypageexist) {
-        $q.notify({
-          message: `La pagina ${newCatalog.path} esiste già`,
-          color: 'red',
-          position: 'top',
-        });
-        return;
-      }
+      return mypageexist;
+    }
+
+    function checkNameAlreadyExist(title: string) {
+      const mypageexist = globalStore.mypage.find(
+        (myrec) => myrec?.title?.toLowerCase() === title?.toLowerCase()
+      );
+      return mypageexist;
     }
 
     onMounted(mounted);
@@ -247,8 +285,12 @@ export default defineComponent({
       showFormAddNewCatalog,
       addNewCatalogSave,
       newCatalog,
-      checkPathExist,
+      checkPathAlreadyExist,
+      checkNameAlreadyExist,
       globalStore,
+      caricamentodati,
+      cataloghi,
+      modelli,
     };
   },
 });

src/components/CCatalogList/CCatalogList.vue

@@ -65,32 +65,59 @@
             filled
             v-model="newCatalog.title"
             label="Titolo del catalogo *"
+            autofocus
+            @update:model-value="
+              newCatalog.path = tools.convertTitleToFileName(newCatalog.title)
+            "
             lazy-rules
-            :rules="[(val) => (val && val.length > 0) || 'Inserire il titolo']"
+            :rules="[
+              (val) => (val && val.length > 0) || 'Inserire il titolo',
+              (val) =>
+                !checkNameAlreadyExist(val) || 'Il titolo della pagina esiste già ',
+            ]"
           />
           <q-input
             filled
             v-model="newCatalog.path"
             label="Nome della pagina *"
-            @update:model-value="checkPathExist"
             lazy-rules
-            :rules="[(val) => (val && val.length > 0) || 'Inserire il nome della pagina']"
+            :rules="[
+              (val) => (val && val.length > 0) || 'Inserire il nome della pagina',
+              (val) => !checkPathAlreadyExist(val) || 'Il nome della pagina esiste già ',
+            ]"
           />
 
           <q-select
             filled
-            v-model="newCatalog.template"
-            :options="globalStore.getMyPagesOptionsTemplate()"
+            v-model="newCatalog.idPageTemplate"
+            :options="modelli"
             label="Modello *"
             emit-value
             map-options
             :rules="[(val) => (val && val.length > 0) || 'Selezionare un modello']"
           />
 
+          <q-select
+            filled
+            v-model="newCatalog.idCatalogToCopy"
+            :options="cataloghi"
+            label="Catalogo da copiare *"
+            emit-value
+            map-options
+          />
+
           <div class="row justify-center">
             <q-btn
               label="Aggiungi"
               type="submit"
+              :disable="
+                !(
+                  newCatalog.title &&
+                  newCatalog.path &&
+                  newCatalog.idPageTemplate &&
+                  !checkPathAlreadyExist(newCatalog.path)
+                )
+              "
               color="primary"
             />
             <q-btn
@@ -103,6 +130,15 @@
           </div>
         </q-form>
       </q-card-section>
+      <div
+        v-if="caricamentodati"
+        class="overlay"
+      >
+        <q-spinner-hourglass
+          color="primary"
+          size="50px"
+        />
+      </div>
     </q-card>
   </q-dialog>
 </template>