星期二 shoppage api

This commit is contained in:
郑茂强 2018-12-18 17:37:23 +08:00
parent 6bacc5be25
commit 1383fe403d
14 changed files with 683 additions and 440 deletions

View File

@ -36,23 +36,23 @@
"taro-ui": "^1.5.0"
},
"devDependencies": {
"@types/react": "^16.4.8",
"@types/webpack-env": "^1.13.6",
"@tarojs/plugin-babel": "^1.2.0-beta.3",
"@tarojs/plugin-csso": "^1.2.0-beta.3",
"@tarojs/plugin-sass": "^1.2.0-beta.3",
"@tarojs/plugin-sass": "^1.2.0",
"@tarojs/plugin-uglifyjs": "^1.2.0-beta.3",
"@tarojs/webpack-runner": "^1.2.0-beta.3",
"@types/react": "^16.4.8",
"@types/webpack-env": "^1.13.6",
"babel-eslint": "^8.2.3",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-plugin-transform-jsx-stylesheet": "^0.6.5",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-env": "^1.6.1",
"babel-eslint": "^8.2.3",
"eslint": "^4.19.1",
"eslint-config-taro": "^1.2.0-beta.3",
"eslint-plugin-react": "^7.8.2",
"eslint-plugin-import": "^2.12.0",
"eslint-plugin-react": "^7.8.2",
"eslint-plugin-taro": "^1.2.0-beta.3"
}
}

View File

@ -26,7 +26,7 @@ class App extends Component {
'pages/supplyDemandPublish/supplyDemandPublish',
'pages/mySupplyDemand/mySupplyDemand',
'pages/allDemanding/allDemanding',
'pages/shopDescription/shopDescription',
// 'pages/shopDescription/shopDescription',
],
window: {
backgroundTextStyle: 'light',

View File

@ -10,6 +10,9 @@ const hornIcon = require('../../icons/horn.png')
const houseIcon = require('../../icons/house.png')
class recommondShop extends Component {
static options = {
addGlobalClass: true
}
config = {
navigationBarTitleText: 'recommondShop'
@ -194,44 +197,44 @@ class recommondShop extends Component {
const voucherModalElement = <AtModal className='voucher-modal' isOpened={this.state.isOpenVouhcer}>
<AtModalHeader>优惠卷须知</AtModalHeader>
<AtModalContent>
<AtNoticebar className='warning' icon='volume-plus'>
<AtNoticebar style='color:#a94442' icon='volume-plus'>
提示具体可以前往实体店进行领取优惠卷或通过电话进行咨询
</AtNoticebar>
<View className='voucher-left'>当前优惠卷{voucherLeft}</View>
<AtInput
disabled
name='value'
title='联系人:'
type='text'
placeholder='123'
disabled
name='value'
title='联系人:'
type='text'
placeholder='123'
/>
<AtInput
disabled
name='value'
title='联系电话:'
type='number'
placeholder='需求标题'
disabled
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 onClick={this.voucherModalConfirm.bind(this)}></Button> </AtModalAction>
<AtModalAction> <Button onClick={this.voucherModalClose.bind(this)} >取消</Button> <Button style='color:#FF7B00' 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>
<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='需求标题'
/>
</AtModalContent>
<AtModalAction> <Button onClick={this.consultModalClose.bind(this)} >取消</Button> <Button onClick={this.consultModalConfirm.bind(this)}></Button> </AtModalAction>
@ -239,8 +242,8 @@ class recommondShop extends Component {
// 请提示元素
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}

View File

@ -9,6 +9,7 @@
.at-modal-content{
background-color: black
}
}

View File

@ -19,10 +19,14 @@ class ShopItem extends Component {
}}
shopOnClickHanlder(){
let goodId=this.props.item.goods_id
Taro.navigateTo({
url: '/pages/goods/goods?id=123&name=michael'
url: '/pages/goods/goods?id='+goodId
})
}
componentDidMount(){
}
// 当图片无效的时候 的方法 (为什么不起作用??)
onError(e){
@ -30,6 +34,7 @@ class ShopItem extends Component {
e.target.onerror = null;
e.target.src = 'https://raw.githubusercontent.com/shenghy/SmileVue/master/src/assets/images/errorimg.png'
}
render() {
const imgURL =this.props.item? URL.Base +this.props.item.goods_url:null
const newPrice = this.props.item ? this.props.item.goods_price : null

View File

@ -1,6 +1,7 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Text, Image } from '@tarojs/components'
import {AtTabs, AtTabsPane, AtSegmentedControl, AtIcon, AtToast ,Picker } from 'taro-ui'
import { View, Text, Image , Swiper, SwiperItem} from '@tarojs/components'
import { AtTabs, AtTabsPane, AtSegmentedControl, AtIcon, AtToast, Picker } from 'taro-ui'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
import SearchBarComponent from '../../component/searchBarComponent/searchBarComponent'
@ -8,7 +9,7 @@ import URL from '../../serviceAPI.config'
import './goods.scss'
//GetShopItemDetail
class Goods extends Component {
config = {
@ -18,13 +19,55 @@ class Goods extends Component {
super(...arguments)
this.state = {
current: 0, // 当前大类评论区
subCurrent:0, // 当前小类评论区
isOpened:false, // 是否显示轻提示
subCurrent: 0, // 当前小类评论区
isOpened: false, // 是否显示轻提示
selector: ['0', '1', '2', '3'], // 数量或者规格选择
selectorChecked: '0', // 已选择的数量或规格
}}
productImagesUrl: '', // 图片地址
productName: '',// 商品名字
productDes: '',// 商品简介
oldPirce: '',// 原价
specialPrice: '',//促销价
productType: '',//商品类型
serviceArea: '',//服务区域
monthSold: '',//月销量
totalSold: '',//总销量
browsingCount: '',// 浏览数
}
}
// 商品详情api
getShopDescription() {
Taro.request({
url: URL.GetShopItemDetail,
method: 'POST',
dataType: 'json',
data: {
goodsID: this.$router.params.id,
},
header: {
'content-type': 'application/x-www-form-urlencoded',
}
})
.then(res => {
console.log('商品详情:', res)
this.setState({
productImagesUrl: res.data.goods.goods_pic,
productName: res.data.goods.goods_name,
productDes: res.data.goods.goods_profiles,
oldPirce: res.data.goods.goods_org_price,
specialPrice: res.data.goods.goods_price,
productType: res.data.goods.goods_type_name,
serviceArea: res.data.goodsRegionName[0],
monthSold: res.data.goods.month_sales,
totalSold: res.data.goods.sales_volume,
browsingCount: res.data.goods.browse_times,
})
}
)
}
// 大类评论区方法
handleClick(value) {
this.setState({
@ -38,14 +81,14 @@ class Goods extends Component {
})
}
// 去其他页面
goShopPage(){
goShopPage() {
Taro.navigateTo({
url: '/pages/shop/shop'
})
}
// 收藏商品
saveItem(){
this.setState({isOpened:true})
saveItem() {
this.setState({ isOpened: true })
}
// 数量或者规格方法
onChange = e => {
@ -54,7 +97,8 @@ class Goods extends Component {
})
}
componentDidMount() {
//this.$router.params.id
this.getShopDescription()
}
componentWillReceiveProps(nextProps) {
console.log(this.props, nextProps)
@ -69,92 +113,126 @@ class Goods extends Component {
render() {
const mainTabList = [{ title: '宝贝详情' }, { title: '全部评价' }, { title: '猜你喜欢' }]
// const subTabList = [{ title: '全部' }, { title: '好评' }, { title: '差评' }, { title: '公开' }, { title: '匿名' }]
const itemPicsBannerElementArray=this.state.productImagesUrl.map((item,index)=>{
return < SwiperItem key={index} >
<Image mode='aspectFit' src={URL.Base + item.file_path} style='max-width: 100%; height:100%;' />
</SwiperItem >
})
const itemDescriptionPicsElementArray = this.state.productImagesUrl.map((item, index) => {
return <View className='description-img' key={index}>
<Image mode='widthFix' src={URL.Base + item.file_path} style='width: 100%; max-height:100%;' />
</View>
})
return (
<View className='gooods=container'>
<SearchBarComponent></SearchBarComponent>
<View className='img-box'>
<Image className='img' src={URL.Base + 'Uploads/zone/user_1041/201808/thumb/e10a0bfea09a3078a800af8054bc80ce_400X400.jpg'}></Image>
{/* <Image className='img' src={URL.Base + this.state.productImagesUrl}></Image> */}
<Swiper
className='swipper'
style='height:100%;'
indicatorColor='#999'
indicatorActiveColor='#333'
hotizontal
circular
indicatorDots
>
{itemPicsBannerElementArray}
</Swiper>
</View>
<View className='title-box'>
<View className='main-title'>
11
{this.state.productName}
</View>
<View className='subtitle-box'>
11
{this.state.productDes}
</View>
</View>
<View className='price-box'>
<View className='org-box'>
<Text className='title'>原价</Text>
<Text className='price'>11</Text>
<Text className='price'>{this.state.oldPirce}</Text>
</View>
<View className='spe-price'>
<Text className='title'>促销价</Text>
<Text className='price'>11</Text>
<Text className='price'>{this.state.specialPrice}</Text>
</View>
</View>
<View className='info-box'>
<View className='type'>
<Text className='title'>商品类型</Text>
<Text className='desc'>设计师商品</Text>
<Text className='desc'>{this.state.productType}</Text>
</View>
<View className='district'>
<Text className='title'>服务区域</Text>
<Text className='desc'>中国/福建省(全省)</Text>
<Text className='desc'>{this.state.serviceArea}</Text>
</View>
</View>
<View className='counter-box'>
<View className='month-sold'>
<Text className='title'>月销量</Text>
<Text className='amount'>0</Text>
<Text className='amount'>{this.state.monthSold}</Text>
</View>
<View className='total-sold'>
<Text className='title'>总销量</Text>
<Text className='amount'>0</Text>
<Text className='amount'>{this.state.totalSold}</Text>
</View>
<View className='browsing-amount'>
<Text className='title'>浏览量</Text>
<Text className='amount'>13</Text>
<Text className='amount'>{this.state.browsingCount}</Text>
</View>
</View>
<View className='standard-box'>
{/* 规格或者数量 */}
<Picker mode='selector' range={this.state.selector} onChange={this.onChange}>
{/* 规格或者数量 */}
<Picker mode='selector' range={this.state.selector} onChange={this.onChange}>
<View className='picker'>
<View className='title'>
可选规格:
</View>
<View className='more'>
{this.state.selectorChecked}
</View>
</View>
</View>
</Picker>
</View>
{/* 详情和评论区 */}
<View className='details-box'>
{/* 大类 */}
{/* 大类 */}
<AtTabs selectedColor='#FF7142' className='alltabs' animated={false} current={this.state.current} tabList={mainTabList} onClick={this.handleClick.bind(this)}>
<AtTabsPane current={this.state.current} index={0} >
<View style='padding: 100px 50px;background-color: #FAFBFC;text-align: center;' >商品细节</View>
<AtTabsPane current={this.state.current} index={0} >
<View style='background-color: #FAFBFC;' >
<View className='description-title'>商品细节</View>
<View className='description-img'>
{itemDescriptionPicsElementArray}
</View>
</View>
</AtTabsPane>
<AtTabsPane current={this.state.current} index={1}>
<View style='padding: 1px 0px 100px;background-color: #FAFBFC;text-align: center;'>
{ /*子标签类*/}
{ /*子标签类*/}
<AtSegmentedControl selectedColor='#FF9500'
values={['全部', '好评', '中评', '差评', '公开','匿名']}
values={['全部', '好评', '中评', '差评', '公开', '匿名']}
onClick={this.onClick.bind(this)}
current={this.state.subCurrent}
/>
{
this.state.subCurrent === 0
? <View className='tab-content'>
<Text className='title'>全部</Text>
</View>
<Text className='title'>全部</Text>
</View>
: null
}
{
@ -182,15 +260,15 @@ class Goods extends Component {
? <View className='tab-content'>匿名</View>
: null
}
</View>
</AtTabsPane>
<AtTabsPane current={this.state.current} index={2}>
<View style='padding: 100px 50px;background-color: #FAFBFC;text-align: center;'>标签页三的内容</View>
</AtTabsPane>
</AtTabs>
</View>
</View>
<copyrightComponent></copyrightComponent>
@ -201,13 +279,13 @@ class Goods extends Component {
<Text className='title'>进店</Text>
</View>
<View className='collection' onClick={this.saveItem.bind(this)}>
<AtIcon className='icon' value='heart' size='12' color='white'></AtIcon>
<AtIcon className='icon' value='heart' size='12' color='white'></AtIcon>
<AtToast
isOpened={this.state.isOpened}
duration={1000}
text='收藏成功'
></AtToast>
<Text className='title'>收藏商品</Text>
<Text className='title'>收藏商品</Text>
</View>
<View className='add-cart'>
加入购物车

View File

@ -1,188 +1,200 @@
// border: 1px solid #ddd;
// padding: 5px 0;
.img-box{
border: 1px solid #ddd;
padding: 20px 0;
text-align: center;
.img{
height: 700px;
width: 60%
}
}
.title-box{
border: 1px solid #ddd;
padding: 5px 0;
.main-title{
margin-left: 20px;
font-size: 30px;
font-weight: bold;
}
.subtitle-box{
margin-left: 20px;
font-size: 25px;
}
}
.price-box{
border: 1px solid #ddd;
padding: 5px 0;
color:#999;
font-size: 25px;
.org-box{
margin-left: 20px;
.title{
font-weight: bold
}
.price{
text-decoration-line: line-through
}
}
.spe-price{
font-weight: bold;
margin-left: 20px;
.price{
font-size: 40px;
color: #c00;
}
}
}
.info-box{
border: 1px solid #ddd;
padding: 5px 0;
color:#999;
font-size: 25px;
.type, .district{
margin-left: 20px;
padding: 5px 0;
.title{
font-weight: bold
}
.desc{
color: black;
display: inline-block;
margin-left: 20px
}
}
}
.counter-box{
width: 100%;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
.month-sold,.total-sold,.browsing-amount{
flex:1;
font-size: 25px;
text-align: center;
margin:20px 0;
border-right: 1px solid #ddd;
.amount{
display: inline-block;
margin-left: 20px;
color: #c00;
font-weight: bold
}
}
.browsing-amount{
border-right: 0px solid #ddd;
}
}
.standard-box{
.picker{
border: 1px solid #ddd;
padding: 10px 0;
color:#999;
font-size: 25px;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
.title{
flex:1;
font-weight: bold;
margin-left: 20px;
}
.more{
flex:1;
text-align: right;
margin-right: 20px;
}
}
}
//------------------------------
.details-box{
.at-tabs{
.at-tabs__item--active{
color:#FF7142
}
}
}
//------------------------------
.copyright-box{
padding:0 20px;
.title{
text-align: center;
line-height: 100px;
font-size: 25px;
}}
.gap{
.img-box{
// border: 1px solid #ddd;
padding: 20px 0;
text-align: center;
height: 600px;
height:150px;
}
.shop-bottom-box{
position: fixed;
bottom: 0;
width: 100%;
z-index: 600;
.shop-bottom-nav{
display: flex;
flex-wrap: nowrap;
flex-direction: row;
text-align: center;
height: 90px;
line-height: 90px;
font-size: 30px;
.to-shop{
flex:1;
color: #333;
background-color: white;
.title-box{
border: 1px solid #ddd;
padding: 5px 0;
.main-title{
margin-left: 20px;
font-size: 30px;
font-weight: bold;
}
.subtitle-box{
margin:0 20px;
font-size: 25px;
}
}
.collection{
flex:1;
background-color: #FF9500;
color: white;
.icon{
vertical-align: middle
}
.price-box{
border: 1px solid #ddd;
padding: 5px 0;
color:#999;
font-size: 25px;
.org-box{
margin-left: 20px;
.title{
font-weight: bold
}
.price{
text-decoration-line: line-through
}
}
.spe-price{
font-weight: bold;
margin-left: 20px;
.price{
font-size: 40px;
color: #c00;
}
}
}
.info-box{
border: 1px solid #ddd;
padding: 5px 0;
color:#999;
font-size: 25px;
.type, .district{
margin-left: 20px;
padding: 5px 0;
.title{
font-weight: bold
}
.desc{
color: black;
display: inline-block;
margin-left: 20px
}
}
}
.counter-box{
width: 100%;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
.month-sold,.total-sold,.browsing-amount{
flex:1;
font-size: 25px;
text-align: center;
margin:20px 0;
border-right: 1px solid #ddd;
.amount{
display: inline-block;
margin-left: 20px;
color: #c00;
font-weight: bold
}
}
.browsing-amount{
border-right: 0px solid #ddd;
}
}
.standard-box{
.picker{
border: 1px solid #ddd;
padding: 10px 0;
color:#999;
font-size: 25px;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
.title{
display: inline-block;
margin-left: 10px;
}
flex:1;
font-weight: bold;
margin-left: 20px;
}
.more{
flex:1;
text-align: right;
margin-right: 20px;
}
}
}
.add-cart{
flex:1;
background-color:#F03726;
color: white;
//------------------------------
.details-box{
.at-tabs{
.at-tabs__item--active{
color:#FF7142
}
}
.description-title{
font-size:35px;
color:#999;
margin-top:20px;
margin-left: 20px;
margin-bottom: 20px;
font-weight: bold;
}
.description-img{
padding:0 10px;
font-size: 0px;
}
}
}
}
//------------------------------
.copyright-box{
padding:0 20px;
.title{
text-align: center;
line-height: 100px;
font-size: 25px;
}}
.gap{
height:150px;
}
.shop-bottom-box{
position: fixed;
bottom: 0;
width: 100%;
z-index: 600;
.shop-bottom-nav{
display: flex;
flex-wrap: nowrap;
flex-direction: row;
text-align: center;
height: 90px;
line-height: 90px;
font-size: 30px;
.to-shop{
flex:1;
color: #333;
background-color: white;
}
.collection{
flex:1;
background-color: #FF9500;
color: white;
.icon{
vertical-align: middle
}
.title{
display: inline-block;
margin-left: 10px;
}
}
.add-cart{
flex:1;
background-color:#F03726;
color: white;
}
}
}

View File

@ -1,9 +1,10 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Text, Radio, RadioGroup, Label } from '@tarojs/components'
import { AtInput, AtImagePicker, AtTextarea, AtButton, Picker } from 'taro-ui'
import { View, Text, Radio, RadioGroup, Label } from '@tarojs/components'
import { AtInput, AtImagePicker, AtTextarea, AtButton, Picker } from 'taro-ui'
import SearchBarComponent from '../../component/searchBarComponent/searchBarComponent'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
import URL from '../../serviceAPI.config'
import './goodsPublish.scss'
@ -18,10 +19,10 @@ class GoodsPublish extends Component {
this.state = {
selector: ['需求', '供应', '人才'], // 应该是树型结构,需要修改
selectorChecked: '需求',
productName:'',
productPrice:'',
productUnit:'',
productDescript:'',
productName: '',
productPrice: '',
productUnit: '',
productDescript: '',
files: [{
url: 'https://jimczj.gitee.io/lazyrepay/aragaki1.jpeg',
},
@ -52,38 +53,78 @@ class GoodsPublish extends Component {
text: '日本',
checked: false
}
] // 店铺分类选项
}
}
// 发布商品api
uploadGoods() {
Taro.request({
url: URL.UploadProduct,
method: 'POST',
dataType: 'json',
data: {
deployType: 1,
action: 1,
goods: JSON.stringify({ "goods_name": "test2", "goods_price": "1.00", "goods_unit": "1", "goods_profiles": "test2", "class_id": "10103", "shop_class_id": "1899" }),
goodsFiles: JSON.stringify([{ "file_id": "27959", "file_type": 1, "if_cover": 1, "file_sort": 1 }])
},
header: {
'content-type': 'application/x-www-form-urlencoded',
}
})
.then(res => {
console.log('上传商品', res) // 提示非法请求 ----- to be continue
}
)
}
// 上传商品图片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)
}
)
}
// 改变商品分类状态
onChange(e){
onChange(e) {
this.setState({
selectorChecked: this.state.selector[e.detail.value]
})
}
productNameChange(event){
productNameChange(event) {
this.setState({
productName: event
})
}
productPriceChange(event){
productPriceChange(event) {
this.setState({
productPrice: event
})
}
productUnitChange(event){
productUnitChange(event) {
this.setState({
productUnit: event
})
}
productDescriptChange(event){
productDescriptChange(event) {
this.setState({
productDescript: event.target.value
})
}
// 上传图片
onChangeImg(files,operationType) {
onChangeImg(files, operationType,index) {
if (operationType === 'add') {
this.setState({
files
@ -93,7 +134,7 @@ class GoodsPublish extends Component {
this.state.files.splice(index, 1);
this.setState({ files: this.state.files });
}
}
// 图片上传失败
onFail(mes) {
@ -101,9 +142,12 @@ class GoodsPublish extends Component {
}
// 删除图片
onImageClick(index) {
}
componentDidMount(){
}
componentWillReceiveProps(nextProps) {
console.log(this.props, nextProps)
}
@ -136,33 +180,33 @@ class GoodsPublish extends Component {
<View className='input-box'>
<Text className='require'>*</Text>
<AtInput
name='value'
title='商品名称:'
type='text'
value={this.state.productName}
onChange={this.productNameChange.bind(this)}
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>
<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)}
/>
<AtInput
name='value'
title='商品单位:'
type='text'
value={this.state.productUnit}
onChange={this.productUnitChange.bind(this)}
/>
</View>
{/* 图片上传 */}
<View className='img-box'>
@ -172,16 +216,16 @@ class GoodsPublish extends Component {
</View>
<View className='img-container'>
<AtImagePicker
multiple
files={this.state.files}
onChange={this.onChangeImg.bind(this)}
onFail={this.onFail.bind(this)}
onImageClick={this.onImageClick.bind(this)}
multiple
files={this.state.files}
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'>
<Text className='require'>*</Text>
<Text className='title'>店铺分类:</Text>
@ -231,20 +275,20 @@ class GoodsPublish extends Component {
</View>
</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='你的产品简介'
value={this.state.productDescript}
onChange={this.productDescriptChange.bind(this)}
maxlength='200'
placeholder='你的产品简介'
/>
</View>
@ -254,13 +298,13 @@ class GoodsPublish extends Component {
<AtButton type='primary' size='small'>发布</AtButton>
</View>
<View className='button'>
<AtButton type='primary' className='button-a' size='small'>发布并新增</AtButton>
<AtButton type='primary' className='button-a' size='small'>发布并新增</AtButton>
</View>
<View className='button'>
<AtButton type='primary' className='button-a' size='small'>商品列表</AtButton>
<AtButton type='primary' className='button-a' size='small'>商品列表</AtButton>
</View>
</View>

View File

@ -11,43 +11,44 @@ class Home extends Component {
config = {
navigationBarTitleText: '首页'
}
constructor() {
super(...arguments);
this.state = {
shopsDetails: [], // 推荐店铺的信息
ads: [], //广告图片数组
categories: [],// 大类
subCate:[], //小类
subCate: [], //小类
demanding: [],// 业主需求
otherData:[], // 底部导航栏
isOpen:false, // 抢单消息提示
otherData: [], // 底部导航栏
isOpen: false, // 抢单消息提示
}
}
componentWillMount(){
}
componentWillMount() {
}
componentDidMount() {
// 页面加载后 得到首页的基本信息和推荐店铺的信息
Taro.showLoading({ title: '加载中' })
this.getShops()
this.getHomeCategoriesInfo()
this.login()
}
//api 得到首页的信息
//api 得到首页的信息
getHomeCategoriesInfo() {
Taro.request({
url: URL.ShopWxStore,
})
.then(res => {
console.log('首页基本信息',res)
console.log('首页基本信息', res)
this.setState({
ads: res.data.data.adsLb,
categories: res.data.data.supplyClass,
demanding: res.data.data.demand.supplys,
otherData:res.data.otherData
otherData: res.data.otherData
})
})
}
@ -79,25 +80,60 @@ class Home extends Component {
}
)
}
// api 抢单请求
GrabDemand({demandId=218}){
Taro.request({
url: URL.GrabDemand,
method: 'POST',
dataType: 'json',
data: {
demandId: demandId
},
header: {
'content-type': 'application/x-www-form-urlencoded',
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(res => {
console.log('抢单请求:',res)
})
}
// 登入api
login() {
Taro.login({
success(res) {
if (res.code) {
// 发起网络请求
console.log(res)
Taro.request({
url: URL.Login,
method: 'POST',
dataType: 'json',
data: {
code: res.code
},
header: {
'content-type': 'application/x-www-form-urlencoded',
}
})
.then(response => {
console.log('登入', response)
}
)}
else {
console.log('登录失败!' + res.errMsg)
}
}
})
}
// api 抢单请求
GrabDemand({ demandId = 218 }) {
Taro.request({
url: URL.GrabDemand,
method: 'POST',
dataType: 'json',
data: {
demandId: demandId
},
header: {
'content-type': 'application/x-www-form-urlencoded',
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(res => {
console.log('抢单请求:', res)
})
}
// 点击大类icon
onClickParentCate(item) {
this.setState({ subCate: item.children })
@ -108,23 +144,23 @@ class Home extends Component {
this.getShops(item.parent_class_id, item.class_id, 2)
}
// 转到其他页面
goToAllDemandingPage(){
goToAllDemandingPage() {
Taro.navigateTo({
url: '/pages/allDemanding/allDemanding'
})
}
grabOrder(){
this.setState({isOpen:true})
grabOrder() {
this.setState({ isOpen: true })
}
handleGrabModalClose(){
this.setState({isOpen:false})
handleGrabModalClose() {
this.setState({ isOpen: false })
}
handleGrabModalCancel(){
this.setState({isOpen:false})
handleGrabModalCancel() {
this.setState({ isOpen: false })
}
handleGrabConfirm(){
this.setState({isOpen:false})
handleGrabConfirm() {
this.setState({ isOpen: false })
// 确认抢单之后
this.GrabDemand({})
}
@ -133,10 +169,11 @@ class Home extends Component {
componentDidShow() { }
componentDidHide() { }
render() {
// 提示弹窗element
// 提示弹窗element
const modalMessage = <AtModal className='modal'
isOpened={this.state.isOpen}
title='提示'
@ -147,7 +184,10 @@ class Home extends Component {
onConfirm={this.handleGrabConfirm.bind(this)}
content='确认抢单?\n'
/>
const demandingElemensArray = this.state.demanding.length?this.state.demanding.map((item, index) => {
const demandingElemensArray = this.state.demanding.length ? this.state.demanding.map((item, index) => {
return < SwiperItem key={index} >
<View className='demanding-item'>
<View className='item-tag'>
@ -157,7 +197,7 @@ class Home extends Component {
{item.sd_title}
</View>
<View className='item-address'>
{item.user_address||'无地址'}
{item.user_address || '无地址'}
</View>
<View className='item-name'>
业主{item.user_name}
@ -167,37 +207,37 @@ class Home extends Component {
</View>
</View>
</SwiperItem >
}) :null
}) : null
const adsImgElementsArray = this.state.ads.length?this.state.ads.map((item, index) => {
const adsImgElementsArray = this.state.ads.length ? this.state.ads.map((item, index) => {
return <SwiperItem key={index}>
<Image className='banner-img' src={URL.Base + item.ads_pic} />
<Image className='banner-img' src={URL.Base + item.ads_pic} />
</SwiperItem>
}):null
}) : null
// 这里应该代码可以优化-----
const categoriesElementsArray1 = this.state.categories.length?this.state.categories[0].map((item, index) => {
const categoriesElementsArray1 = this.state.categories.length ? this.state.categories[0].map((item, index) => {
return <View className='category-item' key={index} onClick={this.onClickParentCate.bind(this, item)}>
<Image className='cate-img' src={URL.Base + item.icon} />
<View>{item.class_name}</View>
</View>
}):null
const categoriesElementsArray2 = this.state.categories.length?this.state.categories[1].map((item, index) => {
}) : null
const categoriesElementsArray2 = this.state.categories.length ? this.state.categories[1].map((item, index) => {
return <View className='category-item' key={index} onClick={this.onClickParentCate.bind(this, item)}>
<View> <Image className='cate-img' src={URL.Base + item.icon} /></View>
<View> <Image className='cate-img' src={URL.Base + item.icon} /></View>
<View>{item.class_name}</View>
</View>
}):null
const shopCollectionElementsArray = this.state.shopsDetails.length?this.state.shopsDetails.map((item, index) => {
}) : null
const shopCollectionElementsArray = this.state.shopsDetails.length ? this.state.shopsDetails.map((item, index) => {
return <filteredShopComponent shop={item} key={index}></filteredShopComponent>
}):null
const subCateElementsArray = this.state.subCate.length?this.state.subCate.map((item, index) => {
}) : null
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
}) : null
return (
<View className='home'>
@ -227,7 +267,7 @@ class Home extends Component {
hotizontal
circular
indicatorDots
// autoplay
// autoplay
>
<SwiperItem>
<View className='categories'>
@ -253,15 +293,15 @@ class Home extends Component {
indicatorDots
autoplay>
<SwiperItem>
<Image className='banner-img' src={URL.Base +'Public/images/xgt.png'} />
<Image className='banner-img' src={URL.Base + 'Public/images/xgt.png'} />
</SwiperItem>
<SwiperItem>
<Image className='banner-img' src={URL.Base +'Public/images/xgt.png'} />
<Image className='banner-img' src={URL.Base + 'Public/images/xgt.png'} />
</SwiperItem>
</Swiper>
</View>
{/* 业主需求和行业推荐 */}
<View className='container'>
<View className='title'>
@ -285,8 +325,8 @@ class Home extends Component {
{demandingElemensArray}
</Swiper>
</View>
<View className='second-banner-level2'>
<View className='second-banner-level2'>
{this.state.subCate.length ? <Swiper
style='height:35px;'
className='swipper swiper-sub'
@ -296,32 +336,32 @@ class Home extends Component {
displayMultipleItems={this.state.subCate.length > 4.5 ? 4.5 : this.state.subCate.length}
>
{subCateElementsArray}
</Swiper>:null}
</Swiper> : null}
</View>
<View className='title'>
<Text className='title-block'></Text>
<Text className='title-text'>行业推荐</Text>
</View>
<View className='shop-box'>
{shopCollectionElementsArray}
{this.state.shopsDetails.length !== 0 ? <View className='title'>
沒有更多了...
</View>: < View className='title' >
没有找到...
</View > }
</View> : < View className='title' >
没有找到...
</View >}
</View>
<View className='gap'>
</View>
</View>
<View className='bottom-nav-box'>
<bottomNav otherData={this.state.otherData}/>
<bottomNav otherData={this.state.otherData} />
</View>
</View>
)

View File

@ -27,10 +27,15 @@ class Index extends Component {
//http://ihome6.com/Shop-supplyShops
componentDidMount(){
Taro.setStorageSync('PFWSSS','hq0erouhm4mea8b0mg34gdj0q7')
Taro.setStorageSync('X-Token','eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.IntcInVzZXJfaWRcIjpcIjI3XCIsXCJsb2dpbl9uYW1lXCI6XCJ5YW5neGJcIixcImF0XCI6XCIyMDE4LTEyLTE4IDEzOjM1OjUxXCJ9Ig.gXvZxXgU5asfwUJAG-z7k5g2p3dbts2e1X9L902KksE')
Taro.setStorageSync('PLU','%2Fm-more')
Taro.setStorageSync('localCity','think%3A%7B%2214%22%3A%22%25E7%25A6%258F%25E5%25BB%25BA%25E7%259C%2581%22%2C%2214001%22%3A%22%25E7%25A6%258F%25E5%25B7%259E%25E5%25B8%2582%22%7D')
Taro.navigateTo({
// url: '/pages/home/home'
// url: '/pages/goodsPublish/goodsPublish'
url: '/pages/home/home'
// url: '/pages/goodsPublish/goodsPublish'
// url:'/pages/supplyDemandPublish/supplyDemandPublish'
})
}
componentWillReceiveProps (nextProps) {

View File

@ -44,6 +44,7 @@ class MySupplyDemand extends Component {
'X-Requested-With': 'XMLHttpRequest'
}
}).then(res => {
console.log(res) // ------------------------------------------- to be continue----
console.log('个人供求=》暂时无数据, 后台需要权限验证')
})

View File

@ -24,11 +24,11 @@ class Shop extends Component {
shopId: '', // 店铺的id
shopName: '', // 店铺名
FilterText: '', // 筛选的可选项
filterBar: ['all', 'amount', 'newProduct', 'price', 'popularity'],
filterBarKeys: { all: '综合排序', amount: '销量', newProduct: '新品', price: '价格', popularity: '人气' },
filterBar: ['all', 'amount', 'newProduct', 'price', 'popularity'], //筛选选项
filterBarKeys: { all: '综合排序', amount: '销量', newProduct: '新品', price: '价格', popularity: '人气' }, // 筛选选项对应值
selectedFilterValue: 0, //筛选项
isShowFilter: false, //是否显示侧边筛选
showShopHomePage: false,// 是否显示首页页面
showShopHomePage: true,// 是否显示首页页面
shopDescriptionData: '',// 店铺详情信息
shopName: '',//店铺名称
shopAddress: '',//店铺地址
@ -154,7 +154,7 @@ class Shop extends Component {
// api 得到店铺详情请求
getShopDescription({ shopID = 808 }) {
Taro.request({
url: URL.Base + 'shop-wxShopInfo',
url: URL.ShopDescription,
method: 'POST',
dataType: 'json',
data: {
@ -173,7 +173,7 @@ class Shop extends Component {
contactNumber: res.data.userRes.phone,
shopDescription: res.data.data.shop_desc
}, () => {
console.log(this.state.shopDescriptionData)
// console.log(this.state.shopDescriptionData)
})
}

View File

@ -1,10 +1,11 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text } from '@tarojs/components'
import { AtInput, AtForm, AtImagePicker, AtTextarea, AtRadio, AtButton, Picker} from 'taro-ui'
import { View, Text } from '@tarojs/components'
import { AtInput, AtImagePicker, AtTextarea, AtButton, Picker } from 'taro-ui'
import SearchBarComponent from '../../component/searchBarComponent/searchBarComponent'
import copyrightComponent from '../../component/copyrightComponent/copyrightComponent'
import URL from '../../serviceAPI.config'
import './supplyDemandPublish.scss'
@ -23,12 +24,12 @@ class SupplyDemand extends Component {
demandingSupplyCateSelected: '需求',// 当前供求类型
demandingSupplyState: ['上架', '下架'], // 状态选择
demandingSupplyStateSelected: '上架',// 当前状态
title:'',
contactName:'',
contactNumber:'',
contactAddress:'',
content:'',
addImg:true, // 是否支持添加图片
title: '',
contactName: '',
contactNumber: '',
contactAddress: '',
content: '',
addImg: true, // 是否支持添加图片
files: [{
url: 'https://jimczj.gitee.io/lazyrepay/aragaki1.jpeg',
},
@ -38,9 +39,48 @@ class SupplyDemand extends Component {
{
url: 'https://jimczj.gitee.io/lazyrepay/aragaki3.png',
}]
}
}
// 上传供求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)
}
)
}
// 上传商品图片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)
}
)
}
// 修改供求类型
demandingSupplyCate = e => {
this.setState({
@ -54,24 +94,28 @@ class SupplyDemand extends Component {
})
}
//改标题
titleChange(event){
this.setState({title:event})
titleChange(event) {
this.setState({ title: event })
}
contactNameChange(event){
this.setState({contactName:event})
contactNameChange(event) {
this.setState({ contactName: event })
}
contactNumberChange(event){
this.setState({contactNumber:event})
contactNumberChange(event) {
this.setState({ contactNumber: event })
}
contactAddressChange(event){
this.setState({contactAddress:event.target.value})
contactAddressChange(event) {
this.setState({ contactAddress: event.target.value })
}
contentChange(event){
this.setState({ content: event.target.value})
contentChange(event) {
this.setState({ content: event.target.value })
}
// 添加图片
onChange(files, operationType,index) {
if (operationType==='add'){
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
}, () => {
@ -80,7 +124,7 @@ class SupplyDemand extends Component {
}
})
}
if (operationType === 'remove'){
if (operationType === 'remove') {
this.state.files.splice(index, 1);
this.setState({ files: this.state.files });
}
@ -91,6 +135,9 @@ class SupplyDemand extends Component {
onImageClick(index, file) {
console.log(index, file)
}
componentDidMount(){
this.uploadSupplyDemand()
}
componentWillReceiveProps(nextProps) {
console.log(this.props, nextProps)
}
@ -106,45 +153,45 @@ class SupplyDemand extends Component {
<View className='supply-demand'>
<SearchBarComponent></SearchBarComponent>
<View className='page-section'>
<View>
<Picker mode='selector' range={this.state.demandingSupplyCate} onChange={this.demandingSupplyCate.bind(this)}>
<View className='picker'>
<View className='title-box'>
<Text className='title'><Text className='require'>*</Text>:</Text> <Text className='selected'>{this.state.demandingSupplyCateSelected}</Text>
</View>
<View className='title-box'>
<Text className='title'><Text className='require'>*</Text>:</Text> <Text className='selected'>{this.state.demandingSupplyCateSelected}</Text>
</View>
</View>
</Picker>
</View>
</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'>
@ -153,10 +200,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'>
@ -164,10 +211,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'>
@ -178,14 +225,14 @@ 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)}
showAddBtn={this.state.addImg}
files={this.state.files}
onChange={this.onChange.bind(this)}
onFail={this.onFail.bind(this)}
onImageClick={this.onImageClick.bind(this)}
/>
</View>
</View>
<View className='page-section'>
@ -206,7 +253,7 @@ class SupplyDemand extends Component {
<AtButton type='primary' size='small'>发布</AtButton>
</View>
<View className='button'>
<AtButton type='primary' className='button-a' size='small'>发布并新增</AtButton>
</View>
<View className='button'>
@ -218,7 +265,7 @@ class SupplyDemand extends Component {
</View>
<copyrightComponent></copyrightComponent>
</View>
)
}

View File

@ -2,6 +2,7 @@
const LOCALURL = "http://192.168.1.230/"
const URL = {
Base:LOCALURL,
Login: LOCALURL + 'Applet-login', //登入接口
ShopWxStore: LOCALURL + 'Shop-wxStore', //商城首页信息
ShopSupplyShops: LOCALURL + 'Shop-supplyShops',// 商城店铺信息
GoodsSearch: LOCALURL + 'GoodsSearch-search',// 店铺页面的信息
@ -15,6 +16,12 @@ const URL = {
GetVoucherInfo: LOCALURL + 'Shop-couponsTips',// 优惠卷信息
GetConsultInfo: LOCALURL + 'Shop-consultTips',// 咨询信息
BuyConsult: LOCALURL + 'Shop-consult',// 购买咨询
GetShopItemDetail: LOCALURL + 'GoodsQuery-wxGoodsDetail',// 商品详情
// 商品发布api接口
UploadPorductImage: LOCALURL + 'Goods-fileUp',// 上传商品图片
UploadProduct: LOCALURL + 'Goods-phonePost',// 上传商品
UploadSupplyDemand: LOCALURL + 'Supply-post',// 上传供求
}