adata-ui 3.0.2 → 3.1.0

package/dist/runtime/components/mobile-navigation/MainButton.vue

@@ -0,0 +1,16 @@
+<script setup>
+import { useI18n } from "#imports";
+const emits = defineEmits(["pushMain"]);
+const { t } = useI18n();
+</script>
+
+<template>
+  <nuxt-link
+    to="/"
+    class="flex items-center gap-4 px-4 py-3 bg-gray-50 rounded-md dark:bg-gray-800"
+    @click="emits('pushMain')"
+  >
+    <i-menu />
+    {{ t("modals.mobile_navigation.return_button") }}
+  </nuxt-link>
+</template>

package/dist/runtime/components/mobile-navigation/MainButton.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, any, string, import("vue").PublicProps, any, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/runtime/components/mobile-navigation/MobileProductMenu.vue

@@ -0,0 +1,261 @@
+<script setup>
+import { PAGES } from "../../shared/constants/pages";
+import {
+  IArrowCircleDown,
+  IArrowGraphUp,
+  IAvtoCar,
+  IAvtoTruck,
+  IBlock,
+  ICalculator,
+  ICheckCircle,
+  ICompany,
+  ICurrencyDollar,
+  IDocumentProfile,
+  IFile,
+  IFileFiles,
+  IGlobe,
+  ILinkChain,
+  IMedal,
+  IReceipt,
+  IScale,
+  ISearch,
+  ISviazi,
+  IUsers,
+  IWorkBag
+} from "#components";
+import { ref, useI18n, useAppConfig, watch } from "#imports";
+import { useCurrentModule } from "../../composables/projectState";
+const tab = ref(useCurrentModule().value);
+const { t } = useI18n();
+const appConfig = useAppConfig();
+const mode = appConfig.adataUI.mode;
+const tabOptions = [
+  {
+    name: "header.products.counterparties.label",
+    key: "pk"
+  },
+  {
+    name: "header.products.jobs.label",
+    key: "work"
+  },
+  {
+    name: "header.products.tenders.label",
+    key: "tenders"
+  },
+  {
+    name: "header.products.fines.label",
+    key: "fines"
+  },
+  {
+    name: "header.products.analytics.label",
+    key: "analytics"
+  },
+  {
+    name: "header.products.fea.label",
+    key: "fea"
+  },
+  {
+    name: "header.products.compliance.label",
+    key: "compliance"
+  },
+  {
+    name: "header.products.edo.label",
+    key: "edo"
+  }
+];
+const sideLinks = {
+  pk: [
+    {
+      icon: ISearch,
+      label: "header.products.counterparties.items.counterparty.title",
+      link: `https://pk.${mode}.kz` + PAGES.pk.main
+    },
+    {
+      icon: IScale,
+      label: "header.products.counterparties.items.compare.title",
+      link: `https://pk.${mode}.kz` + PAGES.pk.compare
+    },
+    {
+      icon: ILinkChain,
+      label: "header.products.counterparties.items.networks.title",
+      link: `https://pk.${mode}.kz` + PAGES.pk.connections
+    },
+    {
+      icon: IUsers,
+      label: "header.products.counterparties.items.wholesale.title",
+      link: `https://avto.${mode}.kz` + PAGES.fines.bulk
+    },
+    {
+      icon: IGlobe,
+      label: "header.products.counterparties.items.foreign.title",
+      link: `https://pk.${mode}.kz` + PAGES.pk.foreign
+    },
+    {
+      icon: IBlock,
+      label: "header.products.counterparties.items.sanction.title",
+      link: `https://pk.${mode}.kz` + PAGES.pk.sanctions
+    },
+    {
+      icon: ICurrencyDollar,
+      label: "header.products.counterparties.items.offshore.title",
+      link: `https://pk.${mode}.kz` + PAGES.pk.offshore
+    },
+    // {
+    //   icon: IconDocument,
+    //   label: "Экспресс проверка",
+    //   link: "#"
+    // },
+    {
+      icon: IArrowCircleDown,
+      label: "header.products.counterparties.items.unloading.title",
+      link: `https://pk.${mode}.kz` + PAGES.pk.unload
+    }
+  ],
+  work: [
+    {
+      icon: IWorkBag,
+      label: "header.products.jobs.items.vacancies.title",
+      link: `https://work.${mode}.kz` + PAGES.work.vacancy
+    },
+    {
+      icon: IDocumentProfile,
+      label: "header.products.jobs.items.resume.title",
+      link: `https://work.${mode}.kz` + PAGES.work.summary
+    }
+  ],
+  tenders: [
+    {
+      icon: ISearch,
+      label: "header.products.tenders.items.tenders.title",
+      link: `https://tender.${mode}.kz` + PAGES.tender.main
+    },
+    {
+      icon: IFile,
+      label: "header.products.tenders.items.contracts.title",
+      link: `https://tender.${mode}.kz` + PAGES.tender.contracts
+    },
+    {
+      icon: IReceipt,
+      label: "header.products.tenders.items.procurement.title",
+      link: `https://tender.${mode}.kz` + PAGES.tender.plans
+    }
+  ],
+  fines: [
+    {
+      icon: ICheckCircle,
+      label: "header.products.fines.items.fines.title",
+      link: `https://avto.${mode}.kz` + PAGES.fines.main
+    },
+    {
+      icon: IAvtoCar,
+      label: "header.products.fines.items.auto.title",
+      link: `https://avto.${mode}.kz` + PAGES.fines.avto
+    },
+    {
+      icon: IAvtoTruck,
+      label: "header.products.fines.items.wholesaleAuto.title",
+      link: `https://avto.${mode}.kz` + PAGES.fines.bulk
+    }
+  ],
+  analytics: [
+    // {
+    //   icon: IconSearch,
+    //   label: 'header.products.analytics.items.clients.title',
+    //   link: myLayer.analyticsUrl + PAGES.analytics.clients
+    // },
+    {
+      icon: IReceipt,
+      label: "header.products.analytics.items.procurement.title",
+      link: `https://analytics-new.${mode}.kz` + PAGES.analytics.main
+    },
+    {
+      icon: IArrowGraphUp,
+      label: "header.products.analytics.items.activity.title",
+      link: `https://analytics-new.${mode}.kz` + PAGES.analytics.index
+    },
+    {
+      icon: ICompany,
+      label: "header.products.analytics.items.subjects.title",
+      link: `https://analytics-new.${mode}.kz` + PAGES.analytics.business
+    },
+    {
+      icon: IMedal,
+      label: "header.products.analytics.items.rate.title",
+      link: `https://analytics-new.${mode}.kz` + PAGES.analytics.rating
+    }
+  ],
+  fea: [
+    {
+      label: "header.products.fea.items.i.t",
+      icon: ISearch,
+      link: `https://tnved.${mode}.kz` + PAGES.fea.t
+    },
+    {
+      label: "header.products.fea.items.o.t",
+      icon: ISviazi,
+      link: `https://tnved.${mode}.kz` + PAGES.fea.o
+    },
+    {
+      label: "header.products.fea.items.cp.t",
+      icon: IFile,
+      link: `https://tnved.${mode}.kz` + PAGES.fea.cp
+    },
+    {
+      label: "header.products.fea.items.ca.t",
+      icon: ICalculator,
+      link: `https://tnved.${mode}.kz` + PAGES.fea.ca
+    },
+    {
+      label: "header.products.fea.items.tr.t",
+      icon: IGlobe,
+      link: `https://tnved.${mode}.kz` + PAGES.fea.tr
+    }
+  ],
+  compliance: [
+    {
+      label: "header.products.compliance.label",
+      icon: IDocumentProfile,
+      link: `https://ac.${mode}.kz/compliance`
+    }
+  ],
+  edo: [
+    {
+      label: "header.products.edo.label",
+      icon: IFileFiles,
+      link: `https://edo.${mode}.kz`
+    }
+  ]
+};
+const currentLinks = ref(sideLinks[tab.value]);
+watch(tab, (e) => {
+  if (e) {
+    currentLinks.value = sideLinks[e];
+  }
+});
+</script>
+
+<template>
+  <div class="flex flex-col gap-5">
+    <div class="h-[1px] w-full bg-deepblue-900/5 dark:bg-gray-200/5"/>
+    <div>
+      <adt-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="size-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 dark:bg-gray-200/5"/>
+  </div>
+</template>

package/dist/runtime/components/mobile-navigation/MobileProductMenu.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/runtime/components/modals/NoAccessContent.vue

@@ -0,0 +1,58 @@
+<script setup>
+import AButton from "../button/Button.vue";
+import { useAppConfig, useI18n } from "#imports";
+import { navigateTo } from "#app";
+import { useLocalePath } from "#i18n";
+const props = defineProps({
+  redirectPath: { type: String, required: true }
+});
+const emit = defineEmits(["close"]);
+const { t } = useI18n();
+const appConfig = useAppConfig();
+const mode = appConfig.adataUI.mode;
+const localePath = useLocalePath();
+function logIn() {
+  const fullPath = encodeURIComponent(window.location.toString());
+  return navigateTo(localePath(`https://id.${mode}.kz/?url=${fullPath}${props.redirectPath}`), { external: true });
+}
+function register() {
+  return navigateTo(localePath(`https://id.${mode}.kz/register`), { external: true });
+}
+</script>
+
+<template>
+  <div class="flex flex-col justify-center items-center gap-5">
+    <h1 class="font-bold text-2xl text-center">
+      {{ t("modals.auth.title") }}
+    </h1>
+    <i-modals-door class="size-30" />
+    <p class="text-sm text-center">
+      {{ t("modals.auth.content") }}
+    </p>
+    <a-button
+      variant="success"
+      class="w-full font-semibold"
+      @click="logIn"
+    >
+      {{ t("modals.buttons.logIn") }}
+    </a-button>
+    <p class="text-sm text-center">
+      {{ t("modals.auth.firstTime") }}
+    </p>
+    <div class="flex gap-2 items-center w-full">
+      <a-button
+        view="outline"
+        class="w-full font-semibold"
+        @click="emit('close')"
+      >
+        {{ t("modals.buttons.close") }}
+      </a-button>
+      <a-button
+        class="w-full font-semibold"
+        @click="register"
+      >
+        {{ t("modals.buttons.register") }}
+      </a-button>
+    </div>
+  </div>
+</template>

package/dist/runtime/components/modals/NoAccessContent.vue.d.ts

@@ -0,0 +1,5 @@
+type __VLS_Props = {
+    redirectPath: string;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, any, string, import("vue").PublicProps, any, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/components/pill-tabs/PillTabs.vue

@@ -0,0 +1,137 @@
+<script setup>
+import ADigitBadge from "../DigitBadge.vue";
+import AButton from "../button/Button.vue";
+import { ref, onMounted } from "#imports";
+import { useI18n } from "#i18n";
+defineOptions({ name: "APillTabs" });
+const emit = defineEmits(["selectOption", "prevent"]);
+const props = defineProps({
+  options: { type: Array, required: true },
+  view: { type: String, required: false, default: "main" },
+  size: { type: String, required: false, default: "sm" },
+  badgeSize: { type: String, required: false, default: "lg" },
+  align: { type: String, required: false, default: "center" },
+  block: { type: Boolean, required: false, default: false },
+  wrapper: { type: String, required: false, default: "row" },
+  countView: { type: String, required: false, default: "badge" },
+  disabled: { type: Boolean, required: false }
+});
+const tabs = ref(null);
+const activeTab = defineModel({ type: null, ...{ default: 1 } });
+const { t } = useI18n();
+const viewTypeValues = {
+  main: {
+    default: "text-deepblue-900 bg-deepblue-900/5 hover:bg-deepblue-900/10 dark:bg-gray-200/5 dark:text-gray-200 dark:hover:bg-gray-800 ",
+    selected: "bg-blue-700 font-semibold text-white dark:text-gray-900 dark:bg-blue-500"
+  },
+  transparent: {
+    default: "text-deepblue-900 bg-transparent hover:bg-deepblue-100",
+    selected: "font-semibold bg-white text-deepblue-900 "
+  },
+  gray: {
+    default: "bg-deepblue-900/5 hover:bg-deepblue-900/20 dark:bg-gray-50/10 dark:hover:bg-gray-50/20 dark:text-gray-50",
+    selected: "text-white bg-deepblue-900 dark:bg-gray-50 dark:text-gray-900"
+  },
+  blue: {
+    default: "text-deepblue-900 bg-white font-semibold leading-5 dark:bg-gray-900 dark:text-gray-200 dark:hover:bg-gray-800 hover:bg-deepblue-100 ",
+    selected: "bg-blue-700 font-semibold leading-5 text-white dark:text-gray-900 dark:bg-blue-500"
+  },
+  mobile: {
+    default: "bg-white dark:text-gray-200 font-semibold dark:bg-gray-900  dark:hover:bg-gray-500 hover:bg-deepblue-100 ",
+    selected: "text-white dark:text-gray-900 font-semibold dark:bg-white  bg-deepblue-900"
+  }
+};
+const defaultClasses = (isDisabled) => [
+  "text-sm rounded-md outline-none select-none focus-visible:shadow-[0_0_0_4px#1B64B3]",
+  isDisabled ? "bg-deepblue-900/5 dark:bg-gray-200/5 text-gray-500 dark:text-gray-500" : "",
+  props.view === "transparent" && isDisabled ? "bg-transparent" : "",
+  viewTypeValues[props.view]["default"],
+  props.block ? "w-full" : ""
+];
+const selectedClasses = () => [
+  "text-sm rounded-md select-none focus-visible:shadow-[0_0_0_4px#1B64B3]",
+  viewTypeValues[props.view]["selected"],
+  props.block ? "w-full" : ""
+];
+const sizeOptions = {
+  lg: "px-4 py-2.5",
+  sm: "px-4 py-[7.5px]",
+  ss: "px-3 py-1.5",
+  xs: "px-3 py-[4px]"
+};
+const onChanged = (option, event) => {
+  if (option.prevent) {
+    emit("prevent", option);
+    return;
+  }
+  activeTab.value = option.key;
+  emit("selectOption", option);
+  event.preventDefault();
+  event.currentTarget.scrollIntoView({
+    behavior: "smooth",
+    inline: "start",
+    block: "nearest"
+  });
+};
+onMounted(() => {
+  const isDesktop = window.matchMedia("(min-width: 1024px)").matches;
+  if (tabs.value && !isDesktop) {
+    const activeTab2 = tabs.value.querySelector('[data-active="true"]');
+    if (activeTab2) {
+      activeTab2.scrollIntoView({
+        inline: "start",
+        block: "nearest"
+      });
+    }
+  }
+});
+</script>
+
+<template>
+  <div
+    ref="tabs"
+    class="scroll-container overflow-auto whitespace-nowrap"
+    :class="props.wrapper === 'row' ? 'flex gap-1' : 'flex flex-col gap-1'"
+  >
+    <button
+      v-for="option in options"
+      :key="option.key"
+      :disabled="option.disabled || disabled"
+      :data-active="activeTab === option.key"
+      :class="[
+  activeTab === option.key ? selectedClasses() : defaultClasses(!!option.disabled),
+  sizeOptions[size]
+]"
+      @click="onChanged(option, $event)"
+    >
+      <slot
+        name="option"
+        :option="option"
+      >
+        <span
+          class="flex items-center gap-1 whitespace-nowrap"
+          :class="[align === 'left' ? 'justify-start' : 'justify-center']"
+        >
+          <span>
+            {{ t(option.name) }}
+          </span>
+          <template v-if="option.count !== void 0">
+            <a-digit-badge
+              v-if="props.countView === 'badge'"
+              :value="option.count"
+              :type="option.badgeColor ? option.badgeColor : 'primary'"
+              :disabled="(option.disabled || option.count === 0) && activeTab !== option.key"
+              :view="activeTab === option.key ? 'inverted' : 'default'"
+              :size="badgeSize"
+            />
+            <span v-else-if="props.countView === 'brackets'"> ({{ option.count }}) </span>
+          </template>
+        </span>
+      </slot>
+    </button>
+  </div>
+</template>
+
+<style scoped>
+.scroll-container::-webkit-scrollbar{display:none}
+</style>

package/dist/runtime/components/pill-tabs/PillTabs.vue.d.ts

@@ -0,0 +1,38 @@
+import type { Tab } from './types.js';
+interface Props {
+    options: Tab[];
+    view?: 'transparent' | 'main' | 'gray' | 'blue' | 'mobile';
+    size?: 'lg' | 'sm' | 'xs';
+    badgeSize?: 'sm' | 'md' | 'lg';
+    align?: 'left' | 'center';
+    block?: boolean;
+    wrapper?: 'column' | 'row';
+    countView?: 'badge' | 'brackets';
+    disabled?: boolean;
+}
+type __VLS_Props = Props;
+type __VLS_PublicProps = __VLS_Props & {
+    modelValue?: any;
+};
+declare var __VLS_1: {
+    option: any;
+};
+type __VLS_Slots = {} & {
+    option?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{}>, {
+    size: "lg" | "sm" | "xs";
+    view: "transparent" | "main" | "gray" | "blue" | "mobile";
+    block: boolean;
+    align: "left" | "center";
+    badgeSize: "sm" | "md" | "lg";
+    wrapper: "column" | "row";
+    countView: "badge" | "brackets";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/pill-tabs/types.d.ts

@@ -0,0 +1,18 @@
+export type StateType = {
+    [key in 'default' | 'selected']: string;
+};
+export type ViewType = {
+    transparent: StateType;
+    main: StateType;
+    gray: StateType;
+    blue: StateType;
+    mobile: StateType;
+};
+export interface Tab {
+    name: string;
+    key: string | number;
+    count?: number;
+    disabled?: boolean;
+    prevent?: boolean;
+    badgeColor?: 'primary' | 'success' | 'danger' | 'gray' | 'orange' | 'warning';
+}

package/dist/runtime/components/radio-button/RadioButton.vue

@@ -0,0 +1,69 @@
+<script setup>
+import { computed, useId } from "vue";
+import RadioCheck from "#icons/radio/radio-check.vue";
+import RadioEmpty from "#icons/radio/radio-empty.vue";
+defineOptions({ name: "ARadioButton" });
+const props = defineProps({
+  inputId: { type: null, required: false },
+  size: { type: String, required: false, default: "sm" },
+  name: { type: String, required: false, default: "check" },
+  disabled: { type: Boolean, required: false, default: false },
+  side: { type: String, required: false, default: "left" },
+  value: { type: [String, Number, Boolean], required: true },
+  permanent: { type: Boolean, required: false, default: false }
+});
+const emit = defineEmits(["change"]);
+const model = defineModel({ type: [String, Number, Boolean, null], skipCheck: true });
+const id = props.inputId ?? useId();
+const currentComponent = computed(() => {
+  return model.value === props.value ? RadioCheck : RadioEmpty;
+});
+function update() {
+  model.value = props.value;
+  emit("change");
+}
+const sizeOptions = {
+  lg: "min-w-6 min-h-6 max-w-6 max-h-6",
+  sm: "min-w-4 min-h-4 max-w-4 max-h-4"
+};
+const textSizeOptions = {
+  lg: "text-sm gap-2",
+  sm: "text-xs gap-2"
+};
+</script>
+
+<template>
+  <div
+    class="flex items-center"
+    :class="[disabled ? 'opacity-20' : '']"
+  >
+    <input
+      :id="id"
+      :name="name"
+      type="radio"
+      class="hidden"
+      :checked="model === value"
+      :disabled="disabled"
+      @change="update"
+    >
+    <label
+      :for="id"
+      class="flex items-center text-deepblue-900 dark:text-gray-200 cursor-pointer w-full whitespace-nowrap"
+      :class="[textSizeOptions[size]]"
+    >
+      <span
+        v-if="side === 'left'"
+        class="select-none w-full"
+      ><slot /></span>
+      <component
+        :is="currentComponent"
+        class="text-deepblue-900 dark:text-gray-200 w-full"
+        :class="[sizeOptions[size]]"
+      />
+      <span
+        v-if="side === 'right'"
+        class="select-none w-full"
+      ><slot /></span>
+    </label>
+  </div>
+</template>

package/dist/runtime/components/radio-button/RadioButton.vue.d.ts

@@ -0,0 +1,40 @@
+interface Props {
+    inputId?: any;
+    size?: 'lg' | 'sm';
+    name?: string;
+    disabled?: boolean;
+    side?: 'right' | 'left';
+    value: string | number | boolean;
+    permanent?: boolean;
+}
+type __VLS_Props = Props;
+type __VLS_PublicProps = __VLS_Props & {
+    modelValue?: string | number | boolean | null | undefined;
+};
+declare var __VLS_1: {}, __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string | number | boolean | null | undefined) => any;
+} & {
+    change: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onChange?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string | number | boolean | null | undefined) => any) | undefined;
+}>, {
+    name: string;
+    size: "lg" | "sm";
+    disabled: boolean;
+    side: "right" | "left";
+    permanent: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};