Comment utiliser PHP et Vue pour développer des fonctions de gestion des stocks pour la gestion des entrepôts
Introduction :
Avec le développement des industries du commerce électronique et de l'O2O, la gestion des entrepôts est devenue de plus en plus importante pour l'efficacité opérationnelle et l'expérience utilisateur des entreprises. Afin d'obtenir un fonctionnement efficace de la gestion des entrepôts, nous pouvons utiliser PHP et Vue pour créer un système de gestion des stocks. Cet article présentera en détail comment utiliser PHP et Vue pour développer la fonction de gestion des stocks de la gestion d'entrepôt et fournira des exemples de code spécifiques.
1. Créer une table de base de données
Tout d'abord, nous devons créer une table de base de données pour stocker les données liées à la gestion de l'entrepôt. Dans cet exemple, nous allons créer deux tables, products
et inventory
. products
和inventory
。
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) );
inventory
produits
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 );
inventaire
<?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); } ?>
<?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); ?>
<?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"; } ?>
<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>
import Vue from 'vue'; import Products from './components/Products.vue'; new Vue({ render: h => h(Products) }).$mount('#app');
Configurez le code front-end
Placez le code front-end dans un répertoire approprié et utilisez Vue CLI ou d'autres outils pour le créer et le conditionner.
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!