@include('backend.layout.globals.vue_validation')
<div class="kt-section kt-section--last" :class="{'kt-section--first': !(validation_errors.length > 0)}">
    <div class="kt-section__body">
        <form-group-input-text v-model="fData.title" :name="'title'" label_class="col-2" input_class="col-10" :is_required="true" v-validate="'required'" :form_errors="errors" :trans="'{{ __("main.title") }}'"></form-group-input-text>
        <!-- Title -->
        <div class="form-group row validated">
            <label class="col-2 col-form-label required" :for="'description'">{{ __('main.description') }}</label>
            <div class="col-10">
                <textarea v-model="fData.description" :name="'description'" class="form-control" placeholder="{{ __('main.description') }}" v-validate="'required'" data-vv-as="{{ __('main.description') }}" :form_errors="errors" :id="'description'"></textarea>
                <span v-if="errors.has('description')" class="invalid-feedback">
                      @{{ errors.first('description') }}
                </span>
            </div>
        </div><!-- Description -->
        <div class="form-group row validated">
            <label class="col-2 col-form-label required">{{ __('main.to') }}</label>
            <div class="col-10">
                <Select2 @change="getSendsTo()"  v-validate="'required'"  :options="sends_to" v-model="fData.to" :name="'to'" data-vv-as="{{ __('main.to') }}" :form_errors="errors" :settings="{placeholder: '{{ __('main.to') }}'}" />
            </div>
        </div><!-- sendsto -->
        <template v-if="fData.to=='patient'">
            <div class="form-group row validated" >
                <label class="col-3 col-form-label">{{ __('main.select_all') .'  '. __('main.patients') }}:</label>
                <div class="col-3">
                    <span class="kt-switch kt-switch--icon">
                        <label>
                            <input class="form-check-input" type="checkbox" @click="selectAll" v-model="allSelected">
                            <span></span>
                        </label>
                    </span>
                </div>
                <label class="col-1 col-form-label required" v-text="'{{ __("main.search") }}'"></label>
                <input-component input_type="text" input_class="col-5" :name="'search'" v-model="search" :trans="'{{ __("main.search") }}'" :form_errors="errors"></input-component>
            </div><!-- Select All Users -->

            <div class="form-group row validated">
            <label class="col-2 col-form-label">{{ __('main.patients') }}:</label>
            <div class="row col-10 form-group">
                <div class="row col-4" v-for="(user, index) in filteredList" :key="index" :id='user.id'>
                    <label class="col-7 col-form-label" v-text="user.text"></label>
                    <div class="col-5">
                        <span class="kt-switch kt-switch--icon">
                            <label>
                                <input class="form-check-input" type="checkbox" name="users" v-model="fData.users" @click="select" :value="user.id">
                                <span></span>
                            </label>
                        </span>
                    </div>
                </div>
            </div>
        </div><!-- All Users-->
        </template>
        <template v-if="fData.to=='patient_type'">
            <div class="form-group row validated">
                <label class="col-2 col-form-label required">{{ __('main.patient_type') }}</label>
                <div class="col-10">
                    <Select2  :options="patient_types"  v-validate="'required'" v-model="fData.patient_type" :name="'patient_type'" data-vv-as="{{ __('main.patient_type') }}" :form_errors="errors" :settings="{placeholder: '{{ __('main.patient_type') }}'}" />
                </div>
            </div><!-- patient_type -->
        </template>
        <template v-if="fData.to=='location'">
            <div class="form-group row validated">
                <label class="col-2 col-form-label required">{{ __('main.location') }}</label>
                <div class="col-10">
                    <Select2  :options="locations"  v-validate="'required'" v-model="fData.location" :name="'location'" data-vv-as="{{ __('main.location') }}" :form_errors="errors" :settings="{placeholder: '{{ __('main.location') }}'}" />
                </div>
            </div><!-- patient_type -->
        </template>
    </div>
</div>