|
@@ -1,120 +1,127 @@
|
|
|
window.checkData = []; //全选 数据池
|
|
window.checkData = []; //全选 数据池
|
|
|
-window.sort=require('../utilities/sort');//排序组件
|
|
|
|
|
|
|
+window.sort = require('../utilities/sort');//排序组件
|
|
|
window.Header = function getHeader(object) {
|
|
window.Header = function getHeader(object) {
|
|
|
let _targetDom = object.el ? document.getElementById(object.el) : document.getElementsByTagName("table")[0];//基点元素
|
|
let _targetDom = object.el ? document.getElementById(object.el) : document.getElementsByTagName("table")[0];//基点元素
|
|
|
let _columns = object.column; //列名
|
|
let _columns = object.column; //列名
|
|
|
let _fixedTop = object.fixedTop || 0; //同级浮动元素高度,使当前元素追加该元素高度浮动
|
|
let _fixedTop = object.fixedTop || 0; //同级浮动元素高度,使当前元素追加该元素高度浮动
|
|
|
- let _isCheckAllBox = object.isCheckAllBox!==false;//是否开启全选框
|
|
|
|
|
|
|
+ let _isCheckAllBox = object.isCheckAllBox !== false;//是否开启全选框
|
|
|
let _data = object.data || []; //被排序数据
|
|
let _data = object.data || []; //被排序数据
|
|
|
let _restorationColumn = object.restorationColumn || 'id'; //恢复原数据基准字段
|
|
let _restorationColumn = object.restorationColumn || 'id'; //恢复原数据基准字段
|
|
|
let _isRestorationColumnAsc = object.isRestorationColumnAsc || false; //恢复原数据基准字段的排序类型 true:asc false:desc
|
|
let _isRestorationColumnAsc = object.isRestorationColumnAsc || false; //恢复原数据基准字段的排序类型 true:asc false:desc
|
|
|
let _before = object.before;//前置元素
|
|
let _before = object.before;//前置元素
|
|
|
- let _name = "header:"+(object.name ? object.name+"." : "");//唯一名称 用于区别模块 本地存储
|
|
|
|
|
|
|
+ let _name = "header:" + (object.name ? object.name + "." : "");//唯一名称 用于区别模块 本地存储
|
|
|
let _isForbidDrag = object.isForbidDrag;
|
|
let _isForbidDrag = object.isForbidDrag;
|
|
|
|
|
|
|
|
let sortType = {}; //排序类型
|
|
let sortType = {}; //排序类型
|
|
|
let columnArr = []; //列数组
|
|
let columnArr = []; //列数组
|
|
|
|
|
|
|
|
let moveTd = {}; //移动列
|
|
let moveTd = {}; //移动列
|
|
|
- let isNested = _targetDom.getElementsByTagName("table").length>0;
|
|
|
|
|
|
|
+ let isNested = _targetDom.getElementsByTagName("table").length > 0;
|
|
|
|
|
|
|
|
let setting = "setting-column";
|
|
let setting = "setting-column";
|
|
|
let settingInfo = localStorage.getItem("settingInfo") ? JSON.parse(localStorage.getItem("settingInfo")) : {
|
|
let settingInfo = localStorage.getItem("settingInfo") ? JSON.parse(localStorage.getItem("settingInfo")) : {
|
|
|
- isCopyWrap : true
|
|
|
|
|
|
|
+ isCopyWrap: true
|
|
|
};
|
|
};
|
|
|
let keyCode = false;
|
|
let keyCode = false;
|
|
|
let settingCheck = true;
|
|
let settingCheck = true;
|
|
|
|
|
+ var beforeHeaderDom;
|
|
|
|
|
+ var headerDom;
|
|
|
|
|
|
|
|
function getTargetChildNode(dom) { //递归获取input子节点
|
|
function getTargetChildNode(dom) { //递归获取input子节点
|
|
|
- if (!dom || dom.tagName==='INPUT')return dom;
|
|
|
|
|
|
|
+ if (!dom || dom.tagName === 'INPUT') return dom;
|
|
|
return getTargetChildNode(dom.firstElementChild);
|
|
return getTargetChildNode(dom.firstElementChild);
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function createHeaderBefore() {//生成前置元素
|
|
function createHeaderBefore() {//生成前置元素
|
|
|
let tr = document.createElement("tr");
|
|
let tr = document.createElement("tr");
|
|
|
tr.className = "text-center";
|
|
tr.className = "text-center";
|
|
|
- _before.forEach(be=>{
|
|
|
|
|
|
|
+ _before.forEach(be => {
|
|
|
let th = document.createElement("th");
|
|
let th = document.createElement("th");
|
|
|
- if (be.colspan)th.colSpan = be.colspan;
|
|
|
|
|
- if (be.font){
|
|
|
|
|
|
|
+ if (be.colspan) th.colSpan = be.colspan;
|
|
|
|
|
+ if (be.font) {
|
|
|
let font = document.createElement("span");
|
|
let font = document.createElement("span");
|
|
|
font.className = be.font;
|
|
font.className = be.font;
|
|
|
th.appendChild(font);
|
|
th.appendChild(font);
|
|
|
}
|
|
}
|
|
|
- if (be.value)th.appendChild(document.createTextNode(be.value));
|
|
|
|
|
- if (be.class)th.className = be.class;
|
|
|
|
|
|
|
+ if (be.value) th.appendChild(document.createTextNode(be.value));
|
|
|
|
|
+ if (be.class) th.className = be.class;
|
|
|
tr.appendChild(th);
|
|
tr.appendChild(th);
|
|
|
});
|
|
});
|
|
|
_targetDom.insertBefore(tr, _targetDom.firstElementChild);
|
|
_targetDom.insertBefore(tr, _targetDom.firstElementChild);
|
|
|
|
|
+ beforeHeaderDom = tr;
|
|
|
}
|
|
}
|
|
|
- function appendFloat(div,cla="") {
|
|
|
|
|
|
|
+
|
|
|
|
|
+ function appendFloat(div, cla = "") {
|
|
|
div.style.overflowX = "hidden";
|
|
div.style.overflowX = "hidden";
|
|
|
- div.className="m-0 p-0";
|
|
|
|
|
|
|
+ div.className = "m-0 p-0";
|
|
|
let th = document.createElement("th");
|
|
let th = document.createElement("th");
|
|
|
- th.className = "pl-2 pr-2 header-float "+cla;
|
|
|
|
|
- th.style.top = _fixedTop+"px";
|
|
|
|
|
|
|
+ th.className = "pl-2 pr-2 header-float " + cla;
|
|
|
|
|
+ th.style.top = _fixedTop + "px";
|
|
|
th.appendChild(div);
|
|
th.appendChild(div);
|
|
|
return th;
|
|
return th;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function createHeader() {//生成表头列
|
|
function createHeader() {//生成表头列
|
|
|
let tr = document.createElement("tr");
|
|
let tr = document.createElement("tr");
|
|
|
tr.className = "text-nowrap";
|
|
tr.className = "text-nowrap";
|
|
|
let firstTr = _targetDom.getElementsByTagName("tr")[0];
|
|
let firstTr = _targetDom.getElementsByTagName("tr")[0];
|
|
|
let tds = [];
|
|
let tds = [];
|
|
|
- if (firstTr)tds = firstTr.children;
|
|
|
|
|
- if (_isCheckAllBox){//是否开启全选
|
|
|
|
|
|
|
+ if (firstTr) tds = firstTr.children;
|
|
|
|
|
+ if (_isCheckAllBox) {//是否开启全选
|
|
|
let div = document.createElement("div");
|
|
let div = document.createElement("div");
|
|
|
let check = document.createElement("input");
|
|
let check = document.createElement("input");
|
|
|
check.type = "checkbox";
|
|
check.type = "checkbox";
|
|
|
check.id = "checkAll";
|
|
check.id = "checkAll";
|
|
|
- if (firstTr)bindCheckbox(check);
|
|
|
|
|
|
|
+ if (firstTr) bindCheckbox(check);
|
|
|
div.appendChild(check);
|
|
div.appendChild(check);
|
|
|
- tr.appendChild(appendFloat(div,"text-left"));
|
|
|
|
|
|
|
+ tr.appendChild(appendFloat(div, "text-left"));
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
let i = (_isCheckAllBox && firstTr) ? 1 : 0;
|
|
let i = (_isCheckAllBox && firstTr) ? 1 : 0;
|
|
|
- for (i;i<(tds.length>0 ? tds.length : _columns.length);i++){
|
|
|
|
|
|
|
+ for (i; i < (tds.length > 0 ? tds.length : _columns.length); i++) {
|
|
|
let div = document.createElement("div");
|
|
let div = document.createElement("div");
|
|
|
let th = appendFloat(div);
|
|
let th = appendFloat(div);
|
|
|
- let column = _columns[(_isCheckAllBox && firstTr) ? i-1 : i];
|
|
|
|
|
- let wid = column ? localStorage.getItem(_name+column.name) : null;
|
|
|
|
|
- if (wid){
|
|
|
|
|
- div.style.width = wid+"px";
|
|
|
|
|
- th.style.minWidth = wid+"px";
|
|
|
|
|
|
|
+ let column = _columns[(_isCheckAllBox && firstTr) ? i - 1 : i];
|
|
|
|
|
+ let wid = column ? localStorage.getItem(_name + column.name) : null;
|
|
|
|
|
+ if (wid) {
|
|
|
|
|
+ div.style.width = wid + "px";
|
|
|
|
|
+ th.style.minWidth = wid + "px";
|
|
|
let trs = _targetDom.children;
|
|
let trs = _targetDom.children;
|
|
|
- while(trs[0] && trs[0].tagName !== 'TR')trs = trs[0].children;
|
|
|
|
|
- if (trs[0]){
|
|
|
|
|
- for (let j=0;j<trs.length;j++){
|
|
|
|
|
- if (trs[j].children[i]){
|
|
|
|
|
- trs[j].children[i].firstElementChild.style.width = wid+"px";
|
|
|
|
|
- trs[j].children[i].style.minWidth = wid+"px";
|
|
|
|
|
|
|
+ while (trs[0] && trs[0].tagName !== 'TR') trs = trs[0].children;
|
|
|
|
|
+ if (trs[0]) {
|
|
|
|
|
+ for (let j = 0; j < trs.length; j++) {
|
|
|
|
|
+ if (trs[j].children[i]) {
|
|
|
|
|
+ trs[j].children[i].firstElementChild.style.width = wid + "px";
|
|
|
|
|
+ trs[j].children[i].style.minWidth = wid + "px";
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- if (column){
|
|
|
|
|
- if (column.type === 'multi') multiColumn(div,column);
|
|
|
|
|
- else defaultColumn(div,column);
|
|
|
|
|
|
|
+ if (column) {
|
|
|
|
|
+ if (column.type === 'multi') multiColumn(div, column);
|
|
|
|
|
+ else defaultColumn(div, column);
|
|
|
}
|
|
}
|
|
|
tr.appendChild(th);
|
|
tr.appendChild(th);
|
|
|
}
|
|
}
|
|
|
bindMove(tr);
|
|
bindMove(tr);
|
|
|
- if (_targetDom.firstElementChild)_targetDom.insertBefore(tr, _targetDom.firstElementChild);
|
|
|
|
|
|
|
+ if (_targetDom.firstElementChild) _targetDom.insertBefore(tr, _targetDom.firstElementChild);
|
|
|
else _targetDom.appendChild(tr);
|
|
else _targetDom.appendChild(tr);
|
|
|
|
|
+ headerDom = tr;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- function multiColumn(th,column) { //多列样式的生成
|
|
|
|
|
- if (column.title){
|
|
|
|
|
|
|
+ function multiColumn(th, column) { //多列样式的生成
|
|
|
|
|
+ if (column.title) {
|
|
|
let div = document.createElement("div");
|
|
let div = document.createElement("div");
|
|
|
- div.className="w-100 text-center";
|
|
|
|
|
|
|
+ div.className = "w-100 text-center";
|
|
|
div.appendChild(document.createTextNode(column.title));
|
|
div.appendChild(document.createTextNode(column.title));
|
|
|
th.appendChild(div);
|
|
th.appendChild(div);
|
|
|
}
|
|
}
|
|
|
let div = document.createElement("div");
|
|
let div = document.createElement("div");
|
|
|
- div.className="row text-center";
|
|
|
|
|
- if (column.rows){
|
|
|
|
|
- column.rows.forEach(row=>{
|
|
|
|
|
|
|
+ div.className = "row text-center";
|
|
|
|
|
+ if (column.rows) {
|
|
|
|
|
+ column.rows.forEach(row => {
|
|
|
let node = document.createElement("div");
|
|
let node = document.createElement("div");
|
|
|
- node.className = "col-"+(row.col ? row.col : 1);
|
|
|
|
|
|
|
+ node.className = "col-" + (row.col ? row.col : 1);
|
|
|
node.appendChild(document.createTextNode(row.value));
|
|
node.appendChild(document.createTextNode(row.value));
|
|
|
div.appendChild(node);
|
|
div.appendChild(node);
|
|
|
});
|
|
});
|
|
@@ -122,67 +129,67 @@ window.Header = function getHeader(object) {
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- function defaultColumn(th,column) { //默认列样式的生成
|
|
|
|
|
- if (column.style)for (let key in column.style)if (column.style.hasOwnProperty(key)) th.parentElement.style[key] = column.style[key];
|
|
|
|
|
- if (column.class)th.parentElement.className += column.class;
|
|
|
|
|
|
|
+ function defaultColumn(th, column) { //默认列样式的生成
|
|
|
|
|
+ if (column.style) for (let key in column.style) if (column.style.hasOwnProperty(key)) th.parentElement.style[key] = column.style[key];
|
|
|
|
|
+ if (column.class) th.parentElement.className += column.class;
|
|
|
let span = document.createElement("span");
|
|
let span = document.createElement("span");
|
|
|
span.style.display = "inline-block";
|
|
span.style.display = "inline-block";
|
|
|
- if (!column.neglect){
|
|
|
|
|
|
|
+ if (!column.neglect) {
|
|
|
span.style.cursor = "pointer";
|
|
span.style.cursor = "pointer";
|
|
|
let font = document.createElement("span");
|
|
let font = document.createElement("span");
|
|
|
font.className = "fa fa-sort";
|
|
font.className = "fa fa-sort";
|
|
|
span.appendChild(font);
|
|
span.appendChild(font);
|
|
|
- span.onclick = rule(column,font); //绑定排序事件
|
|
|
|
|
|
|
+ span.onclick = rule(column, font); //绑定排序事件
|
|
|
}
|
|
}
|
|
|
span.appendChild(document.createTextNode((column.value ? column.value : '')));
|
|
span.appendChild(document.createTextNode((column.value ? column.value : '')));
|
|
|
th.appendChild(span);
|
|
th.appendChild(span);
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
//点击事件触发的排序规则
|
|
//点击事件触发的排序规则
|
|
|
- function rule(column,columnSort) {
|
|
|
|
|
|
|
+ function rule(column, columnSort) {
|
|
|
return function () {
|
|
return function () {
|
|
|
- if (!sortType[column.name]){
|
|
|
|
|
|
|
+ if (!sortType[column.name]) {
|
|
|
sortType[column.name] = 'asc';
|
|
sortType[column.name] = 'asc';
|
|
|
columnArr.push(column.name);
|
|
columnArr.push(column.name);
|
|
|
columnSort.className = "fa fa-sort-asc";
|
|
columnSort.className = "fa fa-sort-asc";
|
|
|
let columnArrTemp = [];
|
|
let columnArrTemp = [];
|
|
|
- columnArrTemp.push.apply(columnArrTemp,columnArr);
|
|
|
|
|
- window.sort.sort(_data,columnArrTemp,sortType);
|
|
|
|
|
- return ;
|
|
|
|
|
|
|
+ columnArrTemp.push.apply(columnArrTemp, columnArr);
|
|
|
|
|
+ window.sort.sort(_data, columnArrTemp, sortType);
|
|
|
|
|
+ return;
|
|
|
}
|
|
}
|
|
|
- if (sortType[column.name] === 'asc'){
|
|
|
|
|
|
|
+ if (sortType[column.name] === 'asc') {
|
|
|
sortType[column.name] = 'desc';
|
|
sortType[column.name] = 'desc';
|
|
|
columnSort.className = "fa fa-sort-desc";
|
|
columnSort.className = "fa fa-sort-desc";
|
|
|
let columnArrTemp = [];
|
|
let columnArrTemp = [];
|
|
|
- columnArrTemp.push.apply(columnArrTemp,columnArr);
|
|
|
|
|
- window.sort.sort(_data,columnArrTemp,sortType);
|
|
|
|
|
- return ;
|
|
|
|
|
|
|
+ columnArrTemp.push.apply(columnArrTemp, columnArr);
|
|
|
|
|
+ window.sort.sort(_data, columnArrTemp, sortType);
|
|
|
|
|
+ return;
|
|
|
}
|
|
}
|
|
|
- if (sortType[column.name] === 'desc'){
|
|
|
|
|
|
|
+ if (sortType[column.name] === 'desc') {
|
|
|
delete sortType[column.name];
|
|
delete sortType[column.name];
|
|
|
columnArr.some(function (name, index) {
|
|
columnArr.some(function (name, index) {
|
|
|
- if (name === column.name){
|
|
|
|
|
- columnArr.splice(index,1);
|
|
|
|
|
|
|
+ if (name === column.name) {
|
|
|
|
|
+ columnArr.splice(index, 1);
|
|
|
return true;
|
|
return true;
|
|
|
}
|
|
}
|
|
|
});
|
|
});
|
|
|
columnSort.className = "fa fa-sort";
|
|
columnSort.className = "fa fa-sort";
|
|
|
- if (columnArr.length === 0){
|
|
|
|
|
|
|
+ if (columnArr.length === 0) {
|
|
|
//希尔排序
|
|
//希尔排序
|
|
|
let arr = [];
|
|
let arr = [];
|
|
|
- arr.push.apply(arr,_data);
|
|
|
|
|
|
|
+ arr.push.apply(arr, _data);
|
|
|
let len = arr.length;
|
|
let len = arr.length;
|
|
|
- for(let gap = Math.floor(len / 2); gap > 0; gap = Math.floor(gap / 2)) {
|
|
|
|
|
- for(let i = gap; i < len; i++) {
|
|
|
|
|
|
|
+ for (let gap = Math.floor(len / 2); gap > 0; gap = Math.floor(gap / 2)) {
|
|
|
|
|
+ for (let i = gap; i < len; i++) {
|
|
|
let j = i;
|
|
let j = i;
|
|
|
let current = arr[i];
|
|
let current = arr[i];
|
|
|
- if (_isRestorationColumnAsc){
|
|
|
|
|
- while(j - gap >= 0 && Number(current[_restorationColumn]) < Number(arr[j - gap][_restorationColumn])) {
|
|
|
|
|
|
|
+ if (_isRestorationColumnAsc) {
|
|
|
|
|
+ while (j - gap >= 0 && Number(current[_restorationColumn]) < Number(arr[j - gap][_restorationColumn])) {
|
|
|
arr[j] = arr[j - gap];
|
|
arr[j] = arr[j - gap];
|
|
|
j = j - gap;
|
|
j = j - gap;
|
|
|
}
|
|
}
|
|
|
- }else{
|
|
|
|
|
- while(j - gap >= 0 && Number(current[_restorationColumn]) > Number(arr[j - gap][_restorationColumn])) {
|
|
|
|
|
|
|
+ } else {
|
|
|
|
|
+ while (j - gap >= 0 && Number(current[_restorationColumn]) > Number(arr[j - gap][_restorationColumn])) {
|
|
|
arr[j] = arr[j - gap];
|
|
arr[j] = arr[j - gap];
|
|
|
j = j - gap;
|
|
j = j - gap;
|
|
|
}
|
|
}
|
|
@@ -191,121 +198,132 @@ window.Header = function getHeader(object) {
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
_data.length = 0;
|
|
_data.length = 0;
|
|
|
- _data.push.apply(_data,arr);
|
|
|
|
|
|
|
+ _data.push.apply(_data, arr);
|
|
|
return;
|
|
return;
|
|
|
}
|
|
}
|
|
|
let columnArrTemp = [];
|
|
let columnArrTemp = [];
|
|
|
- columnArrTemp.push.apply(columnArrTemp,columnArr);
|
|
|
|
|
- window.sort.sort(_data,columnArrTemp,sortType);
|
|
|
|
|
|
|
+ columnArrTemp.push.apply(columnArrTemp, columnArr);
|
|
|
|
|
+ window.sort.sort(_data, columnArrTemp, sortType);
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function bindCheckbox(check) {
|
|
function bindCheckbox(check) {
|
|
|
let trs = _targetDom.children;
|
|
let trs = _targetDom.children;
|
|
|
- while(trs[0].tagName !== 'TR')trs = trs[0].children;
|
|
|
|
|
|
|
+ while (trs[0].tagName !== 'TR') trs = trs[0].children;
|
|
|
check.onchange = function () {
|
|
check.onchange = function () {
|
|
|
- if (event.target.checked){
|
|
|
|
|
- for (let i=0;i<trs.length;i++){
|
|
|
|
|
|
|
+ if (event.target.checked) {
|
|
|
|
|
+ for (let i = 0; i < trs.length; i++) {
|
|
|
let checkbox = getTargetChildNode(trs[i].children[0]);
|
|
let checkbox = getTargetChildNode(trs[i].children[0]);
|
|
|
- if (checkbox && !checkbox.checked){
|
|
|
|
|
|
|
+ if (checkbox && !checkbox.checked) {
|
|
|
checkData.push(checkbox.value);
|
|
checkData.push(checkbox.value);
|
|
|
checkbox.checked = true;
|
|
checkbox.checked = true;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- }else{
|
|
|
|
|
|
|
+ } else {
|
|
|
checkData = [];
|
|
checkData = [];
|
|
|
- for (let i=0;i<trs.length;i++){
|
|
|
|
|
|
|
+ for (let i = 0; i < trs.length; i++) {
|
|
|
let checkbox = getTargetChildNode(trs[i].children[0]);
|
|
let checkbox = getTargetChildNode(trs[i].children[0]);
|
|
|
- if (checkbox && checkbox.checked)checkbox.checked = false;
|
|
|
|
|
|
|
+ if (checkbox && checkbox.checked) checkbox.checked = false;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
- for (let i=0;i<trs.length;i++){
|
|
|
|
|
|
|
+ for (let i = 0; i < trs.length; i++) {
|
|
|
let checkbox = getTargetChildNode(trs[i].children[0]);
|
|
let checkbox = getTargetChildNode(trs[i].children[0]);
|
|
|
if (checkbox) checkbox.onchange = function () {
|
|
if (checkbox) checkbox.onchange = function () {
|
|
|
- if (event.target.checked)checkData.push(checkbox.value);
|
|
|
|
|
- else checkData.splice(checkData.indexOf(checkbox.value),1);
|
|
|
|
|
- if (checkData.length === _data.length && !check.checked)check.checked=true;
|
|
|
|
|
- if (checkData.length !== _data.length && check.checked) check.checked=false;
|
|
|
|
|
|
|
+ if (event.target.checked) checkData.push(checkbox.value);
|
|
|
|
|
+ else checkData.splice(checkData.indexOf(checkbox.value), 1);
|
|
|
|
|
+ if (checkData.length === _data.length && !check.checked) check.checked = true;
|
|
|
|
|
+ if (checkData.length !== _data.length && check.checked) check.checked = false;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function bindMove(tr) {
|
|
function bindMove(tr) {
|
|
|
- if (_isForbidDrag)return;
|
|
|
|
|
- for (let j=0;j<tr.children.length;j++){ //为首列绑定拖拽列宽事件
|
|
|
|
|
- tr.children[j].onmousedown = function (){
|
|
|
|
|
- if (j===0 && event.offsetX<10)return;
|
|
|
|
|
- if(event.offsetX<10)moveTd = {oldX:event.clientX,dom:tr.children[j-1],index:j-1};
|
|
|
|
|
- if (event.offsetX > tr.children[j].offsetWidth-10)moveTd = {oldX:event.clientX,dom:tr.children[j],index:j};
|
|
|
|
|
|
|
+ if (_isForbidDrag) return;
|
|
|
|
|
+ for (let j = 0; j < tr.children.length; j++) { //为首列绑定拖拽列宽事件
|
|
|
|
|
+ tr.children[j].onmousedown = function () {
|
|
|
|
|
+ if (j === 0 && event.offsetX < 10) return;
|
|
|
|
|
+ if (event.offsetX < 10) moveTd = {oldX: event.clientX, dom: tr.children[j - 1], index: j - 1};
|
|
|
|
|
+ if (event.offsetX > tr.children[j].offsetWidth - 10) moveTd = {
|
|
|
|
|
+ oldX: event.clientX,
|
|
|
|
|
+ dom: tr.children[j],
|
|
|
|
|
+ index: j
|
|
|
|
|
+ };
|
|
|
};
|
|
};
|
|
|
tr.children[j].onmousemove = function () {
|
|
tr.children[j].onmousemove = function () {
|
|
|
- if (j===0 && event.offsetX<10)return;
|
|
|
|
|
- if(event.offsetX<10 || event.offsetX > tr.children[j].offsetWidth-10)
|
|
|
|
|
|
|
+ if (j === 0 && event.offsetX < 10) return;
|
|
|
|
|
+ if (event.offsetX < 10 || event.offsetX > tr.children[j].offsetWidth - 10)
|
|
|
this.style.cursor = 'w-resize';
|
|
this.style.cursor = 'w-resize';
|
|
|
else this.style.cursor = 'default';
|
|
else this.style.cursor = 'default';
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- document.onmouseup = function (){ //全局监听拖拽列宽的发生 作用域设为全局是为了防抖动
|
|
|
|
|
- if (moveTd.oldX){
|
|
|
|
|
|
|
+ document.onmouseup = function () { //全局监听拖拽列宽的发生 作用域设为全局是为了防抖动
|
|
|
|
|
+ if (moveTd.oldX) {
|
|
|
event.stopPropagation();
|
|
event.stopPropagation();
|
|
|
moveTd.dom.style.cursor = 'default';
|
|
moveTd.dom.style.cursor = 'default';
|
|
|
moveTd.oldX = undefined;
|
|
moveTd.oldX = undefined;
|
|
|
setTimeout(function () {
|
|
setTimeout(function () {
|
|
|
- let column = _columns[(_isCheckAllBox && _targetDom.firstElementChild) ? moveTd.index-1 : moveTd.index];
|
|
|
|
|
- if (column) localStorage.setItem(_name+column.name, moveTd.dom.offsetWidth);
|
|
|
|
|
|
|
+ let column = _columns[(_isCheckAllBox && _targetDom.firstElementChild) ? moveTd.index - 1 : moveTd.index];
|
|
|
|
|
+ if (column) localStorage.setItem(_name + column.name, moveTd.dom.offsetWidth);
|
|
|
});
|
|
});
|
|
|
}
|
|
}
|
|
|
}; //移动时调整表头与表身的列宽
|
|
}; //移动时调整表头与表身的列宽
|
|
|
- document.onmousemove = function(){
|
|
|
|
|
- if (moveTd.oldX){
|
|
|
|
|
|
|
+ document.onmousemove = function () {
|
|
|
|
|
+ if (moveTd.oldX) {
|
|
|
event.stopPropagation();
|
|
event.stopPropagation();
|
|
|
- let diff = event.clientX-moveTd.oldX;
|
|
|
|
|
- let newWidth = moveTd.dom.firstElementChild.offsetWidth+diff+"px";
|
|
|
|
|
- if (diff!==0){
|
|
|
|
|
|
|
+ let diff = event.clientX - moveTd.oldX;
|
|
|
|
|
+ let newWidth = moveTd.dom.firstElementChild.offsetWidth + diff + "px";
|
|
|
|
|
+ if (diff !== 0) {
|
|
|
let trs = _targetDom.getElementsByTagName("tr");
|
|
let trs = _targetDom.getElementsByTagName("tr");
|
|
|
- for (let j=(_before ? 1 : 0);j<trs.length;j++){
|
|
|
|
|
- if (isNested){
|
|
|
|
|
|
|
+ for (let j = (_before ? 1 : 0); j < trs.length; j++) {
|
|
|
|
|
+ if (isNested) {
|
|
|
let table = trs[j].parentElement;
|
|
let table = trs[j].parentElement;
|
|
|
- while (table.tagName!=='TABLE') table = table.parentElement;
|
|
|
|
|
- if (table.id!==object.el)continue;
|
|
|
|
|
|
|
+ while (table.tagName !== 'TABLE') table = table.parentElement;
|
|
|
|
|
+ if (table.id !== object.el) continue;
|
|
|
}
|
|
}
|
|
|
- if (trs[j].children[moveTd.index]){
|
|
|
|
|
|
|
+ if (trs[j].children[moveTd.index]) {
|
|
|
trs[j].children[moveTd.index].firstElementChild.style.width = newWidth;
|
|
trs[j].children[moveTd.index].firstElementChild.style.width = newWidth;
|
|
|
trs[j].children[moveTd.index].style.minWidth = newWidth;
|
|
trs[j].children[moveTd.index].style.minWidth = newWidth;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- _targetDom.style.width = _targetDom.offsetWidth+diff+"px";
|
|
|
|
|
|
|
+ _targetDom.style.width = _targetDom.offsetWidth + diff + "px";
|
|
|
moveTd.oldX = event.clientX;
|
|
moveTd.oldX = event.clientX;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function repaintDom() {
|
|
function repaintDom() {
|
|
|
let trs = _targetDom.getElementsByTagName("tr");
|
|
let trs = _targetDom.getElementsByTagName("tr");
|
|
|
- for (let i=0;i<trs.length;i++){
|
|
|
|
|
- if (isNested){
|
|
|
|
|
|
|
+ for (let i = 0; i < trs.length; i++) {
|
|
|
|
|
+ if (isNested) {
|
|
|
let table = trs[i].parentElement;
|
|
let table = trs[i].parentElement;
|
|
|
- while (table.tagName!=='TABLE') table = table.parentElement;
|
|
|
|
|
- if (table.id!==object.el)continue;
|
|
|
|
|
|
|
+ while (table.tagName !== 'TABLE') table = table.parentElement;
|
|
|
|
|
+ if (table.id !== object.el) continue;
|
|
|
}
|
|
}
|
|
|
let tds = trs[i].children;
|
|
let tds = trs[i].children;
|
|
|
- for (let j=0;j<tds.length;j++){
|
|
|
|
|
|
|
+ for (let j = 0; j < tds.length; j++) {
|
|
|
let count = tds[j].children.length;
|
|
let count = tds[j].children.length;
|
|
|
let div = document.createElement("div");
|
|
let div = document.createElement("div");
|
|
|
div.style.overflowX = "hidden";
|
|
div.style.overflowX = "hidden";
|
|
|
- for (let k=0;k<count;k++){div.appendChild(tds[j].children[0]);}
|
|
|
|
|
|
|
+ for (let k = 0; k < count; k++) {
|
|
|
|
|
+ div.appendChild(tds[j].children[0]);
|
|
|
|
|
+ }
|
|
|
tds[j].appendChild(div);
|
|
tds[j].appendChild(div);
|
|
|
tds[j].className += " pl-2 pr-2";
|
|
tds[j].className += " pl-2 pr-2";
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function showSetting(type) {
|
|
function showSetting(type) {
|
|
|
- return function (){
|
|
|
|
|
|
|
+ return function () {
|
|
|
let type2 = type === "setting-1" ? "setting-2" : "setting-1";
|
|
let type2 = type === "setting-1" ? "setting-2" : "setting-1";
|
|
|
document.getElementById(type2).style.display = "";
|
|
document.getElementById(type2).style.display = "";
|
|
|
document.getElementById(type).style.display = "none";
|
|
document.getElementById(type).style.display = "none";
|
|
|
};
|
|
};
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function _createSetting1() {
|
|
function _createSetting1() {
|
|
|
/*
|
|
/*
|
|
|
* <div id="setting-1" onclick="tt()" style="position: fixed;bottom: 0;left: 0;background-color: #1b1e21;width: 50px;height: 50px;cursor: pointer;text-align: center;border-radius: 3px">
|
|
* <div id="setting-1" onclick="tt()" style="position: fixed;bottom: 0;left: 0;background-color: #1b1e21;width: 50px;height: 50px;cursor: pointer;text-align: center;border-radius: 3px">
|
|
@@ -332,7 +350,8 @@ window.Header = function getHeader(object) {
|
|
|
div.appendChild(h1);
|
|
div.appendChild(h1);
|
|
|
document.body.appendChild(div);
|
|
document.body.appendChild(div);
|
|
|
}
|
|
}
|
|
|
- function _createSettingHeader(text,id) {
|
|
|
|
|
|
|
+
|
|
|
|
|
+ function _createSettingHeader(text, id) {
|
|
|
let div = document.createElement("div");
|
|
let div = document.createElement("div");
|
|
|
div.style.width = "5%";
|
|
div.style.width = "5%";
|
|
|
div.style.display = "inline-block";
|
|
div.style.display = "inline-block";
|
|
@@ -342,91 +361,95 @@ window.Header = function getHeader(object) {
|
|
|
div.innerText = text;
|
|
div.innerText = text;
|
|
|
div.id = id;
|
|
div.id = id;
|
|
|
div.onclick = function () {
|
|
div.onclick = function () {
|
|
|
- if (event.target.id===setting)return;
|
|
|
|
|
|
|
+ if (event.target.id === setting) return;
|
|
|
let old = document.getElementById(setting);
|
|
let old = document.getElementById(setting);
|
|
|
old.style.backgroundColor = "";
|
|
old.style.backgroundColor = "";
|
|
|
old.style.color = "";
|
|
old.style.color = "";
|
|
|
- document.getElementById(setting+"-body").style.display = "none";
|
|
|
|
|
- event.target.style.backgroundColor ="#3490dc";
|
|
|
|
|
- event.target.style.color ="white";
|
|
|
|
|
- document.getElementById(event.target.id+"-body").style.display = "";
|
|
|
|
|
|
|
+ document.getElementById(setting + "-body").style.display = "none";
|
|
|
|
|
+ event.target.style.backgroundColor = "#3490dc";
|
|
|
|
|
+ event.target.style.color = "white";
|
|
|
|
|
+ document.getElementById(event.target.id + "-body").style.display = "";
|
|
|
setting = event.target.id;
|
|
setting = event.target.id;
|
|
|
};
|
|
};
|
|
|
return div;
|
|
return div;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function bindColumnEvent() {
|
|
function bindColumnEvent() {
|
|
|
- return function(){
|
|
|
|
|
- let storage = localStorage.getItem("column:"+object.name);
|
|
|
|
|
|
|
+ return function () {
|
|
|
|
|
+ let storage = localStorage.getItem("column:" + object.name);
|
|
|
let arr = storage ? storage.split(',') : [];
|
|
let arr = storage ? storage.split(',') : [];
|
|
|
- localStorage.setItem("column:"+object.name,_exeHid(arr).toString());
|
|
|
|
|
|
|
+ localStorage.setItem("column:" + object.name, _exeHid(arr).toString());
|
|
|
};
|
|
};
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function _exeHid(arr) {
|
|
function _exeHid(arr) {
|
|
|
let nodes = document.getElementById("setting-column-body").getElementsByTagName("input");
|
|
let nodes = document.getElementById("setting-column-body").getElementsByTagName("input");
|
|
|
let show = [];
|
|
let show = [];
|
|
|
let hid = [];
|
|
let hid = [];
|
|
|
let newArr = [];
|
|
let newArr = [];
|
|
|
- for (let i=0;i<nodes.length;i++){
|
|
|
|
|
|
|
+ for (let i = 0; i < nodes.length; i++) {
|
|
|
let value = nodes[i].value;
|
|
let value = nodes[i].value;
|
|
|
let index = nodes[i].dataset.index;
|
|
let index = nodes[i].dataset.index;
|
|
|
let checked = nodes[i].checked;
|
|
let checked = nodes[i].checked;
|
|
|
- if (checked && arr.indexOf(value)!==-1) show.push(index);
|
|
|
|
|
- if (!checked){
|
|
|
|
|
|
|
+ if (checked && arr.indexOf(value) !== -1) show.push(index);
|
|
|
|
|
+ if (!checked) {
|
|
|
newArr.push(value);
|
|
newArr.push(value);
|
|
|
- if (arr.indexOf(value)===-1)hid.push(index);
|
|
|
|
|
|
|
+ if (arr.indexOf(value) === -1) hid.push(index);
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
let trs = _targetDom.getElementsByTagName("tr"); //所有行
|
|
let trs = _targetDom.getElementsByTagName("tr"); //所有行
|
|
|
let total = trs[_before ? 1 : 0].children.length; //最大列
|
|
let total = trs[_before ? 1 : 0].children.length; //最大列
|
|
|
- for (let i=0;i<trs.length;i++){
|
|
|
|
|
- if (isNested){ //排除表格嵌套
|
|
|
|
|
|
|
+ for (let i = 0; i < trs.length; i++) {
|
|
|
|
|
+ if (isNested) { //排除表格嵌套
|
|
|
let table = trs[i].parentElement;
|
|
let table = trs[i].parentElement;
|
|
|
- while (table.tagName!=='TABLE') table = table.parentElement;
|
|
|
|
|
- if (table.id!==object.el)continue;
|
|
|
|
|
|
|
+ while (table.tagName !== 'TABLE') table = table.parentElement;
|
|
|
|
|
+ if (table.id !== object.el) continue;
|
|
|
}
|
|
}
|
|
|
- if (total!==trs[i].children.length){ //存在合并行/列
|
|
|
|
|
|
|
+ if (total !== trs[i].children.length) { //存在合并行/列
|
|
|
let pointer = [];//建立一个指针数组 用于存储下标指向真实element
|
|
let pointer = [];//建立一个指针数组 用于存储下标指向真实element
|
|
|
- for (let j=0;j<trs[i].children.length;j++){
|
|
|
|
|
- if (trs[i].children[j] && trs[i].children[j].colSpan>1){
|
|
|
|
|
- for (let k=0;k<trs[i].children[j].colSpan;k++)pointer.push(j);
|
|
|
|
|
- }else pointer.push(j);
|
|
|
|
|
|
|
+ for (let j = 0; j < trs[i].children.length; j++) {
|
|
|
|
|
+ if (trs[i].children[j] && trs[i].children[j].colSpan > 1) {
|
|
|
|
|
+ for (let k = 0; k < trs[i].children[j].colSpan; k++) pointer.push(j);
|
|
|
|
|
+ } else pointer.push(j);
|
|
|
}
|
|
}
|
|
|
- for (let j=0;j<show.length;j++)showOrHiddenDom(trs[i].children[pointer[show[j]]]);
|
|
|
|
|
- for (let j=0;j<hid.length;j++)showOrHiddenDom(trs[i].children[pointer[hid[j]]],"hid");
|
|
|
|
|
- }else {
|
|
|
|
|
- for (let j=0;j<show.length;j++)showOrHiddenDom(trs[i].children[show[j]]);
|
|
|
|
|
- for (let j=0;j<hid.length;j++)showOrHiddenDom(trs[i].children[hid[j]],"hid");
|
|
|
|
|
|
|
+ for (let j = 0; j < show.length; j++) showOrHiddenDom(trs[i].children[pointer[show[j]]]);
|
|
|
|
|
+ for (let j = 0; j < hid.length; j++) showOrHiddenDom(trs[i].children[pointer[hid[j]]], "hid");
|
|
|
|
|
+ } else {
|
|
|
|
|
+ for (let j = 0; j < show.length; j++) showOrHiddenDom(trs[i].children[show[j]]);
|
|
|
|
|
+ for (let j = 0; j < hid.length; j++) showOrHiddenDom(trs[i].children[hid[j]], "hid");
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
return newArr;
|
|
return newArr;
|
|
|
}
|
|
}
|
|
|
- function showOrHiddenDom(dom,type="show") {
|
|
|
|
|
- if (!dom)return;
|
|
|
|
|
- if (type==="show"){
|
|
|
|
|
- if (dom.colSpan>1)dom.colSpan++;
|
|
|
|
|
|
|
+
|
|
|
|
|
+ function showOrHiddenDom(dom, type = "show") {
|
|
|
|
|
+ if (!dom) return;
|
|
|
|
|
+ if (type === "show") {
|
|
|
|
|
+ if (dom.colSpan > 1) dom.colSpan++;
|
|
|
else dom.style.display = "";
|
|
else dom.style.display = "";
|
|
|
- }else{
|
|
|
|
|
- if (dom.colSpan>1)dom.colSpan--;
|
|
|
|
|
|
|
+ } else {
|
|
|
|
|
+ if (dom.colSpan > 1) dom.colSpan--;
|
|
|
else dom.style.display = "none";
|
|
else dom.style.display = "none";
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function appendCheckboxList(div) {
|
|
function appendCheckboxList(div) {
|
|
|
- let storage = localStorage.getItem("column:"+object.name);
|
|
|
|
|
|
|
+ let storage = localStorage.getItem("column:" + object.name);
|
|
|
let arr = storage ? storage.split(',') : [];
|
|
let arr = storage ? storage.split(',') : [];
|
|
|
- _columns.forEach(function (column,index) {
|
|
|
|
|
- let key = "setting-column-"+column.name;
|
|
|
|
|
|
|
+ _columns.forEach(function (column, index) {
|
|
|
|
|
+ let key = "setting-column-" + column.name;
|
|
|
let label = document.createElement("label");
|
|
let label = document.createElement("label");
|
|
|
label.style.float = "left";
|
|
label.style.float = "left";
|
|
|
let input = document.createElement("input");
|
|
let input = document.createElement("input");
|
|
|
- input.type="checkbox";
|
|
|
|
|
- input.id=key;
|
|
|
|
|
|
|
+ input.type = "checkbox";
|
|
|
|
|
+ input.id = key;
|
|
|
input.className = "fixed-checkbox";
|
|
input.className = "fixed-checkbox";
|
|
|
- input.dataset.index = _isCheckAllBox ? index+1 : index;
|
|
|
|
|
|
|
+ input.dataset.index = _isCheckAllBox ? index + 1 : index;
|
|
|
input.value = column.name;
|
|
input.value = column.name;
|
|
|
- if (arr.indexOf(column.name)===-1)input.checked = true;
|
|
|
|
|
|
|
+ if (arr.indexOf(column.name) === -1) input.checked = true;
|
|
|
label.appendChild(input);
|
|
label.appendChild(input);
|
|
|
let la = document.createElement("label");
|
|
let la = document.createElement("label");
|
|
|
- la.setAttribute("for",key);
|
|
|
|
|
|
|
+ la.setAttribute("for", key);
|
|
|
label.appendChild(la);
|
|
label.appendChild(la);
|
|
|
label.appendChild(document.createTextNode(column.type ? column.title : column.value));
|
|
label.appendChild(document.createTextNode(column.type ? column.title : column.value));
|
|
|
let prentLabel = document.createElement("label");
|
|
let prentLabel = document.createElement("label");
|
|
@@ -435,29 +458,33 @@ window.Header = function getHeader(object) {
|
|
|
div.appendChild(prentLabel);
|
|
div.appendChild(prentLabel);
|
|
|
});
|
|
});
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function bindClearEvent(need) {
|
|
function bindClearEvent(need) {
|
|
|
- return function() {
|
|
|
|
|
|
|
+ return function () {
|
|
|
for (let i = 0; i < localStorage.length; i++) {
|
|
for (let i = 0; i < localStorage.length; i++) {
|
|
|
let key = localStorage.key(i);
|
|
let key = localStorage.key(i);
|
|
|
- if (need === key.substring(0,need.length))localStorage.removeItem(key);
|
|
|
|
|
|
|
+ if (need === key.substring(0, need.length)) localStorage.removeItem(key);
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function bindCheckAllEvent() {
|
|
function bindCheckAllEvent() {
|
|
|
return function () {
|
|
return function () {
|
|
|
settingCheck = !settingCheck;
|
|
settingCheck = !settingCheck;
|
|
|
let nodes = document.getElementById("setting-column-body").getElementsByTagName("input");
|
|
let nodes = document.getElementById("setting-column-body").getElementsByTagName("input");
|
|
|
- for (let i=0;i<nodes.length;i++){
|
|
|
|
|
- if (nodes[i].checked!==settingCheck) nodes[i].checked=settingCheck;
|
|
|
|
|
|
|
+ for (let i = 0; i < nodes.length; i++) {
|
|
|
|
|
+ if (nodes[i].checked !== settingCheck) nodes[i].checked = settingCheck;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function bindReverseEvent() {
|
|
function bindReverseEvent() {
|
|
|
return function () {
|
|
return function () {
|
|
|
let nodes = document.getElementById("setting-column-body").getElementsByTagName("input");
|
|
let nodes = document.getElementById("setting-column-body").getElementsByTagName("input");
|
|
|
- for (let i=0;i<nodes.length;i++)nodes[i].checked=!nodes[i].checked;
|
|
|
|
|
|
|
+ for (let i = 0; i < nodes.length; i++) nodes[i].checked = !nodes[i].checked;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function _createSetting2() {
|
|
function _createSetting2() {
|
|
|
/*
|
|
/*
|
|
|
* <div id="setting-2" style="background-color: white;position: fixed;bottom: 0;left: 0;width: 100%;display: none">
|
|
* <div id="setting-2" style="background-color: white;position: fixed;bottom: 0;left: 0;width: 100%;display: none">
|
|
@@ -509,17 +536,17 @@ window.Header = function getHeader(object) {
|
|
|
span.onclick = showSetting("setting-2");
|
|
span.onclick = showSetting("setting-2");
|
|
|
div11.appendChild(span);
|
|
div11.appendChild(span);
|
|
|
div1.appendChild(div11);
|
|
div1.appendChild(div11);
|
|
|
- let div12 = _createSettingHeader("显示列","setting-column");
|
|
|
|
|
|
|
+ let div12 = _createSettingHeader("显示列", "setting-column");
|
|
|
div12.style.backgroundColor = "#3490dc";
|
|
div12.style.backgroundColor = "#3490dc";
|
|
|
div12.style.color = "white";
|
|
div12.style.color = "white";
|
|
|
div1.appendChild(div12);
|
|
div1.appendChild(div12);
|
|
|
- div1.appendChild(_createSettingHeader("表头设置","setting-header"));
|
|
|
|
|
|
|
+ div1.appendChild(_createSettingHeader("表头设置", "setting-header"));
|
|
|
let b = document.createElement("b");
|
|
let b = document.createElement("b");
|
|
|
- b.style.float="right";
|
|
|
|
|
- b.style.marginRight="10px";
|
|
|
|
|
- b.style.cursor="pointer";
|
|
|
|
|
- b.style.fontSize="18px";
|
|
|
|
|
- b.innerHTML="×";
|
|
|
|
|
|
|
+ b.style.float = "right";
|
|
|
|
|
+ b.style.marginRight = "10px";
|
|
|
|
|
+ b.style.cursor = "pointer";
|
|
|
|
|
+ b.style.fontSize = "18px";
|
|
|
|
|
+ b.innerHTML = "×";
|
|
|
b.onclick = showSetting("setting-2");
|
|
b.onclick = showSetting("setting-2");
|
|
|
div1.appendChild(b);
|
|
div1.appendChild(b);
|
|
|
div.appendChild(div1);
|
|
div.appendChild(div1);
|
|
@@ -534,7 +561,7 @@ window.Header = function getHeader(object) {
|
|
|
let btn = document.createElement("button");
|
|
let btn = document.createElement("button");
|
|
|
btn.className = "btn btn-sm btn-success";
|
|
btn.className = "btn btn-sm btn-success";
|
|
|
btn.type = "button";
|
|
btn.type = "button";
|
|
|
- btn.innerText="保存设置";
|
|
|
|
|
|
|
+ btn.innerText = "保存设置";
|
|
|
btn.onclick = bindColumnEvent();
|
|
btn.onclick = bindColumnEvent();
|
|
|
let div211 = document.createElement("div");
|
|
let div211 = document.createElement("div");
|
|
|
div211.appendChild(btn);
|
|
div211.appendChild(btn);
|
|
@@ -554,7 +581,7 @@ window.Header = function getHeader(object) {
|
|
|
div2.appendChild(div21);
|
|
div2.appendChild(div21);
|
|
|
let div22 = document.createElement("div");
|
|
let div22 = document.createElement("div");
|
|
|
div22.id = "setting-header-body";
|
|
div22.id = "setting-header-body";
|
|
|
- div22.style.display="none";
|
|
|
|
|
|
|
+ div22.style.display = "none";
|
|
|
let div221 = document.createElement("div");
|
|
let div221 = document.createElement("div");
|
|
|
div221.className = "row mt-2";
|
|
div221.className = "row mt-2";
|
|
|
let text = document.createElement("label");
|
|
let text = document.createElement("label");
|
|
@@ -581,9 +608,9 @@ window.Header = function getHeader(object) {
|
|
|
input.type = "checkbox";
|
|
input.type = "checkbox";
|
|
|
input.className = "switch";
|
|
input.className = "switch";
|
|
|
input.checked = settingInfo.isCopyNoWrap;
|
|
input.checked = settingInfo.isCopyNoWrap;
|
|
|
- input.onchange = function(){
|
|
|
|
|
|
|
+ input.onchange = function () {
|
|
|
settingInfo.isCopyNoWrap = event.target.checked;
|
|
settingInfo.isCopyNoWrap = event.target.checked;
|
|
|
- localStorage.setItem("settingInfo",JSON.stringify(settingInfo));
|
|
|
|
|
|
|
+ localStorage.setItem("settingInfo", JSON.stringify(settingInfo));
|
|
|
};
|
|
};
|
|
|
let div223 = document.createElement("div");
|
|
let div223 = document.createElement("div");
|
|
|
div223.className = "row";
|
|
div223.className = "row";
|
|
@@ -594,9 +621,9 @@ window.Header = function getHeader(object) {
|
|
|
let btn3 = document.createElement("button");
|
|
let btn3 = document.createElement("button");
|
|
|
btn3.className = "btn btn-sm btn-outline-info";
|
|
btn3.className = "btn btn-sm btn-outline-info";
|
|
|
btn3.innerText = "打开消息面板";
|
|
btn3.innerText = "打开消息面板";
|
|
|
- btn3.onclick= function (){
|
|
|
|
|
|
|
+ btn3.onclick = function () {
|
|
|
let height = window.screen.height;
|
|
let height = window.screen.height;
|
|
|
- window.open ("https://"+window.location.host+"/notification/regular", 'newwindow', 'height='+(height*0.7)+', width=510 ,top='+(height*0.10)+
|
|
|
|
|
|
|
+ window.open("https://" + window.location.host + "/notification/regular", 'newwindow', 'height=' + (height * 0.7) + ', width=510 ,top=' + (height * 0.10) +
|
|
|
'toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no');
|
|
'toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no');
|
|
|
};
|
|
};
|
|
|
div223.appendChild(btn3);
|
|
div223.appendChild(btn3);
|
|
@@ -609,31 +636,46 @@ window.Header = function getHeader(object) {
|
|
|
div.appendChild(div2);
|
|
div.appendChild(div2);
|
|
|
document.body.appendChild(div);
|
|
document.body.appendChild(div);
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function createSetting() {
|
|
function createSetting() {
|
|
|
_createSetting1();
|
|
_createSetting1();
|
|
|
_createSetting2();
|
|
_createSetting2();
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
function bindGlobalEvent() {
|
|
function bindGlobalEvent() {
|
|
|
document.onkeydown = (e) => {
|
|
document.onkeydown = (e) => {
|
|
|
- if (e.ctrlKey && e.keyCode===67)keyCode = true;
|
|
|
|
|
|
|
+ if (e.ctrlKey && e.keyCode === 67) keyCode = true;
|
|
|
};
|
|
};
|
|
|
- document.oncopy = (e)=>{
|
|
|
|
|
- if (keyCode && settingInfo.isCopyNoWrap){
|
|
|
|
|
|
|
+ document.oncopy = (e) => {
|
|
|
|
|
+ if (keyCode && settingInfo.isCopyNoWrap) {
|
|
|
e.preventDefault();
|
|
e.preventDefault();
|
|
|
let content = window.getSelection().toString();
|
|
let content = window.getSelection().toString();
|
|
|
- e.clipboardData.setData("text", content.replace(/[\n\r]/g,' '));
|
|
|
|
|
|
|
+ e.clipboardData.setData("text", content.replace(/[\n\r]/g, ' '));
|
|
|
keyCode = false;
|
|
keyCode = false;
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
//初始化
|
|
//初始化
|
|
|
- this.init = function() {
|
|
|
|
|
- if (!_isForbidDrag)repaintDom();
|
|
|
|
|
|
|
+ this.init = function () {
|
|
|
|
|
+ if (!_isForbidDrag) repaintDom();
|
|
|
createHeader();
|
|
createHeader();
|
|
|
- if (_before)createHeaderBefore();
|
|
|
|
|
|
|
+ if (_before) createHeaderBefore();
|
|
|
createSetting();
|
|
createSetting();
|
|
|
_exeHid([]);
|
|
_exeHid([]);
|
|
|
bindGlobalEvent();
|
|
bindGlobalEvent();
|
|
|
- _targetDom.style.width = _targetDom.offsetWidth+"px";
|
|
|
|
|
|
|
+ _targetDom.style.width = _targetDom.offsetWidth + "px";
|
|
|
};
|
|
};
|
|
|
|
|
+
|
|
|
|
|
+ this.redrawHeader = function(column) {
|
|
|
|
|
+ _columns = column;
|
|
|
|
|
+ if (beforeHeaderDom) {
|
|
|
|
|
+ _targetDom.removeChild(beforeHeaderDom);
|
|
|
|
|
+ }
|
|
|
|
|
+ if (headerDom) {
|
|
|
|
|
+ _targetDom.removeChild(headerDom);
|
|
|
|
|
+ }
|
|
|
|
|
+ createHeader();
|
|
|
|
|
+ if (_before) createHeaderBefore();
|
|
|
|
|
+ }
|
|
|
};
|
|
};
|