Merge branch 'finadev' into 'main'
lelong pembida See merge request erahn/lelong-web-pembida!1
This commit is contained in:
Faiqah Zaman
Generated
+934
-887
File diff suppressed because it is too large
Load Diff
+7
-2
@@ -12,17 +12,22 @@
|
|||||||
"@vuelidate/validators": "^2.0.0-alpha.29",
|
"@vuelidate/validators": "^2.0.0-alpha.29",
|
||||||
"autoprefixer": "^10",
|
"autoprefixer": "^10",
|
||||||
"axios": "^0.26.1",
|
"axios": "^0.26.1",
|
||||||
"bootstrap": "^5.1.3",
|
"bootstrap": "^5.2.3",
|
||||||
"bootstrap-icons": "^1.8.1",
|
"bootstrap-icons": "^1.8.1",
|
||||||
|
"bootstrap-vue": "^2.23.1",
|
||||||
"core-js": "^3.8.3",
|
"core-js": "^3.8.3",
|
||||||
|
"html2canvas": "^1.4.1",
|
||||||
|
"jspdf": "^2.5.1",
|
||||||
|
"jspdf-autotable": "^3.5.28",
|
||||||
"libphonenumber-js": "^1.10.14",
|
"libphonenumber-js": "^1.10.14",
|
||||||
"maz-ui": "^3.0.7",
|
"maz-ui": "^3.0.7",
|
||||||
"postcss": "^8",
|
"postcss": "^8",
|
||||||
"primeflex": "^3.2.1",
|
"primeflex": "^3.2.1",
|
||||||
"primeicons": "^6.0.1",
|
"primeicons": "^6.0.1",
|
||||||
"primevue": "^3.17.0",
|
"primevue": "^3.17.0",
|
||||||
"vue": "^3.2.13",
|
"vue": "^3.2.45",
|
||||||
"vue-router": "^4.0.14",
|
"vue-router": "^4.0.14",
|
||||||
|
"vue-sidebar-menu-akahon": "^0.1.4",
|
||||||
"vue-sweetalert2": "^5.0.5",
|
"vue-sweetalert2": "^5.0.5",
|
||||||
"vuex": "^4.0.2"
|
"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 http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||||
<!-- <link rel="icon" href="<%= BASE_URL %>favicon.ico"> -->
|
<!-- <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>
|
<style>
|
||||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap');
|
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap');
|
||||||
</style>
|
</style>
|
||||||
<!-- <title><%= htmlWebpackPlugin.options.title %></title> -->
|
<!-- <title><%= htmlWebpackPlugin.options.title %></title> -->
|
||||||
<title>ArrahnBid</title>
|
<title>E-Rahn Lelong</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
@@ -36,7 +36,8 @@
|
|||||||
--border-radius:6px;
|
--border-radius:6px;
|
||||||
--surface-ground:#eff3f8;
|
--surface-ground:#eff3f8;
|
||||||
--surface-section:#ffffff;
|
--surface-section:#ffffff;
|
||||||
--surface-card:#ffffff;
|
--surface-card:#3f4242ce;
|
||||||
|
--surface-card2:#b9b4b4;
|
||||||
--surface-overlay:#ffffff;
|
--surface-overlay:#ffffff;
|
||||||
--surface-border:#dfe7ef;
|
--surface-border:#dfe7ef;
|
||||||
--surface-hover:#f6f9fc;
|
--surface-hover:#f6f9fc;
|
||||||
@@ -1081,10 +1082,10 @@
|
|||||||
color: #495057;
|
color: #495057;
|
||||||
background: #ffffff;
|
background: #ffffff;
|
||||||
padding: 0.75rem 0.75rem;
|
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;
|
transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s;
|
||||||
appearance: none;
|
appearance: none;
|
||||||
border-radius: 6px;
|
border-radius: 24px;
|
||||||
}
|
}
|
||||||
.p-inputtext:enabled:hover {
|
.p-inputtext:enabled:hover {
|
||||||
border-color: #3B82F6;
|
border-color: #3B82F6;
|
||||||
@@ -1697,12 +1698,12 @@
|
|||||||
|
|
||||||
.p-button {
|
.p-button {
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
background: #2f68c5;
|
background: #008f96;
|
||||||
border: 1px solid #2f68c5;
|
border: 1px solid #008f96;
|
||||||
padding: 0.75rem 1.25rem;
|
padding: 0.75rem 1.25rem;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s;
|
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 {
|
.p-button:enabled:hover {
|
||||||
background: #2563eb;
|
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>
|
<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
|
Terma & Syarat
|
||||||
</a>
|
</a>
|
||||||
<div
|
<div
|
||||||
@@ -13,7 +13,7 @@
|
|||||||
<div class="modal-content">
|
<div class="modal-content">
|
||||||
<div class="modal-header">
|
<div class="modal-header">
|
||||||
<h5 class="modal-title" id="exampleModalLabel">
|
<h5 class="modal-title" id="exampleModalLabel">
|
||||||
Terma & Syarat Sistem Lelong
|
Terma & Syarat
|
||||||
</h5>
|
</h5>
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
@@ -23,85 +23,14 @@
|
|||||||
></button>
|
></button>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
<div class="row">
|
<terms-and-conditions-details></terms-and-conditions-details>
|
||||||
<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>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
<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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -109,7 +38,12 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {};
|
import TermsAndConditionsDetails from './TermsAndConditionsDetails.vue'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
"terms-and-conditions-details": TermsAndConditionsDetails,
|
||||||
|
}
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<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>
|
<template>
|
||||||
<Toast :breakpoints="{ '767px': { width: '100%', right: '0', left: '0' } }" />
|
<Toast :breakpoints="{ '767px': { width: '100%', right: '0', left: '0' } }" />
|
||||||
<div
|
<div
|
||||||
class="
|
class="flex main-container min-h-screen align-items-center justify-content-center"
|
||||||
flex
|
|
||||||
main-container
|
|
||||||
min-h-screen
|
|
||||||
align-items-center
|
|
||||||
justify-content-center
|
|
||||||
"
|
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
class="
|
class="surface-card fadein p-4 shadow-8 border-round w-11 md:w-10 lg:w-8 xl:w-7"
|
||||||
surface-card
|
|
||||||
fadein
|
|
||||||
p-4
|
|
||||||
shadow-2
|
|
||||||
border-round
|
|
||||||
w-11
|
|
||||||
md:w-10
|
|
||||||
lg:w-8
|
|
||||||
xl:w-7
|
|
||||||
"
|
|
||||||
>
|
>
|
||||||
<div class="text-center mb-5">
|
<div>
|
||||||
<div class="text-900 text-3xl font-semibold mb-3">
|
<div class="row">
|
||||||
ArrahnBid
|
<div
|
||||||
<img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" />
|
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>
|
||||||
|
<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>
|
||||||
<span class="text-600 font-medium line-height-3"
|
</div>
|
||||||
|
<div class="text-center mb-5">
|
||||||
|
<img class="logo-img" src="img/bidder.png" alt="erahn-logo" />
|
||||||
|
<div class="text-200 text-3xl font-semibold mb-3">Log Masuk</div>
|
||||||
|
<span class="text-200 font-medium line-height-3"
|
||||||
>Belum punyai akaun?</span
|
>Belum punyai akaun?</span
|
||||||
>
|
>
|
||||||
<router-link
|
<router-link
|
||||||
v-bind:to="{ name: 'register' }"
|
v-bind:to="{ name: 'register' }"
|
||||||
class="font-medium no-underline ml-2 text-blue-500 cursor-pointer"
|
class="font-medium no-underline ml-2 text-white cursor-pointer"
|
||||||
>Daftar sekarang!</router-link
|
>Daftar sekarang!
|
||||||
>
|
</router-link>
|
||||||
</div>
|
</div>
|
||||||
<form @submit.prevent="submit">
|
<form @submit.prevent="submit">
|
||||||
<div class="px-0 text-center md:px-8">
|
<div class="px-0 text-center md:px-8">
|
||||||
<div class="field grid">
|
<div class="field grid">
|
||||||
<label
|
<!-- <label for="firstname3" class="justify-content-end"
|
||||||
for="firstname3"
|
style="width: 170px">Username</label> -->
|
||||||
class="justify-content-end"
|
|
||||||
style="width: 170px"
|
|
||||||
>Username</label
|
|
||||||
>
|
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<span class="p-input-icon-right">
|
<span class="p-input-icon-right">
|
||||||
<i class="pi pi-user" />
|
<i class="pi pi-user" />
|
||||||
@@ -52,6 +63,7 @@
|
|||||||
class="mb-2"
|
class="mb-2"
|
||||||
v-model="form.username"
|
v-model="form.username"
|
||||||
type="text"
|
type="text"
|
||||||
|
placeholder="Username"
|
||||||
required
|
required
|
||||||
></InputText>
|
></InputText>
|
||||||
</span>
|
</span>
|
||||||
@@ -61,18 +73,16 @@
|
|||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
<div class="field grid">
|
<div class="field grid">
|
||||||
<label
|
<!-- <label for="firstname3"
|
||||||
for="firstname3"
|
|
||||||
class="justify-content-end"
|
class="justify-content-end"
|
||||||
style="width: 170px"
|
style="width: 170px">Kata Laluan</label> -->
|
||||||
>Kata Laluan</label
|
|
||||||
>
|
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<span class="p-input-icon-left">
|
<span class="p-input-icon-left">
|
||||||
<i class="pi pi-user" />
|
<i class="pi pi-user" />
|
||||||
<Password
|
<Password
|
||||||
class="mb-2"
|
class="mb-2"
|
||||||
v-model="form.password"
|
v-model="form.password"
|
||||||
|
placeholder="Password"
|
||||||
toggleMask
|
toggleMask
|
||||||
:feedback="false"
|
:feedback="false"
|
||||||
/>
|
/>
|
||||||
@@ -211,12 +221,38 @@ export default {
|
|||||||
#9599e2 100%
|
#9599e2 100%
|
||||||
),
|
),
|
||||||
url("/src/assets/background_arrahn.jpg"); */
|
url("/src/assets/background_arrahn.jpg"); */
|
||||||
|
background-image: url("/src/assets/background-lelong.png");
|
||||||
|
background-color: #fec234;
|
||||||
background-position: center;
|
background-position: center;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo-img {
|
.content-bg {
|
||||||
width: 84px;
|
background: #fff9f9eb !important;
|
||||||
height: 44px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.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>
|
</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,203 +1,45 @@
|
|||||||
<template>
|
<template>
|
||||||
<Toast :breakpoints="{ '767px': { width: '100%', right: '0', left: '0' } }" />
|
<Toast :breakpoints="{ '767px': { width: '100%', right: '0', left: '0' } }" />
|
||||||
<div
|
<div class="main-container">
|
||||||
class="
|
|
||||||
flex
|
|
||||||
main-container
|
|
||||||
min-h-screen
|
|
||||||
align-items-center
|
|
||||||
justify-content-center
|
|
||||||
m-5
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<div
|
<div
|
||||||
class="
|
class="flex min-h-screen align-items-center justify-content-center p-5"
|
||||||
surface-card
|
|
||||||
fadein
|
|
||||||
p-4
|
|
||||||
shadow-2
|
|
||||||
border-round
|
|
||||||
w-11
|
|
||||||
md:w-10
|
|
||||||
lg:w-10
|
|
||||||
xl:w-8
|
|
||||||
"
|
|
||||||
>
|
>
|
||||||
<div class="text-center mb-5">
|
<div
|
||||||
<div class="text-900 text-3xl font-semibold mb-3">
|
class="
|
||||||
ArrahnBid
|
surface-card
|
||||||
<img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" />
|
fadein
|
||||||
</div>
|
p-4
|
||||||
<span class="text-600 font-medium line-height-3"
|
shadow-2
|
||||||
>Sudah punyai akaun?</span
|
border-round
|
||||||
>
|
w-11
|
||||||
<router-link
|
md:w-10
|
||||||
v-bind:to="{ name: 'login' }"
|
lg:w-10
|
||||||
class="font-medium no-underline ml-2 text-blue-500 cursor-pointer"
|
xl:w-8
|
||||||
>Log masuk sekarang!</router-link
|
"
|
||||||
>
|
>
|
||||||
</div>
|
<div class="text-center mb-3">
|
||||||
<h5>Daftar Akaun</h5>
|
<div class="text-900 text-3xl font-semibold mb-3">
|
||||||
<div class="grid">
|
<img class="logo-img" src="img/e-rahn-lelong.png" alt="arrahn-logo" />
|
||||||
<div class="col-12 lg:col-6">
|
<div class="text-200 text-3xl font-semibold mb-3 mt-3">Daftar Akaun</div>
|
||||||
<div class="field">
|
|
||||||
<label for="name">Nama</label>
|
|
||||||
<InputText
|
|
||||||
id="name"
|
|
||||||
type="text"
|
|
||||||
v-model="form.name"
|
|
||||||
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" v-if="v$.form.name.$error"
|
|
||||||
>Nama diperlukan</InlineMessage
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
|
<!-- <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>
|
</div>
|
||||||
<div class="col-12 lg:col-6">
|
<!-- <h5>Daftar Akaun</h5> -->
|
||||||
<div class="field">
|
<div class="grid">
|
||||||
<!-- <label for="nokp">No Kad Pengenalan</label> -->
|
<div class="col-12 lg:col-6">
|
||||||
<select
|
<div class="field text-200">
|
||||||
class="p-0 mb-2 form-select"
|
<label for="name">Nama</label>
|
||||||
style="width: 190px; border: none"
|
<InputText
|
||||||
>
|
id="name"
|
||||||
<option selected value="nokp">No Kad Pengenalan</option>
|
|
||||||
<option value="passpor">No Passport</option>
|
|
||||||
</select>
|
|
||||||
<InputText
|
|
||||||
id="nokp"
|
|
||||||
type="text"
|
|
||||||
v-model="form.nokp"
|
|
||||||
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" v-if="v$.form.nokp.$error"
|
|
||||||
>No KP diperlukan</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"
|
|
||||||
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> -->
|
|
||||||
<MazPhoneNumberInput
|
|
||||||
v-model="form.notelbimbit"
|
|
||||||
show-code-on-list
|
|
||||||
:preferred-countries="['MY']"
|
|
||||||
:translations="{
|
|
||||||
countrySelector: {
|
|
||||||
placeholder: 'Pilih Negara',
|
|
||||||
error: 'Choose country',
|
|
||||||
},
|
|
||||||
phoneInput: {
|
|
||||||
placeholder: 'Nombor Telefon',
|
|
||||||
},
|
|
||||||
}"
|
|
||||||
:no-example="true"
|
|
||||||
@update="results = $event"
|
|
||||||
/>
|
|
||||||
<InlineMessage class="mt-1" v-if="v$.form.notelbimbit.$error"
|
|
||||||
>No telefon diperlukan</InlineMessage
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 lg:col-6">
|
|
||||||
<div class="field">
|
|
||||||
<label for="email">Emel</label>
|
|
||||||
<InputText
|
|
||||||
id="email"
|
|
||||||
type="text"
|
|
||||||
v-model="form.email"
|
|
||||||
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
|
|
||||||
h-match-phone-number
|
|
||||||
"
|
|
||||||
></InputText>
|
|
||||||
<InlineMessage class="mt-1" v-if="v$.form.email.$error"
|
|
||||||
>Sila isi emel yang sah</InlineMessage
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 lg:col-6">
|
|
||||||
<div class="field">
|
|
||||||
<p class="mb-0" for="username">Username</p>
|
|
||||||
<InputText
|
|
||||||
id="username"
|
|
||||||
type="text"
|
|
||||||
v-model="form.username"
|
|
||||||
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
|
|
||||||
h-match-password
|
|
||||||
"
|
|
||||||
></InputText>
|
|
||||||
<InlineMessage class="mt-1" v-if="v$.form.username.$error"
|
|
||||||
>Username diperlukan</InlineMessage
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 lg:col-6">
|
|
||||||
<div class="field">
|
|
||||||
<p class="mb-0">Kata Laluan</p>
|
|
||||||
<div class="p-input-icon-right">
|
|
||||||
<i class="pi pi-user" />
|
|
||||||
<!-- <InputText
|
|
||||||
id="password"
|
|
||||||
type="text"
|
type="text"
|
||||||
v-model="form.password"
|
v-model="form.name"
|
||||||
class="
|
class="
|
||||||
text-base text-color
|
text-base text-color
|
||||||
surface-overlay
|
surface-overlay
|
||||||
@@ -210,240 +52,273 @@
|
|||||||
focus:border-primary
|
focus:border-primary
|
||||||
w-full
|
w-full
|
||||||
"
|
"
|
||||||
></InputText> -->
|
></InputText>
|
||||||
<Password
|
<InlineMessage class="mt-1" v-if="v$.form.name.$error"
|
||||||
v-model="form.password"
|
>Nama diperlukan</InlineMessage
|
||||||
toggleMask
|
>
|
||||||
:feedback="false"
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 lg:col-6">
|
||||||
|
<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> -->
|
||||||
|
<InputText
|
||||||
|
id="nokp"
|
||||||
|
type="text"
|
||||||
|
v-model="form.nokp"
|
||||||
class="
|
class="
|
||||||
text-base text-color
|
text-base text-color
|
||||||
surface-overlay surface-border
|
surface-overlay
|
||||||
|
p-2
|
||||||
|
border-1 border-solid
|
||||||
|
surface-border
|
||||||
border-round
|
border-round
|
||||||
appearance-none
|
appearance-none
|
||||||
outline-none
|
outline-none
|
||||||
focus:border-primary
|
focus:border-primary
|
||||||
w-full
|
w-full
|
||||||
"
|
"
|
||||||
/>
|
></InputText>
|
||||||
|
<InlineMessage class="mt-1" v-if="v$.form.nokp.$error"
|
||||||
|
>Semak No KP</InlineMessage
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
<InlineMessage class="mt-1" v-if="v$.form.password.$error"
|
|
||||||
>Kata laluan diperlukan & mestilah 8 huruf</InlineMessage
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="col-12">
|
||||||
<!-- <div class="col-12 lg:col-6">
|
<div class="field text-200">
|
||||||
<div class="field">
|
<label for="alamat">Alamat</label>
|
||||||
<label for="confirmpassword">Tetapkan Kata Laluan</label>
|
<Textarea
|
||||||
<InputText
|
id="alamat"
|
||||||
id="confirmpassword"
|
v-model="form.alamat"
|
||||||
type="text"
|
class="
|
||||||
v-model="form.password_confirmation"
|
text-base text-color
|
||||||
disabled
|
surface-overlay
|
||||||
class="
|
p-2
|
||||||
text-base text-color
|
border-1 border-solid
|
||||||
surface-overlay
|
surface-border
|
||||||
p-2
|
border-round
|
||||||
border-1 border-solid
|
appearance-none
|
||||||
surface-border
|
outline-none
|
||||||
border-round
|
focus:border-primary
|
||||||
appearance-none
|
w-full
|
||||||
outline-none
|
"
|
||||||
focus:border-primary
|
></Textarea>
|
||||||
w-full
|
<InlineMessage class="mt-1" v-if="v$.form.alamat.$error"
|
||||||
"
|
>Alamat diperlukan</InlineMessage
|
||||||
></InputText>
|
>
|
||||||
<InlineMessage class="mt-1"
|
</div>
|
||||||
>Tetapkan kata laluan diperlukan</InlineMessage
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</div> -->
|
<div class="col-12 lg:col-6">
|
||||||
<div class="col-12">
|
<div class="field text-200">
|
||||||
<div class="field">
|
<label for="notelbimbit">No Telefon</label>
|
||||||
<label for="frontic">Kad Pengenalan Hadapan</label>
|
<MazPhoneNumberInput
|
||||||
<!-- <FileUpload
|
v-model="form.notelbimbit"
|
||||||
name="demo[]"
|
show-code-on-list
|
||||||
url="./upload"
|
:fetch-country="true"
|
||||||
:maxFileSize="1500000"
|
:preferred-countries="['MY']"
|
||||||
:fileLimit="1"
|
:translations="{
|
||||||
:multiple="false"
|
countrySelector: {
|
||||||
:showUploadButton="false"
|
placeholder: 'Pilih Negara',
|
||||||
:showCancelButton="false"
|
error: 'Choose country',
|
||||||
v-model="form.images.file1"
|
},
|
||||||
/> -->
|
phoneInput: {
|
||||||
<input
|
placeholder: 'Nombor Telefon',
|
||||||
class="form-control"
|
},
|
||||||
type="file"
|
}"
|
||||||
id="formFile"
|
:no-example="true"
|
||||||
ref="formFileRef"
|
@update="results = $event"
|
||||||
@change="readImage()"
|
/>
|
||||||
/>
|
<InlineMessage class="mt-1" v-if="v$.form.notelbimbit.$error"
|
||||||
<!-- <InlineMessage class="mt-1" v-if="v$.form.images.file1.$error"
|
>No telefon diperlukan</InlineMessage
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 lg:col-6">
|
||||||
|
<div class="field text-200">
|
||||||
|
<label for="email">Emel</label>
|
||||||
|
<InputText
|
||||||
|
id="email"
|
||||||
|
type="text"
|
||||||
|
v-model="form.email"
|
||||||
|
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
|
||||||
|
h-match-phone-number
|
||||||
|
"
|
||||||
|
></InputText>
|
||||||
|
<InlineMessage class="mt-1" v-if="v$.form.email.$error"
|
||||||
|
>Sila isi emel yang sah</InlineMessage
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 lg:col-6">
|
||||||
|
<div class="field text-200">
|
||||||
|
<p class="mb-0" for="username">Username</p>
|
||||||
|
<InputText
|
||||||
|
id="username"
|
||||||
|
type="text"
|
||||||
|
v-model="form.username"
|
||||||
|
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
|
||||||
|
h-match-password
|
||||||
|
"
|
||||||
|
></InputText>
|
||||||
|
<InlineMessage class="mt-1" v-if="v$.form.username.$error"
|
||||||
|
>Username diperlukan</InlineMessage
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 lg:col-6">
|
||||||
|
<div class="field text-200">
|
||||||
|
<p class="mb-0">Kata Laluan</p>
|
||||||
|
<div class="p-input-icon-right">
|
||||||
|
<i class="pi pi-user" />
|
||||||
|
<Password
|
||||||
|
v-model="form.password"
|
||||||
|
toggleMask
|
||||||
|
:feedback="false"
|
||||||
|
class="
|
||||||
|
text-base text-color
|
||||||
|
surface-overlay surface-border
|
||||||
|
border-round
|
||||||
|
appearance-none
|
||||||
|
outline-none
|
||||||
|
focus:border-primary
|
||||||
|
w-full
|
||||||
|
"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<InlineMessage class="mt-1" v-if="v$.form.password.$error"
|
||||||
|
>Kata laluan diperlukan & mestilah 8 huruf</InlineMessage
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- <div class="col-12">
|
||||||
|
<div class="field">
|
||||||
|
<label for="frontic">Kad Pengenalan Hadapan</label>
|
||||||
|
<input
|
||||||
|
class="form-control"
|
||||||
|
type="file"
|
||||||
|
id="formFile"
|
||||||
|
ref="formFileRef"
|
||||||
|
@change="readImage()"
|
||||||
|
/>
|
||||||
|
<InlineMessage class="mt-1" v-if="v$.form.images.file1.$error"
|
||||||
>Kad pengenalan hadapan diperlukan</InlineMessage
|
>Kad pengenalan hadapan diperlukan</InlineMessage
|
||||||
> -->
|
>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="col-12">
|
||||||
<div class="col-12">
|
<div class="field">
|
||||||
<div class="field">
|
<label for="backic">Kad Pengenalan Belakang</label>
|
||||||
<label for="backic">Kad Pengenalan Belakang</label>
|
<input class="form-control" type="file" />
|
||||||
<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
|
>Kad pengenalan belakang diperlukan</InlineMessage
|
||||||
> -->
|
>
|
||||||
|
</div>
|
||||||
|
</div> -->
|
||||||
|
<div class="col-12">
|
||||||
|
<div class="mt-3 mb-1">
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" v-model="form.register_agree" />
|
||||||
|
Setuju Dengan <terms-and-conditions></terms-and-conditions>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<InlineMessage v-if="v$.form.register_agree.$error"
|
||||||
|
>Anda mestilah bersetuju dengan terma & syarat.</InlineMessage
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="col-12 text-center">
|
||||||
<div class="col-12">
|
<Button
|
||||||
<div class="mt-3 mb-1">
|
class="p-button-sm"
|
||||||
<label>
|
label="Teruskan"
|
||||||
<input type="checkbox" v-model="form.register_agree" />
|
icon="pi pi-sign-in"
|
||||||
Setuju Dengan <terms-and-conditions></terms-and-conditions>
|
iconPos="right"
|
||||||
</label>
|
@click="openModalTNC()"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<InlineMessage v-if="v$.form.register_agree.$error"
|
<div class="col-12 text-center">
|
||||||
>Anda mestilah bersetuju dengan terma & syarat.</InlineMessage
|
<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>
|
||||||
<div class="col-12 text-center">
|
</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
|
<Button
|
||||||
class="p-button-sm"
|
class="p-button-sm"
|
||||||
label="Daftar"
|
label="Daftar Sekarang"
|
||||||
:loading="isLoading"
|
:loading="isLoading"
|
||||||
icon="pi pi-sign-in"
|
icon="pi pi-sign-in"
|
||||||
iconPos="right"
|
iconPos="right"
|
||||||
@click="doRegister()"
|
@click="doRegister()"
|
||||||
></Button>
|
></Button>
|
||||||
</div>
|
</template>
|
||||||
</div>
|
</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>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
import useVuelidate from "@vuelidate/core";
|
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 {
|
export default {
|
||||||
name: "Register",
|
name: "Register",
|
||||||
|
components: {
|
||||||
|
"terms-and-conditions-details": TermsAndConditionsDetails,
|
||||||
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
v$: useVuelidate(),
|
v$: useVuelidate(),
|
||||||
alertMessages: Array,
|
alertMessages: Array,
|
||||||
isLoading: false,
|
isLoading: false,
|
||||||
|
isDisplayTNC: false,
|
||||||
form: {
|
form: {
|
||||||
name: "",
|
name: "",
|
||||||
username: "",
|
username: "",
|
||||||
@@ -452,6 +327,7 @@ export default {
|
|||||||
email: "",
|
email: "",
|
||||||
notelbimbit: "",
|
notelbimbit: "",
|
||||||
register_agree: null,
|
register_agree: null,
|
||||||
|
alamat: "",
|
||||||
// password_confirmation: "",
|
// password_confirmation: "",
|
||||||
images: {
|
images: {
|
||||||
file1: {
|
file1: {
|
||||||
@@ -478,8 +354,8 @@ export default {
|
|||||||
axios
|
axios
|
||||||
.post("/register", this.form)
|
.post("/register", this.form)
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
|
// console.log("doRegister", response);
|
||||||
if (response.data.success == true) {
|
if (response.data.success == true) {
|
||||||
console.log(response);
|
|
||||||
localStorage.setItem("token", response.data.token);
|
localStorage.setItem("token", response.data.token);
|
||||||
localStorage.setItem("id", response.data.user.id);
|
localStorage.setItem("id", response.data.user.id);
|
||||||
localStorage.setItem("nokp", response.data.user.nokp);
|
localStorage.setItem("nokp", response.data.user.nokp);
|
||||||
@@ -494,6 +370,7 @@ export default {
|
|||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
} else if (response.data.success == false) {
|
} else if (response.data.success == false) {
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
|
this.isDisplayTNC = false;
|
||||||
this.alertMessages = response.data.message;
|
this.alertMessages = response.data.message;
|
||||||
Object.values(this.alertMessages).forEach((val) =>
|
Object.values(this.alertMessages).forEach((val) =>
|
||||||
this.$toast.add({
|
this.$toast.add({
|
||||||
@@ -502,6 +379,14 @@ export default {
|
|||||||
detail: val[0],
|
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 {
|
} else {
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
alert(response);
|
alert(response);
|
||||||
@@ -515,6 +400,15 @@ export default {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
openModalTNC() {
|
||||||
|
this.v$.$validate();
|
||||||
|
if (!this.v$.$error) {
|
||||||
|
this.isDisplayTNC = true;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
closeModalTNC() {
|
||||||
|
this.isDisplayTNC = false;
|
||||||
|
},
|
||||||
readImage() {},
|
readImage() {},
|
||||||
},
|
},
|
||||||
validations() {
|
validations() {
|
||||||
@@ -522,11 +416,12 @@ export default {
|
|||||||
form: {
|
form: {
|
||||||
name: { required },
|
name: { required },
|
||||||
username: { required },
|
username: { required },
|
||||||
nokp: { required },
|
nokp: { required, minLengthValue: minLength(12), maxLengthValue: maxLength(12) },
|
||||||
password: { required, minLengthValue: minLength(8) },
|
password: { required, minLengthValue: minLength(8) },
|
||||||
email: { required, email },
|
email: { required, email },
|
||||||
notelbimbit: { required },
|
notelbimbit: { required, minLengthValue: minLength(8) },
|
||||||
register_agree: { required },
|
register_agree: { required },
|
||||||
|
alamat: { required },
|
||||||
// images: {
|
// images: {
|
||||||
// file1: {
|
// file1: {
|
||||||
// filename: { required },
|
// filename: { required },
|
||||||
@@ -542,9 +437,15 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
.main-container {
|
||||||
|
background: url("/src/assets/background-lelong.png");
|
||||||
|
background-position: center;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
|
||||||
.logo-img {
|
.logo-img {
|
||||||
width: 84px;
|
width: 300px;
|
||||||
height: 44px;
|
height: 55px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-match-phone-number {
|
.h-match-phone-number {
|
||||||
@@ -554,4 +455,4 @@ export default {
|
|||||||
.h-match-password {
|
.h-match-password {
|
||||||
height: 42px;
|
height: 42px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,18 +1,15 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<div>
|
||||||
|
<VueSidebarMenuAkahon />
|
||||||
|
</div>
|
||||||
<div v-if="isLoading" class="fadein animation-duration-400">
|
<div v-if="isLoading" class="fadein animation-duration-400">
|
||||||
<div
|
<div class="flex align-items-center justify-content-center container-height">
|
||||||
class="flex align-items-center justify-content-center container-height"
|
|
||||||
>
|
|
||||||
<div class="spinner-border" role="status">
|
<div class="spinner-border" role="status">
|
||||||
<span class="visually-hidden">Loading...</span>
|
<span class="visually-hidden">Loading...</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div v-else style="min-height: 70vh" class="fadein animation-duration-400">
|
||||||
v-else
|
|
||||||
style="min-height: 70vh"
|
|
||||||
class="fadein animation-duration-400"
|
|
||||||
>
|
|
||||||
<div v-if="isSuccess" class="grid justify-content-center">
|
<div v-if="isSuccess" class="grid justify-content-center">
|
||||||
<div class="col-12 lg:col-11">
|
<div class="col-12 lg:col-11">
|
||||||
<Card>
|
<Card>
|
||||||
@@ -23,7 +20,18 @@
|
|||||||
<Accordion :multiple="true">
|
<Accordion :multiple="true">
|
||||||
<AccordionTab v-for="bid in listBid" v-bind:key="bid">
|
<AccordionTab v-for="bid in listBid" v-bind:key="bid">
|
||||||
<template #header>
|
<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>
|
</template>
|
||||||
<div class="overflow-x-auto">
|
<div class="overflow-x-auto">
|
||||||
<table class="table text-center table-bordered table-hover">
|
<table class="table text-center table-bordered table-hover">
|
||||||
@@ -61,12 +69,14 @@
|
|||||||
</tr>
|
</tr>
|
||||||
<tr style="text-transform: uppercase">
|
<tr style="text-transform: uppercase">
|
||||||
<th colspan="3">Jumlah</th>
|
<th colspan="3">Jumlah</th>
|
||||||
<th>{{bid.total_berat}}g</th>
|
<th>{{ bid.total_berat }}g</th>
|
||||||
<th>RM{{
|
<th>
|
||||||
|
RM{{
|
||||||
bid.total_bidaan
|
bid.total_bidaan
|
||||||
?.toString()
|
?.toString()
|
||||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||||
}}</th>
|
}}
|
||||||
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
@@ -76,70 +86,6 @@
|
|||||||
</template>
|
</template>
|
||||||
</Card>
|
</Card>
|
||||||
</div>
|
</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>
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<div
|
<div
|
||||||
@@ -156,7 +102,7 @@
|
|||||||
<span class="text-400"
|
<span class="text-400"
|
||||||
>Sila rujuk halaman
|
>Sila rujuk halaman
|
||||||
<router-link v-bind:to="{ name: 'home' }">Utama</router-link>
|
<router-link v-bind:to="{ name: 'home' }">Utama</router-link>
|
||||||
untuk jadual lelong.</span
|
untuk jadual lelongan.</span
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -193,25 +139,32 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
border: 1px solid rgba(0, 0, 0, 0.125);
|
|
||||||
min-height: 300px;
|
min-height: 300px;
|
||||||
min-width: 300px;
|
min-width: 300px;
|
||||||
max-height: 600px;
|
max-height: 600px;
|
||||||
max-width: 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>
|
||||||
<div class="col-12 text-center lg:col-6">
|
<div class="col-12 text-center lg:col-6">
|
||||||
<div class="overflow-x-auto">
|
<div class="overflow-x-auto">
|
||||||
<table class="table table-bordered">
|
<table class="table table-bordered">
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr class="table-light">
|
<tr class="table-light">
|
||||||
<td>Bil</td>
|
<th>Bil</th>
|
||||||
<td style="min-width: 115px">Jenis Marhun</td>
|
<th style="min-width: 115px">Jenis Marhun</th>
|
||||||
<td style="min-width: 42px">Karat</td>
|
<th style="min-width: 42px">Karat</th>
|
||||||
<td style="min-width: 42px">Berat</td>
|
<th style="min-width: 42px">Berat</th>
|
||||||
<td style="min-width: 102px">Harga Asas</td>
|
<th style="min-width: 102px">Harga Asas</th>
|
||||||
</tr>
|
</tr>
|
||||||
<tr
|
<tr
|
||||||
v-for="(marhun, index) in theData.lelongbidmarhun"
|
v-for="(marhun, index) in theData.lelongbidmarhun"
|
||||||
@@ -276,9 +229,13 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
|
import ItemMasterImageModal from "../list/ItemMasterImageModal.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "BidDetail",
|
name: "BidDetail",
|
||||||
|
components: {
|
||||||
|
"item-master-image-modal": ItemMasterImageModal
|
||||||
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
listBid: [],
|
listBid: [],
|
||||||
@@ -286,6 +243,7 @@ export default {
|
|||||||
isSuccess: false,
|
isSuccess: false,
|
||||||
theData: "",
|
theData: "",
|
||||||
date: "",
|
date: "",
|
||||||
|
reloadImageComponent: 0,
|
||||||
// userId: localStorage.getItem("id"),
|
// userId: localStorage.getItem("id"),
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
@@ -300,7 +258,7 @@ export default {
|
|||||||
var mm = String(today.getMonth() + 1).padStart(2, "0"); //January is 0!
|
var mm = String(today.getMonth() + 1).padStart(2, "0"); //January is 0!
|
||||||
var yyyy = today.getFullYear();
|
var yyyy = today.getFullYear();
|
||||||
|
|
||||||
today = yyyy + "-" + mm + "-" + dd;
|
today = dd + "-" + mm + "-" + yyyy;
|
||||||
this.date = today;
|
this.date = today;
|
||||||
},
|
},
|
||||||
bidRecord() {
|
bidRecord() {
|
||||||
@@ -310,11 +268,9 @@ export default {
|
|||||||
headers: {
|
headers: {
|
||||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||||
},
|
},
|
||||||
params: {
|
|
||||||
lelongId: localStorage.getItem("lelong_id"),
|
|
||||||
},
|
|
||||||
})
|
})
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
|
// console.log("bidRecord", response);
|
||||||
if (response.data.success == true) {
|
if (response.data.success == true) {
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
this.isSuccess = true;
|
this.isSuccess = true;
|
||||||
@@ -330,6 +286,7 @@ export default {
|
|||||||
},
|
},
|
||||||
marhunModal(value) {
|
marhunModal(value) {
|
||||||
this.theData = value;
|
this.theData = value;
|
||||||
|
this.reloadImageComponent += 1;
|
||||||
console.log(value);
|
console.log(value);
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
@@ -340,4 +297,18 @@ export default {
|
|||||||
.container-height {
|
.container-height {
|
||||||
min-height: 70vh;
|
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>
|
</style>
|
||||||
@@ -15,108 +15,6 @@
|
|||||||
>
|
>
|
||||||
<div v-if="isSuccess" class="row">
|
<div v-if="isSuccess" class="row">
|
||||||
<div class="col-12 lg:col-9">
|
<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>
|
<Card>
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="font-normal">Senarai Troli</div>
|
<div class="font-normal">Senarai Troli</div>
|
||||||
@@ -125,8 +23,18 @@
|
|||||||
<Accordion :multiple="true">
|
<Accordion :multiple="true">
|
||||||
<AccordionTab v-for="item in listItems" v-bind:key="item">
|
<AccordionTab v-for="item in listItems" v-bind:key="item">
|
||||||
<template #header>
|
<template #header>
|
||||||
<span>{{ item.caw_name }}</span>
|
<div class="flex justify-content-between w-100">
|
||||||
<!-- <span class="ml-2">Jumlah:RMXXXX</span> -->
|
<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>
|
</template>
|
||||||
<div class="overflow-x-auto">
|
<div class="overflow-x-auto">
|
||||||
<table class="table text-center table-bordered table-hover">
|
<table class="table text-center table-bordered table-hover">
|
||||||
@@ -232,12 +140,6 @@
|
|||||||
}}
|
}}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<!-- <Button
|
|
||||||
label="Teruskan"
|
|
||||||
class="p-button-sm w-full"
|
|
||||||
data-bs-toggle="modal"
|
|
||||||
data-bs-target="#bidModal"
|
|
||||||
/> -->
|
|
||||||
<Button
|
<Button
|
||||||
label="Teruskan"
|
label="Teruskan"
|
||||||
class="p-button-sm w-full"
|
class="p-button-sm w-full"
|
||||||
@@ -299,18 +201,23 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
border: 1px solid rgba(0, 0, 0, 0.125);
|
|
||||||
min-height: 300px;
|
min-height: 300px;
|
||||||
min-width: 300px;
|
min-width: 300px;
|
||||||
max-height: 600px;
|
max-height: 600px;
|
||||||
max-width: 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>
|
||||||
<div class="col-12 text-center lg:col-6">
|
<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">
|
<div class="overflow-x-auto">
|
||||||
<table class="table table-bordered">
|
<table class="table table-bordered">
|
||||||
<tbody>
|
<tbody>
|
||||||
@@ -351,62 +258,6 @@
|
|||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</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="row justify-content-center">
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<label class="col-form-label">Jumlah Harga Bida</label>
|
<label class="col-form-label">Jumlah Harga Bida</label>
|
||||||
@@ -440,23 +291,6 @@
|
|||||||
v-on:click="openModal(theSurat)"
|
v-on:click="openModal(theSurat)"
|
||||||
class="p-button-warning p-button-text"
|
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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -465,20 +299,7 @@
|
|||||||
class="p-button-sm"
|
class="p-button-sm"
|
||||||
label="Kembali"
|
label="Kembali"
|
||||||
data-bs-dismiss="modal"
|
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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -597,20 +418,6 @@
|
|||||||
:loading="isLoadingUbah"
|
:loading="isLoadingUbah"
|
||||||
@click="updateItem(theSurat)"
|
@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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -680,20 +487,6 @@
|
|||||||
:loading="isLoadingPadam"
|
:loading="isLoadingPadam"
|
||||||
@click="deleteItem(theSurat)"
|
@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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -742,19 +535,6 @@
|
|||||||
<p class="text-danger">
|
<p class="text-danger">
|
||||||
<i>*Bidaan tidak dapat diubah selepas dihantar.</i>
|
<i>*Bidaan tidak dapat diubah selepas dihantar.</i>
|
||||||
</p>
|
</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>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button
|
<button
|
||||||
@@ -774,10 +554,7 @@
|
|||||||
<p
|
<p
|
||||||
class="fst-italic mt-3 fw-lighter"
|
class="fst-italic mt-3 fw-lighter"
|
||||||
style="text-align: right; font-size: small"
|
style="text-align: right; font-size: small"
|
||||||
>
|
></p>
|
||||||
<!-- *Pelayar akan dialihkan ke halaman pembayaran jika butang 'Bayar'
|
|
||||||
ditekan. -->
|
|
||||||
</p>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -893,9 +670,13 @@
|
|||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
import useVuelidate from "@vuelidate/core";
|
import useVuelidate from "@vuelidate/core";
|
||||||
import { required, integer, numeric, minValue } from "@vuelidate/validators";
|
import { required, integer, numeric, minValue } from "@vuelidate/validators";
|
||||||
|
import ItemMasterImageModal from "../list/ItemMasterImageModal.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
emits: ["reloadComponent"],
|
emits: ["reloadComponent"],
|
||||||
|
components: {
|
||||||
|
"item-master-image-modal": ItemMasterImageModal,
|
||||||
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
v$: useVuelidate(),
|
v$: useVuelidate(),
|
||||||
@@ -910,6 +691,7 @@ export default {
|
|||||||
listItems: "",
|
listItems: "",
|
||||||
theSurat: "",
|
theSurat: "",
|
||||||
tambahanBidaan: "",
|
tambahanBidaan: "",
|
||||||
|
reloadImageComponent: 0,
|
||||||
jumlahBidaan: "",
|
jumlahBidaan: "",
|
||||||
akadLelong: null,
|
akadLelong: null,
|
||||||
hargaAsas: "",
|
hargaAsas: "",
|
||||||
@@ -955,9 +737,9 @@ export default {
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
|
// console.log("listCart", response);
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
if (response.data.success == true) {
|
if (response.data.success == true) {
|
||||||
console.log(response);
|
|
||||||
this.isSuccess = true;
|
this.isSuccess = true;
|
||||||
this.listItems = response.data.cart;
|
this.listItems = response.data.cart;
|
||||||
this.masterTotalSurat = response.data.master_total_surat;
|
this.masterTotalSurat = response.data.master_total_surat;
|
||||||
@@ -965,7 +747,6 @@ export default {
|
|||||||
} else if (response.data.success == false) {
|
} else if (response.data.success == false) {
|
||||||
this.isSuccess = false;
|
this.isSuccess = false;
|
||||||
}
|
}
|
||||||
console.log(response);
|
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
console.log(error);
|
console.log(error);
|
||||||
@@ -976,6 +757,7 @@ export default {
|
|||||||
this.tambahanBidaan = value.hargabida - value.hargaasas;
|
this.tambahanBidaan = value.hargabida - value.hargaasas;
|
||||||
this.jumlahBidaan = parseFloat(value.hargabida);
|
this.jumlahBidaan = parseFloat(value.hargabida);
|
||||||
this.hargaAsas = value.hargaasas;
|
this.hargaAsas = value.hargaasas;
|
||||||
|
this.reloadImageComponent += 1;
|
||||||
},
|
},
|
||||||
deleteItem(value) {
|
deleteItem(value) {
|
||||||
this.isLoadingPadam = true;
|
this.isLoadingPadam = true;
|
||||||
@@ -1041,10 +823,10 @@ export default {
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
|
// console.log("updateItem", response);
|
||||||
this.isLoadingUbah = false;
|
this.isLoadingUbah = false;
|
||||||
// this.isLoading = true;
|
// this.isLoading = true;
|
||||||
this.$refs.editClose.click();
|
this.$refs.editClose.click();
|
||||||
console.log(response);
|
|
||||||
this.$swal.fire({
|
this.$swal.fire({
|
||||||
icon: "success",
|
icon: "success",
|
||||||
title: "Bidaan Berjaya Diubah",
|
title: "Bidaan Berjaya Diubah",
|
||||||
@@ -1087,7 +869,7 @@ export default {
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
console.log(response);
|
// console.log("bidderSelectBidItem", response);
|
||||||
if (response.data.success == "success") {
|
if (response.data.success == "success") {
|
||||||
this.isLoadingDaftar = false;
|
this.isLoadingDaftar = false;
|
||||||
this.$refs.daftarBidaanClose.click();
|
this.$refs.daftarBidaanClose.click();
|
||||||
@@ -1101,7 +883,6 @@ export default {
|
|||||||
allowEscapeKey: false,
|
allowEscapeKey: false,
|
||||||
});
|
});
|
||||||
// this.loading = false;
|
// this.loading = false;
|
||||||
console.log(response);
|
|
||||||
this.$emit("reloadComponent");
|
this.$emit("reloadComponent");
|
||||||
} else {
|
} else {
|
||||||
this.isLoadingDaftar = false;
|
this.isLoadingDaftar = false;
|
||||||
@@ -1156,4 +937,18 @@ export default {
|
|||||||
.container-height {
|
.container-height {
|
||||||
min-height: 70vh;
|
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>
|
</style>
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<Card>
|
<Card style="margin-bottom: 1em">
|
||||||
<template #title>
|
<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>
|
<div class="font-normal">Harga Emas Lelongan</div>
|
||||||
<Button
|
<Button
|
||||||
class="button-standard p-button-rounded p-button-outlined"
|
class="button-standard p-button-rounded p-button-outlined"
|
||||||
|
|||||||
@@ -8,15 +8,17 @@
|
|||||||
</div>
|
</div>
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<div v-if="responseData" class="fadein animation-duration-400">
|
<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">
|
<div class="overflow-x-auto">
|
||||||
<table class="table table-bordered table-hover">
|
<table class="table table-bordered table-hover">
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr class="table-light">
|
<tr class="table-light">
|
||||||
<td>Bil</td>
|
<th>Bil</th>
|
||||||
<td>Karat</td>
|
<th>Karat</th>
|
||||||
<td style="min-width: 100px">Harga</td>
|
<th style="min-width: 100px">Harga</th>
|
||||||
</tr>
|
</tr>
|
||||||
<tr v-for="(data, index) in listKarat" v-bind:key="data.id">
|
<tr v-for="(data, index) in listKarat" v-bind:key="data.id">
|
||||||
<td>{{ index + 1 }}</td>
|
<td>{{ index + 1 }}</td>
|
||||||
@@ -69,7 +71,7 @@ export default {
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
console.log(response);
|
// console.log("getKarat", response);
|
||||||
if (response.data.success == true) {
|
if (response.data.success == true) {
|
||||||
this.updatedTime = response.data.update_time;
|
this.updatedTime = response.data.update_time;
|
||||||
this.listKarat = response.data.karat;
|
this.listKarat = response.data.karat;
|
||||||
@@ -79,7 +81,6 @@ export default {
|
|||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
this.responseData = false;
|
this.responseData = false;
|
||||||
}
|
}
|
||||||
//
|
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
console.log(error);
|
console.log(error);
|
||||||
|
|||||||
@@ -1,10 +1,10 @@
|
|||||||
<template>
|
<template>
|
||||||
<Card>
|
<Card style="margin-bottom: 1em">
|
||||||
<template #title
|
<template #title
|
||||||
><div
|
><div
|
||||||
class="
|
class="
|
||||||
flex
|
flex
|
||||||
justify-content-between
|
justify-content-center
|
||||||
flex-wrap
|
flex-wrap
|
||||||
card-container
|
card-container
|
||||||
purple-container
|
purple-container
|
||||||
|
|||||||
@@ -14,14 +14,14 @@
|
|||||||
>
|
>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr class="table-light">
|
<tr class="table-light">
|
||||||
<td>Bil</td>
|
<th>Bil</th>
|
||||||
<td style="min-width: 200px">Cawangan</td>
|
<th style="min-width: 200px">Cawangan</th>
|
||||||
<td style="min-width: 120px">Tarikh</td>
|
<th style="min-width: 120px" class="text-center">Tarikh</th>
|
||||||
</tr>
|
</tr>
|
||||||
<tr v-for="(data, index) in response" :key="data.id">
|
<tr v-for="(data, index) in response" :key="data.id">
|
||||||
<td>{{ index + 1 }}</td>
|
<td>{{ index + 1 }}</td>
|
||||||
<td>{{ data.caw_name }}</td>
|
<td>{{ data.caw_name }}</td>
|
||||||
<td>{{ data.tarikh_lelong }}</td>
|
<td class="text-center">{{ data.tarikh_lelong }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
@@ -65,11 +65,10 @@ export default {
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
console.log(response);
|
// console.log("liveData", response);
|
||||||
if (response.data.success == true) {
|
if (response.data.success == true) {
|
||||||
this.responseData = true;
|
this.responseData = true;
|
||||||
this.response = response.data.lelong;
|
this.response = response.data.lelong;
|
||||||
// console.log(response.data);
|
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
} else {
|
} else {
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<Card style="margin-bottom: 1em">
|
<Card style="margin-bottom: 1em">
|
||||||
<template #title>
|
<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>
|
<div class="font-semibold">Lelongan Hari Ini : <span>{{ date }}</span></div>
|
||||||
<Button
|
<Button
|
||||||
class="button-standard p-button-rounded p-button-outlined"
|
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 mm = String(today.getMonth() + 1).padStart(2, "0"); //January is 0!
|
||||||
var yyyy = today.getFullYear();
|
var yyyy = today.getFullYear();
|
||||||
|
|
||||||
today = yyyy + "-" + mm + "-" + dd;
|
today = dd + "-" + mm + "-" + yyyy;
|
||||||
this.date = today;
|
this.date = today;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -12,16 +12,16 @@
|
|||||||
<table class="table table-sm table-bordered table-hover">
|
<table class="table table-sm table-bordered table-hover">
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr class="table-light">
|
<tr class="table-light">
|
||||||
<td>Bil</td>
|
<th>Bil</th>
|
||||||
<td style="min-width: 200px">Cawangan</td>
|
<th style="min-width: 200px">Cawangan</th>
|
||||||
<td style="min-width: 120px">Masa Mula</td>
|
<th style="min-width: 120px" class="text-center">Masa Mula</th>
|
||||||
<td style="min-width: 120px">Masa Tamat</td>
|
<th style="min-width: 120px" class="text-center">Masa Tamat</th>
|
||||||
</tr>
|
</tr>
|
||||||
<tr v-for="(item, index) in response" :key="item.id">
|
<tr v-for="(item, index) in response" :key="item.id">
|
||||||
<td>{{ index + 1 }}</td>
|
<td>{{ index + 1 }}</td>
|
||||||
<td>{{ item.caw_name }}</td>
|
<td>{{ item.caw_name }}</td>
|
||||||
<td>{{ item.masamula_lelong }}</td>
|
<td class="text-center">{{ item.masamula_lelong }}</td>
|
||||||
<td>{{ item.masatamat_lelong }}</td>
|
<td class="text-center">{{ item.masatamat_lelong }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
@@ -70,6 +70,7 @@ export default {
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
|
console.log("liveData", response);
|
||||||
if (response.data.success == true) {
|
if (response.data.success == true) {
|
||||||
this.responseData = true;
|
this.responseData = true;
|
||||||
this.response = response.data.lelong;
|
this.response = response.data.lelong;
|
||||||
@@ -80,7 +81,6 @@ export default {
|
|||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
} else {
|
} else {
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
console.log(response.data.success);
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
|
|||||||
@@ -2,10 +2,12 @@
|
|||||||
<div v-if="isSuccess">
|
<div v-if="isSuccess">
|
||||||
<div v-if="notPay">
|
<div v-if="notPay">
|
||||||
<Message severity="success" :closable="false">
|
<Message severity="success" :closable="false">
|
||||||
<div class="font-bold">Tahniah, bidaan anda menang!
|
<div class="font-bold">
|
||||||
<a class="ml-1 text-blue" @click="toResult()" href="#">
|
Tahniah, bidaan anda menang!
|
||||||
<span class="underline">Selesaikan pembayaran sekarang.</span>
|
<a class="ml-1 text-blue" @click="toResult()" href="#">
|
||||||
</a></div>
|
<span class="underline">Selesaikan pembayaran sekarang.</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</Message>
|
</Message>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -43,7 +45,7 @@ export default {
|
|||||||
|
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
console.log(response);
|
// console.log("getLelong", response);
|
||||||
if (response.data.success === true) {
|
if (response.data.success === true) {
|
||||||
this.isSuccess = true;
|
this.isSuccess = true;
|
||||||
if (response.data.lelong[0].status == null) {
|
if (response.data.lelong[0].status == null) {
|
||||||
|
|||||||
@@ -1,14 +1,12 @@
|
|||||||
<template>
|
<template>
|
||||||
<the-template>
|
<the-template>
|
||||||
<div class="grid">
|
<div class="grid">
|
||||||
<div class="col-12">
|
<div class="col-12 pt-2">
|
||||||
<result-notification></result-notification>
|
<result-notification></result-notification>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-12 lg:col-7">
|
<div class="col-12 lg:col-12">
|
||||||
<lelong-today></lelong-today>
|
<lelong-today></lelong-today>
|
||||||
<lelong-next></lelong-next>
|
<lelong-next></lelong-next>
|
||||||
</div>
|
|
||||||
<div class="col-12 lg:col-5">
|
|
||||||
<current-karat></current-karat>
|
<current-karat></current-karat>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -51,11 +51,11 @@
|
|||||||
</footer> -->
|
</footer> -->
|
||||||
<div class="layout-footer">
|
<div class="layout-footer">
|
||||||
<div class="layout-footer-left">
|
<div class="layout-footer-left">
|
||||||
<span>Sistem ArrahnBid</span>
|
<span>E-Rahn Lelong</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="layout-footer-right">
|
<div class="layout-footer-right">
|
||||||
<span> Permodalan Kelantan Berhad </span>
|
<span> Xtrabiz Sdn. Bhd. </span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -90,6 +90,7 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
color: rgb(0, 0, 0);
|
||||||
}
|
}
|
||||||
/* .layout-footer-right {
|
/* .layout-footer-right {
|
||||||
font-size: 1.5rem;
|
font-size: 1.5rem;
|
||||||
|
|||||||
@@ -3,24 +3,23 @@
|
|||||||
<Toast :breakpoints="{ '500px': { width: '100%', right: '0', left: '0' } }" />
|
<Toast :breakpoints="{ '500px': { width: '100%', right: '0', left: '0' } }" />
|
||||||
<div class="card sticky-top lg:flex hidden border-none">
|
<div class="card sticky-top lg:flex hidden border-none">
|
||||||
<div
|
<div
|
||||||
class="
|
class="flex justify-content-between px-3 md:px-6 h-3rem flex-wrap main-color"
|
||||||
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="flex align-items-center justify-content-center">
|
||||||
<div class="company-title" type="button" v-on:click="toHome()">
|
<!-- <div class="company-title" type="button" v-on:click="toHome()"> -->
|
||||||
<div class="logo-title">ArrahnBid</div>
|
<!-- <img class="logo-img mr-2" src="img/e-rahn-lelong.png" alt="arrahn-logo" /> -->
|
||||||
<img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" />
|
<Button
|
||||||
</div>
|
icon="pi pi-th-large"
|
||||||
|
@click="visibleLeft = true"
|
||||||
|
class="mr-2"
|
||||||
|
/>
|
||||||
|
<!-- <div class="logo-title">E-Rahn Lelong</div> -->
|
||||||
|
<!-- </div> -->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="flex align-items-center justify-content-center">
|
<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' }"
|
<router-link class="nav-button" v-bind:to="{ name: 'home' }"
|
||||||
>Utama</router-link
|
>Utama</router-link
|
||||||
>
|
>
|
||||||
@@ -39,7 +38,7 @@
|
|||||||
<router-link class="nav-button" v-bind:to="{ name: 'login' }"
|
<router-link class="nav-button" v-bind:to="{ name: 'login' }"
|
||||||
>Login</router-link
|
>Login</router-link
|
||||||
>
|
>
|
||||||
</nav>
|
</nav> -->
|
||||||
</div>
|
</div>
|
||||||
<div class="flex align-items-center justify-content-center">
|
<div class="flex align-items-center justify-content-center">
|
||||||
<div class="profile-title hidden lg:flex">
|
<div class="profile-title hidden lg:flex">
|
||||||
@@ -81,21 +80,19 @@
|
|||||||
<!-- Navbar for phone, tab screen size (width<992px) -->
|
<!-- Navbar for phone, tab screen size (width<992px) -->
|
||||||
<div class="card sticky-top lg:hidden md:flex border-none">
|
<div class="card sticky-top lg:hidden md:flex border-none">
|
||||||
<div
|
<div
|
||||||
class="
|
class="flex justify-content-between px-3 md:px-6 h-3rem flex-wrap main-color"
|
||||||
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="flex align-items-center justify-content-center">
|
||||||
<div class="company-title" type="button" v-on:click="toHome()">
|
<Button
|
||||||
<div class="logo-title">ArrahnBid</div>
|
icon="pi pi-th-large"
|
||||||
<img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" />
|
@click="visibleLeft = true"
|
||||||
</div>
|
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>
|
||||||
|
|
||||||
<div class="flex align-items-center justify-content-center">
|
<div class="flex align-items-center justify-content-center">
|
||||||
@@ -111,7 +108,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div> -->
|
</div> -->
|
||||||
</div>
|
</div>
|
||||||
<Sidebar v-model:visible="visibleRight" position="right">
|
<!-- <Sidebar v-model:visible="visibleRight" position="right">
|
||||||
<div class="grid">
|
<div class="grid">
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<div class="text-center">
|
<div class="text-center">
|
||||||
@@ -176,16 +173,89 @@
|
|||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
</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>
|
</Sidebar>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
username: localStorage.getItem("username"),
|
username: localStorage.getItem("username"),
|
||||||
visibleRight: false,
|
visibleLeft: false,
|
||||||
lelongOnline: "",
|
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>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
@@ -281,7 +369,7 @@ router-link:hover {
|
|||||||
} */
|
} */
|
||||||
|
|
||||||
.main-color {
|
.main-color {
|
||||||
background-color: #1e417b;
|
background-color: #008f96;
|
||||||
}
|
}
|
||||||
|
|
||||||
.border-none {
|
.border-none {
|
||||||
@@ -292,8 +380,7 @@ router-link:hover {
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
background-color: #1e417b;
|
background-color: #eeeeee;
|
||||||
|
|
||||||
height: 3.2rem;
|
height: 3.2rem;
|
||||||
padding: 0 6.4rem;
|
padding: 0 6.4rem;
|
||||||
}
|
}
|
||||||
@@ -307,15 +394,19 @@ router-link:hover {
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
color: #eaf0f9;
|
color: #212223;
|
||||||
font-size: 1rem;
|
font-size: 3rem;
|
||||||
font-weight: 700;
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo-img {
|
.logo-img {
|
||||||
height: 1.6rem;
|
height: 1.6rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* .main-nav {
|
||||||
|
background-color: #cb3d3d;
|
||||||
|
} */
|
||||||
|
|
||||||
.main-nav-list {
|
.main-nav-list {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -331,39 +422,43 @@ router-link:hover {
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
height: 2.4rem;
|
height: 2.4rem;
|
||||||
color: #82a4dc;
|
color: #2c2d2e;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
transition: all 0.3s;
|
transition: all 0.3s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.main-nav-link:hover {
|
.main-nav-link:hover {
|
||||||
color: #fff;
|
color:#fec234;
|
||||||
}
|
}
|
||||||
|
|
||||||
.main-nav-link-sidebar:hover {
|
.main-nav-link-sidebar:hover {
|
||||||
|
background: #fec234;
|
||||||
|
border-radius: 10px;
|
||||||
|
padding: 7px 20px;
|
||||||
color: #1e417b !important;
|
color: #1e417b !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav-button {
|
.nav-button {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
margin: 0 1.5rem;
|
margin: 0 1.5rem;
|
||||||
color: #82a4dc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-button:hover {
|
|
||||||
color: #eaf0f9;
|
color: #eaf0f9;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.nav-button:hover {
|
||||||
|
color: #fec234;
|
||||||
|
}
|
||||||
|
|
||||||
a.router-link-exact-active {
|
a.router-link-exact-active {
|
||||||
background: #d5e1f3;
|
background: #fec234;
|
||||||
color: #1e417b;
|
color: #000000;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
padding: 7px 20px;
|
padding: 7px 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.router-link-exact-active:hover {
|
a.router-link-exact-active:hover {
|
||||||
color: #132a4f;
|
background: #fec234;
|
||||||
|
color: #000000;
|
||||||
}
|
}
|
||||||
|
|
||||||
.profile-title {
|
.profile-title {
|
||||||
@@ -373,4 +468,4 @@ a.router-link-exact-active:hover {
|
|||||||
.arrow-logo {
|
.arrow-logo {
|
||||||
font-size: 0.5rem;
|
font-size: 0.5rem;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -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>
|
<template>
|
||||||
<div class="content-page">
|
<div class="content-page" style="background-color: #eeeeee;">
|
||||||
<div class="content">
|
<div class="content" style="background-color: #eeeeee;">
|
||||||
<the-header />
|
<the-header />
|
||||||
<div class="container pt-5">
|
<br>
|
||||||
|
<div class="container pt-2" style="background-color: #FAE79A;">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,23 +1,56 @@
|
|||||||
<template>
|
<template>
|
||||||
<Image :src="dataUrl" alt="Gambar Marhun" width="250" preview>
|
<div v-if="isLoading" class="spinner-border" role="status">
|
||||||
<template #indicator> Preview Content </template>
|
<span class="visually-hidden">Loading...</span>
|
||||||
|
</div>
|
||||||
|
<Image v-else :src="dataUrl" alt="Gambar Marhun" width="250" preview>
|
||||||
|
<template #indicator> Lihat Gambar </template>
|
||||||
</Image>
|
</Image>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import axios from "axios";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
props: {
|
props: {
|
||||||
gambarMain: "",
|
norujukan: "",
|
||||||
|
filemarhun_id: "",
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
image: "",
|
image: "",
|
||||||
|
isLoading: false,
|
||||||
|
componentKey: 0
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
dataUrl() {
|
dataUrl() {
|
||||||
this.image = this.gambarMain.filename;
|
return "data:image/png;base64, " + this.image;
|
||||||
return "data:image/jpeg;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-else class="fadein animation-duration-400">
|
||||||
<div v-if="this.status">
|
<div v-if="this.status">
|
||||||
<!-- <div class="text-center">
|
<div class="text-center">
|
||||||
<InlineMessage class="m-1" severity="info">
|
<Message severity="info" :closable="false"
|
||||||
Jumlah Surat: {{ numberSag }}
|
>Jumlah Surat Lelongan: {{ numberSag }}
|
||||||
</InlineMessage>
|
</Message>
|
||||||
<InlineMessage class="m-1" severity="info">
|
</div>
|
||||||
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="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<div
|
<div
|
||||||
v-for="sag in sags"
|
v-for="sag in sags"
|
||||||
:key="sag.id"
|
:key="sag.id"
|
||||||
class="col-10 sm:col-8 md:col-6 lg:col-4"
|
class="col-10 sm:col-8 md:col-6 lg:col-4"
|
||||||
>
|
>
|
||||||
<Card>
|
<Card class="style-card">
|
||||||
<template #content>
|
<template #content>
|
||||||
<div class="overflow-x-auto">
|
<div class="overflow-x-auto">
|
||||||
<div class="flex justify-content-center">
|
<div class="style-photo-div">
|
||||||
<div
|
<!-- <div
|
||||||
class="flex align-items-center"
|
class=""
|
||||||
style="
|
style="min-height: 180px; min-width: 255px"
|
||||||
border: 1px solid rgba(0, 0, 0, 0.125);
|
> -->
|
||||||
height: 250px;
|
<!-- <img :src="dataUrl" class="product-image" /> -->
|
||||||
width: 250px;
|
<item-master-image
|
||||||
min-height: 250px;
|
v-if="sag.filemarhun"
|
||||||
min-width: 250px;
|
v-bind:norujukan="sag.norujukan"
|
||||||
"
|
v-bind:filemarhun_id="sag.filemarhun[0].id"
|
||||||
>
|
></item-master-image>
|
||||||
<!-- <img :src="dataUrl" class="product-image" /> -->
|
<p v-else style="text-align: center; width: 100%">
|
||||||
<item-master-image
|
Image Unavailable
|
||||||
v-if="sag.filemarhun"
|
</p>
|
||||||
v-bind:gambarMain="sag.filemarhun[0]"
|
<!-- </div> -->
|
||||||
></item-master-image>
|
|
||||||
<p v-else style="text-align: center; width: 100%">
|
|
||||||
Image Unavailable
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="">
|
<div class="">
|
||||||
<div class="product_details">
|
<div class="product_details">
|
||||||
@@ -92,23 +81,39 @@
|
|||||||
</div>
|
</div>
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<Message severity="info" :closable="false"
|
<div
|
||||||
>Sila isi ruangan pilih cawangan di atas.
|
class="
|
||||||
</Message>
|
flex
|
||||||
<div class="grid justify-content-center">
|
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="col-12 p-3 lg:col-4">
|
||||||
<div class="card p-2">
|
<div class="card p-2">
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<div class="custom-skeleton">
|
<div class="custom-skeleton">
|
||||||
<div class="flex mb-3"></div>
|
<div class="flex mb-3"></div>
|
||||||
<Skeleton width="100%" height="150px"></Skeleton>
|
<Skeleton width="100%" height="1px"></Skeleton>
|
||||||
<div class="flex justify-content-center mt-3">
|
<div class="flex justify-content-center">
|
||||||
<Skeleton width="10rem"></Skeleton>
|
<Skeleton width="10rem"></Skeleton>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex justify-content-center mt-1">
|
<div class="flex justify-content-center">
|
||||||
<Skeleton width="10rem"></Skeleton>
|
<Skeleton width="10rem"></Skeleton>
|
||||||
</div>
|
</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>
|
||||||
<Skeleton width="4rem" height="2rem"></Skeleton>
|
<Skeleton width="4rem" height="2rem"></Skeleton>
|
||||||
</div>
|
</div>
|
||||||
@@ -121,14 +126,14 @@
|
|||||||
<div class="field">
|
<div class="field">
|
||||||
<div class="custom-skeleton">
|
<div class="custom-skeleton">
|
||||||
<div class="flex mb-3"></div>
|
<div class="flex mb-3"></div>
|
||||||
<Skeleton width="100%" height="150px"></Skeleton>
|
<Skeleton width="100%" height="1px"></Skeleton>
|
||||||
<div class="flex justify-content-center mt-3">
|
<div class="flex justify-content-center">
|
||||||
<Skeleton width="10rem"></Skeleton>
|
<Skeleton width="10rem"></Skeleton>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex justify-content-center mt-1">
|
<div class="flex justify-content-center">
|
||||||
<Skeleton width="10rem"></Skeleton>
|
<Skeleton width="10rem"></Skeleton>
|
||||||
</div>
|
</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>
|
||||||
<Skeleton width="4rem" height="2rem"></Skeleton>
|
<Skeleton width="4rem" height="2rem"></Skeleton>
|
||||||
</div>
|
</div>
|
||||||
@@ -141,14 +146,14 @@
|
|||||||
<div class="field">
|
<div class="field">
|
||||||
<div class="custom-skeleton">
|
<div class="custom-skeleton">
|
||||||
<div class="flex mb-3"></div>
|
<div class="flex mb-3"></div>
|
||||||
<Skeleton width="100%" height="150px"></Skeleton>
|
<Skeleton width="100%" height="1px"></Skeleton>
|
||||||
<div class="flex justify-content-center mt-3">
|
<div class="flex justify-content-center">
|
||||||
<Skeleton width="10rem"></Skeleton>
|
<Skeleton width="10rem"></Skeleton>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex justify-content-center mt-1">
|
<div class="flex justify-content-center">
|
||||||
<Skeleton width="10rem"></Skeleton>
|
<Skeleton width="10rem"></Skeleton>
|
||||||
</div>
|
</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>
|
||||||
<Skeleton width="4rem" height="2rem"></Skeleton>
|
<Skeleton width="4rem" height="2rem"></Skeleton>
|
||||||
</div>
|
</div>
|
||||||
@@ -161,6 +166,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<ScrollTop :threshold="200"/>
|
||||||
<!-- modal marhun -->
|
<!-- modal marhun -->
|
||||||
<div
|
<div
|
||||||
class="modal fade"
|
class="modal fade"
|
||||||
@@ -188,12 +194,18 @@
|
|||||||
|
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
<div class="grid">
|
<div class="grid">
|
||||||
<div class="col-12 lg:col-6" style="">
|
<div class="col-12 lg:col-6 style-photo-div p-2">
|
||||||
<item-multiple-image
|
<!-- <item-multiple-image
|
||||||
v-if="filemarhun"
|
v-if="filemarhun"
|
||||||
v-bind:gambarMultiple="filemarhun"
|
v-bind:gambarMultiple="filemarhun"
|
||||||
v-bind:key="reloadImageComponent"
|
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
|
<p
|
||||||
v-else
|
v-else
|
||||||
style="
|
style="
|
||||||
@@ -201,7 +213,6 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
border: 1px solid rgba(0, 0, 0, 0.125);
|
|
||||||
min-width: 300px;
|
min-width: 300px;
|
||||||
max-width: 300px;
|
max-width: 300px;
|
||||||
"
|
"
|
||||||
@@ -214,11 +225,11 @@
|
|||||||
<table class="table table-bordered">
|
<table class="table table-bordered">
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr class="table-light">
|
<tr class="table-light">
|
||||||
<td>Bil</td>
|
<th>Bil</th>
|
||||||
<td style="min-width: 115px">Jenis Marhun</td>
|
<th style="min-width: 115px">Jenis Marhun</th>
|
||||||
<td style="min-width: 42px">Karat</td>
|
<th style="min-width: 42px">Karat</th>
|
||||||
<td style="min-width: 42px">Berat</td>
|
<th style="min-width: 42px">Berat</th>
|
||||||
<td style="min-width: 102px">Harga Asas</td>
|
<th style="min-width: 102px">Harga Asas</th>
|
||||||
</tr>
|
</tr>
|
||||||
<tr v-for="(marhun, index) in marhuns" :key="marhun.id">
|
<tr v-for="(marhun, index) in marhuns" :key="marhun.id">
|
||||||
<td>{{ index + 1 }}</td>
|
<td>{{ index + 1 }}</td>
|
||||||
@@ -477,11 +488,13 @@ import { mapGetters, mapActions } from "vuex";
|
|||||||
import { read } from "@popperjs/core";
|
import { read } from "@popperjs/core";
|
||||||
import ItemMasterImage from "./ItemMasterImage.vue";
|
import ItemMasterImage from "./ItemMasterImage.vue";
|
||||||
import ItemMultipleImage from "./ItemMultipleImage.vue";
|
import ItemMultipleImage from "./ItemMultipleImage.vue";
|
||||||
|
import ItemMasterImageModal from "./ItemMasterImageModal.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
"item-master-image": ItemMasterImage,
|
"item-master-image": ItemMasterImage,
|
||||||
"item-multiple-image": ItemMultipleImage,
|
"item-multiple-image": ItemMultipleImage,
|
||||||
|
"item-master-image-modal": ItemMasterImageModal,
|
||||||
},
|
},
|
||||||
emits: ["reloadComponent"],
|
emits: ["reloadComponent"],
|
||||||
props: {
|
props: {
|
||||||
@@ -551,7 +564,7 @@ export default {
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
console.log(response);
|
// console.log("liveData", response);
|
||||||
if (response.data.success == true) {
|
if (response.data.success == true) {
|
||||||
// let readImage = response.data.message.lelongbid[7].filemarhun[0].filename;
|
// let readImage = response.data.message.lelongbid[7].filemarhun[0].filename;
|
||||||
// this.image = readImage;
|
// this.image = readImage;
|
||||||
@@ -666,4 +679,16 @@ export default {
|
|||||||
.disabled-bg {
|
.disabled-bg {
|
||||||
background-color: rgb(233, 236, 239);
|
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>
|
</style>
|
||||||
@@ -35,14 +35,6 @@
|
|||||||
<input type="hidden" />
|
<input type="hidden" />
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
<!-- <h6>
|
|
||||||
<button
|
|
||||||
class="badge m-2 btn-secondary"
|
|
||||||
@click="toggleReloadComponent"
|
|
||||||
>
|
|
||||||
Reload <i class="bi bi-arrow-down"></i>
|
|
||||||
</button>
|
|
||||||
</h6> -->
|
|
||||||
<list-item
|
<list-item
|
||||||
v-bind:key="componentKey"
|
v-bind:key="componentKey"
|
||||||
v-bind:selectedCawangan="selectCawangan"
|
v-bind:selectedCawangan="selectCawangan"
|
||||||
@@ -70,7 +62,7 @@
|
|||||||
<span class="text-400"
|
<span class="text-400"
|
||||||
>Sila rujuk halaman
|
>Sila rujuk halaman
|
||||||
<router-link v-bind:to="{ name: 'home' }">Utama</router-link>
|
<router-link v-bind:to="{ name: 'home' }">Utama</router-link>
|
||||||
untuk jadual lelong.</span
|
untuk jadual lelongan.</span
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -119,7 +111,7 @@ export default {
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
console.log(response);
|
// console.log('getIdCawangan', response);
|
||||||
if (response.data.success == true) {
|
if (response.data.success == true) {
|
||||||
this.isSuccess = true;
|
this.isSuccess = true;
|
||||||
this.listCawangan = response.data.lelong;
|
this.listCawangan = response.data.lelong;
|
||||||
|
|||||||
@@ -81,18 +81,32 @@
|
|||||||
<div class="overflow-x-auto">
|
<div class="overflow-x-auto">
|
||||||
<table class="table text-center table-bordered">
|
<table class="table text-center table-bordered">
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr class="table-light">
|
<tr>
|
||||||
<td style="min-width: 240px">Cawangan</td>
|
<td>Cawangan</td>
|
||||||
<td style="min-width: 120px">Harga Bida</td>
|
<td>{{ cawanganPilihan }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<th>{{ cawanganPilihan }}</th>
|
<td>Harga Bida</td>
|
||||||
<th>
|
<td style="min-width: 150px">
|
||||||
RM{{
|
RM{{
|
||||||
hargaBidaanPilihan
|
hargaBidaanPilihan
|
||||||
?.toString()
|
?.toString()
|
||||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
.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>
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
@@ -106,66 +120,67 @@
|
|||||||
@click="closeModal()"
|
@click="closeModal()"
|
||||||
class="p-button-text"
|
class="p-button-text"
|
||||||
/>
|
/>
|
||||||
<Button
|
<!-- <Button
|
||||||
label="Ya"
|
label="Ya"
|
||||||
icon="pi pi-check"
|
icon="pi pi-check"
|
||||||
iconPos="right"
|
iconPos="right"
|
||||||
:loading="isLoading"
|
:loading="isLoading"
|
||||||
@click="doPayment()"
|
@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>
|
</template>
|
||||||
</Dialog>
|
</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>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { integer } from "@vuelidate/validators";
|
import { integer } from "@vuelidate/validators";
|
||||||
import SelectId from "./SelectId.vue";
|
import SelectId from "./SelectId.vue";
|
||||||
|
import TermsAndConditionsDetails from "../authentication/TermsAndConditionsDetails.vue";
|
||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
"select-id": SelectId,
|
"select-id": SelectId,
|
||||||
|
"terms-and-conditions-details": TermsAndConditionsDetails,
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
namaCawangan: "",
|
namaCawangan: "",
|
||||||
@@ -179,9 +194,12 @@ export default {
|
|||||||
selectCawangan: this.namaCawangan,
|
selectCawangan: this.namaCawangan,
|
||||||
selectRadio: "",
|
selectRadio: "",
|
||||||
isDisplay: false,
|
isDisplay: false,
|
||||||
|
isDisplayTNC: false,
|
||||||
isLoading: false,
|
isLoading: false,
|
||||||
cawanganPilihan: "",
|
cawanganPilihan: "",
|
||||||
hargaBidaanPilihan: "",
|
hargaBidaanPilihan: "",
|
||||||
|
hargaBidaanPilihanTambahFi: "",
|
||||||
|
lelongDetails: "",
|
||||||
form: {
|
form: {
|
||||||
email: localStorage.getItem("email"),
|
email: localStorage.getItem("email"),
|
||||||
notel: localStorage.getItem("notelbimbit"),
|
notel: localStorage.getItem("notelbimbit"),
|
||||||
@@ -223,11 +241,12 @@ export default {
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
console.log(response);
|
// console.log("getInvoice", response);
|
||||||
if (response.data.success == true) {
|
if (response.data.success == true) {
|
||||||
this.form.invoice_id = response.data.invoice.id;
|
this.form.invoice_id = response.data.invoice.id;
|
||||||
this.form.invoice_no = response.data.invoice.invoice_no;
|
this.form.invoice_no = response.data.invoice.invoice_no;
|
||||||
this.form.lelong_id = this.lelongIdProps;
|
this.form.lelong_id = this.lelongIdProps;
|
||||||
|
this.lelongDetails = response.data.lelong;
|
||||||
} else if (response.data.success == false) {
|
} else if (response.data.success == false) {
|
||||||
alert("No Invoice Id");
|
alert("No Invoice Id");
|
||||||
}
|
}
|
||||||
@@ -238,21 +257,50 @@ export default {
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
openModal(value) {
|
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.isDisplay = true;
|
||||||
this.cawanganPilihan = value.cawangan;
|
this.cawanganPilihan = value.cawangan;
|
||||||
this.hargaBidaanPilihan = value.total_hargabida;
|
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, ""));
|
this.form.total = parseFloat(value.total_hargabida.replace(/,/g, ""));
|
||||||
let convertData = JSON.parse(JSON.stringify(value.sag));
|
let convertData = JSON.parse(JSON.stringify(value.sag));
|
||||||
this.form.sag = convertData;
|
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() {
|
closeModal() {
|
||||||
this.isDisplay = false;
|
this.isDisplay = false;
|
||||||
this.form.total = "";
|
this.form.total = "";
|
||||||
this.form.sag = "";
|
this.form.sag = "";
|
||||||
},
|
},
|
||||||
|
openModalTNC() {
|
||||||
|
this.isDisplay = false;
|
||||||
|
this.isDisplayTNC = true;
|
||||||
|
},
|
||||||
|
closeModalTNC() {
|
||||||
|
this.isDisplayTNC = false;
|
||||||
|
this.form.total = "";
|
||||||
|
this.form.sag = "";
|
||||||
|
},
|
||||||
clickRadio(value) {
|
clickRadio(value) {
|
||||||
console.log(value);
|
// console.log(value);
|
||||||
this.selectRadio = value;
|
this.selectRadio = value;
|
||||||
},
|
},
|
||||||
clickCancelButton() {
|
clickCancelButton() {
|
||||||
|
|||||||
@@ -120,11 +120,11 @@ export default {
|
|||||||
}
|
}
|
||||||
)
|
)
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
|
// console.log("liveData", response);
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
if (response.data.success == true) {
|
if (response.data.success == true) {
|
||||||
this.isSuccess = true;
|
this.isSuccess = true;
|
||||||
this.lists = response.data.data;
|
this.lists = response.data.data;
|
||||||
console.log(this.lists);
|
|
||||||
this.tarikhLelong = response.data.tarikh_lelong;
|
this.tarikhLelong = response.data.tarikh_lelong;
|
||||||
} else {
|
} 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">
|
<div class="col-12 lg:col-6 text-start value-form">
|
||||||
{{ data.notelbimbit }}
|
{{ data.notelbimbit }}
|
||||||
</div>
|
</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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,6 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<the-template>
|
<the-template>
|
||||||
<!-- <base-card> -->
|
|
||||||
<div
|
<div
|
||||||
v-if="loading"
|
v-if="loading"
|
||||||
style="min-height: 70vh; display: grid; place-items: center"
|
style="min-height: 70vh; display: grid; place-items: center"
|
||||||
@@ -28,17 +27,17 @@
|
|||||||
class="font-normal"
|
class="font-normal"
|
||||||
style="font-size: 1.5rem; font-weight: 700"
|
style="font-size: 1.5rem; font-weight: 700"
|
||||||
>
|
>
|
||||||
Keputusan Tarikh Lelong: {{ tarikhLelong }}
|
Keputusan Tarikh Lelongan: {{ tarikhLelong }}
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template #end>
|
<template #end>
|
||||||
<Button
|
<!-- <Button
|
||||||
label="Resit Bayaran"
|
label="Resit Bayaran"
|
||||||
icon="pi pi-list"
|
icon="pi pi-list"
|
||||||
iconPos="right"
|
iconPos="right"
|
||||||
class="p-button-sm p-button-outlined mr-2"
|
class="p-button-sm p-button-outlined mr-2"
|
||||||
/>
|
/> -->
|
||||||
<Button
|
<Button
|
||||||
label="Pembayaran"
|
label="Pembayaran"
|
||||||
icon="pi pi-money-bill"
|
icon="pi pi-money-bill"
|
||||||
@@ -56,9 +55,28 @@
|
|||||||
<Accordion :multiple="true">
|
<Accordion :multiple="true">
|
||||||
<AccordionTab v-for="list in lists" v-bind:key="list">
|
<AccordionTab v-for="list in lists" v-bind:key="list">
|
||||||
<template #header>
|
<template #header>
|
||||||
<span>{{ list.cawangan }}</span>
|
<div class="flex justify-content-between w-100">
|
||||||
<!-- <span class="ml-2">Jumlah:RMXXXX</span> -->
|
<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>
|
</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">
|
<div class="overflow-x-auto">
|
||||||
<table class="table text-center table-bordered">
|
<table class="table text-center table-bordered">
|
||||||
<tbody>
|
<tbody>
|
||||||
@@ -118,124 +136,22 @@
|
|||||||
></Tag>
|
></Tag>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</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>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
</AccordionTab>
|
</AccordionTab>
|
||||||
</Accordion>
|
</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>
|
</template>
|
||||||
</Card>
|
</Card>
|
||||||
<div
|
<div
|
||||||
@@ -246,12 +162,9 @@
|
|||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
data-bs-backdrop="static"
|
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-content">
|
||||||
<div class="modal-header">
|
<div class="modal-header">
|
||||||
<!-- <h5 class="modal-title" id="marhunModalLabel">
|
|
||||||
{{ theData.norujukan }}
|
|
||||||
</h5> -->
|
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
class="btn-close"
|
class="btn-close"
|
||||||
@@ -260,35 +173,92 @@
|
|||||||
></button>
|
></button>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
<table class="table table-bordered">
|
<div class="grid">
|
||||||
<thead>
|
<div
|
||||||
<tr>
|
class="col-12 lg:col-6"
|
||||||
<th scope="col">Bil</th>
|
style="
|
||||||
<th scope="col">Jenis</th>
|
display: flex;
|
||||||
<th scope="col">Karat</th>
|
justify-content: center;
|
||||||
<th scope="col">Berat</th>
|
align-items: center;
|
||||||
<th scope="col">Nota</th>
|
min-height: 300px;
|
||||||
<th scope="col">Harga Asas</th>
|
min-width: 300px;
|
||||||
</tr>
|
max-height: 600px;
|
||||||
</thead>
|
max-width: 600px;
|
||||||
<!-- <tbody>
|
"
|
||||||
<tr
|
|
||||||
v-for="(marhun, index) in theData.lelongbidmarhun"
|
|
||||||
v-bind:key="marhun"
|
|
||||||
>
|
>
|
||||||
<td>{{ index + 1 }}</td>
|
<item-master-image-modal
|
||||||
<td>{{ marhun.marhun }}</td>
|
v-if="theData.filemarhun"
|
||||||
<td>{{ marhun.karat }}</td>
|
v-bind:key="reloadImageComponent"
|
||||||
<td>{{ marhun.berat }}g</td>
|
v-bind:norujukan="theData.norujukan"
|
||||||
<td>{{ marhun.nota }}</td>
|
v-bind:filemarhun_id="theData.filemarhun[0].id"
|
||||||
<td>RM{{ marhun.hargaasas }}</td>
|
></item-master-image-modal>
|
||||||
</tr>
|
<p v-else style="text-align: center; width: 100%">
|
||||||
<tr style="text-transform: uppercase">
|
Image Unavailable
|
||||||
<th colspan="5">Jumlah</th>
|
</p>
|
||||||
<th>RM{{ theData.hargaasas }}</th>
|
</div>
|
||||||
</tr>
|
<div class="col-12 text-center lg:col-6">
|
||||||
</tbody> -->
|
<div class="overflow-x-auto">
|
||||||
</table>
|
<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>
|
||||||
|
</tr>
|
||||||
|
<tr
|
||||||
|
v-for="(data, index) in theData.lelongbidmarhun"
|
||||||
|
v-bind:key="data"
|
||||||
|
>
|
||||||
|
<td>{{ index + 1 }}</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">
|
||||||
|
<td colspan="3">Jumlah</td>
|
||||||
|
<td>{{ theData.berat }}g</td>
|
||||||
|
<td>
|
||||||
|
RM{{
|
||||||
|
theData.hargaasas
|
||||||
|
?.toString()
|
||||||
|
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||||
|
}}
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</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>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button
|
<button
|
||||||
@@ -332,15 +302,65 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</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>
|
</div>
|
||||||
<!-- </base-card> -->
|
|
||||||
</the-template>
|
</the-template>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
// import jsPDF from "jspdf";
|
||||||
|
// import "jspdf-autotable";
|
||||||
|
// import html2canvas from "html2canvas";
|
||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
|
import ItemMasterImageModal from "../list/ItemMasterImageModal.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
components: {
|
||||||
|
"item-master-image-modal": ItemMasterImageModal,
|
||||||
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
lists: [],
|
lists: [],
|
||||||
@@ -350,10 +370,14 @@ export default {
|
|||||||
statusPayment: "",
|
statusPayment: "",
|
||||||
disabled: 0,
|
disabled: 0,
|
||||||
isSuccess: false,
|
isSuccess: false,
|
||||||
|
theData: "",
|
||||||
|
reloadImageComponent: "",
|
||||||
|
isDisplay: false,
|
||||||
|
suratHak: "",
|
||||||
|
isSuccessHak: false,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
console.log(this.$route.params.lelongId);
|
|
||||||
this.lelongId = this.$route.params.lelongId;
|
this.lelongId = this.$route.params.lelongId;
|
||||||
this.statusPayment = this.$route.params.statusPayment;
|
this.statusPayment = this.$route.params.statusPayment;
|
||||||
},
|
},
|
||||||
@@ -372,23 +396,16 @@ export default {
|
|||||||
liveData() {
|
liveData() {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
axios
|
axios
|
||||||
.get(
|
.get("/bayar/" + localStorage.getItem("id") + "/" + this.lelongId, {
|
||||||
"/bayar/" +
|
headers: {
|
||||||
localStorage.getItem("id") +
|
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||||
// "/1",
|
},
|
||||||
"/" +
|
})
|
||||||
this.lelongId,
|
|
||||||
{
|
|
||||||
headers: {
|
|
||||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
|
||||||
},
|
|
||||||
}
|
|
||||||
)
|
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
|
// console.log("liveData", response);
|
||||||
if (response.data.success == true) {
|
if (response.data.success == true) {
|
||||||
this.isSuccess = true;
|
this.isSuccess = true;
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
console.log(response);
|
|
||||||
this.lists = response.data.data;
|
this.lists = response.data.data;
|
||||||
this.tarikhLelong = response.data.tarikh_lelong;
|
this.tarikhLelong = response.data.tarikh_lelong;
|
||||||
} else {
|
} else {
|
||||||
@@ -407,7 +424,52 @@ export default {
|
|||||||
this.$router.push({ name: "result" });
|
this.$router.push({ name: "result" });
|
||||||
},
|
},
|
||||||
marhunModal(value) {
|
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 {
|
.container-height {
|
||||||
min-height: 70vh;
|
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>
|
</style>
|
||||||
@@ -26,7 +26,7 @@
|
|||||||
<td style="min-width: 115px">Tarikh</td>
|
<td style="min-width: 115px">Tarikh</td>
|
||||||
<td style="min-width: 100px">Jumlah</td>
|
<td style="min-width: 100px">Jumlah</td>
|
||||||
<td style="min-width: 145px">Status Bayaran</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>
|
||||||
<tr v-for="(data, index) in lelong" v-bind:key="data">
|
<tr v-for="(data, index) in lelong" v-bind:key="data">
|
||||||
<td>{{ index + 1 }}</td>
|
<td>{{ index + 1 }}</td>
|
||||||
@@ -58,11 +58,11 @@
|
|||||||
severity="danger"
|
severity="danger"
|
||||||
></Tag>
|
></Tag>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<!-- <td>
|
||||||
<span class="text-primary underline cursor-pointer"
|
<span class="text-primary underline cursor-pointer"
|
||||||
>Muat Turun <i class="pi pi-cloud-download"></i>
|
>Muat Turun <i class="pi pi-cloud-download"></i>
|
||||||
</span>
|
</span>
|
||||||
</td>
|
</td> -->
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
@@ -85,7 +85,7 @@
|
|||||||
<span class="text-400"
|
<span class="text-400"
|
||||||
>Sila rujuk halaman
|
>Sila rujuk halaman
|
||||||
<router-link v-bind:to="{ name: 'home' }">Utama</router-link>
|
<router-link v-bind:to="{ name: 'home' }">Utama</router-link>
|
||||||
untuk jadual lelong</span
|
untuk jadual lelongan.</span
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -127,7 +127,7 @@ export default {
|
|||||||
|
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
console.log(response);
|
// console.log("getLelong", response);
|
||||||
if (response.data.success === true) {
|
if (response.data.success === true) {
|
||||||
this.isSuccess = true;
|
this.isSuccess = true;
|
||||||
this.lelong = response.data.lelong;
|
this.lelong = response.data.lelong;
|
||||||
|
|||||||
@@ -43,6 +43,10 @@ import TabPanel from 'primevue/tabpanel';
|
|||||||
import Tag from 'primevue/tag';
|
import Tag from 'primevue/tag';
|
||||||
import Image from 'primevue/image';
|
import Image from 'primevue/image';
|
||||||
import Galleria from 'primevue/galleria';
|
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 'maz-ui/css/main.css'
|
||||||
import MazPhoneNumberInput from 'maz-ui/components/MazPhoneNumberInput'
|
import MazPhoneNumberInput from 'maz-ui/components/MazPhoneNumberInput'
|
||||||
@@ -84,6 +88,11 @@ app.component('TabPanel', TabPanel);
|
|||||||
app.component('Tag', Tag);
|
app.component('Tag', Tag);
|
||||||
app.component('Image', Image);
|
app.component('Image', Image);
|
||||||
app.component('Galleria', Galleria);
|
app.component('Galleria', Galleria);
|
||||||
|
app.directive('badge', BadgeDirective);
|
||||||
|
app.component('Textarea', Textarea);
|
||||||
|
app.directive('tooltip', Tooltip);
|
||||||
|
app.component('ScrollTop', ScrollTop);
|
||||||
|
|
||||||
|
|
||||||
app.component('MazPhoneNumberInput', MazPhoneNumberInput)
|
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 ResultDetail from "../components/result/ResultDetail.vue";
|
||||||
import ResultReceipt from "../components/result/ResultReceipt.vue"
|
import ResultReceipt from "../components/result/ResultReceipt.vue"
|
||||||
import ThePay from "../components/pay/ThePay.vue";
|
import ThePay from "../components/pay/ThePay.vue";
|
||||||
|
import ThePolicy from "../components/policy/ThePolicy.vue"
|
||||||
|
|
||||||
import {
|
import {
|
||||||
createRouter,
|
createRouter,
|
||||||
@@ -157,6 +158,11 @@ const routes = [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/",
|
path: "/",
|
||||||
|
name: "login",
|
||||||
|
component: TheLogin,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: "/home",
|
||||||
name: "home",
|
name: "home",
|
||||||
component: TheHome,
|
component: TheHome,
|
||||||
},
|
},
|
||||||
@@ -191,7 +197,7 @@ const routes = [
|
|||||||
// meta: { requiresAuth: true }
|
// meta: { requiresAuth: true }
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/result/detail",
|
path: "/result-detail",
|
||||||
name: "detail",
|
name: "detail",
|
||||||
component: ResultDetail,
|
component: ResultDetail,
|
||||||
// meta: { requiresAuth: true }
|
// meta: { requiresAuth: true }
|
||||||
@@ -207,6 +213,11 @@ const routes = [
|
|||||||
name: "pay",
|
name: "pay",
|
||||||
component: ThePay,
|
component: ThePay,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: "/policy",
|
||||||
|
name: "policy",
|
||||||
|
component: ThePolicy,
|
||||||
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
const router = createRouter({
|
const router = createRouter({
|
||||||
|
|||||||
Reference in New Issue
Block a user