<template>
    <v-layout>
        <v-flex xs12>
            <v-card class="mb-2" color="white">
                <v-toolbar color="blue lighten-3" dark height="50px">
                    <v-toolbar-title>QC DISPLAY</v-toolbar-title>
                    <v-spacer></v-spacer>
                </v-toolbar>
                <v-snackbar v-model="snackbar" :timeout="5000" :multi-line="false" :vertical="false" :top="true">
                    {{ msgsnackbar }}
                    <v-btn flat @click="updateAlert_success(false)">
                        Tutup
                    </v-btn>
                </v-snackbar>
                <v-layout class="mt-2" row>
                    <v-flex xs2 pr-2>
                        <v-menu v-model="menufilterdatestart" :close-on-content-click="false" :nudge-right="40" lazy
                            transition="scale-transition" offset-y full-width max-width="290px" min-width="290px">
                            <template v-slot:activator="{ on }">
                                <v-text-field class="mt-1" v-model="filterComputedDateFormattedStart" label="Tanggal Awal"
                                    outline hide-details readonly v-on="on"
                                    @blur="date = deFormatedDate(filterComputedDateFormattedStart)"></v-text-field>
                            </template>
                            <v-date-picker v-model="xstartdate" no-title
                                @input="menufilterdatestart = false"></v-date-picker>
                        </v-menu>
                    </v-flex>
                    <v-flex xs2 pr-2>
                        <v-menu v-model="menufilterdateend" :close-on-content-click="false" :nudge-right="40" lazy
                            transition="scale-transition" offset-y full-width max-width="290px" min-width="290px">
                            <template v-slot:activator="{ on }">
                                <v-text-field class="mt-1" v-model="filterComputedDateFormattedEnd" label="Tanggal Akhir"
                                    outline readonly hide-details v-on="on"
                                    @blur="date = deFormatedDate(filterComputedDateFormattedEnd)"></v-text-field>
                            </template>
                            <v-date-picker v-model="xenddate" no-title @input="menufilterdateend = false"></v-date-picker>
                        </v-menu>
                    </v-flex>
                    <v-flex xs3>
                        <v-select class="xs4 mini-select ma-1" :items="xorderautoinstruments" style="font-size:14px" item-text="Nat_InstrumentName" return-object v-model="xorderautoinstrument"
                    label="Instrument" outline hide-details></v-select>
                    </v-flex>

                    <v-flex xs3>
                        <v-autocomplete label="Pemeriksaan" v-model="xorderautotest" class="ma-1" :items="xorderautotests"
                            :search-input.sync="search_test" auto-select-first hide-details style="font-size:14px" outline
                            no-filter item-text="Nat_TestName" clearable no-data-text="Cari Pemeriksaan" return-object
                            :loading="isLoading">
                            <template slot="item" slot-scope="{ item }">
                                <v-list-tile-content>
                                    <v-list-tile-title v-text="item.Nat_TestName"></v-list-tile-title>
                                </v-list-tile-content>
                            </template>
                        </v-autocomplete>
                    </v-flex>

                    <v-flex xs3>
                        <v-select class="xs4 mini-select ma-1" :items="xorderautocontrols" style="font-size:14px" item-text="Nat_QcControlName" return-object v-model="xorderautocontrol"
                    label="Control" outline hide-details ></v-select>
                    </v-flex>
                    <v-flex xs2 pr-2>
                        <v-radio-group row hide-details class="mb-2" v-model="flag_control">
                            <v-radio label="Single" value="N"></v-radio>
                            <v-radio label="Multi" :disabled="flag_test == 'Y'" value="Y"></v-radio>
                        </v-radio-group>
                    </v-flex>
                    <v-flex xs2 pr-2>
                        <v-btn @click="prosesQc()" color="success">Proses
                        </v-btn>
                    </v-flex>
                    <v-flex xs2 @click="doPrint()" pr-2>
                        <v-btn color="grey"><span @click="doPrint()"
                                class="icon-medium-fill-base xs1 white--text grey darken-1 icon-print"></span>
                        </v-btn>
                    </v-flex>

                </v-layout>
                <v-toolbar color="blue lighten-3" dark height="50px" v-if="flag_control == 'Y'">
                    <v-toolbar-title>CONTROL</v-toolbar-title>
                    <v-spacer></v-spacer>
                </v-toolbar>
                <v-layout class="mt-2" row>
                    <v-flex xs4 v-for="(vst, idx) in xmulticontrol" :key="vst.Nat_QcControlID" class="pr-2 pb-1">
                        <v-layout row>
                            <v-flex style="text-overflow:ellipsis;overflow:hidden;word-wrap:break-word;" xs11>
                                <v-btn class="ml-4" large @click="deleteDataQc(idx)" color="error">
                                    <v-icon left>close</v-icon>{{ vst.Nat_QcControlName }}</v-btn>
                            </v-flex>
                        </v-layout>
                    </v-flex>

                </v-layout>
                <v-toolbar color="blue lighten-3" dark height="50px">
                    <v-toolbar-title>SIGMA {{ selected_sigma.Nat_SigmaName }} Jumlah Kontrol (N) : {{selected_sigma.Nat_SigmaTotalControl}} , Frekuensi(R) : {{selected_sigma.Nat_SigmaTotalFrequency}}</v-toolbar-title>
                    <v-spacer></v-spacer>
                </v-toolbar>
                <v-layout class="mt-2" row>
                    <v-flex xs1>
                    </v-flex>
                    <v-flex xs11> <span> Pilih Sigma : </span>
                        <label v-for="sigma in xsigma" :key="sigma.Nat_SigmaID" class="pr-2 pb-1">
                            <input type="radio" :value="sigma" v-model="selected_sigma" />
                            <span> {{ sigma.Nat_SigmaName }} </span>
                        </label>
                    </v-flex>

                </v-layout>
                <v-layout class="mt-2" row>
                    <v-flex xs4 v-for="(p, idx) in xrule" :key="p.Nat_QcRuleID" class="pr-2 pb-1">
                        <v-layout row>

                            <v-flex style="text-overflow:ellipsis;overflow:hidden;word-wrap:break-word;" xs11>

                                <div>
                                    <v-btn @click="changeRule(idx, p)" v-if="p.isactive === 'N'" small color="error">
                                        <v-icon left>close</v-icon>{{ p.Nat_QcRuleCode }}</v-btn>
                                    <v-btn @click="changeRule(idx, p)" v-if="p.isactive === 'Y'" small color="success">
                                        <v-icon left>check</v-icon> {{ p.Nat_QcRuleCode }}</v-btn>
                                </div>
                            </v-flex>
                        </v-layout>
                    </v-flex>

                </v-layout>
                <v-layout class="mt-2 blue lighten-3 white--text" row>
                    <v-flex xs6 pl-2 pr-2 pt-2 pb-2>FACTORY
                    </v-flex>
                    <v-flex xs6 pl-2 pr-2 pt-2 pb-2>ACTUAL
                    </v-flex>

                </v-layout>

                <v-divider></v-divider>
                <v-layout row wrap class="scroll-container" style="max-height:600px;overflow: auto;">
                    <v-flex xs12 pl-2 pr-2 pt-2 pb-2>
                        <v-data-table :headers="headers" :items="qcs" :loading="isLoading" hide-actions class="elevation-1">
                            <template slot="items" slot-scope="props">
                                <td class="text-xs-left pa-2" v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
                                    @click="selectMe(props.item)">{{ props.item.resultdate }}
                                </td>
                                <td class="text-xs-left pa-2" v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
                                    @click="selectMe(props.item)">{{ props.item.Nat_TestName }} ({{
                                        props.item.Nat_QcControlName }})
                                </td>
                                <td class="text-xs-left pa-2" v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
                                    @click="selectMe(props.item)">
                                    <div>
                                        <v-btn
                                            v-if="props.item.M_QcResultIsInstrument == 'N' || props.item.M_QcResultID == '0'"
                                            small color="error">
                                            Tidak</v-btn>
                                        <v-btn
                                            v-if="props.item.M_QcResultID != '0' && props.item.M_QcResultIsInstrument == 'Y'"
                                            small color="success">
                                            Ya</v-btn>
                                    </div>
                                </td>
                                <td class="text-xs-left pa-2" v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
                                    @click="selectMe(props.item)">
                                    <p style="color:black" class="mb-0 font-weight-bold caption">{{ props.item.Nat_QcMean }}
                                    </p>
                                </td>
                                <td class="text-xs-left pa-2" v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
                                    @click="selectMe(props.item)">
                                    <p style="color:black" class="mb-0 font-weight-bold caption">{{ props.item.Nat_QcSd }}</p>
                                </td>
                                <td class="text-xs-left pa-2" v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
                                    @click="selectMe(props.item)">
                                    <p style="color:black" class="mb-0 font-weight-bold caption">{{ props.item.Nat_QcTea }}
                                    </p>
                                </td>
                                <td class="text-xs-left pa-2" v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
                                    @click="selectMe(props.item)">
                                    <p style="color:black" class="mb-0 font-weight-bold caption">
                                        {{ props.item.M_QcResultValue }}</p>
                                </td>
                                <td class="text-xs-left pa-2" v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
                                    @click="selectMe(props.item)">
                                    <p style="color:black" class="mb-0 font-weight-bold caption">
                                        {{ props.item.Nat_QcRuleCode }}</p>
                                </td>
                            </template>
                        </v-data-table>
                    </v-flex>
                </v-layout>
                <v-divider></v-divider>
                <v-pagination style="margin-top:10px;margin-bottom:10px" v-model="curr_page"
                    :length="xtotal_page"></v-pagination>

                <template>
                    <v-layout row justify-center>
                        <v-dialog v-model="dialogqc" persistent max-width="750px">
                            <v-card>
                                <v-card-title>
                                    <span class="headline">FORM QC</span>
                                </v-card-title>
                                <v-card-text class="pt-0 pb-0">
                                    <v-form ref="formcontrolqc" v-model="validqc" lazy-validation>
                                        <v-layout wrap>
                                            <v-flex xs12>
                                                <v-layout>
                                                    <v-flex xs7 pa-1>

                                                    </v-flex>
                                                    <v-flex xs5 pa-1>
                                                        <v-btn @click="addTest()" color="blue en-3">Tambah</v-btn>
                                                    </v-flex>
                                                </v-layout>

                                            </v-flex>
                                            <v-flex xs4 v-for="(vst, idx) in xordertests" :key="vst.Nat_TestID"
                                                class="pr-2 pb-1">
                                                <v-layout row>
                                                    <v-flex class="boxoutline"
                                                        style="text-overflow:ellipsis;overflow:hidden;word-wrap:break-word;"
                                                        xs11>
                                                        <v-btn class="ml-4" large @click="deleteDataPx(idx)" color="error">
                                                            <v-icon left>close</v-icon>{{ vst.Nat_TestName }}</v-btn>
                                                    </v-flex>
                                                </v-layout>
                                            </v-flex>
                                            <v-flex>
                                                <p v-for="(xerror, idx) in xerrors" class="error pl-2 pr-2"
                                                    style="color:#fff">{{ xerror.msg }}</p>
                                            </v-flex>
                                        </v-layout>
                                </v-card-text>
                                <v-card-actions>
                                    <v-spacer></v-spacer>
                                    <v-btn color="blue darken-1" flat @click="updateDialogFormQc()">Tutup</v-btn>
                                    <v-btn color="blue darken-1" flat @click="saveFormQc()">Simpan</v-btn>
                                </v-card-actions>
                                </v-form>
                            </v-card>
                        </v-dialog>
                    </v-layout>
                </template>

            </v-card>
        </v-flex>

        <one-dialog-print :title="printtitle" :width="printwidth" :height="500" :status="openprint" :urlprint="urlprint"
            @close-dialog-print="closePrint"></one-dialog-print>
        <template>

            <v-dialog v-model="dialogdeletealertqc" max-width="30%">
                <v-card>
                    <v-card-title class="headline grey lighten-2 pt-2 pb-2" primary-title>
                        Konfirmasi
                    </v-card-title>
                    <v-card-text class="pt-2 pb-2">
                        <v-layout row>
                            <v-flex xs12 d-flex>
                                <v-layout row>
                                    <v-flex pb-1 xs12>
                                        <v-layout row>
                                            <v-flex pt-2 pr-2 xs12>
                                                {{ msgalertqc }}
                                            </v-flex>
                                        </v-layout>
                                    </v-flex>
                                </v-layout>
                            </v-flex>
                        </v-layout>
                    </v-card-text>
                    <v-divider></v-divider>
                    <v-card-actions>
                        <v-spacer></v-spacer>
                        <v-btn color="primary" flat @click="dialogdeletealertqc = false">
                            Tutup
                        </v-btn>
                        <v-btn color="primary" flat @click="closeActiveAlertQc()">
                            Yakin lah
                        </v-btn>
                    </v-card-actions>
                </v-card>
            </v-dialog>

        </template>
        <one-dialog-alert :status="openalertconfirmation" :msg="msgalertconfirmation"
            @forget-dialog-alert="forgetAlertConfirmation()"
            @close-dialog-alert="closeAlertConfirmation()"></one-dialog-alert>
    </v-layout>
</template>

<style scoped>
.searchbox .v-input.v-text-field .v-input__slot {
    min-height: 60px;
}

.searchbox .v-btn {
    min-height: 60px;
}

table.v-table tbody td,
table.v-table tbody th {
    height: 40px;
}

table.v-table thead tr {
    height: 40px;
}

.textinput {
    -webkit-transition: width 0.4s ease-in-out;
    transition: width 0.4s ease-in-out;
    background-color: white;
    background-position: 10px 10px;
    background-repeat: no-repeat;
    padding-left: 40px;
    width: 100%;
    padding: 8px 10px;
    margin-bottom: 5px;
    box-sizing: border-box;
    border: 1px solid #607d8b;

}

.textinput:focus {
    width: 100%;
}

.textinput:focus::-webkit-input-placeholder {
    color: transparent;
}

.textinput:focus::-moz-placeholder {
    color: transparent;
}

.textinput:-moz-placeholder {
    color: transparent;
}

.boxoutline {
    color: red;
    border: 1px solid red;
    justify-content: left;
    height: 45px;
    line-height: 45px;
    padding-left: 10px;
    background: #ffffff;
    font-size: 10px;
    font-weight: 50;
    word-wrap: break-word;
    border-radius: 1px
}

.boxoutline:hover {
    background: rgba(0, 0, 0, 0.07) !important;
    font-size: 15px;
    font-weight: 700;
}

.boxsolid {
    color: #ffffff;
    border: 1px solid #ffffff;
    justify-content: center;
    height: 45px;
    line-height: 45px;
    padding-left: 10px;
    background: #f44336;
    font-size: 14px;
    font-weight: 500;
    border-radius: 1px
}

.boxsolid:hover {
    background: #f44336de;
    font-size: 15px;
    font-weight: 700;
}

.scroll-container {
    scroll-padding: 50px 0 0 50px;
}

::-webkit-scrollbar {
    width: 7px;
}

/* this targets the default scrollbar (compulsory) */

::-webkit-scrollbar-track {
    background-color: #73baf3;
}

/* the new scrollbar will have a flat appearance with the set background color */

::-webkit-scrollbar-thumb {
    background-color: #2196f3;
}

/* this will style the thumb, ignoring the track */

::-webkit-scrollbar-button {
    background-color: #0079da;
}

/* optionally, you can style the top and the bottom buttons (left and right for horizontal bars) */

::-webkit-scrollbar-corner {
    background-color: black;
}

/* if both the vertical and the horizontal bars appear, then perhaps the right bottom corner also needs to be styled */
</style>

<script>
module.exports = {
    components: {
        'one-date-picker': httpVueLoader('../../common/oneDatePicker.vue'),
        'one-dialog-print': httpVueLoader('../../common/oneDialogPrintX.vue'),
        'one-dialog-alert': httpVueLoader('../../common/oneDialogAlert.vue')
    },
    data() {
        return {
            query: "",
            items: [],
            openprint: false,
            urlprint: '',
            printtitle: '',
            printwidth: 600,
            formatreport: 'pdf',
            readonlydefault: false,
            page: 1,
            xname: '',
            xphone: '',
            xcode: '',
            xdescription: '',
            xipdescription: '',
            xbasename: '',
            isdefault: false,
            issatellite: false,
            search_control: '',
            search_city: '',
            search_district: '',
            search_kelurahan: '',
            search_company: '',
            search_mou: '',
            search_doctor: '',
            search_test: '',
            search_instrument: '',
            menufilterdatestart: false,
            menufilterdateend: false,
            date: new Date().toISOString().substr(0, 10),
            xnameRules: [
                v => !!v || 'Nama harus diisi'
            ],
            xcodeRules: [
                v => !!v || 'Kode harus diisi'
            ],
            descriptionRules: [
                v => !!v || 'Alamat harus diisi'
            ],
            xipdescriptionRules: [
                v => !!v || 'Alamat IP harus diisi'
            ],
            controlRules: [
                v => !!v || 'Control harus dipilih'
            ],
            cityRules: [
                v => !!v || 'Kota harus dipilih'
            ],
            districtRules: [
                v => !!v || 'Kecamatan harus dipilih'
            ],
            kelurahanRules: [
                v => !!v || 'Kelurahan harus dipilih'
            ],
            headertitles: [{
                text: "FACTORY",
                align: "left",
                sortable: false,
                value: "lab",
                width: "50%",
                class: "blue lighten-3 white--text"
            },
            {
                text: "ACTUAL",
                align: "left",
                sortable: false,
                value: "lab",
                width: "50%",
                class: "blue lighten-3 white--text"
            }
            ],
            headers: [{
                text: "TANGGAL",
                align: "left",
                sortable: false,
                value: "lab",
                width: "10%",
                class: "blue lighten-3 white--text"
            },
            {
                text: "PEMERIKSAAN",
                align: "left",
                sortable: false,
                value: "lab",
                width: "30%",
                class: "blue lighten-3 white--text"
            },
            {
                text: "INSTRUMENT",
                align: "left",
                sortable: false,
                value: "name",
                width: "10%",
                class: "blue lighten-3 white--text"
            },
            {
                text: "MEAN",
                align: "left",
                sortable: false,
                value: "name",
                width: "10%",
                class: "blue lighten-3 white--text"
            },
            {
                text: "SD",
                align: "left",
                sortable: false,
                value: "name",
                width: "10%",
                class: "blue lighten-3 white--text"
            },
            {
                text: "TEA(%)",
                align: "left",
                sortable: false,
                value: "name",
                width: "10%",
                class: "blue lighten-3 white--text"
            },
            {
                text: "VALUE",
                align: "left",
                sortable: false,
                value: "name",
                width: "10%",
                class: "blue lighten-3 white--text"
            },
            {
                text: "MARKING",
                align: "left",
                sortable: false,
                value: "name",
                width: "10%",
                class: "blue lighten-3 white--text"
            }
            ],
            pagination: {
                descending: false,
                page: 1,
                rowsPerPage: 100,
                sortBy: 'Nat_QcName ASC',
                totalItems: this.$store.state.qc.total_transactions
            },
            statuss: [{
                waktu: '16-07-2019 10:00',
                status: 'Order Dibuat',
                qc: 'Nagita Slavina'
            },
            {
                waktu: '16-07-2019 11:00',
                status: 'Order Dikirim',
                qc: 'Nagita Slavina'
            },
            {
                waktu: '16-07-2019 12:00',
                status: 'Order dikonfirmasi',
                qc: 'Chacha Frederica'
            },
            {
                waktu: '16-07-2019 13:00',
                status: 'Telah dibuat Surat Jalan',
                qc: 'Chacha Frederica'
            },
            {
                waktu: '16-07-2019 14:00',
                status: 'Kurir akan mengambil sampel',
                qc: 'Satria Subiantoro'
            }
            ],
            color: "success",
            validqc: false,
            xid: 0,
            isinput: "N",
            countprice: 0,
            qcid: 0,
            qcxname: "",
            qclang: "",
            qctext: "",
            isadvance: "N",
            qcformatadvance: "",
            issenttocontrol: "N",
            menustartdate: false,
            menuenddate: false,
            date: new Date().toISOString().substr(0, 10),
            msgalertconfirmation: "Perubahan yang telah dilakukan belum disimpan dong !",
            dialogdeletealertqc: false,
            dialogverifyalertqc: false,
            dialogreleasealertqc: false,
            alertverify: false,
            dialogunreleasealertqc: false,
            dialogunverifyalertqc: false,
            msgalertqc: ""
        };
    },
    mounted() {
        /*  this.$store.dispatch("qc/lookupbyname", {
             control: this.xsearch,
             instrument: this.$store.state.instrument.x_search,
             qc: this.$store.state.qc.x_search,
             sdate: this.$store.state.qc.startdate,
             current_page: 1,
             lastid: -1
         })
         */
         this.$store.dispatch("qc/searchinstrument", {
                search: this.search_instrument,
                id: this.xorderautocontrol.Nat_QcControlID
            })
         this.$store.dispatch("qc/lookupsigma", {
            controlid: this.xorderautocontrol.Nat_QcControlID,
            ismulticontrol: this.flag_control,
            multicontrol: this.$store.state.qc.multicontrol,
            instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
            testid: this.xorderautotest.Nat_TestID,
        })
        
    },
    computed: {
        qcs() {
            return this.$store.state.qc.qcs
        },
        qctemp() {
            return this.$store.state.qc.qctemp
        },
        xcontrol() {
            return this.$store.state.control.selected_control
        },
        xinstrument() {
            return this.$store.state.instrument.selected_instrument
        },
        dialogqc() {
            return this.$store.state.qc.dialog_form_qc
        },
        xerrors() {
            return this.$store.state.qc.errors
        },
        xqid() {
            return this.$store.state.qc.qid
        },
        isLoading() {
            return this.$store.state.qc.search_status == 1
        },
        filterComputedDateFormattedStart() {
            return this.formatDate(this.xstartdate)
        },
        filterComputedDateFormattedEnd() {
            return this.formatDate(this.xenddate)
        },
        flag_control: {
            get() {
                return this.$store.state.qc.flag_control
            },
            set(val) {
                this.$store.commit("qc/update_flag_control", val)
                this.$store.commit("qc/update_orderautocontrol", {})
                this.$store.commit("qc/update_multicontrol", [])
                this.$store.commit("qc/update_selected_sigma", {})
                this.$store.commit("qc/update_xsigma", [])
                this.$store.commit("qc/update_xrule", [])
                this.$store.dispatch("qc/lookupbyid", {
                    sdate: this.xstartdate,
                    edate: this.xenddate,
                    controlid: 0,
                    controlname: '',
                    instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
                    instrumentname: this.xorderautoinstrument.Nat_InstrumentName,
                    testid: this.xorderautotest.Nat_TestID,
                    testname: this.xorderautotest.Nat_TestName,
                    ismulticontrol: this.flag_control,
                    ismultitest: this.flag_test,
                    multicontrol: 0,
                    multitest: 0,
                    current_page: 1
                })
                this.$store.dispatch("qc/searchcontrol", {
                search: this.search_control,
                instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
                testid: this.xorderautotest.Nat_TestID,
                controls: this.xmulticontrol
            })
                this.$store.dispatch("qc/lookupsigma", {
            controlid: this.xorderautocontrol.Nat_QcControlID,
            ismulticontrol: this.flag_control,
            multicontrol: this.$store.state.qc.multicontrol,
            instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
            testid: this.xorderautotest.Nat_TestID,
        })
            }
        },
        flag_test: {
            get() {
                return this.$store.state.qc.flag_test
            },
            set(val) {
                this.$store.commit("qc/update_flag_test", val)
            }
        },
        xstartdate: {
            get() {
                return this.$store.state.qc.startdate
            },
            set(val) {
                this.$store.commit("qc/update_startdate", val)
                this.searchQc()
            }
        },
        endComputedDateFormatted() {
            return this.formatDate(this.xenddate)
        },
        xenddate: {
            get() {
                return this.$store.state.qc.enddate
            },
            set(val) {
                this.$store.commit("qc/update_enddate", val)
                this.searchQc()
            }
        },
        xorderautotests() {
            return this.$store.state.qc.orderautotests
        },
        xorderautotest: {
            get() {
                return this.$store.state.qc.orderautotest
            },
            set(val) {
                this.$store.commit("qc/update_orderautotest", val)

                if (val) {
                    this.searchQc()
                    this.$store.dispatch("qc/searchcontrol", {
                search: this.search_control,
                instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
                testid: val.Nat_TestID,
                controls: this.xmulticontrol
            })
                } else {
                    this.searchcontrol = ''
                    this.$store.commit("qc/update_orderautocontrols", [])
                    this.$store.commit("qc/update_orderautocontrol", {})
                    this.$store.commit("qc/update_flag_control", 'N')
                    this.$store.commit("qc/update_multicontrol", [])
                    this.$store.dispatch("qc/lookupbyid", {
                        sdate: this.xstartdate,
                        edate: this.xenddate,
                        controlid: 0,
                        controlname: '',
                        instrumentid: 0,
                        instrumentname: '',
                        testid: 0,
                        testname: '',
                        ismulticontrol: 'N',
                        ismultitest: 'N',
                        multicontrol: 0,
                        multitest: 0,
                        current_page: 1
                    })

                    
                }
            }
        },
        xorderautocontrols() {
            return this.$store.state.qc.orderautocontrols
        },
        xorderautocontrol: {
            get() {
                return this.$store.state.qc.orderautocontrol
            },
            set(val) {
                this.$store.commit("qc/update_orderautocontrol", val)
                

                if (this.flag_control == 'Y') {
                    var oldArr = this.$store.state.qc.multicontrol
                    oldArr.push(this.$store.state.qc.orderautocontrol)
                    this.searchcontrol = ''
                   this.$store.commit("qc/update_orderautocontrols", [])
                    this.$store.commit("qc/update_orderautocontrol", {})
                    var tot = oldArr.length
                    console.log(oldArr.length)
                    this.$store.dispatch("qc/searchcontrol", {
                search: this.search_control,
                instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
                testid: this.xorderautotest.Nat_TestID,
                controls: this.xmulticontrol
            })
            
                    this.$store.dispatch("qc/lookupsigma", {
                        controlid: this.xorderautocontrol.Nat_QcControlID,
                        ismulticontrol: this.flag_control,
                        multicontrol: this.$store.state.qc.multicontrol,
                        instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
                        testid: this.xorderautotest.Nat_TestID,
                    })
                    
                    this.searchQc()
                } else {
                    this.searchQc()
                    this.$store.dispatch("qc/lookupsigma", {
                        controlid: this.xorderautocontrol.Nat_QcControlID,
                        ismulticontrol: this.flag_control,
                        multicontrol: this.$store.state.qc.multicontrol,
                        instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
                        testid: this.xorderautotest.Nat_TestID,
                    })
                   
                }

            }
        },
        xorderautoinstruments() {
            return this.$store.state.qc.orderautoinstruments
        },
        xorderautoinstrument: {
            get() {
                return this.$store.state.qc.orderautoinstrument
            },
            set(val) {

                this.$store.commit("qc/update_orderautoinstrument", val)
                if (val) {
                    this.searchQc()
                } else {
                    this.searchcontrol = ''
                    this.$store.commit("qc/update_orderautocontrols", [])
                    this.$store.commit("qc/update_orderautocontrol", {})
                    this.searchtest = ''
                    this.$store.commit("qc/update_orderautotests", [])
                    this.$store.commit("qc/update_orderautotest", {})
                    this.$store.commit("qc/update_flag_control", 'N')
                    this.$store.commit("qc/update_multicontrol", [])
                    this.$store.dispatch("qc/lookupbyid", {
                        sdate: this.xstartdate,
                        edate: this.xenddate,
                        controlid: 0,
                        controlname: '',
                        instrumentid: 0,
                        instrumentname: '',
                        testid: 0,
                        testname: '',
                        ismulticontrol: 'N',
                        ismultitest: 'N',
                        multicontrol: 0,
                        multitest: 0,
                        current_page: 1
                    })
                }

            }
        },
        xordertests() {
            return this.$store.state.qc.ordertests
        },
        xmulticontrol() {
            return this.$store.state.qc.multicontrol
        },
        xrule() {
            return this.$store.state.qc.xrule
        },
        xsigma() {
            return this.$store.state.qc.xsigma
        },
        selected_sigma: {
            get() {
                return this.$store.state.qc.selected_sigma
            },
            set(val) {
                this.$store.commit("qc/update_selected_sigma", val)
                console.log(val)
                this.$store.dispatch("qc/lookuprule", {
                sigmaid: val.Nat_SigmaID
        })
            }
        },
        xmultitest() {
            return this.$store.state.qc.multitest
        },
        xautocitys() {
            return this.$store.state.qc.autocitys
        },
        xautocity: {
            get() {
                return this.$store.state.qc.autocity
            },
            set(val) {
                this.$store.commit("qc/update_autocity", val)
                this.$store.dispatch("qc/searchdistrict", {
                    search: this.search_district,
                    id: val.M_CityID
                })
            }
        },
        xautodistricts() {
            return this.$store.state.qc.autodistricts
        },
        xautodistrict: {
            get() {
                return this.$store.state.qc.autodistrict
            },
            set(val) {
                this.$store.commit("qc/update_autodistrict", val)
                this.$store.dispatch("qc/searchkelurahan", {
                    search: this.search_kelurahan,
                    id: val.M_DistrictID
                })
            }
        },
        xautokelurahans() {
            return this.$store.state.qc.autokelurahans
        },
        xautokelurahan: {
            get() {
                return this.$store.state.qc.autokelurahan
            },
            set(val) {
                this.$store.commit("qc/update_autokelurahan", val)
            }
        },
        xautocompanys() {
            return this.$store.state.qc.autocompanys
        },
        xautocompany: {
            get() {
                return this.$store.state.qc.autocompany
            },
            set(val) {
                this.$store.commit("qc/update_autocompany", val)
                this.$store.dispatch("qc/searchmou", {
                    search: this.search_mou,
                    id: val.M_CompanyID
                })
            }
        },
        xautomous() {
            return this.$store.state.qc.automous
        },
        xautomou: {
            get() {
                return this.$store.state.qc.automou
            },
            set(val) {
                this.$store.commit("qc/update_automou", val)
            }
        },
        xautodoctors() {
            return this.$store.state.qc.autodoctors
        },
        xautodoctor: {
            get() {
                return this.$store.state.qc.autodoctor
            },
            set(val) {
                this.$store.commit("qc/update_autodoctor", val)
                this.$store.dispatch("qc/selectdescriptiondoctor", {
                    id: val.M_DoctorID
                })
            }
        },
        xdescriptiondoctors() {
            return this.$store.state.qc.descriptiondoctors
        },
        xdescriptiondoctor: {
            get() {
                return this.$store.state.qc.descriptiondoctor
            },
            set(val) {
                this.$store.commit("qc/update_descriptiondoctor", val)
            }
        },
        xstatuss() {
            return this.$store.state.qc.statuss
        },
        dialogstatusorder() {
            return this.$store.state.qc.dialog_status_order
        },
        xautocontrols() {
            return this.$store.state.qc.autocontrols
        },
        xautocontrol: {
            get() {
                return this.$store.state.qc.autocontrol
            },
            set(val) {
                this.$store.commit("qc/update_autocontrol", val)
            }
        },
        xsearch: {
            get() {
                return this.$store.state.qc.x_search
            },
            set(val) {
                this.$store.commit("qc/update_x_search", val)
            }
        },
        no_save: {
            get() {
                return this.$store.state.qc.no_save
            },
            set(val) {
                this.$store.commit("qc/update_no_save", val)
            }
        },
        openalertconfirmation: {
            get() {
                return this.$store.state.qc.open_alert_confirmation
            },
            set(val) {
                this.$store.commit("qc/update_open_alert_confirmation", val)
            }
        },
        curr_page: {
            get() {
                return this.$store.state.qc.current_page
            },
            set(val) {
                if (this.$store.state.qc.no_save == 0) {
                    this.$store.commit("qc/update_current_page", val)
                    this.searchQc()

                } else {
                    this.$store.commit("qc/update_open_alert_confirmation", true)
                }


            }
        },

        snackbar: {
            get() {
                return this.$store.state.qc.alert_success
            },
            set(val) {
                this.$store.commit("qc/update_alert_success", val)
            }
        },
        msgsnackbar() {
            return this.$store.state.qc.msg_success
        },
        xtotal_page: {
            get() {
                return this.$store.state.qc.total_data
            },
            set(val) {
                this.$store.commit("qc/update_total_data", val)
            }
        }
    },
    methods: {
        isSelected(p) {
            return p.id == this.$store.state.qc.selected_qc.id
        },
        selectMe(sc) {



        },
        updateDialogFormQc() {
            this.$store.commit("qc/update_dialog_form_qc", false)
        },
        updateDialogStatusOrder() {
            this.$store.commit("qc/update_dialog_status_order", false)
        },
        setStatusOrder(val) {
            this.$store.commit("qc/update_qcs", {})
            this.$store.commit("qc/update_dialog_status_order", true)
            this.$store.commit("qc/update_statuss", val.statuss)
        },
        deleteDataPx(idx) {
            var inx = parseInt(idx);
            var xrow = this.$store.state.qc.ordertests[inx]
            if (parseInt(xrow.xid) !== 0) {
                var xdeltest = this.$store.state.qc.deleted_ordertests
                xdeltest.push(xrow)
                this.$store.commit("qc/update_deleted_ordertests", xdeltest)
            }
            var oldArr = this.$store.state.qc.ordertests
            oldArr.splice(inx, 1)
            this.$store.commit("qc/update_ordertests", oldArr)
        },
        deleteDataQc(idx) {
            var inx = parseInt(idx);
            var xrow = this.$store.state.qc.multicontrol[inx]
            if (parseInt(xrow.xid) !== 0) {
                var xdeltest = this.$store.state.qc.deleted_multicontrol
                xdeltest.push(xrow)
                this.$store.commit("qc/update_deleted_multicontrol", xdeltest)
            }
            var oldArr = this.$store.state.qc.multicontrol
            oldArr.splice(inx, 1)
            this.$store.commit("qc/update_multicontrol", oldArr)
            this.searchQc()
            var tot = oldArr.length
            console.log(oldArr.length)
            this.$store.dispatch("qc/lookupsigma", {
                ismulticontrol: this.flag_control,
                multicontrol: this.$store.state.qc.multicontrol,
                instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
                testid: this.xorderautotest.Nat_TestID,
            })
        },
        changeRule(idx, value) {
            let arr = this.$store.state.qc.xrule
            arr[idx].isactive = value.isactive === 'N' ? 'Y' : 'N'
            this.$store.commit("qc/update_xrule", arr)
        },
        doPriceList(val) {
            console.log(location)
            var id = val.id
            location.replace("/one-ui/control/vuex/one-md-price/" + "?id=" + id)
        },
        doPrice() {
            console.log(location)
            var id = this.xid
            location.replace("/one-ui/control/vuex/one-md-price/" + "?id=" + id)
        },
        thr_search_control: _.debounce(function () {
            this.$store.dispatch("qc/searchcontrol", {
                search: this.search_control,
                instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
                testid: this.xorderautotest.Nat_TestID,
                controls: this.xmulticontrol
            })

        }, 200),
        thr_search_test: _.debounce(function () {
            this.$store.dispatch("qc/searchtest", {
                search: this.search_test,
                instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
                controlid: this.xorderautocontrol.Nat_QcControlID
            })
        }, 500),
        thr_search_instrument: _.debounce(function () {
            this.$store.dispatch("qc/searchinstrument", {
                search: this.search_instrument,
                id: this.xorderautocontrol.Nat_QcControlID
            })
        }, 200),
        thr_search_district: _.debounce(function () {
            this.$store.dispatch("qc/searchdistrict", {
                search: this.search_district,
                id: this.xautocity.M_CityID
            })
        }, 200),
        thr_search_kelurahan: _.debounce(function () {
            this.$store.dispatch("qc/searchkelurahan", {
                search: this.search_kelurahan,
                id: this.xautodistrict.M_DistrictID
            })
        }, 200),
        thr_search: _.debounce(function () {
            this.$store.dispatch("control/lookupbyname", {
                control: this.$store.state.control.x_search,
                instrument: this.$store.state.instrument.x_search,
                qc: this.xsearch,
                current_page: 1,
                lastid: -1
            })
            this.$store.dispatch("instrument/lookupbyname", {
                control: this.$store.state.control.x_search,
                instrument: this.$store.state.instrument.x_search,
                qc: this.xsearch,
                current_page: 1,
                lastid: -1
            })
            this.$store.dispatch("qc/lookupbyname", {
                control: this.$store.state.control.x_search,
                instrument: this.$store.state.instrument.x_search,
                sdate: this.xstartdate,
                qc: this.xsearch,
                current_page: 1,
                lastid: -1
            })
            this.$store.commit("instrument/update_selected_instrument", {
                name: "Belum Pilih Instrument"
            })
        }, 200),
        thr_search_company: _.debounce(function () {
            this.$store.dispatch("qc/searchcompany", {
                search: this.search_company
            })
        }, 200),
        thr_search_mou: _.debounce(function () {
            this.$store.dispatch("qc/searchmou", {
                search: this.search_mou,
                id: this.xautocompany.M_CompanyID
            })
        }, 200),
        thr_search_doctor: _.debounce(function () {
            this.$store.dispatch("qc/searchdoctor", {
                search: this.search_doctor
            })
        }, 200),
        searchControl() {
            this.$store.dispatch("qc/lookup", {
                id: this.xcontrol.Nat_InstrumentName === "Belum Pilih Control" ? "0" : this.$store.state
                    .control.selected_control
                    .id,
                sdate: this.xstartdate,
                search: this.xsearch,
                current_page: 1,
                lastid: -1
            })
        },
        lookupControl() {
            this.$store.dispatch("qc/searchcontrol", {
                search: this.search_control,
                instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
                testid: val.Nat_TestID,
                controls: this.xmulticontrol
            })
        },
        doPrint() {
            //alert('doprint')
            this.printwidth = 1028
            this.printtitle = ""
            //  let qc = one_qc()
            var startdate = this.xstartdate
            var enddate = this.xenddate
            var idx = this.xqid
            console.log(idx)
            var ids = ("" + idx).replaceAll('-', ',')
            console.log(("" + idx).replaceAll('-', ','))
            var d = new Date();
            var n = d.getTime()
            var rptname = 'rpt_r_qc'
            var formatrpt = 'pdf'
            let user = one_user()
            this.urlprint = "/birt/run?__report=report/one/rekap/rpt_r_qc.rptdesign&__format=" +
                formatrpt + "&fromm=" + startdate + "&too=" + enddate + "&ids=" + ids + "&username=" + user.M_UserUsername +
                "&tm=" + n

            this.openprint = true
        },
        closePrint() {
            this.openprint = false
        },
        openFormQc(val) {
            this.xid = val
            this.$store.commit("qc/update_ordertests", [])
            this.$store.commit("qc/update_dialog_form_qc", true)
        },
        editFormQc(val) {
            this.xid = val.id
            this.xname = val.Nat_QcName
            this.xdescription = val.Nat_QcDescription
            this.$store.commit("qc/update_autocontrols", [{
                Nat_QcControlID: val.Nat_QcControlID,
                Nat_QcControlName: val.Nat_QcControlName
            }])
            this.$store.commit("qc/update_autocontrol", {
                Nat_QcControlID: val.Nat_QcControlID,
                Nat_QcControlName: val.Nat_QcControlName
            })
            this.$store.commit("qc/update_dialog_form_qc", true)
        },
        checkError(value) {
            var errors = this.$store.state.qc.errors
            if (errors.includes(value)) {
                return true
            } else {
                return false
            }
        },
        forgetAlertConfirmation() {
            this.$store.commit("qc/update_no_save", 0)
            this.$store.commit("qc/update_open_alert_confirmation", false)
        },
        closeAlertConfirmation() {
            this.$store.commit("qc/update_open_alert_confirmation", false)
        },
        changeQc() {
            this.$store.commit("qc/update_no_save", 1)
        },
        saveFormQc() {
            if (this.$refs.formcontrolqc.validate()) {
                this.$store.dispatch("qc/save", {
                    xid: this.xid,
                    controlid: this.$store.state.instrument.selected_instrument.Nat_QcControlID,
                    controlname: this.$store.state.instrument.selected_instrument.Nat_QcControlName,
                    instrumentid: this.$store.state.instrument.selected_instrument.Nat_InstrumentID,
                    instrumentname: this.$store.state.instrument.selected_instrument.Nat_InstrumentName,
                    tests: this.xordertests,
                    scontrol: this.$store.state.control.x_search,
                    sqc: this.xsearch
                })
            }

        },
        simpanAll() {
            this.$store.dispatch("qc/saveall", {
                xid: this.xid,
                controlid: this.$store.state.instrument.selected_instrument.Nat_QcControlID,
                controlname: this.$store.state.instrument.selected_instrument.Nat_QcControlName,
                instrumentid: this.$store.state.instrument.selected_instrument.Nat_InstrumentID,
                instrumentname: this.$store.state.instrument.selected_instrument.Nat_InstrumentName,
                tests: this.$store.state.qc.qcs,
                rules: this.$store.state.qc.xrule,
                sdate: this.xstartdate,
                scontrol: this.$store.state.control.x_search,
                sinstrument: this.xsearch,
                ismulticontrol: this.flag_control
            })

        },
        searchQc() {
            this.$store.dispatch("qc/lookupbyid", {
                sdate: this.xstartdate,
                edate: this.xenddate,
                controlid: this.xorderautocontrol.Nat_QcControlID,
                controlname: this.xorderautocontrol.Nat_QcControlName,
                instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
                instrumentname: this.xorderautoinstrument.Nat_InstrumentName,
                testid: this.xorderautotest.Nat_TestID,
                testname: this.xorderautotest.Nat_TestName,
                ismulticontrol: this.flag_control,
                ismultitest: this.flag_test,
                multicontrol: this.$store.state.qc.multicontrol,
                multitest: this.$store.state.qc.multitest,
                current_page: this.curr_page
            })
            
        },
        addTest() {
            this.$store.dispatch("qc/addqc", {
                sdate: this.xstartdate,
                edate: this.xenddate,
                controlid: this.xorderautocontrol.Nat_QcControlID,
                controlname: this.xorderautocontrol.Nat_QcControlName,
                instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
                instrumentname: this.xorderautoinstrument.Nat_InstrumentName,
                testid: this.xorderautotest.Nat_TestID,
                testname: this.xorderautotest.Nat_TestName,
                current_page: 1
            })
        },
        printNote() {
            this.printwidth = 900
            this.printtitle = ""
            let user = one_user()
            var rpt = 'rpt_t_010'
            if (val.note_amount < 0)
                rpt = 'rpt_t_010'
            this.urlprintnote = "/birt/run?__report=report/one/fo/" + rpt + ".rptdesign&__format=pdf&username=" +
                user.M_UserUsername + "&PID=" + val.note_id
            this.$store.commit("qc/update_open_print_qc", true)
        },
        prosesQc() {
            this.$store.dispatch("qc/saveall", {
                xid: this.xid,
                sdate: this.xstartdate,
                edate: this.xenddate,
                controlid: this.xorderautocontrol.Nat_QcControlID,
                controlname: this.xorderautocontrol.Nat_QcControlName,
                instrumentid: this.xorderautoinstrument.Nat_InstrumentID,
                instrumentname: this.xorderautoinstrument.Nat_InstrumentName,
                testid: this.xorderautotest.Nat_TestID,
                testname: this.xorderautotest.Nat_TestName,
                qcs: this.$store.state.qc.qcs,
                scontrol: this.$store.state.control.x_search,
                sinstrument: this.xsearch,
                ismulticontrol: this.flag_control,
                ismultitest: this.flag_test,
                multicontrol: this.$store.state.qc.multicontrol,
                multitest: this.$store.state.qc.multitest,
                rule: this.$store.state.qc.xrule,
                qid: this.xqid,
                current_page: this.curr_page
            })

        },
        set_date2(x) {
            this.startdate = x.new_date
        },
        set_date3(x) {
            this.enddate = x.new_date
        },
        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')}`
        },
        updateAlert_success(val) {
            this.$store.commit("qc/update_alert_success", val)
        },
        activeFormQc(data) {
            this.xid = data.id

            this.msgalertqc = "Yakin, mau mengaktifkan qc ini?"
            this.dialogdeletealertqc = true
        },
        closeActiveAlertQc() {
            this.$store.dispatch("qc/activeqc", {
                xid: this.xid,
                controlid: this.$store.state.instrument.selected_instrument.Nat_QcControlID,
                controlname: this.$store.state.instrument.selected_instrument.Nat_QcControlName,
                instrumentid: this.$store.state.instrument.selected_instrument.Nat_InstrumentID,
                instrumentname: this.$store.state.instrument.selected_instrument.Nat_InstrumentName,
                name: this.xname,
                scontrol: this.$store.state.control.x_search,
                sqc: this.xsearch
            })
            this.dialogdeletealertqc = false
        }
    },
    watch: {
        xsearch(val, old) {
            console.log(val)
            this.xsearch = val
            this.thr_search()

        },
        search_control(val, old) {
            if (val == old) return
            if (!val) return
            if (val.length < 1) return
            if (this.$store.state.qc.update_autocomplete_status == 1) return
            this.thr_search_control()
        },
        search_test(val, old) {
            if (val == old) return
            if (!val) return
            if (val.length < 1) return
            if (this.$store.state.qc.update_autocomplete_status == 1) return
            this.thr_search_test()
        },
        search_instrument(val, old) {
            if (val == old) return
            if (!val) return
            if (val.length < 1) return
            if (this.$store.state.qc.update_autocomplete_status == 1) return
            this.thr_search_instrument()
        },
        search_district(val, old) {
            if (val == old) return
            if (!val) return
            if (val.length < 1) return
            if (this.$store.state.qc.update_autocomplete_status == 1) return
            this.thr_search_district()
        },
        search_kelurahan(val, old) {
            if (val == old) return
            if (!val) return
            if (val.length < 1) return
            if (this.$store.state.qc.update_autocomplete_status == 1) return
            this.thr_search_kelurahan()
        },
        search_company(val, old) {
            if (val == old) return
            if (!val) return
            if (val.length < 1) return
            if (this.$store.state.qc.update_autocomplete_status == 1) return
            this.thr_search_company()
        },
        search_mou(val, old) {
            if (val == old) return
            if (!val) return
            if (val.length < 1) return
            if (this.$store.state.qc.update_autocomplete_status == 1) return
            this.thr_search_mou()
        },
        search_doctor(val, old) {
            if (val == old) return
            if (!val) return
            if (val.length < 1) return
            if (this.$store.state.qc.update_autocomplete_status == 1) return
            this.thr_search_doctor()
        }
    }
}
</script>