项管首页

ruoyi-ui/src/views/dpcProject/index.vue

@@ -0,0 +1,264 @@
+<template>
+  <div class="app-container dpc-project-container">
+    <!-- 页面标题 -->
+    <div class="page-header">
+      <h2 class="page-title">初核项目管理</h2>
+      <p class="page-subtitle">管理纪检初核排查项目，跟踪预警信息</p>
+    </div>
+
+    <!-- 搜索和操作区 -->
+    <search-bar
+      :show-search="showSearch"
+      @query="handleQuery"
+      @add="handleAdd"
+      @import="handleImport"
+    />
+
+    <!-- 项目列表表格 -->
+    <project-table
+      :loading="loading"
+      :data-list="projectList"
+      :total="total"
+      :page-params="queryParams"
+      @pagination="getList"
+      @detail="handleDetail"
+      @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 {getMockProjectList} from '@/api/dpcProject'
+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,
+        projectStatus: null
+      },
+      // 新增/编辑弹窗
+      addDialogVisible: false,
+      addDialogTitle: '新建项目',
+      projectForm: {},
+      // 导入历史项目弹窗
+      importDialogVisible: false,
+      // 归档确认弹窗
+      archiveDialogVisible: false,
+      currentArchiveProject: null
+    }
+  },
+  created() {
+    this.getList()
+  },
+  methods: {
+    /** 查询项目列表 */
+    getList() {
+      this.loading = true
+      // 使用Mock数据
+      getMockProjectList().then(response => {
+        this.projectList = response.rows
+        this.total = response.total
+        this.loading = false
+      }).catch(() => {
+        this.loading = false
+      })
+    },
+    /** 搜索按钮操作 */
+    handleQuery(queryParams) {
+      if (queryParams) {
+        this.queryParams = { ...this.queryParams, ...queryParams }
+      }
+      this.queryParams.pageNum = 1
+      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
+      console.log('提交项目数据:', data)
+      this.$modal.msgSuccess('项目创建成功')
+      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
+    },
+    /** 查看详情 */
+    handleDetail(row) {
+      console.log('查看详情:', row)
+      this.$modal.msgInfo('查看项目详情: ' + row.projectName)
+    },
+    /** 进入项目 */
+    handleEnter(row) {
+      console.log('进入项目:', row)
+      this.$modal.msgSuccess('进入项目: ' + row.projectName)
+    },
+    /** 查看结果 */
+    handleViewResult(row) {
+      console.log('查看结果:', row)
+      this.$modal.msgInfo('查看项目结果: ' + row.projectName)
+    },
+    /** 重新分析 */
+    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: 16px;
+  background: #f0f2f5;
+  min-height: calc(100vh - 140px);
+}
+
+.page-header {
+  margin-bottom: 12px;
+  padding: 16px 20px;
+  background: #ffffff;
+  border-radius: 4px;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
+
+  .page-title {
+    margin: 0;
+    font-size: 18px;
+    font-weight: 500;
+    color: #303133;
+  }
+
+  .page-subtitle {
+    margin: 4px 0 0 0;
+    font-size: 13px;
+    color: #909399;
+    font-weight: 400;
+  }
+}
+</style>