ayanova/src/views/ay-about.vue

@@ -0,0 +1,270 @@
+<template>
+  <v-row row v-if="this.formState.ready">
+    <v-col cols="12" mt-1 mb-2 v-if="formState.errorBoxMessage">
+      <v-alert
+        ref="errorbox"
+        v-show="formState.errorBoxMessage"
+        color="error"
+        icon="fa-exclamation-circle "
+        transition="scale-transition"
+        class="multi-line"
+        outlined
+        >{{ formState.errorBoxMessage }}</v-alert
+      >
+    </v-col>
+    <v-col>
+      <v-card id="aboutinfocard">
+        <v-subheader>{{ lt("ClientApp") }}</v-subheader>
+        <div>
+          <span class="ml-6 body-1">{{ lt("Version") }}:</span>
+          <span class="body-2">{{ clientInfo.version }}</span>
+        </div>
+        <div>
+          <span class="ml-6 body-1">{{ lt("User") }}:</span>
+          <span class="body-2">{{ this.$store.state.userName }}</span>
+        </div>
+
+        <div>
+          <span class="ml-6 body-1">{{ lt("UserTimeZoneOffset") }}:</span>
+          <span class="body-2">
+            {{ ltFormat().timeZoneOffset }}
+          </span>
+        </div>
+
+        <div>
+          <span class="ml-6 body-1">{{ lt("DecimalSeparator") }}:</span>
+          <span class="body-2">{{ ltFormat().decimalSeparator }}</span>
+        </div>
+
+        <div>
+          <span class="ml-6 body-1">{{ lt("CurrencySymbol") }}:</span>
+          <span class="body-2">{{ ltFormat().currencySymbol }}</span>
+        </div>
+
+        <div>
+          <span class="ml-6 body-1">{{ lt("ShortDateFormat") }}:</span>
+          <span class="body-2">{{ ltFormat().shortDate }}</span>
+        </div>
+
+        <div>
+          <span class="ml-6 body-1">{{ lt("ShortTimeFormat") }}:</span>
+          <span class="body-2">{{ ltFormat().shortTime }}</span>
+        </div>
+
+        <div>
+          <span class="ml-6 body-1">{{ lt("ShortDateAndTimeFormat") }}: </span>
+          <span class="body-2">{{ ltFormat().shortDateAndTime }}</span>
+        </div>
+
+        <v-divider class="mt-6"></v-divider>
+        <v-subheader>{{ lt("Browser") }}</v-subheader>
+        <div v-for="(value, name) in clientInfo.browser" :key="name">
+          <span class="ml-6 body-1">{{ name }}:</span>
+          <span class="body-2">{{ value }}</span>
+        </div>
+
+        <v-divider class="mt-6"></v-divider>
+        <v-subheader>{{ lt("Server") }}</v-subheader>
+        <div>
+          <span class="ml-6 body-1">{{ lt("ServerAddress") }}:</span>
+          <span class="body-2">{{ this.$store.state.apiUrl }}</span>
+        </div>
+        <div>
+          <span class="ml-6 body-1">{{ lt("Version") }}:</span>
+          <span class="body-2">{{ serverInfo.serverVersion }}</span>
+        </div>
+        <div>
+          <span class="ml-6 body-1">{{ lt("SchemaVersion") }}:</span>
+          <span class="body-2">{{ serverInfo.dbSchemaVersion }}</span>
+        </div>
+        <div>
+          <span class="ml-6 body-1">{{ lt("ServerTime") }}:</span>
+          <span class="body-2">{{ serverInfo.serverLocalTime }}</span>
+        </div>
+        <div>
+          <span class="ml-6 body-1">{{ lt("TimeZone") }}:</span>
+          <span class="body-2">{{ serverInfo.serverTimeZone }}</span>
+        </div>
+
+        <v-divider class="mt-6"></v-divider>
+        <v-subheader>{{ lt("HelpLicense") }}</v-subheader>
+        <div>
+          <span class="ml-6 body-1">{{ lt("RegisteredUser") }}:</span>
+          <span class="body-2">{{
+            serverInfo.license.license.licensedTo
+          }}</span>
+        </div>
+        <div>
+          <span class="ml-6 body-1">{{ lt("DatabaseID") }}:</span>
+          <span class="body-2">{{ serverInfo.license.license.dbId }}</span>
+        </div>
+        <div>
+          <span class="ml-6 body-1">{{ lt("LicenseSerial") }}:</span>
+          <span class="body-2">{{ serverInfo.license.license.keySerial }}</span>
+        </div>
+        <div>
+          <span class="ml-6 body-1">{{ lt("LicenseExpiration") }}:</span>
+          <span class="body-2">{{
+            serverInfo.license.license.licenseExpiration
+          }}</span>
+        </div>
+        <div>
+          <span class="ml-6 body-1">{{ lt("SupportedUntil") }}:</span>
+          <span class="body-2">{{
+            serverInfo.license.license.maintenanceExpiration
+          }}</span>
+        </div>
+
+        <v-divider class="mt-6"></v-divider>
+        <v-subheader>{{ lt("LicensedOptions") }}</v-subheader>
+
+        <div
+          v-for="item in serverInfo.license.license.features"
+          :key="item.Feature"
+        >
+          <span class="ml-6 body-1">{{ item.Feature }}</span>
+          <span class="body-2">{{ item.Count ? ": " + item.Count : "" }}</span>
+        </div>
+
+        <v-divider class="mt-6"></v-divider>
+      </v-card>
+    </v-col>
+  </v-row>
+</template>
+
+<script>
+/* xeslint-disable */
+import aboutInfo from "../api/aboutinfo";
+
+/////////////////////////////
+//
+//
+function clickHandler(menuItem) {
+  if (!menuItem) {
+    return;
+  }
+  var m = window.$gz.menu.parseMenuItem(menuItem);
+  if (m.owner == "about" && !m.disabled) {
+    switch (m.key) {
+      case "copysupportinfo":
+        //put the support info on the clipboard:
+        var element = document.getElementById("aboutinfocard");
+        var text = element.innerText || element.textContent;
+
+        var logText = "";
+        window.$gz._.forEach(m.vm.$store.state.logArray, function appendLogItem(
+          value
+        ) {
+          logText += value + "\n";
+        });
+        window.$gz.util.copyToClipboard(text + "\nCLIENT LOG\n" + logText);
+        break;
+      default:
+        window.$gz.eventBus.$emit(
+          "notify-warning",
+          "About.vue::context click: [" + m.key + "]"
+        );
+    }
+  }
+}
+
+export default {
+  beforeCreate() {
+    var vm = this;
+    window.$gz.locale
+      .fetch([
+        "HelpAboutAyaNova",
+        "ClientApp",
+        "Server",
+        "Version",
+        "SchemaVersion",
+        "ServerTime",
+        "ServerAddress",
+        "TimeZone",
+        "HelpLicense",
+        "RegisteredUser",
+        "DatabaseID",
+        "LicenseSerial",
+        "LicenseExpiration",
+        "SupportedUntil",
+        "LicensedOptions",
+        "Log",
+        "User",
+        "Browser",
+        "UserTimeZoneOffset",
+        "DecimalSeparator",
+        "CurrencySymbol",
+        "ShortDateFormat",
+        "ShortTimeFormat",
+        "ShortDateAndTimeFormat"
+      ])
+      .then(function() {
+        vm.formState.ready = true;
+
+        window.$gz.eventBus.$emit("menu-change", {
+          isMain: false,
+          icon: "fa-info-circle",
+          title: window.$gz.locale.get("HelpAboutAyaNova"),
+          helpUrl: "form-ay-about",
+          menuItems: [
+            {
+              title: window.$gz.locale.get("Copy"),
+              icon: "copy",
+              surface: true,
+              key: "about:copysupportinfo",
+              vm: vm
+            },
+            {
+              title: window.$gz.locale.get("Log"),
+              icon: "glasses",
+              surface: true,
+              key: "app:nav:log",
+              data: "log"
+            }
+          ]
+        });
+        window.$gz.eventBus.$on("menu-click", clickHandler);
+      })
+      .catch(err => {
+        vm.formState.ready = true;
+        window.$gz.errorHandler.handleFormError(err);
+      });
+  },
+  created() {
+    window.$gz.api
+      .get("ServerInfo")
+      .then(response => {
+        this.serverInfo = response.data;
+      })
+      .catch(function handleGetServerInfoError(error) {
+        throw error;
+      });
+  },
+  beforeDestroy() {},
+  mounted() {
+    this.clientInfo = {};
+    this.clientInfo = aboutInfo;
+  },
+  data() {
+    return {
+      serverInfo: { license: { license: {} } },
+      clientInfo: {},
+      formState: {
+        ready: false,
+        loading: true,
+        errorBoxMessage: null,
+        appError: null,
+        serverError: {}
+      }
+    };
+  },
+  methods: {
+    lt(ltKey) {
+      return window.$gz.locale.get(ltKey);
+    },
+    ltFormat() {
+      return window.$gz.locale.format();
+    }
+  }
+};
+</script>