no message

app.vue

@@ -9,7 +9,7 @@
     </div>
 </template>
 
-<style>
+<style lang="less">
 * {
     margin: 0;
     padding: 0;
@@ -87,4 +87,55 @@ a {
 *::-moz-scrollbar-thumb:hover {
     background-color: #666;
 }
+
+header.page-header .box .tab-list .item.pitch {
+    color: #72db86 !important;
+}
+
+header.page-header .box .tab-list .item.pitch:after {
+    background-color: #72db86 !important;
+}
+
+.avatar-box {
+    flex-direction: column;
+    height: 101px;
+    background-color: rgba(244, 248, 255, 1);
+    border: 1px solid rgba(220, 224, 234, 1);
+    border-radius: 10px;
+    z-index: 100;
+
+    .avatar-mask {
+        width: 100%;
+        height: 100%;
+        position: fixed;
+        top: 0;
+        left: 0;
+        z-index: -1;
+        cursor: auto;
+    }
+
+    .avatar-item {
+        font-size: 14px;
+        color: #333;
+        height: 50px;
+        cursor: pointer;
+
+        &:not(:last-of-type) {
+            border-bottom: 1px dotted #d7d7d7;
+        }
+    }
+
+    .avatar-icon {
+        width: 16px;
+        height: 16px;
+        margin-right: 5px;
+    }
+}
+
+.el-popover.el-popper.avatar-box-popper {
+    min-width: 140px;
+    padding: 0;
+    border-radius: 10px;
+    border: none;
+}
 </style>

components/Header.vue

@@ -29,14 +29,16 @@
 </template>
 
 <script setup>
+import { useRoute } from "vue-router"
+
 const router = useRouter()
 const route = useRoute()
+
 let keyword = ref("")
 
 onMounted(() => {
     getHistoricalSearchList()
-
+    keyword.value = route.query["keyword"]
-    // getUser()
 })
 
 let count = ref({})
@@ -112,7 +114,6 @@ const handleClickClear = () => {
 let historicalSearchState = ref(false) // 历史记录弹窗状态
 let historicalSearchList = ref([]) // 历史记录数据
 
-
 let MyPopupRef = ref(null)
 // 点击我的获取消息
 const handleUser = key => {

components/Item.vue

@@ -26,6 +26,10 @@
                 </div>
             </div>
             <div class="data-list flexacenter">
+                <div class="data-item flexacenter">
+                    <img class="data-item-icon" src="@/assets/img/eye-icon.svg" />
+                    {{ item["views"] || 0 }}
+                </div>
                 <div class="data-item flexacenter" @click.prevent="handleLike(item['uniqid'], item['token'])">
                     <img class="data-item-icon" v-if="item['islike'] == 0" src="@/assets/img/like-no.svg" />
                     <img class="data-item-icon" v-else src="@/assets/img/like-yes.png" />
@@ -165,7 +169,7 @@ const handleLike = (uniqid, token) => {
             color: #aaaaaa;
             font-size: 12px;
             .data-item {
-                margin-left: 15px;
+                margin-left: 26px;
                 .data-item-icon {
                     width: 13px;
                     margin-right: 5px;

components/MyPopup.vue

@@ -6,7 +6,7 @@
             <div class="tba-list flexcenter">
                 <div class="tab-item flexcenter" :class="{ pitch: MyPopupState == 'collect' }" @click="cutMy('collect')">
                     我的收藏
-                    <div class="value">{{ count["collect"] }}</div>
+                    <div class="value">{{ collectCount || count["collect"] }}</div>
                 </div>
 
                 <div class="tab-item flexcenter" :class="{ pitch: MyPopupState == 'mj' }" @click="cutMy('mj')">
@@ -18,35 +18,35 @@
                 <Empty></Empty>
             </div>
             <div class="content" v-else @scroll="handleListScroll">
-                <div class="item flexflex" v-for="(item, index) in showList" :key="index" @click="goDetails(item['uniqid'])">
+                <div class="item flexflex" v-for="(item, index) in showList" :key="index" @click="goDetails(item['uniqid'] || item?.data?.uniqid)">
                     <div class="left flexflex">
-                        <div class="name">{{ item["school"] }}</div>
+                        <div class="name">{{ item["school"] || item["data"]["school"] }}</div>
                         <div class="info-box flexflex">
-                            <div class="info-item flexacenter" v-if="item['profession']">
+                            <div class="info-item flexacenter" v-if="item['profession'] || item?.['data']?.['profession']">
                                 <div class="info-item-name">专业</div>
-                                <div class="info-item-value">{{ item["profession"] }}</div>
+                                <div class="info-item-value">{{ item["profession"] || item["data"]["profession"] }}</div>
                             </div>
-                            <div class="info-item flexacenter" v-if="item['project']">
+                            <div class="info-item flexacenter" v-if="item['project'] || item?.data?.project">
                                 <div class="info-item-name">项目</div>
-                                <div class="info-item-value">{{ item["project"] }}</div>
+                                <div class="info-item-value">{{ item["project"] || item?.data?.project }}</div>
                             </div>
                         </div>
                         <div class="text-box flexacenter">
-                            <div class="text-time">1小时前发布</div>
+                            <div class="text-time" v-if="item?.releasetime">{{ handleDate(item?.releasetime) }}发布</div>
-                            <div class="text-message flex1 ellipsis">{{ item["message"] }}</div>
+                            <div class="text-message flex1 ellipsis">{{ item["message"] || item["data"]["message"] }}</div>
                         </div>
                     </div>
                     <div class="operate-area flexacenter">
-                        <img class="delete-icon" v-if="MyPopupState == 'collect'" src="@/assets/img/delete-icon.svg" />
+                        <img class="delete-icon" v-if="MyPopupState == 'collect'" @click.stop="cancelCollection(item['token'], index)" src="@/assets/img/delete-icon.svg" />
-                        <div class="anonymous-box flexacenter" v-else @click="openAnonymousState(index)">
+                        <div class="anonymous-box flexacenter" v-else @click.stop="openAnonymousState(index)">
                             <div class="text">{{ item["anonymous"] == 1 ? "匿名" : "公开" }}</div>
                             <img class="arrow-icon" src="@/assets/img/arrow-gray.svg" />
                             <div class="state-popup flexflex" v-if="item['anonymousState']" @click.stop="">
-                                <div class="state-popup-item flexacenter flex1" :class="{ 'pitch': item['anonymous'] == 0 }" @click="handleAnonymousState(item['token'], index)">
+                                <div class="state-popup-item flexacenter flex1" :class="{ 'pitch': item['anonymous'] == 0 }" @click="handleAnonymousState(item['token'], index, 0)">
                                     <div class>公开发表</div>
                                     <img class="state-popup-icon" src="@/assets/img/tick-green.svg" />
                                 </div>
-                                <div class="state-popup-item flexacenter flex1" :class="{ 'pitch': item['anonymous'] == 1 }" @click="handleAnonymousState(item['token'], index)">
+                                <div class="state-popup-item flexacenter flex1" :class="{ 'pitch': item['anonymous'] == 1 }" @click="handleAnonymousState(item['token'], index, 1)">
                                     <div class>匿名发表</div>
                                     <img class="state-popup-icon" src="@/assets/img/tick-green.svg" />
                                 </div>
@@ -79,13 +79,26 @@ onMounted(() => {
 let showList = ref([])
 
 let collectList = []
+let collectPage = 1
+let collectLoading = false
+let collectCount = ref(0)
+
 const getCollect = () => {
-    MyUserCollectHttp({}).then(res => {
+    if (collectPage == 0 || collectLoading) return
-        if (res.code != 200) return
+    collectLoading = true
-        let data = res.data
+    MyUserCollectHttp({ page: collectPage })
-        collectList = collectList.concat(data.data)
+        .then(res => {
-        showList.value = collectList
+            if (res.code != 200) return
-    })
+            let data = res.data
+            collectList = collectList.concat(data.data)
+            showList.value = collectList
+
+            if (collectList.length < data["count"]) collectPage++
+            else collectPage = 0
+
+            collectCount.value = data["count"]
+        })
+        .finally(() => (collectLoading = false))
 }
 
 let publishList = []
@@ -130,9 +143,28 @@ const openAnonymousState = index => {
     showList.value = [...publishList]
 }
 
+// 关闭全部匿名弹窗
+const closeAllAnonymousState = () => {
+    publishList.forEach(element => {
+        element["anonymousState"] = false
+    })
+    showList.value = [...publishList]
+}
 // 修改匿名状态
-const handleAnonymousState = (token, index) => {
+const handleAnonymousState = (token, index, anonymous) => {
     console.log("token", token, index)
+    changeAnonymousHttp({ token, anonymous }).then(res => {
+        console.log("res", res)
+        if (res.code != 200) return
+
+        publishList[index]["anonymous"] = anonymous
+        showList.value = [...publishList]
+        closeAllAnonymousState()
+        ElMessage({
+            message: res.message,
+            type: "success",
+        })
+    })
 }
 
 // 详情页滚动事件
@@ -155,6 +187,23 @@ defineExpose({
 })
 
 // const emit = defineEmits(["cutMy"]);
+
+// 处理取消收藏
+const cancelCollection = (token, index) => {
+    MyUserDeleteCollectHttp({ token }).then(res => {
+        console.log("res", res)
+        if (res.code != 200) {
+            ElMessage.error(res.message)
+            return
+        }
+
+        collectList.splice(index, 1)
+        collectCount.value--
+
+        console.log(collectList, "collectList")
+        showList.value = [...collectList]
+    })
+}
 </script>
 <style lang="less" scoped>
 .popup-mask {

components/Report.vue

@@ -0,0 +1,245 @@
+<template>
+    <!-- 举报 -->
+    <div class="alert-form">
+        <div class="comments reports">
+            <div class="head">
+                <span style="display: flex; align-items: center;"> <img style="width: 25px; margin-right: 7px;" src="//app.gter.net/image/gter/offer/img/exclamationpoint.png" />举报投诉 </span>
+                <div class="close icon-close iconfont" @click="alertShow = false"></div>
+            </div>
+            <div class="form">
+                <div class="radio-area flexacenter">
+                    <div class="radio-area-item flexacenter" :class="{ pitch: checkList.includes(s) }" v-for="(s, i) in reasonList" :key="i" @click="selectRadio(s)">
+                        <div class="radio-area-frame"></div>
+                        {{ s }}
+                    </div>
+                </div>
+                <div class="text-box">
+                    <textarea placeholder="请输入举报原因" v-model="alertText" maxlength="200"></textarea>
+                    <div class="text-num">{{ 200 - alertText.length }}</div>
+                </div>
+                <div class="footer">
+                    <button type="button" @click="cancel()">取消</button>
+                    <button type="submit" :disabled="checkList.length == 0" @click="alertSubmit">提交</button>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+<script setup>
+import { ElMessage } from "element-plus"
+
+const props = defineProps(["reportToken"])
+const reasonList = ["广告", "辱骂", "重复发送", "不良信息", "其他"]
+let reportAlertShow = inject("reportAlertShow")
+
+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)
+    reportAlertShow.value = false
+    commentReportHttp({
+        message: checkList.value,
+        token: props.reportToken,
+    }).then(res => {
+        checkList.value = []
+        reportAlertShow.value = false
+        ElMessage({
+            message: res.message || "举报成功",
+            type: "success",
+        })
+    })
+}
+
+// 取消
+const cancel = () => (reportAlertShow.value = false)
+</script>
+
+<style lang="less" scoped>
+.alert-form {
+    display: block;
+    position: fixed;
+    z-index: 2100;
+    left: 0;
+    top: 0;
+    width: 100vw;
+    height: 100vh;
+    background-color: rgba(0, 0, 0, 0.7);
+    .reports {
+        height: 440px;
+        .radio-area {
+            margin-bottom: 40px;
+
+            .radio-area-item {
+                color: #606266;
+                font-size: 14px;
+                margin-right: 10px;
+                cursor: pointer;
+
+                &.pitch {
+                    .radio-area-frame {
+                        background-color: #50e3c2;
+                        border-color: #50e3c2;
+
+                        &::after {
+                            -webkit-transform: rotate(45deg) scaleY(1);
+                            transform: rotate(45deg) scaleY(1);
+                        }
+                    }
+                }
+
+                .radio-area-frame {
+                    border: 1px solid #dcdfe6;
+                    border-radius: 2px;
+                    width: 14px;
+                    height: 14px;
+                    -webkit-transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46), background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
+                    transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46), background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
+
+                    position: relative;
+                    margin-right: 10px;
+
+                    &::after {
+                        -webkit-box-sizing: content-box;
+                        box-sizing: content-box;
+                        content: "";
+                        border: 1px solid #fff;
+                        border-left: 0;
+                        border-top: 0;
+                        height: 7px;
+                        left: 4px;
+                        position: absolute;
+                        top: 1px;
+                        -webkit-transform: rotate(45deg) scaleY(0);
+                        transform: rotate(45deg) scaleY(0);
+                        width: 3px;
+                        -webkit-transition: -webkit-transform 0.15s ease-in 0.05s;
+                        transition: -webkit-transform 0.15s ease-in 0.05s;
+                        transition: transform 0.15s ease-in 0.05s;
+                        transition: transform 0.15s ease-in 0.05s, -webkit-transform 0.15s ease-in 0.05s;
+                        -webkit-transform-origin: center;
+                        transform-origin: center;
+                    }
+
+                    // }
+                }
+            }
+        }
+    }
+
+    .el-checkbox-group {
+        font-size: 0;
+    }
+
+    .comments {
+        display: block;
+        position: fixed;
+        z-index: 11;
+        left: 50%;
+        top: 50%;
+        width: 740px;
+        height: 440px;
+        max-width: 90vw;
+        max-height: 90vh;
+        transform: translate(-50%, -50%);
+        background-color: #ffffff;
+        border: none;
+        border-radius: 8px 8px 6px 6px;
+        .text-box {
+            position: relative;
+        }
+        .text-num {
+            position: absolute;
+            right: 10px;
+            bottom: 10px;
+            color: #999;
+            font-size: 12px;
+        }
+        .form {
+            display: block;
+            width: 100%;
+            padding: 34px 30px 40px;
+            textarea {
+                height: 172px;
+                margin-bottom: 30px;
+                display: block;
+                width: 100%;
+                background: #f7f7f7;
+                padding: 18px;
+                font-size: 14px;
+                border: 1px solid #f7f7f7;
+                border-radius: 5px;
+                outline: none;
+                resize: none;
+                line-height: 22px;
+            }
+        }
+    }
+
+    .head {
+        padding: 0 18px 0 30px;
+        display: flex;
+        height: 56px;
+        align-items: center;
+        justify-content: space-between;
+        background: #333333;
+        color: #fff;
+        font-size: 17px;
+        border-radius: 6px 6px 0 0;
+        .close {
+            color: #b3b3b3;
+            font-size: 14px;
+            cursor: pointer;
+        }
+    }
+
+    .footer {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        button[type="button"] {
+            margin-right: 20px;
+        }
+
+        button {
+            border: 1px #999999 solid;
+            border-radius: 5px;
+            background-color: #ffffff;
+            width: 128px;
+            height: 38px;
+            color: #333;
+            font-size: 14px;
+            outline: none;
+            cursor: pointer;
+        }
+        button[type="submit"] {
+            background-color: #50e3c2;
+            border-color: #50e3c2;
+            color: #fff;
+        }
+    }
+}
+
+.alert-form .el-checkbox__input.is-checked .el-checkbox__inner,
+.alert-form .el-checkbox__input.is-indeterminate .el-checkbox__inner {
+    background-color: #50e3c2;
+    border-color: #50e3c2;
+}
+
+.alert-form .el-checkbox__input.is-focus .el-checkbox__inner,
+.alert-form .el-checkbox__inner:hover {
+    border-color: #50e3c2;
+}
+
+.alert-form .el-checkbox__input.is-checked + .el-checkbox__label {
+    color: #50e3c2;
+}
+</style>

composables/api.js

@@ -37,14 +37,34 @@ export const detailsSubmitommentListHttp = query => {
     return Http.post("/api/comment/submit", query)
 }
 
+// 评论相关 - 评论点赞
+export const detailsLikeCommentHttp = query => {
+    return Http.post("/api/comment/like", query)
+}
+
 // 发布相关 - 发布问题初始化,编辑
 export const publishInitHttp = query => {
     return Http.post("/api/publish", query)
 }
 
-// 发布相关 - 发布问题初始化,编辑
+// 发布相关 - 发布问题搜索学校
 export const publishSchoolSearchHttp = query => {
-    return Http.post("https://offer.gter.net/miniprogram/InterviewExperience/schoolSearch", query)
+    return Http.post("/api/publish/schoolSearch", query)
+}
+
+// 发布相关 - 发布问题搜索专业
+export const publishProfessionSearchHttp = query => {
+    return Http.post("/api/publish/professionSearch", query)
+}
+
+// 发布相关 - 提交
+export const publishSubmitHttp = query => {
+    return Http.post("/api/publish/submit", query)
+}
+
+// 发布相关 - 更改匿名状态
+export const changeAnonymousHttp = query => {
+    return Http.post("/api/publish/changeAnonymous", query)
 }
 
 // 我的 - 用户信息
@@ -57,7 +77,18 @@ export const MyUserPublishHttp = query => {
     return Http.post("/api/user/publish", query)
 }
 
+// 我的 - 删除收藏
+export const MyUserDeleteCollectHttp = query => {
+    return Http.post("/api/user/deleteCollect", query)
+}
+
 // 数据操作 - 收藏
 export const MyUserCollectHttp = query => {
     return Http.post("/api/user/collect", query)
 }
+
+// 评论相关 - 举报 Comment related
+export const commentReportHttp = query => {
+    return Http.post("/api/operate/report", query)
+}
+

composables/utils.js

@@ -19,9 +19,9 @@ export const handleDate = (dateTimeStamp = new Date()) => {
         let Y = date.getFullYear() + "-"
         let M = (date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1) + "-"
         let D = (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) + " "
-        let h = (date.getHours() < 10 ? "0" + date.getHours() : date.getHours()) + ":"
+        // let h = (date.getHours() < 10 ? "0" + date.getHours() : date.getHours()) + ":"
-        let m = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes()
+        // let m = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes()
-        result = "" + Y + M + D + h + m
+        result = "" + Y + M + D
     } else if (dayC >= 1) result = "" + Math.round(dayC) + "天前"
     else if (hourC >= 1) result = "" + Math.round(hourC) + "小时前"
     else if (minC >= 1) result = "" + Math.round(minC) + "分钟前"

nuxt.config.ts

@@ -1,5 +1,5 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
     devtools: {enabled: true},
-    modules: ["@element-plus/nuxt"]
+    modules: ["@element-plus/nuxt"],
 })

package.json

@@ -4,7 +4,7 @@
   "type": "module",
   "scripts": {
     "build": "nuxt build",
-    "dev": "nuxt dev --port 3002",
+    "dev": "nuxt dev --host",
     "generate": "nuxt generate",
     "preview": "nuxt preview",
     "postinstall": "nuxt prepare"
@@ -22,5 +22,11 @@
     "axios": "^1.6.2",
     "masonry-layout": "^4.2.2",
     "qs": "^6.11.2"
+  },
+  "config": {
+    "nuxt": {
+      "host": "0.0.0.0",
+      "port": "3000"
+    }
   }
 }

pages/details/[id].vue

@@ -24,7 +24,7 @@
                     <img class="item-bj" src="@/assets/img/item-bj.svg" />
                     <div class="mj-header flexacenter">
                         <img class="mj-avatar" :src="item['avatar']" />
-                        <div class="user-name">{{ item["username"] }}</div>
+                        <div class="user-name">{{ item["username"] || "匿名用户" }}</div>
                         <div class="time">{{ handleDate(item["releasetime"]) }}发布</div>
                     </div>
 
@@ -45,22 +45,40 @@
                 </a>
             </div>
         </div>
-        <div class="right flex1">
+        <div class="right flex1" @scroll="handleCommentsScroll" v-loading="detailsLoading">
+            <!-- <div class="right-loading"></div> -->
             <div class="header">
                 <div class="title">{{ info["subject"] }}</div>
                 <div class="mj-header flexacenter">
                     <div class="mj-header-left flexacenter">
-                        <img class="mj-avatar" :src="info['avatar']" />
+                        <el-popover placement="bottom-start" :width="140" trigger="click" popper-class="avatar-box-popper" :show-arrow="false">
-                        <div class="user-name">{{ info["nickname"] }}</div>
+                            <template #reference>
-                        <div class="time">{{ info["releasetime"] }}发布</div>
+                                <img class="mj-avatar" :src="info['avatar']" />
+                            </template>
+
+                            <div class="avatar-box flexflex" v-if="info['uin']">
+                                <!-- <div class="avatar-box flexflex"> -->
+                                <a class="avatar-item flexcenter" target="_blank" @click.prevent="sendMessage(info['uin'])">
+                                    <img class="avatar-icon" src="@/assets/img/send-messages-icon.png" />
+                                    发送信息
+                                </a>
+                                <a class="avatar-item flexcenter" target="_blank" @click.prevent="TAHomePage(info['uin'])">
+                                    <img class="avatar-icon" src="@/assets/img/homepage-icon.png" />
+                                    TA的主页
+                                </a>
+                            </div>
+                        </el-popover>
+
+                        <div class="user-name">{{ info["nickname"] || "匿名用户" }}</div>
+                        <div class="time">{{ handleDate(info["releasetime"]) }}发布</div>
                     </div>
-                    <div class="mj-header-right flexacenter">
+                    <div class="mj-header-right flexacenter" v-if="isBrowser">
                         <img class="eye-icon" src="@/assets/img/eye-icon.svg" />
                         {{ info["views"] }}
                     </div>
                 </div>
             </div>
-            <div class="details-box" v-if="true">
+            <div class="details-box">
                 <div class="details-item">
                     <div class="details-top">申请信息</div>
                     <div class="details-list">
@@ -92,11 +110,12 @@
                     <div class="details-list">
                         <div class="details-list-item flexacenter">
                             <div class="details-value describe" :class="{ 'unlock-unlock': !isdisplay }" v-if="info['message']">
-                                {{ info["message"] }}
+                                <!-- {{ info["message"] }} -->
-                                <div class="unlock-mask flexflex">
+                                <div v-html="info['message']"></div>
+                                <div class="unlock-mask flexflex" style="width: 693px;">
                                     <div class="">作者设置了浏览限制</div>
                                     <div class="flexacenter">
-                                        <div class="emphasis">“回复”</div>
+                                        <div class="emphasis">“回复/点赞”</div>
                                         后即可查看完整内容
                                     </div>
                                 </div>
@@ -110,7 +129,7 @@
             <div class="comment-box">
                 <div class="comment-title flexacenter">
                     讨论
-                    <div class="value">{{ commentCount || "" }}</div>
+                    <div class="value">{{ commentComments || "" }}</div>
                 </div>
                 <div class="post-comment flexacenter">
                     <textarea class="post-input flex1" placeholder="说说你的想法或疑问…" v-model="commentInputTop"></textarea>
@@ -124,8 +143,23 @@
                 </template>
                 <template v-else>
                     <div class="comment-list">
-                        <div class="comment-item flexflex" v-for="(item, index) in commentList" :key="index">
+                        <div class="comment-item flexflex" v-for="(item, index) in commentList" :key="item.id">
-                            <img class="comment-avatar" :src="item['avatar']" />
+                            <el-popover placement="bottom-start" :width="140" trigger="click" popper-class="avatar-box-popper" :show-arrow="false">
+                                <template #reference>
+                                    <img class="comment-avatar" :src="item['avatar']" />
+                                </template>
+
+                                <div class="avatar-box flexflex" v-if="item['uin']">
+                                    <a class="avatar-item flexcenter" target="_blank" @click.prevent="sendMessage(item['uin'])">
+                                        <img class="avatar-icon" src="@/assets/img/send-messages-icon.png" />
+                                        发送信息
+                                    </a>
+                                    <a class="avatar-item flexcenter" target="_blank" @click.prevent="TAHomePage(item['uin'])">
+                                        <img class="avatar-icon" src="@/assets/img/homepage-icon.png" />
+                                        TA的主页
+                                    </a>
+                                </div>
+                            </el-popover>
                             <div class="comment-content flex1">
                                 <div class="comment-header flexacenter">
                                     <div class="comment-header-left flexacenter">
@@ -136,10 +170,10 @@
                                     <div class="comment-header-right flexacenter">
                                         <div class="menu-box flexacenter">
                                             <img class="menu-icon" src="@/assets/img/menu-icon-gray.svg" />
-                                            <div class="report-box flexcenter">举报</div>
+                                            <div class="report-box flexcenter" @click="report(item['token'])">举报</div>
                                         </div>
                                         <img class="comment-icon" @click="openAnswerCommentsChild(index)" src="@/assets/img/comment-icon-gray.svg" />
-                                        <div class="flexacenter like-box">
+                                        <div class="flexacenter like-box" @click="commentLike(index)">
                                             <img class="like-icon" v-if="item['islike'] == 1" src="@/assets/img/like-icon-colours.png" />
                                             <img class="like-icon" v-else src="@/assets/img/like-icon-gray.png" />
                                             <div class="like-quantity">{{ item["likenum"] || 0 }}</div>
@@ -157,31 +191,47 @@
                                 </div>
                                 <!-- 子评论 -->
                                 <div class="child-comments" v-if="item['child'].length > 0">
-                                    <div class="comment-item flexflex" v-for="(ite, i) in item['child']" :key="i">
+                                    <div class="comment-item flexflex" v-for="(ite, i) in item['child']" :key="ite.id">
-                                        <img class="comment-avatar" :src="item['avatar']" />
+                                        <!-- <img class="comment-avatar" :src="ite['avatar']" /> -->
+                                        <el-popover placement="bottom-start" :width="140" trigger="click" popper-class="avatar-box-popper" :show-arrow="false">
+                                            <template #reference>
+                                                <img class="comment-avatar" :src="ite['avatar']" />
+                                            </template>
+
+                                            <div class="avatar-box flexflex" v-if="item['uin']">
+                                                <a class="av atar-item flexcenter" target="_blank" @click.prevent="sendMessage(ite['uin'])">
+                                                    <img class="avatar-icon" src="@/assets/img/send-messages-icon.png" />
+                                                    发送信息
+                                                </a>
+                                                <a class="avatar-item flexcenter" target="_blank" @click.prevent="TAHomePage(ite['uin'])">
+                                                    <img class="avatar-icon" src="@/assets/img/homepage-icon.png" />
+                                                    TA的主页
+                                                </a>
+                                            </div>
+                                        </el-popover>
                                         <div class="comment-content flex1">
                                             <div class="comment-header flexacenter">
                                                 <div class="comment-header-left flexacenter">
-                                                    <div class="comments-username">{{ item["nickname"] }}</div>
+                                                    <div class="comments-username">{{ ite["nickname"] }}</div>
-                                                    <div class="comments-time">{{ handleDate(item["timestamp"]) }}</div>
+                                                    <div class="comments-time">{{ handleDate(ite["timestamp"]) }}</div>
-                                                    <div class="comments-identity" v-if="item['isauthor']">作者</div>
+                                                    <div class="comments-identity" v-if="ite['isauthor']">作者</div>
                                                 </div>
                                                 <div class="comment-header-right flexacenter">
                                                     <div class="menu-box flexacenter">
                                                         <img class="menu-icon" src="@/assets/img/menu-icon-gray.svg" />
-                                                        <div class="report-box flexcenter">举报</div>
+                                                        <div class="report-box flexcenter" @click="report(ite['token'])">举报</div>
                                                     </div>
                                                     <img class="comment-icon" @click="openAnswerCommentsChild(index, i)" src="@/assets/img/comment-icon-gray.svg" />
-                                                    <div class="flexacenter like-box">
+                                                    <div class="flexacenter like-box" @click="commentLike(index, i)">
-                                                        <img class="like-icon" v-if="item['islike']" src="@/assets/img/like-icon-gray.png" />
+                                                        <img class="like-icon" v-if="ite['islike'] == 1" src="@/assets/img/like-icon-colours.png" />
-                                                        <img class="like-icon" v-else src="@/assets/img/like-icon-colours.png" />
+                                                        <img class="like-icon" v-else src="@/assets/img/like-icon-gray.png" />
-                                                        <div class="like-quantity">{{ item["likenum"] || 0 }}</div>
+                                                        <div class="like-quantity">{{ ite["likenum"] || 0 }}</div>
                                                     </div>
                                                 </div>
                                             </div>
                                             <div class="comment-text">
-                                                <div class="comments-reply" v-if="JSON.stringify(ite['reply']) != '[]'">@{{ ite["reply"]["nickname"] }}</div>
+                                                <div class="comments-reply" v-if="ite?.reply?.nickname">@{{ ite?.reply?.nickname }}</div>
-                                                {{ item["content"] }}
+                                                {{ ite["content"] }}
                                             </div>
                                             <div class="comments-input-box flexacenter" v-if="ite['childState']">
                                                 <div class="comments-input flexflex">
@@ -214,7 +264,8 @@
                         <img class="icon" v-else src="@/assets/img/like-icon.png" />
                         {{ info["likenum"] || "" }}
                     </div>
-                    <div class="item flexacenter"><img class="icon" src="@/assets/img/comment-icon.png" />9</div>
+                    <div class="item flexacenter"><img class="icon" src="@/assets/img/comment-icon.png" />{{ commentComments }}</div>
+
                     <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" />
@@ -265,6 +316,7 @@
             </div>
         </div>
     </div>
+    <Report v-if="reportAlertShow" :reportToken="reportToken"></Report>
 </template>
 
 <script setup>
@@ -273,14 +325,12 @@ const route = useRoute()
 let uniqid = route.params.id
 
 onMounted(() => {
-    window.addEventListener("scroll", handleScroll)
+    // window.addEventListener("scroll", handleScroll)
-
     getDetails()
 })
 
 watch(route, () => {
     clearAllData()
-
     nextTick(() => getDetails())
 })
 
@@ -321,10 +371,17 @@ let iscollection = ref(0) // 是否收藏
 let isdisplay = ref(true) // 是否隐藏
 let islike = ref(0) // 是否点赞
 let ismyself = ref(0) // 是否是作者
+let detailsLoading = ref(false) // 详情加载中
 
 const getDetails = () => {
+    if (detailsLoading.value) return
+    detailsLoading.value = true
+
     detailsHttp({ uniqid }).then(res => {
-        if (res.code != 200) return
+        if (res.code != 200) {
+            ElMessage.error(res.message)
+            return
+        }
         let data = res.data
         token = data["token"]
         info.value = data["info"]
@@ -335,9 +392,11 @@ const getDetails = () => {
         ismyself.value = data.ismyself
         qrcode.value = data["share"]["qrcode"]
 
-        getCommentListHttp()
         if (relatedlist.value.length == 0) getRelatedlistHttp()
         else CalculateSelectedList()
+
+        detailsLoading.value = false
+        getCommentListHttp()
     })
 }
 
@@ -385,6 +444,7 @@ const getRelatedlistHttp = () => {
 
 let seo = ref({})
 let commentCount = ref(0)
+let commentComments = ref(0) // 所有的评论数
 let commentPage = ref(1)
 let commentList = ref([])
 let commentLoading = false
@@ -393,12 +453,13 @@ let isEmptyState = ref(false) // 评论是否为空
 
 // 获取详情评论数据
 const getCommentListHttp = () => {
-    if (commentPage.value == 0 || commentLoading) return
+    if (commentPage.value == 0 || commentLoading || detailsLoading.value) return
     commentLoading = true
+
     detailsCommentListHttp({
-        // page: commentPage.value,
+        page: commentPage.value,
-        // childlimit: 1,
+        childlimit: 1,
-        // limit: commentPage.value == 1 ? 3 : 10,
+        limit: 10,
         token,
     })
         .then(res => {
@@ -412,6 +473,8 @@ const getCommentListHttp = () => {
 
             commentList.value = commentList.value.concat(data["data"])
 
+            commentComments.value = data["comments"]
+
             if (commentList.value.length == data["count"]) commentPage.value = 0
             else commentPage.value++
         })
@@ -420,8 +483,6 @@ const getCommentListHttp = () => {
 
 // 获取剩下的子评论
 const alsoCommentsData = (index, ind) => {
-    // const targetAnswerList = [...answerList.value]
-
     let targetCommentItem = { ...commentList.value[index] }
     const token = targetCommentItem["token"]
     const parentid = targetCommentItem["id"]
@@ -445,25 +506,54 @@ const alsoCommentsData = (index, ind) => {
         targetCommentItem["childPage"] = page
 
         commentList.value[index] = targetCommentItem
+    })
+}
 
-        console.log("targetCommentchild111", targetCommentItem)
+// 全部的启动到底部
+const handleCommentsScroll = e => {
+    const el = e.target
+    if (el.scrollHeight - el.scrollTop >= el.clientHeight + 40) return
+    getCommentListHttp()
+}
 
-        // let merged1 = [...targetAnswerList[index]["commentList"][ind]["child"], ...data.data.filter(item2 => !targetAnswerList[index]["commentList"][ind]["child"].find(item1 => item1.id == item2.id))]
+// 评论点赞
+const commentLike = (index, i) => {
+    const targetCommentList = [...commentList.value]
 
-        // targetAnswerList[index]["commentList"][ind]["child"] = merged1
+    let token = ""
-        // answerList.value = targetAnswerList
+    if (i != null) token = targetCommentList[index]["child"][i].token
+    else token = targetCommentList[index].token
+
+    detailsLikeCommentHttp({ token }).then(res => {
+        if (res.code != 200) return
+        let data = res.data
+
+        if (i != null) {
+            targetCommentList[index]["child"][i].islike = data["status"]
+            targetCommentList[index]["child"][i].likenum = data["likenum"]
+        } else {
+            targetCommentList[index].islike = data["status"]
+            targetCommentList[index].likenum = data["likenum"]
+        }
+
+        ElMessage({
+            message: res.message,
+            type: "success",
+        })
     })
 }
 
 // 监听滚动到底部
 const handleScroll = () => {
+    return
+
     const scrollTop = document.documentElement.scrollTop || document.body.scrollTop
 
     const scrollHeight = document.documentElement.scrollHeight
     const clientHeight = document.documentElement.clientHeight
-
+    // console.log(scrollTop + clientHeight >= scrollHeight - 40)
     // 列表下 滑动到底部 获取新数据
-    if (scrollTop + clientHeight >= scrollHeight - 40) getCommentListHttp()
+    // if (scrollTop + clientHeight >= scrollHeight - 40) getCommentListHttp()
 }
 
 // 打开 回答-评论 的子评论
@@ -489,38 +579,29 @@ let commentInput = ref("")
 
 // 提交回答-评论
 const submitAnswerComments = (index, i) => {
-    console.log(index, "index")
-    // answerList.value[index]['commentState'] = true
     const targetCommentList = [...commentList.value]
     let content = ""
     let parentid = null
-    let targetToken = ""
-    if (index) targetToken = targetCommentList[index]["token"]
-    else targetToken = token
 
     if (index == null) content = commentInputTop.value
     else content = commentInput.value
 
-    console.log("content", content)
+    if (i != null) parentid = targetCommentList[index]["child"][i]["id"]
-
+    else if (index != null) parentid = targetCommentList[index]["id"]
-    if (i != null) {
-        parentid = targetCommentList[index]["child"][i]["id"]
-    } else if (index != null) {
-        parentid = targetCommentList[index]["id"]
-    }
-
-    console.log("parentid", parentid)
 
     detailsSubmitommentListHttp({
         content,
-        token: targetToken,
+        token,
-        // parentid,
+        parentid,
     }).then(res => {
         if (res.code != 200) return
         let data = res.data
 
-        console.log("data", data)
+        isdisplay.value = true
+
         if (i != null) {
+            console.log("111", targetCommentList[index]["child"][i])
+
             let targetData = {
                 id: data["commentid"],
                 content,
@@ -533,6 +614,8 @@ const submitAnswerComments = (index, i) => {
                 ...data,
             }
 
+            console.log("targetData", targetData)
+
             targetCommentList[index]["child"].unshift(targetData)
             targetCommentList[index]["childnum"]++
         } else {
@@ -545,11 +628,24 @@ const submitAnswerComments = (index, i) => {
                 ...data,
                 child: [],
             }
-            targetCommentList.unshift(targetData)
+            if (index != null) {
-            commentCount.value++
+                targetCommentList[index]["child"].unshift(targetData)
+                targetCommentList[index]["childnum"]++
+            } else {
+                targetCommentList.unshift(targetData)
+                commentCount.value++
+            }
         }
-
+        commentComments.value++
         commentList.value = targetCommentList
+
+        // 请求 输入框的数据
+        commentInputTop.value = ""
+        commentInput.value = ""
+        isEmptyState.value = false // 取消有可能的 没有评论
+
+        closeAnswerCommentsChild()
+
         ElMessage({
             message: res.message,
             type: "success",
@@ -604,12 +700,17 @@ let copyText = text => {
 
 // 点击点赞
 const handleLike = () => {
+    if (islike.value) {
+        ElMessage.error("不可取消点赞")
+        return
+    }
     operateLikeHttp({ token }).then(res => {
         if (res.code != 200) return
         let data = res.data
         info.value["likenum"] = data["count"]
         islike.value = data["status"]
 
+        isdisplay.value = true
         ElMessage({
             message: res.message,
             type: "success",
@@ -641,7 +742,11 @@ const handleItem = uni => {
 
     uniqid = uni
 
-    info.value = {}
+    // info.value = {}
+    info.value["message"] = ""
+    info.value["subject"] = ""
+    info.value["profession"] = ""
+
     qrcode.value = ""
     iscollection.value = 0
     isdisplay.value = true
@@ -656,7 +761,8 @@ const handleItem = uni => {
     // clearAllData()
 
     nextTick(() => getDetails())
-    // replaceState(uni)
+
+    replaceState(uni)
 }
 
 // 修改 url
@@ -665,6 +771,77 @@ const replaceState = uni => {
     // 替换当前URL，但不刷新页面
     window.history.pushState({}, "", `${window.location.origin}/details/${uni}`)
 }
+
+let reportAlertShow = ref(false)
+let reportToken = ref("")
+
+// 点击打开举报
+const report = token => {
+    reportToken.value = token
+    reportAlertShow.value = true
+}
+
+provide("reportAlertShow", reportAlertShow)
+
+// seo的
+if (process.server) {
+    try {
+        await detailsHttp({ uniqid }).then(res => {
+            if (res.code != 200) {
+                ElMessage.error(res.message)
+                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"]
+
+            if (relatedlist.value.length == 0) getRelatedlistHttp()
+            else CalculateSelectedList()
+            detailsLoading.value = false
+            getCommentListHttp()
+        })
+
+        await relatedlistHttp({ token, page: 1 }).then(res => {
+            if (res.code != 200) return
+
+            let data = res.data
+
+            relatedlist.value = data.data
+            relatedcount.value = data.count
+
+            CalculateSelectedList()
+        })
+    } catch (error) {}
+}
+
+const isBrowser = computed(() => {
+    return process.client // 使用 process.client 判断是否在浏览器环境下
+})
+
+// 点击发送信息
+const sendMessage = uin => {
+    console.log("uin", uin)
+    redirectToExternalWebsite(`https://bbs.gter.net/home.php?mod=space&showmsg=1&uid=${uin}`)
+}
+
+// 点击ta的主页
+const TAHomePage = uin => {
+    redirectToExternalWebsite(`https://bbs.gter.net/home.php?mod=space&uid=${uin}`)
+}
+
+// 跳转 url
+const redirectToExternalWebsite = url => {
+    const link = document.createElement("a")
+    link.href = url
+    link.target = "_blank"
+    link.click()
+}
 </script>
 
 <style lang="less" scoped>
@@ -777,8 +954,8 @@ const replaceState = uni => {
                     // justify-content: space-between;
 
                     .mj-avatar {
-                        width: 24px;
+                        width: 20px;
-                        height: 24px;
+                        height: 20px;
                         margin-right: 10px;
                         border-radius: 50%;
                     }
@@ -799,7 +976,7 @@ const replaceState = uni => {
                     .info-item {
                         line-height: 20px;
                         &:not(:last-of-type) {
-                            margin-bottom: 10px;
+                            margin-bottom: 8px;
                         }
                         .info-name {
                             color: #7f7f7f;
@@ -826,6 +1003,7 @@ const replaceState = uni => {
 
         scrollbar-width: none;
         -ms-overflow-style: none;
+        position: relative;
 
         .header {
             padding: 30px 45px 25px;
@@ -837,6 +1015,10 @@ const replaceState = uni => {
                 margin-bottom: 15px;
             }
 
+            .mj-header-left {
+                position: relative;
+            }
+
             .mj-header {
                 line-height: 22px;
                 font-size: 13px;
@@ -913,7 +1095,8 @@ const replaceState = uni => {
 
                         .details-value {
                             color: #000000;
-
+                            white-space: break-spaces;
+                            // width: 693px;
                             &.date {
                                 font-weight: 900;
                                 font-style: normal;
@@ -926,6 +1109,7 @@ const replaceState = uni => {
                                 font-size: 15px;
                                 line-height: 30px;
                                 position: relative;
+                                width: 693px;
 
                                 .unlock-mask {
                                     display: none;
@@ -950,7 +1134,7 @@ const replaceState = uni => {
                                         justify-content: flex-end;
                                         padding-bottom: 38px;
                                         line-height: normal;
-                                        // display: none;
+                                        display: flex;
 
                                         > div {
                                             margin-top: 7px;
@@ -1067,7 +1251,8 @@ const replaceState = uni => {
 
                                 .comments-time {
                                     color: #aaaaaa;
-                                    margin-right: 8px;
+                                    // margin-right: 8px;
+                                    margin-right: 10px;
                                 }
 
                                 .comments-identity {
@@ -1149,7 +1334,7 @@ const replaceState = uni => {
                             line-height: 22px;
                             color: #333;
                             margin-bottom: 10px;
-
+                            word-break: break-all;
                             .comments-reply {
                                 color: #92a1bf;
                                 display: inline;

pages/index.html/index.vue

@@ -1,4 +1,7 @@
 <template>
+    <Head>
+        <Title>寄托面经</Title>
+    </Head>
     <Header></Header>
     <div class="search-result flexacenter" v-if="keyword">
         <div class="keyword flexacenter" @click="clearKeyword">{{ keyword }} <img class="keyword-icon" src="@/assets/img/cross-circle-icon.png" /></div>
@@ -6,7 +9,7 @@
         <div class="total">共 {{ count }} 条搜索数据</div>
     </div>
     <div class="content" ref="gridContainer">
-        <div class="empty-box" v-if="list.length == 0 && page == 0">
+        <div class="empty-box flexcenter" v-if="list.length == 0 && page == 0">
             <empty hint="没有找到相关结果，请更换搜索关键词"></empty>
         </div>
         <template v-else>
@@ -14,11 +17,10 @@
         </template>
     </div>
     <div class="in-end" v-if="page == 0 && list.length > 0">- 到底了 -</div>
-
 </template>
 
 <script setup>
-import {ElMessage} from "element-plus"
+import { ElMessage } from "element-plus"
 
 const gridContainer = ref(null)
 let masonryInstance = null
@@ -30,7 +32,7 @@ keyword.value = route.query["keyword"]
 watchEffect(() => {
     if (keyword.value != route.query["keyword"]) {
         // keyword.value = route.query["keyword"]
-        console.log(keyword.value)
+        // console.log("keyword", keyword.value)
         list.value = []
         page.value = 1
         keyword.value = route.query["keyword"]
@@ -71,9 +73,16 @@ const getList = () => {
     if (page.value == 0 || loading) return
 
     loading = true
-    getListHttp({page: page.value, keyword: keyword.value})
+    getListHttp({ page: page.value, keyword: keyword.value })
         .then(res => {
-            if (res.code != 200) return
+            if (res.code != 200) {
+                page.value = 0
+                ElMessage({
+                    message: res.message,
+                    type: "error",
+                })
+                return
+            }
             // console.log("res", res.code)
             let data = res.data
             // list.value = data.data
@@ -96,14 +105,10 @@ const getList = () => {
 getList()
 
 const handleLike = token => {
-    operateLikeHttp({token}).then(res => {
+    operateLikeHttp({ token }).then(res => {
         if (res.code != 200) return
         let data = res.data
 
-        console.log("data", data)
-
-        console.log(list.value, "list.value")
-
         list.value.forEach(element => {
             console.log(element, "element")
             if (element["token"] == token) {
@@ -129,6 +134,24 @@ const router = useRouter()
 const clearKeyword = () => {
     router.push(`/index.html`)
 }
+
+try {
+    if (process.server) {
+        await getListHttp({ page: 1, keyword: keyword.value }).then(res => {
+            if (res.code != 200) {
+                page.value = 0
+                ElMessage({
+                    message: res.message,
+                    type: "error",
+                })
+                return
+            }
+            let data = res.data
+
+            list.value = list.value.concat(data.data || [])
+        })
+    }
+} catch (error) {}
 </script>
 
 <style scoped lang="less">

pages/publish/index.vue

@@ -1,9 +1,9 @@
 <template>
-    <div class="flexacenter save-box save-left">
+    <div class="flexacenter save-box save-left" @click="submit(0)">
         <img class="save-icon" src="@/assets/img/arrow-gray.png" />
         保存并退出
     </div>
-    <div class="flexacenter save-box save-right">
+    <div class="flexacenter save-box save-right" @click="abandonSaving">
         放弃保存
         <img class="save-icon" src="@/assets/img/cross-icon.png" />
     </div>
@@ -21,7 +21,7 @@
                             <div class="info-item flexacenter">
                                 <div class="info-name">院校</div>
                                 <div class="flex1">
-                                    <el-autocomplete v-model="state1" :fetch-suggestions="querySearch" clearable class="inline-input w-50" placeholder="输入关键词，选择院校" @select="handleSelect">
+                                    <el-autocomplete debounce v-model="info.school" :fetch-suggestions="querySchoolSearch" clearable class="inline-input w-50" placeholder="输入关键词，选择院校" @select="handleSchoolSelect" :trigger-on-focus="false">
                                         <template #suffix>
                                             <img class="" src="@/assets/img/arrow-black.svg" />
                                         </template>
@@ -31,7 +31,7 @@
                             <div class="info-item flexacenter">
                                 <div class="info-name">专业</div>
                                 <div class="flex1">
-                                    <el-autocomplete v-model="state1" :fetch-suggestions="querySearch" clearable class="inline-input w-50" placeholder="输入关键词，选择专业" @select="handleSelect">
+                                    <el-autocomplete v-model="info.profession" :fetch-suggestions="queryMajorSearch" clearable class="inline-input w-50" placeholder="输入关键词，选择专业" @select="handleMajorSelect" :trigger-on-focus="false">
                                         <template #suffix>
                                             <img class="" src="@/assets/img/arrow-black.svg" />
                                         </template>
@@ -40,7 +40,7 @@
                             </div>
                             <div class="info-item flexacenter">
                                 <div class="info-name">项目</div>
-                                <el-input class="flex1 input" placeholder="请输入"></el-input>
+                                <el-input class="flex1 input" placeholder="请输入" v-model="info.project"></el-input>
                             </div>
                         </div>
                     </div>
@@ -53,7 +53,7 @@
 
                         <div class="time-box item-input-box flexacenter">
                             <el-config-provider :locale="zhCn">
-                                <el-date-picker v-model="value1" type="date" placeholder="请选择" size="large" class="flex1 flexacenter" :clear-icon="{}" />
+                                <el-date-picker v-model="info.interviewtime" type="date" placeholder="请选择" size="large" class="flex1 flexacenter" :clear-icon="{}" value-format="YYYY-MM-DD" />
                             </el-config-provider>
                             <img class="calendar-icon" src="@/assets/img/calendar-icon.svg" />
                         </div>
@@ -65,11 +65,12 @@
                             <div class="asterisk">*</div>
                         </div>
 
-                        <div class="title-box item-input-box flexacenter"><el-input v-model="title" placeholder="给你的面经帖起一个吸引的标题吧"></el-input></div>
+                        <div class="title-box item-input-box flexacenter"><el-input v-model="info.subject" placeholder="给你的面经帖起一个吸引的标题吧"></el-input></div>
                     </div>
                 </div>
-                <div class="visible-box flexacenter">
+                <div class="visible-box flexacenter" @click="cutVisible()">
-                    <img class="visible-icon" src="@/assets/img/frame-no.svg" />
+                    <img class="visible-icon" v-if="info.isvisiblereply == 0" src="@/assets/img/frame-no.svg" />
+                    <img class="visible-icon" v-else src="@/assets/img/frame-pitch.svg" />
                     回复/点赞可见
                 </div>
             </div>
@@ -80,9 +81,8 @@
                             面试构成及过程
                             <div class="asterisk">*</div>
                         </div>
-
                         <div class="course-box">
-                            <el-input v-model="course" type="textarea" placeholder="例如：项目介绍、面试时长、面试官、问题QA、需要注意的地方"></el-input>
+                            <el-input v-model="info.message" type="textarea" autosize placeholder="例如：项目介绍、面试时长、面试官、问题QA、需要注意的地方"></el-input>
                         </div>
                     </div>
                 </div>
@@ -94,80 +94,159 @@
 
     <div class="floor-box">
         <div class="box flexacenter">
-            <div class="anonymous-box flexacenter">
+            <div class="anonymous-box flexacenter" @click="cutAnonymous()">
-                <img class="anonymous-icon" src="@/assets/img/frame-pitch.svg" />
+                <img class="anonymous-icon" v-if="info.anonymous == 0" src="@/assets/img/frame-no.svg" />
-                <!-- <img class="anonymous-icon" src="@/assets/img/frame-no.svg" /> -->
+                <img class="anonymous-icon" v-else src="@/assets/img/frame-pitch.svg" />
                 匿名发表
                 <div class="text">（发布后可修改）</div>
             </div>
-            <div class="issue-btn flexcenter">发布</div>
+            <div class="issue-btn flexcenter" @click="submit()">发布</div>
         </div>
     </div>
 </template>
 
 <script setup>
+import { ElMessage } from "element-plus"
 import zhCn from "element-plus/dist/locale/zh-cn.mjs"
+const router = useRouter()
 
-const state1 = ref("")
+let aaa = ref(1703001600000)
-
-const restaurants = ref([])
 
 onMounted(() => {
-    restaurants.value = loadAll()
     getInit()
 })
-
+let token = ""
 const getInit = () => {
     publishInitHttp().then(res => {
-        console.log("res", res)
+        if (res.code != 200) {
+            ElMessage.error(res.message)
+            return
+        }
+        const data = res.data
+        token = data["token"]
+        let interviewtime = data["info"]["interviewtime"] || 0
+        if (interviewtime) data["info"]["interviewtime"] = handleDate(interviewtime)
+
+        console.log(interviewtime, "interviewtime")
+        info.value = { ...data["info"] }
+
+        console.log(token)
     })
 }
 
-const querySearch = (queryString, cb) => {
+// 处理初始化 面试时间的 时间戳格式
-    // https://offer.gter.net/miniprogram/InterviewExperience/schoolSearch
+const handleDate = timestamp => {
+    // 使用Date对象将时间戳转换为日期对象
+    var date = new Date(timestamp * 1000)
+
+    // 获取年份、月份和日期
+    var year = date.getFullYear()
+    var month = ("0" + (date.getMonth() + 1)).slice(-2) // 月份从0开始，需要加1并补0
+    var day = ("0" + date.getDate()).slice(-2) // 获取日期并补0
+
+    // 拼接为yyyy-mm-dd格式的日期字符串
+    var formattedDate = year + "-" + month + "-" + day
+
+    return formattedDate
+}
+
+let info = ref({
+    school: "", // 学校
+    profession: "", // 专业
+    project: "", // 项目时间
+    interviewtime: "", // 面试时间
+    subject: "", //标题
+    isvisiblereply: 0, // 回复点赞可见
+    message: "", // 过程
+    anonymous: 0, // 匿名状态
+})
+
+// 关键字搜索学校
+const querySchoolSearch = (queryString, cb) => {
     publishSchoolSearchHttp({ keyword: queryString }).then(res => {
-        // console.log("res", res)
         if (res.code != 200) return
-        let data = res.data
+        let data = res.data || []
-        console.log(data, "data")
+
+        let isRepetition = false
+
         data.forEach(element => {
-            console.log(element, "element")
+            element["value"] = element["name"]
-            element['value'] 
+            if (element["name"] == queryString) isRepetition = true
         })
+        if (!isRepetition) {
+            data.unshift({
+                value: queryString,
+            })
+        }
         cb(data)
     })
-
-    return
-
-    const results = queryString ? restaurants.value.filter(createFilter(queryString)) : restaurants.value
-    // call callback function to return suggestions
-    cb(results)
 }
 
-const createFilter = queryString => {
+// 选择院校
-    return restaurant => {
+const handleSchoolSelect = item => (info.value["schoolid"] = item["id"] || 0)
-        return restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0
+
-    }
+// 关键字搜索专业
-}
+const queryMajorSearch = (queryString, cb) => {
-const loadAll = () => {
+    publishProfessionSearchHttp({ keyword: queryString }).then(res => {
-    return [
+        if (res.code != 200) return
-        { value: "vue", link: "https://github.com/vuejs/vue" },
+        let data = res.data || []
-        { value: "element", link: "https://github.com/ElemeFE/element" },
+
-        { value: "cooking", link: "https://github.com/ElemeFE/cooking" },
+        let isRepetition = false
-        { value: "mint-ui", link: "https://github.com/ElemeFE/mint-ui" },
+
-        { value: "vuex", link: "https://github.com/vuejs/vuex" },
+        data.forEach(element => {
-        { value: "vue-router", link: "https://github.com/vuejs/vue-router" },
+            element["value"] = element["name"]
-        { value: "babel", link: "https://github.com/babel/babel" },
+            if (element["name"] == queryString) isRepetition = true
-    ]
+        })
+        if (!isRepetition) {
+            data.unshift({
+                value: queryString,
+            })
+        }
+        cb(data)
+    })
 }
 
-const handleSelect = item => {
+// 选择专业
-    console.log(item)
+const handleMajorSelect = item => (info.value["profession_id"] = item["id"] || 0)
+
+// 切换匿名状态
+const cutAnonymous = () => {
+    info.value["anonymous"] = info.value["anonymous"] == 0 ? 1 : 0
 }
 
-const value1 = ref("")
+// 切换回复可见状态
-const title = ref("")
+const cutVisible = () => {
-const course = ref("")
+    info.value["isvisiblereply"] = info.value["isvisiblereply"] == 0 ? 1 : 0
+}
+
+// 提交发布
+const submit = (status = 1) => {
+    console.log(info.value)
+    publishSubmitHttp({ info: info.value, token, status }).then(res => {
+        if (res.code != 200) {
+            ElMessage.error(res.message)
+            return
+        }
+
+        const data = res.data
+        console.log("data", data)
+        ElMessage.success(res.message)
+
+        router.push(`/details/${data["uniqid"]}`)
+    })
+}
+
+// 放弃保存 跳跃上一页或者首页
+const abandonSaving = () => {
+    // console.log("router.currentRoute.value.meta.previousPage", router.currentRoute.value.meta.previousPage)
+    if (router.currentRoute.value.meta.previousPage) router.go(-1)
+    else router.push("./index.html") // 跳转到首页
+}
+
+// 保存并退出
+const saveAndExit = () => {
+    console.log("saveAndExit")
+}
 </script>
 
 <style scoped lang="less">
@@ -291,6 +370,7 @@ const course = ref("")
                 font-size: 14px;
                 color: #555555;
                 cursor: pointer;
+                user-select: none;
                 .visible-icon {
                     width: 18px;
                     height: 18px;
@@ -353,6 +433,7 @@ const course = ref("")
             cursor: pointer;
             color: #333333;
             font-size: 14px;
+            user-select: none;
 
             .text {
                 color: rgb(170, 170, 170);

utils/http.js

@@ -57,13 +57,9 @@ const get = (url, params) => {
 const post = (url, params) => {
     return new Promise((resolve, reject) => {
         //是将对象 序列化成URL的形式，以&进行拼接   
-        axios.post(url, QS.stringify(params)).then(res => {
+        axios.post(url, QS.stringify(params)).then(res => resolve(res.data)).catch(err => {
-            resolve(res.data);
+            if (err.data.code == 401) resolve(err.data);
-        }).catch(err => {
+            else reject(err.data)
-            if (err.data.code == 401) {
-                resolve(err.data);
-            } else reject(err.data)
-
         })
     });
 }