黑马程序员技术交流社区

标题: 【郑州校区】传智健康项目讲义第七章 六 [打印本页]

---

作者: 我是楠楠    时间: 2019-11-7 11:16
标题: 【郑州校区】传智健康项目讲义第七章 六

【郑州校区】传智健康项目讲义第七章 六

3. 预约成功页面展示
前面已经完成了体检预约，预约成功后页面会跳转到成功提示页面
（orderSuccess.html）并展示预约的相关信息（体检人、体检套餐、体检时间等）。
3.1 页面调整
提供orderSuccess.html页面，展示预约成功后相关信息

[AppleScript] 纯文本查看 复制代码

 <div class="info‐title">

<span class="name">体检预约成功</span>

</div>

<div class="notice‐item">

<div class="item‐title">预约信息</div>

<div class="item‐content">

<p>体检人：{{orderInfo.member}}</p>

<p>体检套餐：{{orderInfo.setmeal}}</p>

<p>体检日期：{{orderInfo.orderDate}}</p>

<p>预约类型：{{orderInfo.orderType}}</p>

</div>

</div>

[AppleScript] 纯文本查看 复制代码

<script>

//从请求URL根据参数名获取对应值，orderId为预约id

var id = getUrlParam("orderId");

</script>

<script>

var vue = new Vue({

el:'#app',

data:{

orderInfo:{}

},

mounted(){

axios.post("/order/findById.do?id=" + id).then((response) => {

this.orderInfo = response.data.data;

});

}

});

</script> 

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2