From dfdf2400c1a51b4d6b377dbb2eb030b1854dabba Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C2=B4=C3=B3=C2=B8=C3=A7?= <zpli@aidlab.hk>
Date: Thu, 26 Feb 2026 16:55:25 +0800
Subject: [PATCH] =?UTF-8?q?=E7=99=BB=E5=BD=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/login.ts                              |  26 ++-
 src/assets/icons/chat-compose.svg             |   3 +
 src/assets/icons/download.svg                 |   3 +
 src/assets/icons/edit.svg                     |   3 +
 src/assets/icons/expand-lg.svg                |   3 +
 src/components/Canvas/CanvasTest.vue          |   4 +-
 .../FlowCanvas/components/cards/index.vue     |   1 +
 .../components/cards/scene-composition.vue    |   2 +
 .../components/cards/to-real-style.vue        |   2 +
 .../components/result/result-image.vue        | 207 ++++++++++++++++--
 .../tools/pixel-ratio-selection.vue           |   2 +
 .../Canvas/FlowCanvas/flow-canvas.vue         |  32 +--
 .../Canvas/FlowCanvas/manager/NodeManager.ts  |  11 +
 src/stores/userInfo.ts                        |  14 +-
 src/utils/request.ts                          |  13 +-
 src/views/home/index.vue                      |   6 +-
 src/views/login/retrieve-password.vue         |  10 +-
 17 files changed, 287 insertions(+), 55 deletions(-)
 create mode 100644 src/assets/icons/chat-compose.svg
 create mode 100644 src/assets/icons/download.svg
 create mode 100644 src/assets/icons/edit.svg
 create mode 100644 src/assets/icons/expand-lg.svg
 create mode 100644 src/components/Canvas/FlowCanvas/manager/NodeManager.ts

diff --git a/src/api/login.ts b/src/api/login.ts
index 9669560..3ce467f 100644
--- a/src/api/login.ts
+++ b/src/api/login.ts
@@ -51,11 +51,23 @@ export const Login = (data) => {
 		data
 	})
 }
+/**
+ * 退出登录
+ * @returns 退出登录成功的响应
+*/
+export const Logout = () => {
+	return request({
+		url: '/api/user/logout',
+		method: 'post',
+		loading: true,
+	})
+}
+
 /**
  * 忘记密码
  * @param data 忘记密码的参数
  * @param data.email 邮箱
- * @param data.password 密码
+ * @param data.newPassword 新密码
  * @param data.verificationCode 验证码
  * @returns 忘记密码成功后的token
 */
@@ -67,3 +79,15 @@ export const ForgetPassword = (data) => {
 		data
 	})
 }
+
+/**
+ * 获取用户信息
+ * @returns 用户信息
+*/
+export const GetUserInfo = () => {
+	return request({
+		url: '/api/user/info',
+		method: 'get',
+		loading: true,
+	})
+}
diff --git a/src/assets/icons/chat-compose.svg b/src/assets/icons/chat-compose.svg
new file mode 100644
index 0000000..c26df55
--- /dev/null
+++ b/src/assets/icons/chat-compose.svg
@@ -0,0 +1,3 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11 4.12435C6.89985 4.12435 3.66668 7.25105 3.66668 10.9993C3.66668 12.5538 4.21631 13.9904 5.15201 15.1476C5.32101 15.3566 5.38976 15.6293 5.34006 15.8935C5.25185 16.3623 5.13642 16.8205 5.00196 17.2694C5.57996 17.1805 6.14056 17.0583 6.69012 16.9023C6.91863 16.8374 7.1634 16.8637 7.37287 16.9757C8.44001 17.5465 9.67693 17.8743 11 17.8743C15.1002 17.8743 18.3333 14.7476 18.3333 10.9993C18.3333 7.25105 15.1002 4.12435 11 4.12435ZM1.83334 10.9993C1.83334 6.14121 5.98747 2.29102 11 2.29102C16.0126 2.29102 20.1667 6.14121 20.1667 10.9993C20.1667 15.8575 16.0126 19.7077 11 19.7077C9.50527 19.7077 8.09045 19.3673 6.83964 18.7612C5.83658 19.0209 4.80546 19.1809 3.72309 19.2476C3.41176 19.2668 3.11203 19.1264 2.92754 18.8749C2.74304 18.6233 2.69911 18.2953 2.81094 18.0041C3.07692 17.3114 3.30038 16.632 3.45627 15.9484C2.43553 14.5464 1.83334 12.8407 1.83334 10.9993ZM11 7.33268C11.5063 7.33268 11.9167 7.74309 11.9167 8.24935V10.0827H13.75C14.2563 10.0827 14.6667 10.4931 14.6667 10.9993C14.6667 11.5056 14.2563 11.916 13.75 11.916H11.9167V13.7493C11.9167 14.2556 11.5063 14.666 11 14.666C10.4937 14.666 10.0833 14.2556 10.0833 13.7493V11.916H8.25001C7.74375 11.916 7.33334 11.5056 7.33334 10.9993C7.33334 10.4931 7.74375 10.0827 8.25001 10.0827H10.0833V8.24935C10.0833 7.74309 10.4937 7.33268 11 7.33268Z" fill="#0D0D0D"/>
+</svg>
diff --git a/src/assets/icons/download.svg b/src/assets/icons/download.svg
new file mode 100644
index 0000000..ec2a1ae
--- /dev/null
+++ b/src/assets/icons/download.svg
@@ -0,0 +1,3 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11 2.75C11.5063 2.75 11.9167 3.16041 11.9167 3.66667V11.537L14.0185 9.43515C14.3765 9.07717 14.9569 9.07717 15.3148 9.43515C15.6728 9.79313 15.6728 10.3735 15.3148 10.7315L11.6482 14.3982C11.2902 14.7562 10.7098 14.7562 10.3518 14.3982L6.68515 10.7315C6.32717 10.3735 6.32717 9.79313 6.68515 9.43515C7.04313 9.07717 7.62354 9.07717 7.98152 9.43515L10.0833 11.537V3.66667C10.0833 3.16041 10.4937 2.75 11 2.75ZM3.66667 12.8333C4.17293 12.8333 4.58333 13.2437 4.58333 13.75V13.9333C4.58333 14.7185 4.58405 15.2523 4.61776 15.6649C4.65059 16.0668 4.71011 16.2723 4.78316 16.4156C4.95892 16.7606 5.23939 17.0411 5.58435 17.2168C5.72772 17.2899 5.93324 17.3494 6.33512 17.3822C6.7477 17.416 7.28147 17.4167 8.06667 17.4167H13.9333C14.7185 17.4167 15.2523 17.416 15.6649 17.3822C16.0668 17.3494 16.2723 17.2899 16.4157 17.2168C16.7606 17.0411 17.0411 16.7606 17.2168 16.4156C17.2899 16.2723 17.3494 16.0668 17.3822 15.6649C17.416 15.2523 17.4167 14.7185 17.4167 13.9333V13.75C17.4167 13.2437 17.8271 12.8333 18.3333 12.8333C18.8396 12.8333 19.25 13.2437 19.25 13.75V13.9712C19.25 14.7091 19.25 15.3181 19.2095 15.8142C19.1674 16.3294 19.077 16.8031 18.8504 17.248C18.4988 17.9379 17.9379 18.4988 17.248 18.8504C16.8031 19.077 16.3294 19.1674 15.8142 19.2095C15.3181 19.25 14.7091 19.25 13.9712 19.25H8.02879C7.29091 19.25 6.68192 19.25 6.18583 19.2095C5.67057 19.1674 5.19693 19.077 4.75204 18.8504C4.06211 18.4988 3.50118 17.9379 3.14964 17.248C2.92296 16.8031 2.83261 16.3294 2.79051 15.8142C2.74998 15.3181 2.74999 14.7091 2.75 13.9712L2.75 13.75C2.75 13.2437 3.16041 12.8333 3.66667 12.8333Z" fill="#0D0D0D"/>
+</svg>
diff --git a/src/assets/icons/edit.svg b/src/assets/icons/edit.svg
new file mode 100644
index 0000000..5cacda0
--- /dev/null
+++ b/src/assets/icons/edit.svg
@@ -0,0 +1,3 @@
+<svg width="13" height="13" viewBox="0 0 13 13" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.1649 0.155168C10.723 -0.134032 11.3833 -0.00367713 11.8061 0.419151C12.2289 0.841978 12.3593 1.50221 12.0701 2.06038C11.5338 3.09547 10.8978 4.00216 10.1326 4.81731C10.9019 5.77405 11.4801 6.76515 11.7244 7.69781C12.009 8.78477 11.8494 9.88058 10.9066 10.6349C10.1493 11.2407 9.29831 11.1589 8.6187 10.8782C7.95721 10.6049 7.3705 10.1162 6.96776 9.72721C6.71948 9.4874 6.71262 9.09173 6.95243 8.84346C7.19223 8.59518 7.5879 8.58832 7.83618 8.82812C8.19892 9.17849 8.65091 9.53905 9.09594 9.72288C9.52286 9.89923 9.84622 9.88235 10.1257 9.65877C10.5668 9.30589 10.7173 8.78646 10.5151 8.01447C10.3371 7.33444 9.8941 6.53238 9.22753 5.68733C8.86461 6.00298 8.47701 6.30491 8.06253 6.59586C8.04414 6.60877 8.02529 6.62055 8.00607 6.63121C7.96733 7.08576 7.81441 7.47472 7.54518 7.78473C7.23869 8.13764 6.83454 8.32682 6.44831 8.43208C5.83262 8.59987 5.09565 8.58913 4.55791 8.5813C4.45442 8.57979 4.35831 8.57839 4.27186 8.57839C3.92669 8.57839 3.64686 8.29857 3.64686 7.95339C3.64686 7.86694 3.64546 7.77083 3.64395 7.66735C3.63612 7.1296 3.62538 6.39263 3.79317 5.77695C3.89843 5.39071 4.08761 4.98656 4.44052 4.68007C4.75053 4.41084 5.13949 4.25792 5.59404 4.21918C5.6047 4.19996 5.61648 4.18111 5.62939 4.16272C5.87785 3.80878 6.13431 3.47444 6.40048 3.15833C4.59392 2.16678 2.85671 2.24786 1.9557 3.14887C1.35085 3.75372 1.11197 4.70856 1.3265 5.85269C1.54035 6.99326 2.19958 8.25411 3.28152 9.33605C3.92029 9.97482 4.61048 10.4209 5.17503 10.7059C5.45699 10.8483 5.70245 10.9478 5.888 11.0103C6.02692 11.0571 6.10652 11.0743 6.13574 11.0807C6.15121 11.084 6.15256 11.0843 6.14112 11.0843C6.4863 11.0843 6.76612 11.3642 6.76611 11.7093C6.7661 12.0545 6.48628 12.3343 6.1411 12.3343C5.95181 12.3343 5.70814 12.2687 5.48898 12.1949C5.24295 12.112 4.94266 11.9889 4.61169 11.8218C3.95039 11.4879 3.14606 10.9684 2.39764 10.2199C1.16084 8.98314 0.363905 7.50171 0.0979072 6.08306C-0.167421 4.66797 0.090157 3.24664 1.07181 2.26499C2.60519 0.731615 5.14872 0.954519 7.27471 2.21965C8.12407 1.39744 9.07304 0.720865 10.1649 0.155168ZM6.92688 4.50342C7.25603 4.69457 7.53068 4.96922 7.72183 5.29837C9.13685 4.23262 10.1663 3.01757 10.9602 1.48533C10.9849 1.43773 10.9818 1.36264 10.9222 1.30303C10.8626 1.24343 10.7875 1.24038 10.7399 1.26504C9.20768 2.05892 7.99263 3.0884 6.92688 4.50342ZM4.89185 7.3334C5.33818 7.33576 5.75948 7.32422 6.11963 7.22606C6.36231 7.15993 6.51164 7.06846 6.60141 6.9651C6.68269 6.87151 6.76594 6.71036 6.76594 6.39385C6.76594 5.87772 6.34754 5.45931 5.8314 5.45931C5.51489 5.45931 5.35374 5.54256 5.26015 5.62384C5.15679 5.71361 5.06532 5.86294 4.99919 6.10562C4.90103 6.46578 4.88949 6.88707 4.89185 7.3334Z" fill="white"/>
+</svg>
diff --git a/src/assets/icons/expand-lg.svg b/src/assets/icons/expand-lg.svg
new file mode 100644
index 0000000..1a150dc
--- /dev/null
+++ b/src/assets/icons/expand-lg.svg
@@ -0,0 +1,3 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.9167 3.66667C11.9167 3.16041 12.3271 2.75 12.8333 2.75H18.3333C18.8396 2.75 19.25 3.16041 19.25 3.66667V9.16667C19.25 9.67293 18.8396 10.0833 18.3333 10.0833C17.8271 10.0833 17.4167 9.67293 17.4167 9.16667V5.8797L13.9398 9.35651C13.5819 9.7145 13.0015 9.7145 12.6435 9.35651C12.2855 8.99853 12.2855 8.41813 12.6435 8.06015L16.1203 4.58333H12.8333C12.3271 4.58333 11.9167 4.17293 11.9167 3.66667ZM3.66667 11.9167C4.17293 11.9167 4.58333 12.3271 4.58333 12.8333V16.1203L8.06015 12.6435C8.41813 12.2855 8.99853 12.2855 9.35651 12.6435C9.7145 13.0015 9.7145 13.5819 9.35651 13.9398L5.8797 17.4167H9.16667C9.67293 17.4167 10.0833 17.8271 10.0833 18.3333C10.0833 18.8396 9.67293 19.25 9.16667 19.25H3.66667C3.16041 19.25 2.75 18.8396 2.75 18.3333V12.8333C2.75 12.3271 3.16041 11.9167 3.66667 11.9167Z" fill="#0D0D0D"/>
+</svg>
diff --git a/src/components/Canvas/CanvasTest.vue b/src/components/Canvas/CanvasTest.vue
index 4967af9..58f9ae5 100644
--- a/src/components/Canvas/CanvasTest.vue
+++ b/src/components/Canvas/CanvasTest.vue
@@ -11,7 +11,7 @@
 			>
 
 				<result-image />
-				
+
 				<card type="cards-select" />
 
 				<card type="to-real-style" />
@@ -36,7 +36,7 @@
 		scale: 1
 	})
 	const onMouseDown = (e: MouseEvent) => {
-		if (e.button !== 1) return
+		// if (e.button !== 1) return
 		const ox = data.x
 		const oy = data.y
 		const X = e.clientX
diff --git a/src/components/Canvas/FlowCanvas/components/cards/index.vue b/src/components/Canvas/FlowCanvas/components/cards/index.vue
index 89cdc12..4b7efe2 100644
--- a/src/components/Canvas/FlowCanvas/components/cards/index.vue
+++ b/src/components/Canvas/FlowCanvas/components/cards/index.vue
@@ -135,6 +135,7 @@
 			align-items: center;
 			padding-left: 16px;
 			position: relative;
+			user-select: none;
 			> .c-svg {
 				width: auto;
 				height: auto;
diff --git a/src/components/Canvas/FlowCanvas/components/cards/scene-composition.vue b/src/components/Canvas/FlowCanvas/components/cards/scene-composition.vue
index 86e1718..8bcf29c 100644
--- a/src/components/Canvas/FlowCanvas/components/cards/scene-composition.vue
+++ b/src/components/Canvas/FlowCanvas/components/cards/scene-composition.vue
@@ -65,7 +65,9 @@
 			display: flex;
 			flex-wrap: wrap;
 			gap: 8.29px 5.5px;
+			user-select: none;
 			> .item {
+				cursor: pointer;
 				display: flex;
 				align-items: center;
 				justify-content: center;
diff --git a/src/components/Canvas/FlowCanvas/components/cards/to-real-style.vue b/src/components/Canvas/FlowCanvas/components/cards/to-real-style.vue
index 0747d5f..b61f2b6 100644
--- a/src/components/Canvas/FlowCanvas/components/cards/to-real-style.vue
+++ b/src/components/Canvas/FlowCanvas/components/cards/to-real-style.vue
@@ -66,6 +66,7 @@
 			display: flex;
 			flex-wrap: wrap;
 			gap: 10px 4px;
+			user-select: none;
 			> .item {
 				display: flex;
 				align-items: center;
@@ -75,6 +76,7 @@
 				font-size: 10px;
 				border: 1px solid #e4e4e7;
 				background: #f0f0f0;
+				cursor: pointer;
 			}
 		}
 	}
diff --git a/src/components/Canvas/FlowCanvas/components/result/result-image.vue b/src/components/Canvas/FlowCanvas/components/result/result-image.vue
index c711139..c67e034 100644
--- a/src/components/Canvas/FlowCanvas/components/result/result-image.vue
+++ b/src/components/Canvas/FlowCanvas/components/result/result-image.vue
@@ -1,32 +1,207 @@
 <template>
-	<!-- 转3-View -->
-	<div class="to-3view">
-		<p class="label">3D Model</p>
-		<div class="image">
-			<img
-				src="https://s3-alpha-sig.figma.com/img/ea2f/590e/9638f62a2fc91e31f33db0022db1642c?Expires=1773014400&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=M0B8oJJOk~dGG0aZAqOIocAp7T0LFdJ9FYmCrEZVTCRzYxM6SJRNtYMTX-rTO3Z~s14QINh~o-S41XiZnBv-0zcKjuWot~VVaNHfd0~1LesfNe2KwvCinT~72btFut1pheLnKE-wWCX5ewtonxU77bnw386YPMTqv7DBZzksf2udsJA7NmOYD6~TUG3Q2dWSt~zPH~lkaidscPqpCnCbqzljCEi4RiHY4U3A45l5XypcX2umqn1UaYUFCTqV9471J4qdB6Dg2pcKocdp-7-3s1De6Q~2SmBOrSgDQ~KEADCB2lhKfhxgWmy0lwMvhTd4l90ygVZDWZRABgjHNrGUvg__"
-				alt=""
-			/>
+	<!-- 结果图片 -->
+	<div class="result-image">
+		<div class="header" v-show="showHeader">
+			<span class="icon">
+				<svg-icon name="chat-compose" size="24" size-unit="px" />
+			</span>
+			<span class="icon">
+				<svg-icon name="expand-lg" size="24" size-unit="px" />
+			</span>
+			<span class="icon">
+				<svg-icon name="download" size="24" size-unit="px" />
+			</span>
+			<button class="edit">
+				<span class="icon"><svg-icon name="edit" size="11" /></span>
+				<span class="text">Edit</span>
+			</button>
+		</div>
+		<img
+			class="image"
+			src="https://s3-alpha-sig.figma.com/img/ea2f/590e/9638f62a2fc91e31f33db0022db1642c?Expires=1773014400&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=M0B8oJJOk~dGG0aZAqOIocAp7T0LFdJ9FYmCrEZVTCRzYxM6SJRNtYMTX-rTO3Z~s14QINh~o-S41XiZnBv-0zcKjuWot~VVaNHfd0~1LesfNe2KwvCinT~72btFut1pheLnKE-wWCX5ewtonxU77bnw386YPMTqv7DBZzksf2udsJA7NmOYD6~TUG3Q2dWSt~zPH~lkaidscPqpCnCbqzljCEi4RiHY4U3A45l5XypcX2umqn1UaYUFCTqV9471J4qdB6Dg2pcKocdp-7-3s1De6Q~2SmBOrSgDQ~KEADCB2lhKfhxgWmy0lwMvhTd4l90ygVZDWZRABgjHNrGUvg__"
+		/>
+		<div class="add" @mousedown.stop>
+			<svg-icon name="add" size="14" size-unit="px" />
+		</div>
+		<div class="more" @click="showMenu = !showMenu" @mousedown.stop>
+			<svg-icon name="more" size="24" size-unit="px" color="#C9C9C9" />
+		</div>
+		<div class="menu" v-show="showMenu" @mousedown.stop>
+			<div
+				v-for="(v, i) in menus"
+				:key="i"
+				:class="[v.isDivide ? 'divide' : 'item']"
+				@click="onMenuItem(v)"
+			>
+				<template v-if="!v.isDivide">
+					<span class="label">{{ v.label }}</span>
+					<span class="tip">{{ v.tip }}</span>
+				</template>
+			</div>
 		</div>
 	</div>
 </template>
 
 <script setup lang="ts">
-	import { reactive, onMounted } from 'vue'
+	import { reactive, ref, onBeforeUnmount } from 'vue'
+	const showHeader = ref(true)
+	const showMenu = ref(false)
 	const data = reactive({})
-
+	const menus = ref([
+		{ label: 'Copy', tip: 'Ctrl+C', on: () => {} },
+		{ label: 'Paste', tip: 'Ctrl+V', on: () => {} },
+		{ label: 'Duplicate', tip: 'Ctrl+D', on: () => {} },
+		{ label: 'Delete', tip: 'Del', on: () => {} },
+		{ isDivide: true },
+		{ label: 'Bring to font', tip: 'Del', on: () => {} },
+		{ label: 'Send to back', tip: 'Del', on: () => {} },
+		{ isDivide: true },
+		{ label: 'Flip horizontal', tip: '', on: () => {} },
+		{ label: 'Flip vertical', tip: '', on: () => {} }
+	])
+	const onMenuItem = (v) => {
+		v.on && v.on()
+		hideMenu()
+	}
+	const hideMenu = () => {
+		showMenu.value = false
+	}
+	document.addEventListener('mousedown', hideMenu)
+	onBeforeUnmount(() => {
+		document.removeEventListener('mousedown', hideMenu)
+	})
 	defineExpose({ data })
 </script>
 
 <style lang="less" scoped>
-	.to-3view {
-		> .image {
-			padding: 18px;
+	.result-image {
+		width: 244px;
+		border-radius: 16px;
+		border: 3px solid #d9d9d9;
+		box-shadow: 0px 15px 21px 0px #0000000d;
+		padding: 25px 6px;
+		user-select: none;
+		> .header {
+			position: absolute;
+			top: -20px;
+			left: 50%;
+			transform: translate(-50%, -100%);
+			width: auto;
+			height: 50px;
 			border-radius: 10px;
-			background-color: #f0f0f0;
-			> img {
+			border: 2px solid #ebebeb;
+			box-shadow: 0px 15px 21px 0px #0000000d;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			user-select: none;
+			padding: 0 19px;
+			gap: 12px;
+			> .icon {
+				cursor: pointer;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				width: 30px;
+				height: 30px;
+				--svg-icon-color: #000;
+				border-radius: 4px;
+				&:hover {
+					background-color: #dfdfdf;
+				}
+			}
+			> .edit {
+				width: 80px;
+				height: 30px;
+				border-radius: 4px;
+				border: none;
+				background-color: #ff7a51;
+				color: #fff;
+				font-size: 12px;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				gap: 8px;
+				&:active {
+					opacity: 0.8;
+				}
+			}
+		}
+
+		> .image {
+			width: 100%;
+			height: auto;
+		}
+		position: relative;
+		> .add {
+			position: absolute;
+			width: 32px;
+			height: 32px;
+			border: 2px solid #fff;
+			// bottom: -16px;
+			right: -16px;
+			top: 50%;
+			transform: translateY(-50%);
+			background-color: #ed8936;
+			border-radius: 50%;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			color: #fff;
+			font-size: 25px;
+			box-shadow: 0 8px 20px 0 #71809633;
+			cursor: pointer;
+			z-index: 20;
+		}
+		> .more {
+			position: absolute;
+			top: 5px;
+			right: 9px;
+			width: 24px;
+			height: 24px;
+			cursor: pointer;
+		}
+		> .menu {
+			position: absolute;
+			width: 244px;
+			height: auto;
+			top: 0;
+			right: -10px;
+			transform: translate(100%, 0);
+			border-radius: 16px;
+			padding: 16px 14px;
+			box-shadow: 0px 15px 21px 0px rgba(0, 0, 0, 0.05);
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			justify-content: center;
+			gap: 12px;
+			background-color: #fff;
+			z-index: 50;
+			> .item {
 				width: 100%;
-				height: auto;
+				height: 27px;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				padding: 0 8px;
+				border-radius: 8px;
+				cursor: pointer;
+				font-size: 14px;
+				&:hover {
+					background: #f3f3f3;
+				}
+				> .label {
+					color: #000;
+				}
+				> .tip {
+					color: rgba(0, 0, 0, 0.3);
+				}
+			}
+			> .divide {
+				width: 100%;
+				height: 0;
+				border-bottom: 1px solid #e5e5e5;
 			}
 		}
 	}
diff --git a/src/components/Canvas/FlowCanvas/components/tools/pixel-ratio-selection.vue b/src/components/Canvas/FlowCanvas/components/tools/pixel-ratio-selection.vue
index 5fae90f..c182c83 100644
--- a/src/components/Canvas/FlowCanvas/components/tools/pixel-ratio-selection.vue
+++ b/src/components/Canvas/FlowCanvas/components/tools/pixel-ratio-selection.vue
@@ -40,8 +40,10 @@
 		align-items: center;
 		justify-content: center;
 		padding: 0 17px;
+		user-select: none;
 		> div {
 			text-align: center;
+			cursor: pointer;
 			font-size: 12px;
 			color: #7c7c7c;
 			height: 21px;
diff --git a/src/components/Canvas/FlowCanvas/flow-canvas.vue b/src/components/Canvas/FlowCanvas/flow-canvas.vue
index c2ade52..0d29603 100644
--- a/src/components/Canvas/FlowCanvas/flow-canvas.vue
+++ b/src/components/Canvas/FlowCanvas/flow-canvas.vue
@@ -82,22 +82,22 @@
 	onMounted(() => {
 		window.vueFlow = vueFlow
 		window.nodes = nodes
-		window.addaaaaa = () => {
-			const lastNode = vueFlow.value.getNode(nodes.value[nodes.value.length - 1].id)
-			const width = lastNode.dimensions.width
-			const x = lastNode.position.x
-			const y = lastNode.position.y
-			nodes.value.push({
-				id: nodes.value.length + 1 + '',
-				type: 'SecondaryNode',
-				class: 'custom-node',
-				data: { component: card, type_: 'to-3d-model' },
-				position: {
-					x: width + x + 50,
-					y: y
-				}
-			})
-		}
+		// window.addaaaaa = () => {
+		// 	const lastNode = vueFlow.value.getNode(nodes.value[nodes.value.length - 1].id)
+		// 	const width = lastNode.dimensions.width
+		// 	const x = lastNode.position.x
+		// 	const y = lastNode.position.y
+		// 	nodes.value.push({
+		// 		id: nodes.value.length + 1 + '',
+		// 		type: 'SecondaryNode',
+		// 		class: 'custom-node',
+		// 		data: { component: card, type_: 'to-3d-model' },
+		// 		position: {
+		// 			x: width + x + 50,
+		// 			y: y
+		// 		}
+		// 	})
+		// }
 	})
 </script>
 <style lang="less">
diff --git a/src/components/Canvas/FlowCanvas/manager/NodeManager.ts b/src/components/Canvas/FlowCanvas/manager/NodeManager.ts
new file mode 100644
index 0000000..40fc186
--- /dev/null
+++ b/src/components/Canvas/FlowCanvas/manager/NodeManager.ts
@@ -0,0 +1,11 @@
+export class NodeManager {
+	stateManager: any
+	vueFlow: any
+	constructor(options) {
+		this.stateManager = options.stateManager;
+		this.vueFlow = options.vueFlow
+	}
+	nodes: [
+		
+	]
+}
diff --git a/src/stores/userInfo.ts b/src/stores/userInfo.ts
index 835d8ae..00ba9ab 100644
--- a/src/stores/userInfo.ts
+++ b/src/stores/userInfo.ts
@@ -4,6 +4,7 @@ import { defineStore } from 'pinia'
 import { ref, computed } from 'vue'
 import { removeLocal, setLocal } from '@/utils/local'
 import MyEvent from '@/utils/myEvent'
+import { Logout, GetUserInfo } from '@/api/login'
 export const useUserInfoStore = defineStore('userInfo', () => {
 	const state = ref({
 		userInfo: {},
@@ -11,8 +12,14 @@ export const useUserInfoStore = defineStore('userInfo', () => {
 
 	})
 
-	// getters
-	const getUserInfo = computed(() => state.value.userInfo)
+	const getUserInfo = async () => {
+		const res = await GetUserInfo()
+		if (res) {
+			state.value.userInfo = { ...res }
+		} else {
+			state.value.userInfo = {}
+		}
+	}
 
 	// actions
 	const setUserInfo = (data: any) => {
@@ -24,8 +31,9 @@ export const useUserInfoStore = defineStore('userInfo', () => {
 		// setLocal(data, 'token')
 	}
 
-	const logOut = async () => {
+	const logOut = async (isApi: boolean = true) => {
 		// 处理退出登录的一些逻辑
+		if (isApi) await Logout()
 		state.value.token = ''
 		state.value.userInfo = {}
 		// removeLocal('token')
diff --git a/src/utils/request.ts b/src/utils/request.ts
index 5eac85f..98ae7db 100644
--- a/src/utils/request.ts
+++ b/src/utils/request.ts
@@ -109,12 +109,13 @@ service.interceptors.response.use(
 				// 	location.reload() // 为了重新实例化vue-router对象 避免bug
 				// })
 				// })
-				// showToast({
-				// 	message: 'Please log in and try again.',
-				// 	duration: 5000
-				// })
-				// router.push('/login')
-				// useGenerateStore().clearGenerateData()
+				ElMessage({
+					type: 'error',
+					message: 'Please log in and try again.',
+					duration: 5000
+				})
+				router.push('/login')
+				useUserInfoStore().logOut(false)
 				return Promise.reject(false)
 			}
 			error.config && removePending(error.config)
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index d0ad754..2c22a5e 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -24,11 +24,11 @@
 	import LeftNav from './left-nav.vue'
 	import TopNav from './top-nav.vue'
 	import setting from './setting/index.vue'
-	import { useGlobalStore } from '@/stores'
-	const globalStore = useGlobalStore()
-	const loading = computed(() => globalStore.state.loading)
+	import { useUserInfoStore } from '@/stores'
 	import FlowCanvas from '@/components/Canvas/FlowCanvas/index.vue'
 	import myEvent from '@/utils/myEvent'
+	const userInfoStore = useUserInfoStore()
+	userInfoStore.getUserInfo()
 
 	const flowCanvasRef = ref(null)
 	const openFlowCanvas = () => {
diff --git a/src/views/login/retrieve-password.vue b/src/views/login/retrieve-password.vue
index 260f9f7..5ed7db7 100644
--- a/src/views/login/retrieve-password.vue
+++ b/src/views/login/retrieve-password.vue
@@ -98,17 +98,11 @@
 		// console.log(code)
 		ForgetPassword({
 			email: formData.email,
-			password: md5(formData.password),
+			newPassword: md5(formData.password),
 			verificationCode: code
 		})
 			.then((res) => {
-				if (res) {
-					// userInfoStore.setToken(res)
-					// userInfoStore.setUserInfo({
-					// 	email: formData.email
-					// })
-					// router.push({ name: 'mainInput' })
-				}
+				if (res) router.push({ name: 'login' })
 			})
 			.catch((error) => {
 				console.warn(error)