diff --git a/core/core-backend/src/main/java/io/dataease/visualization/server/DataVisualizationServer.java b/core/core-backend/src/main/java/io/dataease/visualization/server/DataVisualizationServer.java index 96175826df..1c7f630dfd 100644 --- a/core/core-backend/src/main/java/io/dataease/visualization/server/DataVisualizationServer.java +++ b/core/core-backend/src/main/java/io/dataease/visualization/server/DataVisualizationServer.java @@ -117,6 +117,11 @@ public class DataVisualizationServer implements DataVisualizationApi { DataVisualizationInfo visualizationInfo = new DataVisualizationInfo(); BeanUtils.copyBean(visualizationInfo, request); visualizationInfo.setNodeType(request.getNodeType() == null ? DataVisualizationConstants.NODE_TYPE.LEAF : request.getNodeType()); + if(request.getSelfWatermarkStatus() != null && request.getSelfWatermarkStatus()){ + visualizationInfo.setSelfWatermarkStatus(1); + }else{ + visualizationInfo.setSelfWatermarkStatus(0); + } Long newDvId = coreVisualizationManage.innerSave(visualizationInfo); //保存视图信 chartDataManage.saveChartViewFromVisualization(request.getComponentData(), newDvId, request.getCanvasViewInfo()); @@ -132,6 +137,11 @@ public class DataVisualizationServer implements DataVisualizationApi { } DataVisualizationInfo visualizationInfo = new DataVisualizationInfo(); BeanUtils.copyBean(visualizationInfo, request); + if(request.getSelfWatermarkStatus() != null && request.getSelfWatermarkStatus()){ + visualizationInfo.setSelfWatermarkStatus(1); + }else{ + visualizationInfo.setSelfWatermarkStatus(0); + } if(DataVisualizationConstants.RESOURCE_OPT_TYPE.COPY.equals(request.getOptType())){ // 复制更新 新建权限插入 visualizationInfoMapper.deleteById(dvId); diff --git a/core/core-frontend/src/components/data-visualization/canvas/CanvasCore.vue b/core/core-frontend/src/components/data-visualization/canvas/CanvasCore.vue index 7b0dfbff02..6111d2cb07 100644 --- a/core/core-frontend/src/components/data-visualization/canvas/CanvasCore.vue +++ b/core/core-frontend/src/components/data-visualization/canvas/CanvasCore.vue @@ -15,7 +15,7 @@ import MarkLine from './MarkLine.vue' import Area from './Area.vue' import eventBus from '@/utils/eventBus' import { changeStyleWithScale } from '@/utils/translate' -import { ref, onMounted, computed, toRefs, nextTick, onBeforeUnmount } from 'vue' +import { ref, onMounted, computed, toRefs, nextTick, onBeforeUnmount, watch } from 'vue' import { dvMainStoreWithOut } from '@/store/modules/data-visualization/dvMain' import { composeStoreWithOut } from '@/store/modules/data-visualization/compose' import { contextmenuStoreWithOut } from '@/store/modules/data-visualization/contextmenu' @@ -39,6 +39,8 @@ import { adaptCurThemeCommonStyle } from '@/utils/canvasStyle' import LinkageSet from '@/components/visualization/LinkageSet.vue' import PointShadow from '@/components/data-visualization/canvas/PointShadow.vue' import DragInfo from '@/components/visualization/common/DragInfo.vue' +import { activeWatermark } from '@/components/watermark/watermark' +import { personInfoApi } from '@/api/user' const snapshotStore = snapshotStoreWithOut() const dvMainStore = dvMainStoreWithOut() const composeStore = composeStoreWithOut() @@ -155,6 +157,7 @@ const props = defineProps({ default: true } }) +const userInfo = ref(null) const { baseWidth, @@ -192,6 +195,51 @@ const linkJumpRef = ref(null) const linkageRef = ref(null) const mainDomId = ref('editor-' + canvasId.value) +watch( + () => dvInfo.value, + () => { + initWatermark() + }, + { deep: true } +) + +watch( + () => canvasStyleData.value, + () => { + initWatermark() + }, + { deep: true } +) + +const initWatermark = (waterDomId = 'editor-canvas-main') => { + if (dvInfo.value.watermarkInfo && isMainCanvas(canvasId.value)) { + const scale = dashboardActive.value ? 1 : curScale.value + if (userInfo.value) { + activeWatermark( + dvInfo.value.watermarkInfo.settingContent, + userInfo.value, + waterDomId, + canvasId.value, + dvInfo.value.selfWatermarkStatus, + scale + ) + } else { + const method = personInfoApi + method().then(res => { + userInfo.value = res.data + activeWatermark( + dvInfo.value.watermarkInfo.settingContent, + userInfo.value, + waterDomId, + canvasId.value, + dvInfo.value.selfWatermarkStatus, + scale + ) + }) + } + } +} + const dragInfoShow = computed(() => { return ( dvInfo.value.type === 'dashboard' && @@ -942,6 +990,9 @@ const cellInit = () => { } const canvasSizeInit = () => { + if (isMainCanvas(canvasId.value)) { + initWatermark() + } cellInit() reCalcCellWidth() } @@ -1233,6 +1284,7 @@ const markLineShow = computed(() => isMainCanvas(canvasId.value)) onMounted(() => { if (isMainCanvas(canvasId.value)) { initSnapshotTimer() + initWatermark() } // 获取编辑器元素 composeStore.getEditor(canvasId.value) diff --git a/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue b/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue index 3fe0f5b403..a1423b3cda 100644 --- a/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue +++ b/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue @@ -188,7 +188,8 @@ const initWatermark = (waterDomId = 'preview-canvas-main') => { userInfo.value, waterDomId, canvasId.value, - dvInfo.value.watermarkOpen + dvInfo.value.selfWatermarkStatus, + scaleWidth.value / 100 ) } else { const method = personInfoApi @@ -199,7 +200,8 @@ const initWatermark = (waterDomId = 'preview-canvas-main') => { userInfo.value, waterDomId, canvasId.value, - dvInfo.value.watermarkOpen + dvInfo.value.selfWatermarkStatus, + scaleWidth.value / 100 ) }) } @@ -213,8 +215,8 @@ onMounted(() => { const erd = elementResizeDetectorMaker() erd.listenTo(document.getElementById(domId), () => { restore() + initWatermark() }) - initWatermark() }) onBeforeUnmount(() => { diff --git a/core/core-frontend/src/components/visualization/component-background/CanvasBackground.vue b/core/core-frontend/src/components/visualization/component-background/CanvasBackground.vue index 329de8b308..889862f618 100644 --- a/core/core-frontend/src/components/visualization/component-background/CanvasBackground.vue +++ b/core/core-frontend/src/components/visualization/component-background/CanvasBackground.vue @@ -14,6 +14,16 @@ @change="reUpload" /> + + + 水印 + + import { COLOR_PANEL } from '@/views/chart/components/editor/util/chart' -import { onMounted, reactive, ref, watch } from 'vue' +import { computed, onMounted, reactive, ref, watch } from 'vue' import { imgUrlTrans } from '@/utils/imgUtils' import { snapshotStoreWithOut } from '@/store/modules/data-visualization/snapshot' import { beforeUploadCheck, uploadFileResult } from '@/api/staticResource' @@ -123,7 +133,7 @@ const files = ref(null) const maxImageSize = 15000000 const dvMainStore = dvMainStoreWithOut() -const { canvasStyleData } = storeToRefs(dvMainStore) +const { canvasStyleData, dvInfo } = storeToRefs(dvMainStore) withDefaults( defineProps<{ @@ -145,6 +155,14 @@ const state = reactive({ predefineColors: COLOR_PANEL }) +const showWatermarkSetting = computed(() => { + return ( + dvInfo.value.watermarkInfo && + dvInfo.value.watermarkInfo?.settingContent?.enable && + dvInfo.value.watermarkInfo?.settingContent?.enablePanelCustom + ) +}) + const goFile = () => { files.value.click() } diff --git a/core/core-frontend/src/components/watermark/watermark.ts b/core/core-frontend/src/components/watermark/watermark.ts index 54f8557463..125e92ae10 100644 --- a/core/core-frontend/src/components/watermark/watermark.ts +++ b/core/core-frontend/src/components/watermark/watermark.ts @@ -145,7 +145,14 @@ export function getNow() { return time } -export function activeWatermark(watermarkForm, userLoginInfo, domId, canvasId, watermarkOpen) { +export function activeWatermark( + watermarkForm, + userLoginInfo, + domId, + canvasId, + selfWatermarkStatus, + scale = 1 +) { // 清理历史水印 const historyWatermarkDom = document.getElementById('de-watermark-server') if (historyWatermarkDom) { @@ -155,7 +162,7 @@ export function activeWatermark(watermarkForm, userLoginInfo, domId, canvasId, w !( canvasId === 'canvas-main' && ((watermarkForm.enable && !watermarkForm.enablePanelCustom) || - (watermarkForm.enable && watermarkOpen)) + (watermarkForm.enable && selfWatermarkStatus)) ) ) { return @@ -183,11 +190,11 @@ export function activeWatermark(watermarkForm, userLoginInfo, domId, canvasId, w } const settings = { watermark_txt: watermark_txt, - watermark_width: watermark_width, + watermark_width: watermark_width * scale, watermark_color: watermarkForm.watermark_color, - watermark_x_space: watermarkForm.watermark_x_space, - watermark_y_space: watermarkForm.watermark_y_space, - watermark_fontsize: watermarkForm.watermark_fontsize + 'px' + watermark_x_space: watermarkForm.watermark_x_space * scale, + watermark_y_space: watermarkForm.watermark_y_space * scale, + watermark_fontsize: watermarkForm.watermark_fontsize * scale + 'px' } watermark(settings, domId) } diff --git a/core/core-frontend/src/store/modules/data-visualization/dvMain.ts b/core/core-frontend/src/store/modules/data-visualization/dvMain.ts index dba7db38c1..0ed6f0c9ea 100644 --- a/core/core-frontend/src/store/modules/data-visualization/dvMain.ts +++ b/core/core-frontend/src/store/modules/data-visualization/dvMain.ts @@ -58,6 +58,7 @@ export const dvMainStore = defineStore('dataVisualization', { pid: null, status: null, selfWatermarkStatus: null, + watermarkInfo: {}, type: null }, // 图表信息 @@ -861,8 +862,8 @@ export const dvMainStore = defineStore('dataVisualization', { pid: null, status: null, selfWatermarkStatus: null, - type: null, - watermarkInfo: null + watermarkInfo: {}, + type: null } }, setViewDataDetails(viewId, dataInfo) { @@ -899,7 +900,8 @@ export const dvMainStore = defineStore('dataVisualization', { pid: pid, type: dvType, status: 1, - selfWatermarkStatus: 0 + selfWatermarkStatus: true, + watermarkInfo: {} } const canvasStyleDataNew = dvType === 'dashboard' @@ -921,6 +923,7 @@ export const dvMainStore = defineStore('dataVisualization', { pid: null, status: null, selfWatermarkStatus: null, + watermarkInfo: {}, type: null } this.canvasStyleData = { ...deepCopy(DEFAULT_CANVAS_STYLE_DATA_DARK), backgroundColor: null } diff --git a/core/core-frontend/src/utils/canvasUtils.ts b/core/core-frontend/src/utils/canvasUtils.ts index 0ea921e542..242edfa343 100644 --- a/core/core-frontend/src/utils/canvasUtils.ts +++ b/core/core-frontend/src/utils/canvasUtils.ts @@ -90,7 +90,7 @@ export function initCanvasDataPrepare(dvId, busiFlag, callBack) { name: canvasInfo.name, pid: canvasInfo.pid, status: canvasInfo.status, - watermarkOpen: canvasInfo.selfWatermarkStatus, + selfWatermarkStatus: canvasInfo.selfWatermarkStatus, type: canvasInfo.type, creatorName: canvasInfo.creatorName, updateName: canvasInfo.updateName, diff --git a/core/core-frontend/src/views/canvas/DeCanvas.vue b/core/core-frontend/src/views/canvas/DeCanvas.vue index 02b101b8b0..fbea5b1caa 100644 --- a/core/core-frontend/src/views/canvas/DeCanvas.vue +++ b/core/core-frontend/src/views/canvas/DeCanvas.vue @@ -11,6 +11,8 @@ import { getCanvasStyle, syncShapeItemStyle } from '@/utils/style' import { adaptCurThemeCommonStyle } from '@/utils/canvasStyle' import CanvasCore from '@/components/data-visualization/canvas/CanvasCore.vue' import { isMainCanvas } from '@/utils/canvasUtils' +import { activeWatermark } from '@/components/watermark/watermark' +import { personInfoApi } from '@/api/user' // change-begin const props = defineProps({ @@ -42,10 +44,11 @@ const domId = ref('de-canvas-' + canvasId.value) const dvMainStore = dvMainStoreWithOut() const snapshotStore = snapshotStoreWithOut() -const { pcMatrixCount, curOriginThemes } = storeToRefs(dvMainStore) +const { pcMatrixCount, curOriginThemes, dvInfo } = storeToRefs(dvMainStore) const canvasOut = ref(null) const canvasInner = ref(null) const canvasInitStatus = ref(false) +const userInfo = ref(null) const state = reactive({ screenWidth: 1920, @@ -59,6 +62,7 @@ const renderState = ref(false) // 仪表板默认 const baseMarginLeft = ref(0) const baseMarginTop = ref(0) const cyGridster = ref(null) +const editDomId = ref('edit-' + canvasId.value) const editStyle = computed(() => { if (canvasStyleData.value && isMainCanvas(canvasId.value)) { @@ -187,6 +191,32 @@ const moveOutFromTab = component => { }, 500) } +const initWatermark = (waterDomId = 'edit-canvas-main') => { + // if (dvInfo.value.watermarkInfo && isMainCanvas(canvasId.value)) { + // if (userInfo.value) { + // activeWatermark( + // dvInfo.value.watermarkInfo.settingContent, + // userInfo.value, + // waterDomId, + // canvasId.value, + // dvInfo.value.selfWatermarkStatus + // ) + // } else { + // const method = personInfoApi + // method().then(res => { + // userInfo.value = res.data + // activeWatermark( + // dvInfo.value.watermarkInfo.settingContent, + // userInfo.value, + // waterDomId, + // canvasId.value, + // dvInfo.value.selfWatermarkStatus + // ) + // }) + // } + // } +} + // 全局监听按键事件 onMounted(() => { window.addEventListener('resize', canvasSizeInit) @@ -242,7 +272,7 @@ defineExpose({ - + @@ -29,5 +31,6 @@ const { t } = useI18n() position: absolute; right: 10px; z-index: 10; + top: 5px; } diff --git a/core/core-frontend/src/views/watermark/index.vue b/core/core-frontend/src/views/watermark/index.vue index 0d023a5b47..b2f69fb9c0 100644 --- a/core/core-frontend/src/views/watermark/index.vue +++ b/core/core-frontend/src/views/watermark/index.vue @@ -113,6 +113,7 @@ import { ElMessage } from 'element-plus-secondary/es' import { personInfoApi } from '@/api/user' import { getNow, watermark } from '@/components/watermark/watermark' import { useI18n } from '@/hooks/web/useI18n' +import ParamsTips from '@/views/watermark/ParamsTips.vue' const { t } = useI18n() const state = reactive({ diff --git a/sdk/api/api-base/src/main/java/io/dataease/api/visualization/vo/DataVisualizationVO.java b/sdk/api/api-base/src/main/java/io/dataease/api/visualization/vo/DataVisualizationVO.java index c13f28eb05..67c596c04c 100644 --- a/sdk/api/api-base/src/main/java/io/dataease/api/visualization/vo/DataVisualizationVO.java +++ b/sdk/api/api-base/src/main/java/io/dataease/api/visualization/vo/DataVisualizationVO.java @@ -74,7 +74,7 @@ public class DataVisualizationVO implements Serializable { /** * 是否单独打开水印 0-关闭 1-开启 */ - private Integer selfWatermarkStatus; + private Boolean selfWatermarkStatus; /** * 排序