联调 1

parent 7e83de21
<template> <template>
<view class="card" v-for="(item, index) in cardData" :key="index"> <view @tap="toShop(item.shopId)" class="card" v-for="(item, index) in cardData" :key="index">
<image class="img" :src="item.shopLogo" mode="aspectFill" /> <image class="img" :src="item.shopLogo" mode="aspectFill" />
<view class="right"> <view class="right">
<text class="text">{{ item.shopName }}</text> <text class="text">{{ item.shopName }}</text>
...@@ -41,6 +41,11 @@ const props = defineProps({ ...@@ -41,6 +41,11 @@ const props = defineProps({
type: Array, type: Array,
}, },
}); });
const toShop = (id) => {
uni.navigateTo({
url: `/pages/shop/shop?shopId=${id}`,
});
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
......
<template> <template>
<view class="card"> <view class="card">
<view class="head" :style="{ backgroundImage: `url(${shopCardData.shopLogo})` }"> <view class="head">
<image class="imgBg" :src="shopCardData.shopLogo" mode="aspectFill" />
<view class="containerBox"> <view class="containerBox">
<image class="img" :src="shopCardData.shopLogo" mode="aspectFill" /> <image class="img" :src="shopCardData.shopLogo" mode="aspectFill" />
<view class="right"> <view class="right">
...@@ -12,8 +13,8 @@ ...@@ -12,8 +13,8 @@
<text class="four-text">1.2km</text> <text class="four-text">1.2km</text>
</view> </view>
<view class="threeBox"> <view class="threeBox">
<image class="img2" :src="shopCardData.evaluationVos[0]?.avatar" mode="aspectFill" /> <image class="img2" :src="shopCardData.evaluationVos?.[0].avatar" mode="aspectFill" />
<text class="one-text">{{ shopCardData.evaluationVos[0]?.evaluation }}</text> <text class="one-text">{{ shopCardData.evaluationVos?.[0].evaluation }}</text>
</view> </view>
<view class="labelBox"> <view class="labelBox">
<view v-for="(item, index) in shopCardData.labels" :key="index">{{ item }}</view> <view v-for="(item, index) in shopCardData.labels" :key="index">{{ item }}</view>
...@@ -55,11 +56,14 @@ const props = defineProps({ ...@@ -55,11 +56,14 @@ const props = defineProps({
.head { .head {
width: 100%; width: 100%;
height: 200rpx; height: 200rpx;
// background: url('../../static/index/test3.png') no-repeat;
background-size: 100%;
position: relative; position: relative;
backdrop-filter: blur(10px); /* 背景模糊度为10像素 */ .imgBg {
-webkit-backdrop-filter: blur(10px); /* Safari 和 Chrome 需要的前缀 */ width: 100%;
height: 200rpx;
filter: blur(16rpx);
position: absolute;
top: 0;
}
.containerBox { .containerBox {
display: flex; display: flex;
position: absolute; position: absolute;
......
...@@ -63,7 +63,7 @@ ...@@ -63,7 +63,7 @@
<image class="tou" src="../../static/index/eat.png" mode="widthFix" /> <image class="tou" src="../../static/index/eat.png" mode="widthFix" />
<text class="">附近人气美食</text> <text class="">附近人气美食</text>
</view> </view>
<view class="right"> <view class="right" @tap="more">
<text class="">立即查看</text> <text class="">立即查看</text>
<image class="jian" src="../../static/index/rightJ.png" mode="widthFix" /> <image class="jian" src="../../static/index/rightJ.png" mode="widthFix" />
</view> </view>
...@@ -239,6 +239,12 @@ const nearbyFood = () => { ...@@ -239,6 +239,12 @@ const nearbyFood = () => {
foodNearbyData.value = res.data.content; foodNearbyData.value = res.data.content;
}); });
}; };
// 附近美食查看更多
const more = () => {
xma.navigateTo({
url: '/pages/index/listFood?type=2',
});
};
// 轮播图 // 轮播图
const rotatingBroadcast = () => { const rotatingBroadcast = () => {
groupImgList().then((res) => { groupImgList().then((res) => {
...@@ -347,7 +353,7 @@ const handleClick = (e) => { ...@@ -347,7 +353,7 @@ const handleClick = (e) => {
const index = e.index; const index = e.index;
if (index === 0) { if (index === 0) {
xma.navigateTo({ xma.navigateTo({
url: '/pages/index/listFood', url: '/pages/index/listFood?type=1',
}); });
} }
}; };
......
<template> <template>
<view class="container"> <view class="container">
<view class="head"> <view class="head">
<view class="top"> <view class="top" :style="{ backgroundImage: topBg }">
<wd-icon name="thin-arrow-left" class="icon" @tap="back"></wd-icon> <wd-icon name="thin-arrow-left" class="icon" @tap="back"></wd-icon>
</view> </view>
<view class="bootom"> <view class="bootom">
...@@ -68,12 +68,26 @@ import { merchantList } from '../../api/index'; ...@@ -68,12 +68,26 @@ import { merchantList } from '../../api/index';
onMounted(() => { onMounted(() => {
getMerchantList(); getMerchantList();
}); });
onLoad((options) => {
const { type } = options;
console.log('打印', type);
switch (type) {
case '1':
topBg.value = 'url(../../static/index/taste.png)';
break;
case '2':
topBg.value = 'url(../../static/index/foodBg.png)';
break;
}
});
const business = reactive(['优选商家', '超值半价', '今日可订', '经典单人']); const business = reactive(['优选商家', '超值半价', '今日可订', '经典单人']);
const active = ref(null); const active = ref(null);
const rotate = ref(false); const rotate = ref(false);
const rotate2 = ref(false); const rotate2 = ref(false);
const rotate3 = ref(false); const rotate3 = ref(false);
const topBg = ref(null);
const back = () => { const back = () => {
xma.navigateBack({ xma.navigateBack({
delta: 1, delta: 1,
...@@ -147,7 +161,7 @@ page { ...@@ -147,7 +161,7 @@ page {
height: 480rpx; height: 480rpx;
.top { .top {
height: 356rpx; height: 356rpx;
background: url('../../static/index/taste.png'); // background: url('../../static/index/taste.png');
background-size: 100% 100%; background-size: 100% 100%;
.icon { .icon {
font-size: 28rpx; font-size: 28rpx;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment