更新seo界面

src/api/sitesettings.js

@@ -100,4 +100,30 @@ export function saveCompanyInfos(data) {
     method: "post",
     data: data,
   });
+}
+
+/**
+ * 获取企业SEO
+ * @param {number} tid 租户ID
+ * @returns {Promise}
+ */
+export function getCompanySeo(tid) {
+  return request({
+    url: "/admin/companySeo",
+    method: "get",
+    params: { tid }
+  });
+}
+
+/**
+ * 保存企业SEO
+ * @param {Object} data 要保存的数据
+ * @returns {Promise}
+ */
+export function saveCompanySeo(data) {
+  return request({
+    url: "/admin/saveCompanySeo",
+    method: "post",
+    data: data,
+  });
 }

src/views/basicSettings/siteSettings/components/seoSettings.vue

@@ -7,10 +7,7 @@
     style="max-width: 600px"
   >
     <el-form-item label="SEO标题" prop="seoTitle">
-      <el-input
+      <el-input v-model="seoForm.seoTitle" placeholder="请输入SEO标题" />
-        v-model="seoForm.seoTitle"
-        placeholder="请输入SEO标题"
-      />
     </el-form-item>
     <el-form-item label="SEO关键词" prop="seoKeywords">
       <el-input
@@ -34,39 +31,71 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive } from "vue";
+import { ref, reactive, onMounted } from "vue";
-import { ElMessage } from "element-plus";
+import { ElMessage, ElLoading } from "element-plus";
 import type { FormInstance, FormRules } from "element-plus";
+import { getCompanySeo, saveCompanySeo } from "@/api/sitesettings";
 
 const seoFormRef = ref<FormInstance>();
 
 const seoForm = reactive({
   seoTitle: "",
   seoKeywords: "",
-  seoDescription: ""
+  seoDescription: "",
 });
 
 const seoRules: FormRules = {
-  seoTitle: [{ required: true, message: "请输入SEO标题", trigger: "blur" }]
+  seoTitle: [{ required: true, message: "请输入SEO标题", trigger: "blur" }],
+};
+
+const fetchSeoData = async () => {
+  try {
+    const res = await getCompanySeo();
+    if (res.code === 200) {
+      Object.assign(seoForm, res.data);
+    }
+  } catch (error) {
+    ElMessage.error("获取SEO数据失败");
+  }
 };
 
 const saveSeoSettings = async () => {
   if (!seoFormRef.value) return;
-  await seoFormRef.value.validate((valid) => {
+
+  await seoFormRef.value.validate(async (valid) => {
     if (valid) {
-      // TODO: 保存SEO设置
+      const loading = ElLoading.service({ text: "正在保存..." });
-      ElMessage.success("SEO设置保存成功");
+      try {
+        const res = await saveCompanySeo({
+          seoTitle: seoForm.seoTitle,
+          seoKeywords: seoForm.seoKeywords,
+          seoDescription: seoForm.seoDescription,
+        });
+
+        if (res.code === 200) {
+          ElMessage.success("SEO设置保存成功");
+        } else {
+          ElMessage.error(res.msg);
+        }
+      } catch (error) {
+        ElMessage.error("网络请求失败");
+      } finally {
+        loading.close();
+      }
     }
   });
 };
 
 const resetSeoForm = () => {
-  seoForm.seoTitle = "";
+  if (!seoFormRef.value) return;
-  seoForm.seoKeywords = "";
+  seoFormRef.value.resetFields();
-  seoForm.seoDescription = "";
 };
 
+onMounted(() => {
+  fetchSeoData();
+});
+
 defineExpose({
-  seoForm
+  seoForm,
 });
 </script>

src/views/basicSettings/siteSettings/index.vue

@@ -26,7 +26,7 @@
           />
         </el-tab-pane>
 
-        <el-tab-pane label="登录验证" name="loginVerification">
+        <el-tab-pane label="登录验证" v-if="groupId === 1" name="loginVerification">
           <loginVerificationSettings
             ref="loginVerificationSettingsRef"
             v-if="activeTab === 'loginVerification'"
@@ -50,49 +50,17 @@
 
 <script setup lang="ts">
 import { ref, onMounted } from "vue";
-import { ElMessage } from "element-plus";
 import normalSettings from "./components/normalSettings.vue";
 import seoSettings from "./components/seoSettings.vue";
 import contactSettings from "./components/contactSettings.vue";
 import otherSettings from "./components/otherSettings.vue";
 import legalNoticeSettings from "./components/legalNotice.vue";
 import loginVerificationSettings from "./components/loginVerification.vue";
+import { useAuthStore } from '@/stores/auth';
 
+const authStore = useAuthStore();
+const groupId = (authStore.userInfo as any)?.group_id;
 const activeTab = ref("basic");
-
-const normalSettingsRef = ref();
-const seoSettingsRef = ref();
-const contactSettingsRef = ref();
-const otherSettingsRef = ref();
-const legalNoticeSettingsRef = ref();
-const loginVerificationSettingsRef = ref();
-
-// 初始化各标签页数据
-const initSettings = async () => {
-  // TODO: 从后端获取各设置数据并赋值给对应组件
-  if (normalSettingsRef.value) {
-    // normalSettingsRef.value.normalinfos = ...
-  }
-  if (seoSettingsRef.value) {
-    // seoSettingsRef.value.seoForm = ...
-  }
-  if (contactSettingsRef.value) {
-    // contactSettingsRef.value.contactForm = ...
-  }
-  if (otherSettingsRef.value) {
-    // otherSettingsRef.value.otherForm = ...
-  }
-  if (legalNoticeSettingsRef.value) {
-    // legalNoticeSettingsRef.value.legalNoticeForm = ...
-  }
-  if (loginVerificationSettingsRef.value) {
-    // loginVerificationSettingsRef.value.loginVerificationForm = ...
-  }
-};
-
-onMounted(() => {
-  initSettings();
-});
 </script>
 
 <style lang="less" scoped>