即将修改网站-联系我们-混乱中

src/views/websiteRelated/contactUs/index.vue

@@ -22,35 +22,33 @@
             <a-form-item :label="'编码'" name="reportNum">
                 <a-input :placeholder="'请输入编码'" v-model:value="reportNum"></a-input>
             </a-form-item>
-
-            <a-form-item :label="'海邻公众号'" name="Image">
-                <x-upload-image v-model="Image" @imgChange="imgChange" />
+            <template v-if="socialMedia.length > 0">
+                <a-form-item
+                    v-for="(itemImg, index) in socialMedia"
+                    :key="index"
+                    :label="itemImg.name || `社交媒体${index + 1}`">
+                    <a-input class="inputPhone" v-model:value="itemImg.name" placeholder="请输入图片名称" />
+                    <x-upload-image v-model="itemImg.image" @imgChange="(value) => imgChange(index, value)" />
+                    <a-input class="inputPhone" v-model:value="itemImg.link" placeholder="请输入跳转链接" />
                 </a-form-item>
-            <a-form-item :label="'海邻视频号'" name="Image">
-                <x-upload-image v-model="Image" @imgChange="imgChange" />
-            </a-form-item>
-            <a-form-item :label="'海邻抖音'" name="Image">
-                <x-upload-image v-model="Image" @imgChange="imgChange" />
-            </a-form-item>
-
+            </template>
             <a-button ghost type="primary" @click="handleSearch" style="margin-top: 20px">保存</a-button>
         </template>
     </x-search-bar>
 </template>
-
 <script setup>
 import { message } from 'ant-design-vue'
 import { ref } from 'vue'
 import apis from '@/apis' // 假设这里包含 saveAffirm 接口
 import { usePagination } from '@/hooks'
 import { useI18n } from 'vue-i18n'
-import { getWebData,updateWebData} from '@/apis/modules/webSite' // 获取声明接口
-
+import { getWebData,updateWebData} from '@/apis/modules/webSite'
+import XSearchBar from '@/components/SearchBar/SearchBar.vue' // 获取声明接口
 defineOptions({
     name: 'friendlyLinks',
 })
 const { t } = useI18n()
-const { showLoading, hideLoading} = usePagination()
+const { showLoading, hideLoading } = usePagination()
 const affirm = ref(null)
 const id = ref(null)
 const reportContent = ref(null)
@@ -60,10 +58,12 @@ const lon = ref(null)
 const address = ref(null)
 const phone = ref(null)
 const reportNum = ref(null)
-const mediaImg = ref(null)
+const socialMedia = ref([{ name: '', image: '', link: '' }])
+const imgChange = (index, value) => {
+    socialMedia.value[index].image = value
+}
 // 页面加载时获取声明内容
 getPageList()
-
 /**
  * 获取声明内容
  */
@@ -81,6 +81,7 @@ async function getPageList() {
             address.value = res.data.address
             phone.value = res.data.phone
             reportNum.value = res.data.reportNum
+            socialMedia.value = res.data.socialMedia
             console.log(affirm.value)
             console.log(id.value)
         }
@@ -90,20 +91,10 @@ async function getPageList() {
         hideLoading()
     }
 }
-
-function isEmptyRichText(html) {
-    return !html || html.replace(/<[^>]+>/g, '').trim() === ''
-}
-
 /**
  * 提交声明内容
  */
 async function handleSearch() {
-    // console.log('affirm:', affirm.value)
-    // if (isEmptyRichText(affirm.value)) {
-    //     message.warning('请输入声明内容')
-    //     return
-    // }
     try {
         showLoading()
         await apis.webSite.updateWebData(id.value, {
@@ -115,6 +106,7 @@ async function handleSearch() {
             address: address.value,
             phone: phone.value,
             reportNum: reportNum.value,
+            socialMedia: socialMedia.value,
         })
         message.success('保存成功')
     } catch (e) {
@@ -125,4 +117,11 @@ async function handleSearch() {
 }
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.inputPhone {
+    margin-bottom: 20px;
+}
+.inputPhone:last-child {
+    margin-top: 20px;
+}
+</style>