added auth improvements and luci
This commit is contained in:
Russel Yasol
502
www/about.html
502
www/about.html
@@ -1,268 +1,308 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
<head>
|
||||||
<head>
|
<meta charset="UTF-8" />
|
||||||
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
||||||
|
|
||||||
<!-- Logo -->
|
<!-- Logo -->
|
||||||
<link rel="logo" href="favicon.ico" />
|
<link rel="logo" href="favicon.ico" />
|
||||||
|
|
||||||
<link rel="stylesheet" href="css/bulma/bulma.scss">
|
<link rel="stylesheet" href="css/bulma/bulma.scss" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.min.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.min.css" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.css" />
|
||||||
<link rel="stylesheet" href="css/custom.css">
|
<link rel="stylesheet" href="css/custom.css" />
|
||||||
|
|
||||||
<!-- Font awesome icons -->
|
<!-- Font awesome icons -->
|
||||||
<script src="https://kit.fontawesome.com/b0caedfab3.js" crossorigin="anonymous"></script>
|
<script
|
||||||
|
src="https://kit.fontawesome.com/b0caedfab3.js"
|
||||||
|
crossorigin="anonymous"
|
||||||
|
></script>
|
||||||
|
|
||||||
<script src="js/styles/nav-burger.js"></script>
|
|
||||||
<script src="js/styles/toggle-theme.js"></script>
|
<script src="js/styles/toggle-theme.js"></script>
|
||||||
|
<script src="/js/styles/nav-burger.js"></script>
|
||||||
|
<script src="/js/styles/modal-trigger.js"></script>
|
||||||
|
<script src="/js/utils/reboot.js"></script>
|
||||||
<script defer src="/js/auth/auth.js"></script>
|
<script defer src="/js/auth/auth.js"></script>
|
||||||
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
(function () {
|
(function () {
|
||||||
const savedTheme = localStorage.getItem('theme') || 'theme-dark';
|
const savedTheme = localStorage.getItem("theme") || "theme-dark";
|
||||||
document.documentElement.classList.add(savedTheme);
|
document.documentElement.classList.add(savedTheme);
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<title>QuecManager</title>
|
<title>QuecManager</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="body-margin">
|
<body class="body-margin">
|
||||||
<nav class="navbar is-transparent">
|
<nav class="navbar is-transparent">
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
<a class="navbar-item" href="/">
|
<a class="navbar-item" href="/">
|
||||||
<img src="/assets/logo.png" alt="Logo" />
|
<img src="/assets/logo.png" alt="Logo" />
|
||||||
<span class="title">QuecManager</span>
|
<span class="title">QuecManager</span>
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
role="button"
|
role="button"
|
||||||
class="navbar-burger"
|
class="navbar-burger"
|
||||||
aria-label="menu"
|
aria-label="menu"
|
||||||
aria-expanded="false"
|
aria-expanded="false"
|
||||||
data-target="navMenu"
|
data-target="navMenu"
|
||||||
>
|
>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="navMenu" class="navbar-menu">
|
<div id="navMenu" class="navbar-menu">
|
||||||
<div class="navbar-start ml-6">
|
<div class="navbar-start ml-6">
|
||||||
<a class="navbar-item" href="/"> Home </a>
|
<a class="navbar-item has-text-weight-bold" href="/"> Home </a>
|
||||||
<div class="navbar-item has-dropdown is-hoverable">
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
<a class="navbar-link"> Cellular </a>
|
<a class="navbar-link"> Cellular </a>
|
||||||
<div class="navbar-dropdown is-boxed">
|
<div class="navbar-dropdown is-boxed">
|
||||||
<a class="navbar-item" href="/bandlock.html"> Band Locking </a>
|
<a class="navbar-item" href="/bandlock.html"> Band Locking </a>
|
||||||
<a class="navbar-item" href="/cell-locking.html">Cell Locking</a>
|
<a class="navbar-item" href="/cell-locking.html">Cell Locking</a>
|
||||||
<a class="navbar-item" href="/cell-scanner.html">Cell Scanner</a>
|
<a class="navbar-item" href="/cell-scanner.html">Cell Scanner</a>
|
||||||
<a class="navbar-item" href="/cell-settings.html"
|
<a class="navbar-item" href="/cell-settings.html"
|
||||||
>Cell Settings</a
|
>Cell Settings</a
|
||||||
>
|
>
|
||||||
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<a class="navbar-item" href="/advance-settings.html"> Advance </a>
|
|
||||||
<a class="navbar-item has-text-weight-bold" href="/about.html"> About </a>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
<div class="navbar-end">
|
<a class="navbar-link"> Advance </a>
|
||||||
<div class="navbar-item">
|
<div class="navbar-dropdown is-boxed">
|
||||||
<div class="buttons is-flex-direction-column-mobile">
|
<a class="navbar-item" href="/advance-settings.html"> Advance Settings </a>
|
||||||
<p class="control is-expanded-mobile">
|
<a class="navbar-item" href="#">Experimental Features</a>
|
||||||
|
<a class="navbar-item" href="/cgi-bin/luci">OpenWRT Luci</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a class="navbar-item" href="/about.html"> About </a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="navbar-end">
|
||||||
|
<div class="navbar-item">
|
||||||
|
<div class="buttons is-flex-direction-column-mobile">
|
||||||
|
<p class="control is-expanded-mobile">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="button is-link is-outlined is-fullwidth-mobile"
|
||||||
|
>
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-arrows-rotate"></i>
|
||||||
|
</span>
|
||||||
|
<span>Restart Connection</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<div class="is-flex is-mobile is-align-items-center">
|
||||||
|
<p class="control">
|
||||||
|
<div href="#" class="button is-warning is-outlined reboot-modal" data-target="reboot-modal" >
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-power-off"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</p>
|
||||||
|
<p class="control ml-2 is-mobile">
|
||||||
<a
|
<a
|
||||||
href="#"
|
href="#"
|
||||||
class="button is-link is-outlined is-fullwidth-mobile"
|
class="button is-warning is-outlined js-theme-toggle"
|
||||||
>
|
>
|
||||||
<span class="icon">
|
<span class="icon">
|
||||||
<i class="fas fa-arrows-rotate"></i>
|
<i class="fas fa-sun"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>Restart Connection</span>
|
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
<div class="is-flex is-mobile is-align-items-center">
|
<p class="control ml-2 is-mobile">
|
||||||
<p class="control">
|
<a
|
||||||
<a href="#" class="button is-warning is-outlined">
|
href="#"
|
||||||
<span class="icon">
|
class="button is-warning is-outlined js-theme-toggle"
|
||||||
<i class="fas fa-power-off"></i>
|
id="logoutButton"
|
||||||
</span>
|
>
|
||||||
</a>
|
<span class="icon">
|
||||||
</p>
|
<i class="fas fa-right-from-bracket"></i>
|
||||||
<p class="control ml-2 is-mobile">
|
</span>
|
||||||
<a
|
</a>
|
||||||
href="#"
|
</p>
|
||||||
class="button is-warning is-outlined js-theme-toggle"
|
</div>
|
||||||
>
|
</div>
|
||||||
<span class="icon">
|
</div>
|
||||||
<i class="fas fa-sun"></i>
|
</div>
|
||||||
</span>
|
</div>
|
||||||
</a>
|
</nav>
|
||||||
</p>
|
|
||||||
<p class="control ml-2 is-mobile">
|
<div class="column-margin">
|
||||||
<a
|
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
||||||
href="#"
|
<div class="grid">
|
||||||
class="button is-warning is-outlined js-theme-toggle"
|
<div class="cell">
|
||||||
id="logoutButton"
|
<div class="card">
|
||||||
>
|
<div class="card-header">
|
||||||
<span class="icon">
|
<div class="card-header-title">Device Information</div>
|
||||||
<i class="fas fa-right-from-bracket"></i>
|
</div>
|
||||||
</span>
|
<div class="card-content">
|
||||||
</a>
|
<table class="table is-fullwidth is-borderless">
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td>Modem Manufacturer</td>
|
||||||
|
<th>Quectel</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Modem Model Name</td>
|
||||||
|
<th>RM520N-GL</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Firmware Version</td>
|
||||||
|
<th>RM520NGLAA123</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Phone Number</td>
|
||||||
|
<th>+639938931024</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>IMSI</td>
|
||||||
|
<th>123456789</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>ICCID</td>
|
||||||
|
<th>123456789</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>IMEI</td>
|
||||||
|
<th>
|
||||||
|
<div class="field has-addons is-hidden-mobile">
|
||||||
|
<div class="control">
|
||||||
|
<input
|
||||||
|
class="input has-text-weight-semibold"
|
||||||
|
type="text"
|
||||||
|
placeholder="IMEI Here"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="control">
|
||||||
|
<button class="button is-link">Change</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<span class="is-block-mobile is-hidden">
|
||||||
|
123456789123
|
||||||
|
</span>
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>LAN GATEWAY</td>
|
||||||
|
<th>192.168.225.1</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>WWAN IPv4</td>
|
||||||
|
<th>38.0.101.76</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>WWAN IPv6</td>
|
||||||
|
<th style="word-break: break-all">
|
||||||
|
5be8:dde9:7f0b:d5a7:bd01:b3be:9c69:573b
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<div class="card-header-title">About Us</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="content">
|
||||||
|
<p class="title">QuecManager</p>
|
||||||
|
<p class="subtitle mt-2">
|
||||||
|
Simple Admin began as part of the RGMII toolkit, offering
|
||||||
|
users a basic GUI. However, with our fork and continued
|
||||||
|
development, it has evolved to include more advanced
|
||||||
|
features, making "simple" no longer an ideal name for the
|
||||||
|
dashboard. Despite this shift, we remain committed to
|
||||||
|
providing advanced functionality while maintaining an
|
||||||
|
intuitive and user-friendly GUI.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
|
<p class="subtitle mt-6 has-text-weight-bold">Thanks to</p>
|
||||||
|
<ul class="has-text-weight-semibold">
|
||||||
|
<li>
|
||||||
|
RGMII Toolkit and Documentation
|
||||||
|
<a href="https://github.com/iamromulan" target="_blank"
|
||||||
|
>iamromulan</a
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Simple Admin 2.0 and QuecManager
|
||||||
|
<a href="https://github.com/dr-dolomite" target="_blank"
|
||||||
|
>dr-dolomite</a
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
SMS Feature
|
||||||
|
<a href="https://github.com/snjzb" target="_blank"
|
||||||
|
>snjzb</a
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Original Simple Admin
|
||||||
|
<a href="https://github.com/aesthernr" target="_blank"
|
||||||
|
>aesthernr</a
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Original Socat Bridge
|
||||||
|
<a href="https://github.com/natecarlson" target="_blank"
|
||||||
|
>natecarlson</a
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Initial Original Simple Admin Fixes
|
||||||
|
<a href="https://github.com/rbflurry/" target="_blank"
|
||||||
|
>rbflurry</a
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</div>
|
||||||
|
|
||||||
<div class="column-margin">
|
|
||||||
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
|
||||||
<div class="grid">
|
|
||||||
<div class="cell">
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-header">
|
|
||||||
<div class="card-header-title">
|
|
||||||
Device Information
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-content">
|
|
||||||
<table class="table is-fullwidth is-borderless">
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td>Modem Manufacturer</td>
|
|
||||||
<th>Quectel</th>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>Modem Model Name</td>
|
|
||||||
<th>RM520N-GL</th>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>Firmware Version</td>
|
|
||||||
<th>RM520NGLAA123</th>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>Phone Number</td>
|
|
||||||
<th>+639938931024</th>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>IMSI</td>
|
|
||||||
<th>123456789</th>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>ICCID</td>
|
|
||||||
<th>123456789</th>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>IMEI</td>
|
|
||||||
<th>
|
|
||||||
<div class="field has-addons is-hidden-mobile">
|
|
||||||
<div class="control">
|
|
||||||
<input class="input has-text-weight-semibold" type="text"
|
|
||||||
placeholder="IMEI Here">
|
|
||||||
</div>
|
|
||||||
<div class="control">
|
|
||||||
<button class="button is-link">
|
|
||||||
Change
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<span class="is-block-mobile is-hidden">
|
|
||||||
123456789123
|
|
||||||
</span>
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>LAN GATEWAY</td>
|
|
||||||
<th>192.168.225.1</th>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>WWAN IPv4</td>
|
|
||||||
<th>38.0.101.76</th>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>WWAN IPv6</td>
|
|
||||||
<th style="word-break: break-all;">
|
|
||||||
5be8:dde9:7f0b:d5a7:bd01:b3be:9c69:573b
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-header">
|
|
||||||
<div class="card-header-title">
|
|
||||||
About Us
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-content">
|
|
||||||
<div class="content">
|
|
||||||
<p class="title">
|
|
||||||
QuecManager
|
|
||||||
</p>
|
|
||||||
<p class="subtitle mt-2">
|
|
||||||
Simple Admin began as part of the RGMII toolkit, offering users a basic GUI.
|
|
||||||
However, with our fork and continued development, it has evolved to include more
|
|
||||||
advanced features, making "simple" no longer an ideal name for the dashboard.
|
|
||||||
Despite this shift, we remain committed to providing advanced functionality while
|
|
||||||
maintaining an intuitive and user-friendly GUI.
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p class="subtitle mt-6 has-text-weight-bold">
|
|
||||||
Thanks to
|
|
||||||
</p>
|
|
||||||
<ul class="has-text-weight-semibold">
|
|
||||||
<li>
|
|
||||||
RGMII Toolkit and Documentation
|
|
||||||
<a href="https://github.com/iamromulan" target="_blank">iamromulan</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
Simple Admin 2.0 and QuecManager
|
|
||||||
<a href="https://github.com/dr-dolomite" target="_blank">dr-dolomite</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
SMS Feature
|
|
||||||
<a href="https://github.com/snjzb" target="_blank">snjzb</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
Original Simple Admin
|
|
||||||
<a href="https://github.com/aesthernr" target="_blank">aesthernr</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
Original Socat Bridge
|
|
||||||
<a href="https://github.com/natecarlson" target="_blank">natecarlson</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
Initial Original Simple Admin Fixes
|
|
||||||
<a href="https://github.com/rbflurry/" target="_blank">rbflurry</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer class="footer">
|
<footer class="footer">
|
||||||
<div class="content has-text-centered">
|
<div class="content has-text-centered">
|
||||||
<p>
|
<p>
|
||||||
<strong> <a href="https://github.com/iamromulan/quectel-rgmii-toolkit.git">QuecManager</a></strong>
|
<strong>
|
||||||
version 1.0. All rights reserved.
|
<a href="https://github.com/iamromulan/quectel-rgmii-toolkit.git"
|
||||||
</p>
|
>QuecManager</a
|
||||||
</div>
|
></strong
|
||||||
|
>
|
||||||
|
version 1.0. All rights reserved.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
</body>
|
<div id="reboot-modal" class="modal">
|
||||||
|
<div class="modal-background"></div>
|
||||||
</html>
|
<div class="modal-card">
|
||||||
|
<section class="modal-card-body rounded-edge">
|
||||||
|
<p class="subtitle" id="modal-message">
|
||||||
|
Do you want to reboot the device?
|
||||||
|
</p>
|
||||||
|
<div id="loading-content" style="display: none">
|
||||||
|
<div class="custom-loader"></div>
|
||||||
|
<div class="countdown-text">
|
||||||
|
Rebooting... <span id="countdown">40</span>s
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="buttons" id="modal-buttons">
|
||||||
|
<button class="button is-warning" id="rebootModem">Reboot</button>
|
||||||
|
<button class="button cancel" aria-label="close">Cancel</button>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@@ -19,10 +19,12 @@
|
|||||||
crossorigin="anonymous"
|
crossorigin="anonymous"
|
||||||
></script>
|
></script>
|
||||||
|
|
||||||
<script src="js/styles/nav-burger.js"></script>
|
|
||||||
<script src="js/styles/toggle-theme.js"></script>
|
<script src="js/styles/toggle-theme.js"></script>
|
||||||
|
<script src="/js/styles/nav-burger.js"></script>
|
||||||
|
<script src="/js/styles/modal-trigger.js"></script>
|
||||||
|
<script src="/js/utils/reboot.js"></script>
|
||||||
<script defer src="/js/auth/auth.js"></script>
|
<script defer src="/js/auth/auth.js"></script>
|
||||||
<script src="/js/handle-at-input.js"></script>
|
<script src="/js/advance/at-terminal.js"></script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
(function () {
|
(function () {
|
||||||
@@ -57,7 +59,7 @@
|
|||||||
|
|
||||||
<div id="navMenu" class="navbar-menu">
|
<div id="navMenu" class="navbar-menu">
|
||||||
<div class="navbar-start ml-6">
|
<div class="navbar-start ml-6">
|
||||||
<a class="navbar-item" href="/"> Home </a>
|
<a class="navbar-item has-text-weight-bold" href="/"> Home </a>
|
||||||
<div class="navbar-item has-dropdown is-hoverable">
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
<a class="navbar-link"> Cellular </a>
|
<a class="navbar-link"> Cellular </a>
|
||||||
<div class="navbar-dropdown is-boxed">
|
<div class="navbar-dropdown is-boxed">
|
||||||
@@ -70,7 +72,14 @@
|
|||||||
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<a class="navbar-item has-text-weight-bold" href="/advance-settings.html"> Advance </a>
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
|
<a class="navbar-link"> Advance </a>
|
||||||
|
<div class="navbar-dropdown is-boxed">
|
||||||
|
<a class="navbar-item" href="/advance-settings.html"> Advance Settings </a>
|
||||||
|
<a class="navbar-item" href="#">Experimental Features</a>
|
||||||
|
<a class="navbar-item" href="/cgi-bin/luci">OpenWRT Luci</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<a class="navbar-item" href="/about.html"> About </a>
|
<a class="navbar-item" href="/about.html"> About </a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -90,11 +99,11 @@
|
|||||||
</p>
|
</p>
|
||||||
<div class="is-flex is-mobile is-align-items-center">
|
<div class="is-flex is-mobile is-align-items-center">
|
||||||
<p class="control">
|
<p class="control">
|
||||||
<a href="#" class="button is-warning is-outlined">
|
<div href="#" class="button is-warning is-outlined reboot-modal" data-target="reboot-modal" >
|
||||||
<span class="icon">
|
<span class="icon">
|
||||||
<i class="fas fa-power-off"></i>
|
<i class="fas fa-power-off"></i>
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</div>
|
||||||
</p>
|
</p>
|
||||||
<p class="control ml-2 is-mobile">
|
<p class="control ml-2 is-mobile">
|
||||||
<a
|
<a
|
||||||
@@ -125,216 +134,218 @@
|
|||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<div class="column-margin">
|
<div class="column-margin">
|
||||||
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
<div class="columns">
|
||||||
<div class="grid">
|
<div class="column">
|
||||||
<div class="cell">
|
<div class="card">
|
||||||
<div class="card">
|
<div class="card-header">
|
||||||
|
<p class="card-header-title">AT Command Terminal</p>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
<form id="commandForm">
|
<form id="commandForm">
|
||||||
<div class="card-header">
|
<div class="field">
|
||||||
<div class="card-header-title">AT command Terminal</div>
|
<label class="label">Output</label>
|
||||||
|
<div class="control">
|
||||||
|
<textarea
|
||||||
|
class="textarea"
|
||||||
|
id="output"
|
||||||
|
rows="10"
|
||||||
|
readonly
|
||||||
|
placeholder="AT command responses will appear here..."
|
||||||
|
></textarea>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-content">
|
|
||||||
<div class="fixed-grid has-1-cols">
|
|
||||||
<div class="grid is-gap-5">
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">AT Command</label>
|
|
||||||
<div class="control">
|
|
||||||
<textarea
|
|
||||||
class="textarea"
|
|
||||||
id="output"
|
|
||||||
placeholder="AT Response"
|
|
||||||
rows="10"
|
|
||||||
disabled
|
|
||||||
></textarea>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
<div class="field is-hidden-touch">
|
||||||
<div class="field">
|
<div class="level">
|
||||||
<label class="label">Input AT Command</label>
|
<div class="level-left">
|
||||||
<div class="control">
|
<div class="level-item">
|
||||||
<input
|
<label class="label">Command History</label>
|
||||||
class="input"
|
</div>
|
||||||
type="text"
|
</div>
|
||||||
placeholder="ATI"
|
<div class="level-right">
|
||||||
id="command"
|
<div class="level-item">
|
||||||
name="command"
|
<button
|
||||||
/>
|
type="button"
|
||||||
</div>
|
id="clearHistory"
|
||||||
<p class="help">
|
class="button is-small is-link has-text-white"
|
||||||
Some commands may take time to execute so wait
|
>
|
||||||
patiently.
|
Clear All
|
||||||
</p>
|
</button>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="command-history" id="commandHistory">
|
||||||
|
<div class="no-history" id="noHistory">No commands yet</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-footer">
|
|
||||||
<a
|
<div class="field has-addons">
|
||||||
href="#"
|
<div class="control is-expanded">
|
||||||
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
<input
|
||||||
id="sendCommand"
|
class="input"
|
||||||
>
|
type="text"
|
||||||
Send AT Command
|
id="command"
|
||||||
</a>
|
placeholder="Enter AT command (e.g., ATI)"
|
||||||
<a
|
autocomplete="off"
|
||||||
href="#"
|
/>
|
||||||
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
</div>
|
||||||
id="resetForm"
|
<div class="control" style="position: relative">
|
||||||
>
|
<button
|
||||||
Reset
|
type="submit"
|
||||||
</a>
|
class="button is-link"
|
||||||
|
id="sendButton"
|
||||||
|
>
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-paper-plane"></i>
|
||||||
|
</span>
|
||||||
|
<span>Send</span>
|
||||||
|
</button>
|
||||||
|
<span id="cooldownTimer"></span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="cell">
|
<div class="column">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-header">
|
<div class="card-header">
|
||||||
<div class="card-header-title">Advance Settings</div>
|
<div class="card-header-title">Advance Settings</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-content">
|
<div class="card-content">
|
||||||
<div class="fixed-grid has-1-cols">
|
<div class="fixed-grid has-1-cols">
|
||||||
<div class="grid is-gap-5">
|
<div class="grid is-gap-5">
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
||||||
<div class="grid">
|
<div class="grid">
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<label class="label">IP Passthrough Mode</label>
|
<label class="label">IP Passthrough Mode</label>
|
||||||
<p class="control has-icons-left">
|
<p class="control has-icons-left">
|
||||||
<span class="select">
|
<span class="select">
|
||||||
<select>
|
<select>
|
||||||
<option selected>
|
<option selected>
|
||||||
Select IP Passthrough Mode
|
Select IP Passthrough Mode
|
||||||
</option>
|
</option>
|
||||||
<option>Disable</option>
|
<option>Disable</option>
|
||||||
<option>ETH Only</option>
|
<option>ETH Only</option>
|
||||||
<option>USB Only</option>
|
<option>USB Only</option>
|
||||||
</select>
|
</select>
|
||||||
</span>
|
</span>
|
||||||
<span class="icon is-small is-left">
|
<span class="icon is-small is-left">
|
||||||
<i class="fas fa-ethernet"></i>
|
<i class="fas fa-ethernet"></i>
|
||||||
</span>
|
</span>
|
||||||
</p>
|
</p>
|
||||||
<p class="help">
|
<p class="help">
|
||||||
Selecting a mode will apply immediately.
|
Selecting a mode will apply immediately.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<label class="label">USB Modem Protocol</label>
|
<label class="label">USB Modem Protocol</label>
|
||||||
<p class="control has-icons-left">
|
<p class="control has-icons-left">
|
||||||
<span class="select">
|
<span class="select">
|
||||||
<select>
|
<select>
|
||||||
<option selected>
|
<option selected>
|
||||||
Select USB Modem Protocol
|
Select USB Modem Protocol
|
||||||
</option>
|
</option>
|
||||||
<option>RMNET</option>
|
<option>RMNET</option>
|
||||||
<option>ECM (Recommended)</option>
|
<option>ECM (Recommended)</option>
|
||||||
<option>MBIM</option>
|
<option>MBIM</option>
|
||||||
<option>RNDIS</option>
|
<option>RNDIS</option>
|
||||||
</select>
|
</select>
|
||||||
</span>
|
</span>
|
||||||
<span class="icon is-small is-left">
|
<span class="icon is-small is-left">
|
||||||
<i class="fas fa-network-wired"></i>
|
<i class="fas fa-network-wired"></i>
|
||||||
</span>
|
</span>
|
||||||
</p>
|
</p>
|
||||||
<p class="help">
|
<p class="help">
|
||||||
Selecting a mode will apply immediately.
|
Selecting a mode will apply immediately.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<label class="label"
|
<label class="label">Onboard DNS Proxy Mode</label>
|
||||||
>Onboard DNS Proxy Mode</label
|
<p class="control has-icons-left">
|
||||||
>
|
<span class="select">
|
||||||
<p class="control has-icons-left">
|
<select>
|
||||||
<span class="select">
|
<option selected>
|
||||||
<select>
|
Select Onboard DNS Proxy
|
||||||
<option selected>
|
</option>
|
||||||
Select Onboard DNS Proxy
|
<option>Enable</option>
|
||||||
</option>
|
<option>Disable</option>
|
||||||
<option>Enable</option>
|
</select>
|
||||||
<option>Disable</option>
|
</span>
|
||||||
</select>
|
<span class="icon is-small is-left">
|
||||||
</span>
|
<i class="fas fa-server"></i>
|
||||||
<span class="icon is-small is-left">
|
</span>
|
||||||
<i class="fas fa-server"></i>
|
</p>
|
||||||
</span>
|
<p class="help">
|
||||||
</p>
|
Selecting a mode will apply immediately.
|
||||||
<p class="help">
|
</p>
|
||||||
Selecting a mode will apply immediately.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="fixed-grid has-2-cols">
|
<div class="fixed-grid has-2-cols">
|
||||||
<div class="grid is-gap-3">
|
<div class="grid is-gap-3">
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<label class="label">TTL State</label>
|
<label class="label">TTL State</label>
|
||||||
<div class="control has-icons-right">
|
<div class="control has-icons-right">
|
||||||
<input
|
<input
|
||||||
class="input is-danger"
|
class="input is-danger"
|
||||||
placeholder="Disabled"
|
placeholder="Disabled"
|
||||||
disabled
|
disabled
|
||||||
/>
|
/>
|
||||||
<span class="icon is-small is-right">
|
<span class="icon is-small is-right">
|
||||||
<i class="fas fa-exclamation-triangle"></i>
|
<i class="fas fa-exclamation-triangle"></i>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<label class="label">TTL Value</label>
|
<label class="label">TTL Value</label>
|
||||||
<div class="control has-icons-right">
|
<div class="control has-icons-right">
|
||||||
<input
|
<input
|
||||||
class="input is-danger"
|
class="input is-danger"
|
||||||
placeholder="0"
|
placeholder="0"
|
||||||
disabled
|
disabled
|
||||||
/>
|
/>
|
||||||
<span class="icon is-small is-right">
|
<span class="icon is-small is-right">
|
||||||
<i class="fas fa-exclamation-triangle"></i>
|
<i class="fas fa-exclamation-triangle"></i>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="cell is-col-span-2">
|
<div class="cell is-col-span-2">
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<label class="label">TTL Value to Set</label>
|
<label class="label">TTL Value to Set</label>
|
||||||
<div class="control has-icons-left">
|
<div class="control has-icons-left">
|
||||||
<input
|
<input
|
||||||
class="input"
|
class="input"
|
||||||
type="number"
|
type="number"
|
||||||
placeholder="Custom TTL Value"
|
placeholder="Custom TTL Value"
|
||||||
value="bulma"
|
value="bulma"
|
||||||
/>
|
/>
|
||||||
<span class="icon is-small is-left">
|
<span class="icon is-small is-left">
|
||||||
<i class="fas fa-wifi"></i>
|
<i class="fas fa-wifi"></i>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
|
||||||
<p
|
|
||||||
class="help is-success has-text-weight-semibold"
|
|
||||||
>
|
|
||||||
Set the TTL Value to 0 to disable.
|
|
||||||
</p>
|
|
||||||
</div>
|
</div>
|
||||||
|
<p class="help is-success has-text-weight-semibold">
|
||||||
|
Set the TTL Value to 0 to disable.
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -342,20 +353,20 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-footer">
|
</div>
|
||||||
<a
|
<div class="card-footer">
|
||||||
href="#"
|
<a
|
||||||
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
href="#"
|
||||||
>
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
Save
|
>
|
||||||
</a>
|
Save
|
||||||
<a
|
</a>
|
||||||
href="#"
|
<a
|
||||||
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
href="#"
|
||||||
>
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
Reset
|
>
|
||||||
</a>
|
Reset
|
||||||
</div>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -396,52 +407,25 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
<script>
|
<div id="reboot-modal" class="modal">
|
||||||
// Handle form submission via JavaScript
|
<div class="modal-background"></div>
|
||||||
document
|
<div class="modal-card">
|
||||||
.getElementById("sendCommand")
|
<section class="modal-card-body rounded-edge">
|
||||||
.addEventListener("click", function (e) {
|
<p class="subtitle" id="modal-message">
|
||||||
e.preventDefault(); // Prevent default link behavior
|
Do you want to reboot the device?
|
||||||
|
</p>
|
||||||
const commandInput = document.getElementById("command").value;
|
<div id="loading-content" style="display: none">
|
||||||
const outputTextarea = document.getElementById("output");
|
<div class="custom-loader"></div>
|
||||||
|
<div class="countdown-text">
|
||||||
// Make sure input is not empty
|
Rebooting... <span id="countdown">80</span>s
|
||||||
if (commandInput.trim() === "") {
|
</div>
|
||||||
outputTextarea.value = "Please enter a valid AT command.";
|
</div>
|
||||||
return;
|
<div class="buttons" id="modal-buttons">
|
||||||
}
|
<button class="button is-warning" id="rebootModem">Reboot</button>
|
||||||
|
<button class="button cancel" aria-label="close">Cancel</button>
|
||||||
// Send the AT command to the CGI script via fetch
|
</div>
|
||||||
fetch("/cgi-bin/atinout_handler.sh", {
|
</section>
|
||||||
method: "POST",
|
</div>
|
||||||
headers: {
|
</div>
|
||||||
"Content-Type": "application/x-www-form-urlencoded",
|
|
||||||
},
|
|
||||||
body: `command=${encodeURIComponent(commandInput)}`,
|
|
||||||
})
|
|
||||||
.then((response) => response.json())
|
|
||||||
.then((data) => {
|
|
||||||
// Display the response in the textarea
|
|
||||||
if (data.output) {
|
|
||||||
outputTextarea.value = data.output;
|
|
||||||
} else {
|
|
||||||
outputTextarea.value = "Error: No output received.";
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch((error) => {
|
|
||||||
outputTextarea.value = `Error fetching data: ${error.message}`;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// Reset form functionality
|
|
||||||
document
|
|
||||||
.getElementById("resetForm")
|
|
||||||
.addEventListener("click", function (e) {
|
|
||||||
e.preventDefault();
|
|
||||||
document.getElementById("commandForm").reset();
|
|
||||||
document.getElementById("output").value = "";
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@@ -1,278 +1,333 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
<head>
|
||||||
<head>
|
<meta charset="UTF-8" />
|
||||||
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
||||||
|
|
||||||
<!-- Logo -->
|
<!-- Logo -->
|
||||||
<link rel="simpleadmin-logo" href="favicon.ico" />
|
<link rel="simpleadmin-logo" href="favicon.ico" />
|
||||||
|
|
||||||
<link rel="stylesheet" href="css/bulma/bulma.scss">
|
<link rel="stylesheet" href="css/bulma/bulma.scss" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.min.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.min.css" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.css" />
|
||||||
<link rel="stylesheet" href="css/custom.css">
|
<link rel="stylesheet" href="css/custom.css" />
|
||||||
|
|
||||||
<!-- Font awesome icons -->
|
<!-- Font awesome icons -->
|
||||||
<script src="https://kit.fontawesome.com/b0caedfab3.js" crossorigin="anonymous"></script>
|
<script
|
||||||
|
src="https://kit.fontawesome.com/b0caedfab3.js"
|
||||||
|
crossorigin="anonymous"
|
||||||
|
></script>
|
||||||
|
|
||||||
<script src="js/styles/nav-burger.js"></script>
|
|
||||||
<script src="js/styles/toggle-theme.js"></script>
|
<script src="js/styles/toggle-theme.js"></script>
|
||||||
|
<script src="/js/styles/nav-burger.js"></script>
|
||||||
|
<script src="/js/styles/modal-trigger.js"></script>
|
||||||
|
<script src="/js/utils/reboot.js"></script>
|
||||||
<script defer src="/js/auth/auth.js"></script>
|
<script defer src="/js/auth/auth.js"></script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
(function () {
|
(function () {
|
||||||
const savedTheme = localStorage.getItem('theme') || 'theme-dark';
|
const savedTheme = localStorage.getItem("theme") || "theme-dark";
|
||||||
document.documentElement.classList.add(savedTheme);
|
document.documentElement.classList.add(savedTheme);
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
<title>QuecManager</title>
|
<title>QuecManager</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="body-margin">
|
<body class="body-margin">
|
||||||
<nav class="navbar is-transparent">
|
<nav class="navbar is-transparent">
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
<a class="navbar-item" href="/">
|
<a class="navbar-item" href="/">
|
||||||
<img src="/assets/logo.png" alt="Logo" />
|
<img src="/assets/logo.png" alt="Logo" />
|
||||||
<span class="title">QuecManager</span>
|
<span class="title">QuecManager</span>
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
role="button"
|
role="button"
|
||||||
class="navbar-burger"
|
class="navbar-burger"
|
||||||
aria-label="menu"
|
aria-label="menu"
|
||||||
aria-expanded="false"
|
aria-expanded="false"
|
||||||
data-target="navMenu"
|
data-target="navMenu"
|
||||||
>
|
>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="navMenu" class="navbar-menu">
|
<div id="navMenu" class="navbar-menu">
|
||||||
<div class="navbar-start ml-6">
|
<div class="navbar-start ml-6">
|
||||||
<a class="navbar-item" href="/"> Home </a>
|
<a class="navbar-item has-text-weight-bold" href="/"> Home </a>
|
||||||
<div class="navbar-item has-dropdown is-hoverable">
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
<a class="navbar-link"> Cellular </a>
|
<a class="navbar-link"> Cellular </a>
|
||||||
<div class="navbar-dropdown is-boxed">
|
<div class="navbar-dropdown is-boxed">
|
||||||
<a class="navbar-item" href="/bandlock.html"> Band Locking </a>
|
<a class="navbar-item" href="/bandlock.html"> Band Locking </a>
|
||||||
<a class="navbar-item" href="/cell-locking.html">Cell Locking</a>
|
<a class="navbar-item" href="/cell-locking.html">Cell Locking</a>
|
||||||
<a class="navbar-item" href="/cell-scanner.html">Cell Scanner</a>
|
<a class="navbar-item" href="/cell-scanner.html">Cell Scanner</a>
|
||||||
<a class="navbar-item" href="/cell-settings.html"
|
<a class="navbar-item" href="/cell-settings.html"
|
||||||
>Cell Settings</a
|
>Cell Settings</a
|
||||||
>
|
>
|
||||||
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<a class="navbar-item" href="/advance-settings.html"> Advance </a>
|
|
||||||
<a class="navbar-item" href="/about.html"> About </a>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
<div class="navbar-end">
|
<a class="navbar-link"> Advance </a>
|
||||||
<div class="navbar-item">
|
<div class="navbar-dropdown is-boxed">
|
||||||
<div class="buttons is-flex-direction-column-mobile">
|
<a class="navbar-item" href="/advance-settings.html"> Advance Settings </a>
|
||||||
<p class="control is-expanded-mobile">
|
<a class="navbar-item" href="#">Experimental Features</a>
|
||||||
|
<a class="navbar-item" href="/cgi-bin/luci">OpenWRT Luci</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a class="navbar-item" href="/about.html"> About </a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="navbar-end">
|
||||||
|
<div class="navbar-item">
|
||||||
|
<div class="buttons is-flex-direction-column-mobile">
|
||||||
|
<p class="control is-expanded-mobile">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="button is-link is-outlined is-fullwidth-mobile"
|
||||||
|
>
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-arrows-rotate"></i>
|
||||||
|
</span>
|
||||||
|
<span>Restart Connection</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<div class="is-flex is-mobile is-align-items-center">
|
||||||
|
<p class="control">
|
||||||
|
<div href="#" class="button is-warning is-outlined reboot-modal" data-target="reboot-modal" >
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-power-off"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</p>
|
||||||
|
<p class="control ml-2 is-mobile">
|
||||||
<a
|
<a
|
||||||
href="#"
|
href="#"
|
||||||
class="button is-link is-outlined is-fullwidth-mobile"
|
class="button is-warning is-outlined js-theme-toggle"
|
||||||
>
|
>
|
||||||
<span class="icon">
|
<span class="icon">
|
||||||
<i class="fas fa-arrows-rotate"></i>
|
<i class="fas fa-sun"></i>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<p class="control ml-2 is-mobile">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="button is-warning is-outlined js-theme-toggle"
|
||||||
|
id="logoutButton"
|
||||||
|
>
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-right-from-bracket"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>Restart Connection</span>
|
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
<div class="is-flex is-mobile is-align-items-center">
|
|
||||||
<p class="control">
|
|
||||||
<a href="#" class="button is-warning is-outlined">
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-power-off"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
<p class="control ml-2 is-mobile">
|
|
||||||
<a
|
|
||||||
href="#"
|
|
||||||
class="button is-warning is-outlined js-theme-toggle"
|
|
||||||
>
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-sun"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
<p class="control ml-2 is-mobile">
|
|
||||||
<a
|
|
||||||
href="#"
|
|
||||||
class="button is-warning is-outlined js-theme-toggle"
|
|
||||||
id="logoutButton"
|
|
||||||
>
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-right-from-bracket"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
<div class="column-margin">
|
<div class="column-margin">
|
||||||
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
||||||
<div class="grid is-gap-5">
|
<div class="grid is-gap-5">
|
||||||
<div class="cell is-col-span-2 is-col-span-1-mobile">
|
<div class="cell is-col-span-2 is-col-span-1-mobile">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-header">
|
<div class="card-header">
|
||||||
<div class="card-header-title">
|
<div class="card-header-title">4G LTE Band Locking</div>
|
||||||
4G LTE Band Locking
|
</div>
|
||||||
</div>
|
<div class="card-content">
|
||||||
</div>
|
<div class="fixed-grid has-5-cols has-3-cols-mobile">
|
||||||
<div class="card-content">
|
<div class="grid" id="lte_bands">
|
||||||
<div class="fixed-grid has-5-cols has-3-cols-mobile">
|
<!-- write each lte band cell here -->
|
||||||
<div class="grid" id="lte_bands">
|
</div>
|
||||||
<!-- write each lte band cell here -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-footer">
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Lock LTE Bands
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Uncheck All
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Reset
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Lock LTE Bands
|
||||||
|
</a>
|
||||||
|
|
||||||
<div class="cell">
|
<a
|
||||||
<div class="card">
|
href="#"
|
||||||
<div class="card-header">
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
<div class="card-header-title">
|
>
|
||||||
5G-NR NSA Band Locking
|
Uncheck All
|
||||||
</div>
|
</a>
|
||||||
</div>
|
|
||||||
<div class="card-content">
|
|
||||||
<div class="fixed-grid has-5-cols has-3-cols-mobile">
|
|
||||||
<div class="grid" id="nsa_bands">
|
|
||||||
<!-- write each nsa band cell here -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-footer">
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Lock NSA Bands
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
<a
|
||||||
Uncheck All
|
href="#"
|
||||||
</a>
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
Reset
|
||||||
Reset
|
</a>
|
||||||
</a>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-header">
|
|
||||||
<div class="card-header-title">
|
|
||||||
5G-NR SA Band Locking
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-content">
|
|
||||||
<div class="fixed-grid has-5-cols has-3-cols-mobile">
|
|
||||||
<div class="grid" id="sa_bands">
|
|
||||||
<!-- write each SA band cell here -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-footer">
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Lock SA Bands
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Uncheck All
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Reset
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<div class="card-header-title">5G-NR NSA Band Locking</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="fixed-grid has-5-cols has-3-cols-mobile">
|
||||||
|
<div class="grid" id="nsa_bands">
|
||||||
|
<!-- write each nsa band cell here -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Lock NSA Bands
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Uncheck All
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Reset
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<div class="card-header-title">5G-NR SA Band Locking</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="fixed-grid has-5-cols has-3-cols-mobile">
|
||||||
|
<div class="grid" id="sa_bands">
|
||||||
|
<!-- write each SA band cell here -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Lock SA Bands
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Uncheck All
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Reset
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer class="footer">
|
<footer class="footer">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
||||||
<div class="grid">
|
<div class="grid">
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="icon-text">
|
<div class="icon-text">
|
||||||
<span class="icon has-text-info">
|
<span class="icon has-text-info">
|
||||||
<i class="fas fa-info-circle"></i>
|
<i class="fas fa-info-circle"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>Information</span>
|
<span>Information</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p class="block has-text-weight-semibold">
|
<p class="block has-text-weight-semibold">
|
||||||
If problem persists after locking bands, please reboot the modem.
|
If problem persists after locking bands, please reboot the
|
||||||
</p>
|
modem.
|
||||||
</div>
|
</p>
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="icon-text">
|
|
||||||
<span class="icon has-text-info">
|
|
||||||
<i class="fas fa-info-circle"></i>
|
|
||||||
</span>
|
|
||||||
<span>Current Active Bands</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="block has-text-weight-semibold">
|
|
||||||
Band 1 / Band 3 / NR Band 41
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
</body>
|
|
||||||
|
|
||||||
<script>
|
<div class="cell">
|
||||||
var lte_bands = "1:2:3:4:5:7:8:12:13:14:18:19:20:25:26:28:29:30:32:34:38:39:40:41:42:43:46:48:66:71";
|
<div class="icon-text">
|
||||||
|
<span class="icon has-text-info">
|
||||||
|
<i class="fas fa-info-circle"></i>
|
||||||
|
</span>
|
||||||
|
<span>Current Active Bands</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="block has-text-weight-semibold">
|
||||||
|
Band 1 / Band 3 / NR Band 41
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<div id="reboot-modal" class="modal">
|
||||||
|
<div class="modal-background"></div>
|
||||||
|
<div class="modal-card">
|
||||||
|
<section class="modal-card-body rounded-edge">
|
||||||
|
<p class="subtitle" id="modal-message">
|
||||||
|
Do you want to reboot the device?
|
||||||
|
</p>
|
||||||
|
<div id="loading-content" style="display: none">
|
||||||
|
<div class="custom-loader"></div>
|
||||||
|
<div class="countdown-text">
|
||||||
|
Rebooting... <span id="countdown">40</span>s
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="buttons" id="modal-buttons">
|
||||||
|
<button class="button is-warning" id="rebootModem">Reboot</button>
|
||||||
|
<button class="button cancel" aria-label="close">Cancel</button>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
var lte_bands =
|
||||||
|
"1:2:3:4:5:7:8:12:13:14:18:19:20:25:26:28:29:30:32:34:38:39:40:41:42:43:46:48:66:71";
|
||||||
var nsa_bands = "1:2:3:5:7:8:12:20:25:28:38:40:41:48:66:71:77:78:79";
|
var nsa_bands = "1:2:3:5:7:8:12:20:25:28:38:40:41:48:66:71:77:78:79";
|
||||||
var sa_bands = "1:2:3:5:7:8:12:20:25:28:38:40:41:48:66:71:77:78:79";
|
var sa_bands = "1:2:3:5:7:8:12:20:25:28:38:40:41:48:66:71:77:78:79";
|
||||||
|
|
||||||
function populateBands(bandsString, targetId) {
|
function populateBands(bandsString, targetId) {
|
||||||
var bandsArray = bandsString.split(":");
|
var bandsArray = bandsString.split(":");
|
||||||
var html = "";
|
var html = "";
|
||||||
|
|
||||||
for (var i = 0; i < bandsArray.length; i++) {
|
for (var i = 0; i < bandsArray.length; i++) {
|
||||||
html += '<div class="cell"><label class="checkbox"><input type="checkbox" /> B' + bandsArray[i] + '</label></div>';
|
html +=
|
||||||
}
|
'<div class="cell"><label class="checkbox"><input type="checkbox" /> B' +
|
||||||
|
bandsArray[i] +
|
||||||
|
"</label></div>";
|
||||||
|
}
|
||||||
|
|
||||||
// Inject the generated HTML into the target element
|
// Inject the generated HTML into the target element
|
||||||
document.querySelector(targetId).innerHTML = html;
|
document.querySelector(targetId).innerHTML = html;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Populate the bands in their respective grids
|
// Populate the bands in their respective grids
|
||||||
populateBands(lte_bands, '#lte_bands');
|
populateBands(lte_bands, "#lte_bands");
|
||||||
populateBands(nsa_bands, '#nsa_bands');
|
populateBands(nsa_bands, "#nsa_bands");
|
||||||
populateBands(sa_bands, '#sa_bands');
|
populateBands(sa_bands, "#sa_bands");
|
||||||
|
</script>
|
||||||
</script>
|
</html>
|
||||||
|
|
||||||
</html>
|
|
||||||
|
|||||||
@@ -1,356 +1,419 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
<head>
|
||||||
<head>
|
<meta charset="UTF-8" />
|
||||||
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
||||||
|
|
||||||
<!-- Logo -->
|
<!-- Logo -->
|
||||||
<link rel="simpleadmin-logo" href="favicon.ico" />
|
<link rel="simpleadmin-logo" href="favicon.ico" />
|
||||||
|
|
||||||
<link rel="stylesheet" href="css/bulma/bulma.scss">
|
<link rel="stylesheet" href="css/bulma/bulma.scss" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.min.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.min.css" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.css" />
|
||||||
<link rel="stylesheet" href="css/custom.css">
|
<link rel="stylesheet" href="css/custom.css" />
|
||||||
|
|
||||||
<!-- Font awesome icons -->
|
<!-- Font awesome icons -->
|
||||||
<script src="https://kit.fontawesome.com/b0caedfab3.js" crossorigin="anonymous"></script>
|
<script
|
||||||
|
src="https://kit.fontawesome.com/b0caedfab3.js"
|
||||||
|
crossorigin="anonymous"
|
||||||
|
></script>
|
||||||
|
|
||||||
<script src="js/styles/nav-burger.js"></script>
|
|
||||||
<script src="js/styles/toggle-theme.js"></script>
|
<script src="js/styles/toggle-theme.js"></script>
|
||||||
|
<script src="/js/styles/nav-burger.js"></script>
|
||||||
|
<script src="/js/styles/modal-trigger.js"></script>
|
||||||
|
<script src="/js/utils/reboot.js"></script>
|
||||||
<script defer src="/js/auth/auth.js"></script>
|
<script defer src="/js/auth/auth.js"></script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
(function () {
|
(function () {
|
||||||
const savedTheme = localStorage.getItem('theme') || 'theme-dark';
|
const savedTheme = localStorage.getItem("theme") || "theme-dark";
|
||||||
document.documentElement.classList.add(savedTheme);
|
document.documentElement.classList.add(savedTheme);
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<title>QuecManager</title>
|
<title>QuecManager</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="body-margin">
|
<body class="body-margin">
|
||||||
<nav class="navbar is-transparent">
|
<nav class="navbar is-transparent">
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
<a class="navbar-item" href="/">
|
<a class="navbar-item" href="/">
|
||||||
<img src="/assets/logo.png" alt="Logo" />
|
<img src="/assets/logo.png" alt="Logo" />
|
||||||
<span class="title">QuecManager</span>
|
<span class="title">QuecManager</span>
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
role="button"
|
role="button"
|
||||||
class="navbar-burger"
|
class="navbar-burger"
|
||||||
aria-label="menu"
|
aria-label="menu"
|
||||||
aria-expanded="false"
|
aria-expanded="false"
|
||||||
data-target="navMenu"
|
data-target="navMenu"
|
||||||
>
|
>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="navMenu" class="navbar-menu">
|
<div id="navMenu" class="navbar-menu">
|
||||||
<div class="navbar-start ml-6">
|
<div class="navbar-start ml-6">
|
||||||
<a class="navbar-item" href="/"> Home </a>
|
<a class="navbar-item has-text-weight-bold" href="/"> Home </a>
|
||||||
<div class="navbar-item has-dropdown is-hoverable">
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
<a class="navbar-link"> Cellular </a>
|
<a class="navbar-link"> Cellular </a>
|
||||||
<div class="navbar-dropdown is-boxed">
|
<div class="navbar-dropdown is-boxed">
|
||||||
<a class="navbar-item" href="/bandlock.html"> Band Locking </a>
|
<a class="navbar-item" href="/bandlock.html"> Band Locking </a>
|
||||||
<a class="navbar-item" href="/cell-locking.html">Cell Locking</a>
|
<a class="navbar-item" href="/cell-locking.html">Cell Locking</a>
|
||||||
<a class="navbar-item" href="/cell-scanner.html">Cell Scanner</a>
|
<a class="navbar-item" href="/cell-scanner.html">Cell Scanner</a>
|
||||||
<a class="navbar-item" href="/cell-settings.html"
|
<a class="navbar-item" href="/cell-settings.html"
|
||||||
>Cell Settings</a
|
>Cell Settings</a
|
||||||
>
|
>
|
||||||
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<a class="navbar-item" href="/advance-settings.html"> Advance </a>
|
|
||||||
<a class="navbar-item" href="/about.html"> About </a>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
<div class="navbar-end">
|
<a class="navbar-link"> Advance </a>
|
||||||
<div class="navbar-item">
|
<div class="navbar-dropdown is-boxed">
|
||||||
<div class="buttons is-flex-direction-column-mobile">
|
<a class="navbar-item" href="/advance-settings.html"> Advance Settings </a>
|
||||||
<p class="control is-expanded-mobile">
|
<a class="navbar-item" href="#">Experimental Features</a>
|
||||||
|
<a class="navbar-item" href="/cgi-bin/luci">OpenWRT Luci</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a class="navbar-item" href="/about.html"> About </a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="navbar-end">
|
||||||
|
<div class="navbar-item">
|
||||||
|
<div class="buttons is-flex-direction-column-mobile">
|
||||||
|
<p class="control is-expanded-mobile">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="button is-link is-outlined is-fullwidth-mobile"
|
||||||
|
>
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-arrows-rotate"></i>
|
||||||
|
</span>
|
||||||
|
<span>Restart Connection</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<div class="is-flex is-mobile is-align-items-center">
|
||||||
|
<p class="control">
|
||||||
|
<div href="#" class="button is-warning is-outlined reboot-modal" data-target="reboot-modal" >
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-power-off"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</p>
|
||||||
|
<p class="control ml-2 is-mobile">
|
||||||
<a
|
<a
|
||||||
href="#"
|
href="#"
|
||||||
class="button is-link is-outlined is-fullwidth-mobile"
|
class="button is-warning is-outlined js-theme-toggle"
|
||||||
>
|
>
|
||||||
<span class="icon">
|
<span class="icon">
|
||||||
<i class="fas fa-arrows-rotate"></i>
|
<i class="fas fa-sun"></i>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<p class="control ml-2 is-mobile">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="button is-warning is-outlined js-theme-toggle"
|
||||||
|
id="logoutButton"
|
||||||
|
>
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-right-from-bracket"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>Restart Connection</span>
|
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
<div class="is-flex is-mobile is-align-items-center">
|
|
||||||
<p class="control">
|
|
||||||
<a href="#" class="button is-warning is-outlined">
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-power-off"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
<p class="control ml-2 is-mobile">
|
|
||||||
<a
|
|
||||||
href="#"
|
|
||||||
class="button is-warning is-outlined js-theme-toggle"
|
|
||||||
>
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-sun"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
<p class="control ml-2 is-mobile">
|
|
||||||
<a
|
|
||||||
href="#"
|
|
||||||
class="button is-warning is-outlined js-theme-toggle"
|
|
||||||
id="logoutButton"
|
|
||||||
>
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-right-from-bracket"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
<div class="column-margin">
|
<div class="column-margin">
|
||||||
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
||||||
<div class="grid is-gap-5">
|
<div class="grid is-gap-5">
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-header">
|
<div class="card-header">
|
||||||
<div class="card-header-title">
|
<div class="card-header-title">4G LTE Cell Locking</div>
|
||||||
4G LTE Cell Locking
|
</div>
|
||||||
</div>
|
<div class="card-content">
|
||||||
</div>
|
<div class="fixed-grid has-2-cols">
|
||||||
<div class="card-content">
|
<div class="grid">
|
||||||
<div class="fixed-grid has-2-cols">
|
<!-- Entry 1 Start -->
|
||||||
<div class="grid">
|
<div class="cell">
|
||||||
<!-- Entry 1 Start -->
|
<div class="field">
|
||||||
<div class="cell">
|
<label class="label">EARFCN 1</label>
|
||||||
<div class="field">
|
<div class="control has-icons-left">
|
||||||
<label class="label">EARFCN 1</label>
|
<input
|
||||||
<div class="control has-icons-left">
|
class="input"
|
||||||
<input class="input" type="email" placeholder="EARFCN">
|
type="email"
|
||||||
<span class="icon is-left">
|
placeholder="EARFCN"
|
||||||
<i class="fas fa-bolt"></i>
|
/>
|
||||||
</span>
|
<span class="icon is-left">
|
||||||
</div>
|
<i class="fas fa-bolt"></i>
|
||||||
</div>
|
</span>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">PCI 1</label>
|
|
||||||
<div class="control has-icons-left">
|
|
||||||
<input class="input" type="email" placeholder="PCI">
|
|
||||||
<span class="icon is-left">
|
|
||||||
<i class="fa-solid fa-signal"></i>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Entry 1 End -->
|
|
||||||
|
|
||||||
<!-- Entry 2 Start -->
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">EARFCN 2</label>
|
|
||||||
<div class="control has-icons-left">
|
|
||||||
<input class="input" type="email" placeholder="EARFCN">
|
|
||||||
<span class="icon is-left">
|
|
||||||
<i class="fas fa-bolt"></i>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">PCI 2</label>
|
|
||||||
<div class="control has-icons-left">
|
|
||||||
<input class="input" type="email" placeholder="PCI">
|
|
||||||
<span class="icon is-left">
|
|
||||||
<i class="fa-solid fa-signal"></i>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Entry 2 End -->
|
|
||||||
|
|
||||||
<!-- Entry 3 Start -->
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">EARFCN 3</label>
|
|
||||||
<div class="control has-icons-left">
|
|
||||||
<input class="input" type="email" placeholder="EARFCN">
|
|
||||||
<span class="icon is-left">
|
|
||||||
<i class="fas fa-bolt"></i>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">PCI 3</label>
|
|
||||||
<div class="control has-icons-left">
|
|
||||||
<input class="input" type="email" placeholder="PCI">
|
|
||||||
<span class="icon is-left">
|
|
||||||
<i class="fa-solid fa-signal"></i>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Entry 3 End -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-footer">
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Lock LTE Cells
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Reset
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="card">
|
<div class="field">
|
||||||
<div class="card-header">
|
<label class="label">PCI 1</label>
|
||||||
<div class="card-header-title">
|
<div class="control has-icons-left">
|
||||||
5G-NR SA Cell Locking
|
<input class="input" type="email" placeholder="PCI" />
|
||||||
</div>
|
<span class="icon is-left">
|
||||||
</div>
|
<i class="fa-solid fa-signal"></i>
|
||||||
<div class="card-content">
|
</span>
|
||||||
<div class="fixed-grid has-2-cols">
|
|
||||||
<div class="grid">
|
|
||||||
<!-- Entry 1 Start -->
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">NR ARFCN</label>
|
|
||||||
<div class="control has-icons-left">
|
|
||||||
<input class="input" type="email" placeholder="NR-ARFCN">
|
|
||||||
<span class="icon is-left">
|
|
||||||
<i class="fas fa-bolt"></i>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">NR PCI</label>
|
|
||||||
<div class="control has-icons-left">
|
|
||||||
<input class="input" type="email" placeholder="NR PCI">
|
|
||||||
<span class="icon is-left">
|
|
||||||
<i class="fa-solid fa-signal"></i>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Entry 1 End -->
|
|
||||||
|
|
||||||
<!-- Entry 2 Start -->
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">SCS</label>
|
|
||||||
<div class="control has-icons-left">
|
|
||||||
<span class="select">
|
|
||||||
<select>
|
|
||||||
<option selected>Select SCS</option>
|
|
||||||
<option>15 kHz</option>
|
|
||||||
<option>30 kHz</option>
|
|
||||||
<option>60 kHz</option>
|
|
||||||
<option>120 kHz</option>
|
|
||||||
<option>240 kHz</option>
|
|
||||||
</select>
|
|
||||||
</span>
|
|
||||||
<span class="icon is-left">
|
|
||||||
<i class="fas fa-bolt"></i>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">NR Band</label>
|
|
||||||
<div class="control has-icons-left">
|
|
||||||
<input class="input" type="email" placeholder="NR Band">
|
|
||||||
<span class="icon is-left">
|
|
||||||
<i class="fa-solid fa-signal"></i>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Entry 2 End -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-footer">
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Lock SA Cells
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Reset
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- Entry 1 End -->
|
||||||
|
|
||||||
|
<!-- Entry 2 Start -->
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">EARFCN 2</label>
|
||||||
|
<div class="control has-icons-left">
|
||||||
|
<input
|
||||||
|
class="input"
|
||||||
|
type="email"
|
||||||
|
placeholder="EARFCN"
|
||||||
|
/>
|
||||||
|
<span class="icon is-left">
|
||||||
|
<i class="fas fa-bolt"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">PCI 2</label>
|
||||||
|
<div class="control has-icons-left">
|
||||||
|
<input class="input" type="email" placeholder="PCI" />
|
||||||
|
<span class="icon is-left">
|
||||||
|
<i class="fa-solid fa-signal"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- Entry 2 End -->
|
||||||
|
|
||||||
|
<!-- Entry 3 Start -->
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">EARFCN 3</label>
|
||||||
|
<div class="control has-icons-left">
|
||||||
|
<input
|
||||||
|
class="input"
|
||||||
|
type="email"
|
||||||
|
placeholder="EARFCN"
|
||||||
|
/>
|
||||||
|
<span class="icon is-left">
|
||||||
|
<i class="fas fa-bolt"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">PCI 3</label>
|
||||||
|
<div class="control has-icons-left">
|
||||||
|
<input class="input" type="email" placeholder="PCI" />
|
||||||
|
<span class="icon is-left">
|
||||||
|
<i class="fa-solid fa-signal"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- Entry 3 End -->
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Lock LTE Cells
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Reset
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<div class="card-header-title">5G-NR SA Cell Locking</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="fixed-grid has-2-cols">
|
||||||
|
<div class="grid">
|
||||||
|
<!-- Entry 1 Start -->
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">NR ARFCN</label>
|
||||||
|
<div class="control has-icons-left">
|
||||||
|
<input
|
||||||
|
class="input"
|
||||||
|
type="email"
|
||||||
|
placeholder="NR-ARFCN"
|
||||||
|
/>
|
||||||
|
<span class="icon is-left">
|
||||||
|
<i class="fas fa-bolt"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">NR PCI</label>
|
||||||
|
<div class="control has-icons-left">
|
||||||
|
<input
|
||||||
|
class="input"
|
||||||
|
type="email"
|
||||||
|
placeholder="NR PCI"
|
||||||
|
/>
|
||||||
|
<span class="icon is-left">
|
||||||
|
<i class="fa-solid fa-signal"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- Entry 1 End -->
|
||||||
|
|
||||||
|
<!-- Entry 2 Start -->
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">SCS</label>
|
||||||
|
<div class="control has-icons-left">
|
||||||
|
<span class="select">
|
||||||
|
<select>
|
||||||
|
<option selected>Select SCS</option>
|
||||||
|
<option>15 kHz</option>
|
||||||
|
<option>30 kHz</option>
|
||||||
|
<option>60 kHz</option>
|
||||||
|
<option>120 kHz</option>
|
||||||
|
<option>240 kHz</option>
|
||||||
|
</select>
|
||||||
|
</span>
|
||||||
|
<span class="icon is-left">
|
||||||
|
<i class="fas fa-bolt"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">NR Band</label>
|
||||||
|
<div class="control has-icons-left">
|
||||||
|
<input
|
||||||
|
class="input"
|
||||||
|
type="email"
|
||||||
|
placeholder="NR Band"
|
||||||
|
/>
|
||||||
|
<span class="icon is-left">
|
||||||
|
<i class="fa-solid fa-signal"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- Entry 2 End -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Lock SA Cells
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Reset
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer class="footer">
|
<footer class="footer">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
||||||
<div class="grid">
|
<div class="grid">
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="icon-text">
|
<div class="icon-text">
|
||||||
<span class="icon has-text-info">
|
<span class="icon has-text-info">
|
||||||
<i class="fas fa-info-circle"></i>
|
<i class="fas fa-info-circle"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>Information</span>
|
<span>Information</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p class="block has-text-weight-semibold">
|
<p class="block has-text-weight-semibold">
|
||||||
Cell locking is an advance feature and may cause network interruptions. <br />
|
Cell locking is an advance feature and may cause network
|
||||||
Cell locking will also only work with the main band (PCC) if you are using carrier
|
interruptions. <br />
|
||||||
aggregation.
|
Cell locking will also only work with the main band (PCC) if you
|
||||||
<br />
|
are using carrier aggregation.
|
||||||
Proceed with caution.
|
<br />
|
||||||
</p>
|
Proceed with caution.
|
||||||
</div>
|
</p>
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="icon-text">
|
|
||||||
<span class="icon has-text-info">
|
|
||||||
<i class="fas fa-info-circle"></i>
|
|
||||||
</span>
|
|
||||||
<span>Current Active Locked Cells</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="block has-text-weight-semibold">
|
|
||||||
150/69, 1350/70, 1350/71
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
</body>
|
|
||||||
|
|
||||||
</html>
|
<div class="cell">
|
||||||
|
<div class="icon-text">
|
||||||
|
<span class="icon has-text-info">
|
||||||
|
<i class="fas fa-info-circle"></i>
|
||||||
|
</span>
|
||||||
|
<span>Current Active Locked Cells</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="block has-text-weight-semibold">
|
||||||
|
150/69, 1350/70, 1350/71
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<div id="reboot-modal" class="modal">
|
||||||
|
<div class="modal-background"></div>
|
||||||
|
<div class="modal-card">
|
||||||
|
<section class="modal-card-body rounded-edge">
|
||||||
|
<p class="subtitle" id="modal-message">
|
||||||
|
Do you want to reboot the device?
|
||||||
|
</p>
|
||||||
|
<div id="loading-content" style="display: none">
|
||||||
|
<div class="custom-loader"></div>
|
||||||
|
<div class="countdown-text">
|
||||||
|
Rebooting... <span id="countdown">40</span>s
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="buttons" id="modal-buttons">
|
||||||
|
<button class="button is-warning" id="rebootModem">Reboot</button>
|
||||||
|
<button class="button cancel" aria-label="close">Cancel</button>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@@ -1,486 +1,479 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
<head>
|
||||||
<head>
|
<meta charset="UTF-8" />
|
||||||
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
||||||
|
|
||||||
<!-- Logo -->
|
<!-- Logo -->
|
||||||
<link rel="simpleadmin-logo" href="favicon.ico" />
|
<link rel="simpleadmin-logo" href="favicon.ico" />
|
||||||
|
|
||||||
<link rel="stylesheet" href="css/bulma/bulma.scss">
|
<link rel="stylesheet" href="css/bulma/bulma.scss" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.min.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.min.css" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.css" />
|
||||||
<link rel="stylesheet" href="css/custom.css">
|
<link rel="stylesheet" href="css/custom.css" />
|
||||||
|
|
||||||
<!-- Font awesome icons -->
|
<!-- Font awesome icons -->
|
||||||
<script src="https://kit.fontawesome.com/b0caedfab3.js" crossorigin="anonymous"></script>
|
<script
|
||||||
|
src="https://kit.fontawesome.com/b0caedfab3.js"
|
||||||
|
crossorigin="anonymous"
|
||||||
|
></script>
|
||||||
|
|
||||||
<script src="js/styles/nav-burger.js"></script>
|
|
||||||
<script src="js/styles/toggle-theme.js"></script>
|
<script src="js/styles/toggle-theme.js"></script>
|
||||||
|
<script src="/js/styles/nav-burger.js"></script>
|
||||||
|
<script src="/js/styles/modal-trigger.js"></script>
|
||||||
|
<script src="/js/utils/reboot.js"></script>
|
||||||
<script defer src="/js/auth/auth.js"></script>
|
<script defer src="/js/auth/auth.js"></script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
(function () {
|
(function () {
|
||||||
const savedTheme = localStorage.getItem('theme') || 'theme-dark';
|
const savedTheme = localStorage.getItem("theme") || "theme-dark";
|
||||||
document.documentElement.classList.add(savedTheme);
|
document.documentElement.classList.add(savedTheme);
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<title>QuecManager</title>
|
<title>QuecManager</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="body-margin">
|
<body class="body-margin">
|
||||||
<nav class="navbar is-transparent">
|
<nav class="navbar is-transparent">
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
<a class="navbar-item" href="/">
|
<a class="navbar-item" href="/">
|
||||||
<img src="/assets/logo.png" alt="Logo" />
|
<img src="/assets/logo.png" alt="Logo" />
|
||||||
<span class="title">QuecManager</span>
|
<span class="title">QuecManager</span>
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
role="button"
|
role="button"
|
||||||
class="navbar-burger"
|
class="navbar-burger"
|
||||||
aria-label="menu"
|
aria-label="menu"
|
||||||
aria-expanded="false"
|
aria-expanded="false"
|
||||||
data-target="navMenu"
|
data-target="navMenu"
|
||||||
>
|
>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="navMenu" class="navbar-menu">
|
<div id="navMenu" class="navbar-menu">
|
||||||
<div class="navbar-start ml-6">
|
<div class="navbar-start ml-6">
|
||||||
<a class="navbar-item" href="/"> Home </a>
|
<a class="navbar-item has-text-weight-bold" href="/"> Home </a>
|
||||||
<div class="navbar-item has-dropdown is-hoverable">
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
<a class="navbar-link"> Cellular </a>
|
<a class="navbar-link"> Cellular </a>
|
||||||
<div class="navbar-dropdown is-boxed">
|
<div class="navbar-dropdown is-boxed">
|
||||||
<a class="navbar-item" href="/bandlock.html"> Band Locking </a>
|
<a class="navbar-item" href="/bandlock.html"> Band Locking </a>
|
||||||
<a class="navbar-item" href="/cell-locking.html">Cell Locking</a>
|
<a class="navbar-item" href="/cell-locking.html">Cell Locking</a>
|
||||||
<a class="navbar-item" href="/cell-scanner.html">Cell Scanner</a>
|
<a class="navbar-item" href="/cell-scanner.html">Cell Scanner</a>
|
||||||
<a class="navbar-item" href="/cell-settings.html"
|
<a class="navbar-item" href="/cell-settings.html"
|
||||||
>Cell Settings</a
|
>Cell Settings</a
|
||||||
>
|
>
|
||||||
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<a class="navbar-item" href="/advance-settings.html"> Advance </a>
|
|
||||||
<a class="navbar-item" href="/about.html"> About </a>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
<div class="navbar-end">
|
<a class="navbar-link"> Advance </a>
|
||||||
<div class="navbar-item">
|
<div class="navbar-dropdown is-boxed">
|
||||||
<div class="buttons is-flex-direction-column-mobile">
|
<a class="navbar-item" href="/advance-settings.html"> Advance Settings </a>
|
||||||
<p class="control is-expanded-mobile">
|
<a class="navbar-item" href="#">Experimental Features</a>
|
||||||
|
<a class="navbar-item" href="/cgi-bin/luci">OpenWRT Luci</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a class="navbar-item" href="/about.html"> About </a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="navbar-end">
|
||||||
|
<div class="navbar-item">
|
||||||
|
<div class="buttons is-flex-direction-column-mobile">
|
||||||
|
<p class="control is-expanded-mobile">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="button is-link is-outlined is-fullwidth-mobile"
|
||||||
|
>
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-arrows-rotate"></i>
|
||||||
|
</span>
|
||||||
|
<span>Restart Connection</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<div class="is-flex is-mobile is-align-items-center">
|
||||||
|
<p class="control">
|
||||||
|
<div href="#" class="button is-warning is-outlined reboot-modal" data-target="reboot-modal" >
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-power-off"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</p>
|
||||||
|
<p class="control ml-2 is-mobile">
|
||||||
<a
|
<a
|
||||||
href="#"
|
href="#"
|
||||||
class="button is-link is-outlined is-fullwidth-mobile"
|
class="button is-warning is-outlined js-theme-toggle"
|
||||||
>
|
>
|
||||||
<span class="icon">
|
<span class="icon">
|
||||||
<i class="fas fa-arrows-rotate"></i>
|
<i class="fas fa-sun"></i>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<p class="control ml-2 is-mobile">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="button is-warning is-outlined js-theme-toggle"
|
||||||
|
id="logoutButton"
|
||||||
|
>
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-right-from-bracket"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>Restart Connection</span>
|
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
<div class="is-flex is-mobile is-align-items-center">
|
|
||||||
<p class="control">
|
|
||||||
<a href="#" class="button is-warning is-outlined">
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-power-off"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
<p class="control ml-2 is-mobile">
|
|
||||||
<a
|
|
||||||
href="#"
|
|
||||||
class="button is-warning is-outlined js-theme-toggle"
|
|
||||||
>
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-sun"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
<p class="control ml-2 is-mobile">
|
|
||||||
<a
|
|
||||||
href="#"
|
|
||||||
class="button is-warning is-outlined js-theme-toggle"
|
|
||||||
id="logoutButton"
|
|
||||||
>
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-right-from-bracket"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
<div class="column-margin">
|
<div class="column-margin">
|
||||||
<div class="fixed-grid has-1-cols">
|
<div class="fixed-grid has-1-cols">
|
||||||
<div class="grid is-gap-5">
|
<div class="grid is-gap-5">
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-header">
|
<div class="card-header">
|
||||||
<p class="card-header-title">
|
<p class="card-header-title">
|
||||||
Full Network Provider Cell Scanner
|
Full Network Provider Cell Scanner
|
||||||
</p>
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<table class="table is-fullwidth">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Network Provider</th>
|
||||||
|
<th>Name</th>
|
||||||
|
<th>EARFCN</th>
|
||||||
|
<th>Bandwidth</th>
|
||||||
|
<th>Physical ID</th>
|
||||||
|
<th class="is-hidden-mobile">RSRP</th>
|
||||||
|
<th class="is-hidden-mobile">RSRQ</th>
|
||||||
|
<th class="is-hidden-mobile">SINR</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td>Smart</td>
|
||||||
|
<td>B1</td>
|
||||||
|
<td>150</td>
|
||||||
|
<td>10</td>
|
||||||
|
<td>623</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> -103 </span>
|
||||||
|
<span class="tag is-danger is-size-6 has-text-white">
|
||||||
|
Poor
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-content">
|
</td>
|
||||||
<table class="table is-fullwidth">
|
<td class="is-hidden-mobile">
|
||||||
<thead>
|
<div class="tags has-addons">
|
||||||
<tr>
|
<span class="tag is-size-6"> -103 </span>
|
||||||
<th>
|
<span class="tag is-danger is-size-6 has-text-white">
|
||||||
Network Provider
|
Poor
|
||||||
</th>
|
</span>
|
||||||
<th>
|
|
||||||
Name
|
|
||||||
</th>
|
|
||||||
<th>
|
|
||||||
EARFCN
|
|
||||||
</th>
|
|
||||||
<th>
|
|
||||||
Bandwidth
|
|
||||||
</th>
|
|
||||||
<th>
|
|
||||||
Physical ID
|
|
||||||
</th>
|
|
||||||
<th class="is-hidden-mobile">
|
|
||||||
RSRP
|
|
||||||
</th>
|
|
||||||
<th class="is-hidden-mobile">
|
|
||||||
RSRQ
|
|
||||||
</th>
|
|
||||||
<th class="is-hidden-mobile">
|
|
||||||
SINR
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
Smart
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
B1
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
150
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
10
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
623
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -103 </span>
|
|
||||||
<span class="tag is-danger is-size-6 has-text-white"> Poor </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -103 </span>
|
|
||||||
<span class="tag is-danger is-size-6 has-text-white"> Poor </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -5 </span>
|
|
||||||
<span class="tag is-danger is-size-6 has-text-white"> Poor </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
DITO
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
B2
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
150
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
10
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
623
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -90 </span>
|
|
||||||
<span class="tag is-warning is-size-6 has-text-white"> Medium </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -90 </span>
|
|
||||||
<span class="tag is-warning is-size-6 has-text-white"> Medium </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> 10 </span>
|
|
||||||
<span class="tag is-warning is-size-6 has-text-white"> Medium </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
Globe
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
B3
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
150
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
10
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
623
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -65 </span>
|
|
||||||
<span class="tag is-success is-size-6 has-text-white"> Strong </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -65 </span>
|
|
||||||
<span class="tag is-success is-size-6 has-text-white"> Strong </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> 30 </span>
|
|
||||||
<span class="tag is-success is-size-6 has-text-white"> Strong </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="card-footer">
|
</td>
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
<td class="is-hidden-mobile">
|
||||||
Start Full Scan
|
<div class="tags has-addons">
|
||||||
</a>
|
<span class="tag is-size-6"> -5 </span>
|
||||||
|
<span class="tag is-danger is-size-6 has-text-white">
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
Poor
|
||||||
Reset
|
</span>
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</td>
|
||||||
</div>
|
</tr>
|
||||||
|
|
||||||
<div class="cell">
|
<tr>
|
||||||
<div class="card">
|
<td>DITO</td>
|
||||||
<div class="card-header">
|
<td>B2</td>
|
||||||
<div class="card-header-title">
|
<td>150</td>
|
||||||
Full Neighbour Cell Scanner
|
<td>10</td>
|
||||||
</div>
|
<td>623</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> -90 </span>
|
||||||
|
<span class="tag is-warning is-size-6 has-text-white">
|
||||||
|
Medium
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-content">
|
</td>
|
||||||
<table class="table is-fullwidth">
|
<td class="is-hidden-mobile">
|
||||||
<thead>
|
<div class="tags has-addons">
|
||||||
<tr>
|
<span class="tag is-size-6"> -90 </span>
|
||||||
<th>
|
<span class="tag is-warning is-size-6 has-text-white">
|
||||||
Name
|
Medium
|
||||||
</th>
|
</span>
|
||||||
<th>
|
|
||||||
EARFCN
|
|
||||||
</th>
|
|
||||||
<th>
|
|
||||||
Bandwidth
|
|
||||||
</th>
|
|
||||||
<th>
|
|
||||||
Physical ID
|
|
||||||
</th>
|
|
||||||
<th class="is-hidden-mobile">
|
|
||||||
RSRP
|
|
||||||
</th>
|
|
||||||
<th class="is-hidden-mobile">
|
|
||||||
RSRQ
|
|
||||||
</th>
|
|
||||||
<th class="is-hidden-mobile">
|
|
||||||
SINR
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
B1
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
150
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
10
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
623
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -103 </span>
|
|
||||||
<span class="tag is-danger is-size-6 has-text-white"> Poor </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -103 </span>
|
|
||||||
<span class="tag is-danger is-size-6 has-text-white"> Poor </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -5 </span>
|
|
||||||
<span class="tag is-danger is-size-6 has-text-white"> Poor </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
B2
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
150
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
10
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
623
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -90 </span>
|
|
||||||
<span class="tag is-warning is-size-6 has-text-white"> Medium </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -90 </span>
|
|
||||||
<span class="tag is-warning is-size-6 has-text-white"> Medium </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> 10 </span>
|
|
||||||
<span class="tag is-warning is-size-6 has-text-white"> Medium </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
B3
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
150
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
10
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
623
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -65 </span>
|
|
||||||
<span class="tag is-success is-size-6 has-text-white"> Strong </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> -65 </span>
|
|
||||||
<span class="tag is-success is-size-6 has-text-white"> Strong </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="is-hidden-mobile">
|
|
||||||
<div class="tags has-addons">
|
|
||||||
<span class="tag is-size-6"> 30 </span>
|
|
||||||
<span class="tag is-success is-size-6 has-text-white"> Strong </span>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="card-footer">
|
</td>
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
<td class="is-hidden-mobile">
|
||||||
Start Neighbourcell Scan
|
<div class="tags has-addons">
|
||||||
</a>
|
<span class="tag is-size-6"> 10 </span>
|
||||||
|
<span class="tag is-warning is-size-6 has-text-white">
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
Medium
|
||||||
Reset
|
</span>
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</td>
|
||||||
</div>
|
</tr>
|
||||||
|
|
||||||
|
<tr>
|
||||||
|
<td>Globe</td>
|
||||||
|
<td>B3</td>
|
||||||
|
<td>150</td>
|
||||||
|
<td>10</td>
|
||||||
|
<td>623</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> -65 </span>
|
||||||
|
<span class="tag is-success is-size-6 has-text-white">
|
||||||
|
Strong
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> -65 </span>
|
||||||
|
<span class="tag is-success is-size-6 has-text-white">
|
||||||
|
Strong
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> 30 </span>
|
||||||
|
<span class="tag is-success is-size-6 has-text-white">
|
||||||
|
Strong
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Start Full Scan
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Reset
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<div class="card-header-title">Full Neighbour Cell Scanner</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<table class="table is-fullwidth">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Name</th>
|
||||||
|
<th>EARFCN</th>
|
||||||
|
<th>Bandwidth</th>
|
||||||
|
<th>Physical ID</th>
|
||||||
|
<th class="is-hidden-mobile">RSRP</th>
|
||||||
|
<th class="is-hidden-mobile">RSRQ</th>
|
||||||
|
<th class="is-hidden-mobile">SINR</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td>B1</td>
|
||||||
|
<td>150</td>
|
||||||
|
<td>10</td>
|
||||||
|
<td>623</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> -103 </span>
|
||||||
|
<span class="tag is-danger is-size-6 has-text-white">
|
||||||
|
Poor
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> -103 </span>
|
||||||
|
<span class="tag is-danger is-size-6 has-text-white">
|
||||||
|
Poor
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> -5 </span>
|
||||||
|
<span class="tag is-danger is-size-6 has-text-white">
|
||||||
|
Poor
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
|
||||||
|
<tr>
|
||||||
|
<td>B2</td>
|
||||||
|
<td>150</td>
|
||||||
|
<td>10</td>
|
||||||
|
<td>623</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> -90 </span>
|
||||||
|
<span class="tag is-warning is-size-6 has-text-white">
|
||||||
|
Medium
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> -90 </span>
|
||||||
|
<span class="tag is-warning is-size-6 has-text-white">
|
||||||
|
Medium
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> 10 </span>
|
||||||
|
<span class="tag is-warning is-size-6 has-text-white">
|
||||||
|
Medium
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
|
||||||
|
<tr>
|
||||||
|
<td>B3</td>
|
||||||
|
<td>150</td>
|
||||||
|
<td>10</td>
|
||||||
|
<td>623</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> -65 </span>
|
||||||
|
<span class="tag is-success is-size-6 has-text-white">
|
||||||
|
Strong
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> -65 </span>
|
||||||
|
<span class="tag is-success is-size-6 has-text-white">
|
||||||
|
Strong
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="is-hidden-mobile">
|
||||||
|
<div class="tags has-addons">
|
||||||
|
<span class="tag is-size-6"> 30 </span>
|
||||||
|
<span class="tag is-success is-size-6 has-text-white">
|
||||||
|
Strong
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Start Neighbourcell Scan
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Reset
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer class="footer">
|
<footer class="footer">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
||||||
<div class="grid">
|
<div class="grid">
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="icon-text">
|
<div class="icon-text">
|
||||||
<span class="icon has-text-info">
|
<span class="icon has-text-info">
|
||||||
<i class="fas fa-info-circle"></i>
|
<i class="fas fa-info-circle"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>Information</span>
|
<span>Information</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p class="block has-text-weight-semibold">
|
<p class="block has-text-weight-semibold">
|
||||||
Full Network Provider Cell Scanner will scan all of the cells in your area even from other
|
Full Network Provider Cell Scanner will scan all of the cells in
|
||||||
network providers.
|
your area even from other network providers.
|
||||||
<br />
|
<br />
|
||||||
The NR-5G scan will only display SA bands available in your area.
|
The NR-5G scan will only display SA bands available in your
|
||||||
<br />
|
area.
|
||||||
Scanning will take a few minutes so please wait patiently.
|
<br />
|
||||||
<br />
|
Scanning will take a few minutes so please wait patiently.
|
||||||
If problem persists after scanning, please reboot the modem.
|
<br />
|
||||||
</p>
|
If problem persists after scanning, please reboot the modem.
|
||||||
</div>
|
</p>
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="icon-text">
|
|
||||||
<span class="icon has-text-info">
|
|
||||||
<i class="fas fa-info-circle"></i>
|
|
||||||
</span>
|
|
||||||
<span>Information</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="block has-text-weight-semibold">
|
|
||||||
Full Neighbour Cell Scanner will only scan the bands of your active network provider.
|
|
||||||
<br />
|
|
||||||
The NR-5G scan result is based on your current active 5G network mode.
|
|
||||||
<br />
|
|
||||||
If problem persists after scanning, please reboot the modem.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
</body>
|
|
||||||
|
|
||||||
</html>
|
<div class="cell">
|
||||||
|
<div class="icon-text">
|
||||||
|
<span class="icon has-text-info">
|
||||||
|
<i class="fas fa-info-circle"></i>
|
||||||
|
</span>
|
||||||
|
<span>Information</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="block has-text-weight-semibold">
|
||||||
|
Full Neighbour Cell Scanner will only scan the bands of your
|
||||||
|
active network provider.
|
||||||
|
<br />
|
||||||
|
The NR-5G scan result is based on your current active 5G network
|
||||||
|
mode.
|
||||||
|
<br />
|
||||||
|
If problem persists after scanning, please reboot the modem.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<div id="reboot-modal" class="modal">
|
||||||
|
<div class="modal-background"></div>
|
||||||
|
<div class="modal-card">
|
||||||
|
<section class="modal-card-body rounded-edge">
|
||||||
|
<p class="subtitle" id="modal-message">
|
||||||
|
Do you want to reboot the device?
|
||||||
|
</p>
|
||||||
|
<div id="loading-content" style="display: none">
|
||||||
|
<div class="custom-loader"></div>
|
||||||
|
<div class="countdown-text">
|
||||||
|
Rebooting... <span id="countdown">40</span>s
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="buttons" id="modal-buttons">
|
||||||
|
<button class="button is-warning" id="rebootModem">Reboot</button>
|
||||||
|
<button class="button cancel" aria-label="close">Cancel</button>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@@ -1,378 +1,450 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
<head>
|
||||||
<head>
|
<meta charset="UTF-8" />
|
||||||
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
||||||
|
|
||||||
<!-- Logo -->
|
<!-- Logo -->
|
||||||
<link rel="simpleadmin-logo" href="favicon.ico" />
|
<link rel="simpleadmin-logo" href="favicon.ico" />
|
||||||
|
|
||||||
<link rel="stylesheet" href="css/bulma/bulma.scss">
|
<link rel="stylesheet" href="css/bulma/bulma.scss" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.min.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.min.css" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.css" />
|
||||||
<link rel="stylesheet" href="css/custom.css">
|
<link rel="stylesheet" href="css/custom.css" />
|
||||||
|
|
||||||
<!-- Font awesome icons -->
|
<!-- Font awesome icons -->
|
||||||
<script src="https://kit.fontawesome.com/b0caedfab3.js" crossorigin="anonymous"></script>
|
<script
|
||||||
|
src="https://kit.fontawesome.com/b0caedfab3.js"
|
||||||
|
crossorigin="anonymous"
|
||||||
|
></script>
|
||||||
|
|
||||||
<script src="js/styles/nav-burger.js"></script>
|
|
||||||
<script src="js/styles/toggle-theme.js"></script>
|
<script src="js/styles/toggle-theme.js"></script>
|
||||||
|
<script src="/js/styles/nav-burger.js"></script>
|
||||||
|
<script src="/js/styles/modal-trigger.js"></script>
|
||||||
|
<script src="/js/utils/reboot.js"></script>
|
||||||
<script defer src="/js/auth/auth.js"></script>
|
<script defer src="/js/auth/auth.js"></script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
(function () {
|
(function () {
|
||||||
const savedTheme = localStorage.getItem('theme') || 'theme-dark';
|
const savedTheme = localStorage.getItem("theme") || "theme-dark";
|
||||||
document.documentElement.classList.add(savedTheme);
|
document.documentElement.classList.add(savedTheme);
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<title>QuecManager</title>
|
<title>QuecManager</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="body-margin">
|
<body class="body-margin">
|
||||||
<nav class="navbar is-transparent">
|
<nav class="navbar is-transparent">
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
<a class="navbar-item" href="/">
|
<a class="navbar-item" href="/">
|
||||||
<img src="/assets/logo.png" alt="Logo" />
|
<img src="/assets/logo.png" alt="Logo" />
|
||||||
<span class="title">QuecManager</span>
|
<span class="title">QuecManager</span>
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
role="button"
|
role="button"
|
||||||
class="navbar-burger"
|
class="navbar-burger"
|
||||||
aria-label="menu"
|
aria-label="menu"
|
||||||
aria-expanded="false"
|
aria-expanded="false"
|
||||||
data-target="navMenu"
|
data-target="navMenu"
|
||||||
>
|
>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="navMenu" class="navbar-menu">
|
<div id="navMenu" class="navbar-menu">
|
||||||
<div class="navbar-start ml-6">
|
<div class="navbar-start ml-6">
|
||||||
<a class="navbar-item" href="/"> Home </a>
|
<a class="navbar-item has-text-weight-bold" href="/"> Home </a>
|
||||||
<div class="navbar-item has-dropdown is-hoverable">
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
<a class="navbar-link"> Cellular </a>
|
<a class="navbar-link"> Cellular </a>
|
||||||
<div class="navbar-dropdown is-boxed">
|
<div class="navbar-dropdown is-boxed">
|
||||||
<a class="navbar-item" href="/bandlock.html"> Band Locking </a>
|
<a class="navbar-item" href="/bandlock.html"> Band Locking </a>
|
||||||
<a class="navbar-item" href="/cell-locking.html">Cell Locking</a>
|
<a class="navbar-item" href="/cell-locking.html">Cell Locking</a>
|
||||||
<a class="navbar-item" href="/cell-scanner.html">Cell Scanner</a>
|
<a class="navbar-item" href="/cell-scanner.html">Cell Scanner</a>
|
||||||
<a class="navbar-item" href="/cell-settings.html"
|
<a class="navbar-item" href="/cell-settings.html"
|
||||||
>Cell Settings</a
|
>Cell Settings</a
|
||||||
>
|
>
|
||||||
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<a class="navbar-item" href="/advance-settings.html"> Advance </a>
|
|
||||||
<a class="navbar-item" href="/about.html"> About </a>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
<div class="navbar-end">
|
<a class="navbar-link"> Advance </a>
|
||||||
<div class="navbar-item">
|
<div class="navbar-dropdown is-boxed">
|
||||||
<div class="buttons is-flex-direction-column-mobile">
|
<a class="navbar-item" href="/advance-settings.html"> Advance Settings </a>
|
||||||
<p class="control is-expanded-mobile">
|
<a class="navbar-item" href="#">Experimental Features</a>
|
||||||
|
<a class="navbar-item" href="/cgi-bin/luci">OpenWRT Luci</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a class="navbar-item" href="/about.html"> About </a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="navbar-end">
|
||||||
|
<div class="navbar-item">
|
||||||
|
<div class="buttons is-flex-direction-column-mobile">
|
||||||
|
<p class="control is-expanded-mobile">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="button is-link is-outlined is-fullwidth-mobile"
|
||||||
|
>
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-arrows-rotate"></i>
|
||||||
|
</span>
|
||||||
|
<span>Restart Connection</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<div class="is-flex is-mobile is-align-items-center">
|
||||||
|
<p class="control">
|
||||||
|
<div href="#" class="button is-warning is-outlined reboot-modal" data-target="reboot-modal" >
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-power-off"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</p>
|
||||||
|
<p class="control ml-2 is-mobile">
|
||||||
<a
|
<a
|
||||||
href="#"
|
href="#"
|
||||||
class="button is-link is-outlined is-fullwidth-mobile"
|
class="button is-warning is-outlined js-theme-toggle"
|
||||||
>
|
>
|
||||||
<span class="icon">
|
<span class="icon">
|
||||||
<i class="fas fa-arrows-rotate"></i>
|
<i class="fas fa-sun"></i>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<p class="control ml-2 is-mobile">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="button is-warning is-outlined js-theme-toggle"
|
||||||
|
id="logoutButton"
|
||||||
|
>
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-right-from-bracket"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>Restart Connection</span>
|
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
<div class="is-flex is-mobile is-align-items-center">
|
|
||||||
<p class="control">
|
|
||||||
<a href="#" class="button is-warning is-outlined">
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-power-off"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
<p class="control ml-2 is-mobile">
|
|
||||||
<a
|
|
||||||
href="#"
|
|
||||||
class="button is-warning is-outlined js-theme-toggle"
|
|
||||||
>
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-sun"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
<p class="control ml-2 is-mobile">
|
|
||||||
<a
|
|
||||||
href="#"
|
|
||||||
class="button is-warning is-outlined js-theme-toggle"
|
|
||||||
id="logoutButton"
|
|
||||||
>
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-right-from-bracket"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
<div class="column-margin">
|
<div class="column-margin">
|
||||||
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
||||||
<div class="grid">
|
<div class="grid">
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-header">
|
<div class="card-header">
|
||||||
<div class="card-header-title">
|
<div class="card-header-title">Basic Cellular Settings</div>
|
||||||
Basic Cellular Settings
|
</div>
|
||||||
</div>
|
<div class="card-content">
|
||||||
</div>
|
<div class="fixed-grid has-2-cols">
|
||||||
<div class="card-content">
|
<div class="grid is-gap-5">
|
||||||
<div class="fixed-grid has-2-cols">
|
<div class="cell">
|
||||||
<div class="grid is-gap-5">
|
<div class="field">
|
||||||
<div class="cell">
|
<label class="label">Current APN</label>
|
||||||
<div class="field">
|
<div class="control">
|
||||||
<label class="label">Current APN</label>
|
<input
|
||||||
<div class="control">
|
class="input"
|
||||||
<input class="input" type="text" placeholder="Current APN Here">
|
type="text"
|
||||||
</div>
|
placeholder="Current APN Here"
|
||||||
<p class="help">Changing this will disable automatic APN.</p>
|
/>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">APN PDP Type</label>
|
|
||||||
<p class="control has-icons-left">
|
|
||||||
<span class="select">
|
|
||||||
<select>
|
|
||||||
<option selected>Select APN PDP Type</option>
|
|
||||||
<option>IPv4 Only</option>
|
|
||||||
<option>IPv6 Only</option>
|
|
||||||
<option>IPv4 and IPv6</option>
|
|
||||||
<option>P2P Protocol</option>
|
|
||||||
</select>
|
|
||||||
</span>
|
|
||||||
<span class="icon is-small is-left">
|
|
||||||
<i class="fas fa-globe"></i>
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">Preferred Network Mode</label>
|
|
||||||
<p class="control has-icons-left">
|
|
||||||
<span class="select">
|
|
||||||
<select>
|
|
||||||
<option selected>Select Preferred Network Mode</option>
|
|
||||||
<option>Automatic</option>
|
|
||||||
<option>LTE Only</option>
|
|
||||||
<option>5G SA Only</option>
|
|
||||||
<option>5G NSA Only</option>
|
|
||||||
</select>
|
|
||||||
</span>
|
|
||||||
<span class="icon is-small is-left">
|
|
||||||
<i class="fas fa-signal"></i>
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">NR5G Mode Control</label>
|
|
||||||
<p class="control has-icons-left">
|
|
||||||
<span class="select">
|
|
||||||
<select>
|
|
||||||
<option selected>Select NR5G Mode Control</option>
|
|
||||||
<option>Enable NR5G SA and NSA</option>
|
|
||||||
<option>Enable SA Only</option>
|
|
||||||
<option>Enable NSA Only</option>
|
|
||||||
</select>
|
|
||||||
</span>
|
|
||||||
<span class="icon is-small is-left">
|
|
||||||
<i class="fas fa-podcast"></i>
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-footer">
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Save
|
|
||||||
</a>
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Reset
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
|
<p class="help">
|
||||||
|
Changing this will disable automatic APN.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="card">
|
<div class="field">
|
||||||
<div class="card-header">
|
<label class="label">APN PDP Type</label>
|
||||||
<div class="card-header-title">
|
<p class="control has-icons-left">
|
||||||
APN and ICCID Based Locking
|
<span class="select">
|
||||||
</div>
|
<select>
|
||||||
</div>
|
<option selected>Select APN PDP Type</option>
|
||||||
<div class="card-content">
|
<option>IPv4 Only</option>
|
||||||
<div class="fixed-grid has-1-cols">
|
<option>IPv6 Only</option>
|
||||||
<div class="grid is-gap-5">
|
<option>IPv4 and IPv6</option>
|
||||||
<div class="cell">
|
<option>P2P Protocol</option>
|
||||||
<div class="fixed-grid has-2-cols">
|
</select>
|
||||||
<div class="grid is-gap-3">
|
</span>
|
||||||
<div class="cell">
|
<span class="icon is-small is-left">
|
||||||
<div class="field">
|
<i class="fas fa-globe"></i>
|
||||||
<label class="label">APN Profile 1</label>
|
</span>
|
||||||
<div class="control">
|
</p>
|
||||||
<input class="input" type="text" placeholder="APN Here">
|
</div>
|
||||||
</div>
|
|
||||||
<p class="help">This will override the current APN.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">APN PDP Type</label>
|
|
||||||
<p class="control has-icons-left">
|
|
||||||
<span class="select">
|
|
||||||
<select>
|
|
||||||
<option selected>Select APN PDP Type</option>
|
|
||||||
<option>IPv4 Only</option>
|
|
||||||
<option>IPv6 Only</option>
|
|
||||||
<option>IPv4 and IPv6</option>
|
|
||||||
<option>P2P Protocol</option>
|
|
||||||
</select>
|
|
||||||
</span>
|
|
||||||
<span class="icon is-small is-left">
|
|
||||||
<i class="fas fa-globe"></i>
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell is-col-span-2">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">ICCID Profile 1</label>
|
|
||||||
<div class="control">
|
|
||||||
<input class="input" type="text" placeholder="ICCID Here">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="fixed-grid has-2-cols">
|
|
||||||
<div class="grid is-gap-3">
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">APN Profile 2</label>
|
|
||||||
<div class="control">
|
|
||||||
<input class="input" type="text" placeholder="APN Here">
|
|
||||||
</div>
|
|
||||||
<p class="help">This will override the current APN.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">APN PDP Type</label>
|
|
||||||
<p class="control has-icons-left">
|
|
||||||
<span class="select">
|
|
||||||
<select>
|
|
||||||
<option selected>Select APN PDP Type</option>
|
|
||||||
<option>IPv4 Only</option>
|
|
||||||
<option>IPv6 Only</option>
|
|
||||||
<option>IPv4 and IPv6</option>
|
|
||||||
<option>P2P Protocol</option>
|
|
||||||
</select>
|
|
||||||
</span>
|
|
||||||
<span class="icon is-small is-left">
|
|
||||||
<i class="fas fa-globe"></i>
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell is-col-span-2">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">ICCID Profile 2</label>
|
|
||||||
<div class="control">
|
|
||||||
<input class="input" type="text" placeholder="ICCID Here">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="card-footer">
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Save
|
|
||||||
</a>
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Reset
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">Preferred Network Mode</label>
|
||||||
|
<p class="control has-icons-left">
|
||||||
|
<span class="select">
|
||||||
|
<select>
|
||||||
|
<option selected>
|
||||||
|
Select Preferred Network Mode
|
||||||
|
</option>
|
||||||
|
<option>Automatic</option>
|
||||||
|
<option>LTE Only</option>
|
||||||
|
<option>5G SA Only</option>
|
||||||
|
<option>5G NSA Only</option>
|
||||||
|
</select>
|
||||||
|
</span>
|
||||||
|
<span class="icon is-small is-left">
|
||||||
|
<i class="fas fa-signal"></i>
|
||||||
|
</span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">NR5G Mode Control</label>
|
||||||
|
<p class="control has-icons-left">
|
||||||
|
<span class="select">
|
||||||
|
<select>
|
||||||
|
<option selected>Select NR5G Mode Control</option>
|
||||||
|
<option>Enable NR5G SA and NSA</option>
|
||||||
|
<option>Enable SA Only</option>
|
||||||
|
<option>Enable NSA Only</option>
|
||||||
|
</select>
|
||||||
|
</span>
|
||||||
|
<span class="icon is-small is-left">
|
||||||
|
<i class="fas fa-podcast"></i>
|
||||||
|
</span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Save
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Reset
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<div class="card-header-title">APN and ICCID Based Locking</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="fixed-grid has-1-cols">
|
||||||
|
<div class="grid is-gap-5">
|
||||||
|
<div class="cell">
|
||||||
|
<div class="fixed-grid has-2-cols">
|
||||||
|
<div class="grid is-gap-3">
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">APN Profile 1</label>
|
||||||
|
<div class="control">
|
||||||
|
<input
|
||||||
|
class="input"
|
||||||
|
type="text"
|
||||||
|
placeholder="APN Here"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<p class="help">
|
||||||
|
This will override the current APN.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">APN PDP Type</label>
|
||||||
|
<p class="control has-icons-left">
|
||||||
|
<span class="select">
|
||||||
|
<select>
|
||||||
|
<option selected>
|
||||||
|
Select APN PDP Type
|
||||||
|
</option>
|
||||||
|
<option>IPv4 Only</option>
|
||||||
|
<option>IPv6 Only</option>
|
||||||
|
<option>IPv4 and IPv6</option>
|
||||||
|
<option>P2P Protocol</option>
|
||||||
|
</select>
|
||||||
|
</span>
|
||||||
|
<span class="icon is-small is-left">
|
||||||
|
<i class="fas fa-globe"></i>
|
||||||
|
</span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell is-col-span-2">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">ICCID Profile 1</label>
|
||||||
|
<div class="control">
|
||||||
|
<input
|
||||||
|
class="input"
|
||||||
|
type="text"
|
||||||
|
placeholder="ICCID Here"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="fixed-grid has-2-cols">
|
||||||
|
<div class="grid is-gap-3">
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">APN Profile 2</label>
|
||||||
|
<div class="control">
|
||||||
|
<input
|
||||||
|
class="input"
|
||||||
|
type="text"
|
||||||
|
placeholder="APN Here"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<p class="help">
|
||||||
|
This will override the current APN.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">APN PDP Type</label>
|
||||||
|
<p class="control has-icons-left">
|
||||||
|
<span class="select">
|
||||||
|
<select>
|
||||||
|
<option selected>
|
||||||
|
Select APN PDP Type
|
||||||
|
</option>
|
||||||
|
<option>IPv4 Only</option>
|
||||||
|
<option>IPv6 Only</option>
|
||||||
|
<option>IPv4 and IPv6</option>
|
||||||
|
<option>P2P Protocol</option>
|
||||||
|
</select>
|
||||||
|
</span>
|
||||||
|
<span class="icon is-small is-left">
|
||||||
|
<i class="fas fa-globe"></i>
|
||||||
|
</span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell is-col-span-2">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">ICCID Profile 2</label>
|
||||||
|
<div class="control">
|
||||||
|
<input
|
||||||
|
class="input"
|
||||||
|
type="text"
|
||||||
|
placeholder="ICCID Here"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Save
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Reset
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer class="footer">
|
<footer class="footer">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
<div class="fixed-grid has-2-cols has-1-cols-mobile">
|
||||||
<div class="grid">
|
<div class="grid">
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="icon-text">
|
<div class="icon-text">
|
||||||
<span class="icon has-text-info">
|
<span class="icon has-text-info">
|
||||||
<i class="fas fa-info-circle"></i>
|
<i class="fas fa-info-circle"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>Information</span>
|
<span>Information</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p class="block has-text-weight-semibold">
|
<p class="block has-text-weight-semibold">
|
||||||
Changing APN disconnects and reconnects the network automatically.
|
Changing APN disconnects and reconnects the network
|
||||||
<br />
|
automatically.
|
||||||
If problem persists after changing settings, please reboot the modem.
|
<br />
|
||||||
<br />
|
If problem persists after changing settings, please reboot the
|
||||||
Please use the settings with caution.
|
modem.
|
||||||
</p>
|
<br />
|
||||||
</div>
|
Please use the settings with caution.
|
||||||
|
</p>
|
||||||
<div class="cell">
|
|
||||||
<div class="icon-text">
|
|
||||||
<span class="icon has-text-info">
|
|
||||||
<i class="fas fa-info-circle"></i>
|
|
||||||
</span>
|
|
||||||
<span>Information</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="block has-text-weight-semibold">
|
|
||||||
APN and ICCID Based Locking will use a stored APN profile based on the current SIM's ICCID.
|
|
||||||
<br />
|
|
||||||
Currently experimental.
|
|
||||||
<br />
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
</body>
|
|
||||||
|
|
||||||
</html>
|
<div class="cell">
|
||||||
|
<div class="icon-text">
|
||||||
|
<span class="icon has-text-info">
|
||||||
|
<i class="fas fa-info-circle"></i>
|
||||||
|
</span>
|
||||||
|
<span>Information</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="block has-text-weight-semibold">
|
||||||
|
APN and ICCID Based Locking will use a stored APN profile based
|
||||||
|
on the current SIM's ICCID.
|
||||||
|
<br />
|
||||||
|
Currently experimental.
|
||||||
|
<br />
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<div id="reboot-modal" class="modal">
|
||||||
|
<div class="modal-background"></div>
|
||||||
|
<div class="modal-card">
|
||||||
|
<section class="modal-card-body rounded-edge">
|
||||||
|
<p class="subtitle" id="modal-message">
|
||||||
|
Do you want to reboot the device?
|
||||||
|
</p>
|
||||||
|
<div id="loading-content" style="display: none">
|
||||||
|
<div class="custom-loader"></div>
|
||||||
|
<div class="countdown-text">
|
||||||
|
Rebooting... <span id="countdown">40</span>s
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="buttons" id="modal-buttons">
|
||||||
|
<button class="button is-warning" id="rebootModem">Reboot</button>
|
||||||
|
<button class="button cancel" aria-label="close">Cancel</button>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@@ -1,364 +1,414 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
<head>
|
||||||
<head>
|
<meta charset="UTF-8" />
|
||||||
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
||||||
|
|
||||||
<!-- Logo -->
|
<!-- Logo -->
|
||||||
<link rel="simpleadmin-logo" href="favicon.ico" />
|
<link rel="simpleadmin-logo" href="favicon.ico" />
|
||||||
|
|
||||||
<link rel="stylesheet" href="css/bulma/bulma.scss">
|
<link rel="stylesheet" href="css/bulma/bulma.scss" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.min.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.min.css" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.css" />
|
||||||
<link rel="stylesheet" href="css/custom.css">
|
<link rel="stylesheet" href="css/custom.css" />
|
||||||
|
|
||||||
<!-- Font awesome icons -->
|
<!-- Font awesome icons -->
|
||||||
<script src="https://kit.fontawesome.com/b0caedfab3.js" crossorigin="anonymous"></script>
|
<script
|
||||||
|
src="https://kit.fontawesome.com/b0caedfab3.js"
|
||||||
|
crossorigin="anonymous"
|
||||||
|
></script>
|
||||||
|
|
||||||
<script src="js/styles/nav-burger.js"></script>
|
|
||||||
<script src="js/styles/toggle-theme.js"></script>
|
<script src="js/styles/toggle-theme.js"></script>
|
||||||
|
<script src="/js/styles/nav-burger.js"></script>
|
||||||
|
<script src="/js/styles/modal-trigger.js"></script>
|
||||||
|
<script src="/js/utils/reboot.js"></script>
|
||||||
<script defer src="/js/auth/auth.js"></script>
|
<script defer src="/js/auth/auth.js"></script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
(function () {
|
(function () {
|
||||||
const savedTheme = localStorage.getItem('theme') || 'theme-dark';
|
const savedTheme = localStorage.getItem("theme") || "theme-dark";
|
||||||
document.documentElement.classList.add(savedTheme);
|
document.documentElement.classList.add(savedTheme);
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<title>QuecManager</title>
|
<title>QuecManager</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="body-margin">
|
<body class="body-margin">
|
||||||
<nav class="navbar is-transparent">
|
<nav class="navbar is-transparent">
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
<a class="navbar-item" href="/">
|
<a class="navbar-item" href="/">
|
||||||
<img src="/assets/logo.png" alt="Logo" />
|
<img src="/assets/logo.png" alt="Logo" />
|
||||||
<span class="title">QuecManager</span>
|
<span class="title">QuecManager</span>
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
role="button"
|
role="button"
|
||||||
class="navbar-burger"
|
class="navbar-burger"
|
||||||
aria-label="menu"
|
aria-label="menu"
|
||||||
aria-expanded="false"
|
aria-expanded="false"
|
||||||
data-target="navMenu"
|
data-target="navMenu"
|
||||||
>
|
>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="navMenu" class="navbar-menu">
|
<div id="navMenu" class="navbar-menu">
|
||||||
<div class="navbar-start ml-6">
|
<div class="navbar-start ml-6">
|
||||||
<a class="navbar-item" href="/"> Home </a>
|
<a class="navbar-item has-text-weight-bold" href="/"> Home </a>
|
||||||
<div class="navbar-item has-dropdown is-hoverable">
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
<a class="navbar-link has-text-weight-bold"> Cellular </a>
|
<a class="navbar-link"> Cellular </a>
|
||||||
<div class="navbar-dropdown is-boxed">
|
<div class="navbar-dropdown is-boxed">
|
||||||
<a class="navbar-item" href="/bandlock.html"> Band Locking </a>
|
<a class="navbar-item" href="/bandlock.html"> Band Locking </a>
|
||||||
<a class="navbar-item" href="/cell-locking.html">Cell Locking</a>
|
<a class="navbar-item" href="/cell-locking.html">Cell Locking</a>
|
||||||
<a class="navbar-item" href="/cell-scanner.html">Cell Scanner</a>
|
<a class="navbar-item" href="/cell-scanner.html">Cell Scanner</a>
|
||||||
<a class="navbar-item" href="/cell-settings.html"
|
<a class="navbar-item" href="/cell-settings.html"
|
||||||
>Cell Settings</a
|
>Cell Settings</a
|
||||||
>
|
>
|
||||||
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<a class="navbar-item" href="/advance-settings.html"> Advance </a>
|
|
||||||
<a class="navbar-item" href="/about.html"> About </a>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
<div class="navbar-end">
|
<a class="navbar-link"> Advance </a>
|
||||||
<div class="navbar-item">
|
<div class="navbar-dropdown is-boxed">
|
||||||
<div class="buttons is-flex-direction-column-mobile">
|
<a class="navbar-item" href="/advance-settings.html"> Advance Settings </a>
|
||||||
<p class="control is-expanded-mobile">
|
<a class="navbar-item" href="#">Experimental Features</a>
|
||||||
|
<a class="navbar-item" href="/cgi-bin/luci">OpenWRT Luci</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a class="navbar-item" href="/about.html"> About </a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="navbar-end">
|
||||||
|
<div class="navbar-item">
|
||||||
|
<div class="buttons is-flex-direction-column-mobile">
|
||||||
|
<p class="control is-expanded-mobile">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="button is-link is-outlined is-fullwidth-mobile"
|
||||||
|
>
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-arrows-rotate"></i>
|
||||||
|
</span>
|
||||||
|
<span>Restart Connection</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<div class="is-flex is-mobile is-align-items-center">
|
||||||
|
<p class="control">
|
||||||
|
<div href="#" class="button is-warning is-outlined reboot-modal" data-target="reboot-modal" >
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-power-off"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</p>
|
||||||
|
<p class="control ml-2 is-mobile">
|
||||||
<a
|
<a
|
||||||
href="#"
|
href="#"
|
||||||
class="button is-link is-outlined is-fullwidth-mobile"
|
class="button is-warning is-outlined js-theme-toggle"
|
||||||
>
|
>
|
||||||
<span class="icon">
|
<span class="icon">
|
||||||
<i class="fas fa-arrows-rotate"></i>
|
<i class="fas fa-sun"></i>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<p class="control ml-2 is-mobile">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="button is-warning is-outlined js-theme-toggle"
|
||||||
|
id="logoutButton"
|
||||||
|
>
|
||||||
|
<span class="icon">
|
||||||
|
<i class="fas fa-right-from-bracket"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>Restart Connection</span>
|
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
<div class="is-flex is-mobile is-align-items-center">
|
|
||||||
<p class="control">
|
|
||||||
<a href="#" class="button is-warning is-outlined">
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-power-off"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
<p class="control ml-2 is-mobile">
|
|
||||||
<a
|
|
||||||
href="#"
|
|
||||||
class="button is-warning is-outlined js-theme-toggle"
|
|
||||||
>
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-sun"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
<p class="control ml-2 is-mobile">
|
|
||||||
<a
|
|
||||||
href="#"
|
|
||||||
class="button is-warning is-outlined js-theme-toggle"
|
|
||||||
id="logoutButton"
|
|
||||||
>
|
|
||||||
<span class="icon">
|
|
||||||
<i class="fas fa-right-from-bracket"></i>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
<div class="column-margin">
|
<div class="column-margin">
|
||||||
<div class="fixed-grid has-1-cols">
|
<div class="fixed-grid has-1-cols">
|
||||||
<div class="grid is-gap-5">
|
<div class="grid is-gap-5">
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-header">
|
<div class="card-header">
|
||||||
<div class="card-header-title">
|
<div class="card-header-title">SMS Inbox</div>
|
||||||
SMS Inbox
|
</div>
|
||||||
</div>
|
|
||||||
|
<div class="card-content">
|
||||||
|
<div
|
||||||
|
class="fixed-grid has-1-cols"
|
||||||
|
style="height: 450px; overflow-y: scroll"
|
||||||
|
>
|
||||||
|
<div class="grid is-gap-4 is-fullwidth">
|
||||||
|
<div class="cell">
|
||||||
|
<div class="is-flex is-align-items-center">
|
||||||
|
<div class="checkbox mr-6">
|
||||||
|
<input type="checkbox" />
|
||||||
</div>
|
</div>
|
||||||
|
<div
|
||||||
<div class="card-content">
|
class="is-flex is-flex-direction-column is-align-items-start"
|
||||||
<div class="fixed-grid has-1-cols" style="height: 450px; overflow-y: scroll;">
|
>
|
||||||
<div class="grid is-gap-4 is-fullwidth">
|
<p class="has-text-weight-semibold">
|
||||||
<div class="cell">
|
Senders Name Here
|
||||||
<div class="is-flex is-align-items-center">
|
</p>
|
||||||
<div class="checkbox mr-6">
|
<p>2022-11-20 13:30:00</p>
|
||||||
<input type="checkbox">
|
<p>
|
||||||
</div>
|
Message content here. Lorem ipsum dolor sit amet
|
||||||
<div class="is-flex is-flex-direction-column is-align-items-start">
|
consectetur adipisicing elit. Corrupti doloremque
|
||||||
<p class="has-text-weight-semibold">
|
voluptatum velit repellendus ipsum delectus
|
||||||
Senders Name Here
|
blanditiis quis dolores. Maxime labore esse
|
||||||
</p>
|
laboriosam inventore error molestiae consequuntur
|
||||||
<p>
|
quo, deleniti ea nihil.
|
||||||
2022-11-20 13:30:00
|
</p>
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Message content here. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Corrupti doloremque voluptatum velit repellendus
|
|
||||||
ipsum delectus blanditiis quis dolores. Maxime labore esse
|
|
||||||
laboriosam inventore error molestiae consequuntur quo, deleniti ea
|
|
||||||
nihil.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="is-flex is-align-items-center">
|
|
||||||
<div class="checkbox mr-6">
|
|
||||||
<input type="checkbox">
|
|
||||||
</div>
|
|
||||||
<div class="is-flex is-flex-direction-column is-align-items-start">
|
|
||||||
<p class="has-text-weight-semibold">
|
|
||||||
Senders Name Here
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
2022-11-20 13:30:00
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Message content here. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Corrupti doloremque voluptatum velit repellendus
|
|
||||||
ipsum delectus blanditiis quis dolores. Maxime labore esse
|
|
||||||
laboriosam inventore error molestiae consequuntur quo, deleniti ea
|
|
||||||
nihil.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="is-flex is-align-items-center">
|
|
||||||
<div class="checkbox mr-6">
|
|
||||||
<input type="checkbox">
|
|
||||||
</div>
|
|
||||||
<div class="is-flex is-flex-direction-column is-align-items-start">
|
|
||||||
<p class="has-text-weight-semibold">
|
|
||||||
Senders Name Here
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
2022-11-20 13:30:00
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Message content here. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Corrupti doloremque voluptatum velit repellendus
|
|
||||||
ipsum delectus blanditiis quis dolores. Maxime labore esse
|
|
||||||
laboriosam inventore error molestiae consequuntur quo, deleniti ea
|
|
||||||
nihil.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="is-flex is-align-items-center">
|
|
||||||
<div class="checkbox mr-6">
|
|
||||||
<input type="checkbox">
|
|
||||||
</div>
|
|
||||||
<div class="is-flex is-flex-direction-column is-align-items-start">
|
|
||||||
<p class="has-text-weight-semibold">
|
|
||||||
Senders Name Here
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
2022-11-20 13:30:00
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Message content here. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Corrupti doloremque voluptatum velit repellendus
|
|
||||||
ipsum delectus blanditiis quis dolores. Maxime labore esse
|
|
||||||
laboriosam inventore error molestiae consequuntur quo, deleniti ea
|
|
||||||
nihil.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="is-flex is-align-items-center">
|
|
||||||
<div class="checkbox mr-6">
|
|
||||||
<input type="checkbox">
|
|
||||||
</div>
|
|
||||||
<div class="is-flex is-flex-direction-column is-align-items-start">
|
|
||||||
<p class="has-text-weight-semibold">
|
|
||||||
Senders Name Here
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
2022-11-20 13:30:00
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Message content here. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Corrupti doloremque voluptatum velit repellendus
|
|
||||||
ipsum delectus blanditiis quis dolores. Maxime labore esse
|
|
||||||
laboriosam inventore error molestiae consequuntur quo, deleniti ea
|
|
||||||
nihil.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<div class="is-flex is-align-items-center">
|
|
||||||
<div class="checkbox mr-6">
|
|
||||||
<input type="checkbox">
|
|
||||||
</div>
|
|
||||||
<div class="is-flex is-flex-direction-column is-align-items-start">
|
|
||||||
<p class="has-text-weight-semibold">
|
|
||||||
Senders Name Here
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
2022-11-20 13:30:00
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Message content here. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Corrupti doloremque voluptatum velit repellendus
|
|
||||||
ipsum delectus blanditiis quis dolores. Maxime labore esse
|
|
||||||
laboriosam inventore error molestiae consequuntur quo, deleniti ea
|
|
||||||
nihil.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="card-footer">
|
|
||||||
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Refresh
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Delete Selected
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="card">
|
<div class="is-flex is-align-items-center">
|
||||||
<div class="card-header">
|
<div class="checkbox mr-6">
|
||||||
<div class="card-header-title">
|
<input type="checkbox" />
|
||||||
Send SMS
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="card-content">
|
<div
|
||||||
<div class="fixed-grid has-5-cols has-1-cols-mobile">
|
class="is-flex is-flex-direction-column is-align-items-start"
|
||||||
<div class="grid">
|
>
|
||||||
<div class="cell is-col-span-1">
|
<p class="has-text-weight-semibold">
|
||||||
<div class="field">
|
Senders Name Here
|
||||||
<label class="label">Receipient's Phone Number</label>
|
</p>
|
||||||
<div class="control has-icons-left">
|
<p>2022-11-20 13:30:00</p>
|
||||||
<input class="input" type="text" placeholder="Input Phone Number">
|
<p>
|
||||||
<span class="icon is-small is-left">
|
Message content here. Lorem ipsum dolor sit amet
|
||||||
<i class="fas fa-user"></i>
|
consectetur adipisicing elit. Corrupti doloremque
|
||||||
</span>
|
voluptatum velit repellendus ipsum delectus
|
||||||
</div>
|
blanditiis quis dolores. Maxime labore esse
|
||||||
</div>
|
laboriosam inventore error molestiae consequuntur
|
||||||
</div>
|
quo, deleniti ea nihil.
|
||||||
|
</p>
|
||||||
<div class="cell is-col-span-5 is-col-span-1-mobile">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">Message</label>
|
|
||||||
<div class="control">
|
|
||||||
<textarea class="textarea" placeholder="Textarea"></textarea>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-footer">
|
|
||||||
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Send SMS
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="#" class="card-footer-item has-text-link has-text-weight-semibold has-text-white">
|
|
||||||
Reset
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="is-flex is-align-items-center">
|
||||||
|
<div class="checkbox mr-6">
|
||||||
|
<input type="checkbox" />
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="is-flex is-flex-direction-column is-align-items-start"
|
||||||
|
>
|
||||||
|
<p class="has-text-weight-semibold">
|
||||||
|
Senders Name Here
|
||||||
|
</p>
|
||||||
|
<p>2022-11-20 13:30:00</p>
|
||||||
|
<p>
|
||||||
|
Message content here. Lorem ipsum dolor sit amet
|
||||||
|
consectetur adipisicing elit. Corrupti doloremque
|
||||||
|
voluptatum velit repellendus ipsum delectus
|
||||||
|
blanditiis quis dolores. Maxime labore esse
|
||||||
|
laboriosam inventore error molestiae consequuntur
|
||||||
|
quo, deleniti ea nihil.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="is-flex is-align-items-center">
|
||||||
|
<div class="checkbox mr-6">
|
||||||
|
<input type="checkbox" />
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="is-flex is-flex-direction-column is-align-items-start"
|
||||||
|
>
|
||||||
|
<p class="has-text-weight-semibold">
|
||||||
|
Senders Name Here
|
||||||
|
</p>
|
||||||
|
<p>2022-11-20 13:30:00</p>
|
||||||
|
<p>
|
||||||
|
Message content here. Lorem ipsum dolor sit amet
|
||||||
|
consectetur adipisicing elit. Corrupti doloremque
|
||||||
|
voluptatum velit repellendus ipsum delectus
|
||||||
|
blanditiis quis dolores. Maxime labore esse
|
||||||
|
laboriosam inventore error molestiae consequuntur
|
||||||
|
quo, deleniti ea nihil.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="is-flex is-align-items-center">
|
||||||
|
<div class="checkbox mr-6">
|
||||||
|
<input type="checkbox" />
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="is-flex is-flex-direction-column is-align-items-start"
|
||||||
|
>
|
||||||
|
<p class="has-text-weight-semibold">
|
||||||
|
Senders Name Here
|
||||||
|
</p>
|
||||||
|
<p>2022-11-20 13:30:00</p>
|
||||||
|
<p>
|
||||||
|
Message content here. Lorem ipsum dolor sit amet
|
||||||
|
consectetur adipisicing elit. Corrupti doloremque
|
||||||
|
voluptatum velit repellendus ipsum delectus
|
||||||
|
blanditiis quis dolores. Maxime labore esse
|
||||||
|
laboriosam inventore error molestiae consequuntur
|
||||||
|
quo, deleniti ea nihil.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="is-flex is-align-items-center">
|
||||||
|
<div class="checkbox mr-6">
|
||||||
|
<input type="checkbox" />
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="is-flex is-flex-direction-column is-align-items-start"
|
||||||
|
>
|
||||||
|
<p class="has-text-weight-semibold">
|
||||||
|
Senders Name Here
|
||||||
|
</p>
|
||||||
|
<p>2022-11-20 13:30:00</p>
|
||||||
|
<p>
|
||||||
|
Message content here. Lorem ipsum dolor sit amet
|
||||||
|
consectetur adipisicing elit. Corrupti doloremque
|
||||||
|
voluptatum velit repellendus ipsum delectus
|
||||||
|
blanditiis quis dolores. Maxime labore esse
|
||||||
|
laboriosam inventore error molestiae consequuntur
|
||||||
|
quo, deleniti ea nihil.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="card-footer">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Refresh
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Delete Selected
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<div class="card-header-title">Send SMS</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="fixed-grid has-5-cols has-1-cols-mobile">
|
||||||
|
<div class="grid">
|
||||||
|
<div class="cell is-col-span-1">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">Receipient's Phone Number</label>
|
||||||
|
<div class="control has-icons-left">
|
||||||
|
<input
|
||||||
|
class="input"
|
||||||
|
type="text"
|
||||||
|
placeholder="Input Phone Number"
|
||||||
|
/>
|
||||||
|
<span class="icon is-small is-left">
|
||||||
|
<i class="fas fa-user"></i>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell is-col-span-5 is-col-span-1-mobile">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">Message</label>
|
||||||
|
<div class="control">
|
||||||
|
<textarea
|
||||||
|
class="textarea"
|
||||||
|
placeholder="Textarea"
|
||||||
|
></textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer">
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Send SMS
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
class="card-footer-item has-text-link has-text-weight-semibold has-text-white"
|
||||||
|
>
|
||||||
|
Reset
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer class="footer">
|
<footer class="footer">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="is-flex is-flex-direction-column is-align-items-center ">
|
<div class="is-flex is-flex-direction-column is-align-items-center">
|
||||||
<div class="has-text-centered">
|
<div class="has-text-centered">
|
||||||
<div class="icon-text">
|
<div class="icon-text">
|
||||||
<span class="icon has-text-info">
|
<span class="icon has-text-info">
|
||||||
<i class="fas fa-info-circle"></i>
|
<i class="fas fa-info-circle"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>Information</span>
|
<span>Information</span>
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="block has-text-weight-semibold">
|
|
||||||
This is an experimental feature and may cause an error in some cases.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<p class="block has-text-weight-semibold">
|
||||||
|
This is an experimental feature and may cause an error in some
|
||||||
|
cases.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
</body>
|
<div id="reboot-modal" class="modal">
|
||||||
|
<div class="modal-background"></div>
|
||||||
</html>
|
<div class="modal-card">
|
||||||
|
<section class="modal-card-body rounded-edge">
|
||||||
|
<p class="subtitle" id="modal-message">
|
||||||
|
Do you want to reboot the device?
|
||||||
|
</p>
|
||||||
|
<div id="loading-content" style="display: none">
|
||||||
|
<div class="custom-loader"></div>
|
||||||
|
<div class="countdown-text">
|
||||||
|
Rebooting... <span id="countdown">40</span>s
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="buttons" id="modal-buttons">
|
||||||
|
<button class="button is-warning" id="rebootModem">Reboot</button>
|
||||||
|
<button class="button cancel" aria-label="close">Cancel</button>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@@ -19,25 +19,16 @@ RAW_COMMAND=$(echo "$INPUT_DATA" | sed 's/command=//g')
|
|||||||
# URL-decode the command
|
# URL-decode the command
|
||||||
COMMAND=$(urldecode "$RAW_COMMAND")
|
COMMAND=$(urldecode "$RAW_COMMAND")
|
||||||
|
|
||||||
# Save the command input to a unique at_input file
|
|
||||||
AT_INPUT_FILE="/tmp/at_input_$$.txt"
|
|
||||||
echo "$COMMAND" > "$AT_INPUT_FILE"
|
|
||||||
|
|
||||||
# Define unique input/output files and AT port
|
# Define unique input/output files and AT port
|
||||||
INPUT_FILE="/tmp/input_$$.txt"
|
INPUT_FILE="/tmp/custom_input_$$.txt"
|
||||||
OUTPUT_FILE="/tmp/output_$$.txt"
|
OUTPUT_FILE="/tmp/custom_output_$$.txt"
|
||||||
AT_PORT="/dev/smd11"
|
AT_PORT="/dev/smd7"
|
||||||
|
|
||||||
# Ensure exclusive access to the AT port to avoid overloading smd11
|
# Write the command directly to the input file
|
||||||
(
|
echo "$COMMAND" > "$INPUT_FILE"
|
||||||
flock -x 200
|
|
||||||
|
|
||||||
# Copy the user input to the input file
|
# Run the command using atinout
|
||||||
cp "$AT_INPUT_FILE" "$INPUT_FILE"
|
atinout "$INPUT_FILE" "$AT_PORT" "$OUTPUT_FILE"
|
||||||
|
|
||||||
# Run the command using atinout
|
|
||||||
atinout "$INPUT_FILE" "$AT_PORT" "$OUTPUT_FILE"
|
|
||||||
) 200>/tmp/atinout.lock
|
|
||||||
|
|
||||||
# Read the output from output.txt
|
# Read the output from output.txt
|
||||||
OUTPUT=$(cat "$OUTPUT_FILE")
|
OUTPUT=$(cat "$OUTPUT_FILE")
|
||||||
@@ -58,4 +49,4 @@ echo "$JSON_RESPONSE" >> /tmp/cgi_debug.log
|
|||||||
echo "$JSON_RESPONSE"
|
echo "$JSON_RESPONSE"
|
||||||
|
|
||||||
# Clean up temporary files
|
# Clean up temporary files
|
||||||
rm "$AT_INPUT_FILE" "$INPUT_FILE" "$OUTPUT_FILE"
|
rm "$INPUT_FILE" "$OUTPUT_FILE"
|
||||||
@@ -15,7 +15,7 @@ INPUT_PASSWORD=$(echo "$POST_DATA" | sed -n 's/^.*password=\([^&]*\).*$/\1/p')
|
|||||||
INPUT_PASSWORD=$(echo "$INPUT_PASSWORD" | sed 's/+/ /g;s/%\(..\)/\\x\1/g' | xargs -0 printf "%b")
|
INPUT_PASSWORD=$(echo "$INPUT_PASSWORD" | sed 's/+/ /g;s/%\(..\)/\\x\1/g' | xargs -0 printf "%b")
|
||||||
|
|
||||||
# Log received password for debugging (remove in production)
|
# Log received password for debugging (remove in production)
|
||||||
echo "Received password: $INPUT_PASSWORD" >&2
|
# echo "Received password: $INPUT_PASSWORD" >&2
|
||||||
|
|
||||||
# Extract the hashed password from /etc/shadow for the specified user
|
# Extract the hashed password from /etc/shadow for the specified user
|
||||||
USER_SHADOW_ENTRY=$(grep "^$USER:" /etc/shadow)
|
USER_SHADOW_ENTRY=$(grep "^$USER:" /etc/shadow)
|
||||||
|
|||||||
@@ -1,11 +1,11 @@
|
|||||||
/* */
|
/* */
|
||||||
|
|
||||||
/* import Poppins font */
|
/* import Poppins font */
|
||||||
@import url('https://fonts.googleapis.com/css2?family=Euclid+Flex:wght@400;500;600;700&display=swap');
|
@import url("https://fonts.googleapis.com/css2?family=Euclid+Flex:wght@400;500;600;700&display=swap");
|
||||||
|
|
||||||
/* use Poppins everywhere */
|
/* use Poppins everywhere */
|
||||||
* {
|
* {
|
||||||
font-family: 'Poppins', sans-serif;
|
font-family: "Poppins", sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
html {
|
html {
|
||||||
@@ -64,4 +64,99 @@ html.theme-light {
|
|||||||
|
|
||||||
#dataConnState .tag {
|
#dataConnState .tag {
|
||||||
transition: all 0.3s ease-in-out;
|
transition: all 0.3s ease-in-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Add a bit of roundness on the corner */
|
||||||
|
.rounded-edge {
|
||||||
|
border-radius: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.command-history {
|
||||||
|
max-height: 300px;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
.loading {
|
||||||
|
opacity: 0.7;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
.history-item {
|
||||||
|
position: relative;
|
||||||
|
padding-right: 2rem;
|
||||||
|
}
|
||||||
|
.delete-history {
|
||||||
|
position: absolute;
|
||||||
|
top: 0.5rem;
|
||||||
|
right: 0.5rem;
|
||||||
|
cursor: pointer;
|
||||||
|
opacity: 0.7;
|
||||||
|
transition: opacity 0.2s;
|
||||||
|
}
|
||||||
|
.delete-history:hover {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
.command-text {
|
||||||
|
cursor: pointer;
|
||||||
|
color: #485fc7;
|
||||||
|
}
|
||||||
|
.command-text:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
.no-history {
|
||||||
|
padding: 1rem;
|
||||||
|
text-align: center;
|
||||||
|
color: #7a7a7a;
|
||||||
|
}
|
||||||
|
@keyframes fadeOut {
|
||||||
|
to {
|
||||||
|
opacity: 0;
|
||||||
|
height: 0;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fade-out {
|
||||||
|
animation: fadeOut 0.3s ease-out forwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
#cooldownTimer {
|
||||||
|
position: absolute;
|
||||||
|
right: 0.5rem;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
font-size: 0.8rem;
|
||||||
|
color: #666;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.countdown-text {
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 1rem;
|
||||||
|
margin-left: 1.5rem;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Center content in modal */
|
||||||
|
.modal-card-body {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
min-height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-loader {
|
||||||
|
width:50px;
|
||||||
|
height:50px;
|
||||||
|
--c:radial-gradient(farthest-side,#766DF4 92%,#0000);
|
||||||
|
background:
|
||||||
|
var(--c) 50% 0,
|
||||||
|
var(--c) 50% 100%,
|
||||||
|
var(--c) 100% 50%,
|
||||||
|
var(--c) 0 50%;
|
||||||
|
background-size:12px 12px;
|
||||||
|
background-repeat:no-repeat;
|
||||||
|
animation:s7 1s infinite;
|
||||||
|
}
|
||||||
|
@keyframes s7 {to{transform: rotate(.5turn)}}
|
||||||
|
|||||||
@@ -19,9 +19,12 @@
|
|||||||
crossorigin="anonymous"
|
crossorigin="anonymous"
|
||||||
></script>
|
></script>
|
||||||
|
|
||||||
<script src="js/styles/toggle-theme.js"></script>
|
|
||||||
<script src="/js/home/main.js"></script>
|
<script src="/js/home/main.js"></script>
|
||||||
|
<script src="js/styles/toggle-theme.js"></script>
|
||||||
<script src="/js/styles/nav-burger.js"></script>
|
<script src="/js/styles/nav-burger.js"></script>
|
||||||
|
<script src="/js/styles/modal-trigger.js"></script>
|
||||||
|
<script src="/js/utils/reboot.js"></script>
|
||||||
<script defer src="/js/auth/auth.js"></script>
|
<script defer src="/js/auth/auth.js"></script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
@@ -69,7 +72,14 @@
|
|||||||
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<a class="navbar-item" href="/advance-settings.html"> Advance </a>
|
<div class="navbar-item has-dropdown is-hoverable">
|
||||||
|
<a class="navbar-link"> Advance </a>
|
||||||
|
<div class="navbar-dropdown is-boxed">
|
||||||
|
<a class="navbar-item" href="/advance-settings.html"> Advance Settings </a>
|
||||||
|
<a class="navbar-item" href="#">Experimental Features</a>
|
||||||
|
<a class="navbar-item" href="/cgi-bin/luci">OpenWRT Luci</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<a class="navbar-item" href="/about.html"> About </a>
|
<a class="navbar-item" href="/about.html"> About </a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -89,11 +99,11 @@
|
|||||||
</p>
|
</p>
|
||||||
<div class="is-flex is-mobile is-align-items-center">
|
<div class="is-flex is-mobile is-align-items-center">
|
||||||
<p class="control">
|
<p class="control">
|
||||||
<a href="#" class="button is-warning is-outlined">
|
<div href="#" class="button is-warning is-outlined reboot-modal" data-target="reboot-modal" >
|
||||||
<span class="icon">
|
<span class="icon">
|
||||||
<i class="fas fa-power-off"></i>
|
<i class="fas fa-power-off"></i>
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</div>
|
||||||
</p>
|
</p>
|
||||||
<p class="control ml-2 is-mobile">
|
<p class="control ml-2 is-mobile">
|
||||||
<a
|
<a
|
||||||
@@ -463,5 +473,23 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
<div id="reboot-modal" class="modal">
|
||||||
|
<div class="modal-background"></div>
|
||||||
|
<div class="modal-card">
|
||||||
|
<section class="modal-card-body rounded-edge">
|
||||||
|
<p class="subtitle" id="modal-message">
|
||||||
|
Do you want to reboot the device?
|
||||||
|
</p>
|
||||||
|
<div id="loading-content" style="display: none;">
|
||||||
|
<div class="custom-loader"></div>
|
||||||
|
<div class="countdown-text">Rebooting... <span id="countdown">80</span>s</div>
|
||||||
|
</div>
|
||||||
|
<div class="buttons" id="modal-buttons">
|
||||||
|
<button class="button is-warning" id="rebootModem">Reboot</button>
|
||||||
|
<button class="button cancel" aria-label="close">Cancel</button>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
122
www/index.html
122
www/index.html
@@ -1,74 +1,86 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
<head>
|
||||||
<head>
|
<meta charset="UTF-8" />
|
||||||
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
|
|
||||||
<!-- Logo -->
|
<!-- Logo -->
|
||||||
<link rel="simpleadmin-logo" href="favicon.ico" />
|
<link rel="simpleadmin-logo" href="favicon.ico" />
|
||||||
|
|
||||||
<link rel="stylesheet" href="css/bulma/bulma.scss">
|
<link rel="stylesheet" href="css/bulma/bulma.scss" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.min.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.min.css" />
|
||||||
<link rel="stylesheet" href="css/bulma/css/bulma.css">
|
<link rel="stylesheet" href="css/bulma/css/bulma.css" />
|
||||||
<link rel="stylesheet" href="css/custom.css">
|
<link rel="stylesheet" href="css/custom.css" />
|
||||||
|
|
||||||
<script src="js/styles/toggle-theme.js"></script>
|
<script src="js/styles/toggle-theme.js"></script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
(function () {
|
(function () {
|
||||||
const savedTheme = localStorage.getItem('theme') || 'theme-dark';
|
const savedTheme = localStorage.getItem("theme") || "theme-dark";
|
||||||
document.documentElement.classList.add(savedTheme);
|
document.documentElement.classList.add(savedTheme);
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<title>Login</title>
|
<title>Login</title>
|
||||||
<script defer src="/js/auth/auth.js"></script>
|
<script defer src="/js/auth/auth.js"></script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div class="box container mt-6">
|
<div class="box container mt-6">
|
||||||
<div class="fixed-grid has-1-cols">
|
<div class="fixed-grid has-1-cols">
|
||||||
<div class="grid is-gap-5">
|
<div class="grid is-gap-5">
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<div class="field is-grouped">
|
<div class="field is-grouped">
|
||||||
<div class="control">
|
<div class="control">
|
||||||
<img src="/assets/logo.png" alt="Logo" class="image is-square image is-32x32">
|
<img
|
||||||
</div>
|
src="/assets/logo.png"
|
||||||
<div class="control">
|
alt="Logo"
|
||||||
<h1 class="title">
|
class="image is-square image is-32x32"
|
||||||
QuecManager Login
|
/>
|
||||||
</h1>
|
</div>
|
||||||
</div>
|
<div class="control">
|
||||||
</div>
|
<h1 class="title">QuecManager Login</h1>
|
||||||
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cell">
|
|
||||||
<form id="loginForm">
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">Username</label>
|
|
||||||
<div class="control">
|
|
||||||
<input class="input" id="username" type="text" required placeholder="Username" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="field">
|
|
||||||
<label class="label">Password</label>
|
|
||||||
<div class="control">
|
|
||||||
<input class="input" id="password" type="password" required placeholder="********" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<button class="button is-primary" type="submit">Sign in</button>
|
|
||||||
<p id="error" class="has-text-danger has-text-weight-semibold mt-2">
|
|
||||||
</p>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cell">
|
||||||
|
<form id="loginForm">
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">Username</label>
|
||||||
|
<div class="control">
|
||||||
|
<input
|
||||||
|
class="input"
|
||||||
|
id="username"
|
||||||
|
type="text"
|
||||||
|
required
|
||||||
|
placeholder="Username"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="field">
|
||||||
|
<label class="label">Password</label>
|
||||||
|
<div class="control">
|
||||||
|
<input
|
||||||
|
class="input"
|
||||||
|
id="password"
|
||||||
|
type="password"
|
||||||
|
required
|
||||||
|
placeholder="********"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button class="button is-primary" type="submit">Sign in</button>
|
||||||
|
<p
|
||||||
|
id="error"
|
||||||
|
class="has-text-danger has-text-weight-semibold mt-2"
|
||||||
|
></p>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</body>
|
||||||
</body>
|
</html>
|
||||||
|
|
||||||
</html>
|
|
||||||
|
|||||||
135
www/js/advance/at-terminal.js
Normal file
135
www/js/advance/at-terminal.js
Normal file
@@ -0,0 +1,135 @@
|
|||||||
|
document.addEventListener("DOMContentLoaded", function () {
|
||||||
|
const form = document.getElementById("commandForm");
|
||||||
|
const output = document.getElementById("output");
|
||||||
|
const commandInput = document.getElementById("command");
|
||||||
|
const sendButton = document.getElementById("sendButton");
|
||||||
|
const commandHistory = document.getElementById("commandHistory");
|
||||||
|
const noHistory = document.getElementById("noHistory");
|
||||||
|
const clearHistoryButton = document.getElementById("clearHistory");
|
||||||
|
const cooldownTimer = document.getElementById("cooldownTimer");
|
||||||
|
|
||||||
|
const COOLDOWN_DURATION = 1000; // 1 second cooldown
|
||||||
|
let isLoading = false;
|
||||||
|
let cooldownActive = false;
|
||||||
|
|
||||||
|
function setLoading(loading) {
|
||||||
|
isLoading = loading;
|
||||||
|
sendButton.classList.toggle("is-loading", loading);
|
||||||
|
form.classList.toggle("loading", loading);
|
||||||
|
}
|
||||||
|
|
||||||
|
function setCooldown() {
|
||||||
|
cooldownActive = true;
|
||||||
|
sendButton.classList.add("cooldown");
|
||||||
|
let timeLeft = COOLDOWN_DURATION;
|
||||||
|
|
||||||
|
function updateTimer() {
|
||||||
|
timeLeft -= 100;
|
||||||
|
if (timeLeft <= 0) {
|
||||||
|
cooldownActive = false;
|
||||||
|
sendButton.classList.remove("cooldown");
|
||||||
|
cooldownTimer.textContent = "";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
cooldownTimer.textContent = `${(timeLeft / 1000).toFixed(1)}s`;
|
||||||
|
setTimeout(updateTimer, 100);
|
||||||
|
}
|
||||||
|
|
||||||
|
updateTimer();
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateHistoryVisibility() {
|
||||||
|
const hasHistoryItems =
|
||||||
|
commandHistory.querySelectorAll(".history-item").length > 0;
|
||||||
|
noHistory.style.display = hasHistoryItems ? "none" : "block";
|
||||||
|
clearHistoryButton.style.display = hasHistoryItems ? "block" : "none";
|
||||||
|
}
|
||||||
|
|
||||||
|
function addToHistory(command, response) {
|
||||||
|
const historyItem = document.createElement("div");
|
||||||
|
historyItem.className = "box mb-2 history-item";
|
||||||
|
historyItem.innerHTML = `
|
||||||
|
<button class="delete delete-history" aria-label="delete"></button>
|
||||||
|
<strong class="command-text">${command}</strong>
|
||||||
|
<pre style="margin-top: 0.5rem; font-size: 0.85em; white-space: pre-wrap;">${response}</pre>
|
||||||
|
`;
|
||||||
|
|
||||||
|
historyItem
|
||||||
|
.querySelector(".command-text")
|
||||||
|
.addEventListener("click", () => {
|
||||||
|
commandInput.value = command;
|
||||||
|
commandInput.focus();
|
||||||
|
});
|
||||||
|
|
||||||
|
historyItem
|
||||||
|
.querySelector(".delete-history")
|
||||||
|
.addEventListener("click", (e) => {
|
||||||
|
e.stopPropagation();
|
||||||
|
historyItem.classList.add("fade-out");
|
||||||
|
setTimeout(() => {
|
||||||
|
historyItem.remove();
|
||||||
|
updateHistoryVisibility();
|
||||||
|
}, 300);
|
||||||
|
});
|
||||||
|
|
||||||
|
commandHistory.insertBefore(historyItem, commandHistory.firstChild);
|
||||||
|
updateHistoryVisibility();
|
||||||
|
}
|
||||||
|
|
||||||
|
clearHistoryButton.addEventListener("click", () => {
|
||||||
|
const historyItems = commandHistory.querySelectorAll(".history-item");
|
||||||
|
historyItems.forEach((item) => {
|
||||||
|
item.classList.add("fade-out");
|
||||||
|
});
|
||||||
|
setTimeout(() => {
|
||||||
|
commandHistory.innerHTML = "";
|
||||||
|
commandHistory.appendChild(noHistory);
|
||||||
|
updateHistoryVisibility();
|
||||||
|
}, 300);
|
||||||
|
});
|
||||||
|
|
||||||
|
async function sendCommand(command) {
|
||||||
|
try {
|
||||||
|
setLoading(true);
|
||||||
|
const response = await fetch("/cgi-bin/atinout_handler.sh", {
|
||||||
|
method: "POST",
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/x-www-form-urlencoded",
|
||||||
|
},
|
||||||
|
body: `command=${encodeURIComponent(command)}`,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!response.ok) {
|
||||||
|
throw new Error(`HTTP error! status: ${response.status}`);
|
||||||
|
}
|
||||||
|
|
||||||
|
const data = await response.json();
|
||||||
|
output.value = data.output || "No response received";
|
||||||
|
addToHistory(command, data.output || "No response received");
|
||||||
|
setCooldown();
|
||||||
|
} catch (error) {
|
||||||
|
const errorMessage = `Error: ${error.message}\n\nTroubleshooting steps:\n1. Check if the device is connected\n2. Verify AT port settings\n3. Ensure atinout utility is installed`;
|
||||||
|
output.value = errorMessage;
|
||||||
|
addToHistory(command, errorMessage);
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
form.addEventListener("submit", async function (e) {
|
||||||
|
e.preventDefault();
|
||||||
|
if (isLoading || cooldownActive) return;
|
||||||
|
|
||||||
|
const command = commandInput.value.trim();
|
||||||
|
if (!command) {
|
||||||
|
output.value = "Please enter a command";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
await sendCommand(command);
|
||||||
|
commandInput.value = "";
|
||||||
|
});
|
||||||
|
|
||||||
|
// Initialize visibility
|
||||||
|
updateHistoryVisibility();
|
||||||
|
});
|
||||||
@@ -1,108 +1,205 @@
|
|||||||
document.addEventListener("DOMContentLoaded", () => {
|
class AuthManager {
|
||||||
// Function to generate a random token
|
constructor() {
|
||||||
function generateAuthToken(length = 32) {
|
this.protectedPages = new Set([
|
||||||
const charset =
|
'/home.html',
|
||||||
"abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
|
'/advance-settings.html',
|
||||||
let token = "";
|
'/bandlock.html',
|
||||||
for (let i = 0; i < length; i++) {
|
'/cell-locking.html',
|
||||||
const randomIndex = Math.floor(Math.random() * charset.length);
|
'/cell-scanner.html',
|
||||||
token += charset[randomIndex];
|
'/cell-settings.html',
|
||||||
|
'/cell-sms.html',
|
||||||
|
'/about.html'
|
||||||
|
]);
|
||||||
|
|
||||||
|
// Session timeout in milliseconds (e.g., 30 minutes)
|
||||||
|
this.sessionTimeout = 30 * 60 * 1000;
|
||||||
|
|
||||||
|
this.init();
|
||||||
|
}
|
||||||
|
|
||||||
|
init() {
|
||||||
|
// Initially hide the body to prevent content flashing
|
||||||
|
document.body.style.display = 'none';
|
||||||
|
|
||||||
|
// Check authentication state
|
||||||
|
this.checkAuthState();
|
||||||
|
|
||||||
|
// Set up event listeners
|
||||||
|
this.setupEventListeners();
|
||||||
|
|
||||||
|
// Show body after auth check
|
||||||
|
document.body.style.display = '';
|
||||||
|
}
|
||||||
|
|
||||||
|
generateAuthToken(length = 32) {
|
||||||
|
const charset = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';
|
||||||
|
return Array.from(crypto.getRandomValues(new Uint8Array(length)))
|
||||||
|
.map(x => charset[x % charset.length])
|
||||||
|
.join('');
|
||||||
|
}
|
||||||
|
|
||||||
|
isProtectedPage(path) {
|
||||||
|
return this.protectedPages.has(path) ||
|
||||||
|
Array.from(this.protectedPages).some(page => path.includes(page));
|
||||||
|
}
|
||||||
|
|
||||||
|
getSessionData() {
|
||||||
|
const sessionStr = localStorage.getItem('session');
|
||||||
|
if (!sessionStr) return null;
|
||||||
|
|
||||||
|
try {
|
||||||
|
return JSON.parse(sessionStr);
|
||||||
|
} catch {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
setSessionData(token) {
|
||||||
|
const session = {
|
||||||
|
token,
|
||||||
|
lastActivity: Date.now(),
|
||||||
|
expiresAt: Date.now() + this.sessionTimeout
|
||||||
|
};
|
||||||
|
localStorage.setItem('session', JSON.stringify(session));
|
||||||
|
}
|
||||||
|
|
||||||
|
isSessionValid() {
|
||||||
|
const session = this.getSessionData();
|
||||||
|
if (!session) return false;
|
||||||
|
|
||||||
|
const now = Date.now();
|
||||||
|
|
||||||
|
// Check if session has expired
|
||||||
|
if (now > session.expiresAt) {
|
||||||
|
this.logout();
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Update last activity and extend session if needed
|
||||||
|
if (now - session.lastActivity > 5 * 60 * 1000) { // Update every 5 minutes
|
||||||
|
this.setSessionData(session.token);
|
||||||
|
}
|
||||||
|
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
checkAuthState() {
|
||||||
|
const currentPath = window.location.pathname;
|
||||||
|
const isAuthenticated = this.isSessionValid();
|
||||||
|
|
||||||
|
// Redirect logic
|
||||||
|
if (!isAuthenticated && this.isProtectedPage(currentPath)) {
|
||||||
|
window.location.href = '/index.html';
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (isAuthenticated && currentPath.includes('index.html')) {
|
||||||
|
window.location.href = '/home.html';
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
async login(username, password) {
|
||||||
|
try {
|
||||||
|
const formData = new URLSearchParams();
|
||||||
|
formData.append('username', username);
|
||||||
|
formData.append('password', encodeURIComponent(password));
|
||||||
|
|
||||||
|
const response = await fetch('/cgi-bin/auth.sh', {
|
||||||
|
method: 'POST',
|
||||||
|
body: formData,
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/x-www-form-urlencoded'
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const result = await response.json();
|
||||||
|
|
||||||
|
if (result.state === 'success') {
|
||||||
|
const token = this.generateAuthToken();
|
||||||
|
this.setSessionData(token);
|
||||||
|
window.location.href = '/home.html';
|
||||||
|
return true;
|
||||||
}
|
}
|
||||||
return token;
|
|
||||||
|
return false;
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Login error:', error);
|
||||||
|
throw new Error('An error occurred during login');
|
||||||
}
|
}
|
||||||
|
}
|
||||||
// Initially hide the body to prevent content from flashing
|
|
||||||
document.body.style.display = "none";
|
logout() {
|
||||||
|
localStorage.removeItem('session');
|
||||||
// Check if the user is already logged in
|
window.location.href = '/index.html';
|
||||||
const authToken = localStorage.getItem("authToken");
|
}
|
||||||
|
|
||||||
// Define which pages should be protected
|
setupEventListeners() {
|
||||||
const protectedPages = [
|
// Handle login form
|
||||||
"/home.html",
|
const loginForm = document.getElementById('loginForm');
|
||||||
"advance-settings.html",
|
|
||||||
"/bandlock.html",
|
|
||||||
"/cell-locking.html",
|
|
||||||
"/cell-scanner.html",
|
|
||||||
"/cell-settings.html",
|
|
||||||
"/cell-sms.html",
|
|
||||||
"/about.html", // Add all the protected HTML pages here
|
|
||||||
];
|
|
||||||
|
|
||||||
const currentPage = window.location.pathname;
|
|
||||||
|
|
||||||
// If the user is not logged in and tries to access a protected page, redirect to login
|
|
||||||
if (!authToken && protectedPages.includes(currentPage)) {
|
|
||||||
window.location.href = "index.html";
|
|
||||||
} else {
|
|
||||||
// Show the page if authentication is successful or not required
|
|
||||||
document.body.style.display = "";
|
|
||||||
}
|
|
||||||
|
|
||||||
// If the user is logged in and tries to access the login page, redirect to home
|
|
||||||
if (authToken && currentPage.includes("index.html")) {
|
|
||||||
window.location.href = "home.html";
|
|
||||||
}
|
|
||||||
|
|
||||||
// Login form logic (only for login page)
|
|
||||||
const loginForm = document.getElementById("loginForm");
|
|
||||||
if (loginForm) {
|
if (loginForm) {
|
||||||
loginForm.addEventListener("submit", async (e) => {
|
loginForm.addEventListener('submit', async (e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
const username = document.getElementById('username').value;
|
||||||
const username = document.getElementById("username").value;
|
const password = document.getElementById('password').value;
|
||||||
const password = document.getElementById("password").value;
|
const errorElement = document.getElementById('error');
|
||||||
const errorElement = document.getElementById("error");
|
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const formData = new URLSearchParams();
|
const success = await this.login(username, password);
|
||||||
formData.append("username", username);
|
if (!success) {
|
||||||
formData.append("password", encodeURIComponent(password)); // URL-encode the password
|
errorElement.textContent = 'Invalid username or password';
|
||||||
|
|
||||||
const response = await fetch("/cgi-bin/auth.sh", {
|
|
||||||
method: "POST",
|
|
||||||
body: formData,
|
|
||||||
headers: {
|
|
||||||
"Content-Type": "application/x-www-form-urlencoded",
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const result = await response.json(); // Parse JSON response
|
|
||||||
|
|
||||||
if (result.state === "success") {
|
|
||||||
const newToken = generateAuthToken();
|
|
||||||
localStorage.setItem("authToken", newToken); // Store the token
|
|
||||||
window.location.href = "home.html"; // Redirect on success
|
|
||||||
} else {
|
|
||||||
document.getElementById("error").textContent =
|
|
||||||
"Invalid username or password";
|
|
||||||
console.log("Invalid username or password");
|
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
// Handle any errors (e.g., network issues)
|
errorElement.textContent = error.message;
|
||||||
errorElement.textContent = "An error occurred. Please try again later.";
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Logout button logic (only for pages that have the logout button)
|
// Handle component loading
|
||||||
const logoutButton = document.getElementById("logoutButton");
|
window.addEventListener('componentLoaded', (event) => {
|
||||||
|
if (event.detail.componentId === 'nav-placeholder') {
|
||||||
|
this.setupNavbarHandlers();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Set up periodic session check
|
||||||
|
setInterval(() => {
|
||||||
|
if (this.isProtectedPage(window.location.pathname)) {
|
||||||
|
this.isSessionValid();
|
||||||
|
}
|
||||||
|
}, 60000); // Check every minute
|
||||||
|
}
|
||||||
|
|
||||||
|
setupNavbarHandlers() {
|
||||||
|
// Handle logout button
|
||||||
|
const logoutButton = document.getElementById('logoutButton');
|
||||||
if (logoutButton) {
|
if (logoutButton) {
|
||||||
logoutButton.addEventListener("click", () => {
|
logoutButton.addEventListener('click', (e) => {
|
||||||
localStorage.removeItem("authToken"); // Remove token
|
e.preventDefault();
|
||||||
window.location.href = "index.html"; // Redirect to login
|
this.logout();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Fix for the issue of being redirected to login every time the Home button is clicked
|
// Handle home navigation
|
||||||
document.querySelectorAll(".navbar-item").forEach((el) => {
|
const homeLinks = document.querySelectorAll('.navbar-item');
|
||||||
if (el.textContent.includes("Home")) {
|
homeLinks.forEach(link => {
|
||||||
el.addEventListener("click", (e) => {
|
if (link.textContent.trim() === 'Home') {
|
||||||
if (localStorage.getItem("authToken")) {
|
link.addEventListener('click', (e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
window.location.href = "home.html";
|
if (this.isSessionValid()) {
|
||||||
|
window.location.href = '/home.html';
|
||||||
|
} else {
|
||||||
|
window.location.href = '/index.html';
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initialize auth manager when DOM is loaded
|
||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
window.authManager = new AuthManager();
|
||||||
|
});
|
||||||
42
www/js/styles/modal-trigger.js
Normal file
42
www/js/styles/modal-trigger.js
Normal file
@@ -0,0 +1,42 @@
|
|||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
// Functions to open and close a modal
|
||||||
|
function openModal($el) {
|
||||||
|
$el.classList.add('is-active');
|
||||||
|
}
|
||||||
|
|
||||||
|
function closeModal($el) {
|
||||||
|
$el.classList.remove('is-active');
|
||||||
|
}
|
||||||
|
|
||||||
|
function closeAllModals() {
|
||||||
|
(document.querySelectorAll('.modal') || []).forEach(($modal) => {
|
||||||
|
closeModal($modal);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add a click event on buttons to open a specific modal
|
||||||
|
(document.querySelectorAll('.reboot-modal') || []).forEach(($trigger) => {
|
||||||
|
const modal = $trigger.dataset.target;
|
||||||
|
const $target = document.getElementById(modal);
|
||||||
|
|
||||||
|
$trigger.addEventListener('click', () => {
|
||||||
|
openModal($target);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Add a click event on various child elements to close the parent modal
|
||||||
|
(document.querySelectorAll('.modal-background, .modal-close, .modal-card-head .delete, .modal-card-body .cancel') || []).forEach(($close) => {
|
||||||
|
const $target = $close.closest('.modal');
|
||||||
|
|
||||||
|
$close.addEventListener('click', () => {
|
||||||
|
closeModal($target);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Add a keyboard event to close all modals
|
||||||
|
document.addEventListener('keydown', (event) => {
|
||||||
|
if(event.key === "Escape") {
|
||||||
|
closeAllModals();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
132
www/js/utils/reboot.js
Normal file
132
www/js/utils/reboot.js
Normal file
@@ -0,0 +1,132 @@
|
|||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
const modal = document.getElementById('reboot-modal');
|
||||||
|
const rebootButton = document.getElementById('rebootModem');
|
||||||
|
const cancelButtons = modal.querySelectorAll('.cancel, .modal-background');
|
||||||
|
const restartConnectionBtn = document.querySelector('a.button.is-link.is-outlined');
|
||||||
|
const modalMessage = document.getElementById('modal-message');
|
||||||
|
const loadingContent = document.getElementById('loading-content');
|
||||||
|
const modalButtons = document.getElementById('modal-buttons');
|
||||||
|
const countdownElement = document.getElementById('countdown');
|
||||||
|
|
||||||
|
let countdownInterval;
|
||||||
|
|
||||||
|
function toggleModal(show = true) {
|
||||||
|
modal.classList.toggle('is-active', show);
|
||||||
|
document.documentElement.classList.toggle('is-clipped', show);
|
||||||
|
|
||||||
|
// Reset modal content when closing
|
||||||
|
if (!show) {
|
||||||
|
modalMessage.style.display = 'block';
|
||||||
|
loadingContent.style.display = 'none';
|
||||||
|
modalButtons.style.display = 'flex';
|
||||||
|
if (countdownInterval) {
|
||||||
|
clearInterval(countdownInterval);
|
||||||
|
}
|
||||||
|
countdownElement.textContent = '80';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function startCountdown() {
|
||||||
|
let timeLeft = 80;
|
||||||
|
|
||||||
|
// Update display for countdown
|
||||||
|
modalMessage.style.display = 'none';
|
||||||
|
loadingContent.style.display = 'flex';
|
||||||
|
modalButtons.style.display = 'none';
|
||||||
|
|
||||||
|
countdownInterval = setInterval(() => {
|
||||||
|
timeLeft--;
|
||||||
|
countdownElement.textContent = timeLeft;
|
||||||
|
|
||||||
|
if (timeLeft <= 0) {
|
||||||
|
clearInterval(countdownInterval);
|
||||||
|
window.location.reload();
|
||||||
|
}
|
||||||
|
}, 1000);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Show modal when restart connection button is clicked
|
||||||
|
restartConnectionBtn.addEventListener('click', function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
toggleModal(true);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Hide modal when cancel or background is clicked
|
||||||
|
cancelButtons.forEach(button => {
|
||||||
|
button.addEventListener('click', () => toggleModal(false));
|
||||||
|
});
|
||||||
|
|
||||||
|
// Handle ESC key press
|
||||||
|
document.addEventListener('keydown', function(e) {
|
||||||
|
if (e.key === 'Escape' && modal.classList.contains('is-active')) {
|
||||||
|
toggleModal(false);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Function to send AT command
|
||||||
|
async function sendRebootCommand() {
|
||||||
|
try {
|
||||||
|
// Disable the reboot button and show loading state
|
||||||
|
rebootButton.classList.add('is-loading');
|
||||||
|
rebootButton.disabled = true;
|
||||||
|
|
||||||
|
const response = await fetch('/cgi-bin/atinout_handler.sh', {
|
||||||
|
method: 'POST',
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/x-www-form-urlencoded',
|
||||||
|
},
|
||||||
|
body: 'command=' + encodeURIComponent('AT+CFUN=1,1')
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!response.ok) {
|
||||||
|
throw new Error(`HTTP error! status: ${response.status}`);
|
||||||
|
}
|
||||||
|
|
||||||
|
const data = await response.json();
|
||||||
|
|
||||||
|
if (data.output && data.output.includes('OK')) {
|
||||||
|
startCountdown();
|
||||||
|
} else {
|
||||||
|
throw new Error('Reboot command failed');
|
||||||
|
}
|
||||||
|
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Error:', error);
|
||||||
|
toggleModal(false);
|
||||||
|
showNotification('Failed to reboot device. Please try again.', 'is-danger');
|
||||||
|
} finally {
|
||||||
|
// Re-enable the reboot button and remove loading state
|
||||||
|
rebootButton.classList.remove('is-loading');
|
||||||
|
rebootButton.disabled = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Function to show notification (for errors only now)
|
||||||
|
function showNotification(message, type = 'is-info') {
|
||||||
|
const notification = document.createElement('div');
|
||||||
|
notification.className = `notification ${type} is-light`;
|
||||||
|
notification.style.position = 'fixed';
|
||||||
|
notification.style.top = '1rem';
|
||||||
|
notification.style.right = '1rem';
|
||||||
|
notification.style.zIndex = '9999';
|
||||||
|
notification.style.maxWidth = '300px';
|
||||||
|
|
||||||
|
const deleteButton = document.createElement('button');
|
||||||
|
deleteButton.className = 'delete';
|
||||||
|
deleteButton.addEventListener('click', () => notification.remove());
|
||||||
|
|
||||||
|
notification.appendChild(deleteButton);
|
||||||
|
notification.appendChild(document.createTextNode(message));
|
||||||
|
|
||||||
|
document.body.appendChild(notification);
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
if (document.body.contains(notification)) {
|
||||||
|
notification.remove();
|
||||||
|
}
|
||||||
|
}, 5000);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Handle reboot button click
|
||||||
|
rebootButton.addEventListener('click', sendRebootCommand);
|
||||||
|
});
|
||||||
Reference in New Issue
Block a user