Java的新项目学成在线笔记-day9（十二）

4.2.5 测试
使用swagger-ui或postman测试本接口。
4.3 课程信息模板设计

在确定了静态化所需要的数据模型之后，就可以编写页面模板了，课程详情页面由多个静态化页面组成，所以我们需要创建多个页面模板，本章节创建课程详情页面的主模板，即课程信息模板。
4.3.1 模板内容
完整的模板请参考 “资料\课程详情页面模板\course.ftl“ 文件，下边列出模板中核心的内容：
课程基本信息：

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

@Override @GetMapping("/courseview/{id}") public CourseView courseview(@PathVariable("id") String id) {

return courseService.getCoruseView(id); }

<div class="banner‐left">

<p class="tit">${courseBase.name}</p>

<p class="pic"><span class="new‐pic">特惠价格￥${courseMarket.price}</span>

<span class="old‐pic">原价￥${courseMarket.price_old!}</span></p>

<p class="info">

<a href="http://ucenter.xuecheng.com/#/learning/${courseBase.id}/0" target="_blank" v‐if="learnstatus == 1" v‐cloak>马上学习</a> <a href="#" @click="addopencourse" v‐if="learnstatus == 2" v‐cloak>立即报名</a>

<a href="#" @click="buy" v‐if="learnstatus == 3" v‐cloak>立即购买</a>

<span><em>难度等级</em> <#if courseBase.grade=='200001'>

低级

<#elseif courseBase.grade=='200002'> 中级

<#elseif courseBase.grade=='200003'>

高级

</#if>

</span>

<span><em>课程时长</em><stat v‐text="course_stat.s601001"></stat>

</span>

<span><em>评分</em><stat v‐text="course_stat.s601002"></stat></span>

<span><em>授课模式</em>

<#if courseBase.studymodel=='201001'> 自由学习

<#elseif courseBase.studymodel=='201002'> 任务式学习

</#if>

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

</span>

</p>

</div>

<div class="banner‐rit">

<#if coursePic.pic??>

<p><img src="http://img.xuecheng.com/${coursePic.pic}" alt="" width="270" height="156"> </p>

<#else>

<p><img src="/static/img/widget‐video.png" alt="" width="270" height="156"> </p>

</#if>

<p class="vid‐act"><span> <i class="i‐heart"></i>收藏 <stat vtext="course_stat.s601003"></stat> </span>

<span>分享 <i class="i‐weixin"></i><i class="i‐qq"> </i></span></p>

</div>

课程计划

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

<div class="content"> <#if teachplanNode.children??>

<#list teachplanNode.children as firstNode>

<div class="item">

<div class="title act"><i class="i‐chevron‐top"> </i>${firstNode.pname}</div> <div class="about">${firstNode.description!}</div>

<div class="drop‐down" style="height: ${firstNode.children? size * 50}px;">

<ul class="list‐box">

<#list firstNode.children as secondNode>

<li>${secondNode.pname}</li>

</#list>

</ul>

</div>

</#list>

</#if>

</div>

页头：
局部代码如下：

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

<body data‐spy="scroll" data‐target="#articleNavbar" data‐offset="150">

<!‐‐ 页面头部 ‐‐>

<!‐‐#include virtual="/include/header.html"‐‐>

页尾：
局部代码如下：

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

<!‐‐ 页面底部 ‐‐>

<!‐‐底部版权‐‐>

<!‐‐#include virtual="/include/footer.html"‐‐>

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

动态脚本文件：

<script>

//课程id

var courseId = "template" </script>

<!‐‐#include virtual="/include/course_detail_dynamic.html"‐‐>

教师信息文件：

从课程数据中获取课程所属的教师Id，这里由于教师信息管理功能没有开发我们使用固定的教师信息文件：

教育机构文件：

同教师信息一样，由于教育机构功能模块没有开发，这里我们使用固定的教育机构文件：

<div class="about‐teach">

<!‐‐机构信息‐‐>

<!‐‐#include virtual="/company/company_info_template.html"‐‐>

</div>

Java的新项目学成在线笔记-day9（十二）

猜你喜欢