Merge branch 'dev' of github.com:dataease/dataease into dev

This commit is contained in:
taojinlong 2022-02-22 11:51:53 +08:00
commit a753e4e66c
16 changed files with 303 additions and 146 deletions

View File

@ -10,19 +10,16 @@
<select id="searchOneWithPrivileges" resultMap="BaseResultMapDTO">
select
chart_view.*,
get_auths(id,'chart',#{userId}) as `privileges`
chart_view.*
from chart_view where id = #{id}
</select>
<select id="searchOne" resultMap="BaseResultMapDTO">
select
id, `name`, scene_id, table_id, `type`, title, create_by, create_time, update_time,
style_priority,x_axis, y_axis, custom_attr, custom_style, custom_filter, snapshot,
get_auths(id,'chart',#{userId}) as `privileges`
from (select GET_V_AUTH_MODEL_ID_P_USE (#{userId}, 'chart') cids) t,chart_view
style_priority,x_axis, y_axis, custom_attr, custom_style, custom_filter, snapshot
from chart_view
<where>
FIND_IN_SET(chart_view.id,cids)
<if test="sceneId != null">
and scene_id = #{sceneId,jdbcType=VARCHAR}
</if>
@ -94,6 +91,7 @@
`type`,
`title`,
`x_axis`,
`x_axis_ext`,
`y_axis`,
`custom_attr`,
`custom_style`,
@ -119,6 +117,7 @@
`type`,
GET_CHART_VIEW_COPY_NAME ( #{oldChartId} ),
`x_axis`,
`x_axis_ext`,
`y_axis`,
`custom_attr`,
`custom_style`,

View File

@ -130,9 +130,5 @@ public class ChartGroupService {
if (ObjectUtils.isNotEmpty(chartGroup.getLevel())) {
criteria.andLevelEqualTo(chartGroup.getLevel());
}
List<ChartGroup> list = chartGroupMapper.selectByExample(chartGroupExample);
if (list.size() > 0) {
throw new RuntimeException(Translator.get("i18n_name_cant_repeat_same_group"));
}
}
}

View File

@ -1656,10 +1656,6 @@ public class ChartViewService {
if (StringUtils.isNotEmpty(chartView.getName())) {
criteria.andNameEqualTo(chartView.getName());
}
List<ChartViewWithBLOBs> list = chartViewMapper.selectByExampleWithBLOBs(chartViewExample);
if (list.size() > 0) {
throw new RuntimeException(Translator.get("i18n_name_cant_repeat_same_group"));
}
}
public ChartDetail getChartDetail(String id) {

View File

@ -74,11 +74,12 @@ public class PanelViewService {
@Transactional(propagation=Propagation.REQUIRES_NEW)
public Boolean syncPanelViews(PanelGroupWithBLOBs panelGroup){
Boolean mobileLayout = false;
Boolean mobileLayout = null;
String panelId = panelGroup.getId();
Assert.notNull(panelId, "panelId cannot be null");
String panelData = panelGroup.getPanelData();
if(StringUtils.isNotEmpty(panelData)){
mobileLayout = false;
JSONArray dataArray = JSON.parseArray(panelData);
List<PanelViewInsertDTO> panelViewInsertDTOList = new ArrayList<>();
for(int i=0;i<dataArray.size();i++){

View File

@ -126,7 +126,8 @@ export default {
'targetLinkageInfo',
'mobileLayoutStatus',
'mobileComponentData',
'componentDataCache'
'componentDataCache',
'styleChangeTimes'
])
},
created() {

View File

@ -8,6 +8,7 @@
'rect-shape'
]"
>
<div :style="componentBackGround">
<EditBarView v-if="editBarViewShowFlag" :is-edit="isEdit" :view-id="element.propValue.viewId" @showViewDetails="openChartDetailsDialog" />
<div v-if="requestStatus==='error'" class="chart-error-class">
<div class="chart-error-message-class">
@ -66,6 +67,7 @@
<drill-path :drill-filters="drillFilters" @onDrillJump="drillJump" />
</div>
</div>
</div>
</template>
<script>
@ -90,6 +92,7 @@ import EditBarView from '@/components/canvas/components/Editor/EditBarView'
import { customAttrTrans, customStyleTrans, recursionTransObj } from '@/components/canvas/utils/style'
import ChartComponentS2 from '@/views/chart/components/ChartComponentS2'
import PluginCom from '@/views/system/plugin/PluginCom'
import { hexColorToRGBA } from '@/views/chart/chart/util'
export default {
name: 'UserView',
components: { PluginCom, ChartComponentS2, EditBarView, ChartComponent, TableNormal, LabelNormal, DrillPath, ChartComponentG2 },
@ -166,6 +169,31 @@ export default {
},
computed: {
//
componentBackGround() {
const customStyle = JSON.parse(this.chart.customStyle)
let style = {
height: '100%',
width: '100%',
backgroundSize: '100% 100% !important',
borderRadius: '0px'
}
if (customStyle && customStyle.background) {
style.borderRadius = customStyle.background.borderRadius + 'px!important'
if (customStyle.background.backgroundType === 'outImage' && typeof (customStyle.background.outImage) === 'string') {
style = {
background: `url(${customStyle.background.outImage}) no-repeat`,
...style
}
} else if (!customStyle.background.backgroundType || customStyle.background.backgroundType === 'color') {
style = {
background: hexColorToRGBA(customStyle.background.color, customStyle.background.alpha),
...style
}
}
}
return style
},
scaleCoefficient() {
if (this.terminal === 'pc' && !this.mobileLayoutStatus) {
return 1.1

View File

@ -1,3 +1,8 @@
import {ApplicationContext} from "@/utils/ApplicationContext";
import {BASE_MOBILE_STYLE, HYPERLINKS} from "@/components/canvas/custom-component/component-list";
import store from "@/store";
import {deepCopy, resetID} from "@/components/canvas/utils/utils";
export const DEFAULT_COLOR_CASE = {
value: 'default',
colors: ['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc'],
@ -192,7 +197,10 @@ export const DEFAULT_YAXIS_EXT_STYLE = {
}
}
export const DEFAULT_BACKGROUND_COLOR = {
backgroundType: 'color',
color: '#ffffff',
outImage: null,
innerImage: null,
alpha: 100,
borderRadius: 5
}

View File

@ -174,7 +174,7 @@ export function componentStyle(chart_option, chart) {
chart_option.radar.splitArea = customStyle.split.splitArea
}
if (customStyle.background) {
chart_option.backgroundColor = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha)
// chart_option.backgroundColor = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha)
}
}
}

View File

@ -40,7 +40,7 @@ export function getTheme(chart) {
customStyle = JSON.parse(chart.customStyle)
// bg
if (customStyle.background) {
bgColor = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha)
// bgColor = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha)
}
// legend
if (customStyle.legend) {

View File

@ -7,7 +7,7 @@
:style="trackBarStyleTime"
@trackClick="trackClick"
/>
<div :id="chartId" style="width: 100%;height: 100%;overflow: hidden;" :style="{ borderRadius: borderRadius}" />
<div :id="chartId" style="width: 100%;height: 100%;overflow: hidden;" />
<div v-if="chart.type === 'map'" class="map-zoom-box">
<div style="margin-bottom: 0.5em;">
<el-button size="mini" icon="el-icon-plus" circle @click="roamMap(true)" />

View File

@ -87,7 +87,7 @@ export default {
},
bg_class() {
return {
borderRadius: this.borderRadius
// borderRadius: this.borderRadius
}
}
},

View File

@ -1,10 +1,10 @@
<template>
<div ref="chartContainer" style="padding: 0;width: 100%;height: 100%;overflow: hidden;" :style="bg_class">
<div ref="chartContainer" style="padding: 0;width: 100%;height: 100%;overflow: hidden;">
<view-track-bar ref="viewTrack" :track-menu="trackMenu" class="track-bar" :style="trackBarStyleTime" @trackClick="trackClick" />
<span v-if="chart.type" v-show="title_show" ref="title" :style="title_class" style="cursor: default;display: block;">
<p style="padding:6px 10px 0 10px;margin: 0;overflow: hidden;white-space: pre;text-overflow: ellipsis;">{{ chart.title }}</p>
</span>
<div ref="tableContainer" style="width: 100%;overflow: hidden;padding: 8px;" :style="{background:container_bg_class.background}">
<div ref="tableContainer" style="width: 100%;overflow: hidden;padding: 8px;">
<div v-if="chart.type === 'table-normal'" :id="chartId" style="width: 100%;overflow: hidden;" :class="chart.drill ? 'table-dom-normal-drill' : 'table-dom-normal'" />
<div v-if="chart.type === 'table-info'" :id="chartId" style="width: 100%;overflow: hidden;" :class="chart.drill ? 'table-dom-info-drill' : 'table-dom-info'" />
<div v-if="chart.type === 'table-pivot'" :id="chartId" style="width: 100%;overflow: hidden;" class="table-dom-normal" />
@ -109,7 +109,6 @@ export default {
},
bg_class() {
return {
borderRadius: this.borderRadius
}
}
},
@ -259,12 +258,7 @@ export default {
}
},
setBackGroundBorder() {
if (this.chart.customStyle) {
const customStyle = JSON.parse(this.chart.customStyle)
if (customStyle.background) {
this.borderRadius = (customStyle.background.borderRadius || 0) + 'px'
}
}
},
chartResize() {
this.initData()
@ -325,12 +319,6 @@ export default {
this.$refs.title.style.fontSize = customStyle.text.fontSize + 'px'
}
}
if (customStyle.background) {
this.title_class.background = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha)
this.borderRadius = (customStyle.background.borderRadius || 0) + 'px'
this.container_bg_class.background = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha)
}
}
},

View File

@ -1,24 +1,74 @@
<template>
<div style="width: 100%">
<el-col>
<el-form ref="colorForm" :model="colorForm" label-width="80px" size="mini">
<el-form-item :label="$t('chart.color')" class="form-item">
<el-color-picker v-model="colorForm.color" class="color-picker-style" :predefine="predefineColors" @change="changeBackgroundStyle" />
</el-form-item>
<el-form-item :label="$t('chart.not_alpha')" class="form-item form-item-slider">
<el-slider v-model="colorForm.alpha" show-input :show-input-controls="false" input-size="mini" @change="changeBackgroundStyle" />
</el-form-item>
<el-form-item :label="$t('chart.border_radius')" class="form-item form-item-slider">
<el-slider v-model="colorForm.borderRadius" show-input :show-input-controls="false" input-size="mini" @change="changeBackgroundStyle" />
</el-form-item>
</el-form>
<el-row>
<el-col :span="5" class="col-label-item">
<el-radio v-model="colorForm.backgroundType" label="color" @change="changeBackgroundStyle"><span class="label-item">{{ $t('chart.color') }}</span></el-radio>
</el-col>
<el-col :span="19">
<el-color-picker v-model="colorForm.color" :predefine="predefineColors" size="mini" style="cursor: pointer;z-index: 1004;" @change="changeBackgroundStyle" />
</el-col>
</el-row>
<el-row style="height: 60px;margin-top:10px;overflow: hidden">
<el-col :span="5" class="col-label-item">
<el-radio v-model="colorForm.backgroundType" label="outImage" @change="changeBackgroundStyle"><span class="label-item">{{ $t('panel.photo') }}</span></el-radio>
</el-col>
<el-col :span="9">
<el-upload
action=""
accept=".jpeg,.jpg,.png,.gif,.svg"
class="avatar-uploader"
list-type="picture-card"
:class="{disabled:uploadDisabled}"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
:file-list="fileList"
:on-change="onChange"
:http-request="upload"
>
<i class="el-icon-plus" />
</el-upload>
<el-dialog top="25vh" width="600px" :modal-append-to-body="false" :visible.sync="dialogVisible">
<img width="100%" :src="dialogImageUrl" alt="">
</el-dialog>
</el-col>
</el-row>
<el-row>
<el-col :span="5" class="col-label-item">
<span class="label-item">{{ $t('chart.border_radius') }}</span>
</el-col>
<el-col :span="19">
<el-slider v-model="colorForm.borderRadius" show-input :show-input-controls="false" input-size="mini" @change="changeBackgroundStyle" />
</el-col>
</el-row>
<el-row v-if="colorForm.backgroundType==='color'">
<el-col :span="5" class="col-label-item">
<span class="label-item">{{ $t('chart.not_alpha') }}</span>
</el-col>
<el-col :span="19">
<el-slider v-model="colorForm.alpha" show-input :show-input-controls="false" input-size="mini" @change="changeBackgroundStyle" />
</el-col>
</el-row>
</el-col>
<!-- <el-form ref="colorForm" :model="colorForm" label-width="80px" size="mini" :disabled="param && !hasDataPermission('manage',param.privileges)">-->
<!-- &lt;!&ndash; <el-form-item :label="$t('chart.color')" class="form-item">&ndash;&gt;-->
<!-- &lt;!&ndash; <el-color-picker v-model="colorForm.color" class="color-picker-style" :predefine="predefineColors" @change="changeBackgroundStyle" />&ndash;&gt;-->
<!-- &lt;!&ndash; </el-form-item>&ndash;&gt;-->
<!-- <el-form-item :label="$t('chart.not_alpha')" class="form-item form-item-slider">-->
<!-- <el-slider v-model="colorForm.alpha" show-input :show-input-controls="false" input-size="mini" @change="changeBackgroundStyle" />-->
<!-- </el-form-item>-->
<!-- <el-form-item :label="$t('chart.border_radius')" class="form-item form-item-slider">-->
<!-- <el-slider v-model="colorForm.borderRadius" show-input :show-input-controls="false" input-size="mini" @change="changeBackgroundStyle" />-->
<!-- </el-form-item>-->
<!-- </el-form>-->
<!-- </el-col>-->
</div>
</template>
<script>
import { COLOR_PANEL, DEFAULT_BACKGROUND_COLOR } from '../../chart/chart'
import { deepCopy } from '@/components/canvas/utils/utils'
export default {
name: 'BackgroundColorSelector',
@ -34,6 +84,10 @@ export default {
},
data() {
return {
fileList: [],
dialogImageUrl: '',
dialogVisible: false,
uploadDisabled: false,
colorForm: JSON.parse(JSON.stringify(DEFAULT_BACKGROUND_COLOR)),
predefineColors: COLOR_PANEL
}
@ -62,41 +116,117 @@ export default {
customStyle = JSON.parse(chart.customStyle)
}
if (customStyle.background) {
debugger
this.colorForm = customStyle.background
this.colorForm.backgroundType = this.colorForm.backgroundType || 'color'
if (this.colorForm.outImage && typeof (this.colorForm.outImage) === 'string') {
this.fileList.push({ url: this.colorForm.outImage })
}
}
}
},
onChangeType() {
this.changeBackgroundStyle()
},
handleRemove(file, fileList) {
this.uploadDisabled = false
this.colorForm.outImage = null
this.fileList = []
this.changeBackgroundStyle()
},
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url
this.dialogVisible = true
},
onChange(file, fileList) {
var _this = this
_this.uploadDisabled = true
const reader = new FileReader()
reader.onload = function() {
_this.colorForm.outImage = reader.result
_this.changeBackgroundStyle()
}
this.$store.state.styleChangeTimes++
reader.readAsDataURL(file.raw)
},
upload(file) {
// console.log('this is upload')
}
}
}
</script>
<style scoped>
.shape-item{
.shape-item{
padding: 6px;
border: none;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
}
.form-item-slider>>>.el-form-item__label{
}
.form-item-slider>>>.el-form-item__label{
font-size: 12px;
line-height: 38px;
}
.form-item>>>.el-form-item__label{
}
.form-item>>>.el-form-item__label{
font-size: 12px;
}
.el-select-dropdown__item{
}
.el-select-dropdown__item{
padding: 0 20px;
}
}
span{
font-size: 12px
}
.el-form-item{
margin-bottom: 6px;
}
.color-picker-style{
.color-picker-style{
cursor: pointer;
z-index: 1003;
}
}
.avatar-uploader>>>.el-upload {
width: 100px;
height: 60px;
line-height: 70px;
}
.avatar-uploader>>>.el-upload-list li{
width: 100px !important;
height: 60px !important;
}
.disabled>>>.el-upload--picture-card {
display: none;
}
.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;
}
.label-item{
font-size: 12px;
font-weight: bold;
}
.col-label-item{
text-align: right;
padding-right: 10px;
}
</style>

View File

@ -161,7 +161,7 @@ export default {
this.title_class.fontWeight = customStyle.text.isBolder ? 'bold' : 'normal'
}
if (customStyle.background) {
this.bg_class.background = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha)
// this.bg_class.background = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha)
}
}
},

View File

@ -1,5 +1,5 @@
<template>
<div ref="tableContainer" :style="bg_class" style="padding: 8px;width: 100%;height: 100%;overflow: hidden;">
<div ref="tableContainer" style="padding: 8px;width: 100%;height: 100%;overflow: hidden;">
<el-row style="height: 100%;">
<p v-show="title_show" ref="title" :style="title_class">{{ chart.title }}</p>
<ux-grid
@ -124,8 +124,6 @@ export default {
computed: {
bg_class() {
return {
background: hexColorToRGBA('#ffffff', 0),
borderRadius: this.borderRadius
}
}
},

View File

@ -46,7 +46,6 @@
/>
<el-button
:title="$t('chart.change_ds')"
:disabled="!hasDataPermission('manage',param.privileges)"
icon="el-icon-refresh"
type="text"
size="mini"
@ -62,7 +61,6 @@
animation="300"
:move="onMove"
class="drag-list"
:disabled="!hasDataPermission('manage',param.privileges)"
@add="moveToDimension"
>
<transition-group>
@ -88,7 +86,6 @@
animation="300"
:move="onMove"
class="drag-list"
:disabled="!hasDataPermission('manage',param.privileges)"
@add="moveToQuota"
>
<transition-group>
@ -157,7 +154,6 @@
<el-radio-group
v-model="view.type"
style="width: 100%"
:disabled="!hasDataPermission('manage',param.privileges)"
@change="changeChartType()"
>
<chart-type ref="cu-chart-type" :chart="view" style="height: 480px" />
@ -182,7 +178,6 @@
slot="reference"
size="mini"
style="padding: 6px;"
:disabled="!hasDataPermission('manage',param.privileges)"
>
{{ $t('chart.change_chart_type') }}
<i class="el-icon-caret-bottom" />
@ -202,7 +197,6 @@
<el-radio-group
v-model="view.resultMode"
class="radio-span"
:disabled="!hasDataPermission('manage',param.privileges)"
size="mini"
@change="calcData"
>
@ -212,7 +206,6 @@
v-model="view.resultCount"
class="result-count"
size="mini"
:disabled="!hasDataPermission('manage',param.privileges)"
@change="calcData"
/>
</el-radio>
@ -237,7 +230,6 @@
:no-children-text="$t('commons.treeselect.no_children_text')"
:no-options-text="$t('commons.treeselect.no_options_text')"
:no-results-text="$t('commons.treeselect.no_results_text')"
:disabled="!hasDataPermission('manage',param.privileges)"
@input="calcData"
@deselect="calcData"
/>
@ -256,7 +248,6 @@
</span>
<draggable
v-model="view.xaxisExt"
:disabled="!hasDataPermission('manage',param.privileges)"
group="drag"
animation="300"
:move="onMove"
@ -310,7 +301,6 @@
</span>
<draggable
v-model="view.xaxis"
:disabled="!hasDataPermission('manage',param.privileges)"
group="drag"
animation="300"
:move="onMove"
@ -364,7 +354,6 @@
</span>
<draggable
v-model="view.yaxis"
:disabled="!hasDataPermission('manage',param.privileges)"
group="drag"
animation="300"
:move="onMove"
@ -403,7 +392,6 @@
</span>
<draggable
v-model="view.yaxisExt"
:disabled="!hasDataPermission('manage',param.privileges)"
group="drag"
animation="300"
:move="onMove"
@ -442,7 +430,6 @@
</span>
<draggable
v-model="view.extStack"
:disabled="!hasDataPermission('manage',param.privileges)"
group="drag"
animation="300"
:move="onMove"
@ -484,7 +471,6 @@
</span>
<draggable
v-model="view.extBubble"
:disabled="!hasDataPermission('manage',param.privileges)"
group="drag"
animation="300"
:move="onMove"
@ -518,7 +504,6 @@
<!-- </el-button>-->
<draggable
v-model="view.customFilter"
:disabled="!hasDataPermission('manage',param.privileges)"
group="drag"
animation="300"
:move="onMove"
@ -557,7 +542,6 @@
</span>
<draggable
v-model="view.drillFields"
:disabled="!hasDataPermission('manage',param.privileges)"
group="drag"
animation="300"
:move="onMove"
@ -609,7 +593,6 @@
<el-radio-group
v-model="view.stylePriority"
class="radio-span"
:disabled="!hasDataPermission('manage',param.privileges)"
size="mini"
@change="calcStyle"
>
@ -825,8 +808,8 @@
</el-tabs>
<el-col style="height: 100%;min-width: 500px;border-top: 1px solid #E6E6E6;">
<el-row style="width: 100%;height: 100%;" class="padding-lr">
<div ref="imageWrapper" style="height: 100%">
<el-row :style="componentBackGround" class="padding-lr">
<div ref="imageWrapper" style="height: 100%;">
<plugin-com
v-if="httpRequest.status && chart.type && view.isPlugin"
ref="dynamicChart"
@ -1064,6 +1047,7 @@ import { compareItem } from '@/views/chart/chart/compare'
import ChartComponentS2 from '@/views/chart/components/ChartComponentS2'
import DimensionExtItem from '@/views/chart/components/drag-item/DimensionExtItem'
import PluginCom from '@/views/system/plugin/PluginCom'
import { hexColorToRGBA } from '@/views/chart/chart/util'
export default {
name: 'ChartEdit',
components: {
@ -1206,6 +1190,32 @@ export default {
computed: {
chartType() {
return this.chart.type
},
//
componentBackGround() {
const customStyle = JSON.parse(JSON.stringify(this.view.customStyle))
let style = {
height: '100%',
width: '100%',
backgroundSize: '100% 100% !important'
}
debugger
if (customStyle && customStyle.background) {
style['borderRadius'] = customStyle.background.borderRadius + 'px'
if (customStyle.background.backgroundType === 'outImage' && typeof (customStyle.background.outImage) === 'string') {
style = {
background: `url(${customStyle.background.outImage}) no-repeat`,
...style
}
} else if (!customStyle.background.backgroundType || customStyle.background.backgroundType === 'color') {
style = {
background: hexColorToRGBA(customStyle.background.color, customStyle.background.alpha),
...style
}
}
}
return style
}
},
watch: {
@ -1233,6 +1243,7 @@ export default {
// this.initAreas()
},
mounted() {
debugger
this.bindPluginEvent()
// this.get(this.$store.state.chart.viewId);
this.getData(this.param.id)
@ -1531,6 +1542,7 @@ export default {
this.closeChangeChart()
//
if (this.$route.path.indexOf('panel') > -1) {
this.$store.commit('recordSnapshot')
bus.$emit('PanelSwitchComponent', { name: 'PanelEdit' })
}
this.$success(this.$t('commons.save_success'))