Popup TNC when register, remove upload ic when register
This commit is contained in:
Amir
@@ -23,63 +23,7 @@
|
||||
></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="row">
|
||||
<div class="col-12 lg:col-6 paragraph-align">
|
||||
<p>
|
||||
Para pembida yang dihargai, anda dinasihatkan untuk memahami
|
||||
segala terma dan syarat bidaan sebelum membuat sebarang bidaan
|
||||
secara atas talian.
|
||||
</p>
|
||||
<ol class="pr-3">
|
||||
<li>Pendaftaran adalah secara atas talian.</li>
|
||||
<li>
|
||||
Bidaan terbuka kepada semua warganegara berumur 18 tahun ke
|
||||
atas dan syarikat/koperasi yang berdaftar di Malaysia.
|
||||
</li>
|
||||
<li>
|
||||
Nilai bidaan hendaklah genap dan penggunaan nilaian sen adalah
|
||||
tidak dibenarkan.
|
||||
</li>
|
||||
<li>
|
||||
Waktu tamat bidaan adalah pada jam 12.30 petang (bergantung kepada
|
||||
perubahan dari masa ke semasa).
|
||||
</li>
|
||||
<li>
|
||||
Pembida berjaya hendaklah menyelesaikan keseluruhan amaun
|
||||
bidaan dan mengambil marhun pada/sebelum jam 4.00 petang.
|
||||
</li>
|
||||
<li>
|
||||
Setiap bidaan atas talian yang telah dihantar tidak boleh
|
||||
diubah. Sila pastikan nombor siri dan harga bidaan adalah
|
||||
betul. Pihak kami tidak akan bertanggungjawab di atas
|
||||
kesilapan pelanggan mengisi harga bidaan.
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6 paragraph-align">
|
||||
<ol class="pr-3" start="7">
|
||||
<li>
|
||||
Kaedah pembayaran adalah melalui perbankan atas talian (Online
|
||||
Banking) sahaja.
|
||||
</li>
|
||||
<li>
|
||||
Sila serahkan bukti pembayaran semasa menuntut marhun bidaan
|
||||
(di kaunter atau melalui media elektronik sama ada emel atau
|
||||
Whatsapp).
|
||||
</li>
|
||||
<li>
|
||||
Pembida yang menang di dalam bidaan tetapi gagal melakukan
|
||||
pembayaran pada masa yang telah ditetapkan akan disenarai
|
||||
hitamkan.
|
||||
</li>
|
||||
<li>
|
||||
Semua Terma & Syarat diatas adalah tertakluk kepada pindaan
|
||||
dan boleh diubah dari masa ke semasa tanpa dimaklumkan kepada
|
||||
pembida.
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
<terms-and-conditions-details></terms-and-conditions-details>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<Button
|
||||
@@ -94,7 +38,12 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {};
|
||||
import TermsAndConditionsDetails from './TermsAndConditionsDetails.vue'
|
||||
export default {
|
||||
components: {
|
||||
"terms-and-conditions-details": TermsAndConditionsDetails,
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -0,0 +1,56 @@
|
||||
<template>
|
||||
<div class="row text-left">
|
||||
<div class="col-12 lg:col-6 paragraph-align">
|
||||
<p>
|
||||
Para pembida yang dihargai, anda dinasihatkan untuk memahami segala
|
||||
terma dan syarat bidaan sebelum membuat sebarang bidaan secara atas
|
||||
talian.
|
||||
</p>
|
||||
<ol class="pr-3">
|
||||
<li>Pendaftaran adalah secara atas talian.</li>
|
||||
<li>
|
||||
Bidaan terbuka kepada semua warganegara berumur 18 tahun ke atas dan
|
||||
syarikat/koperasi yang berdaftar di Malaysia.
|
||||
</li>
|
||||
<li>
|
||||
Nilai bidaan hendaklah genap dan penggunaan nilaian sen adalah tidak
|
||||
dibenarkan.
|
||||
</li>
|
||||
<li>
|
||||
Waktu tamat bidaan adalah pada jam 12.30 petang (bergantung kepada
|
||||
perubahan dari masa ke semasa).
|
||||
</li>
|
||||
<li>
|
||||
Pembida berjaya hendaklah menyelesaikan keseluruhan amaun bidaan dan
|
||||
mengambil marhun pada/sebelum jam 4.00 petang.
|
||||
</li>
|
||||
<li>
|
||||
Setiap bidaan atas talian yang telah dihantar tidak boleh diubah. Sila
|
||||
pastikan nombor siri dan harga bidaan adalah betul. Pihak kami tidak
|
||||
akan bertanggungjawab di atas kesilapan pelanggan mengisi harga
|
||||
bidaan.
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6 paragraph-align">
|
||||
<ol class="pr-3" start="7">
|
||||
<li>
|
||||
Kaedah pembayaran adalah melalui perbankan atas talian (Online
|
||||
Banking) sahaja.
|
||||
</li>
|
||||
<li>
|
||||
Sila serahkan bukti pembayaran semasa menuntut marhun bidaan (di
|
||||
kaunter atau melalui media elektronik sama ada emel atau Whatsapp).
|
||||
</li>
|
||||
<li>
|
||||
Pembida yang menang di dalam bidaan tetapi gagal melakukan pembayaran
|
||||
pada masa yang telah ditetapkan akan disenarai hitamkan.
|
||||
</li>
|
||||
<li>
|
||||
Semua Terma & Syarat diatas adalah tertakluk kepada pindaan dan boleh
|
||||
diubah dari masa ke semasa tanpa dimaklumkan kepada pembida.
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,228 +1,45 @@
|
||||
<template>
|
||||
<Toast :breakpoints="{ '767px': { width: '100%', right: '0', left: '0' } }" />
|
||||
<div class="main-container">
|
||||
<div
|
||||
class="
|
||||
flex
|
||||
min-h-screen
|
||||
align-items-center
|
||||
justify-content-center
|
||||
p-5
|
||||
"
|
||||
>
|
||||
<div
|
||||
class="
|
||||
surface-card
|
||||
fadein
|
||||
p-4
|
||||
shadow-2
|
||||
border-round
|
||||
w-11
|
||||
md:w-10
|
||||
lg:w-10
|
||||
xl:w-8
|
||||
"
|
||||
class="flex min-h-screen align-items-center justify-content-center p-5"
|
||||
>
|
||||
<div class="text-center mb-5">
|
||||
<div class="text-900 text-3xl font-semibold mb-3">
|
||||
ArrahnBid
|
||||
<img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" />
|
||||
</div>
|
||||
<span class="text-600 font-medium line-height-3"
|
||||
>Sudah punyai akaun?</span
|
||||
>
|
||||
<router-link
|
||||
v-bind:to="{ name: 'login' }"
|
||||
class="font-medium no-underline ml-2 text-blue-500 cursor-pointer"
|
||||
>Log masuk sekarang!</router-link
|
||||
>
|
||||
</div>
|
||||
<h5>Daftar Akaun</h5>
|
||||
<div class="grid">
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<label for="name">Nama</label>
|
||||
<InputText
|
||||
id="name"
|
||||
type="text"
|
||||
v-model="form.name"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
p-2
|
||||
border-1 border-solid
|
||||
surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
"
|
||||
></InputText>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.name.$error"
|
||||
>Nama diperlukan</InlineMessage
|
||||
>
|
||||
<div
|
||||
class="
|
||||
surface-card
|
||||
fadein
|
||||
p-4
|
||||
shadow-2
|
||||
border-round
|
||||
w-11
|
||||
md:w-10
|
||||
lg:w-10
|
||||
xl:w-8
|
||||
"
|
||||
>
|
||||
<div class="text-center mb-5">
|
||||
<div class="text-900 text-3xl font-semibold mb-3">
|
||||
ArrahnBid
|
||||
<img class="logo-img" src="img/logo_arrahn.png" alt="arrahn-logo" />
|
||||
</div>
|
||||
<span class="text-600 font-medium line-height-3"
|
||||
>Sudah punyai akaun?</span
|
||||
>
|
||||
<router-link
|
||||
v-bind:to="{ name: 'login' }"
|
||||
class="font-medium no-underline ml-2 text-blue-500 cursor-pointer"
|
||||
>Log masuk sekarang!</router-link
|
||||
>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<!-- <label for="nokp">No Kad Pengenalan</label> -->
|
||||
<select
|
||||
class="p-0 mb-2 form-select"
|
||||
style="width: 190px; border: none"
|
||||
>
|
||||
<option selected value="nokp">No Kad Pengenalan</option>
|
||||
<option value="passpor">No Passport</option>
|
||||
</select>
|
||||
<InputText
|
||||
id="nokp"
|
||||
type="text"
|
||||
v-model="form.nokp"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
p-2
|
||||
border-1 border-solid
|
||||
surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
"
|
||||
></InputText>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.nokp.$error"
|
||||
>No KP diperlukan</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="field">
|
||||
<label for="alamat">Alamat</label>
|
||||
<Textarea
|
||||
id="alamat"
|
||||
v-model="form.alamat"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
p-2
|
||||
border-1 border-solid
|
||||
surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
"
|
||||
></Textarea>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.alamat.$error"
|
||||
>Alamat diperlukan</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<label for="notelbimbit">No Telefon</label>
|
||||
<!-- <InputText
|
||||
id="notelbimbit"
|
||||
type="text"
|
||||
v-model="form.notelbimbit"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
p-2
|
||||
border-1 border-solid
|
||||
surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
"
|
||||
></InputText> -->
|
||||
<MazPhoneNumberInput
|
||||
v-model="form.notelbimbit"
|
||||
show-code-on-list
|
||||
:fetch-country="true"
|
||||
:preferred-countries="['MY']"
|
||||
:translations="{
|
||||
countrySelector: {
|
||||
placeholder: 'Pilih Negara',
|
||||
error: 'Choose country',
|
||||
},
|
||||
phoneInput: {
|
||||
placeholder: 'Nombor Telefon',
|
||||
},
|
||||
}"
|
||||
:no-example="true"
|
||||
@update="results = $event"
|
||||
/>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.notelbimbit.$error"
|
||||
>No telefon diperlukan</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<label for="email">Emel</label>
|
||||
<InputText
|
||||
id="email"
|
||||
type="text"
|
||||
v-model="form.email"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
p-2
|
||||
border-1 border-solid
|
||||
surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
h-match-phone-number
|
||||
"
|
||||
></InputText>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.email.$error"
|
||||
>Sila isi emel yang sah</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<p class="mb-0" for="username">Username</p>
|
||||
<InputText
|
||||
id="username"
|
||||
type="text"
|
||||
v-model="form.username"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
p-2
|
||||
border-1 border-solid
|
||||
surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
h-match-password
|
||||
"
|
||||
></InputText>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.username.$error"
|
||||
>Username diperlukan</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<p class="mb-0">Kata Laluan</p>
|
||||
<div class="p-input-icon-right">
|
||||
<i class="pi pi-user" />
|
||||
<!-- <InputText
|
||||
id="password"
|
||||
<h5>Daftar Akaun</h5>
|
||||
<div class="grid">
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<label for="name">Nama</label>
|
||||
<InputText
|
||||
id="name"
|
||||
type="text"
|
||||
v-model="form.password"
|
||||
v-model="form.name"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
@@ -235,241 +52,264 @@
|
||||
focus:border-primary
|
||||
w-full
|
||||
"
|
||||
></InputText> -->
|
||||
<Password
|
||||
v-model="form.password"
|
||||
toggleMask
|
||||
:feedback="false"
|
||||
></InputText>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.name.$error"
|
||||
>Nama diperlukan</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<label for="nokp">No Kad Pengenalan</label>
|
||||
<!-- <select
|
||||
class="p-0 mb-2 form-select"
|
||||
style="width: 190px; border: none"
|
||||
>
|
||||
<option selected value="nokp">No Kad Pengenalan</option>
|
||||
<option value="passpor">No Passport</option>
|
||||
</select> -->
|
||||
<InputText
|
||||
id="nokp"
|
||||
type="text"
|
||||
v-model="form.nokp"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay surface-border
|
||||
surface-overlay
|
||||
p-2
|
||||
border-1 border-solid
|
||||
surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
"
|
||||
/>
|
||||
></InputText>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.nokp.$error"
|
||||
>No KP diperlukan</InlineMessage
|
||||
>
|
||||
</div>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.password.$error"
|
||||
>Kata laluan diperlukan & mestilah 8 huruf</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<label for="confirmpassword">Tetapkan Kata Laluan</label>
|
||||
<InputText
|
||||
id="confirmpassword"
|
||||
type="text"
|
||||
v-model="form.password_confirmation"
|
||||
disabled
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
p-2
|
||||
border-1 border-solid
|
||||
surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
"
|
||||
></InputText>
|
||||
<InlineMessage class="mt-1"
|
||||
>Tetapkan kata laluan diperlukan</InlineMessage
|
||||
>
|
||||
<div class="col-12">
|
||||
<div class="field">
|
||||
<label for="alamat">Alamat</label>
|
||||
<Textarea
|
||||
id="alamat"
|
||||
v-model="form.alamat"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
p-2
|
||||
border-1 border-solid
|
||||
surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
"
|
||||
></Textarea>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.alamat.$error"
|
||||
>Alamat diperlukan</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="col-12">
|
||||
<div class="field">
|
||||
<label for="frontic">Kad Pengenalan Hadapan</label>
|
||||
<!-- <FileUpload
|
||||
name="demo[]"
|
||||
url="./upload"
|
||||
:maxFileSize="1500000"
|
||||
:fileLimit="1"
|
||||
:multiple="false"
|
||||
:showUploadButton="false"
|
||||
:showCancelButton="false"
|
||||
v-model="form.images.file1"
|
||||
/> -->
|
||||
<input
|
||||
class="form-control"
|
||||
type="file"
|
||||
id="formFile"
|
||||
ref="formFileRef"
|
||||
@change="readImage()"
|
||||
/>
|
||||
<!-- <InlineMessage class="mt-1" v-if="v$.form.images.file1.$error"
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<label for="notelbimbit">No Telefon</label>
|
||||
<MazPhoneNumberInput
|
||||
v-model="form.notelbimbit"
|
||||
show-code-on-list
|
||||
:fetch-country="true"
|
||||
:preferred-countries="['MY']"
|
||||
:translations="{
|
||||
countrySelector: {
|
||||
placeholder: 'Pilih Negara',
|
||||
error: 'Choose country',
|
||||
},
|
||||
phoneInput: {
|
||||
placeholder: 'Nombor Telefon',
|
||||
},
|
||||
}"
|
||||
:no-example="true"
|
||||
@update="results = $event"
|
||||
/>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.notelbimbit.$error"
|
||||
>No telefon diperlukan</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<label for="email">Emel</label>
|
||||
<InputText
|
||||
id="email"
|
||||
type="text"
|
||||
v-model="form.email"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
p-2
|
||||
border-1 border-solid
|
||||
surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
h-match-phone-number
|
||||
"
|
||||
></InputText>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.email.$error"
|
||||
>Sila isi emel yang sah</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<p class="mb-0" for="username">Username</p>
|
||||
<InputText
|
||||
id="username"
|
||||
type="text"
|
||||
v-model="form.username"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay
|
||||
p-2
|
||||
border-1 border-solid
|
||||
surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
h-match-password
|
||||
"
|
||||
></InputText>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.username.$error"
|
||||
>Username diperlukan</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="field">
|
||||
<p class="mb-0">Kata Laluan</p>
|
||||
<div class="p-input-icon-right">
|
||||
<i class="pi pi-user" />
|
||||
<Password
|
||||
v-model="form.password"
|
||||
toggleMask
|
||||
:feedback="false"
|
||||
class="
|
||||
text-base text-color
|
||||
surface-overlay surface-border
|
||||
border-round
|
||||
appearance-none
|
||||
outline-none
|
||||
focus:border-primary
|
||||
w-full
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.password.$error"
|
||||
>Kata laluan diperlukan & mestilah 8 huruf</InlineMessage
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="col-12">
|
||||
<div class="field">
|
||||
<label for="frontic">Kad Pengenalan Hadapan</label>
|
||||
<input
|
||||
class="form-control"
|
||||
type="file"
|
||||
id="formFile"
|
||||
ref="formFileRef"
|
||||
@change="readImage()"
|
||||
/>
|
||||
<InlineMessage class="mt-1" v-if="v$.form.images.file1.$error"
|
||||
>Kad pengenalan hadapan diperlukan</InlineMessage
|
||||
> -->
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="field">
|
||||
<label for="backic">Kad Pengenalan Belakang</label>
|
||||
<input class="form-control" type="file" />
|
||||
<!-- <InlineMessage class="mt-1" v-if="v$.form.images.file2.$error"
|
||||
<div class="col-12">
|
||||
<div class="field">
|
||||
<label for="backic">Kad Pengenalan Belakang</label>
|
||||
<input class="form-control" type="file" />
|
||||
<InlineMessage class="mt-1" v-if="v$.form.images.file2.$error"
|
||||
>Kad pengenalan belakang diperlukan</InlineMessage
|
||||
> -->
|
||||
>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="col-12">
|
||||
<div class="mt-3 mb-1">
|
||||
<label>
|
||||
<input type="checkbox" v-model="form.register_agree" />
|
||||
Setuju Dengan <terms-and-conditions></terms-and-conditions>
|
||||
</label>
|
||||
</div>
|
||||
<InlineMessage v-if="v$.form.register_agree.$error"
|
||||
>Anda mestilah bersetuju dengan terma & syarat.</InlineMessage
|
||||
>
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
<Button
|
||||
class="p-button-sm"
|
||||
label="Teruskan"
|
||||
icon="pi pi-sign-in"
|
||||
iconPos="right"
|
||||
@click="openModalTNC()"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="mt-3 mb-1">
|
||||
<label>
|
||||
<input type="checkbox" v-model="form.register_agree" />
|
||||
Setuju Dengan <terms-and-conditions></terms-and-conditions>
|
||||
</label>
|
||||
</div>
|
||||
<InlineMessage v-if="v$.form.register_agree.$error"
|
||||
>Anda mestilah bersetuju dengan terma & syarat.</InlineMessage
|
||||
>
|
||||
</div>
|
||||
<Dialog
|
||||
header="Terma & Syarat"
|
||||
v-model:visible="isDisplayTNC"
|
||||
:style="{ width: '80vw' }"
|
||||
:modal="true"
|
||||
>
|
||||
<div>
|
||||
<terms-and-conditions-details></terms-and-conditions-details>
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
<template #footer>
|
||||
<Button
|
||||
label="Batal Pendaftaran"
|
||||
icon="pi pi-times"
|
||||
iconPos="right"
|
||||
@click="closeModalTNC()"
|
||||
class="p-button-text"
|
||||
/>
|
||||
<Button
|
||||
class="p-button-sm"
|
||||
label="Daftar"
|
||||
label="Daftar Sekarang"
|
||||
:loading="isLoading"
|
||||
icon="pi pi-sign-in"
|
||||
iconPos="right"
|
||||
@click="doRegister()"
|
||||
></Button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</Dialog>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="container-fluid p-2">
|
||||
<div class="row justify-content-center p-5 rounded">
|
||||
<h1 class="mb-5 text-primary">Sistem Lelong</h1>
|
||||
<h4>Daftar Akaun</h4>
|
||||
<form @submit.prevent="submit">
|
||||
<div class="row">
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input type="text" class="form-control" v-model="form.name" />
|
||||
<label>Nama</label>
|
||||
</div>
|
||||
<div style="font-size: 15px" class="fst-italic text-danger">
|
||||
<div class="text-start">
|
||||
*Minimum tambahan harga bida adalah RM1.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input type="text" class="form-control" v-model="form.nokp" />
|
||||
<label>No KP</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
v-model="form.notelbimbit"
|
||||
/>
|
||||
<label>No. Telefon</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input type="email" class="form-control" v-model="form.email" />
|
||||
<label>E-mel</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
autocomplete="off"
|
||||
v-model="form.username"
|
||||
/>
|
||||
<label>Username</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="password"
|
||||
class="form-control"
|
||||
v-model="form.password"
|
||||
/>
|
||||
<label>Password</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 mb-1">
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="password"
|
||||
class="form-control"
|
||||
v-model="form.password_confirmation"
|
||||
/>
|
||||
<label>Password Confirmation</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6 mb-1">
|
||||
<label>Kad Pengenalan Hadapan</label>
|
||||
<input type="file" class="form-control" />
|
||||
</div>
|
||||
<div class="col-6 mb-1">
|
||||
<label>Kad Pengenalan Belakang</label>
|
||||
<input type="file" class="form-control" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="checkbox mt-3 mb-3">
|
||||
<label>
|
||||
<input type="checkbox" value="1" id="register_agree" /> Setuju
|
||||
Dengan
|
||||
<terms-and-conditions></terms-and-conditions>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-3">
|
||||
<button
|
||||
@click="doRegister"
|
||||
class="w-100 mt-4 mb-5 btn btn-primary"
|
||||
type="submit"
|
||||
>
|
||||
Daftar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<router-link to="/login">Log Masuk</router-link>
|
||||
</div>
|
||||
</div> -->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import useVuelidate from "@vuelidate/core";
|
||||
import { required, email, minLength } from "@vuelidate/validators";
|
||||
import TermsAndConditionsDetails from "./TermsAndConditionsDetails.vue";
|
||||
|
||||
export default {
|
||||
name: "Register",
|
||||
components: {
|
||||
"terms-and-conditions-details": TermsAndConditionsDetails,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
v$: useVuelidate(),
|
||||
alertMessages: Array,
|
||||
isLoading: false,
|
||||
isDisplayTNC: false,
|
||||
form: {
|
||||
name: "",
|
||||
username: "",
|
||||
@@ -521,6 +361,7 @@ export default {
|
||||
this.isLoading = false;
|
||||
} else if (response.data.success == false) {
|
||||
this.isLoading = false;
|
||||
this.isDisplayTNC = false;
|
||||
this.alertMessages = response.data.message;
|
||||
Object.values(this.alertMessages).forEach((val) =>
|
||||
this.$toast.add({
|
||||
@@ -542,6 +383,15 @@ export default {
|
||||
});
|
||||
}
|
||||
},
|
||||
openModalTNC() {
|
||||
this.v$.$validate();
|
||||
if (!this.v$.$error) {
|
||||
this.isDisplayTNC = true;
|
||||
}
|
||||
},
|
||||
closeModalTNC() {
|
||||
this.isDisplayTNC = false;
|
||||
},
|
||||
readImage() {},
|
||||
},
|
||||
validations() {
|
||||
@@ -549,10 +399,10 @@ export default {
|
||||
form: {
|
||||
name: { required },
|
||||
username: { required },
|
||||
nokp: { required },
|
||||
nokp: { required, minLengthValue: minLength(12) },
|
||||
password: { required, minLengthValue: minLength(8) },
|
||||
email: { required, email },
|
||||
notelbimbit: { required },
|
||||
notelbimbit: { required, minLengthValue: minLength(8) },
|
||||
register_agree: { required },
|
||||
alamat: { required },
|
||||
// images: {
|
||||
|
||||
Reference in New Issue
Block a user