517 lines
16 KiB
JavaScript
517 lines
16 KiB
JavaScript
|
||
import Taro, { Component } from '@tarojs/taro'
|
||
import { View, Text, Button, Input, Picker } from '@tarojs/components'
|
||
import { AtInput, AtTextarea, AtModal, AtModalHeader, AtModalContent, AtModalAction, AtImagePicker } from 'taro-ui'
|
||
|
||
import InteractionComponent from '../../component/interactionComponent/interactionComponent'
|
||
import AliIndustryTypeInteraction from '../../component/aliIndustryTypeInteraction/aliIndustryTypeInteraction'
|
||
import CopyrightComponent from '../../component/copyrightComponent/copyrightComponent'
|
||
import AliPictureUploadComponent from '../../component/aliPictureUploadComponent/aliPictureUploadComponent'
|
||
import URL from '../../serviceAPI.config'
|
||
import './myNeedsEdit.scss'
|
||
import loginExpired from '../../util/loginExpired';
|
||
import { getGlobalStorage } from '../../util/getSetStoage';
|
||
import { showLoading } from '../../util/hideShowLoading';
|
||
import platformChecker from '../../util/plaformChecker';
|
||
|
||
class MyNeedsEdit extends Component {
|
||
|
||
config = {
|
||
navigationBarTitleText: '需求编辑'
|
||
}
|
||
constructor() {
|
||
super(...arguments)
|
||
this.state = {
|
||
|
||
industryTypeSelected: '',
|
||
needsType: [{ name: '业主需求', id: '4' }, { name: '效果图', id: '5' }],
|
||
needsTypeSelected: { name: '业主需求', id: '4' },
|
||
needsState: [
|
||
{ name: '作废', id: '0' },
|
||
{ name: '在用', id: '1' },
|
||
],
|
||
needsStateSelected: { name: '全部', id: '' },
|
||
title: '',
|
||
sd_id: '', //需求id
|
||
contactName: '',
|
||
contactNumber: '',
|
||
contactAddress: '',
|
||
content: '',//描述
|
||
pickerImageUrl: [],
|
||
ImagesInfo: [],// 图片详细信息
|
||
initialImagesInfo: [],//初始化图片信息
|
||
initialImageURL: [],//初始化图片url
|
||
isDeleteModal: false,// 删除提示框
|
||
isSaveAndNew: false,//是否点击保存新增按钮
|
||
|
||
|
||
}
|
||
}
|
||
//获取需求信息api
|
||
getMyNeedEditInfo() {
|
||
let id = decodeURIComponent(this.$router.params.id)
|
||
Taro.request({
|
||
url: URL.EditMyNeeds,
|
||
method: 'GET',
|
||
dataType: 'json',
|
||
data: {
|
||
demandId: id,
|
||
},
|
||
header: {
|
||
'content-type': 'application/x-www-form-urlencoded',
|
||
'Cookie': 'PFWSSS=' + getGlobalStorage('session_id'),
|
||
'X-Requested-With': 'XMLHttpRequest'
|
||
}
|
||
})
|
||
.then(res => {
|
||
console.log('需求详情获取成功', res)
|
||
// const selectedType = this.state.demandingSupplyCate.filter(item => item.id == res.data.sdInfo.sd_type)[0]
|
||
// const selectedState = this.state.needsState.filter(item => item.id == res.data.sdInfo.state)[0]
|
||
if (res.data.err_code === 0) {
|
||
|
||
let industryType = {}
|
||
const classId = res.data.sdInfo.class_id
|
||
for (let outter of res.data.supplyTree) {
|
||
if (outter.children) {
|
||
for (let inner of outter.children) {
|
||
if (inner.class_id === classId) {
|
||
industryType.name = inner.class_name
|
||
industryType.id = inner.class_id
|
||
break
|
||
}
|
||
}
|
||
}
|
||
if (outter.class_id === classId) {
|
||
industryType.name = outter.class_name
|
||
industryType.id = outter.class_id
|
||
break
|
||
}
|
||
}
|
||
if (!Object.keys(industryType).length) {
|
||
industryType.name = '全部'
|
||
industryType.id = '-1'
|
||
}
|
||
const needsType = this.state.needsType.filter(item => {
|
||
return item.id === res.data.sdInfo.sd_type
|
||
})[0]
|
||
const imageFile = res.data.sdInfo.file_path.map(item => { return { url: URL.Base + item.file_path } })
|
||
const needsState = this.state.needsState.filter(item => {
|
||
return item.id === res.data.sdInfo.state
|
||
})[0]
|
||
this.setState({
|
||
sd_id: res.data.sdInfo.sd_id,
|
||
industryTypeSelected: industryType,
|
||
needsTypeSelected: needsType,
|
||
title: res.data.sdInfo.sd_title,
|
||
contactName: res.data.sdInfo.user_name,
|
||
contactNumber: res.data.sdInfo.user_phone,
|
||
contactAddress: res.data.sdInfo.user_address,
|
||
content: res.data.sdInfo.sd_desc,
|
||
needsStateSelected: needsState,
|
||
initialImageURL: imageFile,
|
||
initialImagesInfo: res.data.sdInfo.file_path,
|
||
ImageURL: imageFile,
|
||
ImagesInfo: res.data.sdInfo.file_path,
|
||
})
|
||
|
||
} else if (JSON.parse(res.data).err_code === 88888) {
|
||
loginExpired(res)
|
||
} else {
|
||
Taro.showToast({
|
||
title: JSON.parse(res.data).err_msg,
|
||
icon: 'none'
|
||
})
|
||
|
||
}
|
||
}
|
||
)
|
||
}
|
||
|
||
// uploadMyNeedsApi 上传需求 的api
|
||
uploadMyNeedsApi() {
|
||
|
||
const file_path = [];
|
||
this.state.ImagesInfo.forEach((item) => {
|
||
file_path.push({
|
||
file_name: item.file_name,
|
||
file_size: item.file_size,
|
||
file_path: item.file_path,
|
||
thumb_path: item.thumb_path
|
||
})
|
||
})
|
||
Taro.request({
|
||
url: URL.PublishMyNeed,
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
data: {
|
||
action: 2,
|
||
sdInfo: JSON.stringify({
|
||
class_id: this.state.industryTypeSelected.id,
|
||
sd_id: this.state.sd_id,
|
||
sd_type: this.state.needsTypeSelected.id,
|
||
sd_title: this.state.title,
|
||
user_name: this.state.contactName,
|
||
user_phone: this.state.contactNumber,
|
||
user_address: this.state.contactAddress,
|
||
sd_desc: this.state.content,
|
||
state: this.state.needsStateSelected.id,
|
||
file_path: file_path,
|
||
|
||
})
|
||
},
|
||
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) {
|
||
Taro.showToast({
|
||
title: res.data.err_msg === 'success' ? '保存成功' : res.data.err_msg,
|
||
icon: res.data.err_msg === 'success' ? 'success' : 'none',
|
||
duration: 1500
|
||
}).then(() => {
|
||
setTimeout(() => {
|
||
console.log('this.state.isSaveAndNew', this.state.isSaveAndNew)
|
||
if (this.state.isSaveAndNew) {
|
||
// Taro.navigateTo({
|
||
// url: '/pages/myNeedsPublish/myNeedsPublish'
|
||
// })
|
||
} else {
|
||
// Taro.navigateTo({
|
||
// url: '/pages/myNeedsEdit/myNeedsEdit?id=' + this.state.sd_id
|
||
// })
|
||
Taro.reLaunch({
|
||
url: '/pages/myNeeds/myNeeds'
|
||
})
|
||
}
|
||
}, 1500);
|
||
})
|
||
} else if (res.data.err_code === 88888) {
|
||
loginExpired(res)
|
||
} else {
|
||
Taro.showToast({
|
||
title: '保存失败',
|
||
icon: 'none',
|
||
duration: 1500
|
||
})
|
||
}
|
||
}
|
||
)
|
||
|
||
}
|
||
|
||
//删除我的需求 api DeleteMyNeeds
|
||
deleteMyNeeds({ demandId = 10 }) {
|
||
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 => {
|
||
console.log('删除我的列表', res)
|
||
if (res.data.err_code === 0) {
|
||
Taro.showToast({
|
||
title: '删除成功',
|
||
icon: 'success',
|
||
duration: 1000
|
||
})
|
||
setTimeout(() => {
|
||
Taro.switchTab({
|
||
url: '/pages/myNeeds/myNeeds'
|
||
})
|
||
|
||
}, 1000);
|
||
} else if (res.data.err_code === 88888) {
|
||
loginExpired(res)
|
||
} else {
|
||
Taro.showToast({
|
||
title: res.data.err_msg,
|
||
icon: 'none',
|
||
duration: 1500
|
||
})
|
||
}
|
||
})
|
||
|
||
}
|
||
// 修改需求类型
|
||
needsTypeChange = e => {
|
||
this.setState({
|
||
needsTypeSelected: this.state.needsType[e.detail.value]
|
||
})
|
||
}
|
||
// 修改供求状态
|
||
needsStateChange = e => {
|
||
this.setState({
|
||
needsStateSelected: this.state.needsState[e.detail.value]
|
||
})
|
||
}
|
||
//改标题
|
||
titleChange(event) {
|
||
this.setState({ title: event })
|
||
}
|
||
contactNameChange(event) {
|
||
this.setState({ contactName: event })
|
||
}
|
||
contactNumberChange(event) {
|
||
this.setState({ contactNumber: event })
|
||
}
|
||
contactAddressChange(event) {
|
||
this.setState({ contactAddress: event.target.value })
|
||
}
|
||
contentChange(event) {
|
||
this.setState({ content: event.target.value })
|
||
}
|
||
goToMyNeedsPage() {
|
||
Taro.switchTab({
|
||
url: '/pages/myNeeds/myNeeds'
|
||
})
|
||
}
|
||
|
||
// 保存需求按钮
|
||
saveButtonHandler() {
|
||
if (this.state.title &&
|
||
this.state.contactName
|
||
&& this.state.contactNumber
|
||
&& this.state.content && this.state.needsStateSelected) {
|
||
showLoading({
|
||
title: '保存中'
|
||
})
|
||
this.setState({ isSaveAndNew: false }, () => {
|
||
this.uploadMyNeedsApi({})
|
||
})
|
||
} else {
|
||
Taro.showToast({
|
||
title: '请填写完表格',
|
||
icon: 'none',
|
||
duration: 1500
|
||
})
|
||
}
|
||
}
|
||
// 从图片子组件获取信息
|
||
getImageDetails(value) {
|
||
this.setState({
|
||
ImagesInfo: value
|
||
})
|
||
}
|
||
// 保存新增按钮
|
||
saveAndNewButton() {
|
||
if (this.state.title &&
|
||
this.state.contactName
|
||
&& this.state.contactNumber
|
||
&& this.state.content && this.state.needsStateSelected) {
|
||
showLoading({
|
||
title: '保存中'
|
||
})
|
||
this.setState({ isSaveAndNew: true }, () => {
|
||
this.uploadMyNeedsApi({})
|
||
})
|
||
} else {
|
||
Taro.showToast({
|
||
title: '请填写完表格',
|
||
icon: 'none',
|
||
duration: 1500
|
||
})
|
||
}
|
||
|
||
}
|
||
|
||
deleteButtonHandler() {
|
||
this.setState({ isDeleteModal: true })
|
||
}
|
||
|
||
handleWindowModCancel() {
|
||
this.setState({ isDeleteModal: false })
|
||
}
|
||
handleWindowConfirm() {
|
||
this.setState({ isDeleteModal: false })
|
||
this.deleteMyNeeds({ demandId: this.state.sd_id })
|
||
}
|
||
|
||
getDataFromChild(value) {
|
||
console.log('从子组件传回来的值', value)
|
||
this.setState({ industryTypeSelected: value })
|
||
}
|
||
|
||
|
||
componentDidMount() {
|
||
this.getMyNeedEditInfo()
|
||
}
|
||
componentWillReceiveProps(nextProps) {
|
||
console.log(this.props, nextProps)
|
||
}
|
||
|
||
componentWillUnmount() { }
|
||
|
||
componentDidShow() { }
|
||
|
||
componentDidHide() { }
|
||
|
||
render() {
|
||
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>
|
||
|
||
return (
|
||
<View className='supply-demand'>
|
||
{deleteModalWindowElement}
|
||
{/* 行业分类 */}
|
||
{platformChecker() ? <View className='InteractionComponent-wrapper'>
|
||
<InteractionComponent url={URL.GetIndustryTypeList} onPassDataToChild={this.getDataFromChild.bind(this)} selectedValue={this.state.industryTypeSelected} ></InteractionComponent></View>
|
||
: <AliIndustryTypeInteraction url={URL.GetIndustryTypeList} onPassDataToChild={this.getDataFromChild.bind(this)} selectedValue={this.state.industryTypeSelected} />}
|
||
|
||
{/* 需求类型 */}
|
||
<View className='padding-wrapper'>
|
||
<View className='page-section'>
|
||
<View>
|
||
<Picker mode='selector' rangeKey='name' range={this.state.needsType} onChange={this.needsTypeChange.bind(this)}>
|
||
<View className='picker'>
|
||
<View className='title-box'>
|
||
<Text className='title'><Text className='require'>*</Text>需求类型:</Text> <Text className='selected'>{this.state.needsTypeSelected.name}</Text>
|
||
</View>
|
||
|
||
</View>
|
||
</Picker>
|
||
</View>
|
||
</View>
|
||
<View className='border-box'>
|
||
<Text className='require'>*</Text><AtInput
|
||
name='value'
|
||
title='需求标题：'
|
||
type='text'
|
||
value={this.state.title}
|
||
border={false}
|
||
onChange={this.titleChange.bind(this)}
|
||
|
||
/>
|
||
|
||
</View>
|
||
<View className='input-box'>
|
||
<Text className='require'>*</Text>
|
||
<AtInput
|
||
name='value'
|
||
title='联系人：'
|
||
type='text'
|
||
value={this.state.contactName}
|
||
border={false}
|
||
onChange={this.contactNameChange.bind(this)}
|
||
/>
|
||
</View>
|
||
<View className='input-box' style='padding:24rpx 0;font-size:32rpx'>
|
||
<View className='title' style='font-weight:bold;'>
|
||
<Text style='color:red'>*</Text>
|
||
<Text>联系电话：</Text>
|
||
</View>
|
||
<View style='margin-left:5%;'>
|
||
<Input name='value'
|
||
maxLength='11'
|
||
type='number'
|
||
value={this.state.contactNumber}
|
||
onInput={this.contactNumberChange.bind(this)}
|
||
/></View>
|
||
</View>
|
||
|
||
<View className='demanding-box'>
|
||
<View className='title-box'>
|
||
<Text className='title'>联系地址:</Text>
|
||
</View>
|
||
|
||
<AtTextarea
|
||
value={this.state.contactAddress}
|
||
onChange={this.contactAddressChange.bind(this)}
|
||
maxlength='140'
|
||
placeholder='联系地址'
|
||
/>
|
||
</View>
|
||
<View className='demanding-box'>
|
||
<View className='title-box'>
|
||
<Text className='title'><Text className='require'>*</Text>需求内容:</Text>
|
||
</View>
|
||
<AtTextarea
|
||
value={this.state.content}
|
||
onChange={this.contentChange.bind(this)}
|
||
maxlength='140'
|
||
placeholder=''
|
||
/>
|
||
</View>
|
||
<View className='img-box'>
|
||
<View className='title-box'>
|
||
<Text className='title'>需求图片:</Text>
|
||
<View className='warn'>(最多4张)</View>
|
||
</View>
|
||
{platformChecker() ? <View className='img-container'>
|
||
<AtImagePicker
|
||
multiple
|
||
showAddBtn={this.state.pickerImageUrl.length < 4}
|
||
files={this.state.pickerImageUrl}
|
||
onChange={this.onChangeImg.bind(this)}
|
||
onFail={this.onFail.bind(this)}
|
||
onImageClick={this.onImageClick.bind(this)}
|
||
/>
|
||
</View> : <AliPictureUploadComponent
|
||
maxLength={4}
|
||
isReceiveImageUrl={true}
|
||
initialImageURL={this.state.initialImageURL}
|
||
initialImagesInfo={this.state.initialImagesInfo}
|
||
url={URL.UploadDSPorductImage}
|
||
onGetImageDetails={this.getImageDetails.bind(this)}
|
||
/>}
|
||
|
||
|
||
|
||
</View>
|
||
<View className='page-section'>
|
||
|
||
<View>
|
||
<Picker mode='selector' rangeKey='name' range={this.state.needsState} onChange={this.needsStateChange.bind(this)}>
|
||
<View className='picker'>
|
||
<View className='title-box'>
|
||
<Text className='title'> <Text className='require'>*</Text>状态:</Text> <Text className='selected'>{this.state.needsStateSelected.name}</Text>
|
||
</View>
|
||
|
||
</View>
|
||
</Picker>
|
||
</View>
|
||
</View>
|
||
|
||
<View className='button-box'>
|
||
<View className='button' onClick={this.saveButtonHandler.bind(this)}>
|
||
<Button size='mini' className='button-orange'>保存</Button>
|
||
</View>
|
||
{/* <View className='button' onClick={this.saveAndNewButton.bind(this)}>
|
||
<Button size='mini' className='button-green'>保存并新增</Button>
|
||
</View> */}
|
||
<View className='button' onClick={this.goToMyNeedsPage.bind(this)}>
|
||
<Button className='button-green' size='mini'>我的需求</Button>
|
||
</View>
|
||
{/* <View className='button' onClick={this.deleteButtonHandler.bind(this)}>
|
||
<Button className='button-dark-red' size='mini'>删除</Button>
|
||
</View> */}
|
||
</View>
|
||
<CopyrightComponent></CopyrightComponent>
|
||
|
||
</View>
|
||
</View>
|
||
)
|
||
}
|
||
}
|
||
|
||
export default MyNeedsEdit
|