diff --git a/lib/ui/css/grid.scss b/lib/ui/css/grid.scss index 0873d04..ff3d42f 100644 --- a/lib/ui/css/grid.scss +++ b/lib/ui/css/grid.scss @@ -127,9 +127,9 @@ } >svg { - width: 14px; - min-width: 14px; - height: 14px; + width: 12px; + min-width: 12px; + height: 12px; margin-left: 4px; fill: var(--split-border-color); } @@ -421,10 +421,10 @@ overflow: hidden; text-overflow: ellipsis; white-space: pre; + } - &.wrap { - @include wrap(); - } + &.wrap>span { + @include wrap(); } } diff --git a/lib/ui/dropdown.js b/lib/ui/dropdown.js index 8bd72a2..78df616 100644 --- a/lib/ui/dropdown.js +++ b/lib/ui/dropdown.js @@ -321,11 +321,17 @@ export class Dropdown { this._var.label.innerText = text; } if (expanded) { - const val = selected.replace(/"/g, '\\"'); - const li = this._var.container.querySelector(`li[data-value="${val}"]`); - if (li != null) { - li.classList.add('selected'); + for (let li of this._var.container.querySelectorAll('li[data-value]')) { + if (li.dataset.value === selected) { + li.classList.add('selected'); + break; + } } + // const val = selected.replace(/"/g, '\\"'); + // const li = this._var.container.querySelector(`li[data-value="${val}"]`); + // if (li != null) { + // li.classList.add('selected'); + // } } } this._var.selected = item; diff --git a/lib/ui/grid/column.js b/lib/ui/grid/column.js index cc316cd..be85078 100644 --- a/lib/ui/grid/column.js +++ b/lib/ui/grid/column.js @@ -140,6 +140,7 @@ export class GridColumn { * 设置单元格可用性时调用的方法 * @param {HTMLElement} element - 单元格元素 * @param {boolean} enabled - 启用值，为 `false` 时代表禁用 + * @param {boolean} editing - 是否处于编辑状态 * @virtual */ static setEnabled(element, enabled) { @@ -190,6 +191,9 @@ export class GridColumn { } if (hasValue) { val.Value = value; + if (Object.prototype.hasOwnProperty.call(val, 'DisplayValue')) { + val.DisplayValue = value; + } } else { wrapper.values[key] = value; } @@ -478,7 +482,10 @@ export class GridDropdownColumn extends GridColumn { * @returns {any} */ static getValue(e, col) { - return e[col.dropOptions?.valueKey ?? 'value']; + return { + value: e[col.dropOptions?.valueKey ?? 'value'], + text: e[col.dropOptions?.textKey ?? 'text'] + }; } /** diff --git a/lib/ui/grid/grid.js b/lib/ui/grid/grid.js index 3eea830..2b70bd3 100644 --- a/lib/ui/grid/grid.js +++ b/lib/ui/grid/grid.js @@ -2092,10 +2092,69 @@ export class Grid { * }> * } * ``` + * @param {boolean} compressed - 是否压缩 * @returns {Promise} 返回 `Uint8Array` 数据对象 * @since 1.0.2 */ - export() { + export(compressed) { + const data = { + columns: this.columns.map(c => ({ + key: c.key, + type: c.type?.toString(), + caption: c.caption, + width: c.width, + align: c.align, + visible: c.visible + })), + source: this.source.map(s => { + const item = Object.create(null); + for (let c of this.columns) { + if (c.key == null) { + continue; + } + let val; + if (c.text != null) { + val = c.text; + } else if (typeof c.filter === 'function') { + val = c.filter(s, false, this._var.refs.body); + } else { + val = s[c.key]; + if (val != null) { + if (Object.prototype.hasOwnProperty.call(val, 'DisplayValue')) { + val = val.DisplayValue; + } else if (Array.isArray(val)) { + val = val.join(', '); + } + } + } + val ??= ''; + item[c.key] = val; + } + for (let prop of Object.keys(s)) { + if (Object.prototype.hasOwnProperty.call(item, prop)) { + continue; + } + let val; + val = s[prop]; + if (val != null) { + if (Object.prototype.hasOwnProperty.call(val, 'DisplayValue')) { + val = val.DisplayValue; + } + } + item[prop] = val; + } + return item; + }), + rowHeight: this.rowHeight, + sortDirection: this.sortDirection, + sortKey: this.sortKey, + sortArray: this.sortArray + }; + if (compressed === false) { + const encoder = new TextEncoder(); + const uncompressed = encoder.encode(JSON.stringify(data)); + return Promise.resolve(uncompressed); + } const js = new Blob(['function h(e,t,o){if(null==e)return"";let r;const l={},h={};let s="",n="",p="",a=2,f=3,c=2;const u=[];let i=0,d=0;for(let w=0;w>=1}else{r=1;for(let e=0;e>=1}0==--a&&(a=Math.pow(2,c),c++),delete h[p]}else{r=l[p];for(let e=0;e>=1}0==--a&&(a=Math.pow(2,c),c++),l[n]=f++,p=String(s)}if(""!==p){if(Object.prototype.hasOwnProperty.call(h,p)){if(p.charCodeAt(0)<256){for(let e=0;e>=1}else{r=1;for(let e=0;e>=1}0==--a&&(a=Math.pow(2,c),c++),delete h[p]}else{r=l[p];for(let e=0;e>=1}0==--a&&(a=Math.pow(2,c),c++)}r=2;for(let e=0;e>=1;let w=!0;do{i<<=1,d==t-1?(u.push(o(i)),w=!1):d++}while(w);return u.join("")}function s(e){return null==e?"":h(e,16,e=>String.fromCharCode(e))}function i(e){const t=s(e),o=new Uint8Array(2*t.length);for(let e=0,r=t.length;e>>8,o[2*e+1]=r%256}return o}self.addEventListener("message",function(e){this.self.postMessage(i(e.data))},!1);']); return new Promise((resolve, reject) => { let working; @@ -2112,12 +2171,12 @@ export class Grid { URL.revokeObjectURL(url); next(data); } - // 超过 10 秒则拒绝 + // 超过 60 秒则拒绝 const timer = setTimeout(() => { if (working) { terminate(reject, { message: 'timeout' }); } - }, 10000); + }, 60000); worker.addEventListener('message', e => { if (working) { clearTimeout(timer); @@ -2131,21 +2190,7 @@ export class Grid { } }) working = true; - worker.postMessage(JSON.stringify({ - columns: this.columns.map(c => ({ - key: c.key, - type: c.type?.toString(), - caption: c.caption, - width: c.width, - align: c.align, - visible: c.visible - })), - source: this.source, - rowHeight: this.rowHeight, - sortDirection: this.sortDirection, - sortKey: this.sortKey, - sortArray: this.sortArray - })); + worker.postMessage(JSON.stringify(data)); }); } @@ -2693,10 +2738,12 @@ export class Grid { val = col.filter(item, selected, this._var.refs.body); } else { val = item[col.key]; - if (val?.DisplayValue != null) { - val = val.DisplayValue; - } else if (Array.isArray(val)) { - val = val.join(', '); + if (val != null) { + if (Object.prototype.hasOwnProperty.call(val, 'DisplayValue')) { + val = val.DisplayValue; + } else if (Array.isArray(val)) { + val = val.join(', '); + } } } val ??= ''; @@ -2768,9 +2815,6 @@ export class Grid { delete virtualCell.value; delete virtualCell.enabled; } - if (typeof type.setEditing === 'function') { - type.setEditing(element, selected); - } } if (val !== virtualCell.value) { virtualCell.value = val; @@ -2792,9 +2836,12 @@ export class Grid { } if (enabled !== virtualCell.enabled) { virtualCell.enabled = enabled; - type.setEnabled(element, enabled); + type.setEnabled(element, enabled, selected); } } + if (stateChanged && typeof type.setEditing === 'function') { + type.setEditing(element, selected); + } let tip = col.tooltip; if (typeof tip === 'function') { tip = tip.call(col, item); @@ -2884,7 +2931,7 @@ export class Grid { return; } let val = this.total[col.key]; - if (val?.DisplayValue != null) { + if (Object.prototype.hasOwnProperty.call(val, 'DisplayValue')) { val = val.DisplayValue; } val ??= ''; @@ -4007,18 +4054,29 @@ export class Grid { enabled = item[enabled]; } if (enabled !== false) { + let v; + let t; + if (value != null) { + v = Object.prototype.hasOwnProperty.call(value, 'value') ? value.value : value; + t = Object.prototype.hasOwnProperty.call(value, 'text') ? value.text : value; + } else { + v = t = value; + } const val = item[col.key]; if (val != null && Object.prototype.hasOwnProperty.call(val, 'Value')) { oldValue ??= val.Value; - val.Value = value; + val.Value = v; + if (Object.prototype.hasOwnProperty.call(val, 'DisplayValue')) { + val.DisplayValue = t; + } } else { oldValue ??= val; - item[col.key] = value; + item[col.key] = v; } const virtualRow = this._var.virtualRows[index]; const virtualCell = virtualRow.cells[col.key]; if (virtualCell != null) { - virtualCell.value = value; + virtualCell.value = v; } let tip = col.tooltip; if (typeof tip === 'function') {