quarkd
Version:
Mobile UI Components built on Web Components.
2 lines (1 loc) • 9.04 kB
JavaScript
import{_ as e}from"../toConsumableArray.js";import{_ as t,a as n}from"../typeof.js";import{_ as r,a as i,b as a,c as o,P as c,H as s,d as l,N as p,O as h,B as d}from"../index2.js";import{_ as u}from"../defineProperty.js";import{B as k}from"../core.esm.js";import{W as f}from"../wheel.esm.js";import"../popup/index.js";import"../button/index.js";import"../index4.js";import{Local as m}from"../locale/index.js";import"../unsupportedIterableToArray.js";import"../bodyScrollLock.esm.js";import"../index22.js";import"../loading/index.js";import"../util.js";function v(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var n,a=r(e);if(t){var o=r(this).constructor;n=Reflect.construct(a,arguments,o)}else n=a.apply(this,arguments);return i(this,n)}}k.use(f);var w=function(r){a(l,s);var i=v(l);function l(){var e;t(this,l);for(var n=arguments.length,r=new Array(n),a=0;a<n;a++)r[a]=arguments[a];return e=i.call.apply(i,[this].concat(r)),u(o(e),"open",!1),u(o(e),"title",""),u(o(e),"name",""),u(o(e),"bottomhidden",!1),u(o(e),"forbidmaskclick",!1),u(o(e),"pickerData",[]),u(o(e),"columns",[]),u(o(e),"wheels",[]),u(o(e),"selectedIndexPair",[]),u(o(e),"depth",1),u(o(e),"wheelWrapper",c()),u(o(e),"popupClose",(function(){e.restorePosition(),e.$emit("close")})),u(o(e),"confirm",(function(){var t=e.getValues();e.$emit("confirm",{detail:{value:t}})})),u(o(e),"createWheel",(function(t,n){return e.wheels[n]?e.wheels[n].refresh():(e.wheels[n]=new k(t.children[n],{wheel:{selectedIndex:e.selectedIndexPair[n]||0,wheelWrapperClass:"quark-cascade-picker-wheel-scroll",wheelItemClass:"quark-cascade-picker-wheel-item"}}),e.wheels[n].on("scrollEnd",(function(){var t=e.wheels.map((function(e){return e.getSelectedIndex()}));e.changePickerData(t,e.selectedIndexPair),e.selectedIndexPair=t;var n=e.getValues(!1);e.$emit("change",{detail:{value:n}})}))),e.wheels[n]})),u(o(e),"renderWheel",(function(){return!e.pickerData||e.pickerData.length<=0?null:e.pickerData.map((function(e){return s.h("div",{class:"quark-cascade-picker-wheel",part:"picker-wheel"},s.h("ul",{class:"quark-cascade-picker-wheel-scroll",part:"picker-wheel-scroll"},e.map((function(e){return s.h("li",{class:"quark-cascade-picker-wheel-item",part:"picker-wheel-item"},e)}))))}))})),e}return n(l,[{key:"setColumns",value:function(e){if(e&&!(e.length<1)){this.columns=e;var t=this.wheelWrapper.current;if(t){var n=this.columns[0];if(this.depth=this.getDepths(n,1),this.selectedIndexPair=new Array(this.depth).fill(0),!(this.depth<=1)){this.loadInitPickerData();for(var r=0;r<this.depth;r+=1)this.createWheel(t,r)}}}}},{key:"loadInitPickerData",value:function(){for(var t=this.columns,n=e(this.pickerData),r=0;r<this.depth;r+=1){var i=t.map((function(e){return e.text}));n.splice(r,1,i),t=t[0].children}this.pickerData=n}},{key:"getDepths",value:function(e,t){return!e.children||e.children.length<=0?t:(t+=1,this.getDepths(e.children[0],t))}},{key:"getValues",value:function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0];e&&this.restorePosition();var t=this.wheels.map((function(e){return e.getSelectedIndex()})),n=this.pickerData.map((function(e,n){var r=t[n];return{value:e[r],index:r}}));return this.selectedIndexPair=t,n}},{key:"restorePosition",value:function(){this.wheels.forEach((function(e){e.restorePosition()}))}},{key:"changePickerData",value:function(t,n){for(var r=this,i=e(this.pickerData),a=this.columns,o=0;o<this.depth-1;o+=1)if(t[o]!==n[o]){for(var c=0;c<=o;c+=1)a=a[t[c]].children;for(var s=o;s<this.depth-1;s+=1){var l=a.map((function(e){return e.text}));i.splice(s+1,1,l),a=a[0].children}break}this.pickerData=i,setTimeout((function(){for(var e=0;e<r.depth;e++)r.wheels[e].refresh()}),1)}},{key:"render",value:function(){return s.h("quark-popup",{open:this.open,position:"bottom",safearea:!0,round:!0,forbidmaskclick:this.forbidmaskclick,onclose:this.popupClose,part:"root"},s.h("div",{class:"quark-cascade-picker",part:"picker"},s.h("div",{class:"quark-cascade-picker-header",part:"picker-header"},s.h("slot",{name:"header"},s.h("span",{class:"quark-cascade-picker-title",part:"picker-title"},this.title),s.h("div",{class:"quark-cascade-picker-close-btn",part:"picker-close-btn"},s.h("quark-icon-close",{size:"24",onclick:this.popupClose})))),s.h("div",{class:"quark-cascade-picker-content",part:"picker-content"},s.h("div",{class:"quark-cascade-picker-mask-top",part:"picker-mask-top"}),s.h("div",{class:"quark-cascade-picker-mask-bottom",part:"picker-mask-bottom"}),s.h("div",{class:"quark-picker-current",part:"picker-current"},s.h("div",{class:"quark-picker-current-mask",part:"picker-current-mask"})),s.h("div",{class:"quark-cascade-picker-wheel-wrapper",part:"picker-wheel-wrapper",ref:this.wheelWrapper},this.renderWheel())),!this.bottomhidden&&s.h("div",{class:"quark-cascade-picker-bottom",part:"picker-bottom"},s.h("quark-button",{type:"primary",size:"big",onclick:this.confirm},m.current.confirm))))}}]),l}();l([p({type:Boolean})],w.prototype,"open",void 0),l([p()],w.prototype,"title",void 0),l([p()],w.prototype,"name",void 0),l([p({type:Boolean})],w.prototype,"bottomhidden",void 0),l([p({type:Boolean})],w.prototype,"forbidmaskclick",void 0),l([h()],w.prototype,"pickerData",void 0);var g=w=l([d({tag:"quark-cascade-picker",style:":host {\n width: 100%;\n}\n\n:host ul {\n list-style: none;\n padding: 0;\n}\n\n:host quark-button {\n width: 100%;\n font-weight: 500;\n --button-height: 100%;\n --button-font-size: 4.8vw;\n cursor: pointer;\n}\n\n:host .quark-cascade-picker {\n width: 100%;\n height: 90.13333vw;\n position: relative;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n\n:host .quark-cascade-picker-header {\n position: relative;\n height: 14.93333vw;\n width: 100%;\n background-color: white;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n:host .quark-cascade-picker-title {\n color: var(--cascadepicker-title-color, #242729);\n font-weight: var(--cascadepicker-title-font-weight, 500);\n font-family: var(--cascadepicker-title-font-family, PingFangSC-Medium, PingFang SC);\n text-align: center;\n font-size: var(--cascadepicker-title-font-size, 4.8vw);\n}\n\n:host .quark-cascade-picker-close-btn {\n height: 100%;\n position: absolute;\n right: 5.33333vw;\n top: 0;\n bottom: 0;\n /* width: 56px; */\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n:host quark-icon-close {\n font-size: 6.4vw;\n color: #bcc4cc;\n cursor: pointer;\n}\n\n:host .quark-cascade-picker-content {\n position: absolute;\n display: flex;\n top: 14.93333vw;\n bottom: 19.2vw;\n left: 0;\n right: 0;\n background-color: white;\n box-sizing: border-box;\n}\n\n:host .quark-cascade-picker-bottom {\n position: absolute;\n bottom: 0;\n left: 0;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 19.2vw;\n background-color: white;\n box-sizing: border-box;\n padding: 3.2vw 4.26667vw;\n}\n\n:host .quark-cascade-picker-mask-top,\n.quark-cascade-picker-mask-bottom {\n z-index: 10;\n width: 100%;\n height: 22.13333vw;\n pointer-events: none;\n transform: translateZ(0);\n}\n\n:host .quark-cascade-picker-mask-top {\n position: absolute;\n top: 0;\n background: linear-gradient(\n to top,\n rgb(255 255 255 / 30%),\n rgb(255 255 255 / 80%)\n );\n}\n\n:host .quark-cascade-picker-mask-bottom {\n position: absolute;\n bottom: 0;\n background: linear-gradient(\n to bottom,\n rgb(255 255 255 / 30%),\n rgb(255 255 255 / 80%)\n );\n}\n\n:host .quark-picker-current {\n position: absolute;\n top: 21.06667vw;\n height: 13.86667vw;\n width: 100%;\n padding: 0 4.26667vw;\n box-sizing: border-box;\n}\n\n:host .quark-picker-current .quark-picker-current-mask {\n height: 100%;\n background-color: #f7f9fa;\n border-radius: 2.13333vw;\n}\n\n:host .quark-cascade-picker-wheel-wrapper {\n display: flex;\n padding: 2.66667vw 4.26667vw;\n width: 100%;\n}\n\n:host .quark-cascade-picker-wheel {\n flex: 1;\n width: 1%;\n height: 100%;\n overflow: hidden;\n}\n\n:host .quark-cascade-picker-wheel-scroll {\n padding: 0;\n margin-top: 19.73333vw;\n list-style: none;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n\n:host .quark-cascade-picker-wheel-item {\n font-size: 4.26667vw;\n list-style: none;\n height: 11.73333vw;\n line-height: 11.73333vw;\n overflow: hidden;\n white-space: nowrap;\n color: #242729;\n display: flex;\n justify-content: center;\n align-items: center;\n text-align: center;\n}\n\n:host([bottomhidden]) .quark-cascade-picker-picker-content {\n bottom: 0;\n}\n\n:host([bottomhidden]) .quark-cascade-picker-picker-container {\n height: 70.93333vw;\n}\n"})],w);export{g as default};