|
|
@@ -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>
|
