接入画布

This commit is contained in:
X1627315083
2025-06-09 10:25:54 +08:00
parent 87a08f5f8f
commit c266967f16
157 changed files with 43833 additions and 1571 deletions

View File

@@ -1,437 +0,0 @@
<template>
<div class="createCloud" ref="createCloud"></div>
<a-modal
class="createCloud_modal generalModel"
v-model:visible="operationsModal"
:footer="null"
:get-container="() => $refs.createCloud"
width="50%"
:height="'77rem'"
:maskClosable="false"
:centered="true"
:closable="false"
:mask="true"
wrapClassName="#app"
:keyboard="false"
>
<div class="generalModel_btn">
<div class="generalModel_closeIcon" @click.stop="cancelDsign()">
<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="white" fill-opacity="0.3"/>
<rect x="32.5063" y="12" width="3" height="29" rx="1.5" transform="rotate(45 32.5063 12)" fill="#000"/>
<rect x="34.6274" y="32.5059" width="3" height="29" rx="1.5" transform="rotate(135 34.6274 32.5059)" fill="#000"/>
</svg>
</div>
</div>
<div class="modal_title_text">
<div>Create Cloud Generation Tasks</div>
</div>
<div class="allUserPoeration_center admin_page">
<div class="admin_state_item">
<span>Task type <span>*</span></span>
<a-select
v-model:value="buildType"
allowClear
style="width: 200px"
placeholder="Please select"
:options="cloudList"
@change="changeBuildType"
></a-select>
</div>
<div class="admin_state_item" v-show="buildType">
<span>Quantity <span>*</span></span>
<input
v-model="numberOfImages"
placeholder="Please enter number"
type="text"
style="width: 200px"
@input="changeNumberOfImages"
/>
</div>
<!-- toProductimg -->
<div v-show="buildType == 'toProductImage'" class="admin_state_item ">
<span>{{$t('ProductImg.Similarity')}}</span>
<div class="sliderAndImput" style="width: 200px">
<a-slider class="system_silder"
v-model:value="similarity"
:tooltipVisible="false"
:step="5"
>
</a-slider>
<input type="number" readonly v-model="similarity">
</div>
</div>
<div v-show="buildType == 'relight'" class="admin_state_item ">
<span>{{$t('ProductImg.RelightDirection')}}</span>
<a-select style="width: 200px" v-model:value="relightDirection" :options="relightDirectionList"></a-select>
</div>
<div v-show="buildType == 'relight'" class="admin_state_item ">
<span>{{$t('ProductImg.Highlight')}}</span>
<div class="sliderAndImput" style="width: 200px">
<a-slider class="system_silder"
v-model:value="brightenValue"
:tooltipVisible="false"
:max="3"
:min="1"
:step="0.1"
>
</a-slider>
<input type="number" readonly v-model="brightenValue">
</div>
</div>
<div v-show="buildType == 'toProductImage' || buildType == 'relight'" class="admin_state_item">
<span>Keyword</span>
<input
v-model="generateText"
:placeholder="$t('Generate.inputContent1')"
type="text"
style="width: 200px"
/>
</div>
<div class="selectImgList generalScroll" v-mousewheel v-show="exhibitionImgList.length>0">
<div v-for="item in exhibitionImgList" class="item">
<img :src="item.designOutfitUrl||item.url" alt="">
</div>
</div>
<!-- <div class="admin_state_item" style="width: 100%;">
<span style="margin: 0;">Generation time19min</span>
</div> -->
<div v-show="buildType" class="admin_state_item" style="width: 100%;">
<span style="margin: 0;">Cost credit{{credits * numberOfImages}}</span>
</div>
</div>
<div class="allUserPoeration_btn admin_page">
<!-- <div class="admin_search_item" @click="cancelDsign">
Close
</div> -->
<div class="admin_search_item" @click="setOk">
OK
</div>
</div>
</a-modal>
<div class="mark_loading" v-show="loadingShow">
<a-spin size="large" />
</div>
</template>
<script>
import { defineComponent, computed, reactive, watch, onMounted, nextTick, toRefs } from "vue";
import { Https } from "@/tool/https";
import { Modal, message } from "ant-design-vue";
import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
import { formatTime,isEmail } from "@/tool/util";
import dayjs, { Dayjs } from 'dayjs';
import { useStore } from "vuex";
import { useI18n } from "vue-i18n";
import {getMinioUrl} from '@/tool/util'
const md5 = require("md5");
export default defineComponent({
components: {
},
props:{
cloudList:{
type:Array,
default:[]
}
},
emits: ['getContentList'],
setup(props,{emit}) {
const store = useStore();
let operations = reactive({
operationsModal:false,
loadingShow:false,
})
let operationsData = reactive({
buildType:'',
numberOfImages:'',
credits:0,
exhibitionImgList:[],//选择的图片
selectObject:computed(()=>store.state.Workspace.probjects),//选择的项目
//toProduct
generateText:'',//输入的内容
similarity:30,
brightenValue:1,//亮度
relightDirection:'Right Light',//打光方向
relightDirectionList:[
{
value:'Right Light',
label:useI18n().t('ProductImg.RightLight')
},{
value:'Left Light',
label:useI18n().t('ProductImg.LeftLight')
},{
value:'Top Light',
label:useI18n().t('ProductImg.TopLight')
},{
value:'Bottom Light',
label:useI18n().t('ProductImg.BottomLight')
}
]
})
let init = ()=>{
operations.operationsModal = true
}
const changeBuildType = ()=>{
if(operationsData.buildType == 'design'){
operationsData.exhibitionImgList = []
}else if(operationsData.buildType == 'toProductImage'){
operationsData.exhibitionImgList = store.state.UploadFilesModule.modularData.design.likeData
}else if(operationsData.buildType == 'relight'){
operationsData.exhibitionImgList = store.state.UploadFilesModule.modularData.toProduct
}else if(operationsData.buildType == 'poseTransfer'){
operationsData.exhibitionImgList = store.state.UploadFilesModule.modularData.toProduct
}
props.cloudList.forEach((item)=>{
if(item.value == operationsData.buildType){
operationsData.credits = item.consumption
}
})
}
let getPorductImg = ()=>{
let modularData = store.state.UploadFilesModule.modularData
let list = []
if(operationsData.buildType == 'toProductImage' || operationsData.buildType == 'relight'){
let productOrRelight = []
if(operationsData.buildType == 'toProductImage')productOrRelight = modularData.design.likeData
if(operationsData.buildType == 'relight')productOrRelight = modularData.toProduct
productOrRelight.forEach((item)=>{
if(!item.id)return
let obj = {
"createTime": "",
"elementId": 0,
"elementType": "",
"id": 0,
"isLike": 0,
"taskId": "",
"toProductImageRecordId": 0,
"url": "",
}
obj.elementId = item.designOutfitId
obj.elementType = 'DesignOutfit'
if(operationsData.buildType == 'relight'){
obj.elementId = item.id
obj.elementType = 'ToProductImage'
}
list.push(obj)
})
}
return list
}
const getImageStrength = () => {
let imageStrength = operationsData.similarity == 100? 95 :operationsData.similarity
return imageStrength;
};
const getPoseTransformData = ()=>{
let list = []
let toProduct = store.state.UploadFilesModule.modularData.toProduct
toProduct.forEach((item)=>{
let obj = {
poseId:1,
productImage:getMinioUrl(item.url)
}
list.push(obj)
})
return list
}
let setAddData = ()=>{
return {
"buildType": operationsData.buildType,
nums: operationsData.numberOfImages,
projectId: operationsData.selectObject.id,
//productimg
toProductImage:{
prompt:operationsData.generateText,//输入的内容
toProductImageVOList:getPorductImg(),//选择的图片
projectId: operationsData.selectObject.id,
direction:operationsData.relightDirection,//打光方向
brightenValue:operationsData.brightenValue,
imageStrength:(100 - getImageStrength())/100,
},
//poseTransform
poseTransform:getPoseTransformData(),
private: operationsData.selectObject.id,
ToProductImageDTO: operationsData.selectObject.id,
}
}
let cancelDsign = ()=>{
operationsData.buildType=''
operationsData.numberOfImages=''
operations.operationsModal = false
}
let setOk = ()=>{
let data
data = setAddData()
if(operationsData.buildType == 'toProductImage'){
if(data.toProductImage.toProductImageVOList.length == 0)return message.warning("You need to go to the Design module and generate a design result first before you can use the 'To Product Image' cloud generation feature.")
}else if(operationsData.buildType == 'relight'){
if(data.toProductImage.toProductImageVOList.length == 0)return message.warning("You need to go to the 'To Product Image' module and generate a result first before you can use the 'Relight' cloud generation feature.")
}else if(operationsData.buildType == 'poseTransfer'){
if(data.poseTransform.length == 0)return message.warning("You must first generate results in the 'To Product Image' module before you can use the 'Transfer Pose' cloud generation feature.")
}
if(!data.buildType || !data.nums)return message.warning('Please check the input box marked with *')
operations.loadingShow = true
Https.axiosPost(Https.httpUrls.designCloud, data).then(
(rv) => {
if (rv) {
operations.loadingShow = false
cancelDsign()
emit('getContentList')
}
}).catch((error) => {
operations.loadingShow = false
})
}
const changeNumberOfImages = ()=>{
if(operationsData.buildType =='relight' || operationsData.buildType == 'poseTransfer'){
if(operationsData.exhibitionImgList.length < Number(operationsData.numberOfImages)){
operationsData.numberOfImages = operationsData.exhibitionImgList.length
}
}
}
return {
...toRefs(operations),
...toRefs(operationsData),
cancelDsign,
init,
focus,
blur,
setOk,
changeBuildType,
changeNumberOfImages,
};
},
data() {
return {
};
},
mounted() {},
methods: {
},
directives:{
mousewheel:{
mounted (el) {
el.addEventListener('mouseenter', (e)=> {
if(el.scrollWidth > el.clientWidth){
el.parentElement.style.overflowY = 'hidden';
}
});
// 鼠标移出事件
el.addEventListener('mouseleave', ()=> {
el.parentElement.style.overflowY = 'auto';
});
el.addEventListener('wheel',(e)=>{
let num = 0
if(e.deltaY > 0){
num = 25
}else{
num = -25
}
el.scrollBy(num, 0);
},{ passive: true })
}
},
},
});
</script>
<style lang="less" scoped>
:deep(.ant-modal-mask){
background: rgba(0, 0, 0, 0.2);
}
:deep(.createCloud_modal){
.ant-modal-body{
display: flex;
flex-direction: column;
}
}
</style>
<style lang="less" scoped>
.createCloud_modal {
.closeIcon {
z-index: 2;
}
.allUserPoeration_btn{
display: flex;
flex-direction: row;
height: auto;
justify-content: flex-end;
padding: 1rem 0;
.admin_search_item{
margin-bottom: 0;
}
}
.allUserPoeration_center{
flex: 1;
overflow-y: auto;
flex-direction: row;
flex-wrap: wrap;
align-content: flex-start;
padding: 0 2rem;
> .selectImgList{
width: 100%;
display: flex;
overflow-x: auto;
align-items: center;
flex-wrap: nowrap;
height: 20rem;
margin: 2rem 0;
> .item{
height: 100%;
margin-right: 1rem;
&:last-child{
margin-right: 0;
}
> img{
height: 100%;
}
}
//
}
> .admin_state_item{
width: auto;
// width: 100%;
display: flex;
flex-direction: column;
align-items: flex-start;
> span{
text-align: left;
margin: 0;
margin-bottom: 1.5rem;
font-weight: 600;
}
:deep(> .ant-select > .ant-select-selector){
border-radius: 1.6rem;
}
> input{
border-radius: 1.6rem;
}
>.sliderAndImput{
display: flex;
align-items: center;
flex: 1;
:deep(> .ant-slider){
// border-radius: 1.6rem;
flex: 1;
}
> input{
border-radius: 1.6rem;
width: 4rem;
margin-left: 1rem;
height: 100%;
border-radius: 1rem;
}
}
}
}
}
</style>

View File

@@ -1,343 +0,0 @@
<template>
<div class="uploading">
<div class="title">
<div class="list">
<div
class="titleItem active"
>
<span class="detailText">All</span>
</div>
</div>
<div class="createCloud">
<div class="gallery_btn" @click="createClound">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">
<span v-show="header.value != 'operation'">
{{header?.fun?header.fun(row[header.value]) : row[header.value]}}
</span>
<span style="color: #007EE5; cursor: pointer;" v-show="header.value == 'operation'" @click="detailIamge(row)">
Review
</span>
</td>
</tr>
</div>
<a-pagination style="text-align: center;" v-model:current="currentPage" :total="total" show-less-items />
</div>
<createCloud ref="createCloud" :cloudList="generateList[workflowType]" @getContentList="submitGetContentList"></createCloud>
</div>
</template>
<script lang="ts">
import { defineComponent,computed,ref,onMounted,nextTick,createVNode,toRefs, reactive, onBeforeUnmount} 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';
export default defineComponent({
components:{
createCloud,
},
props:{
workflowType:{
type:String,
default:'' as any,
required:true
}
},
emits:['retrieve'],
setup(props,{emit}) {
const store = useStore();
const data = reactive({
pageType:'list',
pageSize:10,
currentPage:1,
total:0,
selectObject:computed(()=>store.state.Workspace.probjects),//选择的项目
generateList:{
seriesDesign:[
{
label:'Design',
value:'design',
consumption:0,
},{
label:'To Product Image',
value:'toProductImage',
consumption:5,
},{
label:'Relight',
value:'relight',
consumption:5,
},{
label:'Transfer Pose',
value:'poseTransfer',
consumption:10,
},
],
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:'Task type',
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:'Quantity generated',
value:'nums',
},{
name:'Creation time',
value:'updateTime',
fun:(value:any)=>{
if(!value)return
return value.split('T')[0] + ' ' + value.split('T')[1].split('.')[0]
}
},{
name:'Start time',
value:'updateTime',
fun:(value:any)=>{
//没开始内容为 -
if(!value)return
return value.split('T')[0] + ' ' + value.split('T')[1].split('.')[0]
}
},{
name:'End time',
value:'updateTime',
fun:(value:any)=>{
if(!value)return
return value.split('T')[0] + ' ' + value.split('T')[1].split('.')[0]
}
},{
name:'Status',
value:'process',
fun:(value:any)=>{
if(value == '100.00%'){
return 'Completed'
}else{
return value
}
}
},{
name:'Operation',
value:'operation',
},
] as any,
contentList:[
] as any,
isGetContentList:false as any,
})
const dataDom = reactive({
createCloud,
})
const createClound = ()=>{
data.isGetContentList = false
dataDom.createCloud.init()
}
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,
}
Https.axiosPost(Https.httpUrls.getDesignCloudResult,value).then((rv)=>{
console.log(rv)
if(rv.design && rv.design.length > 0){
store.commit('addDesignCollectionList',rv.design)
emit('retrieve','design')
}else if(rv.toProductImage && rv.toProductImage.length > 0){
store.commit('setCloudList',{str:'toProduct',list:rv.toProductImage})
emit('retrieve','toProduct')
}else if(rv.relight && rv.relight.length > 0){
store.commit('setCloudList',{str:'relight',list:rv.relight})
emit('retrieve','relight')
}else if(rv.poseTransfer && rv.poseTransfer.length > 0){
store.commit('setCloudList',{str:'poseTransfer',list:rv.poseTransfer})
emit('retrieve','poseTransfer')
}
data.isGetContentList = false
})
}
}
const getContentList = ()=>{
if(data.isGetContentList){
let value = {
page:data.currentPage,
size:data.pageSize,
projectId: data.selectObject.id,
}
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
setTimeout(()=>{
getContentList()
},1500)
})
}
}
const submitGetContentList = ()=>{
data.isGetContentList = true
getContentList()
}
onBeforeUnmount(()=>{
data.isGetContentList = false
})
onMounted(()=>{
data.isGetContentList = true
getContentList()
})
return{
...toRefs(dataDom),
...toRefs(data),
createClound,
detailIamge,
getContentList,
submitGetContentList,
}
},
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{
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);
text-align: center;
}
}
.content{
flex: 1;
overflow: hidden;
> tr{
> td{
text-align: center;
width: calc(100% / 4);
line-height: 4.6rem;
font-size: 2.2rem;
}
}
}
}
}
</style>

View File

@@ -22,7 +22,8 @@
<selectList @selectImgItem="selectImgItem" :segmentationType="segmentationType" :isSegmentation="true" upLoadHttpsUrl="/api/element/imageSegmentation" level1Type="Sketchboard" :randomId="false" type="sketch" :catecoryList="sketchCatecoryList"></selectList>
</div>
<div class="canvas itemBox">
<canvasBox @setGenerateImg="setGenerateImg" ref="canvasBox"></canvasBox>
<!-- <canvasBox @setGenerateImg="setGenerateImg" ref="canvasBox"></canvasBox> -->
<canvasUpload :config="ceditorConfig" clothingImageUrl="https://www.minio-api.aida.com.hk/aida-sys-image/models/female/2e4815b9-1191-419d-94ed-5771239ca4a5.png?response-content-type=image%2Fpng&response-content-disposition=inline&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=admin%2F20250608%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20250608T161025Z&X-Amz-Expires=86400&X-Amz-SignedHeaders=host&X-Amz-Signature=a4374c0954d11c2490ef3b86a1924cf6d423ed8ac56023b3c3ccabcdf0672620"></canvasUpload>
</div>
<div class="finished itemBox">
<div class="btnTop">
@@ -49,9 +50,11 @@ import { useI18n } from 'vue-i18n'
import selectList from '@/component/DetailCopy/detailLeft/module/selectList.vue'
import sketchCategory from "@/component/HomePage/sketchCategory.vue";
import canvasBox from "./canvas/index.vue";
import canvasUpload from "@/component/Canvas/CanvasEditor/index.vue";
// import defaultModel from '@/assets/images/homePage/defaultModel.png'
export default defineComponent({
components:{
selectList,sketchCategory,canvasBox
selectList,sketchCategory,canvasBox,canvasUpload
},
props:{
},
@@ -64,6 +67,12 @@ export default defineComponent({
}),
segmentationType:'product',
generateImg:computed(()=>store.state.HomeStoreModule.deReconstruction) as any,
ceditorConfig:{
width: 800,
height: 600,
backgroundColor: "#f8f8f8",
},
defaultModel:'',
})
const setIsShowMark:any = inject('setIsShowMark')
const dataDom = reactive({
@@ -219,6 +228,7 @@ export default defineComponent({
}
&.canvas{
flex: 1;
position: relative;
}
&.finished{
width: 58rem;

View File

@@ -24,7 +24,6 @@
</a-select>
</div>
</div>
</div>
<div class="list" v-show="libraryOrModel == 'model'" v-if="maskShow">
<div v-for="item in modelList" class="modelItem" :class="{active:item.id == selectModel.id}" @click="setSelectModel(item)">
@@ -38,9 +37,7 @@
</div>
</div>
<div class="list printList" v-show="libraryOrModel == 'print'">
<div v-for="item in printList" class="modelItem" :class="{active:item.id == selectModel.id}" @click="setMaterial(item)">
<img :src="item.url || item.imgUrl" alt="">
</div>
<selectPrint ref="selectPrint" @setPrint="setPrint"></selectPrint>
</div>
</div>
<div class="model" v-show="selectModel.id != -1">
@@ -57,7 +54,7 @@
<img v-show="!isFront" :src="selectModel.threeDLayoutList?.[0]?.url" alt="">
<img v-show="isFront" :src="selectModel.threeDLayoutList?.[1]?.url" alt="">
</div>
<threeBox v-if="imgOrThree" ref="threeBox"></threeBox>
<threeBox v-if="imgOrThree" @saveProject="saveProject" ref="threeBox"></threeBox>
</div>
<div class="gallery_btn" v-show="!imgOrThree" @click="setImgOrThree(true)">3D view</div>
<div class="gallery_btn" v-show="imgOrThree" @click="setImgOrThree(false)">Img view</div>
@@ -81,17 +78,19 @@
</div>
</template>
<script lang="ts">
import { defineComponent,computed,ref,provide,nextTick,createVNode,toRefs, reactive, watch} from 'vue'
import { defineComponent,computed,ref,inject,nextTick,onMounted,toRefs, reactive, watch, 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 threeBox from "./three.vue"
import download from "./download.vue"
import {getMinioUrl} from '@/tool/util'
import scaleImage from "@/component/HomePage/scaleImage.vue";
import selectPrint from './selectPrint.vue'
export default defineComponent({
components:{
threeBox,download,scaleImage
threeBox,download,scaleImage,selectPrint
},
props:{
},
@@ -109,7 +108,6 @@ export default defineComponent({
modelList:[] as any,
sex:'Female',
sexList:computed(()=>store.state.UserHabit.sex.value),
printList:computed(()=>store.state.UploadFilesModule.allBoardData.printboardFiles),
isShowMark:false,
isNoData:false,
isShowLoading:false,
@@ -126,8 +124,11 @@ export default defineComponent({
data.isNoData = false
data.isShowMark = false
}
const setSelectModel = (item:any)=>{
const createProbject:any = inject('createProbject')
const setSelectModel = async (item:any)=>{
if(!data.selectObject.id)await createProbject()
data.isShowMark = true
if(!item.threeDSimpleId)return
const value = {
threeDSimpleId:item.threeDSimpleId,
}
@@ -140,9 +141,10 @@ export default defineComponent({
// dataDom.threeBox.openSetData()
// }
let stateData = {
threeDsimpleId:item.id
threeDSimpleId:item.id
}
store.commit('setPatternMaking3D',stateData)
saveProject()
}).catch((err:any)=>{
data.isShowMark = false
})
@@ -154,7 +156,7 @@ export default defineComponent({
})
const openSetData = ()=>{
nextTick(()=>{
let id = store.state.HomeStoreModule.patternMaking3D.threeDsimpleId
let id = store.state.HomeStoreModule.patternMaking3D.threeDSimpleId
if(id && data.selectModel.id == -1)setSelectModel({threeDSimpleId:id})
})
setTimeout(()=>{
@@ -203,14 +205,46 @@ export default defineComponent({
// if(str == 'print' && data.selectModel.id == -1)return
data.libraryOrModel = str
}
const setMaterial = (item:any)=>{
dataDom.threeBox.addMaterial(item)
}
const openScaleImage = ()=>{
let scaleImage:any = dataDom.scaleImage
scaleImage.isLike = false
scaleImage.init([{imgUrl:data.selectModel.threeDPatternLayoutUrl}],0)
}
const setPrint = async (item:any)=>{
if(dataDom.threeBox){
if(!data.selectObject.id)await createProbject()
dataDom.threeBox.addMaterial(item)
const stateData = {
printMinioUrl:getMinioUrl(item.imgUrl || item.url)
}
store.commit('setPatternMaking3D',stateData)
saveProject()
}
}
let saveTime = null as any
const saveProject = ()=>{
clearTimeout(saveTime)
saveTime = setTimeout(()=>{
let value:any = {
projectId:data.selectObject.id,
}
store.dispatch('setModularData',{type:'patternMaking3D'})
const str = 'patternMaking3D'
store.dispatch('getProjectData',str).then((data)=>{
if(!data[str])return
value[str] = data[str]
Https.axiosPost(Https.httpUrls.saveModuleContent, value).then((rv)=>{
if(rv.boundingBox)store.commit('setShowSketchboard',rv.boundingBox)
})
})
},2000)
}
onMounted(()=>{
openSetData()
})
return{
...toRefs(dataDom),
...toRefs(data),
@@ -221,8 +255,8 @@ export default defineComponent({
setImgOrThree,
openDown,
setLibraryOrModel,
setMaterial,
openScaleImage
openScaleImage,
setPrint,
}
},
directives:{
@@ -320,14 +354,7 @@ export default defineComponent({
flex-wrap: wrap;
overflow-y: auto;
align-content: flex-start;
&.printList{
> .modelItem{
aspect-ratio: 1 / 1;
>img{
padding: 0;
}
}
}
> .modelItem{
width: calc(100% / 4 - 1rem);
margin: .5rem;

View File

@@ -0,0 +1,700 @@
<template>
<div class="printboard_upload_modal">
<div class="printboard_left_upload">
<div class="left_upload_header">
<div class="upload_header_item">
<div class="switch_type_list">
<div
class="switch_type_item"
:class="[openClick == 1 ? 'select_swtich' : '']"
>
<span @click.stop="open(1)">{{ $t('PrintboardUpload.Upload') }}</span>
</div>
<div
class="switch_type_item"
:class="[openClick == 2 ? 'select_swtich' : '']"
>
<span @click.stop="open(2)">{{ $t('PrintboardUpload.Library') }}</span>
</div>
<div
class="switch_type_item Guide_1_2_1"
:class="[openClick == 3 ? 'select_swtich' : '']"
>
<span @click.stop="open(3)">{{ $t('PrintboardUpload.Generate') }}</span>
</div>
<div v-show="openClick == 3" class="generalMenu_printModel printMenu">
<div @click.stop="openPrintModel"><span>{{ scene.name }}<i class="icon iconfont icon-xiala" :class="{forbidden:openMenu}"></i></span> </div>
<ul v-show="openMenu">
<li
v-for="item,index in printCatecoryList"
class="printModel_item"
@click.stop="setSceneList(item)"
:title="item.value == 'Pattern'?$t('PrintboardUpload.PatternTitle'):
item.value == 'Logo'?$t('PrintboardUpload.LogoTitle'):
item.value == 'Slogan'?$t('PrintboardUpload.SloganTitle'):''"
>{{ item.name }}</li>
</ul>
</div>
</div>
</div>
</div>
<div v-show="openClick == 1" class="printboard_body">
<div class="upload_img_body">
<div class="upload_item">
<div :class="['upload_file_item']" v-for="(file, index) in fileList" :key="file">
<div class="upload_file_img_block">
<div class="upload_file_item_content" v-show="file?.status === 'uploading'">
<a-spin :indicator="indicator" tip="Uploading..."/>
</div>
<div class="upload_file_item_content" v-show="file?.status === 'done'" @click="setSetchboardGenerate(file.resData)">
<img v-lazy="file.imgUrl" class="upload_img" :key="file.imgUrl">
<sketchCategory :disignTypeList="printCatecoryList" :generateList="fileList" :isSetSketchCategory="true" :item="file" ></sketchCategory>
<div class="delete_like_file_block" @click.stop="deleteFile(file)">
<span
class="icon iconfont icon-shanchu"
></span>
</div>
</div>
</div>
<!-- <div class="pin_block" v-show="file?.status === 'done'">
<a-checkbox v-model:checked="file.pin">{{ $t('PrintboardUpload.PIN') }}</a-checkbox>
</div> -->
</div>
<div class="upload_file_item upload_component" v-show="printboardList.length < 16">
<a-upload
:action="uploadUrl + '/api/element/upload'"
:capture="null"
list-type="picture-card"
:before-upload="beforeUpload"
:data="{
...upload
}"
:headers="{Authorization:token}"
v-model:file-list="fileList"
:customRequest="function(){}"
:maxCount="16 - printboardList.length+fileList.length"
accept=".jpg,.png,.jpeg,.bmp"
@change="fileUploadChange"
>
<div
class="upload_tip_block"
v-show="printboardList.length < 16"
>
<i class="fi fi-br-upload"></i>
<!-- <img class="upload_img_icon" src="@/assets/images/homePage/add_file.png"> -->
</div>
</a-upload>
</div>
</div>
</div>
</div>
<Material v-show="openClick == 2"
ref="Material"
msg="Printboard"
@setLibrary = setSetchboardGenerate
@confirmSelect="confirmSelect"
:disignTypeList="printCatecoryList"
></Material>
<Generate v-show="openClick == 3" ref="Generate" @setLibrary = setSetchboardGenerate :scene="scene" :sketchCatecoryList="printCatecoryList" msg="Printboard"></Generate>
</div>
<!-- 取消请求 -->
<scaleImage ref="scaleImage"></scaleImage>
<Cropper ref="Cropper" @handleCropperSuccess="handleCropperSuccess" @closeCropper="deletUploadFile()" :cropperFileData="cropperFileData" :isUpload="isUpload"></Cropper>
</div>
</template>
<script lang="ts">
import { defineComponent,h,ref,computed,inject,createVNode,provide, nextTick } from 'vue'
import { LoadingOutlined } from '@ant-design/icons-vue';
import {getCookie} from '@/tool/cookie'
import {getUploadUrl} from '@/tool/util'
import {useStore} from 'vuex'
import { Https } from "@/tool/https";
import { Modal,message,Upload} from 'ant-design-vue';
import Cropper from '@/component/HomePage/Cropper.vue'
import Material from '@/component/HomePage/Material.vue'
import Generate from "@/component/HomePage/Generate.vue";
import GO from "@/tool/GO";
import { useI18n } from 'vue-i18n';
import { openGuide,driverObj__ } from "@/tool/guide";
import scaleImage from "@/component/HomePage/scaleImage.vue";
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import sketchCategory from "@/component/HomePage/sketchCategory.vue";
import axios from 'axios'
import generalMenu from "@/component/HomePage/generalMenu.vue";
import { overflow } from 'html2canvas/dist/types/css/property-descriptors/overflow';
export default defineComponent({
components:{
Cropper,
Material,
Generate,
scaleImage,
generalMenu,
sketchCategory,
},
emits: ['setPrint'],
setup(){
let store:any =useStore()
let fileList:any = ref([]),//选中的文件id数据
printImgList:any = ref([]), //print的印花图片
moodBoards:any = computed(()=>{return store.state.UploadFilesModule.moodboard})
let openClick: any = ref(1);
let {t} = useI18n()
let isTest = ref()
let userInfo:any = {}
let workspace:any = ref({})
let scene = ref({
name:'Pattern',
value:'Pattern'
})
let openMenu = ref(false)
let printCatecoryList:any = computed(()=>{
return store.state.UserHabit.printType
})
return {
fileList,
printImgList,
moodBoards,
openClick,
t,
isTest,
userInfo,
workspace,
scene,
openMenu,
printCatecoryList,
}
},
computed:{
},
watch:{
},
data(){
return {
swtich_type:'upload',
indicator : h(LoadingOutlined, {
style: {
fontSize: '2.4rem*1.2)',
},
spin: true,
}),
upload:{
isPin:0,
gender:'',
level1Type:'Printboard',
timeZone:Intl.DateTimeFormat().resolvedOptions().timeZone,
},
token:'',
uploadUrl:'',
store:useStore(),
cropperFileData:{name:'',uid:''}, //裁剪的原始文件数据
currentFileNum:0, //当前上传的文件数
isUpload:false,
printboardList:computed(()=>{
return useStore().state.UploadFilesModule.printboard
}),
isTextarea:false,
isInputFocus:false,
isUseGenerate:true
}
},
mounted(){
let userInfo:any = getCookie("userInfo")
this.userInfo = JSON.parse(userInfo);
this.token = getCookie('token') || ''
let isTest:any = getCookie('isTest')
this.isTest =JSON.parse(isTest)
this.uploadUrl = getUploadUrl()
this.workspace = computed(()=>{
return this.store?.state?.Workspace?.workspace
})
},
methods:{
setSetchboardGenerate(item:any){
this.$emit('setPrint',item)
},
open(num: Number) {
this.openClick = num;
let material:any = this.$refs.Material
if(num == 2){
material.init('Printboard')
}
if(num == 3){
this.scene = this.printCatecoryList[0]
}
},
fileUploadChange(data:any){
let file = data.file
// let res = JSON.parse(data?.xhr?.response);
file.id_ = GO.id++
file.type_ = {
type1:'upload',
type2:'Printboard'
};
file.pin = false;
// file.id = res.data.id?res.data.id:""
let Cropper:any = this.$refs.Cropper
if(this.currentFileNum === 1){
var reader = new FileReader();
reader.onload = (e:any) => {
let data_new;
if (typeof e.target.result === 'object') {
// 把Array Buffer转化为blob 如果是base64不需要
data_new = window.URL.createObjectURL(new Blob([e.target.result]));
} else {
data_new = e.target.result;
}
Cropper.getOptionImg(data_new)
};
// 转化为base64
// reader.readAsDataURL(file)
// 转化为blob
reader.readAsArrayBuffer(file.originFileObj);
this.cropperFileData = file
Cropper.changeShowModal(true)
}else{
this.customRequest(file)
}
},
beforeUpload(file:any,fileList:any){
const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png' || file.type === 'image/jpg' || file.type === 'image/bmp';
if (!isJpgOrPng) {
message.info(this.t('PrintboardUpload.jsContent1'));
}
const isLt2M = file.size / 1024 / 1024 < 5;
if (!isLt2M) {
message.info(this.t('PrintboardUpload.jsContent2'));
}
if(isJpgOrPng && isLt2M){
this.currentFileNum = fileList.length
}else{
return (isJpgOrPng && isLt2M) || Upload.LIST_IGNORE;
}
},
deleteFile(item:any){
// this.fileList.splice(item, 1)
// this.store.commit('setPrintboardFile',this.fileList)
if(item.type_.type1 == 'generate' || item.type_.type1 == 'material'){
item.jsContent1 = this.t('uploadFile.jsContent1',{maxImg:16})
this.store.commit("addGenerateMaterialFils", item);
}else{
this.fileList = this.store.state.UploadFilesModule.printboardFiles
let moodboard
this.store.state.UploadFilesModule.printboardFiles.forEach((items:any,index:Number)=>{
if(items.id_ == item.id_){
moodboard = index
}
})
this.fileList.splice(moodboard,1)
this.store.commit("setPrintboardFile", this.fileList);
}
},
likeFile(item:any,str:string){
if(str == 'like'){
let data = {
generateDetailId:item.id,
level1Type:"Printboard",
level2Type: item.categoryValue,
gender:this.workspace.sexEnum.value,
timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone
}
Https.axiosPost(Https.httpUrls.generateLike, data).then(
(rv) => {
item.like = true
}
).catch(res=>{
});
}else{
let data = {
generateDetailId:item.id,
timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone
}
Https.axiosGet(Https.httpUrls.generateDislike, {params:data}).then(
(rv) => {
item.like = false
}
).catch(res=>{
});
}
},
customRequest(data:any){
let new_data = {
...this.upload,
file:data.originFileObj
}
let fileUid = data.uid
Https.axiosPost('/api/element/upload', new_data,{headers:{'Content-Type': 'multipart/form-data'}}).then(
(rv: any) => {
if (rv) {
for(let file of this.fileList){
if(fileUid === file.uid){
file.status = 'done'
file.imgUrl = rv.url
file.pin = false
file.id = rv.id
file.category = this.printCatecoryList[0].name
file.categoryValue = this.printCatecoryList[0].value
file.resData = rv
}
}
let fileList = this.fileList.filter((v:any)=> v.status === 'done')
this.store.commit('setPrintboardFile',fileList)
}
}
).catch((res)=>{
let index = -1
this.fileList.forEach((ele:any,index1:any) => {
if(fileUid === ele.uid){
index = index1
}
});
if(index > -1){
this.fileList.splice(index, 1)
}
});
},
closeCropper(type:any){
if(this.isUpload){
return
}
if(type == 'error'){
let index = -1
this.fileList.forEach((ele:any,index1:any) => {
if(this.cropperFileData.uid === ele.uid){
index = index1
}
});
if(index > -1){
this.fileList.splice(index, 1)
}
}
let Cropper:any = this.$refs.Cropper
Cropper.closeCropper()
},
deletUploadFile(){
let index = -1
this.fileList.forEach((ele:any,index1:any) => {
if(this.cropperFileData.uid === ele.uid){
index = index1
}
});
if(index > -1){
this.fileList.splice(index, 1)
}
},
handleCropperSuccess(event:any){
let {file, fileData} =event
let new_data = {
...this.upload,
file:file
}
if(this.isUpload){
return
}
this.isUpload = true
const hide = message.loading('loading', 0);
Https.axiosPost('/api/element/upload', new_data,{headers:{'Content-Type': 'multipart/form-data'}}).then(
(rv: any) => {
for(let file of this.fileList){
if(fileData.uid === file.uid){
file.status = 'done'
file.imgUrl = rv.url
file.id = rv.id
file.resData = rv
file.category = this.printCatecoryList[0].name
file.categoryValue = this.printCatecoryList[0].value
}
}
let fileList = this.fileList.filter((v:any)=> v.status === 'done')
this.isUpload = false
this.closeCropper('success')
this.cropperFileData = {name:'',uid:''}
// this.store.commit('setPrintboardFile',fileList)
hide()
}
).catch(res=>{
let index = -1
this.fileList.forEach((ele:any,index1:any) => {
if(fileData.uid === ele.uid){
index = index1
}
});
if(index > -1){
this.fileList.splice(index, 1)
}
this.cropperFileData = {name:'',uid:''}
this.isUpload = false
this.closeCropper('error')
hide()
});
},
recollection(){
let arr = JSON.parse(JSON.stringify(this.store.state.UploadFilesModule.allBoardData.printboardFiles))
let setboard = {
generate:[] as any,
material:[] as any,
moodboard:[] as any,
}
arr.forEach((v:any)=>{
v.pin = v.pin == 1?true:false
this.printCatecoryList.forEach((item:any) => {
if(v.level2Type == item.value){
v.category=item.name
v.categoryValue=item.value
}
});
if(v.type_.type1 == 'generate'){
setboard.generate.push(v)
}else if(v.type_.type1 == 'material'){
setboard.material.push(v)
}else{
setboard.moodboard.push(v)
}
})
this.store.commit("setPrintboardGenerateFiles", setboard.generate);
this.store.commit("setPrintboardMaterialFiles", setboard.material);
this.store.commit("setPrintboardFile", setboard.moodboard);
this.fileList = setboard.moodboard
// this.printImgList = JSON.parse(JSON.stringify(this.store.state.UploadFilesModule.allBoardData.generatePrintFiles))
this.store.commit('setPrintboardFile',this.fileList)
// this.store.commit('setGeneratePrintFile',this.printImgList)
},
confirmSelect(event:any){
for(let item of event){
let data = {
imgUrl:item.url,
resData:item,
pin:false,
id:item.id,
status:'done',
}
if(this.fileList.length == 15){
message.warning(this.t('PrintboardUpload.jsContent3'))
break
}
this.fileList.push(data)
}
this.store.commit('setPrintboardFile',this.fileList)
},
scaleImage(index:any){
let scaleImage:any = this.$refs.scaleImage
scaleImage.isLike = false
scaleImage.init(this.printboardList,index)
},
setSceneList(data:any){
if(this.scene.value === data.value) return
this.scene = data
let generate:any = this.$refs.Generate
generate.sketchboardList = []
generate.searchPictureName = ''
this.openMenu = false
},
openPrintModel(){
if(this.openMenu)return
document.addEventListener('click',this.removePrintModel)
this.openMenu = true
},
removePrintModel(){
this.openMenu = false
document.removeEventListener('click',this.removePrintModel)
}
}
})
</script>
<style lang="less" scoped>
.printboard_upload_modal{
// padding: calc(1rem*1.2) calc(1rem*1.2) calc(1.8rem*1.2) calc(1rem*1.2);
height: 100%;
display: flex;
.printboard_left_upload{
display: flex;
flex-direction: column;
width: 100%;
.switch_type_list {
display: flex;
align-items: center;
position: relative;
z-index: 11;
.switch_type_item {
display: flex;
align-items: center;
// padding: 0 2rem*1.2);
height: calc(4rem*1.2);
border-radius: calc(0.8rem*1.2);
line-height: calc(4rem*1.2);
font-size: var(--aida-fsize1-8);
// margin-right: 2.2rem*1.2);
margin-right: calc(8rem*1.2);
color: #000;
cursor: pointer;
position: relative;
text-align: center;
transform-origin: left;
transform: scale(1);
transition: 0.3s all;
&.switch_type_item::before {
position: absolute;
content: "";
display: block;
background: #000;
height: calc(.3rem*1.2);
left: 50%;
transform: translateX(-50%);
bottom: calc(.6rem*1.2);
width: 0px;
transition: 0.3s all;
}
&.select_swtich {
color: #000;
// font-weight: 900;
transform: scale(1.15);
}
&.select_swtich::before {
width: 100%;
}
.switch_icon {
font-size: calc(1.8rem*1.2);
margin-right: calc(0.8rem*1.2);
}
}
.printMenu{
margin-right: 0;
margin-top: auto;
position: relative;
margin-left: 2rem;
>div{
width: 14rem;
font-size: var(--aida-fsize1-6);
border: 0;
i{
transition: all .3s;
display: inline-block;
margin-left: 1rem;
}
.forbidden{
transform: rotate(180deg);
}
}
ul{
width: 14rem;
}
}
.switch_type_item:nth-child(3){
margin: 0;
}
}
.printboard_body{
display: flex;
flex-direction: column;
// height: calc(100% - 5rem*1.2));
flex: 1;
padding-top: calc(2.5rem*1.2);
height: calc(30rem*1.2);
overflow-x: hidden;
&.printboard_body::-webkit-scrollbar {
display: none;
}
.upload_img_body{
height: calc(100% - 3rem*1.2);
overflow-y: auto;
margin-bottom: calc(1rem*1.2);
&.upload_img_body::-webkit-scrollbar {
display: none;
}
}
.upload_file_item{
margin: 0 calc(2rem*1.2) calc(2rem*1.2) 0;
// margin: 0 2rem*1.2) 2rem*1.2) 0;
display: inline-block;
width: 10rem;
height: 10rem;
border: 1px solid #f5f5f5;
vertical-align: top;
position: relative;
text-align: center;
img{
width: auto;
object-fit: cover;
height: 100%;
max-width: 100%;
}
.upload_file_img_block{
height: 100%;
}
&.upload_component{
}
.checked{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
cursor: pointer;
display: none;
justify-content: center;
align-items: center;
}
&.modal_img_item:hover .checked{
display: flex;
}
.upload_file_item_content{
display: flex;
align-items: center;
justify-content: center;
height: 100%;
position: relative;
cursor: pointer;
.upload_img{
display: block;
max-height: 100%;
width: auto;
max-width: 100%;
object-fit: cover;
}
&:hover .delete_like_file_block{
display: block;
}
}
}
}
}
}
</style>

View File

@@ -63,7 +63,7 @@ export default defineComponent({
},
props:{
},
emits:[],
emits:['saveProject'],
setup(props,{emit}) {
const store = useStore();
const data = reactive({
@@ -265,7 +265,7 @@ export default defineComponent({
texture.anisotropy = 32; // 提高纹理清晰度
data.group?.traverse((child:any) => {
if (child.isMesh) {
console.log(child.name)
// console.log(child.name)
// 5. 创建新材质(根据需求选择材质类型)
const textureWidth = texture.image.width;
const textureHeight = texture.image.height;
@@ -420,7 +420,7 @@ export default defineComponent({
const modeUrl = await getModelUrl(value)
await setModel(modeUrl)
let patternMaking3D = store.state.HomeStoreModule.patternMaking3D
if(patternMaking3D.printMinioUrl)await addMaterial({url:patternMaking3D.printMinioUrl})
if(patternMaking3D.url)await addMaterial({url:patternMaking3D.url})
data.load.state = false
}
const changeRepeat = (e:any)=>{
@@ -437,6 +437,7 @@ export default defineComponent({
y:data.repeat.y,
}
store.commit('setPatternMaking3D',value)
emit('saveProject')
},1000)
}
const setLock = ()=>{

View File

@@ -64,8 +64,15 @@
</div>
</div>
<div class="generate input_border">
<div class="generage_btn started_btn" v-show="!isGenerate" @click="getgenerate">
<!-- <div class="generage_btn started_btn" v-show="!isGenerate" @click="getgenerate">
{{ $t('Generate.Generate') }}
</div> -->
<div class="generage_btn started_btn" v-show="!isGenerate">
<i class="fi fi-bs-magic-wand" style="background-color: #000; font-size: 2.3rem; flex: 1;margin: 0;" @click="getgenerate()"></i>
<div class="icon iconfont icon-xiala" :class="{active:speedState}" @click.stop="openSpeed"></div>
<div class="content" v-show="speedState">
<div v-for="item in speedList" :key="item.value" :class="{active:item.value == speedData.value}" @click="setSpeed(item)" :title="item.title">{{ item.label }}</div>
</div>
</div>
<div v-show="isGenerate && !remGenerate" class="generage_btn started_btn">
<i class="fi fi-br-loading"></i>
@@ -134,11 +141,11 @@ export default defineComponent({
selectImg:{},
token:getCookie('token'),
upload:{
projectId:store.state.Workspace.probjects.id
projectId:computed(()=>store.state.Workspace.probjects.id)
},
waitList:[],
likeList:computed(()=>store.state.HomeStoreModule.poseTransfer),
noLikeList:[ { "id": 128, "taskId": "df9cd154-6cf9-488a-8e64-426ef4a27e13-83", "productImage": null, "gifUrl": "https://www.minio-api.aida.com.hk/aida-users/83/pose_transform_gif/df9cd154-6cf9-488a-8e64-426ef4a27e13-83.gif?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=admin%2F20250530%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20250530T015548Z&X-Amz-Expires=86400&X-Amz-SignedHeaders=host&X-Amz-Signature=2a43ad4a389e8366207b6500506c17140e0387924a2adcb35188f2e59777e422", "videoUrl": "None", "firstFrameUrl": "https://www.minio-api.aida.com.hk/aida-users/83/pose_transform_first_img/df9cd154-6cf9-488a-8e64-426ef4a27e13-83.png?response-content-type=image%2Fpng&response-content-disposition=inline&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=admin%2F20250530%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20250530T015548Z&X-Amz-Expires=86400&X-Amz-SignedHeaders=host&X-Amz-Signature=e202d13874f0a28105602a268c802d4c99d2fbecd06a9460cc07e7c7ecbd0559", "isLiked": 0, "status": "Success", "collectionType": null, "url": "https://www.minio-api.aida.com.hk/aida-users/83/pose_transform_first_img/df9cd154-6cf9-488a-8e64-426ef4a27e13-83.png?response-content-type=image%2Fpng&response-content-disposition=inline&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=admin%2F20250530%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20250530T015548Z&X-Amz-Expires=86400&X-Amz-SignedHeaders=host&X-Amz-Signature=e202d13874f0a28105602a268c802d4c99d2fbecd06a9460cc07e7c7ecbd0559" } ],
noLikeList:[ ],
isGenerate:false,//判断是否正在进行generate
remGenerate:false,
removeGenerate:false,
@@ -146,6 +153,25 @@ export default defineComponent({
poseList:[],
selectPose:null as any,
})
let speed = reactive({
speedList:[
{
title:'Generate high-quality content',
label:'High',
value:'',
},{
title:'Generate using Wanxiang',
label:'WX',
value:'wx',
},
],
speedState:false,
speedData:{
title:'Generate high-quality content',
label:'High',
value:'',
},
})
const setIsShowMark:any = inject('setIsShowMark')
const createProbject:any = inject('createProbject')
const dataDom = reactive({
@@ -215,8 +241,9 @@ export default defineComponent({
poseId:data.selectPose,
projectId:store.state.Workspace.probjects.id,
productImage:data.selectImg.minioUrl,
modelName:speed.speedData.value,
}
Https.axiosGet(Https.httpUrls.poseTransform,{params:value}).then((rv)=>{
Https.axiosPost(Https.httpUrls.poseTransform,value).then((rv)=>{
data.noLikeList.unshift({taskId:rv})
setGenerate(rv)
}).catch((res:any)=>{
@@ -233,7 +260,7 @@ export default defineComponent({
if(!data.isGenerate || !data.remGenerate)return
if(!state)return
state = false
Https.axiosGet(Https.httpUrls.poseTransformResult,{params:{taskId:list}}).then(
Https.axiosPost(Https.httpUrls.poseTransformResult,{taskId:list}).then(
(rv) => {
rv=[rv]
state = true
@@ -273,7 +300,7 @@ export default defineComponent({
data.isGenerate = false
data.remGenerate = false
});
},1000)
},20000)
}
const removeGenerate = ()=>{
//取消操作
@@ -377,11 +404,13 @@ export default defineComponent({
value = {
likeOrDislike:'like',
transformedId:item.id,
projectId:store.state.Workspace.probjects.id,
}
}else{
value = {
likeOrDislike:'dislike',
transformedId:item.id,
projectId:store.state.Workspace.probjects.id,
}
}
Https.axiosPost(Https.httpUrls.poselikeOrDisike, {},{params:value}).then(
@@ -416,7 +445,19 @@ export default defineComponent({
onMounted(()=>{
// showViewVideo({url:'https://www.minio.aida.com.hk:12025/api/v1/download-shared-object/aHR0cHM6Ly93d3cubWluaW8uYWlkYS5jb20uaGs6MTIwMjQvYWlkYS11c2Vycy84OS9wb3NlX3RyYW5zZm9ybV92aWRlby8xMjMtODkubXA0P1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9N0tOVDdNWlNLWkRXM1RVOEJZVlklMkYyMDI1MDQwOCUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNTA0MDhUMDUxOTM1WiZYLUFtei1FeHBpcmVzPTQzMTk5JlgtQW16LVNlY3VyaXR5LVRva2VuPWV5SmhiR2NpT2lKSVV6VXhNaUlzSW5SNWNDSTZJa3BYVkNKOS5leUpoWTJObGMzTkxaWGtpT2lJM1MwNVVOMDFhVTB0YVJGY3pWRlU0UWxsV1dTSXNJbVY0Y0NJNk1UYzBOREV4T0RneE9Td2ljR0Z5Wlc1MElqb2lZV1J0YVc0aWZRLmY0Z3RoTU1BeC1GUnM3eGhWNFdjTUFCUW5lU19BVkIxUDlYbnJQbEFNWUFsVnJwY3RpYXgtU2cyY2FkZHZ0a0VCOU1NbWxGeUlIbU90aGhUWDlqN2lnJlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCZ2ZXJzaW9uSWQ9bnVsbCZYLUFtei1TaWduYXR1cmU9Yjg5YmQ4ZDg5M2I4ZjBjYmYxZDI3NDFjZmY0NGRiZGNmYWM2NmU0ZGM2OGIwYzQzZDA2OGI4YjYzZjE5YjhhOA'})
})
const openSpeed = ()=>{
speed.speedState = !speed.speedState
if(speed.speedState){
document.addEventListener('click',openSpeed)
}else{
document.removeEventListener('click',openSpeed)
}
}
const setSpeed = (item:any)=>{
speed.speedData = item
}
return{
...toRefs(speed),
...toRefs(dataDom),
...toRefs(data),
openSetData,
@@ -433,6 +474,8 @@ export default defineComponent({
likeSetBtn,
noLikeSetBtn,
selectPose,
openSpeed,
setSpeed,
}
},
directives:{
@@ -478,6 +521,44 @@ export default defineComponent({
> .started_btn{
font-weight: 300;
}
.generage_btn{
width: 10rem;
position: relative;
}
.icon-xiala{
margin-left: 1rem;
transition: all .3s;
cursor: pointer;
&.active{
transform: rotate(180deg);
}
}
.content{
position: absolute;
top: 100%;
width: 100%;
left: 0rem;
text-align: center;
border-radius: calc(1rem* 1.2);
overflow: hidden;
z-index: 3;
margin-top: .2rem;
>div{
background: #cccccc;
line-height: 2;
font-size: 1.8rem;
cursor: pointer;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
&.active{
background-color: #616161;
}
}
>div:hover{
background: #999999;
}
}
}
}
> .configuratioBox > .configuratio{