Skip to content
This repository was archived by the owner on Jun 10, 2021. It is now read-only.

Commit 7ad8116

Browse files
coderdiazcoderdiaz
committed
Merge branch '2.0.0'
2 parents 68bc5e9 + ebd257c commit 7ad8116

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

60 files changed

+1690
-12774
lines changed

‎.babelrc

+13-4
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,14 @@
11
{
2-
"presets": ["es2015", "stage-2"],
3-
"plugins": ["transform-runtime"],
4-
"comments": false
5-
}
2+
"presets": [
3+
["env", { "modules": false }],
4+
"stage-2"
5+
],
6+
"plugins": ["transform-runtime", "transform-vue-jsx"],
7+
"comments": false,
8+
"env": {
9+
"test": {
10+
"presets": ["env", "stage-2"],
11+
"plugins": [ "istanbul" ]
12+
}
13+
}
14+
}

‎.editorconfig

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
root = true
2+
3+
[*]
4+
charset = utf-8
5+
indent_style = space
6+
indent_size = 2
7+
end_of_line = lf
8+
insert_final_newline = true
9+
trim_trailing_whitespace = true

‎.eslintignore

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
build/*.js
2+
config/*.js

‎.eslintrc.js

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
// http://eslint.org/docs/user-guide/configuring
2+
3+
module.exports = {
4+
root: true,
5+
parser: 'babel-eslint',
6+
parserOptions: {
7+
sourceType: 'module'
8+
},
9+
env: {
10+
browser: true,
11+
},
12+
// https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
13+
extends: 'standard',
14+
// required to lint *.vue files
15+
plugins: [
16+
'html'
17+
],
18+
// add your custom rules here
19+
'rules': {
20+
// allow paren-less arrow functions
21+
'arrow-parens': 0,
22+
// allow async-await
23+
'generator-star-spacing': 0,
24+
// allow debugger during development
25+
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
26+
}
27+
}

‎.gitignore

+6-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
11
.DS_Store
22
node_modules/
3-
npm-debug.log
4-
.idea
3+
npm-debug.log*
4+
yarn-debug.log*
5+
yarn-error.log*
6+
test/unit/coverage
7+
test/e2e/reports
8+
selenium-debug.log

‎.postcssrc.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
// https://github.com/michael-ciniawsky/postcss-load-config
2+
3+
module.exports = {
4+
"plugins": {
5+
// to edit target browsers: use "browserlist" field in package.json
6+
"autoprefixer": {}
7+
}
8+
}

‎CHANGELOG.md

+57
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
2+
# 2.0.0
3+
### New Features
4+
- Now the limits are dynamics and a propertie.
5+
- The translations are dynamic and it is no longer necessary to add translations.
6+
- The entire project has been migrated to JSX.
7+
- Added ESLint standard.
8+
- Added support to define conditions in actions with the current selected row.
9+
- Added spinner.
10+
- Changed props and data.
11+
12+
### Bugfixes
13+
- And more minor fixes. LOL =).
14+
15+
# 1.0.9
16+
### New
17+
- Added support for HTML tags.
18+
19+
# 1.0.8
20+
### New
21+
- Added Catalan language.
22+
23+
# 1.0.6
24+
### New
25+
- Added chinese (simplified) translation.
26+
27+
# 1.0.5
28+
### New
29+
- PR #7 Added support to french language.
30+
- New release.
31+
32+
# 1.0.4
33+
### New
34+
- PR #5 Added change page with keyboard.
35+
36+
# 1.0.3
37+
- Minor fixes.
38+
39+
# 1.0.2
40+
### Bugfixes
41+
- PR #2: Selected row isn't reset.
42+
43+
# 1.0.1
44+
### New
45+
- Added more docs.
46+
47+
# 1.0.0
48+
### New
49+
- Added full docs.
50+
- First version release.
51+
52+
### Features
53+
- Render functions.
54+
- Actions.
55+
- Dynamic columns.
56+
- Pagination.
57+
- Limits.

‎README.md

+77-48
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
</p>
77

88
<p align="center">
9-
A Vue.js server side component to create dynamic tables. Compatible with Vue 2.x and Laravel.
9+
A Vue.js component to create dynamic tables. Compatible with Vue 2.x and Laravel.
1010
</p>
1111

1212
<p align="center">
@@ -19,10 +19,6 @@
1919
---
2020

2121
### Demo
22-
23-
[![forthebadge](http://forthebadge.com/images/badges/built-with-love.svg)](http://forthebadge.com)
24-
[![forthebadge](http://forthebadge.com/images/badges/built-by-developers.svg)](http://forthebadge.com)
25-
2622
!['Screenshot'](https://raw.githubusercontent.com/coderdiaz/vue-datasource/master/screenshot.png)
2723

2824
Live: https://young-falls-97690.herokuapp.com/
@@ -35,65 +31,60 @@ $ npm install vue-datasource
3531

3632
```html
3733
<div id="#app">
38-
<datasource
39-
language="en"
40-
:table-data="information.data"
34+
<server-datasource
35+
source="api_url"
4136
:columns="columns"
42-
:pagination="information.pagination"
43-
:actions="actions"
44-
v-on:change="changePage"
45-
v-on:searching="onSearch"></datasource>
37+
:actions="actions"></server-datasource>
4638
</div>
4739
```
4840

4941
```javascript
50-
import Datasource from 'vue-datasource'
42+
import { ServerDatasource } from 'vue-datasource'
5143

5244
new Vue({
5345
el: '#app',
5446
components: {
55-
Datasource
47+
ServerDatasource
5648
},
5749
data() {
5850
return {
59-
information: {
60-
pagination: {...},
61-
data: [...]
62-
},
6351
columns: [...],
6452
actions: [...]
6553
}
66-
},
67-
methods: {
68-
changePage(values) {...},
69-
onSearch(searchQuery) {...}
7054
}
7155
});
7256
```
7357

58+
Client Side component is comming soon..
59+
7460
### Available Props
75-
| Prop | Type | Default | Description |
76-
|-------------|---------|---------|-------------------------------------------------------------|
77-
| table-data | Array | | Table information |
78-
| language | String | es | Defines the table labels language |
79-
| columns | Array | | Columns to display |
80-
| pagination | Object | | Pagination information about the table data ([structure] (#pagination-structure)) |
81-
| actions | Array | | Action buttons ([structure] (#action-event-sctructure)) |
61+
| Prop | Type | Default | Description |
62+
|-------------|---------|----------------|-------------------------------------------------------------|
63+
| source | String | | API Url to get data |
64+
| translation | Object | [Object] | Defines the table labels language ([structure](#translation-structure)) |
65+
| limits | Array | [1,5,10,15,20] | Defines the limits to display |
66+
| columns | Array | | Columns to display |
67+
| actions | Array | | Action buttons ([structure](#action-event-sctructure)) |
8268

8369
### Available Events
8470
| Event | Description |
8571
|-------------|-----------------------------------------------------------------------------------------------------|
8672
| change | Handle show limit changed. Gets object with new show limit and current page `{perpage: 10, page: 2}`|
8773
| searching | Handles search input. Gets string as parameter |
8874

89-
### Available Languages
90-
| Language | Abbr |
91-
|-------------|-------|
92-
| Spanish | es |
93-
| English | en |
94-
| French | fr |
95-
| Chinese (Simplified) | zh-CN |
96-
| Catalan | ca |
75+
### Data API Example
76+
```javascript
77+
{
78+
"pagination": {
79+
"total": 0,
80+
"to": 0,
81+
"from": 0,
82+
"per_page": 10,
83+
"current_page": 1
84+
},
85+
"data": [...items]
86+
}
87+
```
9788

9889
### Columns
9990
Each column object needs a `name` and `key` attributes.
@@ -156,17 +147,18 @@ This callback will modify the data for various operations. Such as applying a sp
156147
}
157148
```
158149

159-
### Pagination Structure
150+
### Translation Structure
160151
```javascript
161152
{
162-
...,
153+
limit: 'Limit',
154+
search: 'Search',
155+
placeholder_search: 'Type to search..',
156+
records_not_found: 'No records found',
163157
pagination: {
164-
total: 25, // Number of total rows (default 0)
165-
per_page: 15, // Number of rows to show (default 15)
166-
current_page: 1, // Actual page
167-
last_page: 2, // Last page
168-
from: 1, // Beginning of visible rows
169-
to: 15 // End of visible rows
158+
show: 'Showing',
159+
to: 'to',
160+
of: 'of',
161+
entries: 'entries'
170162
}
171163
}
172164
```
@@ -180,6 +172,9 @@ This callback will modify the data for various operations. Such as applying a sp
180172
text: 'Click me', // Button label
181173
icon: 'glyphicon glyphicon-check', // Button icon
182174
class: 'btn-primary', // Button class (background color)
175+
show(selectedRow) { // Event to define a condition to display the button with the selected row
176+
return true
177+
},
183178
event(e, row) { // Event handler callback. Gets event instace and selected row
184179
console.log('Click row: ', row); // If no row is selected, row will be NULL
185180
}
@@ -188,14 +183,48 @@ This callback will modify the data for various operations. Such as applying a sp
188183
}
189184
```
190185

186+
## Buy me a coffee
187+
<a href="https://paypal.me/coderdiaz">
188+
<img src="src/assets/donate.jpg" width="220">
189+
</a>
190+
191+
### Development
192+
193+
``` bash
194+
# install dependencies
195+
npm install
196+
197+
# serve with hot reload at localhost:8080
198+
npm run dev
199+
200+
# build for production with minification
201+
npm run build
202+
203+
# build for production and view the bundle analyzer report
204+
npm run build --report
205+
206+
# run unit tests
207+
npm run unit
208+
209+
# run e2e tests
210+
npm run e2e
211+
212+
# run all tests
213+
npm test
214+
```
215+
216+
For detailed explanation on how things work, checkout the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).
217+
191218
### Implementation examples
192219
- Using Laravel 5.3 and pagination: [laravel-datasource-example](https://github.com/coderdiaz/laravel-datasource-example).
193220

194-
195221
### Contributions
196222
All contributions are welcome send your PR and Issues.
197223

224+
### Greatings
225+
[Vue Spinner by Greyby](https://github.com/greyby/vue-spinner)
226+
198227
### License
199-
Vue Datasource is open-sourced software licensed under the [MIT license](https://raw.githubusercontent.com/coderdiaz/vue-datasource/master/LICENSE)
228+
This is a open-source software licensed under the [MIT license](https://raw.githubusercontent.com/coderdiaz/vue-datasource/master/LICENSE)
200229

201-
##### Created by Javier Diaz. Translation enhancement by [itsuwaribito] (https://github.com/itsuwaribito)
230+
##### Created by Javier Diaz. Translation by [itsuwaribito](https://github.com/itsuwaribito)

‎build/build.js

+35
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
require('./check-versions')()
2+
3+
process.env.NODE_ENV = 'production'
4+
5+
var ora = require('ora')
6+
var rm = require('rimraf')
7+
var path = require('path')
8+
var chalk = require('chalk')
9+
var webpack = require('webpack')
10+
var config = require('../config')
11+
var webpackConfig = require('./webpack.prod.conf')
12+
13+
var spinner = ora('building for production...')
14+
spinner.start()
15+
16+
rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
17+
if (err) throw err
18+
webpack(webpackConfig, function (err, stats) {
19+
spinner.stop()
20+
if (err) throw err
21+
process.stdout.write(stats.toString({
22+
colors: true,
23+
modules: false,
24+
children: false,
25+
chunks: false,
26+
chunkModules: false
27+
}) + '\n\n')
28+
29+
console.log(chalk.cyan(' Build complete.\n'))
30+
console.log(chalk.yellow(
31+
' Tip: built files are meant to be served over an HTTP server.\n' +
32+
' Opening index.html over file:// won\'t work.\n'
33+
))
34+
})
35+
})

0 commit comments

Comments
 (0)