@extends('layouts.layout')

@section('body_class', 'nav-md')

@section('css')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/css/bootstrap-datepicker.min.css" />
@endsection

@section('body_content')
<div class="container body">
    <div class="main_container">
        @include('includes.sidebar')
        <div class="right_col" role="main">
            <div class="page-title">
                <div class="title_left">
                    <h3>Point System</h3>
                </div>
                <div class="clearfix"></div>
            </div>

            <div class="row">
                <div class="col-xs-12">
                    <ol class="breadcrumb">
                        <li><a href="{{ url('/dashboard') }}">Home</a></li>
                        <li><a href="{{ url('/point_system/program_list') }}">Program List</a></li>
                        <li class="active">Create Program</li>
                    </ol>
                </div>

                <div class="col-xs-12">
                    <div class="x_panel">
                        <div class="x_title">
                            <h2>Create Program</h2>
                            <div class="clearfix"></div>
                        </div>
                        <div class="row">  
                            <div class="col-xs-12">           
                                <form id="form" class="form-horizontal" method="post"> 
                                    <input name="id_program" type="hidden" value="{{ $program->id }}">                       
                                    <div class="form-group" >
                                        <label class="col-xs-12 col-sm-2 control-label" style="text-align:left;">Nama Program :</label>
                                        <div class="col-xs-12 col-sm-3">
                                            <input readonly="readonly" type="text" name="name" class="form-control" value="{{ $program->name }}">
                                        </div>
                                    </div>
                                    <div class="form-group" >
                                        <label class="col-xs-12 col-sm-2 control-label" style="text-align:left;">Pilih Feature :</label>
                                        <div class="col-xs-12 col-sm-3">
                                            @if($program->id_schema_point_buy)
                                            <input type="hidden" name="type" class="form-control" value="purchase">
                                            <input readonly="readonly" type="text" class="form-control" value="Purchase">
                                            @elseif($program->id_schema_point_deposit)
                                            <input type="hidden" name="type" class="form-control" value="lakusimpan">
                                            <input readonly="readonly" type="text" class="form-control" value="Laku simpan">
                                            @elseif($program->id_schema_point_referral)
                                            <input type="hidden" name="type" class="form-control" value="referral">
                                            <input readonly="readonly" type="text" class="form-control" value="Referral">
                                            @endif
                                        </div>
                                    </div> 
                                    <div class="form-group" >
                                        <label class="col-xs-12 col-sm-2 control-label" style="text-align:left;">Pilih Tipe Skema :</label>
                                        <div class="col-xs-12 col-sm-3">
                                            @if($program->id_schema_point_buy)
                                            <input type="hidden" name="schema" class="form-control" value={{$program->id_schema_point_buy}}>
                                            <input readonly="readonly" type="text" class="form-control" value="{{$program->schema_purchase->name}}">
                                            @elseif($program->id_schema_point_deposit)
                                            <input type="hidden" name="schema" class="form-control" value={{$program->id_schema_point_deposit}}>
                                            <input readonly="readonly" type="text" class="form-control" value="{{$program->schema_lakusimpan->name}}">
                                            @elseif($program->id_schema_point_referral)                                           
                                            <input type="hidden" name="schema" class="form-control" value={{$program->id_schema_point_referral}}>
                                            <input readonly="readonly" type="text" class="form-control" value="{{$program->schema_referral->name}}">
                                            @endif
                                        </div>
                                    </div>           
                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-2 control-label" style="text-align:left;">Tanggal Mulai :</label>
                                        <div class="col-xs-12 col-sm-3">
                                            <input name="start_date" type="date" class="form-control bs-input-datepicker" placeholder="Date Start" required value="{{ $program->start_date }}">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-2 control-label" style="text-align:left;">Tanggal Selesai</label>
                                        <div class="col-xs-12 col-sm-3">
                                            <input name="end_date" type="date" class="form-control bs-input-datepicker" placeholder="Date End" required value="{{ $program['end_date'] }}">
                                        </div>
                                    </div>                       
                                    <div class="form-group" >
                                        <label class="col-xs-12 col-sm-2 control-label" style="text-align:left;">Status :</label>
                                        <div class="col-xs-12 col-sm-3">
                                            <select class="form-control input-status" name="status">
                                                <option value={{$program->status}}>{{$program->status}}</option>
                                                <option value="nonactive">nonactive</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group">                            
                                        <label class="col-xs-12 col-sm-2 control-label" style="text-align:left;"></label>
                                        <div class="col-xs-12 col-sm-3">        
                                            <button class="btn btn-primary btn-submit" style="width:100%;"> Save</button>
                                        </div>                            
                                    </div>                       
                                </form>  
                            </div>
                        </div>     
                    </div>
                </div>
            </div>
        </div>
        @include('includes.footer')
    </div>
</div>
@endsection


@section("scripts")
<script type="text/javascript">
    $(".btn-submit").click(function(e) {      
        e.preventDefault();
        var id = $("input[name=id_program]").val();
        var type = $("input[name=type]").val();
        var schema = $("input[name=schema]").val();
        var status = $(".input-status").val();
        var start_date = $("input[name=start_date]").val();
        var end_date = $("input[name=end_date]").val();
   
        $.ajax({
            url: "/point_system/program_list/"+id+"/save",
            method: "POST",            
            headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
            data: { 
                id: id,
                type: type,
                schema: schema,
                status: status,
                start_date: start_date,
                end_date: end_date,
            },
            success: function(response) {                
                alert(response.message);                
                location.href = '/point_system/program_list';
            },
            error: function(response) {
                var data = response.responseJSON;  
                alert(data.error);                        
            }
        });
        return false;
    })

    $("document").ready(function(){
        setTimeout(function(){
            $("#message").remove();
        }, 1500 ); 

});
</script>
@endsection