gg-y-ui/lib/step/index.js

An enterprise-class UI design language and Vue-based implementation for web

/*!
 * 
 * y-ui v0.1.0
 * 
 * Copyright 2021-present, Y-UI-Design.
 * All rights reserved.
 * 
 */
module.exports=function(t){var e={};function i(n){if(e[n])return e[n].exports;var s=e[n]={i:n,l:!1,exports:{}};return t[n].call(s.exports,s,s.exports,i),s.l=!0,s.exports}return i.m=t,i.c=e,i.d=function(t,e,n){i.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},i.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},i.t=function(t,e){if(1&e&&(t=i(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var s in t)i.d(n,s,function(e){return t[e]}.bind(null,s));return n},i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="",i(i.s=113)}({0:function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});e.getPrefixCls=function(t){return"y-"+t}},1:function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n,s=i(2),r=(n=s)&&n.__esModule?n:{default:n};r.default.install=function(t){t.component(r.default.name,r.default)},e.default=r.default},113:function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n,s=i(114),r=(n=s)&&n.__esModule?n:{default:n};r.default.install=function(t){t.component(r.default.name,r.default)},e.default=r.default},114:function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n,s=i(0),r=i(1),a=(n=r)&&n.__esModule?n:{default:n};function u(t,e,i){return e in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}var o={name:"YStep",props:{title:String,description:String,icon:String,status:String},data:function(){return{index:-1,internalStatus:"",displayDescription:!1,direction:"",space:null,lineStyle:{}}},inject:{yunUIStepsContext:{default:void 0}},computed:{isSteps:function(){return!!this.yunUIStepsContext},currentStatus:function(){return this.status||this.internalStatus},stepsCount:function(){if(this.isSteps)return this.yunUIStepsContext.steps.length},isLast:function(){if(this.isSteps)return this.yunUIStepsContext.steps[this.yunUIStepsContext.steps.length-1]===this},style:function(){var t={},e="number"==typeof this.space?this.space+"px":this.space?this.space:100/(this.stepsCount-(this.isHorizontal?1:0))+"%";return this.isLast&&(t.maxWidth=100/this.stepsCount+"%"),t.flexBasis=e,t},isVertical:function(){return"vertical"===this.direction},isHorizontal:function(){return"horizontal"===this.direction},haveDescription:function(){return this.description}},methods:{handleClick:function(t){this.$emit("click",t)},updateStatus:function(t){var e=this.yunUIStepsContext.$children[this.index];t>this.index?this.internalStatus=this.yunUIStepsContext.finishStatus:t===this.index?this.internalStatus=this.yunUIStepsContext.processStatus:this.internalStatus="wait",e.calcProgress(this.internalStatus)},calcProgress:function(t){var e=100,i={};i.transitionDelay=150*this.index+"ms",t===this.yunUIStepsContext.processStatus?e=0:"wait"===t&&(e=0,i.transitionDelay=-150*this.index+"ms"),i.width=e+"%",this.lineStyle=i}},created:function(){this.isSteps&&(this.yunUIStepsContext.steps.push(this),this.displayDescription=this.yunUIStepsContext.displayDescription,this.direction=this.yunUIStepsContext.direction,this.space=this.yunUIStepsContext.space)},mounted:function(){var t=this,e=this.$watch("index",(function(){t.$watch("yunUIStepsContext.active",t.updateStatus,{immediate:!0}),t.$watch("yunUIStepsContext.processStatus",(function(){var e=t.yunUIStepsContext.active;t.updateStatus(e)}),{immediate:!0}),e()}))},render:function(){var t,e,i,n,r,o,l,c=this,d=arguments[0],p=this.handleClick,f=this.title,h=this.description,v=this.icon,y=this.direction,S=this.currentStatus,x=this.index,m=this.displayDescription,b=this.style,C=this.isVertical,_=this.isHorizontal,g=this.lineStyle,I=this.haveDescription,P=(0,s.getPrefixCls)("step"),U={class:(t={},u(t,P+"-title",!0),u(t,"is-"+S,S),u(t,"is-ellipsis",_),t)},j=d("div",U,[f]),O={class:(e={},u(e,P+"-description",!0),u(e,"is-"+S,S),u(e,"is-ellipsis",_),e)},w=d("div",O,[h]),M={class:(i={},u(i,P+"-line-inner",!0),u(i,"is-"+S,S),i),style:g},z=d("div",M),D={class:(n={},u(n,P+"-line",!0),u(n,"is-"+S,S),n)},k=c.isHorizontal?d("div",D,[z]):d("div",D),$={class:(r={},u(r,P+"-icon",!0),u(r,"is-"+S,S),u(r,"is-text",!v),u(r,"is-icon",v),r)},H="success"!==S?v?d(a.default,{attrs:{name:v}}):d("div",[x+1]):d(a.default,{attrs:{name:"check_linear"}}),L=d("div",$,[H]),T=d("div",{class:P+"-icon-wrap"},[L]),V={class:(o={},u(o,P+"-main",!0),u(o,"have-description",I&&_),o)},Y=d("div",V,[j,w]),B=function(){if("vertical"===y){var t,e={class:(t={},u(t,P+"-head",!0),u(t,"is-"+S,S),t)};return d("div",e,[k,T])}return d("div",{class:P+"-head"},[T,Y,k])}(),N=function(){if("vertical"===y){var t,e={class:(t={},u(t,P+"-wrapper",!0),u(t,"description-display",m),u(t,"vertical",!0),t)};return d("div",e,[B,Y])}var i,n={class:(i={},u(i,P+"-wrapper",!0),u(i,"horizontal",!0),i)};return d("div",n,[B])}(),W={class:(l={},u(l,""+P,!0),u(l,"vertical",C),u(l,"horizontal",_),l),style:b,on:{click:p}};return d("div",W,[N])}};e.default=o},2:function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=i(0);function s(t,e,i){return e in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}var r={name:"YIcon",props:{name:String,sizes:{type:Number,default:4}},render:function(){var t,e=arguments[0],i=this.name,r=this.sizes;console.log(r);var a=(0,n.getPrefixCls)("icon"),u={class:(t={},s(t,""+a,!0),s(t,a+"-"+i,!!i),t),style:{fontSize:4*r+"px"}};return e("i",u)}};e.default=r}});