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

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

Kata Pengantar: Dengan perkembangan pesat e-dagang, pengurusan gudang telah menjadi Satu pautan penting. Antaranya, pengurusan pulangan merupakan fungsi penting yang memerlukan pemprosesan dan pengurusan yang cekap dengan bantuan cara teknikal. Artikel ini akan memperkenalkan cara menggunakan PHP dan Vue untuk membangunkan fungsi pengurusan pemulangan pengurusan gudang, dan menyediakan contoh kod khusus.

1. Analisis keperluan

Sebelum meneruskan pembangunan, kita mesti menjelaskan dahulu keperluan pengurusan pulangan. Berdasarkan senario biasa, kami boleh menentukan keperluan seperti berikut:

1 Log masuk pentadbir: Pentadbir log masuk ke sistem melalui nama pengguna dan kata laluan, dan memasuki halaman pengurusan pemulangan.
2. Paparan senarai produk: Pentadbir boleh melihat semua produk yang dipulangkan pada halaman, termasuk nama produk, kuantiti pemulangan, sebab pemulangan dan maklumat lain.
3 Tambah pemulangan: Pentadbir boleh menambah rekod pemulangan baharu melalui borang pada halaman, dan nyatakan barang yang dipulangkan, kuantiti pemulangan, sebab pemulangan dan maklumat lain.
4 Edit pemulangan: Pentadbir boleh mengedit rekod pemulangan sedia ada, termasuk mengubah suai maklumat seperti kuantiti pemulangan dan sebab pemulangan.
5. Padamkan pulangan: Pentadbir boleh memadamkan rekod pulangan sedia ada.
6. Fungsi pertanyaan: Pentadbir boleh menanyakan rekod pulangan tertentu melalui kata kunci.

2. Pemilihan Teknologi

Berdasarkan analisis permintaan, kita boleh memilih untuk menggunakan PHP dan Vue untuk pembangunan. PHP digunakan sebagai bahasa bahagian belakang untuk memproses data dan logik perniagaan Vue digunakan sebagai rangka kerja bahagian hadapan untuk membina antara muka pengguna dan fungsi interaktif.

3. Reka bentuk pangkalan data

Untuk menyimpan dan mengurus rekod pemulangan, kita perlu mereka bentuk jadual pangkalan data yang sepadan. Berdasarkan analisis permintaan, kami boleh mereka bentuk jadual bernama "pulangan", yang mengandungi medan berikut:

• id: kunci utama kenaikan automatik, digunakan untuk mengenal pasti setiap rekod pemulangan secara unik.
• nama: nama produk.
• kuantiti: Pulangan kuantiti.
• alasan: Sebab pulangan.

4. Pembangunan bahagian belakang (PHP)

1 Sambungan dan konfigurasi pangkalan data:

Pertama sekali, kami perlukan. untuk melakukannya dalam PHP Sediakan sambungan pangkalan data dan konfigurasi yang berkaitan. Sebelum menyambung ke pangkalan data, anda perlu memastikan PHP dan MySQL telah dipasang dengan betul, dan menulis semula konfigurasi sambungan pangkalan data yang sepadan.

<?php
// 数据库连接配置
$host = "localhost";
$username = "root";
$password = "password";
$dbname = "database_name";

// 连接到数据库
$conn = new mysqli($host, $username, $password, $dbname);
if ($conn->connect_error) {
    die("连接失败: " . $conn->connect_error);
}
?>

2. Rekod pemulangan pertanyaan:

Seterusnya, kita perlu menulis kod untuk menyoal rekod pemulangan dan mengembalikan hasil yang sepadan.

<?php
// 查询退货记录
$sql = "SELECT * FROM returns";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
    // 输出每一条退货记录
    while($row = $result->fetch_assoc()) {
        echo "商品名称: " . $row["name"]. " - 退货数量: " . $row["quantity"]. " - 退货原因: " . $row["reason"]. "<br>";
    }
} else {
    echo "没有退货记录";
}
$conn->close();
?>

3. Tambah rekod pemulangan:

Seterusnya, kita perlu menulis kod untuk menambah rekod pemulangan.

<?php
// 获取表单数据
$name = $_POST["name"];
$quantity = $_POST["quantity"];
$reason = $_POST["reason"];

// 插入退货记录
$sql = "INSERT INTO returns (name, quantity, reason) VALUES ('$name', '$quantity', '$reason')";
if ($conn->query($sql) === TRUE) {
    echo "退货记录添加成功";
} else {
    echo "退货记录添加失败: " . $conn->error;
}
$conn->close();
?>

4 Edit rekod pemulangan dan padam rekod pemulangan:

Untuk melaksanakan fungsi menyunting dan memadam rekod pemulangan, kami perlu menambah butang operasi yang sepadan untuk setiap pemulangan rekod.

<?php
// 查询退货记录
$sql = "SELECT * FROM returns";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
    // 输出每一条退货记录
    while($row = $result->fetch_assoc()) {
        echo "商品名称: " . $row["name"]. " - 退货数量: " . $row["quantity"]. " - 退货原因: " . $row["reason"]. "<br>";
        echo "<a href='edit.php?id=".$row["id"]."'>编辑</a> ";
        echo "<a href='delete.php?id=".$row["id"]."'>删除</a>";
    }
} else {
    echo "没有退货记录";
}
$conn->close();
?>

5. Pembangunan bahagian hadapan (Vue)

Untuk membina antara muka pengguna dan fungsi interaktif, kita perlu menggunakan Vue untuk pembangunan bahagian hadapan.

1 Cipta contoh Vue:

Pertama, kami perlu memperkenalkan CDN Vue dan kod yang sepadan ke dalam halaman HTML.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>仓库管理的退货管理功能</title>
    <!-- 引用Vue的CDN -->
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
    <div id="app">
        <!-- Vue代码 -->
    </div>
</body>
</html>

Kemudian, kita perlu menentukan data dan kaedah yang berkaitan dalam contoh Vue.

new Vue({
    el: "#app",
    data: {
        returns: []
    },
    mounted: function () {
        this.getReturns();
    },
    methods: {
        getReturns: function () {
            // 使用axios发送GET请求，获取退货记录
            axios.get("get_returns.php")
                .then(response => {
                    this.returns = response.data;
                })
                .catch(error => {
                    console.log(error);
                });
        },
        addReturn: function () {
            // 使用axios发送POST请求，添加退货记录
            axios.post("add_return.php", {
                name: this.name,
                quantity: this.quantity,
                reason: this.reason
            })
                .then(response => {
                    console.log(response.data);
                    this.getReturns();
                })
                .catch(error => {
                    console.log(error);
                });
        },
        editReturn: function (id) {
            // 编辑退货记录
            // ...
        },
        deleteReturn: function (id) {
            // 删除退货记录
            // ...
        }
    }
});

2. Reka letak dan interaksi halaman:

Seterusnya, kita perlu menulis kod HTML yang sepadan dalam contoh Vue untuk memaparkan dan mengendalikan rekod pemulangan.

<div id="app">
    <h1 id="仓库管理的退货管理功能">仓库管理的退货管理功能</h1>

    <!-- 添加退货记录的表单 -->
    <h3 id="添加退货记录">添加退货记录</h3>
    <form @submit.prevent="addReturn">
        <label>商品名称:</label>
        <input type="text" v-model="name" required>
        <br><br>
        <label>退货数量:</label>
        <input type="number" v-model="quantity" required>
        <br><br>
        <label>退货原因:</label>
        <input type="text" v-model="reason" required>
        <br><br>
        <button type="submit">提交</button>
    </form>

    <!-- 退货记录列表 -->
    <h3 id="退货记录">退货记录</h3>
    <ul>
        <li v-for="return in returns">
            <span>商品名称: {{ return.name }}</span>
            <span>退货数量: {{ return.quantity }}</span>
            <span>退货原因: {{ return.reason }}</span>
            <button @click="editReturn(return.id)">编辑</button>
            <button @click="deleteReturn(return.id)">删除</button>
        </li>
    </ul>
</div>

6. Ringkasan

Melalui langkah pembangunan di atas, kami berjaya membangunkan fungsi pengurusan pemulangan pengurusan gudang menggunakan PHP dan Vue. Pentadbir boleh log masuk ke sistem untuk melihat rekod pulangan, menambah pulangan, mengedit pulangan, memadam pulangan dan operasi lain. Dengan cara ini, ia boleh membantu pengurus gudang mengendalikan pulangan dengan cekap dan meningkatkan kecekapan kerja. Pada masa yang sama, artikel ini juga menyediakan contoh kod khusus untuk memudahkan perkembangan dan pembelajaran sebenar pembaca.

Secara amnya, dalam pembangunan sebenar, pilihan yang munasabah perlu dibuat berdasarkan keperluan perniagaan tertentu dan susunan teknologi, dan pengoptimuman dan pelarasan yang sesuai mesti dibuat. Hanya dengan pembelajaran dan amalan berterusan kita boleh mengatasi pelbagai keperluan pembangunan yang kompleks dengan lebih baik dan meningkatkan tahap teknikal dan kecekapan pembangunan.

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