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

三级联动

Browse Source
This commit is contained in:
郑茂强 2018-12-24 17:35:51 +08:00
parent fc5ed758ea
commit 6c6f3df246
23 changed files with 589 additions and 1252 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/app.scss
View File

@ -0,0 +1,9 @@
.orange{
color:#FF7142,
}
.orange-bg{
background-color:#FF7142,
}
.green-bg{
background-color: #5cb85c
}

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

@ -12,7 +12,7 @@ const houseIcon = require('../../icons/house.png')
class recommondShop extends Component {
static options = {
addGlobalClass: true
}
}
config = {
navigationBarTitleText: 'recommondShop'
@ -36,8 +36,7 @@ class recommondShop extends Component {
})
}
// api 优惠卷请求
getVoucherInfo( {user="杨夕兵",phone="18950295811",shops=["808"],source_type=4,flag=false,source_class="1",source_level=1}) {
getVoucherInfo({ user = "杨夕兵", phone = "18950295811", shops = ["808"], source_type = 4, flag = false, source_class = "1", source_level = 1 }) {
Taro.request({
url: URL.GetVoucherInfo,
method: 'POST',
@ -48,7 +47,7 @@ class recommondShop extends Component {
shops: shops,
source_type: source_type,
flag: flag,
source_class:source_class,
source_class: source_class,
source_level: source_level
},
header: {
@ -197,53 +196,59 @@ class recommondShop extends Component {
const voucherModalElement = <AtModal className='voucher-modal' isOpened={this.state.isOpenVouhcer}>
<AtModalHeader>优惠卷须知：</AtModalHeader>
<AtModalContent>
<AtNoticebar style='color:#a94442' icon='volume-plus'>
提示：具体可以前往实体店进行领取优惠卷或通过电话进行咨询
<AtNoticebar >
<Text className='orange' > 提示：具体可以前往实体店进行领取优惠卷或通过电话进行咨询</Text>
</AtNoticebar>
<View className='voucher-left'>当前优惠卷{voucherLeft}张</View>
<AtInput
disabled
name='value'
title='联系人：'
type='text'
placeholder='123'
name='value'
title='联系人：'
type='text'
placeholder='123'
/>
<AtInput
disabled
name='value'
title='联系电话：'
type='number'
placeholder='需求标题'
border={false}
name='value'
title='联系电话：'
type='number'
placeholder='需求标题'
/>
{!this.state.voucherCanConsult ? <View className='voucher-ResponseMsg'>{this.state.voucherResponseMsg}</View> : null}
</AtModalContent>
<AtModalAction> <Button onClick={this.voucherModalClose.bind(this)} >取消</Button> <Button style='color:#FF7B00' onClick={this.voucherModalConfirm.bind(this)}>确定</Button> </AtModalAction>
<AtModalAction> <Button onClick={this.voucherModalClose.bind(this)} >取消</Button> <Button className='orange' onClick={this.voucherModalConfirm.bind(this)}>确定</Button> </AtModalAction>
</AtModal>
const consultModalElement = <AtModal isOpened={this.state.isOpenConsult}>
<AtModalHeader>咨询</AtModalHeader>
<AtModalContent>
<View className='tip'> <Text>提示:</Text><Text className='tip-info'>{this.state.consultTip}</Text></View>
<AtNoticebar >
<Text className='orange' >提示:{this.state.consultTip}</Text>
</AtNoticebar>
<AtInput
name='value'
title='联系人：'
type='text'
placeholder='123'
name='value'
title='联系人：'
type='text'
placeholder='123'
/>
<AtInput
name='value'
title='联系电话：'
type='number'
placeholder='需求标题'
name='value'
title='联系电话：'
type='number'
placeholder='需求标题'
border={false}
/>
</AtModalContent>
<AtModalAction> <Button onClick={this.consultModalClose.bind(this)} >取消</Button> <Button onClick={this.consultModalConfirm.bind(this)}>确定</Button> </AtModalAction>
<AtModalAction> <Button onClick={this.consultModalClose.bind(this)} >取消</Button> <Button className='orange' onClick={this.consultModalConfirm.bind(this)}>确定</Button> </AtModalAction>
</AtModal>
// 请提示元素
const toast = <AtToast
isOpened={this.state.isToast}
text={this.state.consultResponseMsg}
isOpened={this.state.isToast}
text={this.state.consultResponseMsg}
// iconSize={iconSize}
// iconType={iconType}
// iconColor={iconColor}
@ -259,8 +264,10 @@ class recommondShop extends Component {
<Image src={ads !== 0 ? hornIcon : houseIcon} style='width:12px; height:12px; vertical-align: middle;' />
<Text style='margin-left:2px; vertical-align: middle;'> {title}</Text>
</View>
<View className='consult-voucher-button' >
<Button onClick={this.isOpenVoucher.bind(this)} style='padding:0' className={voucherLeft ? 'voucher-button-text voucher' : 'voucher-button-text'} >优惠卷</Button>
<View className='consult-voucher-button' style='margin-right:5px'>
{voucherLeft ? <Button onClick={this.isOpenVoucher.bind(this)} style='padding:0' className='voucher-button-text voucher' >优惠卷</Button> : <Button style='padding:0' className='voucher-button-text'>优惠卷</Button>}
<Button onClick={this.isOpenConsult.bind(this)} style='padding:0' className='consult-button-text'>询价</Button>
</View>
@ -277,8 +284,8 @@ class recommondShop extends Component {
</View>
<View className='footer'>
<View className='address'>
<AtIcon value='map-pin' size='15' color='#FF7142'></AtIcon>
{address} </View>
<AtIcon value='map-pin' size='15' color='#999'></AtIcon>
<Text>{address} </Text> </View>
<View className='distance'><Text>{distance}</Text></View>
</View>

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

@ -9,8 +9,6 @@
.at-modal-content{
background-color: black
}
}
.tip-info{
@ -35,14 +33,16 @@
font-weight: bold;
font-size: 30px;
text-align: left;
// margin:20px;
overflow:hidden;
white-space:nowrap;
}
.consult-voucher-button{
flex:1;
//margin-top: 20px ;
margin-left: 200px;
margin-left: 50px;
display: flex;
//vertical-align: middle;
@ -124,11 +124,15 @@
.distance{
width: 30%;
text-align: right;
}
.address{
width:70%;
overflow:hidden;
white-space:nowrap;
}
}
}
.at-noticebar {
color:red;
}

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

@ -34,15 +34,14 @@ class SearchBarComponent extends Component {
render() {
return (
<View className='searchBarComponent'>
<View className='searchBar-box'>
<AtSearchBar className='search-button'
showActionButton
actionName='搜索'
value={this.state.value}
onChange={this.onChange.bind(this)}
onActionClick={this.onActionClick.bind(this)}
/>
</View>
</View>

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

@ -13,7 +13,5 @@
//
.search-button{
.at-search-bar__action{
background-color:#FF9900
}
}
font-size: 100px
}

156
src/component/sideBarFilterComponent/sideBarFilterComponent.js
View File

@ -1,156 +0,0 @@
import Taro, { Component } from '@tarojs/taro'
import { View,Button } from '@tarojs/components'
import { AtTag, AtButton} from 'taro-ui'
import URL from '../../serviceAPI.config'
import './sideBarFilterComponent.scss'
class sideBarFilterComponent extends Component {
// 项目配置
config = {
navigationBarTitleText: '筛选'
}
constructor() {
super(...arguments)
this.state = {
isActive:false
}
}
onClick(value){
console.log(value)
}
getSearchParam(){
Taro.request({
url: URL.GetSearchParam,
method: 'POST',
dataType: 'json',
data: {
goods: JSON.stringify({
shop_name: false,
shop_id: 808,
shop_class_id: "",
goods_type: 12
}),
goodsSpec: JSON.stringify([]),
goodsParam: JSON.stringify([]),
goodsParamExt: JSON.stringify([]),
},
header: {
'content-type': 'application/x-www-form-urlencoded',
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(res => {
console.log('param',res)
})
}
getSearchResult(){
Taro.request({
url: URL.SearchResult,
method: 'POST',
dataType: 'json',
data: {
goods: JSON.stringify({
curr_page: 1,
page_count: 50,
shop_name: false,
shop_id: 808,
config_id: 4,
shop_class_id: '',
goods_type:12
}),
goodsSpec: JSON.stringify([]),
goodsParam: JSON.stringify([]),
goodsParamExt: JSON.stringify([]),
},
header: {
'content-type': 'application/x-www-form-urlencoded',
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(res => {
console.log('result',res)
})
}
componentWillMount() {
}
componentDidMount() {
this.getSearchParam()
this.getSearchResult()
}
componentDidShow() { }
componentDidHide() { }
render() {
const goodsClass = this.props.FilterText?this.props.FilterText.goods_class:null
const goodsType = this.props.FilterText?this.props.FilterText.goods_type:null
const widthness = this.props.FilterText?this.props.FilterText.goodsParamExt['5'].param_value[0]:null
const goodsParam = this.props.FilterText? this.props.FilterText.goodsParam:null
// 分类
const goodsClassElementsArray=goodsClass.map((item,index)=>{
return <AtTag style='margin-left:5px' key={index}
name={item.class_name}
type='primary'
active={this.state.isActive}
onClick={this.onClick.bind(this)}
>{item.class_name}</AtTag>
})
// 商品类型
const goodsTypeElementsArray=goodsType.map((item,index)=>{
return <AtTag style='margin-left:5px' key={index}
name={item.goods_type_ch_name}
type='primary'
active={this.state.isActive}
onClick={this.onClick.bind(this)}
>{item.goods_type_ch_name}</AtTag>
})
//---------
const goodsParamElementsArray = goodsParam.map((item,index)=>{
return <View key={index}><View className='title' >{item.param_name}</View>
<View className='button-box'>
<AtTag style='margin-left:5px'
name={item.param_value[0]}
type='primary'
active={this.state.isActive}
onClick={this.onClick.bind(this)}
>{item.param_value[0]}</AtTag>
</View>
</View>
})
// 宽度
return (
<View className='filter-box'>
<View className='title'>分类</View>
<View className='button-box'>{goodsClassElementsArray}</View>
<View className='title'>商品类型</View>
<View className='button-box'>{goodsTypeElementsArray}</View>
{goodsParamElementsArray}
<View className='title'>宽度</View>
<View className='button-box'>
<AtTag style='margin-left:5px'
name={widthness.value_desc}
type='primary'
active={this.state.isActive}
onClick={this.onClick.bind(this)}
>{widthness.value_desc}</AtTag>
</View>
<View className='confirm-button'>
<Button className='button' type='primary' size='mini' style='background-color:#FF9900' >确认</Button>
<Button className='button' type='primary' size='mini' style='background-color:#FF9900'>重置</Button>
</View>
</View>
)
}
}
export default sideBarFilterComponent

18
src/component/sideBarFilterComponent/sideBarFilterComponent.scss
View File

@ -1,18 +0,0 @@
.filter-box{
height: 100%;
margin-top: 30px;
overflow: scroll;
.title{
margin-left: 20px;
font-size: 30px;
}
.button-box{
margin:20px
}
.confirm-button{
margin: 80px;
.button{
margin:0 20px
}
}
}

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

@ -1,6 +1,6 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Text, Image } from '@tarojs/components'
import { AtInput, AtButton, Picker, AtIcon, AtLoadMore, AtModal, AtToast } from 'taro-ui'
import { AtInput, AtButton, Picker, AtIcon, AtLoadMore, AtModal, AtToast } from 'taro-ui'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
import URL from '../../serviceAPI.config'
@ -25,6 +25,7 @@ class AllDemanding extends Component {
industryCateSelected: '全部', // 当前行业分类状态
startDateSel: '2018-04-22',
endDateSel: '2018-04-22',
startValidDate:'',
isOpenedGrabModal: false,
grabOrderId: '',//抢到订单的id
isGrabOrderSuccess: false,// 是否显示轻提示
@ -82,7 +83,8 @@ class AllDemanding extends Component {
//改变开始日期
onStartDateChange = e => {
this.setState({
startDateSel: e.detail.value
startDateSel: e.detail.value,
})
}
// 改变结束日期
@ -113,7 +115,7 @@ class AllDemanding extends Component {
this.setState({ isGrabOrderSuccess: false })
}, 1000)
}, 2000)
})
console.log('抢单请求：', res)
})
@ -151,7 +153,7 @@ class AllDemanding extends Component {
render() {
// 提示模态弹窗element
const modalMessageGrab = <AtModal className='modal'
const modalMessageGrabElement = <AtModal className='modal'
isOpened={this.state.isOpenedGrabModal}
title='提示'
cancelText='取消'
@ -162,10 +164,10 @@ class AllDemanding extends Component {
content='确认抢单？\n'
/>
// 抢单返回轻提示
const grabOrderSuccess = <AtToast
const grabOrderSuccessElement = <AtToast
isOpened={this.state.isGrabOrderSuccess}
text={this.state.grabOrderSuccess} // 轻提示字段显示不出来 to be continue
duration={1000}
text={this.state.grabOrderSuccess}
duration={2000}
></AtToast>
const allDemandingElementArray = this.state.supplys ? this.state.supplys.map((item, index) => {
return <View className='demanding-info' key={index}>
@ -201,9 +203,9 @@ class AllDemanding extends Component {
return (
<View className='allDemanding'>
{/* 模态框 */}
{modalMessageGrab}
{modalMessageGrabElement}
{/* 轻提示 */}
{grabOrderSuccess}
{grabOrderSuccessElement}
<View className='page-section'>
{/* 供求状态选择 */}
<View>
@ -217,6 +219,7 @@ class AllDemanding extends Component {
</Picker>
</View>
</View>
<View className='input-box'>
<Text className='require'>*</Text>
<AtInput
@ -238,7 +241,7 @@ class AllDemanding extends Component {
</View>
</View>
</Picker>
<Picker className='picker-container' mode='date' onChange={this.onEndDateChange}>
<Picker className='picker-container' mode='date' start={this.state.startDateSel} onChange={this.onEndDateChange}>
<View className='picker'>
<View className='title-box'>
<Text className='title'><Text className='require'>*</Text>结束日期:</Text> <Text className='selected'>{this.state.endDateSel}</Text>

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

@ -1,9 +1,8 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Text, Image , Swiper, SwiperItem} from '@tarojs/components'
import { AtTabs, AtTabsPane, AtSegmentedControl, AtIcon, AtToast, Picker } from 'taro-ui'
import { AtTabs, AtTabsPane, AtSegmentedControl, AtIcon, AtToast, Picker,AtSearchBar } from 'taro-ui'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
import SearchBarComponent from '../../component/searchBarComponent/searchBarComponent'
import URL from '../../serviceAPI.config'
@ -130,8 +129,14 @@ class Goods extends Component {
})
return (
<View className='gooods=container'>
<SearchBarComponent></SearchBarComponent>
<View className='img-box'>
<View className='searchBar-box'>
<AtSearchBar className='search-button'
actionName='搜索'
value={this.state.value}
onChange={this.onChange.bind(this)}
onActionClick={this.onActionClick.bind(this)}
/>
</View> <View className='img-box'>
{/* <Image className='img' src={URL.Base + this.state.productImagesUrl}></Image> */}
<Swiper
className='swipper'

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

@ -1,6 +1,10 @@
// border: 1px solid #ddd;
// padding: 5px 0;
.search-button{
.at-search-bar__action{
background-color:#FF7142
}
}
.img-box{
// border: 1px solid #ddd;
padding: 20px 0;

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

@ -1,9 +1,7 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Text, Radio, RadioGroup, Label } from '@tarojs/components'
import { AtInput, AtImagePicker, AtTextarea, AtButton, Picker, AtToast } from 'taro-ui'
import { AtInput, AtImagePicker, AtTextarea, AtButton, Picker, AtToast, AtSearchBar } from 'taro-ui'
import SearchBarComponent from '../../component/searchBarComponent/searchBarComponent'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
import URL from '../../serviceAPI.config'
@ -18,53 +16,13 @@ class GoodsPublish extends Component {
constructor() {
super(...arguments)
this.state = {
objectMultiArray: [
[
{
id: 0,
name: '无脊柱动物'
},
{
id: 1,
name: '脊柱动物'
}
],
[
{
id: 0,
name: '扁性动物'
},
{
id: 1,
name: '线形动物'
},
{
id: 2,
name: '环节动物'
},
{
id: 3,
name: '软体动物'
},
{
id: 3,
name: '节肢动物'
}
],
[
{
id: 0,
name: '猪肉绦虫'
},
{
id: 1,
name: '吸血虫'
}
]
],
multiIndex: [0, 0, 0],
shopCategoryPicker: [], // 店铺分类选项
shopCategoryCheckedPicker: {name:'选择店铺类型'},
shopCategoryCheckedPicker: { name: '选择店铺类型' },
productName: '',
productPrice: '',
productUnit: '',
@ -147,16 +105,15 @@ class GoodsPublish extends Component {
}
// 发布商品api
//{"goods_name":"hellol","goods_price":"1.00","goods_unit":"1","goods_profiles":"111","class_id":"2","shop_class_id":"1928"}
uploadGoods({ goods_name = "test2", goods_price = "1.00", goods_unit = "1", goods_profiles = "test2", class_id = "10103", shop_class_id = "1930" }) {
// 上传图片的参数
const uploadProductGoodFileParams = []
if (this.state.ImagesInfo.length) {
for (let i = 0; i < this.state.ImagesInfo.length; i++) {
if (i === 0) {
uploadProductGoodFileParams.push({
file_id:this.state.ImagesInfo[i].file_id,
file_id: this.state.ImagesInfo[i].file_id,
file_type: 1,
if_cover: 1,
file_sort: 1
@ -174,8 +131,6 @@ class GoodsPublish extends Component {
alert('图片为空')
}
Taro.request({
url: URL.UploadProduct,
method: 'POST',
@ -200,39 +155,50 @@ class GoodsPublish extends Component {
}
})
.then(res => {
this.setState({ uploadProductTextTip: '发布成功', isUploadProductSuccess: true })
console.log('上传商品', res) // 提示非法请求 ----- to be continue
this.setState({ uploadProductTextTip: '发布成功', isUploadProductSuccess: true }, () => {
setTimeout(() => {
this.setState({ isUploadProductSuccess: false })
Taro.navigateTo({
url: '/pages/goodsPublish/goodsPublish'
})
}, 2000)
})
console.log('上传商品', res)
}
)
.catch(error => {
this.setState({ uploadProductTextTip: '发布失败', isUploadProductSuccess: true })
this.setState({ uploadProductTextTip: '发布失败', isUploadProductSuccess: true }, () => {
setTimeout(() => {
this.setState({ isUploadProductSuccess: false })
}, 2000)
})
})
}
// 整理后台传出来的店铺分类目录
sortShopCateToState(shopData) {
const firstColumn = []
const secondColumn = []
const thirdColumn = []
for (let outterItem of shopData) {
firstColumn.push({ id: outterItem.class_id, name: outterItem.class_name })
firstColumn.push({ id: outterItem.class_id, class_name: outterItem.class_name })
if (outterItem.children.length) {
for (let middleItem of outterItem.children) {
secondColumn.push({ id: middleItem.class_id, name: middleItem.class_name })
secondColumn.push({ id: middleItem.class_id, class_name: middleItem.class_name })
if (middleItem.children.length) {
for (let innerItem of middleItem.children) {
thirdColumn.push({ id: innerItem.class_id, name: innerItem.class_name })
thirdColumn.push({ id: innerItem.class_id, class_name: innerItem.class_name })
}
break
}
}
}
}
//------- 把新指传给objectMultiArray之后就不可以用了 to be continue
// console.log('old',this.state.objectMultiArray)
// this.setState({objectMultiArray:[firstColumn,secondColumn,thirdColumn]},()=>{
// console.log('new', this.state.objectMultiArray)
// })
this.setState({ objectMultiArray: [firstColumn, secondColumn, thirdColumn] }, () => {
console.log('new', this.state.objectMultiArray)
})
}
// 改变商品分类状态
@ -266,7 +232,7 @@ class GoodsPublish extends Component {
const that = this
if (operationType === 'add') {
Taro.uploadFile({
url: URL.UploadPorductImage, // 仅为示例，非真实的接口地址
url: URL.UploadPorductImage,
filePath: files[files.length - 1].url,
name: 'file',
formData: {
@ -283,7 +249,9 @@ class GoodsPublish extends Component {
const newPickerImageUrl = that.state.pickerImageUrl.concat({ url: imagePath })
const newImageInfo = that.state.ImagesInfo.concat(data)
that.setState({ pickerImageUrl: newPickerImageUrl, isUploadImageSuccess: true, uploadImageTextTip: '图片上传成功', ImagesInfo: newImageInfo }, () => {
// console.log(that.state.ImagesInfo)
setTimeout(() => {
that.setState({ isUploadImageSuccess: false })
}, 2000)
})
}
})
@ -291,7 +259,11 @@ class GoodsPublish extends Component {
if (operationType === 'remove') {
this.state.pickerImageUrl.splice(index, 1);
this.setState({ files: this.state.pickerImageUrl });
that.setState({ isUploadImageSuccess: true, uploadImageTextTip: '删除成功' })
that.setState({ isUploadImageSuccess: true, uploadImageTextTip: '删除成功' }, () => {
setTimeout(() => {
that.setState({ isUploadImageSuccess: false })
}, 2000)
})
}
}
// 图片上传失败
@ -302,7 +274,7 @@ class GoodsPublish extends Component {
onImageClick(index) {
}
onClickUploadGoods() {
if (this.state.productName && this.state.productPrice && this.state.productUnit && this.state.ImagesInfo.length) {
if (this.state.productName && this.state.productPrice && this.state.productUnit && this.state.ImagesInfo.length && this.state.shopCategoryCheckedPicker.id) {
this.uploadGoods({
goods_name: this.state.productName,
goods_price: this.state.productPrice,
@ -310,11 +282,13 @@ class GoodsPublish extends Component {
goods_profiles: this.state.productDescript,
class_id: "10103",
shop_class_id: this.state.shopCategoryCheckedPicker,
})
} else {
this.setState({ uploadProductTextTip: '请填写完表格', isUploadProductSuccess: true })
this.setState({ uploadProductTextTip: '请填写完表格', isUploadProductSuccess: true }, () => {
setTimeout(() => {
this.setState({ isUploadProductSuccess: false })
}, 2000)
})
}
}
shopCategoryChanged(e) {
@ -359,42 +333,21 @@ class GoodsPublish extends Component {
case 0:
switch (data.multiIndex[0]) {
case 0:
data.multiArray[1] = [
{
id: 0,
name: '01'
},
{
id: 1,
name: '10a'
}
]
data.multiArray[2] = [{
id: 0,
name: '02'
},
{
id: 1,
name: '02a'
}]
data.multiArray[1] = this.state.productCategoryList[0].children ? this.state.productCategoryList[0].children : [{ class_name: '' }]
data.multiArray[2] = this.state.productCategoryList[0].children ? this.state.productCategoryList[0].children : [{ class_name: '' }]
break
case 1:
data.multiArray[1] = [{
id: 0,
name: '11'
},
{
id: 1,
name: '11a'
}]
data.multiArray[2] = [{
id: 0,
name: '12'
},
{
id: 1,
name: '12a'
}]
data.multiArray[1] = this.state.productCategoryList[1].children
break
case 2:
data.multiArray[1] = this.state.productCategoryList[2].children
break
case 3:
data.multiArray[1] = this.state.productCategoryList[3].children
break
case 4:
data.multiArray[1] = this.state.productCategoryList[4].children
break
}
data.multiIndex[1] = 0
@ -403,109 +356,84 @@ class GoodsPublish extends Component {
case 1:
switch (data.multiIndex[0]) {
case 0:
switch (data.multiIndex[1]) {
case 0:
data.multiArray[2] = [{
id: 0,
name: '无脊柱动物'
},
{
id: 1,
name: '脊柱动物'
}]
break
case 1:
data.multiArray[2] = [
{
id: 1,
name: '脊柱动物'
}]
break
case 2:
data.multiArray[2] = [{
id: 0,
name: '无脊柱动物'
},
{
id: 1,
name: '脊柱动物'
}]
break
case 3:
data.multiArray[2] = [{
id: 0,
name: '无脊柱动物'
},
{
id: 1,
name: '脊柱动物'
}, {
id: 0,
name: '无脊柱动物'
},
{
id: 1,
name: '脊柱动物'
}]
break
case 4:
data.multiArray[2] = [{
id: 0,
name: '无脊柱动物'
},
{
id: 1,
name: '脊柱动物'
}]
break
}
break
case 1:
switch (data.multiIndex[1]) {
case 0:
data.multiArray[2] = [{
id: 0,
name: '蛇'
},
{
id: 1,
name: '青蛙'
}]
data.multiArray[2] = this.state.productCategoryList[1].children[0].children
break
case 1:
data.multiArray[2] = [{
id: 0,
name: '蛇'
},
{
id: 1,
name: '青蛙'
}, {
id: 0,
name: '蛇'
},
{
id: 1,
name: '青蛙'
}]
data.multiArray[2] = this.state.productCategoryList[1].children[1].children
break
case 2:
data.multiArray[2] = [{
id: 0,
name: '蛇'
},
{
id: 1,
name: '青蛙'
}]
data.multiArray[2] = this.state.productCategoryList[1].children[2].children
break
case 3:
data.multiArray[2] = this.state.productCategoryList[1].children[3].children ? this.state.productCategoryList[1].children[3].children : [{ class_name: '' }]
break
}
break
case 2:
switch (data.multiIndex[1]) {
case 0:
data.multiArray[2] = this.state.productCategoryList[2].children[0].children
break
case 1:
data.multiArray[2] = this.state.productCategoryList[2].children[1].children
break
case 2:
data.multiArray[2] = this.state.productCategoryList[2].children[2].children
break
case 3:
data.multiArray[2] = this.state.productCategoryList[2].children[3].children
break
case 4:
data.multiArray[2] = this.state.productCategoryList[2].children[4].children
break
case 5:
data.multiArray[2] = this.state.productCategoryList[2].children[5].children
break
}
break
case 3:
switch (data.multiIndex[1]) {
case 0:
data.multiArray[2] = this.state.productCategoryList[3].children[0].children
break
case 1:
data.multiArray[2] = this.state.productCategoryList[3].children[1].children
break
case 2:
data.multiArray[2] = this.state.productCategoryList[3].children[2].children
break
case 3:
data.multiArray[2] = this.state.productCategoryList[3].children[3].children ? this.state.productCategoryList[3].children[3].children : [{ class_name: '' }]
break
case 3:
data.multiArray[2] = this.state.productCategoryList[3].children[3].children ? this.state.productCategoryList[3].children[3].children : [{ class_name: '' }]
break
}
break
case 4:
switch (data.multiIndex[1]) {
case 0:
data.multiArray[2] = this.state.productCategoryList[4].children[0].children
break
case 1:
data.multiArray[2] = this.state.productCategoryList[4].children[1].children
break
case 2:
data.multiArray[2] = this.state.productCategoryList[4].children[2].children
break
}
break
}
data.multiIndex[2] = 0
break
}
console.log(data.multiIndex)
this.setState({ multiIndex: data.multiIndex })
}
@ -513,33 +441,40 @@ class GoodsPublish extends Component {
const imageUploadSuccess = <AtToast
isOpened={this.state.isUploadImageSuccess}
text={this.state.uploadImageTextTip}
duration={1000}
duration={2000}
></AtToast>
const productUploadSuccess = <AtToast
isOpened={this.state.isUploadProductSuccess}
text={this.state.uploadProductTextTip}
duration={1000}
duration={2000}
></AtToast>
return (
<View className='goods-publish'>
{imageUploadSuccess}
{productUploadSuccess}
<SearchBarComponent></SearchBarComponent>
<View className='searchBar-box'>
<AtSearchBar className='search-button'
actionName='搜索'
value={this.state.value}
onChange={this.onChange.bind(this)}
onActionClick={this.onActionClick.bind(this)}
/>
</View>
<View className='goods-category'>
<View className='page-section'>
<View>
<Picker mode='selector'
<Picker
range={this.state.objectMultiArray}
onChange={this.bindMultiPickerChange.bind(this)}
rangeKey='name'
mode="multiSelector"
rangeKey='class_name'
mode='multiSelector'
onColumnchange={this.bindMultiPickerCol.bind(this)}
value={this.state.multiIndex}
>
<View className='picker'>
<View className='title-box'>
<Text className='title'><Text className='require'>*</Text>商品分类:</Text> <Text className='selected'>
{/* {this.state.multiArray[0][this.state.multiIndex[0]].name}{this.state.multiArray[1][this.state.multiIndex[1]].name}{this.state.multiArray[2][this.state.multiIndex[2]].name} */}
{this.state.objectMultiArray[0][this.state.multiIndex[0]].class_name}{this.state.objectMultiArray[1][this.state.multiIndex[1]].class_name}{this.state.objectMultiArray[2][this.state.multiIndex[2]].class_name}
</Text>
</View>
@ -626,13 +561,13 @@ class GoodsPublish extends Component {
</View>
</View>
<View className='button-box'>
<View className='button'>
<View className='button-box' >
<View className='button' >
<AtButton type='primary' size='small' onClick={this.onClickUploadGoods.bind(this)}>发布</AtButton>
</View>
<View className='button'>
<AtButton type='primary' className='button-a' size='small'>发布并新增</AtButton>
</View>
{/* <View className='button'>
<AtButton type='primary' className='button-a' size='small' >发布并新增</AtButton>
</View> */}
<View className='button'>
<AtButton type='primary' className='button-a' size='small'>商品列表</AtButton>
</View>

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

@ -1,3 +1,10 @@
.search-button{
.at-search-bar__action{
background-color:#FF7142
}
}
.goods-category{
padding: 10px 20px;
.border-box{
@ -78,10 +85,8 @@
flex:1;
text-align: center;
.at-button--primary{
background-color:#FF9500;
border:1PX solid #FF9500;
background-color:#FF7142;
border:1PX solid #FF7142;
}
.button-a{
background-color:#5cb85c;

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

@ -1,10 +1,11 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text, Swiper, SwiperItem, Image, } from '@tarojs/components'
import { AtModal, AtButton, AtToast } from 'taro-ui'
import { AtModal, AtButton, AtToast,AtModalHeader ,AtModalContent,AtModalAction} from 'taro-ui'
import filteredShopComponent from '../../component/filteredShopComponent/filteredShopComponent'
import bottomNav from '../../component/bottomNav/bottomNav'
import URL from '../../serviceAPI.config'
import './home.scss'
class Home extends Component {
config = {
@ -23,7 +24,7 @@ class Home extends Component {
isOpen: false, // 抢单消息提示
grabOrderId: '',//抢到订单的id
isGrabOrderSuccess: false,// 是否显示轻提示
grabOrderSuccess: '无法显示绑定后的字段',// 抢单成功返回字段
grabOrderSuccess: '',// 抢单成功返回字段
}
}
@ -147,13 +148,10 @@ class Home extends Component {
}
})
.then(res => {
this.setState({ grabOrderSuccess: res.data.err_msg,isGrabOrderSuccess: true }, () => {
setTimeout(() => {
console.log(this.state.grabOrderSuccess)
this.setState({ isGrabOrderSuccess: false })
}, 1000)
}, 2000)
})
console.log('抢单请求：', res)
@ -221,22 +219,23 @@ class Home extends Component {
render() {
// 提示模态弹窗element
const modalMessageGrab = <AtModal className='modal'
isOpened={this.state.isOpen}
title='提示'
cancelText='取消'
confirmText='确认'
onClose={this.handleGrabModalClose}
onCancel={this.handleGrabModalCancel}
onConfirm={this.handleGrabConfirm.bind(this)}
content='确认抢单？\n'
/>
// 提示模态弹窗element
const modalMessageGrabElement=<AtModal isOpened={this.state.isOpen}>
<AtModalHeader>提示</AtModalHeader>
<AtModalContent>
确认抢单？
</AtModalContent>
<AtModalAction> <Button onClick={this.handleGrabModalCancel.bind(this)}>取消</Button> <Button className='orange' onClick={this.handleGrabConfirm.bind(this)}>确定</Button> </AtModalAction>
</AtModal>
// 抢单返回轻提示
const grabOrderSuccess = <AtToast
const grabOrderSuccessElement = <AtToast
isOpened={this.state.isGrabOrderSuccess}
text={this.state.grabOrderSuccess} // 轻提示字段显示不出来 to be continue
duration={1000}
text={this.state.grabOrderSuccess}
duration={2000}
></AtToast>
@ -296,12 +295,11 @@ class Home extends Component {
return (
<View className='home'>
{/* 抢单成功预付轻提示 */}
{grabOrderSuccess}
{grabOrderSuccessElement}
{/* 获取微信用户的信息 */}
{/* <AtButton open-type='getUserInfo' lang='zh_CN' type='primary' size='normal' onGetUserInfo={this.onGotUserInfo.bind(this)}>获取微信用户的信息</AtButton> */}
{modalMessageGrab}
{/* 第一行图片滚动条 */}
{modalMessageGrabElement}
<View className='first-banner'>
<Swiper

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

@ -28,8 +28,8 @@ class Index extends Component {
//http://ihome6.com/Shop-supplyShops
componentDidMount(){
Taro.navigateTo({
// url: '/pages/allDemanding/allDemanding'
url: '/pages/home/home'
url: '/pages/goodsPublish/goodsPublish'
// url: '/pages/mySupplyDemand/mySupplyDemand'
// url:'/pages/supplyDemandPublish/supplyDemandPublish'
})
}

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

@ -1,10 +1,9 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
import { AtInput, AtButton, Picker, AtIcon } from 'taro-ui'
import { AtInput, AtButton, Picker, AtIcon, AtModal, AtToast ,AtSearchBar} from 'taro-ui'
import URL from '../../serviceAPI.config'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
import searchBarComponent from '../../component/searchBarComponent/searchBarComponent'
import './mySupplyDemand.scss'
@ -27,12 +26,17 @@ class MySupplyDemand extends Component {
startDateSel: '2018-04-22',
endDateSel: '2018-04-22',
allDemandSupply: [],
totalDemandSupply:'',
totalDemandSupply: '',
isToast: false,// 是否显示轻提示
toastContent: '', // 轻提示内容
isConfirmWindow: false, // 是否显示确认弹窗
demandSupplyItemName: '',// 确认框提示时 使用的供求名
demandSupplyId: '',// 删除我的供求时的供求id
}
}
//MySupplyDemand
//获取我的供求API
getMySupplyDemand({ curr_page = 1, page_count = 20 }) {
Taro.request({
url: URL.MySupplyDemand,
@ -51,16 +55,99 @@ class MySupplyDemand extends Component {
'X-Requested-With': 'XMLHttpRequest'
}
}).then(res => {
console.log(res) // ------------------------------------------- to be continue----
// console.log('个人供求=》暂时无数据， 后台需要权限验证')
if (res.data.err_msg === "success") {
this.setState({ allDemandSupply: res.data.supplys,totalDemandSupply:res.data.count })
// 判断是否有res.data.supplys ， 如果没有就是空数组[]
this.setState({ allDemandSupply: res.data.supplys?res.data.supplys:[], totalDemandSupply: res.data.count })
}
})
}
//搜索我的供求api
searchDemandSupply({ curr_page = 1, page_count = 20, sd_type = "2", state = "1", sd_title = "1", update_dateL = "2018-12-18", update_dateU = "2018-12-20" }) {
Taro.request({
url: URL.SearchDemandSupply,
method: 'POST',
dataType: 'json',
data: {
param: JSON.stringify({
curr_page: curr_page,
page_count: page_count,
sd_type: sd_type,
state: state,
sd_title: sd_title,
update_dateL: update_dateL,
update_dateU: update_dateU
})
},
header: {
'content-type': 'application/x-www-form-urlencoded',
'Cookie': 'PFWSSS=' + Taro.getStorageSync('session_id'),
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(res => {
//this.setState({ grabOrderSuccess: res.data.err_msg,isGrabOrderSuccess: true })
console.log('我的供求搜索结果', res)
this.setState({ allDemandSupply: res.data.supplys, totalDemandSupply: res.data.count })
})
}
// 删除我的供求api
onDelete({ sdID = 0 }) {
Taro.request({
url: URL.DeleteDemandSupply,
method: 'POST',
dataType: 'json',
data: {
sdID: sdID
},
header: {
'content-type': 'application/x-www-form-urlencoded',
'Cookie': 'PFWSSS=' + Taro.getStorageSync('session_id'),
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(res => {
if (res.data.err_msg == 'success') {
console.log('删除成功')
this.setState({ toastContent: '删除成功', isToast: true }, () => {
setTimeout(() => {
this.setState({ isToast: false })
this.getMySupplyDemand({})
}, 2000)
})
}else{
this.setState({ toastContent: res.data.err_msg, isToast: true }, () => {
setTimeout(() => {
this.setState({ isToast: false })
}, 2000)
})
}
}
)
.catch(error => {
this.setState({ toastContent: '删除失败', isToast: true }, () => {
setTimeout(() => {
this.setState({ isToast: false })
}, 2000)
})
})
}
//搜索我的供求
// 新增我的供求
addDemandSupply() {
Taro.navigateTo({
url: '/pages/supplyDemandPublish/supplyDemandPublish'
})
}
//修改供求类型
@ -90,6 +177,29 @@ class MySupplyDemand extends Component {
endDateSel: e.detail.value
})
}
handleWindowModClose() {
this.setState({ isConfirmWindow: false })
}
handleWindowModCancel() {
this.setState({ isConfirmWindow: false })
}
handleWindowConfirm() {
this.setState({ isConfirmWindow: false })
this.onDelete({ sdID: this.state.demandSupplyId })
}
// 删除我的供求
handleOnDelete(id, itemName) {
this.setState({ isConfirmWindow: true, demandSupplyItemName: itemName, demandSupplyId: id })
}
// 编辑我的供求
//查看我的供求
componentWillReceiveProps(nextProps) {
console.log(this.props, nextProps)
}
@ -104,8 +214,25 @@ class MySupplyDemand extends Component {
componentDidHide() { }
render() {
// 提示模态弹窗element
const modalMessageConfirmElement = <AtModal className='modal'
isOpened={this.state.isConfirmWindow}
title='提示'
cancelText='取消'
confirmText='确认'
onClose={this.handleWindowModClose}
onCancel={this.handleWindowModCancel}
onConfirm={this.handleWindowConfirm.bind(this)}
content={'确认删除' + this.state.demandSupplyItemName + '？'}
/>
// 轻提示
const toastElement = <AtToast
isOpened={this.state.isToast}
text={this.state.toastContent}
duration={2000}
></AtToast>
const demandSupplyElementArray = this.state.allDemandSupply.length ? this.state.allDemandSupply.map((item, index) => {
return <View key={index} className='info-container'>
return <View key={index} className='info-container'>
<View className='type'>
<Text className='title'>需求类型：</Text>
<Text className='info'>{item.type_name}</Text>
@ -137,17 +264,32 @@ class MySupplyDemand extends Component {
<View className='button'>
<AtButton type='primary' size='small'>编辑</AtButton>
</View>
<View className='button'>
<View className='button' onClick={this.handleOnDelete.bind(this, item.sd_id, item.sd_title)}>
<AtButton type='primary' className='button-a' size='small'>删除</AtButton>
</View>
</View>
</View>
}) : null
}) : <View className='title' >
没有更多了....
</View >
return (
<View className='mySupplyDemand'>
<searchBarComponent></searchBarComponent>
{/* 是否删除供求确认框 */}
{modalMessageConfirmElement}
{/* 轻提示 */}
{toastElement}
<View className='searchBar-box'>
<AtSearchBar className='search-button'
actionName='搜索'
value={this.state.value}
onChange={this.onChange.bind(this)}
onActionClick={this.onActionClick.bind(this)}
/>
</View>
{/* 供求类型 */}
<View className='page-section'>
<View>
@ -209,12 +351,12 @@ class MySupplyDemand extends Component {
</View>
<View className='button-box'>
<View className='button'>
<View className='button' onClick={this.searchDemandSupply.bind(this)}>
<AtButton type='primary' size='small'>
<AtIcon value='search' size='12' color='white'></AtIcon>
搜索</AtButton>
</View>
<View className='button'>
<View className='button' onClick={this.addDemandSupply.bind(this)}>
<AtButton type='primary' className='button-a' size='small'>
<AtIcon value='add' size='12' color='white'></AtIcon>
新增</AtButton>

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

@ -4,6 +4,12 @@
.require{
color:red;
line-height:100rpx;
}
.search-button{
.at-search-bar__action{
background-color:#FF7142
}
}
.total-count{
text-align: right;
@ -71,8 +77,8 @@
flex:1;
text-align: center;
.at-button--primary{
background-color:#FF9500;
border:1PX solid #FF9500;
background-color:#FF7142;
border:1PX solid #FF7142;
}
.button-a{
@ -120,3 +126,8 @@
}
}
.title{
text-align: center;
font-size: 35px;
}

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

@ -407,8 +407,8 @@ class Shop extends Component {
>{widthness.value_desc}</AtTag> */}
</View>
<View className='confirm-button'>
<Button className='button' type='primary' size='mini' style='background-color:#FF9900' >确认</Button>
<Button className='button' type='primary' size='mini' style='background-color:#FF9900'>重置</Button>
<Button className='button' type='primary' size='mini' style='background-color:#FF7142' >确认</Button>
<Button className='button' type='primary' size='mini' style='background-color:#5cb85c'>重置</Button>
<View className='gap'></View>
</View>
</View>

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

@ -2,7 +2,7 @@
.shop{
.search-button{
.at-search-bar__action{
background-color:#FF9900
background-color:#FF7142
}
}
}
@ -106,7 +106,9 @@
}
.show{
left:0px
left:0px;
width:100%;
}

234
src/pages/supplyDemandPublish/supplyDemandPublish.js
View File

@ -1,8 +1,7 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
import { AtInput, AtImagePicker, AtTextarea, AtButton, Picker } from 'taro-ui'
import SearchBarComponent from '../../component/searchBarComponent/searchBarComponent'
import { AtInput, AtImagePicker, AtTextarea, AtButton, Picker, AtToast,AtSearchBar } from 'taro-ui'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
import URL from '../../serviceAPI.config'
@ -29,57 +28,88 @@ class SupplyDemand extends Component {
contactNumber: '',
contactAddress: '',
content: '',
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',
}]
pickerImageUrl: [], // 上传的图片
ImagesInfo: [],// 后台传回来的图片信息
isUploadImageSuccess: false,
uploadImageTextTip: '',
isFormCompleted: false,
isUploadDemSupSuccess: false,
uploadDemSupTextTip: '',
}
}
// 上传供求api
uploadSupplyDemand() {
Taro.request({
url: URL.UploadSupplyDemand,
method: 'POST',
dataType: 'json',
data: {
action: 1,
sdInfo: JSON.stringify({ "sd_type": "2", "sd_title": "534523", "user_name": "杨夕兵", "user_phone": "18950295811", "user_address": "2342", "sd_desc": "42342", "state": "1", "file_path": [{ "file_name": "bg3.jpg", "file_size": "212678", "file_path": "Uploads/supply/user_27/201812/38bf91f30d215bbefb2686f2401217a6.jpg", "thumb_path": "Uploads/supply/user_27/201812/thumb/38bf91f30d215bbefb2686f2401217a6_200X200.jpg" }] })
},
header: {
'content-type': 'application/x-www-form-urlencoded',
}
})
.then(res => {
console.log('上传供求', res)
}
)
if (this.state.demandingSupplyCateSelected && this.state.title && this.state.contactName && this.state.contactNumber && this.state.contactAddress && this.state.content && this.state.demandingSupplyStateSelected) {
this.uploadDemSup({})
} else {
this.setState({ uploadDemSupTextTip: '请填写完表格', isUploadDemSupSuccess: true }, () => {
setTimeout(() => {
this.setState({ isUploadDemSupSuccess: false })
}, 2000)
})
}
// Taro.request({
// url: URL.UploadSupplyDemand,
// method: 'POST',
// dataType: 'json',
// data: {
// action: 1,
// sdInfo: JSON.stringify({ "sd_type": "2", "sd_title": "534523", "user_name": "杨夕兵", "user_phone": "18950295811", "user_address": "2342", "sd_desc": "42342", "state": "1", "file_path": [{ "file_name": "bg3.jpg", "file_size": "212678", "file_path": "Uploads/supply/user_27/201812/38bf91f30d215bbefb2686f2401217a6.jpg", "thumb_path": "Uploads/supply/user_27/201812/thumb/38bf91f30d215bbefb2686f2401217a6_200X200.jpg" }] })
// },
// header: {
// 'content-type': 'application/x-www-form-urlencoded',
// }
// })
// .then(res => {
// console.log('上传供求', res)
// }
// )
}
// 上传商品图片api
uploadGoodsImage() {
Taro.request({
url: URL.UploadPorductImage,
method: 'POST',
dataType: 'json',
data: {
file: 1,
},
header: {
'content-type': 'application/x-www-form-urlencoded',
}
})
.then(res => {
console.log('上传商品图片', res)
}
)
// 这个需要写一个uploadDemSup 上传供求 的api
// 上传图片
onChangeImg(files, operationType, index) {
const that = this
if (operationType === 'add') {
Taro.uploadFile({
url: URL.UploadPorductImage,
filePath: files[files.length - 1].url,
name: 'file',
formData: {
user: 'test'
},
header: {
'content-type': 'multipart/form-data',
'Cookie': 'PFWSSS=' + Taro.getStorageSync('session_id'),
'X-Requested-With': 'XMLHttpRequest'
},
success(response) {
const data = JSON.parse(response.data)
const imagePath = URL.Base + data.file_path
const newPickerImageUrl = that.state.pickerImageUrl.concat({ url: imagePath })
const newImageInfo = that.state.ImagesInfo.concat(data)
that.setState({ pickerImageUrl: newPickerImageUrl, isUploadImageSuccess: true, uploadImageTextTip: '图片上传成功', ImagesInfo: newImageInfo }, () => {
setTimeout(() => {
that.setState({ isUploadImageSuccess: false })
}, 2000)
})
}
})
}
if (operationType === 'remove') {
this.state.pickerImageUrl.splice(index, 1);
this.setState({ files: this.state.pickerImageUrl });
that.setState({ isUploadImageSuccess: true, uploadImageTextTip: '删除成功' }, () => {
setTimeout(() => {
that.setState({ isUploadImageSuccess: false })
}, 2000)
})
}
}
// 修改供求类型
demandingSupplyCate = e => {
@ -109,34 +139,10 @@ class SupplyDemand extends Component {
contentChange(event) {
this.setState({ content: event.target.value })
}
// 添加图片
onChange(files, operationType, index) {
console.log(files[0].url)
Taro.uploadFile(files[0].url).then((res)=>{
console.log(res)
})
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)
}
componentDidMount(){
this.uploadSupplyDemand()
componentDidMount() {
// this.uploadSupplyDemand()
}
componentWillReceiveProps(nextProps) {
console.log(this.props, nextProps)
@ -149,11 +155,31 @@ class SupplyDemand extends Component {
componentDidHide() { }
render() {
const imageUploadSuccessElement = <AtToast
isOpened={this.state.isUploadImageSuccess}
text={this.state.uploadImageTextTip}
duration={2000}
></AtToast>
const demandSupplyUploadSuccessElement = <AtToast
isOpened={this.state.isUploadDemSupSuccess}
text={this.state.uploadDemSupTextTip}
duration={2000}
></AtToast>
return (
<View className='supply-demand'>
<SearchBarComponent></SearchBarComponent>
{/* 图片上传模态框 */}
{imageUploadSuccessElement}
{/* 商品发布模态框 */}
{demandSupplyUploadSuccessElement}
<View className='searchBar-box'>
<AtSearchBar className='search-button'
actionName='搜索'
value={this.state.value}
onChange={this.onChange.bind(this)}
onActionClick={this.onActionClick.bind(this)}
/>
</View>
<View className='page-section'>
<View>
<Picker mode='selector' range={this.state.demandingSupplyCate} onChange={this.demandingSupplyCate.bind(this)}>
<View className='picker'>
@ -167,31 +193,31 @@ class SupplyDemand extends Component {
</View>
<View className='border-box'>
<Text className='require'>*</Text><AtInput
name='value'
title='需求标题：'
type='text'
value={this.state.title}
onChange={this.titleChange.bind(this)}
name='value'
title='需求标题：'
type='text'
value={this.state.title}
onChange={this.titleChange.bind(this)}
/>
</View>
<View className='input-box'>
<Text className='require'>*</Text>
<AtInput
name='value'
title='联系人：'
type='text'
value={this.state.contactName}
onChange={this.contactNameChange.bind(this)}
name='value'
title='联系人：'
type='text'
value={this.state.contactName}
onChange={this.contactNameChange.bind(this)}
/>
</View>
<View className='input-box'>
<Text className='require'>*</Text>
<AtInput
name='value'
title='联系电话：'
type='number'
value={this.state.contactNumber}
onChange={this.contactNumberChange.bind(this)}
name='value'
title='联系电话：'
type='number'
value={this.state.contactNumber}
onChange={this.contactNumberChange.bind(this)}
/>
</View>
<View className='demanding-box'>
@ -200,10 +226,10 @@ class SupplyDemand extends Component {
</View>
<AtTextarea
value={this.state.contactAddress}
onChange={this.contactAddressChange.bind(this)}
maxlength='200'
placeholder='联系地址'
value={this.state.contactAddress}
onChange={this.contactAddressChange.bind(this)}
maxlength='200'
placeholder='联系地址'
/>
</View>
<View className='demanding-box'>
@ -211,10 +237,10 @@ class SupplyDemand extends Component {
<Text className='title'><Text className='require'>*</Text>需求内容:</Text>
</View>
<AtTextarea
value={this.state.content}
onChange={this.contentChange.bind(this)}
maxlength='200'
placeholder=''
value={this.state.content}
onChange={this.contentChange.bind(this)}
maxlength='200'
placeholder=''
/>
</View>
<View className='img-box'>
@ -225,11 +251,11 @@ class SupplyDemand extends Component {
<View className='img-container'>
<AtImagePicker
showAddBtn={this.state.addImg}
files={this.state.files}
onChange={this.onChange.bind(this)}
onFail={this.onFail.bind(this)}
onImageClick={this.onImageClick.bind(this)}
multiple
files={this.state.pickerImageUrl}
onChange={this.onChangeImg.bind(this)}
onFail={this.onFail.bind(this)}
onImageClick={this.onImageClick.bind(this)}
/>
</View>
@ -249,7 +275,7 @@ class SupplyDemand extends Component {
</View>
<View className='button-box'>
<View className='button'>
<View className='button' onClick={this.uploadSupplyDemand.bind(this)}>
<AtButton type='primary' size='small'>发布</AtButton>
</View>
<View className='button'>

9
src/pages/supplyDemandPublish/supplyDemandPublish.scss
View File

@ -1,5 +1,10 @@
.supply-demand{
padding: 10px 20px;
.search-button{
.at-search-bar__action{
background-color:#FF7142
}
}
.border-box{
border-bottom: 1Px solid #d6e4ef;
display: flex
@ -28,8 +33,8 @@
flex:1;
text-align: center;
.at-button--primary{
background-color:#FF9500;
border:1PX solid #FF9500;
background-color:#FF7142,;
border:1PX solid #FF7142,;
}
.button-a{
background-color:#5cb85c;

656
src/pages/test.js
View File

@ -1,656 +0,0 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Text, Radio, RadioGroup, Label } from '@tarojs/components'
import { AtInput, AtImagePicker, AtTextarea, AtButton, Picker, AtToast } from 'taro-ui'
import SearchBarComponent from '../../component/searchBarComponent/searchBarComponent'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
import Test3 from '../../component/Test3/Test3'
import URL from '../../serviceAPI.config'
import './goodsPublish.scss'
import { throws } from 'assert';
class GoodsPublish extends Component {
config = {
navigationBarTitleText: '商品发布'
}
constructor() {
super(...arguments)
this.state = {
objectMultiArray: [
[
{
id: 0,
name: '无脊柱动物'
},
{
id: 1,
name: '脊柱动物'
}
],
[
{
id: 0,
name: '扁性动物'
},
{
id: 1,
name: '线形动物'
},
{
id: 2,
name: '环节动物'
},
{
id: 3,
name: '软体动物'
},
{
id: 3,
name: '节肢动物'
}
],
[
{
id: 0,
name: '猪肉绦虫'
},
{
id: 1,
name: '吸血虫'
}
]
],
multiIndex: [0, 0, 0],
shopCategoryPicker: [], // 店铺分类选项
shopCategoryCheckedPicker: {name:'选择店铺类型'},
productName: '',
productPrice: '',
productUnit: '',
productDescript: '',
pickerImageUrl: [], // 上传的图片
ImagesInfo: [],// 后台传回来的图片信息
isUploadImageSuccess: false,
uploadImageTextTip: '',
isUploadProductSuccess: false,
uploadProductTextTip: '',
}
}
//商品目录请求api GetShopCategoryList
getProductCateList() {
Taro.request({
url: URL.GetProductCategoryList,
method: 'POST',
dataType: 'json',
header: {
'content-type': 'application/x-www-form-urlencoded',
'Cookie': 'PFWSSS=' + Taro.getStorageSync('session_id'),
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(res => {
if (res.data.err_msg === 'success') {
this.setState({ productCategoryList: res.data.data })
console.log('商品分类目录', res)
this.sortShopCateToState(res.data.data)
}
}
)
.catch(error => {
console.log('商品分类请求错误', error)
})
}
// 店铺分类目录请求 api
getShopCateList() {
Taro.request({
url: URL.GetShopCategoryList,
method: 'POST',
dataType: 'json',
data: {
id: Taro.getStorageSync('shopInfo').shop_id
},
header: {
'content-type': 'application/x-www-form-urlencoded',
'Cookie': 'PFWSSS=' + Taro.getStorageSync('session_id'),
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(res => {
if (res.data.err_msg === 'success') {
this.setState({ shopCategoryList: res.data.data })
const shopCategoryInfo = res.data.data
const shopCategory = []
// 处理后台返回的店铺分类信息
for (let item in shopCategoryInfo) {
const children = shopCategoryInfo[item].c
for (let child in children) {
shopCategory.push({ id: children[child].id, name: children[child].n })
}
}
this.setState({ shopCategoryPicker: shopCategory })
console.log('店铺分类目录', res)
}
}
)
.catch(error => {
console.log('店铺分类请求错误', error)
})
}
// 发布商品api
//{"goods_name":"hellol","goods_price":"1.00","goods_unit":"1","goods_profiles":"111","class_id":"2","shop_class_id":"1928"}
uploadGoods({ goods_name = "test2", goods_price = "1.00", goods_unit = "1", goods_profiles = "test2", class_id = "10103", shop_class_id = "1930" }) {
//定义上传商品的多图片的参数
const uploadProductGoodFileParams = []
if (this.state.ImagesInfo.length) {
for (let i = 0; i < this.state.ImagesInfo.length; i++) {
if (i === 0) {
uploadProductGoodFileParams.push({
file_id:this.state.ImagesInfo[i].file_id,
file_type: 1,
if_cover: 1,
file_sort: 1
})
} else {
uploadProductGoodFileParams.push({
file_id: this.state.ImagesInfo[i].file_id,
file_type: 1,
if_cover: 0,
file_sort: 1
})
}
}
} else {
alert('图片为空')
}
Taro.request({
url: URL.UploadProduct,
method: 'POST',
dataType: 'json',
data: {
deployType: 1,
action: 1,
goods: JSON.stringify({
goods_name: goods_name,
goods_price: goods_price,
goods_unit: goods_unit,
goods_profiles: goods_profiles,
class_id: class_id,
shop_class_id: shop_class_id
}),
goodsFiles: JSON.stringify(uploadProductGoodFileParams)
},
header: {
'content-type': 'application/x-www-form-urlencoded',
'Cookie': 'PFWSSS=' + Taro.getStorageSync('session_id'),
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(res => {
let tipText=res.data.err_msg==='success'?'商品发布成功':res.data.err_msg
this.setState({ uploadProductTextTip: tipText, isUploadProductSuccess: true },()=>{
setTimeout(()=>{
this.setState({isUploadProductSuccess: false})
Taro.navigateTo({
url: '/pages/goodsPublish/goodsPublish'
})
},1000)
})
console.log('上传商品', res) // 提示非法请求 ----- to be continue
}
)
.catch(error => {
this.setState({ uploadProductTextTip: '发布失败', isUploadProductSuccess: true })
})
}
// 整理后台传出来的店铺分类目录
sortShopCateToState(shopData) {
const firstColumn = []
const secondColumn = []
const thirdColumn = []
for (let outterItem of shopData) {
firstColumn.push({ id: outterItem.class_id, name: outterItem.class_name })
if (outterItem.children.length) {
for (let middleItem of outterItem.children) {
secondColumn.push({ id: middleItem.class_id, name: middleItem.class_name })
if (middleItem.children.length) {
for (let innerItem of middleItem.children) {
thirdColumn.push({ id: innerItem.class_id, name: innerItem.class_name })
}
}
}
}
}
// ------- 把新指传给objectMultiArray之后就不可以用了 to be continue
console.log('old',this.state.objectMultiArray)
this.setState({objectMultiArray:[firstColumn,secondColumn,thirdColumn]},()=>{
console.log('new', this.state.objectMultiArray)
})
}
// 改变商品分类状态
onChangeProductType(e) {
this.setState({
selectorChecked: this.state.selector[e.detail.value]
})
}
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, index) {
const that = this
if (operationType === 'add') {
Taro.uploadFile({
url: URL.UploadPorductImage, // 仅为示例，非真实的接口地址
filePath: files[files.length - 1].url,
name: 'file',
formData: {
user: 'test'
},
header: {
'content-type': 'multipart/form-data',
'Cookie': 'PFWSSS=' + Taro.getStorageSync('session_id'),
'X-Requested-With': 'XMLHttpRequest'
},
success(response) {
const data = JSON.parse(response.data)
const imagePath = URL.Base + data.file_path
const newPickerImageUrl = that.state.pickerImageUrl.concat({ url: imagePath })
const newImageInfo = that.state.ImagesInfo.concat(data)
that.setState({ pickerImageUrl: newPickerImageUrl, isUploadImageSuccess: true, uploadImageTextTip: '图片上传成功', ImagesInfo: newImageInfo }, () => {
setTimeout(()=>{that.setState({isUploadImageSuccess: false})},1000)
})
}
})
}
if (operationType === 'remove') {
this.state.pickerImageUrl.splice(index, 1);
this.setState({ files: this.state.pickerImageUrl });
that.setState({ isUploadImageSuccess: true, uploadImageTextTip: '删除成功' },()=>{
setTimeout(()=>{that.setState({isUploadImageSuccess: false})},1000)
})
}
}
// 图片上传失败
onFail(mes) {
console.log(mes)
}
// 删除图片
onImageClick(index) {
}
onClickUploadGoods() {
if (this.state.productName && this.state.productPrice && this.state.productUnit && this.state.ImagesInfo.length) {
this.uploadGoods({
goods_name: this.state.productName,
goods_price: this.state.productPrice,
goods_unit: this.state.productUnit,
goods_profiles: this.state.productDescript,
class_id: "10103",
shop_class_id: this.state.shopCategoryCheckedPicker,
})
} else {
this.setState({ uploadProductTextTip: '请填写完表格', isUploadProductSuccess: true },()=>{
setTimeout(()=>{this.setState({isUploadProductSuccess: false})},1000)
})
}
}
shopCategoryChanged(e) {
this.setState({
shopCategoryCheckedPicker: this.state.shopCategoryPicker[e.detail.value]
}, () => {
console.log(this.state.shopCategoryCheckedPicker)
})
}
componentDidMount() {
this.getProductCateList()
this.getShopCateList()
}
componentWillReceiveProps(nextProps) {
// console.log(this.props, nextProps)
}
componentWillUnmount() { }
componentDidShow() { }
componentDidHide() { }
//--- 三级联动--------------
bindMultiPickerChange(e) {
console.log('picker发送选择改变，携带值为', e.detail.value)
this.setState({
multiIndex: e.detail.value
})
}
bindMultiPickerCol(e) {
console.log('修改的列为', e.detail.column, '，值为', e.detail.value)
const data = {
multiArray: this.state.objectMultiArray,
multiIndex: this.state.multiIndex
}
data.multiIndex[e.detail.column] = e.detail.value
switch (e.detail.column) {
case 0:
switch (data.multiIndex[0]) {
case 0:
data.multiArray[1] = [
{
id: 0,
name: '01'
},
{
id: 1,
name: '10a'
}
]
data.multiArray[2] = [{
id: 0,
name: '02'
},
{
id: 1,
name: '02a'
}]
break
case 1:
data.multiArray[1] = [{
id: 0,
name: '11'
},
{
id: 1,
name: '11a'
}]
data.multiArray[2] = [{
id: 0,
name: '12'
},
{
id: 1,
name: '12a'
}]
break
}
data.multiIndex[1] = 0
data.multiIndex[2] = 0
break
case 1:
switch (data.multiIndex[0]) {
case 0:
switch (data.multiIndex[1]) {
case 0:
data.multiArray[2] = [{
id: 0,
name: '无脊柱动物'
},
{
id: 1,
name: '脊柱动物'
}]
break
case 1:
data.multiArray[2] = [
{
id: 1,
name: '脊柱动物'
}]
break
case 2:
data.multiArray[2] = [{
id: 0,
name: '无脊柱动物'
},
{
id: 1,
name: '脊柱动物'
}]
break
case 3:
data.multiArray[2] = [{
id: 0,
name: '无脊柱动物'
},
{
id: 1,
name: '脊柱动物'
}, {
id: 0,
name: '无脊柱动物'
},
{
id: 1,
name: '脊柱动物'
}]
break
case 4:
data.multiArray[2] = [{
id: 0,
name: '无脊柱动物'
},
{
id: 1,
name: '脊柱动物'
}]
break
}
break
case 1:
switch (data.multiIndex[1]) {
case 0:
data.multiArray[2] = [{
id: 0,
name: '蛇'
},
{
id: 1,
name: '青蛙'
}]
break
case 1:
data.multiArray[2] = [{
id: 0,
name: '蛇'
},
{
id: 1,
name: '青蛙'
}, {
id: 0,
name: '蛇'
},
{
id: 1,
name: '青蛙'
}]
break
case 2:
data.multiArray[2] = [{
id: 0,
name: '蛇'
},
{
id: 1,
name: '青蛙'
}]
break
}
break
}
data.multiIndex[2] = 0
break
}
console.log(data.multiIndex)
this.setState({ multiIndex: data.multiIndex })
}
render() {
const imageUploadSuccess = <AtToast
isOpened={this.state.isUploadImageSuccess}
text={this.state.uploadImageTextTip}
duration={1000}
></AtToast>
const productUploadSuccess = <AtToast
isOpened={this.state.isUploadProductSuccess}
text={this.state.uploadProductTextTip}
duration={1000}
></AtToast>
return (
<View className='goods-publish'>
<Test3></Test3>
{imageUploadSuccess}
{productUploadSuccess}
<SearchBarComponent></SearchBarComponent>
<View className='goods-category'>
<View className='page-section'>
<View>
<Picker
range={this.state.objectMultiArray}
onChange={this.bindMultiPickerChange.bind(this)}
rangeKey='name'
mode='multiSelector'
onColumnchange={this.bindMultiPickerCol.bind(this)}
value={this.state.multiIndex}
>
<View className='picker'>
<View className='title-box'>
<Text className='title'><Text className='require'>*</Text>商品分类:</Text> <Text className='selected'>
{/* {this.state.multiArray[0][this.state.multiIndex[0]].name}{this.state.multiArray[1][this.state.multiIndex[1]].name}{this.state.multiArray[2][this.state.multiIndex[2]].name} */}
</Text>
</View>
</View>
</Picker>
</View>
</View>
<View className='input-box'>
<Text className='require'>*</Text>
<AtInput
name='value'
title='商品名称：'
type='text'
value={this.state.productName}
onChange={this.productNameChange.bind(this)}
/>
</View>
<View className='input-box'>
<Text className='require'>*</Text>
<AtInput
name='value'
title='商品价格：'
type='number'
placeholder='￥'
value={this.state.productPrice}
onChange={this.productPriceChange.bind(this)}
/>
</View>
<View className='input-box'>
<Text className='require'>*</Text>
<AtInput
name='value'
title='商品单位：'
type='text'
value={this.state.productUnit}
onChange={this.productUnitChange.bind(this)}
/>
</View>
{/* 图片上传 */}
<View className='img-box'>
<View className='title-box'>
<Text className='require'>*</Text>
<Text className='title'>上传图片:</Text>
</View>
<View className='img-container'>
<AtImagePicker
multiple
files={this.state.pickerImageUrl}
onChange={this.onChangeImg.bind(this)}
onFail={this.onFail.bind(this)}
onImageClick={this.onImageClick.bind(this)}
/>
</View>
</View>
<View className='shoptype-box'>
{/* 店铺分类 */}
<View className='title-box page-section'>
<Picker mode='selector' rangeKey='name' range={this.state.shopCategoryPicker} onChange={this.shopCategoryChanged.bind(this)}>
<View className='picker'>
<Text className='require'>*</Text>
<Text className='title'> 店铺分类：</Text>
<Text className='selected'>{this.state.shopCategoryCheckedPicker.name}</Text>
</View>
</Picker>
</View>
</View>
<View className='description-box'>
<View className='title-box'>
<Text className='require'></Text>
<Text className='title'>商品简介:</Text>
</View>
<AtTextarea
value={this.state.productDescript}
onChange={this.productDescriptChange.bind(this)}
maxlength='200'
placeholder='你的产品简介'
/>
</View>
</View>
<View className='button-box'>
<View className='button'>
<AtButton type='primary' size='small' >发布</AtButton>
</View>
<View className='button'>
<AtButton type='primary' className='button-a' size='small' onClick={this.onClickUploadGoods.bind(this)}>发布并新增</AtButton>
</View>
<View className='button'>
<AtButton type='primary' className='button-a' size='small'>商品列表</AtButton>
</View>
</View>
<copyrightComponent></copyrightComponent>
</View>
)
}
}
export default GoodsPublish

5
src/serviceAPI.config.js
View File

@ -24,8 +24,9 @@ const URL = {
UploadPorductImage: LOCALURL + 'Goods-fileUpload',// 上传商品图片
UploadProduct: LOCALURL + 'Goods-phonePost',// 上传商品
UploadSupplyDemand: LOCALURL + 'Supply-post',// 上传供求
// 我的供求页面接口Supply-myList
SearchDemandSupply: LOCALURL + 'Supply-myList',// 搜索我的供求接口
DeleteDemandSupply: LOCALURL + 'Supply-delete',// 删除我的供求接口
}
module.exports = URL

13
src/todo list.txt Normal file
View File

@ -0,0 +1,13 @@
todo list：
搜索栏的search button 样式
首页：
优惠卷和询价接口
商品发布页面：
商品分类三级联动 // 改变新的multiObject 之后 三级联动就失效了
商品价格无法设定为数字
全部业主需求页面：
供求状态 和行业分类--等待后台接口
搜索api
我的供求页面：
搜索接口--等待后台