diff --git a/client/src/pages/firewall/DestinationNATRules.vue b/client/src/pages/firewall/DestinationNATRules.vue
index ec2cab8..e75cdea 100644
--- a/client/src/pages/firewall/DestinationNATRules.vue
+++ b/client/src/pages/firewall/DestinationNATRules.vue
@@ -12,6 +12,8 @@ const columns = [
   {heading: 'Source', path: 'match.source_addresses'},
   {heading: 'Destination', path: 'match.destination_addresses'},
   {heading: 'Service', path: 'match.services'},
+  {heading: 'Translated Address', path: 'address'},
+  {heading: 'Translated Service', path: 'service'},
   {heading: 'Counter', path: 'counter'},
   {heading: 'Comment', path: 'comment'},
 ];
@@ -57,7 +59,7 @@ onMounted(async() => {
 
 <template>
   <div>
-      <TableView title="DNAT Rules" :columns="columns" :loading="loading" @draggedRow="draggedRow" v-model:selection="selection" v-model:data="rules" :table-props="{sort:true, sortSelf: true, draggable: true}">
+    <TableView title="DNAT Rules" :columns="columns" :loading="loading" @draggedRow="draggedRow" v-model:selection="selection" v-model:data="rules" :table-props="{sort:true, sortSelf: true, draggable: true}">
       <button @click="load">Refresh</button>
       <router-link class="button" to="/firewall/destinationnatrules/edit">Create</router-link>
       <router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/firewall/destinationnatrules/edit/' + selection[0]">Edit</router-link>
diff --git a/client/src/pages/firewall/SourceNATRules.vue b/client/src/pages/firewall/SourceNATRules.vue
index 4ed68a2..9c1244c 100644
--- a/client/src/pages/firewall/SourceNATRules.vue
+++ b/client/src/pages/firewall/SourceNATRules.vue
@@ -12,6 +12,8 @@ const columns = [
   {heading: 'Source', path: 'match.source_addresses'},
   {heading: 'Destination', path: 'match.destination_addresses'},
   {heading: 'Service', path: 'match.services'},
+  {heading: 'Translated Address', path: 'address'},
+  {heading: 'Translated Service', path: 'service'},
   {heading: 'Counter', path: 'counter'},
   {heading: 'Comment', path: 'comment'},
 ];
@@ -57,7 +59,7 @@ onMounted(async() => {
 
 <template>
   <div>
-      <TableView title="SNAT Rules" :columns="columns" :loading="loading" @draggedRow="draggedRow" v-model:selection="selection" v-model:data="rules" :table-props="{sort:true, sortSelf: true, draggable: true}">
+    <TableView title="SNAT Rules" :columns="columns" :loading="loading" @draggedRow="draggedRow" v-model:selection="selection" v-model:data="rules" :table-props="{sort:true, sortSelf: true, draggable: true}">
       <button @click="load">Refresh</button>
       <router-link class="button" to="/firewall/sourcenatrules/edit">Create</router-link>
       <router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/firewall/sourcenatrules/edit/' + selection[0]">Edit</router-link>