redesign home page
This commit is contained in:
Amir
@@ -5125,18 +5125,18 @@
|
||||
}
|
||||
|
||||
.p-inline-message {
|
||||
padding: 0.75rem 0.75rem;
|
||||
padding: 0.4rem 0.9rem;
|
||||
margin: 0;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.p-inline-message.p-inline-message-info {
|
||||
background: #e9e9ff;
|
||||
border: solid #696cff;
|
||||
background: #eaf0f9;
|
||||
border: solid #2f68c5;
|
||||
border-width: 0px;
|
||||
color: #696cff;
|
||||
color: #2f68c5;
|
||||
}
|
||||
.p-inline-message.p-inline-message-info .p-inline-message-icon {
|
||||
color: #696cff;
|
||||
color: #2f68c5;
|
||||
}
|
||||
.p-inline-message.p-inline-message-success {
|
||||
background: #e4f8f0;
|
||||
|
||||
+13
-5
@@ -18,12 +18,20 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
/*
|
||||
|
||||
#1e417b //main color nav
|
||||
#2f68c5 //main button
|
||||
#eaf0f9 //background inline message
|
||||
|
||||
*/
|
||||
#app {
|
||||
font-family: Inter, Helvetica, Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
text-align: center;
|
||||
color: #2c3e50;
|
||||
/* font-family: Inter, Helvetica, Arial, sans-serif; */
|
||||
/* -webkit-font-smoothing: antialiased; */
|
||||
/* -moz-osx-font-smoothing: grayscale; */
|
||||
/* text-align: center; */
|
||||
/* color: #2c3e50; */
|
||||
/* background-color: #e8ebef; */
|
||||
}
|
||||
|
||||
|
||||
@@ -1,111 +1,45 @@
|
||||
<template>
|
||||
<div
|
||||
v-if="loading"
|
||||
style="min-height: 60vh; display: grid; place-items: center"
|
||||
>
|
||||
<div class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div v-else class="card text-center"> -->
|
||||
<!-- <div class="card-header fw-bold text-uppercase">Karat Semasa</div>
|
||||
<div class="card-body">
|
||||
<table class="table table-bordered table-hover">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th>No.</th>
|
||||
<th>Karat</th>
|
||||
<th>Keterangan</th>
|
||||
<th>Harga</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody v-for="(karats, index) in karat" :key="karats.id">
|
||||
<tr>
|
||||
<td scope="row">{{ index + 1 }}</td>
|
||||
<td scope="row">{{ karats.karat }}</td>
|
||||
<td scope="row">{{ karats.keterangan }}</td>
|
||||
<td scope="row">RM{{ karats.harga }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div> -->
|
||||
<!-- <div v-else class="grid-container">
|
||||
<div v-for="data in karat" v-bind:key="data.id" class="card">
|
||||
<p>{{ data.karat }}</p>
|
||||
<p>RM{{ data.harga }}</p>
|
||||
</div>
|
||||
</div> -->
|
||||
<div v-else>
|
||||
<base-card>
|
||||
<table class="table table-bordered table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Bil</th>
|
||||
<th scope="col">Karat</th>
|
||||
<th scope="col">Harga</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(data, index) in karat" v-bind:key="data.id">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ data.karat }}</td>
|
||||
<td>{{ data.harga }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</base-card>
|
||||
</div>
|
||||
<Card>
|
||||
<template #title>
|
||||
<div class="flex justify-content-between flex-wrap card-container">
|
||||
<div class="font-normal">Harga Emas Lelongan</div>
|
||||
<Button
|
||||
class="button-standard p-button-rounded p-button-outlined"
|
||||
icon="pi pi-refresh"
|
||||
@click="toggleReloadComponent()"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<template #content>
|
||||
<current-karat-detail v-bind:key="componentKey"></current-karat-detail>
|
||||
</template>
|
||||
</Card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import CurrentKaratDetail from "./CurrentKaratDetail.vue";
|
||||
|
||||
export default {
|
||||
name: "Karat",
|
||||
components: {
|
||||
"current-karat-detail": CurrentKaratDetail,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
karat: Array,
|
||||
loading: false,
|
||||
componentKey: 0,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getKarat();
|
||||
},
|
||||
methods: {
|
||||
async getKarat() {
|
||||
this.loading = true;
|
||||
await axios
|
||||
.get("/karat", {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
this.karat = response.data;
|
||||
this.loading = false;
|
||||
console.log(response);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
toggleReloadComponent() {
|
||||
this.componentKey += 1;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: auto auto;
|
||||
justify-content: center;
|
||||
.button-standard {
|
||||
height: 30px !important;
|
||||
width: 30px !important;
|
||||
margin-top: 3px !important;
|
||||
}
|
||||
|
||||
.card {
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.26);
|
||||
padding: 20px;
|
||||
margin: 10px;
|
||||
width: 140px;
|
||||
height: 130px;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,90 @@
|
||||
<template>
|
||||
<div v-if="isLoading" class="fadein animation-duration-400">
|
||||
<div class="d-flex justify-content-center">
|
||||
<div class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div v-if="responseData" class="fadein animation-duration-400">
|
||||
<InlineMessage class="mb-2" severity="info">Kemaskini pada {{ updatedTime }}</InlineMessage>
|
||||
|
||||
<div class="overflow-x-scroll">
|
||||
<table class="table table-bordered table-hover">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td>Bil</td>
|
||||
<td>Karat</td>
|
||||
<td style="min-width: 100px">Harga</td>
|
||||
</tr>
|
||||
<tr v-for="(data, index) in listKarat" v-bind:key="data.id">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ data.karat }}</td>
|
||||
<td>RM {{ data.harga2 }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<table class="table table-bordered table-hover">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td scope="col">Bil</td>
|
||||
<td scope="col">Karat</td>
|
||||
<td scope="col">Harga</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="5" class="text-center">Tiada Data</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
listKarat: Array,
|
||||
updatedTime: String,
|
||||
isLoading: false,
|
||||
responseData: false,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getKarat();
|
||||
},
|
||||
methods: {
|
||||
async getKarat() {
|
||||
this.isLoading = true;
|
||||
await axios
|
||||
.get("/karat", {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
if (response.data.success == true) {
|
||||
this.updatedTime = response.data.update_time;
|
||||
this.listKarat = response.data.karat;
|
||||
this.isLoading = false;
|
||||
this.responseData = true;
|
||||
} else {
|
||||
this.isLoading = false;
|
||||
this.responseData = false;
|
||||
}
|
||||
//
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -1,78 +1,53 @@
|
||||
<template>
|
||||
<div
|
||||
v-if="loading"
|
||||
style="min-height: 20vh; display: grid; place-items: center"
|
||||
>
|
||||
<div class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
<table v-else class="table table-bordered table-hover">
|
||||
<thead class="table-body">
|
||||
<tr>
|
||||
<th>Bil</th>
|
||||
<th>Cawangan</th>
|
||||
<th>Tarikh</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody v-if="responseData">
|
||||
<tr v-for="(data, index) in response" :key="data.id">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ data.caw_name }}</td>
|
||||
<td>{{ data.tarikh_lelong }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody v-else>
|
||||
<tr>
|
||||
<td colspan="4">Tiada Data</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<Card>
|
||||
<template #title
|
||||
><div
|
||||
class="
|
||||
flex
|
||||
justify-content-between
|
||||
flex-wrap
|
||||
card-container
|
||||
purple-container
|
||||
"
|
||||
>
|
||||
<div class="font-normal">Lelongan Seterusnya</div>
|
||||
<Button
|
||||
class="button-standard p-button-rounded p-button-outlined"
|
||||
icon="pi pi-refresh"
|
||||
@click="toggleReloadComponent()"
|
||||
/></div
|
||||
></template>
|
||||
<template #content>
|
||||
<lelong-next-detail v-bind:key="componentKey"></lelong-next-detail>
|
||||
</template>
|
||||
</Card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import LelongNextDetail from "./LelongNextDetail.vue";
|
||||
|
||||
export default {
|
||||
name: "Card",
|
||||
props: {
|
||||
msg: String,
|
||||
masa: String,
|
||||
components: {
|
||||
"lelong-next-detail": LelongNextDetail,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
response: Array,
|
||||
cawangan: String,
|
||||
loading: false,
|
||||
responseData: false,
|
||||
componentKey: 0,
|
||||
};
|
||||
},
|
||||
mounted: function () {
|
||||
this.liveData();
|
||||
},
|
||||
methods: {
|
||||
liveData() {
|
||||
this.loading = true;
|
||||
axios
|
||||
.get("/listcawlelongnext", {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
if (response.data.success == true) {
|
||||
this.responseData = true;
|
||||
this.response = response.data.lelong;
|
||||
console.log(response.data);
|
||||
this.loading = false;
|
||||
} else {
|
||||
this.loading = false;
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
toggleReloadComponent() {
|
||||
this.componentKey += 1;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.button-standard {
|
||||
height: 30px !important;
|
||||
width: 30px !important;
|
||||
margin-top: 3px !important;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,84 @@
|
||||
<template>
|
||||
<div v-if="isLoading" class="fadein animation-duration-400">
|
||||
<div class="d-flex justify-content-center">
|
||||
<div class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="fadein animation-duration-400">
|
||||
<div class="overflow-x-scroll">
|
||||
<table
|
||||
v-if="responseData"
|
||||
class="table table-sm table-bordered table-hover"
|
||||
>
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td>Bil</td>
|
||||
<td style="min-width: 200px">Cawangan</td>
|
||||
<td style="min-width: 120px">Tarikh</td>
|
||||
</tr>
|
||||
<tr v-for="(data, index) in response" :key="data.id">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ data.caw_name }}</td>
|
||||
<td>{{ data.tarikh_lelong }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<table v-else class="table table-sm table-bordered table-hover">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td>Bil</td>
|
||||
<td>Cawangan</td>
|
||||
<td>Tarikh</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="4" class="text-center">Tiada Data</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
responseData: false,
|
||||
response: Array,
|
||||
isLoading: false,
|
||||
};
|
||||
},
|
||||
mounted: function () {
|
||||
this.liveData();
|
||||
},
|
||||
methods: {
|
||||
liveData() {
|
||||
this.isLoading = true;
|
||||
axios
|
||||
.get("/listcawlelongnext", {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
if (response.data.success == true) {
|
||||
this.responseData = true;
|
||||
this.response = response.data.lelong;
|
||||
// console.log(response.data);
|
||||
this.isLoading = false;
|
||||
} else {
|
||||
this.isLoading = false;
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -1,88 +1,59 @@
|
||||
<template>
|
||||
<div
|
||||
v-if="loading"
|
||||
style="min-height: 20vh; display: grid; place-items: center"
|
||||
>
|
||||
<div class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<table class="table table-bordered table-hover">
|
||||
<thead class="table-body">
|
||||
<tr>
|
||||
<th>Bil</th>
|
||||
<th>Cawangan</th>
|
||||
<th>Masa Mula</th>
|
||||
<th>Masa Tamat</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody v-if="responseData">
|
||||
<tr v-for="(item, index) in response" :key="item.id">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ item.caw_name }}</td>
|
||||
<td>{{ item.masamula_lelong }}</td>
|
||||
<td>{{ item.masatamat_lelong }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody v-else>
|
||||
<tr>
|
||||
<td colspan="100">Tiada Data</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<router-link v-bind:to="{name: 'list'}" class="btn btn-primary">Lihat Senarai</router-link>
|
||||
</div>
|
||||
<Card style="margin-bottom: 1em">
|
||||
<template #title>
|
||||
<div class="flex justify-content-between flex-wrap card-container">
|
||||
<div class="font-normal">Lelongan Hari Ini : {{ date }}</div>
|
||||
<Button
|
||||
class="button-standard p-button-rounded p-button-outlined"
|
||||
icon="pi pi-refresh"
|
||||
@click="toggleReloadComponent()"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<template #content>
|
||||
<lelong-today-detail v-bind:key="componentKey"></lelong-today-detail>
|
||||
</template>
|
||||
</Card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import LelongTodayDetail from "./LelongTodayDetail.vue";
|
||||
|
||||
export default {
|
||||
name: "Card",
|
||||
props: {
|
||||
msg: String,
|
||||
masa: String,
|
||||
components: {
|
||||
"lelong-today-detail": LelongTodayDetail,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
response: Array,
|
||||
cawangan: String,
|
||||
loading: false,
|
||||
responseData: false,
|
||||
date: String,
|
||||
componentKey: 0,
|
||||
};
|
||||
},
|
||||
mounted: function () {
|
||||
this.liveData();
|
||||
created() {
|
||||
this.getDate();
|
||||
},
|
||||
|
||||
methods: {
|
||||
liveData() {
|
||||
this.loading = true;
|
||||
axios
|
||||
.get("/listcawlelongtoday", {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
if (response.data.success == true) {
|
||||
this.responseData = true;
|
||||
this.response = response.data.lelong;
|
||||
console.log(response.data);
|
||||
localStorage.setItem(
|
||||
"lelong_id",
|
||||
response.data.lelong[0].lelong_id
|
||||
);
|
||||
this.loading = false;
|
||||
} else {
|
||||
this.loading = false;
|
||||
console.log(response.data.success);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
toggleReloadComponent() {
|
||||
this.componentKey += 1;
|
||||
},
|
||||
getDate() {
|
||||
var today = new Date();
|
||||
var dd = String(today.getDate()).padStart(2, "0");
|
||||
var mm = String(today.getMonth() + 1).padStart(2, "0"); //January is 0!
|
||||
var yyyy = today.getFullYear();
|
||||
|
||||
today = yyyy + "-" + mm + "-" + dd;
|
||||
this.date = today;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.button-standard {
|
||||
height: 30px !important;
|
||||
width: 30px !important;
|
||||
margin-top: 3px !important;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,95 @@
|
||||
<template>
|
||||
<div v-if="isLoading" class="fadein animation-duration-400">
|
||||
<div class="d-flex justify-content-center">
|
||||
<div class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="fadein animation-duration-300">
|
||||
<div v-if="responseData">
|
||||
<div class="overflow-x-scroll">
|
||||
<table class="table table-sm table-bordered table-hover">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td>Bil</td>
|
||||
<td style="min-width: 200px">Cawangan</td>
|
||||
<td style="min-width: 120px">Masa Mula</td>
|
||||
<td style="min-width: 120px">Masa Tamat</td>
|
||||
</tr>
|
||||
<tr v-for="(item, index) in response" :key="item.id">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ item.caw_name }}</td>
|
||||
<td>{{ item.masamula_lelong }}</td>
|
||||
<td>{{ item.masatamat_lelong }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<Button label="Lihat Senarai" class="p-button-sm" v-on:click="toList()" />
|
||||
</div>
|
||||
<div v-else>
|
||||
<table class="table table-sm table-bordered table-hover">
|
||||
<tbody>
|
||||
<tr class="table-light">
|
||||
<td>Bil</td>
|
||||
<td>Cawangan</td>
|
||||
<td>Masa Mula</td>
|
||||
<td>Masa Tamat</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="100" class="text-center">Tiada Data</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
responseData: false,
|
||||
isLoading: false,
|
||||
response: Array,
|
||||
};
|
||||
},
|
||||
mounted: function () {
|
||||
this.liveData();
|
||||
},
|
||||
methods: {
|
||||
liveData() {
|
||||
this.isLoading = true;
|
||||
axios
|
||||
.get("/listcawlelongtoday", {
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
if (response.data.success == true) {
|
||||
this.responseData = true;
|
||||
this.response = response.data.lelong;
|
||||
localStorage.setItem(
|
||||
"lelong_id",
|
||||
response.data.lelong[0].lelong_id
|
||||
);
|
||||
this.isLoading = false;
|
||||
} else {
|
||||
this.isLoading = false;
|
||||
console.log(response.data.success);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
toList() {
|
||||
this.$router.push({ name: "list" });
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -1,68 +1,24 @@
|
||||
<template>
|
||||
<base-card
|
||||
><div>
|
||||
<h4 class="text-success">Tahniah! Bidaan anda menang.</h4>
|
||||
<h5 class="text-success">
|
||||
Sila lihat butiran dihalaman
|
||||
<span
|
||||
><router-link v-bind:to="{ name: 'result' }"
|
||||
>keputusan</router-link
|
||||
></span
|
||||
>
|
||||
</h5>
|
||||
<p class="fst-italic">
|
||||
<small>*Bayaran mesti diselesaikan sebelum 3:30pm.</small>
|
||||
</p>
|
||||
</div></base-card
|
||||
<Message severity="warn" :closable="false"
|
||||
>Tahniah, bidaan anda menang!
|
||||
<a class="ml-1 text-blue" @click="toResult()" href="#"
|
||||
><span class="underline">Selesaikan pembayaran sekarang.</span></a
|
||||
></Message
|
||||
>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import lelongId from "@/store/modules/lelongId";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// form: {
|
||||
// lelong_id: 4,
|
||||
// user_id: 9
|
||||
// }
|
||||
lelongId: 0,
|
||||
};
|
||||
},
|
||||
mounted: function () {
|
||||
// this.resultStatus();
|
||||
return {};
|
||||
},
|
||||
mounted: function () {},
|
||||
methods: {
|
||||
resultStatus() {
|
||||
// console.log(localStorage.getItem("lelong_id"));
|
||||
if (localStorage.getItem("lelong_id" == null)) {
|
||||
this.lelongId = 0;
|
||||
} else {
|
||||
this.lelongId = localStorage.getItem("lelong_id");
|
||||
}
|
||||
|
||||
this.loading = true;
|
||||
axios
|
||||
.get(
|
||||
"/resultStatus/" + localStorage.getItem("id") + "/" + this.lelongId,
|
||||
{
|
||||
headers: {
|
||||
Authorization: "Bearer " + localStorage.getItem("token"),
|
||||
},
|
||||
}
|
||||
)
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
if (response.data.success == true) {
|
||||
} else {
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
// this.loading = false;
|
||||
console.log(error);
|
||||
});
|
||||
// "/resultStatus/" + localStorage.getItem("id") + "/" + this.lelongId,
|
||||
},
|
||||
toResult() {
|
||||
this.$router.push({ name: "result" });
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,35 +1,21 @@
|
||||
<template>
|
||||
<the-template>
|
||||
<div class="container">
|
||||
<div class="row mb-3 justify-content-center">
|
||||
<div class="col-8">
|
||||
<!-- <result-notification></result-notification> -->
|
||||
</div>
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<result-notification></result-notification>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<h4>Lelongan Hari Ini: {{ date }}</h4>
|
||||
<base-card>
|
||||
<lelong-today></lelong-today>
|
||||
</base-card>
|
||||
<h4 class="mt-4">Lelongan Seterusnya</h4>
|
||||
<base-card>
|
||||
<lelong-next></lelong-next>
|
||||
</base-card>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="col">
|
||||
<h4 class="ps-3">Harga Emas Lelongan</h4>
|
||||
<current-karat></current-karat>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-7">
|
||||
<lelong-today></lelong-today>
|
||||
<lelong-next></lelong-next>
|
||||
</div>
|
||||
<div class="col-12 lg:col-5">
|
||||
<current-karat></current-karat>
|
||||
</div>
|
||||
</div>
|
||||
</the-template>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import LelongToday from "./LelongToday.vue";
|
||||
import LelongNext from "./LelongNext.vue";
|
||||
import CurrentKarat from "./CurrentKarat.vue";
|
||||
@@ -42,28 +28,6 @@ export default {
|
||||
"current-karat": CurrentKarat,
|
||||
"result-notification": ResultNotification,
|
||||
},
|
||||
name: "Karat",
|
||||
data() {
|
||||
return {
|
||||
karat: Array,
|
||||
loading: false,
|
||||
date: "",
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getDate();
|
||||
},
|
||||
methods: {
|
||||
getDate() {
|
||||
var today = new Date();
|
||||
var dd = String(today.getDate()).padStart(2, "0");
|
||||
var mm = String(today.getMonth() + 1).padStart(2, "0"); //January is 0!
|
||||
var yyyy = today.getFullYear();
|
||||
|
||||
today = yyyy + "-" + mm + "-" + dd;
|
||||
this.date = today;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
@@ -1,69 +1,201 @@
|
||||
<template>
|
||||
<header class="header">
|
||||
<div class="company-title" type="button" v-on:click="toHome()">
|
||||
<div class="logo-title">eLelong</div>
|
||||
<img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" />
|
||||
</div>
|
||||
<nav class="main-nav">
|
||||
<ul class="main-nav-list">
|
||||
<li>
|
||||
<router-link class="main-nav-link" v-bind:to="{ name: 'home' }"
|
||||
>Utama</router-link
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<router-link class="main-nav-link" v-bind:to="{ name: 'list' }"
|
||||
>Senarai</router-link
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<router-link class="main-nav-link" v-bind:to="{ name: 'cart' }"
|
||||
>Troli</router-link
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<router-link class="main-nav-link" v-bind:to="{ name: 'bid-record' }"
|
||||
>Rekod</router-link
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<router-link class="main-nav-link" v-bind:to="{ name: 'result' }"
|
||||
>Keputusan</router-link
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<router-link class="main-nav-link" v-bind:to="{ name: 'login' }"
|
||||
>Login</router-link
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="profile-title">
|
||||
<div class="dropdown">
|
||||
<div
|
||||
class="dropdown-toggle"
|
||||
type="button"
|
||||
data-bs-toggle="dropdown"
|
||||
aria-expanded="false"
|
||||
<Sidebar v-model:visible="visibleRight" position="right">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="text-center">Hai, {{ username }}</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'home' }"
|
||||
>Utama</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'list' }"
|
||||
>Senarai</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'cart' }"
|
||||
>Troli</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'bid-record' }"
|
||||
>Rekod</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'result' }"
|
||||
>Keputusan</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<router-link
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-bind:to="{ name: 'profile' }"
|
||||
>Profil</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<a
|
||||
class="main-nav-link main-nav-link-sidebar"
|
||||
v-on:click="doLogout()"
|
||||
href="#"
|
||||
>Loq Keluar</a
|
||||
>
|
||||
<i class="bi bi-person-circle me-1"></i>{{ username }}
|
||||
</div>
|
||||
<ul class="dropdown-menu">
|
||||
<li>
|
||||
<div type="button" class="dropdown-item" v-on:click="toProfile()">
|
||||
Profil <i class="bi bi-person-workspace"></i>
|
||||
</div>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
<li>
|
||||
<div type="button" v-on:click="doLogout()" class="dropdown-item">
|
||||
Log Keluar <i class="bi bi-box-arrow-right"></i>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
</Sidebar>
|
||||
<div class="card hidden lg:flex border-none">
|
||||
<div
|
||||
class="
|
||||
flex
|
||||
justify-content-between
|
||||
px-3
|
||||
md:px-6
|
||||
h-3rem
|
||||
flex-wrap
|
||||
main-color
|
||||
"
|
||||
>
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
<div class="company-title" type="button" v-on:click="toHome()">
|
||||
<div class="logo-title">eLelong</div>
|
||||
<img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
<nav class="main-nav hidden lg:flex">
|
||||
<ul class="main-nav-list">
|
||||
<li>
|
||||
<router-link class="main-nav-link" v-bind:to="{ name: 'home' }"
|
||||
>Utama</router-link
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<router-link class="main-nav-link" v-bind:to="{ name: 'list' }"
|
||||
>Senarai</router-link
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<router-link class="main-nav-link" v-bind:to="{ name: 'cart' }"
|
||||
>Troli</router-link
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<router-link
|
||||
class="main-nav-link"
|
||||
v-bind:to="{ name: 'bid-record' }"
|
||||
>Rekod</router-link
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<router-link class="main-nav-link" v-bind:to="{ name: 'result' }"
|
||||
>Keputusan</router-link
|
||||
>
|
||||
</li>
|
||||
<!-- <li>
|
||||
<router-link class="main-nav-link" v-bind:to="{ name: 'login' }"
|
||||
>Login</router-link
|
||||
>
|
||||
</li> -->
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
<div class="profile-title hidden lg:flex">
|
||||
<div class="dropdown">
|
||||
<div
|
||||
class="dropdown-toggle"
|
||||
type="button"
|
||||
data-bs-toggle="dropdown"
|
||||
aria-expanded="false"
|
||||
>
|
||||
<i class="bi bi-person-circle me-1"></i>{{ username }}
|
||||
</div>
|
||||
<ul class="dropdown-menu">
|
||||
<li>
|
||||
<div
|
||||
type="button"
|
||||
class="dropdown-item"
|
||||
v-on:click="toProfile()"
|
||||
>
|
||||
Profil <i class="bi bi-person-workspace"></i>
|
||||
</div>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
<li>
|
||||
<div
|
||||
type="button"
|
||||
v-on:click="doLogout()"
|
||||
class="dropdown-item"
|
||||
>
|
||||
Log Keluar <i class="bi bi-box-arrow-right"></i>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="flex align-items-center justify-content-center">
|
||||
<i
|
||||
class="pi pi-bars text-white lg:hidden"
|
||||
@click="visibleRight = true"
|
||||
></i>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="card sticky lg:hidden md:flex border-none">
|
||||
<div
|
||||
class="
|
||||
flex
|
||||
justify-content-between
|
||||
px-3
|
||||
md:px-6
|
||||
h-3rem
|
||||
flex-wrap
|
||||
main-color
|
||||
"
|
||||
>
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
<div class="company-title" type="button" v-on:click="toHome()">
|
||||
<div class="logo-title">eLelong</div>
|
||||
<img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex align-items-center justify-content-center">
|
||||
<i
|
||||
class="pi pi-bars text-white lg:hidden"
|
||||
@click="visibleRight = true"
|
||||
></i>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
class="
|
||||
flex
|
||||
justify-content-between
|
||||
px-3
|
||||
md:px-6
|
||||
h-2rem
|
||||
flex-wrap
|
||||
bg-red-500
|
||||
"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -72,6 +204,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
username: localStorage.getItem("username"),
|
||||
visibleRight: false,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
@@ -138,6 +271,20 @@ router-link:hover {
|
||||
color: blue;
|
||||
} */
|
||||
|
||||
@media screen and (max-width: 769px) {
|
||||
.header {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.main-color {
|
||||
background-color: #1e417b;
|
||||
}
|
||||
|
||||
.border-none {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@@ -191,6 +338,10 @@ router-link:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.main-nav-link-sidebar:hover {
|
||||
color: #1e417b !important;
|
||||
}
|
||||
|
||||
a.router-link-exact-active {
|
||||
background: #bbc2d0;
|
||||
color: #1d3461;
|
||||
|
||||
@@ -30,6 +30,7 @@ export default {
|
||||
/* overflow: hidden; */
|
||||
padding: 0 0 100px;
|
||||
min-height: 100vh;
|
||||
background: #eff3f8;
|
||||
}
|
||||
|
||||
.footer {
|
||||
|
||||
+23
-5
@@ -8,32 +8,50 @@ import './interceptors/axios'
|
||||
import "bootstrap/dist/css/bootstrap.css"
|
||||
import "bootstrap/dist/js/bootstrap.js"
|
||||
import 'bootstrap-icons/font/bootstrap-icons.css'
|
||||
import VueSweetalert2 from 'vue-sweetalert2';
|
||||
import 'sweetalert2/dist/sweetalert2.min.css';
|
||||
// import VueSweetalert2 from 'vue-sweetalert2';
|
||||
// import 'sweetalert2/dist/sweetalert2.min.css';
|
||||
import PrimeVue from 'primevue/config';
|
||||
|
||||
import '../public/themes/lara-light-blue/theme.css'
|
||||
import 'primevue/resources/primevue.min.css'
|
||||
import 'primeicons/primeicons.css'
|
||||
import 'primeflex/primeflex.css'
|
||||
import ToastService from 'primevue/toastservice';
|
||||
|
||||
import Card from 'primevue/card';
|
||||
import DataTable from 'primevue/datatable';
|
||||
import Column from 'primevue/column';
|
||||
import Button from 'primevue/button';
|
||||
import ProgressBar from 'primevue/progressbar';
|
||||
import Toast from 'primevue/toast';
|
||||
import Sidebar from 'primevue/sidebar';
|
||||
import Message from 'primevue/message';
|
||||
import InlineMessage from 'primevue/inlinemessage';
|
||||
|
||||
|
||||
import TheTemplate from './components/layouts/TheTemplate.vue'
|
||||
import BaseCard from './components/base/BaseCard.vue'
|
||||
import TermsAndConditions from './components/authentication/TermsAndConditions.vue'
|
||||
|
||||
// const app = createApp(App);
|
||||
const app = createApp(Master);
|
||||
const app = createApp(App);
|
||||
// const app = createApp(Master);
|
||||
|
||||
app.component('the-template', TheTemplate);
|
||||
app.component('base-card', BaseCard);
|
||||
app.component('terms-and-conditions', TermsAndConditions);
|
||||
|
||||
app.component('Card', Card);
|
||||
app.component('Button', Button);
|
||||
app.component('DataTable', DataTable);
|
||||
app.component('Column', Column);
|
||||
app.component('ProgressBar', ProgressBar);
|
||||
app.component('Toast', Toast);
|
||||
app.component('Sidebar', Sidebar);
|
||||
app.component('Message', Message);
|
||||
app.component('InlineMessage', InlineMessage);
|
||||
|
||||
app.use(router).use(store).use(PrimeVue).use(VueSweetalert2).mount('#app');
|
||||
// app.use(router).use(store).use(PrimeVue).use(VueSweetalert2).mount('#app');
|
||||
app.use(router).use(store).use(PrimeVue).use(ToastService).mount('#app');
|
||||
|
||||
// createApp(App).use(router).use(store).mount('#app')
|
||||
// createApp(Master).use(router).use(store).mount('#app')
|
||||
|
||||
Reference in New Issue
Block a user