267 lines
4.9 KiB
JavaScript
267 lines
4.9 KiB
JavaScript
|
|
var oneFormPatientComponent= {
|
|
template: `
|
|
<v-form ref="form" v-model="valid" lazy-validation >
|
|
<v-container>
|
|
<v-layout>
|
|
<v-flex xs12 >
|
|
|
|
<v-text-field
|
|
v-model="Nama"
|
|
|
|
:rules="namaRules"
|
|
label="Nama"
|
|
required
|
|
></v-text-field>
|
|
|
|
<v-text-field
|
|
v-model="Alamat"
|
|
|
|
:rules="alamatRules"
|
|
label="Alamat"
|
|
required
|
|
></v-text-field>
|
|
|
|
<v-text-field
|
|
v-model="Umur"
|
|
|
|
:rules="umurRules"
|
|
label="Umur"
|
|
required
|
|
></v-text-field>
|
|
|
|
<v-text-field
|
|
v-model="Riwayat"
|
|
|
|
:rules="riwayatRules"
|
|
label="Riwayat Pemeriksaan"
|
|
|
|
></v-text-field>
|
|
|
|
|
|
|
|
<v-select
|
|
v-model="select"
|
|
:items="items"
|
|
:rules="[v => !!v || 'Item is required']"
|
|
label="Item"
|
|
required
|
|
></v-select>
|
|
|
|
<v-checkbox
|
|
v-model="checkbox"
|
|
:rules="[v => !!v || 'You must agree to continue!']"
|
|
label="Do you agree?"
|
|
required
|
|
></v-checkbox>
|
|
|
|
<v-btn
|
|
:disabled="!valid"
|
|
color="success"
|
|
@click="validate"
|
|
>
|
|
Tambah Pasien
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
color="error"
|
|
@click="reset"
|
|
>
|
|
Save
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
color="warning"
|
|
@click="resetValidation"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
:disabled="!valid"
|
|
color="success"
|
|
@click="validate"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
color="error"
|
|
@click="reset"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
color="warning"
|
|
@click="resetValidation"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
|
|
<v-btn
|
|
color="warning"
|
|
@click="resetValidation"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
:disabled="!valid"
|
|
color="success"
|
|
@click="validate"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
color="error"
|
|
@click="reset"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
color="warning"
|
|
@click="resetValidation"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
|
|
<v-btn
|
|
color="warning"
|
|
@click="resetValidation"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
:disabled="!valid"
|
|
color="success"
|
|
@click="validate"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
color="error"
|
|
@click="reset"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
color="warning"
|
|
@click="resetValidation"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
|
|
<v-btn
|
|
color="warning"
|
|
@click="resetValidation"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
:disabled="!valid"
|
|
color="success"
|
|
@click="validate"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
color="error"
|
|
@click="reset"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
color="warning"
|
|
@click="resetValidation"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
|
|
<v-btn
|
|
color="warning"
|
|
@click="resetValidation"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
:disabled="!valid"
|
|
color="success"
|
|
@click="validate"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
color="error"
|
|
@click="reset"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
color="warning"
|
|
@click="resetValidation"
|
|
>
|
|
Test
|
|
</v-btn>
|
|
|
|
|
|
</v-layout>
|
|
</v-container>
|
|
</v-form>
|
|
|
|
`,
|
|
data: function() {
|
|
return {
|
|
valid: true,
|
|
name: '',
|
|
nameRules: [
|
|
v => !!v || 'Name is required',
|
|
v => (v && v.length <= 10) || 'Name must be less than 10 characters'
|
|
],
|
|
email: '',
|
|
emailRules: [
|
|
v => !!v || 'E-mail is required',
|
|
v => /.+@.+/.test(v) || 'E-mail must be valid'
|
|
],
|
|
select: null,
|
|
items: [
|
|
'Item 1',
|
|
'Item 2',
|
|
'Item 3',
|
|
'Item 4'
|
|
],
|
|
checkbox: false
|
|
};
|
|
},
|
|
methods: {
|
|
validate () {
|
|
if (this.$refs.form.validate()) {
|
|
this.snackbar = true
|
|
}
|
|
},
|
|
reset () {
|
|
this.$refs.form.reset()
|
|
},
|
|
resetValidation () {
|
|
this.$refs.form.resetValidation()
|
|
}
|
|
}
|
|
};
|
|
|
|
export { oneFormPatientComponent };
|