@php
    use App\Models\Invoice;
@endphp

<div>
    <!-- Page -->
    <div class="page">
        <div class="page-header">
            <h1 class="page-title">Data Tiket</h1>
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="">Home</a></li>
                <li class="breadcrumb-item"><a href="javascript:void(0)">CRM</a></li>
                <li class="breadcrumb-item active">Data Tiket</li>
            </ol>

            <div class="page-header-actions">
                <button type="button" data-target="#macro" data-toggle="modal"
                    class="btn btn-sm btn-icon btn-primary btn-round" data-toggle="tooltip" data-original-title="Edit">
                    <i class="icon md-hospital" aria-hidden="true"></i> Create Ticket
                </button>
            </div>
        </div>

        <div class="page-content container-fluid">
            <div class="row">
                <div class="col-xl-12">
                    <!-- Panel Kitchen Sink -->
                    <div class="panel">
                        <header class="panel-heading">
                            <h3 class="panel-title">
                                Data Tiket
                                <span wire:loading.delay.shortest class="panel-desc" style="color: red;"><i
                                        class="icon md-spinner" aria-hidden="true"></i> <b>Loading.....</b></span>
                                @if (session()->has('pesan'))
                                    <span class="panel-desc" style="color: green;">{{ session('pesan') }}</span>
                                @endif
                                <span class="panel-desc">
                                    {{ env('CORP_BRAND') }}
                                </span>
                            </h3>
                        </header>
                        <div class="panel-body">
                            <form wire:submit="search" enctype="multipart/form-data">
                                <div class="row">
                                    <div class="form-group form-material col-md-12 col-lg-2">
                                        <label class="form-control-label">Type</label>
                                        <select wire:model.live="cek_tipe_tiket" class="form-control">
                                            <option value="">Semua Divisi</option>
                                            <option>Instalasi</option>
                                            <option>Survey</option>
                                            <option>Uninstall</option>
                                            <option>Reinstall</option>
                                            <option>Pengaduan</option>
                                            <option>Support</option>
                                            <option>OpenQuota</option>
                                            <option>Change Paket</option>
                                            <option>Action POP</option>
                                            <option>Maintenance</option>
                                            <option>E-mail Support</option>
                                            <option>Upstream</option>
                                            <option>Instal Gagal</option>
                                            <option>Internet Lambat</option>
                                            <option>Internet DC</option>
                                            <option>Event BOD</option>
                                        </select>
                                    </div>
                                    <div class="form-group form-material col-md-12 col-lg-2">
                                        <label class="form-control-label">Owner</label>
                                        <select wire:model.live="cek_id_creator" class="form-control">
                                            <option value="">Semua Karyawan</option>
                                                                                        <option value="">Data Karyawan Kosong</option>
                                                                                    </select>
                                    </div>

                                    <div class="form-group form-material col-md-12 col-lg-1">
                                        <label class="form-control-label">Prioritas</label>
                                        <select wire:model.live="cek_prioritas" class="form-control">
                                            <option value="">Semua Prioritas</option>
                                            <option>Medium</option>
                                            <option>High</option>
                                            <option>Low</option>
                                        </select>
                                    </div>

                                    <div class="form-group form-material col-md-12 col-lg-3">
                                        <label class="form-control-label">Status</label>
                                        <select wire:model.live="cek_status_tiket" class="form-control">
                                            <option value="">Semua Status Tiket</option>
                                            <option>Open</option>
                                            <option>On Progress</option>
                                            <option>Close</option>
                                        </select>
                                    </div>

                                    <div class="form-group form-material col-md-12 col-lg-4">
                                        <label class="form-control-label">Divisi</label>
                                        <select wire:model.live="cek_divisi_tiket" class="form-control">
                                            <option value="">Semua Divisi Tiket</option>
                                            <option>Marketing</option>
                                            <option>Teknisi</option>
                                            <option>Helpdesk</option>
                                            <option>Finance</option>
                                            <option>Warehouse</option>
                                        </select>
                                    </div>
                                    <div class="form-group form-material col-md-1">
                                        <label class="form-control-label">Bulan</label>
                                        <select class="form-control" wire:model.live="bulan" required>
                                            <option value="">Pilih Bulan</option>
                                            <option value="01">Januari</option>
                                            <option value="02">Februari</option>
                                            <option value="03">Maret</option>
                                            <option value="04">April</option>
                                            <option value="05">Mei</option>
                                            <option value="06">Juni</option>
                                            <option value="07">Juli</option>
                                            <option value="08">Agustus</option>
                                            <option value="09">September</option>
                                            <option value="10">Oktober</option>
                                            <option value="11">November</option>
                                            <option value="12">Desember</option>
                                        </select>
                                    </div>
    
                                    <div class="form-group form-material col-md-1">
                                        <label class="form-control-label">Tahun</label>
                                        <select class="form-control" wire:model.live="tahun" required>
                                            <option value="">Pilih Tahun</option>
                                            <option value="2023">2023</option>
                                            <option value="2024">2024</option>
                                            <option value="2025">2025</option>
                                            <option value="2026">2026</option>
                                            <option value="2027">2027</option>
                                            <option value="2028">2028</option>
                                            <option value="2029">2029</option>
                                            <option value="2030">2030</option>
                                        </select>
                                    </div>
                                    

                                    <div class="form-group form-material col-md-12 col-lg-1">
                                        <label class="form-control-label">Data</label>
                                        <select class="form-control" wire:model.live="cek_limit" required>
                                            <option>10</option>
                                            <option>50</option>
                                            <option>100</option>
                                            <option>250</option>
                                            <option>500</option>
                                            <option>1000</option>
                                        </select>
                                    </div>
                                    <div class="form-group form-material col-md-12 col-lg-1">
                                        <label class="form-control-label">Order</label>
                                        <select class="form-control" wire:model.live="cek_urutan" required>
                                            <option value="DESC">Z-A</option>
                                            <option value="ASC">A-Z</option>
                                        </select>
                                    </div>

                                    <div class="form-group form-material col-md-12 col-lg-1">
                                        <label class="form-control-label">By</label>
                                        <select class="form-control" wire:model.live="cek_order_by" required>
                                            <option value="tiket.tgl_tiket">Tgl. Register</option>
                                        </select>
                                    </div>

                                    <div class="form-group form-material col-md-7 col-lg-7">
                                        <label class="form-control-label">Kata Kunci</label>
                                        <div class="input-group">
                                            <input type="text" wire:model.defer="cek_keyword"
                                                placeholder="Ketik Kata Kunci ..." class="form-control" required>
                                            <span class="input-group-append">
                                                <button wire:click.prevent="search" type="submit"
                                                    class="btn btn-primary"><i class="icon md-search"
                                                        aria-hidden="true"></i></button>
                                            </span>
                                            <span class="input-group-append">
                                                <button wire:click.prevent="clear_search" type="submit"
                                                    class="btn btn-primary"><i class="icon md-refresh"
                                                        aria-hidden="true"></i></button>
                                            </span>
                                        </div>
                                    </div>

                                </div>
                            </form>
                            <hr>

                            <div class="page-invoice-table table-responsive">
                                <table class="table table-striped table-hover toggle-circle" id="exampleRowToggler">
                                    <thead>
                                        <tr>
                                            <th>No</th>
                                            <th>ID</th>
                                            <th>Subject</th>
                                            <th>Owner</th>
                                            <th>Customer</th>
                                            <th>Produk</th>
                                            <th>Instalasi</th>
                                            <th>Status</th>
                                            <th>Prioritas</th>
                                            <th>Divisi</th>
                                            <th>Type</th>
                                            <th>Reply</th>
                                            <th>Tgl. Tiket</th>
                                            <th>PIC</th>
                                            <th>Reply</th>
                                            <th>Invoice</th>
                                            @if (Auth::user()->id_users == '24' || Auth::user()->level == 'Super Admin')
                                                <th>Point</th>
                                            @endif
                                            <th>Log</th>
                                            <th>Overdue</th>
                                            <th>Action</th>

                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach ($tiket as $row)
                                            @php
                                                $invoice = Invoice::where('no_tiket', $row->id_tiket)->first();
                                            @endphp

                                            <tr wire:key="{{ $row->id_tiket }}">

                                                <td>{{ $loop->index + 1 }}</td>
                                                <td><b>#{{ $row->id_tiket }}</b></td>
                                                <td>{{ $row->subject }}</td>
                                                <td>{{ $row->nama_creator }}</td>
                                                <td>{{ $row->nama_customer }}</td>
                                                <td>{{ $row->nama_produk }}</td>
                                                <td>
                                                    @if ($row->status_instalasi == 'Pending')
                                                        <span
                                                            class="badge badge-danger">{{ $row->status_instalasi }}</span>
                                                    @elseif ($row->status_instalasi == 'Survey')
                                                        <span
                                                            class="badge badge-warning">{{ $row->status_instalasi }}</span>
                                                    @elseif ($row->status_instalasi == 'Installation')
                                                        <span
                                                            class="badge badge-info">{{ $row->status_instalasi }}</span>
                                                    @elseif ($row->status_instalasi == 'Done')
                                                        <span
                                                            class="badge badge-success">{{ $row->status_instalasi }}</span>
                                                    @elseif ($row->status_instalasi == 'Failed')
                                                        <span
                                                            class="badge badge-danger">{{ $row->status_instalasi }}</span>
                                                    @elseif ($row->status_instalasi == 'Uninstall' || $row->status_instalasi == 'Blokir')
                                                        <span
                                                            class="badge badge-danger">{{ $row->status_instalasi }}</span>
                                                    @endif
                                                </td>
                                                <td>
                                                    @if ($row->status_tiket == 'Open')
                                                        <span
                                                            class="badge badge-success">{{ $row->status_tiket }}</span>
                                                    @elseif ($row->status_tiket == 'On Progress')
                                                        <span
                                                            class="badge badge-warning">{{ $row->status_tiket }}</span>
                                                    @elseif ($row->status_tiket == 'Close')
                                                        <span
                                                            class="badge badge-danger">{{ $row->status_tiket }}</span>
                                                    @endif
                                                </td>
                                                <td>
                                                    @if ($row->prioritas == 'High')
                                                        <span class="badge badge-danger">{{ $row->prioritas }}</span>
                                                    @elseif ($row->prioritas == 'Medium')
                                                        <span class="badge badge-warning">{{ $row->prioritas }}</span>
                                                    @elseif ($row->prioritas == 'Low')
                                                        <span class="badge badge-success">{{ $row->prioritas }}</span>
                                                    @endif
                                                </td>
                                                <td><span class="badge badge-info">{{ $row->divisi_tiket }}</span>
                                                </td>
                                                <td><span class="badge badge-success">{{ $row->tipe_tiket }}</span>
                                                </td>
                                                <td>
                                                    @if ($row->status_reply == '1')
                                                        <span class="badge badge-success">Done</span>
                                                    @else
                                                        <span class="badge badge-warning">Pending</span>
                                                    @endif
                                                </td>
                                                <td>{{ tgl_indo($row->tgl_tiket) . ' ' . time_explode($row->tgl_tiket) }}
                                                </td>
                                                <td>{{ $row->nama_pic }} </td>
                                                <td>
                                                    <a href="/helpdesk/detail-tiket?id={{ $row->id_tiket }}">
                                                        <button type="button"
                                                            class="btn btn-sm btn-icon btn-primary btn-round"
                                                            data-toggle="tooltip" data-original-title="Refresh">
                                                            <i class="icon md-eye" aria-hidden="true"></i>
                                                        </button>
                                                    </a>
                                                </td>
                                                <td>
                                                    @if (!empty($invoice->id_invoice))
                                                        <a href="/invoice/{{ $row->id_invoice }}" target="_blank">
                                                            <button
                                                                wire:click.prevent="show_invoice({{ $invoice->id_invoice }})"
                                                                type="button" data-target="#detail_invoice"
                                                                data-toggle="modal"
                                                                class="btn btn-sm btn-icon btn-primary btn-round"
                                                                data-toggle="tooltip" data-original-title="Edit">
                                                                <i class="icon md-eye" aria-hidden="true"></i>
                                                                {{ $invoice->no_invoice }}
                                                            </button>
                                                        </a>
                                                    @endif
                                                </td>
                                                <td>
                                                    @if (Auth::user()->id_users == '24' || Auth::user()->level == 'Super Admin')
                                                        @if (empty($row->status_point))
                                                            <button wire:click.prevent="show({{ $row->id_tiket }})"
                                                                type="button" data-toggle="modal"
                                                                data-target="#tambah_point"
                                                                class="btn btn-sm btn-icon btn-primary btn-round"
                                                                data-toggle="tooltip"
                                                                data-original-title="Tambah Point">
                                                                <i class="icon md-plus" aria-hidden="true"></i>
                                                            </button>
                                                        @elseif (!empty($row->status_point))
                                                            <button type="button"
                                                                class="btn btn-pure btn-success icon md-check"></button>
                                                        @endif
                                                    @endif
                                                <td>
                                                    <button wire:click.prevent="show_log_tiket({{ $row->id_tiket }})"
                                                        type="button" data-toggle="modal" data-target="#riwayat_log"
                                                        class="btn btn-sm btn-icon btn-primary btn-round"
                                                        data-toggle="tooltip" data-original-title="Riwayat Log">
                                                        <i class="icon md-eye" aria-hidden="true"></i>
                                                    </button>
                                                </td>
                                                <td>
                                                    @if (!empty($row->tgl_pekerjaan_overdue) && !empty($row->nama_pic))
                                                        @if ($row->status_reply != '1')
                                                            @php
                                                                $waktuawal = date_create($row->tgl_pekerjaan_overdue);
                                                                $waktuakhir = date_create();
                                                                $diff = date_diff($waktuawal, $waktuakhir);
                                                            @endphp
                                                                                                                        <div style="background: red; color:white;" align="center">
                                                                {{ $diff->h }} Jam {{ $diff->i }} Menit
                                                            </div>
                                                                                                                    @endif
                                                    @endif
                                                </td>
                                                <td>
                                                    @if (
                                                        $row->id_creator == Auth::user()->id_users ||
                                                            Auth::user()->level == 'Helpdesk' ||
                                                            Auth::user()->level == 'Admin' ||
                                                            Auth::user()->level == 'Super Admin')
                                                        <a href="/helpdesk/tiket-update?id={{ $row->id_tiket }}">
                                                            <button class="btn btn-sm btn-icon btn-primary btn-round"
                                                                data-toggle="tooltip" data-original-title="Edit">
                                                                <i class="icon md-edit" aria-hidden="true"></i>
                                                            </button>
                                                        </a>
                                                    @endif

                                                    @if (Auth::user()->level == 'Admin' || Auth::user()->level == 'Super Admin')
                                                        <button wire:click.prevent="show({{ $row->id_tiket }})"
                                                            data-target="#delete" type="button" data-toggle="modal"
                                                            class="btn btn-sm btn-icon btn-primary btn-round"
                                                            data-toggle="tooltip" data-original-title="Delete">
                                                            <i class="icon md-delete" aria-hidden="true"></i>
                                                        </button>
                                                    @endif


                                                </td>


                                            </tr>
                                        @endforeach

                                    </tbody>
                                </table>
                            </div>

                            <hr>
                            {{ $tiket->links() }}
                        </div>
                    </div>
                    <!-- End Panel Kitchen Sink -->
                </div>
            </div>
        </div>
    </div>
    <!-- End Page -->

    <!-- Modal Tambah POINT TEKNISI -->
    <div wire:ignore.self class="modal fade" id="tambah_point" tabindex="-1" data-keyboard="false"
        data-backdrop="static" aria-labelledby="TambahData" aria-hidden="true">
        <form wire:submit="store_point_teknisi" enctype="multipart/form-data">
            <div class="modal-dialog modal-simple modal-content modal-lg">
                <div class="modal-header">
                    <button type="button" class="close" wire:click="ClearForm" data-dismiss="modal"
                        aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                    <h4 class="modal-title" id="exampleFormModalLabel">Form Tambah Point Tiket
                        @if (session()->has('pesan'))
                            <span class="panel-desc" style="color: green;">{{ session('pesan') }}</span>
                        @endif
                    </h4>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="form-group form-material col-md-12">
                            <label class="form-control-label">Point Teknisi</label>
                            <input type="text" wire:model.defer="point_teknisi" class="form-control" required>
                        </div>
                        <div class="form-group form-material col-md-12">
                            <label class="form-control-label">Keterangan Point</label>
                            <textarea class="form-control" wire:model.defer="keterangan_point" rows="3"
                                placeholder="Keterangan Tambahan Jika di Perlukan"></textarea>
                        </div>
                        <div class="col-md-12">
                            <hr>
                        </div>
                        <div class="col-md-6 float-right">
                            <button wire:loading.attr="disabled" type="submit"
                                class="btn btn-primary btn-block">Save</button>
                        </div>

                        <div class="col-md-6 float-left">
                            <button type="button" wire:click="ClearForm" data-dismiss="modal" aria-label="Close"
                                class="btn btn-primary btn-block">Close</button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
    <!-- End Modal Tambah -!>

    <!- Modal Tambah -->
    <div wire:ignore.self class="modal fade" id="macro" tabindex="-1" data-keyboard="false"
        data-backdrop="static" aria-labelledby="TambahData" aria-hidden="true">
        <form method="GET" action="/helpdesk/tiket-create" enctype="multipart/form-data">
            <div class="modal-dialog modal-simple modal-content modal-md">
                <div class="modal-header">
                    <button type="button" class="close" wire:click="ClearForm" data-dismiss="modal"
                        aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                    <h4 class="modal-title" id="exampleFormModalLabel">Create Tiket
                        @if (session()->has('pesan'))
                            <span class="panel-desc" style="color: green;">{{ session('pesan') }}</span>
                        @endif

                    </h4>

                </div>
                <div class="modal-body">
                    <div class="row">

                        <div class="form-group form-material col-md-12">
                            <label class="form-control-label">No Berlangganan - Customer - Poduk - Marketing</label>
                            <div class="row">
                                <div class="input-group">
                                    <div class="col-md-10">
                                        <input type="text" wire:model.defer="cari_customer"
                                            placeholder="Ketik kata kunci" class="form-control">
                                    </div>
                                    <div class="col-md-2">
                                        <span class="input-group-append">
                                            <button wire:click.prevent="show_create_macro" type="submit"
                                                class="btn btn-primary"><i class="icon md-search"
                                                    aria-hidden="true"></i></button>
                                        </span>
                                    </div>
                                    <div class="col-md-12">
                                        <select name="id_customer" wire:model.live="id_customer" class="form-control" required>
                                            @if (!empty($customer))
                                            <option value="">Pilih Customer</option>
                                                @foreach ($customer as $row)
                                                    <option wire:key="{{ $row->id_customer }}"
                                                        value="{{ $row['id_customer'] }}">  #{{ $row->no_berlangganan . ' - ' . $row->nama . ' - '  . $row->nama_produk . ' - ' . $row->nama_marketing }} <i
                                                            class="icon md-edit" aria-hidden="true"></i>
                                                    </option>
                                                @endforeach
                                            @else
                                                <option value="">Data Customer Kosong</option>
                                            @endif
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>


                        <div class="form-group form-material col-md-12">
                            <label class="form-control-label">Macro </label>

                            <select name="id_macro" class="form-control" required>
                                <option value="">Pilih Macro</option>
                                                                <option value="">Data Macro Kosong</option>
                                                            </select>
                        </div>


                        <div class="col-md-12">
                            <hr>
                        </div>

                        <div class="col-md-6 float-left">

                            <button wire:loading.attr="disabled" type="submit"
                                class="btn btn-primary btn-block">Next</button>

                        </div>

                        <div class="col-md-6 float-right">

                            <button type="button" wire:click="ClearForm" data-dismiss="modal" aria-label="Close"
                                class="btn btn-primary btn-block">Close</button>

                        </div>


                    </div>
                </div>
            </div>
        </form>
    </div>
    <!-- End Modal Tambah -->

    <!-- Modal Edit DELETE -->
    <div wire:ignore.self class="modal fade" id="delete" aria-hidden="true"
        aria-labelledby="exampleFormModalLabel" role="dialog" tabindex="-1" data-keyboard="false"
        data-backdrop="static">
        <div class="modal-dialog modal-simple modal-content modal-sm">
            <div class="modal-header">
                <button type="button" class="close" wire:click="ClearForm" data-dismiss="modal"
                    aria-label="Close">
                    <span aria-hidden="false">×</span>
                </button>
                <span wire:loading wire:target="show" class="panel-desc" style="color: red;"><i
                        class="icon md-spinner" aria-hidden="true"></i> <b>Loading.....</b></span>
                <h4 wire:loading.remove class="modal-title" id="exampleFormModalLabel" style="color: red;">Anda yakin
                    ingin menghapus
                    "#{{ $id_tiket }}"?
                </h4>
            </div>
            <div class="modal-body">
                <div class="row" wire:loading.remove>
                    <div class="col-md-6 float-right">
                        <button wire:click.prevent="destroy({{ $id_tiket }})" type="button"
                            wire:click="ClearForm" data-dismiss="modal" aria-label="Close"
                            class="btn btn-primary btn-block">Yes</button>
                    </div>
                    <div class="col-md-6 float-left">
                        <button type="button" wire:click="ClearForm" data-dismiss="modal" aria-label="Close"
                            class="btn btn-primary btn-block">No</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- End Modal DELETE -->


    <!-- Modal Riwayat Log-->
    <div wire:ignore.self class="modal fade" id="riwayat_log" tabindex="-1" data-keyboard="false"
        data-backdrop="static" aria-labelledby="TambahData" aria-hidden="true">
        <form wire:submit="store" enctype="multipart/form-data">
            <div class="modal-dialog modal-simple modal-content modal-lg">
                <div class="modal-header">
                    <button type="button" class="close" wire:click="ClearForm" data-dismiss="modal"
                        aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                    <h4 class="modal-title" id="exampleFormModalLabel">Log Tiket
                        <span wire:loading wire:target="show_riwayat_log" class="panel-desc"
                            style="color: red;"><b>Loading.....</b></span>
                    </h4>

                </div>
                <div class="modal-body">
                    <div class="row">
                        <table class="tablesaw table-striped table-bordered table-hover" data-tablesaw-mode="swipe"
                            data-tablesaw-sortable data-tablesaw-sortable-switch data-tablesaw-minimap
                            data-tablesaw-mode-switch>
                            <thead>
                                <tr>
                                    <th>No</th>
                                    <th>ID Tiket</th>
                                    <th>Users</th>
                                    <th>Divisi</th>
                                    <th>Status</th>
                                    <th>Tanggal</th>
                                </tr>
                            </thead>
                            <tbody wire:loading.remove>
                                
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </form>
    </div>
    <!-- Modal Riwayat Log-->

</div>