feat: 右上角图标随个人中心弹窗展示而变化

src/components/HeaderTitle.vue

@@ -1,13 +1,23 @@
 <script setup lang="ts">
+	import { ref } from 'vue'
 	import { useRouter } from 'vue-router'
+	import MyEvent from '@/utils/myEvent'
+	
 	const router = useRouter()
 
+
 	defineProps({
-		title: { type: String, default: 'STYLING ASSISTANT' }
+		title: { type: String, default: 'STYLING ASSISTANT' },
 	})
 
 	const emit = defineEmits(['clickReturn', 'clickProfile'])
 
+	const profileVisible = ref(false)
+	const handleProfileVisibleChange = (visible) => {
+		profileVisible.value = visible
+	}
+	MyEvent.add('change-profile-visible',handleProfileVisibleChange)
+
 	const handleClickReturn = () => {
 		router.back()
 		// emit('clickReturn')
@@ -22,7 +32,9 @@
 	<div class="header-title">
 		<div class="return" @click="handleClickReturn"><SvgIcon name="return" size="34" /></div>
 		<span class="title">{{ title }}</span>
-		<div class="profile" @click="handleClickProfile"><SvgIcon name="profile" size="45" /></div>
+		<div class="profile" @click="handleClickProfile">
+			<SvgIcon :name="profileVisible ? 'profileFilledBlack' : 'profile_white'" size="45" />
+		</div>
 	</div>
 </template>
 

src/utils/myEvent.js

@@ -7,7 +7,6 @@ class MyEvent {
     MyEvent.list = MyEvent.list.filter(item => item.name != name && item.call != call)
   }
   emit(name, data) {
-    console.log('Myevent触发--',name)
     MyEvent.list.forEach(item => {
       if (item.name == name) item.call(data)
     })

src/views/Workshop/profile.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, reactive, onMounted, inject } from 'vue'
+import { ref, reactive, onMounted, inject ,watch} from 'vue'
 import router from '@/router'
 import { showConfirmDialog } from 'vant'
 import { useUserInfoStore, useOverallStore } from '@/stores'
@@ -13,7 +13,7 @@ const props = defineProps<{
 
 const userInfoStore = useUserInfoStore()
 const overallStore = useOverallStore()
-const emit = defineEmits(['view-type', 'selected-customer'])
+const emit = defineEmits(['view-type', 'selected-customer','change-visible'])
 const show = ref(false)
 const isEdit = ref(false)
 const form = reactive({
@@ -28,6 +28,12 @@ const open = () => {
 const close = () => {
   show.value = false
 }
+
+watch(show,(newVal)=>{
+  emit('change-visible', newVal)
+  MyEvent.emit('change-profile-visible',newVal)
+})
+
 const onEditItem = (item) => {
   if (!form[item]) return
   form[item].edit = true
@@ -49,7 +55,6 @@ const confirm = () => {
     username: form.name.value,
     email: form.email.value,
   }
-  console.log(params)
   setTimeout(() => {
     overallStore.setLoading(false)
     isEdit.value = false

src/views/login/customer.vue

@@ -5,7 +5,11 @@
   >
     <div class="setting flex flex-between">
       <SvgIcon name="left" size="70" @click.stop="handleBack" />
-      <SvgIcon name="profile_white" size="55" @click="handleOpenProfile" />
+      <SvgIcon
+        :name="profileVisible ? 'profileFilledWhite' : 'profile_white'"
+        size="55"
+        @click="handleOpenProfile"
+      />
     </div>
     <template v-if="pageMode === 'entry'">
       <div class="content flex-1 flex flex-center flex-column">
@@ -58,7 +62,12 @@
       </div>
     </template>
 
-    <Profile ref="profileRef" @selected-customer="handleSelectCustomer" is-customer />
+    <Profile
+      ref="profileRef"
+      @change-visible="handleChangeVisible"
+      @selected-customer="handleSelectCustomer"
+      is-customer
+    />
   </div>
 </template>
 <script setup lang="ts">
@@ -147,6 +156,11 @@ const handleSelectCustomer = (value) => {
   }
 }
 
+const profileVisible = ref(false)
+const handleChangeVisible = (visible: boolean) => {
+  profileVisible.value = visible
+}
+
 const handleBack = (e?: Event) => {
   if (e) {
     e.stopPropagation()