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

完善

Browse Source 
Former-commit-id: 5d75986f02de2f4515121e9f797b835dba132732 [formerly 5d75986f02de2f4515121e9f797b835dba132732 [formerly 5d75986f02de2f4515121e9f797b835dba132732 [formerly 5d75986f02de2f4515121e9f797b835dba132732 [formerly 8c4098bcffd50089b041edcf9d539c64c3c92b16 [formerly 1bf5ee08c5424c0a4cedac421d52cf8c8393ae7f]]]]]
Former-commit-id: 3aa6fad9f9c31f62376dfb27f62fa937d0735e55
Former-commit-id: d293c0b275dc8c4d439fa04a45d9d4efa1dd8f4c
Former-commit-id: a737d8ff3f0c9d829e66a1cd305257961c551eda [formerly 4d2360f8b865bfab066291680106dc95df97ce2a]
Former-commit-id: b64f59d9203d16e71bcd21065aba7ead88566938
Former-commit-id: 4350c691cdff708266be623edf8f1b9d61faeb02
Former-commit-id: 1dba1637790b1f2c87733adfdfcc8491a97bfd1d
Former-commit-id: e17d989004ecb5fb7ce620103b997998da42b8d9
Former-commit-id: 3b781b9b28f6ed584b9c6dbfa5fafe3f8c1475b5
This commit is contained in:
liyang
2018-07-17 21:54:38 +08:00
parent db62c21964
commit 14c921e6b1
214 changed files with 157 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
src/views/demo/components/countup/index.vue
View File

@@ -1,98 +0,0 @@
<template>
<d2-container class="page">
<template slot="header">数字动画组件</template>
<el-row :gutter="20">
<el-col :span="6">
<el-card shadow="never" class="d2-mb">
<p slot="title">只设置目标数字</p>
<div class="group">
<d2-count-up :end="100"/>
</div>
</el-card>
</el-col>
<el-col :span="6">
<el-card shadow="never" class="d2-mb">
<p slot="title">设置起止数值</p>
<div class="group">
<d2-count-up :start="14" :end="100"/>
</div>
</el-card>
</el-col>
<el-col :span="6">
<el-card shadow="never" class="d2-mb">
<p slot="title">小数位数</p>
<div class="group">
<d2-count-up :end="100" :decimals="2"/>
</div>
</el-card>
</el-col>
<el-col :span="6">
<el-card shadow="never" class="d2-mb">
<p slot="title">动画时长</p>
<div class="group">
<d2-count-up :end="100" :duration="6"/>
</div>
</el-card>
</el-col>
<el-col :span="6">
<el-card shadow="never">
<p slot="title">回调函数</p>
<div class="group">
<d2-count-up :end="100" :callback="() => {className = 'end'}" :class="className"/>
</div>
</el-card>
</el-col>
<el-col :span="6">
<el-card shadow="never" class="d2-mb-0">
<p slot="title">结束一秒后更新数值</p>
<div class="group">
<d2-count-up :end="end" :callback="update"/>
</div>
</el-card>
</el-col>
</el-row>
</d2-container>
</template>
<script>
export default {
data () {
return {
// 回调函数使用
className: '',
// 更新数值用
end: 50
}
},
methods: {
update () {
setTimeout(() => {
this.end = 100
}, 1000)
}
}
}
</script>
<style lang="scss" scoped>
@import '~@/assets/style/public.scss';
.page {
.el-card {
@extend %unable-select;
.group {
display: flex;
justify-content: center;
align-items: center;
span {
font-size: 60px;
&.end {
padding: 0px 20px;
border-radius: 4px;
background-color: $color-success;
color: #FFF;
}
}
}
}
}
</style>