diff --git a/src/api/utils.js b/src/api/utils.js
index a0938ce..7ee58e6 100644
--- a/src/api/utils.js
+++ b/src/api/utils.js
@@ -21,7 +21,7 @@ export function useUserInfo(id) {
     watch(id, () => {
         id.value && boeRequest(GET_USER_LIST, {id: id.value}).then(res => {
             userInfo.value = res.result.userInfoList[0]
-            userInfo.value.avatar = userInfo.value.avatar?userInfo.value.avatar:'/800e23f7-b58c-4192-820d-0c6a2b7544cc.png'
+            userInfo.value.avatar = userInfo.value.avatar?userInfo.value.avatar.includes('upload')?userInfo.value.avatar:'/upload'+userInfo.value.avatar:'/800e23f7-b58c-4192-820d-0c6a2b7544cc.png'
         })
     })
     return userInfo
diff --git a/src/views/faceteach/FaceTeachSignUp.vue b/src/views/faceteach/FaceTeachSignUp.vue
index b2b30dc..71042d3 100644
--- a/src/views/faceteach/FaceTeachSignUp.vue
+++ b/src/views/faceteach/FaceTeachSignUp.vue
@@ -63,10 +63,205 @@
                 <div style="padding:20px;" class="content" v-html="data.offcourseDto?.outline"></div>
               </div>
             </el-tab-pane>
-            <!-- <el-tab-pane label="课程评论" name="third" :disabed=dayjs().isBefore(dayjs(data.planDto.beginTime))>
+            <el-tab-pane label="课程评论" name="third" :disabed=dayjs().isBefore(dayjs(data.planDto.beginTime))>
+              <div class="bascinfor">
+                <div class="inputone">
+                  <el-input
+                    ref="refInput"
+                    v-model="disComment.content"
+                    :autosize="{ minRows: 5, maxRows: 5 }"
+                    resize="none"
+                    maxlength="100"
+                    type="textarea"
+                    placeholder="写评论~"
+                  />
+                  <div class="words">{{ disComment.content.length }}/100</div>
+                  <div class="upload">
+                    <div style="display: flex">
+                      <div
+                        class="allimg"
+                        v-for="(img, i) in fileListComment"
+                        :key="i"
+                      >
+                        <div
+                          class="imgone"
+                          :style="{
+                            backgroundImage: `url('${img.url}')`,
+                            marginLeft: '15px',
+                          }"
+                        ></div>
+                        <div class="cha" @click="removeCommentImg(i)"></div>
+                      </div>
+                    </div>
+                    <div class="uploadAnd">
+                      <div v-if="3>5" class="btnone clearfix">
+                        <UploadPostImg v-model="commentSubmitFileList" @fileUploadValue="uploadBack">
+                          <button class="btwwo">
+                            <img class="image" src="../../assets/image/uploadimg.png" />
+                            <div class="shangchuan">上传图片</div>
+                          </button>
+                        </UploadPostImg>
+                      </div>
 
-            </el-tab-pane> -->
-            <el-tab-pane label="材料下载" name="third" >
+                      <button class="btntwo" @click="submitComment" v-loading="submitLoading">发表评论</button>
+                    </div>
+                  </div>
+
+                  <div class="thinline"></div>
+                  <div class="bottom">
+                    <div v-for="(row, i) in commontList" :key="i" style="margin-bottom: 24px;">
+                      <div class="header">
+                        <img :src="row.studentAvatar" alt="" srcset="" class="avator">
+                        <div class="id">{{ row.createName }}</div>
+                        <div class="showCareer">{{row.studentJobName}}</div>
+                        <div class="idThink"></div>
+                      </div>
+                      <div class="discuss clearfix">
+                        <div class="discussmain clearfix">
+                          <div class="talkmain">
+                            {{ row.content }}
+                          </div>
+                        </div>
+                        <div style="display:flex;margin-top: 12px;margin-bottom: 12px;">
+                          <div v-if="row.img" v-for="(rowimg, index) in row.img.split(',')" :key="index" style="width:55px;height:55px;margin-right: 12px;">
+                            <img class="image" style="width:55px;height:55px;border-radius: 4px;" :src="rowimg"  />
+                          </div>
+                        </div>
+                        <div class="intime">{{ row.ctime }}</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>
+                            <!--                  <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-dianzan"
+                              :style="{ color: row.praised ? '#2478ff' : '#b3bdc4' }"></span>
+                            <div class="count" :style="{color:row.praised ? '#2478ff' : '#b3bdc4'}">{{ row.praiseNum || 0 }}</div>
+                          </div>
+                        </div>
+                        <!-- 评论下的回复  -->
+                        <div v-if="row.children.length!==0" :style="{height:spreadReply==i ? 'auto' : 210 +'px',overflow:'hidden',position: 'relative'}">
+                          <div v-for="(replay, j) in row.children" :key="j">
+                            <div class="reply">
+                              <img :src="replay.studentAvatar" alt="" srcset="" class="sameava avaone">
+                              <div class="sameuser">{{ replay.studentName }}</div>
+                              <div class="centerreply">回复</div>
+                              <img :src="replay.targetStudentAvatar" alt="" srcset="" class="sameava avaone">
+                              <div class="sameuser">{{ replay.targetStudentName }}</div>
+                              <div class="replytime">{{ replay.createTime }}</div>
+                            </div>
+                            <div style="display:flex;margin-top: 12px;margin-bottom: 12px;">
+                              <div v-if="replay.img" v-for="(rowimg, index) in replay.img.split(',')" :key="index" style="width:65px;height:65px;margin-right: 7px;">
+                                <img class="image" style="width:65px;height:65px;border-radius: 4px;" :src="rowimg"  />
+                              </div>
+                            </div>
+                            <div class="mainreply">
+                              <div class="replydetail">
+                                {{ 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.commentNum }}</div>-->
+                              </div>
+                              <div
+                                style="display: flex; cursor: pointer; align-items: baseline;margin-left: 19px;"
+                                @click="commentLike(replay)">
+                                <span
+                                  class="iconfont icon-dianzan"
+                                  :style="{ color: replay.praised ? '#2478ff' : '#b3bdc4' }"></span>
+                                <div class="count" :style="{color:replay.praised ? '#2478ff' : '#b3bdc4'}">{{ replay.praiseNum || 0 }}</div>
+                              </div>
+                            </div>
+                          </div>
+                          <!-- 查看更多 -->
+                          <div style="display: flex;justify-content: center;align-items: center;position:absolute;bottom:0px;cursor: pointer;width:100%">
+                              <span 
+                                @click="lookMore(i)"
+                                style="font-size: 14px;color: #2478ff;">{{ i==spreadReply ? '收起' : '查看更多' }}</span>
+                            </div>
+                        </div>
+                      </div>
+                    </div>
+
+                    <!-- 回复分页 -->
+                    <div style="display:flex;justify-content:center;align-items:center;margin-top:36px;margin-bottom:36px;">
+                      <!-- 分页 -->
+                      <el-pagination
+                        v-model:current-page="hfPage.currentPage"
+                        :page-size="hfPage.pageSize"
+                        :small="small"
+                        layout="prev, pager, next, jumper"
+                        :total="hfPage.total"
+                        @current-change="handleCurrentChange"
+                      />
+                    </div>
+
+                    <div
+                      class="discuss clearfix"
+                      v-if="commontList && commontList.length">
+                      <div class="inreply">
+                        <el-input
+                          v-model="replayComment.content"
+                          :autosize="{ minRows: 5, maxRows: 5 }"
+                          resize="none"
+                          maxlength="100"
+                          type="textarea"
+                          :placeholder="replayComment.placeholder"
+                        />
+                        <div class="words">{{ replayComment.content.length }}/100</div>
+                        <div class="upload">
+                          <div style="display: flex">
+                            <div class="allimg" v-for="(img, i) in fileListCommentRelpay" :key="i">
+                              <div
+                                class="imgone"
+                                :style="{
+                                  backgroundImage: `url('${img.url}')`,
+                                  marginLeft: '15px',
+                                }"
+                              ></div>
+                              <div class="cha" @click="removeImg(i)"></div>
+                            </div>
+                          </div>
+                          <datagrid  class="uploadAnd">
+                            <UploadPostImg v-if="3>5" v-model="fileListCommentRelpay" @fileUploadValue="uploadReplyBack">
+                              <button class="btnone clearfix">
+                                <img
+                                  class="image"
+                                  src="../../assets/image/uploadimg.png"
+                                />
+                                <div class="shangchuan">上传图片</div>
+                              </button>
+                            </UploadPostImg>
+                            <button class="btntwo" @click="submitReplayComment" style="top:206px;" v-loading="submitReplayLoading">
+                              回复
+                            </button>
+                          </datagrid>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+
+                  
+                </div>
+              </div>
+            </el-tab-pane>
+            <el-tab-pane label="材料下载" name="four" >
               <div v-if="data.offcourseDto?.attach == ''"
                    style="font-size: 14px;font-weight: 400; line-height: 24px; cursor: pointer;margin-left: 40px; margin-top: 20px;">
                 此课程无附件
@@ -121,12 +316,18 @@
 </template>
 
 <script setup>
-import {computed, reactive, toRefs, watch, onUnmounted} from "vue";
+import {computed, reactive, toRefs, watch, onUnmounted, ref} from "vue";
 import FileTypeImg from "@/components/FileTypeImg.vue";
 import {request, useRequest} from "@/api/request";
 import {
   STU_OFFCOURSE_DETAIL,
-  FACETEACH_SIGNUP
+  FACETEACH_SIGNUP,
+
+  COMMENT_ADD,
+  COMMENT_LIST,
+  COMMENT_PRAISE,
+  PostPraise,
+  PostDetails,
 } from "@/api/api";
 import {useRoute, useRouter} from "vue-router";
 import {useUserInfo} from "@/api/utils";
@@ -165,6 +366,179 @@ const downloads = (url) => {
 };
 let timer = null;
 
+
+// 查看更多-展开回复列表
+function lookMore(i) {
+  i == spreadReply.value  ? spreadReply.value  = -1 : spreadReply.value  = i;
+}
+
+// 获取评论数据
+const hfPage = ref({
+  currentPage: 1,
+  pageNo: 1,
+  pageSize: 10,
+  total: 0
+})
+const disComment = ref({
+  content: "",
+});
+// 获取数据
+const getData = () => {
+  // 获取面授课下的评论
+  request(COMMENT_LIST, {
+      id: courseId,
+      type: 2,
+      pageNo:hfPage.value.currentPage,
+      pageSize:10
+    }).then(res=>{
+      console.log('我是获取当前帖子的评论', res)
+      commontList.value = res.data.records;
+      hfPage.value.total = Number(res.data.total);
+      submitLoading.value = false;
+      submitReplayLoading.value = false;
+      clearText()
+    }).catch(err=>{
+      console.log(err)
+      submitLoading.value = false;
+      submitReplayLoading.value = false;
+    })
+}
+
+// 回复分页
+function handleCurrentChange(e, k) {
+  console.log('分页打印', e, k)
+  hfPage.value.currentPage = e;
+  hfPage.value.pageNo = e;
+  getData();
+}
+
+
+getData()
+
+const disDetail = ref({});
+const commontList = ref([]);
+const spreadReply = ref(-1);
+const replayComment = ref({
+  placeholder: "",
+  content: "",
+  pid: "",
+});
+
+// 清空回复及评论输入框
+const clearText = () => {
+  disComment.value.content = "";
+  fileListComment.value = [];
+  fileListCommentRelpay.value = []; 
+  replayComment.value.content = "";
+}
+
+// 评论图片展示数组
+const fileListComment = ref([]);
+// 回复图片展示数组
+const fileListCommentRelpay = ref([]);
+
+// 上传图片成功返回的URL
+const uploadBack = (e) => {
+  console.log('--------->', e)
+  fileListComment.value.push(e)
+}
+
+const uploadReplyBack = (e) => {
+  console.log('--------->', e)
+  fileListCommentRelpay.value.push(e)
+}
+
+function removeImg(i) {
+  fileListCommentRelpay.value.splice(i, 1);
+}
+
+function removeCommentImg(i) {
+  fileListComment.value.splice(i, 1);
+}
+
+function commentLike(obj) {
+  obj.praised ? (obj.praiseNum = Number(obj.praiseNum) - 1) : (obj.praiseNum =  Number(obj.praiseNum) + 1);
+  obj.praised = !obj.praised;
+  request(COMMENT_PRAISE, { targetId: obj.id, type: 1 });
+}
+
+function commentComment(obj) {
+  console.log(obj)
+  replayComment.value.placeholder = "@ " + obj.createName;
+  replayComment.value.pid = obj.id;
+}
+
+
+const submitLoading = ref(false);
+
+// 提交评论
+function submitComment() {
+  if(disComment.value.content==""){
+    ElMessage.error(`请输入评论内容`);
+    return
+  }
+  if(submitLoading.value){
+    ElMessage.error(`请勿频繁点击`)
+    return
+  }
+  submitLoading.value = true;
+  console.table('面授课评论参数',{
+    id: courseId,
+    targetId: courseId,
+    content: disComment.value.content,
+    type: 2,
+  })
+  
+  request(COMMENT_ADD, {
+    id: courseId,
+    targetId: courseId,
+    content: disComment.value.content,
+    type: 2,
+  }).then((res) => {
+    console.log(res)
+    getData();
+  }).catch(err=>{
+    submitLoading.value = false;
+    console.log(err)
+  });
+}
+
+const submitReplayLoading = ref(false);
+
+// 回复评论
+function submitReplayComment() {
+  if(replayComment.value.content==""){
+    ElMessage.error(`请输入回复内容`);
+    return
+  }
+  if(submitReplayLoading.value){
+    ElMessage.error(`请勿频繁点击`)
+    return
+  }
+  submitReplayLoading.value = true;
+  console.table('帖子回复评论参数',{
+    id: courseId,
+    targetId: courseId,
+    content: replayComment.value.content,
+    type: 2,
+    pid: replayComment.value.pid
+  })
+  
+  request(COMMENT_ADD, {
+    id: courseId,
+    targetId: courseId,
+    content: replayComment.value.content,
+    type: 2,
+    pid: replayComment.value.pid
+  }).then((res) => {
+    console.log(res)
+    getData();
+  }).catch(err=>{
+    console.log(err)
+    submitReplayLoading.value = false;
+  });
+}
+
 // 报名
 function onLineSignUp() {
   if(data.value.isSignUp){
@@ -499,4 +873,370 @@ function formateArr(strs) {
 
   }
 }
+.bascinfor {
+    width: 100%;
+    background: #ffffff;
+    border-radius: 8px;
+    margin-top: 24px;
+    // position: relative;
+    .inputone {
+      margin-right: 44px;
+      position: relative;
+      max-width: 1069px;
+      // max-height: 110px;
+      margin-left: 88px;
+      margin-top: 44px;
+
+      .words {
+        position: absolute;
+        right: 15px;
+        // bottom: 5px;
+        top: 130px;
+        font-size: 14px;
+        font-weight: 500;
+        color: #333330;
+      }
+
+      .el-textarea__inner {
+        font-size: 14px;
+        font-weight: 500;
+        color: #666666;
+        margin-top: 44px;
+        // margin: 23px 50px;
+        border-radius: 8px;
+        background-color: rgba(245, 246, 247, 1);
+        padding: 11px 25px;
+      }
+
+      .el-textarea__inner::placeholder {
+        font-size: 14px;
+        font-weight: 500;
+        color: #666666;
+        line-height: 24px;
+      }
+
+      // .el-input__inner {
+      //   &::-webkit-input-placeholder {
+      //     /* WebKit browsers 适配谷歌 */
+      //     color: red;
+      //   }
+      // }
+      .upload {
+        display: flex;
+        height: 100px;
+        // background-color: red;
+        .allimg {
+          position: relative;
+          display: flex;
+
+          .imgone {
+            margin-top: 24px;
+            width: 55px;
+            height: 55px;
+            border-radius: 8px;
+            background-image: url(../../assets/image/px.png);
+            background-size: 100%;
+          }
+
+          .cha {
+            cursor: pointer;
+            top: 15px;
+            right: -9px;
+            // right: 0;
+            position: absolute;
+            width: 18px;
+            height: 18px;
+            border-radius: 50%;
+            background-image: url(../../assets/image/X.png);
+            background-size: 100%;
+          }
+        }
+
+        .uploadAnd {
+          margin-top: 21px;
+
+          .btwwo {
+            cursor: pointer;
+
+            .image {
+              padding-top: 8px;
+              width: 18px;
+              height: 17px;
+              // margin-top: 10px;
+              margin-left: -60px;
+            }
+
+            .shangchuan {
+              position: absolute;
+              right: 20px;
+              top: 7px;
+              display: inline-block;
+              margin-left: 10px;
+              font-size: 14px;
+              font-weight: 500;
+              color: #2478ff;
+              line-height: 24px;
+            }
+
+            width: 126px;
+            height: 36px;
+            border: none;
+            background-color: #fff;
+          }
+
+          .btnone {
+            cursor: pointer;
+            position: absolute;
+            right: 140px;
+
+            .image {
+              padding-top: 8px;
+              width: 18px;
+              height: 17px;
+              // margin-top: 10px;
+              margin-left: -60px;
+            }
+
+            .shangchuan {
+              position: absolute;
+              right: 20px;
+              top: 7px;
+              display: inline-block;
+              margin-left: 10px;
+              font-size: 14px;
+              font-weight: 500;
+              color: #2478ff;
+              line-height: 24px;
+            }
+
+            width: 126px;
+            height: 36px;
+            border: 1px solid #2478ff;
+            border-radius: 4px;
+            background-color: #fff;
+          }
+
+          .btntwo {
+            cursor: pointer;
+            position: absolute;
+            width: 126px;
+            height: 36px;
+            background: #2478ff;
+            border-radius: 4px;
+            font-size: 14px;
+            font-weight: 500;
+            color: #ffffff;
+            border: 0;
+            right: 0;
+          }
+        }
+      }
+
+      .thinline {
+        margin-top: 66px;
+        // width: 1635px;
+        border-top: 1px solid #878b92;
+        margin-left: -50px;
+        opacity: 0.2;
+      }
+
+      .bottom {
+        margin-top: 31px;
+        // width: 100px;
+        // height: 100px;
+        // background-color: #bfa;
+        .header {
+          display: flex;
+
+          .avator {
+            width: 41px;
+            height: 41px;
+            border-radius: 50%;
+            // background-image: url(../../assets/image/px.png);
+            background-size: 100%;
+          }
+
+          .id {
+            margin-left: 8px;
+            font-size: 14px;
+            height: 41px;
+            font-weight: bold;
+            color: #333333;
+            line-height: 41px;
+          }
+
+          .showCareer {
+            margin-left: 7px;
+            height: 41px;
+            font-size: 12px;
+            font-weight: 500;
+            color: #666666;
+            line-height: 41px;
+          }
+
+          .idThink {
+            margin-left: 17px;
+            height: 41px;
+            font-size: 14px;
+            font-weight: 500;
+            color: #666666;
+            line-height: 41px;
+          }
+        }
+
+        .discuss {
+          margin-left: 48px;
+          margin-top: 23px;
+          // width: 100px;
+          width: 100%;
+          // height: 100px;
+          // background-color: orange;
+          .discussmain {
+            // background-color: red;
+            width: 100%;
+            display: flex;
+            position: relative;
+
+            .talkmain {
+              margin-right: 25px;
+              margin-top: 2px;
+              font-size: 14px;
+              font-weight: 500;
+              color: #666666;
+            }
+
+            // .talk {
+            //   position: absolute;
+            //   right: 0;
+            //   width: 23px;
+            //   height: 23px;
+            //   background-image: url(../../assets/image/talk.png);
+            //   background-size: 100%;
+            // }
+          }
+
+          .intime {
+            margin-top: 11px;
+            font-size: 14px;
+            font-weight: 500;
+            color: #999999;
+          }
+
+          .likeYou {
+            margin-top: 15px;
+            display: flex;
+
+            .same {
+              width: 14px;
+              height: 14px;
+            }
+
+            .pinglun {
+              background-image: url(../../assets/image/pinglun.png);
+              background-size: 100%;
+            }
+
+            .dianzan {
+              background-image: url(../../assets/image/dianzan2.png);
+              background-size: 100%;
+            }
+
+            .count {
+              margin-left: 7px;
+              margin-top: -1px;
+              font-size: 14px;
+              font-weight: 500;
+              color: #b3bdc4;
+            }
+          }
+
+          .reply {
+            display: flex;
+            margin-top: 32px;
+            // height: 100px;
+            width: 100%;
+            // background-color: lightpink;
+            .sameava {
+              width: 29px;
+              height: 29px;
+              border-radius: 50%;
+            }
+
+            .sameuser {
+              margin-left: 14px;
+              line-height: 29px;
+              height: 29px;
+              font-weight: bold;
+              color: #333333;
+              font-size: 14px;
+            }
+
+            .centerreply {
+              height: 29px;
+              font-size: 14px;
+              font-weight: 500;
+              color: #4a9cf8;
+              line-height: 29px;
+              margin-left: 23px;
+              margin-right: 17px;
+            }
+
+            .avaone {
+              // background-image: url(../../assets/image/px.png);
+              background-size: 100%;
+            }
+
+            .avatwo {
+              // background-image: url(../../assets/image/px.png);
+              background-size: 100%;
+            }
+
+            .replytime {
+              margin-left: 17px;
+              height: 29px;
+              font-size: 14px;
+              font-weight: 500;
+              color: #999999;
+              line-height: 29px;
+            }
+          }
+
+          .allreplyimg {
+            display: flex;
+            margin-top: 21px;
+
+            .singleimg {
+              margin-right: 7px;
+              width: 65px;
+              height: 65px;
+              border-radius: 8px;
+              background-image: url(../../assets/image/px.png);
+              background-size: 100%;
+            }
+          }
+
+          .mainreply {
+            display: flex;
+            margin-top: 16px;
+
+            .replydetail {
+              height: 23px;
+              font-size: 14px;
+              font-weight: 500;
+              color: #666666;
+              line-height: 23px;
+              margin-right: 11px;
+            }
+
+          }
+
+          .inreply {
+            position: relative;
+            margin-top: -22px;
+            margin-bottom: 20px;
+          }
+        }
+      }
+    }
+  }
 </style>