sheng/mes-ui-d2
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

no message

Browse Source 
Former-commit-id: 43a8224a34f70bb4292c77196f4d98d18b58cb44
Former-commit-id: d154b16d0b3f214e55815c123b775681016c5a70
Former-commit-id: 22378774d55271fb76d5827ea0ffdfd1f2678831
This commit is contained in:
李杨
2018-01-15 10:17:58 +08:00
parent 173520d20e
commit d77b0ad841
21 changed files with 145 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
src/pages/demo/plugins/countup/demo.vue
View File

@@ -1,40 +1,52 @@
<template>
<Container type="ghost" class="demo-plugin-countup-demo">
<Container type="ghost" class="page">
<el-row :gutter="10">
<el-col :span="6">
<el-card>
<p slot="title">只设置目标数字</p>
<CountUp :end="100"></CountUp>
<div class="group">
<CountUp :end="100"></CountUp>
</div>
</el-card>
</el-col>
<el-col :span="6">
<el-card>
<p slot="title">设置起止数值</p>
<CountUp :start="14" :end="100"></CountUp>
<div class="group">
<CountUp :start="14" :end="100"></CountUp>
</div>
</el-card>
</el-col>
<el-col :span="6">
<el-card>
<p slot="title">小数位数</p>
<CountUp :end="100.00" :decimals="2"></CountUp>
<div class="group">
<CountUp :end="100.00" :decimals="2"></CountUp>
</div>
</el-card>
</el-col>
<el-col :span="6">
<el-card>
<p slot="title">动画时长</p>
<CountUp :end="100" :duration="6"></CountUp>
<div class="group">
<CountUp :end="100" :duration="6"></CountUp>
</div>
</el-card>
</el-col>
<el-col :span="6">
<el-card>
<p slot="title">回调函数</p>
<CountUp :end="100" :callback="() => {className = 'end'}" :class="className"></CountUp>
<div class="group">
<CountUp :end="100" :callback="() => {className = 'end'}" :class="className"></CountUp>
</div>
</el-card>
</el-col>
<el-col :span="6">
<el-card>
<p slot="title">结束一秒后更新数值</p>
<CountUp :end="end" :callback="update"></CountUp>
<div class="group">
<CountUp :end="end" :callback="update"></CountUp>
</div>
</el-card>
</el-col>
</el-row>
@@ -62,18 +74,18 @@ export default {
</script>
<style lang="scss">
<style lang="scss" scoped>
@import '~@/assets/style/public.scss';
.demo-plugin-countup-demo {
.page {
.el-card {
@extend %unable-select;
margin-bottom: 10px;
.el-card__body {
.group {
display: flex;
justify-content: center;
align-items: center;
span {
font-size: 40px;
font-size: 60px;
&.end {
padding: 0px 20px;
border-radius: $border-radius;

7
src/pages/demo/plugins/countup/readme.vue
View File

@@ -1,7 +1,10 @@
<template>
<Container>
<p slot="title">README.md</p>
<p slot="more"><GithubLink url="https://github.com/inorganik/countUp.js"></GithubLink></p>
<PageHeader
slot="header"
title="README.md"
url="https://github.com/inorganik/countUp.js">
</PageHeader>
<div>
<Markdown url="https://raw.githubusercontent.com/inorganik/countUp.js/master/README.md"></Markdown>
</div>