fix disabled tick more than 2times

This commit is contained in:
Hafifie PKB
2024-04-27 18:41:37 +08:00
parent 0891b664eb
commit 6907be4857
@@ -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) {