|
@@ -11,15 +11,28 @@
|
|
|
<van-row>
|
|
|
<van-col
|
|
|
style="width: 54px"
|
|
|
- v-for="(item, index) in 14"
|
|
|
+ v-for="(item, index) in setData?.memberList"
|
|
|
:key="index"
|
|
|
span="4"
|
|
|
class="mb-12 mr-10"
|
|
|
>
|
|
|
<div class="w-40 h-40 rounded-full border mx-auto overflow-hidden mb-4">
|
|
|
- <img class="w-full h-full object-cover" src="" alt="" />
|
|
|
+ <img
|
|
|
+ v-if="item.headImageUrl"
|
|
|
+ class="w-full h-full object-cover"
|
|
|
+ :src="item.headImageUrl"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ <img
|
|
|
+ v-else
|
|
|
+ class="w-full h-full object-cover"
|
|
|
+ src="~/assets/img/default_avatar.png"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
</div>
|
|
|
- <p class="w-full line-clamp-1 lin text-sm text-center text-black-6">陈真82222222</p>
|
|
|
+ <p class="w-full line-clamp-1 lin text-sm text-center text-black-6">
|
|
|
+ {{ item.groupNickname ? item.groupNickname : userInfo.showName }}
|
|
|
+ </p>
|
|
|
</van-col>
|
|
|
<van-col span="4" class="mb-12 mr-10" @click="navigateTo('/chat/group-add')">
|
|
|
<div
|
|
@@ -29,7 +42,7 @@
|
|
|
</div>
|
|
|
<p class="w-full line-clamp-1 lin text-sm text-center text-black-6">添加成员</p>
|
|
|
</van-col>
|
|
|
- <van-col v-if="isRankAndFiler(setData?.groupRole)" span="4 mb-12 mr-10">
|
|
|
+ <van-col v-if="isRankAndFiler(userGroupData?.groupRemark)" span="4 mb-12 mr-10">
|
|
|
<div
|
|
|
class="w-40 h-40 rounded-full flex justify-center items-center bg-[#F3F3F3] border mx-auto overflow-hidden mb-4"
|
|
|
>
|
|
@@ -56,9 +69,10 @@
|
|
|
size="large"
|
|
|
@click="
|
|
|
openDialog({
|
|
|
- // title: setData?.groupNickname ? '修改群名称' : '添加群名称',
|
|
|
+ // title: setData?.groupName ? '修改群名称' : '添加群名称',
|
|
|
title: '修改群名称',
|
|
|
- value: setData?.groupNickname,
|
|
|
+ value: setData?.groupName,
|
|
|
+ isRemark: 0,
|
|
|
placeholder: '未命名',
|
|
|
subTitle: '最多不能超过12个字'
|
|
|
})
|
|
@@ -69,7 +83,7 @@
|
|
|
>
|
|
|
<template #value>
|
|
|
<p class="w-full line-clamp-2 text-xl text-black/[0.4] leading-5xl">
|
|
|
- {{ setData?.groupNickname ? setData?.groupNickname : '未命名' }}
|
|
|
+ {{ setData?.groupName ? setData?.groupName : '未命名' }}
|
|
|
</p>
|
|
|
</template>
|
|
|
</van-cell>
|
|
@@ -78,7 +92,7 @@
|
|
|
navigateTo({
|
|
|
path: '/chat/qr-code',
|
|
|
query: {
|
|
|
- groupNickname: setData.groupNickname,
|
|
|
+ groupName: setData.groupName,
|
|
|
groupAvatar: setData.groupAvatar,
|
|
|
groupId: setData?.groupId
|
|
|
}
|
|
@@ -97,7 +111,7 @@
|
|
|
</van-cell>
|
|
|
|
|
|
<van-cell
|
|
|
- :clickable="isRankAndFiler(setData?.groupRole)"
|
|
|
+ :clickable="isRankAndFiler(userGroupData?.groupRemark)"
|
|
|
@click="handleAnnouncement"
|
|
|
size="large"
|
|
|
center
|
|
@@ -108,24 +122,36 @@
|
|
|
|
|
|
<van-cell size="large" center>
|
|
|
<template #title>
|
|
|
- <p class="w-full line-clamp-1">
|
|
|
- 群介绍:{{ '我们是一个设计讨论群,欢家多黄金时代...' }}
|
|
|
- </p>
|
|
|
+ <p class="w-full line-clamp-1">群介绍:{{ setData?.description }}</p>
|
|
|
</template>
|
|
|
</van-cell>
|
|
|
- <van-cell size="large" is-link center title="群聊类型">
|
|
|
+ <van-cell size="large" center title="群聊类型">
|
|
|
<template #value>
|
|
|
- <p class="w-full line-clamp-1">{{ setData?.typeName }}</p>
|
|
|
+ <p class="w-full line-clamp-1">{{ setData?.belongTypeIdDictMap?.name }}</p>
|
|
|
</template>
|
|
|
</van-cell>
|
|
|
<van-cell
|
|
|
@click="
|
|
|
- openDialog({
|
|
|
- title: '群备注',
|
|
|
- value: setData?.groupRemark,
|
|
|
- placeholder: '备注',
|
|
|
- subTitle: '群备注仅自己可见'
|
|
|
- })
|
|
|
+ changeState(userGroupData?.groupRole)
|
|
|
+ ? openDialog({
|
|
|
+ title: '群备注',
|
|
|
+ value: userGroupData?.remark,
|
|
|
+ isRemark: 1,
|
|
|
+ placeholder: '备注',
|
|
|
+ subTitle: '群备注仅自己可见'
|
|
|
+ })
|
|
|
+ : showDialog({
|
|
|
+ title: '群名称',
|
|
|
+ message: setData.groupName,
|
|
|
+ confirmButtonColor: '#FF9300',
|
|
|
+ showCancelButton: false
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ // on close
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ // on cancel
|
|
|
+ })
|
|
|
"
|
|
|
size="large"
|
|
|
is-link
|
|
@@ -134,13 +160,17 @@
|
|
|
>
|
|
|
<template #value>
|
|
|
<p class="w-full line-clamp-1">
|
|
|
- {{ setData?.groupRemark ? setData?.groupRemark : '未设置' }}
|
|
|
+ {{ userGroupData?.remark ? userGroupData?.remark : '未设置' }}
|
|
|
</p>
|
|
|
</template>
|
|
|
</van-cell>
|
|
|
</van-cell-group>
|
|
|
|
|
|
- <van-cell-group v-if="isRankAndFiler(setData?.groupRole)" style="margin-bottom: 12px" inset>
|
|
|
+ <van-cell-group
|
|
|
+ v-if="isRankAndFiler(userGroupData?.groupRemark)"
|
|
|
+ style="margin-bottom: 12px"
|
|
|
+ inset
|
|
|
+ >
|
|
|
<van-cell size="large" center title="个人主页展示">
|
|
|
<template #label>
|
|
|
<!-- class="text-base text-black/[0.4]" -->
|
|
@@ -183,8 +213,9 @@
|
|
|
@click="
|
|
|
openDialog({
|
|
|
title: '我在群里的昵称',
|
|
|
- value: setData?.myGroupNickname ? setData?.myGroupNickname : setData?.Nickname,
|
|
|
+ value: userGroupData?.groupNickname,
|
|
|
placeholder: '昵称',
|
|
|
+ isRemark: 2,
|
|
|
subTitle: '昵称修改之后,只会在此群内显示,群内成员都可以看见'
|
|
|
})
|
|
|
"
|
|
@@ -195,7 +226,7 @@
|
|
|
>
|
|
|
<template #value>
|
|
|
<p class="w-full line-clamp-1">
|
|
|
- {{ setData?.myGroupNickname ? setData?.myGroupNickname : setData?.Nickname }}
|
|
|
+ {{ userGroupData?.groupNickname }}
|
|
|
</p>
|
|
|
</template>
|
|
|
</van-cell>
|
|
@@ -220,7 +251,16 @@
|
|
|
<van-cell-group style="margin-bottom: 12px" inset>
|
|
|
<van-cell size="large" is-link center title="消息免打扰">
|
|
|
<template #right-icon>
|
|
|
- <van-switch v-model="isNotDisturb" active-color="#FF9300" inactive-color="#dcdee0" />
|
|
|
+ <van-switch
|
|
|
+ v-model="isNotDisturb"
|
|
|
+ @change="
|
|
|
+ (val) => {
|
|
|
+ isNotDisturb = val
|
|
|
+ }
|
|
|
+ "
|
|
|
+ active-color="#FF9300"
|
|
|
+ inactive-color="#dcdee0"
|
|
|
+ />
|
|
|
</template>
|
|
|
</van-cell>
|
|
|
<van-cell size="large" is-link center title="置顶聊天">
|
|
@@ -228,6 +268,7 @@
|
|
|
<van-switch v-model="isTop" active-color="#FF9300" inactive-color="#dcdee0" />
|
|
|
</template>
|
|
|
</van-cell>
|
|
|
+ <van-cell size="large" is-link center title="设置当前聊天背景"></van-cell>
|
|
|
</van-cell-group>
|
|
|
|
|
|
<van-cell-group style="margin-bottom: 12px" inset>
|
|
@@ -274,7 +315,7 @@
|
|
|
style="height: 40px; background: #f5f5f5; border-radius: 8px; margin-bottom: 30px"
|
|
|
clearable
|
|
|
:placeholder="dialogPlaceholder"
|
|
|
- v-model="groupNickname"
|
|
|
+ v-model="groupName"
|
|
|
maxlength="12"
|
|
|
/>
|
|
|
</div>
|
|
@@ -284,13 +325,10 @@
|
|
|
<script setup>
|
|
|
const route = useRoute()
|
|
|
const router = useRouter()
|
|
|
-console.log(route.query, '12312')
|
|
|
|
|
|
const userInfoStore = useUserInfoStore()
|
|
|
const { userInfo } = storeToRefs(userInfoStore)
|
|
|
|
|
|
-// console.log(userInfo.value, 'userInfo')
|
|
|
-
|
|
|
definePageMeta({
|
|
|
layout: false
|
|
|
})
|
|
@@ -300,17 +338,25 @@ useSeoMeta({
|
|
|
})
|
|
|
|
|
|
onMounted(() => {
|
|
|
+ // userInfoStore.getUserInfo()
|
|
|
getGroupSetData()
|
|
|
})
|
|
|
|
|
|
let setData = reactive({
|
|
|
groupId: computed(() => route.query.groupId ?? ''),
|
|
|
- userId: computed(() => route.query.userId ?? ''),
|
|
|
- groupRole: 1,
|
|
|
- groupAnnouncement:
|
|
|
- '群公告模版 1.本群提倡友好理性交流,鼓励群友多发言,多互动 2.禁止无意义刷屏、发送广告信息以及谩骂等不良消息 3.为了保证群活跃不经常发言的群友,可能会被定时清理出群'
|
|
|
+ userId: computed(() => route.query.userId ?? '')
|
|
|
+ // groupRole: 1,
|
|
|
+ // groupAnnouncement:
|
|
|
+ // '群公告模版 1.本群提倡友好理性交流,鼓励群友多发言,多互动 2.禁止无意义刷屏、发送广告信息以及谩骂等不良消息 3.为了保证群活跃不经常发言的群友,可能会被定时清理出群'
|
|
|
})
|
|
|
-const groupNickname = ref('')
|
|
|
+
|
|
|
+watch([() => route.query.groupId, () => route.query.userId], () => {}, {
|
|
|
+ immediate: true
|
|
|
+})
|
|
|
+
|
|
|
+const userGroupData = ref(null)
|
|
|
+
|
|
|
+const groupName = ref('')
|
|
|
|
|
|
// 是否显示到个人主页
|
|
|
const showHomePage = ref(false)
|
|
@@ -319,6 +365,7 @@ const isTop = ref(false)
|
|
|
|
|
|
// 弹出窗
|
|
|
const showDialog = ref(false)
|
|
|
+const isRemark = ref(0) //0 群名称 1备注 2 我在群里的昵称
|
|
|
const dialogTitle = ref('')
|
|
|
const dialogPlaceholder = ref('')
|
|
|
const dialogSubTitle = ref('')
|
|
@@ -327,14 +374,56 @@ const dialogSubTitle = ref('')
|
|
|
const openDialog = (item) => {
|
|
|
showDialog.value = true
|
|
|
dialogTitle.value = item?.title
|
|
|
- groupNickname.value = item?.value
|
|
|
+ isRemark.value = item.isRemark
|
|
|
+ groupName.value = item?.value
|
|
|
dialogPlaceholder.value = item?.placeholder
|
|
|
dialogSubTitle.value = item?.subTitle
|
|
|
}
|
|
|
// 弹窗确认的事件
|
|
|
const confirm = () => {
|
|
|
- setData.groupNickname = groupNickname.value
|
|
|
- showDialog.value = false
|
|
|
+ if (userGroupData.value?.groupRole == 1 && isRemark.value == 0) {
|
|
|
+ changeGroupName()
|
|
|
+ } else {
|
|
|
+ }
|
|
|
+
|
|
|
+ if (isRemark.value == 1) changeTourMember({ groupId: setData.id, remark: groupName.value })
|
|
|
+
|
|
|
+ if (isRemark.value == 2)
|
|
|
+ changeGroupName({
|
|
|
+ groupId: setData.id,
|
|
|
+ groupNickname: groupName.value
|
|
|
+ })
|
|
|
+
|
|
|
+ // showDialog.value = false
|
|
|
+}
|
|
|
+
|
|
|
+// 修改群名称
|
|
|
+const changeGroupName = async () => {
|
|
|
+ try {
|
|
|
+ const { data } = await request('/website/tourGroup/updateGroup', {
|
|
|
+ method: 'post',
|
|
|
+ body: {
|
|
|
+ groupId: setData.id,
|
|
|
+ groupName: groupName.value
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ if (data) {
|
|
|
+ showSuccessToast('修改成功')
|
|
|
+ } else {
|
|
|
+ showFailToast('修改失败')
|
|
|
+ }
|
|
|
+ } catch (error) {}
|
|
|
+}
|
|
|
+
|
|
|
+// 修改备注名 和修改自己在群里的备注
|
|
|
+const changeTourMember = async (body) => {
|
|
|
+ try {
|
|
|
+ const { data } = await request('/website/tourMember/updateTourMember', {
|
|
|
+ method: 'post',
|
|
|
+ body
|
|
|
+ })
|
|
|
+ } catch (error) {}
|
|
|
}
|
|
|
|
|
|
const cancel = () => {
|
|
@@ -344,9 +433,14 @@ const cancel = () => {
|
|
|
// 修改群名称
|
|
|
const handleUpdGroupNickname = () => {}
|
|
|
|
|
|
+// 改变状态的公用方法
|
|
|
+const changeState = (state) => {
|
|
|
+ if (state == 1) return true
|
|
|
+ if (state == 0) return false
|
|
|
+}
|
|
|
+
|
|
|
// 获取群设置的配置信息
|
|
|
const getGroupSetData = async () => {
|
|
|
- // /website/tourGroup/getGroupInfoAndMemberByGroupId
|
|
|
const { data } = await request('/website/tourGroup/getGroupInfoAndMemberByGroupId', {
|
|
|
query: {
|
|
|
groupId: setData.groupId
|
|
@@ -354,6 +448,16 @@ const getGroupSetData = async () => {
|
|
|
})
|
|
|
if (typeof data == 'object') {
|
|
|
setData = data
|
|
|
+ console.log(data.memberList, '555')
|
|
|
+ console.log(userInfo.value.userId, '555')
|
|
|
+
|
|
|
+ userGroupData.value = data.memberList.find((item) => item.userId == userInfo.value.userId)
|
|
|
+ console.log(userGroupData.value, '4444')
|
|
|
+
|
|
|
+ userGroupData.value.isNotDisturb == 0
|
|
|
+ ? (isNotDisturb.value = false)
|
|
|
+ : (isNotDisturb.value = true)
|
|
|
+ userGroupData.value.isTop == 0 ? (isTop.value = false) : (isTop.value = true)
|
|
|
}
|
|
|
}
|
|
|
|
|
@@ -392,12 +496,12 @@ const clearChatHistory = () => {
|
|
|
|
|
|
// 点击公告
|
|
|
const handleAnnouncement = () => {
|
|
|
- console.log(!isRankAndFiler(setData?.groupRole))
|
|
|
+ console.log(!isRankAndFiler(userGroupData?.groupRemark))
|
|
|
|
|
|
- if (!isRankAndFiler(setData?.groupRole) && !setData?.groupAnnouncement) {
|
|
|
+ if (!isRankAndFiler(userGroupData?.groupRemark) && !setData?.groupAnnouncement) {
|
|
|
showConfirmDialog({
|
|
|
width: 260,
|
|
|
- message: `只有群主${setData?.groupNickname ? setData?.groupNickname : ''}或群管理员才能修改公告`,
|
|
|
+ message: `只有群主${setData?.groupName ? setData?.groupName : ''}或群管理员才能修改公告`,
|
|
|
showCancelButton: false,
|
|
|
confirmButtonColor: '#FF9300',
|
|
|
confirmButtonText: '我知道了'
|
|
@@ -408,9 +512,9 @@ const handleAnnouncement = () => {
|
|
|
navigateTo({
|
|
|
path: '/chat/announcement',
|
|
|
query: {
|
|
|
- groupId: setData?.groupId ? setData?.groupId : 0,
|
|
|
- userId: '1',
|
|
|
- groupRole: setData?.groupRole
|
|
|
+ groupId: setData?.groupId,
|
|
|
+ userId: userInfo.value.userId,
|
|
|
+ groupRole: userGroupData?.groupRemark
|
|
|
}
|
|
|
})
|
|
|
}
|