This commit is contained in:
rumosky
2023-11-26 21:04:20 +08:00
parent 9db4ad3bb6
commit 69650954ec
14 changed files with 312 additions and 153 deletions
+2 -1
View File
@@ -1,3 +1,4 @@
mp/node_modules/
mp/miniprogram_npm/
mp/.vscode/
mp/.vscode/
.vscode/
-3
View File
@@ -1,3 +0,0 @@
{
"editor.inlineSuggest.showToolbar": "onHover"
}
+18 -1
View File
@@ -4,12 +4,14 @@ const app = getApp();
// 缓存数据的键名
const ARCHIVES_CACHE_KEY = "archivesCache";
// 缓存过期时间(毫秒)
const CACHE_EXPIRATION_TIME = 7 * 24 * 60 * 60 * 1000; // 七天
const CACHE_EXPIRATION_TIME = 1 * 24 * 60 * 60 * 1000; // 一天
Page({
data: {
archivesCount: 0,
archivesList: [],
showArticleList: false,
emptyContentText: "暂无内容",
currentYear: app.globalData.currentYear,
lastRequestTime: 0, // 最后一次发起请求的时间
canRequest: true, // 是否可以发起新的请求
@@ -74,6 +76,17 @@ Page({
archivesList: transformedData,
archivesCount: cachedData.count,
});
// 更新 showArticleList 的值
if (cachedData.count != 0) {
this.setData({
showArticleList: true,
});
} else {
this.setData({
showArticleList: false,
emptyContentText: "暂无内容",
});
}
return;
}
}
@@ -111,6 +124,10 @@ Page({
title: "获取归档列表失败!",
icon: "none",
});
that.setData({
showArticleList: false,
emptyContentText: "内容获取失败",
});
}
wx.hideLoading();
},
+45 -21
View File
@@ -1,29 +1,53 @@
<!--index.wxml-->
<view class="container">
<view class="content">
<view class="title">文章归档</view>
<view class="title-count">⌊{{ archivesCount }}⌉ 篇</view>
<view class="timeline">
<view class="timeline-year" wx:for="{{archivesList}}" wx:key="index">
<view class="timeline-year-wrap">
<view class="timeline-year-rect">
<view class="timeline-year-icon"></view>
<view class="content">
<view class="title">文章归档</view>
<view class="title-count">⌊{{ archivesCount }}⌉ 篇</view>
<view>
<view wx:if="{{ showArticleList }}">
<view class="timeline">
<view
class="timeline-year"
wx:for="{{ archivesList }}"
wx:key="index"
>
<view class="timeline-year-wrap">
<view class="timeline-year-rect">
<view class="timeline-year-icon"></view>
</view>
<view class="timeline-year-item">{{ item.year }}年</view>
</view>
<view class="timeline-line"></view>
<view
class="timeline-month"
wx:for="{{ item.months }}"
wx:key="index"
>
<view class="timeline-month-item">{{ item.month }}月</view>
<view
class="timeline-day"
wx:for="{{ item.dates }}"
wx:key="index"
>
<view class="timeline-day-item">{{ item.date }}日</view>
<navigator
url="/pages/articleDetail/index?cid={{ item.cid }}"
hover-class="navigator-hover"
>
<view class="timeline-day-item-title">{{ item.title }}</view>
</navigator>
</view>
</view>
</view>
</view>
<view class="timeline-year-item">{{item.year}}年</view>
</view>
<view class="timeline-line"></view>
<view class="timeline-month" wx:for="{{item.months}}" wx:key="index">
<view class="timeline-month-item">{{item.month}}月</view>
<view class="timeline-day" wx:for="{{item.dates}}" wx:key="index">
<view class="timeline-day-item">{{item.date}}日</view>
<navigator url="/pages/articleDetail/index?cid={{ item.cid }}" hover-class="navigator-hover">
<view class="timeline-day-item-title">{{item.title}}</view>
</navigator>
</view>
<view wx:else="{{ showArticleList }}">
<van-col span="24">
<van-empty description="{{ emptyContentText }}" />
</van-col>
</view>
</view>
<view class="footer">Copyright © {{ currentYear }} 如默星空</view>
</view>
<view class="footer">Copyright © {{ currentYear }} 如默星空</view>
<back-to-top scrollTop="{{ scrollTop }}" bind:backToTop="handleBackToTop" />
</view>
<back-to-top scrollTop="{{scrollTop}}" bind:backToTop="handleBackToTop" />
</view>
+38 -6
View File
@@ -10,19 +10,20 @@ Page({
pageSize: 5,
hasMore: true,
commentsDetail: [],
emptyContentText: "暂无评论",
},
// 监听页面滚动事件
onPageScroll(event) {
const scrollTop = event.scrollTop;
this.setData({
scrollTop: scrollTop
scrollTop: scrollTop,
});
},
onShareAppMessage: function () {
// 设置分享的标题、路径和图片
return {
title: this.data.articleDetail.title, // 使用文章标题作为分享标题
path: '/pages/articleDetail/index?cid=' + this.data.articleDetail.cid, // 设置分享路径,根据你的实际情况修改
path: "/pages/articleDetail/index?cid=" + this.data.articleDetail.cid, // 设置分享路径,根据你的实际情况修改
// imageUrl: this.data.articleDetail.coverImage, // 设置分享图片,根据你的实际情况修改
};
},
@@ -30,9 +31,29 @@ Page({
// 设置分享到朋友圈的标题和路径
return {
title: this.data.articleDetail.title, // 使用文章标题作为分享标题
query: 'cid=' + this.data.articleDetail.cid, // 设置分享路径参数,根据你的实际情况修改
query: "cid=" + this.data.articleDetail.cid, // 设置分享路径参数,根据你的实际情况修改
};
},
// 递归处理评论
flattenComments(comments, level, parentAuthor = null) {
let flattenedComments = [];
comments.forEach((comment) => {
comment.created = this.formatTimestamp(comment.created); // 添加这行代码
let newComment = { ...comment, level: level, parentAuthor: parentAuthor };
flattenedComments.push(newComment);
if (comment.children && comment.children.length > 0) {
let flattenedChildren = this.flattenComments(
comment.children,
level + 1,
comment.author
);
flattenedComments = flattenedComments.concat(flattenedChildren);
}
});
return flattenedComments;
},
// 加载文章评论数据
loadArticleComments(cid) {
wx.showLoading({
title: "加载中",
@@ -50,6 +71,8 @@ Page({
success: (res) => {
if (res.statusCode === 200) {
const data = res.data.data.dataSet;
const flattenedComments = that.flattenComments(data, 0);
// that.formatComments(data);
// 将时间戳转换为时间
data.forEach((comment) => {
comment.created = that.formatTimestamp(comment.created);
@@ -57,9 +80,10 @@ Page({
childComment.created = that.formatTimestamp(childComment.created);
});
});
// console.log(data,'datadata');
// console.log(data, "datadata");
that.setData({
commentsDetail: that.data.commentsDetail.concat(data),
// commentsDetail: that.data.commentsDetail.concat(data),
commentsDetail: that.data.commentsDetail.concat(flattenedComments),
});
// 判断是否还有下一页评论
const totalPages = that.data.totalPages;
@@ -74,6 +98,10 @@ Page({
title: "获取评论内容失败!",
icon: "none",
});
that.setData({
showComments: false,
emptyContentText: "评论获取失败",
});
}
wx.hideLoading();
},
@@ -105,7 +133,6 @@ Page({
that.setData({
articleDetail: data,
});
// 计算总页数
const commentsNum = data.commentsNum;
const pageSize = that.data.pageSize;
@@ -122,6 +149,7 @@ Page({
} else {
that.setData({
showComments: false,
emptyContentText: "暂无评论",
});
}
} else {
@@ -130,6 +158,10 @@ Page({
title: "获取文章内容失败!",
icon: "none",
});
that.setData({
showComments: false,
emptyContentText: "评论获取失败",
});
}
wx.hideLoading();
},
+23 -22
View File
@@ -8,14 +8,14 @@
</view>
<view class="content-meta">
<text class="fa fa-calendar" /> {{ articleDetail.date.year }}-{{
articleDetail.date.month
articleDetail.date.month
}}-{{ articleDetail.date.day }} |
<text class="fa fa-folder-open" />
{{ articleDetail.categories[0].name }} |
<text class="fa fa-thermometer-full" />
热度
{{ articleDetail.fields.Hot.value }}℃ |
<text class="fa fa-eye" /> {{articleDetail.fields.views.value}}
{{ articleDetail.fields.Hot.value }}℃ | <text class="fa fa-eye" />
{{ articleDetail.fields.views.value }}
</view>
<view class="content-text">
<mp-html scroll-table="true" content="{{ articleDetail.text }}" />
@@ -26,29 +26,30 @@
<view class="comments">
<view class="comments-title">
<text class="fa fa-comments" />
评论区({{articleDetail.commentsNum}}条评论)
评论区({{ articleDetail.commentsNum }}条评论)
</view>
<view class="comments-content" wx:if="{{ showComments }}">
<view class="comments-meta" wx:for="{{commentsDetail}}" wx:key="index">
<text class="fa fa-user" /> {{item.author}}
<text class="fa fa-clock-o" /> {{item.created}}
<view class="comments-text">
<mp-html scroll-table="true" content="{{item.text}}" />
<view
class="comments-meta"
wx:for="{{ commentsDetail }}"
wx:key="index"
style="margin-left: {{ item.level >= 1 ? '30rpx' : '0' }}"
>
<view class="comments-children-meta" wx:if="{{ item.level > 0 }}">
<text id="reply"
><text class="fa fa-mail-reply" /> {{ item.parentAuthor }}</text
>
</view>
<view class="comments-children-content" wx:for="{{item.children}}" wx:for-item="childrenItem" wx:key="index">
<view class="comments-children-meta">
<text id="reply"><text class="fa fa-mail-reply" /> {{item.author}}\n</text>
<text class="fa fa-user" /> {{childrenItem.author}}
<text class="fa fa-clock-o" /> {{childrenItem.created}}
</view>
<view class="comments-children-text">
<mp-html scroll-table="true" content="{{childrenItem.text}}" />
</view>
<!-- <br /> -->
<text class="fa fa-user" /> {{ item.author }}
<text class="fa fa-clock-o" /> {{ item.created }}
<view class="comments-text">
<mp-html scroll-table="true" content="{{ item.text }}" />
</view>
</view>
</view>
<view class="comments-empty" wx:else="{{showComments }}">
<van-empty description="暂无评论" />
<view class="comments-empty" wx:else="{{ showComments }}">
<van-empty description="{{ emptyContentText }}" />
</view>
</view>
</van-col>
@@ -56,6 +57,6 @@
<view class="footer">Copyright © {{ currentYear }} 如默星空</view>
</van-col>
</van-row>
<back-to-top scrollTop="{{scrollTop}}" bind:backToTop="handleBackToTop" />
<back-to-top scrollTop="{{ scrollTop }}" bind:backToTop="handleBackToTop" />
<custom-tab-bar />
</view>
</view>
+13 -10
View File
@@ -43,17 +43,20 @@
.comments-title {
font-size: 32rpx;
font-family: Lato, system-ui, -apple-system, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
font-family: Lato, system-ui, -apple-system, "Segoe UI", Roboto, Oxygen,
Ubuntu, Cantarell, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans",
sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol",
"Noto Color Emoji";
font-weight: 700;
}
.comments-content {
background: #fff;
box-shadow: 0 1px 2px 0 rgba(34, 36, 38, .15);
box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15);
margin: 1rem 0;
padding: 1em 1em;
border-radius: .28571429rem;
border: 1px solid rgba(34, 36, 38, .15);
border-radius: 0.28571429rem;
border: 1px solid rgba(34, 36, 38, 0.15);
}
.comments-meta {
@@ -67,7 +70,7 @@
padding: 20rpx;
margin-bottom: 20rpx;
margin-top: 20rpx;
background-color: #F7F7F7;
background-color: #f7f7f7;
border-radius: 10rpx;
color: #4f4f4f;
overflow: hidden;
@@ -77,11 +80,11 @@
.comments-children-content {
background: #fff;
box-shadow: 0 1px 2px 0 rgba(34, 36, 38, .15);
box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15);
margin: 1rem 0;
padding: 1em 1em;
border-radius: .28571429rem;
border: 1px solid rgba(34, 36, 38, .15);
border-radius: 0.28571429rem;
border: 1px solid rgba(34, 36, 38, 0.15);
}
#reply {
@@ -101,7 +104,7 @@
padding: 20rpx;
margin-bottom: 20rpx;
margin-top: 20rpx;
background-color: #F7F7F7;
background-color: #f7f7f7;
border-radius: 10rpx;
color: #4f4f4f;
overflow: hidden;
@@ -120,4 +123,4 @@
line-height: 2.5;
color: #6e7173;
text-align: center;
}
}
+37 -13
View File
@@ -9,6 +9,8 @@ Page({
hasMore: true,
articleList: [],
categoryList: [],
showArticleList: false,
emptyContentText: "暂无内容",
currentTabCount: null,
currentYear: app.globalData.currentYear,
active: 0,
@@ -18,16 +20,16 @@ Page({
onShareAppMessage: function () {
// 设置分享的标题、路径和图片
return {
title: '如默星空-分类',
path: '/pages/category/index',
title: "如默星空-分类",
path: "/pages/category/index",
// imageUrl: this.data.articleDetail.coverImage, // 设置分享图片,根据你的实际情况修改
};
},
onShareTimeline: function () {
// 设置分享到朋友圈的标题和路径
return {
title: '如默星空-分类',
query: '',
title: "如默星空-分类",
query: "",
};
},
@@ -35,22 +37,17 @@ Page({
onPageScroll(event) {
const scrollTop = event.scrollTop;
this.setData({
scrollTop: scrollTop
scrollTop: scrollTop,
});
},
loadArticleList(slug) {
wx.showLoading({
title: '加载中',
title: "加载中",
});
const that = this;
const url = app.globalData.baseURL + "/posts";
const {
page,
pageSize,
articleList,
lastRequestTime,
canRequest,
} = this.data;
const { page, pageSize, articleList, lastRequestTime, canRequest } =
this.data;
// 时间限制判断
const currentTime = Date.now();
const timeInterval = 500; // 设定时间间隔,单位为毫秒
@@ -70,6 +67,7 @@ Page({
success: function (res) {
if (res.statusCode === 200) {
const data = res.data.data;
const count = data.count;
const newArticleList = data.dataSet;
that.setData({
articleList: articleList.concat(newArticleList),
@@ -77,12 +75,26 @@ Page({
showBottomTip: false, // 重置底部提示的显示状态
lastRequestTime: currentTime, // 更新最后一次请求时间
});
if (count != 0) {
that.setData({
showArticleList: true,
});
} else {
that.setData({
showArticleList: false,
emptyContentText: "暂无内容",
});
}
} else {
console.error("请求失败");
wx.showToast({
title: "获取文章失败!",
icon: "none",
});
that.setData({
showArticleList: false,
emptyContentText: "内容获取失败",
});
}
wx.hideLoading();
},
@@ -114,11 +126,23 @@ Page({
// 加载默认分类的文章列表
that.loadArticleList(defaultSlug);
} else {
const data = [
{
mid: 999,
name: "默认",
count: 0,
},
];
console.error("请求失败");
wx.showToast({
title: "获取分类失败!",
icon: "none",
});
that.setData({
categoryList: data,
showArticleList: false,
emptyContentText: "内容获取失败",
});
}
},
fail: function (error) {
+62 -34
View File
@@ -1,50 +1,78 @@
<!--index.wxml-->
<view class="container">
<van-tabs sticky active="{{ active }}" bind:change="onChange" lazy-render animated swipeable>
<van-tabs
sticky
active="{{ active }}"
bind:change="onChange"
lazy-render
animated
swipeable
>
<van-tab wx:for="{{ categoryList }}" wx:key="index" title="{{ item.name }}">
<van-row gutter="20">
<van-col span="24">
<view class="count">
<van-icon name="apps-o" info="{{ categoryList[active].count }}" />分类 ⌊{{ categoryList[active].name }}⌉ 下的文章
<van-icon
name="apps-o"
info="{{ categoryList[active].count }}"
/>分类 ⌊{{ categoryList[active].name }}⌉ 下的文章
</view>
</van-col>
<van-col span="24" wx:for="{{ articleList }}" wx:key="index">
<view class="content">
<view class="content-title">
<h1>
<navigator url="/pages/articleDetail/index?cid={{ item.cid }}" hover-class="navigator-hover">{{
item.title }}</navigator>
</h1>
</view>
<view class="content-meta">
<text class="fa fa-calendar" /> {{ item.date.year }}-{{
item.date.month
}}-{{ item.date.day }} |
<text class="fa fa-folder" />
{{ item.categories[0].name }} |
<text class="fa fa-comment" />
{{ item.commentsNum }}
</view>
<view class="content-abstract">
<navigator url="/pages/articleDetail/index?cid={{ item.cid }}" hover-class="navigator-hover">
{{
item.fields.excerpt.value
}}</navigator>
</view>
<view class="content-readmore">
<navigator url="/pages/articleDetail/index?cid={{ item.cid }}" hover-class="navigator-hover">
<view class="readmore-button">
<class class="fa fa-thumbs-up" /> 阅读更多
<view>
<view wx:if="{{ showArticleList }}">
<van-col span="24" wx:for="{{ articleList }}" wx:key="index">
<view class="content">
<view class="content-title">
<h1>
<navigator
url="/pages/articleDetail/index?cid={{ item.cid }}"
hover-class="navigator-hover"
>{{ item.title }}</navigator
>
</h1>
</view>
</navigator>
</view>
<view class="content-meta">
<text class="fa fa-calendar" /> {{ item.date.year }}-{{
item.date.month
}}-{{ item.date.day }} |
<text class="fa fa-folder" />
{{ item.categories[0].name }} |
<text class="fa fa-comment" />
{{ item.commentsNum }}
</view>
<view class="content-abstract">
<navigator
url="/pages/articleDetail/index?cid={{ item.cid }}"
hover-class="navigator-hover"
>
{{ item.fields.excerpt.value }}</navigator
>
</view>
<view class="content-readmore">
<navigator
url="/pages/articleDetail/index?cid={{ item.cid }}"
hover-class="navigator-hover"
>
<view class="readmore-button">
<class class="fa fa-thumbs-up" /> 阅读更多
</view>
</navigator>
</view>
</view>
</van-col>
</view>
</van-col>
<view wx:else="{{ showArticleList }}">
<van-col span="24">
<van-empty description="{{ emptyContentText }}" />
</van-col>
</view>
</view>
<van-col span="24">
<view class="footer">Copyright © {{ currentYear }} 如默星空</view>
</van-col>
</van-row>
</van-tab>
</van-tabs>
<back-to-top scrollTop="{{scrollTop}}" bind:backToTop="handleBackToTop" />
</view>
<back-to-top scrollTop="{{ scrollTop }}" bind:backToTop="handleBackToTop" />
</view>
+17
View File
@@ -6,6 +6,8 @@ Page({
page: 1,
pageSize: 10,
articleList: [],
showArticleList: false,
emptyContentText: "暂无内容",
hasMore: true,
currentYear: app.globalData.currentYear,
lastRequestTime: 0, // 最后一次发起请求的时间
@@ -70,6 +72,7 @@ Page({
success: function (res) {
if (res.statusCode === 200) {
const data = res.data.data;
const count = data.count;
const newArticleList = data.dataSet;
that.setData({
articleList: articleList.concat(newArticleList),
@@ -77,12 +80,26 @@ Page({
showBottomTip: false, // 重置底部提示的显示状态
lastRequestTime: currentTime, // 更新最后一次请求时间
});
if (count != 0) {
that.setData({
showArticleList: true,
});
} else {
that.setData({
showArticleList: false,
emptyContentText: "暂无内容",
});
}
} else {
console.error("请求失败");
wx.showToast({
title: "获取文章失败!",
icon: "none",
});
that.setData({
showArticleList: false,
emptyContentText: "内容获取失败",
});
}
wx.hideLoading();
},
+48 -39
View File
@@ -23,47 +23,56 @@
/>
</van-sticky>
</van-col>
<van-col span="24" wx:for="{{ articleList }}" wx:key="index">
<view class="content">
<view class="content-title">
<h1>
<navigator
url="/pages/articleDetail/index?cid={{ item.cid }}"
hover-class="navigator-hover"
>
{{ item.title }}
</navigator>
</h1>
</view>
<view class="content-meta">
<text class="fa fa-calendar" /> {{ item.date.year }}-{{
item.date.month
}}-{{ item.date.day }} |
<text class="fa fa-folder" />
{{ item.categories[0].name }} |
<text class="fa fa-comment" />
{{ item.commentsNum }}
</view>
<view class="content-abstract">
<navigator
url="/pages/articleDetail/index?cid={{ item.cid }}"
hover-class="navigator-hover"
>
{{ item.fields.excerpt.value }}
</navigator>
</view>
<view class="content-readmore">
<navigator
url="/pages/articleDetail/index?cid={{ item.cid }}"
hover-class="navigator-hover"
>
<view class="readmore-button">
<class class="fa fa-thumbs-up" /> 阅读更多
<view>
<view wx:if="{{ showArticleList }}">
<van-col span="24" wx:for="{{ articleList }}" wx:key="index">
<view class="content">
<view class="content-title">
<h1>
<navigator
url="/pages/articleDetail/index?cid={{ item.cid }}"
hover-class="navigator-hover"
>
{{ item.title }}
</navigator>
</h1>
</view>
</navigator>
</view>
<view class="content-meta">
<text class="fa fa-calendar" /> {{ item.date.year }}-{{
item.date.month
}}-{{ item.date.day }} |
<text class="fa fa-folder" />
{{ item.categories[0].name }} |
<text class="fa fa-comment" />
{{ item.commentsNum }}
</view>
<view class="content-abstract">
<navigator
url="/pages/articleDetail/index?cid={{ item.cid }}"
hover-class="navigator-hover"
>
{{ item.fields.excerpt.value }}
</navigator>
</view>
<view class="content-readmore">
<navigator
url="/pages/articleDetail/index?cid={{ item.cid }}"
hover-class="navigator-hover"
>
<view class="readmore-button">
<class class="fa fa-thumbs-up" /> 阅读更多
</view>
</navigator>
</view>
</view>
</van-col>
</view>
</van-col>
<view wx:else="{{ showArticleList }}">
<van-col span="24">
<van-empty description="{{ emptyContentText }}" />
</van-col>
</view>
</view>
<van-col span="24">
<view class="footer">Copyright © {{ currentYear }} 如默星空</view>
</van-col>
+6
View File
@@ -8,6 +8,7 @@ Page({
articleList: [],
hasMore: true,
count: 0,
emptyContentText: "暂无内容",
showSearchResults: false,
currentYear: app.globalData.currentYear,
lastRequestTime: 0, // 最后一次发起请求的时间
@@ -88,6 +89,7 @@ Page({
} else {
that.setData({
showSearchResults: false,
emptyContentText: "暂无内容",
});
}
} else {
@@ -96,6 +98,10 @@ Page({
title: "获取文章失败!",
icon: "none",
});
that.setData({
showSearchResults: false,
emptyContentText: "内容获取失败",
});
}
wx.hideLoading();
},
+1 -1
View File
@@ -65,7 +65,7 @@
</view>
<view wx:else="{{ showSearchResults }}">
<van-col span="24">
<van-empty description="暂无文章" />
<van-empty description="{{ emptyContentText }}" />
</van-col>
</view>
</view>
+2 -2
View File
@@ -48,11 +48,11 @@
},
"compileType": "miniprogram",
"libVersion": "2.19.4",
"appid": "xxx",
"appid": "wxb9c58446e39043fa",
"projectname": "miniprogram-92",
"condition": {},
"editorSetting": {
"tabIndent": "insertSpaces",
"tabSize": 2
}
}
}