diff --git a/src/component/bottomNav/bottomNav.js b/src/component/bottomNav/bottomNav.js
index c998cd9..fc7daed 100644
--- a/src/component/bottomNav/bottomNav.js
+++ b/src/component/bottomNav/bottomNav.js
@@ -41,7 +41,7 @@ class bottomNav extends Component {
render() {
- const otherDataElementsArray = this.props.otherData.menu? this.props.otherData.menu.map((item, index) => {
+ const otherDataElementsArray = this.props.otherData? this.props.otherData.menu.map((item, index) => {
return { title: item.name, iconType: 'clock' }
}):null
return (
diff --git a/src/component/filteredShopComponent/filteredShopComponent.js b/src/component/filteredShopComponent/filteredShopComponent.js
index d993929..5835a10 100644
--- a/src/component/filteredShopComponent/filteredShopComponent.js
+++ b/src/component/filteredShopComponent/filteredShopComponent.js
@@ -31,21 +31,22 @@ class recommondShop extends Component {
render() {
- const title = this.props.shop.shop_name
- const imgUrl = URL.Base + this.props.shop.goods[0].goods_url
- const price = this.props.shop.goods[0].goods_price
- const goods = this.props.shop.goods
- const ProductName = this.props.shop.goods[0].goods_name
- const address = this.props.shop.shop_address
- const distance = this.props.shop.distance
- const ads = this.props.shop.ads
+ const title = this.props.shop?this.props.shop.shop_name:null
+ const imgUrl = this.props.shop ? URL.Base + this.props.shop.goods[0].goods_url : null
+ const price = this.props.shop ? this.props.shop.goods[0].goods_price : null
+ const goods = this.props.shop ? this.props.shop.goods : null
+ const ProductName = this.props.shop ? this.props.shop.goods[0].goods_name : null
+ const address = this.props.shop ? this.props.shop.shop_address : null
+ const distance = this.props.shop ? this.props.shop.distance : null
+ const ads = this.props.shop ? this.props.shop.ads:null
// const consultText = this.props.shop.wx_open
- const voucherLeft = this.props.shop.left_nums
- const goodsElementsArray=goods.slice(1).map((item,index)=>{
+ const voucherLeft = this.props.shop?this.props.shop.left_nums:null
+
+ const goodsElementsArray=goods!==null?goods.slice(1).map((item,index)=>{
return
- })
+ }):null
return (
diff --git a/src/component/shopItemComponent/shopItemComponent.js b/src/component/shopItemComponent/shopItemComponent.js
new file mode 100644
index 0000000..fa1d5dd
--- /dev/null
+++ b/src/component/shopItemComponent/shopItemComponent.js
@@ -0,0 +1,53 @@
+import Taro, { Component } from '@tarojs/taro'
+import { View, Image, Text } from '@tarojs/components'
+
+import eyeIcon from '../../icons/eye.png'
+import cartIcon from '../../icons/cart.png'
+
+import './shopItemComponent.scss'
+import URL from '../../serviceAPI.config'
+
+class ShopItem extends Component {
+
+
+
+ render() {
+ const imgURL =this.props.item? URL.Base +this.props.item.goods_url:null
+ const newPrice = this.props.item ? this.props.item.goods_price : null
+ const oldPrice = this.props.item ? this.props.item.goods_org_price : null
+ const name = this.props.item ? this.props.item.goods_name : null
+ const browseTimes = this.props.item ? this.props.item.browse_times : null
+
+ return (
+
+
+
+
+
+ ¥{newPrice+' '}
+ ¥{oldPrice}
+
+
+
+ {name}
+
+
+
+
+
+ 0
+
+
+
+ {browseTimes}
+
+
+
+
+
+
+ )
+ }
+}
+
+export default ShopItem
diff --git a/src/component/shopItemComponent/shopItemComponent.scss b/src/component/shopItemComponent/shopItemComponent.scss
new file mode 100644
index 0000000..52e14d8
--- /dev/null
+++ b/src/component/shopItemComponent/shopItemComponent.scss
@@ -0,0 +1,52 @@
+
+.shopitem-box{
+ padding:5%;
+ border:1px solid #eee;
+ .image-box{
+ text-align: center;
+ .img{
+ width: 80%;
+ height:400px;
+
+ }
+ }
+ .price-box{
+ .new-price{
+ color:red;
+ font-size: 28px
+ }
+ .old-price{
+ color:#999;
+ text-decoration: line-through;
+ font-size: 28px
+ }
+ }
+ .itemname-box{
+ .name{
+ font-size: 30px
+ }
+ }
+ .addon-box{
+ display: flex;
+ font-size: 30px;
+ margin-top: 10px;
+
+ .basket{
+ margin:0 5px;
+ .title{
+ margin-left: 5px
+ }
+
+ }
+ .browse-time{
+ margin:0 5px;
+ .title{
+ margin-left: 5px
+ }
+ }
+
+ }
+
+}
+
+
diff --git a/src/component/sideBarFilterComponent/sideBarFilterComponent.js b/src/component/sideBarFilterComponent/sideBarFilterComponent.js
new file mode 100644
index 0000000..e7dae8f
--- /dev/null
+++ b/src/component/sideBarFilterComponent/sideBarFilterComponent.js
@@ -0,0 +1,92 @@
+import Taro, { Component } from '@tarojs/taro'
+import { View,Button } from '@tarojs/components'
+import { AtTag, AtButton} from 'taro-ui'
+
+
+
+import './sideBarFilterComponent.scss'
+
+class sideBarFilterComponent extends Component {
+ // 项目配置
+ config = {
+ navigationBarTitleText: '筛选'
+ }
+ constructor() {
+ super(...arguments)
+ this.state = {
+ isActive:false
+ }
+ }
+ onClick(value){
+ console.log(value)
+ }
+ 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
+
+ const goodsParam = this.props.FilterText? this.props.FilterText.goodsParam:null
+// 分类
+ const goodsClassElementsArray=goodsClass.map((item,index)=>{
+ return {item.class_name}
+ })
+// 商品类型
+ const goodsTypeElementsArray=goodsType.map((item,index)=>{
+ return {item.goods_type_ch_name}
+ })
+//---------
+ const goodsParamElementsArray = goodsParam.map((item,index)=>{
+ return {item.param_name}
+
+ {item.param_value[0]}
+
+
+
+ })
+// 宽度
+
+
+
+ return (
+
+ 分类
+ {goodsClassElementsArray}
+ 商品类型
+ {goodsTypeElementsArray}
+ {goodsParamElementsArray}
+ 宽度
+
+ {widthness.value_desc}
+
+
+
+
+
+
+
+ )
+ }
+}
+
+export default sideBarFilterComponent
\ No newline at end of file
diff --git a/src/component/sideBarFilterComponent/sideBarFilterComponent.scss b/src/component/sideBarFilterComponent/sideBarFilterComponent.scss
new file mode 100644
index 0000000..0916f90
--- /dev/null
+++ b/src/component/sideBarFilterComponent/sideBarFilterComponent.scss
@@ -0,0 +1,18 @@
+.filter-box{
+ height: 100%;
+ margin-top: 30px;
+ overflow: scroll;
+ .title{
+ margin-left: 20px;
+ font-size: 30px;
+ }
+ .button-box{
+ margin:20px
+ }
+ .confirm-button{
+ margin: 80px;
+ .button{
+ margin:0 20px
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/icons/cart.png b/src/icons/cart.png
new file mode 100644
index 0000000..2cdf76e
Binary files /dev/null and b/src/icons/cart.png differ
diff --git a/src/icons/eye.png b/src/icons/eye.png
new file mode 100644
index 0000000..2f88df7
Binary files /dev/null and b/src/icons/eye.png differ
diff --git a/src/pages/index/index.js b/src/pages/index/index.js
index af89135..0427a41 100644
--- a/src/pages/index/index.js
+++ b/src/pages/index/index.js
@@ -29,7 +29,7 @@ class Index extends Component {
//http://ihome6.com/Shop-supplyShops
componentDidMount(){
Taro.navigateTo({
- url: '/pages/home/home'
+ url: '/pages/shop/shop'
})
// Taro.request({
diff --git a/src/pages/shop/shop.js b/src/pages/shop/shop.js
index 7d11263..fd74fb7 100644
--- a/src/pages/shop/shop.js
+++ b/src/pages/shop/shop.js
@@ -1,10 +1,11 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text, Swiper, SwiperItem, Image } from '@tarojs/components'
-import { AtSearchBar, Picker } from 'taro-ui'
+import { AtSearchBar, 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 = {
@@ -13,9 +14,14 @@ class Shop extends Component {
constructor() {
super(...arguments)
this.state = {
+ shopItem:'',
value: '',
shopId:'',
- shopName:''
+ shopName:'',
+ filterBar: ['综合排序','销量','新品','价格','人气','筛选'],
+ FilterText:'',
+ selectedFilterValue:0,
+ isShow:true
}
}
onChange(value) {
@@ -23,9 +29,36 @@ class Shop extends Component {
value: value
})
}
+
onActionClick() {
console.log('开始搜索')
}
+ getSearchParams(){
+ Taro.request({
+ url: URL.FilterText,
+ method: 'POST',
+ dataType: 'json',
+ data: {
+ goods: JSON.stringify({
+ shop_name: false,
+ shop_id: 808,
+ shop_class_id: "" }),
+
+ goodsSpec: JSON.stringify([]),
+ goodsParam: JSON.stringify([]),
+ goodsParamExt: JSON.stringify([]),
+
+ },
+ header: {
+ 'content-type': 'application/x-www-form-urlencoded',
+ 'X-Requested-With': 'XMLHttpRequest'
+ }
+ })
+ .then(res => {
+ this.setState({ FilterText: res.data })
+ })
+ }
+
getShopInfo() {
Taro.request({
@@ -37,12 +70,10 @@ class Shop extends Component {
curr_page: 1,
page_count: 50,
shop_name: false,
- shop_id: 1254,
+ shop_id: 1305,
config_id: 4,
- shop_class_id: '',
- order: 'g.browse_times desc',
- currPage: 1,
- goods_class_id: 10401
+ shop_class_id: ''
+
}),
goodsRegion: JSON.stringify({}),
goodsSpec: JSON.stringify([]),
@@ -56,39 +87,67 @@ class Shop extends Component {
}
})
.then(res => {
- console.log('res--',res)
-
+ // console.log(res)
+ this.setState({ shopItem:res.data})
})
}
+ onClickFilter(value){
+ this.setState({selectedFilterValue:value})
+ const sideFilter=5
+ if (value === sideFilter){
+ this.setState({ isShow:true})
+ }
+ }
+ isShowFilter(){
+ this.setState({ isShow: false })
+ }
+
componentWillMount() {
this.setState({ shopId: this.$router.params.id, shopName: this.$router.params.name}) // 输出 { id: 2, type: 'test' }
}
componentDidMount(){
-
this.getShopInfo()
+ this.getSearchParams()
}
-
-
componentDidShow() { }
componentDidHide() { }
render() {
+
const shopName= this.state.shopName
- console.log(shopName)
+ const ShopItemElementsArray =this.state.shopItem? this.state.shopItem.goods.map((item,index)=>{
+ return
+
+
+ }):null
+
+ const filterElementsArray=this.state.filterBar.map((item,index)=>{
+ return
+
+ {item}
+
+
+
+
+
+
+ })
+
+
return (
-
-
+
{shopName}
@@ -103,27 +162,28 @@ class Shop extends Component {
首页
-
店铺说明
-
-
-
-
-
-
-
+ {filterElementsArray}
+
+
+
+
+
+
+
+
+
+ {ShopItemElementsArray}
+
-
-
-
)
}
diff --git a/src/pages/shop/shop.scss b/src/pages/shop/shop.scss
index e9cbad8..79be805 100644
--- a/src/pages/shop/shop.scss
+++ b/src/pages/shop/shop.scss
@@ -1,4 +1,11 @@
+.shop{
+ .search-button{
+ .at-search-bar__action{
+ background-color:#FF9900
+ }
+ }
+}
.banner-box{
position: relative;
.shop-name{
@@ -27,4 +34,59 @@
}
}
-}
\ No newline at end of file
+}
+.filter-box{
+ display: flex;
+ flex-wrap: nowrap;
+ flex-direction: row;
+
+ .filter-title{
+ box-sizing:border-box;
+ flex:1;
+ text-align: center;
+ font-size: 28px;
+ margin: 5px;
+ color:#999;
+ border: 1px solid #999
+ }
+ .actived{
+ color:#b10000
+ }
+
+}
+.side-filter{
+ z-index: 10;
+ position: fixed;
+ top:0;
+ right:0;
+ width:0%;
+ height:100%;
+ transition:width 1s;
+ display: flex;
+ .left{
+ width:30%;
+
+ }
+ .right{
+ width: 70%;
+ background: white
+ }
+
+}
+.show{
+ width: 100%
+}
+
+
+.container{
+ display: flex;
+ flex-wrap: wrap;
+ flex-direction: row;
+ .shop-item{
+ box-sizing:border-box;
+ width: 50%;
+ padding:5px;
+
+ }
+
+}
diff --git a/src/serviceAPI.config.js b/src/serviceAPI.config.js
index 622334a..b97f7f0 100644
--- a/src/serviceAPI.config.js
+++ b/src/serviceAPI.config.js
@@ -5,6 +5,7 @@ const URL = {
ShopWxStore: LOCALURL + 'Shop-wxStore', //商城首页信息
ShopSupplyShops: LOCALURL + 'Shop-supplyShops',// 商城店铺信息
GoodsSearch: LOCALURL + 'GoodsSearch-search',// 店铺页面的信息
+ FilterText: LOCALURL + 'GoodsSearch-getSearchParam',// sidebar筛选的字段
}