@ibiz-template/vue3-components 0.7.41-alpha.19 → 0.7.41-alpha.20

package/dist/map-chart-3dojS1dZ.js

@@ -1 +0,0 @@
-System.register(["vue","ramda","@ibiz-template/vue3-util","echarts"],(function(e){"use strict";var t,a,o,r,i,n,s,l,c,p,d;return{setters:[function(e){t=e.ref,a=e.onMounted,o=e.onUnmounted,r=e.defineComponent,i=e.computed,n=e.createVNode},function(e){s=e.mergeDeepWithKey,l=e.isNil},function(e){c=e.useNamespace},function(e){p=e.init,d=e.registerMap}],execute:function(){const u={strAreaCode:!1,visualMap:{text:[ibiz.i18n.t("component.mapChart.high"),ibiz.i18n.t("component.mapChart.low")],min:0,max:100,rangeColor:["#90d1e7","#fff600","#ff5200"]},areaColor:"#87cefa",areaBorderColor:"#FFF",hoverAreaColor:"#fbdb2f",pointSymbol:"pin",jsonBaseUrl:"".concat(ibiz.env.assetsUrl,"/json/map"),defaultAreaCode:1e5};function m(e,r,i){const n=new Map,s=t(""),l=t([]);let c;const u=t();let m;const f=async t=>{if(n.has(t))return;const a=await async function(e,t){return(await ibiz.net.axios({url:"".concat(e,"/").concat(t,".json")})).data}(e.value.jsonBaseUrl,t);n.set(t,(e=>{const t={cityNames:{},noChild:1===e.features.length};return e.features.forEach((e=>{const{adcode:a,name:o}=e.properties;t.cityNames[a]=o})),t})(a)),d(t,a)},h=()=>{if(s.value){const e=r(s.value);c.setOption(e),c.resize()}},v=async(t,a=!1)=>{a||i("mapChange",{areaCode:e.value.strAreaCode?"".concat(t):Number(t)});const o="".concat(t);n.has(o)||await f(o),s.value=o,l.value.push(o),h()},y=()=>{null==c||c.resize()};return a((()=>{c=p(u.value),window.addEventListener("resize",y),u.value&&ResizeObserver&&(m=new ResizeObserver((()=>{y()})),m.observe(u.value)),c.on("click",(e=>{if("series"===e.componentType){if("scatter"===e.seriesType)return void i("pointClick",e.data);"map"===e.seriesType&&(e.data&&i("areaClick",e.data),e.name!==s.value&&v(e.name))}})),c.on("mouseover",(function(e){if("series"===e.componentType&&"scatter"===e.seriesType){const t=e.dataIndex,a=c.getOption(),o=a.series[e.seriesIndex].data,r=a.series[e.seriesIndex].symbolSize;o[t].symbolSize=r+10,c.setOption(a)}})),c.on("mouseout",(function(e){if("series"===e.componentType&&"scatter"===e.seriesType){const t=e.dataIndex,a=c.getOption();delete a.series[e.seriesIndex].data[t].symbolSize,c.setOption(a)}}))})),o((()=>{window.removeEventListener("resize",y),null==m||m.disconnect()})),{chartRef:u,historyNames:l,currentName:s,changeMap:v,getCityName:e=>{const t=n.get(s.value);if(t)return t.cityNames[e]},goBack:()=>{if(l.value.length>1){l.value.pop();const e=l.value.pop();v(e)}},refresh:h}}const f=r({name:"IBizMapChart",props:{areaData:{type:Array},pointData:{type:Array},options:{type:Object,default:()=>({})}},setup(e,{emit:t}){const o=c("map-chart"),r=i((()=>s(((e,t,a)=>l(a)?t:a),u,e.options))),n=(t,a)=>"area"===a&&e.areaData?e.areaData.find((e=>e._id===t)):"point"===a&&e.pointData?e.pointData.find((e=>e._id===t)):void 0,{chartRef:p,historyNames:d,changeMap:f,getCityName:h,goBack:v}=m(r,(t=>{const{visualMap:a,pointSymbol:o,areaColor:i,hoverAreaColor:s,areaBorderColor:l}=r.value,c=e.areaData||[],p=e.pointData||[];return{geo:{map:t},tooltip:{trigger:"item",textStyle:{color:"#fff",fontSize:12},backgroundColor:"rgba(0, 0, 0, 0.47)",borderWidth:0,extraCssText:"backdrop-filter: blur(3px);"},visualMap:{min:a.min,max:a.max,text:a.text,realtime:!1,hoverLink:!1,inRange:{color:a.rangeColor}},series:[{type:"map",map:t,nameProperty:"adcodeStr",itemStyle:{areaColor:i,borderColor:l,borderWidth:2},emphasis:{itemStyle:{areaColor:s}},tooltip:{formatter:e=>{if(!e.data)return;const t=n(e.data._id,"area");return t?t._tooltip:void 0}},label:{show:!0,color:"#000000",fontSize:14,formatter:e=>h(e.name)},select:{disabled:!0},data:c.map((e=>({name:"".concat(e._areaCode),value:e._value,_id:e._id})))},{type:"scatter",coordinateSystem:"geo",symbol:o,symbolSize:20,visualMap:!1,itemStyle:{color:"#FF1D00"},label:{show:!0,color:"#000000",fontSize:14,textShadowBlur:0,formatter:e=>{const t=n(e.data._id,"point");return null==t?void 0:t._text},position:"left",offset:[10,-15]},tooltip:{formatter:e=>{const t=n(e.data._id,"point");return null==t?void 0:t._tooltip}},data:p.map((e=>({_id:e._id,symbol:e._symbol?"image://".concat(e._symbol):void 0,value:[Number(e._longitude),Number(e._latitude)],visualMap:!1})))}]}}),((e,a)=>{switch(e){case"mapChange":t("mapChange",a);break;case"pointClick":t("pointClick",n(a._id,"point"));break;case"areaClick":t("areaClick",n(a._id,"area"))}}));return a((()=>{f(r.value.defaultAreaCode,!0)})),{ns:o,chartRef:p,historyNames:d,goBack:v}},render(){return n("div",{class:this.ns.b()},[n("div",{class:this.ns.e("chart"),ref:"chartRef"},null),this.historyNames.length>1&&n("div",{class:this.ns.e("goback"),onClick:()=>{this.goBack()}},[ibiz.i18n.t("app.return")])])}});e({IBizMapChart:f,default:f})}}}));

package/dist/map-chart-user-NYROZ-6g.js

@@ -1 +0,0 @@
-System.register(["vue","ramda","@ibiz-template/vue3-util","@ibiz-template/runtime","@ibiz-template/core","lodash-es","echarts"],(function(e){"use strict";var t,a,o,r,n,s,l,i,c,u,d,p,m,v,f,b,h,y;return{setters:[function(e){t=e.ref,a=e.onMounted,o=e.onUnmounted,r=e.defineComponent,n=e.computed,s=e.onBeforeUnmount,l=e.createVNode,i=e.resolveComponent},function(e){c=e.mergeDeepLeft,u=e.mergeDeepWithKey,d=e.isNil},function(e){p=e.useNamespace},function(e){m=e.MapController},function(e){v=e.listenJSEvent,f=e.NOOP},function(e){b=e.toNumber},function(e){h=e.init,y=e.registerMap}],execute:function(){const C={strAreaCode:!1,visualMap:{text:[ibiz.i18n.t("component.mapChart.high"),ibiz.i18n.t("component.mapChart.low")],min:0,max:100,rangeColor:["#90d1e7","#fff600","#ff5200"]},areaColor:"#87cefa",areaBorderColor:"#FFF",hoverAreaColor:"#fbdb2f",pointSymbol:"pin",jsonBaseUrl:"".concat(ibiz.env.assetsUrl,"/json/map"),defaultAreaCode:1e5,bottom:20,top:20},g=e=>{const t=[];return e._color&&t.push("color:".concat(e._color)),e._bgcolor&&t.push("background:".concat(e._bgcolor)),e._borderColor&&t.push("border-color:".concat(e._borderColor)),e._borderWidth&&t.push("border-width:".concat(e._borderWidth,"px")),e._borderWidth&&e._borderColor&&t.push("border-style:solid"),t.join(";")},_=(e,t,a=[],o=[])=>"area"===t?o.find((t=>t._id===e)):"point"===t?a.find((t=>t._id===e)):void 0,N=e=>{let t=e;const a=window.getComputedStyle(document.documentElement);return a&&(t=a.getPropertyValue(e)||t),t},z=e=>{const{pointSymbol:t}=e,a=p("map-chart-user"),o=N(a.cssVarName("color-danger")),r=N(a.cssVarName("font-size-header-4"));return{type:"scatter",coordinateSystem:"geo",symbol:t,symbolSize:Number(r.slice(0,2)),visualMap:!1,itemStyle:{color:o}}},x=(e,t)=>{const a={},o=p("map-chart-user"),r=N(o.cssVarName("color-text-1")),n=N(o.cssVarName("font-size-regular"));return a.label={show:!0,color:r,fontSize:Number(n.slice(0,2)),textShadowBlur:0,formatter:a=>{if(!a.data)return;const o=_(a.data._id,"point",e,t);return null==o?void 0:o._text},position:"left",offset:[10,-15]},a.tooltip={formatter:a=>{if(!a.data)return;const r=_(a.data._id,"point",e,t);if(!r)return;const{_deData:n}=r;let s=n.srfmajortext;r._value&&(s="".concat(n.srfmajortext,": ").concat(r._value)),r._tooltip&&(s=r._tooltip);const l=g(r);return'<div style="'.concat(l,'" class="').concat(r._className," ").concat(o.e("popper"),'">').concat(s,"</div>")},padding:0},a.data=e.map((e=>{let t;return e._symbol&&(t="image://".concat(e._symbol)),{_id:e._id,symbol:t,value:[Number(e._longitude),Number(e._latitude)],visualMap:!1}})),a},w=e=>{const{areaColor:t,areaBorderColor:a,hoverAreaColor:o}=e;return{type:"map",nameProperty:"adcodeStr",itemStyle:{areaColor:t,borderColor:a,borderWidth:2},emphasis:{itemStyle:{areaColor:o}}}},S=(e,t,a,o=[])=>{const r={},n=p("map-chart-user"),s=N(n.cssVarName("color-text-1")),l=N(n.cssVarName("font-size-regular"));return r.map=e,r.label={show:!0,color:s,fontSize:Number(l.slice(0,2)),formatter:e=>o.cityNames[e.name]},r.tooltip={formatter:e=>{if(!e.data)return;const o=_(e.data._id,"area",t,a);if(!o||!o._tooltip&&!o._value)return;const{_deData:r}=o;let s=r.srfmajortext;o._value&&(s="".concat(r.srfmajortext,": ").concat(o._value)),o._tooltip&&(s=o._tooltip);const l=g(o);return'<div style="'.concat(l,'" class="').concat(o._className," ").concat(n.e("popper"),'">').concat(s,"</div>")},padding:0},r.data=a.map((e=>({name:"".concat(e._areaCode),value:e._value,_id:e._id,deData:e}))),r.select={disabled:!0},r};function D(e,r,n){const s=new Map,l=t(""),i=t([]),c=new Map,u=t(!1);let d;const p=t();let m;const f=async t=>{e.options=t,await e.evt.emit("onBeforeUpdate",{data:t}),d.setOption(t,!0)},C=async e=>{if(s.has(e))return;const t=await async function(e,t){return(await ibiz.net.axios({url:"".concat(e,"/").concat(t,".json")})).data}(r.value.jsonBaseUrl,e);s.set(e,(e=>{const t={cityNames:{},noChild:1===e.features.length};return e.features.forEach((e=>{const{adcode:a,name:o,level:r}=e.properties;t.cityNames[a]=o,c.set(a,r)})),t})(t)),y(e,t)},g=()=>s.get(l.value),N=()=>{if(l.value){const e=n(l.value);f(e),d.resize()}},z=async(t,a,o=!1)=>{const r="".concat(t);if(s.has(r)||await C(r),o){const t=c.get(b(a))||"";e.state.areaLevel=t}else e.onMapChange(a);l.value=r,e.state.mapInfo=g(),i.value.push(r),N()},x=v(window,"resize",(()=>{d&&d.resize()}));return a((()=>{d=h(p.value),e.chart=d,p.value&&ResizeObserver&&(m=new ResizeObserver((()=>{null==d||d.resize()})),m.observe(p.value)),d.on("click",(t=>{if("series"===t.componentType){if("scatter"===t.seriesType){if(!t.data)return;u.value=!0;const{pointData:a,areaData:o}=e.state,r=_(t.data._id,"point",a,o);return r&&e.onPointClick(r),void(u.value=!1)}if("map"===t.seriesType){u.value=!0;const a=r.value.strAreaCode?"".concat(t.name):Number(t.name),o=c.get(b(a))||"",{pointData:n,areaData:s,enabledDrillDown:i,mdctrlActiveMode:d}=e.state;if(t.data){const r=_(t.data._id,"area",n,s);r&&e.onAreaClick(r,a,o)}t.name!==l.value&&i&&2!==d&&(b(a)>b(e.state.areaCode)&&e.evt.emit("onDrillDown",{data:{areaCode:a}}),e.state.areaCode=a,e.state.areaLevel=o||"",z(t.name,a)),u.value=!1}}})),d.on("dblclick",(t=>{const{enabledDrillDown:a,mdctrlActiveMode:o}=e.state;if("series"===t.componentType&&"map"===t.seriesType&&2===o&&a){u.value=!0;const a=r.value.strAreaCode?"".concat(t.name):Number(t.name),o=c.get(b(a))||"";b(a)>b(e.state.areaCode)&&e.evt.emit("onDrillDown",{data:{areaCode:a}}),e.state.areaCode=a,e.state.areaLevel=o,t.name!==l.value&&z(t.name,a),u.value=!1}})),d.on("mouseover",(function(t){if(e.evt.emit("onMouseOver",{data:t}),"series"===t.componentType&&"scatter"===t.seriesType){const e=t.dataIndex,a=d.getOption(),o=a.series[t.seriesIndex].data,r=a.series[t.seriesIndex].symbolSize;o[e].symbolSize=r+10,f(a)}})),d.on("mouseout",(function(t){if(e.evt.emit("onMouseOut",{data:t}),"series"===t.componentType&&"scatter"===t.seriesType){const e=t.dataIndex,a=d.getOption();delete a.series[t.seriesIndex].data[e].symbolSize,f(a)}}))})),o((()=>{x(),null==m||m.disconnect()})),{chartRef:p,historyNames:i,currentName:l,processing:u,areaLevelMap:c,changeMap:z,getCityInfo:g,goBack:async()=>{if(i.value.length>1){i.value.pop();const t=i.value.pop(),a=r.value.strAreaCode?"".concat(t):Number(t),o=c.get(b(a))||"";e.state.areaCode=a,e.state.areaLevel=o,z(t,a)}},refresh:N}}const M=r({name:"IBizMapChartUser",props:{areaData:{type:Array},pointData:{type:Array},options:{type:Object,default:()=>({})},controller:{type:m,required:!0}},setup(e){const o=p("map-chart-user"),r=e.controller;let l=C;const i=t(),m=t(!1);if(r.controlParams.defaultopts){const e=JSON.parse(r.controlParams.defaultopts);l=c(e,l)}const h=n((()=>u(((e,t,a)=>d(a)?t:a),l,e.options)));let y=f;const{chartRef:g,historyNames:_,processing:M,areaLevelMap:k,changeMap:A,getCityInfo:B,goBack:F}=D(e.controller,h,(t=>{const a=e.areaData||[],o=e.pointData||[],r=(()=>{const e=p("map-chart-user"),t=N(e.cssVarName("color-text-1")),a=N(e.cssVarName("font-size-regular")),o=N(e.cssVarName("color-bg-0"));return{trigger:"item",textStyle:{color:t,fontSize:Number(a.slice(0,2))},backgroundColor:o,borderWidth:0,extraCssText:"backdrop-filter: blur(3px);"}})(),n=(e=>{const{visualMap:t}=e;return{min:t.min,max:t.max,text:t.text,realtime:!1,hoverLink:!1,inRange:{color:t.rangeColor}}})(h.value),s=B(),l={...z(h.value),...x(o,a)},{top:i,bottom:c}=h.value;return{geo:{map:t,top:i,bottom:c},tooltip:r,visualMap:n,series:[{top:i,bottom:c,...w(h.value),...S(t,o,a,s)},l]}}));a((()=>{const e=h.value.defaultAreaCode,t=r.state.strAreaCode?"".concat(e):Number(e);r.state.areaCode=t,A(e,t,!0),r.evt.on("onDrillDown",(async e=>{if(!M.value){const{data:t}=e,a=t.areaCode,o=r.state.strAreaCode?"".concat(a):Number(a),n=k.get(b(o))||"";r.state.areaCode=o,r.state.areaLevel=n,await A(a,a)}})),r.evt.on("onBackClick",(()=>{M.value||F()})),y=v(window,"resize",(()=>{m.value&&(m.value=ibiz.fullscreenUtil.isFullScreen)}))})),s((()=>{y!==f&&y()}));return{ns:o,c:r,mapRef:i,chartRef:g,historyNames:_,isFull:m,onBack:async()=>{M.value=!0,await r.evt.emit("onBackClick",void 0),F(),M.value=!1},toggleFullScreen:()=>{i.value&&(m.value?ibiz.fullscreenUtil.closeElementFullscreen():ibiz.fullscreenUtil.openElementFullscreen(i.value),m.value=!m.value)}}},render(){const{enabledFullScreen:e}=this.c.state;return l("div",{class:this.ns.b(),ref:"mapRef"},[e?l(i("el-button"),{type:"info",class:this.ns.e("fullscreen"),onClick:this.toggleFullScreen,title:this.isFull?ibiz.i18n.t("app.cancelFullscreen"):ibiz.i18n.t("app.fullscreen")},{default:()=>[l("ion-icon",{name:this.isFull?"contract-outline":"expand-outline"},null)]}):null,l("div",{class:this.ns.e("chart"),ref:"chartRef"},null),this.historyNames.length>1&&l("div",{class:this.ns.e("goback"),onClick:()=>{this.onBack()}},[ibiz.i18n.t("app.return")])])}});e({IBizMapChartUser:M,default:M})}}}));