From 7cbeaab5b0a505af4c1a331b5904790b0f891307 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9D=8E=E5=BF=97=E9=B9=8F?= <2916022834@qq.com>
Date: Mon, 17 Nov 2025 11:24:46 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E6=B7=BB=E5=8A=A0=E5=A4=B4?=
 =?UTF-8?q?=E9=83=A8=E5=BA=95=E9=83=A8=E6=A0=87=E7=AD=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/HeaderTitle.vue            |  6 +++++-
 src/components/selectStyle/selectItem.vue | 10 +++++-----
 src/views/Workshop/selectStyle.vue        | 12 +++++++-----
 src/views/asistant/index.vue              |  2 +-
 src/views/stylist/dressfor.vue            | 10 +++++++---
 src/views/stylist/index.vue               |  9 +++++++--
 src/views/stylist/sex.vue                 |  8 ++++++--
 7 files changed, 38 insertions(+), 19 deletions(-)

diff --git a/src/components/HeaderTitle.vue b/src/components/HeaderTitle.vue
index 6d44400..7170e9c 100644
--- a/src/components/HeaderTitle.vue
+++ b/src/components/HeaderTitle.vue
@@ -5,7 +5,7 @@
 	defineProps({
 		title: { type: String, default: 'AI STYLING ASSISTANT' },
 		hasSetting: { type: Boolean, default: false },
-		styleType: { type: String, default: '1' },//1低 2高
+		styleType: { type: String, default: '1' },//1低 2高 3-12rem
 		isPlaceholder: { type: Boolean, default: true },
 	})
 
@@ -36,6 +36,10 @@
 			--header-title-border-bottom-width: 0.2rem;
 			--header-title-return-left: 7.8rem;
 		}
+		&[style-type="3"] {
+			--header-title-height: 12rem;
+			--header-title-border-bottom-width: 0.2rem;
+		}
 		> div {
 			width: 100%;
 			height: var(--header-title-height, 9.9rem);
diff --git a/src/components/selectStyle/selectItem.vue b/src/components/selectStyle/selectItem.vue
index 1b44ac1..e8dccd0 100644
--- a/src/components/selectStyle/selectItem.vue
+++ b/src/components/selectStyle/selectItem.vue
@@ -88,11 +88,11 @@ const {} = toRefs(data);
 		> .item{
 			width: calc(50% - 3.1rem / 2);
 			position: relative;
-			margin-bottom: 3.3rem;
+			// margin-bottom: 3.3rem;
 			display: flex;
 			flex-direction: column;
 			> .title{
-				font-size: 3.6rem;
+				font-size: 3.44rem;
 				font-weight: 700;
 				color: #000;
 				font-family: 'satoshiMedium';
@@ -102,7 +102,7 @@ const {} = toRefs(data);
 				justify-content: space-between;
 				align-items: center;
 				flex-wrap: wrap;
-				height: 47.2rem;
+				height: 45rem;
 				margin: 2.4rem 0;
 				background-color: #fff;
 				justify-content: center;
@@ -148,8 +148,8 @@ const {} = toRefs(data);
 					color: #000;
 					margin-right: 1.2rem;
 					border-radius: 50%;
-					width: 6.6rem;
-					height: 6.6rem;
+					width: 5.2rem;
+					height: 5.2rem;
 					padding: 1rem;
 					background-color: #fff;
 					&:last-child{
diff --git a/src/views/Workshop/selectStyle.vue b/src/views/Workshop/selectStyle.vue
index 834325f..05315e0 100644
--- a/src/views/Workshop/selectStyle.vue
+++ b/src/views/Workshop/selectStyle.vue
@@ -2,6 +2,7 @@
 import { onMounted, onUnmounted, reactive, toRefs, computed, onActivated } from "vue";
 import SelectItem from "@/components/selectStyle/selectItem.vue";
 import HeaderTitle from '@/components/HeaderTitle.vue'
+import FooterNavigation from '@/components/FooterNavigation.vue'
 import { useRouter } from 'vue-router'
 import { useGenerateStore, useUserInfoStore } from '@/stores'
 import { showToast } from 'vant';
@@ -122,14 +123,15 @@ const { styleList, select } = toRefs(data);
 			<SelectItem :selectList="styleList" v-model:select="select" @selectItem="selectItem" @updateStyle="updateStyle" />
 		</div>
 	</div>
-	<div class="footer placeholder"></div>
+	<!-- <div class="footer placeholder"></div> -->
 	<div class="footer">
 		<button @click.stop="toProduct">Continue</button>
 	</div>
+	<footer-navigation is-placeholder />
 </template>
 <style lang="less" scoped>
 	.header-title {
-		--header-title-background: #f6f6f6;
+		// --header-title-background: #f6f6f6;
 	}
 	.selectStyle{
 		width: 100%;
@@ -144,7 +146,7 @@ const { styleList, select } = toRefs(data);
 			text-align: center;
 			width: 100%;
 			margin-top: 3.4rem;
-			margin-bottom: 7.2rem;
+			margin-bottom: 4.9rem;
 			> .title{
 				font-family: satoshiBold;
 				font-weight: 700;
@@ -159,13 +161,13 @@ const { styleList, select } = toRefs(data);
 			}
 		}
 		.selectContent{
-			padding: 0 3.5rem;
+			padding: 0 4rem;
 			flex: 1;
 			overflow: auto;
 		}
 	}
 	.footer {
-		position: fixed;
+		// position: fixed;
 		width: 100%;
 		bottom: 0;
 		left: 0;
diff --git a/src/views/asistant/index.vue b/src/views/asistant/index.vue
index 1852cb3..5ac71e4 100644
--- a/src/views/asistant/index.vue
+++ b/src/views/asistant/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="asistant-container flex flex-column">
     <div class="header">
-      <HeaderTitle hasSetting styleType="2" />
+      <HeaderTitle hasSetting styleType="3" />
     </div>
     <div class="loading-container" v-if="isLoading">
       <GenerateLoading />
diff --git a/src/views/stylist/dressfor.vue b/src/views/stylist/dressfor.vue
index 2b6de21..71161a2 100644
--- a/src/views/stylist/dressfor.vue
+++ b/src/views/stylist/dressfor.vue
@@ -1,16 +1,20 @@
 <template>
+  <header-title style-type="3" />
   <div class="dressfor-container flex">
     <div class="content flex-1 flex flex-column">
-      <div class="setting flex flex-between">
+      <!-- <div class="setting flex flex-between">
         <van-icon name="arrow-left" color="#fff" @click="handleBack" />
         <SvgIcon name="setting" size="70" />
-      </div>
+      </div> -->
       <div class="text">What are you dressing for?</div>
       <div class="start-btn" @click="handleStart">Start</div>
     </div>
   </div>
+  <footer-navigation />
 </template>
 <script setup lang="ts">
+import HeaderTitle from '@/components/HeaderTitle.vue'
+import FooterNavigation from '@/components/FooterNavigation.vue'
 import { useRouter } from 'vue-router'
 const router = useRouter()
 
@@ -25,7 +29,7 @@ const handleStart = () => {
 </script>
 <style lang="less" scoped>
 .dressfor-container {
-  height: 100vh;
+  height: calc(100vh - 12rem - 14.9rem);
   overflow: hidden;
   color: #fff;
   position: relative;
diff --git a/src/views/stylist/index.vue b/src/views/stylist/index.vue
index d9f0b07..4b6f030 100644
--- a/src/views/stylist/index.vue
+++ b/src/views/stylist/index.vue
@@ -1,4 +1,5 @@
 <template>
+  <header-title style-type="3" />
   <div class="stylist-page">
     <!-- 主要内容区域 -->
     <div class="content">
@@ -48,6 +49,7 @@
       <Video ref="videoRef" />
     </van-dialog>
   </div>
+  <footer-navigation />
 </template>
 
 <script setup lang="ts">
@@ -57,6 +59,8 @@ import Video from './components/Video.vue'
 import { useUserInfoStore } from '@/stores'
 import male from '@/assets/images/male.png'
 import female from '@/assets/images/female.png'
+import HeaderTitle from '@/components/HeaderTitle.vue'
+import FooterNavigation from '@/components/FooterNavigation.vue'
 
 const router = useRouter()
 const userInfoStore = useUserInfoStore()
@@ -111,7 +115,7 @@ const handleChangeSwiper = (type: 'next' | 'prev') => {
 
 const handleClickStylist = (item: any) => {
   console.log(item)
-  showVideo.value = true
+//   showVideo.value = true
 }
 
 const handleContinue = () => {
@@ -136,7 +140,7 @@ watch(showVideo, (newValue) => {
 .stylist-page {
   position: relative;
   width: 100%;
-  height: 100vh;
+  height: calc(100vh - 12rem - 14.9rem);
   overflow: hidden;
   display: flex;
   flex-direction: column;
@@ -165,6 +169,7 @@ watch(showVideo, (newValue) => {
     font-weight: 400;
     color: white;
     font-family: 'boskaRegular';
+    line-height: 96%;
   }
 }
 
diff --git a/src/views/stylist/sex.vue b/src/views/stylist/sex.vue
index 1dbd23e..b8b18b3 100644
--- a/src/views/stylist/sex.vue
+++ b/src/views/stylist/sex.vue
@@ -1,4 +1,5 @@
 <template>
+  <header-title style-type="3" />
   <div class="sex-select">
     <div class="text">Before we begin.</div>
     <div class="desc">Who are you styling?</div>
@@ -14,8 +15,11 @@
       </div>
     </div>
   </div>
+  <footer-navigation />
 </template>
 <script setup lang="ts">
+import HeaderTitle from '@/components/HeaderTitle.vue'
+import FooterNavigation from '@/components/FooterNavigation.vue'
 import { ref } from 'vue'
 import { useRouter } from 'vue-router'
 import {useUserInfoStore} from '@/stores'
@@ -36,7 +40,7 @@ const handleSelect = (value: string) => {
 </script>
 <style lang="less" scoped>
 .sex-select {
-  height: 100vh;
+  height: calc(100vh - 12rem - 14.9rem);
   overflow: hidden;
   color: #fff;
   position: relative;
@@ -58,7 +62,7 @@ const handleSelect = (value: string) => {
   .select-list {
     display: flex;
     position: absolute;
-    bottom: 31.6rem;
+    bottom: 15.7rem;
     width: calc(100% - 12.4rem - 8.5rem);
     display: flex;
     justify-content: space-between;