医院科研管理系统

张伟：你好，李明，最近我们实验室在开发一个科研管理平台，主要是为了方便管理和追踪纵向项目的进展。你对这个项目有什么看法吗？

李明：嗯，听起来挺有挑战性的。纵向项目通常涉及多个部门和复杂的流程，所以平台需要具备良好的组织能力和数据可视化功能。你们打算怎么实现这些功能呢？

张伟：我们计划用Python来搭建后端，前端使用React，数据库是PostgreSQL。目前我们正在做一个演示系统，用来展示平台的功能。你对演示系统有什么建议吗？

李明：演示系统很重要，它能帮助用户快速理解平台的结构和操作方式。我觉得可以先从纵向项目的创建、审批、执行到结题的整个流程入手，逐步展示每个阶段的关键信息。

张伟：没错，那我们就先从纵向项目的创建开始吧。我们可以用Flask框架来构建API，然后在前端展示一个简单的表单。

李明：好的，那我来写一段后端代码，用于接收用户提交的纵向项目信息。比如项目名称、负责人、预算等。

张伟：那我可以写前端部分，用React组件来展示表单，并调用后端API保存数据。

李明：好的，下面是一段Python代码，使用Flask来处理POST请求，接收项目信息并存储到数据库中：

from flask import Flask, request, jsonify
import psycopg2

app = Flask(__name__)

# 数据库连接配置
conn = psycopg2.connect(
    dbname="research_db",
    user="postgres",
    password="password",
    host="localhost"
)

@app.route('/api/project', methods=['POST'])
def create_project():
    data = request.get_json()
    name = data['name']
    principal = data['principal']
    budget = data['budget']

    cursor = conn.cursor()
    cursor.execute("INSERT INTO projects (name, principal, budget) VALUES (%s, %s, %s)", (name, principal, budget))
    conn.commit()
    return jsonify({"message": "Project created successfully"}), 201

if __name__ == '__main__':
    app.run(debug=True)
    

张伟：这是前端的React代码，用来展示一个简单的表单，让用户输入项目信息，并调用后端API进行保存：

import React, { useState } from 'react';
import axios from 'axios';

function ProjectForm() {
  const [projectName, setProjectName] = useState('');
  const [principal, setPrincipal] = useState('');
  const [budget, setBudget] = useState('');

  const handleSubmit = async (e) => {
    e.preventDefault();
    const projectData = {
      name: projectName,
      principal: principal,
      budget: budget
    };

    try {
      const response = await axios.post('http://localhost:5000/api/project', projectData);
      alert(response.data.message);
    } catch (error) {
      alert('Error submitting project');
    }
  };

  return (
    

      

        项目名称:
         setProjectName(e.target.value)} />
      
      

        负责人:
         setPrincipal(e.target.value)} />
      
      

        预算（元）:
         setBudget(e.target.value)} />
      
      提交项目
    
  );
}

export default ProjectForm;
    

李明：这段代码看起来很清晰，能够很好地实现项目信息的录入功能。接下来，我们可以考虑如何展示已有的纵向项目信息。

张伟：是的，我们可以添加一个“项目列表”页面，显示所有已创建的纵向项目。这样用户就能看到自己的项目状态了。

李明：那我们可以再写一个GET接口，用于获取所有项目的数据，然后在前端展示出来。

张伟：好的，那我来写后端的GET接口代码：

@app.route('/api/projects', methods=['GET'])
def get_projects():
    cursor = conn.cursor()
    cursor.execute("SELECT * FROM projects")
    projects = cursor.fetchall()
    result = []
    for project in projects:
        result.append({
            'id': project[0],
            'name': project[1],
            'principal': project[2],
            'budget': project[3]
        })
    return jsonify(result), 200
    

李明：这是前端的React组件，用来展示项目列表：

import React, { useEffect, useState } from 'react';
import axios from 'axios';

function ProjectList() {
  const [projects, setProjects] = useState([]);

  useEffect(() => {
    const fetchProjects = async () => {
      try {
        const response = await axios.get('http://localhost:5000/api/projects');
        setProjects(response.data);
      } catch (error) {
        console.error('Error fetching projects:', error);
      }
    };
    fetchProjects();
  }, []);

  return (
    

      
纵向项目列表
      

        {projects.map(project => (
          

            {project.name} - 负责人: {project.principal}, 预算: {project.budget} 元
          
        ))}
      
    
  );
}

export default ProjectList;
    

张伟：这样我们就有了一个基本的演示系统，可以展示纵向项目的创建和查看功能。接下来，我们可以考虑加入审批流程、进度跟踪等功能。

李明：是的，纵向项目通常需要经过多级审批，我们可以为每个项目添加一个状态字段，例如“待审批”、“已批准”、“进行中”、“已完成”等。

张伟：那我们可以修改数据库表结构，添加一个status字段，然后在前端增加一个状态显示和审批按钮。

李明：那我来更新一下数据库表结构：

CREATE TABLE projects (
    id SERIAL PRIMARY KEY,
    name VARCHAR(255),
    principal VARCHAR(100),
    budget NUMERIC,
    status VARCHAR(50) DEFAULT '待审批'
);
    

张伟：然后在后端添加一个更新状态的接口：

@app.route('/api/project//update-status', methods=['PUT'])
def update_project_status(id):
    new_status = request.get_json().get('status')
    cursor = conn.cursor()
    cursor.execute("UPDATE projects SET status = %s WHERE id = %s", (new_status, id))
    conn.commit()
    return jsonify({"message": "Status updated"}), 200
    

李明：前端部分可以添加一个下拉菜单，让用户选择项目状态，并点击“提交审批”按钮更新状态。

张伟：这样，我们就有了一个更完整的纵向项目演示系统。未来还可以扩展更多功能，比如任务分配、文档上传、进度报告等。

李明：没错，这个系统已经具备了基础的演示功能，可以用于内部测试或者向领导汇报。希望你们的科研管理平台能顺利上线。

张伟：谢谢你的建议，我们会继续完善系统的功能。