fix: 优化图片数据结构,调整画布初始化逻辑,修复样式细节

This commit is contained in:
bighuixiang
2025-08-02 00:07:51 +08:00
parent 6bc19bbc2e
commit 336a982bbf

View File

@@ -17,7 +17,10 @@ const imageData = [
name: "风景照片",
type: "风景",
imgList: [
{ url: "https://www.minio-api.aida.com.hk/aida-users/83/printboard/7a0cccfc-1e3c-4c38-af65-d6179f21a267.png?response-content-type=image%2Fpng&response-content-disposition=inline&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=admin%2F20250723%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20250723T025046Z&X-Amz-Expires=86400&X-Amz-SignedHeaders=host&X-Amz-Signature=3612d6c168207bebdae2fa7c7c2c86ea0f48358b99b8b41dec9e2ff15e197e15", name: "山景" },
{
url: "https://www.minio-api.aida.com.hk/aida-users/83/printboard/7a0cccfc-1e3c-4c38-af65-d6179f21a267.png?response-content-type=image%2Fpng&response-content-disposition=inline&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=admin%2F20250723%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20250723T025046Z&X-Amz-Expires=86400&X-Amz-SignedHeaders=host&X-Amz-Signature=3612d6c168207bebdae2fa7c7c2c86ea0f48358b99b8b41dec9e2ff15e197e15",
name: "山景",
},
{ url: "/src/assets/work/2.PNG", name: "海景" },
],
},
@@ -168,9 +171,9 @@ const changeFixedImage = () => {
const canvasInit = () => {
console.log("画布初始化完成");
// 可以在这里执行一些初始化逻辑
canvasEditor.value.changeFixedImage(clothingImageUrlInit, {
imageMode: "contains", // 设置底图包含在画布内
});
// canvasEditor.value.changeFixedImage(clothingImageUrlInit, {
// imageMode: "contains", // 设置底图包含在画布内
// });
};
const isShowLeft = ref(true);
@@ -276,7 +279,7 @@ body {
.app-container {
height: 100%;
// height: 100vh;
// height: 100vh;
display: flex;
flex-direction: column;
}
@@ -357,7 +360,7 @@ body {
.custom-tool-btn {
position: relative;
width: 3.5rem;
height: 3.5rem;
height: 3.5rem;
display: flex;
align-items: center;
justify-content: center;
@@ -386,9 +389,9 @@ height: 3.5rem;
transform: translateY(-50%);
background-color: rgba(0, 0, 0, 0.7);
color: white;
padding: .4rem .8rem;
border-radius: .4rem;
margin-left: .8rem;
padding: 0.4rem 0.8rem;
border-radius: 0.4rem;
margin-left: 0.8rem;
white-space: nowrap;
font-size: 1.2rem;
z-index: 10;
@@ -399,8 +402,8 @@ height: 3.5rem;
position: absolute;
top: 50%;
right: 100%;
margin-top: -.5rem;
border-width: .5rem;
margin-top: -0.5rem;
border-width: 0.5rem;
border-style: solid;
border-color: transparent rgba(0, 0, 0, 0.7) transparent transparent;
}