实现双端悬浮按钮的不同表现，弹窗和页面跳转

app/components/ContactFloatingButton.vue

@@ -1,14 +1,22 @@
 <!-- components/ContactFloatingButton.vue -->
 <template>
   <div class="fixed  right-2 lg:right-6 top-1/2 transform -translate-y-1/2 z-50 flex items-center">
-    <UPopover arrow mode="click" :popper="{ placement: 'left-start'  }"    :content="{
+    <!-- PC端：弹窗 -->
-      align: 'center',
+    <UPopover 
-      side: 'left',
+      v-if="isDesktop"
-      sideOffset: 6
+      arrow 
-    }" >
+      mode="click" 
+      :popper="{ placement: 'left-start' }"    
+      :content="{
+        align: 'center',
+        side: 'left',
+        sideOffset: 6
+      }" 
+    >
       <UButton
           class="bg-primary hover:bg-primary-600 text-white px-4 py-3 rounded-l-lg shadow-lg transition-all duration-300"
-          color="neutral" label="商家加盟"
+          color="neutral" 
+          label="商家加盟"
           variant="subtle"/>
       <template #content>
         <div class="w-75 lg:w-100 h-120 lg:h-160 p-4 bg-white rounded-lg shadow-xl overflow-y-auto">
@@ -110,16 +118,51 @@
         </div>
       </template>
     </UPopover>
+    
+    <!-- 移动端：跳转链接 -->
+    <NuxtLink 
+      v-else-if="isMounted"
+      to="/merchantFranchise"
+      class="block"
+    >
+      <UButton
+          class="bg-primary hover:bg-primary-600 text-white px-4 py-3 rounded-l-lg shadow-lg transition-all duration-300"
+          color="neutral" 
+          label="商家加盟"
+          variant="subtle"/>
+    </NuxtLink>
   </div>
 </template>
 
 <script setup lang="ts">
-import { ref, reactive } from 'vue'
+import { ref, reactive, computed, onMounted, onUnmounted } from 'vue'
 import { submitMchApply, type MchApplyParams } from '~/config/api'
 
 const toast = useToast()
 const formRef = ref()
 const isSubmitting = ref(false)
+const windowWidth = ref(0)
+const isMounted = ref(false)
+
+// 检测是否为桌面端（lg断点：1024px）
+const isDesktop = computed(() => isMounted.value && windowWidth.value >= 1024)
+
+// 监听窗口大小变化
+const updateWindowWidth = () => {
+  windowWidth.value = window.innerWidth
+}
+
+onMounted(() => {
+  isMounted.value = true
+  updateWindowWidth()
+  window.addEventListener('resize', updateWindowWidth)
+})
+
+onUnmounted(() => {
+  if (process.client) {
+    window.removeEventListener('resize', updateWindowWidth)
+  }
+})
 
 const formState = reactive<MchApplyParams>({
   name: '',