多行省略

src/style/czr.scss

@@ -45,6 +45,37 @@
   }
 }
 
+.__text-ellipsis-2 {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  -webkit-line-clamp: 2;
+}
+.__text-ellipsis-3 {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  -webkit-line-clamp: 3;
+}
+.__text-ellipsis-4 {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  -webkit-line-clamp: 4;
+}
+.__text-ellipsis-5 {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  -webkit-line-clamp: 5;
+}
+.__text-ellipsis-6 {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  -webkit-line-clamp: 6;
+}
+
 .__czr-pagination {
   display: flex;
   justify-content: flex-end;

src/views/manage/knowledge/index.vue

@@ -74,7 +74,7 @@
                   <tagsSelect :value="row.tags" @onChange="tags => onChangeTag(row, tags)"/>
                 </div>
               </div>
-              <div class="text-[0.88rem] text-[#606266] mb-auto mt-[var(--czr-gap)]">{{row.p3}}</div>
+              <div class="__text-ellipsis-3 text-[0.88rem] text-[#606266] mb-auto mt-[var(--czr-gap)]" style="line-height: 1.4rem" v-title="{lines: 3}">{{row.p3}}</div>
               <div class="flex items-center text-[0.75rem] text-[#6F7889] gap-[var(--czr-gap)]">
                 <div>文档数:{{row.p4}}</div>
                 <div>|</div>