9 changed files with 46 additions and 581 deletions
@ -1,389 +0,0 @@ |
|||||
import { $wuxActionSheet } from '../../../../dist/index' |
|
||||
import { addTopic } from '../../utils/api' |
|
||||
const QQMapWX = require('../../utils/qqmap-wx-jssdk') |
|
||||
const config = require('../../../../utils/config') |
|
||||
|
|
||||
Page({ |
|
||||
data: { |
|
||||
topicValue: '', |
|
||||
imageList: [], |
|
||||
qqmapsdk: '', |
|
||||
addressValue: '', |
|
||||
imageId: 1, |
|
||||
location: { |
|
||||
latitude: '', |
|
||||
longitude: '' |
|
||||
}, |
|
||||
groupId: '', |
|
||||
groupName: '', |
|
||||
addTopicPrevious: 0, |
|
||||
placeholderShow:true, |
|
||||
submitEvent: false, |
|
||||
isFirstNum:0,//0:初始状态,1:提交一次审核违规不通过
|
|
||||
isConReview:false,//true 强制发送
|
|
||||
}, |
|
||||
onShow () { |
|
||||
|
|
||||
}, |
|
||||
onLoad (options) { |
|
||||
const qqmapsdk = new QQMapWX({ |
|
||||
key: 'CMJBZ-4DECI-JXGGN-5B4WU-QLV2H-B5BEJ' |
|
||||
}) |
|
||||
this.setData({ |
|
||||
qqmapsdk, |
|
||||
groupId: options.groupId, |
|
||||
groupName: options.groupName |
|
||||
}) |
|
||||
this.getLocation() |
|
||||
}, |
|
||||
// 解决ios输入框遮挡占位符问题
|
|
||||
bindTopicFocus(){ |
|
||||
this.setData({ |
|
||||
placeholderShow:false |
|
||||
}) |
|
||||
}, |
|
||||
// 解决ios输入框遮挡占位符问题
|
|
||||
bindTopicBlur(e){ |
|
||||
this.setData({ |
|
||||
topicValue: e.detail.value, |
|
||||
}) |
|
||||
if(this.data.topicValue.length==0){ |
|
||||
this.setData({ |
|
||||
placeholderShow:true |
|
||||
}) |
|
||||
} |
|
||||
}, |
|
||||
// 话题内容框 值双向绑定
|
|
||||
bindTopicValue (e) { |
|
||||
console.log('输入事件') |
|
||||
this.setData({ |
|
||||
topicValue: e.detail.value, |
|
||||
}) |
|
||||
}, |
|
||||
// 地址框 值双向绑定
|
|
||||
bindAddressValue (e) { |
|
||||
this.setData({ |
|
||||
addressValue: e.detail.value |
|
||||
}) |
|
||||
console.log(this.data.addressValue) |
|
||||
}, |
|
||||
// 选择图片
|
|
||||
chooseImage () { |
|
||||
const that = this |
|
||||
$wuxActionSheet().showSheet({ |
|
||||
buttons: [{ |
|
||||
text: '拍照' |
|
||||
}, |
|
||||
{ |
|
||||
text: '从相册中获取' |
|
||||
}, |
|
||||
], |
|
||||
buttonClicked(index, item) { |
|
||||
if (index === 0) { |
|
||||
wx.chooseImage({ |
|
||||
count: 1, |
|
||||
sizeType: ['original', 'compressed'], |
|
||||
sourceType: ['camera'], |
|
||||
success (res) { |
|
||||
const imageList = [...that.data.imageList] |
|
||||
imageList.push({ |
|
||||
img: res.tempFilePaths[0], |
|
||||
upload: true, |
|
||||
id: that.data.imageId++, |
|
||||
ossUrl: '' |
|
||||
}) |
|
||||
that.setData({ |
|
||||
imageList |
|
||||
}) |
|
||||
wx.uploadFile({ |
|
||||
url: config.BASEURL() + 'group/topic/upload', |
|
||||
filePath: res.tempFilePaths[0], |
|
||||
name: 'file', |
|
||||
header: { |
|
||||
'Content-Type': 'multipart/form-data' |
|
||||
}, |
|
||||
success (fileres) { |
|
||||
const data = JSON.parse(fileres.data) |
|
||||
if (data.code === 0 && data.msg === 'success') { |
|
||||
imageList[imageList.length - 1].ossUrl = data.data |
|
||||
imageList[imageList.length - 1].upload = false |
|
||||
} else { |
|
||||
imageList.pop() |
|
||||
wx.showToast({ |
|
||||
title: '上传图片失败，请重试', |
|
||||
icon: 'none', |
|
||||
duration: 2000 |
|
||||
}) |
|
||||
} |
|
||||
that.setData({ |
|
||||
imageList |
|
||||
}) |
|
||||
}, |
|
||||
fail (err) { |
|
||||
console.log(err) |
|
||||
imageList.pop() |
|
||||
wx.showToast({ |
|
||||
title: '上传图片失败，请重试', |
|
||||
icon: 'none', |
|
||||
duration: 2000 |
|
||||
}) |
|
||||
that.setData({ |
|
||||
imageList |
|
||||
}) |
|
||||
} |
|
||||
}) |
|
||||
} |
|
||||
}) |
|
||||
} else if (index === 1) { |
|
||||
wx.chooseImage({ |
|
||||
count: 3 - that.data.imageList.length, |
|
||||
sizeType: ['original', 'compressed'], |
|
||||
sourceType: ['album'], |
|
||||
success (res) { |
|
||||
let imageList = [] |
|
||||
res.tempFilePaths.forEach(item => { |
|
||||
imageList.push({ |
|
||||
img: item, |
|
||||
upload: true, |
|
||||
id: that.data.imageId++, |
|
||||
ossUrl: '' |
|
||||
}) |
|
||||
}) |
|
||||
that.setData({ |
|
||||
imageList: [...that.data.imageList, ...imageList] |
|
||||
}) |
|
||||
imageList.forEach((item, index) => { |
|
||||
(function (index) { |
|
||||
wx.uploadFile({ |
|
||||
url: `${config.BASEURL()}group/topic/upload`, |
|
||||
filePath: imageList[index].img, |
|
||||
name: 'file', |
|
||||
header: { |
|
||||
'Content-Type': 'multipart/form-data' |
|
||||
}, |
|
||||
success (fileRes) { |
|
||||
const data = JSON.parse(fileRes.data) |
|
||||
if (data.code === 0 && data.msg === 'success') { |
|
||||
imageList[index].ossUrl = data.data |
|
||||
imageList[index].upload = false |
|
||||
|
|
||||
} else { |
|
||||
imageList.splice(index, 1) |
|
||||
wx.showToast({ |
|
||||
title: '上传图片失败，请重试', |
|
||||
icon: 'none', |
|
||||
duration: 2000 |
|
||||
}) |
|
||||
} |
|
||||
that.data.imageList = that.data.imageList.slice(0, that.data.imageList.length - res.tempFilePaths.length) |
|
||||
that.setData({ |
|
||||
imageList: [...that.data.imageList, ...imageList] |
|
||||
}) |
|
||||
}, |
|
||||
fail (err) { |
|
||||
console.log(err) |
|
||||
imageList.splice(index, 1) |
|
||||
wx.showToast({ |
|
||||
title: '上传图片失败，请重试', |
|
||||
icon: 'none', |
|
||||
duration: 2000 |
|
||||
}) |
|
||||
that.data.imageList = that.data.imageList.slice(0, that.data.imageList.length - res.tempFilePaths.length) |
|
||||
that.setData({ |
|
||||
imageList: [...that.data.imageList, ...imageList] |
|
||||
}) |
|
||||
} |
|
||||
}) |
|
||||
})(index) |
|
||||
}) |
|
||||
} |
|
||||
}) |
|
||||
} |
|
||||
return true |
|
||||
}, |
|
||||
cancelText: '取消', |
|
||||
cancel() {}, |
|
||||
destructiveButtonClicked() {}, |
|
||||
}) |
|
||||
}, |
|
||||
// 获取经纬度
|
|
||||
getLocation () { |
|
||||
wx.getLocation({ |
|
||||
type: 'gcj02', |
|
||||
success: (res) => { |
|
||||
console.log('经纬度', res) |
|
||||
this.reverseGeocoder(res) |
|
||||
this.setData({ |
|
||||
location: { |
|
||||
latitude: res.latitude, |
|
||||
longitude: res.longitude |
|
||||
} |
|
||||
}) |
|
||||
} |
|
||||
}) |
|
||||
}, |
|
||||
// 逆地址解析
|
|
||||
reverseGeocoder ({latitude, longitude}) { |
|
||||
this.data.qqmapsdk.reverseGeocoder({ |
|
||||
location: { |
|
||||
latitude, |
|
||||
longitude |
|
||||
}, |
|
||||
success: (res) => { |
|
||||
console.log('逆地址解析', res) |
|
||||
if (res.message === 'query ok') { |
|
||||
this.setData({ |
|
||||
addressValue: res.result.address |
|
||||
}) |
|
||||
} |
|
||||
} |
|
||||
}) |
|
||||
}, |
|
||||
throttleAddTopic () { |
|
||||
let now = new Date() |
|
||||
if (now - this.data.addTopicPrevious > 2000) { |
|
||||
this.addTopic() |
|
||||
this.data.addTopicPrevious = now |
|
||||
} |
|
||||
}, |
|
||||
// 添加话题事件
|
|
||||
addTopic () { |
|
||||
if (this.data.topicValue === '') { |
|
||||
wx.showToast({ |
|
||||
title: '请输入-话题内容', |
|
||||
icon: 'none', |
|
||||
duration: 2000 |
|
||||
}) |
|
||||
return false |
|
||||
} else if (this.data.addressValue === '') { |
|
||||
wx.showToast({ |
|
||||
title: '请输入-地址', |
|
||||
icon: 'none', |
|
||||
duration: 2000 |
|
||||
}) |
|
||||
return false |
|
||||
} |
|
||||
const imagesList = [] |
|
||||
if (this.data.imageList.length > 0) { |
|
||||
const isUploadingStatus = this.data.imageList.some(item => item.upload) |
|
||||
if (isUploadingStatus) { |
|
||||
wx.showToast({ |
|
||||
title: '请等待图片上传完成', |
|
||||
icon: 'none', |
|
||||
duration: 2000 |
|
||||
}) |
|
||||
return false |
|
||||
} |
|
||||
this.data.imageList.forEach(item => { |
|
||||
imagesList.push(item.ossUrl) |
|
||||
}) |
|
||||
} |
|
||||
// if (this.data.submitEvent) {
|
|
||||
// wx.showToast({
|
|
||||
// title: '您的话题已提交,请勿重复提交',
|
|
||||
// icon: 'none',
|
|
||||
// duration: 3000
|
|
||||
// })
|
|
||||
// return false
|
|
||||
// }
|
|
||||
// this.setData({
|
|
||||
// submitEvent: true,
|
|
||||
// })
|
|
||||
const para = { |
|
||||
topicContent: this.data.topicValue, |
|
||||
topicAddress: this.data.addressValue, |
|
||||
topicLatitude: this.data.location.latitude, |
|
||||
topicLongitude: this.data.location.longitude, |
|
||||
groupId: this.data.groupId, |
|
||||
groupName: this.data.groupName, |
|
||||
images: imagesList, |
|
||||
isConReview:this.data.isConReview |
|
||||
} |
|
||||
wx.showLoading({ |
|
||||
title: '加载中', |
|
||||
mask:true, |
|
||||
}) |
|
||||
addTopic(para).then(res => { |
|
||||
this.setData({ |
|
||||
isConReview:false |
|
||||
}) |
|
||||
var pages = getCurrentPages() |
|
||||
var prePages = pages[pages.length - 2] |
|
||||
setTimeout(() => { |
|
||||
prePages.pullRefreshGetTopicList() |
|
||||
wx.navigateBack() |
|
||||
wx.showToast({ |
|
||||
title: '话题发布成功', |
|
||||
icon: 'none', |
|
||||
duration: 2000 |
|
||||
}) |
|
||||
wx.hideLoading() |
|
||||
// this.setData({
|
|
||||
// submitEvent: false,
|
|
||||
// })
|
|
||||
}, 1000) |
|
||||
}).catch(err => { |
|
||||
let {code} =err |
|
||||
if(code==533){ |
|
||||
this.checkTitle() |
|
||||
}else{ |
|
||||
wx.showToast({ |
|
||||
title: err, |
|
||||
icon: 'none', |
|
||||
duration: 6000, |
|
||||
mask:true, |
|
||||
complete: () => { |
|
||||
setTimeout(() => { |
|
||||
wx.hideLoading() |
|
||||
}, 2000) |
|
||||
} |
|
||||
}) |
|
||||
} |
|
||||
}) |
|
||||
}, |
|
||||
// 删除图片
|
|
||||
deleteImage (e) { |
|
||||
const index = this.data.imageList.findIndex((item,index) => index === e.currentTarget.dataset.index) |
|
||||
this.data.imageList.splice(index, 1) |
|
||||
const imageList = this.data.imageList |
|
||||
this.setData({ |
|
||||
imageList |
|
||||
}) |
|
||||
}, |
|
||||
checkTitle(){ |
|
||||
let that = this |
|
||||
if(this.data.isFirstNum==0){ |
|
||||
this.setData({ |
|
||||
isFirstNum:++this.data.isFirstNum |
|
||||
}) |
|
||||
// wx.hideLoading()
|
|
||||
// wx.showToast({
|
|
||||
// title:'内容存在违规信息,请修改后重新提交！',
|
|
||||
// icon:'none',
|
|
||||
// duration: 3000,
|
|
||||
// mask:true
|
|
||||
// })
|
|
||||
}else if(this.data.isFirstNum==1){ |
|
||||
wx.hideLoading() |
|
||||
wx.showToast({ |
|
||||
title:'', |
|
||||
icon:'none', |
|
||||
duration: 100, |
|
||||
mask:true |
|
||||
}) |
|
||||
wx.showModal({ |
|
||||
title: '提示', |
|
||||
content: '您提交的内容再次被判定为违规，您确定是否要提交？', |
|
||||
success (res) { |
|
||||
if (res.confirm) { |
|
||||
that.setData({ |
|
||||
isConReview:true |
|
||||
}) |
|
||||
that.addTopic () |
|
||||
} else if (res.cancel) { |
|
||||
} |
|
||||
} |
|
||||
}) |
|
||||
} |
|
||||
}, |
|
||||
}) |
|
||||
@ -1,6 +0,0 @@ |
|||||
{ |
|
||||
"usingComponents": { |
|
||||
"wux-actionsheet": "../../../../dist/actionsheet/index" |
|
||||
}, |
|
||||
"navigationBarTitleText": "我有话说" |
|
||||
} |
|
||||
@ -1,33 +0,0 @@ |
|||||
<view class="add-topic"> |
|
||||
<view class="topic"> |
|
||||
<textarea value="{{topicValue}}" bindblur="bindTopicBlur" bindinput="bindTopicValue" bindfocus='bindTopicFocus' maxlength="500"> |
|
||||
<view wx:if="{{placeholderShow}}" class="placeholder-textarea"> |
|
||||
<view>1、发起您的话题， 请将话题描述清晰</view> |
|
||||
<view>2、在社群得到帮助、建议，能有助于更快地解决问题</view> |
|
||||
<view>3、还有机会被转发到【党群议事】让问题解决更快</view> |
|
||||
</view> |
|
||||
</textarea> |
|
||||
<view class="picture"> |
|
||||
<view class="image-box" wx:for="{{imageList}}" wx:key="index" wx:for-item="item" wx:for-index="index"> |
|
||||
<image src="{{item.img}}" /> |
|
||||
<image wx:if="{{item.upload}}" class="loading" src="../../images/loading.gif" /> |
|
||||
<image bindtap="deleteImage" data-index="{{index}}" wx:else class="delete-image" src="../../images/icon_close.png" /> |
|
||||
</view> |
|
||||
<view class="image-box"> |
|
||||
<image bindtap="chooseImage" wx:if="{{imageList.length <= 2}}" src="../../images/ig_tianjiatupian@2x.png" /> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="address"> |
|
||||
<textarea value="{{addressValue}}" bindblur="bindAddressValue" bindinput="bindAddressValue" placeholder-class="placeholder-textarea" placeholder="请输入定位地址" /> |
|
||||
<view class="tip"> |
|
||||
<image src="../../images/ic_dingwei@2x.png" /> |
|
||||
<text>话题定位</text> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="topic-button"> |
|
||||
<button bindtap="throttleAddTopic" type="default" size="defaultSize" hover-class="hover-button">发起话题</button> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
<wux-actionsheet id="wux-actionsheet" /> |
|
||||
@ -1,143 +0,0 @@ |
|||||
page { |
|
||||
width: 100%; |
|
||||
height:100%; |
|
||||
} |
|
||||
.add-topic { |
|
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
background: #f7f7f7; |
|
||||
box-sizing: border-box; |
|
||||
padding: 20rpx; |
|
||||
} |
|
||||
.add-topic .topic { |
|
||||
width: 100%; |
|
||||
height: 640rpx; |
|
||||
background: #fff; |
|
||||
border-radius: 16rpx; |
|
||||
box-sizing: border-box; |
|
||||
padding: 45rpx 20rpx 0; |
|
||||
} |
|
||||
.add-topic .topic textarea { |
|
||||
color: #333; |
|
||||
font-size: 34rpx; |
|
||||
line-height: 46rpx; |
|
||||
width: 100%; |
|
||||
height: 340rpx; |
|
||||
box-sizing: border-box; |
|
||||
padding-bottom: 20rpx; |
|
||||
position: relative; |
|
||||
} |
|
||||
.add-topic .topic textarea .placeholder-textarea { |
|
||||
font-size: 28rpx; |
|
||||
line-height: 46rpx; |
|
||||
color: #999; |
|
||||
position: absolute; |
|
||||
left: 0; |
|
||||
top: 0; |
|
||||
} |
|
||||
.add-topic .topic .picture { |
|
||||
display: flex; |
|
||||
height: 255rpx; |
|
||||
box-sizing: border-box; |
|
||||
padding: 20rpx 0; |
|
||||
} |
|
||||
.add-topic .topic .picture .image-box, .add-topic .topic .picture image { |
|
||||
width: 215rpx; |
|
||||
height: 215rpx; |
|
||||
object-fit:cover; |
|
||||
border-radius: 8rpx; |
|
||||
} |
|
||||
.add-topic .topic .picture .image-box image { |
|
||||
width: 215rpx; |
|
||||
height: 215rpx; |
|
||||
object-fit:cover; |
|
||||
} |
|
||||
.add-topic .topic .picture .image-box { |
|
||||
position: relative; |
|
||||
} |
|
||||
.add-topic .topic .picture .image-box .loading { |
|
||||
position: absolute; |
|
||||
left: 25%; |
|
||||
top: 25%; |
|
||||
width: 50%; |
|
||||
height: 50%; |
|
||||
} |
|
||||
.add-topic .topic .picture .image-box .delete-image { |
|
||||
width: 40rpx; |
|
||||
height: 40rpx; |
|
||||
position: absolute; |
|
||||
right: -20rpx; |
|
||||
top: -20rpx; |
|
||||
} |
|
||||
.add-topic .topic .picture .image-box + .image-box { |
|
||||
margin-left: 10rpx; |
|
||||
} |
|
||||
|
|
||||
.add-topic .address { |
|
||||
width: 100%; |
|
||||
height: 210rpx; |
|
||||
background: #fff; |
|
||||
border-radius: 16rpx; |
|
||||
margin-top: 20rpx; |
|
||||
box-sizing: border-box; |
|
||||
padding: 0 20rpx; |
|
||||
} |
|
||||
.add-topic .address textarea { |
|
||||
width: 100%; |
|
||||
height: 122rpx; |
|
||||
box-sizing: border-box; |
|
||||
padding-top: 35rpx; |
|
||||
font-size: 34rpx; |
|
||||
color: #333; |
|
||||
line-height: 46rpx; |
|
||||
} |
|
||||
.add-topic .address .placeholder-textarea { |
|
||||
font-size: 28rpx; |
|
||||
line-height: 46rpx; |
|
||||
color: #999; |
|
||||
} |
|
||||
.add-topic .address .tip { |
|
||||
width: 100%; |
|
||||
height: 78rpx; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
} |
|
||||
.add-topic .address .tip image { |
|
||||
width: 22rpx; |
|
||||
height: 26rpx; |
|
||||
object-fit: cover; |
|
||||
} |
|
||||
.add-topic .address .tip text { |
|
||||
font-size: 26rpx; |
|
||||
color: #999; |
|
||||
margin-left: 14rpx; |
|
||||
} |
|
||||
|
|
||||
.add-topic .topic-button { |
|
||||
width: 100%; |
|
||||
height: 85rpx; |
|
||||
display:flex; |
|
||||
justify-content: center; |
|
||||
align-items: center; |
|
||||
position: fixed; |
|
||||
bottom: 100rpx; |
|
||||
left: 0; |
|
||||
} |
|
||||
.add-topic .topic-button button { |
|
||||
width: 560rpx; |
|
||||
height: 85rpx; |
|
||||
line-height: 85rpx; |
|
||||
text-align:center; |
|
||||
color: #fff; |
|
||||
font-size: 36rpx; |
|
||||
border-radius: 16rpx; |
|
||||
background: linear-gradient(to right, #F40C0C, #FF4E4E) |
|
||||
} |
|
||||
.add-topic .topic-button .hover-button { |
|
||||
background: red; |
|
||||
} |
|
||||
|
|
||||
.wux-actionsheet__button { |
|
||||
font-size: 34rpx !important; |
|
||||
color: #333 !important; |
|
||||
} |
|
||||
Loading…
Reference in new issue