vuux/dist/es/Image/src/index.vue.mjs

Vue3 Nuxt3 Nuxt4 组件库

import { defineComponent as v, useTemplateRef as w, createElementBlock as t, openBlock as i, unref as e, normalizeClass as f, createCommentVNode as n, normalizeStyle as m, createElementVNode as d } from "vue";
import { useImage as h } from "./hook/useImage.mjs";
const y = ["src"], k = ["width", "height"], C = /* @__PURE__ */ v({
  name: "Image",
  __name: "index",
  props: {
    src: {},
    width: {},
    height: {},
    fit: { default: "cover" },
    border: { default: 4 },
    preview: { type: Boolean }
  },
  setup(g) {
    const r = g, a = w("imageEl"), { isError: o, styles: l, handleImagePreview: u, onError: c } = h(r, a);
    return (E, s) => (i(), t("div", {
      ref_key: "imageEl",
      ref: a,
      class: f(["app-image", { "is-error": e(o), "is-preview": r.preview }]),
      onClick: s[1] || (s[1] = (p) => e(u)(r.src))
    }, [
      e(o) ? n("", !0) : (i(), t("img", {
        key: 0,
        src: r.src,
        style: m(e(l)),
        onError: s[0] || (s[0] = //@ts-ignore
        (...p) => e(c) && e(c)(...p))
      }, null, 44, y)),
      r.preview ? (i(), t("div", {
        key: 1,
        class: "is-mask",
        style: m(e(l))
      }, null, 4)) : n("", !0),
      e(o) ? (i(), t("div", {
        key: 2,
        class: "image-error",
        style: m(e(l))
      }, [
        (i(), t("svg", {
          viewBox: "0 0 1457 1024",
          version: "1.1",
          xmlns: "http://www.w3.org/2000/svg",
          fill: "rgb(205, 210, 223)",
          width: r.width / 2,
          height: r.height / 2
        }, [...s[2] || (s[2] = [
          d("path", { d: "M1140.185 437.17c-155.57 25.6-273.723 159.507-273.723 320.984 0 35.446 5.907 68.923 15.753 98.461l-5.907 9.847H39.385c-45.293-13.785-49.231-39.385-9.847-78.77s102.4-104.369 187.077-196.923c19.693-25.6 43.323-25.6 68.923 0l88.616 88.616c19.692 19.692 39.384 13.784 59.077-19.693s157.538-230.4 413.538-590.769c33.477-45.292 63.016-45.292 88.616 0s94.523 167.385 206.769 364.308l-1.97 3.938zM114.215 216.614c-59.077 0-108.307-47.261-108.307-108.307C5.908 49.23 55.138 0 114.215 0s108.308 49.23 108.308 108.308-49.23 108.307-108.308 108.307z" }, null, -1),
          d("path", { d: "M1201.23 512c141.785 0 256 114.215 256 256s-114.215 256-256 256-256-114.215-256-256 114.216-256 256-256z m-19.692 137.846v157.539c0 11.815 7.877 19.692 19.693 19.692s19.692-9.846 19.692-19.692V649.846c0-11.815-7.877-19.692-19.692-19.692s-19.693 9.846-19.693 19.692z m19.693 256c11.815 0 19.692-7.877 19.692-19.692s-7.877-19.692-19.692-19.692-19.693 7.876-19.693 19.692 7.877 19.692 19.693 19.692z" }, null, -1)
        ])], 8, k))
      ], 4)) : n("", !0)
    ], 2));
  }
});
export {
  C as default
};