Challenge: Configure Layouts for a Dashboard Site

Problem statement

Websites can have many different pages that can use a different layout. For instance, an admin dashboard might have a login page that should display a header, main content, and footer, while the dashboard should also have a sidebar with a navigation menu.

Challenge

This project already includes page and layout components. Your task is to create two routes in the src/router/index.js file, one / for the Dashboard component and one /login for the Login component.

Each route should be configured with the layout property that specifies which layout should be used. The dashboard should use the dashboard layout and the login page should use the auth layout.

Update the src/layout/Layout.vue component to return the appropriate layout component based on the $route.meta.layout value specified in the src/router/index.js file. The meta.layout value set to dashboard should return the DashboardLayout component, while auth should return the AuthLayout component. If no meta layout property is provided, the DashboardLayout component should be used by default.