fix(component): 修复组件名称错误和props类型定义
refactor(component): 重构组件模板结构,移除重复代码 feat(component): 添加可选props支持外部数据传入 style(css): 优化样式布局和响应式设计 fix(js): 修复URL路径处理逻辑和滚动加载问题 feat(search): 新增搜索页推荐内容和空状态处理 chore: 添加新图标资源文件
This commit is contained in:
26
js/public.js
26
js/public.js
@@ -401,11 +401,29 @@ let copyForumUid = (text) => {
|
||||
const updateUrlLastPath = (newLastPath, isReplace = false) => {
|
||||
const raw = typeof newLastPath === "string" ? newLastPath : String(newLastPath);
|
||||
const basePath = raw.split("?")[0];
|
||||
const newPathname = basePath.startsWith("/") ? basePath : "/" + basePath;
|
||||
|
||||
let finalPathname = "";
|
||||
if (basePath.startsWith("/")) {
|
||||
finalPathname = basePath;
|
||||
} else {
|
||||
const oldPathSegments = window.location.pathname.split("/").filter(Boolean);
|
||||
const newPathSegments = oldPathSegments.slice(0, -1); // 移除原最后一段
|
||||
if (basePath) {
|
||||
newPathSegments.push(basePath); // 添加新最后一段
|
||||
}
|
||||
finalPathname = "/" + newPathSegments.join("/");
|
||||
}
|
||||
|
||||
// 拼接完整URL
|
||||
const newSearch = window.location.search;
|
||||
const newUrl = window.location.origin + newPathname + newSearch;
|
||||
if (isReplace) history.replaceState(null, document.title, newUrl);
|
||||
else history.pushState(null, document.title, newUrl);
|
||||
const newUrl = window.location.origin + finalPathname + newSearch;
|
||||
|
||||
// 管理历史栈 + 修改URL
|
||||
if (isReplace) {
|
||||
history.replaceState(null, document.title, newUrl);
|
||||
} else {
|
||||
history.pushState(null, document.title, newUrl);
|
||||
}
|
||||
};
|
||||
|
||||
const removeQueryQ = (isReplace = false) => {
|
||||
|
||||
105
js/search.js
105
js/search.js
@@ -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);
|
||||
|
||||
Reference in New Issue
Block a user