cnhis-design-vue 3.3.3-release.9 → 3.4.0-beta.1

package/es/components/iho-chat/src/components/ChatRecord.vue.d.ts

@@ -21,7 +21,30 @@ declare const _default: import("vue").DefineComponent<{
         currentSessionItem: AnyObject;
         id: string;
         userInfo: AnyObject;
-        msgList: AnyObject[];
+        msgList: {
+            [x: string]: any;
+            id: string;
+            sessionKey: string;
+            content: {
+                [x: string]: any;
+                chatMessageType: string;
+                msg: string;
+                referenceContent?: any;
+                forwardMessageList?: AnyObject[] | undefined;
+                messageTemplate?: any;
+                messageTemplateData?: any;
+                fileUrl?: string | undefined;
+                avStatus?: string | undefined;
+            };
+            senderName: string;
+            sendTime: string;
+            sender: string;
+            status: string;
+            senderAvatar: string;
+            __content: string;
+            __time?: string | undefined;
+            __sendTime?: string | undefined;
+        }[];
         currentMsg: AnyObject;
         isAppendMsg: boolean;
         sessionList: AnyObject[];
@@ -222,7 +245,7 @@ declare const _default: import("vue").DefineComponent<{
     MESSAGE_TYPE: typeof MESSAGE_TYPE;
     emojis: {
         default: string[][];
-        findEmoji(name: string): any;
+        findEmoji(name: string): string | undefined;
     };
     MessageEvent: import("vue").DefineComponent<{
         data: {
@@ -241,7 +264,30 @@ declare const _default: import("vue").DefineComponent<{
             currentSessionItem: AnyObject;
             id: string;
             userInfo: AnyObject;
-            msgList: AnyObject[];
+            msgList: {
+                [x: string]: any;
+                id: string;
+                sessionKey: string;
+                content: {
+                    [x: string]: any;
+                    chatMessageType: string;
+                    msg: string;
+                    referenceContent?: any;
+                    forwardMessageList?: AnyObject[] | undefined;
+                    messageTemplate?: any;
+                    messageTemplateData?: any;
+                    fileUrl?: string | undefined;
+                    avStatus?: string | undefined;
+                };
+                senderName: string;
+                sendTime: string;
+                sender: string;
+                status: string;
+                senderAvatar: string;
+                __content: string;
+                __time?: string | undefined;
+                __sendTime?: string | undefined;
+            }[];
             currentMsg: AnyObject;
             isAppendMsg: boolean;
             sessionList: AnyObject[];

package/es/components/iho-chat/src/components/ChatSearch.vue.d.ts

@@ -11,7 +11,30 @@ declare const _default: import("vue").DefineComponent<{}, {
         currentSessionItem: AnyObject;
         id: string;
         userInfo: AnyObject;
-        msgList: AnyObject[];
+        msgList: {
+            [x: string]: any;
+            id: string;
+            sessionKey: string;
+            content: {
+                [x: string]: any;
+                chatMessageType: string;
+                msg: string;
+                referenceContent?: any;
+                forwardMessageList?: AnyObject[] | undefined;
+                messageTemplate?: any;
+                messageTemplateData?: any;
+                fileUrl?: string | undefined;
+                avStatus?: string | undefined;
+            };
+            senderName: string;
+            sendTime: string;
+            sender: string;
+            status: string;
+            senderAvatar: string;
+            __content: string;
+            __time?: string | undefined;
+            __sendTime?: string | undefined;
+        }[];
         currentMsg: AnyObject;
         isAppendMsg: boolean;
         sessionList: AnyObject[];

package/es/components/iho-chat/src/components/ChatSet.vue.d.ts

@@ -10,7 +10,30 @@ declare const _default: import("vue").DefineComponent<{}, {
         currentSessionItem: AnyObject;
         id: string;
         userInfo: AnyObject;
-        msgList: AnyObject[];
+        msgList: {
+            [x: string]: any;
+            id: string;
+            sessionKey: string;
+            content: {
+                [x: string]: any;
+                chatMessageType: string;
+                msg: string;
+                referenceContent?: any;
+                forwardMessageList?: AnyObject[] | undefined;
+                messageTemplate?: any;
+                messageTemplateData?: any;
+                fileUrl?: string | undefined;
+                avStatus?: string | undefined;
+            };
+            senderName: string;
+            sendTime: string;
+            sender: string;
+            status: string;
+            senderAvatar: string;
+            __content: string;
+            __time?: string | undefined;
+            __sendTime?: string | undefined;
+        }[];
         currentMsg: AnyObject;
         isAppendMsg: boolean;
         sessionList: AnyObject[];
@@ -131,7 +154,30 @@ declare const _default: import("vue").DefineComponent<{}, {
             currentSessionItem: AnyObject;
             id: string;
             userInfo: AnyObject;
-            msgList: AnyObject[];
+            msgList: {
+                [x: string]: any;
+                id: string;
+                sessionKey: string;
+                content: {
+                    [x: string]: any;
+                    chatMessageType: string;
+                    msg: string;
+                    referenceContent?: any;
+                    forwardMessageList?: AnyObject[] | undefined;
+                    messageTemplate?: any;
+                    messageTemplateData?: any;
+                    fileUrl?: string | undefined;
+                    avStatus?: string | undefined;
+                };
+                senderName: string;
+                sendTime: string;
+                sender: string;
+                status: string;
+                senderAvatar: string;
+                __content: string;
+                __time?: string | undefined;
+                __sendTime?: string | undefined;
+            }[];
             currentMsg: AnyObject;
             isAppendMsg: boolean;
             sessionList: AnyObject[];

package/es/components/iho-chat/src/components/ContextMenu.js

@@ -119,7 +119,7 @@ var ContextMenu = /* @__PURE__ */ defineComponent({
       label: "\u79FB\u9664\u4F1A\u8BDD",
       key: "remove"
     }];
-    const menuRef = ref(null);
+    const menuRef = ref();
     const item = computed(() => {
       const list = props.type === "message" ? state.msgList : state.sessionList;
       return list.find(({
@@ -168,6 +168,7 @@ var ContextMenu = /* @__PURE__ */ defineComponent({
       emit("update:show", false);
     });
     async function clickMenu(key) {
+      var _a;
       emit("update:show", false);
       const {
         content = {},
@@ -184,27 +185,41 @@ var ContextMenu = /* @__PURE__ */ defineComponent({
             if (!content.msg)
               return console.log("\u590D\u5236\u5185\u5BB9\u4E3A\u7A7A\uFF01");
             const isSupported = navigator && "clipboard" in navigator;
-            if (!isSupported)
-              return console.log("\u5F53\u524D\u6D4F\u89C8\u5668\u7248\u672C\u4E0D\u652F\u6301\u590D\u5236\uFF01");
+            if (!isSupported) {
+              $message.error("\u5F53\u524D\u6D4F\u89C8\u5668\u7248\u672C\u6216\u8005http\u534F\u8BAE\u4E0D\u652F\u6301\u590D\u5236\uFF01");
+              return console.log("\u5F53\u524D\u6D4F\u89C8\u5668\u7248\u672C\u6216\u8005http\u534F\u8BAE\u4E0D\u652F\u6301\u590D\u5236\uFF01");
+            }
             try {
-              if (chatMessageType === MESSAGE_TYPE.TEXT) {
-                await navigator.clipboard.writeText(content.msg);
-              } else {
-                let data;
-                if ([MESSAGE_TYPE.EMOJI, MESSAGE_TYPE.IMAGE].includes(chatMessageType)) {
-                  const url = chatMessageType === MESSAGE_TYPE.EMOJI ? emojis.findEmoji(content.msg) : formatJsonstr(content.msg, "fileUrl");
-                  data = `<img data-msg=${chatMessageType === MESSAGE_TYPE.EMOJI ? content.msg : ""} data-type=${chatMessageType} class=${chatMessageType === MESSAGE_TYPE.EMOJI ? "emoji--min" : "chat-image-copy"} src=${url} />`;
-                } else if (chatMessageType === MESSAGE_TYPE.BLEND) {
+              let data;
+              switch (chatMessageType) {
+                case MESSAGE_TYPE.TEXT:
+                  await navigator.clipboard.writeText(content.msg);
+                  break;
+                case MESSAGE_TYPE.EMOJI: {
+                  const url = emojis.findEmoji(content.msg);
+                  data = `<img data-msg=${content.msg} data-type=${chatMessageType} class="emoji--min" src=${url} />`;
+                  break;
+                }
+                case MESSAGE_TYPE.IMAGE: {
+                  const url = formatJsonstr(content.msg, "fileUrl");
+                  const fileName = formatJsonstr(content.msg, "fileName");
+                  const fileSize = (_a = formatJsonstr(content.msg, "fileSize")) == null ? void 0 : _a.replace(/\s+/g, "");
+                  data = `<img data-filename=${fileName} data-filesize=${fileSize} data-type=${chatMessageType} class="chat-image-copy" src=${url} />`;
+                  break;
+                }
+                case MESSAGE_TYPE.BLEND:
                   data = __content;
-                } else {
+                  break;
+                default:
                   data = content.msg;
-                }
-                await navigator.clipboard.write([new window.ClipboardItem({
-                  "text/html": new Blob([data], {
-                    type: "text/html"
-                  })
-                })]);
+                  break;
               }
+              await navigator.clipboard.write([new window.ClipboardItem({
+                "text/html": new Blob([data], {
+                  type: "text/html"
+                })
+              })]);
+              $message.success("\u590D\u5236\u6210\u529F");
             } catch (error) {
               console.log("\u590D\u5236\u5931\u8D25\uFF01");
             }

package/es/components/iho-chat/src/components/ImageLightbox.vue.d.ts

@@ -0,0 +1,104 @@
+import { PropType } from 'vue';
+import type { ImageItem } from '../types';
+declare const _default: import("vue").DefineComponent<{
+    images: {
+        type: PropType<ImageItem[]>;
+        default: () => never[];
+    };
+    visible: {
+        type: BooleanConstructor;
+    };
+    currentId: {
+        type: StringConstructor;
+        default: string;
+    };
+}, {
+    props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+        images: {
+            type: PropType<ImageItem[]>;
+            default: () => never[];
+        };
+        visible: {
+            type: BooleanConstructor;
+        };
+        currentId: {
+            type: StringConstructor;
+            default: string;
+        };
+    }>> & {
+        "onUpdate:visible"?: ((...args: any[]) => any) | undefined;
+        "onUpdate:currentId"?: ((...args: any[]) => any) | undefined;
+    }>>;
+    emit: (event: "update:visible" | "update:currentId", ...args: any[]) => void;
+    imageEl: import("vue").Ref<HTMLImageElement | null>;
+    naturalSize: import("vue").Ref<{
+        width: number;
+        height: number;
+    }>;
+    scale: import("vue").Ref<number>;
+    rotation: import("vue").Ref<number>;
+    isDragging: import("vue").Ref<boolean>;
+    offset: import("vue").Ref<{
+        x: number;
+        y: number;
+    }>;
+    lastMouse: import("vue").Ref<{
+        x: number;
+        y: number;
+    }>;
+    idToIndexMap: import("vue").ComputedRef<Map<string, number>>;
+    currentIndex: import("vue").ComputedRef<number>;
+    currentImageData: import("vue").ComputedRef<ImageItem>;
+    hasNext: import("vue").ComputedRef<boolean>;
+    hasPrev: import("vue").ComputedRef<boolean>;
+    imageStyle: import("vue").ComputedRef<{
+        left: string;
+        top: string;
+        transform: string;
+        cursor: string;
+        transition: string;
+    }>;
+    resetImageState: () => void;
+    close: () => void;
+    nextImage: () => void;
+    prevImage: () => void;
+    rotate: (degrees: number) => void;
+    zoomIn: () => void;
+    zoomOut: () => void;
+    resetZoom: () => void;
+    startDrag: (e: MouseEvent) => void;
+    onDragMove: (e: MouseEvent) => void;
+    endDrag: () => void;
+    handleWheel: (e: WheelEvent) => void;
+    handleImageLoad: () => void;
+    download: () => void;
+    Close: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+    PlaySkipBackOutline: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+    PlaySkipForwardOutline: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+    DownloadOutline: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+    RefreshOutline: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+    AddOutline: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+    RemoveSharp: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+    NButton: any;
+    NIcon: any;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:visible" | "update:currentId")[], "update:visible" | "update:currentId", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    images: {
+        type: PropType<ImageItem[]>;
+        default: () => never[];
+    };
+    visible: {
+        type: BooleanConstructor;
+    };
+    currentId: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & {
+    "onUpdate:visible"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:currentId"?: ((...args: any[]) => any) | undefined;
+}, {
+    visible: boolean;
+    images: ImageItem[];
+    currentId: string;
+}>;
+export default _default;

package/es/components/iho-chat/src/components/ImageLightbox.vue.js

@@ -0,0 +1,6 @@
+import _sfc_main from './ImageLightbox.vue2.js';
+import _export_sfc from '../../../../_virtual/_plugin-vue_export-helper.js';
+
+var ImageLightbox = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "ImageLightbox.vue"]]);
+
+export { ImageLightbox as default };

package/es/components/iho-chat/src/components/ImageLightbox.vue2.js

@@ -0,0 +1,307 @@
+import { defineComponent, ref, computed, watch, openBlock, createElementBlock, withModifiers, createElementVNode, createVNode, unref, withCtx, createCommentVNode, normalizeStyle, renderSlot, toDisplayString, createTextVNode } from 'vue';
+import { downloadFile } from '../utils/index.js';
+import { Close, PlaySkipBackOutline, PlaySkipForwardOutline, RefreshOutline, AddOutline, RemoveSharp, DownloadOutline } from '@vicons/ionicons5';
+import { NButton, NIcon } from 'naive-ui';
+
+const _hoisted_1 = ["onClick"];
+const _hoisted_2 = {
+  class: "lightbox-container"
+};
+const _hoisted_3 = ["onMousedown", "onWheel"];
+const _hoisted_4 = ["src", "alt"];
+const _hoisted_5 = {
+  class: "title"
+};
+const _hoisted_6 = {
+  class: "toolbar-container"
+};
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ImageLightbox",
+  props: {
+    images: {
+      type: Array,
+      default: () => []
+    },
+    visible: {
+      type: Boolean
+    },
+    currentId: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: ["update:visible", "update:currentId"],
+  setup(__props, {
+    expose,
+    emit
+  }) {
+    const props = __props;
+    const imageEl = ref(null);
+    const naturalSize = ref({
+      width: 0,
+      height: 0
+    });
+    const scale = ref(1);
+    const rotation = ref(0);
+    const isDragging = ref(false);
+    const offset = ref({
+      x: 0,
+      y: 0
+    });
+    const lastMouse = ref({
+      x: 0,
+      y: 0
+    });
+    const idToIndexMap = computed(() => {
+      const map = /* @__PURE__ */ new Map();
+      props.images.forEach((img, index) => map.set(img.id, index));
+      return map;
+    });
+    const currentIndex = computed(() => {
+      var _a;
+      return (_a = idToIndexMap.value.get(props.currentId)) != null ? _a : 0;
+    });
+    const currentImageData = computed(() => props.images.find((img) => img.id === props.currentId) || props.images[0]);
+    const hasNext = computed(() => currentIndex.value < props.images.length - 1);
+    const hasPrev = computed(() => currentIndex.value > 0);
+    const imageStyle = computed(() => ({
+      left: `calc(50% + ${offset.value.x}px)`,
+      top: `calc(50% + ${offset.value.y}px)`,
+      transform: `translate(-50%, -50%) scale(${scale.value}) rotate(${rotation.value}deg)`,
+      cursor: isDragging.value ? "grabbing" : "grab",
+      transition: isDragging.value ? "none" : "transform 0.3s ease"
+    }));
+    const resetImageState = () => {
+      scale.value = 1;
+      rotation.value = 0;
+      offset.value = {
+        x: 0,
+        y: 0
+      };
+    };
+    const close = () => {
+      emit("update:visible", false);
+    };
+    const nextImage = () => {
+      if (hasNext.value) {
+        emit("update:currentId", props.images[currentIndex.value + 1].id);
+        resetImageState();
+      }
+    };
+    const prevImage = () => {
+      if (hasPrev.value) {
+        emit("update:currentId", props.images[currentIndex.value - 1].id);
+        resetImageState();
+      }
+    };
+    const rotate = (degrees) => {
+      rotation.value = (rotation.value + degrees) % 360;
+    };
+    const zoomIn = () => {
+      scale.value = Math.min(scale.value + 0.2, 5);
+    };
+    const zoomOut = () => {
+      scale.value = Math.max(scale.value - 0.2, 0.5);
+    };
+    const resetZoom = () => {
+      if (!imageEl.value)
+        return;
+      const container = imageEl.value.parentElement;
+      if (!container)
+        return;
+      const containerWidth = container.clientWidth;
+      const containerHeight = container.clientHeight;
+      const widthRatio = containerWidth / naturalSize.value.width;
+      const heightRatio = containerHeight / naturalSize.value.height;
+      scale.value = Math.min(widthRatio, heightRatio, 1);
+      offset.value = {
+        x: 0,
+        y: 0
+      };
+    };
+    function startDrag(e) {
+      if (scale.value <= 1)
+        return;
+      isDragging.value = true;
+      lastMouse.value = {
+        x: e.clientX,
+        y: e.clientY
+      };
+      document.body.style.cursor = "grabbing";
+      window.addEventListener("mousemove", onDragMove);
+      window.addEventListener("mouseup", endDrag);
+    }
+    function onDragMove(e) {
+      if (!isDragging.value)
+        return;
+      const dx = e.clientX - lastMouse.value.x;
+      const dy = e.clientY - lastMouse.value.y;
+      offset.value = {
+        x: offset.value.x + dx,
+        y: offset.value.y + dy
+      };
+      lastMouse.value = {
+        x: e.clientX,
+        y: e.clientY
+      };
+    }
+    function endDrag() {
+      if (!isDragging.value)
+        return;
+      isDragging.value = false;
+      document.body.style.cursor = "";
+      window.removeEventListener("mousemove", onDragMove);
+      window.removeEventListener("mouseup", endDrag);
+    }
+    const handleWheel = (e) => {
+      var _a;
+      e.preventDefault();
+      const rect = (_a = imageEl.value) == null ? void 0 : _a.getBoundingClientRect();
+      if (!rect)
+        return;
+      const delta = -e.deltaY;
+      const zoomFactor = delta > 0 ? 1.1 : 0.9;
+      const newScale = Math.min(Math.max(scale.value * zoomFactor, 0.5), 5);
+      scale.value = newScale;
+    };
+    const handleImageLoad = () => {
+      if (imageEl.value) {
+        naturalSize.value = {
+          width: imageEl.value.naturalWidth,
+          height: imageEl.value.naturalHeight
+        };
+        resetImageState();
+      }
+    };
+    const download = () => {
+      downloadFile(JSON.stringify({
+        fileUrl: currentImageData.value.fileUrl,
+        fileName: currentImageData.value.fileName
+      }));
+    };
+    watch(() => props.visible, (newVal) => {
+      document.body.style.overflow = newVal ? "hidden" : "";
+    });
+    expose({
+      open,
+      nextImage,
+      prevImage
+    });
+    return (_ctx, _cache) => {
+      return __props.visible ? (openBlock(), createElementBlock("div", {
+        key: 0,
+        class: "c-lightbox-overlay",
+        onClick: withModifiers(close, ["stop"])
+      }, [createElementVNode("div", _hoisted_2, [createVNode(unref(NButton), {
+        text: "",
+        class: "close-btn",
+        onClick: close
+      }, {
+        default: withCtx(() => [createVNode(unref(NIcon), {
+          size: "22",
+          component: unref(Close)
+        }, null, 8, ["component"])]),
+        _: 1
+      }), createCommentVNode(" \u56FE\u7247\u5BB9\u5668 "), createElementVNode("div", {
+        class: "image-container",
+        onMousedown: withModifiers(startDrag, ["prevent"]),
+        onWheel: withModifiers(handleWheel, ["prevent"])
+      }, [createElementVNode("img", {
+        ref_key: "imageEl",
+        ref: imageEl,
+        src: unref(currentImageData).fileUrl,
+        style: normalizeStyle(unref(imageStyle)),
+        alt: unref(currentImageData).fileName,
+        onLoad: handleImageLoad,
+        onClick: _cache[0] || (_cache[0] = withModifiers(() => {
+        }, ["stop"]))
+      }, null, 44, _hoisted_4)], 40, _hoisted_3), createCommentVNode(function() {
+        var _a, _b, _c;
+        try {
+          return ((_a = window.getLanguageByCode) == null ? void 0 : _a.call(window, "10010.1.254")) || ((_c = (_b = window.top) == null ? void 0 : _b.getLanguageByCode) == null ? void 0 : _c.call(_b, "10010.1.254")) || "\u81EA\u5B9A\u4E49\u6807\u9898";
+        } catch (e) {
+          return "\u81EA\u5B9A\u4E49\u6807\u9898";
+        }
+      }()), createElementVNode("div", _hoisted_5, [renderSlot(_ctx.$slots, "title", {
+        currentImageData: unref(currentImageData)
+      }, () => [createElementVNode("p", null, toDisplayString(unref(currentImageData).senderName) + "\u5206\u4EAB\u7684\u56FE\u7247", 1), createElementVNode("p", null, toDisplayString(unref(currentImageData).sendTime) + " \xB7 " + toDisplayString(unref(currentImageData).fileSize), 1)])]), createCommentVNode(" \u5DE5\u5177\u680F "), createElementVNode("div", _hoisted_6, [createElementVNode("div", {
+        class: "toolbar",
+        onClick: _cache[3] || (_cache[3] = withModifiers(() => {
+        }, ["stop"]))
+      }, [createVNode(unref(NButton), {
+        text: "",
+        disabled: !unref(hasPrev),
+        onClick: prevImage
+      }, {
+        default: withCtx(() => [createVNode(unref(NIcon), {
+          size: "22",
+          component: unref(PlaySkipBackOutline)
+        }, null, 8, ["component"])]),
+        _: 1
+      }, 8, ["disabled"]), createVNode(unref(NButton), {
+        text: "",
+        disabled: !unref(hasNext),
+        onClick: nextImage
+      }, {
+        default: withCtx(() => [createVNode(unref(NIcon), {
+          size: "22",
+          component: unref(PlaySkipForwardOutline)
+        }, null, 8, ["component"])]),
+        _: 1
+      }, 8, ["disabled"]), createVNode(unref(NButton), {
+        text: "",
+        onClick: _cache[1] || (_cache[1] = () => rotate(-90))
+      }, {
+        default: withCtx(() => [createVNode(unref(NIcon), {
+          size: "22",
+          component: unref(RefreshOutline)
+        }, null, 8, ["component"])]),
+        _: 1
+      }), createVNode(unref(NButton), {
+        text: "",
+        onClick: _cache[2] || (_cache[2] = () => rotate(90))
+      }, {
+        default: withCtx(() => [createVNode(unref(NIcon), {
+          size: "22",
+          component: unref(RefreshOutline)
+        }, null, 8, ["component"])]),
+        _: 1
+      }), createVNode(unref(NButton), {
+        text: "",
+        onClick: zoomIn
+      }, {
+        default: withCtx(() => [createVNode(unref(NIcon), {
+          size: "22",
+          component: unref(AddOutline)
+        }, null, 8, ["component"])]),
+        _: 1
+      }), createVNode(unref(NButton), {
+        text: "",
+        onClick: zoomOut
+      }, {
+        default: withCtx(() => [createVNode(unref(NIcon), {
+          size: "22",
+          component: unref(RemoveSharp)
+        }, null, 8, ["component"])]),
+        _: 1
+      }), createVNode(unref(NButton), {
+        text: "",
+        onClick: resetZoom
+      }, {
+        default: withCtx(() => [createTextVNode("1:1")]),
+        _: 1
+      }), createVNode(unref(NButton), {
+        text: "",
+        onClick: download
+      }, {
+        default: withCtx(() => [createVNode(unref(NIcon), {
+          size: "22",
+          component: unref(DownloadOutline)
+        }, null, 8, ["component"])]),
+        _: 1
+      })])])])], 8, _hoisted_1)) : createCommentVNode("v-if", true);
+    };
+  }
+});
+
+export { _sfc_main as default };