=load(
  local!timeframe: 1,
  local!startWeek: now() - 28,
  local!endWeek: now(),
  local!startQuarter,
  local!endQuarter,
  local!startYear,
  local!endYear,

  a!dashboardLayout(
    firstColumnContents: {
      a!sectionLayout(
        label: "Report Navigation Sample Case",
        firstColumnContents: {
          a!buttonLayout(
            secondaryButtons: {
              a!buttonWidget(
                label: "Weekly",
                style: "NORMAL",
                value: local!timeframe: 1,
                saveInto: local!timeframe
              ),
              a!buttonWidget(
                label: "Quarterly",
                style: "NORMAL",
                value: local!timeframe: 2,
                saveInto: local!timeframe
              )
            }
          )
        }
      ),
          
      if(local!timeframe = 1,
        {a!dateField(
          label: "Start- / End Date",
          labelPosition: "ABOVE",
          value: local!startWeek,
          saveInto: local!startWeek
        ),
        a!dateField(
          label: "HIDDEN",
          labelPosition: "COLLAPSED",
          value: local!endWeek,
          saveInto: local!endWeek,
          validations: if(local!endWeek < local!startWeek, {"End date cannot be before start date."}, null)
        )},
        {}
      ),
      
      if(local!timeframe = 2,
        {a!sectionLayout(
          firstColumnContents: {
            a!dropdownField(
              label: "Start Quarter",
              placeholderLabel: "---",
              choiceLabels: {"1st Quarter", "2nd Quarter", "3rd Quarter", "4th Quarter"},
              choiceValues: {"1", "2", "3", "4"},
              value: local!startQuarter,
              saveInto: local!startQuarter
            ),
            a!dropdownField(
              label: "End Quarter",
              placeholderLabel: "---",
              choiceLabels: {"1st Quarter", "2nd Quarter", "3rd Quarter", "4th Quarter"},
              choiceValues: {"1", "2", "3", "4"},
              value: local!endQuarter,
              saveInto: local!endQuarter
            )
          },
          secondColumnContents: {
            a!dropdownField(
              label: "Start Year",
              placeholderLabel: "---",
              choiceLabels: {"2016", "2017", "2018", "2019", "2020"},
              choiceValues: {"1", "2", "3", "4", "5"},
              value: local!startYear,
              saveInto: local!startYear
            ),
            a!dropdownField(
              label: "End Year",
              placeholderLabel: "---",
              choiceLabels: {"2016", "2017", "2018", "2019", "2020"},
              choiceValues: {"1", "2", "3", "4", "5"},
              value: local!endYear,
              saveInto: local!endYear
            )
          }
        )},
        {}
      )
      
    } 
  )
)