Fixes Element Form Validation

package.json

@@ -9,27 +9,28 @@
   },
   "dependencies": {
     "axios": "^0.17.1",
-    "bootstrap": "^3.3.7",
     "element-ui": "^2.0.11",
     "material-design-icons": "^3.0.1",
-    "vue": "^2.0.1",
+    "vue": "^2.5.13",
     "vuex": "^3.0.1"
   },
   "devDependencies": {
     "autoprefixer": "^7.2.5",
-    "babel-core": "^6.0.0",
+    "babel-core": "^6.26.0",
-    "babel-loader": "^6.0.0",
+    "babel-loader": "^7.1.2",
+    "babel-preset-env": "^1.6.1",
     "babel-preset-es2015": "^6.0.0",
     "babel-preset-stage-2": "^6.24.1",
     "cross-env": "^3.0.0",
     "css-loader": "^0.25.0",
-    "postcss-loader": "^2.0.10",
-    "style-loader": "^0.19.1",
     "element-theme-chalk": "^2.0.11",
     "file-loader": "^0.9.0",
+    "postcss-loader": "^2.0.10",
+    "style-loader": "^0.19.1",
     "vue-custom-element": "^1.0.13",
-    "vue-loader": "^9.7.0",
+    "vue-loader": "^13.7.0",
-    "webpack": "2.1.0-beta.25",
+    "vue-template-compiler": "^2.5.13",
-    "webpack-dev-server": "2.1.0-beta.0"
+    "webpack": "^3.10.0",
+    "webpack-dev-server": "^2.11.1"
   }
 }

src/admin/pages/item-creation-page.vue

@@ -1,8 +1,8 @@
 <template>
     <div>
         <h2>Item creation</h2>
-        <el-form ref="form" :model="form" label-width="120px">
+        <el-form ref="form" :model="form" :rules="rules" label-width="120px">
-            <el-form-item label="Título">
+            <el-form-item label="Título" prop="title">
                 <el-input v-model="form.title"></el-input>
             </el-form-item>
             <el-form-item label="Descrição">
@@ -78,7 +78,13 @@ export default {
                 }, {
                 value: 'trash',
                 label: 'Lixo'
-            }]
+            }],
+            rules: {
+                title: [
+                    { required: true, message: 'Please input Activity name', trigger: 'blur' },
+                    { min: 3, max: 5, message: 'Length should be 3 to 5', trigger: 'blur' }
+                ],
+            }
         }
     },
     methods: {

webpack.config.js

@@ -15,19 +15,19 @@ module.exports = {
         rules: [
             {
                 test: /\.vue$/,
-                loader: 'vue',
+                loader: 'vue-loader',
                 options: {
                     // vue-loader options go here
                 }
             },
             {
                 test: /\.js$/,
-                loader: 'babel',
+                loader: 'babel-loader',
                 exclude: /node_modules/
             },
             {
                 test: /\.(png|jpg|jpeg|gif|eot|ttf|woff|woff2|svg|svgz)(\?.+)?$/,
-                loader: 'file'
+                loader: 'file-loader'
             },
             {
                 test: /\.css$/,
@@ -44,7 +44,7 @@ module.exports = {
         historyApiFallback: true,
         noInfo: true
     },
-    devtool: '#eval-source-map'
+    devtool: '#source-map'
 }
 
 if (process.env.NODE_ENV === 'production') {