So I am getting a route not found error from an Aurelia application where I have a wizard that is using a child router for each of the steps in it.
It is possible that the user could stop midway through the wizard process and then need to navigate back to the wizard later. I want to be able to navigate the user back to the whatever the current step is. i am persisting the current step in a db.
I have the routing working where the user starts at step 1 and can progress through each step. It is when I try to navigate to the current step where I get the issue.
For reference purposes, here is my main app router config
configureRouter(config, router) {
config.title = 'CoQC Builder';
config.addAuthorizeStep(AuthorizeStep);
config.map([
{ route: ['', 'home'], name: 'home', auth:true, moduleId: 'home/home', nav: true, title: 'Home', settings:{ icon:'fa fa-home',id:0,isHomePage:true, parentId:null,hasChildren:false,isTask:false,isDialogLink:false} },
{ route: 'home', name: 'tasks', auth:true, moduleId: 'home/home', nav: true, title: 'Tasks', settings:{icon:'fa fa-list',id:1,isHomePage:false, parentId:null,hasChildren:false,isTask:true,isDialogLink:false} },
{ route: 'home-fae', name: 'faehome', auth:true, moduleId: 'home/home-fae', nav: false, title: 'FAE Home', settings:{icon:'fa fa-list',id:12,isHomePage:true, parentId:null,hasChildren:false,isTask:true,isDialogLink:false} },
{ route: 'home-admin', name: 'adminhome', auth:true, moduleId: 'home/home-admin', nav: false, title: 'Admin Home', settings:{icon:'fa fa-list',id:13,isHomePage:true, parentId:null,hasChildren:false,isTask:true,isDialogLink:false} },
{ route: 'home-coqc', name: 'coqchome', auth:true, moduleId: 'home/home-coqc', nav: false, title: 'COQC Home', settings:{icon:'fa fa-list',id:14,isHomePage:true, parentId:null,hasChildren:false,isTask:true,isDialogLink:false} },
{ route: 'home-qa', name: 'qahome', auth:true, moduleId: 'home/home-qa', nav: false, title: 'QA Home', settings:{icon:'fa fa-list',id:15, parentId:null,isHomePage:true,hasChildren:false,isTask:true,isDialogLink:false} },
{ route: 'customer/:id', name: 'customer',auth:true, moduleId: 'customer/customer',href:"customer" ,nav: true, title: 'Customers', settings:{icon:'fa fa-users',id:2,parentId:null,hasChildren:true,isTask:false,isDialogLink:false} },
{ route: 'customer/search', name: 'mycustomers',auth:true, moduleId: 'Customer/customer', nav: true, title: 'Search Customers', settings:{icon:'fa fa-search',id:4,parentId:2,hasChildren:false,isTask:false,isDialogLink:false} },
{ route: 'customer/my', name: 'customers',auth:true, moduleId: 'customer/customer', nav: true, title: 'My Customers', settings:{icon:'fa fa-th-large',id:5,parentId:2,hasChildren:false,isTask:false,isDialogLink:true} },
{ route: 'coqc/search', name: 'coqc-search',auth:true, moduleId: 'search/search', nav: true, title: 'CoQC Search', settings:{icon:'fa fa-search',id:11, parentId:null,hasChildren:false,isTask:false,isDialogLink:false} },
{ route: 'gcoqclibrary', name: 'gcoqclibrary',auth:true, moduleId: 'gcoqclibrary', nav: true, title: 'gCoQC Library', settings:{icon:'fa fa-suitcase',id:6, parentId:null,hasChildren:false,isTask:false,isDialogLink:false} },
{ route: 'help', name: 'help', moduleId: 'help',auth:true, nav: true, title: 'Help/FAQ ', settings:{icon:'fa fa-question-circle',id:7, parentId:null,hasChildren:false,isTask:false,isDialogLink:false} },
{ route: 'feeds', name: 'feeds', moduleId: 'feeds',auth:true, nav: true, title: 'My Feeds', settings:{icon:'fa fa-feed',id:8, parentId:null,hasChildren:false,isTask:false,isDialogLink:false} },
{ route: 'user-profile', name: 'user-profile',auth:true, moduleId: 'user-profile', nav: true, title: 'User Profile', settings:{icon:'fa fa-user',id:9, parentId:null,hasChildren:false,isTask:false,isDialogLink:false} },
{ route: 'settings', name: 'settings',auth:true, moduleId: 'settings', nav: true, title: 'Settings', settings:{icon:'fa fa-cog',id:10, parentId:null,hasChildren:false,isTask:false,isDialogLink:false}} ,
{ route: 'coqc/wizard',auth:true, name: 'coqc-wizard', moduleId: 'wizard/wizard', nav: true, title: 'CoQC Wizard', settings:{icon:'fa fa-cog',id:10, parentId:null,hasChildren:false,isTask:false,isDialogLink:false} }
]);
config.mapUnknownRoutes({ route: "id_token*token", moduleId: "home/home", nav: false, title: "home" });
this.router = router;
}
Here is the configuration for the child router:
configureRouter(config, router) {
config.title = 'wiz router';
config.map(
{ route: ["","/",":id/step1"],name:"wizard-step1",nav: true, moduleId: "./wizard-step1", href:"#/coqc-wizard/wizard-step1/",title: "Step 1: Format & Customer Selection", settings:{index:0, menu:"./wizard-step1-nav", step:1,formats:['PDF','EXCEL','XML','CSV',null], next:[{format:'PDF',index:1},{format:'Excel',index:1} ,{format:'XML',index:2},{format:'CSV',index:2}]}},
{ route: [":id/step2"],name:"wizard-step2", moduleId: "./wizard-step2", nav: true,href:"#/coqc-wizard/wizard-step2/", title: "Step 2: Format Setup", settings:{index:1, menu:"./wizard-step2-nav", step:2,formats:['PDF','EXCEL'],next:[{format:'PDF',index:2},{format:'Excel',index:2}],previous:[{format:'PDF',index:0},{format:'EXCEL',index:0}]} },
{ route: [":id/step3"],name:"wizard-step3", moduleId: "./wizard-step3", nav: true,href:"#/coqc-wizard/wizard-step3/", title: "Step 3", settings:{index:2, menu:"./wizard-step3-nav", step:3,formats:['PDF','EXCEL','XML','CSV'], next:[{format:'PDF',index:3},{format:'EXCEL',index:3} ,{format:'XML',index:3},{format:'CSV',index:3}],previous:[{format:'PDF',index:1},{format:'EXCEL',index:1} ,{format:'XML',index:0},{format:'CSV',index:0}]} },
{ route: [":id/step4"],name:"wizard-step4", moduleId: "./wizard-step4", nav: true,href:"#/coqc-wizard/wizard-step4/", title: "Step 4", settings:{index:3, menu:"./wizard-step4-nav", step:4,formats:['PDF','EXCEL','XML','CSV'], next:[{format:'PDF',index:1},{format:'EXCEL',index:1} ,{format:'XML',index:2},{format:'CSV',index:2}]} },
{ route: [":id/currentStep"],name:"wizard-nav", nav: false, moduleId: "./wizard-nav", title: "Wizard Nav"}
);
this.router = router;
}
The plan is to have the user navigate to the :id/currentStep route when they have an in progress wizard. The this route will then query the database for the current step that and then redirect the user to the correct step with the following code:
export class WizardNavigation{
constructor(templateService,parent){
this.templateService = templateService;
this.parent = parent;
}
activate(params){
///Logic to determine what step user is on
let routename = "wizard-step3";//just an example
///
this.parent.router.navigateToRoute(routename, {id:params.id});
}
}
When the this.parent.router.navigateToRoute method gets executed, I get an error from aurelia router saying it cannot find the route. I have tried variations using the this.parent.router.navigate method. I have also tried passing in the entire path(Example: "#/coqc/wizard/9/step2") and none of these have worked.
Any help/guidance on what I might be doing wrong and what corrective steps I need to take would be appreciated.
Thanks!
