|
|
|
@ -106,6 +106,7 @@ const getOption = (e) => {
|
|
|
|
yAxisSplitLineShow: false,
|
|
|
|
yAxisSplitLineShow: false,
|
|
|
|
yAxisSplitLineColor: '#DCE2E8',
|
|
|
|
yAxisSplitLineColor: '#DCE2E8',
|
|
|
|
yAxisSplitLineType: 'solid',
|
|
|
|
yAxisSplitLineType: 'solid',
|
|
|
|
|
|
|
|
seriesColor: '#9E87FF',
|
|
|
|
tooltip: true,
|
|
|
|
tooltip: true,
|
|
|
|
legend: true
|
|
|
|
legend: true
|
|
|
|
};
|
|
|
|
};
|
|
|
|
@ -156,6 +157,7 @@ const getOption = (e) => {
|
|
|
|
yAxisSplitLineType: 'solid',
|
|
|
|
yAxisSplitLineType: 'solid',
|
|
|
|
tooltip: true,
|
|
|
|
tooltip: true,
|
|
|
|
legend: true,
|
|
|
|
legend: true,
|
|
|
|
|
|
|
|
seriesColor: '#9E87FF',
|
|
|
|
backgroundColor: 'rgba(180, 180, 180, 0.2)'
|
|
|
|
backgroundColor: 'rgba(180, 180, 180, 0.2)'
|
|
|
|
};
|
|
|
|
};
|
|
|
|
} else if (e === 'curve' || e === 'multiCurves') {
|
|
|
|
} else if (e === 'curve' || e === 'multiCurves') {
|
|
|
|
@ -206,6 +208,7 @@ const getOption = (e) => {
|
|
|
|
lineSymbolShow: false,
|
|
|
|
lineSymbolShow: false,
|
|
|
|
lineSymbolSize: 5,
|
|
|
|
lineSymbolSize: 5,
|
|
|
|
lineSymbolType: 'circle',
|
|
|
|
lineSymbolType: 'circle',
|
|
|
|
|
|
|
|
seriesColor: '#9E87FF',
|
|
|
|
tooltip: true,
|
|
|
|
tooltip: true,
|
|
|
|
legend: true
|
|
|
|
legend: true
|
|
|
|
};
|
|
|
|
};
|
|
|
|
@ -257,14 +260,29 @@ const getOption = (e) => {
|
|
|
|
lineSymbolSize: 5,
|
|
|
|
lineSymbolSize: 5,
|
|
|
|
lineSymbolType: 'circle',
|
|
|
|
lineSymbolType: 'circle',
|
|
|
|
tooltip: true,
|
|
|
|
tooltip: true,
|
|
|
|
legend: true
|
|
|
|
legend: true,
|
|
|
|
|
|
|
|
seriesColor: '#9E87FF'
|
|
|
|
};
|
|
|
|
};
|
|
|
|
} else if (e === 'radar') {
|
|
|
|
} else if (e === 'radar') {
|
|
|
|
return {
|
|
|
|
return {
|
|
|
|
title: '', yNames: [], gridTop: 30, gridLeft: 5, gridBottom: 10, gridRight: 10, tooltip: true, legend: true
|
|
|
|
title: '',
|
|
|
|
|
|
|
|
seriesColor: '#9E87FF',
|
|
|
|
|
|
|
|
yNames: [],
|
|
|
|
|
|
|
|
gridTop: 30,
|
|
|
|
|
|
|
|
gridLeft: 5,
|
|
|
|
|
|
|
|
gridBottom: 10,
|
|
|
|
|
|
|
|
gridRight: 10,
|
|
|
|
|
|
|
|
tooltip: true,
|
|
|
|
|
|
|
|
legend: true
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
} else if (e === 'pie' || e === 'nightingaleRoseDiagram') {
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
|
|
|
title: '', yNames: [], tooltip: true, legend: true, label: true, pieCenter: 50
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
} else if (e === 'annular') {
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
|
|
|
title: '', yNames: [], tooltip: true, legend: true, label: true, pieCenter: 50, pieRadius: [30, 70]
|
|
|
|
};
|
|
|
|
};
|
|
|
|
} else if (e === 'pie' || e === 'nightingaleRoseDiagram' || e === 'annular') {
|
|
|
|
|
|
|
|
return { title: '', yNames: [], tooltip: true, legend: true, label: true };
|
|
|
|
|
|
|
|
} else if (e === 'dashboard') {
|
|
|
|
} else if (e === 'dashboard') {
|
|
|
|
return { title: '', yNames: [], tooltip: true, legend: true, label: true };
|
|
|
|
return { title: '', yNames: [], tooltip: true, legend: true, label: true };
|
|
|
|
} else if (e === 'customBoard') {
|
|
|
|
} else if (e === 'customBoard') {
|
|
|
|
@ -272,7 +290,7 @@ const getOption = (e) => {
|
|
|
|
} else if (e === 'data') {
|
|
|
|
} else if (e === 'data') {
|
|
|
|
return { timeout: 5000 };
|
|
|
|
return { timeout: 5000 };
|
|
|
|
} else if (e === 'staticData') {
|
|
|
|
} else if (e === 'staticData') {
|
|
|
|
return { defaultInputArea: '', field: 'input' };
|
|
|
|
return { defaultInputArea: '', field: 'input', defaultDataType: '' };
|
|
|
|
} else if (e === 'customData') {
|
|
|
|
} else if (e === 'customData') {
|
|
|
|
return { timeout: 5000 };
|
|
|
|
return { timeout: 5000 };
|
|
|
|
} else if (e === 'map') {
|
|
|
|
} else if (e === 'map') {
|
|
|
|
@ -295,12 +313,12 @@ const getOption = (e) => {
|
|
|
|
return {
|
|
|
|
return {
|
|
|
|
tableOptions: [],
|
|
|
|
tableOptions: [],
|
|
|
|
tableClassOption: {},
|
|
|
|
tableClassOption: {},
|
|
|
|
thHeight: '20px',
|
|
|
|
thHeight: '32px',
|
|
|
|
tdHeight: '20px',
|
|
|
|
tdHeight: '28px',
|
|
|
|
thColor: '#fff',
|
|
|
|
thColor: '#D6F4FF',
|
|
|
|
tdColor: ['#fff'],
|
|
|
|
tdColor: ['#D6F4FF', '#D6F4FF', '#D6F4FF', '#D6F4FF'],
|
|
|
|
thBgColor: '#fff',
|
|
|
|
thBgColor: '#1E90FF',
|
|
|
|
tdBgColor: ['#000']
|
|
|
|
tdBgColor: ['#0D2B3D', '#103B4C', '#14576B', '#187E99']
|
|
|
|
};
|
|
|
|
};
|
|
|
|
} else if (e === 'carousel') {
|
|
|
|
} else if (e === 'carousel') {
|
|
|
|
return { swiperOptions: {}, imageFit: 'contain', carouselImages: [] };
|
|
|
|
return { swiperOptions: {}, imageFit: 'contain', carouselImages: [] };
|
|
|
|
@ -337,7 +355,35 @@ const getNodeSize = (e) => {
|
|
|
|
return { width: 100, height: 100 };
|
|
|
|
return { width: 100, height: 100 };
|
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
const nameEnum = {
|
|
|
|
|
|
|
|
line: '折线',
|
|
|
|
|
|
|
|
multiLines: '多折线',
|
|
|
|
|
|
|
|
curve: '曲线',
|
|
|
|
|
|
|
|
multiCurves: '多曲线',
|
|
|
|
|
|
|
|
lineBar: '双轴图',
|
|
|
|
|
|
|
|
bar: '柱状图',
|
|
|
|
|
|
|
|
backgroundBar: '背景柱状图',
|
|
|
|
|
|
|
|
multiBars: '多柱状图',
|
|
|
|
|
|
|
|
pie: '饼图',
|
|
|
|
|
|
|
|
annular: '中空饼图',
|
|
|
|
|
|
|
|
dashboard: '仪表盘',
|
|
|
|
|
|
|
|
radar: '雷达图',
|
|
|
|
|
|
|
|
nightingaleRoseDiagram: '南丁格尔玫瑰图',
|
|
|
|
|
|
|
|
carousel: '轮播图',
|
|
|
|
|
|
|
|
map: '映射',
|
|
|
|
|
|
|
|
staticData: '静态数据',
|
|
|
|
|
|
|
|
customData: '自定义数据',
|
|
|
|
|
|
|
|
text: '文字',
|
|
|
|
|
|
|
|
inputNode: '输入框',
|
|
|
|
|
|
|
|
time: '时间',
|
|
|
|
|
|
|
|
img: '图片',
|
|
|
|
|
|
|
|
icon: '图标',
|
|
|
|
|
|
|
|
video: '视频',
|
|
|
|
|
|
|
|
timeline: '时间线',
|
|
|
|
|
|
|
|
digitalFlop: '数字翻牌器',
|
|
|
|
|
|
|
|
scrollTable: '滚动表格',
|
|
|
|
|
|
|
|
background: '背景'
|
|
|
|
|
|
|
|
};
|
|
|
|
const tool = () => {
|
|
|
|
const tool = () => {
|
|
|
|
const nodeType = ref('');
|
|
|
|
const nodeType = ref('');
|
|
|
|
const customData = ref({ script: '' });
|
|
|
|
const customData = ref({ script: '' });
|
|
|
|
@ -366,7 +412,8 @@ const tool = () => {
|
|
|
|
const nodeId = getId(nodeType.value);
|
|
|
|
const nodeId = getId(nodeType.value);
|
|
|
|
const newNode = {
|
|
|
|
const newNode = {
|
|
|
|
id: nodeId,
|
|
|
|
id: nodeId,
|
|
|
|
name: nodeType.value,
|
|
|
|
name: nameEnum[nodeType.value],
|
|
|
|
|
|
|
|
draggable: true,
|
|
|
|
type: nodeType.value,
|
|
|
|
type: nodeType.value,
|
|
|
|
dimensions,
|
|
|
|
dimensions,
|
|
|
|
position,
|
|
|
|
position,
|
|
|
|
|