@soei/flyweight 0.3.0 → 0.3.2
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/Flyweight.cjs +1 -1
- package/Flyweight.js +137 -131
- package/package.json +1 -1
- package/style.css +1 -1
- package/vue2/index.cjs +1 -1
- package/vue2/index.js +31 -25
- package/vue2/style.css +1 -1
package/Flyweight.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("@soei/util"),l=require("vue");let I=/(\d+|[+\-\*/]|%)/g,N={"+":(e,t)=>e+t,"-":(e,t)=>e-t,"*":(e,t)=>e*t,"/":(e,t)=>e/t,"%":(e,t,s)=>parseFloat(e)/100*s},C=(e,t)=>{let s;if(s=c.runer("match",e,I)){let h=s.length,r,n=0,i,o=[];for(;h--;)n=s.shift(),n in N?(r&&o.push(r),n==="%"&&(o.length=2),i=n):+n&&o.push(+n),o.length==2&&(o.push(t),r=N[i].apply(null,o),o.length=0);+r||(r=+o.pop()),e=r>>0}return e},B=e=>(e+"").replace(/\w+\((.*)\)/g,"$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g,"$1px");const E=(e,t)=>{const s=e.__vccOpts||e;for(const[h,r]of t)s[h]=r;return s};let L=e=>e==null||e==null,V=(...e)=>{console.info("::::FLYWEIGHT",...e)};const W={name:"Flyweight",props:{flys:{type:Array,default:()=>[]},width:{type:Number,default:0},height:{type:Number,default:100},offset:{type:Array,default:()=>[0,0]},lazy:{type:Number,default:100},view:{type:Object,default:()=>({id:0})},index:{type:Number,default:0},top:{type:Number,default:!1},left:{type:Number,default:!1},auto:{type:[Boolean,String],default:!1},space:{type:Object,default:()=>null},padding:{type:Boolean,default:!1}},computed:{flyweight(){return this.$refs.flyweight||""}},data(){return{flyweights:[],actice:!1,Size:null,column:1,row:1,expand:10,count:0,task:[],realW:0,realH:0}},watch:{flys(e){this.count=e.length,this.rebuild();let t=this.task.shift();t&&this.$nextTick(()=>{this.setview(t)})},view:{handler(e){this.setview(e)},immediate:!0,deep:!0},index(e){this.setindex(e)},top(e){this.flyweight.scrollTop=e},left(e){this.flyweight.scrollLeft=e}},mounted(){this.flyweights=[],this.$set||(this.$set=(e,t,s)=>{e[t]=s}),this.setindex(this.index);try{new ResizeObserver(()=>{this.rebuild(),this.$emit("resize")}).observe(this.flyweight)}catch(e){V(e)}this.scrollx=c.runer("hasAttribute",this.flyweight,"scroll-x"),this.BoxRule="clientHeight=>height,clientWidth=>width",this.direction=this.scrollx?"scrollLeft":"scrollTop"},methods:{exec:B,trigger(e,t){
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("@soei/util"),l=require("vue");let I=/(\d+|[+\-\*/]|%)/g,N={"+":(e,t)=>e+t,"-":(e,t)=>e-t,"*":(e,t)=>e*t,"/":(e,t)=>e/t,"%":(e,t,s)=>parseFloat(e)/100*s},C=(e,t)=>{let s;if(s=c.runer("match",e,I)){let h=s.length,r,n=0,i,o=[];for(;h--;)n=s.shift(),n in N?(r&&o.push(r),n==="%"&&(o.length=2),i=n):+n&&o.push(+n),o.length==2&&(o.push(t),r=N[i].apply(null,o),o.length=0);+r||(r=+o.pop()),e=r>>0}return e},B=e=>(e+"").replace(/\w+\((.*)\)/g,"$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g,"$1px");const E=(e,t)=>{const s=e.__vccOpts||e;for(const[h,r]of t)s[h]=r;return s};let L=e=>e==null||e==null,V=(...e)=>{console.info("::::FLYWEIGHT",...e)};const W={name:"Flyweight",props:{flys:{type:Array,default:()=>[]},width:{type:Number,default:0},height:{type:Number,default:100},offset:{type:Array,default:()=>[0,0]},lazy:{type:Number,default:100},view:{type:Object,default:()=>({id:0})},index:{type:Number,default:0},top:{type:Number,default:!1},left:{type:Number,default:!1},auto:{type:[Boolean,String],default:!1},space:{type:Object,default:()=>null},padding:{type:Boolean,default:!1}},computed:{flyweight(){return this.$refs.flyweight||""}},data(){return{flyweights:[],actice:!1,Size:null,column:1,row:1,expand:10,count:0,task:[],realW:0,realH:0}},watch:{flys(e){this.count=e.length,this.rebuild();let t=this.task.shift();t&&this.$nextTick(()=>{this.setview(t)})},view:{handler(e){this.setview(e)},immediate:!0,deep:!0},index(e){this.setindex(e)},top(e){this.flyweight.scrollTop=e},left(e){this.flyweight.scrollLeft=e}},mounted(){this.flyweights=[],this.$set||(this.$set=(e,t,s)=>{e[t]=s}),this.setindex(this.index);try{new ResizeObserver(()=>{this.rebuild(),this.$emit("resize")}).observe(this.flyweight)}catch(e){V(e)}this.scrollx=c.runer("hasAttribute",this.flyweight,"scroll-x"),this.BoxRule="clientHeight=>height,clientWidth=>width",this.direction=this.scrollx?"scrollLeft":"scrollTop"},methods:{exec:B,trigger(e,t){c.isArray(e)||(e=e&&t?[[e,t]]:[]),e.length&&this.lazyrun(()=>{c.each(e,(s,h)=>{this.$emit(h[0],L(h[1])?!0:h[1])})})},cheackflys(e){if(!this.flys.length)return e&&this.task.push(e),!0},setview(e){c.runer([this.cheackflys,t=>{t=t||{};let s=t.index||c.each(this.flys,(h,r,n,i)=>{if(r[n]==i)return h},t.picker,t.id);L(s)||this.setindex(s)}],this,e)},setindex(e){c.runer([this.cheackflys,({index:t})=>{this.selectIndex=t,this.$nextTick(()=>{let s=t/this.column>>0,h=this.expand;(this.flyweight[this.direction]/h>>0)+this.row-s-1>0||(this.flyweight[this.direction]=s*h,this.scroll())})}],this,{index:e})},lazyrun(e,t){clearTimeout(this.time),this.time=setTimeout(()=>{c.runer(e)},t||this.lazy)},run(e){let t=[],s=c.runer(this.direction,e.target),h={offset:s,top:s,width:this.realW,height:this.realH,index:s/this.expand>>0};c.merge(h,this.space),e.from||t.push(["onscroll",h]);let r=!1;c.each(this.flyweights,(n,i,o,d,f,u,g,p,a)=>{if(o=n/f>>0,p=o+d*(+(o<u%d)+(u/d>>0)),a=p*f+n%f,a>=this.count){r||(t.push(["onend"]),r=!0);return}i.index=p,i.i=a,i.data=this.flys[a];let y=[p*this.expand+i.x,i.space];g&&y.reverse(),i.top=y[0],i.left=y[1]},null,this.row,this.column,h.index,this.scrollx),this.trigger(t),t=null},scroll(e){this.run(e||{target:this.flyweight,from:"space"})},rebuild(){let e=this.count||this.flys.length,t=this.flyweights;if(!e)return t.length=e;this.count=e;let s=this.scrollx,h=this.flyweight,r=c.picker(h,this.BoxRule);this.$nextTick(()=>{let n=/true/.test(this.auto),[i,o]=this.offset,d=r.width,f=r.height,u=(C(this.width,d)||d)+i,g=C(this.height,f)+o,p=[d/u>>0||1,f/g>>0||1];s&&p.reverse();let[a,y]=p,_=this.padding,S,k=0,m,b;s?(m=u,u-=i,b=w=>w*(g-o)+(w+1)*o):(n?(u=(d-i*(a+2*_-1))/a,S=!_*i,k=_*i):(S=0,k=(d%u+i*a)/(a+1)>>0,u-=i),b=w=>w*(u+S)+(w+1)*k,m=g),this.row=y+2,this.column=a,this.realH=g-o,this.realW=u,this.expand=m,this.Size=Math.ceil(e/a)*m;let T=Math.min(e,a*this.row),x=T-1,z;for(;T-- >0;)z=x-T,this.$set(t,z,{x:i,y:o,width:u,height:g-o,space:b(z%a),data:{}});t.length=x+1;let v=[];f/m>x/a&&v.push(["onend"]),this.flyweight&&(this.flyweight[this.direction]=0),this.$nextTick(()=>{this.setindex(this.selectIndex||0),this.scroll()}),v.push(["update:space",{row:(x/a>>0)+1,column:a,showrow:this.row,showcolumn:this.column}]),this.trigger(v)})}}},j={class:"flyweight-all"};function M(e,t,s,h,r,n){return l.openBlock(),l.createElementBlock("div",{ref:"flyweight",class:l.normalizeClass(["flyweight",{"flyweight-active":r.actice}]),style:l.normalizeStyle({"--width":n.exec(r.realW),"--height":n.exec(r.realH),"--flyweight-content":n.exec(r.Size)}),onScroll:t[0]||(t[0]=(...i)=>n.scroll&&n.scroll(...i))},[l.createElementVNode("div",j,[(l.openBlock(!0),l.createElementBlock(l.Fragment,null,l.renderList(r.flyweights,(i,o)=>(l.openBlock(),l.createElementBlock("div",{key:o,style:l.normalizeStyle({top:i.top+"px",left:i.left+"px"})},[l.renderSlot(e.$slots,"default",l.mergeProps({ref_for:!0},i),void 0,!0)],4))),128))]),r.flyweights.length?l.renderSlot(e.$slots,"end",{key:0},void 0,!0):l.createCommentVNode("",!0)],38)}const F=E(W,[["render",M],["__scopeId","data-v-5ecef76b"]]);function $(e,t){return t&&(e=e.replace(/[a-z]/g,"")),e.toLowerCase()}let H={close:{handler(e){this.change(e)},deep:!0},offset:{handler(e){this.margin(e)},deep:!0}},P=["BackGround","BordeR","Height","Width","Top","Right","Bottom","Left"],O={};c.each(P,(e,t,s)=>{e=$(t),O["--"+$(t,!0)]=e,s[e]=function(){this.trigger++}},H);const q={name:"Card",props:{offset:{type:[String,Array],default:()=>[0,0,0,0]},background:{type:String,default:""},border:{type:String,default:"1px"},height:{type:String,default:"100%"},width:{type:String,default:"100%"},show:{type:String,default:""},close:{type:Object,default:null},title:{type:String,default:""}},data(){return{closecss:{},trigger:0,default:{top:"0px",right:"0px",bottom:"0px",left:"0px",height:"100%",width:"100%",background:"",border:"1px"}}},computed:{style(){return this.tr()}},watch:H,methods:{exec:B,isEmpty:c.isEmpty,isSimplyType:c.isSimplyType,tr(){let e={};return this.margin(this.offset),c.each(O,(t,s)=>{this.css(e,t,s)}),e},tolower:$,css(e,t,s){let h=this[s]||this.default[s];!h||this.default[s]==h||(e[t]=B(h))},change(e){c.isSimplyType(e)||(this.closecss=c.picker(e,"color=>--s-card-close-color,size=>--s-close-width,bold=>--s-close-height,*"))},margin(e){c.merge(this,c.picker(c.isString(e)?e.split(/\s*(?:,|\s+)\s*/):e,"0=>top,1|0=>right,2|0=>bottom,3|1|0=>left",!0),!0)}},mounted(){this.change(this.close)}},D={class:"card-title"},G={class:"card-content"};function U(e,t,s,h,r,n){return l.openBlock(),l.createElementBlock("div",{class:"card",key:r.trigger,style:l.normalizeStyle(n.isEmpty(n.style)?n.tr():n.style)},[l.renderSlot(e.$slots,"default",{},()=>[l.renderSlot(e.$slots,"title",{},()=>[l.createElementVNode("div",D,[l.createTextVNode(l.toDisplayString(s.show||s.title)+" ",1),l.createElementVNode("div",{class:l.normalizeClass(["card-close",{hide:n.isSimplyType(s.close)?!s.close:!1}]),style:l.normalizeStyle(r.closecss),onClick:t[0]||(t[0]=i=>e.$emit("close"))},null,6)])],!0),l.renderSlot(e.$slots,"content",{},()=>[l.createElementVNode("div",G,[l.renderSlot(e.$slots,"inner",{},void 0,!0)])],!0)],!0)],4)}const A=E(q,[["render",U],["__scopeId","data-v-4c41de24"]]),X={name:"Stream",props:{type:{type:String,default:"div"},data:{type:Array,default:()=>[]},T:{type:Array,default:()=>[]}},methods:{trigger(e){let t=e.slot||e.type;return(this.$scopedSlots||this.$slots)[t]?t:"default"}}};function Y(e,t,s,h,r,n){return l.openBlock(),l.createBlock(l.resolveDynamicComponent(s.type),l.mergeProps(e.$attrs,{data:s.data}),{default:l.withCtx(()=>[(l.openBlock(!0),l.createElementBlock(l.Fragment,null,l.renderList(s.T,i=>l.renderSlot(e.$slots,n.trigger(i),l.mergeProps({key:i.type,ref_for:!0},i))),128))]),_:3},16,["data"])}const R=E(X,[["render",Y]]),J=[F,A,R],K={install(e){J.forEach(t=>{e.component("S"+t.name,t),e.component(t.name+"S",t)})}};exports.Card=A;exports.Flyweight=F;exports.Stream=R;exports.default=K;
|
package/Flyweight.js
CHANGED
|
@@ -1,31 +1,31 @@
|
|
|
1
1
|
import { runer as p, isArray as X, each as _, merge as V, picker as H, isEmpty as Y, isSimplyType as F, isString as q } from "@soei/util";
|
|
2
|
-
import { openBlock as y, createElementBlock as b, normalizeClass as D, normalizeStyle as
|
|
3
|
-
let
|
|
4
|
-
"+": (
|
|
5
|
-
"-": (
|
|
6
|
-
"*": (
|
|
7
|
-
"/": (
|
|
8
|
-
"%": (
|
|
9
|
-
}, W = (
|
|
2
|
+
import { openBlock as y, createElementBlock as b, normalizeClass as D, normalizeStyle as k, createElementVNode as T, Fragment as G, renderList as M, renderSlot as g, mergeProps as A, createCommentVNode as J, createTextVNode as K, toDisplayString as Q, createBlock as Z, resolveDynamicComponent as ee, withCtx as te } from "vue";
|
|
3
|
+
let se = /(\d+|[+\-\*/]|%)/g, I = {
|
|
4
|
+
"+": (e, t) => e + t,
|
|
5
|
+
"-": (e, t) => e - t,
|
|
6
|
+
"*": (e, t) => e * t,
|
|
7
|
+
"/": (e, t) => e / t,
|
|
8
|
+
"%": (e, t, s) => parseFloat(e) / 100 * s
|
|
9
|
+
}, W = (e, t) => {
|
|
10
10
|
let s;
|
|
11
|
-
if (s = p("match",
|
|
11
|
+
if (s = p("match", e, se)) {
|
|
12
12
|
let h = s.length, l, r = 0, i, n = [];
|
|
13
13
|
for (; h--; )
|
|
14
|
-
r = s.shift(), r in I ? (l && n.push(l), r === "%" && (n.length = 2), i = r) : +r && n.push(+r), n.length == 2 && (n.push(
|
|
15
|
-
+l || (l = +n.pop()),
|
|
14
|
+
r = s.shift(), r in I ? (l && n.push(l), r === "%" && (n.length = 2), i = r) : +r && n.push(+r), n.length == 2 && (n.push(t), l = I[i].apply(null, n), n.length = 0);
|
|
15
|
+
+l || (l = +n.pop()), e = l >> 0;
|
|
16
16
|
}
|
|
17
|
-
return
|
|
18
|
-
}, O = (
|
|
19
|
-
const E = (
|
|
20
|
-
const s =
|
|
21
|
-
for (const [h, l] of
|
|
17
|
+
return e;
|
|
18
|
+
}, O = (e) => (e + "").replace(/\w+\((.*)\)/g, "$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g, "$1px");
|
|
19
|
+
const E = (e, t) => {
|
|
20
|
+
const s = e.__vccOpts || e;
|
|
21
|
+
for (const [h, l] of t)
|
|
22
22
|
s[h] = l;
|
|
23
23
|
return s;
|
|
24
24
|
};
|
|
25
|
-
let j = (
|
|
26
|
-
console.info("::::FLYWEIGHT", ...
|
|
25
|
+
let j = (e) => e == null || e == null, ie = (...e) => {
|
|
26
|
+
console.info("::::FLYWEIGHT", ...e);
|
|
27
27
|
};
|
|
28
|
-
const
|
|
28
|
+
const le = {
|
|
29
29
|
name: "Flyweight",
|
|
30
30
|
props: {
|
|
31
31
|
flys: {
|
|
@@ -97,82 +97,82 @@ const lt = {
|
|
|
97
97
|
};
|
|
98
98
|
},
|
|
99
99
|
watch: {
|
|
100
|
-
flys(
|
|
101
|
-
this.count =
|
|
102
|
-
let
|
|
103
|
-
|
|
104
|
-
this.setview(
|
|
100
|
+
flys(e) {
|
|
101
|
+
this.count = e.length, this.rebuild();
|
|
102
|
+
let t = this.task.shift();
|
|
103
|
+
t && this.$nextTick(() => {
|
|
104
|
+
this.setview(t);
|
|
105
105
|
});
|
|
106
106
|
},
|
|
107
107
|
view: {
|
|
108
|
-
handler(
|
|
109
|
-
this.setview(
|
|
108
|
+
handler(e) {
|
|
109
|
+
this.setview(e);
|
|
110
110
|
},
|
|
111
111
|
immediate: !0,
|
|
112
112
|
deep: !0
|
|
113
113
|
},
|
|
114
|
-
index(
|
|
115
|
-
this.setindex(
|
|
114
|
+
index(e) {
|
|
115
|
+
this.setindex(e);
|
|
116
116
|
},
|
|
117
|
-
top(
|
|
118
|
-
this.flyweight.scrollTop =
|
|
117
|
+
top(e) {
|
|
118
|
+
this.flyweight.scrollTop = e;
|
|
119
119
|
},
|
|
120
|
-
left(
|
|
121
|
-
this.flyweight.scrollLeft =
|
|
120
|
+
left(e) {
|
|
121
|
+
this.flyweight.scrollLeft = e;
|
|
122
122
|
}
|
|
123
123
|
},
|
|
124
124
|
mounted() {
|
|
125
|
-
this.flyweights = [], this.$set || (this.$set = (
|
|
126
|
-
t
|
|
125
|
+
this.flyweights = [], this.$set || (this.$set = (e, t, s) => {
|
|
126
|
+
e[t] = s;
|
|
127
127
|
}), this.setindex(this.index);
|
|
128
128
|
try {
|
|
129
129
|
new ResizeObserver(() => {
|
|
130
130
|
this.rebuild(), this.$emit("resize");
|
|
131
131
|
}).observe(this.flyweight);
|
|
132
|
-
} catch (
|
|
133
|
-
|
|
132
|
+
} catch (e) {
|
|
133
|
+
ie(e);
|
|
134
134
|
}
|
|
135
135
|
this.scrollx = p("hasAttribute", this.flyweight, "scroll-x"), this.BoxRule = /* this.scrollx ? 'clientHeight=>width,clientWidth=>height' : */
|
|
136
136
|
"clientHeight=>height,clientWidth=>width", this.direction = this.scrollx ? "scrollLeft" : "scrollTop";
|
|
137
137
|
},
|
|
138
138
|
methods: {
|
|
139
139
|
exec: O,
|
|
140
|
-
trigger(
|
|
141
|
-
this.lazyrun(() => {
|
|
142
|
-
|
|
140
|
+
trigger(e, t) {
|
|
141
|
+
X(e) || (e = e && t ? [[e, t]] : []), e.length && this.lazyrun(() => {
|
|
142
|
+
_(e, (s, h) => {
|
|
143
143
|
this.$emit(h[0], j(h[1]) ? !0 : h[1]);
|
|
144
144
|
});
|
|
145
145
|
});
|
|
146
146
|
},
|
|
147
|
-
cheackflys(
|
|
147
|
+
cheackflys(e) {
|
|
148
148
|
if (!this.flys.length)
|
|
149
|
-
return
|
|
149
|
+
return e && this.task.push(e), !0;
|
|
150
150
|
},
|
|
151
|
-
setview(
|
|
152
|
-
p([this.cheackflys, (
|
|
153
|
-
|
|
154
|
-
let s =
|
|
151
|
+
setview(e) {
|
|
152
|
+
p([this.cheackflys, (t) => {
|
|
153
|
+
t = t || {};
|
|
154
|
+
let s = t.index || _(this.flys, (h, l, r, i) => {
|
|
155
155
|
if (l[r] == i)
|
|
156
156
|
return h;
|
|
157
|
-
},
|
|
157
|
+
}, t.picker, t.id);
|
|
158
158
|
j(s) || this.setindex(s);
|
|
159
|
-
}], this,
|
|
159
|
+
}], this, e);
|
|
160
160
|
},
|
|
161
|
-
setindex(
|
|
162
|
-
p([this.cheackflys, ({ index:
|
|
163
|
-
this.selectIndex =
|
|
164
|
-
let s =
|
|
161
|
+
setindex(e) {
|
|
162
|
+
p([this.cheackflys, ({ index: t }) => {
|
|
163
|
+
this.selectIndex = t, this.$nextTick(() => {
|
|
164
|
+
let s = t / this.column >> 0, h = this.expand;
|
|
165
165
|
(this.flyweight[this.direction] / h >> 0) + this.row - s - 1 > 0 || (this.flyweight[this.direction] = s * h, this.scroll());
|
|
166
166
|
});
|
|
167
|
-
}], this, { index:
|
|
167
|
+
}], this, { index: e });
|
|
168
168
|
},
|
|
169
|
-
lazyrun(
|
|
169
|
+
lazyrun(e, t) {
|
|
170
170
|
clearTimeout(this.time), this.time = setTimeout(() => {
|
|
171
|
-
p(
|
|
172
|
-
},
|
|
171
|
+
p(e);
|
|
172
|
+
}, t || this.lazy);
|
|
173
173
|
},
|
|
174
|
-
run(
|
|
175
|
-
let
|
|
174
|
+
run(e) {
|
|
175
|
+
let t = [], s = p(this.direction, e.target), h = {
|
|
176
176
|
// ...this
|
|
177
177
|
offset: s,
|
|
178
178
|
top: s,
|
|
@@ -181,14 +181,14 @@ const lt = {
|
|
|
181
181
|
/* 显示区域第一行的索引 */
|
|
182
182
|
index: s / this.expand >> 0
|
|
183
183
|
};
|
|
184
|
-
V(h, this.space),
|
|
184
|
+
V(h, this.space), e.from || t.push(["onscroll", h]);
|
|
185
185
|
let l = !1;
|
|
186
186
|
_(
|
|
187
187
|
this.flyweights,
|
|
188
|
-
(r, i, n,
|
|
189
|
-
if (n = r / u >> 0, f = n +
|
|
190
|
-
(+(n <
|
|
191
|
-
l || (
|
|
188
|
+
(r, i, n, a, u, c, d, f, o) => {
|
|
189
|
+
if (n = r / u >> 0, f = n + a * /* 偏移量, 如果超出顶部 + 1轮,排列到列队后, 否则保持在当前*/
|
|
190
|
+
(+(n < c % a) + (c / a >> 0)), o = f * u + r % u, o >= this.count) {
|
|
191
|
+
l || (t.push(["onend"]), l = !0);
|
|
192
192
|
return;
|
|
193
193
|
}
|
|
194
194
|
i.index = f, i.i = o, i.data = this.flys[o];
|
|
@@ -206,36 +206,36 @@ const lt = {
|
|
|
206
206
|
/* 显示区域第一行的索引 */
|
|
207
207
|
h.index,
|
|
208
208
|
this.scrollx
|
|
209
|
-
), this.trigger(
|
|
209
|
+
), this.trigger(t), t = null;
|
|
210
210
|
},
|
|
211
|
-
scroll(
|
|
212
|
-
this.run(
|
|
211
|
+
scroll(e) {
|
|
212
|
+
this.run(e || { target: this.flyweight, from: "space" });
|
|
213
213
|
},
|
|
214
214
|
rebuild() {
|
|
215
|
-
let
|
|
216
|
-
if (!
|
|
217
|
-
return
|
|
218
|
-
this.count =
|
|
215
|
+
let e = this.count || this.flys.length, t = this.flyweights;
|
|
216
|
+
if (!e)
|
|
217
|
+
return t.length = e;
|
|
218
|
+
this.count = e;
|
|
219
219
|
let s = this.scrollx, h = this.flyweight, l = H(h, this.BoxRule);
|
|
220
220
|
this.$nextTick(() => {
|
|
221
|
-
let r = /true/.test(this.auto), [i, n] = this.offset,
|
|
221
|
+
let r = /true/.test(this.auto), [i, n] = this.offset, a = l.width, u = l.height, c = (W(this.width, a) || a) + i, d = W(this.height, u) + n, f = [a / c >> 0 || 1, u / d >> 0 || 1];
|
|
222
222
|
s && f.reverse();
|
|
223
|
-
let [o, m] = f,
|
|
224
|
-
s ? (w =
|
|
223
|
+
let [o, m] = f, z = this.padding, $, v = 0, w, B;
|
|
224
|
+
s ? (w = c, c -= i, B = (x) => (
|
|
225
225
|
/* 计算top偏移量 */
|
|
226
226
|
x * (d - n) + (x + 1) * n
|
|
227
|
-
)) : (r ? (
|
|
228
|
-
let N = Math.min(
|
|
227
|
+
)) : (r ? (c = (a - i * (o + 2 * z - 1)) / o, $ = !z * i, v = z * i) : ($ = 0, v = (a % c + i * o) / (o + 1) >> 0, c -= i), B = (x) => x * (c + $) + (x + 1) * v, w = d), this.row = m + 2, this.column = o, this.realH = d - n, this.realW = c, this.expand = w, this.Size = Math.ceil(e / o) * w;
|
|
228
|
+
let N = Math.min(e, o * this.row), S = N - 1, C;
|
|
229
229
|
for (; N-- > 0; )
|
|
230
|
-
C = S - N, this.$set(
|
|
230
|
+
C = S - N, this.$set(t, C, {
|
|
231
231
|
x: i,
|
|
232
232
|
y: n,
|
|
233
|
-
width:
|
|
233
|
+
width: c,
|
|
234
234
|
height: d - n,
|
|
235
235
|
space: B(C % o),
|
|
236
236
|
data: {}
|
|
237
237
|
});
|
|
238
|
-
|
|
238
|
+
t.length = S + 1;
|
|
239
239
|
let L = [];
|
|
240
240
|
u / w > S / o && L.push(["onend"]), this.flyweight && (this.flyweight[this.direction] = 0), this.$nextTick(() => {
|
|
241
241
|
this.setindex(this.selectIndex || 0), this.scroll();
|
|
@@ -248,58 +248,58 @@ const lt = {
|
|
|
248
248
|
});
|
|
249
249
|
}
|
|
250
250
|
}
|
|
251
|
-
},
|
|
252
|
-
function
|
|
251
|
+
}, re = { class: "flyweight-all" };
|
|
252
|
+
function he(e, t, s, h, l, r) {
|
|
253
253
|
return y(), b("div", {
|
|
254
254
|
ref: "flyweight",
|
|
255
255
|
class: D(["flyweight", {
|
|
256
256
|
"flyweight-active": l.actice
|
|
257
257
|
}]),
|
|
258
|
-
style:
|
|
258
|
+
style: k({
|
|
259
259
|
"--width": r.exec(l.realW),
|
|
260
260
|
"--height": r.exec(l.realH),
|
|
261
261
|
"--flyweight-content": r.exec(l.Size)
|
|
262
262
|
}),
|
|
263
|
-
onScroll:
|
|
263
|
+
onScroll: t[0] || (t[0] = (...i) => r.scroll && r.scroll(...i))
|
|
264
264
|
}, [
|
|
265
|
-
|
|
265
|
+
T("div", re, [
|
|
266
266
|
(y(!0), b(G, null, M(l.flyweights, (i, n) => (y(), b("div", {
|
|
267
267
|
key: n,
|
|
268
|
-
style:
|
|
268
|
+
style: k({
|
|
269
269
|
top: i.top + "px",
|
|
270
270
|
left: i.left + "px"
|
|
271
271
|
})
|
|
272
272
|
}, [
|
|
273
|
-
g(
|
|
273
|
+
g(e.$slots, "default", A({ ref_for: !0 }, i), void 0, !0)
|
|
274
274
|
], 4))), 128))
|
|
275
275
|
]),
|
|
276
|
-
l.flyweights.length ? g(
|
|
276
|
+
l.flyweights.length ? g(e.$slots, "end", { key: 0 }, void 0, !0) : J("", !0)
|
|
277
277
|
], 38);
|
|
278
278
|
}
|
|
279
|
-
const
|
|
280
|
-
function R(
|
|
281
|
-
return
|
|
279
|
+
const ne = /* @__PURE__ */ E(le, [["render", he], ["__scopeId", "data-v-5ecef76b"]]);
|
|
280
|
+
function R(e, t) {
|
|
281
|
+
return t && (e = e.replace(/[a-z]/g, "")), e.toLowerCase();
|
|
282
282
|
}
|
|
283
283
|
let P = {
|
|
284
284
|
close: {
|
|
285
|
-
handler(
|
|
286
|
-
this.change(
|
|
285
|
+
handler(e) {
|
|
286
|
+
this.change(e);
|
|
287
287
|
},
|
|
288
288
|
deep: !0
|
|
289
289
|
},
|
|
290
290
|
offset: {
|
|
291
|
-
handler(
|
|
292
|
-
this.margin(
|
|
291
|
+
handler(e) {
|
|
292
|
+
this.margin(e);
|
|
293
293
|
},
|
|
294
294
|
deep: !0
|
|
295
295
|
}
|
|
296
|
-
},
|
|
297
|
-
_(
|
|
298
|
-
|
|
296
|
+
}, oe = ["BackGround", "BordeR", "Height", "Width", "Top", "Right", "Bottom", "Left"], U = {};
|
|
297
|
+
_(oe, (e, t, s) => {
|
|
298
|
+
e = R(t), U["--" + R(t, !0)] = e, s[e] = function() {
|
|
299
299
|
this.trigger++;
|
|
300
300
|
};
|
|
301
301
|
}, P);
|
|
302
|
-
const
|
|
302
|
+
const ce = {
|
|
303
303
|
name: "Card",
|
|
304
304
|
// inheritAttrs: false,
|
|
305
305
|
props: {
|
|
@@ -364,22 +364,22 @@ const at = {
|
|
|
364
364
|
isEmpty: Y,
|
|
365
365
|
isSimplyType: F,
|
|
366
366
|
tr() {
|
|
367
|
-
let
|
|
368
|
-
return this.margin(this.offset), _(U, (
|
|
369
|
-
this.css(
|
|
370
|
-
}),
|
|
367
|
+
let e = {};
|
|
368
|
+
return this.margin(this.offset), _(U, (t, s) => {
|
|
369
|
+
this.css(e, t, s);
|
|
370
|
+
}), e;
|
|
371
371
|
},
|
|
372
372
|
tolower: R,
|
|
373
|
-
css(
|
|
373
|
+
css(e, t, s) {
|
|
374
374
|
let h = this[s] || this.default[s];
|
|
375
|
-
!h || this.default[s] == h || (t
|
|
375
|
+
!h || this.default[s] == h || (e[t] = O(h));
|
|
376
376
|
},
|
|
377
|
-
change(
|
|
378
|
-
F(
|
|
377
|
+
change(e) {
|
|
378
|
+
F(e) || (this.closecss = H(e, "color=>--s-card-close-color,size=>--s-close-width,bold=>--s-close-height,*"));
|
|
379
379
|
},
|
|
380
|
-
margin(
|
|
380
|
+
margin(e) {
|
|
381
381
|
V(this, H(
|
|
382
|
-
q(
|
|
382
|
+
q(e) ? e.split(/\s*(?:,|\s+)\s*/) : e,
|
|
383
383
|
"0=>top,1|0=>right,2|0=>bottom,3|1|0=>left",
|
|
384
384
|
!0
|
|
385
385
|
), !0);
|
|
@@ -388,33 +388,33 @@ const at = {
|
|
|
388
388
|
mounted() {
|
|
389
389
|
this.change(this.close);
|
|
390
390
|
}
|
|
391
|
-
},
|
|
392
|
-
function
|
|
391
|
+
}, ae = { class: "card-title" }, ue = { class: "card-content" };
|
|
392
|
+
function de(e, t, s, h, l, r) {
|
|
393
393
|
return y(), b("div", {
|
|
394
394
|
class: "card",
|
|
395
395
|
key: l.trigger,
|
|
396
|
-
style:
|
|
396
|
+
style: k(r.isEmpty(r.style) ? r.tr() : r.style)
|
|
397
397
|
}, [
|
|
398
|
-
g(
|
|
399
|
-
g(
|
|
400
|
-
|
|
398
|
+
g(e.$slots, "default", {}, () => [
|
|
399
|
+
g(e.$slots, "title", {}, () => [
|
|
400
|
+
T("div", ae, [
|
|
401
401
|
K(Q(s.show || s.title) + " ", 1),
|
|
402
|
-
|
|
402
|
+
T("div", {
|
|
403
403
|
class: D(["card-close", { hide: r.isSimplyType(s.close) ? !s.close : !1 }]),
|
|
404
|
-
style:
|
|
405
|
-
onClick:
|
|
404
|
+
style: k(l.closecss),
|
|
405
|
+
onClick: t[0] || (t[0] = (i) => e.$emit("close"))
|
|
406
406
|
}, null, 6)
|
|
407
407
|
])
|
|
408
408
|
], !0),
|
|
409
|
-
g(
|
|
410
|
-
|
|
411
|
-
g(
|
|
409
|
+
g(e.$slots, "content", {}, () => [
|
|
410
|
+
T("div", ue, [
|
|
411
|
+
g(e.$slots, "inner", {}, void 0, !0)
|
|
412
412
|
])
|
|
413
413
|
], !0)
|
|
414
414
|
], !0)
|
|
415
415
|
], 4);
|
|
416
416
|
}
|
|
417
|
-
const
|
|
417
|
+
const fe = /* @__PURE__ */ E(ce, [["render", de], ["__scopeId", "data-v-4c41de24"]]), ge = {
|
|
418
418
|
name: "Stream",
|
|
419
419
|
props: {
|
|
420
420
|
type: {
|
|
@@ -429,12 +429,18 @@ const ft = /* @__PURE__ */ E(at, [["render", dt], ["__scopeId", "data-v-fcd6014d
|
|
|
429
429
|
type: Array,
|
|
430
430
|
default: () => []
|
|
431
431
|
}
|
|
432
|
+
},
|
|
433
|
+
methods: {
|
|
434
|
+
trigger(e) {
|
|
435
|
+
let t = e.slot || e.type;
|
|
436
|
+
return (this.$scopedSlots || this.$slots)[t] ? t : "default";
|
|
437
|
+
}
|
|
432
438
|
}
|
|
433
439
|
};
|
|
434
|
-
function
|
|
435
|
-
return y(), Z(
|
|
436
|
-
default:
|
|
437
|
-
(y(!0), b(G, null, M(s.T, (i) => g(
|
|
440
|
+
function pe(e, t, s, h, l, r) {
|
|
441
|
+
return y(), Z(ee(s.type), A(e.$attrs, { data: s.data }), {
|
|
442
|
+
default: te(() => [
|
|
443
|
+
(y(!0), b(G, null, M(s.T, (i) => g(e.$slots, r.trigger(i), A({
|
|
438
444
|
key: i.type,
|
|
439
445
|
ref_for: !0
|
|
440
446
|
}, i))), 128))
|
|
@@ -442,16 +448,16 @@ function pt(t, e, s, h, l, r) {
|
|
|
442
448
|
_: 3
|
|
443
449
|
}, 16, ["data"]);
|
|
444
450
|
}
|
|
445
|
-
const
|
|
446
|
-
install(
|
|
447
|
-
|
|
448
|
-
|
|
451
|
+
const ye = /* @__PURE__ */ E(ge, [["render", pe]]), me = [ne, fe, ye], _e = {
|
|
452
|
+
install(e) {
|
|
453
|
+
me.forEach((t) => {
|
|
454
|
+
e.component("S" + t.name, t), e.component(t.name + "S", t);
|
|
449
455
|
});
|
|
450
456
|
}
|
|
451
457
|
};
|
|
452
458
|
export {
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
459
|
+
fe as Card,
|
|
460
|
+
ne as Flyweight,
|
|
461
|
+
ye as Stream,
|
|
462
|
+
_e as default
|
|
457
463
|
};
|
package/package.json
CHANGED
package/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";.flyweight[data-v-
|
|
1
|
+
@charset "UTF-8";.flyweight[data-v-5ecef76b]{height:100%;width:100%;overflow:auto;position:relative}.flyweight[hover-scroll][data-v-5ecef76b]::-webkit-scrollbar-track,.flyweight[auto-scroll][data-v-5ecef76b]::-webkit-scrollbar-track{border-radius:10px}.flyweight[hover-scroll][data-v-5ecef76b]::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-5ecef76b]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.flyweight[hover-scroll][data-v-5ecef76b]::-webkit-scrollbar,.flyweight[auto-scroll][data-v-5ecef76b]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 8px);height:var(--scrollbar-width, 8px)}.flyweight[hover-scroll][data-v-5ecef76b]:hover::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-5ecef76b]::-webkit-scrollbar-thumb{border-style:dashed;border-color:transparent;border-width:2px;background-clip:padding-box;cursor:pointer}.flyweight[hover-scroll][data-v-5ecef76b]:hover::-webkit-scrollbar-thumb:hover,.flyweight[auto-scroll][data-v-5ecef76b]::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-color, #101010)}.flyweight[hover-scroll][data-v-5ecef76b]:hover::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-5ecef76b]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.flyweight[scroll-x] .flyweight-all[data-v-5ecef76b]{width:var(--flyweight-content);height:auto;min-height:100%}.flyweight[scroll-x] .flyweight-all[data-v-5ecef76b]+*{left:var(--flyweight-content);position:absolute;top:0;height:100%}.flyweight .flyweight-all[data-v-5ecef76b]{height:var(--flyweight-content)}.flyweight .flyweight-all[data-v-5ecef76b]>*{width:calc(var(--width));height:var(--height);position:absolute}@media screen and (-apple-system: Macintosh){.flyweight .flyweight-all[data-v-5ecef76b]{background-color:red!important}}.card[data-v-4c41de24]{--t: 0px;--r: 0px;--b: 0px;--l: 0px;--h: 100%;--w: 100%;--br: 1px;position:relative;background-color:var(--bg, var(--card-background-color, #fff));padding:10px;border-radius:10px;box-sizing:border-box;border-style:solid;border-color:var(--card-border-color, #555);border-width:var(--br);justify-content:flex-start;margin:var(--t) var(--r) var(--b) var(--l);height:calc(var(--h) - var(--t) - var(--b));width:calc(var(--w) - var(--l) - var(--r));overflow:auto}.card[hover-scroll][data-v-4c41de24]::-webkit-scrollbar-track,.card[auto-scroll][data-v-4c41de24]::-webkit-scrollbar-track{border-radius:10px}.card[hover-scroll][data-v-4c41de24]::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-4c41de24]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.card[hover-scroll][data-v-4c41de24]::-webkit-scrollbar,.card[auto-scroll][data-v-4c41de24]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 8px);height:var(--scrollbar-width, 8px)}.card[hover-scroll][data-v-4c41de24]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-4c41de24]::-webkit-scrollbar-thumb{border-style:dashed;border-color:transparent;border-width:2px;background-clip:padding-box;cursor:pointer}.card[hover-scroll][data-v-4c41de24]:hover::-webkit-scrollbar-thumb:hover,.card[auto-scroll][data-v-4c41de24]::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-color, #101010)}.card[hover-scroll][data-v-4c41de24]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-4c41de24]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.card[simply][data-v-4c41de24],.card [simply][data-v-4c41de24]{background-color:inherit;border:0!important}.card[flex][data-v-4c41de24],.card [flex][data-v-4c41de24]{display:flex}.card[column][data-v-4c41de24],.card [column][data-v-4c41de24]{flex-direction:column}.card[row][data-v-4c41de24],.card [row][data-v-4c41de24]{flex-direction:row}.card[center][data-v-4c41de24],.card [center][data-v-4c41de24]{justify-content:center}.card[vcenter][data-v-4c41de24],.card [vcenter][data-v-4c41de24]{align-items:center}.card .card-title[data-v-4c41de24]{max-height:40px}.card .card-close[data-v-4c41de24]{position:absolute;width:20px;height:20px;right:10px;top:10px;border-radius:10px;z-index:1;--s-transform: 45deg;--s-hover-transform: 35deg;--s-close-width: 11px;--s-close-height: 2px;cursor:pointer;background-color:var(--s-card-close-background-color, transparent);transition:all .3s ease}.card .card-close.hide[data-v-4c41de24]{display:none}.card .card-close[data-v-4c41de24]:before,.card .card-close[data-v-4c41de24]:after{content:"";width:var(--s-close-width, 11px);height:var(--s-close-height, 2px);background-color:var(--s-card-close-color, #555);transform-origin:center;position:inherit;border-radius:10px;top:calc(50% - var(--s-close-height, 2px) / 2);left:calc(50% - var(--s-close-width, 11px) / 2)}.card .card-close[data-v-4c41de24]:before{transform:rotate(var(--s-transform, 45deg))}.card .card-close[data-v-4c41de24]:after{transform:rotate(calc(0deg - var(--s-transform, 45deg)))}.card .card-close[data-v-4c41de24]:hover:before{transform:rotate(var(--s-hover-transform, 45deg))}.card .card-close[data-v-4c41de24]:hover:after{transform:rotate(calc(0deg - var(--s-hover-transform, 45deg)))}.card .card-content[data-v-4c41de24]{overflow:auto;height:100%}
|
package/vue2/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("@soei/util");let W=/(\d+|[+\-\*/]|%)/g,R={"+":(e,t)=>e+t,"-":(e,t)=>e-t,"*":(e,t)=>e*t,"/":(e,t)=>e/t,"%":(e,t,s)=>parseFloat(e)/100*s},F=(e,t)=>{let s;if(s=o.runer("match",e,W)){let i=s.length,n,c=0,l,h=[];for(;i--;)c=s.shift(),c in R?(n&&h.push(n),c==="%"&&(h.length=2),l=c):+c&&h.push(+c),h.length==2&&(h.push(t),n=R[l].apply(null,h),h.length=0);+n||(n=+h.pop()),e=n>>0}return e},C=e=>(e+"").replace(/\w+\((.*)\)/g,"$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g,"$1px");function z(e,t,s,i,n,c,l,h){var r=typeof e=="function"?e.options:e;t&&(r.render=t,r.staticRenderFns=s,r._compiled=!0),i&&(r.functional=!0),c&&(r._scopeId="data-v-"+c);var f;if(l?(f=function(u){u=u||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,!u&&typeof __VUE_SSR_CONTEXT__<"u"&&(u=__VUE_SSR_CONTEXT__),n&&n.call(this,u),u&&u._registeredComponents&&u._registeredComponents.add(l)},r._ssrRegister=f):n&&(f=h?function(){n.call(this,(r.functional?this.parent:this).$root.$options.shadowRoot)}:n),f)if(r.functional){r._injectStyles=f;var d=r.render;r.render=function(a,g){return f.call(g),d(a,g)}}else{var p=r.beforeCreate;r.beforeCreate=p?[].concat(p,f):[f]}return{exports:e,options:r}}let N=e=>e==null||e==null,E=(...e)=>{console.info("::::FLYWEIGHT",...e)};const I={name:"Flyweight",props:{flys:{type:Array,default:()=>[]},width:{type:Number,default:0},height:{type:Number,default:100},offset:{type:Array,default:()=>[0,0]},lazy:{type:Number,default:100},view:{type:Object,default:()=>({id:0})},index:{type:Number,default:0},top:{type:Number,default:!1},left:{type:Number,default:!1},auto:{type:[Boolean,String],default:!1},space:{type:Object,default:()=>null},padding:{type:Boolean,default:!1}},computed:{flyweight(){return this.$refs.flyweight||""}},data(){return{flyweights:[],actice:!1,Size:null,column:1,row:1,expand:10,count:0,task:[],realW:0,realH:0}},watch:{flys(e){this.count=e.length,this.rebuild();let t=this.task.shift();t&&this.$nextTick(()=>{this.setview(t)})},view:{handler(e){this.setview(e)},immediate:!0,deep:!0},index(e){this.setindex(e)},top(e){this.flyweight.scrollTop=e},left(e){this.flyweight.scrollLeft=e}},mounted(){this.flyweights=[],this.$set||(this.$set=(e,t,s)=>{e[t]=s}),this.setindex(this.index);try{new ResizeObserver(()=>{this.rebuild(),this.$emit("resize")}).observe(this.flyweight)}catch(e){E(e)}this.scrollx=o.runer("hasAttribute",this.flyweight,"scroll-x"),this.BoxRule="clientHeight=>height,clientWidth=>width",this.direction=this.scrollx?"scrollLeft":"scrollTop"},methods:{exec:C,trigger(e,t){o.isArray(e)||(e=e&&t?[[e,t]]:[]),e.length&&this.lazyrun(()=>{o.each(e,(s,i)=>{this.$emit(i[0],N(i[1])?!0:i[1])})})},cheackflys(e){if(!this.flys.length)return e&&this.task.push(e),!0},setview(e){o.runer([this.cheackflys,t=>{t=t||{};let s=t.index||o.each(this.flys,(i,n,c,l)=>{if(n[c]==l)return i},t.picker,t.id);N(s)||this.setindex(s)}],this,e)},setindex(e){o.runer([this.cheackflys,({index:t})=>{this.selectIndex=t,this.$nextTick(()=>{let s=t/this.column>>0,i=this.expand;(this.flyweight[this.direction]/i>>0)+this.row-s-1>0||(this.flyweight[this.direction]=s*i,this.scroll())})}],this,{index:e})},lazyrun(e,t){clearTimeout(this.time),this.time=setTimeout(()=>{o.runer(e)},t||this.lazy)},run(e){let t=[],s=o.runer(this.direction,e.target),i={offset:s,top:s,width:this.realW,height:this.realH,index:s/this.expand>>0};o.merge(i,this.space),e.from||t.push(["onscroll",i]);let n=!1;o.each(this.flyweights,(c,l,h,r,f,d,p,u,a)=>{if(h=c/f>>0,u=h+r*(+(h<d%r)+(d/r>>0)),a=u*f+c%f,a>=this.count){n||(t.push(["onend"]),n=!0);return}l.index=u,l.i=a,l.data=this.flys[a];let g=[u*this.expand+l.x,l.space];p&&g.reverse(),l.top=g[0],l.left=g[1]},null,this.row,this.column,i.index,this.scrollx),this.trigger(t),t=null},scroll(e){this.run(e||{target:this.flyweight,from:"space"})},rebuild(){let e=this.count||this.flys.length,t=this.flyweights;if(!e)return t.length=e;this.count=e;let s=this.scrollx,i=this.flyweight,n=o.picker(i,this.BoxRule);this.$nextTick(()=>{let c=/true/.test(this.auto),[l,h]=this.offset,r=n.width,f=n.height,d=(F(this.width,r)||r)+l,p=F(this.height,f)+h,u=[r/d>>0||1,f/p>>0||1];s&&u.reverse();let[a,g]=u,w=this.padding,x,v=0,y,$;s?(y=d,d-=l,$=_=>_*(p-h)+(_+1)*h):(c?(d=(r-l*(a+2*w-1))/a,x=!w*l,v=w*l):(x=0,v=(r%d+l*a)/(a+1)>>0,d-=l),$=_=>_*(d+x)+(_+1)*v,y=p),this.row=g+2,this.column=a,this.realH=p-h,this.realW=d,this.expand=y,this.Size=Math.ceil(e/a)*y;let b=Math.min(e,a*this.row),m=b-1,S;for(;b-- >0;)S=m-b,this.$set(t,S,{x:l,y:h,width:d,height:p-h,space:$(S%a),data:{}});t.length=m+1;let T=[];f/y>m/a&&T.push(["onend"]),this.flyweight&&(this.flyweight[this.direction]=0),this.$nextTick(()=>{this.setindex(this.selectIndex||0),this.scroll()}),T.push(["update:space",{row:(m/a>>0)+1,column:a,showrow:this.row,showcolumn:this.column}]),this.trigger(T)})}}};var M=function(){var t=this,s=t._self._c;return s("div",{ref:"flyweight",staticClass:"flyweight",class:{"flyweight-active":t.actice},style:{"--width":t.exec(t.realW),"--height":t.exec(t.realH),"--flyweight-content":t.exec(t.Size)},on:{scroll:t.scroll}},[s("div",{staticClass:"flyweight-all"},t._l(t.flyweights,function(i,n){return s("div",{key:n,style:{top:i.top+"px",left:i.left+"px"}},[t._t("default",null,null,i)],2)}),0),t.flyweights.length?t._t("end"):t._e()],2)},U=[],X=z(I,M,U,!1,null,"95f71719",null,null);const O=X.exports;function k(e,t){return t&&(e=e.replace(/[a-z]/g,"")),e.toLowerCase()}let H={close:{handler(e){this.change(e)},deep:!0},offset:{handler(e){this.margin(e)},deep:!0}},j=["BackGround","BordeR","Height","Width","Top","Right","Bottom","Left"],L={};o.each(j,(e,t,s)=>{e=k(t),L["--"+k(t,!0)]=e,s[e]=function(){this.trigger++}},H);const G={name:"Card",props:{offset:{type:[String,Array],default:()=>[0,0,0,0]},background:{type:String,default:""},border:{type:String,default:"1px"},height:{type:String,default:"100%"},width:{type:String,default:"100%"},show:{type:String,default:""},close:{type:Object,default:null},title:{type:String,default:""}},data(){return{closecss:{},trigger:0,default:{top:"0px",right:"0px",bottom:"0px",left:"0px",height:"100%",width:"100%",background:"",border:"1px"}}},computed:{style(){return this.tr()}},watch:H,methods:{exec:C,isEmpty:o.isEmpty,isSimplyType:o.isSimplyType,tr(){let e={};return this.margin(this.offset),o.each(L,(t,s)=>{this.css(e,t,s)}),e},tolower:k,css(e,t,s){let i=this[s]||this.default[s];!i||this.default[s]==i||(e[t]=C(i))},change(e){o.isSimplyType(e)||(this.closecss=o.picker(e,"color=>--s-card-close-color,size=>--s-close-width,bold=>--s-close-height,*"))},margin(e){o.merge(this,o.picker(o.isString(e)?e.split(/\s*(?:,|\s+)\s*/):e,"0=>top,1|0=>right,2|0=>bottom,3|1|0=>left",!0),!0)}},mounted(){this.change(this.close)}};var V=function(){var t=this,s=t._self._c;return s("div",{key:t.trigger,staticClass:"card",style:t.isEmpty(t.style)?t.tr():t.style},[t._t("default",function(){return[t._t("title",function(){return[s("div",{staticClass:"card-title"},[t._v(" "+t._s(t.show||t.title)+" "),s("div",{staticClass:"card-close",class:{hide:t.isSimplyType(t.close)?!t.close:!1},style:t.closecss,on:{click:function(i){return t.$emit("close")}}})])]}),t._t("content",function(){return[s("div",{staticClass:"card-content"},[t._t("inner")],2)]})]})],2)},q=[],P=z(G,V,q,!1,null,"6065b432",null,null);const A=P.exports,Y={name:"Stream",props:{type:{type:String,default:"div"},data:{type:Array,default:()=>[]},T:{type:Array,default:()=>[]}},methods:{trigger(e){let t=e.slot||e.type;return(this.$scopedSlots||this.$slots)[t]?t:"default"}}};var D=function(){var t=this,s=t._self._c;return s(t.type,t._b({tag:"component",attrs:{data:t.data}},"component",t.$attrs,!1),[t._l(t.T,function(i){return[t._t(t.trigger(i),null,null,i)]})],2)},J=[],K=z(Y,D,J,!1,null,null,null,null);const B=K.exports,Q=[O,A,B],Z={install(e){Q.forEach(t=>{e.component("S"+t.name,t),e.component(t.name+"S",t)})}};exports.Card=A;exports.Flyweight=O;exports.Stream=B;exports.default=Z;
|
package/vue2/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { runer as g, isArray as E, each as m, merge as A, picker as
|
|
1
|
+
import { runer as g, isArray as E, each as m, merge as A, picker as z, isEmpty as I, isSimplyType as N, isString as U } from "@soei/util";
|
|
2
2
|
let X = /(\d+|[+\-\*/]|%)/g, H = {
|
|
3
3
|
"+": (e, t) => e + t,
|
|
4
4
|
"-": (e, t) => e - t,
|
|
@@ -14,7 +14,7 @@ let X = /(\d+|[+\-\*/]|%)/g, H = {
|
|
|
14
14
|
+n || (n = +h.pop()), e = n >> 0;
|
|
15
15
|
}
|
|
16
16
|
return e;
|
|
17
|
-
},
|
|
17
|
+
}, R = (e) => (e + "").replace(/\w+\((.*)\)/g, "$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g, "$1px");
|
|
18
18
|
function F(e, t, s, i, n, a, l, h) {
|
|
19
19
|
var r = typeof e == "function" ? e.options : e;
|
|
20
20
|
t && (r.render = t, r.staticRenderFns = s, r._compiled = !0), i && (r.functional = !0), a && (r._scopeId = "data-v-" + a);
|
|
@@ -158,10 +158,10 @@ const M = {
|
|
|
158
158
|
"clientHeight=>height,clientWidth=>width", this.direction = this.scrollx ? "scrollLeft" : "scrollTop";
|
|
159
159
|
},
|
|
160
160
|
methods: {
|
|
161
|
-
exec:
|
|
161
|
+
exec: R,
|
|
162
162
|
trigger(e, t) {
|
|
163
|
-
this.lazyrun(() => {
|
|
164
|
-
|
|
163
|
+
E(e) || (e = e && t ? [[e, t]] : []), e.length && this.lazyrun(() => {
|
|
164
|
+
m(e, (s, i) => {
|
|
165
165
|
this.$emit(i[0], O(i[1]) ? !0 : i[1]);
|
|
166
166
|
});
|
|
167
167
|
});
|
|
@@ -238,28 +238,28 @@ const M = {
|
|
|
238
238
|
if (!e)
|
|
239
239
|
return t.length = e;
|
|
240
240
|
this.count = e;
|
|
241
|
-
let s = this.scrollx, i = this.flyweight, n =
|
|
241
|
+
let s = this.scrollx, i = this.flyweight, n = z(i, this.BoxRule);
|
|
242
242
|
this.$nextTick(() => {
|
|
243
243
|
let a = /true/.test(this.auto), [l, h] = this.offset, r = n.width, f = n.height, u = (L(this.width, r) || r) + l, d = L(this.height, f) + h, c = [r / u >> 0 || 1, f / d >> 0 || 1];
|
|
244
244
|
s && c.reverse();
|
|
245
|
-
let [o, p] = c, x = this.padding, v, $ = 0,
|
|
246
|
-
s ? (
|
|
245
|
+
let [o, p] = c, x = this.padding, v, $ = 0, _, b;
|
|
246
|
+
s ? (_ = u, u -= l, b = (y) => (
|
|
247
247
|
/* 计算top偏移量 */
|
|
248
|
-
|
|
249
|
-
)) : (a ? (u = (r - l * (o + 2 * x - 1)) / o, v = !x * l, $ = x * l) : (v = 0, $ = (r % u + l * o) / (o + 1) >> 0, u -= l), b = (
|
|
250
|
-
let
|
|
251
|
-
for (;
|
|
252
|
-
|
|
248
|
+
y * (d - h) + (y + 1) * h
|
|
249
|
+
)) : (a ? (u = (r - l * (o + 2 * x - 1)) / o, v = !x * l, $ = x * l) : (v = 0, $ = (r % u + l * o) / (o + 1) >> 0, u -= l), b = (y) => y * (u + v) + (y + 1) * $, _ = d), this.row = p + 2, this.column = o, this.realH = d - h, this.realW = u, this.expand = _, this.Size = Math.ceil(e / o) * _;
|
|
250
|
+
let S = Math.min(e, o * this.row), w = S - 1, T;
|
|
251
|
+
for (; S-- > 0; )
|
|
252
|
+
T = w - S, this.$set(t, T, {
|
|
253
253
|
x: l,
|
|
254
254
|
y: h,
|
|
255
255
|
width: u,
|
|
256
256
|
height: d - h,
|
|
257
|
-
space: b(
|
|
257
|
+
space: b(T % o),
|
|
258
258
|
data: {}
|
|
259
259
|
});
|
|
260
260
|
t.length = w + 1;
|
|
261
261
|
let C = [];
|
|
262
|
-
f /
|
|
262
|
+
f / _ > w / o && C.push(["onend"]), this.flyweight && (this.flyweight[this.direction] = 0), this.$nextTick(() => {
|
|
263
263
|
this.setindex(this.selectIndex || 0), this.scroll();
|
|
264
264
|
}), C.push(["update:space", {
|
|
265
265
|
row: (w / o >> 0) + 1,
|
|
@@ -291,12 +291,12 @@ var V = function() {
|
|
|
291
291
|
j,
|
|
292
292
|
!1,
|
|
293
293
|
null,
|
|
294
|
-
"
|
|
294
|
+
"95f71719",
|
|
295
295
|
null,
|
|
296
296
|
null
|
|
297
297
|
);
|
|
298
298
|
const q = Y.exports;
|
|
299
|
-
function
|
|
299
|
+
function k(e, t) {
|
|
300
300
|
return t && (e = e.replace(/[a-z]/g, "")), e.toLowerCase();
|
|
301
301
|
}
|
|
302
302
|
let B = {
|
|
@@ -314,7 +314,7 @@ let B = {
|
|
|
314
314
|
}
|
|
315
315
|
}, D = ["BackGround", "BordeR", "Height", "Width", "Top", "Right", "Bottom", "Left"], W = {};
|
|
316
316
|
m(D, (e, t, s) => {
|
|
317
|
-
e =
|
|
317
|
+
e = k(t), W["--" + k(t, !0)] = e, s[e] = function() {
|
|
318
318
|
this.trigger++;
|
|
319
319
|
};
|
|
320
320
|
}, B);
|
|
@@ -379,7 +379,7 @@ const J = {
|
|
|
379
379
|
},
|
|
380
380
|
watch: B,
|
|
381
381
|
methods: {
|
|
382
|
-
exec:
|
|
382
|
+
exec: R,
|
|
383
383
|
isEmpty: I,
|
|
384
384
|
isSimplyType: N,
|
|
385
385
|
tr() {
|
|
@@ -388,16 +388,16 @@ const J = {
|
|
|
388
388
|
this.css(e, t, s);
|
|
389
389
|
}), e;
|
|
390
390
|
},
|
|
391
|
-
tolower:
|
|
391
|
+
tolower: k,
|
|
392
392
|
css(e, t, s) {
|
|
393
393
|
let i = this[s] || this.default[s];
|
|
394
|
-
!i || this.default[s] == i || (e[t] =
|
|
394
|
+
!i || this.default[s] == i || (e[t] = R(i));
|
|
395
395
|
},
|
|
396
396
|
change(e) {
|
|
397
|
-
N(e) || (this.closecss =
|
|
397
|
+
N(e) || (this.closecss = z(e, "color=>--s-card-close-color,size=>--s-close-width,bold=>--s-close-height,*"));
|
|
398
398
|
},
|
|
399
399
|
margin(e) {
|
|
400
|
-
A(this,
|
|
400
|
+
A(this, z(
|
|
401
401
|
U(e) ? e.split(/\s*(?:,|\s+)\s*/) : e,
|
|
402
402
|
"0=>top,1|0=>right,2|0=>bottom,3|1|0=>left",
|
|
403
403
|
!0
|
|
@@ -425,7 +425,7 @@ var K = function() {
|
|
|
425
425
|
P,
|
|
426
426
|
!1,
|
|
427
427
|
null,
|
|
428
|
-
"
|
|
428
|
+
"6065b432",
|
|
429
429
|
null,
|
|
430
430
|
null
|
|
431
431
|
);
|
|
@@ -444,12 +444,18 @@ const Z = Q.exports, tt = {
|
|
|
444
444
|
type: Array,
|
|
445
445
|
default: () => []
|
|
446
446
|
}
|
|
447
|
+
},
|
|
448
|
+
methods: {
|
|
449
|
+
trigger(e) {
|
|
450
|
+
let t = e.slot || e.type;
|
|
451
|
+
return (this.$scopedSlots || this.$slots)[t] ? t : "default";
|
|
452
|
+
}
|
|
447
453
|
}
|
|
448
454
|
};
|
|
449
455
|
var et = function() {
|
|
450
456
|
var t = this, s = t._self._c;
|
|
451
457
|
return s(t.type, t._b({ tag: "component", attrs: { data: t.data } }, "component", t.$attrs, !1), [t._l(t.T, function(i) {
|
|
452
|
-
return [t._t(
|
|
458
|
+
return [t._t(t.trigger(i), null, null, i)];
|
|
453
459
|
})], 2);
|
|
454
460
|
}, st = [], it = /* @__PURE__ */ F(
|
|
455
461
|
tt,
|
package/vue2/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";.flyweight[data-v-
|
|
1
|
+
@charset "UTF-8";.flyweight[data-v-95f71719]{height:100%;width:100%;overflow:auto;position:relative}.flyweight[hover-scroll][data-v-95f71719]::-webkit-scrollbar-track,.flyweight[auto-scroll][data-v-95f71719]::-webkit-scrollbar-track{border-radius:10px}.flyweight[hover-scroll][data-v-95f71719]::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-95f71719]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.flyweight[hover-scroll][data-v-95f71719]::-webkit-scrollbar,.flyweight[auto-scroll][data-v-95f71719]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 8px);height:var(--scrollbar-width, 8px)}.flyweight[hover-scroll][data-v-95f71719]:hover::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-95f71719]::-webkit-scrollbar-thumb{border-style:dashed;border-color:transparent;border-width:2px;background-clip:padding-box;cursor:pointer}.flyweight[hover-scroll][data-v-95f71719]:hover::-webkit-scrollbar-thumb:hover,.flyweight[auto-scroll][data-v-95f71719]::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-color, #101010)}.flyweight[hover-scroll][data-v-95f71719]:hover::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-95f71719]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.flyweight[scroll-x] .flyweight-all[data-v-95f71719]{width:var(--flyweight-content);height:auto;min-height:100%}.flyweight[scroll-x] .flyweight-all+*[data-v-95f71719]{left:var(--flyweight-content);position:absolute;top:0;height:100%}.flyweight .flyweight-all[data-v-95f71719]{height:var(--flyweight-content)}.flyweight .flyweight-all>*[data-v-95f71719]{width:calc(var(--width));height:var(--height);position:absolute}@media screen and (-apple-system: Macintosh){.flyweight .flyweight-all[data-v-95f71719]{background-color:red!important}}.card[data-v-6065b432]{--t: 0px;--r: 0px;--b: 0px;--l: 0px;--h: 100%;--w: 100%;--br: 1px;position:relative;background-color:var(--bg, var(--card-background-color, #fff));padding:10px;border-radius:10px;box-sizing:border-box;border-style:solid;border-color:var(--card-border-color, #555);border-width:var(--br);justify-content:flex-start;margin:var(--t) var(--r) var(--b) var(--l);height:calc(var(--h) - var(--t) - var(--b));width:calc(var(--w) - var(--l) - var(--r));overflow:auto}.card[hover-scroll][data-v-6065b432]::-webkit-scrollbar-track,.card[auto-scroll][data-v-6065b432]::-webkit-scrollbar-track{border-radius:10px}.card[hover-scroll][data-v-6065b432]::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-6065b432]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.card[hover-scroll][data-v-6065b432]::-webkit-scrollbar,.card[auto-scroll][data-v-6065b432]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 8px);height:var(--scrollbar-width, 8px)}.card[hover-scroll][data-v-6065b432]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-6065b432]::-webkit-scrollbar-thumb{border-style:dashed;border-color:transparent;border-width:2px;background-clip:padding-box;cursor:pointer}.card[hover-scroll][data-v-6065b432]:hover::-webkit-scrollbar-thumb:hover,.card[auto-scroll][data-v-6065b432]::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-color, #101010)}.card[hover-scroll][data-v-6065b432]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-6065b432]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.card[simply][data-v-6065b432],.card [simply][data-v-6065b432]{background-color:inherit;border:0!important}.card[flex][data-v-6065b432],.card [flex][data-v-6065b432]{display:flex}.card[column][data-v-6065b432],.card [column][data-v-6065b432]{flex-direction:column}.card[row][data-v-6065b432],.card [row][data-v-6065b432]{flex-direction:row}.card[center][data-v-6065b432],.card [center][data-v-6065b432]{justify-content:center}.card[vcenter][data-v-6065b432],.card [vcenter][data-v-6065b432]{align-items:center}.card .card-title[data-v-6065b432]{max-height:40px}.card .card-close[data-v-6065b432]{position:absolute;width:20px;height:20px;right:10px;top:10px;border-radius:10px;z-index:1;--s-transform: 45deg;--s-hover-transform: 35deg;--s-close-width: 11px;--s-close-height: 2px;cursor:pointer;background-color:var(--s-card-close-background-color, transparent);transition:all .3s ease}.card .card-close.hide[data-v-6065b432]{display:none}.card .card-close[data-v-6065b432]:before,.card .card-close[data-v-6065b432]:after{content:"";width:var(--s-close-width, 11px);height:var(--s-close-height, 2px);background-color:var(--s-card-close-color, #555);transform-origin:center;position:inherit;border-radius:10px;top:calc(50% - var(--s-close-height, 2px) / 2);left:calc(50% - var(--s-close-width, 11px) / 2)}.card .card-close[data-v-6065b432]:before{transform:rotate(var(--s-transform, 45deg))}.card .card-close[data-v-6065b432]:after{transform:rotate(calc(0deg - var(--s-transform, 45deg)))}.card .card-close[data-v-6065b432]:hover:before{transform:rotate(var(--s-hover-transform, 45deg))}.card .card-close[data-v-6065b432]:hover:after{transform:rotate(calc(0deg - var(--s-hover-transform, 45deg)))}.card .card-content[data-v-6065b432]{overflow:auto;height:100%}
|