-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Refactor GuideSecuringFirearm and footer / stepper css
- Loading branch information
1 parent
6e5b4d7
commit c005f1e
Showing
15 changed files
with
83 additions
and
232 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
134 changes: 73 additions & 61 deletions
134
frontend/src/views/GuideSecuringFirearm/GuideSecuringFirearm.vue
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,90 +1,102 @@ | ||
| <script lang="ts" setup> | ||
| import { useRouter } from 'vue-router' | ||
| import { isUserUsingCrosscall } from '@/utils/isUserUsingCrosscall' | ||
| import { securingGuideSteps } from '@/utils/firearms-utils/index' | ||
| import StepsGuide from '@/components/StepsGuide.vue' | ||
| const steps = ['Mise en garde', 'Consignes de sécurité', 'Photo'] | ||
| const currentStep = ref(0) | ||
| const router = useRouter() | ||
| const getNextRoute = () => { | ||
| if (currentStep.value < 0) { | ||
| router.push({ name: 'StartPage' }) | ||
| } else if (currentStep.value >= steps.length) { | ||
| router.push({ name: 'InstructionsPage' }) | ||
| } else { | ||
| router.push({ name: securingGuideSteps[currentStep.value] }) | ||
| } | ||
| } | ||
| </script> | ||
|
|
||
| <template> | ||
| <div class="mt-5 fr-container"> | ||
| <div class="result fr-col-11 fr-col-lg-6 mx-auto"> | ||
| <div> | ||
| <StepsGuide | ||
| class="my-auto" | ||
| :steps="steps" | ||
| :current-step="currentStep + 1" | ||
| /> | ||
| <h2 class="m-2.5"> | ||
| Mettre en sécurité mon arme | ||
| </h2> | ||
| <RouterView /> | ||
| </div> | ||
| <div class="fr-container mt-5"> | ||
| <div class="fr-col-12 fr-col-lg-6 fr-px-1w mx-auto"> | ||
| <StepsGuide | ||
| class="my-auto" | ||
| :steps="steps" | ||
| :current-step="currentStep + 1" | ||
| /> | ||
| <h2 class="fr-mt-2w"> | ||
| Mettre en sécurité mon arme | ||
| </h2> | ||
|
|
||
| <template v-if="currentStep === 0"> | ||
| <div v-if="isUserUsingCrosscall()"> | ||
| <p class="leading-7 mt-3"> | ||
| Vous allez recevoir des <span class="font-bold">instructions</span> pour <span class="font-bold">extraire des munitions</span> de l’arme. | ||
| En cas de doute, <span class="font-bold">arrêtez vous et faites appel à un expert</span>. | ||
| </p> | ||
| <div class="fr-col-sm-6 fr-col-lg-8 mx-auto text-center"> | ||
| <img | ||
| src="@/assets/guide-mise-en-securite/icones/preconisations.jpg" | ||
| alt="alt" | ||
| class="img-deco" | ||
| > | ||
| </div> | ||
| </div> | ||
| <div v-else> | ||
| <p class="leading-7 mt-3 pb-4"> | ||
| Vous allez recevoir des instructions pour <span class="font-bold">extraire des munitions</span> de l’arme. | ||
| Si vous avez le <span class="font-bold">moindre doute</span> quant à votre capacité à effectuer en toute sécurité les manœuvres qui suivent, <span class="font-bold">n’essayez pas de suivre les étapes suivantes</span>. | ||
| Contactez <span class="font-bold">la gendarmerie ou le commissariat le plus proche</span>. | ||
| </p> | ||
| <div class="fr-col-sm-6 fr-col-lg-8 mx-auto text-center"> | ||
| <img | ||
| src="@/assets/guide-mise-en-securite/icones/take-care.jpg" | ||
| alt="alt" | ||
| class="w-60 w-fr-mt-n4w" | ||
| > | ||
| </div> | ||
| </div> | ||
| </template> | ||
| <template v-if="currentStep === 1"> | ||
| <p class="leading-7 mt-3"> | ||
| Une arme doit <span class="font-bold">toujours</span> être <span class="font-bold">considérée comme chargée</span>. | ||
| </p> | ||
| <p> | ||
| <span class="font-bold">Toujours</span> maintenir l'arme dans une <span class="font-bold">DIRECTION | ||
| SÛRE</span>, en maintenant <span class="font-bold">le doigt hors du pontet</span>. | ||
| </p> | ||
| <div class="fr-col-sm-6 fr-col-lg-8 mx-auto text-center"> | ||
| <img | ||
| src="@/assets/guide-mise-en-securite/icones/consignes-securite.jpg" | ||
| alt="alt" | ||
| class="w-80 fr-mt-2w" | ||
| > | ||
| </div> | ||
| </template> | ||
| <template v-if="currentStep === 2"> | ||
| <p class="leading-7 mt-3"> | ||
| Pour que Basegun vous propose un <span class="font-bold">tutoriel adapté à votre arme</span>, vous serez | ||
| invité à prendre en photo votre arme et à préciser certains mécanismes sur l'arme. | ||
| </p> | ||
| <div class="fr-col-sm-6 fr-col-lg-8 mx-auto text-center"> | ||
| <img | ||
| src="@/assets/guide-mise-en-securite/icones/instructions.jpg" | ||
| alt="alt" | ||
| class="w-100 fr-mt-5w" | ||
| > | ||
| </div> | ||
| </template> | ||
| </div> | ||
| <div class="footer"> | ||
| <div | ||
| class="fr-col-11 fr-col-lg-6 footer-actions mx-auto" | ||
| > | ||
| <div class="fr-col-12 fr-col-lg-6 footer-actions mx-auto"> | ||
| <DsfrButton | ||
| class="m-1 flex justify-center w-100" | ||
| icon="ri-arrow-left-line" | ||
| :secondary="true" | ||
| label="Précédent" | ||
| @click="currentStep--; getNextRoute()" | ||
| @click="currentStep > 0 ? currentStep-- : $router.push({ name: 'StartPage' })" | ||
| /> | ||
| <DsfrButton | ||
| class="m-1 flex justify-center w-100" | ||
| icon="ri-arrow-right-line" | ||
| data-testid="button-next" | ||
| label="Suivant" | ||
| :icon-right="true" | ||
| @click="currentStep++; getNextRoute()" | ||
| @click="currentStep < 2 ? currentStep++ : $router.push({ name: 'InstructionsPage' })" | ||
| /> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </template> | ||
|
|
||
| <style scoped> | ||
| .result { | ||
| margin: 0 auto; | ||
| max-width: 1000px; | ||
| } | ||
| h4 { | ||
| color: unset; | ||
| } | ||
| :deep(div.fr-stepper__steps) { | ||
| border-radius: 5px 5px 5px 5px; | ||
| } | ||
| :deep(.fr-stepper__state::after) { | ||
| content: " :\a"; | ||
| } | ||
| :deep(.fr-icon-home-3-line) { | ||
| color: var(--blue-france-sun-113-625); | ||
| } | ||
| .footer { | ||
| background-color: #fff; | ||
| box-shadow: 0 -4px 16px rgb(0 0 0 / 25%); | ||
| } | ||
| </style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
21 changes: 0 additions & 21 deletions
21
frontend/src/views/GuideSecuringFirearm/SecuringInstructions.vue
This file was deleted.
Oops, something went wrong.
20 changes: 0 additions & 20 deletions
20
frontend/src/views/GuideSecuringFirearm/SecuringIntroduction.vue
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.