Merge branch 'dev_vite' of http://18.167.251.121:10003/aidlab/aida_front into dev_vite
17
src/assets/icons/CHelp.svg
Normal file
@@ -0,0 +1,17 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
|
||||||
|
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
||||||
|
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="64.000000pt" height="64.000000pt" viewBox="0 0 64.000000 64.000000"
|
||||||
|
preserveAspectRatio="xMidYMid meet">
|
||||||
|
|
||||||
|
<g transform="translate(0.000000,64.000000) scale(0.100000,-0.100000)"
|
||||||
|
fill="#000000" stroke="none">
|
||||||
|
<path d="M223 622 c-109 -39 -178 -112 -210 -221 -29 -102 4 -228 82 -306 122
|
||||||
|
-121 328 -121 450 0 91 92 118 241 64 356 -69 146 -241 223 -386 171z m152
|
||||||
|
-146 c68 -29 73 -85 13 -154 -24 -27 -48 -57 -54 -67 -15 -27 -44 -12 -44 22
|
||||||
|
0 18 13 41 41 69 46 47 47 79 3 90 -28 7 -52 -9 -65 -44 -6 -17 -15 -22 -32
|
||||||
|
-20 -30 4 -33 38 -6 72 36 46 84 57 144 32z m-31 -278 c8 -14 7 -21 -6 -34
|
||||||
|
-30 -30 -75 9 -48 42 16 18 39 15 54 -8z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 847 B |
@@ -1 +1,19 @@
|
|||||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1747121290756" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="51598" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M829.888 739.392L547.84 457.28 706.112 364.8l-512-170.624L364.8 706.112l92.48-158.336 282.112 282.112z" p-id="51599"></path></svg>
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
|
||||||
|
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
||||||
|
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="64.000000pt" height="64.000000pt" viewBox="0 0 64.000000 64.000000"
|
||||||
|
preserveAspectRatio="xMidYMid meet">
|
||||||
|
|
||||||
|
<g transform="translate(0.000000,64.000000) scale(0.100000,-0.100000)"
|
||||||
|
fill="#000000" stroke="none">
|
||||||
|
<path d="M256 561 c-50 -51 -53 -71 -10 -71 23 0 24 -3 24 -60 l0 -60 -60 0
|
||||||
|
c-57 0 -60 1 -60 24 0 14 -5 28 -11 32 -14 8 -109 -84 -109 -106 0 -22 95
|
||||||
|
-114 109 -106 6 4 11 18 11 32 0 23 3 24 60 24 l60 0 0 -60 c0 -57 -1 -60 -24
|
||||||
|
-60 -14 0 -28 -5 -32 -11 -8 -14 84 -109 106 -109 22 0 114 95 106 109 -4 6
|
||||||
|
-18 11 -32 11 -23 0 -24 3 -24 60 l0 60 60 0 c57 0 60 -1 60 -24 0 -14 5 -28
|
||||||
|
11 -32 14 -8 109 84 109 106 0 22 -95 114 -109 106 -6 -4 -11 -18 -11 -32 0
|
||||||
|
-23 -3 -24 -60 -24 l-60 0 0 60 c0 57 1 60 24 60 14 0 28 5 32 11 8 14 -84
|
||||||
|
109 -106 109 -9 0 -37 -22 -64 -49z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 465 B After Width: | Height: | Size: 989 B |
60
src/assets/icons/editFrontBack.svg
Normal file
@@ -0,0 +1,60 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
|
||||||
|
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
||||||
|
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="405.000000pt" height="405.000000pt" viewBox="0 0 405.000000 405.000000"
|
||||||
|
preserveAspectRatio="xMidYMid meet">
|
||||||
|
|
||||||
|
<g transform="translate(0.000000,405.000000) scale(0.100000,-0.100000)"
|
||||||
|
fill="#000000" stroke="none">
|
||||||
|
<path d="M1385 3584 c-343 -47 -677 -124 -939 -214 -180 -62 -244 -94 -252
|
||||||
|
-124 -4 -18 13 -77 60 -203 36 -98 96 -263 134 -368 60 -168 71 -191 94 -199
|
||||||
|
20 -7 66 2 210 42 100 29 186 52 191 52 4 0 7 -485 7 -1078 0 -1033 1 -1080
|
||||||
|
18 -1095 17 -16 109 -17 1119 -17 1050 0 1101 1 1116 18 15 16 17 66 19 447
|
||||||
|
l3 429 119 36 c124 37 156 59 156 105 0 44 -33 67 -156 109 l-119 41 -3 503
|
||||||
|
c-1 345 1 502 8 502 6 0 92 -23 191 -52 143 -41 186 -49 207 -42 24 8 34 29
|
||||||
|
89 184 34 96 94 262 134 368 50 137 69 200 65 218 -8 30 -72 62 -252 124 -271
|
||||||
|
94 -596 167 -947 215 -179 24 -208 25 -645 24 -423 -1 -470 -3 -627 -25z
|
||||||
|
m1009 -131 c-12 -51 -55 -125 -100 -173 -141 -151 -397 -151 -538 0 -45 48
|
||||||
|
-88 122 -100 173 l-6 27 375 0 375 0 -6 -27z m-860 -25 c26 -163 199 -336 376
|
||||||
|
-377 110 -26 254 -6 354 47 116 62 233 215 252 330 8 50 3 49 166 26 294 -40
|
||||||
|
599 -110 853 -195 83 -27 157 -54 165 -59 13 -8 11 -20 -13 -87 -16 -43 -63
|
||||||
|
-172 -104 -288 -42 -115 -77 -211 -78 -213 -2 -2 -90 22 -196 53 -107 30 -202
|
||||||
|
55 -213 55 -11 0 -28 -7 -38 -17 -17 -15 -18 -46 -18 -555 0 -296 -3 -538 -8
|
||||||
|
-538 -4 0 -72 22 -150 48 -142 47 -143 48 -123 66 18 17 21 31 21 109 0 101
|
||||||
|
-12 127 -60 127 -50 0 -62 -27 -58 -134 2 -53 3 -96 2 -96 0 0 -40 13 -89 30
|
||||||
|
-100 34 -131 37 -162 15 -37 -26 -35 -54 17 -211 28 -81 50 -154 50 -161 0 -7
|
||||||
|
-10 -13 -22 -13 -50 0 -76 -63 -41 -102 11 -13 30 -18 64 -18 l48 0 81 -250
|
||||||
|
c85 -263 95 -280 151 -280 53 0 67 24 130 235 50 168 65 204 90 228 60 56 59
|
||||||
|
63 59 -333 l0 -360 -1015 0 -1015 0 0 1087 c0 997 -1 1088 -17 1105 -9 10 -26
|
||||||
|
18 -37 18 -12 0 -108 -25 -215 -55 -106 -31 -194 -55 -196 -53 -1 2 -36 98
|
||||||
|
-78 213 -41 116 -88 245 -104 288 -24 67 -26 79 -13 87 30 19 318 110 455 144
|
||||||
|
235 59 586 123 686 125 35 1 37 0 43 -41z"/>
|
||||||
|
<path d="M1410 2700 c-25 -25 -25 -51 -1 -81 16 -19 30 -24 90 -27 110 -6 151
|
||||||
|
12 151 67 0 49 -26 61 -128 61 -79 0 -95 -3 -112 -20z"/>
|
||||||
|
<path d="M1747 2702 c-21 -23 -22 -66 -1 -86 22 -23 55 -29 135 -24 60 3 74 8
|
||||||
|
90 27 24 30 24 56 -1 81 -17 17 -33 20 -113 20 -78 0 -97 -3 -110 -18z"/>
|
||||||
|
<path d="M2080 2700 c-25 -25 -25 -51 -1 -81 16 -19 30 -24 90 -27 110 -6 151
|
||||||
|
12 151 67 0 49 -26 61 -128 61 -79 0 -95 -3 -112 -20z"/>
|
||||||
|
<path d="M2417 2702 c-21 -23 -22 -66 -1 -86 22 -23 55 -29 135 -24 60 3 74 8
|
||||||
|
90 27 24 30 24 56 -1 81 -17 17 -33 20 -113 20 -78 0 -97 -3 -110 -18z"/>
|
||||||
|
<path d="M1286 2574 c-12 -12 -16 -37 -16 -109 0 -86 2 -95 22 -109 30 -21 54
|
||||||
|
-20 78 4 17 17 20 33 20 108 0 73 -3 92 -18 105 -23 21 -66 22 -86 1z"/>
|
||||||
|
<path d="M2677 2572 c-13 -14 -17 -39 -17 -105 0 -74 3 -90 20 -107 24 -24 48
|
||||||
|
-25 78 -4 20 14 22 23 22 109 0 72 -4 97 -16 109 -21 22 -67 20 -87 -2z"/>
|
||||||
|
<path d="M1292 2264 c-20 -14 -22 -23 -22 -109 0 -104 10 -125 59 -125 48 0
|
||||||
|
61 26 61 123 0 74 -3 90 -20 107 -24 24 -48 25 -78 4z"/>
|
||||||
|
<path d="M2680 2260 c-17 -17 -20 -33 -20 -108 0 -98 12 -122 63 -122 47 0 57
|
||||||
|
22 57 125 0 86 -2 95 -22 109 -30 21 -54 20 -78 -4z"/>
|
||||||
|
<path d="M1287 1942 c-26 -28 -24 -192 1 -215 24 -22 65 -21 85 1 26 28 24
|
||||||
|
192 -1 215 -24 22 -65 21 -85 -1z"/>
|
||||||
|
<path d="M1310 1643 c-32 -11 -40 -37 -40 -129 0 -85 2 -94 22 -108 30 -21 54
|
||||||
|
-20 78 4 17 17 20 33 20 109 0 85 -1 91 -26 110 -28 22 -30 23 -54 14z"/>
|
||||||
|
<path d="M1410 1370 c-24 -24 -25 -48 -4 -78 14 -20 23 -22 113 -22 108 0 131
|
||||||
|
11 131 62 0 46 -27 58 -128 58 -79 0 -95 -3 -112 -20z"/>
|
||||||
|
<path d="M1747 1372 c-22 -24 -21 -65 1 -85 15 -13 39 -17 115 -17 88 0 97 2
|
||||||
|
111 22 21 30 20 54 -4 78 -17 17 -33 20 -113 20 -78 0 -97 -3 -110 -18z"/>
|
||||||
|
<path d="M2080 1370 c-24 -24 -25 -48 -4 -78 14 -20 23 -22 113 -22 108 0 131
|
||||||
|
11 131 62 0 46 -27 58 -128 58 -79 0 -95 -3 -112 -20z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.8 KiB |
@@ -1816,13 +1816,11 @@ textarea:focus {
|
|||||||
.accountEdit_page .input_border,
|
.accountEdit_page .input_border,
|
||||||
.generalMenu_printModel_upload .input_border,
|
.generalMenu_printModel_upload .input_border,
|
||||||
.generate .input_border {
|
.generate .input_border {
|
||||||
z-index: 2;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding-bottom: calc(2rem*1.2);
|
padding-bottom: calc(2rem*1.2);
|
||||||
top: 0;
|
top: 0;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
z-index: 6;
|
|
||||||
--width: 65%;
|
--width: 65%;
|
||||||
}
|
}
|
||||||
.collection_modal_body .input_border .input_box,
|
.collection_modal_body .input_border .input_box,
|
||||||
@@ -1836,7 +1834,6 @@ textarea:focus {
|
|||||||
.generalMenu_printModel_upload .input_border .input_box,
|
.generalMenu_printModel_upload .input_border .input_box,
|
||||||
.generate .input_border .input_box {
|
.generate .input_border .input_box {
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 6;
|
|
||||||
flex: 1;
|
flex: 1;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -2210,7 +2207,6 @@ textarea:focus {
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: all 0.3s;
|
transition: all 0.3s;
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 4;
|
|
||||||
width: 4rem;
|
width: 4rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
min-height: 3rem;
|
min-height: 3rem;
|
||||||
|
|||||||
@@ -1974,17 +1974,17 @@ textarea:focus{
|
|||||||
//设计input和上传按钮样式
|
//设计input和上传按钮样式
|
||||||
.collection_modal_body,.design_detail_modal_component,.library_page,.productImg_content,.poseTransfer,.scaleImage_modal,.editDesignType_modal,.accountEdit_page,.generalMenu_printModel_upload,.generate{
|
.collection_modal_body,.design_detail_modal_component,.library_page,.productImg_content,.poseTransfer,.scaleImage_modal,.editDesignType_modal,.accountEdit_page,.generalMenu_printModel_upload,.generate{
|
||||||
.input_border{
|
.input_border{
|
||||||
z-index: 2;
|
// z-index: 2;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding-bottom: calc(2rem*1.2);
|
padding-bottom: calc(2rem*1.2);
|
||||||
top: 0;
|
top: 0;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
z-index: 6;
|
// z-index: 6;
|
||||||
--width:65%;
|
--width:65%;
|
||||||
.input_box{
|
.input_box{
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 6;
|
// z-index: 6;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -2150,7 +2150,6 @@ textarea:focus{
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: all .3s;
|
transition: all .3s;
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 4;
|
|
||||||
width: 4rem;
|
width: 4rem;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 1.2 MiB |
|
Before Width: | Height: | Size: 43 KiB |
|
Before Width: | Height: | Size: 2.9 MiB |
|
Before Width: | Height: | Size: 987 KiB |
|
Before Width: | Height: | Size: 42 KiB |
|
Before Width: | Height: | Size: 588 KiB |
|
Before Width: | Height: | Size: 1.2 MiB |
|
Before Width: | Height: | Size: 29 KiB |
|
Before Width: | Height: | Size: 127 KiB |
|
Before Width: | Height: | Size: 57 KiB |
|
Before Width: | Height: | Size: 801 KiB |
|
Before Width: | Height: | Size: 2.1 MiB |
|
Before Width: | Height: | Size: 1.1 MiB |
|
Before Width: | Height: | Size: 223 KiB |
|
Before Width: | Height: | Size: 288 KiB |
|
Before Width: | Height: | Size: 206 KiB |
|
Before Width: | Height: | Size: 88 KiB |
@@ -328,6 +328,9 @@ const handleToolClick = (tool) => {
|
|||||||
style="width: 0; height: 0; opacity: 0"
|
style="width: 0; height: 0; opacity: 0"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
<slot name="customToolsTop" :tool-button-props="{ activeTool, canUndo, canRedo }" />
|
||||||
|
|
||||||
|
|
||||||
<ToolButton
|
<ToolButton
|
||||||
v-for="tool in toolsList"
|
v-for="tool in toolsList"
|
||||||
:key="tool.id"
|
:key="tool.id"
|
||||||
@@ -339,7 +342,7 @@ const handleToolClick = (tool) => {
|
|||||||
/>
|
/>
|
||||||
|
|
||||||
<!-- 自定义工具栏按钮插槽 -->
|
<!-- 自定义工具栏按钮插槽 -->
|
||||||
<slot name="customTools" :tool-button-props="{ activeTool, canUndo, canRedo }" />
|
<slot name="customToolsBottom" :tool-button-props="{ activeTool, canUndo, canRedo }" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -354,6 +357,8 @@ const handleToolClick = (tool) => {
|
|||||||
user-select: none;
|
user-select: none;
|
||||||
min-width: 5.8rem;
|
min-width: 5.8rem;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
/* overflow-y: auto; */
|
||||||
|
/* overflow-x: hidden; */
|
||||||
}
|
}
|
||||||
|
|
||||||
.red-green-mode {
|
.red-green-mode {
|
||||||
|
|||||||
@@ -1043,9 +1043,12 @@ defineExpose({
|
|||||||
@zoom-out="zoomOut"
|
@zoom-out="zoomOut"
|
||||||
@undo-redo-status-changed="changeCanvas"
|
@undo-redo-status-changed="changeCanvas"
|
||||||
>
|
>
|
||||||
|
<template #customToolsTop="{ toolTopProps }">
|
||||||
|
<slot name="customToolsTop" :tool-button-props="toolTopProps" />
|
||||||
|
</template>
|
||||||
<!-- 扩展插槽 -->
|
<!-- 扩展插槽 -->
|
||||||
<template #customTools="{ toolButtonProps }">
|
<template #customToolsBottom="{ toolButtonProps }">
|
||||||
<slot name="customTools" :tool-button-props="toolButtonProps" />
|
<slot name="customToolsBottom" :tool-button-props="toolButtonProps" />
|
||||||
</template>
|
</template>
|
||||||
</ToolsSidebar>
|
</ToolsSidebar>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -349,18 +349,18 @@ const handleImageError = (event) => {
|
|||||||
/* 图片网格 */
|
/* 图片网格 */
|
||||||
.image-grid {
|
.image-grid {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
|
grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
|
||||||
gap: 16px;
|
gap: 16px;
|
||||||
min-height: 200px;
|
min-height: 20rem;
|
||||||
max-height: 500px;
|
max-height: 50rem;
|
||||||
|
|
||||||
@media screen and (max-width: 768px) {
|
@media screen and (max-width: 768px) {
|
||||||
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
|
grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
|
||||||
gap: 12px;
|
gap: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 480px) {
|
@media screen and (max-width: 48rem) {
|
||||||
grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
|
grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
|
||||||
gap: 10px;
|
gap: 10px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -387,7 +387,7 @@ const handleImageError = (event) => {
|
|||||||
.image-wrapper {
|
.image-wrapper {
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 220px;
|
height: 22rem;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
img {
|
img {
|
||||||
|
|||||||
@@ -218,7 +218,7 @@ const isShowLeft = ref(true);
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<!-- 使用插槽添加自定义工具栏按钮 -->
|
<!-- 使用插槽添加自定义工具栏按钮 -->
|
||||||
<template #customTools="{ toolButtonProps }">
|
<template #customToolsBottom="{ toolButtonProps }">
|
||||||
<!-- 分隔线 -->
|
<!-- 分隔线 -->
|
||||||
<div class="tool-separator"></div>
|
<div class="tool-separator"></div>
|
||||||
|
|
||||||
|
|||||||
@@ -59,7 +59,7 @@
|
|||||||
:key="positionKey"
|
:key="positionKey"
|
||||||
@canvasReload="canvasReload"
|
@canvasReload="canvasReload"
|
||||||
@detailEdit="detailEdit"
|
@detailEdit="detailEdit"
|
||||||
@addSketch="()=>isEditPattern.value=false"
|
@addSketch="()=>isEditPattern.value = ''"
|
||||||
@revocation="revocation"
|
@revocation="revocation"
|
||||||
@oppositeRevocation="oppositeRevocation"
|
@oppositeRevocation="oppositeRevocation"
|
||||||
></model>
|
></model>
|
||||||
@@ -87,7 +87,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="contentRight" v-if="selectDetail && selectDetail.id && currentDetailType && isEditPattern.value">
|
<div class="contentRight" v-if="selectDetail && selectDetail.id && currentDetailType && isEditPattern.value">
|
||||||
<canvasBox ref="canvasBox" :key="canvasKey"></canvasBox>
|
<canvasBox ref="canvasBox" :key="canvasKey || isEditPattern.value" :isEditPattern="isEditPattern.value"></canvasBox>
|
||||||
</div>
|
</div>
|
||||||
<!-- 画布 -->
|
<!-- 画布 -->
|
||||||
<!-- <div class="content" v-else-if="selectDetail && selectDetail.id">
|
<!-- <div class="content" v-else-if="selectDetail && selectDetail.id">
|
||||||
@@ -144,7 +144,7 @@ export default defineComponent({
|
|||||||
oppositeRevocationShow:-1,
|
oppositeRevocationShow:-1,
|
||||||
revocationShow:-1,
|
revocationShow:-1,
|
||||||
isEditPattern:{
|
isEditPattern:{
|
||||||
value:false,
|
value:'' as any,
|
||||||
},// 是否编辑图案
|
},// 是否编辑图案
|
||||||
canvasKey:0,
|
canvasKey:0,
|
||||||
singleOveral:{
|
singleOveral:{
|
||||||
@@ -421,11 +421,18 @@ export default defineComponent({
|
|||||||
store.dispatch('DesignDetail/setSubmit',data)
|
store.dispatch('DesignDetail/setSubmit',data)
|
||||||
}
|
}
|
||||||
const detailEdit = async (str:any)=>{
|
const detailEdit = async (str:any)=>{
|
||||||
if(str == 'edit'){
|
if(str){
|
||||||
if(detailData.isEditPattern.value){
|
if(detailData.isEditPattern.value && detailData.isEditPattern.value == str){
|
||||||
await detailDom.canvasBox.saveCanvas()
|
await detailDom.canvasBox.saveCanvas()
|
||||||
|
detailData.isEditPattern.value = ''
|
||||||
|
}else{
|
||||||
|
if(detailData.isEditPattern.value){
|
||||||
|
detailDom.canvasBox.editFront(str)
|
||||||
|
}
|
||||||
|
detailData.isEditPattern.value = str
|
||||||
}
|
}
|
||||||
detailData.isEditPattern.value = !detailData.isEditPattern.value
|
}else{
|
||||||
|
detailData.isEditPattern.value = ''
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const canvasReload = async ()=>{
|
const canvasReload = async ()=>{
|
||||||
|
|||||||
@@ -16,11 +16,16 @@
|
|||||||
imageMode:'contains',
|
imageMode:'contains',
|
||||||
}"
|
}"
|
||||||
ref="editCanvas">
|
ref="editCanvas">
|
||||||
<template #customTools="{ toolButtonProps }">
|
|
||||||
|
<template #customToolsBottom="{ toolButtonProps }">
|
||||||
<!-- 也可以直接使用普通的按钮 -->
|
<!-- 也可以直接使用普通的按钮 -->
|
||||||
<div class="custom-tool-btn" :class="{active:currentView === 'redGreenExample'}" @click="editFront('redGreenExample')">
|
<div class="custom-tool-btn" :class="{active:currentView === 'redGreenExample'}" @click="editFront('redGreenExample')">
|
||||||
<i class="fi fi-sr-layers"></i>
|
<i class="fi fi-sr-layers"></i>
|
||||||
<div class="tool-tooltip">Edit the front and back sections</div>
|
<div class="tool-tooltip">{{ $t('Canvas.editFrontBack') }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="custom-tool-btn" :class="{active:currentView === 'redGreenExample'}" style="margin-top: auto;" @click="editFront('redGreenExample')">
|
||||||
|
<SvgIcon name="CHelp" size="30" />
|
||||||
|
<div class="tool-tooltip">{{ $t('Canvas.help') }}</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</editCanvas>
|
</editCanvas>
|
||||||
@@ -35,19 +40,14 @@
|
|||||||
</editFrontBack> -->
|
</editFrontBack> -->
|
||||||
<editCanvas v-if="canvasLoad" :config="canvasConfig"
|
<editCanvas v-if="canvasLoad" :config="canvasConfig"
|
||||||
:enabledRedGreenMode="true"
|
:enabledRedGreenMode="true"
|
||||||
:clothingImageUrl="selectDetail.path"
|
@canvasInit="canvasInit"
|
||||||
|
:clothingImageUrl="selectDetail.undividedLayer || selectDetail.path"
|
||||||
:redGreenImageUrl="frontBack.front[imgDomIndex].maskUrl"
|
:redGreenImageUrl="frontBack.front[imgDomIndex].maskUrl"
|
||||||
@trigger-red-green-mouseup="frontBackChange"
|
@trigger-red-green-mouseup="frontBackChange"
|
||||||
:clothing-image-opts="{
|
:clothing-image-opts="{
|
||||||
imageMode:'contains',
|
imageMode:'contains',
|
||||||
}"
|
}"
|
||||||
ref="editCanvasBackFront">
|
ref="editCanvasBackFront">
|
||||||
<template #customTools="{ toolButtonProps }">
|
|
||||||
<div class="custom-tool-btn" :class="{active:currentView === 'redGreenExample'}" @click="editFront('canvasEditor')">
|
|
||||||
<i class="fi fi-sr-layers"></i>
|
|
||||||
<div class="tool-tooltip">Edit the front and back sections</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</editCanvas>
|
</editCanvas>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -79,6 +79,10 @@ export default defineComponent({
|
|||||||
editCanvas
|
editCanvas
|
||||||
},
|
},
|
||||||
props:{
|
props:{
|
||||||
|
isEditPattern:{
|
||||||
|
type:String,
|
||||||
|
default:''
|
||||||
|
}
|
||||||
},
|
},
|
||||||
setup(props,{emit}) {
|
setup(props,{emit}) {
|
||||||
const store = useStore();
|
const store = useStore();
|
||||||
@@ -106,7 +110,7 @@ export default defineComponent({
|
|||||||
canvasLoad:false,
|
canvasLoad:false,
|
||||||
canvasConfig:{
|
canvasConfig:{
|
||||||
} as any,
|
} as any,
|
||||||
currentView:'',
|
currentView:props.isEditPattern,
|
||||||
getCanvasIfEdit:inject('getCanvasIfEdit')as any,
|
getCanvasIfEdit:inject('getCanvasIfEdit')as any,
|
||||||
canvasInstance:null as any,
|
canvasInstance:null as any,
|
||||||
canvasJSON:'',
|
canvasJSON:'',
|
||||||
@@ -117,6 +121,7 @@ export default defineComponent({
|
|||||||
},{immediate: true})
|
},{immediate: true})
|
||||||
provide('isShowMark',detailData.isShowMark)
|
provide('isShowMark',detailData.isShowMark)
|
||||||
provide('canvasType',detailData.canvasType)
|
provide('canvasType',detailData.canvasType)
|
||||||
|
|
||||||
const editFront = (str:any)=>{//编辑前后片
|
const editFront = (str:any)=>{//编辑前后片
|
||||||
|
|
||||||
let canvasJSON = '' as any
|
let canvasJSON = '' as any
|
||||||
@@ -193,7 +198,7 @@ export default defineComponent({
|
|||||||
let front = detailData.frontBack.front[detailData.imgDomIndex]
|
let front = detailData.frontBack.front[detailData.imgDomIndex]
|
||||||
let back = detailData.frontBack.back[detailData.imgDomIndex]
|
let back = detailData.frontBack.back[detailData.imgDomIndex]
|
||||||
if(!front?.oldImageUrl)front.oldImageUrl = front.imageUrl
|
if(!front?.oldImageUrl)front.oldImageUrl = front.imageUrl
|
||||||
if(!front?.oldMaskUrl)front.oldMaskUrl = front.imageUrl
|
if(!front?.oldMaskUrl)front.oldMaskUrl = front.maskUrl
|
||||||
if(!back?.oldImageUrl)back.oldImageUrl = back.imageUrl
|
if(!back?.oldImageUrl)back.oldImageUrl = back.imageUrl
|
||||||
if(!front?.oldMaskUrl)store.commit('DesignDetail/updataDetailItem',{maskUrl:front.oldMaskUrl})
|
if(!front?.oldMaskUrl)store.commit('DesignDetail/updataDetailItem',{maskUrl:front.oldMaskUrl})
|
||||||
|
|
||||||
@@ -258,9 +263,11 @@ export default defineComponent({
|
|||||||
onBeforeUnmount(()=>{
|
onBeforeUnmount(()=>{
|
||||||
let front = detailData.frontBack.front[detailData.imgDomIndex]
|
let front = detailData.frontBack.front[detailData.imgDomIndex]
|
||||||
let back = detailData.frontBack.back[detailData.imgDomIndex]
|
let back = detailData.frontBack.back[detailData.imgDomIndex]
|
||||||
|
|
||||||
if(front?.oldImageUrl)front.imageUrl = front.oldImageUrl
|
if(front?.oldImageUrl)front.imageUrl = front.oldImageUrl
|
||||||
if(front?.oldMaskUrl)front.maskUrl = front.oldMaskUrl
|
if(front?.oldMaskUrl)front.maskUrl = front.oldMaskUrl
|
||||||
if(back?.oldImageUrl)back.imageUrl = back.oldImageUrl
|
if(back?.oldImageUrl)back.imageUrl = back.oldImageUrl
|
||||||
|
console.log(front)
|
||||||
if(front?.oldMaskUrl)store.commit('DesignDetail/updataDetailItem',{maskUrl:front.oldMaskUrl})
|
if(front?.oldMaskUrl)store.commit('DesignDetail/updataDetailItem',{maskUrl:front.oldMaskUrl})
|
||||||
|
|
||||||
sessionStorage.removeItem('frontBackEdit');
|
sessionStorage.removeItem('frontBackEdit');
|
||||||
@@ -270,9 +277,7 @@ export default defineComponent({
|
|||||||
})
|
})
|
||||||
onMounted(()=>{
|
onMounted(()=>{
|
||||||
nextTick(async ()=>{
|
nextTick(async ()=>{
|
||||||
detailData.currentView = 'canvasEditor'
|
// detailData.currentView = 'canvasEditor'
|
||||||
setTimeout(()=>{
|
|
||||||
})
|
|
||||||
if(detailData.selectDetail.canvasId){
|
if(detailData.selectDetail.canvasId){
|
||||||
detailData.isShowMark = true
|
detailData.isShowMark = true
|
||||||
await new Promise((resolve, reject) => {
|
await new Promise((resolve, reject) => {
|
||||||
|
|||||||
@@ -122,10 +122,11 @@ export default defineComponent({
|
|||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-radius: .5rem;
|
border-radius: .5rem;
|
||||||
// border: 1px dashed #202020;
|
border: 1px solid #000;
|
||||||
border: 1px dashed transparent;
|
// border: 1px dashed transparent;
|
||||||
|
border-radius: 1.5rem;
|
||||||
background: linear-gradient(#fff, #fff) padding-box,repeating-linear-gradient(-45deg,#fff 0,#fff 0.3em, #000 0,#000 0.6em);
|
background: linear-gradient(#fff, #fff) padding-box,repeating-linear-gradient(-45deg,#fff 0,#fff 0.3em, #000 0,#000 0.6em);
|
||||||
margin-bottom: 3rem;
|
margin-bottom: 1.4rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|||||||
@@ -100,11 +100,12 @@ export default defineComponent({
|
|||||||
padding: 1rem 0;
|
padding: 1rem 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-radius: .5rem;
|
border-radius: .5rem;
|
||||||
// border: 1px dashed #202020;
|
border: 1px solid #000;
|
||||||
border: 1px dashed transparent;
|
// border: 1px dashed transparent;
|
||||||
|
border-radius: 1.5rem;
|
||||||
position: relative;
|
position: relative;
|
||||||
background: linear-gradient(#fff, #fff) padding-box,repeating-linear-gradient(-45deg,#fff 0,#fff 0.3em, #000 0,#000 0.6em);
|
background: linear-gradient(#fff, #fff) padding-box,repeating-linear-gradient(-45deg,#fff 0,#fff 0.3em, #000 0,#000 0.6em);
|
||||||
margin-bottom: 3rem;
|
margin-bottom: 1.4rem;
|
||||||
> img{
|
> img{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|||||||
@@ -105,9 +105,9 @@ export default defineComponent({
|
|||||||
align-content: flex-start;
|
align-content: flex-start;
|
||||||
&::-webkit-scrollbar{display: none;}
|
&::-webkit-scrollbar{display: none;}
|
||||||
> .content_img_item{
|
> .content_img_item{
|
||||||
|
width: calc((50% - 1rem));
|
||||||
> .content_img_item_block{
|
> .content_img_item_block{
|
||||||
width: calc((34rem - 2rem) / 2);
|
aspect-ratio: 1/1;
|
||||||
height: calc((34rem - 2rem) / 2);
|
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
|
|
||||||
@@ -119,16 +119,6 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
> .material_content_list_loding{
|
|
||||||
width: 100%;
|
|
||||||
height: calc((34rem - 2rem) / 2);
|
|
||||||
}
|
|
||||||
> .upload_item{
|
|
||||||
width: calc((34rem - 2rem) / 2);
|
|
||||||
height: calc((34rem - 2rem) / 2);
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -349,9 +349,9 @@ export default defineComponent({
|
|||||||
align-content: flex-start;
|
align-content: flex-start;
|
||||||
&::-webkit-scrollbar{display: none;}
|
&::-webkit-scrollbar{display: none;}
|
||||||
> .content_img_item{
|
> .content_img_item{
|
||||||
|
width: calc((50% - 1rem));
|
||||||
> .content_img_item_block{
|
> .content_img_item_block{
|
||||||
width: calc((34rem - 2rem) / 2);
|
aspect-ratio: 1/1;
|
||||||
height: calc((34rem - 2rem) / 2);
|
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
@@ -364,7 +364,7 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
> .material_content_list_loding{
|
> .material_content_list_loding{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: calc((34rem - 2rem) / 2);
|
aspect-ratio: 1/1;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
> img{
|
> img{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="selectList">
|
<div class="selectList">
|
||||||
<div class="selectList_header">
|
<div class="selectList_header" :class="{'element': type == 'element'}">
|
||||||
<div class="switch_type_list" v-if="type != 'element'">
|
<div class="switch_type_list" v-if="type != 'element'">
|
||||||
<div
|
<div
|
||||||
@click.stop="openCurrent()"
|
@click.stop="openCurrent()"
|
||||||
@@ -161,10 +161,16 @@ export default defineComponent({
|
|||||||
height: auto;
|
height: auto;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
border-radius: 1.5rem;
|
||||||
|
border: 1px solid #000;
|
||||||
|
padding: 1rem;
|
||||||
> .selectList_header{
|
> .selectList_header{
|
||||||
margin-bottom: 2.5rem;
|
margin-bottom: 2.5rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
&.element{
|
||||||
|
margin-bottom: 0rem;
|
||||||
|
}
|
||||||
> .switch_type_list{
|
> .switch_type_list{
|
||||||
display: flex;
|
display: flex;
|
||||||
> .switch_type_item:last-child{
|
> .switch_type_item:last-child{
|
||||||
|
|||||||
@@ -199,9 +199,9 @@ export default defineComponent({
|
|||||||
align-content: flex-start;
|
align-content: flex-start;
|
||||||
&::-webkit-scrollbar{display: none;}
|
&::-webkit-scrollbar{display: none;}
|
||||||
> .content_img_item{
|
> .content_img_item{
|
||||||
|
width: calc((50% - 1rem));
|
||||||
> .content_img_item_block{
|
> .content_img_item_block{
|
||||||
width: calc((34rem - 2rem) / 2);
|
aspect-ratio: 1/1;
|
||||||
height: calc((34rem - 2rem) / 2);
|
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
|
|
||||||
@@ -215,11 +215,11 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
> .material_content_list_loding{
|
> .material_content_list_loding{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: calc((34rem - 2rem) / 2);
|
aspect-ratio: 1/1;
|
||||||
}
|
}
|
||||||
> .upload_item{
|
> .upload_item{
|
||||||
width: calc((34rem - 2rem) / 2);
|
width: calc((50% - 1rem));
|
||||||
height: calc((34rem - 2rem) / 2);
|
aspect-ratio: 1/1;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -262,9 +262,10 @@ import sketchCategory from "@/component/HomePage/sketchCategory.vue";
|
|||||||
align-content: flex-start;
|
align-content: flex-start;
|
||||||
&::-webkit-scrollbar{display: none;}
|
&::-webkit-scrollbar{display: none;}
|
||||||
> .content_img_item{
|
> .content_img_item{
|
||||||
|
width: calc((50% - 1rem));
|
||||||
> .content_img_item_block{
|
> .content_img_item_block{
|
||||||
width: calc((34rem - 2rem) / 2);
|
width: 100%;
|
||||||
height: calc((34rem - 2rem) / 2);
|
aspect-ratio: 1/1;
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
margin: 1rem;
|
margin: 1rem;
|
||||||
@@ -279,11 +280,11 @@ import sketchCategory from "@/component/HomePage/sketchCategory.vue";
|
|||||||
}
|
}
|
||||||
> .material_content_list_loding{
|
> .material_content_list_loding{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: calc((34rem - 2rem) / 2);
|
aspect-ratio: 1/1;
|
||||||
}
|
}
|
||||||
> .upload_item{
|
> .upload_item{
|
||||||
width: calc((34rem - 2rem) / 2);
|
width: calc((50% - 1rem));
|
||||||
height: calc((34rem - 2rem) / 2);
|
aspect-ratio: 1/1;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
.upload{
|
.upload{
|
||||||
|
|||||||
@@ -145,9 +145,9 @@ export default defineComponent({
|
|||||||
align-content: flex-start;
|
align-content: flex-start;
|
||||||
&::-webkit-scrollbar{display: none;}
|
&::-webkit-scrollbar{display: none;}
|
||||||
> .content_img_item{
|
> .content_img_item{
|
||||||
|
width: calc((50% - 1rem));
|
||||||
> .content_img_item_block{
|
> .content_img_item_block{
|
||||||
width: calc((34rem - 2rem) / 2);
|
aspect-ratio: 1/1;
|
||||||
height: calc((34rem - 2rem) / 2);
|
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
|
|
||||||
@@ -174,11 +174,11 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
> .material_content_list_loding{
|
> .material_content_list_loding{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: calc((34rem - 2rem) / 2);
|
aspect-ratio: 1/1;
|
||||||
}
|
}
|
||||||
> .upload_item{
|
> .upload_item{
|
||||||
width: calc((34rem - 2rem) / 2);
|
width: calc((50% - 1rem));
|
||||||
height: calc((34rem - 2rem) / 2);
|
aspect-ratio: 1/1;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
.upload{
|
.upload{
|
||||||
|
|||||||
@@ -120,11 +120,11 @@ export default defineComponent({
|
|||||||
height: 23.5rem;
|
height: 23.5rem;
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-radius: .5rem;
|
border: 1px solid #000;
|
||||||
// border: 1px dashed #202020;
|
// border: 1px dashed transparent;
|
||||||
border: 1px dashed transparent;
|
border-radius: 1.5rem;
|
||||||
background: linear-gradient(#fff, #fff) padding-box,repeating-linear-gradient(-45deg,#fff 0,#fff 0.3em, #000 0,#000 0.6em);
|
background: linear-gradient(#fff, #fff) padding-box,repeating-linear-gradient(-45deg,#fff 0,#fff 0.3em, #000 0,#000 0.6em);
|
||||||
margin-bottom: 3rem;
|
margin-bottom: 1.4rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|||||||
@@ -126,11 +126,12 @@ export default defineComponent({
|
|||||||
padding: 1rem 0;
|
padding: 1rem 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-radius: .5rem;
|
border-radius: .5rem;
|
||||||
// border: 1px dashed #202020;
|
border: 1px solid #000;
|
||||||
border: 1px dashed transparent;
|
// border: 1px dashed transparent;
|
||||||
|
border-radius: 1.5rem;
|
||||||
position: relative;
|
position: relative;
|
||||||
background: linear-gradient(#fff, #fff) padding-box,repeating-linear-gradient(-45deg,#fff 0,#fff 0.3em, #000 0,#000 0.6em);
|
background: linear-gradient(#fff, #fff) padding-box,repeating-linear-gradient(-45deg,#fff 0,#fff 0.3em, #000 0,#000 0.6em);
|
||||||
margin-bottom: 3rem;
|
margin-bottom: 1.4rem;
|
||||||
> img{
|
> img{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|||||||
@@ -1,56 +1,56 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="editPrintElement">
|
<div class="editPrintElement">
|
||||||
|
<div class="detailText" style="text-align: left; margin-bottom: 1rem;">
|
||||||
|
{{ $t('DesignPrintOperation.ModifyPrint') }}
|
||||||
|
</div>
|
||||||
<div class="printOverallBtn" v-if="type == 'print'">
|
<div class="printOverallBtn" v-if="type == 'print'">
|
||||||
<div class="overallSlogin">
|
<div class="overallSlogin">
|
||||||
<div
|
<label>
|
||||||
class="habit_Overal_Single_text"
|
<input type="radio" name="overallSingle" @change="setOveralSingle" v-model="stateOverallSingle" value="single">
|
||||||
style="margin-left: 0"
|
|
||||||
:class="{ active: !overallSingle }"
|
|
||||||
>
|
|
||||||
{{ $t('DesignPrintOperation.Overall') }}
|
|
||||||
</div>
|
|
||||||
<a-switch v-model:checked="overallSingle" @change="setOveralSingle"/>
|
|
||||||
<div
|
|
||||||
class="habit_Overal_Single_text"
|
|
||||||
:class="{ active: overallSingle }"
|
|
||||||
>
|
|
||||||
{{ $t('DesignPrintOperation.Single') }}
|
{{ $t('DesignPrintOperation.Single') }}
|
||||||
</div>
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="radio" name="overallSingle" @change="setOveralSingle" v-model="stateOverallSingle" value="overall">
|
||||||
|
{{ $t('DesignPrintOperation.Overall') }}
|
||||||
|
</label>
|
||||||
</div>
|
</div>
|
||||||
<div v-show="!overallSingle" class="habit_System_Designer">
|
|
||||||
<div class="habit_System_Designer_text">{{ $t('DesignPrintOperation.Scale') }}</div>
|
</div>
|
||||||
<a-slider id="system_silder"
|
<div class="printElementListBorder" :class="{'single':stateOverallSingle == 'single'}">
|
||||||
class="system_silder"
|
<div class="printElementList" ref="printElementList" :style="{height:stateOverallSingle == 'overall'?'14rem':'10rem'}">
|
||||||
:min="20"
|
<div class="itemList" :style="{width:stateOverallSingle == 'single'?(prentWidth || 0) : '100%'}">
|
||||||
:max="1000"
|
<div class="imgItem"
|
||||||
v-model:value="systemDesignerPercentage"
|
v-if="stateOverallSingle == 'single'"
|
||||||
:tip-formatter="formatter"
|
v-for="item in printStyleList[type][stateOverallSingle]"
|
||||||
>
|
:key="item"
|
||||||
</a-slider>
|
@mousedown.stop="designMousedown(getMousePosition($event,false),item.uniqueId,'disLike')"
|
||||||
|
@touchstart.passive="designMousedown(getMousePosition($event,true),item.uniqueId,'disLike')"
|
||||||
|
>
|
||||||
|
<img :src="item.path" alt="">
|
||||||
|
<i class="fi fi-rr-trash" @click="navDelete(item)"></i>
|
||||||
|
</div>
|
||||||
|
<div class="imgItem"
|
||||||
|
v-if="stateOverallSingle == 'overall'"
|
||||||
|
v-for="item in printStyleList[type][stateOverallSingle]"
|
||||||
|
:key="item"
|
||||||
|
style="width:14rem;height:14rem;left: 0;right: 0;margin: 0 auto;"
|
||||||
|
>
|
||||||
|
<img :src="item.path" alt="">
|
||||||
|
<i class="fi fi-rr-trash" @click="navDelete(item)"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="printElementList" ref="printElementList" :style="{height:stateOverallSingle == 'overall'?'14rem':'10rem'}">
|
<div v-show="stateOverallSingle != 'single'" class="habit_System_Designer">
|
||||||
<div class="itemList" :style="{width:prentWidth || 0}">
|
<div class="habit_System_Designer_text">{{ $t('DesignPrintOperation.Scale') }}</div>
|
||||||
<div class="imgItem"
|
<a-slider id="system_silder"
|
||||||
v-if="stateOverallSingle == 'single'"
|
class="system_silder"
|
||||||
v-for="item in printStyleList[type][stateOverallSingle]"
|
:min="20"
|
||||||
:key="item"
|
:max="1000"
|
||||||
@mousedown.stop="designMousedown(getMousePosition($event,false),item.uniqueId,'disLike')"
|
v-model:value="systemDesignerPercentage"
|
||||||
@touchstart.passive="designMousedown(getMousePosition($event,true),item.uniqueId,'disLike')"
|
:tip-formatter="formatter"
|
||||||
>
|
>
|
||||||
<img :src="item.path" alt="">
|
</a-slider>
|
||||||
<i class="fi fi-rr-trash" @click="navDelete(item)"></i>
|
|
||||||
</div>
|
|
||||||
<div class="imgItem"
|
|
||||||
v-if="stateOverallSingle == 'overall'"
|
|
||||||
v-for="item in printStyleList[type][stateOverallSingle]"
|
|
||||||
:key="item"
|
|
||||||
style="width:14rem;height:14rem;"
|
|
||||||
>
|
|
||||||
<img :src="item.path" alt="">
|
|
||||||
<i class="fi fi-rr-trash" @click="navDelete(item)"></i>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="editPrintElementBox">
|
<div class="editPrintElementBox">
|
||||||
<div class="designOpenrtion_centent" id="designOpenrtionCentent">
|
<div class="designOpenrtion_centent" id="designOpenrtionCentent">
|
||||||
@@ -60,7 +60,7 @@
|
|||||||
<div
|
<div
|
||||||
v-for="item,index in printStyleList[type][stateOverallSingle]"
|
v-for="item,index in printStyleList[type][stateOverallSingle]"
|
||||||
:key="item"
|
:key="item"
|
||||||
v-if="overallSingle"
|
v-if="stateOverallSingle == 'single'"
|
||||||
:style="item?.pattern?.style"
|
:style="item?.pattern?.style"
|
||||||
@mousedown.stop="itemMoveMousedown(index,getMousePosition($event,false))" @touchstart.passive="itemMoveMousedown(index,getMousePosition($event,true))"
|
@mousedown.stop="itemMoveMousedown(index,getMousePosition($event,false))" @touchstart.passive="itemMoveMousedown(index,getMousePosition($event,true))"
|
||||||
class="modal_imgItem"
|
class="modal_imgItem"
|
||||||
@@ -72,7 +72,7 @@
|
|||||||
<!-- <img :src="selectDetail.path" alt="" class="designOpenrtion_sketch" ref="sketchImg"> -->
|
<!-- <img :src="selectDetail.path" alt="" class="designOpenrtion_sketch" ref="sketchImg"> -->
|
||||||
<img :src="selectDetail?.undividedLayer?selectDetail.undividedLayer:selectDetail.path" alt="" class="designOpenrtion_sketch" ref="sketchImg">
|
<img :src="selectDetail?.undividedLayer?selectDetail.undividedLayer:selectDetail.path" alt="" class="designOpenrtion_sketch" ref="sketchImg">
|
||||||
<div class="designOpenrtion_btn">
|
<div class="designOpenrtion_btn">
|
||||||
<ul v-if="overallSingle" v-for="item,index in printStyleList[type][stateOverallSingle]" :key="item" :class="{active:item?.pattern.designOpenrtionBtn?item?.pattern.designOpenrtionBtn:false}" class="designOpenrtion_Mousingle" :style="item?.pattern.style" @mousedown.stop="itemMoveMousedown(index,getMousePosition($event,false))" @touchstart.passive="itemMoveMousedown(index,getMousePosition($event,true))">
|
<ul v-if="stateOverallSingle == 'single'" v-for="item,index in printStyleList[type][stateOverallSingle]" :key="item" :class="{active:item?.pattern.designOpenrtionBtn?item?.pattern.designOpenrtionBtn:false}" class="designOpenrtion_Mousingle" :style="item?.pattern.style" @mousedown.stop="itemMoveMousedown(index,getMousePosition($event,false))" @touchstart.passive="itemMoveMousedown(index,getMousePosition($event,true))">
|
||||||
<li class="designOpenrtion_btn_top" @mousedown.stop="itemSizeMousedown('top',getMousePosition($event,false))" @touchstart.passive="itemSizeMousedown('top',getMousePosition($event,true))"></li>
|
<li class="designOpenrtion_btn_top" @mousedown.stop="itemSizeMousedown('top',getMousePosition($event,false))" @touchstart.passive="itemSizeMousedown('top',getMousePosition($event,true))"></li>
|
||||||
<li class="designOpenrtion_btn_bottom" @mousedown.stop="itemSizeMousedown('bottom',getMousePosition($event,false))" @touchstart.passive="itemSizeMousedown('bottom',getMousePosition($event,true))"></li>
|
<li class="designOpenrtion_btn_bottom" @mousedown.stop="itemSizeMousedown('bottom',getMousePosition($event,false))" @touchstart.passive="itemSizeMousedown('bottom',getMousePosition($event,true))"></li>
|
||||||
<li class="designOpenrtion_btn_left" @mousedown.stop="itemSizeMousedown('left',getMousePosition($event,false))" @touchstart.passive="itemSizeMousedown('left',getMousePosition($event,true))"></li>
|
<li class="designOpenrtion_btn_left" @mousedown.stop="itemSizeMousedown('left',getMousePosition($event,false))" @touchstart.passive="itemSizeMousedown('left',getMousePosition($event,true))"></li>
|
||||||
@@ -82,8 +82,8 @@
|
|||||||
<img src="../../../assets/images/homePage/cuowu.svg" alt="">
|
<img src="../../../assets/images/homePage/cuowu.svg" alt="">
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<div v-show="!overallSingle"></div>
|
<div v-show="stateOverallSingle != 'single'"></div>
|
||||||
<ul v-if="!overallSingle && printStyleList[type][stateOverallSingle][0]" class="designOpenrtion_Mouoverall active" :style="'left:'+printStyleList[type][stateOverallSingle][0]?.pattern?.style?.left+';top:'+printStyleList[type][stateOverallSingle][0]?.pattern?.style?.top+';'" @mousedown.stop="itemMoveMousedown(0,getMousePosition($event,false))" @touchstart.passive="itemMoveMousedown(0,getMousePosition($event,true))">
|
<ul v-if="stateOverallSingle != 'single' && printStyleList[type][stateOverallSingle][0]" class="designOpenrtion_Mouoverall active" :style="'left:'+printStyleList[type][stateOverallSingle][0]?.pattern?.style?.left+';top:'+printStyleList[type][stateOverallSingle][0]?.pattern?.style?.top+';'" @mousedown.stop="itemMoveMousedown(0,getMousePosition($event,false))" @touchstart.passive="itemMoveMousedown(0,getMousePosition($event,true))">
|
||||||
<i class="fi fi-rr-arrows animtion1"></i>
|
<i class="fi fi-rr-arrows animtion1"></i>
|
||||||
<i class="fi fi-rr-arrows animtion2"></i>
|
<i class="fi fi-rr-arrows animtion2"></i>
|
||||||
<li class="designOpenrtion_rotote" v-rotote.stop="[0,printStyleList[type][stateOverallSingle][0]?.pattern?.transform,type]"></li>
|
<li class="designOpenrtion_rotote" v-rotote.stop="[0,printStyleList[type][stateOverallSingle][0]?.pattern?.transform,type]"></li>
|
||||||
@@ -125,7 +125,6 @@ export default defineComponent({
|
|||||||
selectDetail:computed(()=>store.state.DesignDetail.selectDetail),
|
selectDetail:computed(()=>store.state.DesignDetail.selectDetail),
|
||||||
currentDetailType:computed(()=>store.state.DesignDetail.currentDetailType),
|
currentDetailType:computed(()=>store.state.DesignDetail.currentDetailType),
|
||||||
currentPrintElement:computed(()=>store.state.DesignDetail.currentPrintElement),
|
currentPrintElement:computed(()=>store.state.DesignDetail.currentPrintElement),
|
||||||
overallSingle:true,
|
|
||||||
systemDesignerPercentage:0,
|
systemDesignerPercentage:0,
|
||||||
printStyleList:{
|
printStyleList:{
|
||||||
print:{
|
print:{
|
||||||
@@ -168,11 +167,6 @@ export default defineComponent({
|
|||||||
})
|
})
|
||||||
|
|
||||||
const setOveralSingle = ()=>{
|
const setOveralSingle = ()=>{
|
||||||
if(!editPrintElementData.overallSingle){
|
|
||||||
editPrintElementData.stateOverallSingle = 'overall'
|
|
||||||
}else{
|
|
||||||
editPrintElementData.stateOverallSingle = 'single'
|
|
||||||
}
|
|
||||||
setItemPosition()
|
setItemPosition()
|
||||||
}
|
}
|
||||||
const formatter = (value:any)=>{
|
const formatter = (value:any)=>{
|
||||||
@@ -197,7 +191,7 @@ export default defineComponent({
|
|||||||
let sketchH = editPrintElementData.sketchWH.height * editPrintElementData.sketchWH.scale
|
let sketchH = editPrintElementData.sketchWH.height * editPrintElementData.sketchWH.scale
|
||||||
let x = sketchW / 2 - (sketchW * (width / editPrintElementData.sketchWH.width)/2)
|
let x = sketchW / 2 - (sketchW * (width / editPrintElementData.sketchWH.width)/2)
|
||||||
let y = sketchH / 2 -(sketchH * height/2)
|
let y = sketchH / 2 -(sketchH * height/2)
|
||||||
if(!editPrintElementData.overallSingle){
|
if(!editPrintElementData.stateOverallSingle == 'single'){
|
||||||
x = sketchW / 2
|
x = sketchW / 2
|
||||||
y = sketchH / 2
|
y = sketchH / 2
|
||||||
}
|
}
|
||||||
@@ -212,7 +206,7 @@ export default defineComponent({
|
|||||||
let item = {
|
let item = {
|
||||||
angle:0,
|
angle:0,
|
||||||
designType:data.designType,
|
designType:data.designType,
|
||||||
ifSingle:editPrintElementData.overallSingle,
|
ifSingle:editPrintElementData.stateOverallSingle == 'single',
|
||||||
level2Type:data.level2Type,
|
level2Type:data.level2Type,
|
||||||
location,
|
location,
|
||||||
minIOPath:data.minIOPath || data.originalUrl,
|
minIOPath:data.minIOPath || data.originalUrl,
|
||||||
@@ -354,9 +348,9 @@ export default defineComponent({
|
|||||||
})
|
})
|
||||||
setItemPosition()
|
setItemPosition()
|
||||||
}
|
}
|
||||||
if(props.type == 'print'){
|
// if(props.type == 'print'){
|
||||||
editPrintElementData.overallSingle = state
|
// editPrintElementData.overallSingle = state
|
||||||
}
|
// }
|
||||||
}
|
}
|
||||||
// undividedLayer
|
// undividedLayer
|
||||||
//计算宽高使用editPrintElementData.selectDetail.path
|
//计算宽高使用editPrintElementData.selectDetail.path
|
||||||
@@ -392,7 +386,7 @@ export default defineComponent({
|
|||||||
editPrintElementData.printStyleList[props.type][editPrintElementData.stateOverallSingle].forEach((v:any)=>{
|
editPrintElementData.printStyleList[props.type][editPrintElementData.stateOverallSingle].forEach((v:any)=>{
|
||||||
v.pattern.designOpenrtionBtn = false
|
v.pattern.designOpenrtionBtn = false
|
||||||
})
|
})
|
||||||
if(!editPrintElementData.overallSingle){
|
if(editPrintElementData.stateOverallSingle != 'single'){
|
||||||
editPrintElementDom.imgDom = document.getElementsByClassName('editPrintElement')[0].getElementsByClassName("designOpenrtion_Mouoverall")[0]
|
editPrintElementDom.imgDom = document.getElementsByClassName('editPrintElement')[0].getElementsByClassName("designOpenrtion_Mouoverall")[0]
|
||||||
}else{
|
}else{
|
||||||
editPrintElementDom.imgDom = document.getElementsByClassName('editPrintElement')[0].getElementsByClassName("modal_imgItem")[editPrintElementData.imgDomIndex]
|
editPrintElementDom.imgDom = document.getElementsByClassName('editPrintElement')[0].getElementsByClassName("modal_imgItem")[editPrintElementData.imgDomIndex]
|
||||||
@@ -462,7 +456,7 @@ export default defineComponent({
|
|||||||
let y:any = ( e.clientY - editPrintElementData.printStyleList[props.type][editPrintElementData.stateOverallSingle][editPrintElementData.imgDomIndex].pattern.centers.top)+'px'
|
let y:any = ( e.clientY - editPrintElementData.printStyleList[props.type][editPrintElementData.stateOverallSingle][editPrintElementData.imgDomIndex].pattern.centers.top)+'px'
|
||||||
editPrintElementData.printStyleList[props.type][editPrintElementData.stateOverallSingle][editPrintElementData.imgDomIndex].pattern.style.left = x
|
editPrintElementData.printStyleList[props.type][editPrintElementData.stateOverallSingle][editPrintElementData.imgDomIndex].pattern.style.left = x
|
||||||
editPrintElementData.printStyleList[props.type][editPrintElementData.stateOverallSingle][editPrintElementData.imgDomIndex].pattern.style.top = y
|
editPrintElementData.printStyleList[props.type][editPrintElementData.stateOverallSingle][editPrintElementData.imgDomIndex].pattern.style.top = y
|
||||||
if(!editPrintElementData.overallSingle){
|
if(editPrintElementData.stateOverallSingle != 'single'){
|
||||||
if(x.replace(/px/g,'') >= parentNode.width - imgDomWH.width){
|
if(x.replace(/px/g,'') >= parentNode.width - imgDomWH.width){
|
||||||
editPrintElementData.printStyleList[props.type][editPrintElementData.stateOverallSingle][editPrintElementData.imgDomIndex].pattern.style.left = parentNode.width - imgDomWH.width+'px'
|
editPrintElementData.printStyleList[props.type][editPrintElementData.stateOverallSingle][editPrintElementData.imgDomIndex].pattern.style.left = parentNode.width - imgDomWH.width+'px'
|
||||||
}
|
}
|
||||||
@@ -740,7 +734,6 @@ export default defineComponent({
|
|||||||
onMounted(()=>{
|
onMounted(()=>{
|
||||||
if(props.type == 'element'){
|
if(props.type == 'element'){
|
||||||
editPrintElementData.stateOverallSingle = 'single'
|
editPrintElementData.stateOverallSingle = 'single'
|
||||||
editPrintElementData.overallSingle = true
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
onBeforeUnmount(()=>{
|
onBeforeUnmount(()=>{
|
||||||
@@ -857,74 +850,88 @@ export default defineComponent({
|
|||||||
> .overallSlogin{
|
> .overallSlogin{
|
||||||
align-items: center;
|
align-items: center;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
// margin-top: 1.4rem;
|
||||||
|
margin-bottom: 2.2rem;
|
||||||
|
> label{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 1.6rem;
|
||||||
|
margin-right: 2.4rem;
|
||||||
|
&:last-child{
|
||||||
|
margin-right: 0rem;
|
||||||
|
}
|
||||||
|
> input{
|
||||||
|
margin-right: 1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.habit_Overal_Single_text {
|
}
|
||||||
font-weight: 600;
|
.habit_System_Designer {
|
||||||
color: rgba(0, 0, 0, 0.5);
|
align-items: center;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
.ant-slider-track,
|
||||||
|
.ant-slider-rail {
|
||||||
|
background-color: #e1e1e1;
|
||||||
|
border-radius: calc(0.5rem*1.2);
|
||||||
|
}
|
||||||
|
:deep(.system_silder){
|
||||||
|
width: 17rem;
|
||||||
|
}
|
||||||
|
.ant-slider .ant-slider-handle:not(.ant-tooltip-open),
|
||||||
|
.ant-slider-handle {
|
||||||
|
background-color: #2d2e76 !important;
|
||||||
|
border: none !important;
|
||||||
|
}
|
||||||
|
.ant-slider-handle:hover{
|
||||||
|
box-shadow: 0 0 0 5px rgba(45, 46, 118, 0.2);
|
||||||
|
}
|
||||||
|
.habit_System_Designer_text{
|
||||||
font-size: 1.8rem;
|
font-size: 1.8rem;
|
||||||
margin: 0 1rem;
|
color: rgba(0, 0, 0, 0.7);
|
||||||
&.active {
|
margin-right: 3rem;
|
||||||
color: rgba(0, 0, 0, 0.7);
|
font-weight: 600;
|
||||||
// font-weight: 900;
|
|
||||||
// transform: scale(1.2);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.habit_System_Designer {
|
|
||||||
align-items: center;
|
|
||||||
display: flex;
|
|
||||||
.ant-slider-track,
|
|
||||||
.ant-slider-rail {
|
|
||||||
background-color: #e1e1e1;
|
|
||||||
border-radius: calc(0.5rem*1.2);
|
|
||||||
}
|
|
||||||
:deep(.system_silder){
|
|
||||||
width: 20rem;
|
|
||||||
}
|
|
||||||
.ant-slider .ant-slider-handle:not(.ant-tooltip-open),
|
|
||||||
.ant-slider-handle {
|
|
||||||
background-color: #2d2e76 !important;
|
|
||||||
border: none !important;
|
|
||||||
}
|
|
||||||
.ant-slider-handle:hover{
|
|
||||||
box-shadow: 0 0 0 5px rgba(45, 46, 118, 0.2);
|
|
||||||
}
|
|
||||||
.habit_System_Designer_text{
|
|
||||||
font-size: 1.8rem;
|
|
||||||
color: rgba(0, 0, 0, 0.7);
|
|
||||||
margin-right: 3rem;
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
> .printElementList{
|
> .printElementListBorder{
|
||||||
width: 100%;
|
&.single{
|
||||||
height: 10rem;
|
padding: 2rem 4rem;
|
||||||
position: relative;
|
width: 100%;
|
||||||
overflow-x: auto;
|
border-radius: 1.5rem;
|
||||||
.itemList{
|
border: .05rem solid #000;
|
||||||
height: 100%;
|
|
||||||
}
|
}
|
||||||
.imgItem{
|
> .printElementList{
|
||||||
width: 8rem;
|
width: 100%;
|
||||||
height: 8rem;
|
height: 10rem;
|
||||||
position: absolute;
|
position: relative;
|
||||||
cursor: pointer;
|
overflow-x: auto;
|
||||||
border-radius: 1rem;
|
|
||||||
overflow: hidden;
|
.itemList{
|
||||||
> img{
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
height: 100%;
|
||||||
object-fit: cover;
|
|
||||||
}
|
}
|
||||||
> i{
|
.imgItem{
|
||||||
|
width: 8rem;
|
||||||
|
height: 8rem;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 1rem;
|
cursor: pointer;
|
||||||
top: 1rem;
|
border-radius: 1rem;
|
||||||
color: #fff;
|
overflow: hidden;
|
||||||
text-shadow: 0px 0px 2px black, 0px 0px 2px black, 0px 0px 2px black;
|
> img{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
> i{
|
||||||
|
position: absolute;
|
||||||
|
right: 1rem;
|
||||||
|
top: 1rem;
|
||||||
|
color: #fff;
|
||||||
|
text-shadow: 0px 0px 2px black, 0px 0px 2px black, 0px 0px 2px black;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
> .editPrintElementBox{
|
> .editPrintElementBox{
|
||||||
flex: 1;
|
flex: 1;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|||||||
@@ -4,7 +4,7 @@
|
|||||||
<div class="back" v-show="isEditPattern.value">
|
<div class="back" v-show="isEditPattern.value">
|
||||||
<i class="fi fi-br-angle-left" @click="setBack"></i>
|
<i class="fi fi-br-angle-left" @click="setBack"></i>
|
||||||
</div>
|
</div>
|
||||||
<modelNav @canvasReload="()=>$emit('canvasReload')" @addSketch="()=>$emit('addSketch')" @deleteItem="deleteItem" :isEditPattern="isEditPattern.value"></modelNav>
|
<modelNav @canvasReload="()=>$emit('canvasReload')" @addSketch="()=>$emit('addSketch')" @deleteItem="deleteItem"></modelNav>
|
||||||
</div>
|
</div>
|
||||||
<div class="modelindex_right">
|
<div class="modelindex_right">
|
||||||
<div class="detail_btn">
|
<div class="detail_btn">
|
||||||
@@ -14,7 +14,12 @@
|
|||||||
<i v-show="true" class="icon iconfont icon-chehui" @click="revocation"></i>
|
<i v-show="true" class="icon iconfont icon-chehui" @click="revocation"></i>
|
||||||
<i v-show="true" class="icon iconfont icon-fanchehui" @click="oppositeRevocation"></i>
|
<i v-show="true" class="icon iconfont icon-fanchehui" @click="oppositeRevocation"></i>
|
||||||
<!-- 编辑 -->
|
<!-- 编辑 -->
|
||||||
<i class="fi fi-rr-edit" :title="$t('DesignDetail.editTitle')" :class="{active:isEditPattern.value,'pointerEventsNone':!selectDetail?.id}" @click="showDesignImgDetail('edit')"></i>
|
<i class="fi fi-rr-edit" :title="$t('DesignDetail.editTitle')" :class="{active:isEditPattern.value == 'canvasEditor','pointerEventsNone':!selectDetail?.id}" @click="showDesignImgDetail('canvasEditor')"></i>
|
||||||
|
|
||||||
|
<i @click="showDesignImgDetail('redGreenExample')" :class="{active:isEditPattern.value == 'redGreenExample','pointerEventsNone':!selectDetail?.id}">
|
||||||
|
<SvgIcon name="editFrontBack" size="30" />
|
||||||
|
</i>
|
||||||
|
|
||||||
<!-- <i class="fi fi-rr-copy" :title="$t('DesignDetail.compareTitle')" :class="{active:imgDesignImg}" @click="mousedownDesignImg"></i> -->
|
<!-- <i class="fi fi-rr-copy" :title="$t('DesignDetail.compareTitle')" :class="{active:imgDesignImg}" @click="mousedownDesignImg"></i> -->
|
||||||
<!-- <i v-show="!body && !deleteShow" :title="$t('DesignDetail.DetailTitle')" class="fi fi-rr-trash" @click="deleteNav(0)"></i>
|
<!-- <i v-show="!body && !deleteShow" :title="$t('DesignDetail.DetailTitle')" class="fi fi-rr-trash" @click="deleteNav(0)"></i>
|
||||||
<i v-show="!body && deleteShow" class="fi fi-br-check" @click="deleteNav(1)"></i> -->
|
<i v-show="!body && deleteShow" class="fi fi-br-check" @click="deleteNav(1)"></i> -->
|
||||||
@@ -65,29 +70,29 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
const showDesignImgDetail = (str:any)=>{
|
const showDesignImgDetail = (str:any)=>{
|
||||||
new Promise((resolve, reject) => {
|
new Promise((resolve, reject) => {
|
||||||
// if(
|
if(
|
||||||
// getDetailListData.isEditPattern.value&&
|
getDetailListData.isEditPattern.value&&
|
||||||
// detailData?.getCanvasIfEdit?.fun&&detailData?.getCanvasIfEdit?.fun() > 0
|
detailData?.getCanvasIfEdit?.fun&&detailData?.getCanvasIfEdit?.fun() > 0
|
||||||
// ){
|
){
|
||||||
// Modal.confirm({
|
Modal.confirm({
|
||||||
// title: t('collectionModal.jsContent2'),
|
title: t('collectionModal.jsContent2'),
|
||||||
// icon: createVNode(ExclamationCircleOutlined),
|
icon: createVNode(ExclamationCircleOutlined),
|
||||||
// okText: 'Yes',
|
okText: 'Yes',
|
||||||
// cancelText: 'No',
|
cancelText: 'No',
|
||||||
// mask:false,
|
mask:false,
|
||||||
// centered:true,
|
centered:true,
|
||||||
// onOk() {
|
onOk() {
|
||||||
// resolve(true)
|
resolve(true)
|
||||||
// emit('detailEdit',str)
|
emit('detailEdit',str)
|
||||||
// },
|
},
|
||||||
// onCancel(){
|
onCancel(){
|
||||||
// resolve(false)
|
resolve(false)
|
||||||
// }
|
}
|
||||||
// });
|
});
|
||||||
// }else{
|
}else{
|
||||||
resolve(true)
|
resolve(true)
|
||||||
emit('detailEdit',str)
|
emit('detailEdit',str)
|
||||||
// }
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
const deleteItem = ()=>{
|
const deleteItem = ()=>{
|
||||||
@@ -117,7 +122,7 @@ export default defineComponent({
|
|||||||
},1000)
|
},1000)
|
||||||
}
|
}
|
||||||
const setBack = ()=>{
|
const setBack = ()=>{
|
||||||
emit('detailEdit','edit')
|
emit('detailEdit')
|
||||||
}
|
}
|
||||||
onMounted(()=>{
|
onMounted(()=>{
|
||||||
window.addEventListener('resize', handleResize);
|
window.addEventListener('resize', handleResize);
|
||||||
@@ -196,6 +201,11 @@ export default defineComponent({
|
|||||||
@media (min-width: 1024px) {
|
@media (min-width: 1024px) {
|
||||||
font-size: 2.4rem;
|
font-size: 2.4rem;
|
||||||
}
|
}
|
||||||
|
> img{
|
||||||
|
width: 80%;
|
||||||
|
color: #fff;
|
||||||
|
height: 80%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
> i:hover{
|
> i:hover{
|
||||||
background: #000000;
|
background: #000000;
|
||||||
|
|||||||
@@ -32,10 +32,6 @@ export default defineComponent({
|
|||||||
},
|
},
|
||||||
emits:['canvasReload','addSketch','deleteItem'],
|
emits:['canvasReload','addSketch','deleteItem'],
|
||||||
props:{
|
props:{
|
||||||
isEditPattern:{
|
|
||||||
type:Boolean,
|
|
||||||
default:false,
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
setup(props,{emit}) {
|
setup(props,{emit}) {
|
||||||
const store = useStore();
|
const store = useStore();
|
||||||
@@ -95,7 +91,9 @@ export default defineComponent({
|
|||||||
// });
|
// });
|
||||||
// }else{
|
// }else{
|
||||||
resolve(true)
|
resolve(true)
|
||||||
emit('canvasReload')
|
if(detailData.selectDetail.id !== item.id){
|
||||||
|
emit('canvasReload')
|
||||||
|
}
|
||||||
// }
|
// }
|
||||||
}).then((rv)=>{
|
}).then((rv)=>{
|
||||||
if(rv)store.commit('DesignDetail/setDesignColthes',item.id)
|
if(rv)store.commit('DesignDetail/setDesignColthes',item.id)
|
||||||
|
|||||||
@@ -71,7 +71,7 @@ import { message, Upload, Modal } from "ant-design-vue";
|
|||||||
},
|
},
|
||||||
isFontType:{
|
isFontType:{
|
||||||
type:Boolean,
|
type:Boolean,
|
||||||
default:true,
|
default:false,
|
||||||
},
|
},
|
||||||
selectSize:{
|
selectSize:{
|
||||||
type:String,
|
type:String,
|
||||||
|
|||||||
@@ -1911,7 +1911,7 @@ export default defineComponent({
|
|||||||
if(design?.childList?.length > 0){
|
if(design?.childList?.length > 0){
|
||||||
await new Promise((resolve, reject) => {
|
await new Promise((resolve, reject) => {
|
||||||
Modal.confirm({
|
Modal.confirm({
|
||||||
title: this.t('LibraryPage.jsContent11'),
|
title: this.t('HomeView.jsContent12'),
|
||||||
icon: createVNode(ExclamationCircleOutlined),
|
icon: createVNode(ExclamationCircleOutlined),
|
||||||
okText: 'Yes',
|
okText: 'Yes',
|
||||||
cancelText: 'No',
|
cancelText: 'No',
|
||||||
|
|||||||
@@ -43,7 +43,6 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="style brand marginBottom">
|
<div class="style brand marginBottom">
|
||||||
<div class="text">{{$t('Habit.Brand')}}:</div>
|
<div class="text">{{$t('Habit.Brand')}}:</div>
|
||||||
<!-- <div class="text"><img v-show="selectObject.userBrandDna" :src="selectObject.userBrandDnaImg">{{ selectObject.userBrandDnaName }}</div> -->
|
|
||||||
<div class="gallery_btn" @click="setBrandDNA">{{ $t('Habit.Select') }}</div>
|
<div class="gallery_btn" @click="setBrandDNA">{{ $t('Habit.Select') }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="brandImg" v-if="selectObject.userBrandDna"><img :src="selectObject.userBrandDnaImg"></div>
|
<div class="brandImg" v-if="selectObject.userBrandDna"><img :src="selectObject.userBrandDnaImg"></div>
|
||||||
|
|||||||
@@ -9,7 +9,7 @@
|
|||||||
imageMode:'contains',
|
imageMode:'contains',
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<template #customTools="{ toolButtonProps }">
|
<template #customToolsBottom="{ toolButtonProps }">
|
||||||
<div class="custom-tool-btn" :class="{active:isHiddenModel}" @click="setHiddenmodel()">
|
<div class="custom-tool-btn" :class="{active:isHiddenModel}" @click="setHiddenmodel()">
|
||||||
<i class="fi fi-rr-eye"></i>
|
<i class="fi fi-rr-eye"></i>
|
||||||
<div class="tool-tooltip">Hidden model</div>
|
<div class="tool-tooltip">Hidden model</div>
|
||||||
|
|||||||
@@ -239,6 +239,7 @@ export default {
|
|||||||
jsContent9: "您确定要清除当前系列并重新开始吗?",
|
jsContent9: "您确定要清除当前系列并重新开始吗?",
|
||||||
jsContent10: "二次创作的作品不允许使用'设计',但是您可以使用'重新设计'",
|
jsContent10: "二次创作的作品不允许使用'设计',但是您可以使用'重新设计'",
|
||||||
jsContent11: "取消喜欢后相关联的元素会被删除,确认要删除吗",
|
jsContent11: "取消喜欢后相关联的元素会被删除,确认要删除吗",
|
||||||
|
jsContent12: "你确定要删除选中元素和相关元素吗?",
|
||||||
},
|
},
|
||||||
ProductImg: {
|
ProductImg: {
|
||||||
productInput: "请输入关键词(例如款式、材质)",
|
productInput: "请输入关键词(例如款式、材质)",
|
||||||
@@ -635,6 +636,7 @@ export default {
|
|||||||
},
|
},
|
||||||
DesignPrintOperation: {
|
DesignPrintOperation: {
|
||||||
Placement: "调整位置",
|
Placement: "调整位置",
|
||||||
|
ModifyPrint: "修改印花",
|
||||||
Overall: "整体",
|
Overall: "整体",
|
||||||
Single: "单个",
|
Single: "单个",
|
||||||
Scale: "大小",
|
Scale: "大小",
|
||||||
@@ -1277,6 +1279,9 @@ export default {
|
|||||||
SelectTextColor:'选择文字颜色',
|
SelectTextColor:'选择文字颜色',
|
||||||
SelectBGColor:'选择背景颜色',
|
SelectBGColor:'选择背景颜色',
|
||||||
ok:'确定',
|
ok:'确定',
|
||||||
|
editFrontBack:'编辑服装前片后片',
|
||||||
|
help:'帮助',
|
||||||
|
back:'返回',
|
||||||
},
|
},
|
||||||
speedList:{
|
speedList:{
|
||||||
High:'高级',
|
High:'高级',
|
||||||
|
|||||||
@@ -241,6 +241,7 @@ export default {
|
|||||||
jsContent9: "Are you sure to erase current collection and start over?",
|
jsContent9: "Are you sure to erase current collection and start over?",
|
||||||
jsContent10: "Re-created works are not allowed to use 'design', but you can use 'redesign'",
|
jsContent10: "Re-created works are not allowed to use 'design', but you can use 'redesign'",
|
||||||
jsContent11: "By unliking this, all connected posts will be deleted. Are you sure you want to continue?",
|
jsContent11: "By unliking this, all connected posts will be deleted. Are you sure you want to continue?",
|
||||||
|
jsContent12: "Are you sure about deleting the current brand DNA?",
|
||||||
},
|
},
|
||||||
ProductImg: {
|
ProductImg: {
|
||||||
productInput: "Enter keyword(style,texture)",
|
productInput: "Enter keyword(style,texture)",
|
||||||
@@ -637,6 +638,7 @@ export default {
|
|||||||
},
|
},
|
||||||
DesignPrintOperation: {
|
DesignPrintOperation: {
|
||||||
Placement: "Placement",
|
Placement: "Placement",
|
||||||
|
ModifyPrint: "Modify Print",
|
||||||
Overall: "Overall",
|
Overall: "Overall",
|
||||||
Single: "Single",
|
Single: "Single",
|
||||||
Scale: "Scale",
|
Scale: "Scale",
|
||||||
@@ -1279,6 +1281,9 @@ export default {
|
|||||||
SelectTextColor:'Select Text Color',
|
SelectTextColor:'Select Text Color',
|
||||||
SelectBGColor:'Select Background Color',
|
SelectBGColor:'Select Background Color',
|
||||||
ok:'OK',
|
ok:'OK',
|
||||||
|
editFrontBack:'Edit the front and back sections',
|
||||||
|
help:'Help',
|
||||||
|
back:'Back',
|
||||||
},
|
},
|
||||||
speedList:{
|
speedList:{
|
||||||
High:'High',
|
High:'High',
|
||||||
|
|||||||
@@ -138,7 +138,6 @@ const DesignDetail : Module<DesignDetail,RootState> = {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
setDesignColthes(state,data){
|
setDesignColthes(state,data){
|
||||||
console.log(data)
|
|
||||||
if(!state.currentDetailType)state.currentDetailType = 'sketch'
|
if(!state.currentDetailType)state.currentDetailType = 'sketch'
|
||||||
//切换选择
|
//切换选择
|
||||||
// state.currentDetailType = ''
|
// state.currentDetailType = ''
|
||||||
|
|||||||
@@ -263,9 +263,10 @@ const userHabit : Module<UserHabit,RootState> = {
|
|||||||
* 7 : 学校管理员
|
* 7 : 学校管理员
|
||||||
* 8 : 学校子账号
|
* 8 : 学校子账号
|
||||||
*/
|
*/
|
||||||
|
// data.systemUser = 0
|
||||||
state.userDetail.affiliate = data.affiliate
|
state.userDetail.affiliate = data.affiliate
|
||||||
state.userDetail.systemUser = data.systemUser
|
state.userDetail.systemUser = data.systemUser
|
||||||
// state.userDetail.systemUser = 3
|
// state.userDetail.systemUser = 1
|
||||||
// 身份列表1:可以使用aida系统,2:可以使用affiliate页面,3:系统管理员用户
|
// 身份列表1:可以使用aida系统,2:可以使用affiliate页面,3:系统管理员用户
|
||||||
state.userDetail.systemList = []
|
state.userDetail.systemList = []
|
||||||
if(data.systemUser != 0)state.userDetail.systemList.push(1)
|
if(data.systemUser != 0)state.userDetail.systemList.push(1)
|
||||||
|
|||||||
@@ -339,7 +339,8 @@ const openTypeList = (t)=>{
|
|||||||
label:t('LibraryPage.Mannequins'),
|
label:t('LibraryPage.Mannequins'),
|
||||||
value:'Models',
|
value:'Models',
|
||||||
router:'library=Models'
|
router:'library=Models'
|
||||||
},{
|
},
|
||||||
|
{
|
||||||
icon:'fi-ss-gem',
|
icon:'fi-ss-gem',
|
||||||
label:t('LibraryPage.brandDNA'),
|
label:t('LibraryPage.brandDNA'),
|
||||||
value:'MyBrand',
|
value:'MyBrand',
|
||||||
|
|||||||
@@ -240,11 +240,13 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="userSystem" v-if="userDetail.systemList.indexOf(1) == -1">
|
<div class="routerView">
|
||||||
{{$t('Header.pastDue')}}
|
<div class="userSystem" v-show="pastDuePage">
|
||||||
</div>
|
{{$t('Header.pastDue')}}
|
||||||
<div class="router" v-else-if="!getLangIsShowMark">
|
</div>
|
||||||
<home ref="home" @setNewProject="()=>leftShow=true" @setTask="setTask"></home>
|
<div class="router" v-if="!getLangIsShowMark">
|
||||||
|
<home ref="home" @setNewProject="()=>leftShow=true" @setTask="setTask"></home>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -317,6 +319,7 @@ export default defineComponent({
|
|||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const homeMainData = reactive({
|
const homeMainData = reactive({
|
||||||
|
|
||||||
leftShow:false,
|
leftShow:false,
|
||||||
openType:'',
|
openType:'',
|
||||||
openTypeChild:'',
|
openTypeChild:'',
|
||||||
@@ -342,6 +345,14 @@ export default defineComponent({
|
|||||||
bathGenerationList: ["poseTransfer", "SERIES_DESIGN", "toProduct", "relight"],
|
bathGenerationList: ["poseTransfer", "SERIES_DESIGN", "toProduct", "relight"],
|
||||||
showHistory:false
|
showHistory:false
|
||||||
})
|
})
|
||||||
|
let userDetail= computed(()=>{
|
||||||
|
return store.state.UserHabit.userDetail
|
||||||
|
})
|
||||||
|
const pastDuePage = computed(()=>{
|
||||||
|
const isAllowedRoute = route.path === '/home/events' || route.path === '/home/works';
|
||||||
|
const hasNoSystemAccess = userDetail.value.systemList.indexOf(1) === -1;
|
||||||
|
return hasNoSystemAccess && !isAllowedRoute;
|
||||||
|
})
|
||||||
watch(()=>homeMainData.userDetailLanguage,(newVal)=>{
|
watch(()=>homeMainData.userDetailLanguage,(newVal)=>{
|
||||||
if(locale.value == newVal || !newVal)return
|
if(locale.value == newVal || !newVal)return
|
||||||
locale.value = newVal
|
locale.value = newVal
|
||||||
@@ -430,9 +441,6 @@ export default defineComponent({
|
|||||||
// homeMainData.historyData.page = 1
|
// homeMainData.historyData.page = 1
|
||||||
// })
|
// })
|
||||||
|
|
||||||
let userDetail= computed(()=>{
|
|
||||||
return store.state.UserHabit.userDetail
|
|
||||||
})
|
|
||||||
let isMurmur = ref()
|
let isMurmur = ref()
|
||||||
let credits = computed(()=>{
|
let credits = computed(()=>{
|
||||||
return store.state.UserHabit.credits.value
|
return store.state.UserHabit.credits.value
|
||||||
@@ -807,6 +815,7 @@ export default defineComponent({
|
|||||||
t,
|
t,
|
||||||
...toRefs(homeMainData),
|
...toRefs(homeMainData),
|
||||||
...toRefs(historyData),
|
...toRefs(historyData),
|
||||||
|
pastDuePage,
|
||||||
locale,
|
locale,
|
||||||
isMurmur,
|
isMurmur,
|
||||||
credits,
|
credits,
|
||||||
@@ -969,9 +978,9 @@ export default defineComponent({
|
|||||||
let url = 'https://aida-user-manual-chinese.super.site/'
|
let url = 'https://aida-user-manual-chinese.super.site/'
|
||||||
if(this.locale == 'ENGLISH'){
|
if(this.locale == 'ENGLISH'){
|
||||||
url = 'https://code-create.com.hk/wp-content/uploads/2025/02/aida_3.0-Manual-2_5-EN.pdf'
|
url = 'https://code-create.com.hk/wp-content/uploads/2025/02/aida_3.0-Manual-2_5-EN.pdf'
|
||||||
showViewVideo({url:'https://aida.com.hk/video/user_manual_3_1_0.mp4'})
|
showViewVideo({url:'https://aida.com.hk/video/user_manual_3_1_0.mov'})
|
||||||
}else{
|
}else{
|
||||||
showViewVideo({url:'https://aida.com.hk/video/user_manual_3_1_0.mp4'})
|
showViewVideo({url:'https://aida.com.hk/video/user_manual_3_1_0_cn.mov'})
|
||||||
}
|
}
|
||||||
this.toUserManual()
|
this.toUserManual()
|
||||||
// //打开视频
|
// //打开视频
|
||||||
@@ -1804,26 +1813,32 @@ export default defineComponent({
|
|||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
> .router{
|
> .routerView{
|
||||||
flex: 1;
|
position: relative;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
padding: 0 6rem;
|
flex: 1;
|
||||||
padding-bottom: 2rem;
|
|
||||||
}
|
|
||||||
> .userSystem{
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
position: absolute;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
background: rgba(0, 0, 0, 0.4);
|
|
||||||
z-index:2;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
> .router{
|
||||||
align-items: center;
|
flex: 1;
|
||||||
color: #fff;
|
overflow: hidden;
|
||||||
font-weight: 600;
|
padding: 0 6rem;
|
||||||
font-size: 4rem;
|
padding-bottom: 2rem;
|
||||||
|
}
|
||||||
|
> .userSystem{
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: rgba(0, 0, 0, 0.4);
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 4rem;
|
||||||
|
z-index: 100;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -10,7 +10,7 @@
|
|||||||
<div v-show="!isScroll" class="modal_title_text_assistant gallery_btn white" :class="{active:'NewYear_2025' == worksSelect}" @click="setWorksSelect({value:'NewYear_2025'})">NewYear_2025</div>
|
<div v-show="!isScroll" class="modal_title_text_assistant gallery_btn white" :class="{active:'NewYear_2025' == worksSelect}" @click="setWorksSelect({value:'NewYear_2025'})">NewYear_2025</div>
|
||||||
</div> -->
|
</div> -->
|
||||||
<div class="page_content" ref="autoscrollDom">
|
<div class="page_content" ref="autoscrollDom">
|
||||||
<Falls ref="fall" @loadend="isShowMark = false" :itemWidth="failWidth" @setPortfolioLike="setPortfolioLike" :isScroll="isScroll" @getImgScale="getImgScale"></Falls>
|
<Falls ref="fall" :key="getListDate.getLikePortfolio || getListDate.getMyPortfolio" @loadend="isShowMark = false" :itemWidth="failWidth" @setPortfolioLike="setPortfolioLike" :isScroll="isScroll" @getImgScale="getImgScale"></Falls>
|
||||||
<div class="page_loading_box" v-show="!isNoData">
|
<div class="page_loading_box" v-show="!isNoData">
|
||||||
<span class="page_loading" v-show="!isShowMark"></span>
|
<span class="page_loading" v-show="!isShowMark"></span>
|
||||||
<span v-show="isShowMark">
|
<span v-show="isShowMark">
|
||||||
|
|||||||