327 lines
10 KiB
Vue
327 lines
10 KiB
Vue
<template>
|
|
<div
|
|
v-if="record"
|
|
id="printable"
|
|
>
|
|
<Caption v-bind="{ title: $lang('info') }" />
|
|
<div class="columns is-multiline is-2 m-0">
|
|
<div class="column is-3">
|
|
<div class="field">
|
|
<label class="label">{{ $lang("code") }}:</label>
|
|
<div class="control">
|
|
<span>{{ record.code }}</span>
|
|
</div>
|
|
<p
|
|
class="help is-danger"
|
|
v-if="errors.type"
|
|
>
|
|
{{ errors.type }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="column is-3">
|
|
<div class="field">
|
|
<label class="label">Tài khoản:</label>
|
|
<div class="control">
|
|
<span>{{ record.account__code }}</span>
|
|
</div>
|
|
<p
|
|
class="help is-danger"
|
|
v-if="errors.type"
|
|
>
|
|
{{ errors.type }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="column is-3">
|
|
<div class="field">
|
|
<label class="label">Ngày hạch toán:</label>
|
|
<div class="control">
|
|
{{ $dayjs(record.date).format("DD/MM/YYYY") }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column is-3">
|
|
<div class="field">
|
|
<label class="label">{{ $lang("amount-only") }}:</label>
|
|
<div class="control">
|
|
{{ $numtoString(record.amount) }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column is-3">
|
|
<div class="field">
|
|
<label class="label">Thu / chi:</label>
|
|
<div class="control">
|
|
{{ record.type__name }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column is-3">
|
|
<div class="field">
|
|
<label class="label">Dư trước:</label>
|
|
<div class="control">
|
|
{{ $numtoString(record.balance_before) }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column is-3">
|
|
<div class="field">
|
|
<label class="label">Dư sau:</label>
|
|
<div class="control">
|
|
{{ $numtoString(record.balance_after) }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column is-3">
|
|
<div class="field">
|
|
<label class="label">Mã sản phẩm:</label>
|
|
<div class="control">
|
|
{{ record.product__trade_code }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column is-3">
|
|
<div class="field">
|
|
<label class="label">Mã khách hàng:</label>
|
|
<div class="control">
|
|
{{ record.customer__code }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="column is-3">
|
|
<div class="field">
|
|
<label class="label">Người hạch toán:</label>
|
|
<div class="control">
|
|
{{ `${record.inputer__fullname}` }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column is-3">
|
|
<div class="field">
|
|
<label class="label">{{ $lang("time") }}:</label>
|
|
<div class="control">
|
|
{{ `${$dayjs(record.create_time).format("DD/MM/YYYY")}` }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column is-3">
|
|
<div class="field">
|
|
<label class="label">Ref:</label>
|
|
<div class="control">
|
|
{{ `${record.ref || "/"}` }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column is-8">
|
|
<div class="field">
|
|
<label class="label">{{ $lang("content") }}:</label>
|
|
<div class="control">
|
|
{{ `${record.content}` }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- PHẦN THÔNG TIN PHÂN BỔ -->
|
|
<Caption v-bind="{ title: 'Thông tin phân bổ' }" />
|
|
<!-- BẢNG CHI TIẾT PHÂN BỔ -->
|
|
<div
|
|
v-if="record.allocation_detail && record.allocation_detail.length > 0"
|
|
class="mt-4"
|
|
>
|
|
<div class="table-container">
|
|
<table class="table is-fullwidth is-striped is-hoverable is-bordered">
|
|
<thead>
|
|
<tr class="">
|
|
<th class="has-background-primary has-text-white has-text-centered">STT</th>
|
|
<th class="has-background-primary has-text-white has-text-centered">Mã lịch</th>
|
|
<th class="has-background-primary has-text-white has-text-centered">Loại</th>
|
|
<th class="has-background-primary has-text-white has-text-centered">Tổng phân bổ</th>
|
|
<th class="has-background-primary has-text-white has-text-centered">Gốc</th>
|
|
<th class="has-background-primary has-text-white has-text-centered">Phạt</th>
|
|
<th class="has-background-primary has-text-white has-text-centered">Miễn lãi</th>
|
|
<th class="has-background-primary has-text-white has-text-centered">Ngày phân bổ</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr
|
|
v-for="(item, index) in record.allocation_detail"
|
|
:key="index"
|
|
>
|
|
<td class="has-text-centered">{{ index + 1 }}</td>
|
|
<td>
|
|
<span class="tag is-link is-light">{{ item.schedule_code || item.schedule_id }}</span>
|
|
</td>
|
|
<td class="has-text-centered">
|
|
<span
|
|
v-if="item.type === 'REDUCTION'"
|
|
class="tag is-warning"
|
|
>Miễn lãi</span
|
|
>
|
|
<span
|
|
v-else
|
|
class="tag is-success"
|
|
>Thanh toán</span
|
|
>
|
|
</td>
|
|
<td class="has-text-right">
|
|
<strong>{{ $numtoString(item.amount) }}</strong>
|
|
</td>
|
|
<td class="has-text-right">
|
|
<span
|
|
v-if="item.principal"
|
|
class="has-text-info has-text-weight-semibold"
|
|
>
|
|
{{ $numtoString(item.principal) }}
|
|
</span>
|
|
<span
|
|
v-else
|
|
class="has-text-grey-light"
|
|
>-</span
|
|
>
|
|
</td>
|
|
<td class="has-text-right">
|
|
<span
|
|
v-if="item.penalty"
|
|
class="has-text-danger has-text-weight-semibold"
|
|
>
|
|
{{ $numtoString(item.penalty) }}
|
|
</span>
|
|
<span
|
|
v-else
|
|
class="has-text-grey-light"
|
|
>-</span
|
|
>
|
|
</td>
|
|
<td class="has-text-right">
|
|
<span
|
|
v-if="item.penalty"
|
|
class="has-text-danger has-text-weight-semibold"
|
|
>
|
|
{{ $numtoString(item.penalty_reduce) }}
|
|
</span>
|
|
<span
|
|
v-else
|
|
class="has-text-grey-light"
|
|
>-</span
|
|
>
|
|
</td>
|
|
<td class="has-text-centered">
|
|
{{ $dayjs(item.date).format("DD/MM/YYYY HH:mm:ss") }}
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
<tfoot>
|
|
<tr class="has-background-light">
|
|
<td
|
|
colspan="3"
|
|
class="has-text-right has-text-weight-bold"
|
|
>
|
|
Tổng cộng:
|
|
</td>
|
|
<td class="has-text-right has-text-weight-bold">
|
|
{{ $numtoString(totalAllocated) }}
|
|
</td>
|
|
<td class="has-text-right has-text-weight-bold has-text-info">
|
|
{{ $numtoString(totalPrincipal) }}
|
|
</td>
|
|
<td class="has-text-right has-text-weight-bold has-text-danger">
|
|
{{ $numtoString(totalPenalty) }}
|
|
</td>
|
|
<td class="has-text-right has-text-weight-bold has-text-danger">
|
|
{{ $numtoString(totalPenaltyReduce) }}
|
|
</td>
|
|
<td></td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div
|
|
v-else
|
|
class="notification is-info is-light mt-4"
|
|
>
|
|
<p class="has-text-centered">Chưa có dữ liệu phân bổ cho bút toán này.</p>
|
|
</div>
|
|
|
|
<Caption
|
|
class="mt-5"
|
|
v-bind="{ title: 'Chứng từ' }"
|
|
></Caption>
|
|
<FileGallery v-bind="{ row: record, api: 'entryfile' }"></FileGallery>
|
|
<div
|
|
class="mt-5"
|
|
id="ignore"
|
|
>
|
|
<button
|
|
class="button is-primary has-text-white mr-2"
|
|
@click="$exportpdf('printable', record.code, 'a4', 'landscape')"
|
|
>
|
|
{{ $lang("print") }}
|
|
</button>
|
|
<button
|
|
v-if="record.category === 2"
|
|
class="button is-light"
|
|
@click="viewPhieuThuTienMat"
|
|
>
|
|
Xem phiếu thu
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: ["row"],
|
|
data() {
|
|
return {
|
|
errors: {},
|
|
record: undefined,
|
|
};
|
|
},
|
|
async created() {
|
|
this.record = await this.$getdata("internalentry", { code: this.row.code }, undefined, true);
|
|
},
|
|
computed: {
|
|
// Tính tổng số tiền đã phân bổ
|
|
totalAllocated() {
|
|
if (!this.record || !this.record.allocation_detail) return 0;
|
|
return this.record.allocation_detail.reduce((sum, item) => sum + (item.amount || 0), 0);
|
|
},
|
|
// Tính tổng gốc
|
|
totalPrincipal() {
|
|
if (!this.record || !this.record.allocation_detail) return 0;
|
|
return this.record.allocation_detail.reduce((sum, item) => sum + (item.principal || 0), 0);
|
|
},
|
|
// Tính tổng phạt
|
|
totalPenalty() {
|
|
if (!this.record || !this.record.allocation_detail) return 0;
|
|
return this.record.allocation_detail.reduce((sum, item) => sum + (item.penalty || 0), 0);
|
|
},
|
|
// Tính tổng phạt đã giảm
|
|
totalPenaltyReduce() {
|
|
if (!this.record || !this.record.allocation_detail) return 0;
|
|
return this.record.allocation_detail.reduce((sum, item) => sum + (item.penalty_reduce || 0), 0);
|
|
},
|
|
},
|
|
methods: {
|
|
selected(attr, obj) {
|
|
this.record[attr] = obj;
|
|
this.record = this.$copy(this.record);
|
|
if (attr === "_type") this.category = obj.category__code;
|
|
},
|
|
viewPhieuThuTienMat() {
|
|
const url = `${this.$getpath()}static/contract/PHIEU_THU_TIEN_MAT-${this.record.code}.pdf`;
|
|
window.open(url, "_blank");
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style scoped>
|
|
.column {
|
|
padding-inline: 0;
|
|
}
|
|
</style>
|