diff --git a/app.vue b/app.vue index 8ee0f6a..a4f3e9d 100644 --- a/app.vue +++ b/app.vue @@ -162,7 +162,7 @@
-
+
@@ -244,179 +244,12 @@
- -
-
- 回答&讨论 - {{ 17 }} -
-
-
- -
-
-
-
- - -
-
- -
-
-
- -
-
{{ item }}
-
-
-
- - - 最多可上传1张图片，支持在输入框中直接粘贴图片。 -
-
-
发送
-
-
- -
-
-
-
- -
{{ item["nickname"] }}
-
{{ handleDate(item["timestamp"]) }}
- -
提问者
-
- - - 发送信息 - - - - TA的主页 - -
-
-
-
-
- -
举报
-
- - -
-
-
-
{{ item["content"] }}
-
- -
-
-
-
-
- - -
-
-
-
-
- -
-
{{ item }}
-
-
-
- - - 最多可上传1张图片，支持在输入框中直接粘贴图片。 -
-
-
发送
-
-
- -
-
-
-
-
- -
{{ ite["nickname"] }}
-
{{ handleDate(ite["timestamp"]) }}
-
提问者
-
回答者
- -
- - - 发送信息 - - - - TA的主页 - -
-
-
-
-
- -
举报
-
- - -
-
-
-
-
@{{ ite["reply"]["nickname"] }}
- {{ ite["content"] }} -
-
-
- -
发送
-
- -
-
-
- -
-
还有{{ item["childnum"] - 1 }}条回复
- -
-
-
-
-
- + -
共 {{ detailsInfo["answers"] }} 个回答
+ -
+
@@ -559,7 +391,6 @@
-
@@ -660,50 +491,41 @@
- - - - -
更多讨论
- + --> -
· 著作权归作者所有 ·
- + -
-
您的答案
-
+ -
-
-
- - +
@@ -1115,7 +937,12 @@ export default { }) } + provide("$ajax", $ajax) + provide("$ajaxGET", $ajaxGET) + let isNeedLogin = ref(true) // 是否需要有登录 + provide("isNeedLogin", isNeedLogin) + // 跳转登录 const goLogin = () => { if (typeof window === "undefined") return @@ -1441,13 +1268,17 @@ export default { pageListHeight.value = window.innerHeight - pageHeaderHeight.value } + let isCommentList = ref(false) + let detailsInfo = ref({}) // 详情信息 let detailsIsanswered = ref(0) // 详情信息 let detailsIscollection = ref(0) // 详情信息 let detailsIsmyself = ref(0) // 详情信息 let detailsToken = "" // 详情信息 + let detailsToken2 = ref("") // 详情信息 let detailShare = ref({}) // 详情信息 let detailLoading = ref(false) // 详情加载 + provide("detailsToken", detailsToken2) // 获取详情 const getDetails = (uniqid, index, isOpenAnswer) => { @@ -1477,7 +1308,9 @@ export default { detailsIscollection.value = data["iscollection"] || 0 detailsIsmyself.value = data["ismyself"] || 0 detailsToken = data["token"] || "" + detailsToken2.value = data["token"] || "" detailShare.value = data["share"] || {} + islike.value = data["islike"] || 0 type.value = "details" @@ -1512,7 +1345,7 @@ export default { handleInsertRelatedlist(uniqid) - getComment() + isCommentList.value = true }) .finally(() => (detailLoading.value = false)) } @@ -1544,7 +1377,7 @@ export default { if (!valve) { let content = "" - if (info["content"].indexOf("]*>/g, "") content = content.replace(/ /g, "") @@ -1570,6 +1403,7 @@ export default { // 获取详情的回答数据 const getAnswerList = () => { + return if (answerLoading || answerPage.value == 0) return answerLoading = true @@ -1800,167 +1634,6 @@ export default { }) } - // 提交回答-评论 - const submitAnswerComments = (index, ind, i) => { - if (isNeedLogin.value) { - goLogin() - return - } - - const targetAnswerList = [...answerList.value] - - let content = "" - let parentid = null - let token = targetAnswerList[index]["token"] - - if (i != null) { - content = targetAnswerList[index]["commentList"][ind]["child"][i]["commentInput"] - parentid = targetAnswerList[index]["commentList"][ind]["child"][i]["id"] - } else if (ind != null) { - content = targetAnswerList[index]["commentList"][ind]["commentInput"] - parentid = targetAnswerList[index]["commentList"][ind]["id"] - } else content = targetAnswerList[index]["commentInput"] - - $ajax("/api/comment/submit", { - content, - token, - parentid, - }).then(res => { - if (res.code != 200) return - let data = res.data - - if (i != null) { - let targetData = { - id: data["commentid"], - content, - isauthor: 1, - islike: 0, - likenum: 0, - reply: { - nickname: targetAnswerList[index]["commentList"][ind]["child"][i]["nickname"], - }, - ...data, - } - - targetAnswerList[index]["commentList"][ind]["child"][i]["commentInput"] = "" - 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, - likenum: 0, - reply: [], - ...data, - } - targetAnswerList[index]["commentList"][ind]["child"].unshift(targetData) - targetAnswerList[index]["commentList"][ind]["childnum"]++ - targetAnswerList[index]["commentList"][ind]["commentInput"] = "" - } else { - let targetData = { - id: data["commentid"], - content, - isauthor: 1, - islike: 0, - likenum: 0, - ...data, - child: [], - } - targetAnswerList[index]["commentList"].unshift(targetData) - targetAnswerList[index]["commentCount"]++ - targetAnswerList[index]["commentInput"] = "" - } - - targetAnswerList[index]["commentnum"] = data["count"] - - closeAnswerCommentsChild() - - handleMsg("success", res["message"] || "操作成功") - }) - } - - // 回答-评论 点赞 - const operateAnswerCommentsLike = (token, index, ind, i) => { - if (isNeedLogin.value) { - goLogin() - return - } - - $ajax("/api/comment/like", { - token, - }).then(res => { - if (res.code != 200) return - - let data = res.data - const targetAnswerList = [...answerList.value] - - if (i == null) { - targetAnswerList[index]["commentList"][ind]["islike"] = data["status"] - targetAnswerList[index]["commentList"][ind]["likenum"] = data["likenum"] - } else { - targetAnswerList[index]["commentList"][ind]["child"][i]["islike"] = data["status"] - targetAnswerList[index]["commentList"][ind]["child"][i]["likenum"] = data["likenum"] - } - answerList.value = targetAnswerList - - handleMsg("success", res["message"] || "操作成功") - }) - } - - // 打开 回答-评论 的子评论 - const openAnswerCommentsChild = (index, i) => { - if (isNeedLogin.value) { - goLogin() - return - } - - closeAnswerCommentsChild() - - if (i == null) commentList.value[index]["childState"] = true - else commentList.value[index]["child"][i]["childState"] = true - } - - // 关闭 回答-评论 的子评论 - const closeAnswerCommentsChild = () => { - const targetAnswerList = [...answerList.value] - - commentList.value.forEach(ele => { - ele["childState"] = false - if (ele["child"] && ele["child"].length != 0) { - ele["child"].forEach(el => { - el["childState"] = false - }) - } - }) - - answerList.value = targetAnswerList - } - - // 获取剩下的子评论 - const alsoCommentsData = (index, ind) => { - const targetAnswerList = [...answerList.value] - const parentid = targetAnswerList[index]["commentList"][ind]["id"] - const token = targetAnswerList[index]["token"] - - $ajax("/api/comment/childrenList", { - token, - parentid, - limit: 20, - page: 1, - childlimit: 1, - }).then(res => { - if (res.code != 200) return - let data = res.data - - let merged1 = [...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"] = merged1 - answerList.value = targetAnswerList - }) - } - let myType = ref("") // collect answers questions // 专门处理 我的 弹窗数据 const handleMy = key => { @@ -2416,6 +2089,8 @@ export default { return result } + provide("handleDate", handleDate) + let questionsTransmitState = ref(false) // 问题的转发 弹窗状态 let questionsTransmitMaskState = ref(false) // 问题的转发 弹窗蒙版状态状态 @@ -2516,6 +2191,8 @@ export default { }) } + provide("uploadImg", uploadImg) + // 回答 的 placeholder 状态 let questionPlaceholderState = ref(false) let yourAnswerPlaceholderState = ref(true) // 您的答案的 placeholder 状态 @@ -2544,6 +2221,8 @@ export default { msg.value["text"] = text } + provide("handleMsg", handleMsg) + // 修改提示框类型 const boxClass = () => { msgShowTimer() @@ -2718,16 +2397,13 @@ export default { } // 打开举报 - const handleMenuState = (index, i) => { - if (isNeedLogin.value) { - goLogin() - return - } - if (i === undefined) reportToken = commentList.value[index]["token"] - else reportToken = commentList.value[index]["child"][i]["token"] + const handleMenuState = (token) => { + reportToken = token alertShow.value = true } + provide("handleMenuState", handleMenuState) + // 举报 token let reportToken = "" const reasonList = ["广告", "辱骂", "重复发送", "不良信息", "其他"] @@ -3405,167 +3081,8 @@ export default { } const commentList = ref([]) - let commentCount = ref(0) - let commentTotalCount = ref(0) - let commentPage = ref(1) - let isgetCommentSate = false // 请求评论状态 - let alreadyCommentIdList = [] - const getComment = () => { - console.log("getComment") - - if (commentPage.value == 0 || isgetCommentSate) return - isgetCommentSate = true - console.log("getComment") - // https://offer.gter.net/miniprogramApi/offer/comments/lists - $ajax("/api/comment/lists", { - token: detailsToken, - page: commentPage.value, - limit: 1000, - }) - .then(res => { - if (res.code != 200) return - let data = res.data - - data.data.forEach((element, index) => { - element["isReplyBoxShow"] = 0 - // element.timestamp = util.timeformat(element.timestamp, 2) - if (element.child.length > 0) { - element.child.forEach(el => { - // el.timestamp = util.timeformat(el.timestamp, 2) - el["isReplyBoxShow"] = 0 - }) - } - }) - - if (commentPage.value > 1) { - let alreadyCommentIdList = alreadyCommentIdList - for (let index = 0; index < data.data.length; index++) { - if (alreadyCommentIdList.includes(data.data[index].id)) { - data.data.splice(index, 1) - index-- - } - } - } - - commentList.value = commentList.value.concat(data.data) - console.log("commentList", commentList.value) - - commentCount.value = data.count - commentTotalCount.value = data.comments - commentPage.value = data.count > commentList.length ? commentPage.value + 1 : 0 - - // console.log("commentList", commentList) - // this.setData({ - // commentList, - // commentCount: data.count, - // commentTotalCount: data.comments, - // commentPage: data.count > commentList.length ? this.data.commentPage + 1 : 0, - // }) - }) - .finally(() => { - isgetCommentSate = false - }) - } - - let picture = ref({}) - - const handleFileUpload = event => { - closeEmoji() - const file = event.target.files[0] // 获取选择的文件 - if (file) { - const reader = new FileReader() - reader.onload = e => { - const base64 = e.target.result - uploadImg(base64).then(res => { - picture.value = { - base64, - ...res, - } - handleMsg("success", "上传成功") - }) - } - reader.readAsDataURL(file) - } - } - - // 删除上传的图片 - const closeFileUpload = () => { - picture.value = {} - } - - // - let emojiState = ref(false) - - const emojiData = ["😀", "😁", "😆", "😅", "😂", "😉", "😍", "🥰", "😋", "😜", "🤪", "😎", "🤩", "🥳", "😔", "🙁", "😭", "😡", "😳", "🤗", "🤔", "🤭", "🤫", "😯", "😵", "🙄", "🥴", "🤢", "🤑", "🤠", "👌", "✌️", "🤟", "🤘", "🤙", "👍", "👎", "✊", "👏", "🤝", "🙏", "💪", "❤️", "💔", "🌹", "🥀", "🎉", "🎁", "🧧", "🌙", "⭐", "🌍", "💌", "📬", "🚗", "🚕", "🚲", "🛵", "🚀", "🚁", "⛵", "🚢", "🍎", "🍐", "🍊", "🍉", "🍓", "🍑", "🍔", "🍟", "🍕", "🥪", "🍜", "🍡", "🍨", "🍦", "🎂", "🍰", "🍭", "🍿", "🍩", "🧃", "🍹"] - - // 打开 Emoji - const openEmoji = () => { - emojiState.value = true - } - - // 关闭 Emoji - const closeEmoji = () => { - emojiState.value = false - } - - // 选择 Emoji - const selectEmoji = key => { - closeEmoji() - - console.log("key", key) - } - - let isPlaceholderVisible = ref(true) - - const clearPlaceholder = () => { - isPlaceholderVisible.value = false // 聚焦时隐藏占位符 - } - - const setPlaceholder = event => { - if (event.target.innerHTML == "
") event.target.innerHTML = "" - const html = event.target.innerHTML - if (!html) isPlaceholderVisible.value = true - } - - const handleInputPaste = (event, index, i) => { - const items = event.clipboardData.items // 获取粘贴的内容 - for (let i = 0; i < items.length; i++) { - const item = items[i] - if (item.type.startsWith("image/")) { - // 检查是否为图片 - event.preventDefault() - const file = item.getAsFile() // 获取文件 - const reader = new FileReader() - reader.onload = e => { - const base64 = e.target.result - uploadImg(base64).then(res => { - console.log(index) - const obj = { - base64, - ...res, - } - - console.log(commentList.value); - - if (index == undefined) { - picture.value = obj - } else if (i >= 0) { - commentList.value[index].child[i]["picture"] = obj - } else { - commentList.value[index]["picture"] = obj - } - handleMsg("success", "上传成功") - }) - } - reader.readAsDataURL(file) - } - } - } - - // const selectEomji = key => {} - - return { handleInputPaste, setPlaceholder, clearPlaceholder, isPlaceholderVisible, openEmoji, emojiState, closeEmoji, selectEmoji, emojiData, closeFileUpload, picture, handleFileUpload, commentList, islike, handleLookOnly, zeroreply, replaceNumberObj, closeMyModel, myModelList, myModelState, listHeight, bottomTpsStyle, TAHomePage, sendMessage, avatarState, openUserInfo, isNeedLogin, handleInputYou, openListIAnswer, isListEmptyState, cutYourAnswerAnonymous, handleYourAnswer, yourAnswer, handleLogo, inTheEndState, setItemUrl, seo, originUrl, handleMenuState, reasonList, checkList, alertShow, alertText, selectRadio, alertSubmit, cutType, dialogSrc, answerPage, handleDetailsScroll, replaceState, copyText, boxClass, questionPlaceholderState, yourAnswerPlaceholderState, handleInput, handlePaste, itemStyle, listStyle, listBoxStyle, myType, type, pitchIndex, cut, list, keyword, keywordText, getList, total, typeList, typePitch, getDetails, detailsInfo, detailsIsanswered, detailsIscollection, detailsIsmyself, detailShare, detailLoading, answerList, operateLike, operateCollect, IAnswerState, IAnswerEditState, IAnswerInfo, amendIAnswer, openIAnswer, closeIAnswer, submitAnswer, openCommentState, submitAnswerComments, operateAnswerCommentsLike, openAnswerCommentsChild, closeAnswerCommentsChild, alsoCommentsData, handleAllComment, myCollectionList, myCollectionCount, myQuestionsList, myQuestionsCount, myAnswerList, myAnswerCount, cutAnswerPopupState, handleDate, handleCollectionScroll, handleAnswersScroll, handleQuestionsScroll, cancelCollection, getMyCollection, questionsSetp, questionsObj, cutAnonymous, cutQuestionsSetp, cutQuestionsPopupState, questionsTypeList, postingIssue, choosingTheme, handleMy, changeAnonymous, changeAnonymousQuestions, pageHeaderHeight, pageListHeight, questionsTransmitState, questionsTransmitMaskState, closeAllTransmitState, closeTransmitState, handleAnswerTransmitList, closeDetailMode, tabListFixeState, handleListScroll, historicalSearchState, historicalSearchList, searchFocus, searchBlur, searchClick, handleClickHistoricalItem, handleClickClear, isSearchMode, questionsInit, myCount, msg, myOpenDetails, handleAnswerText, getCurrentUrl, loading, showComments, jointriposte, randomEmojis, selectEomji, openRespondDetails, respondPopState, respondDetail, respondPopObj, closePopList, coinAmount, openInsert, insertcoinsState, insert, coinMessage, coinSelectAmountDispose, closeInsert, postCoinSbmit, cutOperate, insertcoinsNoState } + return { isCommentList, commentList, islike, handleLookOnly, zeroreply, replaceNumberObj, closeMyModel, myModelList, myModelState, listHeight, bottomTpsStyle, TAHomePage, sendMessage, avatarState, openUserInfo, isNeedLogin, handleInputYou, openListIAnswer, isListEmptyState, cutYourAnswerAnonymous, handleYourAnswer, yourAnswer, handleLogo, inTheEndState, setItemUrl, seo, originUrl, handleMenuState, reasonList, checkList, alertShow, alertText, selectRadio, alertSubmit, cutType, dialogSrc, answerPage, handleDetailsScroll, replaceState, copyText, boxClass, questionPlaceholderState, yourAnswerPlaceholderState, handleInput, handlePaste, itemStyle, listStyle, listBoxStyle, myType, type, pitchIndex, cut, list, keyword, keywordText, getList, total, typeList, typePitch, getDetails, detailsInfo, detailsIsanswered, detailsIscollection, detailsIsmyself, detailShare, detailLoading, answerList, operateLike, operateCollect, IAnswerState, IAnswerEditState, IAnswerInfo, amendIAnswer, openIAnswer, closeIAnswer, submitAnswer, openCommentState, handleAllComment, myCollectionList, myCollectionCount, myQuestionsList, myQuestionsCount, myAnswerList, myAnswerCount, cutAnswerPopupState, handleDate, handleCollectionScroll, handleAnswersScroll, handleQuestionsScroll, cancelCollection, getMyCollection, questionsSetp, questionsObj, cutAnonymous, cutQuestionsSetp, cutQuestionsPopupState, questionsTypeList, postingIssue, choosingTheme, handleMy, changeAnonymous, changeAnonymousQuestions, pageHeaderHeight, pageListHeight, questionsTransmitState, questionsTransmitMaskState, closeAllTransmitState, closeTransmitState, handleAnswerTransmitList, closeDetailMode, tabListFixeState, handleListScroll, historicalSearchState, historicalSearchList, searchFocus, searchBlur, searchClick, handleClickHistoricalItem, handleClickClear, isSearchMode, questionsInit, myCount, msg, myOpenDetails, handleAnswerText, getCurrentUrl, loading, showComments, jointriposte, randomEmojis, selectEomji, openRespondDetails, respondPopState, respondDetail, respondPopObj, closePopList, coinAmount, openInsert, insertcoinsState, insert, coinMessage, coinSelectAmountDispose, closeInsert, postCoinSbmit, cutOperate, insertcoinsNoState } }, } diff --git a/components/commentList.vue b/components/commentList.vue new file mode 100644 index 0000000..80d7f80 --- /dev/null +++ b/components/commentList.vue @@ -0,0 +1,557 @@ + + + diff --git a/css/index.css b/css/index.css index e9a6e51..94d3021 100644 --- a/css/index.css +++ b/css/index.css @@ -666,7 +666,6 @@ a { display: block; } #answer-app .main .details-area-box .details-box .answer-discuss { - width: 627px; background-color: #ffffff; border: 1px solid #ebebeb; border-radius: 10px; @@ -1344,6 +1343,10 @@ a { color: #92a1bf; display: inline; } +#answer-app .main .details-area-box .details-box .comments-box .comments-item .comments-content .comments-img { + width: 75px; + margin-bottom: 13px; +} #answer-app .main .details-area-box .details-box .comments-box .comments-item .comments-content .comments-input-box { margin-top: 13px; } diff --git a/css/index.less b/css/index.less index 45a523d..af1234a 100644 --- a/css/index.less +++ b/css/index.less @@ -835,7 +835,6 @@ a { } .answer-discuss { - width: 627px; background-color: rgba(255, 255, 255, 1); border: 1px solid rgba(235, 235, 235, 1); border-radius: 10px; @@ -1625,6 +1624,11 @@ a { } } + .comments-img { + width: 75px; + margin-bottom: 13px; + } + .comments-input-box { margin-top: 13px;