完全vue渲染列表的功能
去掉不必要的js函数定义 修改返回json的方式
This commit is contained in:
@@ -1877,4 +1877,15 @@ select.input-sm, select.form-group-sm .form-control {
|
||||
}
|
||||
::-webkit-scrollbar-corner {
|
||||
background-color: #fafafa
|
||||
}
|
||||
|
||||
/** vue 列表页样式定义 */
|
||||
.vue-list-page {
|
||||
display: none;
|
||||
}
|
||||
.vue-list-page .search-inline-form .form-group {
|
||||
margin-left: 4px;
|
||||
}
|
||||
.vue-list-page .btn-group {
|
||||
margin-left: 4px;
|
||||
}
|
||||
Vendored
+1
-1
File diff suppressed because one or more lines are too long
Vendored
+1
-1
File diff suppressed because one or more lines are too long
Vendored
+1
-1
File diff suppressed because one or more lines are too long
@@ -46,5 +46,154 @@
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
gdoo.grid = function(table) {
|
||||
var root = this;
|
||||
this.table = table;
|
||||
this.grid = new agGridOptions();
|
||||
|
||||
this.header = Vue.reactive({
|
||||
init: false,
|
||||
name: '',
|
||||
master_table: '',
|
||||
access: {},
|
||||
create_btn: false,
|
||||
trash_btn: false,
|
||||
simple_search_form: true,
|
||||
right_buttons: [],
|
||||
left_buttons: [],
|
||||
buttons: [],
|
||||
tabs: {items:[], active:''},
|
||||
search_form:{columns:[]},
|
||||
by_title: '全部',
|
||||
bys: {items:[]}
|
||||
});
|
||||
|
||||
this.search = {
|
||||
simple: {el: null, query: {}},
|
||||
advanced: {el: null, query: {}}
|
||||
};
|
||||
|
||||
this.action = new gridAction();
|
||||
|
||||
this.init = function(res) {
|
||||
var me = this;
|
||||
if (me.header.init == false) {
|
||||
|
||||
var header = res.header;
|
||||
me.header.init = true;
|
||||
me.header.create_btn = header.create_btn;
|
||||
me.header.trash_btn = header.trash_btn;
|
||||
me.header.access = header.access;
|
||||
me.header.name = header.name;
|
||||
me.header.table = table;
|
||||
|
||||
// 搜索
|
||||
var search_form = header.search_form;
|
||||
search_form.simple_search = header.simple_search_form;
|
||||
|
||||
me.header.search_form = search_form;
|
||||
me.search.forms = search_form.forms;
|
||||
|
||||
// 设置栏目
|
||||
me.grid.api.setColumnDefs(header.columns);
|
||||
me.grid.columnDefs = header.columns;
|
||||
|
||||
me.grid.remoteParams = search_form.query;
|
||||
|
||||
// 操作
|
||||
me.action.table = table;
|
||||
me.action.name = header.master_name;
|
||||
me.action.bill_url = header.bill_uri;
|
||||
|
||||
// 按钮
|
||||
me.header.right_buttons = header.right_buttons;
|
||||
me.header.left_buttons = header.left_buttons;
|
||||
me.header.center_buttons = header.buttons;
|
||||
|
||||
// tabs
|
||||
me.header.bys = header.bys;
|
||||
me.header.tabs = header.tabs;
|
||||
me.header.tabs.active = search_form.params['tab'] ? search_form.params['tab'] : header.tabs.items[0].value;
|
||||
|
||||
// 渲染完成显示div
|
||||
$('#' + table + '-controller').show();
|
||||
|
||||
setTimeout(function() {
|
||||
me.searchForm();
|
||||
}, 1);
|
||||
|
||||
// 绑定自定义事件
|
||||
var $gridDiv = $("#" + table + "-grid");
|
||||
$gridDiv.on('click', '[data-toggle="event"]', function () {
|
||||
var data = $(this).data();
|
||||
if (data.master_id > 0) {
|
||||
me.action[data.action](data);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
this.searchForm = function() {
|
||||
var me = this;
|
||||
me.search.advanced.el = $('#' + me.table + '-search-form-advanced').searchForm({
|
||||
data: me.search.forms,
|
||||
advanced: true
|
||||
});
|
||||
me.search.simple.el = $('#' + me.table + '-search-form').searchForm({
|
||||
data: me.search.forms
|
||||
});
|
||||
me.search.simple.el.find('#search-submit').on('click', function() {
|
||||
var query = me.search.simple.el.serializeArray();
|
||||
var params = {};
|
||||
me.search.queryType = 'simple';
|
||||
$.map(query, function(row) {
|
||||
params[row.name] = row.value;
|
||||
});
|
||||
params['page'] = 1;
|
||||
me.grid.remoteData(params);
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
this.tabBtn = function(tab) {
|
||||
root.header.tabs.active = tab.value;
|
||||
root.grid.remoteData({page:1, tab:tab.value});
|
||||
}
|
||||
this.actBtn = function(act) {
|
||||
root.action[act]();
|
||||
}
|
||||
this.linkBtn = function(btn) {
|
||||
if (btn.action) {
|
||||
root.action[btn.action]();
|
||||
}
|
||||
}
|
||||
this.byBtn = function(by) {
|
||||
root.header.by_title = by.name;
|
||||
root.grid.remoteData({page:1, by:by.value});
|
||||
}
|
||||
|
||||
function url(url, query) {
|
||||
let params = this.toRaw(me.header.search_form.params);
|
||||
for (const key in query) {
|
||||
params[key] = query[key];
|
||||
}
|
||||
return app.url(url, params);
|
||||
}
|
||||
|
||||
this.setup = {
|
||||
header: this.header,
|
||||
tabBtn: this.tabBtn,
|
||||
actBtn: this.actBtn,
|
||||
linkBtn: this.linkBtn,
|
||||
byBtn: this.byBtn
|
||||
};
|
||||
|
||||
gdoo.grids[table] = {
|
||||
grid: this.grid,
|
||||
search: this.search
|
||||
};
|
||||
}
|
||||
|
||||
window.gdoo = gdoo;
|
||||
})(jQuery);
|
||||
@@ -517,7 +517,6 @@
|
||||
function gridAction(table, name) {
|
||||
this.name = name;
|
||||
this.table = table;
|
||||
this.routes = {};
|
||||
this.dialogType = 'dialog';
|
||||
|
||||
this.show = function(data, key, name) {
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
{
|
||||
"/assets/dist/bundle.min.js": "/assets/dist/bundle.min.js?id=6ed6b193096450339853",
|
||||
"/assets/dist/app.min.js": "/assets/dist/app.min.js?id=6b963e5843726542f368",
|
||||
"/assets/dist/app.min.css": "/assets/dist/app.min.css?id=290d60b320ac8f048b29",
|
||||
"/assets/dist/app.min.js": "/assets/dist/app.min.js?id=d0dbe44f95652fdeacef",
|
||||
"/assets/dist/app.min.css": "/assets/dist/app.min.css?id=e9562e3971ee47c76bde",
|
||||
"/assets/vendor/ag-grid/ag-grid.min.css": "/assets/vendor/ag-grid/ag-grid.min.css?id=0e414057cb24126f35ae",
|
||||
"/assets/dist/index.min.js": "/assets/dist/index.min.js?id=0b5199e460c9072a6bee",
|
||||
"/assets/dist/index.min.css": "/assets/dist/index.min.css?id=2a1c8520e6db7b17f69a"
|
||||
"/assets/dist/index.min.css": "/assets/dist/index.min.css?id=1b33db42fa88839c6e53"
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user