Unverified Commit a22763ef by Sendya

fix: export component, mv Result to src/components

parent 218e9211
<template>
<div class="result">
<div>
<a-icon :class="{ 'icon': true, 'success': isSuccess, 'error': !isSuccess }" :type="isSuccess ? 'check-circle' : 'close-circle'"/>
</div>
<div class="title" v-if="title">{{ title }}</div>
<div class="description" v-if="description">{{ description }}</div>
<div class="content" v-if="content">
<slot></slot>
</div>
<div class="action">
<slot name="action"></slot>
</div>
</div>
</template>
<script>
export default {
name: 'Result',
props: {
isSuccess: {
type: Boolean,
default: false
},
title: {
type: String,
default: ''
},
description: {
type: String,
default: ''
},
content: {
type: Boolean,
default: true
}
}
}
</script>
<style lang="less" scoped>
.result {
text-align: center;
width: 72%;
margin: 0 auto;
padding: 24px 0 8px;
.icon {
font-size: 72px;
line-height: 72px;
margin-bottom: 24px;
}
.success {
color: #52c41a;
}
.error {
color: red;
}
.title {
font-size: 24px;
color: rgba(0, 0, 0, .85);
font-weight: 500;
line-height: 32px;
margin-bottom: 16px;
}
.description {
font-size: 14px;
line-height: 22px;
color: rgba(0, 0, 0, 0.45);
margin-bottom: 24px;
}
.content {
background: #fafafa;
padding: 24px 40px;
border-radius: 2px;
text-align: left;
}
.action {
margin-top: 32px;
}
}
.mobile {
.result {
width: 100%;
margin: 0 auto;
padding: unset;
}
}
<template>
<div class="result">
<div>
<a-icon :class="{ 'icon': true, 'success': isSuccess, 'error': !isSuccess }" :type="isSuccess ? 'check-circle' : 'close-circle'"/>
</div>
<div class="title" v-if="title">{{ title }}</div>
<div class="description" v-if="description">{{ description }}</div>
<div class="content" v-if="content">
<slot></slot>
</div>
<div class="action">
<slot name="action"></slot>
</div>
</div>
</template>
<script>
export default {
name: 'Result',
props: {
isSuccess: {
type: Boolean,
default: false
},
title: {
type: String,
default: ''
},
description: {
type: String,
default: ''
},
content: {
type: Boolean,
default: true
}
}
}
</script>
<style lang="less" scoped>
.result {
text-align: center;
width: 72%;
margin: 0 auto;
padding: 24px 0 8px;
.icon {
font-size: 72px;
line-height: 72px;
margin-bottom: 24px;
}
.success {
color: #52c41a;
}
.error {
color: red;
}
.title {
font-size: 24px;
color: rgba(0, 0, 0, .85);
font-weight: 500;
line-height: 32px;
margin-bottom: 16px;
}
.description {
font-size: 14px;
line-height: 22px;
color: rgba(0, 0, 0, 0.45);
margin-bottom: 24px;
}
.content {
background: #fafafa;
padding: 24px 40px;
border-radius: 2px;
text-align: left;
}
.action {
margin-top: 32px;
}
}
.mobile {
.result {
width: 100%;
margin: 0 auto;
padding: unset;
}
}
</style>
import Result from './Result.vue'
export default Result
import AvatarList from '@/components/AvatarList/index'
// chart
import Bar from '@/components/chart/Bar'
import ChartCard from '@/components/chart/ChartCard'
......@@ -9,13 +8,20 @@ import MiniProgress from '@/components/chart/MiniProgress'
import Radar from '@/components/chart/Radar'
import RankList from '@/components/chart/RankList'
import TransferBar from '@/components/chart/TransferBar'
// ------我是分割线----------
import CountDown from '@/components/CountDown/index'
import Ellipsis from '@/components/Ellipsis/index'
import FooterToolbar from '@/components/FooterToolbar/index'
import NumberInfo from '@/components/NumberInfo/index'
// pro components
import AvatarList from '@/components/AvatarList'
import CountDown from '@/components/CountDown'
import Ellipsis from '@/components/Ellipsis'
import FooterToolbar from '@/components/FooterToolbar'
import NumberInfo from '@/components/NumberInfo'
import DetailList from '@/components/tools/DetailList'
import Tree from '@/components/Tree/Tree'
import Trend from '@/components/Trend/index'
import Trend from '@/components/Trend'
import STable from '@/components/table'
import MultiTab from '@/components/MultiTab'
import Result from '@/components/Result'
import IconSelector from '@/components/IconSelector'
export {
AvatarList,
......@@ -33,5 +39,10 @@ export {
Ellipsis,
FooterToolbar,
NumberInfo,
Tree
DetailList,
Tree,
STable,
MultiTab,
Result,
IconSelector
}
......@@ -30,7 +30,7 @@
</template>
<script>
import Result from '../../result/Result'
import { Result } from '@/components'
export default {
name: 'Step3',
......@@ -66,4 +66,4 @@ export default {
font-size: 20px;
line-height: 14px;
}
</style>
</style>
......@@ -24,7 +24,7 @@
</template>
<script>
import Result from './Result'
import { Result } from '@/components'
export default {
name: 'Error',
......
......@@ -60,7 +60,7 @@
</template>
<script>
import Result from './Result'
import { Result } from '@/components'
import { mixinDevice } from '@/utils/mixin.js'
const directionType = {
......
......@@ -14,7 +14,7 @@
</template>
<script>
import Result from '@/views/result/Result'
import { Result } from '@/components'
export default {
name: 'RegisterResult',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment