@extends('layouts.app')
@section('title') {{'Target Amount'}} @endsection

@section('content')
<script>
	function ShowFormDiv() {
		var x = document.getElementById("form");
		if (x.style.display === "none") {
			x.style.display = "block";
		} else {
			x.style.display = "none";
		}
	}
</script>
<style>

    table#myTable thead#myHeader{
        background: #D9E5D8;
        font-size: 16px !important;
    }
    div#myTablePrint table#myTable tbody tr td {
        font-size: 16px!important;
        border: 1px solid;
    }
</style>
@php
    $users_name = DB::table('users')->select('id','name')->orderBy('name','asc')->get();
            
@endphp 
<div class="col-md-12">
    <div class="panel panel-default">
        <div class="panel-heading">Target Amount
            <a href="{{ url('TargetAmount') }}" class="pull-right"> Back </a>
        </div>
        @if (session('success'))
            <div class="alert alert-success">
                {{ session('success') }}
            </div>
        @endif
        @if (session('error'))
            <div class="alert alert-danger">
                {{ session('error') }}
            </div>
        @endif
        <!-- Main content -->
        <div class="panel-body">
            <form action="" method="GET">
                <div class="col-lg-6">
                    <div class="form-group col-lg-6">
                        <label for="inputState">
                            <h4>Employee Name</h4>
                        </label>
                        <select id="emp_id" name="emp_id" class="form-control selectpicker" data-live-search="true">
                            <option value=""> Select... </option>
                            @if(isset($users_name))
                                @foreach($users_name as $val)
                                    <option value="{{ $val->id}}" @if(isset($_GET['emp_id']) && $_GET['emp_id'] == $val->id) selected="selected" @endif>  {{ $val->name }} </option>
                                @endforeach
                            @endif
                        </select>
                    </div>
                    <div class="form-group col-lg-6">
                        <label for="name">
                            <h4> &nbsp;</h4>
                        </label> <br />
                        <button type="submit" class="btn btn-success">Search</button>
                    </div>
                </div>
            </form>
            <!-- Small boxes (Stat box) -->
        <div class="col-lg-12 p-3">
            <button type="button" class="btn btn-primary" onclick="ShowFormDiv()" style="float:right;">+ Add New</button>
            <br>
            @php
            if (isset($data_set->id)) {                  
                $display = 'block';
            } else {
                $display = 'none';
            }      
            $currentYear = now()->year;
            $endYear = $currentYear + 5;
            $months = [
                    1 => 'January',
                    2 => 'February',
                    3 => 'March',
                    4 => 'April',
                    5 => 'May',
                    6 => 'June',
                    7 => 'July',
                    8 => 'August',
                    9 => 'September',
                    10 => 'October',
                    11 => 'November',
                    12 => 'December'
                ];
            $currentMonth = now()->month; // বর্তমান মাস
            @endphp
            
            <div id="form" style="display:{{ $display }}; margin-bottom:15px;">
                <form action="" method="post" enctype="multipart/form-data">
                    <div class="form-group">
                        <div class="col-md-1">
                            Year
                            <select name="year" class="form-control selectpicker" data-live-search="true" autofocus>
                                @for ($year = $currentYear; $year <= $endYear; $year++)
                                    <option value="{{ $year }}">{{ $year }}</option>
                                @endfor
                            </select>
                        </div>
                        <div class="col-md-1">
                            Month
                            <select name="month" class="form-control selectpicker" data-live-search="true" autofocus>
                                @foreach ($months as $num => $name)
                                    <option value="{{ $num }}" {{ $num == $currentMonth ? 'selected' : '' }}>
                                        {{ $name }}
                                    </option>
                                @endforeach
                            </select>
                        </div>
                        @php $rsm_list =  DB::table('users')->select('users.*')->where('user_types','=', 3 )->orderBy('id', 'ASC')->get();@endphp
                        <!-- RSM Name Dropdown -->
                        <div class="col-md-2">
                            NSM/RSM Name
                            <select name="rsm_id" id="rsm_id" class="form-control selectpicker" data-live-search="true" autofocus >
                                <option value=""> Select </option>
                                @if(isset($rsm_list))
                                    @foreach($rsm_list as $row)
                                        <option value="{{ $row->id }}"  @if(isset($data_set->rsm_id) && $data_set->rsm_id == $row->id) selected="selected" @endif >{{ $row->name }} </option>
                                    @endforeach
                                @endif
                            </select> 
                        </div>
                        <!-- SE Name Dropdown -->
                        <div class="col-md-2">
                            TSM/ASM Name
                            <select name="se_id" id="se_id" class="form-control selectpicker" data-live-search="true" >
                                <option value=""> Select </option>                                   
                                {{-- SE Name will be loaded dynamically --}}
                            </select> 
                        </div>
                        <div class="col-md-2">
                            SO Name
                            <select name="so_id" id="so_id" class="form-control selectpicker" data-live-search="true" autofocus >
                                <option value=""> Select </option>                              
                                {{-- SO Name will be loaded dynamically --}}
                            </select> 
                        </div>
                        <div class="col-md-2">
                            Target Amount
                            <input type="text" name="target_amount" id="target_amount" value="{{@$data_set->target_amount}}" class="form-control">
                        </div>
                        <div class="col-md-2"><br/> &nbsp;
                            {{ csrf_field() }}

                            @if(isset($data_set->id))
                            <input type="hidden" name="id" value="{{ $data_set->id }}">
                            <input type="submit" class="btn btn-primary" name="submit" value="Update">
                            @else
                            <input type="submit" class="btn btn-primary" name="submit" value="Submit">
                            @endif
                        </div>
                    </div>
                </form>
                <br/> &nbsp;
            </div>
            <br/> &nbsp;
            <div class="panel-body mt-5" id="myTablePrint">
                <div class="form-group mt-5" style="width:100%; overflow: scroll;" >
                    <table id="myTable" cellpadding="6" cellspacing="0" width="100%" class="table table-striped table-hover">
                        <thead class="header" id="myHeader">
                            <tr>
                                <th>#</th>
                                <th>Designation</th>
                                <th>Employee ID</th>
                                <th>Employee Name</th>
                                <th>Reporting Officer</th>
                                <th>User Type</th>
                                <th>Sub-Area Name</th>
                                <th>Distributor Name</th>
                                <th>Target Amount</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            @php $serial = 1; @endphp
                            @foreach($userTree as $user)
                                @include('components.target-row', ['user' => $user, 'serial' => &$serial])
                            @endforeach
                        </tbody>
                    </table>
                </div><!-- /.container-fluid -->
            </div>
        </div>
        <!-- /.content -->
    </div>
</div>
<script>
    $('#rsm_id').on('change', function () {
        var rsmId = $(this).val();

        if (rsmId) {
            $.ajax({
                url: "{{ url('/get-se-by-rsm') }}/" + rsmId,
                type: "GET",
                success: function (data) {
                    $('#se_id').empty();
                    $('#se_id').append('<option value="">Select</option>');
                    $.each(data, function (key, value) {
                        $('#se_id').append('<option value="'+ value.id +'">'+ value.name +'</option>');
                    });

                    $('.selectpicker').selectpicker('refresh'); // for bootstrap-select
                }
            });
        } else {
            $('#se_id').empty();
            $('#se_id').append('<option value="">Select</option>');
            $('.selectpicker').selectpicker('refresh');
        }
    });
    $('#se_id').on('change', function () {
        var seId = $(this).val();

        if (seId) {
            $.ajax({
                url: "{{ url('/get-so-by-se') }}/" + seId,
                type: "GET",
                success: function (data) {
                    $('#so_id').empty();
                    $('#so_id').append('<option value="">Select</option>');
                    $.each(data, function (key, value) {
                        $('#so_id').append('<option value="'+ value.id +'">'+ value.name +'</option>');
                    });

                    $('.selectpicker').selectpicker('refresh'); // for bootstrap-select
                }
            });
        } else {
            $('#so_id').empty();
            $('#so_id').append('<option value="">Select</option>');
            $('.selectpicker').selectpicker('refresh');
        }
    });
</script>

@endsection