import data from '@/components/reportTemplate/rescource/orderDetails'; // use data for testing use const orderDetails: { [index: string]: string | object; orderNo: string; clientName: string; soldDate: string; contactName: string; contactNo: string; deliveryAddress: string; addOn: string; boards: Array<{ [index: string]: number | string | object; id: number; material: string; color: string; boardInfos: Array<{ houseName: string; closetName: string; boardNo: string; boardName: string; length: number; width: number; thickness: number; quantity: number; area: number; mutation: string; shape: string; direction: string; stripe: string; boardAddOn: string; [index: string]: number | string; }>; }>; } = data; interface BoardFormat { id: number; material: string; color: string; boardInfos: Array<{ houseName: string; closetName: string; boardNo: string; boardName: string; length: number; width: number; thickness: number; quantity: number; area: number; mutation: string; shape: string; direction: string; stripe: string; boardAddOn: string; [index: string]: number | string; }>; } const subKeyWords = [ 'sublength', 'subwidth', 'subthickness', 'subquantity', 'subarea', ]; const totalKeyWords = [ 'totallength', 'totalwidth', 'totalthickness', 'totalquantity', 'totalarea', ]; const tagsObject: any = { '${订单号}': 'orderNo', '${客户名}': 'clientName', '${出售日期}': 'soldDate', '${联系人}': 'contactName', '${联系电话}': 'contactNo', '${送货地址}': 'deliveryAddress', '${订单备注}': 'addOn', '${板材材料}': 'material', '${板材颜色}': 'color', '${板材房名}': 'houseName', '${板材柜名}': 'closetName', '${板材号}': 'boardNo', '${板材名}': 'boardName', '${长度}': 'length', '${宽度}': 'width', '${厚度}': 'thickness', '${数量}': 'quantity', '${面积}': 'area', '${变异}': 'mutation', '${形状}': 'shape', '${方向}': 'direction', '${条纹}': 'stripe', '${板材备注}': 'boardAddOn', }; const orderDetailsKeys: string[] = [ 'orderNo', 'clientName', 'soldDate', 'contactName', 'contactNo', 'deliveryAddress', 'addOn', ]; const banCaiHeaderKeys: string[] = ['id', 'material', 'color']; const banCaiDetailsKeys: string[] = [ 'houseName', 'closetName', 'boardNo', 'boardName', 'length', 'width', 'thickness', 'quantity', 'area', 'mutation', 'shape', 'direction', 'stripe', 'boardAddOn', ]; const temRowHolder: string[] = []; const Tool = { addRow: (that: any, rowId: number) => { if (that.selectedRow) { for (const index in that.infos) { if (that.selectedRow === that.infos[index].rowId) { that.infos.splice(Number(index), 0, { rowId, rowTitle: rowId.toString(), cells: [], }); that.selectedRow = 0; break; } } } else { that.infos.push({ rowId: (rowId += 1), rowTitle: rowId.toString(), cells: [], }); } }, deleteRow: (that: any) => { if (!that.selectedRow) { return alert('请选择要删除行'); } that.infos = that.infos.filter( (item: any) => item.rowId !== that.selectedRow, ); that.selectedRow = 0; }, addCell: (that: any, cellId: number) => { if (!that.selectedRow) { return alert('请选择要添加单元的行'); } for (const row of that.infos) { if (that.selectedRow === row.rowId) { row.cells.push({ cellId, title: '列' + cellId, colspan: 0, height: 30, textAlign: 'center', fontSize: 16, fontStyle: 'normal', }); } } }, deleteCell: (that: any) => { // 9000 is initial cell Id. if (that.selectedCell === 9000) { return alert('请选择要删除的单元'); } for (const row of that.infos) { for (const cell in row.cells) { if (row.cells[cell].cellId === that.selectedCell) { row.cells.splice(Number(cell), 1); // Vue.nextTick(() => { // row.cells.splice(Number(cell), 1); // }); } } } that.selectedCell = 9000; }, isTagName(cellTitle: string) { if (cellTitle.slice(0, 2) === '${') { return true; } else { return false; } }, addTotalAmount: (query: string) => { let total: any = 0; const query1 = query.slice(5); for (const board of orderDetails.boards) { for (const eachBoardInfo of board.boardInfos) { if (Object.keys(eachBoardInfo).indexOf(query1) !== -1) { total += eachBoardInfo[query1]; } } } if (Number.isInteger(total)) { return total; } else { return total.toFixed(3); } }, addSubAmount: (query: string, board: BoardFormat) => { let sub: any = 0; const query1 = query.slice(3); for (const eachBoardInfo of board.boardInfos) { if (Object.keys(eachBoardInfo).indexOf(query1) !== -1) { sub += eachBoardInfo[query1]; } } if (Number.isInteger(sub)) { return sub; } else { return sub.toFixed(3); } }, addBoardInfoAmount: (that: any, board: BoardFormat) => { for (const row of that.infos) { for (const cell of row.cells) { if (cell.title === 'bancaiinfoamount') { cell.title = board.boardInfos.length; } } } }, copyBanCaiTemplate: (that: any) => { let temStartLineIndex = Number(that.banCaiHeadStartLineIndex); const banCaiHeadTemplateHolder = []; while (temStartLineIndex <= Number(that.banCaiHeadEndLineIndex)) { banCaiHeadTemplateHolder.push( that.copySingleRow(that.infos[temStartLineIndex].rowId), ); temStartLineIndex += 1; } return banCaiHeadTemplateHolder; }, copyRemainingForm: (that: any) => { let remainingIndex = Number(that.banCaiHeadEndLineIndex) + 1; const remainingFormHolder = []; for (remainingIndex; remainingIndex < that.infos.length; remainingIndex++) { if (that.infos[remainingIndex].cells.length !== 0) { remainingFormHolder.push(that.infos[remainingIndex]); } } for (const eachRemainingRow of remainingFormHolder) { for (const row of that.infos) { if (eachRemainingRow === row) { that.infos.splice(that.infos.indexOf(row), 1); } } } return remainingFormHolder; }, pasteRemainingForm: (that: any, remainingFormHolder: any[]) => { for (const eachRemainingRow of remainingFormHolder) { for (const row of that.infos) { if (row.cells.length === 0) { that.infos.splice(that.infos.indexOf(row), 1, eachRemainingRow); break; } } for (const row of that.infos) { for (const cell of row.cells) { if (totalKeyWords.indexOf(cell.title) !== -1) { cell.title = that.addTotalAmount(cell.title); } } } } }, pasteBanCaiHeadTemplate: (that: any, copyBanCaiTemplate: any) => { const temCopyBanCaiTemplate = copyBanCaiTemplate; for (const banCaiRow of temCopyBanCaiTemplate) { for (const row of that.infos) { if (row.cells.length === 0) { that.infos.splice(that.infos.indexOf(row), 0, banCaiRow); break; } } } }, copyBanCaiBodyTemplate: (that: any) => { for (const row of that.infos) { for (const cell of row.cells) { if (banCaiDetailsKeys.indexOf(tagsObject[cell.title]) !== -1) { return that.infos.indexOf(row); } } } }, pasteBanCaiBody: (that: any, boardIndex: number) => { const boardInfosTemplateHolder = []; const copyBanCaiBodyTemplateIndex: any = Tool.copyBanCaiBodyTemplate(that); for (const i of orderDetails.boards[boardIndex].boardInfos) { boardInfosTemplateHolder.push( that.copySingleRow(that.infos[copyBanCaiBodyTemplateIndex].rowId), ); } for (let i = 0; i < boardInfosTemplateHolder.length; i++) { for (const cell of boardInfosTemplateHolder[i].cells) { for (const key in orderDetails.boards[boardIndex].boardInfos[i]) { if (key === tagsObject[cell.title]) { cell.title = orderDetails.boards[boardIndex].boardInfos[i][key]; } } } } that.infos.splice(copyBanCaiBodyTemplateIndex, 1); for (let i = 0; i < boardInfosTemplateHolder.length; i++) { that.infos.splice( copyBanCaiBodyTemplateIndex + i, 0, boardInfosTemplateHolder[i], ); } }, addBanCaiHeader: (that: any, index: number) => { for (const row of that.infos) { for (const cell of row.cells) { if (banCaiHeaderKeys.indexOf(tagsObject[cell.title]) !== -1) { if (temRowHolder.indexOf(row) === -1) { temRowHolder.push(that.copySingleRow(row.rowId)); } cell.title = orderDetails.boards[index][tagsObject[cell.title]]; } } } }, addOrderDetails: (that: any) => { for (const row of that.infos) { for (const cell of row.cells) { if (orderDetailsKeys.indexOf(tagsObject[cell.title]) !== -1) { cell.title = orderDetails[tagsObject[cell.title]]; } } } }, addsubQuantity: (that: any, board: any) => { for (const row of that.infos) { for (const cell of row.cells) { if (subKeyWords.indexOf(cell.title) !== -1) { cell.title = that.addSubAmount(cell.title, board); } } } }, exportAsExcel: () => { const tabs = document.getElementsByTagName('table'); let allElementText: any = ''; for (const tab of tabs) { let tabText: string = '