优化工具箱详情页评论功能及API接口

api/drawe-detail/index.ts

@@ -14,7 +14,7 @@ export const getDetail = (params: { id?: number | string }) => {
  * 获取评论列表
  * @return {Promise}
  */
-export const getCommentList = (params: { relationId?: number | string; pageNum?: number; pageSize?: number }) => {
+export const getCommentList = (params: { relationId?: number | string; pageNum?: number; pageSize?: number; type: number }) => {
   return useDollarFetchRequest.get<IResponse<PageResultProjectCommentResVO>>('/prod-api/app-api/business/app/project-comment/page', { query: params })
 }
 
@@ -22,7 +22,7 @@ export const getCommentList = (params: { relationId?: number | string; pageNum?:
  * 发表评论
  * @return {Promise}
  */
-export const createComment = (params: { relationId?: number | string; content?: string; projectId?: number | string }) => {
+export const createComment = (params: { relationId?: number | string; content?: string; projectId?: number | string; type: number }) => {
   return useDollarFetchRequest.post<IResponse<boolean>>('/prod-api/app-api/business/app/project-comment/create', params)
 }
 
@@ -50,6 +50,14 @@ export const getUserInfo = (params: { id?: number | string }) => {
   return useFetchRequest.get<IResponse<UserExtendSimpleRespDTO>>('/prod-api/app-api/business/app/project-draw/preview-user-info', { params })
 }
 
+/**
+ * 获取工具发布人信息
+ */
+
+export const getToolUserInfo = (params: { id?: number | string }) => {
+  return useFetchRequest.get<IResponse<UserExtendSimpleRespDTO>>('/prod-api/app-api/business/resource/publish-user-info', { params })
+}
+
 /**
  * 当前用户的主要作品内容
  */

api/toolbox/types.ts

@@ -75,6 +75,8 @@ export interface ProjectResourceRespVO {
   favoriteId?: number
   downloadId?: string
   sourceType: number
+  ownedUserName?: string
+  ownedUserAvatar?: string
   ownedUserIdInfo: {
     id: number
     nickName: string

components/comment-section/index.vue

@@ -1,6 +1,8 @@
 <template>
   <div class="mt-[30px] w-[100%]">
-    <div class="h-[48px] w-[100%] rounded-[1px] bg-[#F8F8F8] pl-[10px] text-[16px] text-[#333333] font-normal line-height-[50px]"> 共有{{ result.total || 0 }}条评论 </div>
+    <div class="h-[48px] w-[100%] rounded-[1px] bg-[#F8F8F8] pl-[10px] text-[16px] text-[#333333] font-normal line-height-[50px]">
+      共有{{ result.total || 0 }}条评论
+    </div>
     <div v-for="item in result.list" :key="item.id" class="mt-[20px] border-b-[1px] border-b-[#eee] border-b-solid pb-[14px]">
       <div class="flex items-start">
         <el-avatar :src="item.creatorInfo.avatar" alt="" srcset="" class="h-[50px] w-[49px] rounded-full" />
@@ -44,7 +46,7 @@
     },
     projectId: {
       type: Number,
-      required: true,
+      required: false,
     },
   })
 
@@ -66,7 +68,12 @@
 
   // 获取评论列表
   const handleGetCommentList = async () => {
-    const res = await getCommentList({ relationId: props.relationId, pageNum: query.value.pageNo, pageSize: query.value.pageSize })
+    const res = await getCommentList({
+      relationId: props.relationId,
+      pageNum: query.value.pageNo,
+      pageSize: query.value.pageSize,
+      type: props.projectId ? 1 : 2,
+    })
     if (res.code === 0) {
       result.value.list = res.data.list
       result.value.total = res.data.total
@@ -75,7 +82,7 @@
 
   // 发表评论
   const handleCreateComment = async () => {
-    const res = await createComment({ relationId: props.relationId, content: commentContent.value, projectId: props.projectId })
+    const res = await createComment({ relationId: props.relationId, content: commentContent.value, projectId: props.projectId, type: props.projectId ? 1 : 2 })
     if (res.code === 0) {
       commentContent.value = ''
       query.value.pageNo = 1
@@ -87,8 +94,9 @@
     () => props.relationId,
     () => {
       handleGetCommentList()
-    },{
+    },
-      immediate: true
+    {
+      immediate: true,
     }
   )
 </script>

pages/toolbox-detail/[id].vue

@@ -13,8 +13,8 @@
       >
         <div class="text-[20px] text-[#333333] font-normal"> {{ detail?.title }}</div>
         <div class="flex items-center">
-          <img :src="detail?.ownedUserIdInfo?.avatar" alt="" srcset="" class="h-[30px] w-[30px] rd-[50%]" />
+          <img :src="detail?.ownedUserAvatar" alt="" srcset="" class="h-[30px] w-[30px] rd-[50%]" />
-          <span class="ml-[12px] color-[#999999]">by {{ detail?.ownedUserIdInfo?.nickName }}</span>
+          <span class="ml-[8px] color-[#999999]">by {{ detail?.ownedUserName }}</span>
         </div>
       </div>
 
@@ -81,10 +81,10 @@
       </div>
 
       <!-- 评论 -->
-      <!-- <CommentSection :relation-id="detail!.id" :project-id="detail!.projectId" /> -->
+      <CommentSection :relation-id="detail!.id" />
     </div>
     <div class="ml-[22px]">
-      <div class="box-border min-h-[269px] w-[397px] border border-[#EEEEEE] rounded-[12px] border-solid bg-[#FFFFFF] pa-[22px]">
+      <div class="box-border min-h-[180px] w-[397px] border border-[#EEEEEE] rounded-[12px] border-solid bg-[#FFFFFF] pa-[22px]">
         <div class="mb-[10px]">工具ID: {{ detail?.no }}</div>
         <!-- <div class="mb-[10px]">文件大小：{{ detail?.filesInfo?.fileSize || 0 }} </div> -->
         <!-- <div class="mb-10px">图纸版本：{{ detail.editionsName }} </div> -->
@@ -167,10 +167,10 @@
   import CardPicture from '~/components/kl-card-picture/index.vue'
   import { getDictTree } from '~/api/home/index'
   import { get } from '@/api/toolbox/index'
-  import { getDetail, getRelationRecommend, report, getUserInfo, getMainWork, createContent, createUserProject, deleteProject } from '~/api/drawe-detail/index'
+  import { getDetail, getRelationRecommend, report, getToolUserInfo, getMainWork, createContent, createUserProject, deleteProject } from '~/api/drawe-detail/index'
   import KlNavTab from '~/components/kl-nav-tab/index.vue'
   import ThumBnail from './components/swiper.vue'
-  // import CommentSection from '~/components/comment-section/index.vue'
+  import CommentSection from '~/components/comment-section/index.vue'
   import { useRoute } from 'vue-router'
   import useUserStore from '~/stores/user'
   const message = useMessage()
@@ -198,7 +198,7 @@
 
   const [{ data: mainWork }, { data: userInfo }] = await Promise.all([
     getMainWork({ id: detail.value?.id, limit: 10, memberId: detail.value?.ownedUserId }),
-    getUserInfo({ id: detail.value?.ownedUserId }),
+    getToolUserInfo({ id: detail.value?.id }),
   ])
 
   // 获取最新发布