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 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: '',
shopCategoryList: [],
productCategoryList: [],
}
}
//商品目录请求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 => {
this.setState({ uploadProductTextTip: '发布成功', isUploadProductSuccess: true })
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 }, () => {
// console.log(that.state.ImagesInfo)
})
}
})
}
if (operationType === 'remove') {
this.state.pickerImageUrl.splice(index, 1);
this.setState({ files: this.state.pickerImageUrl });
that.setState({ isUploadImageSuccess: true, uploadImageTextTip: '删除成功' })
}
}
// 图片上传失败
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 })
}
}
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 =
const productUploadSuccess =
return (
{imageUploadSuccess}
{productUploadSuccess}
*商品分类:
{/* {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.shopCategoryCheckedPicker.name}
商品简介:
发布
发布并新增
商品列表
)
}
}
export default GoodsPublish