Update

README.md

@@ -93,9 +93,9 @@ yarn android-tv
 
 ## 部署
 
-### 后端部署 (Vercel)
+### 后端部署
 
-后端服务已配置为可以轻松部署到 [Vercel](https://vercel.com/)。
+#### [Vercel](https://vercel.com/) 部署
 
 1.  **安装 Vercel CLI**
 
@@ -116,6 +116,16 @@ yarn android-tv
 
     按照 Vercel CLI 的提示完成登录和部署过程。`vercel.json` 文件已配置好所有必要的构建和路由设置。
 
+#### Docker 部署
+
+1. `docker pull zimpel1/tv-host`
+
+2. `docker run -d -p 3001:3001 zimpel1/tv-host`
+
+#### 使用 demo 地址
+
+在设置中可以使用 demo 地址： https://orion-tv.vercel.app，需要代理且不保证稳定和可用性。
+
 ## 📜 主要脚本
 
 - `yarn start`: 在手机模式下启动 Metro Bundler。

app/_layout.tsx

@@ -10,6 +10,7 @@ import { useEffect } from "react";
 import { Platform } from "react-native";
 
 import { useColorScheme } from "@/hooks/useColorScheme";
+import { initializeApi } from "@/services/api";
 
 // Prevent the splash screen from auto-hiding before asset loading is complete.
 SplashScreen.preventAutoHideAsync();
@@ -29,6 +30,10 @@ export default function RootLayout() {
     }
   }, [loaded, error]);
 
+  useEffect(() => {
+    initializeApi();
+  }, []);
+
   if (!loaded && !error) {
     return null;
   }

app/index.tsx

@@ -30,7 +30,8 @@ import VideoCard from "@/components/VideoCard.tv";
 import { PlayRecordManager } from "@/services/storage";
 import { useFocusEffect, useRouter } from "expo-router";
 import { useColorScheme } from "react-native";
-import { Search } from "lucide-react-native";
+import { Search, Settings } from "lucide-react-native";
+import { SettingsModal } from "@/components/SettingsModal";
 
 // --- 类别定义 ---
 interface Category {
@@ -68,6 +69,7 @@ export default function HomeScreen() {
   const [loading, setLoading] = useState(true);
   const [loadingMore, setLoadingMore] = useState(false);
   const [error, setError] = useState<string | null>(null);
+  const [isSettingsVisible, setSettingsVisible] = useState(false);
 
   const [pageStart, setPageStart] = useState(0);
   const [hasMore, setHasMore] = useState(true);
@@ -145,9 +147,12 @@ export default function HomeScreen() {
         setPageStart((prev) => prev + result.list.length);
         setHasMore(true);
       }
-    } catch (err) {
+    } catch (err: any) {
-      console.error("Failed to load data:", err);
+      if (err.message === "API_URL_NOT_SET") {
-      setError("加载失败，请重试");
+        setError("请点击右上角设置按钮，配置您的 API 地址");
+      } else {
+        setError("加载失败，请重试");
+      }
     } finally {
       setLoading(false);
       setLoadingMore(false);
@@ -244,18 +249,32 @@ export default function HomeScreen() {
       {/* 顶部导航 */}
       <View style={styles.headerContainer}>
         <ThemedText style={styles.headerTitle}>首页</ThemedText>
-        <Pressable
+        <View style={styles.rightHeaderButtons}>
-          style={({ focused }) => [
+          <Pressable
-            styles.searchButton,
+            style={({ focused }) => [
-            focused && styles.searchButtonFocused,
+              styles.searchButton,
-          ]}
+              focused && styles.searchButtonFocused,
-          onPress={() => router.push({ pathname: "/search" })}
+            ]}
-        >
+            onPress={() => router.push({ pathname: "/search" })}
-          <Search
+          >
-            color={colorScheme === "dark" ? "white" : "black"}
+            <Search
-            size={24}
+              color={colorScheme === "dark" ? "white" : "black"}
-          />
+              size={24}
-        </Pressable>
+            />
+          </Pressable>
+          <Pressable
+            style={({ focused }) => [
+              styles.searchButton,
+              focused && styles.searchButtonFocused,
+            ]}
+            onPress={() => setSettingsVisible(true)}
+          >
+            <Settings
+              color={colorScheme === "dark" ? "white" : "black"}
+              size={24}
+            />
+          </Pressable>
+        </View>
       </View>
 
       {/* 分类选择器 */}
@@ -277,7 +296,9 @@ export default function HomeScreen() {
         </View>
       ) : error ? (
         <View style={styles.centerContainer}>
-          <ThemedText type="subtitle">{error}</ThemedText>
+          <ThemedText type="subtitle" style={{ padding: 10 }}>
+            {error}
+          </ThemedText>
         </View>
       ) : (
         <FlatList
@@ -297,6 +318,14 @@ export default function HomeScreen() {
           }
         />
       )}
+      <SettingsModal
+        visible={isSettingsVisible}
+        onCancel={() => setSettingsVisible(false)}
+        onSave={() => {
+          setSettingsVisible(false);
+          loadInitialData();
+        }}
+      />
     </ThemedView>
   );
 }
@@ -324,9 +353,14 @@ const styles = StyleSheet.create({
     fontWeight: "bold",
     paddingTop: 16,
   },
+  rightHeaderButtons: {
+    flexDirection: "row",
+    alignItems: "center",
+  },
   searchButton: {
     padding: 10,
     borderRadius: 30,
+    marginLeft: 10,
   },
   searchButtonFocused: {
     backgroundColor: "#007AFF",

components/SettingsModal.tsx

@@ -0,0 +1,169 @@
+import React, { useState, useEffect, useRef } from "react";
+import {
+  Modal,
+  View,
+  Text,
+  TextInput,
+  StyleSheet,
+  Pressable,
+  useColorScheme,
+} from "react-native";
+import { SettingsManager } from "@/services/storage";
+import { moonTVApi } from "@/services/api";
+import { ThemedText } from "./ThemedText";
+import { ThemedView } from "./ThemedView";
+
+interface SettingsModalProps {
+  visible: boolean;
+  onCancel: () => void;
+  onSave: () => void;
+}
+
+export const SettingsModal: React.FC<SettingsModalProps> = ({
+  visible,
+  onCancel,
+  onSave,
+}) => {
+  const [apiUrl, setApiUrl] = useState("");
+  const [isInputFocused, setIsInputFocused] = useState(false);
+  const colorScheme = useColorScheme();
+  const inputRef = useRef<TextInput>(null);
+
+  useEffect(() => {
+    if (visible) {
+      SettingsManager.get().then((settings) => {
+        setApiUrl(settings.apiBaseUrl);
+      });
+      const timer = setTimeout(() => {
+        inputRef.current?.focus();
+      }, 200);
+      return () => clearTimeout(timer);
+    }
+  }, [visible]);
+
+  const handleSave = async () => {
+    await SettingsManager.save({ apiBaseUrl: apiUrl });
+    moonTVApi.setBaseUrl(apiUrl);
+    onSave();
+  };
+
+  const styles = StyleSheet.create({
+    modalContainer: {
+      flex: 1,
+      justifyContent: "center",
+      alignItems: "center",
+      backgroundColor: "rgba(0, 0, 0, 0.6)",
+    },
+    modalContent: {
+      width: "80%",
+      maxWidth: 500,
+      padding: 24,
+      borderRadius: 12,
+      elevation: 10,
+    },
+    title: {
+      fontSize: 24,
+      fontWeight: "bold",
+      marginBottom: 20,
+      textAlign: "center",
+    },
+    input: {
+      height: 50,
+      borderWidth: 2,
+      borderRadius: 8,
+      paddingHorizontal: 15,
+      fontSize: 16,
+      marginBottom: 24,
+      backgroundColor: colorScheme === "dark" ? "#3a3a3c" : "#f0f0f0",
+      color: colorScheme === "dark" ? "white" : "black",
+      borderColor: "transparent",
+    },
+    inputFocused: {
+      borderColor: "#007AFF",
+      shadowColor: "#007AFF",
+      shadowOffset: { width: 0, height: 0 },
+      shadowOpacity: 0.8,
+      shadowRadius: 10,
+      elevation: 5,
+    },
+    buttonContainer: {
+      flexDirection: "row",
+      justifyContent: "space-around",
+    },
+    button: {
+      flex: 1,
+      paddingVertical: 12,
+      borderRadius: 8,
+      alignItems: "center",
+      marginHorizontal: 8,
+    },
+    buttonSave: {
+      backgroundColor: "#007AFF",
+    },
+    buttonCancel: {
+      backgroundColor: colorScheme === "dark" ? "#444" : "#ccc",
+    },
+    buttonText: {
+      color: "white",
+      fontSize: 18,
+      fontWeight: "500",
+    },
+    focusedButton: {
+      transform: [{ scale: 1.05 }],
+      shadowColor: "#000",
+      shadowOffset: { width: 0, height: 4 },
+      shadowOpacity: 0.3,
+      shadowRadius: 5,
+      elevation: 8,
+    },
+  });
+
+  return (
+    <Modal
+      animationType="fade"
+      transparent={true}
+      visible={visible}
+      onRequestClose={onCancel}
+    >
+      <View style={styles.modalContainer}>
+        <ThemedView style={styles.modalContent}>
+          <ThemedText style={styles.title}>设置</ThemedText>
+          <TextInput
+            ref={inputRef}
+            style={[styles.input, isInputFocused && styles.inputFocused]}
+            value={apiUrl}
+            onChangeText={setApiUrl}
+            placeholder="输入 API 地址"
+            placeholderTextColor={colorScheme === "dark" ? "#888" : "#555"}
+            autoCapitalize="none"
+            autoCorrect={false}
+            onFocus={() => setIsInputFocused(true)}
+            onBlur={() => setIsInputFocused(false)}
+          />
+          <View style={styles.buttonContainer}>
+            <Pressable
+              style={({ focused }) => [
+                styles.button,
+                styles.buttonCancel,
+                focused && styles.focusedButton,
+              ]}
+              onPress={onCancel}
+            >
+              <Text style={styles.buttonText}>取消</Text>
+            </Pressable>
+            <Pressable
+              style={({ focused }) => [
+                styles.button,
+                styles.buttonSave,
+                focused && styles.focusedButton,
+              ]}
+              onPress={handleSave}
+            >
+              <Text style={styles.buttonText}>保存</Text>
+            </Pressable>
+          </View>
+        </ThemedView>
+      </View>
+    </Modal>
+  );
+};

package.json

@@ -2,7 +2,7 @@
   "name": "OrionTV",
   "private": true,
   "main": "expo-router/entry",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "scripts": {
     "start": "EXPO_USE_METRO_WORKSPACE_ROOT=1 expo start",
     "start-tv": "EXPO_TV=1 EXPO_USE_METRO_WORKSPACE_ROOT=1 expo start",
@@ -15,7 +15,7 @@
     "test": "jest --watchAll",
     "lint": "expo lint",
     "prebuild": "EXPO_USE_METRO_WORKSPACE_ROOT=1 expo prebuild --clean",
-    "prebuild-tv": "EXPO_TV=1 EXPO_USE_METRO_WORKSPACE_ROOT=1 expo prebuild --clean && yarn copy-config",
+    "prebuild-tv": "EXPO_TV=1 EXPO_USE_METRO_WORKSPACE_ROOT=1 expo prebuild --clean",
     "copy-config": "cp -r xml/* android/app/src/*",
     "build-local": "cd android && ./gradlew assembleRelease"
   },

services/api.ts

@@ -1,3 +1,5 @@
+import { SettingsManager } from "./storage";
+
 export interface DoubanItem {
   title: string;
   poster: string;
@@ -57,7 +59,17 @@ export interface PlayRecord {
 }
 
 export class API {
-  private baseURL: string = "https://orion-tv.vercel.app";
+  public baseURL: string = "";
+
+  constructor(baseURL?: string) {
+    if (baseURL) {
+      this.baseURL = baseURL;
+    }
+  }
+
+  public setBaseUrl(url: string) {
+    this.baseURL = url;
+  }
 
   /**
    * 生成图片代理 URL
@@ -77,6 +89,9 @@ export class API {
     pageSize: number = 16,
     pageStart: number = 0
   ): Promise<DoubanResponse> {
+    if (!this.baseURL) {
+      throw new Error("API_URL_NOT_SET");
+    }
     const url = `${
       this.baseURL
     }/api/douban?type=${type}&tag=${encodeURIComponent(
@@ -92,6 +107,9 @@ export class API {
    * 搜索视频
    */
   async searchVideos(query: string): Promise<{ results: SearchResult[] }> {
+    if (!this.baseURL) {
+      throw new Error("API_URL_NOT_SET");
+    }
     const url = `${this.baseURL}/api/search?q=${encodeURIComponent(query)}`;
     const response = await fetch(url);
     if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
@@ -102,6 +120,9 @@ export class API {
    * 获取视频详情
    */
   async getVideoDetail(source: string, id: string): Promise<VideoDetail> {
+    if (!this.baseURL) {
+      throw new Error("API_URL_NOT_SET");
+    }
     const url = `${this.baseURL}/api/detail?source=${source}&id=${id}`;
     const response = await fetch(url);
     if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
@@ -150,56 +171,10 @@ export class API {
 }
 
 // 默认实例
-export const moonTVApi = new API();
+export let moonTVApi = new API();
 
-// 生成模拟数据的辅助函数
+// 初始化 API
-export const generateMockDoubanData = (count: number = 20): DoubanItem[] => {
+export const initializeApi = async () => {
-  const movieTitles = [
+  const settings = await SettingsManager.get();
-    "肖申克的救赎",
+  moonTVApi.setBaseUrl(settings.apiBaseUrl);
-    "霸王别姬",
-    "阿甘正传",
-    "泰坦尼克号",
-    "这个杀手不太冷",
-    "千与千寻",
-    "美丽人生",
-    "辛德勒的名单",
-    "星际穿越",
-    "盗梦空间",
-    "忠犬八公的故事",
-    "教父",
-    "龙猫",
-    "当幸福来敲门",
-    "三傻大闹宝莱坞",
-    "机器人总动员",
-    "放牛班的春天",
-    "无间道",
-    "楚门的世界",
-    "大话西游之大圣娶亲",
-  ];
-
-  return Array.from(
-    { length: Math.min(count, movieTitles.length) },
-    (_, index) => ({
-      title: movieTitles[index] || `影片 ${index + 1}`,
-      poster: `https://picsum.photos/160/240?random=${index}`,
-      rate: (Math.random() * 3 + 7).toFixed(1),
-    })
-  );
-};
-
-export const generateMockSearchResults = (
-  query: string,
-  count: number = 20
-): SearchResult[] => {
-  return Array.from({ length: count }, (_, index) => ({
-    id: index + 1,
-    title: `搜索结果：${query} ${index + 1}`,
-    poster: `https://picsum.photos/160/240?random=${index + 100}`,
-    episodes: [`第1集`, `第2集`, `第3集`],
-    source: "mock",
-    source_name: "模拟源",
-    year: (2020 + Math.floor(Math.random() * 4)).toString(),
-    desc: `这是关于 ${query} 的搜索结果 ${index + 1}`,
-    type_name: Math.random() > 0.5 ? "电影" : "电视剧",
-  }));
 };

services/storage.ts

@@ -25,6 +25,7 @@ export interface AppSettings {
   theme: "light" | "dark" | "auto";
   autoPlay: boolean;
   playbackSpeed: number;
+  apiBaseUrl: string;
 }
 
 // --- Helper ---
@@ -177,6 +178,7 @@ export class SettingsManager {
       theme: "auto",
       autoPlay: true,
       playbackSpeed: 1.0,
+      apiBaseUrl: "",
     };
     try {
       const data = await AsyncStorage.getItem(STORAGE_KEYS.SETTINGS);