添加接口

2025-10-23 15:11:24 +08:00
parent ac5abc454d
commit 73525c3803
10 changed files with 378 additions and 129 deletions
--- a/src/views/Workshop/creation/creation-details.vue
+++ b/src/views/Workshop/creation/creation-details.vue
@@ -4,12 +4,13 @@
 	import { DownloadImages } from '@/utils/tools'
 	const router = useRouter()
 	const query = computed(() => router.currentRoute.value.query)
-
+	const styleUrl = computed(() => query.value.styleUrl)
+		
 	onMounted(() => {})
 	const loading = ref(false)
 	const onDownload = () => {
 		DownloadImages([{
-			url: 'http://118.31.39.42:3000/falls/2.png',
+			url: styleUrl.value,
 			name: 'lane-crawford.png'
 		}])
 	}
@@ -23,7 +24,7 @@
 	<div class="creation-details">
 		<div class="title">Lane Crawford</div>
 		<p class="tip">Business Casual Suits</p>
-		<div class="image"><img src="@/assets/images/workshop/creation-details.png" /></div>
+		<div class="image"><img :src="styleUrl" /></div>
 		<div class="btns">
 			<div class="icon" @click="onDownload"><SvgIcon name="download" size="33" /></div>
 			<button @click="onEdit">Edit</button>
--- a/src/views/Workshop/creation/creation-list.vue
+++ b/src/views/Workshop/creation/creation-list.vue
@@ -2,11 +2,18 @@
 	import { ref, reactive, onMounted, computed } from 'vue'
 	import MyList from '@/components/myList.vue'
 	import { DownloadImages } from '@/utils/tools'
+	import {
+		getTryOnEffectFavoriteList,
+		getTryOnEffectStyleList,
+		setTryOnEffectFavorite,
+		cancelTryOnEffectFavorite
+	} from '@/api/workshop'

 	import { useRouter } from 'vue-router'
 	const router = useRouter()
 	const emit = defineEmits(['view-type'])
-	const query = router.currentRoute.value.query
+	const query = computed(() => router.currentRoute.value.query)
+	const visitRecordId = computed(() => query.value.visitRecordId)

 	onMounted(() => {
 		emit('view-type', 1)
@@ -20,35 +27,55 @@

 	const onLoad = () => {
 		loading.value = true
-		setTimeout(() => {
-			for (var i = 0; i < 10; i++)
-				list.push({
-					id: list.length,
-					love: Math.random() > 0.5,
-					isAi: Math.random() > 0.5,
+		const http = visitRecordId.value ? getTryOnEffectFavoriteList : getTryOnEffectStyleList
+		http(visitRecordId.value)
+			.then((data) => {
+				data?.forEach((v) => {
+					const obj = {
+						tryOnId: v.tryOnId,
+						tryOnUrl: v.tryOnUrl,
+						styleUrl: v.styleUrl,
+						isFavorite: !!v.isFavorite,
+						isRegenerated: !!v.isRegenerated,

-					selected: list.length < maxSelectCount,
-					loading: false,
-					downloaded: false
+						selected: list.length < maxSelectCount,
+						loading: false,
+						downloaded: false
+					}
+					list.push(obj)
 				})
-			loading.value = false
-			if (list.length >= 30) {
+				loading.value = false
 				finish.value = true
-			}
-		}, 500)
+			})
+			.catch((err) => {
+				console.error(err)
+				loading.value = false
+				finish.value = false
+			})
 	}
 	const onItem = (v) => {
 		isChooseSave.value ? onSelectItem(v) : onDetailsItem(v)
 	}
+	// 详情页
 	const onDetailsItem = (v) => {
-		if (v.isAi) return
-		console.log('详情', v)
-		router.push({ query: { did: v.id } })
+		if (v.isRegenerated) return
+		router.push({ query: { ...query.value, styleUrl: v.styleUrl } })
 	}
+	// 喜欢
+	const isLoveLoading = ref(false)
 	const onLoveItem = (v) => {
-		// Outfit暂时不可以like
-		console.log('喜欢', v)
-		v.love = !v.love
+		if (isLoveLoading.value) return
+		const http = v.isFavorite ? cancelTryOnEffectFavorite : setTryOnEffectFavorite
+		isLoveLoading.value = true
+		v.isFavorite = !v.isFavorite
+		http(v.tryOnId)
+			.then(() => {
+				isLoveLoading.value = false
+			})
+			.catch((err) => {
+				console.error(err)
+				isLoveLoading.value = false
+			})
 	}
 	const onDownloadItem = (v) => {
 		// console.log('保存', v)
@@ -56,8 +83,8 @@
 		v.loading = true
 		v.selected = false
 		const obj = {
-			url: 'http://118.31.39.42:3000/falls/1.png',
-			name: v.id + '.png'
+			url: v.tryOnUrl,
+			name: v.tryOnUrl.split('/').pop()
 		}
 		DownloadImages([obj], null, null, () => {
 			v.loading = false
@@ -74,6 +101,7 @@
 	const onBackChooseSave = () => {
 		isChooseSave.value = false
 	}
+	// 下载选中项
 	const onConfirm = () => {
 		const downloadList = []
 		if (selectCount.value > 0) {
@@ -83,8 +111,8 @@
 					v.loading = true
 					downloadList.push({
 						index: i,
-						url: 'http://118.31.39.42:3000/falls/1.png',
-						name: i + 1 + '.png'
+						url: v.tryOnUrl,
+						name: v.tryOnUrl.split('/').pop()
 					})
 				}
 			})
@@ -124,14 +152,14 @@
 		<div class="list">
 			<my-list v-model:loading="loading" v-model:finish="finish" @load="onLoad">
 				<div class="item" v-for="(v, i) in list" :key="i" @click="onItem(v)">
-					<img src="@/assets/images/workshop/posture/posture_1.png" />
+					<img :src="v.tryOnUrl" />
 					<div class="corner">
-						<div class="ai" v-if="v.isAi">Gen-AI</div>
+						<div class="ai" v-if="v.isRegenerated">Gen-AI</div>
 						<div class="tryon" v-else>Try-on</div>
 					</div>
 					<div class="icons">
 						<div @click.stop="onLoveItem(v)">
-							<SvgIcon :name="`love_${v.love ? '1' : '0'}`" size="27" />
+							<SvgIcon :name="`love_${v.isFavorite ? '1' : '0'}`" size="27" />
 						</div>
 						<div @click.stop="onDownloadItem(v)">
 							<SvgIcon name="download" size="27" v-show="!v.loading" />
@@ -146,7 +174,7 @@
 				</div>
 			</my-list>
 		</div>
-		<div class="btns" v-show="!query.date">
+		<div class="btns" v-show="!visitRecordId">
 			<template v-if="!isChooseSave">
 				<button @click="onChooseSave">Choose to Save</button>
 				<button @click="onContinue">Continue</button>
--- a/src/views/Workshop/creation/index.vue
+++ b/src/views/Workshop/creation/index.vue
@@ -7,7 +7,7 @@

 	import { useRouter } from 'vue-router'
 	const router = useRouter()
-	const detailsID = computed(() => router.currentRoute.value.query.did);
+	const styleUrl = computed(() => router.currentRoute.value.query.styleUrl);
 	const emit = defineEmits(['view-type'])
 	watch(
 		() => router.currentRoute.value,
@@ -21,8 +21,8 @@

 <template>
 	<header-title style-type="2" />
-	<creation-list v-show="!detailsID" />
-	<creation-details v-if="detailsID" />
+	<creation-list v-show="!styleUrl" />
+	<creation-details v-if="styleUrl" />
 	<footer-navigation is-placeholder />
 </template>

--- a/src/views/Workshop/customize.vue
+++ b/src/views/Workshop/customize.vue
@@ -2,7 +2,8 @@
 	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 } from 'vue'
+	import { setTryOnEffectFavorite, cancelTryOnEffectFavorite } from '@/api/workshop'
 	const emit = defineEmits(['viewType'])
 	import { useRouter } from 'vue-router'
 	const router = useRouter()
@@ -12,7 +13,7 @@
 	const loading = ref(true)
 	setTimeout(() => {
 		loading.value = false
-	}, 500);
+	}, 500)
 	const onSend = () => {
 		if (inputText.value === '') return
 		const text = inputText.value
@@ -75,7 +76,7 @@
 </template>

 <style scoped lang="less">
-	.loading{
+	.loading {
 		width: 100%;
 		margin-top: 36.6rem;
 		display: flex;
--- a/src/views/Workshop/library.vue
+++ b/src/views/Workshop/library.vue
@@ -4,7 +4,10 @@
 	import FooterNavigation from '@/components/FooterNavigation.vue'
 	import MyList from '@/components/myList.vue'
 	import router from '@/router'
+	import { FormatDate } from '@/utils/tools'
+	import { getCustomerPhotos, deleteCustomerPhoto } from '@/api/workshop'
 	const emit = defineEmits(['view-type'])
+	import { showConfirmDialog } from 'vant'

 	onMounted(() => {
 		emit('view-type', 1)
@@ -15,26 +18,50 @@

 	const onLoad = () => {
 		loading.value = true
-		setTimeout(() => {
-			for (var i = 0; i < 10; i++) {
-				list.push({
-					id: list.length + 1,
-					userID: 10000000 + list.length,
-					datetime: '7/22/2025 18:20',
-					lastopened: '18:20'
+		const customerId = '123123123'
+		getCustomerPhotos(customerId)
+			.then((data) => {
+				data?.forEach((v) => {
+					const obj = {
+						visitRecordId: v.visitRecordId,
+						defaultImageUrl: v.defaultImageUrl,
+						datetime: FormatDate(v.visitTime, 'dd-MM-yyyy HH:mm'),
+						lastopened: FormatDate(v.visitTime, 'HH:mm')
+					}
+					list.push(obj)
 				})
-			}
-			loading.value = false
-			if (list.length >= 50) finish.value = true
-		}, 500)
+				loading.value = false
+				finish.value = true
+			})
+			.catch((err) => {
+				console.error(err)
+				loading.value = false
+				finish.value = false
+			})
 	}
+	// 删除项
+	const deleteItem = async (obj: any, i: number) => {
+		const res = await showConfirmDialog({
+			title: 'Delete',
+			message: 'Are you sure you want to delete this item?',
+			confirmButtonText: 'Yes',
+			cancelButtonText: 'Cancel'
+		}).catch(() => 0)
+		if (res === 0) return
+		console.log(obj,i)
+		deleteCustomerPhoto(obj.visitRecordId)
+			.then(() => {
+				list.splice(i, 1)
+				console.log('删除成功')
+			})
+			.catch((err) => {
+				console.error(err)
+			})
+	}
+	// 详情项
 	const onDetailsItem = (v) => {
 		// console.log('检索' + i)
-		router.push({ name: 'creation', query: { date: v.datetime } })
-	}
-
-	const deleteItem = (i: number) => {
-		list.splice(i, 1)
+		router.push({ name: 'creation', query: { visitRecordId: v.visitRecordId } })
 	}
 </script>

@@ -44,9 +71,9 @@
 		<div class="title">Library</div>
 		<div class="list">
 			<my-list v-model:loading="loading" v-model:finish="finish" @load="onLoad">
-				<div class="item" v-for="(v, i) in list" :key="v.id">
+				<div class="item" v-for="(v, i) in list" :key="v.visitRecordId">
 					<div class="image">
-						<img src="@/assets/images/workshop/posture/posture_1.png" />
+						<img :src="v.defaultImageUrl" />
 					</div>
 					<div class="content">
 						<!-- <span class="userID">User ID: {{ v.userID }}</span> -->
@@ -54,7 +81,7 @@
 						<span class="lastopened">Last opened {{ v.lastopened }}</span>
 						<button @click="onDetailsItem(v)">Details</button>
 					</div>
-					<div class="delete" @click="deleteItem(i)"><SvgIcon name="delete2" size="30" /></div>
+					<div class="delete" @click="deleteItem(v, i)"><SvgIcon name="delete2" size="30" /></div>
 				</div>
 			</my-list>
 		</div>
--- a/src/views/Workshop/profile.vue
+++ b/src/views/Workshop/profile.vue
@@ -18,7 +18,9 @@
 		if (!form[item]) return
 		form[item].edit = false
 	}
-	const logout = () => {}
+	const logout = () => {
+		router.push({ path: '/' })
+	}
 </script>

 <template>
@@ -39,7 +41,7 @@
 			</svg>
 		</div>
 		<div class="profile">
-			<div class="edit"><SvgIcon name="edit" size="37" /></div>
+			<!-- <div class="edit"><SvgIcon name="edit" size="37" /></div> -->
 		</div>
 		<div class="title">Momo Fashion</div>
 		<p class="sub">Fashion Design</p>
@@ -53,12 +55,12 @@
 					v-model="form.name.value"
 					:readonly="!form.name.edit"
 				/>
-				<div class="icon" v-if="form.name.edit" @click.stop="onSaveItem('name')">
-					<SvgIcon name="confirmation" size="37" />
-				</div>
-				<div class="icon" v-else @click="onEditItem('name')">
-					<SvgIcon name="edit" size="37" />
-				</div>
+				<!-- <div class="icon" v-if="form.name.edit" @click.stop="onSaveItem('name')">
+						<SvgIcon name="confirmation" size="37" />
+					</div>
+					<div class="icon" v-else @click="onEditItem('name')">
+						<SvgIcon name="edit" size="37" />
+					</div> -->
 			</label>
 			<p class="error" v-show="form.name.msg">{{ form.name.msg }}</p>
 		</div>
@@ -73,12 +75,12 @@
 					:readonly="!form.email.edit"
 					required
 				/>
-				<div class="icon" v-if="form.email.edit" @click.stop="onSaveItem('email')">
+				<!-- <div class="icon" v-if="form.email.edit" @click.stop="onSaveItem('email')">
 					<SvgIcon name="confirmation" size="37" />
 				</div>
 				<div class="icon" v-else @click="onEditItem('email')">
 					<SvgIcon name="edit" size="37" />
-				</div>
+				</div> -->
 			</label>
 			<p class="error" v-show="form.email.msg">{{ form.email.msg }}</p>
 		</div>
@@ -94,12 +96,12 @@
 					v-model="form.password.value"
 					:readonly="!form.password.edit"
 				/>
-				<div class="icon" v-if="form.password.edit" @click.stop="onSaveItem('password')">
+				<!-- <div class="icon" v-if="form.password.edit" @click.stop="onSaveItem('password')">
 					<SvgIcon name="confirmation" size="37" />
 				</div>
 				<div class="icon" v-else @click="onEditItem('password')">
 					<SvgIcon name="edit" size="37" />
-				</div>
+				</div> -->
 			</label>
 			<p class="error" v-show="form.password.msg">{{ form.password.msg }}</p>
 		</div>
@@ -176,8 +178,16 @@
 				box-sizing: content-box;
 				display: flex;
 				align-items: center;
+				overflow: hidden;
+				padding: 0 2.5rem;
+				> * {
+					margin-right: 2.5rem;
+					&:last-child {
+						margin-right: 0;
+					}
+				}
 				> .icon {
-					margin: 0 2.5rem;
+					// margin: 0 2.5rem;
 					--svg-icon-color: #ababab;
 				}
 				> input {
--- a/src/views/Workshop/uploadFace2.vue
+++ b/src/views/Workshop/uploadFace2.vue
@@ -1,14 +1,19 @@
 <script setup lang="ts">
 	import HeaderTitle from '@/components/HeaderTitle.vue'
 	import FooterNavigation from '@/components/FooterNavigation.vue'
-	import { ref, onMounted } from 'vue'
+	import { ref, reactive, onMounted } from 'vue'
 	import { useRouter } from 'vue-router'
+	import { uploadCustomerPhoto } from '@/api/workshop'
 	const emit = defineEmits(['view-type'])
 	onMounted(() => {
 		emit('view-type', 1)
 	})
 	const router = useRouter()
-	const faceUrl = ref('')
+	const fileData = reactive({
+		url:"",
+		file: null,
+	});
+	console.log(fileData)
 	// 上传照片
 	const handleUploadFace = () => {
 		const input = document.createElement('input')
@@ -19,17 +24,28 @@
 		input.onchange = (e: any) => {
 			const file = e.target.files[0]
 			if (!file) return
-			const reader = new FileReader()
-			reader.readAsDataURL(file)
-			reader.onload = () => {
-				faceUrl.value = reader.result as string
-			}
+			const url = URL.createObjectURL(file)
+			fileData.url = url
+			fileData.file = file
+			// const reader = new FileReader()
+			// reader.readAsDataURL(file)
+			// reader.onload = () => {
+			// 	faceUrl.value = reader.result as string
+			// }
 		}
 	}
 	// 生成照片
 	const handleGenerate = () => {
 		console.log('生成照片')
-		router.push({ name: 'customize' })
+		if (!fileData.file) return
+		const formData = new FormData()
+		formData.append('customerId', "1")
+		formData.append('visitRecordId', "1")
+		formData.append('file', fileData.file)
+		uploadCustomerPhoto(formData).then(res => {
+			console.log(res)
+			// router.push({ name: 'customize' })
+		})
 	}
 </script>

@@ -44,11 +60,11 @@
 				to Try-on
 			</div>
 			<!-- 照片 -->
-			<div class="picture" v-if="faceUrl">
-				<img :src="faceUrl" />
+			<div class="picture" v-if="fileData.url">
+				<img :src="fileData.url" />
 			</div>
 			<div class="btns">
-				<template v-if="faceUrl">
+				<template v-if="fileData.url">
 					<button class="sandblasted-blurred" @click="handleUploadFace"><span>Re-try</span></button>
 					<button class="sandblasted-blurred" @click="handleGenerate"><span>Generate</span></button>
 				</template>
@@ -108,7 +124,7 @@
 					height: 79.2rem;
 					border-radius: 1rem;
 					border: 0.2rem solid #d9d9d9;
-					object-fit: contain;
+					object-fit: cover;
 				}
 			}
 			> .btns {