|
@@ -3,21 +3,12 @@
|
|
|
<ChatHeaderBar title="群聊二维码" />
|
|
|
<div class="h-100"></div>
|
|
|
|
|
|
- <div class="w-60 h-60 mx-auto rounded-full border overflow-hidden">
|
|
|
- <img
|
|
|
- class="w-full h-full object-cover"
|
|
|
- v-if="queueParmars?.groupAvatar"
|
|
|
- :src="queueParmars.groupAvatar"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- <img class="w-full h-full object-cover" v-else src="~/assets/img/default_avatar.png" alt="" />
|
|
|
+ <div class="w-full flex justify-center mx-auto">
|
|
|
+ <MultiHeader :size="60" v-if="groupInfo?.memberList" :imgUrls="groupInfo?.memberList" />
|
|
|
</div>
|
|
|
- <!-- :list="queueParmars?.groupAvatar" -->
|
|
|
-
|
|
|
- <!-- <ChatGroupAvatar class="mx-auto"></ChatGroupAvatar> -->
|
|
|
|
|
|
<h1 title="" class="w-300 mt-16 mb-18 text-center mx-auto text-xl text-black-3 font-semibold">
|
|
|
- 群聊:{{ queueParmars?.groupName }}
|
|
|
+ 群聊:{{ groupInfo?.groupName }}
|
|
|
</h1>
|
|
|
|
|
|
<div class="relative mb-21 w-220 h-220 bg-white rounded-lg mx-auto box-border">
|
|
@@ -29,28 +20,25 @@
|
|
|
/>
|
|
|
</div>
|
|
|
|
|
|
- <p class="w-full text-center text-sm text-black-6">该二维码7天内有效,重新进入将更新</p>
|
|
|
+ <!-- <p class="w-full text-center text-sm text-black-6">该二维码7天内有效,重新进入将更新</p> -->
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
+import defaultAvatar from '~/assets/img/default_avatar.png'
|
|
|
+
|
|
|
const route = useRoute()
|
|
|
+const router = useRouter()
|
|
|
definePageMeta({
|
|
|
layout: false
|
|
|
})
|
|
|
|
|
|
-onMounted(() => {
|
|
|
- getQrCode()
|
|
|
-})
|
|
|
-
|
|
|
// getGroupQR
|
|
|
const QRURI = ref(`${import.meta.env.VITE_APP_BASE_URL}website/tourGroup/getGroupQR`)
|
|
|
const qrCode = ref('')
|
|
|
-const queueParmars = reactive({
|
|
|
- groupId: computed(() => route.query?.groupId ?? ''),
|
|
|
- groupName: computed(() => route.query?.groupName ?? ''),
|
|
|
- groupAvatar: computed(() => route.query?.groupAvatar ?? '')
|
|
|
-})
|
|
|
+
|
|
|
+const groupId = ref(null) // 会话id
|
|
|
+const groupInfo = ref({})
|
|
|
|
|
|
useSeoMeta({
|
|
|
title: '群聊'
|
|
@@ -79,7 +67,7 @@ function getQrCode() {
|
|
|
message: '加载中...',
|
|
|
duration: 100000
|
|
|
})
|
|
|
- qrCode.value = QRURI.value + `?groupId=${queueParmars.groupId}&systemOs=1`
|
|
|
+ qrCode.value = QRURI.value + `?groupId=${groupId.value}&systemOs=1`
|
|
|
|
|
|
closeToast()
|
|
|
} catch (error) {
|
|
@@ -87,5 +75,41 @@ function getQrCode() {
|
|
|
closeToast()
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+// 获取群信息
|
|
|
+const getMemberList = async () => {
|
|
|
+ const { data } = await request('/website/tourGroup/getGroupInfoAndMemberByGroupId', {
|
|
|
+ query: {
|
|
|
+ groupId: groupId.value
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ if (data) {
|
|
|
+ groupInfo.value = data
|
|
|
+ if (Array.isArray(data?.memberList) && data?.memberList?.length) {
|
|
|
+ groupInfo.value.memberList = changeHeadImage(data?.memberList)
|
|
|
+ } else {
|
|
|
+ groupInfo.value.memberList = [defaultAvatar]
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const changeHeadImage = (headerList) => {
|
|
|
+ let headImageList = headerList
|
|
|
+ .slice(0, 9)
|
|
|
+ .map((el) => (el?.headImageUrl ? el?.headImageUrl : defaultAvatar))
|
|
|
+
|
|
|
+ return headImageList
|
|
|
+}
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ if (route.query?.groupId) {
|
|
|
+ groupId.value = route.query?.groupId
|
|
|
+ getQrCode()
|
|
|
+ getMemberList()
|
|
|
+ } else {
|
|
|
+ router.back()
|
|
|
+ }
|
|
|
+})
|
|
|
</script>
|
|
|
<style lang="scss" scoped></style>
|