vue create testrmaidra-components

npm install --save-dev stylus
npm install --save-dev stylus-loader
npm install --save vuetify
npm install --save vuex
npm install --save vue-i18n
npm install --save pharma-v1

import Vue from "vue";
import "./plugins/vuetify";
import Vuetify from "vuetify";
import VueI18n from "vue-i18n";
import store from "pharma-v1/src/store";
import eng from "pharma-v1/src/i18n/eng";
import deu from "pharma-v1/src/i18n/deu";
import ita from "pharma-v1/src/i18n/ita";
import PharmaVueComponents from "pharma-v1";
import App from "./App.vue";

Vue.config.productionTip = false;

Vue.use(Vuetify);
Vue.use(VueI18n);
Vue.use(PharmaVueComponents);

const messages = { eng, deu, ita };
const i18n = new VueI18n({
  locale: "en",
  messages: messages
});

new Vue({
  store,
  i18n,
  render: h => h(App)
}).$mount("#app");

<link
  rel="stylesheet"
  href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900"
/>
<link
  rel="stylesheet"
  href="https://fonts.googleapis.com/css?family=Material+Icons"
/>

import Vue from 'vue'
import Vuetify from 'vuetify/lib'
import 'vuetify/src/stylus/app.styl'

Vue.use(Vuetify, {
  iconfont: 'md',
})

import fields from "pharma-v1/src/utils/fields";

export default {
  name: "app",
  computed: {
    user: function() {
      return this.$store.state.user.lastname
        ? this.$store.state.user.firstname +
            " " +
            this.$store.state.user.lastname
        : null;
    }
  },
  data() {
    return {
      alerts: [],
      window: 0,
      loadedform: {},
      form: {
        sections: [
          {
            title: "General metadata",
            id: 1,
            fields: []
          },
          {
            title: "Digitized object",
            type: "phaidra:DigitizedObject",
            id: 2,
            fields: []
          },
          {
            title: "Subject",
            type: "phaidra:Subject",
            id: 3,
            multiplicable: true,
            fields: []
          }
        ]
      },
      pid: "",
      solrbaseurl: "https://app01.cc.univie.ac.at:8983/solr/phaidra_sandbox",
      apibaseurl: "https://services.phaidra-sandbox.univie.ac.at/api",
      credentials: {
        username: "",
        password: ""
      },
      contentmodel: "unknown",
      contentmodels: [
        { text: "Data", value: "unknown" },
        { text: "Picture", value: "picture" }
      ],
      psvis: true
    };
  },
  methods: {
    loadDisplay: function() {
      this.$refs.display.loadMetadata(this.pid);
    },
    loadEdit: function() {
      this.$refs.edit.loadMetadata(this.pid);
    },
    login: function() {
      this.$store.dispatch("login", this.credentials);
    },
    logout: function() {
      this.$store.dispatch("logout");
    },
    objectCreated: function(event) {
      alert("Object " + event + " created");
    },
    objectSaved: function(event) {
      alert("Metadata for object " + event + " saved");
    },
    toggleVisibility: function() {
      this.psvis = !this.psvis;
    },
    dismiss: function(alert) {
      this.$store.commit("clearAlert", alert);
    }
  },
  mounted: function() {
    this.$store.commit("setInstanceApi", this.apibaseurl);
    this.$store.commit("setInstanceSolr", this.solrbaseurl);

    this.form.sections[0].fields.push(fields.getField("file"));
    this.form.sections[0].fields.push(fields.getField("resource-type"));
    this.form.sections[0].fields.push(fields.getField("title"));
    this.form.sections[0].fields.push(fields.getField("language"));
    this.form.sections[0].fields.push(fields.getField("description"));
    this.form.sections[0].fields.push(fields.getField("keyword"));
    this.form.sections[0].fields.push(fields.getField("project"));
    this.form.sections[0].fields.push(fields.getField("funder"));
    this.form.sections[0].fields.push(fields.getField("role"));
    this.form.sections[0].fields.push(fields.getField("license"));

    this.form.sections[1].fields.push(fields.getField("title"));
    this.form.sections[1].fields.push(fields.getField("description"));
    this.form.sections[1].fields.push(fields.getField("inscription"));
    this.form.sections[1].fields.push(fields.getField("height"));
    this.form.sections[1].fields.push(fields.getField("shelf-mark"));
    this.form.sections[1].fields.push(
      fields.getField("technique-getty-aat-select")
    );
    this.form.sections[1].fields.push(fields.getField("digitization-note"));
    this.form.sections[1].fields.push(fields.getField("reproduction-note"));

    this.form.sections[2].fields.push(fields.getField("title"));
    this.form.sections[2].fields.push(fields.getField("description"));
    this.form.sections[2].fields.push(fields.getField("temporal-coverage"));
    this.form.sections[2].fields.push(fields.getField("spatial-text"));
  }
};

import vocabulary from 'pharma-v1/src/store/modules/vocabulary'
...
export default new Vuex.Store({
...
  modules: {
...    ,
    vocabulary
  }
})

npm run serve

npm install

npm run serve

npm run build

npm run test

npm run lint