We Keep Coding

Problem with Voyager admin panel routing and Vue js router in laravel

I`m developing locally SPA application using Vuejs V2 in Laravel V8 framework.
My routes/web.php file have this codes:
Route::group(['prefix' => 'admin'], function () {
Voyager::routes();
});
//for disallow accessing route from anywhere alse than api
Route::get('/{any?}', function () {
return view('welcome');
})->where('any', '^(?!api\/)[\/\w\.\,-]*');
Auth::routes();
Here is my routes.js file inside resources/js folder
import VueRouter from "vue-router";
const routes = [
{
path: "*",
component: require("./components/PageNotFound").default,
name: "PageNotFound"
},
{
path: "/",
component: require("./components/Home").default,
name: "home"
},
// other routes
];
const router = new VueRouter({
mode: "history",
linkActiveClass: "active",
routes
});
export default router;
My problem is that i cant access Voyager http://127.0.0.1:8000/admin route in browser and redirects me to home page!
My Voyager installed successfully and before installing that i was developing frontend features so i have a lot routes in my routes.js file.
My question is how i can except Voyager admin group route in web.php or any other solutions maybe?!

I solved the problem by stopping serve then start that, worked for me and i can now see admin panel.

Ember ember-simple-auth override routeIfAlreadyAuthenticated in application route

How do you override the routeIfAlreadyAuthenticated?
And once that happens, how can it transition to a route with a dynamic segment?
I realize I can override sessionAuthenticated; and in that ways override the functionality of routeAfterAuthentication. However, routeIfAlreadyAuthenticated is a computed property that is executed in a beforeModel in the unauthenticated-route-mixin.js mixin.
Any help would be greatly appreciated.

In app/session/route.js, just do:
import Ember from 'ember';
import UnauthenticatedRouteMixin from 'ember-simple-auth/mixins/unauthenticated-route-mixin';
export default Ember.Route.extend(UnauthenticatedRouteMixin, {
routeIfAlreadyAuthenticated: 'dashboard'
});
and it works, no more:
Error while processing route: session.login Assertion Failed: The route index was not found Error
The following works as well, but is deprecated
In config/environment.js:
var ENV = {
...
};
ENV['ember-simple-auth'] = {
// authenticationRoute: 'login',
// routeAfterAuthentication: 'dashboard',
routeIfAlreadyAuthenticated: 'dashboard'
};

Use Component Router with Upgrade Adapter

When trying to use the Angular 2 Component Router (Angular 2 RC 4) with the upgrade adapter I got the following error:
Bootstrap at least one component before injecting Router. at
setupRouter
This is my main.ts file:
angular.module(moduleName).directive('odetteSecureApp', upgradeAdapter.downgradeNg2Component(OdetteSecureAppComponent));
upgradeAdapter.addProvider(APP_ROUTER_PROVIDERS);
upgradeAdapter.bootstrap(document.body, [moduleName]);
I google the problem and found the following links, but they all correspond to the router deprecated module as the Angular team changed how the router works since RC4:
https://github.com/angular/angular/issues/7147?_pjax=%23js-repo-pjax-container
Any ideas?

To use the RC3 (3.0.0-alpha.*) router, you need to do a couple of things differently from how the router was set up in previous versions.
You need to define a RouterConfig like this:
import {provideRouter, RouterConfig} from '#angular/router';
export const APP_ROUTES : RouterConfig = [
{path: '', component: AppComponent},
// more paths
];
export const APP_ROUTE_PROVIDERS = [
provideRouter(APP_ROUTES)
];
then in your main.ts
upgradeAdapter.addProvider(APP_ROUTER_PROVIDERS);

Resolved by the following official post:
https://github.com/angular/angular/issues/9870

Controller/route conventions for nested routes in ember

I have this resource with a nested route in my ember app:
router.js:
Router.map(function() {
this.resource('posts', function () {
this.route('show', {path: '/:id'});
});
});
What is the convention in ember for my controllers? Do I create a separate file for each URL, or does the show handler go in /controllers/posts.js? Or is there perhaps multiple correct ways of doing this?
This is what I have so far in /routes/posts.js:
import Ember from 'ember';
var PostsRoute = Ember.Route.extend({
model: function() {
return posts;
}
});
var posts = [
{
id: '1',
title: 'Object nr one',
content: 'This is the content of Object nr one.'
},
{
id: '2',
title: 'Obelix',
content: 'A fat gaul. From a comic book.'
},
{
id: '3',
title: 'Werner',
content: 'Wat soek werner hier? Dis mos nou belaglik man.'
}
];
export default PostsRoute;
And this is /controllers/posts.js:
import Ember from "ember";
export default Ember.ArrayController.extend({});
I would appreciate if someone showed me the correct way of doing things in this example.. I'm really struggling to find proper examples on the web.
Please note that I'm using ember CLI

"Show handler" never goes to controller file, it's rather a Route. You create separate route, controller, template for each of your resource or route directives. You can tell controller that it should have the same behaviour as other controller, or use a mixin. For example:
router.coffee:
#resource 'training', ->
#route 'chest'
#route 'shoulders'
Means you need following structure:
app/routes/training[your parent resource]/chest.js[your child route]
app/routes/training/shoulders.js
If you need controller for each of this routes you would need files with following paths:
app/controllers/training/chest.js
app/controllers/training/shoulders.js
And templates:
app/templates/training/chest.js
app/templates/training/shoulders.js
It's because I've defined training as resource(parent) and routes as its children.
If you use Ember CLI you can use commands like:
ember g controller training/shoulders
or:
ember g route training/shoulders
Last command will generate you: Route, template and entry in router.js. You can use this commands so you won't have worry too much about your directory structure.
However, it's important to remember that when you define resource inside a resource - child resource isn't really a child and it shouldn't be placed inside parent resource directory. For example:
#resource 'tracks', ->
#resource 'track', path: '/track/:track_id', ->
#route 'edit'
Means you need 2 directories to store route files:
app/routes/tracks/
index.js
app/routes/track/
edit.js
Instead of app/routes/tracks/track/edit.
So, in your example, for following router:
Router.map(function() {
this.resource('posts', function () {
this.route('show', {path: '/:id'});
});
});
app/routes should look like this:
app/routes:
- posts.js # main route for whole resource
- posts/ # directory which contains files for routes inside posts resource
- show.js # posts/show route

Meteor - layoutTemplate in RouteController.extend in package.js

I have problem with iron-router controllers in package.
My code:
Router.map(function() {
this.route('registration.index', {path: '/registration'});
});
RegistrationIndexController = RouteController.extend({
layoutTemplate: 'IntranetLayoutSimple'
...
});
LayoutTemplate not working

If you're creating new route controllers inside package and want to use them in main app, remember to export it, e.g.:
api.export('RegistrationIndexController', ['client', 'server']); in package.js