refactor: rename agencyFile and agencyFileList to userFile and userFileList for clarity
Some checks failed
Spell Check / Spell Check with Typos (push) Failing after 8s
Some checks failed
Spell Check / Spell Check with Typos (push) Failing after 8s
This commit is contained in:
puriphatt
parent
2e813f6e88
commit
d3e5aec842
2 changed files with 105 additions and 123 deletions
|
|
@ -34,14 +34,13 @@ const importNationality = defineModel<string | null | undefined>(
|
|||
);
|
||||
const trainingPlace = defineModel<string | null | undefined>('trainingPlace');
|
||||
const checkpoint = defineModel<string | null | undefined>('checkpoint');
|
||||
const agencyFile = defineModel<File[]>('agencyFile');
|
||||
const agencyFileList =
|
||||
defineModel<{ name: string; url: string }[]>('agencyFileList');
|
||||
const userFile = defineModel<File[]>('userFile');
|
||||
const userFileList =
|
||||
defineModel<{ name: string; url: string }[]>('userFileList');
|
||||
const remark = defineModel<string | null | undefined>('remark');
|
||||
const agencyStatus = defineModel<string | null | undefined>('agencyStatus');
|
||||
|
||||
const attachmentRef = ref();
|
||||
const checkpointENOption = ref([]);
|
||||
|
||||
defineProps<{
|
||||
dense?: boolean;
|
||||
|
|
@ -71,18 +70,12 @@ function deleteFile(name: string) {
|
|||
userStore.deleteAttachment(userId.value, payload);
|
||||
const result = await userStore.fetchAttachment(userId.value);
|
||||
if (result) {
|
||||
agencyFileList.value = result;
|
||||
userFileList.value = result;
|
||||
}
|
||||
},
|
||||
cancel: () => {},
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
const resultOption = await fetch('/option/option.json');
|
||||
const rawOption = await resultOption.json();
|
||||
checkpointENOption.value = rawOption.eng.border;
|
||||
});
|
||||
</script>
|
||||
<template>
|
||||
<div class="row col-12">
|
||||
|
|
@ -140,11 +133,12 @@ onMounted(async () => {
|
|||
/>
|
||||
|
||||
<SelectOffice
|
||||
v-if="userType === 'MESSENGER'"
|
||||
for="input-responsible-area"
|
||||
v-model:value="responsibleArea"
|
||||
v-if="userType === 'MESSENGER'"
|
||||
:readonly="readonly"
|
||||
:label="$t('personnel.form.responsibleArea')"
|
||||
class="col"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
|
|
@ -198,25 +192,13 @@ onMounted(async () => {
|
|||
(v) => (typeof v === 'string' ? (importNationality = v) : '')
|
||||
"
|
||||
/>
|
||||
<SelectInput
|
||||
:model-value="readonly ? trainingPlace || '-' : trainingPlace"
|
||||
id="select-trainig-place"
|
||||
for="select-trainig-place"
|
||||
:option="optionStore.globalOption.training"
|
||||
class="col-md-6 col-12"
|
||||
:readonly
|
||||
:label="$t('personnel.form.trainingPlace')"
|
||||
clearable
|
||||
@update:model-value="
|
||||
(v) => (typeof v === 'string' ? (trainingPlace = v) : '')
|
||||
"
|
||||
/>
|
||||
|
||||
<SelectInput
|
||||
:model-value="readonly ? checkpoint || '-' : checkpoint"
|
||||
id="select-checkpoint"
|
||||
for="select-checkpoint"
|
||||
:option="optionStore.globalOption.border"
|
||||
class="col-6"
|
||||
class="col-md-6 col-12"
|
||||
:readonly
|
||||
:label="$t('personnel.form.checkpoint')"
|
||||
clearable
|
||||
|
|
@ -224,17 +206,18 @@ onMounted(async () => {
|
|||
(v) => (typeof v === 'string' ? (checkpoint = v) : '')
|
||||
"
|
||||
/>
|
||||
|
||||
<SelectInput
|
||||
:model-value="readonly ? checkpoint || '-' : checkpoint"
|
||||
id="select-checkpoint-en"
|
||||
for="select-checkpoint-en"
|
||||
:option="checkpointENOption"
|
||||
class="col-6"
|
||||
:model-value="readonly ? trainingPlace || '-' : trainingPlace"
|
||||
id="select-trainig-place"
|
||||
for="select-trainig-place"
|
||||
:option="optionStore.globalOption.training"
|
||||
class="col-md-8 col-12"
|
||||
:readonly
|
||||
:label="$t('personnel.form.checkpointEN')"
|
||||
:label="$t('personnel.form.trainingPlace')"
|
||||
clearable
|
||||
@update:model-value="
|
||||
(v) => (typeof v === 'string' ? (checkpoint = v) : '')
|
||||
(v) => (typeof v === 'string' ? (trainingPlace = v) : '')
|
||||
"
|
||||
/>
|
||||
|
||||
|
|
@ -253,7 +236,7 @@ onMounted(async () => {
|
|||
value: AgencyStatus.Blacklist,
|
||||
},
|
||||
]"
|
||||
class="col-md-6 col-12"
|
||||
class="col-md-4 col-12"
|
||||
:readonly
|
||||
:label="$t('personnel.form.agencyStatus')"
|
||||
clearable
|
||||
|
|
@ -275,76 +258,77 @@ onMounted(async () => {
|
|||
"
|
||||
@clear="remark = ''"
|
||||
/>
|
||||
<q-file
|
||||
ref="attachmentRef"
|
||||
for="input-attachment"
|
||||
:dense="dense"
|
||||
outlined
|
||||
:readonly="readonly"
|
||||
multiple
|
||||
append
|
||||
:label="$t('personnel.form.attachment')"
|
||||
class="col"
|
||||
v-model="agencyFile"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<Icon
|
||||
icon="material-symbols:attach-file"
|
||||
width="20px"
|
||||
style="color: var(--brand-1)"
|
||||
/>
|
||||
</template>
|
||||
<template v-slot:file="file">
|
||||
<div class="row full-width items-center">
|
||||
<span class="col ellipsis">
|
||||
{{ file.file.name }}
|
||||
</span>
|
||||
<q-btn
|
||||
dense
|
||||
rounded
|
||||
flat
|
||||
padding="2 2"
|
||||
class="app-text-muted"
|
||||
icon="mdi-close-circle"
|
||||
@click.stop="attachmentRef.removeAtIndex(file.index)"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
|
||||
<div v-if="agencyFileList && agencyFileList?.length > 0" class="col-12">
|
||||
<q-list bordered separator class="rounded" style="padding: 0">
|
||||
<q-item
|
||||
id="attachment-file"
|
||||
for="attachment-file"
|
||||
v-for="item in agencyFileList"
|
||||
clickable
|
||||
:key="item.url"
|
||||
class="items-center row"
|
||||
@click="() => openNewTab(item.url)"
|
||||
>
|
||||
<q-item-section>
|
||||
<div class="row items-center justify-between">
|
||||
<div class="col">
|
||||
{{ item.name }}
|
||||
</div>
|
||||
<q-btn
|
||||
id="delete-file"
|
||||
v-if="!readonly && userId"
|
||||
rounded
|
||||
flat
|
||||
dense
|
||||
unelevated
|
||||
size="md"
|
||||
icon="mdi-trash-can-outline"
|
||||
class="app-text-negative"
|
||||
@click.stop="deleteFile(item.name)"
|
||||
/>
|
||||
<q-file
|
||||
ref="attachmentRef"
|
||||
for="input-attachment"
|
||||
:dense="dense"
|
||||
outlined
|
||||
:readonly="readonly"
|
||||
multiple
|
||||
append
|
||||
:label="$t('personnel.form.attachment')"
|
||||
class="col"
|
||||
v-model="userFile"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<Icon
|
||||
icon="material-symbols:attach-file"
|
||||
width="20px"
|
||||
style="color: var(--brand-1)"
|
||||
/>
|
||||
</template>
|
||||
<template v-slot:file="file">
|
||||
<div class="row full-width items-center">
|
||||
<span class="col ellipsis">
|
||||
{{ file.file.name }}
|
||||
</span>
|
||||
<q-btn
|
||||
dense
|
||||
rounded
|
||||
flat
|
||||
padding="2 2"
|
||||
class="app-text-muted"
|
||||
icon="mdi-close-circle"
|
||||
@click.stop="attachmentRef.removeAtIndex(file.index)"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
</q-file>
|
||||
|
||||
<div v-if="userFileList && userFileList?.length > 0" class="col-12">
|
||||
<q-list bordered separator class="rounded" style="padding: 0">
|
||||
<q-item
|
||||
id="attachment-file"
|
||||
for="attachment-file"
|
||||
v-for="item in userFileList"
|
||||
clickable
|
||||
:key="item.url"
|
||||
class="items-center row"
|
||||
@click="() => openNewTab(item.url)"
|
||||
>
|
||||
<q-item-section>
|
||||
<div class="row items-center justify-between">
|
||||
<div class="col">
|
||||
{{ item.name }}
|
||||
</div>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</div>
|
||||
<q-btn
|
||||
id="delete-file"
|
||||
v-if="!readonly && userId"
|
||||
rounded
|
||||
flat
|
||||
dense
|
||||
unelevated
|
||||
size="md"
|
||||
icon="mdi-trash-can-outline"
|
||||
class="app-text-negative"
|
||||
@click.stop="deleteFile(item.name)"
|
||||
/>
|
||||
</div>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue