bfg-common 1.4.853 → 1.4.855

package/components/common/monitor/advanced/tools/chartOptionsModal/ChartOptionsModalOld.vue

@@ -1,189 +0,0 @@
-<template>
-  <div class="chart-options-modal">
-    <atoms-modal
-      width="1150px"
-      :show="true"
-      :title="localization.inventoryMonitor.chartOptions"
-      :disabled-submit="props.isDisabledSubmit"
-      @hide="emits('hide-main-modal')"
-      @submit="emits('submit-main-modal')"
-    >
-      <template #modalBody>
-        <common-monitor-advanced-tools-chart-options-modal-notification
-          v-show="props.isShowAlerts"
-          :alerts="props.alerts"
-          @remove="emits('remove-alerts')"
-        />
-        <div>
-          <common-monitor-advanced-tools-chart-options-modal-actions
-            :is-disabled-save="!selectedRowsLocal.length"
-            :options-names="props.optionsNames"
-            :selected-chart-option-name="props.localSelectedChartOptionName"
-            @save="emits('save-options', $event)"
-            @check-validation="emits('check-validations')"
-            @select-local-option-name="
-              emits('select-local-option-name', $event)
-            "
-            @delete-chart-name="emits('delete-chart-name', $event)"
-          />
-
-          <div class="horizontal-flex-container chart-options-content">
-            <common-monitor-advanced-tools-chart-options-modal-metrics
-              v-model:selected-metric="localSelectedMetricLocal"
-              :metrics-items="props.metricsItems"
-            />
-            <common-monitor-advanced-tools-chart-options-modal-counters
-              :chart="localSelectedMetricLocal"
-              :language="props.language"
-              :type="props.type"
-              :selected-keys="props.localSelectedCountersKeys"
-              :selected-chart-type="props.localSelectedChartType"
-              :selected-timespan-type="props.localSelectedTimespanType"
-              :units-count="props.localUnitsCount"
-              :period-type="localPeriodTypeLocal"
-              :selected-custom-time="customTimeLocal"
-              :custom-date-from="props.customDateFrom"
-              :custom-date-to="props.customDateTo"
-              :custom-time-from="props.customTimeFrom"
-              :custom-time-to="props.customTimeTo"
-              :total-cores="props.totalCores"
-              :host-id="props.hostId"
-              :selected-metrics-keys="props.selectedMetricsKeys"
-              :selected-objects="props.selectedObjects"
-              :objects-loading="props.objectsLoading"
-              :objects-data="props.objectsData"
-              :valid-date-end="props.validDateEnd"
-              @select-row="selectedRowsLocal = $event"
-              @update-chart-type="localSelectedChartTypeLocal = $event"
-              @update-custom-time="customTimeLocal = $event"
-              @update-timespan-type="timespanTypeLocal = $event"
-              @update-unit-count="unitCountLocal = $event"
-              @update-period-type="localPeriodTypeLocal = $event"
-              @update-custom-date-from="
-                emits('update-custom-date-from', $event)
-              "
-              @update-custom-date-to="emits('update-custom-date-to', $event)"
-              @update-custom-time-from="
-                emits('update-custom-time-from', $event)
-              "
-              @update-custom-time-to="emits('update-custom-time-to', $event)"
-              @select-objects="emits('local-selected-objects', $event)"
-            />
-          </div>
-        </div>
-      </template>
-    </atoms-modal>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_T_AdvancedType } from '~/components/common/monitor/advanced/lib/models/types'
-import type { UI_I_VerticalTabs } from '~/components/atoms/tabs/lib/models/interfaces'
-import type { UI_I_AdvancedCounterItem } from '~/components/common/monitor/advanced/tools/chartOptionsModal/counters/table/lib/models/interfaces'
-import type {
-  UI_T_ChartHost,
-  UI_T_ChartVm,
-} from '~/components/common/monitor/advanced/tools/chartOptionsModal/lib/models/types'
-import type { UI_I_ObjectItem } from '~/components/common/monitor/advanced/tools/chartOptionsModal/counters/timespan/object/lib/models/interfaces'
-
-const props = defineProps<{
-  type: UI_T_AdvancedType
-  language: string
-  optionsNames: string[]
-  localSelectedChartOptionName: string
-  customDateFrom: string
-  customDateTo: string
-  customTimeFrom: string
-  customTimeTo: string
-  totalCores: number
-  hostId: string
-  selectedObjects: string
-  objectsLoading: boolean
-  objectsData: UI_I_ObjectItem[]
-  validDateEnd: number
-  isDisabledSubmit: boolean
-  isShowAlerts: boolean
-  alerts: string[]
-  metricsItems: UI_I_VerticalTabs[]
-  localSelectedCountersKeys: number[]
-  localSelectedChartType: string
-  localSelectedTimespanType: string
-  localUnitsCount: number
-  selectedMetricsKeys: number[]
-}>()
-
-const selectedRowsLocal = defineModel<UI_I_AdvancedCounterItem[]>(
-  'selectedRows',
-  { required: true }
-)
-const localSelectedMetricLocal = defineModel<UI_T_ChartHost | UI_T_ChartVm>(
-  'selectedMetricLocal',
-  { required: true }
-)
-const localPeriodTypeLocal = defineModel<string>('localPeriodType', {
-  required: true,
-})
-const customTimeLocal = defineModel<string>('localCustomTime', {
-  required: true,
-})
-const localSelectedChartTypeLocal = defineModel<string>(
-  'selectedChartTypeLocal',
-  {
-    required: true,
-  }
-)
-const timespanTypeLocal = defineModel<string>('timespanType', {
-  required: true,
-})
-const unitCountLocal = defineModel<number>('unitCount', {
-  required: true,
-})
-
-const emits = defineEmits<{
-  (event: 'hide-main-modal'): void
-  (event: 'submit-main-modal'): void
-  (event: 'remove-alerts'): void
-  (event: 'save-options', value: string): void
-  (event: 'check-validations'): void
-  (event: 'select-local-option-name', value: string): void
-  (event: 'delete-chart-name', value: string): void
-  (event: 'update-custom-date-from', value: string): void
-  (event: 'update-custom-date-to', value: string): void
-  (event: 'update-custom-time-from', value: string): void
-  (event: 'update-custom-time-to', value: string): void
-  (event: 'local-selected-objects', value: string): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-</script>
-
-<style scoped lang="scss">
-.chart-options-modal {
-  .loader-on :deep(.modal-body) {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-  :deep(.modal-title) {
-    text-transform: capitalize;
-  }
-
-  #loader {
-    min-height: 90px;
-    text-align: center;
-  }
-
-  .chart-options-content {
-    display: flex;
-    flex-direction: row;
-    flex-basis: 90%;
-    overflow-y: hidden;
-  }
-}
-@media (max-width: 1024px) {
-  .chart-options-content {
-    flex-direction: column !important;
-  }
-}
-</style>

package/components/common/monitor/advanced/tools/chartOptionsModal/NotificationNew.vue

@@ -1,20 +0,0 @@
-<template>
-  <ui-alert
-    :messages="props.alerts"
-    test-id="chart-options-alerts"
-    class="chart-options-alerts"
-    hide-close-button
-  />
-</template>
-
-<script setup lang="ts">
-const props = defineProps<{
-  alerts: string[]
-}>()
-</script>
-
-<style scoped lang="scss">
-.chart-options-alerts {
-  margin-bottom: 24px;
-}
-</style>

package/components/common/monitor/advanced/tools/chartOptionsModal/NotificationOld.vue

@@ -1,27 +0,0 @@
-<template>
-  <atoms-alert
-    v-show="props.alerts.length"
-    status="alert-danger"
-    :items="props.alerts"
-    class="notification"
-    test-id="notification-alert"
-    @remove="onRemove"
-  >
-  </atoms-alert>
-</template>
-
-<script setup lang="ts">
-const props = defineProps<{
-  alerts: string[]
-}>()
-
-const emits = defineEmits<{
-  (event: 'remove-alerts'): void
-}>()
-
-const onRemove = (): void => {
-  emits('remove-alerts')
-}
-</script>
-
-<style scoped lang="scss"></style>

package/components/common/monitor/advanced/tools/chartOptionsModal/actions/ActionsNew.vue

@@ -1,145 +0,0 @@
-<template>
-  <div class="chart-options-actions">
-    <ui-select
-      v-model="localSelectedChartOptionLocal"
-      :items="props.chartOptions"
-      :label="localization.common.options"
-      select-width="100%"
-      show-text
-      test-id="chart-options-select"
-    />
-    <ui-input
-      v-model="newChartName"
-      :placeholder="localization.common.name"
-      :label="localization.common.name"
-      :error="newChartNameError"
-      test-id="chart-name"
-      type="text"
-      input-style="rounded"
-    />
-    <ui-button
-      test-id="save-option-name"
-      type="primary"
-      variant="text"
-      size="md"
-      is-without-sizes
-      @click="onSaveNewName"
-    >
-      <template #icon>
-        <ui-icon name="check" width="18" height="18"></ui-icon>
-      </template>
-      <span>{{ localization.common.save }}</span>
-    </ui-button>
-    <span class="seperator-name-actions"></span>
-    <ui-button
-      :disabled="!props.isDisabledDeleteAction"
-      test-id="delete-option-name"
-      type="primary"
-      variant="text"
-      size="md"
-      is-without-sizes
-      @click="emits('delete-action')"
-    >
-      <template #icon>
-        <ui-icon name="delete" width="18" height="18"></ui-icon>
-      </template>
-      <span>{{ localization.common.delete }}</span>
-    </ui-button>
-  </div>
-
-  <common-modals-confirmation
-    v-if="isConfirmModalLocal"
-    :headline="localization.inventoryMonitor.deletingSavedSettings"
-    :description="props.confirmModalDesc"
-    @hide-modal="isConfirmModalLocal = false"
-    @confirm="onApplyDelete"
-  />
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_OptionItem } from '~/components/atoms/lib/models/interfaces'
-
-const localSelectedChartOptionLocal = defineModel<string>(
-  'localSelectedChartOption',
-  {
-    required: true,
-  }
-)
-const isConfirmModalLocal = defineModel<boolean>('isConfirmModal', {
-  required: true,
-})
-
-const props = defineProps<{
-  chartOptions: UI_I_OptionItem[]
-  isDisabledDeleteAction: boolean
-  confirmModalDesc: string
-}>()
-
-const emits = defineEmits<{
-  (event: 'save-options', value: string): void
-  (event: 'delete-action'): void
-  (event: 'apply-delete'): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const newChartName = ref<string>('')
-watch(
-  () => props.isDisabledDeleteAction,
-  (newValue) => {
-    newChartName.value = newValue ? localSelectedChartOptionLocal.value : ''
-  }
-)
-
-const newChartNameError = ref<string>('')
-
-const onSaveNewName = (): void => {
-  if (!newChartName.value) {
-    newChartNameError.value = localization.value.common.fieldRequired
-  } else {
-    newChartNameError.value = ''
-    emits('save-options', newChartName.value)
-  }
-}
-
-const onApplyDelete = (): void => {
-  emits('apply-delete')
-  newChartName.value = ''
-}
-</script>
-
-<style>
-:root {
-  --chart-options-name-actions-seperate-border-color: #e9ebeda3;
-}
-:root.dark-theme {
-  --chart-options-name-actions-seperate-border-color: #e9ebed1f;
-}
-</style>
-<style scoped lang="scss">
-.chart-options-actions {
-  display: grid;
-  grid-template-columns: 2fr 2fr max-content max-content max-content;
-  align-items: center;
-  grid-gap: 16px;
-
-  & > :first-child {
-    margin-top: -16px;
-  }
-  & > :nth-child(2) {
-    height: 36px;
-  }
-  .seperator-name-actions {
-    border: 1px solid var(--chart-options-name-actions-seperate-border-color);
-    height: 24px;
-  }
-  #delete-option-name {
-    color: #ea3223;
-
-    &:disabled {
-      color: #bdc3c7;
-    }
-  }
-}
-</style>

package/components/common/monitor/advanced/tools/chartOptionsModal/actions/ActionsOld.vue

@@ -1,108 +0,0 @@
-<template>
-  <div class="horizontal-flex-container">
-    <div class="horizontal-flex-container">
-      <label for="chartOptionsSelect" class="label-select"
-        >{{ localization.inventoryMonitor.chartOptions }}:</label
-      >
-      <div class="select">
-        <select
-          id="chartOptionsSelect"
-          v-model="localSelectedChartOptionLocal"
-          data-id="chart-options-select"
-        >
-          <option
-            v-for="item in props.chartOptions"
-            :key="item.value"
-            :value="item.value"
-          >
-            {{ item.text }}
-          </option>
-        </select>
-      </div>
-    </div>
-    <div>
-      <button
-        class="btn chart-options-save-button"
-        data-id="chart-options-save-button"
-        @click="emits('show-save-options-modal')"
-      >
-        {{ localization.inventoryMonitor.saveOptionsAs }}...
-      </button>
-      <common-monitor-advanced-tools-chart-options-modal-actions-save-options-modal
-        v-if="props.isShowSaveOptionsModal"
-        @hide="emits('hide-save-options-modal')"
-        @save="emits('save-options', $event)"
-      />
-      <button
-        class="btn chart-options-delete-button"
-        :disabled="!props.isDisabledDeleteAction"
-        data-id="chart-options-delete-button"
-        @click="emits('delete-action')"
-      >
-        {{ localization.inventoryMonitor.deleteOptions }}
-      </button>
-    </div>
-  </div>
-
-  <common-modals-confirmation
-    v-if="isConfirmModalLocal"
-    :headline="localization.inventoryMonitor.deletingSavedSettings"
-    :description="props.confirmModalDesc"
-    @hide-modal="isConfirmModalLocal = false"
-    @confirm="emits('apply-delete')"
-  />
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_OptionItem } from '~/components/atoms/lib/models/interfaces'
-
-const localSelectedChartOptionLocal = defineModel<string>(
-  'localSelectedChartOption',
-  {
-    required: true,
-  }
-)
-const isConfirmModalLocal = defineModel<boolean>('isConfirmModal', {
-  required: true,
-})
-
-const props = defineProps<{
-  chartOptions: UI_I_OptionItem[]
-  isShowSaveOptionsModal: boolean
-  isDisabledDeleteAction: boolean
-  confirmModalDesc: string
-}>()
-
-const emits = defineEmits<{
-  (event: 'show-save-options-modal'): void
-  (event: 'hide-save-options-modal'): void
-  (event: 'save-options', value: string): void
-  (event: 'delete-action'): void
-  (event: 'apply-delete'): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-</script>
-
-<style scoped lang="scss">
-.horizontal-flex-container {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-
-  .chart-options-save-button,
-  .chart-options-delete-button {
-    border: none;
-    background: unset;
-    margin: 0;
-    font-size: 11px;
-    color: var(--action-icon-color);
-    box-shadow: unset;
-  }
-
-  .chart-options-delete-button {
-    text-transform: uppercase;
-  }
-}
-</style>

package/components/common/monitor/advanced/tools/chartOptionsModal/counters/CountersNew.vue

@@ -1,97 +0,0 @@
-<template>
-  <div class="chart-options-bottom-right-container">
-    <common-monitor-advanced-tools-chart-options-modal-counters-table
-      :chart="props.chart"
-      :type="props.type"
-      :selected-keys="props.selectedKeys"
-      :total-cores="props.totalCores"
-      @select-row="emits('select-row', $event)"
-      @total-items="totalMetricItemsLocal = $event"
-    />
-    <common-monitor-advanced-tools-chart-options-modal-counters-timespan
-      :type="props.type"
-      :chart="props.chart"
-      :language="props.language"
-      :selected-chart-type="props.selectedChartType"
-      :selected-timespan-type="props.selectedTimespanType"
-      :units-count="props.unitsCount"
-      :period-type="props.periodType"
-      :selected-custom-time="props.selectedCustomTime"
-      :custom-date-from="props.customDateFrom"
-      :custom-date-to="props.customDateTo"
-      :custom-time-from="props.customTimeFrom"
-      :custom-time-to="props.customTimeTo"
-      :total-cores="props.totalCores"
-      :host-id="props.hostId"
-      :selected-metrics-keys="props.selectedMetricsKeys"
-      :total-metric-items="totalMetricItemsLocal"
-      :selected-objects="props.selectedObjects"
-      :objects-loading="props.objectsLoading"
-      :objects-data="props.objectsData"
-      :valid-date-end="props.validDateEnd"
-      @update-chart-type="emits('update-chart-type', $event)"
-      @update-custom-time="emits('update-custom-time', $event)"
-      @update-timespan-type="emits('update-timespan-type', $event)"
-      @update-unit-count="emits('update-unit-count', $event)"
-      @update-period-type="emits('update-period-type', $event)"
-      @update-custom-date-from="emits('update-custom-date-from', $event)"
-      @update-custom-date-to="emits('update-custom-date-to', $event)"
-      @update-custom-time-from="emits('update-custom-time-from', $event)"
-      @update-custom-time-to="emits('update-custom-time-to', $event)"
-      @select-objects="emits('select-objects', $event)"
-    />
-  </div>
-</template>
-
-<script setup lang="ts">
-import type {
-  UI_T_ChartHost,
-  UI_T_ChartVm,
-} from '~/components/common/monitor/advanced/tools/chartOptionsModal/lib/models/types'
-import type { UI_T_AdvancedType } from '~/components/common/monitor/advanced/lib/models/types'
-import type { UI_I_AdvancedCounterItem } from '~/components/common/monitor/advanced/tools/chartOptionsModal/counters/table/lib/models/interfaces'
-import type { UI_I_ObjectItem } from '~/components/common/monitor/advanced/tools/chartOptionsModal/counters/timespan/object/lib/models/interfaces'
-
-const totalMetricItemsLocal = defineModel<number>('totalMetricItems', {
-  required: true,
-})
-
-const props = defineProps<{
-  language: string
-  chart: UI_T_ChartHost | UI_T_ChartVm
-  type: UI_T_AdvancedType
-  selectedKeys: number[]
-  selectedChartType: string
-  selectedTimespanType: string
-  unitsCount: number
-  periodType: string
-  selectedCustomTime: string
-  customDateFrom: string
-  customDateTo: string
-  customTimeFrom: string
-  customTimeTo: string
-  totalCores: number
-  hostId: string
-  selectedMetricsKeys: number[]
-  selectedObjects: string
-  objectsLoading: boolean
-  objectsData: UI_I_ObjectItem[]
-  validDateEnd: number
-}>()
-
-const emits = defineEmits<{
-  (event: 'select-row', value: UI_I_AdvancedCounterItem[]): void
-  (event: 'update-chart-type', value: string): void
-  (event: 'update-custom-time', value: string): void
-  (event: 'update-timespan-type', value: string): void
-  (event: 'update-unit-count', value: number): void
-  (event: 'update-period-type', value: string): void
-  (event: 'update-custom-date-from', value: string): void
-  (event: 'update-custom-date-to', value: string): void
-  (event: 'update-custom-time-from', value: string): void
-  (event: 'update-custom-time-to', value: string): void
-  (event: 'select-objects', value: string): void
-}>()
-</script>
-
-<style scoped lang="scss"></style>