yunzerwebsite/yunzer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

前端应用文章模块并显示

Browse Source
This commit is contained in:
云泽网
2025-05-09 23:53:34 +08:00
parent e7bcaf29f5
commit d5da3a6ea8
40 changed files with 2990 additions and 129 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/index/controller/Index.php
+58
View File
@@ -11,8 +11,66 @@ use think\facade\Config;
class Index extends Base
{
// 首页
public function index()
{
// 获取文章列表
$articles = Db::table('yz_article')
->where('delete_time', null)
->where('status', '<>', 3)
->order('id DESC')
->select()
->toArray();
$articleList = [];
foreach ($articles as $article) {
$cate = $article['cate'];
$cateName = Db::table('yz_article_category')
->where('id', $cate)
->where('delete_time', null)
->where('status', 1)
->value('name');
if ($cateName) { // 只添加有效的分类
if (!isset($articleList[$cateName])) {
$articleList[$cateName] = [];
}
$articleList[$cateName][] = $article;
}
}
// 调试信息
trace('Articles: ' . json_encode($articles, JSON_UNESCAPED_UNICODE));
trace('ArticleList: ' . json_encode($articleList, JSON_UNESCAPED_UNICODE));
// 将变量传递给视图
View::assign([
'articleList' => $articleList,
]);
return view('index');
}
// 文章列表
public function articlelist()
{
$articles = Db::table('yz_article')
->where('delete_time', null)
->where('status', 1)
->order('id DESC')
->select()
->toArray();
$articleList = [];
foreach ($articles as $article) {
$cate = $article['cate'];
$cateName = Db::table('yz_article_category')->where('id', $cate)->value('name');
if (!isset($articleList[$cateName])) {
$articleList[$cateName] = [];
}
$articleList[$cateName][] = $article;
}
View::assign('articleList', $articleList);
return View::fetch();
}
}
app/index/view/component/main.php
+32 -54
View File
@@ -73,13 +73,13 @@
<div class="module-header">
<div>
<div class="ModuleTitle_titleWrapper">
<h3 class="ModuleTitle_title">公开课</h3>
<h3 class="ModuleTitle_title">技术文章</h3>
<div class="tab-container">
<div class="tab-header">
<div class="tab-item active" data-tab="all">全部</div>
<div class="tab-item" data-tab="frontend">前端</div>
<div class="tab-item" data-tab="backend">后端</div>
<div class="tab-item" data-tab="mobile">移动端</div>
{foreach $articleList as $cateName => $articles}
<div class="tab-item" data-tab="{$cateName}">{$cateName}</div>
{/foreach}
</div>
</div>
</div>
@@ -87,68 +87,45 @@
<div class="more-btn">更多</div>
</div>
<div class="product-list">
<!-- 全部课程 -->
<!-- 全部文章 -->
<div class="tab-content active" data-tab="all">
<!-- 原有的课程列表内容 -->
<div class="opencourse product-item">
<!-- ... 原有内容 ... -->
</div>
<!-- ... 其他课程项 ... -->
{foreach $articleList as $cateName => $articles}
{foreach $articles as $article}
<div class="opencourse product-item">
<div class="video">
<img src="{$article.image}" alt="" class="cover">
</div>
<div class="introduction">
<div class="title">{$article.title}</div>
<div class="subtitle">{$article.author}</div>
</div>
<div class="bottom">
<div class="desc">{$article.desc}</div>
</div>
</div>
{/foreach}
{/foreach}
</div>
<!-- 前端课程 -->
<div class="tab-content" data-tab="frontend">
<!-- 分类文章 -->
{foreach $articleList as $cateName => $articles}
<div class="tab-content" data-tab="{$cateName}">
{foreach $articles as $article}
<div class="opencourse product-item">
<div class="video">
<img src="https://static001.geekbang.org/resource/image/ff/b8/ff18d73bec1040abf3d7bc7bffb532b8.jpg?x-oss-process=image/resize,w_423,h_238/format,webp"
alt="" class="cover">
<img src="{$article.image}" alt="" class="cover">
</div>
<div class="introduction">
<div class="title">Vue.js 实战教程</div>
<div class="subtitle">张老师 | 资深前端工程师</div>
<div class="title">{$article.title}</div>
<div class="subtitle">{$article.author}</div>
</div>
<div class="bottom">
<div class="desc">2.5w人学过</div>
<div class="desc">{$article.desc}</div>
</div>
</div>
<!-- 可以添加更多前端课程 -->
</div>
<!-- 后端课程 -->
<div class="tab-content" data-tab="backend">
<div class="opencourse product-item">
<div class="video">
<img src="https://static001.geekbang.org/resource/image/76/cd/762ee7f34a76fbff61d20aae313833cd.jpg?x-oss-process=image/resize,w_423,h_238/format,webp"
alt="" class="cover">
</div>
<div class="introduction">
<div class="title">PHP高级开发实战</div>
<div class="subtitle">李老师 | 资深后端工程师</div>
</div>
<div class="bottom">
<div class="desc">1.8w人学过</div>
</div>
</div>
<!-- 可以添加更多后端课程 -->
</div>
<!-- 移动端课程 -->
<div class="tab-content" data-tab="mobile">
<div class="opencourse product-item">
<div class="video">
<img src="https://static001.geekbang.org/resource/image/0f/69/0f95b62cf7yy6d6yy674f090d063b669.jpg?x-oss-process=image/resize,w_423,h_238/format,webp"
alt="" class="cover">
</div>
<div class="introduction">
<div class="title">Flutter跨平台开发</div>
<div class="subtitle">王老师 | 移动端架构师</div>
</div>
<div class="bottom">
<div class="desc">1.2w人学过</div>
</div>
</div>
<!-- 可以添加更多移动端课程 -->
{/foreach}
</div>
{/foreach}
</div>
</div>
@@ -187,4 +164,5 @@
});
});
});
</script>
</script>