36 lines
2.2 KiB
Vue
36 lines
2.2 KiB
Vue
<template>
|
||
<view class="page-shell editor-page">
|
||
<PageHeader title="发布家族动态" />
|
||
<view class="form-paper"><view class="section-title">记录此刻</view><text class="form-note">发布后，当前家谱的成员可以在家族圈查看。</text><textarea v-model="feedContent" maxlength="300" placeholder="写下通知、活动、家族故事或照片说明" placeholder-class="placeholder" /></view>
|
||
<view class="bottom-action"><button class="primary-button" :loading="isSubmitting" :disabled="isSubmitting" @click="submit">发布动态</button></view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref } from 'vue'
|
||
import { onLoad } from '@dcloudio/uni-app'
|
||
import PageHeader from '@/components/PageHeader.vue'
|
||
import { appApi } from '@/utils/api.js'
|
||
import { genealogyContext } from '@/utils/genealogy-context.js'
|
||
|
||
const genealogyId = ref('')
|
||
const feedContent = ref('')
|
||
const isSubmitting = ref(false)
|
||
onLoad((query) => { genealogyId.value = query.genealogyId || genealogyContext.getCurrentGenealogyId() })
|
||
const submit = async () => {
|
||
if (!genealogyId.value) { uni.showToast({ title: '未找到当前家谱', icon: 'none' }); return }
|
||
if (!feedContent.value.trim()) { uni.showToast({ title: '请填写动态内容', icon: 'none' }); return }
|
||
isSubmitting.value = true
|
||
try { await appApi.createFeed(genealogyId.value, { feedType: 'text', feedContent: feedContent.value.trim() }); uni.navigateBack() } catch (error) { uni.showToast({ title: error.message || '发布失败，请稍后重试', icon: 'none' }) } finally { isSubmitting.value = false }
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.editor-page { padding-bottom: 136rpx; }
|
||
.form-paper { margin: 28rpx; padding: 34rpx 30rpx; border: 1rpx solid $gold-soft; border-radius: 22rpx; background: $paper-white; }
|
||
.form-note { display: block; margin-top: 14rpx; color: $ink-muted; font-size: 23rpx; line-height: 1.65; }
|
||
textarea { width: 100%; height: 360rpx; margin-top: 30rpx; color: $ink; font-size: 28rpx; line-height: 1.7; }
|
||
.placeholder { color: #b7aa97; }
|
||
.bottom-action { position: fixed; right: 0; bottom: 0; left: 0; padding: 20rpx 28rpx calc(20rpx + env(safe-area-inset-bottom)); background: #fffaf0; border-top: 1rpx solid $gold-soft; }
|
||
</style>
|