Index.vue 1.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <script setup>
  2. import { ref } from 'vue'
  3. import { Head, useForm } from '@inertiajs/inertia-vue3'
  4. import AppInputNumber from '@/components/AppInputNumber.vue'
  5. import AppLayout from '@/layouts/AppLayout.vue'
  6. const props = defineProps({
  7. id: Number,
  8. discount: Number,
  9. })
  10. const btnDisabled = ref(true)
  11. const form = useForm({
  12. discount: props.discount,
  13. })
  14. const submit = () => {
  15. if (form.discount == null) {
  16. form.discount = 0
  17. }
  18. form.post(route('discounts.store'), { onSuccess: () => (btnDisabled.value = true) })
  19. }
  20. </script>
  21. <template>
  22. <Head title="Pengaturan Diskon" />
  23. <AppLayout>
  24. <div class="grid">
  25. <div class="col-12 md:col-8">
  26. <Card>
  27. <template #title> Diskon </template>
  28. <template #content>
  29. <AppInputNumber
  30. label="Jumlah diskon"
  31. placeholder="jumlah diskon"
  32. :disabled="btnDisabled"
  33. :error="form.errors.discount"
  34. v-model="form.discount"
  35. />
  36. </template>
  37. <template #footer>
  38. <div class="flex flex-column sm:flex-row sm:justify-content-between sm:align-items-center">
  39. <Button
  40. label="Edit"
  41. icon="pi pi-pencil"
  42. class="p-button-text p-button-warning mb-3 sm:mb-0"
  43. @click="btnDisabled = false"
  44. />
  45. <Button
  46. label="Simpan"
  47. icon="pi pi-check"
  48. class="p-button-text"
  49. :disabled="form.processing"
  50. @click="submit"
  51. />
  52. </div>
  53. </template>
  54. </Card>
  55. </div>
  56. </div>
  57. </AppLayout>
  58. </template>