planet
shenhan000 2025-04-26 13:16:55 +08:00
parent 5fb4a9df0c
commit 4ae33d30bf
3 changed files with 76 additions and 26 deletions

View File

@ -32,17 +32,7 @@ async function getCommunityDetail() {
try { try {
const res = await request.get(`/community/detail?communityId=${props.communityId}&tenantId=${props.tenantId}`) const res = await request.get(`/community/detail?communityId=${props.communityId}&tenantId=${props.tenantId}`)
if (res.code === 200) { if (res.code === 200) {
const { imageUrl, communityName, communityTag, type, price, validityDay, description, id } = res.data planetInfo.value = res.data
planetInfo.value = {
imageUrl,
communityName,
communityTag: communityTag.toString(),
type: type.toString(),
price,
id,
validityDay,
description,
}
} }
} }
catch (error) { catch (error) {

View File

@ -109,8 +109,14 @@ function handleSuccess() {
} }
function goDetail(item: any) { function goDetail(item: any) {
if (item.isJoin === 1) { if (item.isJoin === 0) {
router.push(`/public-planet-detail?communityId=${item.id}&tenantId=${item.tenantId}`) router.push({
path: '/public-planet-detail',
state: {
communityId: item.id,
tenantId: item.tenantId,
},
})
} }
else { else {
router.push(`/planet-detail?communityId=${item.id}&tenantId=${item.tenantId}`) router.push(`/planet-detail?communityId=${item.id}&tenantId=${item.tenantId}`)

View File

@ -1,10 +1,36 @@
<script setup lang="ts"> <script setup lang="ts">
import planetBg from '@/assets/img/planetBg.png' import planetBg from '@/assets/img/planetBg.png'
import { NConfigProvider, NImage, NMessageProvider } from 'naive-ui' import { NConfigProvider, NImage, NMessageProvider } from 'naive-ui'
import { ref, watch } from 'vue' import { onMounted, ref, watch } from 'vue'
import { useRoute, useRouter } from 'vue-router'
const route = useRoute() const route = useRoute()
const { communityId, tenantId } = route.query const router = useRouter()
// history state
const params = ref({
communityId: '',
tenantId: '',
})
onMounted(() => {
const state = history.state
if (state && state.communityId && state.tenantId) {
params.value = {
communityId: state.communityId,
tenantId: state.tenantId,
}
}
else {
// state退 URL
params.value = {
communityId: route.query.communityId as string,
tenantId: route.query.tenantId as string,
}
}
getCommunityDetail()
})
const userStore = useUserStore() const userStore = useUserStore()
definePageMeta({ definePageMeta({
layout: 'planet', layout: 'planet',
@ -27,7 +53,7 @@ const selectUserInfo = ref<SelectUserInfo>({
const communityDetail = ref({}) const communityDetail = ref({})
async function getCommunityDetail() { async function getCommunityDetail() {
try { try {
const res = await request.get(`/community/detail?communityId=${communityId}&tenantId=${tenantId}`) const res = await request.get(`/community/detail?communityId=${params.value.communityId}&tenantId=${params.value.tenantId}`)
if (res.code === 200) { if (res.code === 200) {
communityDetail.value = res.data communityDetail.value = res.data
} }
@ -36,7 +62,6 @@ async function getCommunityDetail() {
console.error(error) console.error(error)
} }
} }
getCommunityDetail()
// //
async function getAttention() { async function getAttention() {
@ -47,7 +72,7 @@ async function getAttention() {
} }
} }
catch (err) { catch (err) {
console.log(err) console.error(err)
} }
} }
getAttention() getAttention()
@ -67,36 +92,38 @@ getAttention()
<!-- 用户基本信息 --> <!-- 用户基本信息 -->
<client-only> <client-only>
<div class="flex items-center gap-4 mb-6"> <div class="flex items-center gap-4 mb-6">
<img :src="userStore.userInfo?.avatar" class="w-[224px] h-[224px] rounded" alt="头像"> <img :src="communityDetail.imageUrl" class="w-[224px] h-[224px] rounded" alt="头像">
<div class="flex flex-col justify-between h-[224px] w-full"> <div class="flex flex-col justify-between h-[224px] w-full">
<div class="flex flex-col gap-3"> <div class="flex flex-col gap-3">
<div class="text-[20px] font-medium text-[#192029]"> <div class="text-[20px] font-medium text-[#192029]">
{{ userStore.userInfo?.nickName }} {{ communityDetail.communityName }}
</div> </div>
<div class="text-[14px] text-[#878d95]"> <div class="text-[14px] text-[#878d95]">
最新更新时间: 3234-32432-32 最新更新时间: {{ communityDetail.lastUpdateTime }}
</div> </div>
<div class="text-[14px] flex gap-8"> <div class="text-[14px] flex gap-8">
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
<img :src="userStore.userInfo?.avatar" class="w-[20px] h-[20px] rounded-full" alt="头像"> <img :src="userStore.userInfo?.avatar" class="w-[20px] h-[20px] rounded-full" alt="头像">
<div> <div>
成员数量: 1234 成员数量: {{ communityDetail.userNum }}
</div> </div>
</div> </div>
<div> <div>
累计更新内容: 1234 累计更新内容: {{ communityDetail.updateNum }}
</div> </div>
<div> <div>
星球创建天数: 1234 星球创建天数: {{ communityDetail.createDay }}
</div> </div>
</div> </div>
</div> </div>
<div class="flex justify-between p-2 rounded bg-white items-center"> <div class="flex justify-between p-2 rounded bg-white items-center">
<div class="flex items-center gap-2 text-[#fc4141]"> <div class="flex items-center gap-2 text-[#fc4141]">
<span class="font-bold text-[28px]">228</span> <span class="text-[16px]"></span> <span class="font-bold text-[28px]">{{ communityDetail.price ? communityDetail.price : '免费' }}</span> <span v-if="communityDetail.price" class="text-[16px]"></span>
</div> </div>
<div class="text-[14px]"> <div
class="text-white text-[14px] flex items-center justify-center cursor-pointer w-[128px] h-[40px] bg-[linear-gradient(207deg,#3BEDFF_0%,#328AFE_100%)] rounded-lg"
>
立即加入 立即加入
</div> </div>
</div> </div>
@ -105,6 +132,33 @@ getAttention()
</client-only> </client-only>
</div> </div>
</div> </div>
<div class="max-w-[1140px] mx-auto">
<div class="text-[20px] py-4">
星球概况
</div>
<div class="flex gap-4">
<div class="w-[100px] h-[100px] rounded">
<!-- <img src="@/assets/img/planet-overview.png" alt="星球概况"> -->
</div>
<div class="flex flex-col justify-between">
<div class="flex gap-4">
<div>
name
</div>
<div>
关注
</div>
</div>
<div class="flex gap-4">
<div>1123粉丝</div>
<div>1123关注</div>
<div>1123获赞</div>
</div>
</div>
</div>
<div />
</div>
</div> </div>
</div> </div>
</template> </template>