@voplus/morpho-document 1.4.99 → 1.4.101

package/es/pages/Signature/Envelope/EnvelopeRecipientView/index.js

@@ -1,42 +1,42 @@
-import "./index.less";
-import { Button, Card, Checkbox, Spin } from "@voplus/antd";
-import { EnvelopeContext, EnvelopeContextState } from "../../data/EnvelopeContext";
-import React, { useState } from "react";
-import { useApplicationContext, useLayout } from "@voplus/morpho-data";
-import { useEnvelope, useEnvelopeStore } from "../../data/envelope";
-import DescriptionEditor from "../../../../controls/DescriptionEditor";
-import { LoadingOutlined } from "@ant-design/icons";
-import MobileView from "./mobile";
-import PcView from "./pc";
-import { State } from "./state";
-import classnames from "classnames";
-import { observe } from "@voplus/morpho-ui";
-import { runInAction } from "mobx";
-import { useRouteMatch } from "react-router";
-const EnvelopeRecipientView = () => {
-    const sUserAgent = navigator.userAgent.toLowerCase();
-    const layout = useLayout();
-    const match = useRouteMatch();
-    const id = match.params.id;
-    const { user } = useApplicationContext();
-    const [state] = useState(new State(id));
-    const envelope = useEnvelope(id, { reload: true, includes: "tags,versions" });
-    const envelopStore = useEnvelopeStore();
-    const [context] = useState(new EnvelopeContextState(id, envelopStore, user.info.id, true));
-    const DescriptionPage = () => observe(() => (React.createElement("div", { className: "envelope-recipient_description_page" },
-        React.createElement(Card, { title: `Digital Signature Envelope - ${envelope.name || "***"}`, className: "steps-content" },
-            React.createElement(DescriptionEditor, { id: id, collapsible: false, description: envelope.description, readonly: true, padding: "0" }),
-            React.createElement("div", { style: { padding: "0 24px" } },
-                React.createElement(Checkbox, { checked: state.show, onChange: (e) => runInAction(() => {
-                        state.show = e.target.checked;
-                        state.setDoNotShow();
-                    }) }, "Do not show this page any more")),
-            React.createElement("div", { className: "continue-btn" },
-                React.createElement(Button, { type: "primary", onClick: () => runInAction(() => (state.continue = true)) }, "Continue"))))));
-    return observe(() => (React.createElement("div", { className: "envelope-client-view" },
-        envelope.loading ? (React.createElement("div", { style: { textAlign: "center" } },
-            React.createElement(Spin, { indicator: React.createElement(LoadingOutlined, { style: { fontSize: 30 }, spin: true }) }))) : envelope.description && !state.doNotShow && !state.continue ? (React.createElement(DescriptionPage, null)) : (React.createElement(EnvelopeContext.Provider, { value: context }, /ipad|iphone|midp|rv:1.2.3.4|ucweb|android|windows ce|windows mobile/.test(sUserAgent) ? (React.createElement(MobileView, { id: id })) : (React.createElement(PcView, { id: id })))),
-        React.createElement("div", { className: classnames("envelope-footer", { "footer-mobile": layout.ui.mobile }) }, "Powered by VO DigiSign"))));
-};
-export default EnvelopeRecipientView;
+import "./index.less";
+import { Button, Card, Checkbox, Spin } from "@voplus/antd";
+import { EnvelopeContext, EnvelopeContextState } from "../../data/EnvelopeContext";
+import React, { useState } from "react";
+import { useApplicationContext, useLayout } from "@voplus/morpho-data";
+import { useEnvelope, useEnvelopeStore } from "../../data/envelope";
+import DescriptionEditor from "../../../../controls/DescriptionEditor";
+import { LoadingOutlined } from "@ant-design/icons";
+import MobileView from "./mobile";
+import PcView from "./pc";
+import { State } from "./state";
+import classnames from "classnames";
+import { observe } from "@voplus/morpho-ui";
+import { runInAction } from "mobx";
+import { useRouteMatch } from "react-router";
+const EnvelopeRecipientView = () => {
+    const sUserAgent = navigator.userAgent.toLowerCase();
+    const layout = useLayout();
+    const match = useRouteMatch();
+    const id = match.params.id;
+    const { user } = useApplicationContext();
+    const [state] = useState(new State(id));
+    const envelope = useEnvelope(id, { reload: true, includes: "tags,versions" });
+    const envelopStore = useEnvelopeStore();
+    const [context] = useState(new EnvelopeContextState(id, envelopStore, user.info.id, true));
+    const DescriptionPage = () => observe(() => (React.createElement("div", { className: "envelope-recipient_description_page" },
+        React.createElement(Card, { title: `Digital Signature Envelope - ${envelope.name || "***"}`, className: "steps-content" },
+            React.createElement(DescriptionEditor, { id: id, collapsible: false, description: envelope.description, readonly: true, padding: "0" }),
+            React.createElement("div", { style: { padding: "0 24px" } },
+                React.createElement(Checkbox, { checked: state.show, onChange: (e) => runInAction(() => {
+                        state.show = e.target.checked;
+                        state.setDoNotShow();
+                    }) }, "Do not show this page any more")),
+            React.createElement("div", { className: "continue-btn" },
+                React.createElement(Button, { type: "primary", onClick: () => runInAction(() => (state.continue = true)) }, "Continue"))))));
+    return observe(() => (React.createElement("div", { className: "envelope-client-view" },
+        envelope.loading ? (React.createElement("div", { style: { textAlign: "center" } },
+            React.createElement(Spin, { indicator: React.createElement(LoadingOutlined, { style: { fontSize: 30 }, spin: true }) }))) : envelope.description && !state.doNotShow && !state.continue ? (React.createElement(DescriptionPage, null)) : (React.createElement(EnvelopeContext.Provider, { value: context }, /ipad|iphone|midp|rv:1.2.3.4|ucweb|android|windows ce|windows mobile/.test(sUserAgent) ? (React.createElement(MobileView, { id: id })) : (React.createElement(PcView, { id: id })))),
+        React.createElement("div", { className: classnames("envelope-footer", { "footer-mobile": layout.ui.mobile }) }, "Powered by VO DigiSign"))));
+};
+export default EnvelopeRecipientView;
 //# sourceMappingURL=index.js.map

package/es/pages/Signature/Envelope/EnvelopeRecipientView/index.less

@@ -0,0 +1,36 @@
+:global {
+	.envelope-recipient_description_page {
+		height: 100%;
+		padding: 70px 30px;
+		background-color: #f5f5f5;
+		.ant-card {
+			width: 60%;
+			min-width: 300px;
+			margin: auto;
+			.ant-card-body {
+				padding: 0;
+				max-height: calc(100vh - 240px);
+				overflow-y: auto;
+				.continue-btn {
+					padding: 20px 24px;
+				}
+			}
+			.description-editor .description-readonly-proseMirror .ProseMirror-container .ProseMirror {
+				padding: 20px 24px;
+			}
+		}
+	}
+	.envelope-client-view {
+		height: 100%;
+		display: flex;
+		flex-direction: column;
+		.envelope-footer {
+			color: gray;
+			text-align: center;
+			padding: 20px;
+		}
+		.footer-mobile {
+			font-size: 12px;
+		}
+	}
+}

package/es/pages/Signature/Envelope/EnvelopeRecipientView/mobile/index.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
-import "./index.less";
-declare const MobileView: (props: {
-    id: string;
-}) => JSX.Element;
-export default MobileView;
+/// <reference types="react" />
+import "./index.less";
+declare const MobileView: (props: {
+    id: string;
+}) => JSX.Element;
+export default MobileView;

package/es/pages/Signature/Envelope/EnvelopeRecipientView/mobile/index.js

@@ -1,63 +1,63 @@
-import "./index.less";
-import { Button, Empty, Spin } from "@voplus/antd";
-import { useEnvelopContext, } from "../../../data/EnvelopeContext";
-import { useEnvelope } from "../../../data/envelope";
-import React, { useEffect, useState } from "react";
-import { faBars, faList } from "@fortawesome/pro-light-svg-icons";
-import { useTabItem } from "@voplus/morpho-data";
-import ActivityLog from "@voplus/morpho-org/es/components/ActivityLog/ActivityLog2";
-import { FontAwesomeIcon as FAIcon } from "@fortawesome/react-fontawesome";
-import LetterContentView from "../../../Letter/LetterContentView";
-import LetterList from "../../../Letter/LetterList";
-import { State } from "./state";
-import TourGuide from "../TourGuide";
-import { observe } from "@voplus/morpho-ui";
-const MobileView = (props) => {
-    const { id } = props;
-    const tab = useTabItem();
-    const envelope = useEnvelope(id, { includes: "tags,versions" });
-    // const envelopStore = useEnvelopeStore();
-    // const [context] = useState(new EnvelopeContextState(id, envelopStore));
-    const context = useEnvelopContext();
-    const [state] = useState(new State());
-    const [letter, setLetter] = useState();
-    const [activeId, setActiveId] = useState("");
-    context.update(envelope);
-    useEffect(() => {
-        /**只顯示當前用戶有签名的Letter或Letter为 Public */
-        const letters = context.getMyLetter(envelope.letters);
-        context.union(letters || []);
-        if (letters && letters.length) {
-            /** LetterContentView 需要letterId 转换 pdf 文件流 */
-            setLetter(letters[0]);
-        }
-    }, [envelope.letters]);
-    useEffect(() => {
-        tab.title = envelope === null || envelope === void 0 ? void 0 : envelope.name;
-    }, [envelope === null || envelope === void 0 ? void 0 : envelope.name]);
-    return observe(() => (React.createElement(React.Fragment, null,
-        React.createElement(TourGuide, null),
-        React.createElement("div", { className: "envelope-recipient-view_mobile" },
-            React.createElement("header", null,
-                React.createElement(Button, { size: "small", className: "list-menus-btn", onClick: state.onVisibleList, "data-tut": "document-list" },
-                    React.createElement(FAIcon, { icon: faList })),
-                React.createElement("div", { className: "title" }, state.listMenu
-                    ? "Letter List"
-                    : state.activityMenu
-                        ? "Activity Log"
-                        : (letter === null || letter === void 0 ? void 0 : letter.document.name) || ""),
-                React.createElement(Button, { size: "small", onClick: state.onVisibleActivity, "data-tut": "activity-log" },
-                    React.createElement(FAIcon, { icon: faBars }))),
-            envelope.loading || context.loading ? (React.createElement(Spin, null)) : (letter === null || letter === void 0 ? void 0 : letter.document.id) ? (React.createElement(React.Fragment, null, state.listMenu ? (React.createElement(LetterList, { id: id, recipient: true, activeId: activeId, onClick: onDocumentSelected })) : state.activityMenu ? (React.createElement(ActivityLog, { id: id, isHeader: false })) : (React.createElement(LetterContentView, { envelopeId: id, letter: letter, onOpen: onDocumentSelected })))) : (React.createElement(Empty, { image: Empty.PRESENTED_IMAGE_SIMPLE }))))));
-    /** 查看Letter Item Content */
-    function onDocumentSelected(id) {
-        setActiveId(id);
-        if (!context.letters)
-            return;
-        const letter = context.letters.find((l) => l.document.id === id);
-        setLetter(letter || {});
-        state.listMenu = false;
-    }
-};
-export default MobileView;
+import "./index.less";
+import { Button, Empty, Spin } from "@voplus/antd";
+import { useEnvelopContext, } from "../../../data/EnvelopeContext";
+import { useEnvelope } from "../../../data/envelope";
+import React, { useEffect, useState } from "react";
+import { faBars, faList } from "@fortawesome/pro-light-svg-icons";
+import { useTabItem } from "@voplus/morpho-data";
+import ActivityLog from "@voplus/morpho-org/es/components/ActivityLog/ActivityLog2";
+import { FontAwesomeIcon as FAIcon } from "@fortawesome/react-fontawesome";
+import LetterContentView from "../../../Letter/LetterContentView";
+import LetterList from "../../../Letter/LetterList";
+import { State } from "./state";
+import TourGuide from "../TourGuide";
+import { observe } from "@voplus/morpho-ui";
+const MobileView = (props) => {
+    const { id } = props;
+    const tab = useTabItem();
+    const envelope = useEnvelope(id, { includes: "tags,versions" });
+    // const envelopStore = useEnvelopeStore();
+    // const [context] = useState(new EnvelopeContextState(id, envelopStore));
+    const context = useEnvelopContext();
+    const [state] = useState(new State());
+    const [letter, setLetter] = useState();
+    const [activeId, setActiveId] = useState("");
+    context.update(envelope);
+    useEffect(() => {
+        /**只顯示當前用戶有签名的Letter或Letter为 Public */
+        const letters = context.getMyLetter(envelope.letters);
+        context.union(letters || []);
+        if (letters && letters.length) {
+            /** LetterContentView 需要letterId 转换 pdf 文件流 */
+            setLetter(letters[0]);
+        }
+    }, [envelope.letters]);
+    useEffect(() => {
+        tab.title = envelope === null || envelope === void 0 ? void 0 : envelope.name;
+    }, [envelope === null || envelope === void 0 ? void 0 : envelope.name]);
+    return observe(() => (React.createElement(React.Fragment, null,
+        React.createElement(TourGuide, null),
+        React.createElement("div", { className: "envelope-recipient-view_mobile" },
+            React.createElement("header", null,
+                React.createElement(Button, { size: "small", className: "list-menus-btn", onClick: state.onVisibleList, "data-tut": "document-list" },
+                    React.createElement(FAIcon, { icon: faList })),
+                React.createElement("div", { className: "title" }, state.listMenu
+                    ? "Letter List"
+                    : state.activityMenu
+                        ? "Activity Log"
+                        : (letter === null || letter === void 0 ? void 0 : letter.document.name) || ""),
+                React.createElement(Button, { size: "small", onClick: state.onVisibleActivity, "data-tut": "activity-log" },
+                    React.createElement(FAIcon, { icon: faBars }))),
+            envelope.loading || context.loading ? (React.createElement(Spin, null)) : (letter === null || letter === void 0 ? void 0 : letter.document.id) ? (React.createElement(React.Fragment, null, state.listMenu ? (React.createElement(LetterList, { id: id, recipient: true, activeId: activeId, onClick: onDocumentSelected })) : state.activityMenu ? (React.createElement(ActivityLog, { id: id, isHeader: false })) : (React.createElement(LetterContentView, { envelopeId: id, letter: letter, onOpen: onDocumentSelected })))) : (React.createElement(Empty, { image: Empty.PRESENTED_IMAGE_SIMPLE }))))));
+    /** 查看Letter Item Content */
+    function onDocumentSelected(id) {
+        setActiveId(id);
+        if (!context.letters)
+            return;
+        const letter = context.letters.find((l) => l.document.id === id);
+        setLetter(letter || {});
+        state.listMenu = false;
+    }
+};
+export default MobileView;
 //# sourceMappingURL=index.js.map

package/es/pages/Signature/Envelope/EnvelopeRecipientView/mobile/index.less

@@ -0,0 +1,42 @@
+:global {
+	.envelope-recipient-view_mobile {
+		display: flex;
+		flex-direction: column;
+		height: 100%;
+		header {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			padding: 10px 20px;
+			border-bottom: 1px solid #f2f2f2;
+			.list-menus-btn {
+				border: #000;
+				color: #fff;
+				background-color: #000;
+			}
+			.title {
+				padding: 0 10px;
+				color: #000;
+				font-weight: 500;
+				font-size: 15px;
+				line-height: 15px;
+			}
+		}
+		.letter-content-view .pdf-viewer-toolbar {
+			border-top: 0;
+		}
+		.letter-view-upload {
+			.ant-menu-item {
+				height: auto;
+			}
+			.letter-item {
+				padding: 0;
+				.document-name-content {
+					> div {
+						display: flex;
+					}
+				}
+			}
+		}
+	}
+}

package/es/pages/Signature/Envelope/EnvelopeRecipientView/mobile/state.d.ts

@@ -1,9 +1,9 @@
-export declare class State {
-    /** visible of 平板或者手机模式显示DocumentTabs */
-    listMenu: boolean;
-    /** visible of 平板或者手机模式显示DocumentTabs */
-    activityMenu: boolean;
-    constructor();
-    onVisibleList: () => void;
-    onVisibleActivity: () => void;
-}
+export declare class State {
+    /** visible of 平板或者手机模式显示DocumentTabs */
+    listMenu: boolean;
+    /** visible of 平板或者手机模式显示DocumentTabs */
+    activityMenu: boolean;
+    constructor();
+    onVisibleList: () => void;
+    onVisibleActivity: () => void;
+}

package/es/pages/Signature/Envelope/EnvelopeRecipientView/mobile/state.js

@@ -1,52 +1,52 @@
-import { __decorate } from "tslib";
-import { action, makeObservable, observable } from "mobx";
-export class State {
-    constructor() {
-        /** visible of 平板或者手机模式显示DocumentTabs */
-        Object.defineProperty(this, "listMenu", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        /** visible of 平板或者手机模式显示DocumentTabs */
-        Object.defineProperty(this, "activityMenu", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        Object.defineProperty(this, "onVisibleList", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: () => {
-                this.listMenu = !this.listMenu;
-                this.activityMenu = false;
-            }
-        });
-        Object.defineProperty(this, "onVisibleActivity", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: () => {
-                this.activityMenu = !this.activityMenu;
-                this.listMenu = false;
-            }
-        });
-        makeObservable(this);
-    }
-}
-__decorate([
-    observable
-], State.prototype, "listMenu", void 0);
-__decorate([
-    observable
-], State.prototype, "activityMenu", void 0);
-__decorate([
-    action
-], State.prototype, "onVisibleList", void 0);
-__decorate([
-    action
-], State.prototype, "onVisibleActivity", void 0);
+import { __decorate } from "tslib";
+import { action, makeObservable, observable } from "mobx";
+export class State {
+    constructor() {
+        /** visible of 平板或者手机模式显示DocumentTabs */
+        Object.defineProperty(this, "listMenu", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: false
+        });
+        /** visible of 平板或者手机模式显示DocumentTabs */
+        Object.defineProperty(this, "activityMenu", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: false
+        });
+        Object.defineProperty(this, "onVisibleList", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                this.listMenu = !this.listMenu;
+                this.activityMenu = false;
+            }
+        });
+        Object.defineProperty(this, "onVisibleActivity", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                this.activityMenu = !this.activityMenu;
+                this.listMenu = false;
+            }
+        });
+        makeObservable(this);
+    }
+}
+__decorate([
+    observable
+], State.prototype, "listMenu", void 0);
+__decorate([
+    observable
+], State.prototype, "activityMenu", void 0);
+__decorate([
+    action
+], State.prototype, "onVisibleList", void 0);
+__decorate([
+    action
+], State.prototype, "onVisibleActivity", void 0);
 //# sourceMappingURL=state.js.map

package/es/pages/Signature/Envelope/EnvelopeRecipientView/pc/index.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
-import "./index.less";
-declare const PcView: (props: {
-    id: string;
-}) => JSX.Element;
-export default PcView;
+/// <reference types="react" />
+import "./index.less";
+declare const PcView: (props: {
+    id: string;
+}) => JSX.Element;
+export default PcView;

package/es/pages/Signature/Envelope/EnvelopeRecipientView/pc/index.js

@@ -1,58 +1,58 @@
-import "./index.less";
-import { Empty, Spin } from "@voplus/antd";
-import { useEnvelope } from "../../../data/envelope";
-import { MainContent } from "@voplus/morpho-ui";
-import React, { useEffect, useState } from "react";
-import ActivityLog from "@voplus/morpho-org/es/components/ActivityLog/ActivityLog2";
-import { FontAwesomeIcon as FAIcon } from "@fortawesome/react-fontawesome";
-import LetterContentView from "../../../Letter/LetterContentView";
-import LetterList from "../../../Letter/LetterList";
-import { LoadingOutlined } from "@ant-design/icons";
-import classnames from "classnames";
-import { faUserChart } from "@fortawesome/pro-light-svg-icons";
-import { observe } from "@voplus/morpho-ui";
-import { useEnvelopContext } from "../../../data/EnvelopeContext";
-import { useTabItem } from "@voplus/morpho-data";
-const PcView = (props) => {
-    const { id } = props;
-    const envelope = useEnvelope(id, { includes: "tags,versions" });
-    // const envelopStore = useEnvelopeStore();
-    // const [context] = useState(new EnvelopeContextState(id, envelopStore));
-    const context = useEnvelopContext();
-    const [letter, setLetter] = useState();
-    const tab = useTabItem();
-    context.update(envelope);
-    useEffect(() => {
-        tab.title = envelope === null || envelope === void 0 ? void 0 : envelope.name;
-    }, [envelope === null || envelope === void 0 ? void 0 : envelope.name]);
-    useEffect(() => {
-        /**只顯示當前用戶有签名的Letter或Letter为 Public */
-        const letters = context.getMyLetter(envelope.letters);
-        context.union(letters || []);
-        if (letters && letters.length) {
-            /** LetterContentView 需要letterId 转换 pdf 文件流 */
-            setLetter(letters[0]);
-        }
-    }, [envelope.letters]);
-    const LoadingElement = (props) => (React.createElement("div", { className: classnames("loading", props.className) },
-        React.createElement(Spin, { tip: "Loading...", indicator: React.createElement(LoadingOutlined, { style: { fontSize: 24 }, spin: true }) })));
-    return observe(() => (
-    // <EnvelopeContext.Provider value={context}>
-    React.createElement(MainContent, { className: "envelope-recipient-view_pc" },
-        React.createElement(MainContent.Nav, { collapsible: true, className: "envelope-recipient-letter_list" }, envelope.loading || context.loading ? (React.createElement(LoadingElement, null)) : (React.createElement(React.Fragment, null,
-            React.createElement("div", { className: "title" }, "Documents"),
-            React.createElement(LetterList, { id: id, recipient: true, onClick: onDocumentSelected })))),
-        envelope.loading || context.loading ? (React.createElement(LoadingElement, null)) : (letter === null || letter === void 0 ? void 0 : letter.document.id) ? (React.createElement(LetterContentView, { envelopeId: id, letter: letter, onOpen: onDocumentSelected })) : (React.createElement(Empty, { image: Empty.PRESENTED_IMAGE_SIMPLE })),
-        React.createElement(MainContent.Nav, { collapsible: true, shadow: "light", position: "right", className: "envelope-recipient-activity", foldIcon: React.createElement(FAIcon, { icon: faUserChart }) }, context.loading ? React.createElement(LoadingElement, null) : React.createElement(ActivityLog, { id: id })),
-        React.createElement(React.Fragment, null, context.downloadLoading && React.createElement(LoadingElement, { className: "blocking" })))
-    // </EnvelopeContext.Provider>
-    ));
-    function onDocumentSelected(id) {
-        if (!context.letters)
-            return;
-        const letter = context.letters.find((l) => l.document.id === id);
-        setLetter(letter || {});
-    }
-};
-export default PcView;
+import "./index.less";
+import { Empty, Spin } from "@voplus/antd";
+import { useEnvelope } from "../../../data/envelope";
+import { MainContent } from "@voplus/morpho-ui";
+import React, { useEffect, useState } from "react";
+import ActivityLog from "@voplus/morpho-org/es/components/ActivityLog/ActivityLog2";
+import { FontAwesomeIcon as FAIcon } from "@fortawesome/react-fontawesome";
+import LetterContentView from "../../../Letter/LetterContentView";
+import LetterList from "../../../Letter/LetterList";
+import { LoadingOutlined } from "@ant-design/icons";
+import classnames from "classnames";
+import { faUserChart } from "@fortawesome/pro-light-svg-icons";
+import { observe } from "@voplus/morpho-ui";
+import { useEnvelopContext } from "../../../data/EnvelopeContext";
+import { useTabItem } from "@voplus/morpho-data";
+const PcView = (props) => {
+    const { id } = props;
+    const envelope = useEnvelope(id, { includes: "tags,versions" });
+    // const envelopStore = useEnvelopeStore();
+    // const [context] = useState(new EnvelopeContextState(id, envelopStore));
+    const context = useEnvelopContext();
+    const [letter, setLetter] = useState();
+    const tab = useTabItem();
+    context.update(envelope);
+    useEffect(() => {
+        tab.title = envelope === null || envelope === void 0 ? void 0 : envelope.name;
+    }, [envelope === null || envelope === void 0 ? void 0 : envelope.name]);
+    useEffect(() => {
+        /**只顯示當前用戶有签名的Letter或Letter为 Public */
+        const letters = context.getMyLetter(envelope.letters);
+        context.union(letters || []);
+        if (letters && letters.length) {
+            /** LetterContentView 需要letterId 转换 pdf 文件流 */
+            setLetter(letters[0]);
+        }
+    }, [envelope.letters]);
+    const LoadingElement = (props) => (React.createElement("div", { className: classnames("loading", props.className) },
+        React.createElement(Spin, { tip: "Loading...", indicator: React.createElement(LoadingOutlined, { style: { fontSize: 24 }, spin: true }) })));
+    return observe(() => (
+    // <EnvelopeContext.Provider value={context}>
+    React.createElement(MainContent, { className: "envelope-recipient-view_pc" },
+        React.createElement(MainContent.Nav, { collapsible: true, className: "envelope-recipient-letter_list" }, envelope.loading || context.loading ? (React.createElement(LoadingElement, null)) : (React.createElement(React.Fragment, null,
+            React.createElement("div", { className: "title" }, "Documents"),
+            React.createElement(LetterList, { id: id, recipient: true, onClick: onDocumentSelected })))),
+        envelope.loading || context.loading ? (React.createElement(LoadingElement, null)) : (letter === null || letter === void 0 ? void 0 : letter.document.id) ? (React.createElement(LetterContentView, { envelopeId: id, letter: letter, onOpen: onDocumentSelected })) : (React.createElement(Empty, { image: Empty.PRESENTED_IMAGE_SIMPLE })),
+        React.createElement(MainContent.Nav, { collapsible: true, shadow: "light", position: "right", className: "envelope-recipient-activity", foldIcon: React.createElement(FAIcon, { icon: faUserChart }) }, context.loading ? React.createElement(LoadingElement, null) : React.createElement(ActivityLog, { id: id })),
+        React.createElement(React.Fragment, null, context.downloadLoading && React.createElement(LoadingElement, { className: "blocking" })))
+    // </EnvelopeContext.Provider>
+    ));
+    function onDocumentSelected(id) {
+        if (!context.letters)
+            return;
+        const letter = context.letters.find((l) => l.document.id === id);
+        setLetter(letter || {});
+    }
+};
+export default PcView;
 //# sourceMappingURL=index.js.map

package/es/pages/Signature/Envelope/EnvelopeRecipientView/pc/index.less

@@ -0,0 +1,53 @@
+:global {
+	.envelope-recipient-view_pc {
+		overflow: hidden;
+		.title {
+			padding: 10px 20px;
+			font-size: 18px;
+			line-height: 20px;
+			color: #000;
+			font-weight: 500;
+		}
+		.envelope-recipient-letter_list {
+			// width: 22%;
+			.main-nav-container {
+				display: flex;
+				flex-direction: column;
+				height: 100%;
+				.letter-view-upload {
+					height: 100%;
+				}
+				.add-tag-btn {
+					display: none;
+				}
+				.letter-item {
+					padding: 0;
+					.document-name {
+						color: inherit;
+					}
+				}
+			}
+		}
+		.envelope-recipient-activity {
+			width: 30%;
+		}
+		.loading {
+			padding: 20px 0;
+			text-align: center;
+			&.blocking {
+				position: absolute;
+				top: 0;
+				right: 0;
+				bottom: 0;
+				left: 0;
+				z-index: 999;
+				background-color: rgba(255, 255, 255, 0.5);
+				> div {
+					position: relative;
+					top: 50%;
+					margin-top: -70px;
+				}
+			}
+		}
+	}
+}

package/es/pages/Signature/Envelope/EnvelopeRecipientView/state.d.ts

@@ -1,15 +1,15 @@
-export declare class State {
-    _id: string;
-    /** visible of EnvelopeRecipient */
-    continue: boolean;
-    /** visible of DescriptionPage  */
-    show: boolean;
-    /** open of TourGuide */
-    isTourOpen: boolean;
-    constructor(_id: string);
-    get doNotShow(): boolean;
-    get doNotShowMap(): any;
-    get tourVisible(): boolean;
-    setDoNotShow(): void;
-    closeTour: () => void;
-}
+export declare class State {
+    _id: string;
+    /** visible of EnvelopeRecipient */
+    continue: boolean;
+    /** visible of DescriptionPage  */
+    show: boolean;
+    /** open of TourGuide */
+    isTourOpen: boolean;
+    constructor(_id: string);
+    get doNotShow(): boolean;
+    get doNotShowMap(): any;
+    get tourVisible(): boolean;
+    setDoNotShow(): void;
+    closeTour: () => void;
+}