Allowance check
This commit is contained in:
ISMAIL MASSERAN
@@ -47,31 +47,49 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group attendance-choice-box">
|
||||
<label for="kehadiran">Kehadiran</label>
|
||||
<select class="form-control attendance-select" id="kehadiran" name="kehadiran" required>
|
||||
<option value="0">Sila Pilih :</option>
|
||||
<option value="1">Fizikal</option>
|
||||
<option value="2">Maya</option>
|
||||
</select>
|
||||
<small class="form-text text-muted attendance-helper-text">
|
||||
Sila pilih kehadiran (Maya/Fizikal) kemudian klik “SAYA TERIMA”.
|
||||
</small>
|
||||
</div>
|
||||
<!-- Sembunyikan borang pendaftaran selepas kehadiran telah dihantar -->
|
||||
<template v-if="Number(data.user.kehadiran) === 0">
|
||||
<div class="form-group attendance-choice-box">
|
||||
<label for="kehadiran">Kehadiran</label>
|
||||
<select v-model="selectedKehadiran" class="form-control attendance-select" id="kehadiran"
|
||||
name="kehadiran" required>
|
||||
<option value="0">Sila Pilih :</option>
|
||||
<option value="1">Fizikal</option>
|
||||
<option value="2">Maya</option>
|
||||
</select>
|
||||
<small class="form-text text-muted attendance-helper-text">
|
||||
Sila pilih kehadiran (Maya/Fizikal) kemudian klik “SAYA TERIMA”.
|
||||
</small>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-info mt-4 small attendance-info-notice">
|
||||
<p><strong>*</strong> Pendaftaran akan dibuka dari <strong>jam 7.00 pagi hingga 10.00 pagi (25 April
|
||||
2025)</strong>.</p>
|
||||
<p>
|
||||
<strong>*</strong> Elaun kehadiran berjumlah <strong>RM300.00 (secara fizikal)</strong> akan
|
||||
diberikan secara TUNAI selepas mesyuarat. <br />
|
||||
Manakala <strong>RM150.00 (secara atas talian)</strong> akan dikreditkan ke akaun anggota yang
|
||||
hadir penuh.
|
||||
</p>
|
||||
</div>
|
||||
<div v-if="selectedKehadiran === '1'" class="form-group attendance-field">
|
||||
<label for="physical_gate_code">Kod skrin kaunter pendaftaran</label>
|
||||
<input type="text" name="physical_gate_code" id="physical_gate_code"
|
||||
class="form-control attendance-input" autocomplete="off" autocapitalize="characters"
|
||||
inputmode="text" placeholder="8 aksara, semak skrin di kaunter" maxlength="64"
|
||||
@input="onPhysicalGateCodeInput" />
|
||||
<small class="form-text text-muted attendance-helper-text">
|
||||
Kod berputar setiap minit — masukkan kod semasa yang dipaparkan di kaunter sebelum
|
||||
menghantar.
|
||||
</small>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-info mt-4 small attendance-info-notice">
|
||||
<p><strong>*</strong> Pendaftaran akan dibuka dari <strong>jam 7.00 pagi hingga 10.00 pagi (25
|
||||
April
|
||||
2025)</strong>.</p>
|
||||
<p>
|
||||
<strong>*</strong> Elaun kehadiran berjumlah <strong>RM300.00 (secara fizikal)</strong> akan
|
||||
diberikan secara TUNAI selepas mesyuarat. <br />
|
||||
Manakala <strong>RM150.00 (secara atas talian)</strong> akan dikreditkan ke akaun anggota
|
||||
yang
|
||||
hadir penuh.
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="text-center mt-4 attendance-action-area">
|
||||
<div v-if="data.user.kehadiran != 0" class="attendance-success-card">
|
||||
<div v-if="data.user.kehadiran != 0 && canProceedToVote" class="attendance-success-card">
|
||||
<div class="attendance-success-kicker">Kehadiran Disahkan</div>
|
||||
<p class="attendance-success-text">Kehadiran anda telah disahkan secara</p>
|
||||
<h5 class="attendance-success-mode">
|
||||
@@ -83,10 +101,35 @@
|
||||
</router-link>
|
||||
</div>
|
||||
|
||||
<div v-else-if="data.user.kehadiran != 0 && !canProceedToVote" class="attendance-pending-card">
|
||||
<div class="attendance-pending-kicker">Menunggu pengesahan</div>
|
||||
<p class="attendance-pending-text">
|
||||
Kehadiran <strong>fizikal</strong> anda telah direkod. Sila pergi ke kaunter pendaftaran
|
||||
untuk
|
||||
mengesahkan pendaftaran sebelum anda boleh mengundi.
|
||||
</p>
|
||||
<p class="attendance-pending-hint">
|
||||
Selepas pengesahan, butang mengundi akan dipaparkan di sini. Semak semula halaman ini
|
||||
selepas beberapa ketika.
|
||||
</p>
|
||||
<button type="button" class="btn btn-default attendance-refresh-button"
|
||||
@click="reloadAttendanceState">
|
||||
Muat semula
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-lg btn-success attendance-submit-button"
|
||||
v-else-if="data.election.status == 2">
|
||||
SAYA TERIMA
|
||||
v-else-if="electionVotingActive">
|
||||
DAFTAR KEHADIRAN
|
||||
</button>
|
||||
<div v-else class="alert alert-info text-left attendance-voting-notice">
|
||||
<p class="attendance-voting-notice__title"><strong>Butang “DAFTAR KEHADIRAN” belum
|
||||
tersedia</strong>
|
||||
</p>
|
||||
<p class="attendance-voting-notice__body">
|
||||
Buat masa ini proses undian / mesyuarat <strong>belum bermula</strong>.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
@@ -248,6 +291,43 @@
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
.attendance-pending-card {
|
||||
padding: 24px;
|
||||
border-radius: 18px;
|
||||
background: linear-gradient(135deg, #fffbeb 0%, #ffffff 100%);
|
||||
border: 1px solid #fde68a;
|
||||
box-shadow: 0 14px 28px rgba(180, 83, 9, 0.1);
|
||||
}
|
||||
|
||||
.attendance-pending-kicker {
|
||||
margin-bottom: 10px;
|
||||
color: #b45309;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.attendance-pending-text {
|
||||
margin-bottom: 10px;
|
||||
color: #43617a;
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
.attendance-pending-hint {
|
||||
margin-bottom: 18px;
|
||||
color: #6b7280;
|
||||
font-size: 0.95rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.attendance-refresh-button {
|
||||
min-width: 180px;
|
||||
padding: 10px 20px;
|
||||
border-radius: 999px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.attendance-submit-button,
|
||||
.attendance-vote-button {
|
||||
min-width: 220px;
|
||||
@@ -258,6 +338,21 @@
|
||||
box-shadow: 0 12px 24px rgba(35, 64, 97, 0.14);
|
||||
}
|
||||
|
||||
.attendance-voting-notice {
|
||||
max-width: 520px;
|
||||
margin: 0 auto;
|
||||
border-radius: 14px;
|
||||
}
|
||||
|
||||
.attendance-voting-notice__title {
|
||||
margin: 0 0 8px;
|
||||
}
|
||||
|
||||
.attendance-voting-notice__body {
|
||||
margin: 0 0 10px;
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
|
||||
.attendance-hero,
|
||||
@@ -271,7 +366,8 @@
|
||||
}
|
||||
|
||||
.attendance-submit-button,
|
||||
.attendance-vote-button {
|
||||
.attendance-vote-button,
|
||||
.attendance-refresh-button {
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
}
|
||||
@@ -284,11 +380,55 @@ export default {
|
||||
data: function () {
|
||||
return {
|
||||
loading: false,
|
||||
userSubmitted: false // Add a flag to track if the user has already submitted
|
||||
userSubmitted: false, // Add a flag to track if the user has already submitted
|
||||
selectedKehadiran: '0',
|
||||
}
|
||||
},
|
||||
|
||||
mounted: function () {
|
||||
if (this.data && this.data.user && this.data.user.kehadiran == 0) {
|
||||
var el = document.getElementById('kehadiran');
|
||||
if (el) this.selectedKehadiran = el.value || '0';
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
/**
|
||||
* Status 2 = pilihan raya sedang berjalan (butang SAYA TERIMA dibuka).
|
||||
*/
|
||||
electionVotingActive: function () {
|
||||
var e = this.data && this.data.election;
|
||||
if (!e || e.status === undefined || e.status === null) return false;
|
||||
return Number(e.status) === 2;
|
||||
},
|
||||
|
||||
/**
|
||||
* Maya (2) can vote once attendance is set. Fizikal (1) needs admin verification timestamp.
|
||||
*/
|
||||
canProceedToVote: function () {
|
||||
var u = this.data && this.data.user;
|
||||
if (!u || Number(u.kehadiran) === 0) return false;
|
||||
if (Number(u.kehadiran) !== 1) return true;
|
||||
return Boolean(u.fizikal_registration_verified_at);
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
onPhysicalGateCodeInput: function (e) {
|
||||
var el = e.target;
|
||||
var upper = el.value.toUpperCase();
|
||||
if (el.value === upper) return;
|
||||
var start = el.selectionStart;
|
||||
var end = el.selectionEnd;
|
||||
el.value = upper;
|
||||
if (start != null && end != null) {
|
||||
el.setSelectionRange(start, end);
|
||||
}
|
||||
},
|
||||
|
||||
reloadAttendanceState: function () {
|
||||
location.reload();
|
||||
},
|
||||
// refreshUser: function () {
|
||||
|
||||
// var vm = this;
|
||||
|
||||
Reference in New Issue
Block a user