修改动态

src/views/operationsManagement/article/index.vue

@@ -153,35 +153,35 @@
         </div>
         <el-row :gutter="20">
           <el-col :span="24">
-            <div style="font-size: 15px;padding-left: 20px;padding-bottom: 20px;padding-top: 10px" class="content">{{ form.content }}</div>
+            <div style="font-size: 15px;padding-left: 45px;padding-bottom: 20px;" class="content">{{ form.content }}</div>
           </el-col>
           <div>
             <!-- 当没有图片时 -->
-            <div v-if="!form.url || form.url.length === 0" style="text-align: center; color: #999;"/>
+            <div v-if="!form.url || form.url.length === 0" style="text-align: center; color: #999;" />
             <!-- 当图片数量为1时 -->
             <div v-else-if="form.url.length === 1" style="text-align: center;">
               <img :src="form.url[0]" alt="Avatar" class="avatar1">
             </div>
             <!-- 当图片数量为4或6时，上下两排展示 -->
             <div v-else-if="form.url.length === 4 || form.url.length === 2">
-              <el-row v-for="(row, rowIndex) in Math.ceil(form.url.length / 2)" :key="rowIndex" :gutter="20">
+              <el-row v-for="(row, rowIndex) in Math.ceil(form.url.length / 2)" :key="rowIndex">
                 <el-col v-for="(imagePath, index) in form.url.slice(rowIndex * 2, rowIndex * 2 + 2)" :key="index" :span="12">
-                  <div style="padding: 10px;">
+                  <div style="padding-left: 20px;">
                     <img :src="imagePath" alt="Avatar" class="avatar3">
                   </div>
                 </el-col>
               </el-row>
             </div>
             <!-- 当图片数量为5, 7, 8或9时，按九宫格显示 -->
-            <el-row v-else :gutter="20">
+            <el-row v-else>
               <el-col v-for="(imagePath, index) in form.url" :key="index" :span="8">
-                <div style="padding: 10px;">
+                <div style="padding-left: 20px">
                   <img :src="imagePath" alt="Avatar" class="avatar2">
                 </div>
               </el-col>
             </el-row>
           </div>
-          <div style="font-size: 12px;color: #8c8c93">
+          <div style="font-size: 12px;color: #8c8c93;padding-left: 60px;padding-top: 10px">
             <span>{{ form.createDate }}</span>
           </div>
           <div class="commentTitle">
@@ -198,6 +198,7 @@
         <div class="commentsSection">
           <ul v-if="form.articleCommentVOList" class="commentTree">
             <li v-for="(comment, index) in form.articleCommentVOList" :key="index" class="commentItem">
+              <div v-if="index !== null" style="border-top: 1px solid #dadada; margin: 5px 0 5px;" />
               <div style="display: flex; justify-content: space-between; align-items: center;" class="commentHeader">
                 <div style="display: flex; align-items: center;padding-bottom: 10px">
                   <img style="margin-top: -40px" :src="comment.avatarUrl" alt="Avatar" class="avatarSize">
@@ -217,6 +218,7 @@
               </div>
               <ul v-if="comment.childrenCommentList && comment.childrenCommentList.length > 0" class="replies">
                 <li v-for="(reply, replyIndex) in comment.childrenCommentList" :key="replyIndex" class="replyItem">
+                  <div v-if="replyIndex !== null" style="border-top: 1px solid #dadada; margin: 5px 0 ;" />
                   <div style="display: flex; justify-content: space-between; align-items: center;" class="commentHeader">
                     <div style="display: flex; align-items: center;">
                       <img style="margin-top: -40px" :src="reply.avatarUrl" alt="Avatar" class="avatarSize">
@@ -634,7 +636,6 @@ export default {
 
     .commentItem {
       padding: 10px;
-      border: 1px solid #ddd;
 
       .avatar {
         width: 32px;
@@ -652,7 +653,6 @@ export default {
 
         .replyItem {
           padding: 5px;
-          border: 1px solid #eee;
         }
 
         .avatar {