import SwiftUI
import PhotosUI

struct MultiImageUploadExampleView: View {
    @State private var isImagePickerPresented = false
    @State private var selectedImages: [UIImage]? = []
    @State private var uploadResults: [UploadResult] = []
    @State private var showAlert = false
    @State private var alertMessage = ""
    
    var body: some View {
        ScrollView {
            VStack(spacing: 20) {
                // Custom upload button with image count
                MultiImageUploader(
                    maxSelection: 10,
                    isImagePickerPresented: $isImagePickerPresented,
                    selectedImagesBinding: $selectedImages,
                    content: { isUploading, count in
                        VStack(spacing: 8) {
                            Image(systemName: "photo.stack")
                                .font(.system(size: 24))
                            
                            if isUploading {
                                ProgressView()
                                    .padding(.vertical, 4)
                                Text("上传中...")
                                    .font(.subheadline)
                            } else {
                                Text(count > 0 ? "已选择 \(count) 张图片" : "选择图片")
                                    .font(.headline)
                                Text("最多可选择10张图片")
                                    .font(.caption)
                                    .foregroundColor(.secondary)
                            }
                        }
                        .frame(maxWidth: .infinity)
                        .padding()
                        .background(Color.blue.opacity(0.1))
                        .cornerRadius(12)
                        .overlay(
                            RoundedRectangle(cornerRadius: 12)
                                .stroke(Color.blue, lineWidth: 1)
                        )
                    },
                    onUploadComplete: handleUploadComplete
                ) 
                .padding(.horizontal)
                .padding(.top, 20)
                
                // Selected images preview with progress
                if let images = selectedImages, !images.isEmpty {
                    VStack(alignment: .leading, spacing: 12) {
                        Text("已选择图片")
                            .font(.headline)
                            .padding(.horizontal)
                        
                        LazyVGrid(columns: [
                            GridItem(.flexible(), spacing: 8),
                            GridItem(.flexible(), spacing: 8),
                            GridItem(.flexible(), spacing: 8)
                        ], spacing: 8) {
                            ForEach(Array(images.enumerated()), id: \.offset) { index, image in
                                ZStack(alignment: .topTrailing) {
                                    Image(uiImage: image)
                                        .resizable()
                                        .scaledToFill()
                                        .frame(height: 100)
                                        .clipped()
                                        .cornerRadius(8)
                                        .overlay(
                                            RoundedRectangle(cornerRadius: 8)
                                                .stroke(Color.gray.opacity(0.3), lineWidth: 1)
                                        )
                                    
                                    // Upload progress indicator
                                    if index < uploadResults.count {
                                        let result = uploadResults[index]
                                        VStack {
                                            Spacer()
                                            ZStack(alignment: .leading) {
                                                Rectangle()
                                                    .fill(Color.gray.opacity(0.2))
                                                    .frame(height: 4)
                                                
                                                if case .uploading(let progress) = result.status {
                                                    Rectangle()
                                                        .fill(Color.blue)
                                                        .frame(width: CGFloat(progress) * 100, height: 4)
                                                } else if case .success = result.status {
                                                    Rectangle()
                                                        .fill(Color.green)
                                                        .frame(height: 4)
                                                } else if case .failure = result.status {
                                                    Rectangle()
                                                        .fill(Color.red)
                                                        .frame(height: 4)
                                                }
                                            }
                                            .cornerRadius(2)
                                            .padding(.horizontal, 2)
                                            .padding(.bottom, 2)
                                        }
                                        .frame(height: 20)
                                    }
                                    
                                    // Status indicator
                                    if index < uploadResults.count {
                                        let result = uploadResults[index]
                                        Circle()
                                            .fill(statusColor(for: result.status))
                                            .frame(width: 12, height: 12)
                                            .padding(4)
                                            .background(Circle().fill(Color.white))
                                            .padding(4)
                                    }
                                }
                            }
                        }
                        .padding(.horizontal)
                    }
                }
                
                Spacer()
            }
        }
        .navigationTitle("多图上传示例")
        .alert(isPresented: $showAlert) {
            Alert(title: Text("上传结果"), message: Text(alertMessage), dismissButton: .default(Text("确定")))
        }
    }
    
    private func handleUploadComplete(_ results: [UploadResult]) {
        self.uploadResults = results
        let successCount = results.filter { 
            if case .success = $0.status { return true }
            return false
        }.count
        
        alertMessage = "上传完成！共 \(results.count) 张图片，成功 \(successCount) 张"
        showAlert = true
    }
    
    private func statusColor(for status: UploadStatus) -> Color {
        switch status {
        case .uploading:
            return .blue
        case .success:
            return .green
        case .failure:
            return .red
        default:
            return .gray
        }
    }
}

#Preview {
    NavigationView {
        MultiImageUploadExampleView()
    }
}