@lemoncloud/lemon-admin-lib v0.0.5

Lemon Admin Library

Reusable angular card component with bootstrap

Installation

$ npm i @lemoncloud/lemon-admin-lib 
$ yarn install @lemoncloud/lemon-admin-lib 

Demo

• lemon-admin-card

Usage

Example

Import each LemonAdminLibModule into your module file and use the lemon admin component anywhere.

import { LemonAdminLibModule } from '@lemoncloud/lemon-admin-lib';

@NgModule({
    imports: [LemonAdminLibModule]
})

Then add data for lemon-admin-card into your component

import { Component } from '@angular/core';

@Component({
  selector: 'your-component',
  template: `
    <lemon-admin-card [data]="rawData" (actionOutput)="outputFunc($event)"></lemon-admin-card>
  `,
})
export class YourComponent {
    rawData = {
        title: 'TEST-TITLE',
        badge: 'badgeData',
        actions: [
            { name: 'TestAction1', request: 'testurl1' },
            { name: 'TestAction2', request: 'testurl2' },
            { name: 'TestAction3', request: 'testurl3' },
        ],
        fields: [
            { title: 'TestField1', value: 'testFieldValue1', isOneColumn: false },
            { title: 'TestField2', value: 'testFieldValue2', isOneColumn: false },
            { title: 'OneColumnField1', value: 'OneColumnFieldValue_1111111111111111', isOneColumn: true },
            { title: 'TestField4', value: 'testFieldValue4', isOneColumn: false },
            { title: 'OneColumnField2', value: 'OneColumnFieldValue_2222222222222222', isOneColumn: true },
            { title: 'TestField6', value: 'testFieldValue6', isOneColumn: false },
        ]
    };
    
    constructor() { }
    
    public outputFunc(event: any) {
        // TODO: add something...
        console.log(event)
    }
}

License

MIT license.