Skip to content

Commit fc123fe

Browse files
authored
Merge pull request #89 from lionel-bijaoui/lb_next
Toward vuejs v2.0
2 parents d90d343 + 1d090df commit fc123fe

35 files changed

+636
-400
lines changed

.babelrc

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"presets": ["es2015", "stage-0"],
2+
"presets": ["es2015", "stage-2"],
33
"plugins": ["transform-runtime"],
44
"comments": false
55
}

CHANGELOG.md

+41
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,44 @@
1+
<a name="0.6.1"></a>
2+
## 0.6.1 (2016-11-28)
3+
4+
* :package: Build v0.6.1 ([79580a2](https://github.com/icebob/vue-form-generator/commit/79580a2))
5+
* Add missing opening brace ([6842f1b](https://github.com/icebob/vue-form-generator/commit/6842f1b))
6+
* bump version ([1976b4a](https://github.com/icebob/vue-form-generator/commit/1976b4a))
7+
* Fixed bower file syntax error #98 ([06b0022](https://github.com/icebob/vue-form-generator/commit/06b0022)), closes [#98](https://github.com/icebob/vue-form-generator/issues/98)
8+
9+
10+
11+
<a name="0.6.0"></a>
12+
# 0.6.0 (2016-11-14)
13+
14+
* :bug: Fix options prop default #91 ([3d2e821](https://github.com/icebob/vue-form-generator/commit/3d2e821)), closes [#91](https://github.com/icebob/vue-form-generator/issues/91)
15+
* :package: build ([51abcca](https://github.com/icebob/vue-form-generator/commit/51abcca))
16+
* :package: Build ([ce72dc4](https://github.com/icebob/vue-form-generator/commit/ce72dc4))
17+
* :package: bump version & build ([d56f93c](https://github.com/icebob/vue-form-generator/commit/d56f93c))
18+
* add bower ([ce44822](https://github.com/icebob/vue-form-generator/commit/ce44822))
19+
* add number prop to input field ([a40e23c](https://github.com/icebob/vue-form-generator/commit/a40e23c))
20+
* add step attribute to number field #92 ([ce64c4e](https://github.com/icebob/vue-form-generator/commit/ce64c4e))
21+
* Fix #82 ([7a83777](https://github.com/icebob/vue-form-generator/commit/7a83777)), closes [#82](https://github.com/icebob/vue-form-generator/issues/82)
22+
* Fix #84 ([2c36001](https://github.com/icebob/vue-form-generator/commit/2c36001)), closes [#84](https://github.com/icebob/vue-form-generator/issues/84)
23+
* Fix #84 ([58093c7](https://github.com/icebob/vue-form-generator/commit/58093c7)), closes [#84](https://github.com/icebob/vue-form-generator/issues/84)
24+
* fix lints ([1f8f3d9](https://github.com/icebob/vue-form-generator/commit/1f8f3d9))
25+
* Implement #78 ([f92b193](https://github.com/icebob/vue-form-generator/commit/f92b193))
26+
* quick fix for #85 ([cad76da](https://github.com/icebob/vue-form-generator/commit/cad76da)), closes [#85](https://github.com/icebob/vue-form-generator/issues/85)
27+
* remote customLabel prop from multiselect because give errors ([5dfc5bb](https://github.com/icebob/vue-form-generator/commit/5dfc5bb))
28+
* remove commit message package ([682c6ab](https://github.com/icebob/vue-form-generator/commit/682c6ab))
29+
* Update README.md ([8128a52](https://github.com/icebob/vue-form-generator/commit/8128a52))
30+
* docs: fix npms.io badge url ([475eb91](https://github.com/icebob/vue-form-generator/commit/475eb91))
31+
* test: add attr checker to switch field ([2ed434e](https://github.com/icebob/vue-form-generator/commit/2ed434e))
32+
* test: add file input attr test ([352fb20](https://github.com/icebob/vue-form-generator/commit/352fb20))
33+
* test: add test to #82 ([aefdbac](https://github.com/icebob/vue-form-generator/commit/aefdbac))
34+
* test: attr test to submit field ([1627c71](https://github.com/icebob/vue-form-generator/commit/1627c71))
35+
* test: lock multiselect version ([5b0a4d0](https://github.com/icebob/vue-form-generator/commit/5b0a4d0))
36+
* fix: customLabel return a basic function when undefined instead of null ([9b3d51d](https://github.com/icebob/vue-form-generator/commit/9b3d51d))
37+
* bug: fix quotes ([13d6e0f](https://github.com/icebob/vue-form-generator/commit/13d6e0f))
38+
* new: add form POST example ([08412c7](https://github.com/icebob/vue-form-generator/commit/08412c7))
39+
40+
41+
142
<a name="0.5.0"></a>
243
# 0.5.0 (2016-09-28)
344

README.md

+4-3
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,14 @@ A schema-based form generator component for Vue.js v1.x.x
44
[![Codacy Badge](https://api.codacy.com/project/badge/Grade/912039aa815e40de8315032519aa7e6c)](https://www.codacy.com/app/mereg-norbert/vue-form-generator?utm_source=github.com&amp;utm_medium=referral&amp;utm_content=icebob/vue-form-generator&amp;utm_campaign=Badge_Grade)
55
[![Build Status](https://travis-ci.org/icebob/vue-form-generator.svg?branch=master)](https://travis-ci.org/icebob/vue-form-generator)
66
[![Coverage Status](https://coveralls.io/repos/github/icebob/vue-form-generator/badge.svg?branch=master)](https://coveralls.io/github/icebob/vue-form-generator?branch=master)
7-
[![NPMS.io score](https://badges.npms.io/cross-spawn.svg)]()
7+
[![NPMS.io score](https://badges.npms.io/vue-form-generator.svg)]()
8+
[![Package Quality](http://npm.packagequality.com/shield/vue-form-generator.svg)](http://packagequality.com/#?package=vue-form-generator)
89

910
[![Dependency Status](https://david-dm.org/icebob/vue-form-generator.svg)](https://david-dm.org/icebob/vue-form-generator)
1011
[![devDependency Status](https://david-dm.org/icebob/vue-form-generator/dev-status.svg)](https://david-dm.org/icebob/vue-form-generator#info=devDependencies)
1112
[![Downloads](https://img.shields.io/npm/dt/vue-form-generator.svg)](https://www.npmjs.com/package/vue-form-generator)
1213

13-
**Vue v2.x is not supported!**
14+
**Vue v2.x support is under development!**
1415

1516
## Demo
1617
[JSFiddle simple example](https://jsfiddle.net/icebob/0mg1v81e/)
@@ -65,7 +66,7 @@ Vue.use(VueFormGenerator);
6566
export default {
6667
data: {
6768
68-
model:
69+
model: {
6970
id: 1,
7071
name: "John Doe",
7172
password: "J0hnD03!x4",

bower.json

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
{
2+
"name": "vue-form-generator",
3+
"version": "0.6.1",
4+
"homepage": "https://github.com/icebob/vue-form-generator",
5+
"authors": [
6+
"Icebob"
7+
],
8+
"description": "A schema-based form generator component for Vue.js",
9+
"main": [
10+
"dist/vue-form-generator.js",
11+
"dist/vue-form-generator.css"
12+
],
13+
"moduleType": [
14+
"amd"
15+
],
16+
"keywords": [
17+
"vue",
18+
"vuejs",
19+
"form",
20+
"generator",
21+
"schema",
22+
"json"
23+
],
24+
"license": "MIT",
25+
"ignore": [
26+
"**/.*",
27+
"node_modules",
28+
"bower_components",
29+
"test",
30+
"tests"
31+
]
32+
}

dev/app.vue

+54-44
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,27 @@
1-
<template lang="jade">
2-
.row
3-
.col-md-10.col-md-offset-1
4-
data-table(:rows="rows", :selected="selected", :select="selectRow")
5-
6-
.row(v-show="model")
7-
.col-md-5.col-md-offset-1
8-
.control-buttons.text-center
9-
button.btn.btn-default.new(@click="newModel")
10-
i.fa.fa-plus
11-
| New
12-
button.btn.btn-primary.save(@click="saveModel")
13-
i.fa.fa-floppy-o
14-
| Save
15-
i.fa.fa-warning(v-if="showWarning()")
16-
button.btn.btn-danger.delete(@click="deleteModel")
17-
i.fa.fa-trash
18-
| Delete
19-
20-
.errors.text-center
21-
div.alert.alert-danger(v-for="item in validationErrors", track-by="$index") {{ item.field.label}}:
22-
strong {{ item.error }}
23-
24-
vue-form-generator(:schema='schema', :model='model', :options='formOptions', :multiple="selected.length > 1", v-ref:form, :is-new-model="isNewModel")
25-
26-
27-
.col-md-6
28-
pre(v-if='model') {{{ model | prettyJSON }}}
1+
<template>
2+
<div>
3+
<div class="row">
4+
<div class="col-md-10 col-md-offset-1">
5+
<data-table :rows="rows" :selected="selected" :select="selectRow"></data-table>
6+
</div>
7+
</div>
8+
<div v-show="model" class="row">
9+
<div class="col-md-5 col-md-offset-1">
10+
<div class="control-buttons text-center">
11+
<button @click="newModel" class="btn btn-default new"> <i class="fa fa-plus"></i>New</button>
12+
<button @click="saveModel" class="btn btn-primary save"> <i class="fa fa-floppy-o"></i>Save<i v-if="showWarning()" class="fa fa-warning"></i></button>
13+
<button @click="deleteModel" class="btn btn-danger delete"> <i class="fa fa-trash"></i>Delete</button>
14+
</div>
15+
<div class="errors text-center">
16+
<div v-for="item in validationErrors" track-by="$index" class="alert alert-danger">{{ item.field.label}}: <strong>{{ item.error }}</strong></div>
17+
</div>
18+
<vue-form-generator :schema="schema" :model="model" :options="formOptions" :multiple="selected.length > 1" ref="form" :is-new-model="isNewModel" @model-updated="modelUpdated"></vue-form-generator>
19+
</div>
20+
<div class="col-md-6">
21+
<pre v-if="model" v-html="prettyModel"></pre>
22+
</div>
23+
</div>
24+
</div>
2925

3026
</template>
3127

@@ -82,6 +78,9 @@
8278
return this.$refs.form.errors;
8379
8480
return [];
81+
},
82+
prettyModel(){
83+
return filters.prettyJSON(this.model);
8584
}
8685
},
8786
@@ -95,10 +94,12 @@
9594
selectRow(event, row, add) {
9695
this.isNewModel = false;
9796
if ( (add || (event && event.ctrlKey))) {
98-
if (this.selected.indexOf(row) != -1)
99-
this.selected.$remove(row);
100-
else
97+
if (this.selected.indexOf(row) != -1){
98+
var index = this.selected.indexOf(row);
99+
this.selected.splice(index, 1);
100+
} else {
101101
this.selected.push(row);
102+
}
102103
} else {
103104
this.clearSelection();
104105
this.selected.push(row);
@@ -114,12 +115,11 @@
114115
generateModel() {
115116
if (this.selected.length == 1) {
116117
this.model = cloneDeep(this.selected[0]);
117-
}
118-
else if (this.selected.length > 1) {
118+
} else if (this.selected.length > 1) {
119119
this.model = VueFormGenerator.schema.mergeMultiObjectFields(Schema, this.selected);
120-
}
121-
else
120+
} else {
122121
this.model = null;
122+
}
123123
},
124124
125125
newModel() {
@@ -146,6 +146,7 @@
146146
}
147147
148148
} else {
149+
console.warn("Error saving model...");
149150
// Validation error
150151
}
151152
},
@@ -162,7 +163,8 @@
162163
deleteModel() {
163164
if (this.selected.length > 0) {
164165
each(this.selected, (row) => {
165-
this.rows.$remove(row);
166+
let index = this.rows.indexOf(row);
167+
this.rows.splice(index, 1)
166168
})
167169
this.clearSelection();
168170
}
@@ -180,22 +182,30 @@
180182
},
181183
182184
validate() {
185+
console.log("validate", this.$refs.form, this.$refs.form.validate());
183186
return this.$refs.form.validate();
187+
},
188+
189+
modelUpdated(newVal, schema) {
190+
console.log("main model has updated", newVal, schema);
191+
// this.model[schema] = newVal;
184192
}
185193
186194
187195
},
188196
189-
ready() {
190-
window.app = this;
197+
mounted() {
198+
this.$nextTick(function () {
199+
window.app = this;
191200
192-
if (users.length > 0) {
193-
this.selectRow(null, fakerator.random.arrayElement(users));
194-
}
201+
if (users.length > 0) {
202+
this.selectRow(null, fakerator.random.arrayElement(users));
203+
}
195204
196-
// Localize validate errors
197-
VueFormGenerator.validators.resources.fieldIsRequired = "Ezt a mezőt kötelező kitölteni!";
198-
VueFormGenerator.validators.resources.textTooSmall = "A szöveg túl rövid! Jelenleg: {0}, minimum: {1}";
205+
// Localize validate errors
206+
// VueFormGenerator.validators.resources.fieldIsRequired = "Ezt a mezőt kötelező kitölteni!";
207+
// VueFormGenerator.validators.resources.textTooSmall = "A szöveg túl rövid! Jelenleg: {0}, minimum: {1}";
208+
})
199209
}
200210
}
201211

dev/index.html

+14-14
Original file line numberDiff line numberDiff line change
@@ -3,39 +3,39 @@
33
<head>
44
<meta charset="utf-8">
55
<title>vue-form-generator development</title>
6-
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.1/css/font-awesome.css">
7-
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.css">
8-
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/css/bootstrap-select.min.css">
9-
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.css">
6+
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.css">
7+
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css">
8+
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.11.2/css/bootstrap-select.min.css">
9+
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.43/css/bootstrap-datetimepicker.css">
1010
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/spectrum/1.8.0/spectrum.css">
1111
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.1.4/css/ion.rangeSlider.css">
1212
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.1.4/css/ion.rangeSlider.skinHTML5.css">
13-
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/8.5.1/nouislider.min.css">
13+
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/9.0.0/nouislider.min.css">
1414
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.4.0/css/pikaday.min.css">
1515

1616

17-
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.js"></script>
18-
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script>
19-
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.3.0/lodash.min.js"></script>
17+
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.js"></script>
18+
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js"></script>
19+
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.16.4/lodash.min.js"></script>
2020
<!-- jQuery dependent -->
21-
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.js"></script>
22-
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/js/bootstrap-select.min.js"></script>
23-
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>
21+
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
22+
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.11.2/js/bootstrap-select.min.js"></script>
23+
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.43/js/bootstrap-datetimepicker.min.js"></script>
2424
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/spectrum/1.8.0/spectrum.js"></script>
2525
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.maskedinput/1.4.1/jquery.maskedinput.js"></script>
2626
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.1.4/js/ion.rangeSlider.js"></script>
2727
<!-- Vanilla libs -->
28-
<script type="text/javascript" src="https://rawgit.com/monterail/vue-multiselect/master/lib/vue-multiselect.min.js"></script>
28+
<script type="text/javascript" src="https://rawgit.com/monterail/vue-multiselect/2.0/lib/vue-multiselect.min.js"></script>
2929
<script type="text/javascript" src="https://rawgit.com/nosir/cleave.js/master/dist/cleave.min.js"></script>
3030
<script type="text/javascript" src="https://nosir.github.io/cleave.js/lib/cleave-phone.i18n.js"></script>
31-
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/8.5.1/nouislider.js"></script>
31+
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/9.0.0/nouislider.js"></script>
3232
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.4.0/pikaday.min.js"></script>
3333
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCEz-sX9bRJorDS-D_JL0JkZVZe2gzoUMw&amp;libraries=places"></script>
3434

3535
</head>
3636
<body>
3737
<div class="container-fluid"></div>
38-
<app></app>
38+
<div id="app"></div>
3939
<script src="/app.js"></script>
4040
</body>
4141
</html>

dev/main.js

+11-9
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
11
/* global Vue */
2-
$(function() {
3-
let App = require("./App.vue");
42

5-
let app = new Vue({
6-
el: "body",
7-
components: {
8-
App
9-
}
10-
});
11-
});
3+
// var App = require('./app.vue');
4+
// $(function() {
5+
// App.$mount('#app');
6+
// });
7+
8+
import Vue from 'vue';
9+
import App from './app.vue';
10+
11+
new Vue({
12+
...App
13+
}).$mount('#app');

0 commit comments

Comments
 (0)