@extends('layouts/contentNavbarLayout')

@section('title', 'ایجاد کارت')

@section('vendor-style')
    <link rel="stylesheet" href="{{asset('assets/vendor/libs/apex-charts/apex-charts.css')}}">
@endsection

@section('vendor-script')
    <script src="{{asset('assets/vendor/libs/apex-charts/apexcharts.js')}}"></script>
@endsection

@section('page-script')
    <script src="{{asset('assets/js/dashboards-analytics.js')}}"></script>
@endsection

@section('content')


    <h4 class="fw-bold py-3 mb-4">
        <span class="text-muted fw-light">پیام / </span>   ایجاد
    </h4>

    <div class="card-body mb-5">
        <form method="post" id="messageForm" enctype="multipart/form-data" action="{{ route('dashboard.messages.store') }}">
            @csrf
            @include('components.errors')
            <div class="row mb-3">
                <label class="col-sm-2 col-form-label" for="basic-icon-default-fullname"> متن مورد نظر </label>
                <div class="col-sm-10">
                    <div class="input-group input-group-merge">
                        <span id="basic-icon-default-fullname2" class="input-group-text"><i
                                    class="bx bx-file"></i></span>
                        <textarea name="body" rows="10" class="form-control"></textarea>
                    </div>
                </div>
            </div>
            <div class="row mb-3">
                <label class="col-sm-2 col-form-label" for="user_id">کاربر</label>
                <div class="col-sm-10">
                    <div class="mt-2 mb-3">
                        <select id="defaultSelect" name="user_id" class="form-select form-select-lg">
                            <option selected value="">ارسال به همه </option>
                            @foreach(\App\Models\User::query()->where('verified_at', '!=', null)->orderBy('first_name')->get() as $user)
                                <option value="{{ $user->id }}"> {{ $user->id }} - {{ $user->first_name }} {{ $user->last_name }} - {{ $user->phone }} </option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>
            <div class="row justify-content-end">
                <div class="col-sm-10">
                    <small class="text-info"> در صورت عدم انتخاب کاربر به صورت همگانی ارسال خواهد شد! </small>
                    <br>
                    <small class="text-info"> لطفا بعد از کلیک بر روی دکمه ارسال صبور باشید. فرایند ارسال امکان دارد چندین دقیقه زمان بر باشد! </small>
                    <br>
                    <br>
                    <br>
                    <button type="button" onclick="send(this)" class="btn btn-primary">ارسال</button>
                </div>
            </div>
        </form>
    </div>



    <script>
        function send(e){
            const form = document.getElementById('messageForm')
            e.disabled = true;
            form.submit();
        }
    </script>
@endsection