145 lines
4.5 KiB
Vue
145 lines
4.5 KiB
Vue
<template>
|
|
<view class="announce">
|
|
<u-skeleton rows="2" :loading="loading" avatar :rows="5" v-if="announcements.length>0">
|
|
<view v-for="(item,index) in announcements" :key="index" class="item" >
|
|
<view class="header">
|
|
<u-avatar :src="item.user.portraitUrl" />
|
|
<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 class="no-lists" v-else>
|
|
<u-image class="cover" radius="4" width="400rpx" height="400rpx" :src="require('@/static/imgs/no-level-list.png')" :lazy-load="true" />
|
|
<span>暂无公告内容~</span>
|
|
</view>
|
|
</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()
|
|
uni.$on('groupAnnouncementCreated', this.initData)
|
|
},
|
|
onUnload() {
|
|
uni.$off('groupAnnouncementCreated')
|
|
},
|
|
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
|
|
this.loading = false
|
|
})
|
|
},
|
|
onDelete(aId) {
|
|
uni.showModal({
|
|
title: '删除公告',
|
|
success: (res) => {
|
|
if (res.confirm) {
|
|
deleteGroupAnnouncement(this.targetId, aId).then(res => {
|
|
uni.showToast({
|
|
icon: 'none',
|
|
title: '删除成功'
|
|
})
|
|
this.initData()
|
|
})
|
|
}
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.announce {
|
|
padding: 0 $padding $padding $padding;
|
|
.no-lists {
|
|
padding-top: $padding * 5;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
box-sizing: border-box;
|
|
font-size: $title-size-m;
|
|
color: $text-gray-m;
|
|
|
|
span {
|
|
padding-top: $padding;
|
|
}
|
|
}
|
|
.item {
|
|
border-bottom: solid 1rpx #f9f9f9 !important;
|
|
padding-top: $padding;
|
|
|
|
.header {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
|
|
.user {
|
|
margin-left: $padding;
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
|
|
.name {}
|
|
|
|
.time {
|
|
font-size: 24rpx;
|
|
color: $text-gray-m;
|
|
}
|
|
}
|
|
|
|
.delete {
|
|
color: $text-price;
|
|
font-size: 28rpx;
|
|
}
|
|
}
|
|
|
|
.content {
|
|
padding: 20rpx $padding;
|
|
font-size: $title-size;
|
|
color: $text-gray;
|
|
max-width: 100%;
|
|
}
|
|
}
|
|
}
|
|
</style>
|