@extends('layouts.app')
@section('style')
    <style>
        .v-select input[type=search], .v-select input[type=search]:focus {
            width: 50% !important;
        }
        .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
            padding: 8px;
            padding: 4px 2px;
        }
        .input-has-error {
            outline: 1px solid #ff0000 !important;
            background-color: #ff000014;
        }
    </style>
@stop
@section('content')
    <div class="row">
        <div class="portlet light bg-inverse" style="min-height: 100%;">
            <div class="portlet-title">
                <div class="caption">
                    <i class="icon-equalizer font-green-haze"></i>&nbsp;
                    <span class="caption-subject font-green-haze bold uppercase"> @lang('menu.ImportExcel') </span>
                    <!-- <span class="caption-helper">some info...</span> -->
                </div> 
                <div class="pull-right"></div>
            </div>
            <div class="row">
                <div class="col-lg-8">
                    <div class="tools text-center">
                        <a href="{{url('/')}}/import_file/simple_import_scale_excel_file.xlsx" style="text-decoration: none; color: black;"> --------
                           <button class="btn btn-success">
                           <i class="fa fa-download"></i>
                           @lang('layout.ImportExcelSample')
                           </button>
                        -------- </a> 
                    </div>
                    <!-- BEGIN FORM-->
                    {{Form::open(['route'=>'scaleImport.store','method'=>'POST','enctype'=>'multipart/form-data','class'=>'form-horizontal','id'=>'import-form'])}}
                        {{ csrf_field() }}
                        <div class="form-body">
                            <div class="col-md-12">
                                <div class="form-group" style="margin-top: 20px;">
                                    <label class="control-label col-md-5">@lang('layout.SelectFile') @lang('layout.Excel')
                                        :</label>
                                    <div class="col-md-7">
                                        {{Form::file('customer_file',null,['class' => 'form-control','placeholder' => __('layout.File')])}}
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12 col-sm-12 col-md-12 text-center" style="margin-top: 10px;">
                            <button type="submit" class="btn green">@lang('layout.Submit')</button>
                            <button type="reset" class="btn default"><i class="fa fa-mail-reply"></i> @lang('layout.Cancel')
                            </button>
                            <br/>
                            <br/>
                            <br/>
                            <br/>
                        </div>
                    {{Form::close()}}
                    <!-- end form -->
                </div>
                <div class="col-lg-4">
                    <ul class="text-danger">
                        <p class="text-danger">@lang('message.Info')</p>
                        <li class="text-danger">@lang('message.TipOne')</li>
                        <li class="text-danger">@lang('message.TipTwo')</li>
                        <li class="text-danger">@lang('message.TipThree')</li>
                    </ul>
                </div>
            </div>
            {{-- <div id="app" v-cloak>
                <h1 v-if="flag=='no'">@lang('layout.import_measure_msg')</h1>
                <div v-if="flag=='yes'" class="portlet-body form" style="margin-bottom:50%;">
                    <div v-if="record.length>0">
                        <div style="overflow-x:scroll; width: 100%">
                            {{Form::open(['route'=>'customerImport.store','method'=>'POST','class'=>'form-horizontal','enctype'=>'multipart/form-data','id'=>'import-form-second'])}}
                            {{csrf_field()}}
                            <div class="row">
                                <div class="col-md-12 col-md-12">
                                    <div class="col-md-12" style="height: 400px;">
                                        <table id="table_content" class="table table-bordered ">
                                            <thead>
                                                <tr>
                                                    <th class="text-center" style="width:20px;">#</th>
                                                    <th class="text-center" style="min-width: 90px;">
                                                        @lang('layout.Code')
                                                    </th>
                                                    <th class="text-center" style="min-width: 90px;">
                                                        @lang('layout.ReferenceNumber')
                                                    </th>
                                                    <th class="text-center" style="min-width: 230px;">
                                                        @lang('layout.FullName')
                                                    </th>
                                                    <th class="text-center" style="min-width: 230px;">
                                                        @lang('layout.FatherName')
                                                    </th>
                                                    <th class="text-center" style="min-width: 160px;">
                                                        @lang('layout.AccountsReceivable')
                                                    </th>
                                                    <th class="text-center" style="min-width: 160px;">
                                                        @lang('layout.AccountsPayable')
                                                    </th>
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.Gender')
                                                    </th>
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.Phone')
                                                    </th>
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.Class')
                                                    </th>
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.PriceLevel')
                                                    </th>
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.Address')
                                                    </th>
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.Description')
                                                    </th>
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.OpeningType')
                                                    </th>
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.Currency')
                                                    </th>
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.Rate')
                                                    </th>
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.Amount')
                                                    </th> 
                                                    @if(getUniversity() == 'true')
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.Faculty')
                                                    </th> 
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.YearIn')
                                                    </th>
                                                    @endif 
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.Description') 1
                                                    </th>
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.Description') 2
                                                    </th>
                                                    <th class="text-center" style="min-width: 130px;">
                                                        @lang('layout.Section')
                                                    </th>
                                                </tr>
                                            </thead>
                                                <tr v-for="(obj,index) in record">
                                                    <td class="td_one"><span class="badge badge3 badge-success badge-roundless">@{{index+1}} </span></td>
                                                    <td class="td_one">
                                                        <input type="number" class="form-control" :name="'code['+index+']'" v-model="obj.code">
                                                    </td>
                                                    <td class="td_one">
                                                        <input type="text" class="form-control" :name="'ref_no['+index+']'" v-model="obj.ref_no">
                                                    </td>
                                                    <td class="td_one">
                                                        <input type="text" class="form-control" :name="'name['+index+']'" v-model="obj.name">
                                                    </td>
                                                    <td class="td_one">
                                                        <input type="text" class="form-control" :name="'father_name['+index+']'" v-model="obj.father_name">
                                                    </td>
                                                    <td class="td_one">
                                                        <select class="form-control input-style" v-model="obj.receivable_id" required="required" :name="'receivable_id['+index+']'" >
                                                            <option value="">@lang('layout.Select')</option>
                                                            <option v-if="receivable_list" v-for="rec in (receivable_list?receivable_list:null)" :value="rec.id">
                                                                @{{rec.name}}
                                                            </option>
                                                        </select>
                                                    </td>
                                                    <td class="td_one">
                                                        <select class="form-control input-style" v-model="obj.payable_id" required="required" :name="'payable_id['+index+']'" >
                                                            <option value="">@lang('layout.Select')</option>
                                                            <option v-if="payable_list" v-for="pay in (payable_list?payable_list:null)" :value="pay.id">
                                                                @{{pay.name}}
                                                            </option>
                                                        </select>
                                                    </td>
                                                    <td class="td_one">
                                                        <div class="form-group">
                                                            <div class="col-md-12" >
                                                                <div style="border: 1px dotted ;">
                                                                    <label class="radio-inline">
                                                                        <input type="radio" :name="'gender['+index+']'" :checked="obj.gender == 'male'" value="male"> @lang('layout.Male') 
                                                                    </label>
                                                                    <label class="radio-inline">
                                                                        <input type="radio" :name="'gender['+index+']'" :checked="obj.gender == 'female'" value="female" > @lang('layout.Female') 
                                                                    </label>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </td>
                                                    <td class="td_one">
                                                        <input type="text" class="form-control" :name="'phone['+index+']'" v-model="obj.phone">
                                                    </td>
                                                    <td class="td_one">
                                                        <select class="form-control input-style" v-model="obj.class_id" :name="'class_id['+index+']'" >
                                                            <option value="">@lang('layout.Select')</option>
                                                            <option v-if="class_list" v-for="cla in (class_list?class_list:null)" :value="cla.id">
                                                                @{{cla.name}}
                                                            </option>
                                                        </select>
                                                    </td>
                                                    <td class="td_one">
                                                        <select class="form-control input-style" v-model="obj.price_level_id" :name="'price_level_id['+index+']'" >
                                                            <option value="">@lang('layout.Select')</option>
                                                            <option v-if="priceLevel_list" v-for="pri in (priceLevel_list?priceLevel_list:null)" :value="pri.id">
                                                                @{{pri.name}}
                                                            </option>
                                                        </select>
                                                    </td>
                                                    <td class="td_one">
                                                        <input type="text" class="form-control" :name="'address['+index+']'" v-model="obj.address">
                                                    </td>
                                                    <td class="td_one">
                                                        <input type="text" class="form-control" :name="'description['+index+']'" v-model="obj.description">
                                                    </td>
                                                    <td class="td_one">
                                                        <div class="form-group">
                                                            <div class="col-md-12" >
                                                                <div style="border: 1px dotted ;">
                                                                    <label class="radio-inline">
                                                                        <input type="radio" :name="'opening_type['+index+']'" :checked="obj.opening_type == 'receivable'" value="receivable"> @lang('layout.Receivable') 
                                                                    </label>
                                                                    <label class="radio-inline">
                                                                        <input type="radio" :name="'opening_type['+index+']'" :checked="obj.opening_type == 'payable'" value="payable" > @lang('layout.Payable') 
                                                                    </label>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </td>
                                                    <td class="td_one">
                                                        <v-select label="code" v-model="obj.currency" :options="currency_list"></v-select>
                                                        <input type="hidden" :name="'currency['+index+']'" :value="(obj.currency==null)?null:obj.currency.code">
                                                    </td>
                                                    <td class="td_one">
                                                        <input type="" step="any" class="form-control" :name="'rate['+index+']'" ref="rate" @input="setNewRate(index)" :value="(obj.currency)?(obj.currency.rate):1">
                                                    </td>
                                                    <td class="td_one">
                                                        <input type="number" step="any" class="form-control" :name="'amount['+index+']'" v-model="obj.amount">
                                                    </td>
                                                    @if(getUniversity() == 'true')
                                                        <td class="td_one">
                                                            <input type="text" class="form-control" :name="'faculty['+index+']'" v-model="obj.faculty">
                                                        </td>
                                                        <td class="td_one">
                                                            <input type="text" class="form-control" :name="'year_in['+index+']'" v-model="obj.year_in">
                                                        </td>
                                                    @endif
                                                    <td class="td_one">
                                                        <input type="text" class="form-control" :name="'description_one['+index+']'" v-model="obj.description_one">
                                                    </td>
                                                    <td class="td_one">
                                                        <input type="text" class="form-control" :name="'description_two['+index+']'" v-model="obj.description_two">
                                                    </td>
                                                    <td class="td_one">
                                                        <select class="form-control input-style" v-model="obj.section" :name="'section_id['+index+']'" >
                                                            <option value="">@lang('layout.Select')</option>
                                                            <option v-if="section_list" v-for="sect in (section_list?section_list:null)" :value="sect.id">
                                                                @{{sect.name}}
                                                            </option>
                                                        </select>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12 col-sm-12 col-md-12 text-center" style="margin-top: 10px;">
                            <button type="button" @click="sendFormData(this)" class="btn green">@lang('layout.Submit')</button>
                            <button type="reset" class="btn default"><i class="fa fa-mail-reply"></i> @lang('layout.Cancel')</button>
                        </div>
                        {{Form::close()}}
                    </div>
                </div>
            </div> --}}
        </div>
    </div>
@endsection
@push('scripts')
    <script>
        Vue.component('v-select', VueSelect.VueSelect);
    </script>
@endpush