<template>
    <v-layout class="mb-2" column>
        <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>
        <v-card>
            <v-layout row>
                <v-flex xs12>
                    <v-subheader red--text text--lighten-1> SETUP FORM
                        <v-flex text-md-right>
                            <v-btn v-if="status.id === 'N'" @click="downloadxapp()" small color="info">download</v-btn>
                        </v-flex>
                    </v-subheader>
                    <v-divider></v-divider>
                    <v-layout row wrap>
                        <v-flex xs12 pa-2>
                            <v-layout row>
                                <v-flex xs3 pa-1>
                                    <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="Periode Awal"
                                            style="font-size:12px"
                                            outline
                                            hide-details
                                            readonly
                                            v-on="on"
                                            @blur="date = deFormatedDate(filterComputedDateFormattedStart)"
                                            ></v-text-field>
                                        </template>
                                        <v-date-picker v-model="xdatestart" no-title @input="menufilterdatestart = false"></v-date-picker>
                                    </v-menu>
                                </v-flex>
                                <v-flex xs3 pa-1>
                                    <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="Periode Akhir"
                                            outline
                                            style="font-size:12px"
                                            readonly
                                            hide-details
                                            v-on="on"
                                            @blur="date = deFormatedDate(filterComputedDateFormattedEnd)"
                                            ></v-text-field>
                                        </template>
                                        <v-date-picker :min="xdatestart" v-model="xdateend" no-title @input="menufilterdateend = false"></v-date-picker>
                                    </v-menu>
                                </v-flex>
                                <v-flex xs6 pa-1>
                                   
                                    <v-autocomplete
                                        style="font-size:12px"
                                        label="Cari Kel. Pelanggan ..."
                                        v-model="xordercompany"
                                        :items="xordercompanies"
                                        :search-input.sync="search_company"
                                        auto-select-first
                                        outline
                                        no-filter
                                        :disabled="xselmous.length > 0"
                                        item-text="name"
                                        return-object
                                        :loading="is_loading"
                                        hide-details
                                        no-data-text="Pilih Kel. Pelanggan"
                                        >
                                        <template
                                            slot="item"
                                            slot-scope="{ item }"
                                            >
                                            <v-list-tile-content>
                                                <v-list-tile-title v-text="item.name"></v-list-tile-title>
                                            </v-list-tile-content>
                                        </template>
                                    </v-autocomplete>
                                     <p  v-if="_.isEmpty(xordercompany)" class="error caption mt-1 mb-0 pl-2 pr-2" style="color:#fff">Belum milih kel. pelanggan</p>
                                </v-flex>
                            </v-layout>
                        </v-flex>
                    </v-layout>
                </v-flex>
            </v-layout>
            <v-divider></v-divider>
            <v-layout row>
                <v-flex xs6 pa-2>
                    <v-layout  align-center row>
                        <v-flex xs10>
                            <!--<p  v-if="xselmous.length === 0" class="error pl-2 pr-2" style="color:#fff">Belum ada agreement yang dipilih</p>-->
                            <v-select
                                outline
                                style="font-size:12px"
                                class="pa-1 mini-select"
                                item-text="name"
                                return-object
                                :items="xmous" 
                                v-model="xmou"
                                label="Agreement"
                                hide-details
                            ></v-select>
                        </v-flex>
                        <v-flex class="text-xs-right" xs2>
                            <v-btn :disabled="xmous.length === 0 || _.isEmpty(xmou)" @click="addmou()" 
                                style="background:#ffeead;min-width:25px" small><v-icon small>add</v-icon>
                            </v-btn>
                        </v-flex>
                    </v-layout>
                    <v-layout v-if="xselmous.length > 0" v-for="selmou in xselmous" pa-1 row>
                        <v-flex xs12>
                            <v-card color="#ffeead">
                                <v-card-text>
                                    <v-layout row>
                                        <v-flex xs10>
                                            <p class="mb-0">
                                                <v-btn flat @click="openPrint(selmou)" small style="margin:0px;min-width:20px"><v-icon>description</v-icon> </v-btn>
                                                {{selmou.name}}
                                            </p>
                                        </v-flex>
                                        <v-flex class="text-xs-right" xs2>
                                            <p style="cursor:pointer" @click="delmou(selmou)" class="mb-0"><v-icon small>close</v-icon></p>
                                        </v-flex>
                                    </v-layout>
                                </v-card-text>
                            </v-card>
                        </v-flex>
                    </v-layout>
                    <v-layout v-if="xselmous.length === 0" pa-1 row>
                        <v-flex xs12>
                            <v-card color="#ffeead">
                                <v-card-text>
                                    <v-layout row>
                                        <v-flex class="text-xs-center" xs12>
                                            <p style="background:#ffeead;cursor:pointer" class="warning-text mb-0">Belum ada agreement yang dipilih</p>
                                        </v-flex>
                                    </v-layout>
                                </v-card-text>
                            </v-card>
                        </v-flex>
                    </v-layout>
                </v-flex>
                <v-flex xs6 pa-2>
                    <!--<p  v-if="xseldoctors.length === 0" class="error pl-2 pr-2" style="color:#fff">Dokter yang akan dipakai harap dipilih dulu</p>-->
                    <v-layout align-center row>
                        <v-flex xs10>
                            <v-autocomplete
                                style="font-size:12px"
                                label="Cari dokter ..."
                                class="pa-1"
                                v-model="xdoctor"
                                :items="xdoctors"
                                :search-input.sync="search_doctor"
                                auto-select-first
                                outline
                                no-filter
                                item-text="name"
                                return-object
                                :loading="is_loading"
                                no-data-text="Pilih Dokter"
                                hide-details
                                >
                                <template
                                    slot="item"
                                    slot-scope="{ item }"
                                    >
                                    <v-list-tile-content>
                                        <v-list-tile-title v-text="item.name"></v-list-tile-title>
                                    </v-list-tile-content>
                                </template>
                            </v-autocomplete>
                        </v-flex>
                        <v-flex class="text-xs-right" xs2>
                            <v-btn   :disabled="_.isEmpty(xdoctor)" @click="adddoctor()"  style="background:#a5f9e1;min-width:25px" small><v-icon small>add</v-icon></v-btn>
                        </v-flex>
                    </v-layout>
                    <v-layout v-if="xseldoctors.length > 0" v-for="seldoc in xseldoctors" pa-1 row>
                        <v-flex xs12>
                            <v-card color="#a5f9e1">
                                <v-card-text>
                                    <v-layout row>
                                        <v-flex xs10>
                                            <p class="mb-0">{{seldoc.name}}</p>
                                        </v-flex>
                                        <v-flex class="text-xs-right" xs2>
                                            <p class="mb-0"><v-icon small>close</v-icon></p>
                                        </v-flex>
                                    </v-layout>
                                </v-card-text>
                            </v-card>
                        </v-flex>
                    </v-layout>
                    <v-layout v-if="xseldoctors.length === 0" pa-1 row>
                        <v-flex xs12>
                            <v-card color="#a5f9e1">
                                <v-card-text>
                                    <v-layout row>
                                        <v-flex class="text-xs-center" xs12>
                                            <p class="warning-text mb-0">Belum ada dokter yang dipilih</p>
                                        </v-flex>
                                    </v-layout>
                                </v-card-text>
                            </v-card>
                        </v-flex>
                    </v-layout>
                </v-flex>
            </v-layout>
            
            <v-divider></v-divider>
            
            <v-layout pa-1 row>
               
                <v-flex xs6 pa-1>
                     
                    <v-select
                        outline
                        style="font-size:12px"
                        class="pa-1 mini-select"
                        item-text="name"
                        return-object
                        :items="xselmous" 
                        v-model="default_mou"
                        label="Default Agreement"
                        hide-details
                    ></v-select>
                    <p  v-if="_.isEmpty(default_mou)" class="error caption mt-1 mb-0 pl-2 pr-2" style="color:#fff">Harus dipilih salah satu</p>
                </v-flex>
                <v-flex xs6 pa-1>
                    <v-layout row>
                        <v-flex xs12>
                            <v-select
                                outline
                                style="font-size:12px"
                                class="pa-1 mini-select"
                                item-text="name"
                                return-object
                                :items="xseldoctors" 
                                v-model="default_doctor"
                                label="Default Dokter"
                                hide-details
                            ></v-select>
                            <p  v-if="_.isEmpty(default_doctor)" class="error caption mt-1 mb-0 pl-2 pr-2" style="color:#fff">Harus dipilih salah satu</p>
                        </v-flex>
                    </v-layout>
                    <v-layout row>
                        <v-flex xs12>
                            <v-select
                                outline
                                style="font-size:12px"
                                class="pa-1 mini-select"
                                item-text="description"
                                return-object
                                :items="doctor_address" 
                                v-model="default_doctor_address"
                                label="Default Alamat Dokter"
                                hide-details
                            ></v-select>
                            <p  v-if="_.isEmpty(default_doctor_address)" class="error caption mt-1 mb-0 pl-2 pr-2" style="color:#fff">Harus dipilih salah satu</p>
                        </v-flex>
                    </v-layout>
                    
                </v-flex>
            </v-layout>
            <v-divider></v-divider>
            <v-layout row>
                <V-flex xs12>
                    <v-card>
                    <h4 class="pl-4 pt-2 text--lighten-1">Paket Pemeriksaan Default</h4>
                    <v-card-text>
                            <v-layout class="pl-0 pt-1 pb-1 pr-0" wrap>
                                <v-flex xs12>
                                    <v-btn dark v-if="selected_packets && selected_packets.length > 0" v-for="packet in selected_packets" style="margin:3px" depressed small color="cyan">{{packet.name}}</v-btn>
                                    <v-btn dark v-if="selected_tests && selected_tests.length > 0" v-for="test in selected_tests" style="margin:3px" depressed small color="red">{{test.name}}</v-btn>
                                    <v-btn v-if="selected_packets && selected_packets.length == 0 && selected_tests && selected_tests.length == 0" depressed small disabled>Belum ada paket pemeriksaan yang dipilih</v-btn>
                                </v-flex>
                            </v-layout>
                        </v-card-text>
                    </v-card>
                </V-flex>
            </v-layout>
            <v-divider></v-divider>
            <v-layout row>
                <v-flex pa-2 xs6>
                    <v-card class="mb-2" color="cyan">
                        <v-layout row>
                            <v-flex xs12 pt-2 pb-1 pl-2 pr-2>
                                <v-card>
                                    <v-layout align-center row>
                                        <h4 class="subheader pl-3 pt-2 pb-2">DAFTAR PAKET</h4>
                                    </v-layout>
                                    <v-divider></v-divider>
                                    <v-layout align-center row>
                                        <v-flex pt-1 pl-2 pr-2  pb-1 xs12>
                                            <v-text-field
                                                color="cyan"
                                                label="Cari"
                                                placeholder="Cari paket"
                                                v-model="search_packet"
                                                @keyup.enter="searchPacket()"
                                                outline
                                                single-line
                                                hide-details
                                            ></v-text-field>
                                        </v-flex>
                                    </v-layout>
                                </v-card>
                            </v-flex>
                        </v-layout>
                        <v-layout row>
                            <v-flex xs12  pt-1 pb-1 pl-2 pr-2>
                                <v-data-table
                                    :items="packets"
                                    class="v-table elevation-1"
                                    hide-actions
                                    hide-headers
                                >
                                    <template v-slot:items="props">
                                    <td style="height:42px"><p v-if="checkNatTest(props.item)" class="mb-0">{{ props.item.name }}</p>
                                        <p v-if="!checkNatTest(props.item)" style="text-decoration: line-through;" class="mb-0">{{ props.item.name }}</p></td>
                                    <td class="text-xs-right" style="height:42px">
                                        <v-btn dark  v-if="packetExist(props.item) && checkNatTest(props.item)" @click="addToPackets(props.item)"  style="min-width:25px;height:30px" small color="cyan">
                                            <v-icon 
                                                style="cursor:pointer;font-size:18px">
                                                add_box
                                            </v-icon>
                                        </v-btn>
                                        <v-icon color="cyan" v-if="!packetExist(props.item)" @click="removeFromPackets(props.item)" style="cursor:pointer;font-size:30px">done</v-icon>
                                    </td>
                                    
                                    </template>
                                </v-data-table> 
                            </v-flex>
                        </v-layout>
                        <v-layout row>
                            <v-flex xs12 pt-1 pb-1 pl-2 pr-2>
                                <v-card>
                                    <v-layout row>
                                        <v-pagination 
                                            color="cyan"
                                            style="margin-top:10px;margin-bottom:10px" 
                                            v-model="current_page_packet" 
                                            :length="total_patient_packet"></v-pagination>
                                    </v-layout>
                                </v-card>
                            </v-flex>
                        </v-layout>
                    </v-card>
                </v-flex>
                 <v-flex pa-2 xs6>
                    <v-card class="mb-2" color="red">
                        <v-layout row>
                            <v-flex xs12 pt-2 pb-1 pl-2 pr-2>
                                <v-card>
                                    <v-layout align-center row>
                                        <h4 class="subheader pl-3 pt-2 pb-2">DAFTAR PEMERIKSAAN</h4>
                                    </v-layout>
                                    <v-divider></v-divider>
                                    <v-layout align-center row>
                                        <v-flex pt-1 pl-2 pr-2  pb-1 xs12>
                                            <v-text-field
                                                color="red"
                                                label="Cari"
                                                placeholder="Cari pemeriksaan"
                                                v-model="search_test"
                                                @keyup.enter="searchTest()"
                                                outline
                                                single-line
                                                hide-details
                                            ></v-text-field>
                                        </v-flex>
                                    </v-layout>
                                </v-card>
                            </v-flex>
                        </v-layout>
                        <v-layout row>
                            <v-flex xs12  pt-1 pb-1 pl-2 pr-2>
                                <v-data-table
                                    :items="tests"
                                    class="v-table elevation-1"
                                    hide-actions
                                    hide-headers
                                >
                                    <template v-slot:items="props">
                                    <td width="90%" style="height:42px">
                                        <p v-if="checkNatTest(props.item)" class="mb-0">{{ props.item.name }}</p>
                                        <p v-if="!checkNatTest(props.item)" style="text-decoration: line-through;" class="mb-0">{{ props.item.name }}</p>
                                    </td>
                                    <td width="10%" class="text-xs-right" style="height:42px">
                                        <v-btn dark  v-if="testExist(props.item) && checkNatTest(props.item)" @click="addToTests(props.item)" style="min-width:25px;height:30px" small color="red">
                                            <v-icon 
                                                style="cursor:pointer;font-size:18px">
                                                add_box
                                            </v-icon>
                                        </v-btn>
                                    
                                        <v-icon color="red" v-if="!testExist(props.item)" @click="removeFromTests(props.item)" style="cursor:pointer;font-size:30px">done</v-icon>
                                    </td>
                                    
                                    </template>
                                </v-data-table> 
                            </v-flex>
                        </v-layout>
                        <v-layout row>
                            <v-flex xs12 pt-1 pb-1 pl-2 pr-2>
                                <v-card>
                                    <v-layout row>
                                        <v-pagination 
                                            color="red"
                                            style="margin-top:10px;margin-bottom:10px" 
                                            v-model="current_page_test" 
                                            :length="total_patient_test"></v-pagination>
                                    </v-layout>
                                </v-card>
                            </v-flex>
                        </v-layout>
                    </v-card>
                 </v-flex>
            </v-layout>
            <v-divider></v-divider>
            <v-layout pa-1 row>
                <v-flex xs12 pa-1>
                    <h5>Pengiriman hasil default :</h5>
                </v-flex>
            </v-layout>
            <v-layout mt-1 mb-2 row wrap >
                <v-flex class="row" ma-1 xs11 v-for="(delivery,idx) in deliveries">
                    <v-layout  align-center row>
                        <v-flex  xs1>
                            <v-btn v-if="delivery.chex  === 'N'" @click="changeBoxRight(delivery,idx)" dark style="min-width:20px" small color="grey darken-1"><v-icon small>close</v-icon></v-btn>
                            <v-btn v-if="delivery.chex  === 'Y'" @click="changeBoxRight(delivery,idx)" depressed style="min-width:20px" small color="teal lighten-4"><v-icon color="teal" small>check</v-icon></v-btn>
                        </v-flex>
                        <v-flex mb-1 pl-2 xs11>
                            <p :class="getColorFont(delivery)" 
                            class="mb-0 font-weight-black"
                            style="font-size:11px">
                            {{delivery.delivery_name.toUpperCase()}}
                            </p>
                            <div  v-if="delivery.description !== ''" 
                            class="body-2 mb-1 mono caption" 
                            v-html="reHTMLAddress(delivery.description)">
                            </div>
                            <v-textarea
                            v-if="delivery.chex === 'Y'"
                            v-model="delivery.note"
                            rows="1"
                            auto-grow
                            single-line
                            style="color:#800000;font-weight:500"
                            placeholder="Catatan"
                            hide-details
                            class="body-2 mb-1 mt-0 pt-0"
                            ></v-textarea>
                        </v-flex>
                    </v-layout>
                </v-flex >
            </v-layout>
            <v-divider></v-divider>
            <v-layout pa-1 row>
                <v-flex xs12 pa-1>
                    <h5>Tentukan janji hasil :</h5>
                </v-flex>
            </v-layout>
            <v-layout pa-1 row>
                <v-flex xs6 pa-1>
                    <v-date-picker color="info ligthen-2" v-model="picker_date" full-width landscape></v-date-picker>
                </v-flex>
                <v-flex text-xs-right xs6 pa-1>
                    <v-time-picker color="info ligthen-2" v-model="picker_time" full-width landscape></v-time-picker>
                </v-flex>
            </v-layout>
            <v-layout v-if="!_.isEmpty(xordercompany) && xseldoctors.length > 0 && xselmous.length > 0 && !_.isEmpty(default_mou) && !_.isEmpty(default_doctor) && !_.isEmpty(default_doctor_address)" pa-2 row>
                <v-flex xs12><v-btn @click="savesetup" class="deep-orange accent-1 white--text" block>SIMPAN</v-btn></v-flex>
            </v-layout>
        </v-card>
        
        <one-dialog-print title="" width="850" height="650" :status="openprint" :urlprint="urlprint" @close-dialog-print="openprint = false"></one-dialog-print>
        </v-layout>
</template>

<style scoped>
    table,
    td,
    th {
        border: 1px solid #ddd;
        text-align: left;
    }

    table {
        border-collapse: collapse;
        width: 100%;
    }

    th,
    td {
        padding-top: 5px;
        padding-bottom: 5px;
        padding-left: 8px;
        padding-right: 5px;
    }

    .mini-input .v-input {
        margin-top: 0px;
    }

    .mini-input .v-input,
    .mini-input .v-input--selection-controls,
    .mini-input .v-input__slot {
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: 3px;
    }

    .mini-input .v-messages {
        min-height: 0px;
    }

    input.fhm-input {
        border: 1px solid black;
        border-radius: 2px;
        -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1),
        0 0 4px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1),
        0 0 4px rgba(0, 0, 0, 0.1);
        box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1),
        0 0 4px rgba(0, 0, 0, 0.1);
        padding: 2px 4px;
        background: rgba(255, 255, 255, 0.5);
        margin: 0 0 1px 0;
        width: 30px;
        text-align: center;
    }

    .v-date-picker-table{
        height:auto!important;
    }
</style>

<script>
    module.exports = {
        components : {
        
        'one-dialog-print':httpVueLoader('../../common/oneDialogPrintX.vue')
    },
        data: () => ({
            menufilterdatestart:false,
            menufilterdateend:false,
            date: new Date().toISOString().substr(0, 10),
            search_company:'',
            search_doctor:'',
            is_loading:false,
            requiredcompany:false,
            requiredmou:false,
            requireddoctor:false,
            openprint:false,
            urlprint:''
        }),
        computed: {
            current_page_test: {
                get() {
                    return this.$store.state.patient.current_page_test
                },
                set(val) {
                    this.$store.commit("patient/update_current_page_test", val)
                    var prm = this.default_mou
                    prm.search = this.search_test
                    prm.current_page = val
                    this.$store.dispatch("patient/getdatatests", prm)
                }
            },
            current_page_packet: {
                get() {
                    return this.$store.state.patient.current_page_packet
                },
                set(val) {
                    this.$store.commit("patient/update_current_page_packet", val)
                    var prm = this.default_mou
                    prm.search = this.search_packet
                    prm.current_page = val
                    this.$store.dispatch("patient/getdatapackets", prm)
                }
            },
            packets() {
                return this.$store.state.patient.packets
            },
            tests() {
                return this.$store.state.patient.tests
            },
            is_progress(){
                return this.$store.state.patient.is_progress
            },
            total_patient_packet() {
                return this.$store.state.patient.total_patient_packet
            },
            total_patient_test() {
                return this.$store.state.patient.total_patient_test
            },
            search_test: {
                get() {
                    return this.$store.state.patient.search_test
                },
                set(val) {
                    this.$store.commit("patient/update_search_test", val)
                    this.$store.commit("patient/update_no_save", 1)
                }
            },
            search_packet: {
                get() {
                    return this.$store.state.patient.search_packet
                },
                set(val) {
                    this.$store.commit("patient/update_search_packet", val)
                    this.$store.commit("patient/update_no_save", 1)
                }
            },
            selected_packets: {
                get() {
                    return this.$store.state.patient.selected_packets
                },
                set(val) {
                    this.$store.commit("patient/update_selected_packets", val)
                }
            },
            selected_tests: {
                get() {
                    return this.$store.state.patient.selected_tests
                },
                set(val) {
                    this.$store.commit("patient/update_selected_tests", val)
                }
            },
            status(){
            return this.$store.state.patient.status
            },
            deliveries:{
                get() {
                    return this.$store.state.patient.deliveries
                },
                set(val) {
                    this.$store.commit("patient/update_deliveries",val)
                }
            },
            default_mou:{
                get() {
                    return this.$store.state.patient.default_mou
                },
                set(val) {
                    this.$store.commit("patient/update_default_mou",val)
                    
                    this.$store.commit("patient/update_packets", [])
                    this.$store.commit("patient/update_tests", [])
                    this.$store.commit("patient/update_selected_packets", [])
                    this.$store.commit("patient/update_selected_tests", [])
                    this.$store.commit("patient/update_current_page_test", 1)
                    this.$store.commit("patient/update_current_page_packet", 1)
                    this.$store.commit("patient/update_total_patient_packet", 0)
                    this.$store.commit("patient/update_total_patient_test", 0)
                    var prm = val
                    prm.current_page = 1
                    prm.search = ''
                    this.$store.dispatch("patient/getdatapackets", prm)
                    this.$store.dispatch("patient/getdatatests", prm)

                    this.$store.dispatch("patient/getdeliveries",val)
                }
            },
            default_doctor:{
                get() {
                    return this.$store.state.patient.default_doctor
                },
                set(val) {
                    this.$store.commit("patient/update_default_doctor",val)
                    this.$store.commit("patient/update_doctor_address",val.xaddress)
                    this.$store.commit("patient/update_default_doctor_address",{})
                }
            },
            default_doctor_address:{
                get() {
                    return this.$store.state.patient.default_doctor_address
                },
                set(val) {
                    this.$store.commit("patient/update_default_doctor_address",val)
                }
            },
            picker_date:{
                get() {
                    return this.$store.state.patient.promise_date
                },
                set(val) {
                    this.$store.commit("patient/update_promise_date",val)
                }
            },
            picker_time:{
                get() {
                    return this.$store.state.patient.promise_time
                },
                set(val) {
                    this.$store.commit("patient/update_promise_time",val)
                }
            },
            doctor_address(){
                return this.$store.state.patient.doctor_address
            },
            xseldoctors(){
                return this.$store.state.patient.selected_doctors
            },
            xselmous(){
                return this.$store.state.patient.selected_mous
            },
            xordercompanies(){
                return this.$store.state.patient.companies
            },
            xordercompany:{
                get() {
                    return this.$store.state.patient.company
                },
                set(val) {
                    this.$store.commit("patient/update_company",val)
                    this.$store.dispatch("patient/getmou",this.$store.state.patient.company)
                }
            },
            xdoctors(){
                return this.$store.state.patient.doctors
            },
            xdoctor:{
                get() {
                    return this.$store.state.patient.doctor
                },
                set(val) {
                    this.$store.commit("patient/update_doctor",val)
                }
            },
            filterComputedDateFormattedStart () {
                return this.formatDate(this.xdatestart)
            },
            filterComputedDateFormattedEnd () {
                return this.formatDate(this.xdateend)
            },
            dialogconfirmationdelete: {
                get() {
                    return this.$store.state.patient.dialog_confirmation_delete
                },
                set(val) {
                    this.$store.commit("patient/update_dialog_confirmation_delete", val)
                }
            },
            msgconfirmationdelete() {
                return this.$store.state.patient.msg_confirmation_delete
            },
            xact() {
                return this.$store.state.patient.act
            },
            detail() {
                return this.$store.state.patient.selected_patient
            },
            xdatestart : {
                get() {
                    return this.$store.state.patient.start_date
                },
                set(val) {
                    this.$store.commit("patient/update_start_date",val)
                    //this.searchTransaction()
                }
            },
            xdateend : {
                get() {
                    return this.$store.state.patient.end_date
                },
                set(val) {
                    this.$store.commit("patient/update_end_date",val)
                    //this.searchTransaction()
                }
            },
            xmous() {
                return this.$store.state.patient.mous
            },
            xmou: {
                get() {
                    return this.$store.state.patient.mou
                },
                set(val) {
                    this.$store.commit("patient/update_mou", val)
                    this.$store.commit("patient/update_no_save", 1)
                }
            }
            
        },
        methods: {
        checkNatTest(item){
            var now_natest = item.nat_test
            var rtn = true
            var selected_packets = this.$store.state.patient.selected_packets
            var selected_tests = this.$store.state.patient.selected_tests
            selected_packets.forEach(function(entry) {
                var nat_test = entry.nat_test
                now_natest.forEach(function(itemnattest) {
                    var idx = _.findIndex(nat_test, function(o) { return o == itemnattest})
                    if(idx > -1)
                        rtn = false
                })
            })
            selected_tests.forEach(function(entry) {
                var nat_test = entry.nat_test
                now_natest.forEach(function(itemnattest) {
                    var idx = _.findIndex(nat_test, function(o) { return o == itemnattest})
                    if(idx > -1)
                        rtn = false
                })
            })
            return rtn
        },
        testExist(item){
            var selected_tests = this.$store.state.patient.selected_tests
            var idx = _.findIndex(selected_tests, function(o) { return parseInt(o.id) === parseInt(item.id)})
            if(idx === -1){
                return true
            }
            else{
                return false
            }
        },
        addToTests(item){
            var selected_tests = this.$store.state.patient.selected_tests
            selected_tests.push(item)
        },
        removeFromTests(item){
            var selected_tests = this.$store.state.patient.selected_tests
            var idx = _.findIndex(selected_tests, function(o) { return parseInt(o.id) === parseInt(item.id)})
            selected_tests.splice(idx, 1)
        },
        searchTest(){
            var prm = this.default_mou
            prm.search = this.search_test
            prm.current_page = 1
            this.$store.commit("patient/update_current_page_test", 1)
            this.$store.dispatch("patient/getdatatests", prm)
        },
        packetExist(item){
            var selected_packets = this.$store.state.patient.selected_packets
            var idx = _.findIndex(selected_packets, function(o) { return parseInt(o.id) === parseInt(item.id)})
            if(idx === -1){
                return true
            }
            else{
                return false
            }
        },
        addToPackets(item){
            var selected_packets = this.$store.state.patient.selected_packets
            selected_packets.push(item)
        },
        removeFromPackets(item){
            var selected_packets = this.$store.state.patient.selected_packets
            var idx = _.findIndex(selected_packets, function(o) { return parseInt(o.id) === parseInt(item.id)})
            selected_packets.splice(idx, 1)
        },
        searchPacket(){
            var prm = this.default_mou
            prm.search = this.search_packet
            prm.current_page = 1
            this.$store.commit("patient/update_current_page_packet", 1)
            this.$store.dispatch("patient/getdatapackets", prm)
        },
            thr_search_company: _.debounce( function () {
                console.log(this.search_company)
                this.$store.dispatch("patient/searchcompany",{search:this.search_company})
            },2000),
            openPrint(item){
                this.urlprint = "/birt/run?__report=report/one/rekap/rpt_r_073.rptdesign&__format=pdf&PMouID="+item.id+"&username=admin"
                this.openprint = true
            },
            changeBoxRight(value,idx){
                    var deliveries = this.$store.state.patient.deliveries
                    console.log(deliveries)
                    deliveries[idx].chex = value.chex === 'N'?'Y':'N'
                    console.log(deliveries[idx].chex)
                    this.$store.commit("patient/update_deliveries",deliveries)
                    },
                    reHTMLAddress(entry){
                var rtn = ''
                if(entry){
                    var perpart = entry.split("^")
                rtn += "<p class='mb-0' style='font-size:12px'>"+perpart[0]+"</p>"
                if(perpart[1])
                    rtn += "<p class='mb-0' style='font-size:12px'>"+perpart[1]+"</p>"
                }
                

                
                return rtn
            },
            getColorFont(value,type){
            
            
                var xcolor = 'black--text'
                if(value.chex === 'Y'){
                xcolor = 'teal--text'
                }
                
                
                return xcolor
            },
            downloadxapp(){
                var start = Date.now()
                location.replace("/install-mcu.zip?tm="+start)
            },
            delmou(row){
                var arr = this.$store.state.patient.selected_mous
                idx = _.findIndex(arr,row)
                arr.splice(idx, 1)
                this.$store.commit("patient/update_default_mou",{})
                
                var arr_mous = this.$store.state.patient.mous
                arr_mous.push(row)
                this.$store.commit("patient/update_mous",arr_mous)
            },
            deldoctor(row){
                var arr = this.$store.state.patient.selected_doctors
                idx = _.findIndex(arr,row)
                arr.splice(idx, 1)

                var newx = this.$store.state.patient.selected_doctors
                if(newx.length === 0){
                     this.$store.commit("patient/update_default_doctor",{})
                }
            },
            savesetup(){
                var go_save = true
                if(go_save){
                    var prm = {
                                xid:this.$store.state.patient.xid,
                                act:this.$store.state.patient.act,
                                startdate:this.$store.state.patient.start_date,
                                enddate:this.$store.state.patient.end_date,
                                company : this.$store.state.patient.company,
                                mous:this.$store.state.patient.selected_mous,
                                doctors:this.$store.state.patient.selected_doctors,
                                promise_date:this.$store.state.patient.promise_date,
                                promise_time:this.$store.state.patient.promise_time,
                                default_mou:this.$store.state.patient.default_mou,
                                default_doctor:this.$store.state.patient.default_doctor,
                                default_doctor_address:this.$store.state.patient.default_doctor_address,
                                deliveries:this.$store.state.patient.deliveries,
                                selected_packets:this.$store.state.patient.selected_packets,
                                selected_tests:this.$store.state.patient.selected_tests,
                            }
                    this.$store.dispatch("patient/savesetup",prm)
                }
            },
            adddoctor(){
                var selected = this.$store.state.patient.doctor
                var arr = this.$store.state.patient.doctors
                var xsel = this.$store.state.patient.selected_doctors
                xsel.push(selected)
                this.$store.commit("patient/update_selected_doctors", xsel)
                this.$store.commit("patient/update_doctors", [])
                this.$store.commit("patient/update_doctor", {})
            },
            addmou(){
                var selected = this.$store.state.patient.mou
                var arr = this.$store.state.patient.mous
                var xsel = this.$store.state.patient.selected_mous
                xsel.push(selected)
                this.$store.commit("patient/update_selected_mous", xsel)
                var filtered = arr.filter(o1 => xsel.filter(o2 => o2.id === o1.id).length === 0)
                this.$store.commit("patient/update_mous", filtered)
                this.$store.commit("patient/update_mou", {})
            },
            thr_search_doctor: _.debounce( function () {
                //console.log('thr doctor')
                this.$store.dispatch("patient/searchdoctor",this.search_doctor)
            },2000),
            thr_search_company: _.debounce( function () {
                console.log(this.search_company)
                this.$store.dispatch("patient/searchcompany",{search:this.search_company})
            },2000),
            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')}`
            },
            checkError(value) {
                var errors = this.$store.state.patient.errors
                if (errors.includes(value)) {
                    return true
                } else {
                    return false
                }
            },
            saveData() {
                this.$store.commit("patient/update_errors", [])
                var errors = this.$store.state.patient.errors
                var aDOB = moment(this.xdob, 'DD-MM-YYYY', true)
                console.log(this.xdob)
                console.log(aDOB)
                var isValidDOB = aDOB.isValid()
                if (!isValidDOB) {
                    errors.push("wrongformatdob")
                }
                if (this.xpatientname === '') {
                    errors.push("requirename")
                }
                if (this.xdob === '') {
                    errors.push("requiredob")
                }
                if (_.isEmpty(this.xsex)) {
                    errors.push("requiresex")
                }
                if (_.isEmpty(this.xtitle)) {
                    errors.push("requiretitle")
                }
                if (errors.length === 0) {
                    var prm = {}
                    prm.M_PatientID = this.$store.state.patient.selected_patient.M_PatientID
                    prm.M_PatientM_TitleID = this.$store.state.patient.selected_title.M_TitleID
                    prm.M_PatientPrefix = this.xpatientprefix
                    prm.M_PatientName = this.xpatientname
                    prm.M_PatientSuffix = this.xpatientsuffix
                    prm.M_PatientDOB = this.xdob
                    prm.M_PatientM_SexID = this.$store.state.patient.selected_sex.M_SexID
                    prm.M_PatientM_ReligionID = this.$store.state.patient.selected_religion.M_ReligionID
                    prm.M_PatientEmail = this.xemail
                    prm.M_PatientPOB = this.xpob
                    prm.M_PatientHP = this.xhp
                    prm.M_PatientPhone = this.xphone
                    prm.M_PatientM_IdTypeID = this.$store.state.patient.selected_kartuidentitas.M_IdTypeID
                    prm.M_PatientIDNumber = this.xnoidentitas
                    prm.M_PatientNote = this.xnote
                    prm.M_PatientNIK = this.xnik
                    prm.M_PatientJabatan = this.xjabatan
                    prm.M_PatientKedudukan = this.xkedudukan
                    prm.M_PatientPJ = this.xpj
                    prm.M_PatientLocation = this.xlocation
                    prm.M_PatientJob = this.xjob
                    this.$store.dispatch("patient/save", prm)
                }
            },
            saveNewPatient() {
                this.$store.commit("patient/update_errors", [])
                var errors = this.$store.state.patient.errors
                var aDOB = moment(this.xdob, 'DD-MM-YYYY', true)
                console.log(this.xdob)
                console.log(aDOB)
                var isValidDOB = aDOB.isValid()
                if (!isValidDOB) {
                    errors.push("wrongformatdob")
                }
                if (this.xpatientname === '') {
                    errors.push("requirename")
                }
                if (this.xdob === '') {
                    errors.push("requiredob")
                }
                if (_.isEmpty(this.xsex)) {
                    errors.push("requiresex")
                }
                if (_.isEmpty(this.xtitle)) {
                    errors.push("requiretitle")
                }
                if (errors.length === 0) {
                    var prm = {}
                    prm.M_PatientID = 0
                    prm.M_PatientM_TitleID = this.$store.state.patient.selected_title.M_TitleID
                    prm.M_PatientPrefix = this.xpatientprefix
                    prm.M_PatientName = this.xpatientname
                    prm.M_PatientSuffix = this.xpatientsuffix
                    prm.M_PatientDOB = this.xdob
                    prm.M_PatientM_SexID = this.$store.state.patient.selected_sex.M_SexID
                    prm.M_PatientM_ReligionID = this.$store.state.patient.selected_religion.M_ReligionID
                    prm.M_PatientEmail = this.xemail
                    prm.M_PatientPOB = this.xpob
                    prm.M_PatientHP = this.xhp
                    prm.M_PatientPhone = this.xphone
                    prm.M_PatientM_IdTypeID = this.$store.state.patient.selected_kartuidentitas.M_IdTypeID
                    prm.M_PatientIDNumber = this.xnoidentitas
                    prm.M_PatientNote = this.xnote
                    prm.M_PatientNIK = this.xnik
                    prm.M_PatientJabatan = this.xjabatan
                    prm.M_PatientKedudukan = this.xkedudukan
                    prm.M_PatientPJ = this.xpj
                    prm.M_PatientLocation = this.xlocation
                    prm.M_PatientJob = this.xjob
                    this.$store.dispatch("patient/newpatient", prm)
                }
            },
            deleteData() {
                let msg = "Yakin, akan menghapus data pasien " + this.xpatientname + " ?"
                this.$store.commit("patient/update_msg_confirmation_delete", msg)
                this.$store.commit("patient/update_dialog_confirmation_delete", true)
            },
            doDeleteData() {
                var prm = {}
                prm.id   = this.$store.state.patient.selected_patient.McuOfflinePrepareID
                prm.code = this.$store.state.patient.selected_patient.McuOfflinePrepareCode
                console.log(prm)
                this.$store.dispatch("patient/delete", prm)
            }
        },
         watch: {
        search_doctor(val,old) {
            console.log(val)
            if (val == old ) return
            if (! val) return
            if (val.length < 1 ) return
            if (this.$store.state.patient.update_autocomplete_status == 1 ) return  
            this.thr_search_doctor()
        },
        search_company(val,old) {
             //console.log(val)
            if (val == old ) return
            if (! val) return
            if (val.length < 1 ) return
            if (this.$store.state.patient.update_autocomplete_status == 1 ) return  
            this.thr_search_company()
        }
    }
    }
</script>