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

所有修改

Browse Source
This commit is contained in:
郑茂强 2018-12-11 17:34:06 +08:00
parent da14bd8f2d
commit 161862d12f
13 changed files with 295 additions and 224 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app.js
View File

@ -23,7 +23,7 @@ class App extends Component {
'pages/shop/shop', 'pages/shop/shop',
'pages/goods/goods', 'pages/goods/goods',
'pages/goodsPublish/goodsPublish', 'pages/goodsPublish/goodsPublish',
'pages/supplyDemandPubish/supplyDemandPubish', 'pages/supplyDemandPublish/supplyDemandPublish',
'pages/mySupplyDemand/mySupplyDemand', 'pages/mySupplyDemand/mySupplyDemand',
'pages/allDemanding/allDemanding', 'pages/allDemanding/allDemanding',
], ],

79
src/pages/allDemanding/allDemanding.js
View File

@ -17,14 +17,14 @@ class AllDemanding extends Component {
constructor() { constructor() {
super(...arguments) super(...arguments)
this.state = { this.state = {
supplys:[], supplys:[], // 需求列表
isMore:'more', isMore:'more', // 上拉加载状态
selector: ['全部', '需求', '供应', '人才'], demandingState: [ '需求', '供应', '人才'], // 供求状态选择
selectorChecked: '全部', demandingStateSelected:'全部', // 当前供求状态
selector1: ['全部', '上架', '下架'], industryCate: ['制定家具', '成品家具', '办公家具','设计'], // 行业分类状态选择
selectorChecked1: '全部', industryCateSelected: '全部', // 当前行业分类状态
dateSel: '2018-04-22', startDateSel: '2018-04-22',
endDateSel: '2018-04-22',
} }
} }
GetAllDemanding({ curr_page=1, page_count=20}) { GetAllDemanding({ curr_page=1, page_count=20}) {
@ -52,6 +52,8 @@ class AllDemanding extends Component {
} }
}) })
} }
// 向上拉升延迟一秒加载数据
handleLoadMore(){ handleLoadMore(){
this.setState({isMore:'loading'}) this.setState({isMore:'loading'})
setTimeout(() => { setTimeout(() => {
@ -59,17 +61,29 @@ class AllDemanding extends Component {
this.GetAllDemanding({ curr_page: currentPage }) this.GetAllDemanding({ curr_page: currentPage })
}, 1000); }, 1000);
} }
onChange = e => { // 改变需求选项
changeDemandingState = e => {
this.setState({ this.setState({
selectorChecked: this.state.selector[e.detail.value] demandingStateSelected: this.state.demandingState[e.detail.value]
}) })
} }
// 改变行业类别选项
onDateChange = e => { changeIndustryCate = e => {
this.setState({ this.setState({
dateSel: e.detail.value industryCateSelected: this.state.industryCate[e.detail.value]
})
}
//改变开始日期
onStartDateChange = e => {
this.setState({
startDateSel: e.detail.value
})
}
// 改变结束日期
onEndDateChange = e => {
this.setState({
endDateSel: e.detail.value
}) })
} }
@ -78,6 +92,7 @@ class AllDemanding extends Component {
console.log(this.props, nextProps) console.log(this.props, nextProps)
} }
componentDidMount(){ componentDidMount(){
// 得到第一页需求数据
this.GetAllDemanding({}) this.GetAllDemanding({})
} }
@ -93,7 +108,8 @@ class AllDemanding extends Component {
return <View className='demanding-info' key={index}> return <View className='demanding-info' key={index}>
<View className='header'> <View className='header'>
<View className='name'>业主:{item.user_name}</View> <AtIcon value='user' size='12' color='#2196F3'></AtIcon>
<View className='name'> 业主:{item.user_name}</View>
<View className='others'> <View className='others'>
<Text className='cate'>{item.class_name+' '} </Text> <Text className='cate'>{item.class_name+' '} </Text>
| |
@ -112,9 +128,7 @@ class AllDemanding extends Component {
<AtButton type='primary' size='small'> <AtButton type='primary' size='small'>
抢单</AtButton> 抢单</AtButton>
</View> </View>
</View> </View>
</View> </View>
<View className='footer'> <View className='footer'>
<View className='location'><AtIcon value='map-pin' size='12' color='black'></AtIcon>没有数据</View> <View className='location'><AtIcon value='map-pin' size='12' color='black'></AtIcon>没有数据</View>
@ -126,12 +140,12 @@ class AllDemanding extends Component {
return ( return (
<View className='allDemanding'> <View className='allDemanding'>
<View className='page-section'> <View className='page-section'>
{/* 供求状态选择 */}
<View> <View>
<Picker mode='selector' range={this.state.selector1} onChange={this.onChange1}> <Picker mode='selector' range={this.state.demandingState} onChange={this.changeDemandingState}>
<View className='picker'> <View className='picker'>
<View className='title-box'> <View className='title-box'>
<Text className='title'> <Text className='require'>*</Text>供求状态:</Text> <Text className='selected'>{this.state.selectorChecked1}</Text> <Text className='title'> <Text className='require'>*</Text>供求状态:</Text> <Text className='selected'>{this.state.demandingStateSelected}</Text>
</View> </View>
</View> </View>
@ -149,39 +163,33 @@ class AllDemanding extends Component {
onChange={this.handleChange.bind(this)} onChange={this.handleChange.bind(this)}
/> />
</View> </View>
{/* 开始和结束日期选择 */}
<View className='page-section'> <View className='page-section'>
<View className='picker-box'> <View className='picker-box'>
<Picker mode='date' className='picker-container' onChange={this.onDateChange}> <Picker mode='date' className='picker-container' onChange={this.onStartDateChange}>
<View className='picker'> <View className='picker'>
<View className='title-box'> <View className='title-box'>
<Text className='title'><Text className='require'>*</Text>开始日期:</Text> <Text className='selected'>{this.state.dateSel}</Text> <Text className='title'><Text className='require'>*</Text>开始日期:</Text> <Text className='selected'>{this.state.startDateSel}</Text>
</View> </View>
</View> </View>
</Picker> </Picker>
<Picker className='picker-container' mode='date' onChange={this.onDateChange}> <Picker className='picker-container' mode='date' onChange={this.onEndDateChange}>
<View className='picker'> <View className='picker'>
<View className='title-box'> <View className='title-box'>
<Text className='title'><Text className='require'>*</Text>结束日期:</Text> <Text className='selected'>{this.state.dateSel}</Text> <Text className='title'><Text className='require'>*</Text>结束日期:</Text> <Text className='selected'>{this.state.endDateSel}</Text>
</View> </View>
</View> </View>
</Picker> </Picker>
</View> </View>
</View> </View>
{/* 行业分类选择 */}
<View className='page-section'> <View className='page-section'>
<View> <View>
<Picker mode='selector' range={this.state.selector1} onChange={this.onChange1}> <Picker mode='selector' range={this.state.industryCate} onChange={this.changeIndustryCate}>
<View className='picker'> <View className='picker'>
<View className='title-box'> <View className='title-box'>
<Text className='title'> <Text className='require'>*</Text>供求状态:</Text> <Text className='selected'>{this.state.selectorChecked1}</Text> <Text className='title'> <Text className='require'>*</Text>行业分类:</Text> <Text className='selected'>{this.state.industryCateSelected}</Text>
</View> </View>
</View> </View>
</Picker> </Picker>
</View> </View>
@ -193,7 +201,8 @@ class AllDemanding extends Component {
搜索</AtButton> 搜索</AtButton>
</View> </View>
</View> </View>
<View className='demanding-box' > {/* 供求页面的数据加载 */}
<View className='demanding-box'>
{allDemandingElementArray} {allDemandingElementArray}
</View> </View>
<AtLoadMore <AtLoadMore

6
src/pages/allDemanding/allDemanding.scss
View File

@ -29,7 +29,7 @@
width:172rpx; width:172rpx;
font-size:32rpx; font-size:32rpx;
line-height:1.5; line-height:1.5;
vertical-align:middle; // vertical-align:middle;
text-align:left; text-align:left;
font-weight: bold; font-weight: bold;
} }
@ -75,6 +75,7 @@
padding:20px 20px 5px; padding:20px 20px 5px;
border-bottom: 1px solid #F2F2F2; border-bottom: 1px solid #F2F2F2;
.name{ .name{
margin-left: 10px;
flex:1 flex:1
} }
.others{ .others{
@ -83,6 +84,9 @@
.cate{ .cate{
color:#2196F3 color:#2196F3
} }
.watch{
padding-left: 10px;
}
} }
} }

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

@ -1,6 +1,6 @@
import Taro, { Component } from '@tarojs/taro' import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text, Image } from '@tarojs/components' import { View, Text, Image } from '@tarojs/components'
import { AtSearchBar, AtTabs, AtTabsPane, AtSegmentedControl, AtIcon, AtToast ,Picker } from 'taro-ui' import {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 SearchBarComponent from '../../component/searchBarComponent/searchBarComponent'
@ -9,44 +9,45 @@ import URL from '../../serviceAPI.config'
import './goods.scss' import './goods.scss'
class Goods extends Component { class Goods extends Component {
config = { config = {
navigationBarTitleText: '商品' navigationBarTitleText: '商品详情'
} }
constructor() { constructor() {
super(...arguments) super(...arguments)
this.state = { this.state = {
value:'', current: 0, // 当前大类评论区
current: 0, subCurrent:0, // 当前小类评论区
subCurrent:0, isOpened:false, // 是否显示轻提示
isOpened:false, selector: ['0', '1', '2', '3'], // 数量或者规格选择
selector: ['0', '1', '2', '3'], selectorChecked: '0', // 已选择的数量或规格
selectorChecked: '0',
}} }}
// 大类评论区方法
handleClick(value) { handleClick(value) {
this.setState({ this.setState({
current: value current: value
}) })
} }
// 小磊评论区方法
onClick(value) { onClick(value) {
this.setState({ this.setState({
subCurrent: value subCurrent: value
}) })
} }
// 去其他页面
goShopPage(){ goShopPage(){
Taro.navigateTo({ Taro.navigateTo({
url: '/pages/shop/shop' url: '/pages/shop/shop'
}) })
} }
// 收藏商品
saveItem(){ saveItem(){
this.setState({isOpened:true}) this.setState({isOpened:true})
} }
// 数量或者规格方法
onChange = e => { onChange = e => {
this.setState({ this.setState({
selectorChecked: this.state.selector[e.detail.value] selectorChecked: this.state.selector[e.detail.value]
@ -67,7 +68,7 @@ class Goods extends Component {
render() { render() {
const mainTabList = [{ title: '宝贝详情' }, { title: '全部评价' }, { title: '猜你喜欢' }] const mainTabList = [{ title: '宝贝详情' }, { title: '全部评价' }, { title: '猜你喜欢' }]
const subTabList = [{ title: '全部' }, { title: '好评' }, { title: '差评' }, { title: '公开' }, { title: '匿名' }] // const subTabList = [{ title: '全部' }, { title: '好评' }, { title: '差评' }, { title: '公开' }, { title: '匿名' }]
return ( return (
<View className='gooods=container'> <View className='gooods=container'>
@ -121,12 +122,7 @@ class Goods extends Component {
</View> </View>
</View> </View>
<View className='standard-box'> <View className='standard-box'>
{/* <View className='title'> {/* 规格或者数量 */}
可选规格
</View>
<View className='more'>
>点击
</View> */}
<Picker mode='selector' range={this.state.selector} onChange={this.onChange}> <Picker mode='selector' range={this.state.selector} onChange={this.onChange}>
<View className='picker'> <View className='picker'>
<View className='title'> <View className='title'>
@ -139,14 +135,16 @@ class Goods extends Component {
</View> </View>
</Picker> </Picker>
</View> </View>
{/* 详情和评论区 */}
<View className='details-box'> <View className='details-box'>
{/* 大类 */}
<AtTabs color='#FF9500' className='alltabs' animated={false} 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*/} { /*子标签类*/}
<AtSegmentedControl selectedColor='#FF9500' <AtSegmentedControl selectedColor='#FF9500'
values={['全部', '好评', '中评', '差评', '公开','匿名']} values={['全部', '好评', '中评', '差评', '公开','匿名']}
onClick={this.onClick.bind(this)} onClick={this.onClick.bind(this)}

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

@ -43,9 +43,7 @@
.spe-price{ .spe-price{
font-weight: bold; font-weight: bold;
margin-left: 20px; margin-left: 20px;
.title{
}
.price{ .price{
font-size: 40px; font-size: 40px;
color: #c00; color: #c00;

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

@ -1,6 +1,6 @@
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, Text, Radio, RadioGroup, Label } from '@tarojs/components'
import { AtInput, AtForm, AtImagePicker, AtTextarea, AtRadio, AtButton, Picker } from 'taro-ui' import { AtInput, AtImagePicker, AtTextarea, AtButton, Picker } from 'taro-ui'
import SearchBarComponent from '../../component/searchBarComponent/searchBarComponent' import SearchBarComponent from '../../component/searchBarComponent/searchBarComponent'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent' import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
@ -16,8 +16,12 @@ class GoodsPublish extends Component {
constructor() { constructor() {
super(...arguments) super(...arguments)
this.state = { this.state = {
selector: ['需求', '供应', '人才'], selector: ['需求', '供应', '人才'], // 应该是树型结构，需要修改
selectorChecked: '需求', selectorChecked: '需求',
productName:'',
productPrice:'',
productUnit:'',
productDescript:'',
files: [{ files: [{
url: 'https://jimczj.gitee.io/lazyrepay/aragaki1.jpeg', url: 'https://jimczj.gitee.io/lazyrepay/aragaki1.jpeg',
}, },
@ -26,7 +30,7 @@ class GoodsPublish extends Component {
}, },
{ {
url: 'https://jimczj.gitee.io/lazyrepay/aragaki3.png', url: 'https://jimczj.gitee.io/lazyrepay/aragaki3.png',
}], }], // 上传的图片
list: [ list: [
{ {
value: '美国', value: '美国',
@ -49,24 +53,55 @@ class GoodsPublish extends Component {
checked: false checked: false
} }
] ] // 店铺分类选项
} }
} }
onChange1 = e => { // 改变商品分类状态
onChange(e){
this.setState({ this.setState({
selectorChecked: this.state.selector[e.detail.value] selectorChecked: this.state.selector[e.detail.value]
}) })
} }
onChange(files) { productNameChange(event){
this.setState({
productName: event
})
}
productPriceChange(event){
this.setState({
productPrice: event
})
}
productUnitChange(event){
this.setState({
productUnit: event
})
}
productDescriptChange(event){
this.setState({
productDescript: event.target.value
})
}
// 上传图片
onChangeImg(files,operationType) {
if (operationType === 'add') {
this.setState({ this.setState({
files files
}) })
} }
if (operationType === 'remove') {
this.state.files.splice(index, 1);
this.setState({ files: this.state.files });
}
}
// 图片上传失败
onFail(mes) { onFail(mes) {
console.log(mes) console.log(mes)
} }
onImageClick(index, file) { // 删除图片
console.log(index, file) onImageClick(index) {
} }
componentWillReceiveProps(nextProps) { componentWillReceiveProps(nextProps) {
@ -83,14 +118,11 @@ class GoodsPublish extends Component {
return ( return (
<View className='goods-publish'> <View className='goods-publish'>
<SearchBarComponent></SearchBarComponent> <SearchBarComponent></SearchBarComponent>
<View className='goods-category'> <View className='goods-category'>
<View className='page-section'> <View className='page-section'>
<View> <View>
<Picker mode='selector' range={this.state.selector} onChange1={this.onChange}> <Picker mode='selector' range={this.state.selector} onChange={this.onChange}>
<View className='picker'> <View className='picker'>
<View className='title-box'> <View className='title-box'>
<Text className='title'><Text className='require'>*</Text>商品分类:</Text> <Text className='selected'>{this.state.selectorChecked}</Text> <Text className='title'><Text className='require'>*</Text>商品分类:</Text> <Text className='selected'>{this.state.selectorChecked}</Text>
@ -107,8 +139,8 @@ class GoodsPublish extends Component {
name='value' name='value'
title='商品名称：' title='商品名称：'
type='text' type='text'
value={this.state.value} value={this.state.productName}
onChange={this.handleChange.bind(this)} onChange={this.productNameChange.bind(this)}
/> />
</View> </View>
<View className='input-box'> <View className='input-box'>
@ -116,10 +148,10 @@ class GoodsPublish extends Component {
<AtInput <AtInput
name='value' name='value'
title='商品价格：' title='商品价格：'
type='text' type='number'
placeholder='￥' placeholder='￥'
value={this.state.value} value={this.state.productPrice}
onChange={this.handleChange.bind(this)} onChange={this.productPriceChange.bind(this)}
/> />
</View> </View>
<View className='input-box'> <View className='input-box'>
@ -128,33 +160,28 @@ class GoodsPublish extends Component {
name='value' name='value'
title='商品单位：' title='商品单位：'
type='text' type='text'
value={this.state.value} value={this.state.productUnit}
onChange={this.handleChange.bind(this)} onChange={this.productUnitChange.bind(this)}
/> />
</View> </View>
{/* 图片上传 */}
<View className='img-box'> <View className='img-box'>
<View className='title-box'> <View className='title-box'>
<Text className='require'>*</Text> <Text className='require'>*</Text>
<Text className='title'>上传图片:</Text> <Text className='title'>上传图片:</Text>
</View> </View>
<View className='img-container'> <View className='img-container'>
<AtImagePicker <AtImagePicker
multiple multiple
files={this.state.files} files={this.state.files}
onChange={this.onChange.bind(this)} onChange={this.onChangeImg.bind(this)}
onFail={this.onFail.bind(this)} onFail={this.onFail.bind(this)}
onImageClick={this.onImageClick.bind(this)} onImageClick={this.onImageClick.bind(this)}
/> />
</View> </View>
</View> </View>
<View className='shoptype-box'> <View className='shoptype-box'>
{/* 店铺分类 */}
<View className='title-box'> <View className='title-box'>
<Text className='require'>*</Text> <Text className='require'>*</Text>
<Text className='title'>店铺分类:</Text> <Text className='title'>店铺分类:</Text>
@ -209,12 +236,13 @@ class GoodsPublish extends Component {
<View className='description-box'> <View className='description-box'>
<View className='title-box'> <View className='title-box'>
<Text className='require'></Text>
<Text className='title'>商品简介:</Text> <Text className='title'>商品简介:</Text>
</View> </View>
<AtTextarea <AtTextarea
value={this.state.value} value={this.state.productDescript}
onChange={this.handleChange.bind(this)} onChange={this.productDescriptChange.bind(this)}
maxlength='200' maxlength='200'
placeholder='你的产品简介' placeholder='你的产品简介'
/> />

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

@ -8,6 +8,9 @@
.at-input__container{ .at-input__container{
color:black; color:black;
font-weight: bold; font-weight: bold;
.at-input__input{
font-weight: normal
}
} }
.img-box{ .img-box{
margin-top:10Px; margin-top:10Px;

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

@ -13,28 +13,23 @@ class Home extends Component {
} }
constructor() { constructor() {
super(...arguments); super(...arguments);
this.state = { this.state = {
shopsDetails: '', shopsDetails: [], // 推荐店铺的信息
ads: '', ads: [], //广告图片数组
categories: '', categories: [],// 大类
subCate:[], subCate:[], //小类
demanding: '', demanding: [],// 业主需求
otherData:'' otherData:[] // 底部导航栏
} }
} }
componentWillMount(){ componentWillMount(){
} }
componentDidMount() { componentDidMount() {
// 页面加载后 得到首页的基本信息和推荐店铺的信息
this.getShops() this.getShops()
this.getHomeCategoriesInfo() this.getHomeCategoriesInfo()
} }
componentWillReceiveProps(nextProps) {
//console.log(this.props, nextProps)
}
componentWillUnmount() { } componentWillUnmount() { }
@ -48,18 +43,16 @@ class Home extends Component {
url: URL.ShopWxStore, url: URL.ShopWxStore,
}) })
.then(res => { .then(res => {
console.log(res) console.log('首页基本信息',res)
this.setState({ this.setState({
ads: res.data.data.adsLb, ads: res.data.data.adsLb,
categories: res.data.data.supplyClass, categories: res.data.data.supplyClass,
demanding: res.data.data.demand.supplys, demanding: res.data.data.demand.supplys,
otherData:res.data.otherData otherData:res.data.otherData
}, () => {
//console.log(this.state.demanding)
}) })
}) })
} }
// 得到所有商店的信息 // 得到推荐商店的信息
getShops(parent_supply_class = 0, supply_class = '-1', supply_level = 1) { getShops(parent_supply_class = 0, supply_class = '-1', supply_level = 1) {
Taro.request({ Taro.request({
url: URL.ShopSupplyShops, url: URL.ShopSupplyShops,
@ -81,19 +74,22 @@ class Home extends Component {
} }
}) })
.then(res => { .then(res => {
console.log('所有店铺的信息', res)
this.setState({ shopsDetails: res.data.shops }, () => { this.setState({ shopsDetails: res.data.shops }, () => {
// console.log('-----',res)
}) })
} }
) )
} }
// 点击大类
onClickParentCate(item) { onClickParentCate(item) {
this.setState({ subCate: item.children }) this.setState({ subCate: item.children })
this.getShops(item.parent_class_id, item.class_id) this.getShops(item.parent_class_id, item.class_id)
} }
// 点击子类
onClickChildCate(item) { onClickChildCate(item) {
this.getShops(item.parent_class_id, item.class_id, 2) this.getShops(item.parent_class_id, item.class_id, 2)
} }
// 转到其他页面
goToAllDemandingPage(){ goToAllDemandingPage(){
Taro.navigateTo({ Taro.navigateTo({
url: '/pages/allDemanding/allDemanding' url: '/pages/allDemanding/allDemanding'
@ -101,7 +97,7 @@ class Home extends Component {
} }
render() { render() {
const demandingElemensArray = this.state.demanding?this.state.demanding.map((item, index) => { const demandingElemensArray = this.state.demanding.length?this.state.demanding.map((item, index) => {
return < SwiperItem key={index} > return < SwiperItem key={index} >
<View className='demanding-item'> <View className='demanding-item'>
<View className='item-tag'> <View className='item-tag'>
@ -123,26 +119,26 @@ class Home extends Component {
</SwiperItem > </SwiperItem >
}) :null }) :null
const adsImgElementsArray = this.state.ads?this.state.ads.map((item, index) => { const adsImgElementsArray = this.state.ads.length?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[0].length?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)}>
<Image className='cate-img' src={URL.Base + item.icon} /> <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.length?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 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
const shopCollectionElementsArray = this.state.shopsDetails?this.state.shopsDetails.map((item, index) => { const shopCollectionElementsArray = this.state.shopsDetails.length?this.state.shopsDetails.map((item, index) => {
return <filteredShopComponent shop={item} key={index}></filteredShopComponent> return <filteredShopComponent shop={item} key={index}></filteredShopComponent>
}):null }):null
@ -153,7 +149,6 @@ class Home extends Component {
}):null }):null
console.log(this.state.subCate)
return ( return (
<View className='home'> <View className='home'>
{/* 第一行图片滚动条 */} {/* 第一行图片滚动条 */}
@ -272,9 +267,6 @@ class Home extends Component {
</View> </View>
</View> </View>
<View className='bottom-nav-box'> <View className='bottom-nav-box'>
<bottomNav otherData={this.state.otherData}/> <bottomNav otherData={this.state.otherData}/>
</View> </View>

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

@ -1,5 +1,5 @@
import Taro, { Component } from '@tarojs/taro' import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text } from '@tarojs/components' import { View } from '@tarojs/components'
import { connect } from '@tarojs/redux' import { connect } from '@tarojs/redux'
import { add, minus, asyncAdd } from '../../actions/counter' import { add, minus, asyncAdd } from '../../actions/counter'
@ -30,7 +30,7 @@ class Index extends Component {
Taro.navigateTo({ Taro.navigateTo({
// url: '/pages/home/home' // url: '/pages/home/home'
// url: '/pages/goodsPublish/goodsPublish' // url: '/pages/goodsPublish/goodsPublish'
url: '/pages/goods/goods' url: '/pages/home/home'
}) })
} }
componentWillReceiveProps (nextProps) { componentWillReceiveProps (nextProps) {

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

@ -1,5 +1,5 @@
import Taro, { Component } from '@tarojs/taro' import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text } from '@tarojs/components' import { View, Text } from '@tarojs/components'
import { AtInput, AtButton, Picker,AtIcon } from 'taro-ui' import { AtInput, AtButton, Picker,AtIcon } from 'taro-ui'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent' import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
@ -18,27 +18,41 @@ class MySupplyDemand extends Component {
constructor() { constructor() {
super(...arguments) super(...arguments)
this.state = { this.state = {
selector: ['全部','需求', '供应', '人才'], demandSupplyCate: ['全部','需求', '供应', '人才'],
selectorChecked: '全部', demandSupplyCateSelected: '全部',
selector1: ['全部','上架', '下架'], demandSupplyState: ['全部','上架', '下架'],
selectorChecked1: '全部', demandSupplyStatesSelected: '全部',
dateSel: '2018-04-22', title:'',
startDateSel: '2018-04-22',
endDateSel: '2018-04-22',
} }
} }
onChange = e => { //修改供求类型
demSupplyCateChange = e => {
this.setState({ this.setState({
selectorChecked: this.state.selector[e.detail.value] demandSupplyCateSelected: this.state.demandSupplyCate[e.detail.value]
}) })
} }
onChange1 = e => { // 修改供求状态
demSupplyStateChange = e => {
this.setState({ this.setState({
selectorChecked1: this.state.selector1[e.detail.value] demandSupplyStatesSelected: this.state.demandSupplyState[e.detail.value]
}) })
} }
onDateChange = e => { titleChange(event){
this.setState({title:event})
}
// 修改开始日期
onStartDateChange = e => {
this.setState({ this.setState({
dateSel: e.detail.value startDateSel: e.detail.value
})
}
// 修改结束日期
onEndDateChange = e => {
this.setState({
endDateSel: e.detail.value
}) })
} }
@ -58,32 +72,33 @@ class MySupplyDemand extends Component {
return ( return (
<View className='mySupplyDemand'> <View className='mySupplyDemand'>
<searchBarComponent></searchBarComponent> <searchBarComponent></searchBarComponent>
{/* 供求类型 */}
<View className='page-section'> <View className='page-section'>
<View> <View>
<Picker mode='selector' range={this.state.selector} onChange={this.onChange}> <Picker mode='selector' range={this.state.demandSupplyCate} onChange={this.demSupplyCateChange.bind(this)}>
<View className='picker'> <View className='picker'>
<View className='title-box'> <View className='title-box'>
<Text className='title'><Text className='require'>*</Text>供求类型:</Text> <Text className='selected'>{this.state.selectorChecked}</Text> <Text className='title'><Text className='require'>*</Text>供求类型:</Text> <Text className='selected'>{this.state.demandSupplyCateSelected}</Text>
</View> </View>
</View>
</View> </Picker>
</Picker> </View>
</View> </View>
</View> {/* 供求状态 */}
<View className='page-section'> <View className='page-section'>
<View> <View>
<Picker mode='selector' range={this.state.selector1} onChange={this.onChange1}> <Picker mode='selector' range={this.state.demandSupplyState} onChange={this.demSupplyStateChange.bind(this)}>
<View className='picker'> <View className='picker'>
<View className='title-box'> <View className='title-box'>
<Text className='title'> <Text className='require'>*</Text>供求状态:</Text> <Text className='selected'>{this.state.selectorChecked1}</Text> <Text className='title'> <Text className='require'>*</Text>供求状态:</Text> <Text className='selected'>{this.state.demandSupplyStatesSelected}</Text>
</View> </View>
</View> </View>
</Picker> </Picker>
</View> </View>
</View> </View>
{/* 供求标题 */}
<View className='input-box'> <View className='input-box'>
<Text className='require'>*</Text> <Text className='require'>*</Text>
<AtInput <AtInput
@ -91,27 +106,26 @@ class MySupplyDemand extends Component {
title='供求标题：' title='供求标题：'
placeholder='供求标题·' placeholder='供求标题·'
type='text' type='text'
value={this.state.value} value={this.state.title}
onChange={this.handleChange.bind(this)} onChange={this.titleChange.bind(this)}
/> />
</View> </View>
{/* 开始和结束日期 */}
<View className='page-section'> <View className='page-section'>
<View className='picker-box'> <View className='picker-box'>
<Picker mode='date' className='picker-container' onChange={this.onDateChange}> <Picker mode='date' className='picker-container' onChange={this.onStartDateChange}>
<View className='picker'> <View className='picker'>
<View className='title-box'> <View className='title-box'>
<Text className='title'><Text className='require'>*</Text>开始日期:</Text> <Text className='selected'>{this.state.dateSel}</Text> <Text className='title'><Text className='require'>*</Text>开始日期:</Text> <Text className='selected'>{this.state.startDateSel}</Text>
</View> </View>
</View> </View>
</Picker> </Picker>
<Picker className='picker-container' mode='date' onChange={this.onDateChange}> <Picker className='picker-container' mode='date' onChange={this.onEndDateChange}>
<View className='picker'> <View className='picker'>
<View className='title-box'> <View className='title-box'>
<Text className='title'><Text className='require'>*</Text>结束日期:</Text> <Text className='selected'>{this.state.dateSel}</Text> <Text className='title'><Text className='require'>*</Text>结束日期:</Text> <Text className='selected'>{this.state.endDateSel}</Text>
</View> </View>
</View> </View>
</Picker> </Picker>
@ -131,6 +145,7 @@ class MySupplyDemand extends Component {
</View> </View>
</View> </View>
<View className='total-count'>一共<Text className='number'>20</Text> 条记录</View> <View className='total-count'>一共<Text className='number'>20</Text> 条记录</View>
{/* 我的供求信息 */}
<View className='info-box'> <View className='info-box'>
<View className='info-container'> <View className='info-container'>

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

@ -1,6 +1,6 @@
import Taro, { Component } from '@tarojs/taro' import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text, Swiper, SwiperItem, Image } from '@tarojs/components' import { View, Button, Text, Image } from '@tarojs/components'
import { AtSearchBar, AtTag, AtIcon ,AtSegmentedControl, AtTabBar, AtDrawer } from 'taro-ui' import { AtSearchBar, AtTag, AtIcon } from 'taro-ui'
import URL from '../../serviceAPI.config' import URL from '../../serviceAPI.config'
import './shop.scss' import './shop.scss'
@ -16,14 +16,15 @@ class Shop extends Component {
constructor() { constructor() {
super(...arguments) super(...arguments)
this.state = { this.state = {
shopItem:'', isShopDetailsOn:false, // 是否显示店铺说明页面
value: '', shopItem:'', // 所有商品
shopId:'', value: '', // 搜索框的值
shopName:'', shopId:'', // 店铺的id
FilterText:'', shopName:'', // 店铺名
FilterText:'', // 筛选的可选项
filterBar:['综合排序','销量','新品','价格','人气'], filterBar:['综合排序','销量','新品','价格','人气'],
selectedFilterValue:0, selectedFilterValue:0, //筛选项
isShowFilter:false, isShowFilter:false, //是否显示侧边筛选
综合排序:true, 综合排序:true,
销量:false, 销量:false,
新品:false, 新品:false,
@ -41,6 +42,7 @@ class Shop extends Component {
} }
} }
// 搜索栏值的改变方法
onChange(value) { onChange(value) {
this.setState({ this.setState({
@ -49,7 +51,7 @@ class Shop extends Component {
console.log(this.state.value) console.log(this.state.value)
}) })
} }
// 搜索栏的方法
getSearchBarkeyWords(){ getSearchBarkeyWords(){
Taro.request({ Taro.request({
url: URL.SearchBarKeyWords, url: URL.SearchBarKeyWords,
@ -64,10 +66,12 @@ class Shop extends Component {
'X-Requested-With': 'XMLHttpRequest' 'X-Requested-With': 'XMLHttpRequest'
} }
}).then(res => { }).then(res => {
console.log(res) console.log('搜索栏的搜索结果',res)
}) })
} }
// 得到筛选的标签
getSearchParams({shop_name = false, shop_id = 1305, shop_class_id = "", goods_class_id=0,class_filter=0}){ getSearchParams({shop_name = false, shop_id = 1305, shop_class_id = "", goods_class_id=0,class_filter=0}){
Taro.request({ Taro.request({
url: URL.GetSearchParam, url: URL.GetSearchParam,
@ -97,7 +101,7 @@ class Shop extends Component {
}) })
} }
// 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 }) { goodsSearch({ curr_page = 1, page_count = 50, shop_name = false, shop_id = 1305, config_id = 4, shop_class_id = '', order = '', currPage = 1 }) {
Taro.request({ Taro.request({
url: URL.GoodsSearch, url: URL.GoodsSearch,
@ -130,6 +134,7 @@ class Shop extends Component {
this.setState({ shopItem:res.data}) this.setState({ shopItem:res.data})
}) })
} }
// 产品排序
accendingDescending(value){ accendingDescending(value){
this.setState({selectedFilterValue:value}) this.setState({selectedFilterValue:value})
if(value==0){ if(value==0){
@ -161,9 +166,11 @@ class Shop extends Component {
} }
} }
// 是否显示侧边筛选
showAndHideFilter(){ showAndHideFilter(){
this.setState({ isShowFilter: !this.state.isShowFilter }) this.setState({ isShowFilter: !this.state.isShowFilter })
} }
// 选择侧边筛选的标签
selectTag(value){ selectTag(value){
for(let item in this.state.cate){ for(let item in this.state.cate){
if(value===item){ if(value===item){
@ -173,9 +180,7 @@ class Shop extends Component {
[item]:!this.state.cate[item] [item]:!this.state.cate[item]
} }
}),()=>{ }),()=>{
this.getSearchParams({ goods_class_id: value , class_filter :1}) this.getSearchParams({ goods_class_id: value , class_filter :1})
}) })
} }
} }
@ -185,9 +190,10 @@ class Shop extends Component {
this.setState({ shopId: this.$router.params.id, shopName: this.$router.params.name}) // 输出 { id: 2, type: 'test' } this.setState({ shopId: this.$router.params.id, shopName: this.$router.params.name}) // 输出 { id: 2, type: 'test' }
} }
componentDidMount(){ componentDidMount(){
//页面加载之后 得到指定店铺的商品 和 筛选标签
this.goodsSearch({}) this.goodsSearch({})
this.getSearchParams({}) this.getSearchParams({})
this.getSearchBarkeyWords() // this.getSearchBarkeyWords()
} }
componentDidShow() { } componentDidShow() { }
@ -195,7 +201,7 @@ class Shop extends Component {
componentDidHide() { } componentDidHide() { }
render() { render() {
const shopName= this.state.shopName // const shopName= this.state.shopName
const ShopItemElementsArray =this.state.shopItem? this.state.shopItem.goods.map((item,index)=>{ const ShopItemElementsArray =this.state.shopItem? this.state.shopItem.goods.map((item,index)=>{
return <View key={index} className='shop-item' > return <View key={index} className='shop-item' >
<ShopItem item={item}></ShopItem> <ShopItem item={item}></ShopItem>
@ -215,7 +221,7 @@ class Shop extends Component {
// const widthness = this.state.FilterText ? this.state.FilterText.goodsParamExt[5].param_value[0] : null // filter 宽度选项 // 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) => { const goodsClassElementsArray = this.state.FilterText.goods_class ? this.state.FilterText.goods_class.map((item, index) => {
@ -227,7 +233,7 @@ class Shop extends Component {
onClick={this.selectTag.bind(this, item.class_id)} onClick={this.selectTag.bind(this, item.class_id)}
>{item.class_name}</AtTag> >{item.class_name}</AtTag>
}):null }):null
// 商品类型 // 侧边筛选的商品类型项
const goodsTypeKeyArray = this.state.FilterText.goods_type ? Object.keys(this.state.FilterText.goods_type):null const goodsTypeKeyArray = this.state.FilterText.goods_type ? Object.keys(this.state.FilterText.goods_type):null
const goodsTypeElementsArray = goodsTypeKeyArray ? goodsTypeKeyArray.map((key, index) => { const goodsTypeElementsArray = goodsTypeKeyArray ? goodsTypeKeyArray.map((key, index) => {
let object = this.state.FilterText.goods_type let object = this.state.FilterText.goods_type
@ -239,7 +245,7 @@ class Shop extends Component {
>{object[key].goods_type_ch_name}</AtTag> >{object[key].goods_type_ch_name}</AtTag>
}):null }):null
//--------- // 侧边筛选的其他项
const goodsParamKeyArray = this.state.FilterText.goodsParam ? Object.keys(this.state.FilterText.goodsParam):null const goodsParamKeyArray = this.state.FilterText.goodsParam ? Object.keys(this.state.FilterText.goodsParam):null
const goodsParamElementsArray = goodsParamKeyArray ? goodsParamKeyArray.map((key, index) => { const goodsParamElementsArray = goodsParamKeyArray ? goodsParamKeyArray.map((key, index) => {
let object = this.state.FilterText.goodsParam let object = this.state.FilterText.goodsParam
@ -301,7 +307,7 @@ class Shop extends Component {
</View> </View>
<View className={this.state.isShowFilter ? 'side-filter show' :'side-filter'}> <View className={this.state.isShowFilter ? 'side-filter show' :'side-filter'}>
<View className='left' onClick={this.showAndHideFilter.bind(this)}></View> <View className='left' onClick={this.showAndHideFilter.bind(this)}></View>
{/* sidebar 筛选 */} {/* 侧边筛选 */}
<View className='right'> <View className='right'>
<View className='filter-box'> <View className='filter-box'>
<View className='title'>分类</View> <View className='title'>分类</View>
@ -327,6 +333,7 @@ class Shop extends Component {
</View> </View>
</View> </View>
{/* 店铺的商品列表 */}
<View className='container'> <View className='container'>
{ShopItemElementsArray} {ShopItemElementsArray}
@ -335,9 +342,7 @@ class Shop extends Component {
<View className='bottom-nav-box'> <View className='bottom-nav-box'>
<bottomNav otherData={{menu:[{ name: '首页' }, { name: '分类' }, { name: '购物车' }, { name: '教程软件' }, { name:'更多'}]}} /> <bottomNav otherData={{menu:[{ name: '首页' }, { name: '分类' }, { name: '购物车' }, { name: '教程软件' }, { name:'更多'}]}} />
</View> </View>
</View> </View>
) )
} }

89
src/pages/supplyDemandPubish/supplyDemandPubish.js → src/pages/supplyDemandPublish/supplyDemandPublish.js
View File

@ -7,7 +7,7 @@ import SearchBarComponent from '../../component/searchBarComponent/searchBarComp
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent' import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
import './supplyDemandPubish.scss' import './supplyDemandPublish.scss'
@ -19,11 +19,16 @@ class SupplyDemand extends Component {
constructor() { constructor() {
super(...arguments) super(...arguments)
this.state = { this.state = {
selector: ['需求', '供应', '人才'], demandingSupplyCate: ['需求', '供应', '人才'], //供求类型选择
selectorChecked: '需求', demandingSupplyCateSelected: '需求',// 当前供求类型
selector1: ['上架', '下架'], demandingSupplyState: ['上架', '下架'], // 状态选择
selectorChecked1: '上架', demandingSupplyStateSelected: '上架',// 当前状态
addImg:true, title:'',
contactName:'',
contactNumber:'',
contactAddress:'',
content:'',
addImg:true, // 是否支持添加图片
files: [{ files: [{
url: 'https://jimczj.gitee.io/lazyrepay/aragaki1.jpeg', url: 'https://jimczj.gitee.io/lazyrepay/aragaki1.jpeg',
}, },
@ -36,19 +41,36 @@ class SupplyDemand extends Component {
} }
} }
// onChange = e => { // 修改供求类型
// this.setState({ demandingSupplyCate = e => {
// selectorChecked: this.state.selector[e.detail.value]
// })
// }
onChange1 = e => {
this.setState({ this.setState({
selectorChecked1: this.state.selector1[e.detail.value] demandingSupplyCateSelected: this.state.demandingSupplyCate[e.detail.value]
}) })
} }
// 修改供求状态
demSupplyStateChange = e => {
this.setState({
demandingSupplyStateSelected: this.state.demandingSupplyState[e.detail.value]
})
}
//改标题
titleChange(event){
this.setState({title:event})
}
contactNameChange(event){
this.setState({contactName:event})
}
contactNumberChange(event){
this.setState({contactNumber:event})
}
contactAddressChange(event){
this.setState({contactAddress:event.target.value})
}
contentChange(event){
this.setState({ content: event.target.value})
}
// 添加图片
onChange(files, operationType,index) { onChange(files, operationType,index) {
console.log(files, operationType,index)
if (operationType==='add'){ if (operationType==='add'){
this.setState({ this.setState({
files files
@ -86,25 +108,23 @@ class SupplyDemand extends Component {
<View className='page-section'> <View className='page-section'>
<View> <View>
<Picker mode='selector' range={this.state.selector} onChange={this.onChange}> <Picker mode='selector' range={this.state.demandingSupplyCate} onChange={this.demandingSupplyCate.bind(this)}>
<View className='picker'> <View className='picker'>
<View className='title-box'> <View className='title-box'>
<Text className='title'><Text className='require'>*</Text>供求类型:</Text> <Text className='selected'>{this.state.selectorChecked}</Text> <Text className='title'><Text className='require'>*</Text>供求类型:</Text> <Text className='selected'>{this.state.demandingSupplyCateSelected}</Text>
</View> </View>
</View> </View>
</Picker> </Picker>
</View> </View>
</View> </View>
<View className='border-box'> <View className='border-box'>
<Text className='require'>*</Text><AtInput <Text className='require'>*</Text><AtInput
name='value' name='value'
title='需求标题：' title='需求标题：'
type='text' type='text'
value={this.state.value} value={this.state.title}
onChange={this.handleChange.bind(this)} onChange={this.titleChange.bind(this)}
/> />
</View> </View>
<View className='input-box'> <View className='input-box'>
@ -113,8 +133,8 @@ class SupplyDemand extends Component {
name='value' name='value'
title='联系人：' title='联系人：'
type='text' type='text'
value={this.state.value} value={this.state.contactName}
onChange={this.handleChange.bind(this)} onChange={this.contactNameChange.bind(this)}
/> />
</View> </View>
<View className='input-box'> <View className='input-box'>
@ -123,32 +143,32 @@ class SupplyDemand extends Component {
name='value' name='value'
title='联系电话：' title='联系电话：'
type='number' type='number'
value={this.state.value} value={this.state.contactNumber}
onChange={this.handleChange.bind(this)} onChange={this.contactNumberChange.bind(this)}
/> />
</View> </View>
<View className='demanding-box'> <View className='demanding-box'>
<View className='title-box'>
<Text className='title'><Text className='require'>*</Text>联系地址:</Text>
</View>
<AtTextarea <AtTextarea
value={this.state.value} value={this.state.contactAddress}
onChange={this.handleChange.bind(this)} onChange={this.contactAddressChange.bind(this)}
maxlength='200' maxlength='200'
placeholder='联系地址' placeholder='联系地址'
/> />
</View> </View>
<View className='demanding-box'> <View className='demanding-box'>
<View className='title-box'> <View className='title-box'>
<Text className='title'><Text className='require'>*</Text>需求内容:</Text> <Text className='title'><Text className='require'>*</Text>需求内容:</Text>
</View> </View>
<AtTextarea <AtTextarea
value={this.state.value} value={this.state.content}
onChange={this.handleChange.bind(this)} onChange={this.contentChange.bind(this)}
maxlength='200' maxlength='200'
placeholder='' placeholder=''
/> />
</View> </View>
<View className='img-box'> <View className='img-box'>
<View className='title-box'> <View className='title-box'>
@ -164,17 +184,16 @@ class SupplyDemand extends Component {
onFail={this.onFail.bind(this)} onFail={this.onFail.bind(this)}
onImageClick={this.onImageClick.bind(this)} onImageClick={this.onImageClick.bind(this)}
/> />
</View> </View>
</View> </View>
<View className='page-section'> <View className='page-section'>
<View> <View>
<Picker mode='selector' range={this.state.selector1} onChange={this.onChange1}> <Picker mode='selector' range={this.state.demandingSupplyState} onChange={this.demSupplyStateChange}>
<View className='picker'> <View className='picker'>
<View className='title-box'> <View className='title-box'>
<Text className='title'> <Text className='require'>*</Text>状态:</Text> <Text className='selected'>{this.state.selectorChecked1}</Text> <Text className='title'> <Text className='require'>*</Text>状态:</Text> <Text className='selected'>{this.state.demandingSupplyStateSelected}</Text>
</View> </View>
</View> </View>

0
src/pages/supplyDemandPubish/supplyDemandPubish.scss → src/pages/supplyDemandPublish/supplyDemandPublish.scss
View File