117 lines
3.5 KiB
Vue
117 lines
3.5 KiB
Vue
|
<template>
|
||
|
|
<view class="empty-container">
|
||
|
|
<image :src="getImage" class="empty-image" mode="widthFix"></image>
|
||
|
|
<!-- <text class="empty-text">{{ text }}</text> -->
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
// 暂无数据
|
||
|
|
import noDataDefault from "@/static/common/img/noDataNew/no-data.png";
|
||
|
|
// 暂无搜索
|
||
|
|
import noDataSearch from "@/static/common/img/noDataNew/no-search.png";
|
||
|
|
// 暂无消息
|
||
|
|
import noDataMessage from "@/static/common/img/noDataNew/no-message.png";
|
||
|
|
// 网络异常
|
||
|
|
import errorNet from "@/static/common/img/noDataNew/error-net.png";
|
||
|
|
// 数据加载失败
|
||
|
|
import errorData from "@/static/common/img/noDataNew/error-data.png";
|
||
|
|
// 维护中
|
||
|
|
import maintenance from "@/static/common/img/noDataNew/maintenance.png";
|
||
|
|
// 暂无附件简历
|
||
|
|
import noAttachmentResume from "@/static/common/img/noDataNew/no-attachment-resume.png";
|
||
|
|
// 暂无收藏
|
||
|
|
import noCollection from "@/static/common/img/noDataNew/no-collection.png";
|
||
|
|
// 暂无评论
|
||
|
|
import noComments from "@/static/common/img/noDataNew/no-comments.png";
|
||
|
|
// 暂无内容
|
||
|
|
import noContent from "@/static/common/img/noDataNew/no-content.png";
|
||
|
|
// 暂无文件
|
||
|
|
import noFile from "@/static/common/img/noDataNew/no-file.png";
|
||
|
|
// 暂无好友
|
||
|
|
import noFriends from "@/static/common/img/noDataNew/no-friends.png";
|
||
|
|
// 暂无网络
|
||
|
|
import noInternet from "@/static/common/img/noDataNew/no-internet.png";
|
||
|
|
// 暂无权限
|
||
|
|
import noPermissions from "@/static/common/img/noDataNew/no-permissions.png";
|
||
|
|
// 暂无图片
|
||
|
|
import noPicture from "@/static/common/img/noDataNew/no-picture.png";
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: "NoData",
|
||
|
|
props: {
|
||
|
|
// 图片类型
|
||
|
|
type: {
|
||
|
|
type: String,
|
||
|
|
default: "default",
|
||
|
|
},
|
||
|
|
// 描述文字，默认值为"暂无数据"
|
||
|
|
text: {
|
||
|
|
type: String,
|
||
|
|
default: "暂无数据",
|
||
|
|
},
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
getImage() {
|
||
|
|
const imageMap = {
|
||
|
|
default: noDataDefault,
|
||
|
|
search: noDataSearch,
|
||
|
|
message: noDataMessage,
|
||
|
|
errorNet: errorNet,
|
||
|
|
errorData: errorData,
|
||
|
|
maintenance: maintenance,
|
||
|
|
resume: noAttachmentResume,
|
||
|
|
collection: noCollection,
|
||
|
|
comments: noComments,
|
||
|
|
content: noContent,
|
||
|
|
file: noFile,
|
||
|
|
friends: noFriends,
|
||
|
|
internet: noInternet,
|
||
|
|
permissions: noPermissions,
|
||
|
|
picture: noPicture,
|
||
|
|
};
|
||
|
|
return imageMap[this.type] || imageMap.default;
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: {
|
||
|
|
/*
|
||
|
|
<no-data type="default" text="暂无数据" />
|
||
|
|
<no-data type="errorNet" text="网络错误" />
|
||
|
|
<no-data type="search" text="暂无搜索内容" />
|
||
|
|
<no-data type="errorData" text="数据加载失败" />
|
||
|
|
<no-data type="message" text="暂无消息" />
|
||
|
|
<no-data type="maintenance" text="系统维护中" />
|
||
|
|
<no-data type="resume" text="暂无简历附件" />
|
||
|
|
<no-data type="collection" text="暂无收藏" />
|
||
|
|
<no-data type="comments" text="暂无评论" />
|
||
|
|
<no-data type="content" text="暂无内容" />
|
||
|
|
<no-data type="file" text="暂无文件" />
|
||
|
|
<no-data type="friends" text="暂无好友" />
|
||
|
|
<no-data type="internet" text="无网络连接" />
|
||
|
|
<no-data type="permissions" text="暂无权限" />
|
||
|
|
<no-data type="picture" text="暂无图片" /> */
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
.empty-container {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
/* padding: 20rpx; */
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.empty-image {
|
||
|
|
width: 400rpx;
|
||
|
|
height: 300rpx;
|
||
|
|
margin-bottom: 20rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.empty-text {
|
||
|
|
font-size: 32rpx;
|
||
|
|
color: #000;
|
||
|
|
}
|
||
|
|
</style>
|