summaryrefslogtreecommitdiff
path: root/components/spread-js/testSheet.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'components/spread-js/testSheet.tsx')
-rw-r--r--components/spread-js/testSheet.tsx90
1 files changed, 90 insertions, 0 deletions
diff --git a/components/spread-js/testSheet.tsx b/components/spread-js/testSheet.tsx
new file mode 100644
index 00000000..0d69798e
--- /dev/null
+++ b/components/spread-js/testSheet.tsx
@@ -0,0 +1,90 @@
+// @ts-nocheck
+"use client";
+
+import React, { useState } from "react";
+import "@mescius/spread-sheets-print";
+import "@mescius/spread-sheets-io";
+import "@mescius/spread-sheets-shapes";
+import "@mescius/spread-sheets-charts";
+import "@mescius/spread-sheets-slicers";
+import "@mescius/spread-sheets-pivot-addon";
+import "@mescius/spread-sheets-reportsheet-addon";
+import "@mescius/spread-sheets-tablesheet";
+import "@mescius/spread-sheets-ganttsheet";
+import "@mescius/spread-sheets-resources-ko";
+import "@mescius/spread-sheets-formula-panel";
+import "@mescius/spread-sheets-designer-resources-ko";
+import '@mescius/spread-sheets-datacharts-addon';
+import * as GC from "@mescius/spread-sheets";
+import { Designer } from "@mescius/spread-sheets-designer-react";
+import {
+ addSheet,
+ clearSheet,
+ createSampleReportForm,
+ removeSheet,
+ setSampleReportData,
+ exportJSON,handleFileImport
+} from "@/lib/spread-js/fns";
+import { Button } from "@/components/ui/button";
+
+// SpreadJS 라이선싱
+// var SpreadJSKey = "xxx"; // 라이선스 키 입력
+// GC.Spread.Sheets.LicenseKey = SpreadJSKey;
+GC.Spread.Common.CultureManager.culture("ko-kr");
+GC.Spread.Sheets.LicenseKey = process.env.NEXT_PUBLIC_SPREADJS_KEY
+GC.Spread.Sheets.Designer.LicenseKey = process.env.NEXT_PUBLIC_SPREADJS_KEY
+
+export default function SpreadSheet() {
+ const [spread, setSpread] = useState(null);
+
+ function initSpread(spread) {
+ setSpread(spread);
+ //init Status Bar
+ var statusBar = new GC.Spread.Sheets.StatusBar.StatusBar(
+ document.getElementById("statusBar")
+ );
+ statusBar.bind(spread);
+ }
+
+ return (
+ <div className="relative h-full overflow-hidden">
+ <div className="sample-container">
+ <div className="w-[calc(100%-280px)] h-full overflow-hidden float-left">
+ <Designer
+ styleInfo={{ height: "100%" }}
+ designerInitialized={async (designer: any) => {
+ initSpread(designer.getWorkbook());
+ designer.refresh();
+ }}
+ spreadOptions={{ allowDragHeaderToMove: 3 }}
+ />
+ </div>
+ <div id="statusBar"></div>
+ </div>
+ <div className="float-right w-[280px] p-[12px] h-full box-border bg-[#fbfbfb]">
+ <div className="p-[5px] mt-[10px]">
+
+ <div className="flex flex-col gap-2">
+ <Button onClick={() => addSheet(spread)}>Add Sheet</Button>
+ <Button onClick={() => removeSheet(spread)}>Remove Sheet</Button>
+ <Button onClick={() => clearSheet(spread)}>Clear Sheet</Button>
+ <Button onClick={() => createSampleReportForm(spread)}>
+ Create Report Form
+ </Button>
+ <Button onClick={() => setSampleReportData(spread)}>
+ Set Report Data
+ </Button>
+ <Button onClick={() => exportJSON(spread)}>
+ Export JSON
+ </Button>
+ <Button onClick={() => handleFileImport(spread)}>
+ Import JSON
+ </Button>
+ </div>
+ </div>
+ </div>
+ </div>
+ );
+}
+
+