<template>
    <div class="card mb-0 pt-2 pt-md-0">
        <!-- <div class="card-header bg-info">
            <h3 class="my-0">Nuevo Comprobante</h3>
        </div> -->
        <div class="tab-content" v-if="loading_form">
            <div class="invoice">
                <header class="clearfix">
                    <div class="row">
                        <div class="col-sm-2 text-center mt-3 mb-0">
                            <logo url="/"
                                  :path_logo="(company.logo != null) ? `/storage/uploads/logos/${company.logo}` : ''"></logo>
                        </div>
                        <div class="col-sm-10 text-left mt-3 mb-0">
                            <address class="ib mr-2">
                                <span class="font-weight-bold d-block">PEDIDO</span>
                                <span class="font-weight-bold d-block">PD-XXX</span>
                                <span class="font-weight-bold">{{ company.name }}</span>
                                <br>
                                <div v-if="config.establishment.address != '-'">{{
                                        config.establishment.address
                                    }},
                                </div>
                                {{ config.establishment.district.description }},
                                {{ config.establishment.province.description }},
                                {{ config.establishment.department.description }} -
                                {{ config.establishment.country.description }}
                                <br>
                                {{ config.establishment.email }} - <span
                                v-if="config.establishment.telephone != '-'">{{ config.establishment.telephone }}</span>
                            </address>
                        </div>
                    </div>
                </header>
                <form autocomplete="off" @submit.prevent="submit">
                    <div class="form-body">
                        <div class="row mt-1">
                            <div class="col-lg-6 pb-2">
                                <div class="form-group" :class="{'has-danger': errors.customer_id}">
                                    <label class="control-label font-weight-bold text-info">
                                        Cliente
                                        <a href="#" @click.prevent="showDialogNewPerson = true">[+ Nuevo]</a>
                                    </label>
                                    <el-select v-model="form.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"
                                               :loading="loading_search"
                                               @change="changeCustomer"
                                               @keyup.enter.native="keyupCustomer">

                                        <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-2">
                                <div class="form-group" :class="{'has-danger': errors.date_of_issue}">
                                    <!--<label class="control-label">Fecha de emisión</label>-->
                                    <label class="control-label">Fec. Emisión</label>
                                    <el-date-picker v-model="form.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-2">
                                <div class="form-group" :class="{'has-danger': errors.date_of_due}">
                                    <label class="control-label">Fec. Vencimiento</label>
                                    <el-date-picker v-model="form.date_of_due" type="date" value-format="yyyy-MM-dd"
                                                    :clearable="true"></el-date-picker>
                                    <small class="form-control-feedback" v-if="errors.date_of_due"
                                           v-text="errors.date_of_due[0]"></small>
                                </div>
                            </div>
                            <div class="col-lg-2">
                                <div class="form-group" :class="{'has-danger': errors.delivery_date}">
                                    <label class="control-label">Fec. Entrega</label>
                                    <el-date-picker v-model="form.delivery_date" type="date" value-format="yyyy-MM-dd"
                                                    :clearable="true"></el-date-picker>
                                    <small class="form-control-feedback" v-if="errors.delivery_date"
                                           v-text="errors.delivery_date[0]"></small>
                                </div>
                            </div>

                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">Dirección de envío
                                    </label>
                                    <el-input v-model="form.shipping_address"></el-input>
                                    <small class="form-control-feedback" v-if="errors.shipping_address"
                                           v-text="errors.shipping_address[0]"></small>
                                </div>
                            </div>
                            <div class="col-lg-2">
                                <div class="form-group" :class="{'has-danger': errors.payment_method_type_id}">
                                    <label class="control-label">
                                        Término de pago
                                    </label>
                                    <el-select v-model="form.payment_method_type_id" filterable
                                               @change="changePaymentMethodType">
                                        <el-option v-for="option in payment_method_types" :key="option.id"
                                                   :value="option.id" :label="option.description"></el-option>
                                    </el-select>
                                    <small class="form-control-feedback" v-if="errors.payment_method_type_id"
                                           v-text="errors.payment_method_type_id[0]"></small>
                                </div>
                            </div>
                            <div class="col-lg-2">
                                <div class="form-group" :class="{'has-danger': errors.currency_type_id}">
                                    <label class="control-label">Moneda</label>
                                    <el-select v-model="form.currency_type_id" @change="changeCurrencyType">
                                        <el-option v-for="option in currency_types" :key="option.id" :value="option.id"
                                                   :label="option.description"></el-option>
                                    </el-select>
                                    <small class="form-control-feedback" v-if="errors.currency_type_id"
                                           v-text="errors.currency_type_id[0]"></small>
                                </div>
                            </div>
                            <div class="col-lg-2">
                                <div class="form-group" :class="{'has-danger': errors.exchange_rate_sale}">
                                    <label class="control-label">Tipo de cambio
                                        <el-tooltip class="item" effect="dark"
                                                    content="Tipo de cambio del día, extraído de SUNAT"
                                                    placement="top-end">
                                            <i class="fa fa-info-circle"></i>
                                        </el-tooltip>
                                    </label>
                                    <el-input v-model="form.exchange_rate_sale"></el-input>
                                    <small class="form-control-feedback" v-if="errors.exchange_rate_sale"
                                           v-text="errors.exchange_rate_sale[0]"></small>
                                </div>
                            </div>

                            <div class="col-lg-6">
                                <div class="form-group" :class="{'has-danger': errors.observation}">
                                    <label class="control-label">Observación
                                    </label>
                                    <el-input type="textarea" :rows="3" v-model="form.observation"></el-input>
                                    <small class="form-control-feedback" v-if="errors.observation"
                                           v-text="errors.observation[0]"></small>
                                </div>
                            </div>

                            
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">Datos adicionales</label>
                                </div>
                                
                                <table class="table table-responsive table-bordered">
                                    <thead>
                                        <tr width="100%">
                                            <template v-if="form.additional_data.length > 0">
                                                <th class="pb-2" width="40%">Título</th>
                                                <th class="pb-2" width="40%">Descripción</th>
                                            </template>
                                            <th :width="form.additional_data.length > 0 ? '20%':'5%'"><a href="#" @click.prevent="clickAddAdditionalData" class="text-center font-weight-bold text-info">[+ Agregar]</a></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr v-for="(row, index) in form.additional_data" :key="index" width="100%">
                                            <td>
                                                <div class="form-group mb-2 mr-2">

                                                    <el-input v-model="row.title"></el-input>
                                                    
                                                    <template v-if="errors[`additional_data.${index}.title`]">
                                                        <div class="form-group" :class="{'has-danger': errors[`additional_data.${index}.title`]}">
                                                            <small class="form-control-feedback" v-text="errors[`additional_data.${index}.title`][0]"></small>
                                                        </div>
                                                    </template>
                                                </div>
                                            </td>
                                            <td>
                                                <div class="form-group mb-2 mr-2">
                                                    
                                                    <el-input v-model="row.description"></el-input>
                                                    
                                                    <template v-if="errors[`additional_data.${index}.description`]">
                                                        <div class="form-group" :class="{'has-danger': errors[`additional_data.${index}.description`]}">
                                                            <small class="form-control-feedback" v-text="errors[`additional_data.${index}.description`][0]"></small>
                                                        </div>
                                                    </template>
                                                </div>
                                            </td>
                                            <td class="series-table-actions text-center">
                                                <button  type="button" class="btn waves-effect waves-light btn-xs btn-danger" @click.prevent="clickDeleteAdditionalData(index)">
                                                    <i class="fa fa-trash"></i>
                                                </button>
                                            </td>
                                            <br>
                                        </tr>
                                    </tbody>
                                </table>

                            </div>
                        </div>

                        <div class="row mt-3">
                            <div class="col-md-12">
                                <div class="table-responsive">
                                    <table class="table">
                                        <thead>
                                        <tr>
                                            <th width="5%">#</th>
                                            <th class="font-weight-bold"
                                                width="30%">Descripción</th>
                                            <th width="8%" class="text-center font-weight-bold">Unidad</th>
                                            <th width="8%" class="text-center font-weight-bold">Cantidad</th>
                                            <th class="text-center font-weight-bold">Precio Unitario</th>
                                            <th class="text-center font-weight-bold">Subtotal</th>
                                            <!--<th class="text-right font-weight-bold">Cargo</th>-->
                                            <th class="text-center font-weight-bold">Total</th>

                                            <template v-if="is_generate_from_quotation">
                                                <th width="8%"></th>
                                            </template>

                                            <th width="8%"></th>
                                        </tr>
                                        </thead>
                                        <tbody v-if="form.items.length > 0">
                                        <tr v-for="(row, index) in form.items" :key="index">
                                            <td>{{ index + 1 }}</td>
                                            <td>{{ setDescriptionOfItem (row.item) }}
                                                {{ row.item.presentation.hasOwnProperty('description') ? row.item.presentation.description : '' }}<br/><small>{{ row.affectation_igv_type.description }}</small>
                                            </td>
                                            <td class="text-center">{{ row.item.unit_type_id }}</td>
                                            <td class="text-center">{{ row.quantity }}</td>
                                            <!-- <td class="text-right">{{currency_type.symbol}} {{row.unit_price}}</td> -->
                                            <td class="text-center">{{ currency_type.symbol }}
                                                {{ getFormatUnitPriceRow(row.unit_price) }}
                                            </td>

                                            <td class="text-center">{{ currency_type.symbol }} {{ row.total_value }}</td>
                                            <!--<td class="text-right">{{ currency_type.symbol }} {{ row.total_charge }}</td>-->
                                            <td class="text-center">{{ currency_type.symbol }} {{ row.total }}</td>

                                            <!-- si se genera pedido desde una cotizacion -->
                                            <template v-if="is_generate_from_quotation">
                                                <td class="text-center">
                                                    <template v-if="row.item.lots_enabled">
                                                        <button class="btn waves-effect waves-light btn-xs btn-primary" @click.prevent="openDialogLotsGroup(index, row)">
                                                            <i class="el-icon-check"></i> Lotes
                                                        </button>
                                                    </template>
                                                </td>
                                            </template>

                                            <td class="text-center">
                                                <button type="button"
                                                        class="btn waves-effect waves-light btn-xs btn-danger"
                                                        @click.prevent="clickRemoveItem(index)">x
                                                </button>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td :colspan="is_generate_from_quotation ? 9 : 8"></td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                            <div class="col-lg-12 col-md-6 d-flex align-items-end">
                                <div class="form-group">
                                    <button type="button" class="btn waves-effect waves-light btn-primary"
                                            @click.prevent="showDialogAddItem = true">+ Agregar Producto
                                    </button>
                                </div>
                            </div>

                            <div class="col-md-8 mt-3">

                            </div>

                            <div class="col-md-4">
                                <p class="text-right" v-if="form.total_exportation > 0">OP.EXPORTACIÓN:
                                    {{ currency_type.symbol }} {{ form.total_exportation }}</p>
                                <p class="text-right" v-if="form.total_free > 0">OP.GRATUITAS: {{
                                        currency_type.symbol
                                    }} {{ form.total_free }}</p>
                                <p class="text-right" v-if="form.total_unaffected > 0">OP.INAFECTAS:
                                    {{ currency_type.symbol }} {{ form.total_unaffected }}</p>
                                <p class="text-right" v-if="form.total_exonerated > 0">OP.EXONERADAS:
                                    {{ currency_type.symbol }} {{ form.total_exonerated }}</p>
                                <p class="text-right" v-if="form.total_taxed > 0">OP.GRAVADA: {{ currency_type.symbol }}
                                    {{ form.total_taxed }}</p>
                                <p class="text-right" v-if="form.total_igv > 0">IGV: {{ currency_type.symbol }}
                                    {{ form.total_igv }}</p>
                                <h3 class="text-right" v-if="form.total > 0"><b>TOTAL A
                                    PAGAR: </b>{{ currency_type.symbol }} {{ form.total }}</h3>
                            </div>

                        </div>

                    </div>


                    <div class="form-actions text-right mt-4">
                        <el-button @click.prevent="close()">Cancelar</el-button>
                        <el-button class="submit" type="primary" native-type="submit" :loading="loading_submit"
                                   v-if="form.items.length > 0">Generar
                        </el-button>
                    </div>
                </form>
            </div>
        </div>

        <order-note-form-item :showDialog.sync="showDialogAddItem"
                              :currency-type-id-active="form.currency_type_id"
                              :exchange-rate-sale="form.exchange_rate_sale"
                              :typeUser="typeUser"
                              :configuration="config"
                              :percentage-igv="percentage_igv"
                              @add="addRow"></order-note-form-item>

        <person-form :showDialog.sync="showDialogNewPerson"
                     type="customers"
                     :external="true"
                     :input_person="input_person"
                     :document_type_id=form.document_type_id></person-form>

        <order-note-options :showDialog.sync="showDialogOptions"
                            :recordId="orderNoteNewId"
                            :typeUser="typeUser"
                            :showGenerate="false"
                            :showClose="false"
                            :configuration="config"></order-note-options>

        <select-lots-group
            :lots_group="lots_group"
            :quantity="lots_group_quantity"
            :showDialog.sync="showDialogLotsGroup"
            @addRowLotGroup="addRowLotGroup">
        </select-lots-group>
    </div>
</template>

<script>
import OrderNoteFormItem from './partials/item.vue'
import PersonForm from '@views/persons/form.vue'
import OrderNoteOptions from './partials/options.vue'
import {functions, exchangeRate} from '@mixins/functions'
import {calculateRowItem,showNamePdfOfDescription} from '@helpers/functions'
import Logo from '@views/companies/logo.vue'
import {mapActions, mapState} from "vuex";
import SelectLotsGroup from '@views/documents/partials/lots_group.vue'

export default {
    props: [
        'typeUser',
        'configuration'
    ],
    components: {OrderNoteFormItem, PersonForm, OrderNoteOptions, Logo, SelectLotsGroup},
    mixins: [functions, exchangeRate],
    data() {
        return {
            resource: 'order-notes',
            showDialogAddItem: false,
            showDialogNewPerson: false,
            showDialogOptions: false,
            loading_submit: false,
            loading_form: false,
            errors: {},
            form: {},
            currency_types: [],
            discount_types: [],
            charges_types: [],
            all_customers: [],
            payment_method_types: [],
            customers: [],
            establishments: [],
            currency_type: {},
            orderNoteNewId: null,
            activePanel: 0,
            loading_search: false,
            is_generate_from_quotation: false,
            current_index_item: -1,
            lots_group_quantity: 0,
            showDialogLotsGroup: false,
            lots_group: [],
            input_person: {},
        }
    },
    created() {
        this.$store.commit('setConfiguration', this.configuration);
        this.loadConfiguration()
        this.loadEstablishment()
        this.loadCompany()
    },
    async mounted() {
        this.initForm()
        this.$eventHub.$on('reloadDataPersons', (customer_id) => {
            this.reloadDataCustomers(customer_id)
        })
        this.$eventHub.$on('initInputPerson', () => {
            this.initInputPerson()
        });
        await this.$http.get(`/${this.resource}/tables`)
            .then(response => {
                this.currency_types = response.data.currency_types
                this.establishments = response.data.establishments
                this.all_customers = response.data.customers
                this.discount_types = response.data.discount_types
                this.charges_types = response.data.charges_types
                // let company = response.data.company
                // this.$store.commit('setCompany', company);

                this.form.currency_type_id = (this.currency_types.length > 0) ? this.currency_types[0].id : null
                this.form.establishment_id = (this.establishments.length > 0) ? this.establishments[0].id : null
                this.payment_method_types = response.data.payment_method_types

                this.changeEstablishment()
                this.changeDateOfIssue()
                this.changeCurrencyType()
                this.allCustomers()
            })
            .then(() => {

                // valida si viene de cotizaciones
                let fromCotizacion = localStorage.getItem('FromQuotation')
                let q = localStorage.getItem('Quotation')

                if (fromCotizacion !== undefined && fromCotizacion && q !== undefined)
                {

                    this.is_generate_from_quotation = true

                    this.$http.post(`/${this.resource}/Quotation/get/${q}`)
                        .then(response => {
                            let data = response.data;
                            if (data !== undefined) {
                                this.reloadDataCustomers(data.customer_id)
                                for (var i = 0; i < data.items.length; i += 1) {
                                    this.addRow(data.items[i])
                                }
                                this.form.payment_method_type_id = data.payment_method_type_id
                                this.form.currency_type_id = data.currency_type_id
                                this.form.quotation_id = data.id
                            }
                        })
                        .catch(error => {
                            console.log('Error intentando crear un pedido desde cotizacion.')
                            console.error(error)
                        })
                        .finally(() => {
                            localStorage.removeItem('FromQuotation')
                            localStorage.removeItem('Quotation')
                        })

                    //
                }

            })
        await this.getPercentageIgv();
        this.loading_form = true
    },
    methods: {
        clickAddAdditionalData()
        {
            this.form.additional_data.push({
                title: null,
                description: null,
            })
        },
        clickDeleteAdditionalData(index)
        {
            this.form.additional_data.splice(index, 1)
        },
        addRowLotGroup(lots_selecteds){

            this.form.items[this.current_index_item].IdLoteSelected = lots_selecteds
            this.current_index_item = -1

        },
        regularizeCompromiseQuantity(row){

            if(row.IdLoteSelected)
            {
                this.lots_group.forEach(l_group => {

                    const lot = _.find(row.IdLoteSelected, {id : l_group.id})

                    if(lot) l_group.compromise_quantity = lot.compromise_quantity

                })
            }

        },
        async getLotsGroup(item_id){

            this.loading = true

            await this.$http.get(`/item-lots-group/available-data/${item_id}`)
                .then((response) => {
                    this.lots_group = response.data
                })
                .then(()=>{
                    this.loading = false
                })

        },
        async openDialogLotsGroup(index, row){

            await this.getLotsGroup(row.item_id)
            await this.regularizeCompromiseQuantity(row)
            this.current_index_item = index
            this.lots_group_quantity = row.quantity
            this.showDialogLotsGroup = true

        },
        ...mapActions([
            'loadConfiguration',
            'loadCompany',
            'loadEstablishment',
        ]),
        changeCustomer(){
            this.setAddressByCustomer()
        },
        setAddressByCustomer(){

            let customer = _.find(this.customers, {id : this.form.customer_id})

            if(customer){
                this.form.shipping_address = customer.address
            }

        },
        getFormatUnitPriceRow(unit_price) {
            return _.round(unit_price, 6)
            // return unit_price.toFixed(6)
        },
        async changePaymentMethodType(flag_submit = true) {
            let payment_method_type = await _.find(this.payment_method_types, {'id': this.form.payment_method_type_id})
            if (payment_method_type) {

                if (payment_method_type.number_days) {
                    this.form.date_of_issue = moment().add(payment_method_type.number_days, 'days').format('YYYY-MM-DD');
                    this.changeDateOfIssue()
                }
                // else{
                //     if(flag_submit){
                //         this.form.date_of_issue = moment().format('YYYY-MM-DD')
                //         this.changeDateOfIssue()
                //     }
                // }
            }
        },
        searchRemoteCustomers(input) {

            if (input.length > 0) {
                this.loading_search = true
                let parameters = `input=${input}`

                this.$http.get(`/${this.resource}/search/customers?${parameters}`)
                    .then(response => {
                        this.customers = response.data.customers
                        this.loading_search = false
                        /* if (this.customers.length == 0) {
                            this.allCustomers()
                        } */
                        this.input_person.number=(this.customers.length==0)? input : null
                    })
            } else {
                this.allCustomers()
                this.input_person.number= null
            }

        },
        initForm() {
            this.errors = {}
            this.form = {
                observation: null,
                prefix: 'PD',
                establishment_id: null,
                date_of_issue: moment().format('YYYY-MM-DD'),
                time_of_issue: moment().format('HH:mm:ss'),
                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: null,
                delivery_date: null,
                items: [],
                charges: [],
                discounts: [],
                attributes: [],
                guides: [],
                payment_method_type_id: '10',
                additional_information: null,
                shipping_address: null,
                actions: {
                    format_pdf: 'a4',
                },
                additional_data: [],
            }

            this.is_generate_from_quotation = false

            this.initInputPerson()
        },
        resetForm() {
            this.activePanel = 0
            this.initForm()
            this.form.currency_type_id = (this.currency_types.length > 0) ? this.currency_types[0].id : null
            this.form.establishment_id = (this.establishments.length > 0) ? this.establishments[0].id : null
            this.changeEstablishment()
            this.changeDateOfIssue()
            this.changeCurrencyType()
            this.allCustomers()
        },
        changeEstablishment() {
            let establishment = _.find(this.establishments, {'id': this.form.establishment_id})
            this.$store.commit('setEstablishment', establishment);
        },
        cleanCustomer() {
            this.form.customer_id = null;
        },
        async changeDateOfIssue() {
            // this.form.date_of_due = this.form.date_of_issue > this.form.date_of_due ? this.form.date_of_issue:null
            await this.searchExchangeRateByDate(this.form.date_of_issue).then(response => {
                this.form.exchange_rate_sale = response
            })
            await this.getPercentageIgv();
            this.changeCurrencyType();
        },
        allCustomers() {
            this.customers = this.all_customers
        },
        addRow(row) {
            this.form.items.push(JSON.parse(JSON.stringify(row)));

            this.calculateTotal();
        },
        clickRemoveItem(index) {
            this.form.items.splice(index, 1)
            this.calculateTotal()
        },
        changeCurrencyType() {
            this.currency_type = _.find(this.currency_types, {'id': this.form.currency_type_id})
            let items = []
            this.form.items.forEach((row) => {
                items.push(calculateRowItem(row, this.form.currency_type_id, this.form.exchange_rate_sale, this.percentage_igv))
            });
            this.form.items = items
            this.calculateTotal()
        },
        calculateTotal() {

            let total_discount = 0
            let total_charge = 0
            let total_exportation = 0
            let total_taxed = 0
            let total_exonerated = 0
            let total_unaffected = 0
            let total_free = 0
            let total_igv = 0
            let total_value = 0
            let total = 0
            let total_igv_free = 0

            this.form.items.forEach((row) => {
                total_discount += parseFloat(row.total_discount)
                total_charge += parseFloat(row.total_charge)

                if (row.affectation_igv_type_id === '10') {
                    total_taxed += parseFloat(row.total_value)
                }
                if (row.affectation_igv_type_id === '20') {
                    total_exonerated += parseFloat(row.total_value)
                }
                if (row.affectation_igv_type_id === '30') {
                    total_unaffected += parseFloat(row.total_value)
                }
                if (row.affectation_igv_type_id === '40') {
                    total_exportation += parseFloat(row.total_value)
                }
                if (['10', '20', '30', '40'].indexOf(row.affectation_igv_type_id) < 0) {
                    total_free += parseFloat(row.total_value)
                }
                if (['10', '20', '30', '40'].indexOf(row.affectation_igv_type_id) > -1) {
                    total_igv += parseFloat(row.total_igv)
                    total += parseFloat(row.total)
                }

                // total_value += parseFloat(row.total_value)

                if (!['21', '37'].includes(row.affectation_igv_type_id)) {
                    total_value += parseFloat(row.total_value)
                }

                if (['11', '12', '13', '14', '15', '16'].includes(row.affectation_igv_type_id)) {

                    let unit_value = row.total_value / row.quantity
                    let total_value_partial = unit_value * row.quantity
                    row.total_taxes = row.total_value - total_value_partial
                    row.total_igv = total_value_partial * (row.percentage_igv / 100)
                    row.total_base_igv = total_value_partial
                    total_value -= row.total_value
                    total_igv_free += row.total_igv

                }

            });

            this.form.total_igv_free = _.round(total_igv_free, 2)
            this.form.total_exportation = _.round(total_exportation, 2)
            this.form.total_taxed = _.round(total_taxed, 2)
            this.form.total_exonerated = _.round(total_exonerated, 2)
            this.form.total_unaffected = _.round(total_unaffected, 2)
            this.form.total_free = _.round(total_free, 2)
            this.form.total_igv = _.round(total_igv, 2)
            this.form.total_value = _.round(total_value, 2)
            this.form.total_taxes = _.round(total_igv, 2)
            this.form.total = _.round(total, 2)
        },

        async validateQuantityLotsGroup() {

            let error_lots_group = 0

            await this.form.items.forEach((element) => {

                if (element.item.lots_enabled)
                {
                    if (!element.IdLoteSelected) error_lots_group++
                }

            });

            if(error_lots_group > 0)
            {
                return {
                    success: false,
                    message: 'Las cantidades y lotes seleccionados deben ser iguales.',
                }
            }

            return {success: true}
        },

        async submit() {

            if (this.form.date_of_issue > this.form.date_of_due)
                return this.$message.error('La fecha de emisión no puede ser posterior a la de vencimiento');

            if (this.form.date_of_issue > this.form.delivery_date)
                return this.$message.error('La fecha de emisión no puede ser posterior a la de entrega');


            if(this.is_generate_from_quotation)
            {
                const validate_items = await this.validateQuantityLotsGroup();
                if (!validate_items.success) return this.$message.error(validate_items.message)
            }

            this.loading_submit = true

            // await this.changePaymentMethodType(false)
            await this.$http.post(`/${this.resource}`, this.form).then(response => {
                if (response.data.success) {
                    this.resetForm();
                    this.orderNoteNewId = response.data.data.id;
                    this.showDialogOptions = true;
                } 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;
            });
        },
        close() {
            location.href = `/${this.resource}`
        },
        reloadDataCustomers(customer_id) {
            this.$http.get(`/${this.resource}/search/customer/${customer_id}`).then((response) => {
                this.customers = response.data.customers
                this.form.customer_id = customer_id
                this.setAddressByCustomer()
            })
        },
        setDescriptionOfItem(item){
            return showNamePdfOfDescription(item,this.config.show_pdf_name)
        },
        keyupCustomer() {

            if (this.input_person.number) {

                if (!isNaN(parseInt(this.input_person.number))) {

                    switch (this.input_person.number.length) {
                        case 8:
                            this.input_person.identity_document_type_id = '1'
                            this.showDialogNewPerson = true
                            break;

                        case 11:
                            this.input_person.identity_document_type_id = '6'
                            this.showDialogNewPerson = true
                            break;
                        default:
                            this.input_person.identity_document_type_id = '6'
                            this.showDialogNewPerson = true
                            break;
                    }
                }
            }
        },
        initInputPerson() {
            this.input_person = {
                number: null,
                identity_document_type_id: null
            }
        },
    },
    computed: {
        ...mapState([
            'config',
            'company',
            'establishment',
        ]),
        computedStablishment: function () {
            return this.config.establishment
        },
        computedLogo: function () {
            let picture = '';
            if (this.company.logo != null) {
                picture`/storage/uploads/logos/${this.company.logo}`
            }
            return picture
        }
    },
}
</script>
