@@ -109,6 +126,7 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/demo/react.html b/src/demo/react.html
index 148a7609..5acacd4d 100644
--- a/src/demo/react.html
+++ b/src/demo/react.html
@@ -114,7 +114,7 @@
isCombSorting= {true}
supportAjaxPage= {true}
supportSorting= {true}
- ajax_url= "http://www.lovejavascript.com/learnLinkManager/getLearnLinkList"
+ ajax_data= "http://www.lovejavascript.com/learnLinkManager/getLearnLinkList"
ajax_type= "POST"
query= {queryInfo}
pageSize= {20}
diff --git a/src/demo/vue.html b/src/demo/vue.html
index d8fc2538..65a4caea 100644
--- a/src/demo/vue.html
+++ b/src/demo/vue.html
@@ -96,7 +96,7 @@
isCombSorting: true,
supportAjaxPage: true,
supportSorting: true,
- ajax_url: "http://www.lovejavascript.com/learnLinkManager/getLearnLinkList",
+ ajax_data: "http://www.lovejavascript.com/learnLinkManager/getLearnLinkList",
ajax_type: "POST",
query: {pluginId: 1},
pageSize: 20
diff --git a/version/v2.6.0.md b/version/v2.6.0.md
index 0486e7bb..2f49367a 100644
--- a/version/v2.6.0.md
+++ b/version/v2.6.0.md
@@ -2,9 +2,9 @@
- constants.js中使用Set替代对象字面量 (es2015无法解析, 暂时不替代了)
- 上下滚动时,set-top抖动问题 (未完成)
-# v2.5.9
+# v2.6.0
- 新增
- - `compileVue`: 框架解析函数
+ - `compileVue`: 框架解析函数(GridManager-Vue中将会默认配置该项)
- `columnMap.useCompile`: 当前模版是否使用框架解析函数
- `checkedBefore`: 选择事件执行前事件
- `checkedAfter`: 选择事件执行后事件
@@ -17,11 +17,124 @@
- `init`方法, 第三个参数`callback`为回调函数，该函数的形参原为query，需要确认该参数是否有用。已调研firstLoading对callback的参数query无影响
- `setAjaxData`方法增加第三个参数: `callback`
- `ajax_data`替代`ajax_url`, 移除`ajax_url`.
- - `ajax_data`: 同时支持` url string || data || function return[promise || url string || data]`, 当值或函数返回值为`string url`时 `ajax_type`才会生效。
+ - `ajax_data`: 同时支持`url string || response data || function return[promise || url string || response data]`。当值或函数的返回值为,string url`时， `ajax_type`才会生效。
- `ajax_beforeSend`: 传入参为: 请求所使用的`promise`
- `ajax_success`: 传入参为请求结果
- `ajax_error`: 传入参为错误信息
- `ajax_complete`: 成功时等同于`ajax_success`, 失败时等同于`ajax_error`
-TODO
-npm run test 存在问题，可能是由于回调函数未执行导致的。具体的可以运行一下test查看错误
+
+
+
+ajax_data 文档更新
+
+无论使用哪种类型获取数据，建议按以下的格式进行数据返回。
+如果不能按该格式返回可以通过dataKey、 totalsKey 和 responseHandler进行数据格式转换，具体的请参考对应的API。
+```javascript
+var responseData = {
+ "data":[ // data=> 返回数据列表的key键值, 可通过配置项`dataKey`进行调整
+ {
+ "name": "baukh",
+ "age": "28",
+ "createDate": "2015-03-12",
+ "info": "野生前端程序",
+ "operation": "修改"
+ },
+ {
+ "name": "baukh",
+ "age": "28",
+ "createDate": "2015-03-12",
+ "info": "野生前端程序",
+ "operation": "修改"
+ }
+ ],
+ "totals": 2 // totals=> 数据总条数key键值， 可通过配置项totalsKey进行调整
+ };
+```
+以下在使用到responseData的时候将默认该变量已经声明且赋值。
+
+
+ajax_data的类型比较灵活, 同时支持url string、 response data、和 function。 其中function 返回三种类型: promise、 url string、 response data。
+当值或函数的返回值为string url时， ajax_type才会生效。
+
+
+url string
+```javascript
+table.GM('init', {
+ ajax_data: 'http://www.lovejavascript.com/learnLinkManager/getLearnLinkList',
+ // ...其它配置项
+});
+```
+
+response data
+```javascript
+table.GM('init', {
+ ajax_data: responseData, // 这里使用上面的声明好的responseData变量
+ // ...其它配置项
+});
+```
+
+function: 函数返回值分: [url string, response data, promise]。函数的实参为当前的配置项汇总，包含分页及排序等信息。
+url string
+```javascript
+ table.GM('init', {
+ ajax_data: function(settring) => {
+ return 'http://www.lovejavascript.com/learnLinkManager/getLearnLinkList';
+ },
+ // ...其它配置项
+ });
+```
+
+response data
+```javascript
+ table.GM('init', {
+ ajax_data: function(settring) => {
+ return responseData; // 这里使用上面的声明好的responseData变量
+ },
+ // ...其它配置项
+ });
+```
+
+promise
+```javascript
+ // 模拟了一个简单的promise请求
+ const getBlogList = function(paramse) {
+ return new Promise((resolve, reject) => {
+ const xhr = new XMLHttpRequest();
+ xhr.open('POST', 'http://www.lovejavascript.com/blogManager/getBlogList');
+ xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+ xhr.onreadystatechange = function() {
+ if (xhr.readyState !== 4) {
+ return;
+ }
+ if (xhr.status >= 200 && xhr.status < 300 || xhr.status === 304) {
+ resolve(xhr.response);
+ } else {
+ reject(xhr);
+ }
+ };
+
+ // 一个简单的处理参数的示例
+ let formData = '';
+ for (let key in paramse) {
+ if(formData !== '') {
+ formData += '&';
+ }
+ formData += key + '=' + paramse[key];
+ }
+ xhr.send(formData);
+ });
+ };
+ table.GM('init', {
+ ajax_data: function(settring) => {
+ // 传入分页及排序的配置项
+ return getBlogList(Object.assign(setting.pageData, setting.sortData));
+ },
+ // ...其它配置项
+ });
+```
+
+
+
+ajax_type更新
+配置ajax_data的值(或函数的返回值)为string url时， ajax_type才会生效。
From 3ac1c86bc95d438004092481e07f1d720b74c30a Mon Sep 17 00:00:00 2001
From: baukh789 <182209508@qq.com>
Date: Sun, 3 Jun 2018 17:54:22 +0800
Subject: [PATCH 026/982] update readme and add demo-promise
---
src/demo/promise.html | 2 +-
version/v2.6.0.md | 2 +-
2 files changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/demo/promise.html b/src/demo/promise.html
index 5fc9add0..ae9413d2 100644
--- a/src/demo/promise.html
+++ b/src/demo/promise.html
@@ -168,7 +168,7 @@
,disableCache: false
,ajax_data: function (setting) {
// 传入分页及排序的配置项
- return getBlogList(Object.assign(setting.pageData, setting.sortData));
+ return getBlogList(Object.assign({}, setting.pageData, setting.sortData));
}
,ajax_type: 'POST'
,supportMenu: true
diff --git a/version/v2.6.0.md b/version/v2.6.0.md
index 2f49367a..4351c3ce 100644
--- a/version/v2.6.0.md
+++ b/version/v2.6.0.md
@@ -128,7 +128,7 @@ promise
table.GM('init', {
ajax_data: function(settring) => {
// 传入分页及排序的配置项
- return getBlogList(Object.assign(setting.pageData, setting.sortData));
+ return getBlogList(Object.assign({}, setting.pageData, setting.sortData));
},
// ...其它配置项
});
From 5f65c65982bb28f6c81122d3cf197f6b1214355c Mon Sep 17 00:00:00 2001
From: baukh789 <182209508@qq.com>
Date: Mon, 4 Jun 2018 14:16:13 +0800
Subject: [PATCH 027/982] add ajax_url warn info
---
src/js/GridManager.js | 6 ++++++
src/js/Settings.js | 5 ++++-
2 files changed, 10 insertions(+), 1 deletion(-)
diff --git a/src/js/GridManager.js b/src/js/GridManager.js
index 0c81db79..05e11d97 100644
--- a/src/js/GridManager.js
+++ b/src/js/GridManager.js
@@ -280,6 +280,12 @@ export default class GridManager {
return;
}
+ // 参数变更提醒 @2.6.0
+ if (arg.ajax_url) {
+ Base.outLog('ajax_url在v2.6.0以后将被废弃, 请使用ajax_data替代', 'error');
+ return;
+ }
+
// 参数中未存在配置项 gridManagerName: 使用table DOM 上的 grid-manager属性
if (typeof arg.gridManagerName !== 'string' || arg.gridManagerName.trim() === '') {
// 存储gridManagerName值
diff --git a/src/js/Settings.js b/src/js/Settings.js
index 5541af6a..ef499eff 100644
--- a/src/js/Settings.js
+++ b/src/js/Settings.js
@@ -238,7 +238,10 @@ class Settings {
// 初次渲染时是否加载数据
firstLoading: true,
- // ajax请求参数, [string url | function {retrun string url | promise | data}] @v2.6.0
+ // 后端API调用地址, @2.6.0中已废弃
+ // ajax_url: '',
+
+ // 后端API调用, [string url | function {retrun string url | promise | data}] @v2.6.0
ajax_data: undefined,
// ajax请求类型['GET', 'POST']默认GET
From 0f7f69161cb9346c26136c71f27e7f2be8f1c35b Mon Sep 17 00:00:00 2001
From: baukh789 <182209508@qq.com>
Date: Wed, 6 Jun 2018 13:31:15 +0800
Subject: [PATCH 028/982] update readme
---
README.md | 12 +++++++++---
version/v2.6.0.md | 10 ++++------
2 files changed, 13 insertions(+), 9 deletions(-)
diff --git a/README.md b/README.md
index 0a642e41..f189d429 100644
--- a/README.md
+++ b/README.md
@@ -9,9 +9,15 @@
- [English](readme/README-EN.md)
- [中文](readme/README-CN.md)
-## API and Demo
+## API
- [API](http://gridmanager.lovejavascript.com/api/index.html)
-- [Demo](http://www.lovejavascript.com/node_modules/GridManager/demo/index.html)
+
+## Demo
+- [base grid](http://runjs.cn/code/dkxyyzim)
+- [use I18N grid](http://runjs.cn/code/tho0nht5)
+- [use search grid](http://runjs.cn/code/eoxfjqgc)
+- [use export grid](http://runjs.cn/code/iqixtlhw)
+- [use template grid](http://runjs.cn/code/rcyn61v1)
## Implementation Function
### GridManager.js can make the tag of table into real cases. And after that ,these functions are accessed:
@@ -29,7 +35,7 @@
## GridManager by frameworks
- [GridManager by Vue](https://github.com/baukh789/GridManager-Vue)
-- [GridManager by Angular 1.x](https://github.com/baukh789/GridManager-Angular-1.x)
+- [GridManager by Angular 1.x](https://github.com/baukh789/GridManager-Angular-1.x)
- [GridManager by React](https://github.com/baukh789/GridManager-React)
## Version Information
diff --git a/version/v2.6.0.md b/version/v2.6.0.md
index 4351c3ce..55a0317d 100644
--- a/version/v2.6.0.md
+++ b/version/v2.6.0.md
@@ -5,7 +5,8 @@
# v2.6.0
- 新增
- `compileVue`: 框架解析函数(GridManager-Vue中将会默认配置该项)
- - `columnMap.useCompile`: 当前模版是否使用框架解析函数
+ - `columnMap.useCompile`: 当前模版是否使用框架解析函数(更多vue相关项请参考gridmanager-vue)
+ - `columnData.template`: 增加对vue模版的支持。
- `checkedBefore`: 选择事件执行前事件
- `checkedAfter`: 选择事件执行后事件
- `checkedAllBefore`: 全选事件执行前事件
@@ -23,13 +24,10 @@
- `ajax_error`: 传入参为错误信息
- `ajax_complete`: 成功时等同于`ajax_success`, 失败时等同于`ajax_error`
-
-
-
ajax_data 文档更新
-无论使用哪种类型获取数据，建议按以下的格式进行数据返回。
-如果不能按该格式返回可以通过dataKey、 totalsKey 和 responseHandler进行数据格式转换，具体的请参考对应的API。
+无论使用哪种类型获取数据，需要匹配以下数据格式。
+如与以下格式不匹配，可以通过dataKey、totalsKey 和 responseHandler进行数据格式转换，具体的请参考对应的API。
```javascript
var responseData = {
"data":[ // data=> 返回数据列表的key键值, 可通过配置项`dataKey`进行调整
From ef32e89eac56485e2110dff3932ccd88fdd3c4eb Mon Sep 17 00:00:00 2001
From: baukh789 <182209508@qq.com>
Date: Wed, 6 Jun 2018 13:32:04 +0800
Subject: [PATCH 029/982] update readme
---
README.md | 20 ++++++++++----------
1 file changed, 10 insertions(+), 10 deletions(-)
diff --git a/README.md b/README.md
index f189d429..4471705c 100644
--- a/README.md
+++ b/README.md
@@ -9,16 +9,6 @@
- [English](readme/README-EN.md)
- [中文](readme/README-CN.md)
-## API
-- [API](http://gridmanager.lovejavascript.com/api/index.html)
-
-## Demo
-- [base grid](http://runjs.cn/code/dkxyyzim)
-- [use I18N grid](http://runjs.cn/code/tho0nht5)
-- [use search grid](http://runjs.cn/code/eoxfjqgc)
-- [use export grid](http://runjs.cn/code/iqixtlhw)
-- [use template grid](http://runjs.cn/code/rcyn61v1)
-
## Implementation Function
### GridManager.js can make the tag of table into real cases. And after that ,these functions are accessed:
- Width control: you can control the width of your grid easily
@@ -38,6 +28,16 @@
- [GridManager by Angular 1.x](https://github.com/baukh789/GridManager-Angular-1.x)
- [GridManager by React](https://github.com/baukh789/GridManager-React)
+## API
+- [API](http://gridmanager.lovejavascript.com/api/index.html)
+
+## Demo
+- [base grid](http://runjs.cn/code/dkxyyzim)
+- [use I18N grid](http://runjs.cn/code/tho0nht5)
+- [use search grid](http://runjs.cn/code/eoxfjqgc)
+- [use export grid](http://runjs.cn/code/iqixtlhw)
+- [use template grid](http://runjs.cn/code/rcyn61v1)
+
## Version Information
- [v2.5.x.md](/version/v2.5.x.md)
- [v2.4.x.md](/version/v2.4.x.md)
From 23eb3031aaf79db6c933033b45a7b99627ab92db Mon Sep 17 00:00:00 2001
From: baukh789 <182209508@qq.com>
Date: Wed, 6 Jun 2018 18:28:26 +0800
Subject: [PATCH 030/982] add method: cleanData(table)
---
src/common/constants.js | 1 +
src/js/AjaxPage.js | 16 ++++++++++++----
src/js/Core.js | 22 ++++++++++++++++++++++
src/js/GridManager.js | 5 +++++
src/js/Publish.js | 4 ++++
test/Core_test.js | 9 ++++++++-
test/GridManager_test.js | 8 ++++++++
test/Publish_test.js | 10 +++++++++-
version/v2.6.0.md | 3 +++
9 files changed, 72 insertions(+), 6 deletions(-)
diff --git a/src/common/constants.js b/src/common/constants.js
index 1c44b483..1af57520 100644
--- a/src/common/constants.js
+++ b/src/common/constants.js
@@ -22,6 +22,7 @@ export const GM_PUBLISH_METHOD_LIST = [
'refreshGrid',
'getCheckedTr',
'getCheckedData',
+ 'cleanData',
'destroy'
];
diff --git a/src/js/AjaxPage.js b/src/js/AjaxPage.js
index b7737905..416d83ed 100644
--- a/src/js/AjaxPage.js
+++ b/src/js/AjaxPage.js
@@ -432,12 +432,20 @@ class AjaxPage {
*/
__getPageData(settings, totals) {
const _pSize = settings.pageData.pSize || settings.pageSize;
+ const _tPage = Math.ceil(totals / _pSize);
const _cPage = settings.pageData.cPage || 1;
return {
- tPage: Math.ceil(totals / _pSize), // 总页数
- cPage: _cPage, // 当前页
- pSize: _pSize, // 每页显示条数
- tSize: totals // 总条路
+ // 总页数
+ tPage: _tPage,
+
+ // 当前页
+ cPage: _cPage > _tPage ? 1 : _cPage,
+
+ // 每页显示条数
+ pSize: _pSize,
+
+ // 总条路
+ tSize: totals
};
}
diff --git a/src/js/Core.js b/src/js/Core.js
index dfec1071..9e47bd8a 100644
--- a/src/js/Core.js
+++ b/src/js/Core.js
@@ -153,6 +153,28 @@ class Core {
}, 2000);
}
+ /**
+ * 清空当前表格数据
+ * @param $table
+ */
+ cleanData($table) {
+ const settings = Cache.getSettings($table);
+ this.insertEmptyTemplate($table, settings);
+
+ // 渲染选择框
+ if (settings.supportCheckbox) {
+ Checkbox.resetDOM($table, []);
+ }
+
+ // 渲染分页
+ if (settings.supportAjaxPage) {
+ AjaxPage.resetPageData($table, settings, 0);
+ Menu.updateMenuPageStatus(settings.gridManagerName, settings.pageData);
+ }
+
+ // this.driveDomForSuccessAfter($table, settings, response, callbakc);
+ }
+
/**
* 执行ajax成功后重新渲染DOM
* @param $table
diff --git a/src/js/GridManager.js b/src/js/GridManager.js
index 05e11d97..c3e53ac5 100644
--- a/src/js/GridManager.js
+++ b/src/js/GridManager.js
@@ -228,6 +228,11 @@ export default class GridManager {
return Checkbox.getCheckedData(jTool(table));
};
+ static
+ cleanData(table) {
+ return Core.cleanData(jTool(table));
+ }
+
/**
* @静态方法
* 消毁当前实例
diff --git a/src/js/Publish.js b/src/js/Publish.js
index 252858e6..3f6d70d2 100644
--- a/src/js/Publish.js
+++ b/src/js/Publish.js
@@ -113,6 +113,10 @@ class PublishMethodClass {
return GridManager.getCheckedData(table);
}
+ cleanData(table) {
+ return GridManager.cleanData(table);
+ }
+
/*
* 消毁当前实例
* */
diff --git a/test/Core_test.js b/test/Core_test.js
index db1c1110..948ccc34 100644
--- a/test/Core_test.js
+++ b/test/Core_test.js
@@ -25,7 +25,7 @@ describe('Core 验证类的属性及方法总量', function() {
});
it('Function count', function() {
// es6 中 constructor 也会算做为对象的属性, 所以总量上会增加1
- expect(getPropertyCount(Object.getOwnPropertyNames(Object.getPrototypeOf(Core)))).toBe(8 + 1);
+ expect(getPropertyCount(Object.getOwnPropertyNames(Object.getPrototypeOf(Core)))).toBe(9 + 1);
});
});
@@ -84,6 +84,13 @@ describe('Core.removeRefreshingClass($tableWrap)', function() {
});
});
+describe('Core.cleanData($table)', function() {
+ it('基础验证', function () {
+ expect(Core.cleanData).toBeDefined();
+ expect(Core.cleanData.length).toBe(1);
+ });
+});
+
describe('Core.driveDomForSuccessAfter($table, settings, response, callback)', function() {
beforeEach(function() {
// 存储console, 用于在测方式完成后原还console对象
diff --git a/test/GridManager_test.js b/test/GridManager_test.js
index 150c13c4..9bc3133e 100644
--- a/test/GridManager_test.js
+++ b/test/GridManager_test.js
@@ -6,6 +6,7 @@
'use strict';
import GridManager from '../src/js/GridManager';
import { GM_VERSION } from '../src/common/constants';
+import Core from "../src/js/Core";
/**
* 验证类的属性及方法总量
*/
@@ -150,6 +151,13 @@ describe('GridManager.getCheckedData(table)', function() {
});
});
+describe('GridManager.cleanData(table)', function() {
+ it('基础验证', function() {
+ expect(GridManager.cleanData).toBeDefined();
+ expect(GridManager.cleanData.length).toBe(1);
+ });
+});
+
describe('GridManager.destroy(table)', function() {
it('基础验证', function() {
expect(GridManager.destroy).toBeDefined();
diff --git a/test/Publish_test.js b/test/Publish_test.js
index 6f1fe0e5..69c7360a 100644
--- a/test/Publish_test.js
+++ b/test/Publish_test.js
@@ -7,6 +7,7 @@ import {PublishMethod, publishMethodArray} from '../src/js/Publish';
import testData from '../src/data/testData';
import testData2 from '../src/data/testData2';
import { GM_VERSION, GM_PUBLISH_METHOD_LIST } from '../src/common/constants';
+import GridManager from "../src/js/GridManager";
describe('publishMethodArray', function() {
it('公开方法列表', function () {
@@ -35,7 +36,7 @@ describe('Publish 验证类的属性及方法总量', function() {
});
it('Function count', function() {
// es6 中 constructor 也会算做为对象的属性, 所以总量上会增加1
- expect(getPropertyCount(Object.getOwnPropertyNames(Object.getPrototypeOf(PublishMethod)))).toBe(16 + 1);
+ expect(getPropertyCount(Object.getOwnPropertyNames(Object.getPrototypeOf(PublishMethod)))).toBe(17 + 1);
});
});
@@ -698,6 +699,13 @@ describe('PublishMethod 非init方法验证', function() {
});
+describe('PublishMethod.cleanData(table)', function() {
+ it('基础验证', function() {
+ expect(PublishMethod.cleanData).toBeDefined();
+ expect(PublishMethod.cleanData.length).toBe(1);
+ });
+});
+
describe('PublishMethod.destroy(table)', function() {
let table = null;
let arg = null;
diff --git a/version/v2.6.0.md b/version/v2.6.0.md
index 55a0317d..6e2e1cef 100644
--- a/version/v2.6.0.md
+++ b/version/v2.6.0.md
@@ -11,6 +11,7 @@
- `checkedAfter`: 选择事件执行后事件
- `checkedAllBefore`: 全选事件执行前事件
- `checkedAllAfter`: 全选事件执行后事件
+ - `cleanData(table)`: 清除当前表格数据方法
- 优化
- `requestHandler` 与 `responseHandler` 由直接修改实参优化为通过`return`进行结果返回。 1
@@ -23,6 +24,8 @@
- `ajax_success`: 传入参为请求结果
- `ajax_error`: 传入参为错误信息
- `ajax_complete`: 成功时等同于`ajax_success`, 失败时等同于`ajax_error`
+
+setAjaxData 方法会将ajax_data冲掉，不能再进行搜索数据了
ajax_data 文档更新
From f5995d29040eb4f34ac360e8851d54348cf98760 Mon Sep 17 00:00:00 2001
From: baukh789 <182209508@qq.com>
Date: Thu, 7 Jun 2018 14:27:47 +0800
Subject: [PATCH 031/982] add settings: currentPageKey and pageSizeKey
---
src/demo/demo1.html | 3 ++
src/js/AjaxPage.js | 110 +++++++++++++++++++++---------------------
src/js/Cache.js | 65 ++++++-------------------
src/js/Core.js | 11 +++--
src/js/Menu.js | 22 +++++----
src/js/Settings.js | 18 ++++---
test/AjaxPage_test.js | 29 +++++------
test/Cache_test.js | 2 +-
test/Menu_test.js | 23 +++++----
test/Settings_test.js | 8 +++
version/v2.6.0.md | 2 +
11 files changed, 140 insertions(+), 153 deletions(-)
diff --git a/src/demo/demo1.html b/src/demo/demo1.html
index 886fa300..3824cae2 100644
--- a/src/demo/demo1.html
+++ b/src/demo/demo1.html
@@ -137,6 +137,9 @@
,supportSorting: true
,isCombSorting: false
,disableCache: false
+ // TODO 用于测试中
+ ,currentPageKey: 'cPage'
+ ,pageSizeKey: 'pSize'
,ajax_data: function () {
return 'http://www.lovejavascript.com/blogManager/getBlogList';
}
diff --git a/src/js/AjaxPage.js b/src/js/AjaxPage.js
index 416d83ed..b02d9de5 100644
--- a/src/js/AjaxPage.js
+++ b/src/js/AjaxPage.js
@@ -110,8 +110,8 @@ class AjaxPage {
}
// 替换被更改的值
- settings.pageData.cPage = toPage;
- settings.pageData.pSize = settings.pageData.pSize || settings.pageSize;
+ settings.pageData[settings.currentPageKey] = toPage;
+ settings.pageData[settings.pageSizeKey] = settings.pageData[settings.pageSizeKey] || settings.pageSize;
// 更新缓存
Cache.setSettings($table, settings);
@@ -124,30 +124,6 @@ class AjaxPage {
});
}
- /**
- * 消毁
- * @param $table
- */
- destroy($table) {
- const tableWarp = $table.closest('.table-wrap');
- const pageToolbar = jTool('.page-toolbar', tableWarp);
- const gp_input = jTool('.gp-input', pageToolbar);
- const refreshAction = jTool('.refresh-action', pageToolbar);
- const sizeArea = jTool('select[name=pSizeArea]', pageToolbar);
-
- // 清理: 分页点击事件
- pageToolbar.off('click', 'li');
-
- // 清理: 快捷跳转事件
- gp_input.unbind('keyup');
-
- // 清理: 刷新界面事件
- refreshAction.unbind('click');
-
- // 清理: 设置当前页显示数事件
- sizeArea.unbind('change');
- }
-
/**
* 生成页码DOM节点
* @param $table
@@ -175,7 +151,7 @@ class AjaxPage {
*/
__joinPagination(settings, pageData) {
// 当前页
- let cPage = Number(pageData.cPage || 0);
+ let cPage = Number(pageData[settings.currentPageKey] || 0);
// 总页数
let tPage = Number(pageData.tPage || 0);
@@ -367,10 +343,9 @@ class AjaxPage {
const _tableWarp = _size.closest('.table-wrap');
const _table = jTool('table[grid-manager]', _tableWarp);
const settings = Cache.getSettings($table);
- settings.pageData = {
- cPage: 1,
- pSize: window.parseInt(_size.val())
- };
+ settings.pageData = {};
+ settings.pageData[settings.currentPageKey] = 1;
+ settings.pageData[settings.pageSizeKey] = window.parseInt(_size.val());
Cache.saveUserMemory(_table, settings);
@@ -390,11 +365,11 @@ class AjaxPage {
* 重置每页显示条数, 重置条数文字信息 [注: 这个方法只做显示更新, 不操作Cache 数据]
* @param $table
* @param settings
- * @param _pageData_ 分页数据格式
+ * @param pageData 分页数据格式
* @returns {boolean}
* @private
*/
- __resetPSize($table, settings, _pageData_) {
+ __resetPSize($table, settings, pageData) {
const tableWarp = $table.closest('.table-wrap');
const toolBar = jTool('.page-toolbar', tableWarp);
const pSizeArea = jTool('select[name="pSizeArea"]', toolBar);
@@ -404,18 +379,18 @@ class AjaxPage {
}
// 从多少开始
- const fromNum = _pageData_.cPage === 1 ? 1 : (_pageData_.cPage - 1) * _pageData_.pSize + 1;
+ const fromNum = pageData[settings.currentPageKey] === 1 ? 1 : (pageData[settings.currentPageKey] - 1) * pageData[settings.pageSizeKey] + 1;
// 到多少结束
- const toNum = _pageData_.cPage * _pageData_.pSize;
+ const toNum = pageData[settings.currentPageKey] * pageData[settings.pageSizeKey];
// 总共条数
- const totalNum = _pageData_.tSize;
+ const totalNum = pageData.tSize;
const tmpHtml = I18n.i18nText(settings, 'dataTablesInfo', [fromNum, toNum, totalNum]);
// 根据返回值修正单页条数显示值
- pSizeArea.val(_pageData_.pSize || 10);
+ pSizeArea.val(pageData[settings.pageSizeKey] || 10);
// 修改条数文字信息
pSizeInfo.html(tmpHtml);
@@ -431,22 +406,24 @@ class AjaxPage {
* @private
*/
__getPageData(settings, totals) {
- const _pSize = settings.pageData.pSize || settings.pageSize;
+ const _pSize = settings.pageData[settings.pageSizeKey] || settings.pageSize;
const _tPage = Math.ceil(totals / _pSize);
- const _cPage = settings.pageData.cPage || 1;
- return {
- // 总页数
- tPage: _tPage,
+ const _cPage = settings.pageData[settings.currentPageKey] || 1;
+ const pageData = {};
+
+ // 总页数
+ pageData['tPage'] = _tPage;
- // 当前页
- cPage: _cPage > _tPage ? 1 : _cPage,
+ // 当前页
+ pageData[settings.currentPageKey] = _cPage > _tPage ? 1 : _cPage;
+
+ // 每页显示条数
+ pageData[settings.pageSizeKey] = _pSize;
- // 每页显示条数
- pSize: _pSize,
+ // 总条路
+ pageData['tSize'] = totals;
- // 总条路
- tSize: totals
- };
+ return pageData;
}
/**
@@ -465,17 +442,40 @@ class AjaxPage {
let _pSize = null;
// 验证是否存在每页显示条数缓存数据
- if (!_cache || !_cache.page || !_cache.page.pSize) {
+ if (!_cache || !_cache.page || !_cache.page[settings.pageSizeKey]) {
_pSize = settings.pageSize || 10;
} else {
- _pSize = _cache.page.pSize;
+ _pSize = _cache.page[settings.pageSizeKey];
}
- const pageData = {
- pSize: _pSize,
- cPage: 1
- };
+ const pageData = {};
+ pageData[settings.pageSizeKey] = _pSize;
+ pageData[settings.currentPageKey] = 1;
jTool.extend(settings, {pageData: pageData});
Cache.setSettings($table, settings);
}
+
+ /**
+ * 消毁
+ * @param $table
+ */
+ destroy($table) {
+ const tableWarp = $table.closest('.table-wrap');
+ const pageToolbar = jTool('.page-toolbar', tableWarp);
+ const gp_input = jTool('.gp-input', pageToolbar);
+ const refreshAction = jTool('.refresh-action', pageToolbar);
+ const sizeArea = jTool('select[name=pSizeArea]', pageToolbar);
+
+ // 清理: 分页点击事件
+ pageToolbar.off('click', 'li');
+
+ // 清理: 快捷跳转事件
+ gp_input.unbind('keyup');
+
+ // 清理: 刷新界面事件
+ refreshAction.unbind('click');
+
+ // 清理: 设置当前页显示数事件
+ sizeArea.unbind('change');
+ }
}
export default new AjaxPage();
diff --git a/src/js/Cache.js b/src/js/Cache.js
index dbea9ab4..104597ae 100644
--- a/src/js/Cache.js
+++ b/src/js/Cache.js
@@ -122,7 +122,7 @@ class Cache {
GridManagerMemory = JSON.parse(GridManagerMemory);
// 指定删除的table, 则定点清除
- const _key = this.getMemoryKey($table);
+ const _key = this.getMemoryKey(settings);
delete GridManagerMemory[_key];
// 清除后, 重新存储
@@ -132,28 +132,10 @@ class Cache {
/**
* 获取表格的用户记忆标识码
- * @param $table
+ * @param settings
* @returns {*}
*/
- getMemoryKey($table) {
- const settings = this.getSettings($table);
- // 验证table是否有效
- if (!$table || $table.length === 0) {
- Base.outLog('getUserMemory:无效的table', 'error');
- return false;
- }
-
- // TODO baukh@20180608: no-cache已经不存在了
- // 当前表是否禁用缓存 被禁用原因是用户缺失了必要的参数
- // const noCache = $table.attr('no-cache');
- // if (noCache && noCache === 'true') {
- // Base.outLog('缓存已被禁用：当前表缺失必要html标签属性[grid-manager或th-name]', 'info');
- // return false;
- // }
- // if (!window.localStorage) {
- // Base.outLog('当前浏览器不支持：localStorage，缓存功能失效', 'info');
- // return false;
- // }
+ getMemoryKey(settings) {
return window.location.pathname + window.location.hash + '-' + settings.gridManagerName;
}
@@ -166,7 +148,7 @@ class Cache {
if (!$table || $table.length === 0) {
return {};
}
- const _key = this.getMemoryKey($table);
+ const _key = this.getMemoryKey(this.getSettings($table));
if (!_key) {
return {};
}
@@ -191,30 +173,11 @@ class Cache {
* @returns {boolean}
*/
saveUserMemory($table, settings) {
- const _this = this;
// 当前为禁用缓存模式，直接跳出
if (settings.disableCache) {
return false;
}
- // TODO baukh@20180608: 这里没有必要进行验证
- // 当前表是否存在
- // if (!$table || $table.length === 0) {
- // Base.outLog('saveUserMemory:无效的table', 'error');
- // return false;
- // }
-
- // TODO baukh@20180608: no-cache已经不存在了
- // 当前表是否禁用缓存 被禁用原因是用户缺失了必要的参数
- // const noCache = $table.attr('no-cache');
- // if (noCache && noCache === 'true') {
- // Base.outLog('缓存功能已被禁用：当前表缺失必要参数', 'info');
- // return false;
- // }
- // if (!window.localStorage) {
- // Base.outLog('当前浏览器不支持：localStorage，缓存功能失效。', 'error');
- // return false;
- // }
const thList = jTool('thead[grid-manager-thead] th', $table);
if (!thList || thList.length === 0) {
Base.outLog('saveUserMemory:无效的thList,请检查是否正确配置table,thead,th', 'error');
@@ -222,24 +185,24 @@ class Cache {
}
let _cache = {};
- let _pageCache = {};
_cache.column = settings.columnMap;
// 存储分页
if (settings.supportAjaxPage) {
- _pageCache.pSize = parseInt(jTool('select[name="pSizeArea"]', $table.closest('.table-wrap')).val(), 10);
+ const _pageCache = {};
+ _pageCache[settings.pageSizeKey] = settings.pageData[settings.pageSizeKey];
_cache.page = _pageCache;
}
- const _cacheString = JSON.stringify(_cache);
+ const cacheString = JSON.stringify(_cache);
let GridManagerMemory = window.localStorage.getItem('GridManagerMemory');
if (!GridManagerMemory) {
GridManagerMemory = {};
} else {
GridManagerMemory = JSON.parse(GridManagerMemory);
}
- GridManagerMemory[_this.getMemoryKey($table)] = _cacheString;
+ GridManagerMemory[this.getMemoryKey(settings)] = cacheString;
window.localStorage.setItem('GridManagerMemory', JSON.stringify(GridManagerMemory));
- return _cacheString;
+ return cacheString;
}
/**
@@ -253,7 +216,7 @@ class Cache {
_settings.textConfig = new TextSettings();
jTool.extend(true, _settings, arg);
- // 存储配置项
+ // 存储初始配置项
this.setSettings($table, _settings);
// 为 columnData 增加 序号列
@@ -280,7 +243,8 @@ class Cache {
_settings.columnMap[col.key].index = index;
});
- const mergeColumn = () => {
+ // 合并用户记忆至 settings, 每页显示条数记忆不在此处
+ const mergeUserMemory = () => {
// 当前为禁用状态
if (_settings.disableCache) {
return;
@@ -337,8 +301,9 @@ class Cache {
this.delUserMemory($table, '存储记忆项与配置项[columnData]不匹配');
}
};
- // 合并用户记忆至配置项
- mergeColumn();
+
+ // 合并用户记忆
+ mergeUserMemory();
// 更新存储配置项
this.setSettings($table, _settings);
diff --git a/src/js/Core.js b/src/js/Core.js
index 9e47bd8a..69f110c5 100644
--- a/src/js/Core.js
+++ b/src/js/Core.js
@@ -84,7 +84,8 @@ class Core {
// 合并分页信息至请求参
if (settings.supportAjaxPage) {
- jTool.extend(pram, settings.pageData);
+ pram[settings.currentPageKey] = settings.pageData[settings.currentPageKey];
+ pram[settings.pageSizeKey] = settings.pageData[settings.pageSizeKey];
}
// 合并排序信息至请求参
@@ -169,7 +170,7 @@ class Core {
// 渲染分页
if (settings.supportAjaxPage) {
AjaxPage.resetPageData($table, settings, 0);
- Menu.updateMenuPageStatus(settings.gridManagerName, settings.pageData);
+ Menu.updateMenuPageStatus(settings.gridManagerName, settings);
}
// this.driveDomForSuccessAfter($table, settings, response, callbakc);
@@ -209,8 +210,8 @@ class Core {
let _orderBaseNumber = 1;
// 验证是否存在分页数据
- if (_pageData && _pageData['pSize'] && _pageData['cPage']) {
- _orderBaseNumber = _pageData.pSize * (_pageData.cPage - 1) + 1;
+ if (_pageData && _pageData[settings.pageSizeKey] && _pageData[settings.currentPageKey]) {
+ _orderBaseNumber = _pageData[settings.pageSizeKey] * (_pageData[settings.currentPageKey] - 1) + 1;
}
_data = _data.map((item, index) => {
item[Order.key] = _orderBaseNumber + index;
@@ -301,7 +302,7 @@ class Core {
// 渲染分页
if (settings.supportAjaxPage) {
AjaxPage.resetPageData($table, settings, parseRes[settings.totalsKey]);
- Menu.updateMenuPageStatus(settings.gridManagerName, settings.pageData);
+ Menu.updateMenuPageStatus(settings.gridManagerName, settings);
}
typeof callback === 'function' ? callback(parseRes) : '';
diff --git a/src/js/Menu.js b/src/js/Menu.js
index 44e37840..351313c4 100644
--- a/src/js/Menu.js
+++ b/src/js/Menu.js
@@ -145,17 +145,17 @@ class Menu {
const _table = jTool(`table[grid-manager="${_gridMenu.attr(_this.keyName)}"]`);
const refreshType = this.getAttribute('refresh-type');
let settings = Cache.getSettings(_table);
- let cPage = settings.pageData.cPage;
+ let cPage = settings.pageData[settings.currentPageKey];
// 上一页
- if (refreshType === 'previous' && settings.pageData.cPage > 1) {
- cPage = settings.pageData.cPage - 1;
+ if (refreshType === 'previous' && cPage > 1) {
+ cPage = cPage - 1;
// 下一页
- } else if (refreshType === 'next' && settings.pageData.cPage < settings.pageData.tPage) {
- cPage = settings.pageData.cPage + 1;
+ } else if (refreshType === 'next' && cPage < settings.pageData.tPage) {
+ cPage = cPage + 1;
// 重新加载
} else if (refreshType === 'refresh') {
- cPage = settings.pageData.cPage;
+ cPage = cPage;
}
AjaxPage.gotoPage(_table, settings, cPage);
@@ -203,9 +203,9 @@ class Menu {
/**
* 更新菜单区域分页相关操作可用状态
* @param gridManagerName
- * @param pageData
+ * @param settings
*/
- updateMenuPageStatus(gridManagerName, pageData) {
+ updateMenuPageStatus(gridManagerName, settings) {
// 右键菜单区上下页限制
const gridMenu = jTool(`.grid-menu[${this.keyName}="${gridManagerName}"]`);
if (!gridMenu || gridMenu.length === 0) {
@@ -213,12 +213,14 @@ class Menu {
}
const previousPage = jTool('[refresh-type="previous"]', gridMenu);
const nextPage = jTool('[refresh-type="next"]', gridMenu);
- if (pageData.cPage === 1 || pageData.tPage === 0) {
+ const cPage = settings.pageData[settings.currentPageKey];
+ const tPage = settings.pageData.tPage;
+ if (cPage === 1 || tPage === 0) {
previousPage.addClass('disabled');
} else {
previousPage.removeClass('disabled');
}
- if (pageData.cPage === pageData.tPage || pageData.tPage === 0) {
+ if (cPage === tPage || tPage === 0) {
nextPage.addClass('disabled');
} else {
nextPage.removeClass('disabled');
diff --git a/src/js/Settings.js b/src/js/Settings.js
index ef499eff..519a3aaf 100644
--- a/src/js/Settings.js
+++ b/src/js/Settings.js
@@ -134,8 +134,14 @@ class Settings {
// 存储分页数据[不对外公开参数]
pageData: {},
- // 其它需要带入的参数，该参数中设置的数据会在分页或排序事件中以参数形式传递
- query: {},
+ // 返回数据中数据总条数的key键值,默认为totals
+ totalsKey: 'totals',
+
+ // 请求参数中当前页的key键值,默认为cPage
+ currentPageKey: 'cPage',
+
+ // 请求参数中每页显示条数的key健值, 默认为pSize
+ pageSizeKey: 'pSize',
// 分页事件发生前
pagingBefore: $.noop,
@@ -247,6 +253,9 @@ class Settings {
// ajax请求类型['GET', 'POST']默认GET
ajax_type: 'GET',
+ // 其它需要带入的参数，该参数中设置的数据会在分页或排序事件中以参数形式传递
+ query: {},
+
// ajax请求头信息
ajax_headers: {},
@@ -273,12 +282,9 @@ class Settings {
// 执行请求后执行程序, 通过该程序可以修改返回值格式. 仅有成功后该函数才会执行 @v2.3.14
responseHandler: response => response,
- // ajax请求返回的列表数据key键值,默认为data
+ // 返回数据中列表数据的key键值,默认为data
dataKey: 'data',
- // ajax请求返回的数据总条数key键值,默认为totals
- totalsKey: 'totals',
-
// 为空时显示的html
emptyTemplate: '
暂无数据
'
};
diff --git a/test/AjaxPage_test.js b/test/AjaxPage_test.js
index 7756ce90..09d08b0f 100644
--- a/test/AjaxPage_test.js
+++ b/test/AjaxPage_test.js
@@ -259,6 +259,9 @@ describe('AjaxPage.__getPageData(settings, totals)', function() {
var totals = null;
var pageData = null;
beforeEach(function() {
+ settings = new Settings();
+ settings.textConfig = new TextSettings();
+ settings.gridManagerName = 'test-createMenuDOM';
});
afterEach(function(){
settings = null;
@@ -273,11 +276,9 @@ describe('AjaxPage.__getPageData(settings, totals)', function() {
it('返回值-> 使用 pageData.pSize', function () {
totals = 95;
- settings = {
- pageData: {
- pSize: 20,
- cPage: 2
- }
+ settings.pageData = {
+ pSize: 20,
+ cPage: 2
};
pageData = {tPage: 5, cPage: 2, pSize: 20, tSize: 95};
expect(AjaxPage.__getPageData(settings, totals)).toEqual(pageData);
@@ -285,11 +286,9 @@ describe('AjaxPage.__getPageData(settings, totals)', function() {
it('返回值-> 使用 settings.pageSize', function () {
totals = 95;
- settings = {
- pageSize: 30,
- pageData: {
- cPage: 2
- }
+ settings.pageSize = 30;
+ settings.pageData = {
+ cPage: 2
};
pageData = {tPage: 4, cPage: 2, pSize: 30, tSize: 95};
expect(AjaxPage.__getPageData(settings, totals)).toEqual(pageData);
@@ -297,12 +296,10 @@ describe('AjaxPage.__getPageData(settings, totals)', function() {
it('返回值-> 使用 settings.pageSize 和 pageData.pSize', function () {
totals = 95;
- settings = {
- pageSize: 30,
- pageData: {
- pSize: 20,
- cPage: 2
- }
+ settings.pageSize = 30;
+ settings.pageData = {
+ pSize: 20,
+ cPage: 2
};
pageData = {tPage: 5, cPage: 2, pSize: 20, tSize: 95};
expect(AjaxPage.__getPageData(settings, totals)).toEqual(pageData);
diff --git a/test/Cache_test.js b/test/Cache_test.js
index eb602276..c20b1494 100644
--- a/test/Cache_test.js
+++ b/test/Cache_test.js
@@ -120,7 +120,7 @@ describe('Cache.delUserMemory($table, cleanText)', function() {
});
});
-describe('Cache.(getMemoryKey($table)', function() {
+describe('Cache.(getMemoryKey(settings)', function() {
it('基础验证', function(){
expect(Cache.getMemoryKey).toBeDefined();
expect(Cache.getMemoryKey.length).toBe(1);
diff --git a/test/Menu_test.js b/test/Menu_test.js
index 141bd89e..ec7a6a9d 100644
--- a/test/Menu_test.js
+++ b/test/Menu_test.js
@@ -177,9 +177,9 @@ describe('Menu.bindRightMenuEvent($table, settings)', () => {
});
});
-describe('Menu.updateMenuPageStatus(gridManagerName, pageData)', () => {
+describe('Menu.updateMenuPageStatus(gridManagerName, settings)', () => {
let menuHtml = null;
- let pageData = null;
+ let settings = null;
beforeEach(() => {
menuHtml = ``;
+ settings = new Settings();
+ settings.textConfig = new TextSettings();
+ settings.gridManagerName = 'test-createMenuDOM';
});
afterEach(() => {
document.body.innerHTML = '';
menuHtml = null;
- pageData = null;
+ settings = null;
});
it('基础验证', () => {
expect(Menu.updateMenuPageStatus).toBeDefined();
@@ -209,22 +212,22 @@ describe('Menu.updateMenuPageStatus(gridManagerName, pageData)', () => {
it('当前处于第一页', () => {
document.body.innerHTML = menuHtml;
- pageData = {
- cPage: 1,
- tPage: 3
- };
- Menu.updateMenuPageStatus('test-updateMenuPageStatus', pageData);
+ settings.pageData = {
+ cPage: 1,
+ tPage: 3
+ };
+ Menu.updateMenuPageStatus('test-updateMenuPageStatus', settings);
expect(jTool('[refresh-type="previous"]').hasClass('disabled')).toBe(true);
expect(jTool('[refresh-type="next"]').hasClass('disabled')).toBe(false);
});
it('当前处于最后一页', () => {
document.body.innerHTML = menuHtml;
- pageData = {
+ settings.pageData = {
cPage: 3,
tPage: 3
};
- Menu.updateMenuPageStatus('test-updateMenuPageStatus', pageData);
+ Menu.updateMenuPageStatus('test-updateMenuPageStatus', settings);
expect(jTool('[refresh-type="previous"]').hasClass('disabled')).toBe(false);
expect(jTool('[refresh-type="next"]').hasClass('disabled')).toBe(true);
});
diff --git a/test/Settings_test.js b/test/Settings_test.js
index 47b71333..9e1a8433 100644
--- a/test/Settings_test.js
+++ b/test/Settings_test.js
@@ -216,6 +216,14 @@ describe('Settings', function() {
expect(settings.totalsKey).toBe('totals');
});
+ it('验证属性[currentPageKey]初始值', function() {
+ expect(settings.currentPageKey).toBe('cPage');
+ });
+
+ it('验证属性[pageSizeKey]初始值', function() {
+ expect(settings.pageSizeKey).toBe('pSize');
+ });
+
it('验证属性[emptyTemplate]初始值', function() {
expect(settings.emptyTemplate).toBe('
暂无数据
');
});
diff --git a/version/v2.6.0.md b/version/v2.6.0.md
index 6e2e1cef..b86603f2 100644
--- a/version/v2.6.0.md
+++ b/version/v2.6.0.md
@@ -12,6 +12,8 @@
- `checkedAllBefore`: 全选事件执行前事件
- `checkedAllAfter`: 全选事件执行后事件
- `cleanData(table)`: 清除当前表格数据方法
+ - `currentPageKey`: ajax请求参数中当前页key键值,默认为cPage
+ - `pageSizeKey`: ajax请求参数中每页显示条数key健值, 默认为pSize
- 优化
- `requestHandler` 与 `responseHandler` 由直接修改实参优化为通过`return`进行结果返回。 1
From 447c6e97df6ceb5477f8d1b5069288b41a9e1d49 Mon Sep 17 00:00:00 2001
From: baukh789 <182209508@qq.com>
Date: Sat, 9 Jun 2018 13:13:34 +0800
Subject: [PATCH 032/982] update demo and reamde
---
src/demo/demo1.html | 6 ++++++
src/demo/demo2.html | 12 +++++++++++-
src/js/Core.js | 1 -
src/js/GridManager.js | 6 ++----
src/js/Scroll.js | 1 -
version/v2.6.0.md | 4 ++--
6 files changed, 21 insertions(+), 9 deletions(-)
diff --git a/src/demo/demo1.html b/src/demo/demo1.html
index 3824cae2..8875d039 100644
--- a/src/demo/demo1.html
+++ b/src/demo/demo1.html
@@ -67,6 +67,10 @@
margin-top: 10px;
}
.bottom-bar button{
+ margin-right: 10px;
+ }
+ .bottom-bar a{
+ font-size: 12px;
padding: 5px 20px;
margin-right: 10px;
}
@@ -123,6 +127,7 @@
-
-
-