@extends('admin.layout')

@section('content')
    @php
        $status_title = \App\Models\Tutorial::$status_title;
        $type_title = \App\Models\Tutorial::$type_title;
    @endphp
    <style>
        .rs-select2--light .select2-container--default .select2-selection--single {
            border: 1px solid #ced4da;
            border-radius: 2px;
        }
    </style>
    <div class="container-fluid" ng-controller="addTutorialController">
        @if(session('success_message'))
            <div class="alert alert-success" role="alert">
                {{session('success_message')}}
            </div>
        @endif

        <div class="row">
            <div class="col-md-12">
                <!-- DATA TABLE -->
                <div class="card">
                    <form class="form-horizontal" action="save-tutorial" method="post" name="tutorialForm">
                        {{ csrf_field() }}
                        <div class="card-header">
                            <strong>Nhập thông tin thông báo</strong>
                        </div>
                        <div class="card-body card-block">
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label class="form-control-label">Kiểu hướng dẫn<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9">
                                    <select class="form-control"
                                            name="target_type"
                                            ng-model="state.target_type"
                                            @if(old('target_type')) ng-init="state.target_type = '{{old('target_type')}}'" @endif
                                            required
                                            ng-change="onselectTargetType()">
                                        <option @if(old('target_type') && old('target_type') == \App\Models\Tutorial::TYPE_FOR_USER) selected @endif
                                                value="{{\App\Models\Tutorial::TYPE_FOR_USER}}">
                                            {{$type_title[\App\Models\Tutorial::TYPE_FOR_USER]}}
                                        </option>
                                        <option @if(old('target_type') && old('target_type') == \App\Models\Tutorial::TYPE_FOR_TASKER) selected @endif
                                                value="{{\App\Models\Tutorial::TYPE_FOR_TASKER}}">
                                            {{$type_title[\App\Models\Tutorial::TYPE_FOR_TASKER]}}
                                        </option>
                                    </select>
                                    @if($errors->has('target_type'))
                                        <small class="help-block form-text red-color">{{$errors->first('target_type')}}</small>
                                    @endif
                                </div>
                            </div>
                            <div class="row form-group"
                                 ng-if="state.target_type == {{\App\Models\Tutorial::TYPE_FOR_USER}}"
                                 ng-init="createTargetSelect()">
                                <div class="col col-md-3">
                                    <label class="form-control-label">Đối tượng<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9 rs-select2--light rs-select2--md">
                                    <select name="target_id" id="select-target">

                                    </select>
                                    @if($errors->has('target_id'))
                                        <small class="help-block form-text red-color">{{$errors->first('target_id')}}</small>
                                    @endif
                                </div>
                            </div>


                            <div class="row form-group"
                                 ng-if="state.target_type == {{\App\Models\Tutorial::TYPE_FOR_TASKER}}"
                                 ng-init="createTargetSelect()">
                                <div class="col col-md-3">
                                    <label class="form-control-label">Nhóm dịch vụ<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9 rs-select2--light rs-select2--md">
                                    <select name="target_id" id="select-target">

                                    </select>
                                    @if($errors->has('target_id'))
                                        <small class="help-block form-text red-color">{{$errors->first('target_id')}}</small>
                                    @endif
                                </div>
                            </div>
                            <div class="row form-group">
                                <div class="col col-md-3">
                                    <label class="form-control-label">Bài hướng dẫn<em class="red-color">*</em></label>
                                </div>
                                <div class="col-12 col-md-9 rs-select2--light rs-select2--md">
                                    <select name="post_url" id="select-tutorial">
                                    </select>
                                    @if($errors->has('post_url'))
                                        <small class="help-block form-text red-color">{{$errors->first('post_url')}}</small>
                                    @endif
                                </div>
                            </div>
                        </div>

                        <div class="ml-3"><b>Lưu ý: </b>Nếu không tìm thấy bài hướng dẫn, ấn vào <a href="add-post?type={{\App\Models\PostSale::TYPE_TUTORIAL}}" target="_blank">đây</a> để thêm bài viết, sau đó trở lại form này để tiếp tục.</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