vue_crud 0.2.0.2 → 0.2.0.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 3747e8931eb49c0b4f5b5b56a96a98fef50eeb80
-  data.tar.gz: eb8417916e46870d8f4579ed0234abb7bf4bc8ac
+  metadata.gz: fa7649e34ace82b2f070560a061948bbf1f964f0
+  data.tar.gz: 39c905037c25eb6e932dababd1506ac30c0469c8
 SHA512:
-  metadata.gz: af4619fb1c1579eae0f36c4cadb1cfc2d9a8e10cf23a2bfddb37eea0ccd81c64dc1a12b3ec0a0050e86687ef638be1cab24156662838e16b96a8755966e7e847
-  data.tar.gz: 7211245f480c1d67a8cae72d0da2086510803afbefe3e76d22e377791518ee3c5544169df871605fe07237d2bc21b23d01a9cdf9420bbf990dad03e365cdb2f1
+  metadata.gz: 63dffe3f65609f8bcd478c29825d3bb139ed343092e3e1807ca1a7f547376986156eca0196a647405fd7544a2d09d8bfc6cf0ea7144a91549e4991259c760acd
+  data.tar.gz: fc770a277eb7504f26a0e8c4ce86ac7a99fa6b8ddd019ab11836905802513b31db1b86cf6d1f01d0325c157996c10a5d95d3c96dc34880a4de00499059f528fc

data/lib/vue_crud/version.rb

@@ -1,3 +1,3 @@
 module VueCrud
-  VERSION = "0.2.0.2"
+  VERSION = "0.2.0.3"
 end

data/vendor/assets/javascripts/vue_crud.js

@@ -13,7 +13,7 @@ Pace.on('done', function() {
 });
 var event_hub = new Vue();
 var modal_mixin = {};
-var models_mixin = {};
+var model_mixin = {};
 var root_mixin = {};
 function sleep(time) {
     return new Promise((resolve) => setTimeout(resolve, time));
@@ -94,7 +94,7 @@ function vueCRUD_init(params = {}) {
         return new Date(value).toLocaleString();
     })
     Vue.filter('boolean', function (value) {
-        return value? '是':'否';
+        return value? '✔ 是':'✘ 否';
     })
     var default_options = {
         column_type: 'card',
@@ -146,7 +146,7 @@ function vueCRUD_init(params = {}) {
             }
         },
         mounted: function() {
-            // Sync errors and model from modelsComponent
+            // Sync errors and model from modelComponent
             event_hub.$on('update_error', function(errors) {
                 this.errors = errors;
             }.bind(this));
@@ -222,9 +222,9 @@ function vueCRUD_init(params = {}) {
         }
     })
 
-    var modelsComponent = Vue.component('models', {
-        mixins: [models_mixin],
-        template: '#models-' + options.column_type,
+    var modelComponent = Vue.component('model', {
+        mixins: [model_mixin],
+        template: '#model-' + options.column_type,
         props: {
             original_model: Object,
             selected_attribute: String,
@@ -391,36 +391,14 @@ function vueCRUD_init(params = {}) {
         },
         mounted: function() {
             var that = this;
-            $.ajax({
-                url: options.info_url,
-                success: function(res) {
-                    that.info = res;
-                    that.model = {};
-                    var default_url = that.info.actions.index.url + that.info.actions.index.suffix + location.search;
-                    default_url = removeParam("p", default_url);
-                    default_url = removeParam("q", default_url);
-                    default_url = removeParam("mp", default_url);
-                    default_url = removeParam("sa", default_url);
-                    default_url = removeParam("st", default_url);
-                    that.default_url = default_url;
-                    $.ajax({
-                        url: urlParser(that.info.actions.index.url, that.model, that.info.actions.index.suffix),
-                        success: function(res) {
-                            that.models = res;
-                        }
-                    });
-                }
-            });
-            event_hub.$on('update_progress', function(progress) {
-                this.progress = progress;
-            }.bind(this));
+            that.load_instance(options.info_url);
+
             event_hub.$on('restoreCreate', function(model) {
                 this.model = model;
                 this.restoreModel();
             }.bind(this));
-            $('#form-progress').change(function(){
-                event_hub.$emit('update_progress', $(this).val());
-            });
+
+            // delegate filter dropdown click event
             $(document).delegate('.attribute_option', 'click', function(event) {
                 var selected_attribute = $('.attribute_select').find('.item.selected').attr('target') || "Attribute";
                 var selected_text = $('.attribute_select').find('.item.selected').attr('target_text') || "欄位";
@@ -429,6 +407,81 @@ function vueCRUD_init(params = {}) {
                 updateQueryStringParam('sa', that.selected_attribute);
                 updateQueryStringParam('st', that.selected_text);
             });
+
+            // binding PACE progress with Vue
+            event_hub.$on('update_progress', function(progress) {
+                this.progress = progress;
+            }.bind(this));
+
+            $('#form-progress').change(function(){
+                event_hub.$emit('update_progress', $(this).val());
+            });
+        },
+        methods: {
+            load_instance: function(info_url) {
+                var that = this;
+                $.ajax({
+                    url: info_url,
+                    success: function(res) {
+                        that.info = res;
+                        that.model = {};
+                        var default_url = that.info.actions.index.url + that.info.actions.index.suffix + location.search;
+                        default_url = removeParam("p", default_url);
+                        default_url = removeParam("q", default_url);
+                        default_url = removeParam("mp", default_url);
+                        default_url = removeParam("sa", default_url);
+                        default_url = removeParam("st", default_url);
+                        that.default_url = default_url;
+                        $.ajax({
+                            url: urlParser(that.info.actions.index.url, that.model, that.info.actions.index.suffix),
+                            success: function(res) {
+                                that.models = res;
+                            }
+                        });
+                    }
+                });
+            },
+            addModel: function(action_name) {
+                event_hub.$emit('openModal');
+                event_hub.$emit('update_model_attributes', this.info.model_attributes);
+                event_hub.$emit('update_model', this.model);
+                event_hub.$emit('update_action_name', action_name + this.info.titles.display_name);
+                event_hub.$on('modalSubmit', function() {
+                    this.createModel();
+                }.bind(this));
+            },
+            setPage: function(idx){
+                if( idx <= 0 || idx > this.totalPage ){
+                    return;
+                }
+                this.currentPage = idx;
+
+                updateQueryStringParam('p', this.currentPage);
+            },
+            createModel: function () {
+                var that = this;
+                $.ajax({
+                    method: that.info.actions.create.method,
+                    data: obj_to_json(that.model),
+                    url: urlParser(that.info.actions.create.url, that.model, that.info.actions.create.suffix),
+                    beforeSend: function() {
+                        console.log(obj_to_json(that.model));
+                        event_hub.$emit('dimmerOn');
+                        $('.progress-bar').css('width', '0');
+                    },
+                    success: function(res) {
+                        event_hub.$emit('closeModal');
+                        event_hub.$emit('dimmerOff');
+                        that.errors = {};
+                        that.model = {};
+                        that.models.push(res);
+                    },
+                    error: function(res) {
+                        event_hub.$emit('update_error', res.responseJSON.errors);
+                        event_hub.$emit('dimmerOff');
+                    }
+                });
+            }
         },
         computed: {
             searchStatus: function() {
@@ -474,49 +527,6 @@ function vueCRUD_init(params = {}) {
                 updateQueryStringParam('q', this.searchQuery);
                 updateQueryStringParam('p', 1);
             }
-        },
-        methods: {
-            addModel: function(action_name) {
-                event_hub.$emit('openModal');
-                event_hub.$emit('update_model_attributes', this.info.model_attributes);
-                event_hub.$emit('update_model', this.model);
-                event_hub.$emit('update_action_name', action_name + this.info.titles.display_name);
-                event_hub.$on('modalSubmit', function() {
-                    this.createModel();
-                }.bind(this));
-            },
-            setPage: function(idx){
-                if( idx <= 0 || idx > this.totalPage ){
-                    return;
-                }
-                this.currentPage = idx;
-
-                updateQueryStringParam('p', this.currentPage);
-            },
-            createModel: function () {
-                var that = this;
-                $.ajax({
-                    method: that.info.actions.create.method,
-                    data: obj_to_json(that.model),
-                    url: urlParser(that.info.actions.create.url, that.model, that.info.actions.create.suffix),
-                    beforeSend: function() {
-                        console.log(obj_to_json(that.model));
-                        event_hub.$emit('dimmerOn');
-                        $('.progress-bar').css('width', '0');
-                    },
-                    success: function(res) {
-                        event_hub.$emit('closeModal');
-                        event_hub.$emit('dimmerOff');
-                        that.errors = {};
-                        that.model = {};
-                        that.models.push(res);
-                    },
-                    error: function(res) {
-                        event_hub.$emit('update_error', res.responseJSON.errors);
-                        event_hub.$emit('dimmerOff');
-                    }
-                });
-            }
         }
     })
 }

data/vendor/assets/stylesheets/vue_crud.css

@@ -7,6 +7,9 @@
     width: 100% !important;
     height: auto !important;
 }
+#vue_crud .ui.header {
+    margin-top: 0;
+}
 #vue_crud .is_deleted {
     opacity: 0.7;
 }
@@ -35,24 +38,36 @@
 #vue_crud .ui.table td img {
     max-width: 100%;
 }
-.ui.toggle.checkbox {
+#vue_crud pre {
+    background: #fffcd3;
+    text-align: center;
+    padding: 10px 0;
+    margin: 10px 0 0 0;
+    border: 1px solid #fff1d7;
+    border-radius: 3px;
+}
+#vue_crud span.display_name {
+    font-weight: bold;
+    color: black;
+}
+#vue_crud .ui.toggle.checkbox {
     margin: 10px 0;
 }
-.summary.highlight {
-    border: 2px solid #a90000;
+#vue_crud .item.highlight span.display_name {
+    color: #a90000 !important;
 }
-th.highlight {
+#vue_crud th.highlight {
     border: 2px solid #a90000 !important;
 }
-td.highlight {
+#vue_crud td.highlight {
     border-left: 2px solid #a90000 !important;
     border-right: 2px solid #a90000;
 }
-tbody tr:last-child td.highlight {
+#vue_crud tbody tr:last-child td.highlight {
     border-left: 2px solid #a90000 !important;
     border-right: 2px solid #a90000;
     border-bottom: 2px solid #a90000;
 }
-.inline-block {
+#vue_crud .inline-block {
     display: inline-block;
 }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: vue_crud
 version: !ruby/object:Gem::Version
-  version: 0.2.0.2
+  version: 0.2.0.3
 platform: ruby
 authors:
 - Donald Chiang
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2017-01-16 00:00:00.000000000 Z
+date: 2017-01-23 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bundler