added auth improvements and luci

This commit is contained in:
Russel Yasol
2024-10-03 05:48:00 +08:00
parent 661a3c3f44
commit 7d36748dce
16 changed files with 3059 additions and 2270 deletions

View File

@@ -1,268 +1,308 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<!-- Logo -->
<link rel="logo" href="favicon.ico" />
<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.css">
<link rel="stylesheet" href="css/custom.css">
<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.css" />
<link rel="stylesheet" href="css/custom.css" />
<!-- 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/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>
(function () {
const savedTheme = localStorage.getItem('theme') || 'theme-dark';
document.documentElement.classList.add(savedTheme);
})();
(function () {
const savedTheme = localStorage.getItem("theme") || "theme-dark";
document.documentElement.classList.add(savedTheme);
})();
</script>
<title>QuecManager</title>
</head>
</head>
<body class="body-margin">
<body class="body-margin">
<nav class="navbar is-transparent">
<div class="navbar-brand">
<a class="navbar-item" href="/">
<img src="/assets/logo.png" alt="Logo" />
<span class="title">QuecManager</span>
</a>
<a
role="button"
class="navbar-burger"
aria-label="menu"
aria-expanded="false"
data-target="navMenu"
>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navMenu" class="navbar-menu">
<div class="navbar-start ml-6">
<a class="navbar-item" href="/"> Home </a>
<div class="navbar-item has-dropdown is-hoverable">
<a class="navbar-link"> Cellular </a>
<div class="navbar-dropdown is-boxed">
<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-scanner.html">Cell Scanner</a>
<a class="navbar-item" href="/cell-settings.html"
>Cell Settings</a
>
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
</div>
<div class="navbar-brand">
<a class="navbar-item" href="/">
<img src="/assets/logo.png" alt="Logo" />
<span class="title">QuecManager</span>
</a>
<a
role="button"
class="navbar-burger"
aria-label="menu"
aria-expanded="false"
data-target="navMenu"
>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navMenu" class="navbar-menu">
<div class="navbar-start ml-6">
<a class="navbar-item has-text-weight-bold" href="/"> Home </a>
<div class="navbar-item has-dropdown is-hoverable">
<a class="navbar-link"> Cellular </a>
<div class="navbar-dropdown is-boxed">
<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-scanner.html">Cell Scanner</a>
<a class="navbar-item" href="/cell-settings.html"
>Cell Settings</a
>
<a class="navbar-item" href="/cell-sms.html"> Cell SMS </a>
</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 class="navbar-end">
<div class="navbar-item">
<div class="buttons is-flex-direction-column-mobile">
<p class="control is-expanded-mobile">
<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>
</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
href="#"
class="button is-link is-outlined is-fullwidth-mobile"
class="button is-warning is-outlined js-theme-toggle"
>
<span class="icon">
<i class="fas fa-arrows-rotate"></i>
<i class="fas fa-sun"></i>
</span>
<span>Restart Connection</span>
</a>
</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 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>
</nav>
<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>
</nav>
<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">
<div class="content has-text-centered">
<p>
<strong> <a href="https://github.com/iamromulan/quectel-rgmii-toolkit.git">QuecManager</a></strong>
version 1.0. All rights reserved.
</p>
</div>
<div class="content has-text-centered">
<p>
<strong>
<a href="https://github.com/iamromulan/quectel-rgmii-toolkit.git"
>QuecManager</a
></strong
>
version 1.0. All rights reserved.
</p>
</div>
</footer>
</body>
</html>
<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>