虚拟助手相机

import React, { useRef, useState } from 'react';

const App = () => {
  const videoRef = useRef(null);
  const [videoSource, setVideoSource] = useState(null);

  const handleFileChange = (event) => {
    const file = event.target.files[0];
    if (file && file.type.startsWith('video/')) {
      const videoURL = URL.createObjectURL(file);
      setVideoSource(videoURL);
    }
  };

  return (
    <div className="min-h-screen bg-gray-900 flex flex-col items-center justify-center p-4">
      <div className="bg-gray-800 p-8 rounded-lg shadow-2xl w-full max-w-4xl">
        <h1 className="text-4xl font-bold text-white mb-8 text-center">Virtual Assistant Camera</h1>
        <div className="flex flex-col items-center">
          <video
            ref={videoRef}
            src={videoSource}
            controls
            className="w-full h-auto rounded-lg shadow-lg mb-8"
            autoPlay
            muted
          />
          <label className="bg-blue-500 text-white px-6 py-3 rounded-lg cursor-pointer hover:bg-blue-600 transition duration-300">
            Select Video
            <input
              type="file"
              accept="video/*"
              onChange={handleFileChange}
              className="hidden"
            />
          </label>
        </div>
      </div>
    </div>
  );
};

export default App;