FormExperience.vue 2.02 KiB
<template>
<div class="q-pa-md">
<p>Please provide some information about your studies and work experience</p>
<div class="row">
<div class="col-12 col-md">
<q-form
class="q-py-md col q-gutter-md"
style="max-width: 80vw; width: 700px"
>
<div class="row q-pt-md">
<div class="col-12 col-md-2">
<p class=" text-caption">Education</p>
</div>
<div class="col-12 col-md">
<div class="row q-gutter-md">
<q-editor
v-model="education"
style="min-height: 10rem; width: 100%"
/>
</div>
</div>
</div>
<div class="row q-pt-md">
<div class="col-12 col-md-2">
<p class=" text-caption">Work experience</p>
</div>
<div class="col-12 col-md">
<div class="row q-gutter-md">
<q-markup-table style="width:500px; max-width: 80vw;">
<tr>
<td style="width: 20%;">Year</td>
<td style="width: 40%">Role</td>
<td style="width: 40%">Company</td>
</tr>
<tr>
<td>
<q-select
:options="years"
value="year"
></q-select>
</td>
</tr>
</q-markup-table>
</div>
</div>
</div>
</q-form>
</div>
</div>
<pre>
Education
Work experience
Role Year Company Occupation
Languages
</pre>
</div>
</template>
<script>
export default {
// name: 'ComponentName',
data () {
return {
year: '2019',
education: "",
work_experience: ""
};
},
computed: {
years () {
const _y = []
for (var i = 1959; i < 2059; i++)
_y.push(`${i}`)
return y;
}
}
}
</script>
<style>
</style>