Cara menggunakan PHP dan Vue untuk membangunkan fungsi pengurusan pembekal untuk pengurusan gudang

Tajuk: Menggunakan PHP dan Vue untuk membangunkan fungsi pengurusan pembekal untuk pengurusan gudang

Kata Pengantar:
Dalam perusahaan Pengurusan moden, gudang dan pengurusan pembekal adalah aspek yang sangat penting. Pengurusan gudang melibatkan operasi seperti kemasukan, keluar dan inventori item, manakala pengurusan pembekal merujuk kepada pengurusan maklumat pembekal, termasuk fungsi seperti menambah, mengedit, memadam dan bertanya. Artikel ini akan memperkenalkan cara menggunakan PHP dan Vue untuk membangunkan fungsi pengurusan pembekal pengurusan gudang, dan menyediakan contoh kod khusus.

1. Persediaan persekitaran

1. Alat yang diperlukan: PHP, Vue.js, MySQL, dll.
2. Perlu memasang PHP yang berkaitan sambungan (seperti sambungan PDO) dan pemalam Vue.js (seperti axios)

2. Reka bentuk pangkalan data
Buat dua jadual dalam pangkalan data MySQL: gudang dan pembekal .
Jadual gudang digunakan untuk menyimpan maklumat gudang, termasuk ID gudang, nama gudang, alamat gudang dan medan lain.
Meja pembekal digunakan untuk menyimpan maklumat pembekal, termasuk ID pembekal, nama pembekal, orang untuk dihubungi, nombor hubungan dan medan lain.

3. Pembangunan bahagian belakang

1. Buat fail PHP bernama supplier.php untuk mengendalikan permintaan berkaitan pembekal.

2. Tulis kod untuk mendapatkan senarai pembekal, gunakan PDO untuk menyambung ke pangkalan data dan laksanakan penyata SQL untuk mendapatkan maklumat senarai pembekal. Kembalikan hasil ke bahagian hadapan dalam format JSON.
   Kod sampel adalah seperti berikut:

   <?php
   // 获取供应商列表
   $db = new PDO("mysql:host=localhost;dbname=test", "username", "password");
   $stmt = $db->prepare("SELECT * FROM supplier");
   $stmt->execute();
   $result = $stmt->fetchAll(PDO::FETCH_ASSOC);
   echo json_encode($result);
   ?>

3. Tulis kod untuk menambah pembekal bahagian hadapan menghantar maklumat pembekal kepada pembekal.php melalui POST permintaan, dan bahagian belakang menghantar data Masukkan ke dalam pangkalan data.
   Kod sampel adalah seperti berikut:

   <?php
   // 添加供应商
   $db = new PDO("mysql:host=localhost;dbname=test", "username", "password");
   $stmt = $db->prepare("INSERT INTO supplier (name, contact, phone) VALUES (?, ?, ?)");
   $stmt->bindParam(1, $_POST['name']);
   $stmt->bindParam(2, $_POST['contact']);
   $stmt->bindParam(3, $_POST['phone']);
   $stmt->execute();
   ?>

4. Tulis kod untuk mengedit pembekal bahagian hadapan menghantar maklumat pembekal kepada pembekal.php melalui POST permintaan, dan bahagian belakang melaraskan maklumat pembekal mengikut pembekal ID pedagang mengemas kini data yang sepadan dalam pangkalan data.
   Kod sampel adalah seperti berikut:

   <?php
   // 编辑供应商
   $db = new PDO("mysql:host=localhost;dbname=test", "username", "password");
   $stmt = $db->prepare("UPDATE supplier SET name=?, contact=?, phone=? WHERE id=?");
   $stmt->bindParam(1, $_POST['name']);
   $stmt->bindParam(2, $_POST['contact']);
   $stmt->bindParam(3, $_POST['phone']);
   $stmt->bindParam(4, $_POST['id']);
   $stmt->execute();
   ?>

5. Tulis kod untuk memadamkan pembekal permintaan POST, dan bahagian belakang melaraskan ID pembekal berdasarkan ID Perniagaan pembekal memadamkan data yang sepadan dalam pangkalan data.
   Kod sampel adalah seperti berikut:

   <?php
   // 删除供应商
   $db = new PDO("mysql:host=localhost;dbname=test", "username", "password");
   $stmt = $db->prepare("DELETE FROM supplier WHERE id=?");
   $stmt->bindParam(1, $_POST['id']);
   $stmt->execute();
   ?>

4. Pembangunan bahagian hadapan

#🎜🎜 dalam #Create a supply projek Vue.js Komponen pengurusan pembekal dinamakan SupplierManagement.vue.
2. Dalam komponen ini, gunakan axios untuk menghantar permintaan untuk mendapatkan senarai pembekal, dan simpan data dalam pembekal berubah-ubah.

   Kod sampel adalah seperti berikut:
   

   <template>
     <div>
       <table>
         <tr v-for="supplier in suppliers" :key="supplier.id">
           <td>{{ supplier.name }}</td>
           <td>{{ supplier.contact }}</td>
           <td>{{ supplier.phone }}</td>
         </tr>
       </table>
     </div>
   </template>
   
   <script>
   import axios from 'axios';
   
   export default {
     data() {
       return {
         suppliers: []
       };
     },
     mounted() {
       axios.get('supplier.php').then(response => {
         this.suppliers = response.data;
       });
     }
   };
   </script>

3. Tambahkan fungsi menambah, menyunting dan memadam pembekal dalam komponen. Menghantar permintaan POST melalui axios menghantar data yang sepadan kepada supplier.php.

   Kod sampel adalah seperti berikut:
   

   <template>
     <div>
       <!-- 添加供应商 -->
       <input type="text" v-model="name" placeholder="供应商名称">
       <input type="text" v-model="contact" placeholder="联系人">
       <input type="text" v-model="phone" placeholder="联系电话">
       <button @click="addSupplier">添加供应商</button>
       <!-- 编辑供应商 -->
       <input type="text" v-model="editName" placeholder="供应商名称">
       <input type="text" v-model="editContact" placeholder="联系人">
       <input type="text" v-model="editPhone" placeholder="联系电话">
       <button @click="editSupplier">编辑供应商</button>
       <!-- 删除供应商 -->
       <input type="text" v-model="deleteId" placeholder="供应商ID">
       <button @click="deleteSupplier">删除供应商</button>
       <!-- 展示供应商列表 -->
       <table>
         <tr v-for="supplier in suppliers" :key="supplier.id">
           <td>{{ supplier.name }}</td>
           <td>{{ supplier.contact }}</td>
           <td>{{ supplier.phone }}</td>
         </tr>
       </table>
     </div>
   </template>
   
   <script>
   import axios from 'axios';
   
   export default {
     data() {
       return {
         name: '',
         contact: '',
         phone: '',
         editName: '',
         editContact: '',
         editPhone: '',
         deleteId: '',
         suppliers: []
       };
     },
     mounted() {
       this.getSuppliers();
     },
     methods: {
       getSuppliers() {
         axios.get('supplier.php').then(response => {
           this.suppliers = response.data;
         });
       },
       addSupplier() {
         axios.post('supplier.php', {
           name: this.name,
           contact: this.contact,
           phone: this.phone
         }).then(response => {
           this.getSuppliers();
         });
       },
       editSupplier() {
         axios.post('supplier.php', {
           id: this.editId,
           name: this.editName,
           contact: this.editContact,
           phone: this.editPhone
         }).then(response => {
           this.getSuppliers();
         });
       },
       deleteSupplier() {
         axios.post('supplier.php', {
           id: this.deleteId
         }).then(response => {
           this.getSuppliers();
         });
       }
     }
   };
   </script>

   Di atas adalah contoh kod khusus untuk menggunakan PHP dan Vue untuk membangunkan fungsi pengurusan pembekal pengurusan gudang. Melalui kod sampel ini, kami boleh melaksanakan fungsi seperti menambah, mengedit, memadam dan menyoal pembekal, dan meningkatkan kecekapan dan ketepatan pengurusan gudang. Sudah tentu, ini hanyalah contoh mudah, dan beberapa fungsi dan penambahbaikan mungkin perlu ditambah dalam pembangunan sebenar. Harap artikel ini membantu anda!

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