Index.vue 1.6KB

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