import SwiftUI
import SwiftData

// MARK: - 自定义过渡动画
extension AnyTransition {
    /// 创建从左向右的滑动过渡动画
    static var slideFromLeading: AnyTransition {
        .asymmetric(
            insertion: .move(edge: .trailing).combined(with: .opacity),  // 从右侧滑入
            removal: .move(edge: .leading).combined(with: .opacity)      // 向左侧滑出
        )
    }
}

// MARK: - 主视图
struct ContentView: View {
    // MARK: - 状态属性
    @State private var showModal = false      // 控制用户资料弹窗显示
    @State private var showSettings = false   // 控制设置页面显示
    @State private var contentOffset: CGFloat = 0  // 内容偏移量
    @State private var showLogin = false
    @State private var animateGradient = false
    
    let timer = Timer.publish(every: 0.02, on: .main, in: .common).autoconnect()
    
    // 获取模型上下文
    @Environment(\.modelContext) private var modelContext
    
    // 查询数据 - 简单查询
    @Query private var login: [Login]
    
    // MARK: - 主体视图
    var body: some View {
        NavigationView {
            ZStack {
                // 全局背景颜色背景色
                Color.themeTextWhiteSecondary.ignoresSafeArea()
                
                // 主内容区域
                VStack {
                    VStack(spacing: 20) {
                        // 顶部导航栏
                        HStack {
                            // 设置按钮
                            Button(action: showUserProfile) {
                                SVGImage(svgName: "User")
                                    .frame(width: 24, height: 24)
                            }
                            
                            Spacer()
                            // // 测试质感页面入口
                            // NavigationLink(destination: TestView()) {
                            //     Text("TestView")
                            //         .font(.subheadline)
                            //         .padding(.horizontal, 12)
                            //         .padding(.vertical, 6)
                            //         .background(Color.brown)
                            //         .foregroundColor(.white)
                            //         .cornerRadius(8)
                            // }
                            
                            // // 订阅测试按钮
                            // NavigationLink(destination: SubscribeView()) {
                            //     Text("Subscribe")
                            //         .font(.subheadline)
                            //         .padding(.horizontal, 12)
                            //         .padding(.vertical, 6)
                            //         .background(Color.orange)
                            //         .foregroundColor(.white)
                            //         .cornerRadius(8)
                            // }
                            // .padding(.trailing)
                            // .fullScreenCover(isPresented: $showLogin) {
                            //     LoginView()
                            // }
                            NavigationLink(destination: SubscribeView()) {
                                Text("3290")
                                    .font(Typography.font(for: .subtitle))
                                    .fontWeight(.bold)
                                    .padding(.horizontal, 12)
                                    .padding(.vertical, 6)
                                    .background(Color.black)
                                    .foregroundColor(.white)
                                    .cornerRadius(16)
                            }
                            .padding(.trailing)
                            .fullScreenCover(isPresented: $showLogin) {
                                LoginView()
                            }
                        }
                        .padding(.horizontal)
                        // 标题
                        VStack(alignment: .leading, spacing: 4) { 
                            Text("Hi! Click And")
                            Text("Open Your Box~")
                        }
                        .font(Typography.font(for: .smallLargeTitle))
                        .fontWeight(.bold)
                        .foregroundColor(Color.themeTextMessageMain)
                        .frame(maxWidth: .infinity, alignment: .leading)
                        .padding(.horizontal)
                        // 盲盒
                        // 添加SVG背景图片
                        ZStack {
                            // 1. 背景SVG
                            SVGImage(svgName: "BlindBg")
                                .frame(
                                    width: UIScreen.main.bounds.width * 1.8,
                                    height: UIScreen.main.bounds.height * 0.65
                                )
                                .position(x: UIScreen.main.bounds.width / 2, 
                                        y: UIScreen.main.bounds.height * 0.325)
                            
                            // 2. Lottie动画层
                            LottieView(name: "loading", loopMode: .loop)
                                .frame(width: 200, height: 200)
                                .position(x: UIScreen.main.bounds.width / 2, 
                                        y: UIScreen.main.bounds.height * 0.325)
                        }
                        .frame(
                            maxWidth: .infinity,
                            maxHeight: UIScreen.main.bounds.height * 0.65
                        )
                        .clipped()
                        // 打开
                        Button(action: showUserProfile) {
                            Text("Go to Buy")
                                .font(Typography.font(for: .body))
                                .fontWeight(.bold)
                                .frame(maxWidth: .infinity)
                                .padding()
                                .background(Color.themePrimary)
                                .foregroundColor(Color.themeTextMessageMain)
                                .cornerRadius(32)
                        }
                        .padding(.horizontal)
                    }
                    .frame(maxWidth: .infinity, maxHeight: .infinity)
                    .background(Color.themeTextWhiteSecondary)
                    .offset(x: showModal ? UIScreen.main.bounds.width * 0.8 : 0)
                    .animation(.spring(response: 0.6, dampingFraction: 0.8), value: showModal)
                    .edgesIgnoringSafeArea(.all)
                }
                
                // 用户资料弹窗
                SlideInModal(
                    isPresented: $showModal,
                    onDismiss: hideUserProfile
                ) {
                    UserProfileModal(
                        showModal: $showModal,
                        showSettings: $showSettings
                    )
                }
                .offset(x: showSettings ? UIScreen.main.bounds.width : 0)
                .animation(.spring(response: 0.6, dampingFraction: 0.8), value: showSettings)
                
                // 设置页面遮罩层
                ZStack {
                    if showSettings {
                        Color.black.opacity(0.3)
                            .edgesIgnoringSafeArea(.all)
                            .onTapGesture(perform: hideSettings)
                            .transition(.opacity)
                    }
                    
                    if showSettings {
                        SettingsView(isPresented: $showSettings)
                            .transition(.move(edge: .leading))
                            .zIndex(1)
                    }
                }
                .animation(.spring(response: 0.6, dampingFraction: 0.8), value: showSettings)
            }
            .background(Color.themeTextWhiteSecondary)
            .navigationBarHidden(true)
        }
    }
    
    /// 显示用户资料弹窗
    private func showUserProfile() {
        withAnimation(.spring(response: 0.6, dampingFraction: 0.8)) {
            // print("登录记录数量: \(login.count)")
            // for (index, item) in login.enumerated() {
            //     print("记录 \(index + 1): 邮箱=\(item.email), 姓名=\(item.name)")
            // }
            print("当前登录记录：")
            for (index, item) in login.enumerated() {
                print("记录 \(index + 1): 邮箱=\(item.email), 姓名=\(item.name)")
            }
//            showModal.toggle()
        }
    }
    
    /// 隐藏用户资料弹窗
    private func hideUserProfile() {
        withAnimation(.spring(response: 0.6, dampingFraction: 0.8)) {
            showModal = false
        }
    }
    
    /// 隐藏设置页面
    private func hideSettings() {
        withAnimation(.spring(response: 0.6, dampingFraction: 0.8)) {
            showSettings = false
        }
    }
}

// MARK: - 预览
#Preview {
    ContentView()
}