fix profile

This commit is contained in:
Amir
2022-10-11 00:37:24 +08:00
parent 1d98851bdd
commit 00e64f97c9
5 changed files with 93 additions and 69 deletions
+1 -1
View File
@@ -36,7 +36,7 @@
<td scope="col">Harga</td>
</tr>
<tr>
<td colspan="5" class="text-center">Tiada Data</td>
<td colspan="5" class="text-center text-500">Tiada Data</td>
</tr>
</tbody>
</table>
+1 -1
View File
@@ -33,7 +33,7 @@
<td>Tarikh</td>
</tr>
<tr>
<td colspan="4" class="text-center">Tiada Data</td>
<td colspan="4" class="text-center text-500">Tiada Data</td>
</tr>
</tbody>
</table>
+1 -1
View File
@@ -38,7 +38,7 @@
<td>Masa Tamat</td>
</tr>
<tr>
<td colspan="100" class="text-center">Tiada Data</td>
<td colspan="100" class="text-center text-500">Tiada Data</td>
</tr>
</tbody>
</table>
+88 -66
View File
@@ -1,69 +1,93 @@
<template>
<the-template>
<base-card>
<div v-if="loading" class="fadein animation-duration-400">
<div
v-if="loading"
style="min-height: 70vh; display: grid; place-items: center"
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 v-else class="container">
<h5>PROFIL</h5>
<div class="card-body">
<!-- <img
src="../../assets/profile.png"
alt="profile photo"
style="width: 225px; height: 230px"
/> -->
<div v-if="this.status">
<div class="row justify-content-center mt-4 mb-1">
<div class="col-2 text_border text-start" style="border: none">
Nama
</div>
<div else style="min-height: 70vh">
<div v-if="status">
<div
class="
flex
align-items-center
justify-content-center
container-height
fadein
animation-duration-400
"
>
<Card>
<template #title>
<div class="text-center">Profil Pengguna</div>
</template>
<template #content>
<div class="text-center">
<Avatar icon="pi pi-user" size="xlarge" />
<div class="mt-3">
<div
class="
grid
col-11 col-offset-1
lg:col-8 lg:col-offset-2
justify-content-center
"
>
<div class="col-12 lg:col-5 text-start text-400">Nama</div>
<div class="col-12 lg:col-6 text-start value-form">
{{ data.name }}
</div>
<div class="col-12 lg:col-5 text-start text-400">
Username
</div>
<div class="col-12 lg:col-6 text-start value-form">
{{ data.username }}
</div>
<div class="col-12 lg:col-5 text-start text-400">
No Kad Pengenalan
</div>
<div class="col-12 lg:col-6 text-start value-form">
{{ data.nokp }}
</div>
<div class="col-12 lg:col-5 text-start text-400">
No Tel Bimbit
</div>
<div class="col-12 lg:col-6 text-start value-form">
{{ data.notelbimbit }}
</div>
</div>
</div>
</div>
<div class="col-5 text_border">{{ data.name }}</div>
</div>
<div class="row justify-content-center mb-1">
<div class="col-2 text_border text-start" style="border: none">
Username
</div>
<div class="col-5 text_border">{{ data.username }}</div>
</div>
<div class="row justify-content-center mb-1">
<div class="col-2 text_border text-start" style="border: none">
No Kad Pengenalan
</div>
<div class="col-5 text_border">{{ data.nokp }}</div>
</div>
<div class="row justify-content-center mb-1">
<div class="col-2 text_border text-start" style="border: none">
No Tel Bimbit
</div>
<div class="col-5 text_border">{{ data.notelbimbit }}</div>
</div>
<div class="row justify-content-center mb-1">
<div class="col-2 text_border text-start" style="border: none">
Front IC
</div>
<div class="col-5 text_border" style="height: 200px">
{{ data.filename }}
</div>
</div>
<div class="row justify-content-center mb-1">
<div class="col-2 text_border text-start" style="border: none">
Rear IC
</div>
<div class="col-5 text_border" style="height: 200px">
{{ data_2.filename }}
</div>
</div>
</div>
<div v-else>Tiada Data</div>
</template>
</Card>
</div>
</div>
</base-card>
<div v-else>
<div
class="
flex
align-items-center
justify-content-center
container-height
fadein
animation-duration-400
"
>
<div class="grid justify-content-center">
<div class="col-12 mb-4 text-center">
<i class="pi pi-discord text-8xl text-400"></i>
</div>
<div class="col-12 text-center">
<span class="text-400">Profil tidak lengkap.</span>
</div>
</div>
</div>
</div>
</div>
</the-template>
</template>
@@ -100,7 +124,6 @@ export default {
this.loading = false;
} else {
this.status = false;
console.log(response.data.message);
this.loading = false;
}
})
@@ -114,14 +137,13 @@ export default {
</script>
<style scoped>
.text_border {
padding: 0.375rem 0.75rem;
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #212529;
background-color: #fff;
background-clip: padding-box;
border: 1px solid #ced4da;
.container-height {
min-height: 70vh;
}
</style>
.value-form {
border: 1px solid #ced4da;
margin-bottom: 0.5rem;
border-radius: 6px;
}
</style>
+2
View File
@@ -36,6 +36,7 @@ import RadioButton from 'primevue/radiobutton';
import Accordion from 'primevue/accordion';
import AccordionTab from 'primevue/accordiontab';
import Dialog from 'primevue/dialog';
import Avatar from 'primevue/avatar';
import TheTemplate from './components/layouts/TheTemplate.vue'
import BaseCard from './components/base/BaseCard.vue'
@@ -67,6 +68,7 @@ app.component('RadioButton', RadioButton);
app.component('Accordion', Accordion);
app.component('AccordionTab', AccordionTab);
app.component('Dialog', Dialog);
app.component('Avatar', Avatar);
app.use(router).use(store).use(PrimeVue).use(VueSweetalert2).use(ToastService).mount('#app');
// app.use(router).use(store).use(PrimeVue).use(ToastService).mount('#app');