sodalive-ios/SodaLive/Sources/Live/Room/Routlette/Config/RouletteSettingsView.swift

195 lines
9.0 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 onComplete: (Bool) -> 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: 0) {
Text("룰렛을 활성화 하시겠습니까?")
.font(.custom(Font.bold.rawValue, size: 16))
.foregroundColor(Color(hex: "eeeeee"))
Spacer()
Image(viewModel.isActive ? "btn_toggle_on_big" : "btn_toggle_off_big")
.resizable()
.frame(width: 44, height: 27)
.onTapGesture {
viewModel.isActive.toggle()
}
}
VStack(alignment: .leading, spacing: 13.3) {
Text("룰렛 금액 설정")
.font(.custom(Font.bold.rawValue, size: 16))
.foregroundColor(Color(hex: "eeeeee"))
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(hex: "eeeeee"))
.keyboardType(.numberPad)
.padding(.horizontal, 13.3)
.padding(.vertical, 16.7)
.frame(maxWidth: .infinity)
.background(Color(hex: "222222"))
.cornerRadius(6.7)
Spacer()
Text("")
.font(.custom(Font.bold.rawValue, size: 16.7))
.foregroundColor(Color(hex: "eeeeee"))
}
}
.padding(.top, 26.7)
VStack(alignment: .leading, spacing: 21.3) {
Text("룰렛 옵션 설정")
.font(.custom(Font.bold.rawValue, size: 16))
.foregroundColor(Color(hex: "eeeeee"))
HStack(spacing: 0) {
Text("※ 룰렛 옵션은 최소 2개,\n최대 6개까지 설정할 수 있습니다.")
.font(.custom(Font.medium.rawValue, size: 13.3))
.foregroundColor(Color(hex: "ff5c49"))
Spacer()
Image("btn_add")
.onTapGesture { viewModel.addOption() }
}
}
.padding(.top, 26.7)
LazyVStack(spacing: 21.3) {
ForEach(viewModel.options.indices, id: \.self) { index in
RouletteSettingsOptionView(
option: viewModel.options[index],
index: index,
onClickPlus: { viewModel.plusWeight(index: index) },
onClickDelete: { viewModel.deleteOption(index: index) },
onClickSubstract: { viewModel.subtractWeight(index: index) }
)
}
}
.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(hex: "3bb9f1"))
.padding(.vertical, 16)
.frame(maxWidth: .infinity)
.overlay(
RoundedRectangle(cornerRadius: 10)
.strokeBorder(lineWidth: 1)
.foregroundColor(Color(hex: "3bb9f1"))
)
.onTapGesture {
viewModel.onClickPreview()
}
Text("설정완료")
.font(.custom(Font.bold.rawValue, size: 18.3))
.foregroundColor(.white)
.padding(.vertical, 16)
.frame(maxWidth: .infinity)
.background(Color(hex: "3bb9f1"))
.cornerRadius(10)
.onTapGesture {
viewModel.createOrUpdateRoulette {
onComplete($0)
isShowing = false
}
}
}
.padding(13.3)
.background(Color(hex: "222222"))
.cornerRadius(16.7, corners: [.topLeft, .topRight])
if proxy.safeAreaInsets.bottom > 0 {
Rectangle()
.foregroundColor(Color(hex: "222222"))
.frame(width: screenSize().width, height: 15.3)
}
}
.onTapGesture {
hideKeyboard()
}
if let preview = viewModel.previewData, viewModel.isShowPreview {
RoulettePreviewDialog(
isShowing: $viewModel.isShowPreview,
title: "룰렛 미리보기",
onClickSpin: nil,
preview: preview
)
}
}
.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(hex: "9970ff"))
.foregroundColor(Color.white)
.multilineTextAlignment(.center)
.cornerRadius(20)
.padding(.top, 66.7)
Spacer()
}
}
}
.onAppear {
viewModel.getRoulette(creatorId: UserDefaults.int(forKey: .userId))
}
}
}
}
struct RouletteSettingsView_Previews: PreviewProvider {
static var previews: some View {
RouletteSettingsView(isShowing: .constant(true)) { _ in }
}
}