From 7fbf78c95c04425cb05f025587f130823a96df4d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E2=80=9Cjonyshi=E2=80=9D?= Date: Sat, 1 Dec 2018 17:52:47 +0800 Subject: [PATCH] =?UTF-8?q?table=20=E6=8B=96=E6=8B=BD=E5=AE=8C=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- demo/demolist/js-export-excel.js | 163 ++++++++++++++++++++ demo/demolist/js-export-excel_bak.js | 214 +++++++++++++++++++++++++++ package.json | 187 +++++++++++------------ 3 files changed, 471 insertions(+), 93 deletions(-) create mode 100644 demo/demolist/js-export-excel.js create mode 100644 demo/demolist/js-export-excel_bak.js diff --git a/demo/demolist/js-export-excel.js b/demo/demolist/js-export-excel.js new file mode 100644 index 0000000..d624251 --- /dev/null +++ b/demo/demolist/js-export-excel.js @@ -0,0 +1,163 @@ +require("script-loader!file-saver"); +require("script-loader!xlsx/dist/xlsx.core.min"); +require("script-loader!blob.js/Blob"); + +/** + * Created by kin on 2017/5/18. + * + * josn导出excel + * mail：cuikangjie_90h@126.com + */ +const changeData = function(data, filter) { + let sj = data, + f = filter, + re = []; + Array.isArray(data) + ? (function() { + //对象 + f + ? (function() { + //存在过滤 + sj.forEach(function(obj) { + let one = []; + filter.forEach(function(no) { + one.push(obj[no]); + }); + re.push(one); + }); + })() + : (function() { + //不存在过滤 + sj.forEach(function(obj) { + let col = Object.keys(obj); + let one = []; + col.forEach(function(no) { + one.push(obj[no]); + }); + re.push(one); + }); + })(); + })() + : (function() { + re = sj; + })(); + return re; +}; + +// 转换数据 +const sheetChangeData = function(data) { + let ws = {}; + let range = { + s: { + c: 10000000, + r: 10000000 + }, + e: { + c: 0, + r: 0 + } + }; + for (let R = 0; R != data.length; ++R) { + for (let C = 0; C != data[R].length; ++C) { + if (range.s.r > R) range.s.r = R; + if (range.s.c > C) range.s.c = C; + if (range.e.r < R) range.e.r = R; + if (range.e.c < C) range.e.c = C; + let cell = { + v: data[R][C] + }; + if (cell.v == null) continue; + let cell_ref = XLSX.utils.encode_cell({ + c: C, + r: R + }); + + if (typeof cell.v === "number") cell.t = "n"; + else if (typeof cell.v === "boolean") cell.t = "b"; + else if (cell.v instanceof Date) { + cell.t = "n"; + cell.z = XLSX.SSF._table[14]; + cell.v = datenum(cell.v); + } else cell.t = "s"; + ws[cell_ref] = cell; + } + } + if (range.s.c < 10000000) ws["!ref"] = XLSX.utils.encode_range(range); + return ws; +}; + +const s2ab = function(s) { + let buf = new ArrayBuffer(s.length); + let view = new Uint8Array(buf); + for (let i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xff; + return buf; +}; +const datenum = function(v, date1904) { + if (date1904) v += 1462; + let epoch = Date.parse(v); + return (epoch - new Date(Date.UTC(1899, 11, 30))) / (24 * 60 * 60 * 1000); +}; + +const columnwidths = function(columnWidths) { + let out = []; + out = columnWidths.map(function(item) { + return { width: item ? parseInt(256 * (Number(item) / 100)) : 20 }; + }); + return out; +}; + +const exportExcel = function(options) { + let _options = { + fileName: options.fileName || "download", + datas: options.datas, + workbook: { + SheetNames: [], + Sheets: {} + } + }; + + const instance = { + saveExcel: function() { + let wb = _options.workbook; + + _options.datas.forEach(function(data, index) { + let sheetHeader = data.sheetHeader || null; + let sheetData = data.sheetData; + let sheetName = data.sheetName || "sheet" + (index + 1); + let sheetFilter = data.sheetFilter || null; + let columnWidths = data.columnWidths || []; + + sheetData = changeData(sheetData, sheetFilter); + + if (sheetHeader) { + sheetData.unshift(sheetHeader); + } + + let ws = sheetChangeData(sheetData); + + ws["!merges"] = []; + + ws["!cols"] = columnwidths(columnWidths); + + wb.SheetNames.push(sheetName); + wb.Sheets[sheetName] = ws; + }); + + let wbout = XLSX.write(wb, { + bookType: "xlsx", + bookSST: false, + type: "binary" + }); + saveAs( + new Blob([s2ab(wbout)], { + type: "application/octet-stream" + }), + _options.fileName + ".xlsx" + ); + } + }; + + return instance; +}; + +module.exports = exportExcel; \ No newline at end of file diff --git a/demo/demolist/js-export-excel_bak.js b/demo/demolist/js-export-excel_bak.js new file mode 100644 index 0000000..4745328 --- /dev/null +++ b/demo/demolist/js-export-excel_bak.js @@ -0,0 +1,214 @@ +require("script-loader!file-saver"); +require("script-loader!xlsx/dist/xlsx.core.min"); +require("script-loader!blob.js/Blob"); + +/** + * Created by kin on 2017/5/18. + * + * josn导出excel + * mail：cuikangjie_90h@126.com + */ +const changeData = function(data, filter) { + let sj = data, + f = filter, + re = []; + Array.isArray(data) + ? (function() { + //对象 + f + ? (function() { + //存在过滤 + sj.forEach(function(obj) { + let one = []; + filter.forEach(function(no) { + one.push(obj[no]); + }); + re.push(one); + }); + })() + : (function() { + //不存在过滤 + sj.forEach(function(obj) { + let col = Object.keys(obj); + let one = []; + col.forEach(function(no) { + one.push(obj[no]); + }); + re.push(one); + }); + })(); + })() + : (function() { + re = sj; + })(); + return re; +}; + +// 转换数据 +const sheetChangeData = function(data) { + let ws = {}; + let range = { + s: { + c: 10000000, + r: 10000000 + }, + e: { + c: 0, + r: 0 + } + }; + for (let R = 0; R != data.length; ++R) { + for (let C = 0; C != data[R].length; ++C) { + if (range.s.r > R) range.s.r = R; + if (range.s.c > C) range.s.c = C; + if (range.e.r < R) range.e.r = R; + if (range.e.c < C) range.e.c = C; + let cell = { + v: data[R][C] + }; + if (cell.v == null) continue; + let cell_ref = XLSX.utils.encode_cell({ + c: C, + r: R + }); + + if (typeof cell.v === "number") cell.t = "n"; + else if (typeof cell.v === "boolean") cell.t = "b"; + else if (cell.v instanceof Date) { + cell.t = "n"; + cell.z = XLSX.SSF._table[14]; + cell.v = datenum(cell.v); + } else cell.t = "s"; + ws[cell_ref] = cell; + } + } + if (range.s.c < 10000000) ws["!ref"] = XLSX.utils.encode_range(range); + return ws; +}; + +const s2ab = function(s) { + let buf = new ArrayBuffer(s.length); + let view = new Uint8Array(buf); + for (let i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xff; + return buf; +}; +const datenum = function(v, date1904) { + if (date1904) v += 1462; + let epoch = Date.parse(v); + return (epoch - new Date(Date.UTC(1899, 11, 30))) / (24 * 60 * 60 * 1000); +}; + +const columnwidths = function(columnWidths) { + let out = []; + out = columnWidths.map(function(item) { + return { width: item ? parseInt(256 * (Number(item) / 100)) : 20 }; + }); + return out; +}; + +const exportExcel = function(options) { + let _options = { + fileName: options.fileName || "download", + datas: options.datas, + workbook: { + SheetNames: [], + Sheets: {} + } + }; + + const instance = { + saveExcel: function() { + let wb = _options.workbook; + debugger; + _options.datas.forEach(function(data, index) { + let sheetHeader = data.sheetHeader || null; + let sheetData = data.sheetData; + let sheetName = data.sheetName || "sheet" + (index + 1); + let sheetFilter = data.sheetFilter || null; + let columnWidths = data.columnWidths || []; + + sheetData = changeData(sheetData, sheetFilter); + + if (sheetHeader) { + sheetData.unshift(sheetHeader); + } + + let ws = sheetChangeData(sheetData); + + ws["!merges"] = [{ s: {r:2, c:0}, e: {r:2, c:1} }]; + + ws["!cols"] = columnwidths(columnWidths); + + ws["!margins"]={left:0.7, right:0.7, top:0.75,bottom:0.75,header:0.3,footer:0.3}; + + ws["!ref"] = "A1:B4"; + ws["A4"] = {"t":"n","f":'SUM(A2+B2)'}; + + /* merge cells A1:B1 */ + // let merge = { s: {r:0, c:0}, e: {r:0, c:1} }; + // ws['!merges'].push(merge); + + ws["A3"] = { + "t": "n", + "v": 5, + "s": { + "numFmt": "General", + "fill": { + "patternType": "lightDown", + "fgColor": { + "theme": 4, + "tint": -0.249977111117893 + }, + "bgColor": { + "theme": 7, + "tint": -0.249977111117893 + } + }, + "font": { + "sz": "12", + "color": { + "theme": "1" + }, + "name": "Calibri" + }, + "border": {} + }, + "w": "5", + "z": "General" + }; + // ws.A1.s = { fill: {patternType: "none",fgColor: {rgb: "#5fb3dd"},bgColor: {rgb: "5fb3dd"}} }; + + // ws.B2 = { t: 'n', v: 1, w: '1', s: { patternType: 'solid', fgColor: { rgb: 'FFFF00' }, bgColor: { indexed: 64 } } }; + + // ws["B1"] = {v: "第二22222列", t: "s"}; + // ws["A4"]["t"] = "n"; + // ws["A4"]["f"] = 'SUM(A2+B2)'; + console.log("ws: " , ws); + wb.SheetNames.push(sheetName); + wb.Sheets[sheetName] = ws; + }); + + let defaultCellStyle = { font: { name: "Verdana", sz: 11, color: "FF00FF88"}, fill: {fgColor: {rgb: "FFFFAA00"}}}; + + let wbout = XLSX.write(wb, { + bookType: "xlsx", + + type: "binary", + + bookSST: true, + cellStyles: true, + defaultCellStyle:defaultCellStyle + }); + saveAs( + new Blob([s2ab(wbout)], { + type: "application/octet-stream" + }), + _options.fileName + ".xlsx" + ); + } + }; + + return instance; +}; + +module.exports = exportExcel; diff --git a/package.json b/package.json index 559faab..7df31cd 100644 --- a/package.json +++ b/package.json @@ -1,96 +1,97 @@ { - "name": "bee-table", - "version": "1.5.14", - "description": "Table ui component for react", - "keywords": [ - "react", - "react-component", - "bee-table", - "iuap-design", - "tinper-bee", - "Table" - ], - "engines": { - "node": ">=4.0.0" - }, - "jest": { - "moduleFileExtensions": [ - "js", - "jsx" + "name": "bee-table", + "version": "1.5.14", + "description": "Table ui component for react", + "keywords": [ + "react", + "react-component", + "bee-table", + "iuap-design", + "tinper-bee", + "Table" ], - "transform": { - "^.+\\.js$": "babel-jest" + "engines": { + "node": ">=4.0.0" + }, + "jest": { + "moduleFileExtensions": [ + "js", + "jsx" + ], + "transform": { + "^.+\\.js$": "babel-jest" + } + }, + "homepage": "https://github.com/tinper-bee/bee-table.git", + "author": "Yonyou FED", + "repository": "http://github.com/tinper-bee/bee-table", + "bugs": "https://github.com/tinper-bee/bee-table.git/issues", + "license": "MIT", + "main": "./build/index.js", + "config": { + "port": 3000, + "commitizen": { + "path": "./node_modules/cz-conventional-changelog" + } + }, + "scripts": { + "dev": "bee-tools run start", + "build": "bee-tools run build", + "lint": "bee-tools run lint", + "test": "jest", + "chrome": "bee-tools run chrome", + "coveralls": "jest", + "browsers": "bee-tools run browsers", + "pub": "bee-tools run pub", + "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0" + }, + "dependencies": { + "bee-button": "^1.0.6", + "bee-datepicker": "latest", + "bee-dnd": "^1.0.2", + "bee-dropdown": "^1.0.1", + "bee-form-control": "latest", + "bee-icon": "^1.0.5", + "bee-input-number": "^1.1.15", + "bee-loading": "^1.0.3", + "bee-locale": "0.0.11", + "bee-menus": "^1.0.7", + "bee-popover": "^1.0.2", + "bee-select": "^1.0.21", + "classnames": "^2.2.5", + "lodash.clonedeep": "^4.5.0", + "object-path": "^0.11.3", + "re-resizable": "^4.10.0", + "shallowequal": "^1.0.2", + "throttle-debounce": "^2.0.1", + "tinper-bee-core": "latest", + "warning": "^3.0.0" + }, + "peerDependencies": { + "react": "^15.3.0 || ^16.0", + "react-dom": "^15.3.0 || ^16.0", + "prop-types": "^15.6.0" + }, + "devDependencies": { + "babel-jest": "^22.0.4", + "bee-animate": "latest", + "bee-checkbox": "^1.1.1", + "bee-form": "1.1.10", + "bee-input-group": "latest", + "bee-layout": "latest", + "bee-pagination": "latest", + "bee-panel": "^1.2.12", + "bee-popconfirm": "^1.0.2", + "bee-tools": "latest", + "bee-tooltip": "^1.0.2", + "chai": "^3.5.0", + "console-polyfill": "~0.2.1", + "cz-conventional-changelog": "^2.1.0", + "enzyme": "^2.9.1", + "es5-shim": "~4.1.10", + "jest": "^22.0.4", + "react": "^15.5.0", + "react-addons-test-utils": "^15.5.0", + "react-dom": "^15.5.0" } - }, - "homepage": "https://github.com/tinper-bee/bee-table.git", - "author": "Yonyou FED", - "repository": "http://github.com/tinper-bee/bee-table", - "bugs": "https://github.com/tinper-bee/bee-table.git/issues", - "license": "MIT", - "main": "./build/index.js", - "config": { - "port": 3000, - "commitizen": { - "path": "./node_modules/cz-conventional-changelog" - } - }, - "scripts": { - "dev": "bee-tools run start", - "build": "bee-tools run build", - "lint": "bee-tools run lint", - "test": "jest", - "chrome": "bee-tools run chrome", - "coveralls": "jest", - "browsers": "bee-tools run browsers", - "pub": "bee-tools run pub", - "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0" - }, - "dependencies": { - "bee-button": "^1.0.6", - "bee-datepicker": "latest", - "bee-dnd": "^1.0.2", - "bee-dropdown": "^1.0.1", - "bee-form-control": "latest", - "bee-icon": "^1.0.5", - "bee-input-number": "^1.1.15", - "bee-loading": "^1.0.3", - "bee-locale": "0.0.11", - "bee-menus": "^1.0.7", - "bee-popover": "^1.0.2", - "bee-select": "^1.0.21", - "classnames": "^2.2.5", - "lodash.clonedeep": "^4.5.0", - "object-path": "^0.11.3", - "shallowequal": "^1.0.2", - "throttle-debounce": "^2.0.1", - "tinper-bee-core": "latest", - "warning": "^3.0.0" - }, - "peerDependencies": { - "react": "^15.3.0 || ^16.0", - "react-dom": "^15.3.0 || ^16.0", - "prop-types": "^15.6.0" - }, - "devDependencies": { - "babel-jest": "^22.0.4", - "bee-animate": "latest", - "bee-checkbox": "^1.1.1", - "bee-form": "1.1.10", - "bee-input-group": "latest", - "bee-layout": "latest", - "bee-pagination": "latest", - "bee-panel": "^1.2.12", - "bee-popconfirm": "^1.0.2", - "bee-tools": "latest", - "bee-tooltip": "^1.0.2", - "chai": "^3.5.0", - "console-polyfill": "~0.2.1", - "cz-conventional-changelog": "^2.1.0", - "enzyme": "^2.9.1", - "es5-shim": "~4.1.10", - "jest": "^22.0.4", - "react": "^15.5.0", - "react-addons-test-utils": "^15.5.0", - "react-dom": "^15.5.0" - } -} \ No newline at end of file +}