krgm.so-manager-dev.com/resources/views/admin/periodical/list.blade.php
ou.zaikou e1629913bd 初回コミット
Signed-off-by:  ou.zaikou<caihaoweng@gmail.com>
2025-08-21 23:09:40 +09:00

227 lines
8.5 KiB
PHP

@extends('layouts.app')
@section('title', '定期利用・契約状況')
@section('content')
<div class="content-header">
<div class="container-fluid">
<div class="row mb-2">
<div class="col-lg-6">
<h1 class="m-0 text-dark">定期利用・契約状況</h1>
</div>
<div class="col-lg-6">
<ol class="breadcrumb float-sm-right text-sm">
<li class="breadcrumb-item"><a href="{{ route('home') }}">ホーム</a></li>
<li class="breadcrumb-item active">定期利用・契約状況</li>
</ol>
</div>
</div>
</div>
</div>
<section class="content">
<div class="container-fluid">
{{-- 検索条件 --}}
<div class="card mb-3">
<div class="card-body">
<form id="filter-form" class="form-inline" onsubmit="return false;">
<label class="mr-2">駐輪場:</label>
<select name="park_id" id="park_id" class="form-control mr-3">
<option value="">全て</option>
@foreach($parks as $pk)
<option value="{{ $pk->park_id }}" {{ (string) $pk->park_id === (string) ($selectedParkId ?? '') ? 'selected' : '' }}>
{{ $pk->park_name }}
</option>
@endforeach
</select>
</form>
<small class="text-muted d-block mt-2">以下に記載以外の期間情報を参照したい場合は、マスタ管理>定期期間マスタ のCSV出力を利用してください。</small>
</div>
</div>
{{-- 契約状況 --}}
<div class="card mb-4">
<div class="card-header bg-light">
<strong>契約状況</strong>
</div>
<div class="card-body p-0">
<div class="table-responsive">
<table class="table table-bordered mb-0 text-center">
<thead>
<tr>
<th rowspan="2" class="align-middle">契約状況</th>
<th colspan="2">一般</th>
<th colspan="2">学生</th>
<th rowspan="2" class="align-middle">利用計</th>
<th rowspan="2" class="align-middle">空き</th>
<th rowspan="2" class="align-middle">合計</th>
<th colspan="2">直近契約</th>
</tr>
<tr>
<th>件数</th>
<th><!-- 予備 --></th>
<th>件数</th>
<th><!-- 予備 --></th>
<th>予約日</th>
<th>契約日</th>
</tr>
</thead>
<tbody id="tbl-contract-summary"></tbody>
</table>
</div>
</div>
</div>
{{-- 空き待ち状況 --}}
<div class="card mb-4">
<div class="card-header bg-light">
<strong>空き待ち状況</strong>
</div>
<div class="card-body p-0">
<div class="table-responsive">
<table class="table table-bordered mb-0 text-center">
<thead>
<tr>
<th rowspan="2" class="align-middle">空き待ち状況</th>
<th colspan="2">一般</th>
<th colspan="2">学生</th>
<th rowspan="2" class="align-middle">合計</th>
</tr>
<tr>
<th>件数</th>
<th>先頭日</th>
<th>件数</th>
<th>先頭日</th>
</tr>
</thead>
<tbody id="tbl-waiting-summary"></tbody>
</table>
</div>
</div>
</div>
{{-- 更新状況 --}}
<div class="card mb-4">
<div class="card-header bg-light">
<strong>更新状況</strong>
</div>
<div class="card-body p-0">
<div class="table-responsive">
<table class="table table-bordered mb-0 text-center">
<thead>
<tr>
<th rowspan="2" class="align-middle" style="min-width:70px"></th>
<th colspan="3">自転車</th>
<th colspan="3">原付</th>
<th colspan="3">その他</th>
</tr>
<tr>
<th>一般</th>
<th>学生</th>
<th></th>
<th>一般</th>
<th>学生</th>
<th></th>
<th>一般</th>
<th>学生</th>
<th></th>
</tr>
</thead>
<tbody id="tbl-renewal-summary"></tbody>
</table>
</div>
</div>
</div>
</div>
</section>
@push('scripts')
<script>
$(function () {
loadStats();
$('#park_id').on('change', function () {
loadStats();
});
function loadStats() {
$.ajax({
url: "{{ route('periodical.listData') }}",
type: 'GET',
data: { park_id: $('#park_id').val() },
success: function (res) {
renderContractSummary(res.contract_summary || []);
renderWaitingSummary(res.waiting_summary || []);
renderRenewalSummary(res.renewal_summary || []);
},
error: function (xhr) {
console.error(xhr.responseText || xhr.statusText);
}
});
}
function nz(v) { return (v === null || v === undefined || v === '') ? '' : v; }
function renderContractSummary(rows) {
const $tb = $('#tbl-contract-summary').empty();
rows.forEach(r => {
$tb.append(`
<tr>
<td class="text-left">${r.type}</td>
<td>${nz(r.general_count)}</td>
<td>${nz(r.general_extra)}</td>
<td>${nz(r.student_count)}</td>
<td>${nz(r.student_extra)}</td>
<td>${nz(r.use_total)}</td>
<td>${nz(r.vacancy)}</td>
<td>${nz(r.total)}</td>
<td>${r.last && r.last.reserve_date ? r.last.reserve_date : ''}</td>
<td>${r.last && r.last.contract_date ? r.last.contract_date : ''}</td>
</tr>
`);
});
}
function renderWaitingSummary(rows) {
const $tb = $('#tbl-waiting-summary').empty();
rows.forEach(r => {
$tb.append(`
<tr>
<td class="text-left">${r.type}</td>
<td>${nz(r.general_count)}</td>
<td>${nz(r.general_head)}</td>
<td>${nz(r.student_count)}</td>
<td>${nz(r.student_head)}</td>
<td>${nz(r.total)}</td>
</tr>
`);
});
}
function renderRenewalSummary(rows) {
const $tb = $('#tbl-renewal-summary').empty();
rows.forEach(r => {
$tb.append(`
<tr>
<td class="text-left">${r.month}</td>
<td>${nz(r.bicycle_general)}</td>
<td>${nz(r.bicycle_student)}</td>
<td>${nz(r.bicycle_total)}</td>
<td>${nz(r.moped_general)}</td>
<td>${nz(r.moped_student)}</td>
<td>${nz(r.moped_total)}</td>
<td>${nz(r.others_general)}</td>
<td>${nz(r.others_student)}</td>
<td>${nz(r.others_total)}</td>
</tr>
`);
});
}
});
</script>
@endpush
@endsection