Evgeny Kulakov

Судя по исходникам:

registerData:       {url: 'auth/register',      method: 'POST', redirect: '/login'},

это дефолтное поведение этой библиотеки.

Несколько общих соображений:

1. Если проект развивается, и вы не переписываете что-то уже готовое, то на начальном этапе нет смысла сильно заморачиваться со структурой. Просто делайте своевременно рефакторинг и приводите структуру к более удобному виду по мере развития.
2. По опыту более удобно все-таки иметь более плоскую структуру папок, иначе со временем по ним очень тяжело делать навигацию.
3. В вашем варианте вы получите много одинаковых файлов index и menu например. Как правило в редакторе открыта куча файлов, для названия остается мало места и у вас будет множество вкладок index.vue в итоге. Т.е. лучше делать название файла более информативным типа:

header\
HeaderLayout.vue (или Header.vue или HeaderBase.vue ) - базовый компонент, который так или иначе использует другие.
HeaderMenu.vue
HeaderTitle.vue
и т.д.

Лично я обычно имя компонента делаю равным имени файла.
4. Если не смотрели, стоит прочитать style guide по vue: https://vuejs.org/v2/style-guide/
5. Тесно связанные файлы и папки лучше держать ближе к друг другу для упрощения поиска.
6. Для базовых компонентов, чтобы отличать их от компонентов фреймворка например, можете сделать свой префикс типа app-button, app-selector и т.д.

Думаю разносить не стоит - потоните в поддержке.
В целом не очень ясно, что представляет собой приложение - это чистый фронт или фронт и бэк?
Как вы деплой приложения планируете делать?
Кастомизацию можно решать на уровне конфигруации при деплое, можно делать дополнительный админский интефейс, где вы будете настраивать систему под конкретного клиента.
Можно разбивать систему на ядро и подключаемые плагины для кастомизации.

Вроде работает, вот эти:

.v-treeview-node--leaf {
    /* margin-left: 26px; */
  margin-left: 0;
}
.v-treeview-node {
    /* margin-left: 26px; */
  margin-left: 0;
}

vm - сокращение view-model. По сути это экземпляр vue и внутри компонента это - this.
$watch обычно помещают в хуки компонента - created() или mounted() например.

Как вариант использовать eventbus - отправляете событие нажатия на кнопку в футере, в основном компоненте подписываетесь и вызываете нужную функцию.

Если считаете, что строка списка достаточно сложный элемент, то выносите в отдельный компонент. Очевидно, что он вполне самодостаточен. И главное здесь, как правильно выше заметили, инкапсуляция или борьба со сложностью. Отдельно компонент строки будет проще поддерживать и тестировать при необходимости.

Да, vuex будет вполне уместен, для вас он будет источником истины, откуда все компоненты будут забирать данные. Сделайте два vuex модуля - cities и stations - в них реализуйте соответствующие crud операции. Компоненты будут из них забирать/передавать необходимые данные.

По пунктам:
1. Вот здесь ваша проблема описана: https://router.vuejs.org/ru/guide/essentials/histo... Смысл в том, что когда вы перезагружаете страницу вы пытаетесь получить страницу, которой не существует, в итоге 404.

2. Использовать вложенные маршруты: https://router.vuejs.org/ru/guide/essentials/neste...

Из описания не совсем понятно, что такое product.body. Это поле объекта product или что-то еще? Если product - объект в экземпляре компонента вью, то можно так попробовать:

<button v-on:click="modal( { product_about: product.body } )">

Почему бы не запустить профайлер в браузере и посмотреть, что отжирает время?