Merge branch 'finadev' into 'main'
lelong pembida See merge request erahn/lelong-web-pembida!1
This commit is contained in:
Faiqah Zaman
Generated
+932
-885
File diff suppressed because it is too large
Load Diff
+7
-2
@@ -12,17 +12,22 @@
|
||||
"@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",
|
||||
"jspdf-autotable": "^3.5.28",
|
||||
"libphonenumber-js": "^1.10.14",
|
||||
"maz-ui": "^3.0.7",
|
||||
"postcss": "^8",
|
||||
"primeflex": "^3.2.1",
|
||||
"primeicons": "^6.0.1",
|
||||
"primevue": "^3.17.0",
|
||||
"vue": "^3.2.13",
|
||||
"vue": "^3.2.45",
|
||||
"vue-router": "^4.0.14",
|
||||
"vue-sidebar-menu-akahon": "^0.1.4",
|
||||
"vue-sweetalert2": "^5.0.5",
|
||||
"vuex": "^4.0.2"
|
||||
},
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 95 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 88 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 98 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 35 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 77 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
+2
-2
@@ -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</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;
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 926 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 64 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 420 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
|
||||
@@ -13,7 +13,7 @@
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="exampleModalLabel">
|
||||
Terma & Syarat Sistem Lelong
|
||||
Terma & Syarat
|
||||
</h5>
|
||||
<button
|
||||
type="button"
|
||||
@@ -23,85 +23,14 @@
|
||||
></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="row">
|
||||
<div class="col-12 lg:col-6 paragraph-align">
|
||||
<ol class="pr-3">
|
||||
<li>Daftar secara atas talian.</li>
|
||||
<li>Berumur 18 tahun ke atas.</li>
|
||||
<li>
|
||||
Marhun lelongan boleh dilihat dalam sistem untuk dibida.
|
||||
</li>
|
||||
<li>
|
||||
Harga yang disenaraikan dalam web kami adalah
|
||||
<strong>muktamad</strong> dan tidak boleh dirunding.
|
||||
</li>
|
||||
<li>
|
||||
Harga <strong>minimum bidaan</strong> adalah
|
||||
<strong>RM1.00</strong> dari Harga Asas.
|
||||
</li>
|
||||
<li>
|
||||
<strong>Nilai bidaan hendaklah genap</strong> dan penggunaan
|
||||
<strong>nilaian sen adalah tidak dibenarkan.</strong>
|
||||
</li>
|
||||
<li>
|
||||
Waktu <strong>tamat lelongan</strong> adalah
|
||||
<strong>2 jam</strong> selepas waktu dibuka.
|
||||
</li>
|
||||
<li>
|
||||
Sebelum meningggalkan premis, sila semak dan pastikan marhun
|
||||
yang <strong>diterima adalah betul.</strong> Sekiranya
|
||||
terdapat kekurangan dan masalah
|
||||
<strong>setelah marhun dibawa keluar</strong> dari premis,
|
||||
pihak Permodalan Kelantan Berhad
|
||||
<strong
|
||||
>tidak akan bertanggungjawab dan marhun tidak boleh
|
||||
dikembalikan</strong
|
||||
>.
|
||||
</li>
|
||||
<li>
|
||||
Setiap bidaan atas talian yang telah dihantar tidak boleh
|
||||
diubah, sila pastikan nombor siri dan harga yang dibida diisi
|
||||
secara atas talian adalah betul, pihak kami tidak akan
|
||||
bertanggungjawab atas kesilapan pelanggan mengisi harga bidaan
|
||||
atas talian.
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6 paragraph-align">
|
||||
<ol class="pr-3" start="10">
|
||||
<li style="text-transform: uppercase">
|
||||
<strong
|
||||
>Kaedah pembayaran melalui perbankan atas talian (Online
|
||||
Banking).</strong
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
Pembayaran bidaan hendaklah diselesaikan
|
||||
<strong>sebelum jam 4.00</strong>
|
||||
petang pada hari lelongan.
|
||||
</li>
|
||||
<li>
|
||||
Sila serahkan bukti pembayaran semasa menuntut marhun lelongan
|
||||
(di kaunter atau melalui media elektronik sama ada emel atau
|
||||
whatsapp dan marhun lelong hendaklah dituntut sebelum jam 4.00
|
||||
petang).
|
||||
</li>
|
||||
<li>
|
||||
Pembida yang menang di dalam bidaan tetapi gagal melakukan
|
||||
pembayaran pada hari lelongan akan
|
||||
<strong>disenarai hitamkan.</strong>
|
||||
</li>
|
||||
<li>
|
||||
Semua terma dan syarat di atas adalah tertakluk kepada pindaan
|
||||
dan boleh diubah dari masa ke semasa tanpa dimaklumkan kepada
|
||||
pembida.
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
<terms-and-conditions-details></terms-and-conditions-details>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<Button data-bs-dismiss="modal" class="p-button-sm" label="Kembali"></Button>
|
||||
<Button
|
||||
data-bs-dismiss="modal"
|
||||
class="p-button-sm"
|
||||
label="Kembali"
|
||||
></Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -109,7 +38,12 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {};
|
||||
import TermsAndConditionsDetails from './TermsAndConditionsDetails.vue'
|
||||
export default {
|
||||
components: {
|
||||
"terms-and-conditions-details": TermsAndConditionsDetails,
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -0,0 +1,56 @@
|
||||
<template>
|
||||
<div class="row text-left">
|
||||
<div class="col-12 lg:col-6 paragraph-align">
|
||||
<p>
|
||||
Para pembida yang dihargai, anda dinasihatkan untuk memahami segala
|
||||
terma dan syarat bidaan sebelum membuat sebarang bidaan secara atas
|
||||
talian.
|
||||
</p>
|
||||
<ol class="pr-3">
|
||||
<li>Pendaftaran adalah secara atas talian.</li>
|
||||
<li>
|
||||
Bidaan terbuka kepada semua warganegara berumur 18 tahun ke atas dan
|
||||
syarikat/koperasi yang berdaftar di Malaysia.
|
||||
</li>
|
||||
<li>
|
||||
Nilai bidaan hendaklah genap dan penggunaan nilaian sen adalah tidak
|
||||
dibenarkan.
|
||||
</li>
|
||||
<li>
|
||||
Waktu tamat bidaan adalah pada jam 12.30 petang (bergantung kepada
|
||||
perubahan dari masa ke semasa).
|
||||
</li>
|
||||
<li>
|
||||
Pembida berjaya hendaklah menyelesaikan keseluruhan amaun bidaan dan
|
||||
mengambil marhun pada/sebelum jam 4.00 petang.
|
||||
</li>
|
||||
<li>
|
||||
Setiap bidaan atas talian yang telah dihantar tidak boleh diubah. Sila
|
||||
pastikan nombor siri dan harga bidaan adalah betul. Pihak kami tidak
|
||||
akan bertanggungjawab di atas kesilapan pelanggan mengisi harga
|
||||
bidaan.
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6 paragraph-align">
|
||||
<ol class="pr-3" start="7">
|
||||
<li>
|
||||
Kaedah pembayaran adalah melalui perbankan atas talian (Online
|
||||
Banking) sahaja.
|
||||
</li>
|
||||
<li>
|
||||
Sila serahkan bukti pembayaran semasa menuntut marhun bidaan (di
|
||||
kaunter atau melalui media elektronik sama ada emel atau Whatsapp).
|
||||
</li>
|
||||
<li>
|
||||
Pembida yang menang di dalam bidaan tetapi gagal melakukan pembayaran
|
||||
pada masa yang telah ditetapkan akan disenarai hitamkan.
|
||||
</li>
|
||||
<li>
|
||||
Semua Terma & Syarat diatas adalah tertakluk kepada pindaan dan boleh
|
||||
diubah dari masa ke semasa tanpa dimaklumkan kepada pembida.
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,50 +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
|
||||
"
|
||||
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: -85px"
|
||||
>
|
||||
<img
|
||||
class="logo-img1"
|
||||
src="img/e-Rahn_Logo_FA-01.png"
|
||||
alt="erahn-logo"
|
||||
/>
|
||||
</div>
|
||||
<span class="text-600 font-medium line-height-3"
|
||||
<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: -85px"
|
||||
>
|
||||
<img
|
||||
class="logo-img3"
|
||||
src="img/e-rahn-lelong.png"
|
||||
alt="erahn-logo"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</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 Masuk</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 no-underline ml-2 text-white 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"
|
||||
>Username</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" />
|
||||
@@ -52,6 +63,7 @@
|
||||
class="mb-2"
|
||||
v-model="form.username"
|
||||
type="text"
|
||||
placeholder="Username"
|
||||
required
|
||||
></InputText>
|
||||
</span>
|
||||
@@ -61,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"
|
||||
/>
|
||||
@@ -211,12 +221,38 @@ export default {
|
||||
#9599e2 100%
|
||||
),
|
||||
url("/src/assets/background_arrahn.jpg"); */
|
||||
background-image: url("/src/assets/background-lelong.png");
|
||||
background-color: #fec234;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.logo-img {
|
||||
width: 84px;
|
||||
height: 44px;
|
||||
.content-bg {
|
||||
background: #fff9f9eb !important;
|
||||
}
|
||||
|
||||
.logo-img {
|
||||
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>
|
||||
@@ -1,14 +1,8 @@
|
||||
<template>
|
||||
<Toast :breakpoints="{ '767px': { width: '100%', right: '0', left: '0' } }" />
|
||||
<div class="main-container">
|
||||
<div
|
||||
class="
|
||||
flex
|
||||
main-container
|
||||
min-h-screen
|
||||
align-items-center
|
||||
justify-content-center
|
||||
m-5
|
||||
"
|
||||
class="flex min-h-screen align-items-center justify-content-center p-5"
|
||||
>
|
||||
<div
|
||||
class="
|
||||
@@ -23,24 +17,24 @@
|
||||
xl:w-8
|
||||
"
|
||||
>
|
||||
<div class="text-center mb-5">
|
||||
<div class="text-center mb-3">
|
||||
<div class="text-900 text-3xl font-semibold mb-3">
|
||||
ArrahnBid
|
||||
<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" />
|
||||
<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"
|
||||
@@ -65,15 +59,15 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<!-- <label for="nokp">No Kad Pengenalan</label> -->
|
||||
<select
|
||||
<div class="field text-200">
|
||||
<label for="nokp">No Kad Pengenalan</label>
|
||||
<!-- <select
|
||||
class="p-0 mb-2 form-select"
|
||||
style="width: 190px; border: none"
|
||||
>
|
||||
<option selected value="nokp">No Kad Pengenalan</option>
|
||||
<option value="passpor">No Passport</option>
|
||||
</select>
|
||||
</select> -->
|
||||
<InputText
|
||||
id="nokp"
|
||||
type="text"
|
||||
@@ -92,17 +86,16 @@
|
||||
"
|
||||
></InputText>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.nokp.$error"
|
||||
>No KP diperlukan</InlineMessage
|
||||
>Semak No KP</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<label for="notelbimbit">No Telefon</label>
|
||||
<!-- <InputText
|
||||
id="notelbimbit"
|
||||
type="text"
|
||||
v-model="form.notelbimbit"
|
||||
<div class="col-12">
|
||||
<div class="field text-200">
|
||||
<label for="alamat">Alamat</label>
|
||||
<Textarea
|
||||
id="alamat"
|
||||
v-model="form.alamat"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
@@ -115,10 +108,19 @@
|
||||
focus:border-primary
|
||||
w-full
|
||||
"
|
||||
></InputText> -->
|
||||
></Textarea>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.alamat.$error"
|
||||
>Alamat diperlukan</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field text-200">
|
||||
<label for="notelbimbit">No Telefon</label>
|
||||
<MazPhoneNumberInput
|
||||
v-model="form.notelbimbit"
|
||||
show-code-on-list
|
||||
:fetch-country="true"
|
||||
:preferred-countries="['MY']"
|
||||
:translations="{
|
||||
countrySelector: {
|
||||
@@ -138,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"
|
||||
@@ -164,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"
|
||||
@@ -190,27 +192,10 @@
|
||||
</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" />
|
||||
<!-- <InputText
|
||||
id="password"
|
||||
type="text"
|
||||
v-model="form.password"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
p-2
|
||||
border-1 border-solid
|
||||
surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
"
|
||||
></InputText> -->
|
||||
<Password
|
||||
v-model="form.password"
|
||||
toggleMask
|
||||
@@ -231,45 +216,9 @@
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<label for="confirmpassword">Tetapkan Kata Laluan</label>
|
||||
<InputText
|
||||
id="confirmpassword"
|
||||
type="text"
|
||||
v-model="form.password_confirmation"
|
||||
disabled
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
p-2
|
||||
border-1 border-solid
|
||||
surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
"
|
||||
></InputText>
|
||||
<InlineMessage class="mt-1"
|
||||
>Tetapkan kata laluan diperlukan</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="col-12">
|
||||
<!-- <div class="col-12">
|
||||
<div class="field">
|
||||
<label for="frontic">Kad Pengenalan Hadapan</label>
|
||||
<!-- <FileUpload
|
||||
name="demo[]"
|
||||
url="./upload"
|
||||
:maxFileSize="1500000"
|
||||
:fileLimit="1"
|
||||
:multiple="false"
|
||||
:showUploadButton="false"
|
||||
:showCancelButton="false"
|
||||
v-model="form.images.file1"
|
||||
/> -->
|
||||
<input
|
||||
class="form-control"
|
||||
type="file"
|
||||
@@ -277,20 +226,20 @@
|
||||
ref="formFileRef"
|
||||
@change="readImage()"
|
||||
/>
|
||||
<!-- <InlineMessage class="mt-1" v-if="v$.form.images.file1.$error"
|
||||
<InlineMessage class="mt-1" v-if="v$.form.images.file1.$error"
|
||||
>Kad pengenalan hadapan diperlukan</InlineMessage
|
||||
> -->
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="field">
|
||||
<label for="backic">Kad Pengenalan Belakang</label>
|
||||
<input class="form-control" type="file" />
|
||||
<!-- <InlineMessage class="mt-1" v-if="v$.form.images.file2.$error"
|
||||
<InlineMessage class="mt-1" v-if="v$.form.images.file2.$error"
|
||||
>Kad pengenalan belakang diperlukan</InlineMessage
|
||||
> -->
|
||||
</div>
|
||||
>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="col-12">
|
||||
<div class="mt-3 mb-1">
|
||||
<label>
|
||||
@@ -305,145 +254,71 @@
|
||||
<div class="col-12 text-center">
|
||||
<Button
|
||||
class="p-button-sm"
|
||||
label="Daftar"
|
||||
label="Teruskan"
|
||||
icon="pi pi-sign-in"
|
||||
iconPos="right"
|
||||
@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
|
||||
header="Terma & Syarat"
|
||||
v-model:visible="isDisplayTNC"
|
||||
:style="{ width: '80vw' }"
|
||||
:modal="true"
|
||||
>
|
||||
<div>
|
||||
<terms-and-conditions-details></terms-and-conditions-details>
|
||||
</div>
|
||||
<template #footer>
|
||||
<Button
|
||||
label="Batal Pendaftaran"
|
||||
icon="pi pi-times"
|
||||
iconPos="right"
|
||||
@click="closeModalTNC()"
|
||||
class="p-button-text"
|
||||
/>
|
||||
<Button
|
||||
class="p-button-sm"
|
||||
label="Daftar Sekarang"
|
||||
:loading="isLoading"
|
||||
icon="pi pi-sign-in"
|
||||
iconPos="right"
|
||||
@click="doRegister()"
|
||||
></Button>
|
||||
</template>
|
||||
</Dialog>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="container-fluid p-2">
|
||||
<div class="row justify-content-center p-5 rounded">
|
||||
<h1 class="mb-5 text-primary">Sistem Lelong</h1>
|
||||
<h4>Daftar Akaun</h4>
|
||||
<form @submit.prevent="submit">
|
||||
<div class="row">
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input type="text" class="form-control" v-model="form.name" />
|
||||
<label>Nama</label>
|
||||
</div>
|
||||
<div style="font-size: 15px" class="fst-italic text-danger">
|
||||
<div class="text-start">
|
||||
*Minimum tambahan harga bida adalah RM1.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input type="text" class="form-control" v-model="form.nokp" />
|
||||
<label>No KP</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
v-model="form.notelbimbit"
|
||||
/>
|
||||
<label>No. Telefon</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input type="email" class="form-control" v-model="form.email" />
|
||||
<label>E-mel</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
autocomplete="off"
|
||||
v-model="form.username"
|
||||
/>
|
||||
<label>Username</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="password"
|
||||
class="form-control"
|
||||
v-model="form.password"
|
||||
/>
|
||||
<label>Password</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="password"
|
||||
class="form-control"
|
||||
v-model="form.password_confirmation"
|
||||
/>
|
||||
<label>Password Confirmation</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6 mb-1">
|
||||
<label>Kad Pengenalan Hadapan</label>
|
||||
<input type="file" class="form-control" />
|
||||
</div>
|
||||
<div class="col-6 mb-1">
|
||||
<label>Kad Pengenalan Belakang</label>
|
||||
<input type="file" class="form-control" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="checkbox mt-3 mb-3">
|
||||
<label>
|
||||
<input type="checkbox" value="1" id="register_agree" /> Setuju
|
||||
Dengan
|
||||
<terms-and-conditions></terms-and-conditions>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-3">
|
||||
<button
|
||||
@click="doRegister"
|
||||
class="w-100 mt-4 mb-5 btn btn-primary"
|
||||
type="submit"
|
||||
>
|
||||
Daftar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<router-link to="/login">Log Masuk</router-link>
|
||||
</div>
|
||||
</div> -->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import useVuelidate from "@vuelidate/core";
|
||||
import { required, email, minLength } from "@vuelidate/validators";
|
||||
import { required, email, minLength, maxLength } from "@vuelidate/validators";
|
||||
import TermsAndConditionsDetails from "./TermsAndConditionsDetails.vue";
|
||||
|
||||
export default {
|
||||
name: "Register",
|
||||
components: {
|
||||
"terms-and-conditions-details": TermsAndConditionsDetails,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
v$: useVuelidate(),
|
||||
alertMessages: Array,
|
||||
isLoading: false,
|
||||
isDisplayTNC: false,
|
||||
form: {
|
||||
name: "",
|
||||
username: "",
|
||||
@@ -452,6 +327,7 @@ export default {
|
||||
email: "",
|
||||
notelbimbit: "",
|
||||
register_agree: null,
|
||||
alamat: "",
|
||||
// password_confirmation: "",
|
||||
images: {
|
||||
file1: {
|
||||
@@ -478,8 +354,8 @@ export default {
|
||||
axios
|
||||
.post("/register", this.form)
|
||||
.then((response) => {
|
||||
// console.log("doRegister", response);
|
||||
if (response.data.success == true) {
|
||||
console.log(response);
|
||||
localStorage.setItem("token", response.data.token);
|
||||
localStorage.setItem("id", response.data.user.id);
|
||||
localStorage.setItem("nokp", response.data.user.nokp);
|
||||
@@ -494,6 +370,7 @@ export default {
|
||||
this.isLoading = false;
|
||||
} else if (response.data.success == false) {
|
||||
this.isLoading = false;
|
||||
this.isDisplayTNC = false;
|
||||
this.alertMessages = response.data.message;
|
||||
Object.values(this.alertMessages).forEach((val) =>
|
||||
this.$toast.add({
|
||||
@@ -502,6 +379,14 @@ export default {
|
||||
detail: val[0],
|
||||
})
|
||||
);
|
||||
} else if (response.data.success == "Staff") {
|
||||
this.isLoading = false;
|
||||
this.isDisplayTNC = false;
|
||||
this.$toast.add({
|
||||
severity: "warn",
|
||||
summary: "Failed to register!",
|
||||
detail: response.data.message,
|
||||
});
|
||||
} else {
|
||||
this.isLoading = false;
|
||||
alert(response);
|
||||
@@ -515,6 +400,15 @@ export default {
|
||||
});
|
||||
}
|
||||
},
|
||||
openModalTNC() {
|
||||
this.v$.$validate();
|
||||
if (!this.v$.$error) {
|
||||
this.isDisplayTNC = true;
|
||||
}
|
||||
},
|
||||
closeModalTNC() {
|
||||
this.isDisplayTNC = false;
|
||||
},
|
||||
readImage() {},
|
||||
},
|
||||
validations() {
|
||||
@@ -522,11 +416,12 @@ export default {
|
||||
form: {
|
||||
name: { required },
|
||||
username: { required },
|
||||
nokp: { required },
|
||||
nokp: { required, minLengthValue: minLength(12), maxLengthValue: maxLength(12) },
|
||||
password: { required, minLengthValue: minLength(8) },
|
||||
email: { required, email },
|
||||
notelbimbit: { required },
|
||||
notelbimbit: { required, minLengthValue: minLength(8) },
|
||||
register_agree: { required },
|
||||
alamat: { required },
|
||||
// images: {
|
||||
// file1: {
|
||||
// filename: { required },
|
||||
@@ -542,9 +437,15 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.main-container {
|
||||
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 {
|
||||
|
||||
@@ -1,18 +1,15 @@
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-else
|
||||
style="min-height: 70vh"
|
||||
class="fadein animation-duration-400"
|
||||
>
|
||||
<div v-else style="min-height: 70vh" class="fadein animation-duration-400">
|
||||
<div v-if="isSuccess" class="grid justify-content-center">
|
||||
<div class="col-12 lg:col-11">
|
||||
<Card>
|
||||
@@ -23,7 +20,18 @@
|
||||
<Accordion :multiple="true">
|
||||
<AccordionTab v-for="bid in listBid" v-bind:key="bid">
|
||||
<template #header>
|
||||
<span>{{ bid.caw_name }}</span>
|
||||
<div class="flex justify-content-between w-100">
|
||||
<div class="align-self-center" style="margin: 5px">
|
||||
{{ bid.caw_name }}
|
||||
</div>
|
||||
<div class="style-info">
|
||||
Jumlah RM{{
|
||||
bid.total_bidaan
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table text-center table-bordered table-hover">
|
||||
@@ -62,11 +70,13 @@
|
||||
<tr style="text-transform: uppercase">
|
||||
<th colspan="3">Jumlah</th>
|
||||
<th>{{ bid.total_berat }}g</th>
|
||||
<th>RM{{
|
||||
<th>
|
||||
RM{{
|
||||
bid.total_bidaan
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}</th>
|
||||
}}
|
||||
</th>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -76,70 +86,6 @@
|
||||
</template>
|
||||
</Card>
|
||||
</div>
|
||||
<!-- <div class="accordion" id="accordionExample">
|
||||
<div v-for="bid in listBid" v-bind:key="bid" class="accordion-item">
|
||||
<h2 class="accordion-header" id="headingOne">
|
||||
<button
|
||||
class="accordion-button"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#collapseOne"
|
||||
aria-expanded="true"
|
||||
aria-controls="collapseOne"
|
||||
>
|
||||
{{ bid.caw_name }}
|
||||
</button>
|
||||
</h2>
|
||||
<div
|
||||
id="collapseOne"
|
||||
class="accordion-collapse collapse show"
|
||||
aria-labelledby="headingOne"
|
||||
data-bs-parent="#accordionExample"
|
||||
>
|
||||
<div class="accordion-body">
|
||||
<table class="table table-bordered table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Bil</th>
|
||||
<th scope="col">No Rujukan</th>
|
||||
<th scope="col">Tarikh/Masa Bidaan</th>
|
||||
<th scope="col">Berat</th>
|
||||
<th scope="col">Harga Bida</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(item, index) in bid.lelongbid" v-bind:key="item">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>
|
||||
<a
|
||||
href="#"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#marhunModal"
|
||||
v-on:click="marhunModal(item)"
|
||||
>{{ item.norujukan }}</a
|
||||
>
|
||||
</td>
|
||||
<td>{{ item.masa_bidaan }}</td>
|
||||
<td>{{ item.berat }}g</td>
|
||||
<td>
|
||||
RM{{
|
||||
item.hargabida
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="text-transform: uppercase">
|
||||
<th colspan="3">Jumlah</th>
|
||||
<th>xxxg</th>
|
||||
<th>RMxxxxx</th>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div v-else>
|
||||
<div
|
||||
@@ -156,7 +102,7 @@
|
||||
<span class="text-400"
|
||||
>Sila rujuk halaman
|
||||
<router-link v-bind:to="{ name: 'home' }">Utama</router-link>
|
||||
untuk jadual lelong.</span
|
||||
untuk jadual lelongan.</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@@ -193,25 +139,32 @@
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border: 1px solid rgba(0, 0, 0, 0.125);
|
||||
min-height: 300px;
|
||||
min-width: 300px;
|
||||
max-height: 600px;
|
||||
max-width: 600px;
|
||||
"
|
||||
>
|
||||
-gambar marhun-
|
||||
<item-master-image-modal
|
||||
v-if="theData.filemarhun"
|
||||
v-bind:key="reloadImageComponent"
|
||||
v-bind:norujukan="theData.norujukan"
|
||||
v-bind:filemarhun_id="theData.filemarhun[0].id"
|
||||
></item-master-image-modal>
|
||||
<p v-else style="text-align: center; width: 100%">
|
||||
Image Unavailable
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-12 text-center lg:col-6">
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table table-bordered">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td>Bil</td>
|
||||
<td style="min-width: 115px">Jenis Marhun</td>
|
||||
<td style="min-width: 42px">Karat</td>
|
||||
<td style="min-width: 42px">Berat</td>
|
||||
<td style="min-width: 102px">Harga Asas</td>
|
||||
<th>Bil</th>
|
||||
<th style="min-width: 115px">Jenis Marhun</th>
|
||||
<th style="min-width: 42px">Karat</th>
|
||||
<th style="min-width: 42px">Berat</th>
|
||||
<th style="min-width: 102px">Harga Asas</th>
|
||||
</tr>
|
||||
<tr
|
||||
v-for="(marhun, index) in theData.lelongbidmarhun"
|
||||
@@ -276,9 +229,13 @@
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import ItemMasterImageModal from "../list/ItemMasterImageModal.vue";
|
||||
|
||||
export default {
|
||||
name: "BidDetail",
|
||||
components: {
|
||||
"item-master-image-modal": ItemMasterImageModal
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
listBid: [],
|
||||
@@ -286,6 +243,7 @@ export default {
|
||||
isSuccess: false,
|
||||
theData: "",
|
||||
date: "",
|
||||
reloadImageComponent: 0,
|
||||
// userId: localStorage.getItem("id"),
|
||||
};
|
||||
},
|
||||
@@ -300,7 +258,7 @@ export default {
|
||||
var mm = String(today.getMonth() + 1).padStart(2, "0"); //January is 0!
|
||||
var yyyy = today.getFullYear();
|
||||
|
||||
today = yyyy + "-" + mm + "-" + dd;
|
||||
today = dd + "-" + mm + "-" + yyyy;
|
||||
this.date = today;
|
||||
},
|
||||
bidRecord() {
|
||||
@@ -310,11 +268,9 @@ export default {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
params: {
|
||||
lelongId: localStorage.getItem("lelong_id"),
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
// console.log("bidRecord", response);
|
||||
if (response.data.success == true) {
|
||||
this.isLoading = false;
|
||||
this.isSuccess = true;
|
||||
@@ -330,6 +286,7 @@ export default {
|
||||
},
|
||||
marhunModal(value) {
|
||||
this.theData = value;
|
||||
this.reloadImageComponent += 1;
|
||||
console.log(value);
|
||||
},
|
||||
},
|
||||
@@ -340,4 +297,18 @@ export default {
|
||||
.container-height {
|
||||
min-height: 70vh;
|
||||
}
|
||||
|
||||
.style-info {
|
||||
background: #e4f8f0;
|
||||
border: solid #1ea97c;
|
||||
border-width: 0px;
|
||||
color: #1ea97c;
|
||||
font-size: 1rem;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
padding: 0.4rem 0.9rem;
|
||||
margin: 0;
|
||||
border-radius: 6px;
|
||||
font-weight: 400;
|
||||
}
|
||||
</style>
|
||||
@@ -15,108 +15,6 @@
|
||||
>
|
||||
<div v-if="isSuccess" class="row">
|
||||
<div class="col-12 lg:col-9">
|
||||
<!-- <div class="card">
|
||||
<div class="card-header"><h5>SENARAI TROLI</h5></div>
|
||||
<div class="accordion" id="accordionExample">
|
||||
<div
|
||||
v-for="item in listItems"
|
||||
v-bind:key="item"
|
||||
class="accordion-item"
|
||||
>
|
||||
<h2 class="accordion-header" id="headingOne">
|
||||
<button
|
||||
class="accordion-button"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#collapseOne"
|
||||
aria-expanded="true"
|
||||
aria-controls="collapseOne"
|
||||
>
|
||||
{{ item.caw_name }}
|
||||
</button>
|
||||
</h2>
|
||||
<div
|
||||
id="collapseOne"
|
||||
class="accordion-collapse collapse show"
|
||||
aria-labelledby="headingOne"
|
||||
data-bs-parent="#accordionExample"
|
||||
>
|
||||
<div class="accordion-body">
|
||||
<table class="table table-bordered table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Bil</th>
|
||||
<th>No Rujukan</th>
|
||||
<th>Berat</th>
|
||||
<th>Harga Asas</th>
|
||||
<th>Harga Bida</th>
|
||||
<th>Tindakan</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr
|
||||
v-for="(surat, index) in item.lelongbid"
|
||||
v-bind:key="surat"
|
||||
>
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>
|
||||
<a
|
||||
href="#"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#marhunModal"
|
||||
v-on:click="openModal(surat)"
|
||||
>
|
||||
{{ surat.norujukan }}
|
||||
</a>
|
||||
</td>
|
||||
<td>{{ surat.berat }}g</td>
|
||||
<td>
|
||||
RM{{
|
||||
surat.hargaasas
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</td>
|
||||
<td>
|
||||
RM{{
|
||||
surat.hargabida
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</td>
|
||||
<td>
|
||||
<button
|
||||
class="btn me-1 ms-1 btn-warning"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#editModal"
|
||||
v-on:click="openModal(surat)"
|
||||
>
|
||||
Ubah Bidaan
|
||||
</button>
|
||||
<button
|
||||
class="btn me-1 ms-1 btn-danger"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#deleteModal"
|
||||
v-on:click="openModal(surat)"
|
||||
>
|
||||
Padam Surat
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="text-transform: uppercase">
|
||||
<th colspan="2">JUMLAH</th>
|
||||
<th>xxxg</th>
|
||||
<th></th>
|
||||
<th>RMxxxxxx</th>
|
||||
<td></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<Card>
|
||||
<template #title>
|
||||
<div class="font-normal">Senarai Troli</div>
|
||||
@@ -125,8 +23,18 @@
|
||||
<Accordion :multiple="true">
|
||||
<AccordionTab v-for="item in listItems" v-bind:key="item">
|
||||
<template #header>
|
||||
<span>{{ item.caw_name }}</span>
|
||||
<!-- <span class="ml-2">Jumlah:RMXXXX</span> -->
|
||||
<div class="flex justify-content-between w-100">
|
||||
<div class="align-self-center" style="margin: 5px">
|
||||
{{ item.caw_name }}
|
||||
</div>
|
||||
<div class="style-info">
|
||||
Jumlah RM{{
|
||||
item.total_bidaan
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table text-center table-bordered table-hover">
|
||||
@@ -232,12 +140,6 @@
|
||||
}}
|
||||
</p>
|
||||
</div>
|
||||
<!-- <Button
|
||||
label="Teruskan"
|
||||
class="p-button-sm w-full"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#bidModal"
|
||||
/> -->
|
||||
<Button
|
||||
label="Teruskan"
|
||||
class="p-button-sm w-full"
|
||||
@@ -299,18 +201,23 @@
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border: 1px solid rgba(0, 0, 0, 0.125);
|
||||
min-height: 300px;
|
||||
min-width: 300px;
|
||||
max-height: 600px;
|
||||
max-width: 600px;
|
||||
"
|
||||
>
|
||||
-gambar marhun-
|
||||
<item-master-image-modal
|
||||
v-if="theSurat.filemarhun"
|
||||
v-bind:key="reloadImageComponent"
|
||||
v-bind:norujukan="theSurat.norujukan"
|
||||
v-bind:filemarhun_id="theSurat.filemarhun[0].id"
|
||||
></item-master-image-modal>
|
||||
<p v-else style="text-align: center; width: 100%">
|
||||
Image Unavailable
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-12 text-center lg:col-6">
|
||||
<!-- <p>Marhun: {{ theSurat.marhun }}</p>
|
||||
<p>Jumlah Berat: {{ theSurat.berat }}g</p> -->
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table table-bordered">
|
||||
<tbody>
|
||||
@@ -351,62 +258,6 @@
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<!-- <div class="row justify-content-center">
|
||||
<div class="col-3">
|
||||
<label class="col-form-label text-end"
|
||||
>Jumlah Harga Asas</label
|
||||
>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<div class="input-group mb-3">
|
||||
<span class="input-group-text">RM</span>
|
||||
<div
|
||||
style="background-color: #e9ecef; padding-bottom: 0px"
|
||||
class="form-control text-start justify-content-start"
|
||||
disabled
|
||||
>
|
||||
{{ theSurat.hargaasas }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row justify-content-center mb-3">
|
||||
<div class="col-3">
|
||||
<label class="col-form-label">Tambahan Harga Bida</label>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<div class="input-group">
|
||||
<span class="input-group-text">RM</span>
|
||||
<input
|
||||
type="text"
|
||||
id="tambahanbida"
|
||||
class="form-control"
|
||||
@keyup="calcTotal()"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-7">
|
||||
<div style="font-size: 15px" class="fst-italic text-danger">
|
||||
<div class="text-end">
|
||||
*Minimum tambahan harga bida adalah RM1.
|
||||
</div>
|
||||
<div class="text-end">
|
||||
*Gandaan ringgit sahaja dibenarkan.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-3">
|
||||
<label class="col-form-label">Jumlah Harga Bida</label>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<div class="input-group mb-3">
|
||||
<span class="input-group-text">RM</span>
|
||||
<input type="text" class="form-control" disabled />
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-6">
|
||||
<label class="col-form-label">Jumlah Harga Bida</label>
|
||||
@@ -440,23 +291,6 @@
|
||||
v-on:click="openModal(theSurat)"
|
||||
class="p-button-warning p-button-text"
|
||||
/>
|
||||
|
||||
<!-- <button
|
||||
class="btn me-1 ms-1 btn-warning"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#editModal"
|
||||
v-on:click="openModal(theSurat)"
|
||||
>
|
||||
Ubah Bidaan
|
||||
</button>
|
||||
<button
|
||||
class="btn me-1 ms-1 btn-danger"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#deleteModal"
|
||||
v-on:click="openModal(theSurat)"
|
||||
>
|
||||
Padam Surat
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -465,20 +299,7 @@
|
||||
class="p-button-sm"
|
||||
label="Kembali"
|
||||
data-bs-dismiss="modal"
|
||||
icon="pi pi-angle-right"
|
||||
iconPos="right"
|
||||
/>
|
||||
|
||||
<!-- <button
|
||||
type="submit"
|
||||
class="btn btn-secondary"
|
||||
data-bs-dismiss="modal"
|
||||
>
|
||||
Kembali
|
||||
</button> -->
|
||||
<!-- <button type="submit" class="btn btn-success" @click="updateItem()">
|
||||
Terima
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -597,20 +418,6 @@
|
||||
:loading="isLoadingUbah"
|
||||
@click="updateItem(theSurat)"
|
||||
/>
|
||||
<!-- <button
|
||||
type="submit"
|
||||
class="btn btn-danger me-2"
|
||||
data-bs-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-success"
|
||||
@click="updateItem(theSurat)"
|
||||
>
|
||||
Ubah
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -680,20 +487,6 @@
|
||||
:loading="isLoadingPadam"
|
||||
@click="deleteItem(theSurat)"
|
||||
/>
|
||||
<!-- <button
|
||||
type="submit"
|
||||
class="btn btn-secondary me-2"
|
||||
data-bs-dismiss="modal"
|
||||
>
|
||||
Kembali
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-danger"
|
||||
@click="deleteItem(theSurat)"
|
||||
>
|
||||
Padam
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -742,19 +535,6 @@
|
||||
<p class="text-danger">
|
||||
<i>*Bidaan tidak dapat diubah selepas dihantar.</i>
|
||||
</p>
|
||||
|
||||
<!-- <table class="table table-bordered">
|
||||
<tbody>
|
||||
<tr class="bg-light">
|
||||
<th>Jumlah Surat</th>
|
||||
<th>Jumlah Bidaan</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>{{ total_sag }}</td>
|
||||
<td>RM{{ total_bidaan }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table> -->
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
@@ -774,10 +554,7 @@
|
||||
<p
|
||||
class="fst-italic mt-3 fw-lighter"
|
||||
style="text-align: right; font-size: small"
|
||||
>
|
||||
<!-- *Pelayar akan dialihkan ke halaman pembayaran jika butang 'Bayar'
|
||||
ditekan. -->
|
||||
</p>
|
||||
></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -893,9 +670,13 @@
|
||||
import axios from "axios";
|
||||
import useVuelidate from "@vuelidate/core";
|
||||
import { required, integer, numeric, minValue } from "@vuelidate/validators";
|
||||
import ItemMasterImageModal from "../list/ItemMasterImageModal.vue";
|
||||
|
||||
export default {
|
||||
emits: ["reloadComponent"],
|
||||
components: {
|
||||
"item-master-image-modal": ItemMasterImageModal,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
v$: useVuelidate(),
|
||||
@@ -910,6 +691,7 @@ export default {
|
||||
listItems: "",
|
||||
theSurat: "",
|
||||
tambahanBidaan: "",
|
||||
reloadImageComponent: 0,
|
||||
jumlahBidaan: "",
|
||||
akadLelong: null,
|
||||
hargaAsas: "",
|
||||
@@ -955,9 +737,9 @@ export default {
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
// console.log("listCart", response);
|
||||
this.isLoading = false;
|
||||
if (response.data.success == true) {
|
||||
console.log(response);
|
||||
this.isSuccess = true;
|
||||
this.listItems = response.data.cart;
|
||||
this.masterTotalSurat = response.data.master_total_surat;
|
||||
@@ -965,7 +747,6 @@ export default {
|
||||
} else if (response.data.success == false) {
|
||||
this.isSuccess = false;
|
||||
}
|
||||
console.log(response);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
@@ -976,6 +757,7 @@ export default {
|
||||
this.tambahanBidaan = value.hargabida - value.hargaasas;
|
||||
this.jumlahBidaan = parseFloat(value.hargabida);
|
||||
this.hargaAsas = value.hargaasas;
|
||||
this.reloadImageComponent += 1;
|
||||
},
|
||||
deleteItem(value) {
|
||||
this.isLoadingPadam = true;
|
||||
@@ -1041,10 +823,10 @@ export default {
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
// console.log("updateItem", response);
|
||||
this.isLoadingUbah = false;
|
||||
// this.isLoading = true;
|
||||
this.$refs.editClose.click();
|
||||
console.log(response);
|
||||
this.$swal.fire({
|
||||
icon: "success",
|
||||
title: "Bidaan Berjaya Diubah",
|
||||
@@ -1087,7 +869,7 @@ export default {
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
// console.log("bidderSelectBidItem", response);
|
||||
if (response.data.success == "success") {
|
||||
this.isLoadingDaftar = false;
|
||||
this.$refs.daftarBidaanClose.click();
|
||||
@@ -1101,7 +883,6 @@ export default {
|
||||
allowEscapeKey: false,
|
||||
});
|
||||
// this.loading = false;
|
||||
console.log(response);
|
||||
this.$emit("reloadComponent");
|
||||
} else {
|
||||
this.isLoadingDaftar = false;
|
||||
@@ -1156,4 +937,18 @@ export default {
|
||||
.container-height {
|
||||
min-height: 70vh;
|
||||
}
|
||||
|
||||
.style-info {
|
||||
background: #e4f8f0;
|
||||
border: solid #1ea97c;
|
||||
border-width: 0px;
|
||||
color: #1ea97c;
|
||||
font-size: 1rem;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
padding: 0.4rem 0.9rem;
|
||||
margin: 0;
|
||||
border-radius: 6px;
|
||||
font-weight: 400;
|
||||
}
|
||||
</style>
|
||||
@@ -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"
|
||||
|
||||
@@ -8,15 +8,17 @@
|
||||
</div>
|
||||
<div v-else>
|
||||
<div v-if="responseData" class="fadein animation-duration-400">
|
||||
<InlineMessage class="mb-2" severity="info">Kemaskini pada {{ updatedTime }}</InlineMessage>
|
||||
<InlineMessage class="mb-2" severity="info"
|
||||
>Kemaskini pada {{ updatedTime }}</InlineMessage
|
||||
>
|
||||
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table table-bordered table-hover">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td>Bil</td>
|
||||
<td>Karat</td>
|
||||
<td style="min-width: 100px">Harga</td>
|
||||
<th>Bil</th>
|
||||
<th>Karat</th>
|
||||
<th style="min-width: 100px">Harga</th>
|
||||
</tr>
|
||||
<tr v-for="(data, index) in listKarat" v-bind:key="data.id">
|
||||
<td>{{ index + 1 }}</td>
|
||||
@@ -69,7 +71,7 @@ export default {
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
// console.log("getKarat", response);
|
||||
if (response.data.success == true) {
|
||||
this.updatedTime = response.data.update_time;
|
||||
this.listKarat = response.data.karat;
|
||||
@@ -79,7 +81,6 @@ export default {
|
||||
this.isLoading = false;
|
||||
this.responseData = false;
|
||||
}
|
||||
//
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<Card>
|
||||
<Card style="margin-bottom: 1em">
|
||||
<template #title
|
||||
><div
|
||||
class="
|
||||
flex
|
||||
justify-content-between
|
||||
justify-content-center
|
||||
flex-wrap
|
||||
card-container
|
||||
purple-container
|
||||
|
||||
@@ -14,14 +14,14 @@
|
||||
>
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td>Bil</td>
|
||||
<td style="min-width: 200px">Cawangan</td>
|
||||
<td style="min-width: 120px">Tarikh</td>
|
||||
<th>Bil</th>
|
||||
<th style="min-width: 200px">Cawangan</th>
|
||||
<th style="min-width: 120px" class="text-center">Tarikh</th>
|
||||
</tr>
|
||||
<tr v-for="(data, index) in response" :key="data.id">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ data.caw_name }}</td>
|
||||
<td>{{ data.tarikh_lelong }}</td>
|
||||
<td class="text-center">{{ data.tarikh_lelong }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -65,11 +65,10 @@ export default {
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
// console.log("liveData", response);
|
||||
if (response.data.success == true) {
|
||||
this.responseData = true;
|
||||
this.response = response.data.lelong;
|
||||
// console.log(response.data);
|
||||
this.isLoading = false;
|
||||
} else {
|
||||
this.isLoading = false;
|
||||
|
||||
@@ -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>{{ date }}</span></div>
|
||||
<Button
|
||||
class="button-standard p-button-rounded p-button-outlined"
|
||||
@@ -43,7 +43,7 @@ export default {
|
||||
var mm = String(today.getMonth() + 1).padStart(2, "0"); //January is 0!
|
||||
var yyyy = today.getFullYear();
|
||||
|
||||
today = yyyy + "-" + mm + "-" + dd;
|
||||
today = dd + "-" + mm + "-" + yyyy;
|
||||
this.date = today;
|
||||
},
|
||||
},
|
||||
|
||||
@@ -12,16 +12,16 @@
|
||||
<table class="table table-sm table-bordered table-hover">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td>Bil</td>
|
||||
<td style="min-width: 200px">Cawangan</td>
|
||||
<td style="min-width: 120px">Masa Mula</td>
|
||||
<td style="min-width: 120px">Masa Tamat</td>
|
||||
<th>Bil</th>
|
||||
<th style="min-width: 200px">Cawangan</th>
|
||||
<th style="min-width: 120px" class="text-center">Masa Mula</th>
|
||||
<th style="min-width: 120px" class="text-center">Masa Tamat</th>
|
||||
</tr>
|
||||
<tr v-for="(item, index) in response" :key="item.id">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ item.caw_name }}</td>
|
||||
<td>{{ item.masamula_lelong }}</td>
|
||||
<td>{{ item.masatamat_lelong }}</td>
|
||||
<td class="text-center">{{ item.masamula_lelong }}</td>
|
||||
<td class="text-center">{{ item.masatamat_lelong }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -70,6 +70,7 @@ export default {
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
console.log("liveData", response);
|
||||
if (response.data.success == true) {
|
||||
this.responseData = true;
|
||||
this.response = response.data.lelong;
|
||||
@@ -80,7 +81,6 @@ export default {
|
||||
this.isLoading = false;
|
||||
} else {
|
||||
this.isLoading = false;
|
||||
console.log(response.data.success);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
|
||||
@@ -2,10 +2,12 @@
|
||||
<div v-if="isSuccess">
|
||||
<div v-if="notPay">
|
||||
<Message severity="success" :closable="false">
|
||||
<div class="font-bold">Tahniah, bidaan anda menang!
|
||||
<div class="font-bold">
|
||||
Tahniah, bidaan anda menang!
|
||||
<a class="ml-1 text-blue" @click="toResult()" href="#">
|
||||
<span class="underline">Selesaikan pembayaran sekarang.</span>
|
||||
</a></div>
|
||||
</a>
|
||||
</div>
|
||||
</Message>
|
||||
</div>
|
||||
</div>
|
||||
@@ -43,7 +45,7 @@ export default {
|
||||
|
||||
.then((response) => {
|
||||
this.loading = false;
|
||||
console.log(response);
|
||||
// console.log("getLelong", response);
|
||||
if (response.data.success === true) {
|
||||
this.isSuccess = true;
|
||||
if (response.data.lelong[0].status == null) {
|
||||
|
||||
@@ -1,14 +1,12 @@
|
||||
<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 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>
|
||||
|
||||
@@ -51,11 +51,11 @@
|
||||
</footer> -->
|
||||
<div class="layout-footer">
|
||||
<div class="layout-footer-left">
|
||||
<span>Sistem 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>
|
||||
</template>
|
||||
@@ -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;
|
||||
|
||||
@@ -3,24 +3,23 @@
|
||||
<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
|
||||
"
|
||||
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>
|
||||
<!-- <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"
|
||||
class="mr-2"
|
||||
/>
|
||||
<!-- <div class="logo-title">E-Rahn Lelong</div> -->
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
<nav class="main-nav">
|
||||
<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
|
||||
>
|
||||
@@ -39,7 +38,7 @@
|
||||
<router-link class="nav-button" v-bind:to="{ name: 'login' }"
|
||||
>Login</router-link
|
||||
>
|
||||
</nav>
|
||||
</nav> -->
|
||||
</div>
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
<div class="profile-title hidden lg:flex">
|
||||
@@ -81,21 +80,19 @@
|
||||
<!-- 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
|
||||
"
|
||||
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>
|
||||
<Button
|
||||
icon="pi pi-th-large"
|
||||
@click="visibleLeft = true"
|
||||
class="mr-2"
|
||||
/>
|
||||
|
||||
<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">
|
||||
@@ -111,7 +108,7 @@
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<Sidebar v-model:visible="visibleRight" position="right">
|
||||
<!-- <Sidebar v-model:visible="visibleRight" position="right">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="text-center">
|
||||
@@ -176,16 +173,89 @@
|
||||
>
|
||||
</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"),
|
||||
visibleRight: false,
|
||||
visibleLeft: false,
|
||||
lelongOnline: "",
|
||||
};
|
||||
},
|
||||
@@ -244,6 +314,24 @@ export default {
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
// 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>
|
||||
@@ -281,7 +369,7 @@ router-link:hover {
|
||||
} */
|
||||
|
||||
.main-color {
|
||||
background-color: #1e417b;
|
||||
background-color: #008f96;
|
||||
}
|
||||
|
||||
.border-none {
|
||||
@@ -292,8 +380,7 @@ router-link:hover {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background-color: #1e417b;
|
||||
|
||||
background-color: #eeeeee;
|
||||
height: 3.2rem;
|
||||
padding: 0 6.4rem;
|
||||
}
|
||||
@@ -307,15 +394,19 @@ router-link:hover {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #eaf0f9;
|
||||
font-size: 1rem;
|
||||
font-weight: 700;
|
||||
color: #212223;
|
||||
font-size: 3rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.logo-img {
|
||||
height: 1.6rem;
|
||||
}
|
||||
|
||||
/* .main-nav {
|
||||
background-color: #cb3d3d;
|
||||
} */
|
||||
|
||||
.main-nav-list {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
@@ -331,39 +422,43 @@ router-link:hover {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 2.4rem;
|
||||
color: #82a4dc;
|
||||
color: #2c2d2e;
|
||||
font-weight: 500;
|
||||
font-size: 1rem;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
.main-nav-link:hover {
|
||||
color: #fff;
|
||||
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: #82a4dc;
|
||||
}
|
||||
|
||||
.nav-button:hover {
|
||||
color: #eaf0f9;
|
||||
}
|
||||
|
||||
.nav-button:hover {
|
||||
color: #fec234;
|
||||
}
|
||||
|
||||
a.router-link-exact-active {
|
||||
background: #d5e1f3;
|
||||
color: #1e417b;
|
||||
background: #fec234;
|
||||
color: #000000;
|
||||
border-radius: 10px;
|
||||
padding: 7px 20px;
|
||||
}
|
||||
|
||||
a.router-link-exact-active:hover {
|
||||
color: #132a4f;
|
||||
background: #fec234;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.profile-title {
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -1,23 +1,56 @@
|
||||
<template>
|
||||
<Image :src="dataUrl" alt="Gambar Marhun" width="250" preview>
|
||||
<template #indicator> Preview Content </template>
|
||||
<div v-if="isLoading" class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
<Image v-else :src="dataUrl" alt="Gambar Marhun" width="250" preview>
|
||||
<template #indicator> Lihat Gambar </template>
|
||||
</Image>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
|
||||
export default {
|
||||
props: {
|
||||
gambarMain: "",
|
||||
norujukan: "",
|
||||
filemarhun_id: "",
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
image: "",
|
||||
isLoading: false,
|
||||
componentKey: 0
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
dataUrl() {
|
||||
this.image = this.gambarMain.filename;
|
||||
return "data:image/jpeg;base64," + this.image;
|
||||
return "data:image/png;base64, " + this.image;
|
||||
},
|
||||
},
|
||||
mounted: function () {
|
||||
this.getPhotoMarhun();
|
||||
},
|
||||
methods: {
|
||||
getPhotoMarhun() {
|
||||
this.isLoading = true;
|
||||
axios
|
||||
.get("/photoMarhun", {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
params: {
|
||||
norujukan: this.norujukan,
|
||||
filemarhun_id: this.filemarhun_id,
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
this.isLoading = false;
|
||||
this.image = response.data;
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
this.isLoading = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
@@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<div v-if="isLoading" class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
<div v-else style="overflow-x:auto">
|
||||
<Image :src="dataUrl" alt="Gambar Marhun" width="400" preview>
|
||||
<template #indicator> Lihat Gambar </template>
|
||||
</Image>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
|
||||
export default {
|
||||
props: {
|
||||
norujukan: "",
|
||||
filemarhun_id: "",
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
image: "",
|
||||
isLoading: false,
|
||||
componentKey: 0,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
dataUrl() {
|
||||
return "data:image/png;base64, " + this.image;
|
||||
},
|
||||
},
|
||||
mounted: function () {
|
||||
this.getPhotoMarhun();
|
||||
},
|
||||
methods: {
|
||||
getPhotoMarhun() {
|
||||
this.isLoading = true;
|
||||
axios
|
||||
.get("/photoMarhun", {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
params: {
|
||||
norujukan: this.norujukan,
|
||||
filemarhun_id: this.filemarhun_id,
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
this.isLoading = false;
|
||||
this.image = response.data;
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
this.isLoading = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.product-image {
|
||||
min-height: 200px;
|
||||
min-width: 200px;
|
||||
max-height: 350px;
|
||||
max-width: 350px;
|
||||
}
|
||||
</style>
|
||||
@@ -16,46 +16,35 @@
|
||||
|
||||
<div v-else class="fadein animation-duration-400">
|
||||
<div v-if="this.status">
|
||||
<!-- <div class="text-center">
|
||||
<InlineMessage class="m-1" severity="info">
|
||||
Jumlah Surat: {{ numberSag }}
|
||||
</InlineMessage>
|
||||
<InlineMessage class="m-1" severity="info">
|
||||
Masa Mula Lelong: {{ lelong_details.masamula_lelong }}
|
||||
</InlineMessage>
|
||||
<InlineMessage class="m-1" severity="info">
|
||||
Masa Tamat Lelong: {{ lelong_details.masatamat_lelong }}
|
||||
</InlineMessage>
|
||||
</div> -->
|
||||
<div class="text-center">
|
||||
<Message severity="info" :closable="false"
|
||||
>Jumlah Surat Lelongan: {{ numberSag }}
|
||||
</Message>
|
||||
</div>
|
||||
<div class="row justify-content-center">
|
||||
<div
|
||||
v-for="sag in sags"
|
||||
:key="sag.id"
|
||||
class="col-10 sm:col-8 md:col-6 lg:col-4"
|
||||
>
|
||||
<Card>
|
||||
<Card class="style-card">
|
||||
<template #content>
|
||||
<div class="overflow-x-auto">
|
||||
<div class="flex justify-content-center">
|
||||
<div
|
||||
class="flex align-items-center"
|
||||
style="
|
||||
border: 1px solid rgba(0, 0, 0, 0.125);
|
||||
height: 250px;
|
||||
width: 250px;
|
||||
min-height: 250px;
|
||||
min-width: 250px;
|
||||
"
|
||||
>
|
||||
<div class="style-photo-div">
|
||||
<!-- <div
|
||||
class=""
|
||||
style="min-height: 180px; min-width: 255px"
|
||||
> -->
|
||||
<!-- <img :src="dataUrl" class="product-image" /> -->
|
||||
<item-master-image
|
||||
v-if="sag.filemarhun"
|
||||
v-bind:gambarMain="sag.filemarhun[0]"
|
||||
v-bind:norujukan="sag.norujukan"
|
||||
v-bind:filemarhun_id="sag.filemarhun[0].id"
|
||||
></item-master-image>
|
||||
<p v-else style="text-align: center; width: 100%">
|
||||
Image Unavailable
|
||||
</p>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
<div class="">
|
||||
<div class="product_details">
|
||||
@@ -92,23 +81,39 @@
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="row">
|
||||
<Message severity="info" :closable="false"
|
||||
>Sila isi ruangan pilih cawangan di atas.
|
||||
</Message>
|
||||
<div
|
||||
class="
|
||||
flex
|
||||
align-items-center
|
||||
justify-content-center
|
||||
container-height
|
||||
"
|
||||
>
|
||||
<div class="grid justify-content-center">
|
||||
<div class="col-12 mb-4 text-center">
|
||||
<i class="pi pi-arrow-up text-8xl text-400"></i>
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
<span class="text-400"
|
||||
>Sila isi ruangan pilih cawangan di atas.</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid justify-content-center" style="visibility:hidden">
|
||||
<div class="col-12 p-3 lg:col-4">
|
||||
<div class="card p-2">
|
||||
<div class="field">
|
||||
<div class="custom-skeleton">
|
||||
<div class="flex mb-3"></div>
|
||||
<Skeleton width="100%" height="150px"></Skeleton>
|
||||
<div class="flex justify-content-center mt-3">
|
||||
<Skeleton width="100%" height="1px"></Skeleton>
|
||||
<div class="flex justify-content-center">
|
||||
<Skeleton width="10rem"></Skeleton>
|
||||
</div>
|
||||
<div class="flex justify-content-center mt-1">
|
||||
<div class="flex justify-content-center">
|
||||
<Skeleton width="10rem"></Skeleton>
|
||||
</div>
|
||||
<div class="flex justify-content-between mt-3">
|
||||
<div class="flex justify-content-between">
|
||||
<Skeleton width="4rem" height="2rem"></Skeleton>
|
||||
<Skeleton width="4rem" height="2rem"></Skeleton>
|
||||
</div>
|
||||
@@ -121,14 +126,14 @@
|
||||
<div class="field">
|
||||
<div class="custom-skeleton">
|
||||
<div class="flex mb-3"></div>
|
||||
<Skeleton width="100%" height="150px"></Skeleton>
|
||||
<div class="flex justify-content-center mt-3">
|
||||
<Skeleton width="100%" height="1px"></Skeleton>
|
||||
<div class="flex justify-content-center">
|
||||
<Skeleton width="10rem"></Skeleton>
|
||||
</div>
|
||||
<div class="flex justify-content-center mt-1">
|
||||
<div class="flex justify-content-center">
|
||||
<Skeleton width="10rem"></Skeleton>
|
||||
</div>
|
||||
<div class="flex justify-content-between mt-3">
|
||||
<div class="flex justify-content-between">
|
||||
<Skeleton width="4rem" height="2rem"></Skeleton>
|
||||
<Skeleton width="4rem" height="2rem"></Skeleton>
|
||||
</div>
|
||||
@@ -141,14 +146,14 @@
|
||||
<div class="field">
|
||||
<div class="custom-skeleton">
|
||||
<div class="flex mb-3"></div>
|
||||
<Skeleton width="100%" height="150px"></Skeleton>
|
||||
<div class="flex justify-content-center mt-3">
|
||||
<Skeleton width="100%" height="1px"></Skeleton>
|
||||
<div class="flex justify-content-center">
|
||||
<Skeleton width="10rem"></Skeleton>
|
||||
</div>
|
||||
<div class="flex justify-content-center mt-1">
|
||||
<div class="flex justify-content-center">
|
||||
<Skeleton width="10rem"></Skeleton>
|
||||
</div>
|
||||
<div class="flex justify-content-between mt-3">
|
||||
<div class="flex justify-content-between">
|
||||
<Skeleton width="4rem" height="2rem"></Skeleton>
|
||||
<Skeleton width="4rem" height="2rem"></Skeleton>
|
||||
</div>
|
||||
@@ -161,6 +166,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ScrollTop :threshold="200"/>
|
||||
<!-- modal marhun -->
|
||||
<div
|
||||
class="modal fade"
|
||||
@@ -188,12 +194,18 @@
|
||||
|
||||
<div class="modal-body">
|
||||
<div class="grid">
|
||||
<div class="col-12 lg:col-6" style="">
|
||||
<item-multiple-image
|
||||
<div class="col-12 lg:col-6 style-photo-div p-2">
|
||||
<!-- <item-multiple-image
|
||||
v-if="filemarhun"
|
||||
v-bind:gambarMultiple="filemarhun"
|
||||
v-bind:key="reloadImageComponent"
|
||||
></item-multiple-image>
|
||||
></item-multiple-image> -->
|
||||
<item-master-image-modal
|
||||
v-if="filemarhun"
|
||||
v-bind:key="reloadImageComponent"
|
||||
v-bind:norujukan="norujukan.norujukan"
|
||||
v-bind:filemarhun_id="norujukan.filemarhun[0].id"
|
||||
></item-master-image-modal>
|
||||
<p
|
||||
v-else
|
||||
style="
|
||||
@@ -201,7 +213,6 @@
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border: 1px solid rgba(0, 0, 0, 0.125);
|
||||
min-width: 300px;
|
||||
max-width: 300px;
|
||||
"
|
||||
@@ -214,11 +225,11 @@
|
||||
<table class="table table-bordered">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td>Bil</td>
|
||||
<td style="min-width: 115px">Jenis Marhun</td>
|
||||
<td style="min-width: 42px">Karat</td>
|
||||
<td style="min-width: 42px">Berat</td>
|
||||
<td style="min-width: 102px">Harga Asas</td>
|
||||
<th>Bil</th>
|
||||
<th style="min-width: 115px">Jenis Marhun</th>
|
||||
<th style="min-width: 42px">Karat</th>
|
||||
<th style="min-width: 42px">Berat</th>
|
||||
<th style="min-width: 102px">Harga Asas</th>
|
||||
</tr>
|
||||
<tr v-for="(marhun, index) in marhuns" :key="marhun.id">
|
||||
<td>{{ index + 1 }}</td>
|
||||
@@ -477,11 +488,13 @@ import { mapGetters, mapActions } from "vuex";
|
||||
import { read } from "@popperjs/core";
|
||||
import ItemMasterImage from "./ItemMasterImage.vue";
|
||||
import ItemMultipleImage from "./ItemMultipleImage.vue";
|
||||
import ItemMasterImageModal from "./ItemMasterImageModal.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
"item-master-image": ItemMasterImage,
|
||||
"item-multiple-image": ItemMultipleImage,
|
||||
"item-master-image-modal": ItemMasterImageModal,
|
||||
},
|
||||
emits: ["reloadComponent"],
|
||||
props: {
|
||||
@@ -551,7 +564,7 @@ export default {
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
// console.log("liveData", response);
|
||||
if (response.data.success == true) {
|
||||
// let readImage = response.data.message.lelongbid[7].filemarhun[0].filename;
|
||||
// this.image = readImage;
|
||||
@@ -666,4 +679,16 @@ export default {
|
||||
.disabled-bg {
|
||||
background-color: rgb(233, 236, 239);
|
||||
}
|
||||
|
||||
.style-photo-div {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
min-height: 180px;
|
||||
min-width: 255px;
|
||||
}
|
||||
|
||||
.container-height {
|
||||
min-height: 70vh;
|
||||
}
|
||||
</style>
|
||||
@@ -35,14 +35,6 @@
|
||||
<input type="hidden" />
|
||||
</select>
|
||||
</div>
|
||||
<!-- <h6>
|
||||
<button
|
||||
class="badge m-2 btn-secondary"
|
||||
@click="toggleReloadComponent"
|
||||
>
|
||||
Reload <i class="bi bi-arrow-down"></i>
|
||||
</button>
|
||||
</h6> -->
|
||||
<list-item
|
||||
v-bind:key="componentKey"
|
||||
v-bind:selectedCawangan="selectCawangan"
|
||||
@@ -70,7 +62,7 @@
|
||||
<span class="text-400"
|
||||
>Sila rujuk halaman
|
||||
<router-link v-bind:to="{ name: 'home' }">Utama</router-link>
|
||||
untuk jadual lelong.</span
|
||||
untuk jadual lelongan.</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@@ -119,7 +111,7 @@ export default {
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
// console.log('getIdCawangan', response);
|
||||
if (response.data.success == true) {
|
||||
this.isSuccess = true;
|
||||
this.listCawangan = response.data.lelong;
|
||||
|
||||
@@ -81,18 +81,32 @@
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table text-center table-bordered">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td style="min-width: 240px">Cawangan</td>
|
||||
<td style="min-width: 120px">Harga Bida</td>
|
||||
<tr>
|
||||
<td>Cawangan</td>
|
||||
<td>{{ cawanganPilihan }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>{{ cawanganPilihan }}</th>
|
||||
<th>
|
||||
<td>Harga Bida</td>
|
||||
<td style="min-width: 150px">
|
||||
RM{{
|
||||
hargaBidaanPilihan
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Fi Pengurusan</td>
|
||||
<td>RM1.00</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Jumlah Keseluruhan</th>
|
||||
<th>
|
||||
RM{{
|
||||
hargaBidaanPilihanTambahFi
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</th>
|
||||
</tr>
|
||||
</tbody>
|
||||
@@ -106,66 +120,67 @@
|
||||
@click="closeModal()"
|
||||
class="p-button-text"
|
||||
/>
|
||||
<Button
|
||||
<!-- <Button
|
||||
label="Ya"
|
||||
icon="pi pi-check"
|
||||
iconPos="right"
|
||||
:loading="isLoading"
|
||||
@click="doPayment()"
|
||||
/> -->
|
||||
<Button
|
||||
label="Teruskan"
|
||||
icon="pi pi-check"
|
||||
iconPos="right"
|
||||
@click="openModalTNC()"
|
||||
/>
|
||||
</template>
|
||||
</Dialog>
|
||||
<Dialog
|
||||
header="Terma & Syarat"
|
||||
v-model:visible="isDisplayTNC"
|
||||
:breakpoints="{ '960px': '75vw', '640px': '90vw' }"
|
||||
:style="{ width: '50vw' }"
|
||||
:modal="true"
|
||||
>
|
||||
<div>
|
||||
<terms-and-conditions-details></terms-and-conditions-details>
|
||||
</div>
|
||||
<template #footer>
|
||||
<Button
|
||||
label="Batal Pembayaran"
|
||||
icon="pi pi-times"
|
||||
iconPos="right"
|
||||
@click="closeModalTNC()"
|
||||
class="p-button-text"
|
||||
/>
|
||||
<!-- <Button
|
||||
label="Ya"
|
||||
icon="pi pi-check"
|
||||
iconPos="right"
|
||||
:loading="isLoading"
|
||||
@click="doPayment()"
|
||||
/> -->
|
||||
<Button
|
||||
label="Teruskan Bayaran"
|
||||
icon="pi pi-check"
|
||||
iconPos="right"
|
||||
:loading="isLoading"
|
||||
@click="doPayment()"
|
||||
/>
|
||||
</template>
|
||||
</Dialog>
|
||||
<!-- <div class="container">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-7">
|
||||
<div v-if="!nextButton">
|
||||
<h5>Pilih Cawangan</h5>
|
||||
<table class="table table-bordered">
|
||||
<tbody>
|
||||
<tr v-for="data in namaCawangan" v-bind:key="data">
|
||||
<td>
|
||||
<input
|
||||
type="radio"
|
||||
v-bind:value="data"
|
||||
v-model="selectRadio"
|
||||
/>
|
||||
</td>
|
||||
<td>{{ data.cawangan }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="d-flex justify-content-between">
|
||||
<button class="btn btn-danger" v-on:click="clickCancelButton()">
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
ref="nextButton"
|
||||
v-on:click="clickNextButton()"
|
||||
class="btn btn-primary"
|
||||
>
|
||||
Teruskan
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<select-id
|
||||
v-bind:selectedRadio="selectRadio"
|
||||
v-on:back-is-click="backIsClick"
|
||||
></select-id>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { integer } from "@vuelidate/validators";
|
||||
import SelectId from "./SelectId.vue";
|
||||
import TermsAndConditionsDetails from "../authentication/TermsAndConditionsDetails.vue";
|
||||
import axios from "axios";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
"select-id": SelectId,
|
||||
"terms-and-conditions-details": TermsAndConditionsDetails,
|
||||
},
|
||||
props: {
|
||||
namaCawangan: "",
|
||||
@@ -179,9 +194,12 @@ export default {
|
||||
selectCawangan: this.namaCawangan,
|
||||
selectRadio: "",
|
||||
isDisplay: false,
|
||||
isDisplayTNC: false,
|
||||
isLoading: false,
|
||||
cawanganPilihan: "",
|
||||
hargaBidaanPilihan: "",
|
||||
hargaBidaanPilihanTambahFi: "",
|
||||
lelongDetails: "",
|
||||
form: {
|
||||
email: localStorage.getItem("email"),
|
||||
notel: localStorage.getItem("notelbimbit"),
|
||||
@@ -223,11 +241,12 @@ export default {
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
// console.log("getInvoice", response);
|
||||
if (response.data.success == true) {
|
||||
this.form.invoice_id = response.data.invoice.id;
|
||||
this.form.invoice_no = response.data.invoice.invoice_no;
|
||||
this.form.lelong_id = this.lelongIdProps;
|
||||
this.lelongDetails = response.data.lelong;
|
||||
} else if (response.data.success == false) {
|
||||
alert("No Invoice Id");
|
||||
}
|
||||
@@ -238,21 +257,50 @@ export default {
|
||||
});
|
||||
},
|
||||
openModal(value) {
|
||||
var date = new Date();
|
||||
var current_time = date.toLocaleString();
|
||||
var limit_masa_bayaran = "15:00:00";
|
||||
var limit_datetime_bayaran = this.lelongDetails.tarikh_lelong + ", " + limit_masa_bayaran;
|
||||
console.log(current_time, '\n', limit_datetime_bayaran);
|
||||
|
||||
// if (current_time < limit_datetime_bayaran === true) {
|
||||
this.isDisplay = true;
|
||||
this.cawanganPilihan = value.cawangan;
|
||||
this.hargaBidaanPilihan = value.total_hargabida;
|
||||
let convertHargaBidaanPilihan =
|
||||
parseFloat(value.total_hargabida.replace(/,/g, "")) + 1;
|
||||
this.hargaBidaanPilihanTambahFi = convertHargaBidaanPilihan.toFixed(2);
|
||||
this.form.total = parseFloat(value.total_hargabida.replace(/,/g, ""));
|
||||
let convertData = JSON.parse(JSON.stringify(value.sag));
|
||||
this.form.sag = convertData;
|
||||
console.log(this.form);
|
||||
// } else {
|
||||
// this.$swal.fire({
|
||||
// icon: "error",
|
||||
// title: "Gagal",
|
||||
// text: "Pembayaran mesti diselesaikan sebelum 3:00pm.",
|
||||
// confirmButtonColor: "#344871",
|
||||
// confirmButtonText: "Kembali",
|
||||
// allowOutsideClick: false,
|
||||
// allowEscapeKey: false,
|
||||
// });
|
||||
// }
|
||||
},
|
||||
closeModal() {
|
||||
this.isDisplay = false;
|
||||
this.form.total = "";
|
||||
this.form.sag = "";
|
||||
},
|
||||
openModalTNC() {
|
||||
this.isDisplay = false;
|
||||
this.isDisplayTNC = true;
|
||||
},
|
||||
closeModalTNC() {
|
||||
this.isDisplayTNC = false;
|
||||
this.form.total = "";
|
||||
this.form.sag = "";
|
||||
},
|
||||
clickRadio(value) {
|
||||
console.log(value);
|
||||
// console.log(value);
|
||||
this.selectRadio = value;
|
||||
},
|
||||
clickCancelButton() {
|
||||
|
||||
@@ -120,11 +120,11 @@ export default {
|
||||
}
|
||||
)
|
||||
.then((response) => {
|
||||
// console.log("liveData", response);
|
||||
this.isLoading = false;
|
||||
if (response.data.success == true) {
|
||||
this.isSuccess = true;
|
||||
this.lists = response.data.data;
|
||||
console.log(this.lists);
|
||||
this.tarikhLelong = response.data.tarikh_lelong;
|
||||
} else {
|
||||
}
|
||||
|
||||
@@ -0,0 +1,40 @@
|
||||
<template>
|
||||
<the-template>
|
||||
<div class="col-12 lg:col-11 fadein animation-duration-400">
|
||||
<Card>
|
||||
<template #title>
|
||||
<div class="font-normal">Polisi</div>
|
||||
</template>
|
||||
<template #content>
|
||||
<TabView>
|
||||
<TabPanel :header="'Terma & Syarat'">
|
||||
<terms-and-conditions-details></terms-and-conditions-details>
|
||||
</TabPanel>
|
||||
<TabPanel :header="'Hubungi Kami'">
|
||||
<div class="grid justify-content-center" style="height: 50vh">
|
||||
<div class="col-12 mb-4 text-center" style="align-self:end">
|
||||
<i class="pi pi-wrench text-8xl text-400"></i>
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
<span class="text-400">Sedang Dikemaskini.</span>
|
||||
</div>
|
||||
</div>
|
||||
</TabPanel>
|
||||
</TabView>
|
||||
</template>
|
||||
</Card>
|
||||
</div>
|
||||
<ScrollTop :threshold="200"/>
|
||||
|
||||
</the-template>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TermsAndConditionsDetails from "../authentication/TermsAndConditionsDetails.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
"terms-and-conditions-details": TermsAndConditionsDetails,
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -59,6 +59,18 @@
|
||||
<div class="col-12 lg:col-6 text-start value-form">
|
||||
{{ data.notelbimbit }}
|
||||
</div>
|
||||
<div class="col-12 lg:col-5 text-start text-400">
|
||||
Emel
|
||||
</div>
|
||||
<div class="col-12 lg:col-6 text-start value-form">
|
||||
{{ data.email }}
|
||||
</div>
|
||||
<div class="col-12 lg:col-5 text-start text-400">
|
||||
Alamat
|
||||
</div>
|
||||
<div class="col-12 lg:col-6 text-start value-form">
|
||||
{{ data.alamat }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<the-template>
|
||||
<!-- <base-card> -->
|
||||
<div
|
||||
v-if="loading"
|
||||
style="min-height: 70vh; display: grid; place-items: center"
|
||||
@@ -28,17 +27,17 @@
|
||||
class="font-normal"
|
||||
style="font-size: 1.5rem; font-weight: 700"
|
||||
>
|
||||
Keputusan Tarikh Lelong: {{ tarikhLelong }}
|
||||
Keputusan Tarikh Lelongan: {{ tarikhLelong }}
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template #end>
|
||||
<Button
|
||||
<!-- <Button
|
||||
label="Resit Bayaran"
|
||||
icon="pi pi-list"
|
||||
iconPos="right"
|
||||
class="p-button-sm p-button-outlined mr-2"
|
||||
/>
|
||||
/> -->
|
||||
<Button
|
||||
label="Pembayaran"
|
||||
icon="pi pi-money-bill"
|
||||
@@ -56,9 +55,28 @@
|
||||
<Accordion :multiple="true">
|
||||
<AccordionTab v-for="list in lists" v-bind:key="list">
|
||||
<template #header>
|
||||
<span>{{ list.cawangan }}</span>
|
||||
<!-- <span class="ml-2">Jumlah:RMXXXX</span> -->
|
||||
<div class="flex justify-content-between w-100">
|
||||
<div class="align-self-center" style="margin: 5px">
|
||||
{{ list.cawangan }}
|
||||
</div>
|
||||
<div class="style-info">
|
||||
Jumlah RM{{
|
||||
list.total_hargabida
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<Button
|
||||
label="Surat Hak Kepemilikan Barang"
|
||||
icon="pi pi-verified"
|
||||
iconPos="right"
|
||||
class="p-button-sm mb-3"
|
||||
v-on:click="downloadPdf(list.kodcaw)"
|
||||
v-if="list.status_payment_cawangan == 1"
|
||||
v-tooltip="'Muat Turun'"
|
||||
/>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table text-center table-bordered">
|
||||
<tbody>
|
||||
@@ -118,124 +136,22 @@
|
||||
></Tag>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="text-transform: uppercase">
|
||||
<td colspan="2">Jumlah</td>
|
||||
<td>
|
||||
RM{{
|
||||
list.total_hargabida
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</td>
|
||||
<td class="table-light"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</AccordionTab>
|
||||
</Accordion>
|
||||
<!-- <div class="">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="d-flex justify-content-between">
|
||||
<router-link
|
||||
v-bind:to="{ name: 'result' }"
|
||||
class="btn btn-secondary m-3 ms-0"
|
||||
>Kembali</router-link
|
||||
>
|
||||
<h5 class="m-3">
|
||||
Keputusan Tarikh Lelong: {{ tarikhLelong }}
|
||||
</h5>
|
||||
<button
|
||||
v-if="!statusPayment"
|
||||
v-on:click="clickPayButton(lelongId)"
|
||||
class="btn btn-primary m-3 me-0"
|
||||
>
|
||||
Bayar
|
||||
</button>
|
||||
</div>
|
||||
<div class="d-flex justify-content-end">
|
||||
<router-link
|
||||
v-bind:to="{ name: 'receipt' }"
|
||||
class="btn btn-outline-primary m-2 me-0"
|
||||
>Resit Bayaran</router-link
|
||||
>
|
||||
</div>
|
||||
<div>
|
||||
<div class="accordion" id="accordionExample">
|
||||
<div
|
||||
v-for="list in lists"
|
||||
v-bind:key="list"
|
||||
class="accordion-item"
|
||||
>
|
||||
<h2 class="accordion-header" id="headingOne">
|
||||
<button
|
||||
class="accordion-button"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#collapseOne"
|
||||
aria-expanded="true"
|
||||
aria-controls="collapseOne"
|
||||
>
|
||||
{{ list.cawangan }}
|
||||
</button>
|
||||
</h2>
|
||||
<div
|
||||
id="collapseOne"
|
||||
class="accordion-collapse collapse show"
|
||||
aria-labelledby="headingOne"
|
||||
data-bs-parent="#accordionExample"
|
||||
>
|
||||
<div class="accordion-body">
|
||||
<table class="table table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Bil</th>
|
||||
<th scope="col">No Rujukan</th>
|
||||
<th scope="col">Harga Bidaan</th>
|
||||
<th scope="col">Status Bayaran</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr
|
||||
v-for="(data, index) in list.sag"
|
||||
v-bind:key="data"
|
||||
>
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>
|
||||
<a
|
||||
href="#"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#marhunModal"
|
||||
v-on:click="marhunModal(data)"
|
||||
>{{ data.norujukan }}
|
||||
</a>
|
||||
</td>
|
||||
<td>RM {{ data.total_payment }}</td>
|
||||
<td
|
||||
class="m-1 badge rounded-pill bg-danger"
|
||||
v-if="
|
||||
data.status_payment === null ||
|
||||
data.status_payment == 0
|
||||
"
|
||||
>
|
||||
Belum Bayar
|
||||
</td>
|
||||
<td
|
||||
class="m-1 badge rounded-pill bg-warning"
|
||||
v-if="data.status_payment === 2"
|
||||
>
|
||||
Tunggu Pengesahan
|
||||
</td>
|
||||
<td
|
||||
class="m-1 badge rounded-pill bg-success"
|
||||
v-if="data.status_payment === 1"
|
||||
>
|
||||
Selesai
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h5 class="mt-4 mb-5">
|
||||
Jumlah Harga Bida: RM{{ list.total_hargabida }}
|
||||
</h5>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</template>
|
||||
</Card>
|
||||
<div
|
||||
@@ -246,12 +162,9 @@
|
||||
aria-hidden="true"
|
||||
data-bs-backdrop="static"
|
||||
>
|
||||
<div class="modal-dialog modal-lg modal-dialog-centered">
|
||||
<div class="modal-dialog modal-xl modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<!-- <h5 class="modal-title" id="marhunModalLabel">
|
||||
{{ theData.norujukan }}
|
||||
</h5> -->
|
||||
<button
|
||||
type="button"
|
||||
class="btn-close"
|
||||
@@ -260,36 +173,93 @@
|
||||
></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="grid">
|
||||
<div
|
||||
class="col-12 lg:col-6"
|
||||
style="
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
min-height: 300px;
|
||||
min-width: 300px;
|
||||
max-height: 600px;
|
||||
max-width: 600px;
|
||||
"
|
||||
>
|
||||
<item-master-image-modal
|
||||
v-if="theData.filemarhun"
|
||||
v-bind:key="reloadImageComponent"
|
||||
v-bind:norujukan="theData.norujukan"
|
||||
v-bind:filemarhun_id="theData.filemarhun[0].id"
|
||||
></item-master-image-modal>
|
||||
<p v-else style="text-align: center; width: 100%">
|
||||
Image Unavailable
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-12 text-center lg:col-6">
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Bil</th>
|
||||
<th scope="col">Jenis</th>
|
||||
<th scope="col">Karat</th>
|
||||
<th scope="col">Berat</th>
|
||||
<th scope="col">Nota</th>
|
||||
<th scope="col">Harga Asas</th>
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td>Bil</td>
|
||||
<td style="min-width: 115px">Jenis Marhun</td>
|
||||
<td style="min-width: 42px">Karat</td>
|
||||
<td style="min-width: 42px">Berat</td>
|
||||
<td style="min-width: 102px">Harga Asas</td>
|
||||
</tr>
|
||||
</thead>
|
||||
<!-- <tbody>
|
||||
<tr
|
||||
v-for="(marhun, index) in theData.lelongbidmarhun"
|
||||
v-bind:key="marhun"
|
||||
v-for="(data, index) in theData.lelongbidmarhun"
|
||||
v-bind:key="data"
|
||||
>
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ marhun.marhun }}</td>
|
||||
<td>{{ marhun.karat }}</td>
|
||||
<td>{{ marhun.berat }}g</td>
|
||||
<td>{{ marhun.nota }}</td>
|
||||
<td>RM{{ marhun.hargaasas }}</td>
|
||||
<td>{{ data.marhun }}</td>
|
||||
<td>{{ data.karat }}</td>
|
||||
<td>{{ data.berat }}g</td>
|
||||
<td>
|
||||
RM{{
|
||||
data.hargaasas
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="text-transform: uppercase">
|
||||
<th colspan="5">Jumlah</th>
|
||||
<th>RM{{ theData.hargaasas }}</th>
|
||||
<td colspan="3">Jumlah</td>
|
||||
<td>{{ theData.berat }}g</td>
|
||||
<td>
|
||||
RM{{
|
||||
theData.hargaasas
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</td>
|
||||
</tr>
|
||||
</tbody> -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-6">
|
||||
<label class="col-form-label"
|
||||
>Jumlah Harga Bida</label
|
||||
>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="input-group mb-3">
|
||||
<span class="input-group-text">RM</span>
|
||||
<span
|
||||
class="form-control font-bold input-group-text"
|
||||
>{{
|
||||
theData.hargabida
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
type="button"
|
||||
@@ -332,15 +302,65 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Dialog
|
||||
header="Surat Hak Kepemilikan Barang"
|
||||
v-model:visible="isDisplay"
|
||||
:breakpoints="{ '960px': '75vw', '640px': '90vw' }"
|
||||
:style="{ width: '50vw' }"
|
||||
:modal="true"
|
||||
>
|
||||
<div class="text-center">
|
||||
<p id="hakbarang">SURAT KETERANGAN KEPEMILIKAN BARANG</p>
|
||||
<p>
|
||||
Bahawasanya barang tersebut adalah hak milik
|
||||
{{ suratHak.user.name }} ({{ suratHak.user.nokp }})
|
||||
</p>
|
||||
<table class="table text-center table-bordered">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td>Bil</td>
|
||||
<td>No Rujukan</td>
|
||||
<td>Jenis Barang</td>
|
||||
<td>Berat</td>
|
||||
<td>Harga Bidaan</td>
|
||||
</tr>
|
||||
<tr v-for="(data, index) in suratHak.lelongbid" v-bind:key="data">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ data.norujukan }}</td>
|
||||
<td>
|
||||
<div v-for="berat in data.lelongbidmarhun" v-bind:key="berat">
|
||||
<p>{{ berat.marhun_desc }}</p>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div v-for="berat in data.lelongbidmarhun" v-bind:key="berat">
|
||||
<p>{{ berat.berat }}g</p>
|
||||
</div>
|
||||
</td>
|
||||
<td>RM{{ data.hargabida }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<template #footer>
|
||||
<Button label="Muat Turun" @click="muatTurunPdf()" />
|
||||
</template>
|
||||
</Dialog>
|
||||
</div>
|
||||
<!-- </base-card> -->
|
||||
</the-template>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import jsPDF from "jspdf";
|
||||
// import "jspdf-autotable";
|
||||
// import html2canvas from "html2canvas";
|
||||
import axios from "axios";
|
||||
import ItemMasterImageModal from "../list/ItemMasterImageModal.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
"item-master-image-modal": ItemMasterImageModal,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
lists: [],
|
||||
@@ -350,10 +370,14 @@ export default {
|
||||
statusPayment: "",
|
||||
disabled: 0,
|
||||
isSuccess: false,
|
||||
theData: "",
|
||||
reloadImageComponent: "",
|
||||
isDisplay: false,
|
||||
suratHak: "",
|
||||
isSuccessHak: false,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
console.log(this.$route.params.lelongId);
|
||||
this.lelongId = this.$route.params.lelongId;
|
||||
this.statusPayment = this.$route.params.statusPayment;
|
||||
},
|
||||
@@ -372,23 +396,16 @@ export default {
|
||||
liveData() {
|
||||
this.loading = true;
|
||||
axios
|
||||
.get(
|
||||
"/bayar/" +
|
||||
localStorage.getItem("id") +
|
||||
// "/1",
|
||||
"/" +
|
||||
this.lelongId,
|
||||
{
|
||||
.get("/bayar/" + localStorage.getItem("id") + "/" + this.lelongId, {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
}
|
||||
)
|
||||
})
|
||||
.then((response) => {
|
||||
// console.log("liveData", response);
|
||||
if (response.data.success == true) {
|
||||
this.isSuccess = true;
|
||||
this.loading = false;
|
||||
console.log(response);
|
||||
this.lists = response.data.data;
|
||||
this.tarikhLelong = response.data.tarikh_lelong;
|
||||
} else {
|
||||
@@ -407,7 +424,52 @@ export default {
|
||||
this.$router.push({ name: "result" });
|
||||
},
|
||||
marhunModal(value) {
|
||||
console.log(value);
|
||||
this.theData = value;
|
||||
this.reloadImageComponent += 1;
|
||||
},
|
||||
downloadPdf(value) {
|
||||
axios
|
||||
.get("/resultInCawangan", {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
params: {
|
||||
lelong_id: this.lelongId,
|
||||
user_id: localStorage.getItem("id"),
|
||||
kodcaw: value,
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
this.suratHak = response.data;
|
||||
this.isDisplay = true;
|
||||
this.isSuccessHak = true;
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
muatTurunPdf() {
|
||||
// const doc = new jsPDF();
|
||||
// doc.autoTable({ html: "#hak-barang" });
|
||||
// const html = this.$refs.hakbarang.innerHTML;
|
||||
// doc.fromHTML(html, 15, 15, {
|
||||
// width: 150,
|
||||
// });
|
||||
// var canvas = document.getElementById("hakbarang");
|
||||
// html2canvas(canvas).then(function (canvas) {
|
||||
// var imgdata = canvas.toDataURL("image/png");
|
||||
// var doc = new jsPDF();
|
||||
// doc.addImage(imgdata, "PNG", 500, 500);
|
||||
// doc.save("test.pdf");
|
||||
// });
|
||||
// window.html2canvas = html2canvas;
|
||||
// var doc = new jsPDF("p", "pt", "a4");
|
||||
// doc.html(document.querySelector(#hakbarang), {
|
||||
// callback: function(pdf) {
|
||||
// pdf.save("thehehehe.pdf")
|
||||
// }
|
||||
// })
|
||||
// doc.save("table.pdf");
|
||||
},
|
||||
},
|
||||
};
|
||||
@@ -426,4 +488,18 @@ export default {
|
||||
.container-height {
|
||||
min-height: 70vh;
|
||||
}
|
||||
|
||||
.style-info {
|
||||
background: #e4f8f0;
|
||||
border: solid #1ea97c;
|
||||
border-width: 0px;
|
||||
color: #1ea97c;
|
||||
font-size: 1rem;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
padding: 0.4rem 0.9rem;
|
||||
margin: 0;
|
||||
border-radius: 6px;
|
||||
font-weight: 400;
|
||||
}
|
||||
</style>
|
||||
@@ -26,7 +26,7 @@
|
||||
<td style="min-width: 115px">Tarikh</td>
|
||||
<td style="min-width: 100px">Jumlah</td>
|
||||
<td style="min-width: 145px">Status Bayaran</td>
|
||||
<td style="min-width: 150px">Penyata</td>
|
||||
<!-- <td style="min-width: 150px">Penyata</td> -->
|
||||
</tr>
|
||||
<tr v-for="(data, index) in lelong" v-bind:key="data">
|
||||
<td>{{ index + 1 }}</td>
|
||||
@@ -58,11 +58,11 @@
|
||||
severity="danger"
|
||||
></Tag>
|
||||
</td>
|
||||
<td>
|
||||
<!-- <td>
|
||||
<span class="text-primary underline cursor-pointer"
|
||||
>Muat Turun <i class="pi pi-cloud-download"></i>
|
||||
</span>
|
||||
</td>
|
||||
</td> -->
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -85,7 +85,7 @@
|
||||
<span class="text-400"
|
||||
>Sila rujuk halaman
|
||||
<router-link v-bind:to="{ name: 'home' }">Utama</router-link>
|
||||
untuk jadual lelong</span
|
||||
untuk jadual lelongan.</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@@ -127,7 +127,7 @@ export default {
|
||||
|
||||
.then((response) => {
|
||||
this.loading = false;
|
||||
console.log(response);
|
||||
// console.log("getLelong", response);
|
||||
if (response.data.success === true) {
|
||||
this.isSuccess = true;
|
||||
this.lelong = response.data.lelong;
|
||||
|
||||
@@ -43,6 +43,10 @@ import TabPanel from 'primevue/tabpanel';
|
||||
import Tag from 'primevue/tag';
|
||||
import Image from 'primevue/image';
|
||||
import Galleria from 'primevue/galleria';
|
||||
import BadgeDirective from 'primevue/badgedirective';
|
||||
import Textarea from 'primevue/textarea';
|
||||
import Tooltip from 'primevue/tooltip';
|
||||
import ScrollTop from 'primevue/scrolltop';
|
||||
|
||||
import 'maz-ui/css/main.css'
|
||||
import MazPhoneNumberInput from 'maz-ui/components/MazPhoneNumberInput'
|
||||
@@ -84,6 +88,11 @@ app.component('TabPanel', TabPanel);
|
||||
app.component('Tag', Tag);
|
||||
app.component('Image', Image);
|
||||
app.component('Galleria', Galleria);
|
||||
app.directive('badge', BadgeDirective);
|
||||
app.component('Textarea', Textarea);
|
||||
app.directive('tooltip', Tooltip);
|
||||
app.component('ScrollTop', ScrollTop);
|
||||
|
||||
|
||||
app.component('MazPhoneNumberInput', MazPhoneNumberInput)
|
||||
|
||||
|
||||
+12
-1
@@ -131,6 +131,7 @@ import TheList from "../components/list/TheList.vue";
|
||||
import ResultDetail from "../components/result/ResultDetail.vue";
|
||||
import ResultReceipt from "../components/result/ResultReceipt.vue"
|
||||
import ThePay from "../components/pay/ThePay.vue";
|
||||
import ThePolicy from "../components/policy/ThePolicy.vue"
|
||||
|
||||
import {
|
||||
createRouter,
|
||||
@@ -157,6 +158,11 @@ const routes = [
|
||||
},
|
||||
{
|
||||
path: "/",
|
||||
name: "login",
|
||||
component: TheLogin,
|
||||
},
|
||||
{
|
||||
path: "/home",
|
||||
name: "home",
|
||||
component: TheHome,
|
||||
},
|
||||
@@ -191,7 +197,7 @@ const routes = [
|
||||
// meta: { requiresAuth: true }
|
||||
},
|
||||
{
|
||||
path: "/result/detail",
|
||||
path: "/result-detail",
|
||||
name: "detail",
|
||||
component: ResultDetail,
|
||||
// meta: { requiresAuth: true }
|
||||
@@ -207,6 +213,11 @@ const routes = [
|
||||
name: "pay",
|
||||
component: ThePay,
|
||||
},
|
||||
{
|
||||
path: "/policy",
|
||||
name: "policy",
|
||||
component: ThePolicy,
|
||||
},
|
||||
];
|
||||
|
||||
const router = createRouter({
|
||||
|
||||
Reference in New Issue
Block a user