@extends('layouts.authorized')
@inject('constant', 'App\Util\Constant')
@section('cssCustom')
    <style>
        #form-scf label {
            font-weight: unset;
        }
    </style>
@endsection

@section('content')

    @include('cms.form.errorbox')

    <div class="col-md-12">
        <div class="col-md-12">
            <div class="card">
                <div class="card-header">{{ $id == 0 ? 'Tambah' : 'Edit' }} User Anchor</div>
                <div class="card-body">
                    <div class="row">
                        <form id="form-scf" action="{{ route('admin.userAnchor.save', ['id' => $id]) }}" method="POST">
                            <div class="col-md-12">
                                <div class="row">
                                    <div class="col-md-12 mt-10">
                                        <div class="col-md-3">
                                            <label class="control-label"><b>Tipe Anchor</b></label>
                                        </div>
                                        <div class="col-md-9">
                                            <select name="type" class="form-control" style="width: 100%">
                                                @foreach($constant::USER_ANCHOR_LABELS as $key => $value)
                                                    <option value="{{ $key }}" {{ $model->type == $key ? 'selected' : '' }}>{{ $value }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                    <div class="col-md-12 mb-10">
                                        <div class="col-md-12">
                                            <h4><b>User Login Dashboard</b></h4>
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="col-md-3">
                                            <label class="control-label">No. Handphone</label>
                                        </div>
                                        <div class="col-md-9">
                                            <input name="phone" class="form-control" value="{{$model->picContact}}" type="text" {{ $model->type == $constant::USER_ANCHOR_RM ? 'disabled' : '' }} />
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="col-md-3">
                                            <label class="control-label">Password</label>
                                        </div>
                                        <div class="col-md-9">
                                            <input name="password" class="form-control" type="password" required {{ $model->type == $constant::USER_ANCHOR_RM ? 'disabled' : '' }} />
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="col-md-3">
                                            <label class="control-label">Konfirmasi Password</label>
                                        </div>
                                        <div class="col-md-9">
                                            <input name="confirmPassword" class="form-control" type="password" required {{ $model->type == $constant::USER_ANCHOR_RM ? 'disabled' : '' }} />
                                            <small class="text text-sm text-warning">* Password minimal 8 karakter</small>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-12 mt-20">
                                <div class="row">
                                    <div class="col-md-12 mb-10">
                                        <div class="col-md-12">
                                            <h4><b>Data Anchor</b></h4>
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="col-md-3">
                                            <label class="control-label">Nama Anchor</label>
                                        </div>
                                        <div class="col-md-9">
                                            <input name="name" class="form-control" value="{{ $model->name }}" type="text" required />
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="col-md-3">
                                            <label class="control-label">Alamat Anchor</label>
                                        </div>
                                        <div class="col-md-9">
                                            <textarea name="address" class="form-control" cols="30" rows="10">{{$model->address}}</textarea>
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="col-md-3">
                                            <label class="control-label">Nama PIC</label>
                                        </div>
                                        <div class="col-md-9">
                                            <input name="picName" class="form-control" value="{{ $model->picName }}" type="text" required />
                                        </div>
                                    </div>
                                    @if ($id != 0)
                                        <div class="col-md-12">
                                            <div class="col-md-3">
                                                <label class="control-label">Kontak PIC</label>
                                            </div>
                                            <div class="col-md-9">
                                                <input name="picContact" class="form-control" type="text" value="{{$model->picContact}}" disabled required />
                                            </div>
                                        </div>
                                    @endif
                                    <div class="col-md-12">
                                        <div class="col-md-3">
                                            <label class="control-label">Email PIC</label>
                                        </div>
                                        <div class="col-md-9">
                                            <input name="picEmail" class="form-control" value="{{ $model->picEmail }}" type="email" required />
                                        </div>
                                    </div>
                                    <div class="col-md-12 mt-20">
                                        <div class="col-md-12 text-right">
                                            <button class="btn btn-primary" type="submit">Submit</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('jsCustom')
    <script>
        $(document).ready(function () {
            $('[name=type]').change(function () {
                if ($(this).val() == '{{ $constant::USER_ANCHOR_RM }}') {
                    $('[name=phone], [name=password], [name=confirmPassword]').prop('disabled', true);
                } else {
                    $('[name=phone], [name=password], [name=confirmPassword]').prop('disabled', false);
                }
            });
        });
    </script>
@endsection