新增home页面

src/api/workshop.ts

@@ -149,4 +149,20 @@ interface AIConversation {
 	sessionId: string | number //用户ID
 	gender: 'male' | 'female' //性别
 }
-export const streamChatAddress = '/api/llm/streamChat'
+export const streamChatAddress = '/api/llm/streamChat'
+
+/**
+ * 添加试穿效果意见和建议
+ * @param data 添加试穿效果意见和建议数据
+ * @param data.tryOnEffectsId 试穿效果id
+ * @param data.visitRecordId 进店记录id
+ * @param data.customerId 顾客id
+ * @param data.suggestion 意见和建议
+*/
+export function addTryOnEffectComment(data: Object) {
+	return request({
+		url: '/api/try-on-effects/add-comment',
+		method: 'post',
+		data,
+	})
+}

src/assets/icons/close.svg

@@ -0,0 +1,17 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="200.000000pt" height="200.000000pt" viewBox="0 0 200.000000 200.000000"
+ preserveAspectRatio="xMidYMid meet">
+
+<g transform="translate(0.000000,200.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M412 1587 c-27 -28 -32 -40 -32 -82 l0 -49 227 -228 228 -228 -218
+-218 c-120 -120 -222 -224 -227 -232 -6 -8 -10 -35 -10 -58 0 -37 6 -50 35
+-79 33 -33 39 -35 86 -31 l51 5 224 224 224 224 228 -228 228 -227 48 0 c41 0
+53 5 82 34 29 29 34 41 34 82 l0 48 -227 228 -228 228 224 224 224 224 5 51
+c4 47 2 53 -31 86 -30 30 -41 35 -83 35 l-48 0 -228 -227 -228 -227 -228 227
+-228 227 -50 0 c-44 0 -54 -4 -82 -33z"/>
+</g>
+</svg>

src/assets/icons/pen.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1763086634862" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4594" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M935.393882 172.092235l-84.510117-84.570353c-34.032941-34.093176-93.665882-34.093176-127.819294 0l-545.551059 545.611294-103.725177 318.524236 316.114824-106.315294 545.430588-545.490824a90.352941 90.352941 0 0 0 0.060235-127.759059zM186.368 800.768l38.851765-119.205647 116.495059 116.555294-118.241883 39.755294-37.104941-37.104941z m75.956706-167.213176l330.87247-330.872471 127.156706 127.096471-330.932706 330.932705-127.09647-127.156705z m373.458823-373.519059l43.91153-43.91153 127.156706 127.096471-43.91153 43.911529-127.156706-127.09647z m257.024-2.770824l-43.369411 43.369412-127.156706-127.096471 43.369412-43.429647a30.840471 30.840471 0 0 1 42.586352 0l84.510118 84.570353a30.117647 30.117647 0 0 1 0.060235 42.586353z" p-id="4595"></path></svg>

src/router/index.ts

@@ -61,6 +61,11 @@ const router = createRouter({
       name: 'WelcomePage',
       component: () => import('@/views/login/WelcomePage.vue')
     },
+	{
+		path: '/homeNav',
+		name: 'HomeNav',
+		component: () => import('@/views/Workshop/home.vue')
+	  },
     {
       path: '/stylist',
       name: 'StylistPage',

src/stores/modules/generate.ts

@@ -58,6 +58,8 @@ export const useGenerateStore = defineStore({
     styleId: (state) => state.style.id || state.style.oldId,
     /** 模特照片id */
     modelPhotoId: (state) => state.model.id,
+	/** 原始试穿id不包含魔改id */
+    originalTryOnIdNoRein: (state) => state.originalTryOn.id,
     /** 原始试穿id-优先AI魔改 */
     originalTryOnId: (state) => state.customizeInfo.tryOnId || state.originalTryOn.id,
     /** 顾客照片id */

src/views/Workshop/home.vue

@@ -0,0 +1,99 @@
+<script setup lang="ts">
+import { onMounted, onUnmounted, reactive, toRefs, computed, onActivated } from "vue";
+import HeaderTitle from '@/components/HeaderTitle.vue'
+import FooterNavigation from '@/components/FooterNavigation.vue'
+import { useRouter } from 'vue-router'
+const router = useRouter()
+
+//const props = defineProps({
+//})
+const emit = defineEmits([
+	'view-type'
+])
+
+// const data = reactive({
+// })
+
+onMounted(()=>{
+	emit('view-type', 1)
+})
+onUnmounted(()=>{
+})
+defineExpose({})
+// const {  } = toRefs(data);
+</script>
+<template>
+	<header-title style-type="2" />
+	<div class="homeNavPage">
+		<div class="title">
+			Welcome Back,
+			What can I help you today?
+		</div>
+		<div class="navBox">
+			<div class="navTitle">
+				Explore
+			</div>
+			<div class="navList">
+				<div class="item" @click="()=>router.push('/stylist/index')">
+					<img src="@/assets/images/nav1.png" alt="">
+				</div>
+				<div class="item" @click="()=>router.push('/workshop/uploadFace')">
+					<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')">
+					<img src="@/assets/images/nav4.png" alt="">
+				</div>
+			</div>
+		</div>
+	</div>
+	<footer-navigation />
+</template>
+<style lang="less" scoped>
+	.header-title {
+		--header-title-background: #fff;
+		--header-title-height: 12rem !important;
+	}
+	.homeNavPage{
+		> .title{
+			padding: 0 8.4rem;
+			font-family: satoshiBold;
+			font-weight: 700;
+			margin-top: 6.8rem;
+			font-size: 9.6rem;
+			line-height: 124%;
+			background: radial-gradient(99.56% 47.68% at 99.56% 93.08%, #E6E6E6 0%, #443E37 100%) /* warning: gradient uses a rotation that is not supported by CSS and may not behave as expected */,
+			linear-gradient(120.09deg, #B3B3B3 0%, rgba(255, 255, 255, 0) 35.41%);
+			-webkit-background-clip: text;
+			-webkit-text-fill-color: transparent;
+			color: transparent; /* 文字本身透明，显示渐变背景 */
+			background-clip: text;
+		}
+		> .navBox{
+			> .navTitle{
+				padding: 0 8.4rem;
+				font-family: satoshiBold;
+				font-weight: 700;
+				font-size: 5.2rem;
+				margin: 6.3rem 0;
+			}
+			> .navList{
+				display: flex;
+				flex-wrap: wrap;
+				padding: 0 7.4rem;
+				gap: 4.8rem;
+				> .item{
+					width: 44.2rem;
+					height: 41.6rem;
+					> img{
+						width: 100%;
+						height: 100%;
+						object-fit: cover;
+					}
+				}
+			}
+		}
+	}
+</style>

src/views/Workshop/product.vue

@@ -1,11 +1,11 @@
 <script setup lang="ts">
-import { onMounted, onUnmounted, reactive, toRefs } from "vue";
+import { onMounted, onUnmounted, reactive, ref, toRefs } from "vue";
 import HeaderTitle from '@/components/HeaderTitle.vue'
 import FooterNavigation from '@/components/FooterNavigation.vue'
 import { useRouter, useRoute } from 'vue-router'
 import GenerateLoading from '@/views/asistant/components/GenerateLoading.vue'
 import { useGenerateStore } from '@/stores'
-import { generateTryOnEffect, setTryOnEffectFavorite, cancelTryOnEffectFavorite } from '@/api/workshop'
+import { generateTryOnEffect, setTryOnEffectFavorite, cancelTryOnEffectFavorite, addTryOnEffectComment  } from '@/api/workshop'
 const router = useRouter()
 //const props = defineProps({
 //})
@@ -20,6 +20,12 @@ let data = reactive({
 
 const generateStore = useGenerateStore()
 
+const vanDialogShow = ref(false)
+const feedbackForm = ref({
+	text:'',
+	state:1,//是否提交状态
+})
+
 // const setSelectedModelId = (item)=>{
 // 	data.selectedModelId = item.id;
 // }
@@ -79,6 +85,33 @@ const setLike = ()=>{
 	}
 }
 
+const feedback = ()=>{
+	vanDialogShow.value = true
+}
+
+const closeFeedback = ()=>{
+	vanDialogShow.value = false
+	feedbackForm.value.text = ''
+	feedbackForm.value.state = 1
+}
+
+const handleSubmit = ()=>{
+	if(feedbackForm.value.state == 1){
+		let value = {
+			tryOnEffectsId:generateStore.originalTryOnIdNoRein,
+			visitRecordId:generateStore.visitRecordId,
+			customerId:generateStore.customerId,
+			suggestion:feedbackForm.value.text,
+		}
+		addTryOnEffectComment(value).then(()=>{
+			feedbackForm.value.state = 2
+		})
+	}else{
+		closeFeedback()
+	}
+	
+}
+
 onMounted(() => {
 	emit('view-type', 1)
 	if (generateStore.isGenerate) {
@@ -110,6 +143,7 @@ const { isLoading } = toRefs(data);
 					<img :src="generateStore.originalTryOn.tryOnUrl" />
 					<div class="operation">
 						<div @click="setLike"><SvgIcon :name="`love_${generateStore.originalTryOn.isLike ? '1' : '0'}`" size="35" /></div>
+						<div @click="feedback"><SvgIcon name="pen" size="40" /></div>
 						<div @click="startGenerate"><SvgIcon name="reload" size="35" /></div>
 						<!-- <div><SvgIcon name="download" size="35" /></div> -->
 					</div>
@@ -122,6 +156,28 @@ const { isLoading } = toRefs(data);
 		</div>
 	</div>
 	<footer-navigation is-placeholder v-if="!isLoading"/>
+	<van-dialog v-model:show="vanDialogShow" :show-confirm-button="false" width="52.8rem">
+		<div class="feedback">
+			<div class="feedbackClose" @click="closeFeedback"><SvgIcon name="close" size="40" /></div>
+			<div class="succeedIcon" v-if="feedbackForm.state == 2">
+				<img src="@/assets/images/workshop/succeed.png" />
+			</div>
+			<div class="content" state='1' v-if="feedbackForm.state == 1">
+				<div class="title">User Feedback</div>
+				<div class="info">Do you have any suggestions<br /> for this outfit? </div>
+			</div>
+			<div class="content" state='2' v-else>
+				<div class="title">Congratulation!</div>
+				<div class="info">Your feedback will be very<br /> helpful to us.</div>
+			</div>
+			<div class="feedbackForm" v-if="feedbackForm.state == 1">
+				<textarea v-model="feedbackForm.text" placeholder="Please enter your feedback" />
+			</div>
+			<div class="submit" @click="handleSubmit">
+				Confirm
+			</div>
+		</div>
+	</van-dialog>
 	<div class="loading-container" v-if="isLoading">
 		<GenerateLoading title="Generating Results..." />
 	</div>
@@ -229,4 +285,75 @@ const { isLoading } = toRefs(data);
 		justify-content: center;
 		background-color: #fff;
 	}
+	.feedback{
+		position: relative;
+		border-radius: 3rem;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		> .succeedIcon{
+			width: 12.8rem;
+			height: 12.8rem;
+			> img{
+				width: 100%;
+				height: 100%;
+				object-fit: contain;
+				display: block;
+			}
+		}
+		> .feedbackClose{
+			position: absolute;
+			top: 3.5rem;
+			right: 3rem;
+		}
+		> .content{
+			padding-top: 5.8rem;
+			text-align: center;
+			margin-bottom: 3.7rem;
+			&.content[data-state='2']{
+				margin-top: 5.2rem;
+				margin-bottom: 5.8rem;
+			}
+			> .title{
+				font-family: satoshiBold;
+				font-size: 4rem;
+				font-weight: 700;
+				line-height: 2rem;
+				margin-bottom: 1.8rem;
+			}
+			> .info{
+				font-size: 3.2rem;
+				line-height: 4.4rem;
+				font-weight: 400;
+			}
+		}
+		> .feedbackForm{
+			margin-bottom: 5.1rem;
+			> textarea{
+				width: 43.1rem;
+				height: 29.4rem;
+				border-radius: 2.7rem;
+				background: linear-gradient(0deg, #FFFFFF, #FFFFFF),
+				linear-gradient(0deg, #F4F4F4, #F4F4F4);
+				border: .274rem solid;
+				border-image-source: radial-gradient(80.79% 50% at 50% 50%, #EFAC85 0%, rgba(255, 255, 255, 0) 100%),
+				radial-gradient(99.56% 93.08% at 99.56% 93.08%, #E6E6E6 0%, #443E37 100%) /* warning: gradient uses a rotation that is not supported by CSS and may not behave as expected */,
+				linear-gradient(120.09deg, #B3B3B3 0%, rgba(255, 255, 255, 0) 35.41%);
+				box-shadow: 0px 1.1rem 1rem 0px #0000001A;
+				padding: 2.4rem 2.1rem;
+			}
+		}
+		> .submit{
+			width: 26.8rem;
+			line-height: 6.4rem;
+			border-radius: 1.5rem;
+			background-color: #000;
+			color: #fff;
+			border: 1.54px solid #000000;
+			font-size: 3.2rem;
+			text-align: center;
+			font-weight: 500;
+			margin: 0 auto 3.6rem;
+		}
+	}
 </style>