Display right information about source

htdocs/src/router/index.js

@@ -33,7 +33,7 @@ const routes = [
     }
   },
   {
-    path: '/domains/:zone',
+    path: '/domains/:domain',
     component: function () {
       return import(/* webpackChunkName: "domain" */ '../views/domain.vue')
     },

htdocs/src/views/domain-source.vue

@@ -1,21 +1,18 @@
 <template>
   <div>
-    <h3 class="text-primary">Paramètres <router-link to="#" class="badge badge-info">Change</router-link></h3>
+    <h3 class="text-primary">Source parameters <router-link :to="'/sources/' + source._id" class="badge badge-info">Change</router-link></h3>
     <p>
-      <span class="text-secondary">Server</span><br>
-      <strong>{{ zone.server }}</strong>
+      <span class="text-secondary">Name</span><br>
+      <strong>{{ source._comment }}</strong>
     </p>
     <p>
-      <span class="text-secondary">DDNS Key Name</span><br>
-      <strong>{{ zone.keyname }}</strong>
+      <span class="text-secondary">Source type</span><br>
+      <strong :title="source._srctype">{{ specs[source._srctype].name }}</strong><br>
+      <span class="text-muted">{{ specs[source._srctype].description }}</span>
     </p>
-    <p>
-      <span class="text-secondary">DDNS Key Algorithm</span><br>
-      <strong>{{ zone.algorithm }}</strong>
-    </p>
-    <p>
-      <span class="text-secondary">Storage facility</span><br>
-      <strong>{{ zone.storage_facility }}</strong>
+    <p v-for="(spec,index) in source_specs" v-bind:key="index" v-show="!spec.secret">
+      <span class="text-secondary">{{ spec.label }}</span><br>
+      <strong>{{ source.Source[spec.id] }}</strong>
     </p>
   </div>
 </template>
@@ -27,15 +24,37 @@ export default {
 
   data: function () {
     return {
-      zone: {}
+      source: {},
+      source_specs: {},
+      specs: {}
     }
   },
 
   mounted () {
-    var myzone = this.$route.params.zone
     axios
-      .get('/api/zones/' + myzone)
-      .then(response => (this.zone = response.data))
+      .get('/api/source_specs')
+      .then(response => (
+        this.specs = response.data
+      ))
+  },
+
+  props: ['domain'],
+
+  watch: {
+    domain: function (domain) {
+      axios
+        .get('/api/sources/' + this.domain.id_source)
+        .then(
+          (response) => {
+            this.source = response.data
+
+            axios
+              .get('/api/source_specs/' + this.source._srctype)
+              .then(response => (
+                this.source_specs = response.data
+              ))
+          })
+    }
   }
 }
 </script>