add profile

assets/js/main.js

@@ -1,64 +1,71 @@
 
 document.addEventListener('DOMContentLoaded', function() {
-    const steps = document.querySelectorAll('.form-step');
-    const nextButtons = document.querySelectorAll('.btn-next');
-    const prevButtons = document.querySelectorAll('.btn-prev');
-    const progressBar = document.querySelector('.progress-bar');
     const form = document.getElementById('gtm-form');
 
-    let currentStep = 0;
+    if (form) {
+        const steps = document.querySelectorAll('.form-step');
+        const nextButtons = document.querySelectorAll('.btn-next');
+        const prevButtons = document.querySelectorAll('.btn-prev');
+        const progressBar = document.querySelector('.progress-bar');
 
-    function updateProgress() {
+        let currentStep = 0;
-        const progress = ((currentStep + 1) / steps.length) * 100;
+
-        progressBar.style.width = progress + '%';
+        function updateProgress() {
-        progressBar.setAttribute('aria-valuenow', progress);
+            if (progressBar) {
+                const progress = ((currentStep + 1) / steps.length) * 100;
+                progressBar.style.width = progress + '%';
+                progressBar.setAttribute('aria-valuenow', progress);
+            }
+        }
+
+        function showStep(stepIndex) {
+            steps.forEach((step, index) => {
+                step.classList.toggle('active', index === stepIndex);
+            });
+            currentStep = stepIndex;
+            updateProgress();
+        }
+
+        nextButtons.forEach(button => {
+            button.addEventListener('click', () => {
+                if (currentStep < steps.length - 1) {
+                    showStep(currentStep + 1);
+                }
+            });
+        });
+
+        prevButtons.forEach(button => {
+            button.addEventListener('click', () => {
+                if (currentStep > 0) {
+                    showStep(currentStep - 1);
+                }
+            });
+        });
+
+        form.addEventListener('submit', function(e) {
+            e.preventDefault();
+            const formData = new FormData(form);
+
+            fetch('submit_profile.php', {
+                method: 'POST',
+                body: formData
+            })
+            .then(response => response.json())
+            .then(data => {
+                if (data.success) {
+                    window.location.href = 'profile.php?id=' + data.profile_id;
+                } else {
+                    alert('An error occurred: ' + data.error);
+                }
+            })
+            .catch(error => {
+                console.error('Error:', error);
+                alert('A network error occurred. Please try again.');
+            });
+        });
+
+        if(steps.length > 0) {
+            showStep(0);
+        }
     }
-
-    function showStep(stepIndex) {
-        steps.forEach((step, index) => {
-            step.classList.toggle('active', index === stepIndex);
-        });
-        currentStep = stepIndex;
-        updateProgress();
-    }
-
-    nextButtons.forEach(button => {
-        button.addEventListener('click', () => {
-            if (currentStep < steps.length - 1) {
-                showStep(currentStep + 1);
-            }
-        });
-    });
-
-    prevButtons.forEach(button => {
-        button.addEventListener('click', () => {
-            if (currentStep > 0) {
-                showStep(currentStep - 1);
-            }
-        });
-    });
-
-    form.addEventListener('submit', function(e) {
-        e.preventDefault();
-        const formData = new FormData(form);
-
-        fetch('submit_profile.php', {
-            method: 'POST',
-            body: formData
-        })
-        .then(response => response.json())
-        .then(data => {
-            if (data.success) {
-                document.getElementById('form-container').innerHTML = '<div class="alert alert-success">Thank you! Your GTM profile has been submitted.</div>';
-            } else {
-                alert('An error occurred: ' + data.error);
-            }
-        })
-        .catch(error => {
-            console.error('Error:', error);
-            alert('A network error occurred. Please try again.');
-        });
-    });
-
-    showStep(0);
 });

index.php

@@ -60,8 +60,8 @@
             <h1 class="display-4">GTM Maximizer</h1>
             <p class="lead">AI Powered Solutions Generating Profitable and Efficient Revenue and Customer Growth</p>
             <a href="start.php" class="btn btn-light btn-lg mt-3">Build New Process and Organization</a>
-            <a href="#" class="btn btn-outline-light btn-lg mt-3">Existing Process</a>
+            <a href="list_profiles.php" class="btn btn-outline-light btn-lg mt-3">Existing Process</a>
-            <a href="#" class="btn btn-outline-light btn-lg mt-3">Existing Organization</a>
+            <a href="list_profiles.php" class="btn btn-outline-light btn-lg mt-3">Existing Organization</a>
         </div>
     </header>
 

list_profiles.php

@@ -0,0 +1,86 @@
+<?php
+require_once 'db/config.php';
+
+$profiles = [];
+try {
+    $pdo = db();
+    $stmt = $pdo->query("SELECT id, business_name, sells_what, created_at FROM gtm_profiles ORDER BY created_at DESC");
+    $profiles = $stmt->fetchAll(PDO::FETCH_ASSOC);
+} catch (PDOException $e) {
+    // Handle database connection error
+    error_log($e->getMessage());
+}
+
+?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Existing GTM Profiles</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Inter&family=Lora:wght@700&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
+</head>
+<body>
+
+    <nav class="navbar navbar-expand-lg navbar-dark bg-primary fixed-top">
+        <div class="container">
+            <a class="navbar-brand" href="index.php">GTM Maximizer</a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav ms-auto">
+                    <li class="nav-item">
+                        <a class="nav-link" href="index.php">Home</a>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <main class="container my-5 pt-5">
+        <h1 class="mb-4">Existing GTM Profiles</h1>
+        <?php if (!empty($profiles)): ?>
+        <div class="card">
+            <div class="card-body">
+                <table class="table table-striped">
+                    <thead>
+                        <tr>
+                            <th scope="col">Business Name</th>
+                            <th scope="col">Sells What</th>
+                            <th scope="col">Created At</th>
+                            <th scope="col">Action</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <?php foreach ($profiles as $profile): ?>
+                        <tr>
+                            <td><?php echo htmlspecialchars($profile['business_name']); ?></td>
+                            <td><?php echo htmlspecialchars($profile['sells_what']); ?></td>
+                            <td><?php echo htmlspecialchars($profile['created_at']); ?></td>
+                            <td><a href="profile.php?id=<?php echo $profile['id']; ?>" class="btn btn-primary btn-sm">View</a></td>
+                        </tr>
+                        <?php endforeach; ?>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+        <?php else: ?>
+        <div class="alert alert-warning" role="alert">
+            No GTM profiles found. Please <a href="start.php">create one</a> first.
+        </div>
+        <?php endif; ?>
+    </main>
+
+    <footer class="text-center py-4">
+        <p>&copy; <?php echo date("Y"); ?> GTM Maximizer. All Rights Reserved.</p>
+    </footer>
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
+</body>
+</html>

profile.php

@@ -2,13 +2,17 @@
 require_once 'db/config.php';
 
 $profile = null;
-try {
+$profile_id = $_GET['id'] ?? null;
-    $pdo = db();
+
-    $stmt = $pdo->query("SELECT * FROM gtm_profiles ORDER BY created_at DESC LIMIT 1");
+if ($profile_id) {
-    $profile = $stmt->fetch(PDO::FETCH_ASSOC);
+    try {
-} catch (PDOException $e) {
+        $pdo = db();
-    // Handle database connection error
+        $stmt = $pdo->prepare("SELECT * FROM gtm_profiles WHERE id = ?");
-    error_log($e->getMessage());
+        $stmt->execute([$profile_id]);
+        $profile = $stmt->fetch(PDO::FETCH_ASSOC);
+    } catch (PDOException $e) {
+        error_log($e->getMessage());
+    }
 }
 
 ?>
@@ -67,7 +71,7 @@ try {
         <div class="card">
             <div class="card-body">
                 <h5 class="card-title">Business Name: <?php echo htmlspecialchars($profile['business_name']); ?></h5>
-                <p class="card-text"><strong>What we sell:</strong> <?php echo htmlspecialchars($profile['sells_what']); ?></p>
+                <p class="card-text"><strong>Sells What:</strong> <?php echo htmlspecialchars($profile['sells_what']); ?></p>
                 <hr>
                 <h6 class="card-subtitle mb-2 text-muted">Market & Sales</h6>
                 <p class="card-text"><strong>Ideal Customer Profile (ICP):</strong> <?php echo htmlspecialchars($profile['icp']); ?></p>
@@ -84,7 +88,7 @@ try {
         </div>
         <?php else: ?>
         <div class="alert alert-warning" role="alert">
-            No GTM profile found. Please <a href="index.php">create one</a> first.
+            No GTM profile found. Please <a href="list_profiles.php">select one</a> or <a href="start.php">create a new one</a>.
         </div>
         <?php endif; ?>
     </main>
@@ -96,4 +100,4 @@ try {
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
     <script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
 </body>
-</html>
+</html>

start.php

@@ -68,7 +68,7 @@
                 <div class="progress-bar" role="progressbar" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
             </div>
 
-            <form id="gtm-form">
+            <form id="gtm-form" action="submit_profile.php" method="POST">
                 <!-- Step 1: Business Information -->
                 <div class="form-step active">
                     <h2 class="mb-4">Business Information</h2>

submit_profile.php

@@ -21,12 +21,14 @@ try {
         $_POST['market_size'] ?? '',
         implode(', ', $_POST['sales_motions'] ?? []),
         $_POST['org_size'] ?? '',
-        implode(', ', $_POST['roles'] ?? []),
+        $_POST['roles'] ?? '',
         $_POST['goals'] ?? ''
     ]);
 
-    echo json_encode(['success' => true]);
+    $last_id = $pdo->lastInsertId();
+
+    echo json_encode(['success' => true, 'profile_id' => $last_id]);
 } catch (PDOException $e) {
     // In a real app, you would log this error, not expose it to the user.
     echo json_encode(['success' => false, 'error' => 'Database error: ' . $e->getMessage()]);
-}
+}