vue_component_builder 0.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (48) hide show
  1. checksums.yaml +7 -0
  2. data/.gitignore +8 -0
  3. data/.travis.yml +7 -0
  4. data/CODE_OF_CONDUCT.md +74 -0
  5. data/Gemfile +6 -0
  6. data/LICENSE.txt +21 -0
  7. data/README.md +47 -0
  8. data/Rakefile +10 -0
  9. data/bin/console +14 -0
  10. data/bin/setup +8 -0
  11. data/lib/builder/template/element-plus/boolean.vue.erb +9 -0
  12. data/lib/builder/template/element-plus/datetime.vue.erb +9 -0
  13. data/lib/builder/template/element-plus/decimal.vue.erb +14 -0
  14. data/lib/builder/template/element-plus/form/boolean.vue.erb +8 -0
  15. data/lib/builder/template/element-plus/form/datetime.vue.erb +9 -0
  16. data/lib/builder/template/element-plus/form/decimal.vue.erb +7 -0
  17. data/lib/builder/template/element-plus/form/integer.vue.erb +7 -0
  18. data/lib/builder/template/element-plus/form/string.vue.erb +7 -0
  19. data/lib/builder/template/element-plus/integer.vue.erb +9 -0
  20. data/lib/builder/template/element-plus/js/boolean.js.erb +1 -0
  21. data/lib/builder/template/element-plus/js/datetime.js.erb +1 -0
  22. data/lib/builder/template/element-plus/js/decimal.js.erb +1 -0
  23. data/lib/builder/template/element-plus/js/hooks/data.js.erb +13 -0
  24. data/lib/builder/template/element-plus/js/hooks/methods.js.erb +5 -0
  25. data/lib/builder/template/element-plus/js/hooks/mounted.js.erb +3 -0
  26. data/lib/builder/template/element-plus/js/integer.js.erb +1 -0
  27. data/lib/builder/template/element-plus/js/methods/create.js.erb +15 -0
  28. data/lib/builder/template/element-plus/js/methods/destroy.js.erb +7 -0
  29. data/lib/builder/template/element-plus/js/methods/index.js.erb +6 -0
  30. data/lib/builder/template/element-plus/js/methods/resetForm.js.erb +5 -0
  31. data/lib/builder/template/element-plus/js/methods/show.js.erb +6 -0
  32. data/lib/builder/template/element-plus/js/methods/update.js.erb +15 -0
  33. data/lib/builder/template/element-plus/js/methods/validate.js.erb +4 -0
  34. data/lib/builder/template/element-plus/js/methods/validate_rules.js.erb +8 -0
  35. data/lib/builder/template/element-plus/js/string.js.erb +1 -0
  36. data/lib/builder/template/element-plus/main.vue.erb +62 -0
  37. data/lib/builder/template/element-plus/script.js.erb +11 -0
  38. data/lib/builder/template/element-plus/string.vue.erb +9 -0
  39. data/lib/builder/template/element-plus/table/boolean.vue.erb +9 -0
  40. data/lib/builder/template/element-plus/table/datetime.vue.erb +10 -0
  41. data/lib/builder/template/element-plus/table/decimal.vue.erb +10 -0
  42. data/lib/builder/template/element-plus/table/integer.vue.erb +10 -0
  43. data/lib/builder/template/element-plus/table/string.vue.erb +10 -0
  44. data/lib/builder/template/element-plus/table/table-component.vue.erb +11 -0
  45. data/lib/vue_component_builder/version.rb +3 -0
  46. data/lib/vue_component_builder.rb +229 -0
  47. data/vue_component_builder.gemspec +40 -0
  48. metadata +134 -0
checksums.yaml ADDED
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA256:
3
+ metadata.gz: c25e5c9c087b2a37d88edc55818f27740819ffa52f4c49943af3bab227539419
4
+ data.tar.gz: 79fa4daf5feea6d09a772fb20639f0da92e1d79f62f91abb110bf947e976f320
5
+ SHA512:
6
+ metadata.gz: 6def592509fd62b21911bbff2ce47eace0e77ed57cf92e187ab71de594e9693287064bd4a2011bc05bca056c26599ecdcbf8d846f81f571e85e7aa616e9c2202
7
+ data.tar.gz: 553a4b308adbad2e310a3fadd4f69384c8da9d6a1dcd91591a254565605be155e198c8e0c0eaf6f38f49feffc035944ab8f3c2cbe9581dc74746672c33184a04
data/.gitignore ADDED
@@ -0,0 +1,8 @@
1
+ /.bundle/
2
+ /.yardoc
3
+ /_yardoc/
4
+ /coverage/
5
+ /doc/
6
+ /pkg/
7
+ /spec/reports/
8
+ /tmp/
data/.travis.yml ADDED
@@ -0,0 +1,7 @@
1
+ ---
2
+ sudo: false
3
+ language: ruby
4
+ cache: bundler
5
+ rvm:
6
+ - 2.6.1
7
+ before_install: gem install bundler -v 1.17.2
@@ -0,0 +1,74 @@
1
+ # Contributor Covenant Code of Conduct
2
+
3
+ ## Our Pledge
4
+
5
+ In the interest of fostering an open and welcoming environment, we as
6
+ contributors and maintainers pledge to making participation in our project and
7
+ our community a harassment-free experience for everyone, regardless of age, body
8
+ size, disability, ethnicity, gender identity and expression, level of experience,
9
+ nationality, personal appearance, race, religion, or sexual identity and
10
+ orientation.
11
+
12
+ ## Our Standards
13
+
14
+ Examples of behavior that contributes to creating a positive environment
15
+ include:
16
+
17
+ * Using welcoming and inclusive language
18
+ * Being respectful of differing viewpoints and experiences
19
+ * Gracefully accepting constructive criticism
20
+ * Focusing on what is best for the community
21
+ * Showing empathy towards other community members
22
+
23
+ Examples of unacceptable behavior by participants include:
24
+
25
+ * The use of sexualized language or imagery and unwelcome sexual attention or
26
+ advances
27
+ * Trolling, insulting/derogatory comments, and personal or political attacks
28
+ * Public or private harassment
29
+ * Publishing others' private information, such as a physical or electronic
30
+ address, without explicit permission
31
+ * Other conduct which could reasonably be considered inappropriate in a
32
+ professional setting
33
+
34
+ ## Our Responsibilities
35
+
36
+ Project maintainers are responsible for clarifying the standards of acceptable
37
+ behavior and are expected to take appropriate and fair corrective action in
38
+ response to any instances of unacceptable behavior.
39
+
40
+ Project maintainers have the right and responsibility to remove, edit, or
41
+ reject comments, commits, code, wiki edits, issues, and other contributions
42
+ that are not aligned to this Code of Conduct, or to ban temporarily or
43
+ permanently any contributor for other behaviors that they deem inappropriate,
44
+ threatening, offensive, or harmful.
45
+
46
+ ## Scope
47
+
48
+ This Code of Conduct applies both within project spaces and in public spaces
49
+ when an individual is representing the project or its community. Examples of
50
+ representing a project or community include using an official project e-mail
51
+ address, posting via an official social media account, or acting as an appointed
52
+ representative at an online or offline event. Representation of a project may be
53
+ further defined and clarified by project maintainers.
54
+
55
+ ## Enforcement
56
+
57
+ Instances of abusive, harassing, or otherwise unacceptable behavior may be
58
+ reported by contacting the project team at TODO: Write your email address. All
59
+ complaints will be reviewed and investigated and will result in a response that
60
+ is deemed necessary and appropriate to the circumstances. The project team is
61
+ obligated to maintain confidentiality with regard to the reporter of an incident.
62
+ Further details of specific enforcement policies may be posted separately.
63
+
64
+ Project maintainers who do not follow or enforce the Code of Conduct in good
65
+ faith may face temporary or permanent repercussions as determined by other
66
+ members of the project's leadership.
67
+
68
+ ## Attribution
69
+
70
+ This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
71
+ available at [http://contributor-covenant.org/version/1/4][version]
72
+
73
+ [homepage]: http://contributor-covenant.org
74
+ [version]: http://contributor-covenant.org/version/1/4/
data/Gemfile ADDED
@@ -0,0 +1,6 @@
1
+ source "https://rubygems.org"
2
+
3
+ git_source(:github) {|repo_name| "https://github.com/#{repo_name}" }
4
+
5
+ # Specify your gem's dependencies in vue_component_builder.gemspec
6
+ gemspec
data/LICENSE.txt ADDED
@@ -0,0 +1,21 @@
1
+ The MIT License (MIT)
2
+
3
+ Copyright (c) 2021 TODO: Write your name
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in
13
+ all copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21
+ THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,47 @@
1
+ # Vue Component Builder
2
+ Generate Vue component CRUD from Rails model mapping
3
+
4
+ ### Install
5
+
6
+ In development section of your **Gemfile** put:
7
+
8
+ ```ruby
9
+ gem 'vue_component_builder'
10
+ ```
11
+
12
+ And run
13
+
14
+ ```shell
15
+ $ bundle install
16
+ ```
17
+
18
+ ### Features
19
+
20
+ - Generate validate inputs from model validates roles;
21
+ - Generate Vue methods hook with create, show, update, list and destroy javascript methods with Axios api calls template;
22
+ - Recognize model attributes types (string, integer, datetime, date, decimal) and generate form fields according to them;
23
+ - Mapping labels of form component from the i18n model;
24
+ - Generate table list of in the same screen;
25
+ - Exclude attributes models option;
26
+ - Select theme [element-plus](https://element-plus.org/). (is default)
27
+
28
+ ### Usage
29
+
30
+ ```ruby
31
+ model=Fruit
32
+ component=MyFruitComponent
33
+ theme=element-plus
34
+ exclude=id,created_at,updated_at [optional]
35
+ ```
36
+
37
+ ```shell
38
+ $ rails g vue_component:builder model=Fruit component=MyFruitComponent theme=element-plus exclude=id,created_at,updated_at
39
+ ```
40
+
41
+ ### TODO / coming soon
42
+
43
+ - Implement gem test;
44
+ - More theme options like Vuesax, BootstrapVue, Buefy or PrimeVue;
45
+ - Output directory option of generated component.
46
+ - Add search option in table;
47
+ - Add filter in table.
data/Rakefile ADDED
@@ -0,0 +1,10 @@
1
+ require "bundler/gem_tasks"
2
+ require "rake/testtask"
3
+
4
+ Rake::TestTask.new(:test) do |t|
5
+ t.libs << "test"
6
+ t.libs << "lib"
7
+ t.test_files = FileList["test/**/*_test.rb"]
8
+ end
9
+
10
+ task :default => :test
data/bin/console ADDED
@@ -0,0 +1,14 @@
1
+ #!/usr/bin/env ruby
2
+
3
+ require "bundler/setup"
4
+ require "vue_component_builder"
5
+
6
+ # You can add fixtures and/or initialization code here to make experimenting
7
+ # with your gem easier. You can also use a different console, if you like.
8
+
9
+ # (If you use this, don't forget to add pry to your Gemfile!)
10
+ # require "pry"
11
+ # Pry.start
12
+
13
+ require "irb"
14
+ IRB.start(__FILE__)
data/bin/setup ADDED
@@ -0,0 +1,8 @@
1
+ #!/usr/bin/env bash
2
+ set -euo pipefail
3
+ IFS=$'\n\t'
4
+ set -vx
5
+
6
+ bundle install
7
+
8
+ # Do any other automated setup that you need to do here
@@ -0,0 +1,9 @@
1
+ <!-- <%= "#{@field[:name]}" %> -->
2
+ <el-row :gutter='24'>
3
+ <el-col :span='24'>
4
+ <el-form-item label='<%= @field[:label] %>' :label-width='formLabelWidth'>
5
+ <el-switch v-model='this.<%= "#{@options[:model][:name]}.#{@field[:name]}" %>'></el-switch>
6
+ </el-form-item>
7
+ </el-col>
8
+ </el-row>
9
+
@@ -0,0 +1,9 @@
1
+ <!-- <%= "#{@field[:name]}" %> -->
2
+ <el-row :gutter='24'>
3
+ <el-col :span='24'>
4
+ <el-form-item label='<%= @field[:label] %>' :label-width='formLabelWidth'>
5
+ <el-date-picker v-model='this.<%= "#{@options[:model][:name]}.#{@field[:name]}" %>' type='date'></el-date-picker>
6
+ </el-form-item>
7
+ </el-col>
8
+ </el-row>
9
+
@@ -0,0 +1,14 @@
1
+ <!-- <%= "#{@field[:name]}" %> -->
2
+ <el-row :gutter='24'>
3
+ <el-col :span='24'>
4
+ <el-form-item label='<%= @field[:label] %>' :label-width='formLabelWidth'>
5
+ <el-input-number
6
+ v-model='this.<%= "#{@options[:model][:name]}.#{@field[:name]}" %>'
7
+ :precision="2"
8
+ :step="0.1"
9
+ :max="10"
10
+ autocomplete='off'></el-input-number>
11
+ </el-form-item>
12
+ </el-col>
13
+ </el-row>
14
+
@@ -0,0 +1,8 @@
1
+ <el-row :gutter='24'>
2
+ <el-col :span='24'>
3
+ <el-form-item label='<%= @attribute[:label] %>' :label-width='formLabelWidth'>
4
+ <el-switch
5
+ v-model='<%= "#{@options[:model][:name]}.#{@attribute[:name]}" %>'></el-switch>
6
+ </el-form-item>
7
+ </el-col>
8
+ </el-row>
@@ -0,0 +1,9 @@
1
+ <el-row :gutter='24'>
2
+ <el-col :span='24'>
3
+ <el-form-item label='<%= @attribute[:label] %>' :label-width='formLabelWidth'>
4
+ <el-date-picker format="DD/MM/YYYY"
5
+ style="width: 129px"
6
+ v-model='<%= "#{@options[:model][:name]}.#{@attribute[:name]}" %>' type='date'></el-date-picker>
7
+ </el-form-item>
8
+ </el-col>
9
+ </el-row>
@@ -0,0 +1,7 @@
1
+ <el-row :gutter='24'>
2
+ <el-col :span='24'>
3
+ <el-form-item label='<%= @attribute[:label] %>' :label-width='formLabelWidth'>
4
+ <el-input-number v-model='<%= "#{@options[:model][:name]}.#{@attribute[:name]}" %>' autocomplete='off'></el-input-number>
5
+ </el-form-item>
6
+ </el-col>
7
+ </el-row>
@@ -0,0 +1,7 @@
1
+ <el-row :gutter='24'>
2
+ <el-col :span='24'>
3
+ <el-form-item label='<%= @attribute[:label] %>' :label-width='formLabelWidth'>
4
+ <el-input-number v-model='<%= "#{@options[:model][:name]}.#{@attribute[:name]}" %>' autocomplete='off'></el-input-number>
5
+ </el-form-item>
6
+ </el-col>
7
+ </el-row>
@@ -0,0 +1,7 @@
1
+ <el-row :gutter='24'>
2
+ <el-col :span='24'>
3
+ <el-form-item label='<%= @attribute[:label] %>' :label-width='formLabelWidth'>
4
+ <el-input v-model='<%= "#{@options[:model][:name]}.#{@attribute[:name]}" %>' autocomplete='off'></el-input>
5
+ </el-form-item>
6
+ </el-col>
7
+ </el-row>
@@ -0,0 +1,9 @@
1
+ <!-- <%= "#{@field[:name]}" %> -->
2
+ <el-row :gutter='24'>
3
+ <el-col :span='24'>
4
+ <el-form-item label='<%= @field[:label] %>' :label-width='formLabelWidth'>
5
+ <el-input-number v-model='this.<%= "#{@options[:model][:name]}.#{@field[:name]}" %>' autocomplete='off'></el-input-number>
6
+ </el-form-item>
7
+ </el-col>
8
+ </el-row>
9
+
@@ -0,0 +1 @@
1
+ <%=@attribute[:name] %>: false
@@ -0,0 +1 @@
1
+ <%=@attribute[:name] %>: ""
@@ -0,0 +1 @@
1
+ <%=@attribute[:name] %>: 0.0
@@ -0,0 +1,13 @@
1
+ data() {
2
+ return {
3
+ activeTabName: '<%= @options[:model][:name] %>_tab',
4
+ formLabelWidth: '120px',
5
+
6
+ <%= @options[:model][:name] %>:
7
+ {
8
+ id: null,
9
+ <%= @attributes %>
10
+ },
11
+ <%= @options[:model][:name].pluralize %>:[],
12
+ }
13
+ }
@@ -0,0 +1,5 @@
1
+ methods: {
2
+ <%=@methods %>,
3
+ <%=@validateForm %>
4
+ <%=@resetForm %>
5
+ }
@@ -0,0 +1,3 @@
1
+ mounted() {
2
+ this.index();
3
+ },
@@ -0,0 +1 @@
1
+ <%=@attribute[:name] %>: 0
@@ -0,0 +1,15 @@
1
+ async <%=@method_name %>() {
2
+ this.loading = true;
3
+ if(this.validateForm()){
4
+ const payload = this.<%= @options[:model][:name] %>
5
+ const response = await api.post(`<%= @options[:model][:name].pluralize %>`, payload);
6
+ this.$notify({
7
+ title: '<%= @options[:model][:name] %>',
8
+ message: response.data.message,
9
+ quadrant: 'success',
10
+ });
11
+ this.resetForm();
12
+ this.index();
13
+ }
14
+ this.loading = false;
15
+ },
@@ -0,0 +1,7 @@
1
+ async <%=@method_name %>() {
2
+ this.loading = true;
3
+ const response = await api.delete(`<%= "#{@options[:model][:name].pluralize}/${this.#{@options[:model][:name]}.id}" %>`,);
4
+ this.<%= @options[:model][:name].pluralize %> = response.data;
5
+ this.index();
6
+ this.loading = false;
7
+ },
@@ -0,0 +1,6 @@
1
+ async <%=@method_name %>() {
2
+ this.loading = true;
3
+ const response = await api.get(`<%= @options[:model][:name].pluralize %>`);
4
+ this.<%= @options[:model][:name].pluralize %> = response.data;
5
+ this.loading = false;
6
+ },
@@ -0,0 +1,5 @@
1
+ resetForm() {
2
+ this.<%= @options[:model][:name] %> = {
3
+ <%= @attributes %>
4
+ }
5
+ }
@@ -0,0 +1,6 @@
1
+ async <%=@method_name %>(id) {
2
+ this.loading = true;
3
+ const response = await api.get(`<%= @options[:model][:name].pluralize %>/${id}`);
4
+ this.<%= @options[:model][:name] %> = response.data;
5
+ this.loading = false;
6
+ },
@@ -0,0 +1,15 @@
1
+ async update() {
2
+ if(this.validateForm()){
3
+ const payload = this.<%= @options[:model][:name] %>
4
+ const response = await api.put(
5
+ `<%= "#{@options[:model][:name].pluralize}/${this.#{@options[:model][:name]}.id}" %>`,
6
+ payload
7
+ );
8
+ this.$notify({
9
+ title: '<%= @options[:model][:name].capitalize %>',
10
+ message: response.data.message,
11
+ quadrant: 'success',
12
+ });
13
+ this.index();
14
+ }
15
+ }
@@ -0,0 +1,4 @@
1
+ validateForm() {
2
+ <%= @rules %>
3
+ return true
4
+ },
@@ -0,0 +1,8 @@
1
+ if (this.<%= @options[:model][:name] %>.<%= @attribute[:name] %> === null) {
2
+ this.$notify({
3
+ title: 'Atenção',
4
+ message: 'O campo <%= @attribute[:label] %> deve ser preenchido',
5
+ type: 'warning'
6
+ }, {root: true})
7
+ return false
8
+ }
@@ -0,0 +1 @@
1
+ <%=@attribute[:name] %>: ""
@@ -0,0 +1,62 @@
1
+ <template>
2
+ <div style='width: 100%'>
3
+ <el-main>
4
+ <el-row :gutter='24'>
5
+ <el-col :span='4'>
6
+ <Settingsmenu/>
7
+ </el-col>
8
+ <el-col :span='13'>
9
+ <el-tabs v-model='this.activeTabName' type='border-card'>
10
+ <el-tab-pane name='<%= @options[:model][:name] %>_tab'>
11
+
12
+ <template #label>
13
+ <span><i class='el-icon-check'></i> <%= @options[:model][:name].capitalize %></span>
14
+ </template>
15
+
16
+ <el-form :model='<%= @options[:model][:name] %>'>
17
+
18
+ <%= @form_attributes %>
19
+
20
+ <el-button-group>
21
+ <el-button v-if='this.<%= @options[:model][:name] %>.id' @click='this.update()' plain type='primary'>Atualizar</el-button>
22
+ <el-button v-else @click='this.create()' plain type='success'>Salvar</el-button>
23
+ <el-popconfirm
24
+ v-if='this.<%= @options[:model][:name] %>.id'
25
+ confirm-button-text='Sim'
26
+ cancel-button-text='Não'
27
+ icon='el-icon-info'
28
+ icon-color='orange'
29
+ title='Deseja realmente excluir este registro?'
30
+ @confirm='this.destroy()'
31
+ >
32
+ <template #reference>
33
+ <el-button type='danger'>Excluir</el-button>
34
+ </template>
35
+ </el-popconfirm>
36
+ <el-button @click='this.resetForm()' plain type='info'>Novo</el-button>
37
+ </el-button-group>
38
+ </el-form>
39
+ <br>
40
+ <el-divider></el-divider>
41
+ <br>
42
+ <%= @table %>
43
+ </el-tab-pane>
44
+ </el-tabs>
45
+ </el-col>
46
+ </el-row>
47
+ </el-main>
48
+ </div>
49
+ </template>
50
+
51
+ <style>
52
+ .showRecord {
53
+ cursor: pointer;
54
+ color: rgb(64, 158, 255);
55
+ display: block;
56
+ padding: 5px;
57
+ }
58
+ </style>
59
+
60
+ <script>
61
+ <%= @script %>
62
+ </script>
@@ -0,0 +1,11 @@
1
+ import {api} from '../../api/index';
2
+ import Settingsmenu from './Settingsmenu';
3
+
4
+ export default {
5
+ components: {
6
+ Settingsmenu,
7
+ },
8
+ <%= "#{@data_hook}," %>
9
+ <%= "#{@mounted_hook}" %>
10
+ <%= "#{@methods_hook}" %>
11
+ };
@@ -0,0 +1,9 @@
1
+ <!-- <%= "#{@field[:name]}" %> -->
2
+ <el-row :gutter='24'>
3
+ <el-col :span='24'>
4
+ <el-form-item label='<%= @field[:label] %>' :label-width='formLabelWidth'>
5
+ <el-input v-model='this.<%= "#{@options[:model][:name]}.#{@field[:name]}" %>' :step='1'></el-input>
6
+ </el-form-item>
7
+ </el-col>
8
+ </el-row>
9
+
@@ -0,0 +1,9 @@
1
+ <el-table-column
2
+ prop='<%= @attribute[:name] %>'
3
+ label='<%= @attribute[:label] %>'
4
+ width='110px'>
5
+ <template #default='<%= @options[:model][:name] %>'>
6
+ <el-tag v-if='<%= "#{@options[:model][:name]}.row.#{@attribute[:name]}" %>' type='success'>Sim</el-tag>
7
+ <el-tag v-else type='danger'>Não</el-tag>
8
+ </template>
9
+ </el-table-column>
@@ -0,0 +1,10 @@
1
+ <el-table-column
2
+ prop='<%= @attribute[:name] %>'
3
+ label='<%= @attribute[:label] %>'
4
+ width='auto'>
5
+ <template #default='<%= @options[:model][:name] %>'>
6
+ <span class='showRecord' @click='show(<%= @options[:model][:name] %>.row.id)'>
7
+ {{ <%= "#{@options[:model][:name]}.row.#{@attribute[:name]}" %> }}
8
+ </span>
9
+ </template>
10
+ </el-table-column>
@@ -0,0 +1,10 @@
1
+ <el-table-column
2
+ prop='<%= @attribute[:name] %>'
3
+ label='<%= @attribute[:label] %>'
4
+ width='auto'>
5
+ <template #default='<%= @options[:model][:name] %>'>
6
+ <span class='showRecord' @click='show(<%= @options[:model][:name] %>.row.id)'>
7
+ {{ <%= "#{@options[:model][:name]}.row.#{@attribute[:name]}" %> }}
8
+ </span>
9
+ </template>
10
+ </el-table-column>
@@ -0,0 +1,10 @@
1
+ <el-table-column
2
+ prop='<%= @attribute[:name] %>'
3
+ label='<%= @attribute[:label] %>'
4
+ width='auto'>
5
+ <template #default='<%= @options[:model][:name] %>'>
6
+ <span class='showRecord' @click='show(<%= @options[:model][:name] %>.row.id)'>
7
+ {{ <%= "#{@options[:model][:name]}.row.#{@attribute[:name]}" %> }}
8
+ </span>
9
+ </template>
10
+ </el-table-column>
@@ -0,0 +1,10 @@
1
+ <el-table-column
2
+ prop='<%= @attribute[:name] %>'
3
+ label='<%= @attribute[:label] %>'
4
+ width='auto'>
5
+ <template #default='<%= @options[:model][:name] %>'>
6
+ <span class='showRecord' @click='show(<%= @options[:model][:name] %>.row.id)'>
7
+ {{ <%= "#{@options[:model][:name]}.row.#{@attribute[:name]}" %> }}
8
+ </span>
9
+ </template>
10
+ </el-table-column>
@@ -0,0 +1,11 @@
1
+ <el-row :gutter='24'>
2
+ <el-col :span='24'>
3
+ <el-scrollbar height='350px'>
4
+ <el-table
5
+ :data='<%= @options[:model][:name].pluralize %>'
6
+ style='width: 100%'>
7
+ <%= @columns %>
8
+ </el-table>
9
+ </el-scrollbar>
10
+ </el-col>
11
+ </el-row>
@@ -0,0 +1,3 @@
1
+ module VueComponentBuilder
2
+ VERSION = "0.1.0"
3
+ end
@@ -0,0 +1,229 @@
1
+ require "vue_component_builder/version"
2
+ require 'rails/generators/base'
3
+ require 'fileutils'
4
+
5
+ module VueComponentBuilder
6
+ module Generators
7
+ class NewGenerator < Rails::Generators::Base
8
+
9
+ def execute
10
+ p 'Building Vue component...'
11
+
12
+ if ARGV.empty?
13
+ raise StandardError, <<-ERROR.strip_heredoc
14
+
15
+ Be sure to have informed the params needed:
16
+ e.g
17
+ model=Fruit
18
+ component=MyFruitComponent
19
+ theme=element-plus
20
+ exclude=id,created_at,updated_at [optional]
21
+
22
+ rails g vue_component_builder:new model=Fruit component=MyFruitComponent theme=element-plus exclude=id,created_at,updated_at
23
+ ERROR
24
+ end
25
+
26
+ input = {}
27
+ ARGV.to_a.each do |arg|
28
+ command = arg.split('=')
29
+ input[command[0].to_sym] = command[1]
30
+ end
31
+
32
+ input[:exclude] = input[:exclude].try(:split, ',')
33
+
34
+ @options = {
35
+ component: input[:component],
36
+ theme: input[:theme],
37
+ model: {
38
+ name: input[:model].downcase.to_s,
39
+ attributes: [],
40
+ exclude: input[:exclude],
41
+ class: eval(input[:model].capitalize.to_s)
42
+ },
43
+ controller: {
44
+ name: "#{input[:model].to_s.pluralize}Controller",
45
+ methods: []
46
+ },
47
+ }
48
+
49
+ @options[:controller].merge!(methods: eval("Api::V1::#{@options[:controller][:name]}").instance_methods(false).map { |m| m.to_s })
50
+ attributes = @options[:model][:class].columns_hash.map do |k, v|
51
+ label = I18n.t("activerecord.attributes.#{@options[:model][:name]}.#{k}", default: k.upcase)
52
+ unless @options[:model][:exclude].nil?
53
+ { name: k, type: v.type.to_s, label: label } if !@options[:model][:exclude].include? k
54
+ else
55
+ { name: k, type: v.type.to_s, label: label }
56
+ end
57
+ end
58
+ @options[:model].merge!(attributes: attributes.compact)
59
+ self.build
60
+ end
61
+
62
+ protected
63
+
64
+ def build
65
+ # output_dir = "#{__dir__}/builder/output/#{@options[:component].to_s}.vue"
66
+ output_dir = "#{Rails.root}/public/#{@options[:component].to_s}.vue"
67
+ @form_attributes = generate_form_attribute
68
+
69
+ # Read tempalte
70
+ @data_hook = data_hook
71
+ @mounted_hook = mounted_hook
72
+ @methods_hook = methods_hook
73
+ @table = generate_table
74
+ @script = readTemplate('script.js.erb')
75
+ template = readTemplate('main.vue.erb')
76
+
77
+ # Output
78
+ File.open(output_dir, 'w') { |file| file.write(template) }
79
+ p "The component 'public/#{@options[:component].to_s}.vue' was builded successfully"
80
+ end
81
+
82
+ def generate_form_attribute
83
+ response = ''
84
+ @options[:model][:attributes].each do |attribute|
85
+ inputTemplate = case attribute[:type]
86
+ when 'integer'
87
+ 'integer'
88
+ when 'string'
89
+ 'string'
90
+ when 'boolean'
91
+ 'boolean'
92
+ when 'datetime'
93
+ when 'date'
94
+ 'datetime'
95
+ else
96
+ 'string'
97
+ end
98
+
99
+ @attribute = attribute
100
+ response += readTemplate("/form/#{inputTemplate}.vue.erb")
101
+ end
102
+ response
103
+ end
104
+
105
+ def generate_validateForm
106
+ presence_validated_attributes = @options[:model][:class].validators.map do |validator|
107
+ validator.attributes if validator.is_a?(ActiveRecord::Validations::PresenceValidator)
108
+ end.compact.flatten
109
+
110
+ @rules = ""
111
+ presence_validated_attributes.each do |attribute|
112
+ @attribute = @options[:model][:attributes].select { |attr| attr[:name] == attribute.to_s }[0]
113
+ @rules += readTemplate("js/methods/validate_rules.js.erb")
114
+ end
115
+ @rules
116
+ readTemplate("js/methods/validate.js.erb")
117
+ end
118
+
119
+ def generate_reset_form
120
+ @attributes = ""
121
+ @options[:model][:attributes].each do |attribute|
122
+ @attributes += "#{attribute[:name]}: #{attribute[:type] == 'boolean' ? 'false' : 'null'},"
123
+ end
124
+ readTemplate("js/methods/resetForm.js.erb")
125
+ end
126
+
127
+ def readTemplate templateName
128
+ template_dir = "#{__dir__}/builder/template/#{@options[:theme]}"
129
+ template = ERB.new File.read("#{template_dir}/#{templateName}"), nil, '%'
130
+ template.result(binding)
131
+ end
132
+
133
+ def data_hook
134
+ attributes = ''
135
+ @options[:model][:attributes].each do |attribute|
136
+ unless attribute[:name] == 'id'
137
+ @attribute = attribute
138
+ inputTemplate = case attribute[:type]
139
+ when 'integer'
140
+ 'integer'
141
+ when 'string'
142
+ 'string'
143
+ when 'boolean'
144
+ 'boolean'
145
+ when 'datetime'
146
+ when 'date'
147
+ 'datetime'
148
+ else
149
+ 'string'
150
+ end
151
+
152
+ attributes += readTemplate("js/#{inputTemplate}.js.erb")
153
+ attributes += ",\n"
154
+ end
155
+ end
156
+ @attributes = attributes.chop
157
+ response = readTemplate('js/hooks/data.js.erb')
158
+ response
159
+ end
160
+
161
+ def mounted_hook
162
+ readTemplate('js/hooks/mounted.js.erb')
163
+ end
164
+
165
+ def methods_hook
166
+ # content = "#{self.resetForm}"
167
+ @methods = ""
168
+ @options[:controller][:methods].each do |method|
169
+ method_name = method.to_s
170
+ @method_name = method_name
171
+ @methods += eval("generate_call_#{method_name}")
172
+ end
173
+
174
+ @validateForm = generate_validateForm
175
+ @resetForm = generate_reset_form
176
+
177
+ response = readTemplate('js/hooks/methods.js.erb')
178
+ response
179
+ end
180
+
181
+ def generate_call_index
182
+ readTemplate('js/methods/index.js.erb')
183
+ end
184
+
185
+ def generate_call_show
186
+ readTemplate('js/methods/show.js.erb')
187
+ end
188
+
189
+ def generate_call_create
190
+ readTemplate('js/methods/create.js.erb')
191
+ end
192
+
193
+ def generate_call_destroy
194
+ readTemplate('js/methods/destroy.js.erb')
195
+ end
196
+
197
+ def generate_call_update
198
+ readTemplate('js/methods/update.js.erb')
199
+ end
200
+
201
+ def generate_call_edit
202
+ ""
203
+ end
204
+
205
+ def generate_table
206
+ @columns = generate_table_column
207
+ readTemplate('/table/table-component.vue.erb')
208
+ end
209
+
210
+ def generate_table_column
211
+ content = ""
212
+ @options[:model][:attributes].each do |attribute|
213
+ content += generate_column_by_type attribute
214
+ end
215
+ content
216
+ end
217
+
218
+ def generate_column_by_type attribute
219
+ @attribute = attribute
220
+ case attribute[:type]
221
+ when 'boolean'
222
+ readTemplate('/table/boolean.vue.erb')
223
+ else
224
+ readTemplate('/table/string.vue.erb')
225
+ end
226
+ end
227
+ end
228
+ end
229
+ end
@@ -0,0 +1,40 @@
1
+
2
+ lib = File.expand_path("../lib", __FILE__)
3
+ $LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
4
+ require "vue_component_builder/version"
5
+
6
+ Gem::Specification.new do |spec|
7
+ spec.name = "vue_component_builder"
8
+ spec.version = VueComponentBuilder::VERSION
9
+ spec.authors = ["Yonatha Almeida"]
10
+ spec.email = ["yonathalmeida@gmail.com"]
11
+
12
+ spec.summary = %q{Generate Vue component CRUD from Rails model mapping}
13
+ spec.description = %q{Wrapper vue component}
14
+ spec.homepage = "https://github.com/Yonatha/vue_component_builder"
15
+ spec.license = "MIT"
16
+
17
+ # Prevent pushing this gem to RubyGems.org. To allow pushes either set the 'allowed_push_host'
18
+ # to allow pushing to a single host or delete this section to allow pushing to any host.
19
+ if spec.respond_to?(:metadata)
20
+ spec.metadata["homepage_uri"] = spec.homepage
21
+ spec.metadata["source_code_uri"] = "https://github.com/Yonatha/vue_component_builder"
22
+ spec.metadata["changelog_uri"] = "https://github.com/Yonatha/vue_component_builder"
23
+ else
24
+ raise "RubyGems 2.0 or newer is required to protect against " \
25
+ "public gem pushes."
26
+ end
27
+
28
+ # Specify which files should be added to the gem when it is released.
29
+ # The `git ls-files -z` loads the files in the RubyGem that have been added into git.
30
+ spec.files = Dir.chdir(File.expand_path('..', __FILE__)) do
31
+ `git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
32
+ end
33
+ spec.bindir = "exe"
34
+ spec.executables = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
35
+ spec.require_paths = ["lib"]
36
+
37
+ spec.add_development_dependency "bundler", "~> 1.17"
38
+ spec.add_development_dependency "rake", "~> 10.0"
39
+ spec.add_development_dependency "minitest", "~> 5.0"
40
+ end
metadata ADDED
@@ -0,0 +1,134 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: vue_component_builder
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.1.0
5
+ platform: ruby
6
+ authors:
7
+ - Yonatha Almeida
8
+ autorequire:
9
+ bindir: exe
10
+ cert_chain: []
11
+ date: 2021-10-06 00:00:00.000000000 Z
12
+ dependencies:
13
+ - !ruby/object:Gem::Dependency
14
+ name: bundler
15
+ requirement: !ruby/object:Gem::Requirement
16
+ requirements:
17
+ - - "~>"
18
+ - !ruby/object:Gem::Version
19
+ version: '1.17'
20
+ type: :development
21
+ prerelease: false
22
+ version_requirements: !ruby/object:Gem::Requirement
23
+ requirements:
24
+ - - "~>"
25
+ - !ruby/object:Gem::Version
26
+ version: '1.17'
27
+ - !ruby/object:Gem::Dependency
28
+ name: rake
29
+ requirement: !ruby/object:Gem::Requirement
30
+ requirements:
31
+ - - "~>"
32
+ - !ruby/object:Gem::Version
33
+ version: '10.0'
34
+ type: :development
35
+ prerelease: false
36
+ version_requirements: !ruby/object:Gem::Requirement
37
+ requirements:
38
+ - - "~>"
39
+ - !ruby/object:Gem::Version
40
+ version: '10.0'
41
+ - !ruby/object:Gem::Dependency
42
+ name: minitest
43
+ requirement: !ruby/object:Gem::Requirement
44
+ requirements:
45
+ - - "~>"
46
+ - !ruby/object:Gem::Version
47
+ version: '5.0'
48
+ type: :development
49
+ prerelease: false
50
+ version_requirements: !ruby/object:Gem::Requirement
51
+ requirements:
52
+ - - "~>"
53
+ - !ruby/object:Gem::Version
54
+ version: '5.0'
55
+ description: Wrapper vue component
56
+ email:
57
+ - yonathalmeida@gmail.com
58
+ executables: []
59
+ extensions: []
60
+ extra_rdoc_files: []
61
+ files:
62
+ - ".gitignore"
63
+ - ".travis.yml"
64
+ - CODE_OF_CONDUCT.md
65
+ - Gemfile
66
+ - LICENSE.txt
67
+ - README.md
68
+ - Rakefile
69
+ - bin/console
70
+ - bin/setup
71
+ - lib/builder/template/element-plus/boolean.vue.erb
72
+ - lib/builder/template/element-plus/datetime.vue.erb
73
+ - lib/builder/template/element-plus/decimal.vue.erb
74
+ - lib/builder/template/element-plus/form/boolean.vue.erb
75
+ - lib/builder/template/element-plus/form/datetime.vue.erb
76
+ - lib/builder/template/element-plus/form/decimal.vue.erb
77
+ - lib/builder/template/element-plus/form/integer.vue.erb
78
+ - lib/builder/template/element-plus/form/string.vue.erb
79
+ - lib/builder/template/element-plus/integer.vue.erb
80
+ - lib/builder/template/element-plus/js/boolean.js.erb
81
+ - lib/builder/template/element-plus/js/datetime.js.erb
82
+ - lib/builder/template/element-plus/js/decimal.js.erb
83
+ - lib/builder/template/element-plus/js/hooks/data.js.erb
84
+ - lib/builder/template/element-plus/js/hooks/methods.js.erb
85
+ - lib/builder/template/element-plus/js/hooks/mounted.js.erb
86
+ - lib/builder/template/element-plus/js/integer.js.erb
87
+ - lib/builder/template/element-plus/js/methods/create.js.erb
88
+ - lib/builder/template/element-plus/js/methods/destroy.js.erb
89
+ - lib/builder/template/element-plus/js/methods/index.js.erb
90
+ - lib/builder/template/element-plus/js/methods/resetForm.js.erb
91
+ - lib/builder/template/element-plus/js/methods/show.js.erb
92
+ - lib/builder/template/element-plus/js/methods/update.js.erb
93
+ - lib/builder/template/element-plus/js/methods/validate.js.erb
94
+ - lib/builder/template/element-plus/js/methods/validate_rules.js.erb
95
+ - lib/builder/template/element-plus/js/string.js.erb
96
+ - lib/builder/template/element-plus/main.vue.erb
97
+ - lib/builder/template/element-plus/script.js.erb
98
+ - lib/builder/template/element-plus/string.vue.erb
99
+ - lib/builder/template/element-plus/table/boolean.vue.erb
100
+ - lib/builder/template/element-plus/table/datetime.vue.erb
101
+ - lib/builder/template/element-plus/table/decimal.vue.erb
102
+ - lib/builder/template/element-plus/table/integer.vue.erb
103
+ - lib/builder/template/element-plus/table/string.vue.erb
104
+ - lib/builder/template/element-plus/table/table-component.vue.erb
105
+ - lib/vue_component_builder.rb
106
+ - lib/vue_component_builder/version.rb
107
+ - vue_component_builder.gemspec
108
+ homepage: https://github.com/Yonatha/vue_component_builder
109
+ licenses:
110
+ - MIT
111
+ metadata:
112
+ homepage_uri: https://github.com/Yonatha/vue_component_builder
113
+ source_code_uri: https://github.com/Yonatha/vue_component_builder
114
+ changelog_uri: https://github.com/Yonatha/vue_component_builder
115
+ post_install_message:
116
+ rdoc_options: []
117
+ require_paths:
118
+ - lib
119
+ required_ruby_version: !ruby/object:Gem::Requirement
120
+ requirements:
121
+ - - ">="
122
+ - !ruby/object:Gem::Version
123
+ version: '0'
124
+ required_rubygems_version: !ruby/object:Gem::Requirement
125
+ requirements:
126
+ - - ">="
127
+ - !ruby/object:Gem::Version
128
+ version: '0'
129
+ requirements: []
130
+ rubygems_version: 3.0.1
131
+ signing_key:
132
+ specification_version: 4
133
+ summary: Generate Vue component CRUD from Rails model mapping
134
+ test_files: []