Home >Backend Development >PHP Tutorial >Use PHP and Vue to develop usage records of membership points after payment
Use PHP and Vue to develop usage records of membership points after payment
- WBOYOriginal
- 2023-09-25 12:05:151021browse
Title: PHP and Vue develop usage record of member points after payment
Introduction:
In modern e-commerce and service industries, points have become an attraction and one of the important ways to retain users. In order to better manage points usage records, we can develop a fully functional member points usage record system through PHP and Vue.
- Database Design
First, we need to design a database to store member information and points usage records. The following is a simple example:
-
Member table (members)
- id (primary key)
- name (member name )
- email (member email)
- points (points balance)
-
Points usage record table (points_records)
- id (primary key)
- member_id (member ID, foreign key associated member table)
- points (points used)
- create_time (use record creation time)
- Back-end development (PHP)
We can use PHP as the back-end development language to handle requests and database operations. The following is a simple PHP code example:
- Query member information
<?php
// 连接数据库
$mysqli = new mysqli("localhost", "username", "password", "database");
// 检查连接是否成功
if ($mysqli->connect_error) {
die("连接数据库失败: " . $mysqli->connect_error);
}
// 查询会员信息
$sql = "SELECT * FROM members WHERE id = ? LIMIT 1";
$stmt = $mysqli->prepare($sql);
$stmt->bind_param("i", $memberId);
$stmt->execute();
$result = $stmt->get_result();
// 处理查询结果
$member = $result->fetch_assoc();
// 关闭数据库连接
$stmt->close();
$mysqli->close();
// 返回会员信息
echo json_encode($member);
?>- Add points usage record
<?php
// 连接数据库
$mysqli = new mysqli("localhost", "username", "password", "database");
// 检查连接是否成功
if ($mysqli->connect_error) {
die("连接数据库失败: " . $mysqli->connect_error);
}
// 新增积分使用记录
$sql = "INSERT INTO points_records (member_id, points, create_time) VALUES (?, ?, ?)";
$stmt = $mysqli->prepare($sql);
$stmt->bind_param("iis", $memberId, $points, $createTime);
$stmt->execute();
// 关闭数据库连接
$stmt->close();
$mysqli->close();
// 返回成功信息
echo json_encode(["message" => "新增积分使用记录成功"]);
?>- Front-end development (Vue)
In order to display points usage records and provide an interface for user operations, we can use Vue to develop a simple front-end interface. The following is a sample code:
<!DOCTYPE html>
<html>
<head>
<title>会员积分使用记录</title>
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
</head>
<body>
<div id="app">
<h1>会员积分使用记录</h1>
<div v-if="!loading">
<p>会员姓名：{{ member.name }}</p>
<p>会员邮箱：{{ member.email }}</p>
<p>积分余额：{{ member.points }}</p>
<hr>
<h2>积分使用记录</h2>
<ul>
<li v-for="record in records">
<p>使用积分：{{ record.points }}</p>
<p>使用时间：{{ record.create_time }}</p>
</li>
</ul>
</div>
<div v-else>
<p>正在加载中...</p>
</div>
</div>
<script>
new Vue({
el: "#app",
data: {
member: {},
records: [],
loading: true
},
mounted() {
// 发送请求获取会员信息和积分使用记录
axios.get("api/getMember.php?id=1")
.then(response => {
this.member = response.data;
this.loading = false;
})
.catch(error => {
console.error(error);
});
}
});
</script>
</body>
</html>The above is a simple PHP and Vue development example of a member points usage recording system, which we can expand and optimize according to actual needs. Through such a system, we can easily manage and view members' points usage, provide a better user experience and promote user participation. Of course, implementing a complete membership points system also requires consideration of more functions and security issues, which requires further development and design based on specific business needs.
The above is the detailed content of Use PHP and Vue to develop usage records of membership points after payment. For more information, please follow other related articles on the PHP Chinese website!