@extends('layouts.layout')
@section('body_class', 'nav-md')
@section('css')
<style>
    ul {margin:0;}

    .box_custom {
        box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    }

    .one-line{
        display:flex;
    }
</style>
@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>Subscription - Price Config</h3>
                </div>
                <div class="clearfix"></div>
            </div>

            <div class="container box_custom" style="border:1px solid #c3bdc0;border-radius:5px;">
                <div class="row">  
                    <div class="col-xs-12" style="padding:10px;"> 
                        <div style="padding:5px 20px;margin-bottom:10px;">
                            <h3>Price Configuration</h3>
                        </div>
                        <form id="form" class="form-horizontal">                        
                            <div class="form-group">
                                <label class="col-xs-12 col-sm-2 control-label">1 month subs (in gramation) :</label>
                                <div class="col-xs-12 col-sm-3">
                                    <input type="text" name="one_month_gram" class="form-control" style="margin:3px;" placeholder="gram.." value="{{$settings[0]->weight}}"> 
                                </div>
                                <label class="col-xs-12 col-sm-2 control-label">Discount (%) :</label>
                                <div class="col-xs-12 col-sm-3">
                                    <input type="text" name="one_month_discount" class="form-control" style="margin:3px;" placeholder="percent" value="{{$settings[0]->discount_percentage}}">
                                </div>
                                <label class="col-xs-12 col-sm-1 control-label">enable?</label>
                                <label class="col-xs-12 col-sm-1 control-label"><input class="text-center" type="checkbox" class="custom-control-input" name="one_month_isdiscounted" @if($settings[0]->isdiscounted==1) checked @endif ></label>
                            </div>

                            <div class="form-group">
                                <label class="col-xs-12 col-sm-2 control-label">6 month subs (in gramation) :</label>
                                <div class="col-xs-12 col-sm-3">
                                    <input type="text" name="six_month_gram" class="form-control" style="margin:3px;" placeholder="gram.." value="{{$settings[1]->weight}}">
                                </div>
                                <label class="col-xs-12 col-sm-2 control-label">Discount (%) :</label>
                                <div class="col-xs-12 col-sm-3">
                                    <input type="text" name="six_month_discount" class="form-control" style="margin:3px;" placeholder="percent" value="{{$settings[1]->discount_percentage}}">
                                </div>
                                <label class="col-xs-12 col-sm-1 control-label">enable?</label>
                                <label class="col-xs-12 col-sm-1 control-label"><input class="text-center" type="checkbox" class="custom-control-input" name="six_month_isdiscounted" @if($settings[1]->isdiscounted==1) checked @endif ></label>
                            </div>

                            <div class="form-group" >
                                <label class="col-xs-12 col-sm-2 control-label">12 month subs (in gramation) :</label>
                                <div class="col-xs-12 col-sm-3">
                                    <input type="text" name="twelve_month_gram" class="form-control" style="margin:3px;" placeholder="gram.." value="{{$settings[2]->weight}}">
                                </div>
                                <label class="col-xs-12 col-sm-2 control-label">Discount (%) :</label>
                                <div class="col-xs-12 col-sm-3">
                                    <input type="text" name="twelve_month_discount" class="form-control" style="margin:3px;" placeholder="percent" value="{{$settings[2]->discount_percentage}}">
                                </div>                               
                                <label class="col-xs-12 col-sm-1 control-label">enable?</label>
                                <label class="col-xs-12 col-sm-1 control-label"><input class="text-center" type="checkbox" class="custom-control-input" name="twelve_month_isdiscounted" @if($settings[2]->isdiscounted==1) checked @endif ></label>
                            </div>

                            <div class="form-group" >
                                <label class="col-xs-12 col-sm-2 control-label">Referral bonus (Rp) :</label>
                                <div class="col-xs-12 col-sm-4">
                                    <input id="bonus" type="text" name="bonus" class="form-control" style="margin:3px;" value="{{$bonus_referral_elite_per_month->value}}">
                                </div>
                            </div>

                            <div class="form-group" >
                                <label class="col-xs-12 col-sm-2 control-label">Selisih harga emas :</label>
                                <div class="col-xs-12 col-sm-2">
                                    <select id="discount" name="discount" class="form-control" style="margin:3px;" onchange="changeVal()"> 
                                        @if($type->value=='jumlah')
                                        <option selected value="jumlah">Jumlah</option>
                                        <option value="persentase">Persentase</option>
                                        @else
                                        <option value="jumlah">Jumlah</option>
                                        <option selected value="persentase">Persentase</option>                                       
                                         @endif
                                    </select>
                                </div>
                                <div class="col-xs-12 col-sm-2">
                                    <input id="discount_amount" type="text" name="discount_amount" class="form-control" style="margin:3px;" 
                                    @if($type->value=='jumlah')
                                    value="{{$selisih_harga_setting->value}}"
                                    @else
                                    value="{{$selisih_persentase_setting->value}}"
                                    @endif
                                    >
                                </div>
                            </div>

                            <div class="form-group" >
                                <label class="col-xs-12 col-sm-2 control-label">Selisih harga redeem :</label>
                                <div class="col-xs-12 col-sm-2">
                                    <select id="discount_redeem" name="discount_redeem" class="form-control" style="margin:3px;" onchange="changeValRed()"> 
                                        @if($type_redeem->value=='jumlah')
                                        <option selected value="jumlah">Jumlah</option>
                                        <option value="persentase">Persentase</option>
                                        @else
                                        <option value="jumlah">Jumlah</option>
                                        <option selected value="persentase">Persentase</option>                                       
                                         @endif
                                    </select>
                                </div>
                                <div class="col-xs-12 col-sm-2">
                                    <input id="discount_redeem_amount" type="text" name="discount_redeem_amount" class="form-control" style="margin:3px;" 
                                    @if($type_redeem->value=='jumlah')
                                    value="{{$selisih_harga_redeem_voucher_elite->value}}"
                                    @else
                                    value="{{$selisih_persentase_redeem_voucher_elite->value}}"
                                    @endif
                                    >
                                </div>
                            </div>
                            

                            <div class="form-group row">
                                <label for="" class="col-xs-12 col-sm-2 col-form-label text-right"></label>
                                <div class="col-xs-12 col-sm-2">
                                    <button type="submit" class="btn btn-primary">
                                        <span><i class="fa fa fa-spinner fa-spin loading hidden" aria-hidden="true"></i></span>
                                        <span class="submit">Save</span> 
                                    </button>
                                </div>
                            </div>                  
                        </form>  
                    </div>
                </div>
            </div>

            {{-- <div class="col-xs-12 box_custom" style="margin-top:10px;border-radius:5px;">
                <div class="x_panel">
                    <div class="x_title">
                        <h2>Price Setting List</h2>
                        <div class="clearfix"></div>
                    </div>
                    <div>
                        <h5 style="padding-left:5px;">Selisih Jumlah Setting : Rp. {{ $selisih_harga_setting->value}}</h5>
                        <h5 style="padding-left:5px;">Selisih Persentase Setting : {{ $selisih_persentase_setting->value}} %</h5>
                    </div>
                    <div class="x_content">
                        <table class="table table-bordered table-striped">
                            <thead>
                                <tr>
                                    <th class="text-center">ID</th>
                                    <th class="text-center">Month At</th>
                                    <th class="text-center">Weight</th>
                                    <th class="text-center">Enable/Disable</th>
                                </tr>
                            </thead>
                            <tbody>
                                @if(is_array($settings) || is_object($settings))
                                    @forelse($settings as $list)
                                        <tr>                                                
                                            <td class="text-center">{{ $list->id }}</td>
                                            <td class="text-center">{{ $list->month }}</td>
                                            <td class="text-center">{{ $list->weight }}</td>  
                                            @if($list->id == 1)
                                                @if($list->isactive == 1) 
                                                    <td class="text-center">Active</td> 
                                                @else
                                                    <td class="text-center">Inactive</td> 
                                                @endif                                           
                                            @endif
                                            @if($list->id != 1)  
                                                @if($list->isactive == 0) 
                                                    <td class="text-center"><button class="btn btn-primary enable_disable" onclick="myFunction(this.value)" value="{{ $list->id }}">Enable</button> </td>          
                                                @else
                                                    <td class="text-center"><button class="btn btn-primary enable_disable" onclick="myFunction(this.value)" value="{{ $list->id }}">Disable</button> </td>        
                                                @endif
                                            @endif
                                        </tr>
                                    @empty
                                        <tr>
                                            <td class="text-center" colspan="6">No Data</td>
                                        </tr>
                                    @endforelse
                                @endif
                            </tbody>
                        </table>
                    </div>
                </div>
            </div> --}}
        </div>
        @include('includes.footer')
    </div>
</div>
@endsection

@section("scripts")
<script type="text/javascript">
    var selisih_harga_setting = {!! json_encode($selisih_harga_setting->value) !!};
    var selisih_persentase_setting = {!! json_encode($selisih_persentase_setting->value) !!};
    var selisih_harga_redeem_voucher_elite = {!! json_encode($selisih_harga_redeem_voucher_elite->value) !!};
    var selisih_persentase_redeem_voucher_elite = {!! json_encode($selisih_persentase_redeem_voucher_elite->value) !!};
    $("#form").on("submit", function() {
        $("#form").find('.loading').removeClass('hidden');
        $("#form").find('.submit').addClass('hidden');
        $.ajax({
            url: '/lakuemas_elite_subscription/price_config',
            method: "POST",            
            headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
            data: $("#form").serialize(),
            success: function(response) {
                alert("Data saved");
                $("#form").find('.loading').addClass('hidden');
                $("#form").find('.submit').removeClass('hidden');
                setTimeout(function(){
                    window.location.reload(); 
                }, 1000); 
            },
            error: function(response) {
                var data = response.responseJSON;
                alert(data.error);
                $("#form").find('.loading').addClass('hidden');
                $("#form").find('.submit').removeClass('hidden');
            }
        });
        return false;
    });
    
    function changeVal() {
        if($("#discount").val()=="jumlah"){
            $("#discount_amount").val(selisih_harga_setting);
        }else{
            $("#discount_amount").val(selisih_persentase_setting);
        }
    }

    function changeValRed() {
        if($("#discount_redeem").val()=="jumlah"){
            $("#discount_redeem_amount").val(selisih_harga_redeem_voucher_elite);
        }else{
            $("#discount_redeem_amount").val(selisih_persentase_redeem_voucher_elite);
        }
    }

    function myFunction(val) {
        var id = val;
        $.ajax({
            url: '/lakuemas_elite_subscription/enable_disable',
            method: "POST",            
            headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
            data: { id : id },
            success: function(response) {
                alert(response.success);
                setTimeout(function(){
                    window.location.reload(); 
                }, 1000); 
            },
            error: function(response) {
                var data = response.responseJSON;
                alert(data.error);
            }
        });
        return false;
    };
</script>
@endsection