Final cleanup

This commit is contained in:
Bernd Bestel 2023-04-01 16:57:37 +02:00
parent 6cfee78b95
commit c781bb4ff1
No known key found for this signature in database
GPG Key ID: 71BD34C0D4891300
5 changed files with 77 additions and 90 deletions

View File

@ -2375,43 +2375,31 @@ msgstr ""
msgid "Track chore execution now"
msgstr ""
msgid "by Product"
msgstr ""
msgid "by Group"
msgstr ""
msgid "Total"
msgstr ""
msgid "Apply"
msgstr ""
msgid "Custom Range"
msgid "Custom range"
msgstr ""
msgid "Yesterday"
msgstr ""
msgid "Last 7 Days"
msgid "Last %1$s days"
msgstr ""
msgid "Last 14 Days"
msgid "This month"
msgstr ""
msgid "Last 30 Days"
msgid "Last month"
msgstr ""
msgid "This Month"
msgid "This year"
msgstr ""
msgid "Last Month"
msgstr ""
msgid "This Year"
msgstr ""
msgid "Last Year"
msgid "Last year"
msgstr ""
msgid "Reports"

View File

@ -12,6 +12,7 @@
"bootstrap-select": "^1.13.18",
"bwip-js": "^3.0.1",
"chart.js": "^2.8.0",
"chartjs-plugin-colorschemes": "^0.4.0",
"chartjs-plugin-doughnutlabel": "^2.0.3",
"chartjs-plugin-piechart-outlabels": "^0.1.4",
"datatables.net": "^1.10.22",
@ -23,7 +24,7 @@
"datatables.net-rowgroup-bs4": "^1.1.2",
"datatables.net-select": "^1.3.1",
"datatables.net-select-bs4": "^1.3.1",
"daterangepicker": "dangrossman/daterangepicker",
"daterangepicker": "^3.1.0",
"fullcalendar": "^3.10.1",
"gettext-translator": "2.1.0",
"jquery": "^3.6.0",

View File

@ -1,44 +1,26 @@
/* Charting */
var labels = [];
var data = [];
var totalAmount = 0;
var totalAmount = 0.0;
$("#metrics-table tbody tr").each(function()
{
var self = $(this);
labels.push(self.find("td:eq(0)").attr("data-chart-label"));
var itemTotalRaw = Number.parseFloat(self.find("td:eq(1)").attr("data-chart-value"));
var itemTotal = Number.parseFloat((Math.round(itemTotalRaw * 100) / 100).toFixed(2));
var itemTotal = Number.parseFloat(self.find("td:eq(1)").attr("data-chart-value"));
data.push(itemTotal);
totalAmount = (Number.parseFloat(totalAmount) + Number.parseFloat(itemTotal));
totalAmount += + itemTotal;
});
totalAmount = totalAmount.toLocaleString(undefined, { style: "currency", currency: Grocy.Currency });
var backgroundColorChoices = [
"#6C747C",
"#BFB8A4",
"#BFADA4",
"#4F575E",
"#918B78",
"#343A40",
"#635E4F",
"#63554F",
"#1A1F24",
"#383426",
"#382C26",
"#121B25",
"#383119",
"#382319"
]
var backgroundColors = [];
var colorChoiceIndex = 0;
for (i = 0; i < data.length; i++)
{
if ((i + 1) == (backgroundColorChoices.length))
if (i + 1 == Chart.colorschemes.brewer.Paired12.length)
{
// restart background color choices
// Restart background color choices
colorChoiceIndex = 1;
}
backgroundColors.push(backgroundColorChoices[colorChoiceIndex]);
backgroundColors.push(Chart.colorschemes.brewer.Paired12[colorChoiceIndex]);
colorChoiceIndex++;
}
@ -51,15 +33,14 @@ var metricsChart = new Chart("metrics-chart", {
"tooltips": {
"enabled": false
},
"tooltips": { enabled: false },
"tooltips": {
"enabled": false
},
"plugins": {
"outlabels": {
"text": "%l %p",
"backgroundColor": "#343a40",
"color": "white",
"stretch": 45,
"font": {
"resizable": true,
"minSize": 12,
"maxSize": 18
}
@ -90,7 +71,6 @@ var metricsChart = new Chart("metrics-chart", {
});
/* DataTables */
var metricsTable = $("#metrics-table").DataTable({
"columnDefs": [
{ "type": "num", "targets": 1 }
@ -99,10 +79,8 @@ var metricsTable = $("#metrics-table").DataTable({
$("#metrics-table tbody").removeClass("d-none");
metricsTable.columns.adjust().draw();
/* DateRangePicker */
var startDate = moment().startOf("month").format("YYYY-MM-DD");
var endDate = moment().endOf("month").format("YYYY-MM-DD");
if (GetUriParam("start_date"))
{
startDate = moment(GetUriParam("start_date"));
@ -115,16 +93,20 @@ if (GetUriParam("end_date"))
var ranges = {};
ranges[__t("Today")] = [moment(), moment()];
ranges[__t("Yesterday")] = [moment().subtract(1, "days"), moment().subtract(1, "days")];
ranges[__t("Last 7 Days")] = [moment().subtract(6, "days"), moment()];
ranges[__t("Last 14 Days")] = [moment().subtract(13, "days"), moment()];
ranges[__t("Last 30 Days")] = [moment().subtract(29, "days"), moment()];
ranges[__t("This Month")] = [moment().startOf("month"), moment().endOf("month")];
ranges[__t("Last Month")] = [moment().subtract(1, "month").startOf("month"), moment().subtract(1, "month").endOf("month")];
ranges[__t("This Year")] = [moment().startOf("year"), moment().endOf("year")];
ranges[__t("Last Year")] = [moment().subtract(1, "year").startOf("year"), moment().subtract(1, "year").endOf("year")];
ranges[__t("Last %1$s days", "7")] = [moment().subtract(6, "days"), moment()];
ranges[__t("Last %1$s days", "14")] = [moment().subtract(13, "days"), moment()];
ranges[__t("Last %1$s days", "30")] = [moment().subtract(29, "days"), moment()];
ranges[__t("This month")] = [moment().startOf("month"), moment().endOf("month")];
ranges[__t("Last month")] = [moment().subtract(1, "month").startOf("month"), moment().subtract(1, "month").endOf("month")];
ranges[__t("This year")] = [moment().startOf("year"), moment().endOf("year")];
ranges[__t("Last year")] = [moment().subtract(1, "year").startOf("year"), moment().subtract(1, "year").endOf("year")];
$("#daterange-filter").daterangepicker({
"showDropdowns": true,
"alwaysShowCalendars": true,
"buttonClasses": "btn",
"applyButtonClasses": "btn-primary",
"cancelButtonClasses": "btn-secondary",
"startDate": startDate,
"endDate": endDate,
"showWeekNumbers": Grocy.CalendarShowWeekNumbers,
@ -134,7 +116,7 @@ $("#daterange-filter").daterangepicker({
},
"applyLabel": __t("Apply"),
"cancelLabel": __t("Cancel"),
"customRangeLabel": __t("Custom Range"),
"customRangeLabel": __t("Custom range"),
"ranges": ranges
}, function(start, end, label)
{
@ -145,7 +127,7 @@ $("#daterange-filter").daterangepicker({
$("#daterange-filter").on("cancel.daterangepicker", function(ev, picker)
{
$(this).val(start_date + " - " + end_date);
$(this).val(startDate + " - " + endDate);
});
$("#clear-filter-button").on("click", function()

View File

@ -5,8 +5,9 @@
@push('pageScripts')
<script src="{{ $U('/node_modules/chart.js/dist/Chart.min.js?v=', true) }}{{ $version }}"></script>
<script src="{{ $U('/node_modules/chartjs-plugin-colorschemes/dist/chartjs-plugin-colorschemes.min.js?v=', true) }}{{ $version}}"></script>
<script src="{{ $U('/node_modules/chartjs-plugin-doughnutlabel/dist/chartjs-plugin-doughnutlabel.js?v=', true) }}{{ $version }}"></script>
<script src="{{ $U('/node_modules/chartjs-plugin-piechart-outlabels/dist/chartjs-plugin-piechart-outlabels.js?v=', true) }}{{ $version}}"></script>
<script src="{{ $U('/node_modules/chartjs-plugin-piechart-outlabels/dist/chartjs-plugin-piechart-outlabels.min.js?v=', true) }}{{ $version}}"></script>
<script src="{{ $U('/node_modules/daterangepicker/daterangepicker.js?v=', true) }}{{ $version }}"></script>
@endpush
@ -22,28 +23,33 @@
<h2 class="title mr-2 order-0">
@yield('title')
</h2>
<h2 class="mb-0 mr-auto order-3 order-md-1 width-xs-sm-100">
<span id="info-current-stock"
class="text-muted small"></span>
</h2>
<button class="btn btn-outline-dark d-md-none mt-2 float-right order-1 order-md-3"
type="button"
data-toggle="collapse"
data-target="#related-links">
<i class="fa-solid fa-ellipsis-v"></i>
</button>
<div class="related-links collapse d-md-flex order-2 width-xs-sm-100"
id="related-links">
<a class="btn btn-outline-dark responsive-button @if(!$byGroup) active @endif m-1 mt-md-0 mb-md-0 float-right"
href="{{ $U('/stockreports/spendings') }}">
{{ $__t('by Product') }}
</a>
<div class="float-right">
<button class="btn btn-outline-dark d-md-none mt-2 order-1 order-md-3"
type="button"
data-toggle="collapse"
data-target="#table-filter-row">
<i class="fa-solid fa-filter"></i>
</button>
<button class="btn btn-outline-dark d-md-none mt-2 order-1 order-md-3"
type="button"
data-toggle="collapse"
data-target="#related-links">
<i class="fa-solid fa-ellipsis-v"></i>
</button>
</div>
<div class="related-links collapse d-md-flex order-2 width-xs-sm-100"
id="related-links">
<a class="btn btn-outline-dark responsive-button @if($byGroup) active @endif m-1 mt-md-0 mb-md-0 float-right"
<a class="btn btn-link responsive-button m-1 mt-md-0 mb-md-0 @if(!$byGroup) active @endif discrete-link disabled"
href="#">
{{ $__t('Group by') }}:
</a>
<a class="btn btn-outline-dark responsive-button m-1 mt-md-0 mb-md-0 float-right @if(!$byGroup) active @endif"
href="{{ $U('/stockreports/spendings') }}">
{{ $__t('Product') }}
</a>
<a class="btn btn-outline-dark responsive-button m-1 mt-md-0 mb-md-0 float-right @if($byGroup) active @endif"
href="{{ $U('/stockreports/spendings?byGroup=true') }}">
{{ $__t('by Group') }}
{{ $__t('Product group') }}
</a>
</div>
</div>
@ -54,16 +60,16 @@
<div class="row collapse d-md-flex"
id="table-filter-row">
<div class="col-sm-12 col-md-6 col-xl-4">
<div class="col-sm-12 col-md-6 col-xl-3">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa-solid fa-clock"></i>&nbsp;{{ $__t('Date range') }}</span>
<input type="text"
name="date-filter"
id="daterange-filter"
class="custom-control custom-select"
value="" />
</div>
<input type="text"
name="date-filter"
id="daterange-filter"
class="custom-control custom-select"
value="" />
</div>
</div>
@if(!$byGroup)
@ -84,7 +90,7 @@
</div>
@endif
<div class="col">
<div class="float-right mt-1">
<div class="float-right">
<button id="clear-filter-button"
class="btn btn-sm btn-outline-info"
data-toggle="tooltip"
@ -96,8 +102,7 @@
</div>
<div class="row mt-2">
<div id="chart-wrapper"
class="col-sm-12 col-md-12 col-xl-12">
<div class="col-sm-12 col-md-12 col-xl-12">
<canvas id="metrics-chart"></canvas>
</div>
<div class="col-sm-12 col-md-12 col-xl-12">

View File

@ -163,6 +163,11 @@ chartjs-color@~2.2.0:
chartjs-color-string "^0.5.0"
color-convert "^0.5.3"
chartjs-plugin-colorschemes@^0.4.0:
version "0.4.0"
resolved "https://registry.yarnpkg.com/chartjs-plugin-colorschemes/-/chartjs-plugin-colorschemes-0.4.0.tgz#7a310c32411ef0b5135df1f47da4d379e22220f7"
integrity sha512-GUAulGFa6igdhi/xF9XopLJknwtXZT0wwEB+e/D4SJcRGY1HdwzX84pVn5BSpnk1idF6RJxZoA7w396R7BOE9A==
chartjs-plugin-doughnutlabel@^2.0.3:
version "2.0.3"
resolved "https://registry.yarnpkg.com/chartjs-plugin-doughnutlabel/-/chartjs-plugin-doughnutlabel-2.0.3.tgz#0aa19b040dc68e12163e3215a01609cb3e0b5a7b"
@ -317,9 +322,10 @@ datatables.net@>=1.12.1, datatables.net@^1.10.22:
dependencies:
jquery ">=1.7"
daterangepicker@dangrossman/daterangepicker:
daterangepicker@^3.1.0:
version "3.1.0"
resolved "https://codeload.github.com/dangrossman/daterangepicker/tar.gz/8495717c4007a03fd5dee422f161811fd6140c0e"
resolved "https://registry.yarnpkg.com/daterangepicker/-/daterangepicker-3.1.0.tgz#718d606614331df3e774c9aba82ccd8838d45da1"
integrity sha512-DxWXvvPq4srWLCqFugqSV+6CBt/CvQ0dnpXhQ3gl0autcIDAruG1PuGG3gC7yPRNytAD1oU1AcUOzaYhOawhTw==
dependencies:
jquery ">=1.10"
moment "^2.9.0"
@ -496,7 +502,12 @@ jquery@3.3.1:
resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.3.1.tgz#958ce29e81c9790f31be7792df5d4d95fc57fbca"
integrity sha512-Ubldcmxp5np52/ENotGxlLe6aGMvmF4R8S6tZjsP6Knsaxd/xp3Zrh50cG93lR6nPXyUFwzN3ZSOQI0wRJNdGg==
jquery@>=1.10, jquery@>=1.12.0, jquery@>=1.7, jquery@>=1.7.2, jquery@^3.6.0:
jquery@>=1.10:
version "3.6.4"
resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.6.4.tgz#ba065c188142100be4833699852bf7c24dc0252f"
integrity sha512-v28EW9DWDFpzcD9O5iyJXg3R3+q+mET5JhnjJzQUZMHOv67bpSIHq81GEYpPNZHG+XXHsfSme3nxp/hndKEcsQ==
jquery@>=1.12.0, jquery@>=1.7, jquery@>=1.7.2, jquery@^3.6.0:
version "3.6.3"
resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.6.3.tgz#23ed2ffed8a19e048814f13391a19afcdba160e6"
integrity sha512-bZ5Sy3YzKo9Fyc8wH2iIQK4JImJ6R0GWI9kL1/k7Z91ZBNgkRXE6U0JfHIizZbort8ZunhSI3jw9I6253ahKfg==