PHP と Vue を使用して倉庫管理用の棚管理機能を開発する方法

CREATE TABLE `shelf` (
  `id` int(11) PRIMARY KEY NOT NULL AUTO_INCREMENT,
  `shelf_code` varchar(32) NOT NULL,
  `description` varchar(255) DEFAULT NULL,
  `capacity` int(11) NOT NULL,
  `occupancy` int(11) NOT NULL
);

<?php
$servername = "localhost";
$username = "root";
$password = "password";
$dbname = "shelf_management";

$conn = new mysqli($servername, $username, $password, $dbname);

if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}

<?php
include 'db.php';

// 获取所有货架数据
function getAllShelves() {
    global $conn;
    $sql = "SELECT * FROM shelf";
    $result = $conn->query($sql);

    if ($result->num_rows > 0) {
        $rows = array();
        while($row = $result->fetch_assoc()) {
            $rows[] = $row;
        }
        return $rows;
    } else {
        return [];
    }
}

// 创建货架
function createShelf($shelf_code, $description, $capacity, $occupancy) {
    global $conn;
    $sql = "INSERT INTO shelf (shelf_code, description, capacity, occupancy)
            VALUES ('$shelf_code','$description','$capacity','$occupancy')";

    if ($conn->query($sql) === TRUE) {
        return true;
    } else {
        return false;
    }
}

// 更新货架
function updateShelf($id, $shelf_code, $description, $capacity, $occupancy) {
    global $conn;
    $sql = "UPDATE shelf SET shelf_code='$shelf_code', description='$description',
            capacity='$capacity', occupancy='$occupancy' WHERE id='$id'";

    if ($conn->query($sql) === TRUE) {
        return true;
    } else {
        return false;
    }
}

// 删除货架
function deleteShelf($id) {
    global $conn;
    $sql = "DELETE FROM shelf WHERE id='$id'";

    if ($conn->query($sql) === TRUE) {
        return true;
    } else {
        return false;
    }
}

// 路由处理
switch ($_SERVER["REQUEST_METHOD"]) {
    case 'GET':
        // 处理获取所有货架数据请求
        echo json_encode(getAllShelves());
        break;
    case 'POST':
        // 处理创建货架请求
        $input = json_decode(file_get_contents('php://input'), true);
        $shelf_code = $input["shelf_code"];
        $description = $input["description"];
        $capacity = $input["capacity"];
        $occupancy = $input["occupancy"];
        if (createShelf($shelf_code, $description, $capacity, $occupancy)) {
            echo "Shelf created successfully";
        } else {
            echo "Error creating shelf";
        }
        break;
    case 'PUT':
        // 处理更新货架请求
        $input = json_decode(file_get_contents('php://input'), true);
        $id = $input["id"];
        $shelf_code = $input["shelf_code"];
        $description = $input["description"];
        $capacity = $input["capacity"];
        $occupancy = $input["occupancy"];
        if (updateShelf($id, $shelf_code, $description, $capacity, $occupancy)) {
            echo "Shelf updated successfully";
        } else {
            echo "Error updating shelf";
        }
        break;
    case 'DELETE':
        // 处理删除货架请求
        $input = json_decode(file_get_contents('php://input'), true);
        $id = $input["id"];
        if (deleteShelf($id)) {
            echo "Shelf deleted successfully";
        } else {
            echo "Error deleting shelf";
        }
        break;
}

<template>
  <div>
    <h2>货架列表</h2>
    <table>
      <thead>
        <tr>
          <th>货架编号</th>
          <th>描述</th>
          <th>容量</th>
          <th>占用</th>
          <th>操作</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="shelf in shelves" :key="shelf.id">
          <td>{{ shelf.shelf_code }}</td>
          <td>{{ shelf.description }}</td>
          <td>{{ shelf.capacity }}</td>
          <td>{{ shelf.occupancy }}</td>
          <td>
            <button @click="editShelf(shelf.id)">编辑</button>
            <button @click="deleteShelf(shelf.id)">删除</button>
          </td>
        </tr>
      </tbody>
    </table>
    <button @click="addShelf()">新增货架</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      shelves: []
    }
  },
  created() {
    this.fetchShelves();
  },
  methods: {
    fetchShelves() {
      // 发起HTTP请求获取货架数据
      fetch('http://localhost/api/shelf.php')
        .then(response => response.json())
        .then(data => {
          this.shelves = data;
        });
    },
    addShelf() {
      // 打开新增货架对话框
      // ...
    },
    editShelf(id) {
      // 打开编辑货架对话框
      // ...
    },
    deleteShelf(id) {
      // 发起HTTP请求删除货架
      fetch('http://localhost/api/shelf.php', {
        method: 'DELETE',
        headers: {
          'Content-Type': 'application/json'
        },
        body: JSON.stringify({ id: id })
      })
        .then(response => response.text())
        .then(data => {
          console.log(data);
          this.fetchShelves();
        });
    }
  }
}
</script>

export function createShelf(shelf) {
  return fetch('http://localhost/api/shelf.php', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(shelf)
  })
    .then(response => response.text())
    .then(data => {
      console.log(data);
    });
}

// 同理，封装更新货架和删除货架的接口调用方法
// ...