sileya-ai
/
vr-shopxo-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

购物车抛物线优化、搜索页面新增页面搜索框，分类页面支持搜索进入独立页面

master
gongfuxiang 2023-07-31 23:07:01 +08:00
parent f5e25109ce
commit 018864cadf
9 changed files with 222 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
App.vue
View File

@ -56,7 +56,9 @@
// 用户中心菜单默认展示模式（0 九方格, 1 列表）
user_center_nav_show_model_type: 0,
// 商品列表是否展示购物车（0否, 1是）
is_goods_list_show_cart_opt: 1,
is_goods_list_show_cart_opt: 1,
// 商品分类页面搜索进入独立搜索页面（0否, 1是）
is_goods_category_search_alone: 0,
// tabbar页面
tabbar_pages: [
"/pages/index/index",
@ -67,7 +69,7 @@
// 请求地址
request_url: 'http://shopxo.com/',
// 静态资源地址（如系统根目录不在public目录下面请在静态地址后面加public目录、如：https://d1.shopxo.vip/public/）
static_url: 'https://d1.shopxo.vip/',
static_url: 'http://shopxo.com/',
// 系统类型（默认default、如额外独立小程序、可与程序分身插件实现不同主体小程序及支付独立）
system_type: 'default',
// 基础信息

33
components/cart-para-curve/cart-para-curve.vue
View File

@ -39,17 +39,30 @@
// 未指定购物车对象则读取tabbar数据自动计算购物车位置
if((cart || null) == null || (cart[0] || null) == null) {
var info = uni.getSystemInfoSync();
var tabbar = app.globalData.data.tabbar_pages;
// 无购物车菜单则结束执行
var tabbar_cart_pos = tabbar.indexOf('/pages/cart/cart');
if(tabbar_cart_pos == -1) {
return false;
// 当前页面
var page = app.globalData.current_page().split('?');
switch(page[0]) {
// 商品搜索
case 'pages/goods-search/goods-search' :
var cart_top = 20;
var cart_width = 35;
var cart_left = info.screenWidth-20;
break;
// 默认购物车
default :
// 无购物车菜单则结束执行
var tabbar = app.globalData.data.tabbar_pages;
var tabbar_cart_pos = tabbar.indexOf('/pages/cart/cart');
if(tabbar_cart_pos == -1) {
return false;
}
// 计算购物车菜单位置
var tabbar_count = tabbar.length;
var cart_top = info.screenHeight;
var cart_width = info.screenWidth/tabbar_count;
var cart_left = cart_width*tabbar_cart_pos;
}
// 计算购物车菜单位置
var tabbar_count = tabbar.length;
var cart_top = info.screenHeight;
var cart_width = info.screenWidth/tabbar_count;
var cart_left = cart_width*tabbar_cart_pos;
} else {
var temp = cart[0];
var cart_width = temp.width;

6
components/cart/cart.vue
View File

@ -258,7 +258,7 @@
var data_list = data.data || [];
if(data_list.length > 0) {
// 选中状态处理
var not_use = uni.getStorageSync(app.globalData.data.cache_user_cart_not_use_data_key) || [];
var not_use = uni.getStorageSync(app.globalData.data.cache_user_cart_not_use_data_key) || {};
for(var i in data_list) {
if((not_use[data_list[i]['id']] || null) == null || not_use[data_list[i]['id']] != data_list[i]['stock']) {
data_list[i]['selected'] = true;
@ -379,7 +379,7 @@
success: res => {
uni.hideLoading();
if (res.data.code == 0) {
var not_use = uni.getStorageSync(app.globalData.data.cache_user_cart_not_use_data_key) || [];
var not_use = uni.getStorageSync(app.globalData.data.cache_user_cart_not_use_data_key) || {};
var data = res.data.data;
temp_data_list[index]['stock'] = data.stock;
temp_data_list[index]['original_price'] = data.original_price;
@ -540,7 +540,7 @@
if (type != null) {
var temp_data_list = this.data_list;
var temp_is_selected_all = this.is_selected_all;
var not_use = uni.getStorageSync(app.globalData.data.cache_user_cart_not_use_data_key) || [];
var not_use = uni.getStorageSync(app.globalData.data.cache_user_cart_not_use_data_key) || {};
switch (type) {
// 批量操作
case 'all':

17
components/goods-list/goods-list.vue
View File

@ -210,7 +210,9 @@
watch: {
// 数据
propData(value, old_value) {
this.data = value;
this.setData({
data: value
});
}
},
// 页面被展示
@ -220,8 +222,7 @@
this.setData({
data: this.propData,
is_show_cart: is_show_cart
})
this.data = this.propData;
});
},
methods: {
// 加入购物车
@ -273,6 +274,16 @@
}
}
break;
// 商品搜索
case 'pages/goods-search/goods-search' :
var res = app.globalData.get_page_object(page[0]);
if(res.length > 0) {
for(var i in res) {
res[i].$vm.goods_cart_count_handle(cart_total);
}
}
break;
}
},

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

@ -4,7 +4,12 @@
<!-- 搜索框 -->
<block v-if="is_single_page == 0">
<view class="nav-search padding-horizontal-main bg-white" :style="'padding-top:'+(status_bar_height+8)+'px;'">
<component-search @onsearch="search_button_event" :propIsOnEvent="true" :propIsRequired="false" propPlaceholder="输入商品名称搜索"></component-search>
<block v-if="is_goods_category_search_alone == 1">
<component-search propPlaceholder="输入商品名称搜索"></component-search>
</block>
<block v-else>
<component-search @onsearch="search_button_event" :propIsOnEvent="true" :propIsRequired="false" propPlaceholder="输入商品名称搜索"></component-search>
</block>
</view>
</block>
@ -340,6 +345,8 @@
is_single_page: app.globalData.is_current_single_page() || 0,
// 商品列表模式一级分类图标类型
category_goods_model_icon_field: (icon_type == 0) ? 'realistic_images' : ((icon_type == 1) ? 'icon' : 'big_images' ),
// 商品分类页面搜索进入独立搜索页面
is_goods_category_search_alone: app.globalData.data.is_goods_category_search_alone,
// 临时操作数据
temp_opt_data: null,
// 标签插件

24
pages/goods-search/goods-search.css
View File

@ -1,3 +1,22 @@
/**
* 顶部搜索
*/
.top-search-input {
padding-right: 80rpx;
}
.top-search-right {
top: 20rpx;
right: 20rpx;
}
.top-search-submit {
line-height: 66rpx;
height: 66rpx;
}
.top-search-right .badge-icon {
top: -4px;
right: 10rpx;
}
/**
* 排序导航
*/
@ -25,7 +44,10 @@
/**
* 商品列表
*/
*/
.scroll-box {
height: calc(100vh - 176rpx);
}
.data-list .item {
width: calc(50% - 10rpx);
}

172
pages/goods-search/goods-search.vue
View File

@ -1,23 +1,43 @@
<template>
<view>
<!-- 排序 -->
<view class="nav-sort bg-white oh pr">
<view class="nav-sort-content">
<block v-for="(item, index) in search_nav_sort_list" :key="index">
<view class="item tc fl cp" :data-index="index" @tap="nav_sort_event">
<text class="cr-base va-m">{{item.name}}</text>
<image v-if="(item.icon || null) != null" class="icon va-m" :src="common_static_url + 'sort-' + item.icon + '-icon.png'" mode="aspectFill"></image>
</view>
</block>
</view>
<image class="screening-submit pa cp" :src="common_static_url+'search-submit-icon.png'" mode="aspectFill" @tap="popup_form_event_show"></image>
<image class="show-type-submit pa cp" :src="common_static_url+'show-'+(data_show_type_value == 0 ? 'grid' : 'list')+'-icon.png'" mode="aspectFill" @tap="data_show_type_event"></image>
<view>
<view class="bg-white">
<!-- 搜索关键字 -->
<view class="padding-horizontal-main padding-top-main padding-bottom-sm pr">
<view class="top-search-input">
<input type="text" confirm-type="search" placeholder="输入商品名称搜索" :value="(post_data.wd || '')" class="map-keywords wh-auto round bg-base" placeholder-class="cr-grey" @input="search_input_value_event" @confirm="search_input_confirm_event" @focus="search_input_focus_event" @blur="search_input_blur_event">
</view>
<view class="pa top-search-right">
<view v-if="top_search_right_type_status" class="pr cp" @tap="search_submit_confirm_event">
<uni-icons type="search" size="66rpx" color="#bbb"></uni-icons>
</view>
<view v-if="!top_search_right_type_status" class="pr cp" data-value="/pages/cart-page/cart-page" @tap="url_event">
<uni-icons type="cart" size="66rpx" color="#bbb"></uni-icons>
<view v-if="top_right_cart_total != 0" class="badge-icon pa">
<component-badge :propNumber="top_right_cart_total"></component-badge>
</view>
</view>
</view>
</view>
<!-- 排序 -->
<view class="nav-sort oh pr">
<view class="nav-sort-content">
<block v-for="(item, index) in search_nav_sort_list" :key="index">
<view class="item tc fl cp" :data-index="index" @tap="nav_sort_event">
<text class="cr-base va-m">{{item.name}}</text>
<image v-if="(item.icon || null) != null" class="icon va-m" :src="common_static_url + 'sort-' + item.icon + '-icon.png'" mode="aspectFill"></image>
</view>
</block>
</view>
<image class="screening-submit pa cp" :src="common_static_url+'search-submit-icon.png'" mode="aspectFill" @tap="popup_form_event_show"></image>
<image class="show-type-submit pa cp" :src="common_static_url+'show-'+(data_show_type_value == 0 ? 'grid' : 'list')+'-icon.png'" mode="aspectFill" @tap="data_show_type_event"></image>
</view>
</view>
<!-- 列表 -->
<scroll-view :scroll-y="true" class="scroll-box scroll-box-ece-nav" @scrolltolower="scroll_lower" lower-threshold="60">
<scroll-view :scroll-y="true" class="scroll-box" @scrolltolower="scroll_lower" lower-threshold="60">
<view v-if="data_list.length > 0" class="padding-horizontal-main padding-top-main oh">
<component-goods-list :propData="{style_type: data_show_type_value, goods_list: data_list}" :propLabel="plugins_label_data" :propCurrencySymbol="currency_symbol"></component-goods-list>
<component-goods-list :propData="{style_type: data_show_type_value, goods_list: data_list, random: random_value}" :propLabel="plugins_label_data" :propCurrencySymbol="currency_symbol" :propIsCartParaCurve="true"></component-goods-list>
</view>
<view v-else>
<!-- 提示信息 -->
@ -40,7 +60,7 @@
<text class="fr cr-red cp" @tap="map_remove_event">清除</text>
</view>
<!-- 搜索关键字 -->
<input type="text" confirm-type="search" placeholder="其实搜索很简单^_^ !" name="wd" :value="(post_data.wd || '')" class="map-keywords wh-auto round bg-base margin-top-lg" placeholder-class="cr-grey">
<input type="text" confirm-type="search" placeholder="输入商品名称搜索" name="wd" :value="(post_data.wd || '')" class="map-keywords wh-auto round bg-base margin-top-lg" placeholder-class="cr-grey">
</view>
<!-- 品牌 -->
@ -136,7 +156,8 @@
import componentPopup from "../../components/popup/popup";
import componentNoData from "../../components/no-data/no-data";
import componentBottomLine from "../../components/bottom-line/bottom-line";
import componentGoodsList from "../../components/goods-list/goods-list";
import componentGoodsList from "../../components/goods-list/goods-list";
import componentBadge from "../../components/badge/badge";
var common_static_url = app.globalData.get_static_url('common');
export default {
@ -153,7 +174,13 @@
params: null,
post_data: {},
is_show_popup_form: false,
popup_form_loading_status: false,
popup_form_loading_status: false,
top_search_right_type_status: false,
load_status: 0,
// 增加随机数，避免无法监听数据列表内部数据更新
random_value: 0,
// 购物车
top_right_cart_total: 0,
// 自定义分享信息
share_info: {},
// 排序导航
@ -195,7 +222,8 @@
componentPopup,
componentNoData,
componentBottomLine,
componentGoodsList
componentGoodsList,
componentBadge
},
props: {},
@ -206,14 +234,14 @@
wd: params.keywords || ''
}
});
// 数据加载
this.init();
},
onShow() {
// 初始化配置
this.init_config();
this.init_config();
// 数据加载
this.init();
},
// 下拉刷新
@ -266,7 +294,8 @@
success: res => {
uni.hideLoading();
uni.stopPullDownRefresh();
if (res.data.code == 0) {
if (res.data.code == 0) {
var temp_load_status = this.load_status;
var data = res.data.data;
this.setData({
search_map_info: data.search_map_info || [],
@ -276,12 +305,31 @@
screening_price_list: data.screening_price_list || [],
goods_params_list: data.goods_params_list || [],
goods_spec_list: data.goods_spec_list || []
},
},
load_status: 1,
top_right_cart_total: data.cart_total.buy_number || 0,
plugins_label_data: (data.plugins_label_data || null) == null || (data.plugins_label_data.base || null) == null || (data.plugins_label_data.data || null) == null || data.plugins_label_data.data.length <= 0 ? null : data.plugins_label_data
});
// 获取数据列表
this.get_data_list(1);
});
// 获取数据列表
if(temp_load_status == 0) {
this.get_data_list(1);
} else {
// 如果购物车为0则处理列表，避免存在购物车数量
if(this.top_right_cart_total == 0 && this.data_list.length > 0) {
var temp_data_list = this.data_list;
for(var i in temp_data_list) {
temp_data_list[i]['user_cart_count'] = '';
}
this.setData({
data_list: temp_data_list,
random_value: Math.random()
});
}
}
// 导航购物车处理
this.set_tab_bar_badge_handle();
} else {
this.setData({
data_list_loding_status: 0
@ -357,7 +405,8 @@
}
}
this.setData({
data_list: temp_data_list,
data_list: temp_data_list,
random_value: Math.random(),
data_total: data.total,
data_page_total: data.page_total,
data_list_loding_status: 3,
@ -567,9 +616,72 @@
this.get_data_list(1);
},
// url事件
url_event(e) {
app.globalData.url_event(e);
},
// 数据展示类型
data_show_type_event(e) {
this.setData({data_show_type_value: this.data_show_type_value == 0 ? 1 : 0});
},
// 导航购物车处理
set_tab_bar_badge_handle() {
if (this.top_right_cart_total <= 0) {
app.globalData.set_tab_bar_badge(2, 0);
} else {
app.globalData.set_tab_bar_badge(2, 1, this.top_right_cart_total);
}
},
// 搜索输入事件
search_input_value_event(e) {
var temp_post = this.post_data;
temp_post['wd'] = e.detail.value || '';
this.setData({
post_data: temp_post
});
},
// 搜索输入框输入失去焦点事件
search_input_blur_event(e) {
this.setData({
top_search_right_type_status: false
});
},
// 搜索输入框输入获取焦点事件
search_input_focus_event() {
this.setData({
top_search_right_type_status: true
});
},
// 搜索输入确认事件
search_input_confirm_event(e) {
var temp_post = this.post_data;
temp_post['wd'] = e.detail.value || '';
this.setData({
post_data: temp_post,
data_page: 1
});
this.get_data_list(1);
},
// 搜索确认事件
search_submit_confirm_event(e) {
this.setData({
data_page: 1
});
this.get_data_list(1);
},
// 购物车总数处理
goods_cart_count_handle(cart_number) {
this.setData({
top_right_cart_total: cart_number
});
}
}
};

8
pages/index/index.vue
View File

@ -83,7 +83,7 @@
<!-- 限时秒杀 - 插件 -->
<view v-if="pv.plugins == 'seckill' && (plugins_seckill_data || null) != null && (plugins_seckill_data.data || null) != null && (plugins_seckill_data.data.goods || null) != null && plugins_seckill_data.data.goods.length > 0" class="plugins-seckill-data border-radius-main padding-horizontal-main spacing-mb" :style="'background: url('+plugins_seckill_data.data.home_bg+') top/100% no-repeat;'">
<view class="spacing-nav-title">
<image class="dis-inline-block va-m icon" :src="plugins_seckill_data.data.home_title" mode="widthFix"></image>
<image class="dis-inline-block va-m icon" :src="plugins_seckill_data.data.home_title_icon" mode="widthFix"></image>
<view class="dis-inline-block va-m margin-left-sm">
<component-countdown :propHour="plugins_seckill_data.data.time.hours" :propMinute="plugins_seckill_data.data.time.minutes" :propSecond="plugins_seckill_data.data.time.seconds"></component-countdown>
</view>
@ -222,15 +222,15 @@
</navigator>
</view>
</view>
<!-- 提示信息 -->
<block v-if="load_status == 0">
<component-no-data :propStatus="data_list_loding_status" :propMsg="data_list_loding_msg"></component-no-data>
</block>
<!-- 结尾 -->
<component-bottom-line :propStatus="data_bottom_line_status"></component-bottom-line>
<!-- 版权信息 -->
<view v-if="load_status == 1">
<component-copyright></component-copyright>

2
pages/plugins/seckill/index/index.vue
View File

@ -53,7 +53,7 @@
export default {
data() {
return {
seckill_bg: 'background: url('+seckill_static_url+'home-bg.png) top/100% no-repeat;',
seckill_bg: 'background: url('+seckill_static_url+'header-bg.png) top/100% no-repeat;',
data_bottom_line_status: false,
data_list_loding_status: 1,
data_list_loding_msg: '',