feat: 实现模块3 - TUI翻译显示区

internal/tui/app.go

@@ -12,15 +12,21 @@ type model struct {
 	config     *config.Config
 	translator *translator.Translator
 	textInput  textinput.Model
+	result     string
 }
 
 var (
+	headerStyle = lipgloss.NewStyle().
+			Foreground(lipgloss.Color("#00D9FF")).
+			Bold(true)
 	inputStyle = lipgloss.NewStyle().
 			Foreground(lipgloss.Color("#FAFAFA")).
 			Background(lipgloss.Color("#1A1A2E"))
-	focusedStyle = lipgloss.NewStyle().
-			Foreground(lipgloss.Color("#FAFAFA")).
-			Background(lipgloss.Color("#16213E"))
+	resultStyle = lipgloss.NewStyle().
+			Foreground(lipgloss.Color("#98FB98")).
+			Background(lipgloss.Color("#0D1B2A"))
+	helpStyle = lipgloss.NewStyle().
+			Foreground(lipgloss.Color("#888888"))
 )
 
 func NewApp(cfg *config.Config, t *translator.Translator) *tea.Program {
@@ -59,9 +65,20 @@ func (m model) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 }
 
 func (m model) View() string {
+	resultBox := m.renderResult()
+	helpText := helpStyle.Render("\n  按 Ctrl+C 退出  |  Enter 翻译")
+
 	return "\n" +
-		"  YOYO翻译\n" +
-		"  ─────────────────────\n\n" +
+		"  " + headerStyle.Render("YOYO翻译") + "\n" +
+		"  " + lipgloss.NewStyle().Foreground(lipgloss.Color("#00D9FF")).Render("─────────────────────") + "\n\n" +
 		"  " + m.textInput.View() + "\n\n" +
-		"  按 Ctrl+C 退出\n"
+		resultBox +
+		helpText
+}
+
+func (m model) renderResult() string {
+	if m.result == "" {
+		return "  " + helpStyle.Render("翻译结果将显示在这里...") + "\n"
+	}
+	return "  " + resultStyle.Render(m.result) + "\n"
 }