Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
weixin_54851307
vue-vben-admin
提交
afc7263e
V
vue-vben-admin
项目概览
weixin_54851307
/
vue-vben-admin
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
vue-vben-admin
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
afc7263e
编写于
10月 12, 2020
作者:
V
vben
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat: add count-to component and demo
上级
4811cce8
变更
8
隐藏空白更改
内联
并排
Showing
8 changed file
with
79 addition
and
23 deletion
+79
-23
package.json
package.json
+1
-1
src/components/Loading/FullLoading.vue
src/components/Loading/FullLoading.vue
+2
-2
src/components/Transition/index.ts
src/components/Transition/index.ts
+19
-16
src/router/guard/pageLoadingGuard.ts
src/router/guard/pageLoadingGuard.ts
+0
-3
src/router/menus/modules/demo/comp.ts
src/router/menus/modules/demo/comp.ts
+4
-0
src/router/routes/modules/demo/comp.ts
src/router/routes/modules/demo/comp.ts
+8
-0
src/views/demo/comp/count-to/index.vue
src/views/demo/comp/count-to/index.vue
+42
-0
src/views/demo/comp/verify/Rotate.vue
src/views/demo/comp/verify/Rotate.vue
+3
-1
未找到文件。
package.json
浏览文件 @
afc7263e
{
"name"
:
"vben-admin-2.0"
,
"version"
:
"2.0.0-beta.
5
"
,
"version"
:
"2.0.0-beta.
6
"
,
"scripts"
:
{
"bootstrap"
:
"yarn install"
,
"serve"
:
"ts-node --project ./build/tsconfig.json ./build/script/preserve && cross-env NODE_ENV=development vite"
,
...
...
src/components/Loading/FullLoading.vue
浏览文件 @
afc7263e
...
...
@@ -41,8 +41,8 @@
display: flex;
width: 100%;
height: 100%;
// background: rgba(255, 255, 255, 0.
5
);
background:
#f1f1f63d
;
// background: rgba(255, 255, 255, 0.
3
);
background:
rgba(241, 241, 246, 0.8)
;
justify-content: center;
align-items: center;
}
...
...
src/components/Transition/index.ts
浏览文件 @
afc7263e
import
{
createSimpleTransition
,
createJavascriptTransition
}
from
'
./src/CreateTransition
'
;
import
{
// createSimpleTransition,
createJavascriptTransition
,
}
from
'
./src/CreateTransition
'
;
import
ExpandTransitionGenerator
from
'
./src/ExpandTransition
'
;
export
{
default
as
CollapseTransition
}
from
'
./src/CollapseTransition
'
;
export
const
FadeTransition
=
createSimpleTransition
(
'
fade-transition
'
);
export
const
ScaleTransition
=
createSimpleTransition
(
'
scale-transition
'
);
export
const
SlideYTransition
=
createSimpleTransition
(
'
slide-y-transition
'
);
export
const
ScrollYTransition
=
createSimpleTransition
(
'
scroll-y-transition
'
);
export
const
SlideYReverseTransition
=
createSimpleTransition
(
'
slide-y-reverse-transition
'
);
export
const
ScrollYReverseTransition
=
createSimpleTransition
(
'
scroll-y-reverse-transition
'
);
export
const
SlideXTransition
=
createSimpleTransition
(
'
slide-x-transition
'
);
export
const
ScrollXTransition
=
createSimpleTransition
(
'
scroll-x-transition
'
);
export
const
SlideXReverseTransition
=
createSimpleTransition
(
'
slide-x-reverse-transition
'
);
export
const
ScrollXReverseTransition
=
createSimpleTransition
(
'
scroll-x-reverse-transition
'
);
export
const
ScaleRotateTransition
=
createSimpleTransition
(
'
scale-rotate-transition
'
);
//
export const FadeTransition = createSimpleTransition('fade-transition');
//
export const ScaleTransition = createSimpleTransition('scale-transition');
//
export const SlideYTransition = createSimpleTransition('slide-y-transition');
//
export const ScrollYTransition = createSimpleTransition('scroll-y-transition');
//
export const SlideYReverseTransition = createSimpleTransition('slide-y-reverse-transition');
//
export const ScrollYReverseTransition = createSimpleTransition('scroll-y-reverse-transition');
//
export const SlideXTransition = createSimpleTransition('slide-x-transition');
//
export const ScrollXTransition = createSimpleTransition('scroll-x-transition');
//
export const SlideXReverseTransition = createSimpleTransition('slide-x-reverse-transition');
//
export const ScrollXReverseTransition = createSimpleTransition('scroll-x-reverse-transition');
//
export const ScaleRotateTransition = createSimpleTransition('scale-rotate-transition');
// Javascript transitions
export
const
ExpandTransition
=
createJavascriptTransition
(
...
...
@@ -22,7 +25,7 @@ export const ExpandTransition = createJavascriptTransition(
ExpandTransitionGenerator
()
);
export
const
ExpandXTransition
=
createJavascriptTransition
(
'
expand-x-transition
'
,
ExpandTransitionGenerator
(
''
,
true
)
);
//
export const ExpandXTransition = createJavascriptTransition(
//
'expand-x-transition',
//
ExpandTransitionGenerator('', true)
//
);
src/router/guard/pageLoadingGuard.ts
浏览文件 @
afc7263e
...
...
@@ -6,9 +6,6 @@ import { userStore } from '/@/store/modules/user';
export
function
createPageLoadingGuard
(
router
:
Router
)
{
let
isFirstLoad
=
true
;
router
.
beforeEach
(
async
(
to
)
=>
{
console
.
log
(
'
======================
'
);
console
.
log
(
2
);
console
.
log
(
'
======================
'
);
const
{
openKeepAlive
,
openRouterTransition
,
...
...
src/router/menus/modules/demo/comp.ts
浏览文件 @
afc7263e
...
...
@@ -9,6 +9,10 @@ const menu: MenuModule = {
path
:
'
/basic
'
,
name
:
'
基础组件
'
,
},
{
path
:
'
/countTo
'
,
name
:
'
数字动画
'
,
},
{
path
:
'
/scroll
'
,
...
...
src/router/routes/modules/demo/comp.ts
浏览文件 @
afc7263e
...
...
@@ -23,6 +23,14 @@ export default {
title
:
'
基础组件
'
,
},
},
{
path
:
'
/countTo
'
,
name
:
'
CountTo
'
,
component
:
()
=>
import
(
'
/@/views/demo/comp/count-to/index.vue
'
),
meta
:
{
title
:
'
数字动画
'
,
},
},
{
path
:
'
/scroll
'
,
...
...
src/views/demo/comp/count-to/index.vue
0 → 100644
浏览文件 @
afc7263e
<
template
>
<div
class=
"p-4 count-to-demo"
>
<Card>
<CardGrid
class=
"count-to-demo-card"
>
<CountTo
prefix=
"$"
:startVal=
"1"
:endVal=
"200000"
:duration=
"8000"
/>
</CardGrid>
<CardGrid
class=
"count-to-demo-card"
>
<CountTo
suffix=
"$"
:startVal=
"1"
:endVal=
"300000"
:decimals=
"2"
:duration=
"6000"
/>
</CardGrid>
<CardGrid
class=
"count-to-demo-card"
>
<CountTo
suffix=
"$"
:startVal=
"1"
:endVal=
"400000"
:duration=
"7000"
/>
</CardGrid>
<CardGrid
class=
"count-to-demo-card"
>
<CountTo
separator=
"-"
:startVal=
"10000"
:endVal=
"500000"
:duration=
"8000"
/>
</CardGrid>
</Card>
</div>
</
template
>
<
script
lang=
"ts"
>
import
{
defineComponent
}
from
'
vue
'
;
import
{
Card
}
from
'
ant-design-vue
'
;
import
{
CountTo
}
from
'
/@/components/CountTo/index
'
;
export
default
defineComponent
({
components
:
{
Card
,
CardGrid
:
Card
.
Grid
,
CountTo
,
},
setup
()
{
return
{};
},
});
</
script
>
<
style
lang=
"less"
scoped
>
.count-to-demo {
&-card {
width: 50%;
font-size: 30px;
text-align: center;
}
}
</
style
>
src/views/demo/comp/verify/Rotate.vue
浏览文件 @
afc7263e
<
template
>
<div
class=
"p-10"
>
<div
class=
"flex justify-center p-4 items-center bg-gray-700"
>
<RotateDragVerify
src=
"/@/assets/images/header.jp
g"
ref=
"el"
@
success=
"handleSuccess"
/>
<RotateDragVerify
:src=
"im
g"
ref=
"el"
@
success=
"handleSuccess"
/>
</div>
</div>
</
template
>
...
...
@@ -9,6 +9,7 @@
import
{
defineComponent
}
from
'
vue
'
;
import
{
RotateDragVerify
}
from
'
/@/components/Verify/index
'
;
import
img
from
'
/@/assets/images/header.jpg
'
;
export
default
defineComponent
({
components
:
{
RotateDragVerify
},
setup
()
{
...
...
@@ -17,6 +18,7 @@
};
return
{
handleSuccess
,
img
,
};
},
});
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录