diff --git a/src/assets/help-ss/access-management.png b/src/assets/help-ss/access-management.png new file mode 100644 index 0000000..64b95e0 Binary files /dev/null and b/src/assets/help-ss/access-management.png differ diff --git a/src/assets/help-ss/calendar.png b/src/assets/help-ss/calendar.png new file mode 100644 index 0000000..254b572 Binary files /dev/null and b/src/assets/help-ss/calendar.png differ diff --git a/src/assets/help-ss/commenting-shift-overview.png b/src/assets/help-ss/commenting-shift-overview.png new file mode 100644 index 0000000..777ab71 Binary files /dev/null and b/src/assets/help-ss/commenting-shift-overview.png differ diff --git a/src/assets/help-ss/commenting-shift.png b/src/assets/help-ss/commenting-shift.png new file mode 100644 index 0000000..1d4a7e1 Binary files /dev/null and b/src/assets/help-ss/commenting-shift.png differ diff --git a/src/assets/help-ss/create-employee.png b/src/assets/help-ss/create-employee.png new file mode 100644 index 0000000..c225a7a Binary files /dev/null and b/src/assets/help-ss/create-employee.png differ diff --git a/src/assets/help-ss/create-shift-overview.png b/src/assets/help-ss/create-shift-overview.png new file mode 100644 index 0000000..9b806ef Binary files /dev/null and b/src/assets/help-ss/create-shift-overview.png differ diff --git a/src/assets/help-ss/create-shift.png b/src/assets/help-ss/create-shift.png new file mode 100644 index 0000000..cf89658 Binary files /dev/null and b/src/assets/help-ss/create-shift.png differ diff --git a/src/assets/help-ss/dashboard.png b/src/assets/help-ss/dashboard.png new file mode 100644 index 0000000..8994075 Binary files /dev/null and b/src/assets/help-ss/dashboard.png differ diff --git a/src/assets/help-ss/default-dashboard.png b/src/assets/help-ss/default-dashboard.png new file mode 100644 index 0000000..30aae90 Binary files /dev/null and b/src/assets/help-ss/default-dashboard.png differ diff --git a/src/assets/help-ss/default-employee-list.png b/src/assets/help-ss/default-employee-list.png new file mode 100644 index 0000000..659ab37 Binary files /dev/null and b/src/assets/help-ss/default-employee-list.png differ diff --git a/src/assets/help-ss/default-employee-management.png b/src/assets/help-ss/default-employee-management.png new file mode 100644 index 0000000..a130bee Binary files /dev/null and b/src/assets/help-ss/default-employee-management.png differ diff --git a/src/assets/help-ss/default-personnal_profile.png b/src/assets/help-ss/default-personnal_profile.png new file mode 100644 index 0000000..290b501 Binary files /dev/null and b/src/assets/help-ss/default-personnal_profile.png differ diff --git a/src/assets/help-ss/default-timesheet.png b/src/assets/help-ss/default-timesheet.png new file mode 100644 index 0000000..21451b8 Binary files /dev/null and b/src/assets/help-ss/default-timesheet.png differ diff --git a/src/assets/help-ss/default-validation-page.png b/src/assets/help-ss/default-validation-page.png new file mode 100644 index 0000000..b06da43 Binary files /dev/null and b/src/assets/help-ss/default-validation-page.png differ diff --git a/src/assets/help-ss/delete-expense.png b/src/assets/help-ss/delete-expense.png new file mode 100644 index 0000000..ffa4f59 Binary files /dev/null and b/src/assets/help-ss/delete-expense.png differ diff --git a/src/assets/help-ss/delete-shift.png b/src/assets/help-ss/delete-shift.png new file mode 100644 index 0000000..f3e8e77 Binary files /dev/null and b/src/assets/help-ss/delete-shift.png differ diff --git a/src/assets/help-ss/employee-list-grid.png b/src/assets/help-ss/employee-list-grid.png new file mode 100644 index 0000000..fce4f85 Binary files /dev/null and b/src/assets/help-ss/employee-list-grid.png differ diff --git a/src/assets/help-ss/employee-list.png b/src/assets/help-ss/employee-list.png new file mode 100644 index 0000000..02541c6 Binary files /dev/null and b/src/assets/help-ss/employee-list.png differ diff --git a/src/assets/help-ss/expenses.png b/src/assets/help-ss/expenses.png new file mode 100644 index 0000000..a2fa886 Binary files /dev/null and b/src/assets/help-ss/expenses.png differ diff --git a/src/assets/help-ss/personal_infos.png b/src/assets/help-ss/personal_infos.png new file mode 100644 index 0000000..89c0ba3 Binary files /dev/null and b/src/assets/help-ss/personal_infos.png differ diff --git a/src/assets/help-ss/preferences.png b/src/assets/help-ss/preferences.png new file mode 100644 index 0000000..08c87ce Binary files /dev/null and b/src/assets/help-ss/preferences.png differ diff --git a/src/assets/help-ss/professionnal_infos.png b/src/assets/help-ss/professionnal_infos.png new file mode 100644 index 0000000..5a976ea Binary files /dev/null and b/src/assets/help-ss/professionnal_infos.png differ diff --git a/src/assets/help-ss/schedule-preset-management.png b/src/assets/help-ss/schedule-preset-management.png new file mode 100644 index 0000000..afa5158 Binary files /dev/null and b/src/assets/help-ss/schedule-preset-management.png differ diff --git a/src/assets/help-ss/search-bar.png b/src/assets/help-ss/search-bar.png new file mode 100644 index 0000000..735c018 Binary files /dev/null and b/src/assets/help-ss/search-bar.png differ diff --git a/src/assets/help-ss/terminated-employee-list.png b/src/assets/help-ss/terminated-employee-list.png new file mode 100644 index 0000000..b16b811 Binary files /dev/null and b/src/assets/help-ss/terminated-employee-list.png differ diff --git a/src/assets/help-ss/timesheet-appovals-list.png b/src/assets/help-ss/timesheet-appovals-list.png new file mode 100644 index 0000000..8dcd3bb Binary files /dev/null and b/src/assets/help-ss/timesheet-appovals-list.png differ diff --git a/src/assets/help-ss/timesheet-approvals.png b/src/assets/help-ss/timesheet-approvals.png new file mode 100644 index 0000000..d9c6c3c Binary files /dev/null and b/src/assets/help-ss/timesheet-approvals.png differ diff --git a/src/assets/help-ss/timesheet-details.png b/src/assets/help-ss/timesheet-details.png new file mode 100644 index 0000000..b60e4ee Binary files /dev/null and b/src/assets/help-ss/timesheet-details.png differ diff --git a/src/assets/help-ss/timesheets.png b/src/assets/help-ss/timesheets.png new file mode 100644 index 0000000..9042866 Binary files /dev/null and b/src/assets/help-ss/timesheets.png differ diff --git a/src/assets/help-ss/update-employee.png b/src/assets/help-ss/update-employee.png new file mode 100644 index 0000000..6d89b41 Binary files /dev/null and b/src/assets/help-ss/update-employee.png differ diff --git a/src/assets/help-ss/update-expense.png b/src/assets/help-ss/update-expense.png new file mode 100644 index 0000000..9d60290 Binary files /dev/null and b/src/assets/help-ss/update-expense.png differ diff --git a/src/assets/help-ss/update-shift.png b/src/assets/help-ss/update-shift.png new file mode 100644 index 0000000..a653aa9 Binary files /dev/null and b/src/assets/help-ss/update-shift.png differ diff --git a/src/i18n/en-ca/index.ts b/src/i18n/en-ca/index.ts index 1ba8913..e15536a 100644 --- a/src/i18n/en-ca/index.ts +++ b/src/i18n/en-ca/index.ts @@ -1,4 +1,58 @@ export default { + dashboard: { + welcome: "Welcome to the Targo App!", + }, + help: { + label: "Centre d'aide", + tutorial: { + dashboard: { + title: "Home Page", + news_feed: "News Feed", + chat_bot: "Technical chat-bot", + notifications: "Notifications", + }, + personal_profile: { + title: "Personnal Profile", + personal_info: "Personal informations", + professional_info: "Professional informations", + }, + timesheets: { + title: "Timesheet", + create_shift: "Add a new shift", + update_shift: "Update an existing shift", + delete_shift: "Removing a shift from the timesheet", + comment_shift: "Commenting a shift", + create_expense: "Add a new expense", + update_expense: "Update an existing expense", + delete_expense: "Removing an expense from the list", + + }, + employee_list: { + title: "Employee List", + terminated_employees: "Inactive employees", + }, + employee_management: { + title: "Employee Management", + create_employee: "Creating a new employee", + update_employee: "Updating an existing employee's informations", + module_access: "App managing access tool", + schedule_preset: "Schedule preset management", + terminating_employee: "terminate an employee", + }, + timesheets_approval: { + title: "Timesheets approval", + approval: "timesheet approvals", + inspect: "Inspect timesheets", + comment_expense: "Commenting an expense", + }, + shared: { + search: "Advance search", + preferences: "Display mode", + calendar: "Navigation using the calendar", + display: "Display as cards or as a list" + }, + }, + }, employee_list: { page_header: "Employee Directory", table: { @@ -290,4 +344,75 @@ export default { button_detailed_view: "detailed view", }, }, + descriptions: { + dashboard: { + menu: "To access the main menu, click the button located in the upper-left corner. This menu allows you to navigate through the entire application.", + news_feed: "General announcements and important updates are displayed here. This view is the same for all employees.", + notifications: "Notifications are accessible via the bell icon located in the upper-right corner. They allow you to quickly view information relevant to you, \ + such as leave, vacation, or absence requests, overtime hours worked during the current week, \ + and comments left by your supervisor.", + chat_bot: "To access the bot, simply click on the \"bot\" bubble. The conversational bot allows you to quickly find information about a client, \ + an invoice, or a device.", + }, + personal_profile: { + personal_info: "In the \"Personal\" tab, you can view your personal information, such as your name, phone numbers, \ + address, and date of birth.", + professional_info: "In the \"Career\" tab, you can view your professional information, including your position, the name of the company you work for, \ + your supervisor's name and email address, as well as your hire date.", + preferences: "In the \"Preferences\" tab, you can adjust certain settings based on your personal preferences, such as dark mode, \ + language, and notifications.", + }, + timesheets: { + create_shift: "To add a work shift, click the green \"Add Time\" tab and enter the following required information: \ + the shift type, start time, end time, and whether the shift is on-site or remote. \ + Then click \"Save\", located in the upper-right corner of the time card.", + update_shift: "To modify a work shift, click the information you want to update, adjust the value, then click \"Save\", \ + located in the upper-right corner of the time card.", + delete_shift: "To delete a work shift, click the red trash icon associated with the entry.", + comment_shift: "To leave a comment on a work shift, click the conversation bubble icon located to the right of the shift entry, \ + then click \"Save\" in the upper-right corner of the time card.", + create_expense: "To add an expense, access the expense list using the button located in the upper-right corner. \ + You must then complete the following fields: the date (today's date is selected by default), the expense type, \ + the amount or mileage, a comment justifying the expense, and attach a supporting document. \ + Then click the \"Add\" button.", + update_expense: "To modify an expense, access the expense list, select the expense you wish to edit, make the necessary changes, \ + then click \"Update\" to save.", + delete_expense: "To delete an expense, access the expense list and click the red trash icon.", + }, + employee_list: { + terminated_employees: "This option allows you to show or hide employees who are no longer employed.", + }, + employee_management: { + create_employee: "To create an employee, access the \"Add Employee\" menu located in the upper-left corner of the employee list. \ + In the \"Details\" tab, first enter all required information, excluding the termination date. \ + Then assign the appropriate access rights to the employee. Optionally, you may assign a preset schedule. \ + Click \"Save\" to confirm the employee creation.", + update_employee: "To update an employee's information, access rights, or schedule, select the employee's profile and navigate to the appropriate tab. \ + Make the necessary changes, then click \"Update\" to confirm.", + module_access: "To manage access to different parts of the application, select the desired employee's profile and navigate to the \"Access\" tab. \ + Two selection options are available: by role or by module. If the employee is a supervisor, the \"Administrator\" role is recommended. \ + For a standard employee, the \"Employee\" role is appropriate. Specific modules can also be selected in special cases.", + schedule_preset: "To assign, modify, or create a schedule for an employee, first select the employee, then navigate to the \"Schedule\" tab in the edit menu. \ + You may select an existing schedule, create a new one by assigning a unique name, or copy an existing schedule, modify it, and rename it. \ + Once satisfied, click \"Update\" to confirm your selection.", + terminating_employee: "To terminate an employee, select the employee's profile (or row). Once the edit menu is displayed, \ + enter the termination date and click \"Update\".", + }, + timesheets_approval: { + approval: "To approve a timesheet, click the bottom of the card where the lock icon is located. In list view, \ + click the lock icon on the right side of the corresponding row.", + inspect: "To review an employee's work shifts or expenses, click the briefcase icon located in the upper-right corner. \ + You will find statistics on hours worked as well as expenses incurred. Within this window, you may edit work shifts \ + and expenses. Click \"Save\" to confirm the changes.", + comment_expense: "To leave a comment on an expense submitted by an employee, click the briefcase icon on the desired employee's card. \ + Navigate to the expense list and click the supervisor comment bubble. \ + Click \"Save\" to confirm your comment.", + }, + shared: { + display: "This option allows you to choose the display mode that best suits your needs, either card view or detailed list view.", + search: "An advanced keyword search is available. Simply separate each keyword with a space, and the search bar will return results \ + that include all entered keywords.", + calendar: "The calendar speeds up navigation. It allows you to select a specific date and display the pay period that includes the selected date.", + }, + }, }; \ No newline at end of file diff --git a/src/i18n/fr-ca/index.ts b/src/i18n/fr-ca/index.ts index 698baeb..61e9e2a 100644 --- a/src/i18n/fr-ca/index.ts +++ b/src/i18n/fr-ca/index.ts @@ -1,4 +1,58 @@ export default { + dashboard: { + welcome: "Bienvenue dans l'application Targo!", + }, + help: { + label: "Centre d'aide", + tutorial: { + dashboard: { + title: "Page d'accueil", + menu: "Menu Principal", + news_feed: "Fil d'actualités", + chat_bot: "Robot conversationnel d'aide technique", + notifications: "Notifications", + }, + personal_profile: { + title: "Profil", + personal_info: "Informations personnelles", + professional_info: "Informations professionnelles", + }, + timesheets: { + title: "Carte de temps", + create_shift: "Inscrire un nouveau quart de travail", + update_shift: "Modifier un quart de travail existant", + delete_shift: "Supprimer un quart de travail de la carte de temps", + comment_shift: "Commenter un quart de travail", + create_expense: "Inscrire une dépense", + update_expense: "Modifier une dépense", + delete_expense: "Supprimer une dépense", + }, + employee_list: { + title: "Répertoire des employés ", + terminated_employees: "Employés inactifs", + }, + employee_management: { + title: "Gestion des employés ", + create_employee: "Création d'un nouvel employé", + update_employee: "Modifier les informations d'un employé", + module_access: "Outils de gestion des accès de l'application", + schedule_preset: "Gestion des horaires prédéterminés", + terminating_employee: "Rendre un employé inactif", + }, + timesheets_approval: { + title: "Validation de Carte de temps", + approval: "Validation des cartes de temps", + inspect: "Inspect timesheets", + comment_expense: "Commenter une dépense", + }, + shared: { + search: "Recherche avancée", + preferences: "Options de préférences d'affichage", + calendar: "Navigation avec l'aide du calendrier", + display: "Affichage par Cartes ou par Liste" + }, + }, + }, employee_list: { page_header: "Répertoire du personnel", table: { @@ -291,4 +345,76 @@ export default { button_detailed_view: "vue détaillée", }, }, + descriptions: { + dashboard: { + menu: "Pour accéder au menu principal, cliquez sur le bouton situé dans le coin supérieur gauche. Ce menu vous permet de naviguer à travers l'ensemble de l'application.", + news_feed: "Des annonces générales et des points importants y sont présentés. Cet affichage est identique pour l'ensemble des employés.", + notifications: "Les notifications sont accessibles via la clochette située dans le coin supérieur droit. Elles permettent de consulter rapidement les informations qui vous concernent, \ + par exemple : les demandes de congé, de vacances ou d'absence, les heures supplémentaires effectuées durant la semaine courante, \ + ainsi que les commentaires laissés par votre superviseur.", + chat_bot: "Pour accéder au robot, il suffit de cliquer sur la bulle « robot ». Le robot conversationnel vous permet de trouver rapidement de l'information sur un client, \ + une facture ou un appareil.", + }, + personal_profile: { + personal_info: "Dans l'onglet « Personnel », vous pouvez consulter vos informations personnelles, telles que votre nom, vos numéros de téléphone, \ + votre adresse et votre date de naissance.", + professional_info: "Dans l'onglet « Carrière », vous pouvez consulter vos informations professionnelles, comme votre poste, le nom de l'entreprise pour laquelle vous travaillez, \ + le nom et l'adresse courriel de votre superviseur, ainsi que votre date d'embauche.", + preferences: "Dans l'onglet « Préférences », vous pouvez ajuster certains paramètres selon vos préférences personnelles, tels que le mode sombre, \ + la langue et les notifications.", + }, + timesheets: { + create_shift: "Pour ajouter un quart de travail, cliquez sur l'onglet vert « Ajouter du temps » et saisissez les informations obligatoires suivantes : \ + le type de quart, l'heure de début, l'heure de fin, ainsi que le mode de travail (présentiel ou télétravail). \ + Cliquez ensuite sur « Sauvegarder », situé dans le coin supérieur droit de la carte de temps.", + update_shift: "Pour modifier un quart de travail, cliquez sur l'information à modifier, ajustez la valeur souhaitée, puis cliquez sur « Sauvegarder », \ + situé dans le coin supérieur droit de la carte de temps.", + delete_shift: "Pour supprimer un quart de travail, cliquez sur l'icône de poubelle rouge associée à l'entrée.", + comment_shift: "Pour laisser un commentaire sur un quart de travail, cliquez sur l'icône de bulle conversationnelle située à droite de l'entrée du quart de travail, \ + puis cliquez sur « Sauvegarder », dans le coin supérieur droit de la carte de temps.", + create_expense: "Pour ajouter une dépense, accédez à la liste des dépenses à l'aide du bouton situé dans le coin supérieur droit. \ + Vous devez ensuite remplir les champs suivants : la date (la date du jour est sélectionnée par défaut), le type de dépense, \ + le montant ou le kilométrage effectué, un commentaire justifiant la dépense, et joindre une pièce justificative. \ + Cliquez ensuite sur le bouton « Ajouter ».", + update_expense: "Pour modifier une dépense, accédez à la liste des dépenses, sélectionnez la dépense à modifier, apportez les changements nécessaires, \ + puis cliquez sur « Modifier » pour sauvegarder.", + delete_expense: "Pour supprimer une dépense, accédez à la liste des dépenses et cliquez sur l'icône de poubelle rouge.", + }, + employee_list: { + terminated_employees: "Cette option vous permet d'afficher ou de masquer les employés qui ne sont plus à l'emploi.", + }, + employee_management: { + create_employee: "Pour créer un employé, accédez au menu « Ajouter un employé », situé dans le coin supérieur gauche de la liste des employés. \ + Dans l'onglet « Détails », vous devez d'abord saisir l'ensemble des informations requises, à l'exception de la date de départ. \ + Ensuite, attribuez les accès nécessaires à l'employé. Optionnellement, vous pouvez lui assigner un horaire préfabriqué. \ + Cliquez sur « Sauvegarder » pour confirmer la création de l'employé.", + update_employee: "Pour mettre à jour les informations, les accès ou l'horaire d'un employé, sélectionnez son portrait et naviguez vers l'onglet approprié. \ + Apportez les modifications nécessaires, puis cliquez sur « Mettre à jour » pour confirmer.", + module_access: "Pour gérer les accès aux différentes parties de l'application, sélectionnez le portrait de l'employé désiré, puis accédez à l'onglet « Accès ». \ + Deux options sont disponibles : par rôle ou par module. Si l'employé est superviseur, le rôle « Administrateur » est suggéré. \ + Pour un employé standard, le rôle « Employé » est recommandé. Il est également possible de sélectionner des modules spécifiques dans certains cas.", + schedule_preset: "Pour attribuer, modifier ou créer un horaire pour un employé, sélectionnez d'abord l'employé, puis accédez à l'onglet « Horaire » du menu de modification. \ + Vous pouvez choisir un horaire existant, créer un nouvel horaire en lui donnant un nom unique, ou copier un horaire existant, le modifier et le renommer. \ + Une fois satisfait, cliquez sur « Mettre à jour » pour confirmer votre choix.", + terminating_employee: "Pour mettre fin à l'emploi d'un employé, sélectionnez son portrait (ou sa ligne). Une fois le menu de modification affiché, \ + entrez la date de départ et cliquez sur « Mettre à jour ».", + }, + timesheets_approval: { + approval: "Pour approuver une feuille de temps, cliquez sur le bas de la carte où se trouve l'icône de cadenas. En mode liste, \ + cliquez sur le cadenas situé à droite de la ligne correspondante.", + inspect: "Pour consulter les informations relatives aux quarts de travail ou aux dépenses d'un employé, cliquez sur l'icône de valise située dans le coin supérieur droit. \ + Vous y trouverez des statistiques sur les heures travaillées ainsi que les dépenses effectuées. Dans cette fenêtre, il est possible de modifier des quarts de travail \ + et des dépenses. Cliquez sur « Sauvegarder » pour confirmer les modifications.", + comment_expense: "Pour laisser un commentaire sur une dépense soumise par un employé, cliquez sur l'icône de valise associée à la carte de l'employé désiré. \ + Accédez à la liste des dépenses et cliquez sur la bulle de commentaire du superviseur. \ + Cliquez sur « Sauvegarder » pour confirmer votre commentaire.", + }, + shared: { + display: "Cette option permet de choisir le mode d'affichage qui vous convient le mieux, soit par carte ou sous forme de liste détaillée.", + search: "Il est possible d'effectuer une recherche avancée par mots-clés. Il suffit de séparer chaque mot par un espace, et la barre de recherche affichera \ + les résultats contenant l'ensemble des mots-clés saisis.", + calendar: "Le calendrier facilite la navigation. Il vous permet de sélectionner une date précise et d'afficher la période de paie qui inclut cette date.", + }, + }, + }; \ No newline at end of file diff --git a/src/modules/help/components/help-module.vue b/src/modules/help/components/help-module.vue new file mode 100644 index 0000000..315b9ed --- /dev/null +++ b/src/modules/help/components/help-module.vue @@ -0,0 +1,145 @@ + + + + + \ No newline at end of file diff --git a/src/modules/help/models/help-module.model.ts b/src/modules/help/models/help-module.model.ts new file mode 100644 index 0000000..2a09d25 --- /dev/null +++ b/src/modules/help/models/help-module.model.ts @@ -0,0 +1,153 @@ +import type { UserModuleAccess } from 'src/modules/shared/models/user.models'; + +export type HelpModuleOptions = { + label: string; + path: string; + description: string; + icon: string; +}; + +export type Options = Record; +export type PartialOptions = Partial>; + + + +//Shared images and descriptions +import calendar from 'src/assets/help-ss/calendar.png'; +import employee_list_display from 'src/assets/help-ss/employee-list-grid.png'; +import employee_list_card from 'src/assets/help-ss/employee-list.png'; +import search_bar from 'src/assets/help-ss/search-bar.png'; + +const calendar_nav_desc = "descriptions.shared.calendar"; +const display_desc = "descriptions.shared.display"; +const search_bar_desc = "descriptions.shared.search"; + +// Dashboard images and descriptions +import dashboard from 'src/assets/help-ss/dashboard.png'; +import menu from 'src/assets/help-ss/dashboard.png'; +import notifications from 'src/assets/help-ss/dashboard.png'; +import chatbot from 'src/assets/help-ss/dashboard.png'; + +const menu_desc = "descriptions.dashboard.menu"; +const news_feed_desc = "descriptions.dashboard.news_feed"; +const chat_bot_desc = "descriptions.dashboard.chat_bot"; +const notification_desc = "descriptions.dashboard.notifications"; + +export const dashboard_options: HelpModuleOptions[] = [ + { label: 'help.tutorial.dashboard.menu', path: dashboard, description: menu_desc, icon: 'menu' }, + { label: 'help.tutorial.dashboard.news_feed', path: menu, description: news_feed_desc, icon: 'newspaper' }, + { label: 'help.tutorial.dashboard.notifications', path: notifications, description: notification_desc, icon: 'notifications_active' }, + { label: 'help.tutorial.dashboard.chat_bot', path: chatbot, description: chat_bot_desc, icon: 'smart_toy' }, +]; + +// profile images and descriptions +import personal_info from 'src/assets/help-ss/personal_infos.png'; +import professionnal_info from 'src/assets/help-ss/professionnal_infos.png'; +import preferences from 'src/assets/help-ss/preferences.png'; + +const personal_infos_desc = "descriptions.personal_profile.personal_info"; +const professional_info_desc = "descriptions.personal_profile.professional_info"; +const preferences_details_desc = "descriptions.personal_profile.preferences"; + +export const profile_options: HelpModuleOptions[] = [ + { label: 'help.tutorial.personal_profile.personal_info', path: personal_info, description: personal_infos_desc, icon: 'contact_page' }, + { label: 'help.tutorial.personal_profile.professional_info', path: professionnal_info, description: professional_info_desc, icon: 'badge' }, + { label: 'help.tutorial.shared.preferences', path: preferences, description: preferences_details_desc, icon: 'display_settings' }, +]; + +// timesheet images and descriptions +import create_shift from 'src/assets/help-ss/create-shift.png'; +import update_shift from 'src/assets/help-ss/update-shift.png'; +import delete_shift from 'src/assets/help-ss/delete-shift.png'; +import comment_shift from 'src/assets/help-ss/commenting-shift.png'; +import create_expense from 'src/assets/help-ss/expenses.png'; +import delete_expense from 'src/assets/help-ss/delete-expense.png'; +import update_expense from 'src/assets/help-ss/update-expense.png'; + +const create_shift_desc = "descriptions.timesheets.create_shift"; +const update_shift_desc = "descriptions.timesheets.update_shift"; +const delete_shift_desc = "descriptions.timesheets.delete_shift"; +const comment_shift_desc = "descriptions.timesheets.comment_shift"; +const create_expense_desc = "descriptions.timesheets.create_expense"; +const update_expense_desc = "descriptions.timesheets.update_expense"; +const delete_expense_desc = "descriptions.timesheets.delete_expense"; + +export const timesheets_options: HelpModuleOptions[] = [ + { label: 'help.tutorial.timesheets.create_shift', path: create_shift, description: create_shift_desc, icon: 'add' }, + { label: 'help.tutorial.timesheets.update_shift', path: update_shift, description: update_shift_desc, icon: 'create' }, + { label: 'help.tutorial.timesheets.delete_shift', path: delete_shift, description: delete_shift_desc, icon: 'las la-trash' }, + { label: 'help.tutorial.timesheets.comment_shift', path: comment_shift, description: comment_shift_desc, icon: 'chat_bubble_outline' }, + { label: 'help.tutorial.timesheets.create_expense', path: create_expense, description: create_expense_desc, icon: 'add' }, + { label: 'help.tutorial.timesheets.update_expense', path: update_expense, description: update_expense_desc, icon: 'create' }, + { label: 'help.tutorial.timesheets.delete_expense', path: delete_expense, description: delete_expense_desc, icon: 'clear' }, + { label: 'help.tutorial.shared.calendar', path: calendar, description: calendar_nav_desc, icon: 'calendar_month' }, +]; + +// employee management images and descriptions +import terminated_employee_display from 'src/assets/help-ss/terminated-employee-list.png'; +import create_employee from 'src/assets/help-ss/create-employee.png'; +import update_employee from 'src/assets/help-ss/update-employee.png'; +import access_management from 'src/assets/help-ss/access-management.png'; +import schedule_preset from 'src/assets/help-ss/schedule-preset-management.png'; + +const terminated_employee_desc = "descriptions.employee_list.terminated_employees"; +const terminating_employee_desc = "descriptions.employee_management.terminating_employee"; +const create_employee_desc = "descriptions.employee_management.create_employee"; +const update_employee_desc = "descriptions.employee_management.update_employee"; +const module_access_desc = "descriptions.employee_management.module_access"; +const schedule_preset_desc = "descriptions.employee_management.schedule_preset"; + + +export const employee_list_options: HelpModuleOptions[] = [ + { label: 'help.tutorial.employee_list.terminated_employees', path: terminated_employee_display, description: terminated_employee_desc, icon: 'work_off' }, + { label: 'help.tutorial.shared.display', path: employee_list_card, description: display_desc, icon: 'display_settings' }, + { label: 'help.tutorial.shared.search', path: search_bar, description: search_bar_desc, icon: 'search' }, +]; + +export const employee_management_options: HelpModuleOptions[] = [ + { label: 'help.tutorial.employee_list.terminated_employees', path: terminated_employee_display, description: terminated_employee_desc, icon: 'work_off' }, + { label: 'help.tutorial.employee_management.create_employee', path: create_employee, description: create_employee_desc, icon: 'person_add' }, + { label: 'help.tutorial.employee_management.update_employee', path: update_employee, description: update_employee_desc, icon: 'las la-id-card' }, + { label: 'help.tutorial.employee_management.module_access', path: access_management, description: module_access_desc, icon: 'las la-key' }, + { label: 'help.tutorial.employee_management.schedule_preset', path: schedule_preset, description: schedule_preset_desc, icon: 'calendar_month' }, + { label: 'help.tutorial.employee_management.terminating_employee', path: update_employee, description: terminating_employee_desc, icon: 'work_off' }, + { label: 'help.tutorial.shared.display', path: employee_list_display, description: display_desc, icon: 'display_settings' }, + { label: 'help.tutorial.shared.search', path: search_bar, description: search_bar_desc, icon: 'search' }, +]; + +// Timesheets approval images and descriptions +import comment_expense from 'src/assets/help-ss/timesheet-details.png'; +import timesheet_approval_inspect from 'src/assets/help-ss/timesheet-approvals.png'; +import timesheet_details from 'src/assets/help-ss/timesheet-details.png'; +import timesheet_approval_list from 'src/assets/help-ss/timesheet-appovals-list.png'; + + +const comment_expense_desc = "descriptions.timesheets_approval.comment_expense"; +const timesheets_approval_desc = "descriptions.timesheets_approval.approval"; +const timesheets_approval_inspect_desc = "descriptions.timesheets_approval.inspect"; + +export const timesheets_approval_options: HelpModuleOptions[] = [ + { label: 'help.tutorial.timesheets_approval.approval', path: timesheet_approval_inspect, description: timesheets_approval_desc, icon: 'verified' }, + { label: 'help.tutorial.timesheets_approval.inspect', path: timesheet_details, description: timesheets_approval_inspect_desc, icon: 'work_history' }, + { label: 'help.tutorial.timesheets_approval.comment_expense', path: comment_expense, description: comment_expense_desc, icon: 'chat_bubble_outline' }, + { label: 'help.tutorial.shared.display', path: timesheet_approval_list, description: display_desc, icon: 'display_settings' }, + { label: 'help.tutorial.shared.search', path: search_bar, description: search_bar_desc, icon: 'search' }, + { label: 'help.tutorial.shared.calendar', path: calendar, description: calendar_nav_desc, icon: 'calendar_month' }, +]; + + + + +export const help_module_details: Options = { + dashboard: [], + personal_profile: profile_options, + timesheets: timesheets_options, + employee_list: employee_list_options, + employee_management: employee_management_options, + timesheets_approval: timesheets_approval_options, +}; + + + + + diff --git a/src/modules/help/services/help.service.ts b/src/modules/help/services/help.service.ts new file mode 100644 index 0000000..ccd8ba2 --- /dev/null +++ b/src/modules/help/services/help.service.ts @@ -0,0 +1,10 @@ +import { api } from "src/boot/axios"; +import type { BackendResponse } from "src/modules/shared/models/backend-response.models"; +import type { UserModuleAccess } from "src/modules/shared/models/user.models"; + +export const HelpService = { + getHelpModules: async (): Promise> => { + const response = await api.get>(`/help`); + return response.data; + } +} \ No newline at end of file diff --git a/src/modules/shared/models/user.models.ts b/src/modules/shared/models/user.models.ts index d97ae27..a4c46c8 100644 --- a/src/modules/shared/models/user.models.ts +++ b/src/modules/shared/models/user.models.ts @@ -3,7 +3,7 @@ export interface User { last_name: string; email: string; role: UserRole; - user_module_access: UserModuleAccess; + user_module_access: UserModuleAccess[]; } export type UserRole = 'ADMIN' | 'SUPERVISOR' | 'HR' | 'ACCOUNTING' | 'EMPLOYEE' | 'DEALER' | 'CUSTOMER' | 'GUEST'; diff --git a/src/pages/dashboard-page.vue b/src/pages/dashboard-page.vue index 6071010..1ee807b 100644 --- a/src/pages/dashboard-page.vue +++ b/src/pages/dashboard-page.vue @@ -61,7 +61,7 @@ >
- Welcome to App Targo! + {{ $t('dashboard.welcome') }}
diff --git a/src/pages/help-page.vue b/src/pages/help-page.vue index e69de29..4e3de2a 100644 --- a/src/pages/help-page.vue +++ b/src/pages/help-page.vue @@ -0,0 +1,32 @@ + + + \ No newline at end of file diff --git a/src/router/router-constants.ts b/src/router/router-constants.ts index 3297a47..f946e0e 100644 --- a/src/router/router-constants.ts +++ b/src/router/router-constants.ts @@ -8,6 +8,6 @@ export enum RouteNames { PROFILE = 'personal_profile', TIMESHEET = 'timesheets', HELP = 'help', - + ERROR = 'error', } \ No newline at end of file diff --git a/src/router/routes.ts b/src/router/routes.ts index b217d9e..26c2bd7 100644 --- a/src/router/routes.ts +++ b/src/router/routes.ts @@ -4,12 +4,12 @@ import { ModuleNames } from 'src/modules/shared/models/user.models'; const routes: RouteRecordRaw[] = [ { - path: '/', + path: '/', component: () => import('src/layouts/main-layout.vue'), meta: { requires_auth: true }, children: [ - { - path: '', + { + path: '', name: RouteNames.DASHBOARD, component: () => import('src/pages/dashboard-page.vue'), meta: { required_module: ModuleNames.DASHBOARD } @@ -38,18 +38,23 @@ const routes: RouteRecordRaw[] = [ component: () => import('src/pages/profile-page.vue'), meta: { required_module: ModuleNames.PERSONAL_PROFILE }, }, + { + path: 'help', + name: RouteNames.HELP, + component: () => import('src/pages/help-page.vue'), + }, ], }, { - path: '/v1/login', + path: '/v1/login', name: RouteNames.LOGIN, component: () => import('src/pages/login-page.vue'), meta: { requires_auth: false }, }, { - path: '/login-success', + path: '/login-success', name: RouteNames.LOGIN_SUCCESS, component: () => import('src/modules/auth/pages/auth-login-popup-success.vue'), meta: { requires_auth: false }, diff --git a/src/stores/help-store.ts b/src/stores/help-store.ts new file mode 100644 index 0000000..df89732 --- /dev/null +++ b/src/stores/help-store.ts @@ -0,0 +1,37 @@ +import { defineStore } from "pinia"; +import { ref } from "vue"; +import { help_module_details } from "src/modules/help/models/help-module.model"; +import { useAuthStore } from "src/stores/auth-store"; +import type { HelpModuleOptions } from "src/modules/help/models/help-module.model"; +import type { UserModuleAccess } from "src/modules/shared/models/user.models"; + + + +export const useHelpStore = defineStore('help', () => { + const is_loading = ref(false); + const user_modules = ref>(); + const auth_store = useAuthStore(); + + const getFilteredModule = () => { + if(!auth_store.user) return; + + const entries = auth_store.user.user_module_access + .map((key) => { + const options = help_module_details[key]; + return options ? ([key, options] as const) : null; + }) + .filter( + (entry): entry is readonly [UserModuleAccess, HelpModuleOptions[]] => + entry !== null + ); + + user_modules.value = Object.fromEntries(entries) as Record; + } + + return { + is_loading, + user_modules, + help_module_details, + getFilteredModule, + }; +}); \ No newline at end of file