cnhis-design-vue 3.1.31-beta.3 → 3.1.31-beta.5

package/es/components/button-print/src/utils/dialog.js

@@ -1,5 +1,6 @@
 import { ref, render, createVNode, withCtx, nextTick, defineComponent, provide } from 'vue';
 import IdentityVerification from '../components/IdentityVerification.js';
+import Preview from '../components/Preview.js';
 
 class IdentityVerificationDialog {
   constructor() {
@@ -15,7 +16,7 @@ class IdentityVerificationDialog {
       this.rendered = true;
       const container = document.createElement("div");
       const visible = ref(false);
-      const ProviderWrapper = this.createProviderWrapper(instance);
+      const ProviderWrapper = createProviderWrapper(instance);
       render(createVNode(ProviderWrapper, null, {
         default: withCtx(() => createVNode(IdentityVerification, {
           "to": container,
@@ -51,29 +52,70 @@ class IdentityVerificationDialog {
       }
     });
   }
-  createProviderWrapper(instance) {
-    return defineComponent({
-      setup(_, {
-        slots
-      }) {
-        let provides = (instance == null ? void 0 : instance.parent) && Reflect.get(instance.parent, "provides");
-        const keys = [];
-        while (provides) {
-          Object.entries(provides).forEach(([k, v]) => {
-            if (keys.includes(k))
-              return;
-            keys.push(k);
-            provide(k, v);
-          });
-          provides = Object.getPrototypeOf(provides);
-        }
-        return () => {
-          var _a;
-          return createVNode("div", null, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
-        };
+}
+class PreviewDialog {
+  constructor() {
+    this.rendered = false;
+  }
+  static createMsg(message) {
+    return `[PreviewDialog] ${message}`;
+  }
+  show(instance, src) {
+    if (this.rendered)
+      return Promise.reject(PreviewDialog.createMsg("\u8BF7\u52FF\u91CD\u590D\u6253\u5F00\u5F39\u7A97"));
+    return new Promise((resolve, reject) => {
+      this.rendered = true;
+      const container = document.createElement("div");
+      const visible = ref(false);
+      const ProviderWrapper = createProviderWrapper(instance);
+      render(createVNode(ProviderWrapper, null, {
+        default: withCtx(() => createVNode(Preview, {
+          "visible": visible.value,
+          "onUpdate:visible": ($event) => visible.value = $event,
+          "src": src,
+          "onAfterLeave": () => unmount(container)
+        }, null), instance)
+      }), container);
+      mount(container);
+      nextTick(() => {
+        visible.value = true;
+        resolve("success");
+      });
+      function mount(target) {
+        document.body.appendChild(target);
+      }
+      const that = this;
+      function unmount(target) {
+        if (!target.parentElement)
+          return;
+        that.rendered = false;
+        target.parentElement.removeChild(target);
       }
     });
   }
 }
+function createProviderWrapper(instance) {
+  return defineComponent({
+    setup(_, {
+      slots
+    }) {
+      let provides = (instance == null ? void 0 : instance.parent) && Reflect.get(instance.parent, "provides");
+      const keys = [];
+      while (provides) {
+        Object.entries(provides).forEach(([k, v]) => {
+          if (keys.includes(k))
+            return;
+          keys.push(k);
+          provide(k, v);
+        });
+        provides = Object.getPrototypeOf(provides);
+      }
+      return () => {
+        var _a;
+        return createVNode("div", null, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
+      };
+    }
+  });
+}
 
-export { IdentityVerificationDialog };
+export { IdentityVerificationDialog, PreviewDialog };

package/es/components/button-print/src/utils/print.d.ts

@@ -1,9 +1,11 @@
 import { AnyObject, Func } from '../../../../../es/shared/types';
-import { IdentityVerificationDialog } from '../../../../../es/components/button-print/src/utils/dialog';
+import { IdentityVerificationDialog, PreviewDialog } from '../../../../../es/components/button-print/src/utils/dialog';
 export declare class Print {
     private readonly webview;
     private currentMessageHandler?;
     private dialog;
+    private dialogPreview;
+    private instance;
     constructor();
     private readonly messageHandlerQueue;
     private messageHandler;
@@ -13,6 +15,7 @@ export declare class Print {
      * @desc 调用实例方法打开弹窗
      */
     show(...args: Parameters<IdentityVerificationDialog['show']>): Promise<string>;
+    showPreview(...args: Parameters<PreviewDialog['show']>): Promise<string>;
     _testConnection(): Promise<unknown>;
     _queryServicesPrint(params: AnyObject): Promise<any>;
     _callPrintWithFile(queryParams: AnyObject): Promise<any>;

package/es/components/button-print/src/utils/print.js

@@ -1,7 +1,8 @@
 import axios from 'axios';
 import { isArray } from 'lodash-es';
-import { IdentityVerificationDialog } from './dialog.js';
+import { IdentityVerificationDialog, PreviewDialog } from './dialog.js';
 import { isIReport, useBrowserPrint } from './browserPrint.js';
+import { getCurrentInstance } from 'vue';
 
 const PRINT_ORIGIN = "http://127.0.0.1:11111";
 const EDIT_LOCAL_URL = `${PRINT_ORIGIN}/services/print`;
@@ -24,6 +25,8 @@ const ERRORMSG = "\u83B7\u53D6\u6587\u4EF6\u5931\u8D25\uFF01";
 class Print {
   constructor() {
     this.dialog = new IdentityVerificationDialog();
+    this.dialogPreview = new PreviewDialog();
+    this.instance = null;
     this.messageHandlerQueue = [];
     var _a;
     const _window = window;
@@ -62,6 +65,9 @@ class Print {
   show(...args) {
     return this.dialog.show(...args);
   }
+  showPreview(...args) {
+    return this.dialogPreview.show(...args);
+  }
   _testConnection() {
     if (this.webview)
       return Promise.resolve(true);
@@ -244,7 +250,10 @@ class Print {
       const data = await this._queryPrintFile(formatId, params);
       if (!data)
         return errorCallbackFn == null ? void 0 : errorCallbackFn(ERRORMSG);
-      useBrowserPrint(data, "preview");
+      const src = useBrowserPrint(data, "preview");
+      if (!this.instance)
+        this.instance = getCurrentInstance();
+      this.showPreview(this.instance, src);
       successCallbackFn == null ? void 0 : successCallbackFn({ file: data });
       return;
     }

package/es/components/button-print/style/index.css

@@ -1 +1 @@
-.dropdown-button{border-color:#d5d5d5!important;color:#212121}.c-dropdown .n-dropdown-menu-wrapper span.active{color:#5585f5}.login-form-button{border-radius:24px;color:#fff;font-size:16px;height:50px;width:100%}.login-form-button-print{padding-top:15px}.login-form-button-print .n-input{border-radius:6px;color:#757575;font-size:14px;height:50px;line-height:50px}.c-button-print-modal .n-form-item-feedback-wrapper{display:none}
+.dropdown-button{border-color:#d5d5d5!important;color:#212121}.c-dropdown .n-dropdown-menu-wrapper span.active{color:#5585f5}.login-form-button{border-radius:24px;color:#fff;font-size:16px;height:50px;width:100%}.login-form-button-print{padding-top:15px}.login-form-button-print .n-input{border-radius:6px;color:#757575;font-size:14px;height:50px;line-height:50px}.c-button-print-modal .n-form-item-feedback-wrapper{display:none}.c-button-preview-modal{max-width:none}.c-button-preview-modal .n-dialog__content{height:98%}