Comment utiliser PHP et Vue pour développer la fonction de gestion des entrepôts sortants
Avec le développement rapide du commerce électronique, les systèmes de gestion d'entrepôt sont devenus un élément indispensable des opérations quotidiennes de nombreuses entreprises. Parmi eux, la fonction de gestion des sorties de stock est l’un des maillons importants de la gestion des entrepôts. Cet article présentera comment utiliser PHP et Vue pour développer une fonction de gestion sortante simple et pratique, et fournira des exemples de code spécifiques.
1. Analyse des exigences fonctionnelles de gestion sortante
Avant de commencer le développement, nous devons clarifier les exigences relatives aux fonctions de gestion sortante. D'une manière générale, la fonction de gestion des commandes sortantes doit inclure les aspects suivants :
2. Sélection technologique
Afin de réaliser la fonction de gestion sortante, nous avons choisi d'utiliser PHP comme langage de développement back-end et Vue comme framework de développement front-end.
PHP est un langage de script facile à apprendre et à utiliser et doté d'un large éventail d'applications. Vue est un framework JavaScript léger qui peut nous aider à créer des interfaces utilisateur interactives.
3. Conception de la base de données
Avant de commencer à écrire du code, nous devons concevoir une table de base de données pour stocker les informations relatives à la livraison sortante. Voici un exemple simple :
Table des commandes sortantes (stock_out)
table des articles sortants ( stock_out_items)
IV. Implémentation du code backend
Tout d'abord, nous créons un fichier A nommé "stock_out.php", qui gérera la logique back-end liée à la gestion des ruptures de stock.
<?php // 连接数据库 $conn = new mysqli("localhost", "username", "password", "database"); // 检查连接是否成功 if ($conn->connect_error) { die("数据库连接失败: " . $conn->connect_error); } // 获取出库单列表 function getStockOutList() { global $conn; $sql = "SELECT * FROM stock_out"; $result = $conn->query($sql); if ($result->num_rows > 0) { $output = array(); while($row = $result->fetch_assoc()) { $output[] = $row; } return $output; } else { return array(); } } // 创建出库单 function createStockOut($out_date, $operator) { global $conn; $sql = "INSERT INTO stock_out (out_date, operator) VALUES ('$out_date', '$operator')"; if ($conn->query($sql) === TRUE) { return true; } else { return false; } } // 删除出库单 function deleteStockOut($id) { global $conn; $sql = "DELETE FROM stock_out WHERE id = '$id'"; if ($conn->query($sql) === TRUE) { return true; } else { return false; } } // 获取出库物品列表 function getStockOutItems($out_id) { global $conn; $sql = "SELECT * FROM stock_out_items WHERE out_id = '$out_id'"; $result = $conn->query($sql); if ($result->num_rows > 0) { $output = array(); while($row = $result->fetch_assoc()) { $output[] = $row; } return $output; } else { return array(); } } // 创建出库物品 function createStockOutItem($out_id, $item_name, $item_qty) { global $conn; $sql = "INSERT INTO stock_out_items (out_id, item_name, item_qty) VALUES ('$out_id', '$item_name', '$item_qty')"; if ($conn->query($sql) === TRUE) { return true; } else { return false; } } // 删除出库物品 function deleteStockOutItem($id) { global $conn; $sql = "DELETE FROM stock_out_items WHERE id = '$id'"; if ($conn->query($sql) === TRUE) { return true; } else { return false; } }
5. Implémentation du code front-end
Dans le code front-end, nous utilisons le framework Vue pour gérer la logique d'interaction de la fonction de gestion sortante. Voici un exemple simple :
<div id="app"> <h2>出库单管理</h2> <div v-for="stockOut in stockOutList"> <p>出库单ID: {{ stockOut.id }}</p> <p>出库日期: {{ stockOut.out_date }}</p> <p>操作人员: {{ stockOut.operator }}</p> <button @click="deleteStockOut(stockOut.id)">删除</button> </div> <h2>出库物品管理</h2> <div> <input type="text" v-model="item.name" placeholder="物品名称"> <input type="number" v-model="item.qty" placeholder="出库数量"> <button @click="createStockOutItem">添加</button> </div> <div v-for="item in stockOutItems"> <p>物品名称: {{ item.item_name }}</p> <p>出库数量: {{ item.item_qty }}</p> <button @click="deleteStockOutItem(item.id)">删除</button> </div> </div> <script> new Vue({ el: "#app", data: { stockOutList: [], stockOutItems: [], item: { name: "", qty: 0 } }, mounted() { // 获取出库单列表 this.getStockOutList(); }, methods: { // 获取出库单列表 getStockOutList() { axios.get("stock_out.php?action=getStockOutList") .then(response => { this.stockOutList = response.data; }) .catch(error => { console.error(error); }); }, // 删除出库单 deleteStockOut(id) { axios.get(`stock_out.php?action=deleteStockOut&id=${id}`) .then(response => { if (response.data === true) { this.getStockOutList(); alert("删除成功"); } else { alert("删除失败"); } }) .catch(error => { console.error(error); }); }, // 添加出库物品 createStockOutItem() { axios.post("stock_out.php?action=createStockOutItem", this.item) .then(response => { if (response.data === true) { this.getStockOutItems(); alert("添加成功"); } else { alert("添加失败"); } }) .catch(error => { console.error(error); }); }, // 删除出库物品 deleteStockOutItem(id) { axios.get(`stock_out.php?action=deleteStockOutItem&id=${id}`) .then(response => { if (response.data === true) { this.getStockOutItems(); alert("删除成功"); } else { alert("删除成功"); } }) .catch(error => { console.error(error); }); } } }); </script>
6. Résumé
Ce qui précède sont les étapes détaillées et des exemples de code spécifiques pour développer la fonction de gestion sortante de la gestion d'entrepôt à l'aide de PHP et Vue. De cette manière, nous pouvons facilement gérer les commandes sortantes et les articles sortants, améliorant ainsi l’efficacité et la précision de la gestion de l’entrepôt. J'espère que cet article vous sera utile.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!