index-18bc03a8.js 7.2 KB

1
  1. import{c as V,k as fe,e as P,s as q,n as Y,M as N,o as B,a as oe,D as ae,p as le,H as Q,m as $,t as ce,z as ve,u as he,U as ge,x as L,y as W,V as be,w as Oe}from"./index-e9453d64.js";import{u as ie}from"./use-scope-id-7611483c.js";import{L as Te}from"./index-856231c7.js";import{u as pe}from"./index-c1d3cef3.js";import{d as J,r as E,a as p,S as xe,c as m,w as j,m as ke,z as X}from"./index-ddf66cb5.js";const[ye,O,Z]=V("picker"),se=e=>e.find(a=>!a.disabled)||e[0];function Ce(e,a){const o=e[0];if(o){if(Array.isArray(o))return"multiple";if(a.children in o)return"cascade"}return"default"}function _(e,a){a=q(a,0,e.length);for(let o=a;o<e.length;o++)if(!e[o].disabled)return o;for(let o=a-1;o>=0;o--)if(!e[o].disabled)return o;return 0}const ee=(e,a,o)=>a!==void 0&&!!e.find(s=>s[o.value]===a);function G(e,a,o){const s=e.findIndex(f=>f[o.value]===a),c=_(e,s);return e[c]}function we(e,a,o){const s=[];let c={[a.children]:e},f=0;for(;c&&c[a.children];){const v=c[a.children],h=o.value[f];if(c=fe(h)?G(v,h,a):void 0,!c&&v.length){const u=se(v)[a.value];c=G(v,u,a)}f++,s.push(v)}return s}function Ee(e){const{transform:a}=window.getComputedStyle(e),o=a.slice(7,a.length-1).split(", ")[5];return Number(o)}function Pe(e){return P({text:"text",value:"value",children:"children"},e)}const te=200,ne=300,Se=15,[ue,z]=V("picker-column"),re=Symbol(ue);var Ie=J({name:ue,props:{value:Y,fields:N(Object),options:B(),readonly:Boolean,allowHtml:Boolean,optionHeight:N(Number),swipeDuration:N(Y),visibleOptionNum:N(Y)},emits:["change","clickOption","scrollInto"],setup(e,{emit:a,slots:o}){let s,c,f,v,h;const u=E(),g=E(),r=E(0),d=E(0),k=pe(),y=()=>e.options.length,M=()=>e.optionHeight*(+e.visibleOptionNum-1)/2,x=i=>{let t=_(e.options,i);const n=-t*e.optionHeight,l=()=>{t>y()-1&&(t=_(e.options,i));const T=e.options[t][e.fields.value];T!==e.value&&a("change",T)};s&&n!==r.value?h=l:l(),r.value=n},b=()=>e.readonly||!e.options.length,A=i=>{s||b()||(h=null,d.value=te,x(i),a("clickOption",e.options[i]))},C=i=>q(Math.round(-i/e.optionHeight),0,y()-1),D=p(()=>C(r.value)),U=(i,t)=>{const n=Math.abs(i/t);i=r.value+n/.003*(i<0?-1:1);const l=C(i);d.value=+e.swipeDuration,x(l)},S=()=>{s=!1,d.value=0,h&&(h(),h=null)},F=i=>{if(!b()){if(k.start(i),s){const t=Ee(g.value);r.value=Math.min(0,t-M())}d.value=0,c=r.value,f=Date.now(),v=c,h=null}},K=i=>{if(b())return;k.move(i),k.isVertical()&&(s=!0,le(i,!0));const t=q(c+k.deltaY.value,-(y()*e.optionHeight),e.optionHeight),n=C(t);n!==D.value&&a("scrollInto",e.options[n]),r.value=t;const l=Date.now();l-f>ne&&(f=l,v=t)},I=()=>{if(b())return;const i=r.value-v,t=Date.now()-f;if(t<ne&&Math.abs(i)>Se){U(i,t);return}const l=C(r.value);d.value=te,x(l),setTimeout(()=>{s=!1},0)},w=()=>{const i={height:`${e.optionHeight}px`};return e.options.map((t,n)=>{const l=t[e.fields.text],{disabled:T}=t,H=t[e.fields.value],me={role:"button",style:i,tabindex:T?-1:0,class:[z("item",{disabled:T,selected:H===e.value}),t.className],onClick:()=>A(n)},de={class:"van-ellipsis",[e.allowHtml?"innerHTML":"textContent"]:l};return m("li",me,[o.option?o.option(t,n):m("div",de,null)])})};return oe(re),ie({stopMomentum:S}),xe(()=>{const i=s?Math.floor(-r.value/e.optionHeight):e.options.findIndex(l=>l[e.fields.value]===e.value),t=_(e.options,i),n=-t*e.optionHeight;s&&t<i&&S(),r.value=n}),ae("touchmove",K,{target:u}),()=>m("div",{ref:u,class:z(),onTouchstartPassive:F,onTouchend:I,onTouchcancel:I},[m("ul",{ref:g,style:{transform:`translate3d(0, ${r.value+M()}px, 0)`,transitionDuration:`${d.value}ms`,transitionProperty:d.value?"all":"none"},class:z("wrapper"),onTransitionend:S},[w()])])}});const[He]=V("picker-toolbar"),R={title:String,cancelButtonText:String,confirmButtonText:String},Me=["cancel","confirm","title","toolbar"],De=Object.keys(R);var Ne=J({name:He,props:R,emits:["confirm","cancel"],setup(e,{emit:a,slots:o}){const s=()=>{if(o.title)return o.title();if(e.title)return m("div",{class:[O("title"),"van-ellipsis"]},[e.title])},c=()=>a("cancel"),f=()=>a("confirm"),v=()=>{var u;const g=(u=e.cancelButtonText)!=null?u:Z("cancel");if(!(!o.cancel&&!g))return m("button",{type:"button",class:[O("cancel"),Q],onClick:c},[o.cancel?o.cancel():g])},h=()=>{var u;const g=(u=e.confirmButtonText)!=null?u:Z("confirm");if(!(!o.confirm&&!g))return m("button",{type:"button",class:[O("confirm"),Q],onClick:f},[o.confirm?o.confirm():g])};return()=>m("div",{class:O("toolbar")},[o.toolbar?o.toolbar():[v(),s(),h()]])}});const[$e,Le]=V("picker-group"),_e=Symbol($e);P({tabs:B(),activeTab:$(0),nextStepText:String,showToolbar:ce},R);const Be=P({loading:Boolean,readonly:Boolean,allowHtml:Boolean,optionHeight:$(44),showToolbar:ce,swipeDuration:$(1e3),visibleOptionNum:$(6)},R),Ve=P({},Be,{columns:B(),modelValue:B(),toolbarPosition:ve("top"),columnsFieldNames:Object});var Re=J({name:ye,props:Ve,emits:["confirm","cancel","change","scrollInto","clickOption","update:modelValue"],setup(e,{emit:a,slots:o}){const s=E(),c=E(e.modelValue.slice(0)),{parent:f}=oe(_e),{children:v,linkChildren:h}=he(re);h();const u=p(()=>Pe(e.columnsFieldNames)),g=p(()=>ge(e.optionHeight)),r=p(()=>Ce(e.columns,u.value)),d=p(()=>{const{columns:t}=e;switch(r.value){case"multiple":return t;case"cascade":return we(t,u.value,c);default:return[t]}}),k=p(()=>d.value.some(t=>t.length)),y=p(()=>d.value.map((t,n)=>G(t,c.value[n],u.value))),M=p(()=>d.value.map((t,n)=>t.findIndex(l=>l[u.value.value]===c.value[n]))),x=(t,n)=>{if(c.value[t]!==n){const l=c.value.slice(0);l[t]=n,c.value=l}},b=()=>({selectedValues:c.value.slice(0),selectedOptions:y.value,selectedIndexes:M.value}),A=(t,n)=>{x(n,t),r.value==="cascade"&&c.value.forEach((l,T)=>{const H=d.value[T];ee(H,l,u.value)||x(T,H.length?H[0][u.value.value]:void 0)}),X(()=>{a("change",P({columnIndex:n},b()))})},C=(t,n)=>{const l={columnIndex:n,currentOption:t};a("clickOption",P(b(),l)),a("scrollInto",l)},D=()=>{v.forEach(n=>n.stopMomentum());const t=b();return X(()=>{a("confirm",t)}),t},U=()=>a("cancel",b()),S=()=>d.value.map((t,n)=>m(Ie,{value:c.value[n],fields:u.value,options:t,readonly:e.readonly,allowHtml:e.allowHtml,optionHeight:g.value,swipeDuration:e.swipeDuration,visibleOptionNum:e.visibleOptionNum,onChange:l=>A(l,n),onClickOption:l=>C(l,n),onScrollInto:l=>{a("scrollInto",{currentOption:l,columnIndex:n})}},{option:o.option})),F=t=>{if(k.value){const n={height:`${g.value}px`},l={backgroundSize:`100% ${(t-g.value)/2}px`};return[m("div",{class:O("mask"),style:l},null),m("div",{class:[be,O("frame")],style:n},null)]}},K=()=>{const t=g.value*+e.visibleOptionNum,n={height:`${t}px`};return m("div",{ref:s,class:O("columns"),style:n},[S(),F(t)])},I=()=>{if(e.showToolbar&&!f)return m(Ne,ke(W(e,De),{onConfirm:D,onCancel:U}),W(o,Me))};j(d,t=>{t.forEach((n,l)=>{n.length&&!ee(n,c.value[l],u.value)&&x(l,se(n)[u.value.value])})},{immediate:!0});let w;return j(()=>e.modelValue,t=>{!L(t,c.value)&&!L(t,w)&&(c.value=t.slice(0),w=t.slice(0))},{deep:!0}),j(c,t=>{L(t,e.modelValue)||(w=t.slice(0),a("update:modelValue",w))},{immediate:!0}),ae("touchmove",le,{target:s}),ie({confirm:D,getSelectedOptions:()=>y.value}),()=>{var t,n;return m("div",{class:O()},[e.toolbarPosition==="top"?I():null,e.loading?m(Te,{class:O("loading")},null):null,(t=o["columns-top"])==null?void 0:t.call(o),K(),(n=o["columns-bottom"])==null?void 0:n.call(o),e.toolbarPosition==="bottom"?I():null])}}});const je=Oe(Re);export{je as P,Be as p};