[睡醒來聽 PHP 與 MySQL] DAY28 預約使用者畫面(時間、查看、取消)

15th鐵人賽

Rina

2023-10-13 12:05:56

817 瀏覽

分享至

Welcome 歡迎來到「睡醒來聽 PHP 與 MySQL」系列！

DAY28 今天要學甚麼?今天實作使用者預約畫面

🔶章節:
🔹[開頭]
🔹[建立預約項目]
🔹[製作預約完成後跳轉]
🔹[自動產生編號]
🔹[訂單總攬]
🔹[取消預約畫面及設定]
🔹[總結]

如果影片中不清楚，需要補充的地方我會再添加到這邊~
👆教學中的[練習]程式碼一併附上，影片中會有每組的講解、說明更清楚👆

appointments 資料表

sql建立資料表

CREATE TABLE appointments (
    order_id INT AUTO_INCREMENT PRIMARY KEY,
    type VARCHAR(50) NOT NULL,
    account VARCHAR(100) NOT NULL,
    name VARCHAR(100) NOT NULL,
    phone VARCHAR(20) NOT NULL,
    email VARCHAR(100) NOT NULL,
    date DATE NOT NULL,
    time TIME NOT NULL,
    created_at DATETIME,
    status VARCHAR(10)
);

提取使用者資訊

user_info.php

<?php
function getGreeting($user_id, $conn) {
    $sql = "SELECT * FROM member WHERE id='$user_id'";
    $result = $conn->query($sql);

    if ($result->num_rows == 1) {
        $row = $result->fetch_assoc();
        return !empty($row['nickname']) ? $row['nickname'] : $row['username'];
    } else {
        return "無法獲取使用者資訊。";
    }
}

function getUserInfo($user_id, $conn) {
    $sql = "SELECT * FROM member WHERE id='$user_id'";
    $result = $conn->query($sql);

    if ($result->num_rows == 1) {
        $row = $result->fetch_assoc();
        return $row;  // 返回完整的會員資訊
    } else {
        return null;  // 如果找不到會員資訊，返回 null 或適當的錯誤處理
    }
}
?>

選擇體驗項目

orderWeb.php

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>選擇預約項目</title>
</head>
<body>
    <?php
    session_start();
    include 'db_connect.php';
    include 'user_info.php';

    if (isset($_SESSION['user_id'])) {
        $user_id = $_SESSION['user_id'];
        $greeting = getGreeting($user_id, $conn);

        echo "<h2>歡迎 {$greeting}，請選擇預約項目</h2>";
        echo "<a href='reserveWeb.php?type=VR體驗'>預約體驗VR</a><br>";
        echo "<a href='reserveWeb.php?type=治療師諮詢'>預約治療師諮詢</a><br>";
    } else {
        echo "請先<a href='loginWeb.php'>登入</a>";
    }
    ?>
</body>
</html>

填寫預約細項資訊

reserveWeb.php

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>預約體驗</title>
</head>
<body>
    <?php
    session_start();
    include 'db_connect.php';
    include 'user_info.php';

    if (isset($_SESSION['user_id'])) {
        $type = $_GET['type']; // 取得選擇的預約類型
        $user_id = $_SESSION['user_id'];
        $greeting = getGreeting($user_id, $conn);

        // 獲取會員資料
        $userInfo = getUserInfo($user_id, $conn);

        if ($type === 'VR體驗') {
            $typeText = 'VR體驗';
        } elseif ($type === '治療師諮詢') {
            $typeText = '治療師諮詢';
        } else {
            echo "無效的預約類型";
            exit;
        }

        echo "<h2>{$greeting} 你好，歡迎預約{$typeText}</h2>";
        echo "<form action='reserve_confirm.php' method='post'>";
        echo "<input type='hidden' name='type' value='$type'>";

        // 自動填入會員資料
        echo "<label for='name'>姓名：</label>";
        echo "<input type='text' id='name' name='name' value='{$userInfo['username']}' required><br>";
        echo "<label for='phone'>電話：</label>";
        echo "<input type='tel' id='phone' name='phone' value='{$userInfo['phone']}' required><br>";
        echo "<label for='email'>信箱：</label>";
        echo "<input type='email' id='email' name='email' value='{$userInfo['email']}' required><br>";

        echo "<label for='date'>預約日期：</label>";
        echo "<input type='date' id='date' name='date' required><br>";
        echo "<label for='time'>預約時間：</label>";
        echo "<input type='time' id='time' name='time' required><br>";
        echo "<button type='submit'>下一步</button>";
        echo "</form>";
    } else {
        echo "請先<a href='login.html'>登入</a>";
    }
    ?>
</body>
</html>

儲存預約

reserve_confirm.php

<?php
session_start();
include 'db_connect.php'; 
include 'user_info.php'; 

if ($_SERVER["REQUEST_METHOD"] == "POST") {
    // 從 SESSION 中獲取預約帳號
    if (isset($_SESSION['user_id'])) {
        $user_id = $_SESSION['user_id'];

        // 使用 user_info.php 中的函數獲取使用者資訊
        $userInfo = getUserInfo($user_id, $conn);

        if ($userInfo !== null) {
            $account = $userInfo['account'];

            // 從 POST 請求中獲取預約資料
            $type = $_POST['type'];
            $name = $_POST['name'];
            $phone = $_POST['phone'];
            $email = $_POST['email'];
            $date = $_POST['date'];
            $time = $_POST['time'];

            // 當下的日期時間
            $created_at = date('Y-m-d H:i:s');

            // 將預約資料存入資料庫appointments資料表
            $sql = "INSERT INTO appointments (type, account, name, phone, email, date, time, created_at, status) VALUES ('$type', '$account', '$name', '$phone', '$email', '$date', '$time', '$created_at', '未完成')";

            if ($conn->query($sql) === TRUE) {
                echo "預約完成，5秒後跳轉至預約首頁";
                header("refresh:5;url=orderWeb.php");
            } else {
                echo "預約失敗: " . $conn->error;
            }
        } else {
            echo "無法獲取使用者資訊。";
        }
    } else {
        echo "無法獲取預約帳號。";
    }
}

$conn->close();
?>

查看我的訂單(使用者的預約訂單列表)

orderView.php

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的訂單</title>
</head>
<body>
    <?php
    session_start();
    include 'db_connect.php';
    include 'user_info.php'; 

    if (isset($_SESSION['user_id'])) {
        $user_id = $_SESSION['user_id'];
        // 使用 user_info.php 中的函數獲取使用者資訊
        $userInfo = getUserInfo($user_id, $conn);
        $account = $userInfo['account'];

        // 檢查篩選狀態
        $filter = "";
        if (isset($_GET['status'])) {
            $status = $_GET['status'];
            $filter = "AND status='$status'";
        }

        // 查詢預約資訊
        $sql = "SELECT order_id, type, date, time, name, phone, status FROM appointments WHERE account='$account' $filter ORDER BY date DESC, time DESC";
        $result = $conn->query($sql);

        echo "<h2>我的訂單</h2>";
        echo "<p><a href='orderView.php'>全部</a> | <a href='orderView.php?status=未完成'>未完成</a> | <a href='orderView.php?status=已完成'>已完成</a></p>";

        if ($result->num_rows > 0) {
            while ($row = $result->fetch_assoc()) {
                echo "<div>";
                echo "<p>訂單編號：" . $row['order_id'] . "</p>";
                echo "<p>預約類型：" . $row['type'] . "</p>";
                echo "<p>預約日期：" . $row['date'] . "</p>";
                echo "<p>預約時間：" . $row['time'] . "</p>";
                echo "<p>預約姓名：" . $row['name'] . "</p>";
                echo "<p>預約電話：" . $row['phone'] . "</p>";

                if ($row['status'] === '未完成') {
                    echo "<form action='cancel_reservation.php' method='post'>";
                    echo "<input type='hidden' name='order_id' value='" . $row['order_id'] . "'>";
                    echo "<button type='submit'>取消預約</button>";
                    echo "</form>";
                }

                echo "</div>";
            }
        } else {
            echo "<p>沒有任何預約項目</p>";
        }
    } else {
        echo "請先<a href='loginWeb.php'>登入</a>";
    }
    ?>
</body>
</html>

取消當筆預約

cancel_reservation.php

<?php
session_start();
include 'db_connect.php'; 

if ($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['order_id'])) {
    $order_id = $_POST['order_id'];

    
    $sql = "DELETE FROM appointments WHERE order_id='$order_id'";

    if ($conn->query($sql) === TRUE) {
        echo "訂單已成功取消。";
    } else {
        echo "取消訂單失敗: " . $conn->error;
    }
}

$conn->close();
?>

今天實作了一個完整的使用者訂單預約系統，涵蓋了預約流程、查看所有預約紀錄、篩選預約以及取消預約等功能。透過使用 PHP 和資料庫操作，我們建立了一個方便且實用的預約平台，同時在預約過程中充分運用了 session 技術，能夠自動帶入登入帳號的相關資訊，提升了使用者體驗!