bfg-common 1.6.96 → 1.6.97

package/components/common/pages/scheduledTasks/modals/common/{newTaskForm/NewTaskForm.vue → taskForm/Old.vue}

@@ -9,7 +9,7 @@
         <label
           :class="[
             'clr-control-container tooltip tooltip-validation tooltip-xs tooltip-bottom-left clr-col-md-8',
-            userNameErrorText && 'invalid',
+            props.taskNameErrorText && 'invalid',
           ]"
         >
           <input
@@ -22,7 +22,7 @@
             @blur="onInitValidation(['taskName'])"
           />
           <span class="tooltip-content">
-            {{ userNameErrorText }}
+            {{ props.taskNameErrorText }}
           </span>
         </label>
       </div>
@@ -69,7 +69,7 @@
       <common-select-input
         v-model="model.frequency"
         :label="localization.common.run"
-        :data="frequencyMethodOptions"
+        :data="props.frequencyMethodOptions"
         class="clr-form-control run"
       >
         <template #options="{ value }">
@@ -101,80 +101,23 @@
 import type { UI_I_Localization } from '~/lib/models/interfaces'
 import type { UI_I_SelectInputItem } from '~/components/common/select/input/lib/models/interfaces'
 import type { UI_I_ScheduleNewTasksForm } from '~/components/common/pages/scheduledTasks/modals/lib/models/interfaces'
-import type { UI_I_InitialValidationFields } from '~/components/common/pages/scheduledTasks/modals/common/newTaskForm/lib/models/interfaces'
-import type { UI_T_FrequencyType } from '~/components/common/pages/scheduledTasks/modals/common/frequency/lib/models/types'
-import * as cron from '~/components/common/pages/scheduledTasks/modals/common/newTaskForm/lib/utils'
-import { frequencyMethodFunc } from '~/components/common/pages/scheduledTasks/modals/common/frequency/lib/config/frequencyOptions'
+import type { UI_I_InitialValidationFields } from '~/components/common/pages/scheduledTasks/modals/common/taskForm/lib/models/interfaces'
 
+const model = defineModel<UI_I_ScheduleNewTasksForm>({ required: true })
 const props = defineProps<{
   target: string
+  formValidationFields: UI_I_InitialValidationFields
+  taskNameErrorText: string
+  frequencyMethodOptions: UI_I_SelectInputItem[]
+}>()
+const emits = defineEmits<{
+  (event: 'init-validation', value: string[]): void
 }>()
-const model = defineModel<UI_I_ScheduleNewTasksForm>({ required: true })
 
 const localization = computed<UI_I_Localization>(() => useLocal())
 
-const initValidationFields = ref<UI_I_InitialValidationFields>({
-  taskName: false,
-})
 const onInitValidation = (types: string[]): void => {
-  types.forEach((type) => (initValidationFields.value[type] = true))
-}
-const userNameErrorText = computed<string>(() => {
-  if (!initValidationFields.value.taskName) return ''
-
-  model.value.task_name = model.value.task_name.replace(/^\s+/, '')
-
-  return !model.value.task_name ? localization.value.common.fieldRequired : ''
-})
-
-const frequencyMethodOptions = computed<UI_I_SelectInputItem[]>(() =>
-  frequencyMethodFunc(localization.value)
-)
-
-watch(
-  model,
-  (newValue: UI_I_ScheduleNewTasksForm) => {
-    newValue.cron = generateCronExpression(newValue.frequency, newValue)
-  },
-  { deep: true }
-)
-
-const generateCronExpression = (
-  runType: UI_T_FrequencyType,
-  interval: UI_I_ScheduleNewTasksForm
-): string => {
-  let cronExpression
-
-  // Генерируем cron-выражение на основе runType
-  switch (runType) {
-    case 'once':
-      const timestamp = Math.floor(
-        new Date(interval.frg_on_time).getTime() / 1000
-      )
-      cronExpression = `* * * * * ${timestamp}:0-0-0-0:once`
-      break
-    case 'after-startup':
-      const suffixDelay =
-        interval.frg_after_startup === 0 ? '' : `-${interval.frg_after_startup}`
-      cronExpression = `* * * * * after_procurator_startup${suffixDelay}` // Выполняется после запуска procurator_startup с задержой N минут
-      break
-    case 'hour':
-      cronExpression = cron.generateHourlyCronExpression(interval)
-      break
-    case 'day':
-      cronExpression = cron.generateDailyCronExpression(interval)
-      break
-    case 'week':
-      cronExpression = cron.generateWeeklyCronExpression(interval)
-      break
-    case 'month':
-      cronExpression = cron.generateMonthlyCronExpression(interval)
-      break
-    default:
-      cronExpression = '* * * * *'
-  }
-
-  return cronExpression
+  emits('init-validation', types)
 }
 </script>
 

package/components/common/pages/scheduledTasks/modals/common/taskForm/TaskForm.vue

@@ -0,0 +1,129 @@
+<template>
+  <!-- Аргумент (:template-view-mode) используется только для нового интерфейса -->
+  <component
+    :is="currentComponent"
+    v-model="scheduledTaskFormModel"
+    :target="props.target"
+    :form-validation-fields="initValidationFields"
+    :task-name-error-text="taskNameErrorText"
+    :frequency-method-options="frequencyMethodOptions"
+    :template-view-mode="props.templateViewMode"
+    @init-validation="onInitValidation"
+  />
+</template>
+
+<script lang="ts" setup>
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_SelectInputItem } from '~/components/common/select/input/lib/models/interfaces'
+import type { UI_I_ScheduleNewTasksForm } from '~/components/common/pages/scheduledTasks/modals/lib/models/interfaces'
+import type { UI_I_InitialValidationFields } from '~/components/common/pages/scheduledTasks/modals/common/taskForm/lib/models/interfaces'
+import type { UI_T_FrequencyType } from '~/components/common/pages/scheduledTasks/modals/common/frequency/lib/models/types'
+import * as cron from '~/components/common/pages/scheduledTasks/modals/common/taskForm/lib/utils'
+import { frequencyMethodFunc } from '~/components/common/pages/scheduledTasks/modals/common/frequency/lib/config/frequencyOptions'
+import type { UI_I_OptionItem } from '~/components/atoms/lib/models/interfaces'
+
+const scheduledTaskFormModel = defineModel<UI_I_ScheduleNewTasksForm>({
+  required: true,
+})
+const props = withDefaults(
+  defineProps<{
+    target: string
+    templateViewMode?: 'horizontal' | 'vertical'
+  }>(),
+  { templateViewMode: 'vertical' }
+)
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+const { $store }: any = useNuxtApp()
+
+const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
+const currentComponent = computed(() =>
+  isNewView.value
+    ? defineAsyncComponent(() => import('./New.vue'))
+    : defineAsyncComponent(() => import('./Old.vue'))
+)
+
+const initValidationFields = ref<UI_I_InitialValidationFields>({
+  taskName: false,
+})
+const onInitValidation = (
+  types: (keyof UI_I_InitialValidationFields)[]
+): void => {
+  types.forEach((type) => (initValidationFields.value[type] = true))
+}
+
+const taskNameErrorText = computed<string>(() => {
+  if (!initValidationFields.value.taskName) return ''
+
+  scheduledTaskFormModel.value.task_name =
+    scheduledTaskFormModel.value.task_name.replace(/^\s+/, '')
+
+  return !scheduledTaskFormModel.value.task_name
+    ? localization.value.common.fieldRequired
+    : ''
+})
+
+const frequencyMethodOptions = computed<UI_I_SelectInputItem[]>(() =>
+  frequencyMethodFunc(localization.value)
+)
+
+watch(
+  scheduledTaskFormModel,
+  (newValue: UI_I_ScheduleNewTasksForm) => {
+    newValue.cron = generateCronExpression(newValue.frequency, newValue)
+  },
+  { deep: true }
+)
+
+const generateCronExpression = (
+  runType: UI_T_FrequencyType,
+  interval: UI_I_ScheduleNewTasksForm
+): string => {
+  let cronExpression
+
+  // Генерируем cron-выражение на основе runType
+  switch (runType) {
+    case 'once':
+      const timestamp = Math.floor(
+        new Date(interval.frg_on_time).getTime() / 1000
+      )
+      cronExpression = `* * * * * ${timestamp}:0-0-0-0:once`
+      break
+    case 'after-startup':
+      const suffixDelay =
+        interval.frg_after_startup === 0 ? '' : `-${interval.frg_after_startup}`
+      cronExpression = `* * * * * after_procurator_startup${suffixDelay}` // Выполняется после запуска procurator_startup с задержой N минут
+      break
+    case 'hour':
+      cronExpression = cron.generateHourlyCronExpression(interval)
+      break
+    case 'day':
+      cronExpression = cron.generateDailyCronExpression(interval)
+      break
+    case 'week':
+      cronExpression = cron.generateWeeklyCronExpression(interval)
+      break
+    case 'month':
+      cronExpression = cron.generateMonthlyCronExpression(interval)
+      break
+    default:
+      cronExpression = '* * * * *'
+  }
+
+  return cronExpression
+}
+
+// Используется только для нового интерфейса и вызывается в родительском компоненте
+// Запускаем валидацию всех полей
+const isValidateForm = (): boolean => {
+  onInitValidation(['taskName'])
+
+  const errorChecks = [taskNameErrorText.value]
+
+  // если поле невалидно — значение будет непустым
+  return errorChecks.every((text) => !text?.length)
+}
+defineExpose({
+  isValidateForm,
+})
+</script>

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

@@ -1,93 +1,39 @@
 <template>
-  <div class="data-table-view">
-    <atoms-table-data-grid
-      v-model:selected-row="selectedScheduledTaskLocal"
-      v-model:page-size="pagination.pageSize"
-      v-model:page="pagination.page"
-      :head-items="headItems"
-      :body-items="bodyItems"
-      :total-items="props.totalItems"
-      :total-pages="props.totalPages"
-      :items-per-page="itemsPerPage"
-      :z-index-header-shift="2"
-      :loading="loading"
-      type="radio"
-      class="data-table"
-      test-id="scheduled-tasks-table"
-      hide-pagination
-      hide-page-size
-      off-select-by-row
-      server-off
-    >
-      <template #icon="{ item }">
-        <atoms-the-icon :name="item.data.iconClassName" class="icon" />
-        <span :title="item.text" class="text-ellipsis">
-          {{ item.text }}
-        </span>
-      </template>
-
-      <template #toggleBlock="{ item }">
-        <common-pages-scheduled-tasks-table-expand-details
-          :data="item[0].data.expandData"
-        />
-      </template>
-    </atoms-table-data-grid>
-  </div>
+  <!-- Аргументы (:selected-scheduler) используется только для нового интерфейса -->
+  <component
+    :is="currentComponent"
+    v-model="selectedScheduledTaskLocal"
+    :table-items="props.schedulerData?.items || []"
+    :total-items="props.schedulerData?.total_items || 0"
+    :total-pages="props.schedulerData?.total_pages || 1"
+    :selected-scheduler="props.selectedScheduler"
+    :is-loading="props.isLoading"
+  />
 </template>
 
 <script lang="ts" setup>
-import type {
-  UI_I_HeadItem,
-  UI_I_BodyItem,
-} from '~/components/atoms/table/dataGrid/lib/models/interfaces'
-import { itemsPerPage } from '~/components/atoms/table/dataGrid/lib/config/itemsPerPage'
 import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_Pagination } from '~/lib/models/table/interfaces'
-import type { UI_I_ScheduledTasksTableItem } from '~/components/common/pages/scheduledTasks/lib/models/interfaces'
-import * as scheduledTaskTable from '~/components/common/pages/scheduledTasks/table/lib/config/scheduledTasksTable'
+import type { UI_I_ScheduledTasks } from '~/components/common/pages/scheduledTasks/lib/models/interfaces'
 
-const props = defineProps<{
-  dataTable: UI_I_ScheduledTasksTableItem[]
-  loading: boolean
-  totalItems: number
-  totalPages: number
-}>()
 const selectedScheduledTaskLocal = defineModel<string | null>()
+const props = withDefaults(
+  defineProps<{
+    schedulerData: UI_I_ScheduledTasks
+    selectedScheduler?: UI_I_ScheduledTasks['items'][number] // используется только в новом виде
+    isLoading: boolean
+  }>(),
+  {
+    selectedScheduler: undefined,
+  }
+)
 
 const localization = computed<UI_I_Localization>(() => useLocal())
+const { $store }: any = useNuxtApp()
 
-const pagination = ref<UI_I_Pagination>({
-  page: 1,
-  pageSize: 100,
-})
-
-const headItems = computed<UI_I_HeadItem[]>(() =>
-  scheduledTaskTable.headItems(localization.value)
+const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
+const currentComponent = computed(() =>
+  isNewView.value
+    ? defineAsyncComponent(() => import('./new/New.vue'))
+    : defineAsyncComponent(() => import('./old/Old.vue'))
 )
-const bodyItems = computed<UI_I_BodyItem[][]>(() => {
-  return scheduledTaskTable.bodyItems(props.dataTable || [])
-})
 </script>
-
-<style lang="scss" scoped>
-.data-table-view {
-  overflow: hidden;
-  height: inherit;
-  margin-bottom: 10px;
-  :deep(.data-table) {
-    height: inherit;
-    .datagrid-outer-wrapper {
-      height: inherit;
-      padding-top: 0;
-      //.datagrid {
-      //  margin-top: 0;
-      //}
-    }
-  }
-  .icon {
-    width: 18px;
-    min-width: 18px;
-    margin-right: 3px;
-  }
-}
-</style>

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

@@ -5,7 +5,7 @@
 <script lang="ts" setup>
 import type { UI_I_Localization } from '~/lib/models/interfaces'
 import type { UI_I_ScheduledTasksTableItem } from '~/components/common/pages/scheduledTasks/lib/models/interfaces'
-import type { UI_I_ScheduleTableRowDetails } from '~/components/common/pages/scheduledTasks/table/lib/models/interfaces'
+import type { UI_I_ScheduleTableExpandDetails } from '~/components/common/pages/scheduledTasks/table/expandDetails/lib/models/interfaces'
 import { detailsListFunc } from '~/components/common/pages/scheduledTasks/table/expandDetails/lib/config/expandDetails'
 
 const props = defineProps<{
@@ -22,7 +22,7 @@ const currentComponent = computed(() =>
     : defineAsyncComponent(() => import('./Old.vue'))
 )
 
-const normalizedSchedulerDetails = computed<UI_I_ScheduleTableRowDetails[]>(
+const normalizedSchedulerDetails = computed<UI_I_ScheduleTableExpandDetails[]>(
   () => {
     return detailsListFunc(props.data, localization.value)
   }

package/components/common/pages/scheduledTasks/table/expandDetails/New.vue

@@ -1,14 +1,49 @@
 <template>
-  <div class="expand-details" />
+  <div class="expand-details">
+    <div
+      v-for="(item, key) in props.expandData"
+      :key="key"
+      class="expand-details__row"
+      :class="item.lastChild && 'history-run'"
+    >
+      <!-- Обычные строки -->
+      <template v-if="!Array.isArray(item.value)">
+        <span class="expand-details__label"> {{ item.text }}: </span>
+
+        <span :class="['expand-details__value', { disabled: item.disabled }]">
+          <ui-icon
+            v-if="item.iconClassName"
+            :name="item.iconClassName"
+            width="18"
+            height="18"
+            class="mr-1"
+          />
+          {{ item.value }}
+        </span>
+      </template>
+
+      <!-- History -->
+      <template v-else>
+        <div class="expand-details__label">
+          {{ item.text }}
+        </div>
+
+        <div class="expand-details__value">
+          <common-pages-scheduled-tasks-table-expand-details-history-run
+            :history-run-data="item.value"
+          />
+        </div>
+      </template>
+    </div>
+  </div>
 </template>
 
 <script lang="ts" setup>
-// import type { UI_I_DataTableBodyData } from '~/node_modules/bfg-uikit/components/ui/dataTable/models/interfaces'
-
-// const props = defineProps<{
-//   expandData: UI_I_DataTableBodyData[]
-// }>()
+import type { UI_I_ScheduleTableExpandDetails } from '~/components/common/pages/scheduledTasks/table/expandDetails/lib/models/interfaces'
 
+const props = defineProps<{
+  expandData: UI_I_ScheduleTableExpandDetails[]
+}>()
 </script>
 
 <style lang="scss" scoped>
@@ -33,9 +68,10 @@
     @extend %properties;
     color: #9da6ad;
     text-transform: capitalize;
-
-    &.events {
-      height: 18px;
+    .history-run & {
+      color: var(--title-form-first-color);
+      grid-column: 1 / -1; /* 🔥 ВАЖНО */
+      margin-top: 12px;
     }
   }
   &__value {
@@ -47,15 +83,9 @@
     .icon {
       margin-right: 4px;
     }
-  }
-  &__status {
-    @include flex($align: center);
-    .ui-chip {
-      width: max-content;
+    .history-run & {
+      grid-column: 1 / -1; /* 🔥 ВАЖНО */
     }
   }
-  &__tooltip {
-    margin-left: 6px;
-  }
 }
 </style>

package/components/common/pages/scheduledTasks/table/expandDetails/Old.vue

@@ -19,7 +19,7 @@
           !item.lastChild ? 'clr-col-4' : 'clr-col-12',
         ]"
       >
-        <template v-if="!item.lastChild">
+        <template v-if="!Array.isArray(item.value)">
           <atoms-the-icon
             v-if="item.isIconSvg"
             :name="item.iconClassName"
@@ -35,9 +35,7 @@
 
         <common-pages-scheduled-tasks-table-expand-details-history-run
           v-else
-          :data-table="item.value"
-          :total-items="item.value.length"
-          :total-pages="1"
+          :history-run-data="item.value"
           class="details-list__table"
         />
       </div>
@@ -46,14 +44,11 @@
 </template>
 
 <script lang="ts" setup>
-import type { UI_I_DataTableBodyData } from '~/node_modules/bfg-uikit/components/ui/dataTable/models/interfaces'
-// import type { UI_I_Localization } from '~/node_modules/bfg-common/lib/models/interfaces'
+import type { UI_I_ScheduleTableExpandDetails } from '~/components/common/pages/scheduledTasks/table/expandDetails/lib/models/interfaces'
 
 const props = defineProps<{
-  expandData: UI_I_DataTableBodyData[]
+  expandData: UI_I_ScheduleTableExpandDetails[]
 }>()
-
-// const localization = computed<UI_I_Localization>(() => useLocal())
 </script>
 
 <style lang="scss" scoped>

package/components/common/pages/scheduledTasks/table/expandDetails/historyRun/HistoryRun.vue

@@ -1,67 +1,29 @@
 <template>
-  <atoms-table-data-grid
-    :selected-row="null"
-    :page-size="1"
-    :page="1"
-    :head-items="headItems"
-    :body-items="bodyItems"
-    :total-items="props.totalItems"
-    :total-pages="props.totalPages"
-    :loading="false"
-    test-id="scheduled-tasks-history-runs-table"
-    class="history-runs-table"
-    off-select-by-row
-    hide-footer
-  >
-    <template #icon="{ item }">
-      <atoms-the-icon :name="item.data.iconClassName" class="icon" />
-      <span :title="item.text" class="text-ellipsis">
-        {{ item.text }}
-      </span>
-    </template>
-  </atoms-table-data-grid>
+  <component
+    :is="currentComponent"
+    :table-items="props.historyRunData || []"
+    :total-items="props.historyRunData?.length || 0"
+    :total-pages="1"
+    :is-loading="false"
+  />
 </template>
 
 <script setup lang="ts">
-import type {
-  UI_I_HeadItem,
-  UI_I_BodyItem,
-} from '~/components/atoms/table/compact/lib/models/interfaces'
 import type { UI_I_Localization } from '~/lib/models/interfaces'
 import type { UI_I_ScheduledTasksTableItem } from '~/components/common/pages/scheduledTasks/lib/models/interfaces'
-import * as historyRunTable from '~/components/common/pages/scheduledTasks/table/expandDetails/historyRun/lib/config/historyRunsTable'
 
 const props = defineProps<{
-  dataTable: UI_I_ScheduledTasksTableItem['last_5_run']
-  totalItems: number
-  totalPages: number
+  historyRunData: UI_I_ScheduledTasksTableItem['last_5_run']
 }>()
 
-const localization = computed<UI_I_Localization>(() => useLocal())
+const { $store }: any = useNuxtApp()
 
-const headItems = computed<UI_I_HeadItem[]>(() =>
-  historyRunTable.headItems(localization.value)
+const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
+const currentComponent = computed(() =>
+  isNewView.value
+    ? defineAsyncComponent(() => import('./new/New.vue'))
+    : defineAsyncComponent(() => import('./old/Old.vue'))
 )
-const bodyItems = computed<UI_I_BodyItem[][]>(() => {
-  return historyRunTable.bodyItems(props.dataTable || [])
-})
-</script>
-
-<style lang="scss" scoped>
-.history-runs-table {
-  height: inherit;
-  :deep(.datagrid-outer-wrapper) {
-    height: inherit;
-    padding-top: 0;
-  }
-  :deep(.datagrid-row-scrollable) {
-    flex-direction: row;
-  }
 
-  .icon {
-    width: 18px;
-    min-width: 18px;
-    margin-right: 3px;
-  }
-}
-</style>
+const localization = computed<UI_I_Localization>(() => useLocal())
+</script>