Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit d1576ac

Browse files
change hook function names; change "type" to "component" in fields config; override modal footer, only cancel button; add checkbox render; add set deleted support
1 parent 155298c commit d1576ac

File tree

2 files changed

+133
-30
lines changed

2 files changed

+133
-30
lines changed

‎.gitignore‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,4 +4,6 @@ build
44
dist
55
*.egg-info
66
.idea
7-
_git
7+
_git
8+
.vscode
9+

‎uliweb_apijson/apijson/templates/vue/inc_apijson_table.html‎

Lines changed: 130 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,12 @@
11
<script>
22
Vue.component('apijson-table', {
33
delimiters: ['{', '}'],
4-
props: ["table_name","config","func_init","func_change_params"],
4+
props: [
5+
"table_name",
6+
"config",
7+
"hook_init",
8+
"hook_ajax_params"
9+
],
510
template: `<div>
611
<div v-if="config_editable && config_add_fields!=null"><i-button type="primary" @click="add">Add</i-button> <br><br> </div>
712
<Spin size="large" fix v-if="loading"></Spin>
@@ -10,26 +15,32 @@
1015
<modal v-model="modal_add" title="Add">
1116
<i-form @submit.native.prevent :label-width="80">
1217
<form-item v-for="item in add_items" :key="item.key" :label="item.title">
13-
<i-input v-if="item.type=='input'" v-model="item.value"></i-input>
14-
<checkbox v-if="item.type=='checkbox'" v-model="item.value"></checkbox>
15-
<i-input v-if="item.type=='textarea'" v-model="item.value" type="textarea" :autosize="{minRows: 2,maxRows: 5}"></i-input>
18+
<i-input v-if="item.component=='input'" v-model="item.value"></i-input>
19+
<checkbox v-if="item.component=='checkbox'" v-model="item.value"></checkbox>
20+
<i-input v-if="item.component=='textarea'" v-model="item.value" type="textarea" :autosize="{minRows: 2,maxRows: 5}"></i-input>
1621
</form-item>
1722
<form-item v-if="config_editable" label="action">
18-
<i-button type="info" icon="plus" @click="real_add">Add</i-button>
23+
<i-button type="info" icon="plus" size="large" @click="real_add">Add</i-button>
1924
</form-item>
2025
</i-form>
26+
<div slot="footer">
27+
<i-button type="default" size="large" @click="modal_add=false">Cancel</i-button>
28+
</div>
2129
</modal>
2230
<modal v-model="modal_view" :title="viewedit_label">
2331
<i-form @submit.native.prevent :label-width="80">
2432
<form-item v-for="item in viewedit_items" :key="item.key" :label="item.title">
25-
<i-input v-if="item.type=='input'" v-model="item.value" :readonly="!editable(item)"></i-input>
26-
<checkbox v-if="item.type=='checkbox'" v-model="item.value" :disabled="!editable(item)"></checkbox>
27-
<i-input v-if="item.type=='textarea'" v-model="item.value" type="textarea" :autosize="{minRows: 2,maxRows: 5}"></i-input>
33+
<i-input v-if="item.component=='input'" v-model="item.value" :readonly="!editable(item)"></i-input>
34+
<checkbox v-if="item.component=='checkbox'" v-model="item.value" :disabled="!editable(item)"></checkbox>
35+
<i-input v-if="item.component=='textarea'" v-model="item.value" type="textarea" :autosize="{minRows: 2,maxRows: 5}"></i-input>
2836
</form-item>
2937
<form-item v-if="config_editable" label="action">
30-
<i-button type="info" icon="ios-download" @click="save">Save</i-button>
38+
<i-button type="info" icon="ios-download" size="large" @click="save">Save</i-button>
3139
</form-item>
3240
</i-form>
41+
<div slot="footer">
42+
<i-button type="default" size="large" @click="modal_view=false">Cancel</i-button>
43+
</div>
3344
</modal>
3445
<modal v-model="modal_delete" title="Confirm to delete" @on-ok="real_remove">
3546
<p>Confirm to delete #{delete_params.row&&delete_params.row.id} in table '{table_name}'?</p>
@@ -91,9 +102,24 @@
91102
}
92103
}
93104
},
105+
tcolumns_render_generator: {
106+
checkbox: function(key) {
107+
var render_func = function(h,params){
108+
var row = params.row
109+
return h('Icon',{
110+
attrs:{
111+
type: row[key]?"ios-checkmark":"ios-checkmark-outline",
112+
color: row[key]?"#2d8cf0":"#bbbec4",
113+
size: "25"
114+
},
115+
})
116+
}
117+
return render_func
118+
}
119+
},
94120
tcolumns_init: false,
95121
tlist:[],
96-
query_count: 10,
122+
query_count: thisp.config ? (thisp.config.default_page_size||10) : 10,
97123
current_page: 1,
98124
total: 0,
99125
sort_key: "id",
@@ -109,6 +135,29 @@
109135
viewedit_label: function(){return this.config_editable?'Edit':'View'}
110136
},
111137
methods: {
138+
tcolumns_custom_render(){
139+
for (var k in this.tcolumns) {
140+
var c = this.tcolumns[k]
141+
if (c.component!=null) {
142+
var g = this.tcolumns_render_generator[c.component]
143+
if (g!=null){
144+
c.render = g(c.key)
145+
}
146+
}
147+
}
148+
},
149+
ajax_hook: function(method,action,params) {
150+
if (this.hook_ajax_params!=null) {
151+
var after_hook = this.hook_ajax_params(method,action,params)
152+
if (after_hook!=null) {
153+
params = after_hook
154+
}
155+
else {
156+
console.log("warning: hook_ajax_params('"+method+"','"+action+"',params) return null, so ignore this hook")
157+
}
158+
}
159+
return params
160+
},
112161
update_list: function(){
113162
var thisp = this
114163
var arr_params = {
@@ -124,9 +173,7 @@
124173
"[]":arr_params,
125174
"total@":"/[]/total"
126175
}
127-
if (thisp.func_change_params!=null) {
128-
params = thisp.func_change_params("apijson_get",params)
129-
}
176+
params = thisp.ajax_hook("apijson_get","list",params)
130177
thisp.loading = true
131178
$.ajax({
132179
type: "POST",
@@ -141,6 +188,7 @@
141188
if (thisp.config_table_fields!=null){
142189
thisp.tcolumns = thisp.config_table_fields
143190
thisp.tcolumns.push(thisp.tcolumns_preset["action"])
191+
thisp.tcolumns_custom_render()
144192
thisp.tcolumns_init = true
145193
}
146194
else {
@@ -160,13 +208,20 @@
160208
}
161209
}
162210
thisp.tcolumns.push(thisp.tcolumns_preset["action"])
211+
thisp.tcolumns_custom_render()
163212
thisp.tcolumns_init = true
164213
}
165214
}
166215
}
167216
thisp.tlist = arr
168217
thisp.total = data.total
169218
}
219+
else {
220+
thisp.$Notice.error({
221+
title: 'error when get table '+thisp.table_name,
222+
desc: data.msg
223+
})
224+
}
170225
}
171226
})
172227
},
@@ -177,20 +232,20 @@
177232
for (var i in this.config_viewedit_fields) {
178233
var d = this.config_viewedit_fields[i]
179234
d.value = row[d.key]
180-
d.type = d.type || "input"
235+
d.component = d.component || "input"
181236
this.viewedit_items.push(d)
182237
}
183238
}
184239
else {
185-
this.viewedit_items.push({title:"id",value:row.id,"type":"input"})
186-
var type2type = {
240+
this.viewedit_items.push({title:"id",value:row.id,component:"input"})
241+
var type2comp = {
187242
"boolean":"checkbox"
188243
}
189244
for (var k in row){
190245
if (k!="id" && k[0]!="_") {
191246
var value = row[k]
192-
var type = type2type[typeof value] || "input"
193-
this.viewedit_items.push({title:k,value:value,type:type})
247+
var comp = type2comp[typeof value] || "input"
248+
this.viewedit_items.push({title:k,value:value,component:comp})
194249
}
195250
}
196251
}
@@ -226,9 +281,7 @@
226281
}
227282
}
228283
params[thisp.table_name] = record_params
229-
if (thisp.func_change_params!=null) {
230-
params = thisp.func_change_params("apijson_put",params)
231-
}
284+
params = thisp.ajax_hook("apijson_put","update",params)
232285
$.ajax({
233286
type: "POST",
234287
url: "{{=url_for('uliweb_apijson.apijson.views.ApiJson.put')}}",
@@ -253,16 +306,64 @@
253306
})
254307
},
255308
real_remove: function(){
309+
if (this.config_delete_set_deleted) {
310+
this.real_remove_set_deleted()
311+
}
312+
else {
313+
this.real_remove_delete()
314+
}
315+
},
316+
real_remove_set_deleted: function(){
317+
var thisp = this
318+
var params = {
319+
"@tag": thisp.table_name
320+
}
321+
var params_table = {
322+
"id": thisp.delete_params.row.id,
323+
}
324+
params_table[this.config_deleted_field_name] = true
325+
params[thisp.table_name] = params_table
326+
327+
params = thisp.ajax_hook("apijson_put","delete",params)
328+
329+
$.ajax({
330+
type: "POST",
331+
url: "{{=url_for('uliweb_apijson.apijson.views.ApiJson.put')}}",
332+
contentType: 'application/json',
333+
data: JSON.stringify(params),
334+
success: function (data) {
335+
if (data.code!=200){
336+
thisp.$Notice.error({
337+
title: 'error when remove #'+thisp.delete_params.row.id+' in table '+thisp.table_name,
338+
desc: data.msg
339+
})
340+
return
341+
}
342+
var result = data[thisp.table_name]
343+
if (result.code!=200){
344+
thisp.$Notice.error({
345+
title: 'error when remove #'+thisp.delete_params.row.id+' in table '+thisp.table_name,
346+
desc: result.msg
347+
})
348+
return
349+
}
350+
thisp.$Notice.success({
351+
title: 'success remove #'+thisp.delete_params.row.id+' in table '+thisp.table_name,
352+
desc: result.msg
353+
})
354+
thisp.update_list()
355+
}
356+
})
357+
},
358+
real_remove_delete: function(){
256359
var thisp = this
257360
var params = {
258361
"@tag": thisp.table_name
259362
}
260363
params[thisp.table_name] = {
261364
"id": thisp.delete_params.row.id
262365
}
263-
if (thisp.func_change_params!=null) {
264-
params = thisp.func_change_params("apijson_delete",params)
265-
}
366+
params = thisp.ajax_hook("apijson_delete","delete",params)
266367
$.ajax({
267368
type: "POST",
268369
url: "{{=url_for('uliweb_apijson.apijson.views.ApiJson.delete')}}",
@@ -310,9 +411,7 @@
310411
post_params[d.key] = d.value
311412
}
312413
params[this.table_name] = post_params
313-
if (thisp.func_change_params!=null) {
314-
params = thisp.func_change_params("apijson_post",params)
315-
}
414+
params = thisp.ajax_hook("apijson_post","add",params)
316415
$.ajax({
317416
type: "POST",
318417
url: "{{=url_for('uliweb_apijson.apijson.views.ApiJson.post')}}",
@@ -360,9 +459,11 @@
360459
if (this.config.default_page_size!=null) {
361460
this.query_count = this.config.default_page_size
362461
}
462+
this.config_delete_set_deleted = this.config.delete_set_deleted || false
463+
this.config_deleted_field_name = this.config.deleted_field_name || "deleted"
363464
}
364-
if (this.func_init!=null) {
365-
this.func_init(this)
465+
if (this.hook_init!=null) {
466+
this.hook_init(this)
366467
}
367468
this.update_list()
368469
}

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /