fix disabled tick more than 2times

resources/assets/js/components/demo/voter/home/vote.vue

@@ -15,7 +15,7 @@
 
 				<li class="list-group-item">
 					<center>
-						<button class="btn btn-success" @click="util.showModal('#vote-modal')">UNDI</button>
+						<button class="btn btn-success" @click="checkUndi()">UNDI</button>
 						<!-- <button class="btn btn-default" @click="reset()">Reset</button> -->
 					</center>
 				</li>
@@ -43,7 +43,7 @@
 						<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" @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"
@@ -100,6 +100,16 @@ export default {
 			name: {},
 			selectedNominees: {
 			},
+			max: 2
+		}
+	},
+
+	computed: {
+		disabledCheckboxes() {
+			const selectedNomineeIds = this.selected[0]['nominee_id'];
+			return this.data.nominees.map(nominee => {
+			return selectedNomineeIds.includes(nominee.id) ? false : this.checkDisabled();
+			});
 		}
 	},
 
@@ -109,9 +119,9 @@ export default {
 			this.util.showModal('#vote-modal')
 		},
 		submit: function () {
-			if (this.selected[0]['nominee_id'].length !== 2) {
+			if (this.selected[0]['nominee_id'].length !== this.max) {
 				// No selections made
-				this.util.notify('Sila pastikan anda memilih (2) orang calon.', 'error');
+				this.util.notify(`Sila pastikan anda memilih (${this.max}) orang calon.`, 'error');
 				return;
 			}
 
@@ -123,9 +133,6 @@ export default {
 				vote: this.selected
 			};
 
-			// Log the data to ensure it's correctly formatted
-			console.log(data);
-
 			// Send a POST request to the server
 			axios.post(config.API + 'election/vote', data)
 				.then(response => {
@@ -154,7 +161,6 @@ export default {
 		},
 
 		reset: function () {
-			console.log(this.selectedNominees);
 			let selected = this.selectedNominees;
 			for (var i in selected) {
 				$('#' + selected[i]['nominee_id']).selected(false);
@@ -162,23 +168,24 @@ 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 < 2) {
+                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 (2) calon sahaja!', 'warning');
+                    this.util.notify(`Boleh mengundi (${this.max}) calon sahaja!`, 'warning');
+					return;
                 }
             } else {
                 // Nominee found, remove it
                 this.selected[0]['nominee_id'].splice(index, 1);
             }
-            console.log(this.selected[0])
         },
 
 		getSelectedNomineeName: function (id) {
@@ -223,6 +230,21 @@ export default {
 
 		createBase64ImageUrl: function (base64ImageData) {
 			return "data:image/png;base64," + base64ImageData;
+		},
+
+		checkUndi: function(){
+			if(this.selected[0]['nominee_id'].length <= 1){
+				this.util.notify('Sila pastikan anda memilih (2) orang calon.', 'error');
+			}else{
+				this.util.showModal('#vote-modal');
+			}
+			return;
+		},
+
+		checkDisabled: function(){
+			if(this.selected[0]['nominee_id'].length >= this.max){
+				return true;
+			}
 		}
 
 		// uncheck: function (checkedName) {