czg_team/xo_user_client
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化详情，下单

Browse Source
This commit is contained in:
gyq
2025-05-23 18:34:54 +08:00
parent 4d73c12215
commit 7becdd189d
8 changed files with 5266 additions and 3691 deletions
Download Patch File Download Diff File Expand all files Collapse all files

244
components/goods-comments/goods-comments.vue
View File

@@ -1,127 +1,137 @@
<template>
<view :class="theme_view">
<block v-if="(propData || null) != null && propData.length > 0">
<view v-for="(item, index) in propData" :key="index" class="goods-comment-item flex-row" :class="propClass">
<image class="avatar dis-block margin-right-xs" :src="item.user.avatar || common_static_url + 'default-user.png'" mode="aspectFit"></image>
<view class="base-nav flex-1 flex-width margin-left-sm" :class="propIsReply ? 'is-reply' : ''">
<view class="oh nav padding-bottom-sm">
<view class="">
<text class="va-m">{{ item.user.user_name_view }}</text>
<view class="dis-inline-block va-m margin-left-sm">
<uni-rate :value="item.rating" :readonly="true" :is-fill="false" :size="14" />
</view>
<view class="fr">
<text class="cr-grey text-size-xs">{{ item.add_time_date }}</text>
</view>
</view>
</view>
<view class="base-content oh padding-vertical-sm">
<view class="content cr-base text-size-sm">{{ item.content }}</view>
<view v-if="(item.images || null) != null && item.images.length > 0" class="image-list oh margin-top-lg">
<block v-for="(iv, ix) in item.images" :key="ix">
<image class="image br radius" @tap="comment_images_show_event" :data-index="index" :data-ix="ix" :src="iv" mode="aspectFit"></image>
</block>
</view>
<view v-if="(item.msg || null) != null" class="spec cr-grey margin-top-lg">{{ item.msg }}</view>
<block v-if="propIsReply">
<view v-if="item.is_reply == 1 && (item.reply || null) != null" class="reply br-t-dashed margin-top-sm padding-top-sm text-size-sm">
<text class="cr-base">{{$t('goods-comments.goods-comments.s65197')}}</text>
<text class="reply-desc cr-main-pair">{{ item.reply }}</text>
</view>
</block>
</view>
</view>
</view>
</block>
<block v-else>
<view class="tc spacing-mb flex-row jc-c align-c margin-top-xxxxl">
<image :src="common_static_url + 'no-comment.png'" mode="widthFix" class="no-comment margin-right-main" />
<view class="cr-grey-d">{{$t('goods-comments.goods-comments.1p1r2e')}}</view>
</view>
</block>
</view>
<view :class="theme_view">
<block v-if="(propData || null) != null && propData.length > 0">
<view v-for="(item, index) in propData" :key="index" class="goods-comment-item flex-row" :class="propClass">
<image class="avatar dis-block margin-right-xs" :src="item.user.avatar || common_static_url + 'default-user.png'" mode="aspectFill"></image>
<view class="base-nav flex-1 flex-width margin-left-sm" :class="propIsReply ? 'is-reply' : ''">
<view class="oh nav padding-bottom-sm">
<view class="">
<text class="va-m">{{ item.user.user_name_view }}</text>
<view class="dis-inline-block va-m margin-left-sm">
<uni-rate :value="item.rating" :readonly="true" :is-fill="false" :size="14" />
</view>
<!-- <view class="fr">
<text class="cr-grey text-size-xs">{{ item.add_time_date }}</text>
</view> -->
</view>
</view>
<view class="base-content oh padding-vertical-sm">
<view class="content cr-base text-size-sm">{{ item.content }}</view>
<view v-if="(item.images || null) != null && item.images.length > 0" class="image-list oh">
<block v-for="(iv, ix) in item.images.slice(0, 1)" :key="ix">
<image class="image br radius" @tap="comment_images_show_event" :data-index="index" :data-ix="ix" :src="iv" mode="aspectFill"></image>
</block>
</view>
<view v-if="(item.msg || null) != null" class="spec cr-grey margin-top-lg">{{ item.msg }}</view>
<block v-if="propIsReply">
<view v-if="item.is_reply == 1 && (item.reply || null) != null" class="reply br-t-dashed margin-top-sm padding-top-sm text-size-sm">
<text class="cr-base">{{ $t('goods-comments.goods-comments.s65197') }}</text>
<text class="reply-desc cr-main-pair">{{ item.reply }}</text>
</view>
</block>
</view>
</view>
</view>
</block>
<block v-else>
<view class="tc spacing-mb flex-row jc-c align-c margin-top-xxxxl">
<image :src="common_static_url + 'no-comment.png'" mode="widthFix" class="no-comment margin-right-main" />
<view class="cr-grey-d">{{ $t('goods-comments.goods-comments.1p1r2e') }}</view>
</view>
</block>
</view>
</template>
<script>
const app = getApp();
var common_static_url = app.globalData.get_static_url('common');
export default {
props: {
propData: {
type: [Array,String],
default: '',
},
// 是否需要显示管理员回复
propIsReply: {
type: Boolean,
default: false,
},
// 额外样式控制
propClass: {
type: String,
default: '',
},
},
data() {
return {
theme_view: app.globalData.get_theme_value_view(),
common_static_url: common_static_url,
};
},
const app = getApp();
var common_static_url = app.globalData.get_static_url('common');
export default {
props: {
propData: {
type: [Array, String],
default: '',
},
// 是否需要显示管理员回复
propIsReply: {
type: Boolean,
default: false,
},
// 额外样式控制
propClass: {
type: String,
default: '',
},
},
data() {
return {
theme_view: app.globalData.get_theme_value_view(),
common_static_url: common_static_url,
};
},
created: function () {},
created: function () {},
methods: {
// 评价图片预览
comment_images_show_event(e) {
var index = e.currentTarget.dataset.index;
var ix = e.currentTarget.dataset.ix;
uni.previewImage({
current: this.propData[index]['images'][ix],
urls: this.propData[index]['images'],
});
},
},
};
methods: {
// 评价图片预览
comment_images_show_event(e) {
var index = e.currentTarget.dataset.index;
var ix = e.currentTarget.dataset.ix;
uni.previewImage({
current: this.propData[index]['images'][ix],
urls: this.propData[index]['images'],
});
},
},
};
</script>
<style scoped>
/**
<style scoped lang="scss">
/**
* 商品评价
*/
.goods-comment-item {
padding-bottom: 10rpx;
margin-bottom: 20rpx;
}
.goods-comment-item .avatar {
width: 50rpx;
height: 50rpx;
border-radius: 50%;
border: 1px solid #e2e2e2;
}
.goods-comment-item .base-nav {
border-bottom: 2rpx solid #f5f5f5;
}
.goods-comment-item .base-nav.is-reply {
border: 0;
}
.goods-comment-item {
padding-bottom: 10rpx;
margin-bottom: 20rpx;
}
.goods-comment-item .avatar {
width: 50rpx;
height: 50rpx;
border-radius: 50%;
border: 1px solid #e2e2e2;
}
.goods-comment-item .base-nav {
border-bottom: 2rpx solid #f5f5f5;
}
.goods-comment-item .base-nav.is-reply {
border: 0;
}
.goods-comment-item:last-of-type {
margin-bottom: 0;
}
.goods-comment-item:last-of-type .base-nav {
border: 0;
}
.goods-comment-item .base-content .content,
.goods-comment-item .base-content .reply {
line-height: 46rpx;
}
.goods-comment-item .base-content .image-list .image {
width: 100rpx;
height: 100rpx;
}
.goods-comment-item .base-content .image-list .image:not(:last-child) {
margin-right: 10rpx;
}
.no-comment {
width: 174rpx;
}
.goods-comment-item:last-of-type {
margin-bottom: 0;
}
.goods-comment-item:last-of-type .base-nav {
border: 0;
}
.goods-comment-item .base-content .content,
.goods-comment-item .base-content .reply {
line-height: 46rpx;
}
.goods-comment-item .base-content .image-list .image {
width: 112rpx;
height: 112rpx;
}
.goods-comment-item .base-content .image-list .image:not(:last-child) {
margin-right: 10rpx;
}
.no-comment {
width: 174rpx;
}
.base-content {
display: flex;
.content {
flex: 1;
}
.image-list {
width: 112rpx;
padding-top: 8upx;
}
}
</style>

2
pages.json
View File

@@ -27,7 +27,7 @@
// #endif
"enablePullDownRefresh": false,
// 禁止页面下拉
"disableScroll": true,
// "disableScroll": true,
"navigationBarTitleText": ""
}
},

206
pages/buy/buy.vue
View File

@@ -11,7 +11,7 @@
<view :class="'item fl cp ' + (buy_site_model_active_index == index ? 'nav-active-line cr-main' : 'cr-base')" :data-index="index" :data-value="item.value" @tap="buy_site_model_event">{{ item.name }}</view>
</block>
</view> -->
<view class="padding-horizontal-main padding-top-main bottom-line-exclude">
<view class="bottom-line-exclude">
<!-- 非虚拟类型 则地址 -->
<!-- <view v-if="buy_site_model_value != 3" class="padding-horizontal-main padding-top-main border-radius-main spacing-mb" style="background-color: #DD492C">
<view class="address arrow-right cp" @tap="address_event">
@@ -35,8 +35,8 @@
<view class="address-divider spacing-mb"></view>
</view> -->
<view class="address-wrap" v-if="buy_site_model_value != 3">
<view class="top-tips">收货地址</view>
<view class="address-wrap spacing-mb" v-if="buy_site_model_value != 3">
<!-- <view class="top-tips">收货地址</view> -->
<view class="address-info" @tap="address_event">
<view class="info-wrap" v-if="address != null">
<image class="icon" src="/static/icon_address.svg" mode="aspectFit"></image>
@@ -48,7 +48,8 @@
<text>{{ address.tel }}</text>
</view>
</view>
<view class="edit-btn"> 修改地址 </view>
<!-- <view class="edit-btn">修改地址</view> -->
<uni-icons type="right" color="#666"></uni-icons>
</view>
<view class="no-info" v-else>
<view class="left">
@@ -89,18 +90,22 @@
</view>
<!-- 商品数据 -->
<view v-for="(group, index) in goods_list" :key="index" class="goods-group-list padding-main border-radius-main bg-white spacing-mb">
<view v-for="(group, index) in goods_list" :key="index" class="goods-group-list padding-main bg-white spacing-mb">
<!-- 仓库分组 -->
<view class="goods-group-hd oh br-b padding-bottom-main">
<view class="fl cp" @tap="warehouse_group_event" :data-value="group.url || ''">
<view class="company_name">
<image class="icon" src="https://store.sxczgkj.com/static/upload/images/common/2025/05/22/1747894823943932.png?noCache=mayzhnst" mode="aspectFit"></image>
<text class="t">{{ application_title }}</text>
</view>
<!-- <view class="fl cp" @tap="warehouse_group_event" :data-value="group.url || ''">
<image v-if="(group.icon || null) != null" class="goods-group-icon va-m margin-right-xs" :src="group.icon" mode="aspectFit"></image>
<text class="goods-group-title va-m">{{ group.name }}</text>
<text v-if="(group.alias || null) != null" class="goods-group-alias va-m round margin-left-sm text-size-xs">{{ group.alias }}</text>
</view>
</view> -->
<!-- #ifndef MP-KUAISHOU -->
<view v-if="(group.lng || 0) != 0 && (group.lat || 0) != 0" class="fr">
<!-- <view v-if="(group.lng || 0) != 0 && (group.lat || 0) != 0" class="fr">
<view class="goods-group-map-submit br round text-size-xs" :data-index="index" @tap="map_event">{{ $t('buy.buy.o7722q') }}</view>
</view>
</view> -->
<!-- #endif -->
</view>
<!-- 商品 -->
@@ -184,8 +189,48 @@
</view>
</view>
</view>
<!-- 留言 -->
<view class="row-wrap">
<view class="row">
<text class="t">快递运费</text>
<view class="right between">
<text class="t1">普通配送</text>
<text>快递免邮</text>
</view>
</view>
<view class="row" @click="showCouponHandle">
<text class="t">优惠折扣</text>
<view class="right between">
<text class="t1"></text>
<view class="coupon">
<text>选择优惠券</text>
<uni-icons type="right" size="14"></uni-icons>
</view>
</view>
</view>
<view class="row">
<text class="t">订单备注</text>
<input class="ipt" type="text" :value="user_note_value" placeholder="选填，请先和商家协商一致" @input="bind_user_note_event" />
</view>
<!-- <view class="content">
<textarea v-if="user_note_status" class="textarea" @blur="bind_user_note_blur_event" @input="bind_user_note_event" :focus="true" :disable-default-padding="false" :value="user_note_value" maxlength="230" :placeholder="$t('buy.buy.2rhko1')"></textarea>
<view v-else @tap="bind_user_note_tap_event" :class="'textarea-view ' + ((user_note_value || null) == null ? 'cr-grey' : '')">{{ user_note_value || $t('buy.buy.2rhko1') }}</view>
</view>
<view v-if="(plugins_intellectstools_data || null) != null && (plugins_intellectstools_data.note_fast_data || null) != null" class="plugins-intellectstools-data-note-fast margin-top-sm">
<text class="cr-grey margin-right-sm va-m text-size-xs">{{ $t('buy.buy.q7jq76') }}</text>
<view class="note-fast-data-list scroll-view-horizontal dis-inline-block va-m">
<scroll-view :scroll-x="true" :show-scrollbar="false" :scroll-with-animation="true">
<block v-for="(item, index) in plugins_intellectstools_data.note_fast_data" :key="index">
<view :class="'dis-inline-block text-size-xs round padding-top-xs padding-bottom-xs padding-left padding-right br-grey-f5 cr-base cp ' + (index > 0 ? 'margin-left-sm' : '')" :data-value="item" @tap="note_fast_event">{{ item }}</view>
</block>
</scroll-view>
</view>
</view> -->
</view>
<!-- 小计 -->
<view class="oh tr wh-auto goods-group-footer padding-top-xl">
<text style="color: #999; font-size: 24upx; margin-right: 8upx">共{{ group.order_base.buy_count }}件</text>
<text>小计：</text>
<text class="sales-price">{{ currency_symbol }}{{ group.order_base.actual_price }}</text>
</view>
</view>
@@ -224,26 +269,8 @@
</view>
</view>
<!-- 留言 -->
<view class="content-textarea-container padding-main border-radius-main bg-white spacing-mb">
<view class="content">
<textarea v-if="user_note_status" class="textarea" @blur="bind_user_note_blur_event" @input="bind_user_note_event" :focus="true" :disable-default-padding="false" :value="user_note_value" maxlength="230" :placeholder="$t('buy.buy.2rhko1')"></textarea>
<view v-else @tap="bind_user_note_tap_event" :class="'textarea-view ' + ((user_note_value || null) == null ? 'cr-grey' : '')">{{ user_note_value || $t('buy.buy.2rhko1') }}</view>
</view>
<view v-if="(plugins_intellectstools_data || null) != null && (plugins_intellectstools_data.note_fast_data || null) != null" class="plugins-intellectstools-data-note-fast margin-top-sm">
<text class="cr-grey margin-right-sm va-m text-size-xs">{{ $t('buy.buy.q7jq76') }}</text>
<view class="note-fast-data-list scroll-view-horizontal dis-inline-block va-m">
<scroll-view :scroll-x="true" :show-scrollbar="false" :scroll-with-animation="true">
<block v-for="(item, index) in plugins_intellectstools_data.note_fast_data" :key="index">
<view :class="'dis-inline-block text-size-xs round padding-top-xs padding-bottom-xs padding-left padding-right br-grey-f5 cr-base cp ' + (index > 0 ? 'margin-left-sm' : '')" :data-value="item" @tap="note_fast_event">{{ item }}</view>
</block>
</scroll-view>
</view>
</view>
</view>
<!-- 支付选择 -->
<view v-if="total_price > 0 && ((common_order_is_booking != 1 && payment_list.length > 0) || plugins_coin_is_valid)" class="payment-list border-radius-main bg-white oh padding-main spacing-mb">
<view v-if="total_price > 0 && ((common_order_is_booking != 1 && payment_list.length > 0) || plugins_coin_is_valid)" class="payment-list bg-white oh padding-main spacing-mb">
<!-- 虚拟币支付 -->
<block v-if="plugins_coin_is_valid">
<block v-for="(item, index) in plugins_coin_data.accounts_list" :key="index">
@@ -278,6 +305,28 @@
</view>
</view>
</view>
<view>
<view class="item flex-row jc-sb align-c" @tap="payHandle">
<view class="item-content flex pr flex-1 flex-width">
<image class="icon margin-right-sm va-m radius" src="https://store.sxczgkj.com/static/upload/images/common/2025/05/23/1747985408196629.png?noCache=mb0hdpif" mode="widthFix"></image>
<text class="va-m">余额支付</text>
</view>
<view>
<iconfont name="icon-zhifu-weixuan" size="40rpx"></iconfont>
</view>
</view>
</view>
<view>
<view class="item flex-row jc-sb align-c" @tap="payHandle">
<view class="item-content flex pr flex-1 flex-width">
<image class="icon margin-right-sm va-m radius" src="https://store.sxczgkj.com/static/upload/images/common/2025/05/23/1747985553273589.png?noCache=mb0hgtbs" mode="widthFix"></image>
<text class="va-m">银行卡支付</text>
</view>
<view>
<iconfont name="icon-zhifu-weixuan" size="40rpx"></iconfont>
</view>
</view>
</view>
</view>
</view>
@@ -290,15 +339,15 @@
</view>
<!-- 导航 -->
<view class="bottom-fixed" :style="bottom_fixed_style">
<view class="footer-bottom" :style="bottom_fixed_style">
<view class="bottom-line-exclude">
<view class="item oh round flex-row jc-sb align-c br-top-shadow bg-white padding-vertical-sm">
<view class="nav-base single-text padding-left-main fl">
<text>{{ $t('buy.buy.wx78ju') }}</text>
<text class="sales-price">{{ currency_symbol }}{{ total_price }}</text>
<view class="item oh flex-row jc-sb align-c br-top-shadow bg-white padding-vertical-sm">
<view class="price-wrap">
<text class="price">{{ currency_symbol }}{{ total_price }}</text>
<text class="t">明细：共{{ total_count }}件</text>
</view>
<view class="nav-submit padding-horizontal-main fr">
<button class="btn bg-main cr-white round text-size-md" type="default" @tap="buy_submit_event" :disabled="buy_submit_disabled_status" hover-class="none">{{ $t('buy.buy.4884hk') }}</button>
<view class="btn bg-main cr-white text-size-md" type="default" @tap="buy_submit_event" :disabled="buy_submit_disabled_status" hover-class="none" style="padding: 12upx 22upx;border-radius: 12upx;">{{ $t('buy.buy.4884hk') }}</view>
</view>
</view>
</view>
@@ -400,6 +449,7 @@
export default {
data() {
return {
application_title: app.globalData.get_application_title(),
theme_view: app.globalData.get_theme_value_view(),
theme_color: app.globalData.get_theme_color(),
common_static_url: common_static_url,
@@ -415,6 +465,7 @@
address: null,
address_id: null,
total_price: 0,
total_count: 0,
user_note_value: '',
user_note_status: false,
is_first: 1,
@@ -543,6 +594,18 @@
},
methods: {
payHandle() {
uni.showToast({
title: '暂未开放',
icon: 'none',
});
},
showCouponHandle() {
uni.showToast({
title: '暂无优惠券',
icon: 'none',
});
},
// 是否显示充值账户
getShowAccount() {
uni.request({
@@ -862,6 +925,7 @@
this.setData({
goods_list: goods_list,
total_price: data.base.actual_price,
total_count: data.base.goods_count,
data_list_loding_status: 3,
common_site_type: data.common_site_type || 0,
buy_site_model_value: data.base.site_model || 0,
@@ -1486,22 +1550,20 @@
}
$color: #ff723b;
.address-wrap {
background-color: $color;
padding: 0 2px 2px;
border-radius: 6px;
.top-tips {
color: #fff;
padding: 4px;
}
.address-info {
padding: 10px;
padding: 26upx;
background-color: #fff;
border-radius: 4px;
.info-wrap {
display: flex;
align-items: center;
.icon {
$size: 60upx;
$size: 70upx;
width: $size;
height: $size;
}
@@ -1516,7 +1578,6 @@
color: #000;
}
.base2 {
padding-top: 8px;
color: #999;
display: flex;
gap: 6px;
@@ -1556,4 +1617,71 @@
}
}
}
.company_name {
display: flex;
align-items: center;
gap: 6px;
.icon {
$size: 38upx;
width: $size;
height: $size;
}
}
.row-wrap {
padding-top: 20upx;
.row {
display: flex;
align-items: center;
&:not(:first-child) {
margin-top: 28upx;
}
.t {
width: 160upx;
font-size: 28upx;
}
.ipt {
flex: 1;
font-size: 28upx;
}
.right {
flex: 1;
display: flex;
align-items: center;
&.between {
justify-content: space-between;
}
.t1 {
color: #999;
}
.coupon {
display: flex;
align-items: center;
gap: 8upx;
}
}
}
}
.footer-bottom {
width: 100%;
background-color: #fff;
position: fixed;
left: 0;
bottom: 0;
z-index: 999;
.price-wrap {
display: flex;
flex-direction: column;
justify-content: center;
padding-left: 28upx;
.price {
color: #ff723b;
font-size: 36upx;
}
.t {
color: #666;
font-size: 24upx;
}
}
}
</style>

769
pages/goods-category/goods-category.vue
View File

@@ -1,368 +1,77 @@
<template>
<view :class="theme_view">
<view :class="popup_status ? 'fixed-top' : ''">
<view class="pr" :class="is_single_page == 1 ? 'margin-top-xxxl single-page-top' : ''">
<block v-if="category_list.length > 0">
<view v-if="category_list.length > 0" class="goods-top-bg pa top-0 left-0 right-0 wh-auto oh">
<image :src="theme_static_url + 'top-bg.png'" mode="widthFix" class="wh-auto"></image>
<view>
<view class="container" :style="{ paddingTop: `${headerHieght}px` }">
<view class="header-wrap">
<status-bar-height></status-bar-height>
<!-- 搜索栏 -->
<view class="search-wrap">
<view class="ipt-wrap" @click="search_button_event">
<!-- <input class="ipt" type="text" v-model="search_keywords_value" disabled placeholder="请输入搜索内容" /> -->
<view class="ipt">
<text class="t">请输入搜索内容</text>
</view>
<uni-icons type="camera" color="#999" size="26"></uni-icons>
<view class="btn">
<view class="line"></view>
<text class="t">搜索</text>
</view>
</view>
<!-- 搜索框 -->
<block v-if="is_single_page == 0">
<view class="nav-search padding-horizontal-main pr" :style="'padding-top:' + (status_bar_height + 5) + 'px;'">
<view class="goods-top-search-bg pa top-0 left-0 right-0 bottom-0 wh-auto oh">
<image :src="theme_static_url + 'top-bg.png'" mode="widthFix" class="wh-auto"></image>
</view>
<!-- 分类 -->
<view class="category-wrap">
<scroll-view class="scroll" scroll-x scroll-with-animation :show-scrollbar="false" :scrollLeft="scrollLeft">
<view class="item tab-item0" :class="{ active: nav_active_index == index }" v-for="(item, index) in category_list" :key="item.id" @click="handleTabClick(index, 'nav_active_index')">
<text class="t">{{ item.name }}</text>
</view>
</scroll-view>
<scroll-view class="scroll" scroll-x scroll-with-animation :show-scrollbar="false" :scrollLeft="scrollLeft1" v-if="category_list.length">
<view class="item tab-item1" :class="{ active: nav_active_item_two_index == index }" v-for="(item, index) in category_list[nav_active_index].items" :key="item.id" @click="handleTabClick(index, 'nav_active_item_two_index')">
<view class="flex">
<image class="img" :src="item.realistic_images" mode="aspectFit"></image>
<text class="t">{{ item.name }}</text>
</view>
<block v-if="category_goods_is_search_alone == 1">
<component-search :propPlaceholder="$t('customview.customview.726k7y')"></component-search>
</block>
<block v-else>
<component-search @onsearch="search_button_event" :propIsOnEvent="true" :propIsRequired="false" :propPlaceholder="$t('customview.customview.726k7y')"></component-search>
</block>
</view>
</scroll-view>
</view>
<!-- 筛选条件 -->
<view class="filter-wrap">
<view class="sort-item" :class="{ active: sort_all }" :data-index="-1" @tap="nav_sort_event">
<text class="cr-base va-m text-size-sm">全部</text>
</view>
<block v-for="(item, index) in search_nav_sort_list" :key="index">
<view class="sort-item tc fl cp" :class="{ active: search_nav_sort_index == index && !sort_all }" :data-index="index" @tap="nav_sort_event">
<text class="cr-base va-m text-size-sm">{{ item.name }}</text>
<image v-if="(item.icon || null) != null" class="sort-icon va-m" :src="common_static_url + 'sort-' + item.icon + '-icon.png'" mode="aspectFill"></image>
</view>
</block>
<view class="category-container">
<!-- 分类内容 -->
<view :class="'category-content bs-bb pr ' + (category_show_level == 0 ? 'goods-model' : '')" :style="category_content_style">
<block v-if="category_show_level == 1">
<!-- 一级模式 -->
<scroll-view scroll-y class="ht-auto" :show-scrollbar="false">
<view class="model-one padding-sm oh flex-row flex-wrap">
<block v-for="(item, index) in category_list" :key="index">
<view class="content-item cp" :data-value="item.id" @tap="category_event">
<view class="padding-sm">
<view class="content bg-white border-radius-main">
<image v-if="(item[category_goods_model_icon_field] || null) != null" :src="item[category_goods_model_icon_field]" mode="aspectFit" class="icon circle"></image>
<view class="text single-text margin-top-sm" :class="'text-random-' + (Math.floor(Math.random() * 9) + 1)">{{ item.name }}</view>
<view class="desc multi-text margin-top-xs padding-top-xss cr-grey-9 text-size-xss">{{ item.describe }}</view>
</view>
</view>
</view>
</block>
</view>
</scroll-view>
</block>
<block v-else>
<!-- 商品列表模式 -->
<block v-if="category_show_level == 0">
<!-- 一级导航 -->
<view class="top-nav wh-auto pa scroll-view-horizontal bottom-0">
<scroll-view :scroll-x="true" :show-scrollbar="false" :scroll-with-animation="true" :scroll-into-view="'one-nav-item-' + nav_active_index" class="top-nav-scroll">
<block v-for="(item, index) in category_list" :key="index">
<view class="item tc cp dis-inline-block text-size-xss" :id="'one-nav-item-' + index" :data-index="index" :data-itemtwoindex="-1" :data-itemthreeindex="-1" @tap="nav_event">
<view :class="'icon-content circle br auto ' + (nav_active_index == index ? 'border-color-main' : '')">
<image :src="(item[category_goods_model_icon_field] || null) == null ? common_static_url + 'images.png' : item[category_goods_model_icon_field]" mode="aspectFit" class="icon dis-block auto wh-auto ht-auto circle"></image>
</view>
<view class="padding-left-sm padding-right-sm round margin-top-xs" :class="nav_active_index == index ? 'bg-main border-color-main cr-white' : ''">{{ item.name }} </view>
</view>
</block>
</scroll-view>
<component-nav-more class="nav-more-top" :propTop="search_height + 'px'" :propStatus="popup_status" @open-popup="open_popup_event">
<view class="nav-list-more">
<view class="flex-row flex-wrap align-c">
<block v-for="(item, index) in category_list" :key="index">
<view class="item tc cr-base cp text-size-xss" :id="'one-nav-item-' + index" :data-index="index" :data-itemtwoindex="-1" :data-itemthreeindex="-1" @tap="nav_event">
<view :class="'icon-content circle br auto ' + (nav_active_index == index ? 'border-color-main' : '')">
<image :src="(item[category_goods_model_icon_field] || null) == null ? common_static_url + 'images.png' : item[category_goods_model_icon_field]" mode="aspectFit" class="icon dis-block auto wh-auto ht-auto circle"></image>
</view>
<view class="dis-inline-block padding-left-sm padding-right-sm round margin-top-xs" :class="nav_active_index == index ? 'bg-main border-color-main cr-white' : ''">
{{ item.name }}
</view>
</view>
</block>
</view>
</view>
</component-nav-more>
</view>
<!-- 二级导航 -->
<view v-if="category_one_subset_count > 0" class="left-nav" :style="left_content_actual_style">
<scroll-view :scroll-y="true" :show-scrollbar="false" class="ht-auto">
<view :class="'text-size-sm item tc cr-base cp oh ' + (nav_active_item_two_index == -1 ? 'nav-active cr-main nav-left-border' : '')" :data-index="nav_active_index" :data-itemtwoindex="-1" :data-itemthreeindex="-1" @tap="nav_event">
<text>{{ $t('common.all') }}</text>
</view>
<block v-if="(data_content || null) != null && (data_content.items || null) != null && data_content.items.length > 0">
<block v-for="(item, index) in data_content.items" :key="index">
<view :class="'text-size-sm item tc cr-base cp oh ' + (nav_active_item_two_index == index ? 'nav-active cr-main nav-left-border' : '')" :data-index="nav_active_index" :data-itemtwoindex="index" :data-itemthreeindex="-1" @tap="nav_event">
<text>{{ item.name }}</text>
</view>
</block>
</block>
</scroll-view>
</view>
<!-- 商品列表 -->
<view :class="'goods-right-content bg-white pa bs-bb ' + (category_one_subset_count > 0 ? '' : 'category-one-subset-content')">
<scroll-view :scroll-y="true" :show-scrollbar="false" class="ht-auto goods-list" :scroll-top="scroll_top" @scroll="scroll_event" @scrolltolower="scroll_lower" lower-threshold="60">
<view class="padding-left-main" :style="right_content_actual_style">
<!-- 操作导航 -->
<view class="goods-list-top-nav bg-white">
<!-- 排序 -->
<view class="nav-sort-content oh">
<block v-for="(item, index) in search_nav_sort_list" :key="index">
<view class="sort-item tc fl cp" :data-index="index" @tap="nav_sort_event">
<text class="cr-base va-m text-size-sm">{{ item.name }}</text>
<image v-if="(item.icon || null) != null" class="sort-icon va-m" :src="common_static_url + 'sort-' + item.icon + '-icon.png'" mode="aspectFill"></image>
</view>
</block>
</view>
<!-- 三级导航 -->
<view v-if="(data_three_content || null) != null && (data_three_content.items || null) != null && data_three_content.items.length > 0" class="word-list scroll-view-horizontal padding-bottom-main">
<scroll-view :scroll-x="true" :show-scrollbar="false" :scroll-with-animation="true" :scroll-into-view="'three-nav-item-' + nav_active_item_three_index">
<view :class="'word-icon dis-inline-block text-size-xs round padding-top-xs padding-bottom-xs padding-left padding-right ' + (nav_active_item_three_index == -1 ? 'bg-main-light br-main-light cr-main' : 'br-grey cr-grey')" :data-index="nav_active_index" :data-itemtwoindex="nav_active_item_two_index" :data-itemthreeindex="-1" @tap="nav_event">{{ $t('common.all') }}</view>
<block v-for="(item, index) in data_three_content.items" :key="index">
<view :class="'word-icon dis-inline-block text-size-xs round padding-top-xs padding-bottom-xs padding-left padding-right ' + (nav_active_item_three_index == index ? 'bg-main-light br-main-light cr-main' : 'br-grey cr-grey')" :id="'three-nav-item-' + index" :data-index="nav_active_index" :data-itemtwoindex="nav_active_item_two_index" :data-itemthreeindex="index" @tap="nav_event">{{ item.name }}</view>
</block>
</scroll-view>
</view>
</view>
<!-- 右侧商品列表 -->
<view v-if="(data_list || null) != null && data_list.length > 0" class="oh">
<view v-for="(item, index) in data_list" :key="index" class="item oh pr spacing-mb">
<!-- 商品主体内容 -->
<view class="flex-row jc-sb" data-type="type" :data-index="index" :data-value="item.goods_url + '&is_opt_back=1'" @tap="goods_event">
<image :src="item.images" mode="widthFix" class="goods-img radius dis-block"></image>
<view class="goods-base flex-col jc-sb">
<view class="goods-base-content">
<view class="goods-title multi-text">{{ item.title }}</view>
<view v-if="(item.simple_desc || null) != null" class="simple-desc cr-grey-9 text-size-xs margin-top-sm single-text">{{ item.simple_desc }}</view>
</view>
<view v-if="(item.show_field_price_status || 0) == 1" class="oh flex-row jc-sb align-c">
<view class="single-text va-m">
<text class="sales-price">
<text class="text-size-xss">{{ item.show_price_symbol }}</text>
<text class="text-size">{{ item.min_price }}</text>
</text>
<text class="text-size-xss cr-grey">{{ item.show_price_unit }}</text>
</view>
<view v-if="common_site_type != 4" class="buy-opt flex-row align-c tc">
<block v-if="(item.is_error || 0) == 0">
<view v-if="(item.buy_number || 0) > 0" class="cp pr top-sm" :data-index="index" data-type="0" @tap.stop="buy_number_event">
<iconfont name="icon-cart-dec" size="48rpx" :color="theme_color"></iconfont>
</view>
<view v-if="(item.buy_number || 0) > 0" class="buy-number cr-black text-size-sm padding-left-xs padding-right-xs">
{{ item.buy_number }}
</view>
<view class="cp pr top-sm" :data-index="index" data-type="1" @tap.stop="buy_number_event">
<iconfont name="icon-cart-inc" size="48rpx" :color="theme_color"></iconfont>
</view>
</block>
<block v-else>
<text class="cr-grey text-size-xs">{{ item.error_msg }}</text>
</block>
</view>
</view>
</view>
</view>
<!-- 标签插件 -->
<view v-if="(plugins_label_data || null) != null && plugins_label_data.data.length > 0" :class="'plugins-label oh pa plugins-label-' + ((plugins_label_data.base.is_user_goods_label_icon || 0) == 0 ? 'text' : 'img') + ' plugins-label-' + (plugins_label_data.base.user_goods_show_style || 'top-left')">
<block v-for="(lv, li) in plugins_label_data.data" :key="li">
<view v-if="(lv.goods_ids || null) != null && lv.goods_ids.indexOf(item.id) != -1" class="lv dis-inline-block va-m" :data-value="(plugins_label_data.base.is_user_goods_label_url || 0) == 1 ? lv.url || '' : ''" @tap="url_event">
<view v-if="(plugins_label_data.base.is_user_goods_label_icon || 0) == 0" class="round cr-white bg-main text-size-xs fl" :style="'background-color:' + (lv.bg_color || '#666') + ' !important;' + ('color:' + (lv.text_color || '#fff')) + ' !important;'">
{{ lv.name }}
</view>
<block v-else>
<image v-if="(lv.icon || null) != null" class="dis-block" :src="lv.icon" mode="scaleToFill"></image>
</block>
</view>
</block>
</view>
</view>
</view>
<block v-else>
<component-no-data :propStatus="data_list_loding_status" :propMsg="data_list_loding_msg" :propBackBtn="false" propPage="goods-category-item"></component-no-data>
</block>
</view>
</scroll-view>
</view>
</block>
<block v-else>
<!-- 一级导航 -->
<view class="left-nav ht-auto">
<scroll-view :scroll-y="true" class="ht-auto" :show-scrollbar="false">
<view :class="common_site_type != 4 ? 'left-content-actual ht-auto' : ''">
<view class="ht-auto padding-0" :style="left_content_actual_style">
<block v-for="(item, index) in category_list" :key="index">
<view :class="'text-size-sm item tc cr-base cp oh ' + (nav_active_index == index ? 'nav-active cr-main nav-left-border' : '')" :data-index="index" :data-itemindex="-1" @tap="nav_event">
<text>{{ item.name }}</text>
</view>
</block>
</view>
</view>
</scroll-view>
</view>
<view class="right-container pa">
<scroll-view :scroll-y="true" class="ht-auto bg-white" :show-scrollbar="false">
<!-- 一级内容基础容 -->
<view v-if="(data_content || null) != null" class="oh">
<view class="padding-top-main padding-horizontal-main">
<!-- 一级基础信息 -->
<block v-if="(data_content.banner_images || null) !== null">
<view :class="'one-content border-radius-main cp ' + (category_show_level == 3 ? 'spacing-mb' : '')" :data-value="data_content.id" @tap="category_event">
<image :src="data_content.banner_images" mode="scaleToFill" class="wh-auto radius"></image>
</view>
</block>
<block v-else>
<view v-if="(data_content.vice_name || null) != null || (data_content.describe || null) != null" :class="'one-content border-radius-main cp pr ' + (category_show_level == 3 ? 'spacing-mb' : '')" :data-value="data_content.id" @tap="category_event">
<image :src="theme_static_url + 'level2-content-bg.png'" mode="scaleToFill" class="wh-auto ht-auto radius pa top-0 left-0"></image>
<view class="pr padding-main">
<view v-if="(data_content.vice_name || null) != null" class="text-size-md fw-b" :style="'color:' + data_content.bg_color + ';'">
{{ data_content.vice_name }}
</view>
<view v-if="(data_content.describe || null) != null" class="text-size-xs cr-grey margin-top-sm">{{ data_content.describe }}</view>
</view>
</view>
</block>
<!-- 一二级数据渲染 -->
<block v-if="(data_content.items || null) != null && data_content.items.length > 0">
<!-- 二级模式 -->
<block v-if="category_show_level == 2">
<view class="two-content oh border-radius-main spacing-mb flex-row flex-wrap">
<block v-for="(v, index) in data_content.items" :key="index">
<view class="content-item tc cp two-img" :data-value="v.id" @tap="category_event">
<view class="content">
<image v-if="(v.icon || null) != null" :src="v.icon" mode="aspectFit" class="icon radius margin-bottom-main"></image>
<view class="single-text text-size-sm cr-grey">{{ v.name }}</view>
</view>
</view>
</block>
</view>
</block>
<!-- 三级模式 -->
<block v-if="category_show_level == 3">
<block v-for="(v, index) in data_content.items" :key="index">
<view class="spacing-nav-title flex-row jc-sb align-c">
<view class="flex-1">
<text class="text-wrapper text-size-md">{{ v.name }}</text>
<text v-if="(v.describe || null) != null" class="vice-name margin-left-lg cr-grey">{{ v.describe }}</text>
</view>
<view :data-value="v.id" @tap="category_event" class="arrow-right padding-right cr-grey text-size-xs">{{ $t('common.more') }}</view>
</view>
<view v-if="(v.items || null) != null && v.items.length > 0" class="oh border-radius-main spacing-mb flex-row flex-wrap">
<block v-for="(vs, index2) in v.items" :key="index2">
<view class="content-item two-img tc cp" :data-value="vs.id" @tap="category_event">
<view class="content">
<image v-if="(vs.icon || null) != null" :src="vs.icon" mode="aspectFit" class="icon radius margin-bottom-main"></image>
<view class="single-text text-size-sm cr-grey">{{ vs.name }}</view>
</view>
</view>
</block>
</view>
</block>
</block>
</block>
<block v-else>
<!-- 提示信息 -->
<component-no-data propStatus="0" :propMsg="$t('goods-category.goods-category.7e4m68')"></component-no-data>
</block>
</view>
</view>
<view v-else>
<!-- 提示信息 -->
<component-no-data propStatus="0" :propMsg="$t('goods-category.goods-category.7e4m68')"></component-no-data>
</view>
</scroll-view>
</view>
</block>
</block>
</view>
<view v-if="category_list.length == 0 && data_list_loding_status != 0">
<!-- 提示信息 -->
<component-no-data :propStatus="data_list_loding_status"></component-no-data>
</view>
<!-- 仅商品模式展示购物车和规格选择 -->
<block v-if="category_goods_is_show_cart_nav == 1 && common_site_type != 4 && category_show_level == 0">
<!-- 购物车列表 -->
<block v-if="cart_status">
<view class="cart-mask wh-auto ht-auto pf" @tap="cart_event"></view>
<view class="cart-content bg-white border-radius-main pa oh" :style="cart_content_style">
<block v-if="(cart || null) != null && (cart.data || null) != null && cart.data.length > 0">
<view class="oh br-b padding-vertical-main padding-horizontal-main">
<text class="va-m text-size-xs cr-base">{{ $t('goods-category.goods-category.ico62g') }}</text>
<view class="fr cp" @tap="cart_all_delete_event">
<view class="dis-inline-block va-m pr top-xs">
<uni-icons type="trash" size="16" color="#f00"></uni-icons>
</view>
<text class="cr-red va-m text-size-xs">{{ $t('common.clear') }}</text>
</view>
</view>
<scroll-view :scroll-y="true" class="cart-list goods-list" :show-scrollbar="false">
<view v-for="(goods, index) in cart.data" :key="index" class="item padding-main oh spacing-mb">
<view data-type="cart" :data-index="index" :data-value="goods.goods_url" @tap="goods_event" class="cp flex-row jc-sb">
<image :src="goods.images" mode="widthFix" class="goods-img radius br"></image>
<view class="goods-base flex-1 flex-width flex-col jc-sb">
<view class="goods-base-content">
<view class="goods-title text-size-sm single-text">{{ goods.title }}</view>
<view v-if="goods.spec != null" class="text-size-xs cr-grey margin-top-xs">
<block v-for="(sv, si) in goods.spec" :key="si">
<text v-if="si > 0" class="padding-left-xs padding-right-xs">;</text>
<text>{{ sv.value }}</text>
</block>
</view>
</view>
<view class="margin-top-xs oh">
<view class="sales-price text-size single-text dis-inline-block va-m pr top-sm">{{ currency_symbol }}{{ goods.price }}</view>
<view class="tc fr flex-row align-c">
<block v-if="goods.is_error == 0">
<view v-if="(goods.stock || 0) > 0" class="cp pr top-sm" :data-index="index" data-type="0" @tap.stop="cart_buy_number_event">
<iconfont name="icon-cart-dec" size="48rpx" :color="theme_color"></iconfont>
</view>
<view v-if="(goods.stock || 0) > 0" class="buy-number dis-inline-block cr-black text-size-sm padding-left-xs padding-right-xs va-m">
{{ goods.stock }}
</view>
<view class="cp pr top-sm" :data-index="index" data-type="1" @tap.stop="cart_buy_number_event">
<iconfont name="icon-cart-inc" size="48rpx" :color="theme_color"></iconfont>
</view>
</block>
<block v-else>
<text class="cr-red">{{ goods.error_msg }}</text>
</block>
</view>
</view>
</view>
</view>
</view>
</scroll-view>
</block>
<block v-else>
<component-no-data propStatus="0" :propMsg="$t('goods-category.goods-category.5pj8ip')"></component-no-data>
</block>
</view>
</block>
<!-- 购物车底部导航 -->
<view class="botton-nav bg-white round pa oh padding-sm flex-row jc-sb align-c" :style="botton_nav_style + (cart_status ? 'z-index:5;' : '')">
<view class="flex-row align-c flex-1 flex-width">
<view class="cart pr cp top-sm padding-left-sm" @tap="cart_event">
<iconfont name="icon-menu-cart" size="36rpx" color="#666"></iconfont>
<view v-if="(cart || null) != null && (cart.buy_number || 0) != 0" class="badge-icon pa">
<component-badge :propNumber="cart.buy_number"></component-badge>
</view>
</view>
<view class="cart-total-price single-text padding-left-sm fw-b cr-red flex-1">
<text class="text-size-xss">{{ currency_symbol }}</text>
<text class="text-size-lg">{{ (cart || null) == null ? 0 : cart.total_price || 0 }}</text>
</view>
</view>
<button type="default" size="mini" hover-class="none" class="btn bg-main cr-white text-size-md round margin-right-xs" @tap="buy_submit_event">{{ $t('goods-category.goods-category.44f1ww') }}</button>
</view>
</block>
</view>
</block>
<block v-else>
<component-no-data :propStatus="data_list_loding_status" :propMsg="data_list_loding_msg" propPage="goods-category" :propIsHeader="true"></component-no-data>
</block>
<block v-if="data_list_loding_status != 1">
<!-- 购物车抛物线 -->
<component-cart-para-curve ref="cart_para_curve"></component-cart-para-curve>
<!-- 商品购买 -->
<component-goods-buy ref="goods_buy" :propCurrencySymbol="currency_symbol" v-on:CartSuccessEvent="goods_cart_back_event"></component-goods-buy>
</block>
</view>
</view>
<!-- 商品列表 -->
<view class="goods-list">
<view class="list">
<view class="item" v-for="(item, index) in data_list" :key="item.id" :data-index="index" :data-value="item.goods_url + '&is_opt_back=1'" @tap="goods_event">
<view class="icon">
<image class="img" :src="item.images" mode="widthFix"></image>
</view>
<view class="info">
<view class="name">{{ item.title }}</view>
<view class="tag-list">
<view class="tag">新品</view>
</view>
<view class="price-wrap">
<text class="p">￥{{ item.min_price }}</text>
<text class="o">￥{{ item.original_price }}</text>
</view>
</view>
</view>
</view>
<view style="position: relative; z-index: 2">
<component-no-data :propStatus="data_list_loding_status" :propMsg="data_list_loding_msg" :propBackBtn="false" propPage="goods-category-item"></component-no-data>
</view>
</view>
<!-- 公共 -->
<component-common ref="common" @onFooterHeight="footer_height_value_event" :propIsFooterSeat="false"></component-common>
</view>
<!-- 公共 -->
<component-common ref="common" @onFooterHeight="footer_height_value_event" :propIsFooterSeat="false"></component-common>
</view>
</template>
@@ -414,7 +123,7 @@
is_first: 1,
search_keywords_value: '',
nav_active_index: 0,
nav_active_item_two_index: -1,
nav_active_item_two_index: 0,
nav_active_item_three_index: -1,
scroll_top: 0,
scroll_top_old: 0,
@@ -457,6 +166,12 @@
cart_content_style: '',
footer_height_value: 0,
categoryIndex: '',
tabWidths: [],
scrollLeft: 0,
tabWidths1: [],
scrollLeft1: 0,
sort_all: true,
headerHieght: 0,
};
},
@@ -508,8 +223,104 @@
this.$refs.common.on_show({ object: this, method: 'init' });
}
},
onReachBottom() {
this.data_page++;
this.get_goods_list();
},
methods: {
// 初始化获取所有选项卡的宽度
initTabWidths() {
const query = uni.createSelectorQuery().in(this);
query
.selectAll('.tab-item0')
.boundingClientRect((rects) => {
this.tabWidths = rects.map((rect) => rect.width);
})
.exec();
query
.selectAll('.tab-item1')
.boundingClientRect((rects) => {
this.tabWidths1 = rects.map((rect) => rect.width);
})
.exec();
query
.select('.header-wrap')
.boundingClientRect((rect) => {
this.headerHieght = rect.height;
})
.exec();
},
// 处理选项卡点击
handleTabClick(index, key) {
this[key] = index;
if (key == 'nav_active_index') {
// 重置二级分类的索引和滚动条位置
// 检查是否有二级分类
let arr = this.category_list[this.nav_active_index].items;
this.nav_active_item_two_index = arr.length ? 0 : -1;
this.scrollLeft1 = 0;
// 计算需要滚动的距离使目标选项卡居中
let scrollLeft = 0;
for (let i = 0; i < index; i++) {
scrollLeft += this.tabWidths[i] || 0;
}
// 获取容器宽度和当前选项卡宽度
const containerWidth = uni.getSystemInfoSync().windowWidth - 50;
const currentTabWidth = this.tabWidths[index] || 0;
// 计算居中偏移量
scrollLeft = scrollLeft + currentTabWidth / 2 - containerWidth / 2;
// 确保滚动距离不小于0
scrollLeft = Math.max(0, scrollLeft);
// 设置滚动位置
this.scrollLeft = scrollLeft;
}
if (key == 'nav_active_item_two_index') {
// 计算需要滚动的距离使目标选项卡居中
let scrollLeft1 = 0;
for (let i = 0; i < index; i++) {
scrollLeft1 += this.tabWidths1[i] || 0;
}
// 获取容器宽度和当前选项卡宽度
const containerWidth = uni.getSystemInfoSync().windowWidth - 50;
const currentTabWidth = this.tabWidths1[index] || 0;
// 计算居中偏移量
scrollLeft1 = scrollLeft1 + currentTabWidth / 2 - containerWidth / 2;
// 确保滚动距离不小于0
scrollLeft1 = Math.max(0, scrollLeft1);
// 设置滚动位置
this.scrollLeft1 = scrollLeft1;
}
this.data_content = this.category_list[this.nav_active_index] || null;
this.data_page = 1;
this.data_list = [];
this.data_list_loding_status = 1;
this.data_bottom_line_status = false;
this.sort_all = true;
this.set_resources_data();
this.get_goods_list(1);
this.$nextTick(() => {
this.initTabWidths();
});
},
// 资源设置
set_resources_data() {
var search_nav_sort_list = [
@@ -654,6 +465,12 @@
this.setData({
is_first: 0,
});
this.$nextTick(() => {
setTimeout(() => {
this.initTabWidths();
}, 500);
});
} else {
this.setData({
data_list_loding_status: 2,
@@ -909,6 +726,11 @@
// 搜索事件
search_button_event(e) {
// 进入搜索页面
app.globalData.url_open('/pages/goods-search/goods-search');
return;
// 商品列表模式
if (this.category_show_level == 0) {
this.setData({
@@ -1369,30 +1191,39 @@
// 排序事件
nav_sort_event(e) {
var index = e.currentTarget.dataset.index || 0;
var temp_search_nav_sort = this.search_nav_sort_list;
var temp_sort = temp_search_nav_sort[index]['sort'] == 'desc' ? 'asc' : 'desc';
for (var i in temp_search_nav_sort) {
if (i != index) {
if (temp_search_nav_sort[i]['icon'] != null) {
temp_search_nav_sort[i]['icon'] = 'default';
if (e.currentTarget.dataset.index == -1) {
this.sort_all = true;
this.set_resources_data();
} else {
this.sort_all = false;
var index = e.currentTarget.dataset.index || 0;
var temp_search_nav_sort = this.search_nav_sort_list;
var temp_sort = temp_search_nav_sort[index]['sort'] == 'desc' ? 'asc' : 'desc';
for (var i in temp_search_nav_sort) {
if (i != index) {
if (temp_search_nav_sort[i]['icon'] != null) {
temp_search_nav_sort[i]['icon'] = 'default';
}
temp_search_nav_sort[i]['sort'] = 'desc';
}
temp_search_nav_sort[i]['sort'] = 'desc';
}
}
temp_search_nav_sort[index]['sort'] = temp_sort;
if (temp_search_nav_sort[index]['icon'] != null) {
temp_search_nav_sort[index]['icon'] = temp_sort;
}
temp_search_nav_sort[index]['sort'] = temp_sort;
if (temp_search_nav_sort[index]['icon'] != null) {
temp_search_nav_sort[index]['icon'] = temp_sort;
}
this.setData({
search_nav_sort_index: index,
search_nav_sort_list: temp_search_nav_sort,
});
}
this.setData({
search_nav_sort_index: index,
search_nav_sort_list: temp_search_nav_sort,
data_page: 1,
data_list: [],
data_list_loding_status: 1,
data_bottom_line_status: false,
});
this.reset_scroll();
this.get_goods_list(1);
},
@@ -1407,6 +1238,190 @@
},
};
</script>
<style scoped>
@import './goods-category.css';
<style>
uni-page {
height: auto;
}
</style>
<style scoped lang="scss">
@import './goods-category.css';
.container {
padding: 440upx 28upx 200upx 28upx;
}
.header-wrap {
$padding: 28upx;
width: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 1;
background: linear-gradient(180deg, #fff3ef, #f4f6f9);
.search-wrap {
/* #ifdef H5 */
padding: $padding $padding 0;
/* #endif */
/* #ifdef MP-ALIPAY */
padding: 0 170upx 0 80upx;
/* #endif */
.ipt-wrap {
height: 72upx;
display: flex;
align-items: center;
border: 1px solid #ffcab8;
border-radius: 6px;
background-color: #fff;
.ipt {
flex: 1;
display: flex;
align-items: center;
padding-left: 20upx;
font-size: 28upx;
margin-right: $padding;
.t {
color: #999;
font-size: 28upx;
}
}
.btn {
padding: 0 $padding;
font-size: 32upx;
color: #fb1622;
position: relative;
margin-left: $padding;
.line {
height: 30rpx;
border-left: 1px solid #e9e9e9;
position: absolute;
top: 50%;
margin-top: -15upx;
left: 0;
}
}
}
}
.category-wrap {
.scroll {
width: 100%;
white-space: nowrap;
.item {
display: inline-block;
padding: $padding 0 $padding $padding;
&:last-child {
padding-right: $padding;
}
&.active {
.t {
color: #333333;
font-weight: bold;
}
}
.t {
color: #666666;
font-size: 28upx;
}
.flex {
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
.img {
$size: 82upx;
width: $size;
height: $size;
}
.t {
font-size: 24upx;
margin-top: 12upx;
}
}
}
}
}
.filter-wrap {
display: flex;
.sort-item {
flex: 1;
display: flex;
justify-content: center;
align-items: center;
padding-bottom: 12upx;
&.active {
.cr-base {
font-weight: bold;
color: #333;
}
}
.sort-icon {
width: 10px;
height: 10px;
}
}
}
}
.goods-list {
padding: 20upx 0;
.list {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: auto;
grid-column-gap: 20upx;
grid-row-gap: 20upx;
.item {
background-color: #fff;
border-radius: 20upx;
overflow: hidden;
.icon {
.img {
display: block;
width: 100%;
height: auto;
border-radius: 20upx;
}
}
.info {
padding: 20upx;
}
.name {
width: calc(750upx / 2 - 94upx);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-bottom: 6px;
}
.tag-list {
display: flex;
gap: 6px;
flex-wrap: wrap;
.tag {
display: flex;
align-items: center;
padding: 4upx 16upx;
border-radius: 12upx;
background-color: #d1381e;
color: #fff;
font-size: 24upx;
}
}
.price-wrap {
display: flex;
align-items: center;
gap: 6upx;
.p {
color: #d1381e;
font-size: 36upx;
font-weight: bold;
}
.o {
color: #999;
font-size: 20upx;
text-decoration: line-through;
position: relative;
top: 2px;
}
}
}
}
}
</style>

1412
pages/goods-category/goods-category1.vue Normal file
View File

File diff suppressed because it is too large Load Diff

10
pages/goods-detail/goods-detail.css
View File

@@ -157,15 +157,12 @@
font-size: 30rpx;
line-height: 40rpx;
font-weight: bold;
width: calc(100% - 200rpx);
width: 100%;
}
.goods-base-content image {
width: 40rpx;
height: 40rpx;
}
.goods-base-content .collect {
width: 76rpx;
}
/**
* 视频
@@ -197,7 +194,7 @@
.goods-base-price,
.price-content,
.goods-base-right-opt {
min-height: 145rpx;
min-height: 116rpx;
}
.price-content {
width: calc(100% - 200rpx);
@@ -215,9 +212,6 @@
width: 40rpx;
height: 40rpx;
}
.goods-base-right-opt .collect {
width: 76rpx;
}
.price-content .price-icon {
padding: 0px 8rpx;
color: #fff;

2834
pages/goods-detail/goods-detail.vue
View File

File diff suppressed because it is too large Load Diff

3480
pages/login/login.vue
View File

File diff suppressed because it is too large Load Diff