fix(component): 修复组件名称错误和props类型定义

refactor(component): 重构组件模板结构,移除重复代码

feat(component): 添加可选props支持外部数据传入

style(css): 优化样式布局和响应式设计

fix(js): 修复URL路径处理逻辑和滚动加载问题

feat(search): 新增搜索页推荐内容和空状态处理

chore: 添加新图标资源文件
This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-12-22 19:01:00 +08:00
parent acf03efaf0
commit 43556292d2
26 changed files with 783 additions and 225 deletions

View File

@@ -20,28 +20,60 @@ const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provi
let typeValue = ref(null);
let kw = ref("");
onMounted(() => {
console.log('onMounted');
const params = getUrlParams();
// kw.value = params.kw || "";
// const urlObj = new URL(location.href);
// const pathParts = urlObj.pathname.split("/").filter((part) => part);
// kw.value = decodeURIComponent(pathParts.pop());
kw.value = kwValue.value.innerText;
const tab = typeValue.value.innerText;
if (tab) tabValue.value = tab;
if (params.page) page.value = params.page;
else page.value = 1;
console.log("kw.value", kw.value);
if (kw.value) getList();
else {
if (kw.value) {
getList();
isNoSearch.value = false;
nextTick(() => {
const preLoader = document.getElementById("pre-loader");
if (preLoader) preLoader.style.display = "none";
});
} else {
page.value = null;
isEmptySearch.value = true;
getRecommendList();
}
getUserInfoWin();
window.addEventListener("scroll", handleScroll);
const preLoader = document.getElementById("pre-loader");
if (preLoader) preLoader.style.display = "none";
getTagList();
getSearchList();
document.querySelectorAll(".vuehide").forEach((item) => (item.style.display = "none"));
window.addEventListener("popstate", () => {
const urlObj = new URL(location.href);
const pathParts = urlObj.pathname.split("/").filter((part) => part);
const keyword = pathParts[1] ? decodeURIComponent(pathParts[1]) : ""; // /search/keyword...
if (keyword) {
kw.value = keyword;
page.value = 1;
list.value = [];
getList(true);
} else {
kw.value = "";
page.value = null;
isNoSearch.value = true;
getRecommendList();
nextTick(() => {
document.querySelectorAll(".vuehide").forEach((item) => (item.style.display = "none"));
});
}
});
});
let isLogin = ref(false);
@@ -50,6 +82,8 @@ const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provi
let permissions = ref([]);
let isme = ref(false);
const getUserInfoWin = () => {
const checkUser = () => {
const user = window.userInfoWin;
@@ -59,6 +93,8 @@ const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provi
userInfoWin.value = user;
if (user?.uin > 0 || user?.uid > 0) isLogin.value = true;
permissions.value = user?.authority || [];
// if (user.uid == 500144) isme.value = true;
};
document.addEventListener("getUser", checkUser);
};
@@ -101,6 +137,12 @@ const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provi
getList();
};
const fetchPageData = (pathname) => {
console.log("pathname", pathname);
const lastSegment = pathname.split("/").filter(Boolean).pop() || "index";
console.log("当前路径:", pathname, ",最后一段:", lastSegment);
};
let tabList = ref({
all: "全部",
thread: "论坛",
@@ -131,13 +173,16 @@ const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provi
let total = ref(0);
let list = ref([]);
let pagination = ref([]);
const getList = () => {
const getList = (isHistoryBack = false) => {
if (loading.value || page.value == null) return;
isNoSearch.value = false;
loading.value = true;
isEmptySearch.value = false;
const limit = 20;
window.scrollTo(0, 0);
// updateUrlParams({ page: page.value });
if (!isHistoryBack) updateUrlParams({ page: page.value });
let postHead = null;
@@ -170,7 +215,8 @@ const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provi
loading.value = false;
maxPage.value = Math.ceil(count.value / limit);
pagination.value = calculatePagination(page.value, maxPage.value);
// updateUrlLastPath(`/search/${kw.value}`);
if (location.hostname != '127.0.0.1') updateUrlLastPath(`/search/${kw.value}`, true);
removeQueryQ();
})
.catch((err) => {
@@ -242,7 +288,8 @@ const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provi
getList();
};
const startSearch = () => {
const startSearch = (value) => {
if (value) kw.value = value;
if (kw.value == "") {
creationAlertBox("error", "请输入搜索关键词");
return;
@@ -260,8 +307,8 @@ const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provi
const matterBottom = ref(false);
const handleScroll = () => {
matterHeight.value = -(matterContentRef.value.offsetHeight - window.innerHeight);
sidebarHeight.value = -(sidebarRef.value.offsetHeight - window.innerHeight);
matterHeight.value = -(matterContentRef.value?.offsetHeight - window.innerHeight);
sidebarHeight.value = -(sidebarRef.value?.offsetHeight - window.innerHeight);
if (matterHeight.value > 0) matterHeight.value = 12;
if (sidebarHeight.value > 0) sidebarHeight.value = 12;
};
@@ -275,7 +322,37 @@ const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provi
let isEmptySearch = ref(false);
return { isEmptySearch, total, matterHeight, sidebarHeight, matterBottom, matterFixed, matterContentRef, sidebarFixed, matterRef, sidebarRef, loading, typeValue, kwValue, startSearch, kw, maxPage, prevPage, nextPage, tabValue, cutTab, tabList, count, list, page, pagination, cutPage };
let tagList = ref([]);
const getTagList = () => {
ajaxGet("/v2/api/forum/getHotTags?limit=20").then((res) => {
const data = res.data;
tagList.value = data || [];
});
};
let placeholder = ref("");
let searchList = ref([]);
const getSearchList = () => {
ajaxGet("/v2/api/forum/getHotSearchWords?limit=20").then((res) => {
const data = res.data || [];
searchList.value = data;
if (data.length) placeholder.value = data[Math.floor(Math.random() * data.length)].keyword || "";
});
};
let isNoSearch = ref(true);
let recommendList = ref([]);
// 推荐阅读
const getRecommendList = () => {
if (recommendList.value?.length != 0) return;
ajaxGet("/v2/api/forum/getRecommendRead").then((res) => {
const data = res.data || [];
recommendList.value = data || [];
});
};
return { placeholder, recommendList, isNoSearch, searchList, tagList, isme, isEmptySearch, total, matterHeight, sidebarHeight, matterBottom, matterFixed, matterContentRef, sidebarFixed, matterRef, sidebarRef, loading, typeValue, kwValue, startSearch, kw, maxPage, prevPage, nextPage, tabValue, cutTab, tabList, count, list, page, pagination, cutPage };
},
});
appSearch.component("item-forum", itemForum);