优化

src/views/kpi/assessment/performance/components/pinglun.vue

@@ -2,10 +2,15 @@
 <template>
   <div class="pinglunTem">
     <div class="pingcontent"
-         style="display:flex;"
+         :class="{pingcontentCopy:isJilu}"
          :key="i.id"
          v-for="i in pinglunList">
-      <div class="pinglunTem-left">
+         <div></div>
+      <div v-if="isJilu" class="pingcontent-top">
+        {{i.gmtCreate}}
+      </div>
+      <div class="pinglunTem-content" :style="{padding:isJilu?'0 0 20px 20px':'12px 0'}">
+        <div class="pinglunTem-left">
         <img :onerror="defaultImg"
               :src='i.avatar || defaultImg'
              alt="">
@@ -15,7 +20,7 @@
           <div><span>{{i.staffName}}</span><span class="position" v-if="i.position">{{i.position}}</span><span v-if="i.typeDesc" class="beizhu">#
               {{i.typeDesc}}
               #</span></div>
-          <div style="font-size:12px;">{{i.gmtCreate}}</div>
+          <div v-if="!isJilu" style="font-size:12px;">{{i.gmtCreate}}</div>
         </div>
         <div class="pinglunTem-right-content pre">
           <div v-if="i.taskName" class="content-top">
@@ -26,6 +31,7 @@
           </pre>
         </div>
       </div>
+      </div>
     </div>
   </div>
 </template>
@@ -37,6 +43,10 @@ export default {
     pinglunList: {
       type: Array,
       default: () => []
+    },
+    isJilu: {
+      type: Boolean,
+      default: false
     }
   },
   // 1，修改名称，2修改进度 ，3名称和进度都修改
@@ -58,8 +68,33 @@ export default {
 
 <style lang='less' scoped>
 .pinglunTem {
+  &-content{
+    display: flex;
+
+  }
   .pingcontent {
-    margin: 20px 0;
+    position: relative;
+    &-top{
+      padding-left: 10px;
+      position: relative;
+      top: -5px;
+    }
+  }
+  .pingcontentCopy{
+    border-left: 1px dashed rgb(206, 206, 206) ;
+  }
+  .pingcontentCopy::before{
+    position: absolute;
+    width: 10px;
+    height: 10px;
+    content: "";
+    top: o;
+    left: -5px;
+    background: #09f;
+    border-radius: 50%;
+  }
+  .pingcontentCopy:last-child{
+    border: none;
   }
   &-left {
     width: 30px;

src/views/kpi/assessment/performance/components/process.vue

@@ -192,7 +192,7 @@
           </div>
           <div v-if="activeName==='2'"
                class="drawer-content-right-item jilu">
-            <pinglun :pinglunList='pinglunList' />
+            <pinglun :isJilu='true' :pinglunList='pinglunList' />
           </div>
         </div>
       </div>