aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

合并画布代码

Browse Source
This commit is contained in:
X1627315083
2025-06-18 11:05:23 +08:00
parent 903c0ebdf5
commit 9c7fae36eb
118 changed files with 23633 additions and 8201 deletions
Download Patch File Download Diff File Expand all files Collapse all files

153
src/component/home/tools/poseTransfer/index.vue
View File

@@ -10,13 +10,23 @@
<div class="text">Choose design to transfer</div>
</div>
<div class="imgBox" v-mousewheel>
<div class="item" :class="{active:item.id == selectImg.id}" v-for="item in currentList" @click="selectImgItem(item)">
<img :src="item.imgUrl || item.url" alt="">
<a-checkbox v-model:checked="item.isChecked"></a-checkbox>
</div>
<div class="item" :class="{active:item.id == selectImg.id}" v-for="item in fileList" @click="selectImgItem(item)">
<!-- <div class="item" :class="{active:item.id == selectImg.id}" v-for="item in currentList" @click="selectImgItem(item)">
<img :src="item.imgUrl || item.url" alt="">
<a-checkbox v-model:checked="item.isChecked"></a-checkbox>
</div> -->
<div class="item" :class="{active:item.id == selectImg.id}" v-for="item,index in fileList" @click="selectImgItem(item)">
<div class="" v-if="item.status == 'uploading'" style="display: flex;align-items: center;">
<a-spin size="large" />
</div>
<img v-show="item.status != 'uploading'" :src="item.imgUrl || item.url" alt="">
<div v-show="item.status != 'uploading'" class="btnBox">
<div :class="{active:item.isChecked}">
<i class="fi fi-br-check"></i>
</div>
<div @click.stop="setUploadDelete(item,index)">
<i class="fi fi-rr-trash icon_delete"></i>
</div>
</div>
</div>
<div class="upload_item item">
<div class="upload_file_item">
@@ -43,7 +53,6 @@
</a-upload>
</div>
</div>
</div>
</div>
<div class="poses">
@@ -107,7 +116,7 @@
</div>
</template>
<script lang="ts">
import { defineComponent,computed,ref,inject,nextTick,createVNode,toRefs, reactive, onMounted} from 'vue'
import { defineComponent,computed,ref,inject,nextTick,watch,createVNode,toRefs, reactive, onMounted} from 'vue'
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { Https } from "@/tool/https";
import { useStore } from "vuex";
@@ -144,8 +153,8 @@ export default defineComponent({
projectId:computed(()=>store.state.Workspace.probjects.id)
},
waitList:[],
likeList:computed(()=>store.state.HomeStoreModule.poseTransfer),
noLikeList:[ ],
likeList:computed(()=>store.state.HomeStoreModule.poseTransfer.likedList),
noLikeList:computed(()=>store.state.HomeStoreModule.poseTransfer.list),
isGenerate:false,//判断是否正在进行generate
remGenerate:false,
removeGenerate:false,
@@ -153,6 +162,16 @@ export default defineComponent({
poseList:[],
selectPose:null as any,
})
watch(()=>store.state.HomeStoreModule.uploadElement.length,(newVal,oldVal)=>{
data.fileList = store.state.HomeStoreModule.uploadElement
})
watch(()=>store.state.HomeStoreModule.poseTransfer.list.length,(newVal,oldVal)=>{
let list = store.state.HomeStoreModule.poseTransfer.list
data.isGenerate = true
data.remGenerate = true
let taskIdList = list.filter((item:any)=>!item.id)
if(taskIdList.length > 0)setGenerate(taskIdList[0].taskId)
})
let speed = reactive({
speedList:[
{
@@ -180,6 +199,10 @@ export default defineComponent({
scaleVideo:null as any,
})
const selectImgItem = (item:any,)=>{
if(item.isChecked){
item.isChecked = !item.isChecked
return
}
data.selectImg = item
data.fileList.forEach((listItem:any)=>listItem.isChecked = false)
data.currentList.forEach((listItem:any)=>listItem.isChecked = false)
@@ -194,18 +217,17 @@ export default defineComponent({
if(data.poseList.length == 0){
getPoseList()
}
setCloudImg()
}
const setCloudImg = ()=>{
let arr = store.state.UploadFilesModule.cloudList
let list = JSON.parse(JSON.stringify(arr.poseTransfer)) || []
list.forEach((item:any)=>{
item.url = item.firstFrameUrl
data.noLikeList.unshift(item)
})
store.commit('clearCloudList','poseTransfer')
// setCloudImg()
}
// const setCloudImg = ()=>{
// let arr = store.state.UploadFilesModule.cloudList
// let list = JSON.parse(JSON.stringify(arr.poseTransfer)) || []
// list.forEach((item:any)=>{
// item.url = item.firstFrameUrl
// data.noLikeList.unshift(item)
// })
// store.commit('clearCloudList','poseTransfer')
// }
const gifPlay = (e:any,item:any)=>{
e.target.src = item.gif//使用gif图片
}
@@ -234,9 +256,8 @@ export default defineComponent({
if(data.isGenerate)return
data.isGenerate = true
data.remGenerateTime = setTimeout(()=>{
data.remGenerate = true
},10000)
// data.remGenerateTime = setTimeout(()=>{
// },10000)
let value = {
poseId:data.selectPose,
projectId:store.state.Workspace.probjects.id,
@@ -244,6 +265,7 @@ export default defineComponent({
modelName:speed.speedData.value,
}
Https.axiosPost(Https.httpUrls.poseTransform,value).then((rv)=>{
data.remGenerate = true
data.noLikeList.unshift({taskId:rv})
setGenerate(rv)
}).catch((res:any)=>{
@@ -254,6 +276,7 @@ export default defineComponent({
}
const setGenerate = (dataList:any)=>{
let list:any = dataList
data.waitList = list
let dataNum = dataList.length
let state = true
data.generateTime = setInterval(()=>{
@@ -271,30 +294,24 @@ export default defineComponent({
element.url = element.firstFrameUrl
let index = data.noLikeList.findIndex((obj:any) => obj.taskId === element.taskId);
data.noLikeList[index] = element
console.log(list)
list = ''
// if(list?.filter)list = list?.filter((item:any) => item !== element.taskId);
store.dispatch('getCredits')
}else if(element.status == 'Fail'){
let index = data.noLikeList.findIndex((obj:any) => obj.taskId === element.taskId);
data.noLikeList.splice(index,1)
clearInterval(data.generateTime)
clearInterval(data.remGenerateTime)
data.remGenerate = false
data.isGenerate = false
store.dispatch('getCredits')
}
});
data.waitList = list
if((!list)|| (rv.filter((item:any)=>item.status == 'Invalid').length ==list.length)){
if(rv.filter((item:any)=>item.status == 'Invalid').length ==dataNum){
message.info(t('Generate.effectPoor'));
}else{
}
// this.store.dispatch('getCredits')
clearInterval(data.generateTime)
clearInterval(data.remGenerateTime)
data.remGenerate = false
data.isGenerate = false
}
}
}
).catch(res=>{
data.noLikeList = data.noLikeList.filter((item:any)=>item.taskId != list)
let index = data.noLikeList.findIndex((obj:any) => obj.taskId === list);
data.noLikeList.splice(index,1)
clearInterval(data.generateTime)
clearInterval(data.remGenerateTime)
data.isGenerate = false
@@ -417,7 +434,7 @@ export default defineComponent({
(rv) => {
if(str == 'like'){
let value = {
list:[item],
likedList:[item],
str:'add',
index:-1,
}
@@ -425,7 +442,7 @@ export default defineComponent({
data.noLikeList.splice(index,1)
}else{
let value = {
list:[item],
likedList:[item],
str:'splice',
index:index,
}
@@ -455,6 +472,19 @@ export default defineComponent({
}
const setSpeed = (item:any)=>{
speed.speedData = item
speed.speedState = false
}
const setUploadDelete = (item:any,index:any)=>{
let value = {
id:item.id
}
Https.axiosPost(Https.httpUrls.toProductImageElementDelete,{},{params:value}).then((rv)=>{
let storeData = {
str:'delete',
index,
}
store.commit('setUploadElement',storeData)
})
}
return{
...toRefs(speed),
@@ -476,6 +506,7 @@ export default defineComponent({
selectPose,
openSpeed,
setSpeed,
setUploadDelete,
}
},
directives:{
@@ -512,6 +543,7 @@ export default defineComponent({
flex-direction: column;
align-items: center;
padding-right: 3.8rem;
width: 39rem;
&.active{
width: 0;
overflow: hidden;
@@ -562,14 +594,13 @@ export default defineComponent({
}
}
> .configuratioBox > .configuratio{
width: 31.8rem;
width: 100%;
padding-bottom: 1rem;
> .title{
// font-size: 2.6rem;
}
> .content{
// margin-top: 4rem;
margin-top: 1.8rem;
> .selectImg,> .poses{
display: flex;
flex-direction: column;
@@ -602,6 +633,40 @@ export default defineComponent({
top: 2rem;
right: 2rem;
}
> .btnBox{
position: absolute;
right: 1rem;
top: 1rem;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
> div{
width: 2rem;
height: 2rem;
display: flex;
border: 1px solid;
align-items: center;
border-radius: .5rem;
justify-content: center;
cursor: pointer;
margin-bottom: 1rem;
> i{
display: flex;
}
>.fi-br-check{
color: #fff;
display: none;
}
&.active{
background: #000;
> i{
display: flex;
color: #fff;
}
}
}
}
> img{
width: 100%;
object-fit: contain;
@@ -627,8 +692,6 @@ export default defineComponent({
}
}
> .likeBox ,> .noLikeBox{
margin-top: 1.8rem;
flex: 1;
position: relative;
> .element{