调整画布添加图片按钮样式
This commit is contained in:
@@ -237,7 +237,7 @@ li {
|
||||
color: #fff;
|
||||
background-color: #000;
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-weight: 500;
|
||||
border: 2px solid #000;
|
||||
cursor: pointer;
|
||||
box-sizing: border-box;
|
||||
|
||||
@@ -241,7 +241,7 @@ input:focus{
|
||||
color: #fff;
|
||||
background-color: #000;
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-weight: 500;
|
||||
border: 2px solid #000;
|
||||
cursor: pointer;
|
||||
box-sizing: border-box;
|
||||
|
||||
@@ -174,6 +174,7 @@ const handleImageError = (event) => {
|
||||
|
||||
//提交选中的T图片
|
||||
const confirm = ()=>{
|
||||
selectList.value = []
|
||||
emits("select", selectList.value);
|
||||
showPanel.value = false;
|
||||
}
|
||||
@@ -482,6 +483,10 @@ const confirm = ()=>{
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-shrink: 0;
|
||||
> .image-submit{
|
||||
font-size: 1.2rem;
|
||||
line-height: 4rem;
|
||||
}
|
||||
}
|
||||
|
||||
.image-count {
|
||||
|
||||
@@ -176,6 +176,10 @@ const canvasInit = () => {
|
||||
// });
|
||||
};
|
||||
|
||||
const frontBackChange =(value)=>{
|
||||
console.log(value)
|
||||
}
|
||||
|
||||
const isShowLeft = ref(true);
|
||||
</script>
|
||||
|
||||
@@ -195,6 +199,7 @@ const isShowLeft = ref(true);
|
||||
<RedGreenModeExample
|
||||
v-if="currentView === 'redGreenExample'"
|
||||
key="redGreenExample"
|
||||
@trigger-red-green-mouseup="frontBackChange"
|
||||
>
|
||||
</RedGreenModeExample>
|
||||
|
||||
|
||||
@@ -68,7 +68,7 @@
|
||||
<div v-show="isEditPattern.value" style="margin-left: 2rem;" class="gallery_btn" @click="previwe">{{$t('DesignPrintOperation.Preview')}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item detailRight">
|
||||
<div class="item detailRight" :class="{canvas:isEditPattern.value}">
|
||||
<div class="submit">
|
||||
</div>
|
||||
<div class="contentRight" v-if="currentDetailType && !isEditPattern.value">
|
||||
@@ -579,10 +579,12 @@ export default defineComponent({
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
overflow: hidden;
|
||||
}
|
||||
&.isEditPattern{width: 0px;}
|
||||
&.model{
|
||||
width: 45rem;
|
||||
flex: 1;
|
||||
// width: 45rem;
|
||||
// width: 50rem;
|
||||
margin: 0 8rem;
|
||||
// margin: 0 10rem;
|
||||
@@ -590,7 +592,10 @@ export default defineComponent({
|
||||
flex-direction: column;
|
||||
}
|
||||
&.detailRight{
|
||||
flex: 1;
|
||||
width: 30%;
|
||||
&.canvas{
|
||||
width: 60%;
|
||||
}
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
// padding-bottom: calc(6rem + 1rem);
|
||||
|
||||
@@ -347,7 +347,7 @@ export default defineComponent({
|
||||
margin-top: 1rem;
|
||||
justify-content: space-between;
|
||||
align-content: flex-start;
|
||||
&::-webkit-scrollbar{display: none;}
|
||||
// &::-webkit-scrollbar{display: none;}
|
||||
> .content_img_item{
|
||||
width: calc((50% - 1rem));
|
||||
> .content_img_item_block{
|
||||
|
||||
@@ -40,8 +40,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<a-dropdown>
|
||||
<!-- <i class="fi fi-br-upload" :class="{ Guide_1_2_6:type_.type2 == 'Printboard'}"></i> -->
|
||||
<i class="fi fi-br-upload" :class="{ Guide_1_2_6:type_.type2 == 'Printboard'}" :title="$t('Generate.uploadTitle')" v-show="!isTextarea && upload.level1Type !== 'Moodboard' && scene?.value != 'Slogan' && scene?.value != 'Logo'"></i>
|
||||
<i class="fi fi-br-upload" :class="{ Guide_1_2_6:type_.type2 == 'Printboard'}"></i>
|
||||
<template #overlay>
|
||||
<a-menu>
|
||||
<a-menu-item>
|
||||
@@ -61,7 +60,7 @@
|
||||
@change="(file) => fileUploadChange(file)"
|
||||
>
|
||||
<div class="drop-container">
|
||||
<folder-outlined />
|
||||
<i class="fi fi-br-upload" :class="{ Guide_1_2_6:type_.type2 == 'Printboard'}" :title="$t('Generate.uploadTitle')" v-show="!isTextarea && upload.level1Type !== 'Moodboard' && scene?.value != 'Slogan' && scene?.value != 'Logo'"></i>
|
||||
<div>{{ $t('PrintboardUpload.Upload') }}</div>
|
||||
</div>
|
||||
</a-upload>
|
||||
@@ -155,13 +154,13 @@
|
||||
(type_.type2 == 'Printboard' && scene.value == 'Pattern') || type_.type2 == 'Moodboard'" :class="{active:speedState}" @click.stop="openSpeed"></div>
|
||||
<div class="content" v-show="speedState && scene?.value != 'extract'">
|
||||
<div v-for="item in speedList"
|
||||
v-show="(type_.type2 == 'Moodboard' && item?.value != 'flux') ||
|
||||
(type_.type2 == 'Sketchboard' && item?.value != 'flux' && item?.value != 'wx') ||
|
||||
(type_.type2 == 'Printboard' && item?.value != 'wx')"
|
||||
v-show="(type_.type2 == 'Moodboard') ||
|
||||
(type_.type2 == 'Sketchboard' && item?.value != 'high') ||
|
||||
(type_.type2 == 'Printboard')"
|
||||
:key="item.value" :class="{active:item.value == speedData.value}" @click="setSpeed(item)" :title="item.title">{{ item.label }}</div>
|
||||
</div>
|
||||
<div class="content" v-show="speedState && scene?.value == 'extract'">
|
||||
<div v-for="item in extractList" :key="item.value" :class="{active:item.value == speedData.value}" @click="setSpeed(item)" :title="item.title">{{ item.label }}</div>
|
||||
<div class="content" v-show="speedState && scene?.value == 'extract'">
|
||||
<div v-for="item in extractList" :class="{active:item.value == speedData.value}" :key="item.value" @click.stop="setSpeed(item)" :title="item.title">{{ item.label }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="generage_btn started_btn" v-show="isGenerate && !remGenerate">
|
||||
@@ -228,9 +227,7 @@
|
||||
ref="selectImages"
|
||||
@select="handleImageSelect"
|
||||
:api="Https.httpUrls.queryLibraryPage"
|
||||
isLibrary
|
||||
:libraryType="type_.type2"
|
||||
/>
|
||||
isLibrary/>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
@@ -251,7 +248,6 @@ import createSlogan from "@/component/HomePage/createSlogan.vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import sketchCategory from "@/component/HomePage/sketchCategory.vue";
|
||||
import SelectImages from '@/component/common/SelectImages.vue'
|
||||
import { FolderOutlined } from '@ant-design/icons-vue';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
@@ -259,8 +255,7 @@ export default defineComponent({
|
||||
generalMenu,
|
||||
createSlogan,
|
||||
sketchCategory,
|
||||
SelectImages,
|
||||
FolderOutlined
|
||||
SelectImages
|
||||
},
|
||||
props: ["msg",'sketchCatecoryList','scene','gender'],
|
||||
emits:['setLibrary'],
|
||||
@@ -321,7 +316,7 @@ export default defineComponent({
|
||||
{
|
||||
title:'',
|
||||
label:t('speedList.generateWx'),
|
||||
value:'wx',
|
||||
value:'advanced',
|
||||
},{
|
||||
title:'',
|
||||
label:t('speedList.toproductFlus'),
|
||||
@@ -329,13 +324,13 @@ export default defineComponent({
|
||||
},{
|
||||
title:'',
|
||||
label:t('speedList.generateNormal'),
|
||||
value:'fast',
|
||||
|
||||
},{
|
||||
title:'',
|
||||
label:t('speedList.generateFlux'),
|
||||
value:'flux',
|
||||
value:'normal',
|
||||
},
|
||||
// {
|
||||
// title:'',
|
||||
// label:t('speedList.generateFlux'),
|
||||
// value:'flux',
|
||||
// },
|
||||
],
|
||||
extractList:[
|
||||
{
|
||||
@@ -348,7 +343,7 @@ export default defineComponent({
|
||||
speedData:{
|
||||
title:'',
|
||||
label:t('speedList.generateWx'),
|
||||
value:'wx',
|
||||
value:'advanced',
|
||||
},
|
||||
})
|
||||
const openSpeed = ()=>{
|
||||
@@ -370,11 +365,12 @@ export default defineComponent({
|
||||
speed.speedData.value = ''
|
||||
speed.speedData.label = ''
|
||||
}else{
|
||||
if(newVal.value == "Pattern" || props.msg == 'Sketchboard'){
|
||||
speed.speedData = speed.speedList[1]
|
||||
}else{
|
||||
speed.speedData = speed.speedList[0]
|
||||
}
|
||||
// if(newVal.value == "Pattern" || props.msg == 'Sketchboard'){
|
||||
// speed.speedData = speed.speedList[1]
|
||||
// }else{
|
||||
// speed.speedData = speed.speedList[0]
|
||||
// }
|
||||
speed.speedData = speed.speedList[0]
|
||||
}
|
||||
})
|
||||
const setSpeed = (item:any)=>{
|
||||
@@ -382,9 +378,9 @@ export default defineComponent({
|
||||
}
|
||||
onMounted(() => {
|
||||
instance.appContext.config.globalProperties.$dropdownEvents.onClose(removeOpenSpeed)
|
||||
if(props.msg == 'Sketchboard'){
|
||||
speed.speedData = speed.speedList[1]
|
||||
}
|
||||
// if(props.msg == 'Sketchboard'){
|
||||
// speed.speedData = speed.speedList[1]
|
||||
// }
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
|
||||
@@ -707,6 +707,10 @@ defineExpose({
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-shrink: 0;
|
||||
> .image-submit{
|
||||
font-size: 1.2rem;
|
||||
line-height: 4rem;
|
||||
}
|
||||
}
|
||||
|
||||
.image-count {
|
||||
|
||||
@@ -1341,7 +1341,7 @@ export default {
|
||||
toproductBasic:'基础',
|
||||
generateWx:'高级',
|
||||
generateFlux:'进阶',
|
||||
generateNormal:'基础',
|
||||
generateNormal:'标准',
|
||||
},
|
||||
liquifyPanel:{
|
||||
push:'推',
|
||||
|
||||
@@ -1339,8 +1339,8 @@ export default {
|
||||
changeBackground:'Change the background',
|
||||
toproductFlus:'High',
|
||||
toproductBasic:'Basic',
|
||||
generateWx:'Premium',
|
||||
generateFlux:'Advanced',
|
||||
generateWx:'Advanced',
|
||||
generateFlux:'Premium',
|
||||
generateNormal:'Normal',
|
||||
},
|
||||
liquifyPanel:{
|
||||
|
||||
@@ -435,9 +435,9 @@
|
||||
</div>
|
||||
<div class="content" v-if="scene?.value != 'extract'" v-show="speedState">
|
||||
<div v-for="item in speedList" :class="{active:item.value == speedData.value}"
|
||||
v-show="(selectCode == 'Moodboard' && item?.value != 'flux') ||
|
||||
(selectCode == 'Sketchboard' && item?.value != 'flux' && item?.value != 'wx') ||
|
||||
(selectCode == 'Printboard' && item?.value != 'wx')"
|
||||
v-show="(selectCode == 'Moodboard') ||
|
||||
(selectCode == 'Sketchboard' && item?.value != 'high') ||
|
||||
(selectCode == 'Printboard')"
|
||||
:key="item.value" @click.stop="setSpeed(item)" :title="item.title">{{ item.label }}</div>
|
||||
</div>
|
||||
<div class="content" v-else v-show="speedState">
|
||||
@@ -720,10 +720,10 @@ export default defineComponent({
|
||||
let printModelList:any = ref([])
|
||||
let speed = reactive({
|
||||
speedList:[
|
||||
{
|
||||
{
|
||||
title:'',
|
||||
label:t('speedList.generateWx'),
|
||||
value:'wx',
|
||||
value:'advanced',
|
||||
},{
|
||||
title:'',
|
||||
label:t('speedList.toproductFlus'),
|
||||
@@ -731,26 +731,21 @@ export default defineComponent({
|
||||
},{
|
||||
title:'',
|
||||
label:t('speedList.generateNormal'),
|
||||
value:'fast',
|
||||
|
||||
},{
|
||||
title:'',
|
||||
label:t('speedList.generateFlux'),
|
||||
value:'flux',
|
||||
value:'normal',
|
||||
},
|
||||
],
|
||||
extractList:[
|
||||
{
|
||||
title:'',
|
||||
label:t('speedList.generateFlux'),
|
||||
value:'flux',
|
||||
label:t('speedList.generateWx'),
|
||||
value:'advanced',
|
||||
},
|
||||
],
|
||||
speedState:false,
|
||||
speedData:{
|
||||
title:'',
|
||||
label:t('speedList.generateWx'),
|
||||
value:'wx',
|
||||
value:'advanced',
|
||||
},
|
||||
})
|
||||
const openSpeed = ()=>{
|
||||
@@ -994,11 +989,12 @@ export default defineComponent({
|
||||
label:''
|
||||
}
|
||||
}else{
|
||||
if(newVal.value == "Pattern" || this.selectCode == 'Sketchboard'){
|
||||
this.speedData = this.speedList[1]
|
||||
}else{
|
||||
this.speedData = this.speedList[0]
|
||||
}
|
||||
// if(newVal.value == "Pattern" || this.selectCode == 'Sketchboard'){
|
||||
// this.speedData = this.speedList[1]
|
||||
// }else{
|
||||
// this.speedData = this.speedList[0]
|
||||
// }
|
||||
this.speedData = this.speedList[0]
|
||||
}
|
||||
this.speedState = false
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user