样式调整

src/components/page-builder/SearchBox.vue

@@ -259,7 +259,7 @@ const buttonStyleComputed = computed(() => {
 
 // 下拉面板样式
 const dropdownStyleComputed = computed(() => ({
-  maxHeight: `${props.dropdownStyle.maxHeight}px`,
+  maxHeight: props.dropdownStyle.maxHeight==0?"unset":`${props.dropdownStyle.maxHeight}px`,
   borderRadius: `${props.dropdownStyle.borderRadius}px`,
   backgroundColor: props.dropdownStyle.backgroundColor,
   boxShadow: props.dropdownStyle.boxShadow,

src/layouts/components/Footer.vue

@@ -15,7 +15,13 @@
               class="social-icon hover:opacity-80 transition-opacity"
               :title="t(`footer.social.${key}`)"
             >
-              <span class="text-lg">{{ getSocialIcon(key) }}</span>
+              <VIcon
+                v-if="getSocialIconName(key)"
+                :name="getSocialIconName(key)!"
+                fill="outline"
+                class="text-[24px]"
+              />
+              <span v-else class="text-sm">{{ key }}</span>
             </a>
           </div>
 
@@ -51,47 +57,14 @@
     <!-- 中间区域：链接列 -->
     <div class="footer-middle border-b border-gray-700 py-8">
       <div class="footer-container">
-        <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
-          <!-- 关于我们 -->
-          <div>
-            <h3 class="font-semibold mb-4">{{ t('footer.about.title') }}</h3>
-            <ul class="space-y-2">
-              <li v-for="link in aboutLinks" :key="link.key">
-                <a
-                  :href="link.url"
-                  class="text-sm text-gray-300 hover:text-white transition-colors"
-                >
-                  {{ t(`footer.about.${link.key}`) }}
-                </a>
-              </li>
-            </ul>
-          </div>
-
-          <!-- 给旅人 -->
-          <div>
-            <h3 class="font-semibold mb-4">{{ t('footer.travelers.title') }}</h3>
-            <ul class="space-y-2">
-              <li v-for="link in travelerLinks" :key="link.key">
-                <a
-                  :href="link.url"
-                  class="text-sm text-gray-300 hover:text-white transition-colors"
-                >
-                  {{ t(`footer.travelers.${link.key}`) }}
-                </a>
-              </li>
-            </ul>
-          </div>
+        <div class="grid grid-cols-1  gap-8" :class="[`md:grid-cols-${bottomNavs.length+1}`]">
 
-          <!-- 合作伙伴 -->
-          <div>
-            <h3 class="font-semibold mb-4">{{ t('footer.partners.title') }}</h3>
+          <div v-for="item in bottomNavs" :key="item.id">
+            <h3 class="font-semibold mb-4">{{ t(item.navTitle) }}</h3>
             <ul class="space-y-2">
-              <li v-for="link in partnerLinks" :key="link.key">
-                <a
-                  :href="link.url"
-                  class="text-sm text-gray-300 hover:text-white transition-colors"
-                >
-                  {{ t(`footer.partners.${link.key}`) }}
+              <li v-for="child in item.childList" :key="child.id">
+                <a :href="child.navUrl??'javascript:void(0);'"  class="text-sm text-gray-300 hover:text-white transition-colors">
+                  {{ t(child.navTitle) }}
                 </a>
               </li>
             </ul>
@@ -110,10 +83,9 @@
                   :name="method.icon"
                   fill="outline"
                   class="text-[20px]"
+                  v-if="method.icon && method.icon!=''"
                 />
-                <span class="text-xs text-gray-200">
-                  {{ method.label }}
-                </span>
+                <img :src="method.url" :alt="method.label" class="w-[42px] h-[auto]" v-if="method.url && method.url!=''" />
               </div>
             </div>
           </div>
@@ -155,84 +127,97 @@ import { useI18n } from 'vue-i18n'
 import { useSystemConfigStore } from '@/stores/systemConfig'
 import { IconUp } from '@arco-design/web-vue/es/icon'
 import { Message } from '@arco-design/web-vue'
+import VIcon from '@/components/global/VIcon.vue'
 
 const { t } = useI18n()
 const systemConfigStore = useSystemConfigStore()
 
 const email = ref('')
+const bottomNavs = computed(() => systemConfigStore.getBottomNavs)
+
+// 社交媒体字段到 VIcon 图标名称的映射
+const socialIconMap: Record<string, string> = {
+  facebook: 'facebook',
+  instagram: 'instagram',
+  snapchat: 'snapchat',
+  whatsapp: 'whatsapp',
+  youtube: 'youtube',
+  twitter: 'twitter',
+  tiktok: 'tiktok',
+}
 
-// 社交媒体链接
+// 所有支持的社交媒体字段
+const allSocialFields = [
+  'facebook', 'instagram', 'kakaotalk', 'line', 'linkedin',
+  'messenger', 'naver', 'signal', 'snapchat', 'telegram',
+  'tiktok', 'twitter', 'viber', 'wechat', 'weibo',
+  'whatsapp', 'xiaohongshu', 'youtube', 'zalo'
+]
+
+// 社交媒体链接（自动过滤空值）
 const socialMediaLinks = computed(() => {
   const config = systemConfigStore.config
   if (!config) return {}
   
   const links: Record<string, string> = {}
-  const socialFields = [
-    'facebook', 'youtube', 'instagram', 'weibo', 'twitter', 'pinterest'
-  ]
   
-  socialFields.forEach(field => {
+  allSocialFields.forEach(field => {
     const value = (config as any)[field]
-    if (value && typeof value === 'string') {
-      links[field] = value
+    // 只添加非空字符串链接
+    if (value && typeof value === 'string' && value.trim() !== '') {
+      links[field] = value.trim()
     }
   })
   
   return links
 })
 
-// 获取社交媒体图标组件
-const getSocialIcon = (key: string) => {
-  // 使用简单的文本图标，实际项目中可以使用图标库
-  const iconMap: Record<string, string> = {
-    facebook: 'f',
-    youtube: '▶',
-    instagram: '📷',
-    weibo: '微博',
-    twitter: 'X',
-    pinterest: 'P'
-  }
-  return iconMap[key] || key
+// 获取社交媒体图标名称（如果支持）
+const getSocialIconName = (key: string): string | null => {
+  return socialIconMap[key] || null
 }
 
-// 关于我们链接
-const aboutLinks = [
-  { key: 'about', url: '/about' },
-  { key: 'terms', url: '/terms' },
-  { key: 'privacy', url: '/privacy' },
-  { key: 'help', url: '/help' },
-  { key: 'media', url: '/media' }
-]
-
-// 给旅人链接
-const travelerLinks = [
-  { key: 'guarantee', url: '/guarantee' },
-  { key: 'blog', url: '/blog' },
-  { key: 'points', url: '/points' },
-  { key: 'redeem', url: '/redeem' },
-  { key: 'pointsCard', url: '/points-card' }
-]
+// 汇总没有图标的媒体（用于调试，可在控制台查看）
+// 使用 console.log 输出，避免未使用变量的警告
+if (import.meta.env.DEV) {
+  const checkSocialMediaWithoutIcons = () => {
+    const config = systemConfigStore.config
+    if (!config) return
+    
+    const withoutIcons: string[] = []
+    
+    allSocialFields.forEach(field => {
+      const value = (config as any)[field]
+      // 如果有值但没有对应的图标
+      if (value && typeof value === 'string' && value.trim() !== '' && !socialIconMap[field]) {
+        withoutIcons.push(field)
+      }
+    })
+    
+    if (withoutIcons.length > 0) {
+      console.log('[Footer] 没有图标的社交媒体:', withoutIcons)
+    }
+  }
+  
+  // 延迟检查，确保 config 已加载
+  setTimeout(checkSocialMediaWithoutIcons, 1000)
+}
 
-// 合作伙伴链接
-const partnerLinks = [
-  { key: 'becomeSupplier', url: '/become-supplier' },
-  { key: 'supplierLogin', url: '/supplier-login' },
-  { key: 'rezio', url: '/rezio' },
-  { key: 'cooperation', url: '/cooperation' },
-  { key: 'affiliate', url: '/affiliate' }
-]
 
 // 支付方式图标（使用 Keenicons，通过全局组件 VIcon 渲染）
 const paymentIcons = [
-  { key: 'card', icon: 'two-credit-cart', label: 'Credit Card' },
-  { key: 'paypal', icon: 'paypal', label: 'PayPal' },
-  { key: 'apple', icon: 'apple', label: 'Apple Pay' },
-  { key: 'google', icon: 'google-play', label: 'Google Pay' },
+  {key:'visa',icon:'',label:'Visa',url:'https://cdn.kkday.com/pc-web/assets/img/footer/payment/visa.svg'},
+  {key:'mastercard',icon:'',label:'MasterCard',url:'https://cdn.kkday.com/pc-web/assets/img/footer/payment/mastercard.svg'},
+  {key:'jcb',icon:'',label:'JCB',url:'https://cdn.kkday.com/pc-web/assets/img/footer/payment/jcb.svg'},
+  {key:'jko_pay',icon:'',label:'JKO Pay',url:'https://cdn.kkday.com/pc-web/assets/img/footer/payment/jko_pay.svg'},
+  {key:'apple_pay',icon:'',label:'Apple Pay',url:'https://cdn.kkday.com/pc-web/assets/img/footer/payment/apple_pay.svg'},
+  {key:'google_pay',icon:'',label:'Google Pay',url:'https://cdn.kkday.com/pc-web/assets/img/footer/payment/google_pay.svg'},
+  {key:'line_pay',icon:'',label:'Line Pay',url:'https://cdn.kkday.com/pc-web/assets/img/footer/payment/line_pay.svg'},
 ]
 
 // 版权信息
 const copyright = computed(() => {
-  return systemConfigStore.copyright || `COPYRIGHT © ${new Date().getFullYear()} All rights reserved.`
+  return systemConfigStore.platformConfig?.copyright || `COPYRIGHT © ${new Date().getFullYear()} All rights reserved.`
 })
 
 // 订阅 Newsletter

src/layouts/components/HeaderTopBar.vue

 <template>
-  <div class="w-[1200px] py-2 flex items-center justify-between h-[60px] text-xs text-gray-700">
+  <div class="w-[1200px] mx-2 py-2 flex items-center justify-between h-[60px] text-xs text-gray-700">
     <div class="flex items-center gap-4">
       <img
         v-if="logo"

src/layouts/components/Headers.vue

 <template>
-  <header class="app-header shadow-sm customPrimary-bg-7 flex flex-col items-center">
-    <HeaderTopBar />
+  <header class="app-header flex flex-col items-center pt-[60px]">
+    <div class="fixed top-0 left-0 right-[14px] z-10 shadow-sm customPrimary-bg-7 flex justify-center">
+      <HeaderTopBar />
+    </div>
     <div class="h-[1px] w-full bg-gray-700/5"></div>
     <HeaderNavBar />
   </header>

src/stores/systemConfig.ts

@@ -152,7 +152,9 @@ export const useSystemConfigStore = defineStore('systemConfig', {
     getTopNavs: (state): NavItemDto[] => {
       return state.navs?.filter(item => item.type === 1) || []
     },
-
+    getBottomNavs: (state): NavItemDto[] => {
+      return state.navs?.filter(item => item.type === 2) || []
+    },
   },
   actions: {
     async getTenantAsync(tenantId: string) {