In my web application, i faces some problems.
When i enter my application it shows like (1.png) . After login as an admin it shows like (adminButton.png) . when i click on the admin panel it goes another views like(admin.png) .But i want to view this on the mainview with applayout menu.
Mainview.class is containing applayout menu and i set homeUi.class in the appLayout for seeing first when i load my browser. When i set my AdminPanel layout to the mainview it seems like(2.png). it overlaps with the previous one. But i want to remove first content and set other views here.
As a beginner it seems hard to me to set routes and layouts. How can i do that.
Thanks in advance.
My classes are ;
MainView.Class:
@Viewport(“width = device-width, minimum-scale=1.0, initial-scale =1.0, user-scalable=yes”)
public class MainView extends VerticalLayout implements RouterLayout {
private HomeUi homeUi = new HomeUi();
private AppLayout appLayout = new AppLayout();
private AppLayoutMenu menu = appLayout.createMenu();
private Tabs tabs = new Tabs();
private HorizontalLayout routerLayout = new HorizontalLayout();
public MainView() {
headerDiv();
appLayout.setContent(homeUi);
add(appLayout);
add(routerLayout);
}
private void headerDiv() {
menu.addMenuItems(
new AppLayoutMenuItem(VaadinIcon.HOME.create(), "Home", "homeUi"),
new AppLayoutMenuItem(VaadinIcon.COINS.create(), "Live Scores"),
new AppLayoutMenuItem(VaadinIcon.LIST_SELECT.create(), "Schedule"),
new AppLayoutMenuItem(VaadinIcon.RECORDS.create(), "Archives"),
new AppLayoutMenuItem(VaadinIcon.NEWSPAPER.create(), "News"),
new AppLayoutMenuItem(VaadinIcon.TROPHY.create(), "Series"),
new AppLayoutMenuItem(VaadinIcon.USER_CARD.create(), "Team"),
new AppLayoutMenuItem(VaadinIcon.SIGN_OUT.create(), "Log Out", e -> AccessControlFactory.getInstance().createAccessControl().signOut()));
}
@Route
@RouteAlias(value = “homeUi”,layout = MainView.class)
@RouteAlias(value = “”,layout = MainView.class)
public class HomeUi extends VerticalLayout {
private ApiService apiService = new ApiService();
private VerticalLayout recentTimeLineLayout = new VerticalLayout();
private VerticalLayout topTimeLineLayout = new VerticalLayout();
private HorizontalLayout dividerLayout = new HorizontalLayout();
private Footer footer = new Footer();
public HomeUi() {}
}
@StyleSheet(“styles.css”)
public class AdminPanel extends VerticalLayout implements RouterLayout {
public static final String VIEW_NAME = “Admin Panel”;
private Button insertBallButton = new Button("Insert Ball");
private Button insertCoachButton = new Button("Insert Coach");
private Button insertGroundButton = new Button("Insert Ground");
private Button insertMatchButton = new Button("Insert Match");
private Button insertPlayerButton = new Button("Insert Player");
private Button insertTeamButton = new Button("Insert Team");
private Button homeButton = new Button("Home");
private HorizontalLayout navBar = new HorizontalLayout();
private HorizontalLayout nav = new HorizontalLayout();
private Button label = new Button("GameStats");
public AdminPanel() {}
}
@Route(value = "insertball", layout = AdminPanel.class)
@StyleSheet("styles.css")
@Secured(AccessControl.ADMIN_ROLE_NAME)
public class InsertBall extends VerticalLayout {
public InsertBall() {}
}
