@extends('admin.layout')

@section('content')
    <div class="container-fluid" ng-controller="usersController">
        <div class="row">
            <div class="col-md-12">
                <!-- DATA TABLE -->
                <div class="card">
                    <form class="form-horizontal" action="save-voucher?id={{$voucher->id}}" method="post">
                        {{ csrf_field() }}
                        <div class="card-header">
                            <strong>Thêm giảm giá</strong>
                        </div>
                        <div class="card-body card-block">
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label class=" form-control-label">Thông tin mã giảm giá<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <input type="hidden" value="{{$voucher->id}}" name="voucher_id">
                                    <input type="hidden" value="{{$voucher->start_date}}" name="start_date">
                                    <input type="hidden" value="{{$voucher->expire_date}}" name="expire_date">
                                    <p class="form-control-static">{{$voucher->id}} - {{$voucher->start_date}}</p>
                                </div>
                            </div>
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label class="form-control-label">Mã giảm giá<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <input type="text" name="code" value="{{$voucher->code}}" placeholder="Voucher cide" class="form-control">
                                </div>
                            </div>
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label class="form-control-label">Giá trị khuyến mại<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <input type="text" name="value" value="{{$voucher->value}}" placeholder="Value" class="form-control">
                                </div>
                            </div>
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label class="form-control-label">Số lượng<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <input type="text" name="use_time" value="{{$voucher->use_time}}" placeholder="Số lượng" class="form-control">
                                </div>
                            </div>
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label for="select" class=" form-control-label">Active</label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <select name="status" id="active" class="form-control">
                                        <option @if($voucher->status== \App\Helper\Constants::STATUS_ACTIVE) selected @endif value={{\App\Helper\Constants::STATUS_ACTIVE}}>
                                            Active
                                        </option>
                                        <option @if($voucher->status== \App\Helper\Constants::STATUS_INACTIVE) selected @endif value={{\App\Helper\Constants::STATUS_INACTIVE}}>
                                            Inactive
                                        </option>
                                    </select>
                                </div>
                            </div>
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label for="select" class=" form-control-label">Dịch vụ</label>
                                </div>
                                <div class="col-12 col-md-9" style="overflow-y: scroll; height: 200px">
                                    <div class="custom-control custom-checkbox">
                                        <input type="checkbox" id="checkAll" name="checkAll"
                                               class="custom-control-input" onchange="handleClick(voucher)">
                                        <label class="custom-control-label" for="checkAll">Tất cả dịch vụ</label>
                                    </div>
                                    @foreach($allServices as $service)
                                        <div class="custom-control custom-checkbox">
                                            <input type="checkbox" class="custom-control-input singleItem" @if(in_array($service->id, $services)) checked @endif
                                            name="services[]" value="{{$service->id}}" id="{{$service->id}}">
                                            <label class="custom-control-label"
                                                   for="{{$service->id}}">{{$service->service_code}}
                                                - {{$service->name}}</label>
                                        </div>
                                    @endforeach
                                </div>
                            </div>
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label class="form-control-label">Thuộc về partner<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <div class="input-group mb-3">
                                        <div class="rs-select2--dark rs-select2--md rs-select2--dark2 w-100">
                                            <select class="js-select2"
                                                    name="user_id"
                                                    id="select_tasker">
                                                <option value="">Voucher dùng dung</option>
                                                @if($voucher->user)
                                                    <option value="{{$voucher->user->id}}" selected>
                                                        {{$voucher->user->name . ' - ' . $voucher->user->email}}
                                                    </option>
                                                @endif
                                                @if(old('user_id'))
                                                    @php $user = \App\User::query()->find(old('user_id')) @endphp
                                                    <option value="{{$user->id}}" selected>
                                                        {{$user->name . ' - ' . $user->email}}
                                                    </option>
                                                @endif
                                            </select>
                                            <div class="dropDownSelect2"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label class="form-control-label" for="limit_per_user">Số lần sử dụng/user</label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <input id="limit_per_user"
                                           type="number"
                                           value="{{old('limit_per_user') ? old('limit_per_user') : ($voucher->limit_per_user ? $voucher->limit_per_user : '')}}"
                                           name="limit_per_user" placeholder="Mặc định 1 lần/user"
                                           class="form-control">
                                </div>
                            </div>

                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label class="form-control-label" for="voucher_type">Loại voucher</label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <select name="type" id="voucher_type"
                                            class="form-control"
                                    >
                                        <option value="{{\App\Models\Voucher::TYPE_PERCENT}}"
                                                @if((old('type') ? old('type') : $voucher->type)
                                                == \App\Models\Voucher::TYPE_PERCENT) selected @endif
                                        >{{\App\Models\Voucher::$type_title[\App\Models\Voucher::TYPE_PERCENT]}}</option>
                                        <option value="{{\App\Models\Voucher::TYPE_MONEY}}"
                                                @if((old('type') ? old('type') : $voucher->type)
                                                 == \App\Models\Voucher::TYPE_MONEY) selected @endif
                                        >{{\App\Models\Voucher::$type_title[\App\Models\Voucher::TYPE_MONEY]}}</option>
                                    </select>
                                </div>
                            </div>

                        </div>

                        <div class="card-footer text-right">
                            <button type="submit" class="btn btn-primary btn-sm">
                                <i class="fa fa-dot-circle-o"></i> Submit
                            </button>
                        </div>
                    </form>
                </div>
                <!-- END DATA TABLE -->
            </div>
        </div>
    </div>
@endsection

@section('custom_script')
    <link href="vendor/datepicker/bootstrap-material-datetimepicker.min.css" rel="stylesheet" media="all">

    <script src="vendor/datepicker/moment-with-locales.js"></script>
    <script src="vendor/datepicker/bootstrap-material-datetimepicker.min.js"></script>

    <script>
        (function () {
            $('#date-end').bootstrapMaterialDatePicker({ weekStart : 0 , format : 'DD/MM/YYYY HH:mm'});
            $('#date-start').bootstrapMaterialDatePicker({ weekStart : 0 , format : 'DD/MM/YYYY HH:mm'}).on('change', function(e, date)
            {
                $('#date-end').bootstrapMaterialDatePicker('setMinDate', date);
            });
        })();
        function random() {
            document.querySelector("#code").value = randomVoucher();
        }

        function randomVoucher() {
            var text = "";
            var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

            for (var i = 0; i < 10; i++)
                text += possible.charAt(Math.floor(Math.random() * possible.length));

            return text;
        }

        function handleClick(checkAll) {
            var radios = document.getElementsByClassName("singleItem");
            for (var i = 0; i < radios.length; i++) {
                radios[i].checked = checkAll.checked;
            }
        }
        jQuery(document).ready(function () {
            jQuery('#select_tasker').select2({
                ajax: {
                    url: BASE_URL + 'users-data',
                    data: function (params) {
                        return {
                            search: params.term,
                            search_tasker: true
                        };
                    },
                    placeholder: 'Chọn partner...',
                    delay: 500,
                    processResults: function (data) {
                        var results = data.users.map(function (item) {
                            return {
                                id: item.id,
                                text: item.name + ' - ' + item.email
                            }
                        });
                        results.splice(0, 0, {
                            id: '',
                            text: 'Voucher dùng chung'
                        });
                        return {
                            results: results
                        };
                    }
                }
            });
        })
    </script>
@endsection