[✨] 프로필뷰 점검 완료, 출석 뷰 생성

AcaMate/1. View/12. Main/121. Button/SimpleBtnView.swift

@@ -20,6 +20,7 @@ struct SimpleBtnView: View {
                     .font(font)
                     .lineLimit(1)
                     .minimumScaleFactor(0.5)
+                    .multilineTextAlignment(.center)
                     .truncationMode(.tail)
                     .foregroundStyle(state.textColor)
                     .frame(width: state.width, height: state.height)

AcaMate/1. View/12. Main/122. DashBoard/AttendanceView.swift

@@ -0,0 +1,116 @@
+//
+//  AttendanceView.swift
+//  AcaMate
+//
+//  Created by TAnine on 2/7/25.
+//
+
+import SwiftUI
+
+struct AttendanceView: View {
+    @StateObject var btnVM = ButtonViewModel()
+    @State private var attMoreBtnID = UUID()
+    
+    @State var monthlyGroup: (Int,Int) = (5,10)//(0,0)
+    @State var dailyGroup: (Int,Int) = (3,4)//(0,0)
+    
+    var body: some View {
+        VStack(spacing: 0) {
+            HStack(spacing: 0){
+                Image(.Icon.attendance)
+                    .resizable()
+                    .frame(width: 24, height: 24, alignment: .center)
+                    .padding([.trailing],4)
+                Text("출석")
+                    .font(.nps(font: .bold, size: 20))
+                    .foregroundStyle(Color(.Text.detail))
+                Spacer()
+                SimpleBtnView(vm: btnVM, id: attMoreBtnID)
+            }
+            .padding([.bottom],2)
+            
+            Rectangle()
+                .frame(maxWidth: .infinity, maxHeight: 2)
+                .foregroundStyle(Color(.Second.normal))
+                .padding([.bottom],12)
+            
+            HStack(spacing: 4) {
+                AttCellView(isDaily: false, valueGroup: $monthlyGroup)
+                Spacer()
+//                Spacer(minLength: 1)
+                AttCellView(isDaily: true, valueGroup: $dailyGroup)
+            }
+            .frame(maxWidth: .infinity)
+        }
+        .padding(24)
+
+        .onAppear {
+            btnVM.setSize(for: attMoreBtnID, newWidth: 40, newHeight: 24)
+            btnVM.setText(for: attMoreBtnID, newText: "더보기", newFont: .nps(size: 12))
+            btnVM.setTextColor(for: attMoreBtnID, newColor: .Text.disabled)
+            // MARK: TO-DO
+            // 더보기 동작 로직 추가
+        }
+    }
+}
+
+struct AttCellView: View {
+    @StateObject var btnVM = ButtonViewModel()
+    @State private var cellBtnID = UUID()
+    let isDaily: Bool
+    
+    @Binding var valueGroup: (Int,Int)
+    @State private var cellText: (name: String, group: String) = ("","")
+    
+    var body: some View {
+        HStack {
+            CircleBtnView(vm: btnVM, id: cellBtnID)
+            VStack(alignment: .leading,spacing: 0) {
+                HStack(alignment: .center, spacing: 2) {
+                    Text("\(cellText.name)").font(.nps(font: .bold, size: 12))
+                        .foregroundStyle(Color(.Text.detail))
+                    Text("출석").font(.nps(size: 12))
+                        .foregroundStyle(Color(.Text.detail))
+//                    Spacer()
+                }
+                .padding(.top,4)
+                HStack(alignment: .center, spacing: 2) {
+                    Spacer()
+                    Text("\(valueGroup.0)").font(.nps(font: .bold, size: 20))
+                        .foregroundStyle(((Double(valueGroup.0)/Double(valueGroup.1)) < 0.7) ? Color(.Other.red) : Color(.Other.blue))
+                        .frame(width: 28,alignment: .center)
+                    Text("/").font(.nps(size: 12))
+                        .foregroundStyle(Color(.Text.detail))
+                    Text("\(valueGroup.1)").font(.nps(font: .bold, size: 20))
+                        .foregroundStyle(Color(.Text.detail))
+                        .frame(width: 28,alignment: .center)
+                    Text("\(cellText.group)")
+                        .font(.nps(size: 16))
+                        .foregroundStyle(Color(.Text.detail))
+                        .lineLimit(1)
+                        .minimumScaleFactor(0.5)
+                        .truncationMode(.tail)
+                }
+                .frame(maxWidth: .infinity)
+            }
+            
+        }
+        .onAppear {
+            btnVM.setImage(for: cellBtnID,
+                           newImage: isDaily ? Image(.Icon.attendanceDaily) : Image(.Icon.attendanceMonthly))
+            btnVM.setSize(for: cellBtnID, newWidth: 48, newHeight: 48)
+            btnVM.setIsReverse(for: cellBtnID, newValue: true)
+            btnVM.setIsSelected(for: cellBtnID, newValue: true)
+            
+            if isDaily {
+                cellText = ("일일", "시간")
+            } else {
+                cellText = ("월간", "일")
+            }
+        }
+    }
+}
+
+#Preview {
+    AttendanceView()
+}

AcaMate/1. View/12. Main/122. DashBoard/TopProfileView.swift

@@ -8,96 +8,127 @@
 import SwiftUI
 
 struct TopProfileView: View {
-    var userType: UserType = .ETC
+    @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 var childNum: Int = 0
+    @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(image: Image(.Icon.market), title: nil, font: nil,
-//                                  width: 40, height: 40)
-//                    .doAction {
-//                        printLog("TEST")
-//                    }
+                    SimpleBtnView(vm: btnVM, id: shopID)
                     Spacer(minLength: 1)
-//                    SimpleBtnView(image: Image(.Icon.notificationSET), title: nil, font: nil,
-//                                  width: 40, height: 40)
-//                    .doAction {
-//                        printLog("TEST")
-//                    }
+                    SimpleBtnView(vm: btnVM, id: notifyID)
                 } /// 최상단 버튼 Stack
                 ZStack{
                     Circle()
                         .stroke(Color(.Second.normal) ,lineWidth: 4)
                         .frame(width: 200, height: 200)
-                    switch self.userType {
-                    case .Student:
-                        // MARK: TO-DO
-                        // 학생일때 표시하는거 어떻게 할 건지 좀 더 고민을 해보자
-                        Image(.Icon.face)
-                            .resizable()
-                            .frame(width: 150, height: 150)
-                    case .Parent:
-                        Text("학부모")
+                    
+                    Text("\(typeName)")
                         .font(.nps(font: .bold, size: 48))
                         .foregroundStyle(Color(.Second.normal))
-                    case .Teacher:
-                        Text("선생님")
-                            .font(.nps(font: .bold, size: 48))
-                            .foregroundStyle(Color(.Second.normal))
-                    case .Admin:
-                        Text("관리자")
-                            .font(.nps(font: .bold, size: 48))
-                            .foregroundStyle(Color(.Second.normal))
-                    case .Employee:
-                        Text("직원")
-                            .font(.nps(font: .bold, size: 48))
-                            .foregroundStyle(Color(.Second.normal))
-                    case .ETC:
-                        Text("방문객")
-                            .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)
-                        .multilineTextAlignment(.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(childrenList.enumerated()),id: \.offset){ index, name in
-//                    CircleBtnView(title: "\(name)", image: Image(.Icon.face),
-//                                  // MARK: TO-DO
-//                                  /// 이 바인딩 이거 잘 작동 되는지 후에 확인 할것
-//                                  isSelected: Binding(
-//                                    get: { self.childNum == index },
-//                                    set: { _ in self.childNum = index }
-//                                  ), isReverse: false) {
-//                                      self.childNum = index
-//                    }
-//                    if index != childrenList.count-1 {
-//                        Spacer()
-//                    }
-//                }
+                    ForEach(Array(childIDList.enumerated()),id: \.offset){ index, id in
+                        CircleBtnView(vm: btnVM, id: id)
+                        if index != childIDList.count-1 {
+                            Spacer()
+                        }
+                    }
                 } /// 아래쪽 HStack
-            .padding([.leading, .trailing], 24)
+                .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 = "방문객"
+            }
+        }
     }
 }
 

AcaMate/1. View/12. Main/MainView.swift

@@ -16,19 +16,40 @@ struct MainView: View {
     var body: some View {
         VStack(spacing:0) {
             TopView(titleName: "Name")
-            
-            Spacer()
+            // MARK: TO-DO
+            // 스크롤뷰 해서 탑뷰 가리는거 이제 만들어 보기
+            VStack(spacing: 0) {
+                TopProfileView()
+                    .padding(EdgeInsets(top: 0, leading: 0, bottom: 12, trailing: 0))
+                AttendanceView()
+                    .background {
+                        RoundedRectangle(cornerRadius: 8)
+                            .foregroundStyle(Color(.Other.cell))
+                    }
+                    .padding(EdgeInsets(top: 12, leading: 24, bottom: 12, trailing: 24))
+                AttendanceView()
+                    .background {
+                        RoundedRectangle(cornerRadius: 8)
+                            .foregroundStyle(Color(.Other.cell))
+                    }
+                    .padding(EdgeInsets(top: 12, leading: 24, bottom: 12, trailing: 24))
+                AttendanceView()
+                    .background {
+                        RoundedRectangle(cornerRadius: 8)
+                            .foregroundStyle(Color(.Other.cell))
+                    }
+                    .padding(EdgeInsets(top: 12, leading: 24, bottom: 12, trailing: 24))
+                AttendanceView()
+                    .background {
+                        RoundedRectangle(cornerRadius: 8)
+                            .foregroundStyle(Color(.Other.cell))
+                    }
+                    .padding(EdgeInsets(top: 12, leading: 24, bottom: 12, trailing: 24))
+            }
             
             BottomView()
                 .frame(maxWidth: .infinity)
-                
-//                .backgroundStyle(Color(.Normal.dark))
-//                .safeAreaInset(edge: .bottom, spacing: 0) {
-//                    Color(.Normal.dark)
-////                        .frame(height: 0)
-//                }
         }
-//        .fullDrawView(Color(.Normal.dark))
+        .frame(maxWidth: .infinity, maxHeight: .infinity)
     }
 }
-

AcaMate/6. Resources/Assets.xcassets/Color Folder/Text/Title.colorset/Contents.json

@@ -0,0 +1,20 @@
+{
+  "colors" : [
+    {
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "1.000",
+          "blue" : "0.114",
+          "green" : "0.114",
+          "red" : "0.114"
+        }
+      },
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

AcaMate/6. Resources/Assets.xcassets/Image Folder/Icon/Attendance.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "Attendance.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

AcaMate/6. Resources/Assets.xcassets/Image Folder/Icon/Attendance_Daily.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "Attendance_Daily.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

AcaMate/6. Resources/Assets.xcassets/Image Folder/Icon/Attendance_Monthly.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "Attendance_Monthly.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

AcaMate/6. Resources/Assets.xcassets/Image Folder/Icon/Drive OFF.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "Drive OFF.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

AcaMate/6. Resources/Assets.xcassets/Image Folder/Icon/Drive ON.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "Drive ON.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

AcaMate/6. Resources/Assets.xcassets/Image Folder/Icon/Drive.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "Drive.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

AcaMate/6. Resources/Assets.xcassets/Image Folder/Icon/Flag.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "Flag.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

AcaMate/6. Resources/Assets.xcassets/Image Folder/Icon/Notice.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "Notice.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

AcaMate/6. Resources/Assets.xcassets/Image Folder/Icon/Notice_New.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "Notice_New.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

AcaMate/6. Resources/Assets.xcassets/Image Folder/Icon/Notice_Old.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "Notice_Old.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

AcaMate/6. Resources/Assets.xcassets/Image Folder/Icon/Ratio.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "Ratio.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}