wangqiao/front-pc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update API formatting and routing structure

Browse Source
This commit is contained in:
wangqiao
2025-08-28 11:29:20 +08:00
parent 9edc63ff4f
commit 3f1431f972
9 changed files with 263 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
pages/channel/components/ChannelHeader.vue
View File

@ -4,12 +4,12 @@
<!-- Logo and Title Section -->
<div class="logo-title-section">
<div class="logo">
<img :src="lunTanRes.channelIcon" alt="JRS Logo" />
<img :src="lunTanRes?.channelIcon" alt="JRS Logo" />
</div>
<div class="title-section">
<h1 class="main-title">#{{ lunTanRes.channelTitle }}</h1>
<h1 class="main-title">#{{ lunTanRes?.channelTitle }}</h1>
<div class="action-buttons">
<el-button v-if="!lunTanRes.isFollow" type="danger" class="subscribe-btn" @click="handleFollow"
<el-button v-if="!lunTanRes?.isFollow" type="danger" class="subscribe-btn" @click="handleFollow"
><el-icon class="mr-[4px] color-[#fff!]"><Plus /></el-icon> 关注
</el-button>
<el-button v-else type="danger" class="subscribe-btn" @click="handleUnfollow"> 取消关注 </el-button>
@ -21,7 +21,7 @@
<!-- Channel Info -->
<div class="channel-info">
<span class="info-item">话题介绍</span>
<span class="info-item">{{ lunTanRes.channelProfile }}</span>
<span class="info-item">{{ lunTanRes?.channelProfile }}</span>
</div>
<!-- Stats -->
@ -32,11 +32,11 @@
</div>
<div class="stats-item">
<span class="stats-label">关注人数</span>
<span class="stats-value"><i class="el-icon-arrow-up"></i> {{ lunTanRes.followCount }}人</span>
<span class="stats-value"><i class="el-icon-arrow-up"></i> {{ lunTanRes?.followCount }}人</span>
</div>
<div class="stats-item">
<span class="stats-label">当前有</span>
<span class="stats-value"><i class="el-icon-arrow-up"></i> {{ lunTanRes.chatUserCount }}人聊天</span>
<span class="stats-value"><i class="el-icon-arrow-up"></i> {{ lunTanRes?.chatUserCount }}人聊天</span>
<span class="stats-value ml-[2px] cursor-pointer color-[#1a65ff!]" @click="handleChat">立即加入</span>
</div>
</div>
@ -44,8 +44,8 @@
<!-- Tags -->
<div class="channel-tags">
<span class="tag-label">标签:</span>
<span v-for="(item, index) in lunTanRes.hotTags" :key="index" class="tag-item"
>{{ item }}{{ index === lunTanRes.hotTags.length - 1 ? '' : '、' }}</span
<span v-for="(item, index) in lunTanRes?.hotTags" :key="index" class="tag-item"
>{{ item }}{{ index === lunTanRes!.hotTags.length - 1 ? '' : '、' }}</span
>
</div>
</div>
@ -55,9 +55,9 @@
<ChatPage
v-if="isChat"
v-model:is-chat="isChat"
:chat-title="lunTanRes.channelTitle"
:chat-description="lunTanRes.channelProfile"
:channel-id="lunTanRes.channelId"
:chat-title="lunTanRes!.channelTitle"
:chat-description="lunTanRes!.channelProfile"
:channel-id="lunTanRes!.channelId"
/>
</div>
</template>
@ -71,25 +71,25 @@
import useUserStore from '~/stores/user'
const userStore = useUserStore()
const lunTanRes = defineModel<ChannelRespVO>('modelValue', {
const lunTanRes = defineModel<ChannelRespVO | null>('modelValue', {
required: true,
})
const handleClick = () => {
navigateTo('/channel/create?channelId=' + lunTanRes.value.channelId)
navigateTo('/channel/create?channelId=' + lunTanRes.value?.channelId)
}
const handleFollow = () => {
createChannelFollow({ channelId: lunTanRes.value.channelId }).then((res) => {
createChannelFollow({ channelId: lunTanRes.value!.channelId }).then((res) => {
if (res.code === 0) {
lunTanRes.value.isFollow = true
lunTanRes.value!.isFollow = true
ElMessage.success('关注成功')
}
})
}
const handleUnfollow = () => {
deleteChannelFollow({ channelId: lunTanRes.value.channelId }).then((res) => {
deleteChannelFollow({ channelId: lunTanRes.value!.channelId }).then((res) => {
if (res.code === 0) {
lunTanRes.value.isFollow = false
lunTanRes.value!.isFollow = false
ElMessage.success('取消关注成功')
}
})
@ -103,7 +103,7 @@
ElMessage.warning('请先登录')
return
}
await userStore.mqttClient?.subscribe(`zbjk_message_group/${lunTanRes.value.channelId}`)
await userStore.mqttClient?.subscribe(`zbjk_message_group/${lunTanRes.value!.channelId}`)
isChat.value = true
}
</script>

29
pages/channel/components/HotLlabel.vue
View File

@ -16,27 +16,32 @@
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { list } from '~/api/channel/index'
// import { ref } from 'vue'
// import { list } from '~/api/channel/index'
const channelId = defineModel('modelValue', {
required: true,
})
const channelIdList = defineModel<any[]>('channelIdList', {
required: true,
})
/** 获取频道列表 */
const channelIdList = ref<any>([])
const getChannelIdList = () => {
list().then((res) => {
channelIdList.value = res.data
if (channelIdList.value.length > 0) {
channelId.value = channelIdList.value[0].channelId
}
})
}
getChannelIdList()
// const channelIdList = ref<any>([])
// const getChannelIdList = () => {
// list().then((res) => {
// channelIdList.value = res.data
// if (channelIdList.value.length > 0) {
// channelId.value = channelIdList.value[0].channelId
// }
// })
// }
// getChannelIdList()
const handleClick = (id: number) => {
console.log(id)
channelId.value = id
navigateTo(`/channel/${id}/1`)
}
</script>

6
pages/channel/components/LeftContent.vue
View File

@ -2,7 +2,7 @@
<!-- 用户信息 -->
<div class="flex flex-col">
<UserInfo></UserInfo>
<HotLlabel v-model="channelId" class="mt-18px"></HotLlabel>
<HotLlabel v-model="channelId" class="mt-18px" v-model:channelIdList="channelIdList"></HotLlabel>
</div>
</template>
@ -13,6 +13,10 @@
const channelId = defineModel('modelValue', {
required: true,
})
const channelIdList = defineModel<any>('channelIdList', {
required: true,
})
</script>
<style scoped></style>

10
pages/channel/components/RightContent.vue
View File

@ -1,7 +1,9 @@
<template>
<div class="ml-[19px] w-[100%]">
<ChannelHeader v-if="Object.keys(lunTanRes).length" v-model="lunTanRes"></ChannelHeader>
<div class="mb-[13px] box-border flex flex-1 flex-col cursor-pointer gap-[12px] border border-[#EEEEEE] rounded-[8px] border-solid bg-[#FFFFFF] px-[20px] py-[16px]">
<ChannelHeader v-if="Object.keys(lunTanRes || {}).length" v-model="lunTanRes"></ChannelHeader>
<div
class="mb-[13px] box-border flex flex-1 flex-col cursor-pointer gap-[12px] border border-[#EEEEEE] rounded-[8px] border-solid bg-[#FFFFFF] px-[20px] py-[16px]"
>
<div
v-for="(item, index) in pageRes?.list"
:key="index"
@ -46,7 +48,7 @@
const pageRes = defineModel<TpageRes | null>('modelValue', {
required: true,
})
const lunTanRes = defineModel<ChannelRespVO>('lunTanRes', {
const lunTanRes = defineModel<ChannelRespVO | null>('lunTanRes', {
required: true,
})
const pageNo = defineModel<number>('pageNo', {
@ -73,7 +75,7 @@
const handleClick = (channelId: number) => {
// 新开窗口
window.open(`/chat-detail?channelId=${channelId}`, '_blank')
navigateTo(`/chat-detail/${channelId}-1`)
}
</script>