Wie man mit PHP und Vue Bestandsverwaltungsfunktionen für die Lagerverwaltung entwickelt

So verwenden Sie PHP und Vue, um Bestandsverwaltungsfunktionen für die Lagerverwaltung zu entwickeln

Einführung:
Mit der Entwicklung der E-Commerce- und O2O-Branchen ist die Lagerverwaltung für die betriebliche Effizienz und das Benutzererlebnis immer wichtiger geworden Unternehmen. Um einen effizienten Betrieb der Lagerverwaltung zu erreichen, können wir mit PHP und Vue ein Bestandsverwaltungssystem aufbauen. In diesem Artikel wird detailliert beschrieben, wie PHP und Vue zum Entwickeln der Bestandsverwaltungsfunktion der Lagerverwaltung verwendet werden, und es werden spezifische Codebeispiele bereitgestellt.

1. Erstellen Sie eine Datenbanktabelle
Zuerst müssen wir eine Datenbanktabelle erstellen, um Daten im Zusammenhang mit der Lagerverwaltung zu speichern. In diesem Beispiel erstellen wir zwei Tabellen, products und inventory. products和inventory。

1. products 表

   CREATE TABLE products (
     id INT(11) NOT NULL AUTO_INCREMENT,
     name VARCHAR(100) NOT NULL,
     price DECIMAL(10, 2) NOT NULL,
     PRIMARY KEY (id)
   );

   Nach dem Login kopieren

2. inventory

CREATE TABLE inventory (
  id INT(11) NOT NULL AUTO_INCREMENT,
  product_id INT(11) NOT NULL,
  quantity INT(11) NOT NULL,
  PRIMARY KEY (id),
  FOREIGN KEY (product_id) REFERENCES products(id) ON DELETE CASCADE
);

inventory Tabelle

1. <?php
   $servername = "localhost";
   $username = "root";
   $password = "";
   $dbname = "inventory";
   
   $conn = new mysqli($servername, $username, $password, $dbname);
   if ($conn->connect_error) {
     die("Connection failed: " . $conn->connect_error);
   }
   ?>

   Nach dem Login kopieren

2. Backend-Entwicklung
2. Als nächstes verwenden wir PHP, um die Backend-Schnittstelle zu entwickeln Bearbeiten Sie Anfragen vom Frontend und interagieren Sie mit der Datenbank.

3. Mit Datenbank verbinden

   <?php
   $sql = "SELECT * FROM products";
   $result = $conn->query($sql);
   $products = array();
   
   if ($result->num_rows > 0) {
     while($row = $result->fetch_assoc()) {
       array_push($products, $row);
     }
   }
   
   echo json_encode($products);
   ?>

   Nach dem Login kopieren

<?php
$data = json_decode(file_get_contents("php://input"), true);
$productId = $data['product']['id'];
$quantity = $data['product']['quantity'];

$sql = "UPDATE inventory SET quantity = '$quantity' WHERE product_id = '$productId'";
$result = $conn->query($sql);

if ($result) {
  echo "success";
} else {
  echo "error";
}
?>

Bestandsmenge aktualisieren

1. <template>
     <div>
       <h2>产品列表</h2>
       <ul>
         <li v-for="product in products" :key="product.id">
           {{ product.name }} - ￥{{ product.price }}
           <input type="number" v-model="product.quantity" @change="updateInventory(product)">
         </li>
       </ul>
     </div>
   </template>
   
   <script>
   export default {
     data() {
       return {
         products: []
       };
     },
     mounted() {
       this.fetchProducts();
     },
     methods: {
       fetchProducts() {
         // 使用axios发送GET请求获取产品列表数据
         axios.get('/api/getProducts')
           .then(response => {
             this.products = response.data;
         })
       },
       updateInventory(product) {
         // 使用axios发送POST请求更新库存数量
         axios.post('/api/updateInventory', { product: product })
           .then(response => {
             if (response.data === 'success') {
               alert('库存数量更新成功');
             } else {
               alert('库存数量更新失败');
             }
         })
       }
     }
   };
   </script>

   Nach dem Login kopieren

3. Front-End-Entwicklung
2. Im Front-End-Teil verwenden wir Vue, um die Benutzeroberfläche zu erstellen und rufen Sie die Back-End-Schnittstelle auf, um die Funktion der Bestandsverwaltung zu realisieren. „Holen Sie sich die Produktliste und zeigen Sie sie an.“ PHP-Server.
   Konfigurieren Sie den Front-End-Code.
Platzieren Sie den Front-End-Code in einem geeigneten Verzeichnis und verwenden Sie Vue CLI oder andere Tools, um ihn zu erstellen und zu verpacken.

Führen Sie das Projekt aus

1. 
   Fazit:
In diesem Artikel haben wir gelernt, wie man mit PHP und Vue Bestandsverwaltungsfunktionen für die Lagerverwaltung entwickelt. Wir haben zunächst eine Datenbanktabelle erstellt und mit PHP eine Back-End-Schnittstelle geschrieben, um die Funktionen zum Abrufen von Produktlisten und zum Aktualisieren von Lagerbeständen zu implementieren. Anschließend haben wir mit Vue die Benutzeroberfläche erstellt und die Bestandsverwaltungsfunktion durch Aufrufen der Backend-Schnittstelle implementiert. Ich hoffe, dieser Artikel kann den Lesern helfen, PHP und Vue besser zu verstehen und anzuwenden, um Bestandsverwaltungsfunktionen für die Lagerverwaltung zu entwickeln.

Das obige ist der detaillierte Inhalt vonWie man mit PHP und Vue Bestandsverwaltungsfunktionen für die Lagerverwaltung entwickelt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!