Jadual Kandungan
商品列表
库存信息
Rumah pembangunan bahagian belakang tutorial php Cara menggunakan PHP dan Vue untuk melaksanakan fungsi tetapan inventori standard pengurusan gudang

Cara menggunakan PHP dan Vue untuk melaksanakan fungsi tetapan inventori standard pengurusan gudang

Sep 25, 2023 pm 05:15 PM
php vue pengurusan gudang

Cara menggunakan PHP dan Vue untuk melaksanakan fungsi tetapan inventori standard pengurusan gudang

Cara menggunakan PHP dan Vue untuk melaksanakan fungsi tetapan inventori standard pengurusan gudang

Pengenalan:
Dalam pengurusan gudang moden, kawalan inventori adalah bahagian yang sangat penting. Cara menggunakan PHP dan Vue untuk melaksanakan fungsi tetapan inventori standard pengurusan gudang telah menjadi persoalan yang patut dikaji. Artikel ini akan memperkenalkan cara menggunakan PHP dan Vue untuk melaksanakan fungsi tetapan inventori standard pengurusan gudang dan menyediakan contoh kod khusus.

1. Persediaan
Pertama, kita perlu membina persekitaran pembangunan berdasarkan PHP dan Vue. Anda boleh memilih untuk menggunakan pelayan setempat, seperti XAMPP, dsb., atau menggunakan persekitaran pembangunan dalam talian, seperti CodePen, JSFiddle, dsb. Selepas memastikan persekitaran berjalan dengan betul, kami boleh memulakan pengekodan.

2. Buat pangkalan data
Pertama, kita perlu buat pangkalan data untuk menyimpan maklumat produk dan data inventori gudang. Anda boleh menggunakan MySQL atau pangkalan data hubungan lain untuk mencipta pangkalan data bernama "inventori" dan mencipta dua jadual, "produk" dan "stok".

Jadual "produk" mengandungi medan berikut:

  • id: ID Produk (kunci utama auto-incremented)
  • nama: Nama produk
  • harga: Harga produk
  • kategori: Kategori produk
mengandungi medan berikut :

    id: ID Inventori (kunci utama auto-incremented)
  • product_id: ID Produk (kunci asing yang dikaitkan dengan medan id jadual "produk")
  • kuantiti: Kuantiti produk
. Cipta antara muka belakang

Gunakan PHP Untuk mencipta antara muka belakang, biarkan bahagian hadapan mendapatkan dan mengubah suai data dalam pangkalan data melalui antara muka. Berikut ialah contoh kod PHP mudah untuk mendapatkan senarai produk dan maklumat inventori produk:

<?php
// 连接数据库
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "inventory";
$conn = new mysqli($servername, $username, $password, $dbname);
// 检查连接是否成功
if ($conn->connect_error) {
    die("连接失败: " . $conn->connect_error);
}
// 获取商品列表
$sql = "SELECT * FROM products";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
    $products = array();
    while($row = $result->fetch_assoc()) {
        $products[] = $row;
    }
    echo json_encode($products);
} else {
    echo "0 结果";
}
// 获取商品的库存信息
$product_id = $_GET['product_id'];
$sql = "SELECT * FROM stock WHERE product_id = $product_id";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
    $stock = array();
    while($row = $result->fetch_assoc()) {
        $stock[] = $row;
    }
    echo json_encode($stock);
} else {
    echo "0 结果";
}
$conn->close();
?>
Salin selepas log masuk

IV Cipta antara muka hadapan

Gunakan Vue untuk mencipta antara muka hadapan, dan gunakan perpustakaan axios untuk menghantar permintaan HTTP dan. berinteraksi dengan antara muka bahagian belakang . Berikut ialah contoh kod Vue mudah untuk memaparkan senarai produk dan maklumat inventori produk:

<!DOCTYPE html>
<html>
<head>
  <title>仓库管理</title>
  <script src="https://cdn.jsdelivr.net/npm/vue"></script>
  <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</head>
<body>
  <div id="app">
    <h1 id="商品列表">商品列表</h1>
    <ul>
      <li v-for="product in products" :key="product.id">
        <span>{{ product.name }}</span> -
        <span>{{ product.price }}</span>元 -
        <span>{{ product.category }}</span>
        <button @click="getStock(product.id)">查看库存</button>
      </li>
    </ul>
    <h1 id="库存信息">库存信息</h1>
    <ul>
      <li v-for="stock in stockList" :key="stock.id">
        <span>{{ stock.quantity }}</span>件
      </li>
    </ul>
  </div>
  <script>
    var app = new Vue({
      el: '#app',
      data: {
        products: [],
        stockList: []
      },
      methods: {
        getProducts() {
          axios.get('backend.php')
            .then(response => {
              this.products = response.data;
            })
            .catch(error => {
              console.log(error);
            });
        },
        getStock(product_id) {
          axios.get(`backend.php?product_id=${product_id}`)
            .then(response => {
              this.stockList = response.data;
            })
            .catch(error => {
              console.log(error);
            });
        }
      },
      mounted() {
        this.getProducts();
      }
    });
  </script>
</body>
</html>
Salin selepas log masuk

5. Jalankan dan uji

Simpan kod PHP di atas sebagai fail "backend.php", dan simpan kod Vue sebagai " indeks .html" fail. Letakkan kedua-dua fail ini dalam direktori yang sama dan buka fail "index.html" dalam penyemak imbas untuk melihat senarai produk dan maklumat inventori.

6. Ringkasan

Melalui langkah di atas, kami berjaya menggunakan PHP dan Vue untuk melaksanakan fungsi tetapan inventori standard pengurusan gudang. Senarai produk dan maklumat inventori boleh dipaparkan melalui antara muka bahagian hadapan, dan data dalam pangkalan data boleh diperoleh secara dinamik dan diubah suai melalui antara muka bahagian belakang. Sudah tentu, dalam projek sebenar, kami juga boleh mengembangkan dan mengoptimumkan mengikut keperluan tertentu. Saya harap kandungan di atas dapat membantu anda, dan saya berharap anda mendapat hasil yang lebih baik dalam pengurusan gudang!

Atas ialah kandungan terperinci Cara menggunakan PHP dan Vue untuk melaksanakan fungsi tetapan inventori standard pengurusan gudang. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Cara menambah fungsi ke butang untuk vue Cara menambah fungsi ke butang untuk vue Apr 08, 2025 am 08:51 AM

Anda boleh menambah fungsi ke butang VUE dengan mengikat butang dalam templat HTML ke kaedah. Tentukan kaedah dan tulis logik fungsi dalam contoh Vue.

PHP dan Python: Membandingkan dua bahasa pengaturcaraan yang popular PHP dan Python: Membandingkan dua bahasa pengaturcaraan yang popular Apr 14, 2025 am 12:13 AM

PHP dan Python masing -masing mempunyai kelebihan mereka sendiri, dan memilih mengikut keperluan projek. 1.PHP sesuai untuk pembangunan web, terutamanya untuk pembangunan pesat dan penyelenggaraan laman web. 2. Python sesuai untuk sains data, pembelajaran mesin dan kecerdasan buatan, dengan sintaks ringkas dan sesuai untuk pemula.

Masa Depan PHP: Adaptasi dan Inovasi Masa Depan PHP: Adaptasi dan Inovasi Apr 11, 2025 am 12:01 AM

Masa depan PHP akan dicapai dengan menyesuaikan diri dengan trend teknologi baru dan memperkenalkan ciri -ciri inovatif: 1) menyesuaikan diri dengan pengkomputeran awan, kontena dan seni bina microservice, menyokong Docker dan Kubernetes; 2) memperkenalkan pengkompil JIT dan jenis penghitungan untuk meningkatkan prestasi dan kecekapan pemprosesan data; 3) Berterusan mengoptimumkan prestasi dan mempromosikan amalan terbaik.

PHP vs Python: Memahami Perbezaan PHP vs Python: Memahami Perbezaan Apr 11, 2025 am 12:15 AM

PHP dan Python masing -masing mempunyai kelebihan sendiri, dan pilihannya harus berdasarkan keperluan projek. 1.Php sesuai untuk pembangunan web, dengan sintaks mudah dan kecekapan pelaksanaan yang tinggi. 2. Python sesuai untuk sains data dan pembelajaran mesin, dengan sintaks ringkas dan perpustakaan yang kaya.

Status Semasa PHP: Lihat trend pembangunan web Status Semasa PHP: Lihat trend pembangunan web Apr 13, 2025 am 12:20 AM

PHP tetap penting dalam pembangunan web moden, terutamanya dalam pengurusan kandungan dan platform e-dagang. 1) PHP mempunyai ekosistem yang kaya dan sokongan rangka kerja yang kuat, seperti Laravel dan Symfony. 2) Pengoptimuman prestasi boleh dicapai melalui OPCACHE dan NGINX. 3) Php8.0 memperkenalkan pengkompil JIT untuk meningkatkan prestasi. 4) Aplikasi awan asli dikerahkan melalui Docker dan Kubernet untuk meningkatkan fleksibiliti dan skalabiliti.

PHP: Bahasa utama untuk pembangunan web PHP: Bahasa utama untuk pembangunan web Apr 13, 2025 am 12:08 AM

PHP adalah bahasa skrip yang digunakan secara meluas di sisi pelayan, terutamanya sesuai untuk pembangunan web. 1.PHP boleh membenamkan HTML, memproses permintaan dan respons HTTP, dan menyokong pelbagai pangkalan data. 2.PHP digunakan untuk menjana kandungan web dinamik, data borang proses, pangkalan data akses, dan lain -lain, dengan sokongan komuniti yang kuat dan sumber sumber terbuka. 3. PHP adalah bahasa yang ditafsirkan, dan proses pelaksanaan termasuk analisis leksikal, analisis tatabahasa, penyusunan dan pelaksanaan. 4.Php boleh digabungkan dengan MySQL untuk aplikasi lanjutan seperti sistem pendaftaran pengguna. 5. Apabila debugging php, anda boleh menggunakan fungsi seperti error_reporting () dan var_dump (). 6. Mengoptimumkan kod PHP untuk menggunakan mekanisme caching, mengoptimumkan pertanyaan pangkalan data dan menggunakan fungsi terbina dalam. 7

Cara melompat tag ke vue Cara melompat tag ke vue Apr 08, 2025 am 09:24 AM

Kaedah untuk melaksanakan lompatan tag dalam Vue termasuk: menggunakan tag dalam templat HTML untuk menentukan atribut HREF. Gunakan komponen router-link routing VUE. Gunakan ini. $ Router.push () kaedah dalam JavaScript. Parameter boleh dilalui melalui parameter pertanyaan dan laluan dikonfigurasikan dalam pilihan penghala untuk lompatan dinamik.

Cara melompat ke Div Vue Cara melompat ke Div Vue Apr 08, 2025 am 09:18 AM

Terdapat dua cara untuk melompat elemen div di Vue: Gunakan Vue Router dan tambahkan komponen router-link. Tambah pendengar acara @Click dan panggil ini. $ Router.push () kaedah untuk melompat.

See all articles