added messages list, new client form, logic for client Apps plus others

This commit is contained in:
Kwesi Banson Jnr
2026-03-22 22:29:28 +00:00
parent c68c007945
commit 4ab0fda326
858 changed files with 242393 additions and 337 deletions

View File

@@ -0,0 +1,52 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CML Client Portal | Reset Password</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css">
<style>
body { background-color: #f8f9fa; }
.reset-container { margin-top: 100px; max-width: 400px; }
</style>
</head>
<body>
<!-- Kwesi the Grey -->
<div class="container d-flex justify-content-center">
<div class="reset-container w-100">
<div class="card shadow-sm">
<div class="card-body p-4">
<div class="text-center mb-4">
<h3 class="fw-bold">Account Activation Form</h3>
<p class="text-muted">Fill the form to activate your account</p>
</div>
@include('commons.notifications')
<form action="{{ url('client-activation') }}" method="POST">
@csrf
<input type="hidden" name="hash" value="{{ $hash }}">
<div class="mb-3">
<label for="password" class="form-label">Password</label>
<input type="password" class="form-control form-control-lg" id="password" name="password" placeholder="***********" required autofocus>
</div>
<div class="mb-3">
<label for="passwordConfirm" class="form-label">Confirm Password</label>
<input type="password" class="form-control form-control-lg" id="passwordConfirm" name="password_confirmation" placeholder="***********" required autofocus>
</div>
<div class="d-grid gap-2">
<button type="submit" class="btn btn-primary btn-lg">Submit</button>
</div>
</form>
</div>
</div>
<div class="text-center mt-3 text-muted small">
&copy; Click Mobile SMS Client Portal
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

View File

@@ -0,0 +1,44 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CML Client Portal | Reset Password</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css">
<style>
body { background-color: #f8f9fa; }
.reset-container { margin-top: 100px; max-width: 400px; }
</style>
</head>
<body>
<div class="container d-flex justify-content-center">
<div class="reset-container w-100">
<div class="card shadow-sm">
<div class="card-body p-4">
<div class="text-center mb-4">
<h3 class="fw-bold">Fail </h3>
<p class="text-muted">Your activation link has expired. Kindly request for a new one</p>
</div>
<!-- <div class="text-center mt-4">
<a class="text-decoration-none small text-muted">
<i class="bi bi-arrow-left"></i> Back to Login
</a>
</div> -->
</div>
</div>
<div class="text-center mt-3 text-muted small">
&copy; Click Mobile SMS Client Portal
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

View File

@@ -39,7 +39,7 @@
</div>
<div class="text-center mt-3 text-muted small">
&copy; LUPMIS 2.0
&copy; Click Mobile SMS Client Portal
</div>
</div>
</div>

View File

@@ -12,6 +12,7 @@
<div class="container d-flex justify-content-center align-items-center vh-100">
<div class="card shadow-sm p-4" style="width: 100%; max-width: 400px;">
<h3 class="text-center mb-4">Login</h3>
@include('commons.notifications')
<form action="{{ url('client-login') }}" method="POST">
@csrf
<!-- Email -->
@@ -33,7 +34,7 @@
<button type="submit" class="btn btn-primary w-100">Login</button>
</form>
<div class="text-center mt-3">
<small>Don't have an account? <a href="#">Sign up</a></small>
<!-- <small>Don't have an account? <a href="#">Sign up</a></small> -->
</div>
</div>
</div>

View File

@@ -18,10 +18,10 @@
<div class="row g-4 align-items-center">
<div class="col-lg-6">
<section class="auth-panel h-100">
<div class="brand-chip mb-4">
<!-- <div class="brand-chip mb-4">
<i class="bi bi-broadcast-pin"></i>
SMS Traffic Portal
</div>
</div> -->
<img src="{{ url('public/assets/images/click-logo.png') }}" alt="Click Mobile" class="brand-logo mb-4">
<h1 class="display-6 fw-semibold mb-3">Monitor delivery traffic with a cleaner client experience.</h1>
<p class="fs-5 opacity-75 mb-4">
@@ -72,14 +72,14 @@
<h2 class="h3 mb-1">Welcome back</h2>
<!-- <p class="text-secondary mb-0">Sign in to review SMS traffic and delivery logs.</p> -->
</div>
<span class="badge text-bg-light rounded-pill px-3 py-2">Click Mobile</span>
<!-- <span class="badge text-bg-light rounded-pill px-3 py-2">Click Mobile</span> -->
</div>
<form class="" action="{{ url('client-login') }}" method="POST">
@csrf
<div class="mb-3">
<label for="companyEmail" class="form-label fw-semibold">Email</label>
<input type="email" class="form-control" id="companyEmail" placeholder="client@click-mobile.com" value="ops@click-mobile.com" autocomplete="">
<input type="email" name="email" class="form-control" id="companyEmail" placeholder="client@click-mobile.com" value="" autocomplete="">
</div>
<div class="mb-3">
@@ -88,7 +88,7 @@
<span class="input-group-text bg-white border-end-0 rounded-start-4">
<i class="bi bi-shield-lock"></i>
</span>
<input type="password" class="form-control border-start-0 rounded-end-4" id="password" placeholder="Enter password" autocomplete="current-password">
<input type="password" name="password" class="form-control border-start-0 rounded-end-4" id="password" placeholder="Enter password" autocomplete="current-password">
</div>
</div>
@@ -99,12 +99,12 @@
Keep me signed in
</label>
</div> -->
<a href="#" class="text-decoration-none fw-semibold">Forgot password?</a>
<!-- <a href="#" class="text-decoration-none fw-semibold">Forgot password?</a> -->
</div>
<div class="d-grid gap-3">
<button type="submit" class="btn btn-click">Sign in to portal</button>
<a href="" class="btn btn-ghost">Request account access</a>
<a href="" class="btn btn-ghost">Contact Support to Request account</a>
</div>
</form>

View File

@@ -36,7 +36,7 @@
</div>
<div class="text-center mt-3 text-muted small">
&copy; LUPMIS 2.0
&copy; Click Mobile SMS Client Portal
</div>
</div>
</div>

View File

@@ -47,7 +47,7 @@
</div>
<div class="text-center mt-3 text-muted small">
&copy; LUPMIS 2.0
&copy; Click Mobile SMS Client Portal
</div>
</div>
</div>

View File

@@ -43,7 +43,7 @@
</div>
<div class="text-center mt-3 text-muted small">
&copy; LUPMIS 2.0
&copy; Click Mobile SMS Client Portal
</div>
</div>
</div>

View File

@@ -0,0 +1,87 @@
@extends('layouts.master')
@section('page-title')
{{ $page_title }}
@endsection
@section('page-css')
@section('content')
<section class="row g-4">
<div class="col-xl-9">
<div class="filter-card mb-4">
<div class="d-flex flex-column flex-lg-row align-items-lg-center justify-content-between gap-3 mb-3">
<div>
<h2 class="h4 mb-1">App List</h2>
<!-- <p class="text-secondary mb-0">Filter messages by date, sender, recipient, or delivery state.</p> -->
</div>
</div>
</div>
<div class="traffic-table-card">
<div class="table-responsive">
<table class="table align-middle mb-0">
<thead>
<tr>
<th scope="col">App Name</th>
<th scope="col">Type</th>
<th scope="col">Api Key</th>
<th scope="col">Date Created</th>
</tr>
</thead>
<tbody>
@if(count($apps_arr->content) > 0)
@foreach($apps_arr->content as $row)
<tr>
<td class="fw-semibold">{{ $row->name}}</td>
<td class="recipient-cell">
<div class="fw-semibold">{{ $row->type}}</div>
</td>
<td><i class="bi bi-eye" id="viewApiKeyIcon"></i></td>
<td>
{{ \Carbon\Carbon::parse($row->createdAt)->format('Y-m-d H:i:s') }}
</td>
</tr>
@endforeach
@else
<tr>
<td colspan="6" class="text-center">No records</td>
</tr>
@endif
</tbody>
</table>
</div>
</div>
</div>
<div class="col-xl-3">
<aside class="detail-card">
<h2 class="h5 mb-3">Recent activity</h2>
<div class="timeline-item pt-0 mt-0 border-0">
<div class="fw-semibold">Sender ID approved</div>
<div class="muted-label">CLICKINFO added </div>
<div class="small text-secondary mt-1">09:04</div>
</div>
<!-- <div class="timeline-item">
<div class="fw-semibold">Retry queue triggered</div>
<div class="muted-label">42 Zambia messages re-routed after timeout</div>
<div class="small text-secondary mt-1">08:57</div>
</div> -->
<div class="timeline-item">
<div class="fw-semibold">Campaign completed</div>
<div class="muted-label">[campaign name] batch finished</div>
<div class="small text-secondary mt-1">08:41</div>
</div>
</aside>
</div>
</section>
@endsection
@section('page-js')
<script>
</script>
@endsection

View File

@@ -0,0 +1,225 @@
@extends('layouts.master')
@section('page-title')
{{ $page_title }}
@endsection
@section('page-css')
<!-- <link href="https://unpkg.com/tabulator-tables@6.4.0/dist/css/tabulator.min.css" rel="stylesheet"> -->
<link href="{{ url('public/libs/tabulator-master/dist/css/tabulator_bootstrap5.css') }}" rel="stylesheet">
@endsetion
@section('content')
<section class="traffic-hero mb-4">
<div class="row g-4 align-items-end">
<div class="col-lg-8">
<div class="text-uppercase small fw-semibold opacity-75 mb-2">SMS Traffic Monitoring</div>
<!-- <h1 class="display-6 fw-semibold mb-3">Track every message your team sends.</h1>
<p class="fs-5 opacity-75 mb-0">
Search sent SMS, review delivery outcomes, inspect failed attempts, and give clients a fast audit trail for every campaign.
</p> -->
</div>
<div class="col-lg-4"></div>
</div>
</section>
<section class="row g-4">
<div class="col-xl-9">
<div class="filter-card mb-4">
<div class="d-flex flex-column flex-lg-row align-items-lg-center justify-content-between gap-3 mb-3">
<div>
<h2 class="h4 mb-1">Sent SMS list</h2>
<!-- <p class="text-secondary mb-0">Filter messages by date, sender, recipient, or delivery state.</p> -->
</div>
<!-- <div class="d-flex flex-wrap gap-2">
<button class="btn btn-ghost px-4"><i class="bi bi-download me-2"></i>Export CSV</button>
<button class="btn btn-click px-4"><i class="bi bi-funnel me-2"></i>Apply filters</button>
</div> -->
</div>
<div class="row g-3">
<div class="col-md-12">
<div class="float-end">
<label for="search" class="form-label fw-semibold">Search</label>
<input id="search" type="text" class="form-control" placeholder="Phone, sender ID, text">
</div>
</div>
</div>
</div>
<div class="traffic-table-card">
<div class="p-1">
<button id="download-pdf" class="btn btn-danger"><i class="bi bi-file-pdf-fill me-2"></i> Export PDF</button>
<button id="download-xlsx" class="btn btn-success"><i class="bi bi-file-excel-fill me-2"></i> Export Excel</button>
</div>
<div id="message-table"></div>
</div>
</div>
<div class="col-xl-3">
<aside class="detail-card">
<h2 class="h5 mb-3">Recent activity</h2>
<div class="timeline-item pt-0 mt-0 border-0">
<div class="fw-semibold">Sender ID approved</div>
<div class="muted-label">CLICKINFO added </div>
<div class="small text-secondary mt-1">09:04</div>
</div>
<div class="timeline-item">
<div class="fw-semibold">Campaign completed</div>
<div class="muted-label">[campaign name] batch finished</div>
<div class="small text-secondary mt-1">08:41</div>
</div>
</aside>
</div>
</section>
@endsection
@section('page-js')
<!-- <script src="https://unpkg.com/tabulator-tables@6.4.0/dist/js/tabulator.min.js"></script> -->
<script src="{{ url('public/libs/tabulator-master/dist/js/tabulator.min.js') }}"></script>
<script src="https://unpkg.com/jspdf@latest/dist/jspdf.umd.min.js"></script>
<script type="text/javascript" src="https://cdn.sheetjs.com/xlsx-0.20.3/package/dist/xlsx.full.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/luxon@2.3.1/build/global/luxon.min.js"></script>
<script>
// var table = new Tabulator("#message-table", {
// ajaxURL: base_url + "/client-traffic-tabulator/",
// ajaxResponse: function(url, params, response) {
// return response.content;
// },
// columns: [
// {title: "Sender ID", field: "from"},
// {title: "Msisdn", field: "to"},
// {title: "Message", field: "message"},
// {title: "Status", field: "status"},
// {title: "Delivery Status", field: "deliveryStatus"},
// // {title: "Created At", field: "createdAt"},
// {title:"Date Created ", field:"createdAt", formatter:"datetime", formatterParams:{
// inputFormat: "iso",
// outputFormat: "dd-MM-yyyy HH:mm:ss",
// invalidPlaceholder: "(invalid date)"
// }}
// ],
// });
// document.getElementById("download-pdf").addEventListener("click", function(){
// table.download("pdf", "messages.pdf", {
// orientation:"portrait", // portrait or landscape
// title:"Messages Export", // document title
// });
// });
// document.getElementById("download-xlsx").addEventListener("click", function(){
// table.download("xlsx", "messages.xlsx", {sheetName:"Messages"});
// });
</script>
<script>
function statusDesign (cell, formatterParams){
var value = cell.getValue();
// if(value === 'Approved'){
// console.log(value !== null);
if (value !== null) {
if(value.includes('SENT')){
return "<span style='color:#3FB449; font-weight:bold;'>" + value + "</span>";
}
// else if(value.includes('Active')){
// return "<span style='color:#3FB449; font-weight:bold;'>" + value + "</span>";
// }
else{
return "<span style='color:#E4A11B;'>" + value + "</span>";
}
}
}
var table = new Tabulator("#message-table", {
ajaxURL: base_url + "/client-traffic-tabulator/",
ajaxParams: {size: 20},
pagination: "remote",
paginationSize: 20,
paginationDataSent: {
"page": "page",
"size": "size"
},
paginationDataReceived: {
"last_page": "totalPages",
"data": "content",
"current_page": "number",
"total": "totalElements"
},
ajaxResponse: function(url, params, response) {
return response.content;
},
columns: [
{title: "Sender", field: "from"},
{title: "Msisdn", field: "to"},
// {title: "Message", field: "message"},
{title:"Message", field:"message" ,formatter:"textarea"},
// {title: "Status", field: "status"},
{title: "Delivery Status", field: "deliveryStatus", formatter: statusDesign},
// {title: "Created At", field: "createdAt"},
{title:"Date Created ", field:"createdAt", formatter:"datetime", formatterParams:{
inputFormat: "iso",
outputFormat: "dd-MM-yyyy HH:mm:ss",
invalidPlaceholder: "(invalid date)"
}}
],
});
</script>
<script>
// var table = new Tabulator("#message-table", {
// ajaxURL: base_url + "/client-traffic-tabulator/",
// pagination: "remote",
// paginationSize: 20,
// paginationDataSent: {
// "page": "page",
// "size": "size"
// },
// paginationDataReceived: {
// "last_page": "totalPages",
// "data": "content",
// "current_page": "number",
// "total": "totalElements"
// },
// // Sorting configuration
// ajaxSorting: true,
// sortMode: "remote",
// ajaxRequestFunc: function(url, config, params) {
// let query = {
// page: params.page - 1,
// size: params.size,
// };
// if (params.sorters && params.sorters.length > 0) {
// let sorter = params.sorters[0];
// query.sort = sorter.field + "," + sorter.dir;
// // Laravel/Spring style: ?sort=createdAt,asc
// }
// // Build query string
// let qs = Object.keys(query)
// .map(k => encodeURIComponent(k) + "=" + encodeURIComponent(query[k]))
// .join("&");
// return url + "?" + qs;
// },
// ajaxResponse: function(url, params, response) {
// return response.content;
// },
// columns: [
// {title: "ID", field: "id", sorter: "number"},
// {title: "Client ID", field: "clientId", sorter: "number"},
// {title: "From", field: "from", sorter: "string"},
// {title: "To", field: "to", sorter: "string"},
// {title: "Message", field: "message", sorter: "string"},
// {title: "Status", field: "status", sorter: "string"},
// {title: "Delivery Status", field: "deliveryStatus", sorter: "string"},
// {title: "Created At", field: "createdAt", sorter: "datetime"},
// ],
// });
</script>
@endsection

View File

@@ -7,7 +7,7 @@
<section class="traffic-hero mb-4">
<div class="row g-4 align-items-end">
<div class="col-lg-8">
<div class="text-uppercase small fw-semibold opacity-75 mb-2">Outbound SMS Monitoring</div>
<div class="text-uppercase small fw-semibold opacity-75 mb-2">SMS Traffic Monitoring</div>
<!-- <h1 class="display-6 fw-semibold mb-3">Track every message your team sends.</h1>
<p class="fs-5 opacity-75 mb-0">
Search sent SMS, review delivery outcomes, inspect failed attempts, and give clients a fast audit trail for every campaign.
@@ -85,16 +85,16 @@
<div class="d-flex flex-column flex-lg-row align-items-lg-center justify-content-between gap-3 mb-3">
<div>
<h2 class="h4 mb-1">Sent SMS list</h2>
<p class="text-secondary mb-0">Filter messages by date, sender, recipient, or delivery state.</p>
<!-- <p class="text-secondary mb-0">Filter messages by date, sender, recipient, or delivery state.</p> -->
</div>
<div class="d-flex flex-wrap gap-2">
<!-- <div class="d-flex flex-wrap gap-2">
<button class="btn btn-ghost px-4"><i class="bi bi-download me-2"></i>Export CSV</button>
<button class="btn btn-click px-4"><i class="bi bi-funnel me-2"></i>Apply filters</button>
</div>
</div> -->
</div>
<div class="row g-3">
<div class="col-md-6 col-lg-3">
<!-- <div class="col-md-6 col-lg-3">
<label for="range" class="form-label fw-semibold">Date range</label>
<select id="range" class="form-select">
<option>Today</option>
@@ -118,10 +118,14 @@
<option>Pending</option>
<option>Failed</option>
</select>
</div>
<div class="col-md-6 col-lg-3">
<label for="search" class="form-label fw-semibold">Search</label>
<input id="search" type="text" class="form-control" placeholder="Phone, message ID, text">
</div> -->
<div class="col-md-12">
<div class="float-end">
<label for="search" class="form-label fw-semibold">Search</label>
<input id="search" type="text" class="form-control" placeholder="Phone, sender ID, text">
</div>
</div>
</div>
</div>
@@ -140,7 +144,7 @@
</tr>
</thead>
<tbody>
@if($traffic_arr)
@if(count($traffic_arr->content) > 0)
@foreach($traffic_arr->content as $row)
<tr>
<td class="fw-semibold">{{ $row->refId}}</td>
@@ -156,6 +160,10 @@
<td><span class="status-badge status-delivered">{{ $row->deliveryStatus }}</span></td>
</tr>
@endforeach
@else
<tr>
<td colspan="6" class="text-center">No records</td>
</tr>
@endif
</tbody>
</table>
@@ -174,13 +182,6 @@
<div class="muted-label">CLICKINFO added </div>
<div class="small text-secondary mt-1">09:04</div>
</div>
<!-- <div class="timeline-item">
<div class="fw-semibold">Retry queue triggered</div>
<div class="muted-label">42 Zambia messages re-routed after timeout</div>
<div class="small text-secondary mt-1">08:57</div>
</div> -->
<div class="timeline-item">
<div class="fw-semibold">Campaign completed</div>
<div class="muted-label">[campaign name] batch finished</div>

View File

@@ -0,0 +1,38 @@
<div class="modal fade" id="newApplicationModal" tabindex="-1" aria-labelledby="newApplicationModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="newApplicationModalLabel">New Application</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<form id="clientNewAppForm" action="{{ url('client-newapp') }}" method="POST">
@csrf
<input type="hidden" name="orgId" value="{{ session('current_user.org_id') }}">
<div class="mb-3">
<label for="applicationName" class="col-form-label">Application Name</label>
<input type="text" class="form-control" placeholder="e.g. My SMS App" name="application_name" id="applicationName" required>
</div>
<div class="mb-3">
<label for="applicationName" class="col-form-label">Application Type</label>
<select class="form-control" id="applicationType" name="application_type" required>
<option value="" selected disabled>-- Select --</option>
<option value="INTERNATIONAL">International</option>
<option value="LOCAL">Local</option>
</select>
</div>
<div class="mb-3">
<div class="d-grid gap-2">
<button type="submit" class="btn btn-primary">Submit</button>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<!-- <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> -->
</div>
</div>
</div>
</div>

View File

@@ -4,7 +4,6 @@
@endsection
@section('page-css')
@section('content')
<section class="traffic-hero mb-4">
<div class="row g-4 align-items-end">
<div class="col-lg-8">
@@ -42,13 +41,15 @@
<h2 class="h3 mb-1">Compose message</h2>
<p class="text-secondary mb-0">Set campaign details, recipients, and delivery rules before sending.</p>
</div>
@include('commons.notifications')
<!-- <div class="d-flex flex-wrap gap-2">
<span class="option-chip active"><i class="bi bi-lightning-charge"></i>Send now</span>
<span class="option-chip"><i class="bi bi-calendar-event"></i>Schedule</span>
</div> -->
</div>
<form>
<form action="send-sms" method="POST" enctype="multipart/form-data">
@csrf
<!-- <div class="row g-3 mb-4">
<div class="col-md-6">
<label for="campaignName" class="form-label fw-semibold">Campaign name</label>
@@ -71,14 +72,20 @@
</select>
</div>
</div> -->
<div class="mb-4">
<div class="d-flex flex-column flex-lg-row align-items-lg-center justify-content-between gap-2 mb-2">
<label class="form-label fw-semibold mb-0">Sender ID</label>
<span class="muted-label">Not more than 11 characters</span>
</div>
<input type="text" name="sender_id" class="form-control">
</div>
<div class="mb-4">
<div class="d-flex align-items-center justify-content-between mb-2">
<label for="messageText" class="form-label fw-semibold mb-0">Message content</label>
<span class="muted-label">54 / 160 characters</span>
<span class="muted-label" id="messageCounter">54 / 160 characters</span>
</div>
<textarea id="messageText" class="form-control py-3" rows="5">Dear customer, grow your savings with our new fixed plan. Visit any branch today.</textarea>
<div class="char-progress mt-3"><span></span></div>
<textarea id="messageText" name="message" class="form-control py-3" rows="5" placeholder="message body goes here"></textarea>
<!-- <div class="char-progress mt-3"><span></span></div> -->
</div>
<div class="mb-4">
@@ -87,15 +94,24 @@
<span class="muted-label">Paste numbers(comma separated) or upload CSV</span>
</div>
<div class="recipient-box">
<span class="recipient-tag"><i class="bi bi-telephone"></i>+233245559001</span>
<!-- <input type="textarea" rows="8" name="pasted"> -->
<textarea name="pasted" class="form-control" rows="6"></textarea>
<!-- <span class="recipient-tag"><i class="bi bi-telephone"></i>+233245559001</span>
<span class="recipient-tag"><i class="bi bi-telephone"></i>+233502287744</span>
<span class="recipient-tag"><i class="bi bi-telephone"></i>+265884412280</span>
<span class="recipient-tag"><i class="bi bi-people"></i>Retail Savers Segment</span>
<span class="recipient-tag"><i class="bi bi-people"></i>Retail Savers Segment</span> -->
</div>
<div class="mb-3 recipient-box mt-2">
<label for="formFile" class="form-label">Upload your file</label>
<input type="file" id="formFile" name="recipients_file" class="d-none">
<div id="dropZone" class="rounded border border-primary p-4 text-center">
Click to select a file or drag and drop here
</div>
</div>
</div>
<div class="row g-3 mb-4">
<div class="col-md-6">
<!-- <div class="row g-3 mb-4">
<div class="col-md-12">
<label for="deliveryWindow" class="form-label fw-semibold">Delivery window</label>
<select id="deliveryWindow" class="form-select">
<option>Immediately</option>
@@ -104,19 +120,12 @@
<option>15:00 - 18:00</option>
</select>
</div>
<div class="col-md-6">
<label for="failover" class="form-label fw-semibold">Retry policy</label>
<select id="failover" class="form-select">
<option>Retry once after 5 minutes</option>
<option>Retry twice after 10 minutes</option>
<option>No retries</option>
</select>
</div>
</div>
</div> -->
<div class="d-flex flex-column flex-lg-row gap-3">
<button type="button" class="btn btn-click flex-grow-1"><i class="bi bi-send me-2"></i>Send SMS campaign</button>
<button type="button" class="btn btn-ghost flex-grow-1"><i class="bi bi-floppy me-2"></i>Save draft</button>
<button type="submit" class="btn btn-click flex-grow-1"><i class="bi bi-send me-2"></i>Send SMS campaign</button>
<!-- <button type="button" class="btn btn-ghost flex-grow-1"><i class="bi bi-floppy me-2"></i>Save draft</button> -->
</div>
</form>
</div>
@@ -126,9 +135,30 @@
</section>
</div>
@endsection
@endsection
@section('page-js')
<script>
const dropZone = document.getElementById('dropZone');
const formFile = document.getElementById('formFile');
dropZone.addEventListener('click', () => {
formFile.click(); // Trigger the hidden input click
});
formFile.addEventListener('change', () => {
if (formFile.files.length > 0) {
dropZone.textContent = formFile.files[0].name; // Update the drop zone text
} else {
dropZone.textContent = 'Click to select a file or drag and drop here';
}
});
$(document).ready(function(){
$('#messageText').keyup(function(){
characterCount = $(this).val().length;
messagePages = Math.ceil(characterCount/160);
$('#messageCounter').html(characterCount + " character " + messagePages + " messages");
});
});
</script>

View File

@@ -1,46 +0,0 @@
@extends('layouts.app')
@section('content')
<div class="container mt-5">
<h2>{{ isset($comment) ? 'Edit comment' : 'Manager Comment Section' }}</h2>
@include('commons.notifications')
<form action="{{ isset($comment) ? route('comments.update', $comment->id) : route('comments.store') }}" method="POST">
<input type="hidden" name="user_id" value="{{ \Auth::user()->id }}">
@csrf
@if (isset($comment_body))
@method('PUT')
@endif
<div class="card w-100">
<div class="card-body">
<h3>Project Details</h3>
<h5 class="card-title">{{ $project_arr->project->name }}</h5>
<p class="card-text">{{ $project_arr->project->description }} </p>
</div>
</div>
<hr>
<h3>Latest Update</h3>
<table class="table">
<thead>
<tr>
<th scope="col">Status Description</th>
<th scope="col">Current Status</th>
<th scope="col">Date Updated</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{ $project_arr->description }}</td>
<td>{{ $project_arr->status }}</td>
<td>{{ $project_arr->created_at }}</td>
</tr>
</tbody>
</table>
<hr>
<div class="mb-3">
<label for="commnetBody" class="form-label">Comment Body</label>
<textarea class="form-control" id="commnetBody" name="comment_body" rows="4" required>{{ $comment->body ?? '' }}</textarea>
</div>
<button type="submit" class="btn btn-primary">Create comment</button>
</form>
</div>
@endsection

View File

@@ -1,51 +0,0 @@
@extends('layouts.app')
@section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-md-10">
@include('commons.notifications')
<div class="card">
<div class="card-header">{{ __('Projects') }}</div>
<div class="card-body">
@if (session('status'))
<div class="alert alert-success" role="alert">
{{ session('status') }}
</div>
@endif
<div class="float-end">
<a href="/projects/create" class="btn btn-primary btn-sm">Add Projects</a>
</div>
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Name</th>
<th scope="col">Description</th>
<th scope="col">Status</th>
<th scope="col">Date Created</th>
<th scope="col">Action</th>
</tr>
</thead>
<tbody>
<?php $count = 1; ?>
@foreach($projects as $row)
<tr>
<th scope="row">{{ $count }}</th>
<td>{{ $row->name }}</td>
<td>{{ $row->description }}</td>
<td>{{ $row->status }}</td>
<td>{{ $row->created_at }}</td>
<td><a href="{{ url('project-status/add_status', $row->id)}}" class="btn btn-link">Add Status</a></td>
</tr>
<?php $count++; ?>
@endforeach
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
@endsection

View File

@@ -0,0 +1,31 @@
<!DOCTYPE html>
<html>
<head>
<title>Client Portail Account Activation</title>
</head>
<body>
<h2>Account Activation</h2>
<p>Your SMS Client Portal has been successfully created. Use the link below set your password and activate your account.</p>
<ol>
<li>URL: https://clientportal.clicktechteam.com</li>
<li>{{ url('client-activation', $activation_hash) }} </li>
</ol>
<tr>
<td>
<table class="footer" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation">
<tr>
<td class="content-cell" align="center">
<!-- Your custom HTML content goes here -->
<p style="font-family: sans-serif; font-size: 12px; color: #aeaeae; text-align: center;">
&copy; {{ date('Y') }} [{{ 'Click Mobile' }}](https://click-mobile.com). All rights reserved.
</p>
</td>
</tr>
</table>
</td>
</tr>
</body>
</html>

View File

@@ -7,7 +7,7 @@
<!-- CSRF Token -->
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>Project Status Reporting</title>
<title>Client Portal</title>
<!-- Fonts -->
<link rel="dns-prefetch" href="//fonts.bunny.net">

View File

@@ -12,6 +12,7 @@
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css" rel="stylesheet">
<link href="{{ url('public/assets/css/theme.css') }}" rel="stylesheet">
<link href="{{ url('public/libs/jquery-confirm/jquery-confirm.min.css') }}" rel="stylesheet">
@yield('page-css')
<script type="text/javascript">
@@ -19,6 +20,7 @@
</script>
</head>
<body>
@include('client-traffic.partials.new-app')
<div class="container py-3 py-lg-4">
<header class="topbar">
<div class="topbar-card d-flex flex-column flex-lg-row align-items-lg-center justify-content-between gap-3">
@@ -26,14 +28,24 @@
<img src="{{ url('public/assets/images/click-logo.png') }}" alt="Click Mobile" class="brand-logo">
<div>
<div class="small text-uppercase text-primary fw-semibold">Client Portal</div>
<div class="fw-semibold">SMS traffic overview</div>
<div class="fw-semibold">{{ session('current_user.name') }}</div>
</div>
</div>
<div class="d-flex flex-wrap align-items-center gap-2">
<span class="badge rounded-pill text-bg-light px-3 py-2">{{ session('current_user.name') }}</span>
<!-- <span class="badge rounded-pill text-bg-light px-3 py-2">{{ session('current_user.name') }}</span> -->
<!-- <span class="badge rounded-pill text-bg-light px-3 py-2"><i class="bi bi-clock-history me-1"></i> Last sync 09:12</span> -->
<a href="{{ url('send-sms') }}" class="btn btn-click px-4"><i class="bi bi-plus-circle me-2"></i>New SMS</a>
<a href="index.html" class="btn btn-ghost px-4">Log out</a>
@if($page_title == 'SMS Traffic')
<a href="{{ url('send-sms') }}" class="btn btn-click px-4"><i class="bi bi-plus-circle me-2"></i>New SMS</a>
@else
<a href="{{ url('client-traffic') }}" class="btn btn-click px-4"><i class="bi bi-chat-right-text me-2"></i>Messages</a>
@endif
@if($page_title == 'Applications')
<a href="{{ url('new-app') }}" class="btn btn-clicksuccess px-4" data-bs-toggle="modal" data-bs-target="#newApplicationModal"><i class="bi bi-plus-square me-2"></i>New App</a>
@else
<a href="{{ url('client-apps') }}" class="btn btn-clicksuccess px-4"><i class="bi bi-list-ul me-2"></i>App List</a>
@endif
<a href="{{ url('client-logout') }} " class="btn btn-ghost px-4">Log out</a>
</div>
</div>
</header>
@@ -43,6 +55,43 @@
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
<!-- <script src="{{ url('public/libs/jquery-3.2.1.min.js') }}"></script>
<script src="{{ url('public/libs/jquery-confirm/jquery-confirm.min.js') }}"></script> -->
@yield('page-js')
<script>
const myForm = document.getElementById('clientNewAppForm');
myForm.addEventListener('submit', function(e) {
// 2. Stop the page reload
e.preventDefault();
// 3. Extract data from the form
const formData = new FormData(this);
const formAction = $(this).attr("action");
// Convert to JSON if your API requires it (common for modern backends)
const data = Object.fromEntries(formData.entries());
// 4. Execute the AJAX (Fetch) request
fetch(formAction, {
method: 'POST',
headers: {
'Content-Type': 'application/json', // Inform server of JSON content
'Accept': 'application/json' // Expect JSON response
},
body: JSON.stringify(data)
})
.then(response => response.json())
.then(result => {
console.log('Success:', result);
// 5. Optional: Close modal or show success message
alert('Data submitted successfully!');
})
.catch(error => {
console.error('Error:', error);
});
});
</script>
</body>
</html>

View File

@@ -1,31 +0,0 @@
@extends('layouts.app')
@section('content')
<div class="container mt-5">
<h2>{{ 'Add Project Status' }}</h2>
@include('commons.notifications')
<form action="{{ isset($project_status) ? route('project-status.update', $project_status->id) : route('project-status.store') }}" method="POST">
<input type="hidden" name="assignee_id" value="{{ \Auth::user()->id }}">
<input type="hidden" name="project_id" value="{{ $project->id }}">
@csrf
<div class="mb-3">
<label for="description" class="form-label">Description</label>
<textarea class="form-control" name="description" id="description" rows="4" required></textarea>
</div>
<div class="mb-3">
<label for="status" class="form-label">Status</label>
<select class="form-select" id="status" name="status" required>
<option value="" disabled>-- Select Status--</option>
<option value="Pending">Pending</option>
<option value="In Progress">In Progress</option>
<option value="Completed">Completed</option>
</select>
</div>
<button type="submit" class="btn btn-primary">{{ 'Add Status' }}</button>
</form>
</div>
@endsection

View File

@@ -1,55 +0,0 @@
@extends('layouts.app')
@section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-md-10">
@include('commons.notifications')
<div class="card">
<div class="card-header">{{ __('Project Status Reports') }}</div>
<div class="card-body">
@if (session('status'))
<div class="alert alert-success" role="alert">
{{ session('status') }}
</div>
@endif
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Project</th>
<th scope="col">Status Description</th>
<th scope="col">Current Status</th>
<th scope="col">Date Updated</th>
<th scope="col">Action</th>
</tr>
</thead>
<tbody>
<?php $count = 1; ?>
@foreach($project_statuses as $row)
<tr>
<th scope="row">{{ $count }}</th>
<td>{{ $row->project->name }}</td>
<td>{{ $row->description }}</td>
<td>{{ $row->status }}</td>
<td>{{ $row->created_at }}</td>
<td>
<a href="{{ url('comments/add_comment', $row->id)}}" title="Add Comments" class="btn btn-success btn-sm"><i class="bi bi-plus-circle"></i> Add Comment</a>
<!-- <a href="{{ url('project-status/add_status', $row->id)}}" title="Add New Status" class="btn "></a> -->
</td>
</tr>
<?php $count++; ?>
@endforeach
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
@endsection