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

@@ -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>