4515 lines
133 KiB
Vue
4515 lines
133 KiB
Vue
<template>
|
||
<scroll-view
|
||
class="main"
|
||
scroll-y
|
||
@scroll="handlePageScroll"
|
||
:scroll-into-view="scrollView"
|
||
scroll-with-animation
|
||
@scrolltolower="handleScrollBottom"
|
||
:style="{
|
||
backgroundImage:
|
||
pageType === 'UnionMall'
|
||
? 'url(https://eshangtech.com/minTestImg/pageBg.png)'
|
||
: 'url(https://eshangtech.com/minTestImg/pageBg.png)',
|
||
}"
|
||
>
|
||
<div class="meng" v-if="showExportFun" @click="handleHideExportFun"></div>
|
||
|
||
<div
|
||
id="navItem"
|
||
class="header"
|
||
:style="{
|
||
paddingTop: menu.top + menu.height + 'px',
|
||
backgroundImage:
|
||
pageType === 'UnionMall'
|
||
? 'url(https://eshangtech.com/minTestImg/pageBg.png)'
|
||
: 'url(https://eshangtech.com/minTestImg/pageBg.png)',
|
||
backgroundSize: pageType === 'UnionMall' ? '100% 100vh' : '100% 100vh',
|
||
paddingBottom: '16rpx',
|
||
}"
|
||
>
|
||
<view
|
||
class="headerTop"
|
||
:style="{
|
||
height: menu.height + menu.top + 4 + 'px',
|
||
paddingTop: menu.top + 'px',
|
||
paddingBottom: 4 + 'px',
|
||
backgroundImage:
|
||
pageType === 'UnionMall'
|
||
? 'url(https://eshangtech.com/minTestImg/pageBg.png)'
|
||
: 'url(https://eshangtech.com/minTestImg/pageBg.png)',
|
||
backgroundSize: pageType === 'UnionMall' ? '100% 100vh' : '100% 100vh',
|
||
}"
|
||
>
|
||
<view class="backArrowBox">
|
||
<image
|
||
class="backArrow"
|
||
:src="
|
||
pageType === 'UnionMall'
|
||
? '/static/images/home/backArrowblack.svg'
|
||
: '/static/images/home/backArrowblack.svg'
|
||
"
|
||
@click="handleBackHome"
|
||
/>
|
||
<view class="line"></view>
|
||
<!-- <image class="img" src="/static/images/home/export.svg" @click="handleShowExportBox" /> -->
|
||
<image
|
||
class="img"
|
||
style="width: 40rpx; height: 40rpx; margin-left: 8rpx"
|
||
src="https://eshangtech.com/cyy_DIB/backHomeICon.png"
|
||
@click="handleShowExportBox"
|
||
/>
|
||
</view>
|
||
<!-- <image class="backArrow"
|
||
:src="pageType === 'UnionMall' ? '/static/images/home/backArrowWhite.svg' : '/static/images/home/backArrowblack.svg'"
|
||
@click="handleBackHome" /> -->
|
||
<view
|
||
class="pageName"
|
||
:style="{ color: pageType === 'UnionMall' ? '#000' : '#000' }"
|
||
>{{ pageType === "UnionMall" ? "工会之家" : "彩云驿商城" }}</view
|
||
>
|
||
<view
|
||
class="backArrowBox"
|
||
style="background-color: transparent; border: none"
|
||
></view>
|
||
|
||
<view
|
||
class="moreFunBox"
|
||
:style="{ top: showExportObj.y + 20 + 'px' }"
|
||
v-if="showExportFun"
|
||
>
|
||
<view class="triangle"></view>
|
||
<view class="funList">
|
||
<view
|
||
class="funItem"
|
||
v-for="(item, index) in funList"
|
||
:key="index"
|
||
@click="handleExpentGo(item)"
|
||
>
|
||
<image class="funItemIcon" :src="item.src" />
|
||
<text
|
||
class="funItemText"
|
||
:style="{
|
||
border: index + 1 === funList.length ? 'none' : '',
|
||
}"
|
||
>{{ item.label }}</text
|
||
>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<scroll-view class="typeBox" scroll-x v-if="showContent">
|
||
<div
|
||
:class="pageType === 'UnionMall' ? 'contentBox' : 'contentBox contentBox2'"
|
||
: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' && user && user.INDUSTRY_MEMBERSHIP_ID"
|
||
>
|
||
<!-- && user && user.INDUSTRY_MEMBERSHIP_ID -->
|
||
<div class="imgBox">
|
||
<div class="itemImgBox">
|
||
<image
|
||
class="img"
|
||
src="https://eshangtech.com/caiyunyiImg/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="https://eshangtech.com/caiyunyiImg/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>
|
||
|
||
<!-- 商城页面骨架屏 -->
|
||
<view class="shop-skeleton" v-if="!showContent">
|
||
<!-- 商品分类骨架 (对应 contentBox) -->
|
||
<view class="skeleton-content-box">
|
||
<view class="skeleton-category-grid">
|
||
<view class="skeleton-category-item" v-for="index in 6" :key="index">
|
||
<view class="skeleton skeleton-category-icon"></view>
|
||
<view class="skeleton skeleton-category-text"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 每周特惠骨架 -->
|
||
<view class="skeleton-section">
|
||
<view class="skeleton-section-header">
|
||
<view class="skeleton skeleton-section-title"></view>
|
||
<view class="skeleton skeleton-more-button"></view>
|
||
</view>
|
||
<view class="skeleton-horizontal-list">
|
||
<view class="skeleton-horizontal-item" v-for="index in 4" :key="index">
|
||
<view class="skeleton skeleton-horizontal-image"></view>
|
||
<view class="skeleton skeleton-horizontal-price"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 自有品牌骨架 -->
|
||
<view class="skeleton-section">
|
||
<view class="skeleton-section-header">
|
||
<view class="skeleton skeleton-section-title"></view>
|
||
<view class="skeleton skeleton-more-button"></view>
|
||
</view>
|
||
<view class="skeleton-horizontal-list">
|
||
<view class="skeleton-horizontal-item" v-for="index in 4" :key="index">
|
||
<view class="skeleton skeleton-horizontal-image"></view>
|
||
<view class="skeleton skeleton-horizontal-price"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 商品网格骨架 -->
|
||
<view class="skeleton-grid">
|
||
<view class="skeleton-grid-item" v-for="index in 8" :key="index">
|
||
<view class="skeleton skeleton-product-image"></view>
|
||
<view class="skeleton skeleton-product-name"></view>
|
||
<view class="skeleton skeleton-product-price"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<div class="pageContent" v-if="showContent">
|
||
<!-- 公告 -->
|
||
<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 && false"
|
||
:style="{
|
||
background: pageType !== 'UnionMall' ? '#fff' : 'transparent',
|
||
marginTop: 0,
|
||
}"
|
||
>
|
||
<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
|
||
v-if="pageType !== 'UnionMall'"
|
||
class="advertisementSecond"
|
||
:style="{ height: showModalActivityImg ? '240rpx' : '' }"
|
||
@click="handleGoShopPage({}, 3)"
|
||
>
|
||
<image
|
||
style="width: 100%; height: 100%; border-radius: 16rpx"
|
||
:lazy-load="true"
|
||
src="https://eshangtech.com/caiyunyiImg/indexTopBg2.jpg"
|
||
@load="handleShowModalActivityImg"
|
||
/>
|
||
</div>
|
||
|
||
<!-- 活动专区 -->
|
||
<div
|
||
class="advertisement"
|
||
v-if="pageType !== 'UnionMall'"
|
||
:style="{
|
||
background: pageType !== 'UnionMall' ? '#fff' : 'transparent',
|
||
}"
|
||
>
|
||
<div
|
||
class="advertisementContentBox"
|
||
v-if="pageType !== 'UnionMall'"
|
||
@click="handleGoShopPage({}, 3)"
|
||
>
|
||
<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: marketingCampaign.slice(0, 5).length * 160 + 'rpx',
|
||
height: '100%',
|
||
whiteSpace: 'noWrap',
|
||
}"
|
||
>
|
||
<div
|
||
class="shopItem"
|
||
v-for="(item, index) in marketingCampaign.slice(0, 5)"
|
||
:key="index"
|
||
@click.stop="handleGoShopDetail(item)"
|
||
>
|
||
<div class="shopItemImg">
|
||
<div class="imgBox">
|
||
<image
|
||
class="shopImg"
|
||
:src="
|
||
item.IMAGE_PATH
|
||
? item.IMAGE_PATH.split(',') &&
|
||
item.IMAGE_PATH.split(',').length > 1
|
||
? item.IMAGE_PATH.split(',')[0]
|
||
: 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="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.slice(0, 10).length * 160 + 'rpx',
|
||
height: '100%',
|
||
whiteSpace: 'noWrap',
|
||
}"
|
||
>
|
||
<div
|
||
class="shopItem"
|
||
v-for="(item, index) in weeklySpecialOffer.slice(0, 10)"
|
||
:key="index"
|
||
@click.stop="handleGoShopDetail(item)"
|
||
>
|
||
<div class="shopItemImg">
|
||
<div class="imgBox">
|
||
<image
|
||
class="shopImg"
|
||
:src="
|
||
item.IMAGE_PATH
|
||
? item.IMAGE_PATH.split(',') &&
|
||
item.IMAGE_PATH.split(',').length > 1
|
||
? item.IMAGE_PATH.split(',')[0]
|
||
: 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.slice(0, 10).length * 160 + 'rpx',
|
||
height: '100%',
|
||
whiteSpace: 'noWrap',
|
||
}"
|
||
>
|
||
<div
|
||
class="shopItem"
|
||
v-for="(item, index) in specialOffersList.slice(0, 10)"
|
||
:key="index"
|
||
@click.stop="handleGoShopDetail(item)"
|
||
>
|
||
<div class="shopItemImg">
|
||
<div class="imgBox">
|
||
<image
|
||
class="shopImg"
|
||
:src="
|
||
item.IMAGE_PATH
|
||
? item.IMAGE_PATH.split(',') &&
|
||
item.IMAGE_PATH.split(',').length > 1
|
||
? item.IMAGE_PATH.split(',')[0]
|
||
: 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)"
|
||
v-if="newShopList && newShopList.length > 0"
|
||
:style="{
|
||
width:
|
||
hotShopList && hotShopList.length > 0
|
||
? ''
|
||
: goodShopList && goodShopList.length > 0
|
||
? 'calc(50% - 16rpx)'
|
||
: '100%',
|
||
}"
|
||
>
|
||
<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 + 1 === goodShopList.length ? '' : '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)"
|
||
:style="{
|
||
width:
|
||
goodShopList && goodShopList.length > 0
|
||
? ''
|
||
: newShopList && newShopList.length > 0
|
||
? 'calc(50% - 16rpx)'
|
||
: '100%',
|
||
}"
|
||
v-if="hotShopList && hotShopList.length > 0"
|
||
>
|
||
<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"
|
||
:style="{ marginRight: index + 1 === goodShopList.length ? '' : '16rpx' }"
|
||
>
|
||
<image
|
||
class="shopImg"
|
||
:src="item.IMAGE_PATH"
|
||
@click.stop="handleGoShopDetail(item)"
|
||
/>
|
||
</view>
|
||
</view>
|
||
</div>
|
||
|
||
<div
|
||
class="rightItem bg3"
|
||
:style="{
|
||
width:
|
||
hotShopList && hotShopList.length > 0
|
||
? ''
|
||
: newShopList && newShopList.length > 0
|
||
? 'calc(50% - 16rpx)'
|
||
: '100%',
|
||
}"
|
||
style=""
|
||
@click="handleGoSortList(3)"
|
||
v-if="goodShopList && goodShopList.length > 0"
|
||
>
|
||
<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"
|
||
:style="{ marginRight: index + 1 === goodShopList.length ? '' : '16rpx' }"
|
||
>
|
||
<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.slice(0, 10).length * 160 + 'rpx',
|
||
height: '100%',
|
||
whiteSpace: 'noWrap',
|
||
}"
|
||
>
|
||
<!-- @click="handleGoShop(item)"-->
|
||
<div
|
||
class="shopItem"
|
||
v-for="(item, index) in todayOffersList.slice(0, 10)"
|
||
:key="index"
|
||
@click.stop="handleGoShopDetail(item)"
|
||
>
|
||
<div class="imgBox">
|
||
<image
|
||
class="shopImg"
|
||
:src="
|
||
item.IMAGE_PATH
|
||
? item.IMAGE_PATH
|
||
: item.IMAGE_PATHS && item.IMAGE_PATHS.split(',').length > 1
|
||
? item.IMAGE_PATHS.split(',')[0]
|
||
: '/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' && productsList && productsList.length > 0"
|
||
>
|
||
<div class="advertisementSecond">
|
||
<div
|
||
class="advertisementItem"
|
||
@click="handleGoPointsMall"
|
||
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: productsList.length * 160 + 'rpx',
|
||
height: '100%',
|
||
whiteSpace: 'noWrap',
|
||
}"
|
||
>
|
||
<!-- @click="handleGoShop(item)"-->
|
||
<div
|
||
class="shopItem"
|
||
v-for="(item, index) in productsList"
|
||
: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>
|
||
</template>
|
||
|
||
<!-- 老积分商城样式 -->
|
||
<!-- <template v-if="pageType !== 'UnionMall'"> -->
|
||
<template v-if="false">
|
||
<view class="allShopTitle">积分商城</view>
|
||
<!-- <view class="jfDescBox">
|
||
<image mode="widthFix" class="descImg" src="https://eshangtech.com/ShopICO/ahyd-mall/descImg.png" />
|
||
</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
|
||
? item.IMAGE_PATH.split(',') &&
|
||
item.IMAGE_PATH.split(',').length > 1
|
||
? item.IMAGE_PATH.split(',')[0]
|
||
: item.IMAGE_PATH
|
||
: '/static/images/home/defultImg.png'
|
||
"
|
||
/>
|
||
</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" :style="{ bottom: popupBottom + 'px' }">
|
||
<image
|
||
class="closeIcon"
|
||
src="/static/images/home/closeIcon.svg"
|
||
@click="handleClosePricePopup"
|
||
/>
|
||
<view class="sortBox">
|
||
<view class="sortItemBox">
|
||
<view class="sortItemTitle">排序类别</view>
|
||
<picker
|
||
class="sortItemValue"
|
||
@change="handleChangeShopSort"
|
||
:value="selectShopSort"
|
||
:range="shopSortTypeList"
|
||
range-key="label"
|
||
>
|
||
<view class="picker">
|
||
{{ shopSortTypeList[selectShopSort].label }}
|
||
<image
|
||
class="pickerIcon"
|
||
src="https://eshangtech.com/caiyunyiImg/bottomArrow.png"
|
||
/>
|
||
</view>
|
||
</picker>
|
||
</view>
|
||
|
||
<view class="sortItemBox">
|
||
<view class="sortItemTitle">排序类型</view>
|
||
<picker
|
||
class="sortItemValue"
|
||
@change="handleChangeSortType"
|
||
:value="selectSortType"
|
||
:range="sortTypeList"
|
||
range-key="label"
|
||
>
|
||
<view class="picker">
|
||
{{ sortTypeList[selectSortType].label }}
|
||
<image
|
||
class="pickerIcon"
|
||
src="https://eshangtech.com/caiyunyiImg/bottomArrow.png"
|
||
/>
|
||
</view>
|
||
</picker>
|
||
</view>
|
||
</view>
|
||
<view class="titleBox">
|
||
<view class="closeIcon"></view>
|
||
<text class="title">价格区间</text>
|
||
</view>
|
||
|
||
<view class="inputBox">
|
||
<view class="inputItem">
|
||
<input
|
||
placeholder="最低价"
|
||
v-model="minPrice"
|
||
type="number"
|
||
:adjust-position="false"
|
||
@focus="handleFocus"
|
||
@blur="handleBlur"
|
||
/>
|
||
</view>
|
||
<span class="unit">-</span>
|
||
<view class="inputItem">
|
||
<input
|
||
placeholder="最高价"
|
||
v-model="maxPrice"
|
||
type="number"
|
||
:adjust-position="false"
|
||
@focus="handleFocus"
|
||
@blur="handleBlur"
|
||
/>
|
||
</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 { mapGetters } from "vuex";
|
||
import shopTabbar from "../../../components/shopTabbar.vue";
|
||
import { useSkeletonControl } from "../../../utils/skeletonManager.js";
|
||
export default {
|
||
components: { shopTabbar },
|
||
data() {
|
||
return {
|
||
showContent: false, // 是否显示内容（控制骨架屏切换）
|
||
isFirstLoad: true, // 是否是首次进入页面
|
||
skeletonControl: null, // 骨架屏控制器
|
||
menu: {},
|
||
specialOffersList: [], // 特价优惠
|
||
weeklySpecialOffer: [], // 每周特惠
|
||
marketingCampaign: [], // 营销活动
|
||
todayOffersList: [], // 今日推荐
|
||
shopTypeList: [], // 商品大类数组
|
||
oneRowNumber: 0, // 单行个数
|
||
productsList: [], // 甄选商品
|
||
selectProducts: 0, // 选择的甄选商品类型
|
||
pageType: "", // 页面类型
|
||
brandList: [
|
||
{
|
||
label: "蓝月亮",
|
||
value: 1,
|
||
src: "https://eshangtech.com/caiyunyiImg/home/1.png",
|
||
},
|
||
{ label: "洁柔", value: 2, src: "https://eshangtech.com/caiyunyiImg/home/2.png" },
|
||
{
|
||
label: "新希望",
|
||
value: 3,
|
||
src: "https://eshangtech.com/caiyunyiImg/home/3.png",
|
||
},
|
||
{
|
||
label: "八宝贡",
|
||
value: 4,
|
||
src: "https://eshangtech.com/caiyunyiImg/home/4.png",
|
||
},
|
||
{
|
||
label: "福临门",
|
||
value: 5,
|
||
src: "https://eshangtech.com/caiyunyiImg/home/5.png",
|
||
},
|
||
{
|
||
label: "金丝莉",
|
||
value: 6,
|
||
src: "https://eshangtech.com/caiyunyiImg/home/6.png",
|
||
},
|
||
{
|
||
label: "良品铺子",
|
||
value: 7,
|
||
src: "https://eshangtech.com/caiyunyiImg/home/7.png",
|
||
},
|
||
{
|
||
label: "云南白药",
|
||
value: 8,
|
||
src: "https://eshangtech.com/caiyunyiImg/home/8.png",
|
||
},
|
||
{ label: "德和", value: 9, src: "https://eshangtech.com/caiyunyiImg/home/9.png" },
|
||
{ label: "蔬果园", value: 10, src: "https://eshangtech.com/caiyunyiImg/10.png" },
|
||
], // 热门品牌类型
|
||
minPrice: 10, // 最低价
|
||
maxPrice: 0, // 最高价
|
||
allShopList: [], // 工会之家时拿到的全部商品
|
||
showShopList: [], // 当前显示的全部商品
|
||
pageIndex: 1, // 当前显示几个 10个商品
|
||
shopMsg: {
|
||
pageIndex: 1,
|
||
pageSize: 10,
|
||
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,
|
||
popupBottom: 0, // 键盘高度
|
||
showExportFun: false, // 显示展开的悬浮框
|
||
showExportObj: {
|
||
x: "",
|
||
y: "",
|
||
},
|
||
funList: [
|
||
{ label: "商城首页", src: "" },
|
||
{ label: "", src: "" },
|
||
],
|
||
showModalActivityImg: false,
|
||
shopSortTypeList: [
|
||
{ label: "综合排序", value: 1 },
|
||
{ label: "价格排序", value: 2 },
|
||
{ label: "销量排序", value: 3 },
|
||
{ label: "上架时间排序", value: 4 },
|
||
],
|
||
selectShopSort: 0,
|
||
sortTypeList: [
|
||
{ label: "由低到高", value: 1 },
|
||
{ label: "由高到低", value: 2 },
|
||
],
|
||
selectSortType: 1,
|
||
};
|
||
},
|
||
computed: {
|
||
...mapGetters({
|
||
user: "user",
|
||
}),
|
||
},
|
||
async onLoad(query) {
|
||
// 初始化骨架屏控制
|
||
this.skeletonControl = useSkeletonControl("/pages/shopMallPage/index/index", "");
|
||
|
||
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({
|
||
behaviorRecordDesc: "进入了精选商城",
|
||
});
|
||
// 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.$javaGet(
|
||
// '/third-party/getWeChatGetMallGoodsType',
|
||
// {
|
||
// ownerUnitId: 911,
|
||
// commodityNature: 5070,
|
||
// }
|
||
// )
|
||
// console.log("handleGetShopBigType", data);
|
||
// let typeList = data.Data.List || [];
|
||
// 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);
|
||
// }
|
||
// });
|
||
// }
|
||
|
||
// this.sortType = Math.floor(Math.random() * this.sortTypeList.length);
|
||
|
||
// this.shopTypeList = resList;
|
||
|
||
// // 拿到榜单的方法
|
||
// this.handleGetSortList();
|
||
// // 拿到工会之家的商品列表
|
||
// this.handleGetUnionShopList();
|
||
// } else {
|
||
// uni.showLoading({
|
||
// title: "加载中"
|
||
// })
|
||
|
||
// 拿到顶部商品大类的方法
|
||
await this.handleGetShopBigType();
|
||
// 拿到每周优惠的内容
|
||
this.handleGetEveryWeekShop();
|
||
// 拿到模块商品的数据
|
||
this.handleGetModalProducetShop();
|
||
// 拿到特价优惠的
|
||
this.handleGetSpecialOffers();
|
||
// 拿到今日推荐的商品列表
|
||
this.handleGetTodayOffers();
|
||
// 最下面的甄选商品
|
||
this.handleGetProductsList();
|
||
if (this.haveActivity) {
|
||
this.handleGetActivityList();
|
||
}
|
||
// uni.hideLoading()
|
||
// }
|
||
|
||
if (this.skeletonControl && this.skeletonControl.showSkeleton) {
|
||
setTimeout(async () => {
|
||
if (this.skeletonControl) {
|
||
await this.skeletonControl.showContentAfterLoading(0);
|
||
this.showContent = true;
|
||
this.isFirstLoad = false;
|
||
}
|
||
}, 800);
|
||
} else {
|
||
// 非首次访问直接显示内容
|
||
this.showContent = true;
|
||
this.isFirstLoad = false;
|
||
}
|
||
},
|
||
onShow() {
|
||
// 只在首次进入时显示骨架屏
|
||
if (this.isFirstLoad) {
|
||
this.showContent = false;
|
||
setTimeout(() => {
|
||
this.showContent = true;
|
||
}, 800); // 适当延长骨架屏显示时间
|
||
this.isFirstLoad = false; // 标记已经不是首次进入
|
||
} else {
|
||
// 非首次进入，直接显示内容
|
||
this.showContent = true;
|
||
}
|
||
|
||
// 判断当前的购物车里面是否有东西
|
||
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() {
|
||
this.handleToBottom();
|
||
},
|
||
onShareAppMessage() {
|
||
let _this = this;
|
||
return {
|
||
// title: _this.pageType === "UnionMall" ? "工会之家" : "精选商城",
|
||
title: "彩云驿商城",
|
||
path: `/pages/index/index`,
|
||
};
|
||
},
|
||
onShareTimeline() {
|
||
let _this = this;
|
||
return {
|
||
// title: _this.pageType === "UnionMall" ? "工会之家" : "精选商城",
|
||
title: "彩云驿商城",
|
||
path: `/pages/index/index`,
|
||
};
|
||
},
|
||
onUnload() {
|
||
// 页面卸载时重置首次加载标记，确保下次进入仍显示骨架屏
|
||
this.isFirstLoad = true;
|
||
},
|
||
methods: {
|
||
// 改变商品排序规则
|
||
handleChangeSortType(e) {
|
||
this.selectSortType = Number(e.detail.value);
|
||
},
|
||
// 改变商品排序类型
|
||
handleChangeShopSort(e) {
|
||
let type = Number(e.detail.value);
|
||
if (type === 0) {
|
||
this.sortTypeList = [
|
||
{ label: "由低到高", value: 1 },
|
||
{ label: "由高到低", value: 2 },
|
||
];
|
||
} else if (type === 1) {
|
||
this.sortTypeList = [
|
||
{ label: "由低到高", value: 1 },
|
||
{ label: "由高到低", value: 2 },
|
||
];
|
||
} else if (type === 2) {
|
||
this.sortTypeList = [
|
||
{ label: "由低到高", value: 1 },
|
||
{ label: "由高到低", value: 2 },
|
||
];
|
||
} else if (type === 3) {
|
||
this.sortTypeList = [
|
||
{ label: "由远到近", value: 1 },
|
||
{ label: "由近到远", value: 2 },
|
||
];
|
||
}
|
||
this.selectShopSort = type;
|
||
},
|
||
handleShowModalActivityImg(e) {
|
||
console.log("eee", e);
|
||
|
||
this.showModalActivityImg = true;
|
||
},
|
||
handleHideExportFun() {
|
||
this.showExportFun = false;
|
||
},
|
||
// 显示展开功能
|
||
handleShowExportBox(e) {
|
||
uni.switchTab({
|
||
url: "/pages/index/index",
|
||
});
|
||
// console.log('e', e);
|
||
// this.showExportFun = !this.showExportFun;
|
||
// this.showExportObj = e.detail
|
||
},
|
||
handleFocus(e) {
|
||
console.log("eee", e);
|
||
// 安卓 / iOS 可能不一样，可以用 e.detail.height 获取键盘高度
|
||
this.popupBottom = 200; // 默认抬高
|
||
},
|
||
handleBlur() {
|
||
this.popupBottom = 0;
|
||
},
|
||
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 _this = this;
|
||
let data1 = {};
|
||
let newShowList = uni.getStorageSync("newShowList");
|
||
if (newShowList) {
|
||
data1 = newShowList;
|
||
this.$api
|
||
.$javaGet("/third-party/getWeChatGetMallGoodsInfo", {
|
||
action_type: "WeChat_GetMallGoodsInfo",
|
||
ownerUnitId: 911,
|
||
COMMODITYNATURE: 5070,
|
||
payMethod: "1000,3000",
|
||
justCommodity: 1,
|
||
userdefinedTypeId: "1317",
|
||
})
|
||
.then((data) => {
|
||
if (JSON.stringify(data1) !== JSON.stringify(data)) {
|
||
uni.setStorageSync("newShowList", data);
|
||
_this.handleGetSortListShowData1(data);
|
||
}
|
||
});
|
||
} else {
|
||
data1 = await this.$api.$javaGet("/third-party/getWeChatGetMallGoodsInfo", {
|
||
action_type: "WeChat_GetMallGoodsInfo",
|
||
ownerUnitId: 911,
|
||
COMMODITYNATURE: 5070,
|
||
payMethod: "1000,3000",
|
||
justCommodity: 1,
|
||
userdefinedTypeId: "1317",
|
||
});
|
||
}
|
||
|
||
this.handleGetSortListShowData1(data1);
|
||
|
||
// 热销榜
|
||
let data2 = {};
|
||
let hotShopList = uni.getStorageSync("hotShopList");
|
||
if (hotShopList) {
|
||
data2 = hotShopList;
|
||
this.$api
|
||
.$javaGet("/third-party/getWeChatGetMallGoodsInfo", {
|
||
action_type: "WeChat_GetMallGoodsInfo",
|
||
ownerUnitId: 911,
|
||
COMMODITYNATURE: 5070,
|
||
payMethod: "1000,3000",
|
||
justCommodity: 1,
|
||
userdefinedTypeId: "1318",
|
||
sortStr: "COMMODITY_EN desc",
|
||
})
|
||
.then((data) => {
|
||
if (JSON.stringify(data2) !== JSON.stringify(data)) {
|
||
uni.setStorageSync("hotShopList", data);
|
||
_this.handleGetSortListShowData2(data);
|
||
}
|
||
});
|
||
} else {
|
||
data2 = await this.$api.$javaGet("/third-party/getWeChatGetMallGoodsInfo", {
|
||
action_type: "WeChat_GetMallGoodsInfo",
|
||
ownerUnitId: 911,
|
||
COMMODITYNATURE: 5070,
|
||
payMethod: "1000,3000",
|
||
justCommodity: 1,
|
||
userdefinedTypeId: "1318",
|
||
sortStr: "COMMODITY_EN desc",
|
||
});
|
||
}
|
||
this.handleGetSortListShowData2(data2);
|
||
|
||
// 推荐榜
|
||
let data3 = {};
|
||
let goodShopList = uni.getStorageSync("goodShopList");
|
||
if (goodShopList) {
|
||
data3 = goodShopList;
|
||
this.$api
|
||
.$javaGet("/third-party/getWeChatGetMallGoodsInfo", {
|
||
action_type: "WeChat_GetMallGoodsInfo",
|
||
ownerUnitId: 911,
|
||
COMMODITYNATURE: 5070,
|
||
payMethod: "1000,3000",
|
||
justCommodity: 1,
|
||
userdefinedTypeId: "1319",
|
||
})
|
||
.then((data) => {
|
||
if (JSON.stringify(data3) !== JSON.stringify(data)) {
|
||
uni.setStorageSync("goodShopList", data);
|
||
_this.handleGetSortListShowData3(data);
|
||
}
|
||
});
|
||
} else {
|
||
data3 = await this.$api.$javaGet("/third-party/getWeChatGetMallGoodsInfo", {
|
||
action_type: "WeChat_GetMallGoodsInfo",
|
||
ownerUnitId: 911,
|
||
COMMODITYNATURE: 5070,
|
||
payMethod: "1000,3000",
|
||
justCommodity: 1,
|
||
userdefinedTypeId: "1319",
|
||
});
|
||
}
|
||
|
||
this.handleGetSortListShowData3(data3);
|
||
},
|
||
// 显示新品榜的方法
|
||
handleGetSortListShowData1(data1) {
|
||
let list1 = this.handleChangeShopList(data1.Data.List);
|
||
this.newShopList = list1.slice(0, 4);
|
||
// this.newShopList = []
|
||
},
|
||
// 显示热销榜的方法
|
||
handleGetSortListShowData2(data2) {
|
||
let list2 = this.handleChangeShopList(data2.Data.List);
|
||
this.hotShopList = list2.slice(0, 4);
|
||
// this.hotShopList = []
|
||
},
|
||
// 显示推荐榜的方法
|
||
handleGetSortListShowData3(data3) {
|
||
let list3 = this.handleChangeShopList(data3.Data.List);
|
||
this.goodShopList = list3.slice(0, 4);
|
||
// this.hotShopList = []
|
||
},
|
||
|
||
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"
|
||
// }`, // 排序
|
||
sortStr: `${
|
||
this.selectShopSort === 0
|
||
? "COMMODITY_INDEX,COMMODITY_EN,COMMODITY_MEMBERPRICE,OPERATE_DATE"
|
||
: this.selectShopSort === 1
|
||
? "COMMODITY_MEMBERPRICE"
|
||
: this.selectShopSort === 2
|
||
? "COMMODITY_EN"
|
||
: this.selectShopSort === 3
|
||
? "OPERATE_DATE"
|
||
: ""
|
||
} ${this.selectSortType === 0 ? "asc" : "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() {
|
||
if (Number(this.minPrice) <= Number(this.maxPrice)) {
|
||
} else {
|
||
if (this.maxPrice && this.minPrice) {
|
||
let newMax = Number(this.minPrice);
|
||
let newMin = Number(this.maxPrice);
|
||
this.maxPrice = newMax;
|
||
this.minPrice = newMin;
|
||
}
|
||
}
|
||
this.showShopList = [];
|
||
this.shopMsg = {
|
||
pageIndex: 1,
|
||
pageSize: 10,
|
||
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() {
|
||
let _this = this;
|
||
let typeList = [];
|
||
let getWeChatGetMallGoodsType = uni.getStorageSync("getWeChatGetMallGoodsType");
|
||
if (getWeChatGetMallGoodsType) {
|
||
typeList = getWeChatGetMallGoodsType;
|
||
this.$api
|
||
.$javaGet("/third-party/getWeChatGetMallGoodsType", {
|
||
ownerUnitId: 911,
|
||
commodityNature: 5070, // 类型
|
||
})
|
||
.then((data) => {
|
||
let newTypeList = data.Data.List;
|
||
if (JSON.stringify(newTypeList) !== JSON.stringify(typeList)) {
|
||
uni.setStorageSync("getWeChatGetMallGoodsType", newTypeList);
|
||
_this.handleShowPageShopBigType(newTypeList);
|
||
}
|
||
});
|
||
} else {
|
||
const data = await this.$api.$javaGet("/third-party/getWeChatGetMallGoodsType", {
|
||
ownerUnitId: 911,
|
||
commodityNature: 5070, // 类型
|
||
});
|
||
console.log("handleGetShopBigType", data);
|
||
typeList = data.Data.List;
|
||
uni.setStorageSync("getWeChatGetMallGoodsType", typeList);
|
||
}
|
||
console.log("typeList", typeList);
|
||
this.handleShowPageShopBigType(typeList);
|
||
},
|
||
// 拿到顶部商品大类的方法 实际要赋值到页面上去的方法
|
||
handleShowPageShopBigType(typeList) {
|
||
let resList = [];
|
||
// 如果有活动的话就有值
|
||
let activityObj = {};
|
||
let indexOfList = [3186, 3175, 4597, 4797];
|
||
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;
|
||
},
|
||
// 拿到活动的商品列表 可能不调用 有判断的
|
||
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() {
|
||
let _this = this;
|
||
let list = [];
|
||
let getWeChatGetMallGoodsInfoExclude = uni.getStorageSync(
|
||
"getWeChatGetMallGoodsInfoExclude"
|
||
);
|
||
if (getWeChatGetMallGoodsInfoExclude) {
|
||
list = getWeChatGetMallGoodsInfoExclude;
|
||
let url = "/third-party/getWeChatGetMallGoodsInfoExclude";
|
||
this.$api
|
||
.$javaGet(url, {
|
||
ownerUnitId: 911,
|
||
// COMMODITYNATURE: 5030,//特价优惠
|
||
COMMODITYNATURE: 5021, // 绿色云品
|
||
userdefinedTypeId: 3186, // 绿色云品
|
||
userdefinedtypeId: 3186, // 绿色云品
|
||
excludeNature: 5070,
|
||
justCommodity: 1,
|
||
})
|
||
.then((data) => {
|
||
let newList = data.Data && data.Data.List ? data.Data.List : [];
|
||
if (JSON.stringify(newList) !== JSON.stringify(list)) {
|
||
uni.setStorageSync("getWeChatGetMallGoodsInfoExclude", newList);
|
||
_this.handleGetSpecialOffersShowData(newList);
|
||
}
|
||
});
|
||
} else {
|
||
let url = "/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,
|
||
}
|
||
);
|
||
list = data.Data && data.Data.List ? data.Data.List : [];
|
||
}
|
||
this.handleGetSpecialOffersShowData(list);
|
||
},
|
||
|
||
// 拿到特价优惠的商品列表显示内容的方法
|
||
handleGetSpecialOffersShowData(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() {
|
||
let _this = this;
|
||
let list = [];
|
||
let getWeChatGetMallGoodsInfo = uni.getStorageSync("getWeChatGetMallGoodsInfo");
|
||
if (getWeChatGetMallGoodsInfo) {
|
||
list = getWeChatGetMallGoodsInfo;
|
||
this.$api
|
||
.$javaGet("/third-party/getWeChatGetMallGoodsInfo", {
|
||
ownerUnitId: 911,
|
||
userdefinedtypeId: 4597,
|
||
userdefinedTypeId: 4597,
|
||
justCommodity: 1,
|
||
})
|
||
.then((data) => {
|
||
let newList = data.Data && data.Data.List ? data.Data.List : [];
|
||
if (JSON.stringify(newList) !== JSON.stringify(list)) {
|
||
uni.setStorageSync("getWeChatGetMallGoodsInfo", newList);
|
||
_this.handleGetEveryWeekShopShowData(newList);
|
||
}
|
||
});
|
||
} else {
|
||
const data = await this.$api.$javaGet("/third-party/getWeChatGetMallGoodsInfo", {
|
||
ownerUnitId: 911,
|
||
userdefinedtypeId: 4597,
|
||
userdefinedTypeId: 4597,
|
||
justCommodity: 1,
|
||
});
|
||
list = data.Data && data.Data.List ? data.Data.List : [];
|
||
uni.setStorageSync("getWeChatGetMallGoodsInfo", list);
|
||
}
|
||
|
||
this.handleGetEveryWeekShopShowData(list);
|
||
},
|
||
// 拿到模块商品的商品列表
|
||
async handleGetModalProducetShop() {
|
||
let _this = this;
|
||
let list = [];
|
||
let moduleActivity = uni.getStorageSync("moduleActivity");
|
||
if (moduleActivity) {
|
||
list = moduleActivity;
|
||
this.$api
|
||
.$javaGet("/third-party/getWeChatGetMallGoodsInfo", {
|
||
ownerUnitId: 911,
|
||
userdefinedtypeId: 4797,
|
||
userdefinedTypeId: 4797,
|
||
justCommodity: 1,
|
||
})
|
||
.then((data) => {
|
||
let newList = data.Data && data.Data.List ? data.Data.List : [];
|
||
if (JSON.stringify(newList) !== JSON.stringify(list)) {
|
||
uni.setStorageSync("moduleActivity", newList);
|
||
_this.handleGetModalProducetShopShowData(newList);
|
||
}
|
||
});
|
||
} else {
|
||
const data = await this.$api.$javaGet("/third-party/getWeChatGetMallGoodsInfo", {
|
||
ownerUnitId: 911,
|
||
userdefinedtypeId: 4797,
|
||
userdefinedTypeId: 4797,
|
||
justCommodity: 1,
|
||
});
|
||
list = data.Data && data.Data.List ? data.Data.List : [];
|
||
uni.setStorageSync("moduleActivity", list);
|
||
}
|
||
|
||
this.handleGetModalProducetShopShowData(list);
|
||
},
|
||
// 每周商品特惠显示数据的方法
|
||
handleGetEveryWeekShopShowData(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;
|
||
}
|
||
if (subItem.IMAGE_PATH || subItem.IMAGE_PATHS) {
|
||
shopList.push(subItem);
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
console.log(
|
||
"weeklySpecialOfferweeklySpecialOfferweeklySpecialOfferweeklySpecialOffer",
|
||
shopList
|
||
);
|
||
this.weeklySpecialOffer = shopList;
|
||
},
|
||
// 模块商品显示数据的方法
|
||
handleGetModalProducetShopShowData(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.marketingCampaign = shopList;
|
||
},
|
||
// 拿到今日推荐的商品列表 nature 5050
|
||
async handleGetTodayOffers() {
|
||
let _this = this;
|
||
let getWeChatGetMallGoodsInfoExcludeToday = uni.getStorageSync(
|
||
"getWeChatGetMallGoodsInfoExcludeToday"
|
||
);
|
||
let list = [];
|
||
if (getWeChatGetMallGoodsInfoExcludeToday) {
|
||
list = getWeChatGetMallGoodsInfoExcludeToday;
|
||
this.$api
|
||
.$javaGet("/third-party/getWeChatGetMallGoodsInfoExclude", {
|
||
ownerUnitId: 911,
|
||
// COMMODITYNATURE: 4598,// 原今日推荐
|
||
COMMODITYNATURE: 5022, //自有品牌
|
||
userdefinedtypeId: 3175, // 商品分类
|
||
userdefinedTypeId: 3175, // 商品分类
|
||
excludeNature: 5070,
|
||
justCommodity: 1,
|
||
})
|
||
.then((data) => {
|
||
let newList = data.Data && data.Data.List ? data.Data.List : [];
|
||
if (JSON.stringify(newList) !== JSON.stringify(list)) {
|
||
uni.setStorageSync("getWeChatGetMallGoodsInfoExcludeToday", newList);
|
||
_this.handleGetTodayOffersShowData(newList);
|
||
}
|
||
});
|
||
} else {
|
||
const data = await this.$api.$javaGet(
|
||
"/third-party/getWeChatGetMallGoodsInfoExclude",
|
||
{
|
||
ownerUnitId: 911,
|
||
// COMMODITYNATURE: 4598,// 原今日推荐
|
||
COMMODITYNATURE: 5022, //自有品牌
|
||
userdefinedtypeId: 3175, // 商品分类
|
||
userdefinedTypeId: 3175, // 商品分类
|
||
excludeNature: 5070,
|
||
justCommodity: 1,
|
||
}
|
||
);
|
||
list = data.Data.List;
|
||
}
|
||
this.handleGetTodayOffersShowData(list);
|
||
},
|
||
// 拿到今日推荐的商品列表显示数据的方法
|
||
handleGetTodayOffersShowData(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;
|
||
}
|
||
if (subItem.IMAGE_PATH || subItem.IMAGE_PATHS) {
|
||
shopList.push(subItem);
|
||
}
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
console.log("自有品牌", shopList);
|
||
|
||
this.todayOffersList = shopList;
|
||
},
|
||
// 跳转积分商城
|
||
handleGoPointsMall() {
|
||
// uni.navigateTo({
|
||
// url: `/pages/shopPages/shopList/index?pageType=pointsMall`,
|
||
// });
|
||
|
||
uni.redirectTo({
|
||
url: `/pages/shopMallPage/shopType/index?selectIndex=${999999}&pageType=${
|
||
this.pageType
|
||
}`,
|
||
});
|
||
},
|
||
// 切换甄选商品的类型
|
||
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.$javaGet("/third-party/getWeChatGetMallGoodsInfo", {
|
||
ownerUnitId: 911,
|
||
justCommodity: 1,
|
||
payMethod: "2000,3000",
|
||
COMMODITYNATURE: 6000,
|
||
});
|
||
|
||
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,
|
||
// // });
|
||
|
||
// uni.redirectTo({
|
||
// url: `/pages/shopMallPage/index/index`,
|
||
// });
|
||
// } 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({
|
||
// // leftId=${obj.UserdefinedType_Id}&
|
||
// url: `/pages/shopMallPage/shopType/index?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`,
|
||
// });
|
||
uni.switchTab({
|
||
url: `/pages/shopMallPage/tradeUnionMall/index`,
|
||
});
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
/* 骨架屏动画 */
|
||
@keyframes shimmer {
|
||
0% {
|
||
background-position: -468px 0;
|
||
}
|
||
|
||
100% {
|
||
background-position: 468px 0;
|
||
}
|
||
}
|
||
|
||
.skeleton {
|
||
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 50%, #f2f2f2 75%);
|
||
background-size: 400px 100%;
|
||
animation: shimmer 1.2s infinite;
|
||
border-radius: 8rpx;
|
||
}
|
||
|
||
/* 商城页面骨架屏样式 */
|
||
.shop-skeleton {
|
||
padding: 0 32rpx;
|
||
background: #f7f8fa;
|
||
min-height: calc(100vh - 200rpx);
|
||
}
|
||
|
||
.skeleton-content-box {
|
||
background: #ffffff;
|
||
border-radius: 20rpx;
|
||
padding: 30rpx;
|
||
margin: 20rpx 32rpx;
|
||
|
||
.skeleton-category-grid {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: space-between;
|
||
|
||
.skeleton-category-item {
|
||
width: 20%;
|
||
text-align: center;
|
||
margin-bottom: 32rpx;
|
||
|
||
.skeleton-category-icon {
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
border-radius: 16rpx;
|
||
margin: 0 auto 16rpx auto;
|
||
}
|
||
|
||
.skeleton-category-text {
|
||
width: 60rpx;
|
||
height: 24rpx;
|
||
border-radius: 12rpx;
|
||
margin: 0 auto;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.skeleton-categories {
|
||
background: #ffffff;
|
||
border-radius: 20rpx;
|
||
padding: 32rpx;
|
||
margin-bottom: 20rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
overflow-x: auto;
|
||
|
||
.skeleton-category-item {
|
||
flex-shrink: 0;
|
||
text-align: center;
|
||
margin-right: 32rpx;
|
||
|
||
&:last-child {
|
||
margin-right: 0;
|
||
}
|
||
|
||
.skeleton-category-icon {
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
border-radius: 50%;
|
||
margin: 0 auto 16rpx;
|
||
}
|
||
|
||
.skeleton-category-text {
|
||
width: 60rpx;
|
||
height: 24rpx;
|
||
margin: 0 auto;
|
||
}
|
||
}
|
||
}
|
||
|
||
.skeleton-section {
|
||
background: #ffffff;
|
||
border-radius: 20rpx;
|
||
padding: 32rpx;
|
||
margin-bottom: 20rpx;
|
||
|
||
.skeleton-section-header {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
margin-bottom: 32rpx;
|
||
|
||
.skeleton-section-title {
|
||
width: 120rpx;
|
||
height: 32rpx;
|
||
}
|
||
|
||
.skeleton-more-button {
|
||
width: 60rpx;
|
||
height: 24rpx;
|
||
}
|
||
}
|
||
|
||
.skeleton-horizontal-list {
|
||
display: flex;
|
||
overflow-x: auto;
|
||
|
||
.skeleton-horizontal-item {
|
||
flex-shrink: 0;
|
||
margin-right: 24rpx;
|
||
text-align: center;
|
||
|
||
&:last-child {
|
||
margin-right: 0;
|
||
}
|
||
|
||
.skeleton-horizontal-image {
|
||
width: 120rpx;
|
||
height: 120rpx;
|
||
border-radius: 12rpx;
|
||
margin-bottom: 16rpx;
|
||
}
|
||
|
||
.skeleton-horizontal-price {
|
||
width: 80rpx;
|
||
height: 24rpx;
|
||
margin: 0 auto;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.skeleton-grid {
|
||
background: #ffffff;
|
||
border-radius: 20rpx;
|
||
padding: 32rpx;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: space-between;
|
||
|
||
.skeleton-grid-item {
|
||
width: calc(50% - 16rpx);
|
||
margin-bottom: 32rpx;
|
||
|
||
.skeleton-product-image {
|
||
width: 100%;
|
||
height: 280rpx;
|
||
border-radius: 12rpx;
|
||
margin-bottom: 16rpx;
|
||
}
|
||
|
||
.skeleton-product-name {
|
||
width: 80%;
|
||
height: 28rpx;
|
||
margin-bottom: 12rpx;
|
||
}
|
||
|
||
.skeleton-product-price {
|
||
width: 60%;
|
||
height: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.main {
|
||
width: 100vw;
|
||
height: 100vh;
|
||
box-sizing: border-box;
|
||
background: #f2f4f5;
|
||
|
||
.meng {
|
||
width: 100vw;
|
||
height: 100vh;
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
z-index: 9999;
|
||
}
|
||
|
||
.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;
|
||
|
||
.backArrowBox {
|
||
width: 120rpx;
|
||
background: rgba(255, 255, 255, 0.6);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border-radius: 32rpx;
|
||
border: 1px solid #d9d5cc;
|
||
padding: 4rpx 16rpx;
|
||
|
||
.backArrow {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
}
|
||
|
||
.line {
|
||
width: 2rpx;
|
||
height: 32rpx;
|
||
background: #bbbbba;
|
||
margin: 0 8rpx;
|
||
}
|
||
|
||
.img {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
}
|
||
}
|
||
|
||
.moreFunBox {
|
||
width: 220rpx;
|
||
height: 220rpx;
|
||
background: #fff;
|
||
border-radius: 16rpx;
|
||
position: absolute;
|
||
z-index: 10;
|
||
left: 50rpx;
|
||
box-sizing: border-box;
|
||
padding: 12rpx 0 12rpx 16rpx;
|
||
|
||
.triangle {
|
||
position: absolute;
|
||
width: 0;
|
||
height: 0;
|
||
border-left: 5px solid transparent;
|
||
/* 左边透明 */
|
||
border-right: 5px solid transparent;
|
||
/* 右边透明 */
|
||
border-bottom: 10px solid #fff;
|
||
/* 底边颜色 */
|
||
top: -10px;
|
||
left: 40px;
|
||
}
|
||
|
||
.funList {
|
||
width: 100%;
|
||
height: 100%;
|
||
|
||
.funItem {
|
||
width: 100%;
|
||
height: 70rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.funItemIcon {
|
||
width: 30rpx;
|
||
height: 30rpx;
|
||
margin-right: 20rpx;
|
||
}
|
||
|
||
.funItemText {
|
||
width: calc(100% - 50rpx);
|
||
height: 100%;
|
||
display: inline-block;
|
||
font-size: 26rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
border-bottom: 1px solid #dad6cb;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.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;
|
||
background-image: url("https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/Special Offers.png");
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
|
||
.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;
|
||
white-space: nowrap;
|
||
|
||
.rowBox {
|
||
width: 20%;
|
||
height: 144rpx;
|
||
|
||
// width: 96rpx;
|
||
// height: 154rpx;
|
||
// display: inline-block;
|
||
// box-sizing: border-box;
|
||
|
||
display: inline-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;
|
||
white-space: nowrap;
|
||
// overflow: hidden;
|
||
// text-overflow: ellipsis;
|
||
// white-space: nowrap;
|
||
}
|
||
}
|
||
|
||
.rowBox:nth-child(5n) {
|
||
//margin-right: 0!important;
|
||
}
|
||
}
|
||
|
||
.contentBox2 {
|
||
background-image: url("https://eshangtech.com/ShopICO/ahyd-mall/wechatesAH/Special Offers.png");
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
}
|
||
}
|
||
}
|
||
|
||
.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;
|
||
width: calc(50% - 16rpx);
|
||
|
||
.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 {
|
||
width: 20%;
|
||
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;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-start;
|
||
|
||
.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%;
|
||
}
|
||
}
|
||
|
||
.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;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.priceRangeBox {
|
||
width: 100%;
|
||
height: 800rpx;
|
||
background-color: #fff;
|
||
border-radius: 32rpx 32rpx 0 0;
|
||
box-sizing: border-box;
|
||
padding: 32rpx;
|
||
transition: bottom 0.2s;
|
||
position: fixed;
|
||
|
||
.closeIcon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
position: absolute;
|
||
top: 32rpx;
|
||
right: 32rpx;
|
||
}
|
||
|
||
.sortBox {
|
||
width: 100%;
|
||
height: 180rpx;
|
||
box-sizing: border-box;
|
||
padding-top: 48rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 10rpx;
|
||
|
||
.sortItemBox {
|
||
width: 50%;
|
||
height: 100%;
|
||
box-sizing: border-box;
|
||
padding-right: 32rpx;
|
||
|
||
.sortItemTitle {
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.sortItemValue {
|
||
background-color: #f5f6f7;
|
||
box-sizing: border-box;
|
||
padding: 16rpx;
|
||
border-radius: 16rpx;
|
||
margin-top: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
display: block;
|
||
font-size: 28rpx;
|
||
|
||
.picker {
|
||
width: 100%;
|
||
text-align: center;
|
||
|
||
.pickerIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-left: 8rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.titleBox {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.title {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.inputBox {
|
||
width: 100%;
|
||
background-color: #f5f6f7;
|
||
box-sizing: border-box;
|
||
padding: 16rpx;
|
||
border-radius: 16rpx;
|
||
margin-top: 16rpx;
|
||
font-size: 28rpx;
|
||
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>
|