A1300399510/PC-questions-answers
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

no message

Browse Source
This commit is contained in:
A1300399510
2023-12-01 15:33:30 +08:00
parent c27e4a5420
commit b91bbd90fc
5 changed files with 796 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

294
js/index.js
View File

@@ -1,7 +1,5 @@
// 提交问题
// 切换头部分类
// 转发的链接和title
// 图片上传有一些错误
// 评论的回答者 提问者
// 列表 hot标签
Object.assign(window, Vue)
const forumApp = Vue.createApp({
@@ -13,16 +11,16 @@ const forumApp = Vue.createApp({
onMounted(() => {
getUrlParams()
getUserData()
getList()
getListClass()
window.addEventListener('scroll', handleScroll);
getHistoricalSearchList()
})
onUnmounted(() => {
window.removeEventListener('keydown', handleKeydown)
window.removeEventListener('scroll', handleScroll);
});
@@ -40,7 +38,10 @@ const forumApp = Vue.createApp({
initParams = params
if (params['uniqid']) getDetails(params['uniqid'])
if (params['keyword']) keyword.value = params['keyword']
if (params['tid']) typePitch.value = params['tid']
getList()
}
// 获取当前url
@@ -122,7 +123,7 @@ const forumApp = Vue.createApp({
getList()
replaceState()
deleteState(['keyword'])
}
let historicalSearchState = ref(false) // 历史记录弹窗状态
@@ -136,7 +137,8 @@ const forumApp = Vue.createApp({
const clientHeight = document.documentElement.clientHeight;
// 列表下 滑动到底部 获取新数据
if (scrollTop + clientHeight >= scrollHeight) getList()
// console.log("type.value == 'list'", type.value == 'list', scrollTop + clientHeight, scrollHeight);
// if (scrollTop + clientHeight >= scrollHeight - 40 && type.value == 'list') getList()
// 列表下 滚动到顶部 触发类型的固定状态
if (scrollTop > 115 && type.value == 'list') tabListFixeState.value = true
@@ -213,10 +215,19 @@ const forumApp = Vue.createApp({
let detailsIsmyself = ref(0) // 详情信息
let detailsToken = '' // 详情信息
let detailShare = ref({}) // 详情信息
let detailLoading = ref(false) // 详情加载
// 获取详情
const getDetails = (uniqid, index, isOpenAnswer) => {
// uniqid = "fubm5CnD05qj" // 标记一下
if (detailLoading.value) return
detailLoading.value = true
// uniqid = "fubm5CnD05qj" // 标记一下 8yr1m1fOH5CS
detailsInfo.value = {}
answerList.value = []
answerPage.value = 0
$ajax("/api/details", { uniqid }).then(res => {
if (res.code != 200) return
let data = res.data
@@ -231,29 +242,7 @@ const forumApp = Vue.createApp({
type.value = 'details'
if (index !== null && index !== undefined) cut(index)
else {
let targetList = [...list.value]
let valve = false
targetList.forEach((element, index) => {
if (element['uniqid'] == uniqid) {
cut(index)
valve = true
}
})
if (!valve) {
list.value.unshift({
answers: data.info['answers'],
content: data.info['content'],
publicationdate: data.info['publicationdate'],
title: data.info['title'],
uniqid,
})
cut(0)
}
}
else calculateListIndex(data.info, uniqid)
answerList.value = []
answerPage.value = 1
@@ -264,9 +253,41 @@ const forumApp = Vue.createApp({
if (isOpenAnswer) openIAnswer()
replaceState({ uniqid })
}).finally(() => {
detailLoading.value = false
})
}
//
const calculateListIndex = (info, uniqid) => {
let targetList = [...list.value]
if (targetList.length == 0 && isSearchMode.value == false) {
setTimeout(() => calculateListIndex(info, uniqid), 200)
return
}
let valve = false
targetList.forEach((element, index) => {
if (element['uniqid'] == uniqid) {
cut(index)
valve = true
}
})
if (!valve) {
let content = ""
if (info['content'].indexOf('<img') == -1) content = info['content']
list.value.unshift({
answers: info['answers'],
content,
publicationdate: info['publicationdate'],
title: info['title'],
uniqid,
})
cut(0)
}
}
let answerList = ref([]) // 回答列表数据
let answerPage = ref(1) // 回答列表页数
let answerLoading = false // 回答列表加载
@@ -406,14 +427,14 @@ const forumApp = Vue.createApp({
content: IAnswerInfo.value['text'],
}).then(res => {
if (res.code == 200) {
answerList.value = []
answerPage.value = 1
getAnswerList()
closeIAnswer()
isNeedNewAnswersData = true
handleMsg('success', res['message'] || '操作成功')
if (!IAnswerInfo.value['token']) myCount.value['answer']++
} else {
}
})
@@ -449,7 +470,11 @@ const forumApp = Vue.createApp({
getAnswerCommentPublic(index).then(res => {
if (res.code != 200) return
let data = res.data
let slice3 = data.data.slice(3)
console.log(answerList.value[index]['commentList'], "commentList");
answerList.value[index]['commentList'] = answerList.value[index]['commentList'].concat(data.data.slice(3))
answerList.value[index]['commentList'] = merged
handleMsg('success', res['message'] || '操作成功')
})
}
@@ -496,6 +521,7 @@ const forumApp = Vue.createApp({
if (i != null) {
let targetData = {
id: data['commentid'],
content,
isauthor: 1,
islike: 0,
@@ -507,9 +533,10 @@ const forumApp = Vue.createApp({
}
targetAnswerList[index]['commentList'][ind]['child'].unshift(targetData)
targetAnswerList[index]['commentList'][ind]['childnum']++
} else if (ind != null) {
let targetData = {
id: data['commentid'],
content,
isauthor: 1,
islike: 0,
@@ -518,6 +545,7 @@ const forumApp = Vue.createApp({
...data,
}
targetAnswerList[index]['commentList'][ind]['child'].unshift(targetData)
targetAnswerList[index]['commentList'][ind]['childnum']++
} else {
let targetData = {
@@ -529,12 +557,10 @@ const forumApp = Vue.createApp({
child: []
}
targetAnswerList[index]['commentList'].unshift(targetData)
}
closeAnswerCommentsChild()
console.log("targetAnswerList", targetAnswerList);
handleMsg('success', res['message'] || '操作成功')
})
}
@@ -601,7 +627,7 @@ const forumApp = Vue.createApp({
const alsoCommentsData = (index, ind) => {
const targetAnswerList = [...answerList.value]
const parentid = targetAnswerList[index]['commentList'][ind]['id']
const token = targetAnswerList[index]['commentList'][ind]['token']
const token = targetAnswerList[index]['token']
$ajax("/api/comment/childrenList", {
token,
@@ -610,12 +636,12 @@ const forumApp = Vue.createApp({
page: 1,
childlimit: 1,
}).then(res => {
console.log("res", res);
if (res.code != 200) return
let data = res.data
targetAnswerList[index]['commentList'][ind]['child'] = targetAnswerList[index]['commentList'][ind]['child'].concat(data.data)
let merged = [...targetAnswerList[index]['commentList'][ind]['child'], ...data.data.filter(item2 => !targetAnswerList[index]['commentList'][ind]['child'].find(item1 => item1.id == item2.id))];
targetAnswerList[index]['commentList'][ind]['child'] = merged
answerList.value = targetAnswerList
})
}
@@ -646,9 +672,13 @@ const forumApp = Vue.createApp({
let myCollectionList = ref([]) // 我的收藏列表
let myCollectionCount = ref(0) // 我的收藏数量
let myCollectionPage = 1 // 我的收藏页数
let myCollectionLading = false // 我的收藏加载中
// 获取我的收藏
const getMyCollection = () => {
if (myCollectionPage == 0) return
if (myCollectionPage == 0 || myCollectionLading) return
myCollectionLading = true
$ajax("/api/user/collect", {
limit: 20,
page: myCollectionPage,
@@ -663,7 +693,7 @@ const forumApp = Vue.createApp({
if (myCollectionList.value.length != data['count']) myCollectionPage++
else myCollectionPage = 0
})
}).finally(() => myCollectionLading = false)
}
// 取消收藏
@@ -681,19 +711,18 @@ const forumApp = Vue.createApp({
// 监听 我的收藏滚动到底部
const handleCollectionScroll = (e) => {
const el = e.target;
// 判断滚动到底部
if (el.scrollHeight - el.scrollTop !== el.clientHeight) return
if (el.scrollHeight - el.scrollTop >= el.clientHeight + 10) return
getMyCollection()
}
let myAnswerList = ref([]) // 我的回答数据
let myAnswerCount = ref(0) // 我的回答数量
let myAnswerPage = 1
let myAnswerloadimg = false
// 获取我的回答
const getMyAnswer = () => {
if (myAnswerPage == 0) return
if (myAnswerPage == 0 || myAnswerloadimg) return
myAnswerloadimg = true
$ajax("/api/user/answer", {
limit: 20,
page: myAnswerPage,
@@ -713,14 +742,14 @@ const forumApp = Vue.createApp({
myType.value = 'answers'
isNeedNewAnswersData = false
})
}).finally(() => myAnswerloadimg = false)
}
// 我的回答 的滚动到底部事件
const handleAnswersScroll = e => {
const el = e.target;
// 判断滚动到底部
if (el.scrollHeight - el.scrollTop !== el.clientHeight) return
if (el.scrollHeight - el.scrollTop >= el.clientHeight + 10) return
getMyAnswer()
}
@@ -753,9 +782,11 @@ const forumApp = Vue.createApp({
let myQuestionsList = ref([]) // 我的提问数据
let myQuestionsCount = ref(0) // 我的提问数量
let myQuestionsPage = 0 // 我的提问页数
let myQuestionsloading = false // 我的提问页数
// 获取我的提问
const getMyQuestions = () => {
if (myQuestionsPage == 0) return
if (myQuestionsPage == 0 || myQuestionsloading) return
myQuestionsloading = true
$ajax("/api/user/questions", {
limit: 20,
page: myQuestionsPage,
@@ -769,14 +800,15 @@ const forumApp = Vue.createApp({
if (myQuestionsList.value.length != data['count']) myQuestionsPage++
else myQuestionsPage = 0
})
}).finally(() => myQuestionsloading = false)
}
// 我的提问 的滚动到底部 事件
const handleQuestionsScroll = e => {
const el = e.target;
// 判断滚动到底部
if (el.scrollHeight - el.scrollTop !== el.clientHeight) return
console.log(el.scrollHeight - el.scrollTop >= el.clientHeight + 10);
if (el.scrollHeight - el.scrollTop >= el.clientHeight + 10) return
getMyQuestions()
}
@@ -850,15 +882,23 @@ const forumApp = Vue.createApp({
// 发布问题
const postingIssue = () => {
// 还没有分类
console.log("发布问题", questionsObj.value);
$ajax("/api/publish/questionsSubmit", questionsObj.value).then(res => {
console.log("res", res);
myCount.value['questions']++
if (res.code == 200) {
myCount.value['questions']++
questionsSetp.value = 0
questionsObj.value = {
token: "",
title: "",
content: "",
tags: "",
tid: "",
anonymous: 0,
}
handleMsg('success', res['message'] || '操作成功')
let data = res.data
// calculateListIndex(res)
getDetails(data['uniqid'])
return
}
handleMsg('error', res['message'] || '刷新重试！！！')
})
@@ -942,20 +982,37 @@ const forumApp = Vue.createApp({
const $ajax = (url, data) => {
url = url.indexOf('//') > -1 ? url : baseURL + url;
return new Promise(function (resolve, reject) {
// var xhr = new XMLHttpRequest()
// xhr.responseType = "json"
// xhr.withCredentials = true
// xhr.onreadystatechange = function () {
// if (xhr.readyState === 4) {
// if (xhr.status === 200) {
// if (xhr.response.code != 200) handleMsg('error', xhr.response['message'] || '报错了，请重试！！！')
// resolve(xhr.response)
// } else {
// if (xhr.response.status == 401) window.location.href = 'https://passport.gter.net';
// }
// }
// }
// xhr.open("POST", url, true)
// xhr.setRequestHeader("Content-Type", "application/json")
// xhr.setRequestHeader("authorization", "63c9bef150557f9c90e93f98d2e2497e")
// xhr.send(JSON.stringify(data))
axios.post(url, data, {
emulateJSON: true,
withCredentials: true,
headers: {
// authorization: "9l3vfdx6h5xhu2hbw4fv5ygbog1dhtly"
// authorization: "194cdc367ed40c938f2eaaf1c6dfa5ff"
authorization: "63c9bef150557f9c90e93f98d2e2497e"
authorization: "efd8239b3f9ab533ac59311096738096"
}
}).then(function (res) {
var data = null
try {
data = typeof res.data == 'string' ? JSON.parse(res.data) : res.data;
if (data['code'] != 200) handleMsg('error', data['message'] || '报错了，请重试！！！')
if (data['code'] == 401) window.location.href = 'https://passport.gter.net';
} catch (error) { }
resolve(data)
}).catch(err => {
@@ -965,7 +1022,7 @@ const forumApp = Vue.createApp({
}
// 处理时间
const handleDate = (dateTimeStamp) => {
const handleDate = (dateTimeStamp = new Date()) => {
dateTimeStamp = dateTimeStamp ? dateTimeStamp : null;
var timestamp = new Date(dateTimeStamp)
timestamp = timestamp.getTime()
@@ -1024,12 +1081,7 @@ const forumApp = Vue.createApp({
// 统计转发次数
const countForwardingTimes = (token) => {
console.log("token", token);
// return
$ajax("/api/operate/share", { token }).then(res => {
console.log("res", res);
})
$ajax("/api/operate/share", { token }).then()
}
// 关闭详情模式
@@ -1042,9 +1094,7 @@ const forumApp = Vue.createApp({
// 全部的启动到底部
const handleListScroll = (e) => {
const el = e.target;
// 判断滚动到底部
if (el.scrollHeight - el.scrollTop !== el.clientHeight) return
if (el.scrollHeight - el.scrollTop >= el.clientHeight + 40) return
getList()
}
@@ -1052,31 +1102,23 @@ const forumApp = Vue.createApp({
const handlePaste = (event) => {
const items = (event.clipboardData || event.originalEvent.clipboardData).items;
for (const item of items) {
console.log(item);
if (item.type.indexOf('image') === 0) {
// 如果包含图片，阻止默认行为
event.preventDefault();
handleMsg('warning', '上传图片中')
const file = item.getAsFile();
const reader = new FileReader();
reader.onload = (e) => {
const base64 = e.target.result
// console.log("base64", base64);
uploadImg(base64).then(res => {
const questionTextarea = document.querySelector(".question-textarea")
const imgElements = questionTextarea.querySelectorAll("img");
// console.log("imgElements1111", imgElements);
if (imgElements.length == 0) {
questionTextarea.innerHTML += `<img 1 src="${res.url}" data-aid="${res.aid}" />`
handleInput()
} else {
imgElements.forEach(img => {
// console.log("src", img.getAttribute("src"));
// if (img.getAttribute("src") == base64) {
if (img.getAttribute("data-aid") == null && img.getAttribute('data-custom') == null) {
img.setAttribute("src", res.url);
img.setAttribute("data-aid", res.aid);
}
});
}
let imgNode = document.createElement('img');
imgNode.setAttribute('src', res.url);
imgNode.setAttribute('data-aid', res.aid);
questionTextarea.appendChild(imgNode);
handleInput()
handleMsg('warning', '上传成功')
})
};
reader.readAsDataURL(file);
@@ -1157,13 +1199,6 @@ const forumApp = Vue.createApp({
const replaceState = (obj = {}) => {
// 获取当前URL参数
let params = new URLSearchParams(window.location.search);
// 循环删除所有参数
for (let key of params.keys()) {
params.delete(key);
}
// 修改URL参数
// params.set('paramName', 'paramValue');
for (const key in obj) {
params.set(key, obj[key]);
}
@@ -1171,21 +1206,27 @@ const forumApp = Vue.createApp({
// 替换当前URL，但不刷新页面
window.history.replaceState({}, '', `${window.location.pathname}?${params}`);
}
// 删除 url 参数的key
const deleteState = (keys = []) => {
let params = new URLSearchParams(window.location.search);
keys.forEach(key => {
params.delete(key);
})
window.history.replaceState({}, '', `${window.location.pathname}?${params}`);
}
// 我的打开 详情
const myOpenDetails = (value) => {
getDetails(value['uniqid'])
getDetails(value.data['uniqid'])
myType.value = ""
}
// 详情页滚动事件
const handleDetailsScroll = e => {
// console.log("e", e);
const el = e.target;
// 判断滚动到底部
if (el.scrollHeight - el.scrollTop !== el.clientHeight) return
// console.log("底部");
getAnswerList()
}
@@ -1196,9 +1237,17 @@ const forumApp = Vue.createApp({
if (e.target.tagName === 'IMG') {
var src = e.target.getAttribute('src');
dialogSrc.value = src
window.addEventListener('keydown', handleKeydown)
}
}
// 大图的监听 esc 键盘按钮
const handleKeydown = event => {
if (event.key !== 'Escape') return
dialogSrc.value = ""
window.removeEventListener('keydown', handleKeydown) // 取消监听
}
// 切换顶部的 type
const cutType = (id) => {
@@ -1206,12 +1255,56 @@ const forumApp = Vue.createApp({
page = 1
list.value = []
type.value = 'list'
pitchIndex.value = null
if (id != null) {
replaceState({ tid: id })
deleteState(['uniqid'])
} else deleteState(['tid', 'uniqid'])
getList()
}
// 打开举报
const handleMenuState = (index, ind, i) => {
if (i === undefined) reportToken = answerList.value[index].commentList[ind]['token']
else reportToken = answerList.value[index].commentList[ind]['child'][i]['token']
alertShow.value = true
}
// 举报 token
let reportToken = ""
const reasonList = ['广告', '辱骂', '重复发送', '不良信息', '其他']
let checkList = ref([])
let alertShow = ref(false)
let alertText = ref("")
const selectRadio = value => {
const index = checkList.value.indexOf(value);
if (index === -1) checkList.value.push(value);
else checkList.value.splice(index, 1);
}
// 举报提交
const alertSubmit = () => {
checkList.value.push(alertText.value)
$ajax("/api/operate/report", {
message: checkList.value,
token: reportToken,
}).then(res => {
checkList.value = []
reportToken = ""
alertShow.value = false
handleMsg('success', '举报成功')
})
}
return {
handleMenuState,
reasonList,
checkList,
alertShow,
alertText,
selectRadio,
alertSubmit,
cutType,
dialogSrc,
answerPage,
@@ -1242,6 +1335,7 @@ const forumApp = Vue.createApp({
detailsIscollection,
detailsIsmyself,
detailShare,
detailLoading,
answerList,
operateLike,
operateCollect,