DONE: enhance UI on admin and voter side, add docker config, fix delete button modal not showing

This commit is contained in:
ISMAIL MASSERAN
2026-04-02 11:59:56 +08:00
parent bed56792e6
commit 4369b079cb
31 changed files with 3044 additions and 1216 deletions
@@ -1,61 +1,56 @@
<template>
<div class="col-md-5 col-md-offset-3">
<div class="panel panel-default">
<div class="text-center">
<img id="logo-admin" alt="Logo-admin">
<div class="panel-heading">
<h4><b>ADMIN LOG MASUK</b> </h4>
</div>
<div class="panel-body">
<form @submit.prevent="login" id="login_form">
<div class="form-group">
<label for="email">E-mail</label>
<input type="email" name="email" class="form-control" required/>
<div class="col-md-5 col-md-offset-3">
<div class="panel panel-default">
<div class="text-center">
<img id="logo-admin" alt="Logo-admin">
<div class="panel-heading">
<h4><b>ADMIN LOG MASUK</b> </h4>
</div>
<div class="form-group">
<label for="password">Kata laluan </label>
<input type="password" name="password" class="form-control" id="password" required/>
</div>
<div class="panel-body">
<form @submit.prevent="login" id="login_form">
<label>
<input
type="checkbox"
id="visibility"
onclick=" $(this)[0].checked ?
<div class="form-group">
<label for="email">E-mail</label>
<input type="email" name="email" class="form-control" required />
</div>
<div class="form-group">
<label for="password">Kata laluan </label>
<input type="password" name="password" class="form-control" id="password" required />
</div>
<label>
<input type="checkbox" id="visibility" onclick=" $(this)[0].checked ?
$('#password').attr('type','text'):
$('#password').attr('type','password')"/> Show Password
</label>
$('#password').attr('type','password')" /> Show Password
</label>
<div class="form-group">
<input
type="submit"
class="btn btn-info form-control"
:class="{'disabled': loading.isLoading}"
:value="loading.value"/>
<div class="form-group">
<input type="submit" class="btn btn-info form-control"
:class="{ 'disabled': loading.isLoading }" :value="loading.value" />
</div>
</form>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
// JavaScript to set the image source
document.addEventListener('DOMContentLoaded', function() {
// Select the image element by its ID
var logoImage = document.getElementById('logo-admin');
// Set the source of the image dynamically
logoImage.src = window.location.origin + '/images/login-admin.jpeg?' + new Date().getTime(); // Replace this URL with your desired image URL
});
// JavaScript to set the image source
document.addEventListener('DOMContentLoaded', function () {
// Select the image element by its ID
var logoImage = document.getElementById('logo-admin');
// Set the source of the image dynamically
logoImage.src = window.location.origin + '/images/login-admin.jpeg?' + new Date().getTime(); // Replace this URL with your desired image URL
console.log(logoImage.src);
});
export default{
export default {
data: function () {
return {
@@ -68,7 +63,7 @@ export default{
created: function () {
if (this.util.isLogin())
return this.$router.push({name:'Admin Home'})
return this.$router.push({ name: 'Admin Home' })
this.util.setTitle('Log Masuk Admin ');
},
@@ -80,19 +75,19 @@ export default{
this.startLoading();
axios.post(config.API+'admin/login', $('#login_form').serialize())
.then(response => {
vm.stopLoading();
if (this.util.showResult(response, 'success')) {
localStorage['Access Token'] = `Bearer ${response.data.token}`;
axios.post(config.API + 'admin/login', $('#login_form').serialize())
.then(response => {
vm.stopLoading();
if (this.util.showResult(response, 'success')) {
localStorage['Access Token'] = `Bearer ${response.data.token}`;
this.util.setAuthorization();
vm.$router.push({name: 'Admin Home'});
}
})
.catch(error => {
vm.stopLoading();
this.util.showResult(error, 'error');
})
vm.$router.push({ name: 'Admin Home' });
}
})
.catch(error => {
vm.stopLoading();
this.util.showResult(error, 'error');
})
},
@@ -124,7 +119,7 @@ body {
.logo-admin {
width: 30px;
/* Adjust width as needed */
height:50px;
height: 50px;
object-fit: cover;
}
@@ -132,15 +127,14 @@ body {
.form-control {
border-radius: 0.50rem;
}
.btn-info:hover {
background-color: #c2ccc8;/* Change background color on hover */
color: #f3f6f8; /* Change text color on hover */
background-color: #c2ccc8;
/* Change background color on hover */
color: #f3f6f8;
/* Change text color on hover */
}
</style>