mv common to fields

This commit is contained in:
Khafid Prayoga
2025-11-21 17:11:50 +07:00
parent f33e9a0f9a
commit 5c60e4e570
12 changed files with 39 additions and 38 deletions
@@ -1,21 +1,14 @@
<script setup lang="ts"> <script setup lang="ts">
import type { FormErrors } from '~/types/error' import type { FormErrors } from '~/types/error'
import { toTypedSchema } from '@vee-validate/zod' import { toTypedSchema } from '@vee-validate/zod'
import Block from '~/components/pub/my-ui/form/block.vue'
import FieldGroup from '~/components/pub/my-ui/form/field-group.vue' // components
import Field from '~/components/pub/my-ui/form/field.vue' import { Form } from '~/components/pub/ui/form'
import InputBase from '~/components/pub/my-ui/form/input-base.vue' import * as DE from '~/components/pub/my-ui/doc-entry'
import Label from '~/components/pub/my-ui/form/label.vue'
import { Label as RadioLabel } from '~/components/pub/ui/label' import { Label as RadioLabel } from '~/components/pub/ui/label'
import { RadioGroup, RadioGroupItem } from '~/components/pub/ui/radio-group' import { RadioGroup, RadioGroupItem } from '~/components/pub/ui/radio-group'
import SelectDistrict from './_common/select-district.vue' import { SelectDistrict, SelectPostal, SelectProvince, SelectRegency, SelectVillage } from './fields'
import SelectPostal from './_common/select-postal.vue' import InputBase from '~/components/pub/my-ui/form/input-base.vue'
import SelectProvince from './_common/select-province.vue'
import SelectRegency from './_common/select-regency.vue'
import SelectVillage from './_common/select-village.vue'
import { Form } from '~/components/pub/ui/form'
import * as DE from '~/components/pub/my-ui/doc-entry'
const props = defineProps<{ const props = defineProps<{
title: string title: string
@@ -262,7 +255,7 @@ watch(
<div> <div>
<p <p
v-if="props.title" v-if="props.title"
class="text-sm 2xl:text-base mb-2 2xl:mb-3 font-semibold" class="mb-2 text-sm font-semibold 2xl:mb-3 2xl:text-base"
> >
{{ props.title }} {{ props.title }}
</p> </p>
@@ -278,7 +271,10 @@ watch(
value="identity" value="identity"
/> />
</FormField> </FormField>
<DE.Block :col-count="4" :cell-flex="false"> <DE.Block
:col-count="4"
:cell-flex="false"
>
<DE.Cell :col-span="4"> <DE.Cell :col-span="4">
<DE.Label <DE.Label
size="fit" size="fit"
@@ -389,6 +385,5 @@ watch(
:is-disabled="getFieldState('postalRegion_code').disabled || !values.village_code" :is-disabled="getFieldState('postalRegion_code').disabled || !values.village_code"
/> />
</DE.Block> </DE.Block>
</Form> </Form>
</template> </template>
@@ -1,18 +1,12 @@
<script setup lang="ts"> <script setup lang="ts">
import type { FormErrors } from '~/types/error' import type { FormErrors } from '~/types/error'
import { toTypedSchema } from '@vee-validate/zod' import { toTypedSchema } from '@vee-validate/zod'
import FieldGroup from '~/components/pub/my-ui/form/field-group.vue'
import Field from '~/components/pub/my-ui/form/field.vue'
import InputBase from '~/components/pub/my-ui/form/input-base.vue'
import Label from '~/components/pub/my-ui/form/label.vue'
import SelectDistrict from './_common/select-district.vue'
import SelectPostal from './_common/select-postal.vue'
import SelectProvince from './_common/select-province.vue'
import SelectRegency from './_common/select-regency.vue'
import SelectVillage from './_common/select-village.vue'
import { Form } from '~/components/pub/ui/form'
// components
import { Form } from '~/components/pub/ui/form'
import * as DE from '~/components/pub/my-ui/doc-entry' import * as DE from '~/components/pub/my-ui/doc-entry'
import InputBase from '~/components/pub/my-ui/form/input-base.vue'
import { SelectDistrict, SelectPostal, SelectProvince, SelectRegency, SelectVillage } from './fields'
const props = defineProps<{ const props = defineProps<{
title: string title: string
@@ -169,7 +163,7 @@ watch(
<div> <div>
<p <p
v-if="props.title" v-if="props.title"
class="text-sm 2xl:text-base mb-2 2xl:mb-3 font-semibold" class="mb-2 text-sm font-semibold 2xl:mb-3 2xl:text-base"
> >
{{ props.title }} {{ props.title }}
</p> </p>
@@ -185,7 +179,10 @@ watch(
/> />
</FormField> </FormField>
<DE.Block :col-count="4" :cell-flex="false"> <DE.Block
:col-count="4"
:cell-flex="false"
>
<SelectProvince <SelectProvince
field-name="province_code" field-name="province_code"
placeholder="Pilih" placeholder="Pilih"
@@ -223,7 +220,7 @@ watch(
:errors="errors" :errors="errors"
numeric-only numeric-only
:max-length="2" :max-length="2"
/> />
<InputBase <InputBase
field-name="rw" field-name="rw"
label="RW" label="RW"
@@ -235,11 +232,11 @@ watch(
</div> </div>
</DE.Cell> </DE.Cell>
<SelectPostal <SelectPostal
field-name="postalRegion_code" field-name="postalRegion_code"
placeholder="Pilih kelurahan dahulu" placeholder="Pilih kelurahan dahulu"
:village-code="values.village_code" :village-code="values.village_code"
:is-disabled="!values.village_code" :is-disabled="!values.village_code"
/> />
</DE.Block> </DE.Block>
</Form> </Form>
</template> </template>
@@ -0,0 +1,6 @@
export { default as RadioResidence } from './radio-residence.vue'
export { default as SelectDistrict } from './select-district.vue'
export { default as SelectPostal } from './select-postal.vue'
export { default as SelectProvince } from './select-province.vue'
export { default as SelectRegency } from './select-regency.vue'
export { default as SelectVillage } from './select-village.vue'
@@ -1,10 +1,12 @@
<script setup lang="ts"> <script setup lang="ts">
import type { FormErrors } from '~/types/error' import type { FormErrors } from '~/types/error'
import { toTypedSchema } from '@vee-validate/zod' import { toTypedSchema } from '@vee-validate/zod'
import { FieldArray } from 'vee-validate'
import InputBase from '~/components/pub/my-ui/form/input-base.vue' // components
import SelectContactType from './_common/select-contact-type.vue'
import { Form } from '~/components/pub/ui/form' import { Form } from '~/components/pub/ui/form'
import { FieldArray } from 'vee-validate'
import { SelectContactType } from './fields'
import { InputBase } from '~/components/pub/my-ui/form'
const props = defineProps<{ const props = defineProps<{
title: string title: string
@@ -39,7 +41,7 @@ defineExpose({
<div> <div>
<p <p
v-if="props.title" v-if="props.title"
class="text-sm 2xl:text-base mb-2 2xl:mb-3 font-semibold" class="mb-2 text-sm font-semibold 2xl:mb-3 2xl:text-base"
> >
{{ props.title || 'Kontak Pasien' }} {{ props.title || 'Kontak Pasien' }}
</p> </p>
@@ -0,0 +1 @@
export { default as SelectContactType } from './select-contact-type.vue'