bfg-common 1.4.791 → 1.4.793

package/components/common/pages/packages/Packages.vue

@@ -1,208 +1,208 @@
-<template>
-  <div class="packages-page">
-    <common-headline :headline="localization.common.softwarePackages" />
-
-    <div class="grid-toolbar">
-      <common-tools-actions
-        test-id="packages-tools-panel"
-        :actions="actions"
-        @click="onClickAction"
-      >
-        <template #icon="{ data }">
-          <span
-            v-if="data.type === 'updates'"
-            class="vx-icon-import icon"
-          ></span>
-          <span
-            v-if="data.type === 'refresh'"
-            class="vsphere-icon-reset icon"
-          ></span>
-        </template>
-      </common-tools-actions>
-    </div>
-
-    <common-pages-packages-table-view
-      v-model="selectedRow"
-      :data-table="props.packagesData?.items || []"
-      :total-items="props.packagesData?.total_items || 0"
-      :total-pages="props.packagesData?.total_pages || 1"
-      :pagination="pagination"
-      :loading="props.loading"
-      @pagination="onPagination"
-      @sort="onSort"
-    />
-  </div>
-</template>
-
-<script lang="ts" setup>
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type {
-  UI_I_Pagination,
-} from '~/lib/models/table/interfaces'
-import type { UI_T_SelectedRow } from '~/components/atoms/table/dataGrid/lib/models/types'
-import type { UI_I_Button } from '~/components/common/tools/lib/models/interfaces'
-import type { UI_T_Action } from '~/components/common/pages/packages/lib/models/types'
-import { actionsFunc } from '~/components/common/pages/packages/lib/config/actions'
-
-
-const selectedRow = defineModel<UI_T_SelectedRow>('selectedRow')
-const pagination = defineModel<UI_I_Pagination>('pagination')
-
-const props = defineProps<{
-  packagesData: any | null
-  loading: boolean
-}>()
-const emits = defineEmits<{
-  (event: 'sort', value: string): void
-  (event: 'pagination', value: UI_I_Pagination): void
-  (event: 'action', value: [UI_T_Action, FormData | null]): void
-  (event: 'refresh'): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const disabledActions = ref<string[]>([
-  'enable',
-  'disable',
-  'on',
-  'off',
-  'remove',
-])
-
-const actions = computed<UI_I_Button[]>(() =>
-  actionsFunc(localization.value, disabledActions.value)
-)
-
-const onPagination = (value: UI_I_Pagination): void => {
-  emits('pagination', value)
-}
-const onSort = (value: string): void => {
-  emits('sort', value)
-}
-
-const checkAllActions = (): void => {
-  if (typeof selectedRow.value !== 'number') return
-
-  const selectedPackage = props.packagesData?.items[selectedRow.value]
-  if (!selectedPackage) return
-
-  disabledActions.value = []
-  if (window.location.hostname === 'dev-pn.aobfg.ru') return
-
-  if (selectedPackage.not_runnable || selectedPackage.required) {
-    disabledActions.value = ['enable', 'disable', 'on', 'off']
-  }
-
-  if (selectedPackage.required) {
-    disabledActions.value = ['remove']
-  }
-}
-watch(
-  selectedRow,
-  () => {
-    checkAllActions()
-  },
-  { immediate: true }
-)
-
-const onAction = async (
-  action: UI_T_Action,
-  file: FormData | null = null
-): Promise<void> => {
-  emits('action', [action, file])
-}
-const onRefresh = (): void => {
-  emits('refresh')
-}
-const onChangeFiles = (event: Event | undefined): void => {
-  if (!event) return
-
-  const target = event.target as HTMLInputElement
-  if (!target.files) return
-
-  const file = target.files[0]
-
-  const formData = new FormData()
-  formData.append('package', file)
-  onAction('update', formData)
-}
-
-const onClickAction = (type: string, file?: Event): void => {
-  switch (type) {
-    case 'updates':
-      onChangeFiles(file)
-      break
-    case 'refresh':
-      onRefresh()
-      break
-    case 'enable':
-      onAction('enable')
-      break
-    case 'disable':
-      onAction('disable')
-      break
-    case 'on':
-      onAction('on')
-      break
-    case 'off':
-      onAction('off')
-      break
-    case 'remove':
-      onAction('remove')
-      break
-  }
-}
-</script>
-
-<style>
-:root {
-  --action-link-container-bg-color: #e9f6fd;
-  --vui-action-label-color: #333;
-}
-:root.dark-theme {
-  --action-link-container-bg-color: #29414e;
-  --vui-action-label-color: #adbbc4;
-}
-</style>
-
-<style lang="scss" scoped>
-@import '~/assets/scss/common/mixins.scss';
-
-.packages-page {
-  @include flex($dir: column);
-  height: 100%;
-
-  .grid-toolbar {
-    .icon {
-      display: block;
-      width: 16px;
-      height: 16px;
-      min-width: 16px;
-      min-height: 16px;
-      background-size: 100% auto;
-      margin-right: 5px;
-    }
-
-    :deep(.btn) {
-      text-transform: none;
-      font-size: 13px;
-      font-weight: normal;
-      color: var(--vui-action-label-color);
-      min-width: unset;
-      padding: 4px;
-      line-height: normal;
-      margin-right: 4px;
-      display: flex;
-      align-items: center;
-      letter-spacing: normal;
-
-      &:not(:disabled):hover {
-        color: var(--vui-action-label-color);
-        text-decoration: none;
-        background-color: var(--action-link-container-bg-color);
-        border: 1px solid #c7e9ff;
-      }
-    }
-  }
-}
-</style>
+<template>
+  <div class="packages-page">
+    <common-headline :headline="localization.common.softwarePackages" />
+
+    <div class="grid-toolbar">
+      <common-tools-actions
+        test-id="packages-tools-panel"
+        :actions="actions"
+        @click="onClickAction"
+      >
+        <template #icon="{ data }">
+          <span
+            v-if="data.type === 'updates'"
+            class="vx-icon-import icon"
+          ></span>
+          <span
+            v-if="data.type === 'refresh'"
+            class="vsphere-icon-reset icon"
+          ></span>
+        </template>
+      </common-tools-actions>
+    </div>
+
+    <common-pages-packages-table-view
+      v-model="selectedRow"
+      :data-table="props.packagesData?.items || []"
+      :total-items="props.packagesData?.total_items || 0"
+      :total-pages="props.packagesData?.total_pages || 1"
+      :pagination="pagination"
+      :loading="props.loading"
+      @pagination="onPagination"
+      @sort="onSort"
+    />
+  </div>
+</template>
+
+<script lang="ts" setup>
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type {
+  UI_I_Pagination,
+} from '~/lib/models/table/interfaces'
+import type { UI_T_SelectedRow } from '~/components/atoms/table/dataGrid/lib/models/types'
+import type { UI_I_Button } from '~/components/common/tools/lib/models/interfaces'
+import type { UI_T_Action } from '~/components/common/pages/packages/lib/models/types'
+import { actionsFunc } from '~/components/common/pages/packages/lib/config/actions'
+
+
+const selectedRow = defineModel<UI_T_SelectedRow>('selectedRow')
+const pagination = defineModel<UI_I_Pagination>('pagination')
+
+const props = defineProps<{
+  packagesData: any | null
+  loading: boolean
+}>()
+const emits = defineEmits<{
+  (event: 'sort', value: string): void
+  (event: 'pagination', value: UI_I_Pagination): void
+  (event: 'action', value: [UI_T_Action, FormData | null]): void
+  (event: 'refresh'): void
+}>()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const disabledActions = ref<string[]>([
+  'enable',
+  'disable',
+  'on',
+  'off',
+  'remove',
+])
+
+const actions = computed<UI_I_Button[]>(() =>
+  actionsFunc(localization.value, disabledActions.value)
+)
+
+const onPagination = (value: UI_I_Pagination): void => {
+  emits('pagination', value)
+}
+const onSort = (value: string): void => {
+  emits('sort', value)
+}
+
+const checkAllActions = (): void => {
+  if (typeof selectedRow.value !== 'number') return
+
+  const selectedPackage = props.packagesData?.items[selectedRow.value]
+  if (!selectedPackage) return
+
+  disabledActions.value = []
+  if (window.location.hostname === 'dev-pn.aobfg.ru') return
+
+  if (selectedPackage.not_runnable || selectedPackage.required) {
+    disabledActions.value = ['enable', 'disable', 'on', 'off']
+  }
+
+  if (selectedPackage.required) {
+    disabledActions.value = ['remove']
+  }
+}
+watch(
+  selectedRow,
+  () => {
+    checkAllActions()
+  },
+  { immediate: true }
+)
+
+const onAction = async (
+  action: UI_T_Action,
+  file: FormData | null = null
+): Promise<void> => {
+  emits('action', [action, file])
+}
+const onRefresh = (): void => {
+  emits('refresh')
+}
+const onChangeFiles = (event: Event | undefined): void => {
+  if (!event) return
+
+  const target = event.target as HTMLInputElement
+  if (!target.files) return
+
+  const file = target.files[0]
+
+  const formData = new FormData()
+  formData.append('package', file)
+  onAction('update', formData)
+}
+
+const onClickAction = (type: string, file?: Event): void => {
+  switch (type) {
+    case 'updates':
+      onChangeFiles(file)
+      break
+    case 'refresh':
+      onRefresh()
+      break
+    case 'enable':
+      onAction('enable')
+      break
+    case 'disable':
+      onAction('disable')
+      break
+    case 'on':
+      onAction('on')
+      break
+    case 'off':
+      onAction('off')
+      break
+    case 'remove':
+      onAction('remove')
+      break
+  }
+}
+</script>
+
+<style>
+:root {
+  --action-link-container-bg-color: #e9f6fd;
+  --vui-action-label-color: #333;
+}
+:root.dark-theme {
+  --action-link-container-bg-color: #29414e;
+  --vui-action-label-color: #adbbc4;
+}
+</style>
+
+<style lang="scss" scoped>
+@import '~/assets/scss/common/mixins.scss';
+
+.packages-page {
+  @include flex($dir: column);
+  height: 100%;
+
+  .grid-toolbar {
+    .icon {
+      display: block;
+      width: 16px;
+      height: 16px;
+      min-width: 16px;
+      min-height: 16px;
+      background-size: 100% auto;
+      margin-right: 5px;
+    }
+
+    :deep(.btn) {
+      text-transform: none;
+      font-size: 13px;
+      font-weight: normal;
+      color: var(--vui-action-label-color);
+      min-width: unset;
+      padding: 4px;
+      line-height: normal;
+      margin-right: 4px;
+      display: flex;
+      align-items: center;
+      letter-spacing: normal;
+
+      &:not(:disabled):hover {
+        color: var(--vui-action-label-color);
+        text-decoration: none;
+        background-color: var(--action-link-container-bg-color);
+        border: 1px solid #c7e9ff;
+      }
+    }
+  }
+}
+</style>

package/components/common/pages/tasks/Tasks.vue

@@ -53,6 +53,7 @@ const getTasks = async (): Promise<void> => {
   const payload: UI_I_DataTableQuery = {
     ...pagination.value,
     sortBy: sort.value || '',
+    filter: filter.value || '',
   }
   await $store.dispatch('tasks/A_GET_TASKS', payload)
 }

package/components/common/pages/tasks/table/Table.vue

@@ -6,8 +6,8 @@
     :loading="props.loading"
     :total-pages="props.totalPages"
     :total-items="props.totalItems"
+    :texts="texts"
     class="task-table"
-    :texts="tableTexts"
     @sort="onSorting"
     @pagination="onPagination"
     @column-filter="onColumnFilter"
@@ -41,6 +41,8 @@
         v-if="item.data.error"
         :id="item.data.testId"
         :error="item.data.error"
+        :opened-error="openedError"
+        @toggle-error="onToggleError"
       />
     </template>
 
@@ -48,26 +50,26 @@
       <div class="actions">
         <ui-button
           variant="text"
-          :test-id="`resent-task-item-${item.data.id}-action`"
+          :test-id="`data-table-task-action-${item.data.id}`"
           is-without-height
           is-without-sizes
           @click.stop="onToggleActions(item.data.id)"
         >
           <span
-            :class="['action-icon', { active: actionsIsShow[item.data.id] }]"
+            :class="['action-icon', { active: actionsShowId === item.data.id }]"
           >
             <ui-icon name="vertical-dotes" width="20" height="20" />
           </span>
         </ui-button>
         <ui-dropdown
-          :show="actionsIsShow[item.data.id] || false"
-          :test-id="`resent-task-item-action-${item.data.id}`"
+          :show="actionsShowId === item.data.id"
+          :test-id="`data-table-task-dropdown-${item.data.id}`"
           :items="actions"
-          :elem-id="`resent-task-item-${item.data.id}-action`"
+          :elem-id="`data-table-task-action-${item.data.id}`"
           left
           width="max-content"
-          @select="onSelectAction(item.data.target, $event, item.data.id)"
-          @hide="onHideActionsDropdown(item.data.id)"
+          @select="onSelectAction(item.data.target, $event)"
+          @hide="onHideActionsDropdown"
         >
           <template #row="{ item: dropMenu }">
             <ui-icon
@@ -97,6 +99,7 @@ import type {
   UI_I_DataTableHeader,
   UI_I_DataTableBody,
   UI_I_Pagination,
+  UI_I_TableTexts,
 } from '~/node_modules/bfg-uikit/components/ui/dataTable/models/interfaces'
 import type { UI_T_ArbitraryObject } from '~/node_modules/bfg-uikit/models/types'
 import type { UI_T_Project, UI_T_ProcuratorTypeNodes } from '~/lib/models/types'
@@ -128,7 +131,21 @@ const emits = defineEmits<{
 const localization = computed<UI_I_Localization>(() => useLocal())
 const { $store }: any = useNuxtApp()
 
-const actionsIsShow = ref<boolean[]>([])
+const texts = computed<UI_I_TableTexts>(() => ({
+  searchHere: localization.value.common.searchHere,
+  rowsPerPage: localization.value.common.rowsPerPage,
+  of: localization.value.common.of,
+  selected: localization.value.common.selected,
+  columns: localization.value.common.columns,
+  previous: localization.value.common.previous,
+  next: localization.value.common.next,
+  noItemsFound: localization.value.common.noItemsFound,
+  exportAll: localization.value.common.exportAll,
+  exportSelected: localization.value.common.exportSelected,
+  all: localization.value.common.all,
+}))
+
+const actionsShowId = ref<number>(-1)
 
 const data = computed<UI_I_DataTable>(() => ({
   id: 'tasks-table',
@@ -153,6 +170,17 @@ watch(
   },
   { deep: true, immediate: true }
 )
+
+const openedError = ref<string>('')
+
+const onToggleError = (value: string): void => {
+  if (!value || value === openedError.value) {
+    openedError.value = ''
+  } else {
+    openedError.value = value
+  }
+}
+
 const onSorting = (value: string): void => {
   emits('sort', value)
 }
@@ -179,12 +207,15 @@ const actions = computed<UI_I_Dropdown[]>(() =>
   getTargetActionsFunc(localization.value, props.project)
 )
 const onToggleActions = (id: number): void => {
-  actionsIsShow.value[id] = !actionsIsShow.value[id]
+  if (actionsShowId.value === id) {
+    actionsShowId.value = -1
+  } else {
+    actionsShowId.value = id
+  }
 }
 const onSelectAction = (
   data: UI_I_TableTarget<typeof props.project>,
-  action: 'view-target' | 'view-zone',
-  actionId: number
+  action: 'view-target' | 'view-zone'
 ): void => {
   switch (action) {
     case 'view-target':
@@ -194,10 +225,10 @@ const onSelectAction = (
       onSelectNodeOfTree({ ...data, type: 'zone', nav: 'h' })
       break
   }
-  onHideActionsDropdown(actionId)
+  onHideActionsDropdown()
 }
-const onHideActionsDropdown = (id: number): void => {
-  actionsIsShow.value[id] = false
+const onHideActionsDropdown = (): void => {
+  actionsShowId.value = -1
 }
 
 const onSelectNodeOfTree = (
@@ -217,21 +248,6 @@ const onSelectNodeOfTree = (
 
   $store.dispatch('inventory/A_SELECT_NODE', { node, type })
 }
-
-const tableTexts = computed<UI_I_TableTexts>(() => {
-  return {
-    rowsPerPage: localization.value.common.rowsPerPage,
-    of: localization.value.common.of,
-    searchHere: localization.value.common.searchHere,
-    selected: localization.value.common.selected,
-    columns: localization.value.common.columns,
-    previous: localization.value.common.previous,
-    next: localization.value.common.next,
-    noItemsFound: localization.value.common.noItemsFound,
-    exportSelected: localization.value.common.exportSelected,
-    exportAll: localization.value.common.exportAll,
-  }
-})
 </script>
 
 <style>

package/components/common/pages/tasks/table/errorInfo/ErrorInfo.vue

@@ -6,11 +6,12 @@
       width="16px"
       height="16px"
       :class="['info-icon pointer', { show: isShowInfo }]"
-      @click.stop="isShowInfo = !isShowInfo"
+      @click.stop="emits('toggle-error', props.id)"
     />
     <ui-popup-window
       v-model="isShowInfo"
-      width="232px"
+      max-width="232px"
+      min-width="232px"
       top
       left
       :elem-id="`task-error-info-icon-${props.id}`"
@@ -26,7 +27,7 @@
             class="pointer hide-icon"
             width="16px"
             height="16px"
-            @click.stop="isShowInfo = false"
+            @click.stop="emits('toggle-error', '')"
           />
         </div>
 
@@ -44,11 +45,23 @@ import type { UI_I_Localization } from '~/lib/models/interfaces'
 const props = defineProps<{
   id: string
   error: string
+  openedError: string
 }>()
 
 const localization = computed<UI_I_Localization>(() => useLocal())
 
-const isShowInfo = ref<boolean>(false)
+const emits = defineEmits<{
+  (event: 'toggle-error', value: string): void
+}>()
+
+const isShowInfo = computed<boolean>({
+  get() {
+    return props.openedError === props.id
+  },
+  set() {
+    emits('toggle-error', '')
+  },
+})
 </script>
 
 <style lang="scss" scoped>

package/components/common/pages/tasks/table/expandDetails/ExpandDetails.vue

@@ -34,6 +34,8 @@
           v-if="normalizedTaskDetails[2].data.error"
           :id="`${normalizedTaskDetails[2].data.testId}-expand-details`"
           :error="normalizedTaskDetails[2].data.error"
+          :opened-error="openedError"
+          @toggle-error="onToggleError"
         />
       </span>
     </div>
@@ -100,6 +102,16 @@ const normalizedTaskDetails = computed<UI_I_DataTableBodyData[]>(() => {
   ) // Фильтр по номерам колонок
 })
 
+const openedError = ref<string>('')
+
+const onToggleError = (value: string): void => {
+  if (!value || value === openedError.value) {
+    openedError.value = ''
+  } else {
+    openedError.value = value
+  }
+}
+
 const onSelectNodeOfTree = (data: any): void => {
   if (!data.isLink) return