fix cart
This commit is contained in:
Amir
@@ -1,121 +0,0 @@
|
||||
<template>
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top">
|
||||
<div class="container-fluid">
|
||||
<router-link class="navbar-brand text-primary fw-bold" v-bind:to="{name: 'home'}">Sistem Lelong</router-link>
|
||||
<button
|
||||
class="navbar-toggler"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#navbarSupportedContent"
|
||||
aria-controls="navbarSupportedContent"
|
||||
aria-expanded="false"
|
||||
aria-label="Toggle navigation"
|
||||
>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
|
||||
<li class="nav-item">
|
||||
<router-link class="nav-link" v-bind:to="{name: 'home'}">Home</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<router-link class="nav-link" to="/list">Senarai</router-link>
|
||||
</li>
|
||||
<!-- <li class="nav-item">
|
||||
<router-link class="nav-link" to="/cart">Cart</router-link>
|
||||
</li> -->
|
||||
<li class="nav-item">
|
||||
<router-link class="nav-link" v-bind:to="{name: 'bid-record'}">Rekod Bidaan</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<router-link class="nav-link" v-bind:to="{name: 'result'}">Keputusan</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<router-link class="nav-link" to="/profile">Profil</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<router-link class="nav-link" to="/test">Test</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<router-link class="nav-link" to="/login">Login</router-link>
|
||||
</li>
|
||||
<router-view />
|
||||
</ul>
|
||||
|
||||
<router-link class="btn btn-primary me-5" to="/cart"
|
||||
>Troli <i class="bi bi-cart3"></i
|
||||
>
|
||||
<!-- <span class="span_cart">{{
|
||||
this.allCarts.length
|
||||
}}</span> -->
|
||||
</router-link
|
||||
>
|
||||
<button
|
||||
class="btn btn-outline-secondary"
|
||||
type="submit"
|
||||
@click="doLogout"
|
||||
>
|
||||
Log Keluar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import { mapGetters, mapActions } from "vuex";
|
||||
|
||||
export default {
|
||||
name: "Navbar",
|
||||
// props: {
|
||||
// cart: Number,
|
||||
// },
|
||||
data() {
|
||||
return {
|
||||
// cart: localStorage.getItem("cart"),
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
doLogout() {
|
||||
axios
|
||||
.post(
|
||||
"/user/logout",
|
||||
{},
|
||||
{
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
}
|
||||
)
|
||||
.then((response) => {
|
||||
// localStorage.removeItem("token");
|
||||
// localStorage.removeItem("id");
|
||||
// localStorage.removeItem("nokp");
|
||||
localStorage.clear();
|
||||
this.$router.push("/login");
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
...mapActions(["fetchCarts"]),
|
||||
...mapActions(["fetchLelongId"]),
|
||||
|
||||
},
|
||||
computed: { ...mapGetters(["allCarts"]), ...mapGetters(["idLelong"]), },
|
||||
created() {
|
||||
this.fetchCarts();
|
||||
this.fetchLelongId();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.span_cart {
|
||||
background-color: #06367D;
|
||||
margin-left: 8px;
|
||||
padding: 6px;
|
||||
border-radius: 24px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,935 +0,0 @@
|
||||
<template>
|
||||
<div
|
||||
v-if="loading"
|
||||
style="min-height: 70vh; display: grid; place-items: center"
|
||||
>
|
||||
<div class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="container">
|
||||
<div>
|
||||
<!-- <button
|
||||
class="btn btn-secondary float-start"
|
||||
style="margin: 5px"
|
||||
onclick="history.back()"
|
||||
>
|
||||
Kembali <i class="bi bi-backspace-fill"></i>
|
||||
</button> -->
|
||||
<div class="wrapper wrapper-content animated fadeInRight">
|
||||
<h1>Troli <i class="bi bi-cart3"></i></h1>
|
||||
<div class="row">
|
||||
<div class="col-lg-9 col-sm-12" style="overflow-x: auto">
|
||||
<div class="ibox">
|
||||
<div class="table-responsive">
|
||||
<div class="accordion-body">
|
||||
<div class="ibox-content" style="padding-bottom: none">
|
||||
<table class="table shoping-cart-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<td>Maklumat Marhun</td>
|
||||
<td
|
||||
width="30"
|
||||
style="width: 145.82px; text-align: center"
|
||||
>
|
||||
Harga Asas
|
||||
</td>
|
||||
<td
|
||||
width="120"
|
||||
style="width: 145.82px; text-align: center"
|
||||
>
|
||||
Harga Bida
|
||||
</td>
|
||||
<td
|
||||
width="80"
|
||||
style="width: 145.82px; text-align: center"
|
||||
>
|
||||
Tindakan
|
||||
</td>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
<div
|
||||
class="ibox-content"
|
||||
v-for="senaraiCart in senaraiCarts.slice().reverse()"
|
||||
:key="senaraiCart.id"
|
||||
style="border-bottom: 1px solid #e7eaec"
|
||||
>
|
||||
<table class="table shoping-cart-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="desc">
|
||||
<h3 class="text-primary">
|
||||
{{ senaraiCart.datalelongbid.norujukan }}
|
||||
</h3>
|
||||
|
||||
<dl class="small m-b-none">
|
||||
<p>
|
||||
Marhun:
|
||||
{{ senaraiCart.datalelongbid.marhun }}
|
||||
</p>
|
||||
<p>
|
||||
Berat:
|
||||
{{ senaraiCart.datalelongbid.berat }}g
|
||||
</p>
|
||||
<p>
|
||||
Cawangan:
|
||||
{{
|
||||
senaraiCart.datalelongbid.cawangan.caw_name
|
||||
}}
|
||||
</p>
|
||||
</dl>
|
||||
|
||||
<div class="m-t-sm">
|
||||
<button
|
||||
class="btn btn-danger"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#deleteModal"
|
||||
@click="deleteModal(senaraiCart)"
|
||||
>
|
||||
Hapus
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
<td
|
||||
width="30"
|
||||
style="width: 145.82px; text-align: center"
|
||||
>
|
||||
RM{{ senaraiCart.datalelongbid.hargaasas }}
|
||||
</td>
|
||||
<td
|
||||
width="30"
|
||||
style="width: 145.82px; text-align: center"
|
||||
>
|
||||
<h4>RM{{ senaraiCart.hargabida }}</h4>
|
||||
</td>
|
||||
<td
|
||||
width="120"
|
||||
style="width: 145.82px; text-align: center"
|
||||
>
|
||||
<button
|
||||
class="btn btn-warning"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#editModal"
|
||||
@click="editModal(senaraiCart)"
|
||||
>
|
||||
Ubah
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-3">
|
||||
<div
|
||||
class="ibox"
|
||||
v-if="feeStatus == 12"
|
||||
style="border: #e7eaec solid 1px"
|
||||
>
|
||||
<div class="ibox-title" style="padding: 20px">
|
||||
<h5>Yuran</h5>
|
||||
</div>
|
||||
<div class="ibox-content">
|
||||
<!-- <div class="small m-t-xs">
|
||||
<div class="d-flex justify-content-between">
|
||||
<p class="mb-0">Jumlah Bilangan Surat</p>
|
||||
<p class="mb-0">{{ total_sag }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
<div class="small m-t-xs">
|
||||
<div class="d-flex justify-content-between">
|
||||
<p class="mb-0">Jumlah Bidaan</p>
|
||||
<p class="mb-0">RM{{ total_bidaan }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
<span> Yuran </span> -->
|
||||
<h2 class="font-bold">RM10.00</h2>
|
||||
<hr />
|
||||
<span class="text-danger">
|
||||
<i>*Anda perlu membayar yuran sebelum membuat bidaan.</i>
|
||||
</span>
|
||||
<div class="m-t-sm">
|
||||
<!-- <div class="btn-group">
|
||||
<button
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#payModal"
|
||||
class="btn btn-primary"
|
||||
>
|
||||
Teruskan <i class="fa fa-shopping-cart"></i>
|
||||
</button>
|
||||
</div> -->
|
||||
<div class="btn-group">
|
||||
<button
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#payModal"
|
||||
class="btn btn-success"
|
||||
>
|
||||
Bayar Yuran
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="ibox"
|
||||
v-if="feeStatus == 11"
|
||||
style="border: #e7eaec solid 1px"
|
||||
>
|
||||
<!-- <div class="ibox-title" style="padding: 20px">
|
||||
<h5>Yuran</h5>
|
||||
</div> -->
|
||||
<div class="ibox-content">
|
||||
<!-- <div class="small m-t-xs">
|
||||
<div class="d-flex justify-content-between">
|
||||
<p class="mb-0">Jumlah Bilangan Surat</p>
|
||||
<p class="mb-0">{{ total_sag }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
<div class="small m-t-xs">
|
||||
<div class="d-flex justify-content-between">
|
||||
<p class="mb-0">Jumlah Bidaan</p>
|
||||
<p class="mb-0">RM{{ total_bidaan }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
<span> Yuran </span> -->
|
||||
<h4 class="text-success">
|
||||
Yuran Telah Berjaya Dibayar
|
||||
<i class="bi bi-check2-circle"></i>
|
||||
</h4>
|
||||
<hr />
|
||||
<span class="fw-bold">
|
||||
<i>*Anda boleh membuat bidaan.</i>
|
||||
</span>
|
||||
<!-- <div class="m-t-sm">
|
||||
|
||||
<div class="btn-group">
|
||||
<button
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#payModal"
|
||||
class="btn btn-primary"
|
||||
>
|
||||
Bayar Yuran
|
||||
</button>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="ibox" style="border: #e7eaec solid 1px">
|
||||
<div class="ibox-title" style="padding: 20px">
|
||||
<h5>Ringkasan Troli</h5>
|
||||
</div>
|
||||
<div class="ibox-content">
|
||||
<div class="small m-t-xs">
|
||||
<div class="d-flex justify-content-between">
|
||||
<p class="mb-0">Jumlah Bilangan Surat</p>
|
||||
<p class="mb-0">{{ total_sag }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
<div class="small m-t-xs">
|
||||
<div class="d-flex justify-content-between">
|
||||
<p class="mb-0">Jumlah Bidaan</p>
|
||||
<p class="mb-0">RM{{ total_bidaan }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <hr />
|
||||
<span> Yuran </span>
|
||||
<h2 class="font-bold">RM10.00</h2>
|
||||
<hr />
|
||||
<span class="text-muted small">
|
||||
<i
|
||||
>*Caj yuran akan dikenakan untuk membuat pendaftaran
|
||||
bidaan.</i
|
||||
>
|
||||
</span> -->
|
||||
<div class="m-t-sm">
|
||||
<div class="btn-group">
|
||||
<button
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#bidModal"
|
||||
class="btn btn-success mt-3"
|
||||
>
|
||||
Teruskan <i class="fa fa-shopping-cart"></i>
|
||||
</button>
|
||||
</div>
|
||||
<!-- <div class="btn-group">
|
||||
<button @click="feePayment()" class="btn btn-primary">
|
||||
try bavayar
|
||||
</button>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div>{{$store.state.cart}}</div> -->
|
||||
<!-- <div>{{ myValue.lelong_id }}</div> -->
|
||||
|
||||
<!-- modal ubah bidaan -->
|
||||
<div
|
||||
class="modal fade"
|
||||
id="editModal"
|
||||
tabindex="-1"
|
||||
aria-labelledby="editModalLabel"
|
||||
aria-hidden="true"
|
||||
data-bs-backdrop="static"
|
||||
>
|
||||
<div class="modal-dialog modal-lg modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="editModalLabel">
|
||||
{{ test.norujukan }}
|
||||
</h5>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-close"
|
||||
ref="ubahClose"
|
||||
data-bs-dismiss="modal"
|
||||
aria-label="Close"
|
||||
></button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<div class="row m-2">
|
||||
<div class="col">
|
||||
<!-- <p>Marhun: {{ test.marhun }}</p> -->
|
||||
<p>Jumlah Berat: {{ test.berat }}g</p>
|
||||
<table class="table table-bordered">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<th scope="col">No</th>
|
||||
<th scope="col">Jenis Marhun</th>
|
||||
<th scope="col">Karat</th>
|
||||
<th scope="col">Berat</th>
|
||||
<th scope="col">Nota</th>
|
||||
<th scope="col">Harga Asas</th>
|
||||
</tr>
|
||||
<tr v-for="(data, index) in test2" :key="index.id">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ data.marhun }}</td>
|
||||
<td>{{ data.karat }}</td>
|
||||
<td>{{ data.berat }}g</td>
|
||||
<td>{{ data.nota }}</td>
|
||||
<td>RM{{ data.hargaasas }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<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
|
||||
>
|
||||
{{ test.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
|
||||
v-model="tambahan"
|
||||
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"
|
||||
v-if="v$.tambahan.$error"
|
||||
>
|
||||
<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"
|
||||
v-model="formEdit.hargabida"
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-danger me-2"
|
||||
data-bs-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button type="submit" class="btn btn-success" @click="updateItem()">
|
||||
Terima
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- modal padam bidaan -->
|
||||
<div
|
||||
class="modal fade"
|
||||
id="deleteModal"
|
||||
tabindex="-1"
|
||||
aria-labelledby="deleteModalLabel"
|
||||
aria-hidden="true"
|
||||
data-bs-backdrop="static"
|
||||
data-bs-keyboard="false"
|
||||
>
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button
|
||||
type="button"
|
||||
class="btn-close"
|
||||
ref="padamClose"
|
||||
data-bs-dismiss="modal"
|
||||
aria-label="Close"
|
||||
></button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<h1><i class="bi bi-exclamation-triangle text-warning"></i></h1>
|
||||
<h5>ADAKAH ANDA PASTI?</h5>
|
||||
<p>Padam item dalam troli.</p>
|
||||
|
||||
<table class="table table-bordered">
|
||||
<tbody>
|
||||
<tr class="bg-light">
|
||||
<th>SAG</th>
|
||||
<th>Harga Bida</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>{{ test.norujukan }}</td>
|
||||
<td>RM{{ data.hargabida }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p class="text-danger text-sm mt-3">
|
||||
<i>*Tindakan ini tidak dapat dikembalikan</i>
|
||||
</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-secondary me-2"
|
||||
data-bs-dismiss="modal"
|
||||
>
|
||||
Kembali
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-danger"
|
||||
@click="deleteCart(data.id)"
|
||||
>
|
||||
Padam
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- modal daftar bidaan -->
|
||||
<div
|
||||
class="modal fade"
|
||||
id="bidModal"
|
||||
tabindex="-1"
|
||||
aria-labelledby="payModalLabel"
|
||||
aria-hidden="true"
|
||||
data-bs-backdrop="static"
|
||||
data-bs-keyboard="false"
|
||||
>
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="editModalLabel">Daftar Bidaan</h5>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-close"
|
||||
ref="daftarBidaanClose"
|
||||
data-bs-dismiss="modal"
|
||||
aria-label="Close"
|
||||
></button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<h1><i class="bi bi-exclamation-triangle text-warning"></i></h1>
|
||||
<h3>ADAKAH ANDA PASTI?</h3>
|
||||
<h6 class="text-danger">
|
||||
<i>*Bidaan tidak dapat diubah selepas dihantar.</i>
|
||||
</h6>
|
||||
|
||||
<table class="table table-bordered">
|
||||
<tbody>
|
||||
<tr class="bg-light">
|
||||
<th>Jumlah Surat</th>
|
||||
<th>Jumlah Bidaan</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>{{ total_sag }}</td>
|
||||
<td>RM{{ total_bidaan }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-danger me-2"
|
||||
data-bs-dismiss="modal"
|
||||
>
|
||||
Tidak
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-success"
|
||||
@click="bidderSelectBidItem()"
|
||||
>
|
||||
Ya
|
||||
</button>
|
||||
<p
|
||||
class="fst-italic mt-3 fw-lighter"
|
||||
style="text-align: right; font-size: small"
|
||||
>
|
||||
<!-- *Pelayar akan dialihkan ke halaman pembayaran jika butang 'Bayar'
|
||||
ditekan. -->
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- modal bayar yuran -->
|
||||
<div
|
||||
class="modal fade"
|
||||
id="payModal"
|
||||
tabindex="-1"
|
||||
aria-labelledby="payModalLabel"
|
||||
aria-hidden="true"
|
||||
data-bs-backdrop="static"
|
||||
data-bs-keyboard="false"
|
||||
>
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="editModalLabel">Bayar Yuran</h5>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-close"
|
||||
data-bs-dismiss="modal"
|
||||
aria-label="Close"
|
||||
></button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<h1><i class="bi bi-exclamation-triangle text-warning"></i></h1>
|
||||
<p>ADAKAH ANDA PASTI?</p>
|
||||
<h4 class="text-danger">
|
||||
<i
|
||||
>Caj yuran, RM10 akan dikenakan untuk setiap kali pendaftaran
|
||||
bidaan.</i
|
||||
>
|
||||
</h4>
|
||||
|
||||
<!-- <table class="table table-bordered">
|
||||
<tbody>
|
||||
<tr class="bg-light">
|
||||
<th>Jumlah Surat</th>
|
||||
<th>Jumlah Bidaan</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>{{ total_sag }}</td>
|
||||
<td>RM{{ total_bidaan }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table> -->
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-secondary me-2"
|
||||
data-bs-dismiss="modal"
|
||||
>
|
||||
Kembali
|
||||
</button>
|
||||
<button type="submit" class="btn btn-success" @click="feePayment()">
|
||||
Bayar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import useVuelidate from "@vuelidate/core";
|
||||
import { required, integer, numeric, minValue } from "@vuelidate/validators";
|
||||
import { mapGetters, mapState } from "vuex";
|
||||
|
||||
export default {
|
||||
name: "Cart",
|
||||
emits: ["reloadComponent"],
|
||||
data() {
|
||||
return {
|
||||
v$: useVuelidate(),
|
||||
loading: false,
|
||||
senaraiCarts: [],
|
||||
tambahan: "",
|
||||
test: "",
|
||||
test2: [],
|
||||
abc: "",
|
||||
data: "",
|
||||
feeStatus: "2",
|
||||
formEdit: {
|
||||
id: "",
|
||||
hargabida: "",
|
||||
},
|
||||
formPayment: {
|
||||
email: localStorage.getItem("email"),
|
||||
notel: localStorage.getItem("notelbimbit"),
|
||||
name: localStorage.getItem("name"),
|
||||
user_id: localStorage.getItem("id"),
|
||||
lelong_id: localStorage.getItem("lelong_id"),
|
||||
},
|
||||
test: localStorage.getItem("id"),
|
||||
formCheck: {
|
||||
user_id: localStorage.getItem("id"),
|
||||
lelong_id: localStorage.getItem("lelong_id"),
|
||||
},
|
||||
formRegisterBid: {
|
||||
lelong_id: localStorage.getItem("lelong_id"),
|
||||
user_id: localStorage.getItem("id"),
|
||||
name: localStorage.getItem("name"),
|
||||
},
|
||||
};
|
||||
},
|
||||
validations() {
|
||||
return {
|
||||
tambahan: { required, numeric, integer, minValue: minValue(1) },
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
total_sag() {
|
||||
return this.senaraiCarts.length;
|
||||
},
|
||||
total_bidaan() {
|
||||
let total = 0;
|
||||
this.senaraiCarts.forEach((val) => {
|
||||
total += parseFloat(val.hargabida);
|
||||
});
|
||||
return total.toFixed(2);
|
||||
},
|
||||
// ...mapGetters(["idLelong"])
|
||||
// ...mapState(["idLelong"]),
|
||||
...mapGetters(["idLelong"]),
|
||||
myValue() {
|
||||
return this.$store.state.lelong_id;
|
||||
},
|
||||
count() {
|
||||
return store.state.lelong_id;
|
||||
},
|
||||
},
|
||||
mounted: function () {
|
||||
this.checkFeePayment();
|
||||
this.listCart();
|
||||
},
|
||||
methods: {
|
||||
trybayar() {
|
||||
axios
|
||||
.post("/feepayment", this.formPayment)
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
listCart() {
|
||||
this.loading = true;
|
||||
axios
|
||||
.get("/cart/" + localStorage.getItem("id"), {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
this.senaraiCarts = response.data;
|
||||
this.loading = false;
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
calcTotal() {
|
||||
this.formEdit.hargabida =
|
||||
parseFloat(this.tambahan) + parseFloat(this.test.hargaasas);
|
||||
},
|
||||
editModal(data) {
|
||||
this.data = data;
|
||||
this.test = this.data.datalelongbid;
|
||||
this.test2 = this.data.datalelongbid.lelongbidmarhun;
|
||||
this.formEdit.id = this.data.id;
|
||||
this.tambahan = this.data.hargabida - this.test.hargaasas;
|
||||
this.formEdit.hargabida = this.data.hargabida;
|
||||
console.log(this.data.hargabida);
|
||||
},
|
||||
updateItem() {
|
||||
this.v$.$validate();
|
||||
if (!this.v$.$error) {
|
||||
this.$refs.ubahClose.click();
|
||||
this.loading = true;
|
||||
axios
|
||||
.post("/updateItem", this.formEdit, {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
// this.$refs.ubahClose.click();
|
||||
this.loading = false;
|
||||
this.$emit("reloadComponent");
|
||||
// location.reload();
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
this.loading = false;
|
||||
});
|
||||
} else {
|
||||
}
|
||||
},
|
||||
deleteModal(data) {
|
||||
this.data = data;
|
||||
this.test = this.data.datalelongbid;
|
||||
console.log(data.datalelongbid.norujukan);
|
||||
},
|
||||
deleteCart(id) {
|
||||
this.$refs.padamClose.click();
|
||||
this.loading = true;
|
||||
axios
|
||||
.get("/deleteItem/" + id, {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
this.loading = false;
|
||||
console.log(response);
|
||||
this.$emit("reloadComponent");
|
||||
// location.reload();
|
||||
})
|
||||
.catch((error) => {
|
||||
this.loading = false;
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
feePayment() {
|
||||
axios
|
||||
.post("/feepayment", this.formPayment)
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
// window.open(response.data.message + "?auto_submit=true");
|
||||
window.location.href = response.data.message + "?auto_submit=true";
|
||||
console.log(response);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
alert(error);
|
||||
});
|
||||
},
|
||||
checkFeePayment() {
|
||||
axios
|
||||
.get("/bidder/historyFeePay", {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
params: {
|
||||
user_id: localStorage.getItem("id"),
|
||||
lelong_id: localStorage.getItem("lelong_id"),
|
||||
},
|
||||
})
|
||||
// .post("/addToCart", this.form, {
|
||||
// headers: {
|
||||
// Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
// },
|
||||
// }
|
||||
.then((response) => {
|
||||
this.feeStatus = response.data.status;
|
||||
// console.log(this.idLelong);
|
||||
// console.log(response.data.status);
|
||||
// this.$refs.padamClose.click();
|
||||
// location.reload();
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
bidderSelectBidItem() {
|
||||
this.$refs.daftarBidaanClose.click();
|
||||
this.loading = true;
|
||||
axios
|
||||
.post("/bidder/biditem", this.formRegisterBid, {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
this.loading = false;
|
||||
console.log(response);
|
||||
this.$emit("reloadComponent");
|
||||
|
||||
// location.reload();
|
||||
})
|
||||
.catch((error) => {
|
||||
this.loading = false;
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
body {
|
||||
margin-top: 20px;
|
||||
background: #eee;
|
||||
}
|
||||
h3 {
|
||||
font-size: 16px;
|
||||
}
|
||||
.text-navy {
|
||||
color: #1ab394;
|
||||
}
|
||||
.cart-product-imitation {
|
||||
text-align: center;
|
||||
padding-top: 30px;
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
background-color: #f8f8f9;
|
||||
}
|
||||
.product-imitation.xl {
|
||||
padding: 120px 0;
|
||||
}
|
||||
.product-desc {
|
||||
padding: 20px;
|
||||
position: relative;
|
||||
}
|
||||
.ecommerce .tag-list {
|
||||
padding: 0;
|
||||
}
|
||||
.ecommerce .fa-star {
|
||||
color: #d1dade;
|
||||
}
|
||||
.ecommerce .fa-star.active {
|
||||
color: #f8ac59;
|
||||
}
|
||||
.ecommerce .note-editor {
|
||||
border: 1px solid #e7eaec;
|
||||
}
|
||||
table.shoping-cart-table {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
table.shoping-cart-table tr td {
|
||||
border: none;
|
||||
text-align: right;
|
||||
}
|
||||
table.shoping-cart-table tr td.desc,
|
||||
table.shoping-cart-table tr td:first-child {
|
||||
text-align: left;
|
||||
}
|
||||
table.shoping-cart-table tr td:last-child {
|
||||
width: 80px;
|
||||
}
|
||||
.ibox {
|
||||
clear: both;
|
||||
margin-bottom: 25px;
|
||||
margin-top: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.ibox.collapsed .ibox-content {
|
||||
display: none;
|
||||
}
|
||||
.ibox:after,
|
||||
.ibox:before {
|
||||
display: table;
|
||||
}
|
||||
.ibox-title {
|
||||
-moz-border-bottom-colors: none;
|
||||
-moz-border-left-colors: none;
|
||||
-moz-border-right-colors: none;
|
||||
-moz-border-top-colors: none;
|
||||
background-color: #ffffff;
|
||||
border-color: #e7eaec;
|
||||
border-image: none;
|
||||
border-style: solid solid none;
|
||||
border-width: 3px 0 0;
|
||||
color: inherit;
|
||||
margin-bottom: 0;
|
||||
padding: 14px 15px 7px;
|
||||
min-height: 48px;
|
||||
}
|
||||
.ibox-content {
|
||||
background-color: #ffffff;
|
||||
color: inherit;
|
||||
padding: 15px 20px 20px 20px;
|
||||
border-color: #e7eaec;
|
||||
border-image: none;
|
||||
border-style: solid solid none;
|
||||
border-width: 1px 0;
|
||||
}
|
||||
.ibox-footer {
|
||||
color: inherit;
|
||||
border-top: 1px solid #e7eaec;
|
||||
font-size: 90%;
|
||||
background: #ffffff;
|
||||
padding: 10px 15px;
|
||||
}
|
||||
</style>
|
||||
+422
-174
@@ -1,57 +1,147 @@
|
||||
<template>
|
||||
<div
|
||||
v-if="isLoading"
|
||||
style="min-height: 70vh; display: grid; place-items: center"
|
||||
>
|
||||
<div class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
<div v-if="isLoading" class="fadein animation-duration-400">
|
||||
<div
|
||||
class="flex align-items-center justify-content-center container-height"
|
||||
>
|
||||
<div class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else style="min-height: 70vh" class="container">
|
||||
<div class="row">
|
||||
<div class="col-10">
|
||||
<div class="card">
|
||||
<div class="card-header"><h5>SENARAI TROLI</h5></div>
|
||||
<div v-if="isSuccess" 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
|
||||
v-else
|
||||
style="min-height: 70vh"
|
||||
class="container fadein animation-duration-400"
|
||||
>
|
||||
<div v-if="isSuccess" class="row">
|
||||
<div class="col-12 lg:col-9">
|
||||
<!-- <div class="card">
|
||||
<div class="card-header"><h5>SENARAI TROLI</h5></div>
|
||||
<div class="accordion" id="accordionExample">
|
||||
<div
|
||||
id="collapseOne"
|
||||
class="accordion-collapse collapse show"
|
||||
aria-labelledby="headingOne"
|
||||
data-bs-parent="#accordionExample"
|
||||
v-for="item in listItems"
|
||||
v-bind:key="item"
|
||||
class="accordion-item"
|
||||
>
|
||||
<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>
|
||||
<h2 class="accordion-header" id="headingOne">
|
||||
<button
|
||||
class="accordion-button"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#collapseOne"
|
||||
aria-expanded="true"
|
||||
aria-controls="collapseOne"
|
||||
>
|
||||
{{ item.caw_name }}
|
||||
</button>
|
||||
</h2>
|
||||
<div
|
||||
id="collapseOne"
|
||||
class="accordion-collapse collapse show"
|
||||
aria-labelledby="headingOne"
|
||||
data-bs-parent="#accordionExample"
|
||||
>
|
||||
<div class="accordion-body">
|
||||
<table class="table table-bordered table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Bil</th>
|
||||
<th>No Rujukan</th>
|
||||
<th>Berat</th>
|
||||
<th>Harga Asas</th>
|
||||
<th>Harga Bida</th>
|
||||
<th>Tindakan</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr
|
||||
v-for="(surat, index) in item.lelongbid"
|
||||
v-bind:key="surat"
|
||||
>
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>
|
||||
<a
|
||||
href="#"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#marhunModal"
|
||||
v-on:click="openModal(surat)"
|
||||
>
|
||||
{{ surat.norujukan }}
|
||||
</a>
|
||||
</td>
|
||||
<td>{{ surat.berat }}g</td>
|
||||
<td>
|
||||
RM{{
|
||||
surat.hargaasas
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</td>
|
||||
<td>
|
||||
RM{{
|
||||
surat.hargabida
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</td>
|
||||
<td>
|
||||
<button
|
||||
class="btn me-1 ms-1 btn-warning"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#editModal"
|
||||
v-on:click="openModal(surat)"
|
||||
>
|
||||
Ubah Bidaan
|
||||
</button>
|
||||
<button
|
||||
class="btn me-1 ms-1 btn-danger"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#deleteModal"
|
||||
v-on:click="openModal(surat)"
|
||||
>
|
||||
Padam Surat
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="text-transform: uppercase">
|
||||
<th colspan="2">JUMLAH</th>
|
||||
<th>xxxg</th>
|
||||
<th></th>
|
||||
<th>RMxxxxxx</th>
|
||||
<td></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<Card>
|
||||
<template #title>
|
||||
<div class="font-normal">Senarai Troli</div>
|
||||
</template>
|
||||
<template #content>
|
||||
<Accordion :multiple="true">
|
||||
<AccordionTab v-for="item in listItems" v-bind:key="item">
|
||||
<template #header>
|
||||
<span>{{ item.caw_name }}</span>
|
||||
<!-- <span class="ml-2">Jumlah:RMXXXX</span> -->
|
||||
</template>
|
||||
<div class="overflow-x-scroll">
|
||||
<table class="table text-center table-bordered table-hover">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td>Bil</td>
|
||||
<td style="min-width: 180px">No Rujukan</td>
|
||||
<td>Berat</td>
|
||||
<td style="min-width: 110px">Harga Asas</td>
|
||||
<td style="min-width: 110px">Harga Bida</td>
|
||||
<!-- <td>Tindakan</td> -->
|
||||
</tr>
|
||||
<tr
|
||||
v-for="(surat, index) in item.lelongbid"
|
||||
v-bind:key="surat"
|
||||
:key="surat.id"
|
||||
>
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>
|
||||
@@ -72,78 +162,73 @@
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</td>
|
||||
<td>
|
||||
<th>
|
||||
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>
|
||||
</th>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="card-body">
|
||||
<p>TIADA DATA</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</AccordionTab>
|
||||
</Accordion>
|
||||
</template>
|
||||
</Card>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="card">
|
||||
<div class="card-header">RINGKASAN TROLI</div>
|
||||
<div class="card-body">
|
||||
<base-card>
|
||||
<p>Jumlah Surat: XXX</p>
|
||||
</base-card>
|
||||
<base-card>
|
||||
<p>Jumlah Bidaan: RMXXXXX</p>
|
||||
</base-card>
|
||||
<button
|
||||
class="btn btn-success"
|
||||
<div class="col-12 lg:col-3">
|
||||
<Card class="card-custom">
|
||||
<template #title>
|
||||
<div class="font-normal">Ringkasan Troli</div>
|
||||
</template>
|
||||
<template #content>
|
||||
<div>
|
||||
<i class="pi pi-paperclip text-primary"
|
||||
><span class="ml-1">Jumlah Surat</span></i
|
||||
>
|
||||
<p>126</p>
|
||||
</div>
|
||||
<div>
|
||||
<i class="pi pi-wallet text-primary"
|
||||
><span class="ml-1">Jumlah Bidaan</span></i
|
||||
>
|
||||
|
||||
<p class="font-bold text-xl">RM121,200.00</p>
|
||||
</div>
|
||||
<!-- <Button
|
||||
label="Teruskan"
|
||||
class="p-button-sm w-full"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#bidModal"
|
||||
/> -->
|
||||
<Button
|
||||
label="Teruskan"
|
||||
class="p-button-sm w-full"
|
||||
v-on:click="openModalNew()"
|
||||
/>
|
||||
</template>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div
|
||||
class="flex align-items-center justify-content-center container-height"
|
||||
>
|
||||
<div class="grid justify-content-center">
|
||||
<div class="col-12 mb-4 text-center">
|
||||
<i class="pi pi-shopping-cart text-8xl text-400"></i>
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
<span class="text-400">Tiada Data Dalam Troli.</span>
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
<span class="text-400"
|
||||
>Sila rujuk halaman
|
||||
<router-link v-bind:to="{ name: 'list' }">Senarai</router-link>
|
||||
untuk tambah item ke troli.</span
|
||||
>
|
||||
Teruskan
|
||||
</button>
|
||||
<button
|
||||
class="btn me-1 ms-1 btn-secondary"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#gagalDaftarBidaanModal"
|
||||
ref="daftarBidaanOpen"
|
||||
hidden
|
||||
>
|
||||
Gagal Daftar Bidaan
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -172,31 +257,33 @@
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<div class="row m-2">
|
||||
<div class="grid">
|
||||
<div
|
||||
class="col"
|
||||
class="col-12 lg:col-6"
|
||||
style="
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border: 1px solid rgba(0, 0, 0, 0.125);
|
||||
min-height: 400px;
|
||||
min-width: 550px;
|
||||
min-height: 300px;
|
||||
min-width: 300px;
|
||||
max-height: 600px;
|
||||
max-width: 600px;
|
||||
"
|
||||
>
|
||||
-gambar marhun-
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="col-12 text-center lg:col-6">
|
||||
<!-- <p>Marhun: {{ theSurat.marhun }}</p>
|
||||
<p>Jumlah Berat: {{ theSurat.berat }}g</p> -->
|
||||
<table class="table table-bordered">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<th scope="col">No</th>
|
||||
<th scope="col">Jenis Marhun</th>
|
||||
<th scope="col">Karat</th>
|
||||
<th scope="col">Berat</th>
|
||||
<th scope="col">Harga Asas</th>
|
||||
<td scope="col">No</td>
|
||||
<td scope="col">Jenis Marhun</td>
|
||||
<td scope="col">Karat</td>
|
||||
<td scope="col">Berat</td>
|
||||
<td scope="col">Harga Asas</td>
|
||||
</tr>
|
||||
<tr
|
||||
v-for="(data, index) in theSurat.lelongbidmarhun"
|
||||
@@ -215,15 +302,15 @@
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="text-transform: uppercase">
|
||||
<th colspan="3">Jumlah</th>
|
||||
<th>{{ theSurat.berat }}g</th>
|
||||
<th>
|
||||
<td colspan="3">Jumlah</td>
|
||||
<td>{{ theSurat.berat }}g</td>
|
||||
<td>
|
||||
RM{{
|
||||
theSurat.hargaasas
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
}}
|
||||
</th>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -290,7 +377,7 @@
|
||||
<div class="col-6">
|
||||
<div class="input-group mb-3">
|
||||
<span class="input-group-text">RM</span>
|
||||
<span class="form-control input-group-text">{{
|
||||
<span class="form-control font-bold input-group-text">{{
|
||||
theSurat.hargabida
|
||||
?.toString()
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
|
||||
@@ -298,33 +385,60 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<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"
|
||||
<Button
|
||||
icon="pi pi-delete-left"
|
||||
label="Padam Surat"
|
||||
data-bs-toggle="modal"
|
||||
iconPos="right"
|
||||
data-bs-target="#deleteModal"
|
||||
v-on:click="openModal(theSurat)"
|
||||
>
|
||||
Padam Surat
|
||||
</button>
|
||||
class="p-button-text p-button-danger"
|
||||
/>
|
||||
<Button
|
||||
icon="pi pi-file-edit"
|
||||
label="Ubah Bidaan"
|
||||
data-bs-toggle="modal"
|
||||
iconPos="right"
|
||||
data-bs-target="#editModal"
|
||||
v-on:click="openModal(theSurat)"
|
||||
class="p-button-warning p-button-text"
|
||||
/>
|
||||
|
||||
<!-- <button
|
||||
class="btn me-1 ms-1 btn-warning"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#editModal"
|
||||
v-on:click="openModal(theSurat)"
|
||||
>
|
||||
Ubah Bidaan
|
||||
</button>
|
||||
<button
|
||||
class="btn me-1 ms-1 btn-danger"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#deleteModal"
|
||||
v-on:click="openModal(theSurat)"
|
||||
>
|
||||
Padam Surat
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-secondary"
|
||||
<Button
|
||||
class="p-button-sm"
|
||||
label="Kembali"
|
||||
data-bs-dismiss="modal"
|
||||
>
|
||||
Kembali
|
||||
</button>
|
||||
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> -->
|
||||
@@ -428,7 +542,22 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
<Button
|
||||
class="p-button-sm p-button-text"
|
||||
label="Batal"
|
||||
icon="pi pi-times"
|
||||
iconPos="right"
|
||||
data-bs-dismiss="modal"
|
||||
/>
|
||||
<Button
|
||||
class="p-button-sm"
|
||||
icon="pi pi-check"
|
||||
iconPos="right"
|
||||
label="Ubah"
|
||||
:loading="isLoadingUbah"
|
||||
@click="updateItem(theSurat)"
|
||||
/>
|
||||
<!-- <button
|
||||
type="submit"
|
||||
class="btn btn-danger me-2"
|
||||
data-bs-dismiss="modal"
|
||||
@@ -441,7 +570,7 @@
|
||||
@click="updateItem(theSurat)"
|
||||
>
|
||||
Ubah
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -457,7 +586,7 @@
|
||||
data-bs-keyboard="false"
|
||||
>
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-content text-center">
|
||||
<div class="modal-header">
|
||||
<button
|
||||
type="button"
|
||||
@@ -496,7 +625,20 @@
|
||||
</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
<Button
|
||||
class="p-button-sm mr-2"
|
||||
label="Batal"
|
||||
data-bs-dismiss="modal"
|
||||
/>
|
||||
<Button
|
||||
class="p-button-sm p-button-outlined"
|
||||
icon="pi pi-times"
|
||||
iconPos="right"
|
||||
label="Padam"
|
||||
:loading="isLoadingPadam"
|
||||
@click="deleteItem(theSurat)"
|
||||
/>
|
||||
<!-- <button
|
||||
type="submit"
|
||||
class="btn btn-secondary me-2"
|
||||
data-bs-dismiss="modal"
|
||||
@@ -509,7 +651,7 @@
|
||||
@click="deleteItem(theSurat)"
|
||||
>
|
||||
Padam
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -525,7 +667,7 @@
|
||||
data-bs-keyboard="false"
|
||||
>
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-content text-center">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="bidModalLabel">Daftar Bidaan</h5>
|
||||
<button
|
||||
@@ -542,12 +684,16 @@
|
||||
<h3>ADAKAH ANDA PASTI?</h3>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<input type="checkbox" v-model="akadLelong" name="akad" /> Saya
|
||||
bersetuju untuk membayar semua surat yang dimenang sebelum jam
|
||||
4:00pm hari ini.
|
||||
<input type="checkbox" v-model="akadLelong" name="akad" />
|
||||
Saya bersetuju untuk membayar semua surat yang dimenang sebelum
|
||||
jam 4:00pm hari ini.
|
||||
<p>Jika tidak selesai, saya akan dibanned.</p>
|
||||
</div>
|
||||
<div class="alert alert-danger" role="alert" v-if="v$.akadLelong.$error">
|
||||
<div
|
||||
class="alert alert-danger"
|
||||
role="alert"
|
||||
v-if="v$.akadLelong.$error"
|
||||
>
|
||||
Sila tick kotak akad lelong sebelum meneruskan.
|
||||
</div>
|
||||
</div>
|
||||
@@ -594,6 +740,51 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- DAFTAR BIDAAN MODAL - PRIMEVUE -->
|
||||
<Dialog
|
||||
header="Daftar Bidaan"
|
||||
v-model:visible="displayModal"
|
||||
:breakpoints="{ '960px': '75vw', '640px': '90vw' }"
|
||||
:style="{ width: '50vw' }"
|
||||
:modal="true"
|
||||
>
|
||||
<div class="text-center">
|
||||
<h1><i class="bi bi-exclamation-triangle text-warning"></i></h1>
|
||||
<h3>ADAKAH ANDA PASTI?</h3>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<div class="mt-3 mb-1">
|
||||
<label>
|
||||
<input type="checkbox" v-model="akadLelong" />
|
||||
Saya bersetuju untuk membayar kesemua bidaan yang menang.
|
||||
</label>
|
||||
</div>
|
||||
<InlineMessage v-if="v$.akadLelong.$error"
|
||||
>Anda mestilah bersetuju dengan akad lelong.</InlineMessage
|
||||
>
|
||||
</div>
|
||||
<div class="text-center mt-5">
|
||||
<p class="text-danger">
|
||||
<i>*Bidaan tidak dapat diubah selepas dihantar.</i>
|
||||
</p>
|
||||
</div>
|
||||
<template #footer>
|
||||
<Button
|
||||
label="Tidak"
|
||||
icon="pi pi-times"
|
||||
iconPos="right"
|
||||
@click="closeModalNew()"
|
||||
class="p-button-text"
|
||||
/>
|
||||
<Button
|
||||
label="Ya"
|
||||
icon="pi pi-check"
|
||||
iconPos="right"
|
||||
:loading="isLoadingDaftar"
|
||||
v-on:click="bidderSelectBidItem()"
|
||||
/>
|
||||
</template>
|
||||
</Dialog>
|
||||
<!-- GAGAL DAFTAR BIDAAN MODAL -->
|
||||
<div
|
||||
class="modal fade"
|
||||
@@ -646,12 +837,17 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
v$: useVuelidate(),
|
||||
displayModal: false,
|
||||
isLoadingUbah: false,
|
||||
isLoadingPadam: false,
|
||||
isLoadingDaftar: false,
|
||||
isLoading: false,
|
||||
isSuccess: false,
|
||||
listItems: "",
|
||||
theSurat: "",
|
||||
tambahanBidaan: "",
|
||||
jumlahBidaan: "",
|
||||
akadLelong: null,
|
||||
hargaAsas: "",
|
||||
formDelete: {
|
||||
userId: "",
|
||||
@@ -679,6 +875,13 @@ export default {
|
||||
this.listCart();
|
||||
},
|
||||
methods: {
|
||||
openModalNew() {
|
||||
this.displayModal = true;
|
||||
this.akadLelong = null;
|
||||
},
|
||||
closeModalNew() {
|
||||
this.displayModal = false;
|
||||
},
|
||||
listCart() {
|
||||
this.isLoading = true;
|
||||
axios
|
||||
@@ -708,10 +911,9 @@ export default {
|
||||
this.hargaAsas = value.hargaasas;
|
||||
},
|
||||
deleteItem(value) {
|
||||
this.isLoadingPadam = true;
|
||||
this.formDelete.userId = localStorage.getItem("id");
|
||||
this.formDelete.lelongBidId = value.id;
|
||||
this.$refs.deleteClose.click();
|
||||
this.isLoading = true;
|
||||
axios
|
||||
.post("/deleteItem", this.formDelete, {
|
||||
headers: {
|
||||
@@ -719,8 +921,9 @@ export default {
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
this.isLoading = false;
|
||||
this.isLoadingPadam = false;
|
||||
if (response.data.success == true) {
|
||||
this.$refs.deleteClose.click();
|
||||
this.$swal.fire({
|
||||
icon: "success",
|
||||
title: "Surat Berjaya Dipadam",
|
||||
@@ -731,7 +934,13 @@ export default {
|
||||
});
|
||||
this.$emit("reloadComponent");
|
||||
} else if (response.data.success == false) {
|
||||
alert(response.data.message);
|
||||
console.log(response);
|
||||
this.$toast.add({
|
||||
severity: "error",
|
||||
summary: "Error",
|
||||
detail: "Please refresh page to get latest data.",
|
||||
life: 3000,
|
||||
});
|
||||
this.$emit("reloadComponent");
|
||||
}
|
||||
})
|
||||
@@ -750,7 +959,8 @@ export default {
|
||||
},
|
||||
updateItem(value) {
|
||||
this.v$.$validate();
|
||||
if (!this.v$.$error) {
|
||||
if (!this.v$.tambahanBidaan.$error) {
|
||||
this.isLoadingUbah = true;
|
||||
this.formEdit.lelongBidId = value.id;
|
||||
this.formEdit.hargabida = this.jumlahBidaan;
|
||||
axios
|
||||
@@ -760,7 +970,8 @@ export default {
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
this.isLoading = true;
|
||||
this.isLoadingUbah = false;
|
||||
// this.isLoading = true;
|
||||
this.$refs.editClose.click();
|
||||
console.log(response);
|
||||
this.$swal.fire({
|
||||
@@ -771,21 +982,29 @@ export default {
|
||||
allowOutsideClick: false,
|
||||
allowEscapeKey: false,
|
||||
});
|
||||
this.isLoading = false;
|
||||
// this.isLoading = false;
|
||||
this.$emit("reloadComponent");
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
this.isLoading = false;
|
||||
this.$toast.add({
|
||||
severity: "error",
|
||||
summary: "Error",
|
||||
detail: "Please refresh page to get latest data.",
|
||||
life: 3000,
|
||||
});
|
||||
this.isLoadingUbah = false;
|
||||
});
|
||||
} else {
|
||||
console.log("masuk error");
|
||||
}
|
||||
},
|
||||
bidderSelectBidItem() {
|
||||
if (this.isSuccess == true) {
|
||||
this.v$.$validate();
|
||||
if (!this.v$.$error) {
|
||||
this.loading = true;
|
||||
if (!this.v$.akadLelong.$error) {
|
||||
// this.loading = true;
|
||||
this.isLoadingDaftar = true;
|
||||
axios
|
||||
.post("/bidder/biditem", this.formRegisterBid, {
|
||||
headers: {
|
||||
@@ -793,24 +1012,43 @@ export default {
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
this.$refs.daftarBidaanClose.click();
|
||||
this.$swal.fire({
|
||||
icon: "success",
|
||||
title: "Bidaan Berjaya Didaftarkan",
|
||||
text: "Sila ke halaman rekod untuk senarai rekod bidaan.",
|
||||
confirmButtonColor: "#344871",
|
||||
confirmButtonText: "OK",
|
||||
allowOutsideClick: false,
|
||||
allowEscapeKey: false,
|
||||
});
|
||||
this.loading = false;
|
||||
console.log(response);
|
||||
this.$emit("reloadComponent");
|
||||
if (response.data.success == "success") {
|
||||
this.isLoadingDaftar = false;
|
||||
this.$refs.daftarBidaanClose.click();
|
||||
this.$swal.fire({
|
||||
icon: "success",
|
||||
title: "Bidaan Berjaya Didaftarkan",
|
||||
text: "Sila ke halaman rekod untuk senarai rekod bidaan.",
|
||||
confirmButtonColor: "#344871",
|
||||
confirmButtonText: "OK",
|
||||
allowOutsideClick: false,
|
||||
allowEscapeKey: false,
|
||||
});
|
||||
// this.loading = false;
|
||||
console.log(response);
|
||||
this.$emit("reloadComponent");
|
||||
} else {
|
||||
this.isLoadingDaftar = false;
|
||||
console.log(response);
|
||||
this.$toast.add({
|
||||
severity: "error",
|
||||
summary: "Error",
|
||||
detail: "Please refresh page to get latest data.",
|
||||
life: 3000,
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
this.$refs.daftarBidaanClose.click();
|
||||
this.loading = false;
|
||||
// this.$refs.daftarBidaanClose.click();
|
||||
// this.loading = false;
|
||||
console.log(error);
|
||||
this.$toast.add({
|
||||
severity: "error",
|
||||
summary: "Error",
|
||||
detail: "Please refresh page to get latest data.",
|
||||
life: 3000,
|
||||
});
|
||||
});
|
||||
} else {
|
||||
}
|
||||
@@ -829,4 +1067,14 @@ export default {
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.container-height {
|
||||
min-height: 70vh;
|
||||
}
|
||||
|
||||
.card-customer {
|
||||
box-shadow: 0 1px 3px 0 rgb(0 0 0 / 80%);
|
||||
}
|
||||
</style>
|
||||
@@ -1,31 +1,23 @@
|
||||
<template>
|
||||
<the-template>
|
||||
<!-- <base-card> -->
|
||||
<button
|
||||
<!-- <button
|
||||
v-on:click="toggleReloadComponent()"
|
||||
class="badge btn-secondary m-2"
|
||||
>
|
||||
Reload <i class="bi bi-arrow-clockwise"></i>
|
||||
</button>
|
||||
<!-- <cart-list
|
||||
v-bind:key="componentKey"
|
||||
v-on:reloadComponent="toggleReloadComponent"
|
||||
></cart-list> -->
|
||||
</button> -->
|
||||
<cart-list-new
|
||||
v-bind:key="componentKey"
|
||||
v-on:reloadComponent="toggleReloadComponent"
|
||||
></cart-list-new>
|
||||
<!-- </base-card> -->
|
||||
</the-template>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import CartList from "./CartList.vue";
|
||||
import CartListNew from "./CartListNew.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
"cart-list": CartList,
|
||||
"cart-list-new": CartListNew,
|
||||
},
|
||||
data() {
|
||||
|
||||
@@ -68,7 +68,7 @@
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
<span class="text-400"
|
||||
>Sila rujuk halamaan
|
||||
>Sila rujuk halaman
|
||||
<router-link v-bind:to="{ name: 'home' }">Utama</router-link>
|
||||
untuk jadual lelong.</span
|
||||
>
|
||||
|
||||
@@ -1,30 +0,0 @@
|
||||
<template>
|
||||
<Navbar />
|
||||
<div class="container" style="min-height: 80vh">
|
||||
<!-- <button
|
||||
class="btn btn-secondary float-start"
|
||||
style="margin: 5px"
|
||||
onclick="history.back()"
|
||||
>
|
||||
Kembali <i class="bi bi-backspace-fill"></i>
|
||||
</button> -->
|
||||
<h1>Keputusan <i class="bi bi-journal-text"></i></h1>
|
||||
<PaymentHistory />
|
||||
</div>
|
||||
<Footer />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PaymentHistory from "./PaymentHistory.vue";
|
||||
import Navbar from "../Navbar.vue";
|
||||
import Footer from "../Footer.vue";
|
||||
|
||||
export default {
|
||||
name: "IndexPaymentHistory",
|
||||
components: {
|
||||
PaymentHistory,
|
||||
Navbar,
|
||||
Footer,
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -33,6 +33,9 @@ import InputText from 'primevue/inputtext';
|
||||
import FileUpload from 'primevue/fileupload';
|
||||
import Checkbox from 'primevue/checkbox';
|
||||
import RadioButton from 'primevue/radiobutton';
|
||||
import Accordion from 'primevue/accordion';
|
||||
import AccordionTab from 'primevue/accordiontab';
|
||||
import Dialog from 'primevue/dialog';
|
||||
|
||||
import TheTemplate from './components/layouts/TheTemplate.vue'
|
||||
import BaseCard from './components/base/BaseCard.vue'
|
||||
@@ -61,6 +64,9 @@ app.component('FileUpload', FileUpload);
|
||||
app.component('Checkbox', Checkbox);
|
||||
app.component('Checkbox', Checkbox);
|
||||
app.component('RadioButton', RadioButton);
|
||||
app.component('Accordion', Accordion);
|
||||
app.component('AccordionTab', AccordionTab);
|
||||
app.component('Dialog', Dialog);
|
||||
|
||||
app.use(router).use(store).use(PrimeVue).use(VueSweetalert2).use(ToastService).mount('#app');
|
||||
// app.use(router).use(store).use(PrimeVue).use(ToastService).mount('#app');
|
||||
|
||||
Reference in New Issue
Block a user