Refactor person overview component to use overview component

aleksis/core/frontend/components/person/PersonOverview.vue

 <template>
-  <div>
-    <template v-if="$apollo.queries.person.loading">
+  <object-overview
+      :query="query"
+      title-attr="fullName"
+  >
+    <template #loading>
       <v-skeleton-loader type="article" />
 
       <v-row>
@@ -9,7 +12,7 @@
         </v-col>
       </v-row>
     </template>
-    <template v-else-if="person">
+    <template v-slot="person">
       <detail-view>
         <template #avatarContent>
           <person-avatar-clickbox :id="id" />
@@ -189,12 +192,13 @@
         </v-row>
       </detail-view>
     </template>
-  </div>
+  </object-overview>
 </template>
 
 <script>
 import AdditionalImage from "./AdditionalImage.vue";
 import GroupCollection from "../group/GroupCollection.vue";
+import ObjectOverview from "../generic/ObjectOverview.vue";
 import PersonActions from "./PersonActions.vue";
 import PersonAvatarClickbox from "./PersonAvatarClickbox.vue";
 import PersonCollection from "./PersonCollection.vue";
@@ -206,27 +210,15 @@ export default {
   components: {
     AdditionalImage,
     GroupCollection,
+    ObjectOverview,
     PersonActions,
     PersonAvatarClickbox,
     PersonCollection,
   },
-  apollo: {
-    person: {
+  data() {
+    return {
       query: gqlPersonOverview,
-      variables() {
-        if (this.$route.params.id) {
-          return {
-            id: this.$route.params.id,
-          };
-        }
-        return {};
-      },
-      result({ data }) {
-        if (data && data.person) {
-          this.$root.$setPageTitle(data.person.fullName);
-        }
-      },
-    },
+    }
   },
   props: {
     id: {

aleksis/core/frontend/components/person/personOverview.graphql

 query person($id: ID) {
-  person: personByIdOrMe(id: $id) {
+  object: personByIdOrMe(id: $id) {
     id
     username
     firstName