mirror of
https://gitee.com/dromara/go-view.git
synced 2025-06-30 08:39:15 +08:00
feat: 代码打包优化
This commit is contained in:
parent
54a4cafefd
commit
96473e6139
@ -14,7 +14,7 @@ export const RadarShapeEnumList = [
|
|||||||
|
|
||||||
interface maxMapType {
|
interface maxMapType {
|
||||||
[k: string]: {
|
[k: string]: {
|
||||||
max: number,
|
max: number | null,
|
||||||
min: number
|
min: number
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -22,7 +22,8 @@ interface maxMapType {
|
|||||||
export const option = {
|
export const option = {
|
||||||
maxMap: {} as maxMapType,
|
maxMap: {} as maxMapType,
|
||||||
tooltip: {
|
tooltip: {
|
||||||
show: true
|
show: true,
|
||||||
|
position: ((point: number[], params:unknown, dom:unknown, rect:unknown, size: { contentSize: number[] }) => point),
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
data: []
|
data: []
|
||||||
|
@ -97,10 +97,10 @@
|
|||||||
|
|
||||||
<SettingItemBox :name="item.key" v-for="(item, i) in maxList" :key="i">
|
<SettingItemBox :name="item.key" v-for="(item, i) in maxList" :key="i">
|
||||||
<SettingItem name="最小值">
|
<SettingItem name="最小值">
|
||||||
<n-input-number :value="item.min" @update:value="v => handleUpdate(item.key, 'min', v)" size="small" :min="0"/>
|
<n-input-number :value="item.min" @update:value="(v: number) => handleUpdate(item.key, 'min', v)" size="small" :min="0"/>
|
||||||
</SettingItem>
|
</SettingItem>
|
||||||
<SettingItem name="最大值">
|
<SettingItem name="最大值">
|
||||||
<n-input-number :value="item.max" @update:value="v => handleUpdate(item.key, 'max', v)" size="small" :min="0"/>
|
<n-input-number :value="item.max" @update:value="(v: number) => handleUpdate(item.key, 'max', v)" size="small" :min="0"/>
|
||||||
</SettingItem>
|
</SettingItem>
|
||||||
</SettingItemBox>
|
</SettingItemBox>
|
||||||
</CollapseItem>
|
</CollapseItem>
|
||||||
@ -152,8 +152,9 @@ const sliderFormatTooltip = (v: number) => {
|
|||||||
return `${v}%`
|
return `${v}%`
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface SourceItemType { [k: string]: any}
|
||||||
let maxList = computed(() => {
|
let maxList = computed(() => {
|
||||||
let arr = props.optionData.dataset.source.map(_ => {
|
let arr = props.optionData.dataset.source.map((_:SourceItemType) => {
|
||||||
let nameKey = props.optionData.dataset.dimensions[0]
|
let nameKey = props.optionData.dataset.dimensions[0]
|
||||||
return {
|
return {
|
||||||
key: _[nameKey],
|
key: _[nameKey],
|
||||||
@ -165,7 +166,7 @@ let maxList = computed(() => {
|
|||||||
return arr
|
return arr
|
||||||
})
|
})
|
||||||
|
|
||||||
const handleUpdate = (k: string, type: string, v: string) => {
|
const handleUpdate = (k: string, type: string, v: number) => {
|
||||||
if(type === 'min') props.optionData.maxMap[k].min = v
|
if(type === 'min') props.optionData.maxMap[k].min = v
|
||||||
else if(type === 'max') props.optionData.maxMap[k].max = v
|
else if(type === 'max') props.optionData.maxMap[k].max = v
|
||||||
}
|
}
|
||||||
|
@ -10,7 +10,7 @@ import dataJson from './data.json'
|
|||||||
import { use } from 'echarts/core'
|
import { use } from 'echarts/core'
|
||||||
import { CanvasRenderer } from 'echarts/renderers'
|
import { CanvasRenderer } from 'echarts/renderers'
|
||||||
import { RadarChart } from 'echarts/charts'
|
import { RadarChart } from 'echarts/charts'
|
||||||
import { includes } from './config'
|
import { includes, option as myOption } from './config'
|
||||||
import { mergeTheme, setOption } from '@/packages/public/chart'
|
import { mergeTheme, setOption } from '@/packages/public/chart'
|
||||||
import {useChartCommonData, useChartDataFetch} from '@/hooks'
|
import {useChartCommonData, useChartDataFetch} from '@/hooks'
|
||||||
import { CreateComponentType } from '@/packages/index.d'
|
import { CreateComponentType } from '@/packages/index.d'
|
||||||
@ -28,7 +28,7 @@ const props = defineProps({
|
|||||||
required: true
|
required: true
|
||||||
},
|
},
|
||||||
chartConfig: {
|
chartConfig: {
|
||||||
type: Object as PropType<CreateComponentType>,
|
type: Object as PropType<CreateComponentType & { option: typeof myOption }>,
|
||||||
required: true
|
required: true
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@ -73,9 +73,10 @@ const option = computed(() => {
|
|||||||
// }
|
// }
|
||||||
// )
|
// )
|
||||||
|
|
||||||
|
type SourceItemType = { [k: string]: any }
|
||||||
watch(() => props.chartConfig.option.dataset, (v) => {
|
watch(() => props.chartConfig.option.dataset, (v) => {
|
||||||
let { dimensions, source } = v
|
let { dimensions, source } = v
|
||||||
source.forEach(_ => {
|
source.forEach((_: SourceItemType) => {
|
||||||
if(!Object.prototype.hasOwnProperty.call(props.chartConfig.option.maxMap, _[dimensions[0]])) {
|
if(!Object.prototype.hasOwnProperty.call(props.chartConfig.option.maxMap, _[dimensions[0]])) {
|
||||||
props.chartConfig.option.maxMap[_[dimensions[0]]] = {
|
props.chartConfig.option.maxMap[_[dimensions[0]]] = {
|
||||||
max: null,
|
max: null,
|
||||||
@ -83,17 +84,17 @@ watch(() => props.chartConfig.option.dataset, (v) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
props.chartConfig.option.radar.indicator = source.map(_ => {
|
props.chartConfig.option.radar.indicator = source.map((_: SourceItemType) => {
|
||||||
return {
|
return {
|
||||||
name: _[dimensions[0]],
|
name: _[dimensions[0]],
|
||||||
max: props.chartConfig.option.maxMap[_[dimensions[0]]].max,
|
max: props.chartConfig.option.maxMap[_[dimensions[0]]].max,
|
||||||
min: props.chartConfig.option.maxMap[_[dimensions[0]]].min,
|
min: props.chartConfig.option.maxMap[_[dimensions[0]]].min,
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
props.chartConfig.option.series[0].data = dimensions.slice(1).map(k => {
|
props.chartConfig.option.series[0].data = dimensions.slice(1).map((k: string) => {
|
||||||
return {
|
return {
|
||||||
name: k,
|
name: k,
|
||||||
value: source.map(_ => _[k])
|
value: source.map((_: SourceItemType) => _[k])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
props.chartConfig.option.legend.data = dimensions.slice(1)
|
props.chartConfig.option.legend.data = dimensions.slice(1)
|
||||||
@ -102,9 +103,9 @@ watch(() => props.chartConfig.option.dataset, (v) => {
|
|||||||
deep: true
|
deep: true
|
||||||
})
|
})
|
||||||
|
|
||||||
watch(() => props.chartConfig.option.maxMap, v => {
|
watch(() => props.chartConfig.option.maxMap, () => {
|
||||||
let { dimensions, source } = props.chartConfig.option.dataset
|
let { dimensions, source } = props.chartConfig.option.dataset
|
||||||
props.chartConfig.option.radar.indicator = source.map(_ => {
|
props.chartConfig.option.radar.indicator = source.map((_: SourceItemType) => {
|
||||||
return {
|
return {
|
||||||
name: _[dimensions[0]],
|
name: _[dimensions[0]],
|
||||||
max: props.chartConfig.option.maxMap[_[dimensions[0]]].max,
|
max: props.chartConfig.option.maxMap[_[dimensions[0]]].max,
|
||||||
|
@ -6,7 +6,7 @@
|
|||||||
<div class="columns">字段</div>
|
<div class="columns">字段</div>
|
||||||
<div class="columns">标题</div>
|
<div class="columns">标题</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="rows" v-for="(row: any, i) in optionData.header.options" :key="i">
|
<div class="rows" v-for="(row, i) in optionData.header.options" :key="i">
|
||||||
<div class="columns">{{ row }}</div>
|
<div class="columns">{{ row }}</div>
|
||||||
<n-input class="columns" v-model:value="optionData.header.map[row]" size="small"/>
|
<n-input class="columns" v-model:value="optionData.header.map[row]" size="small"/>
|
||||||
</div>
|
</div>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user