import SwiftUI

extension Notification.Name {
    static let didAddFirstMedia = Notification.Name("didAddFirstMedia")
}
/// 主上传视图
/// 提供媒体选择、预览和上传功能
@MainActor
struct MediaUploadView: View {
    // MARK: - 属性
    
    /// 上传管理器，负责处理上传逻辑
    @StateObject private var uploadManager = MediaUploadManager()
    /// 控制媒体选择器的显示/隐藏
    @State private var showMediaPicker = false
    /// 当前选中的媒体项
    @State private var selectedMedia: MediaType? = nil
    /// 当前选中的媒体索引集合
    @State private var selectedIndices: Set<Int> = []
    @State private var mediaPickerSelection: [MediaType] = []  // 添加这个状态变量
    
    // MARK: - 视图主体
    
    var body: some View {
        VStack(spacing: 0) {
            // 顶部导航栏
            topNavigationBar
            
            // 上传提示信息
            uploadHintView
            
            // 主上传区域
            MainUploadArea(
                uploadManager: uploadManager,
                showMediaPicker: $showMediaPicker,
                selectedMedia: $selectedMedia
            )
            .padding()
            .id("mainUploadArea\(uploadManager.selectedMedia.count)")
            
            Spacer()
            
            // 继续按钮
            continueButton
                .padding(.bottom, 24)
        }
        .background(Color.themeTextWhiteSecondary)
        .navigationBarTitleDisplayMode(.inline)
        .navigationBarBackButtonHidden(true)
        .sheet(isPresented: $showMediaPicker) {
            // 媒体选择器
            mediaPickerView
        }
    }
    
    // MARK: - 子视图
    
    /// 顶部导航栏
    private var topNavigationBar: some View {
        HStack {
            // 返回按钮
            Button(action: { Router.shared.pop() }) {
                Image(systemName: "chevron.left")
                    .font(.system(size: 17, weight: .semibold))
                    .foregroundColor(.themeTextMessageMain)
            }
            .padding(.leading, 16)
            
            Spacer()
            
            // 标题
            Text("Complete Your Profile")
                .font(Typography.font(for: .title2, family: .quicksandBold))
                .foregroundColor(.themeTextMessageMain)
            
            Spacer()
            
            // 右侧占位视图（保持布局平衡）
            Color.clear
                .frame(width: 24, height: 24)
                .padding(.trailing, 16)
        }
        .background(Color.themeTextWhiteSecondary)
        .padding(.horizontal)
        .zIndex(1) // 确保导航栏显示在最上层
    }
    
    /// 上传提示视图
    private var uploadHintView: some View {
        HStack {
            Text("The upload process will take approximately 2 minutes. Thank you for your patience.")
                .font(.caption)
                .foregroundColor(.black)
                .frame(maxWidth: .infinity, alignment: .leading)
                .padding(12)
                .background(
                    LinearGradient(
                        gradient: Gradient(colors: [
                            Color(red: 1.0, green: 0.97, blue: 0.87),
                            .white,
                            Color(red: 1.0, green: 0.97, blue: 0.84)
                        ]),
                        startPoint: .topLeading,
                        endPoint: .bottomTrailing
                    )
                    .cornerRadius(8)
                )
                .padding(.horizontal)
        }
        .padding(.vertical, 8)
    }
    
    /// 继续按钮
    private var continueButton: some View {
        Button(action: {
            // 处理继续操作
            // Router.shared.navigate(to: .avatarBox)
        }) {
            Text("Continue")
                .font(.headline)
                .foregroundColor(uploadManager.selectedMedia.isEmpty ? Color.themeTextMessage : Color.themeTextMessageMain)
                .frame(maxWidth: .infinity)
                .frame(height: 56)
                .background(uploadManager.selectedMedia.isEmpty ? Color.white : Color.themePrimary)
                .cornerRadius(28)
                .padding(.horizontal, 24)
        }
        .buttonStyle(PlainButtonStyle())
        .disabled(uploadManager.selectedMedia.isEmpty)
    }
    
    /// 媒体选择器视图
    private var mediaPickerView: some View {
        MediaPicker(
            selectedMedia: Binding(
                get: { mediaPickerSelection },
                set: { newSelections in
                    // 只处理尚未选择的媒体项
                    let newItems = newSelections.filter { newItem in
                        !uploadManager.selectedMedia.contains { $0.id == newItem.id }
                    }
                    
                    if !newItems.isEmpty {
                        // 将新项添加到现有选择的开头
                        let newMedia = newItems + uploadManager.selectedMedia
                        uploadManager.clearAllMedia()
                        uploadManager.addMedia(newMedia)
                        
                        // 如果没有选中的媒体，则选中第一个新增的
                        if selectedIndices.isEmpty {
                            selectedIndices = [0]  // 选择第一个新增的项
                            selectedMedia = newItems.first
                        }
                        
                        // 开始上传新添加的媒体
                        uploadManager.startUpload()
                    }
                    
                    // 重置选择
                    mediaPickerSelection = []
                }
            ),
            imageSelectionLimit: max(0, 20 - uploadManager.selectedMedia.filter { 
                if case .image = $0 { return true }
                return false
            }.count),
            videoSelectionLimit: max(0, 5 - uploadManager.selectedMedia.filter {
                if case .video = $0 { return true }
                return false
            }.count),
            selectionMode: .multiple,
            onDismiss: handleMediaPickerDismiss,
            onUploadProgress: { index, progress in
                print("文件 \(index) 上传进度: \(progress * 100)%")
            }
        )
        .onAppear {
            // 重置选择状态当选择器出现时
            mediaPickerSelection = []
        }
    }
    
    // MARK: - 私有方法
    
    /// 处理媒体选择器关闭事件
    private func handleMediaPickerDismiss() {
        showMediaPicker = false
        print("媒体选择器关闭 - 开始处理")
        
        // 如果有选中的媒体，开始上传
        if !uploadManager.selectedMedia.isEmpty {
            // 不需要在这里开始上传，因为handleMediaChange会处理
        }
    }
    
    /// 处理媒体变化
    /// - Parameters:
    ///   - newMedia: 新的媒体数组
    ///   - oldMedia: 旧的媒体数组
    private func handleMediaChange(_ newMedia: [MediaType], oldMedia: [MediaType]) {
        print("开始处理媒体变化，新数量: \(newMedia.count), 原数量: \(oldMedia.count)")
        
        // 如果没有变化，直接返回
        guard newMedia != oldMedia else {
            print("媒体未发生变化，跳过处理")
            return
        }
        
        // 在后台线程处理媒体变化
        DispatchQueue.global(qos: .userInitiated).async { [self] in
            // 找出新增的媒体（在newMedia中但不在oldMedia中的项）
            let newItems = newMedia.filter { newItem in
                !oldMedia.contains { $0.id == newItem.id }
            }
            
            print("检测到\(newItems.count)个新增媒体项")
            
            // 如果有新增媒体
            if !newItems.isEmpty {
                print("准备添加\(newItems.count)个新项...")
                
                // 在主线程更新UI
                DispatchQueue.main.async { [self] in
                    // 创建新的数组，包含原有媒体和新媒体
                    var updatedMedia = uploadManager.selectedMedia
                    updatedMedia.append(contentsOf: newItems)
                    
                    // 更新选中的媒体
                    uploadManager.clearAllMedia()
                    uploadManager.addMedia(updatedMedia)
                    
                    // 如果当前没有选中的媒体，则选中第一个新增的媒体
                    if selectedIndices.isEmpty && !newItems.isEmpty {
                        selectedIndices = [oldMedia.count] // 选择第一个新增项的索引
                        selectedMedia = newItems.first
                    }
                    
                    // 开始上传新添加的媒体
                    uploadManager.startUpload()
                    print("媒体添加完成，总数量: \(uploadManager.selectedMedia.count)")
                }
            }
        }
    }
    
    /// 检查是否有正在上传的文件
    /// - Returns: 是否正在上传
    private func isUploading() -> Bool {
        return uploadManager.uploadStatus.values.contains { status in
            if case .uploading = status { return true }
            return false
        }
    }
}

// MARK: - 主上传区域

/// 主上传区域视图
/// 显示上传提示、媒体预览和添加更多按钮
struct MainUploadArea: View {
    // MARK: - 属性
    
    /// 上传管理器
    @ObservedObject var uploadManager: MediaUploadManager
    /// 控制媒体选择器的显示/隐藏
    @Binding var showMediaPicker: Bool
    /// 当前选中的媒体
    @Binding var selectedMedia: MediaType?
    
    // MARK: - 视图主体
    
   var body: some View {
        VStack(spacing: 16) {
            // 标题
            Text("Click to upload 20 images and 5 videos to generate your next blind box.")
                .font(Typography.font(for: .title2, family: .quicksandBold))
                .fontWeight(.bold)
                .foregroundColor(.black)
                .multilineTextAlignment(.center)
                .padding(.horizontal)
            // 主显示区域
            if let mediaToDisplay = selectedMedia ?? uploadManager.selectedMedia.first {
                MediaPreview(media: mediaToDisplay, uploadManager: uploadManager)
                    .id(mediaToDisplay.id)
                    .frame(width: 225, height: 225)
                    .overlay(
                        RoundedRectangle(cornerRadius: 16)
                            .stroke(Color.themePrimary, lineWidth: 5) // 使用主题色添加2点宽的实线边框
                    )
                    .cornerRadius(16)
                    .shadow(radius: 4)
                    .padding(.horizontal)
                    .transition(.opacity)
            } else {
                UploadPromptView(showMediaPicker: $showMediaPicker)
            }
            // 媒体预览区域
            mediaPreviewSection
        }
        .onAppear {
            print("MainUploadArea appeared")
            print("Selected media count: \(uploadManager.selectedMedia.count)")
            
            if selectedMedia == nil, let firstMedia = uploadManager.selectedMedia.first {
                print("Selecting first media: \(firstMedia.id)")
                selectedMedia = firstMedia
            }
        }
        .onReceive(NotificationCenter.default.publisher(for: .didAddFirstMedia)) { notification in
            if let media = notification.userInfo?["media"] as? MediaType, selectedMedia == nil {
                selectedMedia = media
            }
        }
        .background(Color.white)
        .cornerRadius(16)
        .shadow(radius: 2)
        .animation(.default, value: selectedMedia?.id)  // 当 selectedMedia 的 id 变化时添加动画
    }
    
    // MARK: - 子视图
    
    /// 媒体预览区域
    private var mediaPreviewSection: some View {
        Group {
            if !uploadManager.selectedMedia.isEmpty {
                VStack(spacing: 8) {
                    // 横向滚动的缩略图列表
                    ScrollView(.horizontal, showsIndicators: false) {
                        LazyHStack(spacing: 10) {
                            ForEach(Array(uploadManager.selectedMedia.enumerated()), id: \.element.id) { index, media in
                                mediaItemView(for: media, at: index)
                            }
                            // 当没有选择媒体时显示添加更多按钮
                            if !uploadManager.selectedMedia.isEmpty {
                                addMoreButton
                            }
                        }
                        .padding(.horizontal)
                    }
                    .frame(height: 140)
                }
                .padding(.vertical, 8)
            }
        }
    }
    
    /// 单个媒体项视图
    /// - Parameters:
    ///   - media: 媒体项
    ///   - index: 索引
    /// - Returns: 媒体项视图
    private func mediaItemView(for media: MediaType, at index: Int) -> some View {
        ZStack(alignment: .topTrailing) {
            VStack(spacing: 4) {
                // 媒体预览
                MediaPreview(media: media, uploadManager: uploadManager)
                    .frame(width: 80, height: 80)
                    .cornerRadius(8)
                    .shadow(radius: 1)
                    .overlay(
                        // 左上角序号
                        ZStack {
                            Path { path in
                                let radius: CGFloat = 4
                                let width: CGFloat = 28
                                let height: CGFloat = 18
                                
                                // 从左上角开始（带圆角）
                                path.move(to: CGPoint(x: 0, y: radius))
                                path.addQuadCurve(to: CGPoint(x: radius, y: 0), 
                                                control: CGPoint(x: 0, y: 0))
                                
                                // 上边缘（右上角保持直角）
                                path.addLine(to: CGPoint(x: width, y: 0))
                                
                                // 右边缘（右下角保持直角）
                                path.addLine(to: CGPoint(x: width, y: height - radius))
                                
                                // 右下角圆角
                                path.addQuadCurve(to: CGPoint(x: width - radius, y: height), 
                                                control: CGPoint(x: width, y: height))
                                
                                // 下边缘（左下角保持直角）
                                path.addLine(to: CGPoint(x: 0, y: height))
                                
                                // 闭合路径
                                path.closeSubpath()
                            }
                            .fill(Color.white.opacity(0.5))
                            
                            // Text
                            Text("\(index + 1)")
                                .font(.system(size: 12, weight: .bold))
                                .foregroundColor(.black)
                                .frame(width: 28, height: 18)
                                .offset(x: 0, y: -1)
                        }
                        .frame(width: 28, height: 18)
                        .offset(x: 0, y: 0)
                        .padding([.top, .leading], 0),
                        alignment: .topLeading
                    )
                    // 在 mediaItemView 函数中，更新 onTapGesture：
                    // .onTapGesture {
                    //     print("Tapped media at index: \(index)") // 添加日志
                    //     withAnimation {
                    //         selectedIndices = [index]
                    //         selectedMedia = media
                    //     }
                    // }
                    // .contentShape(Rectangle()) // 确保整个区域都可点击
                    // 在 mediaItemView 中，更新 onTapGesture：
                    .onTapGesture {
                        print("点击了媒体项，索引: \(index)")
                        withAnimation {
                            selectedMedia = media  // 直接更新选中的媒体
                        }
                    }
                    .contentShape(Rectangle())  // 确保整个区域都可点击
            }
            
            // 右上角关闭按钮
            Button(action: {
                // 使用公共API移除媒体
                uploadManager.removeMedia(id: media.id)
                
                // 重置选中的媒体
                if selectedMedia == media {
                    selectedMedia = nil
                }
            }) {
                Image(systemName: "xmark.circle.fill")
                    .font(.system(size: 20))
                    .foregroundColor(.white.opacity(0.5))
                    .background(
                        Circle()
                            .fill(Color.black.opacity(0.5))
                            .frame(width: 20, height: 20)
                    )
            }
            .offset(x: 6, y: -6)  // 调整位置，确保完全可见
        }
        .padding(4)
        .contentShape(Rectangle())
    }
    
    /// 上传状态视图
    /// - Parameter index: 媒体索引
    /// - Returns: 状态视图
    @ViewBuilder
    private func uploadStatusView(for index: Int) -> some View {
        if let status = uploadManager.uploadStatus["\(index)"] {
            switch status {
            case .uploading(let progress):
                // 上传中，显示进度条
                VStack(alignment: .center, spacing: 2) {
                    Text("\(Int(progress * 100))%")
                        .font(.caption2)
                        .foregroundColor(.gray)
                    ProgressView(value: progress, total: 1.0)
                        .progressViewStyle(LinearProgressViewStyle())
                        .frame(height: 3)
                        .tint(Color.themePrimary)
                }
                .frame(width: 60)
                
            case .completed:
                // 上传完成，显示完成图标
                Image(systemName: "checkmark.circle.fill")
                    .font(.caption)
                    .foregroundColor(.green)
                    
            case .failed:
                // 上传失败，显示错误图标
                Image(systemName: "exclamationmark.triangle.fill")
                    .font(.caption)
                    .foregroundColor(.red)
                    
            default:
                EmptyView()
            }
        }
    }
    
    /// 添加更多按钮
    private var addMoreButton: some View {
        Button(action: { showMediaPicker = true }) {
            Image(systemName: "plus")
                .font(.system(size: 18))
                .foregroundColor(.black)
                .frame(width: 80, height: 80)
                .background(Color.white)
                .cornerRadius(8)
                .overlay(
                    RoundedRectangle(cornerRadius: 8)
                        .strokeBorder(style: StrokeStyle(
                            lineWidth: 3,
                            dash: [4, 4]
                        ))
                        .foregroundColor(Color.themePrimary)
                )
        }
    }
}

// MARK: - 上传提示视图

/// 上传提示视图
/// 显示上传区域的占位图和提示
struct UploadPromptView: View {
    /// 控制媒体选择器的显示/隐藏
    @Binding var showMediaPicker: Bool
    
    var body: some View {
        Button(action: { showMediaPicker = true }) {
            // 上传图标
            SVGImage(svgName: "IP")
                .frame(width: 225, height: 225)
                .contentShape(Rectangle())
                .overlay(
                    RoundedRectangle(cornerRadius: 20)
                    .stroke(style: StrokeStyle(
                        lineWidth: 5,
                        lineCap: .round,
                        dash: [12, 8]
                    ))
                    .foregroundColor(Color.themePrimary)
            )
        }
    }
}

// MARK: - 媒体预览视图

/// 媒体预览视图
/// 显示图片或视频的预览图
struct MediaPreview: View {
    // MARK: - 属性
    
    /// 图片处理队列
    private let imageProcessingQueue = DispatchQueue(
        label: "com.yourapp.imageprocessing",
        qos: .userInitiated,
        attributes: .concurrent
    )
    
    /// 媒体类型
    let media: MediaType
    /// 上传管理器
    @ObservedObject var uploadManager: MediaUploadManager
    
    // MARK: - 状态
    
    /// 加载的图片
    @State private var image: UIImage?
    
    /// 加载状态
    enum LoadState {
        /// 加载成功
        case success(UIImage)
        /// 加载失败
        case failure(Error)
    }
    
    /// 当前加载状态
    @State private var loadState: LoadState?
    
    // MARK: - 图片缓存
    
    /// 图片缓存
    private struct ImageCache {
        static let shared = NSCache<NSString, UIImage>()
        private static var cacheKeys = Set<String>()
        
        static func setImage(_ image: UIImage, forKey key: String) {
            shared.setObject(image, forKey: key as NSString)
            cacheKeys.insert(key)
        }
        
        static func getImage(forKey key: String) -> UIImage? {
            return shared.object(forKey: key as NSString)
        }
        
        static func clearCache() {
            cacheKeys.forEach { key in
                shared.removeObject(forKey: key as NSString)
            }
            cacheKeys.removeAll()
        }
    }
    
    // MARK: - 初始化
    
    init(media: MediaType, uploadManager: MediaUploadManager) {
        self.media = media
        self.uploadManager = uploadManager
        
        // 尝试从缓存加载图片
        let cacheKey = "\(media.id)" as NSString
        if let cachedImage = ImageCache.shared.object(forKey: cacheKey) {
            self._image = State(initialValue: cachedImage)
            self._loadState = State(initialValue: .success(cachedImage))
        }
    }
    
    // MARK: - 计算属性
    
    /// 上传进度
    private var uploadProgress: Double {
        guard let index = uploadManager.selectedMedia.firstIndex(where: { $0.id == media.id }) else {
            return 0
        }
        
        if case .uploading(let progress) = uploadManager.uploadStatus["\(index)"] {
            return progress
        } else if case .completed = uploadManager.uploadStatus["\(index)"] {
            return 1.0
        }
        return 0
    }
    
    /// 是否正在上传
    private var isUploading: Bool {
        guard let index = uploadManager.selectedMedia.firstIndex(where: { $0.id == media.id }) else {
            return false
        }
        
        if case .uploading = uploadManager.uploadStatus["\(index)"] {
            return true
        }
        return false
    }
    
    // MARK: - 视图主体
    
    var body: some View {
        ZStack {
            // 1. 显示图片或视频缩略图
            if let image = image {
                loadedImageView(image)
                
                // 视频播放按钮
                if case .video = media {
                    playButton
                }
                
                // 上传进度条（仅当正在上传且进度小于100%时显示）
                if isUploading && uploadProgress < 1.0 {
                    VStack {
                        Spacer()
                        ProgressView(value: uploadProgress, total: 1.0)
                            .progressViewStyle(LinearProgressViewStyle(tint: .white))
                            .frame(height: 2)
                            .padding(.horizontal, 4)
                            .padding(.bottom, 2)
                    }
                }
            } else {
                // 2. 加载中的占位图
                placeholderView
                    .onAppear {
                        loadImage()
                    }
            }
            
            // 3. 显示错误状态（如果有）
            if case .failure(let error) = loadState, image == nil {
                errorView(error: error)
            }
        }
        .aspectRatio(1, contentMode: .fill)
        .clipped()
        .cornerRadius(8)
        .overlay(
            RoundedRectangle(cornerRadius: 8)
                .stroke(Color.themePrimary.opacity(0.3), lineWidth: 1)
        )
    }
    
    // 加载中的占位图
    private var placeholderView: some View {
        Color.gray.opacity(0.1)
    }
    
    // 加载完成的图片视图
    private func loadedImageView(_ image: UIImage) -> some View {
        Image(uiImage: image)
            .resizable()
            .scaledToFill()
            .transition(.opacity.animation(.easeInOut(duration: 0.2)))
    }
    
    /// 播放按钮
    private var playButton: some View {
        Image(systemName: "play.circle.fill")
            .font(.system(size: 24))
            .foregroundColor(.white)
            .shadow(radius: 4)
    }
    
    /// 错误视图
    private func errorView(error: Error) -> some View {
        VStack(spacing: 8) {
            Image(systemName: "exclamationmark.triangle")
                .font(.system(size: 20))
                .foregroundColor(.orange)
            
            Text("加载失败")
                .font(.caption2)
                .foregroundColor(.secondary)
            
            Button(action: {
                loadState = nil
                loadImage()
            }) {
                Image(systemName: "arrow.clockwise")
                    .font(.caption)
                    .padding(4)
                    .background(Color.gray.opacity(0.2))
                    .clipShape(Circle())
            }
            .padding(.top, 4)
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        .background(Color.gray.opacity(0.1))
        .cornerRadius(8)
    }
    
    // MARK: - 私有方法
    
    /// 加载图片
    private func loadImage() {
        let cacheKey = "\(media.id)" as NSString
        
        // 检查缓存
        if let cachedImage = ImageCache.getImage(forKey: cacheKey as String) {
            image = cachedImage
            loadState = .success(cachedImage)
            return
        }
        
        // 使用专用的图片处理队列
        imageProcessingQueue.async {
            do {
                let imageToCache: UIImage
                
                switch media {
                case .image(let uiImage):
                    imageToCache = uiImage
                    
                case .video(_, let thumbnail):
                    guard let thumbnail = thumbnail else {
                        throw NSError(
                            domain: "com.yourapp.media", 
                            code: -1, 
                            userInfo: [NSLocalizedDescriptionKey: "视频缩略图加载失败"]
                        )
                    }
                    imageToCache = thumbnail
                }
                
                // 缓存图片
                ImageCache.setImage(imageToCache, forKey: cacheKey as String)
                
                // 更新UI
                DispatchQueue.main.async {
                    withAnimation(.easeInOut(duration: 0.2)) {
                        image = imageToCache
                        loadState = .success(imageToCache)
                    }
                }
                
            } catch {
                print("图片加载失败: \(error.localizedDescription)")
                DispatchQueue.main.async {
                    loadState = .failure(error)
                }
            }
        }
    }
}

// MARK: - 扩展

/// 扩展 MediaType 以支持 Identifiable 协议
extension MediaType: Identifiable {
    /// 唯一标识符
   public var id: String {
    switch self {
    case .image(let uiImage):
        return "image_\(uiImage.hashValue)"
    case .video(let url, _):
        return "video_\(url.absoluteString.hashValue)"
    }
}
}

// MARK: - 预览

struct MediaUploadView_Previews: PreviewProvider {
    static var previews: some View {
        NavigationView {
            MediaUploadView()
        }
    }
}