mirror/librenms-librenms
1
0
Fork 0
mirror of https://github.com/librenms/librenms.git synced 2024-10-07 16:52:45 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Correct graph row component responsive layout for linked graphs (#13587)

Browse Source 
* Correct graph row component responsive layout for linked graphs
Enable pass through height and legend.  Probably need more, but this is just for a start.
Switch Poller performance page

* revert accidental change

* Update Graph.php
This commit is contained in:
Tony Murray
2021-11-30 19:21:41 -06:00
committed by GitHub
parent 12a262744e
commit d69674b36e
7 changed files with 30 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
app/View/Components/Graph.php
View File

@@ -120,6 +120,19 @@ class Graph extends Component
]);
}
/**
* @param mixed $value
* @param int|string $key
* @return bool
*/
public function filterAttributes($value, $key): bool
{
return ! in_array($key, [
'legend',
'height',
]);
}
private function getSrc(): string
{
return url('graph.php') . '?' . http_build_query($this->vars + [

2
html/css/app.css
View File

File diff suppressed because one or more lines are too long

4
html/mix-manifest.json
View File

@@ -2,10 +2,10 @@
"/js/app.js": "/js/app.js?id=f9dd05e6d476f489c33c",
"/js/manifest.js": "/js/manifest.js?id=8d61162bb0caf92f60ff",
"/css/vendor.css": "/css/vendor.css?id=8d7b2ecb46047fe813e4",
"/css/app.css": "/css/app.css?id=4f966be7eb5693f68d0e",
"/css/app.css": "/css/app.css?id=3d85860a5e68bfd996e8",
"/js/vendor.js": "/js/vendor.js?id=b90d598798a7357bce8f",
"/js/lang/de.js": "/js/lang/de.js?id=1aedfce25e3daad3046a",
"/js/lang/en.js": "/js/lang/en.js?id=18d18b0b43c83bf56010",
"/js/lang/en.js": "/js/lang/en.js?id=79fd092f643bc4294e19",
"/js/lang/fr.js": "/js/lang/fr.js?id=a20c4c78eb5f9f4a374b",
"/js/lang/it.js": "/js/lang/it.js?id=6b0bdf3be6dc3bf0a167",
"/js/lang/ru.js": "/js/lang/ru.js?id=f6b7c078755312a0907c",

11
resources/views/components/graph-row.blade.php
View File

@@ -5,6 +5,15 @@
@endisset
<div class="tw-flex tw-flex-wrap" @if(! $responsive) style="width: {{ $rowWidth }}px;" @endif {{ $attributes }}>
@foreach($graphs as $graph)
<x-graph :type="$type" :loading="$loading" :aspect="$aspect" :port="$port" :device="$device" :vars="$graph" {{ $attributes->class(['xl:tw-w-1/4 lg:tw-w-1/2 sm:tw-w-full' => $responsive]) }}></x-graph>
<x-graph
:type="$type"
:loading="$loading"
:aspect="$aspect"
:port="$port"
:device="$device"
:legend="$attributes->get('legend', 'no')"
:height="$attributes->get('height', 150)"
:vars="$graph"
{{ $attributes->class(['lg:tw-w-1/4 sm:tw-w-1/2 tw-w-full' => $responsive]) }}></x-graph>
@endforeach
</div>

2
resources/views/components/graph.blade.php
View File

@@ -1 +1 @@
<img width="{{ $width }}" height="{{ $height }}" src="{{ $src }}" alt="{{ $type }}" {{ $attributes->merge(['class' => 'graph-image']) }}>
<img width="{{ $width }}" height="{{ $height }}" src="{{ $src }}" alt="{{ $type }}" {{ $attributes->merge(['class' => 'graph-image'])->filter($filterAttributes) }}>

2
resources/views/components/linked-graph.blade.php
View File

@@ -1 +1 @@
<a href="{{ $link }}"><img width="{{ $width }}" height="{{ $height }}" src="{{ $src }}" alt="{{ $type }}" {{ $attributes->merge(['class' => 'graph-image']) }}></a>
<a href="{{ $link }}" {{ $attributes->filter($filterAttributes) }}><img width="{{ $width }}" height="{{ $height }}" src="{{ $src }}" alt="{{ $type }}" class="graph-image"></a>

6
resources/views/poller/performance.blade.php
View File

@@ -7,13 +7,11 @@
@parent
<x-panel title="{{ __('Total Poller Time') }}">
<?php \LibreNMS\Util\Html::graphRow(['type' => 'global_poller_perf',
'legend' => 'yes', 'height' => 100], true); ?>
<x-graph-row type="global_poller_perf" columns="responsive" legend="yes"></x-graph-row>
</x-panel>
<x-panel title="{{ __('Total Poller Time Per Module') }}">
<?php \LibreNMS\Util\Html::graphRow(['type' => 'global_poller_modules_perf',
'legend' => 'yes', 'height' => 100], true); ?>
<x-graph-row type="global_poller_modules_perf" columns="responsive" legend="yes"></x-graph-row>
</x-panel>
@endsection