From 0a6c3ab0d853a1748e1a719263aa388b2a8e10a6 Mon Sep 17 00:00:00 2001
From: hayatie <hayatie.hamazah@gmail.com>
Date: Mon, 29 Dec 2025 12:30:59 +0800
Subject: [PATCH] finaledit_penyata

---
 .../js/components/demo/voter/home/penyata.vue | 179 +++++++++++-------
 1 file changed, 114 insertions(+), 65 deletions(-)

diff --git a/resources/assets/js/components/demo/voter/home/penyata.vue b/resources/assets/js/components/demo/voter/home/penyata.vue
index d67fd4c..8386b58 100644
--- a/resources/assets/js/components/demo/voter/home/penyata.vue
+++ b/resources/assets/js/components/demo/voter/home/penyata.vue
@@ -69,40 +69,56 @@
         class="form-control form-control-sm" v-model="tarikh" />
     </p>
 
+
     <!-- ✅ 2-COLUMN TABLE -->
-    <table class="boxed-table mt-4">
-      <tbody>
-        <tr>
-          <td>Saham</td>
-          <td>{{ data.user.saham }}</td>
-          <td>Yuran</td>
-         <td>{{ data.user.yuran}}</td>
-        <tr>
-          <td>Pelaburan T1</td>
-          <td>{{ penyata.pelaburan_t1 }}</td>
-          <td>Pinjaman BAI</td>
-          <td>{{ penyata.pinjaman_bai }}</td>
-        </tr>
-        <tr>
-          <td>Pelaburan T2</td>
-          <td>{{ penyata.pelaburan_t2 }}</td>
-          <td>Pinjaman BYS</td>
-          <td>{{ penyata.pinjaman_bys}}</td>
-        </tr>
-        <tr>
-          <td>Pelaburan AQH</td>
-          <td>{{ penyata.pelaburan_aqh }}</td>
-          <td>Insurans / Cukai Jalan</td>
-          <td>{{penyata.insurans_cukai}}</td>
-        </tr>
-        <tr>
-          <td>Pelaburan BBA </td>
-          <td>{{ penyata.pelaburan_bba }}</td>
-          <td>Pinjaman Pelbagai</td>
-          <td>{{ penyata.pinj_pelbagai }}</td>
-        </tr>
-      </tbody>
-    </table>
+    <div id="app" data-penyata='@json($penyata)'>
+
+
+      <table class="boxed-table mt-4">
+        <tbody>
+          <tr>
+            <td>Saham</td>
+            <td>{{ data.user.saham }}</td>
+
+            <td>Yuran</td>
+            <td>{{ data.user.yuran }}</td>
+          </tr>
+
+          <tr>
+            <td>Pelaburan T1</td>
+            <td>{{ data.user.pelaburanT1 }}</td>
+
+            <td>Pinjaman BAI</td>
+            <td>{{ data.user.pinjamanBAI }}</td>
+          </tr>
+
+          <tr>
+            <td>Pelaburan T2</td>
+            <td>{{ data.user.pelaburanT2 }}</td>
+
+            <td>Pinjaman BYS</td>
+            <td>{{ data.user.pinjamanBYS }}</td>
+          </tr>
+
+          <tr>
+            <td>Pinjaman AQH</td>
+            <td>{{ data.user.pinjamanAQH }}</td>
+
+            <td>Insurans / Cukai Jalan</td>
+            <td>{{ data.user.insuransCukai }}</td>
+          </tr>
+
+          <tr>
+            <td>Pinjaman BBA</td>
+            <td>{{ data.user.pinjamanBBA }}</td>
+
+            <td>Pinjaman Pelbagai</td>
+            <td>{{ data.user.pinjamanPelbagai }}</td>
+          </tr>
+        </tbody>
+      </table>
+
+    </div>
 
     <!-- ✅ FOOTER SECTION -->
     <p class="mt-4"><em>
@@ -144,39 +160,40 @@
     <p style="text-align: justify;"></p>Jika Tidak Bersetuju, Sila kemukakan yang sepatutnya seperti :
     <br>
     <!-- ✅ 2-COLUMN TABLE -->
+    <div id="app" data-penyata='@json($penyata)'></div>
     <table class="table table-sm no-lines text-center align-middle">
       <tbody>
 
         <tr>
           <td>Saham</td>
-          <td><input type="number" class="form-control-sm keyin-input" v-model="penyata.saham" /></td>
+          <td><input type="number" class="form-control-sm keyin-input" v-model="data.user.saham" /></td>
 
           <td>Pinjaman AQH</td>
-          <td><input type="number" class="form-control-sm keyin-input" v-model="pinjamanAQH" /></td>
+          <td><input type="number" class="form-control-sm keyin-input" v-model="data.user.pinjamanAQH" /></td>
         </tr>
 
         <tr>
           <td>Yuran</td>
-          <td><input type="number" class="form-control-sm keyin-input" v-model="yuran" /></td>
+          <td><input type="number" class="form-control-sm keyin-input" v-model="data.user.yuran" /></td>
 
           <td>Pinjaman BBA</td>
-          <td><input type="number" class="form-control-sm keyin-input" v-model="penyata.pinjaman_bba" /></td>
+          <td><input type="number" class="form-control-sm keyin-input" v-model="data.user.pinjamanBBA" /></td>
         </tr>
 
         <tr>
           <td>Pelaburan T1</td>
-          <td><input type="number" class="form-control-sm keyin-input" v-model="penyata.pelaburan_t1" /></td>
+          <td><input type="number" class="form-control-sm keyin-input" v-model="data.user.pelaburanT1" /></td>
 
           <td>Pinjaman BAI</td>
-          <td><input type="number" class="form-control-sm keyin-input" v-model="penyata.pinjaman_bai" /></td>
+          <td><input type="number" class="form-control-sm keyin-input" v-model="data.user.pinjamanBAI" /></td>
         </tr>
 
         <tr>
           <td>Pelaburan T2</td>
-          <td><input type="number" class="form-control-sm keyin-input" v-model="penyata.pelaburan_t2" /></td>
+          <td><input type="number" class="form-control-sm keyin-input" v-model="data.user.pelaburanT2" /></td>
 
           <td>Pinjaman BYS</td>
-          <td><input type="number" class="form-control-sm keyin-input" v-model="penyata.pinjaman_bys" /></td>
+          <td><input type="number" class="form-control-sm keyin-input" v-model="data.user.pinjamanBYS" /></td>
         </tr>
 
         <tr>
@@ -184,7 +201,7 @@
           <td>&nbsp;</td>
 
           <td>Insurans / Cukai Jalan</td>
-          <td><input type="number" class="form-control-sm keyin-input" v-model="penyata.insurans_cukai" /></td>
+          <td><input type="number" class="form-control-sm keyin-input" v-model="data.user.insuransCukai" /></td>
         </tr>
 
         <tr>
@@ -192,7 +209,7 @@
           <td>&nbsp;</td>
 
           <td>Pinjaman Pelbagai</td>
-          <td><input type="text" class="form-control-sm keyin-input" v-model="penyata.pinj_Pelbagai" /></td>
+          <td><input type="text" class="form-control-sm keyin-input" v-model="data.user.pinjamanPelbagai" /></td>
         </tr>
 
       </tbody>
@@ -200,18 +217,19 @@
 
 
 
+
     <!-- ✅ Sah Button -->
     <div class="text-right mb-3 no-print">
-      <button type="button" class="btn btn-primary btn-effect" style="width: 100px;" @click="SahkanPenyata">
-        Sahkan
-      </button>
+     <button type="button" class="btn btn-primary btn-effect" style="width: 100px;" @click="SahkanPenyata">
+  Sahkan
+</button>
     </div>
 
     <!-- ✅ Tandatangan & Tarikh Section -->
     <div class="signature-section">
       <div class="sign-column">
-        <label class="form-label">Tandatangan:</label>
-        <input type="sign" class="keyin-line" v-model="sign" />
+        <label class="form-label">No Kad Pengenalan:</label>
+        <input type="number" class="keyin-line" v-model="nokp" />
       </div>
 
       <div class="sig-column">
@@ -225,7 +243,7 @@
 </template>
 
 <script>
-import axios from 'axios'; // <-- this is required
+import axios from 'axios';
 
 export default {
   name: "PenyataView",
@@ -254,7 +272,7 @@ export default {
   },
 
   mounted() {
-    const id = this.$route.params.id; 
+    const id = this.$route.params.id;
     this.noAhli = id;
     this.noAhliPersetujuan = id;
     this.getPenyata(id);
@@ -270,17 +288,38 @@ export default {
       }
     },
 
+    data() {
+      return {
+        penyata: window.penyataData
+      };
+    },
+
+
     SahkanPenyata() {
-      if (confirm("Adakah anda pasti untuk mengesahkan penyata ini?")) {
-        this.cetakPenyata();
-        alert("Penyata berjaya disahkan.");
+  if (confirm("Adakah anda pasti untuk mengesahkan penyata ini?")) {
+    this.cetakPenyata();
+    alert("Penyata berjaya disahkan.");
+
+    // Delay sedikit supaya Vue Router push jalan dengan betul
+    setTimeout(() => {
+              this.$router.push({ name: 'lamanUtama' });
+        }, 60);
       }
+    },
+
+    // pastikan ada method lain di sini jika perlu
+    cetakPenyata() {
+      console.log("Penyata dicetak");
     }
   }
-};
+}
 </script>
 
 
+
+
+
+
 <style scoped>
 .penyata-wrapper {
   max-width: 800px;
@@ -316,8 +355,10 @@ export default {
 .form-section.two-column {
   display: grid;
   /* width: 100%; */
-  max-width: 780px;     /* ⭐ SAME WIDTH AS TABLES */
-  margin: 0 auto;       /* ⭐ center align same as tables */
+  max-width: 780px;
+  /* ⭐ SAME WIDTH AS TABLES */
+  margin: 0 auto;
+  /* ⭐ center align same as tables */
   grid-template-columns: repeat(2, 1fr);
   column-gap: 30px;
   row-gap: 15px;
@@ -326,14 +367,17 @@ export default {
 
 
 .form-section.two-column .form-group {
-  min-width: 0;            /* ⭐ prevents content from stretching columns */
+  min-width: 0;
+  /* ⭐ prevents content from stretching columns */
 }
 
 .form-section.two-column input,
 .form-section.two-column span {
-  width: 100%;             /* keep content inside column */
+  width: 100%;
+  /* keep content inside column */
   display: block;
-  word-break: break-word;  /* wrap long text */
+  word-break: break-word;
+  /* wrap long text */
 }
 
 
@@ -378,7 +422,7 @@ table.boxed-table td {
     justify-content: center;
   }
 
- 
+
 }
 
 .title-box {
@@ -436,22 +480,27 @@ table.boxed-table td {
 
 .signature-section {
   display: grid;
-  grid-template-columns: 1fr 1fr;   /* equal 50/50 width */
+  grid-template-columns: 1fr 1fr;
+  /* equal 50/50 width */
   column-gap: 40px;
   row-gap: 15px;
 
   width: 100%;
-  max-width: 780px;                 /* ⭐ same width as tables */
-  margin: 20px auto 0 auto;         /* ⭐ center align */
+  max-width: 780px;
+  /* ⭐ same width as tables */
+  margin: 20px auto 0 auto;
+  /* ⭐ center align */
 }
 
 .signature-section .sign-column,
 .signature-section .sig-column {
-  min-width: 0;                     /* allows equal split */
+  min-width: 0;
+  /* allows equal split */
 }
 
 .signature-section input {
-  width: 90%;                      /* align input edges */
+  width: 90%;
+  /* align input edges */
 }