@soei/flyweight 0.2.6 → 0.2.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/Flyweight.cjs +1 -1
- package/Flyweight.js +3 -3
- package/README.md +13 -1
- package/package.json +3 -2
- package/style.css +1 -1
- package/vue2/index.cjs +1 -0
- package/vue2/index.js +432 -0
package/Flyweight.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("@soei/util"),i=require("vue");let O=/(\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},$=(e,t)=>{let s;if(s=c.runer("match",e,O)){let h=s.length,r,n=0,l,o=[];for(;h--;)n=s.shift(),n in N?(r&&o.push(r),n==="%"&&(o.length=2),l=n):+n&&o.push(+n),o.length==2&&(o.push(t),r=N[l].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 C=(e,t)=>{const s=e.__vccOpts||e;for(const[h,r]of t)s[h]=r;return s};let E=e=>e==null||e==null,F=(...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){F(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){this.lazyrun(()=>{c.isArray(e)||(e=[[e,t]]),c.each(e,(s,h)=>{this.$emit(h[0],E(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,l)=>{if(r[n]==l)return h},t.picker,t.id);E(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,l,o,d,f,u,p,g,a)=>{if(o=n/f>>0,g=o+d*(+(o<u%d)+(u/d>>0)),a=g*f+n%f,a>=this.count){r||(t.push(["onend"]),r=!0);return}l.index=g,l.i=a,l.data=this.flys[a];let y=[g*this.expand+l.x,l.space];p&&y.reverse(),l.top=y[0],l.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),[l,o]=this.offset,d=r.width,f=r.height,u=($(this.width,d)||d)+l,p=$(this.height,f)+o,g=[d/u>>0||1,f/p>>0];s&&g.reverse();let[a,y]=g,_=this.padding,S,k=0,m,b;s?(m=u,u-=l,b=w=>w*(p-o)+(w+1)*o):(n?(u=(d-l*(a+2*_-1))/a,S=!_*l,k=_*l):(S=0,k=(d%u+l*a)/(a+1)>>0,u-=l),b=w=>w*(u+S)+(w+1)*k,m=p),this.row=y+2,this.column=a,this.realH=p-o,this.realW=u,this.expand=m,this.Size=Math.ceil(e/a)*m;let z=Math.min(e,a*this.row),x=z-1,v;for(;z-- >0;)v=x-z,this.$set(t,v,{x:l,y:o,width:u,height:p-o,space:b(v%a),data:{}});t.length=x+1;let T=[];f/m>x/a&&T.push(["onend"]),c.runer(this.direction,this.flyweight,0),this.$nextTick(()=>{this.setindex(this.selectIndex||0)}),this.scroll(),T.push(["update:space",{row:(x/a>>0)+1,column:a,showrow:this.row,showcolumn:this.column}]),this.trigger(T)})}}},R={class:"flyweight-all"};function V(e,t,s,h,r,n){return i.openBlock(),i.createElementBlock("div",{ref:"flyweight",class:i.normalizeClass(["flyweight",{"flyweight-active":r.actice}]),style:i.normalizeStyle({"--width":n.exec(r.realW),"--height":n.exec(r.realH),"--flyweight-content":n.exec(r.Size)}),onScroll:t[0]||(t[0]=(...l)=>n.scroll&&n.scroll(...l))},[i.createElementVNode("div",R,[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(r.flyweights,(l,o)=>(i.openBlock(),i.createElementBlock("div",{key:o,style:i.normalizeStyle({top:l.top+"px",left:l.left+"px"})},[i.renderSlot(e.$slots,"default",i.mergeProps({ref_for:!0},l),void 0,!0)],4))),128))]),r.flyweights.length?i.renderSlot(e.$slots,"end",{key:0},void 0,!0):i.createCommentVNode("",!0)],38)}const H=C(I,[["render",V],["__scopeId","data-v-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("@soei/util"),i=require("vue");let O=/(\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},$=(e,t)=>{let s;if(s=c.runer("match",e,O)){let h=s.length,r,n=0,l,o=[];for(;h--;)n=s.shift(),n in N?(r&&o.push(r),n==="%"&&(o.length=2),l=n):+n&&o.push(+n),o.length==2&&(o.push(t),r=N[l].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 C=(e,t)=>{const s=e.__vccOpts||e;for(const[h,r]of t)s[h]=r;return s};let E=e=>e==null||e==null,F=(...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){F(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){this.lazyrun(()=>{c.isArray(e)||(e=[[e,t]]),c.each(e,(s,h)=>{this.$emit(h[0],E(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,l)=>{if(r[n]==l)return h},t.picker,t.id);E(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,l,o,d,f,u,p,g,a)=>{if(o=n/f>>0,g=o+d*(+(o<u%d)+(u/d>>0)),a=g*f+n%f,a>=this.count){r||(t.push(["onend"]),r=!0);return}l.index=g,l.i=a,l.data=this.flys[a];let y=[g*this.expand+l.x,l.space];p&&y.reverse(),l.top=y[0],l.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),[l,o]=this.offset,d=r.width,f=r.height,u=($(this.width,d)||d)+l,p=$(this.height,f)+o,g=[d/u>>0||1,f/p>>0];s&&g.reverse();let[a,y]=g,_=this.padding,S,k=0,m,b;s?(m=u,u-=l,b=w=>w*(p-o)+(w+1)*o):(n?(u=(d-l*(a+2*_-1))/a,S=!_*l,k=_*l):(S=0,k=(d%u+l*a)/(a+1)>>0,u-=l),b=w=>w*(u+S)+(w+1)*k,m=p),this.row=y+2,this.column=a,this.realH=p-o,this.realW=u,this.expand=m,this.Size=Math.ceil(e/a)*m;let z=Math.min(e,a*this.row),x=z-1,v;for(;z-- >0;)v=x-z,this.$set(t,v,{x:l,y:o,width:u,height:p-o,space:b(v%a),data:{}});t.length=x+1;let T=[];f/m>x/a&&T.push(["onend"]),c.runer(this.direction,this.flyweight,0),this.$nextTick(()=>{this.setindex(this.selectIndex||0)}),this.scroll(),T.push(["update:space",{row:(x/a>>0)+1,column:a,showrow:this.row,showcolumn:this.column}]),this.trigger(T)})}}},R={class:"flyweight-all"};function V(e,t,s,h,r,n){return i.openBlock(),i.createElementBlock("div",{ref:"flyweight",class:i.normalizeClass(["flyweight",{"flyweight-active":r.actice}]),style:i.normalizeStyle({"--width":n.exec(r.realW),"--height":n.exec(r.realH),"--flyweight-content":n.exec(r.Size)}),onScroll:t[0]||(t[0]=(...l)=>n.scroll&&n.scroll(...l))},[i.createElementVNode("div",R,[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(r.flyweights,(l,o)=>(i.openBlock(),i.createElementBlock("div",{key:o,style:i.normalizeStyle({top:l.top+"px",left:l.left+"px"})},[i.renderSlot(e.$slots,"default",i.mergeProps({ref_for:!0},l),void 0,!0)],4))),128))]),r.flyweights.length?i.renderSlot(e.$slots,"end",{key:0},void 0,!0):i.createCommentVNode("",!0)],38)}const H=C(I,[["render",V],["__scopeId","data-v-a2549f79"]]);const W={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:{},style:{},default:{top:"0px",right:"0px",bottom:"0px",left:"0px",height:"100%",width:"100%",background:"",border:"1px"}}},computed:{style(){let e={};return this.margin(this.offset),c.each(["BackGround","BordeR","Height","Width","Top","Right","Bottom","Left"],(t,s)=>{this.css(e,s)}),e}},watch:{close:{handler(e){this.change(e)},deep:!0},offset:{handler(e){this.margin(e)},deep:!0}},methods:{exec:B,isEmpty:c.isEmpty,isSimplyType:c.isSimplyType,tolower(e,t){return t&&(e=e.replace(/[a-z]/g,"")),e.toLowerCase()},css(e,t){let s=this.tolower(t),h=this[s]||this.default[s];!h||this.default[s]==h||(e["--"+this.tolower(t,!0)]=B(h))},change(e){c.isSimplyType(e)||(this.closecss=c.picker(e,"color=>--s-card-close-color,*"))},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)}},j={class:"card-title"},A={class:"card-content"};function M(e,t,s,h,r,n){return i.openBlock(),i.createElementBlock("div",{class:"card",style:i.normalizeStyle(n.style)},[i.renderSlot(e.$slots,"default",{},()=>[i.renderSlot(e.$slots,"title",{},()=>[i.createElementVNode("div",j,[i.createTextVNode(i.toDisplayString(s.show||s.title)+" ",1),i.createElementVNode("div",{class:i.normalizeClass(["card-close",{hide:n.isSimplyType(s.close)?!s.close:!1}]),style:i.normalizeStyle(r.closecss),onClick:t[0]||(t[0]=l=>e.$emit("close"))},null,6)])],!0),i.renderSlot(e.$slots,"content",{},()=>[i.createElementVNode("div",A,[i.renderSlot(e.$slots,"inner",{},void 0,!0)])],!0)],!0)],4)}const L=C(W,[["render",M],["__scopeId","data-v-1c7635d6"]]),q=[H,L],G={install(e){q.forEach(t=>{e.component("S"+t.name,t),e.component(t.name+"S",t)})}};exports.Card=L;exports.Flyweight=H;exports.default=G;
|
package/Flyweight.js
CHANGED
|
@@ -79,7 +79,7 @@ const Q = {
|
|
|
79
79
|
},
|
|
80
80
|
computed: {
|
|
81
81
|
flyweight() {
|
|
82
|
-
return this.$refs.flyweight;
|
|
82
|
+
return this.$refs.flyweight || "";
|
|
83
83
|
}
|
|
84
84
|
},
|
|
85
85
|
data() {
|
|
@@ -276,7 +276,7 @@ function ee(e, t, s, r, l, h) {
|
|
|
276
276
|
l.flyweights.length ? p(e.$slots, "end", { key: 0 }, void 0, !0) : X("", !0)
|
|
277
277
|
], 38);
|
|
278
278
|
}
|
|
279
|
-
const te = /* @__PURE__ */ j(Q, [["render", ee], ["__scopeId", "data-v-
|
|
279
|
+
const te = /* @__PURE__ */ j(Q, [["render", ee], ["__scopeId", "data-v-a2549f79"]]);
|
|
280
280
|
const se = {
|
|
281
281
|
name: "Card",
|
|
282
282
|
// inheritAttrs: false,
|
|
@@ -402,7 +402,7 @@ function re(e, t, s, r, l, h) {
|
|
|
402
402
|
], !0)
|
|
403
403
|
], 4);
|
|
404
404
|
}
|
|
405
|
-
const he = /* @__PURE__ */ j(se, [["render", re], ["__scopeId", "data-v-
|
|
405
|
+
const he = /* @__PURE__ */ j(se, [["render", re], ["__scopeId", "data-v-1c7635d6"]]), ne = [te, he], ae = {
|
|
406
406
|
install(e) {
|
|
407
407
|
ne.forEach((t) => {
|
|
408
408
|
e.component("S" + t.name, t), e.component(t.name + "S", t);
|
package/README.md
CHANGED
|
@@ -2,6 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
# 享元模式 [](https://npmjs.com/package/@soei/flyweight) [](LICENSE.md) [](https://www.npmjs.com/package/@soei/flyweight) [](https://npmjs.com/package/@soei/flyweight)
|
|
4
4
|
|
|
5
|
+
[DEMO(示例)](https://soei.github.io/demo/flyweight/)
|
|
6
|
+
|
|
5
7
|
[](https://npmjs.com/package/@soei/flyweight)
|
|
6
8
|
|
|
7
9
|
```html
|
|
@@ -15,9 +17,19 @@
|
|
|
15
17
|
|
|
16
18
|
## `安装`
|
|
17
19
|
|
|
18
|
-
```
|
|
20
|
+
```bash
|
|
21
|
+
# 安装
|
|
19
22
|
npm i @soei/flyweight
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
## `Vue2` 引用
|
|
26
|
+
|
|
27
|
+
```javascript
|
|
28
|
+
// Vue2引用, 安装和Vue3相同
|
|
29
|
+
import Flyweight from @soei/flyweight/vue2
|
|
20
30
|
|
|
31
|
+
// 样式和vue相同
|
|
32
|
+
import "@soei/flyweight/style.css";
|
|
21
33
|
```
|
|
22
34
|
|
|
23
35
|
## `使用 <s-flyweight ...> `
|
package/package.json
CHANGED
|
@@ -2,16 +2,17 @@
|
|
|
2
2
|
"name": "@soei/flyweight",
|
|
3
3
|
"private": false,
|
|
4
4
|
"description": "Vue组件, 列表de享元模式~减少DOM节点 flyweight, Card组件",
|
|
5
|
-
"version": "0.2.
|
|
5
|
+
"version": "0.2.7",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "Flyweight.cjs",
|
|
8
8
|
"module": "Flyweight.js",
|
|
9
9
|
"files": [
|
|
10
|
+
"vue2/*",
|
|
10
11
|
"Flyweight.cjs",
|
|
11
12
|
"Flyweight.js",
|
|
12
13
|
"style.css"
|
|
13
14
|
],
|
|
14
|
-
"homepage": "https://
|
|
15
|
+
"homepage": "https://soei.github.io/demo/flyweight",
|
|
15
16
|
"scripts": {
|
|
16
17
|
"dev": "vite",
|
|
17
18
|
"build": "vite build",
|
package/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";.flyweight[data-v-
|
|
1
|
+
@charset "UTF-8";.flyweight[data-v-a2549f79]{height:100%;width:100%;overflow:auto;position:relative}.flyweight[hover-scroll][data-v-a2549f79]::-webkit-scrollbar-track,.flyweight[auto-scroll][data-v-a2549f79]::-webkit-scrollbar-track{border-radius:10px}.flyweight[hover-scroll][data-v-a2549f79]::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-a2549f79]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.flyweight[hover-scroll][data-v-a2549f79]::-webkit-scrollbar,.flyweight[auto-scroll][data-v-a2549f79]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 5px);height:var(--scrollbar-width, 5px)}.flyweight[hover-scroll][data-v-a2549f79]:hover::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-a2549f79]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.flyweight[scroll-x] .flyweight-all[data-v-a2549f79]{width:var(--flyweight-content);height:auto;min-height:100%}.flyweight[scroll-x] .flyweight-all[data-v-a2549f79]+*{left:var(--flyweight-content);position:absolute;top:0;height:100%}.flyweight .flyweight-all[data-v-a2549f79]{height:var(--flyweight-content)}.flyweight .flyweight-all[data-v-a2549f79]>*{width:calc(var(--width));height:var(--height);position:absolute}.card[data-v-1c7635d6]{--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-1c7635d6]::-webkit-scrollbar-track,.card[auto-scroll][data-v-1c7635d6]::-webkit-scrollbar-track{border-radius:10px}.card[hover-scroll][data-v-1c7635d6]::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-1c7635d6]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.card[hover-scroll][data-v-1c7635d6]::-webkit-scrollbar,.card[auto-scroll][data-v-1c7635d6]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 5px);height:var(--scrollbar-width, 5px)}.card[hover-scroll][data-v-1c7635d6]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-1c7635d6]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.card[simply][data-v-1c7635d6],.card [simply][data-v-1c7635d6]{background-color:inherit;border:0!important}.card[flex][data-v-1c7635d6],.card [flex][data-v-1c7635d6]{display:flex}.card[column][data-v-1c7635d6],.card [column][data-v-1c7635d6]{flex-direction:column}.card[row][data-v-1c7635d6],.card [row][data-v-1c7635d6]{flex-direction:row}.card[center][data-v-1c7635d6],.card [center][data-v-1c7635d6]{justify-content:center}.card[vcenter][data-v-1c7635d6],.card [vcenter][data-v-1c7635d6]{align-items:center}.card .card-title[data-v-1c7635d6]{max-height:40px}.card .card-close[data-v-1c7635d6]{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-1c7635d6]{display:none}.card .card-close[data-v-1c7635d6]:before,.card .card-close[data-v-1c7635d6]: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-1c7635d6]:before{transform:rotate(var(--s-transform, 45deg))}.card .card-close[data-v-1c7635d6]:after{transform:rotate(calc(0deg - var(--s-transform, 45deg)))}.card .card-close[data-v-1c7635d6]:hover:before{transform:rotate(var(--s-hover-transform, 45deg))}.card .card-close[data-v-1c7635d6]:hover:after{transform:rotate(calc(0deg - var(--s-hover-transform, 45deg)))}.card .card-content[data-v-1c7635d6]{overflow:auto;height:100%}
|
package/vue2/index.cjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("@soei/util");let H=/(\d+|[+\-\*/]|%)/g,C={"+":(e,t)=>e+t,"-":(e,t)=>e-t,"*":(e,t)=>e*t,"/":(e,t)=>e/t,"%":(e,t,i)=>parseFloat(e)/100*i},z=(e,t)=>{let i;if(i=o.runer("match",e,H)){let s=i.length,n,c=0,l,h=[];for(;s--;)c=i.shift(),c in C?(n&&h.push(n),c==="%"&&(h.length=2),l=c):+c&&h.push(+c),h.length==2&&(h.push(t),n=C[l].apply(null,h),h.length=0);+n||(n=+h.pop()),e=n>>0}return e},T=e=>(e+"").replace(/\w+\((.*)\)/g,"$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g,"$1px");function F(e,t,i,s,n,c,l,h){var r=typeof e=="function"?e.options:e;t&&(r.render=t,r.staticRenderFns=i,r._compiled=!0),s&&(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 R=e=>e==null||e==null,B=(...e)=>{console.info("::::FLYWEIGHT",...e)};const L={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,i)=>{e[t]=i}),this.setindex(this.index);try{new ResizeObserver(()=>{this.rebuild(),this.$emit("resize")}).observe(this.flyweight)}catch(e){B(e)}this.scrollx=o.runer("hasAttribute",this.flyweight,"scroll-x"),this.BoxRule="clientHeight=>height,clientWidth=>width",this.direction=this.scrollx?"scrollLeft":"scrollTop"},methods:{exec:T,trigger(e,t){this.lazyrun(()=>{o.isArray(e)||(e=[[e,t]]),o.each(e,(i,s)=>{this.$emit(s[0],R(s[1])?!0:s[1])})})},cheackflys(e){if(!this.flys.length)return e&&this.task.push(e),!0},setview(e){o.runer([this.cheackflys,t=>{t=t||{};let i=t.index||o.each(this.flys,(s,n,c,l)=>{if(n[c]==l)return s},t.picker,t.id);R(i)||this.setindex(i)}],this,e)},setindex(e){o.runer([this.cheackflys,({index:t})=>{this.selectIndex=t,this.$nextTick(()=>{let i=t/this.column>>0,s=this.expand;(this.flyweight[this.direction]/s>>0)+this.row-i-1>0||(this.flyweight[this.direction]=i*s,this.scroll())})}],this,{index:e})},lazyrun(e,t){clearTimeout(this.time),this.time=setTimeout(()=>{o.runer(e)},t||this.lazy)},run(e){let t=[],i=o.runer(this.direction,e.target),s={offset:i,top:i,width:this.realW,height:this.realH,index:i/this.expand>>0};o.merge(s,this.space),e.from||t.push(["onscroll",s]);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,s.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 i=this.scrollx,s=this.flyweight,n=o.picker(s,this.BoxRule);this.$nextTick(()=>{let c=/true/.test(this.auto),[l,h]=this.offset,r=n.width,f=n.height,d=(z(this.width,r)||r)+l,p=z(this.height,f)+h,u=[r/d>>0||1,f/p>>0];i&&u.reverse();let[a,g]=u,m=this.padding,x,v=0,y,b;i?(y=d,d-=l,b=_=>_*(p-h)+(_+1)*h):(c?(d=(r-l*(a+2*m-1))/a,x=!m*l,v=m*l):(x=0,v=(r%d+l*a)/(a+1)>>0,d-=l),b=_=>_*(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 $=Math.min(e,a*this.row),w=$-1,S;for(;$-- >0;)S=w-$,this.$set(t,S,{x:l,y:h,width:d,height:p-h,space:b(S%a),data:{}});t.length=w+1;let k=[];f/y>w/a&&k.push(["onend"]),o.runer(this.direction,this.flyweight,0),this.$nextTick(()=>{this.setindex(this.selectIndex||0)}),this.scroll(),k.push(["update:space",{row:(w/a>>0)+1,column:a,showrow:this.row,showcolumn:this.column}]),this.trigger(k)})}}};var W=function(){var t=this,i=t._self._c;return i("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}},[i("div",{staticClass:"flyweight-all"},t._l(t.flyweights,function(s,n){return i("div",{key:n,style:{top:s.top+"px",left:s.left+"px"}},[t._t("default",null,null,s)],2)}),0),t.flyweights.length?t._t("end"):t._e()],2)},E=[],A=F(L,W,E,!1,null,"a2549f79",null,null);const N=A.exports;const I={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:{},style:{},default:{top:"0px",right:"0px",bottom:"0px",left:"0px",height:"100%",width:"100%",background:"",border:"1px"}}},computed:{style(){let e={};return this.margin(this.offset),o.each(["BackGround","BordeR","Height","Width","Top","Right","Bottom","Left"],(t,i)=>{this.css(e,i)}),e}},watch:{close:{handler(e){this.change(e)},deep:!0},offset:{handler(e){this.margin(e)},deep:!0}},methods:{exec:T,isEmpty:o.isEmpty,isSimplyType:o.isSimplyType,tolower(e,t){return t&&(e=e.replace(/[a-z]/g,"")),e.toLowerCase()},css(e,t){let i=this.tolower(t),s=this[i]||this.default[i];!s||this.default[i]==s||(e["--"+this.tolower(t,!0)]=T(s))},change(e){o.isSimplyType(e)||(this.closecss=o.picker(e,"color=>--s-card-close-color,*"))},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 M=function(){var t=this,i=t._self._c;return i("div",{staticClass:"card",style:t.style},[t._t("default",function(){return[t._t("title",function(){return[i("div",{staticClass:"card-title"},[t._v(" "+t._s(t.show||t.title)+" "),i("div",{staticClass:"card-close",class:{hide:t.isSimplyType(t.close)?!t.close:!1},style:t.closecss,on:{click:function(s){return t.$emit("close")}}})])]}),t._t("content",function(){return[i("div",{staticClass:"card-content"},[t._t("inner")],2)]})]})],2)},U=[],X=F(I,M,U,!1,null,"1c7635d6",null,null);const O=X.exports,j=[N,O],G={install(e){j.forEach(t=>{e.component("S"+t.name,t),e.component(t.name+"S",t)})}};exports.Card=O;exports.Flyweight=N;exports.default=G;
|
package/vue2/index.js
ADDED
|
@@ -0,0 +1,432 @@
|
|
|
1
|
+
import { runer as g, isArray as L, each as m, merge as O, picker as T, isEmpty as W, isSimplyType as R, isString as A } from "@soei/util";
|
|
2
|
+
let E = /(\d+|[+\-\*/]|%)/g, N = {
|
|
3
|
+
"+": (t, e) => t + e,
|
|
4
|
+
"-": (t, e) => t - e,
|
|
5
|
+
"*": (t, e) => t * e,
|
|
6
|
+
"/": (t, e) => t / e,
|
|
7
|
+
"%": (t, e, i) => parseFloat(t) / 100 * i
|
|
8
|
+
}, F = (t, e) => {
|
|
9
|
+
let i;
|
|
10
|
+
if (i = g("match", t, E)) {
|
|
11
|
+
let s = i.length, n, a = 0, l, h = [];
|
|
12
|
+
for (; s--; )
|
|
13
|
+
a = i.shift(), a in N ? (n && h.push(n), a === "%" && (h.length = 2), l = a) : +a && h.push(+a), h.length == 2 && (h.push(e), n = N[l].apply(null, h), h.length = 0);
|
|
14
|
+
+n || (n = +h.pop()), t = n >> 0;
|
|
15
|
+
}
|
|
16
|
+
return t;
|
|
17
|
+
}, z = (t) => (t + "").replace(/\w+\((.*)\)/g, "$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g, "$1px");
|
|
18
|
+
function B(t, e, i, s, n, a, l, h) {
|
|
19
|
+
var r = typeof t == "function" ? t.options : t;
|
|
20
|
+
e && (r.render = e, r.staticRenderFns = i, r._compiled = !0), s && (r.functional = !0), a && (r._scopeId = "data-v-" + a);
|
|
21
|
+
var f;
|
|
22
|
+
if (l ? (f = function(c) {
|
|
23
|
+
c = c || // cached call
|
|
24
|
+
this.$vnode && this.$vnode.ssrContext || // stateful
|
|
25
|
+
this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext, !c && typeof __VUE_SSR_CONTEXT__ < "u" && (c = __VUE_SSR_CONTEXT__), n && n.call(this, c), c && c._registeredComponents && c._registeredComponents.add(l);
|
|
26
|
+
}, r._ssrRegister = f) : n && (f = h ? function() {
|
|
27
|
+
n.call(
|
|
28
|
+
this,
|
|
29
|
+
(r.functional ? this.parent : this).$root.$options.shadowRoot
|
|
30
|
+
);
|
|
31
|
+
} : n), f)
|
|
32
|
+
if (r.functional) {
|
|
33
|
+
r._injectStyles = f;
|
|
34
|
+
var u = r.render;
|
|
35
|
+
r.render = function(o, p) {
|
|
36
|
+
return f.call(p), u(o, p);
|
|
37
|
+
};
|
|
38
|
+
} else {
|
|
39
|
+
var d = r.beforeCreate;
|
|
40
|
+
r.beforeCreate = d ? [].concat(d, f) : [f];
|
|
41
|
+
}
|
|
42
|
+
return {
|
|
43
|
+
exports: t,
|
|
44
|
+
options: r
|
|
45
|
+
};
|
|
46
|
+
}
|
|
47
|
+
let H = (t) => t == null || t == null, I = (...t) => {
|
|
48
|
+
console.info("::::FLYWEIGHT", ...t);
|
|
49
|
+
};
|
|
50
|
+
const U = {
|
|
51
|
+
name: "Flyweight",
|
|
52
|
+
props: {
|
|
53
|
+
flys: {
|
|
54
|
+
type: Array,
|
|
55
|
+
default: () => []
|
|
56
|
+
},
|
|
57
|
+
width: {
|
|
58
|
+
type: Number,
|
|
59
|
+
default: 0
|
|
60
|
+
},
|
|
61
|
+
height: {
|
|
62
|
+
type: Number,
|
|
63
|
+
default: 100
|
|
64
|
+
},
|
|
65
|
+
offset: {
|
|
66
|
+
type: Array,
|
|
67
|
+
default: () => [0, 0]
|
|
68
|
+
},
|
|
69
|
+
lazy: {
|
|
70
|
+
type: Number,
|
|
71
|
+
default: 100
|
|
72
|
+
},
|
|
73
|
+
view: {
|
|
74
|
+
type: Object,
|
|
75
|
+
default: () => ({ id: 0 })
|
|
76
|
+
},
|
|
77
|
+
index: {
|
|
78
|
+
type: Number,
|
|
79
|
+
default: 0
|
|
80
|
+
},
|
|
81
|
+
top: {
|
|
82
|
+
type: Number,
|
|
83
|
+
default: !1
|
|
84
|
+
},
|
|
85
|
+
left: {
|
|
86
|
+
type: Number,
|
|
87
|
+
default: !1
|
|
88
|
+
},
|
|
89
|
+
auto: {
|
|
90
|
+
type: [Boolean, String],
|
|
91
|
+
default: !1
|
|
92
|
+
},
|
|
93
|
+
space: {
|
|
94
|
+
type: Object,
|
|
95
|
+
default: () => null
|
|
96
|
+
},
|
|
97
|
+
padding: {
|
|
98
|
+
type: Boolean,
|
|
99
|
+
default: !1
|
|
100
|
+
}
|
|
101
|
+
},
|
|
102
|
+
computed: {
|
|
103
|
+
flyweight() {
|
|
104
|
+
return this.$refs.flyweight || "";
|
|
105
|
+
}
|
|
106
|
+
},
|
|
107
|
+
data() {
|
|
108
|
+
return {
|
|
109
|
+
flyweights: [],
|
|
110
|
+
actice: !1,
|
|
111
|
+
Size: null,
|
|
112
|
+
column: 1,
|
|
113
|
+
row: 1,
|
|
114
|
+
expand: 10,
|
|
115
|
+
count: 0,
|
|
116
|
+
task: [],
|
|
117
|
+
realW: 0,
|
|
118
|
+
realH: 0
|
|
119
|
+
};
|
|
120
|
+
},
|
|
121
|
+
watch: {
|
|
122
|
+
flys(t) {
|
|
123
|
+
this.count = t.length, this.rebuild();
|
|
124
|
+
let e = this.task.shift();
|
|
125
|
+
e && this.$nextTick(() => {
|
|
126
|
+
this.setview(e);
|
|
127
|
+
});
|
|
128
|
+
},
|
|
129
|
+
view: {
|
|
130
|
+
handler(t) {
|
|
131
|
+
this.setview(t);
|
|
132
|
+
},
|
|
133
|
+
immediate: !0,
|
|
134
|
+
deep: !0
|
|
135
|
+
},
|
|
136
|
+
index(t) {
|
|
137
|
+
this.setindex(t);
|
|
138
|
+
},
|
|
139
|
+
top(t) {
|
|
140
|
+
this.flyweight.scrollTop = t;
|
|
141
|
+
},
|
|
142
|
+
left(t) {
|
|
143
|
+
this.flyweight.scrollLeft = t;
|
|
144
|
+
}
|
|
145
|
+
},
|
|
146
|
+
mounted() {
|
|
147
|
+
this.flyweights = [], this.$set || (this.$set = (t, e, i) => {
|
|
148
|
+
t[e] = i;
|
|
149
|
+
}), this.setindex(this.index);
|
|
150
|
+
try {
|
|
151
|
+
new ResizeObserver(() => {
|
|
152
|
+
this.rebuild(), this.$emit("resize");
|
|
153
|
+
}).observe(this.flyweight);
|
|
154
|
+
} catch (t) {
|
|
155
|
+
I(t);
|
|
156
|
+
}
|
|
157
|
+
this.scrollx = g("hasAttribute", this.flyweight, "scroll-x"), this.BoxRule = /* this.scrollx ? 'clientHeight=>width,clientWidth=>height' : */
|
|
158
|
+
"clientHeight=>height,clientWidth=>width", this.direction = this.scrollx ? "scrollLeft" : "scrollTop";
|
|
159
|
+
},
|
|
160
|
+
methods: {
|
|
161
|
+
exec: z,
|
|
162
|
+
trigger(t, e) {
|
|
163
|
+
this.lazyrun(() => {
|
|
164
|
+
L(t) || (t = [[t, e]]), m(t, (i, s) => {
|
|
165
|
+
this.$emit(s[0], H(s[1]) ? !0 : s[1]);
|
|
166
|
+
});
|
|
167
|
+
});
|
|
168
|
+
},
|
|
169
|
+
cheackflys(t) {
|
|
170
|
+
if (!this.flys.length)
|
|
171
|
+
return t && this.task.push(t), !0;
|
|
172
|
+
},
|
|
173
|
+
setview(t) {
|
|
174
|
+
g([this.cheackflys, (e) => {
|
|
175
|
+
e = e || {};
|
|
176
|
+
let i = e.index || m(this.flys, (s, n, a, l) => {
|
|
177
|
+
if (n[a] == l)
|
|
178
|
+
return s;
|
|
179
|
+
}, e.picker, e.id);
|
|
180
|
+
H(i) || this.setindex(i);
|
|
181
|
+
}], this, t);
|
|
182
|
+
},
|
|
183
|
+
setindex(t) {
|
|
184
|
+
g([this.cheackflys, ({ index: e }) => {
|
|
185
|
+
this.selectIndex = e, this.$nextTick(() => {
|
|
186
|
+
let i = e / this.column >> 0, s = this.expand;
|
|
187
|
+
(this.flyweight[this.direction] / s >> 0) + this.row - i - 1 > 0 || (this.flyweight[this.direction] = i * s, this.scroll());
|
|
188
|
+
});
|
|
189
|
+
}], this, { index: t });
|
|
190
|
+
},
|
|
191
|
+
lazyrun(t, e) {
|
|
192
|
+
clearTimeout(this.time), this.time = setTimeout(() => {
|
|
193
|
+
g(t);
|
|
194
|
+
}, e || this.lazy);
|
|
195
|
+
},
|
|
196
|
+
run(t) {
|
|
197
|
+
let e = [], i = g(this.direction, t.target), s = {
|
|
198
|
+
// ...this
|
|
199
|
+
offset: i,
|
|
200
|
+
top: i,
|
|
201
|
+
width: this.realW,
|
|
202
|
+
height: this.realH,
|
|
203
|
+
/* 显示区域第一行的索引 */
|
|
204
|
+
index: i / this.expand >> 0
|
|
205
|
+
};
|
|
206
|
+
O(s, this.space), t.from || e.push(["onscroll", s]);
|
|
207
|
+
let n = !1;
|
|
208
|
+
m(
|
|
209
|
+
this.flyweights,
|
|
210
|
+
(a, l, h, r, f, u, d, c, o) => {
|
|
211
|
+
if (h = a / f >> 0, c = h + r * /* 偏移量, 如果超出顶部 + 1轮,排列到列队后, 否则保持在当前*/
|
|
212
|
+
(+(h < u % r) + (u / r >> 0)), o = c * f + a % f, o >= this.count) {
|
|
213
|
+
n || (e.push(["onend"]), n = !0);
|
|
214
|
+
return;
|
|
215
|
+
}
|
|
216
|
+
l.index = c, l.i = o, l.data = this.flys[o];
|
|
217
|
+
let p = [
|
|
218
|
+
/* top */
|
|
219
|
+
c * this.expand + l.x,
|
|
220
|
+
/* left */
|
|
221
|
+
l.space
|
|
222
|
+
];
|
|
223
|
+
d && p.reverse(), l.top = p[0], l.left = p[1];
|
|
224
|
+
},
|
|
225
|
+
null,
|
|
226
|
+
this.row,
|
|
227
|
+
this.column,
|
|
228
|
+
/* 显示区域第一行的索引 */
|
|
229
|
+
s.index,
|
|
230
|
+
this.scrollx
|
|
231
|
+
), this.trigger(e), e = null;
|
|
232
|
+
},
|
|
233
|
+
scroll(t) {
|
|
234
|
+
this.run(t || { target: this.flyweight, from: "space" });
|
|
235
|
+
},
|
|
236
|
+
rebuild() {
|
|
237
|
+
let t = this.count || this.flys.length, e = this.flyweights;
|
|
238
|
+
if (!t)
|
|
239
|
+
return e.length = t;
|
|
240
|
+
this.count = t;
|
|
241
|
+
let i = this.scrollx, s = this.flyweight, n = T(s, this.BoxRule);
|
|
242
|
+
this.$nextTick(() => {
|
|
243
|
+
let a = /true/.test(this.auto), [l, h] = this.offset, r = n.width, f = n.height, u = (F(this.width, r) || r) + l, d = F(this.height, f) + h, c = [r / u >> 0 || 1, f / d >> 0];
|
|
244
|
+
i && c.reverse();
|
|
245
|
+
let [o, p] = c, x = this.padding, v, b = 0, y, $;
|
|
246
|
+
i ? (y = u, u -= l, $ = (_) => (
|
|
247
|
+
/* 计算top偏移量 */
|
|
248
|
+
_ * (d - h) + (_ + 1) * h
|
|
249
|
+
)) : (a ? (u = (r - l * (o + 2 * x - 1)) / o, v = !x * l, b = x * l) : (v = 0, b = (r % u + l * o) / (o + 1) >> 0, u -= l), $ = (_) => _ * (u + v) + (_ + 1) * b, y = d), this.row = p + 2, this.column = o, this.realH = d - h, this.realW = u, this.expand = y, this.Size = Math.ceil(t / o) * y;
|
|
250
|
+
let k = Math.min(t, o * this.row), w = k - 1, C;
|
|
251
|
+
for (; k-- > 0; )
|
|
252
|
+
C = w - k, this.$set(e, C, {
|
|
253
|
+
x: l,
|
|
254
|
+
y: h,
|
|
255
|
+
width: u,
|
|
256
|
+
height: d - h,
|
|
257
|
+
space: $(C % o),
|
|
258
|
+
data: {}
|
|
259
|
+
});
|
|
260
|
+
e.length = w + 1;
|
|
261
|
+
let S = [];
|
|
262
|
+
f / y > w / o && S.push(["onend"]), g(this.direction, this.flyweight, 0), this.$nextTick(() => {
|
|
263
|
+
this.setindex(this.selectIndex || 0);
|
|
264
|
+
}), this.scroll(), S.push(["update:space", {
|
|
265
|
+
row: (w / o >> 0) + 1,
|
|
266
|
+
column: o,
|
|
267
|
+
showrow: this.row,
|
|
268
|
+
showcolumn: this.column
|
|
269
|
+
}]), this.trigger(S);
|
|
270
|
+
});
|
|
271
|
+
}
|
|
272
|
+
}
|
|
273
|
+
};
|
|
274
|
+
var X = function() {
|
|
275
|
+
var e = this, i = e._self._c;
|
|
276
|
+
return i("div", { ref: "flyweight", staticClass: "flyweight", class: {
|
|
277
|
+
"flyweight-active": e.actice
|
|
278
|
+
}, style: {
|
|
279
|
+
"--width": e.exec(e.realW),
|
|
280
|
+
"--height": e.exec(e.realH),
|
|
281
|
+
"--flyweight-content": e.exec(e.Size)
|
|
282
|
+
}, on: { scroll: e.scroll } }, [i("div", { staticClass: "flyweight-all" }, e._l(e.flyweights, function(s, n) {
|
|
283
|
+
return i("div", { key: n, style: {
|
|
284
|
+
top: s.top + "px",
|
|
285
|
+
left: s.left + "px"
|
|
286
|
+
} }, [e._t("default", null, null, s)], 2);
|
|
287
|
+
}), 0), e.flyweights.length ? e._t("end") : e._e()], 2);
|
|
288
|
+
}, G = [], M = /* @__PURE__ */ B(
|
|
289
|
+
U,
|
|
290
|
+
X,
|
|
291
|
+
G,
|
|
292
|
+
!1,
|
|
293
|
+
null,
|
|
294
|
+
"a2549f79",
|
|
295
|
+
null,
|
|
296
|
+
null
|
|
297
|
+
);
|
|
298
|
+
const V = M.exports;
|
|
299
|
+
const j = {
|
|
300
|
+
name: "Card",
|
|
301
|
+
// inheritAttrs: false,
|
|
302
|
+
props: {
|
|
303
|
+
offset: {
|
|
304
|
+
type: [String, Array],
|
|
305
|
+
default: () => [0, 0, 0, 0]
|
|
306
|
+
},
|
|
307
|
+
background: {
|
|
308
|
+
type: String,
|
|
309
|
+
default: ""
|
|
310
|
+
},
|
|
311
|
+
border: {
|
|
312
|
+
type: String,
|
|
313
|
+
default: "1px"
|
|
314
|
+
},
|
|
315
|
+
height: {
|
|
316
|
+
type: String,
|
|
317
|
+
default: "100%"
|
|
318
|
+
},
|
|
319
|
+
width: {
|
|
320
|
+
type: String,
|
|
321
|
+
default: "100%"
|
|
322
|
+
},
|
|
323
|
+
show: {
|
|
324
|
+
type: String,
|
|
325
|
+
default: ""
|
|
326
|
+
},
|
|
327
|
+
close: {
|
|
328
|
+
type: Object,
|
|
329
|
+
default: null
|
|
330
|
+
},
|
|
331
|
+
title: {
|
|
332
|
+
type: String,
|
|
333
|
+
default: ""
|
|
334
|
+
}
|
|
335
|
+
},
|
|
336
|
+
data() {
|
|
337
|
+
return {
|
|
338
|
+
closecss: {},
|
|
339
|
+
style: {},
|
|
340
|
+
default: {
|
|
341
|
+
top: "0px",
|
|
342
|
+
right: "0px",
|
|
343
|
+
bottom: "0px",
|
|
344
|
+
left: "0px",
|
|
345
|
+
height: "100%",
|
|
346
|
+
width: "100%",
|
|
347
|
+
background: "",
|
|
348
|
+
border: "1px"
|
|
349
|
+
}
|
|
350
|
+
};
|
|
351
|
+
},
|
|
352
|
+
computed: {
|
|
353
|
+
style() {
|
|
354
|
+
let t = {};
|
|
355
|
+
return this.margin(this.offset), m(["BackGround", "BordeR", "Height", "Width", "Top", "Right", "Bottom", "Left"], (e, i) => {
|
|
356
|
+
this.css(t, i);
|
|
357
|
+
}), t;
|
|
358
|
+
}
|
|
359
|
+
},
|
|
360
|
+
watch: {
|
|
361
|
+
close: {
|
|
362
|
+
handler(t) {
|
|
363
|
+
this.change(t);
|
|
364
|
+
},
|
|
365
|
+
deep: !0
|
|
366
|
+
},
|
|
367
|
+
offset: {
|
|
368
|
+
handler(t) {
|
|
369
|
+
this.margin(t);
|
|
370
|
+
},
|
|
371
|
+
deep: !0
|
|
372
|
+
}
|
|
373
|
+
},
|
|
374
|
+
methods: {
|
|
375
|
+
exec: z,
|
|
376
|
+
isEmpty: W,
|
|
377
|
+
isSimplyType: R,
|
|
378
|
+
tolower(t, e) {
|
|
379
|
+
return e && (t = t.replace(/[a-z]/g, "")), t.toLowerCase();
|
|
380
|
+
},
|
|
381
|
+
css(t, e) {
|
|
382
|
+
let i = this.tolower(e), s = this[i] || this.default[i];
|
|
383
|
+
!s || this.default[i] == s || (t["--" + this.tolower(e, !0)] = z(s));
|
|
384
|
+
},
|
|
385
|
+
change(t) {
|
|
386
|
+
R(t) || (this.closecss = T(t, "color=>--s-card-close-color,*"));
|
|
387
|
+
},
|
|
388
|
+
margin(t) {
|
|
389
|
+
O(this, T(
|
|
390
|
+
A(t) ? t.split(/\s*(?:,|\s+)\s*/) : t,
|
|
391
|
+
"0=>top,1|0=>right,2|0=>bottom,3|1|0=>left",
|
|
392
|
+
!0
|
|
393
|
+
), !0);
|
|
394
|
+
}
|
|
395
|
+
},
|
|
396
|
+
mounted() {
|
|
397
|
+
this.change(this.close);
|
|
398
|
+
}
|
|
399
|
+
};
|
|
400
|
+
var Y = function() {
|
|
401
|
+
var e = this, i = e._self._c;
|
|
402
|
+
return i("div", { staticClass: "card", style: e.style }, [e._t("default", function() {
|
|
403
|
+
return [e._t("title", function() {
|
|
404
|
+
return [i("div", { staticClass: "card-title" }, [e._v(" " + e._s(e.show || e.title) + " "), i("div", { staticClass: "card-close", class: { hide: e.isSimplyType(e.close) ? !e.close : !1 }, style: e.closecss, on: { click: function(s) {
|
|
405
|
+
return e.$emit("close");
|
|
406
|
+
} } })])];
|
|
407
|
+
}), e._t("content", function() {
|
|
408
|
+
return [i("div", { staticClass: "card-content" }, [e._t("inner")], 2)];
|
|
409
|
+
})];
|
|
410
|
+
})], 2);
|
|
411
|
+
}, q = [], D = /* @__PURE__ */ B(
|
|
412
|
+
j,
|
|
413
|
+
Y,
|
|
414
|
+
q,
|
|
415
|
+
!1,
|
|
416
|
+
null,
|
|
417
|
+
"1c7635d6",
|
|
418
|
+
null,
|
|
419
|
+
null
|
|
420
|
+
);
|
|
421
|
+
const J = D.exports, K = [V, J], Q = {
|
|
422
|
+
install(t) {
|
|
423
|
+
K.forEach((e) => {
|
|
424
|
+
t.component("S" + e.name, e), t.component(e.name + "S", e);
|
|
425
|
+
});
|
|
426
|
+
}
|
|
427
|
+
};
|
|
428
|
+
export {
|
|
429
|
+
J as Card,
|
|
430
|
+
V as Flyweight,
|
|
431
|
+
Q as default
|
|
432
|
+
};
|