Comment utiliser PHP et Vue pour implémenter la fonction de gestion d'entrepôt de la gestion d'entrepôt

Comment utiliser PHP et Vue pour implémenter la fonction de gestion d'entrepôt de la gestion d'entrepôt

Dans les opérations commerciales modernes, la gestion d'entrepôt est un élément très important. Une bonne gestion des entrepôts peut aider les entreprises à mieux comprendre les conditions des stocks et à améliorer l’efficacité et la précision de la gestion des marchandises. Cet article expliquera comment utiliser PHP et Vue pour implémenter la fonction de gestion d'entrepôt de la gestion d'entrepôt et fournira des exemples de code spécifiques.

1. Préparation
Avant de commencer à écrire du code, nous devons faire quelques préparatifs. Tout d'abord, assurez-vous d'avoir installé les versions appropriées de PHP et Vue.js et configuré l'environnement de développement correspondant. Deuxièmement, nous devons également créer une base de données et créer les tables de données correspondantes pour stocker les données liées à la gestion des entrepôts.

2. Créer des tables de base de données
Dans la fonction de gestion d'entrepôt de la gestion d'entrepôt, nous devons créer les tables de base de données suivantes :

1. table des marchandises : stocke les informations sur les marchandises, y compris le nom des marchandises, le numéro des marchandises, le modèle, les spécifications, l'unité et autres. champs.

créer une table goods (goods (

`id` int(11) not null auto_increment,
`name` varchar(255) not null,
`code` varchar(255) not null,
`model` varchar(255),
`spec` varchar(255),
`unit` varchar(255),
primary key (`id`)

) engine=InnoDB default charset=utf8;

2. stock表：存储库存信息，包括货物ID、入库数量、入库时间等字段。

create table stock

`id` int(11) not null auto_increment,
`goods_id` int(11) not null,
`quantity` int(11) not null,
`created_at` timestamp not null default current_timestamp,
primary key (`id`),
foreign key (`goods_id`) references `goods` (`id`)

) engine=InnoDB default charset=utf8;

stock table : stocke les informations d'inventaire, y compris l'ID des marchandises et la quantité d'entrepôt, temps de stockage et autres champs.




créer une table stock (

$stmt = $conn->prepare('SELECT * FROM goods');
$stmt->execute();
$result = $stmt->fetchAll(PDO::FETCH_ASSOC);

echo json_encode($result);

) engine=InnoDB default charset=utf8;
3 Écrire du code PHP

Ensuite, nous écrirons du code PHP pour gérer l'interaction avec la base de données, pour réaliser fonctions connexes de gestion de l’entrepôt. Tout d'abord, nous devons créer un fichier config.php pour nous connecter à la base de données :

config.php



$db_host = 'localhost';
$db_name = 'your_db_name'; your_db_user ';

$db_pass = 'your_db_pass';

$conn = new PDO("mysql:host=$db_host;dbname=$db_name", $db_user, $db_pass);

$conn->setAttribute(PDO: : ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
?>


Ensuite, nous créerons un fichier api.php pour gérer l'interaction des données avec le front-end Vue :

api.php

require_once ( 'config.php');

header('Content-Type: application/json');

// Obtenez la liste des marchandises
if ($_GET['action'] == 'getGoodsList') {

$goods_id = $_POST['goods_id'];
$quantity = $_POST['quantity'];

$stmt = $conn->prepare('INSERT INTO stock (goods_id, quantity) VALUES (?, ?)');
$stmt->execute([$goods_id, $quantity]);

echo json_encode(['status' => 'success']);

}


//Ajouter un enregistrement de stockage

if ($_POST['action'] == 'addStock') {


<meta charset="UTF-8">
<title>仓库管理</title>

}

?>

4. Écrire le code Vue
Dans cette section, nous utiliserons Vue. .js gère la logique frontale et implémente la fonction de gestion d'entrepôt de la gestion d'entrepôt. Tout d'abord, nous devons créer une instance Vue et obtenir la liste des produits :


index.html







<div id="app">
    <h1>入库管理</h1>
    <form @submit.prevent="addStock">
        <select v-model="selectedGoods">
            <option v-for="goods in goodsList" :value="goods.id">{{ goods.name }}</option>
        </select>
        <input type="number" min="1" v-model="quantity" required>
        <button type="submit">确认入库</button>
    </form>
    <ul>
        <li v-for="stock in stockList">{{ stock.name }} 入库 {{ stock.quantity }} 件</li>
    </ul>
</div>

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    new Vue({
        el: '#app',
        data: {
            selectedGoods: '',
            quantity: '',
            goodsList: [],
            stockList: []
        },
        methods: {
            getGoodsList() {
                fetch('api.php?action=getGoodsList')
                .then(response => response.json())
                .then(data => {
                    this.goodsList = data;
                });
            },
            addStock() {
                const formData = new FormData();
                formData.append('action', 'addStock');
                formData.append('goods_id', this.selectedGoods);
                formData.append('quantity', this.quantity);

                fetch('api.php', {
                    method: 'POST',
                    body: formData
                })
                .then(() => {
                    this.getStockList();
                    this.selectedGoods = '';
                    this.quantity = '';
                });
            },
            getStockList() {
                // 获取入库记录列表
            }
        },
        mounted() {
            this.getGoodsList();
            this.getStockList();
        }
    });
</script>

rrreee🎜

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!