ZhaoTongYao
5 years ago
17 changed files with 1889 additions and 79 deletions
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 3.5 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 3.8 KiB |
@ -0,0 +1,308 @@ |
|||
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: '' |
|||
}, |
|||
partyGroupId: '', |
|||
topicType:'',//0:事好儿鼓个掌 1:话对捧个场
|
|||
addTopicPrevious: 0 |
|||
}, |
|||
onShow () { |
|||
|
|||
}, |
|||
onLoad (options) { |
|||
const qqmapsdk = new QQMapWX({ |
|||
key: 'CMJBZ-4DECI-JXGGN-5B4WU-QLV2H-B5BEJ' |
|||
}) |
|||
this.setData({ |
|||
qqmapsdk, |
|||
partyGroupId: options.partyGroupId, |
|||
topicType: options.topicType, |
|||
}) |
|||
if(options.topicType == 0){ |
|||
wx.setNavigationBarTitle({ |
|||
title: '事好儿鼓个掌' |
|||
}) |
|||
}else{ |
|||
wx.setNavigationBarTitle({ |
|||
title: '话对捧个场' |
|||
}) |
|||
} |
|||
this.getLocation() |
|||
}, |
|||
// 话题内容框 值双向绑定
|
|||
bindTopicValue (e) { |
|||
this.setData({ |
|||
topicValue: e.detail.value |
|||
}) |
|||
console.log(this.data.topicValue) |
|||
}, |
|||
// 地址框 值双向绑定
|
|||
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) |
|||
}) |
|||
} |
|||
const para = { |
|||
topicType:this.data.topicType,//话题类型：0:事好儿鼓个掌 1:话对捧个场
|
|||
topicContent: this.data.topicValue,//话题内容
|
|||
topicAddress: this.data.addressValue,//话题地址
|
|||
topicLatitude: this.data.location.latitude,//话题位置纬度
|
|||
topicLongitude: this.data.location.longitude,//话题位置经度
|
|||
partyGroupId:this.data.partyGroupId,//党群ID
|
|||
images: imagesList |
|||
} |
|||
wx.showLoading({ |
|||
title: '加载中', |
|||
}) |
|||
addTopic(para).then(res => { |
|||
wx.hideLoading() |
|||
console.log(res) |
|||
wx.showToast({ |
|||
title: '发布成功', |
|||
icon: 'none', |
|||
duration: 2000 |
|||
}) |
|||
var pages = getCurrentPages() |
|||
// var prePages = pages[pages.length - 2]
|
|||
setTimeout(() => { |
|||
// prePages.pullRefreshGetTopicList()
|
|||
wx.navigateBack() |
|||
}, 1000) |
|||
}).catch(err => { |
|||
console.log(err) |
|||
}) |
|||
}, |
|||
// 删除图片
|
|||
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 |
|||
}) |
|||
} |
|||
}) |
|||
@ -0,0 +1,6 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"wux-actionsheet": "../../../../dist/actionsheet/index" |
|||
}, |
|||
"navigationBarTitleText": "" |
|||
} |
|||
@ -0,0 +1,31 @@ |
|||
<view class="add-topic"> |
|||
<view class="topic"> |
|||
<textarea value="{{topicValue}}" bindinput="bindTopicValue" maxlength="500"> |
|||
<view wx:if="{{topicValue.length == 0}}" class="placeholder-textarea"> |
|||
<view>请将事描述清晰</view> |
|||
</view> |
|||
</textarea> |
|||
<view wx:if="{{topicType == '0'}}" class="picture"> |
|||
<view class="image-box" wx:for="{{imageList}}" wx:key="{{item}}" 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}}" 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="addTopic" type="default" size="defaultSize" hover-class="hover-button">发起话题</button> |
|||
</view> |
|||
</view> |
|||
|
|||
<wux-actionsheet id="wux-actionsheet" /> |
|||
@ -0,0 +1,143 @@ |
|||
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; |
|||
} |
|||
@ -1,4 +1,7 @@ |
|||
{ |
|||
"usingComponents": {}, |
|||
"navigationBarTitleText": "事好鼓个掌" |
|||
"usingComponents": { |
|||
"load-more": "../../../../components/loadMore/loadMore", |
|||
"no-data":"../../../../components/nodata/nodata" |
|||
}, |
|||
"navigationBarTitleText": "" |
|||
} |
|||
@ -1,50 +1,52 @@ |
|||
<view class="item-list"> |
|||
<view class="item-list" wx:for-index="index" wx:for-item="item" wx:key="index" wx:for="{{topiclist}}"> |
|||
<view class="user-info"> |
|||
<image src="https://epdc-shibei.elinkservice.cn/epdcFile/M00/00/00/CgUipV3wgl6Afm4cAAAa8QfEb00266_big.png"></image> |
|||
<image src="{{item.userFace}}"></image> |
|||
<view class="name-date"> |
|||
<view class="name">南宁路152号-梁先生</view> |
|||
<view class="date">2019-08-26 12:56:02</view> |
|||
<view class="name">{{item.nickname}}</view> |
|||
<view class="date">{{item.createdTime}}</view> |
|||
</view> |
|||
</view> |
|||
<view class="details-info">庆祝建党97周年“党徽照耀新时代”庆祝建党97周年“党徽照耀新时代”庆祝建党97周年“党徽照耀新时代”庆祝建党97周年“党徽照耀新时代”庆祝建党97周年“党徽照耀新时代”</view> |
|||
<view class="details-info">{{item.topicContent}}</view> |
|||
|
|||
<view wx:if="{{images.length > 0}}" class="image-list" style="height: {{images.length === 3 ? '160rpx' : images.length === 2 ? '205rpx' : images.length === 1 ? '350rpx' : '' }}"> |
|||
<image mode="aspectFill" catchtap="previewImage" data-src="{{item}}" class="image-item" wx:for="{{images}}" wx:key="{{index}}" wx:for-index="index" wx:for-item="item" src="{{item}}" /> |
|||
<view wx:if="{{item.images.length > 0 && topicType == '0'}}" class="image-list" |
|||
style="height: {{item.images.length === 3 ? '160rpx' : item.images.length === 2 ? '205rpx' : item.images.length === 1 ? '350rpx' : '' }}"> |
|||
<image mode="aspectFill" catchtap="previewImage" data-src="{{_item}}" data-imgArry="{{item.images}}" class="image-item" |
|||
wx:for="{{item.images}}" wx:key="{{index}}" wx:for-index="index" wx:for-item="_item" src="{{_item}}" /> |
|||
</view> |
|||
<view class="attitude"> |
|||
<view class="all"> |
|||
<image src="../../images/give.png"></image> |
|||
<view class="give-data">22222</view> |
|||
<view class="all" data-id="{{item.id}}" bindtap="clicklike" data-likeFlag="{{item.likeFlag}}"> |
|||
<!-- 用户是否已点赞 0否；1是 --> |
|||
<image wx:if="{{item.likeFlag == '0'}}" src="../../images/give.png"></image> |
|||
<image wx:else src="../../images/give_2.png"></image> |
|||
<view class="give-data {{item.likeFlag == '1' ? 'color' : ''}}">{{item.supportNum}}</view> |
|||
</view> |
|||
<view class="all"> |
|||
<image src="../../images/comment.png"></image> |
|||
<view class="give-data">22222</view> |
|||
<view class="give-data">{{item.commentNum}}</view> |
|||
</view> |
|||
<view class="all"> |
|||
<view class="all" data-id="{{item.id}}" bindtap="clickTextarea"> |
|||
<image src="../../images/ic_huifu@2x.png"></image> |
|||
<view class="give-data">评论</view> |
|||
</view> |
|||
</view> |
|||
<view class="comment"> |
|||
<view class="comment-list"><text>张测试：</text>我们这个楼的小区门口也是这中事情我们这个楼的小区门口也是这中事情···我们这个楼的小区门口也是这中事情···</view> |
|||
<view class="comment-list"><text>张测试：</text>我们这个楼的小区门口也是这中事情我们这个楼的小区门口也是这中事情···我们这个楼的小区门口也是这中事情···</view> |
|||
<view wx:if="{{item.comments.length > 0}}" class="comment"> |
|||
<view wx:for="{{item.comments}}" wx:key="{{index}}" wx:for-index="index" wx:for-item="item_" |
|||
class="comment-list"><text>{{item_.username}}：</text>{{item_.content}}</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="addIssue" bindtap="addIssue"> |
|||
<view class="release" wx:if="{{ifcomment}}"> |
|||
<view class="replyinfo2"> |
|||
<textarea placeholder-class="input_null" fixed="true" maxlength="-1" show-confirm-bar="false" |
|||
cursor-spacing="15" auto-height="true" placeholder="请输入回复" value="{{commentContent}}" focus='{{focus}}' bindblur="bindAddressInput" bindinput="bindIdentity"></textarea> |
|||
<button bindtap="commentSubmit" form-type="submit" class="submit">发送</button> |
|||
</view> |
|||
</view> |
|||
<!--加载更多提示--> |
|||
<load-more loadMoreType="{{loadMoreType}}" loadMoreVisible="{{loadMoreVisible}}"></load-more> |
|||
<no-data isShow="{{nodata}}"></no-data> |
|||
<!-- 是否禁言 0：否 1：是 --> |
|||
<view wx:if="{{bannedFlag == '0'}}" class="addIssue" bindtap="navigateToAddTopic"> |
|||
<image wx:if="{{topicType == '0'}}" src="../../images/story.png" /> |
|||
<image wx:else src="../../images/speack.png" /> |
|||
</view> |
|||
|
|||
<form bindsubmit="submitForm" report-submit="true"> |
|||
<view class="release"> |
|||
<view wx:if="{{reply}}" class="replyinfo1"> |
|||
回复<text class="text">{{replyUserName}}</text> |
|||
<button class="cancel" bindtap="cancleReply">取消回复</button> |
|||
</view> |
|||
<view class="replyinfo2"> |
|||
<textarea placeholder-class="input_null" fixed="true" maxlength="-1" show-confirm-bar="false" cursor-spacing="15" auto-height="true" placeholder="请输入回复" name="comment"></textarea> |
|||
<button form-type="submit" class="submit">发送</button> |
|||
</view> |
|||
</view> |
|||
</form> |
|||
File diff suppressed because it is too large
Loading…
Reference in new issue