ProductInfo 데이터🔄뷰 바인딩

APIService/Sources/ProductInfoAPI/ProductInfoService.swift

@@ -12,8 +12,8 @@ import Network
 // MARK: - ProductInfoServiceRepresentable
 
 public protocol ProductInfoServiceRepresentable {
-  func fetchProduct() async throws -> ProductDetail
-  func fetchProductPrice() async throws -> [ProductDetail]
+  func fetchProduct() async throws -> DetailProduct
+  func fetchProductPrice() async throws -> [DetailProduct]
 }
 
 // MARK: - ProductInfoService
@@ -31,30 +31,31 @@ public struct ProductInfoService {
 // MARK: ProductInfoServiceRepresentable
 
 extension ProductInfoService: ProductInfoServiceRepresentable {
-  public func fetchProduct() async throws -> ProductDetail {
+  public func fetchProduct() async throws -> DetailProduct {
     let response: ProductDetailResponse = try await network.request(
       with: ProductInfoEndPoint.fetchProduct(productID)
     )
-    return ProductDetail(dto: response)
+    return DetailProduct(dto: response)
   }
 
-  public func fetchProductPrice() async throws -> [ProductDetail] {
+  public func fetchProductPrice() async throws -> [DetailProduct] {
     let response: [ProductDetailResponse] = try await network.request(
       with: ProductInfoEndPoint.fetchPrices(productID)
     )
-    return response.map(ProductDetail.init(dto:))
+    return response.map(DetailProduct.init(dto:))
   }
 }
 
-private extension ProductDetail {
+private extension DetailProduct {
   init(dto: ProductDetailResponse) {
     self.init(
       id: dto.id,
       imageURL: dto.img,
       price: dto.price,
       name: dto.name,
       promotion: dto.tag,
-      convenienceStore: dto.store
+      convenienceStore: dto.store,
+      date: dto.date
     )
   }
 }

APIService/Sources/ProductInfoAPI/Responses/ProductDetailResponse.swift

@@ -15,5 +15,6 @@ struct ProductDetailResponse: Decodable {
   let store: ConvenienceStore
   let tag: Promotion
   let proinfo: Int
+  let date: String
   let id: Int
 }

APIService/Sources/ProductInfoAPISupport/Mocks/ProductInfoPriceResponse.json

@@ -2,7 +2,7 @@
   {
     "name": "힛더티)슈퍼말차초코콘150ML",
     "img": "https://image.woodongs.com/imgsvr/item/GD_8809490180818_002.jpg",
-    "price": 2500,
+    "price": 2400,
     "store": "GS25",
     "tag": "2+1",
     "proinfo": 0,
@@ -12,7 +12,7 @@
   {
     "name": "힛더티)슈퍼말차초코콘150ML",
     "img": "http://gs25appimg.gsretail.com/imgsvr/item/GD_8809490180818_001.jpg",
-    "price": 2500,
+    "price": 2100,
     "store": "GS25",
     "tag": "2+1",
     "proinfo": 0,
@@ -32,7 +32,7 @@
   {
     "name": "힛더티)슈퍼말차초코콘150ML",
     "img": "http://gs25appimg.gsretail.com/imgsvr/item/GD_8809490180818_001.jpg",
-    "price": 2500,
+    "price": 2600,
     "store": "GS25",
     "tag": "2+1",
     "proinfo": 0,
@@ -42,7 +42,7 @@
   {
     "name": "힛더티)슈퍼말차초코콘150ML",
     "img": "http://gs25appimg.gsretail.com/imgsvr/item/GD_8809490180818_001.jpg",
-    "price": 2500,
+    "price": 3000,
     "store": "GS25",
     "tag": "2+1",
     "proinfo": 0,
@@ -52,7 +52,7 @@
   {
     "name": "힛더티)슈퍼말차초코콘150ML",
     "img": "http://gs25appimg.gsretail.com/imgsvr/item/GD_8809490180818_001.jpg",
-    "price": 2500,
+    "price": 2900,
     "store": "GS25",
     "tag": "2+1",
     "proinfo": 0,

Entity/Sources/Entity/ProductDetail.swift → Entity/Sources/Entity/DetailProduct.swift

@@ -1,5 +1,5 @@
 //
-//  ProductDetail.swift
+//  DetailProduct.swift
 //
 //
 //  Created by 김응철 on 2/6/24.
@@ -8,7 +8,7 @@
 import Foundation
 
 /// 편의점 행사 제품에 대한 Entity Model입니다.
-public struct ProductDetail: Identifiable {
+public struct DetailProduct: Identifiable, Equatable {
   /// 제품 고유 Identifier
   public let id: Int
 
@@ -27,6 +27,9 @@ public struct ProductDetail: Identifiable {
   /// 편의점
   public let convenienceStore: ConvenienceStore
 
+  /// 날짜
+  public let date: String
+
   // TODO: 카테고리 상수 추가하기
 
   public init(
@@ -35,13 +38,25 @@ public struct ProductDetail: Identifiable {
     price: Int,
     name: String,
     promotion: Promotion,
-    convenienceStore: ConvenienceStore
+    convenienceStore: ConvenienceStore,
+    date: String
   ) {
     self.id = id
     self.imageURL = imageURL
     self.price = price
     self.name = name
     self.promotion = promotion
     self.convenienceStore = convenienceStore
+    self.date = date
+  }
+
+  public init() {
+    id = 0
+    imageURL = nil
+    price = 0
+    name = ""
+    promotion = .buyOneGetOneFree
+    convenienceStore = ._7Eleven
+    date = ""
   }
 }

PyeonHaeng-iOS.xcodeproj/project.pbxproj

@@ -49,7 +49,7 @@
 		E57F2AA42B7717EA00E12B3D /* ProductInfoAPI in Frameworks */ = {isa = PBXBuildFile; productRef = E57F2AA32B7717EA00E12B3D /* ProductInfoAPI */; settings = {ATTRIBUTES = (Required, ); }; };
 		E57F2AA62B7717EA00E12B3D /* ProductInfoAPISupport in Frameworks */ = {isa = PBXBuildFile; productRef = E57F2AA52B7717EA00E12B3D /* ProductInfoAPISupport */; };
 		E57F2AA82B774CA700E12B3D /* ProductInfoDependency.swift in Sources */ = {isa = PBXBuildFile; fileRef = E57F2AA72B774CA700E12B3D /* ProductInfoDependency.swift */; };
-		E5F2EC402B637D4A00EE0838 /* ProductInfoHeader.swift in Sources */ = {isa = PBXBuildFile; fileRef = E5F2EC3F2B637D4A00EE0838 /* ProductInfoHeader.swift */; };
+		E5F2EC402B637D4A00EE0838 /* ProductInfoDetailView.swift in Sources */ = {isa = PBXBuildFile; fileRef = E5F2EC3F2B637D4A00EE0838 /* ProductInfoDetailView.swift */; };
 		E5F2EC432B648F5B00EE0838 /* Int+.swift in Sources */ = {isa = PBXBuildFile; fileRef = E5F2EC422B648F5B00EE0838 /* Int+.swift */; };
 		E5F2EC452B64926100EE0838 /* PromotionTagView.swift in Sources */ = {isa = PBXBuildFile; fileRef = E5F2EC442B64926100EE0838 /* PromotionTagView.swift */; };
 /* End PBXBuildFile section */
@@ -106,7 +106,7 @@
 		E50584522B763C8C002FDACF /* ProductInfoViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ProductInfoViewModel.swift; sourceTree = "<group>"; };
 		E5462C652B65677B00E9FDF2 /* PromotionTag.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PromotionTag.swift; sourceTree = "<group>"; };
 		E57F2AA72B774CA700E12B3D /* ProductInfoDependency.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ProductInfoDependency.swift; sourceTree = "<group>"; };
-		E5F2EC3F2B637D4A00EE0838 /* ProductInfoHeader.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ProductInfoHeader.swift; sourceTree = "<group>"; };
+		E5F2EC3F2B637D4A00EE0838 /* ProductInfoDetailView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ProductInfoDetailView.swift; sourceTree = "<group>"; };
 		E5F2EC422B648F5B00EE0838 /* Int+.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "Int+.swift"; sourceTree = "<group>"; };
 		E5F2EC442B64926100EE0838 /* PromotionTagView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PromotionTagView.swift; sourceTree = "<group>"; };
 /* End PBXFileReference section */
@@ -236,7 +236,7 @@
 				E57F2AA72B774CA700E12B3D /* ProductInfoDependency.swift */,
 				BA28F18A2B6155BD0052855E /* ProductInfoView.swift */,
 				E50584522B763C8C002FDACF /* ProductInfoViewModel.swift */,
-				E5F2EC3F2B637D4A00EE0838 /* ProductInfoHeader.swift */,
+				E5F2EC3F2B637D4A00EE0838 /* ProductInfoDetailView.swift */,
 				E50176252B6A204F0098D1BE /* ProductInfoLineGraphView.swift */,
 			);
 			path = ProductInfoScene;
@@ -515,6 +515,7 @@
 			buildActionMask = 2147483647;
 			files = (
 				BAE159DA2B65FC35002DCF94 /* HomeProductListView.swift in Sources */,
+				E5F2EC402B637D4A00EE0838 /* ProductInfoDetailView.swift in Sources */,
 				E5F2EC402B637D4A00EE0838 /* ProductInfoHeader.swift in Sources */,
 				BA402F7E2B85E31800E86AAD /* ConvenienceSelectBottomSheetView.swift in Sources */,
 				BA28F1852B6155810052855E /* OnboardingView.swift in Sources */,

PyeonHaeng-iOS/Sources/Scenes/ProductInfoScene/ProductInfoDetailView.swift

@@ -0,0 +1,109 @@
+//
+//  ProductInfoDetailView.swift
+//  PyeonHaeng-iOS
+//
+//  Created by 김응철 on 2024/1/26.
+//
+
+import DesignSystem
+import Entity
+import SwiftUI
+
+// MARK: - ProductInfoDetailView
+
+struct ProductInfoDetailView<ViewModel>: View where ViewModel: ProductInfoViewModelRepresentable {
+  @EnvironmentObject private var viewModel: ViewModel
+
+  var body: some View {
+    VStack(spacing: 8.0) {
+      ImageView(product: viewModel.state.product)
+      DetailView(product: viewModel.state.product)
+    }
+    .padding(.bottom, 16.0)
+  }
+}
+
+// MARK: - ImageView
+
+private struct ImageView: View {
+  let product: DetailProduct
+
+  var body: some View {
+    AsyncImage(url: product.imageURL) { image in
+      image
+        .resizable()
+        .scaledToFit()
+    } placeholder: {
+      // TODO: 편행 기본 이미지 추가
+      ProgressView()
+    }
+    .frame(maxWidth: .infinity, maxHeight: Metrics.imageHeight)
+    .padding(.top, Metrics.imagePaddingTop)
+    .padding(.bottom, Metrics.imagePaddingBottom)
+  }
+}
+
+// MARK: - DetailView
+
+private struct DetailView: View {
+  let product: DetailProduct
+
+  var body: some View {
+    Text(product.name)
+      .font(.h3)
+      .foregroundStyle(Color.gray900)
+      .frame(maxWidth: .infinity, alignment: .leading)
+    HStack(alignment: .bottom) {
+      VStack(alignment: .leading, spacing: .zero) {
+        Text("행사 진행 편의점")
+          .font(.c2)
+          .padding(.top, Metrics.textPaddingTop)
+        image(for: product.convenienceStore)
+          .padding(.top, Metrics.convenienceStoreLogoPaddingTop)
+      }
+      Spacer()
+      HStack(spacing: Metrics.horizontalSpacing) {
+        PromotionTagView(promotionTag: promotionTag(for: product.promotion))
+        Text("개당")
+          .font(.c1)
+        Text("\(Int(product.price / 2).formatted())원")
+          .font(.h2)
+          .frame(maxHeight: 38.0)
+      }
+    }
+    .foregroundStyle(Color.gray900)
+  }
+
+  func promotionTag(for promotion: Promotion) -> PromotionTag {
+    switch promotion {
+    case .allItems:
+      .none
+    case .buyOneGetOneFree:
+      .onePlus
+    case .buyTwoGetOneFree:
+      .twoPlus
+    }
+  }
+
+  func image(for convenienceStore: ConvenienceStore) -> Image {
+    switch convenienceStore {
+    case .cu: .cu
+    case .gs25: .gs25
+    case ._7Eleven: ._7Eleven
+    case .emart24: .emart24
+    case .ministop: .ministop
+    }
+  }
+}
+
+// MARK: - Metrics
+
+private enum Metrics {
+  static let imageHeight: CGFloat = 257.0
+  static let imagePaddingTop: CGFloat = 44.0
+  static let imagePaddingBottom: CGFloat = 40.0
+
+  static let textPaddingTop: CGFloat = 16.0
+  static let convenienceStoreLogoPaddingTop: CGFloat = 2.0
+  static let horizontalSpacing: CGFloat = 8.0
+}