Merge branches 'master' and 'master' of https://gitee.com/lvYeJu/lane-crawford-3

src/assets/icons/love_1.svg

@@ -0,0 +1,3 @@
+<svg width="32" height="28" viewBox="0 0 32 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0.166748 9.04153C0.16678 7.2796 0.701271 5.55912 1.69963 4.10733C2.69798 2.65554 4.11323 1.54074 5.75846 0.910159C7.40369 0.279582 9.2015 0.162897 10.9144 0.575513C12.6274 0.98813 14.1749 1.91064 15.3525 3.22119C15.4354 3.30988 15.5357 3.38059 15.6471 3.42893C15.7585 3.47727 15.8787 3.50221 16.0001 3.50221C16.1215 3.50221 16.2416 3.47727 16.353 3.42893C16.4644 3.38059 16.5647 3.30988 16.6477 3.22119C17.8216 1.90212 19.3694 0.971859 21.0852 0.554229C22.8009 0.1366 24.6031 0.251409 26.252 0.883376C27.9008 1.51534 29.3181 2.63449 30.3152 4.09187C31.3123 5.54925 31.8418 7.27573 31.8334 9.04153C31.8334 12.6674 29.4584 15.3749 27.0834 17.7499L18.3877 26.1621C18.0927 26.501 17.729 26.7731 17.3207 26.9606C16.9123 27.148 16.4688 27.2465 16.0195 27.2493C15.5703 27.2521 15.1255 27.1594 14.7149 26.9771C14.3042 26.7948 13.937 26.5273 13.6377 26.1922L4.91675 17.7499C2.54175 15.3749 0.166748 12.6832 0.166748 9.04153Z" fill="#FF4949"/>
+</svg>

src/components/FooterNavigation.vue

@@ -22,17 +22,17 @@
 			message: 'The current page has not been saved. Do you want to return to the home page?'
 		})
 			.then(() => {
-				router.push(nav.path)
+				nav.path && router.push(nav.path)
 			})
 			.catch(() => {})
 	}
 	const navs = [
 		{ label: 'Home', icon: 'home', size: 73, path: '/welcome', on: onHome },
 		{ label: 'Library', icon: 'library', size: 53, path: '/workshop/library' },
-		{ label: 'Profile', icon: 'profile', size: 55, path: '/workshop/creation' }
+		{ label: 'Profile', icon: 'profile', size: 55, path: '' }
 	]
 	const onNavClick = (nav) => {
-		if (currentRoute.value !== nav.path) nav.on ? nav.on(nav) : router.push(nav.path)
+		if (currentRoute.value !== nav.path) nav.on ? nav.on(nav) : nav.path && router.push(nav.path)
 	}
 </script>
 

src/router/index.ts

@@ -60,12 +60,10 @@ const router = createRouter({
       name: 'Workshop',
       component: () => import('../views/Workshop/index.vue'),
       children: [
-        // {
-        // 	path: '',
-        // 	name: 'activitiesWorkshop',
-        // 	redirect: "/activities/workshop",
-        // },
-
+        {
+        	path: '/workshop',
+        	redirect: "/workshop/selectStyle",
+        },
         {
           path: '/workshop/selectStyle',
           name: 'SelectStyle',

src/views/Workshop/creation.vue

@@ -11,12 +11,11 @@
 		emit('view-type', 1)
 	})
 	const onSave = () => {
-		// console.log('保存')
-		router.push({ name: 'end' })
+		console.log('保存')
 	}
 
 	const onContinue = () => {
-		console.log('继续创建')
+		router.push({ name: 'end' })
 	}
 </script>
 
@@ -72,6 +71,7 @@
 				border-radius: 2rem;
 				background-color: #fff;
 				margin-bottom: 4rem;
+				border: 0.1rem solid #000;
 				> img {
 					width: 100%;
 					height: 100%;

src/views/Workshop/customize.vue

@@ -1,6 +1,33 @@
 <script setup lang="ts">
 	import HeaderTitle from '@/components/HeaderTitle.vue'
 	import FooterNavigation from '@/components/FooterNavigation.vue'
+	import { ref } from 'vue'
+	const emit = defineEmits(['viewType'])
+	import { useRouter } from 'vue-router'
+	const router = useRouter()
+
+	const inputText = ref('')
+	const isLoved = ref(false)
+
+	const onSend = () => {
+		if (inputText.value === '') return
+		const text = inputText.value
+		inputText.value = ''
+		console.log('发送消息:', text)
+	}
+	const onLove = () => {
+		console.log('love')
+		isLoved.value = !isLoved.value
+	}
+	const onReload = () => {
+		console.log('reload')
+	}
+	const onDownload = () => {
+		console.log('download')
+	}
+	const onContinue = () => {
+		router.push({ name: 'creation' })
+	}
 </script>
 
 <template>
@@ -10,8 +37,13 @@
 		<p class="tip">Refine your Look</p>
 		<div class="input-box">
 			<div class="help">?</div>
-			<input type="text" placeholder="Try: “Change background to Tokyo City”" />
-			<div class="send"><SvgIcon name="send" size="48" /></div>
+			<input
+				type="text"
+				v-model="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="@/assets/images/workshop/posture/posture_1.png" />
@@ -21,17 +53,17 @@
 				<div class="icon"><SvgIcon name="xialajiantou" size="29" /></div>
 			</div>
 			<div class="icons">
-				<div><SvgIcon name="love_0" size="35" /></div>
-				<div><SvgIcon name="reload" size="35" /></div>
-				<div><SvgIcon name="download" size="35" /></div>
+				<div @click="onLove"><SvgIcon :name="`love_${isLoved ? 1 : 0}`" size="35" /></div>
+				<div @click="onReload"><SvgIcon name="reload" size="35" /></div>
+				<div @click="onDownload"><SvgIcon name="download" size="35" /></div>
 			</div>
 		</div>
+		<button class="continue-btn" @click="onContinue">Continue</button>
 	</div>
 	<footer-navigation />
 </template>
 
 <style scoped lang="less">
-	
 	.customize {
 		width: 100%;
 		position: relative;
@@ -95,7 +127,7 @@
 			height: 107.4rem;
 			border-radius: 2rem;
 			// box-shadow: 1.3rem 1.4rem 2rem 0.2rem #0000004d;
-			border: 0.2rem solid #D9D9D9;
+			border: 0.2rem solid #d9d9d9;
 			overflow: hidden;
 			> * {
 				position: absolute;
@@ -143,5 +175,20 @@
 				}
 			}
 		}
+		> .continue-btn {
+			box-sizing: content-box;
+			font-family: satoshiRegular;
+			margin: 2.5rem 2.5rem 0 auto;
+			width: 35rem;
+			height: 7rem;
+			border-radius: 1.3rem;
+			background: #000;
+			font-weight: 400;
+			font-size: 4.2rem;
+			color: #fff;
+			&:active {
+				opacity: 0.7;
+			}
+		}
 	}
 </style>

src/views/Workshop/library.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-	import { ref, onMounted, inject } from 'vue'
+	import { ref, reactive, onMounted, inject } from 'vue'
 	import HeaderTitle from '@/components/HeaderTitle.vue'
 	import FooterNavigation from '@/components/FooterNavigation.vue'
 	const emit = defineEmits(['view-type'])
@@ -8,12 +8,24 @@
 		emit('view-type', 1)
 	})
 
+	const list = reactive([
+		{ id: 1, userID: '1111111111', datetime: '7/22/2025 18:20', lastopened: '18:20' },
+		{ id: 2, userID: '2222222222', datetime: '7/22/2025 18:20', lastopened: '18:20' },
+		{ id: 3, userID: '3333333333', datetime: '7/22/2025 18:20', lastopened: '18:20' },
+		{ id: 4, userID: '4444444444', datetime: '7/22/2025 18:20', lastopened: '18:20' },
+		{ id: 5, userID: '5555555555', datetime: '7/22/2025 18:20', lastopened: '18:20' },
+		{ id: 6, userID: '6666666666', datetime: '7/22/2025 18:20', lastopened: '18:20' },
+		{ id: 7, userID: '7777777777', datetime: '7/22/2025 18:20', lastopened: '18:20' },
+		{ id: 8, userID: '8888888888', datetime: '7/22/2025 18:20', lastopened: '18:20' },
+		{ id: 9, userID: '9999999999', datetime: '7/22/2025 18:20', lastopened: '18:20' },
+		{ id: 10, userID: '0000000000', datetime: '7/22/2025 18:20', lastopened: '18:20' }
+	])
 	const onRetrieveItem = (i: number) => {
 		console.log('检索' + i)
 	}
 
 	const deleteItem = (i: number) => {
-		console.log('删除' + i)
+		list.splice(i, 1)
 	}
 </script>
 
@@ -22,14 +34,14 @@
 	<div class="library">
 		<div class="title">Library</div>
 		<div class="list">
-			<div class="item" v-for="i in 10" :key="i">
+			<div class="item" v-for="(v, i) in list" :key="v.id">
 				<div class="image">
 					<img src="@/assets/images/workshop/posture/posture_1.png" />
 				</div>
 				<div class="content">
-					<span class="userID">User ID: 1234567890</span>
-					<span class="datetime">7/22/2025 18:20</span>
-					<span class="lastopened">Last opened 18:20</span>
+					<span class="userID">User ID: {{ v.userID }}</span>
+					<span class="datetime">{{ v.datetime }}</span>
+					<span class="lastopened">Last opened {{ v.lastopened }}</span>
 					<button @click="onRetrieveItem(i)">Retrieve</button>
 				</div>
 				<div class="delete" @click="deleteItem(i)"><SvgIcon name="delete2" size="30" /></div>
@@ -65,7 +77,6 @@
 			right: -40rem;
 			background: linear-gradient(88.42deg, #ffffff 32.58%, #d9d9d9 94.9%);
 			transform: rotate(-45deg);
-
 		}
 
 		> .title {