hurx vor 1 Woche
Ursprung
Commit
17e53134fb
1 geänderte Dateien mit 223 neuen und 64 gelöschten Zeilen
  1. 223 64
      src/views/enterprisePurchase/index.vue

+ 223 - 64
src/views/enterprisePurchase/index.vue

@@ -1464,8 +1464,10 @@ import {
   getCurrentSearchConfig
 } from '@/api/enterprisePurchase/searchConfig';
 import { SearchConfigVO, SearchConfigQuery, SearchConfigForm } from '@/api/enterprisePurchase/searchConfig/types';
-import { listAdLeft, getAdLeft, delAdLeft, addAdLeft, updateAdLeft } from '@/api/enterprisePurchase/adLeft';
+import { listAdLeft, getAdLeft, delAdLeft, addAdLeft, updateAdLeft, getCurrentAdLeft } from '@/api/enterprisePurchase/adLeft';
 import { AdLeftVO, AdLeftQuery, AdLeftForm } from '@/api/enterprisePurchase/adLeft/types';
+import { listCarousel, getCarousel, delCarousel, addCarousel, updateCarousel } from '@/api/enterprisePurchase/carousel';
+import { CarouselVO, CarouselQuery, CarouselForm } from '@/api/enterprisePurchase/carousel/types';
 import {
   ShoppingCart,
   Plus,
@@ -1501,6 +1503,7 @@ const subTabs = [
 
 // 首页核心配置表单 (搜索栏与基本设置)
 const form = reactive({
+  id: null,
   mainTitle: '',
   subTitle: '',
   placeholderText: '',
@@ -1513,27 +1516,34 @@ const form = reactive({
   leftAdLink: ''
 });
 
+// 左侧广告配置ID(单例)
+const leftAdId = ref<string | number>('');
+
 // 保存配置
 const handleMainSave = async () => {
   try {
-    // 构建提交数据,过滤空的热词
-    const submitData = {
-      ...form,
-      hotWordList: form.hotWordsList.filter((item) => item.name && item.name.trim() !== '')
-    };
-    // 无ID则新增
-    res = await addSearchConfig(submitData);
-
-    if (res.code === 200) {
-      ElMessage.success('配置保存成功');
-      // 如果是新增,保存返回的ID
-      if (!form.id && res.data) {
-        form.id = res.data.id;
+    if (activeSubTab.value == 'search') {
+      // 构建提交数据,过滤空的热词
+      const submitData = {
+        ...form,
+        hotWordList: form.hotWordsList.filter((item) => item.name && item.name.trim() !== '')
+      };
+      // 无ID则新增
+      res = await addSearchConfig(submitData);
+
+      if (res.code === 200) {
+        ElMessage.success('配置保存成功');
+        // 如果是新增,保存返回的ID
+        if (!form.id && res.data) {
+          form.id = res.data.id;
+        }
+        // 重新获取最新配置
+        await getCurrentSearch();
+      } else {
+        ElMessage.error(res.msg || '保存失败');
       }
-      // 重新获取最新配置
-      await getCurrentSearch();
-    } else {
-      ElMessage.error(res.msg || '保存失败');
+    } else if (activeSubTab.value == 'carousel') {
+      saveLeftAdConfig();
     }
   } catch (error) {
     console.error('保存配置失败:', error);
@@ -1541,6 +1551,21 @@ const handleMainSave = async () => {
   }
 };
 
+// 获取当前配置
+const getCurrentAdLeftBtn = async () => {
+  try {
+    const res = await getCurrentAdLeft();
+    if (res.code === 200 && res.data) {
+      // 回显数据到表单
+      form.id = res.data.id || null;
+      form.leftAdImage = res.data.imageUrl || '';
+      form.leftAdLink = res.data.link || '';
+    }
+  } catch (error) {
+    console.error('获取配置失败:', error);
+    ElMessage.error('获取配置失败');
+  }
+};
 // 获取当前配置
 const getCurrentSearch = async () => {
   try {
@@ -1617,29 +1642,23 @@ const startPlaceholderScroll = () => {
 
 // 广告图模块逻辑
 const leftAdHover = ref(false);
-const carouselList = ref([
-  {
-    id: 1,
-    image: 'https://img.alicdn.com/imgextra/i4/O1CN01U9tOQ01X2zWz1C0oY_!!6000000001337-0-tps-552-190.jpg',
-    link: 'https://www.google.com',
-    target: '_blank',
-    status: 1
-  },
-  {
-    id: 2,
-    image: 'https://img.alicdn.com/imgextra/i3/O1CN01fX2zWz1C0oY7Z7Z7Z_!!6000000000001-0-tps-552-190.jpg',
-    link: '',
-    target: '_self',
-    status: 1
-  },
-  {
-    id: 3,
-    image: 'https://img.alicdn.com/imgextra/i2/O1CN01Z7Z7Z71C0oY7Z7Z7Z_!!6000000001234-0-tps-552-190.jpg',
-    link: '',
-    target: '_self',
-    status: 1
+const carouselList = ref<CarouselVO[]>([]);
+
+// 获取轮播图列表
+const getCarouselList = async () => {
+  try {
+    const res = await listCarousel();
+    if (res.code === 200 && res.rows) {
+      carouselList.value = res.rows.map((item: CarouselVO) => ({
+        ...item,
+        image: item.imageUrl || ''
+      }));
+    }
+  } catch (error) {
+    console.error('获取轮播图列表失败:', error);
+    ElMessage.error('获取轮播图列表失败');
   }
-]);
+};
 
 const activeCarouselList = computed(() => {
   return carouselList.value.filter((item) => item.status === 1);
@@ -1675,41 +1694,90 @@ const handleEditCarousel = (row) => {
   dialogVisible.value = true;
 };
 
-const submitCarouselForm = () => {
+const submitCarouselForm = async () => {
   if (!carouselForm.image) {
     return ElMessage.warning('请先上传轮播图片');
   }
 
-  if (dialogType.value === 'add') {
-    carouselList.value.push({
-      id: Date.now(),
-      ...JSON.parse(JSON.stringify(carouselForm))
-    });
-    ElMessage.success('新增成功');
-  } else {
-    carouselList.value[currentEditIndex.value] = {
-      ...carouselList.value[currentEditIndex.value],
-      ...JSON.parse(JSON.stringify(carouselForm))
-    };
-    ElMessage.success('修改成功');
+  const data: CarouselForm = {
+    imageUrl: carouselForm.image,
+    link: carouselForm.link,
+    target: carouselForm.target,
+    status: carouselForm.status,
+    sortOrder: carouselList.value.length
+  };
+
+  try {
+    if (dialogType.value === 'add') {
+      const res = await addCarousel(data);
+      if (res.code === 200) {
+        ElMessage.success('新增成功');
+        dialogVisible.value = false;
+        getCarouselList();
+      } else {
+        ElMessage.error(res.msg || '新增失败');
+      }
+    } else {
+      const id = carouselList.value[currentEditIndex.value]?.id;
+      const res = await updateCarousel({ ...data, id });
+      if (res.code === 200) {
+        ElMessage.success('修改成功');
+        dialogVisible.value = false;
+        getCarouselList();
+      } else {
+        ElMessage.error(res.msg || '修改失败');
+      }
+    }
+  } catch (error) {
+    console.error('操作失败:', error);
+    ElMessage.error('操作失败');
   }
-  dialogVisible.value = false;
 };
 
-const handleRemoveCarousel = (index) => {
-  ElMessageBox.confirm('确定要删除该轮播图吗?', '提示', {
-    type: 'warning'
-  }).then(() => {
-    carouselList.value.splice(index, 1);
-    ElMessage.success('删除成功');
-  });
+const handleRemoveCarousel = async (index: number) => {
+  const item = carouselList.value[index];
+  try {
+    await ElMessageBox.confirm('确定要删除该轮播图吗?', '提示', { type: 'warning' });
+    const res = await delCarousel(item.id);
+    if (res.code === 200) {
+      ElMessage.success('删除成功');
+      getCarouselList();
+    } else {
+      ElMessage.error(res.msg || '删除失败');
+    }
+  } catch (error) {
+    if (error !== 'cancel') {
+      console.error('删除失败:', error);
+      ElMessage.error('删除失败');
+    }
+  }
 };
 
-const moveRow = (index, direction) => {
+const moveRow = async (index: number, direction: number) => {
   const newIndex = index + direction;
   if (newIndex < 0 || newIndex >= carouselList.value.length) return;
   const item = carouselList.value.splice(index, 1)[0];
   carouselList.value.splice(newIndex, 0, item);
+
+  // 同步排序到后端
+  try {
+    const start = Math.min(index, newIndex);
+    const end = Math.max(index, newIndex);
+    for (let i = start; i <= end; i++) {
+      const row = carouselList.value[i];
+      await updateCarousel({
+        id: row.id,
+        imageUrl: row.image || row.imageUrl,
+        link: row.link,
+        target: row.target,
+        status: row.status,
+        sortOrder: i
+      });
+    }
+  } catch (error) {
+    console.error('排序更新失败:', error);
+    ElMessage.error('排序更新失败');
+  }
 };
 
 // 颜色转换工具:Hex 转 RGBA
@@ -1764,9 +1832,98 @@ const onFileChange = (e) => {
   reader.readAsDataURL(file);
 };
 
+// ==================== 左侧广告单例配置 ====================
+
+// 获取左侧广告配置
+const fetchLeftAdConfig = async () => {
+  try {
+    const res = await listAdLeft({ pageNum: 1, pageSize: 1 });
+    if (res.code === 200 && res.rows && res.rows.length > 0) {
+      const adData = res.rows[0];
+      leftAdId.value = adData.id;
+      form.leftAdImage = adData.imageUrl || '';
+      form.leftAdLink = adData.link || '';
+    }
+  } catch (error) {
+    console.error('获取左侧广告配置失败:', error);
+  }
+};
+
+// 保存左侧广告配置
+const saveLeftAdConfig = async () => {
+  try {
+    if (!form.leftAdImage) {
+      ElMessage.warning('请先上传广告图片');
+      return;
+    }
+
+    const submitData: AdLeftForm = {
+      id: leftAdId.value || undefined,
+      imageUrl: form.leftAdImage,
+      link: form.leftAdLink,
+      status: 1 // 默认启用
+    };
+
+    let res;
+    if (leftAdId.value) {
+      // 有ID则更新
+      res = await updateAdLeft(submitData);
+    } else {
+      // 无ID则新增
+      res = await addAdLeft(submitData);
+    }
+
+    if (res.code === 200) {
+      ElMessage.success('左侧广告保存成功');
+      // 如果是新增,保存返回的ID
+      if (!leftAdId.value && res.data) {
+        leftAdId.value = res.data.id;
+      }
+      // 重新获取最新配置
+      await fetchLeftAdConfig();
+    } else {
+      ElMessage.error(res.msg || '保存失败');
+    }
+  } catch (error) {
+    console.error('保存左侧广告失败:', error);
+    ElMessage.error('保存左侧广告失败');
+  }
+};
+
+// 删除左侧广告
 const handleDeleteLeftAd = () => {
-  form.leftAdImage = '';
-  ElMessage.success('已删除左侧广告图');
+  ElMessageBox.confirm('确定要删除左侧广告吗?', '提示', {
+    confirmButtonText: '确定删除',
+    cancelButtonText: '取消',
+    type: 'warning'
+  })
+    .then(async () => {
+      try {
+        if (leftAdId.value) {
+          const res = await delAdLeft(leftAdId.value);
+          if (res.code === 200) {
+            ElMessage.success('删除成功');
+            // 清空表单数据
+            leftAdId.value = '';
+            form.leftAdImage = '';
+            form.leftAdLink = '';
+          } else {
+            ElMessage.error(res.msg || '删除失败');
+          }
+        } else {
+          // 如果没有ID,直接清空表单
+          form.leftAdImage = '';
+          form.leftAdLink = '';
+          ElMessage.success('已清除');
+        }
+      } catch (error) {
+        console.error('删除左侧广告失败:', error);
+        ElMessage.error('删除失败');
+      }
+    })
+    .catch(() => {
+      // 用户取消操作
+    });
 };
 
 // 分类设置模块逻辑
@@ -2788,6 +2945,8 @@ onMounted(() => {
   startPlaceholderScroll();
   // 获取当前配置
   getCurrentSearch();
+  getCurrentAdLeftBtn();
+  getCarouselList();
   // 获取左侧广告配置
   nextTick(() => {
     updateNavArrows();