Files
aida_front/src/component/HomePage/index/index.vue
2025-04-23 17:30:42 +08:00

341 lines
9.8 KiB
Vue

<template>
<div class="start">
<div class="createProject" v-if="!selectObject?.type">
<div v-if="state == 1" class="createProjectBtn">
<div @click="createProject" class="gallery_btn gallery_btn_radius">New Project</div>
<div @click="getHistoryProject" class="gallery_btn white gallery_btn_radius">Resume Project</div>
</div>
<div v-else-if="state == 2" class="selectProjectBtn">
<div style="width: 100%; margin: 2rem; display:flex;align-items: center;">
<i @click="()=>state = 1" style="font-size:3rem; display:flex; cursor: pointer;margin-right:2rem" class="fi fi-rr-arrow-small-left"></i>Please choose your workflow</div>
<div class="porjectBox">
<div class="selectProjectBtn_title" v-for="item in opjectList" :key="item.value" @click="selectProject(item)">{{item.title}}</div>
</div>
</div>
</div>
<workflow v-if="selectObject?.type" ref="workflow" @goHome="()=>state = 1" :workflowType="selectObject.type" :httpWorkflowType="selectObject.httpType" :workflowTitle="opjectList.filter((item)=>item.value == selectObject.type)[0].title"></workflow>
<div class="mark_loading" v-show="isShowMark">
<a-spin size="large" />
</div>
<affiche ref="affiche"></affiche>
<div class="userSystem" v-if="userDetail.systemList.indexOf(1) == -1">
You can use these features only after becoming a regular user~
</div>
</div>
</template>
<script lang="ts">
import { defineComponent,computed,onMounted,nextTick,onBeforeUnmount,toRefs, reactive,watch} from 'vue'
// import setDesignItem from '@/component/Detail/setDesignItem2.vue'
import { useStore } from "vuex";
import {useRoute} from 'vue-router'
import { useI18n } from 'vue-i18n'
import workflow from './workflow/index.vue'
// import workspace from './model/workspace.vue'
import { Https } from "@/tool/https";
import router from '@/router';
import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
import {projectList} from '@/tool/listData'
import affiche from "@/component/HomePage/affiche.vue";
export default defineComponent({
components:{
workflow,affiche
},
setup(props,{emit}) {
const store = useStore();
const route = useRoute()
const {t} = useI18n()
const data = reactive({
state:1,//状态 1:创建项目 2:选择项目
selectObject:computed(()=>store.state.Workspace.probjects) as any,//选择的项目
userDetail:computed(()=>{
return store.state.UserHabit.userDetail
}),
opjectList:[
{
title:'Series Design',
value:'seriesDesign',
httpValue:'SERIES_DESIGN',
},{
title:'Single Product Design',
value:'singleProductDesign',
httpValue:'SINGLE_DESIGN',
},{
title:'Sketch Design',
value:'sketchDesign',
httpValue:'SKETCH_COLLAGE_PROCESS',
},{
title:'Print Design',
value:'printDesign',
httpValue:'PRINT_DESIGN',
},{
title:'Product Design',
value:'productDrawingDesign',
httpValue:'FINISHED_PRODUCT',
},{
title:'3D Pattern Making',
value:'printingDesign3D',
httpValue:'THREE_D_PLATE_MAKING',
},
],//项目列表
isShowMark:false,
})
const dataDom = reactive({
affiche:null as any,
workflow:null as any
})
const createProject =()=>{
data.state = 2
createData()
}
const createData = ()=>{
store.commit("clearAllData");
store.commit("clearAllCollection");
store.commit("setAllBoardDataChoose",{});
store.commit("clearShowSketchboard",{});
store.commit("clearAllCollection");
}
const selectProject =(item:any)=>{
let data = {
type:item.value,
httpType:item.httpValue,//项目类型
}
store.commit('setProbject',data)
let list:any = projectList
store.commit('setProjectList',list[item.value])
}
const getHistoryProject = ()=>{
router.push('/home/history')
}
const getHistory = ()=>{
let value = {
id:Number(route.params.id),
}
if(!route.params.id)return
createData()
Https.axiosPost(Https.httpUrls.selectHistoryProject,value).then((rv: any) => {
setProjectData(rv)
})
}
// watch(()=>data.opjectList.type,(newVal,oldVal)=>{
// console.log(newVal,oldVal);
// })
const getWorks = ()=>{
let data:any = {
"accountId": 0,
"collectionId": 0,
"coverId": 0,
"createDate": "",
id:Number(route.params.id),
"isDeleted": 0,
"portfolioDes": "",
"portfolioName": "",
"portfolioType": "",
"status": 0,
"updateDate": "",
"userLikeGroupId":''
}
Https.axiosPost(Https.httpUrls.setPorfolioChoose, data).then(
(rv: any) => {
setProjectData(rv)
// this.setPortfolio(rv.portfolioDTO)
// this.store.commit("setUserGroupId", rv.userGroupId);
// this.dealHistoryChooseData(rv, type);
}
).catch((res)=>{
});
}
const setProjectData = (rv:any)=>{
let type:any = data.opjectList.find(obj => obj.httpValue === rv.process);
//取出数组对象某个值
let storeData = {
name:rv.name,
id:rv.id,
type:type?.value,
httpType:rv.process,//项目类型
ageGroup:rv.workspaceVO.ageGroup,
style:rv.workspaceVO.style,
styleId:rv.workspaceVO.styleId,
styleName:rv.workspaceVO.styleName,
sex:rv.workspaceVO.sex,
systemDesignerPercentage:rv.workspaceVO.systemDesignerPercentage,
position:{
label:rv.workspaceVO.positionEnum.value,
value:rv.workspaceVO.positionEnum.name
},
positionList:[],
publishData:{
id:rv.portfolioDTO.id?rv.portfolioDTO.id:'',
portfolioDes:rv.portfolioDTO.portfolioDes?rv.portfolioDTO.portfolioDes:'',
portfolioName:rv.portfolioDTO.portfolioName?rv.portfolioDTO.portfolioName:'',
tagsDTO:rv.portfolioDTO.tagsDTO?rv.portfolioDTO.tagsDTO:[],
},
model:{}
}
let model:any = {}
let position = []
if(data.selectObject.sex == "Female"){
// if(rv.workspaceVO.sex == "Female"){
model = {
id:rv.workspaceVO.mannequinFemaleId,
type:rv.workspaceVO.mannequinFemaleType,
url:rv.workspaceVO.femalePresignedUrl,
}
position = store.state.UserHabit.FemalePosition
}else{
model = {
id:rv.workspaceVO.mannequinMaleId,
type:rv.workspaceVO.mannequinMaleType,
url:rv.workspaceVO.malePresignedUrl,
}
position = store.state.UserHabit.MalePosition
}
storeData.model = model
data.selectObject.positionList = position
storeData.positionList = position
store.commit('setProbject',storeData)
let list:any = projectList
store.commit('setProjectList',list[type.value])
nextTick(()=>{
dataDom.workflow.isUpdataPorject = true
})
}
onMounted(async ()=>{
let test:any = getCookie('isTest')
let isTest =JSON.parse(test)
//判断账号剩余时间是否太短
let isModalOne = JSON.parse(sessionStorage.getItem("isTimeOne") as any)
// if(!data.userDetail.isBeginner || data.userDetail.systemUser == 0)return
if(!isModalOne){//判断是否是试用用户
// if(!isTest && !isModalOne){//判断是否是试用用户
await new Promise(async (resolve) => {
if(isTest){
// openGuide()
resolve('')
}else{
await Https.axiosPost(Https.httpUrls.getExpiredTime,{}).then((rv: any) => {
if (rv) {
let dateNow = Date.now()
let date:any = new Date(dateNow)
let rvDate:any = new Date(rv);
let diffInMilliseconds = Math.abs(date - rvDate); // 获取时间差的毫秒数
let days = Math.floor(diffInMilliseconds / (24 * 60 * 60 * 1000)); // 计算天数
let hours = Math.floor((diffInMilliseconds % (24 * 60 * 60 * 1000)) / (60 * 60 * 1000)); // 计算小时数
let minutes = Math.floor((diffInMilliseconds % (60 * 60 * 1000)) / (60 * 1000)); // 计算分钟数
if(days < 5){
setTimeout(() => {
let text = {
str:`${t('HomeView.jsContent4',{days:days,hours:hours})}<a href="https://code-create.com.hk/aida" target="_blank">${t('HomeView.jsContent8')}</a>`,
title:`${t('HomeView.jsContent7')}`,
}
dataDom.affiche.init(text)
}, 500);
}else{
// openGuide()
}
resolve('')
}else{
// openGuide()
resolve('')
}
})
}
})
}else if(!isModalOne && isTest){
}else{
// openGuide()
}
if(route.params.type == 'Works'){
getWorks()
}else{
getHistory()
}
})
onBeforeUnmount(()=>{
// data.selectObject = null
// store.commit('createProbject')
})
return{
...toRefs(dataDom),
...toRefs(data),
createProject,
selectProject,
getHistoryProject,
}
},
provide() {
return {
}
},
})
</script>
<style lang="less" scoped>
.start{
width: 100%;
height: 100%;
overflow: hidden;
position: relative;
.userSystem{
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.4);
z-index:2;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
font-weight: 600;
font-size: 4rem;
}
> .createProject{
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
> .createProjectBtn,> .selectProjectBtn{
display: flex;
}
> .createProjectBtn{
> div{
margin: 1rem;
width: 19rem;
}
}
> .selectProjectBtn{
flex-direction: column;
> .porjectBox{
display: flex;
> .selectProjectBtn_title{
padding: 2rem;
width: 21rem;
height: 26rem;
display: flex;
align-items: center;
justify-content: center;
border-radius: 2rem;
border: 1px solid #000;
text-align: center;
background: #f6f6f6;
color: #000;
transition: all .3s;
font-size: 2rem;
font-weight: 600;
margin: 0 2rem;
&:hover{
background: #000;
color: #fff;
}
}
}
}
}
}
</style>