修正了 pages 名为拼音的问题,以及部分细节
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"usingComponents": {
|
||||
"global-notification": "/components/global-notification/global-notification",
|
||||
"custom-tab-bar": "/custom-tab-bar/index"
|
||||
"tab-bar": "/tab-bar/index"
|
||||
},
|
||||
|
||||
"navigationBarTitleText": "商城",
|
||||
|
||||
@@ -1,171 +1,171 @@
|
||||
<!-- pages/shangpin/shangpin.wxml -->
|
||||
<view class="shangpin-page">
|
||||
<!-- 1. 公告栏 -->
|
||||
<view class="gonggao-box" bindtap="showGonggaoDetail">
|
||||
<view class="gonggao-icon">
|
||||
<image src="/images/gonggao.png" mode="aspectFit" />
|
||||
</view>
|
||||
<view class="gonggao-content">
|
||||
<text class="gonggao-text {{gonggaoAnim ? 'gonggao-anim' : ''}}">
|
||||
{{shangpingonggao || '暂无公告'}}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 2. 轮播图区域 -->
|
||||
<view class="lunbo-container">
|
||||
<swiper
|
||||
class="lunbo-swiper"
|
||||
indicator-dots="{{lunboList.length > 1}}"
|
||||
indicator-color="rgba(255,255,255,0.6)"
|
||||
indicator-active-color="#ffcc00"
|
||||
autoplay="{{lunboList.length > 1}}"
|
||||
interval="3000"
|
||||
circular
|
||||
>
|
||||
<block wx:for="{{lunboList}}" wx:key="index">
|
||||
<swiper-item>
|
||||
<!-- 移除点击预览事件 -->
|
||||
<image
|
||||
src="{{item}}"
|
||||
mode="aspectFill"
|
||||
class="lunbo-image"
|
||||
/>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
|
||||
<!-- 轮播图占位图(无数据时显示) -->
|
||||
<view wx:if="{{lunboList.length === 0}}" class="lunbo-placeholder">
|
||||
<image src="{{lunbozhanwei}}" mode="aspectFill" class="lunbo-image" />
|
||||
</view>
|
||||
|
||||
<!-- 刷新按钮 -->
|
||||
<view class="refresh-btn" bindtap="refreshAllData">
|
||||
<image
|
||||
src="/images/shuaxin.png"
|
||||
mode="aspectFit"
|
||||
class="refresh-icon {{isRefreshing ? 'refreshing' : ''}}"
|
||||
/>
|
||||
<view class="refresh-dot"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 3. 商品展示区域 -->
|
||||
<view class="shangpin-container">
|
||||
<!-- 3.1 商品类型选择 -->
|
||||
<scroll-view
|
||||
class="leixing-scroll"
|
||||
scroll-x
|
||||
scroll-with-animation
|
||||
show-scrollbar="{{false}}"
|
||||
>
|
||||
<view class="leixing-list">
|
||||
<block wx:for="{{shangpinleixing}}" wx:key="id">
|
||||
<view
|
||||
class="leixing-item {{selectedLeixingId === item.id ? 'leixing-active' : ''}}"
|
||||
bindtap="selectLeixing"
|
||||
data-id="{{item.id}}"
|
||||
>
|
||||
<view class="leixing-image-box">
|
||||
<image
|
||||
src="{{ossImageUrl + item.tupian_url}}"
|
||||
mode="aspectFill"
|
||||
class="leixing-image"
|
||||
lazy-load="{{true}}"
|
||||
/>
|
||||
<view class="leixing-glow"></view>
|
||||
</view>
|
||||
<text class="leixing-text">{{item.jieshao}}</text>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<!-- 3.2 商品展示 -->
|
||||
<view class="shangpin-list-container">
|
||||
<block wx:for="{{filteredData}}" wx:key="*this">
|
||||
<!-- 专区标题 -->
|
||||
<view class="zhuanqu-title" wx:if="{{item.shangpinList.length > 0}}">
|
||||
<view class="zhuanqu-icon">
|
||||
<image
|
||||
src="/images/zhuanqu.png"
|
||||
mode="aspectFit"
|
||||
class="zhuanqu-icon-image {{idx % 3 === 0 ? 'zhuanqu-sparkle' : ''}}"
|
||||
/>
|
||||
</view>
|
||||
<text class="zhuanqu-text">{{item.zhuanqu.mingzi}}</text>
|
||||
</view>
|
||||
|
||||
<!-- 商品网格 -->
|
||||
<view class="shangpin-grid" wx:if="{{item.shangpinList.length > 0}}">
|
||||
<block wx:for="{{item.shangpinList}}" wx:key="id">
|
||||
<view
|
||||
class="shangpin-card"
|
||||
bindtap="goToDetail"
|
||||
data-id="{{item.id}}"
|
||||
>
|
||||
<!-- 商品图片 -->
|
||||
<view class="shangpin-image-box">
|
||||
<image
|
||||
src="{{ossImageUrl + item.tupian_url}}"
|
||||
mode="aspectFill"
|
||||
class="shangpin-image"
|
||||
lazy-load="{{true}}"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<!-- 商品标题 -->
|
||||
<view class="shangpin-title">
|
||||
<text class="title-text">{{item.biaoqian}}</text>
|
||||
</view>
|
||||
|
||||
<!-- 价格和购买按钮 -->
|
||||
<view class="shangpin-footer">
|
||||
<view class="price-box">
|
||||
<text class="price-icon">¥</text>
|
||||
<text class="price-integer">{{item.priceInteger}}</text>
|
||||
<text class="price-decimal">.{{item.priceDecimal}}</text>
|
||||
</view>
|
||||
<view class="buy-btn">
|
||||
<image src="/images/goumai.png" mode="aspectFit" class="buy-icon" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!-- 空状态 -->
|
||||
<view wx:if="{{filteredData.length === 0}}" class="empty-state">
|
||||
<image src="/images/empty.png" mode="aspectFit" class="empty-image" />
|
||||
<text class="empty-text">暂无商品</text>
|
||||
<button class="empty-btn" bindtap="refreshAllData">刷新试试</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 公告详情弹窗 -->
|
||||
<view class="gonggao-modal" wx:if="{{showGonggaoModal}}">
|
||||
<view class="modal-mask" bindtap="hideGonggaoDetail"></view>
|
||||
<view class="modal-content">
|
||||
<view class="modal-header">
|
||||
<text class="modal-title">公告详情</text>
|
||||
<view class="modal-close" bindtap="hideGonggaoDetail">×</view>
|
||||
</view>
|
||||
<scroll-view class="modal-body" scroll-y>
|
||||
<text class="modal-text">{{shangpingonggao || '暂无公告内容'}}</text>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 加载提示 -->
|
||||
<view class="loading-toast" wx:if="{{isLoading}}">
|
||||
<view class="loading-spinner"></view>
|
||||
<text class="loading-text">加载中...</text>
|
||||
</view>
|
||||
<global-notification id="global-notification" />
|
||||
<popup-notice id="popupNotice" />
|
||||
</view>
|
||||
<!-- 底部自定义TabBar -->
|
||||
<custom-tab-bar />
|
||||
<!-- pages/shangpin/shangpin.wxml -->
|
||||
<view class="shangpin-page">
|
||||
<!-- 1. 公告栏 -->
|
||||
<view class="gonggao-box" bindtap="showGonggaoDetail">
|
||||
<view class="gonggao-icon">
|
||||
<image src="/images/notice.png" mode="aspectFit" />
|
||||
</view>
|
||||
<view class="gonggao-content">
|
||||
<text class="gonggao-text {{gonggaoAnim ? 'gonggao-anim' : ''}}">
|
||||
{{shangpingonggao || '暂无公告'}}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 2. 轮播图区域 -->
|
||||
<view class="lunbo-container">
|
||||
<swiper
|
||||
class="lunbo-swiper"
|
||||
indicator-dots="{{lunboList.length > 1}}"
|
||||
indicator-color="rgba(255,255,255,0.6)"
|
||||
indicator-active-color="#ffcc00"
|
||||
autoplay="{{lunboList.length > 1}}"
|
||||
interval="3000"
|
||||
circular
|
||||
>
|
||||
<block wx:for="{{lunboList}}" wx:key="index">
|
||||
<swiper-item>
|
||||
<!-- 移除点击预览事件 -->
|
||||
<image
|
||||
src="{{item}}"
|
||||
mode="aspectFill"
|
||||
class="lunbo-image"
|
||||
/>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
|
||||
<!-- 轮播图占位图(无数据时显示) -->
|
||||
<view wx:if="{{lunboList.length === 0}}" class="lunbo-placeholder">
|
||||
<image src="{{lunbozhanwei}}" mode="aspectFill" class="lunbo-image" />
|
||||
</view>
|
||||
|
||||
<!-- 刷新按钮 -->
|
||||
<view class="refresh-btn" bindtap="refreshAllData">
|
||||
<image
|
||||
src="/images/refresh.png"
|
||||
mode="aspectFit"
|
||||
class="refresh-icon {{isRefreshing ? 'refreshing' : ''}}"
|
||||
/>
|
||||
<view class="refresh-dot"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 3. 商品展示区域 -->
|
||||
<view class="shangpin-container">
|
||||
<!-- 3.1 商品类型选择 -->
|
||||
<scroll-view
|
||||
class="leixing-scroll"
|
||||
scroll-x
|
||||
scroll-with-animation
|
||||
show-scrollbar="{{false}}"
|
||||
>
|
||||
<view class="leixing-list">
|
||||
<block wx:for="{{shangpinleixing}}" wx:key="id">
|
||||
<view
|
||||
class="leixing-item {{selectedLeixingId === item.id ? 'leixing-active' : ''}}"
|
||||
bindtap="selectLeixing"
|
||||
data-id="{{item.id}}"
|
||||
>
|
||||
<view class="leixing-image-box">
|
||||
<image
|
||||
src="{{ossImageUrl + item.tupian_url}}"
|
||||
mode="aspectFill"
|
||||
class="leixing-image"
|
||||
lazy-load="{{true}}"
|
||||
/>
|
||||
<view class="leixing-glow"></view>
|
||||
</view>
|
||||
<text class="leixing-text">{{item.jieshao}}</text>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<!-- 3.2 商品展示 -->
|
||||
<view class="shangpin-list-container">
|
||||
<block wx:for="{{filteredData}}" wx:key="*this">
|
||||
<!-- 专区标题 -->
|
||||
<view class="zhuanqu-title" wx:if="{{item.shangpinList.length > 0}}">
|
||||
<view class="zhuanqu-icon">
|
||||
<image
|
||||
src="/images/zone.png"
|
||||
mode="aspectFit"
|
||||
class="zhuanqu-icon-image {{idx % 3 === 0 ? 'zhuanqu-sparkle' : ''}}"
|
||||
/>
|
||||
</view>
|
||||
<text class="zhuanqu-text">{{item.zhuanqu.mingzi}}</text>
|
||||
</view>
|
||||
|
||||
<!-- 商品网格 -->
|
||||
<view class="shangpin-grid" wx:if="{{item.shangpinList.length > 0}}">
|
||||
<block wx:for="{{item.shangpinList}}" wx:key="id">
|
||||
<view
|
||||
class="shangpin-card"
|
||||
bindtap="goToDetail"
|
||||
data-id="{{item.id}}"
|
||||
>
|
||||
<!-- 商品图片 -->
|
||||
<view class="shangpin-image-box">
|
||||
<image
|
||||
src="{{ossImageUrl + item.tupian_url}}"
|
||||
mode="aspectFill"
|
||||
class="shangpin-image"
|
||||
lazy-load="{{true}}"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<!-- 商品标题 -->
|
||||
<view class="shangpin-title">
|
||||
<text class="title-text">{{item.biaoqian}}</text>
|
||||
</view>
|
||||
|
||||
<!-- 价格和购买按钮 -->
|
||||
<view class="shangpin-footer">
|
||||
<view class="price-box">
|
||||
<text class="price-icon">¥</text>
|
||||
<text class="price-integer">{{item.priceInteger}}</text>
|
||||
<text class="price-decimal">.{{item.priceDecimal}}</text>
|
||||
</view>
|
||||
<view class="buy-btn">
|
||||
<image src="/images/purchase.png" mode="aspectFit" class="buy-icon" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!-- 空状态 -->
|
||||
<view wx:if="{{filteredData.length === 0}}" class="empty-state">
|
||||
<image src="/images/empty.png" mode="aspectFit" class="empty-image" />
|
||||
<text class="empty-text">暂无商品</text>
|
||||
<button class="empty-btn" bindtap="refreshAllData">刷新试试</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 公告详情弹窗 -->
|
||||
<view class="gonggao-modal" wx:if="{{showGonggaoModal}}">
|
||||
<view class="modal-mask" bindtap="hideGonggaoDetail"></view>
|
||||
<view class="modal-content">
|
||||
<view class="modal-header">
|
||||
<text class="modal-title">公告详情</text>
|
||||
<view class="modal-close" bindtap="hideGonggaoDetail">×</view>
|
||||
</view>
|
||||
<scroll-view class="modal-body" scroll-y>
|
||||
<text class="modal-text">{{shangpingonggao || '暂无公告内容'}}</text>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 加载提示 -->
|
||||
<view class="loading-toast" wx:if="{{isLoading}}">
|
||||
<view class="loading-spinner"></view>
|
||||
<text class="loading-text">加载中...</text>
|
||||
</view>
|
||||
<global-notification id="global-notification" />
|
||||
<popup-notice id="popupNotice" />
|
||||
</view>
|
||||
<!-- 底部自定义TabBar -->
|
||||
<tab-bar />
|
||||
Reference in New Issue
Block a user