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