设置store

src/api/workshop.ts

@@ -24,6 +24,17 @@ const request = (config: any) => {
  * @param data.isRegenerated 是否重新生成 0-否，1-是
 */
 export function generateTryOnEffect(data: Object) {
+	return new Promise(resolve => {
+		setTimeout(() => {
+			resolve({
+				tryOnId: 1,
+				tryOnUrl: "http://118.31.39.42:3000/falls/1.png",
+				styleUrl: "http://118.31.39.42:3000/falls/1.png",
+				isRegenerated: 0,
+				isFavorite: 0,
+			})
+		}, 1000)
+	})
 	return request({
 		url: '/api/try-on-effects/generate',
 		method: 'post',
@@ -38,6 +49,16 @@ export function generateTryOnEffect(data: Object) {
  * @param data.file 顾客照片文件
  */
 export function uploadCustomerPhoto(data: FormData) {
+	return new Promise(resolve => {
+		useOverallStore().setLoading(true)
+		setTimeout(() => {
+			resolve({
+				visitRecordId: "2",
+				defaultImageUrl: URL.createObjectURL(data.get('file')),
+			})
+			useOverallStore().setLoading(false)
+		}, 1000)
+	})
 	return request({
 		url: '/api/customer-photos/upload',
 		method: 'post',

src/stores/modules/generate.ts

@@ -23,7 +23,18 @@ export const useGenerateStore = defineStore({
 			photoInfo: {
 				id: "",
 				url: "",
-			}
+				file: null,
+			},
+			/** AI魔改信息 */
+			customizeInfo: {
+				inputText:"",
+				
+				tryOnId: "",
+				tryOnUrl: "",
+				styleUrl: "",
+				isRegenerated: "",
+				isFavorite: false,
+			},
 		}
 	},
 	getters: {
@@ -65,6 +76,16 @@ export const useGenerateStore = defineStore({
 		updatePhotoInfo(data: any) {
 			this.photoInfo.id = data.visitRecordId || ""
 			this.photoInfo.url = data.defaultImageUrl || ""
+			this.photoInfo.file = null
+		},
+		/** 更新AI魔改信息 */
+		clearCustomizeInfo(data: any) {
+			this.customizeInfo.inputText = data.inputText || ""
+			this.customizeInfo.tryOnId = data.tryOnId || ""
+			this.customizeInfo.tryOnUrl = data.tryOnUrl || ""
+			this.customizeInfo.styleUrl = data.styleUrl || ""
+			this.customizeInfo.isRegenerated = data.isRegenerated || ""
+			this.customizeInfo.isFavorite = data.isFavorite || ""
 		},
 	}
-})
+})

src/views/Workshop/customize.vue

@@ -13,20 +13,19 @@
 	import { useGenerateStore } from '@/stores'
 	const store = useGenerateStore()
 
+	const customizeInfo = store.customizeInfo
 	const router = useRouter()
-	const inputText = ref('')
-	const isFavorite = ref(false)
-	const tryOnUrl = ref('')
 	const loading = ref(false)
 	const onSend = () => {
-		if (inputText.value === '') return
+		if (customizeInfo.inputText === '') return
 		generate()
-		const text = inputText.value
+		customizeInfo.inputText = ''
-		inputText.value = ''
+		// const text = inputText.value
+		// inputText.value = ''
 		// console.log('发送消息:', text)
 	}
 	const onReload = () => {
-		inputText.value = ''
+		customizeInfo.inputText = ''
 		generate(true)
 	}
 
@@ -40,13 +39,16 @@
 			customerPhotoId: store.customerPhotoId,
 			originalTryOnId: store.originalTryOnId,
 			isRegenerated: isRegenerated ? 1 : 0,
-			prompt: inputText.value
+			prompt: customizeInfo.inputText
 		}
 		loading.value = true
 		generateTryOnEffect(data)
 			.then((res) => {
-				tryOnUrl.value = res.tryOnUrl
+				customizeInfo.tryOnId = res.tryOnId
-				isFavorite.value = !!res.isFavorite
+				customizeInfo.tryOnUrl = res.tryOnUrl
+				customizeInfo.styleUrl = res.styleUrl
+				customizeInfo.isRegenerated = res.isRegenerated
+				customizeInfo.isFavorite = !!res.isFavorite
 				loading.value = false
 			})
 			.catch((err) => {
@@ -54,15 +56,15 @@
 				loading.value = false
 			})
 	}
-	generate()
+	if (customizeInfo.tryOnId === '') generate()
 
 	// 喜欢
 	const isLoveLoading = ref(false)
 	const onLove = () => {
 		if (isLoveLoading.value) return
-		const http = isFavorite.value ? cancelTryOnEffectFavorite : setTryOnEffectFavorite
+		const http = customizeInfo.isFavorite ? cancelTryOnEffectFavorite : setTryOnEffectFavorite
+		customizeInfo.isFavorite = !customizeInfo.isFavorite
 		isLoveLoading.value = true
-		isFavorite.value = !isFavorite.value
 		http('tryOnId')
 			.then(() => {
 				isLoveLoading.value = false
@@ -94,21 +96,23 @@
 				<div class="help">?</div>
 				<input
 					type="text"
-					v-model="inputText"
+					v-model="customizeInfo.inputText"
 					@keyup.enter="onSend"
 					placeholder="Try: “Change background to Tokyo City”"
 				/>
 				<div class="send" @click="onSend"><SvgIcon name="send" size="48" /></div>
 			</div>
 			<div class="card">
-				<img :src="tryOnUrl" />
+				<img :src="customizeInfo.tryOnUrl" />
 				<!-- <div class="select-box">
 				<div class="icon"><SvgIcon name="history" size="35" /></div>
 				<div class="label">History</div>
 				<div class="icon"><SvgIcon name="xialajiantou" size="29" /></div>
 			</div> -->
 				<div class="icons">
-					<div @click="onLove"><SvgIcon :name="`love_${isFavorite ? 1 : 0}`" size="35" /></div>
+					<div @click="onLove">
+						<SvgIcon :name="`love_${customizeInfo.isFavorite ? 1 : 0}`" size="35" />
+					</div>
 					<div @click="onReload"><SvgIcon name="reload" size="35" /></div>
 					<!-- <div @click="onDownload"><SvgIcon name="download" size="35" /></div> -->
 				</div>

src/views/Workshop/uploadFace1.vue

@@ -3,6 +3,8 @@
 	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)
@@ -11,10 +13,13 @@
 	const faceUrl = ref('')
 	// 上传照片
 	const handleUploadFace = () => {
+		generateStore.updatePhotoInfo({})
 		router.push({ name: 'uploadFace2' })
 	}
-	// 完成上传
+	// 跳过上传
 	const handleFinish = () => {
+		generateStore.updatePhotoInfo({})
+		generateStore.clearCustomizeInfo({})
 		router.push({ name: 'customize' })
 	}
 </script>
@@ -71,7 +76,7 @@
 				line-height: 132%;
 			}
 		}
-		>.btns {
+		> .btns {
 			width: 100%;
 			display: flex;
 			justify-content: center;

src/views/Workshop/uploadFace2.vue

@@ -12,10 +12,7 @@
 		emit('view-type', 1)
 	})
 	const router = useRouter()
-	const fileData = reactive({
+	const fileData = generateStore.photoInfo
-		url:"",
-		file: null,
-	});
 	// 上传照片
 	const handleUploadFace = () => {
 		const input = document.createElement('input')
@@ -27,6 +24,7 @@
 			const file = e.target.files[0]
 			if (!file) return
 			const url = URL.createObjectURL(file)
+			fileData.id = ''
 			fileData.url = url
 			fileData.file = file
 			// const reader = new FileReader()
@@ -38,13 +36,15 @@
 	}
 	// 生成照片
 	const handleGenerate = () => {
+		if (fileData.id) return router.push({ name: 'customize' })
 		if (!fileData.file) return
 		const formData = new FormData()
-		formData.append('customerId', "1")
+		formData.append('customerId', '1')
-		formData.append('visitRecordId', "1")
+		formData.append('visitRecordId', '1')
 		formData.append('file', fileData.file)
-		uploadCustomerPhoto(formData).then(res => {
+		uploadCustomerPhoto(formData).then((res) => {
-			generateStore.updatePhotoInfo(res);
+			generateStore.updatePhotoInfo(res)
+			generateStore.clearCustomizeInfo({})
 			router.push({ name: 'customize' })
 		})
 	}