Upload files to "ui/ui"

Signed-off-by: kevin <kevin@codelab.nestict.africa>
This commit is contained in:
2026-01-16 12:17:31 +01:00
parent 7dd47efb75
commit b82d713fa4
100 changed files with 13701 additions and 0 deletions

BIN
ui/ui/.DS_Store vendored Normal file

Binary file not shown.

17
ui/ui/404.tpl Normal file
View File

@@ -0,0 +1,17 @@
{include file="sections/user-header.tpl"}
<div class="container-fluid">
<div class="col-xl-12 col-xxl-12">
<div class="col-md-12">
<div class="card" style="display: grid; align-content: center;">
<div class="card-body text-center ai-icon text-primary">
<i class="flaticon-381-error"></i>
<h4 class="my-2">404</h4>
<a href="{$_url}home" title="Go to Dashboard" class="btn my-2 btn-primary btn-lg px-4"><i
class="fa fa-usd"></i> Go to Dashboard</a>
</div>
</div>
</div>
</div>
</div>
</div>
{include file="sections/user-footer.tpl"}

54
ui/ui/a404.tpl Normal file
View File

@@ -0,0 +1,54 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="48x48" href="favicon-48x48.png">
<link rel="icon" type="image/png" sizes="64x64" href="favicon-64x64.png">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<title>Admin Dashboard</title>
<link rel="stylesheet" href="assets/vendor/chartist/css/chartist.min.css">
<link href="assets/vendor/bootstrap-select/dist/css/bootstrap-select.min.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet">
</head>
<body style="background-color:#e9ecef;">
<div class="" style="margin-top: 32px;">
<div class="container-fluid">
<div class="col-xl-12 col-xxl-12">
<div class="col-md-12">
<div class="card" style="display: grid; align-content: center;">
<div class="card-body text-center ai-icon text-primary">
<i class="flaticon-381-error"></i>
<h4 class="my-2">404</h4>
<a href="{$_url}dashboard" title="Go to Dashboard" class="btn my-2 btn-primary btn-lg px-4"><i
class="fa fa-usd"></i> Go to Dashboard</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="assets/vendor/global/global.min.js"></script>
<script src="assets/vendor/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="assets/vendor/chart.js/Chart.bundle.min.js"></script>
<!-- Chart piety plugin files -->
<script src="assets/vendor/peity/jquery.peity.min.js"></script>
<!-- Apex Chart -->
<script src="assets/vendor/apexchart/apexchart.js"></script>
<!-- Dashboard 1 -->
<script src="assets/js/dashboard/dashboard-1.js"></script>
<script src="assets/js/custom.min.js"></script>
<script src="assets/js/deznav-init.js"></script>
<script src="assets/js/demo.js"></script>
</body>
</html>

58
ui/ui/admin-login.tpl Normal file
View File

@@ -0,0 +1,58 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="48x48" href="favicon-48x48.png">
<link rel="icon" type="image/png" sizes="64x64" href="favicon-64x64.png">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<title>{Lang::T('Login')} - {$_c['CompanyName']}</title>
<link rel="stylesheet" href="ui/ui/Css/lineicons.min.css">
<link rel="stylesheet" href="ui/ui/Css/Style.css">
<meta http-equiv="refresh" content="{$time}; url={$url}">
</head>
<body>
<div class="login-div">
<div class="logo"></div>
<div class="title">{$_c['CompanyName']} - Admin</div>
{if isset($notify)}
{$notify}
{/if}
<form action="{$_url}admin/post" method="post">
<div class="login-in">
<div class="username">
<i class="lni lni-user"></i>
<input type="text" required class="form-control" name="username" placeholder="{Lang::T('Username')}">
</div>
<div class="password">
<i class="lni lni-lock"></i>
<input type="password" required class="form-control" name="password" placeholder="{Lang::T('Password')}">
</div>
</div>
<button type="submit" class="buttons" value="{Lang::T('Login')}">login</button>
</form>
</div>
<script src="assets/vendor/global/global.min.js"></script>
<script src="assets/vendor/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="assets/vendor/chart.js/Chart.bundle.min.js"></script>
<!-- Chart piety plugin files -->
<script src="assets/vendor/peity/jquery.peity.min.js"></script>
<!-- Apex Chart -->
<script src="assets/vendor/apexchart/apexchart.js"></script>
<!-- Dashboard 1 -->
<script src="assets/js/dashboard/dashboard-1.js"></script>
<script src="assets/js/custom.min.js"></script>
<script src="assets/js/deznav-init.js"></script>
<script src="assets/js/demo.js"></script>
</body>
</html>

75
ui/ui/alert.tpl Normal file
View File

@@ -0,0 +1,75 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="48x48" href="favicon-48x48.png">
<link rel="icon" type="image/png" sizes="64x64" href="favicon-64x64.png">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<title>{Lang::T('Login')} - {$_c['CompanyName']}</title>
<link rel="stylesheet" href="ui/ui/assets/vendor/chartist/css/chartist.min.css">
<link href="ui/ui/assets/vendor/bootstrap-select/dist/css/bootstrap-select.min.css" rel="stylesheet">
<link href="ui/ui/assets/css/style.css" rel="stylesheet">
<link rel="stylesheet" href="ui/ui/styles/sweetalert2.min.css" />
<link rel="stylesheet" href="ui/ui/styles/plugins/pace.css" />
<script src="ui/ui/scripts/sweetalert2.all.min.js"></script>
<meta http-equiv="refresh" content="{$time}; url={$url}">
</head>
<body style="background-color:#e9ecef;">
<div class="" style="margin-top: 72px;">
<div class="container-fluid">
<div class="col-xl-12 col-xxl-12">
<div class="col-md-12">
<div class="card" style="display: grid; align-content: center;">
<div class="card-body text-center ai-icon text-primary">
<h4 class="my-2">{ucwords(Lang::T($type))}</h4>
<div class="my-2">{$text}</div>
<a href="{$url}" id="button" class="btn my-2 btn-primary btn-lg px-4"><i
class="fa fa-usd"></i> {Lang::T('Click Here')} ({$time})</a>
<div class="lockscreen-footer text-center">
{$_c['CompanyName']}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
var time = {$time};
timer();
function timer() {
setTimeout(() => {
time--;
if (time > -1) {
document.getElementById("button").innerHTML = "{Lang::T('Click Here')} (" + time + ")";
timer();
}
}, 1000);
}
</script>
<script src="assets/vendor/global/global.min.js"></script>
<script src="assets/vendor/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="assets/vendor/chart.js/Chart.bundle.min.js"></script>
<!-- Chart piety plugin files -->
<script src="assets/vendor/peity/jquery.peity.min.js"></script>
<!-- Apex Chart -->
<script src="assets/vendor/apexchart/apexchart.js"></script>
<!-- Dashboard 1 -->
<script src="assets/js/dashboard/dashboard-1.js"></script>
<script src="assets/js/custom.min.js"></script>
<script src="assets/js/deznav-init.js"></script>
<script src="assets/js/demo.js"></script>
</body>
</html>

159
ui/ui/app-localisation.tpl Normal file
View File

@@ -0,0 +1,159 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-xxl-6 col-xxl-12">
<div class="col-md-12">
<div class="card">
<div class="card-header"
style="display: grid; align-content: center; justify-content: center;">
<h5 class="card-title">{Lang::T('Localisation')}</h5>
</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form"
action="{$_url}settings/localisation-post">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Timezone')}</label>
<div class="col-md-6">
<select name="tzone" id="tzone" class="form-control">
{foreach $tlist as $value => $label}
<option value="{$value}" {if $_c['timezone'] eq
$value}selected="selected" {/if}>
{$label}</option>
{/foreach}
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Date Format')}</label>
<div class="col-md-6">
<select class="form-control" name="date_format" id="date_format">
<option value="d/m/Y" {if $_c['date_format'] eq 'd/m/Y' }
selected="selected" {/if}>
{date('d/m/Y')}</option>
<option value="d.m.Y" {if $_c['date_format'] eq 'd.m.Y' }
selected="selected" {/if}>
{date('d.m.Y')}</option>
<option value="d-m-Y" {if $_c['date_format'] eq 'd-m-Y' }
selected="selected" {/if}>
{date('d-m-Y')}</option>
<option value="m/d/Y" {if $_c['date_format'] eq 'm/d/Y' }
selected="selected" {/if}>
{date('m/d/Y')}</option>
<option value="Y/m/d" {if $_c['date_format'] eq 'Y/m/d' }
selected="selected" {/if}>
{date('Y/m/d')}</option>
<option value="Y-m-d" {if $_c['date_format'] eq 'Y-m-d' }
selected="selected" {/if}>
{date('Y-m-d')}</option>
<option value="M d Y" {if $_c['date_format'] eq 'M d Y' }
selected="selected" {/if}>
{date('M d Y')}</option>
<option value="d M Y" {if $_c['date_format'] eq 'd M Y' }
selected="selected" {/if}>
{date('d M Y')}</option>
<option value="jS M y" {if $_c['date_format'] eq 'jS M y' }
selected="selected" {/if}>
{date('jS M y')}</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Default Language')}</label>
<div class="col-md-6">
<select class="form-control" name="lan" id="lan">
{foreach $lani as $lanis}
<option value="{$lanis@key}" {if $_c['language'] eq $lanis@key}
selected="selected" {/if}>
{$lanis@key}
</option>
{/foreach}
<option disabled>_________</option>
{foreach $lan as $lans}
<option value="{$lans@key}" {if $_c['language'] eq $lans@key}
selected="selected" {/if}>
{$lans@key}
</option>
{/foreach}
</select>
</div>
<div class="col-md-4 help-block">
<a href="{$_url}settings/language">{Lang::T('Language Editor')}</a>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Decimal Point')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="dec_point" name="dec_point"
value="{$_c['dec_point']}">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Thousands Separator')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="thousands_sep"
name="thousands_sep" value="{$_c['thousands_sep']}">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Currency Code')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="currency_code"
name="currency_code" value="{$_c['currency_code']}">
</div>
<span class="help-block col-md-4">{Lang::T('Keep it blank if you do not want to
show currency code')}</span>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Country Code Phone')}</label>
<div class="col-md-6">
<div class="input-group">
<span class="input-group-text" id="basic-addon1">+</span>
<input type="text" class="form-control" id="country_code_phone"
placeholder="62" name="country_code_phone"
value="{$_c['country_code_phone']}">
</div>
</div>
</div>
<hr>
<div class="form-group row">
<label class="col-md-2 control-label">Radius Plan</label>
<div class="col-md-6">
<input type="text" class="form-control" id="radius_plan" name="radius_plan"
value="{if $_c['radius_plan']==''}Radius Plan{else}{$_c['radius_plan']}{/if}">
</div>
<span class="help-block col-md-4">{Lang::T('Change title in user Plan
order')}</span>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Hotspot Plan</label>
<div class="col-md-6">
<input type="text" class="form-control" id="hotspot_plan"
name="hotspot_plan"
value="{if $_c['hotspot_plan']==''}Hotspot Plan{else}{$_c['hotspot_plan']}{/if}">
</div>
<span class="help-block col-md-4">{Lang::T('Change title in user Plan
order')}</span>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">PPPOE Plan</label>
<div class="col-md-6">
<input type="text" class="form-control" id="pppoe_plan" name="pppoe_plan"
value="{if $_c['pppoe_plan']==''}PPPOE Plan{else}{$_c['pppoe_plan']}{/if}">
</div>
<span class="help-block col-md-4">{Lang::T('Change title in user Plan
order')}</span>
</div>
<div class="form-group">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-primary" type="submit">{Lang::T('Save
Changes')}</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

478
ui/ui/app-notifications.tpl Normal file
View File

@@ -0,0 +1,478 @@
{include file="sections/header.tpl"}
<!-- Test Notification Modal -->
<div class="modal fade" id="testNotificationModal" tabindex="-1" role="dialog" aria-labelledby="testNotificationModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="testNotificationModalLabel">Test Notification</h4>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form id="testNotificationForm">
<div class="form-group">
<label for="testPhone">Phone Number</label>
<input type="text" class="form-control" id="testPhone" placeholder="Enter phone number for testing" required>
</div>
<div class="form-group">
<label for="testCustomerName">Customer Name</label>
<input type="text" class="form-control" id="testCustomerName" value="John Doe" placeholder="Customer name">
</div>
<div class="form-group">
<label for="testPackageName">Package Name</label>
<input type="text" class="form-control" id="testPackageName" value="Premium 10Mbps" placeholder="Package name">
</div>
<div class="form-group">
<label for="testPrice">Package Price</label>
<input type="text" class="form-control" id="testPrice" value="5000" placeholder="Package price">
</div>
<div class="form-group">
<label for="testNotificationType">Notification Type</label>
<select class="form-control" id="testNotificationType">
<option value="sms">SMS</option>
<option value="wa">WhatsApp</option>
</select>
</div>
<div class="form-group">
<label>Preview Message:</label>
<div id="messagePreview" class="alert alert-info" style="white-space: pre-wrap;"></div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" onclick="sendTestNotification()">Send Test</button>
</div>
</div>
</div>
</div>
<script>
let currentTestType = '';
let currentPlanType = '';
function testNotification(type, planType) {
currentTestType = type;
currentPlanType = planType;
// Update modal title
document.getElementById('testNotificationModalLabel').textContent =
'Test ' + type.replace('_', ' ').toUpperCase() + ' - ' + planType.toUpperCase();
// Show modal
$('#testNotificationModal').modal('show');
// Update preview
updateMessagePreview();
}
function updateMessagePreview() {
const customerName = document.getElementById('testCustomerName').value || 'John Doe';
const packageName = document.getElementById('testPackageName').value || 'Premium 10Mbps';
const price = document.getElementById('testPrice').value || '5000';
// Get the template from the form
let template = '';
if (currentTestType === 'expired') {
if (currentPlanType === 'hotspot') {
template = document.getElementById('expired_hotspot').value;
} else {
template = document.getElementById('expired_pppoe').value;
}
} else if (currentTestType === 'reminder_7_day') {
if (currentPlanType === 'hotspot') {
template = document.getElementById('reminder_7_day_hotspot').value;
} else {
template = document.getElementById('reminder_7_day_pppoe').value;
}
}
// Replace variables
let preview = template
.replace(/\[\[name\]\]/g, customerName)
.replace(/\[\[username\]\]/g, 'testuser')
.replace(/\[\[package\]\]/g, packageName)
.replace(/\[\[plan\]\]/g, packageName)
.replace(/\[\[price\]\]/g, price)
.replace(/\[\[plan_type\]\]/g, currentPlanType.toUpperCase())
.replace(/\[\[service_portal\]\]/g, 'https://portal.example.com')
.replace(/\[\[support_contact\]\]/g, 'support@example.com')
.replace(/\[\[expired_date\]\]/g, new Date().toLocaleDateString())
.replace(/\[\[bills\]\]/g, '');
document.getElementById('messagePreview').textContent = preview;
}
function sendTestNotification() {
const phone = document.getElementById('testPhone').value;
const customerName = document.getElementById('testCustomerName').value;
const packageName = document.getElementById('testPackageName').value;
const price = document.getElementById('testPrice').value;
const notificationType = document.getElementById('testNotificationType').value;
if (!phone) {
alert('Please enter a phone number');
return;
}
// Show loading
const sendBtn = document.querySelector('#testNotificationModal .btn-primary');
const originalText = sendBtn.textContent;
sendBtn.textContent = 'Sending...';
sendBtn.disabled = true;
// Send test notification
fetch('{$_url}settings/test-notification', {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: new URLSearchParams({
phone: phone,
customer_name: customerName,
package_name: packageName,
price: price,
notification_type: notificationType,
test_type: currentTestType,
plan_type: currentPlanType
})
})
.then(response => response.text())
.then(data => {
alert('Test notification sent!\nResult: ' + data);
$('#testNotificationModal').modal('hide');
})
.catch(error => {
alert('Error sending test notification: ' + error);
})
.finally(() => {
sendBtn.textContent = originalText;
sendBtn.disabled = false;
});
}
// Update preview when form fields change
document.addEventListener('DOMContentLoaded', function() {
const formFields = ['testCustomerName', 'testPackageName', 'testPrice'];
formFields.forEach(fieldId => {
const field = document.getElementById(fieldId);
if (field) {
field.addEventListener('input', updateMessagePreview);
}
});
});
function testCronJob() {
const resultDiv = document.getElementById('cronTestResult');
resultDiv.innerHTML = '<i class="fa fa-spinner fa-spin"></i> Testing cron job...';
fetch('{$_url}settings/test-cron', {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
}
})
.then(response => response.text())
.then(data => {
resultDiv.innerHTML = '<div class="alert alert-info"><pre>' + data + '</pre></div>';
})
.catch(error => {
resultDiv.innerHTML = '<div class="alert alert-danger">Error: ' + error + '</div>';
});
}
</script>
<div class="container-fluid">
<form class="form-horizontal" method="post" role="form" action="{$_url}settings/notifications-post">
<div class="row">
<div class="col-xxl-6 col-xxl-12">
<div class="col-md-12">
<div class="card">
<div class="card-header"
style="display: grid; align-content: center; justify-content: center;">
<div class="panel panel-primary panel-hovered panel-stacked mb30">
<div class="card-header">
<h5 class="card-title">{Lang::T('Messages Settings')}</h5>
<div class="btn-group pull-right">
<button class="btn btn-primary" title="save" type="submit"><span
class="flaticon-381-save"
aria-hidden="true"></span></button>
</div>
</div>
</div>
<div class="card-body">
<div class="card-header" style="background-color: #f8f9fa; margin: 0 0 20px 0;">
<h6 class="card-title" style="margin: 0; color: #495057; font-weight: bold;">
<i class="fa fa-exclamation-triangle"></i> {Lang::T('Expiration & Reminder Messages')}
</h6>
<div class="btn-group pull-right">
<button type="button" class="btn btn-info btn-sm" onclick="testNotification('expired', 'hotspot')">
<i class="fa fa-wifi"></i> Test Hotspot Expiry
</button>
<button type="button" class="btn btn-success btn-sm" onclick="testNotification('expired', 'pppoe')">
<i class="fa fa-ethernet"></i> Test PPPoE Expiry
</button>
<button type="button" class="btn btn-warning btn-sm" onclick="testNotification('reminder_7_day', 'hotspot')">
<i class="fa fa-clock-o"></i> Test 7-Day Reminder
</button>
</div>
</div>
<!-- Plan Type Specific Templates -->
<div class="form-group">
<label class="control-label">{Lang::T('Expired Notification Messages')}</label>
<div class="row">
<div class="col-md-6">
<label class="control-label text-primary"><i class="fa fa-wifi"></i> {Lang::T('Hotspot Users')}</label>
<textarea style="overflow: hidden;" class="form-control"
id="expired_hotspot" oninput="autoExpand(this)" name="expired[hotspot]"
placeholder="Hello [[name]], your Hotspot internet package [[package]] has been expired. Please visit our portal at [[service_portal]] to renew your connection."
rows="6">{if $_json['expired']['hotspot']!=''}{Lang::htmlspecialchars($_json['expired']['hotspot'])}{else}Hello [[name]], your Hotspot internet package [[package]] has been expired. Please visit our portal at [[service_portal]] to renew your connection.{/if}</textarea>
</div>
<div class="col-md-6">
<label class="control-label text-success"><i class="fa fa-ethernet"></i> {Lang::T('PPPoE Users')}</label>
<textarea style="overflow: hidden;" class="form-control"
id="expired_pppoe" oninput="autoExpand(this)" name="expired[pppoe]"
placeholder="Hello [[name]], your PPPoE internet package [[package]] has been expired. Please contact our support team at [[support_contact]] for renewal assistance."
rows="6">{if $_json['expired']['pppoe']!=''}{Lang::htmlspecialchars($_json['expired']['pppoe'])}{else}Hello [[name]], your PPPoE internet package [[package]] has been expired. Please contact our support team at [[support_contact]] for renewal assistance.{/if}</textarea>
</div>
</div>
<script>
function autoExpand(element) {
element.style.height = 'auto';
element.style.height = (element.scrollHeight) + 'px';
}
</script>
<p class="help-block">
<b>[[name]]</b> Customer Name | <b>[[username]]</b> Customer username | <b>[[package]]</b> Package name | <b>[[price]]</b> Package price | <b>[[plan_type]]</b> Service type (Hotspot/PPPoE) | <b>[[service_portal]]</b> Hotspot portal URL | <b>[[support_contact]]</b> Support contact | <b>[[expired_date]]</b> Expiration date | <b>[[bills]]</b> Additional bills
</p>
</div>
<div class="form-group">
<label class="control-label">{Lang::T('Reminder 7 Days Messages')}</label>
<div class="row">
<div class="col-md-6">
<label class="control-label text-primary"><i class="fa fa-wifi"></i> {Lang::T('Hotspot Users')}</label>
<textarea class="form-control" id="reminder_7_day_hotspot"
name="reminder_7_day[hotspot]"
rows="4">{if $_json['reminder_7_day']['hotspot']!=''}{Lang::htmlspecialchars($_json['reminder_7_day']['hotspot'])}{else}Hello *[[name]]*, your Hotspot package *[[package]]* will expire in 7 days. Visit [[service_portal]] to renew and avoid service interruption.{/if}</textarea>
</div>
<div class="col-md-6">
<label class="control-label text-success"><i class="fa fa-ethernet"></i> {Lang::T('PPPoE Users')}</label>
<textarea class="form-control" id="reminder_7_day_pppoe"
name="reminder_7_day[pppoe]"
rows="4">{if $_json['reminder_7_day']['pppoe']!=''}{Lang::htmlspecialchars($_json['reminder_7_day']['pppoe'])}{else}Hello *[[name]]*, your PPPoE package *[[package]]* will expire in 7 days. Contact [[support_contact]] to renew your connection.{/if}</textarea>
</div>
</div>
<p class="help-block">
<b>[[name]]</b> Customer Name | <b>[[username]]</b> Customer username | <b>[[package]]</b> Package name | <b>[[price]]</b> Package price | <b>[[expired_date]]</b> Expiration date | <b>[[service_portal]]</b> Hotspot portal URL | <b>[[support_contact]]</b> Support contact | <b>[[bills]]</b> Additional bills
</p>
</div>
<div class="form-group">
<label class="control-label">{Lang::T('Reminder 3 Days Messages')}</label>
<div class="row">
<div class="col-md-6">
<label class="control-label text-primary"><i class="fa fa-wifi"></i> {Lang::T('Hotspot Users')}</label>
<textarea class="form-control" id="reminder_3_day_hotspot"
name="reminder_3_day[hotspot]"
rows="3">{if $_json['reminder_3_day']['hotspot']!=''}{Lang::htmlspecialchars($_json['reminder_3_day']['hotspot'])}{else}Hello *[[name]]*, your Hotspot package *[[package]]* will expire in 3 days. Renew now at [[service_portal]] to maintain uninterrupted service.{/if}</textarea>
</div>
<div class="col-md-6">
<label class="control-label text-success"><i class="fa fa-ethernet"></i> {Lang::T('PPPoE Users')}</label>
<textarea class="form-control" id="reminder_3_day_pppoe"
name="reminder_3_day[pppoe]"
rows="3">{if $_json['reminder_3_day']['pppoe']!=''}{Lang::htmlspecialchars($_json['reminder_3_day']['pppoe'])}{else}Hello *[[name]]*, your PPPoE package *[[package]]* will expire in 3 days. Contact [[support_contact]] immediately to renew.{/if}</textarea>
</div>
</div>
<p class="help-block">
<b>[[name]]</b> Customer Name | <b>[[username]]</b> Customer username | <b>[[package]]</b> Package name | <b>[[price]]</b> Package price | <b>[[expired_date]]</b> Expiration date | <b>[[service_portal]]</b> Hotspot portal URL | <b>[[support_contact]]</b> Support contact | <b>[[bills]]</b> Additional bills
</p>
</div>
<div class="form-group">
<label class="control-label">{Lang::T('Reminder 1 Day Messages')}</label>
<div class="row">
<div class="col-md-6">
<label class="control-label text-primary"><i class="fa fa-wifi"></i> {Lang::T('Hotspot Users')}</label>
<textarea class="form-control" id="reminder_1_day_hotspot"
name="reminder_1_day[hotspot]"
rows="3">{if $_json['reminder_1_day']['hotspot']!=''}{Lang::htmlspecialchars($_json['reminder_1_day']['hotspot'])}{else}Hello *[[name]]*, your Hotspot package *[[package]]* will expire tomorrow. Please renew at [[service_portal]] to avoid service disruption.{/if}</textarea>
</div>
<div class="col-md-6">
<label class="control-label text-success"><i class="fa fa-ethernet"></i> {Lang::T('PPPoE Users')}</label>
<textarea class="form-control" id="reminder_1_day_pppoe"
name="reminder_1_day[pppoe]"
rows="3">{if $_json['reminder_1_day']['pppoe']!=''}{Lang::htmlspecialchars($_json['reminder_1_day']['pppoe'])}{else}Hello *[[name]]*, your PPPoE package *[[package]]* will expire tomorrow. Contact [[support_contact]] urgently to renew.{/if}</textarea>
</div>
</div>
<p class="help-block">
<b>[[name]]</b> Customer Name | <b>[[username]]</b> Customer username | <b>[[package]]</b> Package name | <b>[[price]]</b> Package price | <b>[[expired_date]]</b> Expiration date | <b>[[service_portal]]</b> Hotspot portal URL | <b>[[support_contact]]</b> Support contact | <b>[[bills]]</b> Additional bills
</p>
</div>
<hr>
<!-- Debug Information Section -->
<div class="card-header" style="background-color: #fff3cd; margin: 20px 0 10px 0; border-left: 4px solid #ffc107;">
<h6 class="card-title" style="margin: 0; color: #856404; font-weight: bold;">
<i class="fa fa-bug"></i> Debug Information
</h6>
</div>
<div class="alert alert-warning">
<h6><i class="fa fa-info-circle"></i> Troubleshooting Expiry Messages</h6>
<p>If expiry messages are not working, check the following:</p>
<ul>
<li><strong>Cron Job:</strong> Ensure cron jobs are running: <code>php system/cron.php</code></li>
<li><strong>Notification Settings:</strong> Check that "Expired Notification" is enabled in App Settings</li>
<li><strong>SMS/WhatsApp Configuration:</strong> Verify SMS/WhatsApp settings are properly configured</li>
<li><strong>Phone Numbers:</strong> Ensure customers have valid phone numbers in their profiles</li>
<li><strong>Plan Type Detection:</strong> Check that plans have correct 'type' field (Hotspot/PPPOE)</li>
</ul>
<div class="row">
<div class="col-md-6">
<strong>Current Notification Settings:</strong><br>
<small class="text-muted">
Expired: {$_c['user_notification_expired']|default:'Not Set'}<br>
Reminder: {$_c['user_notification_reminder']|default:'Not Set'}<br>
SMS URL: {$_c['sms_url']|default:'Not Set'}<br>
WhatsApp URL: {$_c['wa_url']|default:'Not Set'}
</small>
</div>
<div class="col-md-6">
<strong>Test Cron Job:</strong><br>
<button type="button" class="btn btn-warning btn-sm" onclick="testCronJob()">
<i class="fa fa-play"></i> Test Cron Job
</button>
<div id="cronTestResult" class="mt-2"></div>
</div>
</div>
</div>
<div class="card-header" style="background-color: #f8f9fa; margin: 20px 0 10px 0;">
<h6 class="card-title" style="margin: 0; color: #495057; font-weight: bold;">
<i class="fa fa-credit-card"></i> {Lang::T('Payment & Invoice Messages')}
</h6>
</div>
<div class="form-group">
<label class="control-label">{Lang::T('Invoice Notification
Payment')}</label>
<div class="">
<textarea class="form-control" id="invoice_paid" name="invoice_paid"
placeholder="Hello [[name]], your internet package [[package]] has been expired"
rows="20">{Lang::htmlspecialchars($_json['invoice_paid'])}</textarea>
</div>
<p class="help-block">
<b>[[company_name]]</b> Your Company Name at Settings.
<b>[[address]]</b> Your Company Address at Settings.
<b>[[phone]]</b> Your Company Phone at Settings.
<b>[[invoice]]</b> invoice number.
<b>[[date]]</b> Date invoice created.
<b>[[payment_gateway]]</b> Payment gateway user paid from.
<b>[[payment_channel]]</b> Payment channel user paid from.
<b>[[type]]</b> is Hotspot/PPPOE.
<b>[[plan_name]]</b> Internet Package.
<b>[[plan_price]]</b> Internet Package Prices.
<b>[[name]]</b> Receiver name.
<b>[[user_name]]</b> Username internet.
<b>[[user_password]]</b> User password.
<b>[[expired_date]]</b> Expired datetime.
<b>[[footer]]</b> Invoice Footer.
<b>[[note]]</b> For Notes by admin.
</p>
</div>
<div class="form-group">
<label class="control-label">{Lang::T('Balance Notification
Payment')}</label>
<div class="">
<textarea class="form-control" id="invoice_balance"
name="invoice_balance"
placeholder="Hello [[name]], your internet package [[package]] has been expired"
rows="20">{Lang::htmlspecialchars($_json['invoice_balance'])}</textarea>
</div>
<p class="help-block">
<b>[[company_name]]</b> Your Company Name at Settings.
<b>[[address]]</b> Your Company Address at Settings.
<b>[[phone]]</b> Your Company Phone at Settings.
<b>[[invoice]]</b> invoice number.
<b>[[date]]</b> Date invoice created.
<b>[[payment_gateway]]</b> Payment gateway user paid from.
<b>[[payment_channel]]</b> Payment channel user paid from.
<b>[[type]]</b> is Hotspot/PPPOE.
<b>[[plan_name]]</b> Internet Package.
<b>[[plan_price]]</b> Internet Package Prices.
<b>[[name]]</b> Receiver name.
<b>[[user_name]]</b> Username internet.
<b>[[user_password]]</b> User password.
<b>[[trx_date]]</b> Transaction datetime.
<b>[[balance_before]]</b> Balance Before.
<b>[[balance]]</b> Balance After.
<b>[[footer]]</b> Invoice Footer.
</p>
</div>
{if $_c['enable_balance'] == 'yes'}
<div class="panel-body">
<div class="form-group">
<label class="control-label">{Lang::T('Send Balance')}</label>
<div class="">
<textarea class="form-control" id="balance_send"
name="balance_send"
rows="3">{if $_json['balance_send']}{Lang::htmlspecialchars($_json['balance_send'])}{else}{Lang::htmlspecialchars($_default['balance_send'])}{/if}</textarea>
</div>
<p class="help-block">
<b>[[name]]</b> Receiver name.
<b>[[balance]]</b> how much balance have been send.
<b>[[current_balance]]</b> Current Balance.
</p>
</div>
</div>
<div class="panel-body">
<div class="form-group">
<label class="control-label">{Lang::T('Received Balance')}</label>
<div class="">
<textarea class="form-control" id="balance_received"
name="balance_received"
rows="3">{if $_json['balance_received']}{Lang::htmlspecialchars($_json['balance_received'])}{else}{Lang::htmlspecialchars($_default['balance_received'])}{/if}</textarea>
</div>
<p class="help-block">
<b>[[name]]</b> Sender name.
<b>[[balance]]</b> how much balance have been received.
<b>[[current_balance]]</b> Current Balance.
</p>
</div>
</div>
{/if}
<hr>
<div class="card-header" style="background-color: #f8f9fa; margin: 20px 0 10px 0;">
<h6 class="card-title" style="margin: 0; color: #495057; font-weight: bold;">
<i class="fa fa-user-plus"></i> {Lang::T('Registration Messages')}
</h6>
</div>
<div class="form-group">
<label class="control-label">{Lang::T('User Registration
Message')}</label>
<div class="">
<textarea class="form-control" id="user_registration"
name="user_registration"
placeholder="Welcome to [[company_name]]! Your account has been created successfully."
rows="8">{if $_json['user_registration']}{Lang::htmlspecialchars($_json['user_registration'])}{else}{Lang::htmlspecialchars($_default['user_registration'])}{/if}</textarea>
</div>
<p class="help-block">
<b>[[company_name]]</b> Your Company Name from Settings.
<b>[[name]]</b> Customer's full name.
<b>[[user_name]]</b> Customer's username.
<b>[[username]]</b> Customer's username (alternative).
<b>[[password]]</b> Customer's password.
<b>[[service_type]]</b> Service type (Hotspot/PPPOE).
<b>[[footer]]</b> Company footer message.
</p>
</div>
<hr>
<div class="form-group">
<button class="btn btn-success btn-block" type="submit">{Lang::T('Save
Changes')}</button>
</div>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
{include file="sections/footer.tpl"}

709
ui/ui/app-settings.tpl Normal file
View File

@@ -0,0 +1,709 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<form class="form-horizontal" method="post" role="form" action="{$_url}settings/app-post" enctype="multipart/form-data">
<div class="row">
<div class="col-xxl-12">
<div class="col-md-12">
<div class="card">
<!-- General Settings Section -->
<div class="card-header">
<h5 class="card-title">{Lang::T('General Settings')}</h5>
<div class="btn-group pull-right">
<button class="btn btn-primary" title="save" type="submit">
<span class="flaticon-381-save" aria-hidden="true"></span>
</button>
</div>
</div>
<div class="card-body">
<!-- Company Information -->
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Application Name/Company Name')}</label>
<div class="col-md-6">
<input type="text" required class="form-control" id="CompanyName" name="CompanyName" value="{$_c['CompanyName']}">
</div>
<span class="help-block col-md-4">{Lang::T('This Name will be shown on the Title')}</span>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Company Logo')}</label>
<div class="col-md-6">
<input type="file" class="form-control" id="logo" name="logo" accept="image/*">
<span class="help-block">For PDF Reports | Best size 1078 x 200 | uploaded image will be autosize</span>
</div>
<span class="help-block col-md-4">
<a href="./{$logo}" target="_blank">
<img src="./{$logo}" height="48" alt="logo for PDF">
</a>
</span>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Company Footer')}</label>
<div class="col-md-6">
<input type="text" required class="form-control" id="CompanyFooter" name="CompanyFooter" value="{$_c['CompanyFooter']}">
</div>
<span class="help-block col-md-4">{Lang::T('Will show below user pages')}</span>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Address')}</label>
<div class="col-md-6">
<textarea class="form-control" id="address" name="address" rows="3">{Lang::htmlspecialchars($_c['address'])}</textarea>
</div>
<span class="help-block col-md-4">{Lang::T('You can use html tag')}</span>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Phone Number')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="phone" name="phone" value="{$_c['phone']}">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Hotspot Portal URL')}</label>
<div class="col-md-6">
<input type="url" class="form-control" id="hotspot_url" name="hotspot_url" value="{$_c['hotspot_url']}" placeholder="https://portal.yourdomain.com">
</div>
<p class="help-block col-md-4">{Lang::T('URL for hotspot user portal (used in notifications)')}</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Invoice Footer')}</label>
<div class="col-md-6">
<textarea class="form-control" id="note" name="note" rows="3">{Lang::htmlspecialchars($_c['note'])}</textarea>
<span class="help-block">{Lang::T('You can use html tag')}</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">
<i class="glyphicon glyphicon-print"></i> Print Max Char
</label>
<div class="col-md-6">
<input type="number" required class="form-control" id="printer_cols" placeholder="37" name="printer_cols" value="{$_c['printer_cols']}">
</div>
<span class="help-block col-md-4">For invoice print using Thermal Printer</span>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Theme</label>
<div class="col-md-6">
<select name="theme" id="theme" class="form-select" style="height: 52px; background-color: white;">
<option value="default" {if $_c['theme'] eq 'default'}selected="selected" {/if}>Default</option>
{foreach $themes as $theme}
<option value="{$theme}" {if $_c['theme'] eq $theme}selected="selected" {/if}>
{Lang::ucWords($theme)}
</option>
{/foreach}
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">APP URL</label>
<div class="col-md-6">
<input type="text" readonly class="form-control" value="{$app_url}">
</div>
<p class="help-block col-md-4">edit at config.php</p>
</div>
</div>
</div>
<hr>
<!-- Dashboard Content Settings -->
<div class="card">
<div class="card-header">
<h5 class="card-title">Hide Dashboard Content</h5>
<div class="btn-group pull-right">
<button class="btn btn-primary" title="save" type="submit">
<span class="flaticon-381-save" aria-hidden="true"></span>
</button>
</div>
</div>
<div class="card-body">
<div class="form-group row">
<div class="col-md-12">
<div class="row">
<div class="col-md-3">
<label class="control-label">
<input type="checkbox" name="hide_mrc" value="yes" {if $_c['hide_mrc'] eq 'yes'}checked{/if}>
{Lang::T('Monthly Registered Customers')}
</label>
</div>
<div class="col-md-3">
<label class="control-label">
<input type="checkbox" name="hide_tms" value="yes" {if $_c['hide_tms'] eq 'yes'}checked{/if}>
{Lang::T('Total Monthly Sales')}
</label>
</div>
<div class="col-md-3">
<label class="control-label">
<input type="checkbox" name="hide_aui" value="yes" {if $_c['hide_aui'] eq 'yes'}checked{/if}>
{Lang::T('All Users Insights')}
</label>
</div>
<div class="col-md-3">
<label class="control-label">
<input type="checkbox" name="hide_al" value="yes" {if $_c['hide_al'] eq 'yes'}checked{/if}>
{Lang::T('Activity Log')}
</label>
</div>
</div>
<div class="row mt-2">
<div class="col-md-3">
<label class="control-label">
<input type="checkbox" name="hide_uet" value="yes" {if $_c['hide_uet'] eq 'yes'}checked{/if}>
{Lang::T('User Expired, Today')}
</label>
</div>
<div class="col-md-3">
<label class="control-label">
<input type="checkbox" name="hide_vs" value="yes" {if $_c['hide_vs'] eq 'yes'}checked{/if}>
Vouchers Stock
</label>
</div>
<div class="col-md-3">
<label class="control-label">
<input type="checkbox" name="hide_pg" value="yes" {if $_c['hide_pg'] eq 'yes'}checked{/if}>
Payment Gateway
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<hr>
<!-- Voucher Settings -->
<div class="card">
<div class="card-header">
<h5 class="card-title">{Lang::T('Voucher')}</h5>
<div class="btn-group pull-right">
<button class="btn btn-primary" title="save" type="submit">
<span class="flaticon-381-save" aria-hidden="true"></span>
</button>
</div>
</div>
<div class="card-body">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Disable Voucher')}</label>
<div class="col-md-6">
<select name="disable_voucher" id="disable_voucher" class="form-select" style="height: 52px; background-color: white;">
<option value="no" {if $_c['disable_voucher']=='no'}selected="selected" {/if}>No</option>
<option value="yes" {if $_c['disable_voucher']=='yes'}selected="selected" {/if}>Yes</option>
</select>
</div>
<p class="help-block col-md-4">{Lang::T('Voucher activation menu will be hidden')}</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Voucher Format')}</label>
<div class="col-md-6">
<select name="voucher_format" id="voucher_format" class="form-select" style="height: 52px; background-color: white;">
<option value="up" {if $_c['voucher_format']=='up'}selected="selected" {/if}>UPPERCASE</option>
<option value="low" {if $_c['voucher_format']=='low'}selected="selected" {/if}>lowercase</option>
<option value="rand" {if $_c['voucher_format']=='rand'}selected="selected" {/if}>RaNdoM</option>
</select>
</div>
<p class="help-block col-md-4">UPPERCASE lowercase RaNdoM</p>
</div>
{if $_c['disable_voucher'] != 'yes'}
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Disable Registration')}</label>
<div class="col-md-6">
<select name="disable_registration" id="disable_registration" class="form-select" style="height: 52px; background-color: white;">
<option value="no" {if $_c['disable_registration']=='no'}selected="selected" {/if}>No</option>
<option value="yes" {if $_c['disable_registration']=='yes'}selected="selected" {/if}>Yes</option>
</select>
</div>
<p class="help-block col-md-4">
{Lang::T('Customer just Login with Phone number and Voucher Code, Voucher will be password')}
</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Redirect after Activation</label>
<div class="col-md-6">
<input type="text" class="form-control" id="voucher_redirect" name="voucher_redirect" placeholder="https://192.168.88.1/status" value="{$voucher_redirect}">
</div>
<p class="help-block col-md-4">
{Lang::T('After Customer activate voucher or login, customer will be redirected to this url')}
</p>
</div>
{/if}
</div>
</div>
<hr>
<!-- FreeRadius Settings -->
<div class="card">
<div class="card-header">
<h5 class="card-title">{Lang::T('FreeRadius')}</h5>
<div class="btn-group pull-right">
<button class="btn btn-primary" title="save" type="submit">
<span class="flaticon-381-save" aria-hidden="true"></span>
</button>
</div>
</div>
<div class="card-body">
<div class="form-group row">
<label class="col-md-2 control-label">Enable Radius</label>
<div class="col-md-6">
<select name="radius_enable" id="radius_enable" class="form-select" style="height: 52px; background-color: white;">
<option value="0">No</option>
<option value="1" {if $_c['radius_enable']}selected="selected" {/if}>Yes</option>
</select>
</div>
<p class="help-block col-md-4">
<a href="https://github.com/hotspotbilling/phpnuxbill/wiki/FreeRadius" target="_blank">
You can find Free Radius Setup & Configuration Instructions here.
</a>
</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Radius Client</label>
<div class="col-md-6">
<input type="text" class="form-control" name="radius_client" value="{$_c['radius_client']}">
</div>
</div>
</div>
</div>
<hr>
<!-- Balance System Settings -->
<div class="card">
<div class="card-header">
<h5 class="card-title">{Lang::T('Balance System')}</h5>
<div class="btn-group pull-right">
<button class="btn btn-primary" title="save" type="submit">
<span class="flaticon-381-save" aria-hidden="true"></span>
</button>
</div>
</div>
<div class="card-body">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Enable System')}</label>
<div class="col-md-6">
<select name="enable_balance" id="enable_balance" class="form-select" style="height: 52px; background-color: white;">
<option value="no" {if $_c['enable_balance']=='no'}selected="selected" {/if}>No</option>
<option value="yes" {if $_c['enable_balance']=='yes'}selected="selected" {/if}>Yes</option>
</select>
</div>
<p class="help-block col-md-4">{Lang::T('Customer can deposit money to buy voucher')}</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Allow Transfer')}</label>
<div class="col-md-6">
<select name="allow_balance_transfer" id="allow_balance_transfer" class="form-select" style="height: 52px; background-color: white;">
<option value="no" {if $_c['allow_balance_transfer']=='no'}selected="selected" {/if}>No</option>
<option value="yes" {if $_c['allow_balance_transfer']=='yes'}selected="selected" {/if}>Yes</option>
</select>
</div>
<p class="help-block col-md-4">{Lang::T('Allow balance transfer between customers')}</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Minimum Balance Transfer')}</label>
<div class="col-md-6">
<input type="number" class="form-control" id="minimum_transfer" name="minimum_transfer" value="{$_c['minimum_transfer']}">
</div>
</div>
</div>
</div>
<hr>
<!-- Notification Settings -->
<div class="card">
<div class="card-header">
<h5 class="card-title">{Lang::T('Notification Settings')}</h5>
<div class="btn-group pull-right">
<button class="btn btn-primary" title="save" type="submit">
<span class="flaticon-381-save" aria-hidden="true"></span>
</button>
</div>
</div>
<div class="card-body">
<!-- Telegram Notification -->
<div class="card mb-3">
<div class="card-header">
<h6 class="card-title">{Lang::T('Telegram Notification')}</h6>
<div class="btn-group pull-right">
<a class="btn btn-success btn-xs" href="javascript:testTg()">Test TG</a>
</div>
</div>
<div class="card-body">
<div class="form-group row">
<label class="col-md-2 control-label">Telegram Bot Token</label>
<div class="col-md-6">
<input type="password" class="form-control" id="telegram_bot" name="telegram_bot" onmouseleave="this.type = 'password'" onmouseenter="this.type = 'text'" value="{$_c['telegram_bot']}" placeholder="123456:asdasgdkuasghddlashdashldhalskdklasd">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Telegram User/Channel/Group ID</label>
<div class="col-md-6">
<input type="text" class="form-control" id="telegram_target_id" name="telegram_target_id" value="{$_c['telegram_target_id']}" placeholder="12345678">
</div>
<small class="form-text text-muted help-block col-md-4">You will get Payment and Error notification on you telegram</small>
</div>
</div>
</div>
<!-- SMS Notification -->
<div class="card mb-3">
<div class="card-header">
<h6 class="card-title">{Lang::T('SMS OTP Registration')}</h6>
<div class="btn-group pull-right">
<a class="btn btn-success" href="javascript:testSms()">Test SMS</a>
</div>
</div>
<div class="card-body">
<div class="form-group row">
<label class="col-md-2 control-label">SMS Server URL</label>
<div class="col-md-6">
<input type="text" class="form-control" id="sms_url" name="sms_url" value="{$_c['sms_url']}" placeholder="https://domain/?param_number=[number]&param_text=[text]&secret=">
</div>
<p class="help-block col-md-4">Must include <b>[text]</b> &amp; <b>[number]</b>, it will be replaced.</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Or use Mikrotik SMS</label>
<div class="col-md-6">
<select class="form-control" onchange="document.getElementById('sms_url').value = this.value">
<option value="">Select Router</option>
{foreach $r as $rs}
<option value="{$rs['name']}" {if $rs['name']==$_c['sms_url']}selected{/if}>
{$rs['name']}
</option>
{/foreach}
</select>
</div>
<p class="help-block col-md-4">Must include <b>[text]</b> &amp; <b>[number]</b>, it will be replaced.</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Test Message Template</label>
<div class="col-md-6">
<input type="text" class="form-control" id="test_message_sms" name="test_message_sms" value="{$_c['test_message_sms']}" placeholder="Hello this is a test SMS Courtesy of Smart-tech">
</div>
<p class="help-block col-md-4">Customize the test message sent when testing SMS notifications</p>
</div>
</div>
</div>
<!-- WhatsApp Notification -->
<div class="card mb-3">
<div class="card-header">
<h6 class="card-title">{Lang::T('Whatsapp Notification')}</h6>
<div class="btn-group pull-right">
<a class="btn btn-success" href="javascript:testWa()">Test WA</a>
</div>
</div>
<div class="card-body">
<div class="form-group row">
<label class="col-md-2 control-label">Whatsapp Server URL</label>
<div class="col-md-6">
<input type="text" class="form-control" id="wa_url" name="wa_url" value="{$_c['wa_url']}" placeholder="https://domain/?param_number=[number]&param_text=[text]&secret=">
</div>
<p class="help-block col-md-4">Must include <b>[text]</b> &amp; <b>[number]</b>, it will be replaced.</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Test Message Template</label>
<div class="col-md-6">
<input type="text" class="form-control" id="test_message_wa" name="test_message_wa" value="{$_c['test_message_wa']}" placeholder="Hello this is a test Whatsapp Courtesy of Smart-tech">
</div>
<p class="help-block col-md-4">Customize the test message sent when testing WhatsApp notifications</p>
</div>
</div>
</div>
<!-- Email Notification -->
<div class="card mb-3">
<div class="card-header">
<h6 class="card-title">{Lang::T('Email Notification')}</h6>
<div class="btn-group pull-right">
<a class="btn btn-success" href="javascript:testEmail()">Test Email</a>
</div>
</div>
<div class="card-body">
<div class="form-group row">
<label class="col-md-2 control-label">SMTP Host : port</label>
<div class="col-md-4">
<input type="text" class="form-control" id="smtp_host" name="smtp_host" value="{$_c['smtp_host']}" placeholder="smtp.host.tld">
</div>
<div class="col-md-2">
<input type="number" class="form-control" id="smtp_port" name="smtp_port" value="{$_c['smtp_port']}" placeholder="465 587 port">
</div>
<p class="help-block col-md-4">Empty this to use internal mail() PHP</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">SMTP username</label>
<div class="col-md-6">
<input type="text" class="form-control" id="smtp_user" name="smtp_user" value="{$_c['smtp_user']}" placeholder="user@host.tld">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">SMTP Password</label>
<div class="col-md-6">
<input type="password" class="form-control" id="smtp_pass" name="smtp_pass" value="{$_c['smtp_pass']}" onmouseleave="this.type = 'password'" onmouseenter="this.type = 'text'">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">SMTP Security</label>
<div class="col-md-6">
<select name="smtp_ssltls" id="smtp_ssltls" class="form-select" style="height: 52px; background-color: white;">
<option value="" {if $_c['smtp_ssltls']==''}selected="selected" {/if}>Not Secure</option>
<option value="ssl" {if $_c['smtp_ssltls']=='ssl'}selected="selected" {/if}>SSL</option>
<option value="tls" {if $_c['smtp_ssltls']=='tls'}selected="selected" {/if}>TLS</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Mail From</label>
<div class="col-md-6">
<input type="text" class="form-control" id="mail_from" name="mail_from" value="{$_c['mail_from']}" placeholder="noreply@host.tld">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Mail Reply To</label>
<div class="col-md-6">
<input type="text" class="form-control" id="mail_reply_to" name="mail_reply_to" value="{$_c['mail_reply_to']}" placeholder="support@host.tld">
</div>
<p class="help-block col-md-4">Customer will reply email to this address, empty if you want to use From Address</p>
</div>
</div>
</div>
<!-- User Notification Settings -->
<div class="card">
<div class="card-header">
<h6 class="card-title">{Lang::T('User Notification')}</h6>
</div>
<div class="card-body">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Expired Notification')}</label>
<div class="col-md-6">
<select name="user_notification_expired" id="user_notification_expired" class="form-select" style="height: 52px; background-color: white;">
<option value="none">None</option>
<option value="wa" {if $_c['user_notification_expired']=='wa'}selected="selected" {/if}>Whatsapp</option>
<option value="sms" {if $_c['user_notification_expired']=='sms'}selected="selected" {/if}>SMS</option>
</select>
</div>
<p class="help-block col-md-4">{Lang::T('User will get notification when package expired')}</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Payment Notification')}</label>
<div class="col-md-6">
<select name="user_notification_payment" id="user_notification_payment" class="form-select" style="height: 52px; background-color: white;">
<option value="none">None</option>
<option value="wa" {if $_c['user_notification_payment']=='wa'}selected="selected" {/if}>Whatsapp</option>
<option value="sms" {if $_c['user_notification_payment']=='sms'}selected="selected" {/if}>SMS</option>
</select>
</div>
<p class="help-block col-md-4">
{Lang::T('User will get invoice notification when buy package or package refilled, and welcome notification when account is created')}
</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Reminder Notification')}</label>
<div class="col-md-6">
<select name="user_notification_reminder" id="user_notification_reminder" class="form-select" style="height: 52px; background-color: white;">
<option value="none">None</option>
<option value="wa" {if $_c['user_notification_reminder']=='wa'}selected="selected" {/if}>Whatsapp</option>
<option value="sms" {if $_c['user_notification_reminder']=='sms'}selected="selected" {/if}>SMS</option>
</select>
</div>
</div>
</div>
</div>
</div>
</div>
<hr>
<!-- Additional Settings -->
<div class="card">
<div class="card-header">
<h5 class="card-title">{Lang::T('Additional Settings')}</h5>
<div class="btn-group pull-right">
<button class="btn btn-primary" title="save" type="submit">
<span class="flaticon-381-save" aria-hidden="true"></span>
</button>
</div>
</div>
<div class="card-body">
<!-- Tawk.to Chat Widget -->
<div class="card mb-3">
<div class="card-header">
<h6 class="card-title">{Lang::T('Tawk.to Chat Widget')}</h6>
</div>
<div class="card-body">
<div class="form-group row">
<label class="col-md-2 control-label">https://tawk.to/chat/</label>
<div class="col-md-6">
<input type="text" class="form-control" id="tawkto" name="tawkto" value="{$_c['tawkto']}" placeholder="62f1ca7037898912e961f5/1ga07df">
</div>
<p class="help-block col-md-4">For Direct Chat Link with client from their Dashboard</p>
</div>
<div class="col-md-12">
<div class="card kanbanPreview-bx">
<div class="card-body">
<div class="sub-card">
<span class="text-warning sub-title fs-14">Copy and paste in Terminal</span>
<p class="font-w500">
<code>/ip hotspot walled-garden add dst-host=tawk.to add dst-host=*.tawk.to</code>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- API Key -->
<div class="card mb-3">
<div class="card-header">
<h6 class="card-title">Generate Your API Key</h6>
</div>
<div class="card-body">
<div class="form-group row">
<label class="col-md-2 control-label">Access Token</label>
<div class="col-md-6">
<input type="password" class="form-control" id="api_key" name="api_key" value="{$_c['api_key']}" placeholder="Empty this to randomly created API key" onmouseleave="this.type = 'password'" onmouseenter="this.type = 'text'">
</div>
<p class="col-md-4 help-block">{Lang::T('This Token will act as SuperAdmin/Admin.')}</p>
<p class="col-md-12 help-block">Empty this to randomly created API key that you can use to link this application to other services</p>
</div>
</div>
</div>
<!-- Proxy Settings -->
<div class="card mb-3">
<div class="card-header">
<h6 class="card-title">{Lang::T('Proxy')}</h6>
</div>
<div class="card-body">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Proxy Server')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="http_proxy" name="http_proxy" value="{$_c['http_proxy']}" placeholder="127.0.0.1:3128">
</div>
<p class="col-md-4 help-block">Enter Your Proxy Server IP Address or DNS IP or URl</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Proxy Server Login')}</label>
<div class="col-md-6">
<input type="password" class="form-control" id="http_proxyauth" name="http_proxyauth" autocomplete="off" value="{$_c['http_proxyauth']}" placeholder="username:password" onmouseleave="this.type = 'password'" onmouseenter="this.type = 'text'">
</div>
<p class="col-md-4 help-block">Enter Your Proxy Server Login Password</p>
</div>
</div>
</div>
<!-- Miscellaneous Settings -->
<div class="card">
<div class="card-header">
<h6 class="card-title">{Lang::T('Miscellaneous')}</h6>
</div>
<div class="card-body">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('OTP Required')}</label>
<div class="col-md-6">
<select name="allow_phone_otp" id="allow_phone_otp" class="form-select" style="height: 52px; background-color: white;">
<option value="no" {if $_c['allow_phone_otp']=='no'}selected="selected" {/if}>No</option>
<option value="yes" {if $_c['allow_phone_otp']=='yes'}selected="selected" {/if}>Yes</option>
</select>
</div>
<p class="help-block col-md-4">{Lang::T('OTP is required when user want to change phone number')}</p>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('OTP Method')}</label>
<div class="col-md-6">
<select name="phone_otp_type" id="phone_otp_type" class="form-select" style="height: 52px; background-color: white;">
<option value="sms" {if $_c['phone_otp_type']=='sms'}selected="selected" {/if}>{Lang::T('SMS')}</option>
<option value="whatsapp" {if $_c['phone_otp_type']=='whatsapp'}selected="selected" {/if}>{Lang::T('WhatsApp')}</option>
<option value="both" {if $_c['phone_otp_type']=='both'}selected="selected" {/if}>{Lang::T('SMS and WhatsApp')}</option>
</select>
</div>
<p class="help-block col-md-4">{Lang::T('The method which OTP will be sent to user')}</p>
</div>
</div>
</div>
</div>
</div>
<!-- Save Button -->
<div class="card">
<div class="card-body">
<div class="form-group">
<button class="btn btn-success btn-block" type="submit">{Lang::T('Save Changes')}</button>
</div>
</div>
</div>
<!-- System Information -->
<div class="card">
<div class="card-body">
<div class="card kanbanPreview-bx">
<div class="card-body">
<div class="sub-card">
<span class="text-warning sub-title fs-14">Copy and paste in Terminal</span>
<code>/ip hotspot walled-garden add dst-host={$_domain} add dst-host=*.{$_domain}</code>
</div>
</div>
</div>
<div class="card kanbanPreview-bx">
<div class="card-body">
<div class="sub-card">
<span class="text-warning sub-title fs-14">Cron Jobs</span>
<p># Expired Cronjob Every 5 Minutes</p>
<pre>*/5 * * * * cd {$dir} && {$php} cron.php</pre>
<p># Expired Cronjob Every 1 Hour</p>
<pre>0 * * * * cd {$dir} && {$php} cron.php</pre>
<p># Reminder Cronjob Every 7 AM</p>
<pre>0 7 * * * cd {$dir} && {$php} cron_reminder.php</pre>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</form>
<!-- JavaScript Functions -->
<script>
function testWa() {
var target = prompt("Phone number\nSave First before Test", "");
if (target != null) {
window.location.href = '{$_url}settings/app&testWa=' + target;
}
}
function testSms() {
var target = prompt("Phone number\nSave First before Test", "");
if (target != null) {
window.location.href = '{$_url}settings/app&testSms=' + target;
}
}
function testEmail() {
var target = prompt("Email\nSave First before Test", "");
if (target != null) {
window.location.href = '{$_url}settings/app&testEmail=' + target;
}
}
function testTg() {
window.location.href = '{$_url}settings/app&testTg=test';
}
</script>
</div>
{include file="sections/footer.tpl"}

4
ui/ui/autoload-pool.tpl Normal file
View File

@@ -0,0 +1,4 @@
<option value=''>{Lang::T('Select Pool')}</option>
{foreach $d as $ds}
<option value="{$ds['pool_name']}">{$ds['pool_name']}{if $routers==''} - {$ds['routers']}{/if}</option>
{/foreach}

View File

@@ -0,0 +1,7 @@
<option value=''>{Lang::T('Select Routers')}</option>
{if $_c['radius_enable']}
<option value="radius">Radius</option>
{/if}
{foreach $d as $ds}
<option value="{$ds['name']}">{$ds['name']}</option>
{/foreach}

9
ui/ui/autoload.tpl Normal file
View File

@@ -0,0 +1,9 @@
<option value="">Select Plans</option>
{foreach $d as $ds}
<option value="{$ds['id']}">
{if $ds['enabled'] neq 1}DISABLED PLAN &bull; {/if}
{$ds['name_plan']} &bull;
{Lang::moneyFormat($ds['price'])}
{if $ds['prepaid'] neq 'yes'} &bull; POSTPAID {/if}
</option>
{/foreach}

51
ui/ui/balance-add.tpl Normal file
View File

@@ -0,0 +1,51 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-xxl-6 col-xxl-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header" style="display: grid; align-content: center; justify-content: center;">
<h5 class="card-title">{Lang::T('Add Service Plan')}</h5>
</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}services/balance-add-post">
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Status')}</label>
<div class="col-md-8">
<label class="radio-inline warning">
<input type="radio" checked name="enabled" value="1"> Enable
</label>
<label class="radio-inline">
<input type="radio" name="enabled" value="0"> Disable
</label>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Plan Name')}</label>
<div class="col-md-8">
<input type="text" required class="form-control" id="name" name="name" maxlength="40"
placeholder="Topup 100">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Plan Price')}</label>
<div class="col-md-8">
<div class="input-group">
<span class="input-group-text" >{$_c['currency_code']}</span>
<input type="number" class="form-control" name="price" required>
</div>
</div>
</div>
<div class="form-group">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-success" type="submit">{Lang::T('Save Changes')}</button>
<a class="btn btn-warning" href="{$_url}services/balance">{Lang::T('Cancel')}</a>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

51
ui/ui/balance-edit.tpl Normal file
View File

@@ -0,0 +1,51 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-xxl-6 col-xxl-12">
<div class="card card-primary card-hovered panel-stacked mb30">
<div class="card-header" style="display: grid; align-content: center; justify-content: center;">
<h5 class="card-title">{Lang::T('Edit Service Plan')}</h5>
</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}services/balance-edit-post">
<input type="hidden" name="id" value="{$d['id']}">
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Status')}</label>
<div class="col-md-8">
<label class="radio-inline warning">
<input type="radio" checked name="enabled" value="1"> Enable
</label>
<label class="radio-inline">
<input type="radio" name="enabled" value="0"> Disable
</label>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Plan Name')}</label>
<div class="col-md-8">
<input type="text" required class="form-control" id="name" value="{$d['name_plan']}" name="name" maxlength="40" placeholder="Topup 100">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Plan Price')}</label>
<div class="col-md-8">
<div class="input-group">
<span class="input-group-addon" style="background-color: white; align-items: center; display: flex; border-radius: 12px 0 0 12px; height: 50px;">{$_c['currency_code']}</span>
<input type="number" class="form-control" name="price" value="{$d['price']}" required>
</div>
</div>
</div>
<div class="form-group">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-success" type="submit">{Lang::T('Save Changes')}</button>
Or <a href="{$_url}services/balance">{Lang::T('Cancel')}</a>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

55
ui/ui/balance.tpl Normal file
View File

@@ -0,0 +1,55 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-xxl-6 col-xxl-12">
<div class="card panel-hovered mb20 panel-primary">
<div class="card-header" style="display: grid; align-content: center; justify-content: center;">
<h5 class="card-title">{Lang::T('Balance Plans')}</h5>
</div>
<div class="card-body">
<div class="md-whiteframe-z1 mb20 text-center row" style="padding: 15px">
<div class="col-md-8">
<form id="site-search" method="post" action="{$_url}services/balance/">
<div class="input-group">
<!-- <div class="input-group-addon">
<span class="fa fa-search"></span>
</div> -->
<input type="text" name="name" class="form-control" placeholder="{Lang::T('Search by Name')}...">
<button class="btn btn-success" style="border-radius: 0 12px 12px 0; border: none;" type="submit"><i class="fa fa-search"></i>{Lang::T('Search')}</button>
</div>
</form>
</div>
<div class="col-md-4">
<a href="{$_url}services/balance-add" class="btn btn-primary btn-block"><i class="fa fa-plus"> </i> {Lang::T('New Service Plan')}</a>
</div>&nbsp;
</div>
<div class="table-responsive">
<table class="table table-bordered table-striped table-condensed">
<thead>
<tr>
<th>{Lang::T('Plan Name')}</th>
<th>{Lang::T('Plan Price')}</th>
<th>{Lang::T('Manage')}</th>
</tr>
</thead>
<tbody>
{foreach $d as $ds}
<tr {if $ds['enabled'] != 1}class="danger" title="disabled"{/if}>
<td>{$ds['name_plan']}</td>
<td>{Lang::moneyFormat($ds['price'])}</td>
<td>
<a href="{$_url}services/balance-edit/{$ds['id']}" class="btn btn-info btn-xs"><i class="fa fa-edit"></i>{Lang::T('Edit')}</a>
<a href="{$_url}services/balance-delete/{$ds['id']}" onclick="return confirm('{Lang::T('Delete')}?')" id="{$ds['id']}" class="btn btn-danger btn-xs"><i class="fa fa-trash" aria-hidden="true"></i></a>
</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

84
ui/ui/bandwidth-add.tpl Normal file
View File

@@ -0,0 +1,84 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header" style="display: grid; align-content: center; justify-content: center;">
<h5 class="card-title">{Lang::T('Add New Bandwidth')}</h5></div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}bandwidth/add-post">
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Bandwidth Name')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="name" name="name">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Rate Download')}</label>
<div class="col-md-4">
<input type="text" class="form-control" id="rate_down" name="rate_down">
</div>
<div class="col-md-2">
<select class="form-select" style="height: 52px; background-color: white;" id="rate_down_unit" name="rate_down_unit">
<option value="Kbps">Kbps</option>
<option value="Mbps">Mbps</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Rate Upload')}</label>
<div class="col-md-4">
<input type="text" class="form-control" id="rate_up" name="rate_up">
</div>
<div class="col-md-2">
<select class="form-select" style="height: 52px; background-color: white;" id="rate_up_unit" name="rate_up_unit">
<option value="Kbps">Kbps</option>
<option value="Mbps">Mbps</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">Burst Limit</label>
<div class="col-md-6">
<input type="text" class="form-control" name="burst[]" placeholder="[Burst/Limit]">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">Burst Threshold</label>
<div class="col-md-6">
<input type="text" class="form-control" name="burst[]" placeholder="[Burst/Threshold]">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">Burst Time</label>
<div class="col-md-6">
<input type="text" class="form-control" name="burst[]" placeholder="[Burst/Time]">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">Priority</label>
<div class="col-md-6">
<input type="number" class="form-control" name="burst[]" placeholder="[Priority]">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">Limit At</label>
<div class="col-md-6">
<input type="text" class="form-control" name="burst[]" placeholder="[Limit/At]">
</div>
</div>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-primary"
type="submit">{Lang::T('Submit')}</button>
Or <a href="{$_url}bandwidth/list">{Lang::T('Cancel')}</a>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

97
ui/ui/bandwidth-edit.tpl Normal file
View File

@@ -0,0 +1,97 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-heading" style="display: grid; align-content: center; justify-content: center;">
<h5 class="card-title">{Lang::T('Edit Bandwidth')}</h5>
</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}bandwidth/edit-post">
<input type="hidden" name="id" value="{$d['id']}">
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Bandwidth Name')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="name" name="name" value="{$d['name_bw']}">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Rate Download')}</label>
<div class="col-md-4">
<input type="text" class="form-control" id="rate_down" name="rate_down"
value="{$d['rate_down']}">
</div>
<div class="col-md-2">
<select class="form-select" style="height: 52px; background-color: white;" id="rate_down_unit" name="rate_down_unit">
<option value="Kbps" {if $d['rate_down_unit'] eq 'Kbps'}selected="selected" {/if}>Kbps
</option>
<option value="Mbps" {if $d['rate_down_unit'] eq 'Mbps'}selected="selected" {/if}>Mbps
</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Rate Upload')}</label>
<div class="col-md-4">
<input type="text" class="form-control" id="rate_up" name="rate_up" value="{$d['rate_up']}">
</div>
<div class="col-md-2">
<select class="form-select" style="height: 52px; background-color: white;" id="rate_up_unit" name="rate_up_unit">
<option value="Kbps" {if $d['rate_up_unit'] eq 'Kbps'}selected="selected" {/if}>Kbps
</option>
<option value="Mbps" {if $d['rate_up_unit'] eq 'Mbps'}selected="selected" {/if}>Mbps
</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">Burst Limit</label>
<div class="col-md-6">
<input type="text" class="form-control" name="burst[]" placeholder="[Burst/Limit]" value="{$burst[0]}">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">Burst Threshold</label>
<div class="col-md-6">
<input type="text" class="form-control" name="burst[]" placeholder="[Burst/Threshold]" value="{$burst[1]}">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">Burst Time</label>
<div class="col-md-6">
<input type="text" class="form-control" name="burst[]" placeholder="[Burst/Time]" value="{$burst[2]}">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">Priority</label>
<div class="col-md-6">
<input type="number" class="form-control" name="burst[]" placeholder="[Priority]" value="{$burst[3]}">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">Limit At</label>
<div class="col-md-6">
<input type="text" class="form-control" name="burst[]" placeholder="[Limit/At]" value="{$burst[4]}">
</div>
</div>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<small>{Lang::T('Editing Bandwidth will not automatically update the plan, you need to edit the plan then save again')}</small>
</div>
</div>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-primary"
type="submit">{Lang::T('Submit')}</button>
Or <a href="{$_url}bandwidth/list">{Lang::T('Cancel')}</a>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

58
ui/ui/bandwidth.tpl Normal file
View File

@@ -0,0 +1,58 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card card-hovered mb20 card-primary">
<div class="card-header" style="display: grid; align-content: center; justify-content: center;">
<h5 class="card-title">{Lang::T('Bandwidth Plans')}</h5></div>
<div class="card-body">
<div class="md-whiteframe-z1 mb20 text-center row" style="padding: 15px">
<div class="col-md-8">
<form id="site-search" method="post" action="{$_url}bandwidth/list/">
<div class="input-group">
<!-- <div class="input-group-addon">
<span class="fa fa-search"></span>
</div> -->
<input type="text" name="name" class="form-control" placeholder="{Lang::T('Search by Name')}...">
<button class="btn btn-success" type="submit"><i class="fa fa-search"></i>{Lang::T('Search')}</button>
<!-- <div class="input-group-btn">
</div> -->
</div>
</form>
</div>
<div class="col-md-4">
<a href="{$_url}bandwidth/add" class="btn btn-primary btn-block"><i class="fa fa-plus"> </i> {Lang::T('New Bandwidth')}</a>
</div>&nbsp;
</div>
<div class="table-responsive">
<table class="table table-bordered table-condensed table-striped table_mobile">
<thead>
<tr>
<th>{Lang::T('Bandwidth Name')}</th>
<th>{Lang::T('Rate')}</th>
<th>{Lang::T('Burst')}</th>
<th>{Lang::T('Manage')}</th>
</tr>
</thead>
<tbody>
{foreach $d as $ds}
<tr>
<td>{$ds['name_bw']}</td>
<td>{$ds['rate_down']} {$ds['rate_down_unit']} / {$ds['rate_up']} {$ds['rate_up_unit']}</td>
<td>{$ds['burst']}</td>
<td>
<a href="{$_url}bandwidth/edit/{$ds['id']}" class="btn btn-sm btn-warning"><i class="fa fa-edit"></i>{Lang::T('Edit')}</a>
<a href="{$_url}bandwidth/delete/{$ds['id']}" id="{$ds['id']}" class="btn btn-danger btn-sm" onclick="return confirm('{Lang::T('Delete')}?')" ><i class="fa fa-trash"></i></a>
</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

275
ui/ui/banks-add.tpl Normal file
View File

@@ -0,0 +1,275 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-10 col-lg-8 col-xl-6 mx-auto">
<!-- Page Header -->
<div class="page-header text-center mb-4">
<h3 class="page-title">
<i class="fa fa-plus-circle text-success"></i> {Lang::T('Add New Bank')}
</h3>
<p class="text-muted">{Lang::T('Create a new bank account for STK Push payments')}</p>
</div>
<!-- Main Card -->
<div class="card card-primary card-hovered card-stacked mb30 shadow-sm">
<div class="card-header bg-gradient-success text-white">
<h4 class="mb-0">
<i class="fa fa-university"></i> {Lang::T('Bank Information')}
</h4>
</div>
<div class="card-body">
<form method="post" action="{$_url}banks/save" class="form-horizontal" id="bankForm">
<!-- Basic Information Section -->
<div class="form-section mb-4">
<h6 class="section-title">
<i class="fa fa-info-circle text-primary"></i> {Lang::T('Basic Information')}
</h6>
<div class="form-group">
<label class="col-md-3 control-label font-weight-bold">
<i class="fa fa-university text-muted"></i> {Lang::T('Bank Name')} <span class="text-danger">*</span>
</label>
<div class="col-md-9">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-university"></i></span>
</div>
<input type="text" name="name" class="form-control"
placeholder="{Lang::T('Enter bank name')}" required>
</div>
<small class="text-muted">
<i class="fa fa-lightbulb-o"></i> {Lang::T('e.g., Safaricom M-Pesa, Equity Bank, KCB Bank')}
</small>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label font-weight-bold">
<i class="fa fa-credit-card text-muted"></i> {Lang::T('Account Number')} <span class="text-danger">*</span>
</label>
<div class="col-md-9">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-credit-card"></i></span>
</div>
<input type="text" name="account_number" class="form-control"
placeholder="{Lang::T('Enter account number')}" required>
</div>
<small class="text-muted">
<i class="fa fa-info-circle"></i> {Lang::T('The account number for STK Push payments')}
</small>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label font-weight-bold">
<i class="fa fa-user text-muted"></i> {Lang::T('Account Name')} <span class="text-danger">*</span>
</label>
<div class="col-md-9">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-user"></i></span>
</div>
<input type="text" name="account_name" class="form-control"
placeholder="{Lang::T('Enter account holder name')}" required>
</div>
<small class="text-muted">
<i class="fa fa-info-circle"></i> {Lang::T('Name of the account holder')}
</small>
</div>
</div>
</div>
<!-- Additional Information Section -->
<div class="form-section mb-4">
<h6 class="section-title">
<i class="fa fa-cog text-primary"></i> {Lang::T('Additional Information')}
</h6>
<div class="form-group">
<label class="col-md-3 control-label font-weight-bold">
<i class="fa fa-code text-muted"></i> {Lang::T('Bank Code')}
</label>
<div class="col-md-9">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-code"></i></span>
</div>
<input type="text" name="bank_code" class="form-control"
placeholder="{Lang::T('Enter bank code')}" maxlength="10">
</div>
<small class="text-muted">
<i class="fa fa-lightbulb-o"></i> {Lang::T('e.g., MPESA, EQTY, KCB')}
</small>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label font-weight-bold">
<i class="fa fa-phone text-muted"></i> {Lang::T('Paybill Number')}
</label>
<div class="col-md-9">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-phone"></i></span>
</div>
<input type="text" name="paybill" class="form-control"
placeholder="{Lang::T('Enter paybill number')}">
</div>
<small class="text-muted">
<i class="fa fa-info-circle"></i> {Lang::T('M-Pesa paybill number (if applicable)')}
</small>
</div>
</div>
</div>
<!-- Settings Section -->
<div class="form-section mb-4">
<h6 class="section-title">
<i class="fa fa-sliders text-primary"></i> {Lang::T('Settings & Configuration')}
</h6>
<div class="form-group">
<label class="col-md-3 control-label font-weight-bold">
<i class="fa fa-mobile text-muted"></i> {Lang::T('STK Push Support')}
</label>
<div class="col-md-9">
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" name="supports_stk_push" value="1" id="stkPush" checked>
<label class="custom-control-label" for="stkPush">
<strong>{Lang::T('This bank supports STK Push payments')}</strong>
</label>
</div>
<small class="text-muted">
<i class="fa fa-info-circle"></i> {Lang::T('Only banks with STK Push support can be used for BankStkPush payments')}
</small>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label font-weight-bold">
<i class="fa fa-toggle-on text-muted"></i> {Lang::T('Status')}
</label>
<div class="col-md-9">
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" name="is_active" value="1" id="isActive" checked>
<label class="custom-control-label" for="isActive">
<strong>{Lang::T('Active')}</strong>
</label>
</div>
<small class="text-muted">
<i class="fa fa-info-circle"></i> {Lang::T('Only active banks can be used for payments')}
</small>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label font-weight-bold">
<i class="fa fa-star text-muted"></i> {Lang::T('Set as Default')}
</label>
<div class="col-md-9">
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" name="is_default" value="1" id="isDefault">
<label class="custom-control-label" for="isDefault">
<strong>{Lang::T('Set as default bank for STK Push')}</strong>
</label>
</div>
<small class="text-muted">
<i class="fa fa-info-circle"></i> {Lang::T('This will make this bank the default selection for BankStkPush configuration')}
</small>
</div>
</div>
</div>
<!-- Form Actions -->
<div class="form-group">
<div class="col-md-9 col-md-offset-3">
<div class="btn-group" role="group">
<button type="submit" class="btn btn-success btn-lg">
<i class="fa fa-save"></i> {Lang::T('Save Bank')}
</button>
<a href="{$_url}banks/list" class="btn btn-outline-secondary btn-lg">
<i class="fa fa-arrow-left"></i> {Lang::T('Back to List')}
</a>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<style>
.page-header {
margin-bottom: 2rem;
padding-bottom: 1rem;
border-bottom: 1px solid #e9ecef;
}
.page-title {
margin-bottom: 0.5rem;
font-weight: 600;
}
.form-section {
border-left: 3px solid #007bff;
padding-left: 1rem;
margin-bottom: 2rem;
}
.section-title {
color: #007bff;
font-weight: 600;
margin-bottom: 1rem;
padding-bottom: 0.5rem;
border-bottom: 1px solid #e9ecef;
}
.input-group-text {
background-color: #f8f9fa;
border-color: #ced4da;
color: #6c757d;
}
.form-control:focus {
border-color: #007bff;
box-shadow: 0 0 0 0.2rem rgba(0,123,255,0.25);
}
.custom-control-input:checked ~ .custom-control-label::before {
background-color: #28a745;
border-color: #28a745;
}
.custom-switch .custom-control-label::after {
background-color: #fff;
}
.btn-group .btn {
margin-right: 0.5rem;
}
.btn-group .btn:last-child {
margin-right: 0;
}
@media (max-width: 768px) {
.col-md-3 {
margin-bottom: 0.5rem;
}
.btn-group {
width: 100%;
}
.btn-group .btn {
flex: 1;
margin-right: 0.25rem;
}
}
</style>
{include file="sections/footer.tpl"}

123
ui/ui/banks-edit.tpl Normal file
View File

@@ -0,0 +1,123 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-8 col-md-offset-2">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">
<h4>{Lang::T('Edit Bank')} - {$bank->name}</h4>
</div>
<div class="card-body">
<form method="post" action="{$_url}banks/save" class="form-horizontal">
<input type="hidden" name="id" value="{$bank->id}">
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Bank Name')} <span class="text-danger">*</span></label>
<div class="col-md-9">
<input type="text" name="name" class="form-control" placeholder="{Lang::T('Enter bank name')}"
value="{$bank->name}" required>
<small class="text-muted">{Lang::T('e.g., Safaricom M-Pesa, Equity Bank, KCB Bank')}</small>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Account Number')} <span class="text-danger">*</span></label>
<div class="col-md-9">
<input type="text" name="account_number" class="form-control" placeholder="{Lang::T('Enter account number')}"
value="{$bank->account_number}" required>
<small class="text-muted">{Lang::T('The account number for STK Push payments')}</small>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Account Name')} <span class="text-danger">*</span></label>
<div class="col-md-9">
<input type="text" name="account_name" class="form-control" placeholder="{Lang::T('Enter account holder name')}"
value="{$bank->account_name}" required>
<small class="text-muted">{Lang::T('Name of the account holder')}</small>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Bank Code')}</label>
<div class="col-md-9">
<input type="text" name="bank_code" class="form-control" placeholder="{Lang::T('Enter bank code')}"
value="{$bank->bank_code}" maxlength="10">
<small class="text-muted">{Lang::T('e.g., MPESA, EQTY, KCB')}</small>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Paybill Number')}</label>
<div class="col-md-9">
<input type="text" name="paybill" class="form-control" placeholder="{Lang::T('Enter paybill number')}"
value="{$bank->paybill}">
<small class="text-muted">{Lang::T('M-Pesa paybill number (if applicable)')}</small>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('STK Push Support')}</label>
<div class="col-md-9">
<div class="checkbox">
<label>
<input type="checkbox" name="supports_stk_push" value="1"
{if $bank->supports_stk_push}checked{/if}>
{Lang::T('This bank supports STK Push payments')}
</label>
</div>
<small class="text-muted">{Lang::T('Only banks with STK Push support can be used for BankStkPush payments')}</small>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Status')}</label>
<div class="col-md-9">
<div class="checkbox">
<label>
<input type="checkbox" name="is_active" value="1"
{if $bank->is_active}checked{/if}>
{Lang::T('Active')}
</label>
</div>
<small class="text-muted">{Lang::T('Only active banks can be used for payments')}</small>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Set as Default')}</label>
<div class="col-md-9">
<div class="checkbox">
<label>
<input type="checkbox" name="is_default" value="1"
{if $bank->is_default}checked{/if}>
{Lang::T('Set as default bank for STK Push')}
</label>
</div>
<small class="text-muted">{Lang::T('This will make this bank the default selection for BankStkPush configuration')}</small>
</div>
</div>
<div class="form-group">
<div class="col-md-9 col-md-offset-3">
<button type="submit" class="btn btn-primary">
<i class="fa fa-save"></i> {Lang::T('Update Bank')}
</button>
<a href="{$_url}banks/list" class="btn btn-secondary">
<i class="fa fa-arrow-left"></i> {Lang::T('Back to List')}
</a>
<a href="{$_url}banks/delete/{$bank->id}" class="btn btn-danger pull-right"
onclick="return confirm('{Lang::T('Are you sure you want to delete this bank?')}')">
<i class="fa fa-trash"></i> {Lang::T('Delete')}
</a>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

426
ui/ui/banks.tpl Normal file
View File

@@ -0,0 +1,426 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<!-- Page Header -->
<div class="page-header">
<div class="row">
<div class="col-md-6">
<h3 class="page-title">
<i class="fa fa-university text-primary"></i> {Lang::T('Bank Management')}
</h3>
<p class="text-muted">{Lang::T('Manage bank accounts and STK Push configurations')}</p>
</div>
<div class="col-md-6 text-right">
<div class="btn-group">
<a href="{$_url}paymentgateway/BankStkPush" class="btn btn-info">
<i class="fa fa-cog"></i> {Lang::T('Configure STK Push')}
</a>
<a href="{$_url}banks/add" class="btn btn-success">
<i class="fa fa-plus"></i> {Lang::T('Add New Bank')}
</a>
</div>
</div>
</div>
</div>
<!-- Main Card -->
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header bg-gradient-primary text-white">
<div class="row align-items-center">
<div class="col-md-6">
<h4 class="mb-0">
<i class="fa fa-list"></i> {Lang::T('Bank Accounts')}
</h4>
</div>
<div class="col-md-6 text-right">
<span class="badge badge-light text-primary">
{Lang::arrayCount($banks)} {Lang::T('Banks')}
</span>
</div>
</div>
</div>
<div class="card-body">
<!-- Search and Filter Form -->
<div class="card mb-3">
<div class="card-header bg-light">
<h6 class="mb-0">
<i class="fa fa-filter text-primary"></i> {Lang::T('Search & Filter')}
</h6>
</div>
<div class="card-body">
<form method="post" action="{$_url}banks/list">
<div class="row">
<div class="col-md-3">
<div class="form-group">
<label class="font-weight-bold">
<i class="fa fa-search text-muted"></i> {Lang::T('Search')}
</label>
<input type="text" name="search" class="form-control"
placeholder="{Lang::T('Search by bank name, account number...')}"
value="{$search}">
</div>
</div>
<div class="col-md-2">
<div class="form-group">
<label class="font-weight-bold">
<i class="fa fa-mobile text-muted"></i> {Lang::T('STK Push')}
</label>
<select name="filter_stk" class="form-control">
<option value="">{Lang::T('All')}</option>
<option value="1" {if $filter_stk == '1'}selected{/if}>{Lang::T('Supported')}</option>
<option value="0" {if $filter_stk == '0'}selected{/if}>{Lang::T('Not Supported')}</option>
</select>
</div>
</div>
<div class="col-md-2">
<div class="form-group">
<label class="font-weight-bold">
<i class="fa fa-toggle-on text-muted"></i> {Lang::T('Status')}
</label>
<select name="filter_active" class="form-control">
<option value="">{Lang::T('All')}</option>
<option value="1" {if $filter_active == '1'}selected{/if}>{Lang::T('Active')}</option>
<option value="0" {if $filter_active == '0'}selected{/if}>{Lang::T('Inactive')}</option>
</select>
</div>
</div>
<div class="col-md-2">
<div class="form-group">
<label class="font-weight-bold">&nbsp;</label>
<button type="submit" class="btn btn-primary form-control">
<i class="fa fa-search"></i> {Lang::T('Filter')}
</button>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="font-weight-bold">&nbsp;</label>
<a href="{$_url}banks/list" class="btn btn-secondary form-control">
<i class="fa fa-refresh"></i> {Lang::T('Reset')}
</a>
</div>
</div>
</div>
</form>
</div>
</div>
<!-- Banks Table -->
<div class="table-responsive banks-table-container">
<table class="table table-hover table-bordered">
<thead class="thead-dark">
<tr>
<th class="text-center">
<i class="fa fa-university"></i> {Lang::T('Bank Name')}
</th>
<th class="text-center">
<i class="fa fa-credit-card"></i> {Lang::T('Account Number')}
</th>
<th class="text-center">
<i class="fa fa-user"></i> {Lang::T('Account Name')}
</th>
<th class="text-center">
<i class="fa fa-code"></i> {Lang::T('Bank Code')}
</th>
<th class="text-center">
<i class="fa fa-phone"></i> {Lang::T('Paybill')}
</th>
<th class="text-center">
<i class="fa fa-mobile"></i> {Lang::T('STK Push')}
</th>
<th class="text-center">
<i class="fa fa-toggle-on"></i> {Lang::T('Status')}
</th>
<th class="text-center">
<i class="fa fa-star"></i> {Lang::T('Default')}
</th>
<th class="text-center">
<i class="fa fa-cogs"></i> {Lang::T('Actions')}
</th>
</tr>
</thead>
<tbody>
{if $banks}
{foreach $banks as $bank}
<tr class="{if $bank->is_default}table-warning{/if}">
<td>
<div class="d-flex align-items-center">
<div class="bank-icon mr-2">
<i class="fa fa-university text-primary"></i>
</div>
<div>
<strong class="text-dark">{$bank->name}</strong>
{if $bank->is_default}
<br><small class="text-warning">
<i class="fa fa-star"></i> {Lang::T('Default Bank')}
</small>
{/if}
</div>
</div>
</td>
<td>
{if $bank->account_number}
<code class="bg-light text-dark px-2 py-1 rounded">{$bank->account_number}</code>
{else}
<span class="text-muted">
<i class="fa fa-minus"></i> {Lang::T('Not Set')}
</span>
{/if}
</td>
<td>
{if $bank->account_name}
<span class="text-dark">{$bank->account_name}</span>
{else}
<span class="text-muted">
<i class="fa fa-minus"></i> {Lang::T('Not Set')}
</span>
{/if}
</td>
<td class="text-center">
{if $bank->bank_code}
<span class="badge badge-info badge-pill">{$bank->bank_code}</span>
{else}
<span class="text-muted">-</span>
{/if}
</td>
<td class="text-center">
{if $bank->paybill}
<code class="bg-light text-dark px-2 py-1 rounded">{$bank->paybill}</code>
{else}
<span class="text-muted">-</span>
{/if}
</td>
<td class="text-center">
{if $bank->supports_stk_push}
<span class="badge badge-success badge-pill">
<i class="fa fa-check"></i> {Lang::T('Yes')}
</span>
{else}
<span class="badge badge-secondary badge-pill">
<i class="fa fa-times"></i> {Lang::T('No')}
</span>
{/if}
</td>
<td class="text-center">
{if $bank->is_active}
<span class="badge badge-success badge-pill">
<i class="fa fa-check-circle"></i> {Lang::T('Active')}
</span>
{else}
<span class="badge badge-danger badge-pill">
<i class="fa fa-times-circle"></i> {Lang::T('Inactive')}
</span>
{/if}
</td>
<td class="text-center">
{if $bank->is_default}
<span class="badge badge-warning badge-pill">
<i class="fa fa-star"></i> {Lang::T('Default')}
</span>
{else}
<span class="text-muted">-</span>
{/if}
</td>
<td class="text-center">
<div class="btn-group" role="group">
<a href="{$_url}banks/edit/{$bank->id}"
class="btn btn-sm btn-outline-primary"
title="{Lang::T('Edit Bank')}"
data-toggle="tooltip">
<i class="fa fa-edit"></i>
</a>
{if $bank->supports_stk_push && $bank->is_active && !$bank->is_default}
<a href="{$_url}banks/set-default/{$bank->id}"
class="btn btn-sm btn-outline-warning"
title="{Lang::T('Set as Default')}"
data-toggle="tooltip"
onclick="return confirm('{Lang::T('Set this bank as default for STK Push?')}')">
<i class="fa fa-star"></i>
</a>
{/if}
<a href="{$_url}banks/toggle-status/{$bank->id}"
class="btn btn-sm {if $bank->is_active}btn-outline-warning{else}btn-outline-success{/if}"
title="{if $bank->is_active}{Lang::T('Deactivate')}{else}{Lang::T('Activate')}{/if}"
data-toggle="tooltip"
onclick="return confirm('{if $bank->is_active}{Lang::T('Deactivate this bank?')}{else}{Lang::T('Activate this bank?')}{/if}')">
<i class="fa {if $bank->is_active}fa-pause{else}fa-play{/if}"></i>
</a>
<a href="{$_url}banks/delete/{$bank->id}"
class="btn btn-sm btn-outline-danger"
title="{Lang::T('Delete Bank')}"
data-toggle="tooltip"
onclick="return confirm('{Lang::T('Are you sure you want to delete this bank?')}')">
<i class="fa fa-trash"></i>
</a>
</div>
</td>
</tr>
{/foreach}
{else}
<tr>
<td colspan="9" class="text-center py-5">
<div class="empty-state">
<i class="fa fa-university fa-3x text-muted mb-3"></i>
<h5 class="text-muted">{Lang::T('No Banks Found')}</h5>
<p class="text-muted">{Lang::T('No banks match your current filter criteria.')}</p>
<a href="{$_url}banks/add" class="btn btn-primary">
<i class="fa fa-plus"></i> {Lang::T('Add Your First Bank')}
</a>
</div>
</td>
</tr>
{/if}
</tbody>
</table>
</div>
<!-- Pagination -->
{if Lang::arrayCount($banks)}
<div class="mt-3">
{include file="pagination.tpl"}
</div>
{/if}
</div>
</div>
</div>
</div>
</div>
<style>
.page-header {
margin-bottom: 2rem;
padding-bottom: 1rem;
border-bottom: 1px solid #e9ecef;
}
.page-title {
margin-bottom: 0.5rem;
font-weight: 600;
}
.bank-icon {
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
background: #f8f9fa;
border-radius: 50%;
}
.empty-state {
padding: 2rem;
}
.table-hover tbody tr:hover {
background-color: rgba(0,123,255,0.05);
}
.table-warning {
background-color: rgba(255,193,7,0.1) !important;
}
.badge-pill {
padding: 0.5em 0.75em;
font-size: 0.75em;
}
.btn-group .btn {
margin-right: 2px;
}
.btn-group .btn:last-child {
margin-right: 0;
}
/* Fix for table visibility */
.table-responsive {
overflow-x: auto;
min-height: 200px;
}
.table {
margin-bottom: 0;
}
.card-body {
padding: 1.25rem;
}
/* Ensure table is visible */
.banks-table-container {
position: relative;
z-index: 1;
}
/* Fix button text visibility */
.btn {
color: #fff !important;
text-decoration: none;
}
.btn-primary {
background-color: #007bff;
border-color: #007bff;
}
.btn-primary:hover {
background-color: #0056b3;
border-color: #004085;
color: #fff !important;
}
.btn-secondary {
background-color: #6c757d;
border-color: #6c757d;
color: #fff !important;
}
.btn-secondary:hover {
background-color: #545b62;
border-color: #4e555b;
color: #fff !important;
}
.btn-outline-primary {
color: #007bff;
border-color: #007bff;
background-color: transparent;
}
.btn-outline-primary:hover {
color: #fff;
background-color: #007bff;
border-color: #007bff;
}
.btn-outline-secondary {
color: #6c757d;
border-color: #6c757d;
background-color: transparent;
}
.btn-outline-secondary:hover {
color: #fff;
background-color: #6c757d;
border-color: #6c757d;
}
@media (max-width: 768px) {
.table-responsive {
font-size: 0.875rem;
}
.btn-group .btn {
padding: 0.25rem 0.5rem;
font-size: 0.75rem;
}
}
</style>
{include file="sections/footer.tpl"}

304
ui/ui/banks_basic.tpl Normal file
View File

@@ -0,0 +1,304 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header border-0 pb-0">
<div class="row align-items-center mb-3">
<div class="col-md-6">
<h3 class="mb-0 text-dark">Banks</h3>
<p class="text-muted mb-0 small">Manage your bank accounts and configurations</p>
</div>
<div class="col-md-6 text-end">
<a href="{$_url}banks/add" class="btn btn-dark">
<i class="fa fa-plus me-1"></i> Add Bank
</a>
</div>
</div>
<!-- Enhanced Search Section -->
<div class="row">
<div class="col-12">
<div class="search-container">
<form method="post" action="{$_url}banks/list" class="row g-3" id="search-form">
<div class="col-md-8">
<div class="input-group">
<span class="input-group-text bg-white border-end-0">
<i class="fa fa-search text-muted"></i>
</span>
<input type="text" name="search" class="form-control border-start-0 ps-0"
placeholder="Search by bank name, account number, or account name..."
value="{$search}">
</div>
</div>
<div class="col-md-2">
<select name="filter_stk" class="form-select">
<option value="">All STK Push</option>
<option value="1" {if $filter_stk == '1'}selected{/if}>Supported</option>
<option value="0" {if $filter_stk == '0'}selected{/if}>Not Supported</option>
</select>
</div>
<div class="col-md-2">
<select name="filter_active" class="form-select">
<option value="">All Status</option>
<option value="1" {if $filter_active == '1'}selected{/if}>Active</option>
<option value="0" {if $filter_active == '0'}selected{/if}>Inactive</option>
</select>
</div>
</form>
<div class="d-flex justify-content-between align-items-center mt-2">
<div class="d-flex gap-2">
<button type="submit" form="search-form" class="btn btn-outline-secondary btn-sm">
<i class="fa fa-search me-1"></i> Search
</button>
<a href="{$_url}banks/list" class="btn btn-outline-secondary btn-sm">
<i class="fa fa-refresh me-1"></i> Reset
</a>
</div>
<div class="text-muted small">
<i class="fa fa-info-circle me-1"></i>
Showing {count($banks)} bank{if count($banks) != 1}s{/if}
</div>
</div>
</div>
</div>
</div>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table table-hover">
<thead class="table-light">
<tr>
<th class="border-0">ID</th>
<th class="border-0">Bank Name</th>
<th class="border-0">Account Number</th>
<th class="border-0">Account Name</th>
<th class="border-0 text-center">STK Push</th>
<th class="border-0 text-center">Status</th>
<th class="border-0 text-center">Default</th>
<th class="border-0 text-center">Actions</th>
</tr>
</thead>
<tbody>
{if $banks}
{foreach $banks as $bank}
<tr {if $bank->is_default}class="bg-light"{/if}>
<td class="text-muted">{$bank->id}</td>
<td>
<div class="fw-semibold text-dark">{$bank->name}</div>
{if $bank->is_default}
<small class="text-muted">Default Bank</small>
{/if}
</td>
<td>
{if $bank->account_number}
<code class="bg-light px-2 py-1 rounded text-dark">{$bank->account_number}</code>
{else}
<span class="text-muted">—</span>
{/if}
</td>
<td>
{if $bank->account_name}
<span class="text-dark">{$bank->account_name}</span>
{else}
<span class="text-muted">—</span>
{/if}
</td>
<td class="text-center">
{if $bank->supports_stk_push}
<span class="badge bg-success bg-opacity-10 text-success border border-success border-opacity-25">Yes</span>
{else}
<span class="badge bg-secondary bg-opacity-10 text-secondary">No</span>
{/if}
</td>
<td class="text-center">
{if $bank->is_active}
<span class="badge bg-success bg-opacity-10 text-success border border-success border-opacity-25">Active</span>
{else}
<span class="badge bg-danger bg-opacity-10 text-danger border border-danger border-opacity-25">Inactive</span>
{/if}
</td>
<td class="text-center">
{if $bank->is_default}
<span class="badge bg-warning bg-opacity-10 text-warning border border-warning border-opacity-25">Yes</span>
{else}
<span class="badge bg-secondary bg-opacity-10 text-secondary">No</span>
{/if}
</td>
<td class="text-center">
<div class="btn-group btn-group-sm">
<a href="{$_url}banks/edit/{$bank->id}" class="btn btn-outline-secondary btn-sm" title="Edit">
<i class="fa fa-edit"></i>
</a>
<a href="{$_url}banks/delete/{$bank->id}" class="btn btn-outline-secondary btn-sm" title="Delete"
onclick="return confirm('Delete this bank?')">
<i class="fa fa-trash"></i>
</a>
</div>
</td>
</tr>
{/foreach}
{else}
<tr>
<td colspan="8" class="text-center py-4">
<i class="fa fa-university fa-2x text-muted mb-2"></i>
<br>No banks found
</td>
</tr>
{/if}
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<style>
/* Polish the design with subtle improvements */
.card {
border: 1px solid #e9ecef;
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}
.card-header {
background-color: #f8f9fa;
border-bottom: 1px solid #e9ecef;
padding: 1rem 1.25rem;
}
.table th {
font-weight: 600;
color: #495057;
font-size: 0.875rem;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.table td {
vertical-align: middle;
padding: 0.75rem;
}
.table-hover tbody tr:hover {
background-color: #f8f9fa;
}
.bg-light {
background-color: #f8f9fa !important;
}
.badge {
font-size: 0.75rem;
font-weight: 500;
padding: 0.375rem 0.75rem;
}
.btn-group-sm .btn {
padding: 0.25rem 0.5rem;
font-size: 0.875rem;
}
.btn-outline-secondary:hover {
background-color: #6c757d;
border-color: #6c757d;
}
.form-control {
border: 1px solid #ced4da;
font-size: 0.875rem;
}
.form-control:focus {
border-color: #86b7fe;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
/* Subtle animations */
.table-hover tbody tr {
transition: background-color 0.15s ease-in-out;
}
.btn {
transition: all 0.15s ease-in-out;
}
/* Clean empty state */
.text-center.py-4 {
padding: 3rem 1rem;
}
.text-center.py-4 i {
opacity: 0.5;
}
/* Enhanced Search Section */
.search-container {
background-color: #f8f9fa;
border: 1px solid #e9ecef;
border-radius: 0.5rem;
padding: 1.25rem;
margin-bottom: 0;
}
.input-group-text {
border-color: #ced4da;
background-color: #f8f9fa;
}
.input-group .form-control:focus {
border-color: #ced4da;
box-shadow: none;
}
.input-group:focus-within .input-group-text {
border-color: #86b7fe;
background-color: #f8f9fa;
}
.input-group:focus-within .form-control {
border-color: #86b7fe;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
.form-select {
font-size: 0.875rem;
border-color: #ced4da;
}
.form-select:focus {
border-color: #86b7fe;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
.btn-sm {
font-size: 0.875rem;
padding: 0.375rem 0.75rem;
}
.gap-2 > * + * {
margin-left: 0.5rem;
}
/* Search section responsive */
@media (max-width: 768px) {
.search-container .row {
margin: 0;
}
.search-container .col-md-8,
.search-container .col-md-2 {
margin-bottom: 0.75rem;
}
.d-flex.justify-content-between {
flex-direction: column;
align-items: flex-start !important;
gap: 0.75rem;
}
}
</style>
{include file="sections/footer.tpl"}

203
ui/ui/banks_clean.tpl Normal file
View File

@@ -0,0 +1,203 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-12">
<!-- Page Header -->
<div class="d-flex justify-content-between align-items-center mb-4">
<div>
<h2 class="mb-1">Bank Management</h2>
<p class="text-muted mb-0">Manage your bank accounts and configurations</p>
</div>
<div>
<a href="{$_url}banks/add" class="btn btn-primary">
<i class="fa fa-plus"></i> Add Bank
</a>
</div>
</div>
<!-- Search and Filters -->
<div class="card mb-3">
<div class="card-body">
<form method="post" action="{$_url}banks/list" class="row g-3">
<div class="col-md-4">
<label class="form-label">Search</label>
<input type="text" name="search" class="form-control"
placeholder="Search banks..." value="{$search}">
</div>
<div class="col-md-2">
<label class="form-label">STK Push</label>
<select name="filter_stk" class="form-select">
<option value="">All</option>
<option value="1" {if $filter_stk == '1'}selected{/if}>Supported</option>
<option value="0" {if $filter_stk == '0'}selected{/if}>Not Supported</option>
</select>
</div>
<div class="col-md-2">
<label class="form-label">Status</label>
<select name="filter_active" class="form-select">
<option value="">All</option>
<option value="1" {if $filter_active == '1'}selected{/if}>Active</option>
<option value="0" {if $filter_active == '0'}selected{/if}>Inactive</option>
</select>
</div>
<div class="col-md-2">
<label class="form-label">&nbsp;</label>
<button type="submit" class="btn btn-outline-primary w-100">
<i class="fa fa-search"></i> Search
</button>
</div>
<div class="col-md-2">
<label class="form-label">&nbsp;</label>
<a href="{$_url}banks/list" class="btn btn-outline-secondary w-100">
<i class="fa fa-refresh"></i> Reset
</a>
</div>
</form>
</div>
</div>
<!-- Banks List -->
<div class="card">
<div class="card-header d-flex justify-content-between align-items-center">
<h5 class="mb-0">Banks ({count($banks)})</h5>
<div class="btn-group" role="group">
<button type="button" class="btn btn-sm btn-outline-secondary" onclick="location.reload()">
<i class="fa fa-refresh"></i>
</button>
</div>
</div>
<div class="card-body p-0">
{if $banks}
<div class="table-responsive">
<table class="table table-hover mb-0">
<thead class="table-light">
<tr>
<th>Bank</th>
<th>Account Details</th>
<th>Features</th>
<th>Status</th>
<th width="120">Actions</th>
</tr>
</thead>
<tbody>
{foreach $banks as $bank}
<tr {if $bank->is_default}class="table-warning"{/if}>
<td>
<div class="d-flex align-items-center">
<div class="me-3">
<div class="bg-primary text-white rounded-circle d-flex align-items-center justify-content-center"
style="width: 40px; height: 40px;">
<i class="fa fa-university"></i>
</div>
</div>
<div>
<div class="fw-bold">{$bank->name}</div>
{if $bank->is_default}
<small class="text-warning">
<i class="fa fa-star"></i> Default Bank
</small>
{/if}
</div>
</div>
</td>
<td>
<div>
{if $bank->account_number}
<div class="text-muted small">Account Number</div>
<code class="bg-light px-2 py-1 rounded">{$bank->account_number}</code>
{else}
<span class="text-muted">Not set</span>
{/if}
</div>
{if $bank->account_name}
<div class="mt-1">
<div class="text-muted small">Account Name</div>
<div class="small">{$bank->account_name}</div>
</div>
{/if}
</td>
<td>
<div class="d-flex flex-column gap-1">
<span class="badge {if $bank->supports_stk_push}bg-success{else}bg-secondary{/if}">
<i class="fa fa-mobile"></i> STK Push
</span>
{if $bank->bank_code}
<span class="badge bg-info">
<i class="fa fa-code"></i> {$bank->bank_code}
</span>
{/if}
</div>
</td>
<td>
<span class="badge {if $bank->is_active}bg-success{else}bg-danger{/if}">
{if $bank->is_active}Active{else}Inactive{/if}
</span>
</td>
<td>
<div class="btn-group btn-group-sm" role="group">
<a href="{$_url}banks/edit/{$bank->id}"
class="btn btn-outline-primary" title="Edit">
<i class="fa fa-edit"></i>
</a>
<a href="{$_url}banks/delete/{$bank->id}"
class="btn btn-outline-danger" title="Delete"
onclick="return confirm('Delete this bank?')">
<i class="fa fa-trash"></i>
</a>
</div>
</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{else}
<div class="text-center py-5">
<div class="mb-3">
<i class="fa fa-university fa-3x text-muted"></i>
</div>
<h5 class="text-muted">No Banks Found</h5>
<p class="text-muted">No banks match your search criteria.</p>
<a href="{$_url}banks/add" class="btn btn-primary">
<i class="fa fa-plus"></i> Add Your First Bank
</a>
</div>
{/if}
</div>
</div>
</div>
</div>
</div>
<style>
.table-hover tbody tr:hover {
background-color: rgba(0,123,255,0.05);
}
.table-warning {
background-color: rgba(255,193,7,0.1) !important;
}
.badge {
font-size: 0.75em;
}
.btn-group-sm .btn {
padding: 0.25rem 0.5rem;
}
.card-header {
background-color: #f8f9fa;
border-bottom: 1px solid #dee2e6;
}
.table-light th {
background-color: #f8f9fa;
border-bottom: 2px solid #dee2e6;
font-weight: 600;
color: #495057;
}
</style>
{include file="sections/footer.tpl"}

268
ui/ui/banks_simple.tpl Normal file
View File

@@ -0,0 +1,268 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<div class="row align-items-center">
<div class="col-md-6">
<h3 class="mb-0">
<i class="fa fa-university text-primary"></i> Bank Management
</h3>
<p class="text-muted mb-0">Manage bank accounts and STK Push configurations</p>
</div>
<div class="col-md-6 text-right">
<div class="btn-group">
<a href="{$_url}paymentgateway/BankStkPush" class="btn btn-info">
<i class="fa fa-cog"></i> Configure STK Push
</a>
<a href="{$_url}banks/add" class="btn btn-success">
<i class="fa fa-plus"></i> Add New Bank
</a>
</div>
<div class="mt-2">
<span class="badge badge-primary">
{count($banks)} Banks
</span>
</div>
</div>
</div>
</div>
<div class="card-body">
<!-- Search Form -->
<div class="card mb-2">
<div class="card-header bg-light py-2">
<h6 class="mb-0">Search & Filter</h6>
</div>
<div class="card-body py-2">
<form method="post" action="{$_url}banks/list">
<div class="row">
<div class="col-md-4">
<div class="form-group mb-2">
<label class="mb-1">Search</label>
<input type="text" name="search" class="form-control form-control-sm"
placeholder="Search by bank name, account number..."
value="{$search}">
</div>
</div>
<div class="col-md-2">
<div class="form-group mb-2">
<label class="mb-1">STK Push</label>
<select name="filter_stk" class="form-control form-control-sm">
<option value="">All</option>
<option value="1" {if $filter_stk == '1'}selected{/if}>Supported</option>
<option value="0" {if $filter_stk == '0'}selected{/if}>Not Supported</option>
</select>
</div>
</div>
<div class="col-md-2">
<div class="form-group mb-2">
<label class="mb-1">Status</label>
<select name="filter_active" class="form-control form-control-sm">
<option value="">All</option>
<option value="1" {if $filter_active == '1'}selected{/if}>Active</option>
<option value="0" {if $filter_active == '0'}selected{/if}>Inactive</option>
</select>
</div>
</div>
<div class="col-md-2">
<div class="form-group mb-2">
<label class="mb-1">&nbsp;</label>
<button type="submit" class="btn btn-primary btn-sm form-control">
<i class="fa fa-search"></i> Filter
</button>
</div>
</div>
<div class="col-md-2">
<div class="form-group mb-2">
<label class="mb-1">&nbsp;</label>
<a href="{$_url}banks/list" class="btn btn-secondary btn-sm form-control">
<i class="fa fa-refresh"></i> Reset
</a>
</div>
</div>
</div>
</form>
</div>
</div>
<div class="table-responsive mt-2">
<table class="table table-striped table-hover">
<thead class="thead-dark">
<tr>
<th><i class="fa fa-university"></i> Bank Name</th>
<th><i class="fa fa-credit-card"></i> Account Number</th>
<th><i class="fa fa-user"></i> Account Name</th>
<th><i class="fa fa-mobile"></i> STK Push</th>
<th><i class="fa fa-toggle-on"></i> Status</th>
<th><i class="fa fa-star"></i> Default</th>
<th><i class="fa fa-cogs"></i> Actions</th>
</tr>
</thead>
<tbody>
{if $banks}
{foreach $banks as $bank}
<tr {if $bank->is_default}class="table-warning"{/if}>
<td>
<div class="d-flex align-items-center">
<div class="bank-icon mr-2">
<i class="fa fa-university text-primary"></i>
</div>
<div>
<strong>{$bank->name}</strong>
{if $bank->is_default}
<br><small class="text-warning">
<i class="fa fa-star"></i> Default Bank
</small>
{/if}
</div>
</div>
</td>
<td>
{if $bank->account_number}
<code class="bg-light text-dark px-2 py-1 rounded">{$bank->account_number}</code>
{else}
<span class="text-muted">
<i class="fa fa-minus"></i> Not Set
</span>
{/if}
</td>
<td>
{if $bank->account_name}
<span class="text-dark">{$bank->account_name}</span>
{else}
<span class="text-muted">
<i class="fa fa-minus"></i> Not Set
</span>
{/if}
</td>
<td class="text-center">
{if $bank->supports_stk_push}
<span class="badge badge-success badge-pill">Yes</span>
{else}
<span class="badge badge-secondary badge-pill">No</span>
{/if}
</td>
<td class="text-center">
{if $bank->is_active}
<span class="badge badge-success badge-pill">Active</span>
{else}
<span class="badge badge-danger badge-pill">Inactive</span>
{/if}
</td>
<td class="text-center">
{if $bank->is_default}
<span class="badge badge-warning badge-pill">Yes</span>
{else}
<span class="badge badge-secondary badge-pill">No</span>
{/if}
</td>
<td class="text-center">
<div class="btn-group" role="group">
<a href="{$_url}banks/edit/{$bank->id}" class="btn btn-sm btn-outline-primary" title="Edit">
<i class="fa fa-edit"></i>
</a>
<a href="{$_url}banks/delete/{$bank->id}" class="btn btn-sm btn-outline-danger"
onclick="return confirm('Are you sure you want to delete this bank?')" title="Delete">
<i class="fa fa-trash"></i>
</a>
</div>
</td>
</tr>
{/foreach}
{else}
<tr>
<td colspan="7" class="text-center py-5">
<div class="empty-state">
<i class="fa fa-university fa-3x text-muted mb-3"></i>
<h5 class="text-muted">No Banks Found</h5>
<p class="text-muted">No banks match your current filter criteria.</p>
<a href="{$_url}banks/add" class="btn btn-primary">
<i class="fa fa-plus"></i> Add Your First Bank
</a>
</div>
</td>
</tr>
{/if}
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<style>
.bank-icon {
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
background: #f8f9fa;
border-radius: 50%;
}
.empty-state {
padding: 2rem;
}
.table-hover tbody tr:hover {
background-color: rgba(0,123,255,0.05);
}
.table-warning {
background-color: rgba(255,193,7,0.1) !important;
}
.badge-pill {
padding: 0.5em 0.75em;
font-size: 0.75em;
}
.btn-group .btn {
margin-right: 2px;
}
.btn-group .btn:last-child {
margin-right: 0;
}
/* Fix for table visibility */
.table-responsive {
overflow-x: auto;
min-height: 200px;
}
.table {
margin-bottom: 0;
}
.card-body {
padding: 1rem;
}
/* Reduce spacing between search and table */
.card.mb-2 {
margin-bottom: 0.5rem !important;
}
.card-header.py-2 {
padding-top: 0.5rem !important;
padding-bottom: 0.5rem !important;
}
.card-body.py-2 {
padding-top: 0.5rem !important;
padding-bottom: 0.5rem !important;
}
/* Ensure table is visible */
.banks-table-container {
position: relative;
z-index: 1;
}
</style>
{include file="sections/footer.tpl"}

42
ui/ui/change-password.tpl Normal file
View File

@@ -0,0 +1,42 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header" style="display: grid; align-content: center; justify-content: center;">
<h5 class="card-title">{Lang::T('Change Password')}</h5></div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}settings/change-password-post">
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Current Password')}</label>
<div class="col-md-6">
<input type="password" class="form-control" id="password" name="password">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('New Password')}</label>
<div class="col-md-6">
<input type="password" class="form-control" id="npass" name="npass">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Confirm New Password')}</label>
<div class="col-md-6">
<input type="password" class="form-control" id="cnpass" name="cnpass">
</div>
</div>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-success" type="submit">{Lang::T('Save Changes')}</button>
Or <a href="{$_url}dashboard">{Lang::T('Cancel')}</a>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

42
ui/ui/community.tpl Normal file
View File

@@ -0,0 +1,42 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12" id="update">
<div class="card card-primary card-hovered mb20 activities">
<div class="card-header">
<h3 class="card-title">MikroPulse</h3>
</div>
<div class="card-body">
<b>MikroPulse</b> is a Billing System for Hotspot and PPPOE in Mikrotik using PHP and Mikrotik API to comunicate with router.
<hr>
<div id="currentVersion">Current Version: </div>
<div id="latestVersion">Latest Version: </div>
</div>
<div class="card-body">
<div class="btn-group btn-group-justified" role="group" aria-label="...">
<a href="./update.php" class="btn btn-success btn-sm btn-block">Install Latest Version</a>
<a href="https://github.com/hotspotbilling/phpnuxbill/archive/refs/heads/master.zip" target="_blank"
class="btn btn-warning btn-sm btn-block">Download Latest Version</a>
</div>
</div>
<div class="card-body">
If you Download manual the update file, sometime update change database, after uploading, click this button to update database structure.
<a href="./update.php?step=4" class="btn btn-default btn-sm btn-block">Update Database</a>
</div>
</div>
</div>
</div>
<script>
window.addEventListener('DOMContentLoaded', function() {
$.getJSON("./version.json?" + Math.random(), function(data) {
$('#currentVersion').html('Current Version: ' + data.version);
});
$.getJSON("https://raw.githubusercontent.com/hotspotbilling/phpnuxbill/master/version.json?" + Math
.random(),
function(data) {
$('#latestVersion').html('Latest Version: ' + data.version);
});
});
</script>
</div>
{include file="sections/footer.tpl"}

239
ui/ui/customers-add.tpl Normal file
View File

@@ -0,0 +1,239 @@
{include file="sections/header.tpl"}
{assign var="icmcode" value="Y{rand(100000,999999)}"}
{assign var="itcode" value="IT{rand(500,999)}"}
<div class="container-fluid">
<form class="form-horizontal" method="post" role="form" action="{$_url}customers/add-post">
<div class="row">
<div class="col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header" style="display: grid; align-content: center; justify-content: center;">
<h5 class="card-title">{Lang::T('Add New Contact')}</h5></div>
<div class="card-body">
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Full Name')}</label>
<div class="col-md-9">
<input type="text" required class="form-control" id="fullname" name="fullname">
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Username')}</label>
<div class="col-md-9">
<div class="input-group">
<span class="input-group-text" id="basic-addon1"><i
class="fa fa-user"></i></span>
<input type="text" class="form-control" name="username" value="{$icmcode}" id="username" required
placeholder="Y123456789">
</div>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Email')}</label>
<div class="col-md-9">
<input type="email" class="form-control" id="email" name="email" value="icom@net.com" placeholder="Enter email address">
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Phone Number')}</label>
<div class="col-md-9">
<div class="input-group">
{if $_c['country_code_phone']!= ''}
<span class="input-group-text" id="basic-addon1">+</span>
{else}
<span class="input-group-text" id="basic-addon1"><i
class="glyphicon glyphicon-phone-alt"></i></span>
{/if}
<input type="text" class="form-control" name="phonenumber" id="phonenumber" value="254"
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']}{/if} {Lang::T('Phone Number')}">
</div>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Password')}</label>
<div class="col-md-9">
<input type="password" class="form-control" autocomplete="off" required id="password"
value="{$icmcode}" name="password" placeholder="Enter password" onmouseleave="this.type = 'password'"
onmouseenter="this.type = 'text'">
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('PPPOE Password')}</label>
<div class="col-md-9">
<input type="password" class="form-control" id="pppoe_password" name="pppoe_password"
value="{$icmcode}" placeholder="Enter PPPoE password" onmouseleave="this.type = 'password'"
onmouseenter="this.type = 'text'">
<span class="help-block">
{Lang::T('User Cannot change this, only admin. if it Empty it will use user password')}
</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Area')}</label>
<div class="col-md-9">
<textarea name="address" id="address" class="form-control"></textarea>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Service Type')}</label>
<div class="col-md-9">
<select class="form-select" style="height: 52px; background-color: white;" id="service_type" name="service_type">
<option value="Hotspot">Hotspot</option>
<option value="PPPoE">PPPoE</option>
<option value="Static">Static</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Account Type')}</label>
<div class="col-md-9">
<select class="form-select" style="height: 52px; background-color: white;" id="account_type" name="account_type">
<option value="Personal">Personal
</option>
<option value="Business">Business</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Status')}</label>
<div class="col-md-9">
<select class="form-select" style="height: 52px; background-color: white;" id="status" name="status">
<option value="Active" selected>Active</option>
<option value="Banned">Banned</option>
<option value="Disabled">Disabled</option>
<option value="Inactive">Inactive</option>
<option value="Limited">Limited</option>
<option value="Suspended">Suspended</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Coordinates')}</label>
<div class="col-md-9">
<input name="coordinates" id="coordinates" class="form-control" value=""
placeholder="6.465422, 3.406448">
<div id="map" style="width: '100%'; height: 200px; min-height: 150px;"></div>
</div>
</div>
<div class="col-md-12">
<div class="card kanbanPreview-bx">
<div class="card-body">
<div class="sub-card">
<div class="card-header">
<h5 class="">{Lang::T('Attributes')}</div>
<div class="card-body" style="border: none;">
<!-- Customers Attributes add start -->
<div id="custom-fields-container">
</div>
<!-- Customers Attributes add end -->
</div>
<div class="card-footer">
<button class="btn btn-success btn-block" type="button"
id="add-custom-field">{Lang::T('Add')}</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<center>
<button class="btn btn-primary" type="submit">
{Lang::T('Save Changes')}
</button>
<br><a href="{$_url}customers/list" class="btn btn-link">{Lang::T('Cancel')}</a>
</center>
</form>
{literal}
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
var customFieldsContainer = document.getElementById('custom-fields-container');
var addCustomFieldButton = document.getElementById('add-custom-field');
addCustomFieldButton.addEventListener('click', function() {
var fieldIndex = customFieldsContainer.children.length;
var newField = document.createElement('div');
newField.className = 'form-group row';
newField.innerHTML = `
<div class="col-md-4">
<input type="text" class="form-control" name="custom_field_name[]" placeholder="Name">
</div>
<div class="col-md-6">
<input type="text" class="form-control" name="custom_field_value[]" placeholder="Value">
</div>
<div class="col-md-2">
<button type="button" class="remove-custom-field btn btn-danger btn-sm">-</button>
</div>
`;
customFieldsContainer.appendChild(newField);
});
customFieldsContainer.addEventListener('click', function(event) {
if (event.target.classList.contains('remove-custom-field')) {
var fieldContainer = event.target.parentNode.parentNode;
fieldContainer.parentNode.removeChild(fieldContainer);
}
});
// Clear default values when user focuses on fields
var fieldsToClear = ['username', 'email', 'phonenumber', 'password', 'pppoe_password'];
fieldsToClear.forEach(function(fieldId) {
var field = document.getElementById(fieldId);
if (field) {
field.addEventListener('focus', function() {
if (this.value === this.defaultValue) {
this.value = '';
}
});
field.addEventListener('blur', function() {
if (this.value === '') {
this.value = this.defaultValue;
}
});
}
});
});
</script>
<script src="https://unpkg.com/leaflet@1.9.3/dist/leaflet.js"></script>
<script>
function getLocation() {
if (window.location.protocol == "https:" && navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
setupMap(51.505, -0.09);
}
}
function showPosition(position) {
setupMap(position.coords.latitude, position.coords.longitude);
}
function setupMap(lat, lon) {
var map = L.map('map').setView([lat, lon], 13);
L.tileLayer('https://{s}.basemaps.cartocdn.com/rastertiles/light_all/{z}/{x}/{y}.png', {
attribution:
'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors &copy; <a href="https://carto.com/attributions">CARTO</a>',
subdomains: 'abcd',
maxZoom: 20
}).addTo(map);
var marker = L.marker([lat, lon]).addTo(map);
map.on('click', function(e){
var coord = e.latlng;
var lat = coord.lat;
var lng = coord.lng;
var newLatLng = new L.LatLng(lat, lng);
marker.setLatLng(newLatLng);
$('#coordinates').val(lat + ',' + lng);
});
}
window.onload = function() {
getLocation();
}
</script>
{/literal}
</div>
{include file="sections/footer.tpl"}

246
ui/ui/customers-edit.tpl Normal file
View File

@@ -0,0 +1,246 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<form class="form-horizontal" method="post" role="form" action="{$_url}customers/edit-post">
<div class="row">
<div class="col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header" style="display: grid; align-content: center; justify-content: center;">
<h5 class="card-title">{Lang::T('Edit Contact')}</h5>
</div>
<div class="card-body">
<input type="hidden" name="id" value="{$d['id']}">
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Full Name')}</label>
<div class="col-md-9">
<input type="text" class="form-control" id="fullname" name="fullname"
value="{$d['fullname']}">
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Username')}</label>
<div class="col-md-9">
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1"><i
class="fa fa-user"></i></span>
<input type="text" class="form-control" name="username" value="{$d['username']}"
required placeholder="Y123456789">
</div>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Email')}</label>
<div class="col-md-9">
<input type="email" class="form-control" id="email" name="email" value="{$d['email']}">
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Phone Number')}</label>
<div class="col-md-9">
<div class="input-group">
{if $_c['country_code_phone']!= ''}
<span class="input-group-text" id="basic-addon1">+</span>
{else}
<span class="input-group-text" id="basic-addon1"><i
class="fa fa-phone-alt"></i></span>
{/if}
<input type="text" class="form-control" name="phonenumber" value="{$d['phonenumber']}"
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']}{/if} {Lang::T('Phone Number')}">
</div>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Password')}</label>
<div class="col-md-9">
<input type="password" autocomplete="off" class="form-control" id="password" name="password"
onmouseleave="this.type = 'password'" onmouseenter="this.type = 'text'"
value="{$d['password']}">
<span class="help-block">{Lang::T('Keep Blank to do not change Password')}</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('PPPOE Password')}</label>
<div class="col-md-9">
<input type="password" autocomplete="off" class="form-control" id="pppoe_password"
name="pppoe_password" value="{$d['pppoe_password']}"
onmouseleave="this.type = 'password'" onmouseenter="this.type = 'text'">
<span class="help-block">
{Lang::T('User Cannot change this, only admin. if it Empty it will use user password')}
</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Area')}</label>
<div class="col-md-9">
<textarea name="address" id="address" class="form-control">{$d['address']}</textarea>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Service Type')}</label>
<div class="col-md-9">
<select class="form-select" style="height: 52px; background-color: white;" id="service_type" name="service_type">
<option value="Hotspot" {if $d['service_type'] eq 'Hotspot' }selected{/if}>Hotspot
</option>
<option value="PPPoE" {if $d['service_type'] eq 'PPPoE' }selected{/if}>PPPoE</option>
<option value="Static" {if $d['service_type'] eq 'Static' }selected{/if}>Static</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Account Type')}</label>
<div class="col-md-9">
<select class="form-select" style="height: 52px; background-color: white;" id="account_type" name="account_type">
<option value="Personal" {if $d['account_type'] eq 'Personal' }selected{/if}>Personal
</option>
<option value="Business" {if $d['account_type'] eq 'Business' }selected{/if}>Business
</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Status')}</label>
<div class="col-md-9">
<select class="form-select" style="height: 52px; background-color: white;" id="status" name="status">
<option value="Active" {if $d['status'] eq 'Active' }selected{/if}>Active</option>
<option value="Banned" {if $d['status'] eq 'Banned' }selected{/if}>Banned</option>
<option value="Disabled" {if $d['status'] eq 'Disabled' }selected{/if}>Disabled</option>
<option value="Inactive" {if $d['status'] eq 'Inactive' }selected{/if}>Inactive</option>
<option value="Limited" {if $d['status'] eq 'Limited' }selected{/if}>Limited</option>
<option value="Suspended" {if $d['status'] eq 'Suspended' }selected{/if}>Suspended</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{Lang::T('Coordinates')}</label>
<div class="col-md-9">
<input name="coordinates" id="coordinates" class="form-control" value="{$d['coordinates']}"
placeholder="6.465422, 3.406448">
<div id="map" style="width: '100%'; height: 200px; min-height: 150px;"></div>
</div>
</div>
<div class="col-md-12">
<div class="card kanbanPreview-bx">
<div class="card-body">
<div class="sub-card">
<div class="card-header">
<h5>{Lang::T('Attributes')}</h5></div>
<div class="card-body">
<!--Customers Attributes edit start -->
{if $customFields}
{foreach $customFields as $customField}
<div class="form-group row">
<label class="col-md-4 control-label"
for="{$customField.field_name}">{$customField.field_name}</label>
<div class="col-md-6">
<input class="form-control" type="text" name="custom_fields[{$customField.field_name}]"
id="{$customField.field_name}" value="{$customField.field_value}">
</div>
<label class="col-md-2">
<input type="checkbox" name="delete_custom_fields[]" value="{$customField.field_name}">
Delete
</label>
</div>
{/foreach}
{/if}
<!--Customers Attributes edit end -->
<!-- Customers Attributes add start -->
<div id="custom-fields-container">
</div>
<!-- Customers Attributes add end -->
</div>
<div class="card-footer">
<button class="btn btn-success btn-block" type="button"
id="add-custom-field">{Lang::T('Add')}</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<center>
<button class="btn btn-primary" type="submit">
{Lang::T('Save Changes')}
</button>
<br><a href="{$_url}customers/list" class="btn btn-link">{Lang::T('Cancel')}</a>
</center>
</form>
{literal}
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
var customFieldsContainer = document.getElementById('custom-fields-container');
var addCustomFieldButton = document.getElementById('add-custom-field');
addCustomFieldButton.addEventListener('click', function() {
var fieldIndex = customFieldsContainer.children.length;
var newField = document.createElement('div');
newField.className = 'form-group row';
newField.innerHTML = `
<div class="col-md-4">
<input type="text" class="form-control" name="custom_field_name[]" placeholder="Name">
</div>
<div class="col-md-6">
<input type="text" class="form-control" name="custom_field_value[]" placeholder="Value">
</div>
<div class="col-md-2">
<button type="button" class="remove-custom-field btn btn-danger btn-sm">-</button>
</div>
`;
customFieldsContainer.appendChild(newField);
});
customFieldsContainer.addEventListener('click', function(event) {
if (event.target.classList.contains('remove-custom-field')) {
var fieldContainer = event.target.parentNode.parentNode;
fieldContainer.parentNode.removeChild(fieldContainer);
}
});
});
</script>
<script src="https://unpkg.com/leaflet@1.9.3/dist/leaflet.js"></script>
<script>
function getLocation() {
if (window.location.protocol == "https:" && navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
setupMap(51.505, -0.09);
}
}
function showPosition(position) {
setupMap(position.coords.latitude, position.coords.longitude);
}
function setupMap(lat, lon) {
var map = L.map('map').setView([lat, lon], 13);
L.tileLayer('https://{s}.basemaps.cartocdn.com/rastertiles/light_all/{z}/{x}/{y}.png', {
attribution:
'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors &copy; <a href="https://carto.com/attributions">CARTO</a>',
subdomains: 'abcd',
maxZoom: 20
}).addTo(map);
var marker = L.marker([lat, lon]).addTo(map);
map.on('click', function(e) {
var coord = e.latlng;
var lat = coord.lat;
var lng = coord.lng;
var newLatLng = new L.LatLng(lat, lng);
marker.setLatLng(newLatLng);
$('#coordinates').val(lat + ',' + lng);
});
}
window.onload = function() {
{/literal}{if $d['coordinates']}
setupMap({$d['coordinates']});
{else}
getLocation();
{/if}{literal}
}
</script>
{/literal}
</div>
{include file="sections/footer.tpl"}

64
ui/ui/customers-map.tpl Normal file
View File

@@ -0,0 +1,64 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<!-- Map container div -->
<div class="card">
<div id="map" class="well card-body" style="width: '100%'; height: 78vh; margin: 20px auto"></div>
</div>
{literal}
<script>
function getLocation() {
if (window.location.protocol == "https:" && navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
setupMap(51.505, -0.09);
}
}
function showPosition(position) {
setupMap(position.coords.latitude, position.coords.longitude);
}
function setupMap(lat, lon) {
var map = L.map('map').setView([lat, lon], 13);
var group = L.featureGroup().addTo(map);
var customers = {/literal}{$customers|json_encode}{literal};
L.tileLayer('https://{s}.basemaps.cartocdn.com/rastertiles/light_all/{z}/{x}/{y}.png', {
attribution:
'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors &copy; <a href="https://carto.com/attributions">CARTO</a>',
subdomains: 'abcd',
maxZoom: 20
}).addTo(map);
customers.forEach(function(customer) {
var name = customer.id;
var name = customer.name;
var info = customer.info;
var direction = customer.direction;
var coordinates = customer.coordinates;
var balance = customer.balance;
var address = customer.address;
// Create a popup for the marker
var popupContent = "<strong>Name</strong>: " + name + "<br>" +
"<strong>Info</strong>: " + info + "<br>" +
"<strong>Balance</strong>: " + balance + "<br>" +
"<strong>Address</strong>: " + address + "<br>" +
"<a href='{/literal}{$_url}{literal}customers/view/"+ customer.id +"'>More Info</a> &bull; " +
"<a href='https://www.google.com/maps/dir//" + direction + "' target='maps'>Get Direction</a><br>";
// Add marker to map
var marker = L.marker(JSON.parse(coordinates)).addTo(group);
marker.bindTooltip(name, { permanent: true }).bindPopup(popupContent);
});
map.fitBounds(group.getBounds());
}
window.onload = function() {
getLocation();
}
</script>
{/literal}
</div>
{include file="sections/footer.tpl"}

263
ui/ui/customers-view.tpl Normal file
View File

@@ -0,0 +1,263 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-4 col-md-4">
<div class="card card-primary">
<div class="card-body card-profile">
<img class="user-img img-responsive img-circle"
src="https://robohash.org/{$d['id']}?set=set3&size=100x100&bgset=bg1"
onerror="this.src='{$UPLOAD_PATH}/user.default.jpg'" alt="avatar">
<h3 class="profile-username text-center">{$d['fullname']}</h3>
<ul class="list-group list-group-unbordered">
<li class="list-group-item">
<b>{Lang::T('Username')}</b> <span class="pull-right">{$d['username']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Phone Number')}</b> <span class="pull-right">{$d['phonenumber']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Email')}</b> <span class="pull-right">{$d['email']}</span>
</li>
</ul>
<!--<p class="text-muted">{Lang::nl2br($d['address'])}</p>-->
<ul class="list-group list-group-unbordered">
<li class="list-group-item">
<b>{Lang::T('Password')}</b> <input type="password" value="{$d['password']}"
style=" border: 0px; text-align: right;" class="pull-right"
onmouseleave="this.type = 'password'" onmouseenter="this.type = 'text'"
onclick="this.select()">
</li>
{if $d['pppoe_password'] != ''}
<li class="list-group-item">
<b>PPPOE {Lang::T('Password')}</b> <input type="password" value="{$d['pppoe_password']}"
style=" border: 0px; text-align: right;" class="pull-right"
onmouseleave="this.type = 'password'" onmouseenter="this.type = 'text'"
onclick="this.select()">
</li>
{/if}
<!--Customers Attributes view start -->
{if $customFields}
{foreach $customFields as $customField}
<li class="list-group-item">
<b>{$customField.field_name}</b> <span class="pull-right">
{if strpos($customField.field_value, ':0') === false}
{$customField.field_value}
{else}
<b>{Lang::T('Paid')}</b>
{/if}
</span>
</li>
{/foreach}
{/if}
<!--Customers Attributes view end -->
<li class="list-group-item">
<b>{Lang::T('Service Type')}</b> <span class="pull-right">{Lang::T($d['service_type'])}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Account')}</b> <span class="pull-right">{Lang::T($d['account'])}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Account Type')}</b> <span class="pull-right">{Lang::T($d['account_type'])}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Balance')}</b> <span class="pull-right">{Lang::moneyFormat($d['balance'])}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Auto Renewal')}</b> <span class="pull-right">{if
$d['auto_renewal']}yes{else}no
{/if}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Created On')}</b> <span
class="pull-right">{Lang::dateTimeFormat($d['created_at'])}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Last Login')}</b> <span
class="pull-right">{Lang::dateTimeFormat($d['last_login'])}</span>
</li>
{if $d['coordinates']}
<li class="list-group-item">
<b>{Lang::T('Coordinates')}</b> <span class="pull-right">
<i class="glyphicon glyphicon-road"></i> <a style="color: black;"
href="https://www.google.com/maps/dir//{$d['coordinates']}/" target="_blank">Get
Directions</a>
</span>
<div id="map" style="width: '100%'; height: 100px;"></div>
</li>
{/if}
</ul>
<div class="row">
<div class="col-xs-4 mb-3">
<a href="{$_url}customers/delete/{$d['id']}" id="{$d['id']}"
class="btn btn-danger btn-block btn-sm"
onclick="return confirm('{Lang::T('Delete')}?')"><span class="fa fa-trash"></span></a>
</div>
<div class="col-xs-8">
<a href="{$_url}customers/edit/{$d['id']}"
class="btn btn-warning btn-sm btn-block">{Lang::T('Edit')}</a>
</div>
</div>
</div>
</div>
{foreach $packages as $package}
<div class="card card-{if $package['status']=='on'}success{else}danger{/if}">
<div class="card-body card-profile">
<h4 class="text-center">{$package['type']} - {$package['namebp']}</h4>
<ul class="list-group list-group-unbordered">
<li class="list-group-item">
{Lang::T('Active')} <span class="pull-right">{if
$package['status']=='on'}yes{else}no
{/if}</span>
</li>
<li class="list-group-item">
{Lang::T('Type')} <span class="pull-right">
{if $package['prepaid'] eq yes}Prepaid{else}<b>Postpaid</b>{/if}</span>
</li>
<li class="list-group-item">
{Lang::T('Created On')} <span
class="pull-right">{Lang::dateAndTimeFormat($package['recharged_on'],$package['recharged_time'])}</span>
</li>
<li class="list-group-item">
{Lang::T('Expires On')} <span class="pull-right">{Lang::dateAndTimeFormat($package['expiration'],
$package['time'])}</span>
</li>
<li class="list-group-item">
{$package['routers']} <span class="pull-right">{$package['method']}</span>
</li>
</ul>
<div class="row">
<div class="col-xs-4">
<a href="{$_url}customers/deactivate/{$d['id']}/{$package['plan_id']}" id="{$d['id']}"
class="btn btn-danger btn-block btn-sm"
onclick="return confirm('This will deactivate Customer Plan, and make it expired')">{Lang::T('Deactivate')}</a>
</div>
<div class="col-xs-8">
<a href="{$_url}customers/recharge/{$d['id']}/{$package['plan_id']}"
class="btn btn-success btn-sm btn-block">{Lang::T('Recharge')}</a>
</div>
</div>
</div>
</div>
{/foreach}
<div class="row">
<div class="col-xs-4">
<a href="{$_url}customers/list" class="btn btn-primary btn-sm btn-block">{Lang::T('Back')}</a>
</div>
<div class="col-xs-4">
<a href="{$_url}customers/sync/{$d['id']}"
onclick="return confirm('This will sync Customer to Mikrotik?')"
class="btn btn-info btn-sm btn-block">{Lang::T('Sync')}</a>
</div>
<div class="col-xs-4">
<a href="{$_url}message/send/{$d['id']}" class="btn btn-success btn-sm btn-block">{Lang::T('Send
Message')}</a>
</div>
</div>
</div>
<div class="col-sm-8 col-md-8">
<div class="card">
<div class="card-body">
<ul class="nav nav-tabs">
<li role="presentation" {if $v=='order' }class="nav-item" {/if}><a class="nav-link active"
href="{$_url}customers/view/{$d['id']}/order">30 {Lang::T('Order History')}</a></li>
<li role="presentation" {if $v=='activation' }class="nav-item" {/if}><a class="nav-link active"
href="{$_url}customers/view/{$d['id']}/activation">30 {Lang::T('Activation History')}</a></li>
</ul>
<div class="table-responsive" style="background-color: white;">
<table id="datatable" class="table table-bordered table-striped">
{if Lang::arrayCount($activation)}
<thead>
<tr>
<th>{Lang::T('Invoice')}</th>
<th>{Lang::T('Username')}</th>
<th>{Lang::T('Plan Name')}</th>
<th>{Lang::T('Plan Price')}</th>
<th>{Lang::T('Type')}</th>
<th>{Lang::T('Created On')}</th>
<th>{Lang::T('Expires On')}</th>
<th>{Lang::T('Method')}</th>
</tr>
</thead>
<tbody>
{foreach $activation as $ds}
<tr onclick="window.location.href = '{$_url}plan/view/{$ds['id']}'" style="cursor:pointer;">
<td>{$ds['invoice']}</td>
<td>{$ds['username']}</td>
<td>{$ds['plan_name']}</td>
<td>{Lang::moneyFormat($ds['price'])}</td>
<td>{$ds['type']}</td>
<td class="text-success">{Lang::dateAndTimeFormat($ds['recharged_on'],$ds['recharged_time'])}
</td>
<td class="text-danger">{Lang::dateAndTimeFormat($ds['expiration'],$ds['time'])}</td>
<td>{$ds['method']}</td>
</tr>
{/foreach}
</tbody>
{/if}
{if Lang::arrayCount($order)}
<thead>
<tr>
<th>{Lang::T('Plan Name')}</th>
<th>{Lang::T('Gateway')}</th>
<th>{Lang::T('Routers')}</th>
<th>{Lang::T('Type')}</th>
<th>{Lang::T('Plan Price')}</th>
<th>{Lang::T('Created On')}</th>
<th>{Lang::T('Expires On')}</th>
<th>{Lang::T('Date Done')}</th>
<th>{Lang::T('Method')}</th>
</tr>
</thead>
<tbody>
{foreach $order as $ds}
<tr>
<td>{$ds['plan_name']}</td>
<td>{$ds['gateway']}</td>
<td>{$ds['routers']}</td>
<td>{$ds['payment_channel']}</td>
<td>{Lang::moneyFormat($ds['price'])}</td>
<td class="text-primary">{Lang::dateTimeFormat($ds['created_date'])}</td>
<td class="text-danger">{Lang::dateTimeFormat($ds['expired_date'])}</td>
<td class="text-success">{if $ds['status']!=1}{Lang::dateTimeFormat($ds['paid_date'])}{/if}</td>
<td>{if $ds['status']==1}{Lang::T('UNPAID')}
{elseif $ds['status']==2}{Lang::T('PAID')}
{elseif $ds['status']==3}{$_L['FAILED']}
{elseif $ds['status']==4}{Lang::T('CANCELED')}
{elseif $ds['status']==5}{Lang::T('UNKNOWN')}
{/if}</td>
</tr>
{/foreach}
</tbody>
{/if}
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
{if $d['coordinates']}
{literal}
<script src="https://unpkg.com/leaflet@1.9.3/dist/leaflet.js"></script>
<script>
function setupMap(lat, lon) {
var map = L.map('map').setView([lat, lon], 17);
L.tileLayer('https://{s}.basemaps.cartocdn.com/rastertiles/light_all/{z}/{x}/{y}.png', {
attribution:
'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors &copy; <a href="https://carto.com/attributions">CARTO</a>',
subdomains: 'abcd',
maxZoom: 20
}).addTo(map);
var marker = L.marker([lat, lon]).addTo(map);
}
window.onload = function() {
{/literal}setupMap({$d['coordinates']});{literal}
}
</script>
{/literal}
{/if}
</div>
{include file="sections/footer.tpl"}

115
ui/ui/customers.tpl Normal file
View File

@@ -0,0 +1,115 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<style>
.dataTables_wrapper .dataTables_paginate .paginate_button {
display: inline-block;
padding: 5px 10px;
margin-right: 5px;
border: 1px solid #ccc;
background-color: #fff;
color: #333;
cursor: pointer;
}
</style>
<div class="row">
<div class="col-sm-12">
<div class="card card-hovered mb20 card-primary">
<div class="card-header">
{if in_array($_admin['user_type'],['SuperAdmin','Admin'])}
<div class="btn-group pull-right">
<a class="btn btn-primary btn-xs" title="save" href="{$_url}customers/csv"
onclick="return confirm('This will export to CSV?')"><span class="fa fa-download"
aria-hidden="true"></span> CSV</a>
</div>
{/if}
{Lang::T('Manage Contact')}
</div>
<div class="card-body">
<div class="md-whiteframe-z1 mb20 text-center">
<div class="col-md-6">
<form method="post" action="{$_url}customers/list" class="form-inline">
<div class="form-group">
<label for="filter" class="control-label" style="margin-right: 10px;">{Lang::T('Filter by Status')}:</label>
<select name="filter" id="filter" class="form-control" onchange="this.form.submit()">
<option value="All" {if $filter == 'All'}selected{/if}>{Lang::T('All Status')}</option>
{foreach $statuses as $status}
<option value="{$status}" {if $filter == $status}selected{/if}>{$status}</option>
{/foreach}
</select>
</div>
</form>
</div>
<div class="col-md-6">
<a href="{$_url}customers/add" class="btn btn-primary btn-block"><i class="fa fa-plus">
</i> {Lang::T('Add New Client')}</a>
</div>&nbsp;
</div>
<div class="table-responsive table_mobile">
<div class="alert alert-info">
<strong>{Lang::T('Showing')}:</strong> {count($d)} {Lang::T('customers')}
{if $filter != 'All'}({Lang::T('Status')}: {$filter}){/if}
</div>
<table id="customerTable" class="table table-bordered table-striped table-condensed">
<thead>
<tr>
<th>{Lang::T('Full Name')}</th>
<th>{Lang::T('Username')}</th>
<th>{Lang::T('Acc Type')}</th>
<th>{Lang::T('Area')}</th>
<th>{Lang::T('Package')}</th>
<th>{Lang::T('Service')}</th>
<th>{Lang::T('Status')}</th>
<!--<th>{Lang::T('Created On')}</th>-->
<th>{Lang::T('Manage')}</th>
</tr>
</thead>
<tbody>
{foreach $d as $ds}
<tr {if $ds['status'] != 'Active'}class="danger"{/if}>
<td onclick="window.location.href = '{$_url}customers/view/{$ds['id']}'"
style="cursor: pointer;">{$ds['fullname']}</td>
<td onclick="window.location.href = '{$_url}customers/view/{$ds['id']}'"
style="cursor:pointer;">{$ds['username']}</td>
<td>{$ds['account_type']}</td>
<td>{$ds['address']}</td>
<td align="center" api-get-text="{$_url}autoload/customer_is_active/{$d['id']}">
<span class="label label-default">&bull;</span>
</td>
<td>{$ds['service_type']}</td>
<td>
<span class="label label-{if $ds['status'] == 'Active'}success{elseif $ds['status'] == 'Banned'}danger{elseif $ds['status'] == 'Disabled'}warning{elseif $ds['status'] == 'Suspended'}danger{elseif $ds['status'] == 'Limited'}warning{else}default{/if}">
{$ds['status']}
</span>
</td>
<!--<td>{Lang::dateTimeFormat($ds['created_at'])}</td>-->
<td align="center">
<a href="{$_url}customers/view/{$ds['id']}" id="{$ds['id']}"
style="margin: 0px; color:black"
class="btn btn-success btn-xs">&nbsp;&nbsp;{Lang::T('View')}&nbsp;&nbsp;</a>
<a href="{$_url}customers/edit/{$ds['id']}" id="{$ds['id']}"
style="margin: 0px; color:black"
class="btn btn-info btn-xs">&nbsp;&nbsp;{Lang::T('Edit')}&nbsp;&nbsp;</a>
<a href="{$_url}plan/recharge/{$ds['id']}" id="{$ds['id']}" style="margin: 0px;color:black;"
class="btn btn-warning btn-xs">{Lang::T('Recharge')}</a>
</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.min.js"></script>
<script>
var $j = jQuery.noConflict();
$j(document).ready(function () {
$j('#customerTable').DataTable({
"pagingType": "full_numbers"
});
});
</script>
</div>
{include file="sections/footer.tpl"}

497
ui/ui/dashboard.tpl Normal file
View File

@@ -0,0 +1,497 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<style>
.icon i{
font-size: 36px;
}
</style>
<div class="row">
<div class="col-xl-3 col-xxl-3 col-lg-6 col-sm-6">
<div class="card card-bd">
<div class="bg-secondary card-border" style="background:#3444d5 !important;"></div>
<div class="card-body box-style">
<div class="media align-items-center col">
<div class="inner media-body me-3">
<h4 class=" num-text text-black font-w200 fs-48">{$_c['currency_code']}{number_format($iday,0,$_c['dec_point'],$_c['thousands_sep'])}</h4>
<p class="fs-14">{Lang::T('Income Today')}</p>
</div>
<div class="icon" style="color: #864AD1;">
<i class="fas fa-dollar-sign"></i>
</div>
</div>
<div class="">
<a href="{$_url}reports/by-date" class="small-box-footer" style="color: #fc5130;">{Lang::T('View Reports')} <i
class="fa fa-arrow-circle-right"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-lg-6 col-sm-6">
<div class="card card-bd">
<div class="bg-warning card-border"></div>
<div class="card-body">
<div class="media align-items-center col">
<div class="inner media-body me-3">
<h4 class="num-text text-black font-w200 fs-48">{$_c['currency_code']}{number_format($imonth,0,$_c['dec_point'],$_c['thousands_sep'])}</h4>
<p class="fs-14">{Lang::T('Income This Month')}</p>
</div>
<!--<div class="icon" style="color: #FFB930;">
<i class="fa fa-chart-bar"></i>
</div>-->
</div>
<div class="">
<a href="{$_url}reports/by-period" class="small-box-footer" style="color: #fc5130;">{Lang::T('View Reports')} <i
class="fa fa-arrow-circle-right"></i></a>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-lg-6 col-sm-6">
<div class="card card-bd">
<div class="bg-success card-border"></div>
<div class="card-body box-style">
<div class="media align-items-center col">
<div class="inner media-body me-3">
<h4 class="num-text text-black font-w200 fs-48">{$u_act}/{$u_all}</h4>
<p class="fs-14">{Lang::T('Users Active')}</p>
</div>
<div class="icon" style="color: #20F174;">
<i class="fa fa-users"></i>
</div>
</div>
<div class="">
<a href="{$_url}plan/list" class="small-box-footer" style="color: #fc5130;">{Lang::T('View All')} <i
class="fa fa-arrow-circle-right"></i></a>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-lg-6 col-sm-6">
<div class="card card-bd">
<div class="bg-info card-border"></div>
<div class="card-body box-style">
<div class="media align-items-center col">
<div class="inner media-body me-3">
<h4 class="num-text text-black font-w200 fs-48">{$c_all}</h4>
<p class="fs-14">{Lang::T('Total Users')}</p>
</div>
<div class="icon" style="color: #3ECDFF;">
<i class="fa fa-users"></i>
</div>
</div>
<div class="" >
<a href="{$_url}customers/list" class="small-box-footer" style="color: #fc5130;">{Lang::T('View All')} <i
class="fa fa-arrow-circle-right"></i></a>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xl-3 col-xxl-3 col-lg-6 col-sm-6">
<div class="card card-bd">
<div class="bg-secondary card-border" style="background:#3444d5 !important;"></div>
<div class="card-body box-style">
<div class="media align-items-center col">
<div class="inner media-body me-3">
<h4 class=" num-text text-black font-w200 fs-48" id="total-online-users"></h4>
<p class="fs-14">{Lang::T('Online Users')}</p>
</div>
<div class="icon" style="color: #864AD1;">
<i class="fas fa-users"></i>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-lg-6 col-sm-6">
<div class="card card-bd">
<div class="bg-warning card-border"></div>
<div class="card-body">
<div class="media align-items-center col">
<div class="inner media-body me-3">
<h4 class="num-text text-black font-w200 fs-48" id="total_data"></h4>
<p class="fs-14">{Lang::T('Data Usage')}</p>
</div>
<div class="icon" style="color: #FFB930;">
<i class="fas fa-signal"></i>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-lg-6 col-sm-6">
<div class="card card-bd">
<div class="bg-success card-border"></div>
<div class="card-body box-style">
<div class="media align-items-center col">
<div class="inner media-body me-3">
<h4 class="num-text text-black font-w200 fs-48" id="online-hotspot-users"></h4>
<p class="fs-14">{Lang::T('Online Hotspot Users')}</p>
</div>
<div class="icon" style="color: #20F174;">
<i class="fas fa-wifi"></i>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-lg-6 col-sm-6">
<div class="card card-bd">
<div class="bg-info card-border"></div>
<div class="card-body box-style">
<div class="media align-items-center col">
<div class="inner media-body me-3">
<h4 class="num-text text-black font-w200 fs-48" id="online-pppoe-users"></h4>
<p class="fs-14">{Lang::T('Online PPPoE Users')}</p>
</div>
<div class="icon" style="color: #3ECDFF;">
<i class="fas fa-network-wired"></i>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<!-- solid sales graph -->
{if $_c['hide_mrc'] != 'yes'}
<div class="card">
<div class="card-header">
<i class="fa fa-th"></i>
<h3 class="card-title">{Lang::T('Monthly Customers')}</h3>
<div class="card-tools pull-right">
<a href="{$_url}dashboard&refresh" class="btn bg-teal btn-xsm"><i
class="fa fa-refresh"></i>
</a>
</div>
</div>
<!-- <div class="card-body text-center pb-0 px-2 pt-2">
<div id="widgetChart1" class="widgetChart1 dashboard-chart"></div>
</div> -->
<div class="card-body border-radius-none">
<canvas class="chart" id="chart" style="height: 200px;"></canvas>
</div>
</div>
{/if}
</div>
<div class="col-md-6">
<!-- solid sales graph -->
{if $_c['hide_tms'] != 'yes'}
<div class="card card-solid ">
<div class="card-header">
<i class="fa fa-inbox"></i>
<h3 class="card-title">{Lang::T('Total Monthly Sales')}</h3>
<div class="card-tools pull-right">
<a href="{$_url}dashboard&refresh" class="btn bg-teal btn-sm"><i
class="fa fa-refresh"></i>
</a>
</div>
</div>
<!-- <div class="card-body pb-0 px-2 pt-2">
<div id="chartTimeline" class="timeline-chart"></div>
</div> -->
<div class="card-body border-radius-none">
<canvas id="salesChart" class="monthly-project-chart" style="height: 200px;"></canvas>
</div>
</div>
{/if}
</div>
<div class="col-md-12">
{if $_c['hide_uet'] != 'yes'}
<div class="card card-warning card-hovered project-stats table-responsive">
<div class="card-header">
<h3 class="card-title">{Lang::T('Expired Users')}</h3></div>
<div class="card-body">
<div class="table-responsive">
<table class="table table-striped table-condensed">
<thead>
<tr>
<th>{Lang::T('Fullname')}</th>
<th>{Lang::T('Username')}</th>
<th>{Lang::T('Created On')}</th>
<th>{Lang::T('Expires On')}</th>
<th>{Lang::T('Router')}</th>
<th>{Lang::T('Package')}</th>
<th>{Lang::T('Action')}</th>
</tr>
</thead>
<tbody>
{foreach $expire as $expired}
<tr>
<td><a href="{$_url}customers/viewu/{$expired['username']}">{$expired['fullname']}</a></td>
<td><a href="{$_url}customers/viewu/{$expired['username']}">{$expired['username']}</a></td>
<td>{Lang::dateAndTimeFormat($expired['recharged_on'],$expired['recharged_time'])}
</td>
<td>{Lang::dateAndTimeFormat($expired['expiration'],$expired['time'])}
</td>
<td>{$expired['routers']}</td>
<td>{$expired['namebp']}</td>
<td>
<a href="{$_url}plan/recharge/{$expired['customer_id']}" id="{$expired['customer_id']}" style="margin: 0px;color:black;"
class="btn btn-warning btn-xs">{Lang::T('Recharge')}</a>
</td>
</tr>
</tbody>
{/foreach}
</table>
</div>
&nbsp; {include file="pagination.tpl"}
</div>
</div>
{/if}
</div>
<div class="col-md-6">
{if $_c['disable_voucher'] != 'yes' && $stocks['unused']>0 || $stocks['used']>0}
{if $_c['hide_vs'] != 'yes'}
<div class="card card-primary card-hovered project-stats">
<div class="card-header">Vouchers Stock</div>
<div class="table-responsive">
<table class="table table-striped table-condensed">
<thead>
<tr>
<th>{Lang::T('Plan Name')}</th>
<th>unused</th>
<th>used</th>
</tr>
</thead>
<tbody>
{foreach $plans as $stok}
<tr>
<td>{$stok['name_plan']}</td>
<td>{$stok['unused']}</td>
<td>{$stok['used']}</td>
</tr>
</tbody>
{/foreach}
<tr>
<td>Total</td>
<td>{$stocks['unused']}</td>
<td>{$stocks['used']}</td>
</tr>
</table>
</div>
</div>
{/if}
{/if}
</div>
</div>
<div class="row">
<div class="col-md-6">
{if $_c['hide_aui'] != 'yes'}
<div class="card card-hovered activities">
<div class="card-header"><h3 class="card-title">{Lang::T('All Users Insights')}</h3></div>
<div class="card-body">
<canvas id="userRechargesChart" style="height: 600px;"></canvas>
</div>
</div>
{/if}
</div>
<div class="col-md-6">
{if $_c['hide_al'] != 'yes'}
<div class="card card-info card-hovered activities" style="height: 600px;">
<div class="card-header"><a class="card-title" href="{$_url}logs">{Lang::T('Activity Log')}</a></div>
<div class="card-body">
<div id="DZ_W_TimeLine" class="widget-timeline dz-scroll ps ps--active-y" style="height: 460px;">
<ul class="timeline">
{foreach $dlog as $dlogs}
<li class="primary">
<div class="timeline-badge primary"></div>
<div class="timeline-panel text-muted">
<span class="point"></span>
<span class="time small text-muted">{Lang::timeElapsed($dlogs['date'],true)}</span>
<p>{$dlogs['description']}</p>
</div>
</li>
{/foreach}
</ul>
</div>
</div>
</div>
{/if}
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/chart.js@3.5.1/dist/chart.min.js"></script>
<script type="text/javascript">
{if $_c['hide_mrc'] != 'yes'}
{literal}
document.addEventListener("DOMContentLoaded", function() {
var counts = JSON.parse('{/literal}{$monthlyRegistered|json_encode}{literal}');
var monthNames = [
'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'
];
var labels = [];
var data = [];
for (var i = 1; i <= 12; i++) {
var month = counts.find(count => count.date === i);
labels.push(month ? monthNames[i - 1] : monthNames[i - 1].substring(0, 3));
data.push(month ? month.count : 0);
}
var ctx = document.getElementById('chart').getContext('2d');
var chart = new Chart(ctx, {
type: 'bar',
data: {
labels: labels,
datasets: [{
label: 'Registered Members',
data: data,
backgroundColor: '#fc5130',
borderColor: '#fc5130',
borderWidth: 1
}]
},
options: {
responsive: true,
scales: {
x: {
grid: {
display: false
}
},
y: {
beginAtZero: true,
grid: {
color: 'rgba(0, 0, 0, 0.1)'
}
}
}
}
});
});
{/literal}
{/if}
{if $_c['hide_tmc'] != 'yes'}
{literal}
document.addEventListener("DOMContentLoaded", function() {
var monthlySales = JSON.parse('{/literal}{$monthlySales|json_encode}{literal}');
var monthNames = [
'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'
];
var labels = [];
var data = [];
for (var i = 1; i <= 12; i++) {
var month = findMonthData(monthlySales, i);
labels.push(month ? monthNames[i - 1] : monthNames[i - 1].substring(0, 3));
data.push(month ? month.totalSales : 0);
}
var ctx = document.getElementById('salesChart').getContext('2d');
var chart = new Chart(ctx, {
type: 'bar',
//type: 'radialBar',
data: {
labels: labels,
datasets: [{
label: 'Monthly Sales',
data: data,
backgroundColor: '#fc5130', // Customize the background color
borderColor: '#fc5130', // Customize the border color
borderWidth: 2
}]
},
options: {
responsive: true,
scales: {
x: {
grid: {
display: false
}
},
y: {
beginAtZero: true,
grid: {
color: 'rgba(0, 0, 0, 0.1)'
}
}
}
}
});
});
function findMonthData(monthlySales, month) {
for (var i = 0; i < monthlySales.length; i++) {
if (monthlySales[i].month === month) {
return monthlySales[i];
}
}
return null;
}
{/literal}
{/if}
{if $_c['hide_aui'] != 'yes'}
{literal}
document.addEventListener("DOMContentLoaded", function() {
// Get the data from PHP and assign it to JavaScript variables
var u_act = '{/literal}{$u_act}{literal}';
var c_all = '{/literal}{$c_all}{literal}';
var u_all = '{/literal}{$u_all}{literal}';
//lets calculate the inactive users as reported
var expired = u_all - u_act;
var inactive = c_all - u_all;
// Create the chart data
var data = {
labels: ['Active Users', 'Expired Users', 'Inactive Users'],
datasets: [{
label: 'User Recharges',
data: [parseInt(u_act), parseInt(expired), parseInt(inactive)],
backgroundColor: ['rgba(4, 191, 13)', 'rgba(191, 35, 4)', 'rgba(0, 0, 255, 0.5'],
borderColor: ['rgba(0, 255, 0, 1)', 'rgba(255, 99, 132, 1)', 'rgba(0, 0, 255, 0.7'],
borderWidth: 1
}]
};
// Create chart options
var options = {
responsive: true,
aspectRatio: 1,
plugins: {
legend: {
position: 'bottom',
labels: {
boxWidth: 15
}
}
}
};
// Get the canvas element and create the chart
var ctx = document.getElementById('userRechargesChart').getContext('2d');
var chart = new Chart(ctx, {
type: 'pie',
data: data,
options: options
});
});
{/literal}
{/if}
</script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$.ajax({
url: "{$_url}onlineusers/summary", // Adjust this URL to your actual endpoint
type: 'GET',
dataType: 'json', // Ensure the expected response is JSON
success: function(data) {
console.log('Data fetched successfully:', data);
// Check if data is null or missing properties and set defaults to 0
$('#total-online-users').text(data.total_users || 0);
$('#online-hotspot-users').text(data.hotspot_users || 0);
$('#online-pppoe-users').text(data.ppp_users || 0);
$('#total_data').text(data.total_bytes || 0);
},
error: function(error) {
console.log('Error fetching data:', error);
// Set all values to 0 in case of an error
$('#total-online-users').text(0);
$('#online-hotspot-users').text(0);
$('#online-pppoe-users').text(0);
$('#total_data').text(0);
}
});
});
</script>
{include file="sections/footer.tpl"}

61
ui/ui/dbstatus.tpl Normal file
View File

@@ -0,0 +1,61 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-7">
<div class="card card-primary">
<div class="card-header">Backup Database</div>
<form method="post" action="{$_url}settings/dbbackup">
<div class="table-responsive">
<table class="table table-bordered table-striped">
<thead>
<tr>
<th width="50%">{Lang::T('Table Name')}</th>
<th>{Lang::T('Rows')}</th>
<th>Select</th>
</tr>
</thead>
<tbody>
{foreach $tables as $tbl}
<tr>
<td>{$tbl['name']}</td>
<td>{$tbl['rows']}</td>
<td><input type="checkbox" checked name="tables[]" value="{$tbl['name']}"></td>
</tr>
{/foreach}
</tbody>
</table>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-6">Dont select logs if it failed</div>
<div class="col-md-4 text-right">
<button type="submit" class="btn btn-primary btn-xs btn-block"><i
class="fa fa-download"></i>
{Lang::T('Download Database Backup')}</button>
</div>
</div>
</div>
</form>
</div>
</div>
<div class="col-sm-5">
<div class="card card-primary">
<div class="card-header">Restore Database</div>
<form method="post" action="{$_url}settings/dbrestore" enctype="multipart/form-data">
<div class="card-body">
<div class="row">
<div class="col-md-7"><input type="file" name="json" accept="application/json"></div>
<div class="col-md-5 text-right">
<button type="submit" class="btn btn-primary btn-block btn-xs"><i class="fa fa-upload"></i>
Restore Dabase</button>
</div>
</div>
</div>
</form>
<div class="card-footer">Restoring database will clean up data and then restore all the data</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

183
ui/ui/deposit.tpl Normal file
View File

@@ -0,0 +1,183 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">{Lang::T('Refill Balance')}</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}plan/deposit-post">
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Select Account')}</label>
<div class="col-md-6">
<select id="personSelect" class="form-control select2" name="id_customer" style="width: 100%; cursor: pointer; z-index: 1000;"
data-placeholder="{Lang::T('Select a customer')}..." data-ajax="true">
</select>
<span class="help-block" id="customer-help">
{Lang::T('Start typing to search for customers')}
</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label"><a href="{$_url}services/balance">{Lang::T('Balance Plans')}</a></label>
<div class="col-md-6">
<select id="planSelect" class="form-control select2" name="id_plan" style="width: 100%; cursor: pointer; z-index: 1000;"
data-placeholder="{Lang::T('Select Plans')}...">
<option></option>
{foreach $p as $pl}
<option value="{$pl['id']}">{if $pl['enabled'] neq 1}DISABLED PLAN &bull; {/if}{$pl['name_plan']} - {Lang::moneyFormat($pl['price'])}</option>
{/foreach}
</select>
<span class="help-block" id="plan-help">
{Lang::T('Select a balance plan for the customer')}
</span>
</div>
</div>
<center>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-success"
type="submit">{Lang::T('Recharge')}</button>
Or <a href="{$_url}customers/list">{Lang::T('Cancel')}</a>
</div>
</div>
</center>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}
<script>
$(document).ready(function() {
console.log('Deposit form loaded');
console.log('jQuery version:', $.fn.jquery);
console.log('Select2 available:', typeof $.fn.select2);
// Initialize customer select2 with AJAX
if ($('#personSelect').length > 0) {
console.log('Initializing customer select2 with AJAX');
setTimeout(function() {
try {
// Destroy existing select2 if it exists
if ($('#personSelect').hasClass('select2-hidden-accessible')) {
$('#personSelect').select2('destroy');
console.log('Destroyed existing customer select2');
}
$('#personSelect').select2({
theme: "bootstrap",
width: '100%',
ajax: {
url: function(params) {
var url = './index.php?_route=autoload/customer_select2';
if(params.term != undefined){
url += '&s=' + encodeURIComponent(params.term);
}
console.log('Customer AJAX URL:', url);
return url;
},
dataType: 'json',
delay: 250,
data: function (params) {
return {
s: params.term || '',
page: params.page || 1
};
},
processResults: function (data, params) {
console.log('Customer AJAX response:', data);
return {
results: data.results || []
};
},
cache: true,
error: function(xhr, status, error) {
console.error('Customer AJAX error:', error);
console.error('Response:', xhr.responseText);
}
},
minimumInputLength: 0,
placeholder: '{Lang::T('Select a customer')}...',
allowClear: true
});
console.log('Customer select2 initialized with AJAX');
// Update customer help text
$("#customer-help").text('Start typing to search for customers');
} catch (error) {
console.error('Error initializing customer select2:', error);
}
}, 200);
// Add customer dropdown event handlers
$('#personSelect').on('select2:open', function() {
console.log('Customer dropdown opened');
});
$('#personSelect').on('select2:select', function(e) {
console.log('Customer selected:', e.params.data);
});
}
// Initialize plan select2 (static data)
if ($('#planSelect').length > 0) {
console.log('Initializing plan select2 with static data');
setTimeout(function() {
try {
// Destroy existing select2 if it exists
if ($('#planSelect').hasClass('select2-hidden-accessible')) {
$('#planSelect').select2('destroy');
console.log('Destroyed existing plan select2');
}
$('#planSelect').select2({
theme: "bootstrap",
width: '100%',
placeholder: '{Lang::T('Select Plans')}...',
allowClear: true
});
console.log('Plan select2 initialized with static data');
// Count available plans and update help text
var planCount = $("#planSelect option").length - 1; // Subtract 1 for empty option
console.log('Plan count:', planCount);
if (planCount > 0) {
$("#plan-help").text('Found ' + planCount + ' balance plan(s) available');
} else {
$("#plan-help").text('No balance plans found. Please create balance plans first.');
}
} catch (error) {
console.error('Error initializing plan select2:', error);
}
}, 200);
// Add plan dropdown event handlers
$('#planSelect').on('select2:open', function() {
console.log('Plan dropdown opened');
});
$('#planSelect').on('select2:select', function(e) {
console.log('Plan selected:', e.params.data);
});
}
// Test AJAX endpoints directly
$.ajax({
url: './index.php?_route=autoload/customer_select2',
dataType: 'json',
success: function(data) {
console.log('Customer AJAX test successful:', data);
},
error: function(xhr, status, error) {
console.error('Customer AJAX test failed:', error);
console.error('Response:', xhr.responseText);
}
});
});
</script>

222
ui/ui/hotspot-add.tpl Normal file
View File

@@ -0,0 +1,222 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">{Lang::T('Add Service Plan')}</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}services/add-post">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Status')}</label>
<div class="col-md-10">
<input type="radio" name="enabled" value="1" checked> Enable
<input type="radio" name="enabled" value="0"> Disable
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Type')}</label>
<div class="col-md-10">
<input type="radio" name="prepaid" onclick="prePaid()" value="yes" checked> Prepaid
<input type="radio" name="prepaid" onclick="postPaid()" value="no"> Postpaid
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Plan Type')}</label>
<div class="col-md-10">
<input type="radio" name="plan_type" value="Personal" checked> Personal
<input type="radio" name="plan_type" value="Business"> Business
</div>
</div>
{if $_c['radius_enable']}
<div class="form-group row">
<label class="col-md-2 control-label">Radius</label>
<div class="col-md-6">
<label class="radio-inline">
<input type="checkbox" name="radius" onclick="isRadius(this)" value="1"> Radius Plan
</label>
</div>
<p class="help-block col-md-4">{Lang::T('Cannot be change after saved')}</p>
</div>
{/if}
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Plan Name')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="name" name="name" maxlength="40">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Plan Type')}</label>
<div class="col-md-10">
<input type="radio" id="Unlimited" name="typebp" value="Unlimited" checked>
{Lang::T('Unlimited')}
<input type="radio" id="Limited" name="typebp" value="Limited"> {Lang::T('Limited')}
</div>
</div>
<div style="display:none;" id="Type">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Limit Type')}</label>
<div class="col-md-10">
<input type="radio" id="Time_Limit" name="limit_type" value="Time_Limit" checked>
{Lang::T('Time Limit')}
<input type="radio" id="Data_Limit" name="limit_type" value="Data_Limit">
{Lang::T('Data Limit')}
<input type="radio" id="Both_Limit" name="limit_type" value="Both_Limit">
{Lang::T('Both Limit')}
</div>
</div>
</div>
<div style="display:none;" id="TimeLimit">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Time Limit')}</label>
<div class="col-md-4">
<input type="text" class="form-control" id="time_limit" name="time_limit" value="0">
</div>
<div class="col-md-2">
<select class="form-select select2" id="time_unit" name="time_unit">
<option value="Hrs">{Lang::T('Hrs')}</option>
<option value="Mins">{Lang::T('Mins')}</option>
</select>
</div>
</div>
</div>
<div style="display:none;" id="DataLimit">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Data Limit')}</label>
<div class="col-md-4">
<input type="text" class="form-control" id="data_limit" name="data_limit" value="0">
</div>
<div class="col-md-2">
<select class="form-select" style="height: 52px; background-color: white;" id="data_unit" name="data_unit">
<option value="MB">MBs</option>
<option value="GB">GBs</option>
</select>
</div>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label"><a
href="{$_url}bandwidth/add">{Lang::T('Bandwidth Name')}</a></label>
<div class="col-md-6">
<select id="id_bw" name="id_bw" class="form-select select2">
<option value="">{Lang::T('Select Bandwidth')}...</option>
{foreach $d as $ds}
<option value="{$ds['id']}">{$ds['name_bw']}</option>
{/foreach}
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Plan Price')}</label>
<div class="col-md-6">
<div class="input-group">
<span class="input-group-text" id="basic-addon1">{$_c['currency_code']}</span>
<input type="number" class="form-control" name="price" required>
</div>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Shared Users')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="sharedusers" name="sharedusers" value="1">
<p class="help-block">{Lang::T('1 user can be used for many devices?')}</p>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Plan Validity')}</label>
<div class="col-md-4">
<input type="text" class="form-control" id="validity" name="validity">
</div>
<div class="col-md-2">
<select class="form-select select2" id="validity_unit" name="validity_unit">
</select>
</div>
<p class="help-block col-md-4">{Lang::T('1 Period = 1 Month, Expires the 20th of each month')}</p>
</div>
<span id="routerChoose" class="">
<div class="form-group row">
<label class="col-md-2 control-label"><a
href="{$_url}routers/add">{Lang::T('Router Name')}</a></label>
<div class="col-md-6">
<select id="routers" name="routers" required class="form-select select2">
<option value=''>{Lang::T('Select Routers')}</option>
{foreach $r as $rs}
<option value="{$rs['name']}">{$rs['name']}</option>
{/foreach}
</select>
<p class="help-block">{Lang::T('Cannot be change after saved')}</p>
</div>
</div>
</span>
<legend>{Lang::T('Expired Action')}</legend>
<div class="form-group row" id="ipPool">
<label class="col-md-2 control-label"><a
href="{$_url}pool/add">{Lang::T('Expired IP Pool')}</a></label>
<div class="col-md-6">
<select id="pool_expired" name="pool_expired" class="form-select select2">
<option value=''>{Lang::T('Select Pool')}</option>
</select>
</div>
</div>
{* <div class="form-group row" id="AddressList">
<label class="col-md-2 control-label">{Lang::T('Address List')}</label>
<div class="col-md-6">
<input type="text" class="form-control" name="list_expired" id="list_expired">
</div>
</div> *}
<center>
<div class="form-group row">
<div class="col-md-offset-2 col-md-10">
<button class="btn btn-success" type="submit">{Lang::T('Save Changes')}</button>
Or <a href="{$_url}services/hotspot">{Lang::T('Cancel')}</a>
</div>
</div>
</center>
</form>
</div>
</div>
</div>
</div>
<script>
var preOpt = `<option value="Mins">{Lang::T('Mins')}</option>
<option value="Hrs">{Lang::T('Hrs')}</option>
<option value="Days">{Lang::T('Days')}</option>
<option value="Months">{Lang::T('Months')}</option>`;
var postOpt = `<option value="Period">{Lang::T('Period')}</option>`;
function prePaid() {
$("#validity_unit").html(preOpt);
}
function postPaid() {
$("#validity_unit").html(postOpt);
}
document.addEventListener("DOMContentLoaded", function(event) {
prePaid()
})
</script>
{if $_c['radius_enable']}
{literal}
<script>
function isRadius(cek) {
if (cek.checked) {
$("#routerChoose").addClass('hidden');
document.getElementById("routers").required = false;
$("#pool_expired").html('');
$.ajax({
url: "index.php?_route=autoload/pool",
data: "routers=radius",
cache: false,
success: function(msg) {
$("#pool_expired").html(msg);
}
});
} else {
document.getElementById("routers").required = true;
$("#routerChoose").removeClass('hidden');
}
}
</script>
{/literal}
{/if}
</div>
{include file="sections/footer.tpl"}

258
ui/ui/hotspot-edit.tpl Normal file
View File

@@ -0,0 +1,258 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">{Lang::T('Edit Service Plan')} || {$d['name_plan']}</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}services/edit-post">
<input type="hidden" name="id" value="{$d['id']}">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Status')}</label>
<div class="col-md-10">
<input type="radio" name="enabled" value="1" {if $d['enabled'] == 1}checked{/if}> Enable
<input type="radio" name="enabled" value="0" {if $d['enabled'] == 0}checked{/if}> Disable
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Type')}</label>
<div class="col-md-10">
<input type="radio" name="prepaid" onclick="prePaid()" value="yes"
{if $d['prepaid'] == yes}checked{/if}>
Prepaid
<input type="radio" name="prepaid" onclick="postPaid()" value="no"
{if $d['prepaid'] == no}checked{/if}> Postpaid
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Plan Type')}</label>
<div class="col-md-10">
<input type="radio" name="plan_type" value="Personal"
{if $d['plan_type'] == 'Personal'}checked{/if}>
Personal
<input type="radio" name="plan_type" value="Business"
{if $d['plan_type'] == 'Business'}checked{/if}> Business
</div>
</div>
{if $_c['radius_enable'] and $d['is_radius']}
<div class="form-group row">
<label class="col-md-2 control-label">Radius</label>
<div class="col-md-10">
<label class="label label-primary">RADIUS</label>
</div>
</div>
{/if}
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Plan Name')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="name" name="name" maxlength="40"
value="{$d['name_plan']}">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Plan Type')}</label>
<div class="col-md-10">
<input type="radio" id="Unlimited" name="typebp" value="Unlimited"
{if $d['typebp'] eq 'Unlimited'} checked {/if}> {Lang::T('Unlimited')}
<input type="radio" id="Limited" {if $_c['radius_enable'] and $d['is_radius']}disabled{/if}
name="typebp" value="Limited" {if $d['typebp'] eq 'Limited'} checked {/if}>
{Lang::T('Limited')}
</div>
</div>
<div {if $d['typebp'] eq 'Unlimited'} style="display:none;" {/if} id="Type">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Limit Type')}</label>
<div class="col-md-10">
<input type="radio" id="Time_Limit" name="limit_type" value="Time_Limit"
{if $d['limit_type'] eq 'Time_Limit'} checked {/if}> {Lang::T('Time Limit')}
<input type="radio" id="Data_Limit" name="limit_type" value="Data_Limit"
{if $d['limit_type'] eq 'Data_Limit'} checked {/if}> {Lang::T('Data Limit')}
<input type="radio" id="Both_Limit" name="limit_type" value="Both_Limit"
{if $d['limit_type'] eq 'Both_Limit'} checked {/if}> {Lang::T('Both Limit')}
</div>
</div>
</div>
<div {if $d['typebp'] eq 'Unlimited'} style="display:none;"
{elseif ($d['time_limit']) eq '0'}
style="display:none;" {/if} id="TimeLimit">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Time Limit')}</label>
<div class="col-md-4">
<input type="text" class="form-control" id="time_limit" name="time_limit"
value="{$d['time_limit']}">
</div>
<div class="col-md-2">
<select class="form-select" style="height: 52px; background-color: white;" id="time_unit" name="time_unit">
<option value="Hrs" {if $d['time_unit'] eq 'Hrs'} selected {/if}>{Lang::T('Hrs')}
</option>
<option value="Mins" {if $d['time_unit'] eq 'Mins'} selected {/if}>{Lang::T('Mins')}
</option>
</select>
</div>
</div>
</div>
<div {if $d['typebp'] eq 'Unlimited'} style="display:none;"
{elseif ($d['data_limit']) eq '0'}
style="display:none;" {/if} id="DataLimit">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Data Limit')}</label>
<div class="col-md-4">
<input type="text" class="form-control" id="data_limit" name="data_limit"
value="{$d['data_limit']}">
</div>
<div class="col-md-2">
<select class="form-select" style="height: 52px; background-color: white;" id="data_unit" name="data_unit">
<option value="MB" {if $d['data_unit'] eq 'MB'} selected {/if}>MBs</option>
<option value="GB" {if $d['data_unit'] eq 'GB'} selected {/if}>GBs</option>
</select>
</div>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label"><a
href="{$_url}bandwidth/add">{Lang::T('Bandwidth Name')}</a></label>
<div class="col-md-6">
<select id="id_bw" name="id_bw" class="form-select" style="height: 52px; background-color: white;">
{foreach $b as $bs}
<option value="{$bs['id']}" {if $d['id_bw'] eq $bs['id']} selected {/if}>
{$bs['name_bw']}</option>
{/foreach}
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Plan Price')}</label>
<div class="col-md-6">
<div class="input-group">
<span class="input-group-text" id="basic-addon1">{$_c['currency_code']}</span>
<input type="number" class="form-control" name="price" value="{$d['price']}" required>
</div>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Shared Users')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="sharedusers" name="sharedusers"
value="{$d['shared_users']}">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Plan Validity')}</label>
<div class="col-md-4">
<input type="text" class="form-control" id="validity" name="validity"
value="{$d['validity']}">
</div>
<div class="col-md-2">
<select class="form-select" style="height: 52px; background-color: white;" id="validity_unit" name="validity_unit">
{if $d['prepaid'] == yes}
<option value="Mins" {if $d['validity_unit'] eq 'Mins'} selected {/if}>{Lang::T('Mins')}
</option>
<option value="Hrs" {if $d['validity_unit'] eq 'Hrs'} selected {/if}>{Lang::T('Hrs')}
</option>
<option value="Days" {if $d['validity_unit'] eq 'Days'} selected {/if}>{Lang::T('Days')}
</option>
<option value="Months" {if $d['validity_unit'] eq 'Months'} selected {/if}>
{Lang::T('Months')}</option>
{else}
<option value="Period" {if $d['validity_unit'] eq 'Period'} selected {/if}>
{Lang::T('Period')}</option>
{/if}
</select>
</div>
<p class="help-block col-md-4">{Lang::T('1 Period = 1 Month, Expires the 20th of each month')}
</p>
</div>
<span id="routerChoose" class="{if $d['is_radius']}hidden{/if}">
<div class="form-group row">
<label class="col-md-2 control-label"><a
href="{$_url}routers/add">{Lang::T('Router Name')}</a></label>
<div class="col-md-6">
<input type="text" class="form-control" id="routers" name="routers"
value="{$d['routers']}" readonly>
</div>
</div>
</span>
<legend>{Lang::T('Expired Action')} <sub>{Lang::T('Optional')}</sub></legend>
<div class="form-group row">
<label class="col-md-2 control-label"><a
href="{$_url}pool/add">{Lang::T('Expired IP Pool')}</a></label>
<div class="col-md-6">
<select id="pool_expired" name="pool_expired" class="form-select" style="height: 52px; background-color: white;">
<option value=''>{Lang::T('Select Pool')}</option>
{foreach $p as $ps}
<option value="{$ps['pool_name']}" {if $d['pool_expired'] eq $ps['pool_name']} selected
{/if}>{$ps['pool_name']}</option>
{/foreach}
</select>
</div>
</div>
{* <div class="form-group row" id="AddressList">
<label class="col-md-2 control-label">{Lang::T('Address List')}</label>
<div class="col-md-6">
<input type="text" class="form-control" name="list_expired" id="list_expired" value="{$d['list_expired']}">
</div>
</div> *}
<center>
<div class="form-group row">
<div class="col-md-offset-2 col-md-10">
<button class="btn btn-success" type="submit">{Lang::T('Save Changes')}</button>
Or <a href="{$_url}services/hotspot">{Lang::T('Cancel')}</a>
</div>
</div>
</center>
</form>
</div>
</div>
</div>
</div>
<script>
var preOpt = `<option value="Mins">{Lang::T('Mins')}</option>
<option value="Hrs">{Lang::T('Hrs')}</option>
<option value="Days">{Lang::T('Days')}</option>
<option value="Months">{Lang::T('Months')}</option>`;
var postOpt = `<option value="Period">{Lang::T('Period')}</option>`;
function prePaid() {
$("#validity_unit").html(preOpt);
}
function postPaid() {
$("#validity_unit").html(postOpt);
}
</script>
{if $_c['radius_enable'] && $d['is_radius']}
{literal}
<script>
function isRadius(cek) {
if (cek.checked) {
$("#routerChoose").addClass('hidden');
document.getElementById("routers").required = false;
document.getElementById("Limited").disabled = true;
} else {
document.getElementById("Limited").disabled = false;
document.getElementById("routers").required = true;
$("#routerChoose").removeClass('hidden');
}
}
setTimeout(() => {
$.ajax({
url: "index.php?_route=autoload/pool",
data: "routers=radius",
cache: false,
success: function(msg) {
$("#pool_expired").html(msg);
}
});
}, 2000);
</script>
{/literal}
{/if}
</div>
{include file="sections/footer.tpl"}

95
ui/ui/hotspot.tpl Normal file
View File

@@ -0,0 +1,95 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card card-hovered mb20 card-primary">
<div class="card-header">
{Lang::T('Hotspot Plans')}
<div class="btn-group pull-right">
<a class="btn btn-primary btn-xs" title="save" href="{$_url}services/sync/hotspot"
onclick="return confirm('This will sync/send hotspot plan to Mikrotik?')"><span
class="fa fa-refresh" aria-hidden="true"></span> sync</a>
</div>
</div>
<div class="card-body">
<div class="md-whiteframe-z1 mb20 text-center row" style="padding: 15px">
<div class="col-md-8">
<form id="site-search" method="post" action="{$_url}services/hotspot/">
<div class="input-group">
<div class="input-group-text" id="basic-addon1">
<span class="fa fa-search"></span>
</div>
<input type="text" name="name" class="form-control"
placeholder="{Lang::T('Search by Name')}...">
<div class="input-group-btn">
<button class="btn btn-success" id="button-addon2" style="height: 52px;" type="submit">{Lang::T('Search')}</button>
</div>
</div>
</form>
</div>
<div class="col-md-4">
<a href="{$_url}services/add" class="btn btn-primary btn-block"><i class="fa fa-plus">
</i> {Lang::T('New Service Plan')}</a>
</div>&nbsp;
</div>
<div class="table-responsive">
<table class="table table-bordered table-striped table-condensed">
<thead>
<tr>
<th>{Lang::T('Plan Name')}</th>
<th>{Lang::T('Plan Type')}</th>
<th>{Lang::T('Bandwidth Plans')}</th>
<th>{Lang::T('Plan Category')}</th>
<th>{Lang::T('Plan Price')}</th>
<th>{Lang::T('Time Limit')}</th>
<th>{Lang::T('Data Limit')}</th>
<th>{Lang::T('Plan Validity')}</th>
<th>{Lang::T('Routers')}</th>
<th>{Lang::T('Expired IP Pool')}</th>
<th>{Lang::T('ID')}</th>
<th>{Lang::T('Manage')}</th>
</tr>
</thead>
<tbody>
{foreach $d as $ds}
<tr {if $ds['enabled'] !=1}class="danger" title="disabled" {elseif $ds['prepaid'] !='yes'
}class="warning" title="Postpaid" {/if}>
<td class="headcol">{$ds['name_plan']}</td>
<td>{$ds['plan_type']}</td>
<td>{$ds['name_bw']}</td>
<td>{$ds['typebp']}</td>
<td>{Lang::moneyFormat($ds['price'])}</td>
<td>{$ds['time_limit']} {$ds['time_unit']}</td>
<td>{$ds['data_limit']} {$ds['data_unit']}</td>
<td>{$ds['validity']} {$ds['validity_unit']}</td>
<td>
{if $ds['is_radius']}
<span class="label label-primary">RADIUS</span>
{else}
{if $ds['routers']!=''}
<a href="{$_url}routers/edit/0&name={$ds['routers']}">{$ds['routers']}</a>
{/if}
{/if}
</td>
<td>{$ds['pool_expired']}{if $ds['list_expired']}{if $ds['pool_expired']} |
{/if}{$ds['list_expired']}{/if}</td>
<td>{$ds['id']}</td>
<td>
<a href="{$_url}services/edit/{$ds['id']}"
class="btn btn-info btn-xs">{Lang::T('Edit')}</a>
<a href="{$_url}services/delete/{$ds['id']}" id="{$ds['id']}"
onclick="return confirm('{Lang::T('Delete')}?')"
class="btn btn-danger btn-xs"><i class="fa fa-trash"></i></a>
</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

69
ui/ui/hotspot_users.tpl Normal file
View File

@@ -0,0 +1,69 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card card-hovered mb20 card">
<div class="card-header">{Lang::T('Hotspot Users')}</div>
<div class="card-body">
<div class="table-responsive table_mobile">
<table id="hotspot_users_table" class="table table-bordered table-striped table-condensed">
<thead>
<tr>
<th>{Lang::T('Username')}</th>
<th>{Lang::T('Address')}</th>
<th>{Lang::T('Uptime')}</th>
<th>{Lang::T('Server')}</th>
<th>{Lang::T('MAC Address')}</th>
<th>{Lang::T('Session Time')}</th>
<th style="color: red;">{Lang::T('Upload')}</th>
<th style="color: green;">{Lang::T('Download')}</th>
<th>{Lang::T('Total')}</th>
<th>{Lang::T('Action')}</th>
</tr>
</thead>
<tbody>
<!-- DataTables will populate the table body dynamically -->
</tbody>
</table>
</div>
</div>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
{include file="sections/footer.tpl"}
<!-- Include jQuery and DataTables JS CDN -->
<!--<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>-->
<script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>
<script>
$(document).ready(function() {
$('#hotspot_users_table').DataTable({
"ajax": {
"url": "{$_url}onlineusers/hotspot_users",
"dataSrc": ""
},
"columns": [
{ "data": "username", "render": function(data, type, row) {
return '<span style="color: blue;">' + data + '</span>';
}
},
{ "data": "address" },
{ "data": "uptime" },
{ "data": "server" },
{ "data": "mac" },
{ "data": "session_time" },
{ "data": "rx_bytes" },
{ "data": "tx_bytes" },
{ "data": "total" },
{ "data": null, "render": function(data, type, row) {
return '<form method="post" action="{$_url}onlineusers/disconnect/{$routerId}/' + row.username + '/hotspot">' +
'<button type="submit" class="btn btn-danger btn-sm" title="Disconnect"><i class="fa fa-times"></i></button>' +
'</form>';
}
}
]
});
});
</script>

8
ui/ui/index.html Normal file
View File

@@ -0,0 +1,8 @@
<html>
<head>
<title>403 Forbidden</title>
</head>
<body>
<p>Directory access is forbidden.</p>
</body>
</html>

815
ui/ui/indexmain.tpl Normal file
View File

@@ -0,0 +1,815 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<!-- Add Project -->
<div class="modal fade" id="addProjectSidebar">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Create Project</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label class="text-black font-w500">Project Name</label>
<input type="text" class="form-control">
</div>
<div class="form-group">
<label class="text-black font-w500">Dadeline</label>
<div class="cal-icon"><input type="date" class="form-control"><i
class="far fa-calendar-alt"></i></div>
</div>
<div class="form-group">
<label class="text-black font-w500">Client Name</label>
<input type="text" class="form-control">
</div>
<div class="form-group">
<button type="button" class="btn btn-primary">CREATE</button>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xl-3 col-xxl-3 col-lg-6 col-sm-6">
<div class="card card-bd">
<div class="bg-secondary card-border" style="background:#3444d5 !important;"></div>
<div class="card-body box-style">
<div class="media align-items-center">
<div class="media-body me-3">
<h2 class="count num-text text-black font-w700">78</h2>
<span class="fs-14">Total Project Handled</span>
</div>
<svg width="36" height="36" viewBox="0 0 36 36" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M34.422 13.9831C34.3341 13.721 34.1756 13.4884 33.9638 13.3108C33.7521 13.1332 33.4954 13.0175 33.222 12.9766L23.649 11.5141L19.353 2.36408C19.2319 2.10638 19.0399 1.88849 18.7995 1.73587C18.5591 1.58325 18.2803 1.5022 17.9955 1.5022C17.7108 1.5022 17.4319 1.58325 17.1915 1.73587C16.9511 1.88849 16.7592 2.10638 16.638 2.36408L12.342 11.5141L2.76902 12.9766C2.49635 13.0181 2.24042 13.1341 2.02937 13.3117C1.81831 13.4892 1.6603 13.7215 1.57271 13.9831C1.48511 14.2446 1.47133 14.5253 1.53287 14.7941C1.59441 15.063 1.72889 15.3097 1.92152 15.5071L8.89802 22.6501L7.24802 32.7571C7.20299 33.0345 7.23679 33.3189 7.34555 33.578C7.45431 33.8371 7.63367 34.0605 7.86319 34.2226C8.09271 34.3847 8.36315 34.4791 8.64371 34.495C8.92426 34.5109 9.20365 34.4477 9.45002 34.3126L18 29.5906L26.55 34.3126C26.7964 34.4489 27.0761 34.5131 27.3573 34.4978C27.6384 34.4826 27.9096 34.3885 28.1398 34.2264C28.37 34.0643 28.5499 33.8406 28.659 33.5811C28.768 33.3215 28.8018 33.0365 28.7565 32.7586L27.1065 22.6516L34.0785 15.5071C34.2703 15.3091 34.4037 15.0622 34.4643 14.7933C34.5249 14.5245 34.5103 14.2441 34.422 13.9831Z"
fill="#864AD1" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-lg-6 col-sm-6">
<div class="card card-bd">
<div class="bg-warning card-border"></div>
<div class="card-body box-style">
<div class="media align-items-center">
<div class="media-body me-3">
<h2 class="count num-text text-black font-w700">214</h2>
<span class="fs-14">Contacts You Have</span>
</div>
<svg width="36" height="36" viewBox="0 0 36 36" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M17.8935 22.5C23.6925 22.5 28.3935 17.799 28.3935 12C28.3935 6.20101 23.6925 1.5 17.8935 1.5C12.0945 1.5 7.39351 6.20101 7.39351 12C7.39351 17.799 12.0945 22.5 17.8935 22.5Z"
fill="#FFB930" />
<path
d="M29.5605 21.3344C29.217 20.9909 28.851 20.6699 28.476 20.3564C27.2159 21.96 25.6078 23.2562 23.7733 24.1472C21.9388 25.0382 19.9259 25.5007 17.8864 25.4996C15.847 25.4986 13.8345 25.0342 12.0009 24.1414C10.1673 23.2486 8.56051 21.9507 7.30199 20.3459C5.447 21.8906 3.95577 23.8256 2.9347 26.013C1.91364 28.2003 1.3879 30.586 1.39499 32.9999C1.39499 33.3978 1.55303 33.7793 1.83433 34.0606C2.11564 34.3419 2.49717 34.4999 2.89499 34.4999H32.895C33.2928 34.4999 33.6743 34.3419 33.9557 34.0606C34.237 33.7793 34.395 33.3978 34.395 32.9999C34.4004 30.8324 33.9759 28.6854 33.146 26.683C32.3162 24.6807 31.0975 22.8627 29.5605 21.3344Z"
fill="#FFB930" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-lg-6 col-sm-6">
<div class="card card-bd">
<div class="bg-primary card-border"></div>
<div class="card-body box-style">
<div class="media align-items-center">
<div class="media-body me-3">
<h2 class="count num-text text-black font-w700">93</h2>
<span class="fs-14">Total Unfinished Task</span>
</div>
<svg class="primary-icon" width="36" height="36" viewBox="0 0 36 36" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M11.9999 1.5H5.99994C3.51466 1.5 1.49994 3.51472 1.49994 6V29.8125C1.49994 32.2977 3.51466 34.3125 5.99994 34.3125H11.9999C14.4852 34.3125 16.4999 32.2977 16.4999 29.8125V6C16.4999 3.51472 14.4852 1.5 11.9999 1.5Z"
fill="#20F174" />
<path
d="M30 1.5H24C21.5147 1.5 19.5 3.51472 19.5 6V12C19.5 14.4853 21.5147 16.5 24 16.5H30C32.4853 16.5 34.5 14.4853 34.5 12V6C34.5 3.51472 32.4853 1.5 30 1.5Z"
fill="#20F174" />
<path
d="M30 19.5H24C21.5147 19.5 19.5 21.5147 19.5 24V30C19.5 32.4853 21.5147 34.5 24 34.5H30C32.4853 34.5 34.5 32.4853 34.5 30V24C34.5 21.5147 32.4853 19.5 30 19.5Z"
fill="#20F174" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-lg-6 col-sm-6">
<div class="card card-bd">
<div class="bg-info card-border"></div>
<div class="card-body box-style">
<div class="media align-items-center">
<div class="media-body me-3">
<h2 class="count num-text text-black font-w700">12</h2>
<span class="fs-14">Unread Messages</span>
</div>
<svg width="46" height="46" viewBox="0 0 46 46" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M34.4999 1.91663H11.4999C8.95917 1.91967 6.52338 2.93032 4.72682 4.72688C2.93026 6.52345 1.91961 8.95924 1.91656 11.5V26.8333C1.91935 29.0417 2.6834 31.1816 4.07994 32.8924C5.47648 34.6031 7.42011 35.7801 9.58323 36.225V42.1666C9.58318 42.5136 9.67733 42.8541 9.85564 43.1518C10.0339 43.4495 10.2897 43.6932 10.5957 43.8569C10.9016 44.0206 11.2463 44.0982 11.5929 44.0813C11.9395 44.0645 12.275 43.9539 12.5636 43.7613L23.5749 36.4166H34.4999C37.0406 36.4136 39.4764 35.4029 41.273 33.6064C43.0695 31.8098 44.0802 29.374 44.0832 26.8333V11.5C44.0802 8.95924 43.0695 6.52345 41.273 4.72688C39.4764 2.93032 37.0406 1.91967 34.4999 1.91663ZM30.6666 24.9166H15.3332C14.8249 24.9166 14.3374 24.7147 13.9779 24.3552C13.6185 23.9958 13.4166 23.5083 13.4166 23C13.4166 22.4916 13.6185 22.0041 13.9779 21.6447C14.3374 21.2852 14.8249 21.0833 15.3332 21.0833H30.6666C31.1749 21.0833 31.6624 21.2852 32.0219 21.6447C32.3813 22.0041 32.5832 22.4916 32.5832 23C32.5832 23.5083 32.3813 23.9958 32.0219 24.3552C31.6624 24.7147 31.1749 24.9166 30.6666 24.9166ZM34.4999 17.25H11.4999C10.9916 17.25 10.5041 17.048 10.1446 16.6886C9.78517 16.3291 9.58323 15.8416 9.58323 15.3333C9.58323 14.825 9.78517 14.3374 10.1446 13.978C10.5041 13.6186 10.9916 13.4166 11.4999 13.4166H34.4999C35.0082 13.4166 35.4957 13.6186 35.8552 13.978C36.2146 14.3374 36.4166 14.825 36.4166 15.3333C36.4166 15.8416 36.2146 16.3291 35.8552 16.6886C35.4957 17.048 35.0082 17.25 34.4999 17.25Z"
fill="#3ECDFF" />
</svg>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xl-6 col-xxl-12">
<div class="card">
<div class="card-header d-block border-0 pb-0">
<div class="d-flex justify-content-between pb-3">
<h4 class="mb-0 text-black fs-20">Project Created</h4>
<div class="dropdown">
<a href="javascript:void(0)" data-bs-toggle="dropdown" aria-expanded="false">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round"></path>
<path
d="M12 6C12.5523 6 13 5.55228 13 5C13 4.44772 12.5523 4 12 4C11.4477 4 11 4.44772 11 5C11 5.55228 11.4477 6 12 6Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round"></path>
<path
d="M12 20C12.5523 20 13 19.5523 13 19C13 18.4477 12.5523 18 12 18C11.4477 18 11 18.4477 11 19C11 19.5523 11.4477 20 12 20Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round"></path>
</svg>
</a>
<div class="dropdown-menu dropdown-menu-left">
<a class="dropdown-item" href="javascript:void(0);">Edit</a>
<a class="dropdown-item" href="javascript:void(0);">Delete</a>
</div>
</div>
</div>
<div class="d-flex align-items-center">
<span class="fs-36 text-black font-w600 me-4">25%</span>
<div>
<svg class="me-2" width="27" height="14" viewBox="0 0 27 14" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path d="M0 13.435L13.435 0L26.8701 13.435H0Z" fill="#fc5130"></path>
</svg>
<span>last month $563,443</span>
</div>
</div>
</div>
<div class="card-body pb-0 px-2 pt-2">
<div id="chartTimeline" class="timeline-chart"></div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-6 col-sm-6">
<div class="card">
<div class="card-header border-0 pb-0">
<h4 class="fs-20 mb-0 text-black">New Clients</h4>
<div class="dropdown">
<a href="javascript:void(0)" data-bs-toggle="dropdown" aria-expanded="false">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round"></path>
<path
d="M12 6C12.5523 6 13 5.55228 13 5C13 4.44772 12.5523 4 12 4C11.4477 4 11 4.44772 11 5C11 5.55228 11.4477 6 12 6Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round"></path>
<path
d="M12 20C12.5523 20 13 19.5523 13 19C13 18.4477 12.5523 18 12 18C11.4477 18 11 18.4477 11 19C11 19.5523 11.4477 20 12 20Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round"></path>
</svg>
</a>
<div class="dropdown-menu dropdown-menu-left">
<a class="dropdown-item" href="javascript:void(0);">Edit</a>
<a class="dropdown-item" href="javascript:void(0);">Delete</a>
</div>
</div>
</div>
<div class="card-body text-center pb-0 px-2 pt-2">
<div id="widgetChart1" class="widgetChart1 dashboard-chart"></div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-6 col-sm-6">
<div class="card">
<div class="card-header border-0 pb-0">
<h4 class="fs-20 mb-0 text-black">Monthly Target</h4>
<div class="dropdown">
<a href="javascript:void(0)" data-bs-toggle="dropdown" aria-expanded="false">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round"></path>
<path
d="M12 6C12.5523 6 13 5.55228 13 5C13 4.44772 12.5523 4 12 4C11.4477 4 11 4.44772 11 5C11 5.55228 11.4477 6 12 6Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round"></path>
<path
d="M12 20C12.5523 20 13 19.5523 13 19C13 18.4477 12.5523 18 12 18C11.4477 18 11 18.4477 11 19C11 19.5523 11.4477 20 12 20Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round"></path>
</svg>
</a>
<div class="dropdown-menu dropdown-menu-left">
<a class="dropdown-item" href="javascript:void(0);">Edit</a>
<a class="dropdown-item" href="javascript:void(0);">Delete</a>
</div>
</div>
</div>
<div class="card-body text-center pt-0">
<div id="radialChart" class="monthly-project-chart"></div>
<span class="fs-14 text-black d-block op5">100 Projects/ monthy</span>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xl-6 col-xxl-12">
<div class="row">
<div class="col-sm-6">
<div class="card">
<div class="card-header border-0">
<h4 class="fs-16 text-black font-w500">Project Released</h4>
<div class="d-flex align-items-center">
<svg width="14" height="8" viewBox="0 0 14 8" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path d="M1.90735e-06 0.499999L7 7.5L14 0.5" fill="#FF6746" />
</svg>
<span class="fs-28 font-w600 ms-2 text-black">4%</span>
</div>
</div>
<div class="card-body text-center pb-0 p-0">
<div id="widgetChart2" class="dashboard-chart"></div>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="card">
<div
class="card-body text-center d-flex align-items-center justify-content-between">
<div class="d-inline-block position-relative donut-chart-sale">
<span class="donut1"
data-peity='{ "fill": ["#fc5130", "rgba(241, 241, 241,1)"], "innerRadius": 33, "radius": 10}'>3/8</span>
<small class="text-primary">29%</small>
</div>
<div>
<h2 class="fs-28 font-w600 mb-0 text-end text-black">567</h2>
<p class="mb-0 fs-14 font-w400 text-black">Contacts Added</p>
</div>
</div>
</div>
</div>
<div class="col-xl-12">
<div class="card overflow-hidden">
<div class="card-body">
<div class="text-center">
<div class="profile-photo">
<img src="assets/img/man.png" width="100"
class="img-fluid rounded-circle" alt="">
</div>
<h3 class="mt-4 mb-1">Therichpost</h3>
<p class="text-muted">Youtuber</p>
<a class="btn btn-outline-primary btn-rounded mt-3 px-5"
href="javascript:void(0)">Folllow</a>
</div>
</div>
<div class="card-footer pt-0 pb-0 text-center">
<div class="row">
<div class="col-4 pt-3 pb-3 border-right">
<h3 class="mb-1">150</h3><span>Follower</span>
</div>
<div class="col-4 pt-3 pb-3 border-right">
<h3 class="mb-1">140</h3><span>Place Stay</span>
</div>
<div class="col-4 pt-3 pb-3">
<h3 class="mb-1">45</h3><span>Reviews</span>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-12">
<div class="card message-bx">
<div class="card-header border-0 d-sm-flex d-block pb-0">
<div>
<h4 class="fs-20 mb-0 text-black mb-sm-0 mb-2">Recent Messages</h4>
</div>
<a href="#" class="btn btn-primary shadow-primary btn-rounded text-white">+ New
Message</a>
</div>
<div class="card-body">
<div class="media mb-3 pb-3 border-bottom">
<div class="image-bx me-sm-4 me-2">
<img src="assets/img/hacker.png" alt="" class="rounded-circle img-1">
<span class="active"></span>
</div>
<div
class="media-body d-sm-flex justify-content-between d-block align-items-center">
<div class="me-sm-3 me-0">
<h6 class="fs-16 font-w600 mb-sm-2 mb-0"><a href="#"
class="text-black">Laura Chyan</a></h6>
<p class="text-black mb-1">Lorem ipsum dolor sit amet, consectetur
adipiscing elit, sed do eiusmod tempor incididunt ut</p>
<span class="fs-14">5m ago</span>
</div>
</div>
</div>
<div class="media mb-3 pb-3 border-bottom">
<div class="image-bx me-sm-4 me-2">
<img src="assets/img/gamer.png" alt="" class="rounded-circle img-1">
</div>
<div
class="media-body d-sm-flex justify-content-between d-block align-items-center">
<div class="me-sm-3 me-0">
<h6 class="fs-16 font-w600 mb-sm-2 mb-0"><a href="#"
class="text-black">Olivia Rellaq</a></h6>
<p class="text-black mb-1">Lorem ipsum dolor sit amet, consectetur
adipiscing elit, sed do eiusmod tempor incididunt ut</p>
<span class="fs-14">41m ago</span>
</div>
</div>
</div>
<div class="media">
<div class="image-bx me-sm-4 me-2">
<img src="assets/img/man (1).png" alt="" class="rounded-circle img-1">
<span class="active"></span>
</div>
<div
class="media-body d-sm-flex justify-content-between d-block align-items-center">
<div class="me-sm-3 me-0">
<h6 class="fs-16 font-w600 mb-sm-2 mb-0"><a href="#"
class="text-black">Keanu Tipes</a></h6>
<p class="text-black mb-1">Nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum...</p>
<span class="fs-14">25m ago</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-6 col-xxl-12">
<div class="row">
<div class="col-md-6">
<div class="card">
<div class="card-header border-0 pb-0">
<div class="me-2">
<h4 class="fs-20 mb-0 font-w500 text-black">Upcoming Projects</h4>
</div>
</div>
<div class="card-body">
<div class="border-bottom up-project-bx pb-4 mb-4">
<span class="fs-16 text-primary mb-2 d-block sub-title font-w500">Yoast
Esac</span>
<div class="d-flex">
<p class="font-w500 me-auto mb-2 title fs-20"><a href="#"
class="text-black">Redesign Kripton Mobile App</a></p>
<div class="dropdown mb-3">
<a href="javascript:void(0)" data-bs-toggle="dropdown"
aria-expanded="false">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path
d="M12 6C12.5523 6 13 5.55228 13 5C13 4.44772 12.5523 4 12 4C11.4477 4 11 4.44772 11 5C11 5.55228 11.4477 6 12 6Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path
d="M12 20C12.5523 20 13 19.5523 13 19C13 18.4477 12.5523 18 12 18C11.4477 18 11 18.4477 11 19C11 19.5523 11.4477 20 12 20Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</a>
<div class="dropdown-menu dropdown-menu-left">
<a class="dropdown-item" href="javascript:void(0);">Edit</a>
<a class="dropdown-item" href="javascript:void(0);">Delete</a>
</div>
</div>
</div>
<div class="mb-3"><i class="far fa-calendar me-3"
aria-hidden="true"></i>Created on Sep 8th, 2020</div>
<div class="media align-items-center">
<div class="power-ic me-3">
<i class="fa fa-bolt" aria-hidden="true"></i>
</div>
<div class="media-body">
<p class="mb-1">Deadline</p>
<span class="text-black font-w600">Tuesday, Sep 29th 2020</span>
</div>
</div>
</div>
<div class="border-bottom up-project-bx pb-4 mb-4">
<span class="fs-16 text-primary mb-2 d-block sub-title font-w500">Yoast
Esac</span>
<div class="d-flex">
<p class="font-w500 me-auto title mb-2 fs-20"><a href="#"
class="text-black">Build Branding Persona for Etza.id</a></p>
<div class="dropdown mb-3">
<a href="javascript:void(0)" data-bs-toggle="dropdown"
aria-expanded="false">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path
d="M12 6C12.5523 6 13 5.55228 13 5C13 4.44772 12.5523 4 12 4C11.4477 4 11 4.44772 11 5C11 5.55228 11.4477 6 12 6Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path
d="M12 20C12.5523 20 13 19.5523 13 19C13 18.4477 12.5523 18 12 18C11.4477 18 11 18.4477 11 19C11 19.5523 11.4477 20 12 20Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</a>
<div class="dropdown-menu dropdown-menu-left">
<a class="dropdown-item" href="javascript:void(0);">Edit</a>
<a class="dropdown-item" href="javascript:void(0);">Delete</a>
</div>
</div>
</div>
<div class="mb-3"><i class="far fa-calendar me-3"
aria-hidden="true"></i>Created on Sep 8th, 2020</div>
<div class="media align-items-center">
<div class="power-ic me-3">
<i class="fa fa-bolt" aria-hidden="true"></i>
</div>
<div class="media-body">
<p class="mb-1">Deadline</p>
<span class="text-black font-w600">Tuesday, Sep 29th 2020</span>
</div>
</div>
</div>
<div class="up-project-bx">
<span class="fs-16 text-primary sub-title mb-2 d-block font-w500">Yoast
Esac</span>
<div class="d-flex">
<p class="font-w500 me-auto title mb-2 fs-20"><a href="#"
class="text-black">Manage SEO for Eclan Company Profile</a></p>
<div class="dropdown mb-3">
<a href="javascript:void(0)" data-bs-toggle="dropdown"
aria-expanded="false">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path
d="M12 6C12.5523 6 13 5.55228 13 5C13 4.44772 12.5523 4 12 4C11.4477 4 11 4.44772 11 5C11 5.55228 11.4477 6 12 6Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
<path
d="M12 20C12.5523 20 13 19.5523 13 19C13 18.4477 12.5523 18 12 18C11.4477 18 11 18.4477 11 19C11 19.5523 11.4477 20 12 20Z"
stroke="#575757" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</a>
<div class="dropdown-menu dropdown-menu-left">
<a class="dropdown-item" href="javascript:void(0);">Edit</a>
<a class="dropdown-item" href="javascript:void(0);">Delete</a>
</div>
</div>
</div>
<div class="mb-3"><i class="far fa-calendar me-3"
aria-hidden="true"></i>Created on Sep 8th, 2020</div>
<div class="media align-items-center">
<div class="power-ic me-3">
<i class="fa fa-bolt" aria-hidden="true"></i>
</div>
<div class="media-body">
<p class="mb-1">Deadline</p>
<span class="text-black font-w600">Tuesday, Sep 29th 2020</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card kanbanPreview-bx">
<div class="card-body">
<div class="sub-card bg-secondary d-flex text-white">
<div class="me-auto pe-2">
<h4 class="fs-20 mb-0 font-w600 text-white">Quick To-Do List</h4>
<span class="fs-14 op6 font-w200">Lorem ipsum dolor sit amet</span>
</div>
<a href="#" class="plus-icon"><i class="fa fa-plus"
aria-hidden="true"></i></a>
</div>
<div class="sub-card">
<span class="text-warning sub-title fs-14">Graphic Deisgner</span>
<p class="font-w500"><a href="#" class="text-black">Visual Graphic for
Presentation to Client</a></p>
<div class="row justify-content-between align-items-center">
<div class="col-6">
<span>Aug 4, 2021</span>
</div>
<ul class="users col-6">
<li><img src="assets/img/man (1).png" alt=""></li>
<li><img
src="https://cdn-icons-png.flaticon.com/512/921/921071.png">
</li>
<li><img
src="https://cdn-icons-png.flaticon.com/512/921/921071.png">
</li>
<li><img src="https://cdn-icons-png.flaticon.com/512/1154/1154448.png"
alt=""></li>
</ul>
</div>
</div>
<div class="sub-card">
<span class="text-primary sub-title fs-14">Database Engineer</span>
<p class="font-w500"><a href="#" class="text-black">Build Database Design
for Fasto Admin v2</a></p>
<div class="row justify-content-between align-items-center">
<div class="col-6">
<span>Aug 4, 2021</span>
</div>
<ul class="users col-6">
<li><img src="assets/img/man (1).png" alt=""></li>
<li><img
src="https://cdn-icons-png.flaticon.com/512/921/921071.png">
</li>
<li><img src="assets/img/man (1).png" alt=""></li>
</ul>
</div>
</div>
<div class="sub-card">
<span class="text-secondary sub-title fs-14">Digital Marketing</span>
<p class="font-w500"><a href="#" class="text-black">Make Promotional Ads for
Instagram Fastos</a></p>
<div class="row justify-content-between align-items-center mb-4">
<div class="col-6">
<span>Aug 4, 2021</span>
</div>
<ul class="users col-6">
<li><img src="assets/img/man (1).png" alt=""></li>
<li><img
src="https://cdn-icons-png.flaticon.com/512/921/921071.png">
</li>
<li><img src="assets/img/man (1).png" alt=""></li>
</ul>
</div>
<span><i class="far fa-comment me-2"></i>2 Comment</span>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card">
<div class="card-header border-0 pb-0">
<h4 class="card-title">Timeline</h4>
</div>
<div class="card-body">
<div id="DZ_W_TimeLine"
class="widget-timeline dz-scroll height370 ps ps--active-y">
<ul class="timeline">
<li>
<div class="timeline-badge primary"></div>
<a class="timeline-panel text-muted" href="javascript:void(0);">
<span>10 minutes ago</span>
<h6 class="mb-0">Youtube, a video-sharing website, goes live
<strong class="text-primary">$500</strong>.</h6>
</a>
</li>
<li>
<div class="timeline-badge info">
</div>
<a class="timeline-panel text-muted" href="javascript:void(0);">
<span>20 minutes ago</span>
<h6 class="mb-0">New order placed <strong
class="text-info">#XF-2356.</strong></h6>
<p class="mb-0">Quisque a consequat ante Sit amet magna at
volutapt...</p>
</a>
</li>
<li>
<div class="timeline-badge danger">
</div>
<a class="timeline-panel text-muted" href="javascript:void(0);">
<span>30 minutes ago</span>
<h6 class="mb-0">john just buy your product <strong
class="text-warning">Sell $250</strong></h6>
</a>
</li>
<li>
<div class="timeline-badge success">
</div>
<a class="timeline-panel text-muted" href="javascript:void(0);">
<span>15 minutes ago</span>
<h6 class="mb-0">StumbleUpon is acquired by eBay. </h6>
</a>
</li>
<li>
<div class="timeline-badge warning">
</div>
<a class="timeline-panel text-muted" href="javascript:void(0);">
<span>20 minutes ago</span>
<h6 class="mb-0">Mashable, a news website and blog, goes live.
</h6>
</a>
</li>
<li>
<div class="timeline-badge dark">
</div>
<a class="timeline-panel text-muted" href="javascript:void(0);">
<span>20 minutes ago</span>
<h6 class="mb-0">Mashable, a news website and blog, goes live.
</h6>
</a>
</li>
<li>
<div class="timeline-badge primary"></div>
<a class="timeline-panel text-muted" href="javascript:void(0);">
<span>10 minutes ago</span>
<h6 class="mb-0">Youtube, a video-sharing website, goes live
<strong class="text-primary">$500</strong>.</h6>
</a>
</li>
<li>
<div class="timeline-badge info">
</div>
<a class="timeline-panel text-muted" href="javascript:void(0);">
<span>20 minutes ago</span>
<h6 class="mb-0">New order placed <strong
class="text-info">#XF-2356.</strong></h6>
<p class="mb-0">Quisque a consequat ante Sit amet magna at
volutapt...</p>
</a>
</li>
<li>
<div class="timeline-badge danger">
</div>
<a class="timeline-panel text-muted" href="javascript:void(0);">
<span>30 minutes ago</span>
<h6 class="mb-0">john just buy your product <strong
class="text-warning">Sell $250</strong></h6>
</a>
</li>
<li>
<div class="timeline-badge success">
</div>
<a class="timeline-panel text-muted" href="javascript:void(0);">
<span>15 minutes ago</span>
<h6 class="mb-0">StumbleUpon is acquired by eBay. </h6>
</a>
</li>
<li>
<div class="timeline-badge warning">
</div>
<a class="timeline-panel text-muted" href="javascript:void(0);">
<span>20 minutes ago</span>
<h6 class="mb-0">Mashable, a news website and blog, goes live.
</h6>
</a>
</li>
<li>
<div class="timeline-badge dark">
</div>
<a class="timeline-panel text-muted" href="javascript:void(0);">
<span>20 minutes ago</span>
<h6 class="mb-0">Mashable, a news website and blog, goes live.
</h6>
</a>
</li>
</ul>
<div class="ps__rail-x" style="left: 0px; bottom: 0px;">
<div class="ps__thumb-x" tabindex="0" style="left: 0px; width: 0px;">
</div>
</div>
<div class="ps__rail-y" style="top: 0px; height: 370px; right: 0px;">
<div class="ps__thumb-y" tabindex="0" style="top: 0px; height: 229px;">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card" style="display: grid; align-content: center;">
<div class="card-body text-center ai-icon text-primary">
<svg id="rocket-icon" class="my-2" viewBox="0 0 24 24" width="80" height="80"
stroke="currentColor" stroke-width="1" fill="none" stroke-linecap="round"
stroke-linejoin="round">
<path d="M6 2L3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z"></path>
<line x1="3" y1="6" x2="21" y2="6"></line>
<path d="M16 10a4 4 0 0 1-8 0"></path>
</svg>
<h4 class="my-2">You dont have badges yet</h4>
<a href="javascript:void(0);" class="btn my-2 btn-primary btn-lg px-4"><i
class="fa fa-usd"></i> Earn Budges</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xl-3 col-xxl-3 col-sm-6">
<div class="card">
<div class="social-graph-wrapper widget-facebook">
<span class="s-icon"><i class="fab fa-facebook-f"></i></span>
</div>
<div class="row">
<div class="col-6 border-end">
<div class="pt-3 pb-3 pl-0 pr-0 text-center">
<h4 class="m-1"><span class="count counter">89</span> k</h4>
<p class="m-0">Friends</p>
</div>
</div>
<div class="col-6">
<div class="pt-3 pb-3 pl-0 pr-0 text-center">
<h4 class="m-1"><span class="count counter">119</span> k</h4>
<p class="m-0">Followers</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-sm-6">
<div class="card">
<div class="social-graph-wrapper widget-linkedin">
<span class="s-icon"><i class="fab fa-linkedin-in"></i></span>
</div>
<div class="row">
<div class="col-6 border-end">
<div class="pt-3 pb-3 pl-0 pr-0 text-center">
<h4 class="m-1"><span class="count counter">89</span> k</h4>
<p class="m-0">Friends</p>
</div>
</div>
<div class="col-6">
<div class="pt-3 pb-3 pl-0 pr-0 text-center">
<h4 class="m-1"><span class="count counter">119</span> k</h4>
<p class="m-0">Followers</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-sm-6">
<div class="card">
<div class="social-graph-wrapper widget-googleplus">
<span class="s-icon"><i class="fab fa-google-plus-g"></i></span>
</div>
<div class="row">
<div class="col-6 border-end">
<div class="pt-3 pb-3 pl-0 pr-0 text-center">
<h4 class="m-1"><span class="count counter">89</span> k</h4>
<p class="m-0">Friends</p>
</div>
</div>
<div class="col-6">
<div class="pt-3 pb-3 pl-0 pr-0 text-center">
<h4 class="m-1"><span class="count counter">119</span> k</h4>
<p class="m-0">Followers</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-xxl-3 col-sm-6">
<div class="card">
<div class="social-graph-wrapper widget-twitter">
<span class="s-icon"><i class="fab fa-twitter"></i></span>
</div>
<div class="row">
<div class="col-6 border-end">
<div class="pt-3 pb-3 pl-0 pr-0 text-center">
<h4 class="m-1"><span class="count counter">89</span> k</h4>
<p class="m-0">Friends</p>
</div>
</div>
<div class="col-6">
<div class="pt-3 pb-3 pl-0 pr-0 text-center">
<h4 class="m-1"><span class="count counter">119</span> k</h4>
<p class="m-0">Followers</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

View File

@@ -0,0 +1,21 @@
{include file="sections/user-header.tpl"}
<div class="row">
<div class="col-md-4 col-md-offset-2">
<div class="card card-hovered card-primary card-stacked mb30">
<div class="card-header">{$in['invoice']}</div>
<div class="card-body">
<form class="form-horizontal" method="post" action="{$_url}plan/print" target="_blank">
<pre id="content">{$invoice}</pre>
<input type="hidden" name="id" value="{$in['id']}">
<a href="{$_url}voucher/list-activated" class="btn btn-default btn-sm"><i
class="ion-reply-all"></i>{Lang::T('Finish')}</a>
<a href="https://api.whatsapp.com/send/?text={$whatsapp}" target="_blank"
class="btn btn-primary btn-sm">
<i class="glyphicon glyphicon-share"></i> WhatsApp</a>
</form>
</div>
</div>
</div>
</div>
{include file="sections/user-footer.tpl"}

79
ui/ui/invoice-print.tpl Normal file
View File

@@ -0,0 +1,79 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="48x48" href="favicon-48x48.png">
<link rel="icon" type="image/png" sizes="64x64" href="favicon-64x64.png">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<title>{Lang::T('Login')} - {$_c['CompanyName']}</title>
<link rel="stylesheet" href="assets/vendor/chartist/css/chartist.min.css">
<link href="assets/vendor/bootstrap-select/dist/css/bootstrap-select.min.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet">
<meta http-equiv="refresh" content="{$time}; url={$url}">
<script type="text/javascript">
function printpage() {
window.print();
}
</script>
</head>
<body topmargin="0" leftmargin="0" {if !$nuxprint} onload="printpage()" {/if}>
<div class="row">
<div class="col-md-6">
<table width="200">
<tr>
<td>
{if $content}
<pre style="border-style: none; background-color: white;">{$content}</pre>{else}
<pre style="border-style: none; background-color: white;"><b>{Lang::pad($_c['CompanyName'],' ', 2)}</b>
{Lang::pad($_c['address'],' ', 2)}
{Lang::pad($_c['phone'],' ', 2)}
{Lang::pad("", '=')}
{Lang::pads("Invoice", $in['invoice'], ' ')}
{Lang::pads(Lang::T('Date'), $date, ' ')}
{Lang::pads(Lang::T('Sales'), $_admin['fullname'], ' ')}
{Lang::pad("", '=')}
{Lang::pads(Lang::T('Type'), $in['type'], ' ')}
{Lang::pads(Lang::T('Plan Name'), $in['plan_name'], ' ')}
{Lang::pads(Lang::T('Plan Price'), Lang::moneyFormat($in['price']), ' ')}
{Lang::pad($in['method'], ' ', 2)}
{Lang::pads(Lang::T('Username'), $in['username'], ' ')}
{Lang::pads(Lang::T('Password'), '**********', ' ')}
{if $in['type'] != 'Balance'}
{Lang::pads(Lang::T('Created On'), Lang::dateAndTimeFormat($in['recharged_on'],$in['recharged_time']), ' ')}
{Lang::pads(Lang::T('Expires On'), Lang::dateAndTimeFormat($in['expiration'],$in['time']), ' ')}
{/if}
{Lang::pad("", '=')}
{Lang::pad($_c['note'],' ', 2)}</pre>
{/if}
</td>
</tr>
</table>
{if $nuxprint}
<a href="{$nuxprint}" class="btn btn-success text-black btn-sm" name="nux" value="print">
<i class="fa fa-print"></i>
Print Invoice
<!-- <i class="fa fa-phone"></i> -->
</a>
<br>
<iframe src="{$nuxprint}" style="height: 2px;"><iframe>
{/if}
</div>
</div>
<script src="ui/ui/scripts/jquery.min.js"></script>
<script src="ui/ui/scripts/bootstrap.min.js"></script>
{if isset($xfooter)}
{$xfooter}
{/if}
</body>
</html>

43
ui/ui/invoice.tpl Normal file
View File

@@ -0,0 +1,43 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-md-12 col-sm-12 col-md-offset-3">
<div class="card card-hovered card-primary card-stacked mb30">
<div class="card-header">{$in['invoice']}</div>
<div class="card-body">
<form class="form-horizontal" method="post" action="{$_url}plan/print" target="_blank">
<pre id="content"></pre>
<textarea class="hidden" id="formcontent" name="content">{$invoice}</textarea>
<input type="hidden" name="id" value="{$in['id']}">
<div class="">
<a href="{$_url}plan/list" class="btn btn-success btn-sm"><i
class="fa fa-reply-all"></i>{Lang::T('Finish')}</a>
<a href="https://api.whatsapp.com/send/?text={$whatsapp}" target="_blank"
class="btn btn-primary btn-sm">
<i class="fa fa-share"></i> WhatsApp</a>
<a href="{$_url}plan/view/{$in['id']}/send" class="btn btn-info btn-sm"><i
class="fa fa-envelope"></i> {Lang::T("Resend")}</a>
<button type="submit" class="btn btn-info btn-sm"><i class="fa fa-print"></i>
Print</button>
<!-- <a href="nux://print?text={urlencode($invoice)}"
class="btn btn-success btn-sm hidden-md hidden-lg">
<i class="fa fa-phone"></i>
Print Invoice
</a>
<a href="https://github.com/hotspotbilling/android-printer"
class="btn btn-success btn-sm hidden-xs hidden-sm" target="_blank">
<i class="fa fa-phone"></i>
Print Invoice
</a> -->
</div>
</form>
</div>
</div>
</div>
</div>
<script type="text/javascript">
var s5_taf_parent = window.location;
document.getElementById('content').innerHTML = document.getElementById('formcontent').innerHTML;
</script>
</div>
{include file="sections/footer.tpl"}

31
ui/ui/language-add.tpl Normal file
View File

@@ -0,0 +1,31 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">{Lang::T('Translation')}</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}settings/lang-post">
{foreach $langs as $lang}
<div class="form-group">
<div class="col-md-12">
<small>{str_replace('_',' ', $lang@key)}</small>
<input type="text" class="form-control" rows="1" name="{$lang@key}"
placeholder="{$lang@key}" value="{$lang}">
</div>
</div>
{/foreach}
<div class="form-group">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-primary"
type="submit">{Lang::T('Save Changes')}</button>
Or <a href="{$_url}settings/localisation">{Lang::T('Cancel')}</a>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

199
ui/ui/logs-cron.tpl Normal file
View File

@@ -0,0 +1,199 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h5 class="card-title">
<i class="fa fa-clock-o"></i> {Lang::T('Cron Job Logs')}
</h5>
<div class="btn-group pull-right">
<a href="{$_url}logs/cron" class="btn btn-primary btn-sm">
<i class="fa fa-refresh"></i> Refresh
</a>
</div>
</div>
<div class="card-body">
<!-- Statistics Overview -->
<div class="row mb-4">
<div class="col-md-3">
<div class="card bg-primary text-white">
<div class="card-body">
<h4>{$stats.total_runs}</h4>
<p>Total Runs (7 days)</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card bg-success text-white">
<div class="card-body">
<h4>{$stats.successful_runs}</h4>
<p>Successful Runs</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card bg-danger text-white">
<div class="card-body">
<h4>{$stats.failed_runs}</h4>
<p>Failed Runs</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card bg-info text-white">
<div class="card-body">
<h4>{$stats.avg_execution_time}s</h4>
<p>Avg Execution Time</p>
</div>
</div>
</div>
</div>
<!-- Last Run Information -->
<div class="alert alert-info">
<h6><i class="fa fa-info-circle"></i> Last Run Information</h6>
<p><strong>Last Run:</strong> {if $stats.last_run}{$stats.last_run}{else}Never{/if}</p>
<p><strong>Last Success:</strong> {if $stats.last_success}{$stats.last_success}{else}Never{/if}</p>
<p><strong>Last Failure:</strong> {if $stats.last_failure}{$stats.last_failure}{else}Never{/if}</p>
</div>
<!-- Filters -->
<div class="row mb-3">
<div class="col-md-12">
<form method="post" action="{$_url}logs/cron" class="form-inline">
<div class="form-group mr-2">
<input type="text" name="q" class="form-control" placeholder="Search error messages..." value="{$q}">
</div>
<div class="form-group mr-2">
<select name="cron_type" class="form-control">
<option value="">All Types</option>
<option value="main" {if $cron_type eq 'main'}selected{/if}>Main Cron</option>
<option value="reminder" {if $cron_type eq 'reminder'}selected{/if}>Reminder Cron</option>
</select>
</div>
<div class="form-group mr-2">
<select name="status" class="form-control">
<option value="">All Status</option>
<option value="completed" {if $status eq 'completed'}selected{/if}>Completed</option>
<option value="failed" {if $status eq 'failed'}selected{/if}>Failed</option>
<option value="running" {if $status eq 'running'}selected{/if}>Running</option>
</select>
</div>
<button type="submit" class="btn btn-primary">
<i class="fa fa-search"></i> Filter
</button>
<a href="{$_url}logs/cron" class="btn btn-default">
<i class="fa fa-times"></i> Clear
</a>
</form>
</div>
</div>
<!-- Logs Table -->
<div class="table-responsive">
<table class="table table-striped table-hover">
<thead>
<tr>
<th>ID</th>
<th>Type</th>
<th>Started</th>
<th>Finished</th>
<th>Status</th>
<th>Duration</th>
<th>Expired Users</th>
<th>Notifications</th>
<th>Auto Renewals</th>
<th>Memory</th>
<th>Error</th>
</tr>
</thead>
<tbody>
{foreach from=$d item=log}
<tr class="{if $log.status == 'completed'}success{elseif $log.status == 'failed'}danger{else}warning{/if}">
<td>{$log.id}</td>
<td>
<span class="label label-{if $log.cron_type == 'main'}primary{else}info{/if}">
{$log.cron_type|upper}
</span>
</td>
<td>{$log.started_at}</td>
<td>{if $log.finished_at}{$log.finished_at}{else}-{/if}</td>
<td>
<span class="label label-{if $log.status == 'completed'}success{elseif $log.status == 'failed'}danger{else}warning{/if}">
{$log.status|upper}
</span>
</td>
<td>
{if $log.execution_time}
{$log.execution_time}s
{else}
-
{/if}
</td>
<td>
<span class="badge badge-info">{$log.expired_users_processed}</span>
{if $log.expired_users_found != $log.expired_users_processed}
<small class="text-muted">({$log.expired_users_found} found)</small>
{/if}
</td>
<td>
<span class="badge badge-success">{$log.notifications_sent}</span>
</td>
<td>
{if $log.auto_renewals_attempted > 0}
<span class="badge badge-warning">{$log.auto_renewals_successful}/{$log.auto_renewals_attempted}</span>
{else}
-
{/if}
</td>
<td>
{if $log.memory_usage}
{$log.memory_usage}
{else}
-
{/if}
</td>
<td>
{if $log.error_message}
<span class="text-danger" title="{$log.error_message}">
<i class="fa fa-exclamation-triangle"></i>
</span>
{else}
-
{/if}
</td>
</tr>
{foreachelse}
<tr>
<td colspan="11" class="text-center text-muted">
<i class="fa fa-info-circle"></i> No cron logs found
</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
<!-- Pagination -->
{include file="pagination.tpl"}
<!-- Legend -->
<div class="mt-3">
<h6>Legend:</h6>
<ul class="list-inline">
<li><span class="label label-success">COMPLETED</span> - Cron job finished successfully</li>
<li><span class="label label-danger">FAILED</span> - Cron job encountered an error</li>
<li><span class="label label-warning">RUNNING</span> - Cron job is currently running</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

71
ui/ui/logs-radius.tpl Normal file
View File

@@ -0,0 +1,71 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<!-- pool -->
<div class="row">
<div class="col-sm-12">
<div class="card card-hovered mb20 card-primary">
<div class="card-header">
Radius
{if in_array($_admin['user_type'],['SuperAdmin','Admin'])}
<div class="btn-group pull-right">
<a class="btn btn-primary btn-xs" title="save" href="{$_url}logs/radius-csv"
onclick="return confirm('This will export to CSV?')"><span class="glyphicon glyphicon-download"
aria-hidden="true"></span> CSV</a>
</div>
{/if}
</div>
<div class="card-body">
<div class="text-center"">
<div class="col-md-12 mb-3">
<form id="site-search" method="post" action="{$_url}logs/radius/">
<div class="input-group">
<div class="input-group-text">
<span class="fa fa-search"></span>
</div>
<input type="text" name="q" class="form-control" value="{$q}"
placeholder="{Lang::T('Search by Name')}...">
<button class="btn btn-success input-group-btn" type="submit">{Lang::T('Search')}</button>
</div>
</form>
</div>
<div class="col-md-12">
<form class="form-inline" method="post" action="{$_url}logs/radius/">
<div class="form-group">
<div class="input-group has-error">
<span class="input-group-text">Keep Logs </span>
<input type="text" name="keep" class="form-control" placeholder="90" value="90">
<span class="input-group-text">Days</span>
<button type="submit" class="btn btn-danger btn-sm input-group-btn"
onclick="return confirm('Clear old logs?')">Clean Logs
</button>
</div>
</div>
</form>
</div>&nbsp;
</div>
<br>
<div class="table-responsive">
<table class="table table-bordered table-striped table-condensed table-hover border-primary">
<tbody>
{foreach $d as $ds}
<tr>
<td width="30px">{$ds['id']}</td>
<td width="200px">{Lang::dateTimeFormat($ds['authdate'])}</td>
<td width="100px">{$ds['username']}</td>
<td width="10px"><input type="password" value="{$ds['pass']}"
style="width:200px;height: 36px; border: 0px; text-align: right;" class="pull-right form-control"
onmouseleave="this.type = 'password'" onmouseenter="this.type = 'text'"
onclick="this.select()"></td>
<td>{$ds['reply']}</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

66
ui/ui/logs.tpl Normal file
View File

@@ -0,0 +1,66 @@
{include file="sections/header.tpl"}
<!-- pool -->
<div class="row">
<div class="col-sm-12">
<div class="panel panel-hovered mb20 panel-primary">
<div class="panel-heading">
{if in_array($_admin['user_type'],['SuperAdmin','Admin'])}
<div class="btn-group pull-right">
<a class="btn btn-primary btn-xs" title="save" href="{$_url}logs/list-csv"
onclick="return confirm('This will export to CSV?')"><span class="glyphicon glyphicon-download"
aria-hidden="true"></span> CSV</a>
</div>
{/if}
Activity Log
</div>
<div class="panel-body">
<div class="text-center" style="padding: 15px">
<div class="col-md-4">
<form id="site-search" method="post" action="{$_url}logs/list/">
<div class="input-group">
<div class="input-group-addon">
<span class="fa fa-search"></span>
</div>
<input type="text" name="q" class="form-control" value="{$q}"
placeholder="{Lang::T('Search by Name')}...">
<div class="input-group-btn">
<button class="btn btn-success" type="submit">{Lang::T('Search')}</button>
</div>
</div>
</form>
</div>
<div class="col-md-8">
<form class="form-inline" method="post" action="{$_url}logs/list/">
<div class="input-group has-error">
<span class="input-group-addon">Keep Logs </span>
<input type="text" name="keep" class="form-control" placeholder="90" value="90">
<span class="input-group-addon">Days</span>
</div>
<button type="submit" class="btn btn-danger btn-sm"
onclick="return confirm('Clear old logs?')">Clean Logs</button>
</form>
</div>&nbsp;
</div>
<br>
<div class="table-responsive">
<table class="table table-bordered table-striped table-condensed">
<tbody>
{foreach $d as $ds}
<tr>
<td>{$ds['id']}</td>
<td>{Lang::dateTimeFormat($ds['date'])}</td>
<td>{$ds['type']}</td>
<td>{$ds['ip']}</td>
<td style="overflow-x: scroll;">{nl2br($ds['description'])}</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

209
ui/ui/main.css Normal file
View File

@@ -0,0 +1,209 @@
* {
margin: 0;
padding: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
html {
font-size: 62.5%;
font-family: "Montserrat", sans-serif;
}
body {
min-height: 100vh;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-color: #ecf0f3;
color: grey;
}
h1 {
color: #000;
font-size: 3rem;
text-transform: capitalize;
}
button {
width: 16rem;
height: 4.5rem;
border-radius: 2.5rem;
font-size: 1.3rem;
font-weight: 700;
letter-spacing: 0.1rem;
text-transform: uppercase;
background-color: #ecf0f3;
color: grey;
border: none;
outline: none;
-webkit-box-shadow: 1rem 1rem 1.6rem #d1d9e6, -0.6rem -0.6rem 1.6rem #fff;
box-shadow: 1rem 1rem 1.6rem #d1d9e6, -0.6rem -0.6rem 1.6rem #fff;
cursor: pointer;
}
button:active {
-webkit-box-shadow: inset 1rem 1rem 1.6rem #d1d9e6, inset -1rem -1rem 1.6rem #fff;
box-shadow: inset 1rem 1rem 1.6rem #d1d9e6, inset -1rem -1rem 1.6rem #fff;
}
.container {
position: relative;
width: 80rem;
height: 60vh;
background-color: #ecf0f3;
-webkit-box-shadow: 1rem 1rem 1rem #d1d9e6, -0.5rem -0.5rem 1rem #fff;
box-shadow: 1rem 1rem 1rem #d1d9e6, -0.5rem -0.5rem 1rem #fff;
border-radius: 1.2rem;
overflow: hidden;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: 12px;
}
.container .circle {
position: absolute;
left: 0;
width: 20rem;
height: 20rem;
border-radius: 50%;
background-color: #ecf0f3;
-webkit-box-shadow: 0.4rem 0.4rem 0.8rem #d1d9e6;
box-shadow: 0.4rem 0.4rem 0.8rem #d1d9e6;
z-index: 10;
}
.container .top-left {
top: 0;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.container .bottom-left {
bottom: 0;
-webkit-transform: translate(-70%, 70%) rotate(-80deg);
transform: translate(-70%, 70%) rotate(-80deg);
}
.container .side {
position: absolute;
top: 0;
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.container .left-side {
width: 40%;
text-align: center;
padding: 12px;
-webkit-box-shadow: 0.4rem 0.4rem 1rem #d1d9e6;
box-shadow: 0.4rem 0.4rem 1rem #d1d9e6;
}
.container .left-side .content p {
margin: 1rem 0 2rem 0;
font-size: 1.4rem;
}
.container .right-side {
width: 60%;
right: 0;
}
.container .right-side .content {
width: 70%;
text-align: center;
}
.container .right-side .content .icon-group {
margin: 1rem 0 3rem 0;
}
.container .right-side .content .icon-group .btn {
margin: 0 1rem;
border: none;
outline: none;
background-color: #ecf0f3;
-webkit-box-shadow: 0.3rem 0.3rem 0.6rem #d1d9e6, -0.3rem -0.3rem 0.6rem #fff;
box-shadow: 0.3rem 0.3rem 0.6rem #d1d9e6, -0.3rem -0.3rem 0.6rem #fff;
border-radius: 50%;
width: 3rem;
height: 3rem;
color: #000;
cursor: pointer;
}
.container .right-side .content .icon-group .btn:hover {
-webkit-box-shadow: inset 0.3rem 0.3rem 0.6rem #d1d9e6, inset -0.3rem -0.3rem 0.6rem #fff;
box-shadow: inset 0.3rem 0.3rem 0.6rem #d1d9e6, inset -0.3rem -0.3rem 0.6rem #fff;
}
.container .right-side .content .line {
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-bottom: 2rem;
}
.container .right-side .content .line hr {
width: 40%;
border: 1px solid transparent;
border-top: 1px solid #aaa;
}
.container .right-side .content .form form .form-control {
position: relative;
}
.container .right-side .content .form form .form-control i {
position: absolute;
top: 50%;
left: 4%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.container .right-side .content .form form .form-control input {
width: 100%;
height: 4rem;
border: none;
outline: none;
background-color: #ecf0f3;
-webkit-box-shadow: inset 0.2rem 0.2rem 0.4rem #d1d9e6, inset -0.4rem -0.4rem 0.4rem #fff;
box-shadow: inset 0.2rem 0.2rem 0.4rem #d1d9e6, inset -0.4rem -0.4rem 0.4rem #fff;
padding-left: 2.5rem;
border-radius: 0.8rem;
color: #000;
margin: 0.5rem 0;
}
.container .right-side .content .form form .form-control input:focus {
-webkit-box-shadow: inset 0.4rem 0.4rem 0.4rem #d1d9e6, inset -0.4rem -0.4rem 0.4rem #fff;
box-shadow: inset 0.4rem 0.4rem 0.4rem #d1d9e6, inset -0.4rem -0.4rem 0.4rem #fff;
}
.container .right-side .content .form form button {
margin-top: 2rem;
}
/*# sourceMappingURL=main.css.map */

106
ui/ui/maintenance-mode.tpl Normal file
View File

@@ -0,0 +1,106 @@
{include file="sections/header.tpl"}
<style>
/* Checkbox container */
.switch {
position: relative;
display: inline-block;
width: 50px;
height: 24px;
}
/* Hidden checkbox */
.switch input {
opacity: 0;
width: 0;
height: 0;
}
/* Slider */
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
transition: .4s;
border-radius: 24px;
}
.slider:before {
position: absolute;
content: "";
height: 18px;
width: 18px;
left: 3px;
bottom: 3px;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
border-radius: 50%;
}
input:checked+.slider {
background-color: #2196F3;
}
input:focus+.slider {
box-shadow: 0 0 1px #2196F3;
}
input:checked+.slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}
</style>
<div class="container-fluid">
<form class="form-horizontal" method="post" autocomplete="off" role="form" action="">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">{Lang::T('Maintenance Mode')}</div>
<div class="card-body">
<div class="form-group">
<label class="col-md-2 control-label">{Lang::T('Status:')}</label>
<div class="col-md-6">
<label class="switch">
<input type="checkbox" id="maintenance_mode" value="1" name="maintenance_mode" {if
$_c['maintenance_mode']==1}checked{/if}>
<span class="slider"></span>
</label>
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label">{Lang::T('Force Logout:')}</label>
<div class="col-md-6">
<label class="switch">
<input type="checkbox" id="maintenance_mode_logout" value="1"
name="maintenance_mode_logout" {if $_c['maintenance_mode_logout']==1}checked{/if}>
<span class="slider"></span>
</label>
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label">{Lang::T('End Date:')}</label>
<div class="col-md-6">
<input class="form-control" value="{$_c['maintenance_date']}" type="date" id="start_date"
name="maintenance_date">
</div>
</div>
<div class="form-group">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-primary waves-effect waves-light" name="save" value="save"
type="submit">{Lang::T('Save')}</button>
</div>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
{include file="sections/footer.tpl"}

249
ui/ui/maintenance.tpl Normal file
View File

@@ -0,0 +1,249 @@
<!DOCTYPE html>
<html>
<head>
<title>{Lang::T('Site is down for maintenance')}</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<style>
body {
font-family: 'Noto Sans', sans-serif;
color: #616161;
background-color: #eeeeee;
margin: 0;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
}
.container {
max-width: 1024px;
width: 100%;
padding: 10px;
box-sizing: border-box;
}
.box {
width: 100%;
background: #fff;
margin: auto;
padding: 20px;
border-radius: 5px;
box-shadow: 6px 18px 18px rgba(0, 0, 0, 0.08), -6px 18px 18px rgba(0, 0, 0, 0.08);
box-sizing: border-box;
text-align: center;
}
.animation {
display: flex;
justify-content: center;
align-items: center;
margin: 20px 0;
}
h1 {
font-size: 32px;
font-weight: 400;
text-transform: uppercase;
margin: 0;
}
p {
font-size: 16px;
font-weight: 700;
margin: 0;
}
a {
color: #f6921e;
font-weight: bold;
text-decoration: none;
margin-left: 5px;
}
.one,
.two,
.three {
display: block;
float: left;
}
.one {
background: url('data:image/svg+xml,%3Csvg%20version%3D%221.1%22%0A%09%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xmlns%3Aa%3D%22http%3A%2F%2Fns.adobe.com%2FAdobeSVGViewerExtensions%2F3.0%2F%22%0A%09%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2281px%22%20height%3D%2280.5px%22%20viewBox%3D%220%200%2081%2080.5%22%20style%3D%22overflow%3Ascroll%3Benable-background%3Anew%200%200%2081%2080.5%3B%22%0A%09%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cstyle%20type%3D%22text%2Fcss%22%3E%0A%09.st0%7Bfill%3A%23383838%3B%7D%0A%3C%2Fstyle%3E%0A%3Cdefs%3E%0A%3C%2Fdefs%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M30.3%2C68.2c1.2%2C0.2%2C2.3%2C0.9%2C3.8%2C1.2c1.6%2C0.3%2C2.7%2C0.6%2C4%2C0.4l4.9%2C9.6c0.6%2C0.9%2C1.4%2C1.1%2C2.3%2C0.9l15.3-4.9%0A%09c0.5-0.3%2C1-1%2C0.9-2.3l-1.8-10.6c2-1.6%2C3.6-3.7%2C5.3-5.8l10.5%2C0.6c1.1%2C0.6%2C2.1-0.4%2C2.3-1.1L81%2C40.7c0.2-0.8-0.4-2.1-1.1-2.3l-10.2-3.8%0A%09c-0.3-2.5-1.4-4.8-2.5-7.5l5.9-8.5c0.6-1.1%2C0.4-1.9-0.2-2.9l-12-10.7c-0.3-0.5-1.6-0.3-2.5%2C0.3l-8%2C6.9c-1.2-0.2-2.3-0.9-3.8-1.2%0A%09c-1.6-0.3-2.7-0.6-4-0.4L37.7%2C1c-0.6-0.9-1.4-1.1-2.3-0.9L20.1%2C5c-0.5%2C0.3-1%2C1-0.9%2C2.3l1.8%2C10.6c-2%2C1.6-3.6%2C3.7-5.3%2C5.8L5.3%2C23%0A%09c-0.8-0.2-1.7%2C0.4-2%2C1.6L0%2C40.2c-0.2%2C0.8%2C0.4%2C2.1%2C1.1%2C2.3l9.8%2C3.7c0.7%2C2.6%2C1.4%2C5.2%2C2.5%2C7.5l-6%2C8.9c-0.6%2C0.7-0.4%2C2%2C0.3%2C2.5l12%2C10.7%0A%09c0.7%2C0.5%2C1.9%2C0.8%2C2.4%2C0.1L30.3%2C68.2z%20M26.7%2C37.3c1.6-7.4%2C9.1-12.3%2C16.5-10.8S55.6%2C35.7%2C54%2C43.1c-1.6%2C7.4-9.1%2C12.3-16.5%2C10.7%0A%09C30.1%2C52.3%2C25.1%2C44.7%2C26.7%2C37.3L26.7%2C37.3z%22%2F%3E%0A%3C%2Fsvg%3E');
width: 80px;
height: 80px;
background-size: 100% 100%;
background-repeat: no-repeat;
margin-top: -10px;
margin-right: 8px;
}
.two {
background: url('data:image/svg+xml,%3Csvg%20version%3D%221.1%22%0A%09%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xmlns%3Aa%3D%22http%3A%2F%2Fns.adobe.com%2FAdobeSVGViewerExtensions%2F3.0%2F%22%0A%09%20x%3D%220px%22%20y%3D%220px%22%20width%3D%22103px%22%20height%3D%22103.7px%22%20viewBox%3D%220%200%20103%20103.7%22%0A%09%20style%3D%22overflow%3Ascroll%3Benable-background%3Anew%200%200%20103%20103.7%3B%22%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cstyle%20type%3D%22text%2Fcss%22%3E%0A%09.st0%7Bfill%3A%23F6921E%3B%7D%0A%3C%2Fstyle%3E%0A%3Cdefs%3E%0A%3C%2Fdefs%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M87.3%2C64.8c0.3-1.5%2C1.1-2.9%2C1.6-4.9c0.4-2%2C0.7-3.5%2C0.5-5.1l12.3-6.3c1.2-0.8%2C1.4-1.8%2C1.1-2.9l-6.3-19.6%0A%09c-0.4-0.6-1.3-1.3-2.9-1.1l-13.5%2C2.3c-2.1-2.5-4.7-4.7-7.4-6.8l0.8-13.4C74.3%2C5.8%2C73%2C4.5%2C72%2C4.3L52.1%2C0c-1-0.2-2.7%2C0.5-2.9%2C1.5%0A%09l-4.8%2C13c-3.2%2C0.4-6.1%2C1.8-9.5%2C3.2l-10.9-7.5c-1.4-0.8-2.5-0.5-3.7%2C0.3L6.5%2C25.8c-0.6%2C0.4-0.4%2C2%2C0.4%2C3.2l8.8%2C10.2%0A%09c-0.3%2C1.5-1.1%2C2.9-1.5%2C4.9c-0.4%2C2-0.7%2C3.5-0.6%2C5.1L1.2%2C55.4c-1.2%2C0.8-1.4%2C1.8-1.1%2C2.9l6.3%2C19.6c0.4%2C0.6%2C1.3%2C1.3%2C2.9%2C1.1l13.5-2.3%0A%09c2.1%2C2.5%2C4.7%2C4.7%2C7.4%2C6.8l-0.8%2C13.4c-0.2%2C1%2C0.6%2C2.2%2C2.1%2C2.5l20%2C4.2c1%2C0.2%2C2.7-0.5%2C2.9-1.5l4.7-12.6c3.3-0.9%2C6.6-1.7%2C9.5-3.2L80.1%2C94%0A%09c0.9%2C0.7%2C2.5%2C0.5%2C3.2-0.4L97%2C78.3c0.7-0.9%2C1-2.4%2C0.1-3.1L87.3%2C64.8z%20M47.8%2C69.5C38.3%2C67.5%2C32%2C57.8%2C34%2C48.3%0A%09c2-9.5%2C11.7-15.8%2C21.2-13.8c9.5%2C2%2C15.7%2C11.7%2C13.7%2C21.2C66.9%2C65.2%2C57.3%2C71.5%2C47.8%2C69.5L47.8%2C69.5z%22%2F%3E%0A%3C%2Fsvg%3E');
width: 100px;
height: 100px;
background-size: 100% 100%;
background-repeat: no-repeat;
}
.three {
background: url('data:image/svg+xml,%3Csvg%20version%3D%221.1%22%0A%09%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xmlns%3Aa%3D%22http%3A%2F%2Fns.adobe.com%2FAdobeSVGViewerExtensions%2F3.0%2F%22%0A%09%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2281px%22%20height%3D%2280.5px%22%20viewBox%3D%220%200%2081%2080.5%22%20style%3D%22overflow%3Ascroll%3Benable-background%3Anew%200%200%2081%2080.5%3B%22%0A%09%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cstyle%20type%3D%22text%2Fcss%22%3E%0A%09.st0%7Bfill%3A%23383838%3B%7D%0A%3C%2Fstyle%3E%0A%3Cdefs%3E%0A%3C%2Fdefs%3E%0A%3Cpath%20class%3D%22st0%22%20d%3D%22M30.3%2C68.2c1.2%2C0.2%2C2.3%2C0.9%2C3.8%2C1.2c1.6%2C0.3%2C2.7%2C0.6%2C4%2C0.4l4.9%2C9.6c0.6%2C0.9%2C1.4%2C1.1%2C2.3%2C0.9l15.3-4.9%0A%09c0.5-0.3%2C1-1%2C0.9-2.3l-1.8-10.6c2-1.6%2C3.6-3.7%2C5.3-5.8l10.5%2C0.6c1.1%2C0.6%2C2.1-0.4%2C2.3-1.1L81%2C40.7c0.2-0.8-0.4-2.1-1.1-2.3l-10.2-3.8%0A%09c-0.3-2.5-1.4-4.8-2.5-7.5l5.9-8.5c0.6-1.1%2C0.4-1.9-0.2-2.9l-12-10.7c-0.3-0.5-1.6-0.3-2.5%2C0.3l-8%2C6.9c-1.2-0.2-2.3-0.9-3.8-1.2%0A%09c-1.6-0.3-2.7-0.6-4-0.4L37.7%2C1c-0.6-0.9-1.4-1.1-2.3-0.9L20.1%2C5c-0.5%2C0.3-1%2C1-0.9%2C2.3l1.8%2C10.6c-2%2C1.6-3.6%2C3.7-5.3%2C5.8L5.3%2C23%0A%09c-0.8-0.2-1.7%2C0.4-2%2C1.6L0%2C40.2c-0.2%2C0.8%2C0.4%2C2.1%2C1.1%2C2.3l9.8%2C3.7c0.7%2C2.6%2C1.4%2C5.2%2C2.5%2C7.5l-6%2C8.9c-0.6%2C0.7-0.4%2C2%2C0.3%2C2.5l12%2C10.7%0A%09c0.7%2C0.5%2C1.9%2C0.8%2C2.4%2C0.1L30.3%2C68.2z%20M26.7%2C37.3c1.6-7.4%2C9.1-12.3%2C16.5-10.8S55.6%2C35.7%2C54%2C43.1c-1.6%2C7.4-9.1%2C12.3-16.5%2C10.7%0A%09C30.1%2C52.3%2C25.1%2C44.7%2C26.7%2C37.3L26.7%2C37.3z%22%2F%3E%0A%3C%2Fsvg%3E');
width: 80px;
height: 80px;
background-size: 100% 100%;
background-repeat: no-repeat;
margin-top: -50px;
margin-left: -10px;
}
@keyframes spin-one {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(-359deg);
transform: rotate(-359deg);
}
}
.spin-one {
-webkit-animation: spin-one 1.5s infinite linear;
animation: spin-one 1.5s infinite linear;
}
@keyframes spin-two {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(-359deg);
transform: rotate(359deg);
}
}
.spin-two {
-webkit-animation: spin-two 2s infinite linear;
animation: spin-two 2s infinite linear;
}
.day,
.hour,
.minute,
.second {
font-size: 18px;
background: #333;
color: #fff;
padding: 10px;
border-radius: 5px;
margin: 5px;
flex: 1;
text-align: center;
}
.day {
background-color: #1abc9c;
}
.hour {
background-color: #3498db;
}
.minute {
background-color: #f1c40f;
}
.second {
background-color: #e74c3c;
}
.countdown {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
@media (max-width: 600px) {
h1 {
font-size: 24px;
}
p {
font-size: 14px;
}
.one,
.two,
.three {
width: 40px;
height: 40px;
}
.day,
.hour,
.minute,
.second {
font-size: 14px;
padding: 8px;
margin: 2px;
}
}
</style>
</head>
<body>
<!-- partial:index.partial.html -->
<link href="https://fonts.googleapis.com/css?family=Noto+Sans:400,700" rel="stylesheet">
<div class="container">
<div class="box">
<div class="animation">
<div class="one spin-one"></div>
<div class="two spin-two"></div>
<div class="three spin-one"></div>
</div>
<h1>{Lang::T('Site is temporarily unavailable.')}</h1>
<p>{Lang::T('Scheduled maintenance is currently in progress. Please check back soon.')}</p>
<p>{Lang::T('We apologize for any inconvenience.')} <br> &mdash; {Lang::T('The ')} {$companyName} {Lang::T('
Team.')}</p>
<br>
{if $date} <div style="display: flex; flex-direction: row; justify-content: space-between;">
<p class="day"></p>
<p class="hour"></p>
<p class="minute"></p>
<p class="second"></p>
</div>
{/if}
</div>
</div>
{if $date}
<script>
const countDown = () => {
const countDay = new Date('{$date}');
const now = new Date();
const counter = countDay - now;
const second = 1000;
const minute = second * 60;
const hour = minute * 60;
const day = hour * 24;
const textDay = Math.floor(counter / day);
const textHour = Math.floor((counter % day) / hour);
const textMinute = Math.floor((counter % hour) / minute);
const textSecond = Math.floor((counter % minute) / second)
document.querySelector(".day").innerText = textDay + ' Days';
document.querySelector(".hour").innerText = textHour + ' Hours';
document.querySelector(".minute").innerText = textMinute + ' Minutes';
document.querySelector(".second").innerText = textSecond + ' Seconds';
}
setInterval(countDown, 1000);
</script>
{/if}
</body>
</html>

144
ui/ui/message-bulk.tpl Normal file
View File

@@ -0,0 +1,144 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.11.3/css/jquery.dataTables.min.css">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">
<h3 class="card-title">{Lang::T('Send Bulk Message')}</h3>
</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" id="bulkMessageForm" action="">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Group')}</label>
<div class="col-md-6">
<select class="form-select" style="height: 52px; background-color: white;" name="group" id="group">
<option value="all" selected>{Lang::T('All Customers')}</option>
<option value="new">{Lang::T('New Customers')}</option>
<option value="expired">{Lang::T('Expired Customers')}</option>
<option value="active">{Lang::T('Active Customers')}</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Send Via')}</label>
<div class="col-md-6">
<select class="form-select" style="height: 52px; background-color: white;" name="via" id="via">
<option value="sms" selected>{Lang::T('SMS')}</option>
<option value="wa">{Lang::T('WhatsApp')}</option>
<option value="both">{Lang::T('SMS and WhatsApp')}</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Message per time')}</label>
<div class="col-md-6">
<select class="form-select" style="height: 52px; background-color: white;" name="batch" id="batch">
<option value="5">{Lang::T('5 Messages')}</option>
<option value="10" selected>{Lang::T('10 Messages')}</option>
<option value="15">{Lang::T('15 Messages')}</option>
<option value="20">{Lang::T('20 Messages')}</option>
<option value="20">{Lang::T('30 Messages')}</option>
<option value="20">{Lang::T('40 Messages')}</option>
<option value="20">{Lang::T('50 Messages')}</option>
<option value="20">{Lang::T('60 Messages')}</option>
</select>{Lang::T('Use 20 and above if you are sending to all customers to avoid server time out')}
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Delay')}</label>
<div class="col-md-6">
<select class="form-select" style="height: 52px; background-color: white;" name="delay" id="delay">
<option value="0" selected>{Lang::T('No Delay')}</option>
<option value="5">{Lang::T('5 Seconds')}</option>
<option value="10">{Lang::T('10 Seconds')}</option>
<option value="15">{Lang::T('15 Seconds')}</option>
<option value="20">{Lang::T('20 Seconds')}</option>
</select>{Lang::T('Use at least 5 secs if you are sending to all customers to avoid being banned by your message provider')}
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Message')}</label>
<div class="col-md-6">
<textarea class="form-control" id="message" name="message"
placeholder="{Lang::T('Compose your message...')}" rows="5"></textarea>
<input name="test" type="checkcard"> {Lang::T('Testing [if checked no real message is sent]')}
</div>
<p class="help-block col-md-4">
{Lang::T('Use placeholders:')}
<br>
<b>[[name]]</b> - {Lang::T('Customer Name')}
<br>
<b>[[user_name]]</b> - {Lang::T('Customer Username')}
<br>
<b>[[phone]]</b> - {Lang::T('Customer Phone')}
<br>
<b>[[company_name]]</b> - {Lang::T('Your Company Name')}
</p>
</div>
<center>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-success mb-3" type="submit" name=send value=now>
{Lang::T('Send Message')}</button>
<a class="btn btn-outline-primary" href="{$_url}dashboard" class="btn btn-default">{Lang::T('Cancel')}</a>
</div>
</div>
</center>
</form>
</div>
</div>
</div>
{if $batchStatus}
<p><span class="label label-success">Total SMS Sent: {$totalSMSSent}</span> <span class="label label-danger">Total SMS
Failed: {$totalSMSFailed}</span> <span class="label label-success">Total WhatsApp Sent:
{$totalWhatsappSent}</span> <span class="label label-danger">Total WhatsApp Failed:
{$totalWhatsappFailed}</span></p>
{/if}
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">
<h3 class="card-title">Message Results</h3>
</div>
<!-- /.card-header -->
<div class="table-responsive">
<table id="messageResultsTable" class="table table-bordered table-striped table-condensed table-hover border-primary">
<thead>
<tr>
<th>Name</th>
<th>Phone</th>
<th>Message</th>
<th>Status</th>
</tr>
</thead>
<tbody>
{foreach $batchStatus as $customer}
<tr>
<td>{$customer.name}</td>
<td>{$customer.phone}</td>
<td>{$customer.message}</td>
<td>{$customer.status}</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
<!-- /.card-body -->
</div>
</div>
<!-- /.card -->
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.min.js"></script>
<script>
var $j = jQuery.noConflict();
$j(document).ready(function () {
$j('#messageResultsTable').DataTable();
});
</script>
</div>
{include file="sections/footer.tpl"}

74
ui/ui/message-list.tpl Normal file
View File

@@ -0,0 +1,74 @@
{include file="sections/header.tpl"}
<style>
.dataTables_wrapper .dataTables_paginate .paginate_button {
display: inline-block;
padding: 5px 10px;
margin-right: 5px;
border: 1px solid #ccc;
background-color: #fff;
color: #333;
cursor: pointer;
}
</style>
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card card-hovered mb20 card-primary">
<div class="card-header">
{Lang::T('Manage Messages')}
</div>
<div class="card-body">
<br>&nbsp;
<div class="table-responsive table_mobile">
<table id="messageTable" class="table table-bordered table-striped table-condensed">
<thead>
<tr>
<th>{Lang::T('From')}</th>
<th>{Lang::T('To')}</th>
<th>{Lang::T('Title')}</th>
<th>{Lang::T('Date')}</th>
<th>{Lang::T('Status')}</th>
<th>{Lang::T('Actions')}</th>
</tr>
</thead>
<tbody>
{foreach $messages as $msg}
<tr {if $msg.status == 0}class="info"{/if}>
<td>{$msg.from_user}</td>
<td>{$msg.to_user}</td>
<td onclick="window.location.href = '{$_url}messages/view/{$msg.id}'" style="cursor:pointer;">{$msg.title}</td>
<td>{Lang::dateTimeFormat($msg.date)}</td>
<td>{if $msg.status == 0}{Lang::T('Not Sent')}{else}{Lang::T('Sent')}{/if}</td>
<td align="center">
<a href="{$_url}messages/view/{$msg.id}" class="btn btn-success btn-xs">{Lang::T('View')}</a>
</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.min.js"></script>
<script>
var $j = jQuery.noConflict();
$j(document).ready(function() {
$j('#messageTable').DataTable({
"pagingType": "full_numbers",
"lengthMenu": [
[5, 10, 25, 50, 100, -1],
[5, 10, 25, 50, 100, "All"]
],
"pageLength": 25,
"order": [[3, 'desc']]
});
});
</script>
</div>
{include file="sections/footer.tpl"}

66
ui/ui/message.tpl Normal file
View File

@@ -0,0 +1,66 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">
<h3 class="card-title">{Lang::T('Send Personal Message')}</h3>
</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}message/send-post">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Customer')}</label>
<div class="col-md-6">
<select {if $cust}{else}id="personSelect" {/if} class="form-select" style="height: 52px; background-color: white;"
name="id_customer" style="width: 100%"
data-placeholder="{Lang::T('Select a customer')}...">
{if $cust}
<option value="{$cust['id']}">{$cust['username']} &bull; {$cust['fullname']} &bull;
{$cust['email']}</option>
{/if}
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Send Via')}</label>
<div class="col-md-6">
<select class="form-select" style="height: 52px; background-color: white;" name="via" id="via">
<option value="sms" selected> {Lang::T('SMS')}</option>
<option value="wa"> {Lang::T('WhatsApp')}</option>
<option value="both"> {Lang::T('SMS and WhatsApp')}</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Message')}</label>
<div class="col-md-6">
<textarea class="form-control" id="message" name="message"
placeholder="{Lang::T('Compose your message...')}" rows="5"></textarea>
</div>
<p class="help-block col-md-4">
{Lang::T('Use placeholders:')}
<br>
<b>[[name]]</b> - {Lang::T('Customer Name')}
<br>
<b>[[user_name]]</b> - {Lang::T('Customer Username')}
<br>
<b>[[phone]]</b> - {Lang::T('Customer Phone')}
<br>
<b>[[company_name]]</b> - {Lang::T('Your Company Name')}
</p>
</div>
<center>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-success mb-3" type="submit">{Lang::T('Send Message')}</button>
<a class="btn btn-outline-primary href="{$_url}dashboard" class="btn btn-default">{Lang::T('Cancel')}</a>
</div>
</div>
</center>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

78
ui/ui/onlinehotspot.tpl Normal file
View File

@@ -0,0 +1,78 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Online Hotspot Users</title>
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.11.5/datatables.min.css"/>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.11.5/datatables.min.js"></script>
<style>
table.dataTable thead th,
table.dataTable thead td {
padding: 10px 18px;
border-bottom: 1px solid #e2e8f0;
}
table.dataTable tbody td {
padding: 10px 18px;
border-bottom: 1px solid #e2e8f0;
}
.disconnect-btn {
padding: 5px 10px;
background-color: #d53f8c;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
}
</style>
</head>
<body class="bg-gray-100">
<div class="container mx-auto px-4 py-8">
<h1 class="text-2xl font-bold mb-4">Online Hotspot Users</h1>
<table id="hotspotUsersTable" class="stripe hover" style="width:100%">
<thead>
<tr>
<th>Username</th>
<th>Address</th>
<th>Uptime</th>
<th>Server</th>
<th>MAC</th>
<th>Session Time</th>
<th>Rx Bytes</th>
<th>Tx Bytes</th>
<th>Total Bytes</th>
<th>Action</th> <!-- Added column for action -->
</tr>
</thead>
<tbody>
{foreach $onlineHotspotUsers as $user}
<tr>
<td>{$user.username}</td>
<td>{$user.address}</td>
<td>{$user.uptime}</td>
<td>{$user.server}</td>
<td>{$user.mac}</td>
<td>{$user.session_time}</td>
<td>{$user.rx_bytes}</td>
<td>{$user.tx_bytes}</td>
<td>{$user.total}</td>
<td><button class="disconnect-btn" onclick="disconnectUser('{$user.username}')">Disconnect</button></td> <!-- Disconnect button -->
</tr>
{/foreach}
</tbody>
</table>
</div>
<script>
$(document).ready(function() {
$('#hotspotUsersTable').DataTable();
});
function disconnectUser(username) {
// You can perform disconnect action here, such as making an AJAX call to disconnect the user
alert('Disconnecting user: ' + username);
}
</script>
</body>
</html>

63
ui/ui/page-edit.tpl Normal file
View File

@@ -0,0 +1,63 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card mb20 card-primary card-hovered">
<div class="card-header">
<h3 class="card-title">{$pageHeader}</h3>
<div class="btn-group pull-right">
<a class="btn btn-danger btn-xs" title="Reset File" href="{$_url}pages/{$PageFile}-reset" onclick="return confirm('Reset File?')"><span
class="fa fa-refresh" aria-hidden="true"></span></a>
</div>
</div>
<div id="myNiccard" style="width: 100%;"></div>
<div id="card-edit" class="card-body">{$htmls}</div>
{if $writeable}
<div class="card-footer">
<a href="javascript:saveIt()" class="btn btn-primary btn-block">SAVE</a>
<br>
<p class="help-block">{Lang::T("Sometimes you need to refresh 3 times until content change")}</p>
<input type="text" class="form-control" onclick="this.select()" readonly
value="{$app_url}/pages/{$PageFile}.html">
</div>
{else}
<div class="card-footer">
{Lang::T("Failed to save page, make sure i can write to folder pages, <i>chmod 664 pages/*.html<i>")}
</div>
{/if}
{if $PageFile=='Voucher'}
<div class="card-footer">
<p class="help-block">
<b>[[company_name]]</b> Your Company Name at Settings.<br>
<b>[[price]]</b> Plan Price.<br>
<b>[[voucher_code]]</b> Voucher Code.<br>
<b>[[plan]]</b> Voucher Plan.<br>
<b>[[counter]]</b> Counter.<br>
</p>
</div>
{/if}
</div>
</div>
</div>
<form id="formpages" class="hidden" method="post" role="form" action="{$_url}pages/{$PageFile}-post">
<textarea name="html" id="html"></textarea>
</form>
<script src="ui/ui/scripts/nicEdit.js"></script>
{literal}
<script type="text/javascript">
var myNicEditor
bkLib.onDomLoaded(function() {
myNicEditor = new nicEditor({fullcard : true});
myNicEditor.setcard('myNiccard');
myNicEditor.addInstance('card-edit');
});
function saveIt() {
//alert(document.getElementById('card-edit').innerHTML);
document.getElementById('html').value = nicEditors.findEditor('card-edit').getContent()
document.getElementById('formpages').submit();
}
</script>
{/literal}
</div>
{include file="sections/footer.tpl"}

20
ui/ui/pagination.tpl Normal file
View File

@@ -0,0 +1,20 @@
{if $paginator}
<nav aria-label="Page navigation example" style="margin-top: 6px;">
<ul class="pagination justify-content-end" style="border-radius: 6px;">
<li style="background: #D7DAE3;" {if empty($paginator['prev'])}class="disabled page-item" {/if}>
<a class="page-link" href="{$paginator['url']}{$paginator['prev']}" aria-label="Previous">
<span aria-hidden="true">{Lang::T('Prev')}</span>
</a>
</li>
{foreach $paginator['pages'] as $page}
<li class="page-item {if $paginator['page'] == $page}active{elseif $page == '...'}disabled{/if}"><a class="page-link"
href="{$paginator['url']}{$page}">{$page}</a></li>
{/foreach}
<li style="background: #D7DAE3;" {if $paginator['page']>=$paginator['count']}class="disabled page-item" {/if}>
<a class="page-link" href="{$paginator['url']}{$paginator['next']}" aria-label="Next">
<span aria-hidden="true">{Lang::T('Next')}</span>
</a>
</li>
</ul>
</nav>
{/if}

35
ui/ui/paymentgateway.tpl Normal file
View File

@@ -0,0 +1,35 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<form method="post">
<div class="row">
<div class="col-md-12 col-md-offset-3">
<div class="card card-info card-hovered">
<div class="card-header">
<h3 class="card-title">{Lang::T('Payment Gateway')}</h3>
</div>
<div class="table-responsive card-body">
<table class="table table-striped table-condensed">
<tbody>
{foreach $pgs as $pg}
<tr>
<td width="12" align="center" valign="center"><input type="checkbox" name="pgs[]"
{if in_array($pg, $actives)}checked{/if} value="{$pg}"></td>
<td><a href="{$_url}paymentgateway/{$pg}"
class="btn btn-block btn-{if in_array($pg, $actives)}info{else}default{/if} text-left">{ucwords($pg)}</a>
</td>
<td width="12"><a href="{$_url}paymentgateway/delete/{$pg}"
onclick="return confirm('{Lang::T('Delete')} {$pg}?')" class="btn btn-danger"><i
class="fa fa-trash"></i></a></td>
</tr>
{/foreach}
</tbody>
</table>
</div>
<div class="card-footer"><button type="submit" class="btn btn-primary btn-block" name="save"
value="actives">{Lang::T('Save Changes')}</button></div>
</div>
</div>
</div>
</form>
</div>
{include file="sections/footer.tpl"}

69
ui/ui/plan-edit.tpl Normal file
View File

@@ -0,0 +1,69 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card card-primary">
<div class="card-header">
<h3 class="card-title">Edit Plan</h3>
</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}plan/edit-post">
<input type="hidden" name="id" value="{$d['id']}">
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Select Account')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="username" name="username"
value="{$d['username']}" readonly>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Service Plan')}</label>
<div class="col-md-6">
<select id="id_plan" name="id_plan" class="form-select" style="height: 52px; background-color: white;">
{foreach $p as $ps}
<option value="{$ps['id']}" {if $d['plan_id'] eq $ps['id']} selected {/if}>
{if $ps['enabled'] neq 1}DISABLED PLAN &bull; {/if}
{if $ps['is_radius']=='1'}Radius{else}{$ps['routers']}{/if} &bull; {$ps['name_plan']}</option>
{/foreach}
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Created On')}</label>
<div class="col-md-4 mb-2">
<input type="date" class="form-control" name="expiration" readonly
value="{$d['recharged_on']}">
</div>
<div class="col-md-2">
<input type="text" class="form-control" placeholder="00:00:00" readonly
value="{$d['recharged_time']}">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Expires On')}</label>
<div class="col-md-4 mb-2">
<input type="date" class="form-control" id="expiration" name="expiration"
value="{$d['expiration']}">
</div>
<div class="col-md-2">
<input type="text" class="form-control" id="time" name="time" placeholder="00:00:00"
value="{$d['time']}">
</div>
</div>
<center>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-success mb-3"
type="submit">{Lang::T('Edit')}</button>
Or <a href="{$_url}plan/list" class="btn btn-outline-primary">{Lang::T('Cancel')}</a>
</div>
</div>
</center>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

407
ui/ui/plan.tpl Normal file
View File

@@ -0,0 +1,407 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card card-hovered mb20 card-primary">
<div class="card-header">
<h3 class="card-title">Plans</h3>
{if in_array($_admin['user_type'],['SuperAdmin','Admin'])}
<div>
<div class="btn-group pull-right">
<a class="btn btn-primary" title="save" href="{$_url}plan/sync"
onclick="return confirm('This will sync/send Caustomer active plan to Mikrotik?')"><span
class="fa fa-refresh" aria-hidden="true"></span> sync</a>
</div>
<div class="btn-group pull-right">
<a class="btn btn-info" title="save" href="{$_url}customers/csv"
onclick="return confirm('This will export to CSV?')"><span class="fa fa-download"
aria-hidden="true"></span> CSV</a>
</div>
</div>
{/if}
&nbsp;
</div>
<div class="card-body">
<div class="md-whiteframe-z1 mb20 text-center row">
<div class="col-md-8 mb-3">
<form id="site-search" method="post" action="{$_url}plan/list/">
<div class="input-group">
<div class="input-group-text">
<span class="fa fa-search"></span>
</div>
<input type="text" name="search" class="form-control"
placeholder="{Lang::T('Search by Username')}..." value="{$search}">
<button class="btn btn-success input-group-btn" type="submit">{Lang::T('Search')}</button>
<!-- <div class="input-group-btn">
</div> -->
</div>
</form>
</div>
<div class="col-md-4">
<a href="{$_url}plan/recharge" class="btn btn-primary btn-block"><i
class="fa fa-add"> </i> {Lang::T('Recharge Account')}</a>
</div>&nbsp;
</div>
<div class="table-responsive">
<table id="datatable" class="table table-bordered table-striped table-condensed table-hover border-primary">
<thead>
<tr>
<th>{Lang::T('Username')}</th>
<th>{Lang::T('Plan Name')}</th>
<th>{Lang::T('Plan Type')}</th>
<th>{Lang::T('Created On')}</th>
<th>{Lang::T('Expires On')}</th>
<th>{Lang::T('Status')}</th>
<th>{Lang::T('Time Left')}</th>
<th>{Lang::T('Method')}</th>
<th>{Lang::T('Routers')}</th>
<th>{Lang::T('Manage')}</th>
</tr>
</thead>
<tbody>
{foreach $d as $ds}
<tr {if $ds['is_off']}class="danger" {elseif $ds['is_suspended']}class="warning" {/if}>
<td><a href="{$_url}customers/viewu/{$ds['username']}">{$ds['username']}</a></td>
<td>{$ds['namebp']}</td>
<td>{$ds['type']}</td>
<td>{Lang::dateAndTimeFormat($ds['recharged_on'],$ds['recharged_time'])}</td>
<td>{Lang::dateAndTimeFormat($ds['expiration'],$ds['time'])}</td>
<td>
{if $ds['is_active']}
<span class="badge badge-success">Active</span>
{elseif $ds['is_suspended'] && $ds['is_expired']}
<span class="badge badge-warning">Suspended</span>
{elseif $ds['is_suspended'] && !$ds['is_expired']}
<span class="badge badge-info">Suspending</span>
{else}
<span class="badge badge-danger">Inactive</span>
{/if}
</td>
<td>
{if $ds['is_suspended'] && !$ds['is_expired']}
<span class="text-warning" id="countdown-{$ds['id']}">
<i class="fa fa-clock-o"></i> <span id="minutes-{$ds['id']}">Calculating...</span>
</span>
{elseif $ds['is_expired']}
<span class="text-danger">Expired</span>
{else}
<span class="text-muted">-</span>
{/if}
</td>
<td>{$ds['method']}</td>
<td>{$ds['routers']}</td>
<td>
<a href="{$_url}plan/edit/{$ds['id']}"
class="btn btn-warning btn-xs mb-1">{Lang::T('Edit')}</a>
{if !$ds['is_off'] && !($ds['is_suspended'] && $ds['is_expired'])}
<button type="button" class="btn btn-warning btn-xs mb-1"
onclick="showSuspendModal({$ds['id']}, '{$ds['username']}')"
title="{Lang::T('Suspend Customer')}">
<i class="fa fa-pause"></i> {Lang::T('Suspend')}
</button>
{elseif $ds['is_suspended'] && $ds['is_expired']}
<span class="btn btn-secondary btn-xs mb-1 disabled">
<i class="fa fa-pause"></i> {Lang::T('Suspended')}
</span>
{else}
<span class="btn btn-secondary btn-xs mb-1 disabled">
<i class="fa fa-ban"></i> {Lang::T('Inactive')}
</span>
{/if}
<a href="{$_url}plan/recharge/{$ds['customer_id']}"
class="btn btn-success btn-xs mb-1"
title="{Lang::T('Recharge Customer')}">
<i class="fa fa-refresh"></i> {Lang::T('Recharge')}
</a>
{if in_array($_admin['user_type'],['SuperAdmin','Admin'])}
<a href="{$_url}plan/delete/{$ds['id']}" id="{$ds['id']}"
onclick="return confirm('{Lang::T('Delete')}?')"
class="btn btn-danger btn-xs"><i class="fa fa-trash"></i></a>
{/if}
</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
</div>
<!-- Suspend Confirmation Modal -->
<div class="modal fade" id="suspendModal" tabindex="-1" role="dialog" aria-labelledby="suspendModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="suspendModalLabel">{Lang::T('Suspend Customer')}</h5>
<button type="button" class="close" onclick="closeSuspendModal()" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<form id="suspendForm" method="post" action="{$_url}plan/suspend-confirm">
<div class="modal-body">
<input type="hidden" id="suspend_customer_id" name="id" value="">
<div class="form-group">
<label for="customer_name">{Lang::T('Customer')}:</label>
<input type="text" class="form-control" id="customer_name" readonly>
</div>
<div class="form-group">
<label for="suspension_date">{Lang::T('Suspension Date')}:</label>
<input type="date" class="form-control" id="suspension_date" name="suspension_date" required>
</div>
<div class="form-group">
<label for="suspension_time">{Lang::T('Suspension Time')}:</label>
<input type="time" class="form-control" id="suspension_time" name="suspension_time" required>
</div>
<div class="alert alert-info">
<i class="fa fa-info-circle"></i> {Lang::T('The customer will be suspended at the specified date and time.')}
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" onclick="closeSuspendModal()">{Lang::T('Cancel')}</button>
<button type="submit" class="btn btn-warning">{Lang::T('Suspend Customer')}</button>
</div>
</form>
</div>
</div>
</div>
<!-- Recharge Modal - Removed as recharge now navigates to dedicated page -->
<script>
// Recharge Modal - Removed as recharge now navigates to dedicated page
// Recharge modal functions removed as recharge now navigates to dedicated page
function showSuspendModal(customerId, customerName) {
document.getElementById('suspend_customer_id').value = customerId;
document.getElementById('customer_name').value = customerName;
// Set default date and time (6 minutes from now)
var now = new Date();
now.setMinutes(now.getMinutes() + 6);
var dateStr = now.toISOString().split('T')[0];
var timeStr = now.toTimeString().split(' ')[0].substring(0, 5);
document.getElementById('suspension_date').value = dateStr;
document.getElementById('suspension_time').value = timeStr;
// Show modal using both jQuery and vanilla JS for compatibility
if (typeof $ !== 'undefined' && $.fn.modal) {
$('#suspendModal').modal('show');
} else {
// Fallback for vanilla JS
var modal = document.getElementById('suspendModal');
modal.style.display = 'block';
modal.classList.add('show');
document.body.classList.add('modal-open');
// Add backdrop
var backdrop = document.createElement('div');
backdrop.className = 'modal-backdrop fade show';
backdrop.id = 'modal-backdrop';
document.body.appendChild(backdrop);
}
}
function closeSuspendModal() {
// Close modal using both jQuery and vanilla JS for compatibility
if (typeof $ !== 'undefined' && $.fn.modal) {
$('#suspendModal').modal('hide');
} else {
// Fallback for vanilla JS
var modal = document.getElementById('suspendModal');
modal.style.display = 'none';
modal.classList.remove('show');
document.body.classList.remove('modal-open');
// Remove backdrop
var backdrop = document.getElementById('modal-backdrop');
if (backdrop) {
backdrop.remove();
}
}
}
// Close modal when clicking outside of it
document.addEventListener('click', function(event) {
var modal = document.getElementById('suspendModal');
if (event.target === modal) {
closeSuspendModal();
}
});
// Close modal with Escape key
document.addEventListener('keydown', function(event) {
if (event.key === 'Escape') {
var modal = document.getElementById('suspendModal');
if (modal.classList.contains('show')) {
closeSuspendModal();
}
}
});
// Countdown timer for suspended users
function updateCountdowns() {
var now = new Date().getTime();
var hasExpired = false;
document.querySelectorAll('[id^="countdown-"]').forEach(function(element) {
var customerId = element.id.replace('countdown-', '');
var minutesElement = document.getElementById('minutes-' + customerId);
if (minutesElement) {
// Get expiry time from the table row
var row = element.closest('tr');
var expiryCell = row.querySelector('td:nth-child(5)'); // Expires On column
var expiryText = expiryCell.textContent.trim();
// Parse the expiry date and time
var expiryDate = new Date(expiryText);
if (!isNaN(expiryDate.getTime())) {
var timeLeft = expiryDate.getTime() - now;
if (timeLeft > 0) {
var minutes = Math.floor(timeLeft / (1000 * 60));
var hours = Math.floor(minutes / 60);
var days = Math.floor(hours / 24);
var displayText = '';
if (days > 0) {
displayText = days + 'd ' + (hours % 24) + 'h ' + (minutes % 60) + 'm';
} else if (hours > 0) {
displayText = hours + 'h ' + (minutes % 60) + 'm';
} else {
displayText = minutes + 'm';
}
minutesElement.textContent = displayText;
} else {
// Timer has expired - update UI immediately
minutesElement.textContent = 'Expired';
element.className = 'text-danger';
// Update the status badge to Inactive
var statusCell = row.querySelector('td:nth-child(6)'); // Status column
if (statusCell) {
var badge = statusCell.querySelector('.badge');
if (badge) {
badge.className = 'badge badge-danger';
badge.textContent = 'Inactive';
}
}
// Update the suspend button to show Inactive
var suspendButton = row.querySelector('button[onclick*="showSuspendModal"]');
if (suspendButton) {
suspendButton.outerHTML = '<span class="btn btn-secondary btn-xs mb-1 disabled"><i class="fa fa-ban"></i> Inactive</span>';
}
hasExpired = true;
}
}
}
});
// If any countdown expired, refresh the page after a short delay to sync with backend
if (hasExpired) {
setTimeout(function() {
location.reload();
}, 2000); // Wait 2 seconds before refreshing
}
}
// Update countdowns every 10 seconds for better real-time experience
setInterval(updateCountdowns, 10000);
// Initial update
document.addEventListener('DOMContentLoaded', function() {
updateCountdowns();
// Initialize modal form interactions
initializeModalForm();
});
// Initialize Modal Form Interactions
function initializeModalForm() {
// Load servers when type changes
$('input[type=radio][name="type"]').change(function(){
$("#modal_server").html('<option value="">{Lang::T('Select Routers')}</option>');
$("#modal_plan").html('<option value="">{Lang::T('Select Plans')}</option>');
$("#modal-server-help").text('Loading routers...');
$("#modal-plan-help").text('Select a router first to load available plans');
if ($('#modalHot').is(':checked') || $('#modalPOE').is(':checked')) {
$.ajax({
type: "POST",
dataType: "html",
url: "index.php?_route=autoload/server",
success: function(msg){
$("#modal_server").html(msg);
$("#modal_server").prop('disabled', false);
// Update help text
var serverCount = $("#modal_server option").length - 1;
if (serverCount > 0) {
$("#modal-server-help").text('Found ' + serverCount + ' router(s) available');
} else {
$("#modal-server-help").text('No routers found. Please add routers first.');
}
},
error: function(xhr, status, error) {
$("#modal-server-help").text('Error loading routers. Please try again.');
}
});
}
});
// Load plans when server changes
$("#modal_server").change(function(){
var server = $("#modal_server").val();
var jenis = $('input[name="type"]:checked').val();
if (server && jenis) {
$("#modal-plan-help").text('Loading plans...');
$.ajax({
type: "POST",
dataType: "html",
url: "index.php?_route=autoload/plan",
data: "jenis=" + jenis + "&server=" + server,
success: function(msg){
$("#modal_plan").html(msg);
$("#modal_plan").prop('disabled', false);
// Update help text
var planCount = $("#modal_plan option").length - 1;
if (planCount > 0) {
$("#modal-plan-help").text('Found ' + planCount + ' plan(s) available');
} else {
$("#modal-plan-help").text('No plans found for this router and type. Please create plans first.');
}
},
error: function(xhr, status, error) {
$("#modal-plan-help").text('Error loading plans. Please try again.');
}
});
} else {
$("#modal_plan").html('<option value="">{Lang::T('Select Plans')}</option>');
$("#modal-plan-help").text('Select a router and type first to load available plans');
}
});
}
</script>
{include file="sections/footer.tpl"}

92
ui/ui/plugin-manager.tpl Normal file
View File

@@ -0,0 +1,92 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card card-primary card-hovered">
<div class="card-header">
<h3 class="card-title">{Lang::T('Plugin')}</h3>
</div>
<div class="card-body row">
{foreach $plugins as $plugin}
<div class="col-md-6">
<div class="card kanbanPreview-bx">
<div class="card-body">
<div class="sub-card">
<span class="text-warning sub-title fs-14">{$plugin['name']}</span>
<p class="font-w300">{$plugin['description']}</p>
<div class="row justify-content-between align-items-center">
<div>
<span>
<center>
<small><i>@{$plugin['author']} Last update: {$plugin['last_update']}</i></small>
</center>
</span>
</div>
<div class="btn-group btn-group-justified mb-2" role="group" aria-label="...">
<a href="{$plugin['url']}" target="_blank" class="btn btn-primary"><i
class="fa fa-globe"></i> Web</a>
<a href="{$plugin['github']}" target="_blank" class="btn btn-info"><i
class="fa fa-align-left"></i> Source</a>
</div>
<div class="btn-group btn-group-justified" role="group" aria-label="...">
<a href="{$_url}pluginmanager/delete/plugin/{$plugin['id']}" onclick="return confirm('{Lang::T('Delete')}?')" class="btn btn-danger"><i
class="fa fa-trash"></i> Delete</a>
<a {if $zipExt } href="{$_url}pluginmanager/install/plugin/{$plugin['id']}"
onclick="return confirm('Installing plugin will take some time to complete, do not close the page while it loading to install the plugin')"
{else} href="#" onclick="alert('PHP ZIP extension is not installed')"
{/if}
class="btn btn-success"><i class="fa fa-circle-arrow-down"></i> Install</a>
</div>
</div>
</div>
</div>
</div>
</div>
{/foreach}
</div>
</div>
</div>
<div class="col-sm-12">
<div class="card card-primary card-hovered">
<div class="card-header">
<h3 class="card-title">{Lang::T('Payment Gateway')}</h3>
</div>
<div class="card-body row">
foreach $pgs as $pg}
<div class="col-md-6">
<div class="card kanbanPreview-bx">
<div class="card-body">
<div class="sub-card">
<span class="text-warning sub-title fs-14">{$pg['name']}</span>
<p class="font-w300">{$pg['description']}</p>
<div class="row justify-content-between align-items-center">
<div>
<span>
<center>
<small><i>@{$pg['author']} Last update: {$pg['last_update']}</i></small>
</center>
</span>
</div>
<div class="btn-group btn-group-justified" role="group" aria-label="...">
<a href="{$pg['url']}" target="_blank" class="btn btn-primary"><i
class="fa fa-globe"></i> Web</a>
<a href="{$pg['github']}" target="_blank" class="btn btn-info"><i
class="fa fa-align-left"></i> Source</a>
<a {if $zipExt } href="{$_url}pluginmanager/install/payment/{$pg['id']}"
onclick="return confirm('Installing plugin will take some time to complete, do not close the page while it loading to install the plugin')"
{else} href="#" onclick="alert('PHP ZIP extension is not available')"
{/if}
class="btn btn-success"><i class="fa fa-circle-arrow-down"></i> Install</a>
</div>
</div>
</div>
</div>
</div>
</div>
{/foreach}
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

70
ui/ui/pool.tpl Normal file
View File

@@ -0,0 +1,70 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card card-hovered mb20 card-primary">
<div class="card-header">
<h3 class="card-title">{Lang::T('IP Pool')}</h3>
<div class="btn-group pull-right">
<a class="btn btn-primary btn-xs" title="save" href="{$_url}pool/sync"
onclick="return confirm('This will sync/send IP Pool to Mikrotik?')"><span
class="fa fa-refresh" aria-hidden="true"></span> sync</a>
</div>
</div>
<div class="card-body">
<div class="md-whiteframe-z1 mb20 text-center row">
<div class="col-md-8 mb-3">
<form id="site-search" method="post" action="{$_url}pool/list/">
<div class="input-group">
<div class="input-group-text">
<span class="fa fa-search"></span>
</div>
<input type="text" name="name" class="form-control"
placeholder="{Lang::T('Search by Name')}...">
<button class="btn btn-success input-group-btn" type="submit">{Lang::T('Search')}</button>
<!-- <div class="input-group-btn">
</div> -->
</div>
</form>
</div>
<div class="col-md-4">
<a href="{$_url}pool/add" class="btn btn-primary btn-block"><i
class="fa fa-add"> </i> {Lang::T('New Pool')}</a>
</div>&nbsp;
</div>
<div class="table-responsive">
<table class="table table-bordered table-striped table-condensed table-hover border-primary">
<thead>
<tr>
<th>{Lang::T('Name Pool')}</th>
<th>{Lang::T('Range IP')}</th>
<th>{Lang::T('Routers')}</th>
<th>{Lang::T('Manage')}</th>
<th>ID</th>
</tr>
</thead>
<tbody>
{foreach $d as $ds}
<tr>
<td>{$ds['pool_name']}</td>
<td>{$ds['range_ip']}</td>
<td>{$ds['routers']}</td>
<td align="center">
<a href="{$_url}pool/edit/{$ds['id']}" class="btn btn-info btn-xs mb-1">{Lang::T('Edit')}</a>
<a href="{$_url}pool/delete/{$ds['id']}" id="{$ds['id']}"
onclick="return confirm('{Lang::T('Delete')}?')"
class="btn btn-danger btn-xs"><i class="fa fa-trash"></i></a>
</td>
<td>{$ds['id']}</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

88
ui/ui/radius-nas-add.tpl Normal file
View File

@@ -0,0 +1,88 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">
<h3 class="card-title">Radius - Add NAS </h3></div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}radius/nas-add-post">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Router Name')}</label>
<div class="col-md-6">
<input type="text" required class="form-control" id="shortname" name="shortname" maxlength="32">
<p class="help-block">{Lang::T('Name of Area that router operated')}</p>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('IP Address')}</label>
<div class="col-md-6">
<input type="text" placeholder="192.168.88.1" required class="form-control" id="nasname"
name="nasname" maxlength="128">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Secret</label>
<div class="col-md-6">
<input type="password" class="form-control" id="secret" name="secret" required
onmouseleave="this.type = 'password'" onmouseenter="this.type = 'text'" maxlength="60">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Ports</label>
<div class="col-md-2">
<input type="text" class="form-control" id="ports" name="ports" placeholder="null">
</div>
<label class="col-md-2 control-label">Type</label>
<div class="col-md-2">
<input type="text" class="form-control" id="type" name="type" value="other" required
placeholder="other">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Server</label>
<div class="col-md-2">
<input type="text" class="form-control" id="server" name="server" placeholder="null">
</div>
<label class="col-md-2 control-label">Community</label>
<div class="col-md-2">
<input type="text" class="form-control" id="community" name="community" placeholder="null">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Description')}</label>
<div class="col-md-6">
<textarea class="form-control" id="description" name="description"></textarea>
<p class="help-block">{Lang::T('Explain Coverage of router')}</p>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label"><a href="{$_url}routers/add">{Lang::T('Routers')}</a></label>
<div class="col-md-6">
<select id="routers" name="routers" class="form-select" style="height: 52px; background-color: white;">
<option value="">No Router</option>
{foreach $routers as $rs}
<option value="{$rs['name']}">{$rs['name']}</option>
{/foreach}
</select>
</div>
<p class="help-block col-md-4">Assign NAS to Router</p>
</div>
<center>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-primary mb-3"
type="submit">{Lang::T('Save Changes')}</button>
Or <a class="btn btn-outline-primary href="{$_url}radius/nas-list">{Lang::T('Cancel')}</a>
</div>
</div>
</center>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

88
ui/ui/radius-nas-edit.tpl Normal file
View File

@@ -0,0 +1,88 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">
<h3 class="card-title">Radius - Edit NAS</h3>
</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}radius/nas-edit-post/{$d['id']}">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Router Name')}</label>
<div class="col-md-6">
<input type="text" required class="form-control" id="shortname" name="shortname" value="{$d['shortname']}" maxlength="32">
<p class="help-block">{Lang::T('Name of Area that router operated')}</p>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('IP Address')}</label>
<div class="col-md-6">
<input type="text" placeholder="192.168.88.1" value="{$d['nasname']}" required class="form-control" id="nasname"
name="nasname" maxlength="128">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Secret</label>
<div class="col-md-6">
<input type="password" class="form-control" id="secret" name="secret" required value="{$d['secret']}"
onmouseleave="this.type = 'password'" onmouseenter="this.type = 'text'" maxlength="60">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Ports</label>
<div class="col-md-2">
<input type="text" class="form-control" id="ports" name="ports" placeholder="null" value="{$d['ports']}">
</div>
<label class="col-md-2 control-label">Type</label>
<div class="col-md-2">
<input type="text" class="form-control" id="type" name="type" value="other" value="{$d['type']}" required
placeholder="other">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">Server</label>
<div class="col-md-2">
<input type="text" class="form-control" id="server" name="server" value="{$d['server']}" placeholder="null">
</div>
<label class="col-md-2 control-label">Community</label>
<div class="col-md-2">
<input type="text" class="form-control" id="community" name="community" value="{$d['community']}" placeholder="null">
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Description')}</label>
<div class="col-md-6">
<textarea class="form-control" id="description" name="description"> {htmlentities($d['description'])}</textarea>
<p class="help-block">{Lang::T('Explain Coverage of router')}</p>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label"><a href="{$_url}routers/add">{Lang::T('Routers')}</a></label>
<div class="col-md-6">
<select id="routers" name="routers" class="form-select" style="height: 52px; background-color: white;">
<option value="">No Router</option>
{foreach $routers as $rs}
<option {if $rs['name'] == $d['routers']}selected{/if} value="{$rs['name']}">{$rs['name']}</option>
{/foreach}
</select>
</div>
<p class="help-block col-md-4">Assign NAS to Router</p>
</div>
<center>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-primary mb-3"
type="submit">{Lang::T('Save Changes')}</button>
Or <a class="btn btn-outline-primary" href="{$_url}radius/nas-list">{Lang::T('Cancel')}</a>
</div>
</div>
</center>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

73
ui/ui/radius-nas.tpl Normal file
View File

@@ -0,0 +1,73 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card card-hovered mb20 card-primary">
<div class="card-header">
<h3 class="card-title">Radius</h3>
</div>
<div class="card-body">
<div class="md-whiteframe-z1 mb20 text-center row">
<div class="col-md-8 mb-3">
<form id="site-search" method="post" action="{$_url}radius/nas-list">
<div class="input-group">
<div class="input-group-text">
<span class="fa fa-search"></span>
</div>
<input type="text" name="name" class="form-control" value="{$name}"
placeholder="{Lang::T('Search by Name')}...">
<button class="btn btn-success input-group-btn" type="submit">{Lang::T('Search')}</button>
<!-- <div class="input-group-btn">
</div> -->
</div>
</form>
</div>
<div class="col-md-4">
<a href="{$_url}radius/nas-add" class="btn btn-primary btn-block"><i
class="fa fa-add"> </i> New NAS</a>
</div>&nbsp;
</div>
<div class="table-responsive">
<table class="table table-bordered table-striped table-condensed table-hover border-primary">
<thead>
<tr>
<th>Name</th>
<th>IP</th>
<th>Type</th>
<th>Port</th>
<th>Server</th>
<th>Community</th>
<th>Routers</th>
<th>{Lang::T('Manage')}</th>
<th>ID</th>
</tr>
</thead>
<tbody>
{foreach $nas as $ds}
<tr>
<td>{$ds['shortname']}</td>
<td>{$ds['nasname']}</td>
<td>{$ds['type']}</td>
<td>{$ds['ports']}</td>
<td>{$ds['server']}</td>
<td>{$ds['community']}</td>
<td>{$ds['routers']}</td>
<td align="center">
<a href="{$_url}radius/nas-edit/{$ds['id']}" class="btn btn-info btn-xs mb-1">{Lang::T('Edit')}</a>
<a href="{$_url}radius/nas-delete/{$ds['id']}" id="{$ds['id']}"
onclick="return confirm('{Lang::T('Delete')}?')"
class="btn btn-danger btn-xs"><i class="fa fa-trash"></i></a>
</td>
<td align="center">{$ds['id']}</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

View File

@@ -0,0 +1,96 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-md-6 col-md-offset-3">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">
<h3 class="card-title">{Lang::T('Confirm')}</h3></div>
<div class="card-body">
<center><b>{Lang::T('Customer')}</b></center>
<ul class="list-group list-group-unbordered">
<li class="list-group-item">
<b>{Lang::T('Username')}</b> <span class="pull-right">{$cust['username']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Name')}</b> <span class="pull-right">{$cust['fullname']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Phone Number')}</b> <span class="pull-right">{$cust['phonenumber']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Email')}</b> <span class="pull-right">{$cust['email']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Address')}</b> <span class="pull-right">{$cust['address']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Balance')}</b> <span
class="pull-right">{Lang::moneyFormat($cust['balance'])}</span>
</li>
</ul>
<center><b>{Lang::T('Plan')}</b></center>
<ul class="list-group list-group-unbordered">
<li class="list-group-item">
<b>{Lang::T('Plan Name')}</b> <span class="pull-right">{$plan['name_plan']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Location')}</b> <span
class="pull-right">{if $plan['is_radius']}Radius{else}{$plan['routers']}{/if}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Type')}</b> <span
class="pull-right">{if $plan['prepaid'] eq 'yes'}Prepaid{else}Postpaid{/if}
{$plan['type']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Plan Price')}</b> <span
class="pull-right">{if $using eq 'zero'}{Lang::moneyFormat(0)}{else}{Lang::moneyFormat($plan['price'])}{/if}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Plan Validity')}</b> <span class="pull-right">{$plan['validity']}
{$plan['validity_unit']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Using')}</b> <span class="pull-right">{ucwords($using)}</span>
</li>
</ul>
<center><b>{Lang::T('Total')}</b></center>
<ul class="list-group list-group-unbordered">
{if $using neq 'zero' and $add_cost>0}
{foreach $bills as $k => $v}
<li class="list-group-item">
<b>{$k}</b> <span class="pull-right">{Lang::moneyFormat($v)}</span>
</li>
{/foreach}
<li class="list-group-item">
<b>{Lang::T('Additional Cost')}</b> <span
class="pull-right">{Lang::moneyFormat($add_cost)}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Total')}</b> <small>({Lang::T('Plan Price')} +{Lang::T('Additional Cost')})</small><span class="pull-right"
style="font-size: large; font-weight:bolder; font-family: 'Courier New', Courier, monospace; ">{Lang::moneyFormat($plan['price']+$add_cost)}</span>
</li>
{else}
<li class="list-group-item">
<b>{Lang::T('Total')}</b> <span class="pull-right"
style="font-size: large; font-weight:bolder; font-family: 'Courier New', Courier, monospace; ">{if $using eq 'zero'}{Lang::moneyFormat(0)}{else}{Lang::moneyFormat($plan['price'])}{/if}</span>
</li>
{/if}
</ul>
<form class="form-horizontal" method="post" role="form" action="{$_url}plan/recharge-post">
<input type="hidden" name="id_customer" value="{$cust['id']}">
<input type="hidden" name="plan" value="{$plan['id']}">
<input type="hidden" name="server" value="{$server}">
<input type="hidden" name="using" value="{$using}">
<input type="hidden" name="stoken" value="{App::getToken()}">
<center>
<button class="btn btn-success mb-3" type="submit">{Lang::T('Recharge')}</button><br>
<a class="btn btn-outline-primary" href="{$_url}plan/recharge">{Lang::T('Cancel')}</a>
</center>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

297
ui/ui/recharge.tpl Normal file
View File

@@ -0,0 +1,297 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">
<h3 class="card-title">{Lang::T('Recharge Account')}</h3></div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}plan/recharge-confirm">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Select Account')}</label>
<div class="col-md-6">
<select {if $cust}{else}id="personSelect"{/if} class="form-select select2" style="height: 52px; background-color: white;"
name="id_customer" style="width: 100%" data-placeholder="{Lang::T('Select a customer')}..." data-ajax="true">
{if $cust}
<option value="{$cust['id']}">{$cust['username']} &bull; {$cust['fullname']} &bull; {$cust['email']}</option>
{/if}
</select>
<span class="help-block" id="customer-help">
{Lang::T('Start typing to search for customers')}
</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Type')}</label>
<div class="col-md-6">
<label><input type="radio" id="Hot" name="type" value="Hotspot"> {Lang::T('Hotspot Plans')}</label>
<label><input type="radio" id="POE" name="type" value="PPPOE"> {Lang::T('PPPOE Plans')}</label>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Routers')}</label>
<div class="col-md-6">
<select id="server" data-type="server" name="server" class="form-control" style="height: 52px; background-color: white; cursor: pointer; z-index: 1000;">
<option value=''>{Lang::T('Select Routers')}</option>
</select>
<span class="help-block" id="server-help">
{Lang::T('Select service type first to load available routers')}
</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Service Plan')}</label>
<div class="col-md-6">
<select id="plan" name="plan" class="form-control" style="height: 52px; background-color: white; cursor: pointer; z-index: 1000;">
<option value=''>{Lang::T('Select Plans')}</option>
</select>
<span class="help-block" id="plan-help">
{Lang::T('Select a router and type first to load available plans')}
</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Using')}</label>
<div class="col-md-6">
<select name="using" class="form-control" style="height: 52px; background-color: white; cursor: pointer; z-index: 1000;">
<option value="cash">{Lang::T('Cash')}</option>
{if $_c['enable_balance'] eq 'yes'}
<option value="balance">{Lang::T('Customer Balance')}</option>
{/if}
<option value="zero">{$_c['currency_code']} 0</option>
</select>
</div>
<p class="help-block col-md-4">Postpaid Recharge for the first time use {$_c['currency_code']} 0</p>
</div>
<center>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-success mb-3"
type="submit">{Lang::T('Recharge')}</button>
Or <a class="btn btn-outline-primary href="{$_url}customers/list">{Lang::T('Cancel')}</a>
</div>
</div>
</center>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}
<script>
$(document).ready(function() {
console.log('Recharge form loaded');
console.log('jQuery version:', $.fn.jquery);
console.log('Select2 available:', typeof $.fn.select2);
// Initialize customer select2 with AJAX (if not pre-selected)
if ($('#personSelect').length > 0) {
console.log('Initializing customer select2 with AJAX');
setTimeout(function() {
try {
// Destroy existing select2 if it exists
if ($('#personSelect').hasClass('select2-hidden-accessible')) {
$('#personSelect').select2('destroy');
console.log('Destroyed existing customer select2');
}
$('#personSelect').select2({
theme: "bootstrap",
width: '100%',
ajax: {
url: function(params) {
var url = './index.php?_route=autoload/customer_select2';
if(params.term != undefined){
url += '&s=' + encodeURIComponent(params.term);
}
console.log('Customer AJAX URL:', url);
return url;
},
dataType: 'json',
delay: 250,
data: function (params) {
return {
s: params.term || '',
page: params.page || 1
};
},
processResults: function (data, params) {
console.log('Customer AJAX response:', data);
return {
results: data.results || []
};
},
cache: true,
error: function(xhr, status, error) {
console.error('Customer AJAX error:', error);
console.error('Response:', xhr.responseText);
}
},
minimumInputLength: 0,
placeholder: '{Lang::T('Select a customer')}...',
allowClear: true
});
console.log('Customer select2 initialized with AJAX');
} catch (error) {
console.error('Error initializing customer select2:', error);
}
}, 200);
// Add customer dropdown event handlers
$('#personSelect').on('select2:open', function() {
console.log('Customer dropdown opened');
});
$('#personSelect').on('select2:select', function(e) {
console.log('Customer selected:', e.params.data);
});
}
// Load servers when type changes
$('input[type=radio][name="type"]').change(function(){
console.log('Type changed:', $('input[name="type"]:checked').val());
$("#server").html('<option value="">{Lang::T('Select Routers')}</option>');
$("#plan").html('<option value="">{Lang::T('Select Plans')}</option>');
$("#server-help").text('Loading routers...');
$("#plan-help").text('Select a router first to load available plans');
if ($('#Hot').is(':checked')) {
$.ajax({
type: "POST",
dataType: "html",
url: "index.php?_route=autoload/server",
success: function(msg){
console.log('Servers loaded successfully');
console.log('Servers HTML:', msg);
$("#server").html(msg);
$("#server").prop('disabled', false);
// Update help text
var serverCount = $("#server option").length - 1;
if (serverCount > 0) {
$("#server-help").text('Found ' + serverCount + ' router(s) available');
} else {
$("#server-help").text('No routers found. Please add routers first.');
}
},
error: function(xhr, status, error) {
console.error('Error loading servers:', error);
$("#server-help").text('Error loading routers. Please check console for details.');
alert('Error loading servers. Please check console for details.');
}
});
} else if ($('#POE').is(':checked')) {
$.ajax({
type: "POST",
dataType: "html",
url: "index.php?_route=autoload/server",
success: function(msg){
console.log('Servers loaded successfully');
console.log('Servers HTML:', msg);
$("#server").html(msg);
$("#server").prop('disabled', false);
// Update help text
var serverCount = $("#server option").length - 1;
if (serverCount > 0) {
$("#server-help").text('Found ' + serverCount + ' router(s) available');
} else {
$("#server-help").text('No routers found. Please add routers first.');
}
},
error: function(xhr, status, error) {
console.error('Error loading servers:', error);
$("#server-help").text('Error loading routers. Please check console for details.');
alert('Error loading servers. Please check console for details.');
}
});
}
});
// Load plans when server changes
$("#server").change(function(){
var server = $("#server").val();
var jenis = $('input[name="type"]:checked').val();
console.log('Server changed:', server, 'Type:', jenis);
if (server && jenis) {
$("#plan-help").text('Loading plans...');
$.ajax({
type: "POST",
dataType: "html",
url: "index.php?_route=autoload/plan",
data: "jenis=" + jenis + "&server=" + server,
success: function(msg){
console.log('Plans loaded successfully');
console.log('Plans HTML:', msg);
$("#plan").html(msg);
// Ensure the dropdown is enabled and clickable
$("#plan").prop('disabled', false);
$("#plan").removeClass('disabled');
// Update help text
var planCount = $("#plan option").length - 1;
if (planCount > 0) {
$("#plan-help").text('Found ' + planCount + ' plan(s) available');
} else {
$("#plan-help").text('No plans found for this router and type. Please create plans first.');
}
},
error: function(xhr, status, error) {
console.error('Error loading plans:', error);
$("#plan-help").text('Error loading plans. Please check console for details.');
alert('Error loading plans. Please check console for details.');
}
});
} else {
$("#plan").html('<option value="">{Lang::T('Select Plans')}</option>');
$("#plan-help").text('Select a router and type first to load available plans');
}
});
// Add click handlers for debugging
$("#server").click(function(){
console.log('Server dropdown clicked');
console.log('Server dropdown disabled:', $(this).prop('disabled'));
console.log('Server dropdown options:', $(this).find('option').length);
});
$("#plan").click(function(){
console.log('Plan dropdown clicked');
console.log('Plan dropdown disabled:', $(this).prop('disabled'));
console.log('Plan dropdown options:', $(this).find('option').length);
});
// Test AJAX endpoints directly
$.ajax({
url: './index.php?_route=autoload/customer_select2',
dataType: 'json',
success: function(data) {
console.log('Customer AJAX test successful:', data);
},
error: function(xhr, status, error) {
console.error('Customer AJAX test failed:', error);
console.error('Response:', xhr.responseText);
}
});
$.ajax({
url: './index.php?_route=autoload/server',
type: 'POST',
dataType: 'html',
success: function(data) {
console.log('Server AJAX test successful:', data);
},
error: function(xhr, status, error) {
console.error('Server AJAX test failed:', error);
console.error('Response:', xhr.responseText);
}
});
});
</script>

135
ui/ui/refill.tpl Normal file
View File

@@ -0,0 +1,135 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">
<h3 class="card-title">{Lang::T('Refill Account')}</h3>
</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}plan/refill-post">
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Select Account')}</label>
<div class="col-md-6">
<select id="personSelect" class="form-control select2" name="id_customer"
style="width: 100%; cursor: pointer; z-index: 1000;" data-placeholder="{Lang::T('Select a customer')}..." data-ajax="true">
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">{Lang::T('Code Voucher')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="code" name="code"
placeholder="{Lang::T('Enter voucher code here')}">
</div>
</div>
<center>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-success mb-3" type="submit">{Lang::T('Recharge')}</button>
Or <a class="btn btn-outline-primary" href="{$_url}customers/list">{Lang::T('Cancel')}</a>
</div>
</div>
</center>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}
<script>
$(document).ready(function() {
console.log('Refill form loaded');
console.log('jQuery version:', $.fn.jquery);
console.log('Select2 available:', typeof $.fn.select2);
// Check if the element exists
if ($('#personSelect').length === 0) {
console.error('personSelect element not found!');
return;
}
console.log('personSelect element found:', $('#personSelect')[0]);
// Re-initialize select2 for customer selection with AJAX
// This ensures it works after the global select2 initialization
setTimeout(function() {
try {
// Destroy existing select2 if it exists
if ($('#personSelect').hasClass('select2-hidden-accessible')) {
$('#personSelect').select2('destroy');
console.log('Destroyed existing select2');
}
$('#personSelect').select2({
theme: "bootstrap",
width: '100%',
ajax: {
url: function(params) {
var url = './index.php?_route=autoload/customer_select2';
if(params.term != undefined){
url += '&s=' + encodeURIComponent(params.term);
}
console.log('AJAX URL:', url);
return url;
},
dataType: 'json',
delay: 250,
data: function (params) {
return {
s: params.term || '',
page: params.page || 1
};
},
processResults: function (data, params) {
console.log('AJAX response:', data);
return {
results: data.results || []
};
},
cache: true,
error: function(xhr, status, error) {
console.error('AJAX error:', error);
console.error('Response:', xhr.responseText);
}
},
minimumInputLength: 0,
placeholder: '{Lang::T('Select a customer')}...',
allowClear: true
});
console.log('Customer select2 initialized with AJAX');
} catch (error) {
console.error('Error initializing select2:', error);
}
}, 200);
// Add click handler for debugging
$('#personSelect').on('select2:open', function() {
console.log('Customer dropdown opened');
});
$('#personSelect').on('select2:select', function(e) {
console.log('Customer selected:', e.params.data);
});
$('#personSelect').on('select2:error', function(e) {
console.error('Select2 error:', e);
});
// Test AJAX endpoint directly
$.ajax({
url: './index.php?_route=autoload/customer_select2',
dataType: 'json',
success: function(data) {
console.log('Direct AJAX test successful:', data);
},
error: function(xhr, status, error) {
console.error('Direct AJAX test failed:', error);
console.error('Response:', xhr.responseText);
}
});
});
</script>

188
ui/ui/register-otp.tpl Normal file
View File

@@ -0,0 +1,188 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="48x48" href="favicon-48x48.png">
<link rel="icon" type="image/png" sizes="64x64" href="favicon-64x64.png">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<title>{Lang::T('Login')} - {$_c['CompanyName']}</title>
<link rel="stylesheet" href="assets/vendor/chartist/css/chartist.min.css">
<link href="assets/vendor/bootstrap-select/dist/css/bootstrap-select.min.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet">
<script src="ui/ui/scripts/sweetalert2.all.min.js"></script>
</head>
<body id="app" class="app off-canvas body-full" style="background-color:#e9ecef;">
<div class="container">
<div class="hidden-xs" style="height:150px"></div>
<div class="form-head mb20">
<h1 class="site-logo h2 mb5 mt5 text-center text-uppercase text-bold"
style="text-shadow: 2px 2px 4px #757575;">{$_c['CompanyName']}</h1>
<hr>
</div>
{if isset($notify)}
<script>
// Display SweetAlert toast notification
Swal.fire({
icon: '{if $notify_t == "s"}success{else}warning{/if}',
title: '{$notify}',
toast: true,
position: 'top-end',
showConfirmButton: false,
timer: 5000,
timerProgressBar: true,
didOpen: (toast) => {
toast.addEventListener('mouseenter', Swal.stopTimer)
toast.addEventListener('mouseleave', Swal.resumeTimer)
}
});
</script>
{/if}
<div class="col-md-12">
<div class="card card-info">
<div class="card-header">{Lang::T('Registration Info')}</div>
<div class="card-body">
{include file="$_path/../pages/Registration_Info.html"}
</div>
</div>
</div>
<form action="{$_url}register/post" method="post">
<div class="row">
<div class="col-md-6">
<div class="card card-primary">
<div class="card-header">1. {Lang::T('Register as Member')}</div>
<div class="card-body">
<div class="form-container">
<div class="form-group">
<label>{if $_c['country_code_phone']!= ''}{Lang::T('Phone Number')}{else}{Lang::T('Username')}{/if}</label>
<div class="input-group">
{if $_c['country_code_phone']!= ''}
<span class="input-group-text" id="basic-addon1"><i
class="fa fa-phone-alt"></i></span>
{else}
<span class="input-group-text" id="basic-addon1"><i
class="fa fa-user"></i></span>
{/if}
<input type="text" class="form-control" name="username" value="{$username}"
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']} {Lang::T('Phone Number')}{else}Y123456789{/if}">
</div>
</div>
<div class="form-group">
<label>{Lang::T('SMS Verification Code')}</label>
<input type="text" required class="form-control" id="otp_code" value=""
placeholder="{Lang::T('Verification Code')}" name="otp_code">
</div>
<div class="form-group">
<label>{Lang::T('Full Name')}</label>
<input type="text" required class="form-control" id="fullname" value="{$fullname}"
name="fullname">
</div>
<div class="form-group">
<label>{Lang::T('Email')}</label>
<input type="text" class="form-control" placeholder="xxxxxx@xxx.xx"
id="email" value="{$email}" name="email">
</div>
<div class="form-group">
<label>{Lang::T('Address')}</label>
<input type="text" name="address" id="address" value="{$address}"
class="form-control">
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card card-primary">
<div class="card-header">2. {Lang::T('Password')}</div>
<div class="card-body">
<div class="form-container">
<div class="form-group">
<label>{Lang::T('Password')}</label>
<input type="password" required class="form-control" id="password" name="password">
</div>
<div class="form-group">
<label>{Lang::T('Confirm Password')}</label>
<input type="password" required class="form-control" id="cpassword"
name="cpassword">
</div>
<div class="">
<div class="mb-3">
<button class="btn btn-success btn-block" type="submit">{Lang::T('Register')}</button>
</div>
<div class="">
<a href="{$_url}register" class="btn btn-primary btn-block">{Lang::T('Cancel')}</a>
</div>
</div>
<br>
<center>
<a href="javascript:showPrivacy()">Privacy</a>
&bull;
<a href="javascript:showTaC()">T &amp; C</a>
</center>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
<!-- Modal -->
<div class="modal fade" id="HTMLModal" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">&times;</span></button>
</div>
<div class="modal-body" id="HTMLModal_konten"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">&times;</button>
</div>
</div>
</div>
</div>
{if $_c['tawkto'] != ''}
<!--Start of Tawk.to Script-->
<script type="text/javascript">
var Tawk_API = Tawk_API || {},
Tawk_LoadStart = new Date();
(function() {
var s1 = document.createElement("script"),
s0 = document.getElementsByTagName("script")[0];
s1.async = true;
s1.src='https://embed.tawk.to/{$_c['tawkto']}';
s1.charset = 'UTF-8';
s1.setAttribute('crossorigin', '*');
s0.parentNode.insertBefore(s1, s0);
})();
</script>
<!--End of Tawk.to Script-->
{/if}
<script src="ui/ui/scripts/vendors.js?v=1"></script>
<script src="assets/vendor/global/global.min.js"></script>
<script src="assets/vendor/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="assets/vendor/chart.js/Chart.bundle.min.js"></script>
<!-- Chart piety plugin files -->
<script src="assets/vendor/peity/jquery.peity.min.js"></script>
<!-- Apex Chart -->
<script src="assets/vendor/apexchart/apexchart.js"></script>
<!-- Dashboard 1 -->
<script src="assets/js/dashboard/dashboard-1.js"></script>
<script src="assets/js/custom.min.js"></script>
<script src="assets/js/deznav-init.js"></script>
<script src="assets/js/demo.js"></script>
</body>
</html>

150
ui/ui/register-rotp.tpl Normal file
View File

@@ -0,0 +1,150 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="48x48" href="favicon-48x48.png">
<link rel="icon" type="image/png" sizes="64x64" href="favicon-64x64.png">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<title>{Lang::T('Login')} - {$_c['CompanyName']}</title>
<link rel="stylesheet" href="assets/vendor/chartist/css/chartist.min.css">
<link href="assets/vendor/bootstrap-select/dist/css/bootstrap-select.min.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet">
<script src="ui/ui/scripts/sweetalert2.all.min.js"></script>
</head>
<body id="app" class="app off-canvas body-full" style="background-color:#e9ecef;">
<div class="container">
<div class="hidden-xs" style="height:150px"></div>
<div class="form-head mb20">
<h1 class="site-logo h2 mb5 mt5 text-center text-uppercase text-bold"
style="text-shadow: 2px 2px 4px #757575;">{$_c['CompanyName']}</h1>
<hr>
</div>
{if isset($notify)}
<script>
// Display SweetAlert toast notification
Swal.fire({
icon: '{if $notify_t == "s"}success{else}warning{/if}',
title: '{$notify}',
toast: true,
position: 'top-end',
showConfirmButton: false,
timer: 5000,
timerProgressBar: true,
didOpen: (toast) => {
toast.addEventListener('mouseenter', Swal.stopTimer)
toast.addEventListener('mouseleave', Swal.resumeTimer)
}
});
</script>
{/if}
<div class="col-md-2">
</div>
<div class="row">
<div class="col-md-6">
<div class="card card-primary">
<div class="card-header">{Lang::T('Registration Info')}</div>
<div class="card-body">
{include file="$_path/../pages/Registration_Info.html"}
</div>
</div>
</div>
<div class="col-md-6">
<form action="{$_url}register" method="post">
<div class="card card-primary">
<div class="card-header">1. {Lang::T('Register as Member')}</div>
<div class="card-body">
<div class="form-group">
<label>{if $_c['country_code_phone']!= ''}{Lang::T('Phone Number')}{else}{Lang::T('Username')}{/if}</label>
<div class="input-group">
{if $_c['country_code_phone']!= ''}
<span class="input-group-text" id="basic-addon1"><i
class="fa fa-phone-alt"></i></span>
{else}
<span class="input-group-text" id="basic-addon1"><i
class="fa fa-user"></i></span>
{/if}
<input type="text" class="form-control" name="username"
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']} {Lang::T('Phone Number')}{else}Y123456789{/if}">
</div>
</div>
<div class="">
<div class="mb-3">
<a href="{$_url}login" class="btn btn-warning btn-block">{Lang::T('Cancel')}</a>
</div>
<div class="">
<button class="btn btn-success btn-block" type="submit">{Lang::T('Request OTP')}</button>
</div>
</div>
<br>
<center>
<a href="javascript:showPrivacy()">Privacy</a>
&bull;
<a href="javascript:showTaC()">T &amp; C</a>
</center>
</div>
</div>
</form>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="HTMLModal" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">&times;</span></button>
</div>
<div class="modal-body" id="HTMLModal_konten"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">&times;</button>
</div>
</div>
</div>
</div>
{if $_c['tawkto'] != ''}
<!--Start of Tawk.to Script-->
<script type="text/javascript">
var Tawk_API = Tawk_API || {},
Tawk_LoadStart = new Date();
(function() {
var s1 = document.createElement("script"),
s0 = document.getElementsByTagName("script")[0];
s1.async = true;
s1.src='https://embed.tawk.to/{$_c['tawkto']}';
s1.charset = 'UTF-8';
s1.setAttribute('crossorigin', '*');
s0.parentNode.insertBefore(s1, s0);
})();
</script>
<!--End of Tawk.to Script-->
{/if}
<script src="ui/ui/scripts/vendors.js?v=1"></script>
<script src="assets/vendor/global/global.min.js"></script>
<script src="assets/vendor/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="assets/vendor/chart.js/Chart.bundle.min.js"></script>
<!-- Chart piety plugin files -->
<script src="assets/vendor/peity/jquery.peity.min.js"></script>
<!-- Apex Chart -->
<script src="assets/vendor/apexchart/apexchart.js"></script>
<!-- Dashboard 1 -->
<script src="assets/js/dashboard/dashboard-1.js"></script>
<script src="assets/js/custom.min.js"></script>
<script src="assets/js/deznav-init.js"></script>
<script src="assets/js/demo.js"></script>
</body>
</html>

183
ui/ui/register.tpl Normal file
View File

@@ -0,0 +1,183 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="48x48" href="favicon-48x48.png">
<link rel="icon" type="image/png" sizes="64x64" href="favicon-64x64.png">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<title>{Lang::T('Login')} - {$_c['CompanyName']}</title>
<link rel="stylesheet" href="assets/vendor/chartist/css/chartist.min.css">
<link href="assets/vendor/bootstrap-select/dist/css/bootstrap-select.min.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet">
<script src="ui/ui/scripts/sweetalert2.all.min.js"></script>
</head>
<body id="app" class="app off-canvas body-full" style="background-color:#e9ecef;">
<div class="container">
<div class="hidden-xs" style="height:150px"></div>
<div class="form-head mb20">
<h1 class="site-logo h2 mb5 mt5 text-center text-uppercase text-bold"
style="text-shadow: 2px 2px 4px #757575;">{$_c['CompanyName']}</h1>
<hr>
</div>
{if isset($notify)}
<script>
// Display SweetAlert toast notification
Swal.fire({
icon: '{if $notify_t == "s"}success{else}warning{/if}',
title: '{$notify}',
toast: true,
position: 'top-end',
showConfirmButton: false,
timer: 5000,
timerProgressBar: true,
didOpen: (toast) => {
toast.addEventListener('mouseenter', Swal.stopTimer)
toast.addEventListener('mouseleave', Swal.resumeTimer)
}
});
</script>
{/if}
<div class="col-md-12">
<div class="card card-primary">
<div class="card-header">{Lang::T('Registration Info')}</div>
<div class="card-body">
{include file="$_path/../pages/Registration_Info.html"}
</div>
</div>
</div>
<form class="form-horizontal" action="{$_url}register/post" method="post">
<div class="row">
<div class="col-md-6">
<div class="card card-primary">
<div class="card-header">1. {Lang::T('Register as Member')}</div>
<div class="card-body">
<div class="form-container">
<div class="md-input-container">
<label>{if $_c['country_code_phone']!= ''}{Lang::T('Phone Number')}{else}{Lang::T('Username')}{/if}</label>
<div class="input-group">
{if $_c['country_code_phone']!= ''}
<span class="input-group-text" id="basic-addon1"><i
class="fa fa-phone-alt"></i></span>
{else}
<span class="input-group-text" id="basic-addon1"><i
class="fa fa-user"></i></span>
{/if}
<input type="text" class="form-control" name="username"
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']} {Lang::T('Phone Number')}{else}Y123456789{/if}">
</div>
</div>
<div class="md-input-container md-float-label">
<label>{Lang::T('Full Name')}</label>
<input type="text" required class="form-control" id="fullname" value="{$fullname}"
name="fullname">
</div>
<div class="md-input-container md-float-label">
<label>{Lang::T('Email')}</label>
<input type="text" class="form-control" id="email" placeholder="xxxxxxx@xxxx.xx"
value="{$email}" name="email">
</div>
<div class="md-input-container md-float-label">
<label>{Lang::T('Address')}</label>
<input type="text" name="address" id="address" value="{$address}"
class="form-control">
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card card-primary">
<div class="card-header">2. {Lang::T('Password')}</div>
<div class="card-body">
<div class="form-container">
<div class="md-input-container md-float-label">
<label>{Lang::T('Password')}</label>
<input type="password" required class="form-control" id="password" name="password">
</div>
<div class="md-input-container md-float-label">
<label>{Lang::T('Confirm Password')}</label>
<input type="password" required class="form-control" id="cpassword"
name="cpassword">
</div>
<br>
<div class="">
<div class="mb-3">
<a href="{$_url}login" class="btn btn-warning btn-block">{Lang::T('Cancel')}</a>
</div>
<div class="">
<button class="btn btn-success btn-block" type="submit">{Lang::T('Register')}</button>
</div>
</div>
<br>
<center>
<a href="javascript:showPrivacy()">Privacy</a>
&bull;
<a href="javascript:showTaC()">T &amp; C</a>
</center>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
<!-- Modal -->
<div class="modal fade" id="HTMLModal" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">&times;</span></button>
</div>
<div class="modal-body" id="HTMLModal_konten"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">&times;</button>
</div>
</div>
</div>
</div>
{if $_c['tawkto'] != ''}
<!--Start of Tawk.to Script-->
<script type="text/javascript">
var Tawk_API = Tawk_API || {},
Tawk_LoadStart = new Date();
(function() {
var s1 = document.createElement("script"),
s0 = document.getElementsByTagName("script")[0];
s1.async = true;
s1.src='https://embed.tawk.to/{$_c['tawkto']}';
s1.charset = 'UTF-8';
s1.setAttribute('crossorigin', '*');
s0.parentNode.insertBefore(s1, s0);
})();
</script>
<!--End of Tawk.to Script-->
{/if}
<script src="ui/ui/scripts/vendors.js?v=1"></script>
<script src="assets/vendor/global/global.min.js"></script>
<script src="assets/vendor/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="assets/vendor/chart.js/Chart.bundle.min.js"></script>
<!-- Chart piety plugin files -->
<script src="assets/vendor/peity/jquery.peity.min.js"></script>
<!-- Apex Chart -->
<script src="assets/vendor/apexchart/apexchart.js"></script>
<!-- Dashboard 1 -->
<script src="assets/js/dashboard/dashboard-1.js"></script>
<script src="assets/js/custom.min.js"></script>
<script src="assets/js/deznav-init.js"></script>
<script src="assets/js/demo.js"></script>
</body>
</html>

View File

@@ -0,0 +1,69 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card card-hovered mb20 card-primary">
<div class="card-header">
<h3 class="card-title">Activity Log</h3>
</div>
<div class="card-body">
<div class="text-center">
<div class="col-md-12">
<form id="site-search" method="post" action="{$_url}reports/activation">
<div class="input-group">
<div class="input-group-text">
<span class="fa fa-search"></span>
</div>
<input type="text" name="q" class="form-control" value="{$q}"
placeholder="{Lang::T('Invoice')}...">
<button class="btn btn-success input-group-btn" type="submit">{Lang::T('Search')}</button>
<!-- <div class="input-group-btn">
</div> -->
</div>
</form>
</div>
<div class="col-md-8">
</div>&nbsp;
</div>
<br>
<div class="table-responsive">
<table id="datatable" class="table table-bordered table-striped table-hover border-primary">
<thead>
<tr>
<th>{Lang::T('Invoice')}</th>
<th>{Lang::T('Username')}</th>
<th>{Lang::T('Plan Name')}</th>
<th>{Lang::T('Plan Price')}</th>
<th>{Lang::T('Type')}</th>
<th>{Lang::T('Created On')}</th>
<th>{Lang::T('Expires On')}</th>
<th>{Lang::T('Method')}</th>
</tr>
</thead>
<tbody>
{foreach $activation as $ds}
<tr>
<td onclick="window.location.href = '{$_url}plan/view/{$ds['id']}'"
style="cursor:pointer;">{$ds['invoice']}</td>
<td onclick="window.location.href = '{$_url}customers/viewu/{$ds['username']}'"
style="cursor:pointer;">{$ds['username']}</td>
<td>{$ds['plan_name']}</td>
<td>{Lang::moneyFormat($ds['price'])}</td>
<td>{$ds['type']}</td>
<td class="text-success">
{Lang::dateAndTimeFormat($ds['recharged_on'],$ds['recharged_time'])}
</td>
<td class="text-danger">{Lang::dateAndTimeFormat($ds['expiration'],$ds['time'])}</td>
<td>{$ds['method']}</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

68
ui/ui/reports-daily.tpl Normal file
View File

@@ -0,0 +1,68 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="card">
<div class="col-md-12">
<div class="invoice-wrap">
<div class="card-header clearfix invoice-head">
<h3 class="brand-logo text-uppercase text-bold left mt15">
<span class="text">{Lang::T('Daily Reports')}</span>
</h3>
</div>
<div class="card-body">
<div class="clearfix invoice-subhead mb20">
<div class="group clearfix left">
<p class="text-bold mb5">{Lang::T('All Transactions at Date')}:</p>
<p class="small">{date($_c['date_format'], strtotime($mdate))} {$mtime}</p>
</div>
<div class="group clearfix right">
<a href="{$_url}export/print-by-date" class="btn btn-default" target="_blank"><i
class="ion ion-printer"></i>{Lang::T('Export for Print')}</a>
<a href="{$_url}export/pdf-by-date" class="btn btn-default"><i
class="fa fa-file-pdf-o"></i>{Lang::T('Export to PDF')}</a>
</div>
</div>
<div class="table-responsive">
<table class="table table-bordered table-condensed">
<thead>
<tr>
<th>{Lang::T('Username')}</th>
<th>{Lang::T('Type')}</th>
<th>{Lang::T('Plan Name')}</th>
<th>{Lang::T('Plan Price')}</th>
<th>{Lang::T('Created On')}</th>
<th>{Lang::T('Expires On')}</th>
<th>{Lang::T('Method')}</th>
<th>{Lang::T('Routers')}</th>
</tr>
</thead>
<tbody>
{foreach $d as $ds}
<tr>
<td>{$ds['username']}</td>
<td>{$ds['type']}</td>
<td>{$ds['plan_name']}</td>
<td class="text-right">{Lang::moneyFormat($ds['price'])}</td>
<td>{Lang::dateAndTimeFormat($ds['recharged_on'],$ds['recharged_time'])}</td>
<td>{Lang::dateAndTimeFormat($ds['expiration'],$ds['time'])}</td>
<td>{$ds['method']}</td>
<td>{$ds['routers']}</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
<div class="clearfix text-right total-sum mb10">
<h4 class="text-uppercase text-bold">{Lang::T('Total Income')}:</h4>
<h3 class="sum">{Lang::moneyFormat($dr)}</h3>
</div>
<p class="text-center small text-info">{Lang::T('All Transactions at Date')}:
{date($_c['date_format'], strtotime($mdate))} {$mtime}</p>
</div>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

View File

@@ -0,0 +1,78 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="invoice-wrap">
<div class="card-header clearfix invoice-head">
<h3 class="brand-logo text-uppercase text-bold left mt15">
<span class="text">{Lang::T('Daily Reports')}</span>
</h3>
</div>
<div class="card-body">
<div class="clearfix invoice-subhead mb20">
<div class="group clearfix left">
<p class="text-bold mb5">{Lang::T('All Transactions at Date')}:</p>
<p class="small">{$stype} [{date( $_c['date_format'], strtotime($fdate))} -
{date( $_c['date_format'], strtotime($tdate))}]</p>
</div>
<div class="group clearfix right">
<form method="post" action="{$_url}export/print-by-period" target="_blank">
<input type="hidden" name="fdate" value="{$fdate}">
<input type="hidden" name="tdate" value="{$tdate}">
<input type="hidden" name="stype" value="{$stype}">
<button type="submit" class="btn btn-primary mb-3"><i class="fa fa-print"></i>
{Lang::T('Export for Print')}</button>
</form>
<form method="post" action="{$_url}export/pdf-by-period" target="_blank">
<input type="hidden" name="fdate" value="{$fdate}">
<input type="hidden" name="tdate" value="{$tdate}">
<input type="hidden" name="stype" value="{$stype}">
<button type="submit" class="btn btn-info"><i class="fa fa-file-pdf"></i>
{Lang::T('Export to PDF')}</button>
</form>
</div>
</div>
<div class="table-responsive">
<table class="table table-bordered table-striped table-condensed">
<thead>
<tr>
<th>{Lang::T('Username')}</th>
<th>{Lang::T('Type')}</th>
<th>{Lang::T('Plan Name')}</th>
<th>{Lang::T('Plan Price')}</th>
<th>{Lang::T('Created On')}</th>
<th>{Lang::T('Expires On')}</th>
<th>{Lang::T('Method')}</th>
<th>{Lang::T('Routers')}</th>
</tr>
</thead>
<tbody>
{foreach $d as $ds}
<tr>
<td>{$ds['username']}</td>
<td>{$ds['type']}</td>
<td>{$ds['plan_name']}</td>
<td class="text-right">{Lang::moneyFormat($ds['price'])}</td>
<td>{Lang::dateAndTimeFormat($ds['recharged_on'],$ds['recharged_time'])}</td>
<td>{Lang::dateAndTimeFormat($ds['expiration'],$ds['time'])}</td>
<td>{$ds['method']}</td>
<td>{$ds['routers']}</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
<div class="clearfix text-right total-sum mb10">
<h4 class="text-uppercase text-bold">{Lang::T('Total Income')}:</h4>
<h3 class="sum">{Lang::moneyFormat($dr)}</h3>
</div>
<p class="text-center small text-info">{$stype} [{date( $_c['date_format'], strtotime($fdate))} -
{date( $_c['date_format'], strtotime($tdate))}]</p>
</div>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

44
ui/ui/reports-period.tpl Normal file
View File

@@ -0,0 +1,44 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">
<h3 class="card-title">{Lang::T('Period Reports')}</h3></div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}reports/period-view">
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('From Date')}</label>
<div class="col-md-9">
<input type="date" class="form-control" value="{$tdate}" name="fdate" id="fdate">
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('To Date')}</label>
<div class="col-md-9">
<input type="date" class="form-control" value="{$mdate}" name="tdate" id="tdate">
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Type')}</label>
<div class="col-md-9">
<select class="form-select" style="height: 52px; background-color: white;" id="stype" name="stype">
<option value="" selected="">{Lang::T('All Transactions')}</option>
<option value="Hotspot">Hotspot</option>
<option value="PPPOE">PPPOE</option>
<option value="Balance">Balance</option>
</select>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-3 col-sm-9">
<button type="submit" id="submit" class="btn btn-primary">{Lang::T('Period Reports')}</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

71
ui/ui/router-error.tpl Normal file
View File

@@ -0,0 +1,71 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="48x48" href="favicon-48x48.png">
<link rel="icon" type="image/png" sizes="64x64" href="favicon-64x64.png">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<title>{Lang::T('Login')} - {$_c['CompanyName']}</title>
<link rel="stylesheet" href="assets/vendor/chartist/css/chartist.min.css">
<link href="assets/vendor/bootstrap-select/dist/css/bootstrap-select.min.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet">
<meta http-equiv="refresh" content="{$time}; url={$url}">
<style>
::-moz-selection {
/* Code for Firefox */
color: red;
background: yellow;
}
::selection {
color: red;
background: yellow;
}
</style>
</head>
<body class="hold-transition skin-blue" style="background-color:#e9ecef;">
<div class="container-fluid">
<center>
<div class="col-md-8" style="margin-top: 80px;">
<div class="card card-danger card-solid">
<div class="card-header">
<h3 class="card-title">
{$error_title}
</h3>
</div>
<div class="card-body" style="font-size: larger; text-align: start;">
<h5 class="text-danger">{$error_message}</h5>
<hr>
<h5 class="text-info">Mikrotik troubleshooting: </h5>
<ol>
<li>1. Make sure you use API Port, Default 8728</li>
<li>2. Make sure Username and Password are correct</li>
<li>3. Make sure your hosting is not blocking port to external</li>
<li>4. Make sure your is Mikrotik accessible from MikroPulse</li>
</ol>
<span class="text-info">Note: </span>If you just update MikroPulse from upload files, try
contact admin
</div>
<!-- <div class="card-footer">
<div class="" role="group" aria-label="...">
<a href="./update.php?step=4"
class="btn btn-info btn-sm btn-block mb-3">Update Database</a>
<a href="#" " class="btn btn-success btn-sm btn-block mb-4">Update
Mikropulse</a>
</div>
<a href="javascript::history.back()" onclick="history.back()"
class="btn btn-warning btn-block">back</a>
</div>-->
</div>
</div>
</center>
</div>
</body>
</html>

70
ui/ui/routers-add.tpl Normal file
View File

@@ -0,0 +1,70 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">
<h5 class="card-title">{Lang::T('Add Router')}</h5></div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}routers/add-post">
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Status')}</label>
<div class="col-md-8">
<label class="radio-inline warning">
<input type="radio" checked name="enabled" value="1"> Enable
</label>
<label class="radio-inline">
<input type="radio" name="enabled" value="0"> Disable
</label>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Router Name / Location')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="name" name="name" maxlength="32">
<p class="help-block">{Lang::T('Name of Area that router operated')}</p>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('IP Address')}</label>
<div class="col-md-6">
<input type="text" placeholder="192.168.88.1:8728" class="form-control" id="ip_address"
name="ip_address">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Username')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="username" name="username">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Router Secret')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="password" name="password"
onmouseleave="this.type = 'password'" onmouseenter="this.type = 'text'">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Description')}</label>
<div class="col-md-6">
<textarea class="form-control" id="description" name="description"></textarea>
<p class="help-block">{Lang::T('Explain Coverage of router')}</p>
</div>
</div>
<center>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-primary mb-3"
type="submit">{Lang::T('Save Changes')}</button>
Or <a class="btn btn-outline-primary" href="{$_url}routers/list">{Lang::T('Cancel')}</a>
</div>
</div>
</center>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

70
ui/ui/routers-edit.tpl Normal file
View File

@@ -0,0 +1,70 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">
<h3 class="card-title">{Lang::T('Edit Router')}</h3>
</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}routers/edit-post" >
<input type="hidden" name="id" value="{$d['id']}">
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Status')}</label>
<div class="col-md-8">
<label class="radio-inline warning">
<input type="radio" {if $d['enabled'] == 1}checked{/if} name="enabled" value="1"> Enable
</label>
<label class="radio-inline">
<input type="radio" {if $d['enabled'] == 0}checked{/if} name="enabled" value="0"> Disable
</label>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Router Name / Location')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="name" name="name" maxlength="32" value="{$d['name']}">
<p class="help-block">{Lang::T('Name of Area that router operated')}</p>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('IP Address')}</label>
<div class="col-md-6">
<input type="text" placeholder="192.168.88.1:8728" class="form-control" id="ip_address" name="ip_address" value="{$d['ip_address']}">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Username')}</label>
<div class="col-md-6">
<input type="text" class="form-control" id="username" name="username" value="{$d['username']}">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Router Secret')}</label>
<div class="col-md-6">
<input type="password" class="form-control" id="password" name="password" value="{$d['password']}" onmouseleave="this.type = 'password'"
onmouseenter="this.type = 'text'">
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Description')}</label>
<div class="col-md-6">
<textarea class="form-control" id="description" name="description">{$d['description']}</textarea>
<p class="help-block">{Lang::T('Explain Coverage of router')}</p>
</div>
</div>
<center>
<div class="form-group row">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-primary mb-3" type="submit">{Lang::T('Save Changes')}</button>
Or <a class="btn btn-outline-primary" href="{$_url}routers/list">{Lang::T('Cancel')}</a>
</div>
</div>
</center>
</form>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

320
ui/ui/routers.tpl Normal file
View File

@@ -0,0 +1,320 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card card-hovered mb20 card-primary">
<div class="card-header">
<h3 class="card-title">{Lang::T('Routers')}</h3>
</div>
<div class="card-body">
<div class="md-whiteframe-z1 mb20 text-center">
<div class="row">
<div class="col-md-8">
<form id="site-search" method="post" action="{$_url}routers/list/">
<div class="input-group">
<div class="input-group-text">
<span class="fa fa-search"></span>
</div>
<input type="text" name="name" class="form-control"
placeholder="{Lang::T('Search by Name')}...">
<button class="btn btn-success input-group-btn" type="submit">{Lang::T('Search')}</button>
<!-- <div class="input-group-btn">
</div> -->
</div>
</form>
</div>
<div class="col-md-4">
<a href="{$_url}routers/add" class="btn btn-primary btn-block"><i
class="fa fa-add"> </i> {Lang::T('New Router')}</a>
</div>&nbsp;
</div>
</div>
<div class="table-responsive">
<table class="table table-bordered table-striped table-condensed">
<thead>
<tr>
<th>{Lang::T('Router Name')}</th>
<th>{Lang::T('IP Address')}</th>
<th>{Lang::T('Status')}</th>
<th>{Lang::T('Uptime')}</th>
<th>{Lang::T('Free Memory')}</th>
<th>{Lang::T('CPU Load')}</th>
<th>{Lang::T('Manage')}</th>
<th>ID</th>
<th>{Lang::T('Download')}</th>
</tr>
</thead>
<tbody>
{foreach $d as $ds}
<tr {if $ds['enabled'] != 1}class="danger" title="disabled" {/if}>
<td>{$ds['name']}</td>
<td>{$ds['ip_address']}</td>
<td class="router-status" data-router-id="{$ds['id']}"><span class="loading-spinner"></span><span class="loader">Loading...</span></td>
<td class="router-uptime text-success" data-router-id="{$ds['id']}"><span class="loading-spinner"></span><span class="loader">Loading...</span></td>
<td class="router-used-memory text-warning" data-router-id="{$ds['id']}"><span class="loading-spinner"></span><span class="loader">Loading...</span></td>
<td class="router-cpu-load text-primary" data-router-id="{$ds['id']}"><span class="loading-spinner"></span><span class="loader">Loading...</span></td>
<td>
<a href="{$_url}routers/edit/{$ds['id']}" class="btn btn-info btn-xs">{Lang::T('Edit')}</a>
<a href="{$_url}routers/delete/{$ds['id']}" id="{$ds['id']}"
onclick="return confirm('{Lang::T('Delete')}?')"
class="btn btn-danger btn-xs"><i class="fa fa-trash"></i></a>
<button class="btn btn-warning btn-xs btn-reboot" data-router-id="{$ds['id']}"><i class="fa fa-refresh"></i> {Lang::T('Reboot')}</button>
</td>
<td>{$ds['id']}</td>
<td>
<form action="{$_url}routers/download" method="post" style="display:inline;">
<input type="hidden" name="router_id" value="{$ds['id']}">
<input type="hidden" name="router_name" value="{$ds['name']}">
<button type="submit" class="btn btn-success btn-xs">
<i class="fa fa-download"></i> {Lang::T('Download')}
</button>
</form>
</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}
<style>
.loader {
display: inline-block;
animation: loading 1.5s infinite;
margin: 0;
color: #6c757d;
font-style: italic;
font-size: 0.9em;
}
@keyframes loading {
0% {
opacity: 1;
}
50% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}
.loading-spinner {
display: inline-block;
width: 16px;
height: 16px;
border: 2px solid #f3f3f3;
border-top: 2px solid #007bff;
border-radius: 50%;
animation: spin 1s linear infinite;
margin-right: 8px;
vertical-align: middle;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.status.timeout {
background-color: #ffc107;
color: #000;
}
.status.error {
background-color: #dc3545;
color: white;
}
.text-warning {
color: #ffc107 !important;
font-weight: bold;
}
.loading-container {
display: flex;
align-items: center;
justify-content: center;
}
.router-uptime {
color: #28a745; /* Green for uptime */
font-weight: bold;
}
.router-used-memory {
color: #fd7e14; /* Orange for memory */
font-weight: bold;
}
.router-cpu-load {
color: #d63384; /* Pink for CPU load */
font-weight: bold;
}
.router-status {
font-weight: bold;
}
.router-status .status {
display: inline-block;
padding: 2px 8px;
border-radius: 4px;
font-size: 12px;
}
.router-status .online {
background-color: #28a745;
color: white;
}
.router-status .offline {
background-color: #dc3545;
color: white;
}
</style>
<script>
$(document).ready(function() {
// Get all router IDs
var routerIds = [];
$('.router-uptime, .router-used-memory, .router-total-memory, .router-cpu-load, .router-status').each(function() {
var routerId = $(this).data('router-id');
if (routerId && routerIds.indexOf(routerId) === -1) {
routerIds.push(routerId);
}
});
// Option 1: Load all router data in parallel with individual timeouts (current implementation)
var loadPromises = routerIds.map(function(routerId) {
return new Promise(function(resolve, reject) {
$.ajax({
url: '{$_url}routers/get_resources',
data: { router_id: routerId },
dataType: 'json',
timeout: 8000, // 8 second timeout per router
success: function(resources) {
var result = {};
result.routerId = routerId;
result.resources = resources;
resolve(result);
},
error: function(xhr, status, error) {
var errorType = status === 'timeout' ? 'timeout' : 'error';
var result = {};
result.routerId = routerId;
result.error = errorType;
result.resources = null;
resolve(result);
}
});
});
});
// Process all results when they complete
Promise.all(loadPromises).then(function(results) {
results.forEach(function(result) {
var routerId = result.routerId;
var resources = result.resources;
var error = result.error;
// Find all elements for this router
var row = $('[data-router-id="' + routerId + '"]').first().closest('tr');
if (error) {
// Handle error state
row.find('.router-uptime').html('<span class="text-warning">' + (error === 'timeout' ? 'Timeout' : 'Error') + '</span>');
row.find('.router-used-memory').html('<span class="text-warning">' + (error === 'timeout' ? 'Timeout' : 'Error') + '</span>');
row.find('.router-cpu-load').html('<span class="text-warning">' + (error === 'timeout' ? 'Timeout' : 'Error') + '</span>');
row.find('.router-status').html('<span class="status offline">' + (error === 'timeout' ? 'Timeout' : 'Error') + '</span>');
} else if (resources) {
// Update all fields for this router
row.find('.router-uptime').html(resources.uptime || 'N/A');
row.find('.router-used-memory').html(resources.freeMemory || 'N/A');
row.find('.router-cpu-load').html(resources.cpuLoad || 'N/A');
// Update router status
var statusElement = row.find('.router-status');
if (resources.status === 'Online') {
statusElement.html('<span class="status online">Online</span>');
} else {
statusElement.html('<span class="status offline">Offline</span>');
}
} else {
// No data available
row.find('.router-uptime').html('N/A');
row.find('.router-used-memory').html('N/A');
row.find('.router-cpu-load').html('N/A');
row.find('.router-status').html('<span class="status offline">Offline</span>');
}
});
});
// Option 2: Alternative bulk loading approach (commented out - uncomment to use)
/*
$.ajax({
url: '{$_url}routers/get_all_resources',
dataType: 'json',
timeout: 15000, // 15 second timeout for bulk request
success: function(allResources) {
Object.keys(allResources).forEach(function(routerId) {
var resources = allResources[routerId];
var row = $('[data-router-id="' + routerId + '"]').first().closest('tr');
if (resources) {
row.find('.router-uptime').html(resources.uptime || 'N/A');
row.find('.router-used-memory').html(resources.freeMemory || 'N/A');
row.find('.router-cpu-load').html(resources.cpuLoad || 'N/A');
var statusElement = row.find('.router-status');
if (resources.status === 'Online') {
statusElement.html('<span class="status online">Online</span>');
} else {
statusElement.html('<span class="status offline">Offline</span>');
}
} else {
row.find('.router-uptime').html('N/A');
row.find('.router-used-memory').html('N/A');
row.find('.router-cpu-load').html('N/A');
row.find('.router-status').html('<span class="status offline">Offline</span>');
}
});
},
error: function(xhr, status, error) {
console.error('Bulk loading failed:', error);
// Fallback to individual loading
$('.router-uptime, .router-used-memory, .router-cpu-load, .router-status').html('<span class="text-danger">Error</span>');
}
});
*/
// Reboot router
$('.btn-reboot').on('click', function() {
var routerId = $(this).data('router-id');
if (confirm('Are you sure you want to reboot this router?')) {
$.ajax({
url: '{$_url}routers/reboot',
data: { router_id: routerId },
dataType: 'json',
success: function(response) {
if (response.status === 'Rebooting') {
alert(response.message);
} else {
alert('Error: ' + response.message);
}
},
error: function(xhr, status, error) {
console.error(xhr.responseText);
alert('Failed to send reboot command. Please try again.');
}
});
}
});
});
</script>

View File

@@ -0,0 +1,44 @@
{include file="sections/user-header.tpl"}
<!-- user-activation-list -->
<div class="row">
<div class="col-sm-12">
<div class="card mb20 card-hovered card-primary">
<div class="card-header">{Lang::T('List Activated Voucher')}</div>
<div class="card-body">
<div class="table-responsive">
<table id="datatable" class="table table-bordered table-striped table-condensed">
<thead>
<tr>
<th>{Lang::T('Invoice')}</th>
<th>{Lang::T('Plan Name')}</th>
<th>{Lang::T('Plan Price')}</th>
<th>{Lang::T('Type')}</th>
<th>{Lang::T('Created On')}</th>
<th>{Lang::T('Expires On')}</th>
<th>{Lang::T('Method')}</th>
</tr>
</thead>
<tbody>
{foreach $d as $ds}
<tr onclick="window.location.href = '{$_url}voucher/invoice/{$ds['id']}'" style="cursor: pointer;">
<td>{$ds['invoice']}</td>
<td>{$ds['plan_name']}</td>
<td>{Lang::moneyFormat($ds['price'])}</td>
<td>{$ds['type']}</td>
<td>{Lang::dateAndTimeFormat($ds['recharged_on'],$ds['recharged_time'])}</td>
<td>{Lang::dateAndTimeFormat($ds['expiration'],$ds['time'])}</td>
<td>{$ds['method']}</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
{include file="sections/user-footer.tpl"}

42
ui/ui/user-activation.tpl Normal file
View File

@@ -0,0 +1,42 @@
{include file="sections/user-header.tpl"}
<div class="row">
<div class="col-xl-12 col-xxl-12">
<div class="col-xl-12">
<div class="card coin-card">
<div class="card-body d-sm-flex d-block align-items-center">
<span class="coin-icon">
<svg width="38" height="41" viewBox="0 0 38 41" fill="none" xmlns="http://www.w3.org/2000/svg">
<g><path d="M14.0413 32.5832C15.7416 32.5934 17.4269 32.2659 18.9997 31.6199C20.5708 32.2714 22.2572 32.5991 23.958 32.5832C29.1218 32.5832 33.1663 29.8278 33.1663 26.3088V20.441C33.1663 16.922 29.1218 14.1666 23.958 14.1666C23.7186 14.1666 23.4834 14.1779 23.2497 14.1906V7.55498C23.2497 4.10823 19.2051 1.41656 14.0413 1.41656C8.87759 1.41656 4.83301 4.10823 4.83301 7.55498V26.4448C4.83301 29.8916 8.87759 32.5832 14.0413 32.5832ZM30.333 26.3088C30.333 27.9366 27.715 29.7499 23.958 29.7499C20.201 29.7499 17.583 27.9366 17.583 26.3088V24.9984C19.5015 26.1652 21.7131 26.7604 23.958 26.714C26.203 26.7604 28.4145 26.1652 30.333 24.9984V26.3088ZM23.958 16.9999C27.715 16.9999 30.333 18.8132 30.333 20.441C30.333 22.0687 27.715 23.8807 23.958 23.8807C20.201 23.8807 17.583 22.0673 17.583 20.441C17.583 18.8147 20.201 16.9999 23.958 16.9999ZM14.0413 4.2499C17.7983 4.2499 20.4163 5.9924 20.4163 7.55498C20.4163 9.11757 17.7983 10.8615 14.0413 10.8615C10.2843 10.8615 7.66634 9.11898 7.66634 7.55498C7.66634 5.99098 10.2843 4.2499 14.0413 4.2499ZM7.66634 12.0161C9.59282 13.1601 11.8012 13.7417 14.0413 13.6948C16.2814 13.7417 18.4899 13.1601 20.4163 12.0161V14.6341C18.8724 15.0232 17.4565 15.8078 16.308 16.9107C15.5631 17.0718 14.8034 17.1545 14.0413 17.1572C10.2843 17.1572 7.66634 15.4146 7.66634 13.8521V12.0161ZM7.66634 18.3132C9.59323 19.4561 11.8015 20.0371 14.0413 19.9905C14.2935 19.9905 14.5372 19.9593 14.7851 19.9466C14.764 20.1106 14.7522 20.2756 14.7497 20.441V23.3947C14.5117 23.4089 14.2822 23.4542 14.0413 23.4542C10.2843 23.4542 7.66634 21.7117 7.66634 20.1477V18.3132ZM7.66634 24.6088C9.59282 25.7529 11.8012 26.3344 14.0413 26.2876C14.2793 26.2876 14.5131 26.2692 14.7497 26.2578V26.3088C14.7699 27.5148 15.2334 28.6711 16.0516 29.5572C15.3887 29.6824 14.7159 29.7469 14.0413 29.7499C10.2843 29.7499 7.66634 28.0074 7.66634 26.4448V24.6088Z" fill="#fff"></path></g>
</svg>
</span>
<div>
<h3 class="text-white">For cash payment Make sure You Get A Voucher code</h3>
{include file="$_path/../pages/Order_Voucher.html"}
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-12 col-xxl-12">
<div class="card">
<div class="card-header border-0 pb-0">
<div>
<h4 class="card-title mb-2">{Lang::T('Voucher Activation')}</h4>
</div>
</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}voucher/activation-post">
<label class="col-md-2 control-label">{Lang::T('Code Voucher')}</label>
<div class="format-slider mb-3">
<input type="text" class="form-control" id="code" name="code"
placeholder="{Lang::T('Enter voucher code here')}">
</div>
<div class="border-0 pt-0">
<button class="btn btn-primary btn-block btn-lg text-uppercase" type="submit">{Lang::T('Recharge')}</button> Or <a class="btn btn-warning d-block btn-lg text-uppercase" href="{$_url}home">{Lang::T('Cancel')}</a>
</div>
</form>
</div>
</div>
</div>
</div>
{include file="sections/user-footer.tpl"}

View File

@@ -0,0 +1,43 @@
{include file="sections/user-header.tpl"}
<!-- user-change-password -->
<div class="row">
<div class="col-sm-12 col-md-6">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">{Lang::T('Change Password')}</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}accounts/change-password-post">
<div class="form-group">
<label class=" control-label">{Lang::T('Current Password')}</label>
<div class="col-md-12">
<input type="password" class="form-control" id="password" name="password">
</div>
</div>
<div class="form-group">
<label class="control-label">{Lang::T('New Password')}</label>
<div class="col-md-12">
<input type="password" class="form-control" id="npass" name="npass">
</div>
</div>
<div class="form-group mb-3">
<label class=" control-label">{Lang::T('Confirm New Password')}</label>
<div class="col-md-12">
<input type="password" class="form-control" id="cnpass" name="cnpass">
</div>
</div>
<div class="form-group">
<div class="col-md-12">
<button class="btn btn-success btn-block"
type="submit">{Lang::T('Save Changes')}</button>
Or <a class="btn btn-warning btn-block" href="{$_url}home">{Lang::T('Cancel')}</a>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
{include file="sections/user-footer.tpl"}

333
ui/ui/user-dashboard.tpl Normal file
View File

@@ -0,0 +1,333 @@
{include file="sections/user-header.tpl"}
<div class="row">
<div class="col-xl-6 col-xxl-12">
<div class="card">
<div class="card-body">
<div class="row align-items-center">
<div class="col-xl-8">
<div class="card-bx bg-blue">
<img class="pattern-img" src="ui/ui/Ass/images/pattern/pattern6.png" alt="">
<div class="card-info text-white">
<img src="ui/ui/Ass/images/pattern/circle.png" class="mb-4" alt="">
<h2 class="text-white card-balance">{Lang::moneyFormat($_user['balance'])}</h2>
<p class="fs-16">{Lang::T('Balance')}</p>
</div>
<a class="change-btn" href="javascript:void(0);"><i class="fa fa-caret-up up-ico"></i>Refresh<span class="reload-icon"><i class="fas fa-sync-alt reload active"></i></span></a>
</div>
</div>
<div class="col-xl-4">
<div class="row mt-xl-0 mt-4">
<!-- <div class="col-md-6"> -->
<h4 class="card-title">{Lang::T('Your Account Information')}</h4>
<span>Below are your account details. Auto renew is enabled by default.</span>
<ul class="card-list mt-4">
<li><span class="bg-blue circle"></span>{Lang::T('Username')}<span>{$_user['username']}</span></li>
<li><span class="bg-blue circle"></span>{Lang::T('Password')}<span><input type="password" value="{$_user['password']}"
style="width:100%; border: 0px;" onmouseleave="this.type = 'password'"
onmouseenter="this.type = 'text'" onclick="this.select()"></span></li>
<li><span class="bg-blue circle"></span>{Lang::T('Service Type')}<span>{if $_user.service_type == 'Hotspot'}
Hotspot
{elseif $_user.service_type == 'PPPoE'}
PPPoE
{elseif $_user.service_type == 'Others' || $_user.service_type == null}
Others
{/if}</span></li>
<!-- <li><span class="bg-blue circle"></span>Auto Renew<span>Yes</span></li> -->
</ul>
<!-- </div> -->
<!-- <div class="col-md-6">
<canvas id="polarChart"></canvas>
</div> -->
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-6 col-xxl-5">
<div class="card">
{if $unpaid }
<div class=" box-danger box-solid">
<div class="card-header">
<h3 class="">{Lang::T('Unpaid Order')}</h3>
</div>
<div class="card-body pb-0 pt-3">
<table class="table table-condensed table-bordered table-striped table-hover" style="margin-bottom: 0px;">
<tbody>
<tr>
<td>{Lang::T('expired')}</td>
<td>{Lang::dateTimeFormat($unpaid['expired_date'])} </td>
</tr>
<tr>
<td>{Lang::T('Plan Name')}</td>
<td>{$unpaid['plan_name']}</td>
</tr>
<tr>
<td>{Lang::T('Plan Price')}</td>
<td>{$unpaid['price']}</td>
</tr>
<tr>
<td>{Lang::T('Routers')}</td>
<td>{$unpaid['routers']}</td>
</tr>
</tbody>
</table>
</div>
<div class="card-footer p-2">
<div class="btn-group btn-group-justified mb15">
<div class="btn-group">
<a href="{$_url}order/view/{$unpaid['id']}/cancel" class="btn btn-danger btn-sm"
onclick="return confirm('{Lang::T('Cancel it?')}')">
<span class="glyphicon glyphicon-trash"></span>
{Lang::T('Cancel')}
</a>
</div>
<div class="btn-group">
<a class="btn btn-success btn-block btn-sm" href="{$_url}order/view/{$unpaid['id']}">
<span class="icon"><i class="ion ion-card"></i></span>
<span>{Lang::T('PAY NOW')}</span>
</a>
</div>
</div>
</div>
</div>
{/if}
<div class="card-header pb-0 border-0">
<div>
<h4 class="card-title mb-2">{Lang::T('Announcement')}</h4>
</div>
</div>
<div class="card-body pb-0 pt-3">
<div class="user-bx mb-2">
<div>
<span class="meta">
{$Announcement_Customer = "{$PAGES_PATH}/Announcement_Customer.html"}
{if file_exists($Announcement_Customer)}
{include file=$Announcement_Customer}
{/if}
</span>
</div>
<i class="las la-check-circle check-icon"></i>
</div>
</div>
</div>
</div>
<div class="col-xl-6 col-xxl-7">
{if $_bills}
<div class="card card-primary card-solid">
{foreach $_bills as $_bill}
{if $_bill['routers'] != 'radius'}
<div class="card-header">
<h3 class="">{$_bill['routers']}</h3>
<div class="btn-group pull-right">
{if $_bill['type'] == 'Hotspot'}
{if $_c['hotspot_plan']==''}Hotspot Plan{else}{$_c['hotspot_plan']}{/if}
{else}
{if $_c['pppoe_plan']==''}PPPOE Plan{else}{$_c['pppoe_plan']}{/if}
{/if}
</div>
</div>
{else}
<div class="card-header">
<h3 class="">{if $_c['radius_plan']==''}Radius Plan{else}{$_c['radius_plan']}{/if}</h3>
</div>
{/if}
<div class="card-body">
<table class="table table-striped table-hover" style="margin-bottom: 0px;">
<tr>
<td class="small text-primary text-uppercase text-normal">{Lang::T('Plan Name')}</td>
<td class="small mb15">
{$_bill['namebp']}
{if $_bill['status'] != 'on'}
<a class="label label-danger pull-right" href="{$_url}order/package">{Lang::T('expired')}</a>
{/if}
</td>
</tr>
<tr>
<td class="small text-info text-uppercase text-normal">{Lang::T('Created On')}</td>
<td class="small mb15">
{if $_bill['time'] ne ''}{Lang::dateAndTimeFormat($_bill['recharged_on'],$_bill['recharged_time'])}
{/if}&nbsp;</td>
</tr>
<tr>
<td class="small text-danger text-uppercase text-normal">{Lang::T('Expires On')}</td>
<td class="small mb15 text-danger">
{if $_bill['time'] ne ''}{Lang::dateAndTimeFormat($_bill['expiration'],$_bill['time'])}{/if}&nbsp;
</td>
</tr>
<tr>
<td class="small text-success text-uppercase text-normal">{Lang::T('Type')}</td>
<td class="small mb15 text-success">
<b>{if $_bill['prepaid'] eq yes}Prepaid{else}Postpaid{/if}</b>
{Lang::T($_bill['plan_type'])}
</td>
</tr>
{if $nux_ip neq ''}
<tr>
<td class="small text-primary text-uppercase text-normal">{Lang::T('Current IP')}</td>
<td class="small mb15">{$nux_ip}</td>
</tr>
{/if}
{if $nux_mac neq ''}
<tr>
<td class="small text-primary text-uppercase text-normal">{Lang::T('Current MAC')}</td>
<td class="small mb15">{$nux_mac}</td>
</tr>
{/if}
{if $_bill['type'] == 'Hotspot' && $_bill['status'] == 'on' && $_bill['routers'] != 'radius'}
<tr>
<td class="small text-primary text-uppercase text-normal">{Lang::T('Login Status')}</td>
<td class="small mb15" id="login_status_{$_bill['id']}">
<img src="ui/ui/images/loading.gif">
</td>
</tr>
{/if}
<tr>
<td class="text-primary text-uppercase text-normal">
{if $_bill['status'] == 'on'}
<a href="{$_url}home&deactivate={$_bill['id']}"
onclick="return confirm('{Lang::T('Deactivate')}?')" class="btn btn-danger d-block text-uppercase"><i
class="bi-trash-fill"></i></a>
{/if}
</td>
<td class="row">
{if $_bill['status'] != 'on' && $_bill['prepaid'] != 'yes' && $_c['extend_expired']}
<a class="btn btn-warning text-black d-block text-uppercase"
href="{$_url}home&extend={$_bill['id']}&stoken={App::getToken()}"
onclick="return confirm('{Text::toHex($_c['extend_confirmation'])}')">{Lang::T('Extend')}</a>
{/if}
<a class="btn btn-primary pull-right d-block text-uppercase"
href="{$_url}home&recharge={$_bill['id']}&stoken={App::getToken()}"
onclick="return confirm('{Lang::T('Recharge')}?')">{Lang::T('Recharge')}</a>
</td>
</tr>
</table>
</div>
{/foreach}
</div>
{/if}
{if $_c['disable_voucher'] == 'yes'}
<div class="card-footer">
{if $_c['payment_gateway'] != 'none' or $_c['payment_gateway'] == '' }
<a href="{$_url}order/package" class="btn btn-primary btn-block">
<i class="bi-cart-plus-fill"></i>
{Lang::T('Order Package')}
</a>
{/if}
</div>
{/if}
{if $_bills}
{foreach $_bills as $_bill}
{if $_bill['type'] == 'Hotspot' && $_bill['status'] == 'on'}
<script>
setTimeout(() => {
$.ajax({
url: "index.php?_route=autoload_user/isLogin/{$_bill['id']}",
cache: false,
success: function(msg) {
$("#login_status_{$_bill['id']}").html(msg);
}
});
}, 2000);
</script>
{/if}
{/foreach}
{/if}
</div>
<div class="col-xl-6 col-xxl-7">
{if $_c['enable_balance'] == 'yes' && $_c['allow_balance_transfer'] == 'yes'}
<div class="card card-primary box-solid mb30">
<div class="card-header">
<h4 class="card-title mb-2">{Lang::T("Transfer Balance")}</h4>
</div>
<div class="card-body">
<form method="post" onsubmit="return askConfirm()" role="form" action="{$_url}home">
<div class="row">
<div class="format-slider col-xl-4 mb-3">
<input type="text" id="username" name="username" class="form-control" required
placeholder="Y123456789">
</div>
<div class="format-slider col-xl-4 mb-3">
<input type="number" id="balance" name="balance" autocomplete="off" class="form-control"
required placeholder="{Lang::T('Balance')}">
</div>
<div class="col-xl-4">
<button class="btn btn-primary btn-block text-uppercase" id="sendBtn" type="submit" name="send"
onclick="return confirm('{Lang::T("Are You Sure?")}')" value="balance">Transfer</button>
</div>
</div>
</form>
<script>
function askConfirm() {
if(confirm('{Lang::T('Send your balance?')}')){
setTimeout(() => {
document.getElementById('sendBtn').setAttribute('disabled', '');
}, 1000);
return true;
}
return false;
}
</script>
</div>
<div class="card-header border-0 pb-0">
<h4 class="card-title mb-2">{Lang::T("Recharge a friend")}</h4>
</div>
<div class="card-body">
<form method="post" role="form" action="{$_url}home">
<div class="row">
<div class="format-slider col-xl-9 mb-3">
<input type="text" id="username" name="username" class="form-control" required
placeholder="Y123456789">
</div>
<div class="col-xl-3">
<button class="btn btn-primary btn-block text-uppercase" id="sendBtn" type="submit" name="send"
onclick="return confirm('{Lang::T("Are You Sure?")}')" value="plan">Recharge</button>
</div>
</div>
</form>
</div>
</div>
{/if}
</div>
<div class="col-xl-6 col-xxl-7">
{if $_c['disable_voucher'] != 'yes'}
<div class="card">
<div class="card-header border-0 pb-0">
<div>
<h4 class="card-title mb-2">{Lang::T('Voucher Activation')}</h4>
</div>
</div>
<div class="card-body">
<form method="post" role="form" class="form-horizontal" action="{$_url}voucher/activation-post">
<label class="control-label text-center">{Lang::T('Code Voucher')}</label>
<div class="row">
<div class="col-xl-9 format-slider mb-3">
<input type="text" id="code" name="code" class="form-control" placeholder="{Lang::T('Enter voucher code here')}">
</div>
<div class="col-xl-3 border-0 pt-0">
<button class="btn btn-primary btn-block text-uppercase" type="submit">{Lang::T('Recharge')}</button>
</div>
</div>
</form>
</div>
<div class="card-body">
<div class="btn-group btn-group-justified col-xl-12 col-xxl-12" role="group">
<a class="btn btn-warning" href="{$_url}voucher/activation">
<i class="bi-cart-plus-fill"></i>
{Lang::T('Order Voucher')}
</a>
{if $_c['payment_gateway'] != 'none' or $_c['payment_gateway'] == '' }
<a href="{$_url}order/package" class="btn btn-primary">
<i class="bi-cart-plus-fill"></i>
{Lang::T('Order Package')}
</a>
{/if}
</div>
</div>
</div>
</div>
{/if}
</div>
</div>
{include file="sections/user-footer.tpl"}

119
ui/ui/user-logi.tpl Normal file
View File

@@ -0,0 +1,119 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>{Lang::T('Login')} - {$_c['CompanyName']}</title>
<link rel="shortcut icon" href="ui/ui/images/logo.png" type="image/x-icon" />
<link rel="stylesheet" href="ui/ui/styles/bootstrap.min.css">
<link rel="stylesheet" href="ui/ui/styles/modern-AdminLTE.min.css">
</head>
<body>
<div class="container">
<div class="hidden-xs" style="height:150px"></div>
<div class="form-head mb20">
<h1 class="site-logo h2 mb5 mt5 text-center text-uppercase text-bold"
style="text-shadow: 2px 2px 4px #757575;">{$_c['CompanyName']}</h1>
<hr>
</div>
{if isset($notify)}
<div class="alert alert-{if $notify_t == 's'}success{else}danger{/if}">
<button type="button" class="close" data-dismiss="alert">
<span aria-hidden="true">×</span>
</button>
<div>{$notify}</div>
</div>
{/if}
<div class="row">
<div class="col-sm-6 col-sm-offset-1">
<div class="panel panel-info">
<div class="panel-heading">{Lang::T('Announcement')}</div>
<div class="panel-body">
{$Announcement = "{$PAGES_PATH}/Announcement.html"}
{if file_exists($Announcement)}
{include file=$Announcement}
{/if}
</div>
</div>
</div>
<div class="col-sm-4">
<div class="panel panel-primary">
<div class="panel-heading">{Lang::T('Log in to Member Panel')}</div>
<div class="panel-body">
<form action="{$_url}login/post" method="post">
<div class="form-group">
<label>{if $_c['country_code_phone']!= ''}{Lang::T('Phone Number')}{else}{Lang::T('Username')}{/if}</label>
<div class="input-group">
{if $_c['country_code_phone']!= ''}
<span class="input-group-addon" id="basic-addon1"><i
class="glyphicon glyphicon-phone-alt"></i></span>
{else}
<span class="input-group-addon" id="basic-addon1"><i
class="glyphicon glyphicon-user"></i></span>
{/if}
<input type="text" class="form-control" name="username"
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']} {Lang::T('Phone Number')}{else}Y123456789{/if}">
</div>
</div>
<div class="form-group">
<label>{Lang::T('Password')}</label>
<div class="input-group">
<span class="input-group-addon" id="basic-addon2"><i class="glyphicon glyphicon-lock"></i></span>
<input type="password" class="form-control" name="password" placeholder="{Lang::T('Password')}">
</div>
</div>
<div class="clearfix hidden">
<div class="ui-checkbox ui-checkbox-primary right">
<label>
<input type="checkbox">
<span>Remember me</span>
</label>
</div>
</div>
<div class="btn-group btn-group-justified mb15">
<div class="btn-group">
<a href="{$_url}register" class="btn btn-success">{Lang::T('Register')}</a>
</div>
<div class="btn-group">
<button type="submit" class="btn btn-primary">{Lang::T('Login')}</button>
</div>
</div>
<br>
<center>
<a href="javascript:showPrivacy()">Privacy</a>
&bull;
<a href="javascript:showTaC()">T &amp; C</a>
</center>
</form>
</div>
</div>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="HTMLModal" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">&times;</span></button>
</div>
<div class="modal-body" id="HTMLModal_konten"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">&times;</button>
</div>
</div>
</div>
</div>
<script src="ui/ui/scripts/vendors.js?v=1"></script>
</body>
</html>

View File

@@ -0,0 +1,86 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>{Lang::T('Login')} - {$_c['CompanyName']}</title>
<link rel="shortcut icon" href="ui/ui/images/logo.png" type="image/x-icon" />
<link rel="stylesheet" href="ui/ui/styles/bootstrap.min.css">
<link rel="stylesheet" href="ui/ui/styles/modern-AdminLTE.min.css">
</head>
<body>
<div class="container">
<div class="hidden-xs" style="height:150px"></div>
<div class="form-head mb20">
<h1 class="site-logo h2 mb5 mt5 text-center text-uppercase text-bold"
style="text-shadow: 2px 2px 4px #757575;">{$_c['CompanyName']}</h1>
<hr>
</div>
{if isset($notify)}
<div class="alert alert-{if $notify_t == 's'}success{else}danger{/if}">
<button type="button" class="close" data-dismiss="alert">
<span aria-hidden="true">×</span>
</button>
<div>{$notify}</div>
</div>
{/if}
<div class="row">
<div class="col-sm-8">
<div class="panel panel-info">
<div class="panel-heading">{Lang::T('Announcement')}</div>
<div class="panel-body">
{include file="$_path/../pages/Announcement.html"}
</div>
</div>
</div>
<div class="col-sm-4">
<div class="panel panel-primary">
<div class="panel-heading">{Lang::T('Login / Activate Voucher')}</div>
<div class="panel-body">
<form action="{$_url}login/activation" method="post">
<div class="form-group">
<label>{if $_c['country_code_phone']!= ''}{Lang::T('Phone Number')}{else}{Lang::T('Username')}{/if}</label>
<div class="input-group">
{if $_c['country_code_phone']!= ''}
<span class="input-group-addon" id="basic-addon1"><i
class="glyphicon glyphicon-phone-alt"></i></span>
{else}
<span class="input-group-addon" id="basic-addon1"><i
class="glyphicon glyphicon-user"></i></span>
{/if}
<input type="text" class="form-control" name="username" required
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']} {Lang::T('Phone Number')}{else}Y123456789{/if}">
</div>
</div>
<div class="form-group">
<label>{Lang::T('Enter voucher code here')}</label>
<input type="text" class="form-control" name="voucher" required autocomplete="off"
placeholder="{Lang::T('Code Voucher')}">
</div>
<div class="btn-group btn-group-justified mb15">
<div class="btn-group">
<button type="submit"
class="btn btn-primary">{Lang::T('Login / Activate Voucher')}</button>
</div>
</div>
<br>
<center>
<a href="./pages/Privacy_Policy.html" target="_blank">Privacy</a>
&bull;
<a href="./pages/Terms_of_Conditions.html" target="_blank">ToC</a>
</center>
</form>
</div>
</div>
</div>
</div>
</div>
<script src="ui/ui/scripts/vendors.js"></script>
</body>
</html>

68
ui/ui/user-login.tpl Normal file
View File

@@ -0,0 +1,68 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="48x48" href="favicon-48x48.png">
<link rel="icon" type="image/png" sizes="64x64" href="favicon-64x64.png">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<title>{Lang::T('Login')} - {$_c['CompanyName']}</title>
<link rel="stylesheet" href="ui/ui/Css/lineicons.min.css">
<link rel="stylesheet" href="ui/ui/Css/Style.css">
<meta http-equiv="refresh" content="{$time}; url={$url}">
</head>
<body>
<div class="login-div">
<div class="logo"></div>
<div class="title">{$_c['CompanyName']} - Member Login</div>
{if isset($notify)}
{$notify}
{/if}
<form action="{$_url}login/post" method="post">
<div class="login-in">
<div class="username">
<i class="fa fa-user"></i>
<div class="input-group">
{if $_c['country_code_phone']!= ''}
<span class="input-group-text" id="basic-addon1"><i
class="fa fa-phone"></i></span>
{else}
<span class="input-group-text" id="basic-addon1"><i
class="fa fa-user"></i></span>
{/if}
<input type="text" class="form-control" name="username"
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']} {Lang::T('Phone Number')}{else}Y123456789{/if}">
</div>
</div>
<div class="password">
<i class="fa fa-lock"></i>
<input type="password" required class="form-control" name="password" placeholder="{Lang::T('Password')}">
</div>
</div>
<button type="submit" class="buttons" value="{Lang::T('Login')}">login</button>
</form>
</div>
<script src="assets/vendor/global/global.min.js"></script>
<script src="assets/vendor/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="assets/vendor/chart.js/Chart.bundle.min.js"></script>
<!-- Chart piety plugin files -->
<script src="assets/vendor/peity/jquery.peity.min.js"></script>
<!-- Apex Chart -->
<script src="assets/vendor/apexchart/apexchart.js"></script>
<!-- Dashboard 1 -->
<script src="assets/js/dashboard/dashboard-1.js"></script>
<script src="assets/js/custom.min.js"></script>
<script src="assets/js/deznav-init.js"></script>
<script src="assets/js/demo.js"></script>
</body>
</html>

View File

@@ -0,0 +1,47 @@
{include file="sections/user-header.tpl"}
<!-- user-orderPlan -->
<div class="row">
<div class="col-xl-12 col-xxl-12">
<div class="col-xl-12">
<div class="card coin-card">
<div class="card-body d-sm-flex d-block align-items-center">
<span class="coin-icon">
<svg width="38" height="41" viewBox="0 0 38 41" fill="none" xmlns="http://www.w3.org/2000/svg">
<g><path d="M14.0413 32.5832C15.7416 32.5934 17.4269 32.2659 18.9997 31.6199C20.5708 32.2714 22.2572 32.5991 23.958 32.5832C29.1218 32.5832 33.1663 29.8278 33.1663 26.3088V20.441C33.1663 16.922 29.1218 14.1666 23.958 14.1666C23.7186 14.1666 23.4834 14.1779 23.2497 14.1906V7.55498C23.2497 4.10823 19.2051 1.41656 14.0413 1.41656C8.87759 1.41656 4.83301 4.10823 4.83301 7.55498V26.4448C4.83301 29.8916 8.87759 32.5832 14.0413 32.5832ZM30.333 26.3088C30.333 27.9366 27.715 29.7499 23.958 29.7499C20.201 29.7499 17.583 27.9366 17.583 26.3088V24.9984C19.5015 26.1652 21.7131 26.7604 23.958 26.714C26.203 26.7604 28.4145 26.1652 30.333 24.9984V26.3088ZM23.958 16.9999C27.715 16.9999 30.333 18.8132 30.333 20.441C30.333 22.0687 27.715 23.8807 23.958 23.8807C20.201 23.8807 17.583 22.0673 17.583 20.441C17.583 18.8147 20.201 16.9999 23.958 16.9999ZM14.0413 4.2499C17.7983 4.2499 20.4163 5.9924 20.4163 7.55498C20.4163 9.11757 17.7983 10.8615 14.0413 10.8615C10.2843 10.8615 7.66634 9.11898 7.66634 7.55498C7.66634 5.99098 10.2843 4.2499 14.0413 4.2499ZM7.66634 12.0161C9.59282 13.1601 11.8012 13.7417 14.0413 13.6948C16.2814 13.7417 18.4899 13.1601 20.4163 12.0161V14.6341C18.8724 15.0232 17.4565 15.8078 16.308 16.9107C15.5631 17.0718 14.8034 17.1545 14.0413 17.1572C10.2843 17.1572 7.66634 15.4146 7.66634 13.8521V12.0161ZM7.66634 18.3132C9.59323 19.4561 11.8015 20.0371 14.0413 19.9905C14.2935 19.9905 14.5372 19.9593 14.7851 19.9466C14.764 20.1106 14.7522 20.2756 14.7497 20.441V23.3947C14.5117 23.4089 14.2822 23.4542 14.0413 23.4542C10.2843 23.4542 7.66634 21.7117 7.66634 20.1477V18.3132ZM7.66634 24.6088C9.59282 25.7529 11.8012 26.3344 14.0413 26.2876C14.2793 26.2876 14.5131 26.2692 14.7497 26.2578V26.3088C14.7699 27.5148 15.2334 28.6711 16.0516 29.5572C15.3887 29.6824 14.7159 29.7469 14.0413 29.7499C10.2843 29.7499 7.66634 28.0074 7.66634 26.4448V24.6088Z" fill="#fff"></path></g>
</svg>
</span>
<div>
<h3 class="text-white">Top Up your balance </h3>
<p>You can top up your account balance by choosing a plan below. The balance will ensure continuous internet connection as long as your balance is sufficient.</p>
</div>
</div>
</div>
</div>
</div>
{if $_c['enable_balance'] == 'yes'}
{foreach $plans_balance as $plan}
<div class="col-xl-2 col-xxl-4">
<div class="card">
<div class="card-header border-0 pb-0">
<div>
<h4 class="card-title mb-2">{$plan['name_plan']}</h4>
</div>
</div>
<div class="card-body">
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Price')}</span>
<span class="fs-18"><span class="text-black pe-2">{Lang::moneyFormat($plan['price'])}
</div>
</div>
<div class="card-footer border-0 pt-0">
<a href="{$_url}order/gateway/0/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy Balance')}?')"
class="btn btn-sm btn-block btn-primary">Top Up Now</a>
</div>
</div>
</div>
{/foreach}
{/if}
</div>
</div>
{include file="sections/user-footer.tpl"}

126
ui/ui/user-orderHistory.tpl Normal file
View File

@@ -0,0 +1,126 @@
{include file="sections/user-header.tpl"}
<!-- user-orderHistory -->
<div class="row">
<!-- <div class="col-xl-6 col-xxl-12">
<div class="row">
<div class="col-sm-6">
<div class="card">
<div class="card-body">
<h4 class="card-title mt-2">Orders</h4>
<div class="d-flex align-items-center mt-3 mb-2">
<h2 class="fs-38 mb-0 me-3">456</h2>
</div>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="card">
<div class="card-body">
<h4 class="card-title mt-2">Activated Vouchers</h4>
<div class="d-flex align-items-center mt-3 mb-2">
<h2 class="fs-38 mb-0 me-3">1467</h2>
</div>
</div>
</div>
</div>
</div>
</div> -->
<div class="col-xl-12 col-xxl-12">
<div class="card">
<div class="card-header d-block d-sm-flex border-0">
<div class="me-3">
<h4 class="card-title mb-2">My Reports</h4>
</div>
<div class="card-tabs mt-3 mt-sm-0">
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<a class="nav-link active" data-bs-toggle="tab" href="#orders" role="tab">Orders</a>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="tab" href="#activation" role="tab">Activations</a>
</li>
</ul>
</div>
</div>
<div class="card-body tab-content p-0">
<div class="tab-pane active show fade" id="orders" role="tabpanel">
<div class="table-responsive">
<table class="table table-responsive-md card-table transactions-table">
<thead>
<tr>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Plan Name')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Gateway')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Routers')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0"><{Lang::T('Type')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Plan Price')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Created On')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Expires On')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Date Done')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Method')}</h6></th>
</tr>
</thead>
<tbody>
{foreach $d as $ds}
<tr>
<td><span class="fs-14"><a href="{$_url}order/view/{$ds['id']}">{$ds['plan_name']}</a></span></td>
<td><span class="fs-14">{$ds['gateway']}</span></td>
<td><span class="fs-14">{$ds['routers']}</span></td>
<td><span class="fs-14">{$ds['payment_channel']}</span></td>
<td><span class="fs-14">{Lang::moneyFormat($ds['price'])}</span></td>
<td class="text-primary"><span class="fs-14">{date("{$_c['date_format']} H:i",
strtotime($ds['created_date']))}</span></td>
<td class="text-danger"><span class="fs-14">{date("{$_c['date_format']} H:i",
strtotime($ds['expired_date']))}</span></td>
<td class="text-success"><span class="fs-14">{if $ds['status']!=1}{date("{$_c['date_format']} H:i",
strtotime($ds['paid_date']))}{/if}</span></td>
<td><span class="fs-14">{if $ds['status']==1}{Lang::T('UNPAID')}
{elseif $ds['status']==2}{Lang::T('PAID')}
{elseif $ds['status']==3}{$_L['FAILED']}
{elseif $ds['status']==4}{Lang::T('CANCELED')}
{elseif $ds['status']==5}{Lang::T('UNKNOWN')}
{/if}</span></td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
<div class="tab-pane" id="activation" role="tabpanel">
<div class="table-responsive">
<table class="table table-responsive-md card-table transactions-table">
<thead>
<tr>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Invoice')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Plan Name')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Plan Price')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Type')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Created On')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Expires On')}</h6></th>
<th><h6 class="fs-16 font-w500 mb-0">{Lang::T('Method')}</h6></th>
</tr>
</thead>
<tbody>
<tr>
{foreach $d as $ds}
<tr onclick="window.location.href = '{$_url}voucher/invoice/{$ds['id']}'" style="cursor: pointer;">
<td><span class="fs-14">{$ds['invoice']}</span></td>
<td><span class="fs-14">{$ds['plan_name']}</span></td>
<td><span class="fs-14">{Lang::moneyFormat($ds['price'])}</span></td>
<td><span class="fs-14">{$ds['type']}</span></td>
<td><span class="fs-14">{Lang::dateAndTimeFormat($ds['recharged_on'],$ds['recharged_time'])}</span></td>
<td><span class="fs-14">{Lang::dateAndTimeFormat($ds['expiration'],$ds['time'])}</span></td>
<td><span class="fs-14">{$ds['method']}</span></td>
</tr>
{/foreach}
</tr>
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
</div>
{include file="sections/user-footer.tpl"}

430
ui/ui/user-orderPlan.tpl Normal file
View File

@@ -0,0 +1,430 @@
{include file="sections/user-header.tpl"}
<!-- user-orderPlan -->
<div class="row">
<div class="col-xl-12 col-xxl-12">
<div class="col-xl-12">
<div class="card coin-card">
<div class="card-body d-sm-flex d-block align-items-center">
<span class="coin-icon">
<svg width="38" height="41" viewcard="0 0 38 41" fill="none" xmlns="http://www.w3.org/2000/svg">
<g><path d="M14.0413 32.5832C15.7416 32.5934 17.4269 32.2659 18.9997 31.6199C20.5708 32.2714 22.2572 32.5991 23.958 32.5832C29.1218 32.5832 33.1663 29.8278 33.1663 26.3088V20.441C33.1663 16.922 29.1218 14.1666 23.958 14.1666C23.7186 14.1666 23.4834 14.1779 23.2497 14.1906V7.55498C23.2497 4.10823 19.2051 1.41656 14.0413 1.41656C8.87759 1.41656 4.83301 4.10823 4.83301 7.55498V26.4448C4.83301 29.8916 8.87759 32.5832 14.0413 32.5832ZM30.333 26.3088C30.333 27.9366 27.715 29.7499 23.958 29.7499C20.201 29.7499 17.583 27.9366 17.583 26.3088V24.9984C19.5015 26.1652 21.7131 26.7604 23.958 26.714C26.203 26.7604 28.4145 26.1652 30.333 24.9984V26.3088ZM23.958 16.9999C27.715 16.9999 30.333 18.8132 30.333 20.441C30.333 22.0687 27.715 23.8807 23.958 23.8807C20.201 23.8807 17.583 22.0673 17.583 20.441C17.583 18.8147 20.201 16.9999 23.958 16.9999ZM14.0413 4.2499C17.7983 4.2499 20.4163 5.9924 20.4163 7.55498C20.4163 9.11757 17.7983 10.8615 14.0413 10.8615C10.2843 10.8615 7.66634 9.11898 7.66634 7.55498C7.66634 5.99098 10.2843 4.2499 14.0413 4.2499ZM7.66634 12.0161C9.59282 13.1601 11.8012 13.7417 14.0413 13.6948C16.2814 13.7417 18.4899 13.1601 20.4163 12.0161V14.6341C18.8724 15.0232 17.4565 15.8078 16.308 16.9107C15.5631 17.0718 14.8034 17.1545 14.0413 17.1572C10.2843 17.1572 7.66634 15.4146 7.66634 13.8521V12.0161ZM7.66634 18.3132C9.59323 19.4561 11.8015 20.0371 14.0413 19.9905C14.2935 19.9905 14.5372 19.9593 14.7851 19.9466C14.764 20.1106 14.7522 20.2756 14.7497 20.441V23.3947C14.5117 23.4089 14.2822 23.4542 14.0413 23.4542C10.2843 23.4542 7.66634 21.7117 7.66634 20.1477V18.3132ZM7.66634 24.6088C9.59282 25.7529 11.8012 26.3344 14.0413 26.2876C14.2793 26.2876 14.5131 26.2692 14.7497 26.2578V26.3088C14.7699 27.5148 15.2334 28.6711 16.0516 29.5572C15.3887 29.6824 14.7159 29.7469 14.0413 29.7499C10.2843 29.7499 7.66634 28.0074 7.66634 26.4448V24.6088Z" fill="#fff"></path></g>
</svg>
</span>
<div>
<h3 class="text-white">Buy or Upgrade Your Package</h3>
<p>You can buy a package or chose a different package if you wish to upgrade to another package.</p>
</div>
</div>
</div>
</div>
</div>
{if $_c['radius_enable']}
{if $_user['service_type'] == 'PPPoE'}
{if Lang::arrayCount($radius_pppoe)>0}
<ol class="breadcrumb">
<li>{if $_c['radius_plan']==''}Radius Plan{else}{$_c['radius_plan']}{/if}</li>
<li>{if $_c['pppoe_plan']==''}PPPOE Plan{else}{$_c['pppoe_plan']}{/if}</li>
</ol>
<div class="row">
{foreach $radius_pppoe as $plan}
<div class="col-xl-3 col-xxl-4">
<div class="card card-primary">
<div class="card-header border-0 pb-0">
<div>
<h4 class="card-header mb-2">{$plan['name_plan']}</h4>
</div>
</div>
<div class="card-body">
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Type')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['type']}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Price')}</span>
<span class="fs-18"><span class="text-black pe-2">{Lang::moneyFormat($plan['price'])}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Validity')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['validity']} {$plan['validity_unit']}
</div>
</div>
<div class="card-footer">
<div class="btn-group btn-group-justified" role="group" aria-label="...">
<a href="{$_url}order/gateway/radius/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this? your active package will be overwrite')}')"
class="btn btn-outline-primary btn-block btn-lg">Buy</a>
{if $_c['enable_balance'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/pay/radius/{$plan['id']}"
onclick="return confirm('{Lang::T('Pay this with Balance? your active package will be overwrite')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Pay With Balance')}</a>
{/if}
</div>
{if $_c['enable_balance'] == 'yes' && $_c['allow_balance_transfer'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/send/radius/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this for friend account?')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Buy for friend')}</a>
{/if}
</div>
</div>
</div>
{/foreach}
</div>
{/if}
{elseif $_user['service_type'] == 'Hotspot'}
{if Lang::arrayCount($radius_hotspot)>0}
<ol class="breadcrumb">
<li>{if $_c['radius_plan']==''}Radius Plan{else}{$_c['radius_plan']}{/if}</li>
<li>{if $_c['hotspot_plan']==''}Hotspot Plan{else}{$_c['hotspot_plan']}{/if}</li>
</ol>
<div class="row">
{foreach $radius_hotspot as $plan}
<div class="col-xl-3 col-xxl-4">
<div class="card card-primary">
<div class="card-header border-0 pb-0">
<div>
<h4 class="card-header mb-2">{$plan['name_plan']}</h4>
</div>
</div>
<div class="card-body">
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Type')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['type']}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Price')}</span>
<span class="fs-18"><span class="text-black pe-2">{Lang::moneyFormat($plan['price'])}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Validity')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['validity']} {$plan['validity_unit']}
</div>
</div>
<div class="card-footer">
<div class="btn-group btn-group-justified" role="group" aria-label="...">
<a href="{$_url}order/gateway/radius/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this? your active package will be overwrite')}')"
class="btn btn-outline-primary btn-block btn-lg">Buy</a>
{if $_c['enable_balance'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/pay/radius/{$plan['id']}"
onclick="return confirm('{Lang::T('Pay this with Balance? your active package will be overwrite')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Pay With Balance')}</a>
{/if}
</div>
{if $_c['enable_balance'] == 'yes' && $_c['allow_balance_transfer'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/send/radius/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this for friend account?')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Buy for friend')}</a>
{/if}
</div>
</div>
</div>
{/foreach}
</div>
{/if}
{elseif $_user['service_type'] == 'Others' || $_user['service_type'] == '' && (Lang::arrayCount($radius_pppoe)>0 || Lang::arrayCount($radius_hotspot)>0)}
<ol class="breadcrumb">
<li>{if $_c['radius_plan']==''}Radius Plan{else}{$_c['radius_plan']}{/if}</li>
<li>{if $_c['pppoe_plan']==''}PPPOE Plan{else}{$_c['pppoe_plan']}{/if}</li>
</ol>
{if Lang::arrayCount($radius_pppoe)>0}
<div class="row">
{foreach $radius_pppoe as $plan}
<div class="col-xl-3 col-xxl-4">
<div class="card card-primary">
<div class="card-header border-0 pb-0">{$plan['name_plan']}
</div>
<div class="card-body">
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Type')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['type']}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Price')}</span>
<span class="fs-18"><span class="text-black pe-2">{Lang::moneyFormat($plan['price'])}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Validity')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['validity']} {$plan['validity_unit']}
</div>
</div>
<div class="card-footer">
<div class="btn-group btn-group-justified" role="group" aria-label="...">
<a href="{$_url}order/gateway/pppoe/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this? your active package will be overwritten')}')"
class="btn btn-outline-primary btn-block btn-lg">Buy</a>
{if $_c['enable_balance'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/pay/pppoe/{$plan['id']}"
onclick="return confirm('{Lang::T('Pay this with Balance? your active package will be overwritten')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Pay With Balance')}</a>
{/if}
</div>
{if $_c['enable_balance'] == 'yes' && $_c['allow_balance_transfer'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/send/pppoe/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this for friend account?')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Buy for friend')}</a>
{/if}
</div>
</div>
</div>
{/foreach}
</div>
{/if}
{if Lang::arrayCount($radius_hotspot)>0}
<ol class="breadcrumb">
<li>{if $_c['radius_plan']==''}Radius Plan{else}{$_c['radius_plan']}{/if}</li>
<li>{if $_c['hotspot_plan']==''}Hotspot Plan{else}{$_c['hotspot_plan']}{/if}</li>
</ol>
<div class="row">
{foreach $radius_hotspot as $plan}
<div class="col-xl-3 col-xxl-4">
<div class="card card-primary">
<div class="card-header border-0 pb-0">
<div>
<h4 class="card-title mb-2">{$plan['name_plan']}</h4>
</div>
</div>
<div class="card-body">
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Type')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['type']}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Price')}</span>
<span class="fs-18"><span class="text-black pe-2">{Lang::moneyFormat($plan['price'])}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Validity')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['validity']} {$plan['validity_unit']}
</div>
</div>
<div class="card-footer">
<div class="btn-group btn-group-justified" role="group" aria-label="...">
<a href="{$_url}order/gateway/hotspot/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this? your active package will be overwritten')}')"
class="btn btn-outline-primary btn-block btn-lg">Buy</a>
{if $_c['enable_balance'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/pay/hotspot/{$plan['id']}"
onclick="return confirm('{Lang::T('Pay this with Balance? your active package will be overwritten')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Pay With Balance')}</a>
{/if}
</div>
{if $_c['enable_balance'] == 'yes' && $_c['allow_balance_transfer'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/send/hotspot/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this for friend account?')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Buy for friend')}</a>
{/if}
</div>
</div>
</div>
{/foreach}
</div>
{/if}
{/if}
{/if}
{foreach $routers as $router}
{if Validator::isRouterHasPlan($plans_hotspot, $router['name']) || Validator::isRouterHasPlan($plans_pppoe, $router['name'])}
<div class="col-xl-12 col-xxl-12">
<div class="card card-solid card-primary bg-gray">
<div class="card-header card-title text-bold">{$router['name']} - {if $router['description'] != ''}{$router['description']} {/if}</div>
{if $_user['service_type'] == 'Hotspot' && Validator::countRouterPlan($plans_hotspot, $router['name'])>0}
<div class="card-header">{if $_c['hotspot_plan']==''}Hotspot Plan{else}{$_c['hotspot_plan']}{/if}
</div>
<div class="card-body row">
{foreach $plans_hotspot as $plan}
{if $router['name'] eq $plan['routers']}
<div class="col-xl-3 col-xxl-4">
<div class="card card-primary">
<div class="card-header border-0 pb-0">
<div>
<h4 class="card-title mb-2">{$plan['name_plan']}</h4>
</div>
</div>
<div class="card-body">
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Type')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['type']}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Price')}</span>
<span class="fs-18"><span class="text-black pe-2">{Lang::moneyFormat($plan['price'])}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Validity')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['validity']} {$plan['validity_unit']}
</div>
</div>
<div class="card-footer">
<div class="btn-group btn-group-justified" role="group" aria-label="...">
<a href="{$_url}order/gateway/{$router['id']}/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this? your active package will be overwrite')}')"
class="btn btn-outline-primary d-block btn-lg">Buy</a>
{if $_c['enable_balance'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/pay/{$router['id']}/{$plan['id']}"
onclick="return confirm('{Lang::T('Pay this with Balance? your active package will be overwrite')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Pay With Balance')}</a>
{/if}
</div>
{if $_c['enable_balance'] == 'yes' && $_c['allow_balance_transfer'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/send/{$router['id']}/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this for friend account?')}')"
class="btn btn-outline-primary d-block btn-lg">{Lang::T('Buy for friend')}</a>
{/if}
</div>
</div>
</div>
{/if}
{/foreach}
</div>
{/if}
{if $_user['service_type'] == 'PPPoE' && Validator::countRouterPlan($plans_pppoe,$router['name'])>0}
<div class="card-header text-white">{if $_c['pppoe_plan']==''}PPPOE Plan{else}{$_c['pppoe_plan']}{/if}</div>
<div class="card-body row">
{foreach $plans_pppoe as $plan}
{if $router['name'] eq $plan['routers']}
<div class="col-xl-3 col-xxl-4">
<div class="card card- card-primary">
<div class="card-header border-0 pb-0">
<div>
<h4 class="card-title mb-2">{$plan['name_plan']}</h4>
</div>
</div>
<div class="card-body">
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Type')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['type']}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Price')}</span>
<span class="fs-18"><span class="text-black pe-2">{Lang::moneyFormat($plan['price'])}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Validity')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['validity']} {$plan['validity_unit']}
</div>
</div>
<div class="card-footer">
<div class="btn-group btn-group-justified" role="group" aria-label="...">
<a href="{$_url}order/gateway/{$router['id']}/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this? your active package will be overwrite')}')"
class="btn btn-outline-primary btn-block btn-lg">Buy</a>
{if $_c['enable_balance'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/pay/{$router['id']}/{$plan['id']}"
onclick="return confirm('{Lang::T('Pay this with Balance? your active package will be overwrite')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Pay With Balance')}</a>
{/if}
</div>
{if $_c['enable_balance'] == 'yes' && $_c['allow_balance_transfer'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/send/{$router['id']}/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this for friend account?')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Buy for friend')}</a>
{/if}
</div>
</div>
</div>
{/if}
{/foreach}
</div>
{/if}
{if $_user['service_type'] == 'Others' || $_user['service_type'] == '' && (Validator::countRouterPlan($plans_hotspot, $router['name'])>0 || Validator::countRouterPlan($plans_pppoe, $router['name'])>0)}
<div class="card-header text-white">{if $_c['hotspot_plan']==''}Hotspot Plan{else}{$_c['hotspot_plan']}{/if}
</div>
<div class="card-body row">
{foreach $plans_hotspot as $plan}
{if $router['name'] eq $plan['routers']}
<div class="col-xl-3 col-xxl-4">
<div class="card card-primary">
<div class="card-title border-0 pb-0">
<div>
<h4 class="card-title mb-2">{$plan['name_plan']}</h4>
</div>
</div>
<div class="card-body">
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Type')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['type']}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Price')}</span>
<span class="fs-18"><span class="text-black pe-2">{Lang::moneyFormat($plan['price'])}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Validity')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['validity']} {$plan['validity_unit']}
</div>
</div>
<div class="card-footer">
<div class="btn-group btn-group-justified" role="group" aria-label="...">
<a href="{$_url}order/gateway/{$router['id']}/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this? your active package will be overwrite')}')"
class="btn btn-outline-primary btn-block btn-lg">Buy</a>
{if $_c['enable_balance'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/pay/{$router['id']}/{$plan['id']}"
onclick="return confirm('{Lang::T('Pay this with Balance? your active package will be overwrite')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Pay With Balance')}</a>
{/if}
</div>
{if $_c['enable_balance'] == 'yes' && $_c['allow_balance_transfer'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/send/{$router['id']}/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this for friend account?')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Buy for friend')}</a>
{/if}
</div>
</div>
</div>
{/if}
{/foreach}
</div>
<div class="card-header text-white">{if $_c['pppoe_plan']==''}PPPOE Plan{else}{$_c['pppoe_plan']}{/if}</div>
<div class="card-body row">
{foreach $plans_pppoe as $plan}
{if $router['name'] eq $plan['routers']}
<div class="col-xl-3 col-xxl-4">
<div class="card card- card-primary">
<div class="card-header border-0 pb-0">
<div>
<h4 class="card-title mb-2">{$plan['name_plan']}</h4>
</div>
</div>
<div class="card-body">
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Type')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['type']}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Price')}</span>
<span class="fs-18"><span class="text-black pe-2">{Lang::moneyFormat($plan['price'])}
</div>
<div class="d-flex align-items-end mt-2 pb-3 justify-content-between">
<span>{Lang::T('Validity')}</span>
<span class="fs-18"><span class="text-black pe-2">{$plan['validity']} {$plan['validity_unit']}
</div>
</div>
<div class="card-footer">
<div class="btn-group btn-group-justified" role="group" aria-label="...">
<a href="{$_url}order/gateway/{$router['id']}/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this? your active package will be overwrite')}')"
class="btn btn-outline-primary btn-block btn-lg">Buy</a>
{if $_c['enable_balance'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/pay/{$router['id']}/{$plan['id']}"
onclick="return confirm('{Lang::T('Pay this with Balance? your active package will be overwrite')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Pay With Balance')}</a>
{/if}
</div>
{if $_c['enable_balance'] == 'yes' && $_c['allow_balance_transfer'] == 'yes' && $_user['balance']>=$plan['price']}
<a href="{$_url}order/send/{$router['id']}/{$plan['id']}"
onclick="return confirm('{Lang::T('Buy this for friend account?')}')"
class="btn btn-outline-primary btn-block btn-lg">{Lang::T('Buy for friend')}</a>
{/if}
</div>
</div>
</div>
{/if}
{/foreach}
</div>
{/if}
</div>
</div>
{/if}
{/foreach}
</div>
{include file="sections/user-footer.tpl"}

149
ui/ui/user-orderView.tpl Normal file
View File

@@ -0,0 +1,149 @@
{include file="sections/user-header.tpl"}
<!-- user-orderView -->
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6">
<div
class="card mb20 {if $trx['status']==1}card-warning{elseif $trx['status']==2}card-success{elseif $trx['status']==3}card-danger{elseif $trx['status']==4}card-danger{else}card-primary{/if} card-hovered">
<div class="card-footer">Transaction #{$trx['id']}</div>
{if !in_array($trx['routers'],['balance','radius'])}
<div class="card-body">
<div class="card card-primary card-hovered">
<div class="card-header">{$router['name']}</div>
<div class="card-body">
{$router['description']}
</div>
</div>
</div>
{/if}
<div class="table-responsive">
{if $trx['pg_url_payment']=='balance'}
<table class="table table-bordered table-striped table-bordered">
<tbody>
<tr>
<td>{Lang::T('Type')}</td>
<td>{$trx['plan_name']}</td>
</tr>
<tr>
<td>{Lang::T('Paid Date')}</td>
<td>{date($_c['date_format'], strtotime($trx['paid_date']))}
{date('H:i', strtotime($trx['paid_date']))} </td>
</tr>
<tr>
{if $trx['plan_name'] == 'Receive Balance'}
<td>{Lang::T('From')}</td>
{else}
<td>{Lang::T('To')}</td>
{/if}
<td>{$trx['gateway']}</td>
</tr>
<tr>
<td>{Lang::T('Total')}</td>
<td>{Lang::moneyFormat($trx['price'])}</td>
</tr>
{if $invoice['note']}
<tr>
<td>{Lang::T('Notes')}</td>
<td>
{nl2br($invoice['note'])}
</td>
</tr>
{/if}
</tbody>
</table>
{else}
<table class="table table-bordered table-striped table-bordered">
<tbody>
<tr>
<td>{Lang::T('Status')}</td>
<td>{if $trx['status']==1}{Lang::T('UNPAID')}{elseif $trx['status']==2}{Lang::T('PAID')}{elseif $trx['status']==3}{Lang::T('FAILED')}{elseif $trx['status']==4}{Lang::T('CANCELED')}{else}{Lang::T('UNKNOWN')}{/if}
</td>
</tr>
<tr>
<td>{Lang::T('expired')}</td>
<td>{date($_c['date_format'], strtotime($trx['expired_date']))}
{date('H:i', strtotime($trx['expired_date']))} </td>
</tr>
{if $trx['status']==2}
<tr>
<td>{Lang::T('Paid Date')}</td>
<td>{date($_c['date_format'], strtotime($trx['paid_date']))}
{date('H:i', strtotime($trx['paid_date']))} </td>
</tr>
{/if}
<tr>
<td>{Lang::T('Plan Name')}</td>
<td>{$plan['name_plan']}</td>
</tr>
{if $add_cost>0}
{foreach $bills as $k => $v}
<tr>
<td>{$k}</td>
<td>{Lang::moneyFormat($v)}</td>
</tr>
{/foreach}
<tr>
<td>{Lang::T('Additional Cost')}</td>
<td>{Lang::moneyFormat($add_cost)}</td>
</tr>
{/if}
<tr>
<td>{Lang::T('Plan Price')}{if $add_cost>0}<small> +
{Lang::T('Additional Cost')}{/if}</small></td>
<td
style="font-size: large; font-weight:bolder; font-family: 'Courier New', Courier, monospace; ">
{Lang::moneyFormat($trx['price'])}</td>
</tr>
<tr>
<td>{Lang::T('Type')}</td>
<td>{$plan['type']}</td>
</tr>
{if $plan['type']!='Balance'}
{if $plan['type'] eq 'Hotspot'}
<tr>
<td>{Lang::T('Plan_Type')}</td>
<td>{Lang::T($plan['typebp'])}</td>
</tr>
{if $plan['typebp'] eq 'Limited'}
{if $plan['limit_type'] eq 'Time_Limit' or $plan['limit_type'] eq 'Both_Limit'}
<tr>
<td>{Lang::T('Time_Limit')}</td>
<td>{$ds['time_limit']} {$ds['time_unit']}</td>
</tr>
{/if}
{if $plan['limit_type'] eq 'Data_Limit' or $plan['limit_type'] eq 'Both_Limit'}
<tr>
<td>{Lang::T('Data_Limit')}</td>
<td>{$ds['data_limit']} {$ds['data_unit']}</td>
</tr>
{/if}
{/if}
{/if}
<tr>
<td>{Lang::T('Plan Validity')}</td>
<td>{$plan['validity']} {$plan['validity_unit']}</td>
</tr>
<tr>
<td>{Lang::T('Bandwidth Plans')}</td>
<td>{$bandw['name_bw']}<br>{$bandw['rate_down']}{$bandw['rate_down_unit']}/{$bandw['rate_up']}{$bandw['rate_up_unit']}
</td>
</tr>
{/if}
</tbody>
</table>
{/if}
</div>
{if $trx['status']==1}
<div class="card-footer ">
<div class="btn-group btn-group-justified">
<a href="{$_url}order/view/{$trx['id']}/check"
class="btn btn-info bt-block">{Lang::T('Check for Payment')}</a>
<a href="{$_url}order/view/{$trx['id']}/cancel" class="btn btn-danger bt-block"
onclick="return confirm('{Lang::T('Cancel it?')}')">{Lang::T('Cancel')}</a>
</div>
</div>
{/if}
</div>
</div>
</div>
{include file="sections/user-footer.tpl"}

15
ui/ui/user-pages.tpl Normal file
View File

@@ -0,0 +1,15 @@
{include file="sections/user-header.tpl"}
<!-- user-pages -->
<div class="row">
<div class="col-sm-12">
<div class="card mb20 card-primary card-hovered">
<div class="card-header">{$_L[$pageHeader]}</div>
<div class="card-body">
{include file="$_path/../pages/$PageFile.html"}
</div>
</div>
</div>
</div>
{include file="sections/user-footer.tpl"}

View File

@@ -0,0 +1,80 @@
{include file="sections/user-header.tpl"}
<!-- user-phone-update -->
<div class="box box-danger">
<div class="box-header with-border">
<h3 class="box-title">{Lang::T('Change Phone Number')}</h3>
</div>
<div class="box-body">
<div class="form-horizontal">
<div class="form-group">
<label class="col-md-2 control-label">{Lang::T('Current Number')}</label>
<div class="col-md-6">
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">+</span>
<input type="text" class="form-control" name="phonenumber" id="phonenumber"
value="{$d['phonenumber']}" readonly placeholder="{Lang::T('Phone Number')}">
</div>
</div>
</div>
<form method="post" role="form" action="{$_url}accounts/phone-update-otp">
<div class="form-group">
<label class="col-md-2 control-label">{Lang::T('New Number')}</label>
<div class="col-md-6">
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">+</span>
<input type="number" class="form-control" name="phone" id="phone" value="" required
placeholder="{Lang::T('Input your phone number')}">
<span class="input-group-btn">
<button type="submit" class="btn btn-info btn-flat">{Lang::T('Request OTP')}</button>
</span>
</div>
</div>
</div>
</form>
<form method="post" role="form" action="{$_url}accounts/phone-update-post">
<!-- Form 2 -->
<div class="form-group">
<label class="col-md-2 control-label">{Lang::T('OTP')}</label>
<div class="col-md-6">
<input type="number" class="form-control" id="otp" name="otp"
placeholder="{Lang::T('Enter OTP that was sent to your phone')}" required>
</div>
</div>
<!-- Hidden field to store the phone number value -->
<input type="hidden" name="phone" id="hidden_phone" required>
<div class="form-group">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-success" type="submit"
onclick="return validateForm()">{Lang::T('Update')}</button>
Or <a href="{$_url}home">{Lang::T('Cancel')}</a>
</div>
</div>
</form>
<script>
function validateForm() {
var phoneNumber = document.getElementById("phone").value;
var otp = document.getElementById("otp").value;
if (phoneNumber.trim() === "") {
alert("Phone number is required.");
return false; // Prevent form submission
}
if (otp.trim() === "") {
alert("OTP code is required.");
return false; // Prevent form submission
}
// Set the phone number value in the hidden field
document.getElementById("hidden_phone").value = phoneNumber;
}
</script>
</div>
</div>
</div>
{include file="sections/user-footer.tpl"}

85
ui/ui/user-profile.tpl Normal file
View File

@@ -0,0 +1,85 @@
{include file="sections/user-header.tpl"}
<!-- user-profile -->
<div class="row">
<div class="col-xl-6 col-xxl-12">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">
<div class="card-title mb-2">{Lang::T('Edit User')}</div>
</div>
<div class="card-body">
<form class="form-horizontal" method="post" role="form" action="{$_url}accounts/edit-profile-post">
<input type="hidden" name="id" value="{$d['id']}">
<div class="form-group">
<label class="control-label">{Lang::T('Username')}</label>
<div class="">
<div class="input-group">
<span class="input-group-text" id="basic-addon1">+</span>
<input type="text" class="form-control" name="username" id="username" readonly
value="{$d['username']}"
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']}{/if} {Lang::T('Phone Number')}">
</div>
</div>
</div>
<div class="form-group">
<label class="control-label">{Lang::T('Full Name')}</label>
<div class="input-group mb-2">
<input type="text" class="form-control" id="fullname" name="fullname"
value="{$d['fullname']}">
</div>
</div>
<div class="form-group">
<label class="control-label">{Lang::T('Address')}</label>
<div class="input-group mb-2">
<textarea name="address" id="address" class="form-control">{$d['address']}</textarea>
</div>
</div>
{if $_c['allow_phone_otp'] != 'yes'}
<div class="form-group">
<label class="control-label">{Lang::T('Phone Number')}</label>
<div class="mb-2">
<div class="input-group">
<span class="input-group-text" id="basic-addon1">+</span>
<input type="text" class="form-control" name="phonenumber" id="phonenumber"
value="{$d['phonenumber']}"
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']}{/if} {Lang::T('Phone Number')}">
</div>
</div>
</div>
{else}
<div class="form-group">
<label class="control-label">{Lang::T('Phone Number')}</label>
<div class="mb-2">
<div class="input-group">
<span class="input-group-text" id="basic-addon1">+</span>
<input type="text" class="form-control" name="phonenumber" id="phonenumber"
value="{$d['phonenumber']}" readonly
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']}{/if} {Lang::T('Phone Number')}">
<span class="input-group-text">
<a href="{$_url}accounts/phone-update" type="button"
class="">{Lang::T('Change')}</a>
</span>
</div>
</div>
</div>
{/if}
<div class="form-group">
<label class="control-label">{Lang::T('Email')}</label>
<div class="input-group mb-2">
<input type="text" class="form-control" id="email" name="email" value="{$d['email']}">
</div>
</div>
<div class="form-group">
<div class="">
<button class="btn btn-success" type="submit">
{Lang::T('Save Changes')}</button>
Or <a href="{$_url}home" class="btn btn-primary">{Lang::T('Cancel')}</a>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
{include file="sections/user-footer.tpl"}

View File

@@ -0,0 +1,77 @@
{include file="sections/user-header.tpl"}
<div class="row">
<div class="col-xl-6 col-xxl-12">
<div class="card card-info card-hovered">
<div class="card-header">{Lang::T('Available Payment Gateway')}</div>
<div class="card-footer">
<form method="post" action="{$_url}order/buy/{$route2}/{$route3}">
<div class="form-group row">
<label class="col-md-2 control-label">Payment Gateway</label>
<div class="col-md-8">
<select name="gateway" id="gateway" class="form-control">
{foreach $pgs as $pg}
<option value="{$pg}">
{ucwords($pg)}</option>
{/foreach}
</select>
</div>
</div>
</div>
<div class="card-body">
<center><b>{Lang::T('Package Details')}</b></center>
<ul class="list-group list-group-unbordered">
<li class="list-group-item">
<b>{Lang::T('Plan Name')}</b> <span class="pull-right">{$plan['name_plan']}</span>
</li>
{if $plan['is_radius'] or $plan['routers']}
<li class="list-group-item">
<b>{Lang::T('Location')}</b> <span class="pull-right">{if
$plan['is_radius']}Radius{else}{$plan['routers']}{/if}</span>
</li>
{/if}
<li class="list-group-item">
<b>{Lang::T('Type')}</b> <span class="pull-right">{if $plan['prepaid'] eq
'yes'}Prepaid{else}Postpaid{/if}
{$plan['type']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Plan Price')}</b> <span class="pull-right">{if $using eq
'zero'}{Lang::moneyFormat(0)}{else}{Lang::moneyFormat($plan['price'])}{/if}</span>
</li>
{if $plan['validity']}
<li class="list-group-item">
<b>{Lang::T('Plan Validity')}</b> <span class="pull-right">{$plan['validity']}
{$plan['validity_unit']}</span>
</li>
{/if}
</ul>
<center><b>{Lang::T('Summary')}</b></center>
<ul class="list-group list-group-unbordered">
{if $tax}
<li class="list-group-item">
<b>{Lang::T('Tax')}</b> <span
class="pull-right">{Lang::moneyFormat($tax)}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Total')}</b> <small>({Lang::T('Plan Price')} + {Lang::T('Tax')})</small><span class="pull-right"
style="font-size: large; font-weight:bolder; font-family: 'Courier New', Courier, monospace; ">{Lang::moneyFormat($plan['price']+$tax)}</span>
</li>
{else}
<li class="list-group-item">
<b>{Lang::T('Total')}</b> <span class="pull-right"
style="font-size: large; font-weight:bolder; font-family: 'Courier New', Courier, monospace; ">
{Lang::moneyFormat($plan['price'])}</span>
</li>
{/if}
</ul>
<center>
<button type="submit" class="btn btn-primary">{Lang::T('Pay Now')}</button><br>
<a class="btn btn-link" href="{$_url}home">{Lang::T('Cancel')}</a>
</center>
</form>
</div>
</div>
</div>
</div>
{include file="sections/user-footer.tpl"}

67
ui/ui/user-sendPlan.tpl Normal file
View File

@@ -0,0 +1,67 @@
{include file="sections/user-header.tpl"}
<!-- user-orderView -->
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6">
<div class="box box-solid box-default">
<div class="box-header">{$plan['name_plan']}</div>
<div class="table-responsive">
<table class="table table-bordered table-striped">
<tbody>
<tr>
<td>{Lang::T('Type')}</td>
<td>{$plan['type']}</td>
</tr>
{if $add_cost>0}
{foreach $bills as $k => $v}
<tr>
<td>{$k}</td>
<td>{Lang::moneyFormat($v)}</td>
</tr>
{/foreach}
<tr>
<td>{Lang::T('Additional Cost')}</td>
<td>{Lang::moneyFormat($add_cost)}</td>
</tr>
{/if}
{if $tax > 0}
<tr>
<td>{Lang::T('Tax')}</td>
<td>{Lang::moneyFormat($tax)}</td>
</tr>
{/if}
<tr>
<td>{Lang::T('Price')}{if $add_cost>0}<small> + {Lang::T('Additional Cost')}{/if}{if
$tax>0}<small> + {Lang::T('Tax')}{/if}</td>
<td
style="font-size: large; font-weight:bolder; font-family: 'Courier New', Courier, monospace; ">
{Lang::moneyFormat($plan['price'])}</td>
</tr>
<tr>
<td>{Lang::T('Validity')}</td>
<td>{$plan['validity']} {$plan['validity_unit']}</td>
</tr>
</tbody>
</table>
</div>
<div class="box-footer">
<form method="post" onsubmit="return askConfirm()" role="form">
<div class="form-group">
<div class="col-sm-9">
<input type="text" id="username" name="username" class="form-control" required
value="{$username}" placeholder="Y123456789">
</div>
<div class="form-group col-sm-3" align="center">
<button class="btn btn-success btn-block" id="sendBtn" type="submit" name="send"
onclick="return confirm('{Lang::T(" Are You Sure?")}')" value="plan"><i
class="glyphicon glyphicon-send"></i></button>
</div>
</div>
<p class="help-block text-center">{Lang::T('If your friend have Additional Cost, you will pay for
that too')}</p>
</form>
</div>
</div>
</div>
</div>
{include file="sections/user-footer.tpl"}

123
ui/ui/users-add.tpl Normal file
View File

@@ -0,0 +1,123 @@
{include file="sections/header.tpl"}
<!-- user-edit -->
<div class="container-fluid">
<form class="form-horizontal" method="post" role="form" action="{$_url}settings/users-post">
<div class="row">
<div class="col-sm-6 col-md-6">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">{Lang::T('Profile')}</div>
<div class="card-body">
<div class="form-group">
<label class="control-label">{Lang::T('Full Name')}</label>
<div class="">
<input type="text" class="form-control" id="fullname" name="fullname">
</div>
</div>
<div class="form-group">
<label class=" control-label">{Lang::T('Phone')}</label>
<div class="">
<input type="number" class="form-control" id="phone" name="phone">
</div>
</div>
<div class="form-group">
<label class="control-label">{Lang::T('Email')}</label>
<div class="">
<input type="text" class="form-control" id="email" name="email">
</div>
</div>
<div class="form-group row">
<label class="control-label">{Lang::T('Location')}</label>
<div class="col-md-4">
<input type="text" class="form-control" id="city" name="city" placeholder="{Lang::T('City')}">
</div>
<div class="col-md-4">
<input type="text" class="form-control" id="subdistrict" name="subdistrict" placeholder="{Lang::T('Sub District')}">
</div>
<div class="col-md-4">
<input type="text" class="form-control" id="ward" name="ward" placeholder="{Lang::T('Ward')}">
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-6">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header">{Lang::T('Credentials')}</div>
<div class="card-body">
<div class="form-group">
<label class="control-label">{Lang::T('User Type')}</label>
<div class="">
<select name="user_type" id="user_type" class="form-control" onchange="checkUserType(this)">
{if $_admin['user_type'] eq 'Agent'}
<option value="Sales">{Lang::T('Sales')}</option>
{/if}
{if $_admin['user_type'] eq 'Admin' || $_admin['user_type'] eq 'SuperAdmin'}
<option value="Report">{Lang::T('Report Viewer')}</option>
<option value="Agent">{Lang::T('Agent')}</option>
<option value="Sales">{Lang::T('Sales')}</option>
{/if}
{if $_admin['user_type'] eq 'SuperAdmin'}
<option value="Admin">{Lang::T('Administrator')}</option>
<option value="SuperAdmin">{Lang::T('Super Administrator')}</option>
{/if}
</select>
</div>
</div>
<div class="form-group hidden" id="agentChooser">
<label class="control-label">{Lang::T('Agent')}</label>
<div class="">
<select name="root" id="root" class="form-control">
{foreach $agents as $agent}
<option value="{$agent['id']}">{$agent['username']} | {$agent['fullname']} | {$agent['phone']}</option>
{/foreach}
</select>
</div>
</div>
<div class="row">
<div class="form-group col-md-6">
<label class="control-label">{Lang::T('Username')}</label>
<div class="">
<input type="text" class="form-control" id="username" name="username">
</div>
</div>
<div class="form-group col-md-6">
<label class="control-label">{Lang::T('Password')}</label>
<div class="">
<input type="password" class="form-control" id="password" value="{rand(000000,999999)}" name="password"
onmouseleave="this.type = 'password'" onmouseenter="this.type = 'text'">
</div>
</div>
</div>
<div class="form-group">
<label class=" control-label">{Lang::T('Send Notification')}</label>
<div class=>
<select name="send_notif" id="send_notif" class="form-control">
<option value="-">Don't Send</option>
<option value="sms">By SMS</option>
<option value="wa">By WhatsApp</option>
</select>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="form-group text-center">
<button class="btn btn-primary" type="submit">{Lang::T('Save Changes')}</button>
Or <a href="{$_url}settings/users">{Lang::T('Cancel')}</a>
</div>
</form>
</div>
{literal}
<script>
function checkUserType($field){
if($field.value=='Sales'){
$('#agentChooser').removeClass('hidden');
}else{
$('#agentChooser').addClass('hidden');
}
}
</script>
{/literal}
{include file="sections/footer.tpl"}

144
ui/ui/users-edit.tpl Normal file
View File

@@ -0,0 +1,144 @@
{include file="sections/header.tpl"}
<!-- user-edit -->
<div class="container-fluid">
<form class="form-horizontal" method="post" role="form" action="{$_url}settings/users-edit-post">
<div class="row">
<div class="col-sm-6 col-md-6">
<div
class="card card-{if $d['status'] != 'Active'}danger{else}primary{/if} card-hovered card-stacked mb30">
<div class="card-header">{Lang::T('Profile')}</div>
<div class="card-body">
<input type="hidden" name="id" value="{$d['id']}">
<div class="form-group">
<label class=" control-label">{Lang::T('Full Name')}</label>
<div class="">
<input type="text" class="form-control" id="fullname" name="fullname"
value="{$d['fullname']}">
</div>
</div>
<div class="form-group">
<label class="control-label">{Lang::T('Phone')}</label>
<div class="">
<input type="number" class="form-control" id="phone" name="phone" value="{$d['phone']}">
</div>
</div>
<div class="form-group">
<label class=" control-label">{Lang::T('Email')}</label>
<div class="">
<input type="text" class="form-control" id="email" name="email" value="{$d['email']}">
</div>
</div>
<div class="form-group row">
<div class="col-md-4">
<input type="text" class="form-control" id="city" name="city"
placeholder="{Lang::T('City')}" value="{$d['city']}">
</div>
<div class="col-md-4">
<input type="text" class="form-control" id="subdistrict" name="subdistrict"
placeholder="{Lang::T('Sub District')}" value="{$d['subdistrict']}">
</div>
<div class="col-md-4">
<input type="text" class="form-control" id="ward" name="ward"
placeholder="{Lang::T('Ward')}" value="{$d['ward']}">
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-6">
<div
class="card card-{if $d['status'] != 'Active'}danger{else}primary{/if} card-hovered card-stacked mb30">
<div class="card-header">{Lang::T('Credentials')}</div>
<div class="card-body">
{if ($_admin['id']) neq ($d['id'])}
<div class="form-group">
<label class=" control-label">{Lang::T('Status')}</label>
<div class="">
<select name="status" id="status" class="form-control">
<option value="Active" {if $d['status'] eq 'Active'}selected="selected" {/if}>
Active</option>
<option value="Inactive" {if $d['status'] eq 'Inactive'}selected="selected" {/if}>
Inactive</option>
</select>
</div>
</div>
<div class="form-group">
<label class=" control-label">{Lang::T('User Type')}</label>
<div class="">
<select name="user_type" id="user_type" class="form-control" onchange="checkUserType(this)">
{if $_admin['user_type'] eq 'Agent'}
<option value="Sales" {if $d['user_type'] eq 'Sales'}selected="selected" {/if}>Sales
</option>
{/if}
{if $_admin['user_type'] eq 'Admin' || $_admin['user_type'] eq 'SuperAdmin'}
<option value="Report" {if $d['user_type'] eq 'Report'}selected="selected" {/if}>Report
Viewer</option>
<option value="Agent" {if $d['user_type'] eq 'Agent'}selected="selected" {/if}>Agent
</option>
<option value="Sales" {if $d['user_type'] eq 'Sales'}selected="selected" {/if}>Sales
</option>
{/if}
{if $_admin['user_type'] eq 'SuperAdmin'}
<option value="Admin" {if $d['user_type'] eq 'Admin'}selected="selected" {/if}>
Administrator</option>
<option value="SuperAdmin" {if $d['user_type'] eq 'SuperAdmin'}selected="selected"
{/if}>Super Administrator</option>
{/if}
</select>
</div>
</div>
<div class="form-group {if $d['user_type'] neq 'Sales'}hidden{/if}" id="agentChooser">
<label class=" control-label">{Lang::T('Agent')}</label>
<div class="">
<select name="root" id="root" class="form-control">
{foreach $agents as $agent}
<option value="{$agent['id']}">{$agent['username']} | {$agent['fullname']} | {$agent['phone']}</option>
{/foreach}
</select>
</div>
</div>
{/if}
<div class="form-group">
<label class="control-label">{Lang::T('Username')}</label>
<div class="">
<input type="text" class="form-control" id="username" name="username"
value="{$d['username']}">
</div>
</div>
<div class="form-group">
<label class="control-label">{Lang::T('Password')}</label>
<div class="">
<input type="password" class="form-control" id="password" name="password">
<span class="help-block">{Lang::T('Keep Blank to do not change Password')}</span>
</div>
</div>
<div class="form-group">
<label class=" control-label">{Lang::T('Password')}</label>
<div class=>
<input type="password" class="form-control" id="cpassword" name="cpassword"
placeholder="{Lang::T('Confirm Password')}">
<span class="help-block">{Lang::T('Keep Blank to do not change Password')}</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="form-group text-center">
<button class="btn btn-primary" type="submit">{Lang::T('Save Changes')}</button>
Or <a href="{$_url}settings/users">{Lang::T('Cancel')}</a>
</div>
</form>
{literal}
<script>
function checkUserType($field){
if($field.value=='Sales'){
$('#agentChooser').removeClass('hidden');
}else{
$('#agentChooser').addClass('hidden');
}
}
</script>
{/literal}
{include file="sections/footer.tpl"}

72
ui/ui/users-view.tpl Normal file
View File

@@ -0,0 +1,72 @@
{include file="sections/header.tpl"}
<!-- user-edit -->
<div class="container-fluid">
<div class="col-sm-12 col-md-12">
<form class="form-horizontal">
<div class="row">
{if $d['user_type'] == "Sales"}<div class="col-sm-6 col-md-6">{else}<div class="col-md-6 col-md-offset-3">{/if}
<div
class="card card-{if $d['status'] != 'Active'}danger{else}primary{/if} panel-hovered panel-stacked mb30">
<div class="card-header">{$d['fullname']}</div>
<div class="card-body">
<ul class="list-group list-group-unbordered">
<li class="list-group-item">
<b>{Lang::T('Username')}</b> <span class="pull-right">{$d['username']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Phone Number')}</b> <span class="pull-right">{$d['phone']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Email')}</b> <span class="pull-right">{$d['email']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('City')}</b> <span class="pull-right">{$d['city']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Sub District')}</b> <span class="pull-right">{$d['subdistrict']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Ward')}</b> <span class="pull-right">{$d['ward']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('User Type')}</b> <span class="pull-right">{$d['user_type']}</span>
</li>
</ul>
</div>
<div class="card-footer">
<center><a href="{$_url}settings/users-edit/{$d['id']}"
class="btn btn-info btn-block">{Lang::T('Edit')}</a>
<a href="{$_url}settings/users" class="btn btn-link btn-block">{Lang::T('Cancel')}</a>
</center>
</div>
</div>
</div>
{if $d['user_type'] == "Sales" && $d['root'] neq ''}
<div class="col-sm-6 col-md-6">
<div class="panel panel-success">
<div class="panel-heading">Agent - {$agent['fullname']}</div>
<div class="panel-body">
<ul class="list-group list-group-unbordered">
<li class="list-group-item">
<b>{Lang::T('Phone Number')}</b> <span class="pull-right"><a href="tel:{$agent['phone']}">{$agent['phone']}</a></span>
</li>
<li class="list-group-item">
<b>{Lang::T('Email')}</b> <span class="pull-right"><a href="mailto:{$agent['email']}">{$agent['email']}</a></span>
</li>
<li class="list-group-item">
<b>{Lang::T('City')}</b> <span class="pull-right">{$agent['city']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Sub District')}</b> <span class="pull-right">{$agent['subdistrict']}</span>
</li>
<li class="list-group-item">
<b>{Lang::T('Ward')}</b> <span class="pull-right">{$agent['ward']}</span>
</li>
</ul>
</div>
</div>
</div>
{/if}
</div>
</form>
{include file="sections/footer.tpl"}

81
ui/ui/users.tpl Normal file
View File

@@ -0,0 +1,81 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card card-hovered mb20 card-primary">
<div class="card-header">
<h3 class="card-title">{Lang::T('Manage Administrator')}</h3>
</div>
<div class="card-body">
<div class="md-whiteframe-z1 mb20 text-center row" style="padding: 15px">
<div class="col-md-8">
<form id="site-search" method="post" action="{$_url}settings/users/">
<div class="input-group">
<div class="input-group-text">
<span class="fa fa-search"></span>
</div>
<input type="text" name="search" value="{$search}" class="form-control"
placeholder="Search by Username...">
<button class="btn btn-success input-group-btn" type="submit">{Lang::T('Search')}</button>
<!-- <div class="input-group-btn">
</div> -->
</div>
</form>
</div>
<div class="col-md-4">
<a href="{$_url}settings/users-add" class="btn btn-primary btn-block"><i
class="fa fa-add"> </i> {Lang::T('Add New Administrator')}</a>
</div>&nbsp;
</div>
<div class="table-responsive">
<table class="table table-bordered table-striped table-condensed">
<thead>
<tr>
<th>{Lang::T('Username')}</th>
<th>{Lang::T('Full Name')}</th>
<th>{Lang::T('Phone')}</th>
<th>{Lang::T('Email')}</th>
<th>{Lang::T('Type')}</th>
<th>{Lang::T('Location')}</th>
<th>{Lang::T('Agent')}</th>
<th>{Lang::T('Last Login')}</th>
<th>{Lang::T('Manage')}</th>
<th>ID</th>
</tr>
</thead>
<tbody>
{foreach $d as $ds}
<tr {if $ds['status'] != 'Active'}class="danger"{/if}>
<td>{$ds['username']}</td>
<td>{$ds['fullname']}</td>
<td>{$ds['phone']}</td>
<td>{$ds['email']}</td>
<td>{$ds['user_type']}</td>
<td>{$ds['city']}, {$ds['subdistrict']}, {$ds['ward']}</td>
<td>{if $ds['root']}
<a href="{$_url}settings/users-view/{$ds['root']}">
{$admins[$ds['root']]}</a>{/if}</td>
<td>{if $ds['last_login']}{Lang::timeElapsed($ds['last_login'])}{/if}</td>
<td>
<a href="{$_url}settings/users-view/{$ds['id']}"
class="btn btn-success btn-xs mb-1">{Lang::T('View')}</a>
<a href="{$_url}settings/users-edit/{$ds['id']}"
class="btn btn-info btn-xs mb-1">{Lang::T('Edit')}</a>
{if ($_admin['id']) neq ($ds['id'])}
<a href="{$_url}settings/users-delete/{$ds['id']}" id="{$ds['id']}"
class="btn btn-danger btn-xs" onclick="return confirm('{Lang::T('Delete')}?')"><i class="fa fa-trash"></i></a>
{/if}
</td>
<td>{$ds['id']}</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{include file="pagination.tpl"}
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}

252
ui/ui/voucher-add.tpl Normal file
View File

@@ -0,0 +1,252 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-md-8 col-lg-6">
<div class="card card-primary card-hovered card-stacked mb30">
<div class="card-header" style="display: grid; align-content: center; justify-content: center; padding: 15px;">
<h5 class="card-title" style="margin: 0; font-size: 18px;">{Lang::T('Add Vouchers')}</h5>
</div>
<div class="card-body" style="padding: 20px;">
<div class="alert alert-info" style="margin-bottom: 20px;">
<i class="fa fa-info-circle"></i> <strong>{Lang::T('How it works')}:</strong>
{Lang::T('Select the service type (Hotspot/PPPoE), then choose a router, and finally select from available internet plans to generate vouchers.')}
</div>
<form class="form-horizontal" method="post" role="form" action="{$_url}plan/voucher-post">
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Type')}</label>
<div class="col-md-8">
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" id="Hot" name="type" value="Hotspot" required>
<label class="form-check-label" for="Hot">{Lang::T('Hotspot Plans')}</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" id="POE" name="type" value="PPPOE" required>
<label class="form-check-label" for="POE">{Lang::T('PPPOE Plans')}</label>
</div>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Routers')}</label>
<div class="col-md-8">
<select id="server" name="server" class="form-select" style="height: 40px; background-color: white; cursor: pointer; z-index: 1000;" required>
<option value=''>{Lang::T('Select Routers')}</option>
</select>
<span class="help-block" id="server-help">
{Lang::T('Select service type first to load available routers')}
</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Service Plan')}</label>
<div class="col-md-8">
<select id="plan" name="plan" class="form-select" style="height: 40px; background-color: white; cursor: pointer; z-index: 1000;" required>
<option value=''>{Lang::T('Select Plans')}</option>
</select>
<span class="help-block" id="plan-help">
{Lang::T('Select a router and type first to load available plans')}
</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Number of Vouchers')}</label>
<div class="col-md-8">
<input type="number" class="form-control" name="numbervoucher" value="1" min="1" max="1000" required>
<span class="help-block">{Lang::T('Enter the number of vouchers to generate (1-1000)')}</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Voucher Format')}</label>
<div class="col-md-8">
<select name="voucher_format" id="voucher_format" class="form-select" style="height: 40px; background-color: white;">
<option value="up" {if $_c['voucher_format'] == 'up'}selected="selected"{/if}>UPPERCASE</option>
<option value="low" {if $_c['voucher_format'] == 'low'}selected="selected"{/if}>lowercase</option>
<option value="rand" {if $_c['voucher_format'] == 'rand'}selected="selected"{/if}>RaNdoM</option>
</select>
<span class="help-block">{Lang::T('Choose the case format for voucher codes')}</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Voucher Prefix')}</label>
<div class="col-md-8">
<input type="text" class="form-control" name="prefix" placeholder="NUX-" value="{$_c['voucher_prefix']}" maxlength="10">
<span class="help-block">{Lang::T('Optional prefix for voucher codes (e.g., NUX-)')}</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-4 control-label">{Lang::T('Length Code')}</label>
<div class="col-md-8">
<input type="number" class="form-control" name="lengthcode" value="12" min="6" max="20" required>
<span class="help-block">{Lang::T('Length of the voucher code (6-20 characters)')}</span>
</div>
</div>
<div class="form-group row">
<div class="col-md-12 text-center">
<button class="btn btn-success" type="submit">
<i class="fa fa-plus"></i> {Lang::T('Generate Vouchers')}
</button>
<a href="{$_url}plan/voucher" class="btn btn-secondary">
<i class="fa fa-times"></i> {Lang::T('Cancel')}
</a>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function() {
// Auto-select Hotspot by default and load servers
$('#Hot').prop('checked', true).trigger('change');
// Load servers when type changes
$('input[type=radio][name="type"]').change(function(){
$("#server-help").text('Loading routers...');
$("#plan-help").text('Select a router first to load available plans');
if ($('#Hot').is(':checked')) {
$.ajax({
type: "POST",
dataType: "html",
url: "index.php?_route=autoload/server",
success: function(msg){
console.log('Servers loaded successfully');
console.log('Servers HTML:', msg);
$("#server").html(msg);
// Ensure the dropdown is enabled
$("#server").prop('disabled', false);
// Check if servers were loaded
var serverCount = $("#server option").length - 1; // Subtract 1 for the default option
console.log('Server count:', serverCount);
if (serverCount > 0) {
$("#server-help").text('Found ' + serverCount + ' router(s) available');
} else {
$("#server-help").text('No routers found. Please add routers first.');
}
},
error: function(xhr, status, error) {
console.error('Error loading servers:', error);
$("#server-help").text('Error loading routers. Please check console for details.');
alert('Error loading servers. Please check console for details.');
}
});
} else if ($('#POE').is(':checked')) {
$.ajax({
type: "POST",
dataType: "html",
url: "index.php?_route=autoload/server",
success: function(msg){
console.log('Servers loaded successfully');
console.log('Servers HTML:', msg);
$("#server").html(msg);
// Ensure the dropdown is enabled
$("#server").prop('disabled', false);
// Check if servers were loaded
var serverCount = $("#server option").length - 1; // Subtract 1 for the default option
console.log('Server count:', serverCount);
if (serverCount > 0) {
$("#server-help").text('Found ' + serverCount + ' router(s) available');
} else {
$("#server-help").text('No routers found. Please add routers first.');
}
},
error: function(xhr, status, error) {
console.error('Error loading servers:', error);
$("#server-help").text('Error loading routers. Please check console for details.');
alert('Error loading servers. Please check console for details.');
}
});
}
});
// Load plans when server changes
$("#server").change(function(){
var server = $("#server").val();
var jenis = $('input[name="type"]:checked').val();
console.log('Server changed:', server, 'Type:', jenis);
if (server && jenis) {
$("#plan-help").text('Loading plans...');
$.ajax({
type: "POST",
dataType: "html",
url: "index.php?_route=autoload/plan",
data: "jenis=" + jenis + "&server=" + server,
success: function(msg){
console.log('Plans loaded successfully');
console.log('Plans HTML:', msg);
$("#plan").html(msg);
// Ensure the dropdown is enabled and clickable
$("#plan").prop('disabled', false);
$("#plan").removeClass('disabled');
// Check if plans were loaded
var planCount = $("#plan option").length - 1; // Subtract 1 for the default option
console.log('Plan count:', planCount);
if (planCount > 0) {
$("#plan-help").text('Found ' + planCount + ' plan(s) available');
} else {
$("#plan-help").text('No plans found for this router and type. Please create plans first.');
}
},
error: function(xhr, status, error) {
console.error('Error loading plans:', error);
$("#plan-help").text('Error loading plans. Please check console for details.');
alert('Error loading plans. Please check console for details.');
}
});
} else {
$("#plan-help").text('Select a router and type first to load available plans');
}
});
// Add click handler for debugging
$("#plan").click(function(){
console.log('Plan dropdown clicked');
console.log('Plan dropdown disabled:', $(this).prop('disabled'));
console.log('Plan dropdown options:', $(this).find('option').length);
});
// Form validation
$('form').on('submit', function(e) {
var type = $('input[name="type"]:checked').val();
var server = $('#server').val();
var plan = $('#plan').val();
var number = $('input[name="numbervoucher"]').val();
if (!type) {
alert('{Lang::T("Please select a type")}');
e.preventDefault();
return false;
}
if (!server) {
alert('{Lang::T("Please select a router")}');
e.preventDefault();
return false;
}
if (!plan) {
alert('{Lang::T("Please select a plan")}');
e.preventDefault();
return false;
}
if (number < 1 || number > 1000) {
alert('{Lang::T("Number of vouchers must be between 1 and 1000")}');
e.preventDefault();
return false;
}
});
});
</script>
{include file="sections/footer.tpl"}

41
ui/ui/voucher-view.tpl Normal file
View File

@@ -0,0 +1,41 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-md-6 col-sm-12 col-md-offset-3">
<div class="card card-hovered card-primary card-stacked mb30">
<div class="card-body">
<form class="form-horizontal" method="post" action="{$_url}plan/print" target="_blank">
<pre id="content"></pre>
<textarea class="hidden" id="formcontent" name="content">{$print}</textarea>
<input type="hidden" name="id" value="{$in['id']}">
<div class="row">
<a href="{$_url}plan/voucher" class="btn btn-success btn-sm mb-2"><i
class="fa fa-reply-all"></i>{Lang::T('Finish')}</a>
<a href="https://api.whatsapp.com/send/?text={$whatsapp}" target="_blank"
class="btn btn-primary btn-sm mb-2">
<i class="fa fa-share"></i> WhatsApp</a>
<button type="submit" class="btn btn-info btn-sm"><i class="fa fa-print"></i>
Print</button>
<!-- <a href="nux://print?text={urlencode($print)}"
class="btn btn-success text-black btn-sm hidden-md hidden-lg">
<i class="fa fa-phone"></i>
Print
</a>
<a href="https://github.com/hotspotbilling/android-printer"
class="btn btn-success text-black btn-sm hidden-xs hidden-sm" target="_blank">
<i class="fa fa-phone"></i>
NuxPrint
</a> -->
</div>
</form>
<javascript type="text/javascript">
</javascript>
</div>
</div>
</div>
</div>
<script type="text/javascript">
document.getElementById('content').innerHTML = document.getElementById('formcontent').innerHTML;
</script>
</div>
{include file="sections/footer.tpl"}

113
ui/ui/voucher.tpl Normal file
View File

@@ -0,0 +1,113 @@
{include file="sections/header.tpl"}
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="card card-hovered mb20 card-primary">
<div class="card-header">
{if in_array($_admin['user_type'],['SuperAdmin','Admin'])}
<div class="btn-group pull-right">
<a class="btn btn-danger btn-xs" title="Remove used Voucher" href="{$_url}plan/remove-voucher"
onclick="return confirm('Delete all used voucher code?')"><span
class="fa fa-trash" aria-hidden="true"></span> Delete All</a>
</div>
{/if}
&nbsp;
</div>
<div class="card-body">
<div class="md-whiteframe-z1 mb20 text-center row">
<div class="col-md-8 mb-3">
<form id="site-search" method="post" action="{$_url}plan/voucher/">
<div class="input-group">
<div class="input-group-text">
<span class="fa fa-search"></span>
</div>
<input type="text" name="search" class="form-control" placeholder="{Lang::T('Search by Code Voucher')}..." value="{$search}">
<button class="btn btn-success input-group-btn" type="submit">{Lang::T('Search')}</button>
<!-- <div class="">
</div> -->
</div>
</form>
</div>
<div class="col-md-4">
<div class="btn-group btn-group-justified mb-3" role="group">
<div class="btn-group" role="group">
<a href="{$_url}plan/add-voucher" class="btn btn-primary btn-block"><i class="ion ion-android-add"></i> {Lang::T('Add Vouchers')}</a>
</div>
</div>
<div class="btn-group btn-group-justified" role="group">
<div class="btn-group" role="group">
<a href="{$_url}plan/print-voucher" target="print_voucher" class="btn btn-info btn-block"><i class="ion ion-android-print"></i> Print</a>
</div>
</div>
</div>&nbsp;
</div>
<div class="table-responsive">
<table id="datatable" class="table table-bordered table-striped table-condensed">
<thead>
<tr>
<th>ID</th>
<th>{Lang::T('Type')}</th>
<th>{Lang::T('Routers')}</th>
<th>{Lang::T('Plan Name')}</th>
<th>{Lang::T('Code Voucher')}</th>
<th>{Lang::T('Status Voucher')}</th>
<th>{Lang::T('Customer')}</th>
<th>{Lang::T('Generated By')}</th>
<th>{Lang::T('Manage')}</th>
</tr>
</thead>
<tbody>
{foreach $d as $ds}
<tr {if $ds['status'] eq '1'}class="danger" {/if}>
<td>{$ds['id']}</td>
<td>{$ds['type']}</td>
<td>{$ds['routers']}</td>
<td>{$ds['name_plan']}</td>
<td style="background-color: black; color: black;"
onmouseleave="this.style.backgroundColor = 'black';"
onmouseenter="this.style.backgroundColor = 'white';">
{$ds['code']}</td>
<td>{if $ds['status'] eq '0'} <label class="btn-tag btn-tag-success">Not
Use</label> {else} <label class="btn-tag btn-tag-danger">Used</label>
{/if}</td>
<td>{if $ds['user'] eq '0'} -
{else}<a href="{$_url}customers/viewu/{$ds['user']}">{$ds['user']}</a>
{/if}</td>
<td>{if $ds['generated_by']}
<a
href="{$_url}settings/users-view/{$ds['generated_by']}">{$admins[$ds['generated_by']]}</a>
{else} -
{/if}
</td>
<td>
{if $ds['status'] neq '1'}
<a href="{$_url}plan/voucher-view/{$ds['id']}" id="{$ds['id']}"
style="margin: 0px;"
class="btn btn-success btn-xs mb-2">&nbsp;&nbsp;{Lang::T('View')}&nbsp;&nbsp;</a>
{/if}
{if in_array($_admin['user_type'],['SuperAdmin','Admin'])}
<a href="{$_url}plan/voucher-delete/{$ds['id']}" id="{$ds['id']}"
class="btn btn-danger btn-xs"
onclick="return confirm('{Lang::T('Delete')}?')"><i
class="fa fa-trash"></i></a>
{/if}
</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
<ul class="pagination pagination-sm">
{if $page>0}
<li><a href="{$_url}plan/voucher&p={$page-1}&code={$_code}">{Lang::T('Prev')}</a></li>
{/if}
{if $d}
<li><a href="{$_url}plan/voucher&p={$page+1}&code={$_code}">{Lang::T('Next')}</a></li>
{/if}
</ul>
</div>
</div>
</div>
</div>
</div>
{include file="sections/footer.tpl"}