@extends('layouts.main')

@section('pageTitle', '臨停計費內容設定-單位時段上限計費 NEW')

@section('content')
<div class="col-12 col-sm-12">
    <div class="card card-primary card-outline card-outline-tabs">
        <div class="card-header p-0 border-bottom-0">
        @inject('thidLevel','App\Presenters\ThirdLevelPresenter')
        {!! $thidLevel->createVehicleTab('billingContent', $data->vehicle_id) !!}
        </div>
        <div class="card-body">
            <div class="tab-content" id="thirdLevel-tabContent">
                <div class="tab-pane fade show active" id="" role="tabpanel">
                    <input type="hidden" id="vehicleType" value="{{ $data->vehicle_id }}">
                    <form action="{{ route('newFeeIntervalLimit.update', $data->vehicle_id) }}" method="post">
                        @csrf
                        @method('PUT')
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label for="current_fee_type">收費方式</label>
                                <select class="form-control" id="feeType">
                                    @foreach(config('webCommonData.feeTypeDropdown') as $id => $name)
                                        @if($id != 8)
                                            <option value="{{ $id }}" @if($id == 9) selected @endif>{{ $name }}</option>
                                        @endif
                                    @endforeach
                                </select>
                            </div>

                            <h4 style="text-align: center;">共同設定</h4>
                            <div class="form-group">
                                <label for="free_time">入場後免費時間(分)</label>
                                <input type="text" class="form-control" placeholder="入場後免費時間(分)" name="free_time" value="{{ old('free_time', $data->free_time) }}">
                                @error('free_time')
                                    <span id="free_time-error" class="validateError">{{ $message }}</span>
                                @enderror
                            </div>
                            <div class="form-group">
                                <label for="buffer_time">繳費出場緩衝時間(分)</label>
                                <input type="text" class="form-control" placeholder="繳費出場緩衝時間(分)" name="buffer_time" value="{{ old('buffer_time', $data->buffer_time) }}">
                                @error('buffer_time')
                                    <span id="buffer_time-error" class="validateError">{{ $message }}</span>
                                @enderror
                            </div>
                            <div class="form-group">
                                <label for="is_day_settlement">是否日結</label>
                                <select class="form-control" name="is_day_settlement">
                                    @foreach(config('webCommonData.yesOrNoDropdown') as $id => $name)
                                        <option value="{{ $id }}" @if(old('is_day_settlement', $data->is_day_settlement) == $id) selected @endif>{{ $name }}</option>
                                    @endforeach
                                </select>
                                @error('is_day_settlement')
                                    <span id="is_day_settlement-error" class="validateError">{{ $message }}</span>
                                @enderror
                            </div>
                            <div class="form-group">
                                <label for="is_day_across_settlement">平日跨假日/假日跨平日是否先結算(日結不適用)</label>
                                <select class="form-control" name="is_day_across_settlement">
                                    @foreach(config('webCommonData.yesOrNoDropdown') as $id => $name)
                                        <option value="{{ $id }}" @if(old('is_day_across_settlement', $data->is_day_across_settlement) == $id) selected @endif>{{ $name }}</option>
                                    @endforeach
                                </select>
                                @error('is_day_across_settlement')
                                    <span id="is_day_across_settlement-error" class="validateError">{{ $message }}</span>
                                @enderror
                            </div>
                            <div class="form-group">
                            <label for="common_limit_hour">平假日非日結時間上限(時)</label>
                            <input type="text" class="form-control" name="common_limit_hour" value="{{ old('common_limit_hour', $data->common_limit_hour) }}">
                                @error('common_limit_hour')
                                    <span id="common_limit_hour-error" class="validateError">{{ $message }}</span>
                                @enderror
                            </div>
                            <h4 style="text-align: center;">平日設定</h4>
                            <div class="form-group">
                                <label for="workday_max_price">日結/非日結最大收費金額</label> ※ 輸入 0 為無上限金額
                                <input type="text" class="form-control" placeholder="日結/非日結最大收費金額" name="workday_max_price" value="{{ old('workday_max_price', $data->workday_max_price) }}">
                                @error('workday_max_price')
                                    <span id="workday_max_price-error" class="validateError">{{ $message }}</span>
                                @enderror
                            </div>
                            <div class="form-group">
                                <label for="workday_first_frequency">首發單位次數</label>※ 輸入  0 為無首發
                                <span style="font-weight: bold; font-size:12px;">※ 若首發單位長度為60分，首發單位次數為2，首發收費金額為10，表示有兩段首發時間，入場後第一個小時收費10元，第二個小時收費20元，超過兩小時後以單位時間與單位計費金額計算費用。</span>
                                <input type="text" class="form-control" placeholder="首發單位次數" name="workday_first_frequency" value="{{ old('workday_first_frequency', $data->workday_first_frequency) }}">
                                @error('workday_first_frequency')
                                    <span id="workday_first_frequency-error" class="validateError">{{ $message }}</span>
                                @enderror
                            </div>
                            <div class="form-group">
                                <label for="workday_limit_hour">非日結時間上限(時)</label>
                                <input type="text" class="form-control" name="workday_limit_hour" value="{{ old('workday_limit_hour', $data->workday_limit_hour) }}">
                                @error('workday_limit_hour')
                                    <span id="workday_limit_hour-error" class="validateError">{{ $message }}</span>
                                @enderror
                            </div>
                            <h4 style="text-align: center;">假日設定</h4>
                            <div class="form-group">
                                <label for="holiday_max_price">日結/非日結最大收費金額</label> ※ 輸入 0 為無上限金額
                                <input type="text" class="form-control" placeholder="日結/非日結最大收費金額" name="holiday_max_price" value="{{ old('holiday_max_price', $data->holiday_max_price) }}">
                                @error('holiday_max_price')
                                    <span id="holiday_max_price-error" class="validateError">{{ $message }}</span>
                                @enderror
                            </div>
                            <div class="form-group">
                                <label for="holiday_first_frequency">首發單位次數</label>※ 輸入 0 為無首發
                                <input type="text" class="form-control" placeholder="首發單位次數" name="holiday_first_frequency" value="{{ old('holiday_first_frequency', $data->holiday_first_frequency) }}">
                                @error('holiday_first_frequency')
                                    <span id="holiday_first_frequency-error" class="validateError">{{ $message }}</span>
                                @enderror
                            </div>
                            <div class="form-group">
                                <label for="holiday_limit_hour">非日結時間上限(時)</label>
                                <input type="text" class="form-control" name="holiday_limit_hour" value="{{ old('holiday_limit_hour', $data->holiday_limit_hour) }}">
                                @error('holiday_limit_hour')
                                    <span id="holiday_limit_hour-error" class="validateError">{{ $message }}</span>
                                @enderror
                            </div>
                        </div>
                        @inject('checkSegmentService', 'App\Services\CheckSegmentService')
                        @if (!$checkSegmentService->legality('newIntervalLimit', $data->vehicle_id))
                            <div style="color: red; font-size: 20px;">※ 時段設定不正確</div>
                        @endif

                        @inject('feeIntervalLimitPresenter','App\Presenters\NewFeeIntervalLimitPresenter')
                        {!! $feeIntervalLimitPresenter->createSegmentTab($data->vehicle_id) !!}
                        @can('billingContent.update')
                            <button type="submit" class="btn btn-info" id="saveButton">儲存計費</button>
                        @endcan
                        @can('segmentUnitLimit.create')
                            <a class="btn btn-danger" href="{{ route('newSegmentUnitLimit.create', $data->vehicle_id) }}">新增時段</a>
                        @endcan
                    </form>
                </div>
            </div>
        </div>
        <!-- /.card -->
    </div>
</div>
@endsection

@section('js')
@include('include.datePickerAndMask')
@include('billingSetting.billingContent.feeCommonSection')
<script>
$(document).ready(function () {
    inputData = {
        common_limit_hour: {{ old('common_limit_hour', $data->common_limit_hour) }},
        workday_max_price: {{ old('workday_max_price', $data->workday_max_price) }},
        holiday_max_price: {{ old('holiday_max_price', $data->holiday_max_price) }},
        workday_first_frequency: {{ old('workday_first_frequency', $data->workday_first_frequency) }},
        holiday_first_frequency: {{ old('holiday_first_frequency', $data->holiday_first_frequency) }},
        workday_limit_hour: {{ old('workday_limit_hour', $data->workday_limit_hour) }},
        holiday_limit_hour: {{ old('holiday_limit_hour', $data->holiday_limit_hour) }},
    };
    // 初始化
    initializeForm();
    // 事件綁定
    bindEvents();
});

function initializeForm() {
    toggleDaySettlement();
    toggleDayAcrossSettlement();
}

function bindEvents() {
    $('input[type=text]').on('change', function(e) {
        inputData[$(this).attr('name')] = $(this).val();
    });

    // 設定相關欄位變更
    $('[name=is_day_settlement], [name=is_day_across_settlement], [name=workday_max_price], [name=holiday_max_price]').on('change', function(e) {
        toggleDaySettlement();
        toggleDayAcrossSettlement();
    });

    // 刪除按鈕
    $('button[behavior=delete]').click(function (e) {
        var deleteUrl = '{{ route("newSegmentUnitLimit.destroy", ":id") }}';
        segmentDeleteAjax(deleteUrl.replace(':id', $(this).attr('targetId')), $(this));
    });

    // 儲存按鈕點擊事件
    $('#saveButton').click(function(e) {
        e.preventDefault();
        checkLimitHour();
        enableDisabledFieldsBeforeSubmit();
        $(this).closest('form').submit();
    });
}
// 切換是否日結
function toggleDaySettlement() {
    var isDaySettlement = $('[name=is_day_settlement]').val();
    if (isDaySettlement == 1) {
        // 日結模式：禁用相關欄位
        // 平日跨假日/假日跨平日是否先結算(時) 禁用
        // 平假日非日結時間上限(時) 禁用
        // 平日非日結時間上限(時) 禁用
        // 假日非日結時間上限(時) 禁用
        $('[name=is_day_across_settlement]').prop('disabled', true).val(0);
        $('[name=common_limit_hour]').prop('disabled', true).attr('placeholder', '-').val(null);
        $('[name=workday_limit_hour]').prop('disabled', true).attr('placeholder', '-').val(null);
        $('[name=holiday_limit_hour]').prop('disabled', true).attr('placeholder', '-').val(null);
        return;
    }

    // 非日結模式：啟用相關欄位
    // 平日跨假日/假日跨平日是否先結算(時) 啟用
    // 平假日非日結時間上限(時) 啟用
    $('[name=is_day_across_settlement], [name=common_limit_hour]').prop('disabled', false);
    $('[name=workday_limit_hour], [name=holiday_limit_hour]').attr('placeholder', '-');
    $('[name=common_limit_hour]').removeAttr('placeholder');
}
// 切換平假跨是否先結算
function toggleDayAcrossSettlement() {
    // 日結模式不處理
    var isDaySettlement = $('[name=is_day_settlement]').val();
    if (isDaySettlement == 1) {
        return;
    }

    $('[name=is_day_across_settlement]').prop('disabled', false);
    // 平日跨假日/假日跨平日是否先結算 為否：使用共同時間上限
    $('[name=common_limit_hour]').prop('disabled', false).removeAttr('placeholder').val(inputData.common_limit_hour);
    $('[name=workday_limit_hour], [name=holiday_limit_hour]').prop('disabled', true).attr('placeholder', '-').val(null);
    // 如果任一最大收費金額為0，則禁用共同時間上限，並禁用平假跨先結算
    if ($('[name=workday_max_price]').val() == 0 || $('[name=holiday_max_price]').val() == 0) {
        $('[name=common_limit_hour]').prop('disabled', true).attr('placeholder', '-').val(null);
        $('[name=is_day_across_settlement]').prop('disabled', true).val(0);
    }

    var isDayAcrossSettlement = $('[name=is_day_across_settlement]').val();
    // 平假跨先結算模式
    if (isDayAcrossSettlement == 1) {
        // 平假跨先結算模式：使用個別時間上限
        $('[name=common_limit_hour]').prop('disabled', true).attr('placeholder', '-').val(null);
        $('[name=workday_limit_hour]').prop('disabled', false).removeAttr('placeholder').val(inputData.workday_limit_hour);
        $('[name=holiday_limit_hour]').prop('disabled', false).removeAttr('placeholder').val(inputData.holiday_limit_hour);
        // 檢查最大收費金額，如果為0則禁用對應的時間上限
        if ($('[name=workday_max_price]').val() == 0) {
            $('[name=workday_limit_hour]').prop('disabled', true).attr('placeholder', '-').val(null);
        }
        if ($('[name=holiday_max_price]').val() == 0) {
            $('[name=holiday_limit_hour]').prop('disabled', true).attr('placeholder', '-').val(null);
        }
    }

    return;
}

/**
 * 在提交表單前暫時啟用被禁用的欄位，確保值能被正確提交
 */
function enableDisabledFieldsBeforeSubmit() {
    // 暫時啟用所有被禁用的相關欄位，讓表單能正確提交其值
    $('[name=is_day_across_settlement]').prop('disabled', false);
}

// 檢查並調整最大收費金額
function checkLimitHour() {
    var isDaySettlement = $('[name=is_day_settlement]').val();

    // 只有在非日結模式下才檢查
    if (isDaySettlement == 0) {
        var allLimitHoursDisabled =
            $('[name=common_limit_hour]').prop('disabled') &&
            $('[name=holiday_limit_hour]').prop('disabled') &&
            $('[name=workday_limit_hour]').prop('disabled');

        // 如果所有時間上限欄位都被禁用，則將最大收費金額設為0
        if (allLimitHoursDisabled) {
            $('[name=workday_max_price]').val(0);
            $('[name=holiday_max_price]').val(0);
        }

        if ($('[name=workday_max_price]').val() == 0 || $('[name=holiday_max_price]').val() == 0) {
            $('[name=workday_max_price], [name=holiday_max_price]').val(0);
            $('[name=is_day_across_settlement]').prop('disabled', true).val(0);
        }
    }
}
</script>
@endsection