如何用PHP和Vue開發(fā)倉(cāng)庫(kù)管理的價(jià)格管理功能
在現(xiàn)代物流倉(cāng)儲(chǔ)管理中，價(jià)格管理是一項(xiàng)至關(guān)重要的功能。它可以幫助倉(cāng)庫(kù)管理員和物流人員準(zhǔn)確管理庫(kù)存物品的定價(jià)信息，以便對(duì)貨物進(jìn)行合理定價(jià)和利潤(rùn)控制。本文將介紹如何使用PHP和Vue開發(fā)倉(cāng)庫(kù)管理系統(tǒng)中的價(jià)格管理功能，并提供具體的代碼示例。
一、準(zhǔn)備工作
在開始之前，確保你已經(jīng)安裝了PHP和Vue的開發(fā)環(huán)境。你可以使用任何喜歡的代碼編輯器來編寫代碼。
二、創(chuàng)建數(shù)據(jù)庫(kù)表
首先，我們需要?jiǎng)?chuàng)建一個(gè)數(shù)據(jù)庫(kù)表來存儲(chǔ)價(jià)格信息。假設(shè)我們的表名為prices，包含以下字段：
id：價(jià)格記錄的唯一標(biāo)識(shí)符，自增類型product_name：產(chǎn)品名稱，字符串類型price：價(jià)格，浮點(diǎn)數(shù)類型created_at：記錄創(chuàng)建時(shí)間，日期時(shí)間類型updated_at：記錄更新時(shí)間，日期時(shí)間類型
你可以使用以下SQL語(yǔ)句創(chuàng)建數(shù)據(jù)庫(kù)表：
CREATE TABLE `prices` ( `id` INT(11) UNSIGNED NOT NULL AUTO_INCREMENT, `product_name` VARCHAR(255) NOT NULL, `price` FLOAT NOT NULL, `created_at` TIMESTAMP DEFAULT CURRENT_TIMESTAMP, `updated_at` TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP, PRIMARY KEY (`id`) ) ENGINE=INNODB;
登錄后復(fù)制
三、編寫后端接口
接下來，我們需要使用PHP編寫后端接口來處理價(jià)格管理功能。創(chuàng)建一個(gè)PHP文件price.php，添加以下代碼：
<?php
header('Content-Type: application/json');
// 連接數(shù)據(jù)庫(kù)
$servername = "localhost";
$username = "root";
$password = "password";
$dbname = "your_database_name";
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
// 獲取所有價(jià)格記錄
if ($_SERVER['REQUEST_METHOD'] === 'GET') {
$sql = "SELECT * FROM `prices`";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
$prices = [];
while ($row = $result->fetch_assoc()) {
$prices[] = $row;
}
echo json_encode($prices);
} else {
echo "[]";
}
}
// 添加價(jià)格記錄
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
$product_name = $_POST['product_name'];
$price = $_POST['price'];
$sql = "INSERT INTO `prices` (`product_name`, `price`) VALUES ('$product_name', '$price')";
if ($conn->query($sql) === TRUE) {
echo "Price record created successfully";
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
}
// 更新價(jià)格記錄
if ($_SERVER['REQUEST_METHOD'] === 'PUT') {
parse_str(file_get_contents("php://input"), $put_vars);
$id = $put_vars['id'];
$product_name = $put_vars['product_name'];
$price = $put_vars['price'];
$sql = "UPDATE `prices` SET `product_name`='$product_name', `price`='$price', `updated_at`=CURRENT_TIMESTAMP WHERE `id`='$id'";
if ($conn->query($sql) === TRUE) {
echo "Price record updated successfully";
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
}
// 刪除價(jià)格記錄
if ($_SERVER['REQUEST_METHOD'] === 'DELETE') {
parse_str(file_get_contents("php://input"), $delete_vars);
$id = $delete_vars['id'];
$sql = "DELETE FROM `prices` WHERE `id`='$id'";
if ($conn->query($sql) === TRUE) {
echo "Price record deleted successfully";
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
}
$conn->close();
?>
登錄后復(fù)制
確保將your_database_name替換為你的數(shù)據(jù)庫(kù)名，并根據(jù)需要修改數(shù)據(jù)庫(kù)連接信息。
四、編寫前端頁(yè)面
我們將使用Vue來編寫前端頁(yè)面。創(chuàng)建一個(gè)HTML文件index.html，添加以下代碼：
<!DOCTYPE html>
<html>
<head>
<title>價(jià)格管理</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</head>
<body>
<div id="app">
<h1>價(jià)格管理</h1>
<form @submit.prevent="addPrice">
<input type="text" placeholder="產(chǎn)品名稱" v-model="newPrice.product_name" required>
<input type="number" step="0.01" placeholder="價(jià)格" v-model="newPrice.price" required>
<button type="submit">添加</button>
</form>
<table>
<thead>
<tr>
<th>產(chǎn)品名稱</th>
<th>價(jià)格</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr v-for="price in prices" :key="price.id">
<td>{{ price.product_name }}</td>
<td>{{ price.price }}</td>
<td>
<button @click="editPrice(price)">編輯</button>
<button @click="deletePrice(price)">刪除</button>
</td>
</tr>
</tbody>
</table>
</div>
<script>
new Vue({
el: '#app',
data: {
prices: [],
newPrice: {
product_name: '',
price: ''
},
editPrice: {
id: '',
product_name: '',
price: ''
}
},
created: function() {
this.getPrices();
},
methods: {
getPrices: function() {
axios.get('price.php')
.then(function(response) {
this.prices = response.data;
}.bind(this))
.catch(function(error) {
console.log(error);
});
},
addPrice: function() {
axios.post('price.php', this.newPrice)
.then(function(response) {
console.log(response.data);
this.getPrices();
this.newPrice.product_name = '';
this.newPrice.price = '';
}.bind(this))
.catch(function(error) {
console.log(error);
});
},
editPrice: function(price) {
this.editPrice.id = price.id;
this.editPrice.product_name = price.product_name;
this.editPrice.price = price.price;
},
updatePrice: function() {
axios.put('price.php', this.editPrice)
.then(function(response) {
console.log(response.data);
this.getPrices();
this.editPrice.id = '';
this.editPrice.product_name = '';
this.editPrice.price = '';
}.bind(this))
.catch(function(error) {
console.log(error);
});
},
deletePrice: function(price) {
axios.delete('price.php', { data: price })
.then(function(response) {
console.log(response.data);
this.getPrices();
}.bind(this))
.catch(function(error) {
console.log(error);
});
}
}
});
</script>
</body>
</html>
登錄后復(fù)制
五、運(yùn)行項(xiàng)目
將price.php和index.html文件放入你的服務(wù)器的網(wǎng)站目錄中，并啟動(dòng)服務(wù)器。然后打開瀏覽器訪問index.html，你將看到一個(gè)簡(jiǎn)單的價(jià)格管理頁(yè)面。
在頁(yè)面上，你可以輸入產(chǎn)品名稱和價(jià)格，點(diǎn)擊添加按鈕來添加新的價(jià)格記錄。點(diǎn)擊編輯按鈕可以修改價(jià)格記錄的信息。點(diǎn)擊刪除按鈕可以刪除價(jià)格記錄。
六、總結(jié)
在這篇文章中，我們使用PHP和Vue開發(fā)了一個(gè)簡(jiǎn)單的倉(cāng)庫(kù)管理系統(tǒng)中的價(jià)格管理功能。通過這個(gè)功能，倉(cāng)庫(kù)管理員可以方便地管理產(chǎn)品的定價(jià)信息，并實(shí)現(xiàn)合理定價(jià)和利潤(rùn)控制。通過對(duì)后端接口和前端頁(yè)面的編寫，我們展示了如何使用PHP和Vue來實(shí)現(xiàn)這個(gè)功能，并提供了詳細(xì)的代碼示例。希望這篇文章對(duì)你有幫助！
以上就是如何用PHP和Vue開發(fā)倉(cāng)庫(kù)管理的價(jià)格管理功能的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注www.92cms.cn其它相關(guān)文章！
