373 lines
14 KiB
JavaScript
373 lines
14 KiB
JavaScript
//grabOrderPage
|
||
import Taro, { Component } from '@tarojs/taro'
|
||
import { View, Text, Button, Image } from '@tarojs/components'
|
||
import { AtModal, AtModalHeader, AtModalContent, AtModalAction, AtIcon } from 'taro-ui'
|
||
|
||
import URL from '../../serviceAPI.config'
|
||
|
||
import RenderingView from './renderingView/renderingView'
|
||
import CopyrightComponent from '../../component/copyrightComponent/copyrightComponent'
|
||
import './grabOrderPage.scss'
|
||
import loginExpired from '../../util/loginExpired';
|
||
import { getGlobalStorage } from '../../util/getSetStoage';
|
||
|
||
|
||
class GrabOrderPage extends Component {
|
||
config = {
|
||
navigationBarTitleText: '业主需求'
|
||
}
|
||
constructor() {
|
||
super(...arguments);
|
||
this.state = {
|
||
isShowRendering: false,
|
||
type: '',
|
||
title: '',
|
||
browsing: '',
|
||
contactName: '',
|
||
contactNumber: '',
|
||
address: '',
|
||
content: '',
|
||
images: [],
|
||
isOpen: false, // 抢单消息提示
|
||
grabOrderId: this.$router.params.orderId,
|
||
stateId: '',
|
||
stateName: '',
|
||
userId: '',
|
||
renderingImage: [],
|
||
isDeleteModal: false
|
||
}
|
||
}
|
||
|
||
//获取抢单信息api supplyDemandDetails
|
||
getGrabOrderInfo() {
|
||
Taro.request({
|
||
url: URL.supplyDemandDetails,
|
||
method: 'GET',
|
||
dataType: 'json',
|
||
data: {
|
||
demandId: this.$router.params.orderId,
|
||
},
|
||
header: {
|
||
'content-type': 'application/x-www-form-urlencoded',
|
||
'Cookie': 'PFWSSS=' + getGlobalStorage('session_id'),
|
||
'X-Requested-With': 'XMLHttpRequest'
|
||
}
|
||
})
|
||
.then(res => {
|
||
console.log('抢单详情获取成功', res)
|
||
Taro.hideLoading()
|
||
if (res.data.err_code === 0) {
|
||
this.setState({
|
||
type: res.data.sdInfo.class_name,
|
||
title: res.data.sdInfo.sd_title,
|
||
browsing: res.data.sdInfo.browse_times,
|
||
contactName: res.data.sdInfo.user_name,
|
||
contactNumber: res.data.sdInfo.user_phone,
|
||
address: res.data.sdInfo.user_address,
|
||
content: res.data.sdInfo.sd_desc,
|
||
images: res.data.sdInfo.file_path,
|
||
stateId: res.data.sdInfo.state,
|
||
stateName: res.data.sdInfo.state_name,
|
||
userId: res.data.sdInfo.user_id,
|
||
renderingImage: res.data.sdInfo.render_pics || []
|
||
})
|
||
} else if (res.data.err_code === 88888) {
|
||
loginExpired(res)
|
||
}else{
|
||
Taro.showToast({
|
||
title:res.data.err_msg,
|
||
icon:'none'
|
||
})
|
||
}
|
||
|
||
}
|
||
)
|
||
.catch(error => {
|
||
console.log('抢单详情获取失败', error)
|
||
})
|
||
}
|
||
//抢单请求
|
||
GrabDemand({ demandId = 218 }) {
|
||
Taro.request({
|
||
url: URL.GrabDemand,
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
data: {
|
||
demandId: demandId
|
||
},
|
||
header: {
|
||
'content-type': 'application/x-www-form-urlencoded',
|
||
'Cookie': 'PFWSSS=' + getGlobalStorage('session_id'),
|
||
'X-Requested-With': 'XMLHttpRequest'
|
||
}
|
||
})
|
||
.then(res => {
|
||
Taro.hideLoading()
|
||
if (res.data.err_code === 0) {
|
||
Taro.showToast({
|
||
title: '抢单成功',
|
||
icon: 'success',
|
||
duration: 1500
|
||
})
|
||
setTimeout(() => {
|
||
Taro.navigateBack({
|
||
delta:1
|
||
})
|
||
}, 1500);
|
||
|
||
} else if (res.data.err_code === 88888) {
|
||
loginExpired(res)
|
||
} else {
|
||
Taro.showToast({
|
||
title: res.data.err_msg,
|
||
icon: 'none',
|
||
duration: 1500
|
||
})
|
||
}
|
||
|
||
|
||
console.log('抢单请求：', res)
|
||
|
||
})
|
||
|
||
}
|
||
showImageButton() {
|
||
this.setState({
|
||
isShowRendering: true
|
||
})
|
||
}
|
||
callPhoneNumber() {
|
||
Taro.makePhoneCall({
|
||
phoneNumber: this.state.contactNumber
|
||
})
|
||
}
|
||
grabButtonHandler() {
|
||
this.setState({ isOpen: true })
|
||
}
|
||
handleGrabModalClose() {
|
||
this.setState({ isOpen: false })
|
||
}
|
||
handleGrabModalCancel() {
|
||
this.setState({ isOpen: false })
|
||
}
|
||
handleGrabConfirm() {
|
||
this.setState({ isOpen: false })
|
||
// 确认抢单之后
|
||
Taro.showLoading({
|
||
title: '加载中'
|
||
})
|
||
this.GrabDemand({ demandId: this.state.grabOrderId })
|
||
}
|
||
|
||
componentDidMount() {
|
||
Taro.showLoading({
|
||
title:'加载中'
|
||
})
|
||
this.getGrabOrderInfo()
|
||
}
|
||
componentWillReceiveProps(nextProps) {
|
||
console.log(this.props, nextProps)
|
||
}
|
||
|
||
componentWillUnmount() { }
|
||
|
||
componentDidShow() { }
|
||
|
||
componentDidHide() { }
|
||
goMyNeedsPublishPage() {
|
||
Taro.switchTab({
|
||
url: '/pages/myNeedsPublish/myNeedsPublish'
|
||
})
|
||
}
|
||
goToMyNeedsPage() {
|
||
Taro.switchTab({
|
||
url: '/pages/myNeeds/myNeeds'
|
||
})
|
||
}
|
||
goMyNeedEditPage() {
|
||
let id = this.$router.params.orderId
|
||
Taro.navigateTo({
|
||
url: '/pages/myNeedsEdit/myNeedsEdit?id=' + id
|
||
})
|
||
}
|
||
deleteButton() {
|
||
this.setState({ isDeleteModal: true })
|
||
}
|
||
handleWindowModCancel() {
|
||
this.setState({ isDeleteModal: false })
|
||
}
|
||
handleWindowConfirm() {
|
||
this.setState({ isDeleteModal: false })
|
||
this.deleteMyNeeds({ demandId: this.$router.params.orderId })
|
||
}
|
||
deleteMyNeeds({ demandId }) {
|
||
Taro.request({
|
||
url: URL.DeleteMyNeeds,
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
data: {
|
||
demandId: demandId
|
||
},
|
||
header: {
|
||
'Cookie': 'PFWSSS=' + getGlobalStorage('session_id'),
|
||
'content-type': 'application/x-www-form-urlencoded',
|
||
'X-Requested-With': 'XMLHttpRequest'
|
||
}
|
||
}).then(res => {
|
||
|
||
if (res.data.err_code === 0) {
|
||
Taro.showToast({
|
||
title: '删除成功',
|
||
icon: 'success',
|
||
duration: 1500
|
||
})
|
||
setTimeout(() => {
|
||
Taro.navigateBack({
|
||
delta:-1
|
||
})
|
||
}, 1500);
|
||
} else if (res.data.err_code === 88888) {
|
||
loginExpired(res)
|
||
} else {
|
||
Taro.showToast({
|
||
title: res.data.err_msg,
|
||
icon: 'none',
|
||
duration: 1500
|
||
})
|
||
}
|
||
})
|
||
}
|
||
|
||
render() {
|
||
const localStoageUserId = getGlobalStorage('userInfo').user_id
|
||
|
||
// 提示框
|
||
const deleteModalWindowElement = <AtModal isOpened={this.state.isDeleteModal}>
|
||
<AtModalHeader>提示</AtModalHeader>
|
||
<AtModalContent>
|
||
确认删除{this.state.needsItem.sd_title}？
|
||
</AtModalContent>
|
||
<AtModalAction> <Button onClick={this.handleWindowModCancel.bind(this)}>取消</Button> <Button className='orange' onClick={this.handleWindowConfirm.bind(this)}>确定</Button> </AtModalAction>
|
||
</AtModal>
|
||
let ButtonElement
|
||
if (localStoageUserId === this.state.userId && this.state.stateId === '1') {
|
||
ButtonElement = <View className='button-box'>
|
||
<View className='button' onClick={this.goMyNeedsPublishPage.bind(this)}>
|
||
<Button size='mini' className='button-green'>
|
||
<AtIcon value='add' size='12' color='white'></AtIcon>
|
||
新增</Button>
|
||
</View>
|
||
<View className='button' onClick={this.goToMyNeedsPage.bind(this)}>
|
||
<Button size='mini' className='button-orange'>
|
||
<AtIcon value='' size='12' color='white'></AtIcon>
|
||
我的需求</Button>
|
||
</View>
|
||
{/* <View className='button' onClick={this.goMyNeedEditPage.bind(this)}>
|
||
<Button size='mini' className='button-blue'>
|
||
<AtIcon value='settings' size='12' color='white'></AtIcon>
|
||
修改</Button>
|
||
</View>
|
||
|
||
<View className='button' onClick={this.deleteButton.bind(this)}>
|
||
<Button size='mini' className='button-dark-red'>
|
||
<AtIcon value='trash' size='12' color='white'></AtIcon>
|
||
删除</Button>
|
||
</View> */}
|
||
</View>
|
||
} else if (localStoageUserId === this.state.userId && this.state.stateId != '1') {
|
||
ButtonElement = <View className='button-box'>
|
||
<View className='button' onClick={this.goMyNeedsPublishPage.bind(this)}>
|
||
<Button size='mini' className='button-green'>
|
||
<AtIcon value='add' size='12' color='white'></AtIcon>
|
||
新增</Button>
|
||
</View>
|
||
<View className='button' onClick={this.goToMyNeedsPage.bind(this)}>
|
||
<Button size='mini' className='button-orange'>
|
||
<AtIcon value='' size='12' color='white'></AtIcon>
|
||
我的需求</Button>
|
||
</View>
|
||
</View>
|
||
} else if (this.state.stateId === '1') {
|
||
ButtonElement = <View className='button-box'><View className='button' onClick={this.grabButtonHandler.bind(this)}>
|
||
<Button size='mini' className='button-orange'>抢单</Button>
|
||
</View></View>
|
||
|
||
} else if (this.state.stateId === '2') {
|
||
ButtonElement = <View className='button-box'><View className='button'>
|
||
<Button size='mini' className='button-orange blur'>{this.state.stateName}</Button>
|
||
</View></View>
|
||
} else if (this.state.stateId === '3') {
|
||
ButtonElement = <View className='button-box'><View className='button'>
|
||
<Button size='mini' className='button-orange blur'>{this.state.stateName}</Button>
|
||
</View></View>
|
||
}
|
||
|
||
|
||
|
||
// 提示模态弹窗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 imageElementArray = this.state.images.map((item, index) => {
|
||
return <View className='image-wrapper' key={index}>
|
||
<Image mode='aspectFit' src={URL.Base + item.file_path} style='max-width:100%; max-height:100%;' />
|
||
</View>
|
||
})
|
||
|
||
return (
|
||
<View className='grabOrderPage'>
|
||
|
||
{modalMessageGrabElement}
|
||
{deleteModalWindowElement}
|
||
{this.state.isShowRendering ? <RenderingView rendering={this.state.renderingImage}></RenderingView> : null}
|
||
{this.state.stateId === '3' && !this.state.isShowRendering&&this.state.renderingImage.length ? <View className='button-box show-image-button'><View className='button' onClick={this.showImageButton.bind(this)}>
|
||
<Button className='button-orange'>查看效果图</Button>
|
||
</View></View> : null}
|
||
<View className='type box'>
|
||
<Text className='title'>行业分类：</Text>
|
||
<Text className='content'>{this.state.type}</Text>
|
||
</View>
|
||
<View className='sd-title box'>
|
||
<Text className='title'>业主需求标题：</Text>
|
||
<Text className='content'>{this.state.title}</Text>
|
||
</View>
|
||
<View className='browsing-amount box'>
|
||
<Text className='title'>浏览量：</Text>
|
||
<Text className='content'>{this.state.browsing}</Text>
|
||
</View>
|
||
<View className='contact-name box'>
|
||
<Text className='title'>联系人：</Text>
|
||
<Text className='content'>{this.state.contactName}</Text>
|
||
</View>
|
||
<View className='phone-number box' onClick={this.callPhoneNumber.bind(this)} >
|
||
<Text className='title'>联系电话：</Text>
|
||
<Text className='content'>{this.state.contactNumber}</Text>
|
||
</View>
|
||
<View className='address box'>
|
||
<Text className='title'>联系地址：</Text>
|
||
<Text className='content'>{this.state.address}</Text>
|
||
</View>
|
||
<View className='sd-content box'>
|
||
<Text className='title'>业主需求内容：</Text>
|
||
<Text className='content'>{this.state.content}</Text>
|
||
</View>
|
||
<View className='image-container box'>
|
||
{this.state.images.length ? <Text className='title'>业主需求图片:</Text> : null}
|
||
{imageElementArray}
|
||
</View>
|
||
{ButtonElement}
|
||
|
||
|
||
<CopyrightComponent></CopyrightComponent>
|
||
|
||
</View>
|
||
)
|
||
}
|
||
}
|
||
|
||
export default GrabOrderPage
|