Admin: Add CMS pages categories FAQ and Contact + fix loading in existing Home.vue - refs BT#20918

Author: ywarnier

assets/vue/components/page/PageCardList.vue

@@ -1,7 +1,6 @@
 <template>
   <div
     v-if="pageList.length"
-    class="grid gap-4 grid-cols-1 lg:grid-cols-2 xl:grid-cols-2"
   >
     <PageCard
       v-for="page in pageList"

assets/vue/pages/Contact.vue

@@ -0,0 +1,28 @@
+<template>
+  <!-- List of pages of category "contact" -->
+  <div class="container mx-auto flex gap-8">
+    <div v-if="pages.length" class="flex-1">
+      <PageCardList :pages="pages" class="grid gap-4 grid-cols-1" />
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from "vue";
+import { useStore } from "vuex";
+import { useI18n } from "vue-i18n";
+import PageCardList from "../components/page/PageCardList";
+
+const store = useStore();
+const { locale } = useI18n();
+
+const pages = ref([]);
+
+store
+  .dispatch("page/findAll", {
+    "category.title": "contact",
+    enabled: "1",
+    locale: locale.value,
+  })
+  .then((response) => (pages.value = response));
+</script>

assets/vue/pages/Faq.vue

@@ -0,0 +1,28 @@
+<template>
+  <!-- List of pages of category "faq" -->
+  <div class="container mx-auto flex gap-8">
+    <div v-if="pages.length" class="flex-1">
+      <PageCardList :pages="pages" class="grid gap-4 grid-cols-1" />
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from "vue";
+import { useStore } from "vuex";
+import { useI18n } from "vue-i18n";
+import PageCardList from "../components/page/PageCardList";
+
+const store = useStore();
+const { locale } = useI18n();
+
+const pages = ref([]);
+
+store
+  .dispatch("page/findAll", {
+    "category.title": "faq",
+    enabled: "1",
+    locale: locale.value,
+  })
+  .then((response) => (pages.value = response));
+</script>

assets/vue/pages/Home.vue

@@ -1,10 +1,11 @@
 <template>
+  <!-- Homepage for logged-in users -->
   <div class="flex flex-col gap-4">
     <div v-if="announcements.length">
       <SystemAnnouncementCardList :announcements="announcements" />
     </div>
 
-    <PageCardList />
+    <PageCardList class="grid gap-4 grid-cols-1 lg:grid-cols-2 xl:grid-cols-2" />
   </div>
 </template>
 

assets/vue/pages/Index.vue

@@ -1,8 +1,9 @@
 <template>
+  <!-- Public homepage (no login required) -->
   <div class="container mx-auto flex gap-8">
     <Login class="md:w-4/12 lg:order-1" />
     <div v-if="pages.length" class="flex-1 md:w-8/12 lg:order-0">
-      <PageCardList :pages="pages" />
+      <PageCardList :pages="pages" class="grid gap-4 grid-cols-1 lg:grid-cols-2 xl:grid-cols-2" />
     </div>
   </div>
 </template>

assets/vue/router/index.js

@@ -33,6 +33,8 @@ import CourseHome from "../views/course/CourseHome.vue"
 import Index from "../pages/Index.vue"
 import Home from "../pages/Home.vue"
 import Login from "../pages/Login.vue"
+import Faq from "../pages/Faq.vue"
+import Contact from "../pages/Contact.vue"
 import { useCidReqStore } from "../store/cidReq"
 
 const router = createRouter({
@@ -64,6 +66,24 @@ const router = createRouter({
         showBreadcrumb: false,
       },
     },
+    {
+      path: "/faq",
+      name: "Faq",
+      component: Faq,
+      meta: {
+        requiresAuth: false,
+        showBreadcrumb: false,
+      },
+    },
+    {
+      path: "/contact",
+      name: "Contact",
+      component: Contact,
+      meta: {
+        requiresAuth: false,
+        showBreadcrumb: false,
+      },
+    },
     {
       path: "/course/:id/home",
       name: "CourseHome",

src/CoreBundle/Component/Utils/CreateDefaultPages.php

@@ -46,6 +46,20 @@ public function createDefaultPages(User $user, AccessUrl $url, string $locale):
         ;
         $this->pageCategoryRepository->update($indexCategory);
 
+        $indexCategory = (new PageCategory())
+            ->setTitle('faq')
+            ->setType('grid')
+            ->setCreator($user)
+        ;
+        $this->pageCategoryRepository->update($indexCategory);
+
+        $indexCategory = (new PageCategory())
+            ->setTitle('contact')
+            ->setType('grid')
+            ->setCreator($user)
+        ;
+        $this->pageCategoryRepository->update($indexCategory);
+
         $page = (new Page())
             ->setTitle('Welcome')
             ->setContent('Welcome to Chamilo')

src/CoreBundle/Controller/IndexController.php

@@ -18,6 +18,8 @@ class IndexController extends BaseController
      * @Route("/", name="index", methods={"GET", "POST"}, options={"expose"=true})
      * @Route("/home", name="home", methods={"GET", "POST"}, options={"expose"=true})
      * @Route("/login", name="login", methods={"GET", "POST"}, options={"expose"=true})
+     * @Route("/faq", name="faq", methods={"GET", "POST"}, options={"expose"=true})
+     * @Route("/contact", name="contact", methods={"GET", "POST"}, options={"expose"=true})
      *
      * @Route("/course/{cid}/home", name="chamilo_core_course_home")
      * @Route("/courses", name="courses", methods={"GET", "POST"}, options={"expose"=true})