Pārlūkot izejas kodu

feat(groupPackage):优化团购套餐管理操作权限控制

- 引入状态枚举和操作权限配置,明确各操作按钮的显示条件
- 使用 canShowButton 工具函数统一判断按钮是否显示- 更新表格标签页选项,补充缺失的状态分类- 重构库存修改表单验证规则,提示信息更准确
- 修复审核功能中 rejectionReason 参数传递问题- 调整查看详情按钮的显示逻辑,与其他操作按钮保持一致
congxuesong 1 mēnesi atpakaļ
vecāks
revīzija
da9e2d8bbf
1 mainītis faili ar 95 papildinājumiem un 29 dzēšanām
  1. 95 29
      src/views/groupPackageManagement/index.vue

+ 95 - 29
src/views/groupPackageManagement/index.vue

@@ -22,23 +22,58 @@
       </template>
       <template #status="scope">
         <p>团购状态:{{ scope.row.statusName ?? "--" }}</p>
-        <p>审核状态:{{ scope.row.reviewType ?? "--" }}</p> </template
-      >:
+        <p>审核状态:{{ scope.row.reviewType ?? "--" }}</p>
+      </template>
       <!-- 表格操作 -->
       <template #operation="scope">
-        <!-- 审批通过和拒绝按钮仅在状态为0时显示 -->
-        <el-button link type="primary" @click="changeTypes(scope.row, 'on')" v-if="sj.includes(scope.row.status)">
+        <el-button
+          link
+          type="primary"
+          @click="changeTypes(scope.row, 'on')"
+          v-if="canShowButton(scope.row.status, OPERATION_PERMISSIONS.上架)"
+        >
           上架
         </el-button>
-        <el-button link type="primary" @click="changeTypes(scope.row, 'off')" v-if="xj.includes(scope.row.status)">
+        <el-button
+          link
+          type="primary"
+          @click="changeTypes(scope.row, 'off')"
+          v-if="canShowButton(scope.row.status, OPERATION_PERMISSIONS.下架)"
+        >
           下架
         </el-button>
-        <el-button link type="primary" @click="changeInventory(scope.row)" v-if="xgkc.includes(scope.row.status)">
+        <el-button
+          link
+          type="primary"
+          @click="changeInventory(scope.row)"
+          v-if="canShowButton(scope.row.status, OPERATION_PERMISSIONS.修改库存)"
+        >
           修改库存
         </el-button>
-        <el-button type="primary" link @click="toDetail(scope.row)" v-if="ckxq.includes(scope.row.status)"> 查看详情 </el-button>
-        <el-button link type="primary" @click="editRow(scope.row)" v-if="bj.includes(scope.row.status)"> 编辑 </el-button>
-        <el-button link type="primary" @click="deleteRow(scope.row)" v-if="sc.includes(scope.row.status)"> 删除 </el-button>
+        <el-button
+          type="primary"
+          link
+          @click="toDetail(scope.row)"
+          v-if="canShowButton(scope.row.status, OPERATION_PERMISSIONS.查看详情)"
+        >
+          查看详情
+        </el-button>
+        <el-button
+          link
+          type="primary"
+          @click="editRow(scope.row)"
+          v-if="canShowButton(scope.row.status, OPERATION_PERMISSIONS.编辑)"
+        >
+          编辑
+        </el-button>
+        <el-button
+          link
+          type="primary"
+          @click="deleteRow(scope.row)"
+          v-if="canShowButton(scope.row.status, OPERATION_PERMISSIONS.删除)"
+        >
+          删除
+        </el-button>
       </template>
     </ProTable>
     <el-dialog v-model="dialogFormVisible" title="修改库存" width="500">
@@ -85,13 +120,18 @@ const formInventory: any = ref({
 const rowData = ref<any>();
 const activeName = ref("");
 
+// 定义表单类型
+interface RuleForm {
+  newInventory: string;
+}
+
 const ruleFormRef = ref<FormInstance>();
 const rules = reactive<FormRules<RuleForm>>({
   newInventory: [
     { required: true, message: "请输入库存数量", trigger: "blur" },
     {
       pattern: /^(0|[1-9][0-9]*)$/,
-      message: "请输入整数,不允许输入小数,负数",
+      message: "请输入整数",
       trigger: "blur"
     }
   ]
@@ -101,12 +141,49 @@ const statusEnum = [
   { value: "1", label: "审核通过" },
   { value: "2", label: "审核驳回" }
 ];
-const ckxq = [1, 3, 4, 5, 6, 7];
-const sj = [];
-const xj = [5];
-const xgkc = [5, 4, 7];
-const bj = [0, 3, 4, 7];
-const sc = [0, 3, 4, 5, 7];
+
+const allTabOptions = [
+  { label: "全部", name: "" },
+  { label: "草稿", name: "0" },
+  { label: "进行中", name: "5" },
+  { label: "未开始", name: "2" },
+  { label: "已下架", name: "6" },
+  { label: "已售罄", name: "4" },
+  { label: "已结束", name: "7" }
+];
+
+// 状态枚举:0草稿 1待审核 2未开始 3审核拒绝 4已售罄 5进行中 6已下架 7已结束
+const STATUS = {
+  草稿: 0,
+  待审核: 1,
+  未开始: 2,
+  审核拒绝: 3,
+  已售罄: 4,
+  进行中: 5,
+  已下架: 6,
+  已结束: 7
+} as const;
+
+// 操作按钮权限配置:定义每个操作按钮在哪些状态下显示
+const OPERATION_PERMISSIONS = {
+  // 查看详情:待审核、未开始、审核拒绝、进行中、已售罄、已下架
+  查看详情: [STATUS.待审核, STATUS.未开始, STATUS.审核拒绝, STATUS.进行中, STATUS.已售罄, STATUS.已下架],
+  // 上架:未开始、已下架
+  上架: [STATUS.未开始, STATUS.已下架],
+  // 下架:进行中
+  下架: [STATUS.进行中],
+  // 修改库存:未开始、进行中、已售罄
+  修改库存: [STATUS.未开始, STATUS.进行中, STATUS.已售罄],
+  // 编辑:草稿、审核拒绝、已售罄、已下架、已结束
+  编辑: [STATUS.草稿, STATUS.审核拒绝, STATUS.已售罄, STATUS.已下架, STATUS.已结束],
+  // 删除:草稿、未开始、审核拒绝、已售罄、已结束
+  删除: [STATUS.草稿, STATUS.未开始, STATUS.审核拒绝, STATUS.已售罄, STATUS.已结束]
+} as const;
+
+// 判断按钮是否显示的工具函数
+const canShowButton = (status: number, allowedStatuses: readonly number[]) => {
+  return allowedStatuses.includes(status);
+};
 
 // ProTable 实例(需要在使用它的地方之前定义)
 const proTable = ref<ProTableInstance>();
@@ -192,17 +269,6 @@ const columns = reactive<ColumnProps<any>[]>([
   { prop: "operation", label: "操作", fixed: "right", width: 330 }
 ]);
 
-// 在 script setup 中添加
-const allTabOptions = [
-  { label: "全部", name: "" },
-  { label: "草稿", name: "0" },
-  { label: "进行中", name: "5" },
-  { label: "待审核", name: "1" },
-  { label: "审核拒绝", name: "3" },
-  { label: "已售罄", name: "4" },
-  { label: "已结束", name: "7" }
-];
-
 // 获取当前审核状态
 const currentAuditStatus = computed(() => {
   if (!proTable.value?.searchParam) return "";
@@ -299,8 +365,8 @@ const changeInventory = (row: any) => {
 };
 const handleChangeStatus = async (row: any, status: string) => {
   try {
-    let res = await audit({ id: row.id, status: status, rejectionReason: form.comment });
-    if (res.code == 200) {
+    let res = await audit({ id: row.id, status: status, rejectionReason: "" });
+    if ((res.code as any) == 200) {
       proTable.value?.getTableList();
       if (status === "2") closeDialog();
       ElMessage.success("审核成功");