This commit is contained in:
@@ -24,6 +24,7 @@
|
||||
<script src="/scripts/htmx-ext-path-params.js"></script>
|
||||
<script src="/scripts/idiomorph-ext.js"></script>
|
||||
<script src="/scripts/hx-drag.js"></script>
|
||||
<script src="/scripts/hx-resize.js"></script>
|
||||
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png">
|
||||
@@ -84,7 +85,7 @@
|
||||
{{/* Href, NoHXBoost, Selected, Content */}}
|
||||
<li class="pt-[1em] pb-[1em]">
|
||||
<a
|
||||
href={{.Href}}
|
||||
href="{{.Href}}"
|
||||
{{if .NoHXBoost}}hx-boost="false"{{end}}
|
||||
class="p-[1em] font-display {{if .Selected}}selected{{ end }}"
|
||||
>
|
||||
|
||||
@@ -1,8 +1,12 @@
|
||||
{{- $acctID := .Identity.Account.AccountID }}
|
||||
|
||||
{{- $platform := .Platform }}
|
||||
{{- $parsedPlatform := "" }}
|
||||
{{- if not $platform }}
|
||||
{{- $platform = .Request.URL.Query.Get "platform" }}
|
||||
{{- if $platform }}
|
||||
{{- $parsedPlatform = (parsePlatform $platform) }}
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
|
||||
{{- $shopID := .ShopID }}
|
||||
@@ -10,6 +14,15 @@
|
||||
{{- $shopID = .Request.URL.Query.Get "shop-id" }}
|
||||
{{- end }}
|
||||
|
||||
{{- $selectedShop := "" }}
|
||||
|
||||
{{- $listingID := .ListingID }}
|
||||
{{- if not $listingID }}
|
||||
{{- $listingID = .Request.URL.Query.Get "listing-id" }}
|
||||
{{- end }}
|
||||
|
||||
{{- $selectedListing := "" }}
|
||||
|
||||
|
||||
{{/* sse handler */}}
|
||||
<div
|
||||
@@ -24,6 +37,7 @@
|
||||
>
|
||||
</div>
|
||||
|
||||
{{/* shop selector */}}
|
||||
<label for="shop-selector">
|
||||
Select a Shop
|
||||
</label>
|
||||
@@ -37,8 +51,20 @@
|
||||
hx-push-url="true"
|
||||
hx-target="body"
|
||||
>
|
||||
{{- range $shop := .Accounts.GetMockShops $acctID }}
|
||||
{{- $isSelected := and (eq $platform $shop.Platform) (eq $shopID $shop.ShopID) }}
|
||||
{{- $shops := .Accounts.GetMockShops $acctID }}
|
||||
{{- $shopOptionIsSelected := false }}
|
||||
{{- range $shop := $shops }}
|
||||
{{- $shopOptionIsSelected = and (eq $parsedPlatform $shop.Platform) (eq $shopID $shop.ShopID) }}
|
||||
{{- if $shopOptionIsSelected }}
|
||||
{{ $selectedShop = $shop }}
|
||||
{{ break }}
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
<option disabled {{if not $shopOptionIsSelected}}selected{{end}}>
|
||||
- select a shop -
|
||||
</option>
|
||||
{{- range $shop := $shops }}
|
||||
{{- $isSelected := and (eq $parsedPlatform $shop.Platform) (eq $shopID $shop.ShopID) }}
|
||||
<option
|
||||
value="{{ $shop.Platform }}-{{ $shop.ShopID }}"
|
||||
{{ if $isSelected }}selected{{end}}
|
||||
@@ -48,13 +74,16 @@
|
||||
{{- end }}
|
||||
</select>
|
||||
|
||||
|
||||
{{/* platform label */}}
|
||||
<h3 class="m-[1em]">
|
||||
Platform: {{ $platform }}
|
||||
</h3>
|
||||
|
||||
|
||||
{{/* raw event table */}}
|
||||
{{- $evts := "" }}
|
||||
{{- if and $platform $shopID }}
|
||||
{{- $parsedPlatform := parsePlatform $platform }}
|
||||
{{- $evts = .Reports.GetRawShopEvents $acctID $parsedPlatform $shopID }}
|
||||
{{- end }}
|
||||
|
||||
@@ -79,3 +108,171 @@
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
{{/* TODO: implement listing chart */}}
|
||||
|
||||
{{- $displayListingReport := false }}
|
||||
{{- if and $platform $shopID }}
|
||||
{{- $displayListingReport = true }}
|
||||
{{- end }}
|
||||
|
||||
{{/* listing selector */}}
|
||||
{{- if $displayListingReport }}
|
||||
<label for="listing-selector">
|
||||
Select a Listing
|
||||
</label>
|
||||
<select
|
||||
id="listing-selector"
|
||||
hx-get="/ui/accounts/{{$acctID}}/reports/mock"
|
||||
hx-vals="js:{
|
||||
platform: event.target.value.replace(/-.*/, ''),
|
||||
'shop-id': event.target.value.replace(/[^-]*-/, '').replace(/\..*/, ''),
|
||||
'listing-id': event.target.value.replace(/.*\./, ''),
|
||||
}"
|
||||
hx-push-url="true"
|
||||
hx-target="body"
|
||||
>
|
||||
{{- $listings := .Accounts.ListMockListingsForShop $acctID $parsedPlatform $shopID }}
|
||||
{{- $listingOptionIsSelected := false }}
|
||||
{{- range $listing := $listings }}
|
||||
{{- $listingOptionIsSelected = and (eq $parsedPlatform $selectedShop.Platform) (eq $shopID $selectedShop.ShopID) | and (eq $listingID $listing.ListingID) }}
|
||||
{{- if $listingOptionIsSelected }}
|
||||
{{ $selectedListing = $listing }}
|
||||
{{ break }}
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
<option disabled {{if not $listingOptionIsSelected}}selected{{end}}>
|
||||
- select a listing -
|
||||
</option>
|
||||
{{- range $listing := $listings }}
|
||||
{{- $isSelected := and (eq $parsedPlatform $listing.Platform) (eq $shopID $listing.ShopID) | and (eq $listingID $listing.ListingID) }}
|
||||
<option
|
||||
value="{{ $listing.Platform }}-{{ $listing.ShopID }}.{{ $listing.ListingID }}"
|
||||
{{ if $isSelected }}selected{{end}}
|
||||
>
|
||||
{{ $listing.Name }} - {{ $listing.ListingID }}
|
||||
</option>
|
||||
{{- end }}
|
||||
</select>
|
||||
|
||||
|
||||
{{- $report := "" }}
|
||||
{{- if $displayListingReport | and $listingID }}
|
||||
{{- $report = .Reports.GetListingCountsReport $acctID $parsedPlatform $shopID $listingID }}
|
||||
{{- end }}
|
||||
|
||||
{{- if $report }}
|
||||
{{- $minCount := $report.MinCount.Count }}
|
||||
{{- $maxCount := $report.MaxCount.Count }}
|
||||
{{- $countRange := subInt64 $maxCount $minCount }}
|
||||
{{- $numCounts := len $report.Counts }}
|
||||
|
||||
|
||||
<div
|
||||
class="h-[min(100cqw,75vh)] p-[1em]"
|
||||
>
|
||||
<div
|
||||
hx-get="/api/accounts/{{$acctID}}/platforms/{{$platform}}/shops/mocks/{{$shopID}}/listings/{{$listingID}}/charts/counts"
|
||||
hx-trigger="load,resize"
|
||||
hx-resize-debounce="500"
|
||||
hx-vals="js:{
|
||||
width: this.getBoundingClientRect().width,
|
||||
height: this.getBoundingClientRect().height,
|
||||
timezone: Intl?.DateTimeFormat()?.resolvedOptions()?.timeZone,
|
||||
}"
|
||||
class="h-full w-full"
|
||||
>
|
||||
{{/* will get replaced after loaded and upon resizing */}}
|
||||
<svg width="100%" height="100%">
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{{/*
|
||||
<div
|
||||
id="listing-counts-chart"
|
||||
class="
|
||||
w-full
|
||||
h-[30em]
|
||||
bg-card
|
||||
"
|
||||
style="contain: layout;"
|
||||
>
|
||||
{{- range $i, $count := $report.Counts }}
|
||||
{{- $height := multFloat (divFloat (subFloat (int64ToFloat $count.Count) (int64ToFloat $minCount)) (int64ToFloat $countRange)) 100 }}
|
||||
{{- $width := subFloat (divFloat 100 (intToFloat $numCounts)) 1 }}
|
||||
{{- $left := divFloat (intToFloat (multInt $i 100)) (intToFloat $numCounts) }}
|
||||
{{- $bottom := 0 }}
|
||||
<div
|
||||
class="
|
||||
bg-accent
|
||||
rounded-sm
|
||||
border-black
|
||||
"
|
||||
style="
|
||||
position: absolute;
|
||||
bottom: {{$bottom}}%;
|
||||
left: {{$left}}%;
|
||||
height: {{$height}}%;
|
||||
width: {{$width}}%;
|
||||
"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
position: absolute;
|
||||
top: 10%;
|
||||
text-align: center;
|
||||
"
|
||||
>
|
||||
{{$count.Count}}
|
||||
</div>
|
||||
</div>
|
||||
{{- end }}
|
||||
</div>
|
||||
|
||||
<svg
|
||||
version="1.1"
|
||||
width="500" height="500"
|
||||
style="width: 100%; height: auto;"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 100 100"
|
||||
>
|
||||
{{- range $i, $count := $report.Counts }}
|
||||
{{- $height := multFloat (divFloat (subFloat (int64ToFloat $count.Count) (int64ToFloat $minCount)) (int64ToFloat $countRange)) 100 }}
|
||||
{{- $y := subFloat 100 (multFloat (divFloat (subFloat (int64ToFloat $count.Count) (int64ToFloat $minCount)) (int64ToFloat $countRange)) 100) }}
|
||||
{{- $width := subFloat (divFloat 100 (intToFloat $numCounts)) 1 }}
|
||||
{{- $x := divFloat (intToFloat (multInt $i 100)) (intToFloat $numCounts) }}
|
||||
|
||||
<rect x="{{$x}}" y="{{$y}}" width="{{$width}}" height="{{$height}}" class="fill-accent" />
|
||||
<text x="{{$x}}" y="{{$y}}" width="{{$width}}" height="10" class="fill-white stroke-2 text-[4px]">
|
||||
{{$count.Count}}
|
||||
</text>
|
||||
{{- end }}
|
||||
</svg>
|
||||
*/}}
|
||||
|
||||
{{- end }}
|
||||
|
||||
<table id="listing-counts-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<td>Time</td>
|
||||
{{/*<td>EventID</td>*/}}
|
||||
<td>Count</td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{- if $report }}
|
||||
{{- range $count := $report.Counts }}
|
||||
<tr>
|
||||
<td>{{if $count.EventTimestamp}}{{$count.EventTimestamp}}{{end}}</td>
|
||||
<td>{{$count.Count}}</td>
|
||||
</tr>
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
{{- end }}
|
||||
|
||||
Reference in New Issue
Block a user