From 30bd877e5b5b95e848e874ff6a621dd4858f5d9f Mon Sep 17 00:00:00 2001 From: A1300399510 Date: Tue, 19 Dec 2023 19:07:58 +0800 Subject: [PATCH] no message --- .gitignore | 2 +- app.vue | 199 +++++++++++++++++++++++++++++++++++++++++------------ index.css | 14 +++- index.less | 20 +++++- 4 files changed, 188 insertions(+), 47 deletions(-) diff --git a/.gitignore b/.gitignore index 016ca54..94fe1f8 100644 --- a/.gitignore +++ b/.gitignore @@ -4,7 +4,7 @@ .nuxt .nitro .cache -/dist + # Node dependencies /node_modules diff --git a/app.vue b/app.vue index 9d55773..af3b868 100644 --- a/app.vue +++ b/app.vue @@ -79,41 +79,56 @@
共 {{ total }} 条问答
- - -
-
- -
推荐阅读
-
+
- 到底了 -
@@ -828,7 +843,7 @@ export default { type.value = "details" let data = detailsInfoDataVuex.value - console.log("data", data) + // console.log("data", data) detailsInfo.value = data["info"] || {} detailsIsanswered.value = data["isanswered"] || 0 @@ -849,6 +864,8 @@ export default { replaceState({uniqid: params["uniqid"]}) seo.value = data.seo + + getRecommend() } // 是否是后退 状态 @@ -1002,6 +1019,7 @@ export default { let keywordText = ref("") // 搜索的文本 let list = ref([]) // 列表数据 + let backupsList = [] // 备份列表数据 let page = 1 let total = ref(0) // 回答总数 let loading = ref(false) @@ -1027,6 +1045,8 @@ export default { let data = res.data list.value = list.value.concat(data.data || []) + backupsList = backupsList.concat(data.data || []) + total.value = data.count || 0 keywordText.value = keyword.value || "" @@ -1043,6 +1063,8 @@ export default { if (keyword.value) isSearchMode.value = true else isSearchMode.value = false + + if (type.value == "details") handleInsertRelatedlist() }) .finally(() => (loading.value = false)) } @@ -1134,6 +1156,10 @@ export default { // 默认 详情 div 滚动到顶部 nextTick(() => detailsAreaScrollTop()) + + + handleInsertRelatedlist() + }) .finally(() => (detailLoading.value = false)) } @@ -1893,12 +1919,19 @@ export default { return } let list = document.querySelector(".list-box") + let item = list.querySelector(`.item${pitchIndex.value}`) + // let prevNode = list.previousElementSibling; // 获取上一个节点 - list.scrollTo({ - // top: 128 * pitchIndex.value - pageListHeight.value / 2 - 385, - top: 128 * pitchIndex.value + 68 - pageListHeight.value / 2, - behavior: "smooth", - }) + // console.log(list.scrollTop, "list") + // console.log(item, "item") + // let top = item.offsetTop - prevNode.offsetTop + + // list.scrollTo({ + // // top: 128 * pitchIndex.value - pageListHeight.value / 2 - 385, + // // top: 128 * pitchIndex.value + 68 - pageListHeight.value / 2, + // top, + // behavior: "smooth", + // }) isNeedScrollMiddle = false } @@ -1928,7 +1961,7 @@ export default { let itemHeightLeft = 0 let itemHeightRight = 0 - const itemStyle = (index, content) => { + const itemStyle = (index, content, typetype) => { if (index == 0) { itemHeightLeft = 0 itemHeightRight = 0 @@ -1945,7 +1978,6 @@ export default { obj["top"] = itemHeightLeft + "px" itemHeightLeft += content == "" ? 107 : 136 - obj["left"] = 0 } else { obj["top"] = itemHeightRight + "px" @@ -1955,13 +1987,21 @@ export default { } else { obj["top"] = itemHeightLeft + "px" - itemHeightLeft += content == "" ? 107 : 136 - obj["height"] = content == "" ? 107 + "px" : 136 + "px" + if (!typetype) { + itemHeightLeft += content == "" ? 107 : 136 + + obj["height"] = content == "" ? 107 + "px" : 136 + "px" + } else { + itemHeightLeft += typetype == "vote" ? 170 : 136 + + obj["height"] = typetype == "vote" ? 170 + "px" : 136 + "px" + } obj["left"] = 0 obj["width"] = "100%" obj["paddingLeft"] = "calc((100vw - 1200px) / 2)" } + // 通过最后一个 算 列表的高度 if (index + 1 == list.value.length) listHeight.value = Math.max(itemHeightLeft, itemHeightRight) return obj @@ -2069,6 +2109,7 @@ export default { pitchIndex.value = null deleteState(["uniqid"]) seo.value = {} + list.value = JSON.parse(JSON.stringify(backupsList)) } // 全部的启动到底部 @@ -2219,7 +2260,6 @@ export default { let myModelState = ref(false) // 我的模式状态 let myModelList = ref([]) // 我的模式列表 - // let listlist = [] // 列表的临时存放 let temporaryData = {} // 临时存放 // 我的打开 详情 @@ -2230,16 +2270,23 @@ export default { } deleteState(["keyword"]) + console.log(myModelState.value, "myModelState"); + if (!myModelState.value) { temporaryData = { total: total.value, keywordText: keywordText.value, isSearchMode: isSearchMode.value, + inTheEndState: inTheEndState.value, type: type.value, pitchIndex: pitchIndex.value, listlist: JSON.parse(JSON.stringify(list.value)), } + isSearchMode.value = false + inTheEndState.value = false + keyword.value = "" + list.value = JSON.parse(JSON.stringify(myModelList.value)) myModelState.value = true @@ -2257,10 +2304,13 @@ export default { isSearchMode.value = temporaryData["isSearchMode"] keywordText.value = temporaryData["keywordText"] + keyword.value = temporaryData["keywordText"] total.value = temporaryData["total"] type.value = temporaryData["type"] pitchIndex.value = temporaryData["pitchIndex"] + inTheEndState.value = temporaryData["inTheEndState"] list.value = JSON.parse(JSON.stringify(temporaryData.listlist)) + myModelState.value = false let uniqid = list.value[pitchIndex.value]["uniqid"] @@ -2309,6 +2359,9 @@ export default { } else deleteState(["tid", "uniqid"]) getList() + + // 创新请求 设置列表的高度 为0 + listHeight.value = 0 } // 打开举报 @@ -2366,7 +2419,7 @@ export default { if (process.server) { // const headers = useRequestHeaders(["cookie"]) await axios - .post(baseURL + "/api/details", {uniqid: params["uniqid"]},) + .post(baseURL + "/api/details", {uniqid: params["uniqid"]}) .then(response => { let res = response.data let data = res.data @@ -2440,6 +2493,8 @@ export default { let data = res.data list.value = list.value.concat(data.data || []) + backupsList = backupsList.concat(data.data || []) + total.value = data.count || 0 keywordText.value = keyword.value || "" @@ -2571,7 +2626,65 @@ export default { else setTimeout(() => openBottom(), 1000) } + let recommendList = [] // 推荐相关的数据 + let recommendPage = 1 + + // 获取推荐数据 + const getRecommend = () => { + $ajaxGET("/api/details/relatedlist", {page: recommendPage, limit: 20}).then(res => { + if (res.code != 200) return + + let obj = { + offer: "Offer", + mj: "面经", + vote: "投票", + thread: "帖子", + } + + let data = res.data + // 替换 类名 + data.forEach(element => { + element["typename"] = obj[element["type"]] + element["isrecom"] = true + }) + recommendList = recommendList.concat(data) + recommendPage++ + handleInsertRelatedlist() + }) + } + + // 处理插入推荐数据 + const handleInsertRelatedlist = () => { + // 计算需要插入元素的数量 + let insertCount = Math.ceil(backupsList.length / 5) + // 检查数组B的长度是否足够 + if (recommendList.length < insertCount) { + getRecommend() + return + } + + let target = JSON.parse(JSON.stringify(backupsList)) + let result = [] + let j = 0 + + for (let i = 0; i < target.length; i++) { + result.push(target[i]) + if ((i + 1) % 4 === 0 && j < recommendList.length) { + result.push(recommendList[j]) + j++ + } + } + list.value = JSON.parse(JSON.stringify(result)) + } + + const replaceNumberObj = { + 0: "①", + 1: "②", + 2: "③", + } + return { + replaceNumberObj, closeMyModel, myModelList, myModelState, diff --git a/index.css b/index.css index b45f23e..2069f68 100644 --- a/index.css +++ b/index.css @@ -400,7 +400,6 @@ a { font-size: 12px; color: #72DB86; text-align: center; - width: 58px; height: 21px; background-color: rgba(114, 219, 134, 0.117647); padding: 0 5px; @@ -422,6 +421,19 @@ a { margin: 0 10px; color: #D7D7D7; } +#answer-app .main .list-box .list .item .content .answer .value-value:not(:last-of-type) { + padding-right: 10px; + position: relative; + margin-right: 10px; +} +#answer-app .main .list-box .list .item .content .answer .value-value:not(:last-of-type)::after { + content: "|"; + position: absolute; + right: 0; + top: 50%; + color: #D7D7D7; + transform: translateY(-50%); +} #answer-app .main .list-box .list .item .content .bottom { margin-top: 18px; font-size: 12px; diff --git a/index.less b/index.less index 30d7785..0b8baa2 100644 --- a/index.less +++ b/index.less @@ -518,7 +518,7 @@ a { font-size: 12px; color: #72DB86; text-align: center; - width: 58px; + // width: 58px; height: 21px; background-color: rgba(114, 219, 134, 0.117647); padding: 0 5px; @@ -541,7 +541,23 @@ a { .halving-line { margin: 0 10px; - color:#D7D7D7; + color: #D7D7D7; + } + + .value-value { + &:not(:last-of-type) { + padding-right: 10px; + position: relative; + margin-right: 10px; + &::after { + content: "|"; + position: absolute; + right: 0; + top: 50%; + color: #D7D7D7; + transform: translateY(-50%); + } + } } }