yaowanxin
2 天以前 6d8e930f8a93d1d15b9e9a6e30536902f1aeeb86
src/views/collaborativeApproval/rpaManagement/index.vue
@@ -92,7 +92,7 @@
import { onMounted, ref, reactive, toRefs } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import PIMTable from "@/components/PIMTable/PIMTable.vue";
import {listRpa, addRpa, updateRpa, delRpa, delRpaBatch} from "@/api/collaborativeApproval/rpaManagement.js";
// 响应式数据
const data = reactive({
  searchForm: {
@@ -100,20 +100,17 @@
    status: "",
  },
  form: {
    id: "",
    programName: "",
    status: "stopped",
    description: "",
    createTime: "",
    status: "",
    description: ""
  },
  dialogVisible: false,
  dialogTitle: "",
  dialogType: "add",
  selectedIds: [],
  tableLoading: false,
  page: {
    current: 1,
    size: 100,
    size: 20,
    total: 0,
  },
  tableData: [],
@@ -123,6 +120,8 @@
// 表单引用
const formRef = ref();
// 选择的行数据
const selectedRows = ref([]);
// 表单验证规则
const rules = {
@@ -179,7 +178,7 @@
    label: "操作",
    align: "center",
    fixed: "right",
    width: 230,
    width: 150,
    operation: [
      {
        name: "编辑",
@@ -188,50 +187,26 @@
          openForm("edit", row);
        }
      },
      {
        name: "开始",
        type: "text",
        clickFun: (row) => {
          handleStart(row);
        },
        disabled: (row) => row.status !== 'stopped'
      },
      {
        name: "停止",
        type: "text",
        clickFun: (row) => {
          handleStop(row);
        },
        disabled: (row) => row.status === 'stopped'
      }
      // {
      //   name: "开始",
      //   type: "text",
      //   clickFun: (row) => {
      //     handleStart(row);
      //   },
      //   disabled: (row) => row.status !== 'stopped'
      // },
      // {
      //   name: "停止",
      //   type: "text",
      //   clickFun: (row) => {
      //     handleStop(row);
      //   },
      //   disabled: (row) => row.status === 'stopped'
      // }
    ]
  }
]);
// 模拟数据
const mockData = [
  {
    id: "1",
    programName: "订单处理RPA",
    status: "running",
    description: "自动处理客户订单,包括验证、分配和确认",
    createTime: "2024-01-15 10:30:00"
  },
  {
    id: "2",
    programName: "库存同步RPA",
    status: "stopped",
    description: "同步多个仓库的库存数据,确保数据一致性",
    createTime: "2024-01-14 15:20:00"
  },
  {
    id: "3",
    programName: "报表生成RPA",
    status: "error",
    description: "自动生成每日销售报表和库存报表",
    createTime: "2024-01-13 09:15:00"
  }
];
// 生命周期
onMounted(() => {
@@ -240,32 +215,20 @@
// 查询数据
const handleQuery = () => {
  page.value.current = 1;
  // page.value.current = 1;
  getList();
};
const getList = () => {
  tableLoading.value = true;
  // 模拟API调用延迟
  setTimeout(() => {
    let filteredData = [...mockData];
    // 根据搜索条件过滤数据
    if (searchForm.value.programName) {
      filteredData = filteredData.filter(item =>
        item.programName.toLowerCase().includes(searchForm.value.programName.toLowerCase())
      );
    }
    if (searchForm.value.status) {
      filteredData = filteredData.filter(item => item.status === searchForm.value.status);
    }
    tableData.value = filteredData;
    page.value.total = filteredData.length;
  listRpa({...page.value, ...searchForm.value})
  .then(res => {
    tableLoading.value = false;
  }, 500);
    tableData.value = res.data.records
    page.total = res.data.total;
  }).catch(err => {
    tableLoading.value = false;
  })
};
// 分页处理
@@ -277,7 +240,7 @@
// 选择变化处理
const handleSelectionChange = (selection) => {
  selectedIds.value = selection.map(item => item.id);
  selectedRows.value = selection;
};
// 打开表单
@@ -287,13 +250,6 @@
  
  if (type === "add") {
    dialogTitle.value = "添加RPA";
    form.value = {
      id: "",
      programName: "",
      status: "stopped",
      description: "",
      createTime: "",
    };
  } else {
    dialogTitle.value = "编辑RPA";
    form.value = { ...row };
@@ -309,27 +265,32 @@
    
    if (dialogType.value === "add") {
      // 添加新RPA
      const newRPA = {
        id: Date.now().toString(),
        programName: form.value.programName,
        status: form.value.status,
        description: form.value.description,
        createTime: new Date().toLocaleString(),
      };
      mockData.unshift(newRPA);
      ElMessage.success("RPA添加成功");
      addRpa({...form.value}).then(res => {
        if(res.code == 200){
          ElMessage.success("添加成功");
            form.value = {
            programName: "",
            status: "",
            description: ""
          },
          dialogVisible.value = false;
          getList();
        }
      }).catch(err => {
        ElMessage.error(err.msg);
      })
    } else {
      // 编辑RPA
      const index = mockData.findIndex(item => item.id === form.value.id);
      if (index !== -1) {
        mockData[index] = { ...form.value };
        ElMessage.success("RPA更新成功");
      }
      updateRpa({...form.value}).then(res => {
        if(res.code == 200){
          ElMessage.success("更新成功");
          dialogVisible.value = false;
          getList();
        }
      }).catch(err => {
        ElMessage.error(err.msg);
      })
    }
    dialogVisible.value = false;
    getList();
  } catch (error) {
    console.error("表单验证失败:", error);
  }
@@ -368,32 +329,26 @@
// 删除RPA
const handleDelete = () => {
  let ids = [];
  if (selectedIds.value.length > 0) {
    ids = selectedIds.value.map((item) => item.id);
  } else {
    ElMessage.warning("请选择要删除的RPA");
    return;
  }
  ElMessageBox.confirm("选中的内容将被删除,是否确认删除?", "删除", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
  }).then(() => {
    // 从模拟数据中删除选中的项
    ids.forEach(id => {
      const index = mockData.findIndex(item => item.id === id);
      if (index !== -1) {
        mockData.splice(index, 1);
      }
    });
    ElMessage.success("删除成功");
    selectedIds.value = [];
    getList();
  }).catch(() => {
    // 用户取消
  });
   if (selectedRows.value.length > 0) {
      ids = selectedRows.value.map((item) => item.id);
   } else {
      proxy.$modal.msgWarning("请选择数据");
      return;
   }
  ElMessageBox.confirm("选中的内容将被删除,是否确认删除?", "删除提示", {
      confirmButtonText: "确认",
      cancelButtonText: "取消",
      type: "warning",
   })
   .then(() => {
      delRpa(ids).then((res) => {
            proxy.$modal.msgSuccess("删除成功");
            getList();
         })
   })
   .catch(() => {
      proxy.$modal.msg("已取消");
   });
};
</script>