<template>
  <v-card class="mx-auto" v-if="formState.ready">
    <v-list subheader>
      <v-subheader>{{ $ay.t("UserInterfaceSettings") }}</v-subheader>
      <v-list-item
        link
        to="adm-global-select-templates"
        :data-cy="!!$ay.dev ? 'picklisttemplates' : false"
      >
        <v-list-item-title>{{ $ay.t("PickListTemplates") }}</v-list-item-title>
      </v-list-item>
    </v-list>
  </v-card>
</template>

<script>
export default {
  beforeCreate() {
    window.$gz.eventBus.$emit("menu-change", {
      isMain: true,
      icon: "fa-cogs",
      title: "AdministrationGlobalSettings",
      helpUrl: "form-adm-global-settings",
      formData: {
        ayaType: window.$gz.type.Global
      }
    });
  },
  async created() {
    let vm = this;
    try {
      await initForm(vm);

      vm.rights = window.$gz.role.getRights(window.$gz.type.UserOptions);
      vm.formState.ready = true;
      // window.$gz.eventBus.$on("menu-click", clickHandler);
      // //UserOptions never creates a new one so this code is a little different than other forms
      // //NOTE: FOR NOW GOING TO ASSUME THIS FORM WILL ONLY EVER BE USED TO EDIT *CURRENT* USER'S USEROPTIONS
      // //SO NOT FOR EDITING OTHER USERS, WILL ASSUME THE USER EDITOR FORM FOR MANAGEMENT WILL HAVE A COMPACT VERSION
      // //OF THESE SAME FIELDS FOR THAT PURPOSE
      // //SO ALWAYS USER CURRENT LOGGED IN USER ID FOR THIS
      // //id 0 means create a new record don't load one but thats not applicable here

      // vm.getDataFromApi();
    } catch (err) {
      vm.formState.ready = true;
      window.$gz.errorHandler.handleFormError(err, vm);
    }
  },
  data() {
    return {
      formState: {
        ready: false,
        dirty: false,
        valid: true,
        readOnly: false,
        loading: true,
        errorBoxMessage: null,
        appError: null,
        serverError: {}
      },
      rights: window.$gz.role.defaultRightsObject()
    };
  }
};

/////////////////////////////////
//
//
async function initForm(vm) {
  await fetchTranslatedText(vm);
}

//////////////////////////////////////////////////////////
//
// Ensures UI translated text is available
//
async function fetchTranslatedText(vm) {
  await window.$gz.translation.cacheTranslations([
    "UserInterfaceSettings",
    "PickListTemplates"
  ]);
}
</script>
