Rumah  >  Artikel  >  pembangunan bahagian belakang  >  PHP dan Vue: Bagaimana untuk mendapatkan mata ahli selepas pembayaran

PHP dan Vue: Bagaimana untuk mendapatkan mata ahli selepas pembayaran

PHPz
PHPzasal
2023-09-24 12:15:21863semak imbas

PHP dan Vue: Bagaimana untuk mendapatkan mata ahli selepas pembayaran

PHP dan Vue: Bagaimana untuk mendapatkan mata ahli selepas pembayaran

Dalam platform e-dagang, untuk menarik pengguna menyertai membeli-belah, ramai peniaga akan menyediakan sistem mata supaya pengguna boleh mendapatkan mata tertentu semasa proses membeli-belah dan mengumpul Anda kemudian boleh menebus diskaun atau hadiah yang sepadan. Bagi ahli, mata boleh mencerminkan kesetiaan dan kuasa berbelanja mereka. Artikel ini akan memperkenalkan cara menggunakan PHP dan Vue untuk melaksanakan fungsi menambah mata yang sepadan secara automatik pada akaun ahli selepas pembayaran berjaya.

  1. Reka bentuk pangkalan data

Pertama, kita perlu mereka bentuk pangkalan data untuk menyimpan maklumat ahli dan rekod mata. Katakan kita mempunyai dua jadual: ahli (jadual keahlian) dan mata (jadual rekod mata). Struktur jadual

members boleh seperti berikut:

CREATE TABLE members (
  id INT PRIMARY KEY AUTO_INCREMENT,
  name VARCHAR(50),
  email VARCHAR(100),
  points INT DEFAULT 0
);

Struktur jadual mata boleh seperti berikut:

CREATE TABLE points (
  id INT PRIMARY KEY AUTO_INCREMENT,
  member_id INT,
  points INT,
  created_at DATETIME,
  FOREIGN KEY (member_id) REFERENCES members(id)
);
  1. Pelaksanaan belakang

Seterusnya, kita perlu menulis kod PHP untuk mengendalikan logik perniagaan selepas pembayaran berjaya. Katakan antara muka bahagian belakang kami ialah /api/payment/success, kami boleh melaksanakannya melalui kod berikut:

<?php
// 引入数据库连接文件
require_once 'db_connection.php';

// 获取前端传递的会员ID和支付金额
$memberId = $_POST['memberId'];
$paymentAmount = $_POST['paymentAmount'];

// 根据会员ID查询会员信息
$query = "SELECT * FROM members WHERE id = $memberId";
$result = $conn->query($query);
$member = $result->fetch_assoc();

// 计算积分并更新会员积分
$points = $paymentAmount * 0.1; // 假设每消费1元获得10积分
$newPoints = $member['points'] + $points;
$query = "UPDATE members SET points = $newPoints WHERE id = $memberId";
$conn->query($query);

// 添加积分记录
$query = "INSERT INTO points (member_id, points, created_at) VALUES ($memberId, $points, NOW())";
$conn->query($query);

// 返回更新后的会员积分信息
$query = "SELECT * FROM members WHERE id = $memberId";
$result = $conn->query($query);
$updatedMember = $result->fetch_assoc();

// 返回更新后的会员积分信息给前端
echo json_encode($updatedMember);

// 关闭数据库连接
$conn->close();
?>
  1. Pelaksanaan bahagian hadapan

Gunakan rangka kerja Vue di bahagian hadapan untuk mengendalikan logik mendapatkan mata ahli selepas pembayaran berjaya. Pertama, kita perlu menyediakan butang yang mencetuskan operasi pembayaran apabila pengguna mengklik butang tersebut. Selepas pembayaran berjaya, kami perlu menghantar permintaan ke bahagian belakang untuk mengemas kini mata ahli dan memaparkan mata yang dikemas kini.

<template>
  <div>
    <button @click="pay">支付</button>
    <div v-if="showPoints">
      <p>会员积分:{{ member.points }}</p>
      <p>获得积分:{{ addedPoints }}</p>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      member: {},
      addedPoints: 0,
      showPoints: false
    };
  },
  methods: {
    pay() {
      // 发送支付请求,支付成功后调用接口更新会员积分
      // 假设调用后端接口的方法为paymentSuccess
      this.paymentSuccess()
        .then(response => {
          // 更新会员积分和获得积分信息
          this.member = response.data;
          this.addedPoints = response.data.points - this.member.points;
          this.showPoints = true;
        })
        .catch(error => {
          console.log(error);
        });
    },
    paymentSuccess() {
      return new Promise((resolve, reject) => {
        // 这里假设使用axios来发送请求
        axios.post('/api/payment/success', {
          memberId: 1, // 替换为实际会员ID
          paymentAmount: 100 // 替换为实际支付金额
        })
        .then(response => {
          resolve(response);
        })
        .catch(error => {
          reject(error);
        });
      });
    }
  }
};
</script>

Di atas adalah kaedah untuk mendapatkan mata ahli selepas pembayaran berjaya melalui PHP dan Vue Melalui antara muka belakang dan interaksi hadapan, penambahan dan paparan mata ahli secara automatik selesai. Contoh kod khusus boleh diubah suai dan dioptimumkan mengikut keadaan sebenar. Harap artikel ini membantu anda!

Atas ialah kandungan terperinci PHP dan Vue: Bagaimana untuk mendapatkan mata ahli selepas pembayaran. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn