874 lines
26 KiB
JSON
874 lines
26 KiB
JSON
todo list：
|
||
首页：
|
||
商品发布页面：
|
||
|
||
供求发布页面
|
||
全部业主需求页面：
|
||
我的供求页面：
|
||
我的商品列表页面
|
||
商品编辑页面
|
||
|
||
我的需求列表页面:
|
||
接口问题：
|
||
优惠卷和询价
|
||
bug： 商品编辑 增加图片后 图片顺序乱了
|
||
|
||
|
||
|
||
|
||
等待后台--- 单个我的商品页面的图片顺序，单个我的需求页面的接口, 当个我哦的需求编辑页面的接口
|
||
|
||
import Taro, { Component } from '@tarojs/taro'
|
||
import { View, Radio, Button, MovableArea, MovableView } from '@tarojs/components'
|
||
import { AtInput, Text, AtIcon, Picker, Image, AtModal, AtModalHeader, AtModalContent, AtModalAction } from 'taro-ui'
|
||
import CopyrightComponent from '../../component/copyrightComponent/copyrightComponent'
|
||
import ScrollToTopComponent from '../../component/scrollToTopComponent/scrollToTopComponent'
|
||
|
||
import URL from '../../serviceAPI.config'
|
||
import './myGoodList.scss'
|
||
import loginExpired from '../../util/loginExpired';
|
||
import onClickValueService from '../../util/onClickValueService';
|
||
import { getGlobalStorage } from '../../util/getSetStoage';
|
||
import { showLoading } from '../../util/hideShowLoading';
|
||
|
||
|
||
class MyGoodList extends Component {
|
||
config = {
|
||
navigationBarTitleText: '商品列表'
|
||
}
|
||
constructor() {
|
||
super(...arguments)
|
||
this.state = {
|
||
productName: '',
|
||
lowestPrice: '',
|
||
heightestPrice: '',
|
||
minimumSold: '',
|
||
maximumSold: '',
|
||
order: '',// 商品列表排序参数
|
||
productId: '',// 商品编号参数
|
||
productCate: [], //宝贝类目
|
||
productCateSelected: { id: '', name: '全部类目' },// 已选宝贝类目
|
||
filterBar: ['filterPrice', 'filterStock', 'filterSold', 'filterPublishDate',], //筛选选项
|
||
filterBarKeys: { filterPrice: '价格', filterStock: '库存', filterSold: '总销量', filterPublishDate: '发布时间' }, // 筛选选项对应值
|
||
filterOptions: {
|
||
filterPrice: false,
|
||
filterStock: false,
|
||
filterSold: false,
|
||
filterPublishDate: false,
|
||
}, // 正反排序
|
||
selectedFilterValue: 0, //
|
||
myGoodList: [],// 保存后台返回的商品列表
|
||
myGoodListTotal: '0',// 后台的商品总数
|
||
goodsStateParam: 1,//商品状态参数
|
||
pageCountParam: 20,// 商品数量参数
|
||
currPageParam: 1,// 当前页面 参数
|
||
isCheckAll: false,// 是否checked
|
||
goodsIdList: [],//商品Id 列表
|
||
isOpenDeleteModal: false,// 是否显示删除模态框
|
||
isOpenOffStockModal: false,// 是否显示下架模态框
|
||
isAddToList: false,// 是否下拉加载 如果是 就添加商品到我的商品列表
|
||
isShowTopNav: false,// 是否显示返回顶部按钮
|
||
screenWidth: '',
|
||
screenHeight: ''
|
||
}
|
||
}
|
||
|
||
|
||
productNameChange(event) {
|
||
this.setState({ productName: event })
|
||
}
|
||
productIdChange(event) {
|
||
this.setState({ productId: event })
|
||
}
|
||
lowestPriceChange(event) {
|
||
this.setState({ lowestPrice: event })
|
||
}
|
||
heightestPriceChange(event) {
|
||
this.setState({ heightestPrice: event })
|
||
}
|
||
minimumSoldChange(event) {
|
||
this.setState({ minimumSold: event })
|
||
}
|
||
maximumSoldChange(event) {
|
||
this.setState({ maximumSold: event })
|
||
}
|
||
productCateChange = e => {
|
||
this.setState({
|
||
productCateSelected: this.state.productCate[e.detail.value]
|
||
})
|
||
}
|
||
//获取宝贝类目搜索列表接口api
|
||
getBaoBeiCateList() {
|
||
Taro.request({
|
||
url: URL.BaoBeiCateList,
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
|
||
header: {
|
||
'Cookie': 'PFWSSS=' + getGlobalStorage('session_id'),
|
||
'content-type': 'application/x-www-form-urlencoded',
|
||
'X-Requested-With': 'XMLHttpRequest'
|
||
}
|
||
}).then(res => {
|
||
console.log('宝贝类目', res)
|
||
if (res.data.err_code != 10) {
|
||
const productCate = [{ name: '全部类目', id: '' }]
|
||
for (let item of res.data.goodsClass) {
|
||
productCate.push({ name: item.class_name, id: item.class_id })
|
||
}
|
||
this.setState({ productCate: productCate })
|
||
} else {
|
||
Taro.showToast({
|
||
title: res.data.err_msg,
|
||
icon: 'none',
|
||
duration: 1500,
|
||
})
|
||
}
|
||
})
|
||
}
|
||
|
||
// 获取我的商品列表接口api
|
||
getMyGoodListApi({
|
||
goodsName = this.state.productName,
|
||
goodsSn = this.state.productId,
|
||
goodsClass = this.state.productCateSelected.id,
|
||
goodsPriceL = this.state.lowestPrice,
|
||
goodsPriceU = this.state.heightestPrice,
|
||
goodsSalesL = this.state.minimumSold,
|
||
goodsSalesU = this.state.maximumSold,
|
||
goodsState = this.state.goodsStateParam,
|
||
pageCount = this.state.pageCountParam,
|
||
currPage = this.state.currPageParam,
|
||
order = this.state.order,
|
||
}) {
|
||
Taro.request({
|
||
url: URL.MyGoodList,
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
data: {
|
||
goodsName: goodsName,
|
||
goodsSn: goodsSn,
|
||
goodsClass: goodsClass,
|
||
goodsPriceL: goodsPriceL,
|
||
goodsPriceU: goodsPriceU,
|
||
goodsSalesL: goodsSalesL,
|
||
goodsSalesU: goodsSalesU,
|
||
goodsState: goodsState,
|
||
pageCount: pageCount,
|
||
currPage: currPage,
|
||
order: order
|
||
},
|
||
header: {
|
||
'Cookie': 'PFWSSS=' + getGlobalStorage('session_id'),
|
||
'content-type': 'application/x-www-form-urlencoded',
|
||
'X-Requested-With': 'XMLHttpRequest'
|
||
}
|
||
}).then(res => {
|
||
const data = JSON.parse(res.data)
|
||
if (data.err_code === 88888) {
|
||
loginExpired(data)
|
||
} else if (data.err_code != 10) {
|
||
console.log('我的商品列表', JSON.parse(res.data))
|
||
|
||
Taro.hideLoading()
|
||
if (data.goodsCount != '0' && data.goods.length) {
|
||
data.goods.forEach(item => {
|
||
item.checked = false
|
||
});
|
||
if (this.state.isAddToList) {
|
||
this.setState({ myGoodList: this.state.myGoodList.concat(data.goods) }, () => {
|
||
this.setState({ isAddToList: false })
|
||
})
|
||
} else {
|
||
this.setState({
|
||
myGoodList: data.goods,
|
||
myGoodListTotal: data.goodsCount
|
||
})
|
||
}
|
||
} else {
|
||
if (data.goods === null) {
|
||
this.setState({
|
||
myGoodList: [],
|
||
myGoodListTotal: data.goodsCount
|
||
})
|
||
} else {
|
||
this.setState({ isAddToList: false })
|
||
Taro.showToast({
|
||
title: '没有更多了',
|
||
icon: 'none'
|
||
})
|
||
}
|
||
}
|
||
} else {
|
||
Taro.showToast({
|
||
title: data.err_msg,
|
||
icon: 'none'
|
||
})
|
||
}
|
||
})
|
||
|
||
}
|
||
// 获取搜索结果api
|
||
// getMyGoodListApi({
|
||
// goodsName = this.state.productName,
|
||
// goodsSn = '',
|
||
// goodsClass = this.state.productCateSelected.id,
|
||
// goodsPriceL = this.state.lowestPrice,
|
||
// goodsPriceU = this.state.heightestPrice,
|
||
// goodsSalesL = this.state.minimumSold,
|
||
// goodsSalesU = this.state.maximumSold,
|
||
// shopClassID = this.state.productId,
|
||
// goodsState = this.state.goodsStateParam,
|
||
// pageCount = this.state.pageCountParam,
|
||
// currPage = this.state.currPageParam,
|
||
// order = '', }) {
|
||
// Taro.request({
|
||
// url: URL.MyGoodList,
|
||
// method: 'POST',
|
||
// dataType: 'json',
|
||
|
||
// data: {
|
||
// goodsName: goodsName,
|
||
// goodsSn: goodsSn,
|
||
// goodsClass: goodsClass,
|
||
// goodsPriceL: goodsPriceL,
|
||
// goodsPriceU: goodsPriceU,
|
||
// goodsSalesL: goodsSalesL,
|
||
// goodsSalesU: goodsSalesU,
|
||
// shopClassID: shopClassID,
|
||
// goodsState: goodsState,
|
||
// pageCount: pageCount,
|
||
// currPage: currPage,
|
||
// order: order
|
||
// },
|
||
// header: {
|
||
// 'Cookie': 'PFWSSS=' + getGlobalStorage('session_id'),
|
||
// 'content-type': 'application/x-www-form-urlencoded',
|
||
// 'X-Requested-With': 'XMLHttpRequest'
|
||
// }
|
||
// }).then(res => {
|
||
// if (res.statusCode === 200) {
|
||
// console.log('我的商品列表', JSON.parse(res.data))
|
||
// const data = JSON.parse(res.data)
|
||
// const goodCount = Number(data.goodsCount)
|
||
// this.setState({
|
||
// myGoodList: data.goods,
|
||
// myGoodListTotal: goodCount
|
||
// })
|
||
// Taro.hideLoading()
|
||
|
||
// } else {
|
||
// console.log('我的商品列表获取失败')
|
||
// }
|
||
|
||
|
||
// })
|
||
|
||
// }
|
||
|
||
// 商品列表下架API
|
||
changeGoodState({ goodsState = 0, goodsID = this.state.goodsIdList }) {
|
||
Taro.request({
|
||
url: URL.ChangeGoodState,
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
|
||
data: {
|
||
goodsState: goodsState,
|
||
goodsID: JSON.stringify(goodsID)
|
||
},
|
||
header: {
|
||
'Cookie': 'PFWSSS=' + getGlobalStorage('session_id'),
|
||
'content-type': 'application/x-www-form-urlencoded',
|
||
'X-Requested-With': 'XMLHttpRequest'
|
||
}
|
||
}).then(res => {
|
||
let responseData = JSON.parse(res.data)
|
||
Taro.hideLoading()
|
||
if (responseData.err_code === 0) {
|
||
this.setState({
|
||
isCheckAll: false,
|
||
currPageParam: 1,
|
||
|
||
}, () => {
|
||
this.getMyGoodListApi({})
|
||
Taro.showToast({
|
||
title: '下架成功',
|
||
icon: 'success',
|
||
duration: 1500
|
||
})
|
||
})
|
||
} else if (responseData.err_code === 88888) {
|
||
loginExpired(res)
|
||
} else {
|
||
Taro.showToast({
|
||
title: responseData.err_msg,
|
||
icon: 'none',
|
||
duration: 1500
|
||
})
|
||
this.setState({ isCheckAll: false })
|
||
}
|
||
|
||
|
||
})
|
||
|
||
}
|
||
// 商品列表删除api
|
||
deleteGood({ goodsState = 1, goodsID = this.state.goodsIdList }) {
|
||
Taro.request({
|
||
url: URL.DeleteGood,
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
|
||
data: {
|
||
goodsState: goodsState,
|
||
goodsID: JSON.stringify(goodsID)
|
||
},
|
||
header: {
|
||
'Cookie': 'PFWSSS=' + getGlobalStorage('session_id'),
|
||
'content-type': 'application/x-www-form-urlencoded',
|
||
'X-Requested-With': 'XMLHttpRequest'
|
||
}
|
||
}).then(res => {
|
||
let responseData = JSON.parse(res.data)
|
||
Taro.hideLoading()
|
||
if (responseData.err_code === 0) {
|
||
Taro.showToast({
|
||
title: '删除成功',
|
||
icon: 'success',
|
||
duration: 1500
|
||
}).then(() => {
|
||
this.setState({ isCheckAll: false, currPageParam: 1 }, () => {
|
||
this.getMyGoodListApi({})
|
||
})
|
||
|
||
})
|
||
} else if (responseData.err_code === 88888) {
|
||
loginExpired(res)
|
||
} else {
|
||
Taro.showToast({
|
||
title: responseData.err_msg,
|
||
icon: 'none',
|
||
duration: 1500
|
||
})
|
||
this.setState({ isCheckAll: false })
|
||
}
|
||
|
||
|
||
|
||
})
|
||
|
||
}
|
||
|
||
|
||
|
||
|
||
// 搜索
|
||
searchButtonHandler() {
|
||
showLoading({
|
||
title: '加载中',
|
||
})
|
||
this.setState({ currPageParam: 1, isCheckAll: false, order: '' }, () => {
|
||
this.getMyGoodListApi({})
|
||
})
|
||
}
|
||
|
||
|
||
// 清空搜索
|
||
emptyButtonHanlder() {
|
||
this.setState({
|
||
isCheckAll: false,
|
||
currPageParam: 1,
|
||
productName: '',
|
||
lowestPrice: '',
|
||
heightestPrice: '',
|
||
minimumSold: '',
|
||
maximumSold: '',
|
||
productId: '',
|
||
productCateSelected: { id: '', name: '全部类目' },
|
||
order: '',
|
||
}, () => {
|
||
this.getMyGoodListApi({})
|
||
Taro.showToast({
|
||
title: '已清空',
|
||
icon: 'success',
|
||
duration: 1000
|
||
})
|
||
})
|
||
|
||
}
|
||
// 产品排序
|
||
accendingDescending(e) {
|
||
showLoading({
|
||
title: '加载中'
|
||
})
|
||
const value = onClickValueService(e)
|
||
this.setState({ selectedFilterValue: value })
|
||
if (value == 0) {
|
||
this.setState({
|
||
currPageParam: 1,
|
||
filterOptions: {
|
||
filterPrice: !this.state.filterOptions.filterPrice,
|
||
filterStock: false,
|
||
filterSold: false,
|
||
filterPublishDate: false,
|
||
}
|
||
}, () => {
|
||
this.state.filterOptions.filterPrice ? this.setState({ order: "goods_price" }, () => {
|
||
this.getMyGoodListApi({})
|
||
}) : this.setState({ order: "goods_price desc" }, () => {
|
||
this.getMyGoodListApi({})
|
||
})
|
||
|
||
|
||
})
|
||
}
|
||
if (value == 1) {
|
||
this.setState({
|
||
currPageParam: 1,
|
||
filterOptions: {
|
||
filterPrice: false,
|
||
filterStock: !this.state.filterOptions.filterStock,
|
||
filterSold: false,
|
||
filterPublishDate: false,
|
||
}
|
||
}, () => {
|
||
this.state.filterOptions.filterStock ? this.setState({ order: "goods_stock" }, () => {
|
||
this.getMyGoodListApi({})
|
||
}) : this.setState({ order: "goods_stock desc" }, () => {
|
||
this.getMyGoodListApi({})
|
||
})
|
||
}
|
||
)
|
||
}
|
||
if (value == 2) {
|
||
this.setState({
|
||
currPageParam: 1,
|
||
filterOptions: {
|
||
filterPrice: false,
|
||
filterStock: false,
|
||
filterSold: !this.state.filterOptions.filterSold,
|
||
filterPublishDate: false,
|
||
|
||
}
|
||
}, () => {
|
||
this.state.filterOptions.filterSold ? this.setState({ order: "sales_volume " }, () => {
|
||
this.getMyGoodListApi({})
|
||
}) : this.setState({ order: "sales_volume desc" }, () => {
|
||
this.getMyGoodListApi({})
|
||
})
|
||
}
|
||
|
||
)
|
||
}
|
||
if (value == 3) {
|
||
this.setState({
|
||
currPageParam: 1,
|
||
filterOptions: {
|
||
filterPrice: false,
|
||
filterStock: false,
|
||
filterSold: false,
|
||
filterPublishDate: !this.state.filterOptions.filterPublishDate,
|
||
|
||
}
|
||
}, () => {
|
||
this.state.filterOptions.filterPublishDate ? this.setState({ order: "update_date desc" }, () => {
|
||
this.getMyGoodListApi({})
|
||
}) : this.setState({ order: "update_date" }, () => {
|
||
this.getMyGoodListApi({})
|
||
})
|
||
}
|
||
)
|
||
}
|
||
}
|
||
|
||
|
||
// 商品全部选择
|
||
checkAllHandler() {
|
||
if (this.state.myGoodList.length) {
|
||
const newMyGoodList = this.state.myGoodList.map((item) => {
|
||
item.checked = !this.state.isCheckAll
|
||
return item
|
||
})
|
||
this.setState({ isCheckAll: !this.state.isCheckAll, myGoodList: newMyGoodList }, () => {
|
||
console.log('全选列表', this.state.myGoodList)
|
||
})
|
||
}
|
||
else {
|
||
this.setState({
|
||
isCheckAll: true
|
||
}, () => {
|
||
this.setState({ isCheckAll: false })
|
||
})
|
||
Taro.showToast({
|
||
title: '全选无效',
|
||
icon: 'none',
|
||
duration: 1500
|
||
}).then(() => {
|
||
|
||
})
|
||
|
||
}
|
||
}
|
||
|
||
|
||
// 单个商品选择
|
||
handleCheckChange(e) {
|
||
//如果goodid 一样的那么checked 就取反
|
||
console.log('clicke')
|
||
const id = onClickValueService(e)
|
||
const newMyGoodList = this.state.myGoodList.map((item) => {
|
||
if (item.goods_id === id) {
|
||
item['checked'] = !item.checked
|
||
}
|
||
return item
|
||
})
|
||
this.setState({ myGoodList: newMyGoodList })
|
||
}
|
||
// 删除商品
|
||
deleteGoodsHandler() {
|
||
const checkedGoodsId = []
|
||
this.state.myGoodList.forEach(item => {
|
||
if (item.checked) {
|
||
checkedGoodsId.push(item.goods_id)
|
||
}
|
||
});
|
||
checkedGoodsId.length ? this.setState({ isOpenDeleteModal: true }) : Taro.showToast({
|
||
title: '请选择要删除的商品',
|
||
icon: 'none',
|
||
duration: 1500
|
||
})
|
||
// // this.deleteGood({ goodsID: checkedGoodsId })
|
||
|
||
|
||
|
||
}
|
||
// 改变商品状态
|
||
offStockGoodHandler() {
|
||
const checkedGoodsId = []
|
||
this.state.myGoodList.forEach(item => {
|
||
if (item.checked) {
|
||
checkedGoodsId.push(item.goods_id)
|
||
}
|
||
});
|
||
//this.changeGoodState({ goodsID: checkedGoodsId })
|
||
checkedGoodsId.length ? this.setState({ isOpenOffStockModal: true }) : Taro.showToast({
|
||
title: '请选择要下架的商品',
|
||
icon: 'none',
|
||
duration: 1500
|
||
})
|
||
}
|
||
// 导航到商品编辑页面myGoodsEdit
|
||
goToGoodEditPage(e) {
|
||
console.log('e', e)
|
||
const goodId = onClickValueService(e)
|
||
console.log('goodId', goodId)
|
||
Taro.navigateTo({
|
||
url: '/pages/myGoodsEdit/myGoodsEdit?id=' + goodId
|
||
})
|
||
}
|
||
// 导航到商品发布页面
|
||
|
||
goToGoodsPublishPage() {
|
||
Taro.navigateTo({
|
||
url: '/pages/goodsPublish/goodsPublish'
|
||
})
|
||
}
|
||
goToGoodspage(e) {
|
||
const goodId = onClickValueService(e)
|
||
Taro.navigateTo({
|
||
url: '/pages/goods/goods?id=' + goodId
|
||
})
|
||
}
|
||
|
||
DeleteConfirm() {
|
||
this.setState({
|
||
isOpenDeleteModal: false
|
||
})
|
||
const checkedGoodsId = []
|
||
this.state.myGoodList.forEach(item => {
|
||
if (item.checked) {
|
||
checkedGoodsId.push(item.goods_id)
|
||
}
|
||
});
|
||
showLoading({
|
||
title: '加载中'
|
||
})
|
||
this.deleteGood({ goodsID: checkedGoodsId })
|
||
}
|
||
deleteModalClose() {
|
||
this.setState({
|
||
isOpenDeleteModal: false
|
||
})
|
||
}
|
||
OffStockConfirm() {
|
||
|
||
this.setState({
|
||
isOpenOffStockModal: false
|
||
})
|
||
const checkedGoodsId = []
|
||
this.state.myGoodList.forEach(item => {
|
||
if (item.checked) {
|
||
checkedGoodsId.push(item.goods_id)
|
||
}
|
||
});
|
||
showLoading({
|
||
title: '加载中'
|
||
})
|
||
this.changeGoodState({ goodsID: checkedGoodsId })
|
||
}
|
||
offStockModalClose() {
|
||
this.setState({
|
||
isOpenOffStockModal: false
|
||
})
|
||
}
|
||
goToCenterPage() {
|
||
Taro.switchTab({
|
||
url: '/pages/individualCenter/individualCenter'
|
||
})
|
||
}
|
||
getUserSystemInfo() {
|
||
Taro.getSystemInfo().then(res => {
|
||
return res
|
||
}).then(res => {
|
||
this.setState({
|
||
screenWidth: res.screenWidth - 80 + 'px',
|
||
screenHeight: res.screenHeight - 200 + 'px'
|
||
})
|
||
})
|
||
|
||
}
|
||
|
||
componentDidMount() {
|
||
this.getUserSystemInfo()
|
||
showLoading({
|
||
title: '加载中'
|
||
})
|
||
this.getMyGoodListApi({})
|
||
this.getBaoBeiCateList()
|
||
}
|
||
componentWillReceiveProps(nextProps) {
|
||
console.log(this.props, nextProps)
|
||
}
|
||
|
||
componentWillUnmount() { }
|
||
|
||
componentDidShow() {
|
||
|
||
}
|
||
|
||
componentDidHide() { }
|
||
// 页面位置
|
||
onPageScroll(location) {
|
||
if (location.scrollTop <= 300 && this.state.isShowTopNav) {
|
||
this.setState({ isShowTopNav: false })
|
||
} else if (location.scrollTop > 300 && !this.state.isShowTopNav) {
|
||
this.setState({ isShowTopNav: true })
|
||
}
|
||
}
|
||
// 底部加载
|
||
onReachBottom() {
|
||
showLoading({
|
||
title: '加载中'
|
||
})
|
||
this.setState({ isAddToList: true, currPageParam: this.state.currPageParam + 1 }, () => {
|
||
this.getMyGoodListApi({})
|
||
})
|
||
|
||
|
||
}
|
||
|
||
render() {
|
||
//等待接口数据
|
||
const goodListElementArray = this.state.myGoodList.map((item, index) => {
|
||
return <View key={index} className='good-container'>
|
||
<View className='good-container-a'>
|
||
<Radio className='radio' value={item.goods_id} checked={item.checked} onClick={this.handleCheckChange.bind(this, item.goods_id)} ></Radio>
|
||
<View className='img-box' onClick={this.goToGoodspage.bind(this, item.goods_id)}>
|
||
{/* <Image mode='aspectFit' className='img' style='height:50px;width:50px' src={URL.Base + item.goods_url} /> */}
|
||
<Image className='img' style='height:100%;width:100%' src={URL.Base + item.goods_url} />
|
||
</View>
|
||
<View className='name-box' onClick={this.goToGoodspage.bind(this, item.goods_id)} >{item.goods_name}</View>
|
||
<View className='price-box'>￥{item.goods_price}</View>
|
||
<View className='quantity-box'>{item.sales_volume}</View>
|
||
|
||
</View>
|
||
|
||
<View className='button-box1' onClick={this.goToGoodEditPage.bind(this, item.goods_id)}>
|
||
<Button className='button-orange' size='mini'>
|
||
编辑商品</Button>
|
||
</View>
|
||
</View>
|
||
})
|
||
// 筛选项目排序element
|
||
const filterElementsArray = this.state.filterBar.map((item, index) => {
|
||
let isTure = this.state.filterOptions[item]
|
||
|
||
return <View key={index} onClick={this.accendingDescending.bind(this, index)} className={index === this.state.selectedFilterValue ? 'filter-title actived' : 'filter-title'}>
|
||
<Text className='text-a'>
|
||
{this.state.filterBarKeys[item]}
|
||
</Text>
|
||
{isTure ? <AtIcon value='chevron-down' size='10' color='#F00'></AtIcon> : <AtIcon value='chevron-up' size='10' color='#F00'></AtIcon>}
|
||
</View>
|
||
})
|
||
// 删除提示模态弹窗element
|
||
const modalMessageDeleteElement = <AtModal isOpened={this.state.isOpenDeleteModal}>
|
||
<AtModalHeader>提示</AtModalHeader>
|
||
<AtModalContent>
|
||
确定要删除已选商品？
|
||
</AtModalContent>
|
||
<AtModalAction> <Button onClick={this.deleteModalClose.bind(this)}>取消</Button> <Button className='orange' onClick={this.DeleteConfirm.bind(this)}>确定</Button> </AtModalAction>
|
||
</AtModal>
|
||
// 下架提示模态弹窗element
|
||
const modalMessageOffStockElement = <AtModal isOpened={this.state.isOpenOffStockModal}>
|
||
<AtModalHeader>提示</AtModalHeader>
|
||
<AtModalContent>
|
||
确定要下架已选商品？
|
||
</AtModalContent>
|
||
<AtModalAction> <Button onClick={this.offStockModalClose.bind(this)}>取消</Button> <Button className='orange' onClick={this.OffStockConfirm.bind(this)}>确定</Button> </AtModalAction>
|
||
</AtModal>
|
||
|
||
return (
|
||
<MovableArea style='height: 100vh; width: 100%; '>
|
||
<View className='MyGoodList' >
|
||
{/* 删除模态提示框 */}
|
||
{modalMessageDeleteElement}
|
||
{/* 下架模态框提示 */}
|
||
{modalMessageOffStockElement}
|
||
|
||
<View className='border-box'>
|
||
<AtInput
|
||
name='value'
|
||
title='宝贝名称：'
|
||
placeholder='宝贝名称'
|
||
type='text'
|
||
value={this.state.productName}
|
||
onChange={this.productNameChange.bind(this)}
|
||
border={false}
|
||
/>
|
||
</View>
|
||
<View className='border-box'>
|
||
<AtInput
|
||
name='value'
|
||
title='最低价：'
|
||
className='input'
|
||
|
||
type='number'
|
||
value={this.state.lowestPrice}
|
||
onChange={this.lowestPriceChange.bind(this)}
|
||
border={false}
|
||
/>
|
||
<AtInput
|
||
name='value'
|
||
title='最高价：'
|
||
className='input'
|
||
type='number'
|
||
value={this.state.heightestPrice}
|
||
border={false}
|
||
onChange={this.heightestPriceChange.bind(this)}
|
||
/>
|
||
</View>
|
||
<View className='border-box'>
|
||
<AtInput
|
||
name='value'
|
||
title='最低销量：'
|
||
className='input'
|
||
type='number'
|
||
value={this.state.minimumSold}
|
||
border={false}
|
||
onChange={this.minimumSoldChange.bind(this)}
|
||
/>
|
||
<AtInput
|
||
name='value'
|
||
title='最高销量：'
|
||
className='input'
|
||
type='number'
|
||
value={this.state.maximumSold}
|
||
border={false}
|
||
onChange={this.maximumSoldChange.bind(this)}
|
||
/>
|
||
</View>
|
||
|
||
<View className='border-box'>
|
||
<AtInput
|
||
border={false}
|
||
name='value'
|
||
title='商品编码：'
|
||
type='number'
|
||
value={this.state.productId}
|
||
onChange={this.productIdChange.bind(this)}
|
||
border={false}
|
||
/>
|
||
</View>
|
||
<View className='page-section'>
|
||
<Picker mode='selector' rangeKey='name' range={this.state.productCate} onChange={this.productCateChange.bind(this)}>
|
||
<View className='picker'>
|
||
<View className='title-box'>
|
||
<Text className='title'>宝贝类目:</Text>
|
||
|
||
<Text className='selected'>{this.state.productCateSelected.name}</Text>
|
||
</View>
|
||
|
||
</View>
|
||
</Picker>
|
||
</View>
|
||
<View className='button-box'>
|
||
<View className='button' onClick={this.searchButtonHandler.bind(this)}>
|
||
<Button size='mini' className='button-orange'>
|
||
<AtIcon value='search' size='12' color='white'></AtIcon>
|
||
搜索</Button>
|
||
</View>
|
||
<View className='button' onClick={this.goToGoodsPublishPage.bind(this)}>
|
||
<Button className='button-green' size='mini'>
|
||
<AtIcon value='add' size='12' color='white'></AtIcon>
|
||
新增</Button>
|
||
</View>
|
||
<View className='button' onClick={this.emptyButtonHanlder.bind(this)}>
|
||
<Button className='button-dark-red' size='mini'>
|
||
|
||
<AtIcon value='trash' size='12' color='white'></AtIcon>
|
||
清空条件</Button>
|
||
</View>
|
||
</View>
|
||
<View className='text'>
|
||
<Text>出售中的宝贝{this.state.myGoodListTotal}条记录</Text>
|
||
</View>
|
||
<View className='filterbar-container'>
|
||
<View className='filter-bar'>
|
||
{filterElementsArray}
|
||
|
||
</View>
|
||
<View className='sub-filter'>
|
||
<Radio className='radio' checked={this.state.isCheckAll} onClick={this.checkAllHandler.bind(this)}>全选</Radio>
|
||
<View className='button' onClick={this.deleteGoodsHandler.bind(this)}>
|
||
<Button size='mini' className='button-dark-red'>
|
||
删除</Button>
|
||
</View>
|
||
<View className='button' onClick={this.offStockGoodHandler.bind(this)}>
|
||
<Button size='mini' className='button-blue'>
|
||
下架</Button>
|
||
</View>
|
||
</View>
|
||
</View>
|
||
{this.state.myGoodList.length ? <View className='mygoodlist-container'>
|
||
|
||
{goodListElementArray}
|
||
</View > : <View className='no-more-title'> 没有更多了</View>}
|
||
{this.state.isShowTopNav ? <ScrollToTopComponent ></ScrollToTopComponent> : null}
|
||
|
||
|
||
|
||
<CopyrightComponent></CopyrightComponent>
|
||
|
||
</View>
|
||
<MovableView className='movable-point' x={this.state.screenWidth} y={this.state.screenHeight} style='opacity:0.3' direction='all' onClick={this.goToCenterPage.bind(this)} >
|
||
|
||
个人中心
|
||
</MovableView>
|
||
</MovableArea>
|
||
)
|
||
}
|
||
}
|
||
|
||
export default MyGoodList
|