任务与聊天

典型组合

• 任务列表：服务端同步或 Query 结果
• 聊天历史：ChatHistoryView
• 聊天输入：本地控件 + 动作
• 轻量文本信息：Placeholder 或本地 store

一个常见模板骨架

<template>
  <Panel id="questRoot">
    <Label text="Quest List" />

    <ScrollerView class="questList">
      <Panel b-for="item in internalSyncStore.get('sync:quests') ?? []">
        <Label :text="item.title" />
      </Panel>
    </ScrollerView>

    <ChatHistoryView />
    <TextField id="chatDraft" />
    <Button text="Send" @click="sendChat()" />
  </Panel>
</template>

一个最小脚本

import { document } from "bui:ui"

function sendChat() {
  const input = document.getElementById("chatDraft")
  const text = input?.getText() ?? ""
  if (!text.trim()) return

  Chat.sendMessage(text, true)
  input?.setText("")
}