u-tabs.js 7.9 KB
"use strict";const t=require("../../../../common/vendor.js"),o=require("./props.js"),q=require("../../libs/mixin/mpMixin.js"),h=require("../../libs/mixin/mixin.js");require("../../libs/config/props.js");require("../../libs/config/config.js");require("../../libs/config/props/actionSheet.js");require("../../libs/config/props/album.js");require("../../libs/config/props/alert.js");require("../../libs/config/props/avatar.js");require("../../libs/config/props/avatarGroup.js");require("../../libs/config/props/backtop.js");require("../../libs/config/props/badge.js");require("../../libs/config/props/button.js");require("../../libs/config/props/calendar.js");require("../../libs/config/props/carKeyboard.js");require("../../libs/config/props/cell.js");require("../../libs/config/props/cellGroup.js");require("../../libs/config/props/checkbox.js");require("../../libs/config/props/checkboxGroup.js");require("../../libs/config/props/circleProgress.js");require("../../libs/config/props/code.js");require("../../libs/config/props/codeInput.js");require("../../libs/config/props/col.js");require("../../libs/config/props/collapse.js");require("../../libs/config/props/collapseItem.js");require("../../libs/config/props/columnNotice.js");require("../../libs/config/props/countDown.js");require("../../libs/config/props/countTo.js");require("../../libs/config/props/datetimePicker.js");require("../../libs/config/props/divider.js");require("../../libs/config/props/empty.js");require("../../libs/config/props/form.js");require("../../libs/config/props/formItem.js");require("../../libs/config/props/gap.js");require("../../libs/config/props/grid.js");require("../../libs/config/props/gridItem.js");require("../../libs/config/props/icon.js");require("../../libs/config/props/image.js");require("../../libs/config/props/indexAnchor.js");require("../../libs/config/props/indexList.js");require("../../libs/config/props/input.js");require("../../libs/config/props/keyboard.js");require("../../libs/config/props/line.js");require("../../libs/config/props/lineProgress.js");require("../../libs/config/props/link.js");require("../../libs/config/props/list.js");require("../../libs/config/props/listItem.js");require("../../libs/config/props/loadingIcon.js");require("../../libs/config/props/loadingPage.js");require("../../libs/config/props/loadmore.js");require("../../libs/config/props/modal.js");require("../../libs/config/props/navbar.js");require("../../libs/config/color.js");require("../../libs/config/props/noNetwork.js");require("../../libs/config/props/noticeBar.js");require("../../libs/config/props/notify.js");require("../../libs/config/props/numberBox.js");require("../../libs/config/props/numberKeyboard.js");require("../../libs/config/props/overlay.js");require("../../libs/config/props/parse.js");require("../../libs/config/props/picker.js");require("../../libs/config/props/popup.js");require("../../libs/config/props/radio.js");require("../../libs/config/props/radioGroup.js");require("../../libs/config/props/rate.js");require("../../libs/config/props/readMore.js");require("../../libs/config/props/row.js");require("../../libs/config/props/rowNotice.js");require("../../libs/config/props/scrollList.js");require("../../libs/config/props/search.js");require("../../libs/config/props/section.js");require("../../libs/config/props/skeleton.js");require("../../libs/config/props/slider.js");require("../../libs/config/props/statusBar.js");require("../../libs/config/props/steps.js");require("../../libs/config/props/stepsItem.js");require("../../libs/config/props/sticky.js");require("../../libs/config/props/subsection.js");require("../../libs/config/props/swipeAction.js");require("../../libs/config/props/swipeActionItem.js");require("../../libs/config/props/swiper.js");require("../../libs/config/props/swipterIndicator.js");require("../../libs/config/props/switch.js");require("../../libs/config/props/tabbar.js");require("../../libs/config/props/tabbarItem.js");require("../../libs/config/props/tabs.js");require("../../libs/config/props/tag.js");require("../../libs/config/props/text.js");require("../../libs/config/props/textarea.js");require("../../libs/config/props/toast.js");require("../../libs/config/props/toolbar.js");require("../../libs/config/props/tooltip.js");require("../../libs/config/props/transition.js");require("../../libs/config/props/upload.js");require("../../libs/config/props/drawer.js");const c={name:"u-tabs",mixins:[q.mpMixin,h.mixin,o.props],data(){return{firstTime:!0,scrollLeft:0,scrollViewWidth:0,lineOffsetLeft:0,tabsRect:{left:0},innerCurrent:0,moving:!1}},watch:{current:{immediate:!0,handler(e,i){e!==this.innerCurrent&&(this.innerCurrent=e,this.$nextTick(()=>{this.resize()}))}},list(){this.$nextTick(()=>{this.resize()})}},computed:{textStyle(){return e=>{const i={},s=e===this.innerCurrent?t.index.$u.addStyle(this.activeStyle):t.index.$u.addStyle(this.inactiveStyle);return this.list[e].disabled&&(i.color="#c8c9cc"),t.index.$u.deepMerge(s,i)}},propsBadge(){return t.index.$u.props.badge}},async mounted(){this.init()},emits:["click","change"],methods:{setLineLeft(){const e=this.list[this.innerCurrent];if(!e)return;let i=this.list.slice(0,this.innerCurrent).reduce((a,n)=>a+n.rect.width,0);const s=t.index.$u.getPx(this.lineWidth);this.lineOffsetLeft=i+(e.rect.width-s)/2,this.firstTime&&setTimeout(()=>{this.firstTime=!1},10)},animation(e,i=0){},clickHandler(e,i){this.$emit("click",{...e,index:i}),!e.disabled&&(this.innerCurrent=i,this.resize(),this.$emit("change",{...e,index:i}))},init(){t.index.$u.sleep().then(()=>{this.resize()})},setScrollLeft(){const e=this.list[this.innerCurrent],i=this.list.slice(0,this.innerCurrent).reduce((n,u)=>n+u.rect.width,0),s=t.index.$u.sys().windowWidth;let a=i-(this.tabsRect.width-e.rect.width)/2-(s-this.tabsRect.right)/2+this.tabsRect.left/2;a=Math.min(a,this.scrollViewWidth-this.tabsRect.width),this.scrollLeft=Math.max(0,a)},resize(){this.list.length!==0&&Promise.all([this.getTabsRect(),this.getAllItemRect()]).then(([e,i=[]])=>{this.tabsRect=e,this.scrollViewWidth=0,i.map((s,a)=>{this.scrollViewWidth+=s.width,this.list[a].rect=s}),this.setLineLeft(),this.setScrollLeft()})},getTabsRect(){return new Promise(e=>{this.queryRect("u-tabs__wrapper__scroll-view").then(i=>e(i))})},getAllItemRect(){return new Promise(e=>{const i=this.list.map((s,a)=>this.queryRect(`u-tabs__wrapper__nav__item-${a}`,!0));Promise.all(i).then(s=>e(s))})},queryRect(e,i){return new Promise(s=>{this.$uGetRect(`.${e}`).then(a=>{s(a)})})}}};Array||t.resolveComponent("u-badge")();const b=()=>"../u-badge/u-badge.js";Math||b();function g(e,i,s,a,n,u){return{a:t.f(e.list,(r,l,d)=>({a:t.t(r[e.keyName]),b:t.n(r.disabled&&"u-tabs__wrapper__nav__item__text--disabled"),c:t.s(u.textStyle(l)),d:"02b0c54f-0-"+d,e:t.p({show:!!(r.badge&&(r.badge.show||r.badge.isDot||r.badge.value)),isDot:r.badge&&r.badge.isDot||u.propsBadge.isDot,value:r.badge&&r.badge.value||u.propsBadge.value,max:r.badge&&r.badge.max||u.propsBadge.max,type:r.badge&&r.badge.type||u.propsBadge.type,showZero:r.badge&&r.badge.showZero||u.propsBadge.showZero,bgColor:r.badge&&r.badge.bgColor||u.propsBadge.bgColor,color:r.badge&&r.badge.color||u.propsBadge.color,shape:r.badge&&r.badge.shape||u.propsBadge.shape,numberType:r.badge&&r.badge.numberType||u.propsBadge.numberType,inverted:r.badge&&r.badge.inverted||u.propsBadge.inverted,customStyle:"margin-left: 4px;"}),f:l,g:t.o(p=>u.clickHandler(r,l),l),h:`u-tabs__wrapper__nav__item-${l}`,i:t.n(`u-tabs__wrapper__nav__item-${l}`),j:t.n(r.disabled&&"u-tabs__wrapper__nav__item--disabled")})),b:t.s(e.$u.addStyle(e.itemStyle)),c:t.s({flex:e.scrollable?"":1}),d:t.s({width:e.$u.addUnit(e.lineWidth),transform:`translate(${n.lineOffsetLeft}px)`,transitionDuration:`${n.firstTime?0:e.duration}ms`,height:e.$u.addUnit(e.lineHeight),background:e.lineColor,backgroundSize:e.lineBgSize}),e:e.scrollable,f:n.scrollLeft}}const _=t._export_sfc(c,[["render",g],["__scopeId","data-v-02b0c54f"],["__file","D:/vue/大健康商城/healthMall/uni_modules/uview-plus/components/u-tabs/u-tabs.vue"]]);wx.createComponent(_);