客车网上订票系统项目--在线预约、个人中心我的订单

客车网上订票系统项目–在线预约、个人中心我的订单

1、今日完成任务:

(1)点击预约下单购票与数据库关联。

(2)前端个人中心我的订单编辑。

2、核心代码

订票与数据库关联order.php:

<?php 
//预定进入界面
session_start();
//需要判读一下有没有进行登录   如果有登录进行显示下面的页面  如果没有登录则进入登录界面
if(!isset($_SESSION["userAccount"])){
    //存储一下当前url  用于登录成功之后跳回
    $_SESSION["userUrl"]=$_SERVER['REQUEST_URI'];
    header("location:login.php");
    die();//下面的代码不在执行
}
require_once 'function.php';
$id=$_GET['id'];
//显示对应车票列表
$sql="select * from ticketInfo where ticketStatus=1 and id=$id;";
$rows=sel($sql);

//乘客信息
$sqlPsgs="select * from passengers;";
$rowsPsgs=sel($sqlPsgs);

//新加乘客信息
$Name=$_GET['name'];
$Card=$_GET['card'];
$Tel=$_GET['tel'];


?>

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>预定-客车网上售票系统</title>
        <link rel="stylesheet" type="text/css" href="css/base.css"/>
        <link rel="stylesheet" type="text/css" href="css/others.css"/>
    </head>
    <body>
        <!--头部-->
        <div class="header">
            <div class="container clear">
                <div class="left"><a href="index.html"><img src="img/logo_pc.png"/></a></div>
                <div class="right clear">
                    <ul class="nav left clear">
                        <li><a href="index.html">首页</a></li>
                        <li class="active"><a href="ticketsOnline.html">在线订票</a></li>
                        <li><a href="newsList.html">新闻公告</a></li>
                        <li><a href="leftMessage.html">留言中心</a></li>
                        <li><a href="userInfo.html">个人中心</a></li>
                    </ul>
                    <div class="right btns-links">
                        <a href="login.html">登录</a>
                        <a href="register.html">注册</a>
                    </div>
                </div>
            </div>
        </div>
        <!--预定-->
        <div class="order-box">
            <div class="container clear">
                <div class="left order-info">
                    <div class="ticket-info">
                        <h3>车票信息</h3>
                        <table class="ticket-content" border="0" cellspacing="" cellpadding="">
                            <tr>
                                <th>起始站</th>
                                <th>到达站</th>
                                <th>发车时间</th>
                                <th>车次</th>
                                <th>价格</th>
                            </tr>
                            <tr>
                                <td><?php echo $rows[0]["startPosition"]?></td>
                                <td><?php echo $rows[0]["endPosition"]?></td>
                                <td>
                                    <p><?php echo explode(" ", $rows[0]['startTime'])[0]?></p>
                                    <p><?php echo explode(" ", $rows[0]['startTime'])[1]?></p>
                                </td>
                                <td><?php echo  $rows[0]["carName"]?></td>
                                <td style="color: red;">¥<?php echo  $rows[0]["ticketPrice"]?></td>
                            </tr>
                        </table>
                    </div>
                    <!-- <form action="payment.php?id=<?php echo $id;?>" method="post"> -->
                    <div class="ticket-info">
                        <h3>填写乘客信息</h3>
                        <?php if($rowsPsgs){?>
                        <div class="passengers-item">
                            <?php foreach ($rowsPsgs as $key=>$value){?>
                            <label data-id="<?php echo $rowsPsgs[$key]["passengersId"]?>" data-card="<?php echo $rowsPsgs[$key]["passengersCard"]?>" data-tel="<?php echo $rowsPsgs[$key]["passengersTel"]?>" data-name="<?php echo $rowsPsgs[$key]["passengersName"]?>"><input type="checkbox" name="" id="<?php echo $rowsPsgs[$key]["passengersId"]?>" value="" /><?php echo $rowsPsgs[$key]["passengersName"]?></label>
                            <?php }?>
                        </div>
                        <?php }?>
                        <table class="ticket-content ticket-content-passengers" border="0" cellspacing="" cellpadding="">
                            <tr>
                                <th>姓名</th>
                                <th>证件类型</th>
                                <th>证件号码</th>
                                <th>手机号</th>
                                <th>操作</th>
                            </tr>
                            <?php if(isset($Name)){?>
                            <!--
                            <tr>
                                <td><input  style="width: 100px;" type="text" name="passengers-name" id="passengers-name" value="<?php echo $Name;?>" /></td>
                                <td>
                                    <select name="cardType">
                                        <option value="sfz">身份证</option>
                                    </select>
                                </td>
                                <td><input type="text" name="passengers-card" id="passengers-card" value="<?php echo $Card;?>" /></td>
                                <td><input type="text" name="passengers-tel" id="passengers-tel" value="<?php echo $Tel;?>" /></td>
                                <td><a href="javascript:;" onclick="passengers_del(this,1)">删除</a></td>
                            </tr> 
                            -->
                            <?php }?>
                        </table>
                        <span class="add-btn" onclick="passengers_add('添加','orderpassengers-add.php?id=<?php echo $id;?>',600,450)">+添加乘客</span><span style="color:gray;font-size:12px;">(每个订单最多可选择3位乘客)</span>
                    </div>
                    <div class="ticket-info submit-box">
                        <p>注意 : 由于车站实名购票要求,请确保会员以及乘客的身份证信息真实有效。请携带与乘车人信息一致的身份证前往车站乘车, 购买半价票的旅客检票需携带户口本,
                            以免耽误你的行程。</p>
                        <input type="submit" class="submit" name="submit" id="submit" onclick="submit('payment.php?id=<?php echo $id;?>')" value="提交订单" />
                    </div>
                    <!-- </form> -->
                </div>
                <div class="right tips-info">
                    <div class="tips-box">
                        <h3>购票须知</h3>
                        <div class="tips-content">
                            <p>1.网页端目前仅支持购买售卖全价票。</p>
                            <p>2.支付成功会及时短信通知您购票结果;您也可以到订单中心查看出票情况。如果购票未成功,您的资金将在1-7个工作日内全额原路退至原支付账户。</p>
                            <p>3.请提前至少30分钟,凭取票短信或订单详情中显示的“取票号”、“取票密码”等信息及取票人身份证件前往出发车站取票。</p>
                            <p>4.服务费包含支付手续费、技术接入费、短信费等费用;出票成功、乘客自主线下窗口退票服务费不退还。因车站原因停售班次,联系巴士管家在线客服核实信息后,服务费将会退还至原账户,退还时间3-7个工作日。</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--优势-->
        <div class="register-advantage">
            <div class="container">
                <ul class="clear">
                    <li class="clear">
                        <div class="advantage-img left"><img src="img/icon_pinpaibaozheng.png"/></div>
                        <div class="left">
                            <h4>品牌保证</h4>
                            <p>提供正规的购票服务</p>
                        </div>
                    </li>
                    <li class="clear">
                        <div class="advantage-img left"><img src="img/icon_kuaisufankui.png"/></div>
                        <div class="left">
                            <h4>快速反馈</h4>
                            <p>第一时间短信通知</p>
                        </div>
                    </li>
                    <li class="clear">
                        <div class="advantage-img left"><img src="img/icon_fangbiankuaijie.png"/></div>
                        <div class="left">
                            <h4>方便快捷</h4>
                            <p>车站直接取票上车</p>
                        </div>
                    </li>
                    <li class="clear">
                        <div class="advantage-img left"><img src="img/icon_zhifufangbian.png"/></div>
                        <div class="left">
                            <h4>支付方便</h4>
                            <p>支付宝微信</p>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <!--底部-->
        <div class="register-footer">
            <p>客车网上售票系统官方电话    400-100-1234    0371-1234567    客车网上售票信息公示</p>
            <p>客车网上售票系统    Copyright&copy;2020-2030    版权所有   XXXXXX网络科技有限公司    豫ICP备15030935号-1</p>
        </div>
        <script src="js/jquery-3.5.1.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="layer/layer.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript">
            $(function(){
                $("label input").prop("checked",false);
                //点击添加乘客信息
                $("label input").change(function(e){
                    var dataId=$(this).parent().attr("data-id");
                    var dataCard=$(this).parent().attr("data-card");
                    var dataTel=$(this).parent().attr("data-tel");
                    var dataName=$(this).parent().attr("data-name");
                    if($(this).is(':checked')){
                        var newRow='<tr data-id="'+dataId+'"><td>'+
                        '<input  style="width: 100px;" type="text" name="passengers-name" id="passengers-name" value="'+dataName+'" />'+
                        '</td><td><select name="cardType"><option value="sfz">身份证</option></select></td>'+
                            '<td><input type="text" name="passengers-card" id="passengers-card" value="'+dataCard+'" /></td>'+
                            '<td><input type="text" name="passengers-tel" id="passengers-tel" value="'+dataTel+'" /></td>'+
                            '<td><a href="javascript:;"  onclick="passengers_del(this,1)">删除</a></td></tr>';
                            if($(".ticket-content-passengers tr").length<4){
                                $(".ticket-content tr:last").after(newRow);
                            }else{
                                alert("最多只能买3张");
                                $(this).prop("checked",false);
                            }
                        }else{
                            for(var i=1;i<$(".ticket-content-passengers tr").length;i++){
                                    if($(".ticket-content-passengers tr").eq(i).attr("data-id")==dataId){
                                        $(".ticket-content-passengers tr").eq(i).remove();
                                        break;
                                    }
                                }
                            }
                    });
                
                /* $(".add-btn").click(function(){
                    var newRow="<tr><td>"+
                            '<input  style="width: 100px;" type="text" name="passengers-name" id="passengers-name" value="" />'+
                            '</td><td><select name="cardType"><option value="sfz">身份证</option></select></td>'+
                                '<td><input type="text" name="passengers-card" id="passengers-card" value="" /></td>'+
                                '<td><input type="text" name="passengers-tel" id="passengers-tel" value="" /></td>'+
                                '<td><a href="javascript:;">删除</a></td></tr>';
                                if($(".ticket-content-passengers tr").length<4){
                                    $(".ticket-content tr:last").after(newRow);
                                }else{
                                    alert("最多只能买3张");
                                }
                }); */
            });
            //删除乘客信息
            function passengers_del(obj,id){
                layer.confirm("确认要删除吗?",function(){
                    $(obj).parents("tr").remove();
                    layer.msg('已删除!',{icon:1,time:1000});
                    for(var i=0;i<$("label").length;i++){
                        if($("label").eq(i).attr("data-id")==$(obj).parents("tr").attr("data-id")){
                            $("label").eq(i).find('input').prop("checked",false);
                            break;
                        }
                    }
                });
            }
            //添加乘客
            //添加成功信息
            function layer_show(title,url,w,h){
                layer.open({
                      title:title,
                      type: 2,
                      area: [w+"px", h+"px"],
                      fixed: false, //不固定
                      maxmin: true,
                      close:true,
                      content: url
                });
            }
            function passengers_add(title,url,w,h){
                layer_show(title,url,w,h);
            }
            //提交
            function submit(url){
                var num=$(".ticket-content-passengers tr").length-1;
                if(num==0){
                    layer.alert("请填写乘客信息");
                    return false;
                    }
                //存储一下  用户id 车票id==>url   乘客id  
                
                var aPId=new Array();
                for(var i=0;i<$('label').length;i++){
                    if($('label').eq(i).find("input").is(":checked")){
                        aPId.push($('label').eq(i).attr("data-id"));
                    }
                } 
                
                //此处请求后台程序,下方是成功后的前台处理……
                window.location.href=url+"&num="+num+"&arr="+aPId;
            }
        </script>
    </body>
</html>

前端个人中心我的订单:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>未完成订单-客车网上售票系统</title>
        <link rel="stylesheet" type="text/css" href="css/base.css"/>
        <link rel="stylesheet" type="text/css" href="css/userInfo.css"/>
    </head>
    <body>
        <!--头部-->
        <div class="header">
            <div class="container clear">
                <div class="left"><a href="index.html"><img src="img/logo_pc.png"/></a></div>
                <div class="right clear">
                    <ul class="nav left clear">
                        <li><a href="index.html">首页</a></li>
                        <li><a href="ticketsOnline.html">在线订票</a></li>
                        <li><a href="newsList.html">新闻公告</a></li>
                        <li><a href="leftMessage.html">留言中心</a></li>
                        <li class="active"><a href="userInfo.html">个人中心</a></li>
                    </ul>
                    <div class="right btns-links">
                        <a href="login.html">登录</a>
                        <a href="register.html">注册</a>
                    </div>
                </div>
            </div>
        </div>
        <!--个人中心-->
        <div class="userInfo-box">
            <div class="container clear">
                <div class="left w18">
                    <ul>
                        <li>
                            <h3>资料设置</h3>
                            <a href="userInfo.html">个人资料</a>
                            <a href="passengers.html">常用旅客</a>
                            <!--<a href="editPass.html">修改密码</a>-->
                        </li>
                        <li>
                            <h3>我的订单</h3>
                            <a href="orderUnfinished.html">未完成订单</a>
                            <a href="">未出行订单</a>
                            <a href="">历史订单</a>
                        </li>
                    </ul>
                </div>
                <div class="right w80">
                    <div class="userInfo-ctn orderUnfished-box">
                        <h3>未完成订单</h3>
                        <form action="" method="post" class="search-form">
                            <span>购票时间:</span>
                            <span>从</span><input type="date" name="startDate" id="" value="" />
                            <span>到</span><input type="date" name="endDate" id="" value="" />
                            <input type="submit" name="submit" id="submit" class="submit" value="筛选" />
                        </form>
                        <div class="orderUnfished-content">
                            <table border="0" cellspacing="" cellpadding="">
                                <tr>
                                    <td colspan="3">预定时间:2020-07-28 17:18:18</td>
                                    <td colspan="3">订单号:BO010702007</td>
                                </tr>
                                <tr>
                                    <td colspan="2">郑州--->周口</td>
                                    <td><p>2020.9.10</p><p>12:00:00</p></td>
                                    <td style="color: red;">¥60</td>
                                    <td>
                                        <p>车票状态</p>
                                        <p>已取消</p>
                                    </td>
                                    <td>
                                        <a href="ticketsOnline.html">重新购买</a><br />
                                        <a href="orderDetail.html">查看详情</a>
                                    </td>
                                </tr>
                            </table>
                            <table border="0" cellspacing="" cellpadding="">
                                <tr>
                                    <td colspan="3">预定时间:2020-07-28 17:18:18</td>
                                    <td colspan="3">订单号:BO010702007</td>
                                </tr>
                                <tr>
                                    <td colspan="2">郑州--->周口</td>
                                    <td><p>2020.9.10</p><p>12:00:00</p></td>
                                    <td style="color: red;">¥60</td>
                                    <td>
                                        <p>车票状态</p>
                                        <p>已取消</p>
                                    </td>
                                    <td>
                                        <a href="javascript:;">重新购买</a><br />
                                        <a href="javascript:;">查看详情</a>
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--优势-->
        <div class="register-advantage">
            <div class="container">
                <ul class="clear">
                    <li class="clear">
                        <div class="advantage-img left"><img src="img/icon_pinpaibaozheng.png"/></div>
                        <div class="left">
                            <h4>品牌保证</h4>
                            <p>提供正规的购票服务</p>
                        </div>
                    </li>
                    <li class="clear">
                        <div class="advantage-img left"><img src="img/icon_kuaisufankui.png"/></div>
                        <div class="left">
                            <h4>快速反馈</h4>
                            <p>第一时间短信通知</p>
                        </div>
                    </li>
                    <li class="clear">
                        <div class="advantage-img left"><img src="img/icon_fangbiankuaijie.png"/></div>
                        <div class="left">
                            <h4>方便快捷</h4>
                            <p>车站直接取票上车</p>
                        </div>
                    </li>
                    <li class="clear">
                        <div class="advantage-img left"><img src="img/icon_zhifufangbian.png"/></div>
                        <div class="left">
                            <h4>支付方便</h4>
                            <p>支付宝微信</p>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <!--底部-->
        <div class="register-footer">
            <p>客车网上售票系统官方电话    400-100-1234    0371-1234567    客车网上售票信息公示</p>
            <p>客车网上售票系统    Copyright&copy;2020-2030    版权所有   XXXXXX网络科技有限公司    豫ICP备15030935号-1</p>
        </div>
    </body>
</html>

在这里插入图片描述

订单详情页:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>订单详情-客车网上售票系统</title>
        <link rel="stylesheet" type="text/css" href="css/base.css"/>
        <link rel="stylesheet" type="text/css" href="css/userInfo.css"/>
    </head>
    <body>
        <!--头部-->
        <div class="header">
            <div class="container clear">
                <div class="left"><a href="index.html"><img src="img/logo_pc.png"/></a></div>
                <div class="right clear">
                    <ul class="nav left clear">
                        <li><a href="index.html">首页</a></li>
                        <li><a href="ticketsOnline.html">在线订票</a></li>
                        <li><a href="newsList.html">新闻公告</a></li>
                        <li><a href="leftMessage.html">留言中心</a></li>
                        <li class="active"><a href="userInfo.html">个人中心</a></li>
                    </ul>
                    <div class="right btns-links">
                        <a href="login.html">登录</a>
                        <a href="register.html">注册</a>
                    </div>
                </div>
            </div>
        </div>
        <!--个人中心-->
        <div class="userInfo-box">
            <div class="container clear">
                <div class="left w18">
                    <ul>
                        <li>
                            <h3>资料设置</h3>
                            <a href="userInfo.html">个人资料</a>
                            <a href="passengers.html">常用旅客</a>
                            <!--<a href="editPass.html">修改密码</a>-->
                        </li>
                        <li>
                            <h3>我的订单</h3>
                            <a href="orderUnfinished.html">未完成订单</a>
                            <a href="">未出行订单</a>
                            <a href="">历史订单</a>
                        </li>
                    </ul>
                </div>
                <div class="right w80">
                    <!--车票信息-->
                    <div class="ticket-info">
                        <h3 class="clear">
                            <span>订单状态:已取消</span>
                            <span>预订时间:2020-7-29 10:00:00</span>
                            <span>订单号:BO00010101</span>
                        </h3>
                        <table class="ticket-content" border="0" cellspacing="" cellpadding="">
                            <tr>
                                <th>起始站</th>
                                <th>到达站</th>
                                <th>发车时间</th>
                                <th>车次</th>
                                <th>价格</th>
                            </tr>
                            <tr>
                                <td>郑州</td>
                                <td>周口</td>
                                <td><p>2020.9.10</p><p>12:00:00</p></td>
                                <td>ZZ0001</td>
                                <td style="color: red;">¥100</td>
                            </tr>
                        </table>
                    </div>
                    <!--乘客信息-->
                    <div class="ticket-info">
                        <h3 class="clear">
                            <span>乘客信息</span>
                        </h3>
                        <table class="ticket-content" border="0" cellspacing="" cellpadding="">
                            <tr>
                                <th>乘客姓名</th>
                                <th>乘客类型</th>
                                <th>证件号</th>
                                <th>手机号</th>
                            </tr>
                            <tr>
                                <td>小米</td>
                                <td>成人</td>
                                <td>112727199110100712</td>
                                <td>13690902892</td>
                            </tr>
                            <tr>
                                <td>小米</td>
                                <td>成人</td>
                                <td>112727199110100712</td>
                                <td>13690902892</td>
                            </tr>
                        </table>
                    </div>
                    <!--支付金额-->
                    <div class="ticket-info">
                        <h3 class="clear">
                            <span>支付金额</span>
                        </h3>
                        <table class="ticket-content" border="0" cellspacing="" cellpadding="">
                            <tr>
                                <td><span style="color: red;">100元</span>(成人票50元x2人)</td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        <!--优势-->
        <div class="register-advantage">
            <div class="container">
                <ul class="clear">
                    <li class="clear">
                        <div class="advantage-img left"><img src="img/icon_pinpaibaozheng.png"/></div>
                        <div class="left">
                            <h4>品牌保证</h4>
                            <p>提供正规的购票服务</p>
                        </div>
                    </li>
                    <li class="clear">
                        <div class="advantage-img left"><img src="img/icon_kuaisufankui.png"/></div>
                        <div class="left">
                            <h4>快速反馈</h4>
                            <p>第一时间短信通知</p>
                        </div>
                    </li>
                    <li class="clear">
                        <div class="advantage-img left"><img src="img/icon_fangbiankuaijie.png"/></div>
                        <div class="left">
                            <h4>方便快捷</h4>
                            <p>车站直接取票上车</p>
                        </div>
                    </li>
                    <li class="clear">
                        <div class="advantage-img left"><img src="img/icon_zhifufangbian.png"/></div>
                        <div class="left">
                            <h4>支付方便</h4>
                            <p>支付宝微信</p>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <!--底部-->
        <div class="register-footer">
            <p>客车网上售票系统官方电话    400-100-1234    0371-1234567    客车网上售票信息公示</p>
            <p>客车网上售票系统    Copyright&copy;2020-2030    版权所有   XXXXXX网络科技有限公司    豫ICP备15030935号-1</p>
        </div>
    </body>
</html>

在这里插入图片描述

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值