@extends('components.layouts.manager.index')
@section('content')
    <div class="md:flex justify-between ">
        <div class="flex gap-2 items-center bg-orange-300 p-2 rounded-md shadow-md shadow-orange-400">
            <x-icon.banknotes class="size-6"/>
            {{$setting->getCredit()->Data}}
        </div>
        <div class="flex flex-col gap-2 items-center bg-orange-300 p-2 rounded-md shadow-md shadow-orange-400">
            <x-icon.phone class="size-6"/>
            @foreach($setting->getLines()->Data as $num)
                {{$num}}
                <br>
            @endforeach
        </div>
    </div>
    <div class="grid grid-cols-1 md:grid-cols-3 gap-2">
        <div class="col-span-1 md:col-span-2">
            <x-manager.table.table>
                <x-slot:head>
                    <th scope="col" class="px-6 py-3">
                        شماره پیام
                    </th>
                    <th scope="col" class="px-6 py-3">
                        ارسال به شمماره
                    </th>
                    <th scope="col" class="px-6 py-3">
                        متن پیام
                    </th>
                    <th scope="col" class="px-6 py-3">
                        زمان ارسال
                    </th>
                    <th scope="col" class="px-6 py-3">
                        هزینه
                    </th>
                    <th scope="col" class="px-6 py-3">
                        وضعیت ارسال
                    </th>
                    <th scope="col" class="px-6 py-3">
                        زمان رسیدن
                    </th>
                </x-slot:head>
                @if($reports->Today()->Data)
                    @foreach($reports->Today()->Data as $report)
                        <tr class=" hover:bg-orange-300 border-b ">
                            <th scope="row" class="px-6 py-4 ">
                                {{$report->MessageId}}
                            </th>
                            <td class="px-6 py-4">
                                {{$report->Mobile}}
                            </td>
                            <td class="px-6 py-4">
                                {{$report->MessageText}}
                            </td>
                            <td class="px-6 py-4">
                                {{jdate($report->SendDateTime)}}
                            </td>
                            <td class="px-6 py-4 ">
                                {{$report->Cost}}
                            </td>
                            <td class="px-6 py-4 ">
                                {{$report->DeliveryState}}
                            </td>
                            <td class="px-6 py-4 ">
                                {{jdate($report->DeliveryDateTime)}}
                            </td>
                        </tr>
                    @endforeach
                @endif
            </x-manager.table.table>
        </div>
        <form
            method="post"
            action="{{route('manager.sms.store')}}"
            class="p-2 rounded-md bg-orange-200 shadow-md shadow-orange-400">
            @csrf
            <x-inputs.input
                placeholder="ارسال برای؟"
                class=""
                type="text"
                name="phone"
                value="{{old('phone')}}"
                label="ارسال برای؟">
                <x-icon.phone class="size-6 text-gray-500"/>
            </x-inputs.input>
            <x-inputs.select
                name="lineNumber"
                label="ارسال از شماره"
                class="">
                <option value="">انتخاب شماره تلفن</option>
                @foreach($setting->getLines()->Data as $num)
                    <option value="{{$num}}">{{$num}}</option>
                @endforeach
            </x-inputs.select>

            <x-inputs.textarea
                label="متن پیام "
                name="message"
                class=""
                placeholder="متن پیام ارسالی "
                value="{{old('message')}}"
            />
            <x-buttons.button text="ارسال پیام"/>
        </form>
    </div>
@endsection