no message
This commit is contained in:
A1300399510
parent
ed63938718
commit
30bd877e5b
2
.gitignore
vendored
2
.gitignore
vendored
@ -4,7 +4,7 @@
|
||||
.nuxt
|
||||
.nitro
|
||||
.cache
|
||||
/dist
|
||||
|
||||
|
||||
# Node dependencies
|
||||
/node_modules
|
||||
|
||||
199
app.vue
199
app.vue
@ -79,41 +79,56 @@
|
||||
<div v-else class="total grid-item" @click="cut">共 {{ total }} 条问答</div>
|
||||
</div>
|
||||
<div class="list" id="list" :style="[listStyle(), {height: listHeight + 'px'}]">
|
||||
<a class="item grid-item flexflex" v-for="(item, index) in list" :key="index" :style="itemStyle(index, item['content'])" :class="{pitch: index === pitchIndex, upLevel: index === pitchIndex - 1}" :href="setItemUrl(item['uniqid'])" @click.stop.prevent="getDetails(item['uniqid'], index)">
|
||||
<img class="dot" src="./img/dot.svg" />
|
||||
<div class="content" :style="{width: type == 'list' ? '531px' : '430px'}">
|
||||
<div class="issue-title flexcenter">
|
||||
<img class="hot-icon" v-if="item['ishot'] == 1" src="./img/hot-icon.png" />
|
||||
<div class="recommend flexcenter" v-if="false">推荐阅读</div>
|
||||
<div class="issue ellipsis flex1" v-html="item['title']"></div>
|
||||
<template v-for="(item, index) in list" :key="index">
|
||||
<a v-if="item['isrecom']" class="item grid-item flexflex" :style="itemStyle(index, item['content'], item['type'])" :class="{pitch: index === pitchIndex, upLevel: index === pitchIndex - 1}" target="_blank" :href="item['url']">
|
||||
<img class="dot" src="./img/dot.svg" />
|
||||
<div class="content" :style="{width: type == 'list' ? '531px' : '430px'}">
|
||||
<div class="issue-title flexcenter">
|
||||
<div class="recommend flexcenter">推荐阅读</div>
|
||||
<div class="issue ellipsis flex1" v-html="item['title']"></div>
|
||||
</div>
|
||||
<template v-if="item['type'] == 'thread'">
|
||||
<div class="answer ellipsis" v-if="item['message']" v-html="item['message']"></div>
|
||||
</template>
|
||||
<div class="answer" style="height: auto;" v-else-if="item['type'] == 'vote'">
|
||||
<div v-for="(ite, i) in item['option'].slice(0, 2)" :key="i">{{ replaceNumberObj[i] + ite }}</div>
|
||||
<div>{{ replaceNumberObj[2] }} …</div>
|
||||
</div>
|
||||
<template v-else>
|
||||
<div class="answer ellipsis flexacenter">
|
||||
<div class="value-value" v-if="item['profession'] || item['professional']">{{ item["profession"] || item["professional"] }}</div>
|
||||
<div class="value-value" v-if="item['project'] || item['degree']">{{ item["project"] || item["degree"] }}</div>
|
||||
<div class="value-value" v-if="item['interviewtime'] || item['semester']">{{ item["interviewtime"] || item["semester"] }}</div>
|
||||
<div class="value-value" v-if="item['apply_results']">{{ item["apply_results"] }}</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="bottom flexacenter">
|
||||
<div class="typename flexcenter">{{ item["typename"] }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<template v-if="true">
|
||||
</a>
|
||||
<a v-else class="item grid-item flexflex" :style="itemStyle(index, item['content'])" :class="[{pitch: index === pitchIndex, upLevel: index === pitchIndex - 1}, `item${index}`]" :href="setItemUrl(item['uniqid'])" @click.stop.prevent="getDetails(item['uniqid'], index)">
|
||||
<img class="dot" src="./img/dot.svg" />
|
||||
<div class="content" :style="{width: type == 'list' ? '531px' : '430px'}">
|
||||
<div class="issue-title flexcenter">
|
||||
<img class="hot-icon" v-if="item['ishot'] == 1" src="./img/hot-icon.png" />
|
||||
<div class="issue ellipsis flex1" v-html="item['title']"></div>
|
||||
</div>
|
||||
<div class="answer ellipsis" v-if="item['content']" v-html="item['content']"></div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="answer ellipsis flexacenter" v-if="item['content']">
|
||||
Asian Studies
|
||||
<div class="halving-line">|</div>
|
||||
MPhil
|
||||
<div class="halving-line">|</div>
|
||||
23Fall
|
||||
<div class="halving-line">|</div>
|
||||
offer
|
||||
</div>
|
||||
</template>
|
||||
<div class="bottom flexacenter">
|
||||
<div class="typename flexcenter" v-if="item['typename']">{{ item["typename"] }}</div>
|
||||
<div v-else></div>
|
||||
<div class="flexacenter">
|
||||
<div class="quantity">{{ item["answers"] == 0 ? "暂无回答" : "共" + item["answers"] + "个回答" }}</div>
|
||||
<template v-if="type == 'list'">
|
||||
<div class="longString"></div>
|
||||
<div class="answer-btn" @click.stop.prevent="openListIAnswer(index)">我来回答</div>
|
||||
</template>
|
||||
<div class="bottom flexacenter">
|
||||
<div class="typename flexcenter" v-if="item['typename']">{{ item["typename"] }}</div>
|
||||
<div v-else></div>
|
||||
<div class="flexacenter">
|
||||
<div class="quantity">{{ item["answers"] == 0 ? "暂无回答" : "共" + item["answers"] + "个回答" }}</div>
|
||||
<template v-if="type == 'list'">
|
||||
<div class="longString"></div>
|
||||
<div class="answer-btn" @click.stop.prevent="openListIAnswer(index)">我来回答</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</a>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div class="bottom-tps" :style="bottomTpsStyle()" v-if="inTheEndState">- 到底了 -</div>
|
||||
@ -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,
|
||||
|
||||
14
index.css
14
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;
|
||||
|
||||
20
index.less
20
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%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user