mnsx/pages/exchange/exchange.vue

<template>
	<view class="recommend">
		<view class="re-list" v-for="b in bastList" :key="b.id">
			<view class="re-img">
				<image :src="b.image" mode=""></image>
			</view>
			<view class="re-right">
				<view class="re-right-top">
					{{b.store_name}}<br>
				</view>
				<view class="re-right-bottom">
					<view class="re-right-bottom-left">
						<b>￥{{b.vip_price}}</b><span>￥{{b.price}}</span>
					</view>
					<view class="re-right-bottom-right">
						<button type="default" @click="goDhqDetai(b.id)">立即购买</button>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import { getCombinationList, getProductslist, getProductHot, getIntegralList, getOrderStock ,getProductList} from '@/api/product.js';
export default {
	data() {
		return {
			bastList: []
		}
	},
	mounted() {
		this.bastList = this.$store.state.user.dhqList
	},
	methods: {
		goDhqDetai(id) {
			uni.navigateTo({
				url: '/pages/product/product?id=' + id + '&type=3'
			});
		},
	}
}
</script>

<style lang="scss" scoped>
	.re-list {
		margin: 20rpx;
		height: 280rpx;
		background-color: #FFFFFF;
		border-radius: 8rpx;
		display: flex;
		
		$wi: 200rpx;
		.re-img {
			margin: auto 0;
			image {
				width: $wi;
				height: $wi;
				border-radius: 10rpx;
				margin: 0 25rpx;
			}
		}
		
		.re-right {
			height: $wi;
			width: 100%;
			margin: auto 0;
			font-family: PingFang-SC-Medium;
			position: relative;
				
			.re-right-top {
				color: #333333;
				font-size: 30rpx;
			
				span {
					color: #DCB876;
					font-size: 22rpx;
				}
			}
			
			.re-right-bottom {
				width: 100%;
				display: flex;
				justify-content:space-between;
				position: absolute;
				bottom: 0;
					
				.re-right-bottom-left {
					height: 60rpx;
					line-height: 60rpx;
					margin: auto 0;
					font-size: 32rpx;
					color: #901B21;
					
					span {
						margin-left: 5rpx;
						color: #989B9F;
						font-size: 15rpx;
						text-decoration: line-through;
					}
				}
				
				.re-right-bottom-right {
					margin-right: 20rpx;
					
					button {
						width: 170rpx;
						background-color: #901B21;
						border-radius: 50rpx;
						height: 60rpx;
						line-height: 60rpx;
						color: #FFFFFF;
						font-size: 28rpx;
					}
				}
			}
		}
	}
</style>