Node.js药房药品进销存库存管理系统vue

const express = require('express');
const bodyParser = require('body-parser');
const app = express();

// 用于解析JSON请求体
app.use(bodyParser.json());

// 模拟的库存数据
let inventory = [
  { id: 1, name: '药品A', quantity: 100 },
  // ...更多药品
];

// 获取所有库存
app.get('/api/inventory', (req, res) => {
  res.json(inventory);
});

// 添加新药品
app.post('/api/inventory', (req, res) => {
  const newDrug = { id: inventory.length + 1, ...req.body };
  inventory.push(newDrug);
  res.status(201).json(newDrug);
});

// 更新药品数量
app.put('/api/inventory/:id', (req, res) => {
  const drugIndex = inventory.findIndex(d => d.id === parseInt(req.params.id));
  if (drugIndex === -1) {
    return res.status(404).json({ message: 'Drug not found' });
  }
  const updatedDrug = { ...inventory[drugIndex], ...req.body };
  inventory.splice(drugIndex, 1, updatedDrug);
  res.json(updatedDrug);
});

// 删除药品
app.delete('/api/inventory/:id', (req, res) => {
  const drugIndex = inventory.findIndex(d => d.id === parseInt(req.params.id));
  if (drugIndex === -1) {
    return res.status(404).json({ message: 'Drug not found' });
  }
  inventory.splice(drugIndex, 1);
  res.json({ message: 'Drug deleted successfully' });
});

const PORT = 3000;
app.listen(PORT, () => {
  console.log(`Server running on port ${PORT}`);
});

<template>
  <div>
    <!-- 药品列表展示 -->
    <ul>
      <li v-for="drug in drugs" :key="drug.id">
        {{ drug.name }} - 数量: {{ drug.quantity }}
        <!-- 更新数量的表单 -->
        <form @submit.prevent="updateDrug(drug.id)">
          新数量: <input type="number" v-model.number="drug.quantity">
          <button type="submit">更新</button>
        </form>
      </li>
    </ul>

    <!-- 添加新药品的表单 -->
    <form @submit.prevent="addDrug">
      药品名称: <input type="text" v-model="newDrug.name">
      数量: <input type="number" v-model.number="newDrug.quantity">
      <button type="submit">添加</button>
    </form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      drugs: [],
      newDrug: {
        name: '',
        quantity: 0
      }
    };
  },
  created() {
    this.fetchDrugs();
  },
  methods: {
    fetchDrugs() {
      fetch('http://localhost:3000/api/inventory')