Merge remote-tracking branch 'upstream/master' into chamiloGH-1655

christianbeeznest · Feb 4, 2025 · d82e08c · d82e08c
2 parents 8689575 + 59c97b1
commit d82e08c
Show file tree

Hide file tree

Showing 104 changed files with 2,067 additions and 568 deletions.
diff --git a/README.md b/README.md
@@ -34,7 +34,7 @@ On Ubuntu 24.04+, the following should take care of most dependencies.
 ~~~~
 sudo apt update
 sudo apt -y upgrade
-sudo apt install apache2 libapache2-mod-php mariadb-client mariadb-server redis php-pear php-{apcu,bcmath,cli,curl,dev,gd,intl,mbstring,mysql,redis,soap,xml,zip} git unzip
+sudo apt install apache2 libapache2-mod-php mariadb-client mariadb-server redis php-pear php-{apcu,bcmath,cli,curl,dev,gd,intl,mbstring,mysql,redis,soap,xml,zip} git unzip curl
 sudo mysql
 mysql> GRANT ALL PRIVILEGES ON chamilo.* TO chamilo@localhost IDENTIFIED BY '{password}';
 mysql> exit
@@ -49,7 +49,7 @@ sudo apt -y upgrade
 sudo apt -y install ca-certificates curl gnupg software-properties-common
 sudo add-apt-repository ppa:ondrej/php
 sudo apt update
-sudo apt install apache2 libapache2-mod-php8.3 mariadb-client mariadb-server redis php-pear php8.3-{apcu,bcmath,cli,curl,dev,gd,intl,mbstring,mysql,redis,soap,xml,zip} git unzip
+sudo apt install apache2 libapache2-mod-php8.3 mariadb-client mariadb-server redis php-pear php8.3-{apcu,bcmath,cli,curl,dev,gd,intl,mbstring,mysql,redis,soap,xml,zip} git unzip curl
 ~~~~
 (replace 'chamilo' by the database name and user you want, and '{password}' by a more secure password)
 

diff --git a/assets/css/app.scss b/assets/css/app.scss
@@ -292,6 +292,10 @@
   }
 }
 
+.mdi {
+  @apply font-normal text-base leading-none;
+}
+
 .field > small.p-error {
   @apply text-error;
 }
@@ -799,6 +803,15 @@ form .field {
   }
 }
 
+/* Loader */
+.loader {
+  @apply w-10 h-10 border-4 border-gray-20 border-l-primary rounded-full animate-spin;
+}
+
+.loader-overlay {
+  @apply absolute inset-0 flex items-center justify-center bg-white bg-opacity-40 backdrop-blur-sm;
+}
+
 //@import "~jquery-ui-timepicker-addon/dist/jquery-ui-timepicker-addon.css";
 @import "~@fancyapps/fancybox/dist/jquery.fancybox.css";
 @import "~timepicker/jquery.timepicker.min.css";

diff --git a/assets/css/scss/atoms/_buttons.scss b/assets/css/scss/atoms/_buttons.scss
@@ -1,6 +1,9 @@
 .btn {
-  @apply cursor-default font-semibold gap-2 inline-flex justify-center px-6 py-2 rounded-md transition flex-none;
-  font-size: 16px;
+  @apply cursor-default font-semibold gap-2 inline-flex justify-center px-6 py-2 rounded-md transition flex-none text-base;
+
+  .mdi {
+    @apply text-base;
+  }
 
   &--primary {
     @apply bg-primary text-white;
@@ -231,8 +234,6 @@ $border-color_12: #9333EA;
   @include filled-style('primary', 'support-4');
   @apply cursor-pointer font-semibold gap-2 inline-flex justify-center items-center px-4 py-2 rounded-md transition;
 
-  font-size: 16px;
-
   &:focus {
     @apply outline-none;
   }
@@ -259,16 +260,28 @@ $border-color_12: #9333EA;
 
   &.p-button-sm {
     @apply px-2 py-1;
-    font-size: 13px;
+
+    .p-button-icon,
+    .p-button-label {
+      font-size: 13px;
+    }
   }
 
   &.p-button-lg {
     @apply px-8 py-4;
-    font-size: 18px;
+
+    .p-button-icon,
+    .p-button-label {
+      font-size: 18px;
+    }
+  }
+
+  .p-button-icon {
+    @apply text-base;
   }
 
   .p-button-label {
-    @apply align-middle font-semibold;
+    @apply align-middle font-semibold text-base;
   }
 
   &.p-button-icon-only {
@@ -289,7 +302,7 @@ $border-color_12: #9333EA;
         @apply bg-gray-10;
 
         .p-button-label {
-          text-decoration: underline;
+          @apply underline;
         }
       }
     }

diff --git a/assets/css/scss/atoms/_rating.scss b/assets/css/scss/atoms/_rating.scss
@@ -0,0 +1,44 @@
+.p-rating {
+  @apply relative flex items-center gap-1;
+
+  &-item {
+    @apply inline-flex items-center cursor-pointer outline-none rounded-lg
+      hover:outline-none hover:drop-shadow-lg;
+
+    .p-rating-icon {
+      @apply transition-none text-gray-50;
+
+      font-size: 1rem;
+
+      &.p-icon {
+        @apply w-4 h-4;
+
+        &.p-rating-cancel {
+          @apply text-danger;
+        }
+      }
+    }
+
+    &.p-focus {
+      @apply outline-none drop-shadow-lg;
+    }
+
+    &.p-rating-item-active {
+      & .p-rating-icon {
+        @apply text-warning;
+      }
+    }
+  }
+
+  &.p-readonly &-item {
+    @apply cursor-default;
+  }
+
+  &:not(.p-disabled):not(.p-readonly) &-item:hover &-icon {
+    @apply text-warning;
+  }
+
+  &:not(.p-disabled):not(.p-readonly) &-item:hover &-icon.p-rating-cancel {
+    @apply text-danger;
+  }
+}
diff --git a/assets/css/scss/index.scss b/assets/css/scss/index.scss
@@ -47,6 +47,7 @@
 @include meta.load-css("atoms/platform_logo");
 @include meta.load-css("atoms/progressbar");
 @include meta.load-css("atoms/radio");
+@include meta.load-css("atoms/rating");
 @include meta.load-css("atoms/skeleton");
 @include meta.load-css("atoms/tags");
 @include meta.load-css("atoms/toast");

diff --git a/assets/css/scss/molecules/_course_tool.scss b/assets/css/scss/molecules/_course_tool.scss
@@ -13,9 +13,8 @@
   &__icon {
     @apply text-transparent bg-clip-text bg-gradient-to-br from-primary to-primary-gradient leading-none;
 
-    font-size: 52px;
-
-    &::before {
+    &.mdi {
+      font-size: 52px;
     }
   }
 

diff --git a/assets/css/scss/molecules/_empty_state.scss b/assets/css/scss/molecules/_empty_state.scss
@@ -7,7 +7,11 @@
     }
 
     &__icon {
-      @apply mb-4 text-9xl text-transparent bg-clip-text bg-gradient-to-br from-primary to-primary-gradient w-32 h-32;
+      @apply mb-4 text-transparent bg-clip-text bg-gradient-to-br from-primary to-primary-gradient w-32 h-32;
+
+      &.mdi {
+        font-size: 8rem;
+      }
     }
 
     &__summary {

diff --git a/assets/css/scss/molecules/_toolbar.scss b/assets/css/scss/molecules/_toolbar.scss
@@ -3,7 +3,7 @@
 
   &-group-left,
   &-group-right {
-    @apply flex flex-row flex-wrap gap-2;
+    @apply flex flex-row flex-wrap gap-2 items-center;
   }
 
   &-separator {

diff --git a/assets/vue/AppInstaller.vue b/assets/vue/AppInstaller.vue
@@ -20,38 +20,37 @@
           {{ stepTitle }}
         </li>
       </ol>
-      <div id="note">
-        <a
-          class="p-button p-component p-button-info p-button-outlined"
-          href="../../documentation/installation_guide.html"
-          target="_blank"
-        >
-          <span
-            aria-hidden="true"
-            class="p-button-icon p-button-icon-left mdi mdi-text-box-search-outline"
+      <div
+        id="note"
+        class="text-center"
+      >
+        <BaseAppLink url="../../documentation/installation_guide.html">
+          <BaseButton
+            type="primary"
+            icon="courses"
+            :label="t('Read the installation guide')"
           />
-          <span class="p-button-text">{{ t("Read the installation guide") }}</span>
-        </a>
+        </BaseAppLink>
       </div>
     </aside>
 
     <main class="install-step-container col-span-3 md:col-span-2 row-span-2">
       <h1
         v-if="'new' === installerData.installType"
         v-t="'New installation'"
-        class="mb-4"
+        class="mb-4 text-center"
       />
       <h1
         v-else-if="'update' === installerData.installType"
         v-t="{
           path: 'Update from Chamilo ' + installerData.upgradeFromVersion.join(' | '),
         }"
-        class="mb-4"
+        class="mb-4 text-center"
       />
       <h1
         v-else
         v-t="'Chamilo\'s installation wizard'"
-        class="mb-8"
+        class="mb-8 text-center"
       />
 
       <form
@@ -235,6 +234,8 @@
 import { useI18n } from "vue-i18n"
 import { onMounted, provide, ref } from "vue"
 
+import BaseAppLink from "./components/basecomponents/BaseAppLink.vue"
+import BaseButton from "./components/basecomponents/BaseButton.vue"
 import Step1 from "./components/installer/Step1"
 import Step2 from "./components/installer/Step2"
 import Step3 from "./components/installer/Step3"

diff --git a/assets/vue/components/Breadcrumb.vue b/assets/vue/components/Breadcrumb.vue
@@ -31,7 +31,6 @@ import { useI18n } from "vue-i18n"
 import Breadcrumb from "primevue/breadcrumb"
 import { useCidReqStore } from "../store/cidReq"
 import { storeToRefs } from "pinia"
-import BaseAppLink from "./basecomponents/BaseAppLink.vue"
 
 const legacyItems = ref(window.breadcrumb)
 

diff --git a/assets/vue/components/Loading.vue b/assets/vue/components/Loading.vue
@@ -1,13 +1,10 @@
 <template>
   <div
     v-if="visible"
-    class="w-full h-full fixed block top-0 left-0 bg-white opacity-60 text-center"
-    style="z-index: 9999"
+    class="absolute inset-0 flex items-center justify-center bg-white bg-opacity-50 backdrop-blur-md"
+    style="z-index: 10"
   >
-    <div
-      class="spinner-border text-success opacity-75 top-1/2 my-0 mx-auto block relative w-0 h-0"
-      role="status"
-    >
+    <div class="loader" role="status">
       <span class="sr-only">Loading</span>
     </div>
   </div>

diff --git a/assets/vue/components/admin/AdminBlock.vue b/assets/vue/components/admin/AdminBlock.vue
@@ -76,7 +76,6 @@ import { useI18n } from "vue-i18n"
 import BaseInputGroup from "../basecomponents/BaseInputGroup.vue"
 import BaseIcon from "../basecomponents/BaseIcon.vue"
 import AdminBlockExtraContent from "./AdminBlockExtraContent.vue"
-import BaseAppLink from "../basecomponents/BaseAppLink.vue"
 
 const { t } = useI18n()
 

diff --git a/assets/vue/components/basecomponents/BaseAppLink.vue b/assets/vue/components/basecomponents/BaseAppLink.vue
@@ -2,10 +2,6 @@
 import { RouterLink } from "vue-router"
 import { computed } from "vue"
 
-defineOptions({
-  inheritAttrs: false,
-})
-
 const props = defineProps({
   ...RouterLink.props,
   url: {
@@ -28,16 +24,8 @@ const isAnchor = computed(() => !!props.url)
   </a>
   <router-link
     v-else
-    v-slot="{ href, navigate }"
-    custom
-    v-bind="$props"
+    v-bind="props"
   >
-    <a
-      :href="href"
-      v-bind="$attrs"
-      @click="navigate"
-    >
-      <slot />
-    </a>
+    <slot />
   </router-link>
 </template>
diff --git a/assets/vue/components/basecomponents/BaseButton.vue b/assets/vue/components/basecomponents/BaseButton.vue
@@ -13,6 +13,7 @@
     :text="onlyIcon"
     :title="tooltip || (onlyIcon ? label : undefined)"
     :type="isSubmit ? 'submit' : 'button'"
+    :name="name"
     class="cursor-pointer"
     @click="$emit('click', $event)"
   />
@@ -70,6 +71,11 @@ const props = defineProps({
     type: String,
     default: "", // This ensures that popupIdentifier is still present
   },
+  name: {
+    type: String || undefined,
+    required: false,
+    default: undefined,
+  },
 })
 
 defineEmits(["click"])

diff --git a/assets/vue/components/basecomponents/BaseDropdown.vue b/assets/vue/components/basecomponents/BaseDropdown.vue
@@ -2,15 +2,14 @@
   <div class="field">
     <div class="p-float-label">
       <Dropdown
+        v-model="modelValue"
         :class="{ 'p-invalid': isInvalid }"
         :input-id="inputId"
-        :model-value="modelValue"
         :name="name"
         :option-label="optionLabel"
         :option-value="optionValue"
         :options="options"
         :placeholder="placeholder"
-        @update:model-value="$emit('update:modelValue', $event)"
       />
       <label
         :for="inputId"
@@ -33,17 +32,15 @@
 <script setup>
 import Dropdown from "primevue/dropdown"
 
+const modelValue = defineModel({
+  type: String || Number || Object,
+})
+
 defineProps({
   name: {
     type: String,
     required: true,
   },
-  // type null allow all kind of values, like prime vue does
-  modelValue: {
-    type: null,
-    required: true,
-    default: () => {},
-  },
   options: {
     type: Array,
     required: true,
@@ -84,8 +81,10 @@ defineProps({
     required: false,
     default: false,
   },
-  helpText: String,
+  helpText: {
+    type: String || undefined,
+    required: false,
+    default: undefined,
+  },
 })
-
-defineEmits(["update:modelValue"])
 </script>