@extends('layouts.dashboard')
@section('content') 
    <div class="container">    
        <div class="contentbox">
            <div class="contentboxheading"><i class="las la-user-tie"></i><span id="formStatus">Add New User</span>
            <a class="btn btn-primary pull-right mt-2 mr10 btn-form-toggle"><span>Show</span> Form</a>              
            </div>
            <div class="contentboxinner">
                @if (session('success'))
                    <div class="alert alert-success">
                        {{ session('success') }} 
                    </div>   
                @endif 
                <div class="form-container fhide">
                    <form class="row g-3" id="saveuser">
                        @csrf
                        <input type="hidden"  name="hdn_user_id" id="hdn_userId" readonly>  
                        <div class="alert alert-danger errorMsgUpdt" style="display:none;"></div>
                        
                        @if($authUser['usertype']==1)
                        <div class="row mt-3" style="display:none;" id="div_userType"> 
                            <div class="col-3">
                                <label for="usertype" class="form-label ml10">User Type<span style="color:red">*</span></label>
                                <select class="selectpicker" name="usertype" id="ddl_userType">
                                    <option value="0">Select User Type</option>
                                    @foreach($userType as $userTyp)
                                        <option value="{{ $userTyp->userType_Id }}">{{ $userTyp->user_type }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="row mt-3" id="div_entity" style="display:none;"> 
                            <div class="col-3" >
                                <label for="entity" class="form-label ml10">Agency<span style="color:red">*</span></label>
                                <select class="selectpicker" name="entity" id="ddl_entity">
                                    <option value="0">Select Agency</option>
                                    @foreach($entity as $key=>$val)
                                        <option value="{{ $key }}">{{ $val }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>    
                        @endif
                        @if($authUser['usertype']==2)
                        <div class="row mt-3" style="display:none;" id="div_userType"> 
                            <div class="col-3">
                                <label for="usertype" class="form-label ml10">User Type<span style="color:red">*</span></label>
                                <select class="selectpicker" name="usertype" id="ddl_userType">
                                    <option value="0">Select User Type</option>
                                    @foreach($userType as $userTyp)
                                        @if($userTyp->userType_Id!=1)
                                        <option value="{{$userTyp->userType_Id}}">{{ $userTyp->user_type }}</option>
                                        @endif
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        @endif
                        <div class="row mt-3" id="div_AllInputField" style="display:none;">
                            <div class="col-md-3">
                                <label for="fname" class="form-label ml10">First Name<span style="color:red">*</span></label>
                                <input type="text" class="form-control" id="txt_fnameusername" name="fname" placeholder=" First name">
                            </div>   

                            <div class="col-md-3">
                                <label for="lname" class="form-label ml10">Last Name<span style="color:red">*</span></label>
                                <input type="text" class="form-control" id="txt_lname" name="lname" placeholder="Last Name">
                            </div>
                        
                            <div class="col-md-3">
                                <label for="email" class="form-label ml10"> User Email<span style="color:red">*</span></label>
                                <input type="email" class="form-control" id="txt_email" name="email" placeholder="example@example.xom">
                            </div>               
                            
                            <div class="col-md-3">
                                <label for="status" class="form-label ml10">Status<span style="color:red">*</span></label>
                                <select id="inputState" class="selectpicker" id="ddl_status" name="status">
                                    <option value="1" selected>Active</option>
                                    <option value="0">Inactive</option>
                                </select>
                            </div>  
                        </div> 

                        <div class="text-center mt-3">
                            <button type="button" class="btn btn-primary mt-4 mb-4" id="btn_adduser">Submit</button>
                            <button type="button" class="btn btn-primary ml-2 mt-4 mb-4" type="button" onclick="Javascript:window.location.reload()">Reset</button>                                    
                        </div>
                    </form>            
                </div>
                <div class="row">
                    <div class="col-md-12">
                    <div class="subheading mt-2">Existing Users Details</div>
                        <div class=" mt-3 mb-3">
                            <table class="table table-striped" id="tbl_adduser">
                                <thead>
                                    <tr>
                                        <th>Action</th>
                                        <th>User Type</th>
                                        <th>Agency</th>
                                        <th>Name</th>
                                        <th>UserName</th>
                                        <th>Email</th>
                                        <th>Status</th>
                                        <th>Created By</th>
                                        <th>Created Date</th>
                                    </tr>
                                </thead>
                                <tbody id="ajaxData">@include('user.addUser_ajax')</tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('footer_scripts')
<script>
$(document).ready(function () {
    if($('#ddl_userType').length<=0){
        $('#div_AllInputField').show();
    }else{
        $('#div_AllInputField').hide();
        $('#div_entity').hide();
        $('#div_userType').show();
    }
    $('#ddl_userType').change(function () {
        var userType_id = $('#ddl_userType').val();
        if(userType_id == 0){
            return;
        }else if(userType_id == 2 || userType_id == 3){
            $('#div_entity').fadeIn(1000);
            $('#div_AllInputField').fadeIn(1000);
        }else{
            $('#div_AllInputField').fadeIn(1000);
            $('#div_entity').fadeOut(1000);                
        }
    });
    $(document).on('click', '.loggedinasUser', function (){
        let id = $(this).data('id');
        $.ajax({
            type: 'POST',
            dataType: 'json',
            data: {_token:_token,refId:id},
            url: APP_URL+"/loggedin-as-user",
            success: function(res) {
                if(res.status){
                    window.location.href = APP_URL+'/home';
                }            
            },
            error: function(data) {  
            ajax_error2(data);
            }
        });
    })
});
</script>
@endsection