gitee/course-tencent-cloud
1
0
Fork 0
mirror of https://gitee.com/koogua/course-tencent-cloud.git synced 2025-07-15 21:02:20 +08:00
Code Issues Releases Wiki Activity

整理代码

Browse Source
This commit is contained in:
xiaochong0302 2020-05-22 19:42:21 +08:00
parent 772e0f2d7e
commit 5e8e179fe8
9 changed files with 262 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/Http/Web/Controllers/CourseController.php
View File

@ -30,6 +30,8 @@ class CourseController extends Controller
$pager = $service->handle();
$pager->items = kg_array_object($pager->items);
$service = new CourseQueryService();
$topCategories = $service->handleTopCategories();

6
app/Http/Web/Controllers/SearchController.php
View File

@ -16,9 +16,9 @@ class SearchController extends Controller
use ResponseTrait;
/**
* @Get("/", name="web.search.show")
* @Get("/", name="web.search.list")
*/
public function showAction()
public function listAction()
{
$query = $this->request->get('query', ['trim']);
@ -34,6 +34,8 @@ class SearchController extends Controller
$pager = $service->handle();
$pager->items = kg_array_object($pager->items);
$this->view->setVar('hot_queries', $hotQueries);
$this->view->setVar('related_queries', $relatedQueries);
$this->view->setVar('pager', $pager);

40
app/Http/Web/Views/course/list.volt
View File

@ -3,7 +3,7 @@
{% block content %}
<div class="course-filter">
<div class="course-filter-group">
<div class="filter-group">
<div class="title">方向</div>
<div class="content">
{% for category in top_categories %}
@ -13,7 +13,7 @@
</div>
</div>
{% if sub_categories %}
<div class="course-filter-group">
<div class="filter-group">
<div class="title">分类</div>
<div class="content">
{% for category in sub_categories %}
@ -23,7 +23,7 @@
</div>
</div>
{% endif %}
<div class="course-filter-group">
<div class="filter-group">
<div class="title">类型</div>
<div class="content">
{% for model in models %}
@ -32,7 +32,7 @@
{% endfor %}
</div>
</div>
<div class="course-filter-group">
<div class="filter-group">
<div class="title">难度</div>
<div class="content">
{% for level in levels %}
@ -41,27 +41,41 @@
{% endfor %}
</div>
</div>
</div>
<div class="course-sort">
<div class="filter-group">
<div class="title">排序</div>
<div class="content">
{% for sort in sorts %}
{% set class = request.get('sort','trim','score') == sort.id ? 'layui-badge active' : 'layui-badge' %}
{% set class = request.get('sort','trim','score') == sort.id ? 'layui-btn layui-btn-xs' : 'none' %}
<a class="{{ class }}" href="{{ sort.url }}">{{ sort.name }}</a>
{% endfor %}
</div>
</div>
</div>
<div class="course-list layui-clear">
<div class="course-list clearfix">
{% for item in pager.items %}
<div class="course-card">
<div class="cover">
<a href="{{ url({'for':'web.course.show','id':item['id']}) }}" title="{{ item['title'] }}">
<img src="{{ item['cover'] }}!cover_270" alt="{{ item['title'] }}">
<a href="{{ url({'for':'web.course.show','id':item.id}) }}" title="{{ item.title }}">
<img src="{{ item.cover }}!cover_270" alt="{{ item.title }}">
</a>
</div>
<div class="title">
<a href="{{ url({'for':'web.course.show','id':item['id']}) }}" title="{{ item['title'] }}">{{ substr(item['title'],0,18) }}</a>
<a href="{{ url({'for':'web.course.show','id':item.id}) }}" title="{{ item.title }}">{{ substr(item.title,0,15) }}</a>
</div>
<div class="meta">
{% if item.market_price > 0 %}
<span class="price">￥{{ item.market_price }}</span>
<span class="level">中级</span>
<span class="lesson">{{ item.lesson_count }}节课</span>
<span class="user">{{ item.user_count }}人购买</span>
{% else %}
<span class="free">免费</span>
<span class="level">中级</span>
<span class="lesson">{{ item.lesson_count }}节课</span>
<span class="user">{{ item.user_count }}人报名</span>
{% endif %}
</div>
<div class="info"></div>
</div>
{% endfor %}
</div>

24
app/Http/Web/Views/index/index.volt
View File

@ -14,7 +14,7 @@
{% for category in courses %}
{% set class = loop.first ? 'layui-tab-item layui-show' : 'layui-tab-item' %}
<div class="{{ class }}">
<div class="course-list layui-clear">
<div class="module-course-list clearfix">
{% for course in category.courses %}
<div class="course-card">
<div class="cover">
@ -25,7 +25,19 @@
<div class="title">
<a href="{{ url({'for':'web.course.show','id':course.id}) }}" title="{{ course.title }}">{{ substr(course.title,0,15) }}</a>
</div>
<div class="info"></div>
<div class="meta">
{% if course.market_price > 0 %}
<span class="price">￥{{ course.market_price }}</span>
<span class="level">中级</span>
<span class="lesson">{{ course.lesson_count }}节课</span>
<span class="user">{{ course.user_count }}人购买</span>
{% else %}
<span class="free">免费</span>
<span class="level">中级</span>
<span class="lesson">{{ course.lesson_count }}节课</span>
<span class="user">{{ course.user_count }}人报名</span>
{% endif %}
</div>
</div>
{% endfor %}
</div>
@ -35,13 +47,13 @@
</div>
{%- endmacro %}
<div class="index-module">
<div class="index-module index-carousel">
<div class="layui-carousel" id="carousel">
<div class="carousel" carousel-item>
{% for slide in slides %}
<div class="item" style="{{ slide.style }}">
<a href="{{ slide.url }}">
<img src="{{ slide.cover }}" alt="{{ slide.title }}">
<img class="slide" src="{{ slide.cover }}" alt="{{ slide.title }}">
</a>
</div>
{% endfor %}
@ -80,8 +92,8 @@
var flow = layui.flow;
carousel.render({
elem: '#carousel',
width: '600px',
height: '338px'
width: '100%',
height: '270px'
});
flow.lazyimg();
});

13
app/Http/Web/Views/partials/footer.volt
View File

@ -1,14 +1,19 @@
<div class="bottom-nav">
<div class="layui-main">
<div class="left">
<div class="bottom-nav">
{% for nav in site_navs.bottom %}
<a href="{{ nav.url }}" target="{{ nav.target }}">{{ nav.name }}</a>
{% endfor %}
</div>
<div class="copyright">
{{ site_settings.copyright }}
</div>
<div class="copyright">
<span>{{ site_settings.copyright }}</span>
{% if site_settings.icp_sn %}
<a href="{{ site_settings.icp_link }}">{{ site_settings.icp_sn }}</a>
{% endif %}
{% if site_settings.police_sn %}
<a href="{{ site_settings.police_link }}">{{ site_settings.police_sn }}</a>
{% endif %}
</div>
</div>
<div class="right"></div>
</div>

4
app/Http/Web/Views/partials/header.volt
View File

@ -22,9 +22,9 @@
</div>
<div class="search">
<form class="layui-form" action="{{ url({'for':'web.search.show'}) }}">
<form class="layui-form" action="{{ url({'for':'web.search.list'}) }}">
<div class="layui-inline">
<input type="text" name="q" placeholder="请输入课程关键字...">
<input class="layui-input" type="text" name="query" autocomplete="off" placeholder="请输入课程关键字...">
</div>
</form>
</div>

39
app/Http/Web/Views/search/list.volt Normal file
View File

@ -0,0 +1,39 @@
{% extends 'templates/base.volt' %}
{% block content %}
<div class="search-course-list">
{% for item in pager.items %}
<div class="search-course-card">
<div class="cover">
<a href="{{ url({'for':'web.course.show','id':item.id}) }}" title="{{ item.title|e }}">
<img src="{{ item.cover }}!cover_270" alt="{{ item.title|e }}">
</a>
</div>
<div class="info">
<div class="title">
<a href="{{ url({'for':'web.course.show','id':item.id}) }}" title="{{ item.title|e }}">{{ item.title }}</a>
</div>
<div class="meta">
{% if item.market_price > 0 %}
<span class="price">￥{{ item.market_price }}</span>
<span class="level">中级</span>
<span class="lesson">{{ item.lesson_count }}节课</span>
<span class="user">{{ item.user_count }}人购买</span>
{% else %}
<span class="free">免费</span>
<span class="level">中级</span>
<span class="lesson">{{ item.lesson_count }}节课</span>
<span class="user">{{ item.user_count }}人报名</span>
{% endif %}
</div>
</div>
</div>
{% endfor %}
</div>
<div class="pager">
{{ partial('partials/pager') }}
</div>
{% endblock %}

12
app/Http/Web/Views/templates/base.volt
View File

@ -29,8 +29,18 @@
{{ js_include('lib/layui/layui.js') }}
<script>
layui.use(['element'], function () {
layui.use(['element', 'util'], function () {
var element = layui.element;
var util = layui.util;
util.fixbar({
bar1: true,
click: function (type) {
console.log(type);
if (type === 'bar1') {
alert('点击了bar1');
}
}
});
})
</script>

159
public/static/web/css/common.css
View File

@ -1,7 +1,3 @@
.layui-badge, .layui-badge-rim, .layui-badge-dot {
padding-bottom: 1px;
}
.clearfix:after {
display: block;
clear: both;
@ -14,16 +10,68 @@
zoom: 1
}
.float-left {
.fl {
float: left;
}
.float-right {
.fr {
float: right;
}
#header {
left: 0;
top: 0;
width: 100%;
z-index: 1000;
position: fixed;
background-color: #393D49 !important;
}
.logo {
}
.top-nav {
margin-left: 100px;
}
.search {
position: absolute;
top: 15px;
right: 240px;
}
.search .layui-input {
height: 30px;
font-size: 12px;
}
#main {
margin-top: 80px;
margin-bottom: 40px;
}
#footer {
padding: 30px 0;
text-align: center;
background: #474443;
}
#footer span, #footer a {
color: #999;
}
#footer a:hover {
color: #fff;
}
.bottom-nav, .copyright {
margin-bottom: 10px;
line-height: 18px;
}
.bottom-nav a, .copyright span, .copyright a {
margin-right: 10px;
}
.pager {
@ -39,7 +87,7 @@
}
.index-module .layui-tab-content {
padding: 20px 10px;
padding: 20px 0;
}
.index-module .header {
@ -52,15 +100,64 @@
}
.index-carousel {
margin-bottom: 30px;
text-align: center;
}
.index-carousel .slide {
width: auto;
height: 270px;
max-height: 270px;
}
/**
*search
*/
.search-course-card .cover {
width: 210px;
height: 118px;
margin-bottom: 10px;
}
.search-course-card .cover img {
width: 100%;
height: 100%;
}
.search-course-card .title {
width: 210px;
white-space: nowrap;
margin-bottom: 10px;
overflow: hidden;
}
.search-course-card .meta {
color: #999;
font-size: 12px;
}
.search-course-card .meta span {
margin-right: 10px;
}
.search-course-card .price {
color: red;
}
.search-course-card .free {
color: green;
}
.course-card {
float: left;
width: 25%;
height: 250px;
width: 20%;
height: 200px;
}
.course-card .cover {
width: 270px;
height: 148px;
width: 210px;
height: 118px;
margin-bottom: 10px;
}
@ -70,40 +167,60 @@
}
.course-card .title {
width: 210px;
white-space: nowrap;
margin-bottom: 10px;
overflow: hidden;
}
.course-card .info {
.course-card .meta {
color: #999;
font-size: 12px;
}
.course-meta .left {
float: left;
.course-card .meta span {
margin-right: 10px;
}
.course-card .price {
color: red;
}
.course-card .free {
color: green;
}
.course-filter {
margin-bottom: 15px;
margin-bottom: 20px;
}
.course-filter-group {
.filter-group {
height: 40px;
line-height: 40px;
margin-bottom: 15px;
clear: both;
}
.course-filter-group .title {
.filter-group .title {
float: left;
width: 50px;
font-weight: 700;
}
.course-filter-group .content {
.filter-group .content {
float: left;
}
.course-filter-group .content a {
.filter-group .content a {
margin-right: 15px;
}
.course-list {
margin-bottom: 20px;
}
.course-meta .left {
float: left;
}
.course-meta .right {
float: right;
}