feat: 支持水印设置

This commit is contained in:
wangjiahao 2022-11-15 11:58:14 +08:00
parent 7cf2f9da02
commit aa4e5689b9
15 changed files with 143 additions and 110 deletions

View File

@ -11,6 +11,7 @@ import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController; import org.springframework.web.bind.annotation.RestController;
import springfox.documentation.annotations.ApiIgnore; import springfox.documentation.annotations.ApiIgnore;
import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpServletResponse;
import java.io.BufferedInputStream; import java.io.BufferedInputStream;
import java.io.IOException; import java.io.IOException;
@ -40,20 +41,20 @@ public class PluginCommonServer {
BufferedInputStream bis = null; BufferedInputStream bis = null;
InputStream inputStream = null; InputStream inputStream = null;
OutputStream os = null; //输出流 OutputStream os = null; //输出流
try{ try {
inputStream = service.vueResource(jsName); inputStream = service.vueResource(jsName);
byte[] buffer = new byte[1024]; byte[] buffer = new byte[1024];
os = response.getOutputStream(); os = response.getOutputStream();
bis = new BufferedInputStream(inputStream); bis = new BufferedInputStream(inputStream);
int i = bis.read(buffer); int i = bis.read(buffer);
while(i != -1){ while (i != -1) {
os.write(buffer, 0, i); os.write(buffer, 0, i);
i = bis.read(buffer); i = bis.read(buffer);
} }
os.flush(); os.flush();
}catch (Exception e) { } catch (Exception e) {
e.printStackTrace(); e.printStackTrace();
}finally { } finally {
try { try {
bis.close(); bis.close();
inputStream.close(); inputStream.close();
@ -69,28 +70,28 @@ public class PluginCommonServer {
@GetMapping("/component/{componentName}") @GetMapping("/component/{componentName}")
public void componentInfo(@PathVariable String componentName) { public void componentInfo(@PathVariable String componentName) {
Map<String, PluginComponentService> beansOfType = SpringContextUtil.getApplicationContext().getBeansOfType(PluginComponentService.class); Map<String, PluginComponentService> beansOfType = SpringContextUtil.getApplicationContext().getBeansOfType(PluginComponentService.class);
beansOfType.values().stream().forEach(service -> { beansOfType.values().stream().forEach(service -> {
List<String> components = service.components(); List<String> components = service.components();
if (components.contains(componentName)) { if (components.contains(componentName)) {
HttpServletResponse response = ServletUtils.response(); HttpServletResponse response = ServletUtils.response();
BufferedInputStream bis = null; BufferedInputStream bis = null;
InputStream inputStream = null; InputStream inputStream = null;
OutputStream os = null; //输出流 OutputStream os = null; //输出流
try{ try {
inputStream = service.vueResource(componentName); inputStream = service.vueResource(componentName);
byte[] buffer = new byte[1024]; byte[] buffer = new byte[1024];
os = response.getOutputStream(); os = response.getOutputStream();
bis = new BufferedInputStream(inputStream); bis = new BufferedInputStream(inputStream);
int i = bis.read(buffer); int i = bis.read(buffer);
while(i != -1){ while (i != -1) {
os.write(buffer, 0, i); os.write(buffer, 0, i);
i = bis.read(buffer); i = bis.read(buffer);
} }
os.flush(); os.flush();
}catch (Exception e) { } catch (Exception e) {
e.printStackTrace(); e.printStackTrace();
}finally { } finally {
try { try {
bis.close(); bis.close();
inputStream.close(); inputStream.close();
@ -101,7 +102,7 @@ public class PluginCommonServer {
} }
return; return;
} }
}); });
} }
@GetMapping("/staticInfo/{name}/{suffix}") @GetMapping("/staticInfo/{name}/{suffix}")
@ -115,22 +116,24 @@ public class PluginCommonServer {
BufferedInputStream bis = null; BufferedInputStream bis = null;
InputStream inputStream = null; InputStream inputStream = null;
OutputStream os = null; //输出流 OutputStream os = null; //输出流
try{ try {
inputStream = service.vueResource(name, suffix); inputStream = service.vueResource(name, suffix);
byte[] buffer = new byte[1024]; byte[] buffer = new byte[1024];
os = response.getOutputStream(); os = response.getOutputStream();
bis = new BufferedInputStream(inputStream); bis = new BufferedInputStream(inputStream);
int i = bis.read(buffer); int i = bis.read(buffer);
while(i != -1){ while (i != -1) {
os.write(buffer, 0, i); os.write(buffer, 0, i);
i = bis.read(buffer); i = bis.read(buffer);
} }
if (suffix.indexOf("svg") != -1) if (suffix.indexOf("svg") != -1)
response.setContentType("image/svg+xml"); response.setContentType("image/svg+xml");
if (suffix.indexOf("png") != -1)
response.setContentType("image/png");
os.flush(); os.flush();
}catch (Exception e) { } catch (Exception e) {
e.printStackTrace(); e.printStackTrace();
}finally { } finally {
try { try {
bis.close(); bis.close();
inputStream.close(); inputStream.close();

View File

@ -4,10 +4,7 @@ import io.dataease.plugins.config.SpringContextUtil;
import io.dataease.plugins.xpack.watermark.WatermarkService; import io.dataease.plugins.xpack.watermark.WatermarkService;
import io.dataease.plugins.xpack.watermark.dto.PanelWatermarkDTO; import io.dataease.plugins.xpack.watermark.dto.PanelWatermarkDTO;
import io.swagger.annotations.ApiOperation; import io.swagger.annotations.ApiOperation;
import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.*;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import springfox.documentation.annotations.ApiIgnore; import springfox.documentation.annotations.ApiIgnore;
/** /**
@ -29,7 +26,7 @@ public class XWatermarkServer {
@ApiOperation("保存水印配置") @ApiOperation("保存水印配置")
@PostMapping("/save") @PostMapping("/save")
public void save(PanelWatermarkDTO panelWatermark) { public void save(@RequestBody PanelWatermarkDTO panelWatermark) {
WatermarkService userXpackService = SpringContextUtil.getBean(WatermarkService.class); WatermarkService userXpackService = SpringContextUtil.getBean(WatermarkService.class);
userXpackService.saveWatermarkInfo(panelWatermark); userXpackService.saveWatermarkInfo(panelWatermark);
} }

View File

@ -6,26 +6,33 @@ ALTER TABLE `sys_log`
ALTER TABLE `panel_group` ALTER TABLE `panel_group`
ADD COLUMN `watermark_open` tinyint(1) NULL DEFAULT 1 COMMENT '是否单独打开水印' AFTER `update_time`; ADD COLUMN `watermark_open` tinyint(1) NULL DEFAULT 1 COMMENT '是否单独打开水印' AFTER `update_time`;
DROP TABLE IF EXISTS `panel_watermark`;
CREATE TABLE `panel_watermark`
(
`id` varchar(50) NOT NULL,
`version` varchar(255) DEFAULT NULL COMMENT '版本号',
`setting_content` longtext COMMENT '设置内容',
`create_by` varchar(255) DEFAULT NULL,
`create_time` bigint(13) DEFAULT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE utf8mb4_general_ci;
INSERT INTO `panel_watermark` (`id`, `version`, `setting_content`, `create_by`, `create_time`) INSERT INTO `panel_watermark` (`id`, `version`, `setting_content`, `create_by`, `create_time`)
VALUES ('system_default', '1.0', VALUES ('system_default', '1.0',
'{\"enable\":false,\"enablePanelCustom\":true,\"type\":\"custom\",\"content\":\"${time}-${nickName}\",\"watermark_color\":\"#999999\",\"watermark_x_space\":20,\"watermark_y_space\":100,\"watermark_fontsize\":20}', '{\"enable\":false,\"enablePanelCustom\":true,\"type\":\"custom\",\"content\":\"${time}-${nickName}\",\"watermark_color\":\"#999999\",\"watermark_x_space\":20,\"watermark_y_space\":100,\"watermark_fontsize\":20}',
'admin', NULL); 'admin', NULL);
CREATE TABLE `panel_watermark`
(
`id` varchar(50) NOT NULL,
`name` varchar(255) DEFAULT NULL,
`version` varchar(255) DEFAULT NULL COMMENT '版本',
`type` varchar(255) DEFAULT NULL COMMENT '类型',
`content` varchar(255) DEFAULT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE utf8mb4_general_ci;
SET SET
FOREIGN_KEY_CHECKS = 1; FOREIGN_KEY_CHECKS = 1;
UPDATE `sys_menu` SET `component` = 'dataset/Form' WHERE (`menu_id` = '800'); UPDATE `sys_menu`
SET `component` = 'dataset/Form'
WHERE (`menu_id` = '800');
UPDATE `sys_menu` SET `component` = 'msg/All' WHERE (`component` = 'msg/all'); UPDATE `sys_menu`
UPDATE `sys_menu` SET `component` = 'msg/Setting' WHERE (`component` = 'msg/setting'); SET `component` = 'msg/All'
WHERE (`component` = 'msg/all');
UPDATE `sys_menu`
SET `component` = 'msg/Setting'
WHERE (`component` = 'msg/setting');

View File

@ -163,6 +163,10 @@ export function initPanelData(panelId, useCache = false, callback) {
if (response.data) { if (response.data) {
// 初始化视图data和style 数据 // 初始化视图data和style 数据
panelInit(JSON.parse(response.data.panelData), JSON.parse(response.data.panelStyle)) panelInit(JSON.parse(response.data.panelData), JSON.parse(response.data.panelStyle))
const watermarkInfo = {
...response.data.watermarkInfo,
settingContent: JSON.parse(response.data.watermarkInfo.settingContent)
}
// 设置当前仪表板全局信息 // 设置当前仪表板全局信息
store.dispatch('panel/setPanelInfo', { store.dispatch('panel/setPanelInfo', {
id: response.data.id, id: response.data.id,
@ -177,7 +181,7 @@ export function initPanelData(panelId, useCache = false, callback) {
updateName: response.data.updateName, updateName: response.data.updateName,
updateTime: response.data.updateTime, updateTime: response.data.updateTime,
watermarkOpen: response.data.watermarkOpen, watermarkOpen: response.data.watermarkOpen,
watermarkInfo: response.data.watermarkInfo watermarkInfo: watermarkInfo
}) })
// 刷新联动信息 // 刷新联动信息
getPanelAllLinkageInfo(panelId).then(rsp => { getPanelAllLinkageInfo(panelId).then(rsp => {

View File

@ -10,6 +10,10 @@ export function proxyInitPanelData(panelId, proxy, callback) {
if (response.data) { if (response.data) {
// 初始化视图data和style 数据 // 初始化视图data和style 数据
panelInit(JSON.parse(response.data.panelData), JSON.parse(response.data.panelStyle)) panelInit(JSON.parse(response.data.panelData), JSON.parse(response.data.panelStyle))
const watermarkInfo = {
...response.data.watermarkInfo,
settingContent: JSON.parse(response.data.watermarkInfo.settingContent)
}
// 设置当前仪表板全局信息 // 设置当前仪表板全局信息
store.dispatch('panel/setPanelInfo', { store.dispatch('panel/setPanelInfo', {
id: response.data.id, id: response.data.id,
@ -25,7 +29,7 @@ export function proxyInitPanelData(panelId, proxy, callback) {
updateName: response.data.updateName, updateName: response.data.updateName,
updateTime: response.data.updateTime, updateTime: response.data.updateTime,
watermarkOpen: response.data.watermarkOpen, watermarkOpen: response.data.watermarkOpen,
watermarkInfo: response.data.watermarkInfo watermarkInfo: watermarkInfo
}) })
// 刷新联动信息 // 刷新联动信息
getPanelAllLinkageInfo(panelId, proxy).then(rsp => { getPanelAllLinkageInfo(panelId, proxy).then(rsp => {

Binary file not shown.

Before

Width:  |  Height:  |  Size: 509 KiB

View File

@ -8,7 +8,7 @@
@mouseup="deselectCurComponent" @mouseup="deselectCurComponent"
@scroll="canvasScroll" @scroll="canvasScroll"
> >
<slot name="optBar"/> <slot name="optBar" />
<de-editor <de-editor
:ref="editorRefName" :ref="editorRefName"
:canvas-style-data="canvasStyleData" :canvas-style-data="canvasStyleData"
@ -265,7 +265,7 @@ export default {
if (this.panelInfo.watermarkInfo) { if (this.panelInfo.watermarkInfo) {
userLoginInfo().then(res => { userLoginInfo().then(res => {
const userInfo = res.data const userInfo = res.data
activeWatermark(JSON.parse(this.panelInfo.watermarkInfo.settingContent), userInfo, this.canvasDomId, this.canvasId, this.panelInfo.watermarkOpen) activeWatermark(this.panelInfo.watermarkInfo.settingContent, userInfo, this.canvasDomId, this.canvasId, this.panelInfo.watermarkOpen)
}) })
} }
}, },

View File

@ -7,10 +7,10 @@
@change="openMobileLayout" @change="openMobileLayout"
> >
<el-radio-button :label="false"> <el-radio-button :label="false">
<span class="icon iconfont icon-icon_pc_outlined icon16_only"/> <span class="icon iconfont icon-icon_pc_outlined icon16_only" />
</el-radio-button> </el-radio-button>
<el-radio-button :label="true"> <el-radio-button :label="true">
<span class="icon iconfont icon-icon_phone_outlined icon16_only"/> <span class="icon iconfont icon-icon_phone_outlined icon16_only" />
</el-radio-button> </el-radio-button>
</el-radio-group> </el-radio-group>
</div> </div>
@ -95,7 +95,7 @@
<el-dropdown-item> <el-dropdown-item>
<el-dropdown placement="right-start"> <el-dropdown placement="right-start">
<span> <span>
<span class="icon iconfont icon-icon_moments-categories_outlined icon16"/> <span class="icon iconfont icon-icon_moments-categories_outlined icon16" />
<span class="text14 margin-left8">{{ $t('panel.new_element_distribution') }}</span> <span class="text14 margin-left8">{{ $t('panel.new_element_distribution') }}</span>
<svg-icon <svg-icon
icon-class="icon_right_outlined" icon-class="icon_right_outlined"
@ -121,7 +121,7 @@
</el-dropdown> </el-dropdown>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item> <el-dropdown-item>
<span class="icon iconfont icon-icon_dialpad_outlined icon16"/> <span class="icon iconfont icon-icon_dialpad_outlined icon16" />
<span class="text14 margin-left8">{{ $t('panel.aided_grid') }}</span> <span class="text14 margin-left8">{{ $t('panel.aided_grid') }}</span>
<el-switch <el-switch
v-model="showGridSwitch" v-model="showGridSwitch"
@ -131,20 +131,23 @@
/> />
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item @click.native="openOuterParamsSet"> <el-dropdown-item @click.native="openOuterParamsSet">
<span class="icon iconfont icon-icon-quicksetting icon16"/> <span class="icon iconfont icon-icon-quicksetting icon16" />
<span class="text14 margin-left8">{{ $t('panel.params_setting') }}</span> <span class="text14 margin-left8">{{ $t('panel.params_setting') }}</span>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item @click.native="clearCanvas"> <el-dropdown-item @click.native="clearCanvas">
<span class="icon iconfont icon-icon_clear_outlined icon16"/> <span class="icon iconfont icon-icon_clear_outlined icon16" />
<span class="text14 margin-left8">{{ $t('panel.clean_canvas') }}</span> <span class="text14 margin-left8">{{ $t('panel.clean_canvas') }}</span>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item> <el-dropdown-item
<span class="icon iconfont icon-WATERMARK icon16"/> v-if="showWatermarkSetting"
>
<span class="icon iconfont icon-WATERMARK icon16" />
<span class="text14 margin-left8">{{ $t('panel.watermark') }}</span> <span class="text14 margin-left8">{{ $t('panel.watermark') }}</span>
<el-switch <el-switch
v-model="panelInfo.watermarkOpen" v-model="panelInfo.watermarkOpen"
:class="[{['grid-active']: panelInfo.watermarkOpen},'margin-left8']" :class="[{['grid-active']: panelInfo.watermarkOpen},'margin-left8']"
size="mini" size="mini"
@change="styleChange"
/> />
</el-dropdown-item> </el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
@ -191,8 +194,8 @@
</el-col> </el-col>
<el-col :span="20"> <el-col :span="20">
<span style="font-size: 13px;margin-left: 10px;font-weight: bold;line-height: 20px">{{ <span style="font-size: 13px;margin-left: 10px;font-weight: bold;line-height: 20px">{{
$t('panel.panel_save_warn_tips') $t('panel.panel_save_warn_tips')
}}</span> }}</span>
</el-col> </el-col>
</el-row> </el-row>
<div <div
@ -259,6 +262,9 @@ export default {
} }
}, },
computed: { computed: {
showWatermarkSetting() {
return this.panelInfo.watermarkInfo && this.panelInfo.watermarkInfo.settingContent.enable && this.panelInfo.watermarkInfo.settingContent.enablePanelCustom
},
panelInfo() { panelInfo() {
return this.$store.state.panel.panelInfo return this.$store.state.panel.panelInfo
}, },
@ -437,9 +443,10 @@ export default {
if (_this.$store.state.cacheStyleChangeTimes > 0) { if (_this.$store.state.cacheStyleChangeTimes > 0) {
const requestInfo = _this.savePrepare() const requestInfo = _this.savePrepare()
const cacheRequest = { const cacheRequest = {
...this.panelInfo, ...deepCopy(this.panelInfo),
...requestInfo ...requestInfo
} }
cacheRequest.watermarkInfo.settingContent = JSON.stringify(this.panelInfo.watermarkInfo.settingContent)
saveCache(cacheRequest) saveCache(cacheRequest)
_this.$store.state.cacheStyleChangeTimes = 0 _this.$store.state.cacheStyleChangeTimes = 0
} }
@ -449,6 +456,7 @@ export default {
// //
const requestInfo = { const requestInfo = {
id: this.panelInfo.id, id: this.panelInfo.id,
watermarkOpen: this.panelInfo.watermarkOpen,
panelStyle: JSON.stringify(this.canvasStyleData), panelStyle: JSON.stringify(this.canvasStyleData),
panelData: JSON.stringify(this.componentData) panelData: JSON.stringify(this.componentData)
} }
@ -619,6 +627,9 @@ export default {
} }
}) })
this.cancelMobileLayoutStatue(sourceComponentData) this.cancelMobileLayoutStatue(sourceComponentData)
},
styleChange() {
this.$store.commit('canvasChange')
} }
} }
} }

View File

@ -121,7 +121,7 @@
:canvas-id="canvasId" :canvas-id="canvasId"
/> />
<!-- 右击菜单 --> <!-- 右击菜单 -->
<ContextMenu/> <ContextMenu />
<!-- 对齐标线 --> <!-- 对齐标线 -->
<span <span

View File

@ -1,11 +1,11 @@
<template> <template>
<div <div
class="bg"
:id="previewMainDomId" :id="previewMainDomId"
class="bg"
:style="customStyle" :style="customStyle"
@scroll="canvasScroll" @scroll="canvasScroll"
> >
<canvas-opt-bar/> <canvas-opt-bar />
<div <div
:id="previewDomId" :id="previewDomId"
:ref="previewRefId" :ref="previewRefId"
@ -315,10 +315,12 @@ export default {
}, },
methods: { methods: {
initWatermark() { initWatermark() {
userLoginInfo().then(res => { if (this.panelInfo.watermarkInfo) {
const userInfo = res.data userLoginInfo().then(res => {
activeWatermark(JSON.parse(this.panelInfo.watermarkInfo.settingContent), userInfo, 'preview-main-canvas-main', this.canvasId, this.panelInfo.watermarkOpen) const userInfo = res.data
}) activeWatermark(this.panelInfo.watermarkInfo.settingContent, userInfo, 'preview-main-canvas-main', this.canvasId, this.panelInfo.watermarkOpen)
})
}
}, },
isMainCanvas() { isMainCanvas() {
return this.canvasId === 'canvas-main' return this.canvasId === 'canvas-main'

View File

@ -1,50 +1,50 @@
//动态创建水印元素的封装函数 // 动态创建水印元素的封装函数
export function watermark(settings, domId) { export function watermark(settings, domId) {
const watermarkDom = document.getElementById(domId) const watermarkDom = document.getElementById(domId)
//默认设置 // 默认设置
let defaultSettings = { const defaultSettings = {
watermark_txt: '', watermark_txt: '',
watermark_x: 20, //水印起始位置x轴坐标 watermark_x: 20, // 水印起始位置x轴坐标
watermark_y: 20, //水印起始位置Y轴坐标 watermark_y: 20, // 水印起始位置Y轴坐标
watermark_rows: 20, //水印行数 watermark_rows: 20, // 水印行数
watermark_cols: 20, //水印列数 watermark_cols: 20, // 水印列数
watermark_x_space: 100, //水印x轴间隔 watermark_x_space: 100, // 水印x轴间隔
watermark_y_space: 50, //水印y轴间隔 watermark_y_space: 50, // 水印y轴间隔
watermark_color: '#aaa', //水印字体颜色 watermark_color: '#aaa', // 水印字体颜色
watermark_alpha: 0.4, //水印透明度 watermark_alpha: 0.4, // 水印透明度
watermark_fontsize: '15px', //水印字体大小 watermark_fontsize: '15px', // 水印字体大小
watermark_font: '微软雅黑', //水印字体 watermark_font: '微软雅黑', // 水印字体
watermark_width: 210, //水印宽度 watermark_width: 210, // 水印宽度
watermark_height: 80, //水印长度 watermark_height: 80, // 水印长度
watermark_angle: 20 //水印倾斜度数 watermark_angle: 20 // 水印倾斜度数
} }
//根据函数的入参调整设置 // 根据函数的入参调整设置
if (settings && typeof settings === 'object') { if (settings && typeof settings === 'object') {
let src = settings || {} const src = settings || {}
for (const key in src) { for (const key in src) {
if (src[key] && defaultSettings[key] && src[key] === defaultSettings[key]) { if (src[key] && defaultSettings[key] && src[key] === defaultSettings[key]) {
continue continue
} else if (src[key]) defaultSettings[key] = src[key] } else if (src[key]) defaultSettings[key] = src[key]
} }
} }
//创建虚拟节点对象,在该节点对象中可以放元素,最后只需在页面中添加该节点对象即可。可提高性能 // 创建虚拟节点对象,在该节点对象中可以放元素,最后只需在页面中添加该节点对象即可。可提高性能
let oTemp = document.createElement('p') const oTemp = document.createElement('p')
//获取页面最大宽度 // 获取页面最大宽度
let page_width = watermarkDom.clientWidth let page_width = watermarkDom.clientWidth
let cutWidth = page_width * 0.0150 const cutWidth = page_width * 0.0150
page_width = page_width - cutWidth page_width = page_width - cutWidth
//获取页面最大高度 // 获取页面最大高度
let page_height = watermarkDom.clientHeight - 56 let page_height = watermarkDom.clientHeight - 56
page_height = page_height < 400 ? 400 : page_height page_height = page_height < 400 ? 400 : page_height
// page_height = Math.max(page_height, window.innerHeight - 30) // page_height = Math.max(page_height, window.innerHeight - 30)
//如果将水印列数设置为0或水印列数设置过大超过页面最大宽度则重新计算水印列数和水印x轴间隔 // 如果将水印列数设置为0或水印列数设置过大超过页面最大宽度则重新计算水印列数和水印x轴间隔
if (defaultSettings.watermark_cols == 0 || (parseInt(defaultSettings.watermark_x + defaultSettings.watermark_width * defaultSettings.watermark_cols + defaultSettings.watermark_x_space * (defaultSettings.watermark_cols - 1)) > page_width)) { if (defaultSettings.watermark_cols === 0 || (parseInt(defaultSettings.watermark_x + defaultSettings.watermark_width * defaultSettings.watermark_cols + defaultSettings.watermark_x_space * (defaultSettings.watermark_cols - 1)) > page_width)) {
defaultSettings.watermark_cols = parseInt((page_width - defaultSettings.watermark_x + defaultSettings.watermark_x_space) / (defaultSettings.watermark_width + defaultSettings.watermark_x_space)) defaultSettings.watermark_cols = parseInt((page_width - defaultSettings.watermark_x + defaultSettings.watermark_x_space) / (defaultSettings.watermark_width + defaultSettings.watermark_x_space))
defaultSettings.watermark_x_space = parseInt((page_width - defaultSettings.watermark_x - defaultSettings.watermark_width * defaultSettings.watermark_cols) / (defaultSettings.watermark_cols - 1)) defaultSettings.watermark_x_space = parseInt((page_width - defaultSettings.watermark_x - defaultSettings.watermark_width * defaultSettings.watermark_cols) / (defaultSettings.watermark_cols - 1))
} }
//如果将水印行数设置为0或水印行数设置过大超过页面最大长度则重新计算水印行数和水印y轴间隔 // 如果将水印行数设置为0或水印行数设置过大超过页面最大长度则重新计算水印行数和水印y轴间隔
if (defaultSettings.watermark_rows == 0 || (parseInt(defaultSettings.watermark_y + defaultSettings.watermark_height * defaultSettings.watermark_rows + defaultSettings.watermark_y_space * (defaultSettings.watermark_rows - 1)) > page_height)) { if (defaultSettings.watermark_rows === 0 || (parseInt(defaultSettings.watermark_y + defaultSettings.watermark_height * defaultSettings.watermark_rows + defaultSettings.watermark_y_space * (defaultSettings.watermark_rows - 1)) > page_height)) {
defaultSettings.watermark_rows = parseInt((defaultSettings.watermark_y_space + page_height - defaultSettings.watermark_y) / (defaultSettings.watermark_height + defaultSettings.watermark_y_space)) defaultSettings.watermark_rows = parseInt((defaultSettings.watermark_y_space + page_height - defaultSettings.watermark_y) / (defaultSettings.watermark_height + defaultSettings.watermark_y_space))
defaultSettings.watermark_y_space = parseInt(((page_height - defaultSettings.watermark_y) - defaultSettings.watermark_height * defaultSettings.watermark_rows) / (defaultSettings.watermark_rows - 1)) defaultSettings.watermark_y_space = parseInt(((page_height - defaultSettings.watermark_y) - defaultSettings.watermark_height * defaultSettings.watermark_rows) / (defaultSettings.watermark_rows - 1))
} }
@ -56,11 +56,11 @@ export function watermark(settings, domId) {
y = defaultSettings.watermark_y + (defaultSettings.watermark_y_space + defaultSettings.watermark_height) * i y = defaultSettings.watermark_y + (defaultSettings.watermark_y_space + defaultSettings.watermark_height) * i
for (let j = 0; j < defaultSettings.watermark_cols; j++) { for (let j = 0; j < defaultSettings.watermark_cols; j++) {
x = defaultSettings.watermark_x + (defaultSettings.watermark_width + defaultSettings.watermark_x_space) * j x = defaultSettings.watermark_x + (defaultSettings.watermark_width + defaultSettings.watermark_x_space) * j
let mask_div = document.createElement('div') const mask_div = document.createElement('div')
mask_div.id = 'mask_div' + i + j mask_div.id = 'mask_div' + i + j
mask_div.className = 'mask_div' mask_div.className = 'mask_div'
mask_div.appendChild(document.createTextNode(defaultSettings.watermark_txt)) mask_div.appendChild(document.createTextNode(defaultSettings.watermark_txt))
//设置水印div倾斜显示 // 设置水印div倾斜显示
mask_div.style.webkitTransform = 'rotate(-' + defaultSettings.watermark_angle + 'deg)' mask_div.style.webkitTransform = 'rotate(-' + defaultSettings.watermark_angle + 'deg)'
mask_div.style.MozTransform = 'rotate(-' + defaultSettings.watermark_angle + 'deg)' mask_div.style.MozTransform = 'rotate(-' + defaultSettings.watermark_angle + 'deg)'
mask_div.style.msTransform = 'rotate(-' + defaultSettings.watermark_angle + 'deg)' mask_div.style.msTransform = 'rotate(-' + defaultSettings.watermark_angle + 'deg)'
@ -72,7 +72,7 @@ export function watermark(settings, domId) {
mask_div.style.top = y + 'px' mask_div.style.top = y + 'px'
mask_div.style.overflow = 'hidden' mask_div.style.overflow = 'hidden'
mask_div.style.zIndex = '9999' mask_div.style.zIndex = '9999'
//让水印不遮挡页面的点击事件 // 让水印不遮挡页面的点击事件
mask_div.style.pointerEvents = 'none' mask_div.style.pointerEvents = 'none'
mask_div.style.opacity = defaultSettings.watermark_alpha mask_div.style.opacity = defaultSettings.watermark_alpha
mask_div.style.fontSize = defaultSettings.watermark_fontsize mask_div.style.fontSize = defaultSettings.watermark_fontsize
@ -87,17 +87,15 @@ export function watermark(settings, domId) {
} }
oTemp.setAttribute('id', 'de-watermark-server') oTemp.setAttribute('id', 'de-watermark-server')
watermarkDom.appendChild(oTemp) watermarkDom.appendChild(oTemp)
} }
export function getNow() { export function getNow() {
let d = new Date() const d = new Date()
let year = d.getFullYear() const year = d.getFullYear()
let month = change(d.getMonth() + 1) const month = change(d.getMonth() + 1)
let day = change(d.getDate()) const day = change(d.getDate())
let hour = change(d.getHours()) const hour = change(d.getHours())
let minute = change(d.getMinutes()) const minute = change(d.getMinutes())
let second = change(d.getSeconds())
function change(t) { function change(t) {
if (t < 10) { if (t < 10) {
@ -107,18 +105,18 @@ export function getNow() {
} }
} }
let time = year + '-' + month + '-' + day + ' ' + hour + ':' + minute const time = year + '-' + month + '-' + day + ' ' + hour + ':' + minute
return time return time
} }
export function activeWatermark(watermarkForm, userLoginInfo, domId, canvasId, watermarkOpen) { export function activeWatermark(watermarkForm, userLoginInfo, domId, canvasId, watermarkOpen) {
//清理历史水印 // 清理历史水印
const historyWatermarkDom = document.getElementById('de-watermark-server') const historyWatermarkDom = document.getElementById('de-watermark-server')
if (historyWatermarkDom) { if (historyWatermarkDom) {
historyWatermarkDom.remove() historyWatermarkDom.remove()
} }
if (!(canvasId === 'canvas-main' && ((watermarkForm.enable && !watermarkForm.enablePanelCustom) if (!(canvasId === 'canvas-main' && ((watermarkForm.enable && !watermarkForm.enablePanelCustom) ||
|| (watermarkForm.enable && watermarkOpen)))) { (watermarkForm.enable && watermarkOpen)))) {
return return
} }
let watermark_txt let watermark_txt

View File

@ -65,7 +65,7 @@
@mousedown.stop.prevent="handleDown(handlei, $event)" @mousedown.stop.prevent="handleDown(handlei, $event)"
@touchstart.stop.prevent="handleTouchDown(handlei, $event)" @touchstart.stop.prevent="handleTouchDown(handlei, $event)"
> >
<slot :name="handlei"/> <slot :name="handlei" />
</div> </div>
<div <div
:id="componentCanvasId" :id="componentCanvasId"
@ -78,7 +78,7 @@
class="svg-background" class="svg-background"
:icon-class="mainSlotSvgInner" :icon-class="mainSlotSvgInner"
/> />
<slot/> <slot />
</div> </div>
</div> </div>
</div> </div>

View File

@ -139,6 +139,10 @@ export default {
this.innerValues = this.value this.innerValues = this.value
this.viewLoaded = false this.viewLoaded = false
this.panelId && findOne(this.panelId).then(response => { this.panelId && findOne(this.panelId).then(response => {
const watermarkInfo = {
...response.data.watermarkInfo,
settingContent: JSON.parse(response.data.watermarkInfo.settingContent)
}
this.panelInfo = { this.panelInfo = {
id: response.data.id, id: response.data.id,
name: response.data.name, name: response.data.name,
@ -150,7 +154,7 @@ export default {
updateBy: response.data.updateBy, updateBy: response.data.updateBy,
updateTime: response.data.updateTime, updateTime: response.data.updateTime,
watermarkOpen: response.data.watermarkOpen, watermarkOpen: response.data.watermarkOpen,
watermarkInfo: response.data.watermarkInfo watermarkInfo: watermarkInfo
} }
this.$store.dispatch('panel/setPanelInfo', this.panelInfo) this.$store.dispatch('panel/setPanelInfo', this.panelInfo)
panelDataPrepare(JSON.parse(response.data.panelData), JSON.parse(response.data.panelStyle), rsp => { panelDataPrepare(JSON.parse(response.data.panelData), JSON.parse(response.data.panelStyle), rsp => {

View File

@ -68,6 +68,10 @@ export default {
loadResource(this.resourceId).then(res => { loadResource(this.resourceId).then(res => {
this.show = false this.show = false
let loadingCount = 0 let loadingCount = 0
const watermarkInfo = {
...res.data.watermarkInfo,
settingContent: JSON.parse(res.data.watermarkInfo.settingContent)
}
this.panelInfo = { this.panelInfo = {
id: res.data.id, id: res.data.id,
name: res.data.name, name: res.data.name,
@ -78,7 +82,7 @@ export default {
updateBy: res.data.updateBy, updateBy: res.data.updateBy,
updateTime: res.data.updateTime, updateTime: res.data.updateTime,
watermarkOpen: res.data.watermarkOpen, watermarkOpen: res.data.watermarkOpen,
watermarkInfo: res.data.watermarkInfo watermarkInfo: watermarkInfo
} }
this.$store.dispatch('panel/setPanelInfo', this.panelInfo) this.$store.dispatch('panel/setPanelInfo', this.panelInfo)

View File

@ -161,7 +161,7 @@
/> />
</span> </span>
<span v-if="data.nodeType === 'folder'"> <span v-if="data.nodeType === 'folder'">
<svg-icon icon-class="scene"/> <svg-icon icon-class="scene" />
</span> </span>
<span <span
:class="data.status" :class="data.status"
@ -198,7 +198,7 @@
<el-dropdown-item <el-dropdown-item
:command="beforeClickEdit('folder', 'new', data, node)" :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> <span style="margin-left: 5px">{{ $t('panel.groupAdd') }}</span>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item <el-dropdown-item
@ -321,7 +321,7 @@
:label="$t('commons.name')" :label="$t('commons.name')"
prop="name" prop="name"
> >
<el-input v-model="groupForm.name"/> <el-input v-model="groupForm.name" />
</el-form-item> </el-form-item>
</el-form> </el-form>
<div <div
@ -332,8 +332,8 @@
size="mini" size="mini"
@click="close()" @click="close()"
>{{ >{{
$t('panel.cancel') $t('panel.cancel')
}} }}
</el-button> </el-button>
<el-button <el-button
type="primary" type="primary"
@ -409,8 +409,8 @@
size="mini" size="mini"
@click="closeMoveGroup()" @click="closeMoveGroup()"
>{{ >{{
$t('dataset.cancel') $t('dataset.cancel')
}} }}
</el-button> </el-button>
<el-button <el-button
:disabled="groupMoveConfirmDisabled" :disabled="groupMoveConfirmDisabled"
@ -970,8 +970,7 @@ export default {
createTime: data.createTime, createTime: data.createTime,
updateBy: data.updateBy, updateBy: data.updateBy,
updateTime: data.updateTime, updateTime: data.updateTime,
watermarkOpen: data.watermarkOpen, watermarkOpen: data.watermarkOpen
watermarkInfo: data.watermarkInfo
}) })
bus.$emit('PanelSwitchComponent', { name: 'PanelEdit' }) bus.$emit('PanelSwitchComponent', { name: 'PanelEdit' })
}, },