diff --git a/README.md b/README.md index 7a239e5..8b0e3bb 100755 --- a/README.md +++ b/README.md @@ -1,37 +1,124 @@ -Master Branch: [![Build Status](https://travis-ci.org/gerard2p/ember-cli-crudtable.svg?branch=master)](https://travis-ci.org/gerard2p/ember-cli-crudtable) +# CRUD Table [![Build Status](https://img.shields.io/travis/gerard2p/ember-cli-crudtable.svg?branch=master&style=flat-square)](https://travis-ci.org/gerard2p/ember-cli-crudtable) [![NPM Version](http://img.shields.io/npm/v/ember-cli-crudtable.svg?style=flat-square)](https://www.npmjs.org/package/ember-cli-crudtable) [![NPM Downlaads](http://img.shields.io/npm/dm/ember-cli-crudtable.svg?style=flat-square)](https://www.npmjs.org/package/ember-cli-crudtable) +This addon allows you to easly create a CRUD Table, it will take you only 5s!. +___ -Development Branch: [![Build Status](https://travis-ci.org/gerard2p/ember-cli-crudtable.svg?branch=development)](https://travis-ci.org/gerard2p/ember-cli-crudtable) -# Hello Every One -I've didn't notice that people was watching this proyect, so i'm sorry for the lack of documentation. -Today (24 March, 2015) I just finished one version wich is working, so hang on a second and tomorrow I'll update the docuemntation. +##Development [![Build Status](https://img.shields.io/travis/gerard2p/ember-cli-crudtable.svg?style=flat-square&branch=development)](https://travis-ci.org/gerard2p/ember-cli-crudtable) +___ -If you could support me by following me, or maybe by letting any comment on the issue section It'll be great. +##Installation +``` +ember install:addon ember-cli-crudtable +``` -Thank You :) +##How to use it +You can use the helper **{{crud-table}}** there are some minimun variables you must specify and these are: +###Minimun Configuration +1. class **The class name you want the component to have** +2. fields **The field names you want the component to render separated by ","** -# Ember-cli-crudtable +###Action Configuration +These variables are completed optional, if you're using the integrated mixin for the controller. -This README outlines the details of collaborating on this Ember addon. +1. createRecord: [default: '*create*'] +1. updateRecord: [default: '*update*'] +1. deleteRecord: [default: '*delete*'] +1. cancelRecord: [default: '*cancel*'] + 2. This actions is triggered when click on **"cancel"**, the default configuration makes a rollback on the record or deletes it if new. +1. getRecord: [default: '*getRecord*'] + 2. This action creates a new empty record. +1. searchRecord: [default: '*FetchData*'] + 2. This actions if the one witch searches for your records. -## Installation +###Style Configuration +1. stripped: [ true| **false** ] - Makes the table to render stripped. +1. hover: [ true | **false** ] - Allows to hover the table. -* `git clone` this repository -* `npm install` -* `bower install` +##Controller Configuration +You can use this very same code when creating your controller and the only thing you have to worry about is to indicate the model. -## Running +``` +import CTABLE from 'ember-cli-crudtable/mixins/crud-controller'; +import Ember from 'ember' -* `ember server` -* Visit your app at http://localhost:4200. +var CrudTable = CTABLE('school'); +export default Ember.ObjectController.extend(CrudTable); +``` -## Running Tests -* `ember test` -* `ember test --server` +##Full Example +``` +//app/router.js +import Ember from 'ember'; +import config from './config/environment'; -## Building +var Router = Ember.Router.extend({ + location: config.locationType, + rootURL: config.baseURL +}); -* `ember build` +Router.map(function () { + this.resource('schools'); +}); -For more information on using ember-cli, visit [http://www.ember-cli.com/](http://www.ember-cli.com/). +export default Router; + +``` + +``` +//app/models/school.js +import DS from 'ember-data'; + +var attr = DS.attr; + +export default DS.Model.extend({ + Name: attr('string'), + City: attr('string'), + Adress: attr('string'), + CP: attr('string'), + Responsable:attr('string'), + AmountStudents:attr('number') +}); + +``` + +``` +//app/controllers/schools/index.js +import CTABLE from 'ember-cli-crudtable/mixins/crud-controller'; +import Ember from 'ember' + +var CrudTable = CTABLE('school'); +export default Ember.ObjectController.extend(CrudTable); +``` + + +``` +//app/templates/schools/index.hbs +{{crud-table +fields="Name,City,Adress" +deleteRecord='delete' +updateRecord='update' +createRecord='create'}} +``` + +Thats All you can have now a fully CRUD table that communicates with your server and allows pagination. + + +##Pagination +The pagination data must be included in the meta response of your server so ember-data can use it and crudtable has access to it. + +This is a sample meta: + +``` +{ + "meta":{ + "next":2, + "previous"":null, + "count":20 + } +} +``` + +##Upcoming +I'm in a little hurry but as soon as posible i'll be adding more features and also providing a more detailed doc about the functions. +But try it, is quite simple to have your fully functional CRUD application. \ No newline at end of file diff --git a/addon/components/crud-table.js b/addon/components/crud-table.js index 83059f6..b96f36e 100755 --- a/addon/components/crud-table.js +++ b/addon/components/crud-table.js @@ -124,6 +124,10 @@ export default Ember.Component.extend({ isLoading: true, SearchTerm: "", SearchField: "", + value: [], + layout: layout, + class: "", + fields: "id", actions: { goto: function (page) { var that = this; @@ -227,10 +231,6 @@ export default Ember.Component.extend({ //this.get('delete')(); } }, - value: [], - layout: layout, - class: "", - fields: "id", init: function () { var that = this; this._super(); diff --git a/addon/mixins/route.js b/addon/mixins/crud-controller.js similarity index 71% rename from addon/mixins/route.js rename to addon/mixins/crud-controller.js index bf73560..0f6a65b 100644 --- a/addon/mixins/route.js +++ b/addon/mixins/crud-controller.js @@ -1,13 +1,11 @@ import Ember from 'ember'; -//import App from '../app'; -//import EmberValidations from 'ember-validations'; export default function (model /*settings*/) { return Ember.Mixin.create({ isEditing: false, actions: { FetchData:function(query,deferred){ - deferred.resolve(query); + this.store.find(model,query).then(deferred.resolve,deferred.reject); }, getRecord: function (deferred) { deferred.resolve(this.store.createRecord(model)); @@ -21,21 +19,20 @@ export default function (model /*settings*/) { }, update: function (record, deferred) { - record.save().then(deferred.resolve, deferred.reject); - //var self = this; - //var promises = []; + var that = this; + var promises = []; //if(self.model.get('isDirty')){ - //promises.push(record.save()); + promises.push(record.save()); //}else{ // self.set('isEditing',false); //} - /*Ember.A(Ember.keys(record._dependentRelations)).any(function (key) { - var value = Ember.get(self.model, key); + Ember.A(Ember.keys(record._relationships)).any(function (key) { + var value = Ember.get(that.model, key); if (value.get('isDirty')) { promises.push(value.get('content').save()); } - });*/ - //Ember.RSVP.Promise.all(promises).then(deferred.resolve, deferred.reject); + }); + Ember.RSVP.Promise.all(promises).then(deferred.resolve, deferred.reject); }, delete: function (record, deferred) { diff --git a/addon/templates/components/crud-table.hbs b/addon/templates/components/crud-table.hbs index 2600344..690edbd 100755 --- a/addon/templates/components/crud-table.hbs +++ b/addon/templates/components/crud-table.hbs @@ -5,11 +5,11 @@
-
@@ -37,7 +37,7 @@ {{#each field in this.fields}} {{field}} {{/each}} {{#if this.editdelete}} - Actions + Actions {{/if}} @@ -47,10 +47,10 @@ {{#if row}} {{render 'crud-table-row' row}} {{/if}} {{#if this.editdelete}} {{#if this.updateRecord}} - {{/if}} {{#if this.deleteRecord}} - {{/if}} @@ -68,13 +68,13 @@
- + {{#each page in this.pagination.links}} - {{/each}} - +
{{yield}} {{render 'crud-table-modal' this}} diff --git a/package.json b/package.json index 3a75548..040219d 100755 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ember-cli-crudtable", - "version": "0.3.26", + "version": "0.3.27", "description": "This addon allows you to easly create a CRUD Table, it will take you only 5s!.", "directories": { "doc": "doc", @@ -19,7 +19,7 @@ "ember-cli-htmlbars": "0.7.4" }, "author": "Gerardo Pérez Pérez", - "license": "MPL2", + "license": "MPL-2.0", "devDependencies": { "ember-data": "1.0.0-beta.15", "broccoli-asset-rev": "^2.0.0",