zyejMAll-mobile/sheep/components/s-mof-block/s-mof-block.vue
2024-10-30 18:49:19 +08:00

280 lines
7.0 KiB
Vue

<!-- 全局 - 快捷入口 -->
<template>
<view class='new_czbk'>
<view class="t">
<text class="left-font">超值爆款</text>
<view class="sub">美好生活由此开始</view>
</view>
<view class="new-list">
<!-- <view class="item" @click="sheep.$router.go('/pages/goods/sales', {
activityType: 'recommendBest',
});"> -->
<view class="item" @click="sheep.$router.go('/pages/index/page', {
id: '19',
});">
<view class="nei">
<view class="l">
<view class="t">今日推荐</view>
<view class="c">店主诚意推荐品质商品</view>
<view class="b">
<!-- GO! -->
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/40a7582be7aeb5a6047415ab3a6728439a2798a4752ffcc1c063d66a534aa630.png"
class="img"></image>
</view>
</view>
<view class="r">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/c80faeeeb2d6dadcdbe7e6d1a4caa06869b94301612cdf157414a10559b38267.png"
class="img"></image>
</view>
</view>
</view>
<!-- <view class="item" @click="sheep.$router.go('/pages/goods/sales', {
activityType: 'recommendHot',
});"> -->
<view class="item" @click="sheep.$router.go('/pages/index/page', {
id: '21',
});">
<view class="nei">
<view class="l">
<view class="t">热门榜单</view>
<view class="c">店主诚意推荐品质商品</view>
<view class="b">
<!-- GO! -->
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/5c72fc99989bf0a7e59b57f519c76c9a98cb20478384e20b1b934aa8f80cc598.png"
class="img"></image>
</view>
</view>
<view class="r">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/904fd4848fde8025ccc17693662efd5b7bf5ec3f2656ecc7de407c8c46f910b2.png"
class="img"></image>
</view>
</view>
</view>
<!-- <view class="item" @click="sheep.$router.go('/pages/goods/sales', {
activityType: 'recommendNew',
});"> -->
<view class="item" @click="sheep.$router.go('/pages/index/page', {
id: '22',
});">
<view class="nei">
<view class="l">
<view class="t">首发新品</view>
<view class="c">新品上架等 你来拿</view>
<view class="b">
<!-- GO! -->
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/ebb2fc0512d1bd6a6d21a2c07f6603bfd2ea6f7e23377eb4cd8118d89d666589.png"
class="img"></image>
</view>
</view>
<view class="r">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/7c71cbf2c757418302ea9ef2952893c24e1d46c4cc35a821f56be0f315bcabb0.png"
class="img"></image>
</view>
</view>
</view>
<!-- <view class="item" @click="sheep.$router.go('/pages/goods/sales', {
activityType: 'recommendGood',
});"> -->
<view class="item" @click="sheep.$router.go('/pages/index/page', {
id: '23',
});">
<view class="nei">
<view class="l">
<view class="t">促销单品</view>
<view class="c">综合评选好 产品</view>
<view class="b">
<!-- GO! -->
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/aac8baa7a6feb9ee3459d1cf75ba9a7e8bacb5d93c88ac95c1b0ecd29b847f96.png"
class="img"></image>
</view>
</view>
<view class="r">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/8a61c35d82702c61f97ef3db43a8d6755b2eca3d78a22dbaa55851e815e96a23.png"
class="img"></image>
</view>
</view>
</view>
<view style="clear:both;"></view>
</view>
</view>
</template>
<script setup>
import {
reactive,
computed
} from 'vue';
import sheep from '@/sheep';
import {
showMenuTools,
closeMenuTools
} from '@/sheep/hooks/useModal';
const show = computed(() => sheep.$store('modal').menu);
function onClick(item) {
closeMenuTools();
if (item.url) sheep.$router.go(item.url);
}
const list = [{
url: '/pages/index/index',
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/f4e03230b5cb9b2bf789b67df43125af1b3cef9c2abf4d8bca8f6fa5ded16a20.png',
title: '首页',
},
{
url: '/pages/index/search',
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/96a288f2a0043c8defaa37e922828b3092ba785e1c191bf18f20dbd462261f7a.png',
title: '搜索',
},
{
url: '/pages/index/user',
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/227699332b8ae736e220852e60215072eb2805478dab4909e085f89aeb3604cf.png',
title: '个人中心',
},
{
url: '/pages/index/cart',
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/a45981116198a65db5f28ffd070f0078cfa66ac932a0136bf45ba7e8f401a1d0.png',
title: '购物车',
},
{
url: '/pages/user/goods-log',
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/7e5ecfb841f2d89b778e1070ef867c17ccda48a5fea14a149f8eb1ce6aa26a87.png',
title: '浏览记录',
},
{
url: '/pages/user/goods-collect',
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/9f83f4dc3cbf8b1e8e747f8dd79a260feaf65fa9ef3f2e2224015779f85119a1.png',
title: '我的收藏',
},
{
url: '/pages/chat/index',
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/739f3165045b1552b71176297dab45eda2e192b976e25b1a458a8781a61b7557.png',
title: '客服',
},
];
</script>
<style lang="scss" scoped>
.new_czbk {
width: 100%;
background: rgba(255, 229, 227);
border-radius: 5px;
margin: 0 auto;
padding: 5px 0;
margin-top: 10px;
padding-bottom: 10px;
padding-top: 10px;
&>.t {
display: flex;
align-items: center;
padding:0 10px;
.left-font {
color: rgba(252, 60, 62);
font-size: 17px;
font-weight: 700;
}
.sub {
background: rgba(248, 79, 43);
color: white;
border-radius: 20px 0px 20px 0px;
padding: 0 13px;
margin-left: 10px;
font-size: 13px;
}
}
.new-list {
// width: 100%;
margin-right:10px;
.item {
float: left;
width: 50%;
.nei {
margin: 10px;
margin-right:0;
margin-bottom: 0;
background: white;
border-radius: 10px;
padding: 8px 10px;
display: flex;
.l {
width: 50%;
.t {
// font-size: 17px;
}
.c {
color: rgba(153, 153, 153);
font-size: 12px;
margin: 3px 0;
}
.b {
// display: flex;
// align-items: center;
// justify-content: space-around;
// background: #329cff;
// margin: 0 3px;
// border-radius: 15px;
// color: white;
// font-weight: 700;
// padding: 0px 9px;
// font-style: oblique;
.img {
width: 76%;
height: 20px;
}
}
}
.r {
width: 49%;
.img {
width: 100%;
height: 100%;
}
}
}
}
}
}
// @media (max-width: 435px) {
// .new_czbk {
// .new-list {
// .item {
// width: 47%;
// }
// }
// }
// }
// @media (max-width: 379px) {
// .new_czbk {
// .new-list {
// .item {
// width: 46%;
// }
// }
// }
// }
</style>