mirror of
https://gitee.com/dromara/go-view.git
synced 2025-04-06 03:58:04 +08:00
Merge branch 'master-fetch-dev' into master-fetch
This commit is contained in:
commit
dd6c730021
@ -4,9 +4,30 @@
|
||||
<CollapseItem
|
||||
v-for="(item, index) in seriesList"
|
||||
:key="index"
|
||||
:name="`${item.type == 'bar' ? '柱状图' : '折线图'}`"
|
||||
:name="`系列${index + 1}`"
|
||||
:expanded="true"
|
||||
>
|
||||
<template #header>
|
||||
<n-text class="go-fs-13" depth="3">
|
||||
{{ item.type == 'bar' ? '「柱状图」' : '「折线图」' }}
|
||||
</n-text>
|
||||
</template>
|
||||
<SettingItemBox name="类型">
|
||||
<SettingItem name="宽度">
|
||||
<n-select
|
||||
:value="item.type"
|
||||
size="small"
|
||||
:options="[
|
||||
{ label: '柱状图', value: 'bar' },
|
||||
{ label: '折线图', value: 'line' }
|
||||
]"
|
||||
@update:value="(value: any) => {
|
||||
updateHandle(item, value)
|
||||
}"
|
||||
/>
|
||||
</SettingItem>
|
||||
|
||||
</SettingItemBox>
|
||||
<SettingItemBox name="图形" v-if="item.type == 'bar'">
|
||||
<SettingItem name="宽度">
|
||||
<n-input-number
|
||||
@ -34,6 +55,12 @@
|
||||
<SettingItem name="类型">
|
||||
<n-select v-model:value="item.lineStyle.type" size="small" :options="lineConf.lineStyle.type"></n-select>
|
||||
</SettingItem>
|
||||
<setting-item>
|
||||
<n-space>
|
||||
<n-switch v-model:value="item.smooth" size="small" />
|
||||
<n-text>曲线</n-text>
|
||||
</n-space>
|
||||
</setting-item>
|
||||
</SettingItemBox>
|
||||
<SettingItemBox name="实心点" v-if="item.type == 'line'">
|
||||
<SettingItem name="大小">
|
||||
@ -63,10 +90,10 @@
|
||||
<n-select
|
||||
v-model:value="item.label.position"
|
||||
:options="[
|
||||
{ label: 'top', value: 'top' },
|
||||
{ label: 'left', value: 'left' },
|
||||
{ label: 'right', value: 'right' },
|
||||
{ label: 'bottom', value: 'bottom' }
|
||||
{ label: '顶部', value: 'top' },
|
||||
{ label: '左侧', value: 'left' },
|
||||
{ label: '右侧', value: 'right' },
|
||||
{ label: '底部', value: 'bottom' }
|
||||
]"
|
||||
/>
|
||||
</setting-item>
|
||||
@ -75,10 +102,18 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { PropType, computed } from 'vue'
|
||||
import { GlobalSetting, CollapseItem, SettingItemBox, SettingItem } from '@/components/Pages/ChartItemSetting'
|
||||
import { PropType, computed, toRaw } from 'vue'
|
||||
import { merge, cloneDeep } from 'lodash';
|
||||
|
||||
import GlobalSetting from '@/components/Pages/ChartItemSetting/GlobalSetting.vue'
|
||||
import CollapseItem from '@/components/Pages/ChartItemSetting/CollapseItem.vue'
|
||||
import SettingItemBox from '@/components/Pages/ChartItemSetting/SettingItemBox.vue'
|
||||
import SettingItem from '@/components/Pages/ChartItemSetting/SettingItem.vue'
|
||||
|
||||
import { lineConf } from '@/packages/chartConfiguration/echarts'
|
||||
import { GlobalThemeJsonType } from '@/settings/chartThemes'
|
||||
import { barSeriesItem, lineSeriesItem } from './config'
|
||||
|
||||
|
||||
const props = defineProps({
|
||||
optionData: {
|
||||
@ -90,4 +125,14 @@ const props = defineProps({
|
||||
const seriesList = computed(() => {
|
||||
return props.optionData.series
|
||||
})
|
||||
|
||||
const updateHandle = (item:any, value:string) => {
|
||||
const _label = cloneDeep(toRaw(item.label))
|
||||
lineSeriesItem.label = _label
|
||||
if (value === 'line') {
|
||||
merge(item, lineSeriesItem)
|
||||
} else {
|
||||
merge(item, barSeriesItem)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
@ -12,6 +12,7 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, computed, watch, PropType, nextTick } from 'vue'
|
||||
import VChart from 'vue-echarts'
|
||||
import { isObject, cloneDeep } from 'lodash'
|
||||
import { useCanvasInitOptions } from '@/hooks/useCanvasInitOptions.hook'
|
||||
import { use } from 'echarts/core'
|
||||
import { CanvasRenderer } from 'echarts/renderers'
|
||||
@ -51,17 +52,35 @@ const option = computed(() => {
|
||||
|
||||
watch(
|
||||
() => props.chartConfig.option.dataset,
|
||||
(newData, oldData) => {
|
||||
if (newData.dimensions.length !== oldData.dimensions.length) {
|
||||
const seriesArr = []
|
||||
for (let i = 0; i < newData.dimensions.length - 1; i++) {
|
||||
seriesArr.push(barSeriesItem, lineSeriesItem)
|
||||
(newData: any, oldData) => {
|
||||
try {
|
||||
if (!isObject(newData) || !('dimensions' in newData)) return
|
||||
if (Array.isArray((newData as any)?.dimensions)) {
|
||||
const seriesArr: typeof barSeriesItem[] = []
|
||||
// 对oldData进行判断,防止传入错误数据之后对旧维度判断产生干扰
|
||||
// 此处计算的是dimensions的Y轴维度,若是dimensions.length为0或1,则默认为1,排除X轴维度干扰
|
||||
const oldDimensions =
|
||||
Array.isArray(oldData?.dimensions) && oldData.dimensions.length >= 1 ? oldData.dimensions.length : 1
|
||||
const newDimensions = (newData as any).dimensions.length >= 1 ? (newData as any).dimensions.length : 1
|
||||
const dimensionsGap = newDimensions - oldDimensions
|
||||
if (dimensionsGap < 0) {
|
||||
props.chartConfig.option.series.splice(newDimensions - 1)
|
||||
} else if (dimensionsGap > 0) {
|
||||
if (!oldData || !oldData?.dimensions || !Array.isArray(oldData?.dimensions) || !oldData?.dimensions.length) {
|
||||
props.chartConfig.option.series = []
|
||||
}
|
||||
for (let i = 0; i < dimensionsGap; i++) {
|
||||
seriesArr.push(cloneDeep(barSeriesItem))
|
||||
}
|
||||
props.chartConfig.option.series.push(...seriesArr)
|
||||
}
|
||||
replaceMergeArr.value = ['series']
|
||||
nextTick(() => {
|
||||
replaceMergeArr.value = []
|
||||
})
|
||||
}
|
||||
replaceMergeArr.value = ['series']
|
||||
props.chartConfig.option.series = seriesArr
|
||||
nextTick(() => {
|
||||
replaceMergeArr.value = []
|
||||
})
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
},
|
||||
{
|
||||
|
@ -47,10 +47,9 @@ export const option = {
|
||||
tooltip: {
|
||||
showDelay: 0,
|
||||
formatter: (params: { value: string | any[]; seriesName: string; name: string }) => {
|
||||
// console.log(params)
|
||||
return params.value.length > 1
|
||||
? `${params.seriesName}:<br />${params.value[0]} ${params.value[1]}`
|
||||
: `${params.seriesName}:<br />${params.name} ${params.value}`
|
||||
: `${params.name} ${params.value}`
|
||||
},
|
||||
axisPointer: {
|
||||
show: true,
|
||||
|
@ -24,8 +24,8 @@ export function isArray(p: any): p is [] {
|
||||
return Array.isArray(p)
|
||||
}
|
||||
|
||||
export const toNumber = (number: number | string, toFixedNumber = 2) => {
|
||||
return isString(number) ? parseFloat(parseFloat(number).toFixed(2)) : number
|
||||
export const toNumber = (number: number | string, toFixedNumber: number = 2) => {
|
||||
return isString(number) ? parseFloat(parseFloat(number).toFixed(toFixedNumber)) : number
|
||||
}
|
||||
|
||||
export const toString = (str: any) => {
|
||||
|
@ -302,7 +302,11 @@ export const useMouseHandle = () => {
|
||||
}
|
||||
})
|
||||
})
|
||||
chartEditStore.moveComponentList(prevComponentInstance)
|
||||
|
||||
const moveComponentInstance = prevComponentInstance.filter(
|
||||
item => item.attr.offsetX !== 0 && item.attr.offsetY !== 0
|
||||
)
|
||||
moveComponentInstance.length && chartEditStore.moveComponentList(moveComponentInstance)
|
||||
}
|
||||
document.removeEventListener('mousemove', mousemove)
|
||||
document.removeEventListener('mouseup', mouseup)
|
||||
|
@ -93,7 +93,7 @@ export default ({ mode }) => defineConfig({
|
||||
// minify: 'terser', // 如果需要用terser混淆,可打开这两行
|
||||
// terserOptions: terserOptions,
|
||||
rollupOptions: rollupOptions,
|
||||
brotliSize: brotliSize,
|
||||
reportCompressedSize: brotliSize,
|
||||
chunkSizeWarningLimit: chunkSizeWarningLimit
|
||||
}
|
||||
})
|
||||
|
Loading…
x
Reference in New Issue
Block a user