bfg-common 1.5.708 → 1.5.709

package/components/common/layout/theHeader/userMenu/modals/preferences/view/View.vue

@@ -1,45 +1,33 @@
-<template>
-  <common-layout-the-header-user-menu-modals-preferences-view-new
-    v-if="props.newView"
-    v-model="model"
-    :description="description"
-  />
-  <common-layout-the-header-user-menu-modals-preferences-view-old
-    v-else
-    v-model="model"
-    :description="description"
-  />
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-
-const props = defineProps<{
-  newView: boolean
-  newViewLocal: boolean
-}>()
-
-const emits = defineEmits<{
-  (event: 'update-is-new-view', value: boolean): void
-}>()
-
-const config = useRuntimeConfig()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const description = computed<string>(() => {
-  return localization.value.common.viewDesc.replaceAll(
-    '{trademark}',
-    String(config.public[`TRADEMARK_${useEnvLanguage()}`])
-  )
-})
-
-const model = computed<boolean>({
-  get() {
-    return props.newViewLocal
-  },
-  set(newValue: boolean) {
-    emits('update-is-new-view', newValue)
-  },
-})
-</script>
+<template>
+  <component
+    :is="currentComponent"
+    v-model="newViewLocal"
+    :description="description"
+  />
+</template>
+
+<script setup lang="ts">
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+
+const newViewLocal = defineModel<boolean>('newViewLocal')
+const props = defineProps<{
+  newView: boolean
+}>()
+
+const config = useRuntimeConfig()
+
+const currentComponent = computed(() =>
+  props.newView
+    ? defineAsyncComponent(() => import('./New.vue'))
+    : defineAsyncComponent(() => import('./Old.vue'))
+)
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const description = computed<string>(() => {
+  return localization.value.common.viewDesc.replaceAll(
+    '{trademark}',
+    String(config.public[`TRADEMARK_${useEnvLanguage()}`])
+  )
+})
+</script>

package/components/common/monitor/advanced/graphView/GraphView.vue

@@ -138,6 +138,14 @@ watch(
   },
   { immediate: true }
 )
+
+const updateTimeFormatAndInterfaceLang = computed<number>(
+  () => $store.getters['main/getUpdateTimeFormatAndInterfaceLang']
+)
+
+watch(updateTimeFormatAndInterfaceLang, () => {
+  startChart()
+})
 </script>
 
 <style scoped lang="scss"></style>

package/components/common/monitor/advanced/tools/Tools.vue

@@ -178,6 +178,10 @@ const routeType = '' + useRoute().params.type
 
 const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
 
+const updateTimeFormatAndInterfaceLang = computed<number>(
+  () => $store.getters['main/getUpdateTimeFormatAndInterfaceLang']
+)
+
 const localSelectedTimespanType = computed<string>({
   get() {
     return props.selectedTimespanType
@@ -278,7 +282,7 @@ const updateTools = (): void => {
 }
 
 const chartTitleDate = computed<string>(() => {
-  if (!props.startDate) return ''
+  if (!props.startDate || !updateTimeFormatAndInterfaceLang.value) return ''
 
   const start = $formattedDatetime(props.startDate, { hasSeconds: true })
   const end = $formattedDatetime(props.endDate, { hasSeconds: true })

package/components/common/pages/auth/TheFooter.vue

@@ -0,0 +1,104 @@
+<template>
+  <div
+    id="footer"
+    class="footer flex justify-between items-center fixed left-0 right-0 bottom-0"
+  >
+    <div class="content flex items-center gap-4">
+      <span class="company-info"
+        >{{ currentYear }} ©
+        <span class="company-name">{{ companyName }}</span></span
+      >
+
+      <span class="dote-divider">•</span>
+
+      <a
+        :href="supportLink"
+        data-id="support-link"
+        class="support-link"
+        target="_blank"
+      >
+        <ui-icon name="support" width="18" height="18" />
+        <span class="support-text">{{
+          localization.common.technicalSupport
+        }}</span></a
+      >
+    </div>
+
+    <div class="app-version-wrap flex-justify-end flex-align-center">
+      <span class="app-version"> {{ version }} </span>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+
+const { version } = useAppVersion()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const currentYear = new Date().getFullYear()
+
+const config = useRuntimeConfig()
+
+const companyName = computed<string>(
+  () => config.public[`COMPANY_NAME_${useEnvLanguage()}`] as string
+)
+
+const supportLink = computed<string>(() => {
+  return config.public.SUPPORT_SITE
+})
+</script>
+
+<style scoped lang="scss">
+.footer {
+  position: fixed;
+  background-color: #e9ebed;
+  padding: 11px 44px;
+
+  .content {
+    .company-info {
+      font-size: 14px;
+      line-height: 18px;
+      color: #9da6ad;
+      font-weight: 400;
+
+      .company-name {
+        font-weight: 300;
+      }
+    }
+
+    .dote-divider {
+      color: #9da6ad;
+    }
+
+    .support-link {
+      display: inline-flex;
+      align-items: center;
+      gap: 8px;
+      color: #9da6ad;
+      text-decoration: none;
+      font-weight: 500;
+      font-size: 14px;
+      line-height: 18px;
+
+      &:hover {
+        color: #008fd6;
+      }
+
+      .support-text {
+        margin-top: 4px;
+      }
+    }
+  }
+
+  .app-version-wrap {
+    .app-version {
+      font-size: 14px;
+      line-height: 18px;
+      color: #9da6ad;
+      margin-right: 8px;
+    }
+  }
+}
+</style>

package/components/common/pages/backups/DetailView.vue

@@ -1,52 +1,52 @@
-<template>
-  <div class="detail-view overflow-auto py-0 px-6">
-    <table v-if="detailData" class="table table-noborder">
-      <tbody>
-        <tr>
-          <td class="left">{{ localization.common.name }}</td>
-          <td class="left backup-name-label">{{ detailData.name }}</td>
-        </tr>
-        <tr>
-          <td class="left">{{ localization.common.description }}</td>
-          <td class="left backup-name-label">{{ detailData.description }}</td>
-        </tr>
-        <tr>
-          <td class="left">{{ localization.common.timestamp }}</td>
-          <td class="left backup-name-label">{{ detailData.timestamp }}</td>
-        </tr>
-      </tbody>
-    </table>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_BackupsTreeNode } from '~/components/common/pages/backups/lib/models/interfaces'
-
-const props = defineProps<{
-  detail: UI_I_BackupsTreeNode | null
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const detailData = ref<UI_I_BackupsTreeNode | null>(null)
-watch(
-  () => props.detail,
-  (newValue) => {
-    detailData.value = newValue
-  },
-  { immediate: true, deep: true }
-)
-</script>
-
-<style scoped lang="scss">
-.detail-view {
-  width: 50%;
-
-  .table {
-    .left:not(.backup-name-label) {
-      width: 320px;
-    }
-  }
-}
-</style>
+<template>
+  <div class="detail-view overflow-auto py-0 px-6">
+    <table v-if="detailData" class="table table-noborder">
+      <tbody>
+        <tr>
+          <td class="left">{{ localization.common.name }}</td>
+          <td class="left backup-name-label">{{ detailData.name }}</td>
+        </tr>
+        <tr>
+          <td class="left">{{ localization.common.description }}</td>
+          <td class="left backup-name-label">{{ detailData.description }}</td>
+        </tr>
+        <tr>
+          <td class="left">{{ localization.common.timestamp }}</td>
+          <td class="left backup-name-label">{{ detailData.timestamp }}</td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_BackupsTreeNode } from '~/components/common/pages/backups/lib/models/interfaces'
+
+const props = defineProps<{
+  detail: UI_I_BackupsTreeNode | null
+}>()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const detailData = ref<UI_I_BackupsTreeNode | null>(null)
+watch(
+  () => props.detail,
+  (newValue) => {
+    detailData.value = newValue
+  },
+  { immediate: true, deep: true }
+)
+</script>
+
+<style scoped lang="scss">
+.detail-view {
+  width: 50%;
+
+  .table {
+    .left:not(.backup-name-label) {
+      width: 320px;
+    }
+  }
+}
+</style>

package/components/common/pages/backups/lib/models/interfaces.ts

@@ -1,36 +1,36 @@
-import type { API_UI_I_DataTable } from '~/lib/models/table/interfaces'
-import type { UI_I_TreeNode } from '~/components/common/recursionTree/lib/models/interfaces'
-import type { UI_T_BackupActionType } from '~/components/common/pages/backups/lib/models/types'
-
-export interface API_UI_I_Backup {
-  creation_time: number
-  creation_type: number
-  description: string
-  kind: number // TODO
-  msg: string
-  name: string
-  state: number // TODO
-  uuid: string
-  vm_name: string
-  vmid: string
-  storage_id: string
-  storage_name: string
-}
-
-export interface UI_I_Backup extends API_UI_I_Backup {}
-
-export interface UI_I_BackupsTreeNode
-  extends UI_I_TreeNode<UI_I_BackupsTreeNode> {
-  parent_id: string
-  timestamp: string
-  description: string
-}
-
-export interface UI_I_BackupAction {
-  action: UI_T_BackupActionType | ''
-  id?: string
-  name?: string
-  backupId?: string
-  bucketId?: string
-  storageId?: string
-}
+import type { API_UI_I_DataTable } from '~/lib/models/table/interfaces'
+import type { UI_I_TreeNode } from '~/components/common/recursionTree/lib/models/interfaces'
+import type { UI_T_BackupActionType } from '~/components/common/pages/backups/lib/models/types'
+
+export interface API_UI_I_Backup {
+  creation_time: number
+  creation_type: number
+  description: string
+  kind: number // TODO
+  msg: string
+  name: string
+  state: number // TODO
+  uuid: string
+  vm_name: string
+  vmid: string
+  storage_id: string
+  storage_name: string
+}
+
+export interface UI_I_Backup extends API_UI_I_Backup {}
+
+export interface UI_I_BackupsTreeNode
+  extends UI_I_TreeNode<UI_I_BackupsTreeNode> {
+  parent_id: string
+  timestamp: string
+  description: string
+}
+
+export interface UI_I_BackupAction {
+  action: UI_T_BackupActionType | ''
+  id?: string
+  name?: string
+  backupId?: string
+  bucketId?: string
+  storageId?: string
+}