Merge branch 'main' of http://18.167.251.121:10003/aidlab/lanecarford_front

src/api/workshop.ts

@@ -49,6 +49,25 @@ export function generateTryOnEffect(data: Object) {
 		data,
 	})
 }
+/**
+ * 生成试穿效果-演示
+ * @param data 试穿效果数据
+ * @param data.customerId 顾客ID
+ * @param data.visitRecordId 进店记录id
+ * @param data.styleId 样式id
+ * @param data.modelPhotoId 模型照片id
+ * @param data.customerPhotoId 顾客照片id
+ * @param data.prompt 提示词
+ * @param data.originalTryOnId 原始试穿效果id
+ * @param data.isRegenerated 是否重新生成 0-否，1-是
+*/
+export function generateTryOnEffectDemo(data: Object) {
+	return request({
+		url: '/api/try-on-effects/reFace/{customerPhotold}o',
+		method: 'post',
+		data,
+	})
+}
 
 /** 上传图片-AI换脸
  * @param data 图片数据

src/router/index.ts

@@ -1,6 +1,7 @@
 import { createRouter, createWebHistory } from 'vue-router'
 import { useGenerateStore } from '@/stores/modules/generate'
 const VerifyIDs = (num: number) => {
+	return true
   const ids = [
 	!!useGenerateStore().customerId,
 	!!useGenerateStore().visitRecordId,
@@ -130,6 +131,13 @@ const router = createRouter({
           component: () => import('../views/Workshop/product.vue'),
 		  meta: { verify: ()=> VerifyIDs(4) }
         },
+        {
+          // 推荐try on
+          path: '/workshop/recommended',
+          name: 'recommended',
+          component: () => import('../views/Workshop/recommended.vue'),
+		  meta: { verify: ()=> VerifyIDs(5) }
+        },
         {
           // 上传照片1
           path: '/workshop/uploadFace',

src/stores/modules/generate.ts

@@ -42,6 +42,19 @@ export const useGenerateStore = defineStore({
         isRegenerated: '',
         isFavorite: false
       },
+      /** AI魔改信息-演示 */
+      customizeInfoDemo: {
+        inputText: '',
+        count: 0,
+        oldInputText: '',
+        oldTryOnId: '',
+
+        tryOnId: '',
+        tryOnUrl: '',
+        styleUrl: '',
+        isRegenerated: '',
+        isFavorite: false
+      },
       customerInfo: {
         customerId: '',
         visitRecordId: ''
@@ -124,6 +137,18 @@ export const useGenerateStore = defineStore({
       this.customizeInfo.styleUrl = ''
       this.customizeInfo.isRegenerated = ''
       this.customizeInfo.isFavorite = false
+    },
+	/** 清空 AI魔改信息-演示 */
+    clearCustomizeInfoDemo() {
+      this.customizeInfoDemo.inputText = ''
+      this.customizeInfoDemo.count = 0
+      this.customizeInfoDemo.oldInputText = ''
+      this.customizeInfoDemo.oldTryOnId = ''
+      this.customizeInfoDemo.tryOnId = ''
+      this.customizeInfoDemo.tryOnUrl = ''
+      this.customizeInfoDemo.styleUrl = ''
+      this.customizeInfoDemo.isRegenerated = ''
+      this.customizeInfoDemo.isFavorite = false
     },
     uploadCustomizeInfo(data: object) {
       for (const key in data) {
@@ -141,6 +166,7 @@ export const useGenerateStore = defineStore({
       this.clearProductData()
       this.updatePhotoInfo({})
       this.clearCustomizeInfo()
+      this.clearCustomizeInfoDemo()
       this.clearCustomerInfo()
       this.setSessionId('')
     },

src/views/Workshop/customize.vue

@@ -2,19 +2,22 @@
 	import HeaderTitle from '@/components/HeaderTitle.vue'
 	import FooterNavigation from '@/components/FooterNavigation.vue'
 	import GenerateLoading from '@/views/asistant/components/GenerateLoading.vue'
-	import { ref, onMounted } from 'vue'
+	import { ref, onMounted, computed } from 'vue'
 	import {
 		generateTryOnEffect,
+		generateTryOnEffectDemo,
 		setTryOnEffectFavorite,
 		cancelTryOnEffectFavorite
 	} from '@/api/workshop'
 	const emit = defineEmits(['viewType'])
-	import { useRouter } from 'vue-router'
+	import { useRouter, useRoute } from 'vue-router'
 	import { useGenerateStore } from '@/stores'
 	const generateStore = useGenerateStore()
-
-	const customizeInfo = generateStore.customizeInfo
 	const router = useRouter()
+	const route = useRoute()
+
+	const isDemo = computed(() => route.query.demo === '1')
+	const customizeInfo = isDemo.value ? generateStore.customizeInfoDemo : generateStore.customizeInfo
 	const loading = ref(false)
 	const onSend = () => {
 		if (customizeInfo.inputText === '') return
@@ -45,8 +48,8 @@
 		}
 		if (generateStore.customerPhotoId && customizeInfo.count === 0)
 			data['customerPhotoId'] = generateStore.customerPhotoId
-		loading.value = true
+		loading.value = true;
-		generateTryOnEffect(data)
+		(isDemo.value ? generateTryOnEffectDemo : generateTryOnEffect)(data)
 			.then((res: any) => {
 				customizeInfo.count++
 				customizeInfo.tryOnId = res.tryOnId
@@ -66,6 +69,7 @@
 	// 喜欢
 	const isLoveLoading = ref(false)
 	const onLove = () => {
+		if (isDemo.value) return
 		if (isLoveLoading.value) return
 		const http = customizeInfo.isFavorite ? cancelTryOnEffectFavorite : setTryOnEffectFavorite
 		customizeInfo.isFavorite = !customizeInfo.isFavorite
@@ -86,7 +90,11 @@
 		router.back()
 	}
 	const onFinish = () => {
-		router.push({ name: 'creation' })
+		if (isDemo.value) {
+			router.push({ name: 'end' })
+		} else {
+			router.push({ name: 'creation' })
+		}
 	}
 </script>
 
@@ -114,7 +122,7 @@
 				<div class="icon"><SvgIcon name="xialajiantou" size="29" /></div>
 			</div>
 			<div class="icons">
-				<div @click="onLove">
+				<div @click="onLove" v-if="!isDemo">
 					<SvgIcon :name="`love_${customizeInfo.isFavorite ? 1 : 0}`" size="35" />
 				</div>
 				<div @click="onReload" v-show="customizeInfo.oldInputText">

src/views/Workshop/home.vue

@@ -4,6 +4,8 @@ import HeaderTitle from '@/components/HeaderTitle.vue'
 import FooterNavigation from '@/components/FooterNavigation.vue'
 import { useRouter } from 'vue-router'
 const router = useRouter()
+import { showConfirmDialog } from 'vant'
+import MyEvent from '@/utils/myEvent'
 
 //const props = defineProps({
 //})
@@ -14,6 +16,21 @@ const emit = defineEmits([
 // const data = reactive({
 // })
 
+const clickSwitchVIPID = ()=>{
+	showConfirmDialog({
+		title: 'Switch VIP ID?',
+		message: 'You have unsaved changes. Your progress will be lost.',
+		confirmButtonText: 'Yes',
+		cancelButtonText: 'Cancel',
+	})
+		.then(() => {
+			MyEvent.emit('clear-generate-state')
+			MyEvent.emit('clearAllCache')
+			router.push('/stylist/customer')
+		})
+		.catch(() => {})
+}
+
 onMounted(()=>{
 	emit('view-type', 1)
 })
@@ -37,13 +54,13 @@ defineExpose({})
 				<div class="item" @click="()=>router.push('/stylist/index')">
 					<img src="@/assets/images/nav1.png" alt="">
 				</div>
-				<div class="item" @click="()=>router.push('/workshop/uploadFace')">
+				<div class="item" @click="()=>router.push('/workshop/recommended')">
 					<img src="@/assets/images/nav2.png" alt="">
 				</div>
 				<div class="item" @click="()=>router.push('/stylist/index')">
 					<img src="@/assets/images/nav3.png" alt="">
 				</div>
-				<div class="item" @click="()=>router.push('/stylist/customer')">
+				<div class="item" @click="clickSwitchVIPID">
 					<img src="@/assets/images/nav4.png" alt="">
 				</div>
 			</div>

src/views/Workshop/recommended.vue

@@ -0,0 +1,102 @@
+<script setup lang="ts">
+	import HeaderTitle from '@/components/HeaderTitle.vue'
+	import FooterNavigation from '@/components/FooterNavigation.vue'
+	import { ref, onMounted } from 'vue'
+	import { useRouter } from 'vue-router'
+	import { useGenerateStore } from '@/stores'
+	const generateStore = useGenerateStore()
+	const emit = defineEmits(['view-type'])
+	onMounted(() => {
+		emit('view-type', 1)
+	})
+	const router = useRouter()
+	const clickNext = () => {
+		generateStore.updatePhotoInfo({})
+		router.push({ name: 'uploadFace', query: { demo: 1 } })
+	}
+</script>
+
+<template>
+	<header-title />
+	<!-- 上传照片 -->
+	<div class="upload-face-1">
+		<img src="@/assets/images/workshop/bg/upload_bg.png" class="bg" />
+		<div class="content">
+			<div class="texts">
+				<p class="title">Recommended<br />Try-on</p>
+				<p class="desc">Come and try face swapping!</p>
+			</div>
+			<div class="image">
+				<img src="../../assets/images/workshop/template.png" />
+			</div>
+			<button class="sandblasted-blurred" @click="clickNext"><span>Next</span></button>
+		</div>
+	</div>
+	<footer-navigation is-placeholder />
+</template>
+
+<style scoped lang="less">
+	.upload-face-1 {
+		width: 100%;
+		flex: 1;
+		overflow: hidden;
+		position: relative;
+		color: #fff;
+		> .bg {
+			position: absolute;
+			width: 100%;
+			height: auto;
+			min-height: 100%;
+			object-fit: cover;
+		}
+		> .content {
+			margin-top: 12rem;
+			text-align: center;
+			> .texts {
+				// left: 0;
+				width: 100%;
+				// padding: 9.9rem 0 0 7.2rem;
+				> .title {
+					font-family: 'satoshiBold';
+					font-size: 11rem;
+					line-height: 124%;
+				}
+				> .desc {
+					font-family: 'satoshiMedium';
+					font-size: 4rem;
+					margin-top: 4rem;
+					line-height: 132%;
+				}
+			}
+			> .image {
+				margin: 4.9rem auto 9.5rem;
+				width: 65.3rem;
+				height: 86.5rem;
+				border-radius: 1rem;
+				backdrop-filter: blur(5.27rem);
+				-webkit-backdrop-filter: blur(5.27rem);
+				-moz-backdrop-filter: blur(5.27rem);
+				-ms-backdrop-filter: blur(5.27rem);
+				-o-backdrop-filter: blur(5.27rem);
+				box-shadow: 1.9rem 2.3rem 1.66rem 0.23rem -0.3rem 0.23rem #36180c40;
+				border: 0.439rem solid #fff;
+				// border-image: linear-gradient(90deg,#BF926E94, #ffffff) 1;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				> img {
+					width: 58.9rem;
+					height: 79.2rem;
+					border-radius: 1rem;
+					border: 0.2rem solid #d9d9d9;
+					object-fit: cover;
+				}
+			}
+			> button {
+				width: 40rem;
+				height: 8.3rem;
+				border-radius: 0.7rem;
+			}
+		}
+	}
+</style>

src/views/Workshop/uploadFace1.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
 	import HeaderTitle from '@/components/HeaderTitle.vue'
 	import FooterNavigation from '@/components/FooterNavigation.vue'
-	import { ref, onMounted } from 'vue'
+	import { ref, onMounted, computed } from 'vue'
-	import { useRouter } from 'vue-router'
+	import { useRouter, useRoute } from 'vue-router'
 	import { useGenerateStore } from '@/stores'
 	const generateStore = useGenerateStore()
 	const emit = defineEmits(['view-type'])
@@ -10,22 +10,26 @@
 		emit('view-type', 1)
 	})
 	const router = useRouter()
-	const faceUrl = ref('')
+	const route = useRoute()
+	const query = computed(() => route.query)
+	const isDemo = computed(() => route.query.demo === '1')
 	// 上传照片
 	const handleUploadFace = () => {
 		// generateStore.updatePhotoInfo({})
-		router.push({ name: 'uploadFace2' })
+		router.push({ name: 'uploadFace2', query: query.value })
 	}
 	// 跳过上传
 	const handleFinish = () => {
 		generateStore.updatePhotoInfo({})
-		generateStore.clearCustomizeInfo()
+		if (!isDemo.value) {
-		generateStore.uploadCustomizeInfo({
+			generateStore.clearCustomizeInfo()
-			tryOnId: generateStore.originalTryOn.id,
+			generateStore.uploadCustomizeInfo({
-			tryOnUrl: generateStore.originalTryOn.tryOnUrl,
+				tryOnId: generateStore.originalTryOn.id,
-			isFavorite: generateStore.originalTryOn.isLike
+				tryOnUrl: generateStore.originalTryOn.tryOnUrl,
-		})
+				isFavorite: generateStore.originalTryOn.isLike
-		router.push({ name: 'customize' })
+			})
+		}
+		router.push({ name: 'customize', query: query.value })
 	}
 </script>
 

src/views/Workshop/uploadFace2.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
 	import HeaderTitle from '@/components/HeaderTitle.vue'
 	import FooterNavigation from '@/components/FooterNavigation.vue'
-	import { ref, reactive, onMounted } from 'vue'
+	import { ref, reactive, onMounted, computed } from 'vue'
-	import { useRouter } from 'vue-router'
+	import { useRouter, useRoute } from 'vue-router'
 	import { uploadCustomerPhoto } from '@/api/workshop'
 	import { useGenerateStore } from '@/stores'
 	const generateStore = useGenerateStore()
@@ -12,6 +12,9 @@
 		emit('view-type', 1)
 	})
 	const router = useRouter()
+	const route = useRoute()
+	const query = computed(() => route.query)
+	const isDemo = computed(() => route.query.demo === '1')
 	const fileData = generateStore.photoInfo
 	if (!fileData.file?.size) generateStore.updatePhotoInfo({})
 	// 上传照片
@@ -37,7 +40,7 @@
 	}
 	// 生成照片
 	const handleGenerate = () => {
-		if (fileData.id) return router.push({ name: 'customize' })
+		if (fileData.id) return router.push({ name: 'customize', query: query.value })
 		if (!fileData.file) return
 		const formData = new FormData()
 		formData.append('customerId', generateStore.customerId + '')
@@ -45,8 +48,8 @@
 		formData.append('file', fileData.file)
 		uploadCustomerPhoto(formData).then((res) => {
 			generateStore.updatePhotoInfo({ ...res, file: fileData.file })
-			generateStore.clearCustomizeInfo()
+			isDemo.value ? generateStore.clearCustomizeInfoDemo() : generateStore.clearCustomizeInfo()
-			router.push({ name: 'customize' })
+			router.push({ name: 'customize', query: query.value })
 		})
 	}
 	// 处理照片加载错误

src/views/stylist/customer.vue

@@ -83,7 +83,8 @@ const handleConfirm = async () => {
     useUserInfoStore().resetGenerateParams()
     // console.log('res', res)
     generateStore.setCustomerInfo(res)
-    router.push('/stylist/index')
+    // router.push('/stylist/index')
+    router.push('/homeNav')
   })
 }
 </script>