@extends('layouts.admin')

@section('style')
    @parent
    <style>
        .new-portion {
            margin-bottom: 15px;
        }

        .row.row-chat-condition {
            min-width: 670px;
            flex-wrap: nowrap;
        }

        .row.row-chat-condition .select2-container .select2-selection--single {
            height: 38px !important;
        }
    </style>
@endSection

@php
$form = config('admin.schedule_form');
$conds = $conds ?? [];
@endphp

@section('content')
    @component('admin.components.step_form_pages', [
        'post_url' => '',
        'type' => 'schedules',
        'title'=> 'Setup',
    ])

        @php
            $id = 'name';
            $comp = $form[$id];
        @endphp
        @component('admin.components.form_field_50',
            [
                'label' => $comp['label'],
                'required' => $comp['req'],
                'description' => $comp['descr'],
                'hasError' => ($hasError = $errors->has($id)),
            ])
            <input class="form-control {{ $hasError ? 'is-invalid' : '' }} {{ $comp['req'] ? 'required' : '' }}"
                placeholder="{{ $comp['placeholder'] }}" name="{{ $id }}" value="{{ $comp['value'][0] ?? '' }}" />
            @component('admin.components.form_error_msg', ['hasError' => $hasError])
                {{ $errors->first($id) }}
            @endcomponent
        @endcomponent


        @php
            $id = 'workflow';
            $comp = $form[$id];
            $select2 = $comp['ajax_select2'] ?? []
        @endphp
        @component('admin.components.form_field_50',
            [
                'label' => $comp['label'],
                'required' => $comp['req'],
                'description' => $comp['descr'],
                'hasError' => ($hasError = $errors->has($id)),
            ])
            <select name="{{ $id }}" 
                class="filter-input form-control select2 {{ $hasError ? 'is-invalid' : 'select2bs4' }} {{ $comp['req'] ? 'required' : '' }}"
                data-placeholder="{{ $comp['placeholder'] }}" 
                data-ajax-url="{{ $select2 ? getSelect2AjaxRoute($select2['type']) : '' }}"
                >
                @foreach ($comp['input'] ?? [] as $value => $label)
                    <option value="{{ $value }}" {{ in_array($value, $comp['value'] ?? []) ? 'selected' : '' }}>
                        {{ $label }}
                    </option>
                @endforeach
            </select>
            @component('admin.components.form_error_msg', ['hasError' => $hasError])
                {{ $errors->first($id) }}
            @endcomponent
        @endcomponent

        @php
            $id = 'is_ended_chat';
            $comp = $form[$id];
        @endphp
        @component('admin.components.form_field_50',
            [
                'label' => $comp['label'],
                'required' => $comp['req'],
                'description' => $comp['descr'],
                'hasError' => ($hasError = $errors->has($id)),
            ])
            <select name="{{ $id }}" 
                class="filter-input form-control select2 {{ $hasError ? 'is-invalid' : 'select2bs4' }} {{ $comp['req'] ? 'required' : '' }}"
                data-placeholder="{{ $comp['placeholder'] }}">
                @foreach ($comp['input'] ?? [] as $value => $label)
                    <option value="{{ $value }}" {{ in_array($value, $comp['value'] ?? []) ? 'selected' : '' }}>
                        {{ $label }}
                    </option>
                @endforeach
            </select>
            @component('admin.components.form_error_msg', ['hasError' => $hasError])
                {{ $errors->first($id) }}
            @endcomponent
        @endcomponent

        @php
            $id = 'is_after_channel_date_start';
            $comp = $form[$id];
        @endphp
        @component('admin.components.form_field_50',
            [
                'label' => $comp['label'],
                'required' => $comp['req'],
                'description' => $comp['descr'],
                'hasError' => ($hasError = $errors->has($id)),
            ])
            <select name="{{ $id }}" 
                class="filter-input form-control select2 {{ $hasError ? 'is-invalid' : 'select2bs4' }} {{ $comp['req'] ? 'required' : '' }}"
                data-placeholder="{{ $comp['placeholder'] }}">
                @foreach ($comp['input'] ?? [] as $value => $label)
                    <option value="{{ $value }}" {{ in_array($value, $comp['value'] ?? []) ? 'selected' : '' }}>
                        {{ $label }}
                    </option>
                @endforeach
            </select>
            @component('admin.components.form_error_msg', ['hasError' => $hasError])
                {{ $errors->first($id) }}
            @endcomponent
        @endcomponent

        <div class="col-sm-12 new-portion">&nbsp;</div>
        
        @php
            $id = 'conditions';
            $comp = $form[$id];
        @endphp
        @component('admin.components.form_field_100',
            [
                'label' => $comp['label'],
                'required' => $comp['req'],
                'description' => $comp['descr'],
                'hasError' => ($hasError = false),
            ])

            <div class="mx-0 px-0 my-2 row-chat-conditions" style="overflow: auto;">
                @php
                    $comp = 'admin.components.form_field';
                    $class = 'pl-1 pr-1 my-1';
                    $col_cls = 'col-';
                    $col_name = 'col-cond-';
                @endphp
                <template class="d-none tpl-row-chat-condition">
                    <div class="row row-chat-condition mx-0">
                        <div class="{{ $class }} {{ $col_cls }}1 flex-center text-tertiary {{ $col_name }}label">
                            <span class="d-none label">{{ __('headings.txt_and') }}</span>
                        </div>

                        @component($comp, ['class' => "{$class} {$col_cls}2",])
                            <select name="conditions.form_type[]" class="filter-input form-control select2 select2bs4">
                                @foreach($conds['types'] ?? [] as $type => $list)
                                    <option value="{{ $type }}">{{ $list['label'] }}</option>
                                @endforeach
                            </select>
                        @endcomponent

                        @component($comp, ['class' => "{$class} {$col_cls}4",])
                            <select name="conditions.type_value[]" class="filter-input form-control select2 select2bs4"
                                data-ajax-url="{{ getSelect2AjaxRoute('variable') }}"
                                >
                            </select>
                        @endcomponent

                        @component($comp, ['class' => "{$class} {$col_cls}1",])
                            <select name="conditions.cond[]" class="filter-input form-control select2 select2bs4">
                                @foreach($conds['conds'] ?? [] as $cond)
                                    <option value="{{ $cond }}" {{ $cond === '=' ? 'selected' : '' }}>{{ $cond }}</option>
                                @endforeach
                            </select>
                        @endcomponent

                        @component($comp, ['class' => "{$class} {$col_cls}1",])
                            <select name="conditions.unit[]" class="filter-input form-control select2 select2bs4">
                                <option value=" ">&nbsp;</option>
                                @foreach($conds['units'] ?? [] as $unit)
                                    <option value="{{ $unit }}">{{ $unit }}</option>
                                @endforeach
                            </select>
                        @endcomponent

                        @component($comp, ['class' => "{$class} {$col_cls}2",])
                            <input class="form-control" name="conditions.value[]" />
                        @endcomponent

                        <div class="{{ $class }} {{ $col_cls }}1 flex-center">
                            <button type="button" class="btn text-tertiary btn-remove">
                                <i class="fas fa-times"></i>
                            </button>
                        </div>
                    </div>
                </template>
            </div>
            
            @component($comp, ['class' => "col-sm-4 my-2",])
                <button type="button" class="btn btn-tertiary btn-add-cond font-weight-bold">
                    <i class="fas fa-plus"></i>&nbsp;
                    <span>Add Condition</span> 
                </button>
            @endcomponent
        @endcomponent

        <div class="col-sm-12 new-portion">&nbsp;</div>

        @php
            $id = 'cron_settings';
            $comp = $form[$id];
            $childs = ['minute', 'hour', 'day', 'weekday'];
        @endphp
        @component('admin.components.form_field_100',
            [
                'label' => $comp['label'],
                'required' => $comp['req'],
                'description' => $comp['descr'],
                'hasError' => ($hasError = false),
            ])

            @php
                $id = 'cron_settings.helper';
                $ccomp = $form[$id];
            @endphp
            @component('admin.components.form_field_100',
                [
                    'label' => $ccomp['label'],
                    'required' => $ccomp['req'],
                    'description' => $ccomp['descr'],
                    'hasError' => ($cHasError = false),
                ])
                <select name="{{ $id }}"
                    class="filter-input form-control select2 {{ $cHasError ? 'is-invalid' : 'select2bs4' }} {{ $ccomp['req'] ? 'required' : '' }}"
                    data-placeholder="{{ $ccomp['placeholder'] }}">
                    @foreach ($ccomp['input'] ?? [] as $value => $label)
                        <option value="{{ $value }}" {{ in_array($value, $ccomp['value'] ?? []) ? 'selected' : '' }}>
                            {{ $label }}{{ ltrim($value) === '' ? '' : " ({$value})" }}
                        </option>
                    @endforeach
                </select>
            @endcomponent

            <div class="row px-2">
                @foreach ($childs as $key)
                    @php
                        $cid = 'cron_settings.' . $key;
                        $ccomp = $form[$cid];
                    @endphp
                    @component('admin.components.form_field_50',
                    [
                        'label' => $ccomp['label'],
                        'required' => $ccomp['req'],
                        'description' => $ccomp['descr'],
                        'hasError' => ($cHasError = $errors->has($cid)),
                    ])
                        <input class="form-control {{ $cHasError ? 'is-invalid' : '' }} {{ $ccomp['req'] ? 'required' : '' }}"
                            placeholder="{{ $ccomp['placeholder'] }}" name="{{ $cid }}" value="{{ $ccomp['value'][0] ?? '' }}"
                            {{-- pattern="{{ '(((\d+,)+\d+|(\d+(\/|-)\d+)|\d+|\*(\/\d+)?) ?)' }}" --}}
                            />
                        @component('admin.components.form_error_msg', ['hasError' => $cHasError])
                            {{ $errors->first($cid) }}
                        @endcomponent
                    @endcomponent
                @endforeach
            </div>
        @endcomponent

        @slot('footer_next')
            <a href="javascript:void(0)" class="btn btn-info float-right btn-next">{{ __('headings.btn_save') }}</a>
        @endslot

    @endcomponent

    <x-utility.modal_confirmation_delete/>
@endsection

@section('script')
    @parent
    <script src="{{ mix('js/admin/schedule/index.js') }}" defer></script>
    <script>
        $(() => {
            sKaleScheduleView.edit(
                @json($data ?? null),
                '{{ $url_list ?? '' }}',
                '{{ $url_submit ?? '' }}'
            );
            sKaleHelper.RegisterSelect2($('select[data-ajax-url]'));
        });
    </script>
@endsection