Files
aida_front/src/component/home/batchGeneration/index.vue
2025-08-22 10:27:48 +08:00

584 lines
15 KiB
Vue

<template>
<div class="uploading">
<div class="title">
<div class="list">
<div
class="titleItem active"
>
<span class="detailText">All</span>
</div>
</div>
<div class="searchObject generalModel_state">
<div class="generalModel_state_item smail" style="margin-right: 1rem;">
<span>{{$t('batchGeneration.Project')}} :</span>
<a-select
v-model:value="projectData"
show-search
allowClear
size="large"
:show-arrow="false"
:default-active-first-option="false"
:not-found-content="null"
:filter-option="false"
style="width: 16rem"
:fieldNames="{ label: 'name', value: 'value'}"
placeholder="Please select"
:options="objectList"
@search="getHistoryProjectList"
@change="handleChange"
>
<template #option="{ value: val, label, icon,updateTime }">
<span :title="updateTime.replace('T', ' ')">{{ label }}</span>
</template>
</a-select>
</div>
</div>
<div class="createCloud">
<div class="gallery_btn" style="margin-right: 2rem;" @click="pagination">{{$t('batchGeneration.Search')}}</div>
<div class="gallery_btn white" @click="createClound">{{$t('batchGeneration.Create')}}</div>
</div>
</div>
<div class="contentList">
<div class="title">
<div class="titleItem" v-for="item in cloudTiltleList" :key="item.value">
{{ item.name }}
</div>
</div>
<div class="content">
<tr v-for="(row, index) in contentList" :key="index">
<td v-for="header in cloudTiltleList" :key="header.value">
<div v-if="header.value != 'operation' && header.value != 'name'">
{{header?.fun?header.fun(row[header.value]) : row[header.value]}}
</div>
<div v-if="header.value == 'name'">
<div v-if="row.id == renameId" class="rename">
<input type="text" v-model="renameText">
<i class="fi fi-br-check" @click="submitRename(row)"></i>
</div>
<div v-else :title="header?.fun?header.fun(row[header.value]) : row[header.value]" style="white-space: nowrap;text-overflow: ellipsis;overflow: hidden;width: 15rem;">
{{header?.fun?header.fun(row[header.value]) : row[header.value]}}
</div>
</div>
<span style="color: #007EE5; cursor: pointer; margin-right: 1rem;" v-show="header.value == 'operation'" @click="setRename(row)">
{{$t('batchGeneration.Rename')}}
</span>
<span style="color: #007EE5; cursor: pointer; margin-right: 1rem;" :style="{opacity:row.status == 1?1:.5}" v-show="header.value == 'operation'" @click="detailIamge(row)">
{{$t('batchGeneration.Review')}}
</span>
<span style="color: #007EE5; cursor: pointer;" v-show="header.value == 'operation'" @click="deleteRom(row)">
{{$t('batchGeneration.Delete')}}
</span>
</td>
</tr>
</div>
<a-pagination style="text-align: center;" @change="pagination" v-model:current="currentPage" :total="total" show-less-items />
</div>
<div class="mark_loading" v-show="loadingShow">
<a-spin size="large" />
</div>
<createCloud ref="createCloud" :cloudList="generateList.seriesDesign" @getContentList="submitGetContentList"></createCloud>
</div>
</template>
<script lang="ts">
import { defineComponent,computed,ref,onMounted,nextTick,createVNode,toRefs, reactive, onBeforeUnmount, inject} from 'vue'
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { Https } from "@/tool/https";
import { useStore } from "vuex";
import { useI18n } from 'vue-i18n'
import createCloud from "./createCloud.vue";
import { da } from 'element-plus/es/locale';
import { useRouter,useRoute } from 'vue-router'
export default defineComponent({
components:{
createCloud,
},
emits:['retrieve'],
setup(props,{emit}) {
const {t} = useI18n()
const store = useStore();
const router = useRouter()
const route = useRoute()
const data = reactive({
pageType:'list',
pageSize:10,
currentPage:1,
total:0,
selectObject:computed(()=>store.state.Workspace.probjects),//选择的项目
projectData:null as any,//批量id
createData:null as any,
settingGetHistory:inject('settingGetHistory') as any,
generateList:{
seriesDesign:[
{
label:t('newProjectg.SeriesDesign'),
// value:'SERIES_DESIGN',
consumption:0,
value:'SERIES_DESIGN',
},{
label:t('newProjectg.SingleDesign'),
// value:'SINGLE_DESIGN',
consumption:0,
value:'SINGLE_DESIGN',
},{
label:t('Header.toolsToProduct'),
// value:'toProductImage',
consumption:5,
value:'TO_PRODUCT_IMAGE',
},{
label:t('Header.toolsRelight'),
// value:'relight',
consumption:5,
value:'RELIGHT',
},{
label:t('Header.toolsToTransferPose'),
// value:'poseTransfer',
consumption:10,
value:'POSE_TRANSFER',
},
],
singleProductDesign:[
{
label:'Design',
value:'design',
consumption:0,
},{
label:'To Product Image',
value:'toProductImage',
consumption:5,
},
],
// printDesign:[
// {
// label:'1',
// value:100,
// }
// ],
productDrawingDesign:[
{
label:'To Product Image',
value:'toProductImage',
consumption:5,
},{
label:'Relight',
value:'relight',
consumption:5,
},{
label:'Transfer Pose',
value:'poseTransfer',
consumption:10,
},
],
// printingDesign3D:[
// {
// label:'1',
// value:100,
// }
// ],
// sketchDesign:[]
},
cloudTiltleList:[
{
name:computed(()=>t('batchGeneration.sequence')),
value:'sequence',
},
{
name:computed(()=>t('batchGeneration.TaskName')),
value:'name',
},{
name:computed(()=>t('batchGeneration.TaskType')),
value:'buildType',
fun:(value:any)=>{
let str = ''
if(value == 'design')str = 'Design'
if(value == 'toProductImage')str = 'To Product Image'
if(value == 'relight')str = 'Relight'
if(value == 'poseTransfer')str = 'Transfer Pose'
return str
}
},{
name:computed(()=>t('batchGeneration.QuantityGenerated')),
value:'nums',
},
{
name:computed(()=>t('batchGeneration.CreationTime')),
value:'createTime',
fun:(value:any)=>{
if(!value)return
return value.split('T')[0] + ' ' + value.split('T')[1].split('.')[0]
}
},
{
name:computed(()=>t('batchGeneration.StartTime')),
value:'startTime',
fun:(value:any)=>{
//没开始内容为 -
if(!value)return
return value.split('T')[0] + ' ' + value.split('T')[1].split('.')[0]
}
},{
name:computed(()=>t('batchGeneration.UpdateTime')),
value:'updateTime',
fun:(value:any)=>{
if(!value)return
return value.split('T')[0] + ' ' + value.split('T')[1].split('.')[0]
}
},{
name:computed(()=>t('batchGeneration.Status')),
value:'process',
fun:(value:any)=>{
if(value == '100.00%'){
return 'Completed'
}else{
return value
}
}
},{
name:computed(()=>t('batchGeneration.Operation')),
value:'operation',
},
] as any,
contentList:[
] as any,
objectList:[],
isGetContentList:false as any,
renameId:-1 as any,
renameText:'',
loadingShow:false,
})
const dataDom = reactive({
createCloud,
})
const getNextSequence = ()=>{
return new Promise((resolve, reject) => {
data.loadingShow = true
Https.axiosGet(Https.httpUrls.getNextSequence).then((rv)=>{
data.loadingShow = false
data.isGetContentList = false
resolve(rv)
}).catch(()=>{
data.loadingShow = false
resolve('')
})
})
}
const createClound = ()=>{
let obj = {}
if(data.createData){
data.generateList.seriesDesign.forEach((item:any)=>{
if((item.value == data.createData.process)){
obj = item
}
})
}
console.log(obj)
getNextSequence().then((rv)=>{
dataDom.createCloud.init(data.createData,obj,rv)
})
}
const createData = ()=>{
store.commit("createProbject");
store.commit("clearAllData");
store.commit("clearAllCollection");
store.commit("setAllBoardDataChoose",{});
store.commit("clearShowSketchboard",{});
store.commit("clearAllCollection");
}
const detailIamge = (item:any)=>{
//去除里面的T2025-04-17T13:45:43
if(item.process == '100.00%' || item.status == 1){
let value = {
taskId:item.taskId,
page:1,
size:10,
buildType:item.buildType,
}
createData()
if(item.buildType == 'design'){
router.push(`/home?history=${item.projectId}&source=batch`)
}else if(item.buildType == 'toProductImage'){
router.push(`/home/tools?tools=toProduct&id=${item.projectId}&source=batch`)
}else if(item.buildType == 'relight'){
router.push(`/home/tools?tools=${item.buildType}&id=${item.projectId}&source=batch`)
}else if(item.buildType == 'poseTransfer'){
router.push(`/home/tools?tools=${item.buildType}&id=${item.projectId}&source=batch`)
}
data.isGetContentList = false
Https.axiosPost(Https.httpUrls.getDesignCloudResult,value).then((rv)=>{
if(item.buildType == 'design'){
store.commit('addDesignCollectionList',rv.design)
router.push(`/home?history=${item.projectId}&source=batch`)
}else if(item.buildType == 'toProductImage'){
store.commit('setCloudList',{str:'toProduct',list:rv.toProductImage})
router.push(`/home/tools?tools=toProduct&id=${item.projectId}&source=batch`)
}else if(item.buildType == 'relight'){
store.commit('setCloudList',{str:'relight',list:rv.relight})
router.push(`/home/tools?tools=${item.buildType}&id=${item.projectId}&source=batch`)
}else if(item.buildType == 'poseTransfer'){
let list = {
list:rv.poseTransfer,
str:'add',
index:-1,
}
store.commit("setPoseTransfer", list);
// store.commit('setCloudList',{str:'poseTransfer',list:rv.poseTransfer})
router.push(`/home/tools?tools=${item.buildType}&id=${item.projectId}&source=batch`)
}
data.isGetContentList = false
})
}
}
const pagination = ()=>{
data.isGetContentList = true
data.renameId = -1
getContentList()
}
let time = null as any
const getContentList = ()=>{
if(data.isGetContentList){
clearTimeout(time)
let value = {
page:data.currentPage,
size:data.pageSize,
projectId: data.projectData?.value?data.projectData?.value:'',
}
Https.axiosPost(Https.httpUrls.cloudPage,value).then((rv)=>{
data.contentList = rv.content
data.total = rv.total
let arr = rv.content
let result = arr.some((item:any) => (item.process !== '100.00%' && item.status !== 1));
if(!result)data.isGetContentList = false
time = setTimeout(()=>{
getContentList()
},1500)
})
}
}
let getHistoryTime = null as any
const getHistoryProjectList = (event:any)=>{
clearTimeout(getHistoryTime)
if(!event){
data.objectList = []
return
}
getHistoryTime = setTimeout(()=>{
let value = {
projectName:event,
page:1,
size:9999,
asc:0,
process:'',
}
Https.axiosPost(Https.httpUrls.historyProject,value).then((rv)=>{
rv.content.forEach((item:any)=>{
item.value = item.id
item.label = item.name
})
data.objectList = rv.content
})
},1000)
}
const submitGetContentList = (project:any)=>{
data.isGetContentList = true
// if(project){
// data.projectData = project
// }else{
// data.projectData = null
// }
// data.currentPage = 1
getContentList()
if(data.settingGetHistory)data.settingGetHistory()
}
const handleChange = (event:any,value:any)=>{
data.createData = value
}
const setRename = (item:any)=>{
data.renameId = item.id
data.renameText = item.name
}
const submitRename = (item:any)=>{
data.renameId = -1
data.loadingShow = true
let value = {
id:item.id,
name:data.renameText,
}
Https.axiosPost(Https.httpUrls.cloudTaskNameUpdate,value).then((rv)=>{
data.loadingShow = false
data.renameText = ''
data.isGetContentList = true
getContentList()
}).catch((err)=>{
data.loadingShow = false
})
}
const deleteRom = (item:any)=>{
let value = {
id:item.id
}
Https.axiosPost(Https.httpUrls.cloudTaskDelete,value).then((rv)=>{
data.loadingShow = false
data.isGetContentList = true
getContentList()
}).catch((err)=>{
data.loadingShow = false
})
}
onBeforeUnmount(()=>{
data.isGetContentList = false
})
watch(()=>route.query.id,(newValue,oldValue)=>{
if(route.query?.id){
data.projectData = {
value:route.query?.id,
label:route.query?.name,
}
data.createData = {
label:route.query?.name,
id:route.query?.id,
process:route.query?.process
}
createClound()
}
},{immediate:true})
onMounted(()=>{
data.isGetContentList = true
getContentList()
// if(route.query?.type == 'creation')dataDom.createCloud.init(data.projectData)
})
return{
...toRefs(dataDom),
...toRefs(data),
createClound,
detailIamge,
getContentList,
submitGetContentList,
handleChange,
getHistoryProjectList,
pagination,
setRename,
submitRename,
deleteRom,
}
},
provide() {
return {
}
},
})
</script>
<style lang="less" scoped>
.uploading{
width: 100%;
height: 100%;
position: relative;
padding-top: 3rem;
display: flex;
flex-direction: column;
> .title{
width: 100%;
display: flex;
> .list{
display: flex;
margin-bottom: 2.5rem;
> .titleItem:last-child{
margin-right: 0;
}
> .titleItem{
position: relative;
cursor: pointer;
margin-right: 6.5rem;
}
> .titleItem::before {
position: absolute;
content: "";
display: block;
background: #000;
height: calc(.4rem*1.2);
left: 50%;
transform: translateX(-50%);
bottom: -.5rem;
width: 0px;
transition: 0.3s all;
}
> .active {
color: #000;
font-weight: 600;
}
> .active::before {
width: 100%;
}
}
> .createCloud{
}
> .searchObject{
margin-left: auto;
}
}
> .contentList{
flex: 1;
overflow: hidden;
padding-top: 2.5rem;
display: flex;
flex-direction: column;
> .content tr , > .title{
display: flex;
justify-content: space-between;
padding: 0 1.2rem;
}
> .title{
background: #F7F7F7;
> .titleItem{
line-height: 4.6rem;
font-size: 2rem;
color: #666666;
// width: calc(100% / 4);
width: 20rem;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
text-align: center;
}
}
.content{
flex: 1;
overflow: hidden;
> tr{
> td{
text-align: center;
width: calc(100% / 4);
line-height: 4.6rem;
font-size: 1.6rem;
display: flex;
align-items: center;
justify-content: center;
.rename{
display: flex;
align-items: center;
input{
height: 100%;
padding: .8rem;
width: 12rem;
}
> i{
margin-left: 1rem;
cursor: pointer;
width: 3rem;
height: 3rem;
background: #000;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
border-radius: 2rem;
}
}
}
}
}
}
}
</style>