UNPKG

@beeapi/nutui

Version:

一套轻量级移动端Vue组件库

7 lines 8.21 kB
/*! * @beeapi/nutui v2.2.10 - tab.js, 451ed2404bee284b891e, Sat Dec 19 2020 12:06:10 GMT+0800 (中国标准时间) * (c) 2017-2020 JDC * Released under the MIT License. */ !function(t,i){"object"==typeof exports&&"object"==typeof module?module.exports=i():"function"==typeof define&&define.amd?define("tab",[],i):"object"==typeof exports?exports.tab=i():t.tab=i()}("undefined"!=typeof self?self:this,(function(){return function(t){var i={};function e(n){if(i[n])return i[n].exports;var a=i[n]={i:n,l:!1,exports:{}};return t[n].call(a.exports,a,a.exports,e),a.l=!0,a.exports}return e.m=t,e.c=i,e.d=function(t,i,n){e.o(t,i)||Object.defineProperty(t,i,{enumerable:!0,get:n})},e.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},e.t=function(t,i){if(1&i&&(t=e(t)),8&i)return t;if(4&i&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(e.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&i&&"string"!=typeof t)for(var a in t)e.d(n,a,function(i){return t[i]}.bind(null,a));return n},e.n=function(t){var i=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(i,"a",i),i},e.o=function(t,i){return Object.prototype.hasOwnProperty.call(t,i)},e.p="./",e(e.s=82)}({0:function(t,i,e){"use strict";function n(t,i,e,n,a,o,s,r){var l,u="function"==typeof t?t.options:t;if(i&&(u.render=i,u.staticRenderFns=e,u._compiled=!0),n&&(u.functional=!0),o&&(u._scopeId="data-v-"+o),s?(l=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),a&&a.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(s)},u._ssrRegister=l):a&&(l=r?function(){a.call(this,(u.functional?this.parent:this).$root.$options.shadowRoot)}:a),l)if(u.functional){u._injectStyles=l;var d=u.render;u.render=function(t,i){return l.call(i),d(t,i)}}else{var c=u.beforeCreate;u.beforeCreate=c?[].concat(c,l):[l]}return{exports:t,options:u}}e.d(i,"a",(function(){return n}))},4:function(t,i,e){var n=e(46),a=e(47),o=e(45),s=e(48);t.exports=function(t){return n(t)||a(t)||o(t)||s()}},45:function(t,i,e){var n=e(9);t.exports=function(t,i){if(t){if("string"==typeof t)return n(t,i);var e=Object.prototype.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?n(t,i):void 0}}},46:function(t,i,e){var n=e(9);t.exports=function(t){if(Array.isArray(t))return n(t)}},47:function(t,i){t.exports=function(t){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(t))return Array.from(t)}},48:function(t,i){t.exports=function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}},56:function(t,i,e){"use strict";var n=e(4),a=e.n(n),o={name:"nut-tab",props:{isScroll:{type:Boolean,default:!1},isShowLine:{type:Boolean,default:!0},defIndex:{type:Number,default:0},positionNav:{type:String,default:"top"},initData:{type:Array,default:function(){return[]}},wrapperHeight:{type:[String,Number],default:"200"},lineWidth:{type:Number,default:0}},data:function(){return{tabTitleList:[],activeIndex:this.defIndex,initX:"0",navWidth:0,tapWidth:0}},watch:{isScroll:function(){this.updeteTab()},lineWidth:function(){this.updeteTab()},defIndex:function(){this.updeteTab()},initData:{handler:function(){this.updeteTab()},deep:!0}},computed:{positionNavCss:function(){if("left"===this.positionNav||"right"===this.positionNav)return!0},titleClass:function(){return"top"==this.positionNav?"nut-tab-title":"nut-tab-title-"+this.positionNav+"nav"},navBarClass:function(){return"top"==this.positionNav?"nav-bar":"nav-bar-"+this.positionNav},titleNavList:function(){return"top"==this.positionNav||"bottom"==this.positionNav?this.isScroll?"nut-title-nav-scroll":"nut-title-nav-list":this.isScroll?"nut-title-vertical-scroll":"nut-title-nav-"+this.positionNav+"nav"},navBarStyle:function(){return"top"===this.positionNav||"bottom"===this.positionNav?{transform:"translateX(".concat(this.initX,"px)"),width:(this.lineWidth?this.lineWidth:this.navWidth)+"px"}:{transform:"translateY(".concat(this.initX,"px)"),height:(this.lineWidth?this.lineWidth:this.navWidth)+"px"}},customHeight:function(){return!this.isScroll||"left"!==this.positionNav&&"right"!==this.positionNav?null:{height:this.wrapperHeight+"px"}}},mounted:function(){var t=this;this.$nextTick((function(){t.$slots.default&&t.updeteTab(t.$slots.default)}))},methods:{updeteTab:function(){var t=this;this.$nextTick((function(){t.tabTitleList=[],t.activeIndex=t.defIndex,t.initTab(a()(t.$slots.default))}))},initTab:function(t){for(var i=this,e=0;e<t.length;e++){var n=t[e].tag;if("string"==typeof n&&-1!=n.indexOf("nut-tab-panel")){var a=t[e].data.attrs,o={tabTitle:a["tab-title"]||a.tabTitle,disable:!1===a.disable,iconUrl:a.iconUrl||a["icon-url"],tabSlot:a["tab-slot"]||a.tabSlot||"",badge:a.badge||!1};this.tabTitleList.push(o);var s=t[e].elm;s&&(s.classList.add("hide"),this.activeIndex==e&&s.classList.remove("hide"))}}this.$nextTick((function(){var t;"top"==i.positionNav||"bottom"==i.positionNav?(i.navWidth=i.$refs.navlist.querySelector(".nut-title-nav").offsetWidth,t=i.$refs.navlist.offsetWidth):(i.navWidth=i.$refs.navlist.querySelector(".nut-title-nav").offsetHeight,t=i.$refs.navlist.offsetHeight),i.lineWidth>0&&i.lineWidth<i.navWidth?i.initX=parseInt((i.navWidth-i.lineWidth)/2+i.navWidth*i.defIndex):(i.initX=parseInt(i.navWidth*i.defIndex),i.tapWidth=t/2-i.navWidth/2)}))},findParent:function(t,i){for(var e=t.target,n=0;e&&n<10&&(n++,!e.className||e.className!==i);)e=e.parentNode;return e},switchTab:function(t,i,e){if(!e){this.activeIndex=t,this.lineWidth>0&&this.lineWidth<this.navWidth?this.initX=parseInt((this.navWidth-this.lineWidth)/2+this.navWidth*t):this.initX=parseInt(this.navWidth*t),"top"==this.positionNav||"bottom"==this.positionNav?this.$refs.navlist.scroll(this.initX-this.tapWidth,0):this.$refs.navlist.scroll(0,this.initX-this.tapWidth);this.findParent(i,"nut-tab-part");for(var n=this.$refs.items.children,a=0;a<n.length;a++)a==t?n[a].classList.remove("hide"):n[a].classList.add("hide");this.$emit("tab-switch",t,i),this.$emit("tabSwitch",t,i)}}}},s=e(0),r=Object(s.a)(o,(function(){var t=this,i=t.$createElement,e=t._self._c||i;return e("div",{staticClass:"nut-tab-part"},[e("div",{staticClass:"nut-tab",class:{"nut-tab-horizontal":t.positionNavCss}},["right"==t.positionNav||"bottom"==t.positionNav?e("div",{ref:"items",staticClass:"nut-tab-item"},[t._t("default")],2):t._e(),t._v(" "),e("div",{ref:"navlist",class:t.titleClass,style:t.customHeight},[t.isShowLine?e("b",{class:t.navBarClass,style:t.navBarStyle}):t._e(),t._v(" "),t._l(t.tabTitleList,(function(i,n){return e("span",{key:n,class:[t.titleNavList,"nut-title-nav",{"nut-tab-disable":i.disable},{"nut-tab-active":t.activeIndex==n}]},[e("a",{staticClass:"nut-tab-link",on:{click:function(e){return t.switchTab(n,e,i.disable)}}},[i.tabSlot?t._t(i.tabSlot,null,{item:i}):i.badge?e("nut-badge",{attrs:{value:i.badge.value,max:i.badge.max,zIndex:i.badge.zIndex,isDot:i.badge.isDot,hidden:i.badge.hidden,top:i.badge.top,left:i.badge.left}},[i.iconUrl?e("i",{staticClass:"nut-tab-icon",style:{backgroundImage:"url("+i.iconUrl+")"}}):t._e(),t._v("\n "+t._s(i.tabTitle)+"\n ")]):[i.iconUrl?e("i",{staticClass:"nut-tab-icon",style:{backgroundImage:"url("+i.iconUrl+")"}}):t._e(),t._v("\n "+t._s(i.tabTitle)+"\n ")]],2)])}))],2),t._v(" "),"top"==t.positionNav||"left"==t.positionNav?e("div",{ref:"items",staticClass:"nut-tab-item",style:t.customHeight},[t._t("default")],2):t._e()])])}),[],!1,null,null,null);i.a=r.exports},65:function(t,i,e){},82:function(t,i,e){"use strict";e.r(i);var n=e(56);e(65);n.a.install=function(t){t.component(n.a.name,n.a)},i.default=n.a},9:function(t,i){t.exports=function(t,i){(null==i||i>t.length)&&(i=t.length);for(var e=0,n=new Array(i);e<i;e++)n[e]=t[e];return n}}})})); //# sourceMappingURL=tab.js.map