git
@@ -12,8 +12,9 @@
|
||||
"@vuelidate/validators": "^2.0.0-alpha.29",
|
||||
"autoprefixer": "^10",
|
||||
"axios": "^0.26.1",
|
||||
"bootstrap": "^5.1.3",
|
||||
"bootstrap": "^5.2.3",
|
||||
"bootstrap-icons": "^1.8.1",
|
||||
"bootstrap-vue": "^2.23.1",
|
||||
"core-js": "^3.8.3",
|
||||
"html2canvas": "^1.4.1",
|
||||
"jspdf": "^2.5.1",
|
||||
@@ -30,6 +31,7 @@
|
||||
"vue": "^3.2.13",
|
||||
"vue-html2pdf": "^1.8.0",
|
||||
"vue-router": "^4.0.14",
|
||||
"vue-sidebar-menu-akahon": "^0.1.4",
|
||||
"vue-sweetalert2": "^5.0.5",
|
||||
"vue3-youtube": "^0.1.9"
|
||||
},
|
||||
|
||||
|
After Width: | Height: | Size: 95 KiB |
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 88 KiB |
|
After Width: | Height: | Size: 98 KiB |
|
After Width: | Height: | Size: 35 KiB |
|
After Width: | Height: | Size: 77 KiB |
|
After Width: | Height: | Size: 18 KiB |
@@ -6,12 +6,12 @@
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<!-- <link rel="icon" href="<%= BASE_URL %>favicon.ico"> -->
|
||||
<link rel="icon" href="img/arrahn_favicon.ico">
|
||||
<link rel="icon" href="img/erahn-logo.png">
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap');
|
||||
</style>
|
||||
<!-- <title><%= htmlWebpackPlugin.options.title %></title> -->
|
||||
<title>ArrahnBid - Lelongan Atas Talian</title>
|
||||
<title>E-Rahn Lelong</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
@@ -36,7 +36,8 @@
|
||||
--border-radius:6px;
|
||||
--surface-ground:#eff3f8;
|
||||
--surface-section:#ffffff;
|
||||
--surface-card:#ffffff;
|
||||
--surface-card:#3f4242ce;
|
||||
--surface-card2:#b9b4b4;
|
||||
--surface-overlay:#ffffff;
|
||||
--surface-border:#dfe7ef;
|
||||
--surface-hover:#f6f9fc;
|
||||
@@ -1081,10 +1082,10 @@
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
padding: 0.75rem 0.75rem;
|
||||
border: 1px solid #ced4da;
|
||||
border: 4px solid #ced4da;
|
||||
transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s;
|
||||
appearance: none;
|
||||
border-radius: 6px;
|
||||
border-radius: 24px;
|
||||
}
|
||||
.p-inputtext:enabled:hover {
|
||||
border-color: #3B82F6;
|
||||
@@ -1697,12 +1698,12 @@
|
||||
|
||||
.p-button {
|
||||
color: #ffffff;
|
||||
background: #2f68c5;
|
||||
border: 1px solid #2f68c5;
|
||||
background: #008f96;
|
||||
border: 1px solid #008f96;
|
||||
padding: 0.75rem 1.25rem;
|
||||
font-size: 1rem;
|
||||
transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s;
|
||||
border-radius: 6px;
|
||||
border-radius: 24px;
|
||||
}
|
||||
.p-button:enabled:hover {
|
||||
background: #2563eb;
|
||||
|
||||
|
After Width: | Height: | Size: 926 KiB |
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<a href="#" data-bs-toggle="modal" data-bs-target="#exampleModal">
|
||||
<a href="#" data-bs-toggle="modal" data-bs-target="#exampleModal" class="text-white">
|
||||
Terma & Syarat
|
||||
</a>
|
||||
<div
|
||||
|
||||
@@ -1,51 +1,61 @@
|
||||
<template>
|
||||
<Toast :breakpoints="{ '767px': { width: '100%', right: '0', left: '0' } }" />
|
||||
<div
|
||||
class="
|
||||
flex
|
||||
main-container
|
||||
min-h-screen
|
||||
align-items-center
|
||||
justify-content-center
|
||||
"
|
||||
class="flex main-container min-h-screen align-items-center justify-content-center"
|
||||
>
|
||||
<div
|
||||
class="
|
||||
surface-card
|
||||
fadein
|
||||
p-4
|
||||
shadow-2
|
||||
border-round
|
||||
w-11
|
||||
md:w-10
|
||||
lg:w-8
|
||||
xl:w-7
|
||||
content-bg
|
||||
"
|
||||
class="surface-card fadein p-4 shadow-8 border-round w-11 md:w-10 lg:w-8 xl:w-7"
|
||||
>
|
||||
<div class="text-center mb-5">
|
||||
<div class="text-900 text-3xl font-semibold mb-3">
|
||||
ArrahnBid
|
||||
<img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" />
|
||||
<div>
|
||||
<div class="row">
|
||||
<div
|
||||
class="col-md-2 d-flex flex-column justify-content-center align-items-left"
|
||||
style="margin-right: -65px"
|
||||
>
|
||||
<img
|
||||
class="logo-img1"
|
||||
src="img/e-Rahn_Logo_FA-01.png"
|
||||
alt="erahn-logo"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="col-md-2 d-flex flex-column justify-content-center align-items-left"
|
||||
>
|
||||
<img
|
||||
class="logo-img2"
|
||||
src="img/Logo KoPKB_Final.png"
|
||||
alt="erahn-logo"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="col-md-2 d-flex flex-column justify-content-center align-items-left"
|
||||
style="margin-left: -65px"
|
||||
>
|
||||
<img
|
||||
class="logo-img3"
|
||||
src="img/e-rahn-lelong.png"
|
||||
alt="erahn-logo"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-600 font-medium line-height-3"
|
||||
</div>
|
||||
<div class="text-center mb-5">
|
||||
<img class="logo-img" src="img/bidder.png" alt="erahn-logo" />
|
||||
<div class="text-200 text-3xl font-semibold mb-3">Log Masuks</div>
|
||||
<span class="text-200 font-medium line-height-3"
|
||||
>Belum punyai akaun?</span
|
||||
>
|
||||
<router-link
|
||||
v-bind:to="{ name: 'register' }"
|
||||
class="font-medium no-underline ml-2 text-blue-500 cursor-pointer"
|
||||
>Daftar sekarang!</router-link
|
||||
>
|
||||
class="font-medium ml-2 text-blue cursor-pointer"
|
||||
>Daftar sekarang!
|
||||
</router-link>
|
||||
</div>
|
||||
<form @submit.prevent="submit">
|
||||
<div class="px-0 text-center md:px-8">
|
||||
<div class="field grid">
|
||||
<label
|
||||
for="firstname3"
|
||||
class="justify-content-end"
|
||||
style="width: 170px"
|
||||
>ID Pengguna</label
|
||||
>
|
||||
<!-- <label for="firstname3" class="justify-content-end"
|
||||
style="width: 170px">Username</label> -->
|
||||
<div class="col">
|
||||
<span class="p-input-icon-right">
|
||||
<i class="pi pi-user" />
|
||||
@@ -53,6 +63,7 @@
|
||||
class="mb-2"
|
||||
v-model="form.username"
|
||||
type="text"
|
||||
placeholder="Username"
|
||||
required
|
||||
></InputText>
|
||||
</span>
|
||||
@@ -62,18 +73,16 @@
|
||||
>
|
||||
</div>
|
||||
<div class="field grid">
|
||||
<label
|
||||
for="firstname3"
|
||||
<!-- <label for="firstname3"
|
||||
class="justify-content-end"
|
||||
style="width: 170px"
|
||||
>Kata Laluan</label
|
||||
>
|
||||
style="width: 170px">Kata Laluan</label> -->
|
||||
<div class="col">
|
||||
<span class="p-input-icon-left">
|
||||
<i class="pi pi-user" />
|
||||
<Password
|
||||
class="mb-2"
|
||||
v-model="form.password"
|
||||
placeholder="Password"
|
||||
toggleMask
|
||||
:feedback="false"
|
||||
/>
|
||||
@@ -94,19 +103,13 @@
|
||||
iconPos="right"
|
||||
></Button>
|
||||
</div>
|
||||
<div class="mt-3">
|
||||
<router-link
|
||||
v-bind:to="{ name: 'forgot-password' }"
|
||||
>Lupa Katalaluan
|
||||
</router-link>
|
||||
</div>
|
||||
<div class="flex alin justify-content-center mt-4">
|
||||
<div class="btn btn-warning btn-sm mr-4">
|
||||
<div class="flex alin justify-content-center mt-4 text-hover">
|
||||
<div class="btn btn-warning btn-sm">
|
||||
<terms-and-conditions></terms-and-conditions>
|
||||
</div>
|
||||
<a class="btn btn-info btn-sm" href="https://lelong.arrahn.com.my"
|
||||
<!-- <a class="btn btn-info btn-sm" href="https://lelong.arrahn.com.my"
|
||||
>Pautan Sistem Lelong</a
|
||||
>
|
||||
> -->
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
@@ -242,8 +245,8 @@ export default {
|
||||
#9599e2 100%
|
||||
),
|
||||
url("/src/assets/background_arrahn.jpg"); */
|
||||
/* background: url("/src/assets/bg1.jpg"); */
|
||||
background: url("/src/assets/bg3.JPG");
|
||||
background-image: url("/src/assets/background-lelong.png");
|
||||
background-color: #fec234;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
}
|
||||
@@ -253,7 +256,27 @@ export default {
|
||||
}
|
||||
|
||||
.logo-img {
|
||||
width: 84px;
|
||||
height: 44px;
|
||||
color: white;
|
||||
width: 180px;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.logo-img1 {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.logo-img2 {
|
||||
width: 50px;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.logo-img3 {
|
||||
width: 150px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
/* .border-round{
|
||||
border-radius:50px;
|
||||
} */
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,278 @@
|
||||
<template>
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" style="width:100%;height:100%;">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<title>Ar-Rahn | Admin Page</title>
|
||||
|
||||
<link rel="icon" type="image/x-icon" href="{{ asset('img/icon_pkb.png') }}" />
|
||||
|
||||
<!-- Fonts -->
|
||||
<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap" rel="stylesheet">
|
||||
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||
|
||||
{{-- <!-- Styles -->
|
||||
<style>
|
||||
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}a{background-color:transparent}[hidden]{display:none}html{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #e2e8f0}a{color:inherit;text-decoration:inherit}svg,video{display:block;vertical-align:middle}video{max-width:100%;height:auto}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f7fafc;background-color:rgba(247,250,252,var(--bg-opacity))}.border-gray-200{--border-opacity:1;border-color:#edf2f7;border-color:rgba(237,242,247,var(--border-opacity))}.border-t{border-top-width:1px}.flex{display:flex}.grid{display:grid}.hidden{display:none}.items-center{align-items:center}.justify-center{justify-content:center}.font-semibold{font-weight:600}.h-5{height:1.25rem}.h-8{height:2rem}.h-16{height:4rem}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.leading-7{line-height:1.75rem}.mx-auto{margin-left:auto;margin-right:auto}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.ml-2{margin-left:.5rem}.mt-4{margin-top:1rem}.ml-4{margin-left:1rem}.mt-8{margin-top:2rem}.ml-12{margin-left:3rem}.-mt-px{margin-top:-1px}.max-w-6xl{max-width:72rem}.min-h-screen{min-height:100vh}.overflow-hidden{overflow:hidden}.p-6{padding:1.5rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.pt-8{padding-top:2rem}.fixed{position:fixed}.relative{position:relative}.top-0{top:0}.right-0{right:0}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.text-center{text-align:center}.text-gray-200{--text-opacity:1;color:#edf2f7;color:rgba(237,242,247,var(--text-opacity))}.text-gray-300{--text-opacity:1;color:#e2e8f0;color:rgba(226,232,240,var(--text-opacity))}.text-gray-400{--text-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#a0aec0;color:rgba(160,174,192,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#718096;color:rgba(113,128,150,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#4a5568;color:rgba(74,85,104,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.underline{text-decoration:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.w-5{width:1.25rem}.w-8{width:2rem}.w-auto{width:auto}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}@media (min-width:640px){.sm\:rounded-lg{border-radius:.5rem}.sm\:block{display:block}.sm\:items-center{align-items:center}.sm\:justify-start{justify-content:flex-start}.sm\:justify-between{justify-content:space-between}.sm\:h-20{height:5rem}.sm\:ml-0{margin-left:0}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:pt-0{padding-top:0}.sm\:text-left{text-align:left}.sm\:text-right{text-align:right}}@media (min-width:768px){.md\:border-t-0{border-top-width:0}.md\:border-l{border-left-width:1px}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:1024px){.lg\:px-8{padding-left:2rem;padding-right:2rem}}@media (prefers-color-scheme:dark){.dark\:bg-gray-800{--bg-opacity:1;background-color:#2d3748;background-color:rgba(45,55,72,var(--bg-opacity))}.dark\:bg-gray-900{--bg-opacity:1;background-color:#1a202c;background-color:rgba(26,32,44,var(--bg-opacity))}.dark\:border-gray-700{--border-opacity:1;border-color:#4a5568;border-color:rgba(74,85,104,var(--border-opacity))}.dark\:text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.dark\:text-gray-400{--text-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--text-opacity))}.dark\:text-gray-500{--tw-text-opacity:1;color:#6b7280;color:rgba(107,114,128,var(--tw-text-opacity))}}
|
||||
</style> --}}
|
||||
|
||||
|
||||
</head>
|
||||
|
||||
<body class="antialiased" style="width:100%;height:100%;margin:0;">
|
||||
|
||||
<div class="waves">
|
||||
<svg height="100%" width="100%">
|
||||
<circle cx="0" cy="220" r="55%" fill="gray" />
|
||||
</svg>
|
||||
<img class="logo" style="z-index:1;" src="{{ asset('img/logo_arahn_new.png') }}" height="30%"
|
||||
width="25%" />
|
||||
</div>
|
||||
|
||||
|
||||
<div class="loginform">
|
||||
<div class="login-page">
|
||||
<div class="form">
|
||||
@if (Session::has('error'))
|
||||
<div role="alert"
|
||||
style="border: 1px solid red; border-radius:10px; background-color:#d63031;margin-bottom:10%;">
|
||||
<div class="border border-t-0 border-red-400 rounded-b bg-red-100 px-4 py-3"
|
||||
style="color:white;">
|
||||
<p>{{ Session::get('error') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
<form class="login-form" method="POST" action="{{ route('login') }}">
|
||||
@csrf
|
||||
|
||||
<h1>Admin Portal</h1>
|
||||
|
||||
<div class="input-icons">
|
||||
<i class="fa fa-envelope icon"></i>
|
||||
<input class="input-field" type="text" placeholder="Emel" name="email" />
|
||||
@error('email')
|
||||
<p style="color:#d63031;font-size: 11px;font-style: italic;font-weight: bold;margin-top:0;">
|
||||
*Sila pastikan emel anda betul</p>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<div class="input-icons">
|
||||
<i class="fa fa-key icon"></i>
|
||||
<input class="input-field pr-4" type="password" placeholder="Kata Laluan" name="password" />
|
||||
@error('password')
|
||||
<p style="color:#d63031;font-size: 11px;font-style: italic;font-weight: bold;margin-top:0;">
|
||||
*Sila pastikan katalaluan anda betul</p>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<button class="pt-4">Daftar Masuk</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
body {
|
||||
font-family: 'Nunito', sans-serif;
|
||||
background-color: #0B4A5F;
|
||||
}
|
||||
|
||||
.waves {
|
||||
/* background-color:#ecf0f1; */
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.waves .logo {
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
top: 25%;
|
||||
left: 5%;
|
||||
/* margin-top:-75%; */
|
||||
}
|
||||
|
||||
.loginform {
|
||||
position: absolute;
|
||||
top: 30%;
|
||||
right: 20%;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1440px) {
|
||||
.loginform {
|
||||
position: absolute;
|
||||
top: 30%;
|
||||
right: 20%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1024px) {
|
||||
.loginform {
|
||||
position: absolute;
|
||||
top: 30%;
|
||||
right: 10%;
|
||||
}
|
||||
}
|
||||
|
||||
.login-page {
|
||||
width: 360px;
|
||||
padding: 8% 0 0;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
/* .form {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
background: #EE7441;
|
||||
max-width: 360px;
|
||||
border: 2px solid gray;
|
||||
border-radius: 8px;
|
||||
padding: 5px;
|
||||
margin: 0 auto 100px;
|
||||
padding: 45px;
|
||||
text-align: center;
|
||||
box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
|
||||
} */
|
||||
|
||||
.form input {
|
||||
font-family: "Roboto", sans-serif;
|
||||
outline: 0;
|
||||
background: #dadada;
|
||||
border: 2px solid gray;
|
||||
border-radius: 16px;
|
||||
opacity: 0.5;
|
||||
width: 100%;
|
||||
border: 30px;
|
||||
margin: 0 0 15px;
|
||||
padding: 15px;
|
||||
box-sizing: border-box;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.form button {
|
||||
font-family: "Roboto", sans-serif;
|
||||
text-transform: uppercase;
|
||||
outline: 0;
|
||||
background: #3A5C68;
|
||||
border: 2px solid gray;
|
||||
border-radius: 16px;
|
||||
opacity: 0.5;
|
||||
width: 100%;
|
||||
padding: 12px;
|
||||
color: #FFFFFF;
|
||||
font-size: 14px;
|
||||
-webkit-transition: all 0.3 ease;
|
||||
transition: all 0.3 ease;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.form button:hover,
|
||||
.form button:active,
|
||||
.form button:focus {
|
||||
background: #132e15;
|
||||
}
|
||||
|
||||
.form .message {
|
||||
margin: 15px 0 0;
|
||||
color: #b3b3b3;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.form .message a {
|
||||
color: #4CAF50;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.form .register-form {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.container {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
max-width: 300px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.container:before,
|
||||
.container:after {
|
||||
content: "";
|
||||
display: block;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.container .info {
|
||||
margin: 50px auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.container .info h1 {
|
||||
margin: 0 0 15px;
|
||||
padding: 0;
|
||||
font-size: 36px;
|
||||
font-weight: 300;
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
.container .info span {
|
||||
color: #4d4d4d;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.container .info span a {
|
||||
color: #000000;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.container .info span .fa {
|
||||
color: #EF3B3A;
|
||||
}
|
||||
|
||||
/* .login__field {
|
||||
padding: 20px 0px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.login__icon {
|
||||
position: absolute;
|
||||
top: 30px;
|
||||
color: #7875B5;
|
||||
} */
|
||||
|
||||
.input-icons i {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.input-icons {
|
||||
width: 100%;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.icon {
|
||||
padding: 10px;
|
||||
color: rgb(255, 255, 255);
|
||||
min-width: 50px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.input-field {
|
||||
width: 100%;
|
||||
padding: 30px;
|
||||
padding-right: 30px;
|
||||
color: rgb(255, 255, 255);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: rgb(255, 255, 255);
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
@@ -17,24 +17,24 @@
|
||||
xl:w-8
|
||||
"
|
||||
>
|
||||
<div class="text-center mb-5">
|
||||
<div class="text-900 text-3xl font-semibold mb-3">
|
||||
ArrahnBid
|
||||
<img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" />
|
||||
<div class="text-center mb-3">
|
||||
<div class="text-900 text-3xl font-semibold mb-3">
|
||||
<img class="logo-img" src="img/e-rahn-lelong.png" alt="arrahn-logo" />
|
||||
<div class="text-200 text-3xl font-semibold mb-3 mt-3">Daftar Akaun</div>
|
||||
</div>
|
||||
<span class="text-600 font-medium line-height-3"
|
||||
<!-- <span class="text-600 font-medium line-height-3"
|
||||
>Sudah punyai akaun?</span
|
||||
>
|
||||
<router-link
|
||||
v-bind:to="{ name: 'login' }"
|
||||
class="font-medium no-underline ml-2 text-blue-500 cursor-pointer"
|
||||
>Log masuk sekarang!</router-link
|
||||
>
|
||||
> -->
|
||||
</div>
|
||||
<h5>Daftar Akaun</h5>
|
||||
<!-- <h5>Daftar Akaun</h5> -->
|
||||
<div class="grid">
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<div class="field text-200">
|
||||
<label for="name">Nama</label>
|
||||
<InputText
|
||||
id="name"
|
||||
@@ -59,7 +59,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<div class="field text-200">
|
||||
<label for="nokp">No Kad Pengenalan</label>
|
||||
<!-- <select
|
||||
class="p-0 mb-2 form-select"
|
||||
@@ -91,7 +91,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="field">
|
||||
<div class="field text-200">
|
||||
<label for="alamat">Alamat</label>
|
||||
<Textarea
|
||||
id="alamat"
|
||||
@@ -115,7 +115,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<div class="field text-200">
|
||||
<label for="notelbimbit">No Telefon</label>
|
||||
<MazPhoneNumberInput
|
||||
v-model="form.notelbimbit"
|
||||
@@ -140,7 +140,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<div class="field text-200">
|
||||
<label for="email">Emel</label>
|
||||
<InputText
|
||||
id="email"
|
||||
@@ -166,7 +166,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<div class="field text-200">
|
||||
<p class="mb-0" for="username">Username</p>
|
||||
<InputText
|
||||
id="username"
|
||||
@@ -192,7 +192,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<div class="field text-200">
|
||||
<p class="mb-0">Kata Laluan</p>
|
||||
<div class="p-input-icon-right">
|
||||
<i class="pi pi-user" />
|
||||
@@ -267,6 +267,15 @@
|
||||
@click="openModalTNC()"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
<span class="text-200 font-medium line-height-3"
|
||||
>Sudah punyai akaun?
|
||||
</span>
|
||||
<router-link
|
||||
v-bind:to="{ name: 'login' }"
|
||||
class="font-medium no-underline ml-2 text-teal-600 cursor-pointer"
|
||||
>Log masuk sekarang!</router-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Dialog
|
||||
@@ -456,14 +465,14 @@ export default {
|
||||
|
||||
<style scoped>
|
||||
.main-container {
|
||||
background: url("/src/assets/bg3.JPG");
|
||||
background: url("/src/assets/background-lelong.png");
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.logo-img {
|
||||
width: 84px;
|
||||
height: 44px;
|
||||
width: 300px;
|
||||
height: 55px;
|
||||
}
|
||||
|
||||
.h-match-phone-number {
|
||||
@@ -473,4 +482,4 @@ export default {
|
||||
.h-match-password {
|
||||
height: 42px;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
<template>
|
||||
<div>
|
||||
<VueSidebarMenuAkahon />
|
||||
</div>
|
||||
<div v-if="isLoading" class="fadein animation-duration-400">
|
||||
<div
|
||||
class="flex align-items-center justify-content-center container-height"
|
||||
>
|
||||
<div class="flex align-items-center justify-content-center container-height">
|
||||
<div class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<Card>
|
||||
<Card style="margin-bottom: 1em">
|
||||
<template #title>
|
||||
<div class="flex justify-content-between flex-wrap card-container">
|
||||
<div class="flex justify-content-center flex-wrap card-container">
|
||||
<div class="font-normal">Harga Emas Lelongan</div>
|
||||
<Button
|
||||
class="button-standard p-button-rounded p-button-outlined"
|
||||
|
||||
@@ -1,15 +1,7 @@
|
||||
<template>
|
||||
<Card>
|
||||
<template #title
|
||||
><div
|
||||
class="
|
||||
flex
|
||||
justify-content-between
|
||||
flex-wrap
|
||||
card-container
|
||||
purple-container
|
||||
"
|
||||
>
|
||||
<Card style="margin-bottom: 1em">
|
||||
<template #title>
|
||||
<div class="flex justify-content-center flex-wrap card-container purple-container">
|
||||
<div class="font-normal">Lelongan Seterusnya</div>
|
||||
<Button
|
||||
class="button-standard p-button-rounded p-button-outlined"
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<Card style="margin-bottom: 1em">
|
||||
<template #title>
|
||||
<div class="flex justify-content-between flex-wrap card-container">
|
||||
<div class="flex justify-content-center flex-wrap card-container">
|
||||
<div class="font-semibold">Lelongan Hari Ini : <span class="white-space-nowrap">{{ date }}</span></div>
|
||||
<Button
|
||||
class="button-standard p-button-rounded p-button-outlined"
|
||||
|
||||
@@ -1,17 +1,15 @@
|
||||
<template>
|
||||
<the-template>
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="col-12 pt-2">
|
||||
<result-notification></result-notification>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<item-in-cart-notification></item-in-cart-notification>
|
||||
</div>
|
||||
<div class="col-12 lg:col-7">
|
||||
<div class="col-12 lg:col-12">
|
||||
<lelong-today></lelong-today>
|
||||
<lelong-next></lelong-next>
|
||||
</div>
|
||||
<div class="col-12 lg:col-5">
|
||||
<current-karat></current-karat>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -49,15 +49,15 @@
|
||||
<div>Dibangunkan oleh Unit Teknologi Maklumat PKB</div>
|
||||
</div>
|
||||
</footer> -->
|
||||
<div class="layout-footer">
|
||||
<!-- <div class="layout-footer">
|
||||
<div class="layout-footer-left">
|
||||
<span>ArrahnBid</span>
|
||||
<span>E-Rahn Lelong</span>
|
||||
</div>
|
||||
|
||||
<div class="layout-footer-right">
|
||||
<span> Permodalan Kelantan Berhad </span>
|
||||
<span> Xtrabiz Sdn. Bhd. </span>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
@@ -90,6 +90,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
color: rgb(0, 0, 0);
|
||||
}
|
||||
/* .layout-footer-right {
|
||||
font-size: 1.5rem;
|
||||
|
||||
@@ -0,0 +1,494 @@
|
||||
<template>
|
||||
<!-- Navbar for laptop screen size (width>992px) -->
|
||||
<Toast :breakpoints="{ '500px': { width: '100%', right: '0', left: '0' } }" />
|
||||
<div class="card sticky-top lg:flex hidden border-none">
|
||||
<div
|
||||
class="flex justify-content-between px-3 md:px-6 h-3rem flex-wrap main-color"
|
||||
>
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
<!-- <div class="company-title" type="button" v-on:click="toHome()"> -->
|
||||
<!-- <img class="logo-img mr-2" src="img/e-rahn-lelong.png" alt="arrahn-logo" /> -->
|
||||
<Button
|
||||
icon="pi pi-th-large"
|
||||
@click="visibleLeft = true"
|
||||
/>
|
||||
|
||||
<div class="logo-title mr-2">Menu</div>
|
||||
|
||||
<img class="logo-img" src="img/e-rahn-lelong.png" alt="arrahn-logo" type="button" v-on:click="toHome()"/>
|
||||
<!-- <div class="logo-title">E-Rahn Lelong</div> -->
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
<!-- <img class="logo-img" src="img/e-rahn-lelong.png" alt="arrahn-logo" type="button" v-on:click="toHome()"/> -->
|
||||
<!-- <nav class="main-nav">
|
||||
<router-link class="nav-button" v-bind:to="{ name: 'home' }"
|
||||
>Utama</router-link
|
||||
>
|
||||
<router-link class="nav-button" v-bind:to="{ name: 'list' }"
|
||||
>Senarai</router-link
|
||||
>
|
||||
<router-link class="nav-button" v-bind:to="{ name: 'cart' }"
|
||||
>Troli</router-link
|
||||
>
|
||||
<router-link class="nav-button" v-bind:to="{ name: 'bid-record' }"
|
||||
>Rekod</router-link
|
||||
>
|
||||
<router-link class="nav-button" v-bind:to="{ name: 'result' }"
|
||||
>Keputusan</router-link
|
||||
>
|
||||
<router-link class="nav-button" v-bind:to="{ name: 'login' }"
|
||||
>Login</router-link
|
||||
>
|
||||
</nav> -->
|
||||
</div>
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
<div class="profile-title hidden lg:flex">
|
||||
<div class="dropdown">
|
||||
<div
|
||||
class="dropdown-toggle"
|
||||
type="button"
|
||||
data-bs-toggle="dropdown"
|
||||
aria-expanded="false"
|
||||
>
|
||||
<i class="bi bi-person-circle me-1"></i>{{ username }}
|
||||
</div>
|
||||
<ul class="dropdown-menu">
|
||||
<li>
|
||||
<div
|
||||
type="button"
|
||||
class="dropdown-item"
|
||||
v-on:click="toProfile()"
|
||||
>
|
||||
Profil <i class="bi bi-person-workspace"></i>
|
||||
</div>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
<li>
|
||||
<div
|
||||
type="button"
|
||||
v-on:click="doLogout()"
|
||||
class="dropdown-item"
|
||||
>
|
||||
Log Keluar <i class="bi bi-box-arrow-right"></i>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Navbar for phone, tab screen size (width<992px) -->
|
||||
<div class="card sticky-top lg:hidden md:flex border-none">
|
||||
<div
|
||||
class="flex justify-content-between px-3 md:px-6 h-3rem flex-wrap main-color"
|
||||
>
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
|
||||
<Button
|
||||
icon="pi pi-th-large"
|
||||
@click="visibleLeft = true"
|
||||
class="mr-2"
|
||||
/>
|
||||
|
||||
<!-- <div class="logo-title ml-4 mr-5">Menu</div> -->
|
||||
|
||||
<img class="logo-img" src="img/e-rahn-lelong.png" alt="arrahn-logo" />
|
||||
<!-- <div class="company-title" type="button" v-on:click="toHome()">
|
||||
<div class="logo-title">E-Rahn Lelong</div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
<i
|
||||
class="pi pi-bars text-white lg:hidden"
|
||||
@click="visibleRight = true"
|
||||
></i>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div>
|
||||
<div class="flex justify-content-center h-2rem bg-red-500">
|
||||
Countdown 00:00:00
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<!-- <Sidebar v-model:visible="visibleRight" position="right">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="text-center">
|
||||
<i class="bi bi-person-circle me-1"></i> {{ username }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'home' }"
|
||||
>Utama</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'list' }"
|
||||
>Senarai</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'cart' }"
|
||||
>Troli</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'bid-record' }"
|
||||
>Rekod</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'result' }"
|
||||
>Keputusan</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'profile' }"
|
||||
>Profil</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'login' }"
|
||||
>Login</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<a
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-on:click="doLogout()"
|
||||
href="#"
|
||||
><i class="bi bi-box-arrow-right me-1"></i> Log Keluar</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</Sidebar> -->
|
||||
|
||||
<Sidebar :visible.sync="visibleLeft" autoZIndex>
|
||||
<div class="grid">
|
||||
<!-- <div class="col-12">
|
||||
<div class="text-center">
|
||||
<i class="bi bi-person-circle me-1"></i> {{ username }}
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="col-12">
|
||||
<div class="text-center">
|
||||
<img class="logo-img" src="img/e-rahn-lelong.png" alt="arrahn-logo" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'home' }"
|
||||
>Utama</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'list' }"
|
||||
>Senarai</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'cart' }"
|
||||
>Troli</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'bid-record' }"
|
||||
>Rekod</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'result' }"
|
||||
>Keputusan</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'profile' }"
|
||||
>Profil</router-link
|
||||
>
|
||||
</div>
|
||||
<!-- <div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'login' }"
|
||||
>Login</router-link
|
||||
>
|
||||
</div> -->
|
||||
<div class="col-12">
|
||||
<a
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-on:click="doLogout()"
|
||||
href="#"
|
||||
><i class="bi bi-box-arrow-right me-1"></i> Log Keluar</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</Sidebar>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
username: localStorage.getItem("username"),
|
||||
visibleLeft: false,
|
||||
lelongOnline: "",
|
||||
};
|
||||
},
|
||||
setup() {
|
||||
const authenticationStore = useAuthenticationUserStore()
|
||||
|
||||
return { authenticationStore }
|
||||
},
|
||||
mounted: function () {
|
||||
this.getLelongOnline();
|
||||
},
|
||||
methods: {
|
||||
doLogout() {
|
||||
axios
|
||||
.post(
|
||||
"/user/logout",
|
||||
{},
|
||||
{
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
}
|
||||
)
|
||||
.then((response) => {
|
||||
localStorage.clear();
|
||||
this.authenticationStore.$reset();
|
||||
this.$router.push({ name: "login" });
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
localStorage.clear();
|
||||
this.$router.push({ name: "login" });
|
||||
},
|
||||
toHome() {
|
||||
this.$router.push({ name: "home" });
|
||||
},
|
||||
toProfile() {
|
||||
this.$router.push({ name: "profile" });
|
||||
},
|
||||
getLelongOnline() {
|
||||
axios
|
||||
.get("/lelongOnline", {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
})
|
||||
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
if (response.data.success === true) {
|
||||
this.lelongOnline = response.data.lelong.masatamat_lelong;
|
||||
this.$toast.add({
|
||||
severity: "info",
|
||||
summary: "Informasi",
|
||||
detail: "Lelong akan tamat pada " + this.lelongOnline,
|
||||
});
|
||||
} else {
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
// const { createApp, ref } = Vue;
|
||||
|
||||
// const App = {
|
||||
// setup() {
|
||||
// const visibleLeft = ref(false);
|
||||
|
||||
// return {
|
||||
// visibleLeft,
|
||||
// };
|
||||
// },
|
||||
// components: {
|
||||
// "p-sidebar": primevue.sidebar,
|
||||
// "p-button": primevue.button,
|
||||
// },
|
||||
// };
|
||||
|
||||
// createApp(App).use(primevue.config.default).mount("#app");
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/*
|
||||
|
||||
========== 01 TYPOGRAPHY ==========
|
||||
-Font sizes(px)
|
||||
10 / 12 / 14 / 16 / 18 / 20 / 24 / 30 / 36 / 44 / 52 / 62 / 74 / 86 / 98
|
||||
|
||||
========== 02 COLORS ==========
|
||||
-Primary: #1d3461
|
||||
-Shades: #142444
|
||||
-Tints: #bbc2d0 #d2d6df
|
||||
-Accents:
|
||||
-Greys:
|
||||
#555
|
||||
#333
|
||||
|
||||
-Tints KIV: #617190
|
||||
-Accents KIV: #E9C439
|
||||
|
||||
========== 07 WHITESPACE ==========
|
||||
|
||||
-Spacing system(px)
|
||||
2 / 4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 / 80 / 96 / 128
|
||||
|
||||
*/
|
||||
|
||||
/* .nav-link:hover {
|
||||
color: blue !important;
|
||||
}
|
||||
|
||||
router-link:hover {
|
||||
color: blue;
|
||||
} */
|
||||
|
||||
.main-color {
|
||||
background-color: #008f96;
|
||||
}
|
||||
|
||||
.border-none {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background-color: #eeeeee;
|
||||
height: 3.2rem;
|
||||
padding: 0 6.4rem;
|
||||
}
|
||||
|
||||
.company-title {
|
||||
display: flex;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.logo-title {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #f9fafc;
|
||||
font-size: 1.0rem;
|
||||
font-weight: 200;
|
||||
}
|
||||
|
||||
.logo-img {
|
||||
height: 1.6rem;
|
||||
}
|
||||
|
||||
/* .main-nav {
|
||||
background-color: #cb3d3d;
|
||||
} */
|
||||
|
||||
.main-nav-list {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
gap: 3.2rem;
|
||||
align-items: center;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.main-nav-link:link,
|
||||
.main-nav-link {
|
||||
display: flex;
|
||||
text-decoration: none;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 2.4rem;
|
||||
color: #2c2d2e;
|
||||
font-weight: 500;
|
||||
font-size: 1rem;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
.main-nav-link:hover {
|
||||
color:#fec234;
|
||||
}
|
||||
|
||||
.main-nav-link-sidebar:hover {
|
||||
background: #fec234;
|
||||
border-radius: 10px;
|
||||
padding: 7px 20px;
|
||||
color: #1e417b !important;
|
||||
}
|
||||
|
||||
.nav-button {
|
||||
text-decoration: none;
|
||||
margin: 0 1.5rem;
|
||||
color: #eaf0f9;
|
||||
}
|
||||
|
||||
.nav-button:hover {
|
||||
color: #fec234;
|
||||
}
|
||||
|
||||
a.router-link-exact-active {
|
||||
background: #fec234;
|
||||
color: #000000;
|
||||
border-radius: 10px;
|
||||
padding: 7px 20px;
|
||||
}
|
||||
|
||||
a.router-link-exact-active:hover {
|
||||
background: #fec234;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.profile-title {
|
||||
color: #eaf0f9;
|
||||
}
|
||||
|
||||
.arrow-logo {
|
||||
font-size: 0.5rem;
|
||||
}
|
||||
|
||||
.p-component-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,24 +1,13 @@
|
||||
<template>
|
||||
<!-- Navbar for laptop screen size (width>992px) -->
|
||||
<div class="card sticky-top lg:flex hidden border-none">
|
||||
<Toast
|
||||
:breakpoints="{ '992px': { display: 'none' }, }"
|
||||
/>
|
||||
<div
|
||||
class="
|
||||
flex
|
||||
justify-content-between
|
||||
px-3
|
||||
md:px-6
|
||||
h-3rem
|
||||
flex-wrap
|
||||
main-color
|
||||
"
|
||||
>
|
||||
<Toast :breakpoints="{ '992px': { display: 'none' }, }"/>
|
||||
<div class="flex justify-content-between px-3 md:px-6 h-3rem flex-wrap main-color">
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
<div class="company-title" type="button" v-on:click="toHome()">
|
||||
<div class="logo-title">ArrahnBid</div>
|
||||
<img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" />
|
||||
<!-- <div class="logo-title">E-Rahn Lelong</div> -->
|
||||
<!-- <img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" /> -->
|
||||
<img class="logo-img" src="img/e-rahn-lelong.png" alt="arrahn-logo" type="button" v-on:click="toHome()"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
@@ -39,7 +28,7 @@
|
||||
>Keputusan</router-link
|
||||
>
|
||||
<router-link class="nav-button" v-bind:to="{ name: 'policy' }"
|
||||
>Panduan</router-link
|
||||
>Polisi</router-link
|
||||
>
|
||||
</nav>
|
||||
</div>
|
||||
@@ -100,7 +89,7 @@
|
||||
@click="visibleRight = true"
|
||||
></i>
|
||||
<div class="company-title" type="button" v-on:click="toHome()">
|
||||
<div class="logo-title">ArrahnBid</div>
|
||||
<div class="logo-title">E-Rahn Lelong</div>
|
||||
<img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" />
|
||||
</div>
|
||||
</div>
|
||||
@@ -185,7 +174,7 @@
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'policy' }"
|
||||
>Panduan</router-link
|
||||
>Polisi</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
@@ -362,7 +351,7 @@ router-link:hover {
|
||||
padding: 25px 10px;
|
||||
}
|
||||
.main-color {
|
||||
background-color: #1e417b;
|
||||
background-color: #0D908B;
|
||||
}
|
||||
|
||||
.border-none {
|
||||
@@ -373,7 +362,7 @@ router-link:hover {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background-color: #1e417b;
|
||||
background-color: #0D908B;
|
||||
|
||||
height: 3.2rem;
|
||||
padding: 0 6.4rem;
|
||||
@@ -429,7 +418,7 @@ router-link:hover {
|
||||
.nav-button {
|
||||
text-decoration: none;
|
||||
margin: 0 1.5rem;
|
||||
color: #82a4dc;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.nav-button:hover {
|
||||
@@ -437,9 +426,9 @@ router-link:hover {
|
||||
}
|
||||
|
||||
a.router-link-exact-active {
|
||||
background: #d5e1f3;
|
||||
color: #1e417b;
|
||||
border-radius: 10px;
|
||||
background: #FAE79A;
|
||||
color: #000000;
|
||||
border-radius: 5px;
|
||||
padding: 7px 20px;
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,18 @@
|
||||
<Sidebar :visible.sync="visibleLeft" :baseZIndex="1000">
|
||||
<h3>Left Sidebar</h3>
|
||||
</Sidebar>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
visibleLeft: false,
|
||||
// visibleRight: false,
|
||||
// visibleTop: false,
|
||||
// visibleBottom: false,
|
||||
// visibleFull: false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
<template>
|
||||
<div class="content-page">
|
||||
<div class="content">
|
||||
<div class="content-page" style="background-color: #eeeeee;">
|
||||
<div class="content" style="background-color: #eeeeee;">
|
||||
<the-header />
|
||||
<div class="container pt-5">
|
||||
<br>
|
||||
<div class="container pt-2" style="background-color: #FAE79A;">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -7,9 +7,9 @@
|
||||
</template>
|
||||
<template #content>
|
||||
<TabView>
|
||||
<TabPanel :header="'Panduan ArrahnBid'">
|
||||
<TabPanel :header="'Panduan E-Rahn Lelong'">
|
||||
<p>
|
||||
Berikut merupakan video panduan untuk penggunaan ArrahnBid. Sila
|
||||
Berikut merupakan video panduan untuk penggunaan E-Rahn Lelong. Sila
|
||||
tonton
|
||||
<a
|
||||
class="font-bold"
|
||||
|
||||