From ee63a3d09a047b9bae8cf65293cefbe816a3f7c6 Mon Sep 17 00:00:00 2001
From: armiejean <armie.miranda@qlicqer.com>
Date: Wed, 16 Apr 2025 15:22:16 +0800
Subject: [PATCH] added system parameters page

---
 .../views/pages/system-parameters.blade.php   | 184 +++++++++++++++++-
 1 file changed, 177 insertions(+), 7 deletions(-)

diff --git a/resources/views/pages/system-parameters.blade.php b/resources/views/pages/system-parameters.blade.php
index 22a4a64..4fca36e 100644
--- a/resources/views/pages/system-parameters.blade.php
+++ b/resources/views/pages/system-parameters.blade.php
@@ -3,12 +3,182 @@
 @section('page_title', 'System Parameters')
 
 @section('content')
-<div class="card" style="min-height: 500px;">
-    <div class="card-header">
-        <i class="fa-solid fa-sliders" style="color:gray;"> System Parameters</i>
+    <div class="card-header border-0 bg-transparent py-2">
+        <h5 class="mb-0 fw-bold text-dark" style="font-size: 1.25rem;">System Parameters</h5>
     </div>
-    <div class="card-body">
-        <p>This is the System Parameters page content.</p>
+    <div class="row justify-content-center">
+        <div class="card-body p-3">
+            <form id="systemParametersForm">
+                <!-- Company Logo -->
+                <h4 class="fw-bold mb-3 mt-4">Company Logo</h4>
+                <div class="mb-3">
+                    <label for="companyLogo" class="form-label">Upload Logo</label>
+                    <input type="file" class="form-control" id="companyLogo" accept=".jpg,.jpeg,.png">
+                </div>
+
+                <!-- GPS Radius -->
+                <h4 class="fw-bold mb-3 mt-4">GPS Radius</h4>
+                <div class="mb-3">
+                    <label for="gpsRadius" class="form-label">GPS Radius (in meters)</label>
+                    <input type="number" class="form-control" id="gpsRadius" min="0" placeholder="Enter radius" required>
+                </div>
+
+                <!-- Customer Service Details -->
+                <h4 class="fw-bold mb-3 mt-4">Customer Service Details</h4>
+                <div class="mb-3">
+                    <label for="contactEmail" class="form-label">Contact Email Address</label>
+                    <input type="email" class="form-control" id="contactEmail" placeholder="Enter email" required>
+                </div>
+                <div class="mb-3">
+                    <label for="contactNumber" class="form-label">Contact Number</label>
+                    <input type="tel" class="form-control" id="contactNumber" placeholder="Enter number" required>
+                </div>
+
+                <!-- System Administrator Details -->
+                <h4 class="fw-bold mb-3 mt-4">System Administrator Details</h4>
+                <div class="mb-3">
+                    <label for="adminContact" class="form-label">Contact Details</label>
+                    <textarea class="form-control" id="adminContact" rows="4" placeholder="Enter details" required></textarea>
+                </div>
+
+                <!-- Information Guide Details -->
+                <h4 class="fw-bold mb-3 mt-4">Information Guide Details</h4>
+                <div class="mb-3">
+                    <label for="infoGuideDetails" class="form-label">Details</label>
+                    <textarea class="form-control" id="infoGuideDetails" rows="4" placeholder="Enter details" required></textarea>
+                </div>
+
+                <!-- Android Version Update -->
+                <h4 class="fw-bold mb-3 mt-4">Android Version Update</h4>
+                <div class="mb-3">
+                    <label for="androidVersion" class="form-label">Android Version</label>
+                    <input type="text" class="form-control" id="androidVersion" placeholder="e.g., 1.0.0" required>
+                </div>
+                <div class="mb-3">
+                    <label for="androidVersionMessage" class="form-label">Version Update Message</label>
+                    <textarea class="form-control" id="androidVersionMessage" rows="4" placeholder="Enter message" required></textarea>
+                </div>
+                <div class="mb-3">
+                    <label for="androidVersionAction" class="form-label">Version Action</label>
+                    <select class="form-select" id="androidVersionAction" required>
+                        <option value="" disabled selected>Select action</option>
+                        <option value="Force Update">Force Update</option>
+                        <option value="Optional Update">Optional Update</option>
+                    </select>
+                </div>
+
+                <!-- iOS Version Update -->
+                <h4 class="fw-bold mb-3 mt-4">iOS Version Update</h4>
+                <div class="mb-3">
+                    <label for="iosVersion" class="form-label">iOS Version</label>
+                    <input type="text" class="form-control" id="iosVersion" placeholder="e.g., 1.0.0" required>
+                </div>
+                <div class="mb-3">
+                    <label for="iosVersionMessage" class="form-label">Version Update Message</label>
+                    <textarea class="form-control" id="iosVersionMessage" rows="4" placeholder="Enter message" required></textarea>
+                </div>
+                <div class="mb-3">
+                    <label for="iosVersionAction" class="form-label">Version Action</label>
+                    <select class="form-select" id="iosVersionAction" required>
+                        <option value="" disabled selected>Select action</option>
+                        <option value="Force Update">Force Update</option>
+                        <option value="Optional Update">Optional Update</option>
+                    </select>
+                </div>
+
+                <!-- Update Details -->
+                <h4 class="fw-bold mb-3 mt-4">Update Details</h4>
+                <div class="mb-3">
+                    <button type="button" class="btn btn-primary" id="syncData">Sync Data</button>
+                </div>
+
+                <!-- Submit -->
+                <div class="d-flex justify-content-end mt-4">
+                    <button type="submit" class="btn btn-primary">Submit</button>
+                </div>
+            </form>
+        </div>
     </div>
-</div>
-@endsection
+
+    <style>
+        .card {
+            border-radius: 5px;
+            border: 1px solid #dee2e6;
+        }
+        .form-label {
+            font-size: 0.95rem;
+        }
+        .form-control,
+        .form-select,
+        textarea.form-control {
+            font-size: 0.9rem;
+            width: 100%;
+        }
+        h4 {
+            color: #343a40;
+        }
+    </style>
+
+    <script>
+        document.getElementById('systemParametersForm').addEventListener('submit', function(e) {
+            e.preventDefault();
+
+            const fields = {
+                companyLogo: document.getElementById('companyLogo').files[0]?.name || '',
+                gpsRadius: document.getElementById('gpsRadius').value,
+                contactEmail: document.getElementById('contactEmail').value,
+                contactNumber: document.getElementById('contactNumber').value,
+                adminContact: document.getElementById('adminContact').value,
+                infoGuideDetails: document.getElementById('infoGuideDetails').value,
+                androidVersion: document.getElementById('androidVersion').value,
+                androidVersionMessage: document.getElementById('androidVersionMessage').value,
+                androidVersionAction: document.getElementById('androidVersionAction').value,
+                iosVersion: document.getElementById('iosVersion').value,
+                iosVersionMessage: document.getElementById('iosVersionMessage').value,
+                iosVersionAction: document.getElementById('iosVersionAction').value
+            };
+
+            // Validate required fields (exclude companyLogo)
+            for (const [key, value] of Object.entries(fields)) {
+                if (key !== 'companyLogo' && !value) {
+                    alert('Please fill out all required fields.');
+                    return;
+                }
+            }
+
+            // Validate email format
+            const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+            if (!emailPattern.test(fields.contactEmail)) {
+                alert('Please enter a valid email address.');
+                return;
+            }
+
+            sessionStorage.setItem('systemParameters', JSON.stringify(fields));
+            alert('Settings saved successfully!');
+        });
+
+        document.getElementById('syncData').addEventListener('click', function() {
+            alert('Data synced!');
+        });
+
+        document.querySelector('.btn-outline-secondary').addEventListener('click', function() {
+            window.location.href = '/';
+        });
+
+        // Load saved data
+        const savedData = JSON.parse(sessionStorage.getItem('systemParameters') || '{}');
+        if (savedData) {
+            document.getElementById('gpsRadius').value = savedData.gpsRadius || '';
+            document.getElementById('contactEmail').value = savedData.contactEmail || '';
+            document.getElementById('contactNumber').value = savedData.contactNumber || '';
+            document.getElementById('adminContact').value = savedData.adminContact || '';
+            document.getElementById('infoGuideDetails').value = savedData.infoGuideDetails || '';
+            document.getElementById('androidVersion').value = savedData.androidVersion || '';
+            document.getElementById('androidVersionMessage').value = savedData.androidVersionMessage || '';
+            document.getElementById('androidVersionAction').value = savedData.androidVersionAction || '';
+            document.getElementById('iosVersion').value = savedData.iosVersion || '';
+            document.getElementById('iosVersionMessage').value = savedData.iosVersionMessage || '';
+            document.getElementById('iosVersionAction').value = savedData.iosVersionAction || '';
+        }
+    </script>
+@endsection
\ No newline at end of file