UPGRADE YOUR SKILLS: Learn advanced Swift and SwiftUI on Hacking with Swift+! >>

SOLVED: How to organize ForEach Lists with NavigationLinks. Trying to group some departments and not others

Forums > Swift
@comeandtakeit99  

I have a model of pay rates that I am trying to translate into pay charts.

Here is the link to the GitHub code

The current Department Pay Rates page has navigation links to: "Sales", "Management", "Senior Management" and "Hospitality"

I want the Department Pay Rates page to change to the following: "Sales", "Management Departments" and "Hospitality"

I want the new "Management Departments" navigation link to connect to a new page of two navigation links -> "Management" & "Senior Management"

edit: I want the new "Management Departments" navigation link to connect to a new page that contains two pay charts, one above the other (scrollable): "Management" & "Senior Management" each chart labeled with a title.

Any ideas on how to make that change?

2      

@Hectorcrdna  

Hi, You could try adding a subDept property to your deptList struct and adding the "Management" and "Senior Management" depts to it.

struct DeptList: Identifiable {
    let id: UUID
    var deptName: String
    var rates: [YearlyRates]
    var subDept: [DeptList]

    init(id: UUID = UUID(), deptName: String, rates: [YearlyRates], subDept: [DeptList]) {
        self.id = id
        self.deptName = deptName
        self.rates = rates
        self.subDept = subDept
    }
}

extension DeptList {
    static let deptList: [DeptList] = [
    DeptList(deptName: "Sales", rates: [
        YearlyRates(year: 1, hourlyRate:
            DeptPayRates().sales[0]),
        YearlyRates(year: 2, hourlyRate:
            DeptPayRates().sales[1]),
        YearlyRates(year: 3, hourlyRate:
            DeptPayRates().sales[2]),
        YearlyRates(year: 4, hourlyRate:
            DeptPayRates().sales[3]),
        YearlyRates(year: 5, hourlyRate:
            DeptPayRates().sales[4]),
        YearlyRates(year: 6, hourlyRate:
            DeptPayRates().sales[5]),
        YearlyRates(year: 7, hourlyRate:
            DeptPayRates().sales[6]),
        YearlyRates(year: 8, hourlyRate:
            DeptPayRates().sales[7]),
        YearlyRates(year: 9, hourlyRate:
            DeptPayRates().sales[8]),
        YearlyRates(year: 10, hourlyRate:
            DeptPayRates().sales[9]),
        YearlyRates(year: 11, hourlyRate:
            DeptPayRates().sales[10])], subDept: []),
    DeptList(deptName: "Management Departments", rates: [], subDept: [DeptList(deptName: "Management", rates: [
        YearlyRates(year: 1, hourlyRate:
            DeptPayRates().management[0]),
        YearlyRates(year: 2, hourlyRate:
            DeptPayRates().management[1]),
        YearlyRates(year: 3, hourlyRate:
            DeptPayRates().management[2]),
        YearlyRates(year: 4, hourlyRate:
            DeptPayRates().management[3]),
        YearlyRates(year: 5, hourlyRate:
            DeptPayRates().management[4]),
        YearlyRates(year: 6, hourlyRate:
            DeptPayRates().management[5]),
        YearlyRates(year: 7, hourlyRate:
            DeptPayRates().management[6]),
        YearlyRates(year: 8, hourlyRate:
            DeptPayRates().management[7]),
        YearlyRates(year: 9, hourlyRate:
            DeptPayRates().management[8]),
        YearlyRates(year: 10, hourlyRate:
            DeptPayRates().management[9]),
        YearlyRates(year: 11, hourlyRate:
            DeptPayRates().management[10])], subDept: []),
    DeptList(deptName: "Senior Management", rates: [
        YearlyRates(year: 1, hourlyRate:
            DeptPayRates().seniorManagement[0]),
        YearlyRates(year: 2, hourlyRate:
            DeptPayRates().seniorManagement[1]),
        YearlyRates(year: 3, hourlyRate:
            DeptPayRates().seniorManagement[2]),
        YearlyRates(year: 4, hourlyRate:
            DeptPayRates().seniorManagement[3]),
        YearlyRates(year: 5, hourlyRate:
            DeptPayRates().seniorManagement[4]),
        YearlyRates(year: 6, hourlyRate:
            DeptPayRates().seniorManagement[5]),
        YearlyRates(year: 7, hourlyRate:
            DeptPayRates().seniorManagement[6]),
        YearlyRates(year: 8, hourlyRate:
            DeptPayRates().seniorManagement[7]),
        YearlyRates(year: 9, hourlyRate:
            DeptPayRates().seniorManagement[8]),
        YearlyRates(year: 10, hourlyRate:
            DeptPayRates().seniorManagement[9]),
        YearlyRates(year: 11, hourlyRate:
            DeptPayRates().seniorManagement[10])], subDept: [])]),
    DeptList(deptName: "Hospitality", rates: [
        YearlyRates(year: 1, hourlyRate:
            DeptPayRates().other[0]),
        YearlyRates(year: 2, hourlyRate:
            DeptPayRates().other[1]),
        YearlyRates(year: 3, hourlyRate:
            DeptPayRates().other[2]),
        YearlyRates(year: 4, hourlyRate:
            DeptPayRates().other[3]),
        YearlyRates(year: 5, hourlyRate:
            DeptPayRates().other[4]),
        YearlyRates(year: 6, hourlyRate:
            DeptPayRates().other[5]),
        YearlyRates(year: 7, hourlyRate:
            DeptPayRates().other[6]),
        YearlyRates(year: 8, hourlyRate:
            DeptPayRates().other[7]),
        YearlyRates(year: 9, hourlyRate:
            DeptPayRates().other[8]),
        YearlyRates(year: 10, hourlyRate:
            DeptPayRates().other[9]),
        YearlyRates(year: 11, hourlyRate:
            DeptPayRates().other[10])], subDept: [])
    ]
}

Then create a new "ManagementDepartmentsView" to loop over the subDept.

struct ManagementDepartmentsView: View {
    var dept: DeptList

    var body: some View {
        List {
            ForEach(dept.subDept, id: \.deptName) { dept in
                NavigationLink(destination: RateCardView(dept: dept)) {
                    Text(dept.deptName)
                        .bold()
                        .font(.headline)
                }
            }
        }
        .navigationTitle("Department Pay Rates")
    }
}

and inside the PayRateView ForEach add this conditional

if dept.deptName == "Management Departments" {
                    NavigationLink(destination: ManagementDepartmentsView(dept: dept)) {
                        Text(dept.deptName)
                            .bold()
                            .font(.headline)
                    }
                } else {
                    NavigationLink(destination: RateCardView(dept: dept)) {
                        Text(dept.deptName)
                            .bold()
                            .font(.headline)
                    }
                }

Hopefully thats what your looking for.

3      

@comeandtakeit99  

@Hectorcrdna

That works perfectly!

Unfortunately, I realized that I misworded my question/desired outcome... :/. Sorry!

What I should have said was:

I want the new "Management Departments" navigation link to connect to a new page that containts both the "Management" & "Senior Management" pay rate charts on the same page, Senior Management chart below the Management chart.

So after clicking on "Management Departments" the next page should not have any links. It should have two pay charts that you can scroll through. I have edited my original post in attempt to clarify for any others that may want to answer.

I'm not sure how to phrase that better, but I realize my explaination is a bit clunky. Does that make sense?

The following code only shows a Senior Management paychart. I don't know why the Management pay chart is not showing. Also, I haven't figured out how to have two titles, one for "Management" about the management pay chart and one for "Senior Management" above the senior management pay chart both on the same page.

struct ManagementDepartmentsView: View {
    var dept: DeptList = DeptList.deptList[1].subDept[0]
    var dept2: DeptList = DeptList.deptList[1].subDept[1]

    var body: some View {
        List {
            ForEach(dept.rates) { rate in
                HStack {
                    Text("Year \(rate.year)")
                    Spacer()
                    Text("$ \(rate.hourlyRate, specifier: "%.2f")")
                }
            }
            ForEach(dept2.rates) { rate in
                HStack {
                    Text("Year \(rate.year)")
                    Spacer()
                    Text("$ \(rate.hourlyRate, specifier: "%.2f")")
                }
            }
        }
        .navigationTitle("Department Pay Rates")
    }
}

2      

@Hectorcrdna  

Hi, It's all good, it happens, I think i understand what your trying to do and for that you would wrap each ForEach in it's own Section then giving it a title, one for "Management" and one for "Senior Management".

struct ManagementDepartmentsView: View {
    var dept: DeptList

    var body: some View {
        List {
            Section("Management") {
                ForEach(dept.subDept[0].rates) { rate in
                    HStack {
                        Text("Year \(rate.year)")
                        Spacer()
                        Text("$ \(rate.hourlyRate, specifier: "%.2f")")
                    }
                }
            }
            Section("Senior Management") {
                ForEach(dept.subDept[1].rates) { rate in
                    HStack {
                        Text("Year \(rate.year)")
                        Spacer()
                        Text("$ \(rate.hourlyRate, specifier: "%.2f")")
                    }
                }
            }
        }

        .navigationTitle("Department Pay Rates")
    }
}

2      

@comeandtakeit99  

Genius! Thank you!

2      

BUILD THE ULTIMATE PORTFOLIO APP Most Swift tutorials help you solve one specific problem, but in my Ultimate Portfolio App series I show you how to get all the best practices into a single app: architecture, testing, performance, accessibility, localization, project organization, and so much more, all while building a SwiftUI app that works on iOS, macOS and watchOS.

Get it on Hacking with Swift+

Sponsor Hacking with Swift and reach the world's largest Swift community!

Archived topic

This topic has been closed due to inactivity, so you can't reply. Please create a new topic if you need to.

All interactions here are governed by our code of conduct.

Swift breaks down barriers between ideas and apps, and I want to break down barriers to learning it. I’m proud to make hundreds of tutorials that are free to access, and I’ll keep doing that whatever happens. But if that’s a mission that resonates with you, please support it by becoming a HWS+ member. It’ll bring you lots of benefits personally, but it also means you’ll directly help people all over the world to learn Swift by freeing me up to share more of my knowledge, passion, and experience for free! Become Hacking with Swift+ member.
Click here to visit the Hacking with Swift store >>
 
Unknown user

You are not logged in

Log in or create account
 

Link copied to your pasteboard.