smaxapp
TypeScript icon, indicating that this package has built-in type declarations

13.6.15 • Public • Published

SmaxCommonLib

This library was generated to use in all module of SmaxApp.

Team

Author: @SmaxTeam from SmaxApp Dev Team.

Compatibility

Versions

Angular smaxapp
>=13.x.x =<15.x.x v13.x
> 15.x.x <16.x.x v16.x

Getting started

Step1: Installation

Run npm install smaxapp to install the library.

Step2: Import the SmaxAppModule

Import the SmaxAppModule in Angular application module:

import { SmaxAppModule } from 'smaxapp';
@NgModule({
  declarations: [AppComponent],
  imports: [SmaxAppModule.forRoot(), FormsModule],
  bootstrap: [AppComponent]
})
export class AppModule {}

Step3: Include a style file

@import "~/smaxapp/src/styles/style.scss";

Note

Angular version 13.x.x please add config in angular.json like this:

"stylePreprocessorOptions": {
  "includePaths": ["node_modules"]
}

Step4: Update angular.json

"assets": [
  {
    "glob": "**/*",
    "input": "node_modules/smaxapp/assets",
    "output": "/assets/"
  }
],

Step5: Use the components

<smaxapp-logo
  bizAlias="demo"
  [modules]="modules"
  [currentModule]="currentModule"
  [quickModules]="quickModules"
  [menuPlacement]="'bottom'"
>
</smaxapp-logo>

<smaxapp-input-mask></smaxapp-input-mask>
<br>
<smaxapp-input-suggest-money></smaxapp-input-suggest-money>
<br>
<smaxapp-image-preview [imageUrls]="imageUrls" [indexImage]="0">
  <div childContent>
    ... template for image preview
  </div>
</smaxapp-image-preview>
<br>
<smaxapp-modal-confirm (onConfirm)="`call func here if you want...`">
  <div childContent>
    ... template for modal confirm
  </div>
</smaxapp-modal-confirm>

<div class="wrapper-chat">
  <smaxapp-box-chat [biz]="biz" [infoOrder]="orderInfo" [currentModule]="'sale-center'" (eventEmit)="$event"></smaxapp-box-chat>
</div>

<div class="embed-bubble-chat">
  <smax-bubble-chat [biz]="biz" (eventEmit)="$event"></smax-bubble-chat>
</div>
import { ModalConfirmService } from 'smaxapp';

export class AppComponent {
  constructor(
      private modalConfirmService: ModalConfirmService,
  ) {}
  
  okeFunction() {
    console.log('confirm');
  }

  handleOpenModal() {
    const modalContent: IModalConfirmContent = {
      title: 'Xác nhận',
      description: 'Bạn có chắc chắn muốn xóa?',
      okText: 'Xóa',
      type: 'warning',
      modalType: 'advance',
    };
    this.modalConfirmService.openModal(modalContent, this.okeFunction());
  }
}

API

ImagePreviewComponent

Inputs

Input Type Default Required Description
[imageUrls] string[] [] yes List url image to show.
[indexImage] number 0 no Default display image with image's index of list urls

InputMaskComponent

Inputs

Input Type Default Required Description
[id] string '' yes Id of input.
[value] number 0 no Value of input
[placeholder] string 0 no Placeholder of input
[align] left | right left no Alignment of input
[require] boolean false no Requireable
[readonly] boolean false no Readonly
[isQuantity] boolean false no Is Quantity
[allowNegativeNumbers] boolean false no Is allow negative
[max] number null no Max Value
[min] number null no Min Value
[width] string | number null no Width of Input
[bizCurrency] IBizCurrency | unknown null yes Width of Input

Outputs

Output Type Description
(onChange) number Execute when change
(paste) Event Execute when change

InputSuggestMoneyComponent

Inputs

Input Type Default Required Description
[value] number 0 no Value of input
[placeholder] string 0 no Placeholder of input
[align] left | right left no Alignment of input
[suggestMax] number 0 no Max Value suggested
[amount] number 0 yes Amount value
[customClass] string yes Custom class
[optionInputCurrency] string yes Option Input
[disabled] string | null null yes Disabled
[template] any null no Template of Input
[tagEmpty] string Thẻ tag rỗng no Tag empty

Outputs

Output Type Description
(onChange) number Execute when change
(onRemove) Event Execute when remove

ModalConfirmComponent

IModalConfirmContent

Property Type Default Required Description
title string Xác nhận yes Title of modal
description string yes Description
okText string Ok yes Text of ok button
cancelText string Cancel yes Text of cancel button
type warning | info warning no Type notice
modalType default | advance default no Type of modal
noFooter boolean false no Show or Hide footer
noAcceptButton boolean false no Show or Hide Accept button

Outputs

Output Type Description
(onConfirm) event Execute when confirm

SmaxApp Logo

Types

Property Type Default Required Description
IModules object unknown yes Title of modal

Inputs

Output Type Description
modules IModules[] List Module
currentModule IModules Currently Module
quickModules string[] Id Quick Module

BoxChatComponent

Types

Property Type Default Required Description
Biz object unknown yes Biz
infoOrder {orderId; orderCode} unknown yes Biz
currentModule string `` yes Current Module Alias

Inputs

Output Type Description
biz Biz Biz
infoOrder InfoOrder Info Order
currentModule string Current Module Alias

BubbleChatComponent

Types

Property Type Default Required Description
Biz object unknown yes Biz

Inputs

Output Type Description
biz Biz Biz

Readme

Keywords

none

Package Sidebar

Install

npm i smaxapp

Weekly Downloads

3

Version

13.6.15

License

none

Unpacked Size

1.91 MB

Total Files

94

Last publish

Collaborators

  • duonglong
  • mtvc