@extends('adminlte::page')

@section('title', '対象消耗品一覧')

@section('content_header')
    <h5><label class="title-underbar">対象消耗品一覧</label></h5>
@stop

@section('content')
    <x-admin.success-flush-message />
    <x-admin.error-flush-message />
    <x-admin.validation-message />
    <div class="row">
        <div class="col-md-12">
            <form method="GET" action="{{ route('productpromotion.admin.purchased-equipment.consumable', ['clinic_id' => $clinic_id, 'own_osada_equipment_id' => $own_osada_equipment_id]) }}" id="search" class="row" style="margin-bottom:1rem;">
                <div class="col-md-3">
                    <div class="input-group">
                        <label for="genre" style="margin-bottom:0rem; margin-right:0.5rem; padding-top:0.3rem;">経過月数</label>
                        <select name="number_of_month" id="number_of_month" class="custom-select">
                            <option value="">すべて</option>
                            <option value="in_two_month" @if(isset($inputs['number_of_month']) && $inputs['number_of_month'] == 'in_two_month'){!! 'selected' !!} @endif>交換該当月・１ヶ月前</option>
                            <option value="over_one_month_more" @if(isset($inputs['number_of_month']) && $inputs['number_of_month'] == 'over_one_month_more'){!! 'selected' !!} @endif>1ヶ月後～</option>
                        </select>
                    </div>
                </div>
            </form>
            <ul class="guide row justify-content-end">
                <li class="series1 col-md-auto">交換該当月・１ヶ月前</li>
                <li class="series2 col-md-auto">交換該当月(期限超過)</li>
                <li class="series3 col-md-auto">1ヶ月後～</li>
            </ul>
        </div>
        <div class="col-md-12">
            <div class="card" style="border-radius: 20px; box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.04);">
                <div class="card-body">
                    <div class="row justify-content-end" style="margin-right:30px;">
                        <div class="col-mb-4">
                            <a href="{{ route('productpromotion.admin.purchased-equipment.createConsumable', ['clinic_id' => $clinic_id, 'own_osada_equipment_id' => $own_osada_equipment_id]) }}" class="btn btn-block btn-outline-primary rounded-pill">新規追加</a>
                        </div>
                    </div>
                    <table class="table" style="margin-top:35px">
                        <thead class="thead-light medium-heading">
                            <tr>
                                <th style="width: 30%">機器名称</th>
                                <th style="width: 10%">前回交換日</th>
                                <th style="width: 15%">経過月数</th>
                                <th style="width: 10%">消耗品の更新</th>
                                <th style="width: 15%">購入依頼の確認</th>
                                <th style="width: 20%">交換間隔</th>
                            </tr>
                        </thead>
                        <tbody class="main-text">
                        @if($ownOsadaConsumables->count() > 0)
                            @foreach($ownOsadaConsumables as $ownOsadaConsumable)
                            <tr>
                                <td style="vertical-align: middle;">{{ $ownOsadaConsumable->external_name }}</td>
                                <td style="vertical-align: middle;">{{ $ownOsadaConsumable->last_replaced_at ? $ownOsadaConsumable->last_replaced_at->format('Y.m.d') : '-' }}</td>
                                <td style="vertical-align: middle;">
                                    @php
                                    $backgroundColor = '';
                                    $color = '#fff';
                                    $monthText = '';
                                    $month = abs($ownOsadaConsumable->diff_month);
                                    if($ownOsadaConsumable->is_over){
                                        if($month == 0){
                                            $backgroundColor = '#FF8F3F';
                                            $monthText = '該当月';
                                        }else{
                                            $backgroundColor = '#FF6565';
                                            $monthText = $month . 'ヶ月';
                                        }
                                    }else{
                                        if($month < 2){
                                            $backgroundColor = '#F3D328';
                                        }else{
                                            $color = '#000';
                                        }
                                        if($month == 0){
                                            $monthText = '該当月';
                                        }else{
                                            $monthText = $month . 'ヶ月前';
                                        }
                                    }
                                    @endphp
                                    <p style="color:{{$color}};background-color:{{ $backgroundColor }};margin:0;text-align:center;padding-left:5px;padding-top:5px;padding-bottom:5px;width:100%;">
                                    {{$monthText}}
                                    </p>
                                </td>
                                <td style="vertical-align: middle;"><a class="btn btn-block btn-outline-primary rounded-pill" data-toggle="modal" data-target="#update{{$ownOsadaConsumable->id}}">更新</a></td>
                                <td style="vertical-align: middle;">
                                    <a class="@if($ownOsadaConsumable->is_applying_purchase != 1 || $ownOsadaConsumable->consumablePurchaseRequest->count() == 0) {{ 'disabled' }} @endif btn btn-block btn-outline-primary rounded-pill" data-toggle="modal" data-target="#approve_purchase_request{{$ownOsadaConsumable->id}}">購入依頼の確認</a>
                                </td>
                                <td style="vertical-align: middle;">
                                    <span>{{$ownOsadaConsumable->replacement_interval_month}}ヶ月</span>
                                    <a class="btn btn-outline-primary rounded-pill w-50" style="margin-left:2rem;" data-toggle="modal" data-target="#update_interval{{$ownOsadaConsumable->id}}">変更</a>
                                    @include('productpromotion::admin.purchasedEquipment.modal.update', compact(['clinic_id', 'own_osada_equipment_id', 'ownOsadaConsumable']))
                                    @include('productpromotion::admin.purchasedEquipment.modal.update_interval', compact(['clinic_id', 'own_osada_equipment_id', 'ownOsadaConsumable']))
                                    @if($ownOsadaConsumable->is_applying_purchase == 1 && $ownOsadaConsumable->consumablePurchaseRequest->count() > 0)
                                        @include('productpromotion::admin.purchasedEquipment.modal.approve_purchase_request', compact(['clinic_id', 'own_osada_equipment_id', 'ownOsadaConsumable']))
                                    @endif
                                </td>
                            </tr>
                            @endforeach
                        @else
                            <tr>
                                <td colspan="7" style="text-align: center;">
                                    条件に該当する消耗品はありません。
                                </td>
                            </tr>
                        @endif
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="row">
                <div style="margin: 0 auto;" class="col-md-12 d-flex align-items-center justify-content-center">
                    {{ $ownOsadaConsumables->appends(request()->query())->links() }}
                </div>
            </div>
            <div class="row">
                <div class="col-md-12 d-flex align-items-center justify-content-center">
                    <a href="{{ route('productpromotion.admin.purchased-equipment.index', ['clinic_id' => $clinic_id]) }}" class="btn btn-sm btn-block button-go rounded-pill w-50">購入機器一覧へ戻る</a>
                </div>
            </div>
        </div>
    </div>
@stop

@section('css')
    <link rel="stylesheet" href="/css/admin_custom.css">
    <style>
        ul.guide{
            display:flex;
            list-style: none;
            clear:both;
        }
        ul.guide li:before {
            content: "";
            float:left;
            height: 100%;
            width: 3rem;
            margin-right: 5px;
        }
        ul.guide li{
            /*margin-left: 1em;*/
            font-weight: 700;
        }
        ul.guide li.series1:before {
            background-color:#F3D328;
        }
        ul.guide li.series2:before {
            background:#FF8F3F;
        }
        ul.guide li.series3:before {
            background-color:#FF6565;
        }
    </style>
@stop

@section('js')
    <script>
        $(function(){
            $('#number_of_month').change(function(){
                $('form#search').submit();
            });
        });
    </script>
@stop