Upload files to "system/plugin/ui"
Signed-off-by: nestict <icttechnest@gmail.com>
This commit is contained in:
parent
21a5212120
commit
3a49bf9afa
559
system/plugin/ui/download.php
Normal file
559
system/plugin/ui/download.php
Normal file
@ -0,0 +1,559 @@
|
||||
<?php
|
||||
include '../../config.php';
|
||||
$mysqli = new mysqli($db_host, $db_user, $db_password, $db_name);
|
||||
|
||||
if ($mysqli->connect_error) {
|
||||
die("Connection failed: " . $mysqli->connect_error);
|
||||
}
|
||||
|
||||
// Function to get a setting value
|
||||
function getSettingValue($mysqli, $setting) {
|
||||
$query = $mysqli->prepare("SELECT value FROM tbl_appconfig WHERE setting = ?");
|
||||
$query->bind_param("s", $setting);
|
||||
$query->execute();
|
||||
$result = $query->get_result();
|
||||
if ($row = $result->fetch_assoc()) {
|
||||
return $row['value'];
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
// Fetch hotspot title and description from tbl_appconfig
|
||||
$hotspotTitle = getSettingValue($mysqli, 'hotspot_title');
|
||||
$description = getSettingValue($mysqli, 'description');
|
||||
$phone = getSettingValue($mysqli, 'phone');
|
||||
$company = getSettingValue($mysqli, 'CompanyName');
|
||||
|
||||
// Fetch settings
|
||||
$settings = [];
|
||||
$settings['frequently_asked_questions_headline1'] = getSettingValue($mysqli, 'frequently_asked_questions_headline1');
|
||||
$settings['frequently_asked_questions_answer1'] = getSettingValue($mysqli, 'frequently_asked_questions_answer1');
|
||||
$settings['frequently_asked_questions_headline2'] = getSettingValue($mysqli, 'frequently_asked_questions_headline2');
|
||||
$settings['frequently_asked_questions_answer2'] = getSettingValue($mysqli, 'frequently_asked_questions_answer2');
|
||||
$settings['frequently_asked_questions_headline3'] = getSettingValue($mysqli, 'frequently_asked_questions_headline3');
|
||||
$settings['frequently_asked_questions_answer3'] = getSettingValue($mysqli, 'frequently_asked_questions_answer3');
|
||||
|
||||
// Fetch router name and router ID from tbl_appconfig
|
||||
$routerName = getSettingValue($mysqli, 'router_name');
|
||||
$routerId = getSettingValue($mysqli, 'router_id');
|
||||
|
||||
// Fetch available plans
|
||||
$planQuery = "SELECT id, name_plan, price, validity, validity_unit FROM tbl_plans WHERE routers = ? AND type = 'Hotspot'";
|
||||
$planStmt = $mysqli->prepare($planQuery);
|
||||
$planStmt->bind_param("s", $routerName);
|
||||
$planStmt->execute();
|
||||
$planResult = $planStmt->get_result();
|
||||
|
||||
// Initialize HTML content variable
|
||||
$htmlContent = "<!DOCTYPE html>\n";
|
||||
$htmlContent .= "<html lang=\"en\">\n";
|
||||
$htmlContent .= "<head>\n";
|
||||
$htmlContent .= " <meta charset=\"UTF-8\">\n";
|
||||
$htmlContent .= " <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n";
|
||||
$htmlContent .= " <title>" . htmlspecialchars($hotspotTitle) . " Hotspot Template - Index</title>\n";
|
||||
$htmlContent .= " <script src=\"https://cdn.tailwindcss.com\"></script>\n";
|
||||
$htmlContent .= " <link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css\">\n";
|
||||
$htmlContent .= " <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/glider-js@1.7.7/glider.min.css\" />\n";
|
||||
$htmlContent .= " <script src=\"https://cdn.jsdelivr.net/npm/glider-js@1.7.7/glider.min.js\"></script>\n";
|
||||
$htmlContent .= " <link rel=\"preconnect\" href=\"https://cdn.jsdelivr.net\">\n";
|
||||
$htmlContent .= " <link rel=\"preconnect\" href=\"https://cdnjs.cloudflare.com\" crossorigin>\n";
|
||||
$htmlContent .= " <link rel=\"stylesheet\" type=\"text/css\" href=\"styles.css\">\n";
|
||||
$htmlContent .= "</head>\n";
|
||||
|
||||
|
||||
$htmlContent .= "<body class=\"font-sans antialiased text-gray-900\">\n";
|
||||
$htmlContent .= " <!-- Sticky Header -->\n";
|
||||
$htmlContent .= " <header class=\"bg-pink-600 text-white fixed w-full z-10\">\n";
|
||||
$htmlContent .= " <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-5\">\n";
|
||||
$htmlContent .= " <div class=\"flex items-center justify-between h-16\">\n";
|
||||
$htmlContent .= " <!-- Logo and title area -->\n";
|
||||
$htmlContent .= " <div class=\"flex items-center\">\n";
|
||||
$htmlContent .= " <img src=\"logo.png\" alt=\"Your Company Logo\" class=\"h-8 w-8 mr-2\">\n";
|
||||
$htmlContent .= " <h1 class=\"text-xl font-bold\">" . htmlspecialchars($hotspotTitle) . " Hotspot Login Page</h1>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " <!-- Navigation Links -->\n";
|
||||
$htmlContent .= " <div class=\"block\">\n";
|
||||
$htmlContent .= " <div class=\"ml-10 flex items-baseline space-x-4\">\n";
|
||||
$htmlContent .= " <a href=\"#\" class=\"text-teal-200 hover:text-white px-3 py-2 rounded-md text-sm font-medium\">Already Have an Account? Login</a>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </header>\n";
|
||||
|
||||
|
||||
|
||||
$htmlContent .= " <!-- Main content -->\n";
|
||||
$htmlContent .= " <main class=\"pt-24\">\n";
|
||||
$htmlContent .= " <section class=\"bg-white\">\n";
|
||||
$htmlContent .= " <div class=\"max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8\">\n";
|
||||
$htmlContent .= " <h2 class=\"text-3xl font-extrabold text-gray-900 mb-6\">" . htmlspecialchars($description) . "</h2>\n";
|
||||
$htmlContent .= " <!-- Pricing Section -->\n";
|
||||
$htmlContent .= " <div class=\"mt-10\">\n";
|
||||
$htmlContent .= " <div class=\"text-center\">\n";
|
||||
$htmlContent .= " <h3 class=\"text-2xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-3xl sm:leading-9\">\n";
|
||||
$htmlContent .= " CHECK OUR PRICING\n";
|
||||
$htmlContent .= " </h3>\n";
|
||||
$htmlContent .= " <p class=\"mt-4 max-w-2xl text-xl leading-7 text-gray-500 lg:mx-auto\">\n";
|
||||
$htmlContent .= " Choose the plan that fits your needs.\n";
|
||||
$htmlContent .= " </p>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </section>\n";
|
||||
$htmlContent .= " </main>\n";
|
||||
|
||||
|
||||
|
||||
$htmlContent .= "<div class=\"mt-10 max-w-7xl mx-auto grid grid-cols-2 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-4 gap-5\">\n";
|
||||
|
||||
while ($plan = $planResult->fetch_assoc()) {
|
||||
$htmlContent .= " <div class=\"flex flex-col rounded-lg shadow-xl overflow-hidden transform transition duration-500 hover:scale-105\">\n";
|
||||
$htmlContent .= " <div class=\"px-4 py-5 bg-gradient-to-tr from-pink-50 to-pink-200 text-center\">\n";
|
||||
$htmlContent .= " <span class=\"inline-flex px-3 py-1 rounded-full text-xs font-semibold tracking-wide uppercase bg-pink-800 text-pink-50\">\n";
|
||||
$htmlContent .= htmlspecialchars($plan['name_plan']) . "\n";
|
||||
$htmlContent .= " </span>\n";
|
||||
$htmlContent .= " <div class=\"mt-4 text-4xl leading-none font-extrabold text-pink-800\">\n";
|
||||
$htmlContent .= " <span class=\"text-lg font-medium text-pink-600\">ksh</span>\n";
|
||||
$htmlContent .= htmlspecialchars($plan['price']) . "\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " <p class=\"mt-2 text-md leading-5 text-pink-700 text-center\">\n";
|
||||
$htmlContent .= htmlspecialchars($plan['validity']) . " " . htmlspecialchars($plan['validity_unit']) . " Unlimited\n";
|
||||
$htmlContent .= " </p>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " <div class=\"px-4 pt-4 pb-6 bg-pink-500 text-center\">\n";
|
||||
$htmlContent .= " <a href=\"#\" class=\"inline-block text-pink-800 bg-pink-50 hover:bg-pink-100 focus:outline-none focus:ring-4 focus:ring-pink-500 focus:ring-opacity-50 transform transition duration-150 ease-in-out rounded-lg font-semibold px-3 py-2 text-xs shadow-lg cursor-pointer\"\n";
|
||||
$htmlContent .= " onclick=\"handlePhoneNumberSubmission(this.getAttribute('data-plan-id'), this.getAttribute('data-router-id')); return false;\" data-plan-id=\"" . $plan['id'] . "\" data-router-id=\"" . $routerId . "\">\n";
|
||||
$htmlContent .= " Click Here To Connect\n";
|
||||
$htmlContent .= " </a>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
}
|
||||
|
||||
$htmlContent .= "</div>\n";
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
$htmlContent .= "<!-- Testimonials Section -->\n";
|
||||
$htmlContent .= "<div class=\"mt-10 mx-auto px-4 sm:px-6 lg:px-8\">\n";
|
||||
$htmlContent .= " <h3 class=\"text-center text-2xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-3xl sm:leading-9\">\n";
|
||||
$htmlContent .= " What Our Users Say\n";
|
||||
$htmlContent .= " </h3>\n";
|
||||
$htmlContent .= " <div class=\"glider-contain mt-6\">\n";
|
||||
$htmlContent .= " <div class=\"glider\">\n";
|
||||
// Testimonial 1
|
||||
$htmlContent .= " <div class=\"bg-white rounded-lg shadow-md overflow-hidden\">\n";
|
||||
$htmlContent .= " <img class=\"w-full h-48 object-cover object-center\" src=\"assets/img/testimonials/testimonials-3.jpg\" alt=\"Testimonial from Otieno Peter\">\n";
|
||||
$htmlContent .= " <div class=\"p-4\">\n";
|
||||
$htmlContent .= " <div class=\"uppercase tracking-wide text-sm text-indigo-500 font-semibold\">Otieno Peter</div>\n";
|
||||
$htmlContent .= " <p class=\"mt-2 text-gray-500\">\"Switching to this service has been a game changer for me. The connection is reliable and fast, making my online work seamless and efficient.\"</p>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
// Testimonial 2
|
||||
$htmlContent .= " <div class=\"bg-white rounded-lg shadow-md overflow-hidden\">\n";
|
||||
$htmlContent .= " <img class=\"w-full h-48 object-cover object-center\" src=\"assets/img/testimonials/testimonials-2.jpg\" alt=\"Testimonial from Kiveu\">\n";
|
||||
$htmlContent .= " <div class=\"p-4\">\n";
|
||||
$htmlContent .= " <div class=\"uppercase tracking-wide text-sm text-indigo-500 font-semibold\">Kiveu</div>\n";
|
||||
$htmlContent .= " <p class=\"mt-2 text-gray-500\">\"I've experienced unparalleled support and service. The team goes above and beyond to ensure customer satisfaction. Highly recommend!\"</p>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
// Testimonial 3
|
||||
$htmlContent .= " <div class=\"bg-white rounded-lg shadow-md overflow-hidden\">\n";
|
||||
$htmlContent .= " <img class=\"w-full h-48 object-cover object-center\" src=\"assets/img/testimonials/testimonials-1.jpg\" alt=\"Testimonial from Anonymous User\">\n";
|
||||
$htmlContent .= " <div class=\"p-4\">\n";
|
||||
$htmlContent .= " <div class=\"uppercase tracking-wide text-sm text-indigo-500 font-semibold\">Anonymous User</div>\n";
|
||||
$htmlContent .= " <p class=\"mt-2 text-gray-500\">\"Their commitment to quality and speed is evident. My internet experience has been fantastic ever since I made the switch.\"</p>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " <!-- Add Arrows -->\n";
|
||||
$htmlContent .= " <button aria-label=\"Previous\" class=\"glider-prev\">«</button>\n";
|
||||
$htmlContent .= " <button aria-label=\"Next\" class=\"glider-next\">»</button>\n";
|
||||
$htmlContent .= " <div role=\"tablist\" class=\"dots\"></div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= "</div>\n";
|
||||
|
||||
// Glider.js script for the Testimonials Section
|
||||
$htmlContent .= "<script>\n";
|
||||
$htmlContent .= " new Glider(document.querySelector('.glider'), {\n";
|
||||
$htmlContent .= " slidesToShow: 1,\n";
|
||||
$htmlContent .= " slidesToScroll: 1,\n";
|
||||
$htmlContent .= " draggable: true,\n";
|
||||
$htmlContent .= " dots: '.dots',\n";
|
||||
$htmlContent .= " arrows: {\n";
|
||||
$htmlContent .= " prev: '.glider-prev',\n";
|
||||
$htmlContent .= " next: '.glider-next'\n";
|
||||
$htmlContent .= " },\n";
|
||||
$htmlContent .= " responsive: [\n";
|
||||
$htmlContent .= " {\n";
|
||||
$htmlContent .= " breakpoint: 775,\n";
|
||||
$htmlContent .= " settings: {\n";
|
||||
$htmlContent .= " slidesToShow: 2,\n";
|
||||
$htmlContent .= " slidesToScroll: 2,\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= " },\n";
|
||||
$htmlContent .= " {\n";
|
||||
$htmlContent .= " breakpoint: 1024,\n";
|
||||
$htmlContent .= " settings: {\n";
|
||||
$htmlContent .= " slidesToShow: 3,\n";
|
||||
$htmlContent .= " slidesToScroll: 3,\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= " ]\n";
|
||||
$htmlContent .= " });\n";
|
||||
$htmlContent .= "</script>\n";
|
||||
|
||||
|
||||
|
||||
|
||||
$htmlContent .= "<!-- FAQ Section -->\n";
|
||||
$htmlContent .= "<div class=\"mt-10 mx-auto px-4 sm:px-6 lg:px-8\">\n";
|
||||
$htmlContent .= " <div class=\"text-center\">\n";
|
||||
$htmlContent .= " <h3 class=\"text-2xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-3xl sm:leading-9\">\n";
|
||||
$htmlContent .= " FREQUENTLY ASKED QUESTIONS Will Be Here\n";
|
||||
$htmlContent .= " </h3>\n";
|
||||
$htmlContent .= " <p class=\"mt-4 max-w-2xl text-xl leading-7 text-gray-500 lg:mx-auto\">\n";
|
||||
$htmlContent .= " Everything you need to know before getting started.\n";
|
||||
$htmlContent .= " </p>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " <div class=\"mt-6\">\n";
|
||||
$htmlContent .= " <dl class=\"space-y-6\">\n";
|
||||
|
||||
// FAQ 1
|
||||
$htmlContent .= " <div class=\"bg-white rounded-lg shadow-md\">\n";
|
||||
$htmlContent .= " <dt class=\"p-4 cursor-pointer text-lg leading-6 font-medium text-gray-900\" onclick=\"toggleFAQ('faq1')\">" . htmlspecialchars($settings['frequently_asked_questions_headline1']) . "</dt>\n";
|
||||
$htmlContent .= " <dd id=\"faq1\" class=\"p-4 hidden text-base text-gray-500\">" . htmlspecialchars($settings['frequently_asked_questions_answer1']) . "</dd>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
|
||||
// FAQ 2
|
||||
$htmlContent .= " <div class=\"bg-white rounded-lg shadow-md\">\n";
|
||||
$htmlContent .= " <dt class=\"p-4 cursor-pointer text-lg leading-6 font-medium text-gray-900\" onclick=\"toggleFAQ('faq2')\">" . htmlspecialchars($settings['frequently_asked_questions_headline2']) . "</dt>\n";
|
||||
$htmlContent .= " <dd id=\"faq2\" class=\"p-4 hidden text-base text-gray-500\">" . htmlspecialchars($settings['frequently_asked_questions_answer2']) . "</dd>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
|
||||
// FAQ 3
|
||||
$htmlContent .= " <div class=\"bg-white rounded-lg shadow-md\">\n";
|
||||
$htmlContent .= " <dt class=\"p-4 cursor-pointer text-lg leading-6 font-medium text-gray-900\" onclick=\"toggleFAQ('faq3')\">" . htmlspecialchars($settings['frequently_asked_questions_headline3']) . "</dt>\n";
|
||||
$htmlContent .= " <dd id=\"faq3\" class=\"p-4 hidden text-base text-gray-500\">" . htmlspecialchars($settings['frequently_asked_questions_answer3']) . "</dd>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
|
||||
$htmlContent .= " </dl>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= "</div>\n";
|
||||
|
||||
|
||||
$htmlContent .= "<div class=\"container mx-auto px-4\">\n";
|
||||
$htmlContent .= " <div class=\"max-w-md mx-auto bg-white rounded-lg overflow-hidden md:max-w-lg\">\n";
|
||||
$htmlContent .= " <div class=\"md:flex\">\n";
|
||||
$htmlContent .= " <div class=\"w-full p-5\">\n";
|
||||
$htmlContent .= " <div class=\"text-center\">\n";
|
||||
$htmlContent .= " <h3 class=\"text-2xl text-gray-900\">Already Have an Active Package?</h3>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
|
||||
$htmlContent .= " <form id=\"loginForm\" class=\"form\" name=\"login\" action=\"$(link-login-only)\" method=\"post\" $(if chap-id)onSubmit=\"return doLogin()\"$(endif)>\n";
|
||||
$htmlContent .= " <input type=\"hidden\" name=\"dst\" value=\"$(link-orig)\" />\n";
|
||||
$htmlContent .= " <input type=\"hidden\" name=\"popup\" value=\"true\" />\n";
|
||||
$htmlContent .= " <div class=\"mb-4\">\n";
|
||||
$htmlContent .= " <label class=\"block text-gray-700 text-sm font-bold mb-2\" for=\"username\">Username</label>\n";
|
||||
$htmlContent .= " <input id=\"usernameInput\" class=\"shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline\" name=\"username\" type=\"text\" value=\"\" placeholder=\"Username\">\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " <div class=\"mb-6\">\n";
|
||||
$htmlContent .= " <label class=\"block text-gray-700 text-sm font-bold mb-2\" for=\"password\">Password</label>\n";
|
||||
$htmlContent .= " <input id=\"passwordInput\" class=\"shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 mb-3 leading-tight focus:outline-none focus:shadow-outline\" name=\"password\" type=\"password\" placeholder=\"******************\">\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " <div class=\"flex items-center justify-between\">\n";
|
||||
$htmlContent .= " <button id=\"submitBtn\" class=\"bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline\" type=\"button\">\n";
|
||||
$htmlContent .= " Click Here To Connect\n";
|
||||
$htmlContent .= " </button>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </form>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= "</div>\n";
|
||||
|
||||
$htmlContent .= "<script>\n";
|
||||
$htmlContent .= "document.addEventListener('DOMContentLoaded', function() {\n";
|
||||
$htmlContent .= " function autofillLogin() {\n";
|
||||
$htmlContent .= " var phoneNumber = '2547xxxxxxx';\n";
|
||||
$htmlContent .= " var password = '1234';\n";
|
||||
$htmlContent .= " document.querySelector('input[name=\"username\"]').value = phoneNumber;\n";
|
||||
$htmlContent .= " document.querySelector('input[name=\"password\"]').value = password;\n";
|
||||
$htmlContent .= " setTimeout(function() {\n";
|
||||
$htmlContent .= " document.querySelector('button[type=\"submit\"]').click();\n";
|
||||
$htmlContent .= " }, 15000);\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= " autofillLogin();\n";
|
||||
$htmlContent .= "});\n";
|
||||
$htmlContent .= "</script>\n";
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
$htmlContent .= "<script>\n";
|
||||
$htmlContent .= "function toggleFAQ(faqId) {\n";
|
||||
$htmlContent .= " var element = document.getElementById(faqId);\n";
|
||||
$htmlContent .= " if (element.style.display === \"block\") {\n";
|
||||
$htmlContent .= " element.style.display = \"none\";\n";
|
||||
$htmlContent .= " } else {\n";
|
||||
$htmlContent .= " element.style.display = \"block\";\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= "}\n";
|
||||
$htmlContent .= "</script>\n";
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
$htmlContent .= "</section>\n";
|
||||
$htmlContent .= "</main>\n";
|
||||
|
||||
$htmlContent .= "<!-- Footer -->\n";
|
||||
$htmlContent .= "<footer class=\"bg-blue-900 text-white\">\n";
|
||||
$htmlContent .= " <div class=\"max-w-7xl mx-auto px-4 py-12 sm:px-6 lg:px-8\">\n";
|
||||
$htmlContent .= " <div class=\"lg:grid lg:grid-cols-3 lg:gap-8\">\n";
|
||||
$htmlContent .= " <div class=\"lg:col-span-1\">\n";
|
||||
$htmlContent .= " <h2 class=\"text-sm font-semibold uppercase tracking-wider\">\n";
|
||||
$htmlContent .= " Contact Us\n";
|
||||
$htmlContent .= " </h2>\n";
|
||||
$htmlContent .= " <ul class=\"mt-4 space-y-4\">\n";
|
||||
$htmlContent .= " <li>\n";
|
||||
$htmlContent .= " <span class=\"block\">Address</span>\n";
|
||||
$htmlContent .= " </li>\n";
|
||||
$htmlContent .= " <li>\n";
|
||||
$htmlContent .= " <span class=\"block\">Email: contact@" . htmlspecialchars($company) . "</span>\n";
|
||||
$htmlContent .= " </li>\n";
|
||||
$htmlContent .= " <li>\n";
|
||||
$htmlContent .= " <span class=\"block\">Phone: " . htmlspecialchars($phone) . "</span>\n";
|
||||
$htmlContent .= " </li>\n";
|
||||
$htmlContent .= " </ul>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
|
||||
$htmlContent .= " <div class=\"lg:col-span-1\">\n";
|
||||
$htmlContent .= " <h2 class=\"text-sm font-semibold uppercase tracking-wider\">\n";
|
||||
$htmlContent .= " Quick Links\n";
|
||||
$htmlContent .= " </h2>\n";
|
||||
$htmlContent .= " <ul class=\"mt-4 space-y-4\">\n";
|
||||
$htmlContent .= " <li><a href=\"#\" class=\"hover:underline\">About Us</a></li>\n";
|
||||
$htmlContent .= " <li><a href=\"#\" class=\"hover:underline\">Our Services</a></li>\n";
|
||||
$htmlContent .= " <li><a href=\"#\" class=\"hover:underline\">FAQ</a></li>\n";
|
||||
$htmlContent .= " <li><a href=\"#\" class=\"hover:underline\">Support</a></li>\n";
|
||||
$htmlContent .= " </ul>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
|
||||
$htmlContent .= " <div class=\"lg:col-span-1\">\n";
|
||||
$htmlContent .= " <h2 class=\"text-sm font-semibold uppercase tracking-wider\">\n";
|
||||
$htmlContent .= " Follow Us\n";
|
||||
$htmlContent .= " </h2>\n";
|
||||
$htmlContent .= " <div class=\"mt-4 space-x-4\">\n";
|
||||
$htmlContent .= " <a href=\"#\" class=\"hover:text-gray-400\"><i class=\"fab fa-facebook-f\"></i></a>\n";
|
||||
$htmlContent .= " <a href=\"#\" class=\"hover:text-gray-400\"><i class=\"fab fa-twitter\"></i></a>\n";
|
||||
$htmlContent .= " <a href=\"#\" class=\"hover:text-gray-400\"><i class=\"fab fa-instagram\"></i></a>\n";
|
||||
$htmlContent .= " <a href=\"#\" class=\"hover:text-gray-400\"><i class=\"fab fa-linkedin-in\"></i></a>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
|
||||
$htmlContent .= " <div class=\"mt-8 border-t border-gray-700 pt-8 md:flex md:items-center md:justify-between\">\n";
|
||||
$htmlContent .= " <div class=\"flex space-x-6 md:order-2\">\n";
|
||||
$htmlContent .= " <a href=\"#\" class=\"text-gray-400 hover:text-gray-300\"><span class=\"sr-only\">Facebook</span><i class=\"fab fa-facebook-f\"></i></a>\n";
|
||||
$htmlContent .= " <a href=\"#\" class=\"text-gray-400 hover:text-gray-300\"><span class=\"sr-only\">Instagram</span><i class=\"fab fa-instagram\"></i></a>\n";
|
||||
$htmlContent .= " <a href=\"#\" class=\"text-gray-400 hover:text-gray-300\"><span class=\"sr-only\">Twitter</span><i class=\"fab fa-twitter\"></i></a>\n";
|
||||
$htmlContent .= " <a href=\"#\" class=\"text-gray-400 hover:text-gray-300\"><span class=\"sr-only\">LinkedIn</span><i class=\"fab fa-linkedin-in\"></i></a>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= "<p class=\"mt-8 text-base leading-6 text-gray-400 md:mt-0 md:order-1\">\n";
|
||||
$htmlContent .= " © 2024 " . htmlspecialchars($company) . " All rights reserved.\n";
|
||||
$htmlContent .= " </p>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= " </div>\n";
|
||||
$htmlContent .= "</footer>\n";
|
||||
|
||||
|
||||
$htmlContent .= "<script src=\"https://cdn.jsdelivr.net/npm/sweetalert2@11\"></script>\n";
|
||||
|
||||
$htmlContent .= "<script>\n";
|
||||
$htmlContent .= " function formatPhoneNumber(phoneNumber) {\n";
|
||||
$htmlContent .= " if (phoneNumber.startsWith('+')) {\n";
|
||||
$htmlContent .= " phoneNumber = phoneNumber.substring(1);\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= " if (phoneNumber.startsWith('0')) {\n";
|
||||
$htmlContent .= " phoneNumber = '254' + phoneNumber.substring(1);\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= " if (phoneNumber.match(/^(7|1)/)) {\n";
|
||||
$htmlContent .= " phoneNumber = '254' + phoneNumber;\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= " return phoneNumber;\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= "\n";
|
||||
$htmlContent .= " function handlePhoneNumberSubmission(planId, routerId) {\n";
|
||||
$htmlContent .= " Swal.fire({\n";
|
||||
$htmlContent .= " title: 'Enter Your Phone Number',\n";
|
||||
$htmlContent .= " input: 'text',\n";
|
||||
$htmlContent .= " inputPlaceholder: 'Your phone number here',\n";
|
||||
$htmlContent .= " inputAttributes: {\n";
|
||||
$htmlContent .= " autocapitalize: 'off'\n";
|
||||
$htmlContent .= " },\n";
|
||||
$htmlContent .= " showCancelButton: true,\n";
|
||||
$htmlContent .= " confirmButtonColor: '#3085d6',\n";
|
||||
$htmlContent .= " cancelButtonColor: '#d33',\n";
|
||||
$htmlContent .= " confirmButtonText: 'Submit',\n";
|
||||
$htmlContent .= " showLoaderOnConfirm: true,\n";
|
||||
$htmlContent .= " backdrop: `\n";
|
||||
$htmlContent .= " rgba(0,0,123,0.4)\n";
|
||||
$htmlContent .= " url(\"https://sweetalert2.github.io/images/nyan-cat.gif\")\n";
|
||||
$htmlContent .= " center left\n";
|
||||
$htmlContent .= " no-repeat\n";
|
||||
$htmlContent .= " `,\n";
|
||||
$htmlContent .= " preConfirm: (phoneNumber) => {\n";
|
||||
$htmlContent .= " var formattedPhoneNumber = formatPhoneNumber(phoneNumber);\n";
|
||||
$htmlContent .= " document.getElementById('usernameInput').value = formattedPhoneNumber;\n";
|
||||
$htmlContent .= " console.log(\"Phone number for autofill:\", formattedPhoneNumber);\n";
|
||||
$htmlContent .= "\n";
|
||||
$htmlContent .= " return fetch('" . APP_URL . "/index.php?_route=plugin/CreateHotspotuser&type=grant', {\n";
|
||||
$htmlContent .= " method: 'POST',\n";
|
||||
$htmlContent .= " headers: {'Content-Type': 'application/json'},\n";
|
||||
$htmlContent .= " body: JSON.stringify({phone_number: formattedPhoneNumber, plan_id: planId, router_id: routerId}),\n";
|
||||
$htmlContent .= " })\n";
|
||||
$htmlContent .= " .then(response => {\n";
|
||||
$htmlContent .= " if (!response.ok) throw new Error('Network response was not ok');\n";
|
||||
$htmlContent .= " return response.json();\n";
|
||||
$htmlContent .= " })\n";
|
||||
$htmlContent .= " .then(data => {\n";
|
||||
$htmlContent .= " if (data.status === 'error') throw new Error(data.message);\n";
|
||||
$htmlContent .= " Swal.fire({\n";
|
||||
$htmlContent .= " title: 'Connecting in 35 Secs...',\n";
|
||||
$htmlContent .= " html: `Remaining time is <b>\${formattedPhoneNumber}</b>.<br>A payment request has been sent to <b>\${formattedPhoneNumber}</b>. Dont click anything until you are connected. Still on this page after the timer ended? Scroll down and Click Login Now`,\n";
|
||||
$htmlContent .= " timer: 35000, // Adjusted for 35 seconds\n";
|
||||
$htmlContent .= " timerProgressBar: true,\n";
|
||||
$htmlContent .= " didOpen: () => {\n";
|
||||
$htmlContent .= " Swal.showLoading();\n";
|
||||
$htmlContent .= " const timer = Swal.getPopup().querySelector(\"b\");\n";
|
||||
$htmlContent .= " timerInterval = setInterval(() => {\n";
|
||||
$htmlContent .= " timer.textContent = `\${Swal.getTimerLeft()}`;\n";
|
||||
$htmlContent .= " }, 100);\n";
|
||||
$htmlContent .= " },\n";
|
||||
$htmlContent .= " willClose: () => {\n";
|
||||
$htmlContent .= " clearInterval(timerInterval);\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= " }).then((result) => {\n";
|
||||
$htmlContent .= " if (result.dismiss === Swal.DismissReason.timer) {\n";
|
||||
$htmlContent .= " console.log('I was closed by the timer');\n";
|
||||
$htmlContent .= " document.getElementById('submitBtn').click();\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= " });\n";
|
||||
$htmlContent .= " return formattedPhoneNumber; \n";
|
||||
$htmlContent .= " })\n";
|
||||
$htmlContent .= " .catch(error => {\n";
|
||||
$htmlContent .= " Swal.fire({\n";
|
||||
$htmlContent .= " icon: 'error',\n";
|
||||
$htmlContent .= " title: 'Oops...',\n";
|
||||
$htmlContent .= " text: error.message,\n";
|
||||
$htmlContent .= " });\n";
|
||||
$htmlContent .= " });\n";
|
||||
$htmlContent .= " },\n";
|
||||
$htmlContent .= " allowOutsideClick: () => !Swal.isLoading()\n";
|
||||
$htmlContent .= " });\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= "\n";
|
||||
$htmlContent .= " function FetchAjax(phoneNumber) {\n";
|
||||
$htmlContent .= " refreshData();\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= "\n";
|
||||
$htmlContent .= " function refreshData() {\n";
|
||||
$htmlContent .= " function refreshDataInternal() {\n";
|
||||
$htmlContent .= " $.ajax({\n";
|
||||
$htmlContent .= " url: '" . APP_URL . "/index.php?_route=plugin/CreateHotspotuser&type=verify',\n";
|
||||
$htmlContent .= " method: \"POST\",\n";
|
||||
$htmlContent .= " data: {phone_number: document.getElementById('usernameInput').value},\n";
|
||||
$htmlContent .= " dataType: \"json\",\n";
|
||||
$htmlContent .= " success: function(data) {\n";
|
||||
$htmlContent .= " // Response handling code\n";
|
||||
$htmlContent .= " },\n";
|
||||
$htmlContent .= " error: function(xhr, textStatus, errorThrown) {\n";
|
||||
$htmlContent .= " console.log(\"Error: \" + errorThrown);\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= " });\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= " var refreshInterval = setInterval(refreshDataInternal, 2000);\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= "\n";
|
||||
$htmlContent .= " document.addEventListener('DOMContentLoaded', function() {\n";
|
||||
$htmlContent .= " var submitBtn = document.getElementById('submitBtn');\n";
|
||||
$htmlContent .= " if (submitBtn) {\n";
|
||||
$htmlContent .= " submitBtn.addEventListener('click', function(event) {\n";
|
||||
$htmlContent .= " event.preventDefault();\n";
|
||||
$htmlContent .= " document.getElementById('loginForm').submit();\n";
|
||||
$htmlContent .= " });\n";
|
||||
$htmlContent .= " }\n";
|
||||
$htmlContent .= " });\n";
|
||||
$htmlContent .= "</script>\n";
|
||||
|
||||
|
||||
|
||||
$htmlContent .= "<script src=\"https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js\"></script>\n";
|
||||
|
||||
$htmlContent .= "<script>\n";
|
||||
$htmlContent .= "document.addEventListener('DOMContentLoaded', function() {\n";
|
||||
$htmlContent .= " // Ensure the button is correctly targeted by its ID.\n";
|
||||
$htmlContent .= " var submitBtn = document.getElementById('submitBtn');\n";
|
||||
$htmlContent .= " \n";
|
||||
$htmlContent .= " // Add a click event listener to the \"Login Now\" button.\n";
|
||||
$htmlContent .= " submitBtn.addEventListener('click', function(event) {\n";
|
||||
$htmlContent .= " event.preventDefault(); // Prevent the default button action.\n";
|
||||
$htmlContent .= " \n";
|
||||
$htmlContent .= " // Optional: Log to console for debugging purposes.\n";
|
||||
$htmlContent .= " console.log(\"Login Now button clicked.\");\n";
|
||||
$htmlContent .= " \n";
|
||||
$htmlContent .= " // Direct form submission, bypassing the doLogin function for simplicity.\n";
|
||||
$htmlContent .= " var form = document.getElementById('loginForm');\n";
|
||||
$htmlContent .= " form.submit(); // Submit the form directly.\n";
|
||||
$htmlContent .= " });\n";
|
||||
$htmlContent .= "});\n";
|
||||
$htmlContent .= "</script>\n";
|
||||
|
||||
|
||||
$htmlContent .= "</html>\n";
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
$planStmt->close();
|
||||
$mysqli->close();
|
||||
// Check if the download parameter is set
|
||||
if (isset($_GET['download']) && $_GET['download'] == '1') {
|
||||
// Prepare the HTML content for download
|
||||
// ... build your HTML content ...
|
||||
|
||||
// Specify the filename for the download
|
||||
$filename = "login.html";
|
||||
|
||||
// Send headers to force download
|
||||
header('Content-Type: application/octet-stream');
|
||||
header('Content-Disposition: attachment; filename='.basename($filename));
|
||||
header('Expires: 0');
|
||||
header('Cache-Control: must-revalidate');
|
||||
header('Pragma: public');
|
||||
header('Content-Length: ' . strlen($htmlContent));
|
||||
|
||||
// Output the content
|
||||
echo $htmlContent;
|
||||
|
||||
// Prevent any further output
|
||||
exit;
|
||||
}
|
||||
|
||||
// Regular page content goes here
|
||||
// ... HTML and PHP code to display the page ...
|
||||
|
||||
|
||||
117
system/plugin/ui/hotspot_settings.tpl
Normal file
117
system/plugin/ui/hotspot_settings.tpl
Normal file
@ -0,0 +1,117 @@
|
||||
{include file="sections/header.tpl"}
|
||||
<section class="content-header">
|
||||
<h1>
|
||||
<div class="btn-group">
|
||||
<button type="button" class="btn btn-success">
|
||||
Hotspot Settings
|
||||
</button>
|
||||
<button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">
|
||||
<span class="caret"></span>
|
||||
<span class="sr-only">Toggle Dropdown</span>
|
||||
</button>
|
||||
<ul class="dropdown-menu" role="menu">
|
||||
<li><a href="{$_url}plugin/hotspot_settings">{Lang::T('General Settings')}</a></li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="{$_url}plugin/captive_portal_login" target="_blank">Preview Hotspot Login Page</a></li>
|
||||
<li><a href="{$app_url}/system/plugin/download.php?download=1" target="_blank">Download Login Page</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</h1>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="{$app_url}/system/plugin/download.php?download=1"><i class="fa fa-dashboard"></i> Click Here To Download Login Page</a></li>
|
||||
<li class="active">Hotspot Settings</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<section class="content">
|
||||
<div class="table-responsive">
|
||||
<div class="nav-tabs-custom">
|
||||
<ul class="nav nav-tabs">
|
||||
<li class="active"><a href="#tab_1" data-toggle="tab">{Lang::T('General Settings')}</a></li>
|
||||
|
||||
</ul>
|
||||
<div class="tab-content">
|
||||
<div class="tab-pane active" id="tab_1" style="overflow-x:auto;">
|
||||
<div class="box-body no-padding" id="">
|
||||
<form method="POST" action="" enctype="multipart/form-data">
|
||||
<div class="box-body">
|
||||
|
||||
<div class="form-group">
|
||||
<label for="hotspot_title">Hotspot Page Title</label>
|
||||
<input type="text" class="form-control" name="hotspot_title" id="hotspot_title" value="{$hotspot_title}" required>
|
||||
<small class="form-text text-muted">In this field, you can enter the name of your ISP company. It will appear as the main title on the hotspot page.</small>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<label for="description">Brief Description Of Company/Tagline</label>
|
||||
<input type="text" class="form-control" name="description" id="description" value="{$description}" required>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<label for="router_name">Router Name:</label>
|
||||
<input type="text" class="form-control" name="router_name" id="router_name" value="{$router_name}" required>
|
||||
<small class="form-text text-muted">This is the most important part of the form. Go to Network and then Routers, and copy the exact router name.</small>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- FAQ fields -->
|
||||
<div class="form-group">
|
||||
<label for="frequently_asked_questions_headline1">FAQ Headline 1</label>
|
||||
<input type="text" class="form-control" name="frequently_asked_questions_headline1" id="frequently_asked_questions_headline1" value="{$frequently_asked_questions_headline1}" required>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="frequently_asked_questions_answer1">FAQ Answer 1</label>
|
||||
<textarea class="form-control" id="frequently_asked_questions_answer1" name="frequently_asked_questions_answer1" required>{$frequently_asked_questions_answer1}</textarea>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="frequently_asked_questions_headline2">FAQ Headline 2</label>
|
||||
<input type="text" class="form-control" id="frequently_asked_questions_headline2" name="frequently_asked_questions_headline2" value="{$frequently_asked_questions_headline2}" required>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="frequently_asked_questions_answer2">FAQ Answer 2</label>
|
||||
<textarea class="form-control" id="frequently_asked_questions_answer2" name="frequently_asked_questions_answer2" required>{$frequently_asked_questions_answer2}</textarea>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<label for="frequently_asked_questions_headline3">FAQ Headline 3</label>
|
||||
<input type="text" class="form-control" name="frequently_asked_questions_headline3" id="frequently_asked_questions_headline3" value="{$frequently_asked_questions_headline3}" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="frequently_asked_questions_answer3">FAQ Answer 3</label>
|
||||
<textarea class="form-control" id="frequently_asked_questions_answer3" name="frequently_asked_questions_answer3" required>{$frequently_asked_questions_answer3}</textarea>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Save Changes button -->
|
||||
|
||||
<button type="submit" class="btn btn-info pull-right">Save Changes</button>
|
||||
</form>
|
||||
|
||||
<div class="tab-pane" id="tab_6" style="overflow-x:auto;">
|
||||
<div class="box-body no-padding" id="">
|
||||
<!-- Content for Pages Settings tab -->
|
||||
This feature will be Coming Soon
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<pre><b>USAGE:</b>
|
||||
<br>Make sure you change this custom Settings and personalize them.
|
||||
<br>Then download the <strong style="color: black; background-color: yellow;">login.html</strong> by clicking on download login page.
|
||||
<br>Then upload the downloaded <strong style="color: black; background-color: yellow;">login.html</strong> file to your Mikrotik router.
|
||||
<br>Make sure you add your website URL in Mikrotik hotspot wall garden. <strong style="color: black; background-color: yellow;">login.html</strong>
|
||||
|
||||
</pre>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{include file="sections/footer.tpl"}
|
||||
BIN
system/plugin/ui/index.html
Normal file
BIN
system/plugin/ui/index.html
Normal file
Binary file not shown.
154
system/plugin/ui/log.tpl
Normal file
154
system/plugin/ui/log.tpl
Normal file
@ -0,0 +1,154 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Log UI</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
|
||||
</head>
|
||||
{include file="sections/header.tpl"}
|
||||
<body class="bg-gray-100 font-sans leading-normal tracking-normal">
|
||||
<div class="container mx-auto mt-8 bg-white rounded-lg shadow-lg p-6">
|
||||
<form class="mb-4" method="post" role="form" action="{$_url}plugin/log_ui">
|
||||
<ul class="nav nav-tabs flex border-b">
|
||||
{foreach $routers as $r}
|
||||
<li class="mr-1" role="presentation" {if $r['id']==$router}class="active"{/if}>
|
||||
<a class="bg-white inline-block py-2 px-4 text-blue-500 hover:text-blue-800 font-semibold" href="{$_url}plugin/log_ui/{$r['id']}">{$r['name']}</a>
|
||||
</li>
|
||||
{/foreach}
|
||||
</ul>
|
||||
</form>
|
||||
|
||||
<div class="flex flex-wrap mb-4">
|
||||
<div class="w-full md:w-8/12">
|
||||
<label class="block">
|
||||
Show entries
|
||||
<select name="data_length" aria-controls="data" class="form-control form-control-sm" onchange="updatePerPage(this.value)">
|
||||
<option value="5" {if $per_page == 5}selected{/if}>5</option>
|
||||
<option value="10" {if $per_page == 10}selected{/if}>10</option>
|
||||
<option value="25" {if $per_page == 25}selected{/if}>25</option>
|
||||
<option value="50" {if $per_page == 50}selected{/if}>50</option>
|
||||
<option value="100" {if $per_page == 100}selected{/if}>100</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
<div class="w-full md:w-4/12">
|
||||
<label class="block">
|
||||
Search:
|
||||
<input type="search" id="logSearch" class="form-control form-control-sm" placeholder="Search logs" aria-controls="data" onkeyup="filterLogs()">
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table class="min-w-full bg-white table-auto">
|
||||
<thead>
|
||||
<tr class="bg-gray-200">
|
||||
<th class="w-1/3 py-2 px-4">Time</th>
|
||||
<th class="w-1/3 py-2 px-4">Topic</th>
|
||||
<th class="w-1/3 py-2 px-4">Message</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="logTableBody">
|
||||
{assign var=current_page value=$smarty.get.page|default:1}
|
||||
{assign var=per_page value=$smarty.get.per_page|default:10}
|
||||
{assign var=start_index value=($current_page - 1) * $per_page}
|
||||
|
||||
{foreach from=$logs|array_reverse item=log name=logLoop}
|
||||
{if $smarty.foreach.logLoop.index >= $start_index && $smarty.foreach.logLoop.index < ($start_index + $per_page)}
|
||||
<tr class="log-entry">
|
||||
<td class="border px-4 py-2">{$log.time}</td>
|
||||
<td class="border px-4 py-2">{$log.topics}</td>
|
||||
<td class="border px-4 py-2 log-message">
|
||||
{if $log.message|lower|strpos:'failed' !== false}
|
||||
<span class="text-red-700 text-bold">{$log.message}</span>
|
||||
{elseif $log.message|lower|strpos:'trying' !== false}
|
||||
<span class="text-yellow-700">{$log.message}</span>
|
||||
{elseif $log.message|lower|strpos:'logged in' !== false}
|
||||
<span class="text-green-700">{$log.message}</span>
|
||||
{elseif $log.message|lower|strpos:'login failed' !== false}
|
||||
<span class="text-blue-700">{$log.message}</span>
|
||||
{else}
|
||||
<span class="text-gray-700">{$log.message}</span>
|
||||
{/if}
|
||||
</td>
|
||||
</tr>
|
||||
{/if}
|
||||
{/foreach}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
{assign var=total_logs value=$logs|@count}
|
||||
{assign var=last_page value=ceil($total_logs / $per_page)}
|
||||
|
||||
<nav class="mt-4">
|
||||
<ul class="pagination flex justify-center">
|
||||
{if $current_page > 1}
|
||||
<li>
|
||||
<a class="page-link border py-2 px-4 mx-1" href="index.php?_route=plugin/log_ui&page=1&per_page={$per_page}" aria-label="First">««</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="page-link border py-2 px-4 mx-1" href="index.php?_route=plugin/log_ui&page={$current_page-1}&per_page={$per_page}" aria-label="Previous">«</a>
|
||||
</li>
|
||||
{/if}
|
||||
|
||||
{assign var=max_links value=5}
|
||||
{assign var=start_page value=max(1, $current_page - floor($max_links / 2))}
|
||||
{assign var=end_page value=min($last_page, $start_page + $max_links - 1)}
|
||||
|
||||
{if $start_page > 1}
|
||||
<li>
|
||||
<a class="page-link border py-2 px-4 mx-1" href="index.php?_route=plugin/log_ui&page={$start_page-1}&per_page={$per_page}" aria-label="Previous">…</a>
|
||||
</li>
|
||||
{/if}
|
||||
|
||||
{foreach from=range($start_page, $end_page) item=page}
|
||||
<li>
|
||||
<a class="page-link border py-2 px-4 mx-1 {if $page == $current_page}bg-blue-500 text-white{/if}" href="index.php?_route=plugin/log_ui&page={$page}&per_page={$per_page}">{$page}</a>
|
||||
</li>
|
||||
{/foreach}
|
||||
|
||||
{if $end_page < $last_page}
|
||||
<li>
|
||||
<a class="page-link border py-2 px-4 mx-1" href="index.php?_route=plugin/log_ui&page={$end_page+1}&per_page={$per_page}" aria-label="Next">…</a>
|
||||
</li>
|
||||
{/if}
|
||||
|
||||
{if $current_page < $last_page}
|
||||
<li>
|
||||
<a class="page-link border py-2 px-4 mx-1" href="index.php?_route=plugin/log_ui&page={$current_page+1}&per_page={$per_page}" aria-label="Next">»</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="page-link border py-2 px-4 mx-1" href="index.php?_route=plugin/log_ui&page={$last_page}&per_page={$per_page}" aria-label="Last">»»</a>
|
||||
</li>
|
||||
{/if}
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function updatePerPage(value) {
|
||||
var urlParams = new URLSearchParams(window.location.search);
|
||||
urlParams.set('per_page', value);
|
||||
urlParams.set('page', 1); // Reset to first page
|
||||
window.location.search = urlParams.toString();
|
||||
}
|
||||
|
||||
function filterLogs() {
|
||||
var input = document.getElementById('logSearch').value.toLowerCase();
|
||||
var table = document.getElementById('logTableBody');
|
||||
var tr = table.getElementsByClassName('log-entry');
|
||||
|
||||
for (var i = 0; i < tr.length; i++) {
|
||||
var logMessage = tr[i].getElementsByClassName('log-message')[0].textContent || tr[i].getElementsByClassName('log-message')[0].innerText;
|
||||
if (logMessage.toLowerCase().indexOf(input) > -1) {
|
||||
tr[i].style.display = '';
|
||||
} else {
|
||||
tr[i].style.display = 'none';
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
{include file="sections/footer.tpl"}
|
||||
</body>
|
||||
</html>
|
||||
34
system/plugin/ui/port_tester.tpl
Normal file
34
system/plugin/ui/port_tester.tpl
Normal file
@ -0,0 +1,34 @@
|
||||
{include file="sections/header.tpl"}
|
||||
|
||||
<form class="form-horizontal" method="post" role="form" action="{$_url}plugin/port_tester">
|
||||
<div class="row">
|
||||
<div class="col-sm-12 col-md-12">
|
||||
<div class="panel panel-primary panel-hovered panel-stacked mb30">
|
||||
<div class="panel-heading">Testing port external</div>
|
||||
<div class="panel-body">
|
||||
<div class="form-group">
|
||||
<label class="col-md-2 control-label">Port</label>
|
||||
<div class="col-md-6">
|
||||
<input type="text" id="port" name="port" value="{$port}" placeholder="8728" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-lg-offset-2 col-lg-10">
|
||||
<button class="btn btn-success waves-effect waves-light" type="submit">Test It</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{if $result != ''}
|
||||
<div class="panel panel-primary panel-hovered panel-stacked mb30">
|
||||
<div class="panel-heading">Result</div>
|
||||
<div class="panel-body">
|
||||
{Lang::nl2br($result)}
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
{include file="sections/footer.tpl"}
|
||||
Loading…
x
Reference in New Issue
Block a user