ccdi/ruoyi-ui/src/views/ccdiProject/index.vue

<template>
  <div class="app-container dpc-project-container">
    <!-- 页面标题 -->
    <div class="page-header">
      <h2 class="page-title">初核项目管理</h2>
      <el-button type="primary" icon="el-icon-plus" @click="handleAdd">新建项目</el-button>
    </div>

    <!-- 搜索和操作区 -->
    <search-bar
      :show-search="showSearch"
      :tab-counts="tabCounts"
      @query="handleQuery"
    />

    <!-- 项目列表表格 -->
    <project-table
      :loading="loading"
      :data-list="projectList"
      :total="total"
      :page-params="queryParams"
      @pagination="handlePagination"
      @enter="handleEnter"
      @view-result="handleViewResult"
      @re-analyze="handleReAnalyze"
      @archive="handleArchive"
    />

    <!-- 快捷入口区 -->
    <quick-entry
      @import-history="handleImport"
      @create-quarterly="handleCreateQuarterly"
      @create-employee="handleCreateEmployee"
      @create-highrisk="handleCreateHighRisk"
    />

    <!-- 新建项目弹窗 -->
    <add-project-dialog
      :visible.sync="addDialogVisible"
      :title="addDialogTitle"
      :form="projectForm"
      @submit="handleSubmitProject"
      @close="handleCloseAddDialog"
    />

    <!-- 导入历史项目弹窗 -->
    <import-history-dialog
      :visible.sync="importDialogVisible"
      @submit="handleSubmitImport"
      @close="handleCloseImportDialog"
    />

    <!-- 项目归档确认弹窗 -->
    <archive-confirm-dialog
      :visible.sync="archiveDialogVisible"
      :project-data="currentArchiveProject"
      @confirm="handleConfirmArchive"
      @close="archiveDialogVisible = false"
    />
  </div>
</template>

<script>
import {listProject, getStatusCounts} from '@/api/ccdiProject'
import SearchBar from './components/SearchBar'
import ProjectTable from './components/ProjectTable'
import QuickEntry from './components/QuickEntry'
import AddProjectDialog from './components/AddProjectDialog'
import ImportHistoryDialog from './components/ImportHistoryDialog'
import ArchiveConfirmDialog from './components/ArchiveConfirmDialog'

export default {
  name: "DpcProject",
  components: {
    SearchBar,
    ProjectTable,
    QuickEntry,
    AddProjectDialog,
    ImportHistoryDialog,
    ArchiveConfirmDialog,
  },
  data() {
    return {
      // 加载状态
      loading: true,
      // 显示搜索栏
      showSearch: true,
      // 总条数
      total: 0,
      // 项目列表
      projectList: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        projectName: null,
        status: null
      },
      // 标签页数量统计
      tabCounts: {
        all: 0,
        '0': 0,
        '1': 0,
        '2': 0
      },
      // 新增/编辑弹窗
      addDialogVisible: false,
      addDialogTitle: "新建项目",
      projectForm: {},
      // 导入历史项目弹窗
      importDialogVisible: false,
      // 归档确认弹窗
      archiveDialogVisible: false,
      currentArchiveProject: null,
    };
  },
  created() {
    this.getList();
  },
  methods: {
    /** 查询项目列表 */
    getList() {
      this.loading = true

      // 并行请求列表数据和状态统计
      Promise.all([
        listProject(this.queryParams),
        getStatusCounts()
      ]).then(([listResponse, countsResponse]) => {
        // 处理列表数据
        this.projectList = listResponse.rows
        this.total = listResponse.total

        // 处理状态统计
        const counts = countsResponse.data || {}
        this.tabCounts = {
          all: counts.all || 0,
          '0': counts.status0 || 0,
          '1': counts.status1 || 0,
          '2': counts.status2 || 0
        }

        this.loading = false
      }).catch((error) => {
        this.loading = false
        console.error('加载数据失败:', error)
        this.$modal.msgError('加载数据失败，请稍后重试')
      })
    },
    /** 搜索按钮操作 */
    handleQuery(queryParams) {
      if (queryParams) {
        this.queryParams = { ...this.queryParams, ...queryParams };
      }
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 分页事件处理 */
    handlePagination(pagination) {
      if (pagination) {
        this.queryParams.pageNum = pagination.pageNum
        this.queryParams.pageSize = pagination.pageSize
      }
      this.getList()
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.projectForm = this.getEmptyForm();
      this.addDialogTitle = "新建项目";
      this.addDialogVisible = true;
    },
    /** 获取空表单 */
    getEmptyForm() {
      return {
        projectId: null,
        projectName: "",
        projectDesc: "",
        startDate: "",
        endDate: "",
        targetCount: 0,
        targetPersons: [],
      };
    },
    /** 关闭新增弹窗 */
    handleCloseAddDialog() {
      this.addDialogVisible = false;
      this.projectForm = {};
    },
    /** 提交项目表单 */
    handleSubmitProject(data) {
      // 不需要再次调用API，因为AddProjectDialog已经处理了
      this.addDialogVisible = false
      this.getList() // 刷新列表
    },
    /** 导入历史项目 */
    handleImport() {
      this.importDialogVisible = true;
    },
    /** 关闭导入弹窗 */
    handleCloseImportDialog() {
      this.importDialogVisible = false;
    },
    /** 提交导入 */
    handleSubmitImport(data) {
      console.log("导入历史项目:", data);
      this.$modal.msgSuccess("项目导入成功");
      this.importDialogVisible = false;
      this.getList();
    },
    /** 创建季度初核 */
    handleCreateQuarterly() {
      this.projectForm = this.getEmptyForm();
      this.addDialogTitle = "创建季度初核项目";
      this.addDialogVisible = true;
    },
    /** 创建新员工排查 */
    handleCreateEmployee() {
      this.projectForm = this.getEmptyForm();
      this.addDialogTitle = "创建新员工排查项目";
      this.addDialogVisible = true;
    },
    /** 创建高风险专项 */
    handleCreateHighRisk() {
      this.projectForm = this.getEmptyForm();
      this.addDialogTitle = "创建高风险专项项目";
      this.addDialogVisible = true;
    },
    /** 进入项目 */
    handleEnter(row) {
      this.$router.push({
        path: `ccdiProject/detail/${row.projectId}`,
      });
      // this.$modal.msgSuccess("进入项目: " + row.projectName);
    },
    /** 查看结果 */
    handleViewResult(row) {
      this.$router.push({
        path: `/ccdiProject/detail/${row.projectId}`,
        query: { tab: "overview" },
      });
    },
    /** 重新分析 */
    handleReAnalyze(row) {
      console.log("重新分析:", row);
      this.$modal.msgSuccess("正在重新分析项目: " + row.projectName);
    },
    /** 归档项目 */
    handleArchive(row) {
      this.currentArchiveProject = row;
      this.archiveDialogVisible = true;
    },
    /** 确认归档 */
    handleConfirmArchive(data) {
      console.log("确认归档:", data);
      this.$modal.msgSuccess("项目已归档");
      this.archiveDialogVisible = false;
      this.getList();
    },
  },
};
</script>

<style lang="scss" scoped>
.dpc-project-container {
  padding: 24px;
  background: #F8F9FA;
  min-height: calc(100vh - 140px);
}

.page-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;

  .page-title {
    margin: 0;
    font-size: 20px;
    font-weight: 500;
    color: #303133;
  }
}
</style>