@qxs-bns/components 0.0.55 → 0.0.57
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.
- package/es/index.mjs +1 -1
- package/es/index.mjs.map +1 -1
- package/es/node_modules/.pnpm/@iconify_vue@5.0.0_vue@3.5.18_typescript@5.8.3_/node_modules/@iconify/vue/dist/iconify.mjs +2 -0
- package/es/node_modules/.pnpm/{@iconify_vue@5.0.0_vue@3.5.13_typescript@5.8.2_ → @iconify_vue@5.0.0_vue@3.5.18_typescript@5.8.3_}/node_modules/@iconify/vue/dist/iconify.mjs.map +1 -1
- package/es/package.json.mjs +1 -1
- package/es/src/components.mjs +1 -1
- package/es/src/data-chart/src/analyze.mjs +1 -1
- package/es/src/data-chart/src/analyze.mjs.map +1 -1
- package/es/src/data-chart/src/components/area.vue2.mjs +1 -1
- package/es/src/data-chart/src/components/area.vue2.mjs.map +1 -1
- package/es/src/data-chart/src/components/bar.vue.mjs +1 -1
- package/es/src/data-chart/src/components/bar.vue.mjs.map +1 -1
- package/es/src/data-chart/src/components/card.vue2.mjs +1 -1
- package/es/src/data-chart/src/components/card.vue2.mjs.map +1 -1
- package/es/src/data-chart/src/components/data-chart-card-bg-left.svg.mjs.map +1 -1
- package/es/src/data-chart/src/components/data-chart-card-bg-right.svg.mjs.map +1 -1
- package/es/src/data-chart/src/components/empty.svg.mjs.map +1 -1
- package/es/src/data-chart/src/components/empty.vue.mjs.map +1 -1
- package/es/src/data-chart/src/components/funnel.vue.mjs +1 -1
- package/es/src/data-chart/src/components/funnel.vue.mjs.map +1 -1
- package/es/src/data-chart/src/components/line.vue2.mjs +1 -1
- package/es/src/data-chart/src/components/line.vue2.mjs.map +1 -1
- package/es/src/data-chart/src/components/pie.vue.mjs +1 -1
- package/es/src/data-chart/src/components/pie.vue.mjs.map +1 -1
- package/es/src/data-chart/src/components/radar.vue.mjs +1 -1
- package/es/src/data-chart/src/components/radar.vue.mjs.map +1 -1
- package/es/src/data-chart/src/components/scatter-simple.vue.mjs +1 -1
- package/es/src/data-chart/src/components/scatter-simple.vue.mjs.map +1 -1
- package/es/src/data-chart/src/components/scatter.vue.mjs +1 -1
- package/es/src/data-chart/src/components/scatter.vue.mjs.map +1 -1
- package/es/src/data-chart/src/components/table.vue.mjs +1 -1
- package/es/src/data-chart/src/components/table.vue.mjs.map +1 -1
- package/es/src/data-chart/src/data-chart.vue.mjs +1 -1
- package/es/src/data-chart/src/data-chart.vue.mjs.map +1 -1
- package/es/src/data-chart/src/utils/config.mjs +1 -1
- package/es/src/data-chart/src/utils/config.mjs.map +1 -1
- package/es/src/data-chart/src/utils/mapData.mjs +2 -0
- package/es/src/data-chart/src/utils/mapData.mjs.map +1 -0
- package/es/src/data-chart/src/utils/safe-eval.mjs.map +1 -1
- package/es/src/data-chart/src/utils/useCharts.mjs +1 -1
- package/es/src/data-chart/src/utils/useCharts.mjs.map +1 -1
- package/es/src/defaults.mjs.map +1 -1
- package/es/src/file-upload/src/file-upload.vue.mjs +1 -1
- package/es/src/file-upload/src/file-upload.vue.mjs.map +1 -1
- package/es/src/fixed-action-bar/src/fixed-action-bar.vue.mjs +1 -1
- package/es/src/fixed-action-bar/src/fixed-action-bar.vue.mjs.map +1 -1
- package/es/src/icon/index.mjs +1 -1
- package/es/src/icon/index.mjs.map +1 -1
- package/es/src/icon/src/icon.vue.mjs +1 -1
- package/es/src/icon/src/icon.vue.mjs.map +1 -1
- package/es/src/image-upload/src/image-upload.vue.mjs +1 -1
- package/es/src/image-upload/src/image-upload.vue.mjs.map +1 -1
- package/es/src/make-installer.mjs.map +1 -1
- package/es/src/photo-crop-tool/src/composables.mjs +1 -1
- package/es/src/photo-crop-tool/src/composables.mjs.map +1 -1
- package/es/src/photo-crop-tool/src/photo-crop-tool.vue.mjs +1 -1
- package/es/src/photo-crop-tool/src/photo-crop-tool.vue.mjs.map +1 -1
- package/es/src/subject-action/src/subject-action.vue.mjs +1 -1
- package/es/src/subject-action/src/subject-action.vue.mjs.map +1 -1
- package/es/src/subject-layout/src/subject-layout.vue.mjs.map +1 -1
- package/es/src/subject-list/src/components/SubjectPageEnd.vue.mjs +1 -1
- package/es/src/subject-list/src/components/SubjectPageEnd.vue.mjs.map +1 -1
- package/es/src/subject-list/src/components/SubjectRichText.vue.mjs +1 -1
- package/es/src/subject-list/src/components/SubjectRichText.vue.mjs.map +1 -1
- package/es/src/subject-list/src/components/subject-blank-fill.vue.mjs +1 -1
- package/es/src/subject-list/src/components/subject-blank-fill.vue.mjs.map +1 -1
- package/es/src/subject-list/src/components/subject-scale.vue.mjs +1 -1
- package/es/src/subject-list/src/components/subject-scale.vue.mjs.map +1 -1
- package/es/src/subject-list/src/components/subject-single.vue.mjs +1 -1
- package/es/src/subject-list/src/components/subject-single.vue.mjs.map +1 -1
- package/es/src/subject-list/src/components/subject-text-fill.vue.mjs +1 -1
- package/es/src/subject-list/src/components/subject-text-fill.vue.mjs.map +1 -1
- package/es/src/subject-list/src/subject-list.vue.mjs +1 -1
- package/es/src/subject-list/src/subject-list.vue.mjs.map +1 -1
- package/es/src/subject-type/src/subject-type.vue.mjs +1 -1
- package/es/src/subject-type/src/subject-type.vue.mjs.map +1 -1
- package/es/src/tiny-mce-editor/src/tiny-mce-editor.vue.mjs +1 -1
- package/es/src/tiny-mce-editor/src/tiny-mce-editor.vue.mjs.map +1 -1
- package/es/src/withInstall.mjs.map +1 -1
- package/lib/index.cjs +1 -1
- package/lib/index.cjs.map +1 -1
- package/lib/node_modules/.pnpm/@iconify_vue@5.0.0_vue@3.5.18_typescript@5.8.3_/node_modules/@iconify/vue/dist/iconify.cjs +2 -0
- package/lib/node_modules/.pnpm/{@iconify_vue@5.0.0_vue@3.5.13_typescript@5.8.2_ → @iconify_vue@5.0.0_vue@3.5.18_typescript@5.8.3_}/node_modules/@iconify/vue/dist/iconify.cjs.map +1 -1
- package/lib/package.json.cjs +1 -1
- package/lib/src/components.cjs +1 -1
- package/lib/src/data-chart/index.cjs.map +1 -1
- package/lib/src/data-chart/src/analyze.cjs +1 -1
- package/lib/src/data-chart/src/analyze.cjs.map +1 -1
- package/lib/src/data-chart/src/components/area.vue2.cjs +1 -1
- package/lib/src/data-chart/src/components/area.vue2.cjs.map +1 -1
- package/lib/src/data-chart/src/components/bar.vue.cjs +1 -1
- package/lib/src/data-chart/src/components/bar.vue.cjs.map +1 -1
- package/lib/src/data-chart/src/components/card.vue2.cjs +1 -1
- package/lib/src/data-chart/src/components/card.vue2.cjs.map +1 -1
- package/lib/src/data-chart/src/components/empty.vue.cjs.map +1 -1
- package/lib/src/data-chart/src/components/funnel.vue.cjs +1 -1
- package/lib/src/data-chart/src/components/funnel.vue.cjs.map +1 -1
- package/lib/src/data-chart/src/components/line.vue2.cjs +1 -1
- package/lib/src/data-chart/src/components/line.vue2.cjs.map +1 -1
- package/lib/src/data-chart/src/components/pie.vue.cjs +1 -1
- package/lib/src/data-chart/src/components/pie.vue.cjs.map +1 -1
- package/lib/src/data-chart/src/components/radar.vue.cjs +1 -1
- package/lib/src/data-chart/src/components/radar.vue.cjs.map +1 -1
- package/lib/src/data-chart/src/components/scatter-simple.vue.cjs +1 -1
- package/lib/src/data-chart/src/components/scatter-simple.vue.cjs.map +1 -1
- package/lib/src/data-chart/src/components/scatter.vue.cjs +1 -1
- package/lib/src/data-chart/src/components/scatter.vue.cjs.map +1 -1
- package/lib/src/data-chart/src/components/table.vue.cjs +1 -1
- package/lib/src/data-chart/src/components/table.vue.cjs.map +1 -1
- package/lib/src/data-chart/src/data-chart.vue.cjs +1 -1
- package/lib/src/data-chart/src/data-chart.vue.cjs.map +1 -1
- package/lib/src/data-chart/src/utils/config.cjs +1 -1
- package/lib/src/data-chart/src/utils/config.cjs.map +1 -1
- package/lib/src/data-chart/src/utils/mapData.cjs +2 -0
- package/lib/src/data-chart/src/utils/mapData.cjs.map +1 -0
- package/lib/src/data-chart/src/utils/safe-eval.cjs.map +1 -1
- package/lib/src/data-chart/src/utils/useCharts.cjs +1 -1
- package/lib/src/data-chart/src/utils/useCharts.cjs.map +1 -1
- package/lib/src/defaults.cjs.map +1 -1
- package/lib/src/file-upload/index.cjs.map +1 -1
- package/lib/src/file-upload/src/file-upload.vue.cjs +1 -1
- package/lib/src/file-upload/src/file-upload.vue.cjs.map +1 -1
- package/lib/src/fixed-action-bar/index.cjs.map +1 -1
- package/lib/src/fixed-action-bar/src/fixed-action-bar.vue.cjs +1 -1
- package/lib/src/fixed-action-bar/src/fixed-action-bar.vue.cjs.map +1 -1
- package/lib/src/icon/index.cjs +1 -1
- package/lib/src/icon/index.cjs.map +1 -1
- package/lib/src/icon/src/icon.vue.cjs +1 -1
- package/lib/src/icon/src/icon.vue.cjs.map +1 -1
- package/lib/src/image-upload/index.cjs.map +1 -1
- package/lib/src/image-upload/src/image-upload.vue.cjs +1 -1
- package/lib/src/image-upload/src/image-upload.vue.cjs.map +1 -1
- package/lib/src/make-installer.cjs.map +1 -1
- package/lib/src/photo-crop-tool/index.cjs.map +1 -1
- package/lib/src/photo-crop-tool/src/composables.cjs +1 -1
- package/lib/src/photo-crop-tool/src/composables.cjs.map +1 -1
- package/lib/src/photo-crop-tool/src/photo-crop-tool.vue.cjs +1 -1
- package/lib/src/photo-crop-tool/src/photo-crop-tool.vue.cjs.map +1 -1
- package/lib/src/subject-action/index.cjs.map +1 -1
- package/lib/src/subject-action/src/subject-action.vue.cjs +1 -1
- package/lib/src/subject-action/src/subject-action.vue.cjs.map +1 -1
- package/lib/src/subject-layout/index.cjs.map +1 -1
- package/lib/src/subject-layout/src/subject-layout.vue.cjs.map +1 -1
- package/lib/src/subject-list/index.cjs.map +1 -1
- package/lib/src/subject-list/src/components/SubjectPageEnd.vue.cjs +1 -1
- package/lib/src/subject-list/src/components/SubjectPageEnd.vue.cjs.map +1 -1
- package/lib/src/subject-list/src/components/SubjectRichText.vue.cjs +1 -1
- package/lib/src/subject-list/src/components/SubjectRichText.vue.cjs.map +1 -1
- package/lib/src/subject-list/src/components/subject-blank-fill.vue.cjs +1 -1
- package/lib/src/subject-list/src/components/subject-blank-fill.vue.cjs.map +1 -1
- package/lib/src/subject-list/src/components/subject-scale.vue.cjs +1 -1
- package/lib/src/subject-list/src/components/subject-scale.vue.cjs.map +1 -1
- package/lib/src/subject-list/src/components/subject-single.vue.cjs +1 -1
- package/lib/src/subject-list/src/components/subject-single.vue.cjs.map +1 -1
- package/lib/src/subject-list/src/components/subject-text-fill.vue.cjs +1 -1
- package/lib/src/subject-list/src/components/subject-text-fill.vue.cjs.map +1 -1
- package/lib/src/subject-list/src/subject-list.vue.cjs +1 -1
- package/lib/src/subject-list/src/subject-list.vue.cjs.map +1 -1
- package/lib/src/subject-type/index.cjs.map +1 -1
- package/lib/src/subject-type/src/subject-type.vue.cjs +1 -1
- package/lib/src/subject-type/src/subject-type.vue.cjs.map +1 -1
- package/lib/src/tiny-mce-editor/index.cjs.map +1 -1
- package/lib/src/tiny-mce-editor/src/tiny-mce-editor.vue.cjs +1 -1
- package/lib/src/tiny-mce-editor/src/tiny-mce-editor.vue.cjs.map +1 -1
- package/lib/src/withInstall.cjs.map +1 -1
- package/package.json +3 -2
- package/types/src/components.d.ts +1 -1
- package/types/src/components.d.ts.map +1 -1
- package/types/src/data-chart/src/components/area.vue.d.ts.map +1 -1
- package/types/src/data-chart/src/utils/config.d.ts.map +1 -1
- package/types/src/data-chart/src/utils/mapData.d.ts +64 -0
- package/types/src/data-chart/src/utils/mapData.d.ts.map +1 -0
- package/types/src/data-chart/src/utils/types.d.ts +4 -0
- package/types/src/data-chart/src/utils/types.d.ts.map +1 -1
- package/types/src/data-chart/src/utils/useCharts.d.ts +3 -4
- package/types/src/data-chart/src/utils/useCharts.d.ts.map +1 -1
- package/types/src/fixed-action-bar/index.d.ts +1 -1
- package/types/src/fixed-action-bar/src/fixed-action-bar.vue.d.ts +1 -1
- package/types/src/fixed-action-bar/src/fixed-action-bar.vue.d.ts.map +1 -1
- package/types/src/icon/index.d.ts +3 -3
- package/types/src/icon/index.d.ts.map +1 -1
- package/types/src/image-upload/index.d.ts +3 -2
- package/types/src/image-upload/index.d.ts.map +1 -1
- package/types/src/image-upload/src/image-upload.vue.d.ts +2 -80
- package/types/src/image-upload/src/image-upload.vue.d.ts.map +1 -1
- package/types/src/subject-layout/index.d.ts +5 -3
- package/types/src/subject-layout/index.d.ts.map +1 -1
- package/types/src/subject-layout/src/subject-layout.vue.d.ts +2 -24
- package/types/src/subject-layout/src/subject-layout.vue.d.ts.map +1 -1
- package/types/src/tiny-mce-editor/index.d.ts.map +1 -1
- package/types/tsconfig.tsbuildinfo +1 -1
- package/es/node_modules/.pnpm/@iconify_vue@5.0.0_vue@3.5.13_typescript@5.8.2_/node_modules/@iconify/vue/dist/iconify.mjs +0 -2
- package/lib/node_modules/.pnpm/@iconify_vue@5.0.0_vue@3.5.13_typescript@5.8.2_/node_modules/@iconify/vue/dist/iconify.cjs +0 -2
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"analyze.cjs","sources":["../../../../../../packages/components/src/data-chart/src/analyze.ts"],"sourcesContent":["import type { EChartData } from './utils/types'\n\n// 根据路径获取对象的值\nexport function getObjectValue(obj: any, pathArr: string[]) {\n return pathArr?.reduce((acc, key) => (acc ? acc[key] : undefined), obj)\n}\n\n// 谁 是什么 的分析\ninterface IHandlerFunction {\n handler?: ({ sourceData, dealJson }: { sourceData: EChartData['data'], dealJson: any }) => string | number\n dealOptSchema?: {\n label: string\n cascaderProps: {\n value: string\n label: string\n }\n select: any[]\n interactionType?: 'select' | 'input'\n }[]\n}\nexport interface IkeysMap {\n [key: string]: IHandlerFunction | IkeysMap\n}\nexport const keysMap: IkeysMap = {\n 描述性分析: {\n 平均值: {\n handler: ({ sourceData, dealJson }) => {\n const { dealKey } = dealJson\n const sortedData = sourceData.sort((a, b) => Number(b[dealKey]) - Number(a[dealKey]))\n const average = (sortedData.reduce((a, b) => a + Number(b[dealKey]), 0) / sortedData.length).toFixed(2)\n return average || ''\n },\n },\n 中位数: {\n dealOptSchema: [{\n label: '目标值类型',\n cascaderProps: { value: 'label', label: 'label' },\n select: [{\n label: '值',\n }, {\n label: '名字',\n }],\n interactionType: 'select',\n }],\n handler: ({ sourceData, dealJson }) => {\n const { dealKey, source, dealOpt } = dealJson\n const targetKeyPath = dealOpt['目标值类型']?.keyPath\n const sortedData = sourceData.sort((a, b) => Number(b[dealKey]) - Number(a[dealKey]))\n return sortedData[Math.floor(sortedData.length / 2)][targetKeyPath === '值' ? dealKey : targetKeyPath === '名字' ? source : ''] || ''\n },\n },\n 排序: {\n dealOptSchema: [\n {\n label: '排序方式',\n cascaderProps: { value: 'label', label: 'label' },\n select: [{\n label: '默认',\n children: [{\n label: '第几名',\n valueVerify: {\n type: 'number',\n default: 1,\n },\n }, {\n label: '范围',\n valueVerify: {\n type: 'number[]',\n default: [1, 2],\n },\n }],\n }, {\n label: '升序',\n children: [{\n label: '第几名',\n valueVerify: {\n type: 'number',\n default: 1,\n },\n }, {\n label: '范围',\n valueVerify: {\n type: 'number[]',\n default: [1, 2],\n },\n }],\n }, {\n label: '降序',\n children: [{\n label: '第几名',\n valueVerify: {\n type: 'number',\n default: 1,\n },\n }, {\n label: '范围',\n valueVerify: {\n type: 'number[]',\n default: [1, 2],\n },\n }],\n }],\n interactionType: 'input',\n }, {\n label: '目标值类型',\n cascaderProps: { value: 'label', label: 'label' },\n select: [{\n label: '值',\n }, {\n label: '占比',\n }, {\n label: '名字',\n }],\n interactionType: 'select',\n },\n ],\n handler: ({ sourceData, dealJson }) => {\n const { dealKey, source, dealOpt } = dealJson\n\n let formatStr: number | string = ''\n const targetKeyPath = dealOpt['目标值类型'].keyPath\n // 根据value排序,target为第几名\n let sortedData = []\n if (dealOpt['排序方式'].keyPath.includes('默认')) {\n sortedData = sourceData\n }\n else {\n sortedData = sourceData.sort((a, b) => {\n if (dealOpt['排序方式'].keyPath.includes('升序')) {\n return Number(a[dealKey]) - Number(b[dealKey])\n }\n else if (dealOpt['排序方式'].keyPath.includes('降序')) {\n return Number(b[dealKey]) - Number(a[dealKey])\n }\n return 0\n })\n }\n\n if (dealOpt['排序方式'].keyPath.includes('第几名')) {\n const target = sortedData[dealOpt['排序方式'].value - 1] || {}\n // 处理目标值key\n const formatStrKey = targetKeyPath === '值' ? dealKey : targetKeyPath === '名字' ? source : targetKeyPath === '占比' ? dealKey : ''\n\n // 处理目标值\n if (dealOpt['目标值类型'].keyPath.includes('占比')) {\n const sum = sortedData.reduce((a, b) => a + Number(b[formatStrKey]), 0)\n formatStr = target[formatStrKey] ? `${(Number(target[formatStrKey]) / sum * 100).toFixed(2)}%` : ''\n }\n else {\n formatStr = target[formatStrKey] || ''\n }\n // formatStr = target[targetKeyPath === '值' ? dealKey : targetKeyPath === '名字' ? source : '']\n }\n else if (dealOpt['排序方式'].keyPath.includes('范围')) {\n const target = sortedData.slice(dealOpt['排序方式'].value[0] - 1, dealOpt['排序方式'].value[1])\n formatStr = target.map(item => item[targetKeyPath === '值' ? dealKey : targetKeyPath === '名字' ? source : '']).join('、').replace(/、([^、]+)$/, '和$1')\n }\n\n return formatStr || ''\n },\n },\n },\n 趋势分析: {\n 整体趋势: {\n handler: ({ sourceData, dealJson }) => {\n const data = sourceData.map(item => item[dealJson.dealKey])\n const length = data.length\n\n // 计算线性回归\n let sumX = 0\n let sumY = 0\n let sumXY = 0\n let sumX2 = 0\n\n for (let i = 0; i < length; i++) {\n sumX += i\n sumY += Number(data[i])\n sumXY += i * Number(data[i])\n sumX2 += i * i\n }\n\n const slope = (length * sumXY - sumX * sumY) / (length * sumX2 - sumX * sumX)\n\n // 判断趋势类型\n if (slope > 0) {\n return '增长'\n }\n else if (slope < 0) {\n return '下降'\n }\n else {\n return '平稳'\n }\n },\n },\n // '分段趋势': ({ sourceData, dealJson }) => {\n // // 分析数据的趋势分段分析,分为上升、下降、平稳, 例如:某一段时间内,数据整体上升,但是在某一段时间内,数据下降,这段时间内的数据就是分段趋势\n // const { dealKey, source } = dealJson\n // const sortedData = sourceData.sort((a, b) => b[dealKey] - a[dealKey])\n // const trend = []\n // for (let i = 0; i < sortedData.length - 1; i++) {\n // const firstValue = sortedData[i][source]\n // const lastValue = sortedData[i + 1][source]\n // const changePercentage = ((lastValue - firstValue) / firstValue * 100).toFixed(2)\n // if (changePercentage > 0) {\n // trend.push('上升')\n // } else if (changePercentage < 0) {\n // trend.push('下降')\n // } else {\n // trend.push('平稳')\n // }\n // }\n // const trendMap = {\n // '上升': 0,\n // '下降': 0,\n // '平稳': 0\n // }\n // trend.forEach(item => {\n // trendMap[item]++\n // })\n // const trendArr = Object.entries(trendMap).sort((a, b) => b[1] - a[1])\n // return `数据分段趋势为${trendArr[0][0]}。`\n // }\n },\n // '比例分析': {\n // '占比': ({ sourceData, dealJson }) => {\n // const { dealKey } = dealJson\n // const sortedData = sourceData.sort((a, b) => b[dealKey] - a[dealKey])\n // const sum = sortedData.reduce((a, b) => a + b[dealKey], 0)\n // const percentage = (sortedData[0][dealKey] / sum * 100).toFixed(2)\n // return `${percentage}%。`\n // }\n // '环比占比': {\n // handler: chartOptions => {\n // const data = chartOptions.series[0].data\n // const sum = data.reduce((a, b) => a + b)\n // const percentage = (data[0] / sum * 100).toFixed(2)\n // return `数据环比占比为${percentage}%。`\n // }\n // },\n // '同比占比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const sum = data.reduce((a, b) => a + b)\n // const percentage = (data[0] / sum * 100).toFixed(2)\n // return `数据同比占比为${percentage}%。`\n // }\n // }\n // '对比分析': {\n // '分组对比': {\n // dealOptSchema: [\n // {\n // label: '排序方式',\n // cascaderProps: { value: 'label', label: 'label' },\n // select: [{\n // label: '默认',\n // children: [{\n // label: '第几名',\n // valueVerify: {\n // type: 'number',\n // default: 1\n // }\n // }, {\n // label: '范围',\n // valueVerify: {\n // type: 'number[]',\n // default: [1, 2]\n // }\n // }]\n // }, {\n // label: '升序',\n // children: [{\n // label: '第几名',\n // valueVerify: {\n // type: 'number',\n // default: 1\n // }\n // }, {\n // label: '范围',\n // valueVerify: {\n // type: 'number[]',\n // default: [1, 2]\n // }\n // }]\n // }, {\n // label: '降序',\n // children: [{\n // label: '第几名',\n // valueVerify: {\n // type: 'number',\n // default: 1\n // }\n // }, {\n // label: '范围',\n // valueVerify: {\n // type: 'number[]',\n // default: [1, 2]\n // }\n // }]\n // }],\n // interactionType: 'input'\n // }, {\n // label: '目标值类型',\n // cascaderProps: { value: 'label', label: 'label' },\n // select: [{\n // label: '值'\n // }, {\n // label: '名字'\n // }],\n // interactionType: 'select'\n // }\n // ],\n // handler({sourceData, dealJson}) {\n // console.log('sourceData, dealJson: ', sourceData, dealJson)\n\n // }\n // },\n // '环比对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const firstValue = data[0]\n // const lastValue = data[data.length - 1]\n // const trend = lastValue > firstValue ? '上升' : '下降'\n // const changePercentage = ((lastValue - firstValue) / firstValue * 100).toFixed(2)\n // return `数据环比${trend},变化率为${changePercentage}%。`\n // },\n // '同比对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const firstValue = data[0]\n // const lastValue = data[data.length - 1]\n // const trend = lastValue > firstValue ? '上升' : '下降'\n // const changePercentage = ((lastValue - firstValue) / firstValue * 100).toFixed(2)\n // return `数据同比${trend},变化率为${changePercentage}%。`\n // },\n // '最大值对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const max = Math.max(...data)\n // return `数据最大值为${max}。`\n // },\n // '最小值对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const min = Math.min(...data)\n // return `数据最小值为${min}。`\n // },\n // '平均值对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n // return `数据平均值为${average}。`\n // },\n // '中位数对比': ({sourceData, dealJson}) => {\n // const { dealKey, source } = dealJson\n // const sortedData = sourceData.sort((a, b) => b[dealKey] - a[dealKey])\n // return sortedData[Math.floor(sortedData.length / 2)][source]\n // },\n // '众数对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const mode = data.sort((a, b) =>\n // data.filter(v => v === a).length - data.filter(v => v === b).length\n // ).pop()\n // return `数据众数为${mode}。`\n // },\n // '标准差对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n // const standardDeviation = Math.sqrt(data.reduce((a, b) => a + (b - average) ** 2) / data.length).toFixed(2)\n // return `数据标准差为${standardDeviation}。`\n // },\n // '方差对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n // const variance = data.reduce((a, b) => a + (b - average) ** 2) / data.length\n // return `数据方差为${variance}。`\n // },\n // '偏度对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n // const standardDeviation = Math.sqrt(data.reduce((a, b) => a + (b - average) ** 2) / data.length).toFixed(2)\n // const skewness = data.reduce((a, b) => a + ((b - average) / standardDeviation) ** 3) / data.length\n // return `数据偏度为${skewness}。`\n // },\n // '峰度对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n // const standardDeviation = Math.sqrt(data.reduce((a, b) => a + (b - average) ** 2) / data.length).toFixed(2)\n // const kurtosis = data.reduce((a, b) => a + ((b - average) / standardDeviation) ** 4) / data.length\n // return `数据峰度为${kurtosis}。`\n // },\n // '波动率对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n // const standardDeviation = Math.sqrt(data.reduce((a, b) => a + (b - average) ** 2) / data.length).toFixed(2)\n // const volatility = (standardDeviation / average * 100).toFixed(2)\n // return `数据波动率为${volatility}%。`\n // },\n // '变异系数对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n\n // const standardDeviation = Math.sqrt(data.reduce((a, b) => a + (b - average) ** 2) / data.length).toFixed(2)\n\n // const coefficientOfVariation = (standardDeviation / average * 100).toFixed(2)\n // return `数据变异系数为${coefficientOfVariation}%。`\n // },\n // '数据分布对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n\n // const standardDeviation = Math.sqrt(data.reduce((a, b) => a + (b - average) ** 2) / data.length).toFixed(2)\n\n // const coefficientOfVariation = (standardDeviation / average * 100).toFixed(2)\n\n // const mode = data.sort((a, b) =>\n // data.filter(v => v === a).length - data.filter(v => v === b).length\n // ).pop()\n\n // const median = data[Math.floor(data.length / 2)]\n\n // const max = Math.max(...data)\n\n // const min = Math.min(...data)\n // return `数据平均值为${average},标准差为${standardDeviation},变异系数为${coefficientOfVariation}%,众数为${mode},中位数为${median},最大值为${max},最小值为${min}。`\n // }\n // },\n // '相关分析': {\n // handler: ({sourceData, dealJson}) => {\n // console.log('sourceData, dealJson: ', sourceData, dealJson)\n\n // function calculatePearsonCorrelation(dataX, dataY) {\n // if (dataX.length !== dataY.length) {\n // throw new Error('数据长度不一致,无法计算皮尔逊相关系数。')\n // }\n\n // const n = dataX.length\n\n // // 计算平均值\n // const meanX = dataX.reduce((sum, value) => sum + value, 0) / n\n // const meanY = dataY.reduce((sum, value) => sum + value, 0) / n\n\n // // 计算 xi - x̄ 和 yi - ȳ 的数组\n // const diffX = dataX.map(x => x - meanX)\n // const diffY = dataY.map(y => y - meanY)\n\n // // 计算 xi - x̄ 和 yi - ȳ 的平方和\n // const sumDiffX = diffX.reduce((sum, value) => sum + value ** 2, 0)\n // const sumDiffY = diffY.reduce((sum, value) => sum + value ** 2, 0)\n\n // // 计算 xi - x̄ 和 yi - ȳ 的乘积和\n // const sumDiffXY = diffX.reduce((sum, value, index) => sum + value * diffY[index], 0)\n\n // // 计算皮尔逊相关系数\n // const correlation = sumDiffXY / Math.sqrt(sumDiffX * sumDiffY)\n\n // return correlation\n // }\n // function determineCorrelation(dataX, dataY) {\n // const correlation = calculatePearsonCorrelation(dataX, dataY)\n\n // if (correlation > 0.7) {\n // return '强正相关'\n // } else if (correlation > 0.3) {\n // return '较弱正相关'\n // } else if (correlation > -0.3) {\n // return '无线性相关性'\n // } else if (correlation > -0.7) {\n // return '较弱负相关'\n // } else {\n // return '强负相关'\n // }\n // }\n // let dataX = []\n // let dataY = []\n // const correlation = determineCorrelation(dataX, dataY)\n // console.log('两个变量之间的关系:', correlation)\n // return correlation\n // }\n // }\n // '假设探索性分析': {},\n // '机器学习和数据挖掘': {}\n}\n"],"names":["keysMap","描述性分析","平均值","handler","_ref","sourceData","dealJson","dealKey","sortedData","sort","a","b","Number","reduce","length","toFixed","中位数","dealOptSchema","label","cascaderProps","value","select","interactionType","_ref2","source","dealOpt","targetKeyPath","keyPath","Math","floor","排序","children","valueVerify","type","default","_ref3","formatStr","includes","target","formatStrKey","sum","slice","map","item","join","replace","趋势分析","整体趋势","_ref4","data","sumX","sumY","sumXY","sumX2","i","slope","obj","pathArr","acc","key"],"mappings":"aAuBO,MAAMA,EAAoB,CAC/BC,QAAO,CACLC,MAAK,CACHC,QAASC,IAA8B,IAA7BC,WAAEA,EAAAC,SAAYA,GAAeF,EAC/B,MAAAG,QAAEA,GAAYD,EACdE,EAAaH,EAAWI,MAAK,CAACC,EAAGC,IAAMC,OAAOD,EAAEJ,IAAYK,OAAOF,EAAEH,MAE3E,OADiBC,EAAWK,QAAO,CAACH,EAAGC,IAAMD,EAAIE,OAAOD,EAAEJ,KAAW,GAAKC,EAAWM,QAAQC,QAAQ,IACnF,EAAA,GAGtBC,MAAK,CACHC,cAAe,CAAC,CACdC,MAAO,QACPC,cAAe,CAAEC,MAAO,QAASF,MAAO,SACxCG,OAAQ,CAAC,CACPH,MAAO,KACN,CACDA,MAAO,OAETI,gBAAiB,WAEnBnB,QAASoB,IAA8B,IAA7BlB,WAAEA,EAAAC,SAAYA,GAAeiB,EACrC,MAAMhB,QAAEA,EAAAiB,OAASA,EAAQC,QAAAA,GAAYnB,EAC/BoB,EAAgBD,EAAQ,UAAUE,QAClCnB,EAAaH,EAAWI,MAAK,CAACC,EAAGC,IAAMC,OAAOD,EAAEJ,IAAYK,OAAOF,EAAEH,MAC3E,OAAOC,EAAWoB,KAAKC,MAAMrB,EAAWM,OAAS,IAAsB,MAAlBY,EAAwBnB,EAA4B,OAAlBmB,EAAyBF,EAAS,KAAO,EAAA,GAGpIM,KAAI,CACFb,cAAe,CACb,CACEC,MAAO,OACPC,cAAe,CAAEC,MAAO,QAASF,MAAO,SACxCG,OAAQ,CAAC,CACPH,MAAO,KACPa,SAAU,CAAC,CACTb,MAAO,MACPc,YAAa,CACXC,KAAM,SACNC,QAAS,IAEV,CACDhB,MAAO,KACPc,YAAa,CACXC,KAAM,WACNC,QAAS,CAAC,EAAG,OAGhB,CACDhB,MAAO,KACPa,SAAU,CAAC,CACTb,MAAO,MACPc,YAAa,CACXC,KAAM,SACNC,QAAS,IAEV,CACDhB,MAAO,KACPc,YAAa,CACXC,KAAM,WACNC,QAAS,CAAC,EAAG,OAGhB,CACDhB,MAAO,KACPa,SAAU,CAAC,CACTb,MAAO,MACPc,YAAa,CACXC,KAAM,SACNC,QAAS,IAEV,CACDhB,MAAO,KACPc,YAAa,CACXC,KAAM,WACNC,QAAS,CAAC,EAAG,QAInBZ,gBAAiB,SAChB,CACDJ,MAAO,QACPC,cAAe,CAAEC,MAAO,QAASF,MAAO,SACxCG,OAAQ,CAAC,CACPH,MAAO,KACN,CACDA,MAAO,MACN,CACDA,MAAO,OAETI,gBAAiB,WAGrBnB,QAASgC,IAA8B,IAA7B9B,WAAEA,EAAAC,SAAYA,GAAe6B,EACrC,MAAM5B,QAAEA,EAAAiB,OAASA,EAAQC,QAAAA,GAAYnB,EAErC,IAAI8B,EAA6B,GAC3B,MAAAV,EAAgBD,EAAQ,SAASE,QAEvC,IAAInB,EAAa,GAgBjB,GAdeA,EADXiB,EAAQ,QAAQE,QAAQU,SAAS,MACtBhC,EAGAA,EAAWI,MAAK,CAACC,EAAGC,IAC3Bc,EAAQ,QAAQE,QAAQU,SAAS,MAC5BzB,OAAOF,EAAEH,IAAYK,OAAOD,EAAEJ,IAE9BkB,EAAQ,QAAQE,QAAQU,SAAS,MACjCzB,OAAOD,EAAEJ,IAAYK,OAAOF,EAAEH,IAEhC,IAIPkB,EAAQ,QAAQE,QAAQU,SAAS,OAAQ,CACrC,MAAAC,EAAS9B,EAAWiB,EAAQ,QAAQL,MAAQ,IAAM,CAAC,EAEnDmB,EAAiC,MAAlBb,EAAwBnB,EAA4B,OAAlBmB,EAAyBF,EAA2B,OAAlBE,EAAyBnB,EAAU,GAG5H,GAAIkB,EAAQ,SAASE,QAAQU,SAAS,MAAO,CAC3C,MAAMG,EAAMhC,EAAWK,QAAO,CAACH,EAAGC,IAAMD,EAAIE,OAAOD,EAAE4B,KAAgB,GACrEH,EAAYE,EAAOC,GAAgB,IAAI3B,OAAO0B,EAAOC,IAAiBC,EAAM,KAAKzB,QAAQ,MAAQ,EACnG,MAEcqB,EAAAE,EAAOC,IAAiB,EAGxC,SACSd,EAAQ,QAAQE,QAAQU,SAAS,MAAO,CAE/CD,EADe5B,EAAWiC,MAAMhB,EAAQ,QAAQL,MAAM,GAAK,EAAGK,EAAQ,QAAQL,MAAM,IACjEsB,KAAIC,GAAQA,EAAuB,MAAlBjB,EAAwBnB,EAA4B,OAAlBmB,EAAyBF,EAAS,MAAKoB,KAAK,KAAKC,QAAQ,YAAa,MAC9I,CAEA,OAAOT,GAAa,EAAA,IAI1BU,OAAM,CACJC,OAAM,CACJ5C,QAAS6C,IAA8B,IAA7B3C,WAAEA,EAAAC,SAAYA,GAAe0C,EACrC,MAAMC,EAAO5C,EAAWqC,QAAYC,EAAKrC,EAASC,WAC5CO,EAASmC,EAAKnC,OAGpB,IAAIoC,EAAO,EACPC,EAAO,EACPC,EAAQ,EACRC,EAAQ,EAEZ,IAAA,IAASC,EAAI,EAAGA,EAAIxC,EAAQwC,IAClBJ,GAAAI,EACAH,GAAAvC,OAAOqC,EAAKK,IACpBF,GAASE,EAAI1C,OAAOqC,EAAKK,IACzBD,GAASC,EAAIA,EAGf,MAAMC,GAASzC,EAASsC,EAAQF,EAAOC,IAASrC,EAASuC,EAAQH,EAAOA,GAGxE,OAAIK,EAAQ,EACH,KAEAA,EAAQ,EACR,KAGA,IACT,4BA7LQ,SAAeC,EAAUC,GAChC,OAAAA,GAAS5C,QAAO,CAAC6C,EAAKC,IAASD,EAAMA,EAAIC,QAAO,GAAYH,EACrE"}
|
1
|
+
{"version":3,"file":"analyze.cjs","sources":["../../../../../../packages/components/src/data-chart/src/analyze.ts"],"sourcesContent":["import type { EChartData } from './utils/types'\n\n// 根据路径获取对象的值\nexport function getObjectValue(obj: any, pathArr: string[]) {\n return pathArr?.reduce((acc, key) => (acc ? acc[key] : undefined), obj)\n}\n\n// 谁 是什么 的分析\ninterface IHandlerFunction {\n handler?: ({ sourceData, dealJson }: { sourceData: EChartData['data'], dealJson: any }) => string | number\n dealOptSchema?: {\n label: string\n cascaderProps: {\n value: string\n label: string\n }\n select: any[]\n interactionType?: 'select' | 'input'\n }[]\n}\nexport interface IkeysMap {\n [key: string]: IHandlerFunction | IkeysMap\n}\nexport const keysMap: IkeysMap = {\n 描述性分析: {\n 平均值: {\n handler: ({ sourceData, dealJson }) => {\n const { dealKey } = dealJson\n const sortedData = sourceData.sort((a, b) => Number(b[dealKey]) - Number(a[dealKey]))\n const average = (sortedData.reduce((a, b) => a + Number(b[dealKey]), 0) / sortedData.length).toFixed(2)\n return average || ''\n },\n },\n 中位数: {\n dealOptSchema: [{\n label: '目标值类型',\n cascaderProps: { value: 'label', label: 'label' },\n select: [{\n label: '值',\n }, {\n label: '名字',\n }],\n interactionType: 'select',\n }],\n handler: ({ sourceData, dealJson }) => {\n const { dealKey, source, dealOpt } = dealJson\n const targetKeyPath = dealOpt['目标值类型']?.keyPath\n const sortedData = sourceData.sort((a, b) => Number(b[dealKey]) - Number(a[dealKey]))\n return sortedData[Math.floor(sortedData.length / 2)][targetKeyPath === '值' ? dealKey : targetKeyPath === '名字' ? source : ''] || ''\n },\n },\n 排序: {\n dealOptSchema: [\n {\n label: '排序方式',\n cascaderProps: { value: 'label', label: 'label' },\n select: [{\n label: '默认',\n children: [{\n label: '第几名',\n valueVerify: {\n type: 'number',\n default: 1,\n },\n }, {\n label: '范围',\n valueVerify: {\n type: 'number[]',\n default: [1, 2],\n },\n }],\n }, {\n label: '升序',\n children: [{\n label: '第几名',\n valueVerify: {\n type: 'number',\n default: 1,\n },\n }, {\n label: '范围',\n valueVerify: {\n type: 'number[]',\n default: [1, 2],\n },\n }],\n }, {\n label: '降序',\n children: [{\n label: '第几名',\n valueVerify: {\n type: 'number',\n default: 1,\n },\n }, {\n label: '范围',\n valueVerify: {\n type: 'number[]',\n default: [1, 2],\n },\n }],\n }],\n interactionType: 'input',\n }, {\n label: '目标值类型',\n cascaderProps: { value: 'label', label: 'label' },\n select: [{\n label: '值',\n }, {\n label: '占比',\n }, {\n label: '名字',\n }],\n interactionType: 'select',\n },\n ],\n handler: ({ sourceData, dealJson }) => {\n const { dealKey, source, dealOpt } = dealJson\n\n let formatStr: number | string = ''\n const targetKeyPath = dealOpt['目标值类型'].keyPath\n // 根据value排序,target为第几名\n let sortedData = []\n if (dealOpt['排序方式'].keyPath.includes('默认')) {\n sortedData = sourceData\n }\n else {\n sortedData = sourceData.sort((a, b) => {\n if (dealOpt['排序方式'].keyPath.includes('升序')) {\n return Number(a[dealKey]) - Number(b[dealKey])\n }\n else if (dealOpt['排序方式'].keyPath.includes('降序')) {\n return Number(b[dealKey]) - Number(a[dealKey])\n }\n return 0\n })\n }\n\n if (dealOpt['排序方式'].keyPath.includes('第几名')) {\n const target = sortedData[dealOpt['排序方式'].value - 1] || {}\n // 处理目标值key\n const formatStrKey = targetKeyPath === '值' ? dealKey : targetKeyPath === '名字' ? source : targetKeyPath === '占比' ? dealKey : ''\n\n // 处理目标值\n if (dealOpt['目标值类型'].keyPath.includes('占比')) {\n const sum = sortedData.reduce((a, b) => a + Number(b[formatStrKey]), 0)\n formatStr = target[formatStrKey] ? `${(Number(target[formatStrKey]) / sum * 100).toFixed(2)}%` : ''\n }\n else {\n formatStr = target[formatStrKey] || ''\n }\n // formatStr = target[targetKeyPath === '值' ? dealKey : targetKeyPath === '名字' ? source : '']\n }\n else if (dealOpt['排序方式'].keyPath.includes('范围')) {\n const target = sortedData.slice(dealOpt['排序方式'].value[0] - 1, dealOpt['排序方式'].value[1])\n formatStr = target.map(item => item[targetKeyPath === '值' ? dealKey : targetKeyPath === '名字' ? source : '']).join('、').replace(/、([^、]+)$/, '和$1')\n }\n\n return formatStr || ''\n },\n },\n },\n 趋势分析: {\n 整体趋势: {\n handler: ({ sourceData, dealJson }) => {\n const data = sourceData.map(item => item[dealJson.dealKey])\n const length = data.length\n\n // 计算线性回归\n let sumX = 0\n let sumY = 0\n let sumXY = 0\n let sumX2 = 0\n\n for (let i = 0; i < length; i++) {\n sumX += i\n sumY += Number(data[i])\n sumXY += i * Number(data[i])\n sumX2 += i * i\n }\n\n const slope = (length * sumXY - sumX * sumY) / (length * sumX2 - sumX * sumX)\n\n // 判断趋势类型\n if (slope > 0) {\n return '增长'\n }\n else if (slope < 0) {\n return '下降'\n }\n else {\n return '平稳'\n }\n },\n },\n // '分段趋势': ({ sourceData, dealJson }) => {\n // // 分析数据的趋势分段分析,分为上升、下降、平稳, 例如:某一段时间内,数据整体上升,但是在某一段时间内,数据下降,这段时间内的数据就是分段趋势\n // const { dealKey, source } = dealJson\n // const sortedData = sourceData.sort((a, b) => b[dealKey] - a[dealKey])\n // const trend = []\n // for (let i = 0; i < sortedData.length - 1; i++) {\n // const firstValue = sortedData[i][source]\n // const lastValue = sortedData[i + 1][source]\n // const changePercentage = ((lastValue - firstValue) / firstValue * 100).toFixed(2)\n // if (changePercentage > 0) {\n // trend.push('上升')\n // } else if (changePercentage < 0) {\n // trend.push('下降')\n // } else {\n // trend.push('平稳')\n // }\n // }\n // const trendMap = {\n // '上升': 0,\n // '下降': 0,\n // '平稳': 0\n // }\n // trend.forEach(item => {\n // trendMap[item]++\n // })\n // const trendArr = Object.entries(trendMap).sort((a, b) => b[1] - a[1])\n // return `数据分段趋势为${trendArr[0][0]}。`\n // }\n },\n // '比例分析': {\n // '占比': ({ sourceData, dealJson }) => {\n // const { dealKey } = dealJson\n // const sortedData = sourceData.sort((a, b) => b[dealKey] - a[dealKey])\n // const sum = sortedData.reduce((a, b) => a + b[dealKey], 0)\n // const percentage = (sortedData[0][dealKey] / sum * 100).toFixed(2)\n // return `${percentage}%。`\n // }\n // '环比占比': {\n // handler: chartOptions => {\n // const data = chartOptions.series[0].data\n // const sum = data.reduce((a, b) => a + b)\n // const percentage = (data[0] / sum * 100).toFixed(2)\n // return `数据环比占比为${percentage}%。`\n // }\n // },\n // '同比占比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const sum = data.reduce((a, b) => a + b)\n // const percentage = (data[0] / sum * 100).toFixed(2)\n // return `数据同比占比为${percentage}%。`\n // }\n // }\n // '对比分析': {\n // '分组对比': {\n // dealOptSchema: [\n // {\n // label: '排序方式',\n // cascaderProps: { value: 'label', label: 'label' },\n // select: [{\n // label: '默认',\n // children: [{\n // label: '第几名',\n // valueVerify: {\n // type: 'number',\n // default: 1\n // }\n // }, {\n // label: '范围',\n // valueVerify: {\n // type: 'number[]',\n // default: [1, 2]\n // }\n // }]\n // }, {\n // label: '升序',\n // children: [{\n // label: '第几名',\n // valueVerify: {\n // type: 'number',\n // default: 1\n // }\n // }, {\n // label: '范围',\n // valueVerify: {\n // type: 'number[]',\n // default: [1, 2]\n // }\n // }]\n // }, {\n // label: '降序',\n // children: [{\n // label: '第几名',\n // valueVerify: {\n // type: 'number',\n // default: 1\n // }\n // }, {\n // label: '范围',\n // valueVerify: {\n // type: 'number[]',\n // default: [1, 2]\n // }\n // }]\n // }],\n // interactionType: 'input'\n // }, {\n // label: '目标值类型',\n // cascaderProps: { value: 'label', label: 'label' },\n // select: [{\n // label: '值'\n // }, {\n // label: '名字'\n // }],\n // interactionType: 'select'\n // }\n // ],\n // handler({sourceData, dealJson}) {\n // console.log('sourceData, dealJson: ', sourceData, dealJson)\n\n // }\n // },\n // '环比对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const firstValue = data[0]\n // const lastValue = data[data.length - 1]\n // const trend = lastValue > firstValue ? '上升' : '下降'\n // const changePercentage = ((lastValue - firstValue) / firstValue * 100).toFixed(2)\n // return `数据环比${trend},变化率为${changePercentage}%。`\n // },\n // '同比对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const firstValue = data[0]\n // const lastValue = data[data.length - 1]\n // const trend = lastValue > firstValue ? '上升' : '下降'\n // const changePercentage = ((lastValue - firstValue) / firstValue * 100).toFixed(2)\n // return `数据同比${trend},变化率为${changePercentage}%。`\n // },\n // '最大值对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const max = Math.max(...data)\n // return `数据最大值为${max}。`\n // },\n // '最小值对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const min = Math.min(...data)\n // return `数据最小值为${min}。`\n // },\n // '平均值对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n // return `数据平均值为${average}。`\n // },\n // '中位数对比': ({sourceData, dealJson}) => {\n // const { dealKey, source } = dealJson\n // const sortedData = sourceData.sort((a, b) => b[dealKey] - a[dealKey])\n // return sortedData[Math.floor(sortedData.length / 2)][source]\n // },\n // '众数对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const mode = data.sort((a, b) =>\n // data.filter(v => v === a).length - data.filter(v => v === b).length\n // ).pop()\n // return `数据众数为${mode}。`\n // },\n // '标准差对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n // const standardDeviation = Math.sqrt(data.reduce((a, b) => a + (b - average) ** 2) / data.length).toFixed(2)\n // return `数据标准差为${standardDeviation}。`\n // },\n // '方差对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n // const variance = data.reduce((a, b) => a + (b - average) ** 2) / data.length\n // return `数据方差为${variance}。`\n // },\n // '偏度对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n // const standardDeviation = Math.sqrt(data.reduce((a, b) => a + (b - average) ** 2) / data.length).toFixed(2)\n // const skewness = data.reduce((a, b) => a + ((b - average) / standardDeviation) ** 3) / data.length\n // return `数据偏度为${skewness}。`\n // },\n // '峰度对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n // const standardDeviation = Math.sqrt(data.reduce((a, b) => a + (b - average) ** 2) / data.length).toFixed(2)\n // const kurtosis = data.reduce((a, b) => a + ((b - average) / standardDeviation) ** 4) / data.length\n // return `数据峰度为${kurtosis}。`\n // },\n // '波动率对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n // const standardDeviation = Math.sqrt(data.reduce((a, b) => a + (b - average) ** 2) / data.length).toFixed(2)\n // const volatility = (standardDeviation / average * 100).toFixed(2)\n // return `数据波动率为${volatility}%。`\n // },\n // '变异系数对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n\n // const standardDeviation = Math.sqrt(data.reduce((a, b) => a + (b - average) ** 2) / data.length).toFixed(2)\n\n // const coefficientOfVariation = (standardDeviation / average * 100).toFixed(2)\n // return `数据变异系数为${coefficientOfVariation}%。`\n // },\n // '数据分布对比': chartOptions => {\n // const data = chartOptions.series[0].data\n // const average = (data.reduce((a, b) => a + b) / data.length).toFixed(2)\n\n // const standardDeviation = Math.sqrt(data.reduce((a, b) => a + (b - average) ** 2) / data.length).toFixed(2)\n\n // const coefficientOfVariation = (standardDeviation / average * 100).toFixed(2)\n\n // const mode = data.sort((a, b) =>\n // data.filter(v => v === a).length - data.filter(v => v === b).length\n // ).pop()\n\n // const median = data[Math.floor(data.length / 2)]\n\n // const max = Math.max(...data)\n\n // const min = Math.min(...data)\n // return `数据平均值为${average},标准差为${standardDeviation},变异系数为${coefficientOfVariation}%,众数为${mode},中位数为${median},最大值为${max},最小值为${min}。`\n // }\n // },\n // '相关分析': {\n // handler: ({sourceData, dealJson}) => {\n // console.log('sourceData, dealJson: ', sourceData, dealJson)\n\n // function calculatePearsonCorrelation(dataX, dataY) {\n // if (dataX.length !== dataY.length) {\n // throw new Error('数据长度不一致,无法计算皮尔逊相关系数。')\n // }\n\n // const n = dataX.length\n\n // // 计算平均值\n // const meanX = dataX.reduce((sum, value) => sum + value, 0) / n\n // const meanY = dataY.reduce((sum, value) => sum + value, 0) / n\n\n // // 计算 xi - x̄ 和 yi - ȳ 的数组\n // const diffX = dataX.map(x => x - meanX)\n // const diffY = dataY.map(y => y - meanY)\n\n // // 计算 xi - x̄ 和 yi - ȳ 的平方和\n // const sumDiffX = diffX.reduce((sum, value) => sum + value ** 2, 0)\n // const sumDiffY = diffY.reduce((sum, value) => sum + value ** 2, 0)\n\n // // 计算 xi - x̄ 和 yi - ȳ 的乘积和\n // const sumDiffXY = diffX.reduce((sum, value, index) => sum + value * diffY[index], 0)\n\n // // 计算皮尔逊相关系数\n // const correlation = sumDiffXY / Math.sqrt(sumDiffX * sumDiffY)\n\n // return correlation\n // }\n // function determineCorrelation(dataX, dataY) {\n // const correlation = calculatePearsonCorrelation(dataX, dataY)\n\n // if (correlation > 0.7) {\n // return '强正相关'\n // } else if (correlation > 0.3) {\n // return '较弱正相关'\n // } else if (correlation > -0.3) {\n // return '无线性相关性'\n // } else if (correlation > -0.7) {\n // return '较弱负相关'\n // } else {\n // return '强负相关'\n // }\n // }\n // let dataX = []\n // let dataY = []\n // const correlation = determineCorrelation(dataX, dataY)\n // console.log('两个变量之间的关系:', correlation)\n // return correlation\n // }\n // }\n // '假设探索性分析': {},\n // '机器学习和数据挖掘': {}\n}\n"],"names":["keysMap","描述性分析","平均值","handler","_ref","sourceData","dealJson","dealKey","sortedData","sort","a","b","Number","reduce","length","toFixed","中位数","dealOptSchema","label","cascaderProps","value","select","interactionType","_ref2","source","dealOpt","targetKeyPath","keyPath","Math","floor","排序","children","valueVerify","type","default","_ref3","formatStr","includes","target","formatStrKey","sum","slice","map","item","join","replace","趋势分析","整体趋势","_ref4","data","sumX","sumY","sumXY","sumX2","i","slope","obj","pathArr","acc","key"],"mappings":"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"}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("echarts"),a=require("../utils/config.cjs"),r=require("../utils/injectionKeys.cjs"),n=require("../utils/useCharts.cjs");function
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("echarts"),a=require("../utils/config.cjs"),r=require("../utils/injectionKeys.cjs"),n=require("../utils/useCharts.cjs");function o(e){var t=Object.create(null);return e&&Object.keys(e).forEach(function(a){if("default"!==a){var r=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,r.get?r:{enumerable:!0,get:function(){return e[a]}})}}),t.default=e,Object.freeze(t)}var c=o(t);const s={class:"data-chart-area-wrap"};var i=e.defineComponent({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(t){const o=e.inject(r.InjectionChartMerge,e=>e,!0);let i="中国";const l=e.ref({features:[],type:"FeatureCollection"}),u=e.ref(null),m=e.ref(null),p=e.computed(()=>{try{const{xGroupByDesc:e,groupByDesc:a,colDesc:r,modelName:n,data:c}=t.chartData,s=[];r.forEach(e=>{c.forEach(t=>{s.push(Number(t[e]))})});const u={title:{text:n},tooltip:{formatter(e){let t=`${e.name}<br/>`;return u.series?.forEach(a=>{a.data?.forEach(r=>{r.name===e.name&&(t+=`${a.name}:${r.value}</br>`)}),t.includes(a.name)||(t+=`${a.name}:-</br>`)}),t}},visualMap:{min:Math.min(...s,0),max:Math.max(...s,0),text:["高","低"],realtime:!1,calculable:!0,inRange:{color:["#E8F4FD","#B8D4F7","#7BA4F0","#4A7BE8","#3562e1"]}},series:r?.map(t=>{const r=[],n=a.find(e=>e.colDesc===("中国"===i?"医院所在省":"医院所在市")),o={};c.map(a=>{const r=a[("中国"===i?e?.colDesc||"":n?.colDesc)||""],o=l.value.features?.find(({properties:{name:e}})=>e?.includes(r));return{name:o?.properties?.name||"",value:Number(a[t])}}).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:t,type:"map",map:i,data:r}})};return o(u,t.chartOptions)}catch(e){return console.error("Error computing area chart options:",e),{title:{text:"地图加载失败"},series:[]}}});async function d(e="中国"){try{const t=await a.getGeoJsonData({adcode:e});return t&&t.features&&0!==t.features.length?(l.value=t,i=e,void c.registerMap(e,t)):void console.error("Invalid GeoJSON data for:",e)}catch(t){if(console.error("Failed to register map for:",e,t),"中国"!==e)return console.log("Falling back to China map"),d("中国")}}return n.useCharts({chartDOM:m,chartOptions:p,chartData:e.computed(()=>t.chartData),initAfter:async function(e){u.value=e;try{await d(),e&&!e.isDisposed()&&(e.getZr()?.on("click",t=>{e?.showLoading(),t.target||"中国"===i||d("中国"),e.hideLoading()}),e.on("click",a=>{e?.showLoading();const r=t.chartData.groupByDesc?.some(e=>"医院所在市"===e.colDesc);"中国"===i&&r&&a.name&&d(a.name).then(()=>{e&&!e.isDisposed()&&e.setOption(p.value)}),e?.hideLoading()}))}catch(t){if(console.error("Failed to initialize map:",t),e&&!e.isDisposed())try{await d("中国")}catch(e){console.error("Failed to retry map registration:",e)}}}}),(t,a)=>(e.openBlock(),e.createElementBlock("div",s,[e.createCommentVNode(' <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> '),e.createElementVNode("div",{ref_key:"dataChartArea",ref:m,class:"data-chart-area"},null,512)]))}});exports.default=i;
|
2
2
|
//# sourceMappingURL=area.vue2.cjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"area.vue2.cjs","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 '../utils/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\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\n ref=\"dataChartArea\"\n class=\"data-chart-area\"\n />\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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"}
|
1
|
+
{"version":3,"file":"area.vue2.cjs","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 '../utils/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 myChart = ref<ECharts | null>(null)\nconst dataChartArea = ref(null)\n\nconst areaChartOptions = computed<EChartsOption>(() => {\n try {\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 text: ['高', '低'],\n realtime: false,\n calculable: true,\n inRange: {\n color: ['#E8F4FD', '#B8D4F7', '#7BA4F0', '#4A7BE8', '#3562e1']\n },\n },\n series: colDesc?.map((colDescItem) => {\n const seriesData = []\n const row = groupByDesc.find(item => item.colDesc === (adcode === '中国' ? '医院所在省' : '医院所在市'))\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 catch (error) {\n console.error('Error computing area chart options:', error)\n return {\n title: { text: '地图加载失败' },\n series: [],\n }\n }\n})\n\nasync function initAfter(mc: ECharts | null) {\n myChart.value = mc\n try {\n await registerMap()\n // 添加判断,确保图表实例存在且未被销毁\n if (mc && !mc.isDisposed()) {\n // charts 监听事件\n mc.getZr()?.on('click', (params: { target: HTMLElement }) => {\n mc?.showLoading()\n if (!params.target && adcode !== '中国') {\n registerMap('中国')\n }\n mc.hideLoading()\n })\n mc.on('click', (params: { name: string }) => {\n mc?.showLoading()\n const flag = chartData.groupByDesc?.some(item => item.colDesc === '医院所在市')\n if (adcode === '中国' && flag && params.name) {\n registerMap(params.name).then(() => {\n if (mc && !mc.isDisposed()) {\n mc.setOption(areaChartOptions.value)\n }\n })\n }\n mc?.hideLoading()\n })\n }\n }\n catch (error) {\n console.error('Failed to initialize map:', error)\n // 如果初始化失败,尝试重新注册地图\n if (mc && !mc.isDisposed()) {\n try {\n await registerMap('中国')\n }\n catch (retryError) {\n console.error('Failed to retry map registration:', retryError)\n }\n }\n }\n}\n\n// function selectChina() {\n// registerMap(adcode)\n// }\nasync function registerMap(keyword = '中国') {\n try {\n const geoJson = await getGeoJsonData({ adcode: keyword })\n if (!geoJson || !geoJson.features || geoJson.features.length === 0) {\n console.error('Invalid GeoJSON data for:', keyword)\n return\n }\n currentGeoJson.value = geoJson\n adcode = keyword\n\n echarts.registerMap(keyword, geoJson as any)\n return\n }\n catch (error) {\n console.error('Failed to register map for:', keyword, error)\n // 如果注册失败,尝试使用默认的中国地图数据\n if (keyword !== '中国') {\n console.log('Falling back to China map')\n return registerMap('中国')\n }\n }\n}\nuseCharts({\n chartDOM: dataChartArea,\n chartOptions: areaChartOptions,\n chartData: computed(() => chartData),\n initAfter\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\n ref=\"dataChartArea\"\n class=\"data-chart-area\"\n />\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","myChart","dataChartArea","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","realtime","calculable","inRange","color","map","seriesData","row","find","arr","sourceName","properties","key","chartOptions","error","console","async","registerMap","keyword","geoJson","getGeoJsonData","length","echarts","log","useCharts","chartDOM","initAfter","mc","isDisposed","getZr","on","showLoading","target","hideLoading","flag","some","then","setOption","retryError","_openBlock","_createElementBlock","_hoisted_1","_createCommentVNode","_createElementVNode","class"],"mappings":"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"}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),a=require("lodash-es"),t=require("../utils/injectionKeys.cjs"),s=require("../utils/useCharts.cjs"),r=e.defineComponent({name:"DataChartBar",__name:"bar",props:{chartData:{type:Object,required:!0},subShowType:{type:String,required:!0,default:"bar-simple"},chartOptions:{type:null,required:!0}},setup(r){const c=e.inject(t.InjectionChartMerge,
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),a=require("lodash-es"),t=require("../utils/injectionKeys.cjs"),s=require("../utils/useCharts.cjs"),r=e.defineComponent({name:"DataChartBar",__name:"bar",props:{chartData:{type:Object,required:!0},subShowType:{type:String,required:!0,default:"bar-simple"},chartOptions:{type:null,required:!0}},setup(r){const c=e.inject(t.InjectionChartMerge,e=>e,!0),l=e.ref(null),i=e.computed(()=>{const{colDesc:e,xGroupByDesc:t,groupByDesc:s,data:l=[],modelName:i}=r.chartData,o=Array.from(new Set(l.map(e=>e[t.colDesc||""]))).filter(e=>null!=e)||[],n={...s.find(e=>!e.xAxis)||{groupByDesc:null,groupByValues:[],colDesc:"",xAxis:!1},groupByValues:a.uniq(l.map(e=>s.find(e=>!e.xAxis)?.colDesc?String(e[s.find(e=>!e.xAxis)?.colDesc||""]):""))},u=t?{...t,groupByValues:a.uniq(l.map(e=>t.colDesc?String(e[t.colDesc]):""))}:t,p={title:{text:i},xAxis:{name:"",type:"category",axisLabel:{interval:0,formatter:e=>e.length>5?`${e.substring(0,5)}...`:e},data:o},yAxis:{type:"value"},legend:{data:[]},dataZoom:[{type:"inside",disabled:o.length<15}]};if(1===s.length)p.series=e.map(e=>({name:e,data:l.map(a=>a[e]),type:"bar",emphasis:{focus:"series"},label:{show:!0,position:"inside"}})),p.legend.data=e;else if(2===s.length){const a=e.map(e=>n.groupByValues?.map(a=>{const t={name:`${a||"/"}-${e}`,type:"bar",stack:e,emphasis:{focus:"series"},data:[],label:{show:!0,position:"inside"}};return t.data=(u?.groupByValues||[]).map(e=>{let s=null;return l.forEach(r=>{n.colDesc&&r[n.colDesc]===a&&u?.colDesc&&r[u.colDesc]===e&&t.stack&&(s=r[t.stack]??null)}),s||""}).filter(e=>""!==e),t})||[]).flat();p.series=a,delete p.legend}function d(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(r.subShowType){case"bar-simple":case"default":d(p.xAxis,"category",o,t?.colDesc||""),d(p.yAxis,"value");break;case"bar-y-category":d(p.xAxis,"value"),d(p.yAxis,"category",o,t?.colDesc||"")}return c(p,r.chartOptions)});return s.useCharts({chartDOM:l,chartOptions:i,chartData:e.computed(()=>r.chartData)}),(a,t)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"dataChartBar",ref:l,class:"data-chart-bar"},null,512))}});exports.default=r;
|
2
2
|
//# sourceMappingURL=bar.vue.cjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"bar.vue.cjs","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 EChartsOption,\n IFormatPublicData,\n SeriesOption,\n} from '../utils/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 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 || '']))).filter(item => item !== undefined && item !== null) || []\n\n // 创建新的对象而不是修改原对象\n const yGroupByDesc = {\n ...groupByDesc.find(item => !item.xAxis) || {\n groupByDesc: null,\n groupByValues: [],\n colDesc: '',\n xAxis: false,\n },\n groupByValues: uniq(data.map(item => groupByDesc.find(item => !item.xAxis)?.colDesc ? String(item[groupByDesc.find(item => !item.xAxis)?.colDesc || '']) : '')),\n }\n\n // 创建新的 xGroupByDesc 对象\n const newXGroupByDesc = xGroupByDesc\n ? {\n ...xGroupByDesc,\n groupByValues: uniq(data.map(item => xGroupByDesc.colDesc ? String(item[xGroupByDesc.colDesc]) : '')),\n }\n : xGroupByDesc\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 = (newXGroupByDesc?.groupByValues || []).map((xGroupByDescItem) => {\n let targetVal: number | string | null = null\n data.forEach((item) => {\n if (yGroupByDesc.colDesc && item[yGroupByDesc.colDesc] === yGroupByDescItem && newXGroupByDesc?.colDesc && item[newXGroupByDesc.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\n ref=\"dataChartBar\"\n class=\"data-chart-bar\"\n />\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","filter","yGroupByDesc","find","xAxis","groupByValues","uniq","String","newXGroupByDesc","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","flat","configureAxis","axis","isArray","subShowType","chartOptions","useCharts","chartDOM"],"mappings":"uYA4BA,MAAMA,EAAQC,EAAAA,OAAOC,EAAAA,
|
1
|
+
{"version":3,"file":"bar.vue.cjs","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 EChartsOption,\n IFormatPublicData,\n SeriesOption,\n} from '../utils/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 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 || '']))).filter(item => item !== undefined && item !== null) || []\n\n // 创建新的对象而不是修改原对象\n const yGroupByDesc = {\n ...groupByDesc.find(item => !item.xAxis) || {\n groupByDesc: null,\n groupByValues: [],\n colDesc: '',\n xAxis: false,\n },\n groupByValues: uniq(data.map(item => groupByDesc.find(item => !item.xAxis)?.colDesc ? String(item[groupByDesc.find(item => !item.xAxis)?.colDesc || '']) : '')),\n }\n\n // 创建新的 xGroupByDesc 对象\n const newXGroupByDesc = xGroupByDesc\n ? {\n ...xGroupByDesc,\n groupByValues: uniq(data.map(item => xGroupByDesc.colDesc ? String(item[xGroupByDesc.colDesc]) : '')),\n }\n : xGroupByDesc\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 = (newXGroupByDesc?.groupByValues || []).map((xGroupByDescItem) => {\n let targetVal: number | string | null = null\n data.forEach((item) => {\n if (yGroupByDesc.colDesc && item[yGroupByDesc.colDesc] === yGroupByDescItem && newXGroupByDesc?.colDesc && item[newXGroupByDesc.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\n ref=\"dataChartBar\"\n class=\"data-chart-bar\"\n />\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","filter","yGroupByDesc","find","xAxis","groupByValues","uniq","String","newXGroupByDesc","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","flat","configureAxis","axis","isArray","subShowType","chartOptions","useCharts","chartDOM","_createElementBlock","class"],"mappings":"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"}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("element-plus/es");require("element-plus/es/components/base/style/index"),require("element-plus/es/components/scrollbar/style/index");var t=require("vue"),a=require("./data-chart-card-bg-left.svg.cjs"),l=require("./data-chart-card-bg-right.svg.cjs"),c=require("./empty.vue.cjs");const r={class:"data-chart-card"},o={class:"title"},n=["title"],s={class:"context"},i={class:"suffix-icon"},d={key:1,class:"data-chart-card-wrap"},m=["title"],p={class:"context"};var u=t.defineComponent({name:"DataChartCard",__name:"card",props:{chartData:{type:Object,default:()=>({colDesc:[],xGroupByDesc:[],data:[],modelName:""})}},setup(u){const k=u,g=`url(${a.default})`,D=`url(${l.default})`;function y(e){const t=k.chartData.xGroupByDesc?.colDesc||"";return t?t+e[t]:""}return(a,l)=>{const k=e.ElScrollbar;return t.openBlock(),t.createElementBlock("div",r,[t.createElementVNode("p",o,t.toDisplayString(u.chartData.modelName),1),u.chartData.data.length?(t.openBlock(),t.createElementBlock(t.Fragment,{key:0},[u.chartData.groupByDesc.length?(t.openBlock(),t.createBlock(k,{key:0},{default:t.withCtx((
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("element-plus/es");require("element-plus/es/components/base/style/index"),require("element-plus/es/components/scrollbar/style/index");var t=require("vue"),a=require("./data-chart-card-bg-left.svg.cjs"),l=require("./data-chart-card-bg-right.svg.cjs"),c=require("./empty.vue.cjs");const r={class:"data-chart-card"},o={class:"title"},n=["title"],s={class:"context"},i={class:"suffix-icon"},d={key:1,class:"data-chart-card-wrap"},m=["title"],p={class:"context"};var u=t.defineComponent({name:"DataChartCard",__name:"card",props:{chartData:{type:Object,default:()=>({colDesc:[],xGroupByDesc:[],data:[],modelName:""})}},setup(u){const k=u,g=`url(${a.default})`,D=`url(${l.default})`;function y(e){const t=k.chartData.xGroupByDesc?.colDesc||"";return t?t+e[t]:""}return(a,l)=>{const k=e.ElScrollbar;return t.openBlock(),t.createElementBlock("div",r,[t.createElementVNode("p",o,t.toDisplayString(u.chartData.modelName),1),u.chartData.data.length?(t.openBlock(),t.createElementBlock(t.Fragment,{key:0},[u.chartData.groupByDesc.length?(t.openBlock(),t.createBlock(k,{key:0},{default:t.withCtx(()=>[t.createElementVNode("div",{class:t.normalizeClass({"data-chart-card-grid-layout":u.chartData.groupByDesc.length})},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(u.chartData.data,(e,a)=>(t.openBlock(),t.createElementBlock("div",{key:a,class:"card-item",style:t.normalizeStyle({"background-image":`${g}, ${D}`})},[t.createElementVNode("div",{class:"card-title",title:y(e)},t.toDisplayString(y(e)),9,n),t.createElementVNode("div",s,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(u.chartData.colDesc,(a,l)=>(t.openBlock(),t.createElementBlock("span",{key:a},[t.createTextVNode(t.toDisplayString(`${a}: `||"-"),1),t.createElementVNode("strong",null,t.toDisplayString(e[a]||"-"),1),t.createTextVNode(" "+t.toDisplayString(l===u.chartData.colDesc.length-1?"":","),1)]))),128))]),t.createElementVNode("div",i,t.toDisplayString(a+1),1)],4))),128))],2)]),_:1})):(t.openBlock(),t.createElementBlock("div",d,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(u.chartData.data,(e,a)=>(t.openBlock(),t.createElementBlock("div",{key:a,class:"card-item",style:t.normalizeStyle({"background-image":`${g}, ${D}`})},[t.createElementVNode("div",{class:"card-title",title:u.chartData.modelName},t.toDisplayString(u.chartData.modelName),9,m),t.createElementVNode("div",p,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(u.chartData.colDesc,(a,l)=>(t.openBlock(),t.createElementBlock("span",{key:a},[e?(t.openBlock(),t.createElementBlock(t.Fragment,{key:0},[t.createTextVNode(t.toDisplayString(`${a}: `||"-"),1),t.createElementVNode("strong",null,t.toDisplayString(e[a]||"-"),1),t.createTextVNode(" "+t.toDisplayString(l===u.chartData.colDesc.length-1?"":","),1)],64)):t.createCommentVNode("v-if",!0)]))),128))])],4))),128))]))],64)):(t.openBlock(),t.createBlock(c.default,{key:1}))])}}});exports.default=u;
|
2
2
|
//# sourceMappingURL=card.vue2.cjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"card.vue2.cjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/card.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { PropType } from 'vue'\nimport type { EChartData, IFormatPublicData } from '../utils/types'\nimport bgLeft from './data-chart-card-bg-left.svg'\nimport bgRight from './data-chart-card-bg-right.svg'\nimport Empty from './empty.vue'\n\ndefineOptions({\n name: 'DataChartCard',\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\n// 将 SVG 文件转换为 URL\nconst bgLeftUrl = `url(${bgLeft})`\nconst bgRightUrl = `url(${bgRight})`\n\nfunction cardTitle(dataItem: EChartData['data'][0]) {\n const colDesc = props.chartData.xGroupByDesc?.colDesc || ''\n\n return colDesc ? (colDesc + dataItem[colDesc]) : ''\n}\n</script>\n\n<template>\n <div class=\"data-chart-card\">\n <p class=\"title\">\n {{ chartData.modelName }}\n </p>\n <template v-if=\"chartData.data.length\">\n <el-scrollbar v-if=\"chartData.groupByDesc.length\">\n <div :class=\"{ 'data-chart-card-grid-layout': chartData.groupByDesc.length }\">\n <div\n v-for=\"(dataItem, dataIndex) in chartData.data\"\n :key=\"dataIndex\"\n class=\"card-item\"\n :style=\"{\n 'background-image': `${bgLeftUrl}, ${bgRightUrl}`,\n }\"\n >\n <div\n class=\"card-title\"\n :title=\"cardTitle(dataItem)\"\n >\n {{ cardTitle(dataItem) }}\n </div>\n <div class=\"context\">\n <span\n v-for=\"(item, index) in chartData.colDesc\"\n :key=\"item\"\n >\n {{ `${item}: ` || '-' }}<strong>{{ dataItem[item] || '-' }}</strong> {{ index === chartData.colDesc.length\n - 1 ? '' : ',' }}\n </span>\n </div>\n <div class=\"suffix-icon\">\n {{ dataIndex + 1 }}\n </div>\n </div>\n </div>\n </el-scrollbar>\n <div\n v-else\n class=\"data-chart-card-wrap\"\n >\n <div\n v-for=\"(dataItem, dataIndex) in chartData.data\"\n :key=\"dataIndex\"\n class=\"card-item\"\n :style=\"{\n 'background-image': `${bgLeftUrl}, ${bgRightUrl}`,\n }\"\n >\n <div\n class=\"card-title\"\n :title=\"chartData.modelName\"\n >\n {{ chartData.modelName }}\n </div>\n <div class=\"context\">\n <span\n v-for=\"(item, index) in chartData.colDesc\"\n :key=\"item\"\n >\n <template v-if=\"dataItem\">\n {{ `${item}: ` || '-' }}<strong>{{ dataItem[item] || '-' }}</strong> {{ index === chartData.colDesc.length\n - 1 ? '' : ',' }}\n </template>\n </span>\n </div>\n </div>\n </div>\n </template>\n <Empty v-else />\n </div>\n</template>\n\n<style scoped lang=\"scss\">\n.data-chart-card {\n display: flex;\n flex-direction: column;\n\n .title {\n margin: 0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0 5.5px;\n line-height: 26px;\n font-family: sans-serif;\n font-size: 14px;\n font-weight: 600;\n color: #464646;\n }\n\n .data-chart-card-grid-layout {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 10px;\n width: calc(100% - 3px);\n }\n\n .data-chart-card-wrap {\n height: 100% !important;\n\n .card-item {\n width: 100% !important;\n }\n }\n\n .card-item {\n position: relative;\n background-repeat: no-repeat;\n background-position: left top, right top;\n background-size: contain, contain;\n border: 2px solid #2196f3;\n border-radius: 6px;\n\n .suffix-icon {\n position: absolute;\n right: 1px;\n bottom: calc(25% - 14px);\n width: 20px;\n font-size: 20px;\n font-weight: bold;\n color: #fff;\n text-align: center;\n }\n\n .card-title {\n padding-left: 15px;\n margin-top: 10px;\n margin-bottom: 5px;\n overflow: hidden;\n font-size: 16px;\n font-weight: bold;\n color: #2196f3;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .context {\n padding: 0 30px 10px 20px;\n font-size: 14px;\n color: #464646;\n }\n }\n}\n</style>\n"],"names":["props","__props","bgLeftUrl","bgLeft","bgRightUrl","bgRight","cardTitle","dataItem","colDesc","chartData","xGroupByDesc"],"mappings":"isBAWA,MAAMA,EAAQC,EAaRC,EAAY,OAAOC,EAAAA,WACnBC,EAAa,OAAOC,EAAAA,WAE1B,SAASC,EAAUC,GACjB,MAAMC,EAAUR,EAAMS,UAAUC,cAAcF,SAAW,GAEzD,OAAOA,EAAWA,EAAUD,EAASC,GAAY,EAAA"}
|
1
|
+
{"version":3,"file":"card.vue2.cjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/card.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { PropType } from 'vue'\nimport type { EChartData, IFormatPublicData } from '../utils/types'\nimport bgLeft from './data-chart-card-bg-left.svg'\nimport bgRight from './data-chart-card-bg-right.svg'\nimport Empty from './empty.vue'\n\ndefineOptions({\n name: 'DataChartCard',\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\n// 将 SVG 文件转换为 URL\nconst bgLeftUrl = `url(${bgLeft})`\nconst bgRightUrl = `url(${bgRight})`\n\nfunction cardTitle(dataItem: EChartData['data'][0]) {\n const colDesc = props.chartData.xGroupByDesc?.colDesc || ''\n\n return colDesc ? (colDesc + dataItem[colDesc]) : ''\n}\n</script>\n\n<template>\n <div class=\"data-chart-card\">\n <p class=\"title\">\n {{ chartData.modelName }}\n </p>\n <template v-if=\"chartData.data.length\">\n <el-scrollbar v-if=\"chartData.groupByDesc.length\">\n <div :class=\"{ 'data-chart-card-grid-layout': chartData.groupByDesc.length }\">\n <div\n v-for=\"(dataItem, dataIndex) in chartData.data\"\n :key=\"dataIndex\"\n class=\"card-item\"\n :style=\"{\n 'background-image': `${bgLeftUrl}, ${bgRightUrl}`,\n }\"\n >\n <div\n class=\"card-title\"\n :title=\"cardTitle(dataItem)\"\n >\n {{ cardTitle(dataItem) }}\n </div>\n <div class=\"context\">\n <span\n v-for=\"(item, index) in chartData.colDesc\"\n :key=\"item\"\n >\n {{ `${item}: ` || '-' }}<strong>{{ dataItem[item] || '-' }}</strong> {{ index === chartData.colDesc.length\n - 1 ? '' : ',' }}\n </span>\n </div>\n <div class=\"suffix-icon\">\n {{ dataIndex + 1 }}\n </div>\n </div>\n </div>\n </el-scrollbar>\n <div\n v-else\n class=\"data-chart-card-wrap\"\n >\n <div\n v-for=\"(dataItem, dataIndex) in chartData.data\"\n :key=\"dataIndex\"\n class=\"card-item\"\n :style=\"{\n 'background-image': `${bgLeftUrl}, ${bgRightUrl}`,\n }\"\n >\n <div\n class=\"card-title\"\n :title=\"chartData.modelName\"\n >\n {{ chartData.modelName }}\n </div>\n <div class=\"context\">\n <span\n v-for=\"(item, index) in chartData.colDesc\"\n :key=\"item\"\n >\n <template v-if=\"dataItem\">\n {{ `${item}: ` || '-' }}<strong>{{ dataItem[item] || '-' }}</strong> {{ index === chartData.colDesc.length\n - 1 ? '' : ',' }}\n </template>\n </span>\n </div>\n </div>\n </div>\n </template>\n <Empty v-else />\n </div>\n</template>\n\n<style scoped lang=\"scss\">\n.data-chart-card {\n display: flex;\n flex-direction: column;\n\n .title {\n margin: 0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0 5.5px;\n line-height: 26px;\n font-family: sans-serif;\n font-size: 14px;\n font-weight: 600;\n color: #464646;\n }\n\n .data-chart-card-grid-layout {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 10px;\n width: calc(100% - 3px);\n }\n\n .data-chart-card-wrap {\n height: 100% !important;\n\n .card-item {\n width: 100% !important;\n }\n }\n\n .card-item {\n position: relative;\n background-repeat: no-repeat;\n background-position: left top, right top;\n background-size: contain, contain;\n border: 2px solid #2196f3;\n border-radius: 6px;\n\n .suffix-icon {\n position: absolute;\n right: 1px;\n bottom: calc(25% - 14px);\n width: 20px;\n font-size: 20px;\n font-weight: bold;\n color: #fff;\n text-align: center;\n }\n\n .card-title {\n padding-left: 15px;\n margin-top: 10px;\n margin-bottom: 5px;\n overflow: hidden;\n font-size: 16px;\n font-weight: bold;\n color: #2196f3;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .context {\n padding: 0 30px 10px 20px;\n font-size: 14px;\n color: #464646;\n }\n }\n}\n</style>\n"],"names":["props","__props","bgLeftUrl","bgLeft","bgRightUrl","bgRight","cardTitle","dataItem","colDesc","chartData","xGroupByDesc","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_toDisplayString","modelName","data","length","_Fragment","key","groupByDesc","_createBlock","_component_el_scrollbar","class","_normalizeClass","dataIndex","style","_normalizeStyle","title","_hoisted_3","_hoisted_4","item","index","_createTextVNode","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","Empty"],"mappings":"isBAWA,MAAMA,EAAQC,EAaRC,EAAY,OAAOC,EAAAA,WACnBC,EAAa,OAAOC,EAAAA,WAE1B,SAASC,EAAUC,GACjB,MAAMC,EAAUR,EAAMS,UAAUC,cAAcF,SAAW,GAEzD,OAAOA,EAAWA,EAAUD,EAASC,GAAY,EACnD,qCAIE,OAAAG,cAAAC,qBAqEM,MArENC,EAqEM,CApEJC,EAAAA,mBAEI,IAFJC,EAEIC,kBADCf,EAAAQ,UAAUQ,WAAS,GAERhB,EAAAQ,UAAUS,KAAKC,sBAA/BP,EAAAA,mBA+DWQ,EAAAA,SAAA,CAAAC,IAAA,GAAA,CA9DWpB,EAAAQ,UAAUa,YAAYH,sBAA1CI,EAAAA,YA8BeC,EAAA,CAAAH,IAAA,GAAA,mBA7Bb,IA4BM,CA5BNP,EAAAA,mBA4BM,MAAA,CA5BAW,MAAKC,EAAAA,eAAA,CAAA,8BAAmCzB,EAAAQ,UAAUa,YAAYH,YAClER,EAAAA,WAAA,GAAAC,EAAAA,mBA0BMQ,EAAAA,2BAzB4BnB,EAAAQ,UAAUS,KAAI,CAAtCX,EAAUoB,mBADpBf,EAAAA,mBA0BM,MAAA,CAxBHS,IAAKM,EACNF,MAAM,YACLG,MAAKC,EAAAA,eAAA,CAAyC,mBAAA,GAAA3B,MAAcE,QAI7DU,EAAAA,mBAKM,MAAA,CAJJW,MAAM,aACLK,MAAOxB,EAAUC,IAEfS,EAAAA,gBAAAV,EAAUC,IAAQ,EAAAwB,GAEvBjB,EAAAA,mBAQM,MARNkB,EAQM,EAPJrB,EAAAA,WAAA,GAAAC,EAAAA,mBAMOQ,EAAAA,2BALmBnB,EAAAQ,UAAUD,QAAO,CAAjCyB,EAAMC,mBADhBtB,EAAAA,mBAMO,OAAA,CAJJS,IAAKY,GAAI,wCAEJA,OAAI,KAAA,GAAcnB,EAAAA,mBAA4C,SAAA,KAAAE,EAAAA,gBAAjCT,EAAS0B,IAAI,KAAA,GAAoBE,EAAAA,gBAAA,sBAAID,IAAUjC,YAAUO,QAAQW,gCAIxGL,EAAAA,mBAEM,MAFNsB,EAEMpB,EAAAA,gBADDW,EAAS,GAAA,6BAKpBhB,EAAAA,YAAAC,qBA8BM,MA9BNyB,EA8BM,EA1BJ1B,EAAAA,WAAA,GAAAC,EAAAA,mBAyBMQ,EAAAA,2BAxB4BnB,EAAAQ,UAAUS,KAAI,CAAtCX,EAAUoB,mBADpBf,EAAAA,mBAyBM,MAAA,CAvBHS,IAAKM,EACNF,MAAM,YACLG,MAAKC,EAAAA,eAAA,CAAuC,mBAAA,GAAA3B,MAAcE,QAI3DU,EAAAA,mBAKM,MAAA,CAJJW,MAAM,aACLK,MAAO7B,EAAAQ,UAAUQ,WAEfD,EAAAA,gBAAAf,EAAAQ,UAAUQ,WAAS,EAAAqB,GAExBxB,EAAAA,mBAUM,MAVNyB,EAUM,EATJ5B,EAAAA,WAAA,GAAAC,EAAAA,mBAQOQ,EAAAA,2BAPmBnB,EAAAQ,UAAUD,QAAO,CAAjCyB,EAAMC,mBADhBtB,EAAAA,mBAQO,OAAA,CANJS,IAAKY,GAAI,CAEM1B,iBAAhBK,EAAAA,mBAGWQ,EAAAA,SAAA,CAAAC,IAAA,GAAA,wCAFHY,OAAI,KAAA,GAAcnB,EAAAA,mBAA4C,SAAA,KAAAE,EAAAA,gBAAjCT,EAAS0B,IAAI,KAAA,GAAoBE,EAAAA,gBAAA,sBAAID,IAAUjC,YAAUO,QAAQW,0GAQhHI,EAAAA,YAAgBiB,EAAAA,QAAA,CAAAnB,IAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"empty.vue.cjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/empty.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useNamespace } from '@qxs-bns/hooks'\n// 导入 SVG\nimport emptyIcon from './empty.svg'\n\ndefineOptions({\n name: 'Empty',\n})\n\nconst {\n image = emptyIcon,\n description = '暂无数据',\n imageSize = { width: '100px', height: 'auto' },\n} = defineProps<Props>()\n\ninterface Props {\n image?: string\n description?: string\n imageSize?: { width: string, height: string }\n}\n\nconst ns = useNamespace('data-chart')\n</script>\n\n<template>\n <div :class=\"[ns.e('empty')]\">\n <div :class=\"[ns.e('empty-content')]\">\n <img\n :style=\"imageSize\"\n :src=\"image\"\n :alt=\"description\"\n ><span :class=\"[ns.e('empty-description')]\">{{ description }}</span>\n </div>\n </div>\n</template>\n"],"names":["ns","useNamespace"],"mappings":"
|
1
|
+
{"version":3,"file":"empty.vue.cjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/empty.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useNamespace } from '@qxs-bns/hooks'\n// 导入 SVG\nimport emptyIcon from './empty.svg'\n\ndefineOptions({\n name: 'Empty',\n})\n\nconst {\n image = emptyIcon,\n description = '暂无数据',\n imageSize = { width: '100px', height: 'auto' },\n} = defineProps<Props>()\n\ninterface Props {\n image?: string\n description?: string\n imageSize?: { width: string, height: string }\n}\n\nconst ns = useNamespace('data-chart')\n</script>\n\n<template>\n <div :class=\"[ns.e('empty')]\">\n <div :class=\"[ns.e('empty-content')]\">\n <img\n :style=\"imageSize\"\n :src=\"image\"\n :alt=\"description\"\n ><span :class=\"[ns.e('empty-description')]\">{{ description }}</span>\n </div>\n </div>\n</template>\n"],"names":["ns","useNamespace","_createElementBlock","class","_normalizeClass","_unref","e","_createElementVNode","style","imageSize","src","image","alt","description"],"mappings":"yaAqBA,MAAMA,EAAKC,EAAAA,aAAa,0CAItBC,EAAAA,mBAQM,MAAA,CARAC,MAAKC,EAAAA,eAAA,CAAGC,EAAAA,MAAAL,GAAGM,EAAC,aAChBC,EAAAA,mBAMM,MAAA,CANAJ,MAAKC,EAAAA,eAAA,CAAGC,EAAAA,MAAAL,GAAGM,EAAC,qBAChBC,EAAAA,mBAIC,MAAA,CAHEC,uBAAOC,EAAAA,WACPC,IAAKC,EAAAA,MACLC,IAAKC,EAAAA,wBACPN,EAAAA,mBAAmE,OAAA,CAA5DJ,MAAKC,EAAAA,eAAA,CAAGC,EAAAA,MAAAL,GAAGM,EAAC,0CAA2BO,EAAAA,aAAW"}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("../utils/injectionKeys.cjs"),a=require("../utils/useCharts.cjs"),r=e.defineComponent({name:"DataChartFunnel",__name:"funnel",props:{chartData:{type:Object,required:!0},chartOptions:{type:null,required:!0}},setup(r){const n=e.ref(),l=e.inject(t.InjectionChartMerge,
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("../utils/injectionKeys.cjs"),a=require("../utils/useCharts.cjs"),r=e.defineComponent({name:"DataChartFunnel",__name:"funnel",props:{chartData:{type:Object,required:!0},chartOptions:{type:null,required:!0}},setup(r){const n=e.ref(),l=e.inject(t.InjectionChartMerge,e=>e,!0),c=e.computed(()=>{const{colDesc:e,xGroupByDesc:t,modelName:a,data:n}=r.chartData,c={title:{text:a},legend:{},series:e.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:n.map(a=>({name:a[t?.colDesc||""],value:a[e]||""}))}))};return 1!==e.length&&(c.legend.data=e),l(c,r.chartOptions)});return a.useCharts({chartDOM:n,chartOptions:c,chartData:e.computed(()=>r.chartData)}),(t,a)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"dataChartFunnel",ref:n,class:"data-chart-funnel"},null,512))}});exports.default=r;
|
2
2
|
//# sourceMappingURL=funnel.vue.cjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"funnel.vue.cjs","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 '../utils/types'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartFunnel',\n})\nconst {\n chartOptions,\n chartData,\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\n ref=\"dataChartFunnel\"\n class=\"data-chart-funnel\"\n />\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":"2TAgBA,MAAMA,EAAkBC,EAAAA,MAClBC,EAAQC,EAAAA,OAAOC,EAAAA,
|
1
|
+
{"version":3,"file":"funnel.vue.cjs","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 '../utils/types'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartFunnel',\n})\nconst {\n chartOptions,\n chartData,\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\n ref=\"dataChartFunnel\"\n class=\"data-chart-funnel\"\n />\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","_createElementBlock","class"],"mappings":"2TAgBA,MAAMA,EAAkBC,EAAAA,MAClBC,EAAQC,EAAAA,OAAOC,EAAAA,oBAAsBC,GAAWA,GAAG,GACnDC,EAAqBC,EAAAA,SAAwB,KACjD,MAAMC,QAAEA,EAAAC,aAASA,EAAAC,UAAcA,EAAAC,KAAWA,GAASC,EAAAC,UAE7CC,EAAS,CACbC,MAAO,CACLC,KAAMN,GAERO,OAAQ,CAAA,EACRC,OAAQV,EAAQW,IAAKC,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,IAAIc,IAAA,CACbZ,KAAMY,EAAMxB,GAAcD,SAAW,IACrC0B,MAAOD,EAAMb,IAAS,UAQ9B,OAHuB,IAAnBZ,EAAQ2B,SACTrB,EAAOG,OAAwBN,KAAOH,GAElCN,EAAMY,EAAQF,EAAAwB,uBAEvBC,EAAAA,UAAU,CAAEC,SAAUtC,EAAiBoC,aAAc9B,EAAoBO,UAAWN,WAAS,IAAMK,EAAAC,mCAIjG0B,EAAAA,mBAGE,MAAA,SAFI,kBAAJtC,IAAID,EACJwC,MAAM"}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("../utils/injectionKeys.cjs"),a=require("../utils/useCharts.cjs"),r=e.defineComponent({name:"DataChartLine",__name:"line",props:{chartData:{type:Object,required:!0},subShowType:{type:String,required:!0,default:"line-simple"},chartOptions:{type:null,required:!0}},setup(r){const s=e.ref(),n=e.inject(t.InjectionChartMerge,
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("../utils/injectionKeys.cjs"),a=require("../utils/useCharts.cjs"),r=e.defineComponent({name:"DataChartLine",__name:"line",props:{chartData:{type:Object,required:!0},subShowType:{type:String,required:!0,default:"line-simple"},chartOptions:{type:null,required:!0}},setup(r){const s=e.ref(),n=e.inject(t.InjectionChartMerge,e=>e,!0),c=15,i="Total",l=!0;const o=e.computed(()=>{const{colDesc:e,xGroupByDesc:t,groupByDesc:a,data:s,modelName:o}=r.chartData,u=Array.from(new Set(s?.map(e=>e[t?.colDesc||""]))).filter(e=>null!=e)||[],p=a?.find(e=>!e.xAxis),d={title:{text:o},legend:{data:[]},xAxis:{name:t?.colDesc||"",data:u},dataZoom:[{type:"inside",disabled:u.length<c}]};if(1===a?.length)d.series=e.map(e=>({name:e,type:"line",smooth:l,data:s.map(t=>t[e]).filter(e=>null!=e)})),d.legend.data=e;else if(2===a?.length){const a=[...new Set(s.map(e=>String(e[p?.colDesc||""])))];d.legend.data=a,d.series=a.map(a=>function(e,t,a,r,s,n){const c=[];return t.forEach(t=>{const i=a.find(a=>a[r?.colDesc]===t&&a[s?.colDesc]===e);i?c.push(i[n[0]]):c.push(0)}),{name:e,type:"line",smooth:l,stack:i,areaStyle:{},data:c}}(a,u,s,t,p,e))}return d.series=d.series?.map(e=>{const t={...e};switch(r.subShowType){case"line-simple":default:delete t.areaStyle;break;case"area-basic":t.areaStyle={}}return t}),n(d,r.chartOptions)});return a.useCharts({chartDOM:s,chartOptions:o,chartData:e.computed(()=>r.chartData)}),(t,a)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"dataChartLine",ref:s,class:"data-chart-line"},null,512))}});exports.default=r;
|
2
2
|
//# sourceMappingURL=line.vue2.cjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"line.vue2.cjs","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 '../utils/types'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartLine',\n})\nconst {\n chartData,\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 smooth?: boolean\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 SMOOTH: true,\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 smooth: CHART_CONSTANTS.SMOOTH,\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 || '']))).filter(item => item !== undefined && item !== null) || []\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 smooth: CHART_CONSTANTS.SMOOTH,\n data: data.map(item => item[yItem]).filter(item => item !== undefined && item !== null),\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({\n chartDOM: dataChartLine,\n chartOptions: lineChartOptions,\n chartData: computed(() => chartData),\n})\n</script>\n\n<template>\n <div\n ref=\"dataChartLine\"\n class=\"data-chart-line\"\n />\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","filter","yGroupByDesc","find","xAxis","config","title","text","legend","name","dataZoom","type","disabled","length","series","yItem","smooth","legendData","String","legendDataItem","seriesData","forEach","xAxisItem","targetData","dataItem","push","stack","areaStyle","processSeriesData","seriesItem","subShowType","chartOptions","useCharts","chartDOM"],"mappings":"mXAkBA,MAAMA,EAAgBC,EAAAA,MAChBC,EAAQC,EAAAA,OAAOC,EAAAA,
|
1
|
+
{"version":3,"file":"line.vue2.cjs","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 '../utils/types'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartLine',\n})\nconst {\n chartData,\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 smooth?: boolean\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 SMOOTH: true,\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 smooth: CHART_CONSTANTS.SMOOTH,\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 || '']))).filter(item => item !== undefined && item !== null) || []\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 smooth: CHART_CONSTANTS.SMOOTH,\n data: data.map(item => item[yItem]).filter(item => item !== undefined && item !== null),\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({\n chartDOM: dataChartLine,\n chartOptions: lineChartOptions,\n chartData: computed(() => chartData),\n})\n</script>\n\n<template>\n <div\n ref=\"dataChartLine\"\n class=\"data-chart-line\"\n />\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","filter","yGroupByDesc","find","xAxis","config","title","text","legend","name","dataZoom","type","disabled","length","series","yItem","smooth","legendData","String","legendDataItem","seriesData","forEach","xAxisItem","targetData","dataItem","push","stack","areaStyle","processSeriesData","seriesItem","subShowType","chartOptions","useCharts","chartDOM","_createElementBlock","class"],"mappings":"mXAkBA,MAAMA,EAAgBC,EAAAA,MAChBC,EAAQC,EAAAA,OAAOC,EAAAA,oBAAsBC,GAAWA,GAAG,GAanDC,EACa,GADbA,EAEQ,QAFRA,GAGI,EAqCV,MAAMC,EAAmBC,EAAAA,SAAwB,KAC/C,MAAMC,QAAEA,EAAAC,aAASA,EAAAC,YAAcA,OAAaC,EAAAC,UAAMA,GAAcC,EAAAC,UAC1DC,EAAYC,MAAMC,KAAK,IAAIC,IAAIP,GAAMQ,IAAIC,GAAQA,EAAKX,GAAcD,SAAW,OAAOa,OAAOD,GAAQA,UAAwC,GAC7IE,EAAeZ,GAAaa,KAAKH,IAASA,EAAKI,OAE/CC,EAAoD,CACxDC,MAAO,CAAEC,KAAMf,GACfgB,OAAQ,CAAEjB,KAAM,IAChBa,MAAO,CACLK,KAAMpB,GAAcD,SAAW,GAC/BG,KAAMI,GAERe,SAAU,CAAC,CACTC,KAAM,SACNC,SAAUjB,EAAUkB,OAAS5B,KAKjC,GAA4B,IAAxBK,GAAauB,OACfR,EAAOS,OAAS1B,EAAQW,IAAIgB,IAAA,CAC1BN,KAAMM,EACNJ,KAAM,OACNK,OAAQ/B,EACRM,KAAMA,EAAKQ,IAAIC,GAAQA,EAAKe,IAAQd,OAAOD,GAAQA,YAEpDK,EAAOG,OAAiCjB,KAAOH,OAClD,GACiC,IAAxBE,GAAauB,OAAc,CAClC,MAAMI,EAAa,IAAI,IAAInB,IAAIP,EAAKQ,IAAIC,GAAQkB,OAAOlB,EAAKE,GAAcd,SAAW,QACnFiB,EAAOG,OAAiCjB,KAAO0B,EAEjDZ,EAAOS,OAASG,EAAWlB,OAjE/B,SAA2BoB,EACzBxB,EACAJ,EACAF,EACAa,EACAd,GACA,MAAMgC,EAAkC,GAiBxC,OAfAzB,EAAU0B,QAASC,IACjB,MAAMC,EAAahC,EAChBY,KAAKqB,GACJA,EAASnC,GAAcD,WAAakC,GACjCE,EAAStB,GAAcd,WAAa+B,GAGvCI,EACFH,EAAWK,KAAKF,EAAWnC,EAAQ,KAGnCgC,EAAWK,KAAK,KAIb,CACLhB,KAAMU,EACNR,KAAM,OACNK,OAAQ/B,EACRyC,MAAOzC,EACP0C,UAAW,CAAA,EACXpC,KAAM6B,EAEV,CAmCMQ,CAAkBT,EAAgBxB,EAAWJ,EAAMF,EAAca,EAAcd,GAEnF,CAoBA,OAjBAiB,EAAOS,OAAST,EAAOS,QAAQf,IAAKC,IAClC,MAAM6B,EAAa,IAAK7B,GAExB,OAAQP,EAAAqC,aACN,IAAK,cAML,eACSD,EAAWF,gBAJpB,IAAK,aACHE,EAAWF,UAAY,CAAA,EAM3B,OAAOE,IAGFhD,EAAMwB,EAAQZ,EAAAsC,uBAEvBC,YAAU,CACRC,SAAUtD,EACVoD,aAAc7C,EACdQ,UAAWP,EAAAA,SAAS,IAAMM,EAAAC,mCAK1BwC,EAAAA,mBAGE,MAAA,SAFI,gBAAJtD,IAAID,EACJwD,MAAM"}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("lodash-es"),r=require("../utils/injectionKeys.cjs"),a=require("../utils/useCharts.cjs"),o=e.defineComponent({name:"DataChartPie",__name:"pie",props:{chartData:{type:Object,required:!0},subShowType:{type:String,required:!0,default:"pie-simple"},chartOptions:{type:null,required:!0}},setup(o){const c=e.inject(r.InjectionChartMerge,
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("lodash-es"),r=require("../utils/injectionKeys.cjs"),a=require("../utils/useCharts.cjs"),o=e.defineComponent({name:"DataChartPie",__name:"pie",props:{chartData:{type:Object,required:!0},subShowType:{type:String,required:!0,default:"pie-simple"},chartOptions:{type:null,required:!0}},setup(o){const c=e.inject(r.InjectionChartMerge,e=>e,!0),i=e.ref(null),s=e.computed(()=>{const{colDesc:e,xGroupByDesc:r,data:a,modelName:i}=o.chartData,s=e.length,l={title:{text:i},series:e.map((e,c)=>{const i={name:e,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 l=5;const n=a.filter(t=>void 0!==t[e]),u=t.orderBy(n,[e],["desc"]),h=u.reduce((t,r)=>{const a=Number(r[e])||0;return Number.isNaN(a)?t:t+a},0);if(n.length>l)for(;l<9;){const t=u.slice(0,l);if(t.reduce((t,r)=>t+Number(r[e]),0)/h>.9||8===l){const a=u.slice(l,u.length-1);i.data=n.map(a=>{let o={};return t.forEach(t=>{JSON.stringify(t)===JSON.stringify(a)&&(o={name:r?.colDesc?a[r.colDesc]:"",value:a[e]})}),o}).filter(e=>e&&Object.keys(e).length>0),i.data.push({name:"其它",value:a.reduce((t,r)=>t+Number(r[e]),0)});break}l++}else i.data=n.map(t=>({name:r?.colDesc&&t[r.colDesc]||"",value:Number(t[e]||0)}));if(1===s?i.center=["50%","60%"]:2===s?0===c?(i.right="40%",i.left="",i.center=["40%","60%"]):(i.right="",i.left="40%",i.center=["60%","60%"]):3===s?0===c?(i.right="40%",i.bottom="50%",i.top="",i.left="",i.center=["40%","78%"]):1===c?(i.right="",i.bottom="50%",i.top="",i.left="40%",i.center=["60%","78%"]):(i.right="40%",i.bottom="",i.top="50%",i.left="",i.center=["40%","60%"]):4===s&&(0===c?(i.right="40%",i.bottom="50%",i.top="",i.left="",i.center=["40%","78%"]):1===c?(i.right="",i.bottom="50%",i.top="",i.left="40%",i.center=["60%","78%"]):2===c?(i.right="40%",i.bottom="",i.top="50%",i.left="",i.center=["40%","60%"]):(i.right="",i.bottom="",i.top="50%",i.left="40%",i.center=["60%","60%"])),"pie-borderRadius"===o.subShowType)i.radius=["50%","70%"];else i.radius="50%";return i})};return c(l,o.chartOptions)});return a.useCharts({chartDOM:i,chartOptions:s,chartData:e.computed(()=>o.chartData)}),(t,r)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"dataChartPie",ref:i,class:"data-chart-pie"},null,512))}});exports.default=o;
|
2
2
|
//# sourceMappingURL=pie.vue.cjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"pie.vue.cjs","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 '../utils/types'\nimport { orderBy } from 'lodash-es'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartPie',\n})\nconst {\n chartData,\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 currentItemData = data.filter(row => row[item] !== undefined)\n const orderByData = orderBy(currentItemData, [item], ['desc'])\n // 总数\n const totalDesc = orderByData.reduce((prev, cur) => {\n const value = Number(cur[item]) || 0\n return Number.isNaN(value) ? prev : prev + value\n }, 0)\n if (currentItemData.length > cutNum) {\n while (cutNum < 9) {\n const headerData = orderByData.slice(0, cutNum)\n // 前 cutNum 个总数\n const headerTotal = headerData.reduce(\n (prev, cur) => prev + Number(cur[item]),\n 0,\n )\n // 前五总占比\n const headerScale = headerTotal / totalDesc\n if (headerScale > 0.9 || cutNum === 8) {\n const footerData = orderByData.slice(\n cutNum,\n orderByData.length - 1,\n )\n seriesItem.data = currentItemData\n .map((yItem) => {\n let obj = {}\n headerData.forEach((headerDataItem) => {\n if (JSON.stringify(headerDataItem) === JSON.stringify(yItem)) {\n obj = {\n name: xGroupByDesc?.colDesc\n ? yItem[xGroupByDesc.colDesc]\n : '',\n value: yItem[item],\n }\n }\n })\n return obj\n })\n .filter(v => v && Object.keys(v).length > 0)\n seriesItem.data.push({\n name: '其它',\n value: footerData.reduce(\n (prev, cur) => prev + Number(cur[item]),\n 0,\n ),\n })\n\n break\n }\n else {\n cutNum++\n }\n }\n }\n else {\n seriesItem.data = currentItemData.map(yItem => ({\n name: xGroupByDesc?.colDesc ? (yItem[xGroupByDesc.colDesc] || '') : '',\n value: Number(yItem[item] || 0),\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\n return merge(config, chartOptions)\n})\n\nuseCharts({\n chartDOM: dataChartPie,\n chartOptions: pieChartOptions,\n chartData: computed(() => chartData),\n})\n</script>\n\n<template>\n <div\n ref=\"dataChartPie\"\n class=\"data-chart-pie\"\n />\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","currentItemData","filter","row","orderByData","orderBy","totalDesc","reduce","prev","cur","value","Number","isNaN","headerData","slice","footerData","yItem","obj","forEach","headerDataItem","JSON","stringify","Object","keys","push","right","left","bottom","top","subShowType","radius","chartOptions","useCharts","chartDOM"],"mappings":"uYAmBA,MAAMA,EAAQC,EAAAA,OAAOC,EAAAA,
|
1
|
+
{"version":3,"file":"pie.vue.cjs","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 '../utils/types'\nimport { orderBy } from 'lodash-es'\nimport { InjectionChartMerge } from '../utils/injectionKeys'\nimport { useCharts } from '../utils/useCharts'\n\ndefineOptions({\n name: 'DataChartPie',\n})\nconst {\n chartData,\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 currentItemData = data.filter(row => row[item] !== undefined)\n const orderByData = orderBy(currentItemData, [item], ['desc'])\n // 总数\n const totalDesc = orderByData.reduce((prev, cur) => {\n const value = Number(cur[item]) || 0\n return Number.isNaN(value) ? prev : prev + value\n }, 0)\n if (currentItemData.length > cutNum) {\n while (cutNum < 9) {\n const headerData = orderByData.slice(0, cutNum)\n // 前 cutNum 个总数\n const headerTotal = headerData.reduce(\n (prev, cur) => prev + Number(cur[item]),\n 0,\n )\n // 前五总占比\n const headerScale = headerTotal / totalDesc\n if (headerScale > 0.9 || cutNum === 8) {\n const footerData = orderByData.slice(\n cutNum,\n orderByData.length - 1,\n )\n seriesItem.data = currentItemData\n .map((yItem) => {\n let obj = {}\n headerData.forEach((headerDataItem) => {\n if (JSON.stringify(headerDataItem) === JSON.stringify(yItem)) {\n obj = {\n name: xGroupByDesc?.colDesc\n ? yItem[xGroupByDesc.colDesc]\n : '',\n value: yItem[item],\n }\n }\n })\n return obj\n })\n .filter(v => v && Object.keys(v).length > 0)\n seriesItem.data.push({\n name: '其它',\n value: footerData.reduce(\n (prev, cur) => prev + Number(cur[item]),\n 0,\n ),\n })\n\n break\n }\n else {\n cutNum++\n }\n }\n }\n else {\n seriesItem.data = currentItemData.map(yItem => ({\n name: xGroupByDesc?.colDesc ? (yItem[xGroupByDesc.colDesc] || '') : '',\n value: Number(yItem[item] || 0),\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\n return merge(config, chartOptions)\n})\n\nuseCharts({\n chartDOM: dataChartPie,\n chartOptions: pieChartOptions,\n chartData: computed(() => chartData),\n})\n</script>\n\n<template>\n <div\n ref=\"dataChartPie\"\n class=\"data-chart-pie\"\n />\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","currentItemData","filter","row","orderByData","orderBy","totalDesc","reduce","prev","cur","value","Number","isNaN","headerData","slice","footerData","yItem","obj","forEach","headerDataItem","JSON","stringify","Object","keys","push","right","left","bottom","top","subShowType","radius","chartOptions","useCharts","chartDOM","_createElementBlock","class"],"mappings":"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"}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),a=require("lodash-es"),r=require("../utils/injectionKeys.cjs"),t=require("../utils/useCharts.cjs"),u=e.defineComponent({name:"DataChartRadar",__name:"radar",props:{chartData:{type:Object,required:!0},chartOptions:{type:null,required:!0}},setup(u){const s=e.ref(),c=e.inject(r.InjectionChartMerge,
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),a=require("lodash-es"),r=require("../utils/injectionKeys.cjs"),t=require("../utils/useCharts.cjs"),u=e.defineComponent({name:"DataChartRadar",__name:"radar",props:{chartData:{type:Object,required:!0},chartOptions:{type:null,required:!0}},setup(u){const s=e.ref(),c=e.inject(r.InjectionChartMerge,e=>e,!0),o=e.computed(()=>{const{colDesc:e,xGroupByDesc:r,modelName:t,data:s}=u.chartData;r?.groupByValues||(r.groupByValues=[]),r.groupByValues=a.uniq(s.map(e=>e[r.colDesc||""]).filter(e=>e));const o={title:{text:t},radar:{indicator:r?.groupByValues?.map(a=>({name:a,max:Math.max(...s.map(a=>Number(a[e[0]])))}))||[]},series:[{name:r?.colDesc,type:"radar",tooltip:{trigger:"item"},data:e.map(e=>({name:e,value:r?.groupByValues?.map(a=>s.map(t=>a===t[r.colDesc||""]?t[e]:null).filter(e=>e).reduce((e,a)=>Number(e||0)+Number(a||0),0))}))}]};return c(o,u.chartOptions)});return t.useCharts({chartDOM:s,chartOptions:o,chartData:e.computed(()=>u.chartData)}),(a,r)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"dataChartRadar",ref:s,class:"data-chart-radar"},null,512))}});exports.default=u;
|
2
2
|
//# sourceMappingURL=radar.vue.cjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"radar.vue.cjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/radar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { EChartsOption, IFormatPublicData } from '../utils/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 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\n ref=\"dataChartRadar\"\n class=\"data-chart-radar\"\n />\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":"gVAkBA,MAAMA,EAAiBC,EAAAA,MACjBC,EAAQC,EAAAA,OAAOC,EAAAA,
|
1
|
+
{"version":3,"file":"radar.vue.cjs","sources":["../../../../../../../packages/components/src/data-chart/src/components/radar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { EChartsOption, IFormatPublicData } from '../utils/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 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\n ref=\"dataChartRadar\"\n class=\"data-chart-radar\"\n />\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","_createElementBlock","class"],"mappings":"gVAkBA,MAAMA,EAAiBC,EAAAA,MACjBC,EAAQC,EAAAA,OAAOC,EAAAA,oBAAsBC,GAAWA,GAAG,GACnDC,EAAoBC,EAAAA,SAAwB,KAChD,MAAMC,QAAEA,EAAAC,aAASA,EAAAC,UAAcA,EAAAC,KAAWA,GAASC,EAAAC,UAE9CJ,GAAcK,gBACjBL,EAAaK,cAAgB,IAE/BL,EAAaK,cAAgBC,EAAAA,KAAKJ,EAAKK,IAAKC,GACnCA,EAAKR,EAAaD,SAAW,KACnCU,OAAOb,GAAKA,IAEf,MAAMc,EAAS,CACbC,MAAO,CACLC,KAAMX,GAERY,MAAO,CACLC,UAAWd,GAAcK,eAAeE,IAAKQ,IACpC,CACLC,KAAMD,EACNE,IAAKC,KAAKD,OAAOf,EAAKK,IAAIC,GAAQW,OAAOX,EAAKT,EAAQ,WAEpD,IAERqB,OAAQ,CAAC,CACPJ,KAAMhB,GAAcD,QACpBsB,KAAM,QACNC,QAAS,CACPC,QAAS,QAEXrB,KAAMH,EAAQQ,IAAIiB,IAAA,CAChBR,KAAMQ,EACNC,MAAOzB,GAAcK,eAAeE,IAAKQ,GAC/Bb,EAAKK,IAAKmB,GACZX,IAAsBW,EAAS1B,EAAaD,SAAW,IAClD2B,EAASF,GAEX,MACNf,UAAYb,GAAI+B,OAAO,CAACC,EAAKC,IAAQV,OAAOS,GAAO,GAAKT,OAAOU,GAAO,GAAI,UAMrF,OAAOpC,EAAMiB,EAAQP,EAAA2B,uBAEvBC,EAAAA,UAAU,CAAEC,SAAUzC,EAAgBuC,aAAcjC,EAAmBO,UAAWN,WAAS,IAAMK,EAAAC,mCAI/F6B,EAAAA,mBAGE,MAAA,SAFI,iBAAJzC,IAAID,EACJ2C,MAAM"}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("../utils/injectionKeys.cjs"),a=require("../utils/useCharts.cjs"),r=e.defineComponent({name:"DataChartScatterSimple",__name:"scatter-simple",props:{chartData:{type:Object,required:!0},chartOptions:{type:null,required:!0}},setup(r){const s=e.ref(),c=e.inject(t.InjectionChartMerge,
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("../utils/injectionKeys.cjs"),a=require("../utils/useCharts.cjs"),r=e.defineComponent({name:"DataChartScatterSimple",__name:"scatter-simple",props:{chartData:{type:Object,required:!0},chartOptions:{type:null,required:!0}},setup(r){const s=e.ref(),c=e.inject(t.InjectionChartMerge,e=>e,!0),i=e.computed(()=>{const{colDesc:e,xGroupByDesc:t,modelName:a,data:s}=r.chartData,i={title:{text:a},tooltip:{formatter:e=>e.value.length>1?`${e.seriesName} :<br/>${e.value[0]} ${e.value[1]} `:`${e.seriesName} :<br/>${e.name} : ${e.value} `},series:e.map(e=>({symbolSize:20,name:e,data:s.map(a=>[a[e],a[t?.colDesc||""]]),type:"scatter"}))};return c(i,r.chartOptions)});return a.useCharts({chartDOM:s,chartOptions:i,chartData:e.computed(()=>r.chartData)}),(t,a)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"dataChartScatterSimple",ref:s,class:"data-chart-scatter-simple"},null,512))}});exports.default=r;
|
2
2
|
//# sourceMappingURL=scatter-simple.vue.cjs.map
|