<template>
<div>
    <el-dialog :title="titleDialog" :visible="showDialog" @open="create" width="30%" :close-on-click-modal="false" :close-on-press-escape="false" :show-close="false">
        <div class="row" v-show="!showGenerate">
            <div class="col text-center font-weight-bold">
                <p>Imprimir A4</p>
                <button type="button" class="btn btn-lg btn-info waves-effect waves-light" @click="clickToPrint('a4')">
                    <i class="fa fa-file-alt"></i>
                </button>
            </div>
            <div class="col text-center font-weight-bold">
                <p>Imprimir A5</p>
                <button type="button" class="btn btn-lg btn-info waves-effect waves-light" @click="clickToPrint('a5')">
                    <i class="fa fa-file-alt"></i>
                </button>
            </div>
            <div class="col text-center font-weight-bold">
                <p>Imprimir Ticket</p>
                <button type="button" class="btn btn-lg btn-info waves-effect waves-light" @click="clickToPrint('ticket')">
                    <i class="fa fa-receipt"></i>
                </button>
            </div>
            <template v-if="configuration">
                <div class="col text-center font-weight-bold" v-if="configuration.ticket_58">
                    <p>Imprimir Ticket 58MM</p>
                    <button type="button" class="btn btn-lg btn-info waves-effect waves-light" @click="clickToPrint('ticket_58')">
                        <i class="fa fa-receipt"></i>
                    </button>
                </div>
            </template>

        </div>
        <br />
        <div class="row" v-show="!showGenerate">
            <div class="col-md-12">
                <el-input v-model="customer_email">
                    <el-button slot="append" icon="el-icon-message" @click="clickSendEmail" :loading="loading">Enviar</el-button>
                </el-input>
                <!--<small class="form-control-feedback" v-if="errors.customer_email" v-text="errors.customer_email[0]"></small> -->
            </div>
        </div>
        <br />
        <div class="row" v-if="typeUser == 'admin'">
            <div class="col-md-9" v-show="!showGenerate">
                <div class="form-group">
                    <el-checkbox v-model="generate">Generar comprobante electrónico</el-checkbox>
                </div>
            </div>
        </div>
        <div class="row" v-if="generate">
            <div class="col-lg-12 pb-2">
                <div class="form-group">
                    <label class="control-label font-weight-bold text-info">
                        Cliente
                        <!-- <a href="#" @click.prevent="showDialogNewPerson = true">[+ Nuevo]</a> -->
                    </label>
                    <el-select v-model="document.customer_id" filterable remote class="border-left rounded-left border-info" popper-class="el-select-customers" dusk="customer_id" placeholder="Escriba el nombre o número de documento del cliente" :remote-method="searchRemoteCustomers" @change="changeCustomer" :loading="loading_search">
                        <el-option v-for="option in customers" :key="option.id" :value="option.id" :label="option.description"></el-option>
                    </el-select>
                    <small class="form-control-feedback" v-if="errors.customer_id" v-text="errors.customer_id[0]"></small>
                </div>
            </div>

            <div class="col-lg-8">
                <div class="form-group" :class="{'has-danger': errors.document_type_id}">
                    <label class="control-label">Tipo comprobante</label>
                    <el-select v-model="document.document_type_id" @change="changeDocumentType" popper-class="el-select-document_type" dusk="document_type_id" class="border-left rounded-left border-info">
                        <el-option v-for="option in document_types" :key="option.id" :value="option.id" :label="option.description"></el-option>
                    </el-select>
                    <small class="form-control-feedback" v-if="errors.document_type_id" v-text="errors.document_type_id[0]"></small>
                </div>
            </div>
            <div class="col-lg-4">
                <div class="form-group" :class="{'has-danger': errors.series_id}">
                    <label class="control-label">Serie</label>
                    <el-select v-model="document.series_id">
                        <el-option v-for="option in series" :key="option.id" :value="option.id" :label="option.number"></el-option>
                    </el-select>
                    <small class="form-control-feedback" v-if="errors.series_id" v-text="errors.series_id[0]"></small>
                </div>
            </div>

            <div class="col-lg-6">
                <div class="form-group" :class="{'has-danger': errors.date_of_issue}">
                    <label class="control-label">Fecha de emisión</label>
                    <!-- <el-date-picker
              readonly
              v-model="document.date_of_issue"
              type="date"
              value-format="yyyy-MM-dd"
              :clearable="false"
              @change="changeDateOfIssue"
            ></el-date-picker> -->
                    <el-date-picker v-model="document.date_of_issue" type="date" value-format="yyyy-MM-dd" :clearable="false" @change="changeDateOfIssue"></el-date-picker>
                    <small class="form-control-feedback" v-if="errors.date_of_issue" v-text="errors.date_of_issue[0]"></small>
                </div>
            </div>

            <div class="col-lg-6">
                <div class="form-group" :class="{'has-danger': errors.date_of_issue}">
                    <!--<label class="control-label">Fecha de emisión</label>-->
                    <label class="control-label">Fecha de vencimiento</label>
                    <el-date-picker v-model="document.date_of_due" type="date" value-format="yyyy-MM-dd" :clearable="false"></el-date-picker>
                    <small class="form-control-feedback" v-if="errors.date_of_due" v-text="errors.date_of_due[0]"></small>
                </div>
            </div>
            <br>
            <div class="col-lg-4">
                <div class="form-group" v-show="document.document_type_id == '03'">
                    <el-checkbox v-model="document.is_receivable" class="font-weight-bold">¿Es venta por cobrar?</el-checkbox>
                </div>
            </div> <br>
            <div class="col-lg-12" v-show="is_document_type_invoice">
                <table>
                    <thead>
                        <tr width="100%">
                            <th v-if="document.payments.length>0">M. Pago</th>
                            <th v-if="document.payments.length>0">Destino</th>
                            <th v-if="document.payments.length>0">Referencia</th>
                            <th v-if="document.payments.length>0">Monto</th>
                            <th width="15%">
                                <a href="#" @click.prevent="clickAddPayment" class="text-center font-weight-bold text-info">[+ Agregar]</a>
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr v-for="(row, index) in document.payments" :key="index">
                            <td>
                                <div class="form-group mb-2 mr-2">
                                    <el-select v-model="row.payment_method_type_id">
                                        <el-option v-for="option in payment_method_types" :key="option.id" :value="option.id" :label="option.description"></el-option>
                                    </el-select>
                                </div>
                            </td>
                            <td>
                                <div class="form-group mb-2 mr-2">
                                    <el-select v-model="row.payment_destination_id" filterable :disabled="row.payment_destination_disabled">
                                        <el-option v-for="option in payment_destinations" :key="option.id" :value="option.id" :label="option.description"></el-option>
                                    </el-select>
                                </div>
                            </td>
                            <td>
                                <div class="form-group mb-2 mr-2">
                                    <el-input v-model="row.reference"></el-input>
                                </div>
                            </td>
                            <td>
                                <div class="form-group mb-2 mr-2">
                                    <el-input v-model="row.payment"></el-input>
                                </div>
                            </td>
                            <td class="series-table-actions text-center">
                                <button type="button" class="btn waves-effect waves-light btn-xs btn-danger" @click.prevent="clickCancel(index)">
                                    <i class="fa fa-trash"></i>
                                </button>
                            </td>
                            <br />
                        </tr>
                    </tbody>
                </table>
            </div>

            
            <!-- propinas -->
            <template v-if="configuration.enabled_tips_pos && isInvoiceDocument">
                <set-tip class="full py-2 border-top mt-2" @changeDataTip="changeDataTip"></set-tip>
            </template>
            <!-- propinas -->
        </div>

        <span slot="footer" class="dialog-footer">
            <template v-if="showClose">
                <el-button @click="clickClose">Cerrar</el-button>
                <el-button class="submit" type="primary" @click="submit" :loading="loading_submit" v-if="generate">Generar</el-button>
            </template>
            <template v-else>
                <el-button class="submit" type="primary" plain @click="submit" :loading="loading_submit" v-if="generate">Generar comprobante</el-button>
                <el-button @click="clickFinalize" v-else>Ir al listado</el-button>
                <el-button type="primary" @click="clickNewOrderNote">Nuevo pedido</el-button>
            </template>
        </span>
    </el-dialog>

    <document-options :showDialog.sync="showDialogDocumentOptions" :recordId="documentNewId" :isContingency="false" :showClose="true" :configuration="configuration"></document-options>

    <sale-note-options :showDialog.sync="showDialogSaleNoteOptions" :recordId="documentNewId" :showClose="true" :configuration="configuration"></sale-note-options>
</div>
</template>

<script>
import DocumentOptions from "@views/documents/partials/options.vue";
import SaleNoteOptions from "@views/sale_notes/partials/options.vue";
import SetTip from '@components/SetTip.vue'

export default {
    components: {
        DocumentOptions,
        SaleNoteOptions,
        SetTip
    },

    props: ["showDialog", "recordId", "showClose", "showGenerate", "type", 'typeUser', 'configuration'],
    data() {
        return {
            customer_email: "",
            titleDialog: null,
            loading: false,
            resource: "order-notes",
            resource_documents: "documents",
            errors: {},
            form: {},
            document: {},
            document_types: [],
            all_document_types: [],
            all_series: [],
            series: [],
            customers: [],
            generate: false,
            loading_submit: false,
            showDialogDocumentOptions: false,
            showDialogSaleNoteOptions: false,
            documentNewId: null,
            is_document_type_invoice: true,
            loading_search: false,
            payment_destinations: [],
            form_cash_document: {},
            payment_method_types: []
        };
    },
    created() {
        this.initForm();
        this.initDocument();
        // this.clickAddPayment()
    },
    computed:
    {
        isInvoiceDocument()
        {
            return ['01', '03'].includes(this.document.document_type_id)
        }
    },
    methods: {
        changeDataTip(tip)
        {
            if(tip)
            {
                this.document.worker_full_name_tips = tip.worker_full_name_tips 
                this.document.total_tips = tip.total_tips 
            }
        },
        cleanFormTip()
        {
            this.document.worker_full_name_tips = null
            this.document.total_tips = 0
            this.$eventHub.$emit('eventInitTip')
        },
        clickCancel(index) {
            this.document.payments.splice(index, 1);
        },
        clickAddPayment() {
            let payment = (this.document.payments.length == 0) ? this.form.order_note.total : 0

            this.document.payments.push({
                id: null,
                document_id: null,
                date_of_payment: moment().format("YYYY-MM-DD"),
                payment_method_type_id: this.form.order_note.payment_method_type_id,
                payment_destination_id: null,
                reference: null,
                payment: payment
            });
        },
        initForm() {
            this.generate = this.showGenerate ? true : false;
            this.errors = {};
            this.form = {
                id: null,
                external_id: null,
                identifier: null,
                date_of_issue: null,
                order_note: null
            };

            this.form_cash_document = {
                document_id: null,
                sale_note_id: null
            }

        },
        getCustomer() {
            this.$http
                .get(
                    `/${this.resource_documents}/search/customer/${this.form.order_note.customer_id}`
                )
                .then(response => {
                    this.customers = response.data.customers;
                    this.document.customer_id = this.form.order_note.customer_id;
                    this.changeCustomer();
                });
        },
        changeCustomer() {
            this.validateIdentityDocumentType();
        },
        searchRemoteCustomers(input) {
            if (input.length > 0) {
                this.loading_search = true;
                let parameters = `input=${input}&document_type_id=${this.form.document_type_id}&operation_type_id=${this.form.operation_type_id}`;

                this.$http
                    .get(`/${this.resource}/search/customers?${parameters}`)
                    .then(response => {
                        this.customers = response.data.customers;
                        this.loading_search = false;
                    });
            }
        },
        initDocument() {
            this.document = {
                document_type_id: null,
                series_id: null,
                establishment_id: null,
                number: "#",
                date_of_issue: moment().format("YYYY-MM-DD"),
                time_of_issue: null,
                customer_id: null,
                currency_type_id: null,
                purchase_order: null,
                exchange_rate_sale: 0,
                total_prepayment: 0,
                total_charge: 0,
                total_discount: 0,
                total_exportation: 0,
                total_free: 0,
                total_taxed: 0,
                total_unaffected: 0,
                total_exonerated: 0,
                total_igv_free: 0,
                total_igv: 0,
                total_base_isc: 0,
                total_isc: 0,
                total_base_other_taxes: 0,
                total_other_taxes: 0,
                total_taxes: 0,
                total_value: 0,
                total: 0,
                operation_type_id: null,
                date_of_due: moment().format("YYYY-MM-DD"),
                items: [],
                charges: [],
                discounts: [],
                attributes: [],
                guides: [],
                additional_information: null,
                actions: {
                    format_pdf: "a4"
                },
                order_note_id: null,
                is_receivable: false,
                payments: [],
                hotel: {},
                seller_id: 0,
                
                worker_full_name_tips: null, //propinas
                total_tips: 0, //propinas
            };

            this.cleanFormTip()

        },
        changeDateOfIssue() {
            this.document.date_of_due = this.document.date_of_issue;
        },
        resetDocument() {
            this.generate = this.showGenerate ? true : false;
            this.initDocument();
            this.document.document_type_id =
                this.document_types.length > 0 ? this.document_types[0].id : null;
            this.changeDocumentType();
        },
        validatePaymentDestination() {

            let error_by_item = 0

            this.document.payments.forEach((item) => {
                if (item.payment_destination_id == null) error_by_item++;
            })

            return {
                error_by_item: error_by_item,
            }

        },
        async submit() {
            await this.assignDocument();

            let validate_payment_destination = await this.validatePaymentDestination()

            if (validate_payment_destination.error_by_item > 0) {
                return this.$message.error('El destino del pago es obligatorio');
            }

            this.loading_submit = true;
            if (this.document.document_type_id === "80") {
                this.document.prefix = "NV";
                this.resource_documents = "sale-notes";
            } else {
                this.document.prefix = null;
                this.resource_documents = "documents";
            }

            this.$http
                .post(`/${this.resource_documents}`, this.document)
                .then(response => {
                    if (response.data.success) {
                        this.documentNewId = response.data.data.id;
                        // console.log(this.document.document_type_id)
                        if (this.document.document_type_id === "80") {
                            this.form_cash_document.sale_note_id = response.data.data.id;
                            this.showDialogSaleNoteOptions = true;
                        } else {
                            this.form_cash_document.document_id = response.data.data.id;
                            this.showDialogDocumentOptions = true;
                        }
                        this.saveCashDocument();

                        this.$eventHub.$emit("reloadData");
                        this.resetDocument();
                        this.document.customer_id = this.form.order_note.customer_id;
                        this.changeCustomer();
                    } else {
                        this.$message.error(response.data.message);
                    }
                })
                .catch(error => {
                    if (error.response.status === 422) {
                        this.errors = error.response.data;
                    } else {
                        this.$message.error(error.response.data.message);
                    }
                })
                .then(() => {
                    this.loading_submit = false;
                });
        },
        saveCashDocument() {
            this.$http.post(`/cash/cash_document`, this.form_cash_document)
                .then(response => {
                    if (response.data.success) {
                        // console.log(response)
                    } else {
                        this.$message.error(response.data.message);
                    }
                })
                .catch(error => {
                    console.log(error);
                })
        },
        assignDocument() {
            let q = this.form.order_note;
            // console.log(q)

            this.document.establishment_id = q.establishment_id;
            // this.document.date_of_issue = q.date_of_issue
            this.document.time_of_issue = moment().format("HH:mm:ss");
            // this.document.customer_id = q.customer_id
            this.document.currency_type_id = q.currency_type_id;
            this.document.purchase_order = null;
            this.document.exchange_rate_sale = q.exchange_rate_sale;
            this.document.total_prepayment = q.total_prepayment;
            this.document.total_charge = q.total_charge;
            this.document.total_discount = q.total_discount;
            this.document.total_exportation = q.total_exportation;
            this.document.total_free = q.total_free;
            this.document.total_taxed = q.total_taxed;
            this.document.total_unaffected = q.total_unaffected;
            this.document.total_exonerated = q.total_exonerated;
            this.document.total_igv = q.total_igv;
            this.document.total_igv_free = q.total_igv_free;
            this.document.total_base_isc = q.total_base_isc;
            this.document.total_isc = q.total_isc;
            this.document.total_base_other_taxes = q.total_base_other_taxes;
            this.document.total_other_taxes = q.total_other_taxes;
            this.document.total_taxes = q.total_taxes;
            this.document.total_value = q.total_value;
            this.document.total = q.total;
            this.document.operation_type_id = "0101";
            // this.document.date_of_due = q.date_of_issue
            this.document.items = this.getDataItems(q.items);
            // this.document.items = q.items;
            this.document.charges = q.charges;
            this.document.discounts = q.discounts;
            this.document.attributes = [];
            //this.document.payments = [];
            this.document.guides = q.guides;
            this.document.additional_information = null;
            this.document.actions = {
                format_pdf: "a4"
            };
            this.document.order_note_id = this.form.id;
            this.document.seller_id = q.user_id;
        },
        getSaleLotsGroup(lots_group) {

            return _.filter(lots_group, (lot_group) => {
                return lot_group.compromise_quantity > 0
            })

        },
        transformSaleLotsGroup(sale_lots_group) {

            return sale_lots_group.map((lot_group) => {
                return {
                    id: lot_group.id,
                    code: lot_group.code,
                    date_of_due: lot_group.date_of_due,
                    compromise_quantity: lot_group.compromise_quantity,
                }
            })

        },
        getDataItems(items){

            let new_items = items

            if (this.document.document_type_id != '80') 
            {
                new_items = items.map((row) => {

                    // si existe propiedad regularizada en json item
                    if(row.item.IdLoteSelected)
                    {
                        if (Array.isArray(row.item.IdLoteSelected)) 
                        {
                            row.IdLoteSelected = row.item.IdLoteSelected
                        }
                    }
                    else
                    {
                        if (Array.isArray(row.item.lots_group)) 
                        {
                            // obtener lotes vendidos, con cantidad mayor a 0
                            let sale_lots_group = this.getSaleLotsGroup(row.item.lots_group)
    
                            if (sale_lots_group.length > 0) 
                            {
                                // generar arreglo de lotes vendidos con la data necesaria para que sea procesado en registro de cpe
                                row.IdLoteSelected = this.transformSaleLotsGroup(sale_lots_group)
                            }
                        }
                    }

                    return row
                })
            }

            return new_items
        },
        async create() {
            await this.$http.get(`/${this.resource}/option/tables`).then(response => {
                this.all_document_types = response.data.document_types_invoice;
                this.all_series = response.data.series;
                this.payment_destinations = response.data.payment_destinations
                this.payment_method_types = response.data.payment_method_types;
                // this.document.document_type_id = (this.all_document_types.length > 0)?this.all_document_types[0].id:null
                // this.changeDocumentType()
            });

            await this.$http
                .get(`/${this.resource}/record2/${this.recordId}`)
                .then(response => {
                    this.form = response.data.data;
                    this.form.order_note.seller_id = this.form.order_note.user_id;
                    // this.validateIdentityDocumentType()
                    this.getCustomer();
                    let type = this.type == "edit" ? "editado" : "registrado";
                    this.titleDialog = `Pedido ${type}: ` + this.form.identifier;
                });

            await this.clickAddPayment()

        },
        changeDocumentType() {
            // this.filterSeries()
            this.document.is_receivable = false;
            this.series = [];
            if (this.document.document_type_id !== "nv") {
                this.filterSeries();
                this.is_document_type_invoice = true;
            } else {
                this.is_document_type_invoice = false;
            }

            if(this.configuration.enabled_tips_pos && !this.isInvoiceDocument) this.cleanFormTip()
        },
        async validateIdentityDocumentType() {
            let identity_document_types = ["0", "1"];
            /*
            0		Doc.trib.no.dom.sin.ruc
            1		DNI
            */
            let customer = _.find(this.customers, {
                id: this.document.customer_id
            });

            if (identity_document_types.includes(customer.identity_document_type_id)) {
                this.document_types = _.filter(this.all_document_types,
                    _.overSome(
                        [
                            // {'id': '01'}, // Factura
                            {
                                'id': '03'
                            }, // Boleta
                            ['id', '80'] // Nota de venta
                        ]
                    )
                );
                // this.document_types = _.filter(this.all_document_types, {id: "03"});
            } else {
                this.document_types = this.all_document_types;
            }

            this.document.document_type_id = this.document_types.length > 0 ? this.document_types[0].id : null;
            await this.changeDocumentType();
        },
        filterSeries() {
            this.document.series_id = null;
            this.series = _.filter(this.all_series, {
                document_type_id: this.document.document_type_id
            });
            this.document.series_id =
                this.series.length > 0 ? this.series[0].id : null;
        },
        clickFinalize() {
            location.href = `/${this.resource}`;
        },
        clickNewOrderNote() {
            this.clickClose();
        },
        clickClose() {
            this.$emit("update:showDialog", false);
            this.initForm();
            this.resetDocument();
        },
        clickToPrint(format) {
            window.open(
                `/${this.resource}/print/${this.form.external_id}/${format}`,
                "_blank"
            );
        },
        clickSendEmail() {
            this.loading = true;
            this.$http
                .post(`/${this.resource}/email`, {
                    customer_email: this.customer_email,
                    id: this.form.id,
                    customer_id: this.form.order_note.customer_id
                })
                .then(response => {
                    if (response.data.success) {
                        this.$message.success("El correo fue enviado satisfactoriamente");
                    } else {
                        this.$message.error("Error al enviar el correo");
                    }
                })
                .catch(error => {
                    this.$message.error("Error al enviar el correo");
                })
                .then(() => {
                    this.loading = false;
                });
        }
    }
};
</script>
