From 3b540dacc895ba76cd69148a1ee734a1a99ebc76 Mon Sep 17 00:00:00 2001
From: Noah Hsu <i@nn.ci>
Date: Sun, 11 Sep 2022 19:15:20 +0800
Subject: [PATCH] feat: add aliyun office previewer

---
 index.html                                |  1 +
 src/index.d.ts                            |  6 ++++
 src/pages/home/previews/aliyun_office.tsx | 36 +++++++++++++++++++++++
 src/pages/home/previews/index.ts          |  6 ++++
 4 files changed, 49 insertions(+)
 create mode 100644 src/pages/home/previews/aliyun_office.tsx

diff --git a/index.html b/index.html
index 9217910..9f0e9f6 100644
--- a/index.html
+++ b/index.html
@@ -7,6 +7,7 @@
     <meta name="referrer" content="same-origin" />
     <meta name="generator" content="AList V3" />
     <meta name="theme-color" content="#000000" />
+    <script src="https://g.alicdn.com/IMM/office-js/1.1.5/aliyun-web-office-sdk.min.js" async></script>
     <link
       rel="shortcut icon"
       type="image/ico"
diff --git a/src/index.d.ts b/src/index.d.ts
index 14f3607..15ce124 100644
--- a/src/index.d.ts
+++ b/src/index.d.ts
@@ -1 +1,7 @@
 declare module "aplayer";
+declare namespace aliyun {
+  class Config {
+    setToken(token: { token: string }): any;
+  }
+  function config(options: { mount: Element; url: string }): Config;
+}
\ No newline at end of file
diff --git a/src/pages/home/previews/aliyun_office.tsx b/src/pages/home/previews/aliyun_office.tsx
new file mode 100644
index 0000000..883b14f
--- /dev/null
+++ b/src/pages/home/previews/aliyun_office.tsx
@@ -0,0 +1,36 @@
+import { Box } from "@hope-ui/solid";
+import { MaybeLoading } from "~/components";
+import { useFetch, useRouter } from "~/hooks";
+import { password } from "~/store";
+import { Resp } from "~/types";
+import { handleRresp, r } from "~/utils";
+
+const AliDocPreview = () => {
+  const { pathname } = useRouter();
+  const [loading, post] = useFetch(
+    (): Promise<Resp<{ access_token: string; preview_url: string }>> =>
+      r.post("/fs/other", {
+        path: pathname(),
+        password: password(),
+        method: "doc_preview"
+      })
+  );
+  const init = async () => {
+    const resp = await post();
+    handleRresp(resp, (data) => {
+      const docOptions = aliyun.config({
+        mount: document.querySelector("#office-preview")!,
+        url: data.preview_url,
+      });
+      docOptions.setToken({ token: data.access_token });
+    });
+  };
+  init();
+  return (
+    <MaybeLoading loading={loading()}>
+      <Box w="$full" h="70vh" id="office-preview"></Box>
+    </MaybeLoading>
+  );
+};
+
+export default AliDocPreview;
diff --git a/src/pages/home/previews/index.ts b/src/pages/home/previews/index.ts
index 6a18468..77f7df7 100644
--- a/src/pages/home/previews/index.ts
+++ b/src/pages/home/previews/index.ts
@@ -55,6 +55,12 @@ const previews: Preview[] = [
     exts: ["plist"],
     component: lazy(() => import("./plist")),
   },
+  {
+    name: "Aliyun Office Previewer",
+    exts: ["doc", "docx", "ppt", "pptx", "xls", "xlsx", "pdf"],
+    provider: /Aliyundrive/,
+    component: lazy(() => import("./aliyun_office")),
+  },
 ];
 
 export const getPreviews = (