@extends('layouts.app')

@section('content')

    <div class="card">

        <div class="card-header bg-primary text-white">

            <h5 class="my-1 float-left">เพิ่ม ผู้ใช้งานระบบ ใหม่</h5>

            <div class="btn-group btn-group-sm float-right" role="group">
                <a href="{{ route('users.user.index') }}" class="btn btn-primary" title="แสดง ผู้ใช้งานระบบ ทั้งหมด">
                    <i class=" fas fa-fw fa-th-list" aria-hidden="true"></i>
                </a>
            </div>

        </div>

        <div class="card-body">

            @if ($errors->any())
                <ul class="alert alert-danger">
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            @endif

            <form method="POST" action="{{ route('users.user.store') }}" accept-charset="UTF-8" id="create_user_form"
                name="create_user_form" class="form-horizontal" enctype="multipart/form-data">
                {{ csrf_field() }}
                @include ('users.form', [
                    'user' => null,
                ])

                <div class="form-group">
                    <div align="center">
                        <button class="btn btn-primary" type="submit">
                            <i class="fas fa-fw fa-save"></i> บันทึก</button>
                        <button class="btn btn-light" type="reset" onclick="history.back();">
                            <i class="fas fa-fw fa-redo" aria-hidden="true"></i> ยกเลิก</button>
                    </div>
                </div>

            </form>

        </div>
    </div>

@endsection
@section('script')
    <script>
        function get_tambons(amphurs_id) {
            $.ajax({
                type: 'POST',
                url: "{{ route('tambons.tambon.get_tambon_by_amphur', 0) }}" + amphurs_id,
                data: {
                    _token: '{{ csrf_token() }}'
                },
                dataType: 'text',
                success: function(data) {
                    $('#tambons_id').html('');
                    $('#tambons_id').append(data);
                }
            })
        }

        function get_moobans(tambons_id) {
            $.ajax({
                type: 'POST',
                url: "{{ route('moobans.mooban.get_mooban_by_tambon', 0) }}" + tambons_id,
                data: {
                    _token: '{{ csrf_token() }}'
                },
                dataType: 'text',
                success: function(data) {
                    $('#moobans_id').html('');
                    $('#moobans_id').append(data);
                }
            })
        }

        function get_homes(moobans_id) {
            $.ajax({
                type: 'POST',
                url: "{{ route('homes.home.get_home_by_mooban', 0) }}" + moobans_id,
                data: {
                    _token: '{{ csrf_token() }}'
                },
                dataType: 'text',
                success: function(data) {
                    $('#homes_id').html('');
                    $('#homes_id').append(data);
                }
            })
        }
        $('#permission').change(function(e) {
            var sl_permission = $(this).val();
            if (sl_permission == 'ADMIN') {
                $('#amphurs_id').prop('disabled',true);
                $('#tambons_id').prop('disabled',true);
                $('#moobans_id').prop('disabled',true);
            }
           else if (sl_permission == 'ADMIN_AMP') {
                $('#amphurs_id').prop('disabled',false);
                $('#tambons_id').prop('disabled',true);
                $('#moobans_id').prop('disabled',true);
            }
            else if (sl_permission == 'ADMIN_TAMBON') {
                $('#amphurs_id').prop('disabled',false);
                $('#tambons_id').prop('disabled',false);
                $('#moobans_id').prop('disabled',true);
            }
           else if (sl_permission == 'USER_MOOBAN') {
                $('#amphurs_id').prop('disabled',false);
                $('#tambons_id').prop('disabled',false);
                $('#moobans_id').prop('disabled',false);
            } 
        })
    </script>
@endsection