Files
FE_CPONE/test/vuex/cpone-md-voucher/components/oneCloseList.vue
2026-04-27 10:13:31 +07:00

1035 lines
41 KiB
Vue

<template>
<v-layout class="fill-height" column>
<one-dialog-print :title="printtitle" :width="printwidth" :height="550" :status="openprintnote" :urlprint="urlprintnote"
@close-dialog-print="openprintnote = false"></one-dialog-print>
<!-- alert dialog start -->
<v-dialog v-model="dialogsuccess" persistent max-width="290">
<v-card>
<v-card-title color="success" class="headline">Berhasil !</v-card-title>
<v-card-text>
{{msgsuccess}}
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="green darken-1" flat @click="closeDialogSuccess">OK</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- alert dialog end -->
<!-- alert dialog error start -->
<v-dialog v-model="dialogerror" persistent max-width="290">
<v-card>
<v-card-title color="error" class="headline">Error !</v-card-title>
<v-card-text>
{{msgerror}}
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="green darken-1" flat @click="closeDialogError">OK</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- alert dialog error end -->
<!-- dialog confirmation start -->
<v-dialog v-model="dialogconfirmationdelete" persistent max-width="290">
<v-card>
<v-card-title dark class="headline error pt-2 pb-2" primary-title style="color:white">
<h4 dark>Konfirmasi</h4>
</v-card-title>
<v-card-text>
{{msgconfirmationdelete}}
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn small color="error darken-1 text-sm-left" flat @click="doDeleteData()">Hapus</v-btn>
<v-btn small color="primary darken-1 text-sm-right" flat @click="dialogconfirmationdelete = false">Batal</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- dialog confirmation end -->
<!-- dialog add start -->
<v-dialog v-model="dialogadd" persistent max-width="900">
<v-card>
<v-card-title dark class="headline primary pt-2 pb-2" primary-title style="color:white; display: flex; justify-content: space-between;">
<h4 dark>Voucher</h4>
<!-- <v-btn icon @click="dialogadd = false" class="pt-2 pb-2" style="color: white;">
<v-icon>close</v-icon>
</v-btn> -->
<v-btn icon @click="closeForm()" class="pt-2 pb-2" style="color: white;">
<v-icon>close</v-icon>
</v-btn>
</v-card-title>
<v-card-text class="pt-0 pb-0">
<v-layout row wrap>
<!-- left start -->
<v-flex xs12 pa-2>
<v-layout>
<v-flex xs6 pa-2>
<v-text-field
color="black"
label="Nama Voucher"
v-model="inp_VoucherHeaderName"
single-line
hide-details
></v-text-field>
<p v-if="_.isEmpty(inp_VoucherHeaderName)" class="error caption mt-1 mb-0 pl-2 pr-2 pb-2" style="color:#fff">Belum isi nama voucher</p>
<!-- nama voucher -->
</v-flex>
<v-flex xs6 pa-2>
<!-- prefix -->
<v-text-field
color="black"
label="Kode(Awalan)"
v-model="inp_VoucherHeaderPrefix"
single-line
hide-details
></v-text-field>
<p v-if="_.isEmpty(inp_VoucherHeaderPrefix)" class="error caption mt-1 mb-0 pl-2 pr-2 pb-2" style="color:#fff">Belum isi prefix</p>
</v-flex>
</v-layout>
<v-layout>
<v-flex xs6 pa-2>
<v-text-field
color="black"
label="Nilai Voucher (Rp)"
v-model="inp_VoucherHeaderAmount"
single-line
hide-details
></v-text-field>
<p v-if="_.isEmpty(inp_VoucherHeaderAmount)" class="error caption mt-1 mb-0 pl-2 pr-2 pb-2" style="color:#fff">Belum isi nilai voucher</p>
</v-flex>
<v-flex xs6 pa-2>
<!-- nilai voucher -->
<!-- prefix -->
<v-text-field
color="black"
label="Jumlah Cetak Voucher"
v-model="inp_VoucherHeaderQty"
single-line
hide-details
></v-text-field>
<p v-if="_.isEmpty(inp_VoucherHeaderQty)" class="error caption mt-1 mb-0 pl-2 pr-2 pb-2" style="color:#fff">Belum isi jumlah cetak voucher</p>
</v-flex>
</v-layout>
<v-layout>
<!-- tgl start date -->
<v-flex xs6 pt-2>
<v-menu
v-model="menufilterdatestart"
:close-on-content-click="false"
:nudge-right="40"
lazy
transition="scale-transition"
offset-y
hide-details
full-width
max-width="290px"
min-width="290px"
>
<template v-slot:activator="{ on }">
<v-text-field
v-model="filterComputedDateFormattedStart"
label="Tanggal Awal"
style="font-size:14px"
hide-details
readonly
v-on="on"
@blur="date = deFormatedDate(filterComputedDateFormattedStart)"
></v-text-field>
</template>
<v-date-picker
:disabled="xact === 'edit'"
v-model="xdatestart" no-title @input="menufilterdatestart = false"
></v-date-picker>
</v-menu>
</v-flex>
<!-- tgl start date -->
<!-- tgl end date -->
<v-flex xs6 pt-2>
<v-menu
v-model="menufilterdateend"
:close-on-content-click="false"
:nudge-right="40"
lazy
transition="scale-transition"
offset-y
full-width
hide-details
max-width="290px"
min-width="290px"
>
<template v-slot:activator="{ on }">
<v-text-field
v-model="filterComputedDateFormattedEnd"
label="Tanggal Akhir"
style="font-size:14px"
readonly
hide-details
v-on="on"
@blur="date = deFormatedDate(filterComputedDateFormattedEnd)"
></v-text-field>
</template>
<v-date-picker
:disabled="xact === 'edit'"
:min="xdatestart" v-model="xdateend" no-title @input="menufilterdateend = false"
></v-date-picker>
</v-menu>
</v-flex>
<!-- tgl end date -->
</v-layout>
<!-- prefix -->
<v-text-field
color="black"
label="Catatan"
v-model="inp_VoucherHeaderNote"
single-line
hide-details
></v-text-field>
</v-layout>
</v-card-text>
<v-card-actions>
<v-btn color="blue darken-1" flat @click="closeForm()">Tutup</v-btn>
<v-spacer></v-spacer>
<v-btn v-if="!_.isEmpty(inp_VoucherHeaderName)
&& !_.isEmpty(inp_VoucherHeaderPrefix)
&& !_.isEmpty(inp_VoucherHeaderAmount)
&& !_.isEmpty(inp_VoucherHeaderQty)
&& act == 'new'"
color="blue darken-1" flat @click="saveData()">Simpan</v-btn>
<v-btn v-if="!_.isEmpty(inp_VoucherHeaderName)
&& !_.isEmpty(inp_VoucherHeaderPrefix)
&& !_.isEmpty(inp_VoucherHeaderAmount)
&& !_.isEmpty(inp_VoucherHeaderQty)
&& act == 'edit'"
color="blue darken-1" flat @click="saveData()">Simpan Perubahan</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- dialog add end -->
<v-layout row wrap >
<v-flex xs6 class="left" fill-height pa-1>
<v-card class=" mb-2 pa-2 searchbox" >
<v-layout >
<v-menu
ref="menustartdate"
v-model="menustartdate"
:close-on-content-click="false"
:nudge-right="0"
lazy
transition="scale-transition"
offset-y
full-width
max-width="290px"
min-width="290px"
>
<template v-slot:activator="{ on }">
<v-text-field
v-model="startDateFormatted"
label="Tanggal Awal"
readonly
hide-details
class="xs3 ma-1"
outline
v-on="on"
@blur="deFormatedDate(startDateFormatted)"
></v-text-field>
</template>
<v-date-picker v-model="xstartdate" no-title @input="menustartdate = false"></v-date-picker>
</v-menu>
<v-menu
ref="menuenddate"
v-model="menuenddate"
:close-on-content-click="false"
:nudge-right="0"
lazy
transition="scale-transition"
offset-y
full-width
max-width="290px"
min-width="290px"
>
<template v-slot:activator="{ on }">
<v-text-field
v-model="endDateFormatted"
label="Tanggal Akhir"
hide-details
outline
class="xs3 ma-1"
readonly
v-on="on"
@blur="deFormatedDate(endDateFormatted)"
></v-text-field>
</template>
<v-date-picker v-model="xenddate" no-title @input="menuenddate = false"></v-date-picker>
</v-menu>
<v-text-field class="xs3 ma-1"
label=""
placeholder="No. Prefix / Nama Voucher"
single-line
outline
v-model="searchnamelab"
hide-details
></v-text-field>
<span @click="searchClose" class="icon-medium-fill-base xs1 white--text success iconsearch-search"></span>
<span @click="openVoucher"
class="icon-medium-fill-base xs1 white--text primary ml-1 icon-add"></span>
</v-layout>
</v-card>
<v-card >
<v-layout row >
<v-flex pl-2 pr-2 pt-2 pb-2 >
<v-data-table
:headers="headers"
:items="closes"
:loading="isLoading"
hide-actions class="elevation-1">
<template slot="items" slot-scope="props">
<td :class="['text-xs-left pa-2', { 'row-selected': isSelected(props.item) }]" @click="selectMe(props.item)" >{{ props.item.periode }}</td>
<td :class="['text-xs-left pa-2', { 'row-selected': isSelected(props.item) }]" @click="selectMe(props.item)" >{{ props.item.VoucherHeaderName}}
<p style="color:#800000" class="mb-0 font-weight-bold caption">{{ props.item.VoucherHeaderPrefix}} ({{ props.item.VoucherHeaderQty}}) </p></td>
<td :class="['text-xs-left pa-2', { 'row-selected': isSelected(props.item) }]" @click="selectMe(props.item)" >{{ convertMoney(props.item.VoucherHeaderAmount)}}</td>
<td :class="['text-xs-left pa-2', { 'row-selected': isSelected(props.item) }]" @click="selectMe(props.item)" >{{ props.item.VoucherHeaderNote}}</td>
<td :class="['text-xs-left pa-2', { 'row-selected': isSelected(props.item) }]" @click="selectMe(props.item)" >
<v-btn v-if="props.item.isused == 'N'"
style="min-width:25px; margin:0" color="info"
@click="editData(props.item)" small
>
<v-icon small>edit</v-icon>
</v-btn>
<v-btn
style="min-width:25px; margin:0" color="grey"
@click="printControlCard(props.item)" small
>
<v-icon small>print</v-icon>
</v-btn>
</td>
</template>
</v-data-table>
<v-divider></v-divider>
<v-pagination
style="margin-top:10px;margin-bottom:10px"
v-model="curr_page"
:length="xtotal_page"
></v-pagination>
</v-flex>
</v-layout>
</v-card>
</v-flex>
<v-flex xs6 class="right" fill-height pa-1>
<v-card class=" mb-2 pa-2 searchbox" >
<v-layout column>
<v-layout row wrap align-center class="mb-2">
<v-flex xs8 class="pa-1">
<v-autocomplete
label="Filter Voucher (Nama/Prefix)"
v-model="selected_voucher_header"
:items="voucher_header_options"
:search-input.sync="voucherFilterSearch"
no-filter
hide-details
outline
dense
return-object
item-text="displayLabel"
:loading="voucher_header_loading"
clearable
no-data-text="Ketik untuk cari voucher..."
placeholder="Ketik nama/prefix voucher..."
@change="onVoucherFilterChange"
>
<template slot="item" slot-scope="{ item }">
<v-list-tile-content>
<v-list-tile-title v-text="item.displayLabel"></v-list-tile-title>
<v-list-tile-sub-title v-if="item.periode" v-text="item.periode"></v-list-tile-sub-title>
</v-list-tile-content>
</template>
</v-autocomplete>
</v-flex>
<v-flex xs4 class="pa-1 pt-0 mt-0">
<v-select
v-model="detail_status_value"
:items="detail_statuses"
item-text="name"
item-value="value"
placeholder="Status"
hide-details
outline
@change="onStatusChange"
></v-select>
</v-flex>
</v-layout>
<v-layout >
<v-text-field class="xs3 ma-1"
label=""
placeholder="Nomor Voucher / Nomor Lab"
single-line
outline
v-model="searchnolab"
hide-details
></v-text-field>
<span @click="searchDetail" class="icon-medium-fill-base xs1 white--text success iconsearch-search"></span>
</v-layout>
</v-layout>
</v-card>
<v-card >
<v-layout row >
<v-flex pl-2 pr-2 pt-2 pb-2 >
<v-data-table
:headers="headersdetail"
:items="xvouchersdetails"
:loading="isLoading"
hide-actions class="elevation-1">
<template slot="items" slot-scope="props">
<td style="width:10px" class="text-xs-left">{{props.item.VoucherDetailNumber}}</td>
<td style="width:10px" class="text-xs-left">{{props.item.statusvoucher}}</td>
<td class="text-xs-left pa-2">{{ props.item.T_OrderHeaderLabNumber}}
<p style="color:#800000" class="mb-0 font-weight-bold caption">{{ props.item.T_OrderHeaderDate}}</p>
</td>
</template>
</v-data-table>
<v-divider></v-divider>
<v-pagination
style="margin-top:10px;margin-bottom:10px"
v-model="curr_page_detail"
:length="xtotal_page_detail"
></v-pagination>
</v-flex>
</v-layout>
</v-card>
</v-flex>
</v-layout>
</v-layout>
</template>
<style scoped>
span.xtd {
margin-right:10px;
}
.searchbox .v-input.v-text-field .v-input__slot{
min-height:40px;
}
.searchbox .v-btn {
min-height:40px;
}
table.v-table tbody td,table.v-table tbody th {
height: 40px;
}
table.v-table thead tr {
height: 40px;
}
td.row-selected {
background-color: #e3f2fd !important;
}
.v-messages{
min-height:0px!important;
}
</style>
<script>
module.exports = {
components : {'one-dialog-print': httpVueLoader('../../common/oneDialogPrintX.vue')
},
mounted() {
this.$store.dispatch("close/search",{
startdate:this.xstartdate,
enddate:this.xenddate,
search: this.searchnamelab,
current_page:1,
lastidx:0
})
this.$store.dispatch("close/searchdetail",{
search: this.searchnolab,
current_page: 1,
ID: 0,
status: this.$store.state.close.detail_status_value || ''
})
},
methods : {
convertMoney(money) {
return one_money(money)
},
printControlCard(val) {
this.printwidth = 1200
this.printtitle = ""
let user = one_user()
var rpt = 'rpt_hs_001'
this.urlprintnote = "/birt/run?__report=report/one/fo/" + rpt + ".rptdesign&__format=pdf&username=" +
user.M_UserUsername + "&PID=" + val.VoucherHeaderID
this.$store.commit("close/update_open_print_note", true)
},
openVoucher(){
this.$store.commit("close/update_act", 'new')
this.$store.commit("close/update_xid", 0)
this.$store.commit("close/update_dialog_add", true)
this.$store.commit("close/update_inp_VoucherHeaderName", '')
this.$store.commit("close/update_inp_VoucherHeaderPrefix", '')
this.$store.commit("close/update_inp_VoucherHeaderAmount", '')
this.$store.commit("close/update_inp_VoucherHeaderQty", '')
this.$store.commit("close/update_inp_VoucherHeaderNote", '')
this.$store.commit("close/update_datestart", moment(new Date()).format('YYYY-MM-DD'))
this.$store.commit("close/update_dateend", moment(new Date()).format('YYYY-MM-DD'))
},
editData(data){
this.$store.commit("close/update_act", 'edit')
this.$store.commit("close/update_xid", data.VoucherHeaderID)
this.$store.commit("close/update_dialog_add", true)
this.$store.commit("close/update_inp_VoucherHeaderName", data.VoucherHeaderName)
this.$store.commit("close/update_inp_VoucherHeaderPrefix", data.VoucherHeaderPrefix)
this.$store.commit("close/update_inp_VoucherHeaderAmount", data.VoucherHeaderAmount)
this.$store.commit("close/update_inp_VoucherHeaderQty", data.VoucherHeaderQty)
this.$store.commit("close/update_inp_VoucherHeaderNote", data.VoucherHeaderNote)
this.$store.commit("close/update_datestart", data.VoucherHeaderStartDate)
this.$store.commit("close/update_dateend", data.VoucherHeaderEndDate)
},
closeForm(){
this.$store.commit("close/update_inp_T_PacketName", "")
this.$store.commit("close/update_dialog_add", false)
},
closeDialogSuccess() {
this.$store.commit("close/update_dialog_success", false)
},
closeDialogError() {
this.$store.commit("close/update_dialog_error", false)
},
doDeleteData() {
this.$store.commit("close/update_dialog_confirmation_delete", false)
},
selectMe(pat) {
this.$store.commit("close/update_selected_close", pat)
this.$nextTick(() => this.searchDetail())
},
savetutup() {
this.$store.dispatch("close/savetutup",{
pPaymentKasirID:this.F_PaymentKasirID,
pUserID:JSON.parse(localStorage.getItem('user')).M_UserID
})
},
saveData() {
var prm = {
xid:this.$store.state.close.xid,
act:this.$store.state.close.act,
VoucherHeaderName:this.$store.state.close.inp_VoucherHeaderName,
VoucherHeaderPrefix:this.$store.state.close.inp_VoucherHeaderPrefix,
VoucherHeaderAmount:this.$store.state.close.inp_VoucherHeaderAmount,
VoucherHeaderQty:this.$store.state.close.inp_VoucherHeaderQty,
VoucherHeaderNote:this.$store.state.close.inp_VoucherHeaderNote,
VoucherHeaderStartDate: this.$store.state.close.datestart,
VoucherHeaderEndDate: this.$store.state.close.dateend,
lastid: -1
};
// console.log('inputan ',prm)
this.$store.dispatch("close/saveData", prm)
},
formatDate (date) {
if (!date) return null
const [year, month, day] = date.split('-')
return `${day}-${month}-${year}`
},
deFormatedDate (date) {
if (!date) return null
const [ day,month, year] = date.split('-')
return `${year}-${month.padStart(2, '0')}-${day.padStart(2, '0')}`
},
isSelected(p) {
return p.VoucherHeaderID == this.$store.state.close.selected_close.VoucherHeaderID
},
searchClose() {
this.$store.dispatch("close/search",{
startdate:this.xstartdate,
enddate:this.xenddate,
search:this.searchnamelab,
status: this.status.value,
current_page:1,
lastidx:0
})
},
searchDetail() {
this.$store.commit("close/update_current_page_detail", 1)
var state = this.$store.state.close
var id = state.detail_filter_voucher_id || (state.selected_close && state.selected_close.VoucherHeaderID) || 0
id = id ? Number(id) : 0
var statusVal = state.detail_status_value || ''
this.$store.dispatch("close/searchdetail", {
search: this.searchnolab,
current_page: 1,
ID: id,
status: statusVal
})
},
thr_search_voucher: _.debounce(function () {
var q = this.$store.state.close.voucher_header_search || ''
if (q.length < 2) {
this.$store.commit("close/update_voucher_header_options", [])
return
}
try {
this.$store.dispatch("close/searchVoucherHeaders", {
startdate: this.xstartdate,
enddate: this.xenddate,
search: q,
current_page: 1
})
} catch (e) {}
}, 500),
onVoucherFilterChange() {
this.searchDetail()
},
fetchVoucherHeaders(search) {
try {
this.$store.dispatch("close/searchVoucherHeaders", {
startdate: this.xstartdate,
enddate: this.xenddate,
search: search || '',
current_page: 1
})
} catch (e) {}
},
onStatusChange() {
this.searchDetail()
},
printControlCard(value){
this.printwidth = 800
this.printtitle = ""
let idx = value.F_PaymentKasirID
let user = one_user()
var tm = new Date()
this.xurl = "/birt/run?__report=report/one/rekap/rpt_r_011.rptdesign&__format=pdf&username="+user.M_UserUsername+"&PID="+idx+"&tm="+tm
this.$store.commit("close/update_open_print_note",true)
this.$store.commit("close/update_selected_paymentkasir_id",value.F_PaymentKasirID)
}
},
computed: {
F_PaymentKasirID :{
get() {
return this.$store.state.close.selected_paymentkasir_id
}
},
xact() {
return this.$store.state.close.act
},
xid: {
get() {
return this.$store.state.close.xid
},
set(val) {
this.$store.commit("close/update_xid", val)
}
},
act: {
get() {
return this.$store.state.close.act
},
set(val) {
this.$store.commit("close/update_act", val)
}
},
dialogadd: {
get() {
return this.$store.state.close.dialog_add
},
set(val) {
this.$store.commit("close/update_dialog_add", val)
}
},
dialogedit: {
get() {
return this.$store.state.close.dialog_edit
},
set(val) {
this.$store.commit("close/update_dialog_edit", val)
}
},
dialogsuccess: {
get() {
return this.$store.state.close.dialog_success
},
set(val) {
this.$store.commit("close/update_dialog_success", val)
}
},
dialogerror: {
get() {
return this.$store.state.close.dialog_error
},
set(val) {
this.$store.commit("close/update_dialog_error", val)
}
},
msgsuccess() {
return this.$store.state.close.msg_success || ''
},
msgerror() {
return this.$store.state.close.msg_error || this.$store.state.close.search_error_message || ''
},
msgconfirmationdelete() {
return this.$store.state.close.msg_confirmation_delete || ''
},
xstartdate:{
get() {
return this.$store.state.close.start_date
},
set(val) {
this.$store.commit("close/update_start_date",val)
}
},
xenddate:{
get() {
return this.$store.state.close.end_date
},
set(val) {
this.$store.commit("close/update_end_date",val)
}
},
xdatestart : {
get() {
return this.$store.state.close.datestart
},
set(val) {
this.$store.commit("close/update_datestart",val)
}
},
xdateend : {
get() {
return this.$store.state.close.dateend
},
set(val) {
this.$store.commit("close/update_dateend",val)
//this.searchTransaction()
}
},
filterComputedDateFormattedStart () {
return this.formatDate(this.xdatestart)
},
filterComputedDateFormattedEnd () {
return this.formatDate(this.xdateend)
},
dialogconfirmationdelete: {
get() {
return this.$store.state.close.dialog_confirmation_delete
},
set(val) {
this.$store.commit("close/update_dialog_confirmation_delete", val)
}
},
searchnamelab:{
get() {
return this.$store.state.close.search
},
set(val) {
this.$store.commit("close/update_search",val)
}
},
searchnolab:{
get() {
return this.$store.state.close.searchnolab
},
set(val) {
this.$store.commit("close/update_searchnolab",val)
}
},
voucher_header_options() {
return this.$store.state.close.voucher_header_options || []
},
voucher_header_loading() {
return this.$store.state.close.voucher_header_loading === true
},
voucherFilterSearch: {
get() {
return this.$store.state.close.voucher_header_search || ''
},
set(val) {
if (val == null) return
this.$store.commit('close/update_voucher_header_search', val)
}
},
selected_voucher_header: {
get() {
return this.$store.state.close.selected_voucher_header
},
set(val) {
this.$store.commit('close/update_selected_voucher_header', val)
}
},
detail_statuses() {
return this.$store.state.close.detail_statuses || []
},
selected_detail_status: {
get() {
return this.$store.state.close.selected_detail_status || { name: 'Semua', value: '' }
},
set(val) {
this.$store.commit("close/update_selected_detail_status", val || { name: 'Semua', value: '' })
}
},
detail_status_value: {
get() {
return this.$store.state.close.detail_status_value !== undefined ? this.$store.state.close.detail_status_value : ''
},
set(val) {
this.$store.commit("close/update_detail_status_value", val === 'Y' || val === 'N' ? val : '')
}
},
detail_filter_voucher_id() {
return this.$store.state.close.detail_filter_voucher_id || 0
},
statuses(){
return this.$store.state.close.statuses
},
status:{
get() {
return this.$store.state.close.selected_status
},
set(val) {
this.$store.commit("close/update_selected_status",val)
}
},
openprintnote: {
get() {
return this.$store.state.close.open_print_note
},
set(val) {
this.$store.commit("close/update_open_print_note",false)
}
},
selpat(){
return this.$store.state.close.selected_close
},
startDateFormatted () {
return this.formatDate(this.xstartdate)
},
endDateFormatted () {
return this.formatDate(this.xenddate)
},
isLoading() {
return this.$store.state.close.search_status == 1
},
closes() {
return this.$store.state.close.closes
},
xvouchersdetails() {
return this.$store.state.close.xvouchersdetails
},
curr_page: {
get() {
return this.$store.state.close.current_page
},
set(val) {
this.$store.commit("close/update_current_page",val)
this.$store.dispatch("close/search",{
startdate:this.xstartdate,
enddate:this.xenddate,
search: this.searchnamelab,
status: this.status.value,
current_page:val,
lastidx:0
})
}
},
xtotal_page: {
get() {
return this.$store.state.close.total_page
},
set(val) {
this.$store.commit("close/update_total_page",val)
}
},
curr_page_detail: {
get() {
return this.$store.state.close.current_page_detail
},
set(val) {
this.$store.commit("close/update_current_page_detail", val)
var state = this.$store.state.close
var id = state.detail_filter_voucher_id || (state.selected_close && state.selected_close.VoucherHeaderID) || 0
id = id ? Number(id) : 0
this.$store.dispatch("close/searchdetail", {
search: this.searchnolab,
current_page: val,
ID: id,
status: state.detail_status_value || ''
})
}
},
xtotal_page_detail: {
get() {
return this.$store.state.close.total_page_detail
},
set(val) {
this.$store.commit("close/update_total_page_detail",val)
}
},
inp_VoucherHeaderName:{
get() {
return this.$store.state.close.inp_VoucherHeaderName
},
set(val) {
this.$store.commit("close/update_inp_VoucherHeaderName", val)
}
},
inp_VoucherHeaderPrefix:{
get() {
return this.$store.state.close.inp_VoucherHeaderPrefix
},
set(val) {
this.$store.commit("close/update_inp_VoucherHeaderPrefix", val)
}
},
inp_VoucherHeaderAmount:{
get() {
return this.$store.state.close.inp_VoucherHeaderAmount
},
set(val) {
this.$store.commit("close/update_inp_VoucherHeaderAmount", val)
}
},
inp_VoucherHeaderQty:{
get() {
return this.$store.state.close.inp_VoucherHeaderQty
},
set(val) {
this.$store.commit("close/update_inp_VoucherHeaderQty", val)
}
},
inp_VoucherHeaderNote:{
get() {
return this.$store.state.close.inp_VoucherHeaderNote
},
set(val) {
this.$store.commit("close/update_inp_VoucherHeaderNote", val)
}
},
},
watch: {
voucherFilterSearch(val, old) {
if (val == null || typeof val === 'undefined') val = ''
if (val === old) return
if (this.$store.state.close.voucher_header_loading) return
this.$store.commit('close/update_voucher_header_search', val)
this.thr_search_voucher()
}
},
data() {
return {
xheight:400,
menufilterdatestart:false,
menufilterdateend:false,
xurl:'',
items: [],
menustartdate:false,
menuenddate:false,
dialog:false,
urlprintnote:'',
printtitle:'',
printwidth:'90%',
headers: [
{
text: "PERIODE",
align: "center",
sortable: false,
value: "mr",
width: "30%",
class: "pa-2 blue lighten-3 white--text"
},
{
text: "NAMA VOUCHER",
align: "center",
sortable: false,
value: "lab",
width: "15%",
class: "pa-2 blue lighten-3 white--text"
},
{
text: "NILAI (RP)",
align: "center",
sortable: false,
value: "name",
width: "10%",
class: "pa-2 blue lighten-3 white--text"
},
{
text: "CATATAN",
align: "center",
sortable: false,
value: "name",
width: "30%",
class: "pa-2 blue lighten-3 white--text"
},
{
text: "ACTION",
align: "center",
sortable: false,
value: "name",
width: "15%",
class: "pa-2 blue lighten-3 white--text"
}
],
headersdetail: [{
text: "NOMOR VOUCHER",
align: "left",
sortable: false,
value: "mr",
width: "30%",
class: "pa-1 blue lighten-3 white--text"
},
{
text: "STATUS",
align: "left",
sortable: false,
value: "lab",
width: "30%",
class: "pa-1 blue lighten-3 white--text"
},
{
text: "NOMOR ORDER",
align: "left",
sortable: false,
value: "lab",
width: "40%",
class: "pa-1 blue lighten-3 white--text"
}
]
}
}
}
</script>