服装生成

src/api/workshop.ts

@@ -1,5 +1,35 @@
 import request from '@/utils/request'
 
+/**
+ * 生成穿搭风格
+ * @param data 生成穿搭风格数据
+ * @param data.customerId 模型照片id
+ * @param data.checkInId 顾客照片id
+ * @param data.stylist 提示词
+ * @param data.gender 原始试穿效果id
+ * @param data.num 是否重新生成 0-否，1-是
+*/
+export function generateRequestOutfit(data: Object) {
+	return request({
+		url: '/api/style/requestOutfit',
+		method: 'post',
+		data,
+	})
+}
+
+/**
+ * 获取传达风格
+ * @param data 获取传达风格数据
+ * @param data.requestIDs  获取生成结果的taskId
+*/
+export function getRequestOutfit(data: Object) {
+	return request({
+		url: '/api/style/getOutfitResult',
+		method: 'get',
+		params:data
+	})
+}
+
 /**
  * 生成试穿效果
  * @param data 试穿效果数据

src/assets/css/style.css

@@ -54,10 +54,16 @@ html:root {
   --van-dialog-confirm-button-text-color: #1B73E7;
   --van-notify-font-size: 3.5rem;
   --van-notify-line-height: 10rem;
+  --van-toast-default-width: 88rem;
+}
+.van-toast {
+  min-height: fit-content;
+  max-width: none;
 }
 .van-toast__text {
   font-size: 4rem;
   height: 5rem;
   line-height: 5rem;
   padding: 0 2rem;
+  min-height: fit-content;
 }

src/assets/css/style.less

@@ -63,7 +63,8 @@ html:root {
 	--van-dialog-confirm-button-text-color: #1B73E7;
 	//消息提示
 	--van-notify-font-size: 3.5rem;
-	--van-notify-line-height: 10rem
+	--van-notify-line-height: 10rem;
+	--van-toast-default-width: 88rem;
 }
 
 .van-toast{

src/components/selectStyle/selectItem.vue

@@ -25,9 +25,6 @@ const setLike = (item,str)=>{
 }
 
 const setSelectList = (item)=>{
-	if(item.id == props.select?.oldId){
-		return
-	}
 	emit('selectItem', item)
 }
 
@@ -51,7 +48,8 @@ const {} = toRefs(data);
 		<div class="item" v-for="(item,index) in selectList" :key="item.id">
 			<div class="title">look {{ index + 1 }}</div>
 			<div class="imgBox" @click="setSelectList(item)">
-				<img :src="item.imgUrl" alt="">
+				<img v-if="item?.path" :src="item?.path" alt="">
+				<van-loading v-else size="20rem"/>
 				<!-- <img v-for="(img,index) in item?.imgList" :key="index" :src="img" alt=""> -->
 				<div class="icon" v-if="item.id == select?.id">
 					<SvgIcon  name="modelSelected" size="60" />

src/stores/modules/generate.ts

@@ -9,6 +9,7 @@ export const useGenerateStore = defineStore({
         id: '',
         oldId: '' //表示从生成页面返回回来，需要调整的样式id
       },
+	  styleList: [{},{},{},{}],
       model: {
         id: ''
       },
@@ -81,6 +82,7 @@ export const useGenerateStore = defineStore({
       this.isGenerate = isGenerate
     },
     clearProductData() {
+	  this.styleList = [{},{},{},{}]
       this.style = {
         id: '',
         oldId: ''

src/utils/request.ts

@@ -21,7 +21,7 @@ declare module 'axios' {
 
 const service = axios.create({
   //   baseURL: import.meta.env.VITE_APP_URL, // api的base_url
-  timeout: 20000 // 请求超时时间
+  timeout: 60000 // 请求超时时间
 })
 if (import.meta.env.MODE != 'development') {
   service.defaults.baseURL = import.meta.env.VITE_APP_URL

src/views/Workshop/selectStyle.vue

@@ -3,12 +3,9 @@ import { onMounted, onUnmounted, reactive, toRefs, computed } from "vue";
 import SelectItem from "@/components/selectStyle/selectItem.vue";
 import HeaderTitle from '@/components/HeaderTitle.vue'
 import { useRouter } from 'vue-router'
-import editProfile1 from '@/assets/images/workshop/selectStyle/selectStyle1.png'
+import { useGenerateStore, useUserInfoStore } from '@/stores'
-import editProfile2 from '@/assets/images/workshop/selectStyle/selectStyle2.png'
-import editProfile3 from '@/assets/images/workshop/selectStyle/selectStyle3.png'
-import editProfile4 from '@/assets/images/workshop/selectStyle/selectStyle4.png'
-import { useGenerateStore } from '@/stores'
 import { showNotify } from 'vant';
+import { generateRequestOutfit, getRequestOutfit } from '@/api/workshop'
 const router = useRouter()
 
 //const props = defineProps({
@@ -17,43 +14,26 @@ const emit = defineEmits([
 	'view-type'
 ])
 const generateStore = useGenerateStore()
+const userInfoStore = useUserInfoStore()
 let data = reactive({
-	selectList: 
+	select:computed(()=>generateStore.style),
-	[
+	styleList:computed(()=>generateStore.styleList),
-		{
-			id:1,
-			imgUrl:editProfile1,
-		},
-		{
-			id:2,
-			imgUrl:editProfile2,
-		},
-		{
-			id:3,
-			imgUrl:editProfile3,
-		},
-		{
-			id:4,
-			imgUrl:editProfile4,
-		},
-	],
-	select:computed(()=>generateStore.style)
 })
 
 const selectItem = (item)=>{
+	if((item.id == data.select?.oldId) || !item.id || item.status != 'SUCCEEDED'){
+		return
+	}
 	generateStore.selectStyle(item)
 }
 
 const updateStyle = ({item,index})=>{
 	generateStore.updateStyle(item)
-	data.selectList[index] = {
+	data.styleList[index] = {}
-		id:9,
+	requestOutfit({num:1,index})
-		imgUrl:item.imgUrl,
-	}
 }
 
 const toProduct = ()=>{
-	console.log(generateStore.style)
 	if(!generateStore.style.id && !generateStore.style.oldId){
 		showNotify({ message: 'Please select a style.', type:'warning' });
 		return
@@ -63,14 +43,59 @@ const toProduct = ()=>{
 	}
 	router.push({ path: 'product' })
 }
+
+const requestOutfit = ({num,index})=>{
+	let value = {
+		"customerId": 1 || generateStore.customerId,
+		"checkInId": 1 || generateStore.visitRecordId,
+		"stylist": "mini",
+		"gender": userInfoStore.state.generateParams.sex,
+		num,
+	}
+	generateRequestOutfit(value).then((rv)=>{
+		let rvIndex = 0
+		data.styleList.forEach((item,styleIndex)=>{
+			if(styleIndex < index)return
+			item.taskId = rv[rvIndex]
+			rvIndex++
+		})
+		getRequestOutfitList(rv)
+	})
+}
+
+const getRequestOutfitList = (generateList)=>{
+	let value = {requestIDs:generateList.join(',')}
+	getRequestOutfit(value).then((rv:any)=>{
+		let pendingList = []
+		rv.forEach((item)=>{
+			if(['RUNNING','PENDING'].includes(item.status))pendingList.push(item.requestId)
+			let index = data.styleList.findIndex((styleItem)=>styleItem.taskId == item.requestId)
+			console.log(index,data.styleList,rv)
+			if(index != -1){
+				data.styleList[index].id = item.id
+				data.styleList[index].path = item.path
+				data.styleList[index].status = item.status
+			}
+		})
+
+		if(pendingList.length > 0){
+			setTimeout(()=>{
+				getRequestOutfitList(pendingList)
+			},3000)
+		}
+	})
+}
+
 onMounted(()=>{
+	// generateStore.clearProductData()
 	emit('view-type', 1)
-	
+	// if(!data.styleList[0]?.id)getRequestOutfitList(0)
+	if(!data.styleList[0]?.id)requestOutfit({num:4,index:0})
 })
 onUnmounted(()=>{
 })
 defineExpose({})
-const { selectList, select } = toRefs(data);
+const { styleList, select } = toRefs(data);
 </script>
 <template>
 	<header-title style-type="2" />
@@ -84,7 +109,7 @@ const { selectList, select } = toRefs(data);
 			</div>
 		</div>
 		<div class="selectContent">
-			<SelectItem :selectList="selectList" v-model:select="select" @selectItem="selectItem" @updateStyle="updateStyle" />
+			<SelectItem :selectList="styleList" v-model:select="select" @selectItem="selectItem" @updateStyle="updateStyle" />
 		</div>
 	</div>
 	<div class="footer placeholder"></div>