1

src/views/adminCenter/refute/item.vue

@@ -1,23 +1,19 @@
 <template>
   <div id="item">
-    <el-row type="flex" class="list__row" @click.native="toEdit">
-      <el-col :span="9">
+    <el-row type="flex" @click.native="toEdit" class="item">
+      <el-col :span="9" class="i_row">
         <van-image :src="data.imgUrl" :width="imgpx" :height="imghpx" fit="scale-down">
           <template #error>
             <van-image :src="noImg" :width="imgpx" :height="imghpx" fit="scale-down" />
           </template>
         </van-image>
       </el-col>
-      <el-col :span="14">
-        <el-row>
-          <el-col :span="24" class="dl2">{{ data.title }}</el-col>
-          <el-col :span="24">
-            <el-row type="flex" align="middle" class="last__row">
-              <el-col :span="18"> {{ data.create_time }} </el-col>
-              <el-col :span="6">阅读: {{ data.read }} </el-col>
-            </el-row>
-          </el-col>
-        </el-row>
+      <el-col :span="15" class="s_row">
+        <el-col :span="24" class="dl2">{{ data.title }}</el-col>
+        <el-col :span="24" class="last__row">
+          <el-col :span="18"> {{ data.create_time }} </el-col>
+          <el-col :span="6">阅读: {{ data.read }} </el-col>
+        </el-col>
       </el-col>
     </el-row>
   </div>
@@ -61,26 +57,33 @@ export default {
 <style lang="less" scoped>
 @wordHeight: 1rem;
 @subWord: #666666;
-.list__row {
-  padding: 0.3125rem;
+.item {
   border-bottom: 1px solid #ccc;
-  min-height: 6.375rem;
-}
-.s__row {
-  position: relative;
-}
-.last__row {
-  position: absolute;
-  bottom: 15px;
-  font-size: 0.875rem;
-  color: @subWord;
-}
-.dl2 {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  -webkit-line-clamp: 2;
-  word-break: break-all;
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
+  padding: 8px 0;
+  .i_row {
+    text-align: center;
+    /deep/.van-image__img {
+      border: 1px solid #f1f1f1;
+    }
+  }
+  .s_row {
+    padding: 0 0.3125rem;
+    .dl2 {
+      font-size: 16px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      -webkit-line-clamp: 2;
+      word-break: break-all;
+      display: -webkit-box;
+      -webkit-box-orient: vertical;
+    }
+    .last__row {
+      font-size: 0.875rem;
+      color: @subWord;
+      position: absolute;
+      bottom: 10px;
+      width: 60%;
+    }
+  }
 }
 </style>