tdesign-miniprogram/miniprogram_dist/cascader/cascader.js

TDesign Component for miniprogram

import{__awaiter,__decorate}from"tslib";import{SuperComponent,wxComponent}from"../common/src/index";import config from"../common/config";import props from"./props";import{getRect,debounce}from"../common/utils";import usingConfig from"../mixins/using-config";const{prefix:prefix}=config,componentName="cascader";function parseOptions(e,t){var i,s,l;const n=null!==(i=null==t?void 0:t.label)&&void 0!==i?i:"label",a=null!==(s=null==t?void 0:t.value)&&void 0!==s?s:"value",o=null!==(l=null==t?void 0:t.disabled)&&void 0!==l?l:"disabled";return e.map(e=>({[n]:e[n],[a]:e[a],[o]:e[o]}))}function flattenPaths(e,t){var i,s,l,n;const a=null!==(i=null==t?void 0:t.label)&&void 0!==i?i:"label",o=null!==(s=null==t?void 0:t.value)&&void 0!==s?s:"value",h=null!==(l=null==t?void 0:t.children)&&void 0!==l?l:"children",r=null!==(n=null==t?void 0:t.disabled)&&void 0!==n?n:"disabled",d=[],u=(e,t,i)=>{e.forEach((e,s)=>{var l;const n=[...t,e],c=[...i,s],g=null==e?void 0:e[h];if(Array.isArray(g)&&g.length>0)u(g,n,c);else{const t=n.map(e=>{var t;return String(null!==(t=null==e?void 0:e[a])&&void 0!==t?t:"")}),i=[t.join(""),String(null!==(l=null==e?void 0:e.text)&&void 0!==l?l:"")].filter(Boolean).join("");d.push({key:n.map(e=>{var t;return String(null!==(t=null==e?void 0:e[o])&&void 0!==t?t:"")}).join("/"),path:n,indexes:c,labels:t,text:i,disabled:n.some(e=>null==e?void 0:e[r])})}})};return u(e||[],[],[]),d}function buildFragments(e,t){const i=e.join(" / "),s=(e,t,i)=>{t&&e.push({id:e.length,text:t,highlight:i})};if(!t)return[{id:0,text:i,highlight:!1}];const l=[],n=i.toLowerCase(),a=t.toLowerCase();let o=0;for(;o<i.length;){const e=n.indexOf(a,o);if(-1===e){s(l,i.slice(o),!1);break}s(l,i.slice(o,e),!1),s(l,i.slice(e,e+a.length),!0),o=e+a.length}return l.length?l:[{id:0,text:i,highlight:!1}]}function defaultFilter(e,t,i,s){var l,n;const a=e.toLowerCase(),o=i.map(e=>{var t;return String(null!==(t=null==e?void 0:e[s])&&void 0!==t?t:"")}).join("").toLowerCase(),h=String(null!==(n=null===(l=i[i.length-1])||void 0===l?void 0:l.text)&&void 0!==n?n:"").toLowerCase();return o.includes(a)||!!h&&h.includes(a)}const defaultState={contentHeight:0,stepHeight:0,tabsHeight:0,subTitlesHeight:0,stepsInitHeight:0,filterHeight:0,flatPaths:[]};let Cascader=class extends SuperComponent{constructor(){super(...arguments),this.behaviors=[usingConfig({componentName:"cascader"})],this.externalClasses=[`${prefix}-class`],this.options={multipleSlots:!0,pureDataPattern:/^options$/},this.properties=props,this.filterDebounced=null,this.controlledProps=[{key:"value",event:"change"}],this.state=Object.assign({},defaultState),this.data={prefix:prefix,classPrefix:`${prefix}-cascader`,stepIndex:0,selectedIndexes:[],selectedValue:[],scrollTopList:[],steps:[],_optionsHeight:0,filterKeyword:"",filterResults:[],isSearching:!1},this.observers={visible(e){if(e){const e=this.selectComponent("#tabs");null==e||e.setTrack(),null==e||e.getTabHeight().then(e=>{this.state.tabsHeight=e.height}),this.initOptionsHeight(this.data.steps.length),this.updateScrollTop(),this.initWithValue()}else this.state=Object.assign({},defaultState),this.data.isSearching&&this.resetFilter()},value(){this.initWithValue()},options(){const{selectedValue:e,steps:t,items:i}=this.genItems();this.setData({steps:t,items:i,selectedValue:e,stepIndex:i.length-1}),this.invalidateFlatPaths(),this.data.isSearching&&this.applyFilter(this.data.filterKeyword)},keys(){this.invalidateFlatPaths(),this.data.isSearching&&this.applyFilter(this.data.filterKeyword)},filterable(e){!e&&this.data.isSearching&&this.resetFilter()},selectedIndexes(){const{visible:e,theme:t}=this.properties,{selectedValue:i,steps:s,items:l}=this.genItems(),n={steps:s,selectedValue:i,stepIndex:l.length-1};JSON.stringify(l)!==JSON.stringify(this.data.items)&&Object.assign(n,{items:l}),this.setData(n),e&&"step"===t&&this.updateOptionsHeight(s.length)},stepIndex(){return __awaiter(this,void 0,void 0,function*(){const{visible:e}=this.data;e&&this.updateScrollTop()})}},this.methods={updateOptionsHeight(e){const{contentHeight:t,stepsInitHeight:i,stepHeight:s,subTitlesHeight:l,filterHeight:n}=this.state;this.setData({_optionsHeight:t-i-l-n-(e-1)*s})},initOptionsHeight(e){return __awaiter(this,void 0,void 0,function*(){const{classPrefix:t}=this.data,{theme:i,subTitles:s,filterable:l}=this.properties,{height:n}=yield getRect(this,`.${t}__content`);if(this.state.contentHeight=n,"step"===i&&(yield Promise.all([getRect(this,`.${t}__steps`),getRect(this,`.${t}__step`)]).then(([t,i])=>{this.state.stepsInitHeight=t.height-(e-1)*i.height,this.state.stepHeight=i.height})),s.length>0){const{height:e}=yield getRect(this,`.${t}__options-title`);this.state.subTitlesHeight=e}if(l){const e=yield getRect(this,`.${t}__filter`);this.state.filterHeight=e.height}const a=this.state.contentHeight-this.state.subTitlesHeight-this.state.filterHeight;this.setData({_optionsHeight:"step"===i?a-this.state.stepsInitHeight-(e-1)*this.state.stepHeight:a-this.state.tabsHeight})})},initWithValue(){if(null!=this.data.value&&""!==this.data.value){const e=this.getIndexesByValue(this.data.options,this.data.value);e&&this.setData({selectedIndexes:e})}else this.setData({selectedIndexes:[]})},getIndexesByValue(e,t){var i,s,l;const{keys:n}=this.data;for(let a=0,o=e.length;a<o;a+=1){const o=e[a];if(o[null!==(i=null==n?void 0:n.value)&&void 0!==i?i:"value"]===t)return[a];if(o[null!==(s=null==n?void 0:n.children)&&void 0!==s?s:"children"]){const e=this.getIndexesByValue(o[null!==(l=null==n?void 0:n.children)&&void 0!==l?l:"children"],t);if(e)return[a,...e]}}},updateScrollTop(){const{visible:e,items:t,selectedIndexes:i,stepIndex:s}=this.data;e&&getRect(this,".cascader-radio-group-0").then(e=>{var l;const n=e.height/(null===(l=t[0])||void 0===l?void 0:l.length);this.setData({[`scrollTopList[${s}]`]:n*i[s]})})},hide(e){this.setData({visible:!1}),this.triggerEvent("close",{trigger:e})},onVisibleChange(){this.hide("overlay")},onClose(){this.data.checkStrictly&&this.triggerChange(),this.hide("close-btn")},invalidateFlatPaths(){this.state.flatPaths=[]},ensureFlatPaths(){let{flatPaths:e}=this.state;if(!e||0===e.length){const{options:t,keys:i}=this.data;e=flattenPaths(t,i),this.state.flatPaths=e}return e},resetFilter(){this.setData({filterKeyword:"",filterResults:[],isSearching:!1})},onFilterChange(e){var t,i;const s=null!==(i=null===(t=null==e?void 0:e.detail)||void 0===t?void 0:t.value)&&void 0!==i?i:"";this.filterDebounced||(this.filterDebounced=debounce(e=>this.applyFilter(e),200)),this.filterDebounced(s)},onFilterClear(){this.resetFilter()},applyFilter(e){var t;const i=String(null!=e?e:"").trim();if(!i)return void this.resetFilter();const{keys:s,filter:l}=this.data,n=null!==(t=null==s?void 0:s.label)&&void 0!==t?t:"label",a=l,o=this.ensureFlatPaths(),h=[];o.forEach(e=>{const t=e.path[e.path.length-1];("function"==typeof a?!!a(i,t,e.path):defaultFilter(i,t,e.path,n))&&h.push({key:e.key,indexes:e.indexes,disabled:e.disabled,fragments:buildFragments(e.labels,i)})}),this.setData({filterKeyword:e,filterResults:h,isSearching:!0})},onFilterResultTap(e){const{key:t}=e.currentTarget.dataset,i=this.data.filterResults.find(e=>e.key===t);if(!i||i.disabled)return;const{indexes:s}=i,{items:l}=this.regenItemsByIndexes(s);this.resetFilter(),this.setData({items:l,selectedIndexes:s,stepIndex:s.length-1},()=>this.triggerChange()),this.hide("finish")},regenItemsByIndexes(e){var t,i,s;const{options:l,keys:n,placeholder:a,globalConfig:o}=this.data,h=[],r=[],d=[parseOptions(l,n)],u=null!==(t=null==n?void 0:n.label)&&void 0!==t?t:"label",c=null!==(i=null==n?void 0:n.value)&&void 0!==i?i:"value",g=null!==(s=null==n?void 0:n.children)&&void 0!==s?s:"children";let p=l;for(let t=0,i=e.length;t<i;t+=1){const i=p[e[t]];h.push(i[c]),r.push(i[u]);const s=i[g];Array.isArray(s)&&s.length>0&&(d.push(parseOptions(s,n)),p=s)}return r.length<d.length&&r.push(a||o.placeholder),{selectedValue:h,steps:r,items:d}},onStepClick(e){const{index:t}=e.currentTarget.dataset;this.setData({stepIndex:t})},onTabChange(e){const{value:t}=e.detail;this.setData({stepIndex:t})},genItems(){var e,t,i,s,l;const{options:n,selectedIndexes:a,keys:o,placeholder:h,globalConfig:r}=this.data,d=[],u=[],c=[parseOptions(n,o)];if(n.length>0){let h=n;for(let n=0,r=a.length;n<r;n+=1){const r=h[a[n]];h=r[null!==(e=null==o?void 0:o.children)&&void 0!==e?e:"children"],d.push(r[null!==(t=null==o?void 0:o.value)&&void 0!==t?t:"value"]),u.push(r[null!==(i=null==o?void 0:o.label)&&void 0!==i?i:"label"]),r[null!==(s=null==o?void 0:o.children)&&void 0!==s?s:"children"]&&c.push(parseOptions(r[null!==(l=null==o?void 0:o.children)&&void 0!==l?l:"children"],o))}}return u.length<c.length&&u.push(h||r.placeholder),{selectedValue:d,steps:u,items:c}},handleSelect(e){var t,i,s,l,n,a;const{level:o}=e.target.dataset,{value:h}=e.detail,{checkStrictly:r}=this.properties,{selectedIndexes:d,items:u,keys:c,options:g,selectedValue:p}=this.data,v=u[o].findIndex(e=>{var t;return e[null!==(t=null==c?void 0:c.value)&&void 0!==t?t:"value"]===h});let f=d.slice(0,o).reduce((e,t,i)=>{var s;return 0===i?e[t]:e[null!==(s=null==c?void 0:c.children)&&void 0!==s?s:"children"][t]},g);if(f=0===o?f[v]:f[null!==(t=null==c?void 0:c.children)&&void 0!==t?t:"children"][v],f[null!==(i=null==c?void 0:c.disabled)&&void 0!==i?i:"disabled"])return;if(this.triggerEvent("pick",{value:f[null!==(s=null==c?void 0:c.value)&&void 0!==s?s:"value"],label:f[null!==(l=null==c?void 0:c.label)&&void 0!==l?l:"label"],index:v,level:o}),d[o]=v,r&&p.includes(String(h)))return d.length=o,void this.setData({selectedIndexes:d});d.length=o+1;const{items:m}=this.genItems();(null===(a=null==f?void 0:f[null!==(n=null==c?void 0:c.children)&&void 0!==n?n:"children"])||void 0===a?void 0:a.length)>=0?this.setData({selectedIndexes:d,[`items[${o+1}]`]:m[o+1]}):(this.setData({selectedIndexes:d},this.triggerChange),this.hide("finish"))},triggerChange(){var e;const{items:t,selectedValue:i,selectedIndexes:s}=this.data;this._trigger("change",{value:null!==(e=i[i.length-1])&&void 0!==e?e:"",selectedOptions:t.map((e,t)=>e[s[t]]).filter(Boolean)})}}}};Cascader=__decorate([wxComponent()],Cascader);export default Cascader;