<template>
<div>
        <t-model v-if="showModal" title="Print properties" @close="showModal = false">
        <form >
            <div class="relative w-full mb-3">
                <label class="block uppercase text-blueGray-600 text-xs font-bold mb-2" for="grid-password"> Width (mm) </label>
                <input type="number" class="border-0 px-3 py-3 placeholder-blueGray-300 text-blueGray-600 bg-white rounded text-sm shadow focus:outline-none focus:ring w-full ease-linear transition-all duration-150" placeholder="80 mm" value="80">
            </div>
            <div class="relative w-full mb-3">
                <label class="block uppercase text-blueGray-600 text-xs font-bold mb-2" for="grid-password"> Number of prints </label>
                <input type="number" class="border-0 px-3 py-3 placeholder-blueGray-300 text-blueGray-600 bg-white rounded text-sm shadow focus:outline-none focus:ring w-full ease-linear transition-all duration-150" placeholder="5 barcode print" value="12">
            </div>
            <hr class="mt-6 border-b-1 mb-5 border-gray-300">
            <div class="relative w-full mb-3 text-right">
                <button @click="showModal = false" class="text-red-500 bg-transparent border border-solid border-red-500 hover:bg-red-500 hover:text-white active:bg-red-600 font-bold uppercase text-xs px-4 py-2 rounded outline-none focus:outline-none mr-1 mb-1 ease-linear transition-all duration-150" type="submit">
                    Cancel
                </button>
                <button class="bg-blue-500 text-white active:bg-blue-600 font-bold uppercase text-xs px-4 py-2 rounded shadow hover:shadow-md outline-none focus:outline-none mr-1 mb-1 ease-linear transition-all duration-150" type="button">
                    Print
                </button>
            </div>
        </form>
    </t-model>
</div>

</template>


<script>
    import TModel from "@/components/Alert/Model.vue";

    export default {
        components:{
            TModel
        },

        props:['showModal'],

        data(){
            return{

            }
        },

        mounted(){
            console.log(this.showModal);
            console.log('fg');
        },

        methods:{
             print () {
                this.$htmlToPaper('barcodes');
            }
        }

    }
</script>
