4.2 Course Data Model Query Interface
Static operation requires model data to be static. Course data model is provided by Course Management Service and is only used by Course Static Program calls.(
4.2.1 Interface Definitions
1. Response Result Type

@Data
@ToString
@NoArgsConstructor
public class CourseView implements Serializable {
CourseBase courseBase;//Basic Information
CourseMarket courseMarket;//Course Marketing
CoursePic coursePic;//Course Pictures
TeachplanNode TeachplanNode;//Teaching Plan
}

2. Request Type
String: Course id
3. The interface is defined as follows

@ApiOperation(
"
Course View Query
"
)
public CourseView courseview(String id);

4.2.2 Dao 
You need to query course_base, course_market, course_pic, teachplan and other information to create a new course marketing dao. Other Daos already exist and need not be built.

public interface CourseMarketRepository extends JpaRepository<CourseMarket,String> {
}

4.2.3 Service

//Course View Query [/size][/font]
[font=Microsoft YaHei][size=3]public CourseView getCoruseView(String id) {
CourseView courseView = new CourseView();
//Query course basic information
Optional<CourseBase> optional =
courseBaseRepository
.findById(id);
if(optional.isPresent()){
CourseBase courseBase
=
optional.
get();
courseView.setCourseBase(courseBase);
}
//Query course marketing information
Optional<CourseMarket> courseMarketOptional =
courseMarketRepository
.findById(id);
if(courseMarketOptional.isPresent()){
CourseMarket courseMarket
=
courseMarketOptional.
get();
courseView.setCourseMarket(courseMarket);
}
//Query course picture information
Optional<CoursePic> picOptional =
coursePicRepository
.findById(id);
if(picOptional.isPresent()){
CoursePic coursePic
=
picOptional.
get();
courseView.setCoursePic(picOptional.
get());
}
//Query course plan information
TeachplanNode teachplanNode
=
teachplanMapper.selectList(id);
courseView.setTeachplanNode(teachplanNode);
return courseView;
}

4.2.4 Controller

@Override[/size][/font]
[font=Microsoft YaHei][size=3]@GetMapping(
"
/courseview/{id}
"
)
public CourseView courseview(@PathVariable(
"
id
"
) String id) {
return courseService.
getCoruseView(id);
}

4.2.5 Testing
Use swagger-ui or postman to test this interface.(

4.3 Course Information Template Design
Once you have determined the data model you need for the statization, you can write a page template. The course details page consists of several static pages, so we need to create several page templates. This section creates the main template for the course details page, which is the course information template.
4.3.1 Template Content
The complete template refers to the "MaterialsCourse Details Page Template\course.ftl" file, which lists the core content of the template below:
Course Basic Information:

<div class
=
"
banner
‐
left
"
>
<p class
=
"
tit
"
>${courseBase.name}</p>
<p class
=
"
pic
"
><span class
=
"
new
‐
pic
"
>Preferential Price￥${courseMarket.
price}</span> <span
class
=
"
old
‐
pic
"
>Original price￥${courseMarket.
price_old!}</span></p>
<p class
=
"
info
"
>
<a href=
"
[url]http://ucenter.xuecheng[/url]
.com/#/learning/${courseBase.id}/0
"
target
=
"
_blank
"
v
‐
if=
"
learnstatus
== 1
"
v
‐
cloak>Learn now</a>
<a href=
"
#
"
@click=
"
addopencourse
"
v
‐
if=
"
learnstatus
== 2
"
v
‐
cloak>Sign up now</a>
<a href=
"
#
"
@click=
"
buy
"
v
‐
if=
"
learnstatus
==
3
"
v
‐
cloak>Buy now</a>
<span><em>Difficulty level</em>
<#if courseBase.
grade
==
'
200001
'
>
//Lower
<#elseif courseBase.
grade
==
'
200002
'
>
//intermediate
<#elseif courseBase.
grade
==
'
200003
'
>
//senior
</#if>
</span>
<span><em>Course duration</em><stat v
‐
text
=
"
course_stat.s601001
"
></stat>
</span>
<span><em>score</em><stat v
‐
text
=
"
course_stat.s601002
"
></stat></span>
<span><em>Teaching Mode</em>
<#if courseBase.studymodel==
'
201001
'
>
//Free learning
<#elseif courseBase.studymodel==
'
201002
'
>
//Task-based Learning
</#if>
</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>Collection <stat v
‐
text
=
"
course_stat.s601003
"
></stat> </span> <span>share <i class
=
"
i
‐
weixin
"
></i><i class
=
"
i
‐
qq
"
>
</i></span></p>
</div>

Course plan:

<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>
</div>
</#list>
</#if>
</div>

Header:
The local code is as follows:

<body data
‐
spy
=
"
scroll
"
data
‐
target
=
"
#articleNavbar
"
data
‐
offset
=
"
150
"
>
<!
‐‐
//Header of Page
‐‐
>
<!
‐‐
#include virtual=
"
/include/header.html
"
‐‐
>

End of page:
The local code is as follows:

<!
‐‐
Bottom of page
‐‐
>
<!
‐‐
Bottom Copyright
‐‐
>
<!
‐‐
#include virtual=
"
/include/footer.html
"
‐‐
>

Dynamic script file:

<script>
//Course id
var courseId
=
"
template
"
</script>
<!
‐‐
#include virtual=
"
/include/course_detail_dynamic.html
"
‐‐
>

Teacher information file:
Obtain the Teacher Id of the course from the course data, where we use a fixed Teacher Information File because the Teacher Information Management function is not developed:

<div class
=
"
content
‐
com course
"
>
<div class
=
"
title
"
><span>Course making</span></div>
<!
‐‐
#include virtual=
"
/teacher/teacher_info_template01.html
"
‐‐
>
</div>

Educational Institution Documentation:
As with teacher information, we use a fixed educational institution file here because the educational institution function module has not been developed:

<div class
=
"
about
‐
teach
"
>
<!
‐‐
//Institutional Information
‐‐
>
<!
‐‐
#include virtual=
"
/company/company_info_template.html
"
‐‐
>
</div>