PHP と Vue を使用して倉庫管理の販売管理機能を実装する方法
はじめに:
倉庫管理の販売管理機能は、日常業務に不可欠です。エンタープライズ部分の操作。この記事では、PHP と Vue に基づいて、これら 2 つのテクノロジを使用して単純な倉庫管理システムに販売管理機能を実装する方法を紹介し、具体的なコード例を示します。
1. プロジェクトの準備
コードを書き始める前に、いくつかの準備作業を行う必要があります。
2. バックエンド コードの作成
まず、バックエンド ロジックを処理する PHP コードを作成する必要があります。
「index.php」ファイルに次のコードを追加します:
0) { while ($row = mysqli_fetch_assoc($result)) { array_push($sales, $row); } } echo json_encode($sales); } // 3. 处理添加销售记录的请求 if ($_SERVER["REQUEST_METHOD"] == "POST") { $product_name = $_POST["product_name"]; $quantity = $_POST["quantity"]; $price = $_POST["price"]; $sql = "INSERT INTO sales (product_name, quantity, price) VALUES ('$product_name', $quantity, $price)"; if (mysqli_query($conn, $sql)) { echo "销售记录添加成功!"; } else { echo "销售记录添加失败:" . mysqli_error($conn); } } // 4. 关闭数据库连接 mysqli_close($conn); ?>
上記のコードは次の関数を実装します:
3. フロントエンド コードの記述
次に、Vue のフロントエンド コードを記述する必要があります。
「app.js」ファイルに次のコードを追加します:
new Vue({ el: '#app', data: { sales: [], product_name: '', quantity: '', price: '' }, methods: { getSales: function() { axios.get('sales/index.php') .then(response => { this.sales = response.data; }) .catch(error => { console.log(error); }); }, addSale: function() { axios.post('sales/index.php', { product_name: this.product_name, quantity: this.quantity, price: this.price }) .then(response => { alert(response.data); this.getSales(); }) .catch(error => { console.log(error); }); } }, mounted: function() { this.getSales(); } });
上記のコードは次の関数を実装します:
4. ページ表示
最後に、販売管理機能をページに表示する必要があります。
「index.php」ファイルの HTML セクションに、次のコードを追加します。
上記のコードは、単純な販売を実装します。販売記録を表示するためのテーブルと販売記録を追加するためのフォームを含む管理ページ。
5. まとめ
PHP と Vue テクノロジーを使用して、倉庫管理の販売管理機能を実装することに成功しました。 PHP はバックエンド ロジックの処理、データベースへの接続、フロントエンド呼び出し用の API の提供に使用され、Vue はフロントエンド ページ表示と対話ロジックの作成に使用されます。この簡単なサンプル コードは、より複雑な倉庫管理システムを作成するための参照および開始点として役立ちます。この記事があなたの学習や実践に役立つことを願っています。
以上がPHPとVueを使って倉庫管理の販売管理機能を実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。