From 57c311eaa18c829f497f747dcef67caedc0354e5 Mon Sep 17 00:00:00 2001
From: Yoga Pangestu <ypangestu976@gmail.com>
Date: Sun, 14 Jun 2026 02:17:27 +0700
Subject: [PATCH] style: update form input placeholders with descriptive
 examples for improved UX

---
 resources/js/components/LoginForm.vue                     | 2 +-
 resources/js/components/admin/hr/EmployeeForm.vue         | 8 ++++----
 .../admin/hr/leave-requests/RejectLeaveRequestModal.vue   | 2 +-
 .../admin/master/customers/CustomerFormModal.vue          | 6 +++---
 .../admin/master/raw-materials/RawMaterialForm.vue        | 2 +-
 .../admin/master/suppliers/SupplierFormModal.vue          | 6 +++---
 resources/js/pages/admin/account/Profile.vue              | 8 ++++----
 7 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/resources/js/components/LoginForm.vue b/resources/js/components/LoginForm.vue
index 54962d5..9dbc7e3 100644
--- a/resources/js/components/LoginForm.vue
+++ b/resources/js/components/LoginForm.vue
@@ -68,7 +68,7 @@ function submit() {
                                 id="login"
                                 v-model="form.login"
                                 type="text"
-                                placeholder="m@example.com"
+                                placeholder="Contoh: nama@perusahaan.com atau username"
                                 required
                             />
                             <FieldError :errors="formErrors(form, 'login')" />
diff --git a/resources/js/components/admin/hr/EmployeeForm.vue b/resources/js/components/admin/hr/EmployeeForm.vue
index 59a5060..f283f33 100644
--- a/resources/js/components/admin/hr/EmployeeForm.vue
+++ b/resources/js/components/admin/hr/EmployeeForm.vue
@@ -90,13 +90,13 @@ function submit() {
                         <FieldSet class="grid gap-4 md:grid-cols-3">
                             <Field>
                                 <FieldLabel for="email" required>Email</FieldLabel>
-                                <Input id="email" v-model="form.email" type="email" placeholder="nama@perusahaan.com"
+                                <Input id="email" v-model="form.email" type="email" placeholder="Contoh: nama@perusahaan.com"
                                     :maxlength="FIELD_LIMITS.email" />
                                 <FieldError :errors="formErrors(form, 'email')" />
                             </Field>
                             <Field>
                                 <FieldLabel for="username" required>Username</FieldLabel>
-                                <Input id="username" v-model="form.username" type="text" placeholder="username"
+                                <Input id="username" v-model="form.username" type="text" placeholder="Contoh: johndoe"
                                     :maxlength="FIELD_LIMITS.username" />
                                 <FieldError :errors="formErrors(form, 'username')" />
                             </Field>
@@ -129,7 +129,7 @@ function submit() {
                             <Field class="md:col-span-3">
                                 <FieldLabel for="full_name" required>Nama Lengkap</FieldLabel>
                                 <Input id="full_name" v-model="form.full_name" type="text"
-                                    placeholder="Nama lengkap pegawai" :maxlength="FIELD_LIMITS.fullName" />
+                                    placeholder="Contoh: John Doe" :maxlength="FIELD_LIMITS.fullName" />
                                 <FieldError :errors="formErrors(form, 'full_name')" />
                             </Field>
                             <Field>
@@ -157,7 +157,7 @@ function submit() {
                             </Field>
                             <Field class="md:col-span-3">
                                 <FieldLabel for="address">Alamat</FieldLabel>
-                                <Textarea id="address" v-model="form.address" placeholder="Alamat lengkap" rows="3" />
+                                <Textarea id="address" v-model="form.address" placeholder="Contoh: Jl. Sudirman No. 123, Jakarta" rows="3" />
                                 <FieldError :errors="formErrors(form, 'address')" />
                             </Field>
                         </FieldSet>
diff --git a/resources/js/components/admin/hr/leave-requests/RejectLeaveRequestModal.vue b/resources/js/components/admin/hr/leave-requests/RejectLeaveRequestModal.vue
index 89cda15..32b62aa 100644
--- a/resources/js/components/admin/hr/leave-requests/RejectLeaveRequestModal.vue
+++ b/resources/js/components/admin/hr/leave-requests/RejectLeaveRequestModal.vue
@@ -73,7 +73,7 @@ function submit() {
                     <FieldSet class="grid gap-4">
                         <Field>
                             <FieldLabel for="reject-reason" required>Alasan Penolakan</FieldLabel>
-                            <Textarea id="reject-reason" v-model="form.reason" placeholder="Tuliskan alasan penolakan"
+                            <Textarea id="reject-reason" v-model="form.reason" placeholder="Contoh: Kuota cuti untuk bulan ini sudah habis"
                                 rows="3" autofocus :maxlength="FIELD_LIMITS.reason" />
                             <FieldError :errors="formErrors(form, 'reason')" />
                         </Field>
diff --git a/resources/js/components/admin/master/customers/CustomerFormModal.vue b/resources/js/components/admin/master/customers/CustomerFormModal.vue
index 2c783da..64d75f1 100644
--- a/resources/js/components/admin/master/customers/CustomerFormModal.vue
+++ b/resources/js/components/admin/master/customers/CustomerFormModal.vue
@@ -97,20 +97,20 @@ function submit() {
                     <FieldSet class="grid gap-4">
                         <Field>
                             <FieldLabel for="customer-name" required>Nama</FieldLabel>
-                            <Input id="customer-name" v-model="form.name" type="text" placeholder="Nama customer"
+                            <Input id="customer-name" v-model="form.name" type="text" placeholder="Contoh: Budi Santoso"
                                 autofocus :maxlength="FIELD_LIMITS.name" />
                             <FieldError :errors="formErrors(form, 'name')" />
                         </Field>
                         <Field>
                             <FieldLabel for="customer-phone-number">Nomor Telepon</FieldLabel>
                             <PhoneNumberInput id="customer-phone-number" v-model="form.phone_number"
-                                placeholder="Nomor telepon customer" />
+                                placeholder="Contoh: 08123456789" />
                             <FieldError :errors="formErrors(form, 'phone_number')" />
                         </Field>
                         <Field>
                             <FieldLabel for="customer-address">Alamat</FieldLabel>
                             <Textarea id="customer-address" v-model="form.address" rows="3"
-                                placeholder="Alamat customer" />
+                                placeholder="Contoh: Jl. Mawar No. 12, Surabaya" />
                             <FieldError :errors="formErrors(form, 'address')" />
                         </Field>
                     </FieldSet>
diff --git a/resources/js/components/admin/master/raw-materials/RawMaterialForm.vue b/resources/js/components/admin/master/raw-materials/RawMaterialForm.vue
index 7f9277a..286859e 100644
--- a/resources/js/components/admin/master/raw-materials/RawMaterialForm.vue
+++ b/resources/js/components/admin/master/raw-materials/RawMaterialForm.vue
@@ -230,7 +230,7 @@ function submit() {
                         <FieldSet class="grid gap-4 md:grid-cols-2">
                             <Field>
                                 <FieldLabel for="name" required>Nama Bahan Baku</FieldLabel>
-                                <Input id="name" v-model="form.name" type="text" placeholder="Masukkan nama bahan baku"
+                                <Input id="name" v-model="form.name" type="text" placeholder="Contoh: Kain Katun Premium"
                                     :maxlength="FIELD_LIMITS.name" />
                                 <FieldError :errors="formErrors(form, 'name')" />
                             </Field>
diff --git a/resources/js/components/admin/master/suppliers/SupplierFormModal.vue b/resources/js/components/admin/master/suppliers/SupplierFormModal.vue
index 4f660f9..e296ad1 100644
--- a/resources/js/components/admin/master/suppliers/SupplierFormModal.vue
+++ b/resources/js/components/admin/master/suppliers/SupplierFormModal.vue
@@ -97,20 +97,20 @@ function submit() {
                     <FieldSet class="grid gap-4">
                         <Field>
                             <FieldLabel for="supplier-name" required>Nama</FieldLabel>
-                            <Input id="supplier-name" v-model="form.name" type="text" placeholder="Nama supplier"
+                            <Input id="supplier-name" v-model="form.name" type="text" placeholder="Contoh: PT Sumber Makmur"
                                 autofocus :maxlength="FIELD_LIMITS.name" />
                             <FieldError :errors="formErrors(form, 'name')" />
                         </Field>
                         <Field>
                             <FieldLabel for="supplier-phone-number">Nomor Telepon</FieldLabel>
                             <PhoneNumberInput id="supplier-phone-number" v-model="form.phone_number"
-                                placeholder="Nomor telepon supplier" />
+                                placeholder="Contoh: 08123456789" />
                             <FieldError :errors="formErrors(form, 'phone_number')" />
                         </Field>
                         <Field>
                             <FieldLabel for="supplier-address">Alamat</FieldLabel>
                             <Textarea id="supplier-address" v-model="form.address" rows="3"
-                                placeholder="Alamat supplier" />
+                                placeholder="Contoh: Jl. Merdeka No. 45, Bandung" />
                             <FieldError :errors="formErrors(form, 'address')" />
                         </Field>
                     </FieldSet>
diff --git a/resources/js/pages/admin/account/Profile.vue b/resources/js/pages/admin/account/Profile.vue
index 99ce209..5023498 100644
--- a/resources/js/pages/admin/account/Profile.vue
+++ b/resources/js/pages/admin/account/Profile.vue
@@ -66,7 +66,7 @@ function submit() {
                                         Email
                                     </FieldLabel>
                                     <Input id="email" v-model="form.email" type="email"
-                                        placeholder="nama@perusahaan.com" :maxlength="FIELD_LIMITS.email" />
+                                        placeholder="Contoh: nama@perusahaan.com" :maxlength="FIELD_LIMITS.email" />
                                     <FieldError :errors="formErrors(form, 'email')" />
                                 </Field>
 
@@ -74,7 +74,7 @@ function submit() {
                                     <FieldLabel for="username" required>
                                         Username
                                     </FieldLabel>
-                                    <Input id="username" v-model="form.username" type="text" placeholder="username"
+                                    <Input id="username" v-model="form.username" type="text" placeholder="Contoh: johndoe"
                                         :maxlength="FIELD_LIMITS.username" />
                                     <FieldError :errors="formErrors(form, 'username')" />
                                 </Field>
@@ -84,7 +84,7 @@ function submit() {
                                         Nama Lengkap
                                     </FieldLabel>
                                     <Input id="full_name" v-model="form.full_name" type="text"
-                                        placeholder="Nama lengkap" :maxlength="FIELD_LIMITS.fullName" />
+                                        placeholder="Contoh: John Doe" :maxlength="FIELD_LIMITS.fullName" />
                                     <FieldError :errors="formErrors(form, 'full_name')" />
                                 </Field>
 
@@ -124,7 +124,7 @@ function submit() {
                                     <FieldLabel for="address">
                                         Alamat
                                     </FieldLabel>
-                                    <Textarea id="address" v-model="form.address" placeholder="Alamat lengkap"
+                                    <Textarea id="address" v-model="form.address" placeholder="Contoh: Jl. Sudirman No. 123, Jakarta"
                                         rows="3" />
                                     <FieldError :errors="formErrors(form, 'address')" />
                                 </Field>