@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-service" method="post" enctype="multipart/form-data">
                        {{ csrf_field() }}
                        <input type="hidden" name="id" value="{{$sv->id}}"/>
                        <div class="card-header">
                            <strong>Nhập thông tin dịch vụ</strong>
                        </div>
                        <div class="card-body card-block" @if($sv->bundle) ng-init="service_type='1'" @elseif($sv->child) ng-init="service_type='2'" @else ng-init="service_type='0'" @endif>
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label for="text-input" class=" form-control-label">Name<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <input type="text" name="name" placeholder="Name" value="{{$sv->name}}" class="form-control @if($errors->has('name'))is-invalid @endif">
                                </div>
                            </div>
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label for="text-input" class=" form-control-label">Code<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <input type="text" name="service_code" placeholder="Code" value="{{$sv->service_code}}" class="form-control @if($errors->has('service_code'))is-invalid @endif">
                                </div>
                            </div>
                            <div class="row form-group" ng-if="service_type != 2">
                                <div class="col col-md-3">
                                    <label for="text-input" class=" form-control-label">URL<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <input type="text" name="url"  placeholder="URL" value="{{$sv->url}}" class="form-control @if($errors->has('url'))is-invalid @endif">
                                </div>
                            </div>
                            <input type="hidden" value="{{\App\Models\Services::SERVICE_NORMAL}}" name="service_type" ng-init="service_type = {{\App\Models\Services::SERVICE_NORMAL}}">
                            {{--<div class="row form-group">--}}
                                {{--<div class="col col-md-3">--}}
                                    {{--<label for="combo_service" class=" form-control-label">Loại dịch vụ</label>--}}
                                {{--</div>--}}
                                {{--<div class="col-12 col-md-9">--}}
                                    {{--<select  name="service_type" class="form-control" ng-model="service_type">--}}
                                        {{--<option value="{{\App\Models\Services::SERVICE_NORMAL}}">Dịch vụ thông thường</option>--}}
                                        {{--<option value="{{\App\Models\Services::SERVICE_GROUP}}">Dịch vụ nhóm</option>--}}
                                        {{--<option value="{{\App\Models\Services::SERVICE_CHILD}}">Dịch vụ con</option>--}}
                                    {{--</select>--}}
                                {{--</div>--}}
                            {{--</div>--}}
                            <div class="row form-group" ng-if="service_type != 2">
                                <div class="col col-md-3">
                                    <label for="file-input" class=" form-control-label">Image</label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <img src="{{$sv->getImage()}}" width="50px" height="50px"/>
                                    <input type="file"  name="image" class="form-control-file">
                                </div>
                            </div>
                            <div class="row form-group" ng-if="service_type != 2">
                                <div class="col col-md-3">
                                    <label for="file-input" class=" form-control-label">Icon</label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <img src="{{$sv->getIcon()}}" width="50px" height="50px"/>
                                    <input type="file" name="icon" class="form-control-file">
                                </div>
                            </div>
                            <div class="row form-group" ng-if="service_type != 2">
                                <div class="col col-md-3">
                                    <label for="introduce" class=" form-control-label">Introduce<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <textarea id="introduce" name="introduce" class="form-control @if($errors->has('introduce'))is-invalid @endif">{{$sv->introduce}}</textarea>
                                </div>
                            </div>
                            <div class="row form-group" ng-if="service_type != 2">
                                <div class="col col-md-3">
                                    <label for="working" class=" form-control-label">Working<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <textarea id="working" name="working" class="form-control @if($errors->has('working'))is-invalid @endif">{{$sv->working}}</textarea>
                                </div>
                            </div>
                            <div class="row form-group" ng-if="service_type != 2">
                                <div class="col col-md-3">
                                    <label for="not_working" class=" form-control-label">Not Working<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <textarea id="not_working" name="not_working" class="form-control @if($errors->has('not_working'))is-invalid @endif">{{$sv->not_working}}</textarea>
                                </div>
                            </div>
                            <div class="row form-group" ng-if="service_type != 2">
                                <div class="col col-md-3">
                                    <label for="procedure" class=" form-control-label">Procedure<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    @php
                                        $steps = [];
                                        if($sv->procedure){
                                            $steps = json_decode($sv->procedure);
                                        }
                                    @endphp
                                    <script>
                                        var step = parseInt('{{count($steps)}}');
                                        if(step == 0){
                                            step = 1;
                                        }
                                    </script>
                                    @if(count($steps) > 0)
                                    @foreach($steps as $step)
                                    <textarea  placeholder="Step {{$loop->index+1}} .." name="procedure[]" class="form-control m-t-10 @if($errors->has('procedure'))is-invalid @endif">{{$step}}</textarea>
                                    @endforeach
                                    @else
                                        <textarea  placeholder="Step 1.." name="procedure[]" class="form-control @if($errors->has('procedure'))is-invalid @endif"></textarea>
                                    @endif
                                    <button type="button" class="float-right btn btn-warning btn-sm m-t-10" onclick="addStep(this)"><span>Add Step</span></button>
                                </div>
                            </div>
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label for="text-input" class=" form-control-label">Thời gian thực hiện (số phút)<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <input type="number" min="5" name="total_time" placeholder="Total time" value="{{$sv->total_time}}" class="form-control @if($errors->has('total_time'))is-invalid @endif">
                                </div>
                            </div>
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label for="category" class=" form-control-label">Group service<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <select name="category" class="form-control">
                                        @foreach($categories as $category)
                                            <option @if($sv->category == $category->id) selected @endif value="{{$category->id}}">{{$category->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label for="tasker_type" class=" form-control-label">Tasker type<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <select name="tasker_type[]" multiple class="form-control">
                                        @foreach(Illuminate\Support\Facades\DB::table("taskers")->get() as $tasker)
                                            <option @if(in_array($tasker->id,explode(',',$sv->tasker_type))) selected @endif value="{{$tasker->id}}">{{$tasker->tasker}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>

                            <div class="row form-group" ng-if="service_type == 1">
                                <div class="col col-md-3">
                                    <label for="category" class=" form-control-label">Options service<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <select multiple class="form-control" name="group_services[]">
                                        @foreach(\App\Models\Services::where('child',1)->get() as $service)
                                            <option value="{{$service->id}}">{{$service->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label for="not_working" class=" form-control-label">Template<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <select class="form-control" name="source_input" id="source-input-select">
                                        <option @if($sv->source_input == 1) selected @endif value="1">Template 1</option>
                                        <option @if($sv->source_input == 2) selected @endif value="2">Template 2</option>
                                        <option @if($sv->source_input == \App\Models\Services::TEMPLATE_TYPE_SELECT_TIME)
                                                selected
                                                @endif
                                                value="{{\App\Models\Services::TEMPLATE_TYPE_SELECT_TIME}}">Template 3</option>
                                        <option @if($sv->source_input == \App\Models\Services::TEMPLATE_TYPE_VACCINE)
                                                selected
                                                @endif
                                                value="{{\App\Models\Services::TEMPLATE_TYPE_VACCINE}}">Template 4</option>
                                    </select>
                                </div>
                                <script>
                                    document.getElementById('source-input-select').onchange = function () {
                                        var c_s = document.getElementById('coordinates-input').style;
                                        var s_t = document.getElementById('select_tasker_block').style;
                                        if (this.value == {{\App\Models\Services::TEMPLATE_TYPE_VACCINE}}) {
                                            c_s.display = '';
                                            s_t.display = '';
                                        } else {
                                            c_s.display = 'none';
                                            s_t.display = 'none';
                                        }
                                    };
                                </script>
                            </div>

                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label for="category" class=" form-control-label">Phí app <em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <input type="number" min="5" name="app_fee" placeholder="Phí quản lý app"
                                           value="{{old('app_fee') ?: $sv->app_fee}}" class="form-control @if($errors->has('app_fee'))is-invalid @endif">
                                </div>
                            </div>

                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label for="app_fee_type" class=" form-control-label">Loại phí app <em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <select name="app_fee_type" id="app_fee_type" class="form-control @if($errors->has('app_fee_type'))is-invalid @endif">
                                        <option value="{{\App\Models\Services::APP_FEE_TYPE_PERCENT}}" @if((old('app_fee_type') ?: $sv->app_fee_type) == \App\Models\Services::APP_FEE_TYPE_PERCENT) selected @endif>Phần trăm</option>
                                        <option value="{{\App\Models\Services::APP_FEE_TYPE_MONEY}}" @if((old('app_fee_type') ?: $sv->app_fee_type) == \App\Models\Services::APP_FEE_TYPE_MONEY) selected @endif>Tiền(VND)</option>
                                    </select>
                                </div>
                            </div>

                            <div id="coordinates-input"
                                 @if($sv->source_input != \App\Models\Services::TEMPLATE_TYPE_VACCINE)
                                 style="display: none;"
                                    @endif
                            >
                                <div class="row form-group">
                                    <div class="col col-md-3">
                                        <label for="text-input" class=" form-control-label">Tọa độ (dành cho trung tâm, bệnh viện khi template là 4)<em class="red-color">*</em></label>
                                    </div>
                                    <div class="col-12 col-md-9">
                                        <input type="text" name="coordinates" placeholder="Tọa độ tìm kiếm trên google map. VD: 21.018080,105.864460" value="{{old('coordinates') ? old('coordinates') : $sv->coordinates}}" class="form-control @if($errors->has('coordinates'))is-invalid @endif">
                                    </div>
                                </div>
                                <div class="row form-group">
                                    <div class="col col-md-3">
                                        <label for="can_notify" class=" form-control-label">Tự động gửi thông báo<em class="red-color">*</em></label>
                                    </div>
                                    <div class="col-12 col-md-9">
                                        <input id="can_notify" type="checkbox" name="can_notify"
                                               @if(($sv && $sv->can_notify) || !!old('can_notify')) checked @endif />
                                        <label for="can_notify">
                                            <span class="main-menu-btn-icon">Tự động gửi</span>
                                        </label>
                                    </div>
                                </div>
                            </div>

                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label for="text-input" class=" form-control-label">Affiliate</label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <input type="number" min="0" max="100"
                                           name="affiliate" placeholder="Affiliate percent" value="{{old('affiliate') ? old('affiliate') : $sv->affiliate}}" class="form-control">
                                </div>
                            </div>

                            <div class="row form-group"
                                 @if(
                                        $sv->source_input != \App\Models\Services::TEMPLATE_TYPE_VACCINE
                                        || (old('source_input') && old('source_input') != \App\Models\Services::TEMPLATE_TYPE_VACCINE)
                                    )
                                    style="display: none"
                                 @endif
                                    id="select_tasker_block"
                            >
                                <div class="col col-md-3">
                                    <label for="text-input" class="form-control-label">Tasker</label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <div class="rs-select2--dark rs-select2--md rs-select2--dark2 w-100">
                                        <select class="js-select2" name="tasker"
                                                id="select_tasker">
                                            @if($sv->get_tasker && count($sv->get_tasker) > 0)
                                                <option value="{{$sv->get_tasker[0]->id}}">
                                                    {{$sv->get_tasker[0]->name . ' - ' . $sv->get_tasker[0]->email}}
                                                </option>
                                            @endif
                                        </select>
                                        <div class="dropDownSelect2"></div>
                                    </div>
                                </div>
                            </div>

                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label for="not_working" class=" form-control-label">Active<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <select class="form-control" name="active">
                                        <option @if($sv->active == \App\Helper\Constants::STATUS_ACTIVE) selected @endif value="{{\App\Helper\Constants::STATUS_ACTIVE}}">Active</option>
                                        <option @if($sv->active == \App\Helper\Constants::STATUS_INACTIVE) selected @endif value="{{\App\Helper\Constants::STATUS_INACTIVE}}">Deactive</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>
                            <button type="reset" class="btn btn-danger btn-sm">
                                <i class="fa fa-ban"></i> Reset
                            </button>
                        </div>
                    </form>
                </div>
                <!-- END DATA TABLE -->
            </div>
        </div>

    </div>
@endsection
@section('custom_script')
    <script type="text/javascript">
        function addStep(e) {
            step++;
            if(step <= 50){
                var  html = '<textarea  placeholder="Step '+step+'.." name="procedure[]" class="form-control m-t-10"></textarea>';
                jQuery(e).before(html);
            }
        }

        jQuery(document).ready(function () {
            jQuery('#select_tasker').select2({
                ajax: {
                    url: BASE_URL + 'users-data',
                    data: function (params) {
                        return {
                            search: params.term
                        };
                    },
                    placeholder: 'Chọn...',
                    delay: 500,
                    processResults: function (data) {
                        return {
                            results: data.users.map(function (item) {
                                return {
                                    id: item.id,
                                    text: item.name + ' - ' + item.email
                                }
                            })
                        };
                    }
                }
            });
        })
    </script>
@endsection