@extends('layouts.app')

@section('navigation')
    <a href="{{ route('patients.index') }}" class="breadcrumb-item"><i class="icon-stack mr-2"></i> Recetas medicas</a>
    <span class="breadcrumb-item active">Impresión de receta medica</span>
@endsection

@section('content')
    <div class="content" id="area">
        <div class="card">
            @if(session('success'))
                <div class="alert alert-success border-0 alert-dismissible">
                    <button type="button" class="close" data-dismiss="alert"><span>&times;</span></button>
                        <span class="font-weight-semibold">Mensaje :</span> {{session('success')}}
                </div>
            @Endif
            @if(session('errors'))
                <div class="alert alert-danger border-0 alert-dismissible">
                    <button type="button" class="close" data-dismiss="alert"><span>&times;</span></button>
                        <span class="font-weight-semibold">Cuidado:!</span>{{session('errors')}}
                </div>
            @Endif
            <div class="card-header">
                <h5 class="card-title" style="color:black; font-weight:bold;">RECETA MEDICA</h5>
                <hr style="height:2px; background-color:#01015F;"></hr>
            </div>
            <div class="card-body">
                <div class="row" >
                    <div class="form-group col-sm-1 m1">
                        <img src="/imgs/Logo_white.png" alt="" style="max-heigh:45px">
                    </div>
                    <div class="form-group col-sm-11 m11">
                        <p class="card-title" style="font-size: 30px; color:#684997; text-align: center; font-weight:bold;">CLÍNICA & OFTALMOLOGÍA</p>
                        <p class="card-title" style="font-size: 20px;color:black; text-align: center; font-weight:bold;">VETERINARIA</p>
                        <p class="card-title" style="color:black; text-align: center;">Consulta general, medicina preventiva, consulta oftalmológica, consulta dermatológica y cirugías.</p>
                    </div>
                    <div class="form-group col-sm-1"></div>
                    <div class="form-group col-sm-5">
                        <p class="card-title" style="color:#684997; text-align: center; font-weight:bold;">MVZ. SANDRA AILEEN CHAVEZ MORALES</p>
                        <p class="card-title" style="color:black; text-align: center; font-weight:bold;">UACJ</p>
                        <p class="card-title" style="color:black; text-align: center;">CED. PROF. 7543649</p>
                    </div>
                    <div class="form-group col-sm-5">
                        <p class="card-title" style="color:#684997; text-align: center; font-weight:bold;">MVZ HERIBERTO ORTEGA AVILA</p>
                        <p class="card-title" style="color:black; text-align: center; font-weight:bold;">UNAM</p>
                        <p class="card-title" style="color:black; text-align: center;">CED. PROF. 11042444</p>
                    </div>
                </div>
                <div class="row">
                    <div class="form-group col-sm-1"></div>
                    <div class="form-group col-sm-11 m11 l11">
                    <p class="card-title" style="color:black;font-weight:bold;color: black;
                       font-weight: bold;
                       border-bottom-color: #2b2b43;
                       border-bottom-style: solid;
                       border-bottom-width: 2.5px;">MEDICAMENTOS</p>
                      {!! $prescription->medicenes !!}
                    </div>
                </div>
                <div class="row">
                    <div class="form-group col-sm-1"></div>
                    <div class="form-group col-sm-11 m11 l11">
                    <p class="card-title" style="color:black;font-weight:bold;color: black;
                       font-weight: bold;
                       border-bottom-color: #2b2b43;
                       border-bottom-style: solid;
                       border-bottom-width: 2.5px;">OBSERVACIONES</p>
                      {!! $prescription->observations !!}
                    </div>
                </div>
                <div class="row">
                    <div class="form-group col-sm-1"></div>
                    <div class="form-group col-sm-4 m4 l4" style="margin-bottom: 50px;">
                    <p class="card-title" style="color:black;font-weight:bold;color: black;
                       font-weight: bold;">CONSULTADO POR:</p>
                      {!! $prescription->employee->firstName  . " " .  $prescription->employee->lastName !!}
                    </div>
                </div>
                <div class="row">
                    <div class="form-group col-sm-1"></div>
                    <div class="form-group col-sm-11 m11 l11" style = "border-top-style: solid;
                    border-top-width: 1px;
                    padding-top: 50px;
                    border-color: #ddd;">
                        <p class="card-title" style="color:#684997; text-align: center; font-weight:bold;">BLVD. LUIS ENCINAS No. 54 ENTRE ITURBIDE Y ZOILA REYNA DE PALAFOX</p>
                        <p class="card-title" style="color:black; text-align: center; font-weight:bold;">HERMOSILLO, SONORA C.P.83040</p>
                        <p class="card-title" style="color:black; text-align: center;">TEL. 662 213 7390 / CEL. 662 340 2891</p>
                    </div>
                </div>
                <div class="row">
                    <div class="form-group col-lg-12 col-3">
                        <hr style="height: 1px; background-color: #01015F;"></hr>
                            <div class="form-group col-12 col-lg-12" style="text-align:right;">
                                <a id="print"  style="color:white"
                                 class="btn btn-success btn-labeled btn-labeled-left"></b> Imprimir <b><i class="fa fa-save"></i></a>
                                <a href="{{ route('prescriptions.index') }}" style="background: #eee;"
                                class="btn btn-default btn-labeled btn-labeled-left"><b><i class="fa fa-reply"></i></b>Regresar</a>
                            </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div id="editor"></div>

@endsection


@section('scripts')
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.min.js"></script>

    <script>

        $( document ).ready(function() {
            window.print();  
        });
        $('#print').click(function () {
            window.print();  
        });

    </script>
@endsection