From 120ffe7d139e3eed09473829cb7eab46549dfc80 Mon Sep 17 00:00:00 2001 From: nixa <4dmitr@gmail.com> Date: Wed, 10 Aug 2016 17:23:18 +0300 Subject: [PATCH] feat(smart-table): install ng2-smart-table --- package.json | 1 + src/app/pages/pages.routes.ts | 10 + .../smartTables/basicTables.service.ts | 672 ++++++++++++++++++ .../tables/components/smartTables/index.ts | 1 + .../smartTables/smartTables.component.ts | 34 + .../components/smartTables/smartTables.html | 9 + .../components/smartTables/smartTables.scss | 0 7 files changed, 727 insertions(+) create mode 100644 src/app/pages/tables/components/smartTables/basicTables.service.ts create mode 100644 src/app/pages/tables/components/smartTables/index.ts create mode 100644 src/app/pages/tables/components/smartTables/smartTables.component.ts create mode 100644 src/app/pages/tables/components/smartTables/smartTables.html create mode 100644 src/app/pages/tables/components/smartTables/smartTables.scss diff --git a/package.json b/package.json index 5d2b1a60..52527268 100644 --- a/package.json +++ b/package.json @@ -40,6 +40,7 @@ "ng2-bootstrap": "^1.0.20", "ng2-branchy": "^0.0.2-5", "ng2-ckeditor": "^1.0.4", + "ng2-smart-table": "0.0.2", "ng2-uploader": "0.5.6", "normalize.css": "^4.1.1", "rxjs": "5.0.0-beta.6", diff --git a/src/app/pages/pages.routes.ts b/src/app/pages/pages.routes.ts index c2e7b99d..36c1008c 100644 --- a/src/app/pages/pages.routes.ts +++ b/src/app/pages/pages.routes.ts @@ -22,6 +22,7 @@ import {Editors} from './editors/editors.component'; import {Ckeditor} from './editors/components/ckeditor/ckeditor.component'; import {Components} from './components/components.component'; import {TreeView} from './components/components/treeView/treeView.component'; +import {SmartTables} from './tables/components/smartTables/smartTables.component'; //noinspection TypeScriptValidateTypes export const PagesRoutes:RouterConfig = [ @@ -219,6 +220,15 @@ export const PagesRoutes:RouterConfig = [ title: 'Basic Tables', } } + }, + { + path: 'smarttables', + component: SmartTables, + data: { + menu: { + title: 'Smart Tables', + } + } } ] }, diff --git a/src/app/pages/tables/components/smartTables/basicTables.service.ts b/src/app/pages/tables/components/smartTables/basicTables.service.ts new file mode 100644 index 00000000..b8a01892 --- /dev/null +++ b/src/app/pages/tables/components/smartTables/basicTables.service.ts @@ -0,0 +1,672 @@ +import {Injectable} from '@angular/core'; + +@Injectable() +export class BasicTablesService { + + smartTablePageSize = 10; + + smartTableData = [ + { + id: 1, + firstName: 'Mark', + lastName: 'Otto', + username: '@mdo', + email: 'mdo@gmail.com', + age: '28' + }, + { + id: 2, + firstName: 'Jacob', + lastName: 'Thornton', + username: '@fat', + email: 'fat@yandex.ru', + age: '45' + }, + { + id: 3, + firstName: 'Larry', + lastName: 'Bird', + username: '@twitter', + email: 'twitter@outlook.com', + age: '18' + }, + { + id: 4, + firstName: 'John', + lastName: 'Snow', + username: '@snow', + email: 'snow@gmail.com', + age: '20' + }, + { + id: 5, + firstName: 'Jack', + lastName: 'Sparrow', + username: '@jack', + email: 'jack@yandex.ru', + age: '30' + }, + { + id: 6, + firstName: 'Ann', + lastName: 'Smith', + username: '@ann', + email: 'ann@gmail.com', + age: '21' + }, + { + id: 7, + firstName: 'Barbara', + lastName: 'Black', + username: '@barbara', + email: 'barbara@yandex.ru', + age: '43' + }, + { + id: 8, + firstName: 'Sevan', + lastName: 'Bagrat', + username: '@sevan', + email: 'sevan@outlook.com', + age: '13' + }, + { + id: 9, + firstName: 'Ruben', + lastName: 'Vardan', + username: '@ruben', + email: 'ruben@gmail.com', + age: '22' + }, + { + id: 10, + firstName: 'Karen', + lastName: 'Sevan', + username: '@karen', + email: 'karen@yandex.ru', + age: '33' + }, + { + id: 11, + firstName: 'Mark', + lastName: 'Otto', + username: '@mark', + email: 'mark@gmail.com', + age: '38' + }, + { + id: 12, + firstName: 'Jacob', + lastName: 'Thornton', + username: '@jacob', + email: 'jacob@yandex.ru', + age: '48' + }, + { + id: 13, + firstName: 'Haik', + lastName: 'Hakob', + username: '@haik', + email: 'haik@outlook.com', + age: '48' + }, + { + id: 14, + firstName: 'Garegin', + lastName: 'Jirair', + username: '@garegin', + email: 'garegin@gmail.com', + age: '40' + }, + { + id: 15, + firstName: 'Krikor', + lastName: 'Bedros', + username: '@krikor', + email: 'krikor@yandex.ru', + age: '32' + }, + { + "id": 16, + "firstName": "Francisca", + "lastName": "Brady", + "username": "@Gibson", + "email": "franciscagibson@comtours.com", + "age": 11 + }, + { + "id": 17, + "firstName": "Tillman", + "lastName": "Figueroa", + "username": "@Snow", + "email": "tillmansnow@comtours.com", + "age": 34 + }, + { + "id": 18, + "firstName": "Jimenez", + "lastName": "Morris", + "username": "@Bryant", + "email": "jimenezbryant@comtours.com", + "age": 45 + }, + { + "id": 19, + "firstName": "Sandoval", + "lastName": "Jacobson", + "username": "@Mcbride", + "email": "sandovalmcbride@comtours.com", + "age": 32 + }, + { + "id": 20, + "firstName": "Griffin", + "lastName": "Torres", + "username": "@Charles", + "email": "griffincharles@comtours.com", + "age": 19 + }, + { + "id": 21, + "firstName": "Cora", + "lastName": "Parker", + "username": "@Caldwell", + "email": "coracaldwell@comtours.com", + "age": 27 + }, + { + "id": 22, + "firstName": "Cindy", + "lastName": "Bond", + "username": "@Velez", + "email": "cindyvelez@comtours.com", + "age": 24 + }, + { + "id": 23, + "firstName": "Frieda", + "lastName": "Tyson", + "username": "@Craig", + "email": "friedacraig@comtours.com", + "age": 45 + }, + { + "id": 24, + "firstName": "Cote", + "lastName": "Holcomb", + "username": "@Rowe", + "email": "coterowe@comtours.com", + "age": 20 + }, + { + "id": 25, + "firstName": "Trujillo", + "lastName": "Mejia", + "username": "@Valenzuela", + "email": "trujillovalenzuela@comtours.com", + "age": 16 + }, + { + "id": 26, + "firstName": "Pruitt", + "lastName": "Shepard", + "username": "@Sloan", + "email": "pruittsloan@comtours.com", + "age": 44 + }, + { + "id": 27, + "firstName": "Sutton", + "lastName": "Ortega", + "username": "@Black", + "email": "suttonblack@comtours.com", + "age": 42 + }, + { + "id": 28, + "firstName": "Marion", + "lastName": "Heath", + "username": "@Espinoza", + "email": "marionespinoza@comtours.com", + "age": 47 + }, + { + "id": 29, + "firstName": "Newman", + "lastName": "Hicks", + "username": "@Keith", + "email": "newmankeith@comtours.com", + "age": 15 + }, + { + "id": 30, + "firstName": "Boyle", + "lastName": "Larson", + "username": "@Summers", + "email": "boylesummers@comtours.com", + "age": 32 + }, + { + "id": 31, + "firstName": "Haynes", + "lastName": "Vinson", + "username": "@Mckenzie", + "email": "haynesmckenzie@comtours.com", + "age": 15 + }, + { + "id": 32, + "firstName": "Miller", + "lastName": "Acosta", + "username": "@Young", + "email": "milleryoung@comtours.com", + "age": 55 + }, + { + "id": 33, + "firstName": "Johnston", + "lastName": "Brown", + "username": "@Knight", + "email": "johnstonknight@comtours.com", + "age": 29 + }, + { + "id": 34, + "firstName": "Lena", + "lastName": "Pitts", + "username": "@Forbes", + "email": "lenaforbes@comtours.com", + "age": 25 + }, + { + "id": 35, + "firstName": "Terrie", + "lastName": "Kennedy", + "username": "@Branch", + "email": "terriebranch@comtours.com", + "age": 37 + }, + { + "id": 36, + "firstName": "Louise", + "lastName": "Aguirre", + "username": "@Kirby", + "email": "louisekirby@comtours.com", + "age": 44 + }, + { + "id": 37, + "firstName": "David", + "lastName": "Patton", + "username": "@Sanders", + "email": "davidsanders@comtours.com", + "age": 26 + }, + { + "id": 38, + "firstName": "Holden", + "lastName": "Barlow", + "username": "@Mckinney", + "email": "holdenmckinney@comtours.com", + "age": 11 + }, + { + "id": 39, + "firstName": "Baker", + "lastName": "Rivera", + "username": "@Montoya", + "email": "bakermontoya@comtours.com", + "age": 47 + }, + { + "id": 40, + "firstName": "Belinda", + "lastName": "Lloyd", + "username": "@Calderon", + "email": "belindacalderon@comtours.com", + "age": 21 + }, + { + "id": 41, + "firstName": "Pearson", + "lastName": "Patrick", + "username": "@Clements", + "email": "pearsonclements@comtours.com", + "age": 42 + }, + { + "id": 42, + "firstName": "Alyce", + "lastName": "Mckee", + "username": "@Daugherty", + "email": "alycedaugherty@comtours.com", + "age": 55 + }, + { + "id": 43, + "firstName": "Valencia", + "lastName": "Spence", + "username": "@Olsen", + "email": "valenciaolsen@comtours.com", + "age": 20 + }, + { + "id": 44, + "firstName": "Leach", + "lastName": "Holcomb", + "username": "@Humphrey", + "email": "leachhumphrey@comtours.com", + "age": 28 + }, + { + "id": 45, + "firstName": "Moss", + "lastName": "Baxter", + "username": "@Fitzpatrick", + "email": "mossfitzpatrick@comtours.com", + "age": 51 + }, + { + "id": 46, + "firstName": "Jeanne", + "lastName": "Cooke", + "username": "@Ward", + "email": "jeanneward@comtours.com", + "age": 59 + }, + { + "id": 47, + "firstName": "Wilma", + "lastName": "Briggs", + "username": "@Kidd", + "email": "wilmakidd@comtours.com", + "age": 53 + }, + { + "id": 48, + "firstName": "Beatrice", + "lastName": "Perry", + "username": "@Gilbert", + "email": "beatricegilbert@comtours.com", + "age": 39 + }, + { + "id": 49, + "firstName": "Whitaker", + "lastName": "Hyde", + "username": "@Mcdonald", + "email": "whitakermcdonald@comtours.com", + "age": 35 + }, + { + "id": 50, + "firstName": "Rebekah", + "lastName": "Duran", + "username": "@Gross", + "email": "rebekahgross@comtours.com", + "age": 40 + }, + { + "id": 51, + "firstName": "Earline", + "lastName": "Mayer", + "username": "@Woodward", + "email": "earlinewoodward@comtours.com", + "age": 52 + }, + { + "id": 52, + "firstName": "Moran", + "lastName": "Baxter", + "username": "@Johns", + "email": "moranjohns@comtours.com", + "age": 20 + }, + { + "id": 53, + "firstName": "Nanette", + "lastName": "Hubbard", + "username": "@Cooke", + "email": "nanettecooke@comtours.com", + "age": 55 + }, + { + "id": 54, + "firstName": "Dalton", + "lastName": "Walker", + "username": "@Hendricks", + "email": "daltonhendricks@comtours.com", + "age": 25 + }, + { + "id": 55, + "firstName": "Bennett", + "lastName": "Blake", + "username": "@Pena", + "email": "bennettpena@comtours.com", + "age": 13 + }, + { + "id": 56, + "firstName": "Kellie", + "lastName": "Horton", + "username": "@Weiss", + "email": "kellieweiss@comtours.com", + "age": 48 + }, + { + "id": 57, + "firstName": "Hobbs", + "lastName": "Talley", + "username": "@Sanford", + "email": "hobbssanford@comtours.com", + "age": 28 + }, + { + "id": 58, + "firstName": "Mcguire", + "lastName": "Donaldson", + "username": "@Roman", + "email": "mcguireroman@comtours.com", + "age": 38 + }, + { + "id": 59, + "firstName": "Rodriquez", + "lastName": "Saunders", + "username": "@Harper", + "email": "rodriquezharper@comtours.com", + "age": 20 + }, + { + "id": 60, + "firstName": "Lou", + "lastName": "Conner", + "username": "@Sanchez", + "email": "lousanchez@comtours.com", + "age": 16 + } + ]; + + editableTableData:Array; + + peopleTableData = [ + { + id: 1, + firstName: 'Mark', + lastName: 'Otto', + username: '@mdo', + email: 'mdo@gmail.com', + age: '28', + status: 'info' + }, + { + id: 2, + firstName: 'Jacob', + lastName: 'Thornton', + username: '@fat', + email: 'fat@yandex.ru', + age: '45', + status: 'primary' + }, + { + id: 3, + firstName: 'Larry', + lastName: 'Bird', + username: '@twitter', + email: 'twitter@outlook.com', + age: '18', + status: 'success' + }, + { + id: 4, + firstName: 'John', + lastName: 'Snow', + username: '@snow', + email: 'snow@gmail.com', + age: '20', + status: 'danger' + }, + { + id: 5, + firstName: 'Jack', + lastName: 'Sparrow', + username: '@jack', + email: 'jack@yandex.ru', + age: '30', + status: 'warning' + } + ]; + + metricsTableData = [ + { + image: 'app/browsers/chrome.svg', + browser: 'Google Chrome', + visits: '10,392', + isVisitsUp: true, + purchases: '4,214', + isPurchasesUp: true, + percent: '45%', + isPercentUp: true + }, + { + image: 'app/browsers/firefox.svg', + browser: 'Mozilla Firefox', + visits: '7,873', + isVisitsUp: true, + purchases: '3,031', + isPurchasesUp: false, + percent: '28%', + isPercentUp: true + }, + { + image: 'app/browsers/ie.svg', + browser: 'Internet Explorer', + visits: '5,890', + isVisitsUp: false, + purchases: '2,102', + isPurchasesUp: false, + percent: '17%', + isPercentUp: false + }, + { + image: 'app/browsers/safari.svg', + browser: 'Safari', + visits: '4,001', + isVisitsUp: false, + purchases: '1,001', + isPurchasesUp: false, + percent: '14%', + isPercentUp: true + }, + { + image: 'app/browsers/opera.svg', + browser: 'Opera', + visits: '1,833', + isVisitsUp: true, + purchases: '83', + isPurchasesUp: true, + percent: '5%', + isPercentUp: false + } + ]; + + users = [ + { + "id": 1, + "name": "Esther Vang", + "status": 4, + "group": 3 + }, + { + "id": 2, + "name": "Leah Freeman", + "status": 3, + "group": 1 + }, + { + "id": 3, + "name": "Mathews Simpson", + "status": 3, + "group": 2 + }, + { + "id": 4, + "name": "Buckley Hopkins", + "group": 4 + }, + { + "id": 5, + "name": "Buckley Schwartz", + "status": 1, + "group": 1 + }, + { + "id": 6, + "name": "Mathews Hopkins", + "status": 4, + "group": 2 + }, + { + "id": 7, + "name": "Leah Vang", + "status": 4, + "group": 1 + }, + { + "id": 8, + "name": "Vang Schwartz", + "status": 4, + "group": 2 + }, + { + "id": 9, + "name": "Hopkin Esther", + "status": 1, + "group": 2 + }, + { + "id": 10, + "name": "Mathews Schwartz", + "status": 1, + "group": 3 + } + ]; + + statuses = [ + {value: 1, text: 'Good'}, + {value: 2, text: 'Awesome'}, + {value: 3, text: 'Excellent'}, + ]; + + groups = [ + {id: 1, text: 'user'}, + {id: 2, text: 'customer'}, + {id: 3, text: 'vip'}, + {id: 4, text: 'admin'} + ]; + + constructor() { + this.editableTableData = this.smartTableData.slice(0, 36); + } +} diff --git a/src/app/pages/tables/components/smartTables/index.ts b/src/app/pages/tables/components/smartTables/index.ts new file mode 100644 index 00000000..4492e392 --- /dev/null +++ b/src/app/pages/tables/components/smartTables/index.ts @@ -0,0 +1 @@ +export * from './smartTables.component'; diff --git a/src/app/pages/tables/components/smartTables/smartTables.component.ts b/src/app/pages/tables/components/smartTables/smartTables.component.ts new file mode 100644 index 00000000..e4ed410a --- /dev/null +++ b/src/app/pages/tables/components/smartTables/smartTables.component.ts @@ -0,0 +1,34 @@ +import {Component, ViewEncapsulation} from '@angular/core'; + +import {BasicTablesService} from './basicTables.service'; +import {BaCard} from '../../../../theme/components'; + +import {NG2_SMART_TABLE_DIRECTIVES, LocalDataSource} from 'ng2-smart-table'; + +@Component({ + selector: 'basic-tables', + encapsulation: ViewEncapsulation.None, + directives: [BaCard, NG2_SMART_TABLE_DIRECTIVES], + styles: [require('./smartTables.scss')], + template: require('./smartTables.html'), + providers: [BasicTablesService] +}) +export class SmartTables { + + settings = { + attr: { + class: 'table' + }, + columns: { + id: { + title: 'ID', + type: 'number' + }, + name: { + title: 'Product Name', + type: 'string' + } + } + }; + source: LocalDataSource = new LocalDataSource(); +} diff --git a/src/app/pages/tables/components/smartTables/smartTables.html b/src/app/pages/tables/components/smartTables/smartTables.html new file mode 100644 index 00000000..780bb4ee --- /dev/null +++ b/src/app/pages/tables/components/smartTables/smartTables.html @@ -0,0 +1,9 @@ +
+ +
+ + + +
+ +
diff --git a/src/app/pages/tables/components/smartTables/smartTables.scss b/src/app/pages/tables/components/smartTables/smartTables.scss new file mode 100644 index 00000000..e69de29b