讨论

src/api/api.js

@@ -34,7 +34,7 @@ export const EXAMINATION_QUERYEXAMINATIONDETAILBYID = '/examination/queryExamina
 export const DISCUSS_COLLECTION = '/discussSubmit/clickDiscussCollectionCountOr post'
 export const DISCUSS_LIKE = '/discussSubmit/clickDiscussLikeCountOr post'
 export const DISCUSS_LIST = '/discussSubmit/list'
-export const DISCUSS_DETAIL = '/discuss/getDiscussDetail'
+export const DISCUSS_DETAIL = '/discussSubmit/detail'
 export const DISCUSS_SUBMIT_REVIEW_LIST = '/discussSubmit/queryDiscussSubmitAndReview'
 
 export const COMMENT_LIST = '/comment/list'

src/api/request.js

@@ -1,28 +1,64 @@
 import router from "@/router";
-import {ref, watch} from "vue";
+import {reactive, ref, toRefs, watch} from "vue";
 import axios from 'axios';
 
+export function usePage(_url, param) {
+
+    const state = reactive({
+        data: {},
+        loading: false,
+        total: 0,
+        size: 10,
+        current: 1,
+        params: {pageNo: 1, pageSize: 10, ...param}
+    })
+
+    watch(param, () => {
+        state.params = {...state.params, ...param}
+        fetchData()
+    })
+
+    function fetchData() {
+        state.loading = true
+        request(_url, state.params).then(r => {
+            state.params.pageNo === 1 ? (state.data = r.data.records) : (state.data = [...state.data, ...r.data.records])
+            state.size = r.data.size
+            state.total = r.data.total
+            state.current = r.data.current
+            state.loading = false
+        })
+    }
+
+    fetchData()
+    return {
+        ...toRefs(state),
+        fetchData,
+    };
+}
+
 export function useRequest(_url, params = {}) {
 
-    const data = ref({})
+    const state = reactive({
-    const loading = ref(false)
+        data: {},
+        loading: false,
+
+    })
 
     watch(params, () => {
         fetchData()
     })
 
     function fetchData() {
-        loading.value = true
+        state.loading = true
         request(_url, params).then(r => {
-            data.value = r.data
+            state.data = r.data
-            loading.value = false
+            state.loading = false
         })
     }
 
     fetchData()
     return {
-        data,
+        ...toRefs(state),
-        loading,
         fetchData,
     };
 }

src/views/discuss/DiscussPage.vue

@@ -39,21 +39,18 @@
         <div class="title">
           {{ projectInfo.name }}
         </div>
-        <!--        todo #讨论页面  发表帖子跳转到哪里-->
+<!--        <button class="btn">发表帖子</button>-->
-        <button class="btn">发表帖子</button>
       </div>
 
       <div v-for="(item,i) in projectInfo.stageVoList" :key="i">
         <div class="line clearfix">
           <div class="linetitle">{{ item.name }}</div>
           <div class="radi"></div>
-          <!--        todo #讨论页面 状态字段没有-->
           <div class="intime">进行中</div>
         </div>
         <div class="allbtn">
-          <!--        todo #讨论页面 查询条件最新 最热 查询字段-->
+          <button :class="`btnone ${param.searchType==1?'active':''}`" >最新</button>
-          <button :class="`btnone ${param.searchType==1?'active':''}`" @click="param.searchType=1">最新</button>
+          <button :class="`btntwo ${param.searchType==2?'active':''}`"
-          <button :class="`btntwo ${param.searchType==2?'active':''}`" @click="param.searchType=2"
                   style="margin-left: 20px">最热
           </button>
         </div>
@@ -115,13 +112,13 @@ function comment({discussId: id}) {
 function like(d) {
   d.praised ? (d.praiseNum -= 1) : (d.praiseNum += 1)
   d.praised = !d.praised
-  request(COMMENT_PRAISE, {targetId: d.discussId, type: 5})
+  request(COMMENT_PRAISE, {targetId: d.discussId, type: 3})
 }
 
 function collection(d) {
   d.collected ? (d.collectionNum -= 1) : (d.collectionNum += 1)
   d.collected = !d.collected
-  request(COMMENT_COLLECTION, {targetId: d.discussId, type: 6})
+  request(COMMENT_COLLECTION, {targetId: d.discussId, type: 4})
 }
 </script>
 
@@ -174,9 +171,7 @@ function collection(d) {
     background: #ffffff;
     border-radius: 8px;
     margin-top: 24px;
-    // display: flex;
+    display: block;
-    // flex-direction: column;
-    // align-items: center;
     .middletitle {
       display: flex;
       margin-top: 64px;
@@ -216,7 +211,7 @@ function collection(d) {
     .line {
       display: flex;
       margin: 47px 45px 0 75px;
-      max-width: 1810px;
+      //max-width: 1810px;
       // height: 50px;
       background: #f9f9f9;
       position: relative;

src/views/discussdetail/DiscussDetail.vue

@@ -37,37 +37,36 @@
       <!-- 中间部分 -->
       <div class="middletitle">
         <div class="title">
-          {{ disDetail.discussName }}
+          {{ disDetail.projectName }}
         </div>
-        <!--todo #帖子评论详情 回复功能点击后去哪里-->
         <button class="btn">回复</button>
       </div>
 
       <div class="line clearfix">
-        <div class="linetitle">{{ disDetail.discussExplain }}</div>
+        <div class="linetitle">{{ disDetail.stageName }}</div>
         <div class="radi"></div>
-        <!--todo #帖子评论详情 缺少状态字段-->
         <div class="intime">进行中</div>
       </div>
       <div class="discusscontent clearfix">
         <div class="contenttop clearfix">
 
 
-          <div class="contenttitle">{{ data.discussSubmitTitle }}</div>
+          <div class="contenttitle">{{ disDetail.discussName }}</div>
-          <div @click="like(data.discussId)"
+          <div @click="like()"
                style="display: flex;cursor: pointer;align-items: baseline;margin-left: 20px">
-            <span class="iconfont icon-dianzan" :style="{color:data.isLike?'red':'#b3bdc4',marginLeft: '19px'}"></span>
+            <span class="iconfont icon-dianzan"
-            <div class="count"> {{ data.discussLikeCount }}</div>
+                  :style="{color:disDetail.praised?'red':'#b3bdc4',marginLeft: '19px'}"></span>
+            <div class="count"> {{ disDetail.praiseNum || 0 }}</div>
           </div>
-          <div @click="collection(data.discussId)"
+          <div @click="collection()"
                style="display: flex;cursor: pointer;align-items: baseline;margin-left: 20px">
             <span class="iconfont icon-shoucang"
-                  :style="{color:data.isCollection?'red':'#b3bdc4',marginLeft: '19px'}"></span>
+                  :style="{color: disDetail.collected?'red':'#b3bdc4',marginLeft: '19px'}"></span>
-            <div class="count"> {{ data.discussCollectionCount }}</div>
+            <div class="count"> {{ disDetail.collectionNum || 0 }}</div>
           </div>
         </div>
         <div class="contentmid">
-          {{ data.discussSubmitTitle }}
+          {{ disDetail.discussExplain }}
         </div>
       </div>
     </div>
@@ -75,15 +74,14 @@
     <div class="bascinfor">
       <div class="inputone">
         <el-input
-            v-model="textarea1"
+            v-model="disComment.content"
             :autosize="{ minRows: 5, maxRows: 5 }"
             resize="none"
             maxlength="100"
             type="textarea"
             placeholder="写评论~"
-            @input="textareaInput"
         />
-        <div class="words">{{ textarealength }}/100</div>
+        <div class="words">{{ disComment.content.length }}/100</div>
         <div class="upload">
           <div style="display: flex">
             <div class="allimg" v-for="(img,i) in commentSubmitFileList">
@@ -105,62 +103,61 @@
 
         <div class="thinline"></div>
         <div class="bottom">
-          <div v-for="(row,i) in data.submitReviewVoList">
+          <div v-for="(row,i) in commontList">
             <div class="header">
               <div class="avator"></div>
-              <div class="id">{{ row.stuName }}</div>
+              <div class="id">{{ row.userName }}</div>
-              <!--todo #帖子评论详情 评论人名称后面有个（显示事业）？-->
               <div class="showCareer">(显示事业)</div>
               <div class="idThink">理性思考，崇尚科学</div>
             </div>
             <div class="discuss clearfix">
               <div class="discussmain clearfix">
                 <div class="talkmain">
-                  {{ row.discussReviewContent }}
+                  {{ row.content }}
                 </div>
               </div>
-              <!--todo #帖子评论详情 评论评论中缺少点赞数 是否点赞字段-->
+              <div class="intime">{{ row.ctime }}</div>
-              <div class="intime">{{ row.createTime }}</div>
               <div class="likeYou">
                 <div @click="commentComment(row)" style="display: flex;cursor: pointer;align-items: baseline;">
-                  <span class="iconfont icon-pinglun" :style="{color:'#b3bdc4'}"></span>
+                  <span class="iconfont icon-pinglun"
-                  <div class="count"> {{ row.discussLikeCount }}</div>
+                        :style="{color:'#b3bdc4'}"></span>
+                  <!--                  <div class="count"> {{ row.praiseNum || 0 }}</div>-->
                 </div>
                 <div @click="commentLike(row)"
                      style="display: flex;cursor: pointer;align-items: baseline;margin-left: 19px">
-                  <span class="iconfont icon-shoucang"
+                  <span class="iconfont icon-dianzan"
-                        :style="{color:data.submitReviewVoList[i].isLike?'red':'#b3bdc4'}"></span>
+                        :style="{color:row.praised?'red':'#b3bdc4'}"></span>
-                  <div class="count"> {{ row.discussLikeCount }}</div>
+                  <div class="count"> {{ row.praiseNum || 0 }}</div>
                 </div>
               </div>
-              <div v-for="(replay,j) in row.submitReplyVoList">
+              <div v-for="(replay,j) in row.children">
                 <div class="reply">
                   <div class="sameava avaone"></div>
-                  <div class="sameuser">{{ replay.stuName }}</div>
+                  <div class="sameuser">{{ replay.userName }}</div>
                   <div class="centerreply">回复</div>
                   <div class="sameava avatwo"></div>
-                  <div class="sameuser">{{ row.stuName }}</div>
+                  <div class="sameuser">{{ row.userName }}</div>
-                  <div class="replytime">{{ replay.createTime }}</div>
+                  <div class="replytime">{{ replay.ctime }}</div>
                 </div>
                 <div class="allreplyimg">
                   <div class="singleimg"></div>
                 </div>
                 <div class="mainreply">
                   <div class="replydetail">
-                    {{ replay.replyContent }}
+                    {{ replay.content }}
                   </div>
                   <!-- <div class="talk"></div> -->
                 </div>
                 <div class="likeYou">
                   <div @click="commentComment(replay)" style="display: flex;cursor: pointer;align-items: baseline;">
                     <span class="iconfont icon-pinglun" :style="{color:'#b3bdc4'}"></span>
-                    <div class="count"> {{ replay.discussLikeCount }}</div>
+<!--                    <div class="count"> {{ replay.commentNum }}</div>-->
                   </div>
                   <div @click="commentLike(replay)"
                        style="display: flex;cursor: pointer;align-items: baseline;margin-left: 19px">
-                  <span class="iconfont icon-shoucang"
+                  <span class="iconfont icon-dianzan"
-                        :style="{color:replay.isLike?'red':'#b3bdc4'}"></span>
+                        :style="{color:replay.praised?'red':'#b3bdc4'}"></span>
-                    <div class="count"> {{ replay.discussLikeCount }}</div>
+                    <div class="count"> {{ replay.praiseNum || 0 }}</div>
                   </div>
                 </div>
               </div>
@@ -171,15 +168,14 @@
           <div class="discuss clearfix">
             <div class="inreply">
               <el-input
-                  v-model="textarea2"
+                  v-model="replayComment.content"
                   :autosize="{ minRows: 5, maxRows: 5 }"
                   resize="none"
                   maxlength="100"
                   type="textarea"
-                  @input="textareaInputdown"
+                  :placeholder="replayComment.placeholder"
-                  :placeholder="placeholder"
               />
-              <div class="words">{{ textarealength2 }}/100</div>
+              <div class="words">{{ replayComment.content.length }}/100</div>
               <div class="upload">
                 <div style="display: flex">
                   <div class="allimg" v-for="(img,i) in fileList">
@@ -194,8 +190,7 @@
                       <div class="shangchuan">上传图片</div>
                     </button>
                   </UploadImg>
-                  <!--todo #帖子评论详情 评论和回复评论的层级关系 只有2级？-->
+                  <button class="btntwo" @click="submitReplayComment">发表</button>
-                  <button class="btntwo">发表</button>
                 </datagrid>
               </div>
             </div>
@@ -209,51 +204,33 @@
 <script setup>
 import {reactive, ref, toRefs} from "vue";
 import {useRoute} from "vue-router/dist/vue-router";
-import {request, useRequest} from "@/api/request";
+import {request, usePage, useRequest} from "@/api/request";
 import {
-  DISCUSS_COLLECTION,
+  COMMENT_ADD,
+  COMMENT_COLLECTION,
+  COMMENT_LIST, COMMENT_PRAISE,
   DISCUSS_DETAIL,
-  DISCUSS_LIKE,
-  DISCUSS_LIST,
-  DISCUSS_SUBMIT_REVIEW_LIST,
   FILE_UPLOAD
 } from "@/api/api";
 import UploadImg from '@/components/img/UploadImg.vue'
 
-const {query: {id: discussSubmitId, discussId}} = useRoute()
+const {query: {id, discussSubmitId}} = useRoute()
 
-const {data} = useRequest(DISCUSS_SUBMIT_REVIEW_LIST, {discussSubmitId})
+const {data: commontList, fetchData: commonFetch} = usePage(COMMENT_LIST, {id, type: 1})
 
-const {data: disDetail} = useRequest(DISCUSS_DETAIL, {discussId})
+const {data: disDetail} = useRequest(DISCUSS_DETAIL, {id})
 
 const fileList = ref([])
 const commentSubmitFileList = ref([])
 
-const state = reactive({
+const disComment = ref({
-  textarea1: "",
+  content: '',
-  textarealength: 0,
+})
-  textarea2: "",
+const replayComment = ref({
-  textarealength2: 0,
   placeholder: '',
-  rId:''
+  content: '',
-});
+  pid: ''
-const {
+})
-  textarea1,
-  textarealength,
-  textarea2,
-  textarealength2,
-  placeholder
-} = toRefs(state)
-
-const textareaInput = (e) => {
-  state.textarea1 = e;
-  state.textarealength = e.length;
-};
-const textareaInputdown = (e) => {
-  state.textarea2 = e;
-  state.textarealength2 = e.length;
-};
-
 
 function removeImg(i) {
   fileList.value.splice(i, 1)
@@ -263,34 +240,46 @@ function removeCommentImg() {
   commentSubmitFileList.value.splice(i, 1)
 }
 
-//todo 帖子是否点赞收藏
+function like() {
-function like(discussSubmitId) {
+  disDetail.value.praised ? (disDetail.value.praiseNum -= 1) : (disDetail.value.praiseNum += 1)
-  data.value.isLike ? (data.value.discussLikeCount -= 1) : (data.value.discussLikeCount += 1)
+  disDetail.value.praised = !disDetail.value.praised
-  data.value.isLike = !data.value.isLike
+  request(COMMENT_PRAISE, {targetId: disDetail.value.discussId, type: 5})
-  request(DISCUSS_LIKE, {discussSubmitId})
-  //todo 帖子和评论 返回是否点赞和收藏
 }
 
-function collection(discussSubmitId) {
+function collection() {
-  data.value.isCollection ? (data.value.discussCollectionCount -= 1) : (data.value.discussCollectionCount += 1)
+  disDetail.value.collected ? (disDetail.value.collectionNum -= 1) : (disDetail.value.collectionNum += 1)
-  data.value.isCollection = !data.value.isCollection
+  disDetail.value.collected = !disDetail.value.collected
-  request(DISCUSS_COLLECTION, {discussSubmitId})
+  request(COMMENT_COLLECTION, {targetId: disDetail.value.discussId, type: 6})
 }
 
 function commentLike(obj) {
-  obj.isLike ? (obj.discussLikeCount -= 1) : (obj.discussLikeCount += 1)
+  obj.praised ? (obj.praiseNum -= 1) : (obj.praiseNum += 1)
-  obj.isLike = !obj.isLike
+  obj.praised = !obj.praised
-  const discussSubmitId = obj.discussSubmitId
+  request(COMMENT_PRAISE, {targetId: obj.id, type: 5})
-  request(DISCUSS_LIKE, {discussSubmitId})
 }
 
 function commentComment(obj) {
-  state.placeholder = '@ '+obj.stuName
+  replayComment.value.placeholder = '@ ' + obj.userName
-  state.rId = obj.discussSubmitId
+  replayComment.value.pid = obj.id
 }
 
 function submitComment() {
+  request(COMMENT_ADD, {targetId: disDetail.value.discussId, content: disComment.value.content, type: 1}).then(() => {
+    commonFetch()
+  })
 
+
+}
+
+function submitReplayComment() {
+  request(COMMENT_ADD, {
+    targetId: disDetail.value.discussId,
+    content: replayComment.value.content,
+    type: 2,
+    pid: replayComment.value.pid
+  }).then(() => {
+    commonFetch()
+  })
 }
 </script>
 
@@ -378,7 +367,6 @@ function submitComment() {
     .line {
       display: flex;
       margin: 47px 45px 0 75px;
-      max-width: 1810px;
       height: 50px;
       background: #f9f9f9;
       position: relative;