adata-ui 2.1.40-beta.16 → 2.1.40-beta.18

package/components/modals/ContentNavigationModal.vue

@@ -1,99 +1,355 @@
-<script setup lang="ts">
-import type { Component } from 'vue'
-import { useCurrentModule } from '#adata-ui/composables/projectState'
-import { useHeaderNavigationLinks } from '#adata-ui/composables/useHeaderNavigationLinks'
-
-interface NavItem {
-  title: string
-  icon: Component
-  to: string
-}
-
-interface Emits {
-  (e: 'pushMain'): void
-}
-const emits = defineEmits<Emits>()
-
-const open = defineModel<boolean>({ default: false })
-
-const { t } = useI18n()
-const modules = useHeaderNavigationLinks()
-
-const initialKey = useCurrentModule().value
-const tab = ref<string>(
-  initialKey && modules.value.some(module => module.key === initialKey)
-    ? initialKey
-    : (modules.value[0]?.key ?? 'pk'),
-)
-
-const tabOptions = computed(() =>
-  modules.value.map(module => ({ key: module.key, name: module.name })),
-)
-
-const currentLinks = computed<NavItem[]>(() => {
-  const module = modules.value.find(item => item.key === tab.value)
-  return (module?.items ?? []) as NavItem[]
-})
-
-function onReturn() {
-  emits('pushMain')
-}
-</script>
-
-<template>
-  <a-modal-v2
-    v-model="open"
-    hide-close
-    content-class="bg-gray-50/60 dark:bg-gray-950/40"
-  >
-    <template #header>
-      <h2 class="w-full text-center text-base font-semibold text-gray-900 dark:text-gray-100">
-        {{ t('modals.mobile_navigation.type_main') }}
-      </h2>
-    </template>
-
-    <div class="px-4 py-3">
-      <a-pill-tabs-v2
-        v-model="tab"
-        :options="tabOptions"
-        size="md"
-        scroll-into-view
-      />
-    </div>
-
-    <div class="no-scrollbar flex h-[50vh] flex-col gap-2 overflow-y-auto px-4 pb-4">
-      <nuxt-link
-        v-for="item in currentLinks"
-        :key="item.to"
-        :to="item.to"
-        class="group flex items-center gap-3 rounded-xl border border-gray-100 bg-white px-3 py-2.5 transition-colors hover:border-blue-200 hover:bg-blue-50/50 dark:border-gray-800 dark:bg-gray-900 dark:hover:border-blue-500/30 dark:hover:bg-gray-800"
-      >
-        <span class="flex size-10 shrink-0 items-center justify-center rounded-lg bg-blue-50 text-blue-500 transition-colors group-hover:bg-blue-700 group-hover:text-white dark:bg-blue-500/10 dark:text-blue-500 dark:group-hover:bg-blue-500 dark:group-hover:text-white">
-          <component
-            :is="item.icon"
-            class="size-5"
-          />
-        </span>
-
-        <span class="min-w-0 flex-1 truncate text-sm font-semibold text-deepblue-900 dark:text-gray-100">
-          {{ item.title }}
-        </span>
-
-        <a-icon-chevron-right class="size-4 shrink-0 text-gray-300 transition-colors group-hover:text-blue-500 dark:text-gray-600" />
-      </nuxt-link>
-    </div>
-
-    <template #footer>
-      <nuxt-link
-        to="/"
-        class="flex items-center justify-center gap-2 rounded-xl bg-gray-100 px-4 py-3 text-sm font-semibold text-deepblue-900 transition-colors hover:bg-gray-200 dark:bg-gray-800 dark:text-gray-100 dark:hover:bg-gray-700"
-        @click="onReturn"
-      >
-        <a-icon-menu class="size-5" />
-        {{ t('modals.mobile_navigation.return_button') }}
-      </nuxt-link>
-    </template>
-  </a-modal-v2>
-</template>
-
-<style scoped></style>
+<script setup lang="ts">
+
+import {ref} from "vue";
+import IconSearch from "#adata-ui/icons/search.vue";
+import {PAGES} from '#adata-ui/shared/constans/pages'
+import IconScales from "#adata-ui/icons/scales/scale.vue";
+import IconLink from "#adata-ui/icons/link-chain.vue";
+import IconUsers from "#adata-ui/icons/users.vue";
+import IconGlobe from "#adata-ui/icons/globe.vue";
+import IconBlock from "#adata-ui/icons/block.vue";
+import IconDollar from "#adata-ui/icons/currency/currency-dollar.vue";
+import IconDocument from "#adata-ui/icons/hdocument.vue";
+import IconArrowCircle from "#adata-ui/icons/arrow/arrow-circle-down.vue";
+import IconWork from "#adata-ui/icons/work-bag.vue";
+import IconFile from "#adata-ui/icons/file/file.vue";
+import IconCheck from "#adata-ui/icons/hcheck.vue";
+import IconCheckCircle from "#adata-ui/icons/check/check-circle.vue";
+import IconCar from "#adata-ui/icons/car.vue";
+import IconTruck from "#adata-ui/icons/truck.vue";
+import IconArrowGraph from "#adata-ui/icons/arrow/arrow-graph-up.vue";
+import IconCompany from "#adata-ui/icons/company.vue";
+import IconMedal from "#adata-ui/icons/medal.vue";
+import IconProfile from "#adata-ui/icons/profile.vue";
+import Connections from "#adata-ui/icons/sviazi.vue";
+import {useCurrentModule} from "#adata-ui/composables/projectState";
+import IconCalc from '#adata-ui/icons/calculator.vue'
+import { buildLocalizedUrl } from '#adata-ui/utils/localizedNavigation'
+import {
+  AIconAkimat,
+  AIconCurrencyTenge,
+  AIconExcelIcon,
+  AIconFiles, AIconSearch,
+  AIconUsers,
+  AIconWarningTriangle
+} from '#components'
+import MapPinRect from '#adata-ui/icons/map/map-pin-rect.vue'
+import ChartBar from '#adata-ui/icons/chart-bar.vue'
+import Bank from '#adata-ui/icons/bank.vue'
+import { useUrls } from '#adata-ui/composables/useUrls'
+import MapPaper from '#adata-ui/icons/map-paper.vue'
+import AiAssistant from '#adata-ui/icons/ai-assistant.vue'
+import Tasks from '#adata-ui/icons/tasks.vue'
+import HotLine from '#adata-ui/icons/hot-line.vue'
+import Sanctions from '#adata-ui/icons/sanctions.vue'
+import CheckSb from '#adata-ui/icons/check-sb.vue'
+type Emits = {
+  (e: 'pushMain'): void
+}
+const isOpen = ref(false)
+const tab = ref(useCurrentModule().value)
+const { myLayer }: any = useAppConfig()
+const urls = useUrls()
+
+const { t, locale } = useI18n()
+const emits = defineEmits<Emits>()
+const mode = myLayer.mode
+
+const tabOptions = [
+  {
+    name: 'header.products.counterparties.label',
+    key: 'pk',
+  },
+  {
+    name: 'header.products.fines.label',
+    key: 'fines',
+  },
+  {
+    name: 'header.products.jobs.label',
+    key: 'work',
+  },
+  {
+    name: 'header.products.fea.label',
+    key: 'fea',
+  },
+  {
+    name: 'header.products.tenders.label',
+    key: 'tenders',
+  },
+  {
+    name: 'header.products.edo.label',
+    key: 'edo',
+  },
+  {
+    name: 'header.products.compliance.label',
+    key: 'compliance',
+  },
+
+  {
+    name: 'header.products.analytics.label',
+    key: 'analytics',
+  },
+
+
+
+]
+const sideLinks = <any>{
+  edo: [
+    {
+      label: 'header.products.edo.label',
+      icon: AIconFiles,
+      link: urls.edo_docs,
+    }
+  ],
+  pk: [
+    {
+      icon: IconSearch,
+      label: 'header.products.counterparties.items.counterparty.title',
+      link: urls.pk + PAGES.pk.main
+    },
+    {
+      icon: IconScales,
+      label: 'header.products.counterparties.items.compare.title',
+      link: myLayer.counterParty ?  urls.pk + myLayer.counterParty + PAGES.pk.compare : urls.pk + PAGES.pk.compare
+    },
+    {
+      icon: IconLink,
+      label: 'header.products.counterparties.items.networks.title',
+      link: myLayer.counterParty ?  urls.pk + myLayer.counterParty + '/search-connections/check' : urls.pk + PAGES.pk.connections
+    },
+    {
+      icon: IconUsers,
+      label: 'header.products.counterparties.items.wholesale.title',
+      link: myLayer.counterParty ?  urls.pk + myLayer.counterParty + PAGES.pk.employees : urls.pk + PAGES.pk.employees
+    },
+    {
+      icon: IconGlobe,
+      label: 'header.products.counterparties.items.foreign.title',
+      link: urls.pk + PAGES.pk.foreign
+    },
+    {
+      icon: IconBlock,
+      label: 'header.products.counterparties.items.sanction.title',
+      link: myLayer.counterParty ?  urls.pk + myLayer.counterParty + PAGES.pk.sanctions : urls.pk + PAGES.pk.sanctions
+    },
+    {
+      icon: IconDollar,
+      label: 'header.products.counterparties.items.offshore.title',
+      link: myLayer.counterParty ?  urls.pk + myLayer.counterParty + PAGES.pk.offshore : urls.pk + PAGES.pk.offshore
+    },
+    // {
+    //   icon: IconDocument,
+    //   label: "Экспресс проверка",
+    //   link: "#"
+    // },
+    {
+      icon: IconArrowCircle,
+      label: 'header.products.counterparties.items.unloading.title',
+      link: urls.pk + PAGES.pk.unload
+    }
+  ],
+  work: [
+    {
+      icon: IconWork,
+      label: 'header.products.jobs.items.vacancies.title',
+      link: urls.work + PAGES.work.vacancy
+    },
+    {
+      icon: IconDocument,
+      label: 'header.products.jobs.items.resume.title',
+      link: urls.work + PAGES.work.summary
+    },
+  ],
+  tenders: [
+    {
+      icon: AIconUsers,
+      label: t('header.products.tenders.items.customers.title'),
+      link: urls.zakupki + PAGES.tender.customers,
+    },
+    {
+      icon: AIconAkimat,
+      label: t('header.products.tenders.items.akimat.title'),
+      link: urls.zakupki + PAGES.tender.akimat,
+    },
+    {
+      icon: AIconWarningTriangle,
+      label: 'header.products.tenders.items.tru.title',
+      link: urls.zakupki + PAGES.tender.tru
+    },
+    {
+      icon: AIconCurrencyTenge,
+      label: 'header.products.tenders.items.price.title',
+      link: urls.zakupki + PAGES.tender.price
+    },
+    {
+      icon: AIconExcelIcon,
+      label: 'header.products.tenders.items.constructor.title',
+      link: urls.zakupki + PAGES.tender.constructor
+    },
+    {
+      icon: AIconSearch,
+      label: 'header.products.tenders.items.monitoring.title',
+      link: urls.tender
+    }
+  ],
+  analytics: [
+    // {
+    //   icon: IconSearch,
+    //   label: 'header.products.analytics.items.clients.title',
+    //   link: myLayer.analyticsUrl + PAGES.analytics.clients
+    // },
+    // {
+    //   icon: IconCheck,
+    //   label: 'header.products.analytics.items.procurement.title',
+    //   link: urls.analyticsNew + PAGES.analytics.main
+    // },
+    {
+      icon: IconArrowGraph,
+      label: 'header.products.analytics.items.activity.title',
+      link: urls.analytics + PAGES.analytics.index
+    },
+    {
+      icon: IconCompany,
+      label: 'header.products.analytics.items.subjects.title',
+      link: urls.analytics + PAGES.analytics.business
+    },
+    {
+      icon: IconMedal,
+      label: 'header.products.analytics.items.rate.title',
+      link: urls.analytics + PAGES.analytics.rating
+    }
+  ],
+  fines: [
+    {
+      icon: IconCheckCircle,
+      label: 'header.products.fines.items.fines.title',
+      link: urls.avto + PAGES.fines.main
+    },
+    {
+      icon: IconCar,
+      label: 'header.products.fines.items.auto.title',
+      link: urls.avto + PAGES.fines.avto
+    },
+    // {
+    //   icon: IconTruck,
+    //   label: 'header.products.fines.items.wholesaleAuto.title',
+    //   link: myLayer.avtoUrl + PAGES.fines.bulk
+    // }
+  ],
+  fea: [
+    {
+      label: 'header.products.fea.items.i.t',
+      icon: IconSearch,
+      link: `${urls.tnved}${PAGES.fea.t}`
+    },
+    {
+      label: 'header.products.fea.items.o.t',
+      icon: Connections,
+      link: `${urls.tnved}${PAGES.fea.o}`
+    },
+    {
+      label: 'header.products.fea.items.cp.t',
+      icon: IconFile,
+      link: `${urls.tnved}${PAGES.fea.cp}`
+    },
+    {
+      label: 'header.products.fea.items.ca.t',
+      icon: IconCalc,
+      link: `${urls.tnved}${PAGES.fea.ca}`
+    },
+    {
+      label: 'header.products.fea.items.tr.t',
+      icon: IconGlobe,
+      link: `${urls.tnved}${PAGES.fea.tr}`
+    },
+    {
+      label: 'header.products.fea.items.importerMap.t',
+      icon: MapPinRect,
+      link: `${urls.tnved}${PAGES.fea.importerMap}`
+    },
+    {
+      label: 'header.products.fea.items.containers.t',
+      icon: MapPaper,
+      link: `${urls.tnved}${PAGES.fea.containers}`
+    }
+  ],
+  compliance: [
+    {
+      label: 'header.products.compliance.items.assistant.t',
+      icon: AiAssistant,
+      link: urls.compliancemain + PAGES.compliance.assistant
+    },
+    {
+      label: 'header.products.compliance.items.assignments.t',
+      icon: Tasks,
+      link: urls.compliancemain + PAGES.compliance.assignments
+    },
+    {
+      label: 'header.products.compliance.items.hotline.t',
+      icon: HotLine,
+      link: urls.compliancemain + PAGES.compliance.hotline
+    },
+    {
+      label: 'header.products.compliance.items.sanctions.t',
+      icon: Sanctions,
+      link: urls.compliancemain + PAGES.compliance.sanctions
+    },
+    {
+      label: 'header.products.compliance.items.suppliers.t',
+      icon: IconProfile,
+      link: urls.compliancemain + PAGES.compliance.suppliers
+    },
+    {
+      label: 'header.products.compliance.items.sb.t',
+      icon: CheckSb,
+      link: urls.compliancemain + PAGES.compliance.sb
+    }
+  ]
+}
+const currentLinks = ref(sideLinks[tab.value])
+
+watch(tab, (e) => {
+  if (e) {
+    currentLinks.value = sideLinks[e]
+  }
+})
+
+</script>
+
+<template>
+  <a-modal v-model="isOpen" :title="t('modals.mobile_navigation.type_main')">
+    <div class="flex flex-col gap-5">
+      <div class="h-[1px] w-full bg-deepblue-900/5"/>
+      <div>
+        <a-pill-tabs v-model="tab" :options="tabOptions" view="gray"/>
+      </div>
+      <div class="h-[40vh] sm:h-[300px] overflow-auto no-scrollbar">
+        <nuxt-link
+          v-for="item in currentLinks"
+          :key="item.label"
+          :to="item.link"
+          class="flex items-center gap-4 px-4 py-3 bg-gray-50 dark:bg-gray-800 mb-2 rounded"
+        >
+          <div class="bg-gradient-blue p-1 rounded-lg">
+            <component
+              :is="item.icon"
+              class="w-5 h-5 text-white dark:text-gray-900"
+            />
+          </div>
+          <span>{{ t(item.label) }}</span>
+        </nuxt-link>
+      </div>
+      <div class="h-[1px] w-full bg-deepblue-900/5"/>
+    </div>
+    <template #footer>
+      <nuxt-link to="/" @click="emits('pushMain')" class="flex items-center gap-4 px-4 py-3 bg-gray-50 rounded-md dark:bg-gray-800">
+        <a-icon-menu/>
+        {{ t('modals.mobile_navigation.return_button') }}
+      </nuxt-link>
+    </template>
+  </a-modal>
+</template>
+
+<style scoped>
+
+</style>

package/components/modals/Insufficient-funds-modal.vue

@@ -1,62 +1,77 @@
-<script setup lang="ts">
-import type { UserInfo } from '~/api/modules/user/types'
-
-const { t } = useI18n()
-
-const { topUpSidePanel } = usePayment()
-
-const isOpen = defineModel<boolean>({ default: false })
-const userInfo = useState<UserInfo>('user-info', () => ({}))
-
-function confirm() {
-  isOpen.value = false
-  topUpSidePanel.value = true
-}
-function cancel() {
-  isOpen.value = false
-}
-</script>
-
-<template>
-  <a-modal-v2
-    v-model="isOpen"
-    width="424px"
-  >
-    <div class="flex flex-col gap-4 px-6 py-4">
-      <a-ill-empty-wallet class="self-center" />
-      <p class="text-center text-[18px] font-semibold">
-        {{ t('modals.low_balance.title') }}
-      </p>
-      <p class="text-center">
-        {{ t('modals.low_balance.questions') }}
-      </p>
-      <div class="flex flex-col rounded-lg border border-blue-500 bg-blue-50 px-4 py-2 dark:border-blue-500 dark:bg-blue-950/40">
-        <p class="body-600 text-center text-blue-700 dark:text-blue-300">
-          {{ t('modals.low_balance.current_balance') }}
-        </p>
-        <p class="body-600 text-center text-xl text-blue-700 dark:text-blue-300">
-          {{ userInfo?.balance ? userInfo?.balance.toLocaleString('ru-RU') : 0 }}₸
-        </p>
-      </div>
-    </div>
-    <template #footer>
-      <div class="flex gap-2">
-        <a-button-v2
-          view="outline"
-          color="blue"
-          block
-          @click="cancel"
-        >
-          {{ t('modals.buttons.close') }}
-        </a-button-v2>
-        <a-button-v2 block @click="confirm">
-          {{ t('modals.buttons.topUp') }}
-        </a-button-v2>
-      </div>
-    </template>
-  </a-modal-v2>
-</template>
-
-<style scoped>
-
-</style>
+<script setup lang="ts">
+import type { UserInfo } from '~/api/modules/user/types'
+import { handleElementPosition } from '#adata-ui/utils/getMaxZindex'
+
+const props = withDefaults(defineProps<Props>(), {
+  deleteFromDom: false,
+})
+
+const emit = defineEmits<{
+  (e: 'next'): void
+}>()
+
+const { t } = useI18n()
+
+interface Props {
+  deleteFromDom?: boolean
+}
+const { topUpSidePanel } = usePayment()
+
+const isOpen = defineModel<boolean>({ default: false })
+const userInfo = useState<UserInfo>('user-info', () => ({}))
+
+function confirm() {
+  isOpen.value = false
+  topUpSidePanel.value = true
+}
+function cancel() {
+  isOpen.value = false
+}
+
+if (props.deleteFromDom) {
+  handleElementPosition('insufficient-funds')
+}
+</script>
+
+<template>
+  <a-modal
+    v-model="isOpen"
+    name="insufficient-funds"
+  >
+    <div class="flex flex-col gap-5">
+      <p class="heading-02 text-center">
+        {{ t('modals.low_balance.title') }}
+      </p>
+      <a-ill-empty-wallet class="self-center" />
+      <div class="m-[0_-32px] flex flex-col bg-green-500 py-1.5">
+        <p class="body-600 text-center  text-white ">
+          {{ t('modals.low_balance.current_balance') }}
+        </p>
+        <p class="body-600 text-center text-xl text-white ">
+          {{ userInfo?.balance ? userInfo?.balance.toLocaleString('ru-RU') : 0 }}₸
+        </p>
+      </div>
+      <p class="text-center">
+        {{ t('modals.low_balance.questions') }}
+      </p>
+    </div>
+    <template #footer>
+      <div class="flex gap-2 ">
+        <a-button
+          view="outline"
+          block
+          @click="cancel"
+        >
+          {{ t('modals.buttons.close') }}
+        </a-button>
+        <a-button block @click="confirm">
+          {{ t('modals.buttons.topUp') }}
+        </a-button>
+      </div>
+    </template>
+  </a-modal>
+</template>
+
+<style scoped>
+
+</style>

package/components/modals/LimitReachedModal.vue

@@ -1,31 +1,30 @@
-<script setup lang="ts">
-import { useUrls } from '#adata-ui/composables/useUrls'
-
-const { t } = useI18n()
-const isOpen = useLimitReachedModal()
-const { login } = useUrls()
-
-function goTariffs() {
-  if (window) {
-    window.location.href = `${login}/tariffs`
-  }
-}
-</script>
-
-<template>
-  <a-modal v-model="isOpen" :title="t('modals.limit.title')">
-    <div class="flex flex-col items-center gap-5 text-center text-sm">
-      <a-ill-empty-wallet />
-      <div>{{ t('modals.limit.content') }}</div>
-    </div>
-    <template #footer>
-      <a-button block @click="goTariffs">
-        {{ t('modals.buttons.goTariffs') }}
-      </a-button>
-    </template>
-  </a-modal>
-</template>
-
-<style scoped>
-
-</style>
+<script setup lang="ts">
+
+import { useUrls } from '#adata-ui/composables/useUrls'
+
+const { t } = useI18n()
+const isOpen = useLimitReachedModal()
+const { login } = useUrls()
+
+function goTariffs() {
+  if (window) {
+    window.location.href = `${login}/tariffs`
+  }
+}
+</script>
+
+<template>
+  <a-modal v-model="isOpen" :title="t('modals.limit.title')">
+    <div class="flex flex-col items-center gap-5 text-center text-sm">
+      <a-ill-empty-wallet></a-ill-empty-wallet>
+      <div>{{ t('modals.limit.content') }}</div>
+    </div>
+    <template #footer>
+      <a-button @click="goTariffs" block>{{ t('modals.buttons.goTariffs') }}</a-button>
+    </template>
+  </a-modal>
+</template>
+
+<style scoped>
+
+</style>