fix
This commit is contained in:
@@ -16,11 +16,12 @@
|
||||
imageMode:'contains',
|
||||
}"
|
||||
ref="editCanvas">
|
||||
<template #customTools="{ toolButtonProps }">
|
||||
|
||||
<template #customToolsBottom="{ toolButtonProps }">
|
||||
<!-- 也可以直接使用普通的按钮 -->
|
||||
<div class="custom-tool-btn" :class="{active:currentView === 'redGreenExample'}" @click="editFront('redGreenExample')">
|
||||
<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>
|
||||
</template>
|
||||
</editCanvas>
|
||||
@@ -42,6 +43,13 @@
|
||||
imageMode:'contains',
|
||||
}"
|
||||
ref="editCanvasBackFront">
|
||||
<template #customToolsTop="{ toolTopProps }">
|
||||
<!-- 也可以直接使用普通的按钮 -->
|
||||
<div class="custom-tool-btn" @click="()=>currentView = 'canvasEditor'">
|
||||
<i class="fi fi-ss-arrow-small-left" style="font-size: 3.5rem;"></i>
|
||||
<div class="tool-tooltip">{{ $t('Canvas.back') }}</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #customTools="{ toolButtonProps }">
|
||||
<div class="custom-tool-btn" :class="{active:currentView === 'redGreenExample'}" @click="editFront('canvasEditor')">
|
||||
<i class="fi fi-sr-layers"></i>
|
||||
@@ -117,6 +125,7 @@ export default defineComponent({
|
||||
},{immediate: true})
|
||||
provide('isShowMark',detailData.isShowMark)
|
||||
provide('canvasType',detailData.canvasType)
|
||||
|
||||
const editFront = (str:any)=>{//编辑前后片
|
||||
|
||||
let canvasJSON = '' as any
|
||||
|
||||
@@ -122,10 +122,11 @@ export default defineComponent({
|
||||
padding: 1rem;
|
||||
text-align: center;
|
||||
border-radius: .5rem;
|
||||
// border: 1px dashed #202020;
|
||||
border: 1px dashed transparent;
|
||||
border: 1px solid #000;
|
||||
// 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);
|
||||
margin-bottom: 3rem;
|
||||
margin-bottom: 1.4rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
overflow: hidden;
|
||||
|
||||
@@ -100,11 +100,12 @@ export default defineComponent({
|
||||
padding: 1rem 0;
|
||||
text-align: center;
|
||||
border-radius: .5rem;
|
||||
// border: 1px dashed #202020;
|
||||
border: 1px dashed transparent;
|
||||
border: 1px solid #000;
|
||||
// border: 1px dashed transparent;
|
||||
border-radius: 1.5rem;
|
||||
position: relative;
|
||||
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{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
@@ -105,9 +105,9 @@ export default defineComponent({
|
||||
align-content: flex-start;
|
||||
&::-webkit-scrollbar{display: none;}
|
||||
> .content_img_item{
|
||||
width: calc((50% - 1rem));
|
||||
> .content_img_item_block{
|
||||
width: calc((34rem - 2rem) / 2);
|
||||
height: calc((34rem - 2rem) / 2);
|
||||
aspect-ratio: 1/1;
|
||||
position: relative;
|
||||
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;
|
||||
&::-webkit-scrollbar{display: none;}
|
||||
> .content_img_item{
|
||||
width: calc((50% - 1rem));
|
||||
> .content_img_item_block{
|
||||
width: calc((34rem - 2rem) / 2);
|
||||
height: calc((34rem - 2rem) / 2);
|
||||
aspect-ratio: 1/1;
|
||||
position: relative;
|
||||
margin-bottom: 2rem;
|
||||
cursor: pointer;
|
||||
@@ -364,7 +364,7 @@ export default defineComponent({
|
||||
}
|
||||
> .material_content_list_loding{
|
||||
width: 100%;
|
||||
height: calc((34rem - 2rem) / 2);
|
||||
aspect-ratio: 1/1;
|
||||
overflow: hidden;
|
||||
> img{
|
||||
width: 100%;
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<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
|
||||
@click.stop="openCurrent()"
|
||||
@@ -161,10 +161,16 @@ export default defineComponent({
|
||||
height: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-radius: 1.5rem;
|
||||
border: 1px solid #000;
|
||||
padding: 1rem;
|
||||
> .selectList_header{
|
||||
margin-bottom: 2.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
&.element{
|
||||
margin-bottom: 0rem;
|
||||
}
|
||||
> .switch_type_list{
|
||||
display: flex;
|
||||
> .switch_type_item:last-child{
|
||||
|
||||
@@ -199,9 +199,9 @@ export default defineComponent({
|
||||
align-content: flex-start;
|
||||
&::-webkit-scrollbar{display: none;}
|
||||
> .content_img_item{
|
||||
width: calc((50% - 1rem));
|
||||
> .content_img_item_block{
|
||||
width: calc((34rem - 2rem) / 2);
|
||||
height: calc((34rem - 2rem) / 2);
|
||||
aspect-ratio: 1/1;
|
||||
position: relative;
|
||||
margin-bottom: 2rem;
|
||||
|
||||
@@ -215,11 +215,11 @@ export default defineComponent({
|
||||
}
|
||||
> .material_content_list_loding{
|
||||
width: 100%;
|
||||
height: calc((34rem - 2rem) / 2);
|
||||
aspect-ratio: 1/1;
|
||||
}
|
||||
> .upload_item{
|
||||
width: calc((34rem - 2rem) / 2);
|
||||
height: calc((34rem - 2rem) / 2);
|
||||
width: calc((50% - 1rem));
|
||||
aspect-ratio: 1/1;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
@@ -262,9 +262,10 @@ import sketchCategory from "@/component/HomePage/sketchCategory.vue";
|
||||
align-content: flex-start;
|
||||
&::-webkit-scrollbar{display: none;}
|
||||
> .content_img_item{
|
||||
width: calc((50% - 1rem));
|
||||
> .content_img_item_block{
|
||||
width: calc((34rem - 2rem) / 2);
|
||||
height: calc((34rem - 2rem) / 2);
|
||||
width: 100%;
|
||||
aspect-ratio: 1/1;
|
||||
position: relative;
|
||||
margin-bottom: 2rem;
|
||||
margin: 1rem;
|
||||
@@ -279,11 +280,11 @@ import sketchCategory from "@/component/HomePage/sketchCategory.vue";
|
||||
}
|
||||
> .material_content_list_loding{
|
||||
width: 100%;
|
||||
height: calc((34rem - 2rem) / 2);
|
||||
aspect-ratio: 1/1;
|
||||
}
|
||||
> .upload_item{
|
||||
width: calc((34rem - 2rem) / 2);
|
||||
height: calc((34rem - 2rem) / 2);
|
||||
width: calc((50% - 1rem));
|
||||
aspect-ratio: 1/1;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.upload{
|
||||
|
||||
@@ -145,9 +145,9 @@ export default defineComponent({
|
||||
align-content: flex-start;
|
||||
&::-webkit-scrollbar{display: none;}
|
||||
> .content_img_item{
|
||||
width: calc((50% - 1rem));
|
||||
> .content_img_item_block{
|
||||
width: calc((34rem - 2rem) / 2);
|
||||
height: calc((34rem - 2rem) / 2);
|
||||
aspect-ratio: 1/1;
|
||||
position: relative;
|
||||
margin-bottom: 2rem;
|
||||
|
||||
@@ -174,11 +174,11 @@ export default defineComponent({
|
||||
}
|
||||
> .material_content_list_loding{
|
||||
width: 100%;
|
||||
height: calc((34rem - 2rem) / 2);
|
||||
aspect-ratio: 1/1;
|
||||
}
|
||||
> .upload_item{
|
||||
width: calc((34rem - 2rem) / 2);
|
||||
height: calc((34rem - 2rem) / 2);
|
||||
width: calc((50% - 1rem));
|
||||
aspect-ratio: 1/1;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.upload{
|
||||
|
||||
@@ -120,11 +120,11 @@ export default defineComponent({
|
||||
height: 23.5rem;
|
||||
padding: 1rem;
|
||||
text-align: center;
|
||||
border-radius: .5rem;
|
||||
// border: 1px dashed #202020;
|
||||
border: 1px dashed transparent;
|
||||
border: 1px solid #000;
|
||||
// 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);
|
||||
margin-bottom: 3rem;
|
||||
margin-bottom: 1.4rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
overflow: hidden;
|
||||
|
||||
@@ -126,11 +126,12 @@ export default defineComponent({
|
||||
padding: 1rem 0;
|
||||
text-align: center;
|
||||
border-radius: .5rem;
|
||||
// border: 1px dashed #202020;
|
||||
border: 1px dashed transparent;
|
||||
border: 1px solid #000;
|
||||
// border: 1px dashed transparent;
|
||||
border-radius: 1.5rem;
|
||||
position: relative;
|
||||
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{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
Reference in New Issue
Block a user