Skip to content

GitLab

Unverified Commit a2283070 authored by hcgatchalian's avatar hcgatchalian Committed by GitHub
Browse files

added time range filter logic

parent 3f89af7b
Hide whitespace changes
Inline Side-by-side
Showing
with 1187 additions and 791 deletions
+1187 -791
care-w4/resources/css/app.css
View file @ a2283070
@tailwind base;
@tailwind components;
@tailwind utilities;
@tailwind base;
@tailwind components;
@tailwind utilities;
care-w4/resources/image/flower.svg
View file @ a2283070
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
version="1.1"
id="svg3109"
xml:space="preserve"
width="800"
height="800"
viewBox="100 50 600 600"
sodipodi:docname="flower-vector-publicdomainvectors.svg"
inkscape:version="0.92.4 (5da689c313, 2019-01-14)"><metadata
id="metadata3115"><rdf:RDF><cc:Work
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
id="defs3113"><clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath3125"><path
d="M 0,600 H 600 V 0 H 0 Z"
id="path3123"
inkscape:connector-curvature="0" /></clipPath></defs><sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1920"
inkscape:window-height="1018"
id="namedview3111"
showgrid="false"
inkscape:zoom="0.98604331"
inkscape:cx="408.47458"
inkscape:cy="396.61017"
inkscape:window-x="-8"
inkscape:window-y="-8"
inkscape:window-maximized="1"
inkscape:current-layer="g3117" /><g
id="g3117"
inkscape:groupmode="layer"
inkscape:label="flower-vector-publicdomainvectors"
transform="matrix(1.3333333,0,0,-1.3333333,0,800)"><g
id="g3119"><g
id="g3121"
clip-path="url(#clipPath3125)"><path
d="m 337.468,337.495 c -2.11,0 -3.821,-1.71 -3.821,-3.819 0,-2.111 1.711,-3.821 3.821,-3.821 2.109,0 3.82,1.71 3.82,3.821 0,2.109 -1.711,3.819 -3.82,3.819 m -8.022,-14.898 c -2.11,0 -3.821,-1.711 -3.821,-3.821 0,-2.109 1.711,-3.82 3.821,-3.82 2.109,0 3.82,1.711 3.82,3.82 0,2.11 -1.711,3.821 -3.82,3.821 m -34.383,-5.455 c -1.629,0 -2.951,-1.321 -2.951,-2.95 0,-1.629 1.322,-2.95 2.951,-2.95 1.629,0 2.951,1.321 2.951,2.95 0,1.629 -1.322,2.95 -2.951,2.95 m 25.213,-3.437 c -1.629,0 -2.95,-1.321 -2.95,-2.951 0,-1.629 1.321,-2.95 2.95,-2.95 1.63,0 2.952,1.321 2.952,2.95 0,1.63 -1.322,2.951 -2.952,2.951 m -18.337,56.157 c -1.629,0 -2.95,-1.321 -2.95,-2.951 0,-1.629 1.321,-2.949 2.95,-2.949 1.63,0 2.952,1.32 2.952,2.949 0,1.63 -1.322,2.951 -2.952,2.951 m 27.507,-5.73 c -1.631,0 -2.952,-1.322 -2.952,-2.95 0,-1.63 1.321,-2.951 2.952,-2.951 1.629,0 2.95,1.321 2.95,2.951 0,1.628 -1.321,2.95 -2.95,2.95 m 0,-12.119 c -2.532,0 -4.584,-2.053 -4.584,-4.584 0,-2.533 2.052,-4.584 4.584,-4.584 2.531,0 4.584,2.051 4.584,4.584 0,2.531 -2.053,4.584 -4.584,4.584 m -21.011,-33.237 c -2.111,0 -3.821,-1.71 -3.821,-3.82 0,-2.109 1.71,-3.819 3.821,-3.819 2.109,0 3.819,1.71 3.819,3.819 0,2.11 -1.71,3.82 -3.819,3.82 m 5.73,44.771 c -3.416,0 -6.186,-2.769 -6.186,-6.185 0,-3.416 2.77,-6.184 6.186,-6.184 3.416,0 6.185,2.768 6.185,6.184 0,3.416 -2.769,6.185 -6.185,6.185 m -21.16,-29.934 c -2.613,0 -4.733,-2.119 -4.733,-4.732 0,-2.614 2.12,-4.733 4.733,-4.733 2.613,0 4.732,2.119 4.732,4.733 0,2.613 -2.119,4.732 -4.732,4.732 m 1.49,23.749 c -4.008,0 -7.26,-3.25 -7.26,-7.259 0,-4.009 3.252,-7.258 7.26,-7.258 4.009,0 7.259,3.249 7.259,7.258 0,4.009 -3.25,7.259 -7.259,7.259 m 19.67,-11.843 c -5.486,0 -9.933,-4.448 -9.933,-9.933 0,-5.485 4.447,-9.933 9.933,-9.933 5.485,0 9.932,4.448 9.932,9.933 0,5.485 -4.447,9.933 -9.932,9.933 m 47.412,-235.735 c -4.082,27.996 7.648,58.183 9.314,111.379 0.351,11.2 -16.663,53.565 -46.634,82.589 -3.471,-8.361 33.238,-49.846 30.097,-82.358 -4.856,14.543 -23.96,49.204 -29.321,64.234 -3.146,-8.425 27.655,-96.74 21.206,-109.42 0,0 -25.889,78.538 -28.276,110.69 -7.758,-4.303 1.887,-66.544 7.257,-81.58 -17.341,20.597 -19.143,61.264 -11.528,97.528 -39.08,-69.651 10.842,-160.028 47.885,-193.062 M 167.12,156.835 c 19.138,20.837 49.955,30.792 92.269,63.075 8.91,6.797 31.03,46.734 34.626,88.299 -8.676,-2.585 -17.683,-57.241 -44.885,-75.326 8.216,12.945 23.042,49.639 31.318,63.285 -8.522,-2.877 -57.582,-82.511 -71.487,-85.511 0,0 44.577,69.651 68.01,91.797 -8.236,3.301 -50.425,-43.464 -58.697,-57.12 5.03,26.451 35.436,53.515 68.372,70.498 C 207.952,302.182 169.364,206.419 167.12,156.835 m 177.312,163.879 c 26.416,-6.195 52.835,-20.001 61.115,-37.891 -8.306,8.226 -46.6,33.925 -51.861,30.114 20.587,-11.555 64.655,-53.084 64.655,-53.084 -10.411,-0.346 -59.442,47.474 -66.007,48 8.31,-8.218 25.376,-31.64 33.517,-39.369 -22.54,7.997 -38.675,45.213 -45.296,45.504 9.958,-28.882 32.782,-53.306 40.32,-56.546 35.803,-15.39 59.464,-16.974 76.769,-28.363 -10.426,34.817 -54.891,95.959 -113.212,91.635 m 4.817,37.048 c 29.02,14.888 63.965,22.804 85.476,12.863 -14.011,1.069 -69.092,-5.197 -70.945,-12.784 27.853,5.441 100.544,1.7 100.544,1.7 -9.268,-8.419 -91.402,-2.779 -97.824,-7.408 14.008,-1.06 47.872,-9.231 61.344,-9.974 -26.872,-10.219 -70.618,11.313 -76.91,6.425 31.602,-18.705 71.52,-23.312 80.948,-20.412 44.775,13.77 67.681,30.738 92.398,33.774 -36.652,23.778 -124.973,45.173 -175.031,-4.184 m -31.306,16.567 c 4.764,38.207 20.269,77.56 44.265,91.941 -10.354,-12.96 -40.853,-70.863 -34.683,-77.712 13.205,30.789 65.172,99.22 65.172,99.22 2.053,-14.637 -58.042,-91.019 -57.796,-100.362 10.345,12.963 40.826,40.569 50.506,53.22 -7.892,-33.01 -57.976,-61.377 -57.388,-70.764 39.252,18.397 70.28,54.28 73.718,65.405 16.327,52.836 14.997,86.461 28.464,112.592 C 382.643,527.918 303.063,455.971 317.943,374.329 M 75.518,330.989 c 29.396,-0.255 58.531,-17.094 112.889,-27.257 11.447,-2.139 57.653,8.603 92.216,34.768 -8.033,4.892 -56.464,-26.213 -89.349,-17.822 15.704,2.675 54.33,16.787 70.618,19.903 -8.153,4.57 -103.734,-13.03 -115.73,-4.393 0,0 84.76,14.108 118.155,11.452 -3.187,8.65 -68.63,8.633 -84.923,5.507 23.905,14.535 65.95,9.925 101.978,-3.656 -65.314,51.195 -166.047,14.289 -205.854,-18.502 m 220.422,44.178 c -6.505,42.934 -25.156,86.843 -52.639,102.347 12.059,-14.306 48.165,-78.684 41.413,-86.589 -15.805,34.32 -76.426,109.93 -76.426,109.93 -1.883,-16.565 68.143,-100.896 68.143,-111.436 -12.047,14.306 -47.233,44.525 -58.526,58.501 9.881,-36.983 67.192,-67.477 66.809,-78.077 -44.803,19.576 -80.852,59.11 -85.059,71.55 -19.978,59.085 -19.479,97.037 -35.438,126.098 C 218.43,546.409 310.29,467.657 295.94,375.167"
style="fill:#00c853;fill-opacity:1;fill-rule:nonzero;stroke:none"
id="path3127"
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
version="1.1"
id="svg3109"
xml:space="preserve"
width="800"
height="800"
viewBox="100 50 600 600"
sodipodi:docname="flower-vector-publicdomainvectors.svg"
inkscape:version="0.92.4 (5da689c313, 2019-01-14)"><metadata
id="metadata3115"><rdf:RDF><cc:Work
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
id="defs3113"><clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath3125"><path
d="M 0,600 H 600 V 0 H 0 Z"
id="path3123"
inkscape:connector-curvature="0" /></clipPath></defs><sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1920"
inkscape:window-height="1018"
id="namedview3111"
showgrid="false"
inkscape:zoom="0.98604331"
inkscape:cx="408.47458"
inkscape:cy="396.61017"
inkscape:window-x="-8"
inkscape:window-y="-8"
inkscape:window-maximized="1"
inkscape:current-layer="g3117" /><g
id="g3117"
inkscape:groupmode="layer"
inkscape:label="flower-vector-publicdomainvectors"
transform="matrix(1.3333333,0,0,-1.3333333,0,800)"><g
id="g3119"><g
id="g3121"
clip-path="url(#clipPath3125)"><path
d="m 337.468,337.495 c -2.11,0 -3.821,-1.71 -3.821,-3.819 0,-2.111 1.711,-3.821 3.821,-3.821 2.109,0 3.82,1.71 3.82,3.821 0,2.109 -1.711,3.819 -3.82,3.819 m -8.022,-14.898 c -2.11,0 -3.821,-1.711 -3.821,-3.821 0,-2.109 1.711,-3.82 3.821,-3.82 2.109,0 3.82,1.711 3.82,3.82 0,2.11 -1.711,3.821 -3.82,3.821 m -34.383,-5.455 c -1.629,0 -2.951,-1.321 -2.951,-2.95 0,-1.629 1.322,-2.95 2.951,-2.95 1.629,0 2.951,1.321 2.951,2.95 0,1.629 -1.322,2.95 -2.951,2.95 m 25.213,-3.437 c -1.629,0 -2.95,-1.321 -2.95,-2.951 0,-1.629 1.321,-2.95 2.95,-2.95 1.63,0 2.952,1.321 2.952,2.95 0,1.63 -1.322,2.951 -2.952,2.951 m -18.337,56.157 c -1.629,0 -2.95,-1.321 -2.95,-2.951 0,-1.629 1.321,-2.949 2.95,-2.949 1.63,0 2.952,1.32 2.952,2.949 0,1.63 -1.322,2.951 -2.952,2.951 m 27.507,-5.73 c -1.631,0 -2.952,-1.322 -2.952,-2.95 0,-1.63 1.321,-2.951 2.952,-2.951 1.629,0 2.95,1.321 2.95,2.951 0,1.628 -1.321,2.95 -2.95,2.95 m 0,-12.119 c -2.532,0 -4.584,-2.053 -4.584,-4.584 0,-2.533 2.052,-4.584 4.584,-4.584 2.531,0 4.584,2.051 4.584,4.584 0,2.531 -2.053,4.584 -4.584,4.584 m -21.011,-33.237 c -2.111,0 -3.821,-1.71 -3.821,-3.82 0,-2.109 1.71,-3.819 3.821,-3.819 2.109,0 3.819,1.71 3.819,3.819 0,2.11 -1.71,3.82 -3.819,3.82 m 5.73,44.771 c -3.416,0 -6.186,-2.769 -6.186,-6.185 0,-3.416 2.77,-6.184 6.186,-6.184 3.416,0 6.185,2.768 6.185,6.184 0,3.416 -2.769,6.185 -6.185,6.185 m -21.16,-29.934 c -2.613,0 -4.733,-2.119 -4.733,-4.732 0,-2.614 2.12,-4.733 4.733,-4.733 2.613,0 4.732,2.119 4.732,4.733 0,2.613 -2.119,4.732 -4.732,4.732 m 1.49,23.749 c -4.008,0 -7.26,-3.25 -7.26,-7.259 0,-4.009 3.252,-7.258 7.26,-7.258 4.009,0 7.259,3.249 7.259,7.258 0,4.009 -3.25,7.259 -7.259,7.259 m 19.67,-11.843 c -5.486,0 -9.933,-4.448 -9.933,-9.933 0,-5.485 4.447,-9.933 9.933,-9.933 5.485,0 9.932,4.448 9.932,9.933 0,5.485 -4.447,9.933 -9.932,9.933 m 47.412,-235.735 c -4.082,27.996 7.648,58.183 9.314,111.379 0.351,11.2 -16.663,53.565 -46.634,82.589 -3.471,-8.361 33.238,-49.846 30.097,-82.358 -4.856,14.543 -23.96,49.204 -29.321,64.234 -3.146,-8.425 27.655,-96.74 21.206,-109.42 0,0 -25.889,78.538 -28.276,110.69 -7.758,-4.303 1.887,-66.544 7.257,-81.58 -17.341,20.597 -19.143,61.264 -11.528,97.528 -39.08,-69.651 10.842,-160.028 47.885,-193.062 M 167.12,156.835 c 19.138,20.837 49.955,30.792 92.269,63.075 8.91,6.797 31.03,46.734 34.626,88.299 -8.676,-2.585 -17.683,-57.241 -44.885,-75.326 8.216,12.945 23.042,49.639 31.318,63.285 -8.522,-2.877 -57.582,-82.511 -71.487,-85.511 0,0 44.577,69.651 68.01,91.797 -8.236,3.301 -50.425,-43.464 -58.697,-57.12 5.03,26.451 35.436,53.515 68.372,70.498 C 207.952,302.182 169.364,206.419 167.12,156.835 m 177.312,163.879 c 26.416,-6.195 52.835,-20.001 61.115,-37.891 -8.306,8.226 -46.6,33.925 -51.861,30.114 20.587,-11.555 64.655,-53.084 64.655,-53.084 -10.411,-0.346 -59.442,47.474 -66.007,48 8.31,-8.218 25.376,-31.64 33.517,-39.369 -22.54,7.997 -38.675,45.213 -45.296,45.504 9.958,-28.882 32.782,-53.306 40.32,-56.546 35.803,-15.39 59.464,-16.974 76.769,-28.363 -10.426,34.817 -54.891,95.959 -113.212,91.635 m 4.817,37.048 c 29.02,14.888 63.965,22.804 85.476,12.863 -14.011,1.069 -69.092,-5.197 -70.945,-12.784 27.853,5.441 100.544,1.7 100.544,1.7 -9.268,-8.419 -91.402,-2.779 -97.824,-7.408 14.008,-1.06 47.872,-9.231 61.344,-9.974 -26.872,-10.219 -70.618,11.313 -76.91,6.425 31.602,-18.705 71.52,-23.312 80.948,-20.412 44.775,13.77 67.681,30.738 92.398,33.774 -36.652,23.778 -124.973,45.173 -175.031,-4.184 m -31.306,16.567 c 4.764,38.207 20.269,77.56 44.265,91.941 -10.354,-12.96 -40.853,-70.863 -34.683,-77.712 13.205,30.789 65.172,99.22 65.172,99.22 2.053,-14.637 -58.042,-91.019 -57.796,-100.362 10.345,12.963 40.826,40.569 50.506,53.22 -7.892,-33.01 -57.976,-61.377 -57.388,-70.764 39.252,18.397 70.28,54.28 73.718,65.405 16.327,52.836 14.997,86.461 28.464,112.592 C 382.643,527.918 303.063,455.971 317.943,374.329 M 75.518,330.989 c 29.396,-0.255 58.531,-17.094 112.889,-27.257 11.447,-2.139 57.653,8.603 92.216,34.768 -8.033,4.892 -56.464,-26.213 -89.349,-17.822 15.704,2.675 54.33,16.787 70.618,19.903 -8.153,4.57 -103.734,-13.03 -115.73,-4.393 0,0 84.76,14.108 118.155,11.452 -3.187,8.65 -68.63,8.633 -84.923,5.507 23.905,14.535 65.95,9.925 101.978,-3.656 -65.314,51.195 -166.047,14.289 -205.854,-18.502 m 220.422,44.178 c -6.505,42.934 -25.156,86.843 -52.639,102.347 12.059,-14.306 48.165,-78.684 41.413,-86.589 -15.805,34.32 -76.426,109.93 -76.426,109.93 -1.883,-16.565 68.143,-100.896 68.143,-111.436 -12.047,14.306 -47.233,44.525 -58.526,58.501 9.881,-36.983 67.192,-67.477 66.809,-78.077 -44.803,19.576 -80.852,59.11 -85.059,71.55 -19.978,59.085 -19.479,97.037 -35.438,126.098 C 218.43,546.409 310.29,467.657 295.94,375.167"
style="fill:#fff37a;fill-opacity:1;fill-rule:nonzero;stroke:none"
id="path3127"
inkscape:connector-curvature="0" /></g></g></g></svg>
\ No newline at end of file
care-w4/resources/js/app.js
View file @ a2283070
import 'flowbite';
import.meta.glob([
'../image/**',
'../js/**'
]);
import Chart from 'chart.js/auto';
import Alpine from 'alpinejs';
import focus from '@alpinejs/focus';
window.Alpine = Alpine;
Alpine.plugin(focus);
Alpine.start()
const ctx = document.getElementById('chart');
const chart = new Chart(ctx, {
type : data.type,
data : {
labels: data.labels,
datasets: data.datasets,
},
options: {
responsive: true,
maintainAspectRatio: true,
plugins: {
legend: {
display: false
}
}
}
});
const realCtx = document.getElementById('realtimeChart');
const realtimeChart = new Chart(realCtx, {
type : 'line',
data : {
labels: ["0"],
datasets: [
{
'label' : 'Realtime',
'data' : [0],
'fill' : true,
"borderColor" : "#1434A4",
"tension" : 0.1,
"backgroundColor" : "rgba(0, 150, 255,0.5)",
"cornerRadius" : 10
}
],
},
options: {
responsive: true,
maintainAspectRatio: true,
plugins: {
legend: {
display: false
}
}
}
});
const logJSONData = async (database, folder) => {
const response = await fetch(`/realtime/${database}/${folder}`);
const jsonData = await response.json();
realtimeChart.data.labels.push(jsonData.label);
realtimeChart.data.datasets[0].data.push(jsonData.data);
realtimeChart.update();
if(realtimeChart.data.datasets[0].data.length > 24) {
realtimeChart.data.datasets[0].data.shift();
realtimeChart.data.labels.shift();
}
}
setInterval(() => logJSONData(database, folder), 1000);
const request = async (url, method, id) => {
const response = await fetch(url, {method: method});
const jsonData = await response.json();
document.getElementById(id).checked = jsonData.data.value == 1 ? true : false;
}
const toggleButtons = document.querySelectorAll('.toggle-buttons');
[...toggleButtons].forEach(toggleButton => {
toggleButton.addEventListener('click', element => request(toggleButton.dataset.url, toggleButton.dataset.method, toggleButton.id));
toggleButton.checked = toggleButton.dataset.visible == 1 ? true : false;
setInterval(() => {
const jsonData = request(toggleButton.dataset.update_url, toggleButton.dataset.method, toggleButton.id);
}, 2000);
});
import 'flowbite';
import.meta.glob([
'../image/**',
'../js/**'
]);
import Chart from 'chart.js/auto';
import 'chartjs-adapter-date-fns';
import Chart2 from 'chartjs-gauge';
import Alpine from 'alpinejs';
import focus from '@alpinejs/focus';
window.Alpine = Alpine;
Alpine.plugin(focus);
Alpine.start()
const ctx = document.getElementById('chart');
const chart = new Chart(ctx, {
type: data.type,
data : {
labels: data.labels,
datasets: data.datasets,
},
options: {
scales: {
x: {
ticks: {
color: '#ffeadf',
beginAtZero: false,
callback: function(value, index, ticks) {
const date = new Date(Date.parse(data.labels[index]));
const previousDate = new Date(Date.parse(data.labels[index-1]));
return `${date.toLocaleString('default', { month: 'short' })} ${date.getFullYear()}`;
}
},
grid: {
// display: false,
}
},
y: {
ticks: {
beginAtZero: false,
color: '#ffeadf',
callback: function(value, index, ticks){
return `${value} ${unit}`;
}
},
grid: {
// display: false,
}
}
},
responsive: true,
maintainAspectRatio: true,
plugins: {
legend: {
display: false
}
}
}
});
const realCtx = document.getElementById('realtimeChart');
const realtimeChart = new Chart(realCtx, {
type : 'line',
data : {
labels: ["0"],
datasets: [
{
'label' : 'Realtime',
'data' : [0],
'fill' : true,
"borderColor" : "#8ce4b1",
"tension" : 0.1,
"backgroundColor" : "rgba(140, 228, 177, 0.4)",
"cornerRadius" : 10,
"borderWidth" : 3,
}
],
},
options: {
scales: {
y:{
beginAtZero: true,
ticks: {
color: '#ffeadf'
}
},
x:{
ticks: {
color: '#ffeadf'
}
}
},
responsive: true,
maintainAspectRatio: true,
plugins: {
legend: {
display: false
}
}
}
});
[...document.querySelectorAll('.gauge-chart')].forEach(gaugeChart => {
const x = new Chart2(gaugeChart, {
type: "gauge",
data: {
labels: threshold,
legend: { display: false },
datasets: [
{
data: threshold,
value: gaugeChart.dataset.value,
borderColor : [
"black",
"black",
"black",
],
backgroundColor: [
"#BCE29E",
"#fff37a",
"rgba(145,39,89)",
],
borderWidth: 2,
},
],
},
options: {
responsive: false,
title: {
display: true,
text: gaugeChart.dataset.label,
fontColor: "white",
fontSize: 14,
},
tooltips: { enabled: true },
//layout: {
// padding: {
// bottom: 30,
// },
//},
needle: {
radiusPercentage: 0, // Needle circle radius as the percentage
widthPercentage: 4, // Needle width as the percentage
lengthPercentage: 100, // Needle length as the percentage
color: 'white', // color of the needle
},
cutoutPercentage: 85 ,
valueLabel: {
display: true,
//fontSize: 16,
color: "black",
backgroundColor: "white",
borderRadius: 10,
formatter: (value) => {
return Math.round(value * 10) / 10 + ` ${unit}`;
},
},
},
});
});
const realGaugeCtx = document.getElementById('realtimeGauge');
const realtimeGauge = new Chart2(realGaugeCtx, {
type: "gauge",
data: {
labels: threshold,
legend: {
display: false },
datasets: [
{
data: threshold,
value: realGaugeCtx.dataset.value,
borderColor : [
"black",
"black",
"black",
],
backgroundColor: [
"#BCE29E",
"#fff37a",
"rgba(145,39,89)",
],
borderWidth: 2,
},
],
},
options: {
responsive: false,
title: {
display: true,
text: realGaugeCtx.dataset.label,
fontColor: "white",
fontSize: 14,
},
tooltips: { enabled: true },
//layout: {
// padding: {
// bottom: 30,
// },
//},
needle: {
radiusPercentage: 0, // Needle circle radius as the percentage
widthPercentage: 4, // Needle width as the percentage
lengthPercentage: 100, // Needle length as the percentage
color: 'white',
//color: 'black' // color of the needle
},
cutoutPercentage: 85 ,
valueLabel: {
display: true,
//fontSize: 16,
color: "black",
backgroundColor: "white",
borderRadius: 10,
formatter: (value) => {
return Math.round(value * 10) / 10 + ` ${unit}`;
},
},
},
});
const logJSONData = async (database, folder) => {
const response = await fetch(`/realtime/${database}/${folder}`);
const jsonData = await response.json();
const dataset = realtimeChart.data.datasets[0].data;
if(jsonData.data <= threshold[2] && jsonData.data > threshold[1] && jsonData.data != dataset[dataset.length - 1]) {
document.getElementById('toast-danger').classList.remove('hidden','opacity-0');
document.getElementById('toast-warning').classList.add('hidden','opacity-0');
}
if(jsonData.data <= threshold[1] && jsonData.data > threshold[0] && jsonData.data < threshold[2] && jsonData.data != dataset[dataset.length - 1]) {
document.getElementById('toast-warning').classList.remove('hidden','opacity-0');
document.getElementById('toast-danger').classList.add('hidden','opacity-0');
}
realtimeChart.data.labels.push(jsonData.label);
dataset.push(jsonData.data);
realtimeChart.update();
realtimeGauge.data.datasets[0].value = jsonData.data;
realtimeGauge.update();
if(realtimeChart.data.datasets[0].data.length > 24) {
realtimeChart.data.datasets[0].data.shift();
realtimeChart.data.labels.shift();
}
}
setInterval(() => logJSONData(database, folder), 1000);
const request = async (url, method, id) => {
const response = await fetch(url, {method: method});
const jsonData = await response.json();
document.getElementById(id).checked = jsonData.data.value == 1 ? true : false;
}
const toggleButtons = document.querySelectorAll('.toggle-buttons');
[...toggleButtons].forEach(toggleButton => {
toggleButton.addEventListener('click', element => request(toggleButton.dataset.url, toggleButton.dataset.method, toggleButton.id));
toggleButton.checked = toggleButton.dataset.visible == 1 ? true : false;
setInterval(() => {
const jsonData = request(toggleButton.dataset.update_url, toggleButton.dataset.method, toggleButton.id);
}, 11000);
});
/*
$(function() {
$('input[name="datetimes"]').daterangepicker({
timePicker: true,
timePickerSeconds: true,
startDate: moment().startOf('hour'),
endDate: moment().startOf('hour').add(32, 'hour'),
locale: {
format: 'M/DD/Y H:mm'
}
});
});
*/
$(function() {
$('input[name="datetimes"]').daterangepicker({
showDropdowns: true,
timePicker: true,
timePickerSeconds: true,
ranges: {
'Today': [moment(), moment()],
'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
'Last 7 Days': [moment().subtract(6, 'days'), moment()],
'Last 30 Days': [moment().subtract(29, 'days'), moment()],
'This Month': [moment().startOf('month'), moment().endOf('month')],
'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
},
//startDate: moment().startOf('hour'),
//endDate: moment().startOf('hour').add(32, 'hour'),
locale: {
format: 'M/DD/Y H:mm'
},
drops: "auto",
buttonClasses: "btn btn-md",
applyButtonClasses: "text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 mb-2 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none dark:focus:ring-blue-800 mt-2",
cancelClass: "btn btn-md",
},
);
});
\ No newline at end of file
care-w4/resources/js/bootstrap.js
View file @ a2283070
window._ = require('lodash');
/**
* We'll load the axios HTTP library which allows us to easily issue requests
* to our Laravel back-end. This library automatically handles sending the
* CSRF token as a header based on the value of the "XSRF" token cookie.
*/
window.axios = require('axios');
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
/**
* Echo exposes an expressive API for subscribing to channels and listening
* for events that are broadcast by Laravel. Echo and event broadcasting
* allows your team to easily build robust real-time web applications.
*/
// import Echo from 'laravel-echo';
// window.Pusher = require('pusher-js');
// window.Echo = new Echo({
// broadcaster: 'pusher',
// key: process.env.MIX_PUSHER_APP_KEY,
// cluster: process.env.MIX_PUSHER_APP_CLUSTER,
// forceTLS: true
// });
window._ = require('lodash');
/**
* We'll load the axios HTTP library which allows us to easily issue requests
* to our Laravel back-end. This library automatically handles sending the
* CSRF token as a header based on the value of the "XSRF" token cookie.
*/
window.axios = require('axios');
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
/**
* Echo exposes an expressive API for subscribing to channels and listening
* for events that are broadcast by Laravel. Echo and event broadcasting
* allows your team to easily build robust real-time web applications.
*/
// import Echo from 'laravel-echo';
// window.Pusher = require('pusher-js');
// window.Echo = new Echo({
// broadcaster: 'pusher',
// key: process.env.MIX_PUSHER_APP_KEY,
// cluster: process.env.MIX_PUSHER_APP_CLUSTER,
// forceTLS: true
// });
care-w4/resources/js/charts/Chart.js 0 → 100644
View file @ a2283070
const ctx = document.getElementById('chart');
const chart = new Chart(ctx, {
type : data.type,
data : {
labels: data.labels,
datasets: data.datasets,
},
options: {
responsive: true,
maintainAspectRatio: true,
plugins: {
legend: {
display: false
}
}
}
});
const chart = new Chart(ctx, {
type: data.type,
data : {
labels: data.labels,
datasets: data.datasets,
},
options: {
scales: {
x: {
ticks: {
beginAtZero: false,
callback: function(value, index, ticks) {
const date = new Date(Date.parse(data.labels[index]));
const previousDate = new Date(Date.parse(data.labels[index-1]));
return `${date.toLocaleString('default', { month: 'short' })} ${date.getFullYear()}`;
}
}
},
y: {
ticks: {
beginAtZero: false,
callback: function(value, index, ticks){
return ` ${value}${unit}`;
}
}
}
},
responsive: true,
maintainAspectRatio: true,
plugins: {
legend: {
display: false
}
}
}
});
\ No newline at end of file
care-w4/resources/js/charts/Gauge.js 0 → 100644
View file @ a2283070
const gaugeCtx = document.getElementById('gaugeChart');
const gaugeChart = new Chart2(gaugeCtx, {
type: "gauge",
data: {
labels: ["good", "poor", "bad"],
legend: { display: false },
datasets: [
{
data: [15, 40, 60],
value: 30,
backgroundColor: [
"rgb(61,204,91)",
"rgb(239,214,19)",
"rgb(255,84,84)",
],
borderWidth: 2,
},
],
},
options: {
responsive: false,
title: {
display: true,
text: "Gauge",
fontSize: 16,
},
tooltips: { enabled: true },
//layout: {
// padding: {
// bottom: 30,
// },
//},
needle: {
radiusPercentage: 0, // Needle circle radius as the percentage
widthPercentage: 5, // Needle width as the percentage
lengthPercentage: 100, // Needle length as the percentage
//color: 'black' // color of the needle
},
cutoutPercentage: 70,
valueLabel: {
display: true,
//fontSize: 16,
color: "black",
backgroundColor: "white",
borderRadius: 5,
formatter: (value) => {
return Math.round(value * 10) / 10 + " µ/m³";
},
},
},
});
care-w4/resources/js/charts/Realtime.js 0 → 100644
View file @ a2283070
const realCtx = document.getElementById('realtimeChart');
const realtimeChart = new Chart(realCtx, {
type : 'line',
data : {
labels: ["0"],
datasets: [
{
'label' : 'Realtime',
'data' : [0],
'fill' : true,
"borderColor" : "#1434A4",
"tension" : 0.1,
"backgroundColor" : "rgba(0, 150, 255,0.5)",
"cornerRadius" : 10
}
],
},
options: {
responsive: true,
maintainAspectRatio: true,
plugins: {
legend: {
display: false
}
}
}
});
\ No newline at end of file
care-w4/resources/markdown/policy.md
View file @ a2283070
# Privacy Policy
Edit this file to define the privacy policy for your application.
# Privacy Policy
Edit this file to define the privacy policy for your application.
care-w4/resources/markdown/terms.md
View file @ a2283070
# Terms of Service
Edit this file to define the terms of service for your application.
# Terms of Service
Edit this file to define the terms of service for your application.
care-w4/resources/views/api/api-token-manager.blade.php
View file @ a2283070
<div>
<!-- Generate API Token -->
<x-form-section submit="createApiToken">
<x-slot name="title">
{{ __('Create API Token') }}
</x-slot>
<x-slot name="description">
{{ __('API tokens allow third-party services to authenticate with our application on your behalf.') }}
</x-slot>
<x-slot name="form">
<!-- Token Name -->
<div class="col-span-6 sm:col-span-4">
<x-label for="name" value="{{ __('Token Name') }}" />
<x-input id="name" type="text" class="mt-1 block w-full" wire:model.defer="createApiTokenForm.name" autofocus />
<x-input-error for="name" class="mt-2" />
</div>
<!-- Token Permissions -->
@if (Laravel\Jetstream\Jetstream::hasPermissions())
<div class="col-span-6">
<x-label for="permissions" value="{{ __('Permissions') }}" />
<div class="mt-2 grid grid-cols-1 md:grid-cols-2 gap-4">
@foreach (Laravel\Jetstream\Jetstream::$permissions as $permission)
<label class="flex items-center">
<x-checkbox wire:model.defer="createApiTokenForm.permissions" :value="$permission"/>
<span class="ml-2 text-sm text-gray-600">{{ $permission }}</span>
</label>
@endforeach
</div>
</div>
@endif
</x-slot>
<x-slot name="actions">
<x-action-message class="mr-3" on="created">
{{ __('Created.') }}
</x-action-message>
<x-button>
{{ __('Create') }}
</x-button>
</x-slot>
</x-form-section>
@if ($this->user->tokens->isNotEmpty())
<x-section-border />
<!-- Manage API Tokens -->
<div class="mt-10 sm:mt-0">
<x-action-section>
<x-slot name="title">
{{ __('Manage API Tokens') }}
</x-slot>
<x-slot name="description">
{{ __('You may delete any of your existing tokens if they are no longer needed.') }}
</x-slot>
<!-- API Token List -->
<x-slot name="content">
<div class="space-y-6">
@foreach ($this->user->tokens->sortBy('name') as $token)
<div class="flex items-center justify-between">
<div class="break-all">
{{ $token->name }}
</div>
<div class="flex items-center ml-2">
@if ($token->last_used_at)
<div class="text-sm text-gray-400">
{{ __('Last used') }} {{ $token->last_used_at->diffForHumans() }}
</div>
@endif
@if (Laravel\Jetstream\Jetstream::hasPermissions())
<button class="cursor-pointer ml-6 text-sm text-gray-400 underline" wire:click="manageApiTokenPermissions({{ $token->id }})">
{{ __('Permissions') }}
</button>
@endif
<button class="cursor-pointer ml-6 text-sm text-red-500" wire:click="confirmApiTokenDeletion({{ $token->id }})">
{{ __('Delete') }}
</button>
</div>
</div>
@endforeach
</div>
</x-slot>
</x-action-section>
</div>
@endif
<!-- Token Value Modal -->
<x-dialog-modal wire:model="displayingToken">
<x-slot name="title">
{{ __('API Token') }}
</x-slot>
<x-slot name="content">
<div>
{{ __('Please copy your new API token. For your security, it won\'t be shown again.') }}
</div>
<x-input x-ref="plaintextToken" type="text" readonly :value="$plainTextToken"
class="mt-4 bg-gray-100 px-4 py-2 rounded font-mono text-sm text-gray-500 w-full break-all"
autofocus autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
@showing-token-modal.window="setTimeout(() => $refs.plaintextToken.select(), 250)"
/>
</x-slot>
<x-slot name="footer">
<x-secondary-button wire:click="$set('displayingToken', false)" wire:loading.attr="disabled">
{{ __('Close') }}
</x-secondary-button>
</x-slot>
</x-dialog-modal>
<!-- API Token Permissions Modal -->
<x-dialog-modal wire:model="managingApiTokenPermissions">
<x-slot name="title">
{{ __('API Token Permissions') }}
</x-slot>
<x-slot name="content">
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
@foreach (Laravel\Jetstream\Jetstream::$permissions as $permission)
<label class="flex items-center">
<x-checkbox wire:model.defer="updateApiTokenForm.permissions" :value="$permission"/>
<span class="ml-2 text-sm text-gray-600">{{ $permission }}</span>
</label>
@endforeach
</div>
</x-slot>
<x-slot name="footer">
<x-secondary-button wire:click="$set('managingApiTokenPermissions', false)" wire:loading.attr="disabled">
{{ __('Cancel') }}
</x-secondary-button>
<x-button class="ml-3" wire:click="updateApiToken" wire:loading.attr="disabled">
{{ __('Save') }}
</x-button>
</x-slot>
</x-dialog-modal>
<!-- Delete Token Confirmation Modal -->
<x-confirmation-modal wire:model="confirmingApiTokenDeletion">
<x-slot name="title">
{{ __('Delete API Token') }}
</x-slot>
<x-slot name="content">
{{ __('Are you sure you would like to delete this API token?') }}
</x-slot>
<x-slot name="footer">
<x-secondary-button wire:click="$toggle('confirmingApiTokenDeletion')" wire:loading.attr="disabled">
{{ __('Cancel') }}
</x-secondary-button>
<x-danger-button class="ml-3" wire:click="deleteApiToken" wire:loading.attr="disabled">
{{ __('Delete') }}
</x-danger-button>
</x-slot>
</x-confirmation-modal>
</div>
<div>
<!-- Generate API Token -->
<x-form-section submit="createApiToken">
<x-slot name="title">
{{ __('Create API Token') }}
</x-slot>
<x-slot name="description">
{{ __('API tokens allow third-party services to authenticate with our application on your behalf.') }}
</x-slot>
<x-slot name="form">
<!-- Token Name -->
<div class="col-span-6 sm:col-span-4">
<x-label for="name" value="{{ __('Token Name') }}" />
<x-input id="name" type="text" class="mt-1 block w-full" wire:model.defer="createApiTokenForm.name" autofocus />
<x-input-error for="name" class="mt-2" />
</div>
<!-- Token Permissions -->
@if (Laravel\Jetstream\Jetstream::hasPermissions())
<div class="col-span-6">
<x-label for="permissions" value="{{ __('Permissions') }}" />
<div class="mt-2 grid grid-cols-1 md:grid-cols-2 gap-4">
@foreach (Laravel\Jetstream\Jetstream::$permissions as $permission)
<label class="flex items-center">
<x-checkbox wire:model.defer="createApiTokenForm.permissions" :value="$permission"/>
<span class="ml-2 text-sm text-gray-600">{{ $permission }}</span>
</label>
@endforeach
</div>
</div>
@endif
</x-slot>
<x-slot name="actions">
<x-action-message class="mr-3" on="created">
{{ __('Created.') }}
</x-action-message>
<x-button>
{{ __('Create') }}
</x-button>
</x-slot>
</x-form-section>
@if ($this->user->tokens->isNotEmpty())
<x-section-border />
<!-- Manage API Tokens -->
<div class="mt-10 sm:mt-0">
<x-action-section>
<x-slot name="title">
{{ __('Manage API Tokens') }}
</x-slot>
<x-slot name="description">
{{ __('You may delete any of your existing tokens if they are no longer needed.') }}
</x-slot>
<!-- API Token List -->
<x-slot name="content">
<div class="space-y-6">
@foreach ($this->user->tokens->sortBy('name') as $token)
<div class="flex items-center justify-between">
<div class="break-all">
{{ $token->name }}
</div>
<div class="flex items-center ml-2">
@if ($token->last_used_at)
<div class="text-sm text-gray-400">
{{ __('Last used') }} {{ $token->last_used_at->diffForHumans() }}
</div>
@endif
@if (Laravel\Jetstream\Jetstream::hasPermissions())
<button class="cursor-pointer ml-6 text-sm text-gray-400 underline" wire:click="manageApiTokenPermissions({{ $token->id }})">
{{ __('Permissions') }}
</button>
@endif
<button class="cursor-pointer ml-6 text-sm text-red-500" wire:click="confirmApiTokenDeletion({{ $token->id }})">
{{ __('Delete') }}
</button>
</div>
</div>
@endforeach
</div>
</x-slot>
</x-action-section>
</div>
@endif
<!-- Token Value Modal -->
<x-dialog-modal wire:model="displayingToken">
<x-slot name="title">
{{ __('API Token') }}
</x-slot>
<x-slot name="content">
<div>
{{ __('Please copy your new API token. For your security, it won\'t be shown again.') }}
</div>
<x-input x-ref="plaintextToken" type="text" readonly :value="$plainTextToken"
class="mt-4 bg-gray-100 px-4 py-2 rounded font-mono text-sm text-gray-500 w-full break-all"
autofocus autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
@showing-token-modal.window="setTimeout(() => $refs.plaintextToken.select(), 250)"
/>
</x-slot>
<x-slot name="footer">
<x-secondary-button wire:click="$set('displayingToken', false)" wire:loading.attr="disabled">
{{ __('Close') }}
</x-secondary-button>
</x-slot>
</x-dialog-modal>
<!-- API Token Permissions Modal -->
<x-dialog-modal wire:model="managingApiTokenPermissions">
<x-slot name="title">
{{ __('API Token Permissions') }}
</x-slot>
<x-slot name="content">
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
@foreach (Laravel\Jetstream\Jetstream::$permissions as $permission)
<label class="flex items-center">
<x-checkbox wire:model.defer="updateApiTokenForm.permissions" :value="$permission"/>
<span class="ml-2 text-sm text-gray-600">{{ $permission }}</span>
</label>
@endforeach
</div>
</x-slot>
<x-slot name="footer">
<x-secondary-button wire:click="$set('managingApiTokenPermissions', false)" wire:loading.attr="disabled">
{{ __('Cancel') }}
</x-secondary-button>
<x-button class="ml-3" wire:click="updateApiToken" wire:loading.attr="disabled">
{{ __('Save') }}
</x-button>
</x-slot>
</x-dialog-modal>
<!-- Delete Token Confirmation Modal -->
<x-confirmation-modal wire:model="confirmingApiTokenDeletion">
<x-slot name="title">
{{ __('Delete API Token') }}
</x-slot>
<x-slot name="content">
{{ __('Are you sure you would like to delete this API token?') }}
</x-slot>
<x-slot name="footer">
<x-secondary-button wire:click="$toggle('confirmingApiTokenDeletion')" wire:loading.attr="disabled">
{{ __('Cancel') }}
</x-secondary-button>
<x-danger-button class="ml-3" wire:click="deleteApiToken" wire:loading.attr="disabled">
{{ __('Delete') }}
</x-danger-button>
</x-slot>
</x-confirmation-modal>
</div>
care-w4/resources/views/api/index.blade.php
View file @ a2283070
<x-app-layout>
<x-slot name="header">
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
{{ __('API Tokens') }}
</h2>
</x-slot>
<div>
<div class="max-w-7xl mx-auto py-10 sm:px-6 lg:px-8">
@livewire('api.api-token-manager')
</div>
</div>
</x-app-layout>
<x-app-layout>
<x-slot name="header">
<h2 class="font-semibold text-xl text-white leading-tight">
{{ __('API Tokens') }}
</h2>
</x-slot>
<div>
<div class="max-w-7xl mx-auto py-10 sm:px-6 lg:px-8">
@livewire('api.api-token-manager')
</div>
</div>
</x-app-layout>
care-w4/resources/views/auth/confirm-password.blade.php
View file @ a2283070
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<div class="mb-4 text-sm text-gray-600">
{{ __('This is a secure area of the application. Please confirm your password before continuing.') }}
</div>
<x-validation-errors class="mb-4" />
<form method="POST" action="{{ route('password.confirm') }}">
@csrf
<div>
<x-label for="password" value="{{ __('Password') }}" />
<x-input id="password" class="block mt-1 w-full" type="password" name="password" required autocomplete="current-password" autofocus />
</div>
<div class="flex justify-end mt-4">
<x-button class="ml-4">
{{ __('Confirm') }}
</x-button>
</div>
</form>
</x-authentication-card>
</x-guest-layout>
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<div class="mb-4 text-sm text-gray-600">
{{ __('This is a secure area of the application. Please confirm your password before continuing.') }}
</div>
<x-validation-errors class="mb-4" />
<form method="POST" action="{{ route('password.confirm') }}">
@csrf
<div>
<x-label for="password" value="{{ __('Password') }}" />
<x-input id="password" class="block mt-1 w-full" type="password" name="password" required autocomplete="current-password" autofocus />
</div>
<div class="flex justify-end mt-4">
<x-button class="ml-4">
{{ __('Confirm') }}
</x-button>
</div>
</form>
</x-authentication-card>
</x-guest-layout>
care-w4/resources/views/auth/forgot-password.blade.php
View file @ a2283070
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<div class="mb-4 text-sm text-gray-600">
{{ __('Forgot your password? No problem. Just let us know your email address and we will email you a password reset link that will allow you to choose a new one.') }}
</div>
@if (session('status'))
<div class="mb-4 font-medium text-sm text-green-600">
{{ session('status') }}
</div>
@endif
<x-validation-errors class="mb-4" />
<form method="POST" action="{{ route('password.email') }}">
@csrf
<div class="block">
<x-label for="email" value="{{ __('Email') }}" />
<x-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email')" required autofocus autocomplete="username" />
</div>
<div class="flex items-center justify-end mt-4">
<x-button>
{{ __('Email Password Reset Link') }}
</x-button>
</div>
</form>
</x-authentication-card>
</x-guest-layout>
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<div class="mb-4 text-sm text-gray-600">
{{ __('Forgot your password? No problem. Just let us know your email address and we will email you a password reset link that will allow you to choose a new one.') }}
</div>
@if (session('status'))
<div class="mb-4 font-medium text-sm text-green-600">
{{ session('status') }}
</div>
@endif
<x-validation-errors class="mb-4" />
<form method="POST" action="{{ route('password.email') }}">
@csrf
<div class="block">
<x-label for="email" value="{{ __('Email') }}" />
<x-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email')" required autofocus autocomplete="username" />
</div>
<div class="flex items-center justify-end mt-4">
<x-button>
{{ __('Email Password Reset Link') }}
</x-button>
</div>
</form>
</x-authentication-card>
</x-guest-layout>
care-w4/resources/views/auth/login.blade.php
View file @ a2283070
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<x-validation-errors class="mb-4" />
@if (session('status'))
<div class="mb-4 font-medium text-sm text-green-600">
{{ session('status') }}
</div>
@endif
<form method="POST" action="{{ route('login') }}">
@csrf
<div>
<x-label for="email" value="{{ __('Email') }}" />
<x-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email')" required autofocus autocomplete="username" />
</div>
<div class="mt-4">
<x-label for="password" value="{{ __('Password') }}" />
<x-input id="password" class="block mt-1 w-full" type="password" name="password" required autocomplete="current-password" />
</div>
<div class="block mt-4">
<label for="remember_me" class="flex items-center">
<x-checkbox id="remember_me" name="remember" />
<span class="ml-2 text-sm text-gray-600">{{ __('Remember me') }}</span>
</label>
</div>
<div class="flex items-center justify-end mt-4">
@if (Route::has('password.request'))
<a class="underline text-sm text-gray-600 hover:text-gray-900 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500" href="{{ route('password.request') }}">
{{ __('Forgot your password?') }}
</a>
@endif
<x-button class="ml-4">
{{ __('Log in') }}
</x-button>
</div>
</form>
</x-authentication-card>
</x-guest-layout>
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<x-validation-errors class="mb-4" />
@if (session('status'))
<div class="mb-4 font-medium text-sm text-green-600">
{{ session('status') }}
</div>
@endif
<form method="POST" action="{{ route('login') }}">
@csrf
<div>
<x-label for="email" value="{{ __('Email') }}" />
<x-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email')" required autofocus autocomplete="username" />
</div>
<div class="mt-4">
<x-label for="password" value="{{ __('Password') }}" />
<x-input id="password" class="block mt-1 w-full" type="password" name="password" required autocomplete="current-password" />
</div>
<div class="block mt-4">
<label for="remember_me" class="flex items-center">
<x-checkbox id="remember_me" name="remember" />
<span class="ml-2 text-sm text-gray-600">{{ __('Remember me') }}</span>
</label>
</div>
<div class="flex items-center justify-end mt-4">
@if (Route::has('password.request'))
<a class="underline text-sm text-gray-600 hover:text-white rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500" href="{{ route('password.request') }}">
{{ __('Forgot your password?') }}
</a>
@endif
<x-button class="ml-4">
{{ __('Log in') }}
</x-button>
</div>
</form>
</x-authentication-card>
</x-guest-layout>
care-w4/resources/views/auth/register.blade.php
View file @ a2283070
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<x-validation-errors class="mb-4" />
<form method="POST" action="{{ route('register') }}">
@csrf
<div>
<x-label for="name" value="{{ __('Name') }}" />
<x-input id="name" class="block mt-1 w-full" type="text" name="name" :value="old('name')" required autofocus autocomplete="name" />
</div>
<div class="mt-4">
<x-label for="email" value="{{ __('Email') }}" />
<x-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email')" required autocomplete="username" />
</div>
<div class="mt-4">
<x-label for="password" value="{{ __('Password') }}" />
<x-input id="password" class="block mt-1 w-full" type="password" name="password" required autocomplete="new-password" />
</div>
<div class="mt-4">
<x-label for="password_confirmation" value="{{ __('Confirm Password') }}" />
<x-input id="password_confirmation" class="block mt-1 w-full" type="password" name="password_confirmation" required autocomplete="new-password" />
</div>
@if (Laravel\Jetstream\Jetstream::hasTermsAndPrivacyPolicyFeature())
<div class="mt-4">
<x-label for="terms">
<div class="flex items-center">
<x-checkbox name="terms" id="terms" required />
<div class="ml-2">
{!! __('I agree to the :terms_of_service and :privacy_policy', [
'terms_of_service' => '<a target="_blank" href="'.route('terms.show').'" class="underline text-sm text-gray-600 hover:text-gray-900 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">'.__('Terms of Service').'</a>',
'privacy_policy' => '<a target="_blank" href="'.route('policy.show').'" class="underline text-sm text-gray-600 hover:text-gray-900 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">'.__('Privacy Policy').'</a>',
]) !!}
</div>
</div>
</x-label>
</div>
@endif
<div class="flex items-center justify-end mt-4">
<a class="underline text-sm text-gray-600 hover:text-gray-900 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500" href="{{ route('login') }}">
{{ __('Already registered?') }}
</a>
<x-button class="ml-4">
{{ __('Register') }}
</x-button>
</div>
</form>
</x-authentication-card>
</x-guest-layout>
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<x-validation-errors class="mb-4" />
<form method="POST" action="{{ route('register') }}">
@csrf
<div>
<x-label for="name" value="{{ __('Name') }}" />
<x-input id="name" class="block mt-1 w-full" type="text" name="name" :value="old('name')" required autofocus autocomplete="name" />
</div>
<div class="mt-4">
<x-label for="email" value="{{ __('Email') }}" />
<x-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email')" required autocomplete="username" />
</div>
<div class="mt-4">
<x-label for="password" value="{{ __('Password') }}" />
<x-input id="password" class="block mt-1 w-full" type="password" name="password" required autocomplete="new-password" />
</div>
<div class="mt-4">
<x-label for="password_confirmation" value="{{ __('Confirm Password') }}" />
<x-input id="password_confirmation" class="block mt-1 w-full" type="password" name="password_confirmation" required autocomplete="new-password" />
</div>
@if (Laravel\Jetstream\Jetstream::hasTermsAndPrivacyPolicyFeature())
<div class="mt-4">
<x-label for="terms">
<div class="flex items-center">
<x-checkbox name="terms" id="terms" required />
<div class="ml-2">
{!! __('I agree to the :terms_of_service and :privacy_policy', [
'terms_of_service' => '<a target="_blank" href="'.route('terms.show').'" class="underline text-sm text-gray-600 hover:text-white rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">'.__('Terms of Service').'</a>',
'privacy_policy' => '<a target="_blank" href="'.route('policy.show').'" class="underline text-sm text-gray-600 hover:text-white rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">'.__('Privacy Policy').'</a>',
]) !!}
</div>
</div>
</x-label>
</div>
@endif
<div class="flex items-center justify-end mt-4">
<a class="underline text-sm text-gray-600 hover:text-white rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500" href="{{ route('login') }}">
{{ __('Already registered?') }}
</a>
<x-button class="ml-4">
{{ __('Register') }}
</x-button>
</div>
</form>
</x-authentication-card>
</x-guest-layout>
care-w4/resources/views/auth/reset-password.blade.php
View file @ a2283070
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<x-validation-errors class="mb-4" />
<form method="POST" action="{{ route('password.update') }}">
@csrf
<input type="hidden" name="token" value="{{ $request->route('token') }}">
<div class="block">
<x-label for="email" value="{{ __('Email') }}" />
<x-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email', $request->email)" required autofocus autocomplete="username" />
</div>
<div class="mt-4">
<x-label for="password" value="{{ __('Password') }}" />
<x-input id="password" class="block mt-1 w-full" type="password" name="password" required autocomplete="new-password" />
</div>
<div class="mt-4">
<x-label for="password_confirmation" value="{{ __('Confirm Password') }}" />
<x-input id="password_confirmation" class="block mt-1 w-full" type="password" name="password_confirmation" required autocomplete="new-password" />
</div>
<div class="flex items-center justify-end mt-4">
<x-button>
{{ __('Reset Password') }}
</x-button>
</div>
</form>
</x-authentication-card>
</x-guest-layout>
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<x-validation-errors class="mb-4" />
<form method="POST" action="{{ route('password.update') }}">
@csrf
<input type="hidden" name="token" value="{{ $request->route('token') }}">
<div class="block">
<x-label for="email" value="{{ __('Email') }}" />
<x-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email', $request->email)" required autofocus autocomplete="username" />
</div>
<div class="mt-4">
<x-label for="password" value="{{ __('Password') }}" />
<x-input id="password" class="block mt-1 w-full" type="password" name="password" required autocomplete="new-password" />
</div>
<div class="mt-4">
<x-label for="password_confirmation" value="{{ __('Confirm Password') }}" />
<x-input id="password_confirmation" class="block mt-1 w-full" type="password" name="password_confirmation" required autocomplete="new-password" />
</div>
<div class="flex items-center justify-end mt-4">
<x-button>
{{ __('Reset Password') }}
</x-button>
</div>
</form>
</x-authentication-card>
</x-guest-layout>
care-w4/resources/views/auth/two-factor-challenge.blade.php
View file @ a2283070
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<div x-data="{ recovery: false }">
<div class="mb-4 text-sm text-gray-600" x-show="! recovery">
{{ __('Please confirm access to your account by entering the authentication code provided by your authenticator application.') }}
</div>
<div class="mb-4 text-sm text-gray-600" x-show="recovery">
{{ __('Please confirm access to your account by entering one of your emergency recovery codes.') }}
</div>
<x-validation-errors class="mb-4" />
<form method="POST" action="{{ route('two-factor.login') }}">
@csrf
<div class="mt-4" x-show="! recovery">
<x-label for="code" value="{{ __('Code') }}" />
<x-input id="code" class="block mt-1 w-full" type="text" inputmode="numeric" name="code" autofocus x-ref="code" autocomplete="one-time-code" />
</div>
<div class="mt-4" x-show="recovery">
<x-label for="recovery_code" value="{{ __('Recovery Code') }}" />
<x-input id="recovery_code" class="block mt-1 w-full" type="text" name="recovery_code" x-ref="recovery_code" autocomplete="one-time-code" />
</div>
<div class="flex items-center justify-end mt-4">
<button type="button" class="text-sm text-gray-600 hover:text-gray-900 underline cursor-pointer"
x-show="! recovery"
x-on:click="
recovery = true;
$nextTick(() => { $refs.recovery_code.focus() })
">
{{ __('Use a recovery code') }}
</button>
<button type="button" class="text-sm text-gray-600 hover:text-gray-900 underline cursor-pointer"
x-show="recovery"
x-on:click="
recovery = false;
$nextTick(() => { $refs.code.focus() })
">
{{ __('Use an authentication code') }}
</button>
<x-button class="ml-4">
{{ __('Log in') }}
</x-button>
</div>
</form>
</div>
</x-authentication-card>
</x-guest-layout>
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<div x-data="{ recovery: false }">
<div class="mb-4 text-sm text-gray-600" x-show="! recovery">
{{ __('Please confirm access to your account by entering the authentication code provided by your authenticator application.') }}
</div>
<div class="mb-4 text-sm text-gray-600" x-show="recovery">
{{ __('Please confirm access to your account by entering one of your emergency recovery codes.') }}
</div>
<x-validation-errors class="mb-4" />
<form method="POST" action="{{ route('two-factor.login') }}">
@csrf
<div class="mt-4" x-show="! recovery">
<x-label for="code" value="{{ __('Code') }}" />
<x-input id="code" class="block mt-1 w-full" type="text" inputmode="numeric" name="code" autofocus x-ref="code" autocomplete="one-time-code" />
</div>
<div class="mt-4" x-show="recovery">
<x-label for="recovery_code" value="{{ __('Recovery Code') }}" />
<x-input id="recovery_code" class="block mt-1 w-full" type="text" name="recovery_code" x-ref="recovery_code" autocomplete="one-time-code" />
</div>
<div class="flex items-center justify-end mt-4">
<button type="button" class="text-sm text-gray-600 hover:text-white underline cursor-pointer"
x-show="! recovery"
x-on:click="
recovery = true;
$nextTick(() => { $refs.recovery_code.focus() })
">
{{ __('Use a recovery code') }}
</button>
<button type="button" class="text-sm text-gray-600 hover:text-white underline cursor-pointer"
x-show="recovery"
x-on:click="
recovery = false;
$nextTick(() => { $refs.code.focus() })
">
{{ __('Use an authentication code') }}
</button>
<x-button class="ml-4">
{{ __('Log in') }}
</x-button>
</div>
</form>
</div>
</x-authentication-card>
</x-guest-layout>
care-w4/resources/views/auth/verify-email.blade.php
View file @ a2283070
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<div class="mb-4 text-sm text-gray-600">
{{ __('Before continuing, could you verify your email address by clicking on the link we just emailed to you? If you didn\'t receive the email, we will gladly send you another.') }}
</div>
@if (session('status') == 'verification-link-sent')
<div class="mb-4 font-medium text-sm text-green-600">
{{ __('A new verification link has been sent to the email address you provided in your profile settings.') }}
</div>
@endif
<div class="mt-4 flex items-center justify-between">
<form method="POST" action="{{ route('verification.send') }}">
@csrf
<div>
<x-button type="submit">
{{ __('Resend Verification Email') }}
</x-button>
</div>
</form>
<div>
<a
href="{{ route('profile.show') }}"
class="underline text-sm text-gray-600 hover:text-gray-900 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
>
{{ __('Edit Profile') }}</a>
<form method="POST" action="{{ route('logout') }}" class="inline">
@csrf
<button type="submit" class="underline text-sm text-gray-600 hover:text-gray-900 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 ml-2">
{{ __('Log Out') }}
</button>
</form>
</div>
</div>
</x-authentication-card>
</x-guest-layout>
<x-guest-layout>
<x-authentication-card>
<x-slot name="logo">
<x-authentication-card-logo />
</x-slot>
<div class="mb-4 text-sm text-gray-600">
{{ __('Before continuing, could you verify your email address by clicking on the link we just emailed to you? If you didn\'t receive the email, we will gladly send you another.') }}
</div>
@if (session('status') == 'verification-link-sent')
<div class="mb-4 font-medium text-sm text-green-600">
{{ __('A new verification link has been sent to the email address you provided in your profile settings.') }}
</div>
@endif
<div class="mt-4 flex items-center justify-between">
<form method="POST" action="{{ route('verification.send') }}">
@csrf
<div>
<x-button type="submit">
{{ __('Resend Verification Email') }}
</x-button>
</div>
</form>
<div>
<a
href="{{ route('profile.show') }}"
class="underline text-sm text-gray-600 hover:text-white rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
>
{{ __('Edit Profile') }}</a>
<form method="POST" action="{{ route('logout') }}" class="inline">
@csrf
<button type="submit" class="underline text-sm text-gray-600 hover:text-white rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 ml-2">
{{ __('Log Out') }}
</button>
</form>
</div>
</div>
</x-authentication-card>
</x-guest-layout>
care-w4/resources/views/chart.blade.php
View file @ a2283070
<x-guest-layout>
@section('title', "$folder")
@section('breadcrumb')
<x-breadcrumb-item href="/{{ $database }}/{{ $folders[0] }}">{{ $database }}</x-breadcrumb-item>
<x-breadcrumb-active>{{ $folder }}</x-breadcrumb-active>
@endsection
@section('controls')
<form action="/{{ $database }}/{{ $folder }}/time-range" class="mb-5 float-right">
<div class="hidden">
<div class="days">
<div class="days-of-week grid grid-cols-7 mb-1 dow block flex-1 leading-9 border-0 rounded-lg cursor-default text-center text-gray-900 font-semibold text-sm"></div>
<div class="datepicker-grid w-64 grid grid-cols-7 block flex-1 leading-9 border-0 rounded-lg cursor-default text-center text-gray-900 font-semibold text-sm h-6 leading-6 text-sm font-medium text-gray-500 dark:text-gray-400"></div>
</div>
<div class="calendar-weeks">
<div class="days-of-week flex"><span class="dow h-6 leading-6 text-sm font-medium text-gray-500 dark:text-gray-400"></span></div>
<div class="weeks week block flex-1 leading-9 border-0 rounded-lg cursor-default text-center text-gray-900 font-semibold text-sm"></div>
</div>
</div>
<div date-rangepicker class="flex items-center">
<div class="relative">
<div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">
<svg aria-hidden="true" class="w-5 h-5 text-gray-500 dark:text-gray-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z" clip-rule="evenodd"></path></svg>
</div>
<input name="start" type="text" class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full pl-10 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder="Select date start" value="{{ $start_date }}">
</div>
<span class="mx-4 text-gray-500">to</span>
<div class="relative">
<div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">
<svg aria-hidden="true" class="w-5 h-5 text-gray-500 dark:text-gray-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z" clip-rule="evenodd"></path></svg>
</div>
<input name="end" type="text" class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full pl-10 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder="Select date end" value="{{ $end_date }}">
</div>
<div class="relative">
<button type="submit" class="ml-5 text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 mb-2 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none dark:focus:ring-blue-800 mt-2 ">Go</button>
</div>
</div>
</form>
@endsection
<div>
<div class="mb-8">
<x-toggle id="solenoid_status"
data-visible="{{ $solenoidValve_actuate ? $solenoidValve_actuate->value : 'null' }}"
class="toggle-buttons"
data-url="/solenoid/actuation/change"
data-update_url="/solenoid/current"
data-method="POST"
>
Solenoid Actuation
</x-toggle>
<x-toggle id="filterFanSensor_status"
data-visible="{{ $filterFanSensor_actuate ? $filterFanSensor_actuate->value : 'null' }}"
class="toggle-buttons"
data-url="/filterFanSensor/actuation/change"
data-update_url="/filterFanSensor/current"
data-method="POST"
>
Filter Fan Sensor
</x-toggle>
<x-toggle id="windowSensor_status"
data-visible="{{ $windowSensor_actuate ? $windowSensor_actuate->value : 'null' }}"
class="toggle-buttons"
data-url="/windowSensor/actuation/change"
data-update_url="/windowSensor/current"
data-method="POST"
>
Window Sensor
</x-toggle>
</div>
<div class="grid lg:grid-cols-5 md:grid-cols-4 md:gap-5 gap-x-0 gap-y-5 grid-cols-1">
<x-segment class=""></x-segment>
<x-segment class="clear-right lg:col-span-4 md:cols-span-3">
<canvas id="chart" class="w-full max-h-[50vh]"></canvas>
</x-segment>
<x-segment class=""></x-segment>
<x-segment class="clear-right lg:col-span-4 md:cols-span-3 mt-10">
<canvas id="realtimeChart" class="w-full max-h-[50vh]"></canvas>
</x-segment>
</div>
</div>
<script>
const data = {!! $result ?? '""' !!};
const database = "{{ $database }}";
const folder = "{{ $folder }}";
const solenoidValve_actuate = {!! $solenoidValve_actuate ?? "null" !!};
</script>
</x-guest-layout>
@php
use Carbon\Carbon;
@endphp
<x-guest-layout>
@section('title', "$folder")
@section('description', $folders[$folder][0])
@section('breadcrumb')
<x-breadcrumb-item href="/{{ $database }}/{{ $folder }}">{{ $database }}</x-breadcrumb-item>
<x-breadcrumb-active>{{ $folder }}</x-breadcrumb-active>
@endsection
@section('controls')
<form action="/{{ $database }}/{{ $folder }}/time-range" class="mb-5 float-right">
<div class="hidden">
<div class="days">
<div class="days-of-week grid grid-cols-7 mb-1 dow block flex-1 leading-9 border-0 rounded-lg cursor-default text-center text-white font-semibold text-sm"></div>
<div class="datepicker-grid w-64 grid grid-cols-7 block flex-1 leading-9 border-0 rounded-lg cursor-default text-center text-white font-semibold text-sm h-6 leading-6 text-sm font-medium text-gray-500 dark:text-gray-400"></div>
</div>
<div class="calendar-weeks">
<div class="days-of-week flex"><span class="dow h-6 leading-6 text-sm font-medium text-gray-500 dark:text-gray-400"></span></div>
<div class="weeks week block flex-1 leading-9 border-0 rounded-lg cursor-default text-center text-white font-semibold text-sm"></div>
</div>
</div>
<div date-rangepicker class="flex items-center">
<div class="relative">
<div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">
<svg aria-hidden="true" class="w-5 h-5 text-gray-500 dark:text-gray-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z" clip-rule="evenodd"></path></svg>
</div>
<input id="hanz" class="text-black bg-gray-50 border border-gray-300 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-72 pl-10 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" type="text" name="datetimes" value="{{ isset($start_date) && isset($end_date) ? Carbon::createFromFormat('m-d-Y H:i:s', $start_date)->format('m/d/Y H:i:s') . ' - ' . Carbon::createFromFormat('m-d-Y H:i:s', $end_date)->format('m/d/Y H:i:s') : '' }}"/>
</div>
<div class="relative">
<button type="submit" class="ml-5 text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 mb-2 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none dark:focus:ring-blue-800 mt-2">Go</button>
</div>
</div>
</form>
@endsection
<div>
<div class="mb-8">
<x-toggle id="solenoid_status"
data-visible="{{ $solenoidValve_actuate ? $solenoidValve_actuate->value : 'null' }}"
class="toggle-buttons"
data-url="/solenoid/actuation/change"
data-update_url="/solenoid/current"
data-method="POST"
>
Solenoid Actuation
</x-toggle>
<x-toggle id="filterFanSensor_status"
data-visible="{{ $filterFanSensor_actuate ? $filterFanSensor_actuate->value : 'null' }}"
class="toggle-buttons"
data-url="/filterFanSensor/actuation/change"
data-update_url="/filterFanSensor/current"
data-method="POST"
>
Filter Fan Sensor
</x-toggle>
<x-toggle id="windowSensor_status"
data-visible="{{ $windowSensor_actuate ? $windowSensor_actuate->value : 'null' }}"
class="toggle-buttons"
data-url="/windowSensor/actuation/change"
data-update_url="/windowSensor/current"
data-method="POST"
>
Window Sensor
</x-toggle>
<x-toggle id="FilterFan_status"
data-visible="{{ $FilterFan_actuate ? $FilterFan_actuate->value : 'null' }}"
class="toggle-buttons"
data-url="/FilterFan/actuation/change"
data-update_url="/FilterFan/current"
data-method="POST"
>
Filter Fan Actuation
</x-toggle>
<x-toggle id="Window_status"
data-visible="{{ $Window_actuate ? $Window_actuate->value : 'null' }}"
class="toggle-buttons"
data-url="/Window/actuation/change"
data-update_url="/Window/current"
data-method="POST"
>
Window Actuation
</x-toggle>
</div>
<div class="grid lg:grid-cols-5 md:grid-cols-4 md:gap-5 gap-x-0 gap-y-5 grid-cols-1">
<div class="bg-[#37393f] rounded-3xl py-5 ">
<canvas class="w-full max-h-[50vh] gauge-chart" data-value="{{ $min }}" data-label="Min"></canvas>
<canvas class="w-full max-h-[50vh] gauge-chart mt-10" data-value="{{ $max }}" data-label="Max"></canvas>
<canvas class="w-full max-h-[50vh] gauge-chart mt-10" data-value="{{ $average }}" data-label="Average"></canvas>
</div>
<x-segment class="clear-right lg:col-span-4 md:cols-span-3 bg-[#37393f]">
<canvas id="chart" class="w-full max-h-[50vh] "></canvas>
</x-segment>
<x-segment class="flex items-center lg:p-0 bg-[#37393f]">
<canvas id="realtimeGauge" class="w-full max-h-[50vh] object-center" data-value="0" data-label="Realtime"></canvas>
</x-segment>
<x-segment class="clear-right lg:col-span-4 md:cols-span-3 bg-[#37393f]">
<canvas id="realtimeChart" class="w-full max-h-[50vh] "></canvas>
</x-segment>
</div>
</div>
<script>
const data = {!! $result ?? '""' !!};
const database = "{{ $database }}";
const folder = "{{ $folder }}";
const solenoidValve_actuate = {!! $solenoidValve_actuate ?? "null" !!};
const unit = "{{ $unit }}";
const threshold = {{ json_encode($folders[$folder][1]) }};
const csrf_token = "{{ csrf_token() }}";
</script>
</x-guest-layout>
care-w4/resources/views/components/action-message.blade.php
View file @ a2283070
@props(['on'])
<div x-data="{ shown: false, timeout: null }"
x-init="@this.on('{{ $on }}', () => { clearTimeout(timeout); shown = true; timeout = setTimeout(() => { shown = false }, 2000); })"
x-show.transition.out.opacity.duration.1500ms="shown"
x-transition:leave.opacity.duration.1500ms
style="display: none;"
{{ $attributes->merge(['class' => 'text-sm text-gray-600']) }}>
{{ $slot->isEmpty() ? 'Saved.' : $slot }}
</div>
@props(['on'])
<div x-data="{ shown: false, timeout: null }"
x-init="@this.on('{{ $on }}', () => { clearTimeout(timeout); shown = true; timeout = setTimeout(() => { shown = false }, 2000); })"
x-show.transition.out.opacity.duration.1500ms="shown"
x-transition:leave.opacity.duration.1500ms
style="display: none;"
{{ $attributes->merge(['class' => 'text-sm text-gray-600']) }}>
{{ $slot->isEmpty() ? 'Saved.' : $slot }}
</div>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Menu

Help