Initial commit

nova/resources/js/components/Index/IdField.vue

@@ -0,0 +1,33 @@
+<template>
+  <div :class="`text-${field.textAlign}`">
+    <router-link
+      v-if="hasValue"
+      :to="{
+        name: 'detail',
+        params: {
+          resourceName: resourceName,
+          resourceId: field.value,
+        },
+      }"
+      class="no-underline dim text-primary font-bold"
+    >
+      {{ field.pivotValue || field.value }}
+    </router-link>
+    <p v-else>&mdash;</p>
+  </div>
+</template>
+
+<script>
+export default {
+  props: ['resourceName', 'field'],
+
+  computed: {
+    /**
+     * Determine if the field has a value other than null.
+     */
+    hasValue() {
+      return this.field.value !== null
+    },
+  },
+}
+</script>