电子商城项目开发(前台功能模块开发)
程序员文章站
2022-05-29 07:56:10
接着之前那篇 “电子商城项目开发(后台功能模块开发)” 登陆页面login.php
接着之前那篇 “电子商城项目开发(后台功能模块开发)”
登陆页面login.php
<?php require '../tools.func.php'; require '../db.func.php'; // 判断当前是否为post提交 if (!empty($_post['username'])) { $action = htmlentities($_get['action']); $prefix = getdbprefix(); if ($action == 'reg') { $username = htmlentities($_post['username']); $password = md5(htmlentities($_post['password'])); $email = htmlentities($_post['email']); $created_at = date('y-m-d h:i:s'); $sql = "insert into {$prefix}user(username, password, email, created_at) values('$username', '$password', '$email', '$created_at')"; if (execute($sql)) { setinfo('注册成功'); } else { setinfo('注册失败'); } } elseif ($action == 'login') { $username = htmlentities($_post['username']); $password = md5(htmlentities($_post['password'])); $sql = "select id, username from {$prefix}user where username = '$username' and password = '$password'"; $res = queryone($sql); if ($res) { setsession('shop', ['username' => $username, 'id' => $res['id']]); header('location: index.php'); } else { setinfo('用户名或者密码错误'); } } } // 判断操作为login 还是 reg // 如果是reg,要接收post数据,插入新数据 // 如果是login,要查询数据库,判断用户名或者密码是否正确,正确的话写入session // 显示结果 require 'header.php'; ?> <!-- start login register area --> <div class="htc__login__register bg__white ptb--130"> <div class="container"> <div class="row"> <div class="col-md-6 col-md-offset-3"> <ul class="login__register__menu" role="tablist"> <li role="presentation" class="login active"><a href="#login" role="tab" data-toggle="tab">登录</a></li> <li role="presentation" class="register"><a href="#register" role="tab" data-toggle="tab">注册</a></li> </ul> </div> </div> <!-- start login register content --> <div class="row"> <div class="col-md-6 col-md-offset-3"> <div class="htc__login__register__wrap"> <!-- start single content --> <div id="login" role="tabpanel" class="single__tabs__panel tab-pane fade in active"> <p><?php if (hasinfo()) echo getinfo(); ?></p> <form id="loginform" class="login" method="post" action="login.php?action=login"> <input type="text" name="username" placeholder="user name*"> <input type="password" name="password" placeholder="password*"> </form> <div class="htc__login__btn mt--30"> <a href="javascript:document.getelementbyid('loginform').submit();">登录</a> </div> </div> <!-- end single content --> <!-- start single content --> <div id="register" role="tabpanel" class="single__tabs__panel tab-pane fade"> <p><?php if (hasinfo()) echo getinfo(); ?></p> <form id="regform" class="login" action="login.php?action=reg" method="post"> <input type="text" name="username" placeholder="name*"> <input type="email" name="email" placeholder="email*"> <input type="password" name="password" placeholder="password*"> </form> <div class="htc__login__btn"> <a href="javascript:document.getelementbyid('regform').submit();">注册</a> </div> </div> <!-- end single content --> </div> </div> </div> <!-- end login register content --> </div> </div> <!-- end login register area --> <div class="only-banner ptb--10 bg__white"> </div> <?php require 'footer.php'; ?>
header.php
<?php $username = getsession('username', 'shop'); $cart_header = []; if (!empty($username)) { $uid = getsession('id', 'shop'); // 从数据表查询购物车数据 $prefix = getdbprefix(); $sql = "select id, price, quantity, products from {$prefix}cart where uid = '$uid'"; $cart_header = queryone($sql); $cart_header['products'] = json_decode($cart_header['products'], true); } else { // 从session查询购物车数据 $cart_header = getsession('cart', 'shop'); } ?> <!doctype html> <html class="no-js" lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <title>慕课商城</title> <meta name="description" content=""> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- place favicon.ico in the root directory --> <link rel="apple-touch-icon" href="apple-touch-icon.png"> <!-- all css files are included here. --> <!-- bootstrap fremwork main css --> <link rel="stylesheet" href="assets/css/bootstrap.min.css"> <!-- owl carousel main css --> <link rel="stylesheet" href="assets/css/owl.carousel.min.css"> <link rel="stylesheet" href="assets/css/owl.theme.default.min.css"> <!-- this core.css file contents all plugings css file. --> <link rel="stylesheet" href="assets/css/core.css"> <!-- theme shortcodes/elements style --> <link rel="stylesheet" href="assets/css/shortcode/shortcodes.css"> <!-- theme main style --> <link rel="stylesheet" href="assets/css/style.css"> <!-- responsive css --> <link rel="stylesheet" href="assets/css/responsive.css"> <!-- user style --> <link rel="stylesheet" href="assets/css/custom.css"> <!-- modernizr js --> <script src="assets/js/vendor/modernizr-2.8.3.min.js"></script> </head> <body> <!-- body main wrapper start --> <div class="wrapper fixed__footer"> <!-- start header style --> <header id="header" class="htc-header header--3 bg__white"> <!-- start mainmenu area --> <div id="sticky-header-with-topbar" class="mainmenu__area sticky__header"> <div class="container"> <div class="row"> <div class="col-md-2 col-lg-2 col-sm-3 col-xs-3"> <div class="logo"> <a href="index.php"> <img src="assets/images/logo/logo.png" alt="logo"> </a> </div> </div> <!-- start mainmenu ares --> <div class="col-md-8 col-lg-8 col-sm-6 col-xs-6"> <nav class="mainmenu__nav hidden-xs hidden-sm"> <ul class="main__menu"> <li><a href="index.php">首页</a></li> </ul> </nav> </div> <!-- end mainmenu ares --> <div class="col-md-4 col-sm-4 col-xs-3"> <ul class="menu-extra"> <li><a href="login.php"><span class="ti-user"></span> </a> <?php if (empty($username)): ?> <a href="login.php">注册</a> <?php else: ?> 欢迎回来, <?php echo $username; ?> <a href="logout.php">退出</a> <?php endif; ?> </li> <li class="cart__menu"><span class="ti-shopping-cart"></span></li> </ul> </div> </div> </div> </div> <!-- end mainmenu area --> </header> <!-- end header style --> <div class="body__overlay"></div> <!-- start offset wrapper --> <div class="offset__wrapper"> <!-- start offset menu --> <div class="offsetmenu"> <div class="offsetmenu__inner"> <div class="offsetmenu__close__btn"> <a href="#"><i class="zmdi zmdi-close"></i></a> </div> <div class="off__contact"> <div class="logo"> <a href="index.php"> <img src="assets/images/logo/logo.png" alt="logo"> </a> </div> </div> </div> </div> <!-- end offset menu --> <!-- start cart panel --> <div class="shopping__cart"> <div class="shopping__cart__inner"> <div class="offsetmenu__close__btn"> <a href="#"><i class="zmdi zmdi-close"></i></a> </div> <div class="shp__cart__wrap"> <?php if (! empty($cart_header)): ?> <?php foreach ($cart_header['products'] as $pid => $header_pro): ?> <div class="shp__single__product"> <div class="shp__pro__thumb"> <a href="#"> <img src="assets/uploads/default.jpeg" alt="product images"> </a> </div> <div class="shp__pro__details"> <h2><a href="product_details.php?id=<?php echo $pid; ?>"></a><?php echo $header_pro['product']['name']; ?></h2> <span class="quantity">数量: <?php echo $header_pro['quantity']; ?></span> <span class="shp__price">¥<?php echo $header_pro['product']['price']; ?></span> </div> <div class="remove__btn"> <a href="#" title="remove this item"><i class="zmdi zmdi-close"></i></a> </div> </div> <?php endforeach; ?> </div> <ul class="shoping__total"> <li class="subtotal">总计:</li> <li class="total__price">¥<?php echo $cart_header['price']; ?></li> </ul> <?php endif; ?> <ul class="shopping__btn"> <li><a href="cart.php">查看购物车</a></li> </ul> </div> </div> <!-- end cart panel --> </div> <!-- end offset wrapper -->
footer.php
<!-- start footer area --> <footer class="htc__foooter__area gray-bg"> <div class="container"> <!-- start copyright area --> <div class="htc__copyright__area"> <div class="row"> <div class="col-md-12 col-lg-12 col-sm-12 col-xs-12"> <div class="copyright__inner"> <ul class="footer__menu"> </ul> </div> </div> </div> </div> <!-- end copyright area --> </div> </footer> <!-- end footer area --> </div> <!-- body main wrapper end --> <!-- placed js at the end of the document so the pages load faster --> <!-- jquery latest version --> <script src="assets/js/vendor/jquery-1.12.0.min.js"></script> <!-- bootstrap framework js --> <script src="assets/js/bootstrap.min.js"></script> <!-- all js plugins included in this file. --> <script src="assets/js/plugins.js"></script> <script src="assets/js/slick.min.js"></script> <script src="assets/js/owl.carousel.min.js"></script> <!-- waypoints.min.js. --> <script src="assets/js/waypoints.min.js"></script> <!-- main js file that contents all jquery plugins activation. --> <script src="assets/js/main.js"></script> </body> </html>
登陆后进入首页index.php
<?php require '../tools.func.php'; require '../db.func.php'; // 1. 查询所有商品 imooc_product // 2. 写sql语句 $prefix = getdbprefix(); $sql = "select id,name,price from {$prefix}product order by created_at desc"; $data = query($sql); // 3. 遍历结果 require 'header.php'; ?> <!-- start our product area --> <section class="htc__product__area bg__white"> <div class="container"> <div class="row"> <div class="col-md-12"> <div class="product-categories-all"> <div class="product-categories-title" style="border-bottom: 1px solid rgba(129, 129, 129, 0.2)"> <h3>所有商品</h3> </div> </div> </div> </div> <div class="row"> <?php foreach ($data as $product): ?> <div class="col-md-3 single__pro col-lg-3 cat--1 col-sm-4 col-xs-12"> <div style="margin-top: 20px" class="product foo"> <div class="product__inner"> <div class="pro__thumb"> <a href="product_details.php?id=<?php echo $product['id']; ?>"> <img src="assets/uploads/default.jpeg" alt="product images"> </a> </div> <div class="product__hover__info"> <ul class="product__action"> <li><a title="加入购物车" href="cart_add.php?product_id=<?php echo $product['id']; ?>&quantity=1"><span class="ti-shopping-cart"></span></a></li> <li><a title="查看详情" href="product_details.php?id=<?php echo $product['id']; ?>">查看详情</a></li> </ul> </div> </div> <div class="product__details"> <h2 style="margin-left: 20px;text-align: center;"><a href="product_details.php?id=<?php echo $product['id']; ?>"><?php echo $product['name']; ?></a></h2> <ul class="product__price"> <li class="new__price" style="margin: 0 auto;">¥<?php echo $product['price']; ?></li> </ul> </div> </div> </div> <?php endforeach; ?> </div> </div> </section> <!-- end our product area --> <div class="only-banner ptb--10 bg__white"> </div> <?php require 'footer.php'; ?>
登出页面logout.php
<?php /** * created by phpstorm. * date: 2019/1/24 * time: 12:32 */ require '../tools.func.php'; deletesession('shop'); header('location: index.php');
商品详情页product_details.php
<?php require '../tools.func.php'; require '../db.func.php'; // 1. 接收get id $id = intval($_get['id']); // 2. 判断 get id,如果id不存,跳回到首页 if (empty($id)) { header('location: index.php'); } // 3. 根据id 查询对应的商品 $prefix = getdbprefix(); $sql = "select id, name, price, description from {$prefix}product where id = '$id'"; $current_product = queryone($sql); // 4. 将数据写入到页面当中 require 'header.php'; ?> <!-- start product details --> <section class="htc__product__details pt--120 pb--100 bg__white"> <div class="container"> <div class="row"> <div class="col-md-4 col-lg-4 col-sm-12 col-xs-12"> <div class="product__details__container"> <div class="product__big__images" style="width: 100%;max-width: 100%"> <div class="portfolio-full-image tab-content"> <div role="tabpanel" class="tab-pane fade in active"> <img width="100%" src="assets/uploads/default.jpeg" alt="full-image"> </div> </div> </div> </div> </div> <div class="col-md-8 col-lg-8 col-sm-12 col-xs-12 smt-30 xmt-30"> <div class="htc__product__details__inner"> <div class="pro__detl__title"> <h2><?php echo $current_product['name']; ?></h2> </div> <div class="pro__details"> <p><?php echo mb_substr($current_product['description'], 0, 50, 'utf-8') . '...'; ?></p> </div> <ul class="pro__dtl__prize"> <li>¥<?php echo $current_product['price']; ?></li> </ul> <div class="product-action-wrap"> <div class="prodict-statas"><span>数量 :</span></div> <div class="product-quantity"> <form id='myform' method='get' action='cart_add.php'> <input type="hidden" name="product_id" value="<?php echo $id; ?>"> <div class="product-quantity"> <div class="cart-plus-minus"> <input class="cart-plus-minus-box" type="text" name="quantity" value="1"> </div> </div> </form> </div> </div> <ul class="pro__dtl__btn"> <li class="buy__now__btn"><a href="javascript:document.getelementbyid('myform').submit();">加入购物车</a></li> </ul> </div> </div> </div> </div> </section> <!-- end product details --> <!-- start product tab --> <section class="htc__product__details__tab bg__white pb--120"> <div class="container"> <div class="row"> <div class="col-md-12 col-lg-12 col-sm-12 col-xs-12"> <ul class="product__deatils__tab mb--60" role="tablist"> <li role="presentation" class="active"> <a href="#description" role="tab" data-toggle="tab">商品描述</a> </li> </ul> </div> </div> <div class="row"> <div class="col-md-12"> <div class="product__details__tab__content"> <!-- start single content --> <div role="tabpanel" id="description" class="product__tab__content fade in active"> <div class="product__description__wrap"> <div class="product__desc"> <h2 class="title__6">详情</h2> <p><?php echo $current_product['description']; ?></p> </div> </div> </div> <!-- end single content --> </div> </div> </div> </div> </section> <!-- end product tab --> <div class="only-banner ptb--10 bg__white"> </div> <?php require 'footer.php'; ?>
购物车页面cart.php
<?php require '../tools.func.php'; require '../db.func.php'; require 'auth.php'; // 1. 从数据表当中查询购物车数据 $uid = getsession('id', 'shop'); $prefix = getdbprefix(); $sql = "select id,price,products,quantity from {$prefix}cart where uid = '$uid'"; $cart_page_data = queryone($sql); $cart_page_data['products'] = json_decode($cart_page_data['products'], true); // 2. 遍历数据到页面 require 'header.php'; ?> <div class="cart-main-area bg__white"> <div class="container"> <div class="row"> <div class="col-md-12 col-sm-12 col-xs-12"> <?php if (hasinfo()) echo getinfo(); ?> <form action="#"> <div class="table-content table-responsive"> <table> <thead> <tr> <th class="product-thumbnail"></th> <th class="product-name">商品名称</th> <th class="product-price">单价</th> <th class="product-quantity">数量</th> <th class="product-subtotal">总计</th> <th class="product-remove">编辑</th> </tr> </thead> <tbody> <?php if (!empty($cart_page_data)): ?> <?php foreach ($cart_page_data['products'] as $pid => $cart_product): ?> <tr> <td class="product-thumbnail"> <a href="product_details.php?id=<?php echo $pid ?>"> <img src="assets/uploads/default.jpeg" alt="product img"/> </a> </td> <td class="product-name"> <a href="product_details.php?id=<?php echo $pid ?>"> <?php echo $cart_product['product']['name']; ?> </a> </td> <td class="product-price"> <span class="amount">¥<?php echo $cart_product['product']['price']; ?></span> </td> <td class="product-quantity"> <input type="number" disabled value="<?php echo $cart_product['quantity']; ?>"/> </td> <td class="product-subtotal">¥<?php echo $cart_product['product']['price'] * $cart_product['quantity']; ?></td> <td class="product-remove"><a href="cart_del.php?product_id=<?php echo $pid; ?>">x</a></td> </tr> <?php endforeach; ?> <?php endif; ?> </tbody> </table> </div> <div class="row"> <div class="col-md-8 col-sm-7 col-xs-12"> <div class="buttons-cart"> <a href="index.php">继续购物</a> </div> </div> <div class="col-md-4 col-sm-5 col-xs-12"> <div class="cart_totals"> <table> <tbody> <tr class="cart-subtotal"> <th>小计</th> <td><span class="amount">¥<?php echo isset($cart_page_data['price']) ? $cart_page_data['price'] : '0.0' ?></span></td> </tr> <tr class="shipping"> <th>快递</th> <td> <ul id="shipping_method"> <li> <input type="radio" checked/> <label> 包邮 </label> </li> <li></li> </ul> </td> </tr> <tr class="order-total"> <th>总价</th> <td> <strong><span class="amount">¥<?php echo isset($cart_page_data['price']) ? $cart_page_data['price'] : '0.0' ?></span></strong> </td> </tr> </tbody> </table> <div class="wc-proceed-to-checkout" style="clear: both;"> <a href="checkout.php">去付款</a> </div> </div> </div> </div> </form> </div> </div> </div> </div> <div class="only-banner ptb--10 bg__white"> </div> <?php require 'footer.php'; ?>
查看购物车前确认登陆状态auth.php
<?php /** * created by phpstorm. * date: 2019/1/24 * time: 14:47 */ if (empty(getsession('username', 'shop'))) { header('location: login.php'); exit; }
增加商品添加到购物车cart_add.php
<?php /** * created by phpstorm. * date: 2019/1/24 * time: 13:18 */ require '../tools.func.php'; require '../db.func.php'; // 1. 接收商品 id $product_id = intval($_get['product_id']); // 2. 接收数量 $quantity = intval($_get['quantity']); if (empty($product_id) || empty($quantity)) { header('location: index.php'); exit; } $prefix = getdbprefix(); $sql = "select id, name, price, code, description from {$prefix}product where id = '$product_id'"; $product = queryone($sql); // 3. 判断当前用户是否已经登录 if (!empty(getsession('username', 'shop'))) { // 如果已经登录,将购物车数据存入到 数据表( // id, // products[ // 2 => [quantity => 4, product => [id => ,price =>,]], // 3 => [quantity => 2, product => []], // 4 => // ], // price, quantity, uid) $uid = getsession('id', 'shop'); $sql = "select id,products,price,quantity,uid from {$prefix}cart where uid = '$uid'"; $cart = queryone($sql); if (!empty($cart)) { // 更新记录 $products = json_decode($cart['products'], true); if (array_key_exists($product_id, $products)) { $products[$product_id]['quantity'] += $quantity; } else { $products[$product_id] = ['quantity' => $quantity, 'product' => $product]; } $products = addslashes(json_encode($products)); $cart_price = $cart['price'] + $quantity * $product['price']; $cart_quantity = $cart['quantity'] + $quantity; $sql = "update {$prefix}cart set products = '$products', price = '$cart_price', quantity = '$cart_quantity' where id = '{$cart['id']}'"; execute($sql); } else { // 生成 products, price, quantity, uid, created_at $products[$product_id] = ['quantity' => $quantity, 'product' => $product]; $price = $product['price'] * $quantity; $created_at = date('y-m-d h:i:s'); // 添加新的数据 $products = addslashes(json_encode($products)); // \' \" $sql = "insert into {$prefix}cart(products, price, quantity, uid, created_at) values('$products', '$price', '$quantity', '$uid', '$created_at')"; execute($sql); } header('location: cart.php'); // json [{2: {quantity: 4, product: {id: , price: }}}, {}] } else { // 如果没有登录,将购物车数据存入到 session $cart = getsession('cart', 'shop'); if (!empty($cart)) { // 更新session // 判断当前购物车当中是否拥有当前商品 if (array_key_exists($product_id, $cart['products'])) { // 如果有,更新当前商品的数量,购物车总价,总数量 $cart['products'][$product_id]['quantity'] += $quantity; } else { // 如果没有,新加入一个商品信息到购物车当中,更新购物车总价,总数量 $cart['products'][$product_id] = ['quantity' => $quantity, 'product' => $product]; } $cart['price'] += $quantity * $product['price']; $cart['quantity'] += $quantity; setsession('cart', $cart, 'shop'); } else { // 写入session $products = [ $product_id => [ 'quantity' => $quantity, 'product' => $product ] ]; $cart_data = [ 'products' => $products, 'price' => $quantity * $product['price'], 'quantity' => $quantity ]; setsession('cart', $cart_data, 'shop'); } header('location: index.php'); }
删除购物车商品cart_del.php
<?php /** * created by phpstorm. * date: 2019/1/24 * time: 15:06 */ require '../tools.func.php'; require '../db.func.php'; require 'auth.php'; $product_id = intval($_get['product_id']); if (empty($product_id)) { header('location: cart.php'); exit; } // 0. auth // 1. 查询当前用户的购物车 $prefix = getdbprefix(); $uid = getsession('id', 'shop'); $sql = "select id,price,quantity,products from {$prefix}cart where uid = '$uid'"; $cart = queryone($sql); // 2. 将购物车当中对应id的商品删除,更新总价格,总数量 $cart['products'] = json_decode($cart['products'], true); $cart['price'] -= $cart['products'][$product_id]['quantity'] * $cart['products'][$product_id]['product']['price']; $cart['quantity'] -= $cart['products'][$product_id]['quantity']; unset($cart['products'][$product_id]); $cart['products'] = addslashes(json_encode($cart['products'])); $sql = "update {$prefix}cart set price = '{$cart['price']}', quantity = '{$cart['quantity']}', products = '{$cart['products']}' where uid = '$uid'"; if (execute($sql)) { setinfo('删除成功'); } else { setinfo('删除失败'); } header('location: cart.php');
模拟下单页面checkout.php
<?php /** * created by phpstorm. * date: 2019/1/24 * time: 15:34 */ require '../tools.func.php'; require '../db.func.php'; require 'auth.php'; // 1. 获取当前用户的购物车数据 $uid = getsession('id', 'shop'); $prefix = getdbprefix(); $sql = "select id, price, quantity, products, uid from {$prefix}cart where uid = '$uid'"; $cart = queryone($sql); if (empty($cart)) { header('location: cart.php'); exit; } // 2. 将购物车数据写入到订单表当中 (id, price, quantity, products, created_at, uid) $price = $cart['price']; $quantity = $cart['quantity']; $products = $cart['products']; $created_at = date('y-m-d h:i:s'); $sql = "insert into {$prefix}order(price, quantity, products, created_at, uid) values('$price', '$quantity', '$products', '$created_at', '$uid')"; if (execute($sql)) { setinfo('下单成功'); } else { setinfo('下单失败'); } header('location: order_status.php');
下单成功页面order_status.php
require 'header.php'; ?> <div class="cart-main-area bg__white"> <div class="container"> <div class="row"> <div class="col-md-12 col-sm-12 col-xs-12" style="text-align: center;padding: 50px;"> <h1 style="color: green;"><?php if (hasinfo()) echo getinfo(); ?></h1> </div> </div> </div> </div> <div class="only-banner ptb--10 bg__white"> </div> <?php require 'footer.php'; ?>
上一篇: 「BZOJ4173」数学
下一篇: JVM系列七(JIT 即时编译器).