sodalive-ios/SodaLive/Sources/Content/Main/V2/Content/ContentMainTabRankContentVi...

157 lines
5.8 KiB
Swift

//
// ContentMainTabRankContentView.swift
// SodaLive
//
// Created by klaus on 2/20/25.
//
import SwiftUI
import Kingfisher
struct ContentMainTabRankContentView: View {
let rows = [
GridItem(.fixed(60), alignment: .leading),
GridItem(.fixed(60), alignment: .leading),
GridItem(.fixed(60), alignment: .leading)
]
let title: String
let isMore: Bool
let onClickMore: () -> Void
let sortList: [String]
let onClickSort: (String) -> Void
let contentList: [GetAudioContentRankingItem]
@State private var selectedSort = ""
var body: some View {
VStack(spacing: 13.3) {
HStack(spacing: 0) {
Text(title)
.font(.custom(Font.bold.rawValue, size: 18.3))
.foregroundColor(Color(hex: "eeeeee"))
Spacer()
if isMore {
Image("ic_forward")
.onTapGesture { onClickMore() }
}
}
.padding(.horizontal, 13.3)
if !sortList.isEmpty {
ContentMainRankingSortView(
sorts: sortList,
selectSort: {
selectedSort = $0
onClickSort($0)
},
selectedSort: $selectedSort
)
}
ScrollView(.horizontal, showsIndicators: false) {
LazyHGrid(rows: rows, spacing: 13.3) {
ForEach(0..<contentList.count, id: \.self) { index in
let content = contentList[index]
HStack(spacing: 0) {
KFImage(URL(string: content.coverImageUrl))
.cancelOnDisappear(true)
.downsampling(
size: CGSize(
width: 60,
height: 60
)
)
.resizable()
.frame(width: 60, height: 60)
.cornerRadius(2.7)
Text("\(index + 1)")
.font(.custom(Font.bold.rawValue, size: 16.7))
.foregroundColor(.button)
.padding(.horizontal, 12)
VStack(alignment: .leading, spacing: 8) {
Text(content.title)
.lineLimit(2)
.font(.custom(Font.medium.rawValue, size: 13.3))
.foregroundColor(.grayd2)
Text(content.creatorNickname)
.font(.custom(Font.medium.rawValue, size: 11))
.foregroundColor(.gray77)
}
}
.frame(maxWidth: screenSize().width * 0.66, alignment: .leading)
.contentShape(Rectangle())
.onTapGesture {
AppState
.shared
.setAppStep(step: .contentDetail(contentId: content.contentId))
}
}
}
.padding(.horizontal, 13.3)
.frame(height: 207)
}
}
.onAppear {
if !sortList.isEmpty {
selectedSort = sortList[0]
}
}
}
}
#Preview {
ContentMainTabRankContentView(
title: "인기 단편",
isMore: true,
onClickMore: {},
sortList: ["매출", "댓글", "좋아요"],
onClickSort: { _ in },
contentList: [
GetAudioContentRankingItem(
contentId: 1,
title: "안녕하세요 오늘은 커버곡을 들려드릴께요....안녕하세요 오늘은 커버곡을 들려드릴께요....",
coverImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png",
themeStr: "커버곡",
price: 100,
duration: "00:30:20",
creatorId: 1,
creatorNickname: "유저1",
creatorProfileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png"
),
GetAudioContentRankingItem(
contentId: 2,
title: "안녕하세요 오늘은 커버곡을 들려드릴께요....",
coverImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png",
themeStr: "커버곡",
price: 0,
duration: "00:30:20",
creatorId: 2,
creatorNickname: "유저2",
creatorProfileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png"
),
GetAudioContentRankingItem(
contentId: 3,
title: "안녕하세요 오늘은 커버곡을 들려드릴께요....안녕하세요 오늘은 커버곡을 들려드릴께요....",
coverImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png",
themeStr: "커버곡",
price: 50,
duration: "00:30:20",
creatorId: 3,
creatorNickname: "유저3",
creatorProfileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png"
)
]
)
}