hxj-adrioid/components/index/app-no-goods.vue

<template>
	<view class="app-no-goods dir-top-nowrap main-center cross-center bor" :class="{'fixed':fixed}" :style="{'backgroundColor': background}">
		
		<image class="icon" v-if="icon" :src="icon"></image>
		<image class="icon" v-if="is_image === 0 && !icon" src="https://shop.9026.com/web/statics/img/mall/static/no-goods.png"></image>
		<image class="icon" v-else-if="is_image === 1 && !icon" src="https://shop.9026.com/web/statics/img/mall/static/order-empty.png"></image>
		<text class="text" :style="{'color': color}">{{title}}</text>
	</view>
</template>

<script>
    export default {
        name: "app-no-goods",
	    
	    props: {
			fixed:{
				type:Boolean,
				default(){
					return false
				}
			},
            background: {
                type: String,
                default() {
                    return '#ffffff';
                }
            },
            color: {
                type: String,
                default() {
                    return '#666666';
                }
            },
		   	title: {
			   type: String,
			   default() {
				   return '没有任何商品哦~';
			   }
		   },
		   icon:{
			 type:String,
			   default(){
				   return ''
			   }
		   },
			is_image: {
				type: Number,
				default() {
					return  0;
				}
			},
	    },
    }
</script>

<style scoped lang="scss">
	.bor{
		border-top: 20rpx;
		overflow: hidden;
	}
	.app-no-goods {
		width: 100%;
		height: #{400upx};
		.icon {
			width: #{240upx};
			height: #{240upx};
		}
		.text {
			font-size: #{24upx};
			line-height: 1;
			margin-top: #{25upx};
		}
	}
	.fixed{
		position: fixed;top: 37%;left:50%;transform: translate(-50%,-50%);
	}
</style>