long
2021-06-07 133cfa50d6429504b6c18a36c20472a6a872805a
提交 | 用户 | age
c95579 1 <template>
L 2   <div class="long_timeline">
3     <el-timeline>
4       <el-timeline-item v-if="!list || !list.length" color="#999">{{ emptyText||'暂无日志记录' }}</el-timeline-item>
5       <el-timeline-item
6         v-for="(item, index) in list"
7         :key="index"
8         color="#00AFAA"
9       >
10         <div class="flex flex-sb">
11           <div class="content-box">
12             <div class="title">{{ item.content }}</div>
13             <div v-if="item.remark" class="content">{{ item.remark }}</div>
14           </div>
15           <div class="right-box">
16             <div class="time-tx">{{ item.time }}</div>
17             <div v-if="item.author" class="author-tx">操作人:{{ item.author }}</div>
18           </div>
19         </div>
20       </el-timeline-item>
21     </el-timeline>
22   </div>
23 </template>
24
25 <script>
26 export default {
27   name: 'LongTimeline',
28   props: {
29     // [{content:'xxx', time: 'xxx', author: 'xxx'}]
30     list: {
31       type: Array,
32       default: null
33     },
34     // 空列表时显示
35     emptyText: {
36       type: String,
37       default: ''
38     }
39   },
40   data() {
41     return {
42     }
43   },
44   mounted() {
45   },
46   methods: {
47   }
48 }
49 </script>
50
51 <style lang="scss" scoped>
52 .long_timeline{
53     margin-top: 37px;
54 }
55 .content-box{
56     font-size: 14px;
57     line-height: 1.2;
58     color: #666666;
59     // line-height: 34px;
60     width: 70%;
61     .content{
62       // width: 60%;
63       margin-top: 4px;
64       font-size: 12px;
65       color: #ccc;
66     }
67 }
68 .right-box{
69     margin-left: 20px;
70 }
71 .time-tx{
72     font-size: 14px;
73     color: #000000;
74     // line-height: 34px;
75     text-align: right;
76 }
77 .author-tx{
78     font-size: 14px;
79     color: #000000;
80     // line-height: 34px;
81     text-align: right;
82     margin-top: 8px;
83 }
84 </style>