@extends('admin.layout.master')
@section('title', 'Party User Management')
@section('custom_css')
<style>
</style>
@endsection
@section('content')
    <div class="card sina-card mt-0 mb-1">
        <div class="card-header card-header-s">
            <div class="d-flex justify-content-between">
                <h5 class="mb-0">{{ __('obs.party_user_management') }}</h5>
                @if(checkAuthPermission('admin.party.party_user.create'))
                    <button class="btn btn-light" onclick="addNewDrawer2()">{{ __('obs.add_new') }}</button>
                @endif
            </div>
        </div>
        <div class="card-body">
            <div class="row g-2">
                <div class="col-3 pe-1">
                    <div class="form-group">
                        <label for="">{{ __('obs.party') }}</label>
                        @include('v2.inventory.global.party_live_dd', [
                            'type' => 2,
                            'binder'=> 'invoice.party_id',
                            'cls' => 'p',
                            // 'event' => 'onchange=setPartyDetails()',
                            'skip_add_new' => 1,
                            'id' => 'filter_party_id',
                            'allow_clear'=> true
                        ])
                    </div>
                </div>
                <div class="col-2 pe-1">
                    <label for="">User Name</label>
                    <input type="text" class="form-control" name="filter_user_name" id="filter_user_name" placeholder="Enter User Name">
                </div>
                <div class="col-2 pe-1">
                    <label for="">Name  </label>
                    <input type="text" class="form-control" name="filter_name" id="filter_name" placeholder="Enter Name">
                </div>
                <div class="col-2 pe-1">
                    <label for="">Mobile</label>
                    <input type="text" class="form-control" name="filter_mobile" id="filter_mobile" placeholder="Enter Mobile">
                </div>
                <div class="col-1">
                    <label for="">&nbsp;</label>
                    <button class="btn btn-sm btn-primary d-block" onclick="loadData()">{{ __('obs.filter') }}</button>
                </div>
            </div>
        </div>
    </div>
    <div class="row mt-2">
        <div class="col-12">
            <div class="card">
                <div class="commonListBody card-body" style="min-height: 100px" id="loaded_info">
    
                </div>
            </div>
        </div>
        <div class="commonListPaginate">

        </div>
    </div>
    <div class="insert_drawer_full_page" tabindex="-1" onclick="closeDrawer()">
        <div class="insert_drawer" onclick="dontHideAddNewDrawer(event)">
            <div class="row d-flex justify-content-center">
                <div class="col-12">
                    <style>
                        .form-group{
                            margin-bottom: 0;
                        }
                    </style>
                    <form action="{{ route('admin.party.party_user.store') }}" class="form_submit">
                        <input type="hidden" name="row_id" id="row_id">
                        <div class="party_user_form">
                            <div class="row">
                                <div class="col-12 px-1">
                                    <div class="form-group">
                                        <label for="">{{ __('obs.party') }}<span class="required">*</span></label>
                                        @include('v2.inventory.global.party_live_dd', [
                                            'type' => 2,
                                            'binder'=> 'invoice.party_id',
                                            'cls' => 'p',
                                            // 'event' => 'onchange=setPartyDetails()',
                                            'skip_add_new' => 1,
                                            'allow_clear'=> true
                                        ])
                                    </div>
                                </div>
                                <div class="col-6 px-1">
                                    <label for="">User Name 
                                        <span>
                                            <i class="fas fa-info-circle" title="Will use for login"></i>
                                        </span> 
                                        <span class="required">*</span> </label>
                                    <input type="text" class="form-control" name="user_name" id="user_name" placeholder="Enter User Name">
                                </div>
                                <div class="col-6 px-1" id="password_div">
                                    <label for="">Password <span class="required">*</span> </label>
                                    <input type="password" class="form-control" name="password" id="password" placeholder="Enter Password">
                                </div>
                                <div class="col-6 px-1">
                                    <label for="">Name <span class="required">*</span> </label>
                                    <input type="text" class="form-control" name="name" id="name" placeholder="Enter Name">
                                </div>
                                <div class="col-6 px-1">
                                    <label for="">Mobile</label>
                                    <input type="text" class="form-control" name="mobile" id="mobile" placeholder="Enter Mobile">
                                </div>
                                <div class="col-6 px-1">
                                    <label for="">Status</label>
                                    <select name="status" id="status" class="form-control">
                                        <option value="1">Active</option>
                                        <option value="2">Inactive</option>
                                    </select>
                                </div>
                                <div class="col-12">
                                    <label for="">Roles</label>
                                    <select name="roles[]" id="roles" class="form-control select_2" multiple>
                                        @foreach ($roles as $r)
                                            <option value="{{ $r->id }}">{{ $r->name }}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="form-group mt-2">
                            <button class="btn btn-sm btn-success">{{ __('obs.save') }}</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    @include('admin.layout.common_form_submit_js')
@endsection


@section('script')
    <script type="text/javascript" src="{{ asset('inventory/blade_js/common.js') }}"></script>
    <script>
        let invoice = []; // Dummy variable: Do not remove this line
        const store_setting = @json(store_info());
        const warehouse_setting = @json(warehouse_info());
        let ajaxUrl = "{{ route('admin.party.party_user.index') }}";
        let ajaxData = {};
        $(document).ready(function(){
            
        });
        function addNewDrawer2(){
            $('#row_id').val('');
            $('#status').val(1);
            $('.party_user_form').show();
            $('#password_div').show();
            openDrawer();
        }
        function editUser(id){
            getLoadingStatus();
            customAjaxCall(function(res){
                openDrawer();
                let role_ids = res.info.roles.length > 0? res.info.roles.map(r => r.id) : [];
                $('#party_id').html(`<option value="${res.info.party_id}">${res.info.party.name_eng}</option>`);
                $('#user_name').val(res.info.user_name);
                $('#name').val(res.info.name);
                $('#mobile').val(res.info.mobile);
                $('#roles').val(role_ids).trigger('change');
                $('#row_id').val(res.info.id);
                $('#status').val(res.info.status);
                $('#password_div').hide();
                $('.party_user_form').show();
                closeSweetAlert();
            }, 'get', "{{ route('admin.party.party_user.edit') }}", {id});
        }
        function loadData(){
            closeDrawer();
            getLoadingStatus();
            let party_id = $('#filter_party_id').val();
            let user_name = $('#filter_user_name').val();
            let name = $('#filter_name').val();
            let mobile = $('#filter_mobile').val();
            ajaxData = { party_id, user_name, name, mobile };
            customAjaxCall(function(res){
                $('.commonListBody').html(res.html);
                // $('.commonListPaginate').html(res.paginate);
                closeSweetAlert();
            }, 'GET', ajaxUrl, ajaxData)
        }
        function resetPassword(id){
            // Swal input will show up
            Swal.fire({
                title: 'Are you sure?',
                text: "You want to reset password for this user!",
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Yes, reset it!'
            }).then((result) => {
                if (result.isConfirmed) {
                    getLoadingStatus();
                    customAjaxCall(function(res){
                        customSweetAlert(function(res){
                            closeSweetAlert();
                        }, 'success', 'Password Reset Successfully', html = 'New Password: 123', true, 'center');
                    }, 'POST', "{{ route('admin.party.party_user.reset_password') }}", {id});
                }
            });
        }

    </script>

@endsection