<template>
	<view class="flex items-baseline justify-center " style="justify-content: center;">
		<view v-if="!price.oldPrice"  :style="{color:newColor}" class="f10" style="transform: scale(.7);">
			¥
		</view>
		<view class="newPrice" :style="{color:newColor,fontSize:newSize}">{{price.newPrice}}</view>
		<view>
			<slot></slot>
		</view>
		<view class="oldPrice f10 t5 " v-if="price.oldPrice">{{price.oldPrice}}</view>
	</view>
</template>

<script>
	export default {
		data(){
			return {
				
			}
		},
		props:{
			newPriceSlotText:{
				type: String,
				default: ''
			},
			price:{
				type: Object,
				default: {
					newPrice:100,
					oldPrice:999
				}
			},
			newSize:{
				type: String,
				default: '28rpx'
			},
			newColor:{
				type: String,
				default: '#000000'
			},
		}
	}
</script>

<style>
	/* @font-face {
		font-family: prices;
		src: url('@/static/font/HarmonyOS_Sans_Medium.ttf');
	} */
	.newPrice{
		font-family: prices;
		font-weight: 600;
		
	}
	.oldPrice{
		text-decoration-line: line-through;
		transform: scale(.8);
		font-family: prices;
	}
</style>