chenhaodong / mew-iview

Blame view

local/routers/tag.vue 3.62 KB
Edit Raw Normal View History
4ec205b6   梁灏   add Tag UI 
1
 
  <template>
9dde24b6   梁灏   add LoadingBar co... 
2
3
4
5
6
7
 
      <div>
          <Button @click="start">start</Button>
          <Button @click="destroy">destroy</Button>
          <Button @click="finish">finish</Button>
          <Button @click="error">error</Button>
          <Button @click="update">update</Button>
c1dcac7a   梁灏   add Progress UI 
8
 
          <br><br>
385cfeba   梁灏   add Timeline UI 
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
 
          <Timeline>
              <Timeline-item>
                  <p class="time">1976年</p>
                  <p class="content">Apple I 问世</p>
              </Timeline-item>
              <Timeline-item>
                  <p class="time">1984年</p>
                  <p class="content">发布 Macintosh</p>
              </Timeline-item>
              <Timeline-item>
                  <p class="time">2007年</p>
                  <p class="content">发布 iPhone</p>
              </Timeline-item>
              <Timeline-item>
                  <p class="time">2010年</p>
                  <p class="content">发布 iPad</p>
              </Timeline-item>
              <Timeline-item>
                  <p class="time">2011年10月5日</p>
                  <p class="content">史蒂夫·乔布斯去世</p>
              </Timeline-item>
          </Timeline>
          <br><br><br>
          <Timeline>
              <Timeline-item color="green">发布1.0版本</Timeline-item>
              <Timeline-item color="green">发布2.0版本</Timeline-item>
              <Timeline-item color="red">严重故障</Timeline-item>
              <Timeline-item color="blue">发布3.0版本</Timeline-item>
          </Timeline>
          <br><br><br>
          <Timeline pending>
              <Timeline-item>发布1.0版本</Timeline-item>
              <Timeline-item>发布2.0版本</Timeline-item>
              <Timeline-item>发布3.0版本</Timeline-item>
              <Timeline-item><a href="#">查看更多</a></Timeline-item>
          </Timeline>
          <br><br><br>
          <Timeline>
              <Timeline-item color="green">
                  <Icon type="trophy" slot="dot"></Icon>
                  <span>发布里程碑版本</span>
              </Timeline-item>
              <Timeline-item>发布1.0版本</Timeline-item>
              <Timeline-item>发布2.0版本</Timeline-item>
              <Timeline-item>发布3.0版本</Timeline-item>
          </Timeline>
          <br><br><br>
          <Timeline pending>
              <Timeline-item>发布1.0版本</Timeline-item>
              <Timeline-item>发布2.0版本</Timeline-item>
          </Timeline>
          <br><br><br>
9dde24b6   梁灏   add LoadingBar co... 
61
 
      </div>
4ec205b6   梁灏   add Tag UI 
62
63
 
  </template>
  <script>
385cfeba   梁灏   add Timeline UI 
64
 
      import { Tag, LoadingBar, Button, Progress, Icon, Timeline } from 'iview';
c1dcac7a   梁灏   add Progress UI 
65
 
      const ButtonGroup = Button.Group;
385cfeba   梁灏   add Timeline UI 
66
 
      const TimelineItem = Timeline.Item;
4ec205b6   梁灏   add Tag UI 
67
68
 
      export default {
          components: {
9dde24b6   梁灏   add LoadingBar co... 
69
 
              Tag,
c1dcac7a   梁灏   add Progress UI 
70
71
72
 
              Button,
              Progress,
              ButtonGroup,
385cfeba   梁灏   add Timeline UI 
73
74
75
 
              Icon,
              Timeline,
              TimelineItem
4ec205b6   梁灏   add Tag UI 
76
77
78
79
80
81
 
          },
          props: {
          
          },
          data () {
              return {
c1dcac7a   梁灏   add Progress UI 
82
 
                  percent: 0
4ec205b6   梁灏   add Tag UI 
83
84
85
86
87
88
 
              }
          },
          computed: {
          
          },
          methods: {
9dde24b6   梁灏   add LoadingBar co... 
89
90
91
92
93
94
95
96
97
98
99
100
101
102
 
              start () {
                  LoadingBar.start();
              },
              destroy () {
                  LoadingBar.destroy();
              },
              finish () {
                  LoadingBar.finish();
              },
              error () {
                  LoadingBar.error();
              },
              update () {
                  LoadingBar.update(50);
c1dcac7a   梁灏   add Progress UI 
103
104
105
106
107
108
109
110
111
112
113
114
 
              },
              add () {
                  if (this.percent >= 100) {
                      return false;
                  }
                  this.percent += 10;
              },
              minus () {
                  if (this.percent <= 0) {
                      return false;
                  }
                  this.percent -= 10;
9dde24b6   梁灏   add LoadingBar co... 
115
 
              }
4ec205b6   梁灏   add Tag UI 
116
117
118
 
          }
      }
  </script>