add auto for testname & add tabindex in testmap form

This commit is contained in:
faiztyanirh 2026-04-04 21:13:33 +07:00
parent 13d9e0e7cc
commit 905ce97f5e
4 changed files with 43 additions and 13 deletions

View File

@ -18,6 +18,7 @@ const optionsMode = {
const baseOption = {
value: item[valueKey],
label: typeof labelKey === 'function' ? labelKey(item) : item[labelKey],
rawItem: item
};
if (field.key === 'FormulaInput') {

View File

@ -55,14 +55,16 @@ export const testMapFormFields = [
label: 'Host Type',
required: false,
type: 'select',
optionsEndpoint: `${API.BASE_URL}${API.VALUESET}/entity_type`
optionsEndpoint: `${API.BASE_URL}${API.VALUESET}/entity_type`,
tabIndex: 1,
},
{
key: 'ClientType',
label: 'Client Type',
required: false,
type: 'select',
optionsEndpoint: `${API.BASE_URL}${API.VALUESET}/entity_type`
optionsEndpoint: `${API.BASE_URL}${API.VALUESET}/entity_type`,
tabIndex: 5,
}
]
},
@ -74,14 +76,16 @@ export const testMapFormFields = [
label: 'Host ID',
required: false,
type: 'text',
validateOn: ['input']
validateOn: ['input'],
tabIndex: 2,
},
{
key: 'ClientID',
label: 'Client ID',
required: false,
type: 'text',
validateOn: ['input']
validateOn: ['input'],
tabIndex: 6,
}
]
},
@ -92,13 +96,15 @@ export const testMapFormFields = [
key: 'HostTestCode',
label: 'Host Test Code',
required: false,
type: 'text'
type: 'text',
tabIndex: 3,
},
{
key: 'ClientTestCode',
label: 'Client Test Code',
required: false,
type: 'text'
type: 'text',
tabIndex: 7,
}
]
},
@ -109,13 +115,15 @@ export const testMapFormFields = [
key: 'HostTestName',
label: 'Host Test Name',
required: false,
type: 'text'
type: 'text',
tabIndex: 4,
},
{
key: 'ClientTestName',
label: 'Client Test Name',
required: false,
type: 'text'
type: 'text',
tabIndex: 8,
}
]
},
@ -130,7 +138,8 @@ export const testMapFormFields = [
optionsEndpoint: `${API.BASE_URL}${API.CONTAINER}`,
valueKey: 'ConDefID',
labelKey: (item) => `${item.ConCode} - ${item.ConName}`,
fullWidth: false
fullWidth: false,
tabIndex: 9,
}
]
}

View File

@ -164,7 +164,7 @@
return { ...col, type: 'text', optionsEndpoint: undefined };
}
if (col.key === 'HostTestCode' || col.key === 'HostTestName') {
if (col.key === 'HostTestCode') {
if (formState.form.HostType === 'SITE' && formState.form.HostID) {
return {
...col,
@ -182,7 +182,7 @@
};
}
if (col.key === 'ClientTestCode' || col.key === 'ClientTestName') {
if (col.key === 'ClientTestCode') {
if (formState.form.ClientType === 'SITE' && formState.form.ClientID) {
return {
...col,
@ -207,6 +207,12 @@
}))
}));
});
// $effect(() => {
// if (formState.form.ClientTestCode) {
// formState.form.ClientTestName = 'nyaho';
// }
// })
$inspect(mapFormFieldsTransformed)
</script>

View File

@ -127,7 +127,8 @@
endpointParamKey,
valueKey,
labelKey,
txtKey
txtKey,
tabIndex = 0,
})}
<div class="flex w-full flex-col gap-1.5">
<div class="flex justify-between items-center w-full">
@ -155,6 +156,7 @@
{#if type === 'text'}
<Input
type="text"
tabindex={tabIndex}
bind:value={formState.form[key]}
oninput={() => {
if (validateOn?.includes('input')) {
@ -275,6 +277,18 @@
formState.selectOptions.ClientTestCode = [];
formState.selectOptions.ClientTestName = [];
}
if (key === 'ClientTestCode') {
const selectedItem = formState.selectOptions?.[key]?.find(
(opt) => opt.value === val
);
formState.form.ClientTestName = selectedItem?.rawItem?.TestSiteName ?? '';
}
if (key === 'HostTestCode') {
const selectedItem = formState.selectOptions?.[key]?.find(
(opt) => opt.value === val
);
formState.form.HostTestName = selectedItem?.rawItem?.TestSiteName ?? '';
}
}}
onOpenChange={(open) => {
if (open) {
@ -291,7 +305,7 @@
}
}}
>
<Select.Trigger class="w-full truncate">
<Select.Trigger class="w-full truncate" tabindex={tabIndex}>
{selectedLabel}
</Select.Trigger>
<Select.Content>