From b8bf32ddf1986fae91ddcf2fe86df3492d92a132 Mon Sep 17 00:00:00 2001 From: "parkjekyun@gmail.com" Date: Wed, 28 Dec 2022 16:22:18 +0900 Subject: [PATCH] =?UTF-8?q?[Chore]=20=EC=98=B5=EC=85=98=EC=97=90=20?= =?UTF-8?q?=EB=94=B0=EB=A5=B8=20=EA=B0=80=EA=B2=A9=20=EC=84=A4=EC=A0=95=20?= =?UTF-8?q?=EA=B3=BC=EC=A0=95=EC=97=90=EC=84=9C=20Picker=20=EC=97=90?= =?UTF-8?q?=EB=9F=AC=20=ED=95=B4=EA=B2=B0=EC=A4=91=20#4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ContentView.swift | 6 +- .../ProductDetailModalView.swift | 142 ++++++++++++------ .../ProductDetailView.swift | 54 ++++--- .../FolderProductDetail/TempViewModel.swift | 3 +- 4 files changed, 130 insertions(+), 75 deletions(-) diff --git a/big-project-a-customer-ios/big-project-a-customer-ios/ContentView.swift b/big-project-a-customer-ios/big-project-a-customer-ios/ContentView.swift index ad7e328..59d6002 100644 --- a/big-project-a-customer-ios/big-project-a-customer-ios/ContentView.swift +++ b/big-project-a-customer-ios/big-project-a-customer-ios/ContentView.swift @@ -8,9 +8,13 @@ import SwiftUI struct ContentView: View { + @State private var options: [String: [String]] = [ + "사이즈": ["S_0", "M_0", "L_0"], + "컬러": ["레드_2000", "블루_3000", "블랙_1000"] + ] var body: some View { TabView { - ProductDetailModalView().tabItem { + ProductDetailModalView(options: $options).tabItem { Image(systemName: "house") Text("홈") }.tag(1) diff --git a/big-project-a-customer-ios/big-project-a-customer-ios/FolderProductDetail/ProductDetailModalView.swift b/big-project-a-customer-ios/big-project-a-customer-ios/FolderProductDetail/ProductDetailModalView.swift index 0e1f688..ffcf355 100644 --- a/big-project-a-customer-ios/big-project-a-customer-ios/FolderProductDetail/ProductDetailModalView.swift +++ b/big-project-a-customer-ios/big-project-a-customer-ios/FolderProductDetail/ProductDetailModalView.swift @@ -8,61 +8,104 @@ import SwiftUI struct ProductDetailModalView: View { - @ObservedObject var tempVM: TempViewModel = TempViewModel() - -// @Binding var options: [String: [String]] - @State var selectedColor = "" + // @ObservedObject var tempVM: TempViewModel = TempViewModel() + + @Binding var options: [String: [String]] @State var count: Int = 1 @State private var selection = "" // FIXME: - 유저가 중복선택할 경우를 생각해서 Set을 적용할지 생각해보기. - @State private var selectedOptions: [String] = [] - - var colors = ["red", "green", "blue"] - var price: Int = 50000 - + + @State private var selectedOptions: [(optionName: String, option: String, optionPrice: Int)] = [] + + // 기본 가격(옵션 제외) + var basePrice: Int = 50000 + // 옵션 추가 금액 + var optionPrice: Int = 0 + var optionsArray: [String] { - Array(tempVM.options.keys).sorted() + Array(options.keys).sorted() } - + var body: some View { - + VStack { - // 옵션 마다 picker를 제공 - ForEach(optionsArray, id:\.self) { key in - // FIXME: - Picker Error - Picker("", selection: $selection) { - ForEach(tempVM.options[key]!, id: \.0) { - Text("\($0) \($1)") + // 옵션 마다 picker를 만들어준다. + ForEach(Array(optionsArray.enumerated()), id: \.offset) { (index, key) in + // key: 옵션명(컬러, 사이즈 등) + HStack { + Text(key) + + Spacer() + + // FIXME: - Picker Error + Picker(key, selection: $selection) { + Text("선택없음").tag(Optional(nil)) + ForEach(options[key]!, id: \.self) { item in + let value = item.split(separator: "_").map { String($0) } + Text("\(value[0]) +\(value[1])원").tag(Optional(item)) + } } +// .onChange(of: selection, perform: { value in +// if !value.isEmpty { +// let newValue = value.split(separator: "_").map { String($0) } +// let newTuple = (String(key), String(newValue[0]), Int(newValue[1])!) +// selectedOptions.append(newTuple) +// } else { +// print(value) +// } +// }) + .onReceive([self.selection].publisher.first()) { (value) in +// 선택 옵션을 selectedOptions 딕셔너리에 업데이트 + if !value.isEmpty { + let newValue = value.split(separator: "_").map { String($0) } + let newTuple = (String(key), String(newValue[0]), Int(newValue[1])!) + } + + } + .pickerStyle(.menu) + .background(.white) + .cornerRadius(15) } - .pickerStyle(.menu) - .background(.white) - .cornerRadius(15) - .padding() - } - .onReceive([self.selection].publisher.first()) { (value) in - selectedOptions.append(value) + .padding() + } - + HStack { Text("수량") - + Spacer() - + CustomStepper(value: $count, textColor: .black) } - .padding() - + .padding() + + HStack { + Text("옵션") + Spacer() + } + .padding() + + VStack { + + ForEach(selectedOptions, id: \.0) { tuple in + HStack { + Spacer() + Text("\(tuple.1)(+\(tuple.2)원)") + } + } + } + .padding() + HStack { Text("가격") - + Spacer() - - Text("\(count * price)원") + + Text("\(count * (basePrice + optionPrice))원") } - .padding() - - + .padding() + + } } } @@ -71,7 +114,7 @@ struct CustomStepper: View { @Binding var value: Int var textColor: Color var step = 1 - + var body: some View { HStack { Button(action: { @@ -80,24 +123,24 @@ struct CustomStepper: View { self.feedback() } }, label: { - Image(systemName: "minus.square") - .foregroundColor(value == 1 ? .gray : .black) - }) - + Image(systemName: "minus.square") + .foregroundColor(value == 1 ? .gray : .black) + }) + Text("\(value)").font(.system(.caption, design: .rounded)) .foregroundColor(textColor) - + Button(action: { self.value += self.step self.feedback() - + }, label: { - Image(systemName: "plus.square") - .foregroundColor(.black) - }) + Image(systemName: "plus.square") + .foregroundColor(.black) + }) } } - + func feedback() { let generator = UIImpactFeedbackGenerator(style: .light) generator.impactOccurred() @@ -106,6 +149,9 @@ struct CustomStepper: View { struct ProductDetailModalView_Previews: PreviewProvider { static var previews: some View { - ProductDetailModalView() + ProductDetailModalView(options: .constant([ + "사이즈": ["S", "M", "L"], + "컬러": ["레드", "블루", "블랙"] + ])) } } diff --git a/big-project-a-customer-ios/big-project-a-customer-ios/FolderProductDetail/ProductDetailView.swift b/big-project-a-customer-ios/big-project-a-customer-ios/FolderProductDetail/ProductDetailView.swift index f800a48..4bcbd7f 100644 --- a/big-project-a-customer-ios/big-project-a-customer-ios/FolderProductDetail/ProductDetailView.swift +++ b/big-project-a-customer-ios/big-project-a-customer-ios/FolderProductDetail/ProductDetailView.swift @@ -9,13 +9,12 @@ import SwiftUI struct ProductDetailView: View { - @State private var imageHeight: CGFloat = 0 +// @State private var imageHeight: CGFloat = 0 @State private var options: [String: [String]] = [ "사이즈": ["S", "M", "L"], "컬러": ["레드", "블루", "블랙"] ] - var body: some View { // FIXME: - 외부에서 NavigationStack으로 감싸주기 NavigationView { @@ -55,23 +54,28 @@ struct ProductDetailView: View { } .padding(.leading, 15) - Image("productInformation") - .resizable() - .scaledToFit() - - Button { - // 버튼을 눌렀을때 image의 height를 최대로 늘려준다. - imageHeight = CGFloat.infinity - } label: { - HStack { - Spacer() - Text("상품정보 더보기") - Spacer() - } - } +// Image("productInformation") +// .resizable() +// .scaledToFit() + +// Button { +// // 버튼을 눌렀을때 image의 height를 최대로 늘려준다. +// imageHeight = CGFloat.infinity +// } label: { +// HStack { +// Spacer() +// Text("상품정보 더보기") +// Spacer() +// } +// } Image("productDetail") - .productDetailImageModifier(height: imageHeight) + .resizable() + .aspectRatio(contentMode: .fit) +// .frame(height: height) +// .productDetailImageModifier(height: imageHeight) + // TODO: - 문의 Section + // TODO: - 리뷰 Section } }//scroll vstack @@ -100,15 +104,15 @@ struct ProductDetailView: View { .tint(.white) } } - + + // TODO: - navibar (safe area) .toolbar { - ToolbarItem(placement: .navigationBarTrailing) { - Button(action: { }) { - Image(systemName: "magnifyingglass") - } - .foregroundColor(.black) - } - +// ToolbarItem(placement: .navigationBarTrailing) { +// Button(action: { }) { +// Image(systemName: "magnifyingglass") +// } +// .foregroundColor(.black) +// } } } // navigationView diff --git a/big-project-a-customer-ios/big-project-a-customer-ios/FolderProductDetail/TempViewModel.swift b/big-project-a-customer-ios/big-project-a-customer-ios/FolderProductDetail/TempViewModel.swift index 2b94d86..ae57cfe 100644 --- a/big-project-a-customer-ios/big-project-a-customer-ios/FolderProductDetail/TempViewModel.swift +++ b/big-project-a-customer-ios/big-project-a-customer-ios/FolderProductDetail/TempViewModel.swift @@ -11,7 +11,7 @@ class TempViewModel: ObservableObject { @Published var options: [String: [(String, Int)]] = [:] init() { - self.fetchPostDetail() +// self.fetchPostDetail() } func fetchPostDetail() { @@ -34,5 +34,6 @@ class TempViewModel: ObservableObject { options[key]!.append((newValue[0], Int(newValue[1])!)) } } + print(options) } }