402 lines
7.7 KiB
Vue
402 lines
7.7 KiB
Vue
<template>
|
|
<view class="pt20">
|
|
<view class="nav-list">
|
|
<view class="nav-item" v-if="pkCountry == 1" @click="gotoPage('/pages/product/list?cid=-1')">
|
|
<view class="nav-item-name text-ellipsis">{{ $t('ENU_MENU_303') }}</view>
|
|
<view class="nav-item-product d-b-c" v-if="recommendSpecialAreaList[0]">
|
|
<view class="nav-i-p-item" v-for="(pitem, pindex) in recommendSpecialAreaList[0].waresList" :key="pindex">
|
|
<image class="nav-i-p-item-image" :src="pitem.cover1" mode="aspectFill"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view
|
|
class="nav-item"
|
|
v-for="(item, index) in recommendSpecialAreaList"
|
|
:key="index"
|
|
v-if="item.waresList && item.waresList.length > 0"
|
|
@click="gotoPage('/pages/product/list?cid=' + item.specialArea)"
|
|
>
|
|
<view class="nav-item-name text-ellipsis">{{ item.specialAreaName }}</view>
|
|
<view class="nav-item-product d-b-c">
|
|
<view class="nav-i-p-item" v-for="(pitem, pindex) in item.waresList" :key="pindex">
|
|
<image class="nav-i-p-item-image" :src="pitem.cover1" mode="aspectFill"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- <view class="nav-item" @click="gotoPage('/pages/member-area/architecture/index')">
|
|
<view class="nav-item-name text-ellipsis">架构管理</view>
|
|
<view class="nav-item-product d-b-c" v-if="recommendSpecialAreaList[0]">
|
|
<view class="nav-i-p-item" v-for="(pitem, pindex) in recommendSpecialAreaList[0].waresList" :key="pindex">
|
|
<image class="nav-i-p-item-image" :src="pitem.cover1" mode="aspectFill"></image>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
isPop: false,
|
|
userInfo: {
|
|
pkGradeId: 0,
|
|
pkAwardsId: 0
|
|
},
|
|
pop_title: '',
|
|
pop_content: '',
|
|
advertBannerList: [],
|
|
recommendSpecialAreaList: [],
|
|
waresCoverInfoList: [],
|
|
waresVoList: [],
|
|
current: 0,
|
|
thIndex: 0,
|
|
adList: [
|
|
{
|
|
link_url: '',
|
|
file_path: '/static/temp/banner1.png'
|
|
},
|
|
{
|
|
link_url: '',
|
|
file_path: '/static/temp/banner2.png'
|
|
}
|
|
],
|
|
adList2: [
|
|
{
|
|
link_url: '',
|
|
file_path: '/static/temp/ban1.png'
|
|
},
|
|
{
|
|
link_url: '',
|
|
file_path: '/static/temp/ban2.png'
|
|
}
|
|
],
|
|
isClockMore: true,
|
|
pkCountry: 0
|
|
};
|
|
},
|
|
onShow() {
|
|
console.log(1);
|
|
this.getData();
|
|
this.getCartNum();
|
|
this.getUserInfoData();
|
|
},
|
|
methods: {
|
|
// 获取用户信息
|
|
getUserInfoData() {
|
|
let self = this;
|
|
self.loadding = true;
|
|
self._get('member/api/member/get-info', {}, function(res) {
|
|
if (res.code == 200) {
|
|
self.userInfo = res.data;
|
|
self.pkCountry = res.data.pkCountry;
|
|
self.getPop();
|
|
}
|
|
self.loadding = false;
|
|
uni.hideLoading();
|
|
});
|
|
},
|
|
getPop() {
|
|
let self = this;
|
|
self._get(
|
|
'system/api/notice/index-pop-screen',
|
|
{
|
|
grade: self.userInfo.pkGradeId,
|
|
awards: self.userInfo.pkAwardsId
|
|
},
|
|
res => {
|
|
if (res.data && res.data.length > 0) {
|
|
self.isPop = true;
|
|
self.pop_content = res.data ? res.data[0].content : '';
|
|
self.pop_title = res.data ? res.data[0].title : '';
|
|
}
|
|
}
|
|
);
|
|
},
|
|
getCartNum() {
|
|
let self = this;
|
|
self._get(
|
|
'sale/api/shopping/getShoppingCount',
|
|
{
|
|
specialArea: '',
|
|
pkCountry: ''
|
|
},
|
|
res => {
|
|
uni.setTabBarBadge({
|
|
index: 2,
|
|
text: res.data.cont + ''
|
|
});
|
|
}
|
|
);
|
|
},
|
|
getData() {
|
|
let self = this;
|
|
self._get('sale/api/wares/get-app-index', {}, res => {
|
|
console.log(res);
|
|
self.advertBannerList = res.data.advertBannerList;
|
|
self.recommendSpecialAreaList = res.data.recommendSpecialAreaList;
|
|
self.waresCoverInfoList = res.data.waresCoverInfoList;
|
|
self.waresVoList = res.data.waresVoList;
|
|
});
|
|
},
|
|
changeSwiper(e) {
|
|
this.current = e.detail.current;
|
|
},
|
|
changepackAd(e) {
|
|
this.thIndex = e.detail.current;
|
|
},
|
|
gotoWeb(url) {
|
|
this.gotoPage('/pages/webview/webview?url=' + encodeURIComponent(url));
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.product-list {
|
|
padding: 0 26rpx 0 23rpx;
|
|
}
|
|
|
|
.diy-banner-box {
|
|
// margin-bottom: 30rpx;
|
|
}
|
|
|
|
.diy-banner-box {
|
|
padding-top: 25rpx;
|
|
}
|
|
|
|
.diy-banner-box .swiper {
|
|
width: 750rpx;
|
|
height: 310rpx;
|
|
}
|
|
|
|
.diy-banner-box image {
|
|
width: 702rpx;
|
|
height: 310rpx;
|
|
margin: 0 auto;
|
|
border-radius: 25rpx;
|
|
}
|
|
|
|
.diy-banner-box .swiper-dots {
|
|
position: absolute;
|
|
bottom: 15rpx;
|
|
left: 0;
|
|
right: 0;
|
|
margin: auto;
|
|
}
|
|
|
|
.swiper-dots .swiper-dot {
|
|
width: 28rpx;
|
|
height: 6rpx;
|
|
border-radius: 3rpx;
|
|
background: #ffffff;
|
|
opacity: 0.75;
|
|
margin-right: 4rpx;
|
|
}
|
|
|
|
.swiper-dots .swiper-dot.active {
|
|
background: #f94856;
|
|
opacity: 1;
|
|
}
|
|
|
|
.top_head {
|
|
z-index: 1;
|
|
padding: 0 26rpx;
|
|
width: 750rpx;
|
|
position: sticky;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 100;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.head_top {
|
|
width: 100%;
|
|
height: var(--status-bar-height);
|
|
}
|
|
|
|
.t-i-j {
|
|
width: 180rpx;
|
|
text-align: justify;
|
|
height: 36rpx;
|
|
overflow: hidden;
|
|
line-height: 1;
|
|
}
|
|
|
|
.jus-null {
|
|
display: inline-block;
|
|
width: 100%;
|
|
}
|
|
|
|
.nav-list {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
padding: 0 24rpx;
|
|
}
|
|
|
|
.nav-item {
|
|
width: 344rpx;
|
|
// height: 222rpx;
|
|
background: #ffffff;
|
|
border-radius: 15rpx;
|
|
margin-bottom: 20rpx;
|
|
|
|
.nav-item-name {
|
|
font-size: 30rpx;
|
|
color: #333;
|
|
font-weight: bold;
|
|
padding: 0 20rpx;
|
|
height: 68rpx;
|
|
line-height: 68rpx;
|
|
background: linear-gradient(-120deg, rgba(252, 231, 228, 0.85) 0%, rgba(255, 235, 224, 0.45) 38%, rgba(253, 247, 235, 0.45) 99%);
|
|
}
|
|
|
|
.nav-item-product {
|
|
padding: 10rpx 20rpx;
|
|
}
|
|
|
|
.nav-i-p-item {
|
|
width: 140rpx;
|
|
height: 140rpx;
|
|
margin-right: 20rpx;
|
|
|
|
image {
|
|
width: 140rpx;
|
|
height: 140rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.packAdswiper-box {
|
|
width: 340rpx;
|
|
// width: 702rpx;
|
|
height: 506rpx;
|
|
position: relative;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.packAdswiper-box .swiper-dots {
|
|
position: absolute;
|
|
bottom: 15rpx;
|
|
left: 0;
|
|
right: 0;
|
|
margin: auto;
|
|
}
|
|
|
|
.packAdswiper-box .swiper-dots .swiper-dot {
|
|
width: 16rpx;
|
|
height: 16rpx;
|
|
border-radius: 50%;
|
|
background: #ffffff;
|
|
opacity: 0.75;
|
|
margin-right: 4rpx;
|
|
}
|
|
|
|
.packAdswiper-box .swiper-dots .swiper-dot.active {
|
|
background: #f94856;
|
|
opacity: 1;
|
|
}
|
|
|
|
.packAdswiper {
|
|
width: 344rpx;
|
|
// width: 702rpx;
|
|
height: 506rpx;
|
|
// border-radius: 25rpx;
|
|
margin: 0 auto;
|
|
border-radius: 15rpx;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.packAdswiper image {
|
|
width: 344rpx;
|
|
height: 506rpx;
|
|
margin: 0 auto;
|
|
border-radius: 15rpx;
|
|
}
|
|
|
|
.product-item {
|
|
width: 340rpx;
|
|
height: 506rpx;
|
|
background-color: #ffffff;
|
|
border-radius: 15rpx;
|
|
margin-bottom: 20rpx;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.product-item .product-img {
|
|
width: 100%;
|
|
height: 340rpx;
|
|
display: block;
|
|
}
|
|
|
|
.product-info {
|
|
padding: 20rpx;
|
|
}
|
|
|
|
.pop-bg {
|
|
z-index: 101;
|
|
}
|
|
|
|
.pop-content {
|
|
position: fixed;
|
|
width: 90%;
|
|
box-sizing: border-box;
|
|
z-index: 102;
|
|
left: 0;
|
|
right: 0;
|
|
margin: auto;
|
|
top: 10%;
|
|
background-color: #ffffff;
|
|
border-radius: 15rpx;
|
|
padding: 20rpx;
|
|
}
|
|
|
|
.pop-list {
|
|
max-height: 60vh;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.pop-list::-webkit-scrollbar {
|
|
/*滚动条整体样式*/
|
|
/*高宽分别对应横竖滚动条的尺寸*/
|
|
display: block;
|
|
width: 5rpx !important;
|
|
height: 1rpx !important;
|
|
-webkit-appearance: default-button;
|
|
}
|
|
|
|
.pop-list::-webkit-scrollbar-thumb {
|
|
/*滚动条里面小方块*/
|
|
border-radius: 10px;
|
|
background-color: #909399;
|
|
// background-image: -webkit-linear-gradient(45deg,
|
|
// rgba(255, 255, 255, 0.2) 25%,
|
|
// transparent 25%,
|
|
// transparent 50%,
|
|
// rgba(255, 255, 255, 0.2) 50%,
|
|
// rgba(255, 255, 255, 0.2) 75%,
|
|
// transparent 75%,
|
|
// transparent);
|
|
}
|
|
|
|
.pop-list::-webkit-scrollbar-track {
|
|
/*滚动条里面轨道*/
|
|
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
background: #ededed;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.more-btn {
|
|
margin: 0 auto;
|
|
margin-bottom: 20rpx;
|
|
background-color: #fff;
|
|
border-radius: 15rpx;
|
|
font-size: 26rpx;
|
|
color: #333;
|
|
width: 702rpx;
|
|
}
|
|
</style>
|