Geo Primary Verification Details: Init Vue App

Why are we doing this work

This work will be behind feature flag geo_primary_verification_view

This issue is focused on creating a new entry point for the Geo Primary Verification Details View. This will live outside Geo but still in the ee/ space.

Proposed directory:

1. Vue Files: ee/app/assets/javascripts/admin/data_management_item
2. HAML Files: ee/views/admin/data_management/show.html.haml
3. Page Files: ee/app/assets/javascripts/pages/admin/data_management/show/index.js

Relevant links

• Routing discussion: Geo Primary Verification: Routing (#537677 - closed)

Implementation plan

1. Add #js-admin-data-management-item entry point to ee/views/admin/data_management/show.html.haml (create file if needed)

#js-admin-data-management-item

2. Create ee/app/assets/javascripts/admin/data_management_item/components/app.vue

<template>
  <h1>Data management item</h1>
</template

3. Create Vue application at ee/app/assets/javascripts/admin/data_management_item/index.js that bootstraps to #js-admin-data-management-item

import Vue from 'vue';
import AdminDataManagementItemApp from 'ee/admin/data_management_item/components/app.vue';

export const initAdminDataManagementItem = () => {
  const el = document.getElementById('js-admin-data-management-item');

  if (!el) return null;

  return new Vue({
    el,
    render(createElement) {
      return createElement(AdminDataManagementItemApp);
    },
  });
};

4. Create page javascript file to invoke the Vue application at ee/app/assets/javascripts/pages/admin/data_management/show/index.js

import { initAdminDataManagementItem } from 'ee/admin/data_management_item'

initAdminDataManagementItem();