<?php
session_start();
if (!isset($_SESSION['user_id'])) {
    header('Location: login.php');
    exit;
}
require 'db.php'; // DB connection
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>POS Settings</title>
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/css/style.css">
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
</head>
<body>

<div class="container py-4">
    <div class="d-flex justify-content-between align-items-center mb-3">
        <h4 class="mb-0">POS Settings</h4>
        <div class="d-flex gap-2">
            <a href="index.php" class="btn btn-outline-primary btn-sm">
                <i data-feather="arrow-left" class="me-1"></i>Back to Backoffice
            </a>
            <a href="pos.php" class="btn btn-outline-success btn-sm">
                <i data-feather="shopping-cart" class="me-1"></i>Back to POS
            </a>
        </div>
    </div>

    <div class="card shadow-sm">
        <div class="card-body">
            <p><strong>Username:</strong> <?= htmlspecialchars($_SESSION['username'] ?? 'User') ?></p>
            <p><strong>Role:</strong> <?= htmlspecialchars($_SESSION['role_name'] ?? 'Staff') ?></p>
            <hr>
            <button class="btn btn-danger w-100" data-bs-toggle="modal" data-bs-target="#closeShiftModal">
                <i data-feather="lock"></i> Close Shift
            </button>
        </div>
    </div>
</div>

<!-- Close Shift Modal -->
<div class="modal fade" id="closeShiftModal" tabindex="-1" aria-labelledby="closeShiftModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <form id="closeShiftForm">
      <div class="modal-content">
        <div class="modal-header bg-danger text-white">
          <h5 class="modal-title" id="closeShiftModalLabel">Close Shift</h5>
          <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
        </div>
        <div class="modal-body">
          <label for="closing_cash" class="form-label">Enter Closing Cash:</label>
          <input type="number" name="closing_cash" class="form-control" id="closing_cash" required min="0" step="0.01">
        </div>
        <div class="modal-footer">
          <button type="submit" class="btn btn-danger w-100">Confirm Close</button>
        </div>
      </div>
    </form>
  </div>
</div>

<script src="assets/js/bootstrap.bundle.min.js"></script>
<script src="https://unpkg.com/feather-icons"></script>
<script>
  feather.replace();

  document.getElementById('closeShiftForm').addEventListener('submit', function(e) {
    e.preventDefault();
    const formData = new FormData(this);

    fetch('close_shift.php', {
      method: 'POST',
      body: formData
    })
    .then(res => res.json())
    .then(data => {
      if (data.status === 'success') {
        Swal.fire({
          icon: 'success',
          title: 'Shift Closed',
          text: 'Your shift has been closed successfully!',
          confirmButtonText: 'OK'
        }).then(() => {
          window.location.href = 'logout.php';
        });
      } else {
        Swal.fire({
          icon: 'error',
          title: 'Error',
          text: data.message || 'Failed to close shift.'
        });
      }
    })
    .catch(() => {
      Swal.fire('Network Error', 'Please try again later.', 'error');
    });
  });
</script>
</body>
</html>
