@qxs-bns/components 0.0.5 → 0.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.cjs +1 -1
- package/index.js +898 -13
- package/package.json +3 -2
- package/theme-chalk/base.scss +17 -0
- package/theme-chalk/file-upload.scss +33 -0
- package/theme-chalk/fixed-action-bar.scss +17 -0
- package/theme-chalk/image-upload.scss +136 -0
- package/theme-chalk/index.scss +8 -0
- package/theme-chalk/photo-crop-tool.scss +84 -0
- package/theme-chalk/rich-editor.scss +23 -0
- package/theme-chalk/var.scss +87 -0
- package/vendor.cjs +6 -0
- package/vendor.js +1377 -0
- package/dist/hooks/src/use-namespace/index.cjs +0 -1
- package/dist/hooks/src/use-namespace/index.js +0 -49
- package/package.json.cjs +0 -1
- package/package.json.js +0 -4
- package/src/components.cjs +0 -1
- package/src/components.js +0 -10
- package/src/defaults.cjs +0 -1
- package/src/defaults.js +0 -6
- package/src/file-upload/index.cjs +0 -1
- package/src/file-upload/index.js +0 -7
- package/src/file-upload/src/file-upload.vue.cjs +0 -1
- package/src/file-upload/src/file-upload.vue.js +0 -82
- package/src/file-upload/src/file-upload.vue2.cjs +0 -1
- package/src/file-upload/src/file-upload.vue2.js +0 -4
- package/src/fixed-action-bar/index.cjs +0 -1
- package/src/fixed-action-bar/index.js +0 -7
- package/src/fixed-action-bar/src/fixed-action-bar.vue.cjs +0 -1
- package/src/fixed-action-bar/src/fixed-action-bar.vue.js +0 -63
- package/src/fixed-action-bar/src/fixed-action-bar.vue2.cjs +0 -1
- package/src/fixed-action-bar/src/fixed-action-bar.vue2.js +0 -4
- package/src/image-upload/index.cjs +0 -1
- package/src/image-upload/index.js +0 -7
- package/src/image-upload/src/image-upload.vue.cjs +0 -1
- package/src/image-upload/src/image-upload.vue.js +0 -164
- package/src/image-upload/src/image-upload.vue2.cjs +0 -1
- package/src/image-upload/src/image-upload.vue2.js +0 -4
- package/src/make-installer.cjs +0 -1
- package/src/make-installer.js +0 -13
- package/src/photo-crop-tool/index.cjs +0 -1
- package/src/photo-crop-tool/index.js +0 -7
- package/src/photo-crop-tool/src/composables.cjs +0 -1
- package/src/photo-crop-tool/src/composables.js +0 -33
- package/src/photo-crop-tool/src/photo-crop-tool.vue.cjs +0 -1
- package/src/photo-crop-tool/src/photo-crop-tool.vue.js +0 -224
- package/src/photo-crop-tool/src/photo-crop-tool.vue2.cjs +0 -1
- package/src/photo-crop-tool/src/photo-crop-tool.vue2.js +0 -4
- package/src/withInstall.cjs +0 -1
- package/src/withInstall.js +0 -9
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("vue"),l="qxs",$="is-";function c(u,o,r,e,t){let a=`${u}-${o}`;return r&&(a+=`-${r}`),e&&(a+=`__${e}`),t&&(a+=`--${t}`),a}const s=Symbol("namespaceContextKey");function m(u){const o=n.getCurrentInstance()?n.inject(s,n.ref(l)):n.ref(l);return n.computed(()=>n.unref(o)||l)}function i(u,o){const r=m();return{namespace:r,b:(e="")=>c(r.value,u,e,"",""),e:e=>e?c(r.value,u,"",e,""):"",m:e=>e?c(r.value,u,"","",e):"",be:(e,t)=>e&&t?c(r.value,u,e,t,""):"",em:(e,t)=>e&&t?c(r.value,u,"",e,t):"",bm:(e,t)=>e&&t?c(r.value,u,e,"",t):"",bem:(e,t,a)=>e&&t&&a?c(r.value,u,e,t,a):"",is:(e,...t)=>{const a=t.length>=1?t[0]:!0;return e&&a?`${$}${e}`:""},cssVar:e=>{const t={};for(const a in e)e[a]&&(t[`--${r.value}-${a}`]=e[a]);return t},cssVarName:e=>`--${r.value}-${e}`,cssVarBlock:e=>{const t={};for(const a in e)e[a]&&(t[`--${r.value}-${u}-${a}`]=e[a]);return t},cssVarBlockName:e=>`--${r.value}-${u}-${e}`}}exports.defaultNamespace=l;exports.namespaceContextKey=s;exports.useGetDerivedNamespace=m;exports.useNamespace=i;
|
@@ -1,49 +0,0 @@
|
|
1
|
-
import { getCurrentInstance as l, inject as m, ref as s, computed as $, unref as v } from "vue";
|
2
|
-
const o = "qxs", i = "is-";
|
3
|
-
function n(r, u, c, e, a) {
|
4
|
-
let t = `${r}-${u}`;
|
5
|
-
return c && (t += `-${c}`), e && (t += `__${e}`), a && (t += `--${a}`), t;
|
6
|
-
}
|
7
|
-
const f = Symbol("namespaceContextKey");
|
8
|
-
function p(r) {
|
9
|
-
const u = l() ? m(f, s(o)) : s(o);
|
10
|
-
return $(() => v(u) || o);
|
11
|
-
}
|
12
|
-
function N(r, u) {
|
13
|
-
const c = p();
|
14
|
-
return {
|
15
|
-
namespace: c,
|
16
|
-
b: (e = "") => n(c.value, r, e, "", ""),
|
17
|
-
e: (e) => e ? n(c.value, r, "", e, "") : "",
|
18
|
-
m: (e) => e ? n(c.value, r, "", "", e) : "",
|
19
|
-
be: (e, a) => e && a ? n(c.value, r, e, a, "") : "",
|
20
|
-
em: (e, a) => e && a ? n(c.value, r, "", e, a) : "",
|
21
|
-
bm: (e, a) => e && a ? n(c.value, r, e, "", a) : "",
|
22
|
-
bem: (e, a, t) => e && a && t ? n(c.value, r, e, a, t) : "",
|
23
|
-
is: (e, ...a) => {
|
24
|
-
const t = a.length >= 1 ? a[0] : !0;
|
25
|
-
return e && t ? `${i}${e}` : "";
|
26
|
-
},
|
27
|
-
// css
|
28
|
-
cssVar: (e) => {
|
29
|
-
const a = {};
|
30
|
-
for (const t in e)
|
31
|
-
e[t] && (a[`--${c.value}-${t}`] = e[t]);
|
32
|
-
return a;
|
33
|
-
},
|
34
|
-
cssVarName: (e) => `--${c.value}-${e}`,
|
35
|
-
cssVarBlock: (e) => {
|
36
|
-
const a = {};
|
37
|
-
for (const t in e)
|
38
|
-
e[t] && (a[`--${c.value}-${r}-${t}`] = e[t]);
|
39
|
-
return a;
|
40
|
-
},
|
41
|
-
cssVarBlockName: (e) => `--${c.value}-${r}-${e}`
|
42
|
-
};
|
43
|
-
}
|
44
|
-
export {
|
45
|
-
o as defaultNamespace,
|
46
|
-
f as namespaceContextKey,
|
47
|
-
p as useGetDerivedNamespace,
|
48
|
-
N as useNamespace
|
49
|
-
};
|
package/package.json.cjs
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="0.0.5";exports.version=e;
|
package/package.json.js
DELETED
package/src/components.cjs
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./file-upload/index.cjs"),o=require("./fixed-action-bar/index.cjs"),i=require("./image-upload/index.cjs"),r=require("./photo-crop-tool/index.cjs");exports.QxsFileUpload=e.QxsFileUpload;exports.QxsFixedActionBar=o.QxsFixedActionBar;exports.QxsImageUpload=i.QxsImageUpload;exports.QxsPhotoCropTool=r.QxsPhotoCropTool;
|
package/src/components.js
DELETED
@@ -1,10 +0,0 @@
|
|
1
|
-
import { QxsFileUpload as x } from "./file-upload/index.js";
|
2
|
-
import { QxsFixedActionBar as p } from "./fixed-action-bar/index.js";
|
3
|
-
import { QxsImageUpload as m } from "./image-upload/index.js";
|
4
|
-
import { QxsPhotoCropTool as f } from "./photo-crop-tool/index.js";
|
5
|
-
export {
|
6
|
-
x as QxsFileUpload,
|
7
|
-
p as QxsFixedActionBar,
|
8
|
-
m as QxsImageUpload,
|
9
|
-
f as QxsPhotoCropTool
|
10
|
-
};
|
package/src/defaults.cjs
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./components.cjs"),t=require("./make-installer.cjs"),l=t.makeInstaller(e);exports.default=l;
|
package/src/defaults.js
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../withInstall.cjs"),l=require("./src/file-upload.vue.cjs"),e=t.withInstall(l.default);exports.QxsFileUpload=e;exports.default=e;
|
package/src/file-upload/index.js
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),N=require("../../../node_modules/.pnpm/@element-plus_icons-vue@2.3.1_vue@3.5.12_typescript@5.6.3_/node_modules/@element-plus/icons-vue/dist/index.cjs"),h=require("../../../dist/hooks/src/use-namespace/index.cjs"),c=require("../../../node_modules/.pnpm/element-plus@2.8.7_vue@3.5.12_typescript@5.6.3_/node_modules/element-plus/es/components/message/index.cjs"),E={class:"slot"},x={key:0,class:"el-upload__tip"},C={style:{display:"inline-block"}},V=e.defineComponent({name:"QxsFileUpload",__name:"file-upload",props:{action:{},headers:{},data:{},name:{default:"file"},size:{default:20},max:{default:3},accept:{default:"zip,rar"},files:{default:()=>[]},notip:{type:Boolean,default:!1},ext:{}},emits:["onSuccess"],setup(d,{emit:u}){const a=d,p=u,m=h.useNamespace("file-upload"),i=e.computed(()=>a.accept.split(",").map(t=>t.split("/").pop())),f=t=>{var r;const l=(r=t.name.split(".").at(-1))!=null?r:"",s=i.value.includes(l),n=t.size/1024/1024<a.size;return s||c.ElMessage.error(`上传文件只支持 ${i.value.join(" / ")} 格式!`),n||c.ElMessage.error(`上传文件大小不能超过 ${a.size}MB!`),s&&n},_=()=>{c.ElMessage.warning("文件上传超过限制")},v=(t,o,l)=>{p("onSuccess",t,o,l)};return(t,o)=>{const l=e.resolveComponent("el-icon"),s=e.resolveComponent("el-alert"),n=e.resolveComponent("el-upload");return e.openBlock(),e.createBlock(n,{headers:t.headers,action:t.action,data:t.data,name:t.name,"before-upload":f,"on-exceed":_,"on-success":v,"file-list":t.files,limit:t.max,drag:"",class:e.normalizeClass(e.unref(m).e("control"))},{tip:e.withCtx(()=>[t.notip?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",x,[e.createElementVNode("div",C,[e.createVNode(s,{title:`上传文件支持 ${i.value.join(" / ")} 格式,单个文件大小不超过 ${t.size}MB,且文件数量不超过 ${t.max} 个`,type:"info","show-icon":"",closable:!1},null,8,["title"])])]))]),default:e.withCtx(()=>[e.createElementVNode("div",E,[e.createVNode(l,{class:"el-icon--upload"},{default:e.withCtx(()=>[e.createVNode(e.unref(N.UploadFilled))]),_:1}),o[0]||(o[0]=e.createElementVNode("div",{class:"el-upload__text"},[e.createTextVNode(" 将文件拖到此处,或"),e.createElementVNode("em",null,"点击上传")],-1))])]),_:1},8,["headers","action","data","name","file-list","limit","class"])}}});exports.default=V;
|
@@ -1,82 +0,0 @@
|
|
1
|
-
import { defineComponent as B, computed as x, resolveComponent as c, openBlock as u, createBlock as C, normalizeClass as E, unref as f, withCtx as d, createElementBlock as $, createElementVNode as s, createVNode as r, createCommentVNode as b, createTextVNode as S } from "vue";
|
2
|
-
import { UploadFilled as V } from "../../../node_modules/.pnpm/@element-plus_icons-vue@2.3.1_vue@3.5.12_typescript@5.6.3_/node_modules/@element-plus/icons-vue/dist/index.js";
|
3
|
-
import { useNamespace as g } from "../../../dist/hooks/src/use-namespace/index.js";
|
4
|
-
import { ElMessage as p } from "../../../node_modules/.pnpm/element-plus@2.8.7_vue@3.5.12_typescript@5.6.3_/node_modules/element-plus/es/components/message/index.js";
|
5
|
-
const w = { class: "slot" }, M = {
|
6
|
-
key: 0,
|
7
|
-
class: "el-upload__tip"
|
8
|
-
}, U = { style: { display: "inline-block" } }, I = /* @__PURE__ */ B({
|
9
|
-
name: "QxsFileUpload",
|
10
|
-
__name: "file-upload",
|
11
|
-
props: {
|
12
|
-
action: {},
|
13
|
-
headers: {},
|
14
|
-
data: {},
|
15
|
-
name: { default: "file" },
|
16
|
-
size: { default: 20 },
|
17
|
-
max: { default: 3 },
|
18
|
-
accept: { default: "zip,rar" },
|
19
|
-
files: { default: () => [] },
|
20
|
-
notip: { type: Boolean, default: !1 },
|
21
|
-
ext: {}
|
22
|
-
},
|
23
|
-
emits: ["onSuccess"],
|
24
|
-
setup(_, { emit: h }) {
|
25
|
-
const n = _, v = h, z = g("file-upload"), i = x(() => n.accept.split(",").map((e) => e.split("/").pop())), k = (e) => {
|
26
|
-
var m;
|
27
|
-
const t = (m = e.name.split(".").at(-1)) != null ? m : "", l = i.value.includes(t), a = e.size / 1024 / 1024 < n.size;
|
28
|
-
return l || p.error(`上传文件只支持 ${i.value.join(" / ")} 格式!`), a || p.error(`上传文件大小不能超过 ${n.size}MB!`), l && a;
|
29
|
-
}, N = () => {
|
30
|
-
p.warning("文件上传超过限制");
|
31
|
-
}, y = (e, o, t) => {
|
32
|
-
v("onSuccess", e, o, t);
|
33
|
-
};
|
34
|
-
return (e, o) => {
|
35
|
-
const t = c("el-icon"), l = c("el-alert"), a = c("el-upload");
|
36
|
-
return u(), C(a, {
|
37
|
-
headers: e.headers,
|
38
|
-
action: e.action,
|
39
|
-
data: e.data,
|
40
|
-
name: e.name,
|
41
|
-
"before-upload": k,
|
42
|
-
"on-exceed": N,
|
43
|
-
"on-success": y,
|
44
|
-
"file-list": e.files,
|
45
|
-
limit: e.max,
|
46
|
-
drag: "",
|
47
|
-
class: E(f(z).e("control"))
|
48
|
-
}, {
|
49
|
-
tip: d(() => [
|
50
|
-
e.notip ? b("", !0) : (u(), $("div", M, [
|
51
|
-
s("div", U, [
|
52
|
-
r(l, {
|
53
|
-
title: `上传文件支持 ${i.value.join(" / ")} 格式,单个文件大小不超过 ${e.size}MB,且文件数量不超过 ${e.max} 个`,
|
54
|
-
type: "info",
|
55
|
-
"show-icon": "",
|
56
|
-
closable: !1
|
57
|
-
}, null, 8, ["title"])
|
58
|
-
])
|
59
|
-
]))
|
60
|
-
]),
|
61
|
-
default: d(() => [
|
62
|
-
s("div", w, [
|
63
|
-
r(t, { class: "el-icon--upload" }, {
|
64
|
-
default: d(() => [
|
65
|
-
r(f(V))
|
66
|
-
]),
|
67
|
-
_: 1
|
68
|
-
}),
|
69
|
-
o[0] || (o[0] = s("div", { class: "el-upload__text" }, [
|
70
|
-
S(" 将文件拖到此处,或"),
|
71
|
-
s("em", null, "点击上传")
|
72
|
-
], -1))
|
73
|
-
])
|
74
|
-
]),
|
75
|
-
_: 1
|
76
|
-
}, 8, ["headers", "action", "data", "name", "file-list", "limit", "class"]);
|
77
|
-
};
|
78
|
-
}
|
79
|
-
});
|
80
|
-
export {
|
81
|
-
I as default
|
82
|
-
};
|
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./file-upload.vue.cjs");exports.default=e.default;
|
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../withInstall.cjs"),i=require("./src/fixed-action-bar.vue.cjs"),e=t.withInstall(i.default);exports.QxsFixedActionBar=e;exports.default=e;
|
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";var E=Object.defineProperty;var f=Object.getOwnPropertySymbols;var S=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var p=(o,n,t)=>n in o?E(o,n,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[n]=t,h=(o,n)=>{for(var t in n||(n={}))S.call(n,t)&&p(o,t,n[t]);if(f)for(var t of f(n))y.call(n,t)&&p(o,t,n[t]);return o};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),_=require("../../../dist/hooks/src/use-namespace/index.cjs"),l=require("../../../node_modules/.pnpm/@vueuse_core@10.11.1_vue@3.5.12_typescript@5.6.3_/node_modules/@vueuse/core/index.cjs"),$=e.defineComponent({name:"QxsFixedActionBar",inheritAttrs:!1,__name:"fixed-action-bar",props:{padding:{type:String,default:"8px"}},setup(o){const n=o,t=_.useNamespace("fixed-action-bar"),b=e.useAttrs(),s=e.ref(!1),a=e.ref(null),i=e.ref(null),d=l.useParentElement(i),{height:g}=l.useElementSize(a,void 0,{box:"border-box"}),{left:w}=l.useElementBounding(d),{width:x}=l.useElementSize(d,void 0,{box:"border-box"});function r(){const c=window.scrollY||document.documentElement.scrollTop,m=window.innerHeight||document.documentElement.clientHeight,v=document.documentElement.scrollHeight;s.value=Math.ceil(c+m)>=v}e.onMounted(()=>{r(),window.addEventListener("scroll",r)}),e.onUnmounted(()=>{window.removeEventListener("scroll",r)});const u=e.computed(()=>h({width:`${x||0}px`,left:`${w}px`,class:`${s.value?"":t.is("shadow")} ${b.class||""}`},t.cssVarBlock({"actionbar-padding":`${n.padding}`})));return(c,m)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",{ref_key:"placeholderRef",ref:i,style:e.normalizeStyle(`width: 100%; height: ${e.unref(g)}px`)},null,4),e.createElementVNode("div",{ref_key:"actionbar",ref:a,style:e.normalizeStyle(u.value),class:e.normalizeClass([u.value.class,e.unref(t).e("actionbar")]),"data-fixed-calc-width":""},[e.renderSlot(c.$slots,"default")],6)],64))}});exports.default=$;
|
@@ -1,63 +0,0 @@
|
|
1
|
-
var $ = Object.defineProperty;
|
2
|
-
var u = Object.getOwnPropertySymbols;
|
3
|
-
var B = Object.prototype.hasOwnProperty, S = Object.prototype.propertyIsEnumerable;
|
4
|
-
var p = (o, t, e) => t in o ? $(o, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[t] = e, f = (o, t) => {
|
5
|
-
for (var e in t || (t = {}))
|
6
|
-
B.call(t, e) && p(o, e, t[e]);
|
7
|
-
if (u)
|
8
|
-
for (var e of u(t))
|
9
|
-
S.call(t, e) && p(o, e, t[e]);
|
10
|
-
return o;
|
11
|
-
};
|
12
|
-
import { defineComponent as k, useAttrs as H, ref as a, onMounted as z, onUnmounted as A, computed as L, openBlock as C, createElementBlock as F, Fragment as M, createElementVNode as h, normalizeStyle as w, unref as x, normalizeClass as N, renderSlot as P } from "vue";
|
13
|
-
import { useNamespace as R } from "../../../dist/hooks/src/use-namespace/index.js";
|
14
|
-
import { useParentElement as T, useElementSize as b, useElementBounding as V } from "../../../node_modules/.pnpm/@vueuse_core@10.11.1_vue@3.5.12_typescript@5.6.3_/node_modules/@vueuse/core/index.js";
|
15
|
-
const W = /* @__PURE__ */ k({
|
16
|
-
name: "QxsFixedActionBar",
|
17
|
-
inheritAttrs: !1,
|
18
|
-
__name: "fixed-action-bar",
|
19
|
-
props: {
|
20
|
-
padding: {
|
21
|
-
type: String,
|
22
|
-
default: "8px"
|
23
|
-
}
|
24
|
-
},
|
25
|
-
setup(o) {
|
26
|
-
const t = o, e = R("fixed-action-bar"), g = H(), c = a(!1), r = a(null), s = a(null), i = T(s), { height: v } = b(r, void 0, { box: "border-box" }), { left: E } = V(i), { width: y } = b(i, void 0, { box: "border-box" });
|
27
|
-
function n() {
|
28
|
-
const l = window.scrollY || document.documentElement.scrollTop, m = window.innerHeight || document.documentElement.clientHeight, _ = document.documentElement.scrollHeight;
|
29
|
-
c.value = Math.ceil(l + m) >= _;
|
30
|
-
}
|
31
|
-
z(() => {
|
32
|
-
n(), window.addEventListener("scroll", n);
|
33
|
-
}), A(() => {
|
34
|
-
window.removeEventListener("scroll", n);
|
35
|
-
});
|
36
|
-
const d = L(() => f({
|
37
|
-
width: `${y || 0}px`,
|
38
|
-
left: `${E}px`,
|
39
|
-
class: `${c.value ? "" : e.is("shadow")} ${g.class || ""}`
|
40
|
-
}, e.cssVarBlock({
|
41
|
-
"actionbar-padding": `${t.padding}`
|
42
|
-
})));
|
43
|
-
return (l, m) => (C(), F(M, null, [
|
44
|
-
h("div", {
|
45
|
-
ref_key: "placeholderRef",
|
46
|
-
ref: s,
|
47
|
-
style: w(`width: 100%; height: ${x(v)}px`)
|
48
|
-
}, null, 4),
|
49
|
-
h("div", {
|
50
|
-
ref_key: "actionbar",
|
51
|
-
ref: r,
|
52
|
-
style: w(d.value),
|
53
|
-
class: N([d.value.class, x(e).e("actionbar")]),
|
54
|
-
"data-fixed-calc-width": ""
|
55
|
-
}, [
|
56
|
-
P(l.$slots, "default")
|
57
|
-
], 6)
|
58
|
-
], 64));
|
59
|
-
}
|
60
|
-
});
|
61
|
-
export {
|
62
|
-
W as default
|
63
|
-
};
|
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./fixed-action-bar.vue.cjs");exports.default=e.default;
|
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../withInstall.cjs"),l=require("./src/image-upload.vue.cjs"),e=t.withInstall(l.default);exports.QxsImageUpload=e;exports.default=e;
|
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),p=require("../../../node_modules/.pnpm/@element-plus_icons-vue@2.3.1_vue@3.5.12_typescript@5.6.3_/node_modules/@element-plus/icons-vue/dist/index.cjs"),C=require("../../../dist/hooks/src/use-namespace/index.cjs"),u=require("../../../node_modules/.pnpm/element-plus@2.8.7_vue@3.5.12_typescript@5.6.3_/node_modules/element-plus/es/components/message/index.cjs"),$={key:1,class:"image"},B={class:"mask"},E={class:"actions"},S={key:0,class:"el-upload__tip-text"},z={style:{display:"inline-block"}},b=e.defineComponent({name:"QxsImageUpload",__name:"image-upload",props:{action:{},headers:{},data:{},name:{default:"file"},url:{default:""},size:{default:20},width:{default:160},accept:{default:"image/jpeg,image/jpg,image/png,image/gif"},height:{default:90},placeholder:{default:"点击上传图片"},notip:{type:Boolean,default:!1},tipText:{},beforeUpload:{}},emits:["update:url","onSuccess"],setup(m,{emit:h}){const s=m,c=h,d=C.useNamespace("image-upload"),l=e.ref({imageViewerVisible:!1,progress:{preview:"",percent:0}}),n=e.computed(()=>s.accept.split(",").map(t=>t.split("/").pop()));function g(){l.value.imageViewerVisible=!0}function f(){l.value.imageViewerVisible=!1}function v(){c("update:url","")}const w=t=>{var r;const i=(r=t.name.split(".").at(-1))!=null?r:"",o=n.value.includes(i),a=t.size/1024/1024<s.size;return o?a?l.value.progress.preview=URL.createObjectURL(t):u.ElMessage.error(`上传图片大小不能超过 ${s.size}MB!`):u.ElMessage.error(`上传图片只支持${n.value.join(" / ")}格式!`),o&&a&&(!s.beforeUpload||s.beforeUpload(t))},V=t=>{l.value.progress.percent=~~t.percent},y=(...t)=>{l.value.progress.preview="",l.value.progress.percent=0,c("onSuccess",...t)};return(t,N)=>{const i=e.resolveComponent("el-icon"),o=e.resolveComponent("el-image"),a=e.resolveComponent("el-progress"),r=e.resolveComponent("el-upload"),k=e.resolveComponent("el-image-viewer");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(d).e("upload-container"))},[e.createVNode(r,{"show-file-list":!1,headers:t.headers,action:t.action,data:t.data,name:t.name,"before-upload":w,"on-progress":V,"on-success":y,drag:"",accept:t.accept,class:e.normalizeClass(e.unref(d).e("image-upload"))},{default:e.withCtx(()=>[t.url===""?(e.openBlock(),e.createBlock(o,{key:0,src:t.url===""?t.placeholder:t.url,style:e.normalizeStyle(`width:${t.width}px;height:${t.height}px;`),fit:"fill"},{error:e.withCtx(()=>[e.createElementVNode("div",{class:"image-slot",style:e.normalizeStyle(`width:${t.width}px;height:${t.height}px;`)},[e.createVNode(i,null,{default:e.withCtx(()=>[e.createVNode(e.unref(p.Plus))]),_:1}),e.createElementVNode("p",null,e.toDisplayString(t.placeholder),1)],4)]),_:1},8,["src","style"])):(e.openBlock(),e.createElementBlock("div",$,[e.createVNode(o,{src:t.url,style:e.normalizeStyle(`width:${t.width}px;height:${t.height}px;`),fit:"fill"},null,8,["src","style"]),e.createElementVNode("div",B,[e.createElementVNode("div",E,[e.createElementVNode("span",{title:"预览",onClick:e.withModifiers(g,["stop"])},[e.createVNode(i,null,{default:e.withCtx(()=>[e.createVNode(e.unref(p.ZoomIn))]),_:1})]),e.createElementVNode("span",{title:"移除",onClick:e.withModifiers(v,["stop"])},[e.createVNode(i,null,{default:e.withCtx(()=>[e.createVNode(e.unref(p.Delete))]),_:1})])])])])),e.withDirectives(e.createElementVNode("div",{class:"progress",style:e.normalizeStyle(`width:${t.width}px;height:${t.height}px;`)},[e.createVNode(o,{src:l.value.progress.preview,style:e.normalizeStyle(`width:${t.width}px;height:${t.height}px;`),fit:"fill"},null,8,["src","style"]),e.createVNode(a,{type:"circle",width:Math.min(t.width,t.height)*.8,percentage:l.value.progress.percent},null,8,["width","percentage"])],4),[[e.vShow,t.url===""&&l.value.progress.percent]])]),_:1},8,["headers","action","data","name","accept","class"]),t.notip?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",S,[e.createElementVNode("div",z,e.toDisplayString(t.tipText||`上传图片支持 ${n.value.join(" / ")} 格式,且图片大小不超过 ${t.size}MB,建议图片尺寸为 ${t.width}*${t.height}`),1)])),l.value.imageViewerVisible?(e.openBlock(),e.createBlock(k,{key:1,"url-list":[t.url],teleported:"",onClose:f},null,8,["url-list"])):e.createCommentVNode("",!0)],2)}}});exports.default=b;
|
@@ -1,164 +0,0 @@
|
|
1
|
-
import { defineComponent as E, ref as I, computed as O, resolveComponent as r, openBlock as n, createElementBlock as g, normalizeClass as w, unref as p, createVNode as l, withCtx as d, createBlock as y, normalizeStyle as u, createElementVNode as t, toDisplayString as $, withModifiers as k, withDirectives as T, vShow as L, createCommentVNode as _ } from "vue";
|
2
|
-
import { Plus as P, ZoomIn as R, Delete as Q } from "../../../node_modules/.pnpm/@element-plus_icons-vue@2.3.1_vue@3.5.12_typescript@5.6.3_/node_modules/@element-plus/icons-vue/dist/index.js";
|
3
|
-
import { useNamespace as Z } from "../../../dist/hooks/src/use-namespace/index.js";
|
4
|
-
import { ElMessage as V } from "../../../node_modules/.pnpm/element-plus@2.8.7_vue@3.5.12_typescript@5.6.3_/node_modules/element-plus/es/components/message/index.js";
|
5
|
-
const q = {
|
6
|
-
key: 1,
|
7
|
-
class: "image"
|
8
|
-
}, A = { class: "mask" }, F = { class: "actions" }, G = {
|
9
|
-
key: 0,
|
10
|
-
class: "el-upload__tip-text"
|
11
|
-
}, H = { style: { display: "inline-block" } }, Y = /* @__PURE__ */ E({
|
12
|
-
name: "QxsImageUpload",
|
13
|
-
__name: "image-upload",
|
14
|
-
props: {
|
15
|
-
action: {},
|
16
|
-
headers: {},
|
17
|
-
data: {},
|
18
|
-
name: { default: "file" },
|
19
|
-
url: { default: "" },
|
20
|
-
size: { default: 20 },
|
21
|
-
width: { default: 160 },
|
22
|
-
accept: { default: "image/jpeg,image/jpg,image/png,image/gif" },
|
23
|
-
height: { default: 90 },
|
24
|
-
placeholder: { default: "点击上传图片" },
|
25
|
-
notip: { type: Boolean, default: !1 },
|
26
|
-
tipText: {},
|
27
|
-
beforeUpload: {}
|
28
|
-
},
|
29
|
-
emits: ["update:url", "onSuccess"],
|
30
|
-
setup(b, { emit: z }) {
|
31
|
-
const o = b, f = z, v = Z("image-upload"), s = I({
|
32
|
-
imageViewerVisible: !1,
|
33
|
-
progress: {
|
34
|
-
preview: "",
|
35
|
-
percent: 0
|
36
|
-
}
|
37
|
-
}), m = O(() => o.accept.split(",").map((e) => e.split("/").pop()));
|
38
|
-
function C() {
|
39
|
-
s.value.imageViewerVisible = !0;
|
40
|
-
}
|
41
|
-
function B() {
|
42
|
-
s.value.imageViewerVisible = !1;
|
43
|
-
}
|
44
|
-
function S() {
|
45
|
-
f("update:url", "");
|
46
|
-
}
|
47
|
-
const U = (e) => {
|
48
|
-
var h;
|
49
|
-
const a = (h = e.name.split(".").at(-1)) != null ? h : "", i = m.value.includes(a), c = e.size / 1024 / 1024 < o.size;
|
50
|
-
return i ? c ? s.value.progress.preview = URL.createObjectURL(e) : V.error(`上传图片大小不能超过 ${o.size}MB!`) : V.error(`上传图片只支持${m.value.join(" / ")}格式!`), i && c && (!o.beforeUpload || o.beforeUpload(e));
|
51
|
-
}, N = (e) => {
|
52
|
-
s.value.progress.percent = ~~e.percent;
|
53
|
-
}, j = (...e) => {
|
54
|
-
s.value.progress.preview = "", s.value.progress.percent = 0, f("onSuccess", ...e);
|
55
|
-
};
|
56
|
-
return (e, M) => {
|
57
|
-
const a = r("el-icon"), i = r("el-image"), c = r("el-progress"), h = r("el-upload"), D = r("el-image-viewer");
|
58
|
-
return n(), g("div", {
|
59
|
-
class: w(p(v).e("upload-container"))
|
60
|
-
}, [
|
61
|
-
l(h, {
|
62
|
-
"show-file-list": !1,
|
63
|
-
headers: e.headers,
|
64
|
-
action: e.action,
|
65
|
-
data: e.data,
|
66
|
-
name: e.name,
|
67
|
-
"before-upload": U,
|
68
|
-
"on-progress": N,
|
69
|
-
"on-success": j,
|
70
|
-
drag: "",
|
71
|
-
accept: e.accept,
|
72
|
-
class: w(p(v).e("image-upload"))
|
73
|
-
}, {
|
74
|
-
default: d(() => [
|
75
|
-
e.url === "" ? (n(), y(i, {
|
76
|
-
key: 0,
|
77
|
-
src: e.url === "" ? e.placeholder : e.url,
|
78
|
-
style: u(`width:${e.width}px;height:${e.height}px;`),
|
79
|
-
fit: "fill"
|
80
|
-
}, {
|
81
|
-
error: d(() => [
|
82
|
-
t("div", {
|
83
|
-
class: "image-slot",
|
84
|
-
style: u(`width:${e.width}px;height:${e.height}px;`)
|
85
|
-
}, [
|
86
|
-
l(a, null, {
|
87
|
-
default: d(() => [
|
88
|
-
l(p(P))
|
89
|
-
]),
|
90
|
-
_: 1
|
91
|
-
}),
|
92
|
-
t("p", null, $(e.placeholder), 1)
|
93
|
-
], 4)
|
94
|
-
]),
|
95
|
-
_: 1
|
96
|
-
}, 8, ["src", "style"])) : (n(), g("div", q, [
|
97
|
-
l(i, {
|
98
|
-
src: e.url,
|
99
|
-
style: u(`width:${e.width}px;height:${e.height}px;`),
|
100
|
-
fit: "fill"
|
101
|
-
}, null, 8, ["src", "style"]),
|
102
|
-
t("div", A, [
|
103
|
-
t("div", F, [
|
104
|
-
t("span", {
|
105
|
-
title: "预览",
|
106
|
-
onClick: k(C, ["stop"])
|
107
|
-
}, [
|
108
|
-
l(a, null, {
|
109
|
-
default: d(() => [
|
110
|
-
l(p(R))
|
111
|
-
]),
|
112
|
-
_: 1
|
113
|
-
})
|
114
|
-
]),
|
115
|
-
t("span", {
|
116
|
-
title: "移除",
|
117
|
-
onClick: k(S, ["stop"])
|
118
|
-
}, [
|
119
|
-
l(a, null, {
|
120
|
-
default: d(() => [
|
121
|
-
l(p(Q))
|
122
|
-
]),
|
123
|
-
_: 1
|
124
|
-
})
|
125
|
-
])
|
126
|
-
])
|
127
|
-
])
|
128
|
-
])),
|
129
|
-
T(t("div", {
|
130
|
-
class: "progress",
|
131
|
-
style: u(`width:${e.width}px;height:${e.height}px;`)
|
132
|
-
}, [
|
133
|
-
l(i, {
|
134
|
-
src: s.value.progress.preview,
|
135
|
-
style: u(`width:${e.width}px;height:${e.height}px;`),
|
136
|
-
fit: "fill"
|
137
|
-
}, null, 8, ["src", "style"]),
|
138
|
-
l(c, {
|
139
|
-
type: "circle",
|
140
|
-
width: Math.min(e.width, e.height) * 0.8,
|
141
|
-
percentage: s.value.progress.percent
|
142
|
-
}, null, 8, ["width", "percentage"])
|
143
|
-
], 4), [
|
144
|
-
[L, e.url === "" && s.value.progress.percent]
|
145
|
-
])
|
146
|
-
]),
|
147
|
-
_: 1
|
148
|
-
}, 8, ["headers", "action", "data", "name", "accept", "class"]),
|
149
|
-
e.notip ? _("", !0) : (n(), g("div", G, [
|
150
|
-
t("div", H, $(e.tipText || `上传图片支持 ${m.value.join(" / ")} 格式,且图片大小不超过 ${e.size}MB,建议图片尺寸为 ${e.width}*${e.height}`), 1)
|
151
|
-
])),
|
152
|
-
s.value.imageViewerVisible ? (n(), y(D, {
|
153
|
-
key: 1,
|
154
|
-
"url-list": [e.url],
|
155
|
-
teleported: "",
|
156
|
-
onClose: B
|
157
|
-
}, null, 8, ["url-list"])) : _("", !0)
|
158
|
-
], 2);
|
159
|
-
};
|
160
|
-
}
|
161
|
-
});
|
162
|
-
export {
|
163
|
-
Y as default
|
164
|
-
};
|
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./image-upload.vue.cjs");exports.default=e.default;
|
package/src/make-installer.cjs
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../package.json.cjs");function a(e){const n=r=>{for(const t in e)r.use(e[t])};return{version:s.version,install:n}}exports.makeInstaller=a;
|
package/src/make-installer.js
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("../withInstall.cjs"),t=require("./src/photo-crop-tool.vue.cjs"),e=o.withInstall(t.default);exports.QxsPhotoCropTool=e;exports.default=e;
|
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("vue");function g(l){const e=d.ref(null);return l&&(e.value=l.getContext("2d")),{clearCanvas:()=>{e.value&&e.value.clearRect(0,0,l.width,l.height)},drawColor:(o,r,t,n,a)=>{e.value&&(e.value.fillStyle=a,e.value.fillRect(o,r,t,n))},drawImage:(o,r,t,n,a)=>{e.value.drawImage(o,r,t,n,a)},cropCanvas:(o,r,t,n)=>new Promise(a=>{if(e.value){const u=document.createElement("canvas");u.width=t,u.height=n;const c=u.getContext("2d");c?(c.drawImage(l,o,r,t,n,0,0,t,n),u.toBlob(i=>{if(i){const s=new File([i],"cropped_image.png",{type:"image/png"});a(s)}else a(null)},"image/png")):a(null)}else a(null)})}}exports.useCanvas=g;
|
@@ -1,33 +0,0 @@
|
|
1
|
-
import { ref as s } from "vue";
|
2
|
-
function v(l) {
|
3
|
-
const e = s(null);
|
4
|
-
return l && (e.value = l.getContext("2d")), {
|
5
|
-
clearCanvas: () => {
|
6
|
-
e.value && e.value.clearRect(0, 0, l.width, l.height);
|
7
|
-
},
|
8
|
-
drawColor: (o, r, t, n, a) => {
|
9
|
-
e.value && (e.value.fillStyle = a, e.value.fillRect(o, r, t, n));
|
10
|
-
},
|
11
|
-
drawImage: (o, r, t, n, a) => {
|
12
|
-
e.value.drawImage(o, r, t, n, a);
|
13
|
-
},
|
14
|
-
cropCanvas: (o, r, t, n) => new Promise((a) => {
|
15
|
-
if (e.value) {
|
16
|
-
const c = document.createElement("canvas");
|
17
|
-
c.width = t, c.height = n;
|
18
|
-
const u = c.getContext("2d");
|
19
|
-
u ? (u.drawImage(l, o, r, t, n, 0, 0, t, n), c.toBlob((i) => {
|
20
|
-
if (i) {
|
21
|
-
const p = new File([i], "cropped_image.png", { type: "image/png" });
|
22
|
-
a(p);
|
23
|
-
} else
|
24
|
-
a(null);
|
25
|
-
}, "image/png")) : a(null);
|
26
|
-
} else
|
27
|
-
a(null);
|
28
|
-
})
|
29
|
-
};
|
30
|
-
}
|
31
|
-
export {
|
32
|
-
v as useCanvas
|
33
|
-
};
|
@@ -1 +0,0 @@
|
|
1
|
-
"use strict";var P=(M,S,a)=>new Promise((T,E)=>{var f=v=>{try{h(a.next(v))}catch(u){E(u)}},x=v=>{try{h(a.throw(v))}catch(u){E(u)}},h=v=>v.done?T(v.value):Promise.resolve(v.value).then(f,x);h((a=a.apply(M,S)).next())});Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),J=require("../../../dist/hooks/src/use-namespace/index.cjs"),$=require("../../../node_modules/.pnpm/@vueuse_core@10.11.1_vue@3.5.12_typescript@5.6.3_/node_modules/@vueuse/core/index.cjs"),K=require("./composables.cjs"),Z=["src"],ee=e.defineComponent({name:"QxsPhotoCropTool",__name:"photo-crop-tool",props:{imgFile:{type:Object,default:()=>null},aspectRatio:{type:String,default:()=>"16 / 9"},defaultWidth:{type:Number,default:()=>320},defaultHeight:{type:Number,default:()=>180},zoomType:{type:String,default:()=>"fixed"}},setup(M,{expose:S}){const a=M;let T=0,E=0,f=0,x=0;const h=J.useNamespace("photo-crop-tool"),v=e.ref(null),u=e.ref(null),B=e.ref(null),F=e.ref(""),c=e.ref(""),L=e.ref({x:0,y:0}),t=e.ref({width:a.defaultWidth,height:a.defaultHeight,x:0,y:0}),{width:k,height:N}=$.useElementSize(v),{width:X}=$.useElementSize(B),{x:m,y:g,style:Y}=$.useDraggable(v,{containerElement:u,draggingElement:v,disabled:e.computed(()=>!!c.value),exact:!0,initialValue:L}),V=e.computed(()=>a.imgFile?URL.createObjectURL(a.imgFile):"");e.watch(()=>a.imgFile,l=>{l&&!l.type.startsWith("image/")?F.value="文件类型错误":F.value=""});const D=e.computed(()=>{var l;return(((l=B.value)==null?void 0:l.naturalWidth)||0)/X.value}),p=e.computed(()=>{const l={left:0,top:0};return c.value==="bottom-right"?(l.left=t.value.x,l.top=t.value.y):c.value==="top-left"?(l.left=t.value.x-k.value,l.top=t.value.y-N.value):c.value==="top-right"?(l.top=t.value.y-N.value,l.left=t.value.x):c.value==="bottom-left"&&(l.left=t.value.x-k.value,l.top=t.value.y),l}),Q=e.computed(()=>{const{aspectRatio:l}=a,i={width:`${t.value.width||a.defaultWidth}`,height:`${t.value.height||a.defaultHeight}`,"aspect-ratio":l,top:`${p.value.top}px`,left:`${p.value.left}px`};return a.zoomType==="free"?delete i["aspect-ratio"]:a.zoomType==="fixed"&&delete i.height,h.cssVarBlock(i)});function y(l){return l*D.value}function A(){return P(this,arguments,function*(l=B.value){var W,C;let i="transparent";u.value&&(i=window.getComputedStyle(u.value).backgroundColor);const n=document.createElement("canvas");n.width=y(((W=u.value)==null?void 0:W.clientWidth)||0),n.height=y(((C=u.value)==null?void 0:C.clientHeight)||0);const{drawImage:H,cropCanvas:b,drawColor:z}=K.useCanvas(n);return z(0,0,n.width,n.height,i),H(l,y(l.offsetLeft),y(l.offsetTop),l.naturalWidth,l.naturalHeight),yield b(y(m.value),y(g.value),y(k.value),y(N.value))})}function w(l,i){var b,z;const n=((b=u.value)==null?void 0:b.clientWidth)||1/0,H=((z=u.value)==null?void 0:z.clientHeight)||1/0;return{width:Math.min(Math.max(l,0),n),height:Math.min(Math.max(i,0),H)}}function U(l){var H,b,z,W,C,j,q,O;const i=l.clientX-T,n=l.clientY-E;if(c.value==="bottom-right"){if(a.zoomType==="free"){const{width:s,height:o}=w(f+i,x+n);t.value.width=s,t.value.height=o}else if(a.zoomType==="fixed"){const s=Number.parseFloat(a.aspectRatio.split(" / ")[0])/Number.parseFloat(a.aspectRatio.split(" / ")[1]);let o=f+i,r=o/s;const{width:R,height:d}=w(o,r);d>(((H=u.value)==null?void 0:H.clientHeight)||1/0)&&(r=((b=u.value)==null?void 0:b.clientHeight)||1/0,o=r*s),t.value.width=R,t.value.height=d}}else if(c.value==="top-left"){if(a.zoomType==="free"){const{width:s,height:o}=w(f-i,x-n);t.value.width=s,t.value.height=o}else if(a.zoomType==="fixed"){const s=Number.parseFloat(a.aspectRatio.split(" / ")[0])/Number.parseFloat(a.aspectRatio.split(" / ")[1]);let o=f-i,r=o/s;const{width:R,height:d}=w(o,r);d>(((z=u.value)==null?void 0:z.clientHeight)||1/0)&&(r=((W=u.value)==null?void 0:W.clientHeight)||1/0,o=r*s),t.value.width=R,t.value.height=d}m.value=p.value.left,g.value=p.value.top}else if(c.value==="top-right"){if(a.zoomType==="free"){const{width:s,height:o}=w(f+i,x-n);t.value.width=s,t.value.height=o}else if(a.zoomType==="fixed"){const s=Number.parseFloat(a.aspectRatio.split(" / ")[0])/Number.parseFloat(a.aspectRatio.split(" / ")[1]);let o=f+i,r=o/s;const{width:R,height:d}=w(o,r);d>(((C=u.value)==null?void 0:C.clientHeight)||1/0)&&(r=((j=u.value)==null?void 0:j.clientHeight)||1/0,o=r*s),t.value.width=R,t.value.height=d}m.value=p.value.left,g.value=p.value.top}else if(c.value==="bottom-left"){if(a.zoomType==="free"){const{width:s,height:o}=w(f-i,x+n);t.value.width=s,t.value.height=o}else if(a.zoomType==="fixed"){const s=Number.parseFloat(a.aspectRatio.split(" / ")[0])/Number.parseFloat(a.aspectRatio.split(" / ")[1]);let o=f-i,r=o/s;const{width:R,height:d}=w(o,r);d>(((q=u.value)==null?void 0:q.clientHeight)||1/0)&&(r=((O=u.value)==null?void 0:O.clientHeight)||1/0,o=r*s),t.value.width=R,t.value.height=d}m.value=p.value.left,g.value=p.value.top}l.preventDefault(),l.stopPropagation()}function I(l,i){c.value=i,T=l.clientX,E=l.clientY,f=t.value.width,x=t.value.height,i==="bottom-right"?(t.value.x=m.value,t.value.y=g.value):i==="top-left"?(t.value.x=m.value+k.value,t.value.y=g.value+N.value):i==="top-right"?(t.value.x=m.value,t.value.y=g.value+N.value):i==="bottom-left"&&(t.value.x=m.value+k.value,t.value.y=g.value)}function _(){c.value=""}function G(){t.value.width=a.defaultWidth,t.value.height=a.defaultHeight,m.value=0,g.value=0}return document.addEventListener("mouseup",_),document.addEventListener("mousemove",U),e.onMounted(()=>{e.nextTick(()=>{var l,i;L.value.x=(((l=u.value)==null?void 0:l.offsetWidth)||0)/2-t.value.width/2,L.value.y=(((i=u.value)==null?void 0:i.offsetHeight)||0)/2-t.value.height/2})}),e.onUnmounted(()=>{V.value&&URL.revokeObjectURL(V.value),document.removeEventListener("mouseup",_),document.removeEventListener("mousemove",U)}),S({crop:A,resize:G}),(l,i)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"containerBoxRef",ref:u,class:e.normalizeClass([e.unref(h).e("img-box")])},[F.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass([e.unref(h).e("error-message")])},e.toDisplayString(F.value),3)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createElementVNode("img",{ref_key:"imgRef",ref:B,class:e.normalizeClass([e.unref(h).e("image")]),src:V.value},null,10,Z),e.createElementVNode("div",{ref_key:"cropBoxRef",ref:v,class:e.normalizeClass([e.unref(h).e("crop-tool-box")]),style:e.normalizeStyle([Q.value,c.value?`left: ${p.value.left}px;top: ${p.value.top}px`:e.unref(Y)])},[e.createElementVNode("div",{class:e.normalizeClass([e.unref(h).e("top-left")]),onMousedown:i[0]||(i[0]=n=>I(n,"top-left"))},null,34),e.createElementVNode("div",{class:e.normalizeClass([e.unref(h).e("top-right")]),onMousedown:i[1]||(i[1]=n=>I(n,"top-right"))},null,34),e.createElementVNode("div",{class:e.normalizeClass([e.unref(h).e("bottom-right")]),onMousedown:i[2]||(i[2]=n=>I(n,"bottom-right"))},null,34),e.createElementVNode("div",{class:e.normalizeClass([e.unref(h).e("bottom-left")]),onMousedown:i[3]||(i[3]=n=>I(n,"bottom-left"))},null,34)],6)],64))],2))}});exports.default=ee;
|