aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/StableVersion' into develop

Browse Source
This commit is contained in:
X1627315083
2024-09-25 11:07:49 +08:00
parent f840b03c0d
commit 309cdf16a9
33 changed files with 3462 additions and 748 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/component/HomePage/layout.vue
View File

@@ -30,7 +30,7 @@
</div>
<div class="layout_centent" :class="{active:flex_direction}" id="layoutCentent">
<div v-for="item,index in layoutList" :key="item" :class="moodbClassName[index]" class="modal_imgItem" v-layout="index" @mousedown="setpitch(item,index)" @touchstart="setpitch(item,index)" ref="content" >
<img crossOrigin="anonymous" :src="item.imgUrl" :style="{'transform':item.angle?`translate(-50%, -50%) scale(${item.zoom}) rotateZ(${item.angle}deg)`:`translate(-50%, -50%) scale(${item.zoom})`}" draggable="false" :class="moodbClassName[index]" v-modelImg>
<img crossOrigin="anonymous" :src="item.imgUrl" :style="{'transform':item.angle?`translate(-50%, -50%) scale(${item.zoom}) rotateZ(${item.angle}deg)`:`translate(-50%, -50%) scale(${item.zoom}) rotateZ(${item.angle}deg)`}" draggable="false" :class="moodbClassName[index]" v-modelImg>
<div>
</div>
@@ -39,7 +39,7 @@
<li class="layout_btn_bottom" v-compile.stop="'bottom'"></li>
<li class="layout_btn_left" v-compile.stop="'left'"></li>
<li class="layout_btn_right" v-compile.stop="'right'"></li>
<li class="layout_rotote" v-rotote.stop='item'></li>
<li class="layout_rotote" v-rotote.stop='item' :style="{'transform':`translate(-50%, -50%) rotateZ(${item.angle}deg)`}"></li>
<li class="layout_translate" v-translate.stop></li>
<!-- <li class="layout_translate" v-translate.stop></li> -->
<li class="layout_angle_tr" v-angle.stop = "'top'"></li>
@@ -372,7 +372,7 @@ export default defineComponent({
mounted(el,item){
let mouse = true;
let angle :any = 0
let num:any
let num:any = 1
let x = 0
let y = 0
let elParent = el.parentNode.parentNode
@@ -391,6 +391,8 @@ export default defineComponent({
var info = el.getBoundingClientRect();
let eX = info.x + info.width / 2;
let eY = info.y + info.height / 2;
num = item.value.zoom?item.value.zoom :1
angle = item.value.angle?item.value.angle:0
let mouseMove = function(event:MouseEvent){
let e:any = getMousePosition(event,false)
mouseMoveOperation(e)
@@ -406,8 +408,7 @@ export default defineComponent({
let x:any = e.clientX - X
let y:any = Y - e.clientY
angle = Math.atan2(x,y)*(180 / Math.PI)
elParent.firstElementChild.style.transform = "translate(-50%,-50%) scale("+ num + ") rotateZ("+ angle + "deg)"
el.style.transform = "translate(-50%,-50%) rotateZ("+ angle + "deg)"
item.value.angle = angle
}
};
@@ -432,25 +433,9 @@ export default defineComponent({
let timeSwitch = true
el.parentNode.addEventListener('mousemove', (e:MouseEvent) => {
el.parentNode.addEventListener('mousewheel',(e:MouseEvent) => {
if(document.defaultView){
let transform = document.defaultView.getComputedStyle(elParent.firstElementChild, null).transform.split('(')[1].split(',')
num = Number(transform[3])
}
num = item.value.zoom?item.value.zoom :1
angle = item.value.angle?item.value.angle:0
if(timeSwitch){
if(angle == 0){
function getRotationAngle(transformDom:any) {
if (!transformDom || transformDom === 'none') return null;
let transform = window.getComputedStyle(transformDom).transform;
const values = transform?.match(/matrix\(([^)]+)\)/);
if (values) {
const matrix = values[1].split(',').map(Number);
const angle = Math.atan2(matrix[1], matrix[0]) * (180 / Math.PI);
return angle >= 0 ? angle : angle + 360; // 确保角度为正值
}
return null;
}
angle = getRotationAngle(elParent.firstElementChild);
}
timeSwitch = false
if((e as WheelEvent).deltaY > 0){
if(num <= 1){
@@ -477,7 +462,6 @@ export default defineComponent({
let instance:any = item.instance
instance.moodItemScale = num * 100
item.value.zoom = num
elParent.firstElementChild.style.transform = "translate(-50%,-50%) scale("+ num + ") rotateZ("+ angle + "deg)"
}
});
});