new folder structure
This commit is contained in:
Amir
@@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<router-view></router-view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
#style {
|
||||
font-family: Avenir, Helvetica, Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
text-align: center;
|
||||
color: #2c3e50;
|
||||
}
|
||||
</style>
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand text-primary fw-bold" href="/">Sistem Lelong</a>
|
||||
<router-link class="navbar-brand text-primary fw-bold" to="/">Sistem Lelong</router-link>
|
||||
<button
|
||||
class="navbar-toggler"
|
||||
type="button"
|
||||
@@ -19,7 +19,7 @@
|
||||
<router-link class="nav-link" to="/">Home</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="/list">Senarai</a>
|
||||
<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>
|
||||
@@ -28,7 +28,7 @@
|
||||
<router-link class="nav-link" to="/bid-history">Rekod Bidaan</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<router-link class="nav-link" to="/result">Keputusan</router-link>
|
||||
<router-link class="nav-link" to="/payment-history">Keputusan</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<router-link class="nav-link" to="/profile">Profil</router-link>
|
||||
|
||||
@@ -0,0 +1,55 @@
|
||||
<template>
|
||||
<div class="container mt-5">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-7">
|
||||
<form>
|
||||
<h5>Login</h5>
|
||||
<div class="mb-3">
|
||||
<label for="exampleInputEmail1" class="form-label"
|
||||
>Email address</label
|
||||
>
|
||||
<input
|
||||
type="email"
|
||||
class="form-control"
|
||||
id="exampleInputEmail1"
|
||||
aria-describedby="emailHelp"
|
||||
/>
|
||||
<div id="emailHelp" class="form-text">
|
||||
We'll never share your email with anyone else.
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="exampleInputPassword1" class="form-label"
|
||||
>Password</label
|
||||
>
|
||||
<input
|
||||
type="password"
|
||||
class="form-control"
|
||||
id="exampleInputPassword1"
|
||||
/>
|
||||
</div>
|
||||
<div class="mb-3 form-check">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="form-check-input"
|
||||
id="exampleCheck1"
|
||||
/>
|
||||
<label class="form-check-label" for="exampleCheck1"
|
||||
>Check me out</label
|
||||
>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<router-link
|
||||
v-bind:to="{ name: 'register' }"
|
||||
class="btn btn-secondary"
|
||||
>Register</router-link
|
||||
>
|
||||
</div>
|
||||
<router-link v-bind:to="{ name: 'home' }" class="btn btn-primary"
|
||||
>Submit</router-link
|
||||
>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,50 @@
|
||||
<template>
|
||||
<div class="container mt-5">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-7">
|
||||
<form>
|
||||
<h5>Register</h5>
|
||||
<div class="mb-3">
|
||||
<label for="exampleInputEmail1" class="form-label"
|
||||
>Email address</label
|
||||
>
|
||||
<input
|
||||
type="email"
|
||||
class="form-control"
|
||||
id="exampleInputEmail1"
|
||||
aria-describedby="emailHelp"
|
||||
/>
|
||||
<div id="emailHelp" class="form-text">
|
||||
We'll never share your email with anyone else.
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="exampleInputPassword1" class="form-label"
|
||||
>Password</label
|
||||
>
|
||||
<input
|
||||
type="password"
|
||||
class="form-control"
|
||||
id="exampleInputPassword1"
|
||||
/>
|
||||
</div>
|
||||
<div class="mb-3 form-check">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="form-check-input"
|
||||
id="exampleCheck1"
|
||||
/>
|
||||
<label class="form-check-label" for="exampleCheck1"
|
||||
>Check me out</label
|
||||
>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<router-link v-bind:to="{ name: 'login' }" class="btn btn-secondary"
|
||||
>Login</router-link
|
||||
>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,15 @@
|
||||
<template>
|
||||
<div>
|
||||
<slot></slot>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
div {
|
||||
margin: 2rem auto;
|
||||
/* max-width: 40rem; */
|
||||
padding: 1rem;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.26);
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,7 @@
|
||||
<template>
|
||||
<the-template>
|
||||
<base-card>
|
||||
<p>this is the bid record</p>
|
||||
</base-card>
|
||||
</the-template>
|
||||
</template>
|
||||
@@ -0,0 +1,5 @@
|
||||
<template>
|
||||
<the-template>
|
||||
<p>this is the cart</p>
|
||||
</the-template>
|
||||
</template>
|
||||
@@ -0,0 +1,96 @@
|
||||
<template>
|
||||
<the-template>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<base-card>
|
||||
<div>
|
||||
<h5>Lelongan Hari Ini</h5>
|
||||
<table class="table table-bordered table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">#</th>
|
||||
<th scope="col">First</th>
|
||||
<th scope="col">Last</th>
|
||||
<th scope="col">Handle</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">1</th>
|
||||
<td>Mark</td>
|
||||
<td>Otto</td>
|
||||
<td>@mdo</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">2</th>
|
||||
<td>Jacob</td>
|
||||
<td>Thornton</td>
|
||||
<td>@fat</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">3</th>
|
||||
<td colspan="2">Larry the Bird</td>
|
||||
<td>@twitter</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</base-card>
|
||||
<base-card>
|
||||
<div>
|
||||
<h5>Lelongan Seterusnya</h5>
|
||||
<table class="table table-bordered table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">#</th>
|
||||
<th scope="col">First</th>
|
||||
<th scope="col">Last</th>
|
||||
<th scope="col">Handle</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">1</th>
|
||||
<td>Mark</td>
|
||||
<td>Otto</td>
|
||||
<td>@mdo</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">2</th>
|
||||
<td>Jacob</td>
|
||||
<td>Thornton</td>
|
||||
<td>@fat</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">3</th>
|
||||
<td colspan="2">Larry the Bird</td>
|
||||
<td>@twitter</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</base-card>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="col">
|
||||
<base-card>
|
||||
<div>
|
||||
<h5>Karat</h5>
|
||||
<p>Mutu</p>
|
||||
<p>Harga</p>
|
||||
</div>
|
||||
</base-card>
|
||||
<base-card>
|
||||
<div>
|
||||
<h5>Karat</h5>
|
||||
<p>Mutu</p>
|
||||
<p>Harga</p>
|
||||
</div>
|
||||
</base-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</the-template>
|
||||
</template>
|
||||
@@ -0,0 +1,69 @@
|
||||
<template>
|
||||
<div class="container-fluid bg-light">
|
||||
<footer
|
||||
class="
|
||||
d-flex
|
||||
flex-wrap
|
||||
justify-content-between
|
||||
align-items-center
|
||||
py-3
|
||||
my-4
|
||||
mb-0
|
||||
"
|
||||
>
|
||||
<p class="col-md-4 mb-0 text-muted justify-content-start">
|
||||
© 2022 Company, Inc
|
||||
</p>
|
||||
|
||||
<a
|
||||
href="/"
|
||||
class="
|
||||
col-md-4
|
||||
d-flex
|
||||
align-items-center
|
||||
justify-content-center
|
||||
mb-3 mb-md-0
|
||||
me-md-auto
|
||||
link-dark
|
||||
text-decoration-none
|
||||
"
|
||||
>
|
||||
<svg class="bi me-2" width="40" height="32">
|
||||
<!-- <use xlink:href="#bootstrap" /> -->
|
||||
<!-- <i class="bi bi-spotify"></i> -->
|
||||
</svg>
|
||||
</a>
|
||||
|
||||
<ul class="nav col-md-4 justify-content-center">
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link px-2 text-muted"
|
||||
>Permodalan Kelantan Berhad</a
|
||||
>
|
||||
</li>
|
||||
<!-- <li class="nav-item">
|
||||
<a href="#" class="nav-link px-2 text-muted">Home</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link px-2 text-muted">Features</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link px-2 text-muted">Pricing</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link px-2 text-muted">FAQs</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link px-2 text-muted">About</a>
|
||||
</li> -->
|
||||
</ul>
|
||||
</footer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.foot {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,50 @@
|
||||
<template>
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-light">
|
||||
<div class="container-fluid">
|
||||
<router-link class="navbar-brand" to="/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'}">Utama</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<router-link class="nav-link" v-bind:to="{name: 'list'}">Senarai</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<router-link class="nav-link" v-bind:to="{name: 'cart'}">Troli</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" v-bind:to="{name: 'profile'}">Profil</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<router-link class="nav-link" v-bind:to="{name: 'login'}">Log Keluar</router-link>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.nav-link:hover {
|
||||
color: blue;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,28 @@
|
||||
<template>
|
||||
<div>
|
||||
<the-header />
|
||||
<div>
|
||||
<div class="container pt-5">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</div>
|
||||
<the-footer />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TheHeader from "./TheHeader.vue";
|
||||
import TheFooter from "./TheFooter.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
"the-header": TheHeader,
|
||||
"the-footer": TheFooter,
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
<template>
|
||||
<the-template>
|
||||
<p>this is the list</p>
|
||||
</the-template>
|
||||
</template>
|
||||
@@ -0,0 +1,5 @@
|
||||
<template>
|
||||
<the-template>
|
||||
<p>this is the profile</p>
|
||||
</the-template>
|
||||
</template>
|
||||
@@ -0,0 +1,5 @@
|
||||
<template>
|
||||
<the-template>
|
||||
<p>this is the result</p>
|
||||
</the-template>
|
||||
</template>
|
||||
+14
-2
@@ -1,5 +1,6 @@
|
||||
import { createApp } from 'vue'
|
||||
import App from './App.vue'
|
||||
// import App from './App.vue'
|
||||
import Master from './Master.vue'
|
||||
import router from './router'
|
||||
import store from './store'
|
||||
// import useVuelidate from '@vuelidate/core'
|
||||
@@ -8,5 +9,16 @@ import "bootstrap/dist/css/bootstrap.css"
|
||||
import "bootstrap/dist/js/bootstrap.js"
|
||||
import 'bootstrap-icons/font/bootstrap-icons.css'
|
||||
|
||||
createApp(App).use(router).use(store).mount('#app')
|
||||
import TheTemplate from './components/layouts/TheTemplate.vue'
|
||||
import BaseCard from './components/base/BaseCard.vue'
|
||||
|
||||
const app = createApp(Master);
|
||||
|
||||
app.component('the-template', TheTemplate);
|
||||
app.component('base-card', BaseCard);
|
||||
|
||||
app.use(router).use(store).mount('#app');
|
||||
|
||||
// createApp(App).use(router).use(store).mount('#app')
|
||||
// createApp(Master).use(router).use(store).mount('#app')
|
||||
// createApp(App).use(router).use(store).use(useVuelidate).mount('#app')
|
||||
|
||||
+90
-89
@@ -1,99 +1,100 @@
|
||||
import { createRouter, createWebHistory, createMemoryHistory } from "vue-router";
|
||||
import Login from '../components/Login.vue';
|
||||
import Register from '../components/Register.vue';
|
||||
import Dashboard from './../components/Dashboard.vue';
|
||||
import Cart from './../components/Cart.vue';
|
||||
import List from './../components/List.vue'
|
||||
import Pay from '../components/Pay.vue'
|
||||
import Profile from './../components/Profile.vue'
|
||||
import BidHistory from '../components/BidHistory.vue'
|
||||
import Test from "../components/Test.vue"
|
||||
import IndexPaymentHistory from '../components/IndexPaymentHistory.vue'
|
||||
import {
|
||||
createRouter,
|
||||
createWebHistory,
|
||||
createMemoryHistory,
|
||||
} from "vue-router";
|
||||
import Login from "../components/Login.vue";
|
||||
import Register from "../components/Register.vue";
|
||||
import Dashboard from "./../components/Dashboard.vue";
|
||||
import Cart from "./../components/Cart.vue";
|
||||
import List from "./../components/List.vue";
|
||||
import Pay from "../components/Pay.vue";
|
||||
import Profile from "./../components/Profile.vue";
|
||||
import BidHistory from "../components/BidHistory.vue";
|
||||
import Test from "../components/Test.vue";
|
||||
import IndexPaymentHistory from "../components/IndexPaymentHistory.vue";
|
||||
// import Modals from './../components/Modal.vue'
|
||||
// import { Modal } from "bootstrap";
|
||||
|
||||
import TheLogin from '../components/authentication/TheLogin.vue'
|
||||
import TheRegister from '../components/authentication/TheRegister.vue'
|
||||
import TheHome from '../components/home/TheHome.vue'
|
||||
import TheCart from '../components/cart/TheCart.vue'
|
||||
import TheResult from '../components/result/TheResult.vue'
|
||||
import TheProfile from '../components/profile/TheProfile.vue'
|
||||
import TheBidRecord from '../components/bidRecord/TheBidRecord.vue'
|
||||
import TheList from '../components/list/TheList.vue'
|
||||
|
||||
const routes = [
|
||||
{
|
||||
path: '/login',
|
||||
name: 'Login',
|
||||
component: Login,
|
||||
// meta: { guest: true }
|
||||
},
|
||||
{
|
||||
path: '/register',
|
||||
name: 'Register',
|
||||
component: Register,
|
||||
// meta: { guest: true }
|
||||
{
|
||||
path: "/login",
|
||||
name: "login",
|
||||
component: TheLogin,
|
||||
},
|
||||
{
|
||||
path: "/register",
|
||||
name: "register",
|
||||
component: TheRegister,
|
||||
},
|
||||
{
|
||||
path: "/home",
|
||||
name: "home",
|
||||
component: TheHome,
|
||||
},
|
||||
|
||||
},
|
||||
{
|
||||
path: '/',
|
||||
name: 'Dashboard',
|
||||
component: Dashboard,
|
||||
// meta: { requiresAuth: true }
|
||||
},
|
||||
{
|
||||
path: "/cart",
|
||||
name: "cart",
|
||||
component: TheCart,
|
||||
},
|
||||
{
|
||||
path: "/list",
|
||||
name: "list",
|
||||
component: TheList,
|
||||
},
|
||||
{
|
||||
path: "/pay",
|
||||
name: "Pay",
|
||||
component: Pay,
|
||||
},
|
||||
{
|
||||
path: "/profile",
|
||||
name: "profile",
|
||||
component: TheProfile,
|
||||
},
|
||||
{
|
||||
path: "/bid-record",
|
||||
name: "bid-record",
|
||||
component: TheBidRecord,
|
||||
},
|
||||
{
|
||||
path: "/result",
|
||||
name: "result",
|
||||
component: TheResult,
|
||||
|
||||
{
|
||||
path: '/cart',
|
||||
name: 'Cart',
|
||||
component: Cart,
|
||||
// meta: { requiresAuth: true }
|
||||
|
||||
},
|
||||
{
|
||||
path: '/list',
|
||||
name: 'List',
|
||||
component: List,
|
||||
// meta: { requiresAuth: true }
|
||||
|
||||
},
|
||||
{
|
||||
path: '/pay',
|
||||
name: 'Pay',
|
||||
component: Pay,
|
||||
// meta: { requiresAuth: true }
|
||||
|
||||
},
|
||||
{
|
||||
path: '/profile',
|
||||
name: 'Profile',
|
||||
component: Profile,
|
||||
// meta: { requiresAuth: true }
|
||||
|
||||
},
|
||||
{
|
||||
path: '/bid-history',
|
||||
name: 'BidHistory',
|
||||
component: BidHistory,
|
||||
// meta: { requiresAuth: true }
|
||||
|
||||
},
|
||||
{
|
||||
path: '/payment-history',
|
||||
name: 'PaymentHistory',
|
||||
component: IndexPaymentHistory,
|
||||
// meta: { requiresAuth: true }
|
||||
|
||||
},
|
||||
{
|
||||
path: '/test',
|
||||
name: 'test',
|
||||
component: Test,
|
||||
// meta: { requiresAuth: true }
|
||||
|
||||
},
|
||||
// {
|
||||
// name: 'Modal',
|
||||
// component: Modals,
|
||||
// }
|
||||
|
||||
]
|
||||
},
|
||||
{
|
||||
path: "/payment-history",
|
||||
name: "payment-history",
|
||||
component: IndexPaymentHistory,
|
||||
},
|
||||
{
|
||||
path: "/test",
|
||||
name: "test",
|
||||
component: Test,
|
||||
},
|
||||
// {
|
||||
// name: 'Modal',
|
||||
// component: Modals,
|
||||
// }
|
||||
];
|
||||
|
||||
const router = createRouter({
|
||||
// history: createWebHistory(process.env.BASE_URL),
|
||||
history: createMemoryHistory(),
|
||||
routes,
|
||||
})
|
||||
// history: createWebHistory(process.env.BASE_URL),
|
||||
history: createWebHistory(),
|
||||
// history: createMemoryHistory(),
|
||||
routes,
|
||||
});
|
||||
|
||||
// function loggedIn() {
|
||||
// return true;
|
||||
@@ -117,4 +118,4 @@ const router = createRouter({
|
||||
// }
|
||||
// })
|
||||
|
||||
export default router
|
||||
export default router;
|
||||
|
||||
Reference in New Issue
Block a user