Add feat unsold commodity notifications

This commit is contained in:
Afiq Hamzah
2024-05-27 15:04:38 +08:00
parent bfda43022a
commit c61c9a3c7d
5 changed files with 225 additions and 0 deletions
@@ -8,6 +8,7 @@ use Illuminate\Support\Facades\Session;
use Illuminate\Support\Facades\Http;
use Illuminate\Support\Facades\Storage;
use Carbon\Carbon;
use Illuminate\Support\Arr;
class TetapanController extends Controller
{
@@ -41,4 +42,19 @@ class TetapanController extends Controller
$payable_cawangan = json_decode( Http::get(config('api.url').'/api/payable-ujrah-branches')->json() );
return view('tetapan.payable-ujrah-branches',compact('api_url','auth_user', 'payable_cawangan'));
}
public function unsoldCommodityNotification()
{
$api_url = config('api.url');
$auth_user = Auth::user();
$settings = Http::get(config('api.url').'/api/settings/unsold-commodity-notifications')->json();
$key = Arr::pluck($settings, 'key');
$values = Arr::pluck($settings, 'value');
$settings = array_combine($key, $values);
return view('tetapan.unsold-commodity-notifications',compact('api_url','auth_user', 'settings'));
}
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 9.6 KiB

+5
View File
@@ -57,6 +57,11 @@
<h2 class="mx-auto text-center font-bold text-2xl mt-4 uppercase">Ubah Status Pembayaran Ujrah</h2>
</a>
<a href="{{ route('tetapan.unsold-commodity-notifications') }}" class="bg-white shadow px-6 py-4 border border-solid rounded-lg w-1/6 hover:bg-yellow-300 hover:transition-all cursor-pointer transition transform hover:-translate-y-1 ml-5">
<img src="{{ asset('img/notifications.png') }}" class="h-40 mx-auto text-center" alt="Windster Logo" img-from="https://www.flaticon.com/free-icons/megaphone">
<h2 class="mx-auto text-center font-bold text-2xl mt-4 uppercase">Notifikasi Jualan Komoditi</h2>
</a>
</div>
@@ -0,0 +1,203 @@
@extends('layouts.app')
@section('content')
<div class="bg-gray-900 opacity-50 hidden fixed inset-0 z-10" id="sidebarBackdrop"></div>
<div id="main-content" class="h-full w-full bg-gray-50 relative overflow-y-auto">
<main>
<div class="pt-6 px-4">
<breadcrumb :items="[{ 'title' : 'Unsold Commodity Notifications', 'icon' : 'fas fa-globe-asia' }]"></breadcrumb>
<div class="flex justify-center">
<div class="w-1/2 bg-white rounded-xl shadow-md overflow-hidden mb-5">
<div class="flex justify-left">
<div class="p-8 w-full">
<div>
<label for="message" class="block text-lg font-medium text-gray-700 mb-2">Notification Status</label>
<label for="toggle" class="flex items-center cursor-pointer">
<div class="mr-3 text-gray-700 font-medium">
OFF
</div>
<div class="relative">
<input type="checkbox" id="toggle" class="sr-only" name="status" {{ $settings['status'] === '1' ? 'checked' : ''}} />
<div class="w-10 h-4 bg-gray-400 rounded-full shadow-inner"></div>
<div class="dot absolute w-6 h-6 bg-white rounded-full shadow -left-1 -top-1 transition"></div>
</div>
<div class="ml-3 text-gray-700 font-medium">
ON
</div>
</label>
<div class="w-full max-w-md flex pt-10">
<div class="w-1/2 pr-5">
<label for="start-time" class="block text-lg font-medium text-gray-700 mb-2">Start Time</label>
<input type="time" id="start-time" name="start-time" class="w-full p-4 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 bg-white" value="{{ $settings['start_time'] ?? '' }}">
</div>
<div class="w-1/2">
<label for="end-time" class="block text-lg font-medium text-gray-700 mb-2">End Time</label>
<input type="time" id="end-time" name="end-time" class="w-full p-4 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 bg-white" value="{{ $settings['end_time'] ?? '' }}">
</div>
</div>
<div class="w-full max-w-md pt-10">
<label for="message" class="block text-lg font-medium text-gray-700 mb-2">Notification Message</label>
<textarea id="message" name="message" rows="6" class="w-full p-4 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 bg-white resize-none">{{ $settings['message'] ?? '' }}</textarea>
</div>
<button class="bg-yellow-500 hover:bg-yellow-600 text-white font-bold py-2 px-4 rounded update-notification-setting mt-5">Update Notification Settings</button>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
@include('layouts.footer')
@endsection
@push('additional_scripts')
<script>
document.addEventListener("DOMContentLoaded", function() {
});
</script>
<script>
document.addEventListener("DOMContentLoaded", function() {
let button_update_notification_setting = document.querySelector('button.update-notification-setting');
function sendToApi(data) {
let api_url = "{{ $api_url }}";
return fetch(api_url + '/api/settings/unsold-commodity-notifications', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json'
},
body: JSON.stringify(data)
})
.then(response => response.json())
.catch((error) => {
console.error('Error:', error);
});
}
function handleClick(event) {
event.preventDefault();
const status = document.querySelector('input[name="status"]');
const startTime = document.querySelector('input[name="start-time"]');
const endTime = document.querySelector('input[name="end-time"]');
const message = document.querySelector('textarea[name="message"]');
let data = {
'status' : status.checked,
'start_time' : startTime.value,
'end_time' : endTime.value,
'message' : message.value,
};
if (status.checked) {
let checkEmpty = x => x.trim() === '';
let is_input_incomplete = [startTime.value, endTime.value, message.value].map(x => checkEmpty(x))
.some(x => x === true);
if (is_input_incomplete) {
alert('Anda telah pilih untuk buka notifikasi, sila isi maklumat di tempat yang disediakan');
return;
}
sendToApi(data).then(x => x === 'success' ? alert('Tetapan berjaya dikemaskin') : alert('Tetapan tidak berjaya dikemaskini'));
return;
}
sendToApi(data).then(x => x === 'success' ? alert('Tetapan berjaya dikemaskin') : alert('Tetapan tidak berjaya dikemaskini'));
}
button_update_notification_setting.addEventListener('click', function(e) {
handleClick(e);
});
});
</script>
<script>
document.addEventListener("DOMContentLoaded", function() {
const toggle = document.querySelector('#toggle');
const dot = document.querySelector('.dot');
// input
const startTimeInput = document.querySelector('input[name="start-time"]');
const endTimeInput = document.querySelector('input[name="end-time"]');
const messageInput = document.querySelector('textarea[name="message"]');
let disableInput = () => {
startTimeInput.disabled = true;
endTimeInput.disabled = true;
messageInput.disabled = true;
startTimeInput.value = '';
endTimeInput.value = '';
messageInput.value = '';
startTimeInput.classList.add('bg-gray-300');
endTimeInput.classList.add('bg-gray-300');
messageInput.classList.add('bg-gray-300');
};
let enableInput = () => {
startTimeInput.disabled = false;
endTimeInput.disabled = false;
messageInput.disabled = false;
startTimeInput.classList.remove('bg-gray-300');
endTimeInput.classList.remove('bg-gray-300');
messageInput.classList.remove('bg-gray-300');
};
toggle.addEventListener('change', function() {
if (toggle.checked) {
dot.classList.add('transform', 'translate-x-full', 'bg-green-500');
dot.classList.remove('bg-white');
enableInput();
} else {
dot.classList.remove('transform', 'translate-x-full', 'bg-green-500');
dot.classList.add('bg-white');
disableInput();
}
});
});
</script>
<script>
document.addEventListener("DOMContentLoaded", function() {
// Get the element
const toggle = document.querySelector('#toggle');
// Function to trigger the change event
function triggerChangeEvent() {
// Create a new change event
const event = new Event('change', {
bubbles: true, // Event bubbles up through the DOM
cancelable: true // Event can be cancelled
});
// Dispatch the event on the input element
toggle.dispatchEvent(event);
}
// Call the function to trigger the change event
triggerChangeEvent();
});
</script>
@endpush
+1
View File
@@ -158,6 +158,7 @@ Route::get('/tetapan',['as'=>'tetapan','uses'=>'App\Http\Controllers\TetapanCont
Route::get('/tetapanhome',['as'=>'tetapan.home','uses'=>'App\Http\Controllers\TetapanController@home'])->middleware(['roleChecker:null,null,operasi,null,null']);
Route::get('/tetapanmargin',['as'=>'tetapan.margin','uses'=>'App\Http\Controllers\TetapanController@margin'])->middleware(['roleChecker:null,null,operasi,null,null']);
Route::get('/tetapan-payable-ujrah-branches',['as'=>'tetapan.payable-ujrah-branches','uses'=>'App\Http\Controllers\TetapanController@PayableUjrahBranches'])->middleware(['roleChecker:null,null,operasi,null,null']);
Route::get('/tetapan-unsold-commodity-notification',['as'=>'tetapan.unsold-commodity-notifications','uses'=>'App\Http\Controllers\TetapanController@UnsoldCommodityNotification'])->middleware(['roleChecker:null,null,operasi,null,null']);
//Pengguna