maishidaSJ/components/imageconver/imageconver.vue

<template>
	<view class="imageBGV">
		<image class="imagesize" :src="defimagSrc=='/static/defimages/ddd.png'?defimagSrc:baseUrl+imagSrc" mode="scaleToFill" @error="imageError(imagSrc)"></image>
		<view v-if="isyouhui" class="manjianB">
			<text>{{youhuinote}}</text>
			<image style="width: 30rpx;height: 30rpx;top: 4rpx;" src="/static/images/huorer@3x.png" mode="scaleToFill"></image>
		</view>
		<view class="remenfile" :style="isyouhui?'margin-top: -190rpx;':'margin-top: -260rpx;'">
			<uni-icons v-if="isremen"    custom-prefix="custom-icon" color="#E02F73" type="fire-filled" size="26" ></uni-icons>
		</view>
		
		<!-- <view v-if="isremen" class="tuijianB" :style="isyouhui?'margin-top: -190rpx;':'margin-top: -260rpx;'">
			<text>{{$t('comp.rementj')}}</text>
		</view> -->
	</view>
</template>

<script>
	export default {
		props:{
			imagSrc:'',
			isremen:false,
			isyouhui:false,
			youhuinote:''
		},
		data() {
			return {
				baseUrl:this.$baseImagurl,
				defimagSrc:''
			}
		},
		methods: {
			imageError(index){
				this.defimagSrc = '/static/defimages/ddd.png';//默认图片 
			},
		}
	}
</script>

<style>
	.imageBGV{
		background-color:floralwhite;
		border: 1rpx solid lightgray;
	}
	.imagesize{
		width: 100%;
		height: 100%;
	}
	.manjianB{
		position: absolute;
		width: 200rpx;
		height: 40rpx;
		margin-left: 10rpx;
		background-color: #CE366F;
		line-height: 40rpx;
		font-size: 24rpx;
		color: white;
		padding-left: 8rpx;
		border-radius:0px 10px 10px 0px;
	}
	.remenfile{
		position: absolute;
		margin-left: 10rpx;
		z-index: 9999;
	}
	.tuijianB{
		position: absolute;
		width: 120rpx;
		height: 40rpx;
		margin-left: 10rpx;
		background-color: #CE366F;
		line-height: 40rpx;
		font-size: 24rpx;
		color: white;
		padding-left: 8rpx;
		border-radius:0px 10px 10px 0px;
	}
	.textsty{
		font-size: 24rpx;
		color: white;
		padding-left: 8rpx;
		padding-right: 12rpx;
		background-color: aqua;
	}

</style>