no message

pages/details/[id].vue

@@ -9,9 +9,11 @@
     <div class="content flexflex">
         <div class="left">
             <div class="school-box flexcenter">
-                <img class="school-icon" :src="info['school']?.['image']" />
+                <a :href="info['school']?.['url']" target="_blank">
+                    <img class="school-icon" :src="info['school']?.['image']" />
+                </a>
                 <a class="school-name" :href="info['school']?.['url']" target="_blank">{{ info["school"]?.["name"] }}</a>
-                <div class="school-en-name">{{ info["school"]?.["enname"] }}</div>
+                <a class="school-en-name" :href="info['school']?.['url']" target="_blank">{{ info["school"]?.["enname"] }}</a>
             </div>
 
             <div class="mj-total flexacenter">
@@ -20,7 +22,7 @@
                 个面经
             </div>
             <div class="mj-list">
-                <div class="mj-item flexflex" :class="{pitch: index == 0}" v-for="(item, index) in relatedlist" :key="index">
+                <div class="mj-item flexflex" :class="{pitch: pitchIndex == index}" v-for="(item, index) in relatedlist" :key="index" @click="handleItem(item['uniqid'])">
                     <img class="item-bj" src="@/assets/img/item-bj.svg" />
                     <div class="mj-header flexacenter">
                         <img class="mj-avatar" :src="item['avatar']" />
@@ -49,9 +51,15 @@
             <div class="header">
                 <div class="title">{{ info["subject"] }}</div>
                 <div class="mj-header flexacenter">
-                    <img class="mj-avatar" :src="info['avatar']" />
-                    <div class="user-name">{{ info["nickname"] }}</div>
-                    <div class="time">{{ info["releasetime"] }}发布</div>
+                    <div class="mj-header-left flexacenter">
+                        <img class="mj-avatar" :src="info['avatar']" />
+                        <div class="user-name">{{ info["nickname"] }}</div>
+                        <div class="time">{{ info["releasetime"] }}发布</div>
+                    </div>
+                    <div class="mj-header-right flexacenter">
+                        <img class="eye-icon" src="@/assets/img/eye-icon.svg" />
+                        96
+                    </div>
                 </div>
             </div>
             <div class="details-box" v-if="true">
@@ -60,7 +68,7 @@
                     <div class="details-list">
                         <div class="details-list-item flexacenter" v-if="info['school']">
                             <div class="details-name">学校</div>
-                            <div class="details-value">{{ info["school"]?.name }}</div>
+                            <a class="details-value" target="_blank" :href="info['school']?.['url']">{{ info["school"]?.name }}</a>
                         </div>
                         <div class="details-list-item flexacenter" v-if="info['profession']">
                             <div class="details-name">专业</div>
@@ -203,10 +211,10 @@
                         {{ info["likenum"] || "" }}
                     </div>
                     <div class="item flexacenter"><img class="icon" src="@/assets/img/comment-icon.png" />9</div>
-                    <div class="item flexacenter">
+                    <div class="item flexacenter" @click="handleCollect()">
                         <img class="icon" v-if="iscollection == 1" src="@/assets/img/collect-icon-colours.svg" />
                         <img class="icon" v-else src="@/assets/img/collect-icon.png" />
-                        {{ info["likenum"] || "" }}
+                        {{ info["favnum"] || "收藏" }}
                     </div>
 
                     <el-popover placement="bottom" width="628px" trigger="click" popper-style="padding: 0;border-radius: 10px;" v-model:visible="transmitBoxState">
@@ -257,11 +265,12 @@
 
 <script setup>
 const route = useRoute()
-const uniqid = route.params.id
+let uniqid = route.params.id
 
 onMounted(() => {
-    // getCommentListHttp()
     window.addEventListener("scroll", handleScroll)
+
+    getDetails()
 })
 
 let floorRightState = ref(false) // 右下角 的二维码显示状态
@@ -280,43 +289,74 @@ let isdisplay = ref(true) // 是否隐藏
 let islike = ref(0) // 是否点赞
 let ismyself = ref(0) // 是否是作者
 
-detailsHttp({uniqid}).then(res => {
-    if (res.code != 200) return
-    let data = res.data
-    token = data["token"]
-    info.value = data["info"]
-    seo.value = data.seo
-    iscollection.value = data.iscollection
-    isdisplay.value = data.isdisplay
-    islike.value = data.islike
-    ismyself.value = data.ismyself
-    qrcode.value = data["share"]["qrcode"]
-    // console.log(data, "data")
+const getDetails = () => {
+    detailsHttp({uniqid}).then(res => {
+        if (res.code != 200) return
+        let data = res.data
+        token = data["token"]
+        info.value = data["info"]
+        seo.value = data.seo
+        iscollection.value = data.iscollection
+        isdisplay.value = data.isdisplay
+        islike.value = data.islike
+        ismyself.value = data.ismyself
+        qrcode.value = data["share"]["qrcode"]
 
-    getRelatedlistHttp()
-})
+        getCommentListHttp()
+
+        if (relatedlist.value.length == 0) getRelatedlistHttp()
+        else CalculateSelectedList()
+    })
+}
+
+// 计算选中的列表
+const CalculateSelectedList = () => {
+    let targetRelatedlist = [...relatedlist.value]
+    targetRelatedlist.forEach((element, index) => {
+        if (element["uniqid"] == uniqid) pitchIndex.value = index
+    })
+
+    if (pitchIndex.value == null) {
+        targetRelatedlist.unshift({
+            avatar: info.value["avatar"],
+            interviewtime: timestampToDate(info.value["interviewtime"]),
+            profession: info.value["profession"],
+            project: info.value["project"],
+            releasetime: info.value["releasetime"],
+            subject: info.value["subject"],
+            uniqid: uniqid,
+            username: info.value["nickname"],
+        })
+        relatedlist.value = targetRelatedlist
+        pitchIndex.value = 0
+    }
+}
 
 // 左侧列表数据
 let relatedlist = ref([])
 let relatedcount = ref(0)
 
+let pitchIndex = ref(null) // 列表选中 index
+
 const getRelatedlistHttp = () => {
     relatedlistHttp({token, page: 1}).then(res => {
-        console.log("res", res)
         if (res.code != 200) return
 
         let data = res.data
 
         relatedlist.value = data.data
         relatedcount.value = data.count
+
+        CalculateSelectedList()
     })
 }
+
 let seo = ref({})
 let commentCount = ref(0)
 let commentPage = ref(1)
 let commentList = ref([])
 let commentLoading = false
-let token = "ENp0HXsDIoZMh8Kolj-duWLzl5TVRbtriSIcPsDdUg9SFa3o7spbA0CuopdETZcEJf3u25p5zHyR-St5rTxX9i3jz9mWT4qrwa42Yzhi"
+let token = ""
 // 获取详情评论数据
 const getCommentListHttp = () => {
     console.log(commentPage.value, "commentPage.value")
@@ -333,7 +373,6 @@ const getCommentListHttp = () => {
             if (res.code != 200) return
 
             let data = res.data
-            console.log(data, "data")
             commentCount.value = data["count"]
             commentList.value = commentList.value.concat(data["data"])
 
@@ -562,6 +601,24 @@ const handleLike = () => {
         })
     })
 }
+
+// 点击 收藏
+const handleCollect = () => {
+    operateCollectHttp({token}).then(res => {
+        console.log("res", res)
+        if (res.code != 200) return
+        let data = res.data
+
+        info.value["favnum"] = data["count"]
+        iscollection.value = data["status"]
+    })
+}
+
+// 处理点击列表
+const handleItem = uni => {
+    uniqid = uni
+    getDetails()
+}
 </script>
 
 <style lang="less" scoped>
@@ -612,7 +669,7 @@ const handleLike = () => {
         }
 
         .mj-list {
-            padding: 0 30px 15px;
+            padding: 0 25px 15px 30px;
 
             .mj-item {
                 flex-direction: column;
@@ -662,6 +719,8 @@ const handleLike = () => {
                     font-size: 12px;
                     margin-bottom: 12px;
 
+                    // justify-content: space-between;
+
                     .mj-avatar {
                         width: 24px;
                         height: 24px;
@@ -716,6 +775,7 @@ const handleLike = () => {
             .mj-header {
                 line-height: 22px;
                 font-size: 13px;
+                justify-content: space-between;
                 .mj-avatar {
                     width: 24px;
                     height: 24px;
@@ -729,6 +789,16 @@ const handleLike = () => {
                 .time {
                     color: #aaaaaa;
                 }
+
+                .mj-header-right {
+                    .eye-icon {
+                        width: 13px;
+                        height: 8px;
+                        margin-right: 5px;
+                    }
+                    font-size: 12px;
+                    color: #aaaaaa;
+                }
             }
         }
 
@@ -1116,6 +1186,7 @@ const handleLike = () => {
         left: 0;
         bottom: 0;
         width: 100vw;
+        min-width: 1200px;
         height: 70px;
         z-index: 1;
         background-color: rgba(255, 255, 255, 1);

pages/index.html/index.vue

@@ -15,7 +15,6 @@
     </div>
     <div class="in-end" v-if="page == 0 && list.length > 0">- 到底了 -</div>
 
-    <MyPopup v-if="false"></MyPopup>
 </template>
 
 <script setup>