forked from github/dataease
Merge branch 'dev' into pr@dev@feat_percentage_horizonal_bar
This commit is contained in:
wisonic-s
commit
b6979534a7
@ -5,7 +5,7 @@
|
||||
<a href="https://app.codacy.com/gh/dataease/dataease?utm_source=github.com&utm_medium=referral&utm_content=dataease/dataease&utm_campaign=Badge_Grade_Dashboard"><img src="https://app.codacy.com/project/badge/Grade/da67574fd82b473992781d1386b937ef" alt="Codacy"></a>
|
||||
<a href="https://github.com/dataease/dataease/releases/latest"><img src="https://img.shields.io/github/v/release/dataease/dataease" alt="Latest release"></a>
|
||||
<a href="https://github.com/dataease/dataease"><img src="https://img.shields.io/github/stars/dataease/dataease?color=%231890FF&style=flat-square" alt="Stars"></a>
|
||||
<a href="https://github.com/dataease/dataease/releases/latest"><img src="https://img.shields.io/github/downloads/dataease/dataease/total" alt="Downloads"></a>
|
||||
|
||||
</p>
|
||||
<hr/>
|
||||
|
||||
|
||||
@ -1694,15 +1694,34 @@ public class ChartViewService {
|
||||
continue;
|
||||
}
|
||||
|
||||
Boolean isEndParam = false;
|
||||
for (String parameter : chartExtFilterRequest.getParameters()) {
|
||||
if (parameter.contains("|DE|")) {
|
||||
if (!parameter.split("\\|DE\\|")[0].equals(table.getId())) {
|
||||
String[] parameterArray = parameter.split("\\|DE\\|");
|
||||
if (!parameterArray[0].equals(table.getId())) {
|
||||
continue;
|
||||
}
|
||||
List<SqlVariableDetails> parameters = sqlVariables.stream().filter(item -> item.getVariableName().equalsIgnoreCase(parameter.split("\\|DE\\|")[1])).collect(Collectors.toList());
|
||||
String paramName = null;
|
||||
if (parameterArray.length > 1) {
|
||||
paramName = parameterArray[1];
|
||||
if (paramName.contains("_START_END_SPLIT")) {
|
||||
String[] paramNameArray = paramName.split("_START_END_SPLIT");
|
||||
paramName = paramNameArray[0];
|
||||
isEndParam = true;
|
||||
}
|
||||
} else {
|
||||
continue;
|
||||
}
|
||||
final String finalParamName = paramName;
|
||||
List<SqlVariableDetails> parameters = sqlVariables.stream().filter(item -> item.getVariableName().equalsIgnoreCase(finalParamName)).collect(Collectors.toList());
|
||||
if (CollectionUtils.isNotEmpty(parameters)) {
|
||||
String filter = qp.transFilter(chartExtFilterRequest, parameters.get(0));
|
||||
sql = sql.replace("${" + parameter.split("\\|DE\\|")[1] + "}", filter);
|
||||
String filter = null;
|
||||
if (isEndParam) {
|
||||
filter = transEndParamSql(chartExtFilterRequest, parameters.get(0));
|
||||
} else {
|
||||
filter = qp.transFilter(chartExtFilterRequest, parameters.get(0));
|
||||
}
|
||||
sql = sql.replace("${" + finalParamName + "}", filter);
|
||||
}
|
||||
} else {
|
||||
List<SqlVariableDetails> parameters = sqlVariables.stream().filter(item -> item.getVariableName().equalsIgnoreCase(parameter)).collect(Collectors.toList());
|
||||
@ -1718,6 +1737,11 @@ public class ChartViewService {
|
||||
return sql;
|
||||
}
|
||||
|
||||
public String transEndParamSql(ChartExtFilterRequest chartExtFilterRequest, SqlVariableDetails sqlVariableDetails) {
|
||||
SimpleDateFormat simpleDateFormat = new SimpleDateFormat(sqlVariableDetails.getType().size() > 1 ? sqlVariableDetails.getType().get(1) : "YYYY");
|
||||
return simpleDateFormat.format(new Date(Long.parseLong(chartExtFilterRequest.getValue().get(1))));
|
||||
}
|
||||
|
||||
private String getDrillSort(List<ChartViewFieldDTO> xAxis, ChartViewFieldDTO field) {
|
||||
String res = "";
|
||||
for (ChartViewFieldDTO f : xAxis) {
|
||||
|
||||
@ -199,7 +199,7 @@ export default {
|
||||
return style
|
||||
},
|
||||
componentActiveFlag() {
|
||||
return !this.mobileLayoutStatus && ((this.curComponent && this.config === this.curComponent && !this.previewVisible && !this.showPosition.includes('email-task')) || this.showPosition.includes('multiplexing'))
|
||||
return !this.mobileLayoutStatus && ((this.curComponent && this.config.id === this.curComponent.id && !this.previewVisible && !this.showPosition.includes('email-task')) || this.showPosition.includes('multiplexing'))
|
||||
},
|
||||
scale() {
|
||||
return Math.min(this.previewCanvasScale.scalePointWidth, this.previewCanvasScale.scalePointHeight)
|
||||
@ -274,7 +274,7 @@ export default {
|
||||
} else {
|
||||
return {
|
||||
...
|
||||
getStyle(style, ['top', 'left', 'width', 'height', 'rotate']),
|
||||
getStyle(style, ['top', 'left', 'width', 'height', 'rotate']),
|
||||
position: 'relative'
|
||||
}
|
||||
}
|
||||
|
||||
@ -12,8 +12,8 @@ export default {
|
||||
copyData: null, // 复制粘贴剪切
|
||||
isCut: false,
|
||||
baseStyle: {
|
||||
width: 300,
|
||||
height: 200,
|
||||
width: 533,
|
||||
height: 300,
|
||||
top: 0,
|
||||
left: 0
|
||||
},
|
||||
|
||||
@ -107,6 +107,9 @@ class NumberSelectServiceImpl extends WidgetService {
|
||||
return defaultV.split(',')[0]
|
||||
}
|
||||
}
|
||||
isParamWidget() {
|
||||
return true
|
||||
}
|
||||
}
|
||||
const numberSelectServiceImpl = new NumberSelectServiceImpl()
|
||||
export default numberSelectServiceImpl
|
||||
|
||||
@ -102,6 +102,9 @@ class TextSelectServiceImpl extends WidgetService {
|
||||
isCustomSortWidget() {
|
||||
return true
|
||||
}
|
||||
isParamWidget() {
|
||||
return true
|
||||
}
|
||||
|
||||
fillValueDerfault(element) {
|
||||
const defaultV = element.options.value === null ? '' : element.options.value.toString()
|
||||
|
||||
@ -31,7 +31,10 @@ const dialogPanel = {
|
||||
eDynamicSuffix: 'after'
|
||||
},
|
||||
showTime: false,
|
||||
accuracy: 'HH:mm'
|
||||
accuracy: 'HH:mm',
|
||||
parameters: [],
|
||||
startParameters: [],
|
||||
endParameters: []
|
||||
},
|
||||
value: '',
|
||||
manualModify: false
|
||||
@ -329,13 +332,13 @@ class TimeDateRangeServiceImpl extends WidgetService {
|
||||
const defaultV = element.options.value === null ? '' : element.options.value.toString()
|
||||
if (element.options.attrs.type === 'daterange') {
|
||||
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV ===
|
||||
'[object Object]') {
|
||||
'[object Object]') {
|
||||
return []
|
||||
}
|
||||
return defaultV.split(',').map(item => parseFloat(item))
|
||||
} else {
|
||||
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV ===
|
||||
'[object Object]') {
|
||||
'[object Object]') {
|
||||
return null
|
||||
}
|
||||
return parseFloat(defaultV.split(',')[0])
|
||||
@ -400,6 +403,12 @@ class TimeDateRangeServiceImpl extends WidgetService {
|
||||
{ 'text': 'dynamic_year.last', 'callBack': () => this.formatShortValues([this.getStartYear(-1).getTime(), this.getEndYear(-1).getTime()]) }
|
||||
]
|
||||
}
|
||||
isParamWidget() {
|
||||
return true
|
||||
}
|
||||
isRangeParamWidget() {
|
||||
return true
|
||||
}
|
||||
}
|
||||
const timeDateRangeServiceImpl = new TimeDateRangeServiceImpl()
|
||||
export default timeDateRangeServiceImpl
|
||||
|
||||
@ -189,13 +189,13 @@ class TimeDateServiceImpl extends WidgetService {
|
||||
const defaultV = element.options.value === null ? '' : element.options.value.toString()
|
||||
if (element.options.attrs.type === 'daterange') {
|
||||
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV ===
|
||||
'[object Object]') {
|
||||
'[object Object]') {
|
||||
return []
|
||||
}
|
||||
return defaultV.split(',').map(item => parseFloat(item))
|
||||
} else {
|
||||
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV ===
|
||||
'[object Object]') {
|
||||
'[object Object]') {
|
||||
return null
|
||||
}
|
||||
return parseFloat(defaultV.split(',')[0])
|
||||
@ -234,6 +234,9 @@ class TimeDateServiceImpl extends WidgetService {
|
||||
isTimeWidget() {
|
||||
return true
|
||||
}
|
||||
isParamWidget() {
|
||||
return true
|
||||
}
|
||||
}
|
||||
const timeDateServiceImpl = new TimeDateServiceImpl({
|
||||
name: 'timeDateWidget'
|
||||
|
||||
@ -150,13 +150,13 @@ class TimeMonthServiceImpl extends WidgetService {
|
||||
const defaultV = element.options.value === null ? '' : element.options.value.toString()
|
||||
if (element.options.attrs.type === 'daterange') {
|
||||
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV ===
|
||||
'[object Object]') {
|
||||
'[object Object]') {
|
||||
return []
|
||||
}
|
||||
return defaultV.split(',').map(item => parseFloat(item))
|
||||
} else {
|
||||
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV ===
|
||||
'[object Object]') {
|
||||
'[object Object]') {
|
||||
return null
|
||||
}
|
||||
return parseFloat(defaultV.split(',')[0])
|
||||
@ -186,6 +186,9 @@ class TimeMonthServiceImpl extends WidgetService {
|
||||
return timeSection(parseFloat(value), element.options.attrs.type)
|
||||
}
|
||||
}
|
||||
isParamWidget() {
|
||||
return true
|
||||
}
|
||||
}
|
||||
const timeMonthServiceImpl = new TimeMonthServiceImpl()
|
||||
export default timeMonthServiceImpl
|
||||
|
||||
@ -137,13 +137,13 @@ class TimeYearServiceImpl extends WidgetService {
|
||||
const defaultV = element.options.value === null ? '' : element.options.value.toString()
|
||||
if (element.options.attrs.type === 'daterange') {
|
||||
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV ===
|
||||
'[object Object]') {
|
||||
'[object Object]') {
|
||||
return []
|
||||
}
|
||||
return defaultV.split(',').map(item => parseFloat(item))
|
||||
} else {
|
||||
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV ===
|
||||
'[object Object]') {
|
||||
'[object Object]') {
|
||||
return null
|
||||
}
|
||||
return parseFloat(defaultV.split(',')[0])
|
||||
@ -173,6 +173,9 @@ class TimeYearServiceImpl extends WidgetService {
|
||||
return timeSection(parseFloat(value), element.options.attrs.type)
|
||||
}
|
||||
}
|
||||
isParamWidget() {
|
||||
return true
|
||||
}
|
||||
}
|
||||
const timeYearServiceImpl = new TimeYearServiceImpl()
|
||||
export default timeYearServiceImpl
|
||||
|
||||
@ -1339,6 +1339,7 @@ export default {
|
||||
table_align_left: 'Left',
|
||||
table_align_center: 'Center',
|
||||
table_align_right: 'Right',
|
||||
table_scroll_bar_color: 'Scroll Bar Color',
|
||||
draw_back: 'Draw Back',
|
||||
senior: 'Senior',
|
||||
senior_cfg: 'Senior Config',
|
||||
|
||||
@ -1339,6 +1339,7 @@ export default {
|
||||
table_align_left: '左對齊',
|
||||
table_align_center: '居中',
|
||||
table_align_right: '右對齊',
|
||||
table_scroll_bar_color: '滾動條顏色',
|
||||
draw_back: '收回',
|
||||
senior: '高級',
|
||||
senior_cfg: '高級設置',
|
||||
|
||||
@ -1338,6 +1338,7 @@ export default {
|
||||
table_align_left: '左对齐',
|
||||
table_align_center: '居中',
|
||||
table_align_right: '右对齐',
|
||||
table_scroll_bar_color: '滚动条颜色',
|
||||
draw_back: '收回',
|
||||
senior: '高级',
|
||||
senior_cfg: '高级设置',
|
||||
|
||||
@ -93,7 +93,7 @@ div:focus {
|
||||
}
|
||||
|
||||
.de-filter-dialog {
|
||||
min-width: 500px !important;
|
||||
min-width: 785px !important;
|
||||
width: 55% !important;
|
||||
|
||||
.el-dialog__header {
|
||||
@ -322,12 +322,12 @@ div:focus {
|
||||
margin: 0 2px 1px 0;
|
||||
}
|
||||
|
||||
.field-icon-dimension{
|
||||
color: #3370FF!important;
|
||||
.field-icon-dimension {
|
||||
color: #3370FF !important;
|
||||
}
|
||||
|
||||
.field-icon-quota{
|
||||
color: #04B49C!important;
|
||||
.field-icon-quota {
|
||||
color: #04B49C !important;
|
||||
}
|
||||
|
||||
.ds-icon-pdf {
|
||||
@ -1509,6 +1509,7 @@ div:focus {
|
||||
.de-status {
|
||||
position: relative;
|
||||
margin-left: 15px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
@ -1546,6 +1547,7 @@ div:focus {
|
||||
&::before {
|
||||
background: var(--deDanger, #F54A45);
|
||||
}
|
||||
|
||||
.el-icon-s-order {
|
||||
color: var(--primary, #3370ff);
|
||||
cursor: pointer;
|
||||
@ -1590,6 +1592,7 @@ div:focus {
|
||||
margin: 0;
|
||||
margin-right: 8px;
|
||||
position: relative;
|
||||
|
||||
i {
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
@ -1621,6 +1624,7 @@ div:focus {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.arrow-filter:hover {
|
||||
background: rgba(31, 35, 41, 0.1);
|
||||
border-radius: 4px;
|
||||
@ -1633,6 +1637,7 @@ div:focus {
|
||||
.el-icon-arrow-left.arrow-filter {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.filter-texts-container {
|
||||
flex: 1;
|
||||
overflow-x: auto;
|
||||
@ -1674,11 +1679,13 @@ div:focus {
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
}
|
||||
|
||||
.calcu-field {
|
||||
.calcu-cont {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.codemirror {
|
||||
height: 250px;
|
||||
overflow-y: auto;
|
||||
@ -1686,6 +1693,7 @@ div:focus {
|
||||
border: 1px solid #bbbfc4;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.codemirror .CodeMirror-scroll {
|
||||
height: 250px;
|
||||
overflow-y: auto;
|
||||
|
||||
@ -8,7 +8,8 @@ import {
|
||||
getYAxis,
|
||||
getPadding,
|
||||
getSlider,
|
||||
getAnalyse
|
||||
getAnalyse,
|
||||
setGradientColor
|
||||
} from '@/views/chart/chart/common/common_antv'
|
||||
import { antVCustomColor } from '@/views/chart/chart/util'
|
||||
|
||||
@ -105,7 +106,7 @@ export function baseBarOptionAntV(plot, container, chart, action, isGroup, isSta
|
||||
options.color = antVCustomColor(chart)
|
||||
if (customAttr.color.gradient) {
|
||||
options.color = options.color.map((ele) => {
|
||||
return `l(270) 0:#ffffff00 1:${ele}`
|
||||
return setGradientColor(ele, customAttr.color.gradient, 270)
|
||||
})
|
||||
}
|
||||
|
||||
@ -207,7 +208,7 @@ export function hBaseBarOptionAntV(plot, container, chart, action, isGroup, isSt
|
||||
options.color = antVCustomColor(chart)
|
||||
if (customAttr.color.gradient) {
|
||||
options.color = options.color.map((ele) => {
|
||||
return `l(0) 0:#ffffff00 1:${ele}`
|
||||
return setGradientColor(ele, customAttr.color.gradient)
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
@ -29,7 +29,9 @@ export const DEFAULT_COLOR_CASE = {
|
||||
seriesColors: [], // 格式：{"name":"s1","color":"","isCustom":false}
|
||||
areaBorderColor: '#303133',
|
||||
gradient: false,
|
||||
areaBaseColor: '#FFFFFF'
|
||||
areaBaseColor: '#FFFFFF',
|
||||
tableScrollBarColor: 'rgba(0, 0, 0, 0.15)',
|
||||
tableScrollBarHoverColor: 'rgba(0, 0, 0, 0.4)'
|
||||
}
|
||||
|
||||
export const DEFAULT_COLOR_CASE_DARK = {
|
||||
@ -45,7 +47,9 @@ export const DEFAULT_COLOR_CASE_DARK = {
|
||||
tableBorderColor: '#CCCCCC',
|
||||
seriesColors: [], // 格式：{"name":"s1","color":"","isCustom":false}
|
||||
areaBorderColor: '#EBEEF5',
|
||||
areaBaseColor: '5470C6'
|
||||
areaBaseColor: '5470C6',
|
||||
tableScrollBarColor: 'rgba(255, 255, 255, 0.5)',
|
||||
tableScrollBarHoverColor: 'rgba(255, 255, 255, 0.8)'
|
||||
}
|
||||
export const DEFAULT_SIZE = {
|
||||
barDefault: true,
|
||||
|
||||
@ -881,3 +881,9 @@ function getLineDash(type) {
|
||||
return [0, 0]
|
||||
}
|
||||
}
|
||||
|
||||
export function setGradientColor(rawColor, show = false, angle = 0) {
|
||||
const item = rawColor.split(',')
|
||||
item.splice(3, 1, '0.3)')
|
||||
return show ? `l(${angle}) 0:${item.join(',')} 1:${rawColor}` : rawColor
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { hexColorToRGBA } from '@/views/chart/chart/util'
|
||||
import { hexColorToRGBA, resetRgbOpacity } from '@/views/chart/chart/util'
|
||||
import { DEFAULT_COLOR_CASE, DEFAULT_SIZE } from '@/views/chart/chart/chart'
|
||||
|
||||
export function getCustomTheme(chart) {
|
||||
@ -7,6 +7,8 @@ export function getCustomTheme(chart) {
|
||||
const borderColor = hexColorToRGBA(DEFAULT_COLOR_CASE.tableBorderColor, DEFAULT_COLOR_CASE.alpha)
|
||||
const headerAlign = DEFAULT_SIZE.tableHeaderAlign
|
||||
const itemAlign = DEFAULT_SIZE.tableItemAlign
|
||||
const scrollBarColor = DEFAULT_COLOR_CASE.tableScrollBarColor
|
||||
const scrollBarHoverColor = DEFAULT_COLOR_CASE.tableScrollBarHoverColor
|
||||
|
||||
const theme = {
|
||||
background: {
|
||||
@ -105,6 +107,10 @@ export function getCustomTheme(chart) {
|
||||
fontSize: DEFAULT_SIZE.tableItemFontSize,
|
||||
textAlign: headerAlign
|
||||
}
|
||||
},
|
||||
scrollBar: {
|
||||
thumbColor: scrollBarColor,
|
||||
thumbHoverColor: scrollBarHoverColor
|
||||
}
|
||||
}
|
||||
|
||||
@ -156,6 +162,9 @@ export function getCustomTheme(chart) {
|
||||
theme.dataCell.bolderText.fill = c.tableFontColor
|
||||
theme.dataCell.text.fill = c.tableFontColor
|
||||
theme.dataCell.measureText.fill = c.tableFontColor
|
||||
|
||||
theme.scrollBar.thumbColor = c.tableScrollBarColor
|
||||
theme.scrollBar.thumbHoverColor = resetRgbOpacity(c.tableScrollBarColor, 1.5)
|
||||
}
|
||||
// size
|
||||
if (customAttr.size) {
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { getPadding, getTheme } from '@/views/chart/chart/common/common_antv'
|
||||
import { getPadding, getTheme, setGradientColor } from '@/views/chart/chart/common/common_antv'
|
||||
import { Gauge } from '@antv/g2plot'
|
||||
import { DEFAULT_LABEL, DEFAULT_SIZE, DEFAULT_THRESHOLD } from '@/views/chart/chart/chart'
|
||||
import { getScaleValue } from '@/components/canvas/utils/style'
|
||||
@ -154,7 +154,9 @@ export function baseGaugeOptionAntV(plot, container, chart, action, scale = 1) {
|
||||
}
|
||||
|
||||
if (customAttr.color.gradient) {
|
||||
const colorList = (theme.styleSheet?.paletteQualitative10 || []).map((ele) => `l(0) 0:#ffffff00 1:${ele}`)
|
||||
const colorList = (theme.styleSheet?.paletteQualitative10 || []).map((ele) => {
|
||||
return setGradientColor(ele, customAttr.color.gradient)
|
||||
})
|
||||
if (!options.range) {
|
||||
options.range = {
|
||||
color: colorList
|
||||
|
||||
@ -8,7 +8,8 @@ import {
|
||||
getYAxis,
|
||||
getPadding,
|
||||
getSlider,
|
||||
getAnalyse
|
||||
getAnalyse,
|
||||
setGradientColor
|
||||
} from '@/views/chart/chart/common/common_antv'
|
||||
import { antVCustomColor, handleEmptyDataStrategy } from '@/views/chart/chart/util'
|
||||
import _ from 'lodash'
|
||||
@ -183,10 +184,10 @@ export function baseAreaOptionAntV(plot, container, chart, action, isStack) {
|
||||
const areaColors = [...options.color, ...options.color]
|
||||
if (customAttr.color.gradient) {
|
||||
options.areaStyle = () => {
|
||||
const cr = areaColors.shift()
|
||||
if (cr) {
|
||||
const ele = areaColors.shift()
|
||||
if (ele) {
|
||||
return {
|
||||
fill: `l(270) 0:#ffffff00 1:${cr}`
|
||||
fill: setGradientColor(ele, customAttr.color.gradient, 270)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -82,12 +82,6 @@ export function basePieOptionAntV(plot, container, chart, action) {
|
||||
// custom color
|
||||
options.color = antVCustomColor(chart)
|
||||
|
||||
if (customAttr.color.gradient) {
|
||||
options.color = options.color.map((ele) => {
|
||||
return `l(270) 0:#ffffff00 1:${ele}`
|
||||
})
|
||||
}
|
||||
|
||||
// 开始渲染
|
||||
if (plot) {
|
||||
plot.destroy()
|
||||
@ -165,12 +159,6 @@ export function basePieRoseOptionAntV(plot, container, chart, action) {
|
||||
// custom color
|
||||
options.color = antVCustomColor(chart)
|
||||
|
||||
if (customAttr.color.gradient) {
|
||||
options.color = options.color.map((ele) => {
|
||||
return `l(270) 0:#ffffff00 1:${ele}`
|
||||
})
|
||||
}
|
||||
|
||||
// 开始渲染
|
||||
if (plot) {
|
||||
plot.destroy()
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import { DEFAULT_TITLE_STYLE } from '@/views/chart/chart/chart'
|
||||
import { equalsAny, includesAny } from '@/utils/StringUtils'
|
||||
import _ from 'lodash'
|
||||
|
||||
export function hexColorToRGBA(hex, alpha) {
|
||||
const rgb = [] // 定义rgb数组
|
||||
@ -49,6 +50,7 @@ export const TYPE_CONFIGS = [
|
||||
'tableHeaderFontColor',
|
||||
'tableFontColor',
|
||||
'tableBorderColor',
|
||||
'tableScrollBarColor',
|
||||
'alpha'
|
||||
],
|
||||
'size-selector-ant-v': [
|
||||
@ -95,6 +97,7 @@ export const TYPE_CONFIGS = [
|
||||
'tableHeaderFontColor',
|
||||
'tableFontColor',
|
||||
'tableBorderColor',
|
||||
'tableScrollBarColor',
|
||||
'alpha'
|
||||
],
|
||||
'size-selector-ant-v': [
|
||||
@ -144,6 +147,7 @@ export const TYPE_CONFIGS = [
|
||||
'tableHeaderFontColor',
|
||||
'tableFontColor',
|
||||
'tableBorderColor',
|
||||
'tableScrollBarColor',
|
||||
'alpha'
|
||||
],
|
||||
'size-selector-ant-v': [
|
||||
@ -943,6 +947,7 @@ export const TYPE_CONFIGS = [
|
||||
'color-selector': [
|
||||
'value',
|
||||
'custom',
|
||||
'gradient',
|
||||
'alpha'
|
||||
],
|
||||
'label-selector-ant-v': [
|
||||
@ -1249,7 +1254,6 @@ export const TYPE_CONFIGS = [
|
||||
'value',
|
||||
'colorPanel',
|
||||
'customColor',
|
||||
'gradient',
|
||||
'alpha'
|
||||
],
|
||||
'size-selector-ant-v': [
|
||||
@ -1309,7 +1313,6 @@ export const TYPE_CONFIGS = [
|
||||
'value',
|
||||
'colorPanel',
|
||||
'customColor',
|
||||
'gradient',
|
||||
'alpha'
|
||||
],
|
||||
'size-selector-ant-v': [
|
||||
@ -1370,7 +1373,6 @@ export const TYPE_CONFIGS = [
|
||||
'value',
|
||||
'colorPanel',
|
||||
'customColor',
|
||||
'gradient',
|
||||
'alpha'
|
||||
],
|
||||
'size-selector-ant-v': [
|
||||
@ -1428,7 +1430,6 @@ export const TYPE_CONFIGS = [
|
||||
'value',
|
||||
'colorPanel',
|
||||
'customColor',
|
||||
'gradient',
|
||||
'alpha'
|
||||
],
|
||||
'size-selector-ant-v': [
|
||||
@ -1850,6 +1851,7 @@ export const TYPE_CONFIGS = [
|
||||
'tableItemBgColor',
|
||||
'tableHeaderFontColor',
|
||||
'tableFontColor',
|
||||
'tableScrollBarColor',
|
||||
'alpha'
|
||||
],
|
||||
'size-selector': [
|
||||
@ -1889,6 +1891,7 @@ export const TYPE_CONFIGS = [
|
||||
'tableItemBgColor',
|
||||
'tableHeaderFontColor',
|
||||
'tableFontColor',
|
||||
'tableScrollBarColor',
|
||||
'alpha'
|
||||
],
|
||||
'size-selector': [
|
||||
@ -3492,15 +3495,18 @@ function handleSetZeroMultiDimension(chart, data) {
|
||||
let insertCount = 0
|
||||
dimensionInfoMap.forEach((dimensionInfo, field) => {
|
||||
if (dimensionInfo.set.size < subDimensionSet.size) {
|
||||
const toBeFillDimension = [...subDimensionSet].filter(item => !dimensionInfo.set.has(item))
|
||||
toBeFillDimension.forEach(dimension => {
|
||||
data.splice(dimensionInfo.index + insertCount, 0, {
|
||||
field,
|
||||
value: 0,
|
||||
category: dimension
|
||||
})
|
||||
let subInsertIndex = 0
|
||||
subDimensionSet.forEach(dimension => {
|
||||
if (!dimensionInfo.set.has(dimension)) {
|
||||
data.splice(dimensionInfo.index + insertCount + subInsertIndex, 0, {
|
||||
field,
|
||||
value: 0,
|
||||
category: dimension
|
||||
})
|
||||
}
|
||||
subInsertIndex++
|
||||
})
|
||||
insertCount += toBeFillDimension.size
|
||||
insertCount += subDimensionSet.size - dimensionInfo.set.size
|
||||
}
|
||||
})
|
||||
}
|
||||
@ -3521,3 +3527,21 @@ function handleIgnoreData(chart, data) {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export function resetRgbOpacity(sourceColor, times) {
|
||||
if (sourceColor?.startsWith('rgb')) {
|
||||
const numbers = sourceColor.match(/(\d(\.\d+)?)+/g)
|
||||
if (numbers?.length === 4) {
|
||||
const opacity = parseFloat(numbers[3])
|
||||
if (_.isNumber(opacity)) {
|
||||
let resultOpacity = (opacity * times).toFixed(2)
|
||||
if (resultOpacity > 1) {
|
||||
resultOpacity = 1
|
||||
}
|
||||
const colorArr = numbers.slice(0, 3).concat(resultOpacity)
|
||||
return `rgba(${colorArr.join(',')})`
|
||||
}
|
||||
}
|
||||
}
|
||||
return sourceColor
|
||||
}
|
||||
|
||||
@ -4,7 +4,8 @@ import {
|
||||
getTheme,
|
||||
getTooltip,
|
||||
getXAxis,
|
||||
getYAxis
|
||||
getYAxis,
|
||||
setGradientColor
|
||||
} from '@/views/chart/chart/common/common_antv'
|
||||
import { Waterfall } from '@antv/g2plot'
|
||||
import { formatterItem, valueFormatter } from '@/views/chart/chart/formatter'
|
||||
@ -28,11 +29,17 @@ export function baseWaterfallOptionAntV(plot, container, chart, action) {
|
||||
}
|
||||
// data
|
||||
const data = chart.data.data
|
||||
const [risingColorRgba, fallingColorRgba, totalColorRgba] = theme.styleSheet.paletteQualitative10
|
||||
|
||||
let customAttrCopy = {}
|
||||
if (chart.customAttr) {
|
||||
customAttrCopy = JSON.parse(chart.customAttr)
|
||||
}
|
||||
// total
|
||||
const total = {
|
||||
label: '合计',
|
||||
style: {
|
||||
fill: theme.styleSheet.paletteQualitative10[2]
|
||||
fill: setGradientColor(totalColorRgba, customAttrCopy.color.gradient, 270)
|
||||
}
|
||||
}
|
||||
// options
|
||||
@ -50,25 +57,25 @@ export function baseWaterfallOptionAntV(plot, container, chart, action) {
|
||||
items: [
|
||||
{ name: '增加', marker: {
|
||||
style: {
|
||||
fill: theme.styleSheet.paletteQualitative10[0]
|
||||
fill: setGradientColor(risingColorRgba, customAttrCopy.color.gradient, 270)
|
||||
}
|
||||
}},
|
||||
{ name: '减少', marker: {
|
||||
style: {
|
||||
fill: theme.styleSheet.paletteQualitative10[1]
|
||||
fill: setGradientColor(fallingColorRgba, customAttrCopy.color.gradient, 270)
|
||||
}
|
||||
}},
|
||||
{ name: '合计', marker: {
|
||||
style: {
|
||||
fill: theme.styleSheet.paletteQualitative10[2]
|
||||
fill: setGradientColor(totalColorRgba, customAttrCopy.color.gradient, 270)
|
||||
}
|
||||
}}
|
||||
]
|
||||
},
|
||||
xAxis: xAxis,
|
||||
yAxis: yAxis,
|
||||
risingFill: theme.styleSheet.paletteQualitative10[0],
|
||||
fallingFill: theme.styleSheet.paletteQualitative10[1],
|
||||
risingFill: setGradientColor(risingColorRgba, customAttrCopy.color.gradient, 270),
|
||||
fallingFill: setGradientColor(fallingColorRgba, customAttrCopy.color.gradient, 270),
|
||||
total: total,
|
||||
interactions: [
|
||||
{
|
||||
@ -79,7 +86,7 @@ export function baseWaterfallOptionAntV(plot, container, chart, action) {
|
||||
}
|
||||
]
|
||||
}
|
||||
// size
|
||||
|
||||
let customAttr = {}
|
||||
if (chart.customAttr) {
|
||||
customAttr = JSON.parse(chart.customAttr)
|
||||
|
||||
@ -248,6 +248,20 @@
|
||||
@change="changeColorCase('tableBorderColor')"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
v-show="showProperty('tableScrollBarColor')"
|
||||
:label="$t('chart.table_scroll_bar_color')"
|
||||
class="form-item"
|
||||
>
|
||||
<el-color-picker
|
||||
v-model="colorForm.tableScrollBarColor"
|
||||
class="color-picker-style"
|
||||
:predefine="predefineColors"
|
||||
color-format="rgb"
|
||||
show-alpha
|
||||
@change="changeColorCase('tableScrollBarColor')"
|
||||
/>
|
||||
</el-form-item>
|
||||
</div>
|
||||
|
||||
<el-form-item
|
||||
@ -477,6 +491,8 @@ export default {
|
||||
|
||||
this.colorForm.tableBorderColor = this.colorForm.tableBorderColor ? this.colorForm.tableBorderColor : DEFAULT_COLOR_CASE.tableBorderColor
|
||||
this.colorForm.tableHeaderFontColor = this.colorForm.tableHeaderFontColor ? this.colorForm.tableHeaderFontColor : this.colorForm.tableFontColor
|
||||
this.$set(this.colorForm, 'gradient', this.colorForm.gradient || false)
|
||||
this.colorForm.tableScrollBarColor = this.colorForm.tableScrollBarColor ? this.colorForm.tableScrollBarColor : DEFAULT_COLOR_CASE.tableScrollBarColor
|
||||
|
||||
this.initCustomColor()
|
||||
}
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
<ux-grid
|
||||
ref="plxTable"
|
||||
size="mini"
|
||||
style="width: 100%;"
|
||||
:style="tableStyle"
|
||||
:height="height"
|
||||
:checkbox-config="{highlight: true}"
|
||||
:width-resize="true"
|
||||
@ -79,7 +79,7 @@
|
||||
<script>
|
||||
import { hexColorToRGBA } from '../../chart/util'
|
||||
import eventBus from '@/components/canvas/utils/eventBus'
|
||||
import { DEFAULT_SIZE } from '@/views/chart/chart/chart'
|
||||
import { DEFAULT_COLOR_CASE, DEFAULT_SIZE } from '@/views/chart/chart/chart'
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
@ -154,7 +154,9 @@ export default {
|
||||
scrollTimer: null,
|
||||
scrollTop: 0,
|
||||
showIndex: false,
|
||||
indexLabel: '序号'
|
||||
indexLabel: '序号',
|
||||
scrollBarColor: DEFAULT_COLOR_CASE.tableScrollBarColor,
|
||||
scrollBarHoverColor: DEFAULT_COLOR_CASE.tableScrollBarHoverColor
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@ -176,6 +178,12 @@ export default {
|
||||
borderRadius: this.borderRadius
|
||||
}
|
||||
},
|
||||
tableStyle() {
|
||||
return {
|
||||
width: '100%',
|
||||
'--scroll-bar-color': this.scrollBarColor
|
||||
}
|
||||
},
|
||||
...mapState([
|
||||
'previewCanvasScale'
|
||||
])
|
||||
@ -309,6 +317,7 @@ export default {
|
||||
this.table_header_class.background = hexColorToRGBA(customAttr.color.tableHeaderBgColor, customAttr.color.alpha)
|
||||
this.table_item_class.color = customAttr.color.tableFontColor
|
||||
this.table_item_class.background = hexColorToRGBA(customAttr.color.tableItemBgColor, customAttr.color.alpha)
|
||||
this.scrollBarColor = customAttr.color.tableScrollBarColor ? customAttr.color.tableScrollBarColor : DEFAULT_COLOR_CASE.tableScrollBarColor
|
||||
}
|
||||
if (customAttr.size) {
|
||||
this.table_header_class.fontSize = customAttr.size.tableTitleFontSize + 'px'
|
||||
@ -498,7 +507,7 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
<style scoped lang="scss">
|
||||
.table-class ::v-deep .body--wrapper {
|
||||
background: rgba(1, 1, 1, 0);
|
||||
}
|
||||
@ -548,4 +557,12 @@ export default {
|
||||
.page-style ::v-deep li {
|
||||
background: transparent !important;
|
||||
}
|
||||
.table-class{
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: var(--scroll-bar-color);
|
||||
}
|
||||
}
|
||||
.table-class{
|
||||
scrollbar-color: var(--scroll-bar-color) transparent;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -192,7 +192,7 @@
|
||||
@command="chartFieldEdit"
|
||||
>
|
||||
<span class="el-dropdown-link">
|
||||
<i class="el-icon-s-tools" />
|
||||
<i class="el-icon-s-tools"/>
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item
|
||||
@ -267,7 +267,7 @@
|
||||
@command="chartFieldEdit"
|
||||
>
|
||||
<span class="el-dropdown-link">
|
||||
<i class="el-icon-s-tools" />
|
||||
<i class="el-icon-s-tools"/>
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item
|
||||
@ -362,7 +362,7 @@
|
||||
style="padding: 6px;"
|
||||
>
|
||||
{{ $t('chart.change_chart_type') }}
|
||||
<i class="el-icon-caret-bottom" />
|
||||
<i class="el-icon-caret-bottom"/>
|
||||
</el-button>
|
||||
</el-popover>
|
||||
</span>
|
||||
@ -490,8 +490,8 @@
|
||||
>
|
||||
<span class="data-area-label">
|
||||
<span v-if="view.type && view.type.includes('table')">{{
|
||||
$t('chart.drag_block_table_data_column')
|
||||
}}</span>
|
||||
$t('chart.drag_block_table_data_column')
|
||||
}}</span>
|
||||
<span
|
||||
v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'chart-mix' || view.type === 'waterfall' || view.type === 'area')"
|
||||
>{{ $t('chart.drag_block_type_axis') }}</span>
|
||||
@ -499,18 +499,18 @@
|
||||
v-else-if="view.type && view.type.includes('pie')"
|
||||
>{{ $t('chart.drag_block_pie_label') }}</span>
|
||||
<span v-else-if="view.type && view.type.includes('funnel')">{{
|
||||
$t('chart.drag_block_funnel_split')
|
||||
}}</span>
|
||||
$t('chart.drag_block_funnel_split')
|
||||
}}</span>
|
||||
<span v-else-if="view.type && view.type.includes('radar')">{{
|
||||
$t('chart.drag_block_radar_label')
|
||||
}}</span>
|
||||
$t('chart.drag_block_radar_label')
|
||||
}}</span>
|
||||
<span v-else-if="view.type && view.type === 'map'">{{ $t('chart.area') }}</span>
|
||||
<span v-else-if="view.type && view.type.includes('treemap')">{{
|
||||
$t('chart.drag_block_treemap_label')
|
||||
}}</span>
|
||||
$t('chart.drag_block_treemap_label')
|
||||
}}</span>
|
||||
<span v-else-if="view.type && view.type === 'word-cloud'">{{
|
||||
$t('chart.drag_block_word_cloud_label')
|
||||
}}</span>
|
||||
$t('chart.drag_block_word_cloud_label')
|
||||
}}</span>
|
||||
<span v-else-if="view.type && view.type === 'label'">{{ $t('chart.drag_block_label') }}</span>
|
||||
<span v-show="view.type !== 'richTextView'"> / </span>
|
||||
<span v-if="view.type && view.type !== 'table-info'">{{ $t('chart.dimension') }}</span>
|
||||
@ -633,8 +633,8 @@
|
||||
>
|
||||
<span class="data-area-label">
|
||||
<span v-if="view.type && view.type.includes('table')">{{
|
||||
$t('chart.drag_block_table_data_column')
|
||||
}}</span>
|
||||
$t('chart.drag_block_table_data_column')
|
||||
}}</span>
|
||||
<span
|
||||
v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'waterfall' || view.type === 'area')"
|
||||
>{{ $t('chart.drag_block_value_axis') }}</span>
|
||||
@ -642,30 +642,30 @@
|
||||
v-else-if="view.type && view.type.includes('pie')"
|
||||
>{{ $t('chart.drag_block_pie_angel') }}</span>
|
||||
<span v-else-if="view.type && view.type.includes('funnel')">{{
|
||||
$t('chart.drag_block_funnel_width')
|
||||
}}</span>
|
||||
$t('chart.drag_block_funnel_width')
|
||||
}}</span>
|
||||
<span v-else-if="view.type && view.type.includes('radar')">{{
|
||||
$t('chart.drag_block_radar_length')
|
||||
}}</span>
|
||||
$t('chart.drag_block_radar_length')
|
||||
}}</span>
|
||||
<span v-else-if="view.type && view.type.includes('gauge')">{{
|
||||
$t('chart.drag_block_gauge_angel')
|
||||
}}</span>
|
||||
$t('chart.drag_block_gauge_angel')
|
||||
}}</span>
|
||||
<span
|
||||
v-else-if="view.type && view.type.includes('text')"
|
||||
>{{ $t('chart.drag_block_label_value') }}</span>
|
||||
<span v-else-if="view.type && view.type === 'map'">{{ $t('chart.chart_data') }}</span>
|
||||
<span v-else-if="view.type && view.type.includes('tree')">{{
|
||||
$t('chart.drag_block_treemap_size')
|
||||
}}</span>
|
||||
$t('chart.drag_block_treemap_size')
|
||||
}}</span>
|
||||
<span v-else-if="view.type && view.type === 'chart-mix'">{{
|
||||
$t('chart.drag_block_value_axis_main')
|
||||
}}</span>
|
||||
$t('chart.drag_block_value_axis_main')
|
||||
}}</span>
|
||||
<span
|
||||
v-else-if="view.type && view.type === 'liquid'"
|
||||
>{{ $t('chart.drag_block_progress') }}</span>
|
||||
<span v-else-if="view.type && view.type === 'word-cloud'">{{
|
||||
$t('chart.drag_block_word_cloud_size')
|
||||
}}</span>
|
||||
$t('chart.drag_block_word_cloud_size')
|
||||
}}</span>
|
||||
<span v-show="view.type !== 'richTextView'"> / </span>
|
||||
<span>{{ $t('chart.quota') }}</span>
|
||||
<i
|
||||
@ -1116,7 +1116,7 @@
|
||||
class="padding-tab"
|
||||
style="width: 350px;"
|
||||
>
|
||||
<position-adjust />
|
||||
<position-adjust/>
|
||||
</el-tab-pane>
|
||||
|
||||
</el-tabs>
|
||||
@ -1268,7 +1268,7 @@
|
||||
width="800px"
|
||||
class="dialog-css"
|
||||
>
|
||||
<quota-filter-editor :item="quotaItem" />
|
||||
<quota-filter-editor :item="quotaItem"/>
|
||||
<div
|
||||
slot="footer"
|
||||
class="dialog-footer"
|
||||
@ -1295,7 +1295,7 @@
|
||||
width="800px"
|
||||
class="dialog-css"
|
||||
>
|
||||
<dimension-filter-editor :item="dimensionItem" />
|
||||
<dimension-filter-editor :item="dimensionItem"/>
|
||||
<div
|
||||
slot="footer"
|
||||
class="dialog-footer"
|
||||
|
||||
@ -29,6 +29,8 @@
|
||||
v-model="styleInfo.left"
|
||||
type="number"
|
||||
:min="0"
|
||||
:max="maxLeft"
|
||||
@change="leftOnChange"
|
||||
class="hide-icon-number"
|
||||
>
|
||||
<template slot="append">px</template>
|
||||
@ -69,6 +71,8 @@
|
||||
|
||||
<script>
|
||||
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'PositionAdjust',
|
||||
props: {},
|
||||
@ -76,14 +80,26 @@ export default {
|
||||
return {}
|
||||
},
|
||||
computed: {
|
||||
maxLeft() {
|
||||
return 1600 - this.styleInfo.width - this.componentGap
|
||||
},
|
||||
styleInfo() {
|
||||
return this.$store.state.curComponent.style
|
||||
}
|
||||
},
|
||||
...mapState([
|
||||
'componentGap'
|
||||
])
|
||||
},
|
||||
watch: {},
|
||||
mounted() {
|
||||
},
|
||||
methods: {}
|
||||
methods: {
|
||||
leftOnChange() {
|
||||
if (this.styleInfo.left > this.maxLeft) {
|
||||
this.styleInfo.left = this.maxLeft
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@ -165,8 +165,8 @@
|
||||
v-show=" show &&showIndex===1"
|
||||
:canvas-id="canvasId"
|
||||
/>
|
||||
<subject-setting v-show=" show &&showIndex===2" />
|
||||
<assist-component v-show=" show &&showIndex===3" />
|
||||
<subject-setting v-show=" show &&showIndex===2"/>
|
||||
<assist-component v-show=" show &&showIndex===3"/>
|
||||
</div>
|
||||
</el-drawer>
|
||||
<!--PC端画布区域-->
|
||||
@ -181,7 +181,7 @@
|
||||
:canvas-pid="'0'"
|
||||
@canvasScroll="canvasScroll"
|
||||
>
|
||||
<canvas-opt-bar slot="optBar" />
|
||||
<canvas-opt-bar slot="optBar"/>
|
||||
</de-canvas>
|
||||
<!--移动端画布区域 保持宽高比2.5-->
|
||||
<el-row
|
||||
@ -197,7 +197,7 @@
|
||||
:style="customCanvasMobileStyle"
|
||||
class="this_mobile_canvas"
|
||||
>
|
||||
<el-row class="this_mobile_canvas_top" />
|
||||
<el-row class="this_mobile_canvas_top"/>
|
||||
<el-row class="this_mobile_canvas_inner_top">
|
||||
{{ panelInfo.name }}
|
||||
</el-row>
|
||||
@ -215,7 +215,7 @@
|
||||
:canvas-pid="'0'"
|
||||
:mobile-layout-status="true"
|
||||
>
|
||||
<canvas-opt-bar slot="optBar" />
|
||||
<canvas-opt-bar slot="optBar"/>
|
||||
</de-canvas>
|
||||
</el-row>
|
||||
<el-row class="this_mobile_canvas_inner_bottom">
|
||||
@ -245,14 +245,14 @@
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row class="this_mobile_canvas_bottom" />
|
||||
<el-row class="this_mobile_canvas_bottom"/>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col
|
||||
:span="16"
|
||||
class="this_mobile_canvas_cell this_mobile_canvas_wait_cell"
|
||||
>
|
||||
<component-wait />
|
||||
<component-wait/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</de-main-container>
|
||||
@ -270,7 +270,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div v-if="showBatchViewToolsAside">
|
||||
<chart-style-batch-set />
|
||||
<chart-style-batch-set/>
|
||||
</div>
|
||||
<div v-if="!showViewToolsAside&&!showBatchViewToolsAside">
|
||||
<el-row style="height: 40px">
|
||||
@ -283,10 +283,11 @@
|
||||
@click="changeRightDrawOpen(false)"
|
||||
/>
|
||||
</el-tooltip>
|
||||
<span style="font-weight: bold;font-size: 14px;margin-left: 40px;line-height:40px">{{ $t('panel.position_adjust') }}</span>
|
||||
<span style="font-weight: bold;font-size: 14px;margin-left: 40px;line-height:40px"
|
||||
>{{ $t('panel.position_adjust') }}</span>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<position-adjust v-if="curComponent&&!curComponent.auxiliaryMatrix" />
|
||||
<position-adjust v-if="curComponent&&!curComponent.auxiliaryMatrix"/>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
@ -445,7 +446,8 @@
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :span="21">
|
||||
<span style="font-size: 13px;margin-left: 10px;font-weight: bold;line-height: 20px">{{ $t('panel.panel_cache_use_tips') }}</span>
|
||||
<span style="font-size: 13px;margin-left: 10px;font-weight: bold;line-height: 20px"
|
||||
>{{ $t('panel.panel_cache_use_tips') }}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div
|
||||
@ -644,7 +646,7 @@ export default {
|
||||
},
|
||||
// 显示视图工具栏
|
||||
showViewToolsAside() {
|
||||
return !this.batchOptStatus && this.curComponent && (this.curComponent.type === 'view' || this.curComponent.type === 'de-tabs')
|
||||
return !this.batchOptStatus && this.curComponent && (this.curComponent.type === 'view')
|
||||
},
|
||||
showBatchViewToolsAside() {
|
||||
return this.batchOptStatus
|
||||
@ -961,11 +963,11 @@ export default {
|
||||
showPanel(type) {
|
||||
if (this.showIndex === -1 || this.showIndex === type) {
|
||||
this.$nextTick(() => {
|
||||
if (this.show) {
|
||||
this.showIndex === -1
|
||||
if (this.show) {
|
||||
this.showIndex === -1
|
||||
}
|
||||
this.show = !this.show
|
||||
}
|
||||
this.show = !this.show
|
||||
}
|
||||
)
|
||||
}
|
||||
this.showIndex = type
|
||||
|
||||
@ -169,7 +169,51 @@
|
||||
width="200"
|
||||
>
|
||||
<div class="view-container-class">
|
||||
<el-checkbox-group v-model="attrs.parameters">
|
||||
<el-tabs
|
||||
v-if="isRangeParamWidget"
|
||||
v-model="activeName"
|
||||
>
|
||||
<el-tab-pane
|
||||
v-for="(item, index) in tabsOption"
|
||||
:key="item.name + index"
|
||||
:label="item.label"
|
||||
:name="item.name"
|
||||
>
|
||||
<el-checkbox-group
|
||||
v-model="attrs[item.name + 'Parameters']"
|
||||
@change="val => {changeDynamicParams(val, item.name)}"
|
||||
>
|
||||
<el-checkbox
|
||||
v-for="(item ) in childViews.datasetParams"
|
||||
:key="item.id"
|
||||
:label="item.id"
|
||||
:disabled="attrs[tabsOption[(index + 1)%2].name + 'Parameters'] && attrs[tabsOption[(index + 1)%2].name + 'Parameters'].includes(item.id)"
|
||||
class="de-checkbox"
|
||||
>
|
||||
<div class="span-div">
|
||||
<span
|
||||
v-if="item.alias && item.alias.length <= 7"
|
||||
style="margin-left: 6px"
|
||||
>{{ item.alias }}</span>
|
||||
<el-tooltip
|
||||
v-else
|
||||
class="item"
|
||||
effect="dark"
|
||||
:content="item.alias"
|
||||
placement="left"
|
||||
>
|
||||
<span style="margin-left: 6px">{{ item.alias }}</span>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<el-checkbox-group
|
||||
v-else
|
||||
v-model="attrs.parameters"
|
||||
>
|
||||
<el-checkbox
|
||||
v-for="(item ) in childViews.datasetParams"
|
||||
:key="item.id"
|
||||
@ -236,7 +280,13 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeName: 'start',
|
||||
tabsOption: [
|
||||
{ label: this.$t('dataset.start_time'), name: 'start' },
|
||||
{ label: this.$t('dataset.end_time'), name: 'end' }
|
||||
],
|
||||
showParams: false,
|
||||
isRangeParamWidget: false,
|
||||
attrs: null,
|
||||
titlePopovervisible: false,
|
||||
popovervisible: false,
|
||||
@ -278,11 +328,21 @@ export default {
|
||||
|
||||
created() {
|
||||
this.attrs = this.controlAttrs
|
||||
if ('timeYearWidget,timeMonthWidget,timeDateWidget,textSelectWidget,numberSelectWidget'.indexOf(this.widget.name) !== -1) {
|
||||
if (this.widget.isTimeWidget && this.widget.isTimeWidget()) {
|
||||
this.showParams = true
|
||||
this.isRangeParamWidget = this.widget.isRangeParamWidget && this.widget.isRangeParamWidget()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeDynamicParams(val, name) {
|
||||
const start = this.attrs.startParameters ? JSON.parse(JSON.stringify(this.attrs.startParameters)) : []
|
||||
|
||||
const end = this.attrs.endParameters ? JSON.parse(JSON.stringify(this.attrs.endParameters)) : []
|
||||
if (end?.length) {
|
||||
end[0] += '_START_END_SPLIT'
|
||||
}
|
||||
this.attrs.parameters = [...new Set([...start, ...end])]
|
||||
},
|
||||
sortChange(param) {
|
||||
this.element.options.attrs.sort = param
|
||||
},
|
||||
|
||||
@ -174,7 +174,7 @@
|
||||
/>
|
||||
</span>
|
||||
<span v-if="data.nodeType === 'folder'">
|
||||
<svg-icon icon-class="scene" />
|
||||
<svg-icon icon-class="scene"/>
|
||||
</span>
|
||||
<span
|
||||
:class="data.status"
|
||||
@ -211,7 +211,7 @@
|
||||
<el-dropdown-item
|
||||
:command="beforeClickEdit('folder', 'new', data, node)"
|
||||
>
|
||||
<svg-icon icon-class="scene" />
|
||||
<svg-icon icon-class="scene"/>
|
||||
<span style="margin-left: 5px">{{ $t('panel.groupAdd') }}</span>
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
@ -334,7 +334,7 @@
|
||||
:label="$t('commons.name')"
|
||||
prop="name"
|
||||
>
|
||||
<el-input v-model="groupForm.name" />
|
||||
<el-input v-model="groupForm.name"/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div
|
||||
@ -345,8 +345,8 @@
|
||||
size="mini"
|
||||
@click="close()"
|
||||
>{{
|
||||
$t('panel.cancel')
|
||||
}}
|
||||
$t('panel.cancel')
|
||||
}}
|
||||
</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
@ -422,8 +422,8 @@
|
||||
size="mini"
|
||||
@click="closeMoveGroup()"
|
||||
>{{
|
||||
$t('dataset.cancel')
|
||||
}}
|
||||
$t('dataset.cancel')
|
||||
}}
|
||||
</el-button>
|
||||
<el-button
|
||||
:disabled="groupMoveConfirmDisabled"
|
||||
@ -926,7 +926,7 @@ export default {
|
||||
|
||||
if (userCache) {
|
||||
this.defaultData = JSON.parse(modelInfo)
|
||||
if (showFirst && this.defaultData.length > 0) {
|
||||
if (showFirst && this.defaultData && this.defaultData.length > 0) {
|
||||
this.activeDefaultNodeAndClickOnly(this.defaultData[0].id)
|
||||
}
|
||||
}
|
||||
@ -935,7 +935,7 @@ export default {
|
||||
localStorage.setItem('panel-default-tree', JSON.stringify(res.data))
|
||||
if (!userCache) {
|
||||
this.defaultData = res.data
|
||||
if (showFirst && this.defaultData.length > 0) {
|
||||
if (showFirst && this.defaultData && this.defaultData.length > 0) {
|
||||
this.activeDefaultNodeAndClickOnly(this.defaultData[0].id)
|
||||
}
|
||||
}
|
||||
|
||||
@ -190,6 +190,19 @@
|
||||
@change="changeColorCase('tableBorderColor')"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('chart.table_scroll_bar_color')"
|
||||
class="form-item"
|
||||
>
|
||||
<el-color-picker
|
||||
v-model="colorForm.tableScrollBarColor"
|
||||
class="color-picker-style"
|
||||
:predefine="predefineColors"
|
||||
color-format="rgb"
|
||||
show-alpha
|
||||
@change="changeColorCase('tableScrollBarColor')"
|
||||
/>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
</el-col>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user