mqzheng/cf-wx-app
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

double check all pages and marked down changes on notebook

Browse Source
This commit is contained in:
郑茂强 2018-12-10 17:38:17 +08:00
parent 03f91e217e
commit da14bd8f2d
19 changed files with 328 additions and 156 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/component/filteredShopComponent/filteredShopComponent.js
View File

@ -44,7 +44,7 @@ class recommondShop extends Component {
const slicedGoods = goods !==null?goods.slice(1):null const slicedGoods = goods !==null?goods.slice(1):null
const goodsElementsArray = goods !== null ? slicedGoods.map((item,index)=>{ const goodsElementsArray = goods !== null ? slicedGoods.map((item,index)=>{
return <View className='goods-img-box' key={index}> return <View className='goods-img-box' key={index}>
<Image className='goods-img' src={URL.Base+item.goods_url} /> <Image className='goods-img' onClick={this.goToShop.bind(this, this.props.shop)} mode='aspectFit' style='max-height: 100%; max-width: 100%;'src={URL.Base+item.goods_url} />
</View> </View>
}):null }):null
return ( return (
@ -62,7 +62,7 @@ class recommondShop extends Component {
</View> </View>
<View className='body'> <View className='body'>
<View className='shop-img' onClick={this.goToShop.bind(this, this.props.shop)}> <View className='shop-img' onClick={this.goToShop.bind(this, this.props.shop)}>
<Image src={imgUrl}/> <Image mode='aspectFit' style=' max-height: 100%; max-width: 100%;' src={imgUrl}/>
</View> </View>
{goods.length !== 1 ? goodsElementsArray:<View className='details'> {goods.length !== 1 ? goodsElementsArray:<View className='details'>
<View className='details-block'><Text className='details-text'>商品:</Text> <Text>{ProductName}</Text></View> <View className='details-block'><Text className='details-text'>商品:</Text> <Text>{ProductName}</Text></View>

19
src/component/filteredShopComponent/filteredShopComponent.scss
View File

@ -48,34 +48,33 @@
.body{ .body{
border-bottom:1px solid #F2F2F2; border-bottom:1px solid #F2F2F2;
display: flex; display: flex;
flex-wrap: nowrap;
font-size: 35px; font-size: 35px;
.shop-img{ .shop-img{
padding: 20px; margin:20px;
Image{ text-align: center;
height: 200px; height: 200px;
width: 200px; width: 200px;
}
} }
.details{ .details{
font-size: 30px; font-size: 30px;
margin-left: 30px; margin-left: 30px;
.details-block{ .details-block{
margin-top: 30px; margin-top: 30px;
.details-text{ .details-text{
font-weight: bold; font-weight: bold;
} }
} }
} }
.goods-img-box{ .goods-img-box{
display: flex; flex:1;
flex-wrap: nowrap;
margin-top: 20px; margin-top: 20px;
.goods-img{ .goods-img{
border: 1px solid #ddd; border: 1px solid #ddd;
width: 80px; width: 90px;
height: 80px; height: 90px;
margin: 10px margin: 10px
} }
} }

6
src/component/searchBarComponent/searchBarComponent.js
View File

@ -8,12 +8,14 @@ import './searchBarComponent.scss'
class searchBarComponent extends Component { class SearchBarComponent extends Component {
config = { config = {
navigationBarTitleText: 'searchBarComponent' navigationBarTitleText: 'searchBarComponent'
} }
constructor() { constructor() {
super(...arguments) super(...arguments)
this.state = { this.state = {
value: '' value: ''
@ -41,4 +43,4 @@ class searchBarComponent extends Component {
} }
} }
export default searchBarComponent export default SearchBarComponent

10
src/component/searchBarComponent/searchBarComponent.scss
View File

@ -1,10 +1,8 @@
.searchBarComponent{ .search-button{
.at-search-bar__action{
background-color: #FF9900
}
.search-button{
.at-search-bar__action {
background-color:#FF9900;
}
}
} }

19
src/component/shopItemComponent/shopItemComponent.js
View File

@ -16,18 +16,20 @@ class ShopItem extends Component {
url: '/pages/goods/goods?id=123&name=michael' url: '/pages/goods/goods?id=123&name=michael'
}) })
} }
render() { render() {
const imgURL =this.props.item? URL.Base +this.props.item.goods_url:null 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 newPrice = this.props.item ? this.props.item.goods_price : null
const oldPrice = this.props.item ? this.props.item.goods_org_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 name = this.props.item ? this.props.item.goods_name : null
const browseTimes = this.props.item ? this.props.item.browse_times : null const browseTimes = this.props.item ? this.props.item.browse_times : null
const goodType = this.props.item ? this.props.item.goods_type_name:null
return ( return (
<View className='shopitem-box' onClick={this.shopOnClickHanlder.bind(this)}> <View className='shopitem-box' onClick={this.shopOnClickHanlder.bind(this)}>
<View className='goods-type'>
{goodType}
</View>
<View className='image-box'> <View className='image-box'>
<Image className='img' src={imgURL}/> <Image mode='aspectFit' style=' max-height: 100%; max-width: 100%;' className='img' src={imgURL}/>
</View> </View>
<View className='price-box'> <View className='price-box'>
<Text class='new-price'>￥{newPrice+' '}</Text> <Text class='new-price'>￥{newPrice+' '}</Text>
@ -40,15 +42,14 @@ class ShopItem extends Component {
<View className='addon-box'> <View className='addon-box'>
<View className='basket'> <View className='basket'>
<Image src={cartIcon} style='width:12px; height:12px;'/> <Image src={cartIcon} style='width:12px; height:12px;vertical-align:middle;'/>
<Text className='title'>0</Text> <Text className='amount'>0</Text>
</View> </View>
|
<View className='browse-time'> <View className='browse-time'>
<Image src={eyeIcon} style='width:12px; height:12px;' /> <Image src={eyeIcon} style='width:12px; height:12px;vertical-align:middle;' />
<Text className='title' >{browseTimes}</Text> <Text className='amount' >{browseTimes}</Text>
</View> </View>
</View> </View>
</View> </View>

42
src/component/shopItemComponent/shopItemComponent.scss
View File

@ -2,18 +2,29 @@
.shopitem-box{ .shopitem-box{
padding:5%; padding:5%;
border:1px solid #eee; border:1px solid #eee;
position: relative;
box-shadow: 0 10px 10px #ddd;
border-radius: 6px;
.goods-type{
position: absolute;
top:0;
right: 0;
font-size: 25px;
padding: 0 10px;
background: #999;
color: #fff;
}
.image-box{ .image-box{
text-align: center; text-align: center;
.img{ height: 400px;
width: 80%; width: 100%;
height:400px;
}
} }
.price-box{ .price-box{
font-weight: bold;
.new-price{ .new-price{
color:red; color:#c00;
font-size: 28px font-size: 30px
} }
.old-price{ .old-price{
color:#999; color:#999;
@ -22,26 +33,35 @@
} }
} }
.itemname-box{ .itemname-box{
border-bottom: 1px solid #DADADA;
margin-top: 10px;
.name{ .name{
font-size: 30px font-size: 30px;
} }
} }
.addon-box{ .addon-box{
display: flex; display: flex;
font-size: 30px; font-size: 30px;
margin-top: 10px; margin-top: 10px;
color: #999;
.basket{ .basket{
margin:0 5px; margin:0 5px;
.title{
margin-left: 5px .amount{
color:#c49173;
margin-left: 5px;
vertical-align:middle;
} }
} }
.browse-time{ .browse-time{
margin:0 5px; margin:0 5px;
.title{
margin-left: 5px .amount{
margin-left: 5px;
vertical-align:middle;
} }
} }

100
src/pages/goods/goods.js
View File

@ -1,8 +1,10 @@
import Taro, { Component } from '@tarojs/taro' import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text, Image } from '@tarojs/components' import { View, Button, Text, Image } from '@tarojs/components'
import { AtSearchBar, AtTabs, AtTabsPane,AtSegmentedControl } from 'taro-ui' import { AtSearchBar, AtTabs, AtTabsPane, AtSegmentedControl, AtIcon, AtToast ,Picker } from 'taro-ui'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent' import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
import SearchBarComponent from '../../component/searchBarComponent/searchBarComponent'
import URL from '../../serviceAPI.config'
import './goods.scss' import './goods.scss'
@ -20,6 +22,9 @@ class Goods extends Component {
value:'', value:'',
current: 0, current: 0,
subCurrent:0, subCurrent:0,
isOpened:false,
selector: ['0', '1', '2', '3'],
selectorChecked: '0',
}} }}
@ -29,12 +34,24 @@ class Goods extends Component {
current: value current: value
}) })
} }
subHandleClick(value) { onClick(value) {
this.setState({ this.setState({
subCurrent: value subCurrent: value
}) })
} }
goShopPage(){
Taro.navigateTo({
url: '/pages/shop/shop'
})
}
saveItem(){
this.setState({isOpened:true})
}
onChange = e => {
this.setState({
selectorChecked: this.state.selector[e.detail.value]
})
}
componentDidMount() { componentDidMount() {
} }
@ -54,16 +71,9 @@ class Goods extends Component {
return ( return (
<View className='gooods=container'> <View className='gooods=container'>
<View className='searchBar-box'> <SearchBarComponent></SearchBarComponent>
<AtSearchBar className='search-button'
actionName='搜索'
value={this.state.value}
onChange={this.onChange.bind(this)}
onActionClick={this.onActionClick.bind(this)}
/>
</View>
<View className='img-box'> <View className='img-box'>
<Image className='img' src='http://192.168.1.230/Uploads/zone/user_1041/201808/thumb/e10a0bfea09a3078a800af8054bc80ce_400X400.jpg'></Image> <Image className='img' src={URL.Base + 'Uploads/zone/user_1041/201808/thumb/e10a0bfea09a3078a800af8054bc80ce_400X400.jpg'}></Image>
</View> </View>
<View className='title-box'> <View className='title-box'>
@ -111,54 +121,67 @@ class Goods extends Component {
</View> </View>
</View> </View>
<View className='standard-box'> <View className='standard-box'>
<View className='title'> {/* <View className='title'>
可选规格 可选规格
</View> </View>
<View className='more'> <View className='more'>
>点击 >点击
</View> */}
<Picker mode='selector' range={this.state.selector} onChange={this.onChange}>
<View className='picker'>
<View className='title'>
可选规格:
</View> </View>
<View className='more'>
{this.state.selectorChecked}
</View>
</View>
</Picker>
</View> </View>
<View className='details-box'> <View className='details-box'>
<AtTabs color='green' current={this.state.current} tabList={mainTabList} onClick={this.handleClick.bind(this)}> <AtTabs color='#FF9500' className='alltabs' animated={false} current={this.state.current} tabList={mainTabList} onClick={this.handleClick.bind(this)}>
<AtTabsPane current={this.state.current} index={0} > <AtTabsPane current={this.state.current} index={0} >
<View style='padding: 100px 50px;background-color: #FAFBFC;text-align: center;' >标签页一的内容</View> <View style='padding: 100px 50px;background-color: #FAFBFC;text-align: center;' >商品细节：</View>
</AtTabsPane> </AtTabsPane>
<AtTabsPane current={this.state.current} index={1}> <AtTabsPane current={this.state.current} index={1}>
<View style='padding: 1px 0px 100px;background-color: #FAFBFC;text-align: center;'> <View style='padding: 1px 0px 100px;background-color: #FAFBFC;text-align: center;'>
{ /*子标签Tab*/} { /*子标签Tab*/}
<AtSegmentedControl <AtSegmentedControl selectedColor='#FF9500'
values={['全部', '好评', '中评', '差评', '公开','匿名']} values={['全部', '好评', '中评', '差评', '公开','匿名']}
onClick={this.subHandleClick.bind(this)} onClick={this.onClick.bind(this)}
current={this.state.subCurrent} current={this.state.subCurrent}
/> />
{ {
this.state.current === 0 this.state.subCurrent === 0
? <View className='tab-content'>标签1的内容</View> ? <View className='tab-content'>
<Text className='title'>全部</Text>
</View>
: null : null
} }
{ {
this.state.current === 1 this.state.subCurrent === 1
? <View className='tab-content'>标签2的内容</View> ? <View className='tab-content'>好评</View>
: null : null
} }
{ {
this.state.current === 2 this.state.subCurrent === 2
? <View className='tab-content'>标签3的内容</View> ? <View className='tab-content'>中评</View>
: null : null
} }
{ {
this.state.current === 3 this.state.subCurrent === 3
? <View className='tab-content'>标签4的内容</View> ? <View className='tab-content'>差评</View>
: null : null
} }
{ {
this.state.current === 4 this.state.subCurrent === 4
? <View className='tab-content'>标签5的内容</View> ? <View className='tab-content'>公开</View>
: null : null
} }
{ {
this.state.current === 5 this.state.subCurrent === 5
? <View className='tab-content'>标签6的内容</View> ? <View className='tab-content'>匿名</View>
: null : null
} }
@ -175,11 +198,18 @@ class Goods extends Component {
<View className='shop-bottom-box' > <View className='shop-bottom-box' >
<View className='shop-bottom-nav'> <View className='shop-bottom-nav'>
<View className='to-shop'> <View className='to-shop' onClick={this.goShopPage.bind(this)}>
进店 <AtIcon className='icon' value='home' size='12' color='black'></AtIcon>
<Text className='title'>进店</Text>
</View> </View>
<View className='collection'> <View className='collection' onClick={this.saveItem.bind(this)}>
收藏商品 <AtIcon className='icon' value='heart' size='12' color='white'></AtIcon>
<AtToast
isOpened={this.state.isOpened}
duration={1000}
text='收藏成功'
></AtToast>
<Text className='title'>收藏商品</Text>
</View> </View>
<View className='add-cart'> <View className='add-cart'>
加入购物车 加入购物车
@ -187,8 +217,6 @@ class Goods extends Component {
</View> </View>
</View> </View>
</View> </View>
) )
} }

32
src/pages/goods/goods.scss
View File

@ -3,7 +3,7 @@
.img-box{ .img-box{
border: 1px solid #ddd; border: 1px solid #ddd;
padding: 5px 0; padding: 20px 0;
text-align: center; text-align: center;
.img{ .img{
height: 700px; height: 700px;
@ -48,7 +48,8 @@
} }
.price{ .price{
font-size: 40px; font-size: 40px;
color:red color: #c00;
} }
} }
} }
@ -72,6 +73,7 @@
} }
.counter-box{ .counter-box{
width: 100%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex-wrap: nowrap; flex-wrap: nowrap;
@ -84,7 +86,7 @@
.amount{ .amount{
display: inline-block; display: inline-block;
margin-left: 20px; margin-left: 20px;
color:red; color: #c00;
font-weight: bold font-weight: bold
} }
} }
@ -93,14 +95,16 @@
} }
} }
.standard-box{ .standard-box{
border: 1px solid #ddd;
.picker{
border: 1px solid #ddd;
padding: 10px 0; padding: 10px 0;
color:#999; color:#999;
font-size: 25px; font-size: 25px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex-wrap: nowrap; flex-wrap: nowrap;
.title{ .title{
flex:1; flex:1;
font-weight: bold; font-weight: bold;
margin-left: 20px; margin-left: 20px;
@ -113,6 +117,9 @@
margin-right: 20px; margin-right: 20px;
} }
}
} }
.copyright-box{ .copyright-box{
@ -137,8 +144,8 @@
flex-wrap: nowrap; flex-wrap: nowrap;
flex-direction: row; flex-direction: row;
text-align: center; text-align: center;
height: 60px; height: 90px;
line-height: 60px; line-height: 90px;
font-size: 30px; font-size: 30px;
.to-shop{ .to-shop{
@ -151,6 +158,13 @@
flex:1; flex:1;
background-color: #FF9500; background-color: #FF9500;
color: white; color: white;
.icon{
vertical-align: middle
}
.title{
display: inline-block;
margin-left: 10px;
}
} }
.add-cart{ .add-cart{
@ -159,7 +173,5 @@
color: white; color: white;
} }
} }
} }

50
src/pages/goodsPublish/goodsPublish.js
View File

@ -1,7 +1,8 @@
import Taro, { Component } from '@tarojs/taro' import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text, Input, Radio, RadioGroup, Label } from '@tarojs/components' import { View, Button, Text, Input, Radio, RadioGroup, Label } from '@tarojs/components'
import { AtInput, AtForm, AtImagePicker, AtTextarea, AtRadio, AtButton } from 'taro-ui' import { AtInput, AtForm, AtImagePicker, AtTextarea, AtRadio, AtButton, Picker } from 'taro-ui'
import SearchBarComponent from '../../component/searchBarComponent/searchBarComponent'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent' import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
@ -15,6 +16,8 @@ class GoodsPublish extends Component {
constructor() { constructor() {
super(...arguments) super(...arguments)
this.state = { this.state = {
selector: ['需求', '供应', '人才'],
selectorChecked: '需求',
files: [{ files: [{
url: 'https://jimczj.gitee.io/lazyrepay/aragaki1.jpeg', url: 'https://jimczj.gitee.io/lazyrepay/aragaki1.jpeg',
}, },
@ -49,7 +52,11 @@ class GoodsPublish extends Component {
] ]
} }
} }
onChange1 = e => {
this.setState({
selectorChecked: this.state.selector[e.detail.value]
})
}
onChange(files) { onChange(files) {
this.setState({ this.setState({
files files
@ -75,21 +82,37 @@ class GoodsPublish extends Component {
render() { render() {
return ( return (
<View className='goods-publish'> <View className='goods-publish'>
<SearchBarComponent></SearchBarComponent>
<View className='goods-category'> <View className='goods-category'>
<View className='page-section'>
<View className='border-box'> <View>
<Picker mode='selector' range={this.state.selector} onChange1={this.onChange}>
<View className='picker'>
<View className='title-box'>
<Text className='title'><Text className='require'>*</Text>商品分类:</Text> <Text className='selected'>{this.state.selectorChecked}</Text>
</View>
</View>
</Picker>
</View>
</View>
<View className='input-box'>
<Text className='require'>*</Text>
<AtInput <AtInput
name='value' name='value'
title='商品类型：' title='商品名称：'
type='text' type='text'
value={this.state.value} value={this.state.value}
onChange={this.handleChange.bind(this)} onChange={this.handleChange.bind(this)}
/> />
</View> </View>
<View className='input-box'>
<Text className='require'>*</Text>
<AtInput <AtInput
name='value' name='value'
title='商品价格：' title='商品价格：'
@ -98,6 +121,9 @@ class GoodsPublish extends Component {
value={this.state.value} value={this.state.value}
onChange={this.handleChange.bind(this)} onChange={this.handleChange.bind(this)}
/> />
</View>
<View className='input-box'>
<Text className='require'>*</Text>
<AtInput <AtInput
name='value' name='value'
title='商品单位：' title='商品单位：'
@ -105,8 +131,12 @@ class GoodsPublish extends Component {
value={this.state.value} value={this.state.value}
onChange={this.handleChange.bind(this)} onChange={this.handleChange.bind(this)}
/> />
</View>
<View className='img-box'> <View className='img-box'>
<View className='title-box'> <View className='title-box'>
<Text className='require'>*</Text>
<Text className='title'>上传图片:</Text> <Text className='title'>上传图片:</Text>
</View> </View>
@ -123,9 +153,11 @@ class GoodsPublish extends Component {
</View> </View>
</View> </View>
<View className='shoptype-box'> <View className='shoptype-box'>
<View className='title-box'> <View className='title-box'>
<Text className='title'>商品分类:</Text> <Text className='require'>*</Text>
<Text className='title'>店铺分类:</Text>
</View> </View>
<View className='shoptype-container'> <View className='shoptype-container'>
<View className='title-box'> <View className='title-box'>
@ -194,10 +226,10 @@ class GoodsPublish extends Component {
<AtButton type='primary' size='small'>发布</AtButton> <AtButton type='primary' size='small'>发布</AtButton>
</View> </View>
<View className='button'> <View className='button'>
<AtButton type='primary' size='small'>发布并新增</AtButton> <AtButton type='primary' className='button-a' size='small'>发布并新增</AtButton>
</View> </View>
<View className='button'> <View className='button'>
<AtButton type='primary' size='small'>商品列表</AtButton> <AtButton type='primary' className='button-a' size='small'>商品列表</AtButton>
</View> </View>

22
src/pages/goodsPublish/goodsPublish.scss
View File

@ -80,5 +80,27 @@
} }
.button-a{
background-color:#5cb85c;
border:1PX solid #5cb85c;
}
} }
} }
.page-section{
border-bottom: 1Px solid #d6e4ef;
}
.selected{
display: inline-block;
margin-left: 20%;
font-size: 32rpx
}
.input-box{
border-bottom: 1Px solid #d6e4ef;
display: flex;
}
.require{
color:red;
line-height:100rpx;
}

35
src/pages/home/home.js
View File

@ -18,6 +18,7 @@ class Home extends Component {
shopsDetails: '', shopsDetails: '',
ads: '', ads: '',
categories: '', categories: '',
subCate:[],
demanding: '', demanding: '',
otherData:'' otherData:''
} }
@ -110,7 +111,7 @@ class Home extends Component {
{item.sd_title} {item.sd_title}
</View> </View>
<View className='item-address'> <View className='item-address'>
{item.user_address} {item.user_address||'无地址'}
</View> </View>
<View className='item-name'> <View className='item-name'>
业主：{item.user_name} 业主：{item.user_name}
@ -124,20 +125,20 @@ class Home extends Component {
const adsImgElementsArray = this.state.ads?this.state.ads.map((item, index) => { const adsImgElementsArray = this.state.ads?this.state.ads.map((item, index) => {
return <SwiperItem key={index}> return <SwiperItem key={index}>
<Image className='banner-img' src={URL.Base + item.ads_pic} /> <Image className='banner-img' src={URL.Base + item.ads_pic} />
</SwiperItem> </SwiperItem>
}):null }):null
// 这里应该代码可以优化----- // 这里应该代码可以优化-----
const categoriesElementsArray1 = this.state.categories?this.state.categories[0].map((item, index) => { const categoriesElementsArray1 = this.state.categories?this.state.categories[0].map((item, index) => {
return <View className='category-item' key={index} onClick={this.onClickParentCate.bind(this, item)}> return <View className='category-item' key={index} onClick={this.onClickParentCate.bind(this, item)}>
<View> <Image style='height: 42px;width: 42px;' className='cate-img' src={URL.Base + item.icon} /></View> <Image className='cate-img' src={URL.Base + item.icon} />
<View>{item.class_name}</View> <View>{item.class_name}</View>
</View> </View>
}):null }):null
const categoriesElementsArray2 = this.state.categories?this.state.categories[1].map((item, index) => { const categoriesElementsArray2 = this.state.categories?this.state.categories[1].map((item, index) => {
return <View className='category-item' key={index} onClick={this.onClickParentCate.bind(this, item)}> return <View className='category-item' key={index} onClick={this.onClickParentCate.bind(this, item)}>
<View> <Image style='height: 42px;width: 42px;' className='cate-img' src={URL.Base + item.icon} /></View> <View> <Image className='cate-img' src={URL.Base + item.icon} /></View>
<View>{item.class_name}</View> <View>{item.class_name}</View>
</View> </View>
}):null }):null
@ -145,22 +146,22 @@ class Home extends Component {
return <filteredShopComponent shop={item} key={index}></filteredShopComponent> return <filteredShopComponent shop={item} key={index}></filteredShopComponent>
}):null }):null
const subCateElementsArray = this.state.subCate?this.state.subCate.map((item, index) => { const subCateElementsArray = this.state.subCate.length?this.state.subCate.map((item, index) => {
return <SwiperItem key={index} onClick={this.onClickChildCate.bind(this, item)}> return <SwiperItem key={index} onClick={this.onClickChildCate.bind(this, item)}>
<View className='text'>{item.class_name}</View> <View className='text'>{item.class_name}</View>
</SwiperItem> </SwiperItem>
}):null }):null
console.log(this.state.subCate)
return ( return (
<View className='home'> <View className='home'>
{/* 第一行图片滚动条 */} {/* 第一行图片滚动条 */}
<View className='first-banner'> <View className='first-banner'>
<Swiper <Swiper
className='swipper' className='swipper'
style='height:120px;'
indicatorColor='#999' indicatorColor='#999'
indicatorActiveColor='#333' indicatorActiveColor='#333'
hotizontal hotizontal
@ -180,7 +181,8 @@ class Home extends Component {
hotizontal hotizontal
circular circular
indicatorDots indicatorDots
autoplay> // autoplay
>
<SwiperItem> <SwiperItem>
<View className='categories'> <View className='categories'>
{categoriesElementsArray1} {categoriesElementsArray1}
@ -196,6 +198,7 @@ class Home extends Component {
{/* 第三行图片滚动条 */} {/* 第三行图片滚动条 */}
<View className='third-banner'> <View className='third-banner'>
<Swiper <Swiper
style='height:100px;'
className='swipper' className='swipper'
indicatorColor='#999' indicatorColor='#999'
indicatorActiveColor='#333' indicatorActiveColor='#333'
@ -204,7 +207,10 @@ class Home extends Component {
indicatorDots indicatorDots
autoplay> autoplay>
<SwiperItem> <SwiperItem>
<Image className='banner-img' src='http://192.168.1.230/Public/images/xgt.png' /> <Image className='banner-img' src={URL.Base +'Public/images/xgt.png'} />
</SwiperItem>
<SwiperItem>
<Image className='banner-img' src={URL.Base +'Public/images/xgt.png'} />
</SwiperItem> </SwiperItem>
</Swiper> </Swiper>
@ -233,19 +239,18 @@ class Home extends Component {
{demandingElemensArray} {demandingElemensArray}
</Swiper> </Swiper>
</View> </View>
<View className='sub-cate'>
</View> <View className='second-banner-level2'>
<View className='second-banner-level2'> {this.state.subCate.length ? <Swiper
<Swiper style='height:35px;'
className='swipper swiper-sub' className='swipper swiper-sub'
indicatorColor='#999' indicatorColor='#999'
indicatorActiveColor='#333' indicatorActiveColor='#333'
horizontal horizontal
displayMultipleItems='4.5' displayMultipleItems={this.state.subCate.length > 4.5 ? 4.5 : this.state.subCate.length}
> >
{subCateElementsArray} {subCateElementsArray}
</Swiper> </Swiper>:null}
</View> </View>
<View className='title'> <View className='title'>
<Text className='title-block'></Text> <Text className='title-block'></Text>

26
src/pages/home/home.scss
View File

@ -1,8 +1,13 @@
.home{ .home{
overflow: hidden; overflow: hidden;
.banner-img{ .first-banner ,.third-banner{
width: 100% .banner-img{
height: 100%;
width: 100%;
} }
}
} }
@ -110,27 +115,32 @@
flex-wrap: wrap; flex-wrap: wrap;
flex-direction: row; flex-direction: row;
text-align: center; text-align: center;
font-size:30px; font-size:28px;
margin-top: 10px;
.category-item{ .category-item{
width: 20%; width: 20%;
margin-top: 20px; height: 50%;
margin-top: 10px;
Image{
height: 75px;
width: 75px;
}
} }
} }
} }
.second-banner-level2{ .second-banner-level2{
.swipper{ .swipper{
height: 80px;
text-align: center; text-align: center;
font-size: 30px; font-size: 30px;
border-bottom:1px solid #F2F2F2; border-bottom:1px solid #F2F2F2;
.text{ .text{
margin-top: 20px margin-top: 20px
} }
} }
} }
.swipper{
margin-bottom: 20px;
}
.swiper-sub{ .swiper-sub{
margin-bottom: 0px; margin-bottom: 0px;
} }

5
src/pages/index/index.js
View File

@ -21,7 +21,6 @@ import './index.scss'
} }
})) }))
class Index extends Component { class Index extends Component {
config = { config = {
navigationBarTitleText: '首页' navigationBarTitleText: '首页'
} }
@ -29,7 +28,9 @@ class Index extends Component {
//http://ihome6.com/Shop-supplyShops //http://ihome6.com/Shop-supplyShops
componentDidMount(){ componentDidMount(){
Taro.navigateTo({ Taro.navigateTo({
url: '/pages/home/home' // url: '/pages/home/home'
// url: '/pages/goodsPublish/goodsPublish'
url: '/pages/goods/goods'
}) })
} }
componentWillReceiveProps (nextProps) { componentWillReceiveProps (nextProps) {

4
src/pages/mySupplyDemand/mySupplyDemand.js
View File

@ -125,7 +125,7 @@ class MySupplyDemand extends Component {
搜索</AtButton> 搜索</AtButton>
</View> </View>
<View className='button'> <View className='button'>
<AtButton type='primary' size='small'> <AtButton type='primary' className='button-a' size='small'>
<AtIcon value='add' size='12' color='white'></AtIcon> <AtIcon value='add' size='12' color='white'></AtIcon>
新增</AtButton> 新增</AtButton>
</View> </View>
@ -166,7 +166,7 @@ class MySupplyDemand extends Component {
<AtButton type='primary' size='small'>编辑</AtButton> <AtButton type='primary' size='small'>编辑</AtButton>
</View> </View>
<View className='button'> <View className='button'>
<AtButton type='primary' size='small'>删除</AtButton> <AtButton type='primary' className='button-a' size='small'>删除</AtButton>
</View> </View>
</View> </View>

13
src/pages/mySupplyDemand/mySupplyDemand.scss
View File

@ -73,8 +73,11 @@
.at-button--primary{ .at-button--primary{
background-color:#FF9500; background-color:#FF9500;
border:1PX solid #FF9500; border:1PX solid #FF9500;
}
.button-a{
background-color:#5cb85c;
border:1PX solid #5cb85c;
} }
} }
} }
@ -88,6 +91,9 @@
View{ View{
margin:10px margin:10px
} }
.demand-title{
.info{color:#337ab7; }
}
.info-button-box{ .info-button-box{
display: flex; display: flex;
flex-wrap: nowrap; flex-wrap: nowrap;
@ -103,6 +109,11 @@
background-color:#FF9500; background-color:#FF9500;
border:1PX solid #FF9500; border:1PX solid #FF9500;
} }
.button-a{
background-color:#d9534f;
border:1PX solid #d9534f;
}
} }
} }

6
src/pages/shop/shop.js
View File

@ -23,7 +23,7 @@ class Shop extends Component {
FilterText:'', FilterText:'',
filterBar:['综合排序','销量','新品','价格','人气'], filterBar:['综合排序','销量','新品','价格','人气'],
selectedFilterValue:0, selectedFilterValue:0,
isShowFilter:true, isShowFilter:false,
综合排序:true, 综合排序:true,
销量:false, 销量:false,
新品:false, 新品:false,
@ -266,8 +266,8 @@ class Shop extends Component {
/> />
</View> </View>
<View className='banner-box'> <View className='banner-box'>
<Image src={URL.Base + 'Public/visual_editing/img/ksh_bg.jpg'} style='height:120px' /> <Image src={URL.Base + 'Public/visual_editing/img/ksh_bg.jpg'} mode='aspectFill' style='height:120px' />
<View className='shop-name'>{shopName}</View> {/* <View className='shop-name'>{shopName}</View> */}
</View> </View>
<View className='nav-box'> <View className='nav-box'>
<View className='nav'> <View className='nav'>

3
src/pages/shop/shop.scss
View File

@ -15,7 +15,6 @@
font-size: 50px font-size: 50px
} }
} }
.nav-box{ .nav-box{
background-color: black; background-color: black;
@ -115,7 +114,7 @@
.shop-item{ .shop-item{
box-sizing:border-box; box-sizing:border-box;
width: 50%; width: 50%;
padding:5px; padding:10px;
} }

70
src/pages/supplyDemandPubish/supplyDemandPubish.js
View File

@ -2,6 +2,8 @@
import Taro, { Component } from '@tarojs/taro' import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text } from '@tarojs/components' import { View, Button, Text } from '@tarojs/components'
import { AtInput, AtForm, AtImagePicker, AtTextarea, AtRadio, AtButton, Picker} from 'taro-ui' import { AtInput, AtForm, AtImagePicker, AtTextarea, AtRadio, AtButton, Picker} from 'taro-ui'
import SearchBarComponent from '../../component/searchBarComponent/searchBarComponent'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent' import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
@ -21,20 +23,52 @@ class SupplyDemand extends Component {
selectorChecked: '需求', selectorChecked: '需求',
selector1: ['上架', '下架'], selector1: ['上架', '下架'],
selectorChecked1: '上架', selectorChecked1: '上架',
addImg:true,
files: [{
url: 'https://jimczj.gitee.io/lazyrepay/aragaki1.jpeg',
},
{
url: 'https://jimczj.gitee.io/lazyrepay/aragaki2.jpeg',
},
{
url: 'https://jimczj.gitee.io/lazyrepay/aragaki3.png',
}]
} }
} }
onChange = e => { // onChange = e => {
this.setState({ // this.setState({
selectorChecked: this.state.selector[e.detail.value] // selectorChecked: this.state.selector[e.detail.value]
}) // })
} // }
onChange1 = e => { onChange1 = e => {
this.setState({ this.setState({
selectorChecked1: this.state.selector1[e.detail.value] selectorChecked1: this.state.selector1[e.detail.value]
}) })
} }
onChange(files, operationType,index) {
console.log(files, operationType,index)
if (operationType==='add'){
this.setState({
files
}, () => {
if (this.state.files.length === 4) {
this.setState({ addImg: false })
}
})
}
if (operationType === 'remove'){
this.state.files.splice(index, 1);
this.setState({ files: this.state.files });
}
}
onFail(mes) {
console.log(mes)
}
onImageClick(index, file) {
console.log(index, file)
}
componentWillReceiveProps(nextProps) { componentWillReceiveProps(nextProps) {
console.log(this.props, nextProps) console.log(this.props, nextProps)
} }
@ -48,6 +82,7 @@ class SupplyDemand extends Component {
render() { render() {
return ( return (
<View className='supply-demand'> <View className='supply-demand'>
<SearchBarComponent></SearchBarComponent>
<View className='page-section'> <View className='page-section'>
<View> <View>
@ -92,16 +127,13 @@ class SupplyDemand extends Component {
onChange={this.handleChange.bind(this)} onChange={this.handleChange.bind(this)}
/> />
</View> </View>
<View className='address-box'> <View className='demanding-box'>
<View className='title-box'>
<Text className='title'>联系地址:</Text>
</View>
<AtTextarea <AtTextarea
value={this.state.value} value={this.state.value}
onChange={this.handleChange.bind(this)} onChange={this.handleChange.bind(this)}
maxlength='200' maxlength='200'
placeholder='你的产品简介' placeholder='联系地址'
/> />
</View> </View>
@ -114,7 +146,7 @@ class SupplyDemand extends Component {
value={this.state.value} value={this.state.value}
onChange={this.handleChange.bind(this)} onChange={this.handleChange.bind(this)}
maxlength='200' maxlength='200'
placeholder='你的产品简介' placeholder=''
/> />
</View> </View>
@ -125,13 +157,12 @@ class SupplyDemand extends Component {
</View> </View>
<View className='img-container'> <View className='img-container'>
<AtImagePicker <AtImagePicker
multiple showAddBtn={this.state.addImg}
files={this.state.files} files={this.state.files}
onChange={this.onChange.bind(this)} onChange={this.onChange.bind(this)}
onFail={this.onFail.bind(this)} onFail={this.onFail.bind(this)}
onImageClick={this.onImageClick.bind(this)} onImageClick={this.onImageClick.bind(this)}
/> />
</View> </View>
@ -156,10 +187,11 @@ class SupplyDemand extends Component {
<AtButton type='primary' size='small'>发布</AtButton> <AtButton type='primary' size='small'>发布</AtButton>
</View> </View>
<View className='button'> <View className='button'>
<AtButton type='primary' size='small'>发布并新增</AtButton>
<AtButton type='primary' className='button-a' size='small'>发布并新增</AtButton>
</View> </View>
<View className='button'> <View className='button'>
<AtButton type='primary' size='small'>商品列表</AtButton> <AtButton type='primary' className='button-a' size='small'>商品列表</AtButton>
</View> </View>

10
src/pages/supplyDemandPubish/supplyDemandPubish.scss
View File

@ -30,8 +30,10 @@
.at-button--primary{ .at-button--primary{
background-color:#FF9500; background-color:#FF9500;
border:1PX solid #FF9500; border:1PX solid #FF9500;
}
.button-a{
background-color:#5cb85c;
border:1PX solid #5cb85c;
} }
} }
} }
@ -57,9 +59,7 @@
} }
.page-section{ .page-section{
border-bottom: 1Px solid #d6e4ef; border-bottom: 1Px solid #d6e4ef;
.picker{
padding: 24rpx 0
}
} }
.selected{ .selected{
display: inline-block; display: inline-block;