@extends('layouts.master')

@section('title')
    Quotation List
@endsection

@section('style')
    <style>
        
    </style>
@endsection

@section('content')

@include('layouts.header')

<section class="wrapper bg-light">
    <div class="container py-14">
        <div class="card">
            <div class="card-body">

                <h5 class="display-1 mb-3" style="font-size:25px">Quotation List</h5>
                
                <div align="right">
                    <a class="btn btn-sm btn-violet rounded-pill me-2" href="{{ url('/quotation_getedit/0') }}">
                        <i class="uil uil-plus"></i> Set Quotation
                    </a>
                </div>

                <div class="table-responsive">
                    <table id="example" width="100%" class="table table-striped table-condensed">
                        <thead>
                            <tr>
                                <th width="5%">No.</th>
                                <th width="30%">Project Name</th>
                                <th width="15%">Quotation No.</th>
                                <th width="10%">Quotation Date</th>
                                <th width="10%">Expiration Date</th>
                                <th width="5%">Status</th>
                                <th width="30%"></th>
                            </tr>
                        </thead>
                        <tbody>
                                @foreach($quotation as $key => $row)
                                    @php
                                        $today = \Carbon\Carbon::now()->startOfDay();
                                        $startDate = \Carbon\Carbon::parse($row->quotation_date)->startOfDay();
                                        $endDate = \Carbon\Carbon::parse($row->quotation_exp_date)->startOfDay();
                                    @endphp
                                <tr>
                                    <td>{{ $key + 1 }}</td>
                                    <td>{{ $row->quotation_project_name }}</td>
                                    <td>{{ $row->quotation_no }}</td>
                                    <td>{{ date('d F Y', strtotime($row->quotation_date))  }}</td>
                                    <td>{{ date('d F Y', strtotime($row->quotation_exp_date))  }}</td>
                                    <td>
                                        @if ($today->lt($startDate))
                                            {{-- ยังไม่ถึงวันที่เริ่ม (Waiting - สีส้ม) --}}
                                            <span class="badge bg-warning text-dark">Waiting</span>
                                        @elseif ($today->between($startDate, $endDate))
                                            {{-- อยู่ในช่วงวันที่กำหนด (Active - สีเขียว) --}}
                                            <span class="badge bg-success">Active</span>
                                        @else
                                            {{-- เกินวันที่กำหนด (Expired - สีแดง) --}}
                                            <span class="badge bg-danger">Expired</span>
                                        @endif
                                    </td>
                                    <td align="center">
												<a href="{{ url('/quotation_view', $row->quotation_id) }}" class="btn btn-circle btn-blue btn-sm" title="View">
													<i class="uil uil-eye"></i>
												</a>
                                                <a href="{{ url('/quotation_pdf', $row->quotation_id) }}" class="btn btn-circle btn-yellow btn-sm" title="Preview">
                                                            <i class="uil uil-file"></i>
                                                        </a>
												<a href="{{ url('/quotation_getedit', $row->quotation_id) }}" class="btn btn-circle btn-info btn-sm" title="Edit">
													<i class="uil uil-pen"></i>
												</a>
												<a href="{{ url('/quotation_delete', $row->quotation_id) }}" class="btn btn-circle btn-danger btn-sm" title="Delete" 
												   onclick="return confirm('Confirm Delete ?');">
													<i class="uil uil-trash-alt"></i>
												</a>
											</td>
                                </tr>
                                @endforeach
                            
                        </tbody>
                    </table>
                </div>

            </div>
        </div>
    </div>
</section>

@include('layouts.footer')

@endsection

@section('script')
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script src="./sandbox/js/plugins.js"></script>
    <script src="./sandbox/js/theme.js"></script>

    {{-- Tawk.to Script --}}
    <script type="text/javascript">
        var Tawk_API = Tawk_API || {}, Tawk_LoadStart = new Date();
        (function() {
            var s1 = document.createElement("script"), s0 = document.getElementsByTagName("script")[0];
            s1.async = true;
            s1.src = 'https://embed.tawk.to/68302140bb633c190b31fe04/1iru03pj0';
            s1.charset = 'UTF-8';
            s1.setAttribute('crossorigin', '*');
            s0.parentNode.insertBefore(s1, s0);
        })();
    </script>

    {{-- Logic Chatbot / Webhook --}}
    <script>
        Tawk_API.onMessageReceived = function(msg) {
            if (msg && msg.text && msg.senderType === "visitor") {
                fetch("https://hook.eu2.make.com/4rvrtmbr4j0ydel4en3ab58bhlnggn11", {
                    method: "POST",
                    headers: { "Content-Type": "application/json" },
                    body: JSON.stringify({ message: msg.text })
                });
            }
        };

        async function fetchReplyAndSend() {
            try {
                const res = await fetch("http://143.198.213.150/consultingcenter/public/api/chatbot/reply");
                const data = await res.json();
                if (data.reply && typeof Tawk_API.addMessage === "function") {
                    Tawk_API.addMessage(data.reply);
                }
            } catch (err) {
                console.error("Error:", err);
            }
        }
        setInterval(fetchReplyAndSend, 5000);
    </script>
@endsection