@extends('admin.layout')

@section('content')
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <!-- DATA TABLE -->
                <div class="card">
                    <form class="form-horizontal" action="save-voucher" method="post">
                        {{ csrf_field() }}
                        <div class="card-header">
                            <strong>Thêm 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">Mã giảm giá<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <div class="input-group mb-3">
                                        <input type="hidden" name="status" value={{\App\Helper\Constants::STATUS_ACTIVE}}>
                                        <input id="code" type="text" name="code" placeholder="Mã giảm giá"
                                               class="form-control">
                                        <div class="input-group-append">
                                            <button class="btn btn-outline-secondary" type="button" id="button-addon2"
                                                    onclick="random()">Random
                                            </button>
                                        </div>
                                    </div>
                                    @if($errors->has('code'))
                                        <small class="help-block form-text red-color">{{$errors->first('code')}}</small>
                                    @endif
                                </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" placeholder="Giá trị khuyến mại (%)"
                                           class="form-control">
                                    @if($errors->has('value'))
                                        <small class="help-block form-text red-color">{{$errors->first('value')}}</small>
                                    @endif
                                </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" placeholder="Số lượng mã" class="form-control">
                                    @if($errors->has('use_time'))
                                        <small class="help-block form-text red-color">{{$errors->first('use_time')}}</small>
                                    @endif
                                </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($services as $service)
                                        <div class="custom-control custom-checkbox">
                                            <input type="checkbox" class="custom-control-input singleItem"
                                                   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">Thời gian<em class="red-color">*</em></label>
                                </div>

                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="form-control-wrapper">
                                            <div class="form-group label-floating is-empty">
                                                <label for="date-start" class="control-label">Bắt đầu từ</label>
                                                <input type="text" name="start_date" id="date-start" class="form-control" data-dtp="dtp_0mSOn">
                                                @if($errors->has('start_date'))
                                                    <small class="help-block form-text red-color">{{$errors->first('start_date')}}</small>
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row ml-4">
                                    <div class="col-md-12">
                                        <div class="form-control-wrapper">
                                            <div class="form-group label-floating is-empty">
                                                <label for="date-end" class="control-label">Kết thúc vào</label>
                                                <input type="text" name="expire_date" id="date-end" class="form-control" data-dtp="dtp_cBLAU">
                                                @if($errors->has('expire_date'))
                                                    <small class="help-block form-text red-color">{{$errors->first('expire_date')}}</small>
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                </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(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')}}"
                                           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') == \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') == \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 : 'YYYY/MM/DD HH:mm'});
            $('#date-start').bootstrapMaterialDatePicker({ weekStart : 0 , format : 'YYYY/MM/DD 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