fix
This commit is contained in:
X1627315083
223
src/component/HomePage/index/workflow/content/sketchDesign.vue
Normal file
223
src/component/HomePage/index/workflow/content/sketchDesign.vue
Normal file
@@ -0,0 +1,223 @@
|
||||
<template>
|
||||
<div class="seriesDesign">
|
||||
<workspace ref="workspace" :workflowType="workflowType" :httpWorkflowType="httpWorkflowType" class="workspace" :isState="selectKey_ =='workspace'" v-show="selectKey_ == 'workspace'"></workspace>
|
||||
<SketchboardUpload ref="sketchBoard" class="sketchBoard" :isState="selectKey_ =='sketchBoard'" v-show="selectKey_ == 'sketchBoard'"></SketchboardUpload>
|
||||
<deReconstruction ref="deReconstruction" class="deReconstruction" :isState="selectKey_ =='deReconstruction'" v-show="selectKey_ == 'deReconstruction'"></deReconstruction>
|
||||
<canvasUpload ref="canvas" class="canvas" :isState="selectKey_ =='canvas'" v-show="selectKey_ == 'canvas'"></canvasUpload>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent,computed,ref,watch,nextTick,provide,toRefs, reactive, onMounted} from 'vue'
|
||||
// import setDesignItem from '@/component/Detail/setDesignItem2.vue'
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import workspace from '../../workflow/workspace.vue'
|
||||
import { Https } from "@/tool/https";
|
||||
import { useStore } from "vuex";
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import SketchboardUpload from '../../model/collection/SketchboardUpload.vue'
|
||||
import deReconstruction from '../../model/deReconstruction/index.vue'
|
||||
import canvasUpload from "@/component/Canvas/index.vue";
|
||||
|
||||
import { gsap, TweenMax } from "gsap";
|
||||
import { ScrollTrigger } from "gsap/ScrollTrigger";
|
||||
export default defineComponent({
|
||||
components:{
|
||||
workspace,SketchboardUpload,deReconstruction,canvasUpload
|
||||
},
|
||||
props:{
|
||||
selectKey_:{
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
workflowType:String,
|
||||
httpWorkflowType:String,
|
||||
},
|
||||
setup(props,{emit}) {
|
||||
const store = useStore();
|
||||
let driver__:any = computed(()=>{
|
||||
return store.state.Guide.guide
|
||||
})
|
||||
provide('driver__',driver__)
|
||||
//['moodBoard','printBoard','colorBoard','sketchBoard','mannequin','toProduct]
|
||||
const data = reactive({
|
||||
selectObject:computed(()=>store.state.Workspace.probjects),//选择的项目
|
||||
})
|
||||
const dataDom:any = reactive({
|
||||
sketchBoard:null as any,
|
||||
deReconstruction:null as any,
|
||||
canvas:null as any,
|
||||
})
|
||||
const open = (str:any)=>{
|
||||
nextTick(()=>{
|
||||
if(dataDom[str]?.openSetData){
|
||||
dataDom[str].openSetData(str)
|
||||
}
|
||||
})
|
||||
}
|
||||
const setitemData = (arr:any)=>{
|
||||
return new Promise((resolve,reject)=>{
|
||||
nextTick(()=>{
|
||||
arr.forEach((rv:any)=>{
|
||||
if(rv == 'design' || rv == 'deReconstruction' || rv == 'canvas' || !dataDom[rv])return
|
||||
dataDom[rv].openSetData()
|
||||
})
|
||||
resolve('')
|
||||
})
|
||||
})
|
||||
}
|
||||
const unfold = ()=>{
|
||||
if(dataDom?.[props.selectKey_]?.setItemPosition)dataDom[props.selectKey_].setItemPosition()
|
||||
}
|
||||
const getCollection = ()=>{
|
||||
let value:any = {
|
||||
"id":data.selectObject.id,
|
||||
"moduleList":["sketchBoard",'deReconstruction']
|
||||
}
|
||||
Https.axiosPost(Https.httpUrls.getModuleContent,value).then(async (rv)=>{
|
||||
historyChooseData(rv)
|
||||
let allBoardData = ['sketchBoard','deReconstruction']
|
||||
let canvasData = ['deReconstruction','canvas']
|
||||
for (let index = 0; index < canvasData.length; index++) {
|
||||
const item = canvasData[index];
|
||||
await getCanvasData(item)
|
||||
}
|
||||
await setitemData(allBoardData)
|
||||
//还有一个canvas
|
||||
if(rv.boundingBox)store.commit('setShowSketchboard',rv.boundingBox)
|
||||
allBoardData.forEach((item)=>{
|
||||
let value = {
|
||||
type:item,
|
||||
objectName:data.selectObject.type,
|
||||
}
|
||||
let arr = ['sketchBoard','moodBoard','printBoard','colorBoard']
|
||||
if(arr.indexOf(item) != -1){
|
||||
store.dispatch('setAllBoardData',value)
|
||||
}else{
|
||||
store.dispatch('setModularData',value)
|
||||
}
|
||||
})
|
||||
|
||||
})
|
||||
}
|
||||
const getCanvasData = (str:any)=>{
|
||||
return new Promise((resolve, reject) => {
|
||||
let value = {
|
||||
module:str,
|
||||
projectId:data.selectObject.id,
|
||||
}
|
||||
Https.axiosPost(Https.httpUrls.exportSearch, value)
|
||||
.then((rv) => {
|
||||
store.commit("setCanvasData", {type:str,file:rv});
|
||||
resolve('')
|
||||
})
|
||||
.catch((rv) => {
|
||||
resolve(null)
|
||||
});
|
||||
})
|
||||
}
|
||||
const historyChooseData = (data:any)=>{
|
||||
let collectionData = {
|
||||
sketchboardFiles: dealViewChooseData(
|
||||
data.sketchBoard,"Sketchboard"
|
||||
),
|
||||
};
|
||||
store.commit("setAllBoardDataChoose", collectionData);
|
||||
if(data.deReconstruction){
|
||||
data.deReconstruction.url = data.deReconstruction.collageSketchUrl
|
||||
data.deReconstruction.isLike = data.deReconstruction.liked
|
||||
let value = {
|
||||
list: [data.deReconstruction],
|
||||
str:'add',
|
||||
index:-1,
|
||||
}
|
||||
store.commit("setDeReconstruction", value);
|
||||
}
|
||||
}
|
||||
//统一处理选择组的渲染数据
|
||||
const dealViewChooseData = (data: any,str:string)=> {
|
||||
if (!data) {
|
||||
return [];
|
||||
}
|
||||
let filesList = data.map((v: any) => {
|
||||
let newData: any = {
|
||||
imgUrl: v.url?v.url:v.designOutfitUrl,
|
||||
id: v.id,
|
||||
status: "done",
|
||||
resData: v,
|
||||
type_:{
|
||||
type1:'material',
|
||||
type2:v.level1Type
|
||||
}
|
||||
};
|
||||
if (v.level1Type === "Sketchboard") {
|
||||
newData.pin = v.isPin;
|
||||
newData.categoryValue = v.level2Type;
|
||||
newData.level2Type = v.level2Type;
|
||||
}
|
||||
return newData;
|
||||
});
|
||||
return filesList;
|
||||
}
|
||||
|
||||
onMounted(()=>{
|
||||
nextTick(()=>{
|
||||
getCollection()
|
||||
})
|
||||
})
|
||||
return{
|
||||
...toRefs(dataDom),
|
||||
...toRefs(data),
|
||||
open,
|
||||
unfold,
|
||||
}
|
||||
},
|
||||
|
||||
provide() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
|
||||
})
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.seriesDesign{
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
> .contentBox{
|
||||
position: relative;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
> .content,
|
||||
>.homeContent{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 4rem;
|
||||
// padding: 3rem;
|
||||
}
|
||||
> .content{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
transform: scale(0);
|
||||
background: #ff6666;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
> *{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
> .back{
|
||||
width: auto;
|
||||
height: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
> .homeContent{
|
||||
// background: #91ff66;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user