tsv2-library 1.0.64 → 1.0.66

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "tsv2-library",
   "author": "fixedassetv2-fe",
-  "version": "1.0.64",
+  "version": "1.0.66",
   "license": "ISC",
   "homepage": "https://github.com/fixedassetv2-fe/tsv2-library#readme",
   "repository": {
@@ -39,6 +39,8 @@
   },
   "dependencies": {
     "@googlemaps/js-api-loader": "^2.0.2",
+    "@googlemaps/markerclusterer": "^2.6.2",
+    "@lottiefiles/dotlottie-web": "^0.61.0",
     "@types/google.maps": "^3.58.1",
     "@types/lodash": "^4.17.7",
     "@vueuse/core": "^10.7.2",

package/src/components/v2/Animation/Animation.vue.d.ts

@@ -0,0 +1,40 @@
+import type { Config } from '@lottiefiles/dotlottie-web';
+
+import { ClassComponent } from '../ts-helpers';
+
+export interface AnimationDefaultConfig {
+  libPath: 'supplyasset' | 'workspace' | 'admin';
+}
+
+export interface AnimationProps {
+  animation: 'loading-table-fa';
+  /**
+   * @default true
+   */
+  autoplay?: boolean;
+  /**
+   * @default true
+   */
+  loop?: boolean;
+  /**
+   * Custom configurations for the animation
+   * Reference: https://developers.lottiefiles.com/docs/dotlottie-player/dotlottie-web/api/config/
+   */
+  customConfig?: Partial<Config>;
+  canvasStyle?: string;
+}
+
+/**
+ * **Animation**
+ *
+ * _Animation is a lottie animation wrapper._
+ *
+ * @group Component
+ */
+declare class Animation extends ClassComponent<
+  AnimationProps,
+  unknown,
+  unknown
+> {}
+
+export default Animation;

package/src/components/v2/CustomColumn/CustomColumn.vue.d.ts

@@ -1,8 +1,27 @@
+import { TableColumn } from '../DataTable/DataTable.vue.d';
 import { ClassComponent } from '../ts-helpers';
 
+export type DragableColumn = TableColumn & { order?: number };
+
+export interface DataTableColumnConfig {
+  field: string;
+  pinned: boolean;
+  width: number | string;
+  visible: boolean;
+}
+
+export type CustomColumnEmits = {
+  'update:visibleColumns': [columns: TableColumn[]];
+  'update:reorderColumns': [columns: TableColumn[]];
+};
+
 export interface CustomColumnProps {
   tableId: string;
+  tableKey?: string;
+  tableName?: string;
+  tableData?: Data[];
   defaultColumns: TableColumn[];
+  defaultReorderColumns?: TableColumn[];
   visibleColumns: TableColumn[];
   /**
    * The maximum column count allowed
@@ -12,7 +31,10 @@ export interface CustomColumnProps {
   type?: 'menu' | 'flat';
 }
 
-declare class CustomColumn extends ClassComponent<CustomColumnProps> {
+declare class CustomColumn extends ClassComponent<
+  CustomColumnProps,
+  CustomColumnEmits
+> {
   /**
    * Method to show custom column menu.
    */

package/src/components/v2/DataTable/DataTable.vue.d.ts

@@ -5,15 +5,23 @@ import { ClassComponent } from '../ts-helpers';
 
 type Data = Record<string, any>;
 
-export type QueryParams = {
-  [key: string]: unknown;
-};
+export type QueryParams = Partial<Record<string, unknown>>;
 
-export type FetchResponse = {
-  data: Data[];
+export type FetchResponse<T = Data> = {
+  data: T[];
   totalRecords: number;
 };
 
+export type TableFetchResponse<T = Data> = {
+  message: string;
+  data: FetchResponse<T>;
+};
+
+export type ShortFetchResponse<T = Data> = {
+  message: string;
+  data: T;
+};
+
 export type TableCellComponent = {
   component: string | Component;
   props?: object;
@@ -149,6 +157,8 @@ export type TableColumn = {
   reorderable?: boolean;
   /**
    * Make the column cannot reordered by disabled dragability.
+   * Unlike `reorderable`, the column will still appear in the column visibility
+   * overlay if this is set to false.
    */
   dragable?: boolean;
   /**
@@ -158,7 +168,7 @@ export type TableColumn = {
   fixed?: boolean;
   visible?: boolean;
   /**
-   * Wether the column is checked by default, only for Custom Report Table
+   * Whether the column is checked by default
    * @default true
    */
   checkedByDefault?: boolean;

package/src/components/v2/Dialog/Dialog.vue.d.ts

@@ -232,6 +232,7 @@ export interface DialogProps {
    * @defaultValue true
    */
   autoZIndex?: boolean | undefined;
+  maskClass?: string | string[];
   /**
    * Position of the dialog.
    * @defaultValue center

package/src/components/v2/DialogConfirm/DialogConfirm.vue.d.ts

@@ -30,6 +30,11 @@ export interface DialogConfirmProps {
    * @default 'Yes, Continue'
    */
   confirmLabel?: string;
+  /**
+   * The label of the cancel button.
+   * @default 'Cancel' | 'Close'
+   */
+  cancelLabel?: string;
   /**
    * Pass true to disabled button confirm
    */

package/src/components/v2/DialogCoordinate/DialogCoordinate.vue.d.ts

@@ -39,6 +39,10 @@ export interface LatLngValue {
   lng: number | null;
 }
 
+export interface CoordinateValue extends LatLngValue {
+  address?: string;
+}
+
 export type InputMapMode = 'click' | 'drag' | 'center';
 
 export type MarkerConfig =
@@ -74,3 +78,23 @@ export interface MapFocusConfig {
   featureType: google.maps.FeatureType;
   featureStyleOptions: google.maps.FeatureStyleOptions;
 }
+
+export interface DialogCoordinateProps {
+  value?: LatLngValue & { _id?: string };
+  center?: [number, number];
+  zoom?: number;
+  mode?: InputMapMode;
+  colorScheme?: 'LIGHT' | 'DARK';
+  mapOptions?: google.maps.MapOptions;
+  customMarkers?: CustomMarker[];
+  inputMarkerConfig?: MarkerConfig;
+  type: 'input' | 'detail';
+  card?: boolean;
+}
+
+export interface CustomMarker {
+  lat: number;
+  lng: number;
+  title?: string;
+  desc?: string;
+}

package/src/components/v2/DialogForm/DialogForm.vue.d.ts

@@ -122,6 +122,17 @@ export interface DialogFormProps extends FormProps {
    * The severity will determine the dialog icons and color scheme.
    */
   severity?: 'success' | 'danger' | 'primary';
+  maskClass?: string | string[];
+  /**
+   * Whether to automatically manage layering.
+   * @defaultValue true
+   */
+  autoZIndex?: boolean | undefined;
+  /**
+   * Base zIndex value to use in layering.
+   * @defaultValue 0
+   */
+  baseZIndex?: number | undefined;
 }
 
 export interface ConfirmSlots {

package/src/components/v2/FailedLoad/FailedLoad.vue.d.ts

@@ -0,0 +1,26 @@
+import { ClassComponent } from '../ts-helpers';
+
+export interface FailedLoadEmits {
+  /**
+   * Emitted when the "Try again" button is clicked.
+   */
+  retry: () => void;
+}
+
+/**
+ * **TSVue v2 - FailedLoad**
+ *
+ * _FailedLoad is a component used to display a standardized error message when data loading fails, providing a retry mechanism._
+ *
+ * --- ---
+ * ![TSVue](https://ik.imagekit.io/kurniadev/TS-HEAD-BLACK.png)
+ *
+ * @group components
+ */
+declare class FailedLoad extends ClassComponent<
+  unknown,
+  unknown,
+  FailedLoadEmits
+> {}
+
+export default FailedLoad;

package/src/components/v2/FilterAssetValue/FilterAssetValue.vue.d.ts

@@ -0,0 +1,20 @@
+import { DefineComponent } from 'vue';
+import { QueryParams } from '../DataTable/DataTable.vue.d';
+
+export interface FilterAssetAttributeProps {
+  /**
+   * The filter object.
+   */
+  filter: QueryParams;
+}
+
+export type FilterAssetAttributeEmits = {
+  updateFields: [];
+};
+
+declare const FilterAssetValue: DefineComponent<
+  FilterAssetAttributeProps,
+  FilterAssetAttributeEmits
+>;
+
+export default FilterAssetValue;

package/src/components/v2/FilterCustomField/FilterCustomField.vue.d.ts

@@ -0,0 +1,17 @@
+import { DefineComponent } from 'vue';
+import {
+  FilterAssetAttributeProps,
+  FilterAssetAttributeEmits,
+} from '../FilterAssetValue/FilterAssetValue.vue.d';
+import { FilterField } from '@/types/filterField.type';
+
+export interface FilterCustomFieldProps extends FilterAssetAttributeProps {
+  customFieldFetchOptionFn: FilterField<QueryParams>['fetchOptionFn'];
+}
+
+declare const FilterCustomField: DefineComponent<
+  FilterCustomFieldProps,
+  FilterAssetAttributeEmits
+>;
+
+export default FilterCustomField;

package/src/components/v2/Icon/Icon.vue.d.ts

@@ -20,10 +20,12 @@ export type TSVueIcons =
   | 'arrow-left-right'
   | 'arrow-right'
   | 'arrow-right-fill'
+  | 'asset'
   | 'asset-view'
   | 'asset-name-view'
   | 'assignment'
   | 'audit'
+  | 'award-fill'
   | 'bell'
   | 'bell-alert'
   | 'borrow'
@@ -79,8 +81,12 @@ export type TSVueIcons =
   | 'image-add'
   | 'indeterminate-circle-fill'
   | 'info'
+  | 'infrared-thermometer'
+  | 'layout-grid-line'
   | 'link-unlink-m'
   | 'list-settings-line'
+  | 'list-check'
+  | 'list-check-2'
   | 'loader-4'
   | 'logout-box-r-line'
   | 'mail-open-line'
@@ -88,6 +94,7 @@ export type TSVueIcons =
   | 'map-2-line'
   | 'map-pin-line'
   | 'menu-line'
+  | 'menu-fold'
   | 'menu-unfold'
   | 'more'
   | 'move-to'
@@ -105,10 +112,12 @@ export type TSVueIcons =
   | 'qr-scan-line'
   | 'recycle-bin'
   | 'refresh'
+  | 'reload'
   | 'replace-tag'
   | 'report-tag'
   | 'repair-ticketing'
   | 'rfid'
+  | 'save-line'
   | 'search'
   | 'search-eye'
   | 'settings'
@@ -129,6 +138,7 @@ export type TSVueIcons =
   | 'user'
   | 'user-add-line'
   | 'user-follow-line'
+  | 'user-unfollow-line'
   | 'user-search'
   | 'user-settings'
   | 'verification';

package/src/components/v2/ImageCompressor/ImageCompressor.vue.d.ts

@@ -132,7 +132,7 @@ export type ImageCompressorEmits = {
   /**
    * On apply the image cropper.
    */
-  'apply': [value: ImageCompressorPayload];
+  'apply': [value: ImageCompressorPayload, index?: number];
   'update:defaultImage': [index?: number];
   /**
    * Emits on every changes in `field.value`

package/src/components/v2/InputCoordinate/InputCoordinate.vue.d.ts

@@ -1,12 +1,12 @@
 import { DefineComponent } from 'vue';
 import { Nullable } from '../ts-helpers';
-import { LatLngValue } from '../DialogCoordinate/DialogCoordinate.vue';
+import { CoordinateValue } from '../DialogCoordinate/DialogCoordinate.vue.d';
 
 /**
  * InputCoordinate component props
  */
 export interface InputCoordinateProps {
-  modelValue?: Nullable<LatLngValue>;
+  modelValue?: Nullable<CoordinateValue>;
   /**
    * Disabled state for both input fields.
    */
@@ -37,13 +37,19 @@ export interface InputCoordinateProps {
    * It is rarely use, this component has handled the validator message.
    */
   validatorMessage?: string;
+  /**
+   * Wether to show the input or not.
+   *
+   * @default true
+   */
+  showInput?: boolean;
 }
 
 /**
  * InputCoordinate component emits
  */
 export type InputCoordinateEmits = {
-  'update:modelValue': [payload?: Nullable<LatLngValue>];
+  'update:modelValue': [payload?: Nullable<CoordinateValue>];
 };
 
 /**

package/src/components/v2/InputPhoneNumber/InputPhoneNumber.vue.d.ts

@@ -68,6 +68,7 @@ export type InputPhoneNumberEmits = {
    * Emits when the input already filled.
    */
   'update:modelValue': [value?: string];
+  'blur': [value?: string];
 };
 
 /**

package/src/components/v2/InputText/InputText.vue.d.ts

@@ -109,7 +109,7 @@ export interface InputTextProps {
   /**
    * Wether the input should be trimmed or not.
    *
-   * @default true
+   * @default false
    */
   trimInput?: boolean;
 }

package/src/components/v2/InputURL/InputURL.vue.d.ts

@@ -64,6 +64,7 @@ export type InputURLEmits = {
    * Event emitted when the model value is updated
    */
   'update:modelValue': [payload?: Nullable<string>];
+  'blur': [payload?: Nullable<string>];
 };
 
 /**

package/src/components/v2/Textarea/Textarea.vue.d.ts

@@ -128,6 +128,7 @@ export type TextareaEmits = {
    * Emitted when the value changes.
    */
   'update:modelValue': [value: Nullable<string>];
+  'blur': [value?: Nullable<string>];
 };
 
 /**

package/src/components/v2/TransactionRoles/TransactionRoles.vue.d.ts

@@ -3,11 +3,13 @@ export type TransactionRoles = Addon & {
   assignment: boolean;
   transfer: boolean;
   disposal: boolean;
+  registration: boolean;
 };
 
 export type Addon = {
   repairTicketing: boolean;
   maintenance: boolean;
+  map: boolean;
   tracking: boolean;
   audit: boolean;
   assetControl: boolean;

package/src/module.d.ts

@@ -12,4 +12,7 @@ declare module 'qrcode' {
 interface Window {
   scannerWorker: Worker;
   toastGroups: string[] | undefined;
+  __wdio?: boolean;
+  __e2eMockScanCode__?: string;
+  __e2eMockSerialNumber__?: string;
 }

package/src/presets/datatable/index.js

@@ -84,7 +84,7 @@ export default {
   tbody: ({ instance, context }) => ({
     class: [
       // 'border-t border-surface-300 dark:border-surface-600',
-      '[&_tr:last-of-type>td]:!border-b-0',
+      // '[&_tr:last-of-type>td]:!border-b-0',
       '[&_tr:last-of-type>td:last-child]:!rounded-br-lg',
       '[&_tr:last-of-type>td:first-child]:!rounded-bl-lg',
       {

package/src/services/assets.service.ts

@@ -2,6 +2,8 @@ import axios, { AxiosInstance, AxiosResponse } from 'axios';
 import {
   GetAllAssetsQueryParams,
   GetAssetDetailParams,
+  GetAssetMapParams,
+  GetAssetMapResponse,
   GetAvailableAssetsQueryParams,
   GetLinkedAssetFamiliesResponse,
 } from '@/dto/assets.dto';
@@ -11,17 +13,19 @@ import { buildBodyParams } from '@/utils';
 export interface ServiceOptions {
   headers?: Record<string, unknown>;
   params?: Record<string, unknown>;
+  usePrefix?: boolean;
 }
 
 export const API = ({
   headers = {},
   params = {},
+  usePrefix = true,
 }: ServiceOptions = {}): AxiosInstance => {
   const user = JSON.parse(localStorage.getItem('user') ?? '{}');
   const BASE_URL = import.meta.env.VITE_APP_TAGSAMURAI_API;
 
   const instance = axios.create({
-    baseURL: `${BASE_URL}/assets/v2/assets`,
+    baseURL: `${BASE_URL}/assets/v2${usePrefix ? '/assets' : ''}`,
     headers: {
       'Content-type': 'application/json',
       'Authorization': `Bearer ${user.token}`,
@@ -33,6 +37,20 @@ export const API = ({
   return instance;
 };
 
+const postAssetList = (
+  params?: GetAllAssetsQueryParams,
+): Promise<AxiosResponse> => {
+  const body = buildBodyParams(params);
+  return API().post('/list', body);
+};
+
+const postAssetOption = (
+  params?: GetAllAssetsQueryParams,
+): Promise<AxiosResponse> => {
+  const body = buildBodyParams(params);
+  return API().post('/list/options', body);
+};
+
 const getAllAssets = (
   params: GetAllAssetsQueryParams,
 ): Promise<AxiosResponse> => {
@@ -104,8 +122,28 @@ const matchAssetWithTag = (
   return API({ params }).get('/by-id');
 };
 
+const getAssetMaps = (
+  params?: GetAssetMapParams,
+): Promise<AxiosResponse<GetAssetMapResponse>> => {
+  let abortController: AbortController | null = null;
+
+  // Cancel previous request
+  if (abortController) {
+    (abortController as AbortController).abort();
+  }
+
+  abortController = new AbortController();
+
+  return API({
+    usePrefix: false,
+    params: params as Record<string, unknown>,
+  }).get('/asset-maps', { signal: abortController.signal });
+};
+
 export default {
   getAllAssets,
+  postAssetList,
+  postAssetOption,
   getAvailableAssets,
   postAssetAvailableList,
   getAssetsById,
@@ -115,4 +153,5 @@ export default {
   getUnlinkedAssets,
   getOptions,
   scanAsset,
+  getAssetMaps,
 };

package/src/services/column.service.ts

@@ -0,0 +1,42 @@
+import { DataTableColumnConfig } from '@/components/v2/CustomColumn/CustomColumn.vue.d';
+import axios, { AxiosInstance, AxiosResponse } from 'axios';
+
+const getUser = (): Record<string, string> =>
+  JSON.parse(localStorage.getItem('user') ?? '{}');
+
+export const API = ({ headers = {}, params = {} } = {}): AxiosInstance => {
+  const user = getUser();
+
+  const BASE_URL = import.meta.env.VITE_APP_GLOBAL_SETTINGS_API;
+
+  const instance = axios.create({
+    baseURL: `${BASE_URL}/v1/global-settings`,
+    headers: {
+      'Content-type': 'application/json',
+      'Authorization': `Bearer ${user.token}`,
+      ...headers,
+    },
+    params,
+  });
+
+  return instance;
+};
+
+const ColumnServices = {
+  getColumnSetup: (
+    tableId: string,
+  ): Promise<AxiosResponse<{ data: DataTableColumnConfig[] }>> => {
+    const user = getUser();
+    return API().get(`/columns/${user._id}/${tableId}`);
+  },
+
+  editColumnSetup: (
+    tableId: string,
+    body: DataTableColumnConfig[],
+  ): Promise<AxiosResponse> => {
+    const user = getUser();
+    return API().put(`/columns/${user._id}/${tableId}`, { data: body });
+  },
+};
+
+export default ColumnServices;

package/src/services/settingsAttribute.service.ts

@@ -0,0 +1,41 @@
+import { ShortFetchResponse } from '@/components/v2/DataTable/DataTable.vue.d';
+import {
+  CustomField,
+  DepreciationCategory,
+} from '@/types/settingsAttribute.type';
+import axios, { AxiosInstance, AxiosResponse } from 'axios';
+
+const API = ({ headers = {}, params = {} } = {}): AxiosInstance => {
+  const user = JSON.parse(localStorage.getItem('user') ?? '{}');
+  const BASE_URL = import.meta.env.VITE_APP_TAGSAMURAI_API;
+
+  const instance = axios.create({
+    baseURL: `${BASE_URL}/settings-attribute/v2`,
+    headers: {
+      'Content-type': 'application/json',
+      'Authorization': `Bearer ${user.token}`,
+      ...headers,
+    },
+    params,
+  });
+
+  return instance;
+};
+
+const SettingsAttributeServices = {
+  getGeneralCustomFields: (): Promise<
+    AxiosResponse<ShortFetchResponse<CustomField[]>>
+  > => {
+    return API({ params: { type: 'General Information' } }).get(
+      '/custom-field/used-by-assets',
+    );
+  },
+
+  getDepreciationCategory: (): Promise<
+    AxiosResponse<ShortFetchResponse<DepreciationCategory[]>>
+  > => {
+    return API().get('/depreciation-category');
+  },
+};
+
+export default SettingsAttributeServices;

package/dist/src/components/v2/DataTable/store/dataTable.store.d.ts

@@ -1,22 +0,0 @@
-export interface DataTableStore {
-    /**
-     * Get the config object from the store.
-     */
-    config: DataTableConfig;
-    /**
-     * Update config for specific Table.
-     *
-     * @param id The table ID
-     * @param columnsConfig The columns configuration
-     */
-    setConfig: (id: string, columnsConfig: DataTableColumnConfig[]) => Promise<void>;
-}
-export type DataTableConfig = Record<string, DataTableColumnConfig[]>;
-export interface DataTableColumnConfig {
-    field: string;
-    width: number | string;
-    fixed: boolean;
-    visible: boolean;
-}
-declare const useDataTableStore: () => Promise<DataTableStore>;
-export default useDataTableStore;