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

四级联动，上拉加载

Browse Source
This commit is contained in:
郑茂强 2019-01-18 17:09:17 +08:00
parent 401e237358
commit 6b8102feb6
13 changed files with 375 additions and 336 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/app.scss
View File

@ -51,10 +51,12 @@ $linearBlue:linear-gradient(to right, #337ab7, #337ab7);
opacity: 0.5;
}
// .button-blue-mini{
// color:white;
// background:$linearBlue;
// }
.button-no-margin{
margin:10px 0
}
.no_more_title{
text-align: center;
font-size: 25rpx;
}

193
src/component/goodsTypeInteractionComp/goodsTypeInteractionComp.js
View File

@ -7,7 +7,8 @@ import { Picker } from 'taro-ui'
import './goodsTypeInteractionComp.scss'
let maxDepth = 0
let initialDataArray = []
class GoodsTypeInteractionComp extends Component {
config = {
@ -18,9 +19,10 @@ class GoodsTypeInteractionComp extends Component {
this.state = {
///---行业分类 开始
objectMultiArray: [[{ class_name: '选择商品分类', class_id: '' }], [], []],
multiIndex: [0, 0, 0, 0],
formatInWindow: [],
initailMultiArray: [[{ class_name: '选择商品分类', class_id: '' }], [], []],
multiIndex: [0, 0, 0, 0],// 默认联动列数为4个并且每一列都是第一行
interactionMultiArray: [],
///---行业分类 结束
}
@ -41,15 +43,17 @@ class GoodsTypeInteractionComp extends Component {
.then(res => {
if (res.data.err_msg === 'success') {
console.log('商品分类目录', res)
// this.formatIndustryType(res.data.data)
this.formatIndustTypeInit(res.data.data)
this.setState({
formatInWindow: this.recursion(res.data.data).multiObject,
DataDepth:this.recursion(res.data.data).depth },()=>{
console.log('depth',this.state.DataDepth)
}) // 用递归来整理无限层次的数据
// console.log(this.recursion(res.data.data))
// this.setState({objectMultiArray:res.data.data})
interactionMultiArray: this.recursionInteraction(res.data.data),
multiIndex: this.recursionDepth(res.data.data),
initailMultiArray: this.recursionInitialized(res.data.data).reverse()
}, () => {
console.log('联动数据', this.state.interactionMultiArray)
console.log('初始化数据', this.state.initailMultiArray)
}) // 用递归来整理无限层次的数据
} else {
console.log('商品分类请求没有成功', res)
}
@ -96,11 +100,11 @@ class GoodsTypeInteractionComp extends Component {
} else {
console.log('店铺分类数据问题')
}
this.setState({ formatInWindow: newIndustryType }, () => {
console.log('滚动时的数据', this.state.formatInWindow)
this.setState({ interactionMultiArray: newIndustryType }, () => {
console.log('滚动时的数据', this.state.interactionMultiArray)
})
}
//第二种format 用于底部弹层的初始化数据
// 第二种format 用于底部弹层的初始化数据
formatIndustTypeInit(data) {
const firstArray = []
const secondArray = []
@ -119,63 +123,84 @@ class GoodsTypeInteractionComp extends Component {
}
}
// 这里不能加入secondArray，和thirdArray 会有bug
this.setState({ objectMultiArray: [firstArray, secondArray, thirdArray] }, () => {
console.log('初始化数据', this.state.objectMultiArray)
this.setState({ initailMultiArray: [firstArray, secondArray, thirdArray] }, () => {
console.log('初始化数据', this.state.initailMultiArray)
})
}
//--- 三级联动--------------
//联动确认
bindMultiPickerChange(e) {
console.log('picker发送选择改变，携带值为', e.detail.value)
console.log('e', e)
this.setState({
multiIndex: e.detail.value
multiIndex: e.detail.value.map(item => { if (item === null) { item = 0 } return item })
}, () => {
// console.log('picker发送选择改变，携带值为', this.state.multiIndex)
this.returnResultToParent()
})
}
returnResultToParent() {
let result = ''
let outter = this.state.formatInWindow[this.state.multiIndex[0]]
let middler = outter.children[this.state.multiIndex[1]]
let inner = middler.children[this.state.multiIndex[2]]
if (outter.id) {
result = outter
if (middler.id) {
result = middler
if (inner.id) {
result = inner
}
let selected = this.state.interactionMultiArray
for (let index of this.state.multiIndex) {
if (selected[index].children[0].id) {
selected = selected[index].children
} else {
this.props.onPassDataToChild(selected[index])
break
}
}
this.passDataToParent(result)
}
// 递归整理无限层数据
recursion(data) {
// 递归整理无限层联动数据
recursionInteraction(data) {
let arrayTem = []
let depth=0
const depthArray=[]
for (let items of data) {
arrayTem.push({ name: items.class_name, id: items.class_id })
if (items.children) {
arrayTem[arrayTem.length - 1].children = this.recursion(items.children)
depth+=1
arrayTem[arrayTem.length - 1].children = this.recursionInteraction(items.children)
} else {
depthArray.push(depth)
arrayTem[arrayTem.length - 1].children = [{ name: '', id: '' }]
}
}
return {multiObject:arrayTem,depth:depthArray}
return arrayTem // 返回联动数据
// return arrayTem
}
// 递归整理无限层初始数据
recursionInitialized(data) {
const arrayTem = []
const childrenHolderArray = []
if (data.length) {
for (let item of data) {
arrayTem.push({ name: item.class_name, id: item.class_id })
item.children ? childrenHolderArray.push(...item.children) : null
}
this.recursionInitialized(childrenHolderArray)
}
arrayTem.length ? initialDataArray.push(arrayTem) : null // 数组为空则不添加
return initialDataArray
}
// 递归整理无限层初始数据
recursionDepth(data) {
const arrayTem = []
const childrenHolderArray = []
if (data.length) {
for (let item of data) {
arrayTem.push({ name: item.class_name, id: item.class_id })
item.children ? childrenHolderArray.push(...item.children) : null
}
this.recursionDepth(childrenHolderArray)
maxDepth += 1
}
return new Array(maxDepth).fill(0)
}
// 触动联动筛选
bindMultiPickerCol(e) {
console.log('修改的列为', e.detail.column, '，值为', e.detail.value)
console.log(this.state.initailMultiArray)
const data = {
multiArray: this.state.objectMultiArray,
multiArray: this.state.initailMultiArray,
multiIndex: this.state.multiIndex
}
data.multiIndex[e.detail.column] = e.detail.value
@ -185,17 +210,19 @@ class GoodsTypeInteractionComp extends Component {
for (let index in data.multiArray[0]) {
const indexNumber = Number(index)
if (indexNumber === data.multiIndex[0]) {
data.multiArray[1] = this.state.formatInWindow[indexNumber].children
data.multiArray[2] = this.state.formatInWindow[indexNumber].children[0].children
data.multiArray[3] = this.state.formatInWindow[indexNumber].children[0].children[0].children
// data.multiArray[1] = this.state.interactionMultiArray[indexNumber].children
// data.multiArray[2] = this.state.interactionMultiArray[indexNumber].children[0].children
// data.multiArray[3] = this.state.interactionMultiArray[indexNumber].children[0].children[0].children
data.multiArray[1] = this.state.interactionMultiArray[indexNumber].children
data.multiArray[2] = this.state.interactionMultiArray[indexNumber].children[data.multiIndex[1]].children
data.multiArray[3] = this.state.interactionMultiArray[indexNumber].children[data.multiIndex[1]].children[data.multiIndex[2]].children
}
}
} else if (e.detail.column == 1) {
for (let index in data.multiArray[1]) {
const indexNumber = Number(index)
if (indexNumber === data.multiIndex[1]) {
data.multiArray[2] = this.state.formatInWindow[data.multiIndex[0]].children[indexNumber].children
data.multiArray[3] = this.state.formatInWindow[data.multiIndex[0]].children[indexNumber].children[0].children
data.multiArray[2] = this.state.interactionMultiArray[data.multiIndex[0]].children[indexNumber].children
}
}
}
@ -203,7 +230,7 @@ class GoodsTypeInteractionComp extends Component {
for (let index in data.multiArray[2]) {
const indexNumber = Number(index)
if (indexNumber === data.multiIndex[2]) {
data.multiArray[3] = this.state.formatInWindow[data.multiIndex[0]].children[data.multiIndex[1]].children[indexNumber].children
data.multiArray[3] = this.state.interactionMultiArray[data.multiIndex[0]].children[data.multiIndex[1]].children[indexNumber].children
}
}
}
@ -215,20 +242,20 @@ class GoodsTypeInteractionComp extends Component {
// case 0:
// switch (data.multiIndex[0]) { // 第一个index 是多少
// case 0:
// data.multiArray[1] = this.state.formatInWindow[0].children
// data.multiArray[2]=this.state.formatInWindow[0].children[0].children
// data.multiArray[1] = this.state.interactionMultiArray[0].children
// data.multiArray[2]=this.state.interactionMultiArray[0].children[0].children
// break
// case 1:
// data.multiArray[1] = this.state.formatInWindow[1].children
// data.multiArray[1] = this.state.interactionMultiArray[1].children
// break
// case 2:
// data.multiArray[1] = this.state.formatInWindow[2].children
// data.multiArray[1] = this.state.interactionMultiArray[2].children
// break
// case 3:
// data.multiArray[1] = this.state.formatInWindow[3].children
// data.multiArray[1] = this.state.interactionMultiArray[3].children
// break
// case 4:
// data.multiArray[1] = this.state.formatInWindow[4].children
// data.multiArray[1] = this.state.interactionMultiArray[4].children
// break
// }
// data.multiIndex[1] = 0
@ -243,70 +270,70 @@ class GoodsTypeInteractionComp extends Component {
// case 1:
// switch (data.multiIndex[1]) {
// case 0:
// data.multiArray[2] = this.state.formatInWindow[1].children[0].children
// data.multiArray[2] = this.state.interactionMultiArray[1].children[0].children
// break
// case 1:
// data.multiArray[2] = this.state.formatInWindow[1].children[1].children
// data.multiArray[2] = this.state.interactionMultiArray[1].children[1].children
// break
// case 2:
// data.multiArray[2] = this.state.formatInWindow[1].children[2].children
// data.multiArray[2] = this.state.interactionMultiArray[1].children[2].children
// break
// case 3:
// data.multiArray[2] = this.state.formatInWindow[1].children[3].children ? this.state.formatInWindow[1].children[3].children : [{ class_name: '' }]
// data.multiArray[2] = this.state.interactionMultiArray[1].children[3].children ? this.state.interactionMultiArray[1].children[3].children : [{ class_name: '' }]
// break
// }
// break
// case 2:
// switch (data.multiIndex[1]) {
// case 0:
// data.multiArray[2] = this.state.formatInWindow[2].children[0].children
// data.multiArray[2] = this.state.interactionMultiArray[2].children[0].children
// break
// case 1:
// data.multiArray[2] = this.state.formatInWindow[2].children[1].children
// data.multiArray[2] = this.state.interactionMultiArray[2].children[1].children
// break
// case 2:
// data.multiArray[2] = this.state.formatInWindow[2].children[2].children
// data.multiArray[2] = this.state.interactionMultiArray[2].children[2].children
// break
// case 3:
// data.multiArray[2] = this.state.formatInWindow[2].children[3].children
// data.multiArray[2] = this.state.interactionMultiArray[2].children[3].children
// break
// case 4:
// data.multiArray[2] = this.state.formatInWindow[2].children[4].children
// data.multiArray[2] = this.state.interactionMultiArray[2].children[4].children
// break
// case 5:
// data.multiArray[2] = this.state.formatInWindow[2].children[5].children
// data.multiArray[2] = this.state.interactionMultiArray[2].children[5].children
// break
// }
// break
// case 3:
// switch (data.multiIndex[1]) {
// case 0:
// data.multiArray[2] = this.state.formatInWindow[3].children[0].children
// data.multiArray[2] = this.state.interactionMultiArray[3].children[0].children
// break
// case 1:
// data.multiArray[2] = this.state.formatInWindow[3].children[1].children
// data.multiArray[2] = this.state.interactionMultiArray[3].children[1].children
// break
// case 2:
// data.multiArray[2] = this.state.formatInWindow[3].children[2].children
// data.multiArray[2] = this.state.interactionMultiArray[3].children[2].children
// break
// case 3:
// data.multiArray[2] = this.state.formatInWindow[3].children[3].children
// data.multiArray[2] = this.state.interactionMultiArray[3].children[3].children
// break
// case 3:
// data.multiArray[2] = this.state.formatInWindow[3].children[3].children
// data.multiArray[2] = this.state.interactionMultiArray[3].children[3].children
// break
// }
// break
// case 4:
// switch (data.multiIndex[1]) {
// case 0:
// data.multiArray[2] = this.state.formatInWindow[4].children[0].children
// data.multiArray[2] = this.state.interactionMultiArray[4].children[0].children
// break
// case 1:
// data.multiArray[2] = this.state.formatInWindow[4].children[1].children
// data.multiArray[2] = this.state.interactionMultiArray[4].children[1].children
// break
// case 2:
// data.multiArray[2] = this.state.formatInWindow[4].children[2].children
// data.multiArray[2] = this.state.interactionMultiArray[4].children[2].children
// break
// }
@ -320,10 +347,7 @@ class GoodsTypeInteractionComp extends Component {
this.setState({ multiIndex: data.multiIndex })
}
//--------------------结束-行业分类picker
passDataToParent(industryTypeSelected) {
this.props.onPassDataToChild(industryTypeSelected)
}
componentDidMount() {
@ -344,12 +368,13 @@ class GoodsTypeInteractionComp extends Component {
return (
<View class='page-section'>
<Picker
rangeKey='name'
mode='multiSelector'
onChange={this.bindMultiPickerChange.bind(this)}
onColumnchange={this.bindMultiPickerCol.bind(this)}
value={this.state.multiIndex}
range={this.state.objectMultiArray}
range={this.state.initailMultiArray}
>
<View class='picker type'>
<View className='title-box'>
@ -359,9 +384,9 @@ class GoodsTypeInteractionComp extends Component {
{this.props.selectedValue.name}
</Text>
{/* {this.state.objectMultiArray[0].length?<Text className='first-col'> {this.state.objectMultiArray[0][this.state.multiIndex[0]].name}</Text>:null}
{this.state.objectMultiArray[1].length?<Text className='second-col'>{this.state.objectMultiArray[1][this.state.multiIndex[1]].name}</Text>:null}
{this.state.objectMultiArray[2].length?<Text className='third-col'>{this.state.objectMultiArray[2][this.state.multiIndex[2]].name}</Text>:null} */}
{/* {this.state.initailMultiArray[0].length?<Text className='first-col'> {this.state.initailMultiArray[0][this.state.multiIndex[0]].name}</Text>:null}
{this.state.initailMultiArray[1].length?<Text className='second-col'>{this.state.initailMultiArray[1][this.state.multiIndex[1]].name}</Text>:null}
{this.state.initailMultiArray[2].length?<Text className='third-col'>{this.state.initailMultiArray[2][this.state.multiIndex[2]].name}</Text>:null} */}
</View>
</View>

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

@ -55,7 +55,7 @@ class ShopItem extends Component {
</View>
<View className='itemname-box'>
<View className='name'>{name}</View>
<Text className='name'>{name}</Text>
</View>
<View className='addon-box'>

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

@ -35,6 +35,9 @@
.itemname-box{
border-bottom: 1px solid #DADADA;
margin-top: 10px;
overflow:hidden;
white-space:nowrap;
margin:0 5%;
.name{
font-size: 30px;

45
src/component/shopTypeInteractionComp/shopTypeInteractionComp.js
View File

@ -17,7 +17,7 @@ class ShopTypeInteractionComp extends Component {
this.state = {
///---行业分类 开始
objectMultiArray: [[{}],[{name:'选择店铺分类',id:''}]],
objectMultiArray: [[{}], [{ name: '选择店铺分类', id: '' }]],
multiIndex: [0, 0],
formatInWindow: [],
///---行业分类 结束
@ -42,7 +42,7 @@ class ShopTypeInteractionComp extends Component {
})
.then(res => {
console.log('店铺分类目录', res)
this.formatIndustryType(res.data.data)
this.formatIndustryType(res.data.data)
this.formatIndustTypeInit(res.data.data)
}
@ -70,8 +70,8 @@ class ShopTypeInteractionComp extends Component {
console.log('店铺分类数据问题')
}
this.setState({ formatInWindow: newIndustryType },()=>{
console.log('滚动时的数据',this.state.formatInWindow)
this.setState({ formatInWindow: newIndustryType }, () => {
console.log('滚动时的数据', this.state.formatInWindow)
})
}
//第二种format 用于底部弹层的初始化数据
@ -79,7 +79,6 @@ class ShopTypeInteractionComp extends Component {
const firstArray = []
const secondArray = []
if (Object.keys(data).length) {
for (let key in data) {
firstArray.push({ name: data[key].n, id: '' })
if (data[key].c.length) {
@ -94,37 +93,33 @@ class ShopTypeInteractionComp extends Component {
}
this.setState({ objectMultiArray: [firstArray, secondArray] }, () => {
// console.log('初始化数据', this.state.objectMultiArray)
// console.log('初始化数据', this.state.objectMultiArray)
})
}
//--------------------开始-行业分类picker
bindMultiPickerChange(e) {
// console.log('picker发送选择改变，携带值为', e.detail.value)
// console.log('picker发送选择改变，携带值为', e.detail.value)
this.setState({
multiIndex: e.detail.value,
}, () => {
//判断如果formatInWindow 的子类为空 那就取父类， 反之取子类
let industryTypeSelected
if (this.state.formatInWindow[e.detail.value[0]].child[e.detail.value[1]].id === '') {
industryTypeSelected = this.state.formatInWindow[e.detail.value[0]]
} else {
industryTypeSelected = this.state.formatInWindow[e.detail.value[0]].child[e.detail.value[1]]
}
//判断如果formatInWindow 的子类为空 那就取父类， 反之取子类
let industryTypeSelected
if (this.state.formatInWindow[e.detail.value[0]].child[e.detail.value[1]].id === '') {
industryTypeSelected = this.state.formatInWindow[e.detail.value[0]]
} else {
industryTypeSelected = this.state.formatInWindow[e.detail.value[0]].child[e.detail.value[1]]
}
this.passDataToParent(industryTypeSelected)
})
}
bindMulPickerColChge(e) {
//console.log('修改的列为', e.detail.column, '，值为', e.detail.value)
const data = {
objectMultiArray: this.state.objectMultiArray,
multiIndex: this.state.multiIndex
}
// console.log(' this.state.formatInWindow', this.state.formatInWindow)
// console.log(' this.state.formatInWindow', this.state.formatInWindow)
data.multiIndex[e.detail.column] = e.detail.value
switch (e.detail.column) {
@ -180,8 +175,8 @@ class ShopTypeInteractionComp extends Component {
break
}
// console.log(data.multiIndex)
// console.log('objectMultiArray', data.objectMultiArray)
// console.log(data.multiIndex)
// console.log('objectMultiArray', data.objectMultiArray)
this.setState({
multiIndex: data.multiIndex,
objectMultiArray: data.objectMultiArray
@ -194,11 +189,11 @@ class ShopTypeInteractionComp extends Component {
passDataToParent(industryTypeSelected) {
this.props.onPassDataToChild(industryTypeSelected)
}
componentDidMount() {
this.getShopTypeList(this.props.url)
}
// 当然父组件有新的props的 会从新渲染组件
componentWillReceiveProps(nextProps) {
@ -223,10 +218,10 @@ class ShopTypeInteractionComp extends Component {
>
<View class='picker type'>
<View className='title-box'>
<Text className='require'>*</Text>
<Text className='require'>*</Text>
<Text className='title'>店铺分类：</Text>
<Text className='first-col'>
{this.props.selectedValue.name}
{this.props.selectedValue.name}
</Text>
</View>
</View>

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

@ -73,17 +73,22 @@ class AllDemanding extends Component {
.then(res => {
Taro.hideLoading()
if (res.data.err_msg === 'success') {
if (res.data.supplys.length) {
if (res.data.supplys) {
if (this.state.isAddToList) {
this.setState({ supplys: this.state.supplys.concat(res.data.supplys), isAddToList: false })
} else {
this.setState({ supplys: res.data.supplys })
}
} else {
Taro.showToast({
title: '没有更多了',
icon: 'none'
})
if (this.state.isAddToList) {
Taro.showToast({
title: '没有更多了',
icon: 'none'
})
}else{
this.setState({ supplys:[]})
}
}
} else {
Taro.showToast({
@ -92,6 +97,7 @@ class AllDemanding extends Component {
duration: 1500
})
}
this.setState({ isAddToList: false })
})
}
@ -258,8 +264,7 @@ class AllDemanding extends Component {
text={this.state.grabOrderSuccess}
duration={2000}
></AtToast>
const allDemandingElementArray = this.state.supplys ? this.state.supplys.map((item, index) => {
const allDemandingElementArray = this.state.supplys.length ? this.state.supplys.map((item, index) => {
return <View className='demanding-info' key={index}>
<View className='header'>
<AtIcon value='user' size='12' color='#2196F3'></AtIcon>
@ -293,7 +298,7 @@ class AllDemanding extends Component {
</View>
</View>
}) : null
}) : <View className='no_more_title'>没有更多了</View>
return (
<View className='allDemanding'>
{/* 模态框 */}

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

@ -32,6 +32,10 @@ class Home extends Component {
userPhone: '',// 用户电话
isShowTopNav: false,// 是否显示返回顶部按钮
loadMorePageIndex: 1,//下拉加载页面数
isAddToList: false,
parentClass: '',// 大类的id
childClass: '-1',//小类的id
supplyLevel: 1,// 筛选1是小类或者2是大类
}
}
@ -78,7 +82,7 @@ class Home extends Component {
})
}
// api 得到推荐商店的信息
getShops({ parent_supply_class = 0, supply_class = '-1', supply_level = 1, curr_page = 1,
getShops({ parent_supply_class = this.state.parentClass, supply_class = this.state.childClass, supply_level = this.state.supplyLevel, curr_page = 1,
page_count = 5, action = "2" }) {
Taro.request({
url: URL.ShopSupplyShops,
@ -100,74 +104,75 @@ class Home extends Component {
}
})
.then(res => {
console.log('所有店铺的信息', res)
// console.log('所有店铺的信息', res)
console.log('我是res', res)
Taro.hideLoading()
if (res.data.err_msg === 'success') {
if (res.data.shops.length) {
this.setState({ shops: this.state.shops.concat(res.data.shops) })
if (this.state.isAddToList) {
if (res.data.shops) {
this.setState({ shops: this.state.shops.concat(res.data.shops), isAddToList: false })
} else {
Taro.showToast({
title: '没有更多了',
icon: 'none',
duration: 1500
})
}
} else {
Taro.showToast({
title: '没有更多了',
icon: 'none',
duration: 1500
})
res.data.shops ? this.setState({ shops: res.data.shops }) : this.setState({ shops: [] })
}
} else {
Taro.showToast({
title: res.data.err_msg,
icon: 'none',
duration: 1500
})
}
this.setState({ isAddToList: false })
}
)
}
getShopsInfo({ parent_supply_class = 0, supply_class = '-1', supply_level = 1, curr_page = 1,
page_count = 20, action = "2" }) {
Taro.request({
url: URL.ShopSupplyShops,
method: 'POST',
dataType: 'json',
data: {
param: JSON.stringify({
curr_page: curr_page,
page_count: page_count,
parent_supply_class: parent_supply_class, //父级class id
supply_class: supply_class,// 子级class id
supply_level: supply_level,// 层级
action: action
})
},
header: {
'content-type': 'application/x-www-form-urlencoded',
'Cookie': 'PFWSSS=' + Taro.getStorageSync('session_id'),
}
})
.then(res => {
console.log('所有店铺的信息', res)
Taro.hideLoading()
if (res.data.err_msg === 'success') {
// getShops({ parent_supply_class = this.state.parentClass, supply_class = this.state.childClass, supply_level = 1, curr_page = 1,
// page_count = 20, action = "2" }) {
// Taro.request({
// url: URL.ShopSupplyShops,
// method: 'POST',
// dataType: 'json',
// data: {
// param: JSON.stringify({
// curr_page: curr_page,
// page_count: page_count,
// parent_supply_class: parent_supply_class, //父级class id
// supply_class: supply_class,// 子级class id
// supply_level: supply_level,// 层级
// action: action
// })
// },
// header: {
// 'content-type': 'application/x-www-form-urlencoded',
// 'Cookie': 'PFWSSS=' + Taro.getStorageSync('session_id'),
// }
// })
// .then(res => {
// console.log('所有店铺的信息', res)
// Taro.hideLoading()
// if (res.data.err_msg === 'success') {
this.setState({ shops: res.data.shops })
Taro.hideLoading()
// this.setState({ shops: res.data.shops })
// Taro.hideLoading()
} else {
Taro.showToast({
title: res.data.err_msg,
icon: 'none',
duration: 1500
})
}
}
)
}
// } else {
// Taro.showToast({
// title: res.data.err_msg,
// icon: 'none',
// duration: 1500
// })
// }
// }
// )
// }
// 异步函数登入api
async login() {
@ -271,26 +276,31 @@ class Home extends Component {
}
// 点击大类icon
onClickParentCate(item) {
const parentClass = item.parent_class_id
const childClass = item.class_id
this.setState({ subCate: item.children })
Taro.showLoading({
title: '加载中'
})
this.getShopsInfo({ parent_supply_class: parentClass, supply_class: childClass })
console.log('item', item)
this.setState({ parentClass: item.class_id, childClass: item.class_id, supplyLevel: 1, subCate: item.children || [] }, () => {
console.log('parentClass', this.state.parentClass, this.state.childClass)
this.getShops({})
})
}
// 点击子类
onClickChildCate(item) {
const parentClass = item.parent_class_id
const childClass = item.class_id
// this.getShops(item.parent_class_id, item.class_id, 2)
Taro.showLoading({
title: '加载中'
})
this.getShopsInfo({ parent_supply_class: parentClass, supply_class: childClass, supply_level: 2 })
this.setState({ childClass: item.class_id, supplyLevel: 2 }, () => {
this.getShops({})
})
// this.getShops(item.parent_class_id, item.class_id, 2)
}
scrollToSubCate(item) {
Taro.pageScrollTo({
scrollTop: 410,
duration: 300
@ -375,16 +385,12 @@ class Home extends Component {
Taro.showLoading({
title: '加载中'
})
this.setState({ loadMorePageIndex: this.state.loadMorePageIndex + 1 }, () => {
this.getShops({ curr_page: this.state.loadMorePageIndex })
this.setState({ loadMorePageIndex: this.state.loadMorePageIndex + 1, isAddToList: true }, () => {
this.getShops({ curr_page: this.state.loadMorePageIndex, })
})
}
render() {
// 提示模态弹窗element
const modalMessageGrabElement = <AtModal isOpened={this.state.isOpen}>
<AtModalHeader>提示</AtModalHeader>
@ -446,21 +452,20 @@ class Home extends Component {
<View>{item.class_name}</View>
</View>
}) : null
const shopCollectionElementsArray = this.state.shops.map((item, index) => {
const shopCollectionElementsArray = this.state.shops.length ? this.state.shops.map((item, index) => {
return <FilteredShopComponent
shop={item}
userName={this.state.userName}
userPhone={this.state.userPhone}
key={index}
></FilteredShopComponent>
})
}) : <View className='no_more_title'> 没有更多了</View>
const subCateElementsArray = this.state.subCate.length ? this.state.subCate.map((item, index) => {
return <SwiperItem key={index} onClick={this.onClickChildCate.bind(this, item)}>
<View className='text'>{item.class_name}</View>
</SwiperItem>
}) : null
return (
<View className='home'>
@ -574,6 +579,8 @@ class Home extends Component {
<View className='shop-box'>
{shopCollectionElementsArray}
</View>
{this.state.isShowTopNav ? <ScrollToTopComponent ></ScrollToTopComponent> : null}

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

@ -29,17 +29,17 @@ class Index extends Component {
//http://ihome6.com/Shop-supplyShops
componentDidMount() {
Taro.navigateTo({
// url: '/pages/myGoodList/myGoodList'
// url: '/pages/myGoodList/myGoodList'
// url: '/pages/myDemandSupplyEdit/myDemandSupplyEdit'
// url: '/pages/mySupplyDemand/mySupplyDemand'
// url:'/pages/grabOrderPage/grabOrderPage'
// url:'/pages/myGoodList/myGoodList'
// url:'/pages/myNeeds/myNeeds',
// url:'/pages/myGoodList/myGoodList'
// url:'/pages/myNeeds/myNeeds',
//url:'/pages/myNeedsPublish/myNeedsPublish'
// url:'/pages/mySupplyDemand/mySupplyDemand'
url:'/pages/home/home'
// url:'/pages/allDemanding/allDemanding'
// url:'/pages/goodsPublish/goodsPublish'
url: '/pages/home/home'
// url:'/pages/allDemanding/allDemanding'
// url:'/pages/goodsPublish/goodsPublish'
})

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

@ -150,9 +150,10 @@ $themeColor:#FF7142;
}
.img-box{
flex:1;
height:80%;
height:45%;
width:100%;
margin: 0 2%;
border: 2px solid #ddd

224
src/pages/myNeeds/myNeeds.js
View File

@ -6,13 +6,10 @@ import URL from '../../serviceAPI.config'
import ScrollToTopComponent from '../../component/scrollToTopComponent/scrollToTopComponent'
import InteractionComponent from '../../component/interactionComponent/interactionComponent'
import CopyrightComponent from '../../component/copyrightComponent/copyrightComponent'
import './myNeeds.scss'
class MyNeeds extends Component {
config = {
navigationBarTitleText: '我的需求'
}
@ -37,16 +34,16 @@ class MyNeeds extends Component {
totalNeeds: 0,// 我的需求数量
currentPage: 1,
needsItem: '',// 确认框提示时 使用的供求名
isDeleteModal:false,// 删除提示框
isDeleteModal: false,// 删除提示框
isAddToList: false,// 请求需求的时候是否添加到旧列表里
isShowTopNav: false,// 是否显示返回顶部按钮
loadMorePageIndex:1,// 上拉加载页面数
loadMorePageIndex: 1,// 上拉加载页面数
}
}
//请求我的需求列表 api GetMyNeedsList
getMyNeedsList({
getMyNeedsList({
curr_page = this.state.currentPage,
page_count = this.state.pageCount,
sd_type = this.state.needsTypeSelected.id,
@ -57,25 +54,29 @@ class MyNeeds extends Component {
state = this.state.needsStateSelected.id
}) {
//由于后台返回的问题， 所有当state为空的时候不传state，反之传state
const param=state?{param: JSON.stringify({
curr_page: curr_page,
page_count: page_count,
sd_type: sd_type,
sd_title: sd_title,
update_dateL: update_dateL,
update_dateU: update_dateU,
class_id: class_id,
state: state
})}:{param: JSON.stringify({
curr_page: curr_page,
page_count: page_count,
sd_type: sd_type,
sd_title: sd_title,
update_dateL: update_dateL,
update_dateU: update_dateU,
class_id: class_id,
})}
const param = state ? {
param: JSON.stringify({
curr_page: curr_page,
page_count: page_count,
sd_type: sd_type,
sd_title: sd_title,
update_dateL: update_dateL,
update_dateU: update_dateU,
class_id: class_id,
state: state
})
} : {
param: JSON.stringify({
curr_page: curr_page,
page_count: page_count,
sd_type: sd_type,
sd_title: sd_title,
update_dateL: update_dateL,
update_dateU: update_dateU,
class_id: class_id,
})
}
Taro.request({
url: URL.GetMyNeedsList,
method: 'POST',
@ -90,36 +91,37 @@ class MyNeeds extends Component {
Taro.hideLoading()
console.log('我的需求列表', res)
if (res.data.err_msg === "success") {
if(res.data.supplys.length){
if(this.state.isAddToList){
if (res.data.supplys) { // 查看res.data 里面是否有supplys 这个key
if (this.state.isAddToList) { // 如果是上拉
this.setState({
allNeedsList:this.state.allNeedsList.concat(res.data.supplys)
},()=>{
this.setState({isAddToList:false})
allNeedsList: this.state.allNeedsList.concat(res.data.supplys)
}, () => {
this.setState({ isAddToList: false })
})
}else{
this.setState({isAddToList:false})
} else {
this.setState({ isAddToList: false })
this.setState({
allNeedsList: res.data.supplys || [],
totalNeeds: Number(res.data.count)
allNeedsList: res.data.supplys,
totalNeeds:Number(res.data.count)
})
}
}else{
this.setState({isAddToList:false})
Taro.showToast({
title: '没有更多了',
icon: 'none'
})
} else {
if(this.state.isAddToList){
this.setState({ isAddToList: false })
Taro.showToast({
title: '没有更多了',
icon: 'none'
})
}else{
this.setState({allNeedsList:[],totalNeeds:0})
}
}
}else{
} else {
Taro.showToast({
title: res.data.err_msg,
icon: 'none'
})
})
}
})
@ -162,14 +164,14 @@ class MyNeeds extends Component {
})
}
// 搜索按钮
onSearchButtonHandler() {
Taro.showLoading({ title: '加载中' }).then(() => {
this.setState({ currentPage: 1,loadMorePageIndex:1 },()=>{
this.setState({ currentPage: 1, loadMorePageIndex: 1 }, () => {
this.getMyNeedsList({
curr_page: this.state.currentPage,
page_count: this.state.pageCount,
@ -177,14 +179,14 @@ class MyNeeds extends Component {
sd_title: this.state.title,
update_dateL: this.state.startDateSel,
update_dateU: this.state.endDateSel,
class_id: this.state.industryTypeSelected.id==='-1'?'':this.state.industryTypeSelected.id,
class_id: this.state.industryTypeSelected.id === '-1' ? '' : this.state.industryTypeSelected.id,
state: this.state.needsStateSelected.id
})
})
})
@ -196,23 +198,23 @@ class MyNeeds extends Component {
})
}
//清空筛选项
emptyFilter(){
emptyFilter() {
this.setState({
title:'',
endDateSel:'',
startDateSel:'',
title: '',
endDateSel: '',
startDateSel: '',
industryTypeSelected: { name: '全部', id: '' },
needsTypeSelected: { name: '业主需求', id: '4' },
needsStateSelected: { name: '全部', id: '' },
currentPage:1,
loadMorePageIndex:1,
},()=>{
currentPage: 1,
loadMorePageIndex: 1,
}, () => {
this.getMyNeedsList({})
})
Taro.showToast({
title:'已清空',
icon:'success',
duration:1000
title: '已清空',
icon: 'success',
duration: 1000
})
}
titleChange(event) {
@ -243,22 +245,22 @@ class MyNeeds extends Component {
}
goToMyNeedsViewPage(id) {
Taro.navigateTo({
url: '/pages/myNeedsView/myNeedsView?id='+id
url: '/pages/myNeedsView/myNeedsView?id=' + id
})
}
goToMyNeedsEditPage(id) {
Taro.navigateTo({
url: '/pages/myNeedsEdit/myNeedsEdit?id='+id
url: '/pages/myNeedsEdit/myNeedsEdit?id=' + id
})
}
deleteButton(item) {
this.setState({isDeleteModal:true,needsItem:item})
this.setState({ isDeleteModal: true, needsItem: item })
}
handleWindowModCancel(){
this.setState({isDeleteModal:false})
handleWindowModCancel() {
this.setState({ isDeleteModal: false })
}
handleWindowConfirm(){
this.setState({isDeleteModal:false})
handleWindowConfirm() {
this.setState({ isDeleteModal: false })
this.deleteMyNeeds({ demandId: this.state.needsItem.sd_id })
}
@ -268,10 +270,10 @@ class MyNeeds extends Component {
componentDidMount() {
Taro.showLoading({
title:'加载中'
title: '加载中'
})
this.getMyNeedsList({})
}
componentWillReceiveProps(nextProps) {
console.log(this.props, nextProps)
@ -283,30 +285,30 @@ class MyNeeds extends Component {
componentDidHide() { }
// 页面位置
onPageScroll(location) {
if (location.scrollTop <= 300 && this.state.isShowTopNav) {
this.setState({ isShowTopNav: false })
} else if (location.scrollTop > 300 && !this.state.isShowTopNav) {
this.setState({ isShowTopNav: true })
// 页面位置
onPageScroll(location) {
if (location.scrollTop <= 300 && this.state.isShowTopNav) {
this.setState({ isShowTopNav: false })
} else if (location.scrollTop > 300 && !this.state.isShowTopNav) {
this.setState({ isShowTopNav: true })
}
}
}
// 底部加载
onReachBottom() {
// 底部加载
onReachBottom() {
Taro.showLoading({
title: '加载中'
})
this.setState({ isAddToList: true,loadMorePageIndex:this.state.loadMorePageIndex+1 }, () => {
this.getMyNeedsList({ curr_page: this.state.loadMorePageIndex })
title: '加载中'
})
}
this.setState({ isAddToList: true, loadMorePageIndex: this.state.loadMorePageIndex + 1 }, () => {
this.getMyNeedsList({ curr_page: this.state.loadMorePageIndex })
})
}
getDataFromChild(value){
console.log('从子组件传回来的值',value)
this.setState({industryTypeSelected:value})
getDataFromChild(value) {
console.log('从子组件传回来的值', value)
this.setState({ industryTypeSelected: value })
}
render() {
const myNeedsListArrayElement = this.state.allNeedsList.map((item, index) => {
@ -318,7 +320,7 @@ class MyNeeds extends Component {
</View>
<View className='needs-title box'>
<Text className='title'>需求标题：</Text>
<Text className='content' onClick={this.state.goToMyNeedsViewPage.bind(this,item.sd_id)}>{item.sd_title}</Text>
<Text className='content' onClick={this.state.goToMyNeedsViewPage.bind(this, item.sd_id)}>{item.sd_title}</Text>
</View>
<View className='needs-state box'>
<Text className='title'>需求状态：</Text>
@ -328,32 +330,32 @@ class MyNeeds extends Component {
<Text className='title'>更新时间：</Text>
<Text className='content'>{item.update_date}</Text>
</View>
{item.state === '0'||item.state === '1' ? <View className='info-button-box'>
{item.state === '0' || item.state === '1' ? <View className='info-button-box'>
<View className='button' onClick={this.goToMyNeedsViewPage.bind(this, item.sd_id)}>
<Button size='mini' className='button-orange button-no-margin'>查看</Button>
<Button size='mini' className='button-orange button-no-margin'>查看</Button>
</View>
<View className='button' onClick={this.goToMyNeedsEditPage.bind(this, item.sd_id)}>
<Button size='mini' className='button-orange button-no-margin'>编辑</Button>
<Button size='mini' className='button-orange button-no-margin'>编辑</Button>
</View>
<View className='button' onClick={this.deleteButton.bind(this, item)}>
<Button size='mini' className='button-dark-red button-no-margin' >删除</Button>
<Button size='mini' className='button-dark-red button-no-margin' >删除</Button>
</View>
</View > : <View className='info-button-box'>
<View className='button' onClick={this.goToMyNeedsViewPage.bind(this, item.sd_id)}>
<Button size='mini' className='button-orange button-no-margin'>查看</Button>
<Button size='mini' className='button-orange button-no-margin'>查看</Button>
</View>
</View>
}
</View>
})
const deleteModalWindowElement= <AtModal isOpened={this.state.isDeleteModal}>
<AtModalHeader>提示</AtModalHeader>
<AtModalContent>
确认删除{this.state.needsItem.sd_title}？
const deleteModalWindowElement = <AtModal isOpened={this.state.isDeleteModal}>
<AtModalHeader>提示</AtModalHeader>
<AtModalContent>
确认删除{this.state.needsItem.sd_title}？
</AtModalContent>
<AtModalAction> <Button onClick={this.handleWindowModCancel.bind(this)}>取消</Button> <Button className='orange' onClick={this.handleWindowConfirm.bind(this)}>确定</Button> </AtModalAction>
</AtModal>
<AtModalAction> <Button onClick={this.handleWindowModCancel.bind(this)}>取消</Button> <Button className='orange' onClick={this.handleWindowConfirm.bind(this)}>确定</Button> </AtModalAction>
</AtModal>
return (
<View className='myNeeds'>
{/* 删除模态框 */}
@ -375,7 +377,7 @@ class MyNeeds extends Component {
<Picker mode='date' className='picker-container' onChange={this.onStartDateChange}>
<View className='picker'>
<View className='title-box'>
开始日期:<Text className='selected date'>{this.state.startDateSel}</Text>
开始日期:<Text className='selected date'>{this.state.startDateSel}</Text>
</View>
</View>
@ -391,7 +393,7 @@ class MyNeeds extends Component {
</View>
</View>
{/* 行业分类开始 */}
<InteractionComponent url={URL.GetIndustryTypeList} onPassDataToChild={this.getDataFromChild.bind(this)} selectedValue={this.state.industryTypeSelected}></InteractionComponent>
<InteractionComponent url={URL.GetIndustryTypeList} onPassDataToChild={this.getDataFromChild.bind(this)} selectedValue={this.state.industryTypeSelected}></InteractionComponent>
{/* 行业分类结束 */}
{/* 需求类型 */}
<View className='page-section'>
@ -424,17 +426,17 @@ class MyNeeds extends Component {
<View className='button-box'>
<View className='button' onClick={this.onSearchButtonHandler.bind(this)}>
<Button size='mini' className='button-orange'>
<Button size='mini' className='button-orange'>
<AtIcon value='search' size='12' color='white'></AtIcon>
搜索</Button>
</View>
<View className='button' onClick={this.addNeeds.bind(this)}>
<Button size='mini' className='button-green'>
<Button size='mini' className='button-green'>
<AtIcon value='add' size='12' color='white'></AtIcon>
新增</Button>
</View>
<View className='button' onClick={this.emptyFilter.bind(this)}>
<Button size='mini' className='button-dark-red'>
<Button size='mini' className='button-dark-red'>
<AtIcon value='trash' size='12' color='white'></AtIcon>
清空</Button>
</View>
@ -443,11 +445,11 @@ class MyNeeds extends Component {
共<Text className='count'>{this.state.totalNeeds}</Text> 条记录
</View>
{/* 我的需求信息 */}
{ <View className='info-box'>
{myNeedsListArrayElement}
{<View className='info-box'>
{this.state.allNeedsList.length?myNeedsListArrayElement:<View>没有更多了</View>}
</View>}
{this.state.isShowTopNav ? <ScrollToTopComponent ></ScrollToTopComponent> : null}
{this.state.isShowTopNav ? <ScrollToTopComponent ></ScrollToTopComponent> : null}
<CopyrightComponent ></CopyrightComponent>

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

@ -340,7 +340,7 @@ class MySupplyDemand extends Component {
</View>
}) : <View className='title' >
}) : <View className='no_more_title' >
没有更多了....
</View >
return (

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

@ -125,11 +125,7 @@ $themeColor:#FF7142;
}
}
.title{
text-align: center;
font-size: 25rpx;
}
.pagination-box{
margin: 50px 0;
}

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

@ -3,6 +3,7 @@ import { View, Button, Text, Image, Map } from '@tarojs/components'
import { AtTag, AtIcon, } from 'taro-ui'
import URL from '../../serviceAPI.config'
import ShopTypeInteractionComp from '../../component/shopTypeInteractionComp/shopTypeInteractionComp'
import ScrollToTopComponent from '../../component/scrollToTopComponent/scrollToTopComponent'
import './shop.scss'
@ -53,7 +54,7 @@ class Shop extends Component {
widthType: [],// 侧边宽度类型
checkedFilterIdList: [],//已选的筛选id
isAddToList: false,// 请求店铺商品的时候是否添加到旧列表里
loadMorePageIndex:1,//上拉加载页面数
loadMorePageIndex: 1,//上拉加载页面数
isShowTopNav: false,// 是否显示返回顶部按钮
// 下面是函数的默认参数
@ -254,13 +255,13 @@ class Shop extends Component {
icon: 'none'
})
}
this.setState({ isAddToList: false })
})
}
// api 得到店铺详情请求
getShopDescription({ shopID = 808 }) {
getShopDescription({ shopID = this.state.shop_id }) {
Taro.request({
url: URL.ShopDescription,
method: 'POST',
@ -292,7 +293,7 @@ class Shop extends Component {
)
}
// api 获取店铺内的店铺分类请求 GetShopCategoryList
getShopInnerCate({ id = 808 }) {
getShopInnerCate({ id = this.state.shop_id }) {
Taro.request({
url: URL.GetShopCategoryList,
method: 'POST',
@ -482,8 +483,8 @@ class Shop extends Component {
}
return item
})
this.setState({ mainType: newMainType, loadMorePageIndex:1,goodType: newGoodType, widthType: newWidthType, otherType: newOtherType }, () => {
this.setState({ mainType: newMainType, loadMorePageIndex: 1, goodType: newGoodType, widthType: newWidthType, otherType: newOtherType }, () => {
// console.log(this.state.mainType)
})
}
@ -524,7 +525,6 @@ class Shop extends Component {
checkedFilterIdList: [], curr_page: 1,
page_count: 10,
shop_name: false,
shop_id: 1305,
config_id: 4,
shop_class_id: '',
order: '',
@ -554,11 +554,10 @@ class Shop extends Component {
componentDidMount() {
Taro.showLoading({ title: '加载中' })
//页面加载之后 得到指定店铺的商品 和 筛选标签
this.goodsSearch({ shop_id: this.$router.params.id }) // 加载店铺商品
this.goodsSearch({}) // 加载店铺商品
this.getSearchParams({})// 加载筛选项
this.getShopDescription({ shopID: this.$router.params.id }) // 加载店铺说明
// this.getSearchBarkeyWords()
this.getShopInnerCate({ id: this.$router.params.id })
this.getShopDescription({}) // 加载店铺说明
this.getShopInnerCate({})
}
componentDidShow() { }
@ -570,20 +569,19 @@ class Shop extends Component {
Taro.showLoading({
title: '加载中'
})
this.setState({ isAddToList: true,loadMorePageIndex:this.state.loadMorePageIndex }, () => {
this.setState({ isAddToList: true, loadMorePageIndex: this.state.loadMorePageIndex + 1 }, () => {
this.goodsSearch({ curr_page: this.state.loadMorePageIndex })
})
}
// 页面位置
onPageScroll(location) {
if (location.scrollTop <= 300 && this.state.isShowTopNav) {
this.setState({ isShowTopNav: false })
} else if (location.scrollTop > 300 && !this.state.isShowTopNav) {
this.setState({ isShowTopNav: true })
// 页面位置
onPageScroll(location) {
if (location.scrollTop <= 300 && this.state.isShowTopNav) {
this.setState({ isShowTopNav: false })
} else if (location.scrollTop > 300 && !this.state.isShowTopNav) {
this.setState({ isShowTopNav: true })
}
}
}
render() {
const ShopItemElementsArray = this.state.shopItem.length ? this.state.shopItem.map((item, index) => {
return <View key={index} className='shop-item' >
@ -763,8 +761,13 @@ class Shop extends Component {
<View className='shop-name'>{this.state.shopName}</View>
</View>
<View className='nav-box'>
<View className='nav'>
<View className='shop-cate' onClick={this.isShowShopAllCate.bind(this)}>
<ShopTypeInteractionComp url={URL.GetShopCategoryList}
selectedValue={this.state.shopTypeSelected}
onPassDataToChild={this.getDataFromShopChild.bind(this)}
></ShopTypeInteractionComp>
<Text className='text'>
店铺全部分类
</Text>
@ -788,7 +791,7 @@ class Shop extends Component {
{this.state.showShopHomePage ? shopHomepageElement : shopDescriptionElement}
{this.state.isShowTopNav ? <ScrollToTopComponent ></ScrollToTopComponent> : null}
<CopyrightComponent></CopyrightComponent>
<View className='gap' style='height:150rpx'>
</View>
<View className='bottom-nav-box'>