Files
hrm/app/components/transaction/AllocateForm.vue
2026-04-06 15:53:14 +07:00

120 lines
3.2 KiB
Vue

<script setup>
const props = defineProps({
allo: Object,
i: Number,
length: Number,
productId: Number,
amount_remain: Number,
totalByRef: Object,
});
const emit = defineEmits(['removeAllocation', 'setAllo']);
const typeOptions = [
{
label: 'Gốc',
value: 'PRINCIPAL',
},
{
label: 'Lãi',
value: 'PENALTY',
},
// {
// label: 'Miễn giảm',
// value: 'REDUCTION',
// },
];
</script>
<template>
<div class="mb-4" style="position: relative">
<a
v-if="length > 1"
class="has-text-danger is-size-7"
style="position: absolute; top: 0.5rem; right: 0.75rem; cursor: pointer"
@click="emit('removeAllocation', i)"
>
Xóa
</a>
<div
class="columns is-multiline is-mobile mb-0"
style="border-top: 1px solid #bbbbbb"
>
<!-- InternalEntry Ref -->
<div class="column is-6">
<div class="field">
<label class="label">Bút toán <span class="has-text-danger">*</span></label>
<div class="control">
<SearchBox
v-bind="{
api: 'internalentry',
field: 'label',
column: ['code'],
first: true,
filter: {
product: props.productId,
allocation_remain__gt: 0,
},
}"
@option="(entry) => {
emit('setAllo', { key: 'date', value: entry.date, i }) ;
emit('setAllo', { key: 'ref', value: entry.code, i });
emit('setAllo', { key: 'allocation_remain', value: entry.allocation_remain, i });
}"
/>
</div>
</div>
</div>
<!-- Type -->
<div class="column is-2">
<div class="field">
<label class="label"
>Loại <span class="has-text-danger">*</span></label
>
<div class="control">
<div class="select is-fullwidth">
<select v-model="allo.type">
<option
v-for="option in typeOptions"
:key="option.value"
:value="option.value"
>
{{ option.label }}
</option>
</select>
</div>
</div>
<p
v-if="amount_remain === 0 && allo.type === 'PRINCIPAL'"
class="help is-danger"
>Số tiền gốc là 0</p>
</div>
</div>
<!-- Amount -->
<div class="column is-4">
<div class="field">
<label class="label"
>Giá trị <span class="has-text-danger">*</span></label
>
<div class="control">
<InputNumber
v-bind="{
record: allo,
attr: 'amount',
defaultValue: true,
}"
@number="(value) => emit('setAllo', { key: 'amount', value, i })"
/>
</div>
<p
v-if="allo.ref && totalByRef && totalByRef[allo.ref] > allo.allocation_remain"
class="help is-danger"
>
Tổng giá trị phân bổ bút toán vượt số tiền chưa phân bổ:
<FormatNumber :value="allo.allocation_remain" />
(Tổng hiện tại: <FormatNumber :value="totalByRef[allo.ref]" />)
</p>
</div>
</div>
</div>
</div>
</template>