From 75f969c874fa70831fd8750960066446b4ac98bd Mon Sep 17 00:00:00 2001 From: xiaochong0302 Date: Sat, 23 May 2020 20:06:35 +0800 Subject: [PATCH] =?UTF-8?q?=E6=95=B4=E7=90=86=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/Http/Web/Services/CourseQuery.php | 2 +- app/Http/Web/Views/course/list.volt | 79 +-------------- app/Http/Web/Views/course/list_filter.volt | 50 ++++++++++ app/Http/Web/Views/partials/header.volt | 4 +- app/Http/Web/Views/partials/macro_course.volt | 47 +++++++++ app/Http/Web/Views/partials/pager.volt | 12 ++- app/Http/Web/Views/search/content_course.volt | 35 +++++++ app/Http/Web/Views/search/content_other.volt | 6 ++ app/Http/Web/Views/search/list.volt | 51 ++++------ app/Http/Web/Views/search/sidebar.volt | 21 ++++ public/static/admin/css/common.css | 2 +- public/static/web/css/common.css | 98 ++++++++++++++++--- 12 files changed, 279 insertions(+), 128 deletions(-) create mode 100644 app/Http/Web/Views/course/list_filter.volt create mode 100644 app/Http/Web/Views/partials/macro_course.volt create mode 100644 app/Http/Web/Views/search/content_course.volt create mode 100644 app/Http/Web/Views/search/content_other.volt create mode 100644 app/Http/Web/Views/search/sidebar.volt diff --git a/app/Http/Web/Services/CourseQuery.php b/app/Http/Web/Services/CourseQuery.php index ef547743..92a65247 100644 --- a/app/Http/Web/Services/CourseQuery.php +++ b/app/Http/Web/Services/CourseQuery.php @@ -223,7 +223,7 @@ class CourseQuery extends Service $params['tc'] = $query['tc']; } - if (isset($query['sc']) && $query['tc'] != 'all') { + if (isset($query['sc']) && $query['sc'] != 'all') { $validator->checkSubCategory($query['sc']); $params['sc'] = $query['sc']; } diff --git a/app/Http/Web/Views/course/list.volt b/app/Http/Web/Views/course/list.volt index b0870473..23de18fa 100644 --- a/app/Http/Web/Views/course/list.volt +++ b/app/Http/Web/Views/course/list.volt @@ -2,86 +2,15 @@ {% block content %} -
-
-
方向
-
- {% for category in top_categories %} - {% set class = request.get('tc','int','all') == category.id ? 'layui-btn layui-btn-xs' : 'none' %} - {{ category.name }} - {% endfor %} -
-
- {% if sub_categories %} -
-
分类
-
- {% for category in sub_categories %} - {% set class = request.get('sc','int','all') == category.id ? 'layui-btn layui-btn-xs' : 'none' %} - {{ category.name }} - {% endfor %} -
-
- {% endif %} -
-
类型
-
- {% for model in models %} - {% set class = request.get('model','trim','all') == model.id ? 'layui-btn layui-btn-xs' : 'none' %} - {{ model.name }} - {% endfor %} -
-
-
-
难度
-
- {% for level in levels %} - {% set class = request.get('level','trim','all') == level.id ? 'layui-btn layui-btn-xs' : 'none' %} - {{ level.name }} - {% endfor %} -
-
-
-
排序
-
- {% for sort in sorts %} - {% set class = request.get('sort','trim','score') == sort.id ? 'layui-btn layui-btn-xs' : 'none' %} - {{ sort.name }} - {% endfor %} -
-
-
+ {{ partial('course/list_filter') }}
+ {{ partial('partials/macro_course') }} {% for item in pager.items %} -
-
- - {{ item.title }} - -
-
- {{ substr(item.title,0,15) }} -
-
- {% if item.market_price > 0 %} - ￥{{ item.market_price }} - 中级 - {{ item.lesson_count }}节课 - {{ item.user_count }}人购买 - {% else %} - 免费 - 中级 - {{ item.lesson_count }}节课 - {{ item.user_count }}人报名 - {% endif %} -
-
+ {{ course_card(item) }} {% endfor %}
-
- {{ partial('partials/pager') }} -
+ {{ partial('partials/pager') }} {% endblock %} \ No newline at end of file diff --git a/app/Http/Web/Views/course/list_filter.volt b/app/Http/Web/Views/course/list_filter.volt new file mode 100644 index 00000000..33756cd9 --- /dev/null +++ b/app/Http/Web/Views/course/list_filter.volt @@ -0,0 +1,50 @@ +
+
+
方向
+
+ {% for category in top_categories %} + {% set class = request.get('tc','int','all') == category.id ? 'layui-btn layui-btn-xs' : 'none' %} + {{ category.name }} + {% endfor %} +
+
+ {% if sub_categories %} +
+
分类
+
+ {% for category in sub_categories %} + {% set class = request.get('sc','int','all') == category.id ? 'layui-btn layui-btn-xs' : 'none' %} + {{ category.name }} + {% endfor %} +
+
+ {% endif %} +
+
类型
+
+ {% for model in models %} + {% set class = request.get('model','trim','all') == model.id ? 'layui-btn layui-btn-xs' : 'none' %} + {{ model.name }} + {% endfor %} +
+
+
+
难度
+
+ {% for level in levels %} + {% set class = request.get('level','trim','all') == level.id ? 'layui-btn layui-btn-xs' : 'none' %} + {{ level.name }} + {% endfor %} +
+
+
+
排序
+
+ {% for sort in sorts %} + {% set class = request.get('sort','trim','score') == sort.id ? 'layui-btn layui-btn-xs' : 'none' %} + {{ sort.name }} + {% endfor %} +
+
+
+ diff --git a/app/Http/Web/Views/partials/header.volt b/app/Http/Web/Views/partials/header.volt index 744f0e21..aed135ad 100644 --- a/app/Http/Web/Views/partials/header.volt +++ b/app/Http/Web/Views/partials/header.volt @@ -23,9 +23,7 @@
-
- -
+
diff --git a/app/Http/Web/Views/partials/macro_course.volt b/app/Http/Web/Views/partials/macro_course.volt new file mode 100644 index 00000000..c7e4fe29 --- /dev/null +++ b/app/Http/Web/Views/partials/macro_course.volt @@ -0,0 +1,47 @@ +{%- macro model_info(value) %} + {% if value == 'vod' %} + 点播 + {% elseif value == 'live' %} + 直播 + {% elseif value == 'read' %} + 图文 + {% endif %} +{%- endmacro %} + +{%- macro level_info(value) %} + {% if value == 'entry' %} + 入门 + {% elseif value == 'junior' %} + 初级 + {% elseif value == 'medium' %} + 中级 + {% elseif value == 'senior' %} + 高级 + {% endif %} +{%- endmacro %} + +{%- macro course_card(course) %} +
+
+ + {{ course.title }} + +
+
+ {{ substr(course.title,0,15) }} +
+
+ {% if course.market_price > 0 %} + ￥{{ course.market_price }} + {{ level_info(course.level) }} + {{ course.lesson_count }}节课 + {{ course.user_count }}人购买 + {% else %} + 免费 + {{ level_info(course.level) }} + {{ course.lesson_count }}节课 + {{ course.user_count }}人报名 + {% endif %} +
+
+{%- endmacro %} \ No newline at end of file diff --git a/app/Http/Web/Views/partials/pager.volt b/app/Http/Web/Views/partials/pager.volt index 3f8b8892..52ee4ae3 100644 --- a/app/Http/Web/Views/partials/pager.volt +++ b/app/Http/Web/Views/partials/pager.volt @@ -1,8 +1,10 @@ {% if pager.total_pages > 1 %} -
- 首页 - 上页 - 下页 - 尾页 +
+
+ 首页 + 上页 + 下页 + 尾页 +
{% endif %} \ No newline at end of file diff --git a/app/Http/Web/Views/search/content_course.volt b/app/Http/Web/Views/search/content_course.volt new file mode 100644 index 00000000..ea6e602a --- /dev/null +++ b/app/Http/Web/Views/search/content_course.volt @@ -0,0 +1,35 @@ +{% if pager.total_pages > 0 %} +
+ {% for item in pager.items %} +
+
+ + {{ item.title|striptags }} + +
+
+
+ {{ item.title }} +
+
{{ item.summary }}
+
+ 分类：{{ item.category.name }} + 讲师：{{ item.teacher.name }} + 难度：{{ level_info(item.level) }} + 课时：{{ item.lesson_count }} + 学员：{{ item.user_count }} +
+
+
+ {% endfor %} +
+{% else %} +
+
+ +
+
+ 没有找到{{ request.get('query') }}相关内容，换个关键字试试吧！ +
+
+{% endif %} \ No newline at end of file diff --git a/app/Http/Web/Views/search/content_other.volt b/app/Http/Web/Views/search/content_other.volt new file mode 100644 index 00000000..530405f4 --- /dev/null +++ b/app/Http/Web/Views/search/content_other.volt @@ -0,0 +1,6 @@ +
+ +
+
+ {{ partial('partials/pager') }} +
\ No newline at end of file diff --git a/app/Http/Web/Views/search/list.volt b/app/Http/Web/Views/search/list.volt index 812b1455..f56a5418 100644 --- a/app/Http/Web/Views/search/list.volt +++ b/app/Http/Web/Views/search/list.volt @@ -2,38 +2,27 @@ {% block content %} -
- {% for item in pager.items %} -
-
- - {{ item.title|e }} - -
-
-
- {{ item.title }} -
-
- {% if item.market_price > 0 %} - ￥{{ item.market_price }} - 中级 - {{ item.lesson_count }}节课 - {{ item.user_count }}人购买 - {% else %} - 免费 - 中级 - {{ item.lesson_count }}节课 - {{ item.user_count }}人报名 - {% endif %} -
-
-
- {% endfor %} -
+ {% set type = request.get('type','trim','course') %} -
- {{ partial('partials/pager') }} + {{ partial('partials/macro_course') }} + +
+ 首页 + 搜索 + {{ request.get('query') }} +
+
+
+ {% if type == 'course' %} + {{ partial('search/content_course') }} + {% elseif type == 'other' %} + {{ partial('search/content_other') }} + {% endif %} + {{ partial('partials/pager') }} +
+
+ {{ partial('search/sidebar') }} +
{% endblock %} \ No newline at end of file diff --git a/app/Http/Web/Views/search/sidebar.volt b/app/Http/Web/Views/search/sidebar.volt new file mode 100644 index 00000000..2f36be64 --- /dev/null +++ b/app/Http/Web/Views/search/sidebar.volt @@ -0,0 +1,21 @@ +{% if hot_queries %} +
+
热门搜索
+
+ {% for query in hot_queries %} + {{ query }} + {% endfor %} +
+
+{% endif %} + +{% if related_queries %} +
+
相关搜索
+
+ {% for query in related_queries %} + {{ query }} + {% endfor %} +
+
+{% endif %} \ No newline at end of file diff --git a/public/static/admin/css/common.css b/public/static/admin/css/common.css index f799932f..634d5759 100644 --- a/public/static/admin/css/common.css +++ b/public/static/admin/css/common.css @@ -1,4 +1,4 @@ -.layui-badge, .layui-badge-rim, .layui-badge-dot { +.layui-badge, .layui-badge-rim { padding-bottom: 1px; } diff --git a/public/static/web/css/common.css b/public/static/web/css/common.css index ee667867..335f4908 100644 --- a/public/static/web/css/common.css +++ b/public/static/web/css/common.css @@ -1,3 +1,7 @@ +.layui-badge, .layui-badge-rim { + padding-bottom: 1px; +} + .clearfix:after { display: block; clear: both; @@ -6,6 +10,10 @@ height: 0 } +body { + background-color: #f2f2f2; +} + .clearfix { zoom: 1 } @@ -24,7 +32,7 @@ width: 100%; z-index: 1000; position: fixed; - background-color: #393D49 !important; + background-color: #393D49; } .logo { @@ -39,6 +47,7 @@ position: absolute; top: 15px; right: 240px; + width: 250px; } .search .layui-input { @@ -49,11 +58,13 @@ #main { margin-top: 80px; margin-bottom: 40px; + min-height: 550px; } #footer { padding: 30px 0; text-align: center; + font-size: 12px; background: #474443; } @@ -74,10 +85,24 @@ margin-right: 10px; } +.breadcrumb { + margin-bottom: 20px; +} + .pager { text-align: center; } +.layout-content { + float: left; + width: 800px; +} + +.layout-sidebar { + float: right; + width: 320px; +} + .index-module { margin-bottom: 15px; } @@ -111,13 +136,45 @@ max-height: 270px; } -/** - *search - */ +.search-empty { + padding: 50px 0; + text-align: center; +} + +.search-empty .icon { + margin-bottom: 30px; +} + +.search-empty .icon .layui-icon { + font-size: 150px; + color: #393D49; +} + +.search-empty .text { + color: #999; + font-size: 18px; +} + +.search-empty .text .query { + color: red; + padding: 0 5px; +} + +.search-course-list { + margin-bottom: 30px; +} + +.search-course-card { + padding-bottom: 15px; + margin-bottom: 15px; + border-bottom: 1px dashed #ccc; +} + .search-course-card .cover { + float: left; width: 210px; height: 118px; - margin-bottom: 10px; + margin-right: 15px; } .search-course-card .cover img { @@ -125,28 +182,43 @@ height: 100%; } +.search-course-card .info { + float: left; + width: 500px; + color: #999; + font-size: 12px; +} + .search-course-card .title { - width: 210px; - white-space: nowrap; margin-bottom: 10px; + font-size: 14px; + white-space: nowrap; +} + +.search-course-card .summary { + margin-bottom: 10px; + line-height: 1.5em; + max-height: 4.5em; + word-wrap: break-word; overflow: hidden; } .search-course-card .meta { - color: #999; - font-size: 12px; + } .search-course-card .meta span { margin-right: 10px; } -.search-course-card .price { +.search-course-card em { color: red; + font-style: normal; } -.search-course-card .free { - color: green; +.query-badge { + margin-right: 5px; + margin-bottom: 5px; } .course-card { @@ -195,6 +267,8 @@ } .filter-group { + padding-bottom: 5px; + border-bottom: 1px dashed #ccc; height: 40px; line-height: 40px; }