250 lines
		
	
	
		
			12 KiB
		
	
	
	
		
			Swift
		
	
	
	
	
	
			
		
		
	
	
			250 lines
		
	
	
		
			12 KiB
		
	
	
	
		
			Swift
		
	
	
	
	
	
//
 | 
						|
//  RouletteSettingsView.swift
 | 
						|
//  SodaLive
 | 
						|
//
 | 
						|
//  Created by klaus on 2023/12/05.
 | 
						|
//
 | 
						|
 | 
						|
import SwiftUI
 | 
						|
 | 
						|
struct RouletteSettingsView: View {
 | 
						|
    
 | 
						|
    @StateObject var keyboardHandler = KeyboardHandler()
 | 
						|
    @StateObject var viewModel = RouletteSettingsViewModel()
 | 
						|
    
 | 
						|
    @Binding var isShowing: Bool
 | 
						|
    
 | 
						|
    let availableActive: Bool
 | 
						|
    let onComplete: (Bool, String) -> Void
 | 
						|
    
 | 
						|
    var body: some View {
 | 
						|
        GeometryReader { proxy in
 | 
						|
            BaseView(isLoading: $viewModel.isLoading) {
 | 
						|
                VStack(spacing: 0) {
 | 
						|
                    DetailNavigationBar(title: "룰렛설정") {
 | 
						|
                        isShowing = false
 | 
						|
                    }
 | 
						|
                    
 | 
						|
                    ScrollView(.vertical, showsIndicators: false) {
 | 
						|
                        VStack(spacing: 0) {
 | 
						|
                            HStack(spacing: 13.3) {
 | 
						|
                                SelectedButtonView(
 | 
						|
                                    title: "룰렛 1",
 | 
						|
                                    isActive: true,
 | 
						|
                                    isSelected: viewModel.selectedRoulette == .ROULETTE_1
 | 
						|
                                )
 | 
						|
                                .onTapGesture {
 | 
						|
                                    viewModel.selectRoulette(selectedRoulette: .ROULETTE_1)
 | 
						|
                                }
 | 
						|
                                
 | 
						|
                                SelectedButtonView(
 | 
						|
                                    title: "룰렛 2",
 | 
						|
                                    isActive: viewModel.rouletteList.count > 0,
 | 
						|
                                    isSelected: viewModel.selectedRoulette == .ROULETTE_2,
 | 
						|
                                    checkImage: "ic_select_check_black",
 | 
						|
                                    bgSelectedColor: Color(hex: "ffcb14"),
 | 
						|
                                    textSelectedColor: Color.black,
 | 
						|
                                    textDefaultColor: Color(hex: "ffcb14")
 | 
						|
                                )
 | 
						|
                                .onTapGesture {
 | 
						|
                                    viewModel.selectRoulette(selectedRoulette: .ROULETTE_2)
 | 
						|
                                }
 | 
						|
                                
 | 
						|
                                SelectedButtonView(
 | 
						|
                                    title: "룰렛 3",
 | 
						|
                                    isActive: viewModel.rouletteList.count > 1,
 | 
						|
                                    isSelected: viewModel.selectedRoulette == .ROULETTE_3,
 | 
						|
                                    bgSelectedColor: Color(hex: "ff14d9"),
 | 
						|
                                    textDefaultColor: Color(hex: "ff14d9")
 | 
						|
                                )
 | 
						|
                                .onTapGesture {
 | 
						|
                                    viewModel.selectRoulette(selectedRoulette: .ROULETTE_3)
 | 
						|
                                }
 | 
						|
                            }
 | 
						|
                            .padding(.top, 26.7)
 | 
						|
                            
 | 
						|
                            if availableActive {
 | 
						|
                                HStack(spacing: 0) {
 | 
						|
                                    Text("룰렛을 활성화 하시겠습니까?")
 | 
						|
                                        .font(.custom(Font.bold.rawValue, size: 16))
 | 
						|
                                        .foregroundColor(Color.grayee)
 | 
						|
                                    
 | 
						|
                                    Spacer()
 | 
						|
                                    
 | 
						|
                                    Image(viewModel.isActive ? "btn_toggle_on_big" : "btn_toggle_off_big")
 | 
						|
                                        .resizable()
 | 
						|
                                        .frame(width: 44, height: 27)
 | 
						|
                                        .onTapGesture {
 | 
						|
                                            viewModel.isActive.toggle()
 | 
						|
                                        }
 | 
						|
                                }
 | 
						|
                                .padding(.top, 26.7)
 | 
						|
                            }
 | 
						|
                            
 | 
						|
                            VStack(alignment: .leading, spacing: 13.3) {
 | 
						|
                                Text("룰렛 금액 설정")
 | 
						|
                                    .font(.custom(Font.bold.rawValue, size: 16))
 | 
						|
                                    .foregroundColor(Color.grayee)
 | 
						|
                                
 | 
						|
                                HStack(spacing: 8) {
 | 
						|
                                    TextField("룰렛 금액을 입력해 주세요 (최소 5캔)", text: Binding(
 | 
						|
                                        get: {
 | 
						|
                                            self.viewModel.canText
 | 
						|
                                        },
 | 
						|
                                        set: { newValue in
 | 
						|
                                            self.viewModel.canText = newValue.filter { "0123456789".contains($0) }
 | 
						|
                                        }
 | 
						|
                                    ))
 | 
						|
                                    .autocapitalization(.none)
 | 
						|
                                    .disableAutocorrection(true)
 | 
						|
                                    .font(.custom(Font.medium.rawValue, size: 13.3))
 | 
						|
                                    .foregroundColor(Color.grayee)
 | 
						|
                                    .keyboardType(.numberPad)
 | 
						|
                                    .padding(.horizontal, 13.3)
 | 
						|
                                    .padding(.vertical, 16.7)
 | 
						|
                                    .frame(maxWidth: .infinity)
 | 
						|
                                    .background(Color.gray22)
 | 
						|
                                    .cornerRadius(6.7)
 | 
						|
                                    
 | 
						|
                                    Spacer()
 | 
						|
                                    
 | 
						|
                                    Text("캔")
 | 
						|
                                        .font(.custom(Font.bold.rawValue, size: 16.7))
 | 
						|
                                        .foregroundColor(Color.grayee)
 | 
						|
                                }
 | 
						|
                            }
 | 
						|
                            .padding(.top, 26.7)
 | 
						|
                            
 | 
						|
                            VStack(alignment: .leading, spacing: 21.3) {
 | 
						|
                                Text("룰렛 옵션 설정")
 | 
						|
                                    .font(.custom(Font.bold.rawValue, size: 16))
 | 
						|
                                    .foregroundColor(Color.grayee)
 | 
						|
                                
 | 
						|
                                HStack(spacing: 0) {
 | 
						|
                                    Text("※ 룰렛 옵션은 최소 2개,\n최대 10개까지 설정할 수 있습니다.")
 | 
						|
                                        .font(.custom(Font.medium.rawValue, size: 13.3))
 | 
						|
                                        .foregroundColor(Color.mainRed)
 | 
						|
                                    
 | 
						|
                                    Spacer()
 | 
						|
                                    
 | 
						|
                                    Image("btn_add")
 | 
						|
                                        .onTapGesture { viewModel.addOption() }
 | 
						|
                                }
 | 
						|
                            }
 | 
						|
                            .padding(.top, 26.7)
 | 
						|
                            
 | 
						|
                            HStack(spacing: 0) {
 | 
						|
                                Text("옵션 확률 합계")
 | 
						|
                                    .font(.custom(Font.medium.rawValue, size: 14.7))
 | 
						|
                                    .foregroundColor(Color.grayee)
 | 
						|
                                
 | 
						|
                                Spacer()
 | 
						|
                                
 | 
						|
                                Text("( \(String(format: "%.2f", viewModel.totalPercentage))% )")
 | 
						|
                                    .font(.custom(Font.medium.rawValue, size: 14.7))
 | 
						|
                                    .foregroundColor(Color.grayee)
 | 
						|
                            }
 | 
						|
                            .padding(.top, 21.3)
 | 
						|
                            
 | 
						|
                            LazyVStack(spacing: 21.3) {
 | 
						|
                                ForEach(viewModel.options.indices, id: \.self) { index in
 | 
						|
                                    RouletteSettingsOptionView(
 | 
						|
                                        option: viewModel.options[index],
 | 
						|
                                        index: index,
 | 
						|
                                        onClickDelete: { viewModel.deleteOption(index: index) },
 | 
						|
                                        calculateTotalPercentage: { viewModel.calculateTotalPercentage() }
 | 
						|
                                    )
 | 
						|
                                }
 | 
						|
                            }
 | 
						|
                            .padding(.top, 21.3)
 | 
						|
                        }
 | 
						|
                        .padding(.horizontal, 13.3)
 | 
						|
                        .padding(.bottom, keyboardHandler.keyboardHeight)
 | 
						|
                    }
 | 
						|
                    
 | 
						|
                    Spacer()
 | 
						|
                    
 | 
						|
                    HStack(spacing: 13.3) {
 | 
						|
                        Text("미리보기")
 | 
						|
                            .font(.custom(Font.bold.rawValue, size: 18.3))
 | 
						|
                            .foregroundColor(Color.button)
 | 
						|
                            .padding(.vertical, 16)
 | 
						|
                            .frame(maxWidth: .infinity)
 | 
						|
                            .overlay(
 | 
						|
                                RoundedRectangle(cornerRadius: 10)
 | 
						|
                                    .strokeBorder(lineWidth: 1)
 | 
						|
                                    .foregroundColor(Color.button)
 | 
						|
                            )
 | 
						|
                            .onTapGesture {
 | 
						|
                                viewModel.onClickPreview()
 | 
						|
                            }
 | 
						|
                        
 | 
						|
                        Text("설정완료")
 | 
						|
                            .font(.custom(Font.bold.rawValue, size: 18.3))
 | 
						|
                            .foregroundColor(.white)
 | 
						|
                            .padding(.vertical, 16)
 | 
						|
                            .frame(maxWidth: .infinity)
 | 
						|
                            .background(Color.button)
 | 
						|
                            .cornerRadius(10)
 | 
						|
                            .onTapGesture {
 | 
						|
                                viewModel.createOrUpdateRoulette {
 | 
						|
                                    onComplete($0, $1)
 | 
						|
                                    isShowing = false
 | 
						|
                                }
 | 
						|
                            }
 | 
						|
                    }
 | 
						|
                    .padding(13.3)
 | 
						|
                    .background(Color.gray22)
 | 
						|
                    .cornerRadius(16.7, corners: [.topLeft, .topRight])
 | 
						|
                    
 | 
						|
                    if proxy.safeAreaInsets.bottom > 0 {
 | 
						|
                        Rectangle()
 | 
						|
                            .foregroundColor(Color.gray22)
 | 
						|
                            .frame(width: screenSize().width, height: 15.3)
 | 
						|
                    }
 | 
						|
                }
 | 
						|
                .onTapGesture {
 | 
						|
                    hideKeyboard()
 | 
						|
                }
 | 
						|
                
 | 
						|
                if let preview = viewModel.previewData, viewModel.isShowPreview {
 | 
						|
                    RoulettePreviewDialog(
 | 
						|
                        isShowing: $viewModel.isShowPreview,
 | 
						|
                        title: "룰렛 미리보기",
 | 
						|
                        onClickSpin: nil,
 | 
						|
                        previewList: [preview]
 | 
						|
                    )
 | 
						|
                }
 | 
						|
            }
 | 
						|
            .ignoresSafeArea(edges: .bottom)
 | 
						|
            .popup(isPresented: $viewModel.isShowErrorPopup, type: .toast, position: .top, autohideIn: 1.3) {
 | 
						|
                GeometryReader { geo in
 | 
						|
                    HStack {
 | 
						|
                        Spacer()
 | 
						|
                        Text(viewModel.errorMessage)
 | 
						|
                            .padding(.vertical, 13.3)
 | 
						|
                            .frame(width: geo.size.width - 66.7, alignment: .center)
 | 
						|
                            .font(.custom(Font.medium.rawValue, size: 12))
 | 
						|
                            .background(Color.button)
 | 
						|
                            .foregroundColor(Color.white)
 | 
						|
                            .multilineTextAlignment(.center)
 | 
						|
                            .cornerRadius(20)
 | 
						|
                            .padding(.top, 66.7)
 | 
						|
                        Spacer()
 | 
						|
                    }
 | 
						|
                }
 | 
						|
            }
 | 
						|
            .onAppear {
 | 
						|
                viewModel.availableActive = availableActive
 | 
						|
                viewModel.getAllRoulette(creatorId: UserDefaults.int(forKey: .userId))
 | 
						|
            }
 | 
						|
        }
 | 
						|
    }
 | 
						|
}
 | 
						|
 | 
						|
struct RouletteSettingsView_Previews: PreviewProvider {
 | 
						|
    static var previews: some View {
 | 
						|
        RouletteSettingsView(isShowing: .constant(true), availableActive: true) { _, _ in }
 | 
						|
    }
 | 
						|
}
 |