Replace ~2900 lines across 9 files with ~400 lines in 2 files: - shared/utils/customFields.ts (types + pure helpers) - composables/useCustomFieldInputs.ts (reactive composable) Migrated all consumers: - Backend: add defaultValue to API Platform serialization groups - Standalone pages: component edit/create, piece edit/create, product edit/create/detail - Machine page: MachineCustomFieldsCard, MachineInfoCard, useMachineDetailCustomFields - Hierarchy: ComponentItem, PieceItem - Shared: CustomFieldDisplay, CustomFieldInputGrid - Category editor: componentStructure.ts Deleted: - entityCustomFieldLogic.ts (335 lines) - customFieldUtils.ts (440 lines) - customFieldFormUtils.ts (404 lines) - useEntityCustomFields.ts (181 lines) - customFieldFormUtils.test.ts Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
84 lines
2.4 KiB
Vue
84 lines
2.4 KiB
Vue
<template>
|
|
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
|
|
<div
|
|
v-for="(field, index) in fields"
|
|
:key="fieldKey(field, index)"
|
|
class="form-control"
|
|
>
|
|
<label class="label">
|
|
<span class="label-text">{{ field.name }}</span>
|
|
<span v-if="field.required" class="label-text-alt text-error">*</span>
|
|
</label>
|
|
<input
|
|
v-if="field.type === 'text'"
|
|
v-model="field.value"
|
|
type="text"
|
|
class="input input-bordered input-sm md:input-md"
|
|
:required="field.required"
|
|
:disabled="disabled"
|
|
>
|
|
<input
|
|
v-else-if="field.type === 'number'"
|
|
v-model="field.value"
|
|
type="number"
|
|
step="0.01"
|
|
class="input input-bordered input-sm md:input-md"
|
|
:required="field.required"
|
|
:disabled="disabled"
|
|
>
|
|
<select
|
|
v-else-if="field.type === 'select'"
|
|
v-model="field.value"
|
|
class="select select-bordered select-sm md:select-md"
|
|
:required="field.required"
|
|
:disabled="disabled"
|
|
>
|
|
<option value="">Sélectionner...</option>
|
|
<option
|
|
v-for="option in field.options"
|
|
:key="option"
|
|
:value="option"
|
|
>
|
|
{{ option }}
|
|
</option>
|
|
</select>
|
|
<label v-else-if="field.type === 'boolean'" class="flex items-center gap-3 cursor-pointer">
|
|
<input
|
|
v-model="field.value"
|
|
type="checkbox"
|
|
class="toggle toggle-primary toggle-sm md:toggle-md"
|
|
true-value="true"
|
|
false-value="false"
|
|
:disabled="disabled"
|
|
>
|
|
<span class="text-sm" :class="field.value === 'true' ? 'text-success font-medium' : 'text-base-content/60'">{{ field.value === 'true' ? 'Oui' : 'Non' }}</span>
|
|
</label>
|
|
<input
|
|
v-else-if="field.type === 'date'"
|
|
v-model="field.value"
|
|
type="date"
|
|
class="input input-bordered input-sm md:input-md"
|
|
:required="field.required"
|
|
:disabled="disabled"
|
|
>
|
|
<input
|
|
v-else
|
|
v-model="field.value"
|
|
type="text"
|
|
class="input input-bordered input-sm md:input-md"
|
|
:required="field.required"
|
|
:disabled="disabled"
|
|
>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { fieldKey, type CustomFieldInput } from '~/shared/utils/customFields'
|
|
|
|
defineProps<{
|
|
fields: CustomFieldInput[]
|
|
disabled?: boolean
|
|
}>()
|
|
</script>
|