I have two component in one component.ts on the click of button i call openClientCallLogs function but routing does not work the url will create but they did’nt go to another component

on the click of button

openClientCallLogs(client: Client): void {
    this.router.navigate(['/index/client/clients-detail', client.id ,'call-logs']);
  }

Routing of module

export const clientsRoutes: Routes = [
  {
    path: 'client',
    children: [
      {
        path: 'clients-detail',
        component: ClientDetailsComponent,
        children: [
          { 
            path: ':id/call-logs',
            component: ClientCallLogsComponent
          }
        ]
      }
    ],
  },
];

This is following my App.routing module

const routes: Routes = [
  {
    path: '',
    component: FullComponent,
    canActivate: [AuthGuard],
    children: [
      {
        path: '',
        redirectTo: '/dashboard',
        pathMatch: 'full',
      },
      {
        path: 'dashboard',
        loadChildren: () =>
          import('./pages/pages.module').then((m) => m.PagesModule),
      },
      {
        path: 'index',
        loadChildren: () =>
          import('./pages/clients/clients.module').then((m) => m.ClientsModule),
      },