71 lines
2.5 KiB
Plaintext
71 lines
2.5 KiB
Plaintext
@using System.Text.Json
|
|
@model List<Uriagekun.Lib.Data.GoodRegisterData>
|
|
@{
|
|
ViewData["Title"] = $"{Model[0].Label} - 売上管理";
|
|
}
|
|
|
|
<div class="container-fluid">
|
|
<h2>@(Model[0].Label)</h2>
|
|
<div class="m-2">
|
|
<canvas id="lineChart"></canvas>
|
|
</div>
|
|
<div class="table-responsive">
|
|
<table class="table table-bordered table-stripped">
|
|
<thead>
|
|
<tr>
|
|
<th>日時</th>
|
|
<th>販売個数</th>
|
|
<th>販売単価</th>
|
|
<th>純利益</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
@foreach(var data in Model) {
|
|
<tr>
|
|
<td>@(data.Date.ToString("yyyy/MM/dd"))</td>
|
|
<td>@(data.Count)</td>
|
|
<td>@(data.Price.ToString("c"))</td>
|
|
<td>@((data.Count * data.Price).ToString("c"))</td>
|
|
</tr>
|
|
}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<script type="application/json" id="chartData">@Html.Raw(JsonSerializer.Serialize(Model))</script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.js"></script>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const chartData = JSON.parse(document.getElementById('chartData').textContent);
|
|
const canvas = document.getElementById('lineChart');
|
|
const lineChart = new Chart(canvas, {
|
|
type: 'line',
|
|
data: {
|
|
labels: chartData.map(d => d.Date),
|
|
datasets: [
|
|
{
|
|
label: "販売個数",
|
|
data: chartData.map(d => d.Count),
|
|
borderColor: 'rgba(255, 255, 0, 1)',
|
|
backgroundColor: 'rgba(0, 0, 0, 0)',
|
|
},
|
|
{
|
|
label: "販売金額",
|
|
data: chartData.map(d => d.Price),
|
|
borderColor: 'rgba(255, 0, 0, 1)',
|
|
backgroundColor: 'rgba(0, 0, 0, 0)',
|
|
},
|
|
{
|
|
label: "純利益",
|
|
data: chartData.map(d => d.Count * d.Price),
|
|
borderColor: 'rgba(0, 255, 0, 1)',
|
|
backgroundColor: 'rgba(0, 0, 0, 0)',
|
|
},
|
|
],
|
|
},
|
|
options: {
|
|
},
|
|
});
|
|
});
|
|
</script>
|