npm - @qxs-bns/components - Versions diffs - 0.0.29 → 0.0.31 - Mend

@qxs-bns/components 0.0.29 → 0.0.31

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (235) hide show

package/es/package.json.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var r="0.0.29";export{r as version};
+var r="0.0.31";export{r as version};
 //# sourceMappingURL=package.json.mjs.map

package/es/src/data-chart/src/components/area.vue2.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineComponent as e,createElementBlock as a,openBlock as t,createCommentVNode as r,createElementVNode as n}from"vue";import*as s from"echarts";import{getGeoJsonData as o}from"../utils/config.mjs";import{InjectionChartMerge as c}from"../utils/injectionKeys.mjs";import{useCharts as i}from"../utils/useCharts.mjs";import{inject as l,ref as m,computed as u}from"vue-demi";const p={class:"data-chart-area-wrap"};var d=e({name:"DataChartArea",__name:"area",props:{chartOptions:{type:null,required:!0},chartData:{type:Object,required:!1,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})}},setup(e){const d=l(c,(e=>e),!0);let h="中国";const f=m({features:[],type:"FeatureCollection"}),D=m(null);let v=null;const y=u((()=>{const{xGroupByDesc:a,groupByDesc:t,colDesc:r,modelName:n,data:s}=e.chartData,o=[];r.forEach((e=>{s.forEach((a=>{o.push(Number(a[e]))}))}));const c={title:{text:n},tooltip:{formatter(e){let a=`${e.name}<br/>`;return c.series?.forEach((t=>{t.data?.forEach((r=>{r.name===e.name&&(a+=`${t.name}：${r.value}</br>`)})),a.includes(t.name)||(a+=`${t.name}：-</br>`)})),a}},visualMap:{min:Math.min(...o,0),max:Math.max(...o,0)},series:r?.map((e=>{const r=[],n=t.find((e=>e.colDesc===("中国"===h?"医院所在省":"医院所在市"))),o={};s.map((t=>{const r=t[("中国"===h?a?.colDesc||"":n?.colDesc)||""],s=f.value.features?.find((({properties:{name:e}})=>e?.includes(r)));return{name:s?.properties?.name||"",value:Number(t[e])}})).forEach((e=>{o[e.name]?o[e.name]=o[e.name]+e.value:o[e.name]=e.value}));for(const e in o)r.push({name:e,value:o[e]});return{name:e,type:"map",map:h,data:r}}))};return d(c,e.chartOptions)}));async function g(e="中国"){if(v&&!v.isDisposed()){v.showLoading();try{const a=await o({adcode:e});if(!a)return void v.hideLoading();f.value=a,h=e;const t=s.registerMap(e,a);return v.hideLoading(),t}catch(e){console.log(e),v.hideLoading()}}}return i({chartDOM:D,chartOptions:y,chartData:u((()=>e.chartData)),initAfter:async function(){await g(),v&&!v.isDisposed()&&(v.getZr()?.on("click",(e=>{e.target||"中国"===h||g("中国")})),v.on("click",(a=>{const t=e.chartData.groupByDesc?.some((e=>"医院所在市"===e.colDesc));"中国"===h&&t&&g(a.name).then((()=>{v&&!v.isDisposed()&&v.setOption(y.value)}))})))},callback:e=>{v=e}}),(e,s)=>(t(),a("div",p,[r(' <el-select\n      v-if="isShowSelect"\n      v-model="adcode"\n      class="city-select"\n      size="small"\n      @change="selectChina"\n    >\n      <el-option\n        v-for="item in selectList"\n        :key="item.value"\n        :label="item.label"\n        :value="item.value"\n      />\n    </el-select> '),n("div",{ref_key:"dataChartArea",ref:D,class:"data-chart-area"},null,512)]))}});export{d as default};
+import{defineComponent as e,inject as a,ref as t,computed as r,createElementBlock as n,openBlock as s,createCommentVNode as o,createElementVNode as c}from"vue";import*as i from"echarts";import{getGeoJsonData as l}from"../utils/config.mjs";import{InjectionChartMerge as m}from"../utils/injectionKeys.mjs";import{useCharts as u}from"../utils/useCharts.mjs";const p={class:"data-chart-area-wrap"};var d=e({name:"DataChartArea",__name:"area",props:{chartOptions:{type:null,required:!0},chartData:{type:Object,required:!1,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})}},setup(e){const d=a(m,(e=>e),!0);let h="中国";const f=t({features:[],type:"FeatureCollection"}),D=t(null);let v=null;const y=r((()=>{const{xGroupByDesc:a,groupByDesc:t,colDesc:r,modelName:n,data:s}=e.chartData,o=[];r.forEach((e=>{s.forEach((a=>{o.push(Number(a[e]))}))}));const c={title:{text:n},tooltip:{formatter(e){let a=`${e.name}<br/>`;return c.series?.forEach((t=>{t.data?.forEach((r=>{r.name===e.name&&(a+=`${t.name}：${r.value}</br>`)})),a.includes(t.name)||(a+=`${t.name}：-</br>`)})),a}},visualMap:{min:Math.min(...o,0),max:Math.max(...o,0)},series:r?.map((e=>{const r=[],n=t.find((e=>e.colDesc===("中国"===h?"医院所在省":"医院所在市"))),o={};s.map((t=>{const r=t[("中国"===h?a?.colDesc||"":n?.colDesc)||""],s=f.value.features?.find((({properties:{name:e}})=>e?.includes(r)));return{name:s?.properties?.name||"",value:Number(t[e])}})).forEach((e=>{o[e.name]?o[e.name]=o[e.name]+e.value:o[e.name]=e.value}));for(const e in o)r.push({name:e,value:o[e]});return{name:e,type:"map",map:h,data:r}}))};return d(c,e.chartOptions)}));async function g(e="中国"){if(v&&!v.isDisposed()){v.showLoading();try{const a=await l({adcode:e});if(!a)return void v.hideLoading();f.value=a,h=e;const t=i.registerMap(e,a);return v.hideLoading(),t}catch(e){console.log(e),v.hideLoading()}}}return u({chartDOM:D,chartOptions:y,chartData:r((()=>e.chartData)),initAfter:async function(){await g(),v&&!v.isDisposed()&&(v.getZr()?.on("click",(e=>{e.target||"中国"===h||g("中国")})),v.on("click",(a=>{const t=e.chartData.groupByDesc?.some((e=>"医院所在市"===e.colDesc));"中国"===h&&t&&g(a.name).then((()=>{v&&!v.isDisposed()&&v.setOption(y.value)}))})))},callback:e=>{v=e}}),(e,a)=>(s(),n("div",p,[o(' <el-select\n      v-if="isShowSelect"\n      v-model="adcode"\n      class="city-select"\n      size="small"\n      @change="selectChina"\n    >\n      <el-option\n        v-for="item in selectList"\n        :key="item.value"\n        :label="item.label"\n        :value="item.value"\n      />\n    </el-select> '),c("div",{ref_key:"dataChartArea",ref:D,class:"data-chart-area"},null,512)]))}});export{d as default};
 //# sourceMappingURL=area.vue2.mjs.map

package/es/src/data-chart/src/components/area.vue2.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"area.vue2.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/area.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ECharts } from 'echarts/types/dist/echarts'\nimport type { EChartsOption, GeoJson, IFormatPublicData } from '../types'\nimport * as echarts from 'echarts'\nimport { getGeoJsonData } from '../utils/config'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartArea',\n})\n\nconst {\n chartOptions,\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n} = defineProps<{\n chartOptions: EChartsOption\n chartData?: IFormatPublicData\n}>()\n\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\n\nlet adcode = '中国'\nconst currentGeoJson = ref<GeoJson>({\n features: [],\n type: 'FeatureCollection',\n})\nconst dataChartArea = ref(null)\nlet myChart: ECharts \| null = null\n\nconst areaChartOptions = computed<EChartsOption>(() => {\n const { xGroupByDesc, groupByDesc, colDesc, modelName, data } = chartData\n const allNums: number[] = []\n colDesc.forEach((item) => {\n data.forEach((dataItem) => {\n allNums.push(Number(dataItem[item]))\n })\n })\n const config = {\n title: {\n text: modelName,\n },\n tooltip: {\n formatter(params: { name: string }) {\n let res = `${params.name}<br/>`\n config.series?.forEach((colDescItem) => {\n colDescItem.data?.forEach((item) => {\n if (item.name === params.name) {\n res += `${colDescItem.name}：${item.value}</br>`\n }\n })\n if (!res.includes(colDescItem.name)) {\n res += `${colDescItem.name}：-</br>`\n }\n })\n return res\n },\n },\n visualMap: {\n min: Math.min(...allNums, 0),\n max: Math.max(...allNums, 0),\n },\n series: colDesc?.map((colDescItem) => {\n const seriesData = []\n const row = groupByDesc.find(item => item.colDesc === (adcode === '中国' ? '医院所在省' : '医院所在市'))\n // 先用省份数据，如果没有再用市级数据\n\n const arr: {\n [key: string]: number\n } = {}\n data.map((item) => {\n const sourceName = item[(adcode === '中国' ? (xGroupByDesc?.colDesc \|\| '') : row?.colDesc) \|\| '']\n const find = currentGeoJson.value.features?.find(({ properties: { name } }: { properties: { name?: string } }) => name?.includes(sourceName as string))\n return {\n name: find?.properties?.name \|\| '',\n value: Number(item[colDescItem]),\n }\n }).forEach((item) => {\n if (!arr[item.name]) {\n arr[item.name] = item.value\n }\n else {\n arr[item.name] = arr[item.name] + item.value\n }\n })\n for (const key in arr) {\n seriesData.push({\n name: key,\n value: arr[key],\n })\n }\n return {\n name: colDescItem,\n type: 'map',\n map: adcode,\n data: seriesData,\n }\n }),\n }\n\n return merge(config, chartOptions)\n})\n// const propsXgroupByInfos = computed(() => {\n// const { groupByDesc } = chartData\n// const [row] = groupByDesc.filter(item => item.colDesc === '医院所在省')\n// if (row) {\n// return row\n// }\n// else {\n// const [res] = groupByDesc.filter(item => item.colDesc === '医院所在市')\n// return res\n// }\n// })\n// const selectList = computed(() => {\n// let arr = [{ label: '中国', value: '中国' }]\n// if (chartData.groupByDesc.length === 1 && propsXgroupByInfos.value?.colDesc === '医院所在市') {\n// const {\n// data,\n// xGroupByDesc: { colDesc },\n// } = chartData\n// arr = data.map((item) => {\n// return {\n// label: item[colDesc],\n// value: item[colDesc],\n// }\n// })\n// }\n// return arr\n// })\n\n// const isShowSelect = computed(() => {\n// const { groupByDesc } = chartData.value\n// return groupByDesc[0] && groupByDesc[0].colDesc !== '医院所在省' && groupByDesc.length === 1 && selectList.value.length\n// })\n\nasync function initAfter() {\n await registerMap()\n // 添加判断，确保图表实例存在且未被销毁\n if (myChart && !myChart.isDisposed()) {\n // charts 监听事件\n myChart.getZr()?.on('click', (params: { target: HTMLElement }) => {\n if (!params.target && adcode !== '中国') {\n registerMap('中国')\n }\n })\n myChart.on('click', (params: { name: string }) => {\n const flag = chartData.groupByDesc?.some(item => item.colDesc === '医院所在市')\n\n if (adcode === '中国' && flag) {\n registerMap(params.name).then(() => {\n if (myChart && !myChart.isDisposed()) {\n myChart.setOption(areaChartOptions.value)\n }\n })\n }\n })\n }\n}\n// function selectChina() {\n// registerMap(adcode)\n// }\nasync function registerMap(keyword = '中国') {\n if (!myChart \|\| myChart.isDisposed()) {\n return\n }\n\n myChart.showLoading()\n try {\n const geoJson = await getGeoJsonData({ adcode: keyword })\n if (!geoJson) {\n myChart.hideLoading() // 添加加载状态的清除\n return\n }\n currentGeoJson.value = geoJson\n adcode = keyword\n\n const result = echarts.registerMap(keyword, geoJson as any)\n myChart.hideLoading() // 添加加载状态的清除\n return result\n }\n catch (error) {\n console.log(error)\n myChart.hideLoading() // 添加加载状态的清除\n }\n}\nuseCharts({\n chartDOM: dataChartArea,\n chartOptions: areaChartOptions,\n chartData: computed(() => chartData),\n initAfter,\n callback: (chart) => {\n myChart = chart\n },\n})\n</script>\n\n<template>\n <div class=\"data-chart-area-wrap\">\n <!-- <el-select\n v-if=\"isShowSelect\"\n v-model=\"adcode\"\n class=\"city-select\"\n size=\"small\"\n @change=\"selectChina\"\n >\n <el-option\n v-for=\"item in selectList\"\n :key=\"item.value\"\n :label=\"item.label\"\n :value=\"item.value\"\n />\n </el-select> -->\n <div ref=\"dataChartArea\" class=\"data-chart-area\" />\n </div>\n</template>\n\n<style scoped lang=\"scss\">\n.data-chart-area-wrap {\n position: relative;\n\n .city-select {\n position: absolute;\n top: 10px;\n right: 100px;\n z-index: 1;\n width: 120px;\n }\n\n .data-chart-area {\n height: 100%;\n }\n}\n</style>\n"],"names":["merge","inject","InjectionChartMerge","v","adcode","currentGeoJson","ref","features","type","dataChartArea","myChart","areaChartOptions","computed","xGroupByDesc","groupByDesc","colDesc","modelName","data","__props","chartData","allNums","forEach","item","dataItem","push","Number","config","title","text","tooltip","formatter","params","res","name","series","colDescItem","value","includes","visualMap","min","Math","max","map","seriesData","row","find","arr","sourceName","properties","key","chartOptions","async","registerMap","keyword","isDisposed","showLoading","geoJson","getGeoJsonData","hideLoading","result","echarts","error","console","log","useCharts","chartDOM","initAfter","getZr","on","target","flag","some","then","setOption","callback","chart"],"mappings":"~~wqBA~~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"}
1	+ {"version":3,"file":"area.vue2.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/area.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ECharts } from 'echarts/types/dist/echarts'\nimport type { EChartsOption, GeoJson, IFormatPublicData } from '../types'\nimport * as echarts from 'echarts'\nimport { getGeoJsonData } from '../utils/config'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartArea',\n})\n\nconst {\n chartOptions,\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n} = defineProps<{\n chartOptions: EChartsOption\n chartData?: IFormatPublicData\n}>()\n\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\n\nlet adcode = '中国'\nconst currentGeoJson = ref<GeoJson>({\n features: [],\n type: 'FeatureCollection',\n})\nconst dataChartArea = ref(null)\nlet myChart: ECharts \| null = null\n\nconst areaChartOptions = computed<EChartsOption>(() => {\n const { xGroupByDesc, groupByDesc, colDesc, modelName, data } = chartData\n const allNums: number[] = []\n colDesc.forEach((item) => {\n data.forEach((dataItem) => {\n allNums.push(Number(dataItem[item]))\n })\n })\n const config = {\n title: {\n text: modelName,\n },\n tooltip: {\n formatter(params: { name: string }) {\n let res = `${params.name}<br/>`\n config.series?.forEach((colDescItem) => {\n colDescItem.data?.forEach((item) => {\n if (item.name === params.name) {\n res += `${colDescItem.name}：${item.value}</br>`\n }\n })\n if (!res.includes(colDescItem.name)) {\n res += `${colDescItem.name}：-</br>`\n }\n })\n return res\n },\n },\n visualMap: {\n min: Math.min(...allNums, 0),\n max: Math.max(...allNums, 0),\n },\n series: colDesc?.map((colDescItem) => {\n const seriesData = []\n const row = groupByDesc.find(item => item.colDesc === (adcode === '中国' ? '医院所在省' : '医院所在市'))\n // 先用省份数据，如果没有再用市级数据\n\n const arr: {\n [key: string]: number\n } = {}\n data.map((item) => {\n const sourceName = item[(adcode === '中国' ? (xGroupByDesc?.colDesc \|\| '') : row?.colDesc) \|\| '']\n const find = currentGeoJson.value.features?.find(({ properties: { name } }: { properties: { name?: string } }) => name?.includes(sourceName as string))\n return {\n name: find?.properties?.name \|\| '',\n value: Number(item[colDescItem]),\n }\n }).forEach((item) => {\n if (!arr[item.name]) {\n arr[item.name] = item.value\n }\n else {\n arr[item.name] = arr[item.name] + item.value\n }\n })\n for (const key in arr) {\n seriesData.push({\n name: key,\n value: arr[key],\n })\n }\n return {\n name: colDescItem,\n type: 'map',\n map: adcode,\n data: seriesData,\n }\n }),\n }\n\n return merge(config, chartOptions)\n})\n// const propsXgroupByInfos = computed(() => {\n// const { groupByDesc } = chartData\n// const [row] = groupByDesc.filter(item => item.colDesc === '医院所在省')\n// if (row) {\n// return row\n// }\n// else {\n// const [res] = groupByDesc.filter(item => item.colDesc === '医院所在市')\n// return res\n// }\n// })\n// const selectList = computed(() => {\n// let arr = [{ label: '中国', value: '中国' }]\n// if (chartData.groupByDesc.length === 1 && propsXgroupByInfos.value?.colDesc === '医院所在市') {\n// const {\n// data,\n// xGroupByDesc: { colDesc },\n// } = chartData\n// arr = data.map((item) => {\n// return {\n// label: item[colDesc],\n// value: item[colDesc],\n// }\n// })\n// }\n// return arr\n// })\n\n// const isShowSelect = computed(() => {\n// const { groupByDesc } = chartData.value\n// return groupByDesc[0] && groupByDesc[0].colDesc !== '医院所在省' && groupByDesc.length === 1 && selectList.value.length\n// })\n\nasync function initAfter() {\n await registerMap()\n // 添加判断，确保图表实例存在且未被销毁\n if (myChart && !myChart.isDisposed()) {\n // charts 监听事件\n myChart.getZr()?.on('click', (params: { target: HTMLElement }) => {\n if (!params.target && adcode !== '中国') {\n registerMap('中国')\n }\n })\n myChart.on('click', (params: { name: string }) => {\n const flag = chartData.groupByDesc?.some(item => item.colDesc === '医院所在市')\n\n if (adcode === '中国' && flag) {\n registerMap(params.name).then(() => {\n if (myChart && !myChart.isDisposed()) {\n myChart.setOption(areaChartOptions.value)\n }\n })\n }\n })\n }\n}\n// function selectChina() {\n// registerMap(adcode)\n// }\nasync function registerMap(keyword = '中国') {\n if (!myChart \|\| myChart.isDisposed()) {\n return\n }\n\n myChart.showLoading()\n try {\n const geoJson = await getGeoJsonData({ adcode: keyword })\n if (!geoJson) {\n myChart.hideLoading() // 添加加载状态的清除\n return\n }\n currentGeoJson.value = geoJson\n adcode = keyword\n\n const result = echarts.registerMap(keyword, geoJson as any)\n myChart.hideLoading() // 添加加载状态的清除\n return result\n }\n catch (error) {\n console.log(error)\n myChart.hideLoading() // 添加加载状态的清除\n }\n}\nuseCharts({\n chartDOM: dataChartArea,\n chartOptions: areaChartOptions,\n chartData: computed(() => chartData),\n initAfter,\n callback: (chart) => {\n myChart = chart\n },\n})\n</script>\n\n<template>\n <div class=\"data-chart-area-wrap\">\n <!-- <el-select\n v-if=\"isShowSelect\"\n v-model=\"adcode\"\n class=\"city-select\"\n size=\"small\"\n @change=\"selectChina\"\n >\n <el-option\n v-for=\"item in selectList\"\n :key=\"item.value\"\n :label=\"item.label\"\n :value=\"item.value\"\n />\n </el-select> -->\n <div ref=\"dataChartArea\" class=\"data-chart-area\" />\n </div>\n</template>\n\n<style scoped lang=\"scss\">\n.data-chart-area-wrap {\n position: relative;\n\n .city-select {\n position: absolute;\n top: 10px;\n right: 100px;\n z-index: 1;\n width: 120px;\n }\n\n .data-chart-area {\n height: 100%;\n }\n}\n</style>\n"],"names":["merge","inject","InjectionChartMerge","v","adcode","currentGeoJson","ref","features","type","dataChartArea","myChart","areaChartOptions","computed","xGroupByDesc","groupByDesc","colDesc","modelName","data","__props","chartData","allNums","forEach","item","dataItem","push","Number","config","title","text","tooltip","formatter","params","res","name","series","colDescItem","value","includes","visualMap","min","Math","max","map","seriesData","row","find","arr","sourceName","properties","key","chartOptions","async","registerMap","keyword","isDisposed","showLoading","geoJson","getGeoJsonData","hideLoading","result","echarts","error","console","log","useCharts","chartDOM","initAfter","getZr","on","target","flag","some","then","setOption","callback","chart"],"mappings":"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"}

package/es/src/data-chart/src/components/bar.vue.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineComponent as e,createElementBlock as a,openBlock as t}from"vue";import{uniq as s}from"lodash-es";import{InjectionChartMerge as r}from"../utils/injectionKeys.mjs";import{useCharts as o}from"../utils/useCharts.mjs";import{inject as c,ref as l,computed as i}from"vue-demi";var p=e({name:"DataChartBar",__name:"bar",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},subShowType:{type:String,required:!0,default:"bar-simple"},chartOptions:{type:null,required:!0}},setup(e){const p=c(r,(e=>e),!0),u=l(null),n=i((()=>{const{colDesc:a,xGroupByDesc:t,groupByDesc:r,data:o=[],modelName:c}=e.chartData,l=Array.from(new Set(o.map((e=>e[t.colDesc||""]))))||[],i=r.find((e=>!e.xAxis))||{groupByValues:[],colDesc:""};i.groupByValues=s(o.map((e=>i.colDesc?String(e[i.colDesc]):""))),t&&t.groupByValues&&(t.groupByValues=s(o.map((e=>t.colDesc?String(e[t.colDesc]):""))));const u={title:{text:c},xAxis:{name:"",type:"category",axisLabel:{interval:0,formatter:e=>e.length>5?`${e.substring(0,5)}...`:e},data:l},yAxis:{type:"value"},legend:{data:[]},dataZoom:[{type:"inside",disabled:l.length<15}]};if(1===r.length)u.series=a.map((e=>({name:e,data:o.map((a=>a[e])),type:"bar",emphasis:{focus:"series"},label:{show:!0,position:"inside"}}))),u.legend.data=a;else if(2===r.length){const e=a.map((e=>i.groupByValues?.map((a=>{const s={name:`${a||"/"}-${e}`,type:"bar",stack:e,emphasis:{focus:"series"},data:[],label:{show:!0,position:"inside"}};return s.data=(t.groupByValues||[]).map((e=>{let r=null;return o.forEach((o=>{i.colDesc&&o[i.colDesc]===a&&t.colDesc&&o[t.colDesc]===e&&s.stack&&(r=o[s.stack]??null)})),r||""})).filter((e=>""!==e)),s}))||[])).flat();u.series=e,delete u.legend}function n(e,a,t,s){Array.isArray(e)?e.forEach((e=>{e&&(e.type=a,"category"===a&&(e.data=t||[],e.name=s||""))})):e&&(e.type=a,"category"===a&&(e.data=t||[],e.name=s||""))}switch(e.subShowType){case"bar-simple":case"default":n(u.xAxis,"category",l,t.colDesc||""),n(u.yAxis,"value");break;case"bar-y-category":n(u.xAxis,"value"),n(u.yAxis,"category",l,t.colDesc||"")}return p(u,e.chartOptions)}));return o({chartDOM:u,chartOptions:n,chartData:i((()=>e.chartData))}),(e,s)=>(t(),a("div",{ref_key:"dataChartBar",ref:u,class:"data-chart-bar"},null,512))}});export{p as default};
+import{defineComponent as e,inject as a,ref as t,computed as s,createElementBlock as r,openBlock as o}from"vue";import{uniq as c}from"lodash-es";import{InjectionChartMerge as l}from"../utils/injectionKeys.mjs";import{useCharts as i}from"../utils/useCharts.mjs";var p=e({name:"DataChartBar",__name:"bar",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},subShowType:{type:String,required:!0,default:"bar-simple"},chartOptions:{type:null,required:!0}},setup(e){const p=a(l,(e=>e),!0),u=t(null),n=s((()=>{const{colDesc:a,xGroupByDesc:t,groupByDesc:s,data:r=[],modelName:o}=e.chartData,l=Array.from(new Set(r.map((e=>e[t.colDesc||""]))))||[],i=s.find((e=>!e.xAxis))||{groupByValues:[],colDesc:""};i.groupByValues=c(r.map((e=>i.colDesc?String(e[i.colDesc]):""))),t&&t.groupByValues&&(t.groupByValues=c(r.map((e=>t.colDesc?String(e[t.colDesc]):""))));const u={title:{text:o},xAxis:{name:"",type:"category",axisLabel:{interval:0,formatter:e=>e.length>5?`${e.substring(0,5)}...`:e},data:l},yAxis:{type:"value"},legend:{data:[]},dataZoom:[{type:"inside",disabled:l.length<15}]};if(1===s.length)u.series=a.map((e=>({name:e,data:r.map((a=>a[e])),type:"bar",emphasis:{focus:"series"},label:{show:!0,position:"inside"}}))),u.legend.data=a;else if(2===s.length){const e=a.map((e=>i.groupByValues?.map((a=>{const s={name:`${a||"/"}-${e}`,type:"bar",stack:e,emphasis:{focus:"series"},data:[],label:{show:!0,position:"inside"}};return s.data=(t.groupByValues||[]).map((e=>{let o=null;return r.forEach((r=>{i.colDesc&&r[i.colDesc]===a&&t.colDesc&&r[t.colDesc]===e&&s.stack&&(o=r[s.stack]??null)})),o||""})).filter((e=>""!==e)),s}))||[])).flat();u.series=e,delete u.legend}function n(e,a,t,s){Array.isArray(e)?e.forEach((e=>{e&&(e.type=a,"category"===a&&(e.data=t||[],e.name=s||""))})):e&&(e.type=a,"category"===a&&(e.data=t||[],e.name=s||""))}switch(e.subShowType){case"bar-simple":case"default":n(u.xAxis,"category",l,t.colDesc||""),n(u.yAxis,"value");break;case"bar-y-category":n(u.xAxis,"value"),n(u.yAxis,"category",l,t.colDesc||"")}return p(u,e.chartOptions)}));return i({chartDOM:u,chartOptions:n,chartData:s((()=>e.chartData))}),(e,a)=>(o(),r("div",{ref_key:"dataChartBar",ref:u,class:"data-chart-bar"},null,512))}});export{p as default};
 //# sourceMappingURL=bar.vue.mjs.map

package/es/src/data-chart/src/components/bar.vue.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"bar.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/bar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { LegendComponentOption, XAXisComponentOption, YAXisComponentOption } from 'echarts'\nimport type {\n EChartData,\n EChartsOption,\n IFormatPublicData,\n SeriesOption,\n} from '../types'\nimport { uniq } from 'lodash-es'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\n// 定义组件名称\ndefineOptions({\n name: 'DataChartBar',\n})\n\n// 定义组件属性\nconst {\n chartOptions,\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n subShowType = 'bar-simple',\n} = defineProps<{\n chartData: IFormatPublicData\n subShowType: string\n chartOptions: EChartsOption\n}>()\n\n// 注入合并函数，并明确类型\nconst merge = inject(InjectionChartMerge, (v: any) => v, true) as (config: EChartsOption, chartOptions: EChartsOption) => EChartsOption\nconst dataChartBar = ref<HTMLElement \| null>(null)\n\n// 计算图表选项\nconst barChartOptions = computed<EChartsOption>(() => {\n const { colDesc, xGroupByDesc, groupByDesc, data = [], modelName } = chartData\n\n const axisData = Array.from(new Set(data.map(item => item[xGroupByDesc.colDesc \|\| '']))) \|\| []\n const yGroupByDesc: EChartData['desc']['groupByDesc'][0] = groupByDesc.find(item => !item.xAxis) \|\| {\n groupByDesc: null,\n groupByValues: [],\n colDesc: '',\n xAxis: false,\n }\n\n yGroupByDesc.groupByValues = uniq(data.map(item => yGroupByDesc.colDesc ? String(item[yGroupByDesc.colDesc]) : ''))\n if (xGroupByDesc && xGroupByDesc.groupByValues) {\n xGroupByDesc.groupByValues = uniq(data.map(item => xGroupByDesc.colDesc ? String(item[xGroupByDesc.colDesc]) : ''))\n }\n\n const config: EChartsOption = {\n title: {\n text: modelName,\n },\n xAxis: {\n name: '',\n type: 'category',\n axisLabel: {\n interval: 0, // 强制显示所有标签\n formatter(value: string) {\n const screenshotLength = 5\n return value.length > screenshotLength ? `${value.substring(0, screenshotLength)}...` : value // 截取前5个字符并添加省略号\n },\n },\n data: axisData,\n },\n yAxis: {\n type: 'value',\n },\n legend: {\n data: [],\n },\n dataZoom: [{\n type: 'inside',\n disabled: axisData.length < 15,\n }],\n }\n\n // 堆叠图\n if (groupByDesc.length === 1) {\n config.series = colDesc.map((yItem) => {\n return {\n name: yItem,\n data: data.map(item => item[yItem]),\n type: 'bar',\n emphasis: {\n focus: 'series',\n },\n label: {\n show: true,\n position: 'inside',\n },\n }\n });\n (config.legend as LegendComponentOption).data = colDesc\n }\n else if (groupByDesc.length === 2) {\n const arr = colDesc.map((colDescItem) => {\n return yGroupByDesc.groupByValues?.map((yGroupByDescItem) => {\n const obj: SeriesOption = {\n name: `${yGroupByDescItem \|\| '/'}-${colDescItem}`,\n type: 'bar',\n stack: colDescItem,\n emphasis: {\n focus: 'series',\n },\n data: [],\n label: {\n show: true,\n position: 'inside',\n },\n }\n obj.data = (xGroupByDesc.groupByValues \|\| []).map((xGroupByDescItem) => {\n let targetVal: number \| string \| null = null\n data.forEach((item) => {\n if (yGroupByDesc.colDesc && item[yGroupByDesc.colDesc] === yGroupByDescItem && xGroupByDesc.colDesc && item[xGroupByDesc.colDesc] === xGroupByDescItem) {\n if (obj.stack) {\n targetVal = item[obj.stack] ?? null\n }\n }\n })\n return targetVal \|\| ''\n }).filter(v => v !== '')\n return obj\n }) \|\| []\n }).flat()\n\n config.series = arr\n delete config.legend\n }\n\n // 1. 定义轴类型\n type CategoryAxisOption = XAXisComponentOption & {\n type: 'category'\n data: (string \| number)[]\n }\n\n // 2. 创建配置轴的辅助函数\n function configureAxis(\n axis: XAXisComponentOption \| XAXisComponentOption[] \| YAXisComponentOption \| YAXisComponentOption[] \| undefined,\n type: 'category' \| 'value',\n data?: (string \| number)[],\n name?: string,\n ) {\n if (Array.isArray(axis)) {\n axis.forEach((item) => {\n if (item) {\n item.type = type\n if (type === 'category') {\n (item as CategoryAxisOption).data = data \|\| []\n item.name = name \|\| ''\n }\n }\n })\n }\n else if (axis) {\n axis.type = type\n if (type === 'category') {\n (axis as CategoryAxisOption).data = data \|\| []\n axis.name = name \|\| ''\n }\n }\n }\n\n // 3. 使用配置函数\n switch (subShowType) {\n case 'bar-simple':\n case 'default':\n configureAxis(config.xAxis, 'category', axisData, xGroupByDesc.colDesc \|\| '')\n configureAxis(config.yAxis, 'value')\n break\n\n case 'bar-y-category':\n configureAxis(config.xAxis, 'value')\n configureAxis(config.yAxis, 'category', axisData, xGroupByDesc.colDesc \|\| '')\n break\n }\n\n return merge(config, chartOptions)\n})\n\nuseCharts({ chartDOM: dataChartBar, chartOptions: barChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartBar\" class=\"data-chart-bar\" />\n</template>\n"],"names":["merge","inject","InjectionChartMerge","v","dataChartBar","ref","barChartOptions","computed","colDesc","xGroupByDesc","groupByDesc","data","modelName","__props","chartData","axisData","Array","from","Set","map","item","yGroupByDesc","find","xAxis","groupByValues","uniq","String","config","title","text","name","type","axisLabel","interval","formatter","value","length","substring","yAxis","legend","dataZoom","disabled","series","yItem","emphasis","focus","label","show","position","arr","colDescItem","yGroupByDescItem","obj","stack","xGroupByDescItem","targetVal","forEach","filter","flat","configureAxis","axis","isArray","subShowType","chartOptions","useCharts","chartDOM"],"mappings":"~~4lBAwCA~~,MAAMA,EAAQC,EAAOC,GAAsBC,GAAWA,IAAG,GACnDC,EAAeC,EAAwB,MAGvCC,EAAkBC,GAAwB,KACxC,MAAAC,QAAEA,eAASC,EAAcC,YAAAA,EAAAC,KAAaA,EAAO,GAACC,UAAGA,GAAcC,EAAAC,UAE/DC,EAAWC,MAAMC,KAAK,IAAIC,IAAIP,EAAKQ,KAAIC,GAAQA,EAAKX,EAAaD,SAAW,SAAU,GACtFa,EAAqDX,EAAYY,UAAcF,EAAKG,SAAU,CAElGC,cAAe,GACfhB,QAAS,IAIXa,EAAaG,cAAgBC,EAAKd,EAAKQ,QAAYE,EAAab,QAAUkB,OAAON,EAAKC,EAAab,UAAY,MAC3GC,GAAgBA,EAAae,gBAC/Bf,EAAae,cAAgBC,EAAKd,EAAKQ,QAAYV,EAAaD,QAAUkB,OAAON,EAAKX,EAAaD,UAAY,OAGjH,MAAMmB,EAAwB,CAC5BC,MAAO,CACLC,KAAMjB,GAERW,MAAO,CACLO,KAAM,GACNC,KAAM,WACNC,UAAW,CACTC,SAAU,EACVC,UAAUC,GAEDA,EAAMC,OADY,EACgB,GAAGD,EAAME,UAAU,EADnC,QAC+DF,GAG5FxB,KAAMI,GAERuB,MAAO,CACLP,KAAM,SAERQ,OAAQ,CACN5B,KAAM,IAER6B,SAAU,CAAC,CACTT,KAAM,SACNU,SAAU1B,EAASqB,OAAS,MAK5B,GAAuB,IAAvB1B,EAAY0B,OACdT,EAAOe,OAASlC,EAAQW,KAAKwB,IACpB,CACLb,KAAMa,EACNhC,KAAMA,EAAKQ,KAAYC,GAAAA,EAAKuB,KAC5BZ,KAAM,MACNa,SAAU,CACRC,MAAO,UAETC,MAAO,CACLC,MAAM,EACNC,SAAU,cAIfrB,EAAOY,OAAiC5B,KAAOH,OAClD,GACgC,IAAvBE,EAAY0B,OAAc,CACjC,MAAMa,EAAMzC,EAAQW,KAAK+B,GAChB7B,EAAaG,eAAeL,KAAKgC,IACtC,MAAMC,EAAoB,CACxBtB,KAAM,GAAGqB,GAAoB,OAAOD,IACpCnB,KAAM,MACNsB,MAAOH,EACPN,SAAU,CACRC,MAAO,UAETlC,KAAM,GACNmC,MAAO,CACLC,MAAM,EACNC,SAAU,WAcP,OAXPI,EAAIzC,MAAQF,EAAae,eAAiB,IAAIL,KAAKmC,IACjD,IAAIC,EAAoC,KAQxC,OAPK5C,EAAA6C,SAASpC,IACRC,EAAab,SAAWY,EAAKC,EAAab,WAAa2C,GAAoB1C,EAAaD,SAAWY,EAAKX,EAAaD,WAAa8C,GAChIF,EAAIC,QACME,EAAAnC,EAAKgC,EAAIC,QAAU,KACjC,IAGGE,GAAa,EAAA,IACnBE,QAAOtD,GAAW,KAANA,IACRiD,CAAA,KACH,KACLM,OAEH/B,EAAOe,OAASO,SACTtB,EAAOY,MAAA,CAUhB,SAASoB,EACPC,EACA7B,EACApB,EACAmB,GAEId,MAAM6C,QAAQD,GACXA,EAAAJ,SAASpC,IACRA,IACFA,EAAKW,KAAOA,EACC,aAATA,IACDX,EAA4BT,KAAOA,GAAQ,GAC5CS,EAAKU,KAAOA,GAAQ,IACtB,IAIG8B,IACPA,EAAK7B,KAAOA,EACC,aAATA,IACD6B,EAA4BjD,KAAOA,GAAQ,GAC5CiD,EAAK9B,KAAOA,GAAQ,IAExB,CAIF,OAAQjB,EAAWiD,aACjB,IAAK,aACL,IAAK,UACHH,EAAchC,EAAOJ,MAAO,WAAYR,EAAUN,EAAaD,SAAW,IAC5DmD,EAAAhC,EAAOW,MAAO,SAC5B,MAEF,IAAK,iBACWqB,EAAAhC,EAAOJ,MAAO,SAC5BoC,EAAchC,EAAOW,MAAO,WAAYvB,EAAUN,EAAaD,SAAW,IAIvE,OAAAR,EAAM2B,EAAQd,EAAYkD,aAAA,WAGzBC,EAAA,CAAEC,SAAU7D,EAAc2D,aAAczD,EAAiBQ,UAAWP,GAAS,IAAMM,EAAAC"}
1	+ {"version":3,"file":"bar.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/bar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { LegendComponentOption, XAXisComponentOption, YAXisComponentOption } from 'echarts'\nimport type {\n EChartData,\n EChartsOption,\n IFormatPublicData,\n SeriesOption,\n} from '../types'\nimport { uniq } from 'lodash-es'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\n// 定义组件名称\ndefineOptions({\n name: 'DataChartBar',\n})\n\n// 定义组件属性\nconst {\n chartOptions,\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n subShowType = 'bar-simple',\n} = defineProps<{\n chartData: IFormatPublicData\n subShowType: string\n chartOptions: EChartsOption\n}>()\n\n// 注入合并函数，并明确类型\nconst merge = inject(InjectionChartMerge, (v: any) => v, true) as (config: EChartsOption, chartOptions: EChartsOption) => EChartsOption\nconst dataChartBar = ref<HTMLElement \| null>(null)\n\n// 计算图表选项\nconst barChartOptions = computed<EChartsOption>(() => {\n const { colDesc, xGroupByDesc, groupByDesc, data = [], modelName } = chartData\n\n const axisData = Array.from(new Set(data.map(item => item[xGroupByDesc.colDesc \|\| '']))) \|\| []\n const yGroupByDesc: EChartData['desc']['groupByDesc'][0] = groupByDesc.find(item => !item.xAxis) \|\| {\n groupByDesc: null,\n groupByValues: [],\n colDesc: '',\n xAxis: false,\n }\n\n yGroupByDesc.groupByValues = uniq(data.map(item => yGroupByDesc.colDesc ? String(item[yGroupByDesc.colDesc]) : ''))\n if (xGroupByDesc && xGroupByDesc.groupByValues) {\n xGroupByDesc.groupByValues = uniq(data.map(item => xGroupByDesc.colDesc ? String(item[xGroupByDesc.colDesc]) : ''))\n }\n\n const config: EChartsOption = {\n title: {\n text: modelName,\n },\n xAxis: {\n name: '',\n type: 'category',\n axisLabel: {\n interval: 0, // 强制显示所有标签\n formatter(value: string) {\n const screenshotLength = 5\n return value.length > screenshotLength ? `${value.substring(0, screenshotLength)}...` : value // 截取前5个字符并添加省略号\n },\n },\n data: axisData,\n },\n yAxis: {\n type: 'value',\n },\n legend: {\n data: [],\n },\n dataZoom: [{\n type: 'inside',\n disabled: axisData.length < 15,\n }],\n }\n\n // 堆叠图\n if (groupByDesc.length === 1) {\n config.series = colDesc.map((yItem) => {\n return {\n name: yItem,\n data: data.map(item => item[yItem]),\n type: 'bar',\n emphasis: {\n focus: 'series',\n },\n label: {\n show: true,\n position: 'inside',\n },\n }\n });\n (config.legend as LegendComponentOption).data = colDesc\n }\n else if (groupByDesc.length === 2) {\n const arr = colDesc.map((colDescItem) => {\n return yGroupByDesc.groupByValues?.map((yGroupByDescItem) => {\n const obj: SeriesOption = {\n name: `${yGroupByDescItem \|\| '/'}-${colDescItem}`,\n type: 'bar',\n stack: colDescItem,\n emphasis: {\n focus: 'series',\n },\n data: [],\n label: {\n show: true,\n position: 'inside',\n },\n }\n obj.data = (xGroupByDesc.groupByValues \|\| []).map((xGroupByDescItem) => {\n let targetVal: number \| string \| null = null\n data.forEach((item) => {\n if (yGroupByDesc.colDesc && item[yGroupByDesc.colDesc] === yGroupByDescItem && xGroupByDesc.colDesc && item[xGroupByDesc.colDesc] === xGroupByDescItem) {\n if (obj.stack) {\n targetVal = item[obj.stack] ?? null\n }\n }\n })\n return targetVal \|\| ''\n }).filter(v => v !== '')\n return obj\n }) \|\| []\n }).flat()\n\n config.series = arr\n delete config.legend\n }\n\n // 1. 定义轴类型\n type CategoryAxisOption = XAXisComponentOption & {\n type: 'category'\n data: (string \| number)[]\n }\n\n // 2. 创建配置轴的辅助函数\n function configureAxis(\n axis: XAXisComponentOption \| XAXisComponentOption[] \| YAXisComponentOption \| YAXisComponentOption[] \| undefined,\n type: 'category' \| 'value',\n data?: (string \| number)[],\n name?: string,\n ) {\n if (Array.isArray(axis)) {\n axis.forEach((item) => {\n if (item) {\n item.type = type\n if (type === 'category') {\n (item as CategoryAxisOption).data = data \|\| []\n item.name = name \|\| ''\n }\n }\n })\n }\n else if (axis) {\n axis.type = type\n if (type === 'category') {\n (axis as CategoryAxisOption).data = data \|\| []\n axis.name = name \|\| ''\n }\n }\n }\n\n // 3. 使用配置函数\n switch (subShowType) {\n case 'bar-simple':\n case 'default':\n configureAxis(config.xAxis, 'category', axisData, xGroupByDesc.colDesc \|\| '')\n configureAxis(config.yAxis, 'value')\n break\n\n case 'bar-y-category':\n configureAxis(config.xAxis, 'value')\n configureAxis(config.yAxis, 'category', axisData, xGroupByDesc.colDesc \|\| '')\n break\n }\n\n return merge(config, chartOptions)\n})\n\nuseCharts({ chartDOM: dataChartBar, chartOptions: barChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartBar\" class=\"data-chart-bar\" />\n</template>\n"],"names":["merge","inject","InjectionChartMerge","v","dataChartBar","ref","barChartOptions","computed","colDesc","xGroupByDesc","groupByDesc","data","modelName","__props","chartData","axisData","Array","from","Set","map","item","yGroupByDesc","find","xAxis","groupByValues","uniq","String","config","title","text","name","type","axisLabel","interval","formatter","value","length","substring","yAxis","legend","dataZoom","disabled","series","yItem","emphasis","focus","label","show","position","arr","colDescItem","yGroupByDescItem","obj","stack","xGroupByDescItem","targetVal","forEach","filter","flat","configureAxis","axis","isArray","subShowType","chartOptions","useCharts","chartDOM"],"mappings":"skBAwCA,MAAMA,EAAQC,EAAOC,GAAsBC,GAAWA,IAAG,GACnDC,EAAeC,EAAwB,MAGvCC,EAAkBC,GAAwB,KACxC,MAAAC,QAAEA,eAASC,EAAcC,YAAAA,EAAAC,KAAaA,EAAO,GAACC,UAAGA,GAAcC,EAAAC,UAE/DC,EAAWC,MAAMC,KAAK,IAAIC,IAAIP,EAAKQ,KAAIC,GAAQA,EAAKX,EAAaD,SAAW,SAAU,GACtFa,EAAqDX,EAAYY,UAAcF,EAAKG,SAAU,CAElGC,cAAe,GACfhB,QAAS,IAIXa,EAAaG,cAAgBC,EAAKd,EAAKQ,QAAYE,EAAab,QAAUkB,OAAON,EAAKC,EAAab,UAAY,MAC3GC,GAAgBA,EAAae,gBAC/Bf,EAAae,cAAgBC,EAAKd,EAAKQ,QAAYV,EAAaD,QAAUkB,OAAON,EAAKX,EAAaD,UAAY,OAGjH,MAAMmB,EAAwB,CAC5BC,MAAO,CACLC,KAAMjB,GAERW,MAAO,CACLO,KAAM,GACNC,KAAM,WACNC,UAAW,CACTC,SAAU,EACVC,UAAUC,GAEDA,EAAMC,OADY,EACgB,GAAGD,EAAME,UAAU,EADnC,QAC+DF,GAG5FxB,KAAMI,GAERuB,MAAO,CACLP,KAAM,SAERQ,OAAQ,CACN5B,KAAM,IAER6B,SAAU,CAAC,CACTT,KAAM,SACNU,SAAU1B,EAASqB,OAAS,MAK5B,GAAuB,IAAvB1B,EAAY0B,OACdT,EAAOe,OAASlC,EAAQW,KAAKwB,IACpB,CACLb,KAAMa,EACNhC,KAAMA,EAAKQ,KAAYC,GAAAA,EAAKuB,KAC5BZ,KAAM,MACNa,SAAU,CACRC,MAAO,UAETC,MAAO,CACLC,MAAM,EACNC,SAAU,cAIfrB,EAAOY,OAAiC5B,KAAOH,OAClD,GACgC,IAAvBE,EAAY0B,OAAc,CACjC,MAAMa,EAAMzC,EAAQW,KAAK+B,GAChB7B,EAAaG,eAAeL,KAAKgC,IACtC,MAAMC,EAAoB,CACxBtB,KAAM,GAAGqB,GAAoB,OAAOD,IACpCnB,KAAM,MACNsB,MAAOH,EACPN,SAAU,CACRC,MAAO,UAETlC,KAAM,GACNmC,MAAO,CACLC,MAAM,EACNC,SAAU,WAcP,OAXPI,EAAIzC,MAAQF,EAAae,eAAiB,IAAIL,KAAKmC,IACjD,IAAIC,EAAoC,KAQxC,OAPK5C,EAAA6C,SAASpC,IACRC,EAAab,SAAWY,EAAKC,EAAab,WAAa2C,GAAoB1C,EAAaD,SAAWY,EAAKX,EAAaD,WAAa8C,GAChIF,EAAIC,QACME,EAAAnC,EAAKgC,EAAIC,QAAU,KACjC,IAGGE,GAAa,EAAA,IACnBE,QAAOtD,GAAW,KAANA,IACRiD,CAAA,KACH,KACLM,OAEH/B,EAAOe,OAASO,SACTtB,EAAOY,MAAA,CAUhB,SAASoB,EACPC,EACA7B,EACApB,EACAmB,GAEId,MAAM6C,QAAQD,GACXA,EAAAJ,SAASpC,IACRA,IACFA,EAAKW,KAAOA,EACC,aAATA,IACDX,EAA4BT,KAAOA,GAAQ,GAC5CS,EAAKU,KAAOA,GAAQ,IACtB,IAIG8B,IACPA,EAAK7B,KAAOA,EACC,aAATA,IACD6B,EAA4BjD,KAAOA,GAAQ,GAC5CiD,EAAK9B,KAAOA,GAAQ,IAExB,CAIF,OAAQjB,EAAWiD,aACjB,IAAK,aACL,IAAK,UACHH,EAAchC,EAAOJ,MAAO,WAAYR,EAAUN,EAAaD,SAAW,IAC5DmD,EAAAhC,EAAOW,MAAO,SAC5B,MAEF,IAAK,iBACWqB,EAAAhC,EAAOJ,MAAO,SAC5BoC,EAAchC,EAAOW,MAAO,WAAYvB,EAAUN,EAAaD,SAAW,IAIvE,OAAAR,EAAM2B,EAAQd,EAAYkD,aAAA,WAGzBC,EAAA,CAAEC,SAAU7D,EAAc2D,aAAczD,EAAiBQ,UAAWP,GAAS,IAAMM,EAAAC"}

package/es/src/data-chart/src/components/funnel.vue.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineComponent as e,createElementBlock as t,openBlock as a}from"vue";import{InjectionChartMerge as r}from"../utils/injectionKeys.mjs";import{useCharts as l}from"../utils/useCharts.mjs";import{ref as s,inject as o,computed as n}from"vue-demi";var c=e({name:"DataChartFunnel",__name:"funnel",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},chartOptions:{type:null,required:!0}},setup(e){const c=s(),i=o(r,(e=>e),!0),u=n((()=>{const{colDesc:t,xGroupByDesc:a,modelName:r,data:l}=e.chartData,s={title:{text:r},legend:{},series:t.map((e=>({name:e,type:"funnel",left:"10%",width:"80%",label:{formatter:"{c}"},labelLine:{show:!1},itemStyle:{opacity:.7},emphasis:{label:{position:"inside",formatter:`{b}${e}: {c}`}},data:l.map((t=>({name:t[a?.colDesc||""],value:t[e]})))})))};return 1!==t.length&&(s.legend.data=t),i(s,e.chartOptions)}));return l({chartDOM:c,chartOptions:u,chartData:n((()=>e.chartData))}),(e,r)=>(a(),t("div",{ref_key:"dataChartFunnel",ref:c,class:"data-chart-funnel"},null,512))}});export{c as default};
+import{defineComponent as e,ref as t,inject as a,computed as r,createElementBlock as l,openBlock as s}from"vue";import{InjectionChartMerge as n}from"../utils/injectionKeys.mjs";import{useCharts as o}from"../utils/useCharts.mjs";var c=e({name:"DataChartFunnel",__name:"funnel",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},chartOptions:{type:null,required:!0}},setup(e){const c=t(),i=a(n,(e=>e),!0),u=r((()=>{const{colDesc:t,xGroupByDesc:a,modelName:r,data:l}=e.chartData,s={title:{text:r},legend:{},series:t.map((e=>({name:e,type:"funnel",left:"10%",width:"80%",label:{formatter:"{c}"},labelLine:{show:!1},itemStyle:{opacity:.7},emphasis:{label:{position:"inside",formatter:`{b}${e}: {c}`}},data:l.map((t=>({name:t[a?.colDesc||""],value:t[e]})))})))};return 1!==t.length&&(s.legend.data=t),i(s,e.chartOptions)}));return o({chartDOM:c,chartOptions:u,chartData:r((()=>e.chartData))}),(e,t)=>(s(),l("div",{ref_key:"dataChartFunnel",ref:c,class:"data-chart-funnel"},null,512))}});export{c as default};
 //# sourceMappingURL=funnel.vue.mjs.map

package/es/src/data-chart/src/components/funnel.vue.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"funnel.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/funnel.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { LegendOption } from 'echarts/types/dist/shared'\nimport type { EChartsOption, IFormatPublicData } from '../types'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartFunnel',\n})\nconst {\n chartOptions,\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n} = defineProps<{\n chartData: IFormatPublicData\n chartOptions: EChartsOption\n}>()\nconst dataChartFunnel = ref()\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\nconst funnelChartOptions = computed<EChartsOption>(() => {\n const { colDesc, xGroupByDesc, modelName, data } = chartData\n\n const config = {\n title: {\n text: modelName,\n },\n legend: {},\n series: colDesc.map((item) => {\n return {\n name: item,\n type: 'funnel',\n left: '10%',\n width: '80%',\n label: {\n formatter: '{c}',\n },\n labelLine: {\n show: false,\n },\n itemStyle: {\n opacity: 0.7,\n },\n emphasis: {\n label: {\n position: 'inside',\n formatter: `{b}${item}: {c}`,\n },\n },\n data: data.map(yItem => ({\n name: yItem[xGroupByDesc?.colDesc \|\| ''],\n value: yItem[item],\n })),\n }\n }),\n }\n if (colDesc.length !== 1) {\n (config.legend as LegendOption).data = colDesc\n }\n return merge(config, chartOptions)\n})\nuseCharts({ chartDOM: dataChartFunnel, chartOptions: funnelChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartFunnel\" class=\"data-chart-funnel\" />\n</template>\n"],"names":["dataChartFunnel","ref","merge","inject","InjectionChartMerge","v","funnelChartOptions","computed","colDesc","xGroupByDesc","modelName","data","__props","chartData","config","title","text","legend","series","map","item","name","type","left","width","label","formatter","labelLine","show","itemStyle","opacity","emphasis","position","yItem","value","length","chartOptions","useCharts","chartDOM"],"mappings":"~~sgBA2BA~~,MAAMA,EAAkBC,IAClBC,EAAQC,EAAOC,GAAsBC,GAAWA,IAAG,GACnDC,EAAqBC,GAAwB,KACjD,MAAMC,QAAEA,EAASC,aAAAA,EAAAC,UAAcA,EAAWC,KAAAA,GAASC,EAAAC,UAE7CC,EAAS,CACbC,MAAO,CACLC,KAAMN,GAERO,OAAQ,CAAC,EACTC,OAAQV,EAAQW,KAAKC,IACZ,CACLC,KAAMD,EACNE,KAAM,SACNC,KAAM,MACNC,MAAO,MACPC,MAAO,CACLC,UAAW,OAEbC,UAAW,CACTC,MAAM,GAERC,UAAW,CACTC,QAAS,IAEXC,SAAU,CACRN,MAAO,CACLO,SAAU,SACVN,UAAW,MAAMN,WAGrBT,KAAMA,EAAKQ,KAAcc,IAAA,CACvBZ,KAAMY,EAAMxB,GAAcD,SAAW,IACrC0B,MAAOD,EAAMb,YAQd,OAHgB,IAAnBZ,EAAQ2B,SACTrB,EAAOG,OAAwBN,KAAOH,GAElCN,EAAMY,EAAQF,EAAYwB,aAAA,WAEzBC,EAAA,CAAEC,SAAUtC,EAAiBoC,aAAc9B,EAAoBO,UAAWN,GAAS,IAAMK,EAAAC"}
1	+ {"version":3,"file":"funnel.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/funnel.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { LegendOption } from 'echarts/types/dist/shared'\nimport type { EChartsOption, IFormatPublicData } from '../types'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartFunnel',\n})\nconst {\n chartOptions,\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n} = defineProps<{\n chartData: IFormatPublicData\n chartOptions: EChartsOption\n}>()\nconst dataChartFunnel = ref()\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\nconst funnelChartOptions = computed<EChartsOption>(() => {\n const { colDesc, xGroupByDesc, modelName, data } = chartData\n\n const config = {\n title: {\n text: modelName,\n },\n legend: {},\n series: colDesc.map((item) => {\n return {\n name: item,\n type: 'funnel',\n left: '10%',\n width: '80%',\n label: {\n formatter: '{c}',\n },\n labelLine: {\n show: false,\n },\n itemStyle: {\n opacity: 0.7,\n },\n emphasis: {\n label: {\n position: 'inside',\n formatter: `{b}${item}: {c}`,\n },\n },\n data: data.map(yItem => ({\n name: yItem[xGroupByDesc?.colDesc \|\| ''],\n value: yItem[item],\n })),\n }\n }),\n }\n if (colDesc.length !== 1) {\n (config.legend as LegendOption).data = colDesc\n }\n return merge(config, chartOptions)\n})\nuseCharts({ chartDOM: dataChartFunnel, chartOptions: funnelChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartFunnel\" class=\"data-chart-funnel\" />\n</template>\n"],"names":["dataChartFunnel","ref","merge","inject","InjectionChartMerge","v","funnelChartOptions","computed","colDesc","xGroupByDesc","modelName","data","__props","chartData","config","title","text","legend","series","map","item","name","type","left","width","label","formatter","labelLine","show","itemStyle","opacity","emphasis","position","yItem","value","length","chartOptions","useCharts","chartDOM"],"mappings":"gfA2BA,MAAMA,EAAkBC,IAClBC,EAAQC,EAAOC,GAAsBC,GAAWA,IAAG,GACnDC,EAAqBC,GAAwB,KACjD,MAAMC,QAAEA,EAASC,aAAAA,EAAAC,UAAcA,EAAWC,KAAAA,GAASC,EAAAC,UAE7CC,EAAS,CACbC,MAAO,CACLC,KAAMN,GAERO,OAAQ,CAAC,EACTC,OAAQV,EAAQW,KAAKC,IACZ,CACLC,KAAMD,EACNE,KAAM,SACNC,KAAM,MACNC,MAAO,MACPC,MAAO,CACLC,UAAW,OAEbC,UAAW,CACTC,MAAM,GAERC,UAAW,CACTC,QAAS,IAEXC,SAAU,CACRN,MAAO,CACLO,SAAU,SACVN,UAAW,MAAMN,WAGrBT,KAAMA,EAAKQ,KAAcc,IAAA,CACvBZ,KAAMY,EAAMxB,GAAcD,SAAW,IACrC0B,MAAOD,EAAMb,YAQd,OAHgB,IAAnBZ,EAAQ2B,SACTrB,EAAOG,OAAwBN,KAAOH,GAElCN,EAAMY,EAAQF,EAAYwB,aAAA,WAEzBC,EAAA,CAAEC,SAAUtC,EAAiBoC,aAAc9B,EAAoBO,UAAWN,GAAS,IAAMK,EAAAC"}

package/es/src/data-chart/src/components/line.vue2.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineComponent as e,createElementBlock as a,openBlock as t}from"vue";import{InjectionChartMerge as s}from"../utils/injectionKeys.mjs";import{useCharts as r}from"../utils/useCharts.mjs";import{ref as c,inject as i,computed as n}from"vue-demi";var o=e({name:"DataChartLine",__name:"line",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},subShowType:{type:String,required:!0,default:"line-simple"},chartOptions:{type:null,required:!0}},setup(e){const o=c(),l=i(s,(e=>e),!0),p=15,d="Total";const u=n((()=>{const{colDesc:a,xGroupByDesc:t,groupByDesc:s,data:r,modelName:c}=e.chartData,i=Array.from(new Set(r?.map((e=>e[t?.colDesc||""]))))||[],n=s?.find((e=>!e.xAxis)),o={title:{text:c},legend:{data:[]},xAxis:{name:t?.colDesc||"",data:i},dataZoom:[{type:"inside",disabled:i.length<p}]};if(1===s?.length)o.series=a.map((e=>({name:e,type:"line",data:r.map((a=>a[e]))}))),o.legend.data=a;else if(2===s?.length){const e=[...new Set(r.map((e=>String(e[n?.colDesc||""]))))];o.legend.data=e,o.series=e.map((e=>function(e,a,t,s,r,c){const i=[];return a.forEach((a=>{const n=t.find((t=>t[s?.colDesc]===a&&t[r?.colDesc]===e));n?i.push(n[c[0]]):i.push(0)})),{name:e,type:"line",stack:d,areaStyle:{},data:i}}(e,i,r,t,n,a)))}return o.series=o.series?.map((a=>{const t={...a};switch(e.subShowType){case"line-simple":default:delete t.areaStyle;break;case"area-basic":t.areaStyle={}}return t})),l(o,e.chartOptions)}));return r({chartDOM:o,chartOptions:u,chartData:n((()=>e.chartData))}),(e,s)=>(t(),a("div",{ref_key:"dataChartLine",ref:o,class:"data-chart-line"},null,512))}});export{o as default};
+import{defineComponent as e,ref as a,inject as t,computed as s,createElementBlock as r,openBlock as c}from"vue";import{InjectionChartMerge as n}from"../utils/injectionKeys.mjs";import{useCharts as i}from"../utils/useCharts.mjs";var l=e({name:"DataChartLine",__name:"line",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},subShowType:{type:String,required:!0,default:"line-simple"},chartOptions:{type:null,required:!0}},setup(e){const l=a(),o=t(n,(e=>e),!0),p=15,d="Total";const u=s((()=>{const{colDesc:a,xGroupByDesc:t,groupByDesc:s,data:r,modelName:c}=e.chartData,n=Array.from(new Set(r?.map((e=>e[t?.colDesc||""]))))||[],i=s?.find((e=>!e.xAxis)),l={title:{text:c},legend:{data:[]},xAxis:{name:t?.colDesc||"",data:n},dataZoom:[{type:"inside",disabled:n.length<p}]};if(1===s?.length)l.series=a.map((e=>({name:e,type:"line",data:r.map((a=>a[e]))}))),l.legend.data=a;else if(2===s?.length){const e=[...new Set(r.map((e=>String(e[i?.colDesc||""]))))];l.legend.data=e,l.series=e.map((e=>function(e,a,t,s,r,c){const n=[];return a.forEach((a=>{const i=t.find((t=>t[s?.colDesc]===a&&t[r?.colDesc]===e));i?n.push(i[c[0]]):n.push(0)})),{name:e,type:"line",stack:d,areaStyle:{},data:n}}(e,n,r,t,i,a)))}return l.series=l.series?.map((a=>{const t={...a};switch(e.subShowType){case"line-simple":default:delete t.areaStyle;break;case"area-basic":t.areaStyle={}}return t})),o(l,e.chartOptions)}));return i({chartDOM:l,chartOptions:u,chartData:s((()=>e.chartData))}),(e,a)=>(c(),r("div",{ref_key:"dataChartLine",ref:l,class:"data-chart-line"},null,512))}});export{l as default};
 //# sourceMappingURL=line.vue2.mjs.map

package/es/src/data-chart/src/components/line.vue2.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"line.vue2.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/line.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { LegendComponentOption } from 'echarts'\nimport type { EChartsOption, IFormatPublicData } from '../types'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartLine',\n})\nconst {\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n subShowType = 'line-simple',\n chartOptions,\n} = defineProps<{\n chartData: IFormatPublicData\n subShowType: string\n chartOptions: EChartsOption\n}>()\nconst dataChartLine = ref()\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\n\n// 抽取类型定义\ninterface SeriesItem {\n name: string\n type: 'line'\n stack?: string\n areaStyle?: Record<string, any>\n data: Array<string \| number>\n}\n\n// 将配置提取为常量\nconst CHART_CONSTANTS = {\n MIN_ZOOM_LENGTH: 15,\n STACK_NAME: 'Total',\n} as const\n\n// 提取处理图表系列数据的函数\nfunction processSeriesData(legendDataItem: string,\n xAxisData: (string \| number)[],\n data: any[],\n xGroupByDesc: any,\n yGroupByDesc: any,\n colDesc: string[]): SeriesItem {\n const seriesData: (string \| number)[] = []\n\n xAxisData.forEach((xAxisItem) => {\n const targetData = data\n .find(dataItem =>\n dataItem[xGroupByDesc?.colDesc] === xAxisItem\n && dataItem[yGroupByDesc?.colDesc] === legendDataItem,\n )\n\n if (targetData) {\n seriesData.push(targetData[colDesc[0]])\n }\n else {\n seriesData.push(0) // 或者其他默认值\n }\n })\n\n return {\n name: legendDataItem,\n type: 'line',\n stack: CHART_CONSTANTS.STACK_NAME,\n areaStyle: {},\n data: seriesData,\n }\n}\n\nconst lineChartOptions = computed<EChartsOption>(() => {\n const { colDesc, xGroupByDesc, groupByDesc, data, modelName } = chartData\n const xAxisData = Array.from(new Set(data?.map(item => item[xGroupByDesc?.colDesc \|\| '']))) \|\| []\n const yGroupByDesc = groupByDesc?.find(item => !item.xAxis)\n\n const config: EChartsOption & { series?: SeriesItem[] } = {\n title: { text: modelName },\n legend: { data: [] },\n xAxis: {\n name: xGroupByDesc?.colDesc \|\| '',\n data: xAxisData,\n },\n dataZoom: [{\n type: 'inside',\n disabled: xAxisData.length < CHART_CONSTANTS.MIN_ZOOM_LENGTH,\n }],\n }\n\n // 处理系列数据\n if (groupByDesc?.length === 1) {\n config.series = colDesc.map(yItem => ({\n name: yItem,\n type: 'line',\n data: data.map(item => item[yItem]),\n }));\n (config.legend as LegendComponentOption).data = colDesc\n }\n else if (groupByDesc?.length === 2) {\n const legendData = [...new Set(data.map(item => String(item[yGroupByDesc?.colDesc \|\| ''])))]\n ;(config.legend as LegendComponentOption).data = legendData\n\n config.series = legendData.map(legendDataItem =>\n processSeriesData(legendDataItem, xAxisData, data, xGroupByDesc, yGroupByDesc, colDesc),\n )\n }\n\n // 处理图表展示类型\n config.series = config.series?.map((item) => {\n const seriesItem = { ...item }\n\n switch (subShowType) {\n case 'line-simple':\n delete seriesItem.areaStyle\n break\n case 'area-basic':\n seriesItem.areaStyle = {}\n break\n default:\n delete seriesItem.areaStyle\n }\n\n return seriesItem\n })\n\n return merge(config, chartOptions)\n})\nuseCharts({ chartDOM: dataChartLine, chartOptions: lineChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartLine\" class=\"data-chart-line\" />\n</template>\n\n<style scoped lang=\"scss\">\n.data-chart-line {\n width: 100%;\n height: 100%;\n}\n</style>\n"],"names":["dataChartLine","ref","merge","inject","InjectionChartMerge","v","CHART_CONSTANTS","lineChartOptions","computed","colDesc","xGroupByDesc","groupByDesc","data","modelName","__props","chartData","xAxisData","Array","from","Set","map","item","yGroupByDesc","find","xAxis","config","title","text","legend","name","dataZoom","type","disabled","length","series","yItem","legendData","String","legendDataItem","seriesData","forEach","xAxisItem","targetData","dataItem","push","stack","areaStyle","processSeriesData","seriesItem","subShowType","chartOptions","useCharts","chartDOM"],"mappings":"~~8jBA6BA~~,MAAMA,EAAgBC,IAChBC,EAAQC,EAAOC,GAAsBC,GAAWA,IAAG,GAYnDC,EACa,GADbA,EAEQ,QAoCR,MAAAC,EAAmBC,GAAwB,KAC/C,MAAMC,QAAEA,EAASC,aAAAA,EAAAC,YAAcA,OAAaC,EAAMC,UAAAA,GAAcC,EAAAC,UAC1DC,EAAYC,MAAMC,KAAK,IAAIC,IAAIP,GAAMQ,KAAIC,GAAQA,EAAKX,GAAcD,SAAW,SAAU,GACzFa,EAAeX,GAAaY,MAAaF,IAACA,EAAKG,QAE/CC,EAAoD,CACxDC,MAAO,CAAEC,KAAMd,GACfe,OAAQ,CAAEhB,KAAM,IAChBY,MAAO,CACLK,KAAMnB,GAAcD,SAAW,GAC/BG,KAAMI,GAERc,SAAU,CAAC,CACTC,KAAM,SACNC,SAAUhB,EAAUiB,OAAS3B,KAK7B,GAAwB,IAAxBK,GAAasB,OACRR,EAAAS,OAASzB,EAAQW,KAAce,IAAA,CACpCN,KAAMM,EACNJ,KAAM,OACNnB,KAAMA,EAAKQ,KAAYC,GAAAA,EAAKc,SAE7BV,EAAOG,OAAiChB,KAAOH,OAClD,GACiC,IAAxBE,GAAasB,OAAc,CAClC,MAAMG,EAAa,IAAI,IAAIjB,IAAIP,EAAKQ,KAAIC,GAAQgB,OAAOhB,EAAKC,GAAcb,SAAW,SACnFgB,EAAOG,OAAiChB,KAAOwB,EAEjDX,EAAOS,OAASE,EAAWhB,QA/D/B,SAA2BkB,EACzBtB,EACAJ,EACAF,EACAY,EACAb,GACA,MAAM8B,EAAkC,GAiBjC,OAfGvB,EAAAwB,SAASC,IACjB,MAAMC,EAAa9B,EAChBW,MAAKoB,GACJA,EAASjC,GAAcD,WAAagC,GACjCE,EAASrB,GAAcb,WAAa6B,IAGvCI,EACFH,EAAWK,KAAKF,EAAWjC,EAAQ,KAGnC8B,EAAWK,KAAK,EAAC,IAId,CACLf,KAAMS,EACNP,KAAM,OACNc,MAAOvC,EACPwC,UAAW,CAAC,EACZlC,KAAM2B,EACR,CAmCIQ,CAAkBT,EAAgBtB,EAAWJ,EAAMF,EAAcY,EAAcb,IACjF,CAqBK,OAjBPgB,EAAOS,OAAST,EAAOS,QAAQd,KAAKC,IAC5B,MAAA2B,EAAa,IAAK3B,GAExB,OAAQP,EAAAmC,aACN,IAAK,cAML,eACSD,EAAWF,gBAJpB,IAAK,aACHE,EAAWF,UAAY,CAAC,EAMrB,OAAAE,CAAA,IAGF9C,EAAMuB,EAAQX,EAAYoC,aAAA,WAEzBC,EAAA,CAAEC,SAAUpD,EAAekD,aAAc3C,EAAkBQ,UAAWP,GAAS,IAAMM,EAAAC"}
1	+ {"version":3,"file":"line.vue2.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/line.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { LegendComponentOption } from 'echarts'\nimport type { EChartsOption, IFormatPublicData } from '../types'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartLine',\n})\nconst {\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n subShowType = 'line-simple',\n chartOptions,\n} = defineProps<{\n chartData: IFormatPublicData\n subShowType: string\n chartOptions: EChartsOption\n}>()\nconst dataChartLine = ref()\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\n\n// 抽取类型定义\ninterface SeriesItem {\n name: string\n type: 'line'\n stack?: string\n areaStyle?: Record<string, any>\n data: Array<string \| number>\n}\n\n// 将配置提取为常量\nconst CHART_CONSTANTS = {\n MIN_ZOOM_LENGTH: 15,\n STACK_NAME: 'Total',\n} as const\n\n// 提取处理图表系列数据的函数\nfunction processSeriesData(legendDataItem: string,\n xAxisData: (string \| number)[],\n data: any[],\n xGroupByDesc: any,\n yGroupByDesc: any,\n colDesc: string[]): SeriesItem {\n const seriesData: (string \| number)[] = []\n\n xAxisData.forEach((xAxisItem) => {\n const targetData = data\n .find(dataItem =>\n dataItem[xGroupByDesc?.colDesc] === xAxisItem\n && dataItem[yGroupByDesc?.colDesc] === legendDataItem,\n )\n\n if (targetData) {\n seriesData.push(targetData[colDesc[0]])\n }\n else {\n seriesData.push(0) // 或者其他默认值\n }\n })\n\n return {\n name: legendDataItem,\n type: 'line',\n stack: CHART_CONSTANTS.STACK_NAME,\n areaStyle: {},\n data: seriesData,\n }\n}\n\nconst lineChartOptions = computed<EChartsOption>(() => {\n const { colDesc, xGroupByDesc, groupByDesc, data, modelName } = chartData\n const xAxisData = Array.from(new Set(data?.map(item => item[xGroupByDesc?.colDesc \|\| '']))) \|\| []\n const yGroupByDesc = groupByDesc?.find(item => !item.xAxis)\n\n const config: EChartsOption & { series?: SeriesItem[] } = {\n title: { text: modelName },\n legend: { data: [] },\n xAxis: {\n name: xGroupByDesc?.colDesc \|\| '',\n data: xAxisData,\n },\n dataZoom: [{\n type: 'inside',\n disabled: xAxisData.length < CHART_CONSTANTS.MIN_ZOOM_LENGTH,\n }],\n }\n\n // 处理系列数据\n if (groupByDesc?.length === 1) {\n config.series = colDesc.map(yItem => ({\n name: yItem,\n type: 'line',\n data: data.map(item => item[yItem]),\n }));\n (config.legend as LegendComponentOption).data = colDesc\n }\n else if (groupByDesc?.length === 2) {\n const legendData = [...new Set(data.map(item => String(item[yGroupByDesc?.colDesc \|\| ''])))]\n ;(config.legend as LegendComponentOption).data = legendData\n\n config.series = legendData.map(legendDataItem =>\n processSeriesData(legendDataItem, xAxisData, data, xGroupByDesc, yGroupByDesc, colDesc),\n )\n }\n\n // 处理图表展示类型\n config.series = config.series?.map((item) => {\n const seriesItem = { ...item }\n\n switch (subShowType) {\n case 'line-simple':\n delete seriesItem.areaStyle\n break\n case 'area-basic':\n seriesItem.areaStyle = {}\n break\n default:\n delete seriesItem.areaStyle\n }\n\n return seriesItem\n })\n\n return merge(config, chartOptions)\n})\nuseCharts({ chartDOM: dataChartLine, chartOptions: lineChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartLine\" class=\"data-chart-line\" />\n</template>\n\n<style scoped lang=\"scss\">\n.data-chart-line {\n width: 100%;\n height: 100%;\n}\n</style>\n"],"names":["dataChartLine","ref","merge","inject","InjectionChartMerge","v","CHART_CONSTANTS","lineChartOptions","computed","colDesc","xGroupByDesc","groupByDesc","data","modelName","__props","chartData","xAxisData","Array","from","Set","map","item","yGroupByDesc","find","xAxis","config","title","text","legend","name","dataZoom","type","disabled","length","series","yItem","legendData","String","legendDataItem","seriesData","forEach","xAxisItem","targetData","dataItem","push","stack","areaStyle","processSeriesData","seriesItem","subShowType","chartOptions","useCharts","chartDOM"],"mappings":"wiBA6BA,MAAMA,EAAgBC,IAChBC,EAAQC,EAAOC,GAAsBC,GAAWA,IAAG,GAYnDC,EACa,GADbA,EAEQ,QAoCR,MAAAC,EAAmBC,GAAwB,KAC/C,MAAMC,QAAEA,EAASC,aAAAA,EAAAC,YAAcA,OAAaC,EAAMC,UAAAA,GAAcC,EAAAC,UAC1DC,EAAYC,MAAMC,KAAK,IAAIC,IAAIP,GAAMQ,KAAIC,GAAQA,EAAKX,GAAcD,SAAW,SAAU,GACzFa,EAAeX,GAAaY,MAAaF,IAACA,EAAKG,QAE/CC,EAAoD,CACxDC,MAAO,CAAEC,KAAMd,GACfe,OAAQ,CAAEhB,KAAM,IAChBY,MAAO,CACLK,KAAMnB,GAAcD,SAAW,GAC/BG,KAAMI,GAERc,SAAU,CAAC,CACTC,KAAM,SACNC,SAAUhB,EAAUiB,OAAS3B,KAK7B,GAAwB,IAAxBK,GAAasB,OACRR,EAAAS,OAASzB,EAAQW,KAAce,IAAA,CACpCN,KAAMM,EACNJ,KAAM,OACNnB,KAAMA,EAAKQ,KAAYC,GAAAA,EAAKc,SAE7BV,EAAOG,OAAiChB,KAAOH,OAClD,GACiC,IAAxBE,GAAasB,OAAc,CAClC,MAAMG,EAAa,IAAI,IAAIjB,IAAIP,EAAKQ,KAAIC,GAAQgB,OAAOhB,EAAKC,GAAcb,SAAW,SACnFgB,EAAOG,OAAiChB,KAAOwB,EAEjDX,EAAOS,OAASE,EAAWhB,QA/D/B,SAA2BkB,EACzBtB,EACAJ,EACAF,EACAY,EACAb,GACA,MAAM8B,EAAkC,GAiBjC,OAfGvB,EAAAwB,SAASC,IACjB,MAAMC,EAAa9B,EAChBW,MAAKoB,GACJA,EAASjC,GAAcD,WAAagC,GACjCE,EAASrB,GAAcb,WAAa6B,IAGvCI,EACFH,EAAWK,KAAKF,EAAWjC,EAAQ,KAGnC8B,EAAWK,KAAK,EAAC,IAId,CACLf,KAAMS,EACNP,KAAM,OACNc,MAAOvC,EACPwC,UAAW,CAAC,EACZlC,KAAM2B,EACR,CAmCIQ,CAAkBT,EAAgBtB,EAAWJ,EAAMF,EAAcY,EAAcb,IACjF,CAqBK,OAjBPgB,EAAOS,OAAST,EAAOS,QAAQd,KAAKC,IAC5B,MAAA2B,EAAa,IAAK3B,GAExB,OAAQP,EAAAmC,aACN,IAAK,cAML,eACSD,EAAWF,gBAJpB,IAAK,aACHE,EAAWF,UAAY,CAAC,EAMrB,OAAAE,CAAA,IAGF9C,EAAMuB,EAAQX,EAAYoC,aAAA,WAEzBC,EAAA,CAAEC,SAAUpD,EAAekD,aAAc3C,EAAkBQ,UAAWP,GAAS,IAAMM,EAAAC"}

package/es/src/data-chart/src/components/pie.vue.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineComponent as e,createElementBlock as t,openBlock as r}from"vue";import{orderBy as o,cloneDeep as a}from"lodash-es";import{InjectionChartMerge as i}from"../utils/injectionKeys.mjs";import{useCharts as s}from"../utils/useCharts.mjs";import{inject as c,ref as l,computed as n}from"vue-demi";var u=e({name:"DataChartPie",__name:"pie",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},subShowType:{type:String,required:!0,default:"pie-simple"},chartOptions:{type:null,required:!0}},setup(e){const u=c(i,(e=>e),!0),m=l(null),p=n((()=>{const{colDesc:t,xGroupByDesc:r,data:i,modelName:s}=e.chartData,c=t.length,l={title:{text:s},series:t.map(((t,s)=>{const l={name:t,type:"pie",center:["50%","50%"],data:[],emphasis:{itemStyle:{shadowBlur:10,shadowOffsetX:0,shadowColor:"rgba(0, 0, 0, 0.5)"}},label:{formatter:"{b}：{c}({d}%)",rich:{b:{color:"#4C5058",fontSize:14,fontWeight:"bold",lineHeight:33}}}};let n=5;const u=o(a(i),[t],["desc"]),m=u.reduce(((e,r)=>e+Number(r[t])),0);if(i.length>n)for(;n<9;){const e=u.slice(0,n);if(e.reduce(((e,r)=>e+Number(r[t])),0)/m>.9||8===n){const o=u.slice(n,u.length-1);l.data=i.map((o=>{let a={};return e.forEach((e=>{JSON.stringify(e)===JSON.stringify(o)&&(a={name:r?.colDesc?o[r.colDesc]:"",value:o[t]})})),a})).filter((e=>e)),l.data.push({name:"其它",value:o.reduce(((e,r)=>e+Number(r[t])),0)});break}n++}else l.data=i.map((e=>({name:r?.colDesc?e[r.colDesc]:"",value:Number(e[t])})));if(1===c?l.center=["50%","60%"]:2===c?0===s?(l.right="40%",l.left="",l.center=["40%","60%"]):(l.right="",l.left="40%",l.center=["60%","60%"]):3===c?0===s?(l.right="40%",l.bottom="50%",l.top="",l.left="",l.center=["40%","78%"]):1===s?(l.right="",l.bottom="50%",l.top="",l.left="40%",l.center=["60%","78%"]):(l.right="40%",l.bottom="",l.top="50%",l.left="",l.center=["40%","60%"]):4===c&&(0===s?(l.right="40%",l.bottom="50%",l.top="",l.left="",l.center=["40%","78%"]):1===s?(l.right="",l.bottom="50%",l.top="",l.left="40%",l.center=["60%","78%"]):2===s?(l.right="40%",l.bottom="",l.top="50%",l.left="",l.center=["40%","60%"]):(l.right="",l.bottom="",l.top="50%",l.left="40%",l.center=["60%","60%"])),"pie-borderRadius"===e.subShowType)l.radius=["50%","70%"];else l.radius="50%";return l}))};return u(l,e.chartOptions)}));return s({chartDOM:m,chartOptions:p,chartData:n((()=>e.chartData))}),(e,o)=>(r(),t("div",{ref_key:"dataChartPie",ref:m,class:"data-chart-pie"},null,512))}});export{u as default};
+import{defineComponent as e,inject as t,ref as r,computed as a,createElementBlock as o,openBlock as s}from"vue";import{orderBy as c,cloneDeep as i}from"lodash-es";import{InjectionChartMerge as l}from"../utils/injectionKeys.mjs";import{useCharts as n}from"../utils/useCharts.mjs";var u=e({name:"DataChartPie",__name:"pie",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},subShowType:{type:String,required:!0,default:"pie-simple"},chartOptions:{type:null,required:!0}},setup(e){const u=t(l,(e=>e),!0),p=r(null),m=a((()=>{const{colDesc:t,xGroupByDesc:r,data:a,modelName:o}=e.chartData,s=t.length,l={title:{text:o},series:t.map(((t,o)=>{const l={name:t,type:"pie",center:["50%","50%"],data:[],emphasis:{itemStyle:{shadowBlur:10,shadowOffsetX:0,shadowColor:"rgba(0, 0, 0, 0.5)"}},label:{formatter:"{b}：{c}({d}%)",rich:{b:{color:"#4C5058",fontSize:14,fontWeight:"bold",lineHeight:33}}}};let n=5;const u=c(i(a),[t],["desc"]),p=u.reduce(((e,r)=>e+Number(r[t])),0);if(a.length>n)for(;n<9;){const e=u.slice(0,n);if(e.reduce(((e,r)=>e+Number(r[t])),0)/p>.9||8===n){const o=u.slice(n,u.length-1);l.data=a.map((a=>{let o={};return e.forEach((e=>{JSON.stringify(e)===JSON.stringify(a)&&(o={name:r?.colDesc?a[r.colDesc]:"",value:a[t]})})),o})).filter((e=>e)),l.data.push({name:"其它",value:o.reduce(((e,r)=>e+Number(r[t])),0)});break}n++}else l.data=a.map((e=>({name:r?.colDesc?e[r.colDesc]:"",value:Number(e[t])})));if(1===s?l.center=["50%","60%"]:2===s?0===o?(l.right="40%",l.left="",l.center=["40%","60%"]):(l.right="",l.left="40%",l.center=["60%","60%"]):3===s?0===o?(l.right="40%",l.bottom="50%",l.top="",l.left="",l.center=["40%","78%"]):1===o?(l.right="",l.bottom="50%",l.top="",l.left="40%",l.center=["60%","78%"]):(l.right="40%",l.bottom="",l.top="50%",l.left="",l.center=["40%","60%"]):4===s&&(0===o?(l.right="40%",l.bottom="50%",l.top="",l.left="",l.center=["40%","78%"]):1===o?(l.right="",l.bottom="50%",l.top="",l.left="40%",l.center=["60%","78%"]):2===o?(l.right="40%",l.bottom="",l.top="50%",l.left="",l.center=["40%","60%"]):(l.right="",l.bottom="",l.top="50%",l.left="40%",l.center=["60%","60%"])),"pie-borderRadius"===e.subShowType)l.radius=["50%","70%"];else l.radius="50%";return l}))};return u(l,e.chartOptions)}));return n({chartDOM:p,chartOptions:m,chartData:a((()=>e.chartData))}),(e,t)=>(s(),o("div",{ref_key:"dataChartPie",ref:p,class:"data-chart-pie"},null,512))}});export{u as default};
 //# sourceMappingURL=pie.vue.mjs.map

package/es/src/data-chart/src/components/pie.vue.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pie.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/pie.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { PieSeriesOption } from 'echarts/charts'\nimport type { EChartsOption, IFormatPublicData } from '../types'\nimport { cloneDeep, orderBy } from 'lodash-es'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartPie',\n})\nconst {\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n subShowType = 'pie-simple',\n chartOptions,\n} = defineProps<{\n chartData: IFormatPublicData\n subShowType: string\n chartOptions: EChartsOption\n}>()\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\n\nconst dataChartPie = ref(null)\nconst pieChartOptions = computed<EChartsOption>(() => {\n const { colDesc, xGroupByDesc, data, modelName } = chartData\n const colDescLength = colDesc.length\n const config = {\n title: { text: modelName },\n series: colDesc.map((item, index) => {\n const seriesItem: PieSeriesOption = {\n name: item,\n type: 'pie',\n center: ['50%', '50%'],\n data: [],\n emphasis: {\n itemStyle: {\n shadowBlur: 10,\n shadowOffsetX: 0,\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n },\n },\n label: {\n formatter: '{b}：{c}({d}%)',\n rich: {\n b: {\n color: '#4C5058',\n fontSize: 14,\n fontWeight: 'bold',\n lineHeight: 33,\n },\n },\n },\n }\n\n let cutNum = 5\n const orderByData = orderBy(cloneDeep(data), [item], ['desc'])\n // 总数\n const totalDesc = orderByData.reduce((prev, cur) => (prev + Number(cur[item])), 0)\n if (data.length > cutNum) {\n while (cutNum < 9) {\n const headerData = orderByData.slice(0, cutNum)\n // 前 cutNum 个总数\n const headerTotal = headerData.reduce((prev, cur) => prev + Number(cur[item]), 0)\n // 前五总占比\n const headerScale = headerTotal / totalDesc\n if (headerScale > 0.90 \|\| cutNum === 8) {\n //\n const footerData = orderByData.slice(cutNum, orderByData.length - 1)\n seriesItem.data = data.map((yItem) => {\n let obj = {}\n headerData.forEach((headerDataItem) => {\n if (JSON.stringify(headerDataItem) === JSON.stringify(yItem)) {\n obj = {\n name: xGroupByDesc?.colDesc ? yItem[xGroupByDesc.colDesc] : '',\n value: yItem[item],\n }\n }\n })\n return obj\n }).filter(v => v)\n seriesItem.data.push({\n name: '其它',\n value: footerData.reduce((prev, cur) => prev + Number(cur[item]), 0),\n })\n\n break\n }\n else {\n cutNum++\n }\n }\n }\n else {\n seriesItem.data = data.map(yItem => ({\n name: xGroupByDesc?.colDesc ? yItem[xGroupByDesc.colDesc] : '',\n value: Number(yItem[item]),\n }))\n }\n\n if (colDescLength === 1) {\n seriesItem.center = ['50%', '60%']\n }\n else if (colDescLength === 2) {\n if (index === 0) {\n seriesItem.right = '40%'\n seriesItem.left = ''\n seriesItem.center = ['40%', '60%']\n }\n else {\n seriesItem.right = ''\n seriesItem.left = '40%'\n seriesItem.center = ['60%', '60%']\n }\n }\n else if (colDescLength === 3) {\n if (index === 0) {\n seriesItem.right = '40%'\n seriesItem.bottom = '50%'\n seriesItem.top = ''\n seriesItem.left = ''\n seriesItem.center = ['40%', '78%']\n }\n else if (index === 1) {\n seriesItem.right = ''\n seriesItem.bottom = '50%'\n seriesItem.top = ''\n seriesItem.left = '40%'\n seriesItem.center = ['60%', '78%']\n }\n else {\n seriesItem.right = '40%'\n seriesItem.bottom = ''\n seriesItem.top = '50%'\n seriesItem.left = ''\n seriesItem.center = ['40%', '60%']\n }\n }\n else if (colDescLength === 4) {\n if (index === 0) {\n seriesItem.right = '40%'\n seriesItem.bottom = '50%'\n seriesItem.top = ''\n seriesItem.left = ''\n seriesItem.center = ['40%', '78%']\n }\n else if (index === 1) {\n seriesItem.right = ''\n seriesItem.bottom = '50%'\n seriesItem.top = ''\n seriesItem.left = '40%'\n seriesItem.center = ['60%', '78%']\n }\n else if (index === 2) {\n seriesItem.right = '40%'\n seriesItem.bottom = ''\n seriesItem.top = '50%'\n seriesItem.left = ''\n seriesItem.center = ['40%', '60%']\n }\n else {\n seriesItem.right = ''\n seriesItem.bottom = ''\n seriesItem.top = '50%'\n seriesItem.left = '40%'\n seriesItem.center = ['60%', '60%']\n }\n }\n // 处理图表形状\n switch (subShowType) {\n case 'pie-borderRadius':\n seriesItem.radius = ['50%', '70%']\n break\n case 'pie-simple':\n seriesItem.radius = '50%'\n break\n default:\n seriesItem.radius = '50%'\n break\n }\n return seriesItem\n }),\n }\n return merge(config, chartOptions)\n})\n\nuseCharts({ chartDOM: dataChartPie, chartOptions: pieChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartPie\" class=\"data-chart-pie\" />\n</template>\n"],"names":["merge","inject","InjectionChartMerge","v","dataChartPie","ref","pieChartOptions","computed","colDesc","xGroupByDesc","data","modelName","__props","chartData","colDescLength","length","config","title","text","series","map","item","index","seriesItem","name","type","center","emphasis","itemStyle","shadowBlur","shadowOffsetX","shadowColor","label","formatter","rich","b","color","fontSize","fontWeight","lineHeight","cutNum","orderByData","orderBy","cloneDeep","totalDesc","reduce","prev","cur","Number","headerData","slice","footerData","yItem","obj","forEach","headerDataItem","JSON","stringify","value","filter","push","right","left","bottom","top","subShowType","radius","chartOptions","useCharts","chartDOM"],"mappings":"~~8mBA8BA~~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"}
1	+ {"version":3,"file":"pie.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/pie.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { PieSeriesOption } from 'echarts/charts'\nimport type { EChartsOption, IFormatPublicData } from '../types'\nimport { cloneDeep, orderBy } from 'lodash-es'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartPie',\n})\nconst {\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n subShowType = 'pie-simple',\n chartOptions,\n} = defineProps<{\n chartData: IFormatPublicData\n subShowType: string\n chartOptions: EChartsOption\n}>()\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\n\nconst dataChartPie = ref(null)\nconst pieChartOptions = computed<EChartsOption>(() => {\n const { colDesc, xGroupByDesc, data, modelName } = chartData\n const colDescLength = colDesc.length\n const config = {\n title: { text: modelName },\n series: colDesc.map((item, index) => {\n const seriesItem: PieSeriesOption = {\n name: item,\n type: 'pie',\n center: ['50%', '50%'],\n data: [],\n emphasis: {\n itemStyle: {\n shadowBlur: 10,\n shadowOffsetX: 0,\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n },\n },\n label: {\n formatter: '{b}：{c}({d}%)',\n rich: {\n b: {\n color: '#4C5058',\n fontSize: 14,\n fontWeight: 'bold',\n lineHeight: 33,\n },\n },\n },\n }\n\n let cutNum = 5\n const orderByData = orderBy(cloneDeep(data), [item], ['desc'])\n // 总数\n const totalDesc = orderByData.reduce((prev, cur) => (prev + Number(cur[item])), 0)\n if (data.length > cutNum) {\n while (cutNum < 9) {\n const headerData = orderByData.slice(0, cutNum)\n // 前 cutNum 个总数\n const headerTotal = headerData.reduce((prev, cur) => prev + Number(cur[item]), 0)\n // 前五总占比\n const headerScale = headerTotal / totalDesc\n if (headerScale > 0.90 \|\| cutNum === 8) {\n //\n const footerData = orderByData.slice(cutNum, orderByData.length - 1)\n seriesItem.data = data.map((yItem) => {\n let obj = {}\n headerData.forEach((headerDataItem) => {\n if (JSON.stringify(headerDataItem) === JSON.stringify(yItem)) {\n obj = {\n name: xGroupByDesc?.colDesc ? yItem[xGroupByDesc.colDesc] : '',\n value: yItem[item],\n }\n }\n })\n return obj\n }).filter(v => v)\n seriesItem.data.push({\n name: '其它',\n value: footerData.reduce((prev, cur) => prev + Number(cur[item]), 0),\n })\n\n break\n }\n else {\n cutNum++\n }\n }\n }\n else {\n seriesItem.data = data.map(yItem => ({\n name: xGroupByDesc?.colDesc ? yItem[xGroupByDesc.colDesc] : '',\n value: Number(yItem[item]),\n }))\n }\n\n if (colDescLength === 1) {\n seriesItem.center = ['50%', '60%']\n }\n else if (colDescLength === 2) {\n if (index === 0) {\n seriesItem.right = '40%'\n seriesItem.left = ''\n seriesItem.center = ['40%', '60%']\n }\n else {\n seriesItem.right = ''\n seriesItem.left = '40%'\n seriesItem.center = ['60%', '60%']\n }\n }\n else if (colDescLength === 3) {\n if (index === 0) {\n seriesItem.right = '40%'\n seriesItem.bottom = '50%'\n seriesItem.top = ''\n seriesItem.left = ''\n seriesItem.center = ['40%', '78%']\n }\n else if (index === 1) {\n seriesItem.right = ''\n seriesItem.bottom = '50%'\n seriesItem.top = ''\n seriesItem.left = '40%'\n seriesItem.center = ['60%', '78%']\n }\n else {\n seriesItem.right = '40%'\n seriesItem.bottom = ''\n seriesItem.top = '50%'\n seriesItem.left = ''\n seriesItem.center = ['40%', '60%']\n }\n }\n else if (colDescLength === 4) {\n if (index === 0) {\n seriesItem.right = '40%'\n seriesItem.bottom = '50%'\n seriesItem.top = ''\n seriesItem.left = ''\n seriesItem.center = ['40%', '78%']\n }\n else if (index === 1) {\n seriesItem.right = ''\n seriesItem.bottom = '50%'\n seriesItem.top = ''\n seriesItem.left = '40%'\n seriesItem.center = ['60%', '78%']\n }\n else if (index === 2) {\n seriesItem.right = '40%'\n seriesItem.bottom = ''\n seriesItem.top = '50%'\n seriesItem.left = ''\n seriesItem.center = ['40%', '60%']\n }\n else {\n seriesItem.right = ''\n seriesItem.bottom = ''\n seriesItem.top = '50%'\n seriesItem.left = '40%'\n seriesItem.center = ['60%', '60%']\n }\n }\n // 处理图表形状\n switch (subShowType) {\n case 'pie-borderRadius':\n seriesItem.radius = ['50%', '70%']\n break\n case 'pie-simple':\n seriesItem.radius = '50%'\n break\n default:\n seriesItem.radius = '50%'\n break\n }\n return seriesItem\n }),\n }\n return merge(config, chartOptions)\n})\n\nuseCharts({ chartDOM: dataChartPie, chartOptions: pieChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartPie\" class=\"data-chart-pie\" />\n</template>\n"],"names":["merge","inject","InjectionChartMerge","v","dataChartPie","ref","pieChartOptions","computed","colDesc","xGroupByDesc","data","modelName","__props","chartData","colDescLength","length","config","title","text","series","map","item","index","seriesItem","name","type","center","emphasis","itemStyle","shadowBlur","shadowOffsetX","shadowColor","label","formatter","rich","b","color","fontSize","fontWeight","lineHeight","cutNum","orderByData","orderBy","cloneDeep","totalDesc","reduce","prev","cur","Number","headerData","slice","footerData","yItem","obj","forEach","headerDataItem","JSON","stringify","value","filter","push","right","left","bottom","top","subShowType","radius","chartOptions","useCharts","chartDOM"],"mappings":"wlBA8BA,MAAMA,EAAQC,EAAOC,GAAsBC,GAAWA,IAAG,GAEnDC,EAAeC,EAAI,MACnBC,EAAkBC,GAAwB,KAC9C,MAAMC,QAAEA,EAASC,aAAAA,EAAAC,KAAcA,EAAMC,UAAAA,GAAcC,EAAAC,UAC7CC,EAAgBN,EAAQO,OACxBC,EAAS,CACbC,MAAO,CAAEC,KAAMP,GACfQ,OAAQX,EAAQY,KAAI,CAACC,EAAMC,KACzB,MAAMC,EAA8B,CAClCC,KAAMH,EACNI,KAAM,MACNC,OAAQ,CAAC,MAAO,OAChBhB,KAAM,GACNiB,SAAU,CACRC,UAAW,CACTC,WAAY,GACZC,cAAe,EACfC,YAAa,uBAGjBC,MAAO,CACLC,UAAW,gBACXC,KAAM,CACJC,EAAG,CACDC,MAAO,UACPC,SAAU,GACVC,WAAY,OACZC,WAAY,OAMpB,IAAIC,EAAS,EACP,MAAAC,EAAcC,EAAQC,EAAUjC,GAAO,CAACW,GAAO,CAAC,SAEhDuB,EAAYH,EAAYI,QAAO,CAACC,EAAMC,IAASD,EAAOE,OAAOD,EAAI1B,KAAS,GAC5E,GAAAX,EAAKK,OAASyB,EAChB,KAAOA,EAAS,GAAG,CACjB,MAAMS,EAAaR,EAAYS,MAAM,EAAGV,GAKpC,GAHgBS,EAAWJ,QAAO,CAACC,EAAMC,IAAQD,EAAOE,OAAOD,EAAI1B,KAAQ,GAE7CuB,EAChB,IAAmB,IAAXJ,EAAc,CAEtC,MAAMW,EAAaV,EAAYS,MAAMV,EAAQC,EAAY1B,OAAS,GAClEQ,EAAWb,KAAOA,EAAKU,KAAKgC,IAC1B,IAAIC,EAAM,CAAC,EASJ,OARIJ,EAAAK,SAASC,IACdC,KAAKC,UAAUF,KAAoBC,KAAKC,UAAUL,KAC9CC,EAAA,CACJ7B,KAAMf,GAAcD,QAAU4C,EAAM3C,EAAaD,SAAW,GAC5DkD,MAAON,EAAM/B,IACf,IAGGgC,CAAA,IACNM,QAAOxD,GAAKA,IACfoB,EAAWb,KAAKkD,KAAK,CACnBpC,KAAM,KACNkC,MAAOP,EAAWN,QAAO,CAACC,EAAMC,IAAQD,EAAOE,OAAOD,EAAI1B,KAAQ,KAGpE,KAAA,CAGAmB,GACF,MAISjB,EAAAb,KAAOA,EAAKU,KAAcgC,IAAA,CACnC5B,KAAMf,GAAcD,QAAU4C,EAAM3C,EAAaD,SAAW,GAC5DkD,MAAOV,OAAOI,EAAM/B,QAyExB,GArEsB,IAAlBP,EACSS,EAAAG,OAAS,CAAC,MAAO,OAEH,IAAlBZ,EACO,IAAVQ,GACFC,EAAWsC,MAAQ,MACnBtC,EAAWuC,KAAO,GACPvC,EAAAG,OAAS,CAAC,MAAO,SAG5BH,EAAWsC,MAAQ,GACnBtC,EAAWuC,KAAO,MACPvC,EAAAG,OAAS,CAAC,MAAO,QAGL,IAAlBZ,EACO,IAAVQ,GACFC,EAAWsC,MAAQ,MACnBtC,EAAWwC,OAAS,MACpBxC,EAAWyC,IAAM,GACjBzC,EAAWuC,KAAO,GACPvC,EAAAG,OAAS,CAAC,MAAO,QAEX,IAAVJ,GACPC,EAAWsC,MAAQ,GACnBtC,EAAWwC,OAAS,MACpBxC,EAAWyC,IAAM,GACjBzC,EAAWuC,KAAO,MACPvC,EAAAG,OAAS,CAAC,MAAO,SAG5BH,EAAWsC,MAAQ,MACnBtC,EAAWwC,OAAS,GACpBxC,EAAWyC,IAAM,MACjBzC,EAAWuC,KAAO,GACPvC,EAAAG,OAAS,CAAC,MAAO,QAGL,IAAlBZ,IACO,IAAVQ,GACFC,EAAWsC,MAAQ,MACnBtC,EAAWwC,OAAS,MACpBxC,EAAWyC,IAAM,GACjBzC,EAAWuC,KAAO,GACPvC,EAAAG,OAAS,CAAC,MAAO,QAEX,IAAVJ,GACPC,EAAWsC,MAAQ,GACnBtC,EAAWwC,OAAS,MACpBxC,EAAWyC,IAAM,GACjBzC,EAAWuC,KAAO,MACPvC,EAAAG,OAAS,CAAC,MAAO,QAEX,IAAVJ,GACPC,EAAWsC,MAAQ,MACnBtC,EAAWwC,OAAS,GACpBxC,EAAWyC,IAAM,MACjBzC,EAAWuC,KAAO,GACPvC,EAAAG,OAAS,CAAC,MAAO,SAG5BH,EAAWsC,MAAQ,GACnBtC,EAAWwC,OAAS,GACpBxC,EAAWyC,IAAM,MACjBzC,EAAWuC,KAAO,MACPvC,EAAAG,OAAS,CAAC,MAAO,SAKzB,qBADCd,EAAAqD,YAEO1C,EAAA2C,OAAS,CAAC,MAAO,YAM5B3C,EAAW2C,OAAS,MAGjB,OAAA3C,CAAA,KAGJ,OAAAvB,EAAMgB,EAAQJ,EAAYuD,aAAA,WAGzBC,EAAA,CAAEC,SAAUjE,EAAc+D,aAAc7D,EAAiBO,UAAWN,GAAS,IAAMK,EAAAC"}

package/es/src/data-chart/src/components/radar.vue.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineComponent as a,createElementBlock as r,openBlock as e}from"vue";import{uniq as t}from"lodash-es";import{InjectionChartMerge as o}from"../utils/injectionKeys.mjs";import{useCharts as s}from"../utils/useCharts.mjs";import{ref as u,inject as m,computed as c}from"vue-demi";var p=a({name:"DataChartRadar",__name:"radar",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},chartOptions:{type:null,required:!0}},setup(a){const p=u(),l=m(o,(a=>a),!0),i=c((()=>{const{colDesc:r,xGroupByDesc:e,modelName:o,data:s}=a.chartData;e?.groupByValues&&(e.groupByValues=[]),e.groupByValues=t(s.map((a=>a[e.colDesc||""])).filter((a=>a)));const u={title:{text:o},radar:{indicator:e?.groupByValues?.map((a=>({name:a,max:Math.max(...s.map((a=>Number(a[r[0]]))))})))||[]},series:[{name:e?.colDesc,type:"radar",tooltip:{trigger:"item"},data:r.map((a=>({name:a,value:e?.groupByValues?.map((r=>s.map((t=>r===t[e.colDesc||""]?t[a]:null)).filter((a=>a)).reduce(((a,r)=>Number(a||0)+Number(r||0)),0)))})))}]};return l(u,a.chartOptions)}));return s({chartDOM:p,chartOptions:i,chartData:c((()=>a.chartData))}),(a,t)=>(e(),r("div",{ref_key:"dataChartRadar",ref:p,class:"data-chart-radar"},null,512))}});export{p as default};
+import{defineComponent as a,ref as r,inject as e,computed as t,createElementBlock as o,openBlock as s}from"vue";import{uniq as u}from"lodash-es";import{InjectionChartMerge as c}from"../utils/injectionKeys.mjs";import{useCharts as l}from"../utils/useCharts.mjs";var m=a({name:"DataChartRadar",__name:"radar",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},chartOptions:{type:null,required:!0}},setup(a){const m=r(),p=e(c,(a=>a),!0),i=t((()=>{const{colDesc:r,xGroupByDesc:e,modelName:t,data:o}=a.chartData;e?.groupByValues&&(e.groupByValues=[]),e.groupByValues=u(o.map((a=>a[e.colDesc||""])).filter((a=>a)));const s={title:{text:t},radar:{indicator:e?.groupByValues?.map((a=>({name:a,max:Math.max(...o.map((a=>Number(a[r[0]]))))})))||[]},series:[{name:e?.colDesc,type:"radar",tooltip:{trigger:"item"},data:r.map((a=>({name:a,value:e?.groupByValues?.map((r=>o.map((t=>r===t[e.colDesc||""]?t[a]:null)).filter((a=>a)).reduce(((a,r)=>Number(a||0)+Number(r||0)),0)))})))}]};return p(s,a.chartOptions)}));return l({chartDOM:m,chartOptions:i,chartData:t((()=>a.chartData))}),(a,r)=>(s(),o("div",{ref_key:"dataChartRadar",ref:m,class:"data-chart-radar"},null,512))}});export{m as default};
 //# sourceMappingURL=radar.vue.mjs.map

package/es/src/data-chart/src/components/radar.vue.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"radar.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/radar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { EChartsOption, IFormatPublicData } from '../types'\nimport { uniq } from 'lodash-es'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartRadar',\n})\n\nconst {\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n chartOptions,\n} = defineProps<{\n chartData: IFormatPublicData\n chartOptions: EChartsOption\n}>()\n\nconst dataChartRadar = ref()\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\nconst radarChartOptions = computed<EChartsOption>(() => {\n const { colDesc, xGroupByDesc, modelName, data } = chartData\n\n if (xGroupByDesc?.groupByValues) {\n xGroupByDesc.groupByValues = []\n }\n xGroupByDesc.groupByValues = uniq(data.map((item) => {\n return item[xGroupByDesc.colDesc \|\| ''] as string\n }).filter(v => v))\n\n const config = {\n title: {\n text: modelName,\n },\n radar: {\n indicator: xGroupByDesc?.groupByValues?.map((groupByValuesItem) => {\n return {\n name: groupByValuesItem,\n max: Math.max(...data.map(item => Number(item[colDesc[0]]))),\n }\n }) \|\| [],\n },\n series: [{\n name: xGroupByDesc?.colDesc,\n type: 'radar',\n tooltip: {\n trigger: 'item',\n },\n data: colDesc.map(colDescItem => ({\n name: colDescItem,\n value: xGroupByDesc?.groupByValues?.map((groupByValuesItem) => {\n return (data.map((dataItem) => {\n if (groupByValuesItem === dataItem[xGroupByDesc.colDesc \|\| '']) {\n return dataItem[colDescItem]\n }\n return null\n }).filter(v => v)).reduce((pre, cur) => Number(pre \|\| 0) + Number(cur \|\| 0), 0)\n }),\n })),\n }],\n }\n\n return merge(config, chartOptions)\n})\nuseCharts({ chartDOM: dataChartRadar, chartOptions: radarChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartRadar\" class=\"data-chart-radar\" />\n</template>\n"],"names":["dataChartRadar","ref","merge","inject","InjectionChartMerge","v","radarChartOptions","computed","colDesc","xGroupByDesc","modelName","data","__props","chartData","groupByValues","uniq","map","item","filter","config","title","text","radar","indicator","groupByValuesItem","name","max","Math","Number","series","type","tooltip","trigger","colDescItem","value","dataItem","reduce","pre","cur","chartOptions","useCharts","chartDOM"],"mappings":"~~qiBA6BA~~,MAAMA,EAAiBC,IACjBC,EAAQC,EAAOC,GAAsBC,GAAWA,IAAG,GACnDC,EAAoBC,GAAwB,KAChD,MAAMC,QAAEA,EAASC,aAAAA,EAAAC,UAAcA,EAAWC,KAAAA,GAASC,EAAAC,UAE/CJ,GAAcK,gBAChBL,EAAaK,cAAgB,IAE/BL,EAAaK,cAAgBC,EAAKJ,EAAKK,KAAKC,GACnCA,EAAKR,EAAaD,SAAW,MACnCU,QAAOb,GAAKA,KAEf,MAAMc,EAAS,CACbC,MAAO,CACLC,KAAMX,GAERY,MAAO,CACLC,UAAWd,GAAcK,eAAeE,KAAKQ,IACpC,CACLC,KAAMD,EACNE,IAAKC,KAAKD,OAAOf,EAAKK,KAAIC,GAAQW,OAAOX,EAAKT,EAAQ,aAEpD,IAERqB,OAAQ,CAAC,CACPJ,KAAMhB,GAAcD,QACpBsB,KAAM,QACNC,QAAS,CACPC,QAAS,QAEXrB,KAAMH,EAAQQ,KAAoBiB,IAAA,CAChCR,KAAMQ,EACNC,MAAOzB,GAAcK,eAAeE,KAAKQ,GAC/Bb,EAAKK,KAAKmB,GACZX,IAAsBW,EAAS1B,EAAaD,SAAW,IAClD2B,EAASF,GAEX,OACNf,WAAYb,IAAI+B,QAAO,CAACC,EAAKC,IAAQV,OAAOS,GAAO,GAAKT,OAAOU,GAAO,IAAI,YAM9E,OAAApC,EAAMiB,EAAQP,EAAY2B,aAAA,WAEzBC,EAAA,CAAEC,SAAUzC,EAAgBuC,aAAcjC,EAAmBO,UAAWN,GAAS,IAAMK,EAAAC"}
1	+ {"version":3,"file":"radar.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/radar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { EChartsOption, IFormatPublicData } from '../types'\nimport { uniq } from 'lodash-es'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartRadar',\n})\n\nconst {\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n chartOptions,\n} = defineProps<{\n chartData: IFormatPublicData\n chartOptions: EChartsOption\n}>()\n\nconst dataChartRadar = ref()\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\nconst radarChartOptions = computed<EChartsOption>(() => {\n const { colDesc, xGroupByDesc, modelName, data } = chartData\n\n if (xGroupByDesc?.groupByValues) {\n xGroupByDesc.groupByValues = []\n }\n xGroupByDesc.groupByValues = uniq(data.map((item) => {\n return item[xGroupByDesc.colDesc \|\| ''] as string\n }).filter(v => v))\n\n const config = {\n title: {\n text: modelName,\n },\n radar: {\n indicator: xGroupByDesc?.groupByValues?.map((groupByValuesItem) => {\n return {\n name: groupByValuesItem,\n max: Math.max(...data.map(item => Number(item[colDesc[0]]))),\n }\n }) \|\| [],\n },\n series: [{\n name: xGroupByDesc?.colDesc,\n type: 'radar',\n tooltip: {\n trigger: 'item',\n },\n data: colDesc.map(colDescItem => ({\n name: colDescItem,\n value: xGroupByDesc?.groupByValues?.map((groupByValuesItem) => {\n return (data.map((dataItem) => {\n if (groupByValuesItem === dataItem[xGroupByDesc.colDesc \|\| '']) {\n return dataItem[colDescItem]\n }\n return null\n }).filter(v => v)).reduce((pre, cur) => Number(pre \|\| 0) + Number(cur \|\| 0), 0)\n }),\n })),\n }],\n }\n\n return merge(config, chartOptions)\n})\nuseCharts({ chartDOM: dataChartRadar, chartOptions: radarChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartRadar\" class=\"data-chart-radar\" />\n</template>\n"],"names":["dataChartRadar","ref","merge","inject","InjectionChartMerge","v","radarChartOptions","computed","colDesc","xGroupByDesc","modelName","data","__props","chartData","groupByValues","uniq","map","item","filter","config","title","text","radar","indicator","groupByValuesItem","name","max","Math","Number","series","type","tooltip","trigger","colDescItem","value","dataItem","reduce","pre","cur","chartOptions","useCharts","chartDOM"],"mappings":"+gBA6BA,MAAMA,EAAiBC,IACjBC,EAAQC,EAAOC,GAAsBC,GAAWA,IAAG,GACnDC,EAAoBC,GAAwB,KAChD,MAAMC,QAAEA,EAASC,aAAAA,EAAAC,UAAcA,EAAWC,KAAAA,GAASC,EAAAC,UAE/CJ,GAAcK,gBAChBL,EAAaK,cAAgB,IAE/BL,EAAaK,cAAgBC,EAAKJ,EAAKK,KAAKC,GACnCA,EAAKR,EAAaD,SAAW,MACnCU,QAAOb,GAAKA,KAEf,MAAMc,EAAS,CACbC,MAAO,CACLC,KAAMX,GAERY,MAAO,CACLC,UAAWd,GAAcK,eAAeE,KAAKQ,IACpC,CACLC,KAAMD,EACNE,IAAKC,KAAKD,OAAOf,EAAKK,KAAIC,GAAQW,OAAOX,EAAKT,EAAQ,aAEpD,IAERqB,OAAQ,CAAC,CACPJ,KAAMhB,GAAcD,QACpBsB,KAAM,QACNC,QAAS,CACPC,QAAS,QAEXrB,KAAMH,EAAQQ,KAAoBiB,IAAA,CAChCR,KAAMQ,EACNC,MAAOzB,GAAcK,eAAeE,KAAKQ,GAC/Bb,EAAKK,KAAKmB,GACZX,IAAsBW,EAAS1B,EAAaD,SAAW,IAClD2B,EAASF,GAEX,OACNf,WAAYb,IAAI+B,QAAO,CAACC,EAAKC,IAAQV,OAAOS,GAAO,GAAKT,OAAOU,GAAO,IAAI,YAM9E,OAAApC,EAAMiB,EAAQP,EAAY2B,aAAA,WAEzBC,EAAA,CAAEC,SAAUzC,EAAgBuC,aAAcjC,EAAmBO,UAAWN,GAAS,IAAMK,EAAAC"}

package/es/src/data-chart/src/components/scatter-simple.vue.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineComponent as e,createElementBlock as t,openBlock as a}from"vue";import{InjectionChartMerge as r}from"../utils/injectionKeys.mjs";import{useCharts as s}from"../utils/useCharts.mjs";import{ref as c,inject as o,computed as m}from"vue-demi";var l=e({name:"DataChartScatterSimple",__name:"scatter-simple",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},chartOptions:{type:null,required:!0}},setup(e){const l=c(),i=o(r,(e=>e),!0),p=m((()=>{const{colDesc:t,xGroupByDesc:a,modelName:r,data:s}=e.chartData,c={title:{text:r},tooltip:{formatter:e=>e.value.length>1?`${e.seriesName} :<br/>${e.value[0]} ${e.value[1]} `:`${e.seriesName} :<br/>${e.name} : ${e.value} `},series:t.map((e=>({symbolSize:20,name:e,data:s.map((t=>[t[e],t[a?.colDesc||""]])),type:"scatter"})))};return i(c,e.chartOptions)}));return s({chartDOM:l,chartOptions:p,chartData:m((()=>e.chartData))}),(e,r)=>(a(),t("div",{ref_key:"dataChartScatterSimple",ref:l,class:"data-chart-scatter-simple"},null,512))}});export{l as default};
+import{defineComponent as e,ref as t,inject as a,computed as r,createElementBlock as s,openBlock as c}from"vue";import{InjectionChartMerge as o}from"../utils/injectionKeys.mjs";import{useCharts as l}from"../utils/useCharts.mjs";var m=e({name:"DataChartScatterSimple",__name:"scatter-simple",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},chartOptions:{type:null,required:!0}},setup(e){const m=t(),p=a(o,(e=>e),!0),i=r((()=>{const{colDesc:t,xGroupByDesc:a,modelName:r,data:s}=e.chartData,c={title:{text:r},tooltip:{formatter:e=>e.value.length>1?`${e.seriesName} :<br/>${e.value[0]} ${e.value[1]} `:`${e.seriesName} :<br/>${e.name} : ${e.value} `},series:t.map((e=>({symbolSize:20,name:e,data:s.map((t=>[t[e],t[a?.colDesc||""]])),type:"scatter"})))};return p(c,e.chartOptions)}));return l({chartDOM:m,chartOptions:i,chartData:r((()=>e.chartData))}),(e,t)=>(c(),s("div",{ref_key:"dataChartScatterSimple",ref:m,class:"data-chart-scatter-simple"},null,512))}});export{m as default};
 //# sourceMappingURL=scatter-simple.vue.mjs.map

package/es/src/data-chart/src/components/scatter-simple.vue.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"scatter-simple.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/scatter-simple.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { EChartsOption, IFormatPublicData } from '../types'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartScatterSimple',\n})\nconst {\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n chartOptions,\n} = defineProps<{\n chartData: IFormatPublicData\n chartOptions: EChartsOption\n}>()\nconst dataChartScatterSimple = ref()\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\n\nconst scatterChartOptions = computed<EChartsOption>(() => {\n const { colDesc, xGroupByDesc, modelName, data } = chartData\n const config = {\n title: {\n text: modelName,\n },\n tooltip: {\n formatter(params: { value: string, seriesName: string, name: string }) {\n if (params.value.length > 1) {\n return (\n `${params.seriesName\n } :<br/>${params.value[0]\n } ${params.value[1]\n } `\n )\n }\n else {\n return (\n `${params.seriesName\n } :<br/>${params.name\n } : ${params.value\n } `\n )\n }\n },\n },\n series: colDesc.map((colDescItem) => {\n return {\n symbolSize: 20,\n name: colDescItem,\n data: data.map((dataItem) => {\n return [dataItem[colDescItem], dataItem[xGroupByDesc?.colDesc \|\| '']]\n }),\n type: 'scatter',\n }\n }),\n }\n return merge(config, chartOptions)\n})\nuseCharts({ chartDOM: dataChartScatterSimple, chartOptions: scatterChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartScatterSimple\" class=\"data-chart-scatter-simple\" />\n</template>\n"],"names":["dataChartScatterSimple","ref","merge","inject","InjectionChartMerge","v","scatterChartOptions","computed","colDesc","xGroupByDesc","modelName","data","__props","chartData","config","title","text","tooltip","formatter","params","value","length","seriesName","name","series","map","colDescItem","symbolSize","dataItem","type","chartOptions","useCharts","chartDOM"],"mappings":"~~qhBA0BA~~,MAAMA,EAAyBC,IACzBC,EAAQC,EAAOC,GAAsBC,GAAWA,IAAG,GAEnDC,EAAsBC,GAAwB,KAClD,MAAMC,QAAEA,EAASC,aAAAA,EAAAC,UAAcA,EAAWC,KAAAA,GAASC,EAAAC,UAC7CC,EAAS,CACbC,MAAO,CACLC,KAAMN,GAERO,QAAS,CACPC,UAAUC,GACJA,EAAOC,MAAMC,OAAS,EAEtB,GAAGF,EAAOG,oBACAH,EAAOC,MAAM,MACnBD,EAAOC,MAAM,MAMjB,GAAGD,EAAOG,oBACAH,EAAOI,UACXJ,EAAOC,UAMrBI,OAAQhB,EAAQiB,KAAKC,IACZ,CACLC,WAAY,GACZJ,KAAMG,EACNf,KAAMA,EAAKc,KAAKG,GACP,CAACA,EAASF,GAAcE,EAASnB,GAAcD,SAAW,OAEnEqB,KAAM,eAIL,OAAA3B,EAAMY,EAAQF,EAAYkB,aAAA,WAEzBC,EAAA,CAAEC,SAAUhC,EAAwB8B,aAAcxB,EAAqBO,UAAWN,GAAS,IAAMK,EAAAC"}
1	+ {"version":3,"file":"scatter-simple.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/scatter-simple.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { EChartsOption, IFormatPublicData } from '../types'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartScatterSimple',\n})\nconst {\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n chartOptions,\n} = defineProps<{\n chartData: IFormatPublicData\n chartOptions: EChartsOption\n}>()\nconst dataChartScatterSimple = ref()\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\n\nconst scatterChartOptions = computed<EChartsOption>(() => {\n const { colDesc, xGroupByDesc, modelName, data } = chartData\n const config = {\n title: {\n text: modelName,\n },\n tooltip: {\n formatter(params: { value: string, seriesName: string, name: string }) {\n if (params.value.length > 1) {\n return (\n `${params.seriesName\n } :<br/>${params.value[0]\n } ${params.value[1]\n } `\n )\n }\n else {\n return (\n `${params.seriesName\n } :<br/>${params.name\n } : ${params.value\n } `\n )\n }\n },\n },\n series: colDesc.map((colDescItem) => {\n return {\n symbolSize: 20,\n name: colDescItem,\n data: data.map((dataItem) => {\n return [dataItem[colDescItem], dataItem[xGroupByDesc?.colDesc \|\| '']]\n }),\n type: 'scatter',\n }\n }),\n }\n return merge(config, chartOptions)\n})\nuseCharts({ chartDOM: dataChartScatterSimple, chartOptions: scatterChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartScatterSimple\" class=\"data-chart-scatter-simple\" />\n</template>\n"],"names":["dataChartScatterSimple","ref","merge","inject","InjectionChartMerge","v","scatterChartOptions","computed","colDesc","xGroupByDesc","modelName","data","__props","chartData","config","title","text","tooltip","formatter","params","value","length","seriesName","name","series","map","colDescItem","symbolSize","dataItem","type","chartOptions","useCharts","chartDOM"],"mappings":"+fA0BA,MAAMA,EAAyBC,IACzBC,EAAQC,EAAOC,GAAsBC,GAAWA,IAAG,GAEnDC,EAAsBC,GAAwB,KAClD,MAAMC,QAAEA,EAASC,aAAAA,EAAAC,UAAcA,EAAWC,KAAAA,GAASC,EAAAC,UAC7CC,EAAS,CACbC,MAAO,CACLC,KAAMN,GAERO,QAAS,CACPC,UAAUC,GACJA,EAAOC,MAAMC,OAAS,EAEtB,GAAGF,EAAOG,oBACAH,EAAOC,MAAM,MACnBD,EAAOC,MAAM,MAMjB,GAAGD,EAAOG,oBACAH,EAAOI,UACXJ,EAAOC,UAMrBI,OAAQhB,EAAQiB,KAAKC,IACZ,CACLC,WAAY,GACZJ,KAAMG,EACNf,KAAMA,EAAKc,KAAKG,GACP,CAACA,EAASF,GAAcE,EAASnB,GAAcD,SAAW,OAEnEqB,KAAM,eAIL,OAAA3B,EAAMY,EAAQF,EAAYkB,aAAA,WAEzBC,EAAA,CAAEC,SAAUhC,EAAwB8B,aAAcxB,EAAqBO,UAAWN,GAAS,IAAMK,EAAAC"}

package/es/src/data-chart/src/components/scatter.vue.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineComponent as t,createElementBlock as a,openBlock as e}from"vue";import{InjectionChartMerge as r}from"../utils/injectionKeys.mjs";import{useCharts as s}from"../utils/useCharts.mjs";import{ref as c,inject as o,computed as i}from"vue-demi";var p=t({name:"DataChartScatter",__name:"scatter",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},chartOptions:{type:null,required:!0}},setup(t){const p=c(),u=o(r,(t=>t),!0),m=i((()=>u({xAxis:{},yAxis:{},series:[{symbolSize:20,data:[[10,8.04],[8.07,6.95],[13,7.58],[9.05,8.81],[11,8.33],[14,7.66],[13.4,6.81],[10,6.33],[14,8.96],[12.5,6.82],[9.15,7.2],[11.5,7.2],[3.03,4.23],[12.2,7.83],[2.02,4.47],[1.05,3.33],[4.05,4.96],[6.03,7.24],[12,6.26],[12,8.84],[7.08,5.82],[5.02,5.68]],type:"scatter"}]},t.chartOptions)));return s({chartDOM:p,chartOptions:m,chartData:i((()=>t.chartData))}),(t,r)=>(e(),a("div",{ref_key:"dataChartScatter",ref:p,class:"data-chart-scatter"},null,512))}});export{p as default};
+import{defineComponent as t,ref as a,inject as e,computed as r,createElementBlock as s,openBlock as c}from"vue";import{InjectionChartMerge as o}from"../utils/injectionKeys.mjs";import{useCharts as i}from"../utils/useCharts.mjs";var p=t({name:"DataChartScatter",__name:"scatter",props:{chartData:{type:Object,required:!0,default:()=>({colDesc:[],xGroupByDesc:{colDesc:"",groupByDesc:"",groupByValues:[],xAxis:!1},groupByDesc:[],data:[],modelName:""})},chartOptions:{type:null,required:!0}},setup(t){const p=a(),u=e(o,(t=>t),!0),l=r((()=>u({xAxis:{},yAxis:{},series:[{symbolSize:20,data:[[10,8.04],[8.07,6.95],[13,7.58],[9.05,8.81],[11,8.33],[14,7.66],[13.4,6.81],[10,6.33],[14,8.96],[12.5,6.82],[9.15,7.2],[11.5,7.2],[3.03,4.23],[12.2,7.83],[2.02,4.47],[1.05,3.33],[4.05,4.96],[6.03,7.24],[12,6.26],[12,8.84],[7.08,5.82],[5.02,5.68]],type:"scatter"}]},t.chartOptions)));return i({chartDOM:p,chartOptions:l,chartData:r((()=>t.chartData))}),(t,a)=>(c(),s("div",{ref_key:"dataChartScatter",ref:p,class:"data-chart-scatter"},null,512))}});export{p as default};
 //# sourceMappingURL=scatter.vue.mjs.map

package/es/src/data-chart/src/components/scatter.vue.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"scatter.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/scatter.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { EChartsOption, IFormatPublicData } from '../types'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartScatter',\n})\n\nconst {\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n chartOptions,\n} = defineProps<{\n chartData: IFormatPublicData\n chartOptions: EChartsOption\n}>()\n\nconst dataChartScatter = ref()\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\n\nconst scatterChartOptions = computed<EChartsOption>(() => {\n const config = {\n xAxis: {},\n yAxis: {},\n series: [\n {\n symbolSize: 20,\n data: [\n [10.0, 8.04],\n [8.07, 6.95],\n [13.0, 7.58],\n [9.05, 8.81],\n [11.0, 8.33],\n [14.0, 7.66],\n [13.4, 6.81],\n [10.0, 6.33],\n [14.0, 8.96],\n [12.5, 6.82],\n [9.15, 7.2],\n [11.5, 7.2],\n [3.03, 4.23],\n [12.2, 7.83],\n [2.02, 4.47],\n [1.05, 3.33],\n [4.05, 4.96],\n [6.03, 7.24],\n [12.0, 6.26],\n [12.0, 8.84],\n [7.08, 5.82],\n [5.02, 5.68],\n ],\n type: 'scatter',\n },\n ],\n }\n\n return merge(config, chartOptions)\n})\nuseCharts({ chartDOM: dataChartScatter, chartOptions: scatterChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartScatter\" class=\"data-chart-scatter\" />\n</template>\n"],"names":["dataChartScatter","ref","merge","inject","InjectionChartMerge","v","scatterChartOptions","computed","xAxis","yAxis","series","symbolSize","data","type","__props","chartOptions","useCharts","chartDOM","chartData"],"mappings":"~~wgBA4BA~~,MAAMA,EAAmBC,IACnBC,EAAQC,EAAOC,GAAsBC,GAAWA,IAAG,GAEnDC,EAAsBC,GAAwB,IAoC3CL,EAnCQ,CACbM,MAAO,CAAC,EACRC,MAAO,CAAC,EACRC,OAAQ,CACN,CACEC,WAAY,GACZC,KAAM,CACJ,CAAC,GAAM,MACP,CAAC,KAAM,MACP,CAAC,GAAM,MACP,CAAC,KAAM,MACP,CAAC,GAAM,MACP,CAAC,GAAM,MACP,CAAC,KAAM,MACP,CAAC,GAAM,MACP,CAAC,GAAM,MACP,CAAC,KAAM,MACP,CAAC,KAAM,KACP,CAAC,KAAM,KACP,CAAC,KAAM,MACP,CAAC,KAAM,MACP,CAAC,KAAM,MACP,CAAC,KAAM,MACP,CAAC,KAAM,MACP,CAAC,KAAM,MACP,CAAC,GAAM,MACP,CAAC,GAAM,MACP,CAAC,KAAM,MACP,CAAC,KAAM,OAETC,KAAM,aAKSC,EAAYC,uBAEzBC,EAAA,CAAEC,SAAUjB,EAAkBe,aAAcT,EAAqBY,UAAWX,GAAS,IAAMO,EAAAI"}
1	+ {"version":3,"file":"scatter.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/scatter.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { EChartsOption, IFormatPublicData } from '../types'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartScatter',\n})\n\nconst {\n chartData = {\n colDesc: [],\n xGroupByDesc: {\n colDesc: '',\n groupByDesc: '',\n groupByValues: [],\n xAxis: false,\n },\n groupByDesc: [],\n data: [],\n modelName: '',\n },\n chartOptions,\n} = defineProps<{\n chartData: IFormatPublicData\n chartOptions: EChartsOption\n}>()\n\nconst dataChartScatter = ref()\nconst merge = inject(InjectionChartMerge, (v: any) => v, true)\n\nconst scatterChartOptions = computed<EChartsOption>(() => {\n const config = {\n xAxis: {},\n yAxis: {},\n series: [\n {\n symbolSize: 20,\n data: [\n [10.0, 8.04],\n [8.07, 6.95],\n [13.0, 7.58],\n [9.05, 8.81],\n [11.0, 8.33],\n [14.0, 7.66],\n [13.4, 6.81],\n [10.0, 6.33],\n [14.0, 8.96],\n [12.5, 6.82],\n [9.15, 7.2],\n [11.5, 7.2],\n [3.03, 4.23],\n [12.2, 7.83],\n [2.02, 4.47],\n [1.05, 3.33],\n [4.05, 4.96],\n [6.03, 7.24],\n [12.0, 6.26],\n [12.0, 8.84],\n [7.08, 5.82],\n [5.02, 5.68],\n ],\n type: 'scatter',\n },\n ],\n }\n\n return merge(config, chartOptions)\n})\nuseCharts({ chartDOM: dataChartScatter, chartOptions: scatterChartOptions, chartData: computed(() => chartData) })\n</script>\n\n<template>\n <div ref=\"dataChartScatter\" class=\"data-chart-scatter\" />\n</template>\n"],"names":["dataChartScatter","ref","merge","inject","InjectionChartMerge","v","scatterChartOptions","computed","xAxis","yAxis","series","symbolSize","data","type","__props","chartOptions","useCharts","chartDOM","chartData"],"mappings":"kfA4BA,MAAMA,EAAmBC,IACnBC,EAAQC,EAAOC,GAAsBC,GAAWA,IAAG,GAEnDC,EAAsBC,GAAwB,IAoC3CL,EAnCQ,CACbM,MAAO,CAAC,EACRC,MAAO,CAAC,EACRC,OAAQ,CACN,CACEC,WAAY,GACZC,KAAM,CACJ,CAAC,GAAM,MACP,CAAC,KAAM,MACP,CAAC,GAAM,MACP,CAAC,KAAM,MACP,CAAC,GAAM,MACP,CAAC,GAAM,MACP,CAAC,KAAM,MACP,CAAC,GAAM,MACP,CAAC,GAAM,MACP,CAAC,KAAM,MACP,CAAC,KAAM,KACP,CAAC,KAAM,KACP,CAAC,KAAM,MACP,CAAC,KAAM,MACP,CAAC,KAAM,MACP,CAAC,KAAM,MACP,CAAC,KAAM,MACP,CAAC,KAAM,MACP,CAAC,GAAM,MACP,CAAC,GAAM,MACP,CAAC,KAAM,MACP,CAAC,KAAM,OAETC,KAAM,aAKSC,EAAYC,uBAEzBC,EAAA,CAAEC,SAAUjB,EAAkBe,aAAcT,EAAqBY,UAAWX,GAAS,IAAMO,EAAAI"}

package/es/src/data-chart/src/components/table.vue.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{ElTable as t,ElTableColumn as e}from"element-plus/es";import{defineComponent as a,createElementBlock as o,openBlock as r,normalizeClass as l,unref as c,createCommentVNode as s,createVNode as p,createElementVNode as n,toDisplayString as i,withCtx as m,Fragment as d,renderList as h,createBlock as u,createTextVNode as D}from"vue";import f from"./empty.vue.mjs";import{useNamespace as b}from"@qxs-bns/hooks";import{computed as y}from"vue-demi";const w={key:0,class:"title"};var v=a({name:"DataChartTable",__name:"table",props:{chartData:{type:Object,default:()=>({colDesc:[],xGroupByDesc:[],data:[],modelName:""})}},setup(a){const v=a,g=b("data-chart"),x=y((()=>v.chartData.groupByDesc.find((t=>!t.xAxis))));function $(t){if(!t)return 100;const e=14*t.length+20+30;return e<100?100:e}return(b,y)=>{const v=e,_=t;return r(),o("div",{class:l([c(g).e("data-chart-table")])},[a.chartData.modelName?(r(),o("p",w,[n("span",null,i(a.chartData.modelName),1)])):s("v-if",!0),p(_,{class:"customize-table data-chart-table-content",data:a.chartData.data,stripe:"",height:"100%"},{empty:m((()=>[p(f)])),default:m((()=>[(r(!0),o(d,null,h(a.chartData.groupByDesc,((t,e)=>(r(),u(v,{key:`${t.colDesc}${t.groupByDesc}${e}`,align:"center","show-overflow-tooltip":"",sortable:"","min-width":`${$(t.colDesc)}px`,prop:t.colDesc||""},{header:m((()=>[D(i(t.colDesc),1)])),default:m((e=>[D(i((c(x)&&(c(x).colDesc,t.colDesc),e.row[t.colDesc||""]||"--")),1)])),_:2},1032,["min-width","prop"])))),128)),(r(!0),o(d,null,h(a.chartData.colDesc,((t,e)=>(r(),u(v,{key:t+e,align:"center","min-width":`${$(t)}px`,label:t,"show-overflow-tooltip":"",sortable:"",prop:t},{header:m((()=>[D(i(t),1)])),_:2},1032,["min-width","label","prop"])))),128))])),_:1},8,["data"])],2)}}});export{v as default};
+import{ElTable as t,ElTableColumn as e}from"element-plus/es";import{defineComponent as a,computed as o,createElementBlock as r,openBlock as l,normalizeClass as c,unref as s,createCommentVNode as p,createVNode as n,createElementVNode as i,toDisplayString as m,withCtx as h,Fragment as d,renderList as u,createBlock as D,createTextVNode as f}from"vue";import b from"./empty.vue.mjs";import{useNamespace as y}from"@qxs-bns/hooks";const w={key:0,class:"title"};var g=a({name:"DataChartTable",__name:"table",props:{chartData:{type:Object,default:()=>({colDesc:[],xGroupByDesc:[],data:[],modelName:""})}},setup(a){const g=a,v=y("data-chart"),x=o((()=>g.chartData.groupByDesc.find((t=>!t.xAxis))));function $(t){if(!t)return 100;const e=14*t.length+20+30;return e<100?100:e}return(o,y)=>{const g=e,_=t;return l(),r("div",{class:c([s(v).e("data-chart-table")])},[a.chartData.modelName?(l(),r("p",w,[i("span",null,m(a.chartData.modelName),1)])):p("v-if",!0),n(_,{class:"customize-table data-chart-table-content",data:a.chartData.data,stripe:"",height:"100%"},{empty:h((()=>[n(b)])),default:h((()=>[(l(!0),r(d,null,u(a.chartData.groupByDesc,((t,e)=>(l(),D(g,{key:`${t.colDesc}${t.groupByDesc}${e}`,align:"center","show-overflow-tooltip":"",sortable:"","min-width":`${$(t.colDesc)}px`,prop:t.colDesc||""},{header:h((()=>[f(m(t.colDesc),1)])),default:h((e=>[f(m((s(x)&&(s(x).colDesc,t.colDesc),e.row[t.colDesc||""]||"--")),1)])),_:2},1032,["min-width","prop"])))),128)),(l(!0),r(d,null,u(a.chartData.colDesc,((t,e)=>(l(),D(g,{key:t+e,align:"center","min-width":`${$(t)}px`,label:t,"show-overflow-tooltip":"",sortable:"",prop:t},{header:h((()=>[f(m(t),1)])),_:2},1032,["min-width","label","prop"])))),128))])),_:1},8,["data"])],2)}}});export{g as default};
 //# sourceMappingURL=table.vue.mjs.map

package/es/src/data-chart/src/components/table.vue.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"table.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/table.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { PropType } from 'vue'\nimport type { IFormatPublicData } from '../types'\nimport Empty from './empty.vue'\nimport { useNamespace } from '@qxs-bns/hooks'\n\ndefineOptions({\n name: 'DataChartTable',\n})\n\nconst props = defineProps({\n chartData: {\n type: Object as PropType<IFormatPublicData>,\n default: () => ({\n colDesc: [],\n xGroupByDesc: [],\n data: [],\n modelName: '',\n }),\n },\n})\n\nconst ns = useNamespace('data-chart')\n\nconst yGroupByDesc = computed(() => {\n const row = props.chartData.groupByDesc.find(item => !item.xAxis)\n return row\n})\n\nfunction baseWidth(str: string \| null) {\n if (!str) {\n return 100\n }\n const strWidth = str.length * 14 + 20 + 30\n return strWidth < 100 ? 100 : strWidth\n}\n</script>\n\n<template>\n <div :class=\"[ns.e('data-chart-table')]\">\n <p v-if=\"chartData.modelName\" class=\"title\">\n <span>{{ chartData.modelName }}</span>\n </p>\n <el-table\n class=\"customize-table data-chart-table-content\"\n :data=\"chartData.data\"\n stripe\n height=\"100%\"\n >\n <el-table-column\n v-for=\"(item, index) in chartData.groupByDesc\"\n :key=\"`${item.colDesc}${item.groupByDesc}${index}`\"\n align=\"center\"\n show-overflow-tooltip\n sortable\n :min-width=\"`${baseWidth(item.colDesc)}px`\"\n :prop=\"item.colDesc \|\| ''\"\n >\n <template #header>\n {{ item.colDesc }}\n </template>\n <template #default=\"scoped\">\n {{ (yGroupByDesc && yGroupByDesc.colDesc === item.colDesc ? scoped.row[item.colDesc \|\| ''] : scoped.row[item.colDesc \|\| '']) \|\| '--' }}\n </template>\n </el-table-column>\n <el-table-column\n v-for=\"(item, index) in chartData.colDesc\"\n :key=\"item + index\"\n align=\"center\"\n :min-width=\"`${baseWidth(item)}px`\"\n :label=\"item\"\n show-overflow-tooltip\n sortable\n :prop=\"item\"\n >\n <template #header>\n {{ item }}\n </template>\n </el-table-column>\n <template #empty>\n <Empty />\n </template>\n </el-table>\n </div>\n</template>"],"names":["props","__props","ns","useNamespace","yGroupByDesc","computed","chartData","groupByDesc","find","item","xAxis","baseWidth","str","strWidth","length"],"mappings":"~~snBAUA~~,MAAMA,EAAQC,EAYRC,EAAKC,EAAa,cAElBC,EAAeC,GAAS,IAChBL,EAAMM,UAAUC,YAAYC,MAAaC,IAACA,EAAKC,UAI7D,SAASC,EAAUC,GACjB,IAAKA,EACI,OAAA,IAET,MAAMC,EAAwB,GAAbD,EAAIE,OAAc,GAAK,GACjC,OAAAD,EAAW,IAAM,IAAMA,CAAA"}
1	+ {"version":3,"file":"table.vue.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/table.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { PropType } from 'vue'\nimport type { IFormatPublicData } from '../types'\nimport Empty from './empty.vue'\nimport { useNamespace } from '@qxs-bns/hooks'\n\ndefineOptions({\n name: 'DataChartTable',\n})\n\nconst props = defineProps({\n chartData: {\n type: Object as PropType<IFormatPublicData>,\n default: () => ({\n colDesc: [],\n xGroupByDesc: [],\n data: [],\n modelName: '',\n }),\n },\n})\n\nconst ns = useNamespace('data-chart')\n\nconst yGroupByDesc = computed(() => {\n const row = props.chartData.groupByDesc.find(item => !item.xAxis)\n return row\n})\n\nfunction baseWidth(str: string \| null) {\n if (!str) {\n return 100\n }\n const strWidth = str.length * 14 + 20 + 30\n return strWidth < 100 ? 100 : strWidth\n}\n</script>\n\n<template>\n <div :class=\"[ns.e('data-chart-table')]\">\n <p v-if=\"chartData.modelName\" class=\"title\">\n <span>{{ chartData.modelName }}</span>\n </p>\n <el-table\n class=\"customize-table data-chart-table-content\"\n :data=\"chartData.data\"\n stripe\n height=\"100%\"\n >\n <el-table-column\n v-for=\"(item, index) in chartData.groupByDesc\"\n :key=\"`${item.colDesc}${item.groupByDesc}${index}`\"\n align=\"center\"\n show-overflow-tooltip\n sortable\n :min-width=\"`${baseWidth(item.colDesc)}px`\"\n :prop=\"item.colDesc \|\| ''\"\n >\n <template #header>\n {{ item.colDesc }}\n </template>\n <template #default=\"scoped\">\n {{ (yGroupByDesc && yGroupByDesc.colDesc === item.colDesc ? scoped.row[item.colDesc \|\| ''] : scoped.row[item.colDesc \|\| '']) \|\| '--' }}\n </template>\n </el-table-column>\n <el-table-column\n v-for=\"(item, index) in chartData.colDesc\"\n :key=\"item + index\"\n align=\"center\"\n :min-width=\"`${baseWidth(item)}px`\"\n :label=\"item\"\n show-overflow-tooltip\n sortable\n :prop=\"item\"\n >\n <template #header>\n {{ item }}\n </template>\n </el-table-column>\n <template #empty>\n <Empty />\n </template>\n </el-table>\n </div>\n</template>"],"names":["props","__props","ns","useNamespace","yGroupByDesc","computed","chartData","groupByDesc","find","item","xAxis","baseWidth","str","strWidth","length"],"mappings":"gmBAUA,MAAMA,EAAQC,EAYRC,EAAKC,EAAa,cAElBC,EAAeC,GAAS,IAChBL,EAAMM,UAAUC,YAAYC,MAAaC,IAACA,EAAKC,UAI7D,SAASC,EAAUC,GACjB,IAAKA,EACI,OAAA,IAET,MAAMC,EAAwB,GAAbD,EAAIE,OAAc,GAAK,GACjC,OAAAD,EAAW,IAAM,IAAMA,CAAA"}

package/es/src/data-chart/src/data-chart.vue.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineComponent as e,createBlock as t,openBlock as o,resolveDynamicComponent as r,unref as s,normalizeClass as a}from"vue";import{JsonToExcel as m}from"@qxs-bns/utils";import{cloneDeep as p,merge as n}from"lodash-es";import{defaultChartOption as i}from"./utils/config.mjs";import{InjectionChartMerge as c}from"./utils/injectionKeys.mjs";import{useDataToExcelJson as u}from"./utils/useCharts.mjs";import{useNamespace as l}from"@qxs-bns/hooks";import d from"./components/table.vue.mjs";import f from"./components/bar.vue.mjs";import h from"./components/line.vue.mjs";import y from"./components/pie.vue.mjs";import j from"./components/radar.vue.mjs";import v from"./components/scatter.vue.mjs";import b from"./components/funnel.vue.mjs";import g from"./components/area.vue.mjs";import w from"./components/card.vue.mjs";import x from"./components/scatter-simple.vue.mjs";import{computed as D,provide as S}from"vue-demi";var q=e({name:"QxsDataChart",__name:"data-chart",props:{modelName:{type:String,required:!1,default:""},showTypeName:{type:String,required:!1,default:"table"},subShowType:{type:String,required:!1},data:{type:Object,required:!1,default:()=>({data:[],desc:{colDesc:[],showDesc:{showType:0,chartOptions:"{}",jsCodeSnippet:""},groupByDesc:[]}})},chartOptions:{type:null,required:!1,default:()=>({})},jsCodeSnippet:{type:String,required:!1,default:""}},setup(e,{expose:q}){const T=l("data-chart"),N={table:d,bar:f,line:h,pie:y,radar:j,scatter:v,funnel:b,area:g,card:w,"scatter-simple":x},B=D((()=>p(i[e.showTypeName]))),C=D((()=>{const{desc:{colDesc:t=[],groupByDesc:o=[]}={},data:r=[]}=e.data;let s=[],a=null;s=o?.map((e=>(e.xAxis&&(a=e),e)));const m=a?r.filter((e=>e&&e[a.colDesc])):r;return{colDesc:t,modelName:e.modelName,subShowType:e.subShowType,xGroupByDesc:a||{groupByDesc:null,groupByValues:null,colDesc:null,xAxis:!1},groupByDesc:s,data:m}}));return q({exportExal:function(){if(0===e.data.data.length)return void console.log("暂无数据");const t=u(e.data);m(e.modelName,t)}}),S(c,(function(t,o){let r=n({},B.value,t,o)||{};if(e.jsCodeSnippet)try{r=new Function("config",`"use strict"; ${e.jsCodeSnippet}; return config;`)(r)}catch(e){console.error("代码执行失败:",e)}return r})),(e,m)=>(o(),t(r(N[e.showTypeName]),{class:a([s(T).e("wrapper")]),"sub-show-type":e.subShowType,"chart-data":s(C),"chart-options":e.chartOptions},null,8,["class","sub-show-type","chart-data","chart-options"]))}});export{q as default};
+import{defineComponent as e,computed as t,provide as o,createBlock as r,openBlock as s,resolveDynamicComponent as a,unref as p,normalizeClass as m}from"vue";import{JsonToExcel as n}from"@qxs-bns/utils";import{cloneDeep as c,merge as i}from"lodash-es";import{defaultChartOption as u}from"./utils/config.mjs";import{InjectionChartMerge as l}from"./utils/injectionKeys.mjs";import{useDataToExcelJson as d}from"./utils/useCharts.mjs";import{useNamespace as f}from"@qxs-bns/hooks";import h from"./components/table.vue.mjs";import y from"./components/bar.vue.mjs";import j from"./components/line.vue.mjs";import b from"./components/pie.vue.mjs";import g from"./components/radar.vue.mjs";import v from"./components/scatter.vue.mjs";import w from"./components/funnel.vue.mjs";import x from"./components/area.vue.mjs";import D from"./components/card.vue.mjs";import S from"./components/scatter-simple.vue.mjs";var q=e({name:"QxsDataChart",__name:"data-chart",props:{modelName:{type:String,required:!1,default:""},showTypeName:{type:String,required:!1,default:"table"},subShowType:{type:String,required:!1},data:{type:Object,required:!1,default:()=>({data:[],desc:{colDesc:[],showDesc:{showType:0,chartOptions:"{}",jsCodeSnippet:""},groupByDesc:[]}})},chartOptions:{type:null,required:!1,default:()=>({})},jsCodeSnippet:{type:String,required:!1,default:""}},setup(e,{expose:q}){const T=f("data-chart"),N={table:h,bar:y,line:j,pie:b,radar:g,scatter:v,funnel:w,area:x,card:D,"scatter-simple":S},B=t((()=>c(u[e.showTypeName]))),C=t((()=>{const{desc:{colDesc:t=[],groupByDesc:o=[]}={},data:r=[]}=e.data;let s=[],a=null;s=o?.map((e=>(e.xAxis&&(a=e),e)));const p=a?r.filter((e=>e&&e[a.colDesc])):r;return{colDesc:t,modelName:e.modelName,subShowType:e.subShowType,xGroupByDesc:a||{groupByDesc:null,groupByValues:null,colDesc:null,xAxis:!1},groupByDesc:s,data:p}}));return q({exportExal:function(){if(0===e.data.data.length)return void console.log("暂无数据");const t=d(e.data);n(e.modelName,t)}}),o(l,(function(t,o){let r=i({},B.value,t,o)||{};if(e.jsCodeSnippet)try{r=new Function("config",`"use strict"; ${e.jsCodeSnippet}; return config;`)(r)}catch(e){console.error("代码执行失败:",e)}return r})),(e,t)=>(s(),r(a(N[e.showTypeName]),{class:m([p(T).e("wrapper")]),"sub-show-type":e.subShowType,"chart-data":p(C),"chart-options":e.chartOptions},null,8,["class","sub-show-type","chart-data","chart-options"]))}});export{q as default};
 //# sourceMappingURL=data-chart.vue.mjs.map

package/es/src/data-chart/src/data-chart.vue.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-chart.vue.mjs","sources":["../../../../../../packages/components/src/data-chart/src/data-chart.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { EChartData, EChartsOption, IFormatPublicData } from './types'\nimport type { IconRow } from './types/index'\nimport { JsonToExcel } from '@qxs-bns/utils'\nimport { cloneDeep, merge as lodashMerge } from 'lodash-es'\nimport { defaultChartOption } from './utils/config'\nimport { InjectionChartMerge } from './utils/injectionKeys'\nimport { useDataToExcelJson } from './utils/useCharts'\nimport { useNamespace } from '@qxs-bns/hooks'\nimport Table from './components/table.vue'\nimport Bar from './components/bar.vue'\nimport Line from './components/line.vue'\nimport Pie from './components/pie.vue'\nimport Radar from './components/radar.vue'\nimport Scatter from './components/scatter.vue'\nimport Funnel from './components/funnel.vue'\nimport Area from './components/area.vue'\nimport Card from './components/card.vue'\nimport ScatterSimple from './components/scatter-simple.vue'\n\ndefineOptions({\n name: 'QxsDataChart',\n})\n\nconst ns = useNamespace('data-chart')\n\nconst {\n showTypeName = 'table',\n subShowType,\n modelName = '',\n data: propData = {\n data: [],\n desc: {\n colDesc: [],\n showDesc: {\n showType: 0,\n chartOptions: '{}',\n jsCodeSnippet: '',\n },\n groupByDesc: [],\n },\n },\n chartOptions = {},\n jsCodeSnippet = '',\n} = defineProps<{\n modelName?: string\n showTypeName?: IconRow['showTypeName']\n subShowType?: string\n data?: EChartData\n chartOptions?: EChartsOption\n jsCodeSnippet?: string\n}>()\n\nconst coms: {\n [key: string]: any\n} = {\n table: Table,\n bar: Bar,\n line: Line,\n pie: Pie,\n radar: Radar,\n scatter: Scatter,\n funnel: Funnel,\n area: Area,\n card: Card,\n 'scatter-simple':ScatterSimple,\n}\n\nconst defaultChartOptionCopy = computed(() => {\n return cloneDeep(defaultChartOption[showTypeName])\n})\n\nconst formatPublicData = computed<IFormatPublicData>(() => {\n const { desc: { colDesc = [], groupByDesc = [] } = {}, data = [] } = propData\n\n // 处理 X 轴数据\n let xValue = []\n\n let xGroupByDesc: EChartData['desc']['groupByDesc'][0] \| null = null\n xValue = groupByDesc?.map((groupByDescItem) => {\n // if (groupByDescItem.colValues) {\n // groupByDescItem.colValuesDesc = {}\n // groupByDescItem.colValues.split(',')?.forEach((item) => {\n // const [key, value] = item.split(':')\n // groupByDescItem.colValuesDesc[key] = value\n // })\n // }\n if (groupByDescItem.xAxis) {\n xGroupByDesc = groupByDescItem\n }\n return groupByDescItem\n })\n\n const dataValue = xGroupByDesc ? data.filter(item => item && item[xGroupByDesc!.colDesc!]) : data\n\n // if (xGroupByDesc && xGroupByDesc.colValuesDesc && Object.keys(xGroupByDesc.colValuesDesc).length) {\n // const { colDesc: colDescItem, colValuesDesc } = xGroupByDesc\n // console.log('colDesc: colDescItem, colValuesDesc: ', colDescItem, colValuesDesc)\n // dataValue = dataValue.map((item) => {\n // if (typeof item[colDescItem] === 'number') {\n // item[colDescItem] = colValuesDesc[item[colDescItem]]\n // }\n // return item\n // })\n // }\n\n return {\n colDesc,\n modelName,\n subShowType,\n xGroupByDesc: (xGroupByDesc \|\| {\n groupByDesc: null,\n groupByValues: null,\n colDesc: null,\n xAxis: false,\n }),\n groupByDesc: xValue,\n data: dataValue,\n }\n})\n\n// 导出数据\nfunction exportExal() {\n if (propData.data.length === 0) {\n // useMessage.error('暂无数据')\n console.log('暂无数据')\n return\n }\n const arr = useDataToExcelJson(propData)\n JsonToExcel(modelName, arr)\n}\nfunction merge(config: EChartsOption, defaultConfig: EChartsOption) {\n const mergeOpt = lodashMerge({}, defaultChartOptionCopy.value, config, defaultConfig)\n let conf = mergeOpt \|\| {}\n if (jsCodeSnippet) {\n try {\n // 用 Function 构造函数替代 eval\n const dynamicFunction = new Function(\n 'config',\n `\"use strict\"; ${jsCodeSnippet}; return config;`\n );\n \n // 执行动态函数并传递 conf 参数\n conf = dynamicFunction(conf);\n } catch (error) {\n console.error(\"代码执行失败:\", error);\n }\n }\n return conf\n}\n\n\ndefineExpose({\n exportExal,\n})\nprovide(InjectionChartMerge, merge)\n</script>\n\n<template>\n <component\n :is=\"coms[showTypeName]\"\n :class=\"[ns.e('wrapper')]\"\n :sub-show-type=\"subShowType\"\n :chart-data=\"formatPublicData\"\n :chart-options=\"chartOptions\"\n />\n</template>\n"],"names":["ns","useNamespace","coms","table","Table","bar","Bar","line","Line","pie","Pie","radar","Radar","scatter","Scatter","funnel","Funnel","area","Area","card","Card","ScatterSimple","defaultChartOptionCopy","computed","cloneDeep","defaultChartOption","__props","formatPublicData","desc","colDesc","groupByDesc","data","xValue","xGroupByDesc","map","groupByDescItem","xAxis","dataValue","filter","item","modelName","subShowType","groupByValues","__expose","exportExal","length","console","log","arr","useDataToExcelJson","JsonToExcel","provide","InjectionChartMerge","config","defaultConfig","conf","lodashMerge","value","jsCodeSnippet","Function","dynamicFunction","error"],"mappings":"~~82CAwBM~~,MAAAA,EAAKC,EAAa,cA6BlBC,EAEF,CACFC,MAAOC,EACPC,IAAKC,EACLC,KAAMC,EACNC,IAAKC,EACLC,MAAOC,EACPC,QAASC,EACTC,OAAQC,EACRC,KAAMC,EACNC,KAAMC,EACN,iBAAiBC,GAGbC,EAAyBC,GAAS,IAC/BC,EAAUC,EAAmBC,mBAGhCC,EAAmBJ,GAA4B,KACnD,MAAQK,MAAMC,QAAEA,EAAU,eAAIC,EAAc,IAAO,CAAI,EAAAC,KAAAA,EAAO,IAAOL,EAAAK,KAGrE,IAAIC,EAAS,GAETC,EAA4D,KACvDD,EAAAF,GAAaI,KAAKC,IAQrBA,EAAgBC,QACHH,EAAAE,GAEVA,KAGH,MAAAE,EAAYJ,EAAeF,EAAKO,QAAOC,GAAQA,GAAQA,EAAKN,EAAcJ,WAAaE,EAatF,MAAA,CACLF,UACAW,UAASd,EAAAc,UACTC,YAAWf,EAAAe,YACXR,aAAeA,GAAgB,CAC7BH,YAAa,KACbY,cAAe,KACfb,QAAS,KACTO,OAAO,GAETN,YAAaE,EACbD,KAAMM,EACR,WAkCWM,EAAA,CACXC,WA/BF,WACE,GAA6B,IAAzBlB,OAASK,KAAKc,OAGhB,YADAC,QAAQC,IAAI,QAGR,MAAAC,EAAMC,EAAmBvB,EAAQK,MAC3BmB,EAAAxB,EAAAc,UAAWQ,EAAG,IA0B5BG,EAAQC,GAxBC,SAAMC,EAAuBC,GAEhC,IAAAC,EADaC,EAAY,GAAIlC,EAAuBmC,MAAOJ,EAAQC,IAChD,CAAC,EACxB,GAAI5B,EAAAgC,cACE,IAQFH,EANwB,IAAII,SAC1B,SACA,iBAAiBjC,EAAAgC,gCAIZE,CAAgBL,SAChBM,GACCf,QAAAe,MAAM,UAAWA,EAAK,CAG3B,OAAAN,CAAA"}
1	+ {"version":3,"file":"data-chart.vue.mjs","sources":["../../../../../../packages/components/src/data-chart/src/data-chart.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { EChartData, EChartsOption, IFormatPublicData } from './types'\nimport type { IconRow } from './types/index'\nimport { JsonToExcel } from '@qxs-bns/utils'\nimport { cloneDeep, merge as lodashMerge } from 'lodash-es'\nimport { defaultChartOption } from './utils/config'\nimport { InjectionChartMerge } from './utils/injectionKeys'\nimport { useDataToExcelJson } from './utils/useCharts'\nimport { useNamespace } from '@qxs-bns/hooks'\nimport Table from './components/table.vue'\nimport Bar from './components/bar.vue'\nimport Line from './components/line.vue'\nimport Pie from './components/pie.vue'\nimport Radar from './components/radar.vue'\nimport Scatter from './components/scatter.vue'\nimport Funnel from './components/funnel.vue'\nimport Area from './components/area.vue'\nimport Card from './components/card.vue'\nimport ScatterSimple from './components/scatter-simple.vue'\n\ndefineOptions({\n name: 'QxsDataChart',\n})\n\nconst ns = useNamespace('data-chart')\n\nconst {\n showTypeName = 'table',\n subShowType,\n modelName = '',\n data: propData = {\n data: [],\n desc: {\n colDesc: [],\n showDesc: {\n showType: 0,\n chartOptions: '{}',\n jsCodeSnippet: '',\n },\n groupByDesc: [],\n },\n },\n chartOptions = {},\n jsCodeSnippet = '',\n} = defineProps<{\n modelName?: string\n showTypeName?: IconRow['showTypeName']\n subShowType?: string\n data?: EChartData\n chartOptions?: EChartsOption\n jsCodeSnippet?: string\n}>()\n\nconst coms: {\n [key: string]: any\n} = {\n table: Table,\n bar: Bar,\n line: Line,\n pie: Pie,\n radar: Radar,\n scatter: Scatter,\n funnel: Funnel,\n area: Area,\n card: Card,\n 'scatter-simple':ScatterSimple,\n}\n\nconst defaultChartOptionCopy = computed(() => {\n return cloneDeep(defaultChartOption[showTypeName])\n})\n\nconst formatPublicData = computed<IFormatPublicData>(() => {\n const { desc: { colDesc = [], groupByDesc = [] } = {}, data = [] } = propData\n\n // 处理 X 轴数据\n let xValue = []\n\n let xGroupByDesc: EChartData['desc']['groupByDesc'][0] \| null = null\n xValue = groupByDesc?.map((groupByDescItem) => {\n // if (groupByDescItem.colValues) {\n // groupByDescItem.colValuesDesc = {}\n // groupByDescItem.colValues.split(',')?.forEach((item) => {\n // const [key, value] = item.split(':')\n // groupByDescItem.colValuesDesc[key] = value\n // })\n // }\n if (groupByDescItem.xAxis) {\n xGroupByDesc = groupByDescItem\n }\n return groupByDescItem\n })\n\n const dataValue = xGroupByDesc ? data.filter(item => item && item[xGroupByDesc!.colDesc!]) : data\n\n // if (xGroupByDesc && xGroupByDesc.colValuesDesc && Object.keys(xGroupByDesc.colValuesDesc).length) {\n // const { colDesc: colDescItem, colValuesDesc } = xGroupByDesc\n // console.log('colDesc: colDescItem, colValuesDesc: ', colDescItem, colValuesDesc)\n // dataValue = dataValue.map((item) => {\n // if (typeof item[colDescItem] === 'number') {\n // item[colDescItem] = colValuesDesc[item[colDescItem]]\n // }\n // return item\n // })\n // }\n\n return {\n colDesc,\n modelName,\n subShowType,\n xGroupByDesc: (xGroupByDesc \|\| {\n groupByDesc: null,\n groupByValues: null,\n colDesc: null,\n xAxis: false,\n }),\n groupByDesc: xValue,\n data: dataValue,\n }\n})\n\n// 导出数据\nfunction exportExal() {\n if (propData.data.length === 0) {\n // useMessage.error('暂无数据')\n console.log('暂无数据')\n return\n }\n const arr = useDataToExcelJson(propData)\n JsonToExcel(modelName, arr)\n}\nfunction merge(config: EChartsOption, defaultConfig: EChartsOption) {\n const mergeOpt = lodashMerge({}, defaultChartOptionCopy.value, config, defaultConfig)\n let conf = mergeOpt \|\| {}\n if (jsCodeSnippet) {\n try {\n // 用 Function 构造函数替代 eval\n const dynamicFunction = new Function(\n 'config',\n `\"use strict\"; ${jsCodeSnippet}; return config;`\n );\n \n // 执行动态函数并传递 conf 参数\n conf = dynamicFunction(conf);\n } catch (error) {\n console.error(\"代码执行失败:\", error);\n }\n }\n return conf\n}\n\n\ndefineExpose({\n exportExal,\n})\nprovide(InjectionChartMerge, merge)\n</script>\n\n<template>\n <component\n :is=\"coms[showTypeName]\"\n :class=\"[ns.e('wrapper')]\"\n :sub-show-type=\"subShowType\"\n :chart-data=\"formatPublicData\"\n :chart-options=\"chartOptions\"\n />\n</template>\n"],"names":["ns","useNamespace","coms","table","Table","bar","Bar","line","Line","pie","Pie","radar","Radar","scatter","Scatter","funnel","Funnel","area","Area","card","Card","ScatterSimple","defaultChartOptionCopy","computed","cloneDeep","defaultChartOption","__props","formatPublicData","desc","colDesc","groupByDesc","data","xValue","xGroupByDesc","map","groupByDescItem","xAxis","dataValue","filter","item","modelName","subShowType","groupByValues","__expose","exportExal","length","console","log","arr","useDataToExcelJson","JsonToExcel","provide","InjectionChartMerge","config","defaultConfig","conf","lodashMerge","value","jsCodeSnippet","Function","dynamicFunction","error"],"mappings":"w1CAwBM,MAAAA,EAAKC,EAAa,cA6BlBC,EAEF,CACFC,MAAOC,EACPC,IAAKC,EACLC,KAAMC,EACNC,IAAKC,EACLC,MAAOC,EACPC,QAASC,EACTC,OAAQC,EACRC,KAAMC,EACNC,KAAMC,EACN,iBAAiBC,GAGbC,EAAyBC,GAAS,IAC/BC,EAAUC,EAAmBC,mBAGhCC,EAAmBJ,GAA4B,KACnD,MAAQK,MAAMC,QAAEA,EAAU,eAAIC,EAAc,IAAO,CAAI,EAAAC,KAAAA,EAAO,IAAOL,EAAAK,KAGrE,IAAIC,EAAS,GAETC,EAA4D,KACvDD,EAAAF,GAAaI,KAAKC,IAQrBA,EAAgBC,QACHH,EAAAE,GAEVA,KAGH,MAAAE,EAAYJ,EAAeF,EAAKO,QAAOC,GAAQA,GAAQA,EAAKN,EAAcJ,WAAaE,EAatF,MAAA,CACLF,UACAW,UAASd,EAAAc,UACTC,YAAWf,EAAAe,YACXR,aAAeA,GAAgB,CAC7BH,YAAa,KACbY,cAAe,KACfb,QAAS,KACTO,OAAO,GAETN,YAAaE,EACbD,KAAMM,EACR,WAkCWM,EAAA,CACXC,WA/BF,WACE,GAA6B,IAAzBlB,OAASK,KAAKc,OAGhB,YADAC,QAAQC,IAAI,QAGR,MAAAC,EAAMC,EAAmBvB,EAAQK,MAC3BmB,EAAAxB,EAAAc,UAAWQ,EAAG,IA0B5BG,EAAQC,GAxBC,SAAMC,EAAuBC,GAEhC,IAAAC,EADaC,EAAY,GAAIlC,EAAuBmC,MAAOJ,EAAQC,IAChD,CAAC,EACxB,GAAI5B,EAAAgC,cACE,IAQFH,EANwB,IAAII,SAC1B,SACA,iBAAiBjC,EAAAgC,gCAIZE,CAAgBL,SAChBM,GACCf,QAAAe,MAAM,UAAWA,EAAK,CAG3B,OAAAN,CAAA"}

package/es/src/data-chart/src/utils/useCharts.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{useMouseInElement as e,watchDebounced as t,useElementSize as o}from"@vueuse/core";import*as i from"echarts";import a from"../components/empty.svg.mjs";import{ref as n,onMounted as l,onUnmounted as r}from"vue-demi";function s(o){let{chartDOM:s,chartData:u,chartOptions:d,mountedBefore:v,initAfter:m,callback:f}=o,p=null;const g=n(!1),h=window.devicePixelRatio||1;function x(){p&&!p.isDisposed()&&(p.dispose(),p=null)}function y(){if(p&&g.value&&s.value){p.showLoading();try{p.isDisposed()&&(p=i.init(s.value,null,{devicePixelRatio:h,renderer:"svg"})),p.setOption(...arguments)}catch(e){console.log("error: ",e),x(),s.value&&(p=i.init(s.value,null,{devicePixelRatio:h,renderer:"svg"}),D("配置项错误"))}finally{p?.hideLoading()}}}const{isOutside:w}=e(s);function D(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"暂无数据";y({title:[{text:u.value?.modelName,...d.value.title},{subtext:e,top:"center",left:"center",text:" {a|}",itemGap:-20,textStyle:{align:"center",rich:{a:{color:"#000",fontSize:"16",height:80,width:160,backgroundColor:{image:a}}}},subtextStyle:{fontSize:16}}]},{notMerge:!0,replaceMerge:["xAxis","yAxis","series"],lazyUpdate:!1})}return t(w,(e=>{var t;"boolean"==typeof e&&(t=!e,p?.isDisposed()||p?.setOption({toolbox:{show:t}}))}),{debounce:200}),l((async()=>{v&&await v(),s.value&&(x(),p=i.init(s.value,null,{devicePixelRatio:h,renderer:"svg"}),f&&f(p),m&&await m(),c(p,s),g.value=!0,u.value?.data?.length?y(d.value,{}):D())})),r((()=>{p&&(p.getZr()?.off("mousemove"),p.getZr()?.off("mouseout"),x())})),{myChart:p}}function c(e,i){const{width:a,height:n}=o(i);t([a,n],(()=>{e&&e.resize()}))}function u(e){const{desc:{colDesc:t=[],groupByDesc:o=[]}={},data:i=[]}=e,a=[...o.map((e=>e.colDesc)),...t].filter((e=>e)),n=i.map((e=>a.map((t=>e[t]||""))));return[a,...n]}export{s as useCharts,u as useDataToExcelJson,c as useResize};
+import*as e from"echarts";import t from"../components/empty.svg.mjs";import{ref as o,onMounted as i,onUnmounted as a}from"vue";import{useMouseInElement as n,watchDebounced as l,useElementSize as r}from"@vueuse/core";function s(r){let{chartDOM:s,chartData:u,chartOptions:d,mountedBefore:v,initAfter:f,callback:m}=r,p=null;const g=o(!1),h=window.devicePixelRatio||1;function x(){p&&!p.isDisposed()&&(p.dispose(),p=null)}function y(){if(p&&g.value&&s.value){p.showLoading();try{p.isDisposed()&&(p=e.init(s.value,null,{devicePixelRatio:h,renderer:"svg"})),p.setOption(...arguments)}catch(t){console.log("error: ",t),x(),s.value&&(p=e.init(s.value,null,{devicePixelRatio:h,renderer:"svg"}),D("配置项错误"))}finally{p?.hideLoading()}}}const{isOutside:w}=n(s);function D(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"暂无数据";y({title:[{text:u.value?.modelName,...d.value.title},{subtext:e,top:"center",left:"center",text:" {a|}",itemGap:-20,textStyle:{align:"center",rich:{a:{color:"#000",fontSize:"16",height:80,width:160,backgroundColor:{image:t}}}},subtextStyle:{fontSize:16}}]},{notMerge:!0,replaceMerge:["xAxis","yAxis","series"],lazyUpdate:!1})}return l(w,(e=>{var t;"boolean"==typeof e&&(t=!e,p?.isDisposed()||p?.setOption({toolbox:{show:t}}))}),{debounce:200}),i((async()=>{v&&await v(),s.value&&(x(),p=e.init(s.value,null,{devicePixelRatio:h,renderer:"svg"}),m&&m(p),f&&await f(),c(p,s),g.value=!0,u.value?.data?.length?y(d.value,{}):D())})),a((()=>{p&&(p.getZr()?.off("mousemove"),p.getZr()?.off("mouseout"),x())})),{myChart:p}}function c(e,t){const{width:o,height:i}=r(t);l([o,i],(()=>{e&&e.resize()}))}function u(e){const{desc:{colDesc:t=[],groupByDesc:o=[]}={},data:i=[]}=e,a=[...o.map((e=>e.colDesc)),...t].filter((e=>e)),n=i.map((e=>a.map((t=>e[t]||""))));return[a,...n]}export{s as useCharts,u as useDataToExcelJson,c as useResize};
 //# sourceMappingURL=useCharts.mjs.map

package/es/src/data-chart/src/utils/useCharts.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useCharts.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/utils/useCharts.ts"],"sourcesContent":["import type { ECharts, SetOptionOpts } from 'echarts'\nimport type { ComputedRef, Ref } from 'vue'\nimport type { EChartData, EChartsOption, IFormatPublicData } from '../types'\nimport ~~{ useElementSize, useMouseInElement, watchDebounced } from '@vueuse/core'\nimport~~ * as echarts from 'echarts'\n\n// 使用别名路径导入 SVG\nimport emptyImg from '../components/empty.svg'\n\nexport function useCharts({ chartDOM, chartData, chartOptions, mountedBefore, initAfter, callback }: {\n chartDOM: Ref<HTMLElement \| null>\n chartData: ComputedRef<IFormatPublicData>\n chartOptions: ComputedRef<EChartsOption>\n mountedBefore?: () => void\n initAfter?: () => void\n callback?: (e: ECharts) => void\n}) {\n let myChart: ECharts \| null = null\n const initChartSuccess = ref(false)\n\n // 获取设备像素比\n const dpr = window.devicePixelRatio \|\| 1\n\n function disposeChart() {\n if (myChart && !myChart.isDisposed()) {\n myChart.dispose()\n myChart = null\n }\n }\n\n function initChart(...opt: [EChartsOption, SetOptionOpts]) {\n if (!myChart \|\| !initChartSuccess.value \|\| !chartDOM.value) {\n return\n }\n\n myChart.showLoading()\n try {\n if (myChart.isDisposed()) {\n // 如果实例已被销毁，重新创建\n myChart = echarts.init(chartDOM.value, null, {\n devicePixelRatio: dpr,\n renderer: 'svg',\n })\n }\n myChart.setOption(...opt)\n }\n catch (error) {\n console.log('error: ', error)\n disposeChart()\n if (chartDOM.value) {\n myChart = echarts.init(chartDOM.value, null, {\n devicePixelRatio: dpr,\n renderer: 'svg',\n })\n setEmpty('配置项错误')\n }\n }\n finally {\n myChart?.hideLoading()\n }\n }\n\n const { isOutside: mouseInChart } = useMouseInElement(chartDOM)\n watchDebounced(mouseInChart, (newVal) => {\n if (typeof newVal !== 'boolean') {\n return\n }\n toggleToolbox(!newVal)\n }, { debounce: 200 })\n\n function setEmpty(subtext = '暂无数据') {\n const obj: EChartsOption = {\n title: [{\n text: chartData.value?.modelName,\n ...chartOptions.value.title,\n }, {\n subtext,\n top: 'center',\n left: 'center',\n text: ' {a\|}',\n itemGap: -20,\n textStyle: {\n align: 'center',\n rich: {\n a: {\n color: '#000',\n fontSize: '16',\n height: 80,\n width: 160,\n backgroundColor: {\n image: emptyImg,\n },\n },\n },\n },\n subtextStyle: {\n fontSize: 16,\n },\n }],\n }\n initChart(obj, {\n notMerge: true,\n replaceMerge: ['xAxis', 'yAxis', 'series'],\n lazyUpdate: false,\n })\n }\n\n function toggleToolbox(show: boolean) {\n if (!myChart?.isDisposed()) {\n myChart?.setOption({\n toolbox: {\n show,\n },\n })\n }\n }\n\n onMounted(async () => {\n if (mountedBefore) {\n await mountedBefore()\n }\n if (!chartDOM.value) {\n return\n }\n disposeChart() // 确保旧实例被清理\n myChart = echarts.init(chartDOM.value, null, {\n devicePixelRatio: dpr,\n renderer: 'svg',\n })\n if (callback) {\n callback(myChart)\n }\n if (initAfter) {\n await initAfter()\n }\n\n useResize(myChart, chartDOM)\n\n initChartSuccess.value = true\n\n if (chartData.value?.data?.length) {\n initChart(chartOptions.value, {})\n }\n else {\n setEmpty()\n }\n })\n\n onUnmounted(() => {\n if (myChart) {\n myChart.getZr()?.off('mousemove')\n myChart.getZr()?.off('mouseout')\n disposeChart()\n }\n })\n\n return {\n myChart,\n }\n}\n\nexport function useResize(myChart: ECharts, chartDOM: Ref<HTMLElement \| null>) {\n const { width, height } = useElementSize(chartDOM)\n watchDebounced([width, height], () => {\n if (myChart) {\n myChart.resize()\n }\n })\n}\n\nexport function useDataToExcelJson(dataSource: EChartData) {\n const { desc: { colDesc = [], groupByDesc = [] } = {}, data = [] } = dataSource\n const header = [...groupByDesc.map(item => item.colDesc), ...colDesc].filter(v => v) as string[]\n const json = data.map((item) => {\n return header.map((headerItem) => {\n return item[headerItem as keyof typeof item] \|\| ''\n })\n })\n return [header, ...json]\n}\n"],"names":["useCharts","_ref","chartDOM","chartData","chartOptions","mountedBefore","initAfter","callback","myChart","initChartSuccess","ref","dpr","window","devicePixelRatio","disposeChart","isDisposed","dispose","initChart","value","showLoading","echarts","init","renderer","setOption","arguments","error","console","log","setEmpty","hideLoading","isOutside","mouseInChart","useMouseInElement","subtext","title","text","modelName","top","left","itemGap","textStyle","align","rich","a","color","fontSize","height","width","backgroundColor","image","emptyImg","subtextStyle","notMerge","replaceMerge","lazyUpdate","watchDebounced","newVal","show","toolbox","debounce","onMounted","async","useResize","data","length","onUnmounted","getZr","off","useElementSize","resize","useDataToExcelJson","dataSource","desc","colDesc","groupByDesc","header","map","item","filter","v","json","headerItem"],"mappings":"~~6NASgB~~,SAAAA,EAAAC,GAOb,IAPuBC,SAAEA,EAAUC,UAAAA,EAAAC,aAAWA,gBAAcC,EAAeC,UAAAA,EAAAC,SAAWA,GAOtFN,EACGO,EAA0B,KACxB,MAAAC,EAAmBC,GAAI,GAGvBC,EAAMC,OAAOC,kBAAoB,EAEvC,SAASC,IACHN,IAAYA,EAAQO,eACtBP,EAAQQ,UACER,EAAA,KAEd,CAEA,SAASS,IACP,GAAKT,GAAYC,EAAiBS,OAAUhB,EAASgB,MAArD,CAIAV,EAAQW,cACJ,IACEX,EAAQO,eAEVP,EAAUY,EAAQC,KAAKnB,EAASgB,MAAO,KAAM,CAC3CL,iBAAkBF,EAClBW,SAAU,SAGNd,EAAAe,aAAUC,iBAEbC,GACGC,QAAAC,IAAI,UAAWF,GACVX,IACTZ,EAASgB,QACXV,EAAUY,EAAQC,KAAKnB,EAASgB,MAAO,KAAM,CAC3CL,iBAAkBF,EAClBW,SAAU,QAEZM,EAAS,SAEb,CACA,QACEpB,GAASqB,aACX,CA1BA,CA2BF,CAEA,MAAQC,UAAWC,GAAiBC,EAAkB9B,GAQ7C,SAAA0B,IAA2B,IAAlBK,yDAAU,OA8B1BhB,EA7B2B,CACzBiB,MAAO,CAAC,CACNC,KAAMhC,EAAUe,OAAOkB,aACpBhC,EAAac,MAAMgB,OACrB,CACDD,UACAI,IAAK,SACLC,KAAM,SACNH,KAAM,QACNI,SAAS,GACTC,UAAW,CACTC,MAAO,SACPC,KAAM,CACJC,EAAG,CACDC,MAAO,OACPC,SAAU,KACVC,OAAQ,GACRC,MAAO,IACPC,gBAAiB,CACfC,MAAOC,MAKfC,aAAc,CACZN,SAAU,OAID,CACbO,UAAU,EACVC,aAAc,CAAC,QAAS,QAAS,UACjCC,YAAY,GAEhB,CAmDO,OA7FQC,EAAAxB,GAAeyB,IA4C9B,IAAuBC,EA3CC,kBAAXD,IA2CUC,GAxCND,EAyCVhD,GAASO,cACZP,GAASe,UAAU,CACjBmC,QAAS,CACPD,UA5Ce,GACpB,CAAEE,SAAU,MAiDfC,GAAUC,UACJxD,SACIA,IAEHH,EAASgB,QAGDJ,IACbN,EAAUY,EAAQC,KAAKnB,EAASgB,MAAO,KAAM,CAC3CL,iBAAkBF,EAClBW,SAAU,QAERf,GACFA,EAASC,GAEPF,SACIA,IAGRwD,EAAUtD,EAASN,GAEnBO,EAAiBS,OAAQ,EAErBf,EAAUe,OAAO6C,MAAMC,OACf/C,EAAAb,EAAac,MAAO,IAGrBU,IACX,IAGFqC,GAAY,KACNzD,IACMA,EAAA0D,SAASC,IAAI,aACb3D,EAAA0D,SAASC,IAAI,YACRrD,IACf,IAGK,CACLN,UAEJ,CAEgB,SAAAsD,EAAUtD,EAAkBN,GAC1C,MAAM6C,MAAEA,EAAAD,OAAOA,GAAWsB,EAAelE,GACzCqD,EAAe,CAACR,EAAOD,IAAS,KAC1BtC,GACFA,EAAQ6D,QACV,GAEJ,CAEO,SAASC,EAAmBC,GACjC,MAAQC,MAAMC,QAAEA,EAAU,GAAIC,YAAAA,EAAc,IAAO,CAAC,EAAAX,KAAGA,EAAO,IAAOQ,EAC/DI,EAAS,IAAID,EAAYE,KAAYC,GAAAA,EAAKJ,aAAaA,GAASK,WAAYC,IAC5EC,EAAOjB,EAAKa,KAAKC,GACdF,EAAOC,KAAKK,GACVJ,EAAKI,IAAoC,OAG7C,MAAA,CAACN,KAAWK,EACrB"}
1	+ {"version":3,"file":"useCharts.mjs","sources":["../../../../../../../packages/components/src/data-chart/src/utils/useCharts.ts"],"sourcesContent":["import type { ECharts, SetOptionOpts } from 'echarts'\nimport type { ComputedRef, Ref } from 'vue'\nimport type { EChartData, EChartsOption, IFormatPublicData } from '../types'\nimport * as echarts from 'echarts'\n\n// 使用别名路径导入 SVG\nimport emptyImg from '../components/empty.svg'\n\nexport function useCharts({ chartDOM, chartData, chartOptions, mountedBefore, initAfter, callback }: {\n chartDOM: Ref<HTMLElement \| null>\n chartData: ComputedRef<IFormatPublicData>\n chartOptions: ComputedRef<EChartsOption>\n mountedBefore?: () => void\n initAfter?: () => void\n callback?: (e: ECharts) => void\n}) {\n let myChart: ECharts \| null = null\n const initChartSuccess = ref(false)\n\n // 获取设备像素比\n const dpr = window.devicePixelRatio \|\| 1\n\n function disposeChart() {\n if (myChart && !myChart.isDisposed()) {\n myChart.dispose()\n myChart = null\n }\n }\n\n function initChart(...opt: [EChartsOption, SetOptionOpts]) {\n if (!myChart \|\| !initChartSuccess.value \|\| !chartDOM.value) {\n return\n }\n\n myChart.showLoading()\n try {\n if (myChart.isDisposed()) {\n // 如果实例已被销毁，重新创建\n myChart = echarts.init(chartDOM.value, null, {\n devicePixelRatio: dpr,\n renderer: 'svg',\n })\n }\n myChart.setOption(...opt)\n }\n catch (error) {\n console.log('error: ', error)\n disposeChart()\n if (chartDOM.value) {\n myChart = echarts.init(chartDOM.value, null, {\n devicePixelRatio: dpr,\n renderer: 'svg',\n })\n setEmpty('配置项错误')\n }\n }\n finally {\n myChart?.hideLoading()\n }\n }\n\n const { isOutside: mouseInChart } = useMouseInElement(chartDOM)\n watchDebounced(mouseInChart, (newVal) => {\n if (typeof newVal !== 'boolean') {\n return\n }\n toggleToolbox(!newVal)\n }, { debounce: 200 })\n\n function setEmpty(subtext = '暂无数据') {\n const obj: EChartsOption = {\n title: [{\n text: chartData.value?.modelName,\n ...chartOptions.value.title,\n }, {\n subtext,\n top: 'center',\n left: 'center',\n text: ' {a\|}',\n itemGap: -20,\n textStyle: {\n align: 'center',\n rich: {\n a: {\n color: '#000',\n fontSize: '16',\n height: 80,\n width: 160,\n backgroundColor: {\n image: emptyImg,\n },\n },\n },\n },\n subtextStyle: {\n fontSize: 16,\n },\n }],\n }\n initChart(obj, {\n notMerge: true,\n replaceMerge: ['xAxis', 'yAxis', 'series'],\n lazyUpdate: false,\n })\n }\n\n function toggleToolbox(show: boolean) {\n if (!myChart?.isDisposed()) {\n myChart?.setOption({\n toolbox: {\n show,\n },\n })\n }\n }\n\n onMounted(async () => {\n if (mountedBefore) {\n await mountedBefore()\n }\n if (!chartDOM.value) {\n return\n }\n disposeChart() // 确保旧实例被清理\n myChart = echarts.init(chartDOM.value, null, {\n devicePixelRatio: dpr,\n renderer: 'svg',\n })\n if (callback) {\n callback(myChart)\n }\n if (initAfter) {\n await initAfter()\n }\n\n useResize(myChart, chartDOM)\n\n initChartSuccess.value = true\n\n if (chartData.value?.data?.length) {\n initChart(chartOptions.value, {})\n }\n else {\n setEmpty()\n }\n })\n\n onUnmounted(() => {\n if (myChart) {\n myChart.getZr()?.off('mousemove')\n myChart.getZr()?.off('mouseout')\n disposeChart()\n }\n })\n\n return {\n myChart,\n }\n}\n\nexport function useResize(myChart: ECharts, chartDOM: Ref<HTMLElement \| null>) {\n const { width, height } = useElementSize(chartDOM)\n watchDebounced([width, height], () => {\n if (myChart) {\n myChart.resize()\n }\n })\n}\n\nexport function useDataToExcelJson(dataSource: EChartData) {\n const { desc: { colDesc = [], groupByDesc = [] } = {}, data = [] } = dataSource\n const header = [...groupByDesc.map(item => item.colDesc), ...colDesc].filter(v => v) as string[]\n const json = data.map((item) => {\n return header.map((headerItem) => {\n return item[headerItem as keyof typeof item] \|\| ''\n })\n })\n return [header, ...json]\n}\n"],"names":["useCharts","_ref","chartDOM","chartData","chartOptions","mountedBefore","initAfter","callback","myChart","initChartSuccess","ref","dpr","window","devicePixelRatio","disposeChart","isDisposed","dispose","initChart","value","showLoading","echarts","init","renderer","setOption","arguments","error","console","log","setEmpty","hideLoading","isOutside","mouseInChart","useMouseInElement","subtext","title","text","modelName","top","left","itemGap","textStyle","align","rich","a","color","fontSize","height","width","backgroundColor","image","emptyImg","subtextStyle","notMerge","replaceMerge","lazyUpdate","watchDebounced","newVal","show","toolbox","debounce","onMounted","async","useResize","data","length","onUnmounted","getZr","off","useElementSize","resize","useDataToExcelJson","dataSource","desc","colDesc","groupByDesc","header","map","item","filter","v","json","headerItem"],"mappings":"wNAQgB,SAAAA,EAAAC,GAOb,IAPuBC,SAAEA,EAAUC,UAAAA,EAAAC,aAAWA,gBAAcC,EAAeC,UAAAA,EAAAC,SAAWA,GAOtFN,EACGO,EAA0B,KACxB,MAAAC,EAAmBC,GAAI,GAGvBC,EAAMC,OAAOC,kBAAoB,EAEvC,SAASC,IACHN,IAAYA,EAAQO,eACtBP,EAAQQ,UACER,EAAA,KAEd,CAEA,SAASS,IACP,GAAKT,GAAYC,EAAiBS,OAAUhB,EAASgB,MAArD,CAIAV,EAAQW,cACJ,IACEX,EAAQO,eAEVP,EAAUY,EAAQC,KAAKnB,EAASgB,MAAO,KAAM,CAC3CL,iBAAkBF,EAClBW,SAAU,SAGNd,EAAAe,aAAUC,iBAEbC,GACGC,QAAAC,IAAI,UAAWF,GACVX,IACTZ,EAASgB,QACXV,EAAUY,EAAQC,KAAKnB,EAASgB,MAAO,KAAM,CAC3CL,iBAAkBF,EAClBW,SAAU,QAEZM,EAAS,SAEb,CACA,QACEpB,GAASqB,aACX,CA1BA,CA2BF,CAEA,MAAQC,UAAWC,GAAiBC,EAAkB9B,GAQ7C,SAAA0B,IAA2B,IAAlBK,yDAAU,OA8B1BhB,EA7B2B,CACzBiB,MAAO,CAAC,CACNC,KAAMhC,EAAUe,OAAOkB,aACpBhC,EAAac,MAAMgB,OACrB,CACDD,UACAI,IAAK,SACLC,KAAM,SACNH,KAAM,QACNI,SAAS,GACTC,UAAW,CACTC,MAAO,SACPC,KAAM,CACJC,EAAG,CACDC,MAAO,OACPC,SAAU,KACVC,OAAQ,GACRC,MAAO,IACPC,gBAAiB,CACfC,MAAOC,MAKfC,aAAc,CACZN,SAAU,OAID,CACbO,UAAU,EACVC,aAAc,CAAC,QAAS,QAAS,UACjCC,YAAY,GAEhB,CAmDO,OA7FQC,EAAAxB,GAAeyB,IA4C9B,IAAuBC,EA3CC,kBAAXD,IA2CUC,GAxCND,EAyCVhD,GAASO,cACZP,GAASe,UAAU,CACjBmC,QAAS,CACPD,UA5Ce,GACpB,CAAEE,SAAU,MAiDfC,GAAUC,UACJxD,SACIA,IAEHH,EAASgB,QAGDJ,IACbN,EAAUY,EAAQC,KAAKnB,EAASgB,MAAO,KAAM,CAC3CL,iBAAkBF,EAClBW,SAAU,QAERf,GACFA,EAASC,GAEPF,SACIA,IAGRwD,EAAUtD,EAASN,GAEnBO,EAAiBS,OAAQ,EAErBf,EAAUe,OAAO6C,MAAMC,OACf/C,EAAAb,EAAac,MAAO,IAGrBU,IACX,IAGFqC,GAAY,KACNzD,IACMA,EAAA0D,SAASC,IAAI,aACb3D,EAAA0D,SAASC,IAAI,YACRrD,IACf,IAGK,CACLN,UAEJ,CAEgB,SAAAsD,EAAUtD,EAAkBN,GAC1C,MAAM6C,MAAEA,EAAAD,OAAOA,GAAWsB,EAAelE,GACzCqD,EAAe,CAACR,EAAOD,IAAS,KAC1BtC,GACFA,EAAQ6D,QACV,GAEJ,CAEO,SAASC,EAAmBC,GACjC,MAAQC,MAAMC,QAAEA,EAAU,GAAIC,YAAAA,EAAc,IAAO,CAAC,EAAAX,KAAGA,EAAO,IAAOQ,EAC/DI,EAAS,IAAID,EAAYE,KAAYC,GAAAA,EAAKJ,aAAaA,GAASK,WAAYC,IAC5EC,EAAOjB,EAAKa,KAAKC,GACdF,EAAOC,KAAKK,GACVJ,EAAKI,IAAoC,OAG7C,MAAA,CAACN,KAAWK,EACrB"}