LSM_OIL_SITE/components/oil-menu-item.vue

<template>
	<view class="radius padding-xs padding-bottom padding-top margin-top bg-white shadow solid-bottom">
		<view class="item-title ">
			<text class="margin color-000 text-bold">{{oilItem.oilName}}</text>
			<text class="fr padding-right text-sm text-grey">市场价：￥{{ oilItem.standardPrice|numberFliter}}</text>
			<PriceList :price="price" />
		</view>
	</view>
</template>

<script>
	import PriceList from '@/components/PriceList/PriceList.vue'
	export default {
		components: {
			PriceList
		},
		props: {
			oilItem: {
				type: Object,
				default () {}
			}
		},
		data() {
			return {
				price: []
			}
		},
		created() {
			console.log('之心')
			this.calcPrice()
		},
		filters: {
			numberFliter(value) {
				value = value-1+1
				if(value){
					return value.toFixed(2)
				}else{
					return '0.00'
				}
			}
		},
		methods: {
			calcPrice() {
				if (this.oilItem.xkPrice) {
					this.price.push({
						price: this.oilItem.xkPrice,
						color: '#ff0000',
						name: '星油油价',
						className1: 'red',
						className2: 'btn-red',
						free: this.oilItem.standardPrice - this.oilItem.xkPrice
					})
				}
				if (this.oilItem.wjyPrice) {
					this.price.push({
						price: this.oilItem.wjyPrice,
						color: '#f7b400',
						name: '万金油价',
						className1: 'yellow',
						className2: 'btn-yellow',
						free: this.oilItem.standardPrice - this.oilItem.wjyPrice
					})
				}
				if (this.oilItem.lvPrice) {
					this.price.push({
						price: this.oilItem.lvPrice,
						color: '#ff5200',
						name: '老吕油价',
						className1: 'laolv',
						className2: 'btn-laolv',
						free: this.oilItem.standardPrice - this.oilItem.lvPrice
					})
				}
			}

		}
	}
</script>

<style scoped>

</style>