| | |
| | | controlFields: [ |
| | | {field: 'menu', values: ['menu']}, |
| | | {field: 'open', values: ['menu', 'menus']}, |
| | | {field: 'joint', values: ['menu', 'menus']}, |
| | | {field: 'menuType', values: ['menus']}, |
| | | {field: 'menus', values: ['menus']}, |
| | | ] |
| | |
| | | hidden: card.click !== 'menu' && card.click !== 'menus' |
| | | }, |
| | | { |
| | | type: 'radio', |
| | | field: 'joint', |
| | | label: '参数拼接', |
| | | initval: card.joint || 'true', |
| | | required: false, |
| | | options: [ |
| | | {value: 'true', label: '是'}, |
| | | {value: 'false', label: '否'}, |
| | | ], |
| | | forbid: appType === 'mob' || card.chartType !== 'bar', |
| | | hidden: card.click !== 'menu' && card.click !== 'menus' |
| | | }, |
| | | { |
| | | type: 'table', |
| | | field: 'menus', |
| | | label: '菜单组', |
| | | initval: card.menus || [], |
| | | required: true, |
| | | span: 24, |
| | | actions: ['view'], |
| | | actions: ['edit', 'del', 'add', 'move', 'view'], |
| | | forbid: appType === 'mob' || card.chartType !== 'bar', |
| | | hidden: card.click !== 'menus', |
| | | columns: [ |
| | |
| | | export function getOptionForm (card, columns) { |
| | | let appType = sessionStorage.getItem('appType') |
| | | let shapes = [] |
| | | let shape = card.shape |
| | | |
| | | if (card.chartType === 'line') { |
| | | shapes = [ |
| | | { field: 'smooth', label: 'smooth(平滑线)' }, |
| | | { field: 'line', label: 'line(直线)' }, |
| | | { field: 'dot', label: 'dot(点状线)' }, |
| | | { field: 'dash', label: 'dash(虚线)' }, |
| | | { field: 'hv', label: 'hv(水平-垂直线)' }, |
| | | { field: 'vh', label: 'vh(垂直-水平线)' }, |
| | | { field: 'hvh', label: 'hvh(水平-垂直-水平线)' }, |
| | | { field: 'vhv', label: 'vhv(垂直-水平-垂直线)' } |
| | | { field: 'smooth', label: '平滑线' }, |
| | | { field: 'line', label: '直线' }, |
| | | { field: 'dot', label: '点状线' }, |
| | | { field: 'dash', label: '虚线' }, |
| | | { field: 'hv', label: '水平-垂直线' }, |
| | | { field: 'vh', label: '垂直-水平线' }, |
| | | { field: 'hvh', label: '水平-垂直-水平线' }, |
| | | { field: 'vhv', label: '垂直-水平-垂直线' } |
| | | ] |
| | | } else if (card.chartType === 'bar') { |
| | | shapes = [ |
| | | { field: 'rect', label: 'rect(矩形)' }, |
| | | { field: 'hollow-rect', label: 'hollow-rect(空心矩形)' }, |
| | | { field: 'rect', label: '矩形' }, |
| | | { field: 'hollow-rect', label: '空心矩形' }, |
| | | // { field: 'hollow', label: 'hollow(空心矩形)' }, |
| | | // { field: 'line', label: 'line(线条)' }, |
| | | // { field: 'tick', label: 'tick(波动)' }, |
| | | // { field: 'funnel', label: 'funnel(漏斗图)' }, |
| | | { field: 'pyramid', label: 'pyramid(金字塔)' } |
| | | { field: 'pyramid', label: '金字塔' }, |
| | | { field: 'barChart', label: '条形图' }, |
| | | { field: 'roseChart', label: '玫瑰图' }, |
| | | ] |
| | | |
| | | if (card.transpose === 'true') { |
| | | shape = 'barChart' |
| | | } else if (card.coordinate === 'polar') { |
| | | shape = 'roseChart' |
| | | } |
| | | } |
| | | |
| | | if (!shape) { |
| | | shape = shapes[0].field |
| | | } |
| | | |
| | | let xfields = columns.filter(item => /^Nvarchar/ig.test(item.datatype)) |
| | |
| | | }]) |
| | | } |
| | | |
| | | let axis = [] |
| | | if (card.grid !== 'hidden') { |
| | | axis.push('grid') |
| | | } |
| | | if (card.x_line !== 'hidden') { |
| | | axis.push('x_line') |
| | | } |
| | | if (card.y_line !== 'hidden') { |
| | | axis.push('y_line') |
| | | } |
| | | if (card.tick !== 'hidden') { |
| | | axis.push('tick') |
| | | } |
| | | |
| | | let tickVals = [] |
| | | if (card.x_label !== 'hidden') { |
| | | tickVals.push('x_label') |
| | | } |
| | | if (card.y_label !== 'hidden') { |
| | | tickVals.push('y_label') |
| | | } |
| | | |
| | | let datatype = card.datatype || 'query' |
| | | if (card.enabled === 'true') { |
| | | datatype = 'custom' |
| | | } |
| | | |
| | | return [ |
| | | { |
| | | type: 'radio', |
| | | field: 'datatype', |
| | | label: '数据类型', |
| | | initval: card.datatype || 'query', |
| | | label: '图形类型', |
| | | initval: datatype, |
| | | tooltip: '统计图表适用于展示数据类型为动态值。', |
| | | required: false, |
| | | $trans: true, |
| | | options: [ |
| | | { value: 'query', label: '查询' }, |
| | | { value: 'query', label: card.chartType !== 'line' ? '柱状图' : '折线图' }, |
| | | { value: 'custom', label: '自定义图形' }, |
| | | { value: 'statistics', label: '统计' } |
| | | ], |
| | | controlFields: [ |
| | | {field: 'InfoType', values: ['statistics']}, |
| | | {field: 'InfoValue', values: ['statistics']}, |
| | | {field: 'Yaxis', values: ['query']}, |
| | | {field: 'Yaxis', values: ['query', 'custom']}, |
| | | {field: 'adjust', values: ['query', 'statistics']}, |
| | | {field: 'area', values: ['query', 'statistics']}, |
| | | {field: 'show', values: ['query', 'statistics']}, |
| | | {field: 'selectColor', values: ['query']}, |
| | | {field: 'barSize', values: card.chartType !== 'line' ? ['query', 'custom', 'statistics'] : ['custom']}, |
| | | {field: 'mutilBar', values: ['custom']}, |
| | | ] |
| | | }, { |
| | | type: 'select', |
| | |
| | | options: yfields |
| | | }, { |
| | | type: 'select', |
| | | field: 'shape', |
| | | label: '形状', |
| | | initval: shape, |
| | | required: false, |
| | | options: shapes |
| | | }, { |
| | | type: 'multiselect', |
| | | field: 'Yaxis', |
| | | label: 'Y-轴', |
| | | initval: card.Yaxis || [], |
| | | required: true, |
| | | options: yfields |
| | | }, { |
| | | type: 'select', |
| | | field: 'legend', |
| | | label: '图例位置', |
| | | initval: card.legend || 'bottom', |
| | |
| | | { field: 'hidden', label: '隐藏' } |
| | | ] |
| | | }, { |
| | | type: 'multiselect', |
| | | field: 'Yaxis', |
| | | label: 'Y-轴', |
| | | initval: card.Yaxis || [], |
| | | required: true, |
| | | options: yfields |
| | | }, { |
| | | type: 'select', |
| | | field: 'shape', |
| | | label: '形状', |
| | | initval: card.shape || (shapes[0] && shapes[0].field), |
| | | required: false, |
| | | options: shapes |
| | | }, { |
| | | type: 'radio', |
| | | field: 'tooltip', |
| | | label: '悬浮提示', |
| | |
| | | }] |
| | | }, { |
| | | type: 'radio', |
| | | field: 'point', |
| | | label: '点图', |
| | | initval: card.point || 'false', |
| | | required: false, |
| | | forbid: !['line'].includes(card.chartType), |
| | | options: [{ |
| | | value: 'true', |
| | | label: '显示' |
| | | }, { |
| | | value: 'false', |
| | | label: '隐藏' |
| | | }] |
| | | }, { |
| | | type: 'radio', |
| | | field: 'transpose', |
| | | label: '变换', |
| | | initval: card.transpose || 'false', |
| | | tooltip: '横纵坐标轴交换', |
| | | required: false, |
| | | options: [{ |
| | | value: 'true', |
| | | label: '是' |
| | | }, { |
| | | value: 'false', |
| | | label: '否' |
| | | }] |
| | | }, { |
| | | type: 'radio', |
| | | field: 'show', |
| | | label: '显示', |
| | | initval: card.show || 'value', |
| | | tooltip: '当使用自定义设置时,可在显示(值/%)处单独设置显示类型。注:自定义为空时使用此处设置。', |
| | | required: false, |
| | | options: [{ |
| | | value: 'value', |
| | |
| | | required: false, |
| | | options: labelOptions, |
| | | controlFields: [ |
| | | {field: 'labelColor', values: ['true']} |
| | | {field: 'labelUnit', values: ['true', 'top', 'middle', 'bottom']} |
| | | ] |
| | | }, { |
| | | type: 'radio', |
| | | field: 'labelColor', |
| | | label: '标注颜色', |
| | | initval: card.labelColor || 'system', |
| | | tooltip: '使用系统色时,使用色系选项设置的系统颜色,使用自定义为颜色设置中定义的图形颜色。', |
| | | required: false, |
| | | options: [{ |
| | | value: 'system', |
| | | label: '系统' |
| | | }, { |
| | | value: 'custom', |
| | | label: '自定义' |
| | | }] |
| | | // }, { |
| | | // type: 'radio', |
| | | // field: 'labelValue', |
| | | // label: '标注值', |
| | | // initval: card.labelValue || 'default', |
| | | // tooltip: '标注值的显示规则。', |
| | | // required: false, |
| | | // options: [{ |
| | | // value: 'default', |
| | | // label: '默认' |
| | | // }, { |
| | | // value: 'zero', |
| | | // label: '隐藏 0 值' |
| | | // }], |
| | | }, { |
| | | type: 'radio', |
| | | field: 'adjust', |
| | |
| | | }] |
| | | }, { |
| | | type: 'radio', |
| | | field: 'mutilBar', |
| | | label: '多柱排列', |
| | | initval: card.mutilBar || 'dodge', |
| | | required: false, |
| | | options: [{ |
| | | value: 'dodge', |
| | | label: '分组' |
| | | }, { |
| | | value: 'stack', |
| | | label: '堆叠' |
| | | }] |
| | | }, { |
| | | type: 'radio', |
| | | field: 'point', |
| | | label: '点图', |
| | | initval: card.point || 'false', |
| | | required: false, |
| | | forbid: card.chartType === 'bar', |
| | | options: [{ |
| | | value: 'true', |
| | | label: '显示' |
| | | }, { |
| | | value: 'false', |
| | | label: '隐藏' |
| | | }] |
| | | }, { |
| | | type: 'radio', |
| | | field: 'area', |
| | | label: '面积图', |
| | | initval: card.area || 'false', |
| | | required: false, |
| | | forbid: ['bar'].includes(card.chartType), |
| | | forbid: card.chartType === 'bar', |
| | | options: [{ |
| | | value: 'true', |
| | | label: '显示' |
| | |
| | | label: '不显示' |
| | | }] |
| | | }, { |
| | | type: 'radio', |
| | | field: 'repeat', |
| | | label: '重复数据', |
| | | initval: card.repeat || 'unrepeat', |
| | | type: 'checkbox', |
| | | field: 'axis', |
| | | label: '坐标轴', |
| | | initval: axis, |
| | | required: false, |
| | | options: [{ |
| | | value: 'unrepeat', |
| | | label: '去重' |
| | | value: 'grid', |
| | | label: '网格线' |
| | | }, { |
| | | value: 'average', |
| | | label: '平均' |
| | | value: 'x_line', |
| | | label: 'X轴' |
| | | }, { |
| | | value: 'cumsum', |
| | | label: '累加' |
| | | }] |
| | | value: 'y_line', |
| | | label: 'Y轴' |
| | | }, { |
| | | value: 'tick', |
| | | label: '刻度线' |
| | | }], |
| | | controlFields: [ |
| | | {field: 'lineColor', notNull: true}, |
| | | ] |
| | | }, { |
| | | type: 'radio', |
| | | field: 'coordinate', |
| | | label: '坐标', |
| | | initval: card.coordinate || 'angle', |
| | | type: 'checkbox', |
| | | field: 'tickVals', |
| | | label: '刻度值', |
| | | initval: tickVals, |
| | | required: false, |
| | | options: [{ |
| | | value: 'angle', |
| | | label: '二维坐标' |
| | | value: 'x_label', |
| | | label: 'X轴' |
| | | }, { |
| | | value: 'polar', |
| | | label: '极坐标' |
| | | }] |
| | | }, { |
| | | type: 'radio', |
| | | field: 'grid', |
| | | label: '网格线', |
| | | initval: card.grid || 'show', |
| | | required: false, |
| | | options: [{ |
| | | value: 'show', |
| | | label: '显示' |
| | | }, { |
| | | value: 'hidden', |
| | | label: '隐藏' |
| | | }] |
| | | }, { |
| | | type: 'radio', |
| | | field: 'y_line', |
| | | label: 'y轴边线', |
| | | initval: card.y_line || 'hidden', |
| | | tooltip: '图形左侧或右侧的边线。', |
| | | required: false, |
| | | options: [{ |
| | | value: 'show', |
| | | label: '显示' |
| | | }, { |
| | | value: 'hidden', |
| | | label: '隐藏' |
| | | }] |
| | | }, { |
| | | type: 'radio', |
| | | field: 'download', |
| | | label: '导出图片', |
| | | initval: card.download || 'forbid', |
| | | required: false, |
| | | forbid: appType === 'mob', |
| | | options: [{ |
| | | value: 'forbid', |
| | | label: '禁用' |
| | | }, { |
| | | value: 'enable', |
| | | label: '启用' |
| | | }] |
| | | value: 'y_label', |
| | | label: 'Y轴' |
| | | }], |
| | | controlFields: [ |
| | | {field: 'color', notNull: true}, |
| | | ] |
| | | }, { |
| | | type: 'radio', |
| | | field: 'empty', |
| | |
| | | max: 200, |
| | | precision: 0, |
| | | initval: card.barSize, |
| | | forbid: !['bar'].includes(card.chartType), |
| | | required: false |
| | | }, { |
| | | type: 'number', |
| | |
| | | max: 200, |
| | | precision: 0, |
| | | initval: card.barRadius || 0, |
| | | forbid: !['bar'].includes(card.chartType), |
| | | forbid: card.chartType === 'line', |
| | | required: false |
| | | }, { |
| | | type: 'number', |
| | |
| | | forbid: appType === 'mob', |
| | | required: false |
| | | }, { |
| | | type: 'color', |
| | | field: 'color', |
| | | label: '刻度值颜色', |
| | | initval: card.color || 'rgba(0, 0, 0, 0.65)', |
| | | tooltip: '刻度值的文字颜色。', |
| | | type: 'text', |
| | | field: 'labelUnit', |
| | | label: '标注单位', |
| | | initval: card.labelUnit ||'', |
| | | forbid: appType === 'mob', |
| | | required: false |
| | | }, { |
| | | type: 'color', |
| | | field: 'lineColor', |
| | | label: '轴线颜色', |
| | | initval: card.lineColor, |
| | | tooltip: '坐标轴线的颜色,包括x轴、y轴及网格线。', |
| | | label: '坐标轴颜色', |
| | | initval: card.lineColor || '', |
| | | tooltip: '坐标轴线的颜色,包括x轴、y轴、网格线、刻度线。', |
| | | allowClear: true, |
| | | required: false |
| | | }, { |
| | | type: 'color', |
| | | field: 'color', |
| | | label: '刻度值颜色', |
| | | initval: card.color || '', |
| | | allowClear: true, |
| | | required: false |
| | | }, { |
| | |
| | | initval: card.rotate, |
| | | forbid: appType !== 'mob', |
| | | required: false |
| | | }, { |
| | | type: 'multiselect', |
| | | field: 'interaction', |
| | | label: '交互效果', |
| | | initval: card.interaction || [], |
| | | required: false, |
| | | forbid: appType === 'mob', |
| | | options: [ |
| | | { value: 'element-active', label: '元素聚焦' }, |
| | | { value: 'element-selected', label: '元素选中(多选)' }, |
| | | { value: 'element-single-selected', label: '元素选中(单选)' }, |
| | | { value: 'active-region', label: '背景框' }, |
| | | { value: 'view-zoom', label: '视图缩放' }, |
| | | { value: 'element-highlight', label: '元素高亮' }, |
| | | { value: 'element-highlight-by-color', label: '同色元素高亮' }, |
| | | { value: 'element-highlight-by-x', label: '同X轴元素高亮' }, |
| | | { value: 'legend-filter', label: '图例过滤' }, |
| | | { value: 'legend-active', label: '图例聚焦' }, |
| | | { value: 'legend-highlight', label: '图例高亮' }, |
| | | { value: 'brush', label: '选框过滤' }, |
| | | ], |
| | | controlFields: [ |
| | | {field: 'selectColor', values: ['element-selected', 'element-single-selected']}, |
| | | ] |
| | | // }, { |
| | | // type: 'multiselect', |
| | | // field: 'interaction', |
| | | // label: '交互效果', |
| | | // initval: card.interaction || [], |
| | | // required: false, |
| | | // forbid: appType === 'mob', |
| | | // options: [ |
| | | // { value: 'element-active', label: '元素聚焦' }, |
| | | // { value: 'element-selected', label: '元素选中(多选)' }, |
| | | // { value: 'element-single-selected', label: '元素选中(单选)' }, |
| | | // { value: 'active-region', label: '背景框' }, |
| | | // { value: 'view-zoom', label: '视图缩放' }, |
| | | // { value: 'element-highlight', label: '元素高亮' }, |
| | | // { value: 'element-highlight-by-color', label: '同色元素高亮' }, |
| | | // { value: 'element-highlight-by-x', label: '同X轴元素高亮' }, |
| | | // { value: 'legend-filter', label: '图例过滤' }, |
| | | // { value: 'legend-active', label: '图例聚焦' }, |
| | | // { value: 'legend-highlight', label: '图例高亮' }, |
| | | // { value: 'brush', label: '选框过滤' }, |
| | | // ], |
| | | // controlFields: [ |
| | | // {field: 'selectColor', values: ['element-selected', 'element-single-selected']}, |
| | | // ] |
| | | }, { |
| | | type: 'color', |
| | | field: 'selectColor', |
| | | label: '选中颜色', |
| | | initval: card.selectColor || '', |
| | | tooltip: '选中柱形图的颜色,启用自定义设置时无效。', |
| | | forbid: !['bar'].includes(card.chartType), |
| | | tooltip: '选中柱形图的颜色。', |
| | | forbid: card.chartType === 'line', |
| | | allowClear: true, |
| | | required: false |
| | | } |