NVUE页面调试经常报错,不知道为什么

This commit is contained in:
2022-02-11 14:43:22 +08:00
parent 8aebe0eef5
commit efcfa00545
12 changed files with 315 additions and 145 deletions

View File

@@ -118,7 +118,25 @@ const getGroupAnnouncements = (groupId) => {
return request({
url: 'im/groups/' + groupId + '/announcements'
})
}
}
const createGroupAnnouncement = (groupId, content) => {
return request({
method: 'POST',
url: 'im/groups/' + groupId + '/announcements',
data: {
content: content
}
})
}
const deleteGroupAnnouncement = (groupId, announcementId) => {
return request({
method: 'DELETE',
url: 'im/groups/' + groupId + '/announcements/' + announcementId
})
}
/**
* 创建群聊
*/
@@ -178,7 +196,9 @@ export {
updateGroup,
getGroupInfo,
getGroupUsers,
getGroupAnnouncements,
getGroupAnnouncements,
createGroupAnnouncement,
deleteGroupAnnouncement,
searchGroup,
joinGroup,
quitGroup

View File

@@ -482,27 +482,45 @@
"style": {
"navigationBarTitleText": "群信息"
}
},
{
"path": "pages/im/group/create",
"name": "imGroupCreate",
"style": {
"navigationBarTitleText": "创建群聊"
}
},
{
"path": "pages/im/group/users",
"name": "imGroupUsers",
"style": {
"navigationBarTitleText": "群成员"
}
},
{
"path": "pages/im/group/announcement",
"name": "imGroupAnnouncement",
"style": {
"navigationBarTitleText": "群公告"
}
},
{
"path": "pages/im/group/create",
"name": "imGroupCreate",
"style": {
"navigationBarTitleText": "创建群聊"
}
},
{
"path": "pages/im/group/users",
"name": "imGroupUsers",
"style": {
"navigationBarTitleText": "群成员"
}
},
{
"path": "pages/im/group/announcement",
"name": "imGroupAnnouncement",
"style": {
"navigationBarTitleText": "群公告",
"app-plus": {
"titleNView": {
"type": "default",
"buttons": [{
"float": "right",
"fontSrc": "/static/iconfont.ttf",
"text": "\ue60a",
"fontSize": "20px"
}]
}
}
}
},
{
"path": "pages/im/group/announceCreate",
"name": "imGroupAnnouncementCreate",
"style": {
"navigationBarTitleText": "发布群公告"
}
},
{
"path": "pages/wallet/add",

View File

@@ -0,0 +1,54 @@
<template>
<view class="create">
<u--textarea v-model="content" count height="200" maxlength="200" placeholder="请输入公告内容"></u--textarea>
<u-button type="primary" text="发布" @click="onCreate"></u-button>
</view>
</template>
<script>
import {
createGroupAnnouncement
} from '@/apis/interfaces/im.js'
export default {
data() {
return {
targetId: '',
content: ''
}
},
onLoad(e) {
this.targetId = e.targetId
},
methods: {
onCreate() {
createGroupAnnouncement(this.targetId, this.content).then(res => {
uni.showToast({
title: '发布成功',
success: () => {
setTimeout(() => {
uni.navigateBack()
}, 1000)
}
})
}).catch(err => {
uni.showToast({
icon: 'none',
title: err.message
})
})
}
}
}
</script>
<style lang="scss" scoped>
.create {
padding: $padding;
.u-button {
margin-top: $padding;
}
}
</style>

View File

@@ -1,32 +0,0 @@
<template>
<view>
<view v-for="(item,index) in announcements" :key="index">
{{ item.content }}
</view>
</view>
</template>
<script>
import {
getGroupAnnouncements
} from '@/apis/interfaces/im.js'
export default {
data() {
return {
targetId: '',
announcements: []
}
},
onLoad(e) {
this.targetId = e.targetId
getGroupAnnouncements(this.targetId).then(res => {
this.announcements = res
})
}
}
</script>
<style>
</style>

View File

@@ -0,0 +1,105 @@
<template>
<view class="announce">
<u-skeleton rows="2" :loading="loading" avatar :rows="5">
<view v-for="(item,index) in announcements" :key="index">
<view class="header">
<u-avatar :src="item.user.portraitUrl"></u-avatar>
<view class="user">
<view class="name">{{ item.user.name }}</view>
<view class="time">{{ item.created_at }}</view>
</view>
<view class="delete" v-if="isAdmin" @click="onDelete(item.announcement_id)">删除</view>
</view>
<view class="content">{{ item.content }}</view>
</view>
</u-skeleton>
</view>
</template>
<script>
import {
getGroupInfo,
getGroupAnnouncements,
deleteGroupAnnouncement
} from '@/apis/interfaces/im.js'
export default {
data() {
return {
targetId: '',
announcements: [],
loading: true,
isAdmin: false
}
},
onLoad(e) {
this.targetId = e.targetId
getGroupInfo(this.targetId).then(res => {
this.isAdmin = res.group.is_admin
})
this.initData()
},
onNavigationBarButtonTap() {
if (this.isAdmin) {
uni.navigateTo({
url: '/pages/im/group/announceCreate?targetId=' + this.targetId
})
} else {
uni.showToast({
icon: 'none',
title: '没有权限'
})
}
},
methods: {
initData() {
getGroupAnnouncements(this.targetId).then(res => {
this.announcements = res
console.log(res);
this.loading = false
})
},
onDelete(aId) {
deleteGroupAnnouncement(this.targetId, aId).then(res => {
this.initData()
})
}
}
}
</script>
<style lang="scss" scoped>
.announce {
padding: $padding;
.header {
display: flex;
flex-direction: row;
.user {
margin-left: $padding;
flex: 1;
.name {
line-height: 44rpx;
}
.time {
margin-top: 15rpx;
font-size: 24rpx;
color: $text-gray-m;
}
}
.delete {
color: $text-price;
font-size: 32rpx;
}
}
.content {
padding: $padding;
font-size: 34rpx;
}
}
</style>

View File

@@ -38,7 +38,7 @@
showVoice,
showImage,
showText,
sentMessageBar,
sentMessageBar
},
data() {
return {

View File

@@ -5,10 +5,11 @@
<view class="user" v-for="(item, index) in members" :key="index" @click="toUser(item)">
<u-avatar size="44" shape="square" :src="item.portraitUrl"></u-avatar>
<text class="name">{{ item.name }}</text>
</view>
<view class="user">
<u-avatar @click="inviteUser" size="44" shape="square" icon="plus" bg-color="#eeeeee" color="#999999"></u-avatar>
<text class="name">邀请用户</text>
</view>
<view class="user">
<u-avatar @click="inviteUser" size="44" shape="square" icon="plus" bg-color="#eeeeee"
color="#999999"></u-avatar>
<text class="name">邀请用户</text>
</view>
</view>
@@ -18,21 +19,25 @@
</view>
<u-cell-group>
<u-cell isLink title="群聊名称" :value="group.name"></u-cell>
<u-cell isLink title="群公告" :label="announcement"></u-cell>
<u-cell isLink title="群公告" :label="announcement" @click="toAnnouncement"></u-cell>
<u-cell isLink title="聊天置顶"></u-cell>
<u-cell isLink title="免打扰"></u-cell>
</u-cell-group>
<u-cell-group v-if="group.is_owner">
<u-cell isLink title="修改群聊名称" :value="group.name"></u-cell>
<u-cell isLink title="修改群头像"></u-cell>
</u-cell-group>
<view class="actions u-border-top">
<view class="u-border-bottom">
<view class="action u-border-bottom" @click="onClean">
<text>清空聊天记录</text>
</view>
<view class="u-border-bottom">
<text>删除并退出</text>
</view>
<view class="u-border-bottom" v-if="group.is_owner">
<view class="action u-border-bottom" v-if="group.is_owner" @click="onDismiss">
<text>解散群聊</text>
</view>
<view class="action u-border-bottom" v-else @click="onQuite">
<text>删除并退出</text>
</view>
</view>
</view>
@@ -65,26 +70,35 @@
uni.navigateTo({
url: '/pages/im/friends/info?targetId=' + item.targetId
})
},
inviteUser() {
},
loadMore() {
uni.navigateTo({
url: '/pages/im/group/users?targetId=' + this.targetId
})
},
toAnnouncement() {
uni.navigateTo({
url: '/pages/im/group/announcement?targetId=' + this.targetId
})
},
inviteUser() {
onClean() {
},
loadMore() {
uni.navigateTo({
url: '/pages/im/group/users?targetId=' + this.targetId
})
onDismiss() {
},
toAnnouncement() {
uni.navigateTo({
url: '/pages/im/group/announcement?targetId=' + this.targetId
})
onQuite() {
}
}
}
</script>
<style lang="scss" scoped>
.members {
.members {
background-color: white;
padding-bottom: 40rpx;
@@ -116,9 +130,14 @@
color: $text-gray-m;
text-align: center;
}
}
.actions {
margin-top: $padding;
}
.actions {
margin-top: $padding;
.action {
color: $text-price;
justify-content: center;
}
}
</style>

View File

@@ -10,7 +10,8 @@
</template>
<script>
import {
import {
getGroupInfo,
getGroupUsers
} from '@/apis/interfaces/im.js'
@@ -22,7 +23,10 @@
}
},
onLoad(e) {
this.targetId = e.targetId
this.targetId = e.targetId
getGroupInfo(this.targetId).then(res => {
})
getGroupUsers(this.targetId).then(res => {
this.members = res
})

View File

@@ -3,35 +3,17 @@ import {
createRouter
} from 'uni-simple-router';
import store from '@/store/index'
// CALL 页面必须是nvue但是NVUE 不支持webpack的 ROUTES 注入
// CALL 页面必须是nvue但是NVUE 不支持webpack的 ROUTES 注入
// https://github.com/SilurianYang/uni-read-pages/issues/20
// #ifdef APP-NVUE
// #ifdef APP-NVUE
const ROUTES = [{
'path': '/pages/im/private/call',
'name': 'imPrivateCall'
},{
'path': '/pages/im/private/chat',
'name': 'imPrivateChat'
},{
'path': '/pages/im/group/chat',
'name': 'imGroupChat'
},{
'path': '/pages/im/group/info',
'name': 'imGroupInfo'
},{
'path': '/pages/im/group/index',
'name': 'imGroups'
},{
'path': '/pages/im/group/create',
'name': 'imGroupCreate'
},{
'path': '/pages/im/group/users',
'name': 'imGroupUsers'
},{
'path': '/pages/im/group/announcement',
'name': 'imGroupAnnouncement'
}]
"path": "/pages/im/private/call"
}, {
"path": "/pages/im/private/chat"
}, {
"path": "/pages/im/group/chat"
}];
// #endif
const router = createRouter({

View File

@@ -11,7 +11,7 @@ import {
const initIm = (KEY) => {
RongIMLib.init(KEY)
CallLib.init()
// CallLib.init()
addListeners()
// 初始化的时候 自动链接
if (store.getters.getToken !== '') {
@@ -163,40 +163,40 @@ const addListeners = () => {
// 音视频通话相关的
// 监听通话呼入
CallLib.onCallReceived(({
data
}) => {
uni.navigateTo({
url: '/pages/im/private/call?targetId=' + data.targetId + '&mediaType=' +
data.mediaType
})
})
// 通话建立成功
CallLib.onCallConnected(() => {
uni.$emit('onCallConnected')
})
// 外呼
CallLib.onCallOutgoing((res) => {
uni.$emit('onCallOutgoing')
})
// 远端响铃
CallLib.onRemoteUserRinging((res) => {
uni.$emit('onRemoteUserRinging')
})
// 远端加入
CallLib.onRemoteUserJoined((res) => {
uni.$emit('onRemoteUserJoined')
})
// 断开链接
CallLib.onCallDisconnected((res) => {
console.log('断开链接', res)
uni.$emit('onCallDisconnected')
})
// 远端挂断
CallLib.onRemoteUserLeft((res) => {
console.log('远端离开', res)
uni.$emit('onRemoteUserLeft')
})
// CallLib.onCallReceived(({
// data
// }) => {
// uni.navigateTo({
// url: '/pages/im/private/call?targetId=' + data.targetId + '&mediaType=' +
// data.mediaType
// })
// })
// // 通话建立成功
// CallLib.onCallConnected(() => {
// uni.$emit('onCallConnected')
// })
// // 外呼
// CallLib.onCallOutgoing((res) => {
// uni.$emit('onCallOutgoing')
// })
// // 远端响铃
// CallLib.onRemoteUserRinging((res) => {
// uni.$emit('onRemoteUserRinging')
// })
// // 远端加入
// CallLib.onRemoteUserJoined((res) => {
// uni.$emit('onRemoteUserJoined')
// })
// // 断开链接
// CallLib.onCallDisconnected((res) => {
// console.log('断开链接', res)
// uni.$emit('onCallDisconnected')
// })
// // 远端挂断
// CallLib.onRemoteUserLeft((res) => {
// console.log('远端离开', res)
// uni.$emit('onRemoteUserLeft')
// })
}
// 维护消息列表,检查是否需要通知声音,设置新消息提醒的数量