//
//  ContentOrderConfirmDialogView.swift
//  SodaLive
//
//  Created by klaus on 2023/08/13.
//

import SwiftUI
import Kingfisher

struct ContentOrderConfirmDialogView: View {
    
    @Binding var isShowing: Bool
    
    let audioContent: GetAudioContentDetailResponse
    let orderType: OrderType
    let isOnlyRental: Bool
    let onClickConfirm: () -> Void
    
    var body: some View {
        ZStack {
            Color
                .black
                .opacity(0.7)
                .ignoresSafeArea()
            
            VStack(spacing: 0) {
                Text("구매확인")
                    .font(.custom(Font.bold.rawValue, size: 18.3))
                    .foregroundColor(Color.grayee)
                
                HStack(spacing: 11) {
                    ZStack(alignment: .topLeading) {
                        KFImage(URL(string: audioContent.coverImageUrl))
                            .resizable()
                            .frame(width: 88.7, height: 88.7, alignment: .center)
                            .clipped()
                            .cornerRadius(4)
                    }
                    
                    VStack(alignment: .leading, spacing: 0) {
                        Text(audioContent.themeStr)
                            .font(.custom(Font.medium.rawValue, size: 8))
                            .foregroundColor(Color(hex: "3bac6a"))
                            .padding(2.3)
                            .background(Color(hex: "28312b"))
                            .cornerRadius(2)
                        
                        Text(audioContent.title)
                            .font(.custom(Font.bold.rawValue, size: 11.3))
                            .foregroundColor(Color.grayd2)
                            .padding(.top, 2)
                        
                        HStack(spacing: 4.3) {
                            KFImage(URL(string: audioContent.creator.profileImageUrl))
                                .cancelOnDisappear(true)
                                .resizable()
                                .frame(width: 13.3, height: 13.3)
                                .clipShape(Circle())
                            
                            Text(audioContent.creator.nickname)
                                .font(.custom(Font.medium.rawValue, size: 10))
                                .foregroundColor(Color.gray77)
                        }
                        .padding(.top, 6.7)
                        
                        Text(audioContent.duration)
                            .font(.custom(Font.medium.rawValue, size: 11))
                            .foregroundColor(Color.gray77)
                            .padding(.top, 6.7)
                    }
                    
                    Spacer()
                }
                .padding(8)
                .background(Color.black)
                .cornerRadius(5.3)
                .padding(.top, 21.3)
                
                Text("콘텐츠를 \(orderType == .RENTAL ? "대여" : "소장")하시겠습니까?")
                    .font(.custom(Font.medium.rawValue, size: 13.3))
                    .foregroundColor(Color.grayee)
                    .fixedSize(horizontal: false, vertical: true)
                    .multilineTextAlignment(.center)
                    .padding(.top, 13.3)
                
                if UserDefaults.int(forKey: .userId) != 17958 {
                    Text("아래 캔이 차감됩니다.")
                        .font(.custom(Font.medium.rawValue, size: 13.3))
                        .foregroundColor(Color.grayee)
                        .fixedSize(horizontal: false, vertical: true)
                        .multilineTextAlignment(.center)
                        .padding(.top, 13.3)
                }
                
                HStack(spacing: 2.7) {
                    Spacer()
                
                    if UserDefaults.int(forKey: .userId) != 17958 {
                        Image("ic_can")
                            .resizable()
                            .frame(width: 16.7, height: 16.7)
                        
                        if orderType == .RENTAL {
                            Text("\(isOnlyRental ? audioContent.price : Int(ceil(Double(audioContent.price) * 0.6)))")
                                .font(.custom(Font.bold.rawValue, size: 13.3))
                                .foregroundColor(Color.grayee)
                        } else {
                            Text("\(audioContent.price)")
                                .font(.custom(Font.bold.rawValue, size: 13.3))
                                .foregroundColor(Color.grayee)
                        }
                    } else {
                        if orderType == .RENTAL {
                            Text("\(isOnlyRental ? audioContent.price * 110 : Int(ceil(Double(audioContent.price) * 0.6)) * 110)원")
                                .font(.custom(Font.bold.rawValue, size: 13.3))
                                .foregroundColor(Color.grayee)
                        } else {
                            Text("\(audioContent.price * 110)원")
                                .font(.custom(Font.bold.rawValue, size: 13.3))
                                .foregroundColor(Color.grayee)
                        }
                    }
                    
                    Spacer()
                }
                .padding(.vertical, 13.3)
                .background(Color.gray33)
                .cornerRadius(6.7)
                .overlay(
                    RoundedRectangle(cornerRadius: CGFloat(6.7))
                        .stroke(lineWidth: 1)
                        .foregroundColor(Color.gray97)
                )
                .padding(.top, 13.3)
                
                HStack(spacing: 12) {
                    Text("취소")
                        .font(.custom(Font.bold.rawValue, size: 18.3))
                        .foregroundColor(Color.button)
                        .padding(.vertical, 15.7)
                        .frame(maxWidth: .infinity)
                        .contentShape(Rectangle())
                        .overlay(
                            RoundedRectangle(cornerRadius: CGFloat(10))
                                .stroke(lineWidth: 1)
                                .foregroundColor(Color.button)
                        )
                        .onTapGesture { isShowing = false }
                    
                    Text("확인")
                        .font(.custom(Font.bold.rawValue, size: 18.3))
                        .foregroundColor(.white)
                        .padding(.vertical, 15.7)
                        .frame(maxWidth: .infinity)
                        .contentShape(Rectangle())
                        .background(Color.button)
                        .cornerRadius(10)
                        .onTapGesture {
                            onClickConfirm()
                            isShowing = false
                        }
                }
                .padding(.top, 21.3)
            }
            .padding(.horizontal, 13.3)
            .padding(.top, 26.7)
            .padding(.bottom, 16.7)
            .background(Color.gray22)
            .cornerRadius(10)
            .padding(.horizontal, 20)
        }
    }
}