CreateButton.vue 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. <!--
  2. bouton Créer
  3. -->
  4. <template>
  5. <main>
  6. <v-btn
  7. elevation="2"
  8. color="ot_warning ot_white--text"
  9. @click="showDialog=true"
  10. >
  11. {{ $t('create') }}
  12. </v-btn>
  13. <lazy-LayoutDialog
  14. :show="showDialog"
  15. >
  16. <template #dialogType>{{ $t('creative_assistant') }}</template>
  17. <template #dialogTitle>
  18. <span v-if="type=='home'">{{ $t('what_do_you_want_to_create') }}</span>
  19. <span v-else-if="type=='access'">{{ $t('universal_create_title_access') }}</span>
  20. <span v-else-if="type=='event'">{{ $t('universal_create_title_event') }}</span>
  21. <span v-else-if="type=='message'">{{ $t('universal_create_title_message') }}</span>
  22. </template>
  23. <template #dialogText>
  24. <LayoutHeaderUniversalCreationGenerateCardsSteps :step="step" @updateStep="updateStep" />
  25. </template>
  26. <template #dialogBtn>
  27. <div class="text-center">
  28. <v-btn
  29. color="ot_super_light_grey"
  30. @click="showDialog=false;step=1;type='home'"
  31. >
  32. {{ $t('cancel') }}
  33. </v-btn>
  34. <v-btn
  35. v-if="step > 1"
  36. color="ot_super_light_grey"
  37. @click="step=1;type='home'"
  38. >
  39. {{ $t('previous') }}
  40. </v-btn>
  41. </div>
  42. </template>
  43. </lazy-LayoutDialog>
  44. </main>
  45. </template>
  46. <script lang="ts">
  47. import {defineComponent, Ref,ref} from '@nuxtjs/composition-api'
  48. export default defineComponent({
  49. setup () {
  50. const showDialog:Ref<Boolean> = ref(false);
  51. const step:Ref<Number> = ref(1);
  52. const type:Ref<String> = ref('home');
  53. const updateStep = ({stepChoice, typeChoice}: any) =>{
  54. step.value = stepChoice
  55. type.value = typeChoice
  56. }
  57. return {
  58. showDialog,
  59. updateStep,
  60. step,
  61. type
  62. }
  63. }
  64. })
  65. </script>
  66. <style scoped>
  67. </style>