72 lines
1.8 KiB
Vue
72 lines
1.8 KiB
Vue
<script setup lang="ts">
|
|
import DatePicker from '../shared/DatePicker.vue';
|
|
|
|
const permitNumber = defineModel<string>('permitNumber', { default: '' });
|
|
const jobDescription = defineModel<string>('jobDescription', { default: '' });
|
|
const workplace = defineModel<string>('workplace', { default: '' });
|
|
const dateOfHire = defineModel<Date>('dateOfHire');
|
|
|
|
defineProps<{
|
|
prefixId?: string;
|
|
outlined?: boolean;
|
|
readonly?: boolean;
|
|
}>();
|
|
</script>
|
|
|
|
<template>
|
|
<div class="row q-mb-sm" style="gap: 10px">
|
|
<div class="col-12 text-subtitle1 text-weight-bold">
|
|
<p>Document Properties</p>
|
|
</div>
|
|
|
|
<div class="col-12 row q-col-gutter-sm">
|
|
<q-input
|
|
dense
|
|
outlined
|
|
:readonly="readonly"
|
|
hide-bottom-space
|
|
class="col-6"
|
|
:label="$t('form.noticeJobEmployment.permitNumber')"
|
|
for="input-citizen-id"
|
|
v-model="permitNumber"
|
|
/>
|
|
|
|
<q-input
|
|
dense
|
|
outlined
|
|
:readonly="readonly"
|
|
hide-bottom-space
|
|
class="col-6"
|
|
:label="$t('form.noticeJobEmployment.jobDescription')"
|
|
for="input-citizen-id"
|
|
v-model="jobDescription"
|
|
/>
|
|
</div>
|
|
|
|
<div class="col-12 row q-col-gutter-sm">
|
|
<q-input
|
|
dense
|
|
outlined
|
|
:readonly="readonly"
|
|
hide-bottom-space
|
|
class="col-6"
|
|
:label="$t('form.noticeJobEmployment.workplace')"
|
|
for="input-citizen-id"
|
|
v-model="workplace"
|
|
/>
|
|
</div>
|
|
|
|
<div class="col-12 row q-col-gutter-sm">
|
|
<DatePicker
|
|
:label="$t('form.noticeJobEmployment.dateOfHire')"
|
|
v-model="dateOfHire"
|
|
class="col-4"
|
|
:id="`${prefixId}-input-birth-date`"
|
|
:readonly="readonly"
|
|
clearable
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss" scoped></style>
|