ulthon/ulthon_information
1
0
Fork 0
mirror of https://gitee.com/ulthon/ulthon_information.git synced 2026-03-03 16:24:28 +08:00
Code Issues Packages Projects Releases Wiki Activity

优化性能和轮播图;

Browse Source
This commit is contained in:
augushong
2022-03-19 00:18:31 +08:00
parent 370a6cdc4d
commit 4fda375028
5 changed files with 274 additions and 219 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
app/index/controller/Common.php
View File

@@ -18,22 +18,22 @@ class Common extends BaseController
parent::initialize(); parent::initialize();
$list_nav_slide = Nav::where('type', 3)->cache('type_list_3')->order('sort asc')->where('status', 1)->select(); $list_nav_slide = Nav::where('type', 3)->cacheAlways('type_list_3')->order('sort asc')->where('status', 1)->select();
View::assign('list_nav_slide', $list_nav_slide); View::assign('list_nav_slide', $list_nav_slide);
$list_nav_friend_url = Nav::where('type', 2)->cache('type_list_2')->order('sort asc')->where('status', 1)->select(); $list_nav_friend_url = Nav::where('type', 2)->cacheAlways('type_list_2')->order('sort asc')->where('status', 1)->select();
View::assign('list_nav_friend_url', $list_nav_friend_url); View::assign('list_nav_friend_url', $list_nav_friend_url);
$list_header_nav = Nav::where('type', 11)->cache('type_list_11')->order('sort asc')->where('status', 1)->select(); $list_header_nav = Nav::where('type', 11)->cacheAlways('type_list_11')->order('sort asc')->where('status', 1)->select();
View::assign('list_header_nav', $list_header_nav); View::assign('list_header_nav', $list_header_nav);
$list_category_first_level = Category::where('level', 1)->where('status', 1)->where('type', 3)->cache('category_type_list_3')->order('sort asc')->select(); $list_category_first_level = Category::where('level', 1)->where('status', 1)->where('type', 3)->cacheAlways('category_type_list_3')->order('sort asc')->select();
View::assign('list_category_first_level', $list_category_first_level); View::assign('list_category_first_level', $list_category_first_level);
$list_nav_more = Nav::where('type', 8)->cache('type_list_8')->order('sort asc')->where('status', 1)->select(); $list_nav_more = Nav::where('type', 8)->cacheAlways('type_list_8')->order('sort asc')->where('status', 1)->select();
View::assign('list_nav_more', $list_nav_more); View::assign('list_nav_more', $list_nav_more);
$top_posts = Post::where('is_top', 1)->limit(8)->where('type', 3)->cache('top_post')->select(); $top_posts = Post::where('is_top', 1)->limit(8)->where('type', 3)->cacheAlways('top_post')->select();
View::assign('top_posts', $top_posts); View::assign('top_posts', $top_posts);
$this->userHubLogin(); $this->userHubLogin();

20
app/index/controller/Index.php
View File

@@ -20,13 +20,11 @@ class Index extends Common
public function index() public function index()
{ {
$page_cache_key = md5($this->request->url()); $page_cache_key = md5($this->request->url());
$content = Cache::get($page_cache_key); $content = Cache::get($page_cache_key);
if (!empty($content)) { if (!env('app_debug') && !empty($content)) {
return $content; return $content;
} }
@@ -34,13 +32,15 @@ class Index extends Common
$sub_category = []; $sub_category = [];
$current_category = []; $current_category = [];
if (!empty($this->request->param('category_id'))) { $category_id = $this->request->param('category_id');
$sub_category = Category::where('pid', $this->request->param('category_id'))->where('type', 3)->order('sort asc')->select();
$current_category = Category::find($this->request->param('category_id'));
if (empty($this->request->param('sub_category_id'))) {
$categorys = [$this->request->param('category_id')];
$categorys = array_merge($categorys, array_column((array)Category::getListLevel($this->request->param('category_id')), 3)); if (!empty($category_id)) {
$sub_category = Category::where('pid', $category_id)->where('type', 3)->order('sort asc')->select();
$current_category = Category::find($category_id);
if (empty($this->request->param('sub_category_id'))) {
$categorys = [$category_id];
$categorys = array_merge($categorys, array_column((array)Category::getListLevel($category_id), 3));
$categorys_where = PostCategory::whereIn('category_id', $categorys); $categorys_where = PostCategory::whereIn('category_id', $categorys);
@@ -76,6 +76,8 @@ class Index extends Common
$content = View::fetch(); $content = View::fetch();
Cache::tag('page_cache')->set($page_cache_key, $content); Cache::tag('page_cache')->set($page_cache_key, $content);
return $content;
} }

1
app/model/Category.php
View File

@@ -17,6 +17,7 @@ class Category extends Base
public static $autoClearCache = [ public static $autoClearCache = [
[ [
'name' => 'category_type_list', 'name' => 'category_type_list',
'field' => 'type' 'field' => 'type'

286
public/static/css/index.articles.css
View File

@@ -1,220 +1,230 @@
.main-container { .main-container {
margin-top: 15px; margin-top: 15px;
} }
.nav-left-container { .nav-left-container {
margin-top: 15px; margin-top: 15px;
} }
.nav-left-list { .nav-left-list {
text-align: center; text-align: center;
} }
.nav-left-list a { .nav-left-list a {
display: block; display : block;
padding: 10px 15px; padding : 10px 15px;
border-radius: 5px; border-radius: 5px;
margin: 5px 20px; margin : 5px 20px;
} }
.nav-left-list a:hover, .nav-left-list a.current { .nav-left-list a:hover,
background-color: #6699CC; .nav-left-list a.current {
color: #fff; background-color: #6699CC;
color : #fff;
} }
.logo { .logo {
text-align: center; text-align: center;
} }
.logo img { .logo img {
max-width: 60%; max-width: 60%;
} }
.session { .session {
margin-top: 15px; margin-top : 15px;
background-color: #99CCFF; background-color: #99CCFF;
padding: 15px; padding : 15px;
} }
.session.border { .session.border {
border-top: 2px solid #6699CC; border-top: 2px solid #6699CC;
} }
.session .header { .session .header {
font-size: 18px; font-size : 18px;
font-weight: 600; font-weight: 600;
color: #036; color : #036;
} }
.search-container { .search-container {
display: flex; display: flex;
} }
.layui-btn { .layui-btn {
background-color: #6699CC; background-color: #6699CC;
} }
.nav-more-list a { .nav-more-list a {
display: inline-block; display : inline-block;
white-space: nowrap; white-space : nowrap;
color: #036; color : #036;
margin-right: 15px; margin-right: 15px;
margin-top: 15px; margin-top : 15px;
} }
.session .info p { .session .info p {
margin: 5px 0; margin: 5px 0;
} }
#banner img { #banner img {
width: 100%; width: 100%;
} }
.tab-list { .tab-list {
border-bottom: 1px solid #ddd; border-bottom: 1px solid #ddd;
margin-top: 15px; margin-top : 15px;
font-size: 16px; font-size : 16px;
} }
.tab-list a { .tab-list a {
margin-right: 15px; margin-right : 15px;
border-bottom: 2px solid transparent; border-bottom : 2px solid transparent;
padding-bottom: 10px; padding-bottom: 10px;
display: inline-block; display : inline-block;
} }
.tab-list a.current { .tab-list a.current {
border-color: #6699CC; border-color: #6699CC;
} }
.post-item, .plus-post-item { .post-item,
display: flex; .plus-post-item {
justify-content: flex-start; display : flex;
align-items: center; justify-content: flex-start;
margin-top: 15px; align-items : center;
padding-bottom: 15px; margin-top : 15px;
border-bottom: 1px solid #ddd; padding-bottom : 15px;
border-bottom : 1px solid #ddd;
} }
.post-item>div:nth-child(2) { .post-item>div:nth-child(2) {
width: calc(100% - 160px); width: calc(100% - 160px);
} }
.post-item .poster, .plus-post-item .poster { .post-item .poster,
width: 160px; .plus-post-item .poster {
height: 100px; width : 160px;
background-size: cover; height : 100px;
background-position: center; background-size : cover;
background-repeat: no-repeat; background-position: center;
margin-right: 15px; background-repeat : no-repeat;
margin-right : 15px;
} }
.plus-post-item .poster { .plus-post-item .poster {
width: 60px; width : 60px;
height: 60px; height: 60px;
} }
.plus-post-item .title { .plus-post-item .title {
font-size: 14px; font-size: 14px;
} }
.post-item .info .title { .post-item .info .title {
font-size: 20px; font-size : 20px;
line-height: 1.3; line-height : 1.3;
margin-bottom: 4px; margin-bottom : 4px;
font-weight: 700; font-weight : 700;
max-height: 52px; max-height : 52px;
display: -webkit-box; display : -webkit-box;
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
overflow: hidden; overflow : hidden;
text-overflow: ellipsis; text-overflow : ellipsis;
} }
.post-item .info .desc { .post-item .info .desc {
margin: 0 0 8px; margin : 0 0 8px;
font-size: 13px; font-size : 13px;
line-height: 24px; line-height: 24px;
color: #999; color : #999;
} }
.post-item .info .plus-info { .post-item .info .plus-info {
margin-top: 5px; margin-top: 5px;
} }
.nodata { .nodata {
margin: 60px auto; margin : 60px auto;
display: block; display: block;
width: 40%; width : 40%;
} }
.content-container .title { .content-container .title {
font-size: 34px; font-size : 34px;
font-weight: 700; font-weight: 700;
line-height: 44px; line-height: 44px;
color: #222; color : #222;
} }
.content-container .info { .content-container .info {
margin-top: 12px; margin-top: 12px;
font-size: 13px; font-size : 13px;
color: #777; color : #777;
} }
.content-container .info span{ .content-container .info span {
margin-right: 5px;; margin-right: 5px;
;
} }
.content-container .desc { .content-container .desc {
margin: 0 0 8px; margin : 0 0 8px;
font-size: 13px; font-size : 13px;
line-height: 24px; line-height: 24px;
color: #999; color : #999;
margin-top: 15px; margin-top : 15px;
} }
.content-container .jump-container { .content-container .jump-container {
margin-top: 15px; margin-top: 15px;
} }
@media screen and (max-width: 768px) { @media screen and (max-width: 768px) {
.nav-left-list { .nav-left-list {
text-align: left; text-align: left;
} }
.nav-left-list a {
display: inline-block; .nav-left-list a {
margin: 5px; display: inline-block;
} margin : 5px;
.post-item .poster, .plus-post-item .poster { }
width: 80px;
height: 60px; .post-item .poster,
} .plus-post-item .poster {
.post-item>div:nth-child(2) { width : 80px;
width: calc(100% - 80px); height: 60px;
} }
.post-item .info .title {
font-weight: 500; .post-item>div:nth-child(2) {
font-size: 14px; width: calc(100% - 80px);
} }
.content-container .title {
font-size: 18px; .post-item .info .title {
line-height: 28px; font-weight: 500;
} font-size : 14px;
}
.content-container .title {
font-size : 18px;
line-height: 28px;
}
} }
@media screen and (min-width:1200px) { @media screen and (min-width:1200px) {
.layui-container { .layui-container {
width: 1280px; width: 1280px;
} }
} }
a.post-item:visited{ a.post-item:visited {
color: #bbb; color: #bbb;
} }
.ul-content p{ .ul-content p {
margin: 15px 0; margin: 15px 0;
} }
@@ -229,8 +239,8 @@ a.post-item:visited{
} }
.ul-content h2{ .ul-content h2 {
margin:20px 0 margin: 20px 0
} }
/* 表格 */ /* 表格 */
@@ -268,7 +278,7 @@ a.post-item:visited{
margin: 10px 0 10px 20px; margin: 10px 0 10px 20px;
} }
.ul-content ul li{ .ul-content ul li {
list-style: inherit; list-style: inherit;
} }
@@ -285,3 +295,45 @@ a.post-item:visited{
.ul-content img { .ul-content img {
max-width: 100%; max-width: 100%;
} }
.index-poster {
height: 100%;
filter: blur(2px);
}
#banner .panel {
display : flex;
align-items : center;
justify-content: center;
text-align : center;
text-shadow : 0 0 2px #333;
color : #fff;
z-index : 99;
height : 100%;
position : absolute;
top : 0;
left : 0;
width : 100%;
}
#banner .index-poster {
height : 100%;
width : 100%;
background-size : cover;
background-position: center;
position : absolute;
z-index : 0;
}
#banner .title {
font-size: 28px;
}
#banner .layui-carousel-arrow {
z-index: 999;
}
#banner .layui-carousel-ind {
z-index: 999;
}

174
view/index/index/index.html
View File

@@ -2,115 +2,115 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{$current_category.title|default='全部文章'}|{:get_system_config('site_name')}</title> <title>{$current_category.title|default='全部文章'}|{:get_system_config('site_name')}</title>
<meta name="keywords" content="{:get_system_config('site_keywords')}"> <meta name="keywords" content="{:get_system_config('site_keywords')}">
<meta name="description" content="{:get_system_config('site_desc')}{$current_category.title|default='全部文章'},{$current_category.desc|default=''}"> <meta name="description" content="{:get_system_config('site_desc')}{$current_category.title|default='全部文章'},{$current_category.desc|default=''}">
{include file='common/_require'/} {include file='common/_require'/}
</head> </head>
<body> <body>
<div class="layui-container main-container"> <div class="layui-container main-container">
<div class="layui-row layui-col-space12"> <div class="layui-row layui-col-space12">
{include file='common/_left'/} {include file='common/_left'/}
<div class="layui-col-md7"> <div class="layui-col-md7">
<div class="main-container"> <div class="main-container">
{eq name='$Request.param.category_id|default="0"' value='0'} {eq name='$Request.param.category_id|default="0"' value='0'}
{if count($list_nav_slide) > 0 } {if count($list_nav_slide) > 0 }
<div style=""> <div style="">
<div class="layui-carousel" id="banner"> <div class="layui-carousel" id="banner">
<div carousel-item> <div carousel-item>
{volist name='list_nav_slide' id='nav'} {volist name='list_nav_slide' id='nav'}
<a href="{$nav.value|default='javascript:;'}" target="{$nav.target}"> <a href="{$nav.value|default='javascript:;'}" target="{$nav.target}">
<img src="{$nav.img}"> <div class="index-poster" style="background-image: url({$nav.img});">
<div class="panel">
<p class="title">{$nav.title}</p>
<p class="desc">{$nav.desc}</p>
</div>
</a>
{/volist}
</div> </div>
</div> <div class="panel">
</div> <div class="panel-main">
{/if} <p class="title">{$nav.title}</p>
{/eq} <p class="desc">{$nav.desc}</p>
</div>
</div>
{notempty name='$sub_category'} </a>
<div class="tab-list"> {/volist}
<a href="{:url('Index/index',['category_id'=>$Request.param.category_id])}" {eq
name='$Request.param.sub_category_id|default=0' value='0' } class="current" {/eq}>全部</a>
{volist name='$sub_category' id='category'}
<a href="{:url('Index/index',['category_id'=>$Request.param.category_id,'sub_category_id'=>$category.id])}" </div>
{eq name='$Request.param.sub_category_id|default=0' value='$category.id' } class="current" </div>
{else/}{/eq}>{$category.title}</a> </div>
{/volist} {/if}
</div> {/eq}
{/notempty}
{notempty name='$current_category.desc'}
<div class="category-plus-title">
<blockquote class="layui-elem-quote layui-quote-nm">{$current_category.desc}</blockquote>
</div>
{/notempty}
<div class="post-container">
<div class="post-list">
{volist name='list_post' id='post'}
<a href="{:url('Post/read',['uid'=>$post.uid])}" class="post-item" {notempty name='$sub_category'}
onmouseover="$(this).find('.poster').addClass('layui-anim-scale')" <div class="tab-list">
onmouseout="$(this).find('.poster').removeClass('layui-anim-scale')"> <a href="{:url('Index/index',['category_id'=>$Request.param.category_id])}" {eq name='$Request.param.sub_category_id|default=0' value='0' } class="current" {/eq}>全部</a>
{notempty name='$post->getData("poster")'} {volist name='$sub_category' id='category'}
<div class="poster layui-anim" style="background-image: url('{$post.poster}');"></div> <a href="{:url('Index/index',['category_id'=>$Request.param.category_id,'sub_category_id'=>$category.id])}" {eq name='$Request.param.sub_category_id|default=0' value='$category.id' } class="current" {else/}{/eq}>{$category.title}</a>
{/notempty} {/volist}
</div>
{/notempty}
{notempty name='$current_category.desc'}
<div class="category-plus-title">
<blockquote class="layui-elem-quote layui-quote-nm">{$current_category.desc}</blockquote>
</div>
{/notempty}
<div class="post-container">
<div class="post-list">
{volist name='list_post' id='post'}
<div class="info"> <a href="{:url('Post/read',['uid'=>$post.uid])}" class="post-item" onmouseover="$(this).find('.poster').addClass('layui-anim-scale')" onmouseout="$(this).find('.poster').removeClass('layui-anim-scale')">
<div class="title">{$post.title}</div> {notempty name='$post->getData("poster")'}
<div class="desc">{$post.desc_html|raw}</div>
<div class="plus-info"> <div class="poster layui-anim" style="background-image: url('{$post.poster}');"></div>
<span>{$post.hits}访问</span> {/notempty}
<span>{$post.comment_count}评论</span>
</div> <div class="info">
<div class="title">{$post.title}</div>
<div class="desc">{$post.desc_html|raw}</div>
<div class="plus-info">
<span>{$post.hits}访问</span>
<span>{$post.comment_count}评论</span>
</div>
</div>
</a>
{/volist}
{empty name='list_post'}
<img class="nodata" src="/static/images/nodata.png" alt="">
{/empty}
</div>
{$list_post->render()|raw}
</div>
</div> </div>
</a>
{/volist}
{empty name='list_post'}
<img class="nodata" src="/static/images/nodata.png" alt="">
{/empty}
</div> </div>
{$list_post->render()|raw} {include file='common/_right'/}
</div>
</div> </div>
</div>
{include file='common/_right'/}
</div> </div>
</div>
<script> <script>
layui.use('carousel', function () { layui.use('carousel', function () {
var carousel = layui.carousel; var carousel = layui.carousel;
//建造实例 //建造实例
carousel.render({ carousel.render({
elem: '#banner' elem: '#banner'
, width: '100%' //设置容器宽度 , width: '100%' //设置容器宽度
, arrow: 'always' //始终显示箭头 , arrow: 'always' //始终显示箭头
//,anim: 'updown' //切换动画方式 //,anim: 'updown' //切换动画方式
}); });
}); });
</script> </script>
</body> </body>
</html> </html>