ng-cw-v12
Version:
Angular UI component library
62 lines • 9.11 kB
JavaScript
import { __awaiter } from "tslib";
import { Component, Input } from '@angular/core';
import * as XLSX from 'xlsx-js-style';
import * as i0 from "@angular/core";
export class ExcelViewerComponent {
constructor(eleRef) {
this.eleRef = eleRef;
this.ncUrl = '';
this.sheetNameMode = false;
}
set ncSheetName(value) {
this.sheetNameMode = value !== null && value !== undefined && value !== false && value !== 'false';
}
ngOnChanges(changes) {
if (changes['ncUrl']) {
this.renderExcelDocument();
}
}
renderExcelDocument() {
return __awaiter(this, void 0, void 0, function* () {
const response = yield fetch(this.ncUrl);
const blob = yield response.blob();
const reader = new FileReader();
//通过readAsArrayBuffer将blob转换为ArrayBuffer对
reader.readAsArrayBuffer(blob);
reader.onload = (event) => {
var _a;
// 读取ArrayBuffer数据变成Uint8Array
const data = new Uint8Array((_a = event.target) === null || _a === void 0 ? void 0 : _a.result);
// 这里的data里面的类型和后面的type类型要对应
const workbook = XLSX.read(data, { type: "array" });
const sheetNames = workbook.SheetNames; // 工作表名称
let htmlArray = [];
for (let i = 0; i < sheetNames.length; i++) {
// var excelData = XLSX.utils.sheet_to_json(worksheet); //JSON
const worksheet = workbook.Sheets[sheetNames[i]];
if (this.sheetNameMode) {
htmlArray.push(`<h2>${sheetNames[i]}</h2>`);
}
htmlArray.push(XLSX.utils.sheet_to_html(worksheet));
}
const container = this.eleRef.nativeElement.querySelector('#excel-container');
container.innerHTML = htmlArray.join('');
};
});
}
}
ExcelViewerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ExcelViewerComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
ExcelViewerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: ExcelViewerComponent, selector: "nc-excel-viewer", inputs: { ncUrl: "ncUrl", ncSheetName: "ncSheetName" }, usesOnChanges: true, ngImport: i0, template: "<div id=\"excel-container\"></div>\r\n", styles: ["#excel-container{width:100%;height:100%;padding:10px}#excel-container ::ng-deep table{border-collapse:separate;border-spacing:0;border-right:1px solid #d6d6d6;border-bottom:1px solid #d6d6d6;margin-bottom:10px}#excel-container ::ng-deep table:last-child{margin-bottom:0}#excel-container ::ng-deep table td{border-left:1px solid #d6d6d6;border-top:1px solid #d6d6d6;padding:5px 10px;text-align:center;white-space:nowrap}\n"] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ExcelViewerComponent, decorators: [{
type: Component,
args: [{
selector: 'nc-excel-viewer',
templateUrl: './excel-viewer.component.html',
styleUrls: ['./excel-viewer.component.less']
}]
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { ncUrl: [{
type: Input
}], ncSheetName: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZXhjZWwtdmlld2VyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudHMvZXhjZWwtdmlld2VyL2V4Y2VsLXZpZXdlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnRzL2V4Y2VsLXZpZXdlci9leGNlbC12aWV3ZXIuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQWMsS0FBSyxFQUE0QixNQUFNLGVBQWUsQ0FBQztBQUN2RixPQUFPLEtBQUssSUFBSSxNQUFNLGVBQWUsQ0FBQzs7QUFPdEMsTUFBTSxPQUFPLG9CQUFvQjtJQU8vQixZQUFvQixNQUFrQjtRQUFsQixXQUFNLEdBQU4sTUFBTSxDQUFZO1FBTjdCLFVBQUssR0FBVyxFQUFFLENBQUM7UUFJNUIsa0JBQWEsR0FBWSxLQUFLLENBQUM7SUFFVyxDQUFDO0lBTDNDLElBQWEsV0FBVyxDQUFDLEtBQXVCO1FBQzlDLElBQUksQ0FBQyxhQUFhLEdBQUcsS0FBSyxLQUFLLElBQUksSUFBSSxLQUFLLEtBQUssU0FBUyxJQUFJLEtBQUssS0FBSyxLQUFLLElBQUksS0FBSyxLQUFLLE9BQU8sQ0FBQztJQUNyRyxDQUFDO0lBS0QsV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLElBQUksT0FBTyxDQUFDLE9BQU8sQ0FBQyxFQUFFO1lBQ3BCLElBQUksQ0FBQyxtQkFBbUIsRUFBRSxDQUFDO1NBQzVCO0lBQ0gsQ0FBQztJQUVLLG1CQUFtQjs7WUFDdkIsTUFBTSxRQUFRLEdBQUcsTUFBTSxLQUFLLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO1lBQ3pDLE1BQU0sSUFBSSxHQUFHLE1BQU0sUUFBUSxDQUFDLElBQUksRUFBRSxDQUFDO1lBQ25DLE1BQU0sTUFBTSxHQUFHLElBQUksVUFBVSxFQUFFLENBQUM7WUFDaEMseUNBQXlDO1lBQ3pDLE1BQU0sQ0FBQyxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsQ0FBQztZQUMvQixNQUFNLENBQUMsTUFBTSxHQUFHLENBQUMsS0FBSyxFQUFFLEVBQUU7O2dCQUN4Qiw4QkFBOEI7Z0JBQzlCLE1BQU0sSUFBSSxHQUFHLElBQUksVUFBVSxDQUFDLE1BQUEsS0FBSyxDQUFDLE1BQU0sMENBQUUsTUFBcUIsQ0FBQyxDQUFDO2dCQUNqRSw0QkFBNEI7Z0JBQzVCLE1BQU0sUUFBUSxHQUFHLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLEVBQUUsSUFBSSxFQUFFLE9BQU8sRUFBRSxDQUFDLENBQUM7Z0JBQ3BELE1BQU0sVUFBVSxHQUFHLFFBQVEsQ0FBQyxVQUFVLENBQUMsQ0FBQyxRQUFRO2dCQUNoRCxJQUFJLFNBQVMsR0FBRyxFQUFFLENBQUM7Z0JBQ25CLEtBQUssSUFBSSxDQUFDLEdBQUcsQ0FBQyxFQUFFLENBQUMsR0FBRyxVQUFVLENBQUMsTUFBTSxFQUFFLENBQUMsRUFBRSxFQUFFO29CQUMxQyw4REFBOEQ7b0JBQzlELE1BQU0sU0FBUyxHQUFHLFFBQVEsQ0FBQyxNQUFNLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUM7b0JBQ2pELElBQUksSUFBSSxDQUFDLGFBQWEsRUFBRTt3QkFDdEIsU0FBUyxDQUFDLElBQUksQ0FBQyxPQUFPLFVBQVUsQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDLENBQUM7cUJBQzdDO29CQUNELFNBQVMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxhQUFhLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQztpQkFDckQ7Z0JBQ0QsTUFBTSxTQUFTLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxhQUFhLENBQUMsYUFBYSxDQUFDLGtCQUFrQixDQUFDLENBQUM7Z0JBQzlFLFNBQVMsQ0FBQyxTQUFTLEdBQUcsU0FBUyxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsQ0FBQztZQUMzQyxDQUFDLENBQUM7UUFDSixDQUFDO0tBQUE7O2lIQXZDVSxvQkFBb0I7cUdBQXBCLG9CQUFvQixvSUNSakMsd0NBQ0E7MkZET2Esb0JBQW9CO2tCQUxoQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxpQkFBaUI7b0JBQzNCLFdBQVcsRUFBRSwrQkFBK0I7b0JBQzVDLFNBQVMsRUFBRSxDQUFDLCtCQUErQixDQUFDO2lCQUM3QztpR0FFVSxLQUFLO3NCQUFiLEtBQUs7Z0JBQ08sV0FBVztzQkFBdkIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRWxlbWVudFJlZiwgSW5wdXQsIE9uQ2hhbmdlcywgU2ltcGxlQ2hhbmdlcyB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgKiBhcyBYTFNYIGZyb20gJ3hsc3gtanMtc3R5bGUnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICduYy1leGNlbC12aWV3ZXInLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9leGNlbC12aWV3ZXIuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL2V4Y2VsLXZpZXdlci5jb21wb25lbnQubGVzcyddXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBFeGNlbFZpZXdlckNvbXBvbmVudCBpbXBsZW1lbnRzIE9uQ2hhbmdlcyB7XHJcbiAgQElucHV0KCkgbmNVcmw6IHN0cmluZyA9ICcnO1xyXG4gIEBJbnB1dCgpIHNldCBuY1NoZWV0TmFtZSh2YWx1ZTogYm9vbGVhbiB8IHN0cmluZykge1xyXG4gICAgdGhpcy5zaGVldE5hbWVNb2RlID0gdmFsdWUgIT09IG51bGwgJiYgdmFsdWUgIT09IHVuZGVmaW5lZCAmJiB2YWx1ZSAhPT0gZmFsc2UgJiYgdmFsdWUgIT09ICdmYWxzZSc7XHJcbiAgfVxyXG4gIHNoZWV0TmFtZU1vZGU6IGJvb2xlYW4gPSBmYWxzZTtcclxuXHJcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBlbGVSZWY6IEVsZW1lbnRSZWYpIHsgfVxyXG5cclxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKSB7XHJcbiAgICBpZiAoY2hhbmdlc1snbmNVcmwnXSkge1xyXG4gICAgICB0aGlzLnJlbmRlckV4Y2VsRG9jdW1lbnQoKTtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIGFzeW5jIHJlbmRlckV4Y2VsRG9jdW1lbnQoKSB7XHJcbiAgICBjb25zdCByZXNwb25zZSA9IGF3YWl0IGZldGNoKHRoaXMubmNVcmwpO1xyXG4gICAgY29uc3QgYmxvYiA9IGF3YWl0IHJlc3BvbnNlLmJsb2IoKTtcclxuICAgIGNvbnN0IHJlYWRlciA9IG5ldyBGaWxlUmVhZGVyKCk7XHJcbiAgICAvL+mAmui/h3JlYWRBc0FycmF5QnVmZmVy5bCGYmxvYui9rOaNouS4ukFycmF5QnVmZmVy5a+5XHJcbiAgICByZWFkZXIucmVhZEFzQXJyYXlCdWZmZXIoYmxvYik7XHJcbiAgICByZWFkZXIub25sb2FkID0gKGV2ZW50KSA9PiB7XHJcbiAgICAgIC8vIOivu+WPlkFycmF5QnVmZmVy5pWw5o2u5Y+Y5oiQVWludDhBcnJheVxyXG4gICAgICBjb25zdCBkYXRhID0gbmV3IFVpbnQ4QXJyYXkoZXZlbnQudGFyZ2V0Py5yZXN1bHQgYXMgQXJyYXlCdWZmZXIpO1xyXG4gICAgICAvLyDov5nph4znmoRkYXRh6YeM6Z2i55qE57G75Z6L5ZKM5ZCO6Z2i55qEdHlwZeexu+Wei+imgeWvueW6lFxyXG4gICAgICBjb25zdCB3b3JrYm9vayA9IFhMU1gucmVhZChkYXRhLCB7IHR5cGU6IFwiYXJyYXlcIiB9KTtcclxuICAgICAgY29uc3Qgc2hlZXROYW1lcyA9IHdvcmtib29rLlNoZWV0TmFtZXM7IC8vIOW3peS9nOihqOWQjeensFxyXG4gICAgICBsZXQgaHRtbEFycmF5ID0gW107XHJcbiAgICAgIGZvciAobGV0IGkgPSAwOyBpIDwgc2hlZXROYW1lcy5sZW5ndGg7IGkrKykge1xyXG4gICAgICAgIC8vIHZhciBleGNlbERhdGEgPSBYTFNYLnV0aWxzLnNoZWV0X3RvX2pzb24od29ya3NoZWV0KTsgLy9KU09OXHJcbiAgICAgICAgY29uc3Qgd29ya3NoZWV0ID0gd29ya2Jvb2suU2hlZXRzW3NoZWV0TmFtZXNbaV1dO1xyXG4gICAgICAgIGlmICh0aGlzLnNoZWV0TmFtZU1vZGUpIHtcclxuICAgICAgICAgIGh0bWxBcnJheS5wdXNoKGA8aDI+JHtzaGVldE5hbWVzW2ldfTwvaDI+YCk7XHJcbiAgICAgICAgfVxyXG4gICAgICAgIGh0bWxBcnJheS5wdXNoKFhMU1gudXRpbHMuc2hlZXRfdG9faHRtbCh3b3Jrc2hlZXQpKTtcclxuICAgICAgfVxyXG4gICAgICBjb25zdCBjb250YWluZXIgPSB0aGlzLmVsZVJlZi5uYXRpdmVFbGVtZW50LnF1ZXJ5U2VsZWN0b3IoJyNleGNlbC1jb250YWluZXInKTtcclxuICAgICAgY29udGFpbmVyLmlubmVySFRNTCA9IGh0bWxBcnJheS5qb2luKCcnKTtcclxuICAgIH07XHJcbiAgfVxyXG5cclxufVxyXG4iLCI8ZGl2IGlkPVwiZXhjZWwtY29udGFpbmVyXCI+PC9kaXY+XHJcbiJdfQ==