@extends('layouts.app')

@section('content')
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <div class="card-header">
                    <div class="card-title-wrap bar-teal">
                        <h4 class="card-title" id="horz-layout-colored-controls">Add Team</h4>
                    </div>
                </div>
                <div class="card-body px-4">
                    <form class="form" id="deptForm">
                        <div class="row">
                            <div class="col-6">
                                <div class="form-group">
                                    <label class="label-control" for="dept_name">Name </label>
                                    <input type="text" id="name" class="form-control border-primary" name="name"
                                        placeholder="Enter Team Name">
                                </div>
                            </div>

                            @if (auth()->user()->role == Admin() || auth()->user()->department->name != Production())
                                <div class="col-6">
                                    <div class="form-group">
                                        <label class="label-control">Brand</label>
                                        <select name="brand_id[]" id="brand_id" multiple
                                            class="form-control border-primary"></select>
                                    </div>
                                </div>
                            @endif
                            @if (auth()->user()->role == Admin())
                                <div class="col-6">
                                    <div class="form-group">
                                        <label class="label-control">Unit</label>
                                        <select name="unit_id" id="unit_id" class="form-control border-primary">
                                        </select>
                                    </div>
                                </div>
                            @else
                                <input type="hidden" name="unit_id" value="{{ auth()->user()->unit_id }}">
                            @endif
                            <div class="col-6">
                                <div class="form-group">
                                    <label class="label-control">Users</label>
                                    <select name="users[]" multiple id="users" class="form-control border-primary">
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="form-actions right">
                            <button type="button" class="btn btn-danger mr-1">
                                <i class="icon-trash"></i> Cancel
                            </button>
                            <button type="submit" class="btn btn-success">
                                <i class="icon-note"></i> Save
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('afterScript')
    <script>
        $("#deptForm").submit(function(e) {
            e.preventDefault();
            vendor = $("#deptForm");
            var form_data = new FormData($("#deptForm")[0]);
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                url: "{{ route('team.store') }}",
                type: "POST",
                data: form_data,
                async: false,
                cache: false,
                contentType: false,
                enctype: 'multipart/form-data',
                processData: false,
                success: function(res) {
                    swal("Inserted!", "Team has been Added Successfully!", "success");
                    location.reload();
                },
                error: function(err) {
                    swal('Not Valid', err.responseJSON.message, 'error')
                }
            });
        });

        @if (auth()->user()->role == Admin())
            $('#department_id').select2({
                placeholder: "Search Department",
                allowClear: true,
                ajax: {
                    url: "{{ route('department.get-dept') }}",
                    type: "GET",
                    dataType: 'json',
                    data: function(params) {
                        return {
                            search: params.term
                        };
                    },
                    processResults: function(response) {
                        return {
                            results: response
                        };
                    },
                    cache: true
                }
            });
        @endif
        $('#users').select2({
            placeholder: "Search User",
            allowClear: true,
            ajax: {
                url: "{{ route('department.users.get-user') }}",
                type: "GET",
                dataType: 'json',
                data: function(params) {
                    return {
                        search: params.term
                    };
                },
                processResults: function(response) {
                    return {
                        results: response
                    };
                },
                cache: true
            }
        });
        $('#brand_id').select2({
            placeholder: "Search Brand",
            allowClear: true,
            ajax: {
                url: "{{ route('brand.get-brand') }}",
                type: "GET",
                dataType: 'json',
                data: function(params) {
                    return {
                        search: params.term
                    };
                },
                processResults: function(response) {
                    return {
                        results: response
                    };
                },
                cache: true
            }
        });
        $('#unit_id').select2({
            placeholder: "Search Unit",
            allowClear: true,
            ajax: {
                url: "{{ route('unit.get-dropdown-list') }}",
                type: "GET",
                dataType: 'json',
                data: function(params) {
                    return {
                        search: params.term
                    };
                },
                processResults: function(response) {
                    return {
                        results: response
                    };
                },
                cache: true
            }
        });
    </script>
@endsection