更新首页

app/pages/contact.vue

@@ -18,7 +18,7 @@
               <div class="info-icon">📍</div>
               <div class="info-content">
                 <div class="info-label">办公地址</div>
-                <div class="info-value">广西·南宁·良庆区 五象大道401号 五象航洋城3号楼</div>
+                <div class="info-value">{{ contactInfo.address }}</div>
               </div>
             </div>
 
@@ -26,7 +26,7 @@
               <div class="info-icon">📞</div>
               <div class="info-content">
                 <div class="info-label">联系电话</div>
-                <div class="info-value">0771-5386339</div>
+                <div class="info-value">{{ contactInfo.phone }}</div>
               </div>
             </div>
 
@@ -34,7 +34,7 @@
               <div class="info-icon">📧</div>
               <div class="info-content">
                 <div class="info-label">电子邮箱</div>
-                <div class="info-value">gxjzxzx@126.com</div>
+                <div class="info-value">{{ contactInfo.email }}</div>
               </div>
             </div>
 
@@ -42,7 +42,7 @@
               <div class="info-icon">⏰</div>
               <div class="info-content">
                 <div class="info-label">服务时间</div>
-                <div class="info-value">周一至周五 9:00-17:00</div>
+                <div class="info-value">{{ contactInfo.serviceHours }}</div>
               </div>
             </div>
 
@@ -50,7 +50,7 @@
               <div class="info-icon">📮</div>
               <div class="info-content">
                 <div class="info-label">邮政编码</div>
-                <div class="info-value">530200</div>
+                <div class="info-value">{{ contactInfo.postalCode }}</div>
               </div>
             </div>
 
@@ -60,7 +60,10 @@
               <div class="social-title">关注我们</div>
               <div class="social-items">
                 <a-tooltip title="微信公众号">
-                  <div class="social-item">📱</div>
+                  <div class="social-item">
+                    <img v-if="contactInfo.wechatQrcode" :src="contactInfo.wechatQrcode" alt="微信公众号二维码" class="social-qrcode" />
+                    <span v-else>📱</span>
+                  </div>
                 </a-tooltip>
               </div>
             </div>
@@ -146,10 +149,19 @@
 
 <script setup lang="ts">
 import { message } from 'ant-design-vue'
+import { listSiteDictionaryItems, resolveSiteAssetUrl, submitSiteConsultationMessage } from '@/api/site'
 
 useHead({ title: '联系我们 - 广西决策咨询网' })
 
 const submitting = ref(false)
+const contactInfo = reactive({
+  address: '广西·南宁·良庆区 五象大道401号 五象航洋城3号楼',
+  phone: '0771-5386339',
+  email: 'gxjzxzx@126.com',
+  serviceHours: '周一至周五 9:00-17:00',
+  postalCode: '530200',
+  wechatQrcode: '',
+})
 
 const form = reactive({
   name: '',
@@ -165,6 +177,22 @@ const rules = {
   content: [{ required: true, message: '请输入咨询内容' }],
 }
 
+async function loadContactDictionary() {
+  try {
+    const items = await listSiteDictionaryItems({ dictCode: 'site_contact' })
+    const itemMap = Object.fromEntries((items || []).map((item) => [item.itemKey, item.itemValue]))
+
+    contactInfo.address = itemMap.address || contactInfo.address
+    contactInfo.phone = itemMap.phone || contactInfo.phone
+    contactInfo.email = itemMap.email || contactInfo.email
+    contactInfo.serviceHours = itemMap.service_hours || contactInfo.serviceHours
+    contactInfo.postalCode = itemMap.postal_code || contactInfo.postalCode
+    contactInfo.wechatQrcode = resolveSiteAssetUrl(itemMap.wechat_qrcode || '')
+  } catch (error) {
+    console.error('加载联系字典失败', error)
+  }
+}
+
 async function handleSubmit() {
   if (!form.name || !form.phone || !form.content) {
     message.warning('请填写必填项')
@@ -172,13 +200,17 @@ async function handleSubmit() {
   }
   submitting.value = true
   try {
-    // TODO: 接入实际API提交咨询
-    // await submitContact(form)
-    await new Promise(resolve => setTimeout(resolve, 500))
+    await submitSiteConsultationMessage({
+      name: form.name.trim(),
+      phone: form.phone.trim(),
+      organization: form.organization.trim(),
+      type: form.type,
+      content: form.content.trim(),
+    })
     message.success('咨询已提交，我们会尽快与您联系！')
     handleReset()
-  } catch (e: any) {
-    message.error(e?.message || '提交失败')
+  } catch (e: unknown) {
+    message.error(e instanceof Error ? e.message : '提交失败')
   } finally {
     submitting.value = false
   }
@@ -193,6 +225,10 @@ function handleReset() {
     content: '',
   })
 }
+
+onMounted(() => {
+  loadContactDictionary()
+})
 </script>
 
 <style scoped>
@@ -258,6 +294,14 @@ function handleReset() {
   line-height: 1.6;
 }
 
+.social-qrcode {
+  width: 96px;
+  height: 96px;
+  object-fit: contain;
+  border-radius: 10px;
+  background: #fff;
+}
+
 .info-divider {
   height: 1px;
   background: #f0f0f0;