Files
web/app/components/accounting/DebtProduct.vue
2026-05-05 11:06:49 +07:00

96 lines
2.6 KiB
Vue

<template>
<div class="columns is-multiline mx-0">
<div class="column is-3">
<div class="field">
<label class="label">Từ ngày<b class="ml-1 has-text-danger">*</b></label>
<div class="control">
<Datepicker
v-bind="{ record, attr: 'fdate', maxdate: new Date() }"
@date="selected('fdate', $event)"
></Datepicker>
</div>
<p
class="help is-danger"
v-if="errors.issued_date"
>
{{ errors.issued_date }}
</p>
</div>
</div>
<div class="column is-3">
<div class="field">
<label class="label">Đến ngày<b class="ml-1 has-text-danger">*</b></label>
<div class="control">
<Datepicker
v-bind="{ record, attr: 'tdate', maxdate: new Date() }"
@date="selected('tdate', $event)"
></Datepicker>
</div>
<p
class="help is-danger"
v-if="errors.issued_date"
>
{{ errors.issued_date }}
</p>
</div>
</div>
</div>
<DataView
v-bind="vbind"
v-if="vbind"
/>
</template>
<script>
export default {
data() {
return {
fdate: this.$dayjs().format("YYYY-MM-DD"),
tdate: this.$dayjs().format("YYYY-MM-DD"),
record: {},
errors: {},
vbind: null,
};
},
created() {
this.record = { fdate: this.fdate, tdate: this.tdate };
this.loadData();
},
methods: {
selected(attr, value) {
console.log("===date===", attr, value, this.fdate, this.tdate);
if (attr === "fdate") this.fdate = value;
else this.tdate = value;
this.loadData();
},
loadData() {
this.vbind = undefined;
setTimeout(
() =>
(this.vbind = {
setting: "debt-product-1",
api: "internalentry",
params: {
values:
"product,product__prdbk__transaction__amount_received,product__trade_code,product__prdbk__transaction__sale_price,product__zone_type__name,customer,customer__code,customer__fullname",
distinct_values: {
sumCR: {
type: "Sum",
filter: { type__code: "CR" },
field: "amount",
},
sumDR: {
type: "Sum",
filter: { type__code: "DR" },
field: "amount",
},
},
summary: "annotate",
filter: { date__gte: this.fdate, date__lte: this.tdate },
},
}),
);
},
},
};
</script>