cione-comp-lib/es/packages/co-office-std/index2.mjs

`$ yarn add cione-comp-lib` 或者 `$ npm i cione-comp-lib -S`

import { defineComponent, ref, computed, watch, nextTick, onMounted, toRefs, openBlock, createElementBlock, normalizeStyle, createCommentVNode, toDisplayString, createElementVNode, createBlock, Teleport, createStaticVNode, pushScopeId, popScopeId } from "vue";
import { toBase64 as encode } from "../../node_modules/js-base64/base64.mjs";
import "./index.vue_vue_type_style_index_0_scoped_true_lang.mjs";
import _export_sfc from "../../_virtual/plugin-vue_export-helper.mjs";
const _sfc_main = defineComponent({
  name: "CoOfficeStd",
  props: {
    src: {
      type: String
    },
    width: {
      type: String
    },
    height: {
      type: String
    },
    previewType: {
      type: String,
      default: "1"
    },
    isSpread: {
      type: Boolean,
      default: false
    },
    title: {
      type: String,
      default: "Office\u5C55\u793A"
    },
    fontFamily: {
      type: String
    },
    fontSize: {
      type: Number,
      default: 12
    },
    color: {
      type: String,
      default: "rgba(255,255,255,1)"
    },
    borderColor: {
      type: String,
      default: "rgba(57,70,211,1)"
    }
  },
  setup(props) {
    const show = ref(true);
    const pdfSrc = ref(
      window.env.VITE_PRIVIWE_URL + "/onlinePreview?url=" + encodeURIComponent(encode(props.src))
    );
    const isMouse = ref(false);
    const isPreview = ref(false);
    const previewFn = (event) => {
      if (props.previewType === "2") {
        isPreview.value = true;
      } else if (props.previewType === "3") {
        window.open(pdfSrc.value, "_blank");
      }
    };
    const mouseOverFn = () => {
      if (props.previewType === "1") {
        isMouse.value = true;
      }
    };
    const mouseOutFn = () => {
      if (props.previewType === "1") {
        isMouse.value = false;
      }
    };
    const closeFn = () => {
      isPreview.value = false;
    };
    const attrs = computed(() => {
      return {
        fontSize: props.fontSize + "px",
        color: props.color,
        borderColor: props.borderColor,
        fontFamily: props.fontFamily
      };
    });
    const updataOfficeSrc = (url) => {
      pdfSrc.value = window.env.VITE_PRIVIWE_URL + "/onlinePreview?url=" + encodeURIComponent(encode(url));
    };
    watch(
      () => props.src,
      () => {
        pdfSrc.value = window.env.VITE_PRIVIWE_URL + "/onlinePreview?url=" + encodeURIComponent(encode(props.src));
      }
    );
    watch(
      () => props.isSpread,
      () => {
        show.value = false;
        nextTick(() => {
          show.value = true;
        });
      }
    );
    onMounted(() => {
    });
    return {
      show,
      pdfSrc,
      isPreview,
      isMouse,
      previewFn,
      mouseOverFn,
      mouseOutFn,
      closeFn,
      attrs,
      updataOfficeSrc,
      ...toRefs(props)
    };
  }
});
const _withScopeId = (n) => (pushScopeId("data-v-3372993f"), n = n(), popScopeId(), n);
const _hoisted_1 = ["src"];
const _hoisted_2 = { class: "office-std__mouse" };
const _hoisted_3 = /* @__PURE__ */ createStaticVNode('<svg viewBox="0 0 1024 1024" width="20px" height="20px" data-v-3372993f><path d="M270.08 64.064l-179.2 0C76.032 64.064 64 76.096 64 90.944l0 178.688c0 0.128 0 0.256 0 0.384C64 284.928 76.032 296.96 90.88 296.96s27.008-12.032 27.008-26.944c0-1.536-0.256-3.136-0.512-4.608L117.376 122.176c0-2.496 1.984-4.48 4.416-4.48l145.408 0C268.16 117.76 269.12 117.952 270.08 117.952c14.848 0 26.944-12.032 26.944-26.944S284.928 64.064 270.08 64.064z" fill="#ffffff" data-v-3372993f></path><path d="M847.552 830.784c0 9.856-8.128 17.856-17.92 17.856L190.528 848.64c-9.856 0-17.856-8-17.856-17.856L172.672 191.744c0-9.92 8-17.92 17.856-17.92l639.104 0c9.792 0 17.92 8 17.92 17.92L847.552 830.784z" fill="#ffffff" data-v-3372993f></path><path d="M753.792 64.064l179.2 0c14.848 0 26.88 12.032 26.88 26.88l0 178.688C959.872 269.76 960 269.888 960 270.016c0 14.912-12.096 26.944-27.008 26.944s-26.944-12.032-26.944-26.944c0-1.536 0.256-3.136 0.448-4.608L906.496 122.176c0-2.496-1.92-4.48-4.48-4.48l-145.344 0c-1.024 0.064-1.856 0.256-2.88 0.256-14.848 0-26.88-12.032-26.88-26.944S738.944 64.064 753.792 64.064z" fill="#ffffff" data-v-3372993f></path><path d="M270.08 959.936l-179.2 0C76.032 959.936 64 947.968 64 933.12l0-178.752c0-0.128 0-0.256 0-0.384 0-14.912 12.032-27.008 26.88-27.008s27.008 12.032 27.008 27.008c0 1.536-0.256 3.136-0.512 4.608l0 143.168c0 2.496 1.984 4.48 4.416 4.48l145.408 0c0.96-0.064 1.856-0.256 2.816-0.256 14.848 0 26.944 12.032 26.944 26.944S284.928 959.936 270.08 959.936z" fill="#ffffff" data-v-3372993f></path><path d="M753.792 959.936l179.2 0c14.848 0 26.88-12.032 26.88-26.816l0-178.752c0-0.128 0.128-0.256 0.128-0.384 0-14.912-12.096-27.008-27.008-27.008s-26.944 12.032-26.944 27.008c0 1.536 0.256 3.136 0.448 4.608l0 143.168c0 2.496-1.92 4.48-4.48 4.48l-145.344 0c-1.024-0.064-1.856-0.256-2.88-0.256-14.848 0-26.88 12.032-26.88 26.944S738.944 959.936 753.792 959.936z" fill="#ffffff" data-v-3372993f></path></svg>', 1);
const _hoisted_4 = [
  _hoisted_3
];
const _hoisted_5 = {
  key: 0,
  class: "office-std__pre-preview"
};
const _hoisted_6 = ["src"];
const _hoisted_7 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("svg", { viewBox: "0 0 1024 1024" }, [
  /* @__PURE__ */ createElementVNode("path", {
    fill: "currentColor",
    d: "M764.288 214.592 512 466.88 259.712 214.592a31.936 31.936 0 0 0-45.12 45.12L466.752 512 214.528 764.224a31.936 31.936 0 1 0 45.12 45.184L512 557.184l252.288 252.288a31.936 31.936 0 0 0 45.12-45.12L557.12 512.064l252.288-252.352a31.936 31.936 0 1 0-45.12-45.184z"
  })
], -1));
const _hoisted_8 = [
  _hoisted_7
];
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  return openBlock(), createElementBlock("div", {
    class: "co-office-std",
    style: normalizeStyle({
      width: _ctx.width || "100%",
      height: _ctx.height || "100%"
    })
  }, [
    _ctx.previewType === "1" ? (openBlock(), createElementBlock("iframe", {
      key: 0,
      src: _ctx.pdfSrc,
      frameborder: "0"
    }, null, 8, _hoisted_1)) : createCommentVNode("", true),
    _ctx.previewType !== "1" ? (openBlock(), createElementBlock("span", {
      key: 1,
      class: "office-std__pre-text",
      onClick: _cache[0] || (_cache[0] = (...args) => _ctx.previewFn && _ctx.previewFn(...args)),
      style: normalizeStyle(_ctx.attrs)
    }, toDisplayString(_ctx.title), 5)) : createCommentVNode("", true),
    createElementVNode("div", _hoisted_2, [
      createElementVNode("span", {
        onClick: _cache[1] || (_cache[1] = ($event) => _ctx.isPreview = true)
      }, _hoisted_4)
    ]),
    (openBlock(), createBlock(Teleport, { to: "body" }, [
      _ctx.isPreview ? (openBlock(), createElementBlock("div", _hoisted_5, [
        createElementVNode("iframe", {
          src: _ctx.pdfSrc,
          frameborder: "0",
          style: { "width": "90%", "height": "90%" }
        }, null, 8, _hoisted_6),
        createElementVNode("span", {
          class: "office-std__pre-cloxe",
          onClick: _cache[2] || (_cache[2] = (...args) => _ctx.closeFn && _ctx.closeFn(...args))
        }, _hoisted_8)
      ])) : createCommentVNode("", true)
    ]))
  ], 4);
}
var office = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-3372993f"]]);
export { office as default };