zzwy2/view/article/news_list.html

{layout name="layout"/}
{php}
use app\model\Category;
use app\model\Article;
use app\model\Block;
$childrenMenu = Category::getChildrenByParentId($topCategoryId);
$childrenCate = Category::getChildrenByParentId(Category::CATEGORY_NEWS);

$topNews = Article::getLastTopList($category["id"],1,[],["top"=>"desc"]);
if (!$topNews->isEmpty()) {
    $topNews = empty($topNews)?[]: ($topNews[0] ?? []);
    $topNewsYm = date('Y.m', $topNews['create_time']);
    $topNewsDay = date('d', $topNews['create_time']);
}
{/php}

{include file="public/about_second" /}

{include file="public/news_second" /}

{if !$topNews->isEmpty()}
<!-- 推荐新闻 -->
<div class="news-first-bg wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0">
    <a href="/news/{$topNews.id}.html" class="news-first w1360 bg-col-f5 flex">
        <div class="img"><img src="{$isMobile ? $topNews['src_mobile'] : $topNews['src']}" alt="{$topNews['title']}"></div>
        <div class="txt wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0">
            <div class="time color-blue">
                <strong class="pc-show">{$topNewsDay}</strong>
                <span>{$topNewsYm}<em class="wap-show">.{$topNewsDay}</em></span>
            </div>
            <h2 class="color-blue clips1">{$topNews['title']}</h2>
            <div class="info color-66 clips4">{$topNews['summary']}</div>
            <span class="article-more-btn color-blue">查看详情<img src="__STATIC__/web/images/icon/icon-arrow-more.png" alt="查看详情"></span>
        </div>
    </a>
</div>
{/if}

<!-- 新闻列表 -->
<div class="pull-section pull-content-bg news-list-bg bg-col-f5 wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0">
    <div class="news-list w1360">
        {foreach $items as $item}
        {if $item['id'] != ($topNews['id'] ?? 0)}
        <a href="/news/{$item.id}.html" class="news-item bg-col-white flex wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0">
            <div class="img"><img src="{$isMobile ? $item['src_mobile'] : $item['src']}" alt="{$item.title}"></div>
            <div class="txt wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0">
                <em class="wap-show">{$item.create_date_y_m}.{$item.create_date_d}</em>
                <h2 class="clips1">{$item.title}</h2>
                <div class="info color-66 clips4">{$item.summary}</div>
                <span class="article-more-btn color-blue pc-show">查看详情<img src="__STATIC__/web/images/icon/icon-arrow-more.png" alt="查看详情"></span>
            </div>
            <div class="time-bg pc-show">
                <div class="time color-blue">
                    <img src="__STATIC__/web/images/icon/icon-time.png" alt="日期">
                    <strong>{$item.create_date_d}</strong>
                    <span>{$item.create_date_y_m}<em class="wap-show">.{$item.create_date_d}</em></span>
                </div>
            </div>
        </a>
        {/if}
        {/foreach}

        <div style="text-align: center;margin-top: 15px;display: none" class="show-msg">没有更多了</div>
        <!-- 加载更多 -->
        <div class="load-more-news bg-col-white color-blue get-more-list" data-href="/article/getList?category_id={$category['id']}" data-page="2" data-size="{$category['number'] ?? 10}">点击加载更多</div>
    </div>
</div>

<script>
    $('body').on('click', '.get-more-list',	function () {
        let that = $(this);
        let url = that.data('href');
        let page = that.data('page');
        let size = that.data('size');
        $.post(url, {page: page, size: size}, function (res) {
            if (res.code === 0) {
                if (!res.data || res.data.length <= 0) {
                    $('.show-msg').show();
                    setTimeout(function () {
                        $('.show-msg').hide();
                    }, 2000)
                    return false;
                }
                let html = '';
                $.each(res.data, function (index, item) {
                    html += `
					<a href="/news/${item.id}.html" class="news-item bg-col-white flex wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0">
                        <div class="img"><img src="${item.src}" alt="${item.title}"></div>
                        <div class="txt wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0">
                            <em class="wap-show">${item.create_date_y_m}.${item.create_date_d}</em>
                            <h2 class="clips1">${item.title}</h2>
                            <div class="info color-66 clips4">${item.summary}</div>
                            <span class="article-more-btn color-blue pc-show">查看详情<img src="__STATIC__/web/images/icon/icon-arrow-more.png" alt="查看详情"></span>
                        </div>
                        <div class="time-bg pc-show">
                            <div class="time color-blue">
                                <img src="__STATIC__/web/images/icon/icon-time.png" alt="日期">
                                <strong>${item.create_date_d}</strong>
                                <span>${item.create_date_y_m}<em class="wap-show">.${item.create_date_d}</em></span>
                            </div>
                        </div>
                    </a>
				`;
                })
                page++;
                that.data('page', page)
                $('.show-msg').before(html);
                return false;
            }
        })
    })
</script>