移除 Result 组件

This commit is contained in:
hooray 2022-02-23 15:05:57 +08:00
parent 6b5d432ab3
commit 6d562c2c5f
3 changed files with 0 additions and 115 deletions

View File

@ -1,84 +0,0 @@
<script setup name="Result">
defineProps({
type: {
type: String,
validator: val => ['success', 'warning', 'error'].includes(val),
required: true
},
title: {
type: String,
required: true
},
desc: {
type: String,
default: ''
}
})
</script>
<template>
<div class="result">
<div v-if="type === 'success'" class="icon icon-success">
<el-icon><el-icon-success-filled /></el-icon>
</div>
<div v-else-if="type === 'warning'" class="icon icon-warning">
<el-icon><el-icon-warning-filled /></el-icon>
</div>
<div v-else class="icon icon-error">
<el-icon><el-icon-circle-close-filled /></el-icon>
</div>
<h1>{{ title }}</h1>
<div v-if="desc" class="desc">{{ desc }}</div>
<div v-if="$slots.extra" class="extra">
<slot name="extra" />
</div>
<div v-if="$slots.default" class="actions">
<slot />
</div>
</div>
</template>
<style lang="scss" scoped>
$success: #67c23a;
$warning: #e6a23c;
$error: #f56c6c;
.result {
width: 72%;
margin: 20px auto 0;
text-align: center;
.icon {
i {
font-size: 80px;
}
&-success i {
color: $success;
}
&-warning i {
color: $warning;
}
&-error i {
color: $error;
}
}
h1 {
margin: 20px 0;
font-size: 24px;
font-weight: normal;
}
.desc {
color: #909399;
margin-bottom: 20px;
}
.extra {
margin: 50px 0;
padding: 24px 40px;
text-align: left;
color: #606266;
background: #f8f8f9;
border-radius: 4px;
}
.actions {
margin-bottom: 20px;
}
}
</style>

View File

@ -34,14 +34,6 @@ export default {
title: '内容块'
}
},
{
path: 'result',
name: 'componentExtendExampleResult',
component: () => import('@/views/component_extend_example/result.demo.vue'),
meta: {
title: '处理结果'
}
},
{
path: 'actionbar',
name: 'componentExtendExampleActionbar',

View File

@ -1,23 +0,0 @@
<template>
<div>
<page-header title="处理结果" content="Result" />
<page-main>
<result type="success" title="提交成功" desc="提交结果页用于反馈一系列操作任务的处理结果。">
<el-button type="primary">返回列表</el-button>
<el-button>打印</el-button>
</result>
</page-main>
<page-main>
<result type="error" title="提交失败" desc="灰色额外区域可以显示一些补充的信息。请核对并修改以下信息后,再重新提交。">
<template #extra>
<div>您提交的内容有如下错误</div>
<div>
您的账户已被冻结
<a href="###">打印</a>
</div>
</template>
<el-button type="primary">返回修改</el-button>
</result>
</page-main>
</div>
</template>