add subdomain edition page

components/Layout/Parameters/Website.vue

@@ -16,18 +16,30 @@
           <div class="mb-6">
             <div>{{ $t('subdomains_history') }} : </div>
             <UiLoadingPanel v-if="subdomainsPending" />
-            <v-list
-                v-else
-                :items="subdomains.items"
-                item-value="id"
-                item-title="subdomain"
-                density="compact"
-                bg-color="transparent"
-            >
-              <template #prepend>
-                <v-icon icon="fas fa-circle" style="font-size: 5px;"/>
-              </template>
-            </v-list>
+            <v-table v-else class="my-2">
+              <tbody>
+                <tr
+                    v-for="subdomain in subdomains.items"
+                    :key="subdomain.id"
+                    :title="subdomain.subdomain"
+                    class="subdomainItem"
+                    @click="goToEditPage(subdomain.id)"
+                >
+                  <td>{{ subdomain.subdomain }}</td>
+                  <td>
+                      <span v-if="subdomain.active">
+                        <v-icon class="text-success icon">
+                          fa-solid fa-check
+                        </v-icon> {{ $t('active') }}
+                      </span>
+                  </td>
+
+                </tr>
+
+              </tbody>
+
+            </v-table>
+
           </div>
 
           <v-btn
@@ -70,6 +82,8 @@ import {AsyncData} from "#app";
 import Subdomain from "~/models/Organization/Subdomain";
 import ApiResource from "~/models/ApiResource";
 
+const router = useRouter()
+
 const { fetch, fetchCollection } = useEntityFetch()
 
 const organizationProfile = useOrganizationProfileStore()
@@ -87,7 +101,9 @@ const canAddNewSubdomain: ComputedRef<boolean> = computed(() => subdomains.value
 
 
 
-
+const goToEditPage = (id: number) => {
+  router.push(`parameters/subdomains/${id}`)
+}
 
 const onAddSubdomainClick = () => {
   if (!canAddNewSubdomain) {
@@ -100,5 +116,17 @@ const onAddSubdomainClick = () => {
 </script>
 
 <style scoped lang="scss">
+.v-table {
+  background: transparent;
+}
+.subdomainItem {
+  cursor: pointer;
+}
+.subdomainItem:hover {
+  background: rgb(var(--v-theme-neutral));
+}
+.subdomainItem .icon {
+  font-size: 12px;
+}
 
 </style>

pages/parameters/subdomains/[id].vue

@@ -0,0 +1,77 @@
+<!-- Page de détails d'un sous-domaine -->
+<template>
+  <main>
+    <LayoutContainer>
+      <UiLoadingPanel v-if="pending || activationPending" />
+      <div>
+        <div>
+          {{ $t('youRegisteredTheFollowingSubdomain')}} :
+        </div>
+
+        <div class="pa-8">
+          <b>{{ subdomain.subdomain }}</b>
+          <span class="text-on-neutral">.opentalent.fr</span>
+        </div>
+
+        <div>
+          <div v-if="subdomain.active">
+            <v-icon class="text-success icon small mr-2">
+              fa-solid fa-check
+            </v-icon>
+            {{ $t('subdomainIsCurrentlyActive') }}
+          </div>
+          <div v-else>
+            {{ $t('doYouWantToActivateThisSubdomain') }} ?
+          </div>
+        </div>
+
+        <div class="mt-6 d-flex flex-row">
+          <v-btn class="mr-12" @click="quit">
+            {{ $t('back') }}
+          </v-btn>
+          <div v-if="!subdomain.active">
+            <v-btn color="primary" @click="activateAndQuit" >
+              {{ $t('activate') }}
+            </v-btn>
+          </div>
+        </div>
+      </div>
+    </LayoutContainer>
+  </main>
+</template>
+
+<script setup lang="ts">
+  import Subdomain from "~/models/Organization/Subdomain";
+  import {useEntityFetch} from "~/composables/data/useEntityFetch";
+  import {useOrganizationProfileStore} from "~/stores/organizationProfile";
+  import {useEntityManager} from "~/composables/data/useEntityManager";
+
+  const { em } = useEntityManager()
+  const { fetch } = useEntityFetch()
+  const organizationProfile = useOrganizationProfileStore()
+
+  const router = useRouter()
+  const route = useRoute()
+
+  if (!route.params.id || isNaN(route.params.id as any)) {
+    throw new Error('no id found')
+  }
+  const id: number = parseInt(route.params.id as string)
+
+  const { data: subdomain, pending } = fetch(Subdomain, id)
+
+  const activationPending: Ref<boolean> = ref(false)
+
+  const activateAndQuit = () => {
+    activationPending.value = true
+    em.patch(Subdomain, id, { active: true} )
+    quit()
+  }
+
+  const quit = () => {
+    router.push('/parameters#website')
+    activationPending.value = false
+  }
+
+
+</script>

pages/parameters/subdomains/_id.vue

@@ -1,88 +0,0 @@
-<!-- Page de détails d'un sous-domaine -->
-<template>
-  <main>
-    <LayoutContainer>
-      <UiLoadingPanel v-if="pending" />
-      <UiForm
-          v-else
-          :model="Subdomain"
-          :entity="subdomain"
-      >
-
-
-
-
-      </UiForm>
-    </LayoutContainer>
-
-
-
-
-
-
-<!--      <v-card class="mb-5 mt-4">-->
-<!--        <FormToolbar title="subdomain" icon="fa-at"/>-->
-
-<!--        <v-container fluid class="container pa-6">-->
-<!--          <v-row>-->
-<!--            <v-col cols="12" sm="12">-->
-<!--              <v-skeleton-loader-->
-<!--                  v-if="fetchState.pending"-->
-<!--                  type="text"-->
-<!--              />-->
-<!--              <div v-else>-->
-<!--                <div>-->
-<!--                  {{ $t('youRegisteredTheFollowingSubdomain')}} :-->
-<!--                </div>-->
-
-<!--                <div class="pa-8">-->
-<!--                  <b>{{ entry.subdomain }}</b> <span class="grey&#45;&#45;text">.opentalent.fr</span>-->
-<!--                </div>-->
-
-<!--                <div>-->
-<!--                  <div v-if="entry.active">-->
-<!--                    <v-icon class="ot_green&#45;&#45;text icon small mr-2">-->
-<!--                      fa-solid fa-check-->
-<!--                    </v-icon>-->
-<!--                    {{ $t('subdomainIsCurrentlyActive') }}-->
-<!--                  </div>-->
-<!--                  <div v-else>-->
-<!--                    {{ $t('doYouWantToActivateThisSubdomain') }} ?-->
-<!--                  </div>-->
-<!--                </div>-->
-
-<!--                <div class="mt-6 d-flex flex-row">-->
-<!--                  <v-btn to="/parameters/communication" class="mr-12">{{ $t('back') }}</v-btn>-->
-<!--                  <div v-if="!entry.active">-->
-<!--                    <v-btn color="primary" @click="activateAndQuit(entry)">{{ $t('activate') }}</v-btn>-->
-<!--                  </div>-->
-<!--                </div>-->
-
-<!--              </div>-->
-<!--            </v-col>-->
-<!--          </v-row>-->
-<!--        </v-container>-->
-<!--      </v-card>-->
-<!--    </LayoutContainer>-->
-  </main>
-</template>
-
-<script setup lang="ts">
-
-
-import Parameters from "~/models/Organization/Parameters";
-import {AsyncData} from "#app";
-import Subdomain from "~/models/Organization/Subdomain";
-import {useEntityFetch} from "~/composables/data/useEntityFetch";
-import {useOrganizationProfileStore} from "~/stores/organizationProfile";
-
-const { fetch } = useEntityFetch()
-const organizationProfile = useOrganizationProfileStore()
-
-const id = parseInt(route.value.params.id)
-
-
-const { data: subdomain, pending } = fetch(Subdomain) as AsyncData<Parameters, Parameters | true>
-
-
-</script>

services/utils/urlUtils.ts

@@ -59,9 +59,8 @@ class UrlUtils {
   /**
    * Extrait l'ID de l'URI passée en paramètre
    * L'URI est supposée être de la forme `.../foo/bar/{id}`,
-   * où l'id est un identifiant numérique, à moins que isLiteral soit défini comme vrai.
-   * Dans ce cas, si isLiteral est vrai, l'id sera retourné sous forme de texte.
-   *
+   * où l'id est un identifiant numérique, à moins que `isLiteral` soit défini comme vrai.
+   * Dans ce cas, si `isLiteral` est vrai, l'id sera retourné sous forme de texte.
    *
    * @param uri
    * @param isLiteral