better URL generation for create operation in translations

zero.Web/App/Pages/settings/translation.vue

@@ -48,7 +48,7 @@
 
       onLoad(form)
       {
-        form.load(this.model.id !== 'new' ? TranslationsApi.getById(this.model.id) : TranslationsApi.getEmpty()).then(response =>
+        form.load(!this.model.id ? TranslationsApi.getEmpty() : TranslationsApi.getById(this.model.id)).then(response =>
         {
           this.disabled = !response.canEdit;
           this.item = response;

zero.Web/App/Pages/settings/translations.vue

@@ -16,6 +16,9 @@
   import Overlay from 'zero/services/overlay.js';
   import AddOverlay from './translation';
 
+  const editRouteName = zero.alias.sections.settings + '-' + zero.alias.settings.translations + '-edit';
+  const createRouteName = zero.alias.sections.settings + '-' + zero.alias.settings.translations + '-create';
+
   export default {
     data: () => ({
       tableConfig: {}
@@ -24,10 +27,9 @@
     props: ['id'],
 
     watch: {
-      'id': function (id)
+      '$route': function (route)
       {
-        if (id) this.edit(id);
-        else Overlay.close();
+        this.handleRouteChange();
       }
     },
 
@@ -43,7 +45,7 @@
             link: item =>
             {
               return {
-                name: zero.alias.sections.settings + '-' + zero.alias.settings.translations + '-edit',
+                name: editRouteName,
                 params: { id: item.id }
               };
             }
@@ -53,7 +55,7 @@
             link: item =>
             {
               return {
-                name: zero.alias.sections.settings + '-' + zero.alias.settings.translations + '-edit',
+                name: editRouteName,
                 params: { id: item.id }
               };
             }
@@ -62,10 +64,7 @@
         items: TranslationsApi.getAll
       };
 
-      if (this.id)
-      {
-        this.edit(this.id);
-      }
+      this.handleRouteChange();
     },
 
     methods: {
@@ -74,6 +73,22 @@
         this.$router.go(-1);
       },
 
+      handleRouteChange()
+      {
+        if (this.id)
+        {
+          this.edit(this.id);
+        }
+        else if (this.$route.name === createRouteName)
+        {
+          this.edit();
+        }
+        else
+        {
+          Overlay.close();
+        }
+      },
+
       edit(id)
       {
         Overlay.open({
@@ -92,8 +107,7 @@
       add()
       {
         this.$router.push({
-          name: zero.alias.sections.settings + '-' + zero.alias.settings.translations + '-edit',
-          params: { id: 'new' }
+          name: createRouteName
         });
       }
     }

zero.Web/App/pages/settings/routes.js

@@ -10,7 +10,10 @@ detailPages[zero.alias.settings.users] = [
   { view: 'role', path: 'role' }
 ];
 detailPages[zero.alias.settings.countries] = 'country';
-detailPages[zero.alias.settings.translations] = 'translations';
+detailPages[zero.alias.settings.translations] = [
+  { view: 'translations' },
+  { view: 'translations', path: 'create', isDetail: false }
+];
 detailPages[zero.alias.settings.languages] = 'language';
 detailPages[zero.alias.settings.applications] = 'application';
 
@@ -53,9 +56,10 @@ if (section)
       details.forEach(detail =>
       {
         const path = detail.path || 'edit';
+        const isDetail = typeof detail.isDetail === 'boolean' ? detail.isDetail : true;
 
         routes.push({
-          path: area.url + '/' + path + '/:id',
+          path: area.url + '/' + path + (isDetail ? '/:id' : ''),
           name: alias + '-' + area.alias + '-' + path,
           component: () => import(`zero/pages/${alias}/${detail.view}`),
           props: true,