Comment utiliser PHP et Vue pour développer la fonction de suivi des marchandises de la gestion d'entrepôt
Introduction :
Avec le développement rapide du commerce électronique, la gestion d'entrepôt est devenue un maillon très important. Afin d’améliorer l’efficacité et la précision de la gestion des entrepôts, il est nécessaire de développer un système de suivi des marchandises. Cet article présentera comment utiliser PHP et Vue pour développer la fonction de suivi des marchandises de gestion d'entrepôt et donnera des exemples de code spécifiques.
1. Préparation technique
Avant de commencer le développement, nous devons préparer les technologies et outils suivants :
2. Conception de la base de données
Avant de commencer à écrire du code, nous devons concevoir la structure de la base de données. Compte tenu des besoins de gestion des entrepôts, nous devons créer les tables suivantes :
3. Développement back-end
Créer une base de données. connexion
Nous devons d’abord créer une connexion à la base de données en PHP. Ceci peut être réalisé en utilisant les fonctions fournies par la bibliothèque d'extension mysqli :
$servername = "localhost"; $username = "root"; $password = ""; $dbname = "warehouse_management"; // 创建数据库连接 $conn = new mysqli($servername, $username, $password, $dbname); // 检查连接是否成功 if ($conn->connect_error) { die("连接数据库失败: " . $conn->connect_error); }
Obtenez toutes les informations sur l'entrepôt :
$app->get('/warehouses', function () use ($app, $conn) { $sql = "SELECT * FROM warehouses"; $result = $conn->query($sql); $warehouses = array(); if ($result->num_rows > 0) { while($row = $result->fetch_assoc()) { $warehouses[] = $row; } } $app->response->headers->set('Content-Type', 'application/json'); echo json_encode($warehouses); });
Obtenez des informations sur le fret dans l'entrepôt spécifié :
$app->get('/warehouses/:id/goods', function ($id) use ($app, $conn) { $sql = "SELECT * FROM goods_warehouses WHERE warehouse_id = $id"; $result = $conn->query($sql); $goods = array(); if ($result->num_rows > 0) { while($row = $result->fetch_assoc()) { $goods[] = $row; } } $app->response->headers->set('Content-Type', 'application/json'); echo json_encode($goods); });
Ajoutez de nouvelles marchandises à l'entrepôt spécifié :
$app->post('/warehouses/:id/goods', function ($id) use ($app, $conn) { $request = json_decode($app->request->getBody()); $name = $request->name; $description = $request->description; $quantity = $request->quantity; $date = date('Y-m-d H:i:s'); $sql = "INSERT INTO goods_warehouses (warehouse_id, name, description, quantity, date) VALUES ($id, '$name', '$description', $quantity, '$date')"; if ($conn->query($sql) === TRUE) { $response = array('status' => 'success'); } else { $response = array('status' => 'error', 'message' => $conn->error); } $app->response->headers->set('Content-Type', 'application/json'); echo json_encode($response); });
Mettre à jour les marchandises Quantité :
$app->put('/goods/:id/quantity', function ($id) use ($app, $conn) { $quantity = json_decode($app->request->getBody()); $sql = "UPDATE goods_warehouses SET quantity = $quantity WHERE id = $id"; if ($conn->query($sql) === TRUE) { $response = array('status' => 'success'); } else { $response = array('status' => 'error', 'message' => $conn->error); } $app->response->headers->set('Content-Type', 'application/json'); echo json_encode($response); });
4. Développement front-end
Créer une application Vue
Nous devons utiliser Vue pour créer l'interface utilisateur. Tout d'abord, vous devez introduire la bibliothèque Vue en HTML et créer une instance Vue :
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>仓库管理系统</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> </head> <body> <div id="app"> <!-- 在这里编写Vue模板代码 --> </div> <script src="js/app.js"></script> </body> </html>
Obtenez toutes les informations sur l'entrepôt :
var app = new Vue({ el: '#app', data: { warehouses: [] }, mounted() { axios.get('/api/warehouses') .then(response => { this.warehouses = response.data; }) .catch(error => { console.log(error); }); } });
Obtenez des informations sur les marchandises dans l'entrepôt spécifié :
var app = new Vue({ el: '#app', data: { goods: [] }, mounted() { var id = 1; // 仓库ID axios.get('/api/warehouses/' + id + '/goods') .then(response => { this.goods = response.data; }) .catch(error => { console.log(error); }); } });
Ajoutez de nouvelles marchandises à l'entrepôt spécifié :
var app = new Vue({ el: '#app', data: { name: '', description: '', quantity: '' }, methods: { addGoods() { var id = 1; // 仓库ID axios.post('/api/warehouses/' + id + '/goods', { name: this.name, description: this.description, quantity: this.quantity }) .then(response => { console.log(response.data); }) .catch(error => { console.log(error); }); } } });
Mettre à jour la quantité de marchandises :
var app = new Vue({ el: '#app', data: { goodsId: '', quantity: '' }, methods: { updateQuantity() { axios.put('/api/goods/' + this.goodsId + '/quantity', this.quantity) .then(response => { console.log(response.data); }) .catch(error => { console.log(error); }); } } });
5. Résumé
En utilisant le développement PHP et Vue, nous pouvons facilement implémenter la fonction de suivi des marchandises de la gestion d'entrepôt. PHP offre la possibilité d'interagir avec la base de données et Vue peut nous aider à créer des interfaces utilisateur et à envoyer des requêtes API. Cet article donne quelques exemples de code spécifiques, dans l’espoir d’être utile à votre travail de développement. Bon développement !
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!