{{ $t('Habit.WorkspaceSetting') }}
{{ $t('Habit.settingWorkspace') }}
@@ -35,7 +35,7 @@
+
- {{ $t('Habit.Designer') }}
+
=4){
+ this.openType.habit = false
+ }
+ }
+ },
'workspaceItem.id_':{
handler(newVal:any,oldVal:any){
this.workspace.workspaceList.forEach((v:any)=>{
@@ -270,12 +278,22 @@ export default defineComponent({
// })
}
},
- 'workspaceItem.sex':{
+ 'workspaceItem.overallSingle':{
handler(newVal:any,oldVal:any){
- // console.log(this.workspaceItem);
-
+ if(this.driver__.driver){
+ driverObj__.refresh();
+ }
}
},
+ // 'openType.model':{
+ // handler(newVal:any,oldVal:any){
+ // if(this.driver__.driver){
+ // console.log(213);
+
+ // driverObj__.refresh();
+ // }
+ // }
+ // },
workspaceItem:{
handler(newVal:any,oldVal:any){
this.store.commit("setWorkspace", this.workspaceItem);
@@ -565,14 +583,17 @@ export default defineComponent({
this.workspaceItem.mannequinMaleType = str
this.workspaceItem.mannequinMaleId = item.id
}
- if(id != item.id){
- if(this.driver__.driver){
- this.openType.habit = false
- nextTick().then(()=>{
- driverObj__.moveNext();
- })
- }
+ // if(id != item.id){
+ if(this.driver__.driver){
+ // this.openType.habit = false
+ nextTick().then(()=>{
+ driverObj__.moveTo(2);
+ this.openType.model = false
+
+ // driverObj__.moveNext();
+ })
}
+ // }
this.workspaceItem.mannequinUrl = item.presignedUrl
this.workspaceItem.mannequinType = str
this.workspaceItem.mannequinId = item.id
@@ -594,8 +615,8 @@ export default defineComponent({
this.openType.habit = !this.openType.habit
if(this.driver__.driver){
nextTick().then(()=>{
- // driverObj__.moveNext();
- driverObj__.moveTo(29);
+ driverObj__.moveNext();
+ // driverObj__.moveTo(29);
})
}
@@ -612,9 +633,10 @@ export default defineComponent({
this.openType.sex = false
this.openType.model = !this.openType.model
this.getMannequins()
- if(this.driver__.driver){
+ if(this.driver__.driver && this.openType.model){
nextTick().then(()=>{
- driverObj__.moveNext();
+ driverObj__.moveTo(3);
+ // driverObj__.moveNext();
})
}
}else if(v == 'singleton'){
diff --git a/src/component/HomePage/Cropper.vue b/src/component/HomePage/Cropper.vue
index 1f39d423..788aae74 100644
--- a/src/component/HomePage/Cropper.vue
+++ b/src/component/HomePage/Cropper.vue
@@ -1,6 +1,5 @@
-
-
+
-
-
-
{{ printModel.name }}
- -
+
- {{ $t('Generate.Model1') }}
- {{ $t('Generate.Model2') }}
- {{ $t('Generate.Generate') }} @@ -51,16 +53,15 @@ />
{{ printModel.name }}
+ {{ $t('Generate.Generate') }}
{{ $t('Generate.maximumLength') }}
-
@@ -157,24 +156,23 @@
v-for="(item, index) in fileList"
:key="item.imgUrl"
@click="generageAdd(item)"
- :class="[item?.checked?'active':'',driver__.driver?'hideEvents':'']"
+ :class="[item?.checked?'active':'']"
>
![]()
-
-
-
+
-
-
+
+
- = 5 && newVal.index <= 7){
+ this.open(newVal.index-4)
+ }else{
+ }
}
- },
- // driver__:{
- // handler(newVal,oldVal){
- // if(newVal.index >= 1 && newVal.index <= 2){
- // this.open(newVal.index)
- // }else{
- // }
- // }
- // }
+ }
},
directives:{
modelImg:{
@@ -307,10 +293,11 @@ export default defineComponent({
material.init('Moodboard')
}else if (num == 3){
// let driver = this.store.state.Guide.guide.driver
- if(this.driver__.driver){
- driverObj__.moveNext()
- }
+ // if(this.driver__.driver){
+ // driverObj__.moveNext()
+ // }
let Generate:any = this.$refs.Generate
+
if(this.driver__.driver){
Generate.searchPictureName = 'Exit sign, door, sunset, ocean, surreal'
}else{
diff --git a/src/component/HomePage/PrintboardUpload.vue b/src/component/HomePage/PrintboardUpload.vue
index 2a4c3fc3..685de25e 100644
--- a/src/component/HomePage/PrintboardUpload.vue
+++ b/src/component/HomePage/PrintboardUpload.vue
@@ -21,8 +21,8 @@
{{ $t('PrintboardUpload.Generate') }}
@@ -51,7 +51,7 @@
+
-
+
{{ $t('PrintboardUpload.Generate') }}
{{ $t('PrintboardUpload.maximumLength') }}
-
+
![]()
@@ -239,6 +240,11 @@ export default defineComponent({
let isTest:any = getCookie('isTest')
this.isTest =JSON.parse(isTest)|| ''
this.uploadUrl = getUploadUrl()
+ if(this.driver__.driver){
+ this.captionGeneration = 'Exit sign, door, sunset, ocean, surreal'
+ }else{
+ this.captionGeneration = ''
+ }
},
methods:{
open(num: Number) {
@@ -247,6 +253,13 @@ export default defineComponent({
if(num == 2){
material.init('Printboard')
}
+ if(num == 3){
+ nextTick().then(()=>{
+ if(this.driver__.driver){
+ driverObj__.moveNext()
+ }
+ })
+ }
},
fileUploadChange(data:any){
let file = data.file
@@ -603,6 +616,9 @@ export default defineComponent({
this.generateList.push(arr)
this.loadingShow = false
})
+ if(this.driver__.driver){
+ driverObj__.moveNext()
+ }
}
}
).catch(res=>{
diff --git a/src/component/HomePage/RobotAssist.vue b/src/component/HomePage/RobotAssist.vue
index 31a7caa3..eeb3d9f6 100644
--- a/src/component/HomePage/RobotAssist.vue
+++ b/src/component/HomePage/RobotAssist.vue
@@ -1,5 +1,5 @@
-
+
@@ -7,6 +7,17 @@
{{item.str}}
+
+ {{item.str}}
+
![]()
@@ -49,6 +60,7 @@ import { Https } from "@/tool/https";
import { getCookie } from "@/tool/cookie";
import { useStore } from "vuex";
import { message } from "ant-design-vue";
+import { openGuide,driverObj__ } from "@/tool/guide";
import { useI18n } from "vue-i18n";
export default defineComponent({
components: {
@@ -72,6 +84,10 @@ export default defineComponent({
let isTest = ref()
let store = useStore()
let workspace:any = ref({})
+ let driver__:any = computed(()=>{
+ return store.state.Guide.guide
+ })
+ let driver__Time:any = ref()
return {
robotTop,
robotInput,
@@ -86,13 +102,41 @@ export default defineComponent({
t,
isTest,
store,
- workspace
+ workspace,
+ driver__,
+ driver__Time
};
},
data() {
return {
};
},
+ watch:{
+ driver__:{
+ handler: function(newval) {
+ console.log(this.driver__);
+ if(this.driver__.driver && this.driver__.index == 0){
+ this.robotTop = true
+ this.robotInput = true
+ driverObj__.refresh();
+ this.record.push({
+ state:1,
+ str:'123123123',
+ driver:true,
+ })
+ this.driver__Time = setInterval(() => {
+ this.$nextTick().then(()=>{
+ driverObj__.refresh();
+ })
+ this.createTimer()
+ }, 3000);
+
+ }else{
+ clearTimeout(this.driver__Time)
+ }
+ }
+ }
+ },
mounted() {
this.textScroll()
let userInfo:any = getCookie("userInfo")
@@ -108,7 +152,8 @@ export default defineComponent({
this.workspace = computed(()=>{
return this.store?.state?.Workspace?.workspace
})
-
+
+
},
directives:{
fade:{
@@ -247,6 +292,20 @@ export default defineComponent({
});
this.chatCentent = ""
},
+ setDriver(){
+ if(this.driver__.driver){
+ driverObj__.moveNext();
+ this.robotTop = false
+ this.robotInput = false
+ }
+ },
+ removeDriver(){
+ if(this.driver__.driver){
+ driverObj__.destroy();
+ this.robotTop = false
+ this.robotInput = false
+ }
+ },
likeFile(item:any,imgIndex:number,index:number){
let data = {
...item,
@@ -280,7 +339,6 @@ export default defineComponent({
},
//清除定时器
clearTimer() {
-
clearInterval(this.timeTop);
clearInterval(this.timeInput);
},
@@ -347,6 +405,19 @@ export default defineComponent({
// margin-right: 5%;
}
}
+ .driver__{
+ .driver__btn{
+ width: 100%;
+ margin-top: 1rem;
+ display: flex;
+ justify-content: space-around;
+ span{
+ font-size: 1.4em;
+ color: #9efff4;
+ cursor: pointer;
+ }
+ }
+ }
}
.text_left,.text_right{
margin: 2rem 0;
diff --git a/src/component/HomePage/SketchboardUpload.vue b/src/component/HomePage/SketchboardUpload.vue
index e0667a8f..65d6c6d8 100644
--- a/src/component/HomePage/SketchboardUpload.vue
+++ b/src/component/HomePage/SketchboardUpload.vue
@@ -18,8 +18,8 @@
![]()
-
+
+ Yes
+
+
+ No
+
+
+
{{ $t('SketchboardUpload.Generate') }}
@@ -46,7 +46,7 @@
v-show="file?.status === 'done'"
>
+
-
+
Generate
{{ $t('SketchboardUpload.maximumLength') }}
-
+
![]()
{{ item.categoryValue }}
@@ -205,7 +203,8 @@
=2 && this.driver__.driver&& newVal.length!=oldVal.length){
if(this.driver__.driver){
- driverObj__.moveTo(17)
+ // driverObj__.moveTo(22)
}
}
}
@@ -374,6 +373,11 @@ export default defineComponent({
this.workspaceCom = computed(()=>{
return this.store?.state?.Workspace?.workspace
})
+ if(this.driver__.driver){
+ this.captionGeneration = 'Exit sign, door, sunset, ocean, surreal'
+ }else{
+ this.captionGeneration = ''
+ }
},
methods: {
open(num: Number) {
@@ -384,6 +388,11 @@ export default defineComponent({
} else if (num == 3) {
// let Generate:any = this.$refs.Generate
// Generate.init('generate')
+ nextTick().then(()=>{
+ if(this.driver__.driver){
+ driverObj__.moveNext()
+ }
+ })
}
},
getPosition(){
@@ -423,11 +432,6 @@ export default defineComponent({
(v: any) => v.status === "done"
);
this.store.commit("setSketchboardFile", fileList);
- nextTick().then(()=>{
- if(this.driver__.driver){
- driverObj__.moveTo(15)
- }
- })
} else if (file.status === "error") {
let index = -1;
@@ -464,7 +468,7 @@ export default defineComponent({
file.categoryShow = true;
nextTick().then(()=>{
if(this.driver__.driver){
- driverObj__.moveTo(16)
+ driverObj__.moveNext()
}
})
@@ -478,6 +482,9 @@ export default defineComponent({
}
file.categoryValue = cate.value;
file.category = cate.name;
+ if(this.driver__.driver){
+ driverObj__.moveNext()
+ }
// this.store.commit("sketchGenerateFiles", this.fileList);
}else{
for (let item of this.fileList) {
@@ -682,6 +689,11 @@ export default defineComponent({
this.generateList.push(arr)
this.loadingShow = false
})
+ nextTick().then(()=>{
+ if(this.driver__.driver){
+ driverObj__.moveNext()
+ }
+ })
}
}
).catch(res=>{
@@ -696,6 +708,11 @@ export default defineComponent({
item.resData = JSON.parse(JSON.stringify(item))
item.jsContent1 = this.t('uploadFile.jsContent1')
this.store.commit("addGenerateMaterialFils", item);
+ nextTick().then(()=>{
+ if(this.driver__.driver){
+ driverObj__.moveNext()
+ }
+ })
}
},
});
diff --git a/src/tool/guide.js b/src/tool/guide.js
index 7b20880c..23a92167 100644
--- a/src/tool/guide.js
+++ b/src/tool/guide.js
@@ -1,3 +1,4 @@
+import { nextTick} from "vue";
import { driver } from "driver.js";
import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
import "driver.js/dist/driver.css";
@@ -12,8 +13,17 @@ let data = {
}
const driverObj__ = driver({
steps: [
- { element: '.Guide_1_1', popover: { title: '', description: 'Begin your creative journey here.' } },
- // { element: '.Guide_1_2', popover: { title: '', description: 'Description' } },
+ { element: '.Guide_1_1_1', popover: { title: 'Title', description: 'Description' } },
+ { element: '.Guide_1_27', popover: { title: '', description: 'You can change the mannequin and other settings in Workspace.' } },
+ { element: '.Guide_1_28', popover: { title: '', description: 'Change the mannequin here.' } },
+ { element: '.Guide_1_29', popover: { title: '', description: 'Select a mannequin of your choice from our system library.' } },
+
+
+ { element: '.Guide_1_1', popover: { title: '', description: 'Begin your creative journey here. ' } },
+ { element: '.Guide_1_1_2', popover: { title: '', description: 'Begin your creative journey here. ' } },
+ { element: '.Guide_1_1_2', popover: { title: '', description: 'Begin your creative journey here. ' } },
+ // { element: '.Guide_1_1_2', popover: { title: '', description: 'Begin your creative journey here. ' } },
+ // { element: '.Guide_1_3', popover: { title: '', description: 'Description' } },
// { element: '.Guide_1_2', popover: { title: '', description: 'Description' } },
{ element: '.Guide_1_4', popover: { title: '', description: 'Click here to try the latest image generation technology to create your mood board.' } },
{ element: '.Guide_1_5', popover: { title: '', description: "Enter keywords that capture the mood you wish to express and then click the 'Generate' button." } },
@@ -23,6 +33,14 @@ const driverObj__ = driver({
//以上moodboard
{ element: '.Guide_1_2_1', popover: { title: '', description: 'Upload two print images here' } },
{ element: '.Guide_1_2_2', popover: { title: '', description: 'Crop the uploaded image here.' } },
+ { element: '.Guide_1_2_2', popover: { title: '', description: 'Crop the uploaded image here.' } },
+ { element: '.Guide_1_2_3', popover: { title: '', description: 'Crop the uploaded image here.' } },
+ { element: '.Guide_1_2_4', popover: { title: '', description: 'Crop the uploaded image here.' } },
+ { element: '.Guide_1_2_5', popover: { title: '', description: 'Crop the uploaded image here.' } },
+ { element: '.Guide_1_2_6', popover: { title: '', description: 'Crop the uploaded image here.' } },
+ { element: '.Guide_1_2_7', popover: { title: '', description: 'Crop the uploaded image here.' } },
+ { element: '.Guide_1_2_8', popover: { title: '', description: 'Crop the uploaded image here.' } },
+ { element: '.Guide_1_2_9', popover: { title: '', description: 'Crop the uploaded image here.' } },
{ element: '.Guide_1_8', popover: { title: '', description: 'Click here for next step.' } },
{ element: '.Guide_1_10', popover: { title: '', description: 'Click here to extract primary colors from image.' } },
{ element: '.Guide_1_11', popover: { title: '', description: 'Select the color you want from these color blocks as the first color.' } },
@@ -32,15 +50,21 @@ const driverObj__ = driver({
{ element: '.Guide_1_8', popover: { title: '', description: 'Click here for next step.' } },
{ element: '.Guide_1_9', popover: { title: '', description: 'Upload or select two sketches for your collection on this page.' } },
+ { element: '.Guide_1_9_1', popover: { title: '', description: 'Upload or select two sketches for your collection on this page.' } },
+ { element: '.Guide_1_9_2', popover: { title: '', description: 'Upload or select two sketches for your collection on this page.' } },
{ element: '.Guide_1_13', popover: { title: '', description: 'Click here to choose a category for the uploaded sketch.' } },
{ element: '.Guide_1_13_1', popover: { title: '', description: 'Choose correct category for the sketch.' } },
+ { element: '.Guide_1_13_2', popover: { title: '', description: 'Choose correct category for the sketch.' } },
{ element: '.Guide_1_14', popover: { title: '', description: 'After you have confirmed categories of sketches are correct, click here to complete the uploading process.' } },
//开始design
{ element: '.Guide_1_15', popover: { title: '', description: 'Click here to let AI generate design illustrations.' } },
{ element: '.Guide_1_16', popover: { title: '', description: 'Please wait a few seconds.' } },
{ element: '.Guide_1_17', popover: { title: '', description: 'Click on any design image you are interested in to modify the details.' } },
// { element: '.Guide_1_18', popover: { title: '', description: 'Description' } },
+ { element: '.Guide_1_30', popover: { title: '', description: 'Click the ‘Redesign’ button to generate new results using the selected mannequin.' } },
+ { element: '.Guide_1_16', popover: { title: '', description: 'Click here to let AI generate design illustrations.' } },
+ { element: '.Guide_1_17', popover: { title: '', description: 'Click on any design image you are interested in to modify the details.' } },
{ element: '.Guide_1_19', popover: { title: '', description: 'Click on the clothes to modify its details.' } },
{ element: '.Guide_1_20', popover: { title: '', description: 'Click here to add or change the print.' } },
{ element: '.Guide_1_21', popover: { title: '', description: 'You can find the print you uploaded earlier in your Library.' } },
@@ -49,11 +73,7 @@ const driverObj__ = driver({
// { element: '.Guide_1_24', popover: { title: '', description: 'Description' } },
{ element: '.Guide_1_25', popover: { title: '', description: 'Preview printed design here.' ,side: "right",align: 'end' } },
{ element: '.Guide_1_26', popover: { title: '', description: 'Click here to finalize your modification.' } },
- { element: '.Guide_1_27', popover: { title: '', description: 'You can change the mannequin and other settings in Workspace.' } },
- { element: '.Guide_1_28', popover: { title: '', description: 'Change the mannequin here.' } },
- { element: '.Guide_1_29', popover: { title: '', description: 'Select a mannequin of your choice from our system library.' } },
- { element: '.Guide_1_30', popover: { title: '', description: 'Click the ‘Redesign’ button to generate new results using the selected mannequin.' } },
- { element: '.Guide_1_99', popover: { title: 'Begin Your Design', description: 'Your guide is complete, and now the canvas is yours to create freely. For more insights and details, check out our demo video on the homepage at ' } },
+ { element: '.Guide_1_99', popover: { title: 'Begin Your Design', description: 'Your guide is complete, and now the canvas is yours to create freely. For more insights and details, check out our demo video on the homepage at https://code-create.com.hk/aida/' } },
],
// showProgress: true,//控制总页数和当前页数是否显示
allowClose:false,
@@ -69,41 +89,55 @@ const driverObj__ = driver({
doneBtnText: '✕',
onPopoverRender: (popover, options) => {//每个步骤的元素和所有信息
// console.log(popover,options,element);
- if(element){
- element.classList.remove('Guide_')
- }
popover.previousButton.style.display = 'none'
- let driver = document.querySelector('body')
- if(options.state.activeIndex >= 2 && options.state.activeIndex < 3){
- options.config.stagePadding = 0
- }else{
- options.config.stagePadding = 10
- }
- if(
- // options.state.activeIndex >= 1 && options.state.activeIndex <= 2 ||
- // options.state.activeIndex >= 18 && options.state.activeIndex < 19 ||
- // options.state.activeIndex >= 24 && options.state.activeIndex < 25 ||
- driverObj__.isLastStep()
- ){
- popover.footer.style.display = 'block'
- popover.footerButtons.style.pointerEvents = 'auto';
- // driver.classList.add('showEvents')
- addDiv(options.state.activeElement)
- }else{
- popover.footer.style.display = 'none'
- removeDiv(options.state.activeElement)
- popover.footerButtons.style.pointerEvents = 'none';
- // driver.classList.remove('showEvents')
- }
- // console.log(options.state.activeIndex);
+ // let driver = document.querySelector('body')
driverIndex__ = driverObj__.getState().activeIndex
data = {
index : driverIndex__,
driver : true,
}
store?.commit("setGuide", data);
- element = options.state.activeElement
- element.classList.add('Guide_')
+ if(options.state.activeIndex == 0){
+ popover.wrapper.style.display = 'none'
+ }else{
+ popover.wrapper.style.display = 'block'
+ }
+
+ //判断是不是generate 如果是就吧边距设为0
+ // if(options.state.activeIndex >= 2 && options.state.activeIndex < 3){
+ // options.config.stagePadding = 0
+ // }else{
+ // options.config.stagePadding = 10
+ // }
+ if(
+ options.state.activeIndex >= 2 && options.state.activeIndex < 3 ||
+ options.state.activeIndex >= 5 && options.state.activeIndex < 8 ||
+ options.state.activeIndex >= 13 && options.state.activeIndex < 15 ||
+ // options.state.activeIndex >= 24 && options.state.activeIndex < 25 ||
+ driverObj__.isLastStep()
+ ){
+ popover.footer.style.display = 'block'
+ // popover.previousButton.style.display = 'block'
+ popover.footerButtons.style.pointerEvents = 'auto';
+ // driver.classList.add('showEvents')
+ // addDiv(options.state.activeElement)
+ }else{
+ popover.footer.style.display = 'none'
+ // popover.previousButton.style.display = 'none'
+ // removeDiv(options.state.activeElement)
+ popover.footerButtons.style.pointerEvents = 'none';
+ // driver.classList.remove('showEvents')
+ }
+ nextTick().then(()=>{
+ if(element){
+ element.classList.remove('Guide_')
+ }
+ element = options.state.activeElement
+ element.classList.add('Guide_')
+ console.log(element);
+ })
+
+
},
//销毁前
onDestroyStarted:()=>{
@@ -121,20 +155,14 @@ const driverObj__ = driver({
- // onNextClick:(element, step, options) =>{
- // console.log(element,step,options);
- // driverObj__.moveNext()
- // // element.style.posiiton = 'relative'
- // // const mask = document.createElement('div');
- // // mask.style.position = 'absolute';
- // // mask.style.top = '0';
- // // mask.style.left = '0';
- // // mask.style.width = '100%';
- // // mask.style.height = '100%';
- // // mask.style.backgroundColor = 'rgba(0, 0, 0, 0.5)';
- // // mask.style.zIndex = '9999';
- // // element.appendChild(mask);
- // }
+ onNextClick:(element, step, options) =>{
+ console.log(element,step,options);
+ if(options.state.activeIndex == 2){
+ driverObj__.moveTo(4)
+ }else{
+ driverObj__.moveNext()
+ }
+ }
});
function addDiv(element){
element.style.posiiton = 'relative'
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index b693e4f3..aabe19e7 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -73,20 +73,22 @@
-
-
+ ) in designCollectionList" :key="design?.designItemId">
+
![]()
-