Cara menggunakan PHP dan Vue untuk membangunkan fungsi pengurusan klasifikasi kargo untuk pengurusan gudang

Cara menggunakan PHP dan Vue untuk membangunkan fungsi pengurusan klasifikasi kargo pengurusan gudang

Pengenalan:
Dalam pengurusan logistik moden , Pengurusan gudang memainkan peranan yang penting. Antaranya, pengurusan klasifikasi barangan adalah bahagian yang sangat diperlukan untuk meningkatkan kecekapan gudang. Artikel ini akan memperkenalkan cara menggunakan PHP dan Vue untuk membangunkan sistem pengurusan gudang mudah untuk melaksanakan fungsi pengurusan klasifikasi barangan.

1. Penyediaan teknikal:

1. Pembinaan persekitaran pembangunan back-end PHP (seperti pelayan Apache, pangkalan data MySQL, dll.)
#🎜 🎜#Vue front-end Pembinaan persekitaran Pembangunan (seperti Node.js, Vue CLI, dll.)
2. Pengetahuan asas HTML, CSS dan JavaScript

Cipta dua jadual dalam pangkalan data MySQL: kategori (jadual klasifikasi barangan) dan produk (jadual barangan). Struktur jadual khusus adalah seperti berikut:

id: kunci utama, kenaikan automatik
• nama: kategori nama

id: kunci utama, auto-increment
• nama: nama produk#🎜 🎜#
• category_id : Kunci asing bagi kategori yang menjadi miliknya
• 3. Pembangunan bahagian belakang (PHP):

#🎜🎜 #

<?php
$con=mysqli_connect("localhost","my_user","my_password","my_db");
if (mysqli_connect_errno()){
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
?>

1. Buat antara muka untuk mendapatkan senarai kategori:

   <?php
   $sql = "SELECT * FROM categories";
   $result = mysqli_query($con, $sql);
   
   $data = [];
   while($row = mysqli_fetch_array($result)){
     $data[] = $row;
   }
   
   echo json_encode($data);
   ?>

   Salin selepas log masuk
   #🎜#
#🎜##🎜 🎜🎜#Buat antara muka untuk mendapatkan senarai barangan di bawah kategori tertentu:# 🎜🎜#

<?php
$category_id = $_GET['category_id'];
$sql = "SELECT * FROM products WHERE category_id = '$category_id'";
$result = mysqli_query($con, $sql);

$data = [];
while($row = mysqli_fetch_array($result)){
  $data[] = $row;
}

echo json_encode($data);
?>

Salin selepas log masuk

2. Buat antara muka untuk menambah barangan:

<?php
$name = $_POST['name'];
$category_id = $_POST['category_id'];

$sql = "INSERT INTO products (name, category_id) VALUES ('$name', '$category_id')";
if(mysqli_query($con, $sql)){
  echo "Product added successfully";
}
else{
  echo "Error: " . mysqli_error($con);
}

mysqli_close($con);
?>

Salin selepas log masuk
#🎜🎜

3. 4. Pembangunan bahagian hadapan (Vue): #🎜🎜 #

4. Buat halaman utama pengurusan gudang:

   <template>
     <div class="container">
    <h1>仓库管理系统</h1>
    <div class="categories">
      <h2>货物分类</h2>
      <ul>
        <li v-for="category in categories" :key="category.id" @click="getProducts(category.id)">
          {{ category.name }}
        </li>
      </ul>
    </div>
    <div class="products">
      <h2>货物列表</h2>
      <ul>
        <li v-for="product in products" :key="product.id">
          {{ product.name }}
        </li>
      </ul>
      <form @submit="addProduct">
        <input type="text" v-model="productName" placeholder="货物名称">
        <select v-model="selectedCategory">
          <option v-for="category in categories" :key="category.id" :value="category.id">
            {{ category.name }}
          </option>
        </select>
        <button type="submit">添加货物</button>
      </form>
    </div>
     </div>
   </template>
   
   <script>
   export default {
     data() {
    return {
      categories: [],
      products: [],
      selectedCategory: '',
      productName: ''
    }
     },
     mounted() {
    this.getCategories();
     },
     methods: {
    getCategories() {
      // 发送GET请求获取分类列表
      // 更新categories数据
    },
    getProducts(categoryId) {
      // 发送GET请求获取某个分类下的货物列表
      // 更新products数据
    },
    addProduct(e) {
      e.preventDefault();
      // 发送POST请求添加新的货物
      // 更新products数据
      this.productName = '';
      this.selectedCategory = '';
    }
     }
   }
   </script>

   Salin selepas log masuk
   #🎜 # 5. Jalankan projek:
   Projek bahagian belakang digunakan ke pelayan PHP.
   1. Projek bahagian hadapan dibungkus menggunakan Vue CLI, dan kemudian fail index.html yang dijana dibuka dalam penyemak imbas.

   Kesimpulan:
   Dengan menggunakan PHP dan Vue, kami boleh membangunkan fungsi pengurusan klasifikasi kargo pengurusan gudang dengan mudah. Artikel ini menyediakan contoh kod khusus, dengan harapan dapat membantu pembaca menggunakan teknologi berkaitan dalam projek sebenar. Sudah tentu, sebagai tambahan kepada contoh di atas, anda juga boleh melakukan pengembangan dan pengoptimuman yang lebih berfungsi mengikut keperluan sebenar. Selamat mengekod!

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