Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 6aeac33

Browse files
authored
Merge pull request #13 from zhangchunlin/master
fix request data cannot modify issue; add view and delete action supp…
2 parents ea3cf48 + 7f33970 commit 6aeac33

File tree

3 files changed

+205
-87
lines changed

3 files changed

+205
-87
lines changed

demo/apps/apijson_demo/templates/index.html

Lines changed: 16 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@
2828
<Row v-if="tab_current==='tab_get'">
2929
<i-col span="3"><div align="center"><strong>apijson get</strong> request examples</div></i-col>
3030
<i-col span="8">
31-
<i-select v-model="request_data">
31+
<i-select v-model="select_current">
3232
<i-option v-for="item in request_get" :value="item.value" :key="item.value">{ item.label }</i-option>
3333
</i-select>
3434
</i-col>
@@ -41,21 +41,20 @@
4141
<Row v-if="tab_current==='tab_head'">
4242
<i-col span="3"><div align="center"><strong>apijson head</strong> request examples</div></i-col>
4343
<i-col span="8">
44-
<i-select v-model="request_data">
44+
<i-select v-model="select_current">
4545
<i-option v-for="item in request_head" :value="item.value" :key="item.value">{ item.label }</i-option>
4646
</i-select>
4747
</i-col>
4848
</Row>
4949

50-
5150
<Row v-if="tab_current==='tab_post'">
5251
<i-col span="3"><div align="center">POST URL</div></i-col>
5352
<i-col span="8"><i-input value="/apijson/post" readonly/></i-col>
5453
</Row>
5554
<Row v-if="tab_current==='tab_post'">
5655
<i-col span="3"><div align="center"><strong>apijson post</strong> request examples</div></i-col>
5756
<i-col span="8">
58-
<i-select v-model="request_data">
57+
<i-select v-model="select_current">
5958
<i-option v-for="item in request_post" :value="item.value" :key="item.value">{ item.label }</i-option>
6059
</i-select>
6160
</i-col>
@@ -68,7 +67,7 @@
6867
<Row v-if="tab_current==='tab_put'">
6968
<i-col span="3"><div align="center"><strong>apijson put</strong> request examples</div></i-col>
7069
<i-col span="8">
71-
<i-select v-model="request_data">
70+
<i-select v-model="select_current">
7271
<i-option v-for="item in request_put" :value="item.value" :key="item.value">{ item.label }</i-option>
7372
</i-select>
7473
</i-col>
@@ -81,7 +80,7 @@
8180
<Row v-if="tab_current==='tab_delete'">
8281
<i-col span="3"><div align="center"><strong>apijson delete</strong> request examples</div></i-col>
8382
<i-col span="8">
84-
<i-select v-model="request_data">
83+
<i-select v-model="select_current">
8584
<i-option v-for="item in request_delete" :value="item.value" :key="item.value">{ item.label }</i-option>
8685
</i-select>
8786
</i-col>
@@ -108,6 +107,7 @@
108107
request_put : {{=request_put_json}},
109108
request_delete : {{=request_delete_json}},
110109
request_data : "",
110+
select_current : "",
111111
can_post : true,
112112
response_data : "",
113113
tab_current : "tab_get",
@@ -122,6 +122,7 @@
122122
methods: {
123123
init_default: function(){
124124
vm.request_data = vm.request_get[0].value
125+
vm.select_current = vm.request_data
125126
},
126127
post_request_data: function(){
127128
$.ajax({
@@ -134,7 +135,6 @@
134135
vm.can_post = false
135136
}
136137
})
137-
138138
},
139139
login: function(){window.location.href="{{=url_for('uliweb_apps.login.views.login')}}"},
140140
logout: function(){window.location.href="{{=url_for('uliweb_apps.login.views.logout')}}"}
@@ -159,7 +159,16 @@
159159
else if (n=="tab_delete") {
160160
vm.request_data = vm.request_delete[0].value
161161
}
162+
vm.select_current = vm.request_data
162163
vm.response_data = ""
164+
},
165+
select_current : function(n,o){
166+
if (n!=null && n!="" && n!==vm.request_data) {
167+
vm.request_data = n
168+
}
169+
else {
170+
vm.select_current = vm.request_data
171+
}
163172
}
164173
}
165174
})

demo/apps/tables/templates/vue/inc_apijson_table.html

Lines changed: 0 additions & 80 deletions
This file was deleted.
Lines changed: 189 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,189 @@
1+
<script>
2+
Vue.component('apijson-table', {
3+
delimiters: ['{', '}'],
4+
props: ["table_name"],
5+
template: `<div>
6+
<i-table stripe border :columns="tcolumns" :data="tlist" @on-sort-change="table_on_sort_change"></i-table>
7+
<page :total="total" :page-size="query_count" :current.sync="current_page" :page-size-opts="[10, 20, 50, 100]" show-sizer @on-change="page_on_change" @on-page-size-change="page_on_page_size_change"></page>
8+
<modal v-model="modal_view" title="View">
9+
<i-form @submit.native.prevent :label-width="80">
10+
<form-item v-for="item in view_items" :key="item.key" :label="item.key">
11+
<i-input v-if="typeof item.value !=='boolean'" v-model="item.value" :readonly=true></i-input>
12+
<checkbox v-if="typeof item.value ==='boolean'" v-model="item.value" disabled></checkbox>
13+
</form-item>
14+
</i-form>
15+
</modal>
16+
<modal v-model="modal_delete" title="Confirm to delete" @on-ok="real_remove">
17+
<p>Confirm to delete #{delete_params.row&&delete_params.row.id} in table '{table_name}'?</p>
18+
</modal>
19+
</div>`,
20+
data: function(){
21+
var thisp = this
22+
return {
23+
modal_view: false,
24+
view_items: [],
25+
modal_delete: false,
26+
delete_params:{},
27+
tcolumns: [
28+
{title:'#',key:'id',width:80},
29+
{
30+
title: 'Action',
31+
width: 140,
32+
render: (h, params) => {
33+
return h('div', [
34+
h('Button', {
35+
props: {
36+
type: 'primary',
37+
size: 'small'
38+
},
39+
style: {
40+
marginRight: '5px'
41+
},
42+
on: {
43+
click: function(){
44+
thisp.show(params)
45+
}
46+
}
47+
}, 'View'),
48+
h('Button', {
49+
props: {
50+
type: 'error',
51+
size: 'small'
52+
},
53+
on: {
54+
click: function(){
55+
thisp.remove(params)
56+
}
57+
}
58+
}, 'Delete')
59+
]);
60+
}
61+
}
62+
],
63+
tcolumns_init: false,
64+
tlist:[],
65+
query_count: 10,
66+
current_page: 1,
67+
total: 0,
68+
sort_key: "id",
69+
sort_order: "-"
70+
}
71+
},
72+
methods: {
73+
update_list: function(){
74+
var thisp = this
75+
var arr_params = {
76+
"@count":thisp.query_count,
77+
"@page":thisp.current_page-1,
78+
"@query":2
79+
}
80+
arr_params[this.table_name] = {
81+
"@order":thisp.sort_key+thisp.sort_order,
82+
"@role":"{{=role}}"
83+
}
84+
var params = {
85+
"[]":arr_params,
86+
"total@":"/[]/total"
87+
}
88+
$.ajax({
89+
type: "POST",
90+
url: "{{=url_for('uliweb_apijson.apijson.views.ApiJson.get')}}",
91+
contentType: 'application/json',
92+
data: JSON.stringify(params),
93+
success: function (data) {
94+
if (data.code==200) {
95+
var arr = data["[]"]
96+
if (!thisp.tcolumns_init) {
97+
if (arr.length>0) {
98+
var item = arr[0]
99+
for (var k in item){
100+
if (k!="id") {
101+
var col = {title:k,key:k}
102+
if (typeof item[k] ==="boolean") {
103+
col["width"] = 80
104+
}
105+
else if (typeof item[k] ==="number") {
106+
col["width"] = 100
107+
}
108+
thisp.tcolumns.push(col)
109+
}
110+
}
111+
thisp.tcolumns_init = true
112+
}
113+
}
114+
thisp.tlist = arr
115+
thisp.total = data.total
116+
}
117+
}
118+
})
119+
},
120+
show: function(params){
121+
var row = params.row
122+
this.view_items = []
123+
this.view_items.push({key:"id",value:row.id})
124+
for (var k in row){
125+
if (k!="id" && k[0]!="_") {
126+
value = row[k]
127+
this.view_items.push({key:k,value:value})
128+
}
129+
}
130+
this.modal_view = true
131+
},
132+
remove: function(params){
133+
this.delete_params = params
134+
this.modal_delete = true
135+
},
136+
real_remove: function(){
137+
var thisp = this
138+
var params = {
139+
"@tag": thisp.table_name
140+
}
141+
params[thisp.table_name] = {
142+
"id": thisp.delete_params.row.id
143+
}
144+
$.ajax({
145+
type: "POST",
146+
url: "{{=url_for('uliweb_apijson.apijson.views.ApiJson.delete')}}",
147+
contentType: 'application/json',
148+
data: JSON.stringify(params),
149+
success: function (data) {
150+
if (data.code!=200){
151+
thisp.$Notice.error({
152+
title: 'error when remove #'+thisp.delete_params.row.id+' in table '+thisp.table_name,
153+
desc: data.msg
154+
})
155+
return
156+
}
157+
var result = data[thisp.table_name]
158+
if (result.code!=200){
159+
thisp.$Notice.error({
160+
title: 'error when remove #'+thisp.delete_params.row.id+' in table '+thisp.table_name,
161+
desc: result.msg
162+
})
163+
return
164+
}
165+
thisp.$Notice.success({
166+
title: 'success remove #'+thisp.delete_params.row.id+' in table '+thisp.table_name,
167+
desc: result.msg
168+
});
169+
thisp.update_list()
170+
}
171+
})
172+
},
173+
table_on_sort_change: function(){
174+
175+
},
176+
page_on_change: function(data) {
177+
this.update_list()
178+
},
179+
page_on_page_size_change: function(data) {
180+
this.query_count = data
181+
this.current_page = 0
182+
this.update_list()
183+
}
184+
},
185+
mounted: function(){
186+
this.update_list()
187+
}
188+
})
189+
</script>

0 commit comments

Comments
 (0)