72 lines
1.3 KiB
Vue
72 lines
1.3 KiB
Vue
|
<template>
|
|||
|
|
<view class="box">
|
|||
|
|
<image :src="image?image:images[mode]"></image>
|
|||
|
|
<slot v-if="!text">
|
|||
|
|
<view class="hiht">暂无商品，去<text @click="$emit('click')">添加商品</text></view>
|
|||
|
|
</slot>
|
|||
|
|
<view class="hiht" v-if="text" @click="$emit('click')">{{text}}</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
/**
|
|||
|
|
* steps 内容为空
|
|||
|
|
* @description 该组件用于需要加载内容，但是加载的第一页数据就为空，提示一个"没有内容"的场景
|
|||
|
|
* @property {String} mode 设置模式（默认list）
|
|||
|
|
*/
|
|||
|
|
export default {
|
|||
|
|
name: 'd-empty',
|
|||
|
|
props: {
|
|||
|
|
mode: {
|
|||
|
|
type: String,
|
|||
|
|
default: 'list'
|
|||
|
|
},
|
|||
|
|
text: {
|
|||
|
|
type: String,
|
|||
|
|
default: ''
|
|||
|
|
},
|
|||
|
|
image: {
|
|||
|
|
type: String,
|
|||
|
|
default: ''
|
|||
|
|
},
|
|||
|
|
images: {
|
|||
|
|
type: [Object,Array],
|
|||
|
|
default: () => {
|
|||
|
|
return {
|
|||
|
|
'list': '../../static/image/list.png',
|
|||
|
|
'search': '../../static/image/search.png'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.box {
|
|||
|
|
padding: 32rpx 0;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
image {
|
|||
|
|
width: 200rpx;
|
|||
|
|
height: 173rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.hiht {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #6C7380;
|
|||
|
|
margin-top: 32rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
text {
|
|||
|
|
color: #6ACDBB;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|