グラフページを対象期間ごとに掘り下げる形に変更
This commit is contained in:
14
resources/views/components/profile-mini.blade.php
Normal file
14
resources/views/components/profile-mini.blade.php
Normal file
@@ -0,0 +1,14 @@
|
||||
<div class="d-flex flex-row align-items-end">
|
||||
<img src="{{ $user->getProfileImageUrl(48) }}" srcset="{{ Formatter::profileImageSrcSet($user, 48) }}" class="rounded mr-2">
|
||||
<div class="d-flex flex-column overflow-hidden">
|
||||
<h5 class="card-title text-truncate">
|
||||
<a class="text-dark" href="{{ route('user.profile', ['name' => $user->name]) }}">{{ $user->display_name }}</a>
|
||||
</h5>
|
||||
<h6 class="card-subtitle">
|
||||
<a class="text-muted" href="{{ route('user.profile', ['name' => $user->name]) }}">@{{ $user->name }}</a>
|
||||
@if ($user->is_protected)
|
||||
<span class="oi oi-lock-locked text-muted"></span>
|
||||
@endif
|
||||
</h6>
|
||||
</div>
|
||||
</div>
|
@@ -4,8 +4,17 @@
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-4">
|
||||
@component('components.profile', ['user' => $user])
|
||||
@endcomponent
|
||||
@if (Route::currentRouteName() === 'user.profile')
|
||||
@component('components.profile', ['user' => $user])
|
||||
@endcomponent
|
||||
@else
|
||||
<div class="card mb-4">
|
||||
<div class="card-body">
|
||||
@component('components.profile-mini', ['user' => $user])
|
||||
@endcomponent
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
@section('sidebar')
|
||||
@show
|
||||
</div>
|
||||
@@ -15,7 +24,7 @@
|
||||
<a class="nav-link {{ Route::currentRouteName() === 'user.profile' ? 'active' : '' }}" href="{{ route('user.profile', ['name' => $user->name]) }}">タイムライン</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link {{ Route::currentRouteName() === 'user.stats' ? 'active' : '' }}" href="{{ route('user.stats', ['name' => $user->name]) }}">グラフ</a>
|
||||
<a class="nav-link {{ stripos(Route::currentRouteName(), 'user.stats') === 0 ? 'active' : '' }}" href="{{ route('user.stats', ['name' => $user->name]) }}">グラフ</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link {{ Route::currentRouteName() === 'user.okazu' ? 'active' : '' }}" href="{{ route('user.okazu', ['name' => $user->name]) }}">オカズ</a>
|
||||
|
20
resources/views/user/stats/all.blade.php
Normal file
20
resources/views/user/stats/all.blade.php
Normal file
@@ -0,0 +1,20 @@
|
||||
@extends('user.stats.base')
|
||||
|
||||
@section('title', $user->display_name . ' さんのグラフ')
|
||||
|
||||
@section('stats-content')
|
||||
<h5 class="my-4">年間チェックイン回数</h5>
|
||||
<canvas id="yearly-graph" class="w-100"></canvas>
|
||||
<hr class="my-4">
|
||||
<h5 class="my-4">時間別チェックイン回数</h5>
|
||||
<canvas id="hourly-graph" class="w-100"></canvas>
|
||||
<hr class="my-4">
|
||||
<h5 class="my-4">曜日別チェックイン回数</h5>
|
||||
<canvas id="dow-graph" class="w-100"></canvas>
|
||||
@endsection
|
||||
|
||||
@push('script')
|
||||
<script id="graph-data" type="application/json">@json($graphData)</script>
|
||||
<script src="{{ mix('js/vendor/chart.js') }}"></script>
|
||||
<script src="{{ mix('js/user/stats.js') }}"></script>
|
||||
@endpush
|
70
resources/views/user/stats/base.blade.php
Normal file
70
resources/views/user/stats/base.blade.php
Normal file
@@ -0,0 +1,70 @@
|
||||
@extends('user.base')
|
||||
|
||||
@section('sidebar')
|
||||
@if (!$user->is_protected || $user->isMe())
|
||||
<div class="nav d-none d-lg-flex flex-column nav-pills" aria-orientation="vertical">
|
||||
<a class="nav-link {{ Route::currentRouteName() === 'user.stats.all' ? 'active' : '' }}"
|
||||
href="{{ route('user.stats.all', ['name' => $user->name]) }}">全期間</a>
|
||||
@foreach ($availableMonths as $year => $months)
|
||||
<div class="border-top mt-1">
|
||||
<a class="nav-link mt-1 {{ Route::currentRouteName() === 'user.stats.yearly' && $currentYear === $year ? 'active' : '' }}"
|
||||
href="{{ route('user.stats.yearly', ['name' => $user->name, 'year' => $year]) }}">{{ $year }}年</a>
|
||||
@foreach ($months as $month)
|
||||
<a class="nav-link ml-3 {{ Route::currentRouteName() === 'user.stats.monthly' && $currentYear === $year && $currentMonth === $month ? 'active' : '' }}"
|
||||
href="{{ route('user.stats.monthly', ['name' => $user->name, 'year' => $year, 'month' => $month]) }}">{{ $month }}月</a>
|
||||
@endforeach
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
@endif
|
||||
@endsection
|
||||
|
||||
@section('tab-content')
|
||||
@if ($user->is_protected && !$user->isMe())
|
||||
<p class="mt-4">
|
||||
<span class="oi oi-lock-locked"></span> このユーザはチェックイン履歴を公開していません。
|
||||
</p>
|
||||
@else
|
||||
<div class="row my-2 d-lg-none">
|
||||
<div class="col-12 text-secondary font-weight-bold small">グラフの対象期間</div>
|
||||
<div class="col-6 text-secondary small">年</div>
|
||||
<div class="col-6 text-secondary small">月</div>
|
||||
<div class="col-12">
|
||||
<ul class="nav nav-pills nav-fill">
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
|
||||
{{ Route::currentRouteName() === 'user.stats.all' ? '全期間' : "{$currentYear}年" }}
|
||||
</a>
|
||||
<div class="dropdown-menu">
|
||||
<a href="{{ route('user.stats.all', ['name' => $user->name]) }}" class="dropdown-item">全期間</a>
|
||||
@foreach ($availableMonths as $year => $months)
|
||||
<a href="{{ route('user.stats.yearly', ['name' => $user->name, 'year' => $year]) }}" class="dropdown-item">{{ $year }}年</a>
|
||||
@endforeach
|
||||
</div>
|
||||
</li>
|
||||
@if (Route::currentRouteName() === 'user.stats.all')
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle disabled"
|
||||
href="#" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">全期間</a>
|
||||
</li>
|
||||
@else
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle"
|
||||
href="#" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
|
||||
{{ Route::currentRouteName() === 'user.stats.yearly' ? '全期間' : "{$currentMonth}月" }}
|
||||
</a>
|
||||
<div class="dropdown-menu">
|
||||
<a href="{{ route('user.stats.yearly', ['name' => $user->name, 'year' => $year]) }}" class="dropdown-item">全期間</a>
|
||||
@foreach ($availableMonths[$currentYear] as $month)
|
||||
<a href="{{ route('user.stats.monthly', ['name' => $user->name, 'year' => $year, 'month' => $month]) }}" class="dropdown-item">{{ $month }}月</a>
|
||||
@endforeach
|
||||
</div>
|
||||
</li>
|
||||
@endif
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row d-lg-none no-gutters border-bottom"></div>
|
||||
@yield('stats-content')
|
||||
@endif
|
||||
@endsection
|
17
resources/views/user/stats/monthly.blade.php
Normal file
17
resources/views/user/stats/monthly.blade.php
Normal file
@@ -0,0 +1,17 @@
|
||||
@extends('user.stats.base')
|
||||
|
||||
@section('title', $user->display_name . ' さんのグラフ')
|
||||
|
||||
@section('stats-content')
|
||||
<h5 class="my-4">時間別チェックイン回数</h5>
|
||||
<canvas id="hourly-graph" class="w-100"></canvas>
|
||||
<hr class="my-4">
|
||||
<h5 class="my-4">曜日別チェックイン回数</h5>
|
||||
<canvas id="dow-graph" class="w-100"></canvas>
|
||||
@endsection
|
||||
|
||||
@push('script')
|
||||
<script id="graph-data" type="application/json">@json($graphData)</script>
|
||||
<script src="{{ mix('js/vendor/chart.js') }}"></script>
|
||||
<script src="{{ mix('js/user/stats.js') }}"></script>
|
||||
@endpush
|
@@ -1,4 +1,4 @@
|
||||
@extends('user.base')
|
||||
@extends('user.stats.base')
|
||||
|
||||
@section('title', $user->display_name . ' さんのグラフ')
|
||||
|
||||
@@ -6,34 +6,18 @@
|
||||
<link rel="stylesheet" href="//cdn.jsdelivr.net/cal-heatmap/3.3.10/cal-heatmap.css" />
|
||||
@endpush
|
||||
|
||||
@section('tab-content')
|
||||
@if ($user->is_protected && !$user->isMe())
|
||||
<p class="mt-4">
|
||||
<span class="oi oi-lock-locked"></span> このユーザはチェックイン履歴を公開していません。
|
||||
</p>
|
||||
@else
|
||||
@section('stats-content')
|
||||
<h5 class="my-4">Shikontribution graph</h5>
|
||||
<div id="cal-heatmap" class="tis-contribution-graph"></div>
|
||||
<hr class="my-4">
|
||||
<div class="row my-4">
|
||||
<div class="col-12 col-lg-6 d-flex align-items-center">
|
||||
<h5 class="my-0">月間チェックイン回数</h5>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6 mt-2 mt-lg-0">
|
||||
<select id="monthly-term" class="form-control"></select>
|
||||
</div>
|
||||
</div>
|
||||
<h5 class="my-4">月間チェックイン回数</h5>
|
||||
<canvas id="monthly-graph" class="w-100"></canvas>
|
||||
<hr class="my-4">
|
||||
<h5 class="my-4">年間チェックイン回数</h5>
|
||||
<canvas id="yearly-graph" class="w-100"></canvas>
|
||||
<hr class="my-4">
|
||||
<h5 class="my-4">時間別チェックイン回数</h5>
|
||||
<canvas id="hourly-graph" class="w-100"></canvas>
|
||||
<hr class="my-4">
|
||||
<h5 class="my-4">曜日別チェックイン回数</h5>
|
||||
<canvas id="dow-graph" class="w-100"></canvas>
|
||||
@endif
|
||||
@endsection
|
||||
|
||||
@push('script')
|
Reference in New Issue
Block a user