125 lines
		
	
	
		
			4.1 KiB
		
	
	
	
		
			Swift
		
	
	
	
	
	
			
		
		
	
	
			125 lines
		
	
	
		
			4.1 KiB
		
	
	
	
		
			Swift
		
	
	
	
	
	
//
 | 
						|
//  ChatBgSelectionView.swift
 | 
						|
//  SodaLive
 | 
						|
//
 | 
						|
//  Created by klaus on 9/3/25.
 | 
						|
//
 | 
						|
 | 
						|
import SwiftUI
 | 
						|
 | 
						|
struct ChatBgSelectionView: View {
 | 
						|
    
 | 
						|
    @StateObject var viewModel = ChatBgSelectionViewModel()
 | 
						|
    
 | 
						|
    private let columns = Array(
 | 
						|
        repeating: GridItem(.flexible(), spacing: 0),
 | 
						|
        count: 3
 | 
						|
    )
 | 
						|
    
 | 
						|
    let characterId: Int64
 | 
						|
    let selectedBgImageId: Int
 | 
						|
    let onTapBgImage: (CharacterImageListItemResponse) -> Void
 | 
						|
    
 | 
						|
    @Binding var isShowing: Bool
 | 
						|
    
 | 
						|
    var body: some View {
 | 
						|
        BaseView(isLoading: $viewModel.isLoading) {
 | 
						|
            VStack(spacing: 0) {
 | 
						|
                DetailNavigationBar(title: "배경 사진 선택") {
 | 
						|
                    isShowing = false
 | 
						|
                }
 | 
						|
                // 갤러리 그리드
 | 
						|
                ScrollView {
 | 
						|
                    LazyVGrid(columns: columns, spacing: 0) {
 | 
						|
                        ForEach(viewModel.galleryItems, id: \.self) { item in
 | 
						|
                            galleryImageView(item: item)
 | 
						|
                                .onAppear {
 | 
						|
                                    viewModel.loadMoreIfNeeded(currentItem: item)
 | 
						|
                                }
 | 
						|
                        }
 | 
						|
                    }
 | 
						|
                    .frame(maxWidth: screenSize().width)
 | 
						|
                }
 | 
						|
                
 | 
						|
                Spacer()
 | 
						|
            }
 | 
						|
            .popup(isPresented: $viewModel.isShowPopup, type: .toast, position: .top, autohideIn: 2) {
 | 
						|
                GeometryReader { geo in
 | 
						|
                    HStack {
 | 
						|
                        Spacer()
 | 
						|
                        Text(viewModel.errorMessage)
 | 
						|
                            .padding(.vertical, 13.3)
 | 
						|
                            .frame(alignment: .center)
 | 
						|
                            .frame(maxWidth: .infinity)
 | 
						|
                            .padding(.horizontal, 33.3)
 | 
						|
                            .font(.custom(Font.medium.rawValue, size: 12))
 | 
						|
                            .background(Color.button)
 | 
						|
                            .foregroundColor(Color.white)
 | 
						|
                            .multilineTextAlignment(.center)
 | 
						|
                            .cornerRadius(20)
 | 
						|
                            .padding(.top, 66.7)
 | 
						|
                        Spacer()
 | 
						|
                    }
 | 
						|
                }
 | 
						|
            }
 | 
						|
        }
 | 
						|
        .onAppear {
 | 
						|
            viewModel.characterId = characterId
 | 
						|
            viewModel.loadInitialData()
 | 
						|
        }
 | 
						|
    }
 | 
						|
    
 | 
						|
    @ViewBuilder
 | 
						|
    private func galleryImageView(item: CharacterImageListItemResponse) -> some View {
 | 
						|
        GeometryReader { geo in
 | 
						|
            let width = geo.size.width
 | 
						|
            let height = width * 5 / 4
 | 
						|
            
 | 
						|
            ZStack(alignment: .bottomTrailing) {
 | 
						|
                // 이미지
 | 
						|
                AsyncImage(url: URL(string: item.imageUrl)) { image in
 | 
						|
                    image
 | 
						|
                        .resizable()
 | 
						|
                        .scaledToFill()
 | 
						|
                        .frame(width: width, height: height)
 | 
						|
                        .clipped()
 | 
						|
                } placeholder: {
 | 
						|
                    Rectangle()
 | 
						|
                        .fill(Color.gray.opacity(0.3))
 | 
						|
                }
 | 
						|
                .overlay {
 | 
						|
                    Rectangle()
 | 
						|
                        .stroke(lineWidth: 5)
 | 
						|
                        .foregroundColor(.button)
 | 
						|
                        .opacity(selectedBgImageId == item.id ? 1 : 0)
 | 
						|
                }
 | 
						|
                
 | 
						|
                if selectedBgImageId == item.id {
 | 
						|
                    Text("현재 배경")
 | 
						|
                        .font(.custom(Font.preRegular.rawValue, size: 12))
 | 
						|
                        .foregroundColor(.white)
 | 
						|
                        .padding(.horizontal, 6)
 | 
						|
                        .padding(.vertical, 2)
 | 
						|
                        .background(Color.button)
 | 
						|
                        .cornerRadius(6.7)
 | 
						|
                        .padding(6)
 | 
						|
                }
 | 
						|
            }
 | 
						|
            .frame(width: width, height: height)
 | 
						|
            .clipped()
 | 
						|
            .contentShape(Rectangle())
 | 
						|
            .onTapGesture { onTapBgImage(item) }
 | 
						|
        }
 | 
						|
        .aspectRatio(4/5, contentMode: .fit)
 | 
						|
    }
 | 
						|
}
 | 
						|
 | 
						|
#Preview {
 | 
						|
    ChatBgSelectionView(
 | 
						|
        characterId: 0,
 | 
						|
        selectedBgImageId: 1,
 | 
						|
        onTapBgImage: { _ in },
 | 
						|
        isShowing: .constant(true)
 | 
						|
    )
 | 
						|
}
 |