mirror of
https://gitee.com/zongzhige/shopxo.git
synced 2026-06-07 02:12:25 +08:00
小程序搜索优化
This commit is contained in:
Devil
@ -78,7 +78,8 @@ textarea {
|
||||
.br-r-dashed { border-right: dashed 1px #efefef; }
|
||||
|
||||
/* 箭头符号 */
|
||||
.arrow-right { background-image: url('data:image/svg+xml;charset=utf-8,<svg width="16" height="26" viewBox="0 0 16 26" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="UI-KIT_基础元件" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="9.9基础元件" transform="translate(-5809.000000, -8482.000000)" fill="#C7C7CC"><polygon id="Disclosure-Indicator" points="5811 8482 5809 8484 5820.5 8495 5809 8506 5811 8508 5825 8495"></polygon></g></g></svg>'); background-size: 15px 10px; background-repeat: no-repeat; background-position: center right; }
|
||||
.arrow-right { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAA+klEQVRYR+3WsWrDMBAG4P/eotCQLlk73UGfq6O3BgLNEsg7JQQPZ7ADfos8gAeBijYTAsnpREJBXmX0f/7RCRNe/NCL81EBtYH/1YCq/gK4iMiu1PSYGlDVloi+AOyZ+bsEwgQYx/FtmqYDgFUphAmQvniOiDFuRaTxNGEGlEZkAWaIFsCHp4lsQEIMw7AIIRw9CBfgGgFgzcw/ljPhBtxoohGR7aOIIoC+799DCCciWsYYnwvwhKeWXA14w12AEuHZgFLhWYCS4WbAPDxn5m+NpukQquqZiD49V+81wgToum6TfkiYef/oRXPvPRPg3mY56xVQG6gN/AEiuagh/yEjYQAAAABJRU5ErkJggg=='); background-size: 18px 18px; background-repeat: no-repeat; background-position: center right; }
|
||||
.arrow-bottom { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABRklEQVRYR+2UsUrFMBSGT9LBN3AQR4vQNO0gPoA6Cy5XZ1ddfZbr6nwdXFwVH8AlJacg2cTFN7BLjkQQwtW2STvcJRlL8/8fX3LCYMOLbbgfEkAykAwkA4MGEHEhhLif81gZY3bzPP/oy+gFQMSCiJCIjqSUL1MgjDFbXdd9AcB1WZbL/zIGDWitVwCwmAKhlNrOsuyTMYYAcC6EaKMB3IZfCMbYiRDiOcQEIu4RkRkrd1lBU+CZOJVSPg5BNE1zwDl/DSkPBvBNENGFlNIdzZ+FiMdE9BRaHgXgQ1hrL6uquvMJ2rY9s9Y+xJRHA/gQnPOroihu3Tc3rkS0ii2fBLB2MW8A4H1q+WQAH+InZGTUhi5t0BT0BWitDQDsMMYO++Z8bGxnAbhwpdR+XddvY0XRT/HUwNh9sw3EFq7/nwCSgWQgGfgGWR6PIRYTYskAAAAASUVORK5CYII='); background-size: 18px 18px; background-repeat: no-repeat; background-position: center right; }
|
||||
|
||||
|
||||
/* 常用样式 */
|
||||
|
||||
@ -86,6 +86,7 @@ textarea {
|
||||
|
||||
/* 箭头符号 */
|
||||
.arrow-right { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAA+klEQVRYR+3WsWrDMBAG4P/eotCQLlk73UGfq6O3BgLNEsg7JQQPZ7ADfos8gAeBijYTAsnpREJBXmX0f/7RCRNe/NCL81EBtYH/1YCq/gK4iMiu1PSYGlDVloi+AOyZ+bsEwgQYx/FtmqYDgFUphAmQvniOiDFuRaTxNGEGlEZkAWaIFsCHp4lsQEIMw7AIIRw9CBfgGgFgzcw/ljPhBtxoohGR7aOIIoC+799DCCciWsYYnwvwhKeWXA14w12AEuHZgFLhWYCS4WbAPDxn5m+NpukQquqZiD49V+81wgToum6TfkiYef/oRXPvPRPg3mY56xVQG6gN/AEiuagh/yEjYQAAAABJRU5ErkJggg=='); background-size: 18px 18px; background-repeat: no-repeat; background-position: center right; }
|
||||
.arrow-bottom { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABRklEQVRYR+2UsUrFMBSGT9LBN3AQR4vQNO0gPoA6Cy5XZ1ddfZbr6nwdXFwVH8AlJacg2cTFN7BLjkQQwtW2STvcJRlL8/8fX3LCYMOLbbgfEkAykAwkA4MGEHEhhLif81gZY3bzPP/oy+gFQMSCiJCIjqSUL1MgjDFbXdd9AcB1WZbL/zIGDWitVwCwmAKhlNrOsuyTMYYAcC6EaKMB3IZfCMbYiRDiOcQEIu4RkRkrd1lBU+CZOJVSPg5BNE1zwDl/DSkPBvBNENGFlNIdzZ+FiMdE9BRaHgXgQ1hrL6uquvMJ2rY9s9Y+xJRHA/gQnPOroihu3Tc3rkS0ii2fBLB2MW8A4H1q+WQAH+InZGTUhi5t0BT0BWitDQDsMMYO++Z8bGxnAbhwpdR+XddvY0XRT/HUwNh9sw3EFq7/nwCSgWQgGfgGWR6PIRYTYskAAAAASUVORK5CYII='); background-size: 18px 18px; background-repeat: no-repeat; background-position: center right; }
|
||||
|
||||
|
||||
/* 常用样式 */
|
||||
|
||||
@ -86,6 +86,7 @@ textarea {
|
||||
|
||||
/* 箭头符号 */
|
||||
.arrow-right { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAA+klEQVRYR+3WsWrDMBAG4P/eotCQLlk73UGfq6O3BgLNEsg7JQQPZ7ADfos8gAeBijYTAsnpREJBXmX0f/7RCRNe/NCL81EBtYH/1YCq/gK4iMiu1PSYGlDVloi+AOyZ+bsEwgQYx/FtmqYDgFUphAmQvniOiDFuRaTxNGEGlEZkAWaIFsCHp4lsQEIMw7AIIRw9CBfgGgFgzcw/ljPhBtxoohGR7aOIIoC+799DCCciWsYYnwvwhKeWXA14w12AEuHZgFLhWYCS4WbAPDxn5m+NpukQquqZiD49V+81wgToum6TfkiYef/oRXPvPRPg3mY56xVQG6gN/AEiuagh/yEjYQAAAABJRU5ErkJggg=='); background-size: 18px 18px; background-repeat: no-repeat; background-position: center right; }
|
||||
.arrow-bottom { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABRklEQVRYR+2UsUrFMBSGT9LBN3AQR4vQNO0gPoA6Cy5XZ1ddfZbr6nwdXFwVH8AlJacg2cTFN7BLjkQQwtW2STvcJRlL8/8fX3LCYMOLbbgfEkAykAwkA4MGEHEhhLif81gZY3bzPP/oy+gFQMSCiJCIjqSUL1MgjDFbXdd9AcB1WZbL/zIGDWitVwCwmAKhlNrOsuyTMYYAcC6EaKMB3IZfCMbYiRDiOcQEIu4RkRkrd1lBU+CZOJVSPg5BNE1zwDl/DSkPBvBNENGFlNIdzZ+FiMdE9BRaHgXgQ1hrL6uquvMJ2rY9s9Y+xJRHA/gQnPOroihu3Tc3rkS0ii2fBLB2MW8A4H1q+WQAH+InZGTUhi5t0BT0BWitDQDsMMYO++Z8bGxnAbhwpdR+XddvY0XRT/HUwNh9sw3EFq7/nwCSgWQgGfgGWR6PIRYTYskAAAAASUVORK5CYII='); background-size: 18px 18px; background-repeat: no-repeat; background-position: center right; }
|
||||
|
||||
|
||||
/* 常用样式 */
|
||||
|
||||
@ -87,6 +87,7 @@ textarea {
|
||||
|
||||
/* 箭头符号 */
|
||||
.arrow-right { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAA+klEQVRYR+3WsWrDMBAG4P/eotCQLlk73UGfq6O3BgLNEsg7JQQPZ7ADfos8gAeBijYTAsnpREJBXmX0f/7RCRNe/NCL81EBtYH/1YCq/gK4iMiu1PSYGlDVloi+AOyZ+bsEwgQYx/FtmqYDgFUphAmQvniOiDFuRaTxNGEGlEZkAWaIFsCHp4lsQEIMw7AIIRw9CBfgGgFgzcw/ljPhBtxoohGR7aOIIoC+799DCCciWsYYnwvwhKeWXA14w12AEuHZgFLhWYCS4WbAPDxn5m+NpukQquqZiD49V+81wgToum6TfkiYef/oRXPvPRPg3mY56xVQG6gN/AEiuagh/yEjYQAAAABJRU5ErkJggg=='); background-size: 18px 18px; background-repeat: no-repeat; background-position: center right; }
|
||||
.arrow-bottom { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABRklEQVRYR+2UsUrFMBSGT9LBN3AQR4vQNO0gPoA6Cy5XZ1ddfZbr6nwdXFwVH8AlJacg2cTFN7BLjkQQwtW2STvcJRlL8/8fX3LCYMOLbbgfEkAykAwkA4MGEHEhhLif81gZY3bzPP/oy+gFQMSCiJCIjqSUL1MgjDFbXdd9AcB1WZbL/zIGDWitVwCwmAKhlNrOsuyTMYYAcC6EaKMB3IZfCMbYiRDiOcQEIu4RkRkrd1lBU+CZOJVSPg5BNE1zwDl/DSkPBvBNENGFlNIdzZ+FiMdE9BRaHgXgQ1hrL6uquvMJ2rY9s9Y+xJRHA/gQnPOroihu3Tc3rkS0ii2fBLB2MW8A4H1q+WQAH+InZGTUhi5t0BT0BWitDQDsMMYO++Z8bGxnAbhwpdR+XddvY0XRT/HUwNh9sw3EFq7/nwCSgWQgGfgGWR6PIRYTYskAAAAASUVORK5CYII='); background-size: 18px 18px; background-repeat: no-repeat; background-position: center right; }
|
||||
|
||||
|
||||
/* 常用样式 */
|
||||
|
||||
@ -74,7 +74,7 @@ App({
|
||||
// 请求地址
|
||||
request_url: "{{request_url}}",
|
||||
request_url: 'http://shopxo.com/',
|
||||
request_url: 'https://dev.shopxo.net/',
|
||||
// request_url: 'https://dev.shopxo.net/',
|
||||
|
||||
// 基础信息
|
||||
application_title: "{{application_title}}",
|
||||
|
||||
@ -86,6 +86,7 @@ textarea {
|
||||
|
||||
/* 箭头符号 */
|
||||
.arrow-right { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAA+klEQVRYR+3WsWrDMBAG4P/eotCQLlk73UGfq6O3BgLNEsg7JQQPZ7ADfos8gAeBijYTAsnpREJBXmX0f/7RCRNe/NCL81EBtYH/1YCq/gK4iMiu1PSYGlDVloi+AOyZ+bsEwgQYx/FtmqYDgFUphAmQvniOiDFuRaTxNGEGlEZkAWaIFsCHp4lsQEIMw7AIIRw9CBfgGgFgzcw/ljPhBtxoohGR7aOIIoC+799DCCciWsYYnwvwhKeWXA14w12AEuHZgFLhWYCS4WbAPDxn5m+NpukQquqZiD49V+81wgToum6TfkiYef/oRXPvPRPg3mY56xVQG6gN/AEiuagh/yEjYQAAAABJRU5ErkJggg=='); background-size: 18px 18px; background-repeat: no-repeat; background-position: center right; }
|
||||
.arrow-bottom { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABRklEQVRYR+2UsUrFMBSGT9LBN3AQR4vQNO0gPoA6Cy5XZ1ddfZbr6nwdXFwVH8AlJacg2cTFN7BLjkQQwtW2STvcJRlL8/8fX3LCYMOLbbgfEkAykAwkA4MGEHEhhLif81gZY3bzPP/oy+gFQMSCiJCIjqSUL1MgjDFbXdd9AcB1WZbL/zIGDWitVwCwmAKhlNrOsuyTMYYAcC6EaKMB3IZfCMbYiRDiOcQEIu4RkRkrd1lBU+CZOJVSPg5BNE1zwDl/DSkPBvBNENGFlNIdzZ+FiMdE9BRaHgXgQ1hrL6uquvMJ2rY9s9Y+xJRHA/gQnPOroihu3Tc3rkS0ii2fBLB2MW8A4H1q+WQAH+InZGTUhi5t0BT0BWitDQDsMMYO++Z8bGxnAbhwpdR+XddvY0XRT/HUwNh9sw3EFq7/nwCSgWQgGfgGWR6PIRYTYskAAAAASUVORK5CYII='); background-size: 18px 18px; background-repeat: no-repeat; background-position: center right; }
|
||||
|
||||
|
||||
/* 常用样式 */
|
||||
|
||||
@ -4,6 +4,7 @@ Page({
|
||||
data_list_loding_status: 1,
|
||||
data_bottom_line_status: false,
|
||||
data_list: [],
|
||||
data_total: 0,
|
||||
data_page_total: 0,
|
||||
data_page: 1,
|
||||
params: null,
|
||||
@ -20,6 +21,21 @@ Page({
|
||||
|
||||
// 基础配置
|
||||
currency_symbol: app.data.currency_symbol,
|
||||
|
||||
// 搜素条件
|
||||
search_map_info: [],
|
||||
brand_list: [],
|
||||
category_list: [],
|
||||
screening_price_list: [],
|
||||
goods_params_list: [],
|
||||
goods_spec_list: [],
|
||||
map_fields_list: {
|
||||
"brand_list": {"height":"100rpx", "default":"100rpx", "form_key":"brand_ids"},
|
||||
"category_list": {"height":"82rpx", "default":"82rpx", "form_key":"category_ids"},
|
||||
"screening_price_list": {"height":"82rpx", "default":"82rpx", "form_key":"screening_price_values"},
|
||||
"goods_params_list": {"height":"82rpx", "default":"82rpx", "form_key":"goods_params_values"},
|
||||
"goods_spec_list": {"height":"82rpx", "default":"82rpx", "form_key":"goods_spec_values"}
|
||||
},
|
||||
},
|
||||
|
||||
onLoad(params) {
|
||||
@ -85,16 +101,9 @@ Page({
|
||||
|
||||
// 加载loding
|
||||
wx.showLoading({title: "加载中..." });
|
||||
this.setData({
|
||||
data_list_loding_status: 1
|
||||
});
|
||||
|
||||
// 参数
|
||||
var params = this.data.params;
|
||||
var post_data = this.data.post_data;
|
||||
post_data['page'] = this.data.data_page;
|
||||
post_data['category_id'] = params['category_id'] || 0;
|
||||
post_data['brand_id'] = params['brand_id'] || 0;
|
||||
var post_data = this.request_map_handle();
|
||||
|
||||
// 获取数据
|
||||
wx.request({
|
||||
@ -107,20 +116,36 @@ Page({
|
||||
wx.hideLoading();
|
||||
wx.stopPullDownRefresh();
|
||||
if (res.data.code == 0) {
|
||||
if (res.data.data.data.length > 0) {
|
||||
var data = res.data.data;
|
||||
if (data.data.length > 0) {
|
||||
if (this.data.data_page <= 1) {
|
||||
var temp_data_list = res.data.data.data;
|
||||
var temp_data_list = data.data;
|
||||
} else {
|
||||
var temp_data_list = this.data.data_list;
|
||||
var temp_data = res.data.data.data;
|
||||
var temp_data = data.data;
|
||||
for (var i in temp_data) {
|
||||
temp_data_list.push(temp_data[i]);
|
||||
}
|
||||
}
|
||||
|
||||
// 仅首次请求赋值条件数据
|
||||
if(this.data.data_list_loding_status == 1)
|
||||
{
|
||||
this.setData({
|
||||
search_map_info: data.search_map_info || [],
|
||||
brand_list: data.brand_list || [],
|
||||
category_list: data.category_list || [],
|
||||
screening_price_list: data.screening_price_list || [],
|
||||
goods_params_list: data.goods_params_list || [],
|
||||
goods_spec_list: data.goods_spec_list || [],
|
||||
});
|
||||
}
|
||||
|
||||
// 公共基础数据
|
||||
this.setData({
|
||||
data_list: temp_data_list,
|
||||
data_total: res.data.data.total,
|
||||
data_page_total: res.data.data.page_total,
|
||||
data_total: data.total,
|
||||
data_page_total: data.page_total,
|
||||
data_list_loding_status: 3,
|
||||
data_page: this.data.data_page + 1
|
||||
});
|
||||
@ -163,6 +188,58 @@ Page({
|
||||
});
|
||||
},
|
||||
|
||||
// 搜索条件处理
|
||||
request_map_handle() {
|
||||
var params = this.data.params;
|
||||
var post_data = this.data.post_data;
|
||||
post_data['page'] = this.data.data_page;
|
||||
|
||||
// 指定分类、品牌
|
||||
post_data['category_id'] = params['category_id'] || 0;
|
||||
post_data['brand_id'] = params['brand_id'] || 0;
|
||||
|
||||
// 搜索条件
|
||||
var data = this.data;
|
||||
for(var i in data.map_fields_list)
|
||||
{
|
||||
if((data[i] != null) != null && data[i].length > 0)
|
||||
{
|
||||
var temp = {};
|
||||
var index = 0;
|
||||
for(var k in data[i])
|
||||
{
|
||||
if((data[i][k]['active'] || 0) == 1)
|
||||
{
|
||||
switch(i)
|
||||
{
|
||||
// 价格
|
||||
case 'screening_price_list' :
|
||||
temp[index] = data[i][k]['min_price']+'-'+data[i][k]['max_price'];
|
||||
break;
|
||||
|
||||
// 属性、规格
|
||||
case 'goods_params_list' :
|
||||
case 'goods_spec_list' :
|
||||
temp[index] = data[i][k]['value'];
|
||||
break;
|
||||
|
||||
// 默认取值id
|
||||
default :
|
||||
temp[index] = data[i][k]['id'];
|
||||
}
|
||||
index++;
|
||||
}
|
||||
}
|
||||
if(app.get_length(temp) > 0)
|
||||
{
|
||||
post_data[data.map_fields_list[i]['form_key']] = JSON.stringify(temp);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return post_data;
|
||||
},
|
||||
|
||||
// 下拉刷新
|
||||
onPullDownRefresh() {
|
||||
this.setData({
|
||||
@ -193,7 +270,7 @@ Page({
|
||||
this.setData({ is_show_popup_form: true });
|
||||
},
|
||||
|
||||
// 筛选
|
||||
// 排序事件
|
||||
nav_sort_event(e) {
|
||||
var index = e.currentTarget.dataset.index || 0;
|
||||
var temp_post_data = this.data.post_data;
|
||||
@ -224,6 +301,29 @@ Page({
|
||||
this.get_data_list(1);
|
||||
},
|
||||
|
||||
// 条件-更多数据展示事件
|
||||
more_event(e) {
|
||||
var value = e.currentTarget.dataset.value || null;
|
||||
var temp_more = this.data.map_fields_list;
|
||||
if(value != null && (temp_more[value] || null) != null)
|
||||
{
|
||||
temp_more[value]['height'] = (temp_more[value]['height'] == 'auto') ? temp_more[value]['default'] : 'auto';
|
||||
this.setData({map_fields_list: temp_more});
|
||||
}
|
||||
},
|
||||
|
||||
// 条件-选择事件
|
||||
map_item_event(e) {
|
||||
var index = e.currentTarget.dataset.index;
|
||||
var field = e.currentTarget.dataset.field;
|
||||
var data = this.data;
|
||||
if((data[field] || null) != null && (data[field][index] || null) != null)
|
||||
{
|
||||
data[field][index]['active'] = ((data[field][index]['active'] || 0) == 0) ? 1 : 0;
|
||||
this.setData(data);
|
||||
}
|
||||
},
|
||||
|
||||
// 自定义分享
|
||||
onShareAppMessage() {
|
||||
var user_id = app.get_user_cache_info('id', 0) || 0;
|
||||
|
||||
@ -37,21 +37,98 @@
|
||||
</scroll-view>
|
||||
|
||||
<!-- 筛选条件 popup -->
|
||||
<component-popup prop-show="{{is_show_popup_form}}" prop-position="right" bindonclose="popup_form_event_close">
|
||||
<component-popup prop-show="{{is_show_popup_form}}" prop-position="left" bindonclose="popup_form_event_close">
|
||||
<form bindsubmit="form_submit_event" class="popup-form oh bg-white">
|
||||
<view class="item oh screening-price">
|
||||
<view class="title cr-666">价格区间(元)</view>
|
||||
<view class="tc oh">
|
||||
<input type="digit" placeholder="最低价" name="min_price" class="br fl" />
|
||||
<text class="cr-888 separator">~</text>
|
||||
<input type="digit" placeholder="最高价" name="max_price" class="br fr" />
|
||||
<view class="search-map">
|
||||
<view class="map-item map-base">
|
||||
<text>筛选出</text>
|
||||
<text class="cr-main"> {{data_total}} </text>
|
||||
<text>条数据</text>
|
||||
</view>
|
||||
|
||||
<!-- 搜索关键字 -->
|
||||
<input type="text" placeholder="其实搜索很简单^_^ !" name="wd" value="{{(post_data.wd || '')}}" class="map-keywords" placeholder-class="cr-ccc" />
|
||||
|
||||
<!-- 品牌 -->
|
||||
<view wx:if="{{(brand_list || null) != null && brand_list.length > 0}}" class="map-item">
|
||||
<view class="map-nav tc">
|
||||
<text>品牌</text>
|
||||
<text class="arrow-bottom" wx:if="{{brand_list.length > 3}}" bindtap="more_event" data-value="brand_list">更多</text>
|
||||
</view>
|
||||
<view wx:if="{{(search_map_info.brand || null) != null}}" class="map-content brand-info oh bg-white">
|
||||
<image wx:if="{{(search_map_info.brand.logo || null) != null}}" src="{{search_map_info.brand.logo}}" mode="aspectFit" class="fl" />
|
||||
<view wx:else class="info-logo-empty tc fl">{{search_map_info.brand.name}}</view>
|
||||
<view class="info-right fr">
|
||||
<view wx:if="{{(search_map_info.brand.logo || null) != null}}" class="info-name">{{search_map_info.brand.name}}</view>
|
||||
<view wx:if="{{(search_map_info.brand.describe || null) != null}}"class="info-desc multi-text">{{search_map_info.brand.describe}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view wx:else class="map-content map-images-text-items map-brand-container oh bg-white" style="height:{{map_fields_list.brand_list.height}};">
|
||||
<block wx:for="{{brand_list}}" wx:key="key">
|
||||
<view class="fl tc single-text {{item.active == 1 ? 'active' : ''}}" bindtap="map_item_event" data-index="{{index}}" data-field="brand_list">
|
||||
<image wx:if="{{(item.logo || null) != null}}" src="{{item.logo}}" mode="aspectFit" />
|
||||
<text wx:else>{{item.name}}</text>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 分类 -->
|
||||
<view wx:if="{{(category_list || null) != null && category_list.length > 0}}" class="map-item">
|
||||
<view class="map-nav tc">
|
||||
<text>分类</text>
|
||||
<text class="arrow-bottom" wx:if="{{category_list.length > 3}}" bindtap="more_event" data-value="category_list">更多</text>
|
||||
</view>
|
||||
<view class="map-content map-text-items map-category-container oh bg-white" style="height:{{map_fields_list.category_list.height}};">
|
||||
<block wx:for="{{category_list}}" wx:key="key">
|
||||
<view class="fl {{item.active == 1 ? 'active' : ''}}" bindtap="map_item_event" data-index="{{index}}" data-field="category_list">{{item.name}}</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 价格 -->
|
||||
<view wx:if="{{(screening_price_list || null) != null && screening_price_list.length > 0}}" class="map-item">
|
||||
<view class="map-nav tc">
|
||||
<text>价格</text>
|
||||
<text class="arrow-bottom" wx:if="{{screening_price_list.length > 3}}" bindtap="more_event" data-value="screening_price_list">更多</text>
|
||||
</view>
|
||||
<view class="map-content map-text-items screening-price-container oh bg-white" style="height:{{map_fields_list.screening_price_list.height}};">
|
||||
<block wx:for="{{screening_price_list}}" wx:key="key">
|
||||
<view class="fl {{item.active == 1 ? 'active' : ''}}" bindtap="map_item_event" data-index="{{index}}" data-field="screening_price_list">{{item.name}}</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 属性 -->
|
||||
<view wx:if="{{(goods_params_list || null) != null && goods_params_list.length > 0}}" class="map-item">
|
||||
<view class="map-nav tc">
|
||||
<text>属性</text>
|
||||
<text class="arrow-bottom" wx:if="{{goods_params_list.length > 3}}" bindtap="more_event" data-value="goods_params_list">更多</text>
|
||||
</view>
|
||||
<view class="map-content map-text-items goods-params-container oh bg-white" style="height:{{map_fields_list.goods_params_list.height}};">
|
||||
<block wx:for="{{goods_params_list}}" wx:key="key">
|
||||
<view class="fl {{item.active == 1 ? 'active' : ''}}" bindtap="map_item_event" data-index="{{index}}" data-field="goods_params_list">{{item.value}}</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 规格 -->
|
||||
<view wx:if="{{(goods_spec_list || null) != null && goods_spec_list.length > 0}}" class="map-item">
|
||||
<view class="map-nav tc">
|
||||
<text>规格</text>
|
||||
<text class="arrow-bottom" wx:if="{{goods_spec_list.length > 3}}" bindtap="more_event" data-value="goods_spec_list">更多</text>
|
||||
</view>
|
||||
<view class="map-content map-text-items goods-spec-container oh bg-white" style="height:{{map_fields_list.goods_spec_list.height}};">
|
||||
<block wx:for="{{goods_spec_list}}" wx:key="key">
|
||||
<view class="fl {{item.active == 1 ? 'active' : ''}}" bindtap="map_item_event" data-index="{{index}}" data-field="goods_spec_list">{{item.value}}</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<button formType="submit" class="bg-main search-submit wh-auto" disabled="{{popup_form_loading_status}}" hover-class="none">确认</button>
|
||||
</view>
|
||||
<view class="item keywords">
|
||||
<view class="title cr-666">关键字</view>
|
||||
<input type="text" placeholder="关键字" name="wd" value="{{(params.keywords || '')}}" class="br" />
|
||||
</view>
|
||||
<button formType="submit" class="bg-main form-submit wh-auto" disabled="{{popup_form_loading_status}}" hover-class="none">确认</button>
|
||||
|
||||
|
||||
</form>
|
||||
</component-popup>
|
||||
|
||||
|
||||
@ -61,40 +61,100 @@
|
||||
/**
|
||||
* 条件
|
||||
*/
|
||||
.popup-form {
|
||||
height: 100vh;
|
||||
.search-map {
|
||||
height: calc(100vh - 80rpx);
|
||||
width: 680rpx;
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.popup-form input {
|
||||
font-size: 26rpx;
|
||||
height: 60rpx;
|
||||
.map-keywords {
|
||||
border-radius: 0 !important;
|
||||
padding: 0 10rpx;
|
||||
line-height: 66rpx;
|
||||
height: 66rpx;
|
||||
border-color: #e8e8e8;
|
||||
border-width: 1px 0;
|
||||
border-style: solid;
|
||||
}
|
||||
.map-nav {
|
||||
position: relative;
|
||||
}
|
||||
.map-nav .arrow-bottom {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 10rpx;
|
||||
padding-right: 46rpx;
|
||||
color: #999;
|
||||
}
|
||||
.map-item {
|
||||
background: #f0f0f0;
|
||||
line-height: 76rpx;
|
||||
}
|
||||
.map-base,
|
||||
.map-nav {
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
.map-content {
|
||||
padding: 15rpx;
|
||||
line-height: 60rpx;
|
||||
background: #fbfbfb;
|
||||
border-radius: 6rpx;
|
||||
padding: 0 6rpx;
|
||||
}
|
||||
.screening-price input {
|
||||
width: calc(50% - 20px);
|
||||
.map-text-items view,
|
||||
.map-images-text-items view {
|
||||
padding: 0 15rpx;
|
||||
border-radius: 2px;
|
||||
margin: 15rpx;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
.screening-price .separator {
|
||||
line-height: 50rpx;
|
||||
.map-images-text-items view {
|
||||
vertical-align: middle;
|
||||
border: 1px solid #eee;
|
||||
width: 150rpx;
|
||||
height: 72rpx;
|
||||
line-height: 72rpx;
|
||||
}
|
||||
.popup-form .item {
|
||||
width: 480rpx;
|
||||
padding: 0 20rpx;
|
||||
margin-top: 20rpx;
|
||||
.map-images-text-items view image {
|
||||
width: 150rpx;
|
||||
height: calc(100% - 8rpx);
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
margin-top: 4rpx;
|
||||
}
|
||||
.popup-form .item:not(:last-child) {
|
||||
margin-bottom: 30rpx;
|
||||
.map-text-items view.active,
|
||||
.map-images-text-items view.active {
|
||||
border: 1px solid #e23f36;
|
||||
color: #e23f36;
|
||||
font-weight: bold;
|
||||
}
|
||||
.popup-form .item .title {
|
||||
margin-bottom: 10rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.popup-form .form-submit {
|
||||
.search-map .search-submit {
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* 品牌基础信息
|
||||
*/
|
||||
.brand-info {
|
||||
padding: 35rpx 15rpx;
|
||||
}
|
||||
.brand-info image,
|
||||
.brand-info .info-logo-empty {
|
||||
width: 300rpx;
|
||||
height: 130rpx;
|
||||
border: 1px solid #eee;
|
||||
}
|
||||
.brand-info .info-logo-empty {
|
||||
line-height: 130rpx;
|
||||
}
|
||||
.brand-info .info-right {
|
||||
width: calc(100% - 330rpx);
|
||||
}
|
||||
.brand-info .info-desc {
|
||||
color: #999;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
min-height: 80rpx;
|
||||
}
|
||||
@ -42,4 +42,7 @@
|
||||
.data-list .items .desc {
|
||||
color: #999;
|
||||
margin-top: 10rpx;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
min-height: 80rpx;
|
||||
}
|
||||
Reference in New Issue
Block a user