Skip to content

F
founder_vue
Commit 47a58b0e by 张超军
Options

案件指纹编辑特征点+圆形绘制（旋转+翻转标记问题）

parent b2a5727d
Showing with 237 additions and 116 deletions
src/views/Editor/modules/imageEd.vue
<!--
* @Author: your name
* @Date: 2021-10-22 11:36:10
* @LastEditTime: 2021-12-17 16:22:04
* @LastEditTime: 2021-12-17 21:04:36
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \指纹系统\founder_vue\src\views\Editor\modules\imageEd.vue
......@@ -78,39 +78,39 @@
<div class="rotate_line_top"></div>
<div class="content">
<div class="rotate_content">
<div class="rotate_left" id="btn-rotate-clockwise">
<div class="rotate_left" id="btn-rotate-counter-clockwise">
<div class="rotate_icon">
<img v-if="!isLeftRotate" src="@/assets/img/zcedit/left_rotate_d.png" alt="" />
<img v-if="!isRightRotate" src="@/assets/img/zcedit/left_rotate_d.png" alt="" />
<img v-else src="@/assets/img/zcedit/left_rotate_a.png" alt="" />
</div>
<div class="num" :class="{ leftRotateActive: isLeftRotate }">
30
-30
</div>
</div>
<div class="rotate_right" id="btn-rotate-counter-clockwise">
<div class="rotate_right" id="btn-rotate-clockwise">
<div class="rotate_icon">
<img v-if="!isRightRotate" src="@/assets/img/zcedit/left_rotate_d.png" alt="" />
<img v-if="!isLeftRotate" src="@/assets/img/zcedit/left_rotate_d.png" alt="" />
<img v-else src="@/assets/img/zcedit/left_rotate_a.png" alt="" />
</div>
<div class="num" :class="{ rightRotateActive: isRightRotate }">
-30
30
</div>
</div>
</div>
<div class="flap_content">
<div class="flap_x" id="btn-flip-x">
<div class="flap_x" id="btn-flip-y">
<div class="flap_x_icon">
<img v-if="!isX" src="@/assets/img/zcedit/flap_x_d.png" alt="" />
<img v-if="!isY" src="@/assets/img/zcedit/flap_x_d.png" alt="" />
<img v-else src="@/assets/img/zcedit/flap_x_a.png" alt="" />
</div>
<div class="flap_txt" :class="{ xActive: isX }">X轴</div>
<div class="flap_txt" :class="{ xActive: isY }">X轴</div>
</div>
<div class="flap_y" id="btn-flip-y">
<div class="flap_y" id="btn-flip-x">
<div class="flap_y_icon">
<img v-if="!isY" src="@/assets/img/zcedit/flap_y_d.png" alt="" />
<img v-if="!isX" src="@/assets/img/zcedit/flap_y_d.png" alt="" />
<img v-else src="@/assets/img/zcedit/flap_y_a.png" alt="" />
</div>
<div class="flap_txt" :class="{ yActive: isY }">Y轴</div>
<div class="flap_txt" :class="{ yActive: isX }">Y轴</div>
</div>
</div>
</div>
......@@ -1015,6 +1015,7 @@ export default {
self.isReset = true;
// 旋转角度同样恢复到0
self.inputRotationRange = 0;
self.startPlace = 0
//console.log(self.startPlace, 222);
// 事件不能连续重复执行，需要缓存时间
setTimeout(() => {
......@@ -1178,7 +1179,13 @@ export default {
// 缩放为1
self.zoomLevel = 1;
imageEditor.resetZoom();
imageEditor.resetFlip().catch(err => {})
self.resetTzdDrawing();
self.tzdDrawingLeft = 0
self.tzdDrawingTop = 0
self.tzdDrawing_left = 0
self.tzdDrawing_top = 0
self.startPlace = 0
self.sourceImage = sourceImage;
imageEditor
.loadImageFromURL(
......
src/views/Editor/modules/imageEdAJ.vue
<!--
* @Author: your name
* @Date: 2021-10-22 11:36:10
* @LastEditTime: 2021-12-17 17:14:48
* @LastEditTime: 2021-12-17 22:37:51
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \指纹系统\founder_vue\src\views\Editor\modules\imageEd.vue
......@@ -238,7 +238,7 @@
<img v-else src="@/assets/img/zcedit/left_rotate_a.png" alt="" />
</div>
<div class="num" :class="{ leftRotateActive: isLeftRotate }">
30
-30
</div>
</div>
<div class="rotate_right" id="btn-rotate-counter-clockwise-dr">
......@@ -247,24 +247,24 @@
<img v-else src="@/assets/img/zcedit/left_rotate_a.png" alt="" />
</div>
<div class="num" :class="{ rightRotateActive: isRightRotate }">
-30
30
</div>
</div>
</div>
<div class="flap_content">
<div class="flap_x" id="btn-flip-x-dr">
<div class="flap_x" id="btn-flip-y-dr">
<div class="flap_x_icon">
<img v-if="!isX" src="@/assets/img/zcedit/flap_x_d.png" alt="" />
<img v-if="!isY" src="@/assets/img/zcedit/flap_x_d.png" alt="" />
<img v-else src="@/assets/img/zcedit/flap_x_a.png" alt="" />
</div>
<div class="flap_txt" :class="{ xActive: isX }">X轴</div>
<div class="flap_txt" :class="{ xActive: isY }">X轴</div>
</div>
<div class="flap_y" id="btn-flip-y-dr">
<div class="flap_y" id="btn-flip-x-dr">
<div class="flap_y_icon">
<img v-if="!isY" src="@/assets/img/zcedit/flap_y_d.png" alt="" />
<img v-if="!isX" src="@/assets/img/zcedit/flap_y_d.png" alt="" />
<img v-else src="@/assets/img/zcedit/flap_y_a.png" alt="" />
</div>
<div class="flap_txt" :class="{ yActive: isY }">Y轴</div>
<div class="flap_txt" :class="{ yActive: isX }">Y轴</div>
</div>
</div>
</div>
......@@ -408,7 +408,7 @@
<img v-else src="@/assets/img/zcedit/left_rotate_a.png" alt="" />
</div>
<div class="num" :class="{ leftRotateActive: isLeftRotate }">
30
-30
</div>
</div>
<div class="rotate_right" id="btn-rotate-counter-clockwise">
......@@ -417,24 +417,24 @@
<img v-else src="@/assets/img/zcedit/left_rotate_a.png" alt="" />
</div>
<div class="num" :class="{ rightRotateActive: isRightRotate }">
-30
30
</div>
</div>
</div>
<div class="flap_content">
<div class="flap_x" id="btn-flip-x">
<div class="flap_x" id="btn-flip-y">
<div class="flap_x_icon">
<img v-if="!isX" src="@/assets/img/zcedit/flap_x_d.png" alt="" />
<img v-if="!isY" src="@/assets/img/zcedit/flap_x_d.png" alt="" />
<img v-else src="@/assets/img/zcedit/flap_x_a.png" alt="" />
</div>
<div class="flap_txt" :class="{ xActive: isX }">X轴</div>
<div class="flap_txt" :class="{ xActive: isY }">X轴</div>
</div>
<div class="flap_y" id="btn-flip-y">
<div class="flap_y" id="btn-flip-x">
<div class="flap_y_icon">
<img v-if="!isY" src="@/assets/img/zcedit/flap_y_d.png" alt="" />
<img v-if="!isX" src="@/assets/img/zcedit/flap_y_d.png" alt="" />
<img v-else src="@/assets/img/zcedit/flap_y_a.png" alt="" />
</div>
<div class="flap_txt" :class="{ yActive: isY }">Y轴</div>
<div class="flap_txt" :class="{ yActive: isX }">Y轴</div>
</div>
</div>
</div>
......@@ -1349,6 +1349,7 @@ export default {
imageEditor.flipX().then(function (status) {
self.changeTzdDrawing();
});
console.log(imageEditor._graphics.getCanvasImage());
// Fcanvas.getObjects().map(function(o) {
// // console.log(o);
// o.set('scaleX', -1).setCoords();
......@@ -1366,6 +1367,7 @@ export default {
imageEditor.flipX().then(function (status) {
self.changeTzdDrawing();
});
console.log(imageEditor._graphics.getCanvasImage());
});
// 沿Y轴翻转
......@@ -1377,6 +1379,7 @@ export default {
imageEditor.flipY().then(function (status) {
self.changeTzdDrawing();
});
console.log(imageEditor._graphics.getCanvasImage());
});
// 沿Y轴翻转
......@@ -1388,8 +1391,10 @@ export default {
imageEditor.flipY().then(function (status) {
self.changeTzdDrawing();
});
console.log(imageEditor._graphics.getCanvasImage());
});
// 重置
$btnResetFlip.on("click", function (e) {
e.stopPropagation()
......@@ -1402,6 +1407,7 @@ export default {
self.tzdDrawingTop = 0
self.tzdDrawing_left = 0
self.tzdDrawing_top = 0
self.startPlace = 0
// 旋转角度同样恢复到0
self.inputRotationRange = 0;
// 事件不能连续重复执行，需要缓存时间
......@@ -1636,7 +1642,7 @@ export default {
// 小区域旋转
if (self.isTpdr_flag) {
console.warn(222222, self.inputRotationRange);
// console.warn(222222, self.inputRotationRange);
$(".small-drawing-img").css(
"transform",
`rotate(${self.inputRotationRange}deg)`
......@@ -1857,6 +1863,13 @@ export default {
// 缩放为1
self.zoomLevel = 1;
imageEditor.resetZoom();
imageEditor.resetFlip()
self.tzdDrawingLeft = 0
self.tzdDrawingTop = 0
self.tzdDrawing_left = 0
self.tzdDrawing_top = 0
self.startPlace = 0
self.sourceImage = sourceImage;
imageEditor
.loadImageFromURL(
......@@ -2257,7 +2270,6 @@ export default {
y: e.clientY,
left: self.imageEditor._graphics.getCanvasImage().left,
top: self.imageEditor._graphics.getCanvasImage().top,
};
// 开启拖拽
......@@ -2288,6 +2300,13 @@ export default {
x: e.clientX,
y: e.clientY
});
// 存储特征点的信息
self.tzdArr.push({
id: self.tzdId,
x: e.pageX - $(".tzdDrawing").offset().left - 4,
y: e.pageY - $(".tzdDrawing").offset().top - 4,
angle: 0,
});
// // 存储特征点的信息
// self.tzdArr.push({
// id: self.tzdId,
......@@ -2353,7 +2372,8 @@ export default {
if (self.startPlace >= 360) {
self.startPlace = 0;
}
const angle = -self.startPlace * Math.PI / 180.00;
// const angle = -self.startPlace * Math.PI / 180.0;
const angle = -self.imageEditor._graphics.getCanvasImage().angle * Math.PI / 180.0;
console.log(angle);
// 角度 * Math.PI / 180
const [x, y] = reverse(
......@@ -2365,23 +2385,47 @@ export default {
);
console.log(x, y);
$(`#tzd${self.tzdId}`).css(
"left",
x - 4 +
"px"
);
$(`#tzd${self.tzdId}`).css(
"top",
y - 4 +
"px"
);
if (self.imageEditor._graphics.getCanvasImage().flipX && !self.imageEditor._graphics.getCanvasImage().flipY) {
$(`#tzd${self.tzdId}`).css("left", self.canvasBox_width - (x + 4) + "px");
$(`#tzd${self.tzdId}`).css("top", (y - 4) + "px");
self.tzdArr.forEach(item => {
if (item.id == self.tzdId) {
item.x = self.canvasBox_width - (x + 4)
item.y = y - 4
}
})
} else if (self.imageEditor._graphics.getCanvasImage().flipY && !self.imageEditor._graphics.getCanvasImage().flipX) {
$(`#tzd${self.tzdId}`).css("left", x - 4 + "px");
$(`#tzd${self.tzdId}`).css("top", self.canvasBox_height - (y + 4) + "px");
self.tzdArr.forEach(item => {
if (item.id == self.tzdId) {
item.x = x - 4
item.y = self.canvasBox_height - (y + 4)
}
})
} else if (self.imageEditor._graphics.getCanvasImage().flipY && self.imageEditor._graphics.getCanvasImage().flipX) {
$(`#tzd${self.tzdId}`).css("left", self.canvasBox_width - (x + 4) + "px");
$(`#tzd${self.tzdId}`).css("top", self.canvasBox_height - (y + 4) + "px");
self.tzdArr.forEach(item => {
if (item.id == self.tzdId) {
item.x = self.canvasBox_width - (x + 4)
item.y = self.canvasBox_height - (y + 4)
}
})
} else {
$(`#tzd${self.tzdId}`).css("left", x - 4 + "px");
$(`#tzd${self.tzdId}`).css("top", y - 4 + "px");
}
// console.log(self.imageEditor._graphics.getCanvasImage());
$(`#tzd${self.tzdId}`).css("box-sizing", "border-box");
// 存储特征点的信息
self.tzdArr.push({
id: self.tzdId,
x: x - 4,
y: y - 4
});
// // 存储特征点的信息
// self.tzdArr.push({
// id: self.tzdId,
// x: x - 4,
// y: y - 4
// });
self.tzdnumber++
// self.tzdnumber = self.tzdArr.length;
}
......@@ -2498,7 +2542,8 @@ export default {
if (self.startPlace >= 360) {
self.startPlace = 0;
}
const angle = -self.startPlace * Math.PI / 180.00;
// const angle = -self.startPlace * Math.PI / 180.00;
const angle = -self.imageEditor._graphics.getCanvasImage().angle * Math.PI / 180.00;
console.log(angle);
// 角度 * Math.PI / 180
const [x, y] = reverse(
......@@ -2515,6 +2560,16 @@ export default {
);
centerX = x;
centerY = y;
// TODO
if (self.imageEditor._graphics.getCanvasImage().flipX && !self.imageEditor._graphics.getCanvasImage().flipY) {
centerX = self.canvasBox_width - centerX
} else if (self.imageEditor._graphics.getCanvasImage().flipY && !self.imageEditor._graphics.getCanvasImage().flipX) {
centerY = self.canvasBox_height - centerY
} else if (self.imageEditor._graphics.getCanvasImage().flipY && self.imageEditor._graphics.getCanvasImage().flipX) {
centerX = self.canvasBox_width - centerX
centerY = self.canvasBox_height - centerY
}
$(".tzdDrawing").append($circle);
$circle.css("border", "2px solid red");
$circle.css("position", "absolute");
......@@ -2838,9 +2893,50 @@ export default {
}
// console.log(self.startPlace, "原点 ");
let angle = self.imageEditor._graphics.getCanvasImage().angle
if (self.deg) {
$("#tzd" + self.tzdId).css("transform", `rotate(${-self.deg - self.startPlace}deg)`);
// obj.deg = deg - self.startPlace;
// $("#tzd" + self.tzdId).css("transform", `rotate(${-self.deg - self.startPlace}deg)`);
if (!self.imageEditor._graphics.getCanvasImage().flipY && self.imageEditor._graphics.getCanvasImage().flipX) {
$("#tzd" + self.tzdId).css(
"transform",
`rotate(${self.deg + angle + 180}deg)`
);
self.tzdArr.forEach(item => {
if (item.id == self.tzdId) {
item.angle = -(self.deg + angle + 180)
}
})
} else if (self.imageEditor._graphics.getCanvasImage().flipY && !self.imageEditor._graphics.getCanvasImage().flipX) {
$("#tzd" + self.tzdId).css(
"transform",
`rotate(${self.deg + angle}deg)`
);
self.tzdArr.forEach(item => {
if (item.id == self.tzdId) {
item.angle = -(self.deg + angle)
}
})
} else if (self.imageEditor._graphics.getCanvasImage().flipY && self.imageEditor._graphics.getCanvasImage().flipX) {
$("#tzd" + self.tzdId).css(
"transform",
`rotate(${-self.deg - angle - 180}deg)`
);
self.tzdArr.forEach(item => {
if (item.id == self.tzdId) {
item.angle = -(-self.deg - angle - 180)
}
})
} else {
$("#tzd" + self.tzdId).css(
"transform",
`rotate(${-self.deg - angle}deg)`
);
self.tzdArr.forEach(item => {
if (item.id == self.tzdId) {
item.angle = -(-self.deg - angle)
}
})
}
} else {
// console.log("无效的移动");
}
......@@ -2928,21 +3024,21 @@ export default {
// console.log(e);
if (self.isHandTZD) {
if (e.which === 1) {
if (self.deg) {
let objindex = self.tzdArr.findIndex((item) => {
return item.id == self.tzdId;
});
// self.$set(self.tzdArr[self.tzdId], 'angle', obj.deg)
self.tzdArr[objindex].angle = self.deg;
} else {
console.log(self.tzdArr);
console.log(self.tzdId);
let objindex = self.tzdArr.findIndex((item) => {
return item.id == self.tzdId;
});
// self.$set(self.tzdArr[objindex], 'angle', 0)
self.tzdArr[objindex].angle = 0;
}
// if (self.deg) {
// let objindex = self.tzdArr.findIndex((item) => {
// return item.id == self.tzdId;
// });
// // self.$set(self.tzdArr[self.tzdId], 'angle', obj.deg)
// self.tzdArr[objindex].angle = self.deg;
// } else {
// console.log(self.tzdArr);
// console.log(self.tzdId);
// let objindex = self.tzdArr.findIndex((item) => {
// return item.id == self.tzdId;
// });
// // self.$set(self.tzdArr[objindex], 'angle', 0)
// self.tzdArr[objindex].angle = 0;
// }
// self.tzdnumber++;
self.tzdFlag = false;
self.tzdId++;
......@@ -3144,7 +3240,7 @@ export default {
}
// irregular
$(".canvas-container").mousedown(function (e) {
$(".upper-canvas.irregular").mousedown(function (e) {
e.stopPropagation()
if (self.iszyhz && self.isZyhzFlag) {
// console.log(e);
......@@ -4355,9 +4451,9 @@ export default {
$(".blc").css("width", (3 / 5) * this.canvasWidth + "px");
$(".blc").css("height", (3 / 5) * this.canvasHeight + "px");
// 居中显示大手纹框
$(".blc").css("top", this.canvasBox_width/2-$(".blc").width()/2 + "px");
$(".blc").css("left", this.canvasBox_height/2-$(".blc").height()/2 + "px");
const curPicZoom=this.imageEditor.getZoom();
$(".blc").css("top", this.canvasBox_width / 2 - $(".blc").width() / 2 + "px");
$(".blc").css("left", this.canvasBox_height / 2 - $(".blc").height() / 2 + "px");
const curPicZoom = this.imageEditor.getZoom();
$(".blc_small").css(
"width",
......@@ -4914,24 +5010,24 @@ export default {
/**
* 初始化手纹框位置
*/
initSwk(isResetZwkPos){
initSwk (isResetZwkPos) {
// 设置大手纹框大小 （大图可视范围的3/5）
$(".blc").css("width", (3 / 5) * this.canvasBox_width + "px");
$(".blc").css("width", (3 / 5) * this.canvasBox_height + "px");
$(".blc").css("height", (3 / 5) * this.canvasBox_height + "px");
// 小手纹框大小
const curPicZoom=this.imageEditor.getZoom();
const curPicZoom = this.imageEditor.getZoom();
$(".blc_small").css(
"width",
($(".blc").width() * $(".small-drawing").width()) / this.canvasBox_width / curPicZoom + "px"
($(".blc").width() * $(".small-drawing").width()) / this.canvasBox_height / curPicZoom + "px"
);
$(".blc_small").css(
"height",
($(".blc").height() * $(".small-drawing").height()) / this.canvasBox_height / curPicZoom + "px"
);
if(isResetZwkPos){
if (isResetZwkPos) {
//手纹框置于屏幕中央
$(".blc").css("top", this.canvasBox_width/2-$(".blc").width()/2 + "px");
$(".blc").css("left", this.canvasBox_height/2-$(".blc").height()/2 + "px");
$(".blc").css("top", this.canvasBox_width / 2 - $(".blc").width() / 2 + "px");
$(".blc").css("left", this.canvasBox_height / 2 - $(".blc").height() / 2 + "px");
}
setTimeout((() => {
this.caclXzwkPos();
......@@ -4942,49 +5038,49 @@ export default {
* 计算小手纹框的位置信息
* 思路：计算手纹框和图片的相对位移
*/
caclXzwkPos(){
caclXzwkPos () {
// 小手纹框大小
const zoom=this.imageEditor.getZoom();
const zoom = this.imageEditor.getZoom();
// 得到大指纹框相对于视角中心的偏移值
console.log($(".blc").position());
const [dzwkOffsetX,dzwkOffsetY]=[$(".blc").position().left+$(".blc").width()/2-this.canvasBox_width /2,
$(".blc").position().top+$(".blc").width()/2-this.canvasBox_height /2]
const [dzwkOffsetX, dzwkOffsetY] = [$(".blc").position().left + $(".blc").width() / 2 - this.canvasBox_width / 2,
$(".blc").position().top + $(".blc").width() / 2 - this.canvasBox_height / 2]
// 计算视觉框和当前图片偏移量
const canvasImage=this.imageEditor._graphics.getCanvasImage();
const [picOffX,picOffY]=[(canvasImage.getCenterPoint().x- canvasImage.width / 2)/canvasImage.width * zoom * $(".tzdDrawing").width(),
(canvasImage.getCenterPoint().y- canvasImage.height / 2)/canvasImage.height * zoom * $(".tzdDrawing").height()]
const canvasImage = this.imageEditor._graphics.getCanvasImage();
const [picOffX, picOffY] = [(canvasImage.getCenterPoint().x - canvasImage.width / 2) / canvasImage.width * zoom * $(".tzdDrawing").width(),
(canvasImage.getCenterPoint().y - canvasImage.height / 2) / canvasImage.height * zoom * $(".tzdDrawing").height()]
// 大指纹框和图片中心的偏移量
const [dswkPicOffX,dswkPicOffY]=[picOffX-dzwkOffsetX,picOffY-dzwkOffsetY];
const [dswkPicOffX, dswkPicOffY] = [picOffX - dzwkOffsetX, picOffY - dzwkOffsetY];
// 新的小指纹框的偏移量
const [newXzwkOffsetX,newXzwkOffsetY]=[dswkPicOffX/zoom/this.canvasBox_width*$(".small-drawing").width(),
dswkPicOffY/zoom/this.canvasBox_height*$(".small-drawing").height()]
const [newXzwkOffsetX, newXzwkOffsetY] = [dswkPicOffX / zoom / this.canvasBox_width * $(".small-drawing").width(),
dswkPicOffY / zoom / this.canvasBox_height * $(".small-drawing").height()]
// 小指纹框位置
const [xzwkPosX,xzwkPosY]=[$(".small-drawing").width()/2-$(".blc_small").width()/2-newXzwkOffsetX,
$(".small-drawing").height()/2-$(".blc_small").height()/2-newXzwkOffsetY]
const [xzwkPosX, xzwkPosY] = [$(".small-drawing").width() / 2 - $(".blc_small").width() / 2 - newXzwkOffsetX,
$(".small-drawing").height() / 2 - $(".blc_small").height() / 2 - newXzwkOffsetY]
// 更改小指纹框位置
$(".blc_small").css("top",xzwkPosY+'px')
$(".blc_small").css("left",xzwkPosX+'px')
$(".blc_small").css("top", xzwkPosY + 'px')
$(".blc_small").css("left", xzwkPosX + 'px')
},
/**
* 计算大手纹框的位置信息
* 思路：计算手纹框和图片的相对位移
*/
caclDzwkPos(){
caclDzwkPos () {
// 小手纹框大小
const canvasImage=this.imageEditor._graphics.getCanvasImage();
const canvasImage = this.imageEditor._graphics.getCanvasImage();
// 获取小手纹框和小图的相对位移
const [xzwkOffsetX,xzwkOffsetY]=[ $(".small-drawing").width()/2-$(".blc_small").width()/2-$(".blc_small").position().left,
$(".small-drawing").height()/2-$(".blc_small").height()/2-$(".blc_small").position().top];
const [xzwkOffsetX, xzwkOffsetY] = [$(".small-drawing").width() / 2 - $(".blc_small").width() / 2 - $(".blc_small").position().left,
$(".small-drawing").height() / 2 - $(".blc_small").height() / 2 - $(".blc_small").position().top];
//大手纹框和视图框的位移
const [dzwkOffsetX,dzwkOffsetY]=[ this.canvasBox_width/2-$(".blc").width()/2-$(".blc").position().left,
this.canvasBox_height/2-$(".blc").height()/2-$(".blc").position().top];
const [dzwkOffsetX, dzwkOffsetY] = [this.canvasBox_width / 2 - $(".blc").width() / 2 - $(".blc").position().left,
this.canvasBox_height / 2 - $(".blc").height() / 2 - $(".blc").position().top];
//手纹框和视图框的位移（小图中）
const [xzwkOffsetXMini,xzwkOffsetYMini]=[dzwkOffsetX/this.canvasBox_width*$(".small-drawing").width(),
dzwkOffsetY/this.canvasBox_height*$(".small-drawing").height()]
const [xzwkOffsetXMini, xzwkOffsetYMini] = [dzwkOffsetX / this.canvasBox_width * $(".small-drawing").width(),
dzwkOffsetY / this.canvasBox_height * $(".small-drawing").height()]
//视图框的位移（小图中）
const [viewOffsetX,viewOffsetY]=[xzwkOffsetX+xzwkOffsetXMini,xzwkOffsetY+xzwkOffsetYMini]
const [viewOffsetX, viewOffsetY] = [xzwkOffsetX + xzwkOffsetXMini, xzwkOffsetY + xzwkOffsetYMini]
const [canvasOffsetX, canvasOffsetY] = [
(viewOffsetX / $(".small-drawing").width()) *
......@@ -5000,7 +5096,7 @@ export default {
];
const [canvasleft, canvastop] = [
canvasImage.left + canvasOffsetX - oldCanvasOffsetX,
canvasImage.top +canvasOffsetY - oldCanvasOffsetY,
canvasImage.top + canvasOffsetY - oldCanvasOffsetY,
];
this.imageEditor._graphics.setImageProperties(
......@@ -6676,20 +6772,28 @@ export default {
self.sessionCount++;
self.judgeJumpRoute()
}
})
}).catch(err => { })
let angle = self.imageEditor._graphics.getCanvasImage().angle
let canvasImage = self.imageEditor._graphics.getCanvasImage();
let flipX = canvasImage.flipY
let flipY = canvasImage.flipX
flipX = flipX ? 1 : 0
flipY = flipY ? 1 : 0
// 保存掌纹图片
this.$axios({
method: 'post',
url: `/api/upload/trait/case/palm/image?angle=${angle}&barcode=${self.barcode}&hpseqno=${self.seq}&bmpHeight=${self.newHeight}&bmpWidth=${self.newWidth}`
// /api/upload/trait/case/image?angle=0&barcode=A4301125000002021090002&hpseqno=1&turnX=1&turnY=1
url: `/api/upload/trait/case/palm/image?angle=${angle}&barcode=${self.barcode}&hpseqno=${self.seq}&turnX=${flipX}&turnY=${flipY}&bmpHeight=${self.newHeight}&bmpWidth=${self.newWidth}`
// url: `/api/upload/trait/case/palm/image?angle=${angle}&barcode=${self.barcode}&hpseqno=${self.seq}&bmpHeight=${self.newHeight}&bmpWidth=${self.newWidth}`
}).then(res => {
if (res.data.code === 0) {
self.$message.success("图片保存成功！");
} else {
self.$message.error("图片保存失败！");
}
})
}).catch(err => { })
} else {
// 指纹
// 处理指位信息
......@@ -6731,14 +6835,21 @@ export default {
self.sessionCount++;
self.judgeJumpRoute()
}
});
}).catch(err => { });
// 获取图像旋转的角度
let canvasImage_angle = self.imageEditor._graphics.getCanvasImage().angle;
let canvasImage = self.imageEditor._graphics.getCanvasImage();
let flipX = canvasImage.flipY
let flipY = canvasImage.flipX
flipX = flipX ? 1 : 0
flipY = flipY ? 1 : 0
this.$axios({
method: "post",
url: `/api/upload/trait/case/image?angle=${canvasImage_angle}&barcode=${self.barcode}&hpseqno=${self.seq}`,
// url: `/api/upload/trait/case/image?angle=${canvasImage_angle}&barcode=${self.barcode}&hpseqno=${self.seq}`,
url: `/api/upload/trait/case/image?angle=${canvasImage_angle}&barcode=${self.barcode}&hpseqno=${self.seq}&turnX=${flipX}&turnY=${flipY}&bmpHeight=${512}&bmpWidth=${512}`,
loading: false
}).then((res) => {
console.log(res);
......@@ -6748,7 +6859,8 @@ export default {
self.$message.error("图片保存失败！");
}
self.$store.commit('loading/setLoadingSd', false)
});
}).catch(err => { });
}
......
src/views/bzxxgl/fhxxLT.vue
<!--
* @Author: your name
* @Date: 2021-12-03 15:35:26
* @LastEditTime: 2021-12-17 15:57:54
* @LastEditTime: 2021-12-17 23:11:18
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: \指纹系统\founder_vue\src\views\bzxxgl\fhxxLT.vue
......@@ -350,6 +350,8 @@ export default {
}
})
}
} else {
self.$bus.emit('changImageEditTarget', 'xxx')
}
},
/**
......
src/views/cxyrd/TT.vue
......@@ -121,7 +121,7 @@
{{ scope.$index + 1 }}
</div>
</el-table-column>
<el-table-column prop="score" label="得分" :width="width1">
<el-table-column prop="score" label="得分" :width="!roleArr.includes('C-1-7')?'auto':width1">
<div
class="del"
slot-scope="scope"
......
src/views/cxyrd/modules/LLCandidate.vue
......@@ -65,7 +65,7 @@
</div>
</template>
</el-table-column>
<el-table-column prop="destseqno" label="序号" :width="width3">
<el-table-column prop="destseqno" label="序号" :width="!roleArr.includes('C-1-7')?'auto':width3">
<template slot-scope="scope">
<span v-if="scope.row.removeFlag === 1">
<del>{{
......
src/views/cxyrd/modules/LTCandidate.vue
......@@ -39,7 +39,7 @@
</span>
</template>
</el-table-column>
<el-table-column prop="destseqno" label="指位" :width="width3" :render-header="icons">
<el-table-column prop="destseqno" label="指位" :width="!roleArr.includes('C-1-7')?'auto':width3" :render-header="icons">
<template slot-scope="scope">
<span v-if="scope.row.removeFlag===1">
{{
......
src/views/cxyrd/modules/TLCandidate.vue
......@@ -22,7 +22,7 @@
</span>
</template>
</el-table-column>
<el-table-column label="序号" prop="destseqno" :width="width1">
<el-table-column label="序号" prop="destseqno" :width="!roleArr.includes('C-1-7')?'auto':width1">
<template slot-scope="scope">
<!-- 被删除-->
<span v-if="scope.row.removeFlag==1">
......
vue.config.js
/*
* @Author: your name
* @Date: 2021-09-07 09:57:48
* @LastEditTime: 2021-12-17 15:07:31
* @LastEditTime: 2021-12-17 23:04:51
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \指纹系统\founder_vue\vue.config.js
......@@ -91,14 +91,14 @@ module.exports = {
"/api": {
// target: "http://192.168.0.137:8080/", //统一的请求头部每次修改都要重启才会生效 http://39.99.224.27:8006/
// target: "http://192.168.128.166:8099/", // 张 认定
target: "http://192.168.128.114:8099", // 湖南-马
// target: "http://192.168.128.114:8099", // 湖南-马
// target: "http://192.168.128.116:8099", // 湖南-王
// target: "http://192.168.128.118:8764", // 湖南-张呈光
// target: "http://172.18.116.73:8099/", //统一的请求头部每次修改都要重启才会生效 http://39.99.224.27:8006/ ma
// target: "http://127.0.0.1:8099",
// target: "http://47.92.225.109:5602",
// target: "http://www.meetfood.cn:2390", // 湖南-线上
// target:"http://zwpt.xzclub.top:9333/",
target:"http://zwpt.xzclub.top:9333/",
// target: "http://192.168.128.115:8099", // 江
ws: true,
changeOrigin: true,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment