155 lines
6.8 KiB
Vue
155 lines
6.8 KiB
Vue
<template>
|
|
<v-row justify="center">
|
|
<v-col cols="12">
|
|
<v-img
|
|
lazy-src="https://picsum.photos/id/11/10/6"
|
|
max-height="40%"
|
|
max-width="100%"
|
|
src="/gita/t.jpg"
|
|
></v-img>
|
|
<v-form v-model="valid">
|
|
<v-container>
|
|
<v-row>
|
|
<v-flex xs6 style="padding: 20px;">
|
|
<div>
|
|
<v-card style="padding: 10px;">
|
|
<v-card-title class="cyan darken-1">
|
|
<span class="text-h5 white--text">Request information</span>
|
|
|
|
<v-spacer></v-spacer>
|
|
<!--
|
|
<v-btn dark icon>
|
|
<v-icon>mdi-chevron-left</v-icon>
|
|
</v-btn>
|
|
|
|
<v-btn dark icon>
|
|
<v-icon>mdi-pencil</v-icon>
|
|
</v-btn>-->
|
|
|
|
<v-btn dark icon>
|
|
<v-icon>mdi-dots-vertical</v-icon>
|
|
</v-btn>
|
|
</v-card-title>
|
|
<v-text-field
|
|
v-model="firstname"
|
|
:rules="nameRules"
|
|
:counter="10"
|
|
label="First name"
|
|
required
|
|
></v-text-field>
|
|
|
|
<v-text-field
|
|
v-model="lastname"
|
|
:rules="nameRules"
|
|
:counter="10"
|
|
label="Last name"
|
|
required
|
|
></v-text-field>
|
|
|
|
<v-text-field
|
|
v-model="email"
|
|
:rules="emailRules"
|
|
label="E-mail"
|
|
required
|
|
></v-text-field>
|
|
<v-text-field
|
|
v-model="Massege"
|
|
:rules="massegeRules"
|
|
label="Massege"
|
|
required
|
|
></v-text-field>
|
|
<v-btn elevation="3" medium denger>submit</v-btn>
|
|
</v-card>
|
|
</div>
|
|
</v-flex>
|
|
<v-flex xs6 style="padding: 20px;">
|
|
<v-card style="padding: 10px;">
|
|
<v-card-title class="cyan darken-1">
|
|
<span class="text-h5 white--text">Contact information</span>
|
|
|
|
<v-spacer></v-spacer>
|
|
<!--
|
|
<v-btn dark icon>
|
|
<v-icon>mdi-chevron-left</v-icon>
|
|
</v-btn>
|
|
|
|
<v-btn dark icon>
|
|
<v-icon>mdi-pencil</v-icon>
|
|
</v-btn>-->
|
|
|
|
<v-btn dark icon>
|
|
<v-icon>mdi-dots-vertical</v-icon>
|
|
</v-btn>
|
|
</v-card-title>
|
|
|
|
<v-list>
|
|
<v-list-item>
|
|
<v-list-item-action>
|
|
<v-icon>mdi-phone</v-icon>
|
|
</v-list-item-action>
|
|
|
|
<v-list-item-content>
|
|
<v-list-item-title>098302 96155</v-list-item-title>
|
|
</v-list-item-content>
|
|
<v-list-item-action>
|
|
<v-icon>mdi-message-text</v-icon>
|
|
</v-list-item-action>
|
|
</v-list-item>
|
|
|
|
<v-divider inset></v-divider>
|
|
|
|
<v-divider inset></v-divider>
|
|
|
|
<v-list-item>
|
|
<v-list-item-action>
|
|
<v-icon>mdi-email</v-icon>
|
|
</v-list-item-action>
|
|
|
|
<v-list-item-content>
|
|
<v-list-item-title>dipak@gita-enterprise.com</v-list-item-title>
|
|
</v-list-item-content>
|
|
</v-list-item>
|
|
|
|
<v-divider inset></v-divider>
|
|
|
|
<v-list-item>
|
|
<v-list-item-action>
|
|
<v-icon>mdi-map-marker</v-icon>
|
|
</v-list-item-action>
|
|
|
|
<v-list-item-content>
|
|
<v-list-item-title>HABRA BAZZAR, 1 NO GOL <br><br> Habra, West Bengal 743263 <br><br> West Bengal, India <br><br> </v-list-item-title>
|
|
</v-list-item-content>
|
|
</v-list-item>
|
|
</v-list>
|
|
</v-card>
|
|
</v-flex>
|
|
</v-row>
|
|
|
|
</v-container>
|
|
</v-form>
|
|
</v-col>
|
|
</v-row>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
data: () => ({
|
|
valid: false,
|
|
firstname: '',
|
|
lastname: '',
|
|
nameRules: [
|
|
v => !!v || 'Name is required',
|
|
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',
|
|
],
|
|
Massege: ' ',
|
|
massegeRules: [v => !!v || 'E-mail is required',
|
|
v => /.+@.+/.test(v) || 'E-mail must be valid',],
|
|
}),
|
|
}
|
|
</script>
|