vue_crud 0.1.10.2 → 0.1.10.3
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/lib/generators/vue_crud/templates/vue_crud.html +38 -59
- data/lib/vue_crud/version.rb +1 -1
- metadata +1 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 45f7400eedd009c0668e511c1b77cc4489399fca
|
4
|
+
data.tar.gz: dab97bb66525d27edd099ee8c9cfaceda02a1aeb
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: df2c0819f61b16216642e6574e3ee4eaa830f53b5f9a27ae41b0d00d4e3de00ad99e14007de8357bb90463e7b11a8d53197a20fd977a18d93e8a9f6a1afa8e7b
|
7
|
+
data.tar.gz: 0f67249a4eca54e069e9949e32c9227da69d0a3de2114972385f1579d4350f09132afade972d059eb0e3fba1500a726eea0c205065f2d98d248a813efe97b7bc
|
@@ -3,8 +3,8 @@ if(column_type === undefined) var column_type = 'card';
|
|
3
3
|
if(suffix === undefined) var suffix = '.json';
|
4
4
|
if(countOfPage === undefined) var countOfPage = 9;
|
5
5
|
if(sortable === undefined) var sortable = false;
|
6
|
+
if(info_url === undefined) var info_url = "http://localhost:3000/service_prototypes/info";
|
6
7
|
$(document).ready(function() {
|
7
|
-
// $('.vue_form_for_new').html($('#vue_form').html());
|
8
8
|
var modal = $($('#modal').html());
|
9
9
|
var models = $($('#models-' + column_type).html());
|
10
10
|
modal.find('.vue_form').html(
|
@@ -28,7 +28,8 @@ $(document).ready(function() {
|
|
28
28
|
column_type: column_type,
|
29
29
|
suffix: suffix,
|
30
30
|
countOfPage: countOfPage,
|
31
|
-
sortable: sortable
|
31
|
+
sortable: sortable,
|
32
|
+
info_url: info_url
|
32
33
|
});
|
33
34
|
$('.filter .ui.dropdown').dropdown();
|
34
35
|
$('.ui.checkbox').checkbox();
|
@@ -57,7 +58,7 @@ $(document).ready(function() {
|
|
57
58
|
<div class="text">{{ selected_text || '請選擇欄位' }}</div>
|
58
59
|
<i class="dropdown icon"></i>
|
59
60
|
<div class="menu attribute_select">
|
60
|
-
<div class="item attribute_option" v-for="attribute in info.model_attributes" :
|
61
|
+
<div class="item attribute_option" v-for="attribute in info.model_attributes" :target="attribute.name" :target_text="attribute.display_name" :class="{selected: selected_attribute == attribute.name, active: selected_attribute == attribute.name}">{{ attribute.display_name }}</div>
|
61
62
|
</div>
|
62
63
|
</div>
|
63
64
|
<input type="text" id="searchQuery" :placeholder="searchStatus" v-model="searchQuery">
|
@@ -79,13 +80,13 @@ $(document).ready(function() {
|
|
79
80
|
<div class="ui divider" v-if="column_type == 'card'"></div>
|
80
81
|
<!-- NOTE: models -->
|
81
82
|
<div v-sortable class="row ui cards" v-if="column_type == 'card'">
|
82
|
-
<models v-for="model in filteredModels" :model="model" :info="info" :selected_attribute="
|
83
|
+
<models v-for="model in filteredModels" :model="model" :info="info" :selected_attribute="selected_attribute"></models>
|
83
84
|
</div>
|
84
85
|
|
85
86
|
<table class="ui celled selectable table" v-if="column_type == 'table'">
|
86
87
|
<thead>
|
87
88
|
<tr>
|
88
|
-
<th v-for="attribute in info.model_attributes" v-if="attribute.visible" :class="{highlight: attribute.
|
89
|
+
<th v-for="attribute in info.model_attributes" v-if="attribute.visible" :class="{highlight: attribute.name == selected_attribute}">
|
89
90
|
{{ attribute.display_name }}
|
90
91
|
</th>
|
91
92
|
<th>
|
@@ -95,7 +96,7 @@ $(document).ready(function() {
|
|
95
96
|
</tr>
|
96
97
|
</thead>
|
97
98
|
<tbody v-sortable>
|
98
|
-
<tr is="models" v-for="model in filteredModels" :model="model" :info="info" :selected_attribute="
|
99
|
+
<tr is="models" v-for="model in filteredModels" :model="model" :info="info" :selected_attribute="selected_attribute">
|
99
100
|
</tr>
|
100
101
|
</tbody>
|
101
102
|
<tfoot>
|
@@ -119,6 +120,7 @@ $(document).ready(function() {
|
|
119
120
|
|
120
121
|
<modal :info="info"></modal>
|
121
122
|
</div>
|
123
|
+
<!-- NOTE: Templates -->
|
122
124
|
<script type="text/x-template" id="modal">
|
123
125
|
<div class="ui modal" id="vueModal">
|
124
126
|
<div class="ui inverted dimmer">
|
@@ -141,30 +143,19 @@ $(document).ready(function() {
|
|
141
143
|
</div>
|
142
144
|
</div>
|
143
145
|
</script>
|
144
|
-
<!-- NOTE: Templates -->
|
145
146
|
<script type="text/x-template" id="models-table">
|
146
147
|
<tr :class="{'is_deleted': is_deleted}">
|
147
|
-
<td v-for="(attribute, i) in info.model_attributes" v-if="attribute.visible" :class="{'sort-here': i == 0, highlight: attribute.
|
148
|
-
<
|
149
|
-
<span v-if="attribute.
|
150
|
-
{{ model[attribute.model_prefix][attribute.name] }}
|
151
|
-
</span>
|
152
|
-
<span v-else>
|
153
|
-
<img :src="model[attribute.model_prefix][attribute.name]" />
|
154
|
-
</span>
|
155
|
-
</p>
|
156
|
-
<p v-else>
|
157
|
-
<span v-if="attribute.type != 'img'">
|
158
|
-
<span v-if="attribute.type == 'textarea'" v-html="model[attribute.name]">
|
159
|
-
</span>
|
160
|
-
<span v-else>
|
161
|
-
{{ model[attribute.name] }}
|
162
|
-
</span>
|
148
|
+
<td v-for="(attribute, i) in info.model_attributes" v-if="attribute.visible" :class="{'sort-here': i == 0, highlight: attribute.name == selected_attribute}">
|
149
|
+
<span v-if="attribute.input_type != 'img'">
|
150
|
+
<span v-if="attribute.input_type == 'textarea'" v-html="model[attribute.name]">
|
163
151
|
</span>
|
164
152
|
<span v-else>
|
165
|
-
|
153
|
+
{{ model[attribute.name] }}
|
166
154
|
</span>
|
167
|
-
</
|
155
|
+
</span>
|
156
|
+
<span v-else>
|
157
|
+
<img :src="model[attribute.name]" />
|
158
|
+
</span>
|
168
159
|
</td>
|
169
160
|
<td style="position: relative;">
|
170
161
|
<a @click="restoreModel" onclick="return false" class="ui red right corner label" v-show="is_deleted" title="您已刪除,點擊復原">
|
@@ -205,26 +196,15 @@ $(document).ready(function() {
|
|
205
196
|
<div class="col-md-4 sort-here">
|
206
197
|
<div class="card">
|
207
198
|
<div class="content">
|
208
|
-
<div class="header"
|
209
|
-
<div class="header" v-else>{{ model[info.titles.title_attribute] }}</div>
|
199
|
+
<div class="header">{{ model[info.titles.title_attribute] }}</div>
|
210
200
|
<div class="meta">{{ info.titles.display_name }}</div>
|
211
201
|
<div class="ui divider"></div>
|
212
202
|
<div class="description">
|
213
203
|
<div class="ui small feed" v-for="attribute in info.model_attributes" v-if="attribute.visible">
|
214
204
|
<div class="event">
|
215
205
|
<div class="content">
|
216
|
-
<div class="summary" :class="{highlight: attribute.
|
217
|
-
<span v-if="attribute.
|
218
|
-
<div class="ui teal horizontal label">{{ attribute.display_name }}</div>
|
219
|
-
<br>
|
220
|
-
{{ model[attribute.model_prefix][attribute.name] }}
|
221
|
-
</span>
|
222
|
-
<span v-else>
|
223
|
-
<img :src="model[attribute.model_prefix][attribute.name]" />
|
224
|
-
</span>
|
225
|
-
</div>
|
226
|
-
<div class="summary" :class="{highlight: attribute.model_prefix + '.' + attribute.name == selected_attribute}" v-else>
|
227
|
-
<span v-if="attribute.type != 'img'">
|
206
|
+
<div class="summary" :class="{highlight: attribute.name == selected_attribute}">
|
207
|
+
<span v-if="attribute.input_type != 'img'">
|
228
208
|
<div class="ui teal horizontal label">{{ attribute.display_name }}</div>
|
229
209
|
<br>
|
230
210
|
{{ model[attribute.name] }}
|
@@ -271,12 +251,9 @@ $(document).ready(function() {
|
|
271
251
|
<script type="text/x-template" id="vue_form">
|
272
252
|
<form class="ui form" v-if="newMode || editMode">
|
273
253
|
<div v-for="attribute in info.model_attributes" v-if="attribute.editable">
|
274
|
-
<div class="field" v-if="attribute.
|
254
|
+
<div class="field" v-if="attribute.input_type == 'select'">
|
275
255
|
<label :for="'model_' + attribute.display_name">{{ attribute.display_name }}</label>
|
276
|
-
<select :id="'model_' + attribute.display_name" v-
|
277
|
-
<option v-for="option in attribute.options" :value="option.value" v-text="option.text"></option>
|
278
|
-
</select>
|
279
|
-
<select :id="'model_' + attribute.display_name" v-else v-model="model[attribute.name]" class="ui fluid dropdown" :class="attribute.input_class">
|
256
|
+
<select :id="'model_' + attribute.display_name" v-model="model[attribute.name]" class="ui fluid dropdown" :class="attribute.input_class">
|
280
257
|
<option v-for="option in attribute.options" :value="option.value" v-text="option.text"></option>
|
281
258
|
</select>
|
282
259
|
<div class="ui pointing red basic label" v-show="errors[attribute.name]">
|
@@ -285,12 +262,9 @@ $(document).ready(function() {
|
|
285
262
|
</span>
|
286
263
|
</div>
|
287
264
|
</div>
|
288
|
-
<div class="field" v-if="attribute.
|
265
|
+
<div class="field" v-if="attribute.input_type == 'multiSelect'">
|
289
266
|
<label :for="'model_' + attribute.display_name">{{ attribute.display_name }}</label>
|
290
|
-
<select :id="'model_' + attribute.display_name" multiple v-
|
291
|
-
<option v-for="option in attribute.options" :value="option.value" v-text="option.text"></option>
|
292
|
-
</select>
|
293
|
-
<select :id="'model_' + attribute.display_name" multiple v-else v-model="model[attribute.name]" class="ui fluid dropdown" :class="attribute.input_class">
|
267
|
+
<select :id="'model_' + attribute.display_name" multiple v-model="model[attribute.name]" class="ui fluid dropdown" :class="attribute.input_class">
|
294
268
|
<option v-for="option in attribute.options" :value="option.value" v-text="option.text"></option>
|
295
269
|
</select>
|
296
270
|
<div class="ui pointing red basic label" v-show="errors[attribute.name]">
|
@@ -299,21 +273,18 @@ $(document).ready(function() {
|
|
299
273
|
</span>
|
300
274
|
</div>
|
301
275
|
</div>
|
302
|
-
<div class="field" v-if="attribute.
|
276
|
+
<div class="field" v-if="attribute.input_type == 'textarea'">
|
303
277
|
<label :for="'model_' + attribute.display_name">{{ attribute.display_name }}</label>
|
304
|
-
<textarea v-froala :attribute="attribute.name" :id="'model_' + attribute.display_name" v-
|
305
|
-
<textarea v-froala :attribute="attribute.name" :id="'model_' + attribute.display_name" v-else v-model="model[attribute.name]" :class="attribute.input_class"></textarea>
|
278
|
+
<textarea v-froala :attribute="attribute.name" :id="'model_' + attribute.display_name" v-model="model[attribute.name]" :class="attribute.input_class"></textarea>
|
306
279
|
<div class="ui pointing red basic label" v-show="errors[attribute.name]">
|
307
280
|
<span style="color: red" v-for="(error, index) in errors[attribute.name]">
|
308
281
|
<span v-if="index > 0">,</span> {{ error }}
|
309
282
|
</span>
|
310
283
|
</div>
|
311
284
|
</div>
|
312
|
-
|
313
|
-
<div class="field" v-if="attribute.type == 'checkbox'">
|
285
|
+
<div class="field" v-if="attribute.input_type == 'checkbox'">
|
314
286
|
<div class="ui toggle checkbox">
|
315
|
-
<input type="checkbox" tabindex="0" class="hidden" :id="'model_' + attribute.display_name" v-
|
316
|
-
<input type="checkbox" tabindex="0" class="hidden" :id="'model_' + attribute.display_name" v-else v-model="model[attribute.name]" :class="attribute.input_class">
|
287
|
+
<input type="checkbox" tabindex="0" class="hidden" :id="'model_' + attribute.display_name" v-model="model[attribute.name]" :class="attribute.input_class">
|
317
288
|
<label>{{ attribute.display_name }}</label>
|
318
289
|
</div>
|
319
290
|
<div class="ui pointing red basic label" v-show="errors[attribute.name]">
|
@@ -322,10 +293,18 @@ $(document).ready(function() {
|
|
322
293
|
</span>
|
323
294
|
</div>
|
324
295
|
</div>
|
325
|
-
<div class="field" v-if="attribute.
|
296
|
+
<div class="field" v-if="attribute.input_type == 'number'">
|
297
|
+
<label :for="'model_' + attribute.display_name">{{ attribute.display_name }}</label>
|
298
|
+
<input type="number" :id="'model_' + attribute.display_name" v-model="model[attribute.name]" :class="attribute.input_class" number>
|
299
|
+
<div class="ui pointing red basic label" v-show="errors[attribute.name]">
|
300
|
+
<span style="color: red" v-for="(error, index) in errors[attribute.name]">
|
301
|
+
<span v-if="index > 0">,</span> {{ error }}
|
302
|
+
</span>
|
303
|
+
</div>
|
304
|
+
</div>
|
305
|
+
<div class="field" v-if="attribute.input_type != 'number' && attribute.input_type != 'select' && attribute.input_type != 'multiSelect' && attribute.input_type != 'textarea' && attribute.input_type != 'checkbox'">
|
326
306
|
<label :for="'model_' + attribute.display_name">{{ attribute.display_name }}</label>
|
327
|
-
<input :type="attribute.
|
328
|
-
<input :type="attribute.type" :id="'model_' + attribute.display_name" v-else v-model="model[attribute.name]" :class="attribute.input_class">
|
307
|
+
<input :type="attribute.input_type" :id="'model_' + attribute.display_name" v-model="model[attribute.name]" :class="attribute.input_class">
|
329
308
|
<div class="ui pointing red basic label" v-show="errors[attribute.name]">
|
330
309
|
<span style="color: red" v-for="(error, index) in errors[attribute.name]">
|
331
310
|
<span v-if="index > 0">,</span> {{ error }}
|
data/lib/vue_crud/version.rb
CHANGED