@winchsa/ui 0.1.30 → 0.1.33

package/dist/components/table/FilterGenerator.vue

@@ -1,231 +0,0 @@
-<script setup>
-import { computed, ref, watch } from "vue";
-import { VCol, VRow } from "vuetify/components";
-import { useI18n } from "vue-i18n";
-import { getErrorMessage } from "../../utils/formValidation";
-import { useIsMobile } from "../../composables/useIsMobile";
-import AutocompleteInput from "../forms/AutocompleteInput.vue";
-import AppSelect from "../forms/AppSelect.vue";
-import AppTextField from "../forms/AppTextField.vue";
-import DatePicker from "../forms/DatePicker.vue";
-import DatePickerRange from "../forms/DatePickerRange.vue";
-import LicensePlateInput from "../forms/LicensePlateInput.vue";
-import MobileInput from "../forms/MobileInput.vue";
-import RangeInput from "../forms/RangeInput.vue";
-import BankSelect from "../forms/BankSelect.vue";
-const props = defineProps({
-  modelValue: { type: null, required: true },
-  forms: { type: Array, required: true },
-  errors: { type: Array, required: false, default: () => [] }
-});
-const emit = defineEmits(["update:modelValue"]);
-const { t } = useI18n();
-const formsFilters = ref(props.forms || []);
-const filters = computed(() => {
-  return formsFilters.value.map((form) => {
-    const isSelectOrAutocomplete = ["select", "autocomplete", "autocompleteGroups"].includes(form.type ?? "");
-    const baseForm = {
-      ...form,
-      clearable: form.clearable ?? true,
-      ...isSelectOrAutocomplete && {
-        closableChips: form.closableChips ?? true,
-        itemLabel: form.itemLabel ?? "name",
-        trackBy: form.trackBy ?? "id"
-      }
-    };
-    if (form.hasLang && form.options) {
-      const translatedOptions = form.options.map((option) => ({
-        ...option,
-        name: option?.allowTranslate && option.name ? t(option.name) : option.name
-      }));
-      return {
-        ...baseForm,
-        options: translatedOptions
-      };
-    }
-    return baseForm;
-  });
-});
-const placeholder = (form) => {
-  return form.placeholder ?? t(`inputs.${form.type === "text" || form.type === void 0 ? "placeholder_search" : "placeholder_select"}`, { name: t(form.label) });
-};
-const value = computed({
-  get() {
-    return props.modelValue;
-  },
-  set(value2) {
-    emit("update:modelValue", value2 || "");
-  }
-});
-watch(() => props.forms, (value2) => {
-  formsFilters.value = value2 || [];
-});
-watch(
-  () => props.forms,
-  (filter) => {
-    formsFilters.value = filter || [];
-    if (!filter) {
-      return;
-    }
-    filter.forEach((item) => {
-      if (item?.value) {
-        value.value[item.name] = item.value;
-      }
-    });
-  },
-  {
-    deep: true,
-    immediate: true
-  }
-);
-</script>
-
-<template>
-  <VRow :class="useIsMobile().value ? 'pt-8' : 'pt-4'">
-    <template
-      v-for="(form, key) in filters"
-      :key="key"
-    >
-      <VCol
-        v-if="form.type !== 'datepickerRange'"
-        cols="12"
-        sm="3"
-        class="py-0"
-        :class="{
-  'd-none': form.invisible
-}"
-      >
-        <AppTextField
-          v-if="form.type === 'text' || form.type === undefined"
-          v-model="value[form.name]"
-          :label="form.label"
-          :placeholder="placeholder(form)"
-          density="compact"
-          :rules="form.rules"
-          :error-messages="getErrorMessage(errors, form.name)"
-          :clearable="form.clearable"
-          :closable-chips="form.closableChips"
-        />
-
-        <RangeInput
-          v-if="form.type === 'range'"
-          v-model="value[form.name]"
-          :label="form.label"
-          :class="form.class"
-          :rules="form.rules"
-          :error-messages="getErrorMessage(errors, form.name)"
-        />
-
-        <AppSelect
-          v-if="form.type === 'select'"
-          v-model="value[form.name]"
-          :label="form.label"
-          :placeholder="placeholder(form)"
-          :items="form?.options"
-          :item-title="form.itemLabel || 'name'"
-          :item-value="form.trackBy || 'id'"
-          :multiple="form.multiple"
-          :chips="form.multiple"
-          :clearable="form.clearable"
-          :closable-chips="form.closableChips"
-          :rules="form.rules"
-          :error-messages="getErrorMessage(errors, form.name)"
-          clear-icon="tabler-x"
-        />
-
-        <AutocompleteInput
-          v-if="form.type === 'autocomplete'"
-          v-model="value[form.name]"
-          :url="form.urlSearch"
-          :label="form.label"
-          :item-label="form.itemLabel || 'name'"
-          :track-by="form.trackBy || 'id'"
-          :track-by-value="form.trackByValue"
-          :search-internally="form.searchInternally"
-          :multiple="form.multiple"
-          :params="form.params"
-          :placeholder="placeholder(form)"
-          :required="form.rules && form.rules.length > 0"
-          :error-messages="getErrorMessage(errors, form.name)"
-          searchable
-          :options="form.options"
-        />
-
-        <AutocompleteInput
-          v-if="form.type === 'autocompleteGroups' && form.urlSearch"
-          v-model="value[form.name]"
-          :url="form.urlSearch"
-          :label="form.label"
-          :item-label="form.itemLabel || 'name'"
-          :track-by="form.trackBy || 'id'"
-          :track-by-value="form.trackByValue"
-          :params="form.params"
-          :multiple="form.multiple"
-          :placeholder="placeholder(form)"
-          :required="form.rules && form.rules.length > 0"
-          :error-messages="getErrorMessage(errors, form.name)"
-          group-label="name"
-          group-values="children"
-          :search-internally="form.searchInternally"
-          grouped
-          searchable
-        />
-
-        <MobileInput
-          v-if="form.type === 'mobile'"
-          v-model="value[form.name]"
-          :label="form.label"
-          :rules="form.rules"
-          :error-messages="getErrorMessage(errors, form.name)"
-        />
-
-        <BankSelect
-          v-if="form.type === 'bankSelect'"
-          v-model="value[form.name]"
-          :search-internally="form.searchInternally"
-          :track-by-value="form.trackByValue"
-          :multiple="form.multiple"
-          :params="form.params"
-          :error-messages="getErrorMessage(errors, form.name)"
-        />
-
-        <LicensePlateInput
-          v-if="form.type === 'licensePlate'"
-          v-model="value[form.name]"
-          :label="form.label"
-          :rules="form.rules"
-          :error-messages="getErrorMessage(errors, form.name)"
-        />
-
-        <DatePicker
-          v-if="form.type === 'datepicker'"
-          v-model="value[form.name]"
-          show-today
-          display-format="DD/MM/YYYY"
-          :label="form.label"
-          :rules="form.rules"
-          :clearable="form.clearable"
-          :min-date="form.fromMinDate"
-          :max-date="form.fromMaxDate"
-          :placeholder="placeholder(form)"
-          :error-messages="getErrorMessage(errors, form.name)"
-        />
-      </VCol>
-
-      <template v-else>
-        <DatePickerRange
-          v-if="form.type === 'datepickerRange'"
-          v-model="value[form.name]"
-          :to-error-messages="getErrorMessage(errors, `${form.name}.0`)"
-          :from-error-messages="getErrorMessage(errors, `${form.name}.1`)"
-          :rules="form.rules"
-          :from-min-date="form.fromMinDate"
-          :to-min-date="form.toMinDate"
-          :from-max-date="form.fromMaxDate"
-          :to-max-date="form.toMaxDate"
-          clearable
-        />
-      </template>
-    </template>
-  </VRow>
-</template>

package/dist/components/table/FilterGenerator.vue.d.ts

@@ -1,13 +0,0 @@
-import type { FormFilter, ErrorResponseFiled } from '../../types';
-type __VLS_Props = {
-    modelValue: any;
-    forms: FormFilter[];
-    errors?: ErrorResponseFiled[];
-};
-declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    "update:modelValue": (value: unknown) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:modelValue"?: ((value: unknown) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: typeof __VLS_export;
-export default _default;

package/dist/components/table/StaticTable.d.vue.ts

@@ -1,34 +0,0 @@
-declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: __VLS_PrettifyLocal<{
-        items: T[];
-        subItemsKey?: string;
-        headers: {
-            key: string;
-            label?: string;
-            grayColorWhenNull?: boolean;
-            type?: "number" | "string";
-            dashedWhenNull?: boolean;
-        }[];
-    }> & import("vue").PublicProps & (typeof globalThis extends {
-        __VLS_PROPS_FALLBACK: infer P;
-    } ? P : {});
-    expose: (exposed: {}) => void;
-    attrs: any;
-    slots: {
-        [x: string]: ((props: {
-            item: T;
-        }) => any) | undefined;
-    } & {
-        [x: string]: ((props: {
-            item: any;
-        }) => any) | undefined;
-    };
-    emit: {};
-}>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
-};
-declare const _default: typeof __VLS_export;
-export default _default;
-type __VLS_PrettifyLocal<T> = {
-    [K in keyof T as K]: T[K];
-} & {};

package/dist/components/table/StaticTable.vue

@@ -1,152 +0,0 @@
-<script setup>
-import { computed, onMounted, onUpdated, ref } from "vue";
-import { useRoute } from "vue-router";
-import { useI18n } from "vue-i18n";
-import { useIsMobile } from "../../composables/useIsMobile";
-const { t } = useI18n();
-const route = useRoute();
-const props = defineProps({
-  items: { type: Array, required: true, default: () => [] },
-  subItemsKey: { type: String, required: false, default: "" },
-  headers: { type: Array, required: true, default: () => [] }
-});
-const activeCell = ref();
-function getProperty(item, key) {
-  if (typeof item === "string" || item === void 0 || item === null) {
-    return item;
-  }
-  return key.split(".").reduce((value, k) => value && value[k] ? value[k] : null, item);
-}
-const headers = computed(() => props.headers.filter((e) => e.key !== "index").map((header) => {
-  return {
-    ...header,
-    label: t(header.label)
-  };
-}));
-const indexHeader = computed(() => props.headers.find((e) => e.key === "index"));
-const activeCellId = computed(() => {
-  return function(item) {
-    if (!!item.winch_id && !!activeCell.value && item.winch_id === activeCell.value) {
-      return "active-cell";
-    } else {
-      return void 0;
-    }
-  };
-});
-onMounted(() => {
-  if (route.query.winch_id) {
-    activeCell.value = route.query.winch_id;
-  }
-});
-onUpdated(() => {
-  const activeCellElement = document.getElementById("active-cell");
-  if (activeCellElement) {
-    const windowHeight = window.innerHeight;
-    const elementPosition = activeCellElement.getBoundingClientRect().top;
-    const offsetPosition = elementPosition - windowHeight / 2;
-    window.scrollTo({
-      top: offsetPosition,
-      behavior: "smooth"
-    });
-  }
-});
-</script>
-
-<template>
-  <div class="secondary-table" :class="{
-  'responsive-table': useIsMobile().value
-}">
-    <table>
-      <thead>
-        <tr>
-          <th key="index" class="static-table-header-first-column">
-            #
-          </th>
-          <th v-for="(header, index) in headers" :key="`header-${index}-${header.key}`">
-            {{ header.label }}
-          </th>
-        </tr>
-      </thead>
-
-      <tbody>
-        <template v-for="(item, index) in items" :key="`item-tr-${index}`">
-          <tr :id="activeCellId(item)">
-            <td :class="{
-  'active-cell': !!item.winch_id && !!activeCell && item.winch_id === activeCell
-}">
-              {{ index + 1 }}
-            </td>
-            <td
-              v-for="header in headers"
-              :key="`item-td-${header.key}`"
-              :class="{
-  'bg-grayish-blue': header.grayColorWhenNull && getProperty(item, header.key) === null,
-  'active-cell': !!item.winch_id && !!activeCell && item.winch_id === activeCell
-}"
-            >
-              <slot :name="header.key" :item="item">
-                {{ getProperty(item, header.key) !== null ? getProperty(item, header.key) : header?.type === "number" ? 0 : header?.dashedWhenNull === true || header?.dashedWhenNull === void 0 ? "-" : ""
-                }}
-              </slot>
-            </td>
-          </tr>
-
-          <tr v-for="(subItem, subIndex) in item[subItemsKey]" :key="`sub-item-tr-${subIndex}`">
-            <td :class="{
-  'bg-grayish-blue': indexHeader?.grayColorWhenNull
-}" />
-            <td
-              v-for="header in headers"
-              :key="`item-td-${subIndex}-${header.key}`"
-              :class="{
-  'bg-grayish-blue': header.grayColorWhenNull && getProperty(subItem, header.key) === null
-}"
-            >
-              <slot :name="header.key" :item="subItem">
-                {{ getProperty(subItem, header.key) !== null ? getProperty(subItem, header.key) : header?.type === "number" ? 0 : header?.dashedWhenNull === true || header?.dashedWhenNull === void 0 ? "-" : ""
-                }}
-              </slot>
-            </td>
-          </tr>
-        </template>
-      </tbody>
-    </table>
-  </div>
-</template>
-
-<style scoped>
-.secondary-table table {
-  width: 100% !important;
-  border-collapse: collapse !important;
-  border-spacing: 0 !important;
-  border: 1px solid rgb(var(--v-theme-silver)) !important;
-  font-size: 13px !important;
-}
-.secondary-table table th {
-  padding: 12px 16px !important;
-  border: 1px solid rgb(var(--v-theme-silver)) !important;
-  background-color: rgb(var(--v-theme-gray-200)) !important;
-  text-align: start !important;
-  color: rgb(var(--v-theme-on-surface)) !important;
-}
-.secondary-table table td {
-  padding: 16px !important;
-  border: 1px solid rgb(var(--v-theme-silver)) !important;
-  text-align: start !important;
-  color: rgb(var(--v-theme-on-surface)) !important;
-}
-
-.active-cell {
-  background-color: rgba(var(--v-theme-primary), 0.15) !important;
-}
-
-.responsive-table table th {
-  position: unset !important;
-  top: 0 !important;
-  z-index: 10 !important;
-}
-
-.static-table-header-first-column {
-  width: 50px !important;
-}
-</style>

package/dist/components/table/StaticTable.vue.d.ts

@@ -1,34 +0,0 @@
-declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: __VLS_PrettifyLocal<{
-        items: T[];
-        subItemsKey?: string;
-        headers: {
-            key: string;
-            label?: string;
-            grayColorWhenNull?: boolean;
-            type?: "number" | "string";
-            dashedWhenNull?: boolean;
-        }[];
-    }> & import("vue").PublicProps & (typeof globalThis extends {
-        __VLS_PROPS_FALLBACK: infer P;
-    } ? P : {});
-    expose: (exposed: {}) => void;
-    attrs: any;
-    slots: {
-        [x: string]: ((props: {
-            item: T;
-        }) => any) | undefined;
-    } & {
-        [x: string]: ((props: {
-            item: any;
-        }) => any) | undefined;
-    };
-    emit: {};
-}>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
-};
-declare const _default: typeof __VLS_export;
-export default _default;
-type __VLS_PrettifyLocal<T> = {
-    [K in keyof T as K]: T[K];
-} & {};

package/dist/components/table/TablePagination.d.vue.ts

@@ -1,15 +0,0 @@
-import type { Pagination } from '../../types';
-type __VLS_Props = {
-    pagination: Pagination;
-};
-type __VLS_ModelProps = {
-    modelValue?: number;
-};
-type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: number) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((value: number) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: typeof __VLS_export;
-export default _default;

package/dist/components/table/TablePagination.vue

@@ -1,73 +0,0 @@
-<script setup>
-import { VPagination, VBtn } from "vuetify/components";
-import { useI18n } from "vue-i18n";
-import { useIsMobile } from "../../composables/useIsMobile";
-defineProps({
-  pagination: { type: Object, required: true }
-});
-const { t } = useI18n();
-const currentPage = defineModel({ type: Number, ...{ default: 0 } });
-</script>
-
-<template>
-  <div class="d-flex align-center justify-sm-space-between justify-center flex-wrap gap-3 pa-5 pt-5 mt-auto">
-    <p class="text-sm text-disabled mb-0">
-      {{
-        t('pagination.info', {
-          from: pagination.from > 0 ? pagination.from : 0,
-          to: pagination.to > 0 ? pagination.to : 0,
-          total: pagination.total > 0 ? pagination.total : 0,
-        })
-      }}
-    </p>
-
-    <VPagination
-      v-model="currentPage"
-      :length="pagination.last_page"
-      :total-visible="useIsMobile().value ? 3 : 5"
-      size="small"
-    >
-      <template #item="{ isActive, page, ...slotProps }">
-        <VBtn
-          v-bind="slotProps"
-          variant="tonal"
-          size="small"
-          density="comfortable"
-          :class="{
-  'text-primary': isActive
-}"
-          :color="isActive ? 'primary' : 'on-surface'"
-          icon
-          :disabled="slotProps.props.disabled"
-          @click="currentPage = Number(page)"
-        >
-          {{ page }}
-        </VBtn>
-      </template>
-
-      <template #prev="slotProps">
-        <VBtn
-          variant="tonal"
-          color="default"
-          v-bind="slotProps"
-          size="small"
-          :icon="false"
-        >
-          {{ t("pagination.previous") }}
-        </VBtn>
-      </template>
-
-      <template #next="slotProps">
-        <VBtn
-          variant="tonal"
-          color="default"
-          v-bind="slotProps"
-          size="small"
-          :icon="false"
-        >
-          {{ t("pagination.next") }}
-        </VBtn>
-      </template>
-    </VPagination>
-  </div>
-</template>

package/dist/components/table/TablePagination.vue.d.ts

@@ -1,15 +0,0 @@
-import type { Pagination } from '../../types';
-type __VLS_Props = {
-    pagination: Pagination;
-};
-type __VLS_ModelProps = {
-    modelValue?: number;
-};
-type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: number) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((value: number) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: typeof __VLS_export;
-export default _default;

package/dist/composables/useIsMobile.d.ts

@@ -1 +0,0 @@
-export declare function useIsMobile(): import("vue").ComputedRef<boolean>;

package/dist/composables/useIsMobile.js

@@ -1,10 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useIsMobile = useIsMobile;
-var _vuetify = require("vuetify");
-function useIsMobile() {
-  return (0, _vuetify.useDisplay)().mobile;
-}

package/dist/composables/useIsMobile.mjs

@@ -1,4 +0,0 @@
-import { useDisplay } from "vuetify";
-export function useIsMobile() {
-  return useDisplay().mobile;
-}

package/dist/composables/useTableFilters.d.ts

@@ -1,23 +0,0 @@
-import { type ComputedRef } from 'vue';
-import type { FormFilter } from '../types';
-type TableFiltersOptions = {
-    formFilters: ComputedRef<FormFilter[]>;
-    syncFiltersWithUrl: boolean;
-};
-export declare function useTableFilters({ formFilters, syncFiltersWithUrl }: TableFiltersOptions): {
-    processedFormFilters: ComputedRef<FormFilter[]>;
-    filters: import("vue").Ref<Record<string, string | number | string[] | [] | number[] | object[] | (string | number | null)[] | null | undefined>, Record<string, string | number | string[] | [] | number[] | object[] | (string | number | null)[] | null | undefined>>;
-    urlQueryParams: ComputedRef<Record<string, string | number | string[] | [] | number[] | object[] | (string | number | null)[] | null | undefined>>;
-};
-type PaginationOptions = {
-    syncFiltersWithUrl: boolean;
-    defaultValues?: {
-        pageNumber?: number;
-        pageSize?: number;
-    };
-};
-export declare function usePagination(options: PaginationOptions): {
-    currentPage: import("vue").Ref<number, number>;
-    itemsPerPage: import("vue").Ref<number, number>;
-};
-export {};