部分bug修复和对话中的图片过期处理
This commit is contained in:
X1627315083
181
src/component/home/design/tools.vue
Normal file
181
src/component/home/design/tools.vue
Normal file
@@ -0,0 +1,181 @@
|
||||
<template>
|
||||
<div class="designToolsModel" ref="designToolsModel" v-show="designTools"></div>
|
||||
<a-modal
|
||||
class="collection generalModel fullScreen"
|
||||
v-model:visible="designTools"
|
||||
:footer="null"
|
||||
width="100%"
|
||||
height="100%"
|
||||
:get-container="() => $refs.designToolsModel"
|
||||
:maskClosable="false"
|
||||
:centered="true"
|
||||
:closable="false"
|
||||
:mask="false"
|
||||
:keyboard="false"
|
||||
:destroyOnClose="false"
|
||||
:zIndex="1000"
|
||||
>
|
||||
<div class="generalModel_btn">
|
||||
<div class="generalModel_closeIcon" @click.stop="cleardata()">
|
||||
<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="23" cy="23" r="23" fill="#000" fill-opacity="0.3"/>
|
||||
<rect x="32.5063" y="12" width="3" height="29" rx="1.5" transform="rotate(45 32.5063 12)" fill="white"/>
|
||||
<rect x="34.6274" y="32.5059" width="3" height="29" rx="1.5" transform="rotate(135 34.6274 32.5059)" fill="white"/>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="designOpenrtion_content">
|
||||
<!-- <div class="modal_title_text">
|
||||
<div>Setting</div>
|
||||
</div> -->
|
||||
<div class="collectionBox">
|
||||
<toProductRelight ref="toProduct"
|
||||
:productimgMenu="{value:'ToProductImage',label:$t('ProductImg.ProductImage')}"
|
||||
:isDesignPage="true"
|
||||
@setLike="designLike"
|
||||
class="toProduct"
|
||||
:isState="openType =='toProduct'"
|
||||
v-if="openType == 'toProduct'"
|
||||
></toProductRelight>
|
||||
<toProductRelight ref="relight"
|
||||
:productimgMenu="{value:'Relight',label:$t('ProductImg.Relight')}"
|
||||
:isDesignPage="true"
|
||||
@setLike="designLike"
|
||||
class="relight"
|
||||
:isState="openType =='relight'"
|
||||
v-if="openType == 'relight'"
|
||||
></toProductRelight>
|
||||
<poseTransfer v-if="openType == 'poseTransfer'" :isDesignPage="true" @setLike="designLike" ref="poseTransfer"></poseTransfer>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mark_loading" v-show="isShowMark">
|
||||
<a-spin size="large" />
|
||||
</div>
|
||||
</a-modal>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent,computed,ref,provide,nextTick,inject,toRefs, reactive, onBeforeMount} from 'vue'
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { Https } from "@/tool/https";
|
||||
import { useStore } from "vuex";
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import toProductRelight from '../tools/toProduct/index.vue'
|
||||
import poseTransfer from '../tools/poseTransfer/index.vue'
|
||||
|
||||
export default defineComponent({
|
||||
components:{
|
||||
toProductRelight,poseTransfer
|
||||
},
|
||||
props:{
|
||||
},
|
||||
emits:['editToolsSuccess'],
|
||||
setup(props,{emit}) {
|
||||
const store = useStore();
|
||||
const data = reactive({
|
||||
designTools:false,
|
||||
isShowMark:false,
|
||||
openType:'',
|
||||
selectObject:computed(()=>store.state.Workspace.probjects),//选择的项目
|
||||
createProbject:inject('createProbject',()=>{}) as any,
|
||||
likeDesignList:[],
|
||||
})
|
||||
const dataDom = reactive({
|
||||
toProduct:null as any,
|
||||
relight:null as any,
|
||||
poseTransfer:null as any,
|
||||
}) as any
|
||||
const init = (value:any,list:any)=>{
|
||||
data.designTools = true
|
||||
data.openType = value
|
||||
data.likeDesignList = list
|
||||
console.log(list)
|
||||
nextTick(()=>{
|
||||
let fileList = [] as any
|
||||
if(value == 'toProduct'){
|
||||
list.forEach((item:any) => {
|
||||
item.type = 'DesignOutfit'
|
||||
fileList.push(item)
|
||||
});
|
||||
}else if(value == 'relight' || value == 'poseTransfer'){
|
||||
list.forEach((item:any) => {
|
||||
if(item.childList){
|
||||
item.childList.forEach((child:any) => {
|
||||
if(child.resultType == 'ToProductImage' || child.resultType == 'Relight'){
|
||||
fileList.push(child)
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
dataDom[value].openSetData(fileList)
|
||||
})
|
||||
}
|
||||
let cleardata = async ()=>{
|
||||
data.openType = ''
|
||||
data.likeDesignList = []
|
||||
data.designTools = false
|
||||
}
|
||||
const designLike = ()=>{
|
||||
|
||||
}
|
||||
return{
|
||||
...toRefs(dataDom),
|
||||
...toRefs(data),
|
||||
cleardata,
|
||||
init,
|
||||
designLike,
|
||||
}
|
||||
},
|
||||
provide() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
})
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.designToolsModel{
|
||||
position: relative;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 1000;
|
||||
:deep(>div){
|
||||
|
||||
// position: absolute;
|
||||
// .ant-modal-mask{
|
||||
// position: absolute;
|
||||
// }
|
||||
.ant-modal-wrap,.ant-modal-mask{
|
||||
|
||||
}
|
||||
> .ant-modal-root{
|
||||
> .ant-modal-centered{
|
||||
> .fullScreen{
|
||||
> .ant-modal-content{
|
||||
box-shadow: none;
|
||||
> .ant-modal-body{
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.designOpenrtion_content{
|
||||
height: 100%;
|
||||
> .collectionBox{
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.fullScreen{
|
||||
.generalModel_btn {
|
||||
.generalModel_closeIcon{
|
||||
transform: translate(-10%, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user