adata-ui 2.1.40-beta.8 → 2.1.40

package/components/navigation/line-tabs/ALineTabs.vue

@@ -1,111 +1,111 @@
-<template>
-  <div
-    class="whitespace-nowrap overflow-auto"
-    :class="props.wrapper === 'row'? 'flex':'flex flex-col'"
-  >
-    <button
-      v-for="(option) in options"
-      :key="option.key"
-      :disabled="option.disabled"
-      :class="activeTab === option.key ? selectedClasses() : defaultClasses()"
-      @click="() => handleClick(option)"
-    >
-      <slot
-        name="option"
-        :option="option"
-      >
-        <span
-          class="flex gap-1 "
-          :class="[align === 'left' ? 'justify-between' : 'justify-center' ]"
-        >
-          <span>
-            {{ option.name }}
-          </span>
-          <a-digit-badge
-            v-if="option.count!== undefined"
-            size="md"
-            class="font-normal justify-self-start"
-          >
-            {{ option.count }}
-          </a-digit-badge>
-          <a-icon-warning-circle
-            v-if="option.warning"
-            class="text-black justify-self-end"
-          />
-        </span>
-      </slot>
-    </button>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { Tab, ViewType} from "./types";
-
-defineOptions({name: 'ALineTabs'})
-
-interface Props {
-  options: Tab[]
-  view: 'bottom' | 'right' | "left"
-  size?: 'lg' | 'sm'
-  align: 'left' | 'center'
-  block?: boolean
-  wrapper?: 'row' | 'column'
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  view: 'bottom',
-  size: 'sm',
-  align: 'center',
-  block: false,
-  wrapper: 'row',
-})
-const emit = defineEmits(['selectOption']);
-const activeTab = defineModel<any>({
-  default: 1
-})
-
-
-const viewTypeValues: ViewType = {
-  bottom: {
-    default: 'border-b-2 border-white dark:border-gray-900 pt-[3px] ',
-    selected: 'border-b-2 border-blue-700 dark:border-blue-500 pt-[3px]'
-  },
-  right: {
-    default: 'text-deepblue-900 bg-transparent',
-    selected: 'border-r-2 border-deepblue-900'
-  },
-  left: {
-    default: 'text-deepblue-900 bg-transparent',
-    selected: 'border-l-2 border-deepblue-900'
-  },
-};
-
-
-
-
-const defaultClasses = () =>
-  [
-    'disabled:cursor-not-allowed disabled:text-gray-500 hover:bg-deepblue-900 disabled:dark:text-gray-300 body-s-400 cursor-pointer text-deepblue-900 dark:text-gray-200 bg-transparent select-none hover:bg-opacity-5 hover:disabled:bg-transparent focus-visible:shadow-[0_0_0_4px#1B64B3]',
-    viewTypeValues[props.view]['default'],
-    props.size == 'sm'?  'px-4 py-[7.5px]' : 'px-4 py-[11.5px]',
-    props.block ? 'w-full' : '',
-  ]
-
-const selectedClasses = () =>
-  [
-    'body-s-400 cursor-pointer transition duration-200 select-none font-semibold focus-visible:shadow-[0_0_0_4px#1B64B3]',
-    viewTypeValues[props.view]['selected'],
-    props.size == 'sm'?  'px-4 py-[7.5px]' : 'px-4 py-[11.5px]',
-    props.block ? 'w-full' : '',
-  ]
-
-const handleClick = (option:Tab) => {
-  activeTab.value = option.key
-  emit('selectOption', option);
-}
-
-</script>
-
-<style>
-/* Add any additional styles here */
-</style>
+<template>
+  <div
+    class="whitespace-nowrap overflow-auto"
+    :class="props.wrapper === 'row'? 'flex':'flex flex-col'"
+  >
+    <button
+      v-for="(option) in options"
+      :key="option.key"
+      :disabled="option.disabled"
+      :class="activeTab === option.key ? selectedClasses() : defaultClasses()"
+      @click="() => handleClick(option)"
+    >
+      <slot
+        name="option"
+        :option="option"
+      >
+        <span
+          class="flex gap-1 "
+          :class="[align === 'left' ? 'justify-between' : 'justify-center' ]"
+        >
+          <span>
+            {{ option.name }}
+          </span>
+          <a-digit-badge
+            v-if="option.count!== undefined"
+            size="md"
+            class="font-normal justify-self-start"
+          >
+            {{ option.count }}
+          </a-digit-badge>
+          <a-icon-warning-circle
+            v-if="option.warning"
+            class="text-black justify-self-end"
+          />
+        </span>
+      </slot>
+    </button>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { Tab, ViewType} from "./types";
+
+defineOptions({name: 'ALineTabs'})
+
+interface Props {
+  options: Tab[]
+  view: 'bottom' | 'right' | "left"
+  size?: 'lg' | 'sm'
+  align: 'left' | 'center'
+  block?: boolean
+  wrapper?: 'row' | 'column'
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  view: 'bottom',
+  size: 'sm',
+  align: 'center',
+  block: false,
+  wrapper: 'row',
+})
+const emit = defineEmits(['selectOption']);
+const activeTab = defineModel<any>({
+  default: 1
+})
+
+
+const viewTypeValues: ViewType = {
+  bottom: {
+    default: 'border-b-2 border-white dark:border-gray-900 pt-[3px] ',
+    selected: 'border-b-2 border-blue-700 dark:border-blue-500 pt-[3px]'
+  },
+  right: {
+    default: 'text-deepblue-900 bg-transparent',
+    selected: 'border-r-2 border-deepblue-900'
+  },
+  left: {
+    default: 'text-deepblue-900 bg-transparent',
+    selected: 'border-l-2 border-deepblue-900'
+  },
+};
+
+
+
+
+const defaultClasses = () =>
+  [
+    'disabled:cursor-not-allowed disabled:text-gray-500 hover:bg-deepblue-900 disabled:dark:text-gray-300 body-s-400 cursor-pointer text-deepblue-900 dark:text-gray-200 bg-transparent select-none hover:bg-opacity-5 hover:disabled:bg-transparent focus-visible:shadow-[0_0_0_4px#1B64B3]',
+    viewTypeValues[props.view]['default'],
+    props.size == 'sm'?  'px-4 py-[7.5px]' : 'px-4 py-[11.5px]',
+    props.block ? 'w-full' : '',
+  ]
+
+const selectedClasses = () =>
+  [
+    'body-s-400 cursor-pointer transition duration-200 select-none font-semibold focus-visible:shadow-[0_0_0_4px#1B64B3]',
+    viewTypeValues[props.view]['selected'],
+    props.size == 'sm'?  'px-4 py-[7.5px]' : 'px-4 py-[11.5px]',
+    props.block ? 'w-full' : '',
+  ]
+
+const handleClick = (option:Tab) => {
+  activeTab.value = option.key
+  emit('selectOption', option);
+}
+
+</script>
+
+<style>
+/* Add any additional styles here */
+</style>

package/components/navigation/line-tabs/types.ts

@@ -1,21 +1,21 @@
-
-export type StateType = {
-  [key in 'default' | 'selected']: string;
-};
-
-export type ViewType = {
-  bottom: StateType;
-  left: StateType;
-  right: StateType;
-};
-
-
-
-export interface Tab {
-  name: string
-  key: string | number
-  count?: number
-  disabled?: boolean
-  warning?:boolean
-  url?: string
-}
+
+export type StateType = {
+  [key in 'default' | 'selected']: string;
+};
+
+export type ViewType = {
+  bottom: StateType;
+  left: StateType;
+  right: StateType;
+};
+
+
+
+export interface Tab {
+  name: string
+  key: string | number
+  count?: number
+  disabled?: boolean
+  warning?:boolean
+  url?: string
+}

package/components/navigation/mobile-navigation/AMobileNavigation.vue

@@ -1,112 +1,112 @@
-<script setup lang="ts">
-import type { ProjectKeys } from '#adata-ui/components/navigation/header/types'
-import ContactsMobileModel from '#adata-ui/components/modals/ContactsMobileModel.vue'
-import ContentNavigationModal from '#adata-ui/components/modals/ContentNavigationModal.vue'
-import ProfileMenu from '#adata-ui/components/navigation/header/ProfileMenu.vue'
-import AModal from '#adata-ui/components/overlays/modal/AModal.vue'
-import { useCurrentModule } from '#adata-ui/composables/projectState'
-import { useUrls } from '#adata-ui/composables/useUrls'
-import IconInvoice from '#adata-ui/icons/invoice.vue'
-import IconMenu from '#adata-ui/icons/menu-filled.vue'
-
-interface Props {
-  replenish?: string
-  hasNotification?: boolean
-  email: string | undefined
-  rate: string
-  daysRemaining: number
-  limitRemaining: number
-  balance: number
-  isAuthenticated: boolean
-  showLogIn?: boolean
-  module?: ProjectKeys
-  oldVersion?: string
-}
-const props = withDefaults(defineProps<Props>(), {
-  limitRemaining: 0,
-  daysRemaining: 0,
-  balance: 0,
-  rate: 'Базовый',
-  showLogIn: true,
-  module: 'pk',
-})
-const emit = defineEmits(['logout'])
-useCurrentModule().value = props.module
-const { landing } = useUrls()
-const activeModule = ref<string | null>(null)
-const isMain = ref(false)
-const isContacts = ref(false)
-const isProfile = ref(false)
-const { t } = useI18n()
-const items = [
-  {
-    label: 'modals.mobile_navigation.type_tariff',
-    icon: IconInvoice,
-    value: 'tariff',
-  },
-  {
-    label: 'modals.mobile_navigation.type_main',
-    icon: IconMenu,
-    value: 'main',
-  },
-]
-function onLogout() {
-  emit('logout')
-  isProfile.value = false
-}
-watch(activeModule, (e) => {
-  if (e === 'main') {
-    isMain.value = true
-  }
-  else if (e === 'contacts') {
-    isContacts.value = true
-  }
-  else if (e === 'profile') {
-    isProfile.value = true
-  }
-  else if (e === 'tariff') {
-    navigateTo(`${landing}/tariffs`, { external: true })
-  }
-  activeModule.value = ''
-})
-</script>
-
-<template>
-  <div>
-    <content-navigation-modal v-model="isMain" @push-main="isMain = false" />
-    <contacts-mobile-model v-model="isContacts" @push-main="isContacts = false" />
-    <a-modal
-      v-model="isProfile"
-      @logout="isProfile = false"
-      @push-main="isProfile = false"
-    >
-      <div class="-mx-4">
-        <profile-menu
-          :email="email"
-          :balance="balance"
-          :days-remaining="daysRemaining"
-          :limit-remaining="limitRemaining"
-          :rate="rate"
-          :replenish="replenish"
-          :old-version="oldVersion"
-          @logout="onLogout"
-        />
-      </div>
-    </a-modal>
-    <div ref="bottom" class="sticky bottom-0 z-[10000] lg:hidden">
-      <a-bottom-navigation
-        v-model="activeModule"
-        :is-authenticated="isAuthenticated"
-        :email="email"
-        :days-remaining="daysRemaining"
-        :limit-remaining="limitRemaining"
-        :rate="rate"
-        :balance="balance"
-        :items="items"
-        @logout="onLogout"
-      />
-    </div>
-  </div>
-</template>
-
-<style scoped></style>
+<script setup lang="ts">
+import type { ProjectKeys } from '#adata-ui/components/navigation/header/types'
+import ContactsMobileModel from '#adata-ui/components/modals/ContactsMobileModel.vue'
+import ContentNavigationModal from '#adata-ui/components/modals/ContentNavigationModal.vue'
+import ProfileMenu from '#adata-ui/components/navigation/header/ProfileMenu.vue'
+import AModal from '#adata-ui/components/overlays/modal/AModal.vue'
+import { useCurrentModule } from '#adata-ui/composables/projectState'
+import { useUrls } from '#adata-ui/composables/useUrls'
+import IconInvoice from '#adata-ui/icons/invoice.vue'
+import IconMenu from '#adata-ui/icons/menu-filled.vue'
+
+interface Props {
+  replenish?: string
+  hasNotification?: boolean
+  email: string | undefined
+  rate: string
+  daysRemaining: number
+  limitRemaining: number
+  balance: number
+  isAuthenticated: boolean
+  showLogIn?: boolean
+  module?: ProjectKeys
+  oldVersion?: string
+}
+const props = withDefaults(defineProps<Props>(), {
+  limitRemaining: 0,
+  daysRemaining: 0,
+  balance: 0,
+  rate: 'Базовый',
+  showLogIn: true,
+  module: 'pk',
+})
+const emit = defineEmits(['logout'])
+useCurrentModule().value = props.module
+const { landing } = useUrls()
+const activeModule = ref<string | null>(null)
+const isMain = ref(false)
+const isContacts = ref(false)
+const isProfile = ref(false)
+const { t } = useI18n()
+const items = [
+  {
+    label: 'modals.mobile_navigation.type_tariff',
+    icon: IconInvoice,
+    value: 'tariff',
+  },
+  {
+    label: 'modals.mobile_navigation.type_main',
+    icon: IconMenu,
+    value: 'main',
+  },
+]
+function onLogout() {
+  emit('logout')
+  isProfile.value = false
+}
+watch(activeModule, (e) => {
+  if (e === 'main') {
+    isMain.value = true
+  }
+  else if (e === 'contacts') {
+    isContacts.value = true
+  }
+  else if (e === 'profile') {
+    isProfile.value = true
+  }
+  else if (e === 'tariff') {
+    navigateTo(`${landing}/tariffs`, { external: true })
+  }
+  activeModule.value = ''
+})
+</script>
+
+<template>
+  <div>
+    <content-navigation-modal v-model="isMain" @push-main="isMain = false" />
+    <contacts-mobile-model v-model="isContacts" @push-main="isContacts = false" />
+    <a-modal
+      v-model="isProfile"
+      @logout="isProfile = false"
+      @push-main="isProfile = false"
+    >
+      <div class="-mx-4">
+        <profile-menu
+          :email="email"
+          :balance="balance"
+          :days-remaining="daysRemaining"
+          :limit-remaining="limitRemaining"
+          :rate="rate"
+          :replenish="replenish"
+          :old-version="oldVersion"
+          @logout="onLogout"
+        />
+      </div>
+    </a-modal>
+    <div ref="bottom" class="sticky bottom-0 z-[10000] lg:hidden">
+      <a-bottom-navigation
+        v-model="activeModule"
+        :is-authenticated="isAuthenticated"
+        :email="email"
+        :days-remaining="daysRemaining"
+        :limit-remaining="limitRemaining"
+        :rate="rate"
+        :balance="balance"
+        :items="items"
+        @logout="onLogout"
+      />
+    </div>
+  </div>
+</template>
+
+<style scoped></style>