153 lines
4.1 KiB
Vue
153 lines
4.1 KiB
Vue
<script setup lang="ts">
|
|
import request from '@/utils/request'
|
|
import { FolderPlus, ImagePlus, MessageCircle, Star, ThumbsUp } from 'lucide-vue-next'
|
|
|
|
import { NConfigProvider, NImage, NMessageProvider } from 'naive-ui'
|
|
import { onMounted, ref } from 'vue'
|
|
import { useRoute } from 'vue-router'
|
|
|
|
const message = useMessage()
|
|
definePageMeta({
|
|
layout: 'planet',
|
|
})
|
|
const route = useRoute()
|
|
const typeList = ref([
|
|
{
|
|
label: '最新',
|
|
value: null,
|
|
},
|
|
{
|
|
label: '只看星主',
|
|
value: 0,
|
|
},
|
|
{
|
|
label: '精选',
|
|
value: 1,
|
|
},
|
|
{
|
|
label: '问答',
|
|
value: 999,
|
|
},
|
|
])
|
|
const showPublishModal = ref(false)
|
|
|
|
const publishListParams = ref({
|
|
communityId: route.query.communityId,
|
|
tenantId: route.query.tenantId,
|
|
type: null,
|
|
pageNum: 1,
|
|
pageSize: 10,
|
|
})
|
|
|
|
const questionParams = ref({
|
|
communityId: route.query.communityId,
|
|
tenantId: route.query.tenantId,
|
|
pageNum: 1,
|
|
pageSize: 10,
|
|
})
|
|
const questionList = ref([])
|
|
const isShow = ref('publish')
|
|
async function handleTypeChange(type: number | null) {
|
|
publishListParams.value.type = type
|
|
questionParams.value.pageNum = 1
|
|
if (type === 999) { // 问答
|
|
isShow.value = 'question'
|
|
try {
|
|
const res = await request.post('/question/list', questionParams.value)
|
|
if (res.code === 200) {
|
|
questionList.value = res.rows
|
|
}
|
|
}
|
|
catch (error) {
|
|
console.error(error)
|
|
}
|
|
}
|
|
else {
|
|
publishListParams.value.pageNum = 1
|
|
isShow.value = 'publish'
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="min-h-screen bg-[#F7F8FA] px-10 py-4 flex gap-4">
|
|
<div class="flex-1">
|
|
<div class="rounded-lg bg-white">
|
|
<div class="flex flex-col">
|
|
<div class="p-4 pb-0">
|
|
<textarea
|
|
class="w-full min-h-[100px] bg-[#F7F8FA] rounded-lg p-4 resize-none outline-none cursor-pointer"
|
|
placeholder="此刻的想法..."
|
|
@click="showPublishModal = true"
|
|
/>
|
|
</div>
|
|
|
|
<div class="flex items-center justify-between p-2 pt-0">
|
|
<div class="flex items-center">
|
|
<button class="p-2 hover:bg-gray-100 rounded text-gray-500" @click="showPublishModal = true">
|
|
<ImagePlus class="w-5 h-5" />
|
|
</button>
|
|
<button class="p-2 hover:bg-gray-100 rounded text-gray-500" @click="showPublishModal = true">
|
|
<FolderPlus class="w-5 h-5" />
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="rounded-lg py-4">
|
|
<div class="flex items-center">
|
|
<div
|
|
v-for="item in typeList"
|
|
:key="item.value"
|
|
class="flex items-center px-4 py-1 rounded cursor-pointer mr-2"
|
|
:style="{
|
|
backgroundColor: publishListParams.type === item.value ? '#000000' : '#ffffff',
|
|
color: publishListParams.type === item.value ? '#ffffff' : '#878d95',
|
|
}"
|
|
@click="handleTypeChange(item.value)"
|
|
>
|
|
{{ item.label }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div v-if="isShow === 'publish'">
|
|
<NConfigProvider>
|
|
<NMessageProvider>
|
|
<PlanetComment
|
|
:publish-list-params="publishListParams"
|
|
/>
|
|
</NMessageProvider>
|
|
</NConfigProvider>
|
|
</div>
|
|
<div v-if="isShow === 'question'">
|
|
<NConfigProvider>
|
|
<NMessageProvider>
|
|
<PlanetQuestionComment
|
|
:publish-list-params="questionParams"
|
|
/>
|
|
</NMessageProvider>
|
|
</NConfigProvider>
|
|
</div>
|
|
</div>
|
|
<div class="w-[300px]">
|
|
<PlanetBaseInfo :community-id="route.query.communityId" :tenant-id="route.query.tenantId" />
|
|
</div>
|
|
<n-modal
|
|
v-model:show="showPublishModal"
|
|
:style="{ width: '640px' }"
|
|
preset="card"
|
|
:mask-closable="false"
|
|
class="rounded-lg"
|
|
>
|
|
<PublishContent
|
|
:community-id="route.query.communityId"
|
|
:tenant-id="route.query.tenantId"
|
|
@success="showPublishModal = false"
|
|
/>
|
|
</n-modal>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
</style>
|