add gambar nominee on voting page

This commit is contained in:
nurafrinaalimi16
2024-04-16 09:28:15 +08:00
parent 88f0baf155
commit b8ae06e62b
@@ -7,28 +7,25 @@
<li class="list-group-item" v-for="position in data.positions"> <li class="list-group-item" v-for="position in data.positions">
<b>{{ position.name }} : </b> <b>{{ position.name }} : </b>
</li> </li>
<ul class="list-group"> <ul class="list-group">
<li class="list-group-item" v-for="nominee_id in selected[0].nominee_id"> <li class="list-group-item" v-for="nominee_id in selected[0].nominee_id">
<b> - {{ getSelectedNomineeName(nominee_id) }}</b> <b> - {{ getSelectedNomineeName(nominee_id) }}</b>
</li>
</ul>
<!-- <ul class="list-group">
<li class="list-group-item" v-for="result in data.result">
<b>{{ getPosition(result.position_id) }} : </b>{{ getNominee(result.nominee_id) }}
</li> </li>
</ul> --> </ul>
<li class="list-group-item"> <li class="list-group-item">
<center> <center>
<button class="btn btn-success" @click="util.showModal('#vote-modal')">Submit Vote</button> <button class="btn btn-success" @click="util.showModal('#vote-modal')">Hantar</button>
<button class="btn btn-default" @click="reset()">Reset</button> <!-- <button class="btn btn-default" @click="reset()">Reset</button> -->
</center> </center>
</li> </li>
</ul> </ul>
</div> </div>
<div class="col-md-8"> <div class="col-md-8">
<h4>Pilih Calon</h4> <h4>Pilih Calon</h4>
<div class="alert alert-warning " role="alert">
Boleh mengundi (2) calon sahaja!
</div>
<hr /> <hr />
<div class="panel panel-info" v-for="position in data.positions"> <div class="panel panel-info" v-for="position in data.positions">
<div class="panel-heading">{{ position.name }}</div> <div class="panel-heading">{{ position.name }}</div>
@@ -37,8 +34,9 @@
<thead> <thead>
<tr> <tr>
<th></th> <th></th>
<th>Name</th> <th>Bil.</th>
<th>No. Anggota</th> <th></th>
<th>Nama</th>
<th>Unit</th> <th>Unit</th>
</tr> </tr>
</thead> </thead>
@@ -47,8 +45,11 @@
:key="nominee.id"> :key="nominee.id">
<td><input type="checkbox" :id="nominee.id" @change="vote(position.id, nominee.id)" /> <td><input type="checkbox" :id="nominee.id" @change="vote(position.id, nominee.id)" />
</td> </td>
<td>{{ nominee.no_calon }}</td>
<td><img @click="view(i)" :src="createBase64ImageUrl(nominee.photo)" class="thumbnail"
style="height: 60px;width: 60px;" />
</td>
<td>{{ nominee.name }}</td> <td>{{ nominee.name }}</td>
<td>{{ nominee.no_anggota }}</td>
<td>{{ nominee.unit }}</td> <td>{{ nominee.unit }}</td>
</tr> </tr>
</tbody> </tbody>
@@ -62,17 +63,17 @@
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">AGM</h5> <h5 class="modal-title" id="exampleModalLabel"></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<h3>Nota: You can only vote once, so vote wisely.</h3> <h5>Nota: Sila pastikan anda telah membuat undian dengan betul.</h5>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> <button type="button" class="btn btn-secondary" data-dismiss="modal">Tutup</button>
<button type="button" class="btn btn-primary" @click="submit()">Submit Vote</button> <button type="button" class="btn btn-primary" @click="submit()">Hantar</button>
</div> </div>
</div> </div>
</div> </div>
@@ -132,7 +133,7 @@ export default {
if (vm.util.showResult(response, 'success')) { if (vm.util.showResult(response, 'success')) {
vm.data.result = response.data.result; vm.data.result = response.data.result;
vm.$router.push({ name: 'Voter Home' }); vm.$router.push({ name: 'Voter Home' });
$('.modal').modal('hide'); $('.modal').modal('hide');
} }
}) })
.catch(error => { .catch(error => {
@@ -176,9 +177,9 @@ export default {
console.log(this.selected[0]) console.log(this.selected[0])
}, },
getSelectedNomineeName: function(id) { getSelectedNomineeName: function (id) {
return this.getNominee(id); return this.getNominee(id);
}, },
getName: function (id) { getName: function (id) {
let positions = this.data.positions; let positions = this.data.positions;
@@ -194,7 +195,7 @@ export default {
let positions = this.data.positions; let positions = this.data.positions;
let nominees = this.data.nominees; let nominees = this.data.nominees;
for (var i in nominees) for (var i in nominees)
if (nominees[i]['id']==id) return nominees[i].name; if (nominees[i]['id'] == id) return nominees[i].name;
return ''; return '';
}, },
@@ -211,6 +212,15 @@ export default {
return 'No Partylist'; return 'No Partylist';
}, },
view: function (index) {
this.x = this.data.nominees[index];
this.util.showModal('#nominee-information-modal');
},
createBase64ImageUrl: function (base64ImageData) {
return "data:image/png;base64," + base64ImageData;
}
// uncheck: function (checkedName) { // uncheck: function (checkedName) {
// this.checkedName = this.checkedNames.filter(name => name !== checkedName); // this.checkedName = this.checkedNames.filter(name => name !== checkedName);
// } // }