3133 lines
96 KiB
Vue
3133 lines
96 KiB
Vue
<template>
|
||
<scroll-view class="main" scroll-y @scroll="handlePageScroll" :scroll-into-view="scrollView" scroll-with-animation
|
||
@scrolltolower="handleScrollBottom">
|
||
<div id="navItem" class="header" :style="{
|
||
paddingTop: menu.top + menu.height + 'px',
|
||
backgroundImage:
|
||
pageType === 'UnionMall'
|
||
? 'url(https://eshangtech.com/minTestImg/unionMallBg.png)'
|
||
: 'url(https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/indexBg.png)',
|
||
backgroundSize:
|
||
pageType === 'UnionMall' ? '100% 480rpx' : '100% 300rpx',
|
||
}">
|
||
<view class="headerTop" :style="{
|
||
height: menu.top + menu.height + 'px',
|
||
paddingTop: menu.top + 'px',
|
||
backgroundImage:
|
||
pageType === 'UnionMall'
|
||
? 'url(https://eshangtech.com/minTestImg/unionMallBg.png)'
|
||
: 'url(https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/indexBg.png)',
|
||
backgroundSize:
|
||
pageType === 'UnionMall' ? '100% 480rpx' : '100% 300rpx',
|
||
}">
|
||
<image class="backArrow" src="/static/images/home/backArrowWhite.svg" @click="handleBackHome" />
|
||
<view class="pageName">{{
|
||
pageType === "UnionMall" ? "工会之家" : "彩云驿商城"
|
||
}}</view>
|
||
<view class="backArrow"></view>
|
||
</view>
|
||
|
||
<scroll-view class="typeBox" :style="{ top: menu.bottom + 66 + 'px' }" scroll-x>
|
||
<div class="contentBox" :style="{
|
||
height:
|
||
shopTypeList.length < 5
|
||
? '144rpx'
|
||
: shopTypeList.length === 5
|
||
? Math.ceil(6 / 5) * 144 +
|
||
(Math.ceil(6 / 5) - 1) * 42 +
|
||
60 +
|
||
'rpx'
|
||
: Math.ceil(shopTypeList.length / 5) * 144 +
|
||
(Math.ceil(shopTypeList.length / 5) - 1) * 42 +
|
||
60 +
|
||
'rpx',
|
||
}">
|
||
<!-- height:
|
||
shopTypeList.length < 5
|
||
? '144rpx'
|
||
: Math.ceil(shopTypeList.length / 5) * 144 +
|
||
(Math.ceil(shopTypeList.length / 5) - 1) * 42 +
|
||
60 +
|
||
'rpx', -->
|
||
|
||
<!-- :style="{
|
||
width:
|
||
shopTypeList.length <= 5
|
||
? '100%'
|
||
: shopTypeList.length * 136 + 60 + 'rpx',
|
||
}" -->
|
||
<!-- 工会之家 -->
|
||
<div class="rowBox" @click="handleGoUnionMall" v-if="pageType !== 'UnionMall'">
|
||
<div class="imgBox">
|
||
<div class="itemImgBox">
|
||
<image class="img" src="/static/images/home/unionMallIcon.svg"></image>
|
||
</div>
|
||
</div>
|
||
<div class="itemName">工会之家</div>
|
||
</div>
|
||
|
||
<div class="rowBox" v-for="(item, index) in shopTypeList" :key="index" @click="handleGoShopPage(item, index)"
|
||
:style="{
|
||
// width: pageType === 'UnionMall' ? '25%' : '20%',
|
||
width: pageType === 'UnionMall' ? '25%' : '20%',
|
||
marginBottom:
|
||
pageType === 'UnionMall' &&
|
||
index < Math.ceil(shopTypeList.length / 4 - 1) * 4
|
||
? '44rpx'
|
||
: '',
|
||
marginTop: pageType !== 'UnionMall' && index >= 4 ? '44rpx' : '',
|
||
}">
|
||
<div class="imgBox">
|
||
<div class="itemImgBox">
|
||
<image class="img" :src="item.UserdefinedType_ICO ||
|
||
'/static/images/home/defultImg.png'
|
||
"></image>
|
||
</div>
|
||
</div>
|
||
<div class="itemName">{{ item.UserdefinedType_Name }}</div>
|
||
</div>
|
||
|
||
<!-- 积分商城 -->
|
||
<div class="rowBox" @click="handleGoPointsMall" v-if="pageType !== 'UnionMall'">
|
||
<div class="imgBox">
|
||
<div class="itemImgBox">
|
||
<image class="img" src="/static/images/home/markShopIcon.png"></image>
|
||
</div>
|
||
</div>
|
||
<div class="itemName">积分商城</div>
|
||
</div>
|
||
|
||
<!-- <div
|
||
class="rowBox"
|
||
:style="{
|
||
width: oneRowNumber <= 5 ? 'calc(20% - 6px)' : '136rpx',
|
||
paddingRight:
|
||
index + 1 === oneRowNumber || index + 1 === oneRowNumber * 2
|
||
? '0'
|
||
: '40rpx',
|
||
marginBottom: index + 1 > oneRowNumber ? '0' : '40rpx',
|
||
}"
|
||
v-for="(item, index) in shopTypeList"
|
||
:key="index"
|
||
@click="handleGoShopPage(item, index)"
|
||
>
|
||
<div class="imgBox">
|
||
<div class="itemImgBox">
|
||
<image
|
||
class="img"
|
||
:src="
|
||
item.UserdefinedType_ICO ||
|
||
'/static/images/home/defultImg.png'
|
||
"
|
||
></image>
|
||
</div>
|
||
</div>
|
||
<div class="itemName">{{ item.UserdefinedType_Name }}</div>
|
||
</div> -->
|
||
</div>
|
||
</scroll-view>
|
||
</div>
|
||
|
||
<div class="pageContent">
|
||
<!-- 公告 -->
|
||
<div class="noticeBox" @click="handleGoNotice" v-if="false">
|
||
<div class="noticeLeft">
|
||
<image class="noticeIcon" src="/static/images/home/noticeIcon.png" />
|
||
<text class="noticeTitle">公告</text>
|
||
<text class="noticeContent">2025年春节购物通知</text>
|
||
</div>
|
||
<div class="noticeRight">
|
||
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/rightArrow.png" />
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 活动 -->
|
||
<div class="advertisement" v-if="haveActivity" :style="{
|
||
background: pageType !== 'UnionMall' ? '#fff' : 'transparent',
|
||
}">
|
||
<div class="advertisementContentBox" v-if="pageType !== 'UnionMall'" @click="handleGoActivityType">
|
||
<div class="advertisementTop">
|
||
<div class="title">
|
||
{{ activityObj.UserdefinedType_Name || "" }}
|
||
<!-- <image
|
||
class="titleImg"
|
||
src="https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/title1st.png"
|
||
/> -->
|
||
</div>
|
||
<!-- <div class="moreBox">
|
||
<text class="moreText">低价爆品天天有</text>
|
||
<image
|
||
class="rightIcon"
|
||
src="https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/rightArrow.png"
|
||
/>
|
||
</div> -->
|
||
</div>
|
||
|
||
<scroll-view class="shopList" scroll-x v-if="activityShopList && activityShopList.length > 0">
|
||
<!-- @click="handleGoShop(item)"-->
|
||
<div :style="{
|
||
width: activityShopList.length * 160 + 'rpx',
|
||
height: '100%',
|
||
whiteSpace: 'noWrap',
|
||
}">
|
||
<div class="shopItem" v-for="(item, index) in activityShopList" :key="index"
|
||
@click.stop="handleGoShopDetail(item)">
|
||
<div class="shopItemImg">
|
||
<div class="imgBox">
|
||
<image class="shopImg" :src="item.IMAGE_PATH || '/static/images/home/defultImg.png'
|
||
" />
|
||
</div>
|
||
<text class="discountedPrice">¥{{ item.bigNumber || "" }}.{{
|
||
item.smallNumber || "00"
|
||
}}</text>
|
||
</div>
|
||
<!-- <text class="price">¥15.99</text>-->
|
||
</div>
|
||
</div>
|
||
</scroll-view>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 每周特惠 -->
|
||
<div class="advertisement" :style="{
|
||
background: pageType !== 'UnionMall' ? '#fff' : 'transparent',
|
||
}">
|
||
<div class="advertisementContentBox" v-if="pageType !== 'UnionMall'" @click="handleGoShopList(4597, 0)">
|
||
<div class="advertisementTop">
|
||
<div class="title">
|
||
每周特惠
|
||
<!-- <image class="titleImg" src="https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/title1st.png" /> -->
|
||
</div>
|
||
<div class="moreBox">
|
||
<!-- <text class="moreText">低价爆品天天有</text> -->
|
||
<image class="rightIcon" src="https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/rightArrow.png" />
|
||
</div>
|
||
</div>
|
||
|
||
<scroll-view class="shopList" scroll-x>
|
||
<!-- @click="handleGoShop(item)"-->
|
||
<div :style="{
|
||
width: weeklySpecialOffer.length * 160 + 'rpx',
|
||
height: '100%',
|
||
whiteSpace: 'noWrap',
|
||
}">
|
||
<div class="shopItem" v-for="(item, index) in weeklySpecialOffer" :key="index"
|
||
@click.stop="handleGoShopDetail(item)">
|
||
<div class="shopItemImg">
|
||
<div class="imgBox">
|
||
<image class="shopImg" :src="item.IMAGE_PATH || '/static/images/home/defultImg.png'
|
||
" />
|
||
</div>
|
||
<text class="discountedPrice">¥{{ item.bigNumber || "" }}.{{
|
||
item.smallNumber || "00"
|
||
}}</text>
|
||
</div>
|
||
<!-- <text class="price">¥15.99</text>-->
|
||
</div>
|
||
</div>
|
||
</scroll-view>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 特价优惠 -->
|
||
<div class="advertisement" :style="{
|
||
background: pageType !== 'UnionMall' ? '#fff' : 'transparent',
|
||
}">
|
||
<div class="advertisementContentBox" v-if="pageType !== 'UnionMall'" @click="handleGoShopList(3186, 1)">
|
||
<div class="advertisementTop">
|
||
<div class="title">
|
||
绿色云品
|
||
<!-- <image class="titleImg" src="https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/title1st.png" /> -->
|
||
</div>
|
||
<div class="moreBox">
|
||
<!-- <text class="moreText">低价爆品天天有</text> -->
|
||
<text class="moreText">更多</text>
|
||
<image class="rightIcon" src="https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/rightArrow.png" />
|
||
</div>
|
||
</div>
|
||
|
||
<scroll-view class="shopList" scroll-x>
|
||
<!-- @click="handleGoShop(item)"-->
|
||
<div :style="{
|
||
width: specialOffersList.length * 160 + 'rpx',
|
||
height: '100%',
|
||
whiteSpace: 'noWrap',
|
||
}">
|
||
<div class="shopItem" v-for="(item, index) in specialOffersList" :key="index"
|
||
@click.stop="handleGoShopDetail(item)">
|
||
<div class="shopItemImg">
|
||
<div class="imgBox">
|
||
<image class="shopImg" :src="item.IMAGE_PATH || '/static/images/home/defultImg.png'
|
||
" />
|
||
</div>
|
||
<text class="discountedPrice">¥{{ item.bigNumber || "" }}.{{
|
||
item.smallNumber || "00"
|
||
}}</text>
|
||
</div>
|
||
<!-- <text class="price">¥15.99</text>-->
|
||
</div>
|
||
</div>
|
||
</scroll-view>
|
||
</div>
|
||
|
||
<!-- 工会之家的时候 显示排行榜 -->
|
||
|
||
<div class="sortBox" v-if="pageType === 'UnionMall'">
|
||
<div class="leftSortBox" @click="handleGoSortList(1)">
|
||
<div class="titleTopSort">
|
||
<!-- 新品榜 -->
|
||
<text class="title"><text style="color: red">新</text>品榜</text>
|
||
</div>
|
||
<div class="notice">超多优惠等你来</div>
|
||
<view class="shopList">
|
||
<view class="shopItem" v-for="(item, index) in newShopList" :key="index"
|
||
:style="{ marginRight: index === 0 ? '16rpx' : '' }">
|
||
<image class="shopImg" :src="item.IMAGE_PATH" @click.stop="handleGoShopDetail(item)" />
|
||
</view>
|
||
</view>
|
||
</div>
|
||
|
||
<div class="rightItem bg2" style="margin-right: 16rpx" @click="handleGoSortList(2)">
|
||
<div class="titleTopSort">
|
||
<text class="title"><text style="color: #ff8000">热</text>销榜</text>
|
||
</div>
|
||
<div class="notice">本地特色</div>
|
||
<view class="shopList">
|
||
<view class="shopItem" v-for="(item, index) in hotShopList" :key="index">
|
||
<image class="shopImg" :src="item.IMAGE_PATH" @click.stop="handleGoShopDetail(item)" />
|
||
</view>
|
||
</view>
|
||
</div>
|
||
<div class="rightItem bg3" @click="handleGoSortList(3)">
|
||
<div class="titleTopSort">
|
||
<text class="title"><text style="color: #1ca038">推</text>荐榜</text>
|
||
</div>
|
||
<div class="notice">本地特色</div>
|
||
<view class="shopList">
|
||
<view class="shopItem" v-for="(item, index) in goodShopList" :key="index">
|
||
<image class="shopImg" :src="item.IMAGE_PATH" @click.stop="handleGoShopDetail(item)" />
|
||
</view>
|
||
</view>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- <div class="advertisementContentBox" v-if="pageType === 'UnionMall'">
|
||
<div class="advertisementTopUnionMall">
|
||
<div class="title">商品排行</div>
|
||
<div class="moreBox">
|
||
<image class="rightIcon" src="https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/rightArrow.png" />
|
||
</div>
|
||
</div>
|
||
<div class="UnionMallShopList"> -->
|
||
|
||
<!-- <div class="rowBox" @click="handleGoSortList(1)">
|
||
<div class="imgBox">
|
||
<div class="itemImgBox">
|
||
<image class="img" src='/static/images/home/defultImg.png'></image>
|
||
</div>
|
||
</div>
|
||
<div class="itemName">新品榜</div>
|
||
</div>
|
||
<div class="rowBox" @click="handleGoSortList(2)">
|
||
<div class="imgBox">
|
||
<div class="itemImgBox">
|
||
<image class="img" src='/static/images/home/defultImg.png'></image>
|
||
</div>
|
||
</div>
|
||
<div class="itemName">热销榜</div>
|
||
</div>
|
||
<div class="rowBox" @click="handleGoSortList(3)">
|
||
<div class="imgBox">
|
||
<div class="itemImgBox">
|
||
<image class="img" src='/static/images/home/defultImg.png'></image>
|
||
</div>
|
||
</div>
|
||
<div class="itemName">推荐榜</div>
|
||
</div> -->
|
||
<!-- </div>
|
||
</div> -->
|
||
</div>
|
||
|
||
<!-- 今日推荐 -->
|
||
<div class="advertisementSecond">
|
||
<div class="advertisementItem" @click="handleGoShopList(3175, 2)" v-if="pageType !== 'UnionMall'">
|
||
<div class="advertisementItemContent">
|
||
<div class="contentTop">
|
||
<div class="title">
|
||
自有品牌
|
||
<!-- <image class="titleImg" src="https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/today3st.png" /> -->
|
||
</div>
|
||
<div class="moreBox">
|
||
<text class="moreText">更多</text>
|
||
<image class="rightIcon" src="https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/rightArrow.png" />
|
||
</div>
|
||
</div>
|
||
|
||
<!-- <div class="shopDesc">精品优选</div> -->
|
||
|
||
<scroll-view class="shopItemList" scroll-x>
|
||
<div :style="{
|
||
width: todayOffersList.length * 160 + 'rpx',
|
||
height: '100%',
|
||
whiteSpace: 'noWrap',
|
||
}">
|
||
<!-- @click="handleGoShop(item)"-->
|
||
<div class="shopItem" v-for="(item, index) in todayOffersList" :key="index"
|
||
@click.stop="handleGoShopDetail(item)">
|
||
<div class="imgBox">
|
||
<image class="shopImg" :src="item.IMAGE_PATH || '/static/images/home/defultImg.png'
|
||
" />
|
||
</div>
|
||
<text class="shopImgText">¥{{ item.bigNumber || "" }}.{{
|
||
item.smallNumber || "00"
|
||
}}</text>
|
||
<!-- {{ item.bigNumber
|
||
}}<text class="shopSmallText">{{
|
||
item.smallNumber ? "." + item.smallNumber : ".00"
|
||
}}</text> -->
|
||
</div>
|
||
</div>
|
||
</scroll-view>
|
||
</div>
|
||
</div>
|
||
<!-- 精选品牌 -->
|
||
<div class="advertisementItemUnionMall" v-if="pageType === 'UnionMall'">
|
||
<div class="advertisementItemContent">
|
||
<div class="contentTopUnionMall">
|
||
<div class="title">精选品牌</div>
|
||
</div>
|
||
<view class="shopItemList">
|
||
<view class="shopItem" v-for="(item, index) in brandList" :key="index" @click="handleSearchBrand(item)"
|
||
:style="{ marginBottom: index <= 4 ? '16rpx' : '' }">
|
||
<image class="imgBox" :src="item.src" />
|
||
<text class="imgText">{{ item.label }}</text>
|
||
<!-- <view class="imgBox">{{ item.label }}</view> -->
|
||
</view>
|
||
</view>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 甄选商品 -->
|
||
<div class="allShopList">
|
||
<template v-if="pageType !== 'UnionMall'">
|
||
<view class="allShopTitle">积分商城</view>
|
||
<view class="jfDescBox">
|
||
<image mode="widthFix" class="descImg" src="https://eshangtech.com/ShopICO/ahyd-mall/descImg.png" />
|
||
</view>
|
||
<!-- <scroll-view class="allTypeBox" scroll-x="true">
|
||
<div :class="selectProducts === item.UserdefinedType_Id
|
||
? 'typeItem selectTypeItem'
|
||
: 'typeItem'
|
||
" v-for="(item, index) in shopTypeList" :key="index" @click="handleChangeShopMallType(item)">
|
||
{{ item.UserdefinedType_Name }}
|
||
</div>
|
||
</scroll-view> -->
|
||
|
||
<!-- <scroll-view class="allShopListContent" scroll-y="true" @scrolltolower="handleToBottomproductsList">
|
||
<view class="buyShopItem" v-for="(item, index) in productsList" :key="index"
|
||
:style="{ marginRight: index % 2 === 0 ? '22rpx' : '' }">
|
||
<div class="shopImgContent">
|
||
<image class="shopImage" :src="item.IMAGE_PATH" />
|
||
</div>
|
||
<div class="priceBox">
|
||
<div class="shopName">{{ item.COMMODITY_NAME }}</div>
|
||
<view class="retailPrice">¥{{ item.RETbigNumber || "" }}.{{
|
||
item.RETsmallNumber || "00"
|
||
}}</view>
|
||
<view class="nowPrice">
|
||
<text class="unit">¥</text>
|
||
<text class="price">{{ item.bigNumber || "" }}.{{
|
||
item.smallNumber || "00"
|
||
}}</text>
|
||
</view>
|
||
</div>
|
||
</view>
|
||
</scroll-view> -->
|
||
<div class="allShopListContent">
|
||
<div class="buyShopItem" v-for="(item, index) in productsList" :key="index"
|
||
@click.stop="handleGoShopDetail(item)">
|
||
<div class="shopImgContent">
|
||
<image class="shopImage" :src="item.IMAGE_PATH" />
|
||
</div>
|
||
<div class="priceBox">
|
||
<div class="shopName">{{ item.COMMODITY_NAME }}</div>
|
||
<!-- <view class="retailPrice"
|
||
>¥{{ item.RETbigNumber || "" }}.{{
|
||
item.RETsmallNumber || "00"
|
||
}}</view
|
||
> -->
|
||
<view style="
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-top: 12rpx;
|
||
">
|
||
<view class="nowPrice">
|
||
<text class="unit">¥</text>
|
||
<text class="price">{{ item.bigNumber || "" }}.{{
|
||
item.smallNumber || "00"
|
||
}}</text>
|
||
</view>
|
||
|
||
<view class="shopState" v-if="!(item.COMMODITY_STOCK > 0)">已售罄</view>
|
||
</view>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<view class="inBottom" v-if="shopMsg.isOver">
|
||
<text class="bottomText">我是有底线的</text>
|
||
</view>
|
||
</template>
|
||
|
||
<!-- 随机商品 -->
|
||
<div class="shopLovely" v-if="pageType === 'UnionMall'">
|
||
<!-- :style="{ paddingBottom: `${50}px` }" -->
|
||
|
||
<view class="shopLovelyTop">
|
||
<text class="shopLovelyTitle">猜你喜欢</text>
|
||
<view class="shopLovelyRight" @click="handleShowPricePopup">
|
||
<image class="filterIcon" src="/static/images/home/filterIcon.svg" />
|
||
<text class="filterText">筛选</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="shopLovelyList">
|
||
<!-- scroll-y="true"
|
||
@scrolltolower="handleToBottom" -->
|
||
<view class="shopLovelyItem" v-for="(item, index) in showShopList" :key="index"
|
||
:style="{ marginRight: index % 2 === 0 ? '22rpx' : '' }" @click.stop="handleGoShopDetail(item)">
|
||
<div class="shopImgContent">
|
||
<image class="shopImage" :src="item.IMAGE_PATH" />
|
||
</div>
|
||
<div class="priceBox">
|
||
<div class="shopName">{{ item.COMMODITY_NAME }}</div>
|
||
<!-- <view class="retailPrice"
|
||
>¥{{ item.RETbigNumber || "" }}.{{
|
||
item.RETsmallNumber || "00"
|
||
}}</view
|
||
> -->
|
||
<view style="
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-top: 12rpx;
|
||
">
|
||
<view class="nowPrice">
|
||
<text class="unit">¥</text>
|
||
<text class="price">{{ item.bigNumber || "" }}.{{
|
||
item.smallNumber || "00"
|
||
}}</text>
|
||
</view>
|
||
|
||
<view class="shopState" v-if="!(item.COMMODITY_STOCK > 0)">已售罄</view>
|
||
</view>
|
||
</div>
|
||
</view>
|
||
</view>
|
||
<view class="inBottom" v-if="showShopList && showShopList.length > 0">
|
||
<text class="bottomText">{{
|
||
shopMsg.isOver ? "我是有底线的" : "下拉加载更多"
|
||
}}</text>
|
||
</view>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<uni-popup ref="priceRangeRef" @maskClick="handleMaskClick">
|
||
<view class="priceRangeBox">
|
||
<view class="titleBox">
|
||
<view class="closeIcon"></view>
|
||
<text class="title">价格区间</text>
|
||
<image class="closeIcon" src="/static/images/home/closeIcon.svg" @click="handleClosePricePopup" />
|
||
</view>
|
||
|
||
<view class="inputBox">
|
||
<view class="inputItem">
|
||
<input placeholder="最低价" v-model="minPrice" type="number" />
|
||
</view>
|
||
<span class="unit">-</span>
|
||
<view class="inputItem">
|
||
<input placeholder="最高价" v-model="maxPrice" type="number" />
|
||
</view>
|
||
</view>
|
||
|
||
<view class="inputBox" style="box-sizing: border-box; padding-left: 24rpx">
|
||
<input style="width: 100%" placeholder="商品名称" v-model="searchShopName" />
|
||
</view>
|
||
|
||
<view class="btnList">
|
||
<view class="cancelBtn" @click="handleReset">重置</view>
|
||
<view class="confirmBtn" @click="handleConfirm">确认</view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
|
||
<uni-popup ref="noticeRef" v-if="false">
|
||
<view class="noticePopup" @click="handleHidePopup">
|
||
<view class="popupContent">
|
||
<view class="title">尊敬的会员：</view>
|
||
<view class="contentText">因春节期间暂停发货服务，为确保您在本平台良好的购物体验，请您阅知如下购物须知：</view>
|
||
|
||
<view class="title textIndent">一、发货服务暂停时间：</view>
|
||
<view class="contentText">期间平台商城所有商品均可正常下单，2025年2月5日起按照下单顺序陆续发货；</view>
|
||
|
||
<view class="title textIndent">二、如遇问题，请垂询以下联系方式：</view>
|
||
<view class="contentText">客服顾顾：18788508349</view>
|
||
<view class="contentText">客服晶晶：13508825566</view>
|
||
<view class="contentText">客服值班时间：上午9:00—下午18:00</view>
|
||
|
||
<view class="title textIndent">三、会员下单视为接受购物须知；</view>
|
||
<view class="contentText">在2025年春节即将来临之际，云南交投集团经营开发有限公司彩云驿商业管理分公司全体员工提前恭祝您及家人：新春愉快、阖家欢乐！</view>
|
||
<view class="contentText">衷心感谢您对本平台的鼎力支持，我们将为您提供始终如一的优质服务！</view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
|
||
<!-- 回到顶部 -->
|
||
<view class="backTopBox" v-if="showBackTop && priceRangeRefShow === false" @click="handleGoBack">
|
||
<image class="backIcon" src="/static/images/home/backTopIcon.png" />
|
||
</view>
|
||
|
||
<shop-tabbar :page="`/pages/shopMallPage/index/index`" :pageType="pageType" :shopCarLength="shopCarListCount" />
|
||
</scroll-view>
|
||
</template>
|
||
|
||
<script>
|
||
import shopTabbar from "../../../components/shopTabbar.vue";
|
||
export default {
|
||
components: { shopTabbar },
|
||
data() {
|
||
return {
|
||
menu: {},
|
||
specialOffersList: [], // 特价优惠
|
||
weeklySpecialOffer: [], // 每周特惠
|
||
todayOffersList: [], // 今日推荐
|
||
shopTypeList: [], // 商品大类数组
|
||
oneRowNumber: 0, // 单行个数
|
||
productsList: [], // 甄选商品
|
||
selectProducts: 0, // 选择的甄选商品类型
|
||
pageType: "", // 页面类型
|
||
brandList: [
|
||
{ label: "蓝月亮", value: 1, src: "/static/images/home/1.png" },
|
||
{ label: "洁柔", value: 2, src: "/static/images/home/2.png" },
|
||
{ label: "新希望", value: 3, src: "/static/images/home/3.png" },
|
||
{ label: "八宝贡", value: 4, src: "/static/images/home/4.png" },
|
||
{ label: "福临门", value: 5, src: "/static/images/home/5.png" },
|
||
{ label: "金丝莉", value: 6, src: "/static/images/home/6.png" },
|
||
{ label: "良品铺子", value: 7, src: "/static/images/home/7.png" },
|
||
{ label: "云南白药", value: 8, src: "/static/images/home/8.png" },
|
||
{ label: "德和", value: 9, src: "/static/images/home/9.png" },
|
||
{ label: "蔬果园", value: 10, src: "/static/images/home/10.png" },
|
||
], // 热门品牌类型
|
||
minPrice: 10, // 最低价
|
||
maxPrice: 100, // 最高价
|
||
allShopList: [], // 工会之家时拿到的全部商品
|
||
showShopList: [], // 当前显示的全部商品
|
||
pageIndex: 1, // 当前显示几个 10个商品
|
||
shopMsg: {
|
||
pageIndex: 1,
|
||
pageSize: 6,
|
||
isOver: false,
|
||
},
|
||
havePrice: false, // 有无价格区间查询
|
||
newShopList: [], // 新品榜
|
||
hotShopList: [], // 热销榜
|
||
goodShopList: [], // 推荐榜
|
||
shopCarListCount: 0, // 购物车商品数量
|
||
sortType: 0, // 这一次的排序方法
|
||
sortTypeList: [
|
||
"COMMODITYTYPE_CODE",
|
||
"COMMODITY_BARCODE",
|
||
"COMMODITY_ID",
|
||
"COMMODITY_EN",
|
||
],
|
||
isFirst: false,
|
||
searchShopName: "", // 搜索商品的名称
|
||
showBackTop: false, // 页面滚动距离
|
||
scrollView: "",
|
||
safeHeight: 0, // ios的安全距离
|
||
haveActivity: false, // 是否有活动
|
||
activityObj: {}, // 活动项的具体内容
|
||
activityShopList: [], // 活动商品列表
|
||
priceRangeRefShow: false
|
||
};
|
||
},
|
||
async onLoad(query) {
|
||
console.log("query", query);
|
||
this.menu = uni.getMenuButtonBoundingClientRect();
|
||
this.pageType = query.pageType;
|
||
// 判断这个用户是不是第一次进入到商城
|
||
let firstEntry = uni.getStorageSync("firstEntry");
|
||
if (firstEntry === "2") {
|
||
} else {
|
||
this.isFirst = true;
|
||
// this.$refs.noticeRef.open("center");
|
||
uni.setStorageSync("firstEntry", "2");
|
||
}
|
||
let safeHeight = uni.getStorageSync("safeHeight");
|
||
if (safeHeight) {
|
||
this.safeHeight = Number(safeHeight);
|
||
}
|
||
this.$utils.addUserBehaviorNew();
|
||
// if (query && query.recommendCode && query.recommendId) {
|
||
// this.$utils.addUserBehaviorNew(null,true);
|
||
// console.log("this.globalData", this.globalData);
|
||
|
||
// this.globalData.recommendCode = query.recommendCode;
|
||
// this.globalData.recommendId = query.recommendId;
|
||
// }
|
||
// this.globalData.recommendCode = 1111;
|
||
// this.globalData.recommendId = 2222;
|
||
|
||
if (query.pageType === "UnionMall") {
|
||
// 拿到顶部商品大类的方法
|
||
// const data = await this.$api.getCoop({
|
||
// action_type: "WeChat_GetMallGoodsType",
|
||
// ownerUnitId: 911,
|
||
// commodityNature: 5070,
|
||
// });
|
||
const data = await this.$api.$javaGet(
|
||
'/third-party/getWeChatGetMallGoodsType',
|
||
{
|
||
ownerUnitId: 911,
|
||
commodityNature: 5070,
|
||
}
|
||
)
|
||
console.log("handleGetShopBigType", data);
|
||
let typeList = data.Data.List || [];
|
||
let obj = {};
|
||
let resList = [];
|
||
let indexOfList = [1253, 1249, 1250, 3176];
|
||
|
||
if (typeList && typeList.length > 0) {
|
||
typeList.forEach((item) => {
|
||
if (indexOfList.indexOf(item.UserdefinedType_Id) !== -1) {
|
||
resList.push(item);
|
||
}
|
||
// if (item.UserdefinedType_Id === 1253) {
|
||
// obj = item;
|
||
// }
|
||
});
|
||
}
|
||
|
||
// let resList = obj.UserdefinedTypeList.slice(0, 8);
|
||
this.sortType = Math.floor(Math.random() * this.sortTypeList.length);
|
||
console.log("this.sortType", this.sortType);
|
||
console.log("resList", resList);
|
||
|
||
// 2025-04-02 写死4个 类型
|
||
let newList = [
|
||
{
|
||
UserdefinedTypeList: [],
|
||
UserdefinedType_Desc: "",
|
||
UserdefinedType_ICO: "",
|
||
UserdefinedType_Id: 3176,
|
||
UserdefinedType_Index: 95,
|
||
UserdefinedType_Name: "节日慰问",
|
||
UserdefinedType_PId: "-1",
|
||
},
|
||
{
|
||
UserdefinedTypeList: [],
|
||
UserdefinedType_Desc: "",
|
||
UserdefinedType_ICO:
|
||
"https://user.eshangtech.com//UploadImageDir/PictureManage/11423/2025_01_12_23_28_36_3470.png",
|
||
UserdefinedType_Id: 1250,
|
||
UserdefinedType_Index: 60,
|
||
UserdefinedType_Name: "观影优惠",
|
||
UserdefinedType_PId: -1,
|
||
},
|
||
{
|
||
UserdefinedTypeList: [],
|
||
UserdefinedType_Desc: "",
|
||
UserdefinedType_ICO:
|
||
"https://user.eshangtech.com//UploadImageDir/PictureManage/11423/2025_01_12_23_28_19_4327.png",
|
||
UserdefinedType_Id: 1249,
|
||
UserdefinedType_Index: 58,
|
||
UserdefinedType_Name: "品质蛋糕",
|
||
UserdefinedType_PId: -1,
|
||
},
|
||
{
|
||
UserdefinedTypeList: [],
|
||
UserdefinedType_Desc: "",
|
||
UserdefinedType_ICO:
|
||
"https://user.eshangtech.com//UploadImageDir/PictureManage/11462/2025_01_12_22_58_33_6953.png",
|
||
UserdefinedType_Id: "工会活动",
|
||
UserdefinedType_Index: "",
|
||
UserdefinedType_Name: "工会活动",
|
||
UserdefinedType_PId: -1,
|
||
},
|
||
];
|
||
|
||
this.shopTypeList = resList;
|
||
// this.shopTypeList = newList;
|
||
// 拿到榜单的方法
|
||
this.handleGetSortList();
|
||
// 拿到工会之家的商品列表
|
||
this.handleGetUnionShopList();
|
||
} else {
|
||
// uni.showLoading({
|
||
// title: "加载中"
|
||
// })
|
||
|
||
// 拿到每周优惠的内容
|
||
this.handleGetEveryWeekShop()
|
||
// 拿到顶部商品大类的方法
|
||
await this.handleGetShopBigType();
|
||
// 拿到特价优惠的
|
||
this.handleGetSpecialOffers();
|
||
// 拿到今日推荐的商品列表
|
||
this.handleGetTodayOffers();
|
||
// 最下面的甄选商品
|
||
this.handleGetProductsList();
|
||
if (this.haveActivity) {
|
||
this.handleGetActivityList();
|
||
}
|
||
// uni.hideLoading()
|
||
}
|
||
},
|
||
onShow() {
|
||
// 判断当前的购物车里面是否有东西
|
||
let shopCarList = [];
|
||
if (this.pageType === "UnionMall") {
|
||
shopCarList = this.$store.state.unionMyShopCar;
|
||
} else {
|
||
shopCarList = this.$store.state.myShopCar;
|
||
}
|
||
console.log("shopCarList", shopCarList);
|
||
let count = 0;
|
||
if (shopCarList && shopCarList.length > 0) {
|
||
shopCarList.forEach((item) => {
|
||
count += item.count;
|
||
});
|
||
}
|
||
this.shopCarListCount = count;
|
||
},
|
||
onReachBottom() {
|
||
console.log("onReachBottom");
|
||
this.handleToBottom();
|
||
},
|
||
onShareAppMessage() {
|
||
let _this = this;
|
||
return {
|
||
// title: _this.pageType === "UnionMall" ? "工会之家" : "精选商城",
|
||
title: "彩云驿商城",
|
||
path: `/pages/index/index?pageType=${this.pageType}`,
|
||
};
|
||
},
|
||
onShareTimeline() {
|
||
let _this = this;
|
||
return {
|
||
// title: _this.pageType === "UnionMall" ? "工会之家" : "精选商城",
|
||
title: "彩云驿商城",
|
||
path: `/pages/index/index?pageType=${this.pageType}`,
|
||
};
|
||
},
|
||
methods: {
|
||
handleMaskClick(e) {
|
||
this.priceRangeRefShow = false
|
||
},
|
||
handleGoPointsMall() {
|
||
uni.navigateTo({
|
||
url: `/pages/shopPages/shopList/index?pageType=pointsMall`,
|
||
});
|
||
},
|
||
// 滚动到底部 加载更多的方法
|
||
handleScrollBottom() {
|
||
this.handleToBottom();
|
||
},
|
||
// 回到顶部
|
||
handleGoBack() {
|
||
this.scrollView = "navItem";
|
||
},
|
||
handlePageScroll(e) {
|
||
this.pageScrollNumber = Number(e.detail.scrollTop);
|
||
if (Number(e.detail.scrollTop) > 100) {
|
||
this.showBackTop = true;
|
||
} else {
|
||
this.scrollView = "";
|
||
this.showBackTop = false;
|
||
}
|
||
},
|
||
handleHidePopup() {
|
||
this.$refs.noticeRef.close();
|
||
},
|
||
// 关闭价格区间的悬浮框
|
||
handleClosePricePopup() {
|
||
this.$refs.priceRangeRef.close();
|
||
this.priceRangeRefShow = false
|
||
},
|
||
// 榜单的方法
|
||
async handleGetSortList() {
|
||
let req1 = {
|
||
action_type: "WeChat_GetMallGoodsInfo",
|
||
ownerUnitId: 911,
|
||
COMMODITYNATURE: 5070,
|
||
payMethod: "1000,3000",
|
||
justCommodity: 1,
|
||
userdefinedTypeId: "1317",
|
||
};
|
||
|
||
let req2 = {
|
||
action_type: "WeChat_GetMallGoodsInfo",
|
||
ownerUnitId: 911,
|
||
COMMODITYNATURE: 5070,
|
||
payMethod: "1000,3000",
|
||
justCommodity: 1,
|
||
userdefinedTypeId: "1318",
|
||
sortStr: "COMMODITY_EN desc",
|
||
};
|
||
|
||
let req3 = {
|
||
action_type: "WeChat_GetMallGoodsInfo",
|
||
ownerUnitId: 911,
|
||
COMMODITYNATURE: 5070,
|
||
payMethod: "1000,3000",
|
||
justCommodity: 1,
|
||
userdefinedTypeId: "1319",
|
||
};
|
||
|
||
// const data1 = await this.$api.getCoop(req1);
|
||
// const data2 = await this.$api.getCoop(req2);
|
||
// const data3 = await this.$api.getCoop(req3);
|
||
|
||
|
||
const data1 = await this.$api.$javaGet('/third-party/getWeChatGetMallGoodsInfo', req1)
|
||
const data2 = await this.$api.$javaGet('/third-party/getWeChatGetMallGoodsInfo', req2)
|
||
const data3 = await this.$api.$javaGet('/third-party/getWeChatGetMallGoodsInfo', req3)
|
||
|
||
let list1 = this.handleChangeShopList(data1.Data.List);
|
||
let list2 = this.handleChangeShopList(data2.Data.List);
|
||
let list3 = this.handleChangeShopList(data3.Data.List);
|
||
|
||
console.log("list1", list1);
|
||
console.log("list2", list2);
|
||
console.log("list3", list3);
|
||
this.newShopList = list1.slice(0, 2);
|
||
this.hotShopList = list2.slice(0, 1);
|
||
this.goodShopList = list3.slice(0, 1);
|
||
console.log("this.hotShopList", this.hotShopList);
|
||
console.log("this.goodShopList", this.goodShopList);
|
||
},
|
||
handleChangeShopList(list) {
|
||
let shopList = [];
|
||
if (list && list.length > 0) {
|
||
list.forEach((item) => {
|
||
if (item.COMMODITYLIST && item.COMMODITYLIST.length > 0) {
|
||
item.COMMODITYLIST.forEach((subItem) => {
|
||
if (
|
||
subItem.COMMODITY_MEMBERPRICE &&
|
||
subItem.COMMODITY_MEMBERPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
subItem.bigNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[0];
|
||
subItem.smallNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[1];
|
||
} else {
|
||
subItem.bigNumber = subItem.COMMODITY_MEMBERPRICE;
|
||
}
|
||
if (
|
||
subItem.COMMODITY_RETAILPRICE &&
|
||
subItem.COMMODITY_RETAILPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
subItem.RETbigNumber =
|
||
subItem.COMMODITY_RETAILPRICE.toString().split(".")[0];
|
||
subItem.RETsmallNumber =
|
||
subItem.COMMODITY_RETAILPRICE.toString().split(".")[1];
|
||
} else {
|
||
subItem.RETbigNumber = subItem.COMMODITY_RETAILPRICE;
|
||
}
|
||
shopList.push(subItem);
|
||
});
|
||
}
|
||
});
|
||
}
|
||
return shopList;
|
||
},
|
||
// 工会之家滚动到底部
|
||
handleToBottom() {
|
||
this.shopMsg.pageIndex = this.shopMsg.pageIndex + 1;
|
||
if (this.shopMsg.isOver) {
|
||
} else {
|
||
this.handleGetUnionShopList();
|
||
}
|
||
// this.showShopList = this.allShopList.slice(0, this.pageIndex * 10)
|
||
},
|
||
// 正常商品滚动到底部
|
||
handleToBottomproductsList() {
|
||
this.shopMsg.pageIndex = this.shopMsg.pageIndex + 1;
|
||
if (this.shopMsg.isOver) {
|
||
} else {
|
||
this.handleGetProductsList();
|
||
}
|
||
},
|
||
// 拿到工会之家的商品列表
|
||
async handleGetUnionShopList() {
|
||
uni.showLoading({
|
||
title: "加载中...",
|
||
});
|
||
const data = await this.$api.getCoop({
|
||
action_type: "WeChat_GetMallGoodsInfo",
|
||
ownerUnitId: 911, // 业主单位 写死
|
||
COMMODITYNATURE: 5070, // 一个商城的大类 也写死
|
||
priceStart: this.minPrice, // 价钱的最小值
|
||
priceEnd: this.maxPrice, // 价钱的最大值
|
||
payMethod: "1000,3000", // 写死的
|
||
commodityNature: 5070, // 一个商城的大类 也写死
|
||
commodityName: this.searchShopName,// 类型名称的搜索
|
||
Page_Size: this.shopMsg.pageSize, // 每页多少条
|
||
Page_Index: this.shopMsg.pageIndex, // 页码
|
||
userdefinedtypeId: this.selectProducts || "", // 大小类id
|
||
justCommodity: 1, // 写死
|
||
sortStr: `${this.sortTypeList[this.sortType]} ${new Date().getTime % 2 > 0 ? "" : "desc"
|
||
}`, // 排序
|
||
});
|
||
console.log("handleGetSpecialOffers", data);
|
||
let list = data.Data && data.Data.List ? data.Data.List : [];
|
||
let shopList = [];
|
||
if (this.shopMsg.pageIndex > 1) {
|
||
shopList = this.showShopList;
|
||
}
|
||
let thisResList = [];
|
||
if (list && list.length > 0) {
|
||
list.forEach((item) => {
|
||
if (item.COMMODITYLIST && item.COMMODITYLIST.length > 0) {
|
||
item.COMMODITYLIST.forEach((subItem) => {
|
||
if (
|
||
subItem.COMMODITY_MEMBERPRICE &&
|
||
subItem.COMMODITY_MEMBERPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
subItem.bigNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[0];
|
||
subItem.smallNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[1];
|
||
} else {
|
||
subItem.bigNumber = subItem.COMMODITY_MEMBERPRICE;
|
||
}
|
||
if (
|
||
subItem.COMMODITY_RETAILPRICE &&
|
||
subItem.COMMODITY_RETAILPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
subItem.RETbigNumber =
|
||
subItem.COMMODITY_RETAILPRICE.toString().split(".")[0];
|
||
subItem.RETsmallNumber =
|
||
subItem.COMMODITY_RETAILPRICE.toString().split(".")[1];
|
||
} else {
|
||
subItem.RETbigNumber = subItem.COMMODITY_RETAILPRICE;
|
||
}
|
||
thisResList.push(subItem);
|
||
});
|
||
}
|
||
});
|
||
}
|
||
if (thisResList && thisResList.length < 6) {
|
||
this.shopMsg.isOver = true;
|
||
}
|
||
console.log("shopList", shopList);
|
||
this.showShopList = shopList.concat(thisResList);
|
||
// this.allShopList = shopList
|
||
// this.showShopList = this.allShopList.slice(0, this.pageIndex * 10)
|
||
console.log("this.showShopList", this.showShopList);
|
||
uni.hideLoading();
|
||
},
|
||
// 重置价格筛选
|
||
async handleReset() {
|
||
this.maxPrice = "";
|
||
this.minPrice = "";
|
||
this.searchShopName = "";
|
||
this.showShopList = [];
|
||
|
||
this.shopMsg = {
|
||
pageIndex: 1,
|
||
pageSize: 6,
|
||
isOver: false,
|
||
};
|
||
// 拿到工会之家的商品列表
|
||
await this.handleGetUnionShopList();
|
||
this.$refs.priceRangeRef.close();
|
||
this.priceRangeRefShow = false
|
||
},
|
||
// 价格筛选的确认
|
||
async handleConfirm() {
|
||
console.log("minPrice", this.minPrice);
|
||
console.log("maxPrice", this.maxPrice);
|
||
if (Number(this.minPrice) <= Number(this.maxPrice)) {
|
||
} else {
|
||
let newMax = Number(this.minPrice);
|
||
let newMin = Number(this.maxPrice);
|
||
this.maxPrice = newMax;
|
||
this.minPrice = newMin;
|
||
}
|
||
this.showShopList = [];
|
||
this.shopMsg = {
|
||
pageIndex: 1,
|
||
pageSize: 6,
|
||
isOver: false,
|
||
};
|
||
// 拿到工会之家的商品列表
|
||
await this.handleGetUnionShopList();
|
||
this.$refs.priceRangeRef.close();
|
||
this.priceRangeRefShow = false
|
||
},
|
||
// 显示价格的悬浮框
|
||
handleShowPricePopup() {
|
||
this.$refs.priceRangeRef.open("bottom");
|
||
this.priceRangeRefShow = true
|
||
},
|
||
// 品牌的跳转
|
||
handleSearchBrand(value) {
|
||
uni.navigateTo({
|
||
url: `/pages/shopPages/shopList/index?name=${value.label}&pageType=brand`,
|
||
});
|
||
},
|
||
// 跳转去榜单页面
|
||
handleGoSortList(type) {
|
||
// 1 新品榜 2 热销榜 3 推荐榜
|
||
uni.navigateTo({
|
||
url: `/pages/shopPages/shopList/index?type=${type}&pageType=${this.pageType}`,
|
||
});
|
||
},
|
||
// 拿到顶部商品大类的方法
|
||
async handleGetShopBigType() {
|
||
// const data = await this.$api.getCoop({
|
||
// action_type: "WeChat_GetMallGoodsType",
|
||
// ownerUnitId: 911,
|
||
// // commodityNature: 5070, // 类型
|
||
// });
|
||
const data = await this.$api.$javaGet(
|
||
'/third-party/getWeChatGetMallGoodsType',
|
||
{
|
||
ownerUnitId: 911,
|
||
commodityNature: 5070, // 类型
|
||
}
|
||
)
|
||
|
||
console.log("handleGetShopBigType", data);
|
||
let typeList = data.Data.List;
|
||
let resList = [];
|
||
// 如果有活动的话就有值
|
||
let activityObj = {};
|
||
// let indexOfList = [1248, 1247, 1257, 1245, 1246];
|
||
let indexOfList = [3186, 3175, 4597];
|
||
// , 1355
|
||
if (typeList && typeList.length > 0) {
|
||
typeList.forEach((item) => {
|
||
if (indexOfList.indexOf(item.UserdefinedType_Id) !== -1) {
|
||
resList.push(item);
|
||
}
|
||
|
||
if (item.UserdefinedType_Id === 1355) {
|
||
this.haveActivity = true;
|
||
activityObj = item;
|
||
}
|
||
});
|
||
}
|
||
|
||
if (this.haveActivity) {
|
||
// resList.push(activityObj);
|
||
this.activityObj = activityObj;
|
||
}
|
||
|
||
this.shopTypeList = resList;
|
||
this.selectProducts = resList[0].UserdefinedType_Id;
|
||
console.log("this.shopTypeList", this.shopTypeList);
|
||
console.log("this.activityObj", this.activityObj);
|
||
|
||
// if (this.shopTypeList && this.shopTypeList.length < 10) {
|
||
// this.oneRowNumber = this.shopTypeList.length;
|
||
// } else {
|
||
// this.oneRowNumber = Math.ceil(this.shopTypeList.length / 2);
|
||
// }
|
||
// console.log("this.oneRowNumber", this.oneRowNumber);
|
||
},
|
||
// 拿到活动的商品列表 可能不调用 有判断的
|
||
async handleGetActivityList() {
|
||
// const data = await this.$api.getCoop({
|
||
// action_type: "WeChat_GetMallGoodsInfo",
|
||
// ownerUnitId: 911,
|
||
// userdefinedtypeId: 1355,
|
||
// excludeNature: 5070, // 排除
|
||
// justCommodity: 1,
|
||
// });
|
||
|
||
// let url = this.pageType === "UnionMall" ? '/third-party/getWeChatGetMallGoodsInfo' : '/third-party/getWeChatGetMallGoodsInfoExclude'
|
||
|
||
const data = await this.$api.$javaGet(
|
||
'/third-party/getWeChatGetMallGoodsInfoExclude',
|
||
// url,
|
||
{
|
||
ownerUnitId: 911,
|
||
userdefinedTypeId: 1355,
|
||
excludeNature: 5070, // 排除
|
||
justCommodity: 1,
|
||
}
|
||
)
|
||
|
||
console.log("handleGetActivityList", data);
|
||
let list = data.Data.List;
|
||
let res = [];
|
||
if (list && list.length > 0) {
|
||
list.forEach((item) => {
|
||
if (item.COMMODITYLIST && item.COMMODITYLIST.length > 0) {
|
||
item.COMMODITYLIST.forEach((subItem) => {
|
||
if (
|
||
subItem.COMMODITY_MEMBERPRICE &&
|
||
subItem.COMMODITY_MEMBERPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
subItem.bigNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[0];
|
||
subItem.smallNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[1];
|
||
} else {
|
||
subItem.bigNumber = subItem.COMMODITY_MEMBERPRICE;
|
||
}
|
||
res.push(subItem);
|
||
});
|
||
}
|
||
});
|
||
}
|
||
this.activityShopList = res;
|
||
},
|
||
// 拿到特价优惠的商品列表 nature 5030
|
||
async handleGetSpecialOffers() {
|
||
// const data = await this.$api.getCoop({
|
||
// action_type: "WeChat_GetMallGoodsInfo",
|
||
// ownerUnitId: 911,
|
||
// COMMODITYNATURE: 5030,
|
||
// excludeNature: 5070,
|
||
// justCommodity: 1,
|
||
// });
|
||
|
||
let url = this.pageType === "UnionMall" ? '/third-party/getWeChatGetMallGoodsInfo' : '/third-party/getWeChatGetMallGoodsInfoExclude'
|
||
|
||
const data = await this.$api.$javaGet(
|
||
// '/third-party/getExcludeWeChatGetMallGoodsInfo',
|
||
url,
|
||
{
|
||
ownerUnitId: 911,
|
||
// COMMODITYNATURE: 5030,//特价优惠
|
||
COMMODITYNATURE: 5021,// 绿色云品
|
||
userdefinedTypeId: 3186,// 绿色云品
|
||
userdefinedtypeId: 3186,// 绿色云品
|
||
excludeNature: 5070,
|
||
justCommodity: 1,
|
||
}
|
||
)
|
||
|
||
console.log("handleGetSpecialOffers", data);
|
||
let list = data.Data && data.Data.List ? data.Data.List : [];
|
||
let shopList = [];
|
||
let shopIdList = []
|
||
if (list && list.length > 0) {
|
||
list.forEach((item) => {
|
||
if (item.COMMODITYLIST && item.COMMODITYLIST.length > 0) {
|
||
item.COMMODITYLIST.forEach((subItem) => {
|
||
if (shopIdList.indexOf(subItem.COMMODITY_ID) === -1) {
|
||
shopIdList.push(subItem.COMMODITY_ID)
|
||
|
||
if (
|
||
subItem.COMMODITY_MEMBERPRICE &&
|
||
subItem.COMMODITY_MEMBERPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
subItem.bigNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[0];
|
||
subItem.smallNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[1];
|
||
} else {
|
||
subItem.bigNumber = subItem.COMMODITY_MEMBERPRICE;
|
||
}
|
||
if (
|
||
subItem.COMMODITY_RETAILPRICE &&
|
||
subItem.COMMODITY_RETAILPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
subItem.RETbigNumber =
|
||
subItem.COMMODITY_RETAILPRICE.toString().split(".")[0];
|
||
subItem.RETsmallNumber =
|
||
subItem.COMMODITY_RETAILPRICE.toString().split(".")[1];
|
||
} else {
|
||
subItem.RETbigNumber = subItem.COMMODITY_RETAILPRICE;
|
||
}
|
||
shopList.push(subItem);
|
||
}
|
||
|
||
});
|
||
}
|
||
});
|
||
}
|
||
console.log("特价优惠", shopList);
|
||
this.specialOffersList = shopList;
|
||
},
|
||
|
||
// 拿到每周特惠的商品列表
|
||
async handleGetEveryWeekShop() {
|
||
// const data = await this.$api.getCoop({
|
||
// action_type: "WeChat_GetMallGoodsInfo",
|
||
// ownerUnitId: 911,
|
||
// userdefinedtypeId: 4597,
|
||
// justCommodity: 1,
|
||
// });
|
||
|
||
const data = await this.$api.$javaGet(
|
||
'/third-party/getWeChatGetMallGoodsInfo',
|
||
{
|
||
ownerUnitId: 911,
|
||
userdefinedtypeId: 4597,
|
||
userdefinedTypeId: 4597,
|
||
justCommodity: 1,
|
||
}
|
||
)
|
||
|
||
console.log("handleGetEveryWeekShophandleGetEveryWeekShophandleGetEveryWeekShop", data);
|
||
let list = data.Data && data.Data.List ? data.Data.List : [];
|
||
let shopList = [];
|
||
if (list && list.length > 0) {
|
||
list.forEach((item) => {
|
||
if (item.COMMODITYLIST && item.COMMODITYLIST.length > 0) {
|
||
item.COMMODITYLIST.forEach((subItem) => {
|
||
if (
|
||
subItem.COMMODITY_MEMBERPRICE &&
|
||
subItem.COMMODITY_MEMBERPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
subItem.bigNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[0];
|
||
subItem.smallNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[1];
|
||
} else {
|
||
subItem.bigNumber = subItem.COMMODITY_MEMBERPRICE;
|
||
}
|
||
if (
|
||
subItem.COMMODITY_RETAILPRICE &&
|
||
subItem.COMMODITY_RETAILPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
subItem.RETbigNumber =
|
||
subItem.COMMODITY_RETAILPRICE.toString().split(".")[0];
|
||
subItem.RETsmallNumber =
|
||
subItem.COMMODITY_RETAILPRICE.toString().split(".")[1];
|
||
} else {
|
||
subItem.RETbigNumber = subItem.COMMODITY_RETAILPRICE;
|
||
}
|
||
shopList.push(subItem);
|
||
});
|
||
}
|
||
});
|
||
}
|
||
|
||
this.weeklySpecialOffer = shopList
|
||
|
||
},
|
||
|
||
// 拿到今日推荐的商品列表 nature 5050
|
||
async handleGetTodayOffers() {
|
||
// const data = await this.$api.getCoop({
|
||
// action_type: "WeChat_GetMallGoodsInfo",
|
||
// ownerUnitId: 911,
|
||
// COMMODITYNATURE: 4598,
|
||
// excludeNature: 5070,
|
||
// justCommodity: 1,
|
||
// });
|
||
|
||
|
||
// let url = this.pageType === "UnionMall" ? '/third-party/getWeChatGetMallGoodsInfo' : '/third-party/getWeChatGetMallGoodsInfoExclude'
|
||
|
||
const data = await this.$api.$javaGet(
|
||
'/third-party/getWeChatGetMallGoodsInfoExclude',
|
||
// url,
|
||
{
|
||
ownerUnitId: 911,
|
||
// COMMODITYNATURE: 4598,// 原今日推荐
|
||
COMMODITYNATURE: 5022,//自有品牌
|
||
userdefinedtypeId: 3175, // 商品分类
|
||
userdefinedTypeId: 3175, // 商品分类
|
||
excludeNature: 5070,
|
||
justCommodity: 1,
|
||
}
|
||
)
|
||
|
||
console.log("今日推荐", data);
|
||
let list = data.Data.List;
|
||
let shopList = [];
|
||
let shopIdList = []
|
||
if (list && list.length > 0) {
|
||
list.forEach((item) => {
|
||
if (item.COMMODITYLIST && item.COMMODITYLIST.length > 0) {
|
||
item.COMMODITYLIST.forEach((subItem) => {
|
||
if (shopIdList.indexOf(subItem.COMMODITY_ID) === -1) {
|
||
shopIdList.push(subItem.COMMODITY_ID)
|
||
if (
|
||
subItem.COMMODITY_MEMBERPRICE &&
|
||
subItem.COMMODITY_MEMBERPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
subItem.bigNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[0];
|
||
subItem.smallNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[1];
|
||
} else {
|
||
subItem.bigNumber = subItem.COMMODITY_MEMBERPRICE;
|
||
}
|
||
if (
|
||
subItem.COMMODITY_RETAILPRICE &&
|
||
subItem.COMMODITY_RETAILPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
subItem.RETbigNumber =
|
||
subItem.COMMODITY_RETAILPRICE.toString().split(".")[0];
|
||
subItem.RETsmallNumber =
|
||
subItem.COMMODITY_RETAILPRICE.toString().split(".")[1];
|
||
} else {
|
||
subItem.RETbigNumber = subItem.COMMODITY_RETAILPRICE;
|
||
}
|
||
shopList.push(subItem);
|
||
|
||
|
||
}
|
||
|
||
});
|
||
}
|
||
});
|
||
}
|
||
this.todayOffersList = shopList;
|
||
return;
|
||
if (list && list.length > 0) {
|
||
let obj = list[0];
|
||
if (obj.CommodityList && obj.CommodityList.length > 0) {
|
||
let shopList = [];
|
||
obj.CommodityList.forEach((item) => {
|
||
if (
|
||
item.COSTTAXPRICE &&
|
||
item.COSTTAXPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
item.bigNumber = item.COSTTAXPRICE.toString().split(".")[0];
|
||
item.smallNumber = item.COSTTAXPRICE.toString().split(".")[1];
|
||
} else {
|
||
item.bigNumber = item.COSTTAXPRICE;
|
||
}
|
||
shopList.push(item);
|
||
});
|
||
console.log("shopList", shopList);
|
||
this.todayOffersList = shopList;
|
||
}
|
||
} else {
|
||
this.todayOffersList = [];
|
||
}
|
||
console.log("今日推荐", this.todayOffersList);
|
||
},
|
||
// 切换甄选商品的类型
|
||
handleChangeShopMallType(obj) {
|
||
this.selectProducts = obj.UserdefinedType_Id;
|
||
this.shopMsg = {
|
||
pageSize: 6,
|
||
pageIndex: 1,
|
||
isOver: false,
|
||
};
|
||
this.handleGetProductsList();
|
||
},
|
||
// 拿到甄选商品 3000
|
||
async handleGetProductsList() {
|
||
uni.showLoading({
|
||
title: "加载中",
|
||
});
|
||
// const data = await this.$api.getCoop({
|
||
// action_type: "WeChat_GetMallGoodsInfo",
|
||
// ownerUnitId: 911,
|
||
// COMMODITYNATURE: this.selectProducts === 4597 ? '' : 3000,
|
||
// userdefinedtypeId: this.selectProducts || "",
|
||
// Page_Size: this.shopMsg.pageSize,
|
||
// Page_Index: this.shopMsg.pageIndex,
|
||
// justCommodity: 1,
|
||
// // excludeNature: 5070,
|
||
// });
|
||
|
||
// 原本下面商城的内容
|
||
|
||
// const data = await this.$api.$javaGet(
|
||
// '/third-party/getWeChatGetMallGoodsInfo',
|
||
// {
|
||
// ownerUnitId: 911,
|
||
// COMMODITYNATURE: this.selectProducts === 4597 ? '' : 3000,
|
||
// userdefinedTypeId: this.selectProducts || "",
|
||
// Page_Size: this.shopMsg.pageSize,
|
||
// Page_Index: this.shopMsg.pageIndex,
|
||
// justCommodity: 1,
|
||
// }
|
||
// )
|
||
|
||
//
|
||
|
||
const data = await this.$api.$javaGet(
|
||
'/third-party/getWeChatGetMallGoodsInfo',
|
||
{
|
||
ownerUnitId: 911,
|
||
justCommodity: 1,
|
||
payMethod: "2000,3000",
|
||
COMMODITYNATURE: 6000
|
||
// COMMODITYNATURE: this.selectProducts === 4597 ? '' : 3000,
|
||
// userdefinedTypeId: this.selectProducts || "",
|
||
// Page_Size: this.shopMsg.pageSize,
|
||
// Page_Index: this.shopMsg.pageIndex,
|
||
}
|
||
)
|
||
|
||
|
||
let list = data.Data.List;
|
||
console.log('积分商城', list);
|
||
|
||
let resList = [];
|
||
let thisResList = [];
|
||
if (this.shopMsg.pageIndex > 1) {
|
||
resList = this.productsList;
|
||
}
|
||
if (list && list.length > 0) {
|
||
// this.selectProducts = list[0].UserdefinedType_Id;
|
||
list.forEach((item) => {
|
||
if (item.COMMODITYLIST && item.COMMODITYLIST.length > 0) {
|
||
item.COMMODITYLIST.forEach((subItem) => {
|
||
if (
|
||
subItem.COMMODITY_MEMBERPRICE &&
|
||
subItem.COMMODITY_MEMBERPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
subItem.bigNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[0];
|
||
subItem.smallNumber =
|
||
subItem.COMMODITY_MEMBERPRICE.toString().split(".")[1];
|
||
} else {
|
||
subItem.bigNumber = subItem.COMMODITY_MEMBERPRICE;
|
||
}
|
||
if (
|
||
subItem.COMMODITY_RETAILPRICE &&
|
||
subItem.COMMODITY_RETAILPRICE.toString().indexOf(".") !== -1
|
||
) {
|
||
subItem.RETbigNumber =
|
||
subItem.COMMODITY_RETAILPRICE.toString().split(".")[0];
|
||
subItem.RETsmallNumber =
|
||
subItem.COMMODITY_RETAILPRICE.toString().split(".")[1];
|
||
} else {
|
||
subItem.RETbigNumber = subItem.COMMODITY_RETAILPRICE;
|
||
}
|
||
|
||
thisResList.push(subItem);
|
||
});
|
||
}
|
||
});
|
||
}
|
||
if (thisResList && thisResList.length < 6) {
|
||
this.shopMsg.isOver = true;
|
||
}
|
||
// this.productsList = list;
|
||
this.productsList = resList.concat(thisResList);
|
||
console.log("甄选商品", this.productsList);
|
||
uni.hideLoading();
|
||
|
||
// let shopList = []
|
||
// if (list && list.length > 0) {
|
||
// list.forEach((item) => {
|
||
// if (item.COMMODITYLIST && item.COMMODITYLIST.length > 0) {
|
||
// item.COMMODITYLIST.forEach((subItem) => {
|
||
// shopList.push(subItem)
|
||
// })
|
||
// }
|
||
// })
|
||
// }
|
||
},
|
||
// 返回首页
|
||
handleBackHome() {
|
||
if (this.pageType === "UnionMall") {
|
||
uni.navigateBack({
|
||
delta: 1,
|
||
});
|
||
} else {
|
||
uni.switchTab({
|
||
url: "/pages/index/index",
|
||
});
|
||
}
|
||
},
|
||
// 跳转公告页面
|
||
handleGoNotice() {
|
||
uni.navigateTo({
|
||
url: "/pages/noticePage/index",
|
||
});
|
||
},
|
||
// 跳转商品列表接口
|
||
handleGoShopList(value, index) {
|
||
// uni.navigateTo({
|
||
// url: `/pages/shopPages/shopList/index?type=${type}&pageType=${this.pageType || ""
|
||
// }`,
|
||
// });
|
||
uni.redirectTo({
|
||
url: `/pages/shopMallPage/shopType/index?leftId=${value}&pageType=${this.pageType}&selectIndex=${index}`,
|
||
});
|
||
},
|
||
// 跳转商品详情
|
||
handleGoShopDetail(obj) {
|
||
console.log("obj", obj);
|
||
uni.navigateTo({
|
||
url: `/pages/shopPages/shopDetail/index?id=${obj.COMMODITY_ID}&pageType=${this.pageType}`,
|
||
});
|
||
},
|
||
// 跳转到商品分类页面
|
||
handleGoShopPage(obj, index) {
|
||
console.log("obj", obj);
|
||
console.log("index", index);
|
||
if (this.pageType === "UnionMall") {
|
||
// if (obj.UserdefinedType_Name === "工会活动") {
|
||
// uni.navigateTo({
|
||
// url: `/pages/allFunPage/unionActivities`,
|
||
// });
|
||
// } else {
|
||
uni.redirectTo({
|
||
url: `/pages/shopMallPage/shopType/index?leftId=${obj.UserdefinedType_Id}&pageType=${this.pageType}&selectIndex=${index}`,
|
||
// url: `/pages/shopMallPage/shopType/index?pageType=${this.pageType}`,
|
||
});
|
||
// }
|
||
} else {
|
||
uni.redirectTo({
|
||
url: `/pages/shopMallPage/shopType/index?selectIndex=${index}&pageType=${this.pageType}`,
|
||
});
|
||
}
|
||
},
|
||
// 活动直接跳转分类页面 分类页面的互动是第一个 所以 selectIndex 传0就好
|
||
handleGoActivityType() {
|
||
uni.redirectTo({
|
||
url: `/pages/shopMallPage/shopType/index?selectIndex=${0}&pageType=${this.pageType
|
||
}`,
|
||
});
|
||
},
|
||
// 跳转工会之家
|
||
handleGoUnionMall() {
|
||
uni.navigateTo({
|
||
url: `/pages/shopMallPage/index/index?pageType=UnionMall`,
|
||
});
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.main {
|
||
width: 100vw;
|
||
height: 100vh;
|
||
box-sizing: border-box;
|
||
background: #f2f4f5;
|
||
|
||
.header {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
//height: 496rpx;
|
||
// background: linear-gradient(270deg, #2FA4FF 0%, #197AFF 100%);
|
||
background-image: url("https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/indexBg.png");
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 300rpx;
|
||
//position: relative;
|
||
z-index: 0;
|
||
|
||
.headerTop {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
box-sizing: border-box;
|
||
padding: 0 32rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
z-index: 99;
|
||
background-image: url("https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/indexBg.png");
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 300rpx;
|
||
|
||
.backArrow {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
}
|
||
|
||
.pageName {
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
.pageTitle {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 0 40rpx;
|
||
|
||
.titleText {
|
||
font-size: 20px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
}
|
||
}
|
||
|
||
.pageSearch {
|
||
width: calc(100% - 48rpx);
|
||
margin-left: 24rpx;
|
||
margin-top: 28rpx;
|
||
height: 38px;
|
||
background: #fff;
|
||
border-radius: 19px;
|
||
box-sizing: border-box;
|
||
padding: 2px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.areaSelect {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160304;
|
||
line-height: 20px;
|
||
padding-left: 12px;
|
||
position: relative;
|
||
|
||
.areaIcon {
|
||
width: 12px;
|
||
height: 12px;
|
||
}
|
||
}
|
||
|
||
.areaSelect:after {
|
||
content: "";
|
||
width: 2px;
|
||
height: 14px;
|
||
position: absolute;
|
||
top: 3px;
|
||
right: -12px;
|
||
background: #e7e5e5;
|
||
display: block;
|
||
}
|
||
|
||
.serach_input {
|
||
width: 154px;
|
||
border: none;
|
||
height: 20px;
|
||
font-size: 14px;
|
||
box-sizing: border-box;
|
||
padding: 0 12px;
|
||
}
|
||
|
||
.searchBtn {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #fdfdfd;
|
||
line-height: 20px;
|
||
padding: 7px 16px;
|
||
background: #1890ff;
|
||
border-radius: 17px;
|
||
}
|
||
}
|
||
|
||
.bannerBox {
|
||
width: calc(100% - 48rpx);
|
||
height: 280rpx;
|
||
background: #6e0f16;
|
||
border-radius: 16rpx;
|
||
}
|
||
|
||
.typeBox {
|
||
width: calc(100% - 48rpx);
|
||
margin: 24rpx 0 0 24rpx;
|
||
//height: 392rpx;
|
||
background: #fff;
|
||
border-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
padding: 2rpx;
|
||
|
||
.contentBox {
|
||
width: 100%;
|
||
border-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
min-height: 214rpx;
|
||
padding: 30rpx;
|
||
background: linear-gradient(180deg,
|
||
rgba(230, 240, 255, 1) 0%,
|
||
rgba(255, 255, 255, 1) 50%,
|
||
#ffffff 100%);
|
||
flex-wrap: wrap;
|
||
display: flex;
|
||
align-items: center;
|
||
// justify-content: space-between;
|
||
|
||
.rowBox {
|
||
width: 20%;
|
||
height: 144rpx;
|
||
|
||
// width: 96rpx;
|
||
// height: 154rpx;
|
||
// display: inline-block;
|
||
// box-sizing: border-box;
|
||
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
// justify-content: space-between;
|
||
|
||
.imgBox {
|
||
width: 96rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
|
||
.itemImgBox {
|
||
width: 96rpx;
|
||
height: 96rpx;
|
||
border-radius: 50%;
|
||
background: #fff;
|
||
padding: 2rpx;
|
||
box-sizing: border-box;
|
||
overflow: hidden;
|
||
margin-bottom: 16rpx;
|
||
|
||
.img {
|
||
width: 96rpx;
|
||
height: 100%;
|
||
}
|
||
}
|
||
}
|
||
|
||
.itemName {
|
||
width: 96rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #020e1a;
|
||
line-height: 32rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
|
||
.rowBox:nth-child(5n) {
|
||
//margin-right: 0!important;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.pageContent {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 0 24rpx 160rpx;
|
||
margin-top: 24rpx;
|
||
|
||
.noticeBox {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 24rpx 28rpx;
|
||
background: #fff;
|
||
border-radius: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.noticeLeft {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.noticeIcon {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.noticeTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #ee4020;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 24rpx;
|
||
}
|
||
|
||
.noticeContent {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #716f69;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.noticeRight {
|
||
.moreIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.typeBox {
|
||
width: 100%;
|
||
//height: 392rpx;
|
||
background: #fff;
|
||
border-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
padding: 2rpx;
|
||
|
||
.contentBox {
|
||
width: 100%;
|
||
height: 100%;
|
||
border-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
padding: 30rpx;
|
||
background: linear-gradient(180deg,
|
||
rgba(46, 134, 255, 0.12) 0%,
|
||
rgba(46, 134, 255, 0) 100%);
|
||
|
||
.rowBox {
|
||
width: 120rpx;
|
||
height: 134rpx;
|
||
display: inline-block;
|
||
|
||
//display: flex;
|
||
//align-items: center;
|
||
//justify-content: space-between;
|
||
.imgBox {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: center;
|
||
|
||
.itemImgBox {
|
||
width: 96rpx;
|
||
height: 96rpx;
|
||
border-radius: 50%;
|
||
background: #fff;
|
||
padding: 2rpx;
|
||
box-sizing: border-box;
|
||
overflow: hidden;
|
||
margin-bottom: 10rpx;
|
||
|
||
.img {
|
||
width: 96rpx;
|
||
height: 100%;
|
||
}
|
||
}
|
||
}
|
||
|
||
.itemName {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #020e1a;
|
||
line-height: 32rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.rowBox:nth-child(5) {
|
||
margin-right: 0 !important;
|
||
}
|
||
}
|
||
}
|
||
|
||
.advertisement {
|
||
width: 100%;
|
||
background: #ffffff;
|
||
border-radius: 16rpx;
|
||
margin-top: 24rpx;
|
||
box-sizing: border-box;
|
||
padding: 2rpx;
|
||
|
||
.advertisementContentBox {
|
||
width: 100%;
|
||
height: 100%;
|
||
// 真的有个空格！！！
|
||
background-image: url("https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/Special Offers.png");
|
||
background-repeat: no-repeat;
|
||
border-radius: 16rpx;
|
||
background-size: 100% 100%;
|
||
box-sizing: border-box;
|
||
padding: 16rpx 22rpx;
|
||
|
||
.advertisementTop {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.title {
|
||
font-size: 14px;
|
||
font-weight: 600;
|
||
color: #181716;
|
||
|
||
.titleImg {
|
||
width: 112rpx;
|
||
height: 36rpx;
|
||
}
|
||
}
|
||
|
||
.moreBox {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.moreText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #8b8280;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.rightIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.advertisementTopUnionMall {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.title {
|
||
font-size: 26rpx;
|
||
font-weight: 600;
|
||
color: #181716;
|
||
}
|
||
|
||
.moreBox {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.moreText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #8b8280;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.rightIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.UnionMallShopList {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
height: 90px;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.leftSortBox {
|
||
width: 50%;
|
||
background: linear-gradient(180deg, #ffffff 0%, #ffffff 100%);
|
||
border-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
padding: 12rpx 24rpx;
|
||
|
||
.titleTop {
|
||
.title {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 32rpx;
|
||
color: #130f05;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
.rowBox {
|
||
width: 20%;
|
||
height: 144rpx;
|
||
|
||
// width: 96rpx;
|
||
// height: 154rpx;
|
||
// display: inline-block;
|
||
// box-sizing: border-box;
|
||
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
// justify-content: space-between;
|
||
|
||
.imgBox {
|
||
width: 96rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
|
||
.itemImgBox {
|
||
width: 96rpx;
|
||
height: 96rpx;
|
||
border-radius: 50%;
|
||
background: #fff;
|
||
padding: 2rpx;
|
||
box-sizing: border-box;
|
||
overflow: hidden;
|
||
margin-bottom: 16rpx;
|
||
|
||
.img {
|
||
width: 96rpx;
|
||
height: 100%;
|
||
}
|
||
}
|
||
}
|
||
|
||
.itemName {
|
||
width: 96rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #020e1a;
|
||
line-height: 32rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
}
|
||
|
||
.shopList {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
height: 90px;
|
||
|
||
.shopItem {
|
||
width: 136rpx;
|
||
display: inline-block;
|
||
margin-right: 40rpx;
|
||
|
||
.shopItemImg {
|
||
width: 100%;
|
||
position: relative;
|
||
|
||
.imgBox {
|
||
width: 136rpx;
|
||
height: 136rpx;
|
||
border-radius: 50%;
|
||
overflow: hidden;
|
||
|
||
.shopImg {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.discountedPrice {
|
||
background: linear-gradient(90deg, #fd3404 0%, #fe7e1f 100%);
|
||
padding: 4rpx 12rpx;
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
color: #ffffff;
|
||
line-height: 32rpx;
|
||
font-style: normal;
|
||
border-radius: 16rpx;
|
||
position: absolute;
|
||
bottom: -12rpx;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
}
|
||
}
|
||
|
||
.price {
|
||
width: 100%;
|
||
display: inline-block;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #756c6a;
|
||
line-height: 36rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
text-decoration-line: line-through;
|
||
margin-top: 14rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.advertisementContentBox ::-webkit-scrollbar {
|
||
display: none;
|
||
}
|
||
|
||
.sortBox {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: flex-start;
|
||
// align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.leftSortBox {
|
||
background: linear-gradient(180deg, #ffe8e8 0%, #ffffff 100%);
|
||
border-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
padding: 12rpx 24rpx;
|
||
margin-right: 16rpx;
|
||
min-width: 320rpx;
|
||
|
||
.titleTopSort {
|
||
width: 100%;
|
||
|
||
.title {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 32rpx;
|
||
color: #130f05;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
|
||
.red {
|
||
color: #ff3e3e;
|
||
}
|
||
}
|
||
}
|
||
|
||
.notice {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 20rpx;
|
||
color: #716f69;
|
||
line-height: 28rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.shopList {
|
||
width: 100%;
|
||
height: 128rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-top: 16rpx;
|
||
|
||
.shopItem {
|
||
width: 128rpx;
|
||
height: 128rpx;
|
||
|
||
.shopImg {
|
||
width: 128rpx;
|
||
height: 128rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.rightItem {
|
||
border-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
padding: 12rpx 24rpx;
|
||
min-width: 160rpx;
|
||
|
||
.titleTopSort {
|
||
width: 100%;
|
||
|
||
.title {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 32rpx;
|
||
color: #130f05;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
|
||
.red {
|
||
color: #ff8000;
|
||
}
|
||
}
|
||
}
|
||
|
||
.notice {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 20rpx;
|
||
color: #716f69;
|
||
line-height: 28rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.shopList {
|
||
width: 100%;
|
||
height: 128rpx;
|
||
margin-top: 16rpx;
|
||
|
||
.shopItem {
|
||
width: 128rpx;
|
||
height: 128rpx;
|
||
margin-top: 16rpx;
|
||
|
||
.shopImg {
|
||
width: 128rpx;
|
||
height: 128rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.bg2 {
|
||
background: linear-gradient(180deg, #ffefe0 0%, #ffffff 100%);
|
||
}
|
||
|
||
.bg3 {
|
||
background: linear-gradient(180deg, #d8f9de 0%, #ffffff 100%);
|
||
}
|
||
}
|
||
}
|
||
|
||
.advertisementSecond {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.advertisementItem {
|
||
width: 100%;
|
||
//width: calc((100% - 26rpx) / 2);
|
||
height: 316rpx;
|
||
background: #fff;
|
||
border-radius: 14rpx;
|
||
box-sizing: border-box;
|
||
padding: 2rpx;
|
||
|
||
.advertisementItemContent {
|
||
width: 100%;
|
||
height: 100%;
|
||
box-sizing: border-box;
|
||
padding: 16rpx 22rpx;
|
||
background-image: url("https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/recommendation.png");
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
|
||
.contentTop {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.title {
|
||
font-size: 14px;
|
||
font-weight: 600;
|
||
color: #181716;
|
||
|
||
.titleImg {
|
||
width: 112rpx;
|
||
height: 36rpx;
|
||
}
|
||
}
|
||
|
||
.moreBox {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.moreText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #8b8280;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.rightIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.contentTopUnionMall {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.title {
|
||
font-size: 26rpx;
|
||
font-weight: 600;
|
||
color: #181716;
|
||
}
|
||
}
|
||
|
||
.shopDesc {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #8b8280;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.shopItemList {
|
||
width: 100%;
|
||
height: 95px;
|
||
margin-top: 24rpx;
|
||
|
||
.shopItem {
|
||
width: 136rpx;
|
||
display: inline-block;
|
||
margin-right: 24rpx;
|
||
|
||
.imgBox {
|
||
width: 136rpx;
|
||
height: 136rpx;
|
||
border-radius: 50%;
|
||
overflow: hidden;
|
||
|
||
.shopImg {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.shopImgText {
|
||
display: inline-block;
|
||
width: 100%;
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
color: #fe3f22;
|
||
line-height: 32rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
|
||
.shopSmallText {
|
||
font-size: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.advertisementItemContent ::-webkit-scrollbar {
|
||
display: none;
|
||
}
|
||
}
|
||
|
||
.advertisementItemUnionMall {
|
||
width: 100%;
|
||
background: #fff;
|
||
border-radius: 14rpx;
|
||
box-sizing: border-box;
|
||
padding: 2rpx;
|
||
|
||
.advertisementItemContent {
|
||
width: 100%;
|
||
height: 100%;
|
||
box-sizing: border-box;
|
||
padding: 16rpx 22rpx;
|
||
background: linear-gradient(rgba(255, 239, 238, 1) 0%,
|
||
rgba(255, 254, 254, 1) 100%) no-repeat;
|
||
background-size: 100% 176rpx;
|
||
// background-image: url("https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/recommendation.png");
|
||
// background-repeat: no-repeat;
|
||
// background-size: 100% 100%;
|
||
|
||
.contentTopUnionMall {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.title {
|
||
font-size: 26rpx;
|
||
font-weight: 600;
|
||
color: #181716;
|
||
}
|
||
}
|
||
|
||
.shopItemList {
|
||
width: 100%;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
.shopItem {
|
||
width: 20%;
|
||
height: 166rpx;
|
||
overflow: hidden;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
.imgBox {
|
||
width: 96rpx;
|
||
height: 96rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
background-color: #f3f6f9;
|
||
border-radius: 50%;
|
||
justify-content: center;
|
||
font-size: 24rpx;
|
||
margin-bottom: 4rpx;
|
||
}
|
||
|
||
.imgText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #130f05;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.allShopList {
|
||
width: 100%;
|
||
margin-top: 40rpx;
|
||
|
||
.allShopTitle {
|
||
font-size: 16px;
|
||
font-weight: 600;
|
||
color: #181716;
|
||
}
|
||
|
||
.jfDescBox {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
|
||
.descImg {
|
||
width: 100%;
|
||
}
|
||
}
|
||
|
||
|
||
.allTypeBox {
|
||
width: calc(100vw - 48rpx);
|
||
height: 60rpx;
|
||
box-sizing: border-box;
|
||
padding: 0 24rpx;
|
||
white-space: nowrap;
|
||
|
||
.typeItem {
|
||
display: inline;
|
||
margin-right: 32rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #020e1a;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.selectTypeItem {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #0787f3;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
position: relative;
|
||
}
|
||
|
||
.selectTypeItem:after {
|
||
content: "";
|
||
position: absolute;
|
||
width: 48rpx;
|
||
height: 6rpx;
|
||
background: #1890ff;
|
||
border-radius: 2rpx;
|
||
bottom: -10rpx;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
}
|
||
}
|
||
|
||
.allShopListContent {
|
||
width: 100%;
|
||
// height: 800rpx;
|
||
margin-top: 38rpx;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: space-between;
|
||
|
||
.buyShopItem {
|
||
width: calc((100% - 22rpx) / 2);
|
||
background: #fff;
|
||
border-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
margin-bottom: 24rpx;
|
||
|
||
.shopImgContent {
|
||
width: 100%;
|
||
height: 330rpx;
|
||
box-sizing: border-box;
|
||
overflow: hidden;
|
||
border-radius: 16rpx 16rpx 0 0;
|
||
|
||
.shopImage {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.priceBox {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 16rpx 24rpx 32rpx;
|
||
|
||
.shopName {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 32rpx;
|
||
font-style: normal;
|
||
width: calc((100vw - 80rpx) / 2 - 40rpx);
|
||
height: 64rpx;
|
||
display: -webkit-box;
|
||
-webkit-box-orient: vertical;
|
||
-webkit-line-clamp: 2;
|
||
/* 设置显示的行数，超出的行数会被省略 */
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
|
||
.retailPrice {
|
||
margin-top: 12rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #756c6a;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
text-decoration-line: line-through;
|
||
}
|
||
|
||
.nowPrice {
|
||
.unit {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 24rpx;
|
||
color: #fe3f22;
|
||
line-height: 24rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.price {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 36rpx;
|
||
color: #fe3f22;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.shopState {
|
||
font-size: 24rpx;
|
||
color: #fff;
|
||
background: #bbbbbb;
|
||
padding: 4rpx 16rpx;
|
||
border-radius: 8rpx;
|
||
}
|
||
|
||
.buyCarBox {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.buyCarLeft {
|
||
.price {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 32rpx;
|
||
color: #ff6219;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
|
||
.smallPrice {
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
|
||
.unit {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #9fa3a8;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.buyCarIcon {
|
||
width: 70rpx;
|
||
height: 70rpx;
|
||
border-radius: 50%;
|
||
overflow: hidden;
|
||
|
||
.icon {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.shopLovely {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 4rpx 22rpx;
|
||
|
||
.shopLovelyTop {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.shopLovelyTitle {
|
||
font-size: 26rpx;
|
||
font-weight: 600;
|
||
color: #181716;
|
||
}
|
||
|
||
.shopLovelyRight {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.filterIcon {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
margin-right: 6rpx;
|
||
}
|
||
|
||
.filterText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #716f69;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
.shopLovelyList {
|
||
width: 100%;
|
||
// height: 800rpx;
|
||
margin-top: 24rpx;
|
||
padding-bottom: 24rpx;
|
||
|
||
.shopLovelyItem {
|
||
display: inline-block;
|
||
width: calc((100% - 22rpx) / 2);
|
||
background: #fff;
|
||
border-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
margin-bottom: 24rpx;
|
||
|
||
.shopImgContent {
|
||
width: 100%;
|
||
height: 330rpx;
|
||
box-sizing: border-box;
|
||
overflow: hidden;
|
||
border-radius: 16rpx 16rpx 0 0;
|
||
|
||
.shopImage {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.priceBox {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 16rpx 24rpx 32rpx;
|
||
|
||
.shopName {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 32rpx;
|
||
font-style: normal;
|
||
width: calc((100vw - 80rpx) / 2 - 40rpx);
|
||
height: 64rpx;
|
||
display: -webkit-box;
|
||
-webkit-box-orient: vertical;
|
||
-webkit-line-clamp: 2;
|
||
/* 设置显示的行数，超出的行数会被省略 */
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
|
||
.retailPrice {
|
||
margin-top: 12rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #756c6a;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
text-decoration-line: line-through;
|
||
}
|
||
|
||
.nowPrice {
|
||
.unit {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 24rpx;
|
||
color: #fe3f22;
|
||
line-height: 24rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.price {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 36rpx;
|
||
color: #fe3f22;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.shopState {
|
||
font-size: 24rpx;
|
||
color: #fff;
|
||
background: #bbbbbb;
|
||
padding: 4rpx 16rpx;
|
||
border-radius: 8rpx;
|
||
}
|
||
|
||
.buyCarBox {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.buyCarLeft {
|
||
.price {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 32rpx;
|
||
color: #ff6219;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
|
||
.smallPrice {
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
|
||
.unit {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #9fa3a8;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.buyCarIcon {
|
||
width: 70rpx;
|
||
height: 70rpx;
|
||
border-radius: 50%;
|
||
overflow: hidden;
|
||
|
||
.icon {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.inBottom {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding-bottom: 12rpx;
|
||
|
||
.bottomText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #d0d0d0;
|
||
line-height: 40rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
position: relative;
|
||
padding: 6rpx 0;
|
||
}
|
||
|
||
.bottomText::after {
|
||
content: "";
|
||
width: 30vw;
|
||
height: 2rpx;
|
||
background: #e0e0e0;
|
||
position: absolute;
|
||
left: -32vw;
|
||
top: 50%;
|
||
}
|
||
|
||
.bottomText::before {
|
||
content: "";
|
||
width: 30vw;
|
||
height: 2rpx;
|
||
background: #e0e0e0;
|
||
position: absolute;
|
||
right: -32vw;
|
||
top: 50%;
|
||
}
|
||
}
|
||
|
||
// .shopLovelyList::-webkit-scrollbar {
|
||
// display: none;
|
||
// }
|
||
}
|
||
|
||
.inBottom {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding-bottom: 12rpx;
|
||
|
||
.bottomText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #d0d0d0;
|
||
line-height: 40rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
position: relative;
|
||
padding: 6rpx 0;
|
||
}
|
||
|
||
.bottomText::after {
|
||
content: "";
|
||
width: 30vw;
|
||
height: 2rpx;
|
||
background: #e0e0e0;
|
||
position: absolute;
|
||
left: -32vw;
|
||
top: 50%;
|
||
}
|
||
|
||
.bottomText::before {
|
||
content: "";
|
||
width: 30vw;
|
||
height: 2rpx;
|
||
background: #e0e0e0;
|
||
position: absolute;
|
||
right: -32vw;
|
||
top: 50%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.priceRangeBox {
|
||
width: 100%;
|
||
height: 600rpx;
|
||
background-color: #fff;
|
||
border-radius: 32rpx 32rpx 0 0;
|
||
box-sizing: border-box;
|
||
padding: 32rpx;
|
||
|
||
.titleBox {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.title {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
color: #130f05;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.closeIcon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
}
|
||
}
|
||
|
||
.inputBox {
|
||
width: 100%;
|
||
background-color: #f5f6f7;
|
||
box-sizing: border-box;
|
||
padding: 16rpx;
|
||
border-radius: 16rpx;
|
||
margin-top: 32rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.inputItem {
|
||
width: 48%;
|
||
text-align: center;
|
||
}
|
||
|
||
.unit {
|
||
width: 4%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
}
|
||
|
||
.btnList {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.confirmBtn {
|
||
// width: 100%;
|
||
width: calc((100% - 32rpx) / 2);
|
||
background: #fd4d4d;
|
||
border-radius: 8rpx;
|
||
padding: 18rpx 0;
|
||
display: flex;
|
||
justify-content: center;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-size: 32rpx;
|
||
color: #ffffff;
|
||
line-height: 44rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
margin-top: 40rpx;
|
||
}
|
||
|
||
.cancelBtn {
|
||
width: calc((100% - 32rpx) / 2);
|
||
background: #f2f2f2;
|
||
border-radius: 8rpx;
|
||
padding: 18rpx 0;
|
||
display: flex;
|
||
justify-content: center;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-size: 32rpx;
|
||
color: #130f05;
|
||
line-height: 44rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
margin-top: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.noticePopup {
|
||
// width: 90vw;
|
||
// height: 75vh;
|
||
|
||
width: 70vw;
|
||
height: calc(2688 * 70vw / 1242);
|
||
|
||
background: #fff;
|
||
border-radius: 32rpx;
|
||
background-image: url(https://eshangtech.com/minTestImg/preSalePoster.jpg);
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
box-sizing: border-box;
|
||
padding: 300rpx 120rpx 160rpx;
|
||
// .popupContent {
|
||
// width: 100%;
|
||
// height: 100%;
|
||
// overflow-y: auto;
|
||
// .title {
|
||
// font-family: PingFangSC, PingFang SC;
|
||
// font-weight: 600;
|
||
// font-size: 24rpx;
|
||
// color: #da291a;
|
||
// line-height: 40rpx;
|
||
// text-align: left;
|
||
// font-style: normal;
|
||
// }
|
||
// .contentText {
|
||
// font-family: PingFangSC, PingFang SC;
|
||
// font-weight: 400;
|
||
// font-size: 24rpx;
|
||
// color: #262626;
|
||
// line-height: 40rpx;
|
||
// text-align: left;
|
||
// font-style: normal;
|
||
// text-indent: 48rpx;
|
||
// }
|
||
// .textIndent {
|
||
// text-indent: 48rpx;
|
||
// }
|
||
// }
|
||
// .popupContent::-webkit-scrollbar {
|
||
// display: none;
|
||
// }
|
||
}
|
||
|
||
.backTopBox {
|
||
width: 40px;
|
||
height: 40px;
|
||
border-radius: 50%;
|
||
background: #fff;
|
||
position: fixed;
|
||
right: 32px;
|
||
bottom: 150px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
z-index: 999;
|
||
|
||
.backIcon {
|
||
width: 20px;
|
||
height: 20px;
|
||
}
|
||
}
|
||
}
|
||
</style>
|