@extends('layouts.pharmacist')

@section('title')
Add New Drug to Stock
@endsection

@section('body')

<!-- Titlebar -->
<div id="titlebar">
    <div class="row">
        <div class="col-md-12">
            <h2>Stock</h2> <span>Add New Drug to Stock</span>
            <!-- Breadcrumbs -->
            <nav id="breadcrumbs">
                <ul>
                    <li><a href="{{ url('pharmacist') }}">Home</a></li>
                    <li>Add New Drug</li>
                </ul>
            </nav>
        </div>
    </div>
</div>

<div class="container-fluid margin-top-50 margin-bottom-80">
    <!-- Section -->
    <div class="add-listing-section">

        <!-- Headline -->
        <div class="add-listing-headline">
            <h3><i class="sl sl-icon-doc"></i> Drug Information</h3>
        </div>

        {{-- Existing Drugs --}}
        <div class="row with-forms">
            <div class="col-md-12">
                <h5>Drugs Repository</h5>
                <select id="existingDrugs" class="form-control">
                    <option value="">Choose from Existing Drugs</option>
                    @foreach ($existingDrugs as $drug)
                        <option data-name="{{ $drug->name }}" data-price="{{ $drug->price }}"
                            data-description="{!! $drug->description !!}">{{ $drug->name }}</option>
                    @endforeach
                </select>
            </div>
        </div>

        <!-- Add New Drug Form -->
        <form action="{{ url('pharmacist/stock/new') }}" method="post" enctype="multipart/form-data">
            {{ csrf_field() }}

            <!-- Drug Name -->
            <div class="row with-forms">
                <div class="col-md-12{{ $errors->has('drug_name') ? ' has-error' : '' }}">
                    <h5>Drug Name <span class="text-danger" style="font-size: 24px">*</span></h5>
                    <input type="text" name="drug_name" id="drugName" placeholder="Name of Drug" class="form-control" value="{{ old('drug_name') }}">
                </div>
                @if ($errors->has('drug_name'))
                    <span class="help-block">
                        <strong>{{ $errors->first('drug_name') }}</strong>
                    </span>
                @endif
            </div>

            <!-- Drug Brand -->
            <div class="row with-forms">
                <div class="col-md-12{{ $errors->has('drug_brand') ? ' has-error' : '' }}">
                    <h5>Drug Brand <span class="text-danger" style="font-size: 24px">*</span></h5>
                    <input type="text" name="drug_brand" id="drugBrand" placeholder="Brand of Drug" class="form-control" value="{{ old('drug_brand') }}">
                </div>
                @if ($errors->has('drug_brand'))
                    <span class="help-block">
                        <strong>{{ $errors->first('drug_brand') }}</strong>
                    </span>
                @endif
            </div>

            <!-- Image -->
            <div class="row with-forms">
                <div class="col-md-6">
                    <h5 class="margin-bottom-80">Image <span class="text-danger" style="font-size: 24px">*</span></h5>
                    <div class="change-photo-btn button">
                        <div class="photoUpload">
                            <span><i class="fa fa-camera"></i> Upload Photo</span>
                            <input type="file" class="upload" name="drug_image" accept="image/*">
                        </div>
                    </div>
                    @if ($errors->has('drug_image'))
                        <span class="help-block">
                            <strong>{{ $errors->first('drug_image') }}</strong>
                        </span>
                    @endif
                </div>
                <div class="col-md-6">
                    <h5>Category <span class="text-danger" style="font-size:24px">*</span></h5>
                    <select name="drug_category" class="form-control">
                        <option value="">Choose Category</option>
                        @foreach ($categories as $category)
                            <option value="{{ $category->id }}">{{ $category->name }}</option>
                        @endforeach
                    </select>
                </div>
            </div>

            <!-- Row -->
            <div class="row with-forms margin-top-30">

                <!-- Quantity -->
                <div class="col-md-6 col-sm-6{{ $errors->has('drug_quantity') ? ' has-error' : '' }}">
                    <h5>Quantity <span class="text-danger" style="font-size: 24px">*</span></h5>
                    <input type="number" min="1" name="drug_quantity" placeholder="Quantity of Drug" class="form-control" value="{{ old('drug_quantity') }}">
                    @if ($errors->has('drug_quantity'))
                        <span class="help-block">
                            <strong>{{ $errors->first('drug_quantity') }}</strong>
                        </span>
                    @endif
                </div>

                <!-- Price -->
                <div class="col-md-6 col-sm-6{{ $errors->has('drug_price') ? ' has-error' : '' }}">

                    <h5>Price (N) <span class="text-danger" style="font-size: 24px">*</span></h5>
                    <input type="text" name="drug_price" id="drugPrice" placeholder="Price of Drug" class="form-control" value="{{ old('drug_price') }}">
                    @if ($errors->has('drug_name'))
                        <span class="help-block">
                            <strong>{{ $errors->first('drug_quantity') }}</strong>
                        </span>
                    @endif
                </div>

            </div>
            <!-- Row / End -->

            <!-- Row -->
            <div class="row with-forms">
                <div class="col-md-12 col-sm-12">
                    <h5>Description</h5>
                    <textarea name="product_description" id="drugDescription" placeholder="Product Description" rows="5"></textarea>
                </div>
            </div>
            <!-- /Row -->

            <!-- Row -->
            <div class="row with-forms margin-bottom-10 margin-top-30">
                <div class="col-md-offset-9 col-md-3">
                    <button type="submit" class="button fullwidth progress-button">Add Drug</button>
                </div>
            </div>

        </form>

    </div>
    <!-- Section / End -->
</div>

@include('partials.copyrights')

<script>
    $('#pharmacyStock').addClass('active');

    tinymce.init({
        selector: 'textarea',
        plugins : 'advlist autolink link image wordcount lists charmap print preview'
    });

    $('#existingDrugs').on('change', function(){
        var name = $(this).find(':selected').data('name');
        var price = $(this).find(':selected').data('price');
        var description = $(this).find(':selected').data('description');

        $('#drugName').val(name);
        $('#drugPrice').val(price);
        tinymce.get('drugDescription').setContent(description);
    });
</script>

@endsection