elink-star
/
epmet-work-pc
17
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

12345添加水印

feature-bug
是小王呀\24601 8 months ago
parent
ec183d7d0a
commit
82705ae376
6 changed files with 172 additions and 14 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      package.json
  2. 54
      src/views/modules/shequzhili/Delivery/index.vue
  3. 39
      src/views/modules/shequzhili/event/cpts/event-detail.vue
  4. 45
      src/views/modules/shequzhili/eventHandling/index.vue
  5. 2
      src/views/modules/shequzhili/peopleOpinons/opinionsDaily.vue
  6. 44
      src/views/modules/shequzhili/timeOut/index.vue

2
package.json
View File

@ -1,4 +1,4 @@
{
{
"name": "epmet-oper-gov",
"version": "1.0.0",
"private": true,

54
src/views/modules/shequzhili/Delivery/index.vue
View File

@ -74,6 +74,7 @@
</div>
<div class="m-table">
<div class="div_btn">
<el-button @click="handleExport" class="diy-button--white" size="small">导出</el-button>
@ -102,9 +103,11 @@
</el-dropdown-menu> -->
<!-- </el-dropdown> -->
</div>
<canvas id="watermarkCanvas" class="canvas"> </canvas>
<el-table :data="tableData" border class="m-table-item" style="width: 100%"
@selection-change="handleSelectionChange" :height="maxTableHeight">
<el-table-column label="" fixed="left" type="selection" align="center" width="50" />
<el-table-column label="" fixed="left" type="selection" align="center" width="50" />
<!-- <el-table-column label="序号" fixed="left" type="index" align="center" width="50" /> -->
<el-table-column prop="workOrderNum" align="center" label="工单编号" :show-overflow-tooltip="true">
@ -177,6 +180,8 @@
<el-button @click="handleDel(scope.row)" type="text" size="small" >删除</el-button>
</template>
</el-table-column>
</el-table>
@ -203,10 +208,7 @@ import eventInfo from "../event/cpts/event-info.vue";
import axios from "axios";
export default {
data() {
let orgOptionProps = {
multiple: false,
value: 'agencyId',
@ -328,7 +330,9 @@ export default {
selVoiceUrl: "",
multipleSelection: [],
importLoading: false,
importType: "1"
importType: "1",
phone:"",
realName:""
};
},
components:{eventInfo},
@ -355,15 +359,42 @@ export default {
},
},
mounted() {
console.log(this.$store.state.user,"dslk;djklsg;ljk");
this.realName = this.$store.state.user.realName;
this.phone = this.$store.state.user.phone;
this.user = this.$store.state.user;
this.agencyId = this.user.agencyId;
this.getCanvas()
this.getOrgTreeList()
this.getGridList()
this.getTableData();
this.getCateOptions();
},
methods: {
getCanvas() {
var canvas = document.getElementById('watermarkCanvas');
var ctx = canvas.getContext('2d');
canvas.width = window.innerWidth ; // 设置更高的分辨率
canvas.height = window.innerHeight ;
var watermarkText = this.realName+ this.phone; //内容
ctx.font = '12px Arial'; //大小
ctx.fillStyle = 'rgba(0, 0, 255, 0.2)'; //颜色+透明度
// ctx.textBaseline = 'middle';
ctx.scale(2, 2); // 缩放上下文以适应更高分辨率
var angle = -30 * Math.PI / 180; // 旋转-30度
var x = canvas.width / 2;
var y = canvas.height / 2;
var space = 150; // 水印间距
for (var i = 0; i < canvas.width; i += space) {
for (var j = 0; j < canvas.height; j += space) {
ctx.save();
ctx.translate(i, j);
ctx.rotate(angle);
ctx.fillText(watermarkText, 0, 0);
ctx.restore();
}
}
},
async handleDel(rowData) {
let message = "确认删除?";
this.$confirm(message, "提示", {
@ -858,4 +889,15 @@ export default {
font-size: 40px;
color: #fff;
}
.canvas {
width: 100%;
height: 100%;
z-index: 10;
position: absolute;
top: 0;
left: 0;
pointer-events: none;
/* 确保canvas不干扰其他元素 */
}
</style>

39
src/views/modules/shequzhili/event/cpts/event-detail.vue
View File

@ -11,7 +11,9 @@
<el-button size="small" icon="el-icon-download">下载</el-button>
</div>
<div class="m-info">
<div class="flex">
<canvas id="watermarkCanvas2" class="canvas"> </canvas>
<div class="item">
<div class="label">工单编号</div>
<div class="value">{{ info.workOrderNum }}</div>
@ -157,6 +159,9 @@ export default {
},
mounted() {
this.user = this.$store.state.user;
this.phone = this.$store.state.user.phone;
this.realName = this.$store.state.user.realName;
this.getCanvas()
if (this.eventId) {
this.info = JSON.parse(JSON.stringify(this.eventDetailData));
}
@ -170,6 +175,30 @@ export default {
},
methods: {
getCanvas() {
var canvas = document.getElementById('watermarkCanvas2');
var ctx = canvas.getContext('2d');
canvas.width = window.innerWidth ; // 设置更高的分辨率
canvas.height = window.innerHeight ;
var watermarkText = this.realName+ this.phone; //内容
ctx.font = '12px Arial'; //大小
ctx.fillStyle = 'rgba(0, 0, 255, 0.2)'; //颜色+透明度
// ctx.textBaseline = 'middle';
ctx.scale(2, 2); // 缩放上下文以适应更高分辨率
var angle = -30 * Math.PI / 180; // 旋转-30度
var x = canvas.width / 2;
var y = canvas.height / 2;
var space = 150; // 水印间距
for (var i = 0; i < canvas.width; i += space) {
for (var j = 0; j < canvas.height; j += space) {
ctx.save();
ctx.translate(i, j);
ctx.rotate(angle);
ctx.fillText(watermarkText, 0, 0);
ctx.restore();
}
}
},
watchImg(src) {
window.open(src);
},
@ -264,4 +293,14 @@ export default {
margin-right: 10px;
}
}
.canvas {
width: 100%;
height: 100%;
z-index: 10;
position: absolute;
top: 0;
left: 0;
pointer-events: none;
/* 确保canvas不干扰其他元素 */
}
</style>

45
src/views/modules/shequzhili/eventHandling/index.vue
View File

@ -91,9 +91,10 @@
</el-dropdown-menu>
</el-dropdown> -->
</div>
<canvas id="watermarkCanvas1" class="canvas"> </canvas>
<el-table :data="tableData" border class="m-table-item" style="width: 100%"
@selection-change="handleSelectionChange" :height="maxTableHeight">
<el-table-column label="" fixed="left" type="selection" align="center" width="50" />
<!-- <el-table-column label="序号" fixed="left" type="index" align="center" width="50" /> -->
@ -208,7 +209,6 @@ export default {
dialogVisible:"false",
pageType: "list", // 列表list 新增add 处理dispose 详情info
user: {},
agencyId: "",
orgOptions: [],
orgOptionProps,
@ -284,6 +284,8 @@ export default {
},
],
phone: "",
realName: "",
formData: {
agencyId: "",
sourceType: "",
@ -345,16 +347,41 @@ export default {
},
},
mounted() {
this.realName = this.$store.state.user.realName;
this.phone = this.$store.state.user.phone;
this.user = this.$store.state.user;
this.agencyId = this.user.agencyId;
this.getCanvas()
this.getOrgTreeList()
this.getGridList()
this.getTableData();
this.getCateOptions();
},
methods: {
getCanvas() {
var canvas = document.getElementById('watermarkCanvas1');
var ctx = canvas.getContext('2d');
canvas.width = window.innerWidth ; // 设置更高的分辨率
canvas.height = window.innerHeight ;
var watermarkText = this.realName+ this.phone; //内容
ctx.font = '12px Arial'; //大小
ctx.fillStyle = 'rgba(0, 0, 255, 0.2)'; //颜色+透明度
// ctx.textBaseline = 'middle';
ctx.scale(2, 2); // 缩放上下文以适应更高分辨率
var angle = -30 * Math.PI / 180; // 旋转-30度
var x = canvas.width / 2;
var y = canvas.height / 2;
var space = 150; // 水印间距
for (var i = 0; i < canvas.width; i += space) {
for (var j = 0; j < canvas.height; j += space) {
ctx.save();
ctx.translate(i, j);
ctx.rotate(angle);
ctx.fillText(watermarkText, 0, 0);
ctx.restore();
}
}
},
handleSelectionChange(val) {
this.multipleSelection = [];
val.forEach((element) => {
@ -795,4 +822,14 @@ export default {
font-size: 40px;
color: #fff;
}
.canvas {
width: 100%;
height: 100%;
z-index: 10;
position: absolute;
top: 0;
left: 0;
pointer-events: none;
/* 确保canvas不干扰其他元素 */
}
</style>

2
src/views/modules/shequzhili/peopleOpinons/opinionsDaily.vue
View File

@ -216,6 +216,8 @@ export default {
}
return {
phone: "",
realName: "",
formData: {
openFlag:"",
publicationPeople:"",

44
src/views/modules/shequzhili/timeOut/index.vue
View File

@ -91,7 +91,7 @@
</el-dropdown-menu>
</el-dropdown> -->
</div>
<canvas id="watermarkCanvas3" class="canvas"> </canvas>
<el-table :data="tableData" border class="m-table-item" style="width: 100%"
@selection-change="handleSelectionChange" :height="maxTableHeight">
<el-table-column label="" fixed="left" type="selection" align="center" width="50" />
@ -310,7 +310,9 @@ export default {
selVoiceUrl: "",
multipleSelection: [],
importLoading: false,
importType: "1"
importType: "1",
phone: "",
realName: "",
};
},
components: { Urging, eventInfo },
@ -337,15 +339,41 @@ export default {
},
},
mounted() {
this.phone = this.$store.state.user.phone;
this.realName = this.$store.state.user.realName;
this.user = this.$store.state.user;
this.agencyId = this.user.agencyId;
this.getCanvas()
this.getOrgTreeList()
this.getGridList()
this.getTableData();
this.getCateOptions();
},
methods: {
getCanvas() {
var canvas = document.getElementById('watermarkCanvas3');
var ctx = canvas.getContext('2d');
canvas.width = window.innerWidth ; // 设置更高的分辨率
canvas.height = window.innerHeight ;
var watermarkText = this.realName+ this.phone; //内容
ctx.font = '12px Arial'; //大小
ctx.fillStyle = 'rgba(0, 0, 255, 0.2)'; //颜色+透明度
// ctx.textBaseline = 'middle';
ctx.scale(2, 2); // 缩放上下文以适应更高分辨率
var angle = -30 * Math.PI / 180; // 旋转-30度
var x = canvas.width / 2;
var y = canvas.height / 2;
var space = 150; // 水印间距
for (var i = 0; i < canvas.width; i += space) {
for (var j = 0; j < canvas.height; j += space) {
ctx.save();
ctx.translate(i, j);
ctx.rotate(angle);
ctx.fillText(watermarkText, 0, 0);
ctx.restore();
}
}
},
handleEventType(val) {
const nodes = this.$refs.cascaderEvent.getCheckedNodes();
this.formData.firstIdList = [];
@ -837,4 +865,14 @@ export default {
font-size: 40px;
color: #fff;
}
.canvas {
width: 100%;
height: 100%;
z-index: 10;
position: absolute;
top: 0;
left: 0;
pointer-events: none;
/* 确保canvas不干扰其他元素 */
}
</style>

Write Preview
Loading…
Cancel
Save