@extends('layouts/default')
@section('title')
  Map CSV Columns
@parent
@stop
@section('commonbuttons')
<a type="button" class="btn btn-primary commonButtons" href="{{ route('getContactDetailList',array('seller_id'=>$seller_id)) }}" style="margin-left:5px;">{{config('app.tabLables')['seller_contacts']}}</a>
<a type="button" class="btn btn-primary commonButtons" href="{{ route('contact\contactus',array('seller_id'=>$seller_id)) }}" style="margin-left:5px;">{{config('app.tabLables')['contact_us']}}</a>
@stop
@section('content')
@include('notifications')
<div class="setting_page">
  <div class="d-inline-block w-100"> 
    <div class="ui-layout">       
      <div class="row">
        <div class="col-md-12">
          <div class="box box-default" style="height: 40%;">          
            <div class="wizard-container">
                <form method="post" name="frm_mapping" id="frm_mapping" action="{{route('fees_mapping',array('seller_id' => $seller_id))}}">
                    <div class="card wizard-card" data-color="blue" id="wizard">                                
                        <div class="tab-content">                
                            <div class="col-sm-12" style="margin-bottom: 20px;">
                                <strong>NOTE:</strong> Make sure your date column is in YYYY-mm-dd format and amount value column should have only number, not currency symbol.
                            </div>
                            <div class="tab-pane active" id="OS">
                                @if(isset($csvColumns) && !empty($csvColumns))    
                                    <input type="hidden" name="_token" value="{{ csrf_token() }}" />
                                    <input type="hidden" name="target_file" value="{{ $targetFile }}" />
                                    <div class="row">            
                                        <div class="col-sm-12 form-group">
                                            <div class="col-sm-2">
                                                <strong>Date:</strong><span class="text-red">*</span>
                                            </div>
                                            <div class="col-sm-4 form-group">
                                                <select class="form-control select2" name="csv_column_date" id="csv_column_date">
                                                    <option value="">Select ...</option>
                                                    @foreach($csvColumns as $key => $value)
                                                        <option value="{{$key}}">{{$value}}</option>
                                                    @endforeach
                                                </select>
                                                <div id="csv_date_error" class="text-red"></div>
                                            </div>
                                        </div>
                                        <div class="col-sm-12 form-group">
                                            <div class="col-sm-2">
                                                <strong>Description:</strong><span class="text-red">*</span>
                                            </div>
                                            <div class="col-sm-4 form-group">
                                                <select class="form-control select2" name="csv_column_desc" id="csv_column_desc">
                                                    <option value="">Select ...</option>
                                                    @foreach($csvColumns as $key => $value)
                                                        <option value="{{$key}}">{{$value}}</option>
                                                    @endforeach
                                                </select>
                                                <div id="csv_desc_error" class="text-red"></div>
                                            </div>
                                        </div>
                                        <div class="col-sm-12 form-group">
                                            <div class="col-sm-2">
                                                <strong>Price:</strong><span class="text-red">*</span>
                                            </div>
                                            <div class="col-sm-4 form-group">
                                                <select class="form-control select2" name="csv_column_price" id="csv_column_price">
                                                    <option value="">Select ...</option>
                                                    @foreach($csvColumns as $key => $value)
                                                        <option value="{{$key}}">{{$value}}</option>
                                                    @endforeach
                                                </select>
                                                <div id="csv_amount_error" class="text-red"></div>
                                            </div>
                                        </div>                        
                                    </div>                                    
                                @endif
                            </div>

                            <div class="col-sm-12 wizard-footer" style="position: absolute; bottom:20px;">
                                <div class="pull-right">                                    
                                    <button type="submit" class="btn btn-next btn-success btn-wd" id="preview_fees" name="preview_fees" style="width: 100px;     border-radius: 20px;">Next</button>        
                                </div>
                                <div class="pull-left">
                                    <a href="{{route('expenses',array('seller_id' => $seller_id))}}" name="cancel" class="btn btn-previous btn-warning btn-wd" style="width: 100px;     border-radius: 20px;">Previous</a>
                                </div>
                                <div class="clearfix"></div>
                            </div>                  
                        </div>                        
                    </div>
                </form>
            </div>            
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
@stop
@section('moar_scripts')    
<script type="text/javascript">
    $(document).on('click','#preview_fees',function(e){
        errorCnt = 0;
        date = $("#csv_column_date :selected").val();
        desc = $("#csv_column_desc :selected").val();
        price = $("#csv_column_price :selected").val();

        if(date == ''){
            $("#csv_date_error").html('Please select column for date.');
            errorCnt++;
        } else {
            $("#csv_date_error").html('');
        }

        if(desc == ''){
            $("#csv_desc_error").html('Please select column for description.');
            errorCnt++;
        } else {
            $("#csv_desc_error").html('');                
        }

        if(price == ''){
            $("#csv_amount_error").html('Please select column for amount.');
            errorCnt++;
        } else {
            $("#csv_amount_error").html('');
        }
        
        if(errorCnt > 0){
            e.preventDefault();
        }
    });
</script>
@stop