From 2d4f7bce052eb336482888f0a7605afa4c0c65f4 Mon Sep 17 00:00:00 2001
From: ZiuChen <457353192@qq.com>
Date: Thu, 25 Aug 2022 22:24:15 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=B0=83=E6=95=B4=E4=BA=86`=E6=9F=A5?=
 =?UTF-8?q?=E7=9C=8B=E5=85=A8=E9=83=A8`=E6=8C=89=E9=92=AE=E7=9A=84?=
 =?UTF-8?q?=E4=BD=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/cpns/ClipItemList.vue          | 32 +++++++++++++++++++-----------
 src/style/cpns/clip-item-list.less | 13 ++++--------
 2 files changed, 24 insertions(+), 21 deletions(-)

diff --git a/src/cpns/ClipItemList.vue b/src/cpns/ClipItemList.vue
index 82d5914..a246ec3 100644
--- a/src/cpns/ClipItemList.vue
+++ b/src/cpns/ClipItemList.vue
@@ -11,30 +11,38 @@
     >
       <div class="clip-info">
         <div class="clip-time">
-          <span>{{ dateFormat(item.updateTime) }}</span>
-        </div>
-        <div class="clip-data">
           <template v-if="item.type === 'text'">
-            <div
+            <span
               class="clip-data-status"
               v-if="item.data.split(`\n`).length - 1 > 8"
               @click.stop="handleDataClick(item)"
             >
               查看全部
-            </div>
+            </span>
+            <span v-else>{{ dateFormat(item.updateTime) }}</span>
+          </template>
+          <template v-if="item.type === 'image'">
+            <span>{{ dateFormat(item.updateTime) }}</span>
+          </template>
+          <template v-if="item.type === 'file'">
+            <span
+              class="clip-data-status"
+              v-if="JSON.parse(item.data).length >= 8"
+              @click.stop="handleDataClick(item)"
+            >
+              查看全部
+            </span>
+            <span v-else>{{ dateFormat(item.updateTime) }}</span>
+          </template>
+        </div>
+        <div class="clip-data">
+          <template v-if="item.type === 'text'">
             <div>{{ item.data.split(`\n`).slice(0, 8).join(`\n`).trim() }}</div>
           </template>
           <template v-if="item.type === 'image'">
             <img class="clip-data-image" :src="item.data" alt="Image" />
           </template>
           <template v-if="item.type === 'file'">
-            <div
-              class="clip-data-status"
-              v-if="JSON.parse(item.data).length >= 8"
-              @click.stop="handleDataClick(item)"
-            >
-              查看全部
-            </div>
             <FileList :data="JSON.parse(item.data)" />
           </template>
         </div>
diff --git a/src/style/cpns/clip-item-list.less b/src/style/cpns/clip-item-list.less
index 4c3a7d1..a3fa096 100644
--- a/src/style/cpns/clip-item-list.less
+++ b/src/style/cpns/clip-item-list.less
@@ -24,6 +24,7 @@
       padding: 10px;
       .clip-time {
         display: flex;
+        flex-direction: column;
         justify-content: center;
         align-items: center;
         min-width: 100px;
@@ -37,6 +38,9 @@
           border-radius: 5px;
           min-width: 50px;
           padding: 5px 7px 5px 7px;
+          &.clip-data-status {
+            color: @primary-color;
+          }
         }
       }
       .clip-data {
@@ -54,15 +58,6 @@
           max-width: 90%;
           box-shadow: 0px 0px 3px @text-color;
         }
-        .clip-data-status {
-          position: absolute;
-          width: fit-content;
-          color: @text-color;
-          background-color: @primary-color-lighter;
-          border-radius: 5px;
-          padding: 5px;
-          font-size: 13px;
-        }
       }
     }
     .clip-count {