From 2f0f44f4eb4fcfcdf80773154b8c34040434159c Mon Sep 17 00:00:00 2001
From: nurafrinaalimi16 <nurafrinaalimi16@gmail.com>
Date: Thu, 24 Apr 2025 17:12:08 +0800
Subject: [PATCH] add no.calon for selectednominee

---
 .../js/components/demo/voter/home/vote.vue    | 60 +++++++++++--------
 1 file changed, 34 insertions(+), 26 deletions(-)

diff --git a/resources/assets/js/components/demo/voter/home/vote.vue b/resources/assets/js/components/demo/voter/home/vote.vue
index 1678d4e..7784568 100644
--- a/resources/assets/js/components/demo/voter/home/vote.vue
+++ b/resources/assets/js/components/demo/voter/home/vote.vue
@@ -9,8 +9,9 @@
 				</li>
 				<ul class="list-group">
 					<li class="list-group-item" v-for="nominee_id in selected[0].nominee_id">
-						<b> - {{ getSelectedNomineeName(nominee_id) }}</b>
+						<b> - [{{ getNomineeNo(nominee_id) }}] {{ getSelectedNomineeName(nominee_id) }}</b>
 					</li>
+
 				</ul>
 
 				<li class="list-group-item">
@@ -43,7 +44,8 @@
 						<tbody>
 							<tr v-for="(nominee, index) in data.nominees" v-if="nominee.position_id == position.id"
 								:key="nominee.id">
-								<td><input type="checkbox" :id="nominee.id" :disabled="disabledCheckboxes[index]"  @change="vote(position.id, nominee.id)" />
+								<td><input type="checkbox" :id="nominee.id" :disabled="disabledCheckboxes[index]"
+										@change="vote(position.id, nominee.id)" />
 								</td>
 								<td>{{ nominee.no_calon }}</td>
 								<td><img @click="view(i)" :src="createBase64ImageUrl(nominee.photo)" class="thumbnail"
@@ -108,7 +110,7 @@ export default {
 		disabledCheckboxes() {
 			const selectedNomineeIds = this.selected[0]['nominee_id'];
 			return this.data.nominees.map(nominee => {
-			return selectedNomineeIds.includes(nominee.id) ? false : this.checkDisabled();
+				return selectedNomineeIds.includes(nominee.id) ? false : this.checkDisabled();
 			});
 		}
 	},
@@ -168,30 +170,36 @@ export default {
 			}
 		},
 		vote: function (position_id, nominee_id) {
-			
-            if (!this.selected[0]['position_id']) {
-                this.$set(this.selected[0], position_id, []);
-            }
-            const index = this.selected[0]['nominee_id'].indexOf(nominee_id);
-            if (index === -1) {
-                // Nominee not found, add it
-                if (this.selected[0]['nominee_id'].length < this.max) {
-                    this.selected[0]['nominee_id'].push(nominee_id);
-                } else {
-                    // Display warning message if more than 2 nominees are selected
-                    this.util.notify(`Boleh mengundi (${this.max}) calon sahaja!`, 'warning');
+
+			if (!this.selected[0]['position_id']) {
+				this.$set(this.selected[0], position_id, []);
+			}
+			const index = this.selected[0]['nominee_id'].indexOf(nominee_id);
+			if (index === -1) {
+				// Nominee not found, add it
+				if (this.selected[0]['nominee_id'].length < this.max) {
+					this.selected[0]['nominee_id'].push(nominee_id);
+				} else {
+					// Display warning message if more than 2 nominees are selected
+					this.util.notify(`Boleh mengundi (${this.max}) calon sahaja!`, 'warning');
 					return;
-                }
-            } else {
-                // Nominee found, remove it
-                this.selected[0]['nominee_id'].splice(index, 1);
-            }
-        },
+				}
+			} else {
+				// Nominee found, remove it
+				this.selected[0]['nominee_id'].splice(index, 1);
+			}
+		},
 
 		getSelectedNomineeName: function (id) {
 			return this.getNominee(id);
 		},
 
+		getNomineeNo(id) {
+			const nominee = this.data.nominees.find(n => n.id === id);
+			return nominee ? nominee.no_calon : '';
+		},
+
+
 		getName: function (id) {
 			let positions = this.data.positions;
 			let selected = this.selected;
@@ -232,17 +240,17 @@ export default {
 			return "data:image/png;base64," + base64ImageData;
 		},
 
-		checkUndi: function(){
-			if(this.selected[0]['nominee_id'].length <= 0){
+		checkUndi: function () {
+			if (this.selected[0]['nominee_id'].length <= 0) {
 				this.util.notify('Sila pastikan anda memilih (1) orang calon.', 'error');
-			}else{
+			} else {
 				this.util.showModal('#vote-modal');
 			}
 			return;
 		},
 
-		checkDisabled: function(){
-			if(this.selected[0]['nominee_id'].length >= this.max){
+		checkDisabled: function () {
+			if (this.selected[0]['nominee_id'].length >= this.max) {
 				return true;
 			}
 		}