group_web_merchant/src/views/operationManagement/cases.vue

<template>
  <div class="table-box button-table">
    <ProTable ref="proTable" :columns="columns" :request-api="getTableList" :init-param="initParam" :data-callback="dataCallback">
      <template #operation="scope">
        <el-button type="primary" link @click="toDetail(scope.row)"> 查看详情 </el-button>
      </template>
    </ProTable>
  </div>
</template>

<script setup lang="tsx" name="cases">
import { reactive, ref } from "vue";
import { useRouter } from "vue-router";
import { ElLoading } from "element-plus";
import ProTable from "@/components/ProTable/index.vue";
import { ColumnProps, ProTableInstance } from "@/components/ProTable/interface";
import { getPersonCaseList } from "@/api/modules/operationManagement";
import { localGet } from "@/utils";

const router = useRouter();
const proTable = ref<ProTableInstance>();

// 上传情况枚举
const uploadStatusEnum = [
  { label: "未上传", value: 0 },
  { label: "已上传", value: 1 }
];

const columns = reactive<ColumnProps<any>[]>([
  { prop: "nickName", label: "姓名", minWidth: 300 },
  { prop: "phone", label: "联系方式", width: 300 },
  {
    prop: "activityName",
    label: "所属活动",
    minWidth: 300,
    search: {
      el: "input",
      props: { placeholder: "请输入" },
      order: 2
    }
  },
  {
    prop: "hasResult",
    label: "上传情况",
    width: 300,
    enum: uploadStatusEnum,
    fieldNames: { label: "label", value: "value" },
    search: { el: "select", props: { placeholder: "请选择" }, order: 1 },
    render: (scope: any) => {
      const status = scope.row.hasResult;
      const statusItem = uploadStatusEnum.find(item => item.value === status);
      return statusItem ? statusItem.label : "-";
    }
  },
  { prop: "operation", label: "操作", fixed: "right", width: 300 }
]);

const initParam = reactive({
  storeId: localGet("createdId")
});

const dataCallback = (data: any) => ({
  list: data?.records ?? [],
  total: data?.total ?? 0
});

const getTableList = async (params: any) => {
  // 显示全屏loading
  const loadingInstance = ElLoading.service({
    lock: true,
    text: "加载中...",
    background: "rgba(0, 0, 0, 0.7)"
  });

  try {
    // 转换参数格式以匹配新接口
    const newParams: any = {
      storeId: params.storeId || localGet("createdId"),
      pageNum: params.page || params.pageNum || 1,
      pageSize: params.size || params.pageSize || 10
    };

    // 上传情况筛选（未上传0 / 已上传1）
    newParams.hasResult = params.hasResult;

    // 所属活动（活动名称）筛选
    if (params.activityName) {
      newParams.activityName = params.activityName.trim();
    }

    const result = await getPersonCaseList(newParams);
    return result;
  } finally {
    // 关闭loading
    loadingInstance.close();
  }
};

const toDetail = (row: any) => {
  router.push(`/operationManagement/caseDetail?activityId=${row.activityId}&userId=${row.userId}`);
};
</script>