头部分类

src/api/enterprisePurchase/headerCategory/index.ts

@@ -0,0 +1,63 @@
+import request from '@/utils/request';
+import { AxiosPromise } from 'axios';
+import { HeaderCategoryVO, HeaderCategoryForm, HeaderCategoryQuery } from '@/api/enterprisePurchase/headerCategory/types';
+
+/**
+ * 查询头部分类管理列表
+ * @param query
+ * @returns {*}
+ */
+
+export const listHeaderCategory = (query?: HeaderCategoryQuery): AxiosPromise<HeaderCategoryVO[]> => {
+  return request({
+    url: '/mall/headerCategory/list',
+    method: 'get',
+    params: query
+  });
+};
+
+/**
+ * 查询头部分类管理详细
+ * @param id
+ */
+export const getHeaderCategory = (id: string | number): AxiosPromise<HeaderCategoryVO> => {
+  return request({
+    url: '/mall/headerCategory/' + id,
+    method: 'get'
+  });
+};
+
+/**
+ * 新增头部分类管理
+ * @param data
+ */
+export const addHeaderCategory = (data: HeaderCategoryForm) => {
+  return request({
+    url: '/mall/headerCategory',
+    method: 'post',
+    data: data
+  });
+};
+
+/**
+ * 修改头部分类管理
+ * @param data
+ */
+export const updateHeaderCategory = (data: HeaderCategoryForm) => {
+  return request({
+    url: '/mall/headerCategory',
+    method: 'put',
+    data: data
+  });
+};
+
+/**
+ * 删除头部分类管理
+ * @param id
+ */
+export const delHeaderCategory = (id: string | number | Array<string | number>) => {
+  return request({
+    url: '/mall/headerCategory/' + id,
+    method: 'delete'
+  });
+};

src/api/enterprisePurchase/headerCategory/types.ts

@@ -0,0 +1,116 @@
+export interface HeaderCategoryVO {
+  /**
+   * 主键ID
+   */
+  id: string | number;
+
+  /**
+   * 分类名称 
+   */
+  title: string;
+
+  /**
+   * 分类图标URL 
+   */
+  icon: string;
+
+  /**
+   * 跳转地址 
+   */
+  link: string;
+
+  /**
+   * 打开方式: current(当前页), new(新窗口) (对应前端: headerForm.openMode)
+   */
+  openMode: string;
+
+  /**
+   * 启用状态: 1-启用, 0-禁用
+   */
+  status: number;
+
+  /**
+   * 备注
+   */
+  remark: string;
+
+}
+
+export interface HeaderCategoryForm extends BaseEntity {
+  /**
+   * 主键ID
+   */
+  id?: string | number;
+
+  /**
+   * 分类名称 
+   */
+  title?: string;
+
+  /**
+   * 分类图标URL 
+   */
+  icon?: string;
+
+  /**
+   * 跳转地址 
+   */
+  link?: string;
+
+  /**
+   * 打开方式: current(当前页), new(新窗口) (对应前端: headerForm.openMode)
+   */
+  openMode?: string;
+
+  /**
+   * 启用状态: 1-启用, 0-禁用
+   */
+  status?: number;
+
+  /**
+   * 备注
+   */
+  remark?: string;
+
+}
+
+export interface HeaderCategoryQuery extends PageQuery {
+
+  /**
+   * 分类名称 
+   */
+  title?: string;
+
+  /**
+   * 分类图标URL 
+   */
+  icon?: string;
+
+  /**
+   * 跳转地址 
+   */
+  link?: string;
+
+  /**
+   * 打开方式: current(当前页), new(新窗口) (对应前端: headerForm.openMode)
+   */
+  openMode?: string;
+
+  /**
+   * 启用状态: 1-启用, 0-禁用
+   */
+  status?: number;
+
+  /**
+   * 平台标识
+   */
+  platformCode?: string;
+
+    /**
+     * 日期范围参数
+     */
+    params?: any;
+}
+
+
+

src/views/enterprisePurchase/index.vue

@@ -1468,6 +1468,14 @@ import { listAdLeft, getAdLeft, delAdLeft, addAdLeft, updateAdLeft, getCurrentAd
 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 {
+  listHeaderCategory,
+  getHeaderCategory,
+  delHeaderCategory,
+  addHeaderCategory,
+  updateHeaderCategory
+} from '@/api/enterprisePurchase/headerCategory';
+import { HeaderCategoryVO, HeaderCategoryQuery, HeaderCategoryForm } from '@/api/enterprisePurchase/headerCategory/types';
 import {
   ShoppingCart,
   Plus,
@@ -2301,39 +2309,20 @@ onMounted(() => {
 
 // 头部分类模块逻辑
 const headerThemeColor = ref('#e60012');
-const headerCategoryList = ref([
-  {
-    id: 1,
-    title: '公共采购',
-    icon: 'https://img.alicdn.com/imgextra/i2/O1CN01Z7Z7Z71C0oY7Z7Z7Z_!!6000000001234-0-tps-16-16.png',
-    link: '',
-    openMode: 'current',
-    status: 1
-  },
-  {
-    id: 2,
-    title: '跟买指南',
-    icon: 'https://img.alicdn.com/imgextra/i4/O1CN01fUvK6J1h8GkY0U7Z7_!!6000000004231-0-tps-16-16.png',
-    link: '',
-    openMode: 'current',
-    status: 1
-  },
-  {
-    id: 3,
-    title: '五金城',
-    icon: 'https://img.alicdn.com/imgextra/i3/O1CN01Z7Z7Z71C0oY7Z7Z7Z_!!6000000001234-0-tps-16-16.png',
-    link: '',
-    openMode: 'current',
-    status: 1
-  },
-  { id: 4, title: '电脑数码', icon: '', link: '', openMode: 'current', status: 1 },
-  { id: 5, title: '企业超市', icon: '', link: '', openMode: 'current', status: 1 },
-  { id: 6, title: '企业服务', icon: '', link: '', openMode: 'current', status: 1 },
-  { id: 7, title: '家电家居', icon: '', link: '', openMode: 'current', status: 1 },
-  { id: 8, title: '京东京造', icon: '', link: '', openMode: 'current', status: 1 },
-  { id: 9, title: '企业养车', icon: '', link: '', openMode: 'current', status: 1 },
-  { id: 10, title: '员工福利', icon: '', link: '', openMode: 'current', status: 1 }
-]);
+const headerCategoryList = ref<HeaderCategoryVO[]>([]);
+
+// 获取头部分类列表
+const getHeaderCategoryList = async () => {
+  try {
+    const res = await listHeaderCategory();
+    if (res.code === 200 && res.rows) {
+      headerCategoryList.value = res.rows;
+    }
+  } catch (error) {
+    console.error('获取头部分类列表失败:', error);
+    ElMessage.error('获取头部分类列表失败');
+  }
+};
 
 const headerDialogVisible = ref(false);
 const headerEditIndex = ref(-1);
@@ -2351,21 +2340,59 @@ const handleEditHeaderCategory = (row, index) => {
   headerDialogVisible.value = true;
 };
 
-const submitHeaderForm = () => {
-  if (headerEditIndex.value > -1) {
-    headerCategoryList.value[headerEditIndex.value] = { ...headerForm };
-  } else {
-    headerCategoryList.value.push({ id: Date.now(), ...headerForm });
+const submitHeaderForm = async () => {
+  const data: HeaderCategoryForm = {
+    title: headerForm.title,
+    icon: headerForm.icon,
+    link: headerForm.link,
+    openMode: headerForm.openMode,
+    status: headerForm.status
+  };
+
+  try {
+    if (headerEditIndex.value > -1) {
+      const id = headerCategoryList.value[headerEditIndex.value]?.id;
+      const res = await updateHeaderCategory({ ...data, id });
+      if (res.code === 200) {
+        ElMessage.success('修改成功');
+        headerDialogVisible.value = false;
+        getHeaderCategoryList();
+      } else {
+        ElMessage.error(res.msg || '修改失败');
+      }
+    } else {
+      const res = await addHeaderCategory(data);
+      if (res.code === 200) {
+        ElMessage.success('新增成功');
+        headerDialogVisible.value = false;
+        getHeaderCategoryList();
+      } else {
+        ElMessage.error(res.msg || '新增失败');
+      }
+    }
+  } catch (error) {
+    console.error('操作失败:', error);
+    ElMessage.error('操作失败');
   }
-  headerDialogVisible.value = false;
-  ElMessage.success('保存成功');
 };
 
-const handleDeleteHeaderCategory = (index) => {
-  ElMessageBox.confirm('确定删除该分类吗？', '提示').then(() => {
-    headerCategoryList.value.splice(index, 1);
-    ElMessage.success('删除成功');
-  });
+const handleDeleteHeaderCategory = async (index: number) => {
+  const item = headerCategoryList.value[index];
+  try {
+    await ElMessageBox.confirm('确定删除该分类吗？', '提示');
+    const res = await delHeaderCategory(item.id);
+    if (res.code === 200) {
+      ElMessage.success('删除成功');
+      getHeaderCategoryList();
+    } else {
+      ElMessage.error(res.msg || '删除失败');
+    }
+  } catch (error) {
+    if (error !== 'cancel') {
+      console.error('删除失败:', error);
+      ElMessage.error('删除失败');
+    }
+  }
 };
 
 const moveHeader = (index, delta) => {
@@ -2947,6 +2974,7 @@ onMounted(() => {
   getCurrentSearch();
   getCurrentAdLeftBtn();
   getCarouselList();
+  getHeaderCategoryList();
   // 获取左侧广告配置
   nextTick(() => {
     updateNavArrows();