//
//  TopProfileView.swift
//  AcaMate
//
//  Created by TAnine on 2/5/25.
//

import SwiftUI

struct TopProfileView: View {
    @StateObject var btnVM = ButtonViewModel()
    
    var userType: UserType = .Parent
    
    // MARK: TO-DO
    // 여기서 이름 떙겨오는것도 고민을 해야 함
    var childrenList: [String] = ["name1", "name2", "name3"]
    
    var academyName: String = "Academy' NAME"
    var myName: String = "Name"
    
    @State private var typeName: String = "유형"
    @State private var ParentsSelectID: UUID?
    
    @State private var shopID = UUID()
    @State private var notifyID = UUID()
    @State private var childIDList: [UUID] = []

    var body: some View {
        VStack(spacing: 0){
            VStack(alignment: .center, spacing: 0) {
                HStack(spacing: 0) {
                    SimpleBtnView(vm: btnVM, id: shopID)
                    Spacer(minLength: 1)
                    SimpleBtnView(vm: btnVM, id: notifyID)
                } /// 최상단 버튼 Stack
                ZStack{
                    Circle()
                        .stroke(Color(.Second.normal) ,lineWidth: 4)
                        .frame(width: 200, height: 200)
                    
                    Text("\(typeName)")
                        .font(.nps(font: .bold, size: 48))
                        .foregroundStyle(Color(.Second.normal))
                    
                    
                } /// 중앙 원형 Stack
                .padding([.top, .bottom], 40)
                VStack(alignment: .center, spacing: 8) {
                    Text("\(self.academyName)")
                        .frame(alignment: .center)
                        .font(.nps(font: .bold, size: 36))
                        .foregroundStyle(Color(.Text.title))
                        .lineLimit(1)
                        .minimumScaleFactor(0.5)
                        .truncationMode(.tail)
                    Text("\(self.myName)")
                        .multilineTextAlignment(.center)
                        .frame(alignment: .center)
                        .font(.nps(size: 18))
                        .foregroundStyle(Color(.Text.detail))
                        .lineLimit(1)
                        .minimumScaleFactor(0.5)
                        .truncationMode(.tail)
                }
            } /// 위쪽 VStack
            .padding(EdgeInsets(top: 24, leading: 24, bottom: 12, trailing: 24))
            
            // MARK: TO-DO
            // 여기에 가로스크롤 넣어야 할거 같음
            if userType == .Parent {
                HStack(spacing: 0) {
                    ForEach(Array(childIDList.enumerated()),id: \.offset){ index, id in
                        CircleBtnView(vm: btnVM, id: id)
                        if index != childIDList.count-1 {
                            Spacer()
                        }
                    }
                } /// 아래쪽 HStack
                .padding([.leading, .trailing, .bottom], 24)
            }
        }
        .fullDrawView(.Other.cell)
        .onAppear {
            let topBtnIDList = [shopID,notifyID]
            let iconList = [Image(.Icon.market), Image(.Icon.notificationSET)]
            
            topBtnIDList.enumerated().forEach { (index, id) in
                btnVM.setImage(for: topBtnIDList[index], newImage: iconList[index])
                btnVM.setSize(for: topBtnIDList[index], newWidth: 40, newHeight: 40)
            }
            // MARK: TO-DO
            // 마켓 버튼과 알림 버튼 동작 로직 구현하기
            
            
            switch self.userType {
            case .Student:
                typeName = "학생"
            case .Parent:
                typeName = "학부모"
                for _ in 0..<childrenList.count {
                    childIDList.append(UUID())
                }
                ParentsSelectID = childIDList[0]
                btnVM.setIsSelected(for: childIDList[0], newValue: true)
                
                childIDList.enumerated().forEach { (index, id) in
                    btnVM.setImage(for: id, newImage: Image(.Icon.face))
                    btnVM.setSize(for: id, newWidth: 64, newHeight: 64)
                    btnVM.setText(for: id, newText: "\(childrenList[index])", newFont: .nps(size: 12))
                    // MARK: TO-DO
                    // 좀더 자세한 동작 로직 구현 필요
                    btnVM.setAction(for: id) {
                        if let selectID = ParentsSelectID {
                            btnVM.setIsSelected(for: selectID, newValue: false)
                        }
                        btnVM.setIsSelected(for: id, newValue: true)
                        ParentsSelectID = id
                    }
                }
                
            case .Teacher:
                typeName = "선생님"
            case .Admin:
                typeName = "관리자"
            case .Employee:
                typeName = "직원"
            case .ETC:
                typeName = "방문객"
            }
        }
    }
}

#Preview {
    TopProfileView()
}