yihuo/pages/award_detail/product_b.vue

<template>
    <view class="paddingY20 radius10" style="background: #26273B">
        <view class="paddingX14 font4 bold color-white">商品详情</view>
        <view v-for="item in products" :key="item.spuId" class="item color-white2">
            <view class="font4 paddingX14 ">{{LEVEL_MAP[item.level].title}}: {{item.name}}</view>
            <template v-if="item.spu && item.spu.parameter">
                <view v-for="param in JSON.parse(item.spu.parameter)" :key="param.label" class="paddingX14 font4 marginT4">
                    {{param.label}}: {{param.value}}
                </view>
            </template>
            <view class="flex-align-center paddingT20">
                <image-fit :src="item.spu.cover" :offset="150" :ratio="1.25"/>
            </view>
        </view>
    </view>
</template>
<script>
import { LEVEL_MAP } from '@/utils/config'
import imageFit from '@/components/image-fit'
export default {
    components: { imageFit },
    props: {
        products: Array
    },
    data() {
        return {
            LEVEL_MAP
        }
    }
}
</script>
<style lang="scss" scoped>
.item {
    margin-top: 30rpx;
    .image {
        width: 100%;
        height: 548rpx;
    }
}
</style>