From 6165979b6f549ff01973efa424ae6689fa4fd247 Mon Sep 17 00:00:00 2001
From: zhaofang <752743406@qq.com>
Date: Fri, 16 Sep 2022 18:28:08 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AF=BE=E7=A8=8B=E7=AC=94=E8=AE=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Portal/authorInfo.vue  |   9 +-
 src/components/Portal/comments.vue    | 114 ++--
 src/components/Portal/noteComment.vue | 845 ++++++++++++++++++++++++++
 src/icons/svg/triangle.svg            |   1 +
 src/views/study/coursenew.vue         |  19 +-
 5 files changed, 916 insertions(+), 72 deletions(-)
 create mode 100644 src/components/Portal/noteComment.vue
 create mode 100644 src/icons/svg/triangle.svg

diff --git a/src/components/Portal/authorInfo.vue b/src/components/Portal/authorInfo.vue
index c747284c..3245ba6e 100644
--- a/src/components/Portal/authorInfo.vue
+++ b/src/components/Portal/authorInfo.vue
@@ -5,15 +5,15 @@
       <!-- <div v-else class="uavatar"><span class="uavatar-text">{{avatarText}}</span></div> -->
       <el-avatar shape="circle" size="small" :src="userAvatar" v-if="userAvatar"></el-avatar>
       <div v-else class="uavatar">
-        <div v-if="sex == null" style="border-radius: 50%;width: 28px;height: 28px;"></div>
+        <div v-if="sex == null" style="border-radius: 50%;width: 40px;height: 40px;"></div>
         <div v-else>
           <div v-if="sex === 1 "><img src="../../../public/images/Avatarman.png" alt=""></div>
            <div v-else><img src="../../../public/images/Avatarwoman.png" alt=""></div>
         </div>
         </div>
     </div>
-		<div v-if="!onlyAvatar" style="padding-left: 5px;padding-top: 6px;font-size: 14px;color: #666666;">
-      <span>{{userName}}</span>
+		<div v-if="!onlyAvatar" style="padding-left: 14px;padding-top: 6px;font-size: 14px;">
+      <span style="color: #333333;font-weight: 600;">{{userName}}</span>
       <span class="author-text" v-if="userInfo && userInfo!=''">({{userInfo}})</span>
     </div>
 	</div>
@@ -112,7 +112,8 @@ import { userAvatarText } from "@/utils/tools.js";
     line-height: 18px;
 		display: flex;
     .author-text{
-      color: #6E7B84;
+      font-size: 12px;
+      color: #666666;
       margin-left: 4px;
     }
     .uavatar{
diff --git a/src/components/Portal/comments.vue b/src/components/Portal/comments.vue
index 19c57bb5..d02929dd 100644
--- a/src/components/Portal/comments.vue
+++ b/src/components/Portal/comments.vue
@@ -1,32 +1,16 @@
 <template>
   <!--评论组件-->
   <div class="comments">
-      <div v-if="showTop" class="comments-top">
+      <!-- <div v-if="showTop" class="comments-top">
           <div class="comments-top-left">评论 <span style="color: #797979;">{{total}}条</span>
               <el-checkbox v-if="objType ==2" class="btn" v-model="value" type="primary">只看作者</el-checkbox>
-              <!-- <el-checkbox v-if="objType ==3" class="btn" v-model="value" type="primary">{{value?'查看所有':'只看案主 @案主可以给他发私信哦'}}</el-checkbox> -->
-                <!-- <el-radio-group class="btn" v-if="objType ==3" v-model="radio">
-                  <el-radio v-show="radio == 2" :label="1">查看所有</el-radio>
-                  <el-radio v-show="radio == 1" :label="2">只看案主 @案主可以给他发私信哦</el-radio>
-                </el-radio-group> -->
               <el-checkbox v-if="objType ==3" class="btn" v-model="value" type="primary">{{'只看案主'}}</el-checkbox>
               <span v-if="objType ==3" class="anzhu"> @案主可以给他发私信哦</span>
-              <!-- <span v-if="objType ==3"><span v-if="value" @click="value = true">查看所有</span><span v-if="!value" @click="value = false">只看案主 @案主可以给他发私信哦</span></span> -->
           </div>
-          <!-- <div class="comments-top-right" v-if="objType !==2">
-              <span @click="showList(false)" v-if="listShow">收起<i class="el-icon-arrow-down"></i></span>
-              <span @click="showList(true)" v-else >打开<i class="el-icon-arrow-up"></i></span>
-          </div> -->
-      </div>
+      </div> -->
       <div class="comments-input" v-if="!readonly">
       <div class="grid-content bg-purple">
         <div style="position: relative !important" class="at-min">
-          <!-- <el-popover placement="top" width="300" trigger="click">
-                          <el-radio-group v-model="teacherInfo">
-                            <el-radio-button class="reference-tag" v-for="item in teachers" :key="item.id" :label="item.teacherName"></el-radio-button>
-                          </el-radio-group>
-                        <el-tag ref="tag" slot="reference"></el-tag>
-                      </el-popover> -->
           <el-popover placement="top-start"  width="160" v-model="visible">
             <p style="margin-bottom: 10px">请选择要@的老师</p>
 
@@ -39,18 +23,11 @@
                   :label="item.aid">{{ item.name }}</el-radio-button>
               </el-radio-group>
             </div>
-
-            <!-- <div style="text-align: right; margin: 0">
-                    <el-button size="mini" type="text" @click="cancelTeacher()">取消</el-button>
-                    <el-button type="primary"  >确定</el-button>
-                  </div> -->
             <el-tag ref="tag" slot="reference" class="tag-block"></el-tag>
           </el-popover>
         </div>
         <div style="width:100%;display:flex;">
           <div style="flex: 1;">
-             <!-- type="textarea"
-              :row="1" -->
             <el-input
               v-if="objType  !==3"
               :autosize="{ minRows: 2, maxRows: 2 }"
@@ -59,7 +36,7 @@
               show-word-limit
               v-model="inputValue"
               maxlength="800"
-              placeholder="写下您的评论(800字以内)，可以@作者哦～"
+              placeholder="写评论～"
             ></el-input>
             <el-input
             v-if="objType ==3"
@@ -80,6 +57,13 @@
         </div>
       </div>
     </div>
+    <div v-if="showTop" class="comments-top">
+          <div class="comments-top-left portal-title-tow" style="font-size: 18px;">{{total}}条评论 
+              <el-checkbox v-if="objType ==2" class="btn" v-model="value" type="primary">只看作者</el-checkbox>
+              <el-checkbox v-if="objType ==3" class="btn" v-model="value" type="primary">{{'只看案主'}}</el-checkbox>
+              <span v-if="objType ==3" class="anzhu"> @案主可以给他发私信哦</span>
+          </div>
+      </div>
       <!--列表内容-->
       <div class="comments-items" v-show="listShow">
           <!--一个评论-->
@@ -87,29 +71,32 @@
           <div class="comment" v-for="(com,comIdx) in list" :key="com.id">
                <div class="comment-top">
                   <div class="comment-author">
-                      <authorInfo :avatar="com.avatar" :name="com.sysCreateBy" :sex="com.sex"></authorInfo>
-                  </div>
-                  <div class="comment-time">
-                      <showTime :time="com.sysCreateTime"></showTime>
+                      <authorInfo :avatar="com.avatar" :name="com.sysCreateBy" :sex="com.sex" :info="com.orgInfo"></authorInfo>
                   </div>
                </div>
                <div class="comment-body" >
                     <div class="comment-info" @mouseover="showButtons(com.id)" @mouseout="hideButtons()">
                       <div class="comment-content" @click="cancelReply()">
-                          <span style="color: #303133" v-html="displayAll(com)"></span>
+                          <span class="portal-summary-text" style="color: #666666;" v-html="displayAll(com)"></span>
                           <span v-if="com.content.length>170" @click="changeIsAll(com)">
                             {{com.isAll?'收起':'全文'}}
                           </span>
                       </div>
-                      <div class="comment-btns">
-                         <!-- <a><svg-icon icon-class="like"></svg-icon><span>66</span></a> -->
-                         <div v-show="btnsShowRowId==com.id">
-                           <a @click="showReply(com)"><svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>回复</span></a>
-                           <!--必须当前登录人是一个人-->
-                           <a v-if="userInfo.aid==com.sysCreateAid" @click="delCommnet(com,comIdx)"><svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>删除</span></a>
-                           <!-- <a v-if="com.replyList && com.replyList.length==5" @click="showMoreReply(com)" ><svg-icon icon-class="all" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>全部</span></a> -->
-                         </div>
+                      <div class="comment-time portal-time">
+                        <showTime :time="com.sysCreateTime"></showTime>
+                        <interactBar :type="10" :shares="false"  :data="com" @addAnswers="showReply(com)" :favorites="false" :views="false" :comments="false" :answers="true"></interactBar>
                       </div>
+                      <!-- <div class="comment-btns"> -->
+                        
+                         <!-- <a><svg-icon icon-class="like"></svg-icon><span>66</span></a> -->
+                         <!-- <div v-show="btnsShowRowId==com.id"> -->
+                          
+                           <!-- <a @click="showReply(com)"><svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>回复</span></a> -->
+                           <!--必须当前登录人是一个人-->
+                           <!-- <a v-if="userInfo.aid==com.sysCreateAid" @click="delCommnet(com,comIdx)"><svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>删除</span></a> -->
+                           <!-- <a v-if="com.replyList && com.replyList.length==5" @click="showMoreReply(com)" ><svg-icon icon-class="all" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>全部</span></a> -->
+                         <!-- </div> -->
+                      <!-- </div> -->
                       <div v-if="replyInfo.parentId==com.id" class="comment-reply" style="padding-bottom: 5px;">
                         <div style="width:100%;display:flex;">
                           <div style="flex: 1;">
@@ -126,29 +113,32 @@
                          <div class="comment" v-for="(reply,replyIdx) in com.replyList" :key="reply.id" :class="replyIdx===com.replyList.length-1 ? 'comment-last' : ''">
                               <div class="comment-top">
                                  <div class="comment-author">
-                                   <authorInfo :avatar="reply.avatar" :name="reply.sysCreateBy" :sex="reply.sex"></authorInfo>
-                                   <span style="margin-left: 10px;color: #8590A6;font-size:14px; ">回复</span>
-                                   <span style="margin-left: 10px; font-size:14px">{{reply.replyName || reply.toAname}}</span>
-                                 </div>
-                                 <div class="comment-time">
-                                     <showTime :time="reply.sysCreateTime"></showTime>
+                                   <authorInfo :avatar="reply.avatar" :name="reply.sysCreateBy" :sex="reply.sex" :info="reply.orgInfo"></authorInfo>
+                                   <span style="margin-left: 10px;color: #8590A6;font-size:14px; ">
+                                    <svg-icon style="font-size: 10px;margin-right: 0;" icon-class="triangle"></svg-icon>
+                                  </span>
+                                   <span style="margin-left: 6px;font-size:14px;margin-top:5px" class="portal-title-tow" >{{reply.replyName || reply.toAname}}</span>
                                  </div>
                               </div>
                               <div class="comment-body" @mouseover="showButtons(reply.id)" @mouseout="hideButtons()">
                                 <div class="comment-info" >
                                    <div class="comment-content"  @click="cancelReply()">
-                                        <span style="color: #303133" v-html="displayAll(reply)"></span>
+                                        <span class="portal-summary-text" style="color: #666666;" v-html="displayAll(reply)"></span>
                                         <span v-if="reply.content.length>170" @click="changeIsAll(reply)">
                                           {{reply.isAll?'收起':'全文'}}
                                         </span>
                                     </div>
-                                   <div class="comment-btns">
+                                    <div class="comment-time portal-time">
+                                     <showTime :time="reply.sysCreateTime"></showTime>
+                                     <interactBar :type="10" :shares="false"  :data="reply" @addAnswers="showReply(reply)" :favorites="false" :views="false"  :comments="false" :answers="true"></interactBar>
+                                    </div>
+                                   <!-- <div class="comment-btns"> -->
                                       <!-- <a><svg-icon icon-class="like"></svg-icon><span>66</span></a> -->
-                                      <div v-show="btnsShowRowId==reply.id">
+                                      <!-- <div v-show="btnsShowRowId==reply.id">
                                         <a  @click="showReply(reply)"><svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>回复</span></a>
                                         <a  v-if="userInfo.aid==reply.sysCreateAid" @click="delReply(com,reply,replyIdx)"><svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>删除</span></a>
-                                      </div>
-                                   </div>
+                                      </div> -->
+                                   <!-- </div> -->
                                 </div>
                                 <!--发布回复-->
                                 <div v-if="replyInfo.parentId==reply.id" class="comment-reply" style="padding-bottom: 5px;">
@@ -177,7 +167,7 @@
               <div class="comment" v-for="(reply,rIdx) in replyDiaglog.list" :key="rIdx">
                    <div class="comment-top">
                       <div class="comment-author">
-                          <authorInfo :avatar="reply.avatar" :name="reply.sysCreateBy" :sex="reply.sex"></authorInfo>
+                          <authorInfo :avatar="reply.avatar" :name="reply.sysCreateBy" :sex="reply.sex" :info="reply.orgInfo"></authorInfo>
                           <span style="margin-left: 10px;color: #8590A6;font-size:14px; ">回复</span>
                           <span style="margin-left: 10px; font-size:14px">{{reply.replyName || reply.toAname}}</span>
                       </div>
@@ -244,6 +234,7 @@
 </template>
 <script>
   import showTime from '@/components/Portal/datetimeShow.vue'
+  import interactBar from "@/components/Portal/interactBar.vue";
   import apiComment from '@/api/modules/comments.js'
   import apiUser from '@/api/system/user.js'
   import authorInfo from '@/components/Portal/authorInfo.vue';
@@ -279,7 +270,7 @@
         default:false
       }
   	},
-    components:{showTime,authorInfo},
+    components:{showTime,authorInfo,interactBar},
     computed: {
       ...mapGetters(['userInfo'])
     },
@@ -544,6 +535,7 @@
         item.isAll=!item.isAll;
       },
       showReply(item){
+        console.log("9999999999");
           this.replyInfo.objType=this.objType;
           this.replyInfo.objId=this.objId;
           this.replyInfo.parentId=item.id;
@@ -818,11 +810,18 @@
 		margin-top: 10px;
 		background-color: #FFFFFF;
     padding: 5px 15px;
+    .comment-time{
+      display: flex;
+      justify-content: space-between;
+        margin-top: 10px;
+        color: #666666;
+        font-size: 12px;
+      }
 		.comments-top{
 			display: flex;
 			justify-content: space-between;
 			padding:10px;
-			border-bottom: 1px solid #f4f4f4;
+			// border-bottom: 1px solid #f4f4f4;
 			font-weight: 500;
 			font-size: 1.1em;
       .comments-top-left{
@@ -848,8 +847,7 @@
       }
 		}
     .comments-input{
-      // border-bottom: 1px solid #dddddd;
-      padding: 5px 15px 10px 15px;
+      padding: 20px 15px 10px 15px;
     }
 		.comments-items{
        padding: 5px 15px;
@@ -863,7 +861,7 @@
   .comment{
   	margin-top: 10px;
   	background-color: #FFFFFF;
-    border-bottom: 1px solid #dddddd;
+    // border-bottom: 1px solid #dddddd;
   	.comment-top{
   		display: flex;
   		justify-content: space-between;
@@ -876,10 +874,6 @@
         align-items: center;
       	height: 30px;
         line-height: 30px;
-      }
-      .comment-time{
-        color: #666666;
-        font-size: 12px;
       }
   	}
   	.comment-body{
diff --git a/src/components/Portal/noteComment.vue b/src/components/Portal/noteComment.vue
new file mode 100644
index 00000000..4c916bf2
--- /dev/null
+++ b/src/components/Portal/noteComment.vue
@@ -0,0 +1,845 @@
+<template>
+    <!--笔记组件-->
+    <div class="comments">
+      <div v-if="showTop" class="comments-top">
+            <div class="comments-top-left portal-title-tow" style="font-size: 18px;">{{total}}条笔记 
+                <el-checkbox v-if="objType ==2" class="btn" v-model="value" type="primary">只看作者</el-checkbox>
+                <el-checkbox v-if="objType ==3" class="btn" v-model="value" type="primary">{{'只看案主'}}</el-checkbox>
+                <span v-if="objType ==3" class="anzhu"> @案主可以给他发私信哦</span>
+            </div>
+        </div>
+        <!--列表内容-->
+        <div class="comments-items" v-show="listShow">
+            <!--一个评论-->
+            <div class="zan-wu" v-if="list.length == 0">暂无评论～</div>
+            <div class="comment" v-for="(com,comIdx) in list" :key="com.id">
+                 <div class="comment-top">
+                    <div class="comment-author">
+                        <authorInfo :avatar="com.avatar" :name="com.sysCreateBy" :sex="com.sex" :info="com.orgInfo"></authorInfo>
+                    </div>
+                 </div>
+                 <div class="comment-body" >
+                      <div class="comment-info" @mouseover="showButtons(com.id)" @mouseout="hideButtons()">
+                        <div class="comment-content" @click="cancelReply()">
+                            <span class="portal-summary-text" style="color: #666666;" v-html="displayAll(com)"></span>
+                            <span v-if="com.content.length>170" @click="changeIsAll(com)">
+                              {{com.isAll?'收起':'全文'}}
+                            </span>
+                        </div>
+                        <div class="comment-time portal-time">
+                          <showTime :time="com.sysCreateTime"></showTime>
+                          <interactBar :type="10" :shares="false"  :data="com" @addAnswers="showReply(com)" :favorites="false" :views="false" :comments="false" :answers="true"></interactBar>
+                        </div>
+                        <!-- <div class="comment-btns"> -->
+                          
+                           <!-- <a><svg-icon icon-class="like"></svg-icon><span>66</span></a> -->
+                           <!-- <div v-show="btnsShowRowId==com.id"> -->
+                            
+                             <!-- <a @click="showReply(com)"><svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>回复</span></a> -->
+                             <!--必须当前登录人是一个人-->
+                             <!-- <a v-if="userInfo.aid==com.sysCreateAid" @click="delCommnet(com,comIdx)"><svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>删除</span></a> -->
+                             <!-- <a v-if="com.replyList && com.replyList.length==5" @click="showMoreReply(com)" ><svg-icon icon-class="all" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>全部</span></a> -->
+                           <!-- </div> -->
+                        <!-- </div> -->
+                        <div v-if="replyInfo.parentId==com.id" class="comment-reply" style="padding-bottom: 5px;">
+                          <div style="width:100%;display:flex;">
+                            <div style="flex: 1;">
+                              <el-input class="hideControl" type="textarea" show-word-limit v-model="replyInfo.content"  maxlength="800" placeholder="回复内容..."></el-input>
+                            </div>
+                            <div style="width: 120px;display: flex;justify-content: flex-end;">
+                              <el-button @click="submitReply(com)" type="primary">发布回复</el-button>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <!--回复内容-->
+                      <div v-if="com.replyList && com.replyList.length>0">
+                           <div class="comment" v-for="(reply,replyIdx) in com.replyList" :key="reply.id" :class="replyIdx===com.replyList.length-1 ? 'comment-last' : ''">
+                                <div class="comment-top">
+                                   <div class="comment-author">
+                                     <authorInfo :avatar="reply.avatar" :name="reply.sysCreateBy" :sex="reply.sex" :info="reply.orgInfo"></authorInfo>
+                                     <span style="margin-left: 10px;color: #8590A6;font-size:14px; ">
+                                      <svg-icon style="font-size: 10px;margin-right: 0;" icon-class="triangle"></svg-icon>
+                                    </span>
+                                     <span style="margin-left: 6px;font-size:14px;margin-top:5px" class="portal-title-tow" >{{reply.replyName || reply.toAname}}</span>
+                                   </div>
+                                </div>
+                                <div class="comment-body" @mouseover="showButtons(reply.id)" @mouseout="hideButtons()">
+                                  <div class="comment-info" >
+                                     <div class="comment-content"  @click="cancelReply()">
+                                          <span class="portal-summary-text" style="color: #666666;" v-html="displayAll(reply)"></span>
+                                          <span v-if="reply.content.length>170" @click="changeIsAll(reply)">
+                                            {{reply.isAll?'收起':'全文'}}
+                                          </span>
+                                      </div>
+                                      <div class="comment-time portal-time">
+                                       <showTime :time="reply.sysCreateTime"></showTime>
+                                       <interactBar :type="10" :shares="false"  :data="reply" @addAnswers="showReply(reply)" :favorites="false" :views="false"  :comments="false" :answers="true"></interactBar>
+                                      </div>
+                                     <!-- <div class="comment-btns"> -->
+                                        <!-- <a><svg-icon icon-class="like"></svg-icon><span>66</span></a> -->
+                                        <!-- <div v-show="btnsShowRowId==reply.id">
+                                          <a  @click="showReply(reply)"><svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>回复</span></a>
+                                          <a  v-if="userInfo.aid==reply.sysCreateAid" @click="delReply(com,reply,replyIdx)"><svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>删除</span></a>
+                                        </div> -->
+                                     <!-- </div> -->
+                                  </div>
+                                  <!--发布回复-->
+                                  <div v-if="replyInfo.parentId==reply.id" class="comment-reply" style="padding-bottom: 5px;">
+                                       <div style="width:100%;display:flex;">
+                                          <div style="flex: 1;">
+                                           <el-input show-word-limit class="hideControl" type="textarea" v-model="replyInfo.content"  maxlength="100" placeholder="回复内容..."></el-input>
+                                         </div>
+                                         <div style="width: 120px;display: flex;justify-content: flex-end;">
+                                           <el-button @click="submitReply(com)" type="primary">发布回复</el-button>
+                                         </div>
+                                       </div>
+                                     </div>
+                                </div>
+                           </div>
+                      </div>
+                    </div>
+                 </div>
+        </div>
+        <div class="pagination-div">
+           <!-- v-if="moreState == 1 -->
+            <span class="pag-text" @click="loadMore()" v-if="moreState == 1">加载更多</span>
+            <span class="pag-text-msg" style="font-size:14px;color: #444444;" v-else-if="list.length !== 0 && moreState == 3">没有更多数据了</span>
+        </div>
+        <el-dialog title="全部回复内容" width="60%" :visible.sync="replyDiaglog.show" :close-on-click-modal="false" custom-class="g-dialog">
+            <div style="padding: 10px;max-height: 500px;overflow-y: auto;">
+                <div class="comment" v-for="(reply,rIdx) in replyDiaglog.list" :key="rIdx">
+                     <div class="comment-top">
+                        <div class="comment-author">
+                            <authorInfo :avatar="reply.avatar" :name="reply.sysCreateBy" :sex="reply.sex" :info="reply.orgInfo"></authorInfo>
+                            <span style="margin-left: 10px;color: #8590A6;font-size:14px; ">回复</span>
+                            <span style="margin-left: 10px; font-size:14px">{{reply.replyName || reply.toAname}}</span>
+                        </div>
+                        <div class="comment-time">
+                            <showTime :time="reply.sysCreateTime"></showTime>
+                        </div>
+                     </div>
+                     <div class="comment-body"  @mouseover="showButtons(reply.id)" @mouseout="hideButtons()">
+                          <div class="comment-info">
+                            <div class="comment-content">{{reply.content}}</div>
+                            <div class="comment-btns"><!--操作还没有加-->
+                                <div v-show="btnsShowRowId==reply.id">
+                                  <a  @click="showDlgReply(reply)"><svg-icon icon-class="comment" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>回复</span></a>
+                                  <a  v-if="userInfo.aid==reply.sysCreateAid" @click="delDlgReply(reply,rIdx)"><svg-icon icon-class="remove" style="margin-right: 0px;font-size: 16px;"></svg-icon><span>删除</span></a>
+                                </div>
+                            </div>
+                          </div>
+                          <!--发布回复-->
+                          <div v-if="replyInfo.parentId==reply.id" class="comment-reply" style="padding-bottom: 5px;">
+                           <div style="width:100%;display:flex;">
+                              <div style="flex: 1;">
+                               <el-input show-word-limit class="hideControl" type="textarea" v-model="replyInfo.content"  maxlength="100" placeholder="回复内容..."></el-input>
+                             </div>
+                             <div style="width: 120px;display: flex;justify-content: flex-end;">
+                               <el-button @click="submitDlgReply(com)" type="primary">发布回复</el-button>
+                             </div>
+                           </div>
+                         </div>
+                    </div>
+                </div>
+                <div  style="padding: 20px 10px;text-align: center;">
+                    <div v-if="replyDiaglog.pages>replyDiaglog.pageIndex">
+                      <span class="pag-text" @click="loadMoreReply()">加载更多</span>
+                    </div>
+                    <div v-else >
+                      <span class="pag-text-msg">没有更多数据了</span>
+                    </div>
+                </div>
+            </div>
+            <span slot="footer" class="dialog-footer">
+              <el-button @click="replyDiaglog.show= false"> 关 闭 </el-button>
+            </span>
+        </el-dialog>
+    </div>
+  </template>
+  <script>
+    import showTime from '@/components/Portal/datetimeShow.vue'
+    import interactBar from "@/components/Portal/interactBar.vue";
+    import apiComment from '@/api/modules/comments.js'
+    import apiUser from '@/api/system/user.js'
+    import authorInfo from '@/components/Portal/authorInfo.vue';
+    // import author from '@/components/Portal/author.vue';
+    import { mapGetters } from 'vuex';
+    export default {
+        props:{
+            showTop:{
+                type:Boolean,
+                default:true
+            },
+        authorId:{
+          type:String,
+        },
+        objId:{
+          type:String,
+          required:true
+        },
+        objType:{
+          type:Number,
+          required:true
+        },
+        objTitle:{
+          type:String,
+          default:''
+        },
+        toUsers:{
+          type:Array,
+        },
+  
+        readonly:{
+          type:Boolean,
+          default:false
+        }
+        },
+      components:{showTime,authorInfo,interactBar},
+      computed: {
+        ...mapGetters(['userInfo'])
+      },
+        data() {
+            return {
+          radio:1,
+          value:false,
+          sex:null,
+          author:'',
+          moreState:1,
+          isAuthor: false,
+          authorList:[],//当前页面存储的用户信息，如果已经存在就不再重新请求了
+          toUserId: '',
+            loadStatus:'more',//more,loading,noMore
+                pageSize:10,
+                pageIndex:1,
+          total:0,
+          listShow:true,
+                inputValue:'',
+                list:[],
+                replyParent:{},
+          replyShow:false,
+          btnsShowRowId:'',
+          replyInfo:{
+            clevel:2,
+            parentId:'',
+            replyAid:'',
+            commentId:'',
+            replyName:'',
+            objType:'',
+            objId:'',
+            content:''
+          },
+          replyDiaglog:{
+            show:false,
+            pageIndex:1,
+            pageSize:8,
+            pages:1,
+            count:0,
+            commentId:'',
+            list:[]
+          },
+          toUserDig:{
+            show:false,
+            name:'',
+            chooseUserId:'',
+            chooseUserName:'',
+            list:[]
+          },
+          visible:false,
+            }
+        },
+      watch:{
+        value(newVal,oldVal){
+          if(newVal){
+            this.author = this.authorId;
+          } else {
+            this.author = '';
+          }
+          this.loadData();
+        },
+        radio(newVal){
+          if(newVal == 2){
+            this.author = this.authorId;
+          } else {
+            this.author = '';
+          }
+          this.loadData();
+        },
+        inputValue(val,oldVal) {
+         let fu = val.substr(-1);
+         if(fu == '@'&&!oldVal) {
+           this.toUserId = '';
+            if(this.toUsers.length == 1 && this.toUsers.length !== 0) {
+              this.toUserDig.chooseUserId = this.toUsers[0].aid;
+              this.toUserDig.chooseUserName=this.toUsers[0].name;
+              this.inputValue+=this.toUsers[0].name;
+            }else {
+              this.$refs.tag.$el.click();
+            }
+         }
+        }
+      },
+      mounted() {
+        this.author = this.authorId;
+        this.loadData(false);
+        //在中文输入法状态下输入光标不在文字最后，同时会被遮挡两个文字大小的长度
+        // let vm=document.querySelector('.hideControl input')
+        // vm.addEventListener('compositionstart',(e)=>{
+        // vm.style.padding='0 63px 0 0'
+        // vm.size=100
+        //以上两种方式都未解决
+        // })
+      },
+        methods: {
+        loadMore() {
+          this.pageIndex +=1;
+          this.loadData(true);
+        },
+        // lookYourself() {// 只看作者
+        // this.pageIndex =1;
+        // this.isAuthor = !this.isAuthor;
+        // if(this.isAuthor){
+        //   this.author = this.authorId;
+        // } else{
+        //    this.author = '';
+        // }
+        //   this.loadData();
+        // },
+        loadAuthorInfo(list,ids){ //加载作者信息，头像，机构信息
+        // console.log(list,ids)
+          if(ids.length==0){
+            return;
+          }
+          const noReapetIds=[...new Set(ids)]
+          apiUser.getByIds(ids).then(res=>{
+            if(res.status==200){
+              list.forEach((item,index)=>{
+                res.result.some(author=>{
+                  if(author.aid==item.sysCreateAid){
+                    item.avatar=author.avatar;
+                    item.orgInfo=author.orgInfo;
+                    item.sex=author.sex;
+                    return true;
+                  }else{
+                    return false;
+                  }
+                })
+              });
+            }else{
+              console.log('加载用户头像信息:'+res.error);
+              //this.$message.error(res.message);
+            }
+          });
+        },
+        // cancelTeacher() {
+        //   this.inputValue =  this.inputValue.substr(0,  this.inputValue.length -1);
+        //   this.visible = false;
+        // },
+        confirmTeacher() {
+           this.toUserDig.chooseUserId = this.toUserId;
+           this.toUsers.forEach(item=>{
+             if(item.aid == this.toUserId) {
+                this.toUserDig.chooseUserName=item.name;
+                this.inputValue+=item.name;
+             }
+           })
+         this.visible = false;
+        },
+        loadData(append){
+          let params={
+            pageIndex:this.pageIndex,
+            pageSize:this.pageSize,
+            type:this.objType,
+            id:this.objId,
+            author: this.author,
+          }
+          let $this=this;
+          apiComment.pageQuery(params).then(res=>{
+              if(res.status==200){
+                let ids=[];
+                let allList=[];
+                res.result.list.forEach(item=>{
+                  item.avatar='';
+                  item.orgInfo='';
+                  item.isAll=false;
+                  //item.sex=null;
+                  allList.push(item);
+                  ids.push(item.sysCreateAid);
+                  if(item.replyList && item.replyList!=''){
+                      item.replyList.forEach(reply=>{
+                        reply.avatar='';
+                        reply.orgInfo='';
+                        reply.sex=null;
+                        reply.isAll=false;
+                        allList.push(reply);
+                        ids.push(reply.sysCreateAid);
+                      })
+                  }
+                });
+                this.loadAuthorInfo(allList,ids);
+                this.total=res.result.count;
+                if(append){
+                  res.result.list.forEach(item=>{
+                    $this.list.push(item);
+                  });
+                }else{
+                  $this.list=res.result.list;
+                }
+                if($this.list.length == this.total) {
+                  this.moreState = 3;
+                }
+                this.$emit('writeTotal',this.total);
+              }else{
+                this.$message.error(res.message);
+              }
+          });
+        },
+        showList(flag){
+          this.listShow=flag;
+        },
+        submit(){
+          if(this.inputValue.trim()!=''){
+            let cdata={
+              objType:this.objType,
+              objId:this.objId,
+              parentId:'-1',
+              content:this.inputValue.trim(),
+              clevel:1,
+              toAid:'',
+              toAname:'',
+            }
+            if(this.toUserDig.chooseUserId!=='' && this.toUserDig.chooseUserName!=''){
+              cdata.toAid=this.toUserDig.chooseUserId;
+              cdata.toAname=this.toUserDig.chooseUserName;
+  
+            }
+  
+            apiComment.add(cdata).then(res=>{
+              if(res.status==200){
+                  // this.list.unshift(res.result);
+                  // this.sex =
+                  res.result.sex=null;
+                  res.result.isAll=false;
+                  this.list.unshift(res.result);
+                  this.loadAuthorInfo([res.result],[res.result.sysCreateAid]);
+                  this.$message.success('发布成功');
+                  //
+  
+                  this.total++;
+                  this.$emit('success',res.result);
+                  this.inputValue='';
+                  this.toUserDig.chooseUserId='';
+                  this.toUserDig.chooseUserName='';
+              }else{
+                  this.$message.error(res.message);
+              }
+            });
+  
+          }
+  
+        },
+        showButtons(id){
+          if(!this.readonly){
+            this.btnsShowRowId=id;
+          }
+        },
+        hideButtons(){
+          this.btnsShowRowId='';
+        },
+        //展示全部
+        displayAll(item) {
+          let content = '';
+          content = item.content.replace(/(\n){2,}/,'<br>');
+          item.content = content;
+          if(!item.isAll && item.content && item.content.length > 170) {
+              return item.content.slice(0, 170) + "...";
+          }
+          return item.content;
+        },
+        changeIsAll(item) {
+          item.isAll=!item.isAll;
+        },
+        showReply(item){
+          console.log("9999999999");
+            this.replyInfo.objType=this.objType;
+            this.replyInfo.objId=this.objId;
+            this.replyInfo.parentId=item.id;
+            this.replyInfo.replyAid=item.sysCreateAid;
+            this.replyInfo.replyName=item.sysCreateBy;
+            this.replyShow=true;
+        },
+        cancelReply(){
+          this.replyInfo.parentId='';
+        },
+        submitReply(comment){
+          this.replyInfo.content = this.replyInfo.content.trim();
+          if(this.replyInfo.content==''){
+            return;
+          }
+          this.replyInfo.content=this.replyInfo.content.replace(/^\s*|\s*$/g,"");
+          if(this.replyInfo.content==''){
+            return;
+          }
+          this.replyInfo.commentId=comment.id;
+          if(comment.replyList==''){
+            comment.replyList=[];
+          }
+          apiComment.reply(this.replyInfo).then(res=>{
+             if(res.status==200){
+                res.result.sex = null;
+                res.result.isAll=false;
+                this.loadAuthorInfo([res.result],[res.result.sysCreateAid]);
+                comment.replyList.push(res.result);
+                this.replyInfo.parentId='';
+                this.replyInfo.content='';
+                this.$message.success("发布成功");
+             }else{
+                this.$message.error(res.message);
+             }
+          });
+        },
+        delCommnet(com,idx){
+          if(com.replyList!='' && com.replyList.length>0){
+            this.$message.error('有回复的评论不能删除');
+            return;
+          }
+          this.$confirm('您确定要删除所选评论吗?', '删除提示', {
+                    confirmButtonText: '确定',
+                    cancelButtonText: '取消',
+                    type: 'warning'
+                  }).then(() => {
+                      apiComment.del(com.id,this.userInfo.aid).then(res=>{
+                            if(res.status==200){
+                               this.list.splice(idx,1);
+                               this.total--;
+                               this.$message.success("删除成功");
+                               this.$emit('delSuccess');
+                            }else{
+                               this.$message.error(res.message);
+                            }
+                      });
+                  });
+  
+  
+        },
+        delReply(com,re,idx){
+          // if(com.replyList!='' && com.replyList.length>0){
+          //   this.$message.error('有回复的评论不能删除');
+          // }
+          let params={
+            id:re.id,
+            user:this.userInfo.aid,
+            pid:re.parentId
+          }
+          this.$confirm('您确定要删除所选评论吗?', '删除提示', {
+                    confirmButtonText: '确定',
+                    cancelButtonText: '取消',
+                    type: 'warning'
+                  }).then(() => {
+                      apiComment.delReply(params).then(res=>{
+                         if(res.status==200){
+                            com.replyList.splice(idx,1);
+                            this.$message.success("删除成功");
+                         }else{
+                            this.$message.error(res.message);
+                         }
+                  });
+          })
+        },
+        delDlgReply(re,idx){ //弹出窗口中的删除操作
+          let params={
+            id:re.id,
+            user:this.userInfo.aid,
+            pid:re.parentId
+          }
+          let $this=this;
+          this.$confirm('您确定要删除所选评论吗?', '删除提示', {
+                    confirmButtonText: '确定',
+                    cancelButtonText: '取消',
+                    type: 'warning'
+                  }).then(() => {
+                      apiComment.delReply(params).then(res=>{
+                         if(res.status==200){
+                            $this.replyDiaglog.list.splice(idx,1);
+                            $this.$message.success("删除成功");
+                         }else{
+                            $this.$message.error(res.message);
+                         }
+                  }).catch(()=>{
+  
+                  })
+          })
+        },
+        showDlgReply(item){
+          this.replyInfo.objType=this.objType;
+          this.replyInfo.objId=this.objId;
+          this.replyInfo.parentId=item.id;
+          this.replyInfo.replyAid=item.sysCreateAid;
+          this.replyInfo.replyName=item.sysCreateBy;
+          this.replyShow=true;
+        },
+        submitDlgReply(){
+            this.replyInfo.content = this.replyInfo.content.trim();
+            if(this.replyInfo.content==''){
+              return;
+            }
+            this.replyInfo.content=this.replyInfo.content.replace(/^\s*|\s*$/g,"");
+            if(this.replyInfo.content==''){
+              return;
+            }
+            this.replyInfo.commentId=this.replyDiaglog.commentId;
+  
+            apiComment.reply(this.replyInfo).then(res=>{
+               if(res.status==200){
+                  res.result.sex = null;
+                  res.result.isAll=false;
+                  this.loadAuthorInfo([res.result],[res.result.sysCreateAid]);
+                  this.replyDiaglog.list.push(res.result);
+                  this.replyInfo.parentId='';
+                  this.replyInfo.content='';
+                  this.$message.success("发布成功");
+               }else{
+                  this.$message.error(res.message);
+               }
+            });
+        },
+        showMoreReply(comment){
+          this.replyDiaglog.pages=1;
+          this.replyDiaglog.count=0;
+          this.replyDiaglog.pageIndex=1;
+          this.replyDiaglog.list=[];
+          this.replyDiaglog.show=true;
+          this.replyDiaglog.commentId=comment.id;
+          this.loadAllReplyData(false);
+        },
+        loadMoreReply(){
+          this.replyDiaglog.pageIndex++;
+          this.loadAllReplyData(true);
+        },
+        loadAllReplyData(append){
+          let params={
+            pageIndex:this.replyDiaglog.pageIndex,
+            pageSize:this.replyDiaglog.pageSize,
+            type:this.objType,
+            commentId:this.replyDiaglog.commentId
+          }
+          let $this=this;
+          apiComment.replyList(params).then(rs=>{
+            if(rs.status==200){
+              $this.replyDiaglog.count=rs.result.count;
+              $this.replyDiaglog.pages=rs.result.totalPages;
+              let ids=[];
+              if(append){
+                rs.result.list.forEach(item=>{
+                  item.avatar='';
+                  ids.push(item.sysCreateAid);
+                  $this.replyDiaglog.list.push(item);
+                })
+              }else{
+                rs.result.list.forEach(item=>{
+                  item.avatar='';
+                  ids.push(item.sysCreateAid);
+                })
+                $this.replyDiaglog.list=rs.result.list;
+              }
+              this.loadAuthorInfo(rs.result.list,ids);
+            }else{
+              this.$message.error(rs.message);
+            }
+          })
+        },
+        showToUser(){
+            this.toUserDig.show=true;
+            this.toUserDig.chooseUserId='';
+            this.toUserDig.chooseUserName='';
+        },
+        findUserKeyupEnter(){
+          this.findUser();
+        },
+        findUser(){
+            this.toUserDig.list=[];
+            var name=this.toUserDig.name;
+            if(name==''){
+              return;
+            }
+            apiUser.findByName(name).then(rs=>{
+               if(rs.status==200){
+                 this.toUserDig.list=rs.result;
+               }else{
+                 this.$message.error('查询用户失败');
+               }
+            })
+  
+        },
+        confirmUser(u){
+          this.toUserDig.chooseUserId=u.aid;
+          this.toUserDig.chooseUserName=u.name;
+          this.toUserDig.show=false;
+          this.toUserDig.name='';
+        }
+        }
+    }
+  </script>
+  
+  <style lang="scss" scoped>
+  .anzhu{
+    font-size: 14px;
+    color: #999;
+  }
+  ::v-deep .el-input--medium .el-input__inner {
+    height: 48px;
+  }
+  
+   ::v-deep .at-min{
+      .el-popper[x-placement^=bottom] {
+        // left: 0 !important;
+        // bottom: 0 !important;
+        margin-left: 30px !important;
+      }
+      .el-popover{
+  
+      }
+  }
+  .tag-block{
+     top:0;
+     left: 0;
+      position: absolute;
+      background-color: #fff;
+      border-color: #fff;
+  
+      height: 1px;
+  }
+  .pag-text{
+    border: 1px solid #292828;
+    padding: 10px 20px;
+    border-radius: 20px;
+    background: #fff;
+    cursor: pointer;
+  }
+  .reference-tag{
+    display: block;
+    // width: 100%;
+    .el-radio-button__inner{
+         border: 1px solid #fff !important;
+    }
+  
+  }
+    .svg-btn{
+      font-size: 30px;
+      line-height: 30px;
+      margin-right: 20px;
+      cursor: pointer;
+      margin-top: 5px;
+    }
+    .comments{
+          margin-top: 10px;
+          background-color: #FFFFFF;
+      padding: 5px 15px;
+      .comment-time{
+        display: flex;
+        justify-content: space-between;
+          margin-top: 10px;
+          color: #666666;
+          font-size: 12px;
+        }
+          .comments-top{
+              display: flex;
+              justify-content: space-between;
+              padding:10px;
+              // border-bottom: 1px solid #f4f4f4;
+              font-weight: 500;
+              font-size: 1.1em;
+        .comments-top-left{
+          .btn{
+            // width: 68px;
+            // height: 32px;
+            // background: #3C7EFF;
+            border-radius: 6px;
+            font-size: 12px;
+            padding: 10px;
+            margin-left: 24px;
+           ::v-deep .el-radio__inner{
+              border-radius: 0 !important;
+            }
+          }
+        }
+        .comments-top-center{
+  
+        }
+        .comments-top-right{
+            color: #6b6b6b;
+            cursor: pointer;
+        }
+          }
+      .comments-input{
+        padding: 20px 15px 10px 15px;
+      }
+          .comments-items{
+         padding: 5px 15px;
+         .zan-wu{
+           text-align: center;
+           font-size: 18px;
+           color: #6666;
+         }
+          }
+      }
+    .comment{
+        margin-top: 10px;
+        background-color: #FFFFFF;
+      // border-bottom: 1px solid #dddddd;
+        .comment-top{
+            display: flex;
+            justify-content: space-between;
+            padding-bottom:10px;
+            font-weight: 500;
+        line-height: 30px;
+            font-size: 1.1em;
+        .comment-author{
+          display: flex;
+          align-items: center;
+            height: 30px;
+          line-height: 30px;
+        }
+        }
+        .comment-body{
+            padding-left: 40px;
+        .comment-content{
+            padding-bottom: 0px;
+            white-space: pre-wrap;
+            word-break:break-all;
+            span {
+              color: #409eff;
+              cursor: pointer;
+              margin-left: 5px;
+            }
+        }
+        .comment-btns{
+          // padding: 5px 10px 10px 0px;
+          height: 35px;
+          line-height: 35px;
+          a{
+            margin-right:15px;
+            span{
+              margin-left: 6px;
+              color: #8590A6;
+              font-size: 14px;
+            }
+          }
+        }
+        }
+      .comment-replys{
+        padding-left: 40px;
+      }
+    }
+  .comment-last{
+    border-bottom: none;
+  }
+  ::v-deep .hideControl{
+    .el-input__count{
+    }
+    .el-textarea__inner{
+      padding-right: 50px;
+    }
+  }
+  </style>
+  
\ No newline at end of file
diff --git a/src/icons/svg/triangle.svg b/src/icons/svg/triangle.svg
new file mode 100644
index 00000000..bb6a6f57
--- /dev/null
+++ b/src/icons/svg/triangle.svg
@@ -0,0 +1 @@
+<svg t="1663322082653" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2441" width="200" height="200"><path d="M204.58705 951.162088 204.58705 72.836889 819.41295 511.998977Z" p-id="2442" fill="#666666"></path></svg>
\ No newline at end of file
diff --git a/src/views/study/coursenew.vue b/src/views/study/coursenew.vue
index a9d2dbad..7dcafdc5 100644
--- a/src/views/study/coursenew.vue
+++ b/src/views/study/coursenew.vue
@@ -110,14 +110,15 @@
                     <div @click="coutab" :class="courestab == true? 'coureactive' : ''">课程评论<span class=""></span> </div>
                     <div @click="coutab" :class="courestab == false? 'coureactive' : ''">课程笔记<span class=""></span> </div>
                 </div>
-                <div v-if="courestab" class="coures-comments" style="margin-left:17px">
+                <div v-show="courestab" class="coures-comments" style="margin-left:17px">
                    <comments v-if="courseInfo.id && courseInfo.id != ''" :obj-type="1" :obj-id="courseInfo.id" :toUsers="toUsers"></comments>
                 </div>
-                <div v-else class="coures-note">
-                   <div class="note-tole">33条笔记</div>
+                <div v-show="!courestab" class="coures-note">
+                  <note-comments v-if="courseInfo.id && courseInfo.id != ''" :obj-type="1" :obj-id="courseInfo.id"></note-comments>
+                   <!-- <div class="note-tole">33条笔记</div>
                    <div class="note-info">
                       
-                   </div>
+                   </div> -->
                 </div>
                
             </div>
@@ -190,6 +191,7 @@
 import { mapGetters } from 'vuex';
 import portalHeader from "@/components/PortalHeader.vue";
 import comments from "@/components/Portal/comments.vue";
+import noteComments from "@/components/Portal/noteComment.vue";
 import interactBar from "@/components/Portal/interactBar.vue";
 import audioPlayer from '@/components/AudioPlayer/index.vue';
 import videoPlayer from '@/components/VideoPlayer/index.vue';
@@ -214,7 +216,7 @@ import assess from '@/components/Course/assess';
 import myNote from '../../components/Course/myNote.vue';
 export default {
   name: "atticle",
-  components: {courseImage, portalHeader, hyperLink, comments, homework, exam, interactBar, assess, pdfPreview, audioPlayer, videoPlayer,myNote },
+  components: {courseImage, portalHeader, hyperLink, comments, homework, exam, interactBar, assess, pdfPreview, audioPlayer, videoPlayer,myNote,noteComments },
   data(){
       return{
         notePlay:null,
@@ -1068,8 +1070,8 @@ export default {
 }
 .coures-note{
     min-height: 500px;
-    padding-left: 50px;
-    padding-top: 25px;
+    padding-left: 17px;
+    padding-top: 10px;
     .note-tole{
       color: #333333;
       font-size: 18px;
@@ -1090,11 +1092,12 @@ export default {
     margin-left: 47px;
     div{
         flex: 1;
-        color: #666666;
+        color: #333333;
         font-size: 18px;
     }
     .coureactive{
         color: #333333;
+        font-weight: 600;
         position: relative;
         span{
             display: inline-block;