UNPKG

@tarojs/components

Version:
1 lines 15.1 kB
import{r as t,c as i,h as e,H as s,g as o}from"./p-d0cabaaa.js";import{c as n}from"./p-160d710a.js";function a(t,i){const e=[];for(let s=t;s<=i;s++)e.push(`${s<10?"0":""}${s}`);return e}const r=["20","21","22","23",...a(0,23),"00","01","02","03"],h=["56","57","58","59",...a(0,59),"00","01","02","03"];function d(t,i){return!isNaN(+t)&&t>=0&&t<i.length}function c(t){if(!/^\d{1,2}:\d{1,2}$/.test(t))return!1;const i=t.split(":").map((t=>+t));return!(i[0]<0||i[0]>23||i[1]<0||i[1]>59)}function l(t,i){const e=t.split(":").map((t=>+t)),s=i.split(":").map((t=>+t));return e[0]<s[0]||e[0]===s[0]&&e[1]<=s[1]}function u(t){if(!t)return!1;const i=new Date(t.replace(/-/g,"/"));return!isNaN(i.getMonth())&&i}function p(t){let i;return i=Array.isArray(t)?t.map((t=>String(t))):t,i}function f(t,i){const e=[];for(let s=t;s<=i;s++)e.push(s);return e}function m(t,i){return f(t,i)}function g(t,i,e){let s=1,o=12;return t.getFullYear()===e&&(s=t.getMonth()+1),i.getFullYear()===e&&(o=i.getMonth()+1),f(s,o)}function w(t,i,e,s){let o=1,n=function(t,i){return 4===i||6===i||9===i||11===i?30:2===i?t%4==0&&t%100!=0||t%400==0?29:28:31}(e,s);return t.getFullYear()===e&&t.getMonth()+1===s&&(o=t.getDate()),i.getFullYear()===e&&i.getMonth()+1===s&&(n=i.getDate()),f(o,n)}const k=102,b=34,_=class{constructor(s){t(this,s),this.onChange=i(this,"change",7),this.onColumnChange=i(this,"columnchange",7),this.onCancel=i(this,"cancel",7),this.index=[],this.showPicker=()=>{this.disabled||(this.height=this.getHeightByIndex(),this.hidden=!1)},this.getHeightByIndex=()=>this.index.map((t=>{let i=0;return"time"===this.mode&&(i=136),k-b*t-i})),this.hidePicker=()=>{this.fadeOut=!0,setTimeout((()=>{this.hidden=!0,this.fadeOut=!1}),350)},this.handleChange=()=>{this.hidePicker(),this.index=this.height.map((t=>(k-t)/b));let t=this.index.length&&"selector"!==this.mode?this.index:this.index[0];if("time"===this.mode){const i=[r.slice(),h.slice()],e=this.index.map(((t,e)=>i[e][t]));this.index=e.map((t=>parseInt(t))),t=e.join(":")}if("date"===this.mode){const{_start:i,_end:e,_updateValue:s}=this.pickerDate,o=s[0],n=s[1],a=m(i.getFullYear(),e.getFullYear()),r=g(i,e,o),h=w(i,e,o,n),d=a[this.index[0]],c=r[this.index[1]];t="year"===this.fields?[d]:"month"===this.fields?[d,c]:[d,c,h[this.index[2]]],t=t.map((t=>t<10?`0${t}`:t)).join("-")}this.value=t,this.pickerValue=this.value,this.onChange.emit({value:t})},this.handleColumnChange=t=>{const{columnId:i,height:e}=t.detail;this.onColumnChange.emit({column:Number(i),value:(k-e)/b})},this.handleCancel=()=>{this.hidePicker(),this.onCancel.emit()},this.updateHeight=(t,i,e=!1)=>{const s=[...this.height];if(s[i]=t,this.height=s,e){let{start:t,end:i}=this;if(c(t)||(t="00:00"),c(i)||(i="23:59"),!l(t,i))return;const e=[r.slice(),h.slice()],s=this.height.map((t=>(k-t)/b)),o=s.map(((t,i)=>e[i][t])).join(":");if(l(t,o)){if(!l(o,i)){const t=i.split(":").map((t=>k-b*(+t+4)));requestAnimationFrame((()=>this.height=t))}}else{const i=t.split(":").map((t=>k-b*(+t+4)));requestAnimationFrame((()=>this.height=i))}}},this.updateDay=(t,i)=>{const{_start:e,_end:s,_updateValue:o}=this.pickerDate;o[i]=t;const n=o[0],a=o[1],r=o[2];if(0===i){const t=g(e,s,n),i=t[t.length-1],r=t[0];a>i&&(o[1]=i),a<r&&(o[1]=r);const h=t.indexOf(o[1]),d=k-b*h;this.updateDay(o[1],1),this.updateHeight(d,"1")}else if(1===i){const t=w(e,s,n,a),i=t[t.length-1],h=t[0];r>i&&(o[2]=i),r<h&&(o[2]=h);const d=t.indexOf(o[2]),c=k-b*d;this.updateDay(o[2],2),this.updateHeight(c,"2")}},this.getSelector=()=>e("taro-picker-group",{range:this.range,rangeKey:this.rangeKey,height:this.height[0],updateHeight:this.updateHeight,columnId:"0"}),this.getMultiSelector=()=>this.range.map(((t,i)=>e("taro-picker-group",{range:t,rangeKey:this.rangeKey,height:this.height[i],updateHeight:this.updateHeight,onColumnChange:this.handleColumnChange,columnId:String(i)}))),this.getTimeSelector=()=>{const t=r.slice(),i=h.slice();return[e("taro-picker-group",{mode:"time",range:t,height:this.height[0],updateHeight:this.updateHeight,columnId:"0"}),e("taro-picker-group",{mode:"time",range:i,height:this.height[1],updateHeight:this.updateHeight,columnId:"1"})]},this.getDateSelector=()=>{const{fields:t,height:i}=this,{_start:s,_end:o,_updateValue:n}=this.pickerDate,a=n[0],r=n[1],h=m(s.getFullYear(),o.getFullYear()).map((t=>`${t}年`)),d=g(s,o,a).map((t=>`${t<10?`0${t}`:t}月`)),c=w(s,o,a,r).map((t=>`${t<10?`0${t}`:t}日`)),l=[e("taro-picker-group",{mode:"date",range:h,height:i[0],updateDay:this.updateDay,updateHeight:this.updateHeight,columnId:"0"})];return"month"!==t&&"day"!==t||l.push(e("taro-picker-group",{mode:"date",range:d,height:i[1],updateDay:this.updateDay,updateHeight:this.updateHeight,columnId:"1"})),"day"===t&&l.push(e("taro-picker-group",{mode:"date",range:c,height:i[2],updateDay:this.updateDay,updateHeight:this.updateHeight,columnId:"2"})),l},this.mode="selector",this.disabled=!1,this.range=[],this.rangeKey=void 0,this.value=void 0,this.start="",this.end="",this.fields="day",this.name="",this.textProps={},this.pickerValue=[],this.height=[],this.hidden=!0,this.fadeOut=!1,this.isWillLoadCalled=!1}componentWillLoad(){this.isWillLoadCalled=!0,this.handleProps()}componentDidLoad(){this.overlay&&document.body.appendChild(this.overlay)}disconnectedCallback(){var t;this.overlay&&(null===(t=this.overlay.parentNode)||void 0===t||t.removeChild(this.overlay))}onPropsChange(){this.isWillLoadCalled&&this.handleProps()}handleProps(){const{mode:t,start:i,end:e}=this;if("selector"===t){const t=this.value;this.index=[d(t,this.range)?Math.floor(t):0]}else if("multiSelector"===t){const t=this.value;this.index=[],this.range.forEach(((i,e)=>{const s=null==t?void 0:t[e],o=d(s,i)?Math.floor(s):0;this.index.push(o)}))}else if("time"===t){let t=this.value;c(t)||(console.warn("time picker value illegal"),t="0:0");const i=t.split(":").map((t=>+t));this.index=i}else{if("date"!==t)throw new Error(`Picker not support "${t}" mode.`);{let t=u(this.value)||new Date((new Date).setHours(0,0,0,0));const s=u(i)||new Date("1970/01/01"),o=u(e)||new Date("2999/01/01");if(!(s<=o))throw new Error("Picker start time must be less than end time.");t>=s&&t<=o||(t=s);const n=t.getFullYear(),a=t.getMonth()+1,r=t.getDate(),h=m(s.getFullYear(),o.getFullYear()),d=g(s,o,n),c=w(s,o,n,a);this.index=[h.indexOf(n),d.indexOf(a),c.indexOf(r)],this.pickerDate&&this.pickerDate._value.getTime()===t.getTime()&&this.pickerDate._start.getTime()===s.getTime()&&this.pickerDate._end.getTime()===o.getTime()||(this.pickerDate={_value:t,_start:s,_end:o,_updateValue:[n,a,r]})}}if(this.height=this.getHeightByIndex(),this.pickerValue=this.value,"date"===t){const t=this.pickerValue;"month"===this.fields?this.pickerValue=t.split("-").slice(0,2).join("-"):"year"===this.fields&&(this.pickerValue=t.split("-")[0])}}render(){var t,i;const{name:o,mode:a,fadeOut:r,hidden:h}=this;let d;switch(a){case"multiSelector":d=this.getMultiSelector();break;case"time":d=this.getTimeSelector();break;case"date":d=this.getDateSelector();break;default:d=this.getSelector()}const c=n("weui-mask","weui-animate-fade-in",{"weui-animate-fade-out":r}),l=n("weui-picker","weui-animate-slide-up",{"weui-animate-slide-down":r}),u=h?{display:"none"}:{};return e(s,null,e("div",{onClick:this.showPicker},e("slot",null),e("input",{type:"hidden",name:o,value:p(this.pickerValue)})),e("div",{class:"weui-picker__overlay",style:u,ref:t=>{this.overlay=t}},e("div",{class:c,onClick:this.handleCancel}),e("div",{class:l},e("div",{class:"weui-picker__hd"},e("div",{class:"weui-picker__action",onClick:this.handleCancel},null!==(t=this.textProps.cancelText)&&void 0!==t?t:"取消"),e("div",{class:"weui-picker__action",onClick:this.handleChange},null!==(i=this.textProps.okText)&&void 0!==i?i:"确定")),e("div",{class:"weui-picker__bd"},d),e("input",{type:"hidden",name:o,value:p(this.pickerValue)}))))}get el(){return o(this)}static get watchers(){return{mode:["onPropsChange"],value:["onPropsChange"],range:["onPropsChange"],start:["onPropsChange"],end:["onPropsChange"]}}};_.style='.weui-mask{z-index:1000;background:rgba(0,0,0,.6);position:fixed;inset:0}.weui-mask_transparent{z-index:1000;position:fixed;inset:0}@-webkit-keyframes weuiSlideUp{0%{-webkit-transform:translateY(100%);transform:translateY(100%)}to{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes weuiSlideUp{0%{-webkit-transform:translateY(100%);transform:translateY(100%)}to{-webkit-transform:translate(0,0);transform:translate(0,0)}}.weui-animate-slide-up{-webkit-animation:.3s forwards weuiSlideUp;animation:.3s forwards weuiSlideUp}@-webkit-keyframes weuiSlideDown{0%{-webkit-transform:translate(0,0);transform:translate(0,0)}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes weuiSlideDown{0%{-webkit-transform:translate(0,0);transform:translate(0,0)}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}.weui-animate-slide-down{-webkit-animation:.3s forwards weuiSlideDown;animation:.3s forwards weuiSlideDown}@-webkit-keyframes weuiFadeIn{0%{opacity:0}to{opacity:1}}@keyframes weuiFadeIn{0%{opacity:0}to{opacity:1}}.weui-animate-fade-in{-webkit-animation:.3s forwards weuiFadeIn;animation:.3s forwards weuiFadeIn}@-webkit-keyframes weuiFadeOut{0%{opacity:1}to{opacity:0}}@keyframes weuiFadeOut{0%{opacity:1}to{opacity:0}}.weui-animate-fade-out{-webkit-animation:.3s forwards weuiFadeOut;animation:.3s forwards weuiFadeOut}.weui-picker{-webkit-box-sizing:border-box;box-sizing:border-box;z-index:5000;background-color:var(--weui-BG-2);padding-left:0;padding-left:constant(safe-area-inset-left);padding-left:env(safe-area-inset-left);padding-right:0;padding-right:constant(safe-area-inset-right);padding-right:env(safe-area-inset-right);-webkit-backface-visibility:hidden;backface-visibility:hidden;width:100%;-webkit-transition:-webkit-transform .3s;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s, -webkit-transform .3s;position:fixed;bottom:0;left:0;-webkit-transform:translateY(100%);transform:translateY(100%)}.weui-picker__hd{text-align:center;background-color:#fff;padding:9px 15px;font-size:17px;display:-ms-flexbox;display:flex;position:relative}.weui-picker__hd:after{content:" ";color:#e5e5e5;-webkit-transform-origin:0 100%;transform-origin:0 100%;border-bottom:1px solid #e5e5e5;height:1px;position:absolute;bottom:0;left:0;right:0;-webkit-transform:scaleY(.5);transform:scaleY(.5)}.weui-picker__action{color:#1aad19;-ms-flex:1;flex:1;display:block}.weui-picker__action:first-child{text-align:left;color:#888}.weui-picker__action:last-child{text-align:right}.weui-picker__bd{background-color:#fff;height:238px;display:-ms-flexbox;display:flex;position:relative;overflow:hidden}.weui-picker__group{-ms-flex:1;flex:1;height:100%;position:relative}.weui-picker__mask{z-index:3;background-color:transparent;background-image:-webkit-gradient(linear,left top, left bottom,from(rgba(255,255,255,.95)),to(rgba(255,255,255,.6))),-webkit-gradient(linear,left top, left bottom,from(rgba(255,255,255,.6)),to(rgba(255,255,255,.95)));background-image:linear-gradient(rgba(255,255,255,.95),rgba(255,255,255,.6)),linear-gradient(rgba(255,255,255,.6),rgba(255,255,255,.95));background-position:top,bottom;background-repeat:no-repeat;background-size:100% 102px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;width:100%;height:100%;margin:0 auto;position:absolute;top:0;left:0;-webkit-transform:translateZ(0);transform:translateZ(0)}.weui-picker__indicator{z-index:3;width:100%;height:34px;position:absolute;top:102px;left:0}.weui-picker__indicator:before{content:" ";color:#e5e5e5;-webkit-transform-origin:0 0;transform-origin:0 0;border-top:1px solid #e5e5e5;height:1px;position:absolute;top:0;left:0;right:0;-webkit-transform:scaleY(.5);transform:scaleY(.5)}.weui-picker__indicator:after{content:" ";color:#e5e5e5;-webkit-transform-origin:0 100%;transform-origin:0 100%;border-bottom:1px solid #e5e5e5;height:1px;position:absolute;bottom:0;left:0;right:0;-webkit-transform:scaleY(.5);transform:scaleY(.5)}.weui-picker__content{width:100%;position:absolute;top:0;left:0}.weui-picker__item{text-align:center;color:#000;text-overflow:ellipsis;white-space:nowrap;height:34px;padding:0;line-height:34px;overflow:hidden}.weui-picker__item_disabled{color:#999}.weui-picker,.weui-picker__hd{font-size:12px}';const v=class{constructor(e){t(this,e),this.onColumnChange=i(this,"columnChange",7),this.mode=void 0,this.range=[],this.rangeKey=void 0,this.height=void 0,this.columnId=void 0,this.updateHeight=void 0,this.updateDay=void 0,this.startY=void 0,this.preY=void 0,this.hadMove=void 0,this.touchEnd=void 0,this.isMove=void 0}getPosition(){const t=`translate3d(0, ${this.height}px, 0)`,i=`transform ${this.touchEnd?.3:0}s`;return{transform:t,"-webkit-transform":t,transition:i,"-webkit-transition":i}}formulaUnlimitedScroll(t,i,e){const{height:s,updateHeight:o,columnId:n}=this,a="up"===e?1:-1;this.touchEnd=!1,o(-t*a*b+s,n),requestAnimationFrame((()=>{this.touchEnd=!0;const e=Math.round(i/-34)+t*a;o(k-b*e,n,!0)}))}async handleMoveStart(t){this.startY=t,this.preY=t,this.hadMove=!1}async handleMoving(t){const i=t,e=i-this.preY;this.preY=i,this.touchEnd=!1,Math.abs(i-this.startY)>10&&(this.hadMove=!0);let s=this.height+e;"time"===this.mode&&("0"===this.columnId?(s>0&&(s=-816+e),s<-850&&(s=-34+e)):"1"===this.columnId&&(s>0&&(s=-2040+e),s<-2074&&(s=-34+e))),this.updateHeight(s,this.columnId)}async handleMoveEnd(t){const{mode:i,range:e,height:s,updateHeight:o,columnId:n}=this,a=-34*(e.length-1),r=t;let h;if(this.touchEnd=!0,this.hadMove)h=s-k;else{const t=window.innerHeight;if(h=s-k-(r-(t-119)),"time"===i)if("0"===n){if(h>-85)return this.formulaUnlimitedScroll(24,h,"up");if(h<-969)return this.formulaUnlimitedScroll(24,h,"down")}else if("1"===n){if(h>-85)return this.formulaUnlimitedScroll(60,h,"up");if(h<-2193)return this.formulaUnlimitedScroll(60,h,"down")}}h>0&&(h=0),h<a&&(h=a);const d=Math.round(h/-34),c=k-b*d;"date"===this.mode&&"function"==typeof this.updateDay&&("0"===this.columnId&&this.updateDay(+this.range[d].replace(/[^0-9]/gi,""),0),"1"===this.columnId&&this.updateDay(+this.range[d].replace(/[^0-9]/gi,""),1),"2"===this.columnId&&this.updateDay(+this.range[d].replace(/[^0-9]/gi,""),2)),o(c,n,"time"===i),this.onColumnChange.emit({columnId:n,height:c})}onMouseDown(t){this.isMove=!0,this.handleMoveStart(t.clientY)}onMouseMove(t){this.isMove&&this.handleMoving(t.clientY)}onMouseMoveEnd(t){this.isMove&&(this.isMove=!1,this.handleMoveEnd(t.clientY))}onTouchStart(t){this.handleMoveStart(t.changedTouches[0].clientY)}onTouchMove(t){this.handleMoving(t.changedTouches[0].clientY)}onTouchEnd(t){this.handleMoveEnd(t.changedTouches[0].clientY)}render(){const{range:t,rangeKey:i}=this,o=t.map((t=>e("div",{class:"weui-picker__item"},i?t[i]:t)));return e(s,{class:"weui-picker__group"},e("div",{class:"weui-picker__mask"}),e("div",{class:"weui-picker__indicator"}),e("div",{class:"weui-picker__content",style:this.getPosition()},o))}};export{_ as taro_picker_core,v as taro_picker_group}