1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
| <template>
| <li class="el-timeline-item">
| <div class="el-timeline-item__tail"></div>
|
| <div v-if="!$slots.dot"
| class="el-timeline-item__node"
| :class="[
| `el-timeline-item__node--${size || ''}`,
| `el-timeline-item__node--${type || ''}`
| ]"
| :style="{
| backgroundColor: color
| }"
| >
| <i v-if="icon"
| class="el-timeline-item__icon"
| :class="icon"
| ></i>
| </div>
| <div v-if="$slots.dot" class="el-timeline-item__dot">
| <slot name="dot"></slot>
| </div>
|
| <div class="el-timeline-item__wrapper">
| <div v-if="!hideTimestamp && placement === 'top'"
| class="el-timeline-item__timestamp is-top">
| {{timestamp}}
| </div>
|
| <div class="el-timeline-item__content">
| <slot></slot>
| </div>
|
| <div v-if="!hideTimestamp && placement === 'bottom'"
| class="el-timeline-item__timestamp is-bottom">
| {{timestamp}}
| </div>
| </div>
| </li>
| </template>
|
| <script>
| export default {
| name: 'ElTimelineItem',
|
| inject: ['timeline'],
|
| props: {
| timestamp: String,
|
| hideTimestamp: {
| type: Boolean,
| default: false
| },
|
| placement: {
| type: String,
| default: 'bottom'
| },
|
| type: String,
|
| color: String,
|
| size: {
| type: String,
| default: 'normal'
| },
|
| icon: String
| }
| };
| </script>
|
|
