Skip to content

D
dataease
Unverified 提交 ef332c76 authored 作者: Junjun's avatar Junjun 提交者： GitHub
浏览文件
操作

Merge pull request #1761 from dataease/pr@dev@refactor_chart_field

refactor: 视图字段增加校验提示
上级 23955d8c 24d9762b
显示空白字符变更
内嵌 并排
正在显示 包含 277 行增加 和 52 行删除
frontend/src/lang/en.js
浏览文件 @ ef332c76
...@@ -1022,7 +1022,8 @@ export default { ...@@ -1022,7 +1022,8 @@ export default {
table_column_adapt: 'Adapt', table_column_adapt: 'Adapt',
table_column_custom: 'Custom', table_column_custom: 'Custom',
chart_table_pivot: 'Pivot Table', chart_table_pivot: 'Pivot Table',
table_pivot_row: 'Data Row' table_pivot_row: 'Data Row',
field_error_tips: 'This field is changed(Include dimension、quota，field type，deleted),please edit again.'
}, },
dataset: { dataset: {
sheet_warn: 'There are multiple sheet pages, and the first one is extracted by default', sheet_warn: 'There are multiple sheet pages, and the first one is extracted by default',
......
frontend/src/lang/tw.js
浏览文件 @ ef332c76
...@@ -1022,7 +1022,8 @@ export default { ...@@ -1022,7 +1022,8 @@ export default {
table_column_adapt: '自適應', table_column_adapt: '自適應',
table_column_custom: '自定義', table_column_custom: '自定義',
chart_table_pivot: '透視表', chart_table_pivot: '透視表',
table_pivot_row: '數據行' table_pivot_row: '數據行',
field_error_tips: '該字段所對應的數據集原始字段發生變更（包括維度、指標，字段類型，字段被刪除等），建議重新編輯'
}, },
dataset: { dataset: {
sheet_warn: '有多個 Sheet 頁，默認抽取第一個', sheet_warn: '有多個 Sheet 頁，默認抽取第一個',
......
frontend/src/lang/zh.js
浏览文件 @ ef332c76
...@@ -1024,7 +1024,8 @@ export default { ...@@ -1024,7 +1024,8 @@ export default {
table_column_adapt: '自适应', table_column_adapt: '自适应',
table_column_custom: '自定义', table_column_custom: '自定义',
chart_table_pivot: '透视表', chart_table_pivot: '透视表',
table_pivot_row: '数据行' table_pivot_row: '数据行',
field_error_tips: '该字段所对应的数据集原始字段发生变更（包括维度、指标，字段类型，字段被删除等），建议重新编辑'
}, },
dataset: { dataset: {
sheet_warn: '有多个 Sheet 页，默认抽取第一个', sheet_warn: '有多个 Sheet 页，默认抽取第一个',
......
frontend/src/views/chart/components/drag-item/ChartDragItem.vue
浏览文件 @ ef332c76
<template> <template>
<span> <span>
<el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -10,6 +10,7 @@ ...@@ -10,6 +10,7 @@
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" /> <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
<span v-if="item.summary" class="summary-span">{{ $t('chart.'+item.summary) }}</span> <span v-if="item.summary" class="summary-span">{{ $t('chart.'+item.summary) }}</span>
<span v-if="item.deType === 1" class="summary-span"> <span v-if="item.deType === 1" class="summary-span">
{{ $t('chart.' + item.dateStyle) }} {{ $t('chart.' + item.dateStyle) }}
...@@ -17,7 +18,7 @@ ...@@ -17,7 +18,7 @@
</el-tag> </el-tag>
<el-dropdown v-else trigger="click" size="mini" @command="clickItem"> <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
<el-tag size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -27,6 +28,7 @@ ...@@ -27,6 +28,7 @@
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" /> <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
<span v-if="item.summary" class="summary-span">{{ $t('chart.'+item.summary) }}</span> <span v-if="item.summary" class="summary-span">{{ $t('chart.'+item.summary) }}</span>
<span v-if="item.deType === 1" class="summary-span"> <span v-if="item.deType === 1" class="summary-span">
{{ $t('chart.' + item.dateStyle) }} {{ $t('chart.' + item.dateStyle) }}
...@@ -120,8 +122,12 @@ ...@@ -120,8 +122,12 @@
</template> </template>
<script> <script>
import { getItemType } from '@/views/chart/components/drag-item/utils'
import FieldErrorTips from '@/views/chart/components/drag-item/components/FieldErrorTips'
export default { export default {
name: 'ChartDragItem', name: 'ChartDragItem',
components: { FieldErrorTips },
props: { props: {
param: { param: {
type: Object, type: Object,
...@@ -138,10 +144,30 @@ export default { ...@@ -138,10 +144,30 @@ export default {
conf: { conf: {
type: String, type: String,
required: true required: true
},
dimensionData: {
type: Array,
required: true
},
quotaData: {
type: Array,
required: true
} }
}, },
data() { data() {
return { return {
tagType: getItemType(this.dimensionData, this.quotaData, this.item)
}
},
watch: {
dimensionData: function() {
this.getItemTagType()
},
quotaData: function() {
this.getItemTagType()
},
item: function() {
this.getItemTagType()
} }
}, },
mounted() { mounted() {
...@@ -208,6 +234,9 @@ export default { ...@@ -208,6 +234,9 @@ export default {
return { return {
type: type type: type
} }
},
getItemTagType() {
this.tagType = getItemType(this.dimensionData, this.quotaData, this.item)
} }
} }
} }
......
frontend/src/views/chart/components/drag-item/DimensionExtItem.vue
浏览文件 @ ef332c76
<template> <template>
<span> <span>
<el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -10,13 +10,14 @@ ...@@ -10,13 +10,14 @@
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" /> <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
<span v-if="item.deType === 1" class="summary-span"> <span v-if="item.deType === 1" class="summary-span">
{{ $t('chart.' + item.dateStyle) }} {{ $t('chart.' + item.dateStyle) }}
</span> </span>
</el-tag> </el-tag>
<el-dropdown v-else trigger="click" size="mini" @command="clickItem"> <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
<el-tag size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -26,6 +27,7 @@ ...@@ -26,6 +27,7 @@
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" /> <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
<span v-if="item.deType === 1" class="summary-span"> <span v-if="item.deType === 1" class="summary-span">
{{ $t('chart.' + item.dateStyle) }} {{ $t('chart.' + item.dateStyle) }}
</span> </span>
...@@ -100,8 +102,12 @@ ...@@ -100,8 +102,12 @@
</template> </template>
<script> <script>
import { getItemType } from '@/views/chart/components/drag-item/utils'
import FieldErrorTips from '@/views/chart/components/drag-item/components/FieldErrorTips'
export default { export default {
name: 'DimensionExtItem', name: 'DimensionExtItem',
components: { FieldErrorTips },
props: { props: {
param: { param: {
type: Object, type: Object,
...@@ -114,10 +120,27 @@ export default { ...@@ -114,10 +120,27 @@ export default {
index: { index: {
type: Number, type: Number,
required: true required: true
},
dimensionData: {
type: Array,
required: true
},
quotaData: {
type: Array,
required: true
} }
}, },
data() { data() {
return { return {
tagType: getItemType(this.dimensionData, this.quotaData, this.item)
}
},
watch: {
dimensionData: function() {
this.getItemTagType()
},
item: function() {
this.getItemTagType()
} }
}, },
mounted() { mounted() {
...@@ -188,6 +211,9 @@ export default { ...@@ -188,6 +211,9 @@ export default {
this.item.index = this.index this.item.index = this.index
this.item.removeType = 'dimensionExt' this.item.removeType = 'dimensionExt'
this.$emit('onDimensionItemRemove', this.item) this.$emit('onDimensionItemRemove', this.item)
},
getItemTagType() {
this.tagType = getItemType(this.dimensionData, this.quotaData, this.item)
} }
} }
} }
......
frontend/src/views/chart/components/drag-item/DimensionItem.vue
浏览文件 @ ef332c76
<template> <template>
<span> <span>
<el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -10,13 +10,14 @@ ...@@ -10,13 +10,14 @@
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" /> <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
<span v-if="item.deType === 1" class="summary-span"> <span v-if="item.deType === 1" class="summary-span">
{{ $t('chart.' + item.dateStyle) }} {{ $t('chart.' + item.dateStyle) }}
</span> </span>
</el-tag> </el-tag>
<el-dropdown v-else trigger="click" size="mini" @command="clickItem"> <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
<el-tag size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -26,6 +27,7 @@ ...@@ -26,6 +27,7 @@
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" /> <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
<span v-if="item.deType === 1" class="summary-span"> <span v-if="item.deType === 1" class="summary-span">
{{ $t('chart.' + item.dateStyle) }} {{ $t('chart.' + item.dateStyle) }}
</span> </span>
...@@ -103,8 +105,12 @@ ...@@ -103,8 +105,12 @@
</template> </template>
<script> <script>
import { getItemType } from '@/views/chart/components/drag-item/utils'
import FieldErrorTips from '@/views/chart/components/drag-item/components/FieldErrorTips'
export default { export default {
name: 'DimensionItem', name: 'DimensionItem',
components: { FieldErrorTips },
props: { props: {
param: { param: {
type: Object, type: Object,
...@@ -117,10 +123,27 @@ export default { ...@@ -117,10 +123,27 @@ export default {
index: { index: {
type: Number, type: Number,
required: true required: true
},
dimensionData: {
type: Array,
required: true
},
quotaData: {
type: Array,
required: true
} }
}, },
data() { data() {
return { return {
tagType: getItemType(this.dimensionData, this.quotaData, this.item)
}
},
watch: {
dimensionData: function() {
this.getItemTagType()
},
item: function() {
this.getItemTagType()
} }
}, },
mounted() { mounted() {
...@@ -192,6 +215,9 @@ export default { ...@@ -192,6 +215,9 @@ export default {
this.item.index = this.index this.item.index = this.index
this.item.removeType = 'dimension' this.item.removeType = 'dimension'
this.$emit('onDimensionItemRemove', this.item) this.$emit('onDimensionItemRemove', this.item)
},
getItemTagType() {
this.tagType = getItemType(this.dimensionData, this.quotaData, this.item)
} }
} }
} }
......
frontend/src/views/chart/components/drag-item/DrillItem.vue
浏览文件 @ ef332c76
<template> <template>
<span> <span>
<el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -10,10 +10,11 @@ ...@@ -10,10 +10,11 @@
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" /> <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
</el-tag> </el-tag>
<el-dropdown v-else trigger="click" size="mini" @command="clickItem"> <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
<el-tag size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -23,6 +24,7 @@ ...@@ -23,6 +24,7 @@
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" /> <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
<i class="el-icon-arrow-down el-icon--right" style="position: absolute;top: 6px;right: 10px;" /> <i class="el-icon-arrow-down el-icon--right" style="position: absolute;top: 6px;right: 10px;" />
</el-tag> </el-tag>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
...@@ -36,8 +38,12 @@ ...@@ -36,8 +38,12 @@
</template> </template>
<script> <script>
import { getItemType } from '@/views/chart/components/drag-item/utils'
import FieldErrorTips from '@/views/chart/components/drag-item/components/FieldErrorTips'
export default { export default {
name: 'DrillItem', name: 'DrillItem',
components: { FieldErrorTips },
props: { props: {
param: { param: {
type: Object, type: Object,
...@@ -50,10 +56,30 @@ export default { ...@@ -50,10 +56,30 @@ export default {
index: { index: {
type: Number, type: Number,
required: true required: true
},
dimensionData: {
type: Array,
required: true
},
quotaData: {
type: Array,
required: true
} }
}, },
data() { data() {
return { return {
tagType: getItemType(this.dimensionData, this.quotaData, this.item)
}
},
watch: {
dimensionData: function() {
this.getItemTagType()
},
quotaData: function() {
this.getItemTagType()
},
item: function() {
this.getItemTagType()
} }
}, },
mounted() { mounted() {
...@@ -79,6 +105,9 @@ export default { ...@@ -79,6 +105,9 @@ export default {
removeItem() { removeItem() {
this.item.index = this.index this.item.index = this.index
this.$emit('onDimensionItemRemove', this.item) this.$emit('onDimensionItemRemove', this.item)
},
getItemTagType() {
this.tagType = getItemType(this.dimensionData, this.quotaData, this.item)
} }
} }
} }
......
frontend/src/views/chart/components/drag-item/FilterItem.vue
浏览文件 @ ef332c76
<template> <template>
<span> <span>
<el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -8,10 +8,11 @@ ...@@ -8,10 +8,11 @@
<svg-icon v-if="item.deType === 5" icon-class="field_location" class="field-icon-location" /> <svg-icon v-if="item.deType === 5" icon-class="field_location" class="field-icon-location" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
</el-tag> </el-tag>
<el-dropdown v-else trigger="click" size="mini" @command="clickItem"> <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
<el-tag size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -19,6 +20,7 @@ ...@@ -19,6 +20,7 @@
<svg-icon v-if="item.deType === 5" icon-class="field_location" class="field-icon-location" /> <svg-icon v-if="item.deType === 5" icon-class="field_location" class="field-icon-location" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
<i class="el-icon-arrow-down el-icon--right" style="position: absolute;top: 6px;right: 10px;" /> <i class="el-icon-arrow-down el-icon--right" style="position: absolute;top: 6px;right: 10px;" />
</el-tag> </el-tag>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
...@@ -35,8 +37,12 @@ ...@@ -35,8 +37,12 @@
</template> </template>
<script> <script>
import { getItemType } from '@/views/chart/components/drag-item/utils'
import FieldErrorTips from '@/views/chart/components/drag-item/components/FieldErrorTips'
export default { export default {
name: 'FilterItem', name: 'FilterItem',
components: { FieldErrorTips },
props: { props: {
param: { param: {
type: Object, type: Object,
...@@ -49,10 +55,30 @@ export default { ...@@ -49,10 +55,30 @@ export default {
index: { index: {
type: Number, type: Number,
required: true required: true
},
dimensionData: {
type: Array,
required: true
},
quotaData: {
type: Array,
required: true
} }
}, },
data() { data() {
return { return {
tagType: getItemType(this.dimensionData, this.quotaData, this.item)
}
},
watch: {
dimensionData: function() {
this.getItemTagType()
},
quotaData: function() {
this.getItemTagType()
},
item: function() {
this.getItemTagType()
} }
}, },
mounted() { mounted() {
...@@ -85,6 +111,9 @@ export default { ...@@ -85,6 +111,9 @@ export default {
removeItem() { removeItem() {
this.item.index = this.index this.item.index = this.index
this.$emit('onFilterItemRemove', this.item) this.$emit('onFilterItemRemove', this.item)
},
getItemTagType() {
this.tagType = getItemType(this.dimensionData, this.quotaData, this.item)
} }
} }
} }
......
frontend/src/views/chart/components/drag-item/QuotaExtItem.vue
浏览文件 @ ef332c76
<template> <template>
<span> <span>
<el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -13,13 +13,14 @@ ...@@ -13,13 +13,14 @@
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" /> <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
<span v-if="chart.type !== 'table-info' && item.summary" class="summary-span"> <span v-if="chart.type !== 'table-info' && item.summary" class="summary-span">
{{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc && item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span> {{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc && item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span>
</span> </span>
</el-tag> </el-tag>
<el-dropdown v-else trigger="click" size="mini" @command="clickItem"> <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
<el-tag size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -32,6 +33,7 @@ ...@@ -32,6 +33,7 @@
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" /> <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
<span v-if="chart.type !== 'table-info' && item.summary" class="summary-span"> <span v-if="chart.type !== 'table-info' && item.summary" class="summary-span">
{{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc && item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span> {{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc && item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span>
</span> </span>
...@@ -75,22 +77,6 @@ ...@@ -75,22 +77,6 @@
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
</el-dropdown-item> </el-dropdown-item>
<!-- 快速计算先隐藏-->
<!-- <el-dropdown-item v-if="item.id !== 'count'">-->
<!-- <el-dropdown placement="right-start" size="mini" style="width: 100%" @command="quickCalc">-->
<!-- <span class="el-dropdown-link inner-dropdown-menu">-->
<!-- <span>-->
<!-- <i class="el-icon-s-grid" />-->
<!-- <span>{{ $t('chart.quick_calc') }}</span>-->
<!-- <span class="summary-span-item">(无)</span>-->
<!-- </span>-->
<!-- <i class="el-icon-arrow-right el-icon&#45;&#45;right" />-->
<!-- </span>-->
<!-- <el-dropdown-menu slot="dropdown">-->
<!-- <el-dropdown-item :command="beforeQuickCalc('none')">无</el-dropdown-item>-->
<!-- </el-dropdown-menu>-->
<!-- </el-dropdown>-->
<!-- </el-dropdown-item>-->
<!--同比/环比--> <!--同比/环比-->
<el-dropdown-item v-show="chart.type !== 'table-info'"> <el-dropdown-item v-show="chart.type !== 'table-info'">
...@@ -144,9 +130,12 @@ ...@@ -144,9 +130,12 @@
<script> <script>
import { compareItem } from '@/views/chart/chart/compare' import { compareItem } from '@/views/chart/chart/compare'
import { getItemType } from '@/views/chart/components/drag-item/utils'
import FieldErrorTips from '@/views/chart/components/drag-item/components/FieldErrorTips'
export default { export default {
name: 'QuotaExtItem', name: 'QuotaExtItem',
components: { FieldErrorTips },
props: { props: {
param: { param: {
type: Object, type: Object,
...@@ -163,12 +152,21 @@ export default { ...@@ -163,12 +152,21 @@ export default {
chart: { chart: {
type: Object, type: Object,
required: true required: true
},
dimensionData: {
type: Array,
required: true
},
quotaData: {
type: Array,
required: true
} }
}, },
data() { data() {
return { return {
compareItem: compareItem, compareItem: compareItem,
disableEditCompare: false disableEditCompare: false,
tagType: getItemType(this.dimensionData, this.quotaData, this.item)
} }
}, },
watch: { watch: {
...@@ -177,6 +175,12 @@ export default { ...@@ -177,6 +175,12 @@ export default {
}, },
'chart.extStack': function() { 'chart.extStack': function() {
this.isEnableCompare() this.isEnableCompare()
},
quotaData: function() {
this.getItemTagType()
},
item: function() {
this.getItemTagType()
} }
}, },
mounted() { mounted() {
...@@ -296,6 +300,9 @@ export default { ...@@ -296,6 +300,9 @@ export default {
this.item.index = this.index this.item.index = this.index
this.item.calcType = 'quotaExt' this.item.calcType = 'quotaExt'
this.$emit('editItemCompare', this.item) this.$emit('editItemCompare', this.item)
},
getItemTagType() {
this.tagType = getItemType(this.dimensionData, this.quotaData, this.item)
} }
} }
} }
......
frontend/src/views/chart/components/drag-item/QuotaItem.vue
浏览文件 @ ef332c76
<template> <template>
<span> <span>
<el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag v-if="!hasDataPermission('manage',param.privileges)" size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -13,13 +13,14 @@ ...@@ -13,13 +13,14 @@
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" /> <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
<span v-if="chart.type !== 'table-info' && item.summary" class="summary-span"> <span v-if="chart.type !== 'table-info' && item.summary" class="summary-span">
{{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc && item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span> {{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc && item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span>
</span> </span>
</el-tag> </el-tag>
<el-dropdown v-else trigger="click" size="mini" @command="clickItem"> <el-dropdown v-else trigger="click" size="mini" @command="clickItem">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
<el-tag size="small" class="item-axis" :type="item.groupType === 'q'?'success':''"> <el-tag size="small" class="item-axis" :type="tagType">
<span style="float: left"> <span style="float: left">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" /> <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" /> <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
...@@ -32,6 +33,7 @@ ...@@ -32,6 +33,7 @@
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" /> <svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span> </span>
<span class="item-span-style" :title="item.name">{{ item.name }}</span> <span class="item-span-style" :title="item.name">{{ item.name }}</span>
<field-error-tips v-if="tagType === 'danger'" />
<span v-if="chart.type !== 'table-info' && item.summary" class="summary-span"> <span v-if="chart.type !== 'table-info' && item.summary" class="summary-span">
{{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc && item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span> {{ $t('chart.' + item.summary) }}<span v-if="item.compareCalc && item.compareCalc.type && item.compareCalc.type !== '' && item.compareCalc.type !== 'none'">-{{ $t('chart.' + item.compareCalc.type) }}</span>
</span> </span>
...@@ -75,22 +77,6 @@ ...@@ -75,22 +77,6 @@
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
</el-dropdown-item> </el-dropdown-item>
<!-- 快速计算先隐藏-->
<!-- <el-dropdown-item v-if="item.id !== 'count'">-->
<!-- <el-dropdown placement="right-start" size="mini" style="width: 100%" @command="quickCalc">-->
<!-- <span class="el-dropdown-link inner-dropdown-menu">-->
<!-- <span>-->
<!-- <i class="el-icon-s-grid" />-->
<!-- <span>{{ $t('chart.quick_calc') }}</span>-->
<!-- <span class="summary-span-item">(无)</span>-->
<!-- </span>-->
<!-- <i class="el-icon-arrow-right el-icon&#45;&#45;right" />-->
<!-- </span>-->
<!-- <el-dropdown-menu slot="dropdown">-->
<!-- <el-dropdown-item :command="beforeQuickCalc('none')">无</el-dropdown-item>-->
<!-- </el-dropdown-menu>-->
<!-- </el-dropdown>-->
<!-- </el-dropdown-item>-->
<!--同比/环比--> <!--同比/环比-->
<el-dropdown-item v-show="chart.type !== 'table-info'"> <el-dropdown-item v-show="chart.type !== 'table-info'">
...@@ -144,9 +130,12 @@ ...@@ -144,9 +130,12 @@
<script> <script>
import { compareItem } from '@/views/chart/chart/compare' import { compareItem } from '@/views/chart/chart/compare'
import { getItemType } from '@/views/chart/components/drag-item/utils'
import FieldErrorTips from '@/views/chart/components/drag-item/components/FieldErrorTips'
export default { export default {
name: 'QuotaItem', name: 'QuotaItem',
components: { FieldErrorTips },
props: { props: {
param: { param: {
type: Object, type: Object,
...@@ -163,17 +152,32 @@ export default { ...@@ -163,17 +152,32 @@ export default {
chart: { chart: {
type: Object, type: Object,
required: true required: true
},
dimensionData: {
type: Array,
required: true
},
quotaData: {
type: Array,
required: true
} }
}, },
data() { data() {
return { return {
compareItem: compareItem, compareItem: compareItem,
disableEditCompare: false disableEditCompare: false,
tagType: getItemType(this.dimensionData, this.quotaData, this.item)
} }
}, },
watch: { watch: {
'chart': function() { 'chart': function() {
this.isEnableCompare() this.isEnableCompare()
},
quotaData: function() {
this.getItemTagType()
},
item: function() {
this.getItemTagType()
} }
}, },
mounted() { mounted() {
...@@ -293,6 +297,9 @@ export default { ...@@ -293,6 +297,9 @@ export default {
this.item.index = this.index this.item.index = this.index
this.item.calcType = 'quota' this.item.calcType = 'quota'
this.$emit('editItemCompare', this.item) this.$emit('editItemCompare', this.item)
},
getItemTagType() {
this.tagType = getItemType(this.dimensionData, this.quotaData, this.item)
} }
} }
} }
......
frontend/src/views/chart/components/drag-item/components/FieldErrorTips.vue 0 → 100644
浏览文件 @ ef332c76
<template>
<div class="tips-class">
<el-tooltip class="item" effect="dark" :content="$t('chart.field_error_tips')" placement="bottom">
<span><i class="el-icon-warning" /></span>
</el-tooltip>
</div>
</template>
<script>
export default {
name: 'FieldErrorTips'
}
</script>
<style scoped>
.tips-class{
position: absolute;
right: 10px;
z-index: 10;
}
</style>
frontend/src/views/chart/components/drag-item/utils.js 0 → 100644
浏览文件 @ ef332c76
export function getItemType(dimensionData, quotaData, item) {
// 将item的字段在数据集维度、指标字段中查询一遍，如果遇到id不存在、字段类型不一致、维度指标不一致，则提示
const status = item.groupType
let checked = false
if (status === 'd') {
for (let i = 0; i < dimensionData.length; i++) {
const ele = dimensionData[i]
if (ele.id === item.id && ele.deType === item.deType && ele.groupType === item.groupType) {
checked = true
break
}
}
}
if (status === 'q') {
for (let i = 0; i < quotaData.length; i++) {
const ele = quotaData[i]
if (ele.id === item.id && ele.deType === item.deType && ele.groupType === item.groupType) {
checked = true
break
}
}
}
if (checked) {
if (status === 'd') {
return ''
} else if (status === 'q') {
return 'success'
}
} else {
return 'danger'
}
}
frontend/src/views/chart/view/ChartEdit.vue
浏览文件 @ ef332c76
...@@ -271,6 +271,8 @@ ...@@ -271,6 +271,8 @@
:param="param" :param="param"
:index="index" :index="index"
:item="item" :item="item"
:dimension-data="dimensionData"
:quota-data="quotaData"
@onDimensionItemChange="dimensionItemChange" @onDimensionItemChange="dimensionItemChange"
@onDimensionItemRemove="dimensionItemRemove" @onDimensionItemRemove="dimensionItemRemove"
@editItemFilter="showDimensionEditFilter" @editItemFilter="showDimensionEditFilter"
...@@ -323,6 +325,8 @@ ...@@ -323,6 +325,8 @@
:param="param" :param="param"
:index="index" :index="index"
:item="item" :item="item"
:dimension-data="dimensionData"
:quota-data="quotaData"
@onDimensionItemChange="dimensionItemChange" @onDimensionItemChange="dimensionItemChange"
@onDimensionItemRemove="dimensionItemRemove" @onDimensionItemRemove="dimensionItemRemove"
@editItemFilter="showDimensionEditFilter" @editItemFilter="showDimensionEditFilter"
...@@ -376,6 +380,8 @@ ...@@ -376,6 +380,8 @@
:index="index" :index="index"
:item="item" :item="item"
:chart="chart" :chart="chart"
:dimension-data="dimensionData"
:quota-data="quotaData"
@onQuotaItemChange="quotaItemChange" @onQuotaItemChange="quotaItemChange"
@onQuotaItemRemove="quotaItemRemove" @onQuotaItemRemove="quotaItemRemove"
@editItemFilter="showQuotaEditFilter" @editItemFilter="showQuotaEditFilter"
...@@ -413,6 +419,8 @@ ...@@ -413,6 +419,8 @@
:index="index" :index="index"
:item="item" :item="item"
:chart="chart" :chart="chart"
:dimension-data="dimensionData"
:quota-data="quotaData"
@onQuotaItemChange="quotaItemChange" @onQuotaItemChange="quotaItemChange"
@onQuotaItemRemove="quotaItemRemove" @onQuotaItemRemove="quotaItemRemove"
@editItemFilter="showQuotaEditFilter" @editItemFilter="showQuotaEditFilter"
...@@ -450,6 +458,8 @@ ...@@ -450,6 +458,8 @@
:param="param" :param="param"
:index="index" :index="index"
:item="item" :item="item"
:dimension-data="dimensionData"
:quota-data="quotaData"
@onItemChange="stackItemChange" @onItemChange="stackItemChange"
@onItemRemove="stackItemRemove" @onItemRemove="stackItemRemove"
/> />
...@@ -490,6 +500,8 @@ ...@@ -490,6 +500,8 @@
:param="param" :param="param"
:index="index" :index="index"
:item="item" :item="item"
:dimension-data="dimensionData"
:quota-data="quotaData"
@onItemChange="bubbleItemChange" @onItemChange="bubbleItemChange"
@onItemRemove="bubbleItemRemove" @onItemRemove="bubbleItemRemove"
/> />
...@@ -522,6 +534,8 @@ ...@@ -522,6 +534,8 @@
:param="param" :param="param"
:index="index" :index="index"
:item="item" :item="item"
:dimension-data="dimensionData"
:quota-data="quotaData"
@onFilterItemRemove="filterItemRemove" @onFilterItemRemove="filterItemRemove"
@editItemFilter="showEditFilter" @editItemFilter="showEditFilter"
/> />
...@@ -558,6 +572,8 @@ ...@@ -558,6 +572,8 @@
:param="param" :param="param"
:index="index" :index="index"
:item="item" :item="item"
:dimension-data="dimensionData"
:quota-data="quotaData"
@onDimensionItemChange="drillItemChange" @onDimensionItemChange="drillItemChange"
@onDimensionItemRemove="drillItemRemove" @onDimensionItemRemove="drillItemRemove"
/> />
...@@ -568,7 +584,6 @@ ...@@ -568,7 +584,6 @@
</div> </div>
</el-row> </el-row>
</div> </div>
</el-row> </el-row>
</div> </div>
</el-col> </el-col>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论