2 lines
5.7 KiB
JavaScript
Executable File
2 lines
5.7 KiB
JavaScript
Executable File
import{e,f as t,bu as a,$ as l,C as o,g as s,o as u,c as n,w as i,R as r,k as c,d,n as f,bv as v,i as h,A as p,bw as b,r as g,a as m,b as y,q as _,F as x,s as w,h as S,j as F,t as k,O as C,bx as X,b2 as Y,E as B,aT as T}from"./index-af8b4f0a.js";import{_ as $}from"./_plugin-vue_export-helper.1b428a4d.js";import{_ as j}from"./u-badge.5f8e269b.js";import{_ as z}from"./u-sticky.4cfaefbf.js";const W=$(e({__name:"tab",props:{dot:{type:[Boolean,String],default:!1},name:{type:[Boolean,String],default:""},info:null},setup(e){const p=e,b=t(!1),g=t(!1),m=t(!1),y=t(void 0),_=a("updateTabs"),x=a("handleChange"),w=()=>{_&&_()},S=v();console.log(S),x(null==S?void 0:S.props,(e=>{y.value=y.value||e,b.value=e,m.value=y.value,g.value=e})),l((()=>{w()}));const F=o((()=>{const{dot:e,info:t}=p;return{dot:e,info:t}}));return s((()=>F.value),(()=>{w()})),s((()=>p.name),(e=>{w()})),(e,t)=>{const a=h;return u(),n(a,{class:d({active:b.value,inactive:!b.value,tab:!0}),style:f(g.value?"":"display: none;")},{default:i((()=>[m.value?r(e.$slots,"default",{key:0},void 0,!0):c("v-if",!0)])),_:3},8,["class","style"])}}}),[["__scopeId","data-v-a5e2333b"]]);const R=$(e({__name:"tabs",props:{isScroll:{type:Boolean,default:!0},current:{default:0},height:{default:80},fontSize:{default:28},duration:{default:.3},activeColor:{default:"var(--color-primary)"},inactiveColor:{default:"#333"},barWidth:{default:40},barHeight:{default:4},gutter:{default:30},bgColor:{default:"#FFFFFF"},name:{default:"name"},count:{default:"count"},offset:{default:[5,20]},bold:{type:Boolean,default:!0},activeItemStyle:{default:{}},showBar:{type:Boolean,default:!0},barStyle:{default:{}},itemWidth:{default:"auto"},isFixed:{type:Boolean,default:!1},top:{default:0},stickyBgColor:{default:"#FFFFFF"},swipeable:{type:Boolean,default:!0}},emits:["change"],setup(e,{emit:a}){const $=e,{touch:W,resetTouchStatus:R,touchStart:I,touchMove:M}=function(){const e=p({direction:"",deltaX:0,deltaY:0,offsetX:0,offsetY:0}),t=()=>{e.direction="",e.deltaX=0,e.deltaY=0,e.offsetX=0,e.offsetY=0};return{touch:e,resetTouchStatus:t,touchStart:a=>{t();const l=a.touches[0];e.startX=l.clientX,e.startY=l.clientY},touchMove:t=>{const a=t.touches[0];var l,o;e.deltaX=a.clientX-e.startX,e.deltaY=a.clientY-e.startY,e.offsetX=Math.abs(e.deltaX),e.offsetY=Math.abs(e.deltaY),e.direction=e.direction||((l=e.offsetX)>(o=e.offsetY)&&l>10?"horizontal":o>l&&o>10?"vertical":"")}}}(),H=t([]),O=t([]),E=t(0),q=t([]),A=t(0),V=t(0),D=t(0),G=t("cu-tab"),J=t($.current),K=t(!0),L=t(!1),N=v();s((()=>H.value),(async(e,t)=>{K.value||e.length===t.length||(J.value=0),await C(),Z()})),s((()=>$.current),((e,t)=>{C((()=>{J.value=e,te()}))}),{immediate:!0});const P=o((()=>{const e={width:$.barWidth+"rpx",transform:`translate(${V.value}px, -100%)`,"transition-duration":`${K.value?0:$.duration}s`,"background-color":$.activeColor,height:$.barHeight+"rpx",opacity:K.value?0:1,"border-radius":$.barHeight/2+"px"};return Object.assign(e,$.barStyle),e})),Q=o((()=>e=>{let t={height:$.height+"rpx","line-height":$.height+"rpx","font-size":$.fontSize+"rpx",padding:$.isScroll?`0 ${$.gutter}rpx`:"",flex:$.isScroll?"auto":"1",width:`${$.itemWidth}rpx`};return e==J.value&&$.bold&&(t.fontWeight="bold"),e==J.value?(t.color=$.activeColor,t=Object.assign(t,$.activeItemStyle)):t.color=$.inactiveColor,t})),U=()=>{H.value=O.value.map((e=>{const{name:t,dot:a,active:l,inited:o}=e.event,{updateRender:s}=e;return{name:t,dot:a,active:l,inited:o,updateRender:s}}))},Z=async()=>{const e=await X("#"+G.value,!1,N);D.value=e.left,A.value=e.width,ee()},ee=()=>{const e=Y().in(N);for(let t=0;t<H.value.length;t++)e.select(`#tab-item-${t}`).fields({size:!0,rect:!0});e.exec((e=>{q.value=e,te()}))},te=()=>{const e=q.value[J.value];if(!e)return;const t=e.width,a=e.left-D.value-(A.value-t)/2;E.value=a<0?0:a;const l=e.left+e.width/2-D.value;V.value=l-B($.barWidth)/2,1==K.value&&setTimeout((()=>{K.value=!1}),100),O.value.forEach(((e,t)=>{const a=t===J.value;a===e.event.active&&e.event.inited||e.updateRender(a)}))},ae=e=>{$.swipeable&&(L.value=!0,I(e))},le=e=>{$.swipeable&&L.value&&M(e)},oe=()=>{if(!$.swipeable||!L.value)return;if("horizontal"===W.direction&&W.offsetX>=50){let e,t=H.value.length,l=J.value;e=W.deltaX<=0?l>=t-1?0:l+1:l<=0?t-1:l-1,C((()=>{J.value=e,te()})),a("change",e)}L.value=!1};return l((()=>{U()})),b("handleChange",((e,t)=>{O.value.push({event:e,updateRender:t})})),b("updateTabs",U),(t,l)=>{const o=g(m("u-badge"),j),s=h,v=T,p=g(m("u-sticky"),z);return u(),n(s,{class:"tabs"},{default:i((()=>[y(p,{enable:e.isFixed,"bg-color":e.stickyBgColor,"offset-top":e.top,"h5-nav-height":0},{default:i((()=>[y(s,{id:G.value,style:f({background:e.bgColor})},{default:i((()=>[y(v,{style:f({height:e.height+"rpx"}),"scroll-x":"",class:"scroll-view","scroll-left":E.value,"scroll-with-animation":""},{default:i((()=>[y(s,{class:d(["scroll-box",{"tabs-scorll-flex":!e.isScroll}])},{default:i((()=>[(u(!0),_(x,null,w(H.value,((t,l)=>(u(),n(s,{class:"tab-item line1",id:"tab-item-"+l,key:l,onClick:e=>(e=>{e!=J.value&&(C((()=>{J.value=e,te()})),a("change",e))})(l),style:f([S(Q)(l)])},{default:i((()=>[y(o,{count:t[e.count]||t.dot||0,offset:e.offset,size:"mini"},null,8,["count","offset"]),F(" "+k(t[e.name]||t.name),1)])),_:2},1032,["id","onClick","style"])))),128)),e.showBar?(u(),n(s,{key:0,class:"tab-bar",style:f([S(P)])},null,8,["style"])):c("v-if",!0)])),_:1},8,["class"])])),_:1},8,["style","scroll-left"])])),_:1},8,["id","style"])])),_:1},8,["enable","bg-color","offset-top"]),y(s,{class:"tab-content",onTouchstart:ae,onTouchmove:le,onTouchcancel:oe,onTouchend:oe},{default:i((()=>[c(' <view class="tab-track" :class="{\'tab-animated\': animated}" :style="[trackStyle]"> '),y(s,null,{default:i((()=>[r(t.$slots,"default",{},void 0,!0)])),_:3}),c(" </view> ")])),_:3})])),_:3})}}}),[["__scopeId","data-v-a021632e"]]);export{W as _,R as a};
|