no message

app.vue

@@ -173,8 +173,11 @@
                         <!-- 提问信息 -->
                         <div class="details-issue">
                             <!-- <div class="icon q flexcenter">Q</div> -->
-                            <img class="qq" src="@/img/Q.png" />
+                            <!-- <img class="qq" src="@/img/Q.png" /> -->
-                            <div class="titletitle">{{ detailsInfo["title"] }}</div>
+                            <div class="label">香港</div>
+                            <div class="titletitle">
+                                {{ detailsInfo["title"] }}
+                            </div>
                             <div class="hint" @click="handleAnswerText" v-if="detailsInfo['content']" v-html="detailsInfo['content']"></div>
                             <div class="info-box flexacenter">
                                 <div class="user-info flexacenter" @click="openUserInfo()">
@@ -242,6 +245,22 @@
                             </div>
                         </div>
 
+                        <div class="answer-discuss">
+                            <div class="header flexacenter">
+                                回答&讨论 <span class="num">{{ 17 }}</span>
+                            </div>
+                            <div class="input-box">
+                                <div class="top"></div>
+                                <div class="bottom flexacenter">
+                                    <div class="operate">
+                                        <img class="item" src="" alt="">
+                                        <img class="item" src="" alt="">
+                                    </div>
+                                    <div class="btn">发送</div>
+                                </div>
+                            </div>
+                        </div>
+
                         <!-- 一共多少 -->
                         <div class="answer-total-amount">共 {{ detailsInfo["answers"] }} 个回答</div>
 
@@ -2662,6 +2681,8 @@ export default {
         let initState = ref(0)
         let arrr = []
 
+        let islike = ref(0) // 是否点赞
+
         try {
             // 这是一个 等待的方法 如果复制后 会 多次等待
             // await new Promise(resolve => setTimeout(resolve, 2000))
@@ -2675,6 +2696,7 @@ export default {
                     .then(response => {
                         let res = response.data
                         let data = res.data
+                        console.log("data", data)
 
                         data["info"]["uniqid"] = params["uniqid"]
                         detailsInfoDataVuex.value = data
@@ -2684,6 +2706,7 @@ export default {
                         detailsIsmyself.value = data["ismyself"] || 0
                         detailsToken = data["token"] || ""
                         detailShare.value = data["share"] || {}
+                        islike.value = data["islike"] || 0
 
                         type.value = "details"
 
@@ -3221,7 +3244,7 @@ export default {
 
         // const selectEomji = key => {}
 
-        return { 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 { 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 }
     },
 }
 </script>

index.css

@@ -580,13 +580,25 @@ a {
   left: 50%;
   transform: translate(-50%, -50%);
 }
+#answer-app .main .details-area-box .details-box .label {
+  font-size: 12px;
+  color: #ffffff;
+  height: 21px;
+  line-height: 21px;
+  padding: 0 4px;
+  background-color: #72db86;
+  border-radius: 5px;
+  display: inline-block;
+  margin-left: 23px;
+  margin-bottom: 12px;
+}
 #answer-app .main .details-area-box .details-box .details-issue {
   border-radius: 8px;
   background-color: #fff;
-  -moz-box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.10196078);
+  -moz-box-shadow: 0 0 11px rgba(0, 0, 0, 0.10196078);
-  -webkit-box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.1);
+  -webkit-box-shadow: 0 0 11px rgba(0, 0, 0, 0.1);
-  box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.1);
+  box-shadow: 0 0 11px rgba(0, 0, 0, 0.1);
-  padding-top: 24px;
+  padding-top: 19px;
   margin-bottom: 28px;
   position: relative;
   word-break: break-all;
@@ -618,7 +630,7 @@ a {
   line-height: 22px;
   color: #000000;
   padding: 0 24px;
-  margin-bottom: 21px;
+  margin-bottom: 12px;
 }
 #answer-app .main .details-area-box .details-box .details-issue .hint {
   font-size: 14px;
@@ -660,6 +672,43 @@ a {
 #answer-app .main .details-area-box .details-box .details-issue .operate-box .answer-btn .answer-icon-edit {
   display: block;
 }
+#answer-app .main .details-area-box .details-box .answer-discuss {
+  width: 627px;
+  height: 825px;
+  background-color: #ffffff;
+  border: 1px solid #ebebeb;
+  border-radius: 10px;
+  box-shadow: 0 0 3px rgba(0, 0, 0, 0.11764706);
+  padding: 18px 22px;
+}
+#answer-app .main .details-area-box .details-box .answer-discuss .header {
+  font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+  font-weight: 650;
+  color: #000000;
+  font-size: 16px;
+}
+#answer-app .main .details-area-box .details-box .answer-discuss .header .num {
+  font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+  color: #555555;
+  margin-left: 10px;
+  font-weight: 400;
+  margin-left: 6px;
+}
+#answer-app .main .details-area-box .details-box .answer-discuss .input-box {
+  height: 110px;
+  background-color: #f6f6f6;
+  border-radius: 10px;
+}
+#answer-app .main .details-area-box .details-box .answer-discuss .input-box .bottom .btn {
+  font-size: 14px;
+  color: #333;
+  width: 80px;
+  height: 28px;
+  line-height: 28px;
+  text-align: center;
+  background-color: #fddf6d;
+  border-radius: 43px;
+}
 #answer-app .main .details-area-box .details-box .answer-total-amount {
   color: #555555;
   line-height: 22px;

index.less

@@ -733,14 +733,27 @@ a {
                     }
                 }
 
+                .label {
+                    font-size: 12px;
+                    color: #ffffff;
+                    height: 21px;
+                    line-height: 21px;
+                    padding: 0 4px;
+                    background-color: rgba(114, 219, 134, 1);
+                    border-radius: 5px;
+                    display: inline-block;
+                    margin-left: 23px;
+                    margin-bottom: 12px;
+                }
+
                 .details-issue {
                     // width: 627px;
                     border-radius: 8px;
                     background-color: #fff;
-                    -moz-box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.101960784313725);
+                    -moz-box-shadow: 0 0 11px rgba(0, 0, 0, 0.101960784313725);
-                    -webkit-box-shadow: 0px 0px 11px rgb(0 0 0 / 10%);
+                    -webkit-box-shadow: 0 0 11px rgb(0 0 0 / 10%);
-                    box-shadow: 0px 0px 11px rgb(0 0 0 / 10%);
+                    box-shadow: 0 0 11px rgb(0 0 0 / 10%);
-                    padding-top: 24px;
+                    padding-top: 19px;
                     margin-bottom: 28px;
                     position: relative;
                     word-break: break-all;
@@ -774,7 +787,7 @@ a {
                         line-height: 22px;
                         color: #000000;
                         padding: 0 24px;
-                        margin-bottom: 21px;
+                        margin-bottom: 12px;
                     }
 
                     .hint {
@@ -828,6 +841,49 @@ a {
                     }
                 }
 
+                .answer-discuss {
+                    width: 627px;
+                    height: 825px;
+                    background-color: rgba(255, 255, 255, 1);
+                    border: 1px solid rgba(235, 235, 235, 1);
+                    border-radius: 10px;
+                    box-shadow: 0 0 3px rgba(0, 0, 0, 0.117647058823529);
+                    padding: 18px 22px;
+
+                    .header {
+                        font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+                        font-weight: 650;
+                        color: #000000;
+                        font-size: 16px;
+                        .num {
+                            font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+                            color: #555555;
+                            margin-left: 10px;
+                            font-weight: 400;
+                            margin-left: 6px;
+                        }
+                    }
+
+                    .input-box {
+                        height: 110px;
+                        background-color: rgba(246, 246, 246, 1);
+                        border-radius: 10px;
+
+                        .bottom {
+                            .btn {
+                                font-size: 14px;
+                                color: #333;
+                                width: 80px;
+                                height: 28px;
+                                line-height: 28px;
+                                text-align: center;
+                                background-color: rgba(253, 223, 109, 1);
+                                border-radius: 43px;
+                            }
+                        }
+                    }
+                }
+
                 .answer-total-amount {
                     color: #555555;
                     line-height: 22px;