Skip to content

D
dataease
提交 bcbe24cf authored 作者: junjie's avatar junjie
浏览文件
操作

feat(视图): 组合图双y轴

上级 bd747ea5
全部展开 隐藏空白字符变更
内嵌 并排
正在显示 包含 382 行增加 和 31 行删除
backend/src/main/java/io/dataease/base/domain/ChartView.java
浏览文件 @ bcbe24cf
package io.dataease.base.domain;
import java.io.Serializable;
import io.swagger.annotations.ApiModelProperty;
import lombok.Data;
@Data
public class ChartView implements Serializable {
@ApiModelProperty("ID")
private String id;
@ApiModelProperty("名称")
private String name;
@ApiModelProperty("场景ID")
private String sceneId;
@ApiModelProperty("表ID")
private String tableId;
@ApiModelProperty("类型")
private String type;
@ApiModelProperty("标题")
private String title;
@ApiModelProperty("创建者")
private String createBy;
@ApiModelProperty("创建时间")
private Long createTime;
@ApiModelProperty("更新时间")
private Long updateTime;
@ApiModelProperty("样式优先级")
private String stylePriority;
private static final long serialVersionUID = 1L;
......
backend/src/main/java/io/dataease/base/domain/ChartViewWithBLOBs.java
浏览文件 @ bcbe24cf
......@@ -15,15 +15,17 @@ public class ChartViewWithBLOBs extends ChartView implements Serializable {
private String xAxis;
@ApiModelProperty("y轴")
private String yAxis;
@ApiModelProperty("副y轴")
private String yAxisExt;
@ApiModelProperty("堆叠")
private String extStack;
@ApiModelProperty("气泡")
private String extBubble;
@ApiModelProperty("客户端属性")
@ApiModelProperty("图形属性")
private String customAttr;
@ApiModelProperty("客户端样式")
@ApiModelProperty("组件样式")
private String customStyle;
@ApiModelProperty("客户端过滤条件")
@ApiModelProperty("过滤条件")
private String customFilter;
@ApiModelProperty("下钻字段")
private String drillFields;
......
backend/src/main/java/io/dataease/base/mapper/ChartViewMapper.xml
浏览文件 @ bcbe24cf
......@@ -16,6 +16,7 @@
<resultMap extends="BaseResultMap" id="ResultMapWithBLOBs" type="io.dataease.base.domain.ChartViewWithBLOBs">
<result column="x_axis" jdbcType="LONGVARCHAR" property="xAxis" />
<result column="y_axis" jdbcType="LONGVARCHAR" property="yAxis" />
<result column="y_axis_ext" jdbcType="LONGVARCHAR" property="yAxisExt" />
<result column="ext_stack" jdbcType="LONGVARCHAR" property="extStack" />
<result column="ext_bubble" jdbcType="LONGVARCHAR" property="extBubble" />
<result column="custom_attr" jdbcType="LONGVARCHAR" property="customAttr" />
......@@ -87,7 +88,7 @@
style_priority
</sql>
<sql id="Blob_Column_List">
x_axis, y_axis, ext_stack, ext_bubble, custom_attr, custom_style, custom_filter,
x_axis, y_axis, y_axis_ext, ext_stack, ext_bubble, custom_attr, custom_style, custom_filter,
drill_fields, snapshot
</sql>
<select id="selectByExampleWithBLOBs" parameterType="io.dataease.base.domain.ChartViewExample" resultMap="ResultMapWithBLOBs">
......@@ -143,16 +144,16 @@
table_id, `type`, title,
create_by, create_time, update_time,
style_priority, x_axis, y_axis,
ext_stack, ext_bubble, custom_attr,
custom_style, custom_filter, drill_fields,
snapshot)
y_axis_ext, ext_stack, ext_bubble,
custom_attr, custom_style, custom_filter,
drill_fields, snapshot)
values (#{id,jdbcType=VARCHAR}, #{name,jdbcType=VARCHAR}, #{sceneId,jdbcType=VARCHAR},
#{tableId,jdbcType=VARCHAR}, #{type,jdbcType=VARCHAR}, #{title,jdbcType=VARCHAR},
#{createBy,jdbcType=VARCHAR}, #{createTime,jdbcType=BIGINT}, #{updateTime,jdbcType=BIGINT},
#{stylePriority,jdbcType=VARCHAR}, #{xAxis,jdbcType=LONGVARCHAR}, #{yAxis,jdbcType=LONGVARCHAR},
#{extStack,jdbcType=LONGVARCHAR}, #{extBubble,jdbcType=LONGVARCHAR}, #{customAttr,jdbcType=LONGVARCHAR},
#{customStyle,jdbcType=LONGVARCHAR}, #{customFilter,jdbcType=LONGVARCHAR}, #{drillFields,jdbcType=LONGVARCHAR},
#{snapshot,jdbcType=LONGVARCHAR})
#{yAxisExt,jdbcType=LONGVARCHAR}, #{extStack,jdbcType=LONGVARCHAR}, #{extBubble,jdbcType=LONGVARCHAR},
#{customAttr,jdbcType=LONGVARCHAR}, #{customStyle,jdbcType=LONGVARCHAR}, #{customFilter,jdbcType=LONGVARCHAR},
#{drillFields,jdbcType=LONGVARCHAR}, #{snapshot,jdbcType=LONGVARCHAR})
</insert>
<insert id="insertSelective" parameterType="io.dataease.base.domain.ChartViewWithBLOBs">
insert into chart_view
......@@ -193,6 +194,9 @@
<if test="yAxis != null">
y_axis,
</if>
<if test="yAxisExt != null">
y_axis_ext,
</if>
<if test="extStack != null">
ext_stack,
</if>
......@@ -252,6 +256,9 @@
<if test="yAxis != null">
#{yAxis,jdbcType=LONGVARCHAR},
</if>
<if test="yAxisExt != null">
#{yAxisExt,jdbcType=LONGVARCHAR},
</if>
<if test="extStack != null">
#{extStack,jdbcType=LONGVARCHAR},
</if>
......@@ -320,6 +327,9 @@
<if test="record.yAxis != null">
y_axis = #{record.yAxis,jdbcType=LONGVARCHAR},
</if>
<if test="record.yAxisExt != null">
y_axis_ext = #{record.yAxisExt,jdbcType=LONGVARCHAR},
</if>
<if test="record.extStack != null">
ext_stack = #{record.extStack,jdbcType=LONGVARCHAR},
</if>
......@@ -360,6 +370,7 @@
style_priority = #{record.stylePriority,jdbcType=VARCHAR},
x_axis = #{record.xAxis,jdbcType=LONGVARCHAR},
y_axis = #{record.yAxis,jdbcType=LONGVARCHAR},
y_axis_ext = #{record.yAxisExt,jdbcType=LONGVARCHAR},
ext_stack = #{record.extStack,jdbcType=LONGVARCHAR},
ext_bubble = #{record.extBubble,jdbcType=LONGVARCHAR},
custom_attr = #{record.customAttr,jdbcType=LONGVARCHAR},
......@@ -423,6 +434,9 @@
<if test="yAxis != null">
y_axis = #{yAxis,jdbcType=LONGVARCHAR},
</if>
<if test="yAxisExt != null">
y_axis_ext = #{yAxisExt,jdbcType=LONGVARCHAR},
</if>
<if test="extStack != null">
ext_stack = #{extStack,jdbcType=LONGVARCHAR},
</if>
......@@ -460,6 +474,7 @@
style_priority = #{stylePriority,jdbcType=VARCHAR},
x_axis = #{xAxis,jdbcType=LONGVARCHAR},
y_axis = #{yAxis,jdbcType=LONGVARCHAR},
y_axis_ext = #{yAxisExt,jdbcType=LONGVARCHAR},
ext_stack = #{extStack,jdbcType=LONGVARCHAR},
ext_bubble = #{extBubble,jdbcType=LONGVARCHAR},
custom_attr = #{customAttr,jdbcType=LONGVARCHAR},
......
backend/src/main/java/io/dataease/service/chart/ChartViewService.java
浏览文件 @ bcbe24cf
......@@ -184,6 +184,11 @@ public class ChartViewService {
}.getType());
List<ChartViewFieldDTO> yAxis = new Gson().fromJson(view.getYAxis(), new TypeToken<List<ChartViewFieldDTO>>() {
}.getType());
if (StringUtils.equalsIgnoreCase(view.getType(), "chart-mix")) {
List<ChartViewFieldDTO> yAxisExt = new Gson().fromJson(view.getYAxisExt(), new TypeToken<List<ChartViewFieldDTO>>() {
}.getType());
yAxis.addAll(yAxisExt);
}
List<ChartViewFieldDTO> extStack = new Gson().fromJson(view.getExtStack(), new TypeToken<List<ChartViewFieldDTO>>() {
}.getType());
List<ChartViewFieldDTO> extBubble = new Gson().fromJson(view.getExtBubble(), new TypeToken<List<ChartViewFieldDTO>>() {
......
backend/src/main/resources/db/migration/V26__de1.3.sql
浏览文件 @ bcbe24cf
......@@ -51,3 +51,5 @@ CREATE TABLE `panel_pdf_template` (
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;
ALTER TABLE `chart_view` ADD COLUMN `y_axis_ext` LONGTEXT COMMENT '副轴' AFTER `y_axis`;
UPDATE `chart_view` SET `y_axis_ext` = '[]';
backend/src/main/resources/generatorConfig.xml
浏览文件 @ bcbe24cf
......@@ -64,7 +64,7 @@
<!--要生成的数据库表 -->
<table tableName="panel_pdf_template"/>
<table tableName="chart_view"/>
<!-- <table tableName="sys_dict_item"/>-->
<!-- <table tableName="dataset_table_field"/>-->
<!-- <table tableName="v_chart">-->
......
frontend/src/lang/en.js
浏览文件 @ bcbe24cf
......@@ -856,7 +856,11 @@ export default {
axis_value_max: 'Max',
axis_value_split: 'Split',
axis_auto: 'Auto',
table_info_switch: 'Switch detail table will clear dimensions'
table_info_switch: 'Switch detail table will clear dimensions',
drag_block_value_axis_main: 'Main Axis Value',
drag_block_value_axis_ext: 'Ext Axis Value',
yAxis_main: 'Main Axis',
yAxis_ext: 'Ext Axis'
},
dataset: {
sheet_warn: 'There are multiple sheet pages, and the first one is extracted by default',
......
frontend/src/lang/tw.js
浏览文件 @ bcbe24cf
......@@ -855,7 +855,11 @@ export default {
axis_value_max: '最大值',
axis_value_split: '間隔',
axis_auto: '自動',
table_info_switch: '明細表切換將清空維度'
table_info_switch: '明細表切換將清空維度',
drag_block_value_axis_main: '主軸值',
drag_block_value_axis_ext: '副軸值',
yAxis_main: '主軸',
yAxis_ext: '副軸'
},
dataset: {
sheet_warn: '有多個sheet頁面，默認抽取第一個',
......
frontend/src/lang/zh.js
浏览文件 @ bcbe24cf
......@@ -855,7 +855,11 @@ export default {
axis_value_max: '最大值',
axis_value_split: '间隔',
axis_auto: '自动',
table_info_switch: '明细表切换将清空维度'
table_info_switch: '明细表切换将清空维度',
drag_block_value_axis_main: '主轴值',
drag_block_value_axis_ext: '副轴值',
yAxis_main: '主轴',
yAxis_ext: '副轴'
},
dataset: {
sheet_warn: '有多个 Sheet 页，默认抽取第一个',
......
frontend/src/views/chart/chart/chart.js
浏览文件 @ bcbe24cf
......@@ -145,6 +145,36 @@ export const DEFAULT_YAXIS_STYLE = {
split: null
}
}
export const DEFAULT_YAXIS_EXT_STYLE = {
show: true,
position: 'right',
name: '',
nameTextStyle: {
color: '#333333',
fontSize: 12
},
axisLabel: {
show: true,
color: '#333333',
fontSize: '12',
rotate: 0,
formatter: '{value}'
},
splitLine: {
show: true,
lineStyle: {
color: '#cccccc',
width: 1,
style: 'solid'
}
},
axisValue: {
auto: true,
min: null,
max: null,
split: null
}
}
export const DEFAULT_BACKGROUND_COLOR = {
color: '#ffffff',
alpha: 0
......@@ -586,6 +616,7 @@ export const BASE_CHART_STRING = {
legend: DEFAULT_LEGEND_STYLE,
xAxis: DEFAULT_XAXIS_STYLE,
yAxis: DEFAULT_YAXIS_STYLE,
yAxisExt: DEFAULT_YAXIS_EXT_STYLE,
background: DEFAULT_BACKGROUND_COLOR
}),
customFilter: '[]'
......@@ -609,6 +640,7 @@ export const BASE_CHART = {
legend: DEFAULT_LEGEND_STYLE,
xAxis: DEFAULT_XAXIS_STYLE,
yAxis: DEFAULT_YAXIS_STYLE,
yAxisExt: DEFAULT_YAXIS_EXT_STYLE,
background: DEFAULT_BACKGROUND_COLOR
},
customFilter: []
......@@ -771,9 +803,14 @@ export const BASE_MIX = {
xAxis: {
data: []
},
yAxis: {
type: 'value'
},
yAxis: [
{
type: 'value'
},
{
type: 'value'
}
],
series: [],
dataZoom: [
{
......
frontend/src/views/chart/chart/common/common.js
浏览文件 @ bcbe24cf
......@@ -78,7 +78,7 @@ export function componentStyle(chart_option, chart) {
}
}
}
if (customStyle.yAxis && (chart.type.includes('bar') || chart.type.includes('line') || chart.type.includes('scatter') || chart.type === 'chart-mix')) {
if (customStyle.yAxis && (chart.type.includes('bar') || chart.type.includes('line') || chart.type.includes('scatter'))) {
chart_option.yAxis.show = customStyle.yAxis.show
chart_option.yAxis.position = customStyle.yAxis.position
chart_option.yAxis.name = customStyle.yAxis.name
......@@ -105,6 +105,60 @@ export function componentStyle(chart_option, chart) {
}
}
}
if (customStyle.yAxis && chart.type === 'chart-mix') {
chart_option.yAxis[0].show = customStyle.yAxis.show
chart_option.yAxis[0].position = customStyle.yAxis.position
chart_option.yAxis[0].name = customStyle.yAxis.name
chart_option.yAxis[0].axisLabel = customStyle.yAxis.axisLabel
chart_option.yAxis[0].splitLine = customStyle.yAxis.splitLine
chart_option.yAxis[0].nameTextStyle = customStyle.yAxis.nameTextStyle
chart_option.yAxis[0].axisLabel.showMaxLabel = true
chart_option.yAxis[0].axisLabel.showMinLabel = true
if (!customStyle.yAxis.show) {
chart_option.yAxis[0].axisLabel.show = false
}
// 轴值设置
delete chart_option.yAxis[0].min
delete chart_option.yAxis[0].max
delete chart_option.yAxis[0].split
if (!chart.type.includes('horizontal')) {
if (customStyle.yAxis.axisValue && !customStyle.yAxis.axisValue.auto) {
customStyle.yAxis.axisValue.min && (chart_option.yAxis[0].min = parseFloat(customStyle.yAxis.axisValue.min))
customStyle.yAxis.axisValue.max && (chart_option.yAxis[0].max = parseFloat(customStyle.yAxis.axisValue.max))
customStyle.yAxis.axisValue.split && (chart_option.yAxis[0].interval = parseFloat(customStyle.yAxis.axisValue.split))
}
}
// axis ext
chart_option.yAxis[1].show = customStyle.yAxisExt.show
chart_option.yAxis[1].position = customStyle.yAxisExt.position
chart_option.yAxis[1].name = customStyle.yAxisExt.name
chart_option.yAxis[1].axisLabel = customStyle.yAxisExt.axisLabel
chart_option.yAxis[1].splitLine = customStyle.yAxisExt.splitLine
chart_option.yAxis[1].nameTextStyle = customStyle.yAxisExt.nameTextStyle
chart_option.yAxis[1].axisLabel.showMaxLabel = true
chart_option.yAxis[1].axisLabel.showMinLabel = true
if (!customStyle.yAxisExt.show) {
chart_option.yAxis[1].axisLabel.show = false
}
// 轴值设置
delete chart_option.yAxis[1].min
delete chart_option.yAxis[1].max
delete chart_option.yAxis[1].split
if (!chart.type.includes('horizontal')) {
if (customStyle.yAxisExt.axisValue && !customStyle.yAxisExt.axisValue.auto) {
customStyle.yAxisExt.axisValue.min && (chart_option.yAxis[1].min = parseFloat(customStyle.yAxisExt.axisValue.min))
customStyle.yAxisExt.axisValue.max && (chart_option.yAxis[1].max = parseFloat(customStyle.yAxisExt.axisValue.max))
customStyle.yAxisExt.axisValue.split && (chart_option.yAxis[1].interval = parseFloat(customStyle.yAxisExt.axisValue.split))
}
}
}
if (customStyle.split && chart.type.includes('radar')) {
chart_option.radar.name = customStyle.split.name
chart_option.radar.splitNumber = customStyle.split.splitNumber
......
frontend/src/views/chart/chart/mix/mix.js
浏览文件 @ bcbe24cf
......@@ -4,6 +4,7 @@ import { componentStyle } from '../common/common'
export function baseMixOption(chart_option, chart) {
// 处理shape attr
let customAttr = {}
const yAxis = JSON.parse(chart.yaxis)
if (chart.customAttr) {
customAttr = JSON.parse(chart.customAttr)
if (customAttr.color) {
......@@ -68,6 +69,7 @@ export function baseMixOption(chart_option, chart) {
y.label = customAttr.label
}
chart_option.legend.data.push(y.name)
i >= yAxis.length ? (y.yAxisIndex = 1) : (y.yAxisIndex = 0)
chart_option.series.push(y)
}
}
......
frontend/src/views/chart/components/component-style/YAxisExtSelector.vue 0 → 100644
浏览文件 @ bcbe24cf
<template>
<div style="width: 100%">
<el-col>
<el-form ref="axisForm" :model="axisForm" label-width="80px" size="mini" :disabled="!hasDataPermission('manage',param.privileges)">
<el-form-item :label="$t('chart.show')" class="form-item">
<el-checkbox v-model="axisForm.show" @change="changeYAxisStyle">{{ $t('chart.show') }}</el-checkbox>
</el-form-item>
<div v-show="axisForm.show">
<el-form-item :label="$t('chart.position')" class="form-item">
<el-radio-group v-model="axisForm.position" size="mini" @change="changeYAxisStyle">
<el-radio-button label="left">{{ $t('chart.text_pos_left') }}</el-radio-button>
<el-radio-button label="right">{{ $t('chart.text_pos_right') }}</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item :label="$t('chart.name')" class="form-item">
<el-input v-model="axisForm.name" size="mini" @blur="changeYAxisStyle" />
</el-form-item>
<el-form-item :label="$t('chart.axis_name_color')" class="form-item">
<el-color-picker v-model="axisForm.nameTextStyle.color" class="color-picker-style" @change="changeYAxisStyle" />
</el-form-item>
<el-form-item :label="$t('chart.axis_name_fontsize')" class="form-item">
<el-select v-model="axisForm.nameTextStyle.fontSize" :placeholder="$t('chart.axis_name_fontsize')" @change="changeYAxisStyle">
<el-option v-for="option in fontSize" :key="option.value" :label="option.name" :value="option.value" />
</el-select>
</el-form-item>
<span v-show="chart.type && !chart.type.includes('horizontal')">
<el-divider />
<el-form-item class="form-item">
<span slot="label">
<span class="span-box">
<span>{{ $t('chart.axis_value') }}</span>
<el-tooltip class="item" effect="dark" placement="bottom">
<div slot="content">
最小值、最大值、间隔均为数值类型；若不填，则该项视为自动。
<br>
请确保填写数值能正确计算，否则将无法正常显示轴值。
</div>
<i class="el-icon-info" style="cursor: pointer;" />
</el-tooltip>
</span>
</span>
<el-checkbox v-model="axisForm.axisValue.auto" @change="changeYAxisStyle">{{ $t('chart.axis_auto') }}</el-checkbox>
</el-form-item>
<span v-show="!axisForm.axisValue.auto">
<el-form-item :label="$t('chart.axis_value_min')" class="form-item">
<el-input v-model="axisForm.axisValue.min" @blur="changeYAxisStyle" />
</el-form-item>
<el-form-item :label="$t('chart.axis_value_max')" class="form-item">
<el-input v-model="axisForm.axisValue.max" @blur="changeYAxisStyle" />
</el-form-item>
<el-form-item :label="$t('chart.axis_value_split')" class="form-item">
<el-input v-model="axisForm.axisValue.split" @blur="changeYAxisStyle" />
</el-form-item>
</span>
</span>
<el-divider />
<el-form-item :label="$t('chart.axis_show')" class="form-item">
<el-checkbox v-model="axisForm.splitLine.show" @change="changeYAxisStyle">{{ $t('chart.axis_show') }}</el-checkbox>
</el-form-item>
<span v-show="axisForm.splitLine.show">
<el-form-item :label="$t('chart.axis_color')" class="form-item">
<el-color-picker v-model="axisForm.splitLine.lineStyle.color" class="el-color-picker" @change="changeYAxisStyle" />
</el-form-item>
<el-form-item :label="$t('chart.axis_width')" class="form-item form-item-slider">
<el-slider v-model="axisForm.splitLine.lineStyle.width" :min="1" :max="10" show-input :show-input-controls="false" input-size="mini" @change="changeYAxisStyle" />
</el-form-item>
<el-form-item :label="$t('chart.axis_type')" class="form-item">
<el-radio-group v-model="axisForm.splitLine.lineStyle.type" size="mini" @change="changeYAxisStyle">
<el-radio-button label="solid">{{ $t('chart.axis_type_solid') }}</el-radio-button>
<el-radio-button label="dashed">{{ $t('chart.axis_type_dashed') }}</el-radio-button>
<el-radio-button label="dotted">{{ $t('chart.axis_type_dotted') }}</el-radio-button>
</el-radio-group>
</el-form-item>
</span>
<el-divider />
<el-form-item :label="$t('chart.axis_label_show')" class="form-item">
<el-checkbox v-model="axisForm.axisLabel.show" @change="changeYAxisStyle">{{ $t('chart.axis_label_show') }}</el-checkbox>
</el-form-item>
<span v-show="axisForm.axisLabel.show">
<el-form-item :label="$t('chart.axis_label_color')" class="form-item">
<el-color-picker v-model="axisForm.axisLabel.color" class="el-color-picker" @change="changeYAxisStyle" />
</el-form-item>
<el-form-item :label="$t('chart.axis_label_rotate')" class="form-item form-item-slider">
<el-slider v-model="axisForm.axisLabel.rotate" show-input :show-input-controls="false" :min="-90" :max="90" input-size="mini" @change="changeYAxisStyle" />
</el-form-item>
<el-form-item :label="$t('chart.axis_label_fontsize')" class="form-item">
<el-select v-model="axisForm.axisLabel.fontSize" :placeholder="$t('chart.axis_label_fontsize')" @change="changeYAxisStyle">
<el-option v-for="option in fontSize" :key="option.value" :label="option.name" :value="option.value" />
</el-select>
</el-form-item>
</span>
<el-divider />
<el-form-item :label="$t('chart.content_formatter')" class="form-item">
<el-input v-model="axisForm.axisLabel.formatter" type="textarea" :autosize="{ minRows: 4, maxRows: 4}" @blur="changeYAxisStyle" />
</el-form-item>
</div>
</el-form>
</el-col>
</div>
</template>
<script>
import { DEFAULT_YAXIS_EXT_STYLE } from '../../chart/chart'
export default {
name: 'YAxisExtSelector',
props: {
param: {
type: Object,
required: true
},
chart: {
type: Object,
required: true
}
},
data() {
return {
axisForm: JSON.parse(JSON.stringify(DEFAULT_YAXIS_EXT_STYLE)),
isSetting: false,
fontSize: []
}
},
watch: {
'chart': {
handler: function() {
this.initData()
}
}
},
mounted() {
this.init()
this.initData()
},
methods: {
initData() {
const chart = JSON.parse(JSON.stringify(this.chart))
if (chart.customStyle) {
// if (!chart.customStyle.yAxisExt) {
// chart.customStyle.yAxisExt = JSON.parse(JSON.stringify(DEFAULT_YAXIS_EXT_STYLE))
// }
let customStyle = null
if (Object.prototype.toString.call(chart.customStyle) === '[object Object]') {
customStyle = JSON.parse(JSON.stringify(chart.customStyle))
} else {
customStyle = JSON.parse(chart.customStyle)
}
if (customStyle.yAxisExt) {
this.axisForm = customStyle.yAxisExt
if (!this.axisForm.splitLine) {
this.axisForm.splitLine = JSON.parse(JSON.stringify(DEFAULT_YAXIS_EXT_STYLE.splitLine))
}
if (!this.axisForm.nameTextStyle) {
this.axisForm.nameTextStyle = JSON.parse(JSON.stringify(DEFAULT_YAXIS_EXT_STYLE.nameTextStyle))
}
if (!this.axisForm.axisValue) {
this.axisForm.axisValue = JSON.parse(JSON.stringify(DEFAULT_YAXIS_EXT_STYLE.axisValue))
}
}
}
},
init() {
const arr = []
for (let i = 6; i <= 40; i = i + 2) {
arr.push({
name: i + '',
value: i + ''
})
}
this.fontSize = arr
},
changeYAxisStyle() {
if (!this.axisForm.show) {
this.isSetting = false
}
this.$emit('onChangeYAxisForm', this.axisForm)
}
}
}
</script>
<style scoped>
.el-divider--horizontal {
margin: 10px 0
}
.shape-item{
padding: 6px;
border: none;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
}
.form-item-slider>>>.el-form-item__label{
font-size: 12px;
line-height: 38px;
}
.form-item>>>.el-form-item__label{
font-size: 12px;
}
.el-select-dropdown__item{
padding: 0 20px;
}
span{
font-size: 12px
}
.el-form-item{
margin-bottom: 6px;
}
.switch-style{
position: absolute;
right: 10px;
margin-top: -4px;
}
.color-picker-style{
cursor: pointer;
z-index: 1003;
}
</style>
frontend/src/views/chart/components/drag-item/QuotaItem.vue
浏览文件 @ bcbe24cf
......@@ -220,10 +220,12 @@ export default {
},
removeItem() {
this.item.index = this.index
this.item.removeType = 'quota'
this.$emit('onQuotaItemRemove', this.item)
},
editFilter() {
this.item.index = this.index
this.item.filterType = 'quota'
this.$emit('editItemFilter', this.item)
}
}
......
frontend/src/views/chart/components/table/TableNormal.vue
浏览文件 @ bcbe24cf
......@@ -17,7 +17,7 @@
>
<ux-table-column
v-for="field in fields"
:key="field.dataeaseName"
:key="Math.random()"
:field="field.dataeaseName"
:resizable="true"
sortable
......
frontend/src/views/chart/group/Group.vue
浏览文件 @ bcbe24cf
......@@ -327,6 +327,7 @@ import {
DEFAULT_TOOLTIP,
DEFAULT_XAXIS_STYLE,
DEFAULT_YAXIS_STYLE,
DEFAULT_YAXIS_EXT_STYLE,
DEFAULT_BACKGROUND_COLOR,
DEFAULT_SPLIT
} from '../chart/chart'
......@@ -739,11 +740,13 @@ export default {
legend: DEFAULT_LEGEND_STYLE,
xAxis: DEFAULT_XAXIS_STYLE,
yAxis: DEFAULT_YAXIS_STYLE,
yAxisExt: DEFAULT_YAXIS_EXT_STYLE,
background: DEFAULT_BACKGROUND_COLOR,
split: DEFAULT_SPLIT
})
view.xaxis = JSON.stringify([])
view.yaxis = JSON.stringify([])
view.yaxisExt = JSON.stringify([])
view.extStack = JSON.stringify([])
view.customFilter = JSON.stringify([])
view.drillFields = JSON.stringify([])
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论