diff --git a/src/component/sideBarFilterComponent/sideBarFilterComponent.js b/src/component/sideBarFilterComponent/sideBarFilterComponent.js
index e7dae8f..f5c2bae 100644
--- a/src/component/sideBarFilterComponent/sideBarFilterComponent.js
+++ b/src/component/sideBarFilterComponent/sideBarFilterComponent.js
@@ -3,6 +3,7 @@ import { View,Button } from '@tarojs/components'
import { AtTag, AtButton} from 'taro-ui'
+import URL from '../../serviceAPI.config'
import './sideBarFilterComponent.scss'
@@ -20,8 +21,75 @@ class sideBarFilterComponent extends Component {
onClick(value){
console.log(value)
}
+ getSearchParam(){
+ Taro.request({
+ url: URL.GetSearchParam,
+ method: 'POST',
+ dataType: 'json',
+ data: {
+ goods: JSON.stringify({
+ shop_name: false,
+ shop_id: 808,
+ shop_class_id: "",
+ goods_type: 12
+ }),
+ goodsSpec: JSON.stringify([]),
+ goodsParam: JSON.stringify([]),
+ goodsParamExt: JSON.stringify([]),
+
+ },
+ header: {
+ 'content-type': 'application/x-www-form-urlencoded',
+ 'X-Requested-With': 'XMLHttpRequest'
+ }
+ })
+ .then(res => {
+ console.log('param',res)
+ })
+ }
+ getSearchResult(){
+ Taro.request({
+ url: URL.SearchResult,
+ method: 'POST',
+ dataType: 'json',
+ data: {
+ goods: JSON.stringify({
+ curr_page: 1,
+ page_count: 50,
+ shop_name: false,
+ shop_id: 808,
+ config_id: 4,
+ shop_class_id: '',
+ goods_type:12
+ }),
+ goodsSpec: JSON.stringify([]),
+ goodsParam: JSON.stringify([]),
+ goodsParamExt: JSON.stringify([]),
+
+ },
+ header: {
+ 'content-type': 'application/x-www-form-urlencoded',
+ 'X-Requested-With': 'XMLHttpRequest'
+ }
+ })
+ .then(res => {
+ console.log('result',res)
+ })
+ }
+
+ componentWillMount() {
+
+ }
+ componentDidMount() {
+ this.getSearchParam()
+ this.getSearchResult()
+ }
+
+ componentDidShow() { }
+
+ componentDidHide() { }
render() {
-
+
const goodsClass = this.props.FilterText?this.props.FilterText.goods_class:null
const goodsType = this.props.FilterText?this.props.FilterText.goods_type:null
const widthness = this.props.FilterText?this.props.FilterText.goodsParamExt['5'].param_value[0]:null
@@ -30,19 +98,19 @@ class sideBarFilterComponent extends Component {
// 分类
const goodsClassElementsArray=goodsClass.map((item,index)=>{
return {item.class_name}
+ name={item.class_name}
+ type='primary'
+ active={this.state.isActive}
+ onClick={this.onClick.bind(this)}
+ >{item.class_name}
})
// 商品类型
const goodsTypeElementsArray=goodsType.map((item,index)=>{
return {item.goods_type_ch_name}
})
//---------
@@ -50,19 +118,15 @@ class sideBarFilterComponent extends Component {
return {item.param_name}
{item.param_value[0]}
-
+ name={item.param_value[0]}
+ type='primary'
+ active={this.state.isActive}
+ onClick={this.onClick.bind(this)}
+ >{item.param_value[0]}
})
// 宽度
-
-
-
return (
分类
@@ -73,10 +137,10 @@ class sideBarFilterComponent extends Component {
宽度
{widthness.value_desc}
diff --git a/src/pages/shop/shop.js b/src/pages/shop/shop.js
index fd74fb7..fe7a36d 100644
--- a/src/pages/shop/shop.js
+++ b/src/pages/shop/shop.js
@@ -1,11 +1,11 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text, Swiper, SwiperItem, Image } from '@tarojs/components'
-import { AtSearchBar, AtSegmentedControl, AtTabBar, AtDrawer } from 'taro-ui'
+import { AtSearchBar, AtTag, AtIcon ,AtSegmentedControl, AtTabBar, AtDrawer } from 'taro-ui'
import URL from '../../serviceAPI.config'
import './shop.scss'
import ShopItem from '../../component/shopItemComponent/shopItemComponent'
-import SideBarFilter from '../../component/sideBarFilterComponent/sideBarFilterComponent'
+
class Shop extends Component {
// 项目配置
config = {
@@ -18,10 +18,25 @@ class Shop extends Component {
value: '',
shopId:'',
shopName:'',
- filterBar: ['综合排序','销量','新品','价格','人气','筛选'],
FilterText:'',
+ filterBar:['综合排序','销量','新品','价格','人气'],
selectedFilterValue:0,
- isShow:true
+ isShowFilter:true,
+ 综合排序:true,
+ 销量:false,
+ 新品:false,
+ 价格:false,
+ 人气:false,
+ cate:{
+ 10101: false,// "橱柜"
+ 10102: false,// "衣柜"
+ 10106: false,// "装饰柜"
+ 20101: false,// "定制设计"
+ 20103: false,// "产品设计"
+ 30101: false,// "橱柜"
+ 30102: false,// "衣柜"
+ }
+
}
}
onChange(value) {
@@ -33,17 +48,20 @@ class Shop extends Component {
onActionClick() {
console.log('开始搜索')
}
- getSearchParams(){
+ getSearchParams({shop_name = false, shop_id = 1305, shop_class_id = "", goods_class_id=0,class_filter=0}){
Taro.request({
- url: URL.FilterText,
+ url: URL.GetSearchParam,
method: 'POST',
dataType: 'json',
data: {
goods: JSON.stringify({
- shop_name: false,
- shop_id: 808,
- shop_class_id: "" }),
-
+ shop_name: shop_name,
+ shop_id: shop_id,
+ shop_class_id: shop_class_id,
+ goods_class_id: goods_class_id,
+ class_filter: class_filter,
+
+ }),
goodsSpec: JSON.stringify([]),
goodsParam: JSON.stringify([]),
goodsParamExt: JSON.stringify([]),
@@ -58,22 +76,23 @@ class Shop extends Component {
this.setState({ FilterText: res.data })
})
}
-
-
- getShopInfo() {
+
+ // get goods info
+ goodsSearch({ curr_page = 1, page_count = 50, shop_name = false, shop_id = 1305, config_id = 4, shop_class_id = '', order = '', currPage = 1 }) {
Taro.request({
url: URL.GoodsSearch,
method:'POST',
dataType: 'json',
data:{
goods: JSON.stringify({
- curr_page: 1,
- page_count: 50,
- shop_name: false,
- shop_id: 1305,
- config_id: 4,
- shop_class_id: ''
-
+ curr_page: curr_page,
+ page_count: page_count,
+ shop_name: shop_name,
+ shop_id: shop_id,
+ config_id: config_id,
+ shop_class_id: shop_class_id,
+ order: order,
+ currPage: currPage
}),
goodsRegion: JSON.stringify({}),
goodsSpec: JSON.stringify([]),
@@ -91,23 +110,63 @@ class Shop extends Component {
this.setState({ shopItem:res.data})
})
}
- onClickFilter(value){
+ accendingDescending(value){
this.setState({selectedFilterValue:value})
- const sideFilter=5
- if (value === sideFilter){
- this.setState({ isShow:true})
- }
+ if(value==0){
+ this.setState({ 综合排序: !this.state.综合排序 })
+ this.goodsSearch({})
+ }
+ if(value==1){
+ this.setState({ 销量: !this.state.销量 },()=>{
+ this.state.销量 ? this.goodsSearch({ order: "g.sales_volume desc" }) : this.goodsSearch({ order: "g.sales_volume" })
+ })
}
- isShowFilter(){
- this.setState({ isShow: false })
+ if(value==2){
+ this.setState({ 新品: !this.state.新品 },()=>{
+ this.state.新品 ? this.goodsSearch({ order: "g.create_date desc" }) : this.goodsSearch({ order: "g.create_date" })
+ })
+ }
+ if(value==3){
+ this.setState({ 价格: !this.state.价格 },()=>{
+ this.state.价格 ? this.goodsSearch({ order: "g.goods_price desc" }) : this.goodsSearch({ order: "g.goods_price" })
+
+ })
+
+ }
+ if(value==4){
+ this.setState({ 人气: !this.state.人气 },()=>{
+ this.state.人气 ? this.goodsSearch({ order: "g.browse_times desc" }) : this.goodsSearch({ order: "g.browse_times" })
+
+ })
+ }
+ }
+
+ showAndHideFilter(){
+ this.setState({ isShowFilter: !this.state.isShowFilter })
+ }
+ selectTag(value){
+ for(let item in this.state.cate){
+ if(value===item){
+ this.setState(prevState => ({
+ cate: {
+ ...prevState.cate,
+ [item]:!this.state.cate[item]
+ }
+ }),()=>{
+
+ this.getSearchParams({ goods_class_id: value , class_filter :1})
+ // this.goodsSearch({ shop_id: 808 })
+ })
+ }
+ }
}
componentWillMount() {
this.setState({ shopId: this.$router.params.id, shopName: this.$router.params.name}) // 输出 { id: 2, type: 'test' }
}
componentDidMount(){
- this.getShopInfo()
- this.getSearchParams()
+ this.goodsSearch({})
+ this.getSearchParams({})
}
componentDidShow() { }
@@ -116,6 +175,7 @@ class Shop extends Component {
render() {
+ console.log(this.state.FilterText)
const shopName= this.state.shopName
const ShopItemElementsArray =this.state.shopItem? this.state.shopItem.goods.map((item,index)=>{
return
@@ -124,27 +184,70 @@ class Shop extends Component {
}):null
const filterElementsArray=this.state.filterBar.map((item,index)=>{
- return
+ let isTure=this.state[item]
+ return
{item}
-
-
-
-
+ {index!==0&&index!==5&&(isTure? : )}
})
+
+
+ // const widthness = this.state.FilterText ? this.state.FilterText.goodsParamExt[5].param_value[0] : null // filter 宽度选项
+ // 分类
+
+ const goodsClassElementsArray = this.state.FilterText.goods_class ? this.state.FilterText.goods_class.map((item, index) => {
+
+ let isTrue = this.state.cate[item.class_id]
+ return {item.class_name}
+ }):null
+ // 商品类型
+
+ // const goodsTypeElementsArray = this.state.FilterText.goods_type ? Object.keys(this.state.FilterText.goods_type).map((key, index) => {
+ // let object = this.state.FilterText.goods_type
+ // return {object[key].goods_type_ch_name}
+ // }):null
+
+ //---------
+
+ // const goodsParamElementsArray = this.state.FilterText.goodsParam ? Object.keys(this.state.FilterText.goodsParam).map((key, index) => {
+ // console.log(Object.keys(this.state.FilterText.goodsParam))
+ // let object = this.state.FilterText.goodsParam
+ // return {object[key].param_name}
+ //
+ // {object[key].param_value[0]}
+ //
+ //
+ // }):null
+
+
return (
+ showActionButton
+ value={this.state.value}
+ onChange={this.onChange.bind(this)}
+ onActionClick={this.onActionClick.bind(this)}
+ />
@@ -172,11 +275,37 @@ class Shop extends Component {
{filterElementsArray}
+
+
+ 筛选
+
+
+
-
-
+
+
+ {/* sidebar 筛选 */}
-
+
+ 分类
+ {goodsClassElementsArray}
+ 商品类型
+ {goodsTypeElementsArray}
+ {goodsParamElementsArray}
+ 宽度
+
+ {/* {widthness.value_desc} */}
+
+
+
+
+
+
diff --git a/src/pages/shop/shop.scss b/src/pages/shop/shop.scss
index 79be805..5b88075 100644
--- a/src/pages/shop/shop.scss
+++ b/src/pages/shop/shop.scss
@@ -69,7 +69,27 @@
}
.right{
width: 70%;
- background: white
+ background: white;
+ .filter-box{
+ height: 100%;
+ width: 100%;
+ margin-top: 30px;
+ overflow: scroll;
+ display: block;
+ .title{
+ margin-left: 20px;
+ font-size: 30px;
+ }
+ .button-box{
+ margin:20px
+ }
+ .confirm-button{
+ margin: 80px;
+ .button{
+ margin:0 20px
+ }
+ }
+ }
}
}
diff --git a/src/serviceAPI.config.js b/src/serviceAPI.config.js
index b97f7f0..9c5a00e 100644
--- a/src/serviceAPI.config.js
+++ b/src/serviceAPI.config.js
@@ -5,7 +5,8 @@ const URL = {
ShopWxStore: LOCALURL + 'Shop-wxStore', //商城首页信息
ShopSupplyShops: LOCALURL + 'Shop-supplyShops',// 商城店铺信息
GoodsSearch: LOCALURL + 'GoodsSearch-search',// 店铺页面的信息
- FilterText: LOCALURL + 'GoodsSearch-getSearchParam',// sidebar筛选的字段
+ GetSearchParam: LOCALURL + 'GoodsSearch-getSearchParam',// sidebar筛选的字段
+ SearchResult: LOCALURL + 'GoodsSearch-search',// 得到搜索结果
}