Skip to content

Commit 600cafe

Browse files
authored
Merge pull request #27 from zhangchunlin/master
Sync
2 parents 031a013 + c3e149c commit 600cafe

File tree

5 files changed

+226
-58
lines changed

5 files changed

+226
-58
lines changed

demo/apps/tables/templates/Tables/list.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
<div id="app">
1111
<tabs v-model:value="tab_current" type="card">
1212
<tab-pane v-for="item in tabs" :key="item" :label="item" :name="item">
13-
<apijson-table :table_name="item" :config="apijson_tables[item]"></apijson-table>
13+
<apijson-table :model_name="item" :config="apijson_tables[item]"></apijson-table>
1414
</tab-pane>
1515
</tabs>
1616
</div>

uliweb_apijson/apijson/settings.ini

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,9 @@ user = {
1212
"secret_fields" : ["password"],
1313
"GET" : { "roles" : ["ADMIN","OWNER"] },
1414
"HEAD" : { "roles" : ["ADMIN","OWNER"] },
15-
"POST" : { "roles" : ["ADMIN","OWNER"] },
15+
"POST" : { "roles" : ["ADMIN"] },
1616
"PUT" : { "roles" : ["ADMIN","OWNER"] },
17-
"DELETE" : { "roles" : ["ADMIN","OWNER"] },
17+
"DELETE" : { "roles" : ["ADMIN"] },
1818
}
1919

2020
[FUNCTIONS]

uliweb_apijson/apijson/templates/vue/inc_apijson_table.html

Lines changed: 36 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@
22
Vue.component('apijson-table', {
33
delimiters: ['{', '}'],
44
props: [
5-
"table_name",
5+
"model_name", //apijson model name
6+
"request_tag", //apijson request tag, default will be same with model name
67
"config",
78
"custom_tcolumns_render_generator",
89
"hook_init",
@@ -44,12 +45,14 @@
4445
</div>
4546
</modal>
4647
<modal v-model="modal_delete" title="Confirm to delete" @on-ok="real_remove">
47-
<p>Confirm to delete #{delete_params.row&&delete_params.row.id} in table '{table_name}'?</p>
48+
<p>Confirm to delete #{delete_params.row&&delete_params.row.id} in table '{model_name}'?</p>
4849
</modal>
4950
</div>`,
5051
data: function(){
5152
var thisp = this
5253
return {
54+
l_request_tag: null,
55+
5356
loading: false,
5457
modal_view: false,
5558
viewedit_items: [],
@@ -172,7 +175,7 @@
172175
"@page":thisp.current_page-1,
173176
"@query":2
174177
}
175-
arr_params[this.table_name] = {
178+
arr_params[this.model_name] = {
176179
"@order":thisp.sort_key+thisp.sort_order,
177180
"@role":"{{=role}}"
178181
}
@@ -225,7 +228,7 @@
225228
}
226229
else {
227230
thisp.$Notice.error({
228-
title: 'error when get table '+thisp.table_name,
231+
title: 'error when get table '+thisp.model_name,
229232
desc: data.msg
230233
})
231234
}
@@ -276,18 +279,19 @@
276279
save: function(){
277280
var thisp = this
278281
var params = {
279-
"@tag": thisp.table_name
282+
"@tag": thisp.l_request_tag
280283
}
281284
var record_params = {}
282285
var row = thisp.edit_params.row
283286

287+
//only save modified fields
284288
for (var k in thisp.viewedit_items) {
285289
var d = thisp.viewedit_items[k]
286290
if (d.key=="id"|| d.value!=row[d.key]) {
287291
record_params[d.key] = d.value
288292
}
289293
}
290-
params[thisp.table_name] = record_params
294+
params[thisp.l_request_tag] = record_params
291295
params = thisp.ajax_hook("apijson_put","update",params)
292296
$.ajax({
293297
type: "POST",
@@ -297,15 +301,15 @@
297301
success: function (data) {
298302
if (data.code==200){
299303
thisp.$Notice.success({
300-
title: 'success update #'+row.id+' in table '+thisp.table_name,
304+
title: 'success update #'+row.id+' in table '+thisp.model_name,
301305
desc: data.msg
302306
})
303307
thisp.modal_view = false
304308
thisp.update_list()
305309
}
306310
else {
307311
thisp.$Notice.error({
308-
title: 'error when update #'+row.id+' in table '+thisp.table_name,
312+
title: 'error when update #'+row.id+' in table '+thisp.model_name,
309313
desc: data.msg
310314
})
311315
}
@@ -323,13 +327,13 @@
323327
real_remove_set_deleted: function(){
324328
var thisp = this
325329
var params = {
326-
"@tag": thisp.table_name
330+
"@tag": thisp.l_request_tag
327331
}
328332
var params_table = {
329333
"id": thisp.delete_params.row.id,
330334
}
331335
params_table[this.config_deleted_field_name] = true
332-
params[thisp.table_name] = params_table
336+
params[thisp.l_request_tag] = params_table
333337

334338
params = thisp.ajax_hook("apijson_put","delete",params)
335339

@@ -341,21 +345,21 @@
341345
success: function (data) {
342346
if (data.code!=200){
343347
thisp.$Notice.error({
344-
title: 'error when remove #'+thisp.delete_params.row.id+' in table '+thisp.table_name,
348+
title: 'error when remove #'+thisp.delete_params.row.id+' in table '+thisp.model_name,
345349
desc: data.msg
346350
})
347351
return
348352
}
349-
var result = data[thisp.table_name]
353+
var result = data[thisp.l_request_tag]
350354
if (result.code!=200){
351355
thisp.$Notice.error({
352-
title: 'error when remove #'+thisp.delete_params.row.id+' in table '+thisp.table_name,
356+
title: 'error when remove #'+thisp.delete_params.row.id+' in table '+thisp.model_name,
353357
desc: result.msg
354358
})
355359
return
356360
}
357361
thisp.$Notice.success({
358-
title: 'success remove #'+thisp.delete_params.row.id+' in table '+thisp.table_name,
362+
title: 'success remove #'+thisp.delete_params.row.id+' in table '+thisp.model_name,
359363
desc: result.msg
360364
})
361365
thisp.update_list()
@@ -365,9 +369,9 @@
365369
real_remove_delete: function(){
366370
var thisp = this
367371
var params = {
368-
"@tag": thisp.table_name
372+
"@tag": thisp.l_request_tag
369373
}
370-
params[thisp.table_name] = {
374+
params[thisp.l_request_tag] = {
371375
"id": thisp.delete_params.row.id
372376
}
373377
params = thisp.ajax_hook("apijson_delete","delete",params)
@@ -379,21 +383,21 @@
379383
success: function (data) {
380384
if (data.code!=200){
381385
thisp.$Notice.error({
382-
title: 'error when remove #'+thisp.delete_params.row.id+' in table '+thisp.table_name,
386+
title: 'error when remove #'+thisp.delete_params.row.id+' in table '+thisp.model_name,
383387
desc: data.msg
384388
})
385389
return
386390
}
387-
var result = data[thisp.table_name]
391+
var result = data[thisp.l_request_tag]
388392
if (result.code!=200){
389393
thisp.$Notice.error({
390-
title: 'error when remove #'+thisp.delete_params.row.id+' in table '+thisp.table_name,
394+
title: 'error when remove #'+thisp.delete_params.row.id+' in table '+thisp.model_name,
391395
desc: result.msg
392396
})
393397
return
394398
}
395399
thisp.$Notice.success({
396-
title: 'success remove #'+thisp.delete_params.row.id+' in table '+thisp.table_name,
400+
title: 'success remove #'+thisp.delete_params.row.id+' in table '+thisp.model_name,
397401
desc: result.msg
398402
})
399403
thisp.update_list()
@@ -411,14 +415,14 @@
411415
real_add: function(){
412416
thisp = this
413417
var params = {
414-
"@tag": thisp.table_name
418+
"@tag": thisp.l_request_tag
415419
}
416420
var post_params = {}
417421
for (var k in thisp.add_items) {
418422
var d = thisp.add_items[k]
419423
post_params[d.key] = d.value
420424
}
421-
params[this.table_name] = post_params
425+
params[this.l_request_tag] = post_params
422426
params = thisp.ajax_hook("apijson_post","add",params)
423427
$.ajax({
424428
type: "POST",
@@ -428,14 +432,14 @@
428432
success: function (data) {
429433
if (data.code!=200){
430434
thisp.$Notice.error({
431-
title: 'error when add new record in table '+thisp.table_name,
435+
title: 'error when add new record in table '+thisp.model_name,
432436
desc: data.msg
433437
})
434438
return
435439
}
436-
var result = data[thisp.table_name]
440+
var result = data[thisp.l_request_tag]
437441
thisp.$Notice.success({
438-
title: 'success add #'+result.id+' in table '+thisp.table_name,
442+
title: 'success add #'+result.id+' in table '+thisp.model_name,
439443
desc: result.msg
440444
})
441445
thisp.update_list()
@@ -456,6 +460,13 @@
456460
}
457461
},
458462
mounted: function(){
463+
if (this.request_tag==null) {
464+
this.l_request_tag = this.model_name
465+
}
466+
else {
467+
this.l_request_tag = this.request_tag
468+
}
469+
459470
if (this.config!=null){
460471
this.config_editable = this.config.editable || false
461472
this.config_table_fields = this.config.table_fields || null
Lines changed: 149 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,149 @@
1+
<script>
2+
Vue.component('apijson-viewedit', {
3+
delimiters: ['{', '}'],
4+
props: [
5+
"model_name",
6+
"request_tag",
7+
"id",
8+
"config",
9+
"custom_tcolumns_render_generator",
10+
"hook_init",
11+
"hook_ajax_params"
12+
],
13+
template: `
14+
<i-form @submit.native.prevent :label-width="80">
15+
<form-item v-for="item in viewedit_items" :key="item.key" :label="item.title">
16+
<i-input v-if="item.component=='input'" v-model="item.value" :readonly="!editable(item)"></i-input>
17+
<checkbox v-if="item.component=='checkbox'" v-model="item.value" :disabled="!editable(item)"></checkbox>
18+
<i-input v-if="item.component=='textarea'" v-model="item.value" type="textarea" :autosize="{minRows: 2,maxRows: 5}"></i-input>
19+
</form-item>
20+
<form-item v-if="config_editable" label="action">
21+
<i-button type="info" icon="ios-download" size="large" @click="save">Save</i-button>
22+
</form-item>
23+
</i-form>
24+
`,
25+
data: function(){
26+
return {
27+
l_request_tag: null,
28+
role: "{{=role}}",
29+
row: {},
30+
row_saved: {},
31+
viewedit_items: [],
32+
33+
config_editable: false,
34+
config_viewedit_fields: null,
35+
}
36+
},
37+
methods: {
38+
init_viewedit: function(){
39+
var params = {}
40+
var model_params = {
41+
"id":this.id,
42+
"@role":this.role
43+
}
44+
params[this.model_name] = model_params
45+
var thisp = this
46+
$.ajax({
47+
type: "POST",
48+
url: "{{=url_for('uliweb_apijson.apijson.views.ApiJson.get')}}",
49+
contentType: 'application/json',
50+
data: JSON.stringify(params),
51+
success: function (data) {
52+
if (data.code==200) {
53+
thisp.row = data[thisp.model_name]
54+
thisp.row_saved = thisp.row
55+
thisp.viewedit_items = []
56+
if (thisp.config_viewedit_fields!=null) {
57+
for (var i in thisp.config_viewedit_fields) {
58+
var d = thisp.config_viewedit_fields[i]
59+
d.value = thisp.row[d.key]
60+
d.component = d.component || "input"
61+
thisp.viewedit_items.push(d)
62+
}
63+
}
64+
}
65+
else {
66+
thisp.$Notice.error({
67+
title: 'error when get table '+thisp.table_name,
68+
desc: data.msg
69+
})
70+
}
71+
}
72+
})
73+
},
74+
editable: function(item){
75+
var editable = true
76+
if (item.editable!=null) {editable=item.editable}
77+
return this.config_editable && editable && (item.key!="id")
78+
},
79+
save: function(){
80+
var params = {
81+
"@tag": this.l_request_tag
82+
}
83+
var record_params = {}
84+
//only save modified fields
85+
for (var k in this.viewedit_items) {
86+
var d = this.viewedit_items[k]
87+
if (d.key=="id"|| d.value!=this.row_saved[d.key]) {
88+
record_params[d.key] = d.value
89+
this.row[d.key] = d.value
90+
}
91+
}
92+
params[this.l_request_tag] = record_params
93+
params = this.ajax_hook("apijson_put","update",params)
94+
var thisp = this
95+
$.ajax({
96+
type: "POST",
97+
url: "{{=url_for('uliweb_apijson.apijson.views.ApiJson.put')}}",
98+
contentType: 'application/json',
99+
data: JSON.stringify(params),
100+
success: function (data) {
101+
if (data.code==200){
102+
thisp.row_saved = thisp.row
103+
thisp.$Notice.success({
104+
title: 'success update #'+thisp.row.id+' in table '+thisp.model_name,
105+
desc: data.msg
106+
})
107+
}
108+
else {
109+
thisp.$Notice.error({
110+
title: 'error when update #'+thisp.row.id+' in table '+thisp.model_name,
111+
desc: data.msg
112+
})
113+
}
114+
}
115+
})
116+
},
117+
ajax_hook: function(method,action,params) {
118+
if (this.hook_ajax_params!=null) {
119+
var after_hook = this.hook_ajax_params(method,action,params)
120+
if (after_hook!=null) {
121+
params = after_hook
122+
}
123+
else {
124+
console.log("warning: hook_ajax_params('"+method+"','"+action+"',params) return null, so ignore this hook")
125+
}
126+
}
127+
return params
128+
}
129+
},
130+
mounted: function(){
131+
if (this.request_tag==null) {
132+
this.l_request_tag = this.model_name
133+
}
134+
else {
135+
this.l_request_tag = this.request_tag
136+
}
137+
//if not do this, the first notice will hide behind the navigation bar in uliweb apps
138+
this.$Notice.config({top: 100,duration: 8});
139+
if (this.hook_init!=null) {
140+
this.hook_init(this)
141+
}
142+
if (this.config!=null){
143+
this.config_editable = this.config.editable || false
144+
this.config_viewedit_fields = this.config.viewedit_fields || null
145+
}
146+
this.init_viewedit()
147+
}
148+
})
149+
</script>

0 commit comments

Comments
 (0)