FormComponent.vue 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. <template>
  2. <main>
  3. <v-form
  4. ref="form"
  5. v-model="valid"
  6. lazy-validation
  7. >
  8. <v-row>
  9. <slot></slot>
  10. </v-row>
  11. <v-btn
  12. class="mr-4 submitBtn"
  13. @click="submit"
  14. >
  15. submit
  16. </v-btn>
  17. </v-form>
  18. <AlertComponent type="success" v-if="saveOk">Sauvegarde Effectuée</AlertComponent>
  19. <AlertComponent type="error" v-if="saveKo">Sauvegarde Echouée</AlertComponent>
  20. </main>
  21. </template>
  22. <script lang="ts">
  23. import {defineComponent, ref, toRef} from '@nuxtjs/composition-api'
  24. import {Repository} from "@vuex-orm/core";
  25. import Vue from 'vue'
  26. export type VForm = Vue & { validate: () => boolean }
  27. export default defineComponent({
  28. props: {
  29. // repository:{
  30. // type: Object as () => Repository,
  31. // required: true
  32. // }
  33. },
  34. setup(){
  35. const valid = true
  36. const saveOk = ref(false)
  37. const saveKo = ref(false)
  38. return {
  39. valid,
  40. saveOk,
  41. saveKo
  42. }
  43. },
  44. methods:{
  45. async submit(){
  46. // const form:VForm = this.$refs.form;
  47. // if(form.validate()){
  48. // const model = await this.repository.find(parseInt(this.$route.params.id));
  49. // if(model){
  50. // const playload = model.$toJson();
  51. //
  52. // this.$http.$put(`https://local.new.api.opentalent.fr/api/${model.$entity}/${this.$route.params.id}`, playload)
  53. // .then(()=>{
  54. // this.saveOk=true
  55. // }, () =>{
  56. // this.saveKo=true
  57. // })
  58. //
  59. // setTimeout(()=>{
  60. // this.saveOk=false
  61. // this.saveKo=false
  62. // },2000)
  63. // }
  64. // }
  65. }
  66. }
  67. })
  68. </script>
  69. <style scoped>
  70. .submitBtn{
  71. margin-top: 20px;
  72. }
  73. </style>