xiabin修改路由

src/api/brand/index.js

@@ -1,6 +1,6 @@
 import request from "@/utils/request";
 
-// 获取商品管理列表
+// 获取品牌管理列表
 export function getBrandbaseList(query) {
   return request({
     url: "/brand/brandbase/page",
@@ -27,7 +27,7 @@ export function updateBrand(data) {
 // 删除品牌
 export function deleteBrand(id) {
   return request({
-    url: `/brand/brandbase/del/${id}`,
+    url: '/brand/brandbase/del?ids=' + id,
     method: "delete",
   });
 }
@@ -39,3 +39,43 @@ export function getBrandInfo(id) {
     method: "get",
   });
 }
+export function updateStatusBrand(data) {
+  return request({
+    url: "brand/brandbase/updateStatus",
+    method: "post",
+    data: data,
+  });
+}
+// 获取品牌审核列表
+export function applicationrecord(query) {
+  return request({
+    url: "/brand/applicationrecord/page",
+    method: "get",
+    params: query,
+  });
+}
+// 品牌审核驳回
+export function rejectBrand(data) {
+  return request({
+    url: "/brand/applicationrecord/approve",
+    method: "post",
+    data: data,
+  });
+}
+
+// 获取续期列表
+export function applicationrecordList(query) {
+  return request({
+    url: "/brand/applicationrenewal/page",
+    method: "get",
+    params: query,
+  });
+}
+// 续期审核驳回
+export function applicationrenewalApprove(data) {
+  return request({
+    url: "/brand/applicationrenewal/approve",
+    method: "post",
+    data: data,
+  });
+}

src/assets/styles/custom.scss

@@ -218,6 +218,7 @@
   height: 100%;
   left: 0;
   right: 0;
+  min-width: 1000px;
 }
 // 表格组件中的各插槽元素自定义样式
 .custom-tooltip-content {

src/components/tableComponent.vue

@@ -59,6 +59,7 @@
           :label="column.label"
           :width="column.width"
           :align="column.align || 'center'"
+          :fixed="column.fixed ?? false"
           :sortable="column.sortable"
           :header-class-name="column.headerClassName"
         >
@@ -340,7 +341,7 @@ onBeforeUnmount(() => {
 
   /* 自定义鼠标悬停颜色 */
   :deep(.el-table__body tr:hover > td) {
-    background-color: rgba(37, 191, 130, 0.1) !important;
+    background-color: rgba(237 255 248) !important;
   }
 
   /* 自定义表头样式 */

src/layout/components/Sidebar/Logo.vue

@@ -116,7 +116,8 @@ getUser();
     & .sidebar-title {
       display: inline-block;
       margin: 0;
-      color: v-bind(getLogoTextColor);
+      // color: v-bind(getLogoTextColor);
+      color: #000;
       font-weight: 600;
       line-height: 50px;
       font-size: 14px;

src/views/brand/applicationReview/index.vue

@@ -1,6 +1,396 @@
 <template>
-    <div class="app-container">
+  <div class="app-container customer-control">
-        开发中...
+    <div class="container-custom">
+      <!-- 搜索栏 -->
+      <div ref="searchBarRef" class="search-box">
+        <div class="search-bar">
+          <div class="search-bar-left">
+            <el-form
+              ref="searchForm"
+              :inline="true"
+              :model="formInline"
+              class="demo-form-inline"
+              :label-width="'auto'"
+            >
+              <el-form-item label="品牌编码" prop="brandCode">
+                <el-input
+                  v-model="formInline.brandCode"
+                  placeholder="请输入品牌编码"
+                  clearable
+                />
+              </el-form-item>
+              <el-form-item label="品牌名称" prop="brandTitle">
+                <el-input
+                  v-model="formInline.brandTitle"
+                  placeholder="请输入品牌名称"
+                  clearable
+                />
+              </el-form-item>
+              <el-form-item label="审核状态" prop="status">
+                <el-select v-model="formInline.status" placeholder="请选择" clearable>
+                  <el-option v-for="item in statusList" :key="item.id" :value="item.id" :label="item.name" />
+                </el-select>
+              </el-form-item>
+              <el-form-item
+                label="添加时间"
+                prop="startDate"
+                style="margin-right: 0"
+              >
+                <el-date-picker
+                  v-model="formInline.startDate"
+                  type="date"
+                  value-format="YYYY-MM-DD"
+                  placeholder="请选择起始日期"
+                  clearable
+                  :disabled-date="disableStartDate"
+                  style="width: 160px"
+                />
+                <span
+                  style="width: 30px; text-align: center; display: inline-block"
+                >
+                  -
+                </span>
+                <el-date-picker
+                  v-model="formInline.endDate"
+                  type="date"
+                  value-format="YYYY-MM-DD"
+                  placeholder="请选择截止日期"
+                  clearable
+                  :disabled-date="disableEndDate"
+                  style="width: 160px"
+                />
+              </el-form-item>
+            </el-form>
+          </div>
+          <div class="search-bar-right">
+            <el-button class="el-button-gry" type="primary" icon="Search" @click="onSubmit"
+              >查询</el-button
+            >
+            <el-button
+              icon="Refresh"
+              style="margin: 16px 0 0 0"
+              @click="resetForm"
+              >重置</el-button
+            >
+          </div>
+        </div>
+      </div>
+      <!-- 表格 -->
+      <div class="table-cont" :style="{ height: tableViewportHeight + 'px' }">
+        <tableComponent :table-data="tableData" :columns="columns" :show-border="false" :show-selection="false"
+          :header-cell-class-name="getHeaderClass" @page-change="handlePaginationChange"
+          @selection-change="handleSelectionChange" :total="tableTotal" :current-page="formInline.current"
+          :page-size="formInline.size">
+        <!-- 自定义-图片 -->
+          <template #brandUrl="slotProps">
+            <div class="table-cell-img-box">
+              <img :src="slotProps.row.brandUrl" class="table-cell-img" alt="" />
+            </div>
+          </template>
+          <!-- 自定义-状态 -->
+          <template #status="slotProps">
+            <span v-if="slotProps.row.status == 1" class="color-red"
+              >待审核</span
+            >
+            <span v-else-if="slotProps.row.status == 2" class="color-green"
+              >已审核</span
+            >
+            <span v-else-if="slotProps.row.status == 3" class="color-orange"
+              >已驳回</span
+            >
+          </template>
+
+          <!-- 自定义-操作 -->         
+          <template #action="slotProps">
+            <el-button :disabled="slotProps.row.status == 2" v-if="slotProps.row.status != 3" text class="el-button-custom" :class="slotProps.row.status == 2 ? 'el-button-disabled' : ''" @click="auditRejected(slotProps.row,2)">审核</el-button>
+            <el-button :disabled="slotProps.row.status == 2" v-if="slotProps.row.status != 3" text class="el-button-delete" :class="slotProps.row.status == 2 ? 'el-button-disabled' : ''" @click="auditRejected(slotProps.row,3)">驳回</el-button>
+            <el-button v-if="slotProps.row.status == 3" text class="el-button-custom" @click="reason(slotProps.row)">查看驳回原因</el-button>
+          </template>
+        </tableComponent>
+      </div>
     </div>
+  </div>
 </template>
-<script setup></script>
+<script setup>
+import { ref, reactive, computed, onMounted, onBeforeUnmount } from "vue";
+import tableComponent from "@/components/tableComponent.vue";
+import myUploadImage from "@/components/myUploadImage.vue";
+import Mock from "mockjs";
+import {applicationrecord,rejectBrand} from "@/api/brand/index";
+import { id } from "element-plus/es/locales.mjs";
+import { ElMessage,ElMessageBox } from "element-plus";
+
+const formInline = reactive({
+  id: "",
+  brandUrl:'',//商品图片
+  brandTitle: "",//商品名称
+  brandCode:'',//商品编码
+//   phoneNumber: "",//时间
+//   applicationNum:'',//申请数量
+//   useNum:'',//使用数量
+  status: "",//状态
+  createTime:'',//申请时间
+//   startDate: "",//开始时间
+//   endDate: "",//结束时间
+  current: 1,
+  size: 10,
+});
+
+const statusList = ref([
+    { name: "待审核", id: "1" },
+    { name: "已审核", id: "2" },
+    { name: "已驳回", id: "3" },
+]);
+
+// 禁用开始日期的逻辑（不能晚于已选的结束日期）
+const disableStartDate = (time) => {
+  if (!formInline.endDate) return false;
+  const endDate = new Date(formInline.endDate);
+  return time.getTime() > endDate.getTime();
+};
+
+// 禁用结束日期的逻辑（不能早于已选的开始日期）
+const disableEndDate = (time) => {
+  if (!formInline.startDate) return false;
+  const startDate = new Date(formInline.startDate).setHours(0, 0, 0, 0);
+  const currentDate = new Date(time).setHours(0, 0, 0, 0);
+  return currentDate < startDate;
+};
+
+const searchForm = ref(null);
+
+// 加载数据
+const loadData = async () => {
+
+  tableLoading.value = true;
+  let prams = { ...formInline };
+
+  try {
+    prams.startDate = formInline.startDate ? formInline.startDate + " 00:00:00" : "";
+    prams.endDate = formInline.endDate ? formInline.endDate + " 23:59:59" : "";
+    let response = await applicationrecord(prams);
+    if (response.code == 200) {
+      tableData.value = response.data.records;
+      tableTotal.value = response.data.total;
+    }
+  } catch (error) {
+    
+  }
+  tableLoading.value = false;
+};
+
+const onSubmit = () => {
+  formInline.current = 1;
+  loadData();
+};
+
+const resetForm = () => {
+  searchForm.value.resetFields();
+  formInline.endDate = "";
+  loadData();
+};
+
+// 表格数据
+const tableData = ref([]);
+const tableLoading = ref(false);
+const tableTotal = ref(0);
+let nowClickRow = ref({});
+// 列配置
+const columns = ref([
+  { prop: "id", label: "ID" },
+  { prop: "brandUrl", label: "品牌LOGO", slotName:'brandUrl', width: "120", align: "left" },
+  { prop: "brandTitle", label: "品牌名称" },
+  { prop: "brandCode", label: "品牌编码", },
+//   { prop: "code", label: "申请账号名称", width: "120" },
+//   { prop: "useNum", label: "申请账号" },
+  { prop: "createTime", label: "申请时间" },
+  { prop: "status", label: "状态", slotName: "status",width: "100" },
+  { prop: "action", label: "操作", slotName: "action",width: "140",align: "center" },
+]);
+
+// 审核与驳回
+const auditRejected = (row,index) => {
+    console.log('row',index,row);
+    if(index == 2){
+        ElMessageBox.confirm("确定审核通过吗？", "提示", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
+    })
+      .then(async () => {
+        let response = await rejectBrand({ id: row.id, status: index });
+        if (response.code == 200) {
+          ElMessage({
+            message: "审核成功",
+            type: "success",
+          });
+          loadData();
+        }
+      })
+      .catch(() => {
+        ElMessage({
+          type: "info",
+          message: "已取消",
+        });
+      });
+    }else { 
+        ElMessageBox.prompt('请填写驳回原因', '提示', {
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            inputValidator: (value) => {
+                if (!value || value.trim() === '') {
+                return '驳回原因不能为空';
+                }
+                return true; // 验证通过
+            },
+            inputErrorMessage: '请填写驳回原因', // 默认错误提示
+            })
+            .then(async({ value }) => {
+                let response = await rejectBrand({ id: row.id, status: index,statusTxt: value });
+                if (response.code == 200) {
+                ElMessage({
+                    message: "已驳回",
+                    type: "success",
+                });
+                loadData();
+                }
+            })
+            .catch(() => {
+            ElMessage.info('已取消');
+            });
+    }
+    
+};
+
+//查看驳回原因
+const reason = (row) => {
+    ElMessageBox.alert(row.statusTxt, '驳回原因', {
+        confirmButtonText: '确定',
+    });
+}
+
+// 生成食物主题昵称
+const generateFoodNickname = () => {
+  // 形容词（情绪/风格）
+  const adjectives = [
+    "暴躁的",
+    "快乐的",
+    "忧郁的",
+    "疯狂的",
+    "安静的",
+    "慵懒的",
+    "甜甜的",
+    "咸咸的",
+    "酸酸的",
+    "辣辣的",
+  ];
+
+  // 食物名词（仅限食物）
+  const foods = [
+    "辣椒",
+    "西瓜",
+    "土豆",
+    "番茄",
+    "黄瓜",
+    "苹果",
+    "蛋糕",
+    "面包",
+    "披萨",
+    "冰淇淋",
+    "奶茶",
+    "咖啡",
+    "啤酒",
+    "炸鸡",
+  ];
+
+  // 随机组合：形容词 + 食物
+  return Mock.mock(`@pick(${adjectives})`) + Mock.mock(`@pick(${foods})`);
+};
+// 生成模拟数据
+const generateMockData = () => {
+  return Mock.mock({
+    "list|10": [
+      {
+        "id|+1": 10000,
+        nickname: () => generateFoodNickname(), //昵称
+        userName: "@cname", //姓名
+        accountNumber: Mock.mock("@id").toString().slice(0, 10), //账号
+        phoneNumber: "@integer(13000000000, 18999999999)", //手机号
+        sex: '@pick(["男", "女"])', //性别
+        "status|1": [0, 1], //0异常 1正常
+        "userCategory|1":
+          '@pick(["活跃/低消费", "活跃/中消费", "活跃/高消费"])', //用户分类
+        unitPrice: "@float(10, 200, 2, 2)", //客单价
+        ordersNums: "@integer(10, 200)",
+      },
+    ],
+  }).list;
+};
+// 自定义表头类名,也可以在columns指定列中添加headerClassName: 'custom-header'
+const getHeaderClass = ({ column }) => {
+  return "custom-header";
+};
+// 分页变化
+const handlePaginationChange = ({ page, pageSize }) => {
+  console.log("分页变化:", page, pageSize);
+  // 这里可以调用API获取新数据
+  loadData();
+};
+// 多选框变化
+const handleSelectionChange = (selection) => {
+  console.log("选中项:", selection);
+};
+
+const titleRef = ref(null);
+const searchBarRef = ref(null);
+const tableViewportHeight = ref(0);
+// 精确计算可用高度
+const calculateTableHeight = () => {
+  // 获取窗口总高度
+  const windowHeight = window.innerHeight;
+
+  // 获取各组件高度
+  const headerHeight = titleRef.value?.$el?.offsetHeight || 0;
+  const searchBarHeight = searchBarRef.value?.offsetHeight || 0;
+
+  // 计算容器内边距补偿（根据实际样式调整）
+  const paddingCompensation = 130;
+
+  // 最终计算
+  tableViewportHeight.value =
+    windowHeight - headerHeight - searchBarHeight - paddingCompensation;
+  // console.log(tableViewportHeight.value);
+};
+// 组件挂载时加载数据
+onMounted(() => {
+  loadData();
+
+  calculateTableHeight();
+
+  // 添加响应式监听
+  window.addEventListener("resize", calculateTableHeight);
+
+  // 监听DOM变化（适用于动态变化的header/searchbar）
+  const observer = new ResizeObserver(calculateTableHeight);
+  if (titleRef.value?.$el) observer.observe(titleRef.value.$el);
+  if (searchBarRef.value) observer.observe(searchBarRef.value);
+});
+onBeforeUnmount(() => {
+  window.removeEventListener("resize", calculateTableHeight);
+});
+</script>
+<style lang="scss" scoped>
+.table-toolbar {
+  width: 300px;
+  height: 50px;
+  position: absolute;
+  right: 0;
+  top: 0;
+  display: flex;
+  justify-content: end;
+  padding: 14px 16px 0 0;
+}
+.el-button-disabled{
+    color: #ccc !important;
+}
+</style>

src/views/brand/informationManagement/index.vue

@@ -122,8 +122,8 @@
 
           <!-- 自定义-操作 -->         
           <template #action="slotProps">
-            <el-button v-if="slotProps.row.status == 0" text class="el-button-custom" @click="seeDetails(slotProps.row)">启用</el-button>
+            <el-button v-if="slotProps.row.status == 0" text class="el-button-custom" @click="startStop(slotProps.row)">启用</el-button>
-            <el-button v-if="slotProps.row.status == 1" text class="el-button-custom" @click="seeDetails(slotProps.row)">停用</el-button>
+            <el-button v-if="slotProps.row.status == 1" text class="el-button-custom" @click="startStop(slotProps.row)">停用</el-button>
             <el-button text class="el-button-custom" @click="handleEdit(slotProps.row)">编辑</el-button>
             <el-button text class="el-button-delete" @click="handleDelete(slotProps.row)">删除</el-button>
           </template>
@@ -156,9 +156,9 @@ import { ref, reactive, computed, onMounted, onBeforeUnmount } from "vue";
 import tableComponent from "@/components/tableComponent.vue";
 import myUploadImage from "@/components/myUploadImage.vue";
 import Mock from "mockjs";
-import {getBrandbaseList,addBrand,updateBrand,deleteBrand,getBrandInfo} from "@/api/brand/index";
+import {getBrandbaseList,addBrand,updateBrand,deleteBrand,getBrandInfo,updateStatusBrand} from "@/api/brand/index";
 import { id } from "element-plus/es/locales.mjs";
-import { ElMessage } from "element-plus";
+import { ElMessage,ElMessageBox } from "element-plus";
 
 const formInline = reactive({
   id: "",
@@ -246,79 +246,25 @@ const resetForm = () => {
 
 // 表格数据
 const tableData = ref([]);
+const selectedIds = ref([]);
+const btnStatus = computed(() => {
+  return selectedIds.value.length <= 0;
+});
 const tableLoading = ref(false);
 const tableTotal = ref(0);
 let nowClickRow = ref({});
 // 列配置
 const columns = ref([
   { prop: "id", label: "ID" },
-  { prop: "imgPath", label: "商品图片", slotName:'imgPath', width: "120", align: "left" },
+  { prop: "imgPath", label: "品牌LOGO", slotName:'imgPath', width: "120", align: "left" },
-  { prop: "title", label: "商品名称" },
+  { prop: "title", label: "品牌名称" },
-  { prop: "code", label: "商品编码", width: "120" },
+  { prop: "code", label: "品牌编码", width: "120" },
   { prop: "createTime", label: "时间", width: "120" },
   { prop: "applicationNum", label: "申请数量" },
   { prop: "useNum", label: "使用数量" },
-  { prop: "status", label: "状态", slotName: "status" },
+  { prop: "status", label: "状态", slotName: "status", width: "140"},
   { prop: "action", label: "操作", slotName: "action",width: "140",align: "center" },
 ]);
-
-// 生成食物主题昵称
-const generateFoodNickname = () => {
-  // 形容词（情绪/风格）
-  const adjectives = [
-    "暴躁的",
-    "快乐的",
-    "忧郁的",
-    "疯狂的",
-    "安静的",
-    "慵懒的",
-    "甜甜的",
-    "咸咸的",
-    "酸酸的",
-    "辣辣的",
-  ];
-
-  // 食物名词（仅限食物）
-  const foods = [
-    "辣椒",
-    "西瓜",
-    "土豆",
-    "番茄",
-    "黄瓜",
-    "苹果",
-    "蛋糕",
-    "面包",
-    "披萨",
-    "冰淇淋",
-    "奶茶",
-    "咖啡",
-    "啤酒",
-    "炸鸡",
-  ];
-
-  // 随机组合：形容词 + 食物
-  return Mock.mock(`@pick(${adjectives})`) + Mock.mock(`@pick(${foods})`);
-};
-// 生成模拟数据
-const generateMockData = () => {
-  return Mock.mock({
-    "list|10": [
-      {
-        "id|+1": 10000,
-        nickname: () => generateFoodNickname(), //昵称
-        userName: "@cname", //姓名
-        accountNumber: Mock.mock("@id").toString().slice(0, 10), //账号
-        phoneNumber: "@integer(13000000000, 18999999999)", //手机号
-        sex: '@pick(["男", "女"])', //性别
-        "status|1": [0, 1], //0异常 1正常
-        "userCategory|1":
-          '@pick(["活跃/低消费", "活跃/中消费", "活跃/高消费"])', //用户分类
-        unitPrice: "@float(10, 200, 2, 2)", //客单价
-        ordersNums: "@integer(10, 200)",
-      },
-    ],
-  }).list;
-};
 // 自定义表头类名,也可以在columns指定列中添加headerClassName: 'custom-header'
 const getHeaderClass = ({ column }) => {
   return "custom-header";
@@ -332,11 +278,38 @@ const handlePaginationChange = ({ page, pageSize }) => {
 // 多选框变化
 const handleSelectionChange = (selection) => {
   console.log("选中项:", selection);
+  selectedIds.value = [];
+  selection.forEach(element => {
+    selectedIds.value.push(element.id);
+  });
+};
+
+// 批量删除
+const batchDelete = async () => {
+  // deleteGoods(selectedIds.value.join(","));
+  deleteGoods(selectedIds.value);
+};
+const deleteGoods = async (param) => {
+  console.log("批量删除参数:", param);
+  
+  try {
+    tableLoading.value = true;
+    let res = await deleteBrand(param);
+    tableLoading.value = false;
+    if (res.code == 200) {
+      ElMessage.success("删除成功");
+      loadData();
+    } else {
+      ElMessage.error(res.msg);
+    }
+  } catch (error) {
+    tableLoading.value = false;
+  }
 };
 
 //  添加商品
 const handleAdd = () => {
-//   console.log("handleAdd!");
+resetDlg();
   dialogTitle.value = "添加品牌";
     isADD.value = true;
   dialogFormVisible.value = true;
@@ -369,45 +342,72 @@ const onSaveCategory = async () => {
         }
     }
   });
+};
 
-    
+//启用停用
+const startStop = async (row) => {
+  let status = row.status == 1 ? 0 : 1;
+  let params = { id: row.id, status: status };
+  let response = await updateStatusBrand(params);
+  if (response.code === 200) {
+    ElMessage.success("操作成功！");
+    loadData();
+  } else {
+    ElMessage.error(response.message);
+  }
 };
 
 // 编辑操作
 const handleEdit = async(row) => {
+  resetDlg();
     isADD.value = false;
-    dialogFormVisible.value = true;
+  dialogFormVisible.value = true;
-    let response = await getBrandInfo(row.id);
+  let response = await getBrandInfo(row.id);
-    if (response.code === 200) {
+  if (response.code === 200) {
-        dialogForm = response.data;
+    Object.assign(dialogForm, response.data); // 保持响应性
-        dialogTitle.value = "编辑品牌";
+    dialogTitle.value = "编辑品牌";
-    } else {
+  } else {
-        ElMessage.error(response.message);
+    ElMessage.error(response.message);
-    }
+  }
 };
 // 删除操作
 const handleDelete = async(row) => {
-  let response = await deleteBrand(row.id);
+  //提示一下是否确定删除
-    if (response.code === 200) {
+  ElMessageBox.confirm("确定要删除吗？", "提示", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(async () => {
+      let response = await deleteBrand(row.id);
+      if (response.code === 200) {
         ElMessage.success("品牌删除成功！");
         loadData();
-    } else {
+      } else {
         ElMessage.error(response.message);
-    }
+      }
+    })
+    .catch(() => {
+      ElMessage.info("已取消删除");
+    })
+  
 };
 //取消弹框
 const cancelDialog = () => {
-  dialogRef.value.resetFields();
+  resetDlg();
-  dialogFormVisible.value = false;
-  dialogTitle.value = "";
-  dialogForm.title  = "";
-  dialogForm.imgPath  = "";
-  dialogForm.id  = "";
-  dialogForm.code  = "";
-  console.log('dialogForm',dialogForm);
-  
 };
 
+const resetDlg= () => {
+  dialogRef.value?.resetFields(); // 重置表单验证状态
+  Object.assign(dialogForm, {  // 保持响应性，手动清空字段
+    id: "",
+    title: "",
+    imgPath: "",
+    code: ""
+  });
+  dialogFormVisible.value = false;
+}
+
 const titleRef = ref(null);
 const searchBarRef = ref(null);
 const tableViewportHeight = ref(0);

src/views/brand/management/index.vue

@@ -1,6 +1,445 @@
 <template>
-    <div class="app-container">
+  <div class="app-container customer-control">
-        开发中...
+    <div class="container-custom">
+      <!-- 搜索栏 -->
+      <div ref="searchBarRef" class="search-box">
+        <div class="search-bar">
+          <div class="search-bar-left">
+            <el-form
+              ref="searchForm"
+              :inline="true"
+              :model="formInline"
+              class="demo-form-inline"
+              :label-width="'auto'"
+            >
+              <el-form-item label="制度名称" prop="title">
+                <el-input
+                  v-model="formInline.title"
+                  placeholder="请输入品牌名称"
+                  clearable
+                />
+              </el-form-item>
+              <el-form-item label="状态" prop="status">
+                <el-select v-model="formInline.status" placeholder="请选择" clearable>
+                  <el-option v-for="item in statusList" :key="item.id" :value="item.id" :label="item.name" />
+                </el-select>
+              </el-form-item>
+              <el-form-item
+                label="添加时间"
+                prop="startDate"
+                style="margin-right: 0"
+              >
+                <el-date-picker
+                  v-model="formInline.startDate"
+                  type="date"
+                  value-format="YYYY-MM-DD"
+                  placeholder="请选择起始日期"
+                  clearable
+                  :disabled-date="disableStartDate"
+                  style="width: 160px"
+                />
+                <span
+                  style="width: 30px; text-align: center; display: inline-block"
+                >
+                  -
+                </span>
+                <el-date-picker
+                  v-model="formInline.endDate"
+                  type="date"
+                  value-format="YYYY-MM-DD"
+                  placeholder="请选择截止日期"
+                  clearable
+                  :disabled-date="disableEndDate"
+                  style="width: 160px"
+                />
+              </el-form-item>
+            </el-form>
+          </div>
+          <div class="search-bar-right">
+            <el-button class="el-button-gry" type="primary" icon="Search" @click="onSubmit"
+              >查询</el-button
+            >
+            <el-button
+              icon="Refresh"
+              style="margin: 16px 0 0 0"
+              @click="resetForm"
+              >重置</el-button
+            >
+          </div>
+        </div>
+      </div>
+      <!-- 表格 -->
+      <div class="table-cont" :style="{ height: tableViewportHeight + 'px' }">
+        <div class="table-toolbar">
+          <el-button
+            icon="delete"
+            @click="batchDelete"
+            :disabled="btnStatus"
+            style="margin-right: 10px"
+            >批量删除</el-button
+          >
+          <el-button type="primary" class="el-button-gry" icon="plus" @click="handleAdd"
+              >添加品牌</el-button
+            >
+        </div>
+        <tableComponent
+          :table-data="tableData"
+          :columns="columns"
+          :show-border="false"
+          :show-selection="true"
+          :header-cell-class-name="getHeaderClass"
+          @page-change="handlePaginationChange"
+          :loading="tableLoading"
+          @selection-change="handleSelectionChange"
+          :total="tableTotal"
+          :current-page="formInline.current"
+          :page-size="formInline.size"
+          :showSort="true"
+          :rowkey="'goodId'"
+        >
+          <!-- 自定义-状态 -->
+          <template #status="slotProps">
+            <span v-if="slotProps.row.status == 1" class="color-green"
+              >可使用</span
+            >
+            <span v-else-if="slotProps.row.status == 0" class="color-red"
+              >已停用</span
+            >
+          </template>
+
+          <!-- 自定义-操作 -->         
+          <template #action="slotProps">
+            <el-button v-if="slotProps.row.status == 0" text class="el-button-custom" @click="startStop(slotProps.row)">启用</el-button>
+            <el-button v-if="slotProps.row.status == 1" text class="el-button-custom" @click="startStop(slotProps.row)">停用</el-button>
+            <el-button text class="el-button-custom" @click="handleEdit(slotProps.row)">编辑</el-button>
+            <el-button text class="el-button-delete" @click="handleDelete(slotProps.row)">删除</el-button>
+          </template>
+        </tableComponent>
+      </div>
     </div>
+    <!-- 添加/编辑商品 -->
+    <el-dialog v-model="dialogFormVisible" :title="dialogTitle" width="500" :close-on-click-modal="false">
+      <el-form :model="dialogForm" :label-width="'80'" :rules="dialogFormRules" ref="dialogRef">
+        <el-form-item label="品牌名称" prop="title">
+          <el-input v-model="dialogForm.title" autocomplete="off" placeholder="请输入品牌名称" />
+        </el-form-item>
+        <el-form-item label="品牌图片" prop="imgPath">
+          <myUploadImage v-model="dialogForm.imgPath" :limit="1" ></myUploadImage>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="onSaveCategory">
+            保存
+          </el-button>
+          <el-button @click="cancelDialog">取消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
 </template>
-<script setup></script>
+<script setup>
+import { ref, reactive, computed, onMounted, onBeforeUnmount } from "vue";
+import tableComponent from "@/components/tableComponent.vue";
+import myUploadImage from "@/components/myUploadImage.vue";
+import Mock from "mockjs";
+import {getBrandbaseList,addBrand,updateBrand,deleteBrand,getBrandInfo,updateStatusBrand} from "@/api/brand/index";
+import { id } from "element-plus/es/locales.mjs";
+import { ElMessage,ElMessageBox } from "element-plus";
+
+const formInline = reactive({
+  id: "",
+  title: "",//商品名称
+  code:'',//商品编码
+  phoneNumber: "",//时间
+  applicationNum:'',//申请数量
+  useNum:'',//使用数量
+  status: "",//状态
+  startDate: "",//开始时间
+  endDate: "",//结束时间
+  current: 1,
+  size: 10,
+});
+
+let isADD = ref(true);
+const dialogFormVisible = ref(false);
+const dialogRef = ref(null);
+const dialogTitle = ref("添加品牌");
+let dialogForm = reactive({
+    id: "",
+    title: "",
+    imgPath:"",
+
+});
+const dialogFormRules = ref({
+    title:  [
+        { required: true, message: "请输入品牌名称", trigger: "blur" },
+    ]
+});
+
+const statusList = ref([
+    { name: "可使用", id: "1" },
+    { name: "已停用", id: "0" },
+]);
+
+// 禁用开始日期的逻辑（不能晚于已选的结束日期）
+const disableStartDate = (time) => {
+  if (!formInline.endDate) return false;
+  const endDate = new Date(formInline.endDate);
+  return time.getTime() > endDate.getTime();
+};
+
+// 禁用结束日期的逻辑（不能早于已选的开始日期）
+const disableEndDate = (time) => {
+  if (!formInline.startDate) return false;
+  const startDate = new Date(formInline.startDate).setHours(0, 0, 0, 0);
+  const currentDate = new Date(time).setHours(0, 0, 0, 0);
+  return currentDate < startDate;
+};
+
+const searchForm = ref(null);
+
+// 加载数据
+const loadData = async () => {
+
+  tableLoading.value = true;
+  let prams = { ...formInline };
+
+  try {
+    prams.startDate = formInline.startDate ? formInline.startDate + " 00:00:00" : "";
+    prams.endDate = formInline.endDate ? formInline.endDate + " 23:59:59" : "";
+    let response = await getBrandbaseList(prams);
+    if (response.code == 200) {
+      tableData.value = response.data.records;
+      tableTotal.value = response.data.total;
+    }
+  } catch (error) {
+    
+  }
+  tableLoading.value = false;
+};
+
+const onSubmit = () => {
+  formInline.current = 1;
+  loadData();
+};
+
+const resetForm = () => {
+  searchForm.value.resetFields();
+  formInline.endDate = "";
+  loadData();
+};
+
+// 表格数据
+const tableData = ref([]);
+const selectedIds = ref([]);
+const btnStatus = computed(() => {
+  return selectedIds.value.length <= 0;
+});
+const tableLoading = ref(false);
+const tableTotal = ref(0);
+let nowClickRow = ref({});
+// 列配置
+const columns = ref([
+  { prop: "id", label: "ID" },
+  { prop: "title", label: "制度名称" },
+//   { prop: "code", label: "品牌编码", width: "120" },
+  { prop: "createTime", label: "提交时间" },
+//   { prop: "applicationNum", label: "申请数量" },
+//   { prop: "useNum", label: "使用数量" },
+  { prop: "status", label: "状态", slotName: "status", },
+  { prop: "action", label: "操作", slotName: "action",align: "center" },
+]);
+// 自定义表头类名,也可以在columns指定列中添加headerClassName: 'custom-header'
+const getHeaderClass = ({ column }) => {
+  return "custom-header";
+};
+// 分页变化
+const handlePaginationChange = ({ page, pageSize }) => {
+  console.log("分页变化:", page, pageSize);
+  // 这里可以调用API获取新数据
+  loadData();
+};
+// 多选框变化
+const handleSelectionChange = (selection) => {
+  console.log("选中项:", selection);
+  selectedIds.value = [];
+  selection.forEach(element => {
+    selectedIds.value.push(element.id);
+  });
+};
+
+// 批量删除
+const batchDelete = async () => {
+  // deleteGoods(selectedIds.value.join(","));
+  deleteGoods(selectedIds.value);
+};
+const deleteGoods = async (param) => {
+  console.log("批量删除参数:", param);
+  
+  try {
+    tableLoading.value = true;
+    let res = await deleteBrand(param);
+    tableLoading.value = false;
+    if (res.code == 200) {
+      ElMessage.success("删除成功");
+      loadData();
+    } else {
+      ElMessage.error(res.msg);
+    }
+  } catch (error) {
+    tableLoading.value = false;
+  }
+};
+
+//  添加商品
+const handleAdd = () => {
+resetDlg();
+  dialogTitle.value = "添加品牌";
+    isADD.value = true;
+  dialogFormVisible.value = true;
+  // console.log(formInline);
+};
+//提交保存
+const onSaveCategory = async () => { 
+  dialogRef.value.validate(async (valid) => { 
+    if (valid) { 
+        if(isADD.value){
+            let response = await addBrand(dialogForm);
+            if (response.code === 200) {
+                dialogFormVisible.value = false;
+                ElMessage.success("新增成功！");
+                dialogRef.value.resetFields();
+                loadData();
+            } else {
+                ElMessage.error(response.message);
+            }
+        }else{ 
+            let response = await updateBrand(dialogForm);
+            if (response.code === 200) {
+                dialogFormVisible.value = false;
+                ElMessage.success("编辑成功！");
+                dialogRef.value.resetFields();
+                loadData();
+            } else {
+                ElMessage.error(response.message);
+            }
+        }
+    }
+  });
+};
+
+//启用停用
+const startStop = async (row) => {
+  let status = row.status == 1 ? 0 : 1;
+  let params = { id: row.id, status: status };
+  let response = await updateStatusBrand(params);
+  if (response.code === 200) {
+    ElMessage.success("操作成功！");
+    loadData();
+  } else {
+    ElMessage.error(response.message);
+  }
+};
+
+// 编辑操作
+const handleEdit = async(row) => {
+  resetDlg();
+    isADD.value = false;
+  dialogFormVisible.value = true;
+  let response = await getBrandInfo(row.id);
+  if (response.code === 200) {
+    Object.assign(dialogForm, response.data); // 保持响应性
+    dialogTitle.value = "编辑品牌";
+  } else {
+    ElMessage.error(response.message);
+  }
+};
+// 删除操作
+const handleDelete = async(row) => {
+  //提示一下是否确定删除
+  ElMessageBox.confirm("确定要删除吗？", "提示", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(async () => {
+      let response = await deleteBrand(row.id);
+      if (response.code === 200) {
+        ElMessage.success("品牌删除成功！");
+        loadData();
+      } else {
+        ElMessage.error(response.message);
+      }
+    })
+    .catch(() => {
+      ElMessage.info("已取消删除");
+    })
+  
+};
+//取消弹框
+const cancelDialog = () => {
+  resetDlg();
+};
+
+const resetDlg= () => {
+  dialogRef.value?.resetFields(); // 重置表单验证状态
+  Object.assign(dialogForm, {  // 保持响应性，手动清空字段
+    id: "",
+    title: "",
+    imgPath: "",
+    code: ""
+  });
+  dialogFormVisible.value = false;
+}
+
+const titleRef = ref(null);
+const searchBarRef = ref(null);
+const tableViewportHeight = ref(0);
+// 精确计算可用高度
+const calculateTableHeight = () => {
+  // 获取窗口总高度
+  const windowHeight = window.innerHeight;
+
+  // 获取各组件高度
+  const headerHeight = titleRef.value?.$el?.offsetHeight || 0;
+  const searchBarHeight = searchBarRef.value?.offsetHeight || 0;
+
+  // 计算容器内边距补偿（根据实际样式调整）
+  const paddingCompensation = 130;
+
+  // 最终计算
+  tableViewportHeight.value =
+    windowHeight - headerHeight - searchBarHeight - paddingCompensation;
+  // console.log(tableViewportHeight.value);
+};
+// 组件挂载时加载数据
+onMounted(() => {
+  loadData();
+
+  calculateTableHeight();
+
+  // 添加响应式监听
+  window.addEventListener("resize", calculateTableHeight);
+
+  // 监听DOM变化（适用于动态变化的header/searchbar）
+  const observer = new ResizeObserver(calculateTableHeight);
+  if (titleRef.value?.$el) observer.observe(titleRef.value.$el);
+  if (searchBarRef.value) observer.observe(searchBarRef.value);
+});
+onBeforeUnmount(() => {
+  window.removeEventListener("resize", calculateTableHeight);
+});
+</script>
+<style lang="scss" scoped>
+.table-toolbar {
+  width: 300px;
+  height: 50px;
+  position: absolute;
+  right: 0;
+  top: 0;
+  display: flex;
+  justify-content: end;
+  padding: 14px 16px 0 0;
+}
+</style>

src/views/brand/renewal/index.vue

@@ -1,6 +1,345 @@
 <template>
-    <div class="app-container">
+  <div class="app-container customer-control">
-        开发中...
+    <div class="container-custom">
+      <!-- 搜索栏 -->
+      <div ref="searchBarRef" class="search-box">
+        <div class="search-bar">
+          <div class="search-bar-left">
+            <el-form
+              ref="searchForm"
+              :inline="true"
+              :model="formInline"
+              class="demo-form-inline"
+              :label-width="'auto'"
+            >
+              <el-form-item label="品牌编码" prop="code">
+                <el-input
+                  v-model="formInline.code"
+                  placeholder="请输入品牌编码"
+                  clearable
+                />
+              </el-form-item>
+              <el-form-item label="品牌名称" prop="brandTitle">
+                <el-input
+                  v-model="formInline.brandTitle"
+                  placeholder="请输入品牌名称"
+                  clearable
+                />
+              </el-form-item>
+              <el-form-item label="审核状态" prop="renewalStatus">
+                <el-select v-model="formInline.renewalStatus" placeholder="请选择" clearable>
+                  <el-option v-for="item in statusList" :key="item.id" :value="item.id" :label="item.name" />
+                </el-select>
+              </el-form-item>
+              <el-form-item
+                label="添加时间"
+                prop="startDate"
+                style="margin-right: 0"
+              >
+                <el-date-picker
+                  v-model="formInline.startDate"
+                  type="date"
+                  value-format="YYYY-MM-DD"
+                  placeholder="请选择起始日期"
+                  clearable
+                  :disabled-date="disableStartDate"
+                  style="width: 160px"
+                />
+                <span
+                  style="width: 30px; text-align: center; display: inline-block"
+                >
+                  -
+                </span>
+                <el-date-picker
+                  v-model="formInline.endDate"
+                  type="date"
+                  value-format="YYYY-MM-DD"
+                  placeholder="请选择截止日期"
+                  clearable
+                  :disabled-date="disableEndDate"
+                  style="width: 160px"
+                />
+              </el-form-item>
+            </el-form>
+          </div>
+          <div class="search-bar-right">
+            <el-button class="el-button-gry" type="primary" icon="Search" @click="onSubmit"
+              >查询</el-button
+            >
+            <el-button
+              icon="Refresh"
+              style="margin: 16px 0 0 0"
+              @click="resetForm"
+              >重置</el-button
+            >
+          </div>
+        </div>
+      </div>
+      <!-- 表格 -->
+      <div class="table-cont" :style="{ height: tableViewportHeight + 'px' }">
+        <tableComponent :table-data="tableData" :columns="columns" :show-border="false" :show-selection="false"
+          :header-cell-class-name="getHeaderClass" @page-change="handlePaginationChange"
+          @selection-change="handleSelectionChange" :total="tableTotal" :current-page="formInline.current"
+          :page-size="formInline.size">
+        <!-- 自定义-图片 -->
+          <template #brandUrl="slotProps">
+            <div class="table-cell-img-box">
+              <img :src="slotProps.row.brandUrl" class="table-cell-img" alt="" />
+            </div>
+          </template>
+
+          <!-- 自定义-延期时间 -->
+          <template #renewalTimeNum="slotProps">
+            <span>{{ slotProps.row.renewalTimeNum }}{{ slotProps.row.renewalTimeUnit==1?'天':slotProps.row.renewalTimeUnit==2?'月':'年' }}</span>
+          </template>
+
+          <!-- 自定义-状态 -->
+          <template #renewalStatus="slotProps">
+            <span v-if="slotProps.row.renewalStatus == 1" class="color-red"
+              >待审核</span
+            >
+            <span v-else-if="slotProps.row.renewalStatus == 2" class="color-green"
+              >已审核</span
+            >
+            <span v-else-if="slotProps.row.renewalStatus == 3" class="color-orange"
+              >已驳回</span
+            >
+          </template>
+
+          <!-- 自定义-操作 -->         
+          <template #action="slotProps">
+            <el-button :disabled="slotProps.row.renewalStatus == 2" v-if="slotProps.row.renewalStatus != 3" text class="el-button-custom" :class="slotProps.row.renewalStatus == 2 ? 'el-button-disabled' : ''" @click="auditRejected(slotProps.row,2)">审核</el-button>
+            <el-button :disabled="slotProps.row.renewalStatus == 2" v-if="slotProps.row.renewalStatus != 3" text class="el-button-delete" :class="slotProps.row.renewalStatus == 2 ? 'el-button-disabled' : ''" @click="auditRejected(slotProps.row,3)">驳回</el-button>
+            <el-button v-if="slotProps.row.renewalStatus == 3" text class="el-button-custom" @click="reason(slotProps.row)">查看驳回原因</el-button>
+          </template>
+        </tableComponent>
+      </div>
     </div>
+  </div>
 </template>
-<script setup></script>
+<script setup>
+import { ref, reactive, computed, onMounted, onBeforeUnmount } from "vue";
+import tableComponent from "@/components/tableComponent.vue";
+import myUploadImage from "@/components/myUploadImage.vue";
+import Mock from "mockjs";
+import {applicationrecordList,applicationrenewalApprove} from "@/api/brand/index";
+import { id } from "element-plus/es/locales.mjs";
+import { ElMessage,ElMessageBox } from "element-plus";
+
+const formInline = reactive({
+  id: "",
+  brandUrl:'',//商品图片
+  brandTitle: "",//商品名称
+  code:'',//商品编码
+//   phoneNumber: "",//时间
+//   applicationNum:'',//申请数量
+//   useNum:'',//使用数量
+  renewalStatus: "",//状态
+  createTime:'',//申请时间
+//   startDate: "",//开始时间
+//   endDate: "",//结束时间
+  current: 1,
+  size: 10,
+});
+
+const statusList = ref([
+    { name: "待审核", id: "1" },
+    { name: "已审核", id: "2" },
+    { name: "已驳回", id: "3" },
+]);
+
+// 禁用开始日期的逻辑（不能晚于已选的结束日期）
+const disableStartDate = (time) => {
+  if (!formInline.endDate) return false;
+  const endDate = new Date(formInline.endDate);
+  return time.getTime() > endDate.getTime();
+};
+
+// 禁用结束日期的逻辑（不能早于已选的开始日期）
+const disableEndDate = (time) => {
+  if (!formInline.startDate) return false;
+  const startDate = new Date(formInline.startDate).setHours(0, 0, 0, 0);
+  const currentDate = new Date(time).setHours(0, 0, 0, 0);
+  return currentDate < startDate;
+};
+
+const searchForm = ref(null);
+
+// 加载数据
+const loadData = async () => {
+
+  tableLoading.value = true;
+  let prams = { ...formInline };
+
+  try {
+    prams.startDate = formInline.startDate ? formInline.startDate + " 00:00:00" : "";
+    prams.endDate = formInline.endDate ? formInline.endDate + " 23:59:59" : "";
+    let response = await applicationrecordList(prams);
+    if (response.code == 200) {
+      tableData.value = response.data.records;
+      tableTotal.value = response.data.total;
+    }
+  } catch (error) {
+    
+  }
+  tableLoading.value = false;
+};
+
+const onSubmit = () => {
+  formInline.current = 1;
+  loadData();
+};
+
+const resetForm = () => {
+  searchForm.value.resetFields();
+  formInline.endDate = "";
+  loadData();
+};
+
+// 表格数据
+const tableData = ref([]);
+const tableLoading = ref(false);
+const tableTotal = ref(0);
+let nowClickRow = ref({});
+// 列配置
+const columns = ref([
+  { prop: "id", label: "ID" },
+  { prop: "brandUrl", label: "品牌LOGO", slotName:'brandUrl', width: "120", align: "left" },
+  { prop: "brandTitle", label: "品牌名称" },
+  { prop: "brandCode", label: "品牌编码", },
+//   { prop: "code", label: "申请账号名称", width: "120" },
+//   { prop: "useNum", label: "申请账号" },
+  { prop: "createTime", label: "申请时间" },
+  { prop: "renewalTimeNum", label: "延期时间",slotName: "renewalTimeNum" },
+  { prop: "renewalStatus", label: "状态", slotName: "renewalStatus",width: "100" },
+  { prop: "action", label: "操作", slotName: "action",width: "140",align: "center" },
+]);
+
+// 审核与驳回
+const auditRejected = (row,index) => {
+    console.log('row',index,row);
+    if(index == 2){
+        ElMessageBox.confirm("确定审核通过吗？", "提示", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
+    })
+      .then(async () => {
+        let response = await applicationrenewalApprove({ id: row.id, renewalStatus: index });
+        if (response.code == 200) {
+          ElMessage({
+            message: "审核成功",
+            type: "success",
+          });
+          loadData();
+        }
+      })
+      .catch(() => {
+        ElMessage({
+          type: "info",
+          message: "已取消",
+        });
+      });
+    }else { 
+        ElMessageBox.prompt('请填写驳回原因', '提示', {
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            inputValidator: (value) => {
+                if (!value || value.trim() === '') {
+                return '驳回原因不能为空';
+                }
+                return true; // 验证通过
+            },
+            inputErrorMessage: '请填写驳回原因', // 默认错误提示
+            })
+            .then(async({ value }) => {
+                let response = await applicationrenewalApprove({ id: row.id, renewalStatus: index,renewalStatusTxt: value });
+                if (response.code == 200) {
+                ElMessage({
+                    message: "已驳回",
+                    type: "success",
+                });
+                loadData();
+                }
+            })
+            .catch(() => {
+            ElMessage.info('已取消');
+            });
+    }
+    
+};
+
+//查看驳回原因
+const reason = (row) => {
+    ElMessageBox.alert(row.renewalStatusTxt, '驳回原因', {
+        confirmButtonText: '确定',
+    });
+}
+// 自定义表头类名,也可以在columns指定列中添加headerClassName: 'custom-header'
+const getHeaderClass = ({ column }) => {
+  return "custom-header";
+};
+// 分页变化
+const handlePaginationChange = ({ page, pageSize }) => {
+  console.log("分页变化:", page, pageSize);
+  // 这里可以调用API获取新数据
+  loadData();
+};
+// 多选框变化
+const handleSelectionChange = (selection) => {
+  console.log("选中项:", selection);
+};
+
+const titleRef = ref(null);
+const searchBarRef = ref(null);
+const tableViewportHeight = ref(0);
+// 精确计算可用高度
+const calculateTableHeight = () => {
+  // 获取窗口总高度
+  const windowHeight = window.innerHeight;
+
+  // 获取各组件高度
+  const headerHeight = titleRef.value?.$el?.offsetHeight || 0;
+  const searchBarHeight = searchBarRef.value?.offsetHeight || 0;
+
+  // 计算容器内边距补偿（根据实际样式调整）
+  const paddingCompensation = 130;
+
+  // 最终计算
+  tableViewportHeight.value =
+    windowHeight - headerHeight - searchBarHeight - paddingCompensation;
+  // console.log(tableViewportHeight.value);
+};
+// 组件挂载时加载数据
+onMounted(() => {
+  loadData();
+
+  calculateTableHeight();
+
+  // 添加响应式监听
+  window.addEventListener("resize", calculateTableHeight);
+
+  // 监听DOM变化（适用于动态变化的header/searchbar）
+  const observer = new ResizeObserver(calculateTableHeight);
+  if (titleRef.value?.$el) observer.observe(titleRef.value.$el);
+  if (searchBarRef.value) observer.observe(searchBarRef.value);
+});
+onBeforeUnmount(() => {
+  window.removeEventListener("resize", calculateTableHeight);
+});
+</script>
+<style lang="scss" scoped>
+.table-toolbar {
+  width: 300px;
+  height: 50px;
+  position: absolute;
+  right: 0;
+  top: 0;
+  display: flex;
+  justify-content: end;
+  padding: 14px 16px 0 0;
+}
+.el-button-disabled{
+    color: #ccc !important;
+}
+</style>

src/views/goods/goodsCategory/index.vue

@@ -171,7 +171,7 @@ const columns1 = ref([
   { prop: "level", label: "分类级别", slotName: "level" },
   { prop: "createTime", label: "添加时间" },
   { prop: "status", label: "状态", slotName: "status" },
-  { prop: "action", label: "操作", slotName: "action", width: 150 },
+  { prop: "action", label: "操作", slotName: "action", width: 150,fixed: "right" },
 ]);
 
 // 生成食物主题昵称

src/views/goods/goodsManage/addGoods.vue

@@ -564,6 +564,7 @@ const onGoodSave = async (params) => {
   if (response.code === 200) {
     ElMessage.success("新增成功！");
     formRef.value.resetFields();
+    router.go(-1);
   } else {
     ElMessage.error(response.message);
   }

src/views/goods/goodsManage/editGoods.vue

@@ -554,6 +554,7 @@ const onGoodSave = async (params) => {
   if (response.code === 200) {
     ElMessage.success("编辑成功！");
     formRef.value.resetFields();
+    router.go(-1);
   } else {
     ElMessage.error(response.message);
   }

src/views/goods/goodsManage/seeDetails.vue

@@ -209,7 +209,7 @@
         </el-form-item>
 
       </el-form>
-      <el-button type="primary" @click="approved" style="margin: 10px 0 0 80px;width: 150px;">返回</el-button>
+      <el-button type="primary" @click="goBack" style="margin: 10px 0 0 80px;width: 150px;">返回</el-button>
     </div>
   </div>
 </template>
@@ -530,8 +530,7 @@ const changeCategory3 = (id) => {
   formInline.categoryId = id;
 };
 
-//审核/驳回
+const goBack = async () => {
-const approved = async () => {
   router.go(-1);
 };