更新ShotService，修改calculateRecognitionBoxes函数以接收matched_persons参数，并在ShotTabContent中集成该函数以优化识别框计算逻辑。同时，在PersonDetectionScene中添加未识别出人像的提示信息，提升用户体验。

app/service/Interaction/ShotService.ts

@@ -50,7 +50,7 @@ export interface UseShotService {
   /** 设置角色简单数据 */
   setSimpleCharacter: (characters: SimpleCharacter[]) => void;
   /** 计算识别框 */
-  calculateRecognitionBoxes: (containerElement: HTMLElement) => Array<{
+  calculateRecognitionBoxes: (containerElement: HTMLElement, matched_persons: MatchedPerson[]) => Array<{
     left: number;
     top: number;
     width: number;
@@ -405,7 +405,8 @@ export const useShotService = (): UseShotService => {
    * @returns 计算后的识别框属性数组
    */
    const calculateRecognitionBoxes = (
-    containerElement: HTMLElement
+    containerElement: HTMLElement,
+    matched_persons: MatchedPerson[] = []
   ): Array<{
     /** 横向定位坐标 */
     left: number;
@@ -422,6 +423,7 @@ export const useShotService = (): UseShotService => {
     const containerRect = containerElement.getBoundingClientRect();
     const containerWidth = containerRect.width;
     const containerHeight = containerRect.height;
+    console.log('recognitionBoxes-width-height', containerWidth, containerHeight);
 
     // 计算识别框属性
     return matched_persons

components/pages/work-flow/use-edit-data.tsx

@@ -27,7 +27,8 @@ export const useEditData = (tabType: string, originalText?: string) => {
     getVideoSegmentList,
     setSelectedSegment,
     regenerateVideoSegment,
-    filterRole
+    filterRole,
+    calculateRecognitionBoxes
   } = useShotService();
 
   const {
@@ -121,6 +122,7 @@ export const useEditData = (tabType: string, originalText?: string) => {
     setSelectedSegment,
     regenerateVideoSegment,
     filterRole,
+    calculateRecognitionBoxes,
     // role
     roleData,
     selectRole,

components/ui/person-detection.tsx

@@ -375,8 +375,12 @@ export const PersonDetectionScene: React.FC<Props> = ({
 
       {/* 人物识别框和浮签 */}
       <AnimatePresence>
+        {detections.length === 0 && (
+          <div className="absolute inset-0 flex items-center justify-center">
+            <span className="text-white text-sm">未识别出人像</span>
+          </div>
+        )}
         {detections.map((person, index) => {
-
           return (
             <div key={person.id} className="cursor-pointer" onClick={() => {
               onPersonClick?.(person);

components/ui/shot-tab-content.tsx

@@ -11,7 +11,6 @@ import FloatingGlassPanel from './FloatingGlassPanel';
 import { ReplaceCharacterPanel } from './replace-character-panel';
 import HorizontalScroller from './HorizontalScroller';
 import { useEditData } from '@/components/pages/work-flow/use-edit-data';
-import { roleRecognitionResponse } from '@/app/service/usecase/ShotEditUsecase';
 
 interface ShotTabContentProps {
   currentSketchIndex: number;
@@ -32,7 +31,8 @@ export function ShotTabContent({
     userRoleLibrary,
     fetchRoleShots,
     shotSelectionList,
-    applyRoleToSelectedShots
+    applyRoleToSelectedShots,
+    calculateRecognitionBoxes
   } = useEditData('shot');
   const [selectedIndex, setSelectedIndex] = useState(currentSketchIndex);
 
@@ -65,14 +65,18 @@ export function ShotTabContent({
       return;
     }
     setScanState('scanning');
-    await filterRole(document.getElementById('person-detection-video') as HTMLVideoElement);
-    
-    if (roleRecognitionResponse.recognition_result.code === 200) {
-      setDetections(roleRecognitionResponse.recognition_result.data.matched_persons.map((person) => ({
+    const containerElement = document.getElementById('person-detection-video') as HTMLVideoElement;
+    const roleRecognitionResponse = await filterRole(containerElement);
+    console.log('roleRecognitionResponse', roleRecognitionResponse);
+    if (roleRecognitionResponse && roleRecognitionResponse.recognition_result.code === 200) {
+      const recognitionBoxes = calculateRecognitionBoxes(containerElement, roleRecognitionResponse.recognition_result.data.matched_persons);
+      console.log('recognitionBoxes', recognitionBoxes);
+      setDetections(recognitionBoxes.map((person: any) => ({
         id: person.person_id,
         name: person.person_id,
-        position: { top: person.bbox.y, left: person.bbox.x, width: person.bbox.width, height: person.bbox.height }
+        position: { top: person.top, left: person.left, width: person.width, height: person.height }
       })));
+      setScanState('detected');
     } else {
       setIsScanFailed(true);
     }
@@ -80,7 +84,8 @@ export function ShotTabContent({
 
   // 处理扫描超时/失败
   const handleScanTimeout = () => {
-    setScanState('idle');
+    setIsScanFailed(true);
+    setScanState('detected');
     setDetections([]);
   };