a1300399510@qq.com 提交于 2023/04/06 -18:40:01

src/views/detail/detailIndex.vue

@@ -125,12 +125,72 @@
 
                 <template v-else>
                     <div class="offer-content">
-                        <div v-html="info.message" style="line-height: normal;" class="vHtmlMessage" >
+                        <div v-html="info.message" style="line-height: normal;" class="vHtmlMessage">
                         </div>
                     </div>
                 </template>
             </div>
 
+            <template v-if="postList.list.length != 0">
+                <div class="card-item shadow" v-for="(item, index) in postList.list" :key="index">
+                    <div class="card-head flexacenter">
+                        <img class="card-head-icon"
+                            src="https://axure-file.lanhuapp.com/md516b251fb-9cfa-46fc-a9b6-2a41a7b4dc37__3ad73406ff4bc8b138dafc6dcbf1a635.svg" />
+                        <div class="card-head-content flex1 flexflex">
+                            <div class="card-head-name flexflex">闫旭Mike <div class="landlord flexcenter" v-if="index == 0">
+                                    楼主
+                                </div>
+                            </div>
+                            <div class="card-head-time">2022-7-6 14:56</div>
+                        </div>
+                        <div class="card-head-fool">{{ index == 0 ? '楼主' : `${index}楼` }}</div>
+                    </div>
+
+                    <div class="card-content flex1">
+                        <!-- 回复引用 -->
+                        <div class="quotation flexflex" v-if="index == 1">
+                            <svg-icon icon-class="quotation-left" class-name="quotation-icon"></svg-icon>
+                            <div class="quotation-right flex1 flexflex">
+                                <div class="quotation-wenzi flex1 three-lines">
+                                    这个离开香港是否超过180天，应该是居籍的判断，而非物理空间变化的判断。简单来说，只要你在香港纳税，你在香港有工作，有现金流，有房子…这个离开香港是否超过180天，应该是居籍的判断，而非物理空间变化的判断。简单来说，只要你在香港纳税，你在香港有工作，有现金流，有房子…这个离开香港是否超过180天，应该是居籍的判断，而非物理空间变化的判断。简单来说，只要你在香港纳税，你在香港有工作，有现金流，有房子…
+                                </div>
+
+                                <div class="quotation-bottom flexacenter">zhangsd 发表于 2022-7-6 14:56
+                                    <svg-icon icon-class="quotation-right" class-name="quotation-icon"></svg-icon>
+                                </div>
+                            </div>
+                        </div>
+                        之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
+                        <!-- 未解锁区域 -->
+                        <div class="flexcenter content-unlock content-unlock-no" v-if="index == 3 || index == 4">
+                            <img class="unlock-icom" src="@/assets/img/detail/unlock.png">
+                            {{ index == 3 ? '作者设置了回复可见' : '' }}
+                            {{ index == 4 ? '作者设置了投币可见' : '' }}
+                        </div>
+                        <!-- 已经解锁区域 -->
+                        <div class="content-unlock content-already" v-if="index == 5 || index == 6">
+                            <div class="content-already-header flexflex">
+                                - 本内容投币可见 -
+                            </div>
+
+                            <div class="content-unlock-wenzi">
+
+                                香港身份证件和IANG Visa label；
+
+                                香港购买的保险和MPF的缴费账单；
+
+                                电话账单和当时香港上台的合约文件；
+
+                            </div>
+
+                        </div>
+
+                        之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
+                        之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
+                    </div>
+                </div>
+            </template>
+
             <template v-if="false">
                 <div class="card-item shadow" v-for="(item, index) in 7" :key="index">
                     <div class="card-head flexacenter">
@@ -191,11 +251,10 @@
                 </div>
             </template>
 
-
         </div>
 
         <!-- 分页 -->
-        <div class="paging flexcenter">
+        <div class="paging flexcenter" v-if="postList.list.length != 0">
             <el-pagination small background layout="prev, pager, next" :total="1000">
             </el-pagination>
         </div>
@@ -245,6 +304,7 @@
         </div>
 
         <detail-reply :two-comment-data="twoCommentData" :pop-state="popState"></detail-reply>
+
         <coins :coin-config="coinConfig" :pop-state="popState"></coins>
     </div>
 </template>
@@ -375,6 +435,14 @@ export default {
                 key: "message"
             }],
 
+            postList: { // 回复列表数据
+                list: [],
+                page: 1,
+                limit: 20,
+                count: 0,
+            },
+
+
         };
     },
 
@@ -384,7 +452,6 @@ export default {
     },
 
     methods: {
-
         // 获取详细信息
         getDetail() {
             this.$http.post("/api/thread", {
@@ -524,13 +591,24 @@ export default {
 
         // 获取回复列表
         getPostList() {
+            let { page, limit } = this.postList
             this.$http.post("/api/thread/postList", {
                 token: this.token,
-                page: 1,
+                page,
-                limit: 20
+                limit,
             }).then(res => {
-                console.log(res);
+                if (res.code != 200) return
+                let data = res.data
+                console.log(data);
+
+                this.postList.list = data.list
+                this.postList.page = data.page
+                this.postList.limit = data.limit
+                this.postList.count = data.count
             })
+
+
+
         },
 
 
@@ -866,6 +944,7 @@ export default {
                 .vHtmlMessage {
                     font-size: .36rem;
                     line-height: .6rem;
+                    word-break: break-word;
 
                     /deep/ strong {
                         font-weight: bold;