LSM_OIL_SITE/components/oil-menu-item.vue

<template>
	<view class="radius padding-xs  padding-top    solid-top solid-bottom" >
		<view class="item-title ">
			<!-- <text class="margin color-000 text-xl  text-bold">{{oilItem.otherOilsName}}</text>
			<text class="fr padding-right text-sm text-grey">市场价：￥{{ oilItem.otherPrice|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() {
			this.calcPrice()
		},
		filters: {
			numberFliter(value) {
				value = value-1+1
				if(value){
					return value.toFixed(2)
				}else{
					return '0.00'
				}
			}
		},
		methods: {
			calcPrice() {
				if (this.oilItem.sitePrice) {
					this.price.push({
						price: this.oilItem.sitePrice,
						color: 'red',
						name: '星油油价',
						className1: 'red',
						className2: 'btn-red',
					})
				}
				if (this.oilItem.enterprisePrice) {
					this.price.push({
						price: this.oilItem.enterprisePrice,
						color: 'red',
						name: '企业油价',
						className1: 'red',
						className2: 'btn-red',
					})
				}
				
				if (this.oilItem.wjyPrice) {
					this.price.push({
						price: this.oilItem.wjyPrice,
						color: '#f7b400',
						name: '万金油价',
						className1: 'yellow',
						className2: 'btn-yellow',
					})
				}
				if (this.oilItem.lvPrice) {
					this.price.push({
						price: this.oilItem.lvPrice,
						color: '#ff5200',
						name: '老吕油价',
						className1: 'laolv',
						className2: 'btn-laolv',
					})
				}
				// if (this.oilItem.otherPrice) {
				// 	this.price.push({
				// 		price: this.oilItem.otherPrice,
				// 		color: 'black',
				// 		name: '市场价',
				// 		className1: 'laolv',
				// 		className2: 'btn-laolv',
				// 	})
				// }
				if (this.oilItem.marketPrice) {
					this.price.push({
						price: this.oilItem.marketPrice,
						color: '#ff5200',
						name: '发改委价',
						className1: 'laolv',
						className2: 'btn-laolv',
					})
				}
				if (this.oilItem.sitePrice) {
					this.price.push({
						price: this.oilItem.sitePrice,
						color: '#ff5200',
						name: '油机价',
						className1: 'laolv',
						className2: 'btn-laolv',
					})
				}
			}

		}
	}
</script>

<style scoped>

</style>